@charset "UTF-8";
/* =========================================================
   訪問看護ステーションふらわー — stylesheet v2
   方向性: 上品・洗練の医療ブランド / 濃紺アンカー＋白基調＋澄んだ青(主役)＋ピンク(点)
   書体: Zen Old Mincho(見出し・ディスプレイ) × Zen Kaku Gothic New(本文・UI) / やわらかいグラデのヒーロー
   ========================================================= */

/* ---------- Design tokens ---------- */
:root{
  /* anchor / base */
  --c-navy:#0f2942;        /* アンカー：見出し・要所・ダーク面 */
  --c-navy-2:#16385a;
  --c-ink:#2c3a48;         /* 本文（黒に寄せすぎないダークスレート） */
  --c-ink-sub:#5d7185;     /* 補助文 */
  --c-white:#ffffff;
  --c-paper:#faf5ee;       /* 温かいクリーム：交互セクション（あたたか・人間味） */
  --c-paper-2:#f6efe6;     /* もう一段濃いクリーム */
  /* accent */
  --c-blue:#2585cf;        /* 澄んだ青：主役差し色（リンク・アクセント） */
  --c-blue-deep:#1a6098;   /* 濃い青：hover/重要 */
  --c-blue-soft:#e6f0f9;   /* 淡青：チップ・面（控えめ） */
  --c-pink:#e8688f;        /* 温かいコーラルピンク：点アクセント */
  --c-pink-deep:#cf477a;
  --c-pink-soft:#fce6ee;
  --c-line:#e9e2d7;        /* 罫線（クリームになじむ温かいグレー） */
  --c-line-strong:#d8cebf;
  --c-ok:#2e9e6b; --c-err:#d64545;

  /* fonts（やわらかく上品なZenファミリーで統一：丸ゴシックは避け幼稚さを出さない） */
  --font-disp:"Zen Old Mincho","Shippori Mincho","Noto Serif JP",serif;  /* 温かみのある明朝＝ディスプレイ */
  --font-head:"Zen Kaku Gothic New","Noto Sans JP",sans-serif;            /* やわらかいヒューマニストゴシック */
  --font-body:"Zen Kaku Gothic New","Noto Sans JP",sans-serif;

  --fs-xs:0.78rem; --fs-sm:0.9rem; --fs-base:1rem; --fs-md:1.2rem;
  --fs-lg:1.5rem; --fs-xl:1.95rem; --fs-2xl:2.6rem; --fs-3xl:3.4rem;
  --lh-body:1.85; --lh-head:1.5; --lh-disp:1.4;

  /* spacing (8px grid) */
  --sp-1:4px; --sp-2:8px; --sp-3:12px; --sp-4:16px; --sp-5:24px;
  --sp-6:32px; --sp-7:48px; --sp-8:64px; --sp-9:96px; --sp-10:128px;
  --maxw:1160px; --maxw-narrow:780px;
  --section-y:clamp(72px,11vw,128px);
  --header-h:76px;

  /* radius / shadow（角丸やや大きめ＝あたたかさ／影は温かいトーン） */
  --r-sm:10px; --r-md:18px; --r-lg:26px; --r-circle:50%;
  --sh-1:0 2px 6px rgba(70,52,30,.06),0 8px 22px rgba(70,52,30,.06);
  --sh-2:0 14px 38px rgba(70,52,30,.10);
  --sh-3:0 26px 64px rgba(70,52,30,.14);
}

/* ---------- Reset ---------- */
*,*::before,*::after{box-sizing:border-box;}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%;}
body{
  margin:0;font-family:var(--font-body);color:var(--c-ink);background:var(--c-white);
  line-height:var(--lh-body);font-size:var(--fs-base);letter-spacing:.02em;
  -webkit-font-smoothing:antialiased;overflow-x:hidden;
}
img{max-width:100%;height:auto;display:block;}
a{color:var(--c-blue-deep);text-decoration:none;text-underline-offset:3px;transition:color .2s ease;}
a:hover{color:var(--c-navy);}
h1,h2,h3,h4{margin:0;line-height:var(--lh-head);font-weight:700;color:var(--c-navy);}
p{margin:0 0 1em;text-wrap:pretty;}
ul{margin:0;padding:0;list-style:none;}
button{font-family:inherit;cursor:pointer;border:none;background:none;}
:focus-visible{outline:2px solid var(--c-blue);outline-offset:3px;border-radius:3px;}

/* ---------- Layout helpers ---------- */
.wrap{width:min(100% - 2 * var(--sp-5),var(--maxw));margin-inline:auto;}
.wrap-narrow{width:min(100% - 2 * var(--sp-5),var(--maxw-narrow));margin-inline:auto;}
.section{padding-block:var(--section-y);position:relative;}
.section--paper{background:var(--c-paper);}
.section--navy{background:var(--c-navy);color:#dce6f0;}
.section--navy h2,.section--navy h3{color:#fff;}
.center{text-align:center;}
.lead{font-size:var(--fs-md);color:var(--c-ink-sub);line-height:1.9;}

/* ---------- Display & section head ---------- */
.disp{font-family:var(--font-disp);font-weight:700;line-height:var(--lh-disp);letter-spacing:.02em;}
.eyebrow{
  font-family:var(--font-head);font-weight:700;font-size:var(--fs-xs);
  letter-spacing:.22em;color:var(--c-blue);text-transform:uppercase;
  display:inline-flex;align-items:center;gap:var(--sp-3);margin-bottom:var(--sp-4);
}
.eyebrow::before{content:"";width:28px;height:1.5px;background:var(--c-pink);display:inline-block;}
.eyebrow--pink{color:var(--c-pink-deep);}
.section-head{margin-bottom:var(--sp-8);max-width:760px;}
.section-head.center{margin-inline:auto;}
.section-head .title{
  font-family:var(--font-disp);font-weight:700;
  font-size:clamp(1.7rem,4.4vw,var(--fs-2xl));color:var(--c-navy);letter-spacing:.02em;line-height:1.45;
}
.section--navy .section-head .title{color:#fff;}
.section-head .sub{margin-top:var(--sp-5);color:var(--c-ink-sub);font-size:var(--fs-base);}
.section--navy .section-head .sub{color:#aebfd0;}

/* ---------- Buttons ---------- */
.btn{
  font-family:var(--font-head);font-weight:700;border-radius:var(--r-sm);
  padding:var(--sp-4) var(--sp-6);display:inline-flex;gap:var(--sp-2);align-items:center;justify-content:center;
  font-size:var(--fs-base);line-height:1.3;letter-spacing:.02em;
  transition:transform .2s ease,box-shadow .2s ease,background-color .2s ease,color .2s ease,border-color .2s ease;
}
.btn .ic{width:1.05em;height:1.05em;flex:none;}
.btn-primary{background:var(--c-blue);color:#fff;box-shadow:var(--sh-1);}
.btn-primary:hover{background:var(--c-blue-deep);color:#fff;transform:translateY(-2px);box-shadow:var(--sh-2);}
.btn-primary:active{transform:translateY(0);}
.btn-navy{background:var(--c-navy);color:#fff;}
.btn-navy:hover{background:var(--c-navy-2);color:#fff;transform:translateY(-2px);box-shadow:var(--sh-2);}
.btn-ghost{background:transparent;color:var(--c-navy);border:1.5px solid var(--c-line-strong);}
.btn-ghost:hover{background:var(--c-paper);border-color:var(--c-blue);color:var(--c-blue-deep);}
.btn-white{background:#fff;color:var(--c-navy);}
.btn-white:hover{background:#eef4fb;color:var(--c-navy);transform:translateY(-2px);box-shadow:var(--sh-2);}
.btn-outline-white{background:transparent;color:#fff;border:1.5px solid rgba(255,255,255,.55);}
.btn-outline-white:hover{background:rgba(255,255,255,.12);color:#fff;border-color:#fff;}
.btn-lg{padding:var(--sp-5) var(--sp-7);font-size:var(--fs-md);}

/* ---------- Tel link (refined) ---------- */
.tel{display:inline-flex;align-items:center;gap:var(--sp-3);font-family:var(--font-head);color:var(--c-navy);transition:color .2s ease;}
.tel:hover{color:var(--c-blue-deep);}
.tel .ic-circle{width:42px;height:42px;border-radius:var(--r-circle);border:1.5px solid var(--c-blue);color:var(--c-blue);display:grid;place-items:center;flex:none;transition:background-color .2s ease,color .2s ease;}
.tel:hover .ic-circle{background:var(--c-blue);color:#fff;}
.tel .ic-circle svg{width:19px;height:19px;}
.tel .num{font-size:var(--fs-lg);font-weight:700;letter-spacing:.04em;line-height:1.05;}
.tel .lbl{display:block;font-size:var(--fs-xs);color:var(--c-ink-sub);font-weight:500;letter-spacing:.08em;margin-bottom:2px;}
.tel--onnavy{color:#fff;}
.tel--onnavy .lbl{color:#aebfd0;}
.tel--onnavy .ic-circle{border-color:rgba(255,255,255,.6);color:#fff;}
.tel--onnavy:hover{color:#fff;}
.tel--onnavy:hover .ic-circle{background:#fff;color:var(--c-navy);}

/* ---------- Badge / Notice / Chips ---------- */
.badge{display:inline-flex;align-items:center;gap:var(--sp-2);background:var(--c-pink-soft);color:var(--c-pink-deep);
  font-family:var(--font-head);font-weight:700;font-size:var(--fs-xs);letter-spacing:.08em;
  padding:var(--sp-2) var(--sp-4);border-radius:var(--r-sm);}
.badge--line{background:transparent;border:1px solid rgba(255,255,255,.5);color:#fff;}
.badge--soft{background:linear-gradient(90deg,var(--c-blue-soft),var(--c-pink-soft));
  color:var(--c-blue-deep);border:1px solid rgba(255,255,255,.7);box-shadow:0 2px 10px rgba(37,133,207,.08);}
.notice{background:var(--c-paper);border:1px solid var(--c-line);border-left:3px solid var(--c-blue);
  border-radius:var(--r-sm);padding:var(--sp-4) var(--sp-5);color:var(--c-ink-sub);font-size:var(--fs-sm);}
.chips{display:flex;flex-wrap:wrap;gap:var(--sp-3);}
.chip{background:#fff;border:1px solid var(--c-line-strong);color:var(--c-navy);
  border-radius:var(--r-sm);padding:var(--sp-3) var(--sp-4);font-size:var(--fs-sm);font-weight:500;
  display:inline-flex;align-items:center;gap:var(--sp-2);}
.chip svg{width:1.05em;height:1.05em;color:var(--c-blue);flex:none;}
/* スマホ：チップを1カラムで整列（全幅・左揃え） */
@media(max-width:599px){
  .chips{display:grid;grid-template-columns:1fr;gap:var(--sp-2);}
  .chips .chip{width:100%;justify-content:flex-start;}
}

/* ---------- Hairline divider ---------- */
.rule{border:0;border-top:1px solid var(--c-line);margin:var(--sp-7) 0;}

/* =========================================================
   Header
   ========================================================= */
.site-header{position:sticky;top:0;z-index:50;background:rgba(255,255,255,.94);
  backdrop-filter:saturate(1.1) blur(8px);border-bottom:1px solid var(--c-line);
  transition:box-shadow .25s ease;}
.site-header.is-scrolled{box-shadow:0 4px 20px rgba(15,41,66,.07);}

/* 上段：ユーティリティバー（PCのみ表示・薄いブランドグラデ） */
.topbar{display:none;background:linear-gradient(90deg,var(--c-blue-soft) 0%,#ffffff 55%,var(--c-pink-soft) 100%);
  border-bottom:1px solid var(--c-line);}
.topbar-inner{width:min(100% - 2 * var(--sp-4),1240px);margin-inline:auto;height:40px;
  display:flex;align-items:center;justify-content:flex-end;gap:var(--sp-4);}
.topbar a{font-family:var(--font-head);font-size:var(--fs-xs);letter-spacing:.04em;
  display:inline-flex;align-items:center;gap:var(--sp-2);color:var(--c-ink-sub);transition:color .2s ease;}
.top-tel{color:var(--c-navy);font-weight:700;}
.top-tel .num{font-size:var(--fs-sm);letter-spacing:.05em;}
.top-tel .hours{font-weight:500;color:var(--c-ink-sub);padding-left:var(--sp-1);}
.top-tel svg,.top-partner svg{width:15px;height:15px;flex:none;color:var(--c-blue);}
.top-tel:hover,.top-partner:hover{color:var(--c-blue-deep);}
.top-partner{font-weight:700;color:var(--c-navy);}
.top-partner:hover svg{color:var(--c-blue-deep);}
.top-ig svg{width:17px;height:17px;color:var(--c-pink);}
.top-ig:hover svg{color:var(--c-pink-deep);}
.top-sep{width:1px;height:16px;background:var(--c-line-strong);}

.header-inner{display:flex;align-items:center;gap:var(--sp-4);height:var(--header-h);
  width:min(100% - 2 * var(--sp-4),1240px);margin-inline:auto;}
.brand{display:flex;align-items:center;gap:var(--sp-3);margin-right:auto;}
.brand .mark{width:38px;height:38px;flex:none;color:var(--c-blue);}
.brand .mark svg{width:100%;height:100%;}
.brand .mark-image{width:58px;height:46px;}
.brand .mark-image img{width:100%;height:100%;object-fit:contain;}
.brand .name{line-height:1.25;color:var(--c-navy);}
.brand .name b{display:block;font-family:var(--font-disp);font-weight:700;font-size:var(--fs-md);letter-spacing:.04em;}
.brand .name span{display:block;font-size:10px;color:var(--c-ink-sub);letter-spacing:.18em;font-weight:500;}

.nav{display:none;margin-left:auto;}
.nav ul{display:flex;align-items:center;gap:var(--sp-6);}
.nav a{font-family:var(--font-head);font-weight:500;color:var(--c-navy);font-size:var(--fs-sm);
  position:relative;padding-block:var(--sp-2);letter-spacing:.02em;}
.nav a:hover{color:var(--c-blue-deep);}
.nav a::after{content:"";position:absolute;left:0;right:100%;bottom:-3px;height:2px;background:var(--c-blue);
  border-radius:2px;transition:right .25s ease;}
.nav a:hover::after{right:0;}
.nav a[aria-current="page"]{color:var(--c-blue-deep);}
.nav a[aria-current="page"]::after{right:0;}

.header-tools{display:flex;align-items:center;gap:var(--sp-3);margin-left:var(--sp-3);}
.header-cta{display:none;padding:var(--sp-3) var(--sp-5);font-size:var(--fs-sm);}
.ig-link{width:40px;height:40px;border-radius:var(--r-circle);display:grid;place-items:center;
  color:var(--c-navy);border:1.5px solid var(--c-line-strong);transition:transform .2s ease,background-color .2s ease,color .2s ease,border-color .2s ease;}
.ig-link:hover{color:#fff;background:var(--c-pink);border-color:var(--c-pink);transform:translateY(-2px);}
.ig-link svg{width:19px;height:19px;}

.hamburger{width:44px;height:44px;display:grid;place-items:center;color:var(--c-navy);}
.hamburger span{position:relative;width:24px;height:2px;background:currentColor;border-radius:2px;display:block;transition:background .2s;}
.hamburger span::before,.hamburger span::after{content:"";position:absolute;left:0;width:24px;height:2px;background:currentColor;border-radius:2px;transition:transform .25s ease;}
.hamburger span::before{top:-7px;}
.hamburger span::after{top:7px;}
.hamburger[aria-expanded="true"] span{background:transparent;}
.hamburger[aria-expanded="true"] span::before{transform:translateY(7px) rotate(45deg);}
.hamburger[aria-expanded="true"] span::after{transform:translateY(-7px) rotate(-45deg);}

.drawer{position:fixed;inset:var(--header-h) 0 0 0;background:rgba(255,255,255,.99);transform:translateX(100%);
  transition:transform .3s ease;z-index:49;padding:var(--sp-6) var(--sp-5) var(--sp-9);overflow-y:auto;}
.drawer.is-open{transform:translateX(0);}
.drawer ul{display:flex;flex-direction:column;}
.drawer a{display:block;font-family:var(--font-head);font-weight:700;color:var(--c-navy);
  padding:var(--sp-4) var(--sp-3);border-bottom:1px solid var(--c-line);font-size:var(--fs-md);}
.drawer a:hover,.drawer a[aria-current="page"]{color:var(--c-blue-deep);}
.drawer .drawer-cta{margin-top:var(--sp-6);display:flex;flex-direction:column;gap:var(--sp-3);}

@media(min-width:1024px){.topbar{display:block;}.nav{display:block;}.hamburger{display:none;}.header-cta{display:inline-flex;}}

/* =========================================================
   Hero (soft light gradient — 薄青×白×薄ピンク)
   名刺の下部グラデーション（流れる波）をモチーフに
   ========================================================= */
/* ---------- Hero (full-bleed photo) ---------- */
.hero{position:relative;overflow:hidden;isolation:isolate;display:flex;align-items:center;justify-content:center;
  /* ★下部グラデ波までファーストビューに収める。
     ヘッダーは position:sticky でヒーローの上を占有する(実測 スマホ77px / PC118px)。
     そのぶん 100svh から差し引かないと波・SCROLLが画面下にはみ出すため calc(100svh - --hd) を使う。
     isolationで子のz-index(背景0/波1/コピー2/SCROLL3)を独立スタッキングに閉じ後続セクションと干渉させない。 */
  --hd:calc(var(--header-h) + 2px);                 /* スマホ/タブレット:主バーのみ(topbarは1024px未満で非表示) */
  min-height:clamp(480px, calc(100svh - var(--hd)), 920px);}
@media(min-width:1024px){.hero{--hd:calc(var(--header-h) + 44px);}}  /* ≥1024でtopbar(約41px)+境界が加わる */

/* 背景写真：画面いっぱい＋ゆっくりズーム（Ken Burns）※sophiamedi模倣 */
.hero-bg{position:absolute;inset:0;z-index:0;overflow:hidden;}
.hero-bg picture{display:block;width:100%;height:100%;}
/* ★ヒーロー写真はデバイス別に最適トリミング済み（hero-desktop=2000×1290:白衣を波の上に出すため下に余白を確保 / hero-mobile=縦3:4）。
   どちらも看護師の笑顔が中央に来るよう切り出してあるので object-position は中央でよい。 */
.hero-bg img{width:100%;height:100%;object-fit:cover;object-position:center 50%;display:block;
  transform-origin:center 50%;
  /* 実機(sophiamedi)は zoomUp。読み込み時に 1.0→1.12 を12秒で1回だけ拡大し、拡大状態で静止(forwards)。繰り返さない */
  animation:heroZoom 12s ease-out forwards;}
@keyframes heroZoom{from{transform:scale(1.0);}to{transform:scale(1.12);}}
/* アニメ無効設定の人には拡大状態で静止（がたつき防止） */
@media(prefers-reduced-motion:reduce){
  .hero-bg img{animation:none;transform:scale(1.04);}
}

/* 読みやすさ用スクリム：全面navyの二重がけはやめ、明るい印象を優先。
   ①ヘッダー直下だけ薄く影→すぐ透明 ②見出し帯を狙った楕円スクリムのみ。
   写真の周辺（顔・窓・植物）は素の明るさを残す。 */
.hero-scrim{position:absolute;inset:0;
  background:
    linear-gradient(180deg, rgba(15,41,66,.26) 0%, rgba(15,41,66,.10) 20%, rgba(15,41,66,0) 42%),
    radial-gradient(72% 44% at 50% 46%, rgba(15,41,66,.30) 0%, rgba(15,41,66,.12) 52%, rgba(15,41,66,0) 78%);}

/* 中央寄せレイアウト */
.hero-inner{position:relative;z-index:2;text-align:center;
  width:min(100% - 2 * var(--sp-5), 1000px);margin-inline:auto;
  /* ★余白は画面"高さ"(svh)基準。幅(vw)基準だと横長・低い画面で過大になり
     内容+余白>min-height となって波がファーストビュー外へ押し出される（旧24vw＝1366×768で波が約108px下に落ちた）。
     svh基準なら短い画面ほど余白も自動圧縮され、内容+余白≦min-height に収まり波が画面下端に残る。
     下余白は波の不透明部(下端〜約110px)を避けてコピーが重ならない最小量を確保。 */
  padding-block:clamp(80px,12svh,150px) clamp(130px,18svh,220px);color:#fff;}
.hero-copy{display:flex;flex-direction:column;align-items:center;gap:var(--sp-6);}

/* 小見出し（任意） */
.hero-eyebrow{font-family:var(--font-head);font-weight:700;color:#fff;
  font-size:var(--fs-sm);letter-spacing:.22em;text-shadow:0 0 1px rgba(15,41,66,.55),0 1px 2px rgba(15,41,66,.50),0 2px 10px rgba(15,41,66,.38);opacity:1;}

/* 手書きコピー：Klee One（sophiamedi風に大きく。ただし長文なので欲張らない） */
/* ※コピーは「いつもの暮らしの、」(9字) が最長行。サンプルより長いため上限を抑えめにし、
   各行が1行で収まるサイズに調整。改行は .ln（2行固定）で制御し、行内で折り返さない。 */
.hero-handwrite{font-family:"Klee One","Yomogi",var(--font-disp);font-weight:600;color:#fff;
  letter-spacing:.01em;line-height:1.45;
  font-size:clamp(1.9rem, 8vw, 4.6rem);   /* ★長文前提：上限を5.6→4.6remに抑え見切れ回避 */
  text-shadow:0 0 1px rgba(15,41,66,.55), 0 1px 2px rgba(15,41,66,.50), 0 2px 16px rgba(15,41,66,.30);}

/* === 文字が1文字ずつ出るアニメ（sophiamedi模倣） ===
   実機＝見出しSVGの各要素(svg-elem-1,2,3…)を順番に描画して「1文字ずつ現れる」動き・全体2秒弱。
   mockはテキストなので、各文字 .c を --d（登場順）× 0.09秒 ずらして順次フェードイン＝同じ印象を再現。 */
.hero-handwrite .ln{display:block;white-space:nowrap;}   /* 各行は折り返さない＝中途半端な改行を防ぐ */
.hero-handwrite .c{display:inline-block;opacity:0;
  transform:translateY(.18em);
  animation:charIn .5s ease-out forwards;
  animation-delay:calc(var(--d) * .09s + .2s);}          /* 0.2s後から0.09s刻み。16文字目で約1.9秒＝2秒弱 */
@keyframes charIn{from{opacity:0;transform:translateY(.18em);}to{opacity:1;transform:translateY(0);}}

.hero-actions{display:flex;justify-content:center;flex-wrap:wrap;gap:var(--sp-4);margin-top:var(--sp-2);
  opacity:0;animation:heroFadeUp .8s ease-out 2.1s forwards;}  /* 最終文字(約2.14sで完了)が出そろった直後にCTAをふわっと */
@keyframes heroFadeUp{from{opacity:0;transform:translateY(12px);}to{opacity:1;transform:translateY(0);}}

/* ★スマホ/タブレットでは下部固定CTAバーがあるため、ヒーロー中央のCTAは顔に重なり不要 → 非表示。
   PC(≥1024)のみ表示（PCには下部固定バーが無いため必要）。 */
@media(max-width:1023px){.hero-actions{display:none;}}

/* アニメ無効設定の人には最初から全部見せる（順次表示・フェードしない） */
@media(prefers-reduced-motion:reduce){
  .hero-handwrite .c{opacity:1;transform:none;animation:none;}
  .hero-actions{opacity:1;animation:none;}
}

/* ===== 背の低い画面ガード（ノートPC 1366×768 実使用域≒高さ640px・スマホ横） ===== */
/* 幅は足りても"高さ"が足りない画面では、フォントと余白を圧縮して
   手書きコピー＋CTA＋下部波をファーストビューに収める。
   ※幅基準のスマホ最適化(下の max-width)より前に置き、狭い画面では幅側を優先させる。 */
@media (max-height:760px){
  .hero{min-height:clamp(440px, calc(100svh - var(--hd)), 920px);}
  .hero-copy{gap:var(--sp-5);}
  .hero-handwrite{font-size:clamp(1.7rem,7vw,3.4rem);line-height:1.4;}
  .hero-inner{padding-block:clamp(56px,8svh,100px) clamp(110px,14svh,170px);}
}

/* ===== スマホ最適化（長文の見切れ防止が最重要） ===== */
/* 最長行「いつもの暮らしの、」＝9字。9字×フォント幅 が表示幅(画面幅-48px)を超えないこと。
   → 390px端末なら約342pxに収める＝フォント約33px(8.6vw)が上限。10vw超は溢れるので不可。 */
@media(max-width:600px){
  .hero{min-height:clamp(440px, calc(100svh - var(--hd)), 720px);}
  /* 縦余白もsvh基準：アドレスバー開閉や低い端末でも内容+余白≦min-heightで波が残る */
  .hero-inner{padding-block:clamp(64px,12svh,110px) clamp(120px,20svh,170px);}
  .hero-handwrite{font-size:clamp(1.55rem, 8.6vw, 2.5rem);line-height:1.4;letter-spacing:0;}
  .hero-eyebrow{font-size:var(--fs-xs);letter-spacing:.16em;}
}
@media(max-width:360px){
  .hero-handwrite{font-size:8.4vw;}  /* 320〜360px端末でも「いつもの暮らしの、」が1行に収まる */
}

/* ★スマホ/タブレット縦：写真の主役（看護師の顔）が下寄り(y≒53%)にあるため、
   見出しを中央寄せにすると顔と重なる。見出しを上部の余白(壁)へ上寄せし、顔と重ねない。
   モバイル用クロップは全高表示で縦位置をobject-positionで動かせないため、文字側を上げる。
   PC(≥1024)は中央配置のまま維持。 */
@media(max-width:1023px){
  .hero{align-items:flex-start;}
  .hero-inner{padding-block:clamp(40px,9svh,84px) clamp(110px,18svh,160px);}
}

/* 名刺モチーフ：流れる波（薄青→白→薄ピンク） */
.hero-wave{position:absolute;left:0;right:0;bottom:-1px;z-index:1;line-height:0;pointer-events:none;}
.hero-wave svg{width:100%;height:clamp(120px,17vw,230px);display:block;}

.hero-scroll{position:absolute;left:50%;bottom:var(--sp-6);transform:translateX(-50%);z-index:3;color:var(--c-blue);
  font-family:var(--font-head);font-size:10px;letter-spacing:.2em;display:none;flex-direction:column;align-items:center;gap:var(--sp-2);}
@media(min-width:1024px){.hero-scroll{display:flex;}}
.hero-scroll .line{width:1px;height:36px;background:linear-gradient(var(--c-blue),rgba(37,133,207,0));animation:scrollLine 1.8s ease-in-out infinite;}
@keyframes scrollLine{0%,100%{transform:scaleY(.4);transform-origin:top;opacity:.4;}50%{transform:scaleY(1);opacity:1;}}
@media(prefers-reduced-motion:reduce){.hero-decor .blob,.hero-decor .petal,.hero-scroll .line{animation:none;}}

/* =========================================================
   page hero (下層ページ共通の小ヒーロー)
   薄青×白×薄ピンクのやわらかいグラデ＋静止の装飾にじみ。文字は可読な濃紺。
   ※全下層ページ共通の型：この page-hero の直後は白の .section を置く（hairlineで自然に繋ぐ）
   ========================================================= */
.page-hero{position:relative;overflow:hidden;isolation:isolate;
  padding-block:clamp(40px,8vw,72px) clamp(52px,9vw,96px);border-bottom:1px solid var(--c-line);
  background:
    radial-gradient(120% 100% at 8% 0%, #eaf4fd 0%, rgba(234,244,253,0) 56%),
    radial-gradient(110% 92% at 96% 8%, #fdecf2 0%, rgba(253,236,242,0) 54%),
    linear-gradient(165deg,#f3f9ff 0%,#ffffff 50%,#fdf2f6 100%);}
.page-hero .wrap{position:relative;z-index:2;}
.page-hero .eyebrow{color:var(--c-blue-deep);}      /* 白地で4.5以上を確保（blueは不可） */
.page-hero h1{font-family:var(--font-disp);font-weight:700;color:var(--c-navy);
  font-size:clamp(1.7rem,4.6vw,var(--fs-2xl));letter-spacing:.03em;line-height:1.4;}
.page-hero .ph-lead{margin-top:var(--sp-5);color:var(--c-ink-sub);max-width:600px;}
.page-hero .crumbs{margin-top:var(--sp-4);font-size:var(--fs-sm);color:var(--c-ink-sub);
  display:flex;flex-wrap:wrap;gap:var(--sp-2);align-items:center;}
.page-hero .crumbs a{color:var(--c-blue-deep);}
.page-hero .crumbs a:hover{color:var(--c-navy);}
.page-hero .crumbs .sep{color:var(--c-line-strong);}
/* 控えめな装飾にじみ（静止＝reduced-motion安全・装飾なのでaria-hidden） */
.page-hero-decor{position:absolute;inset:0;z-index:0;pointer-events:none;}
.page-hero-decor .blob{position:absolute;border-radius:50%;filter:blur(42px);opacity:.45;}
.page-hero-decor .b-blue{width:clamp(220px,30vw,400px);height:clamp(220px,30vw,400px);
  left:-7%;top:-34%;background:radial-gradient(circle,#cfe6fa 0%,rgba(207,230,250,0) 70%);}
.page-hero-decor .b-pink{width:clamp(200px,26vw,360px);height:clamp(200px,26vw,360px);
  right:-6%;bottom:-44%;background:radial-gradient(circle,#fbd5e2 0%,rgba(251,213,226,0) 70%);}
.page-hero-decor .petal{position:absolute;width:14px;height:14px;border-radius:60% 0 60% 0;
  background:linear-gradient(135deg,#bfe0ff,#fbd5e2);opacity:.5;}
.page-hero-decor .petal-1{right:17%;top:32%;transform:rotate(18deg);}
.page-hero-decor .petal-2{left:11%;bottom:26%;width:10px;height:10px;transform:rotate(-12deg);}

/* =========================================================
   Editorial split & intro
   ========================================================= */
.intro-statement{font-family:var(--font-disp);font-weight:500;font-size:clamp(1.18rem,3vw,1.72rem);
  color:var(--c-navy);line-height:1.8;letter-spacing:.02em;}
.intro-statement .s{display:block;}
/* PCは一行一文（折り返さない）／スマホは自然に折り返す */
@media(min-width:600px){.intro-statement .s{white-space:nowrap;}.intro-statement .s + .s{margin-top:.35em;}}
.intro-statement .accent{color:var(--c-blue-deep);}

.split{display:grid;gap:var(--sp-7);align-items:center;}
@media(min-width:880px){.split{grid-template-columns:1fr 1fr;}.split.reverse>.split-media{order:2;}}
.split-media{position:relative;}
.split-media .photo{aspect-ratio:4/5;border-radius:var(--r-md);overflow:hidden;background:var(--c-navy);box-shadow:var(--sh-2);}
.split-media .photo img{width:100%;height:100%;object-fit:cover;}
.split-media .photo.wide{aspect-ratio:4/3;}
.split-media .tag{position:absolute;left:-12px;bottom:24px;background:#fff;color:var(--c-navy);
  font-family:var(--font-disp);font-weight:700;padding:var(--sp-3) var(--sp-5);border-radius:var(--r-sm);
  box-shadow:var(--sh-2);border-left:3px solid var(--c-pink);font-size:var(--fs-sm);}

/* =========================================================
   Feature list (大切にしていること)
   ========================================================= */
.feature-list{display:grid;gap:var(--sp-5);}
@media(min-width:768px){.feature-list{grid-template-columns:repeat(2,1fr);}}
.feature{display:grid;grid-template-columns:auto 1fr;gap:var(--sp-5);padding:var(--sp-6);background:#fff;border:1px solid var(--c-line);border-radius:var(--r-md);box-shadow:var(--sh-1);}
.feature .num{font-family:var(--font-disp);font-weight:700;color:var(--c-pink);font-size:var(--fs-2xl);line-height:1;}
.feature h3{font-family:var(--font-head);font-size:var(--fs-md);margin-bottom:var(--sp-2);color:var(--c-navy);}
.feature p{margin:0;color:var(--c-ink-sub);font-size:var(--fs-sm);line-height:1.85;}

/* =========================================================
   Service cards (refined editorial)
   ========================================================= */
.grid{display:grid;gap:var(--sp-5);}
@media(min-width:600px){.grid-2{grid-template-columns:repeat(2,1fr);}}
@media(min-width:768px){.grid-3{grid-template-columns:repeat(2,1fr);}}
@media(min-width:1024px){.grid-3{grid-template-columns:repeat(3,1fr);}}

.service-card{background:#fff;border:1px solid var(--c-line);border-radius:var(--r-md);overflow:hidden;
  display:flex;flex-direction:column;transition:transform .28s ease,box-shadow .28s ease,border-color .28s ease;}
.service-card:hover{transform:translateY(-5px);box-shadow:var(--sh-2);border-color:var(--c-blue-soft);}
.service-card .thumb{aspect-ratio:16/10;overflow:hidden;position:relative;
  background:linear-gradient(150deg,#eaf4fd 0%,#ffffff 52%,#fdeef3 100%);}
/* 実写は後日差し替え：今はやさしいプレースホルダ表示 */
.service-card .thumb img{display:none;}
.service-card .thumb::before{content:"";position:absolute;inset:-25%;
  background:radial-gradient(circle at 28% 28%,rgba(191,224,255,.55),transparent 55%),
             radial-gradient(circle at 78% 74%,rgba(251,213,226,.6),transparent 55%);
  transition:transform .6s ease;}
.service-card:hover .thumb::before{transform:scale(1.08) rotate(2deg);}
.service-card .thumb .ic{position:absolute;inset:0;margin:auto;width:60px;height:60px;border-radius:var(--r-circle);
  background:rgba(255,255,255,.92);color:var(--c-blue-deep);display:grid;place-items:center;
  box-shadow:0 8px 20px rgba(37,133,207,.16);transition:transform .3s ease;}
.service-card:hover .thumb .ic{transform:translateY(-3px);}
.service-card .thumb .ic svg{width:27px;height:27px;}
/* 実写入りサムネ：写真を表示し、アイコンは左下のガラスバッジに */
.service-card .thumb--photo img{display:block;width:100%;height:100%;object-fit:cover;transition:transform .6s ease;}
.service-card:hover .thumb--photo img{transform:scale(1.05);}
.service-card .thumb--photo::before{display:none;}
.service-card .thumb--photo .ic{inset:auto auto 12px 12px;margin:0;width:44px;height:44px;}
.service-card .thumb--photo .ic svg{width:21px;height:21px;}
.service-card:hover .thumb--photo .ic{transform:translateY(-2px);}
.service-card .body{padding:var(--sp-5);display:flex;flex-direction:column;gap:var(--sp-3);flex:1;}
.service-card h3{font-family:var(--font-head);font-size:var(--fs-md);color:var(--c-navy);}
.service-card p{color:var(--c-ink-sub);font-size:var(--fs-sm);margin:0;flex:1;line-height:1.8;}
.service-card .more{font-family:var(--font-head);font-weight:700;color:var(--c-blue-deep);font-size:var(--fs-sm);
  display:inline-flex;align-items:center;gap:var(--sp-2);}
.service-card .more svg{width:1em;height:1em;transition:transform .2s ease;}
.service-card:hover .more svg{transform:translateX(4px);}

/* =========================================================
   Flow steps (numbered, mincho numerals)
   ========================================================= */
.flow-steps{display:grid;gap:var(--sp-5);counter-reset:step;}
@media(min-width:900px){.flow-steps{grid-template-columns:repeat(5,1fr);gap:var(--sp-4);}}
.flow-step{position:relative;padding-top:var(--sp-6);}
.flow-step::before{counter-increment:step;content:"0" counter(step);font-family:var(--font-disp);font-weight:700;
  color:var(--c-blue);font-size:var(--fs-xl);display:block;margin-bottom:var(--sp-2);}
.flow-step::after{content:"";position:absolute;top:8px;left:0;width:100%;height:2px;background:var(--c-line);}
.flow-step h3{font-family:var(--font-head);font-size:var(--fs-base);margin-bottom:var(--sp-2);color:var(--c-navy);}
.flow-step p{font-size:var(--fs-sm);color:var(--c-ink-sub);margin:0;line-height:1.8;}

/* =========================================================
   Info table
   ========================================================= */
.info-table{width:100%;border-collapse:collapse;background:#fff;border:1px solid var(--c-line);border-radius:var(--r-md);overflow:hidden;}
.info-table th,.info-table td{text-align:left;padding:var(--sp-4) var(--sp-5);border-bottom:1px solid var(--c-line);vertical-align:top;font-size:var(--fs-sm);}
.info-table th{background:var(--c-paper);color:var(--c-navy);font-family:var(--font-head);font-weight:700;width:32%;white-space:nowrap;}
.info-table tr:last-child th,.info-table tr:last-child td{border-bottom:none;}
@media(max-width:520px){.info-table th{width:38%;white-space:normal;}}

/* =========================================================
   FAQ
   ========================================================= */
.faq{display:flex;flex-direction:column;}
.faq-item{border-bottom:1px solid var(--c-line);}
.faq-q{width:100%;display:flex;align-items:center;gap:var(--sp-4);padding:var(--sp-5) var(--sp-2);text-align:left;
  font-family:var(--font-head);font-weight:700;color:var(--c-navy);font-size:var(--fs-base);}
.faq-q .q-mark{flex:none;font-family:var(--font-disp);color:var(--c-blue);font-size:var(--fs-lg);line-height:1;}
.faq-q .toggle{margin-left:auto;flex:none;width:22px;height:22px;position:relative;}
.faq-q .toggle::before,.faq-q .toggle::after{content:"";position:absolute;background:var(--c-blue);transition:transform .25s ease;}
.faq-q .toggle::before{top:10px;left:1px;width:20px;height:2px;}
.faq-q .toggle::after{top:1px;left:10px;width:2px;height:20px;}
.faq-q[aria-expanded="true"] .toggle::after{transform:scaleY(0);}
.faq-a{max-height:0;overflow:hidden;transition:max-height .3s ease;}
.faq-a .faq-a-inner{padding:0 var(--sp-2) var(--sp-5) calc(var(--sp-2) + 1.5rem + var(--sp-4));color:var(--c-ink-sub);font-size:var(--fs-sm);line-height:1.85;}

/* =========================================================
   Partner banner / CTA / Instagram
   ========================================================= */
.partner-banner{background:var(--c-navy);border-radius:var(--r-lg);padding:clamp(28px,5vw,56px);
  display:grid;gap:var(--sp-5);color:#dce6f0;position:relative;overflow:hidden;}
@media(min-width:768px){.partner-banner{grid-template-columns:1fr auto;align-items:center;}}
.partner-banner h3{font-family:var(--font-disp);font-size:var(--fs-xl);color:#fff;}
.partner-banner p{margin:var(--sp-3) 0 0;color:#aebfd0;font-size:var(--fs-sm);}

.cta-block{background:var(--c-paper);text-align:center;}
.cta-block h2{font-family:var(--font-disp);font-size:clamp(1.6rem,4vw,var(--fs-2xl));color:var(--c-navy);margin-bottom:var(--sp-4);letter-spacing:.03em;}
.cta-block p{color:var(--c-ink-sub);margin-bottom:var(--sp-7);}
.cta-actions{display:flex;flex-wrap:wrap;gap:var(--sp-5);justify-content:center;align-items:center;}

.ig-block{display:grid;gap:var(--sp-7);align-items:center;}
@media(min-width:768px){.ig-block{grid-template-columns:auto 1fr;}}
.ig-card{background:#fff;border:1px solid var(--c-line);border-radius:var(--r-md);padding:var(--sp-5);box-shadow:var(--sh-1);max-width:340px;}
.ig-card .ig-head{display:flex;align-items:center;gap:var(--sp-3);margin-bottom:var(--sp-4);}
.ig-card .ig-avatar{width:44px;height:44px;border-radius:var(--r-circle);border:1.5px solid var(--c-pink);color:var(--c-pink);display:grid;place-items:center;}
.ig-card .ig-avatar svg{width:22px;height:22px;}
.ig-card .ig-handle{font-family:var(--font-head);font-weight:700;color:var(--c-navy);font-size:var(--fs-sm);}
.ig-card .ig-thumb{aspect-ratio:1/1;border-radius:var(--r-sm);overflow:hidden;background:var(--c-navy);margin-bottom:var(--sp-4);}
.ig-card .ig-thumb img{width:100%;height:100%;object-fit:cover;}

/* ---------- 画像プレースホルダ（薄青×白×薄ピンク／実写は後日差し替え） ---------- */
.ph-soft{position:relative;overflow:hidden;
  background:linear-gradient(150deg,#eaf4fd 0%,#ffffff 50%,#fdeef3 100%) !important;}
.ph-soft::before{content:"";position:absolute;inset:-22%;
  background:radial-gradient(circle at 26% 28%,rgba(191,224,255,.5),transparent 56%),
             radial-gradient(circle at 78% 74%,rgba(251,213,226,.55),transparent 56%);}
.ph-soft .ph-ic{position:absolute;inset:0;margin:auto;width:76px;height:76px;border-radius:var(--r-circle);
  background:rgba(255,255,255,.9);color:var(--c-blue-deep);display:grid;place-items:center;
  box-shadow:0 10px 26px rgba(37,133,207,.16);}
.ph-soft .ph-ic svg{width:34px;height:34px;}
.ph-soft .ph-note{position:absolute;left:0;right:0;bottom:var(--sp-4);text-align:center;
  font-family:var(--font-head);font-size:var(--fs-xs);color:var(--c-ink-sub);letter-spacing:.06em;}

/* =========================================================
   Footer
   ========================================================= */
.site-footer{background:var(--c-navy);color:#aebfd0;padding-block:var(--sp-9) var(--sp-6);}
.site-footer a{color:#cdd9e6;}
.site-footer a:hover{color:#fff;}
.footer-grid{display:grid;gap:var(--sp-7);}
@media(min-width:768px){.footer-grid{grid-template-columns:1.5fr 1fr 1fr;}}
.footer-brand .name{font-family:var(--font-disp);font-weight:700;font-size:var(--fs-lg);color:#fff;margin-bottom:var(--sp-4);letter-spacing:.04em;}
.footer-brand p{font-size:var(--fs-sm);color:#9fb4c8;line-height:1.9;}
.footer-col h4{color:#fff;font-size:var(--fs-sm);margin-bottom:var(--sp-4);letter-spacing:.08em;font-family:var(--font-head);}
.footer-col ul{display:flex;flex-direction:column;gap:var(--sp-3);font-size:var(--fs-sm);}
.footer-ig{display:inline-flex;align-items:center;gap:var(--sp-2);margin-top:var(--sp-4);
  border:1px solid rgba(255,255,255,.25);padding:var(--sp-2) var(--sp-4);border-radius:var(--r-sm);}
.footer-ig svg{width:18px;height:18px;}
.footer-bottom{border-top:1px solid rgba(255,255,255,.15);margin-top:var(--sp-8);padding-top:var(--sp-5);font-size:var(--fs-xs);color:#7e95ab;text-align:center;letter-spacing:.05em;}

/* =========================================================
   Fixed mobile CTA
   ========================================================= */
.fixed-cta{position:fixed;left:0;right:0;bottom:0;z-index:48;display:grid;grid-template-columns:1fr 1fr;
  background:var(--c-navy);box-shadow:0 -4px 16px rgba(15,41,66,.2);}
.fixed-cta a{display:flex;align-items:center;justify-content:center;gap:var(--sp-2);padding:var(--sp-4);
  font-family:var(--font-head);font-weight:700;font-size:var(--fs-sm);color:#fff;}
.fixed-cta .fc-tel{background:var(--c-blue);}
.fixed-cta .fc-contact{background:var(--c-navy);}
.fixed-cta svg{width:19px;height:19px;}
@media(min-width:1024px){.fixed-cta{display:none;}}
body{padding-bottom:60px;}
@media(min-width:1024px){body{padding-bottom:0;}}

/* =========================================================
   Forms
   ========================================================= */
.form{display:grid;gap:var(--sp-5);background:#fff;border:1px solid var(--c-line);border-radius:var(--r-md);padding:var(--sp-6);box-shadow:var(--sh-1);}
.field{display:grid;gap:var(--sp-2);}
.field label{font-family:var(--font-head);font-weight:700;color:var(--c-navy);font-size:var(--fs-sm);}
.field .req{color:var(--c-err);font-size:var(--fs-xs);margin-left:var(--sp-1);}
.field input,.field textarea,.field select{font-family:inherit;font-size:var(--fs-base);padding:var(--sp-3) var(--sp-4);
  border:1.5px solid var(--c-line-strong);border-radius:var(--r-sm);background:#fff;color:var(--c-ink);width:100%;
  transition:border-color .2s ease,box-shadow .2s ease;}
.field input:focus,.field textarea:focus,.field select:focus{border-color:var(--c-blue);box-shadow:0 0 0 3px var(--c-blue-soft);outline:none;}
.field textarea{min-height:140px;resize:vertical;}
.form-note{font-size:var(--fs-xs);color:var(--c-ink-sub);}
.form-status{display:none;border-radius:var(--r-sm);padding:var(--sp-4);font-size:var(--fs-sm);}
.form-status.is-sending{display:block;background:var(--c-blue-soft);color:var(--c-blue-deep);}
.form-status.is-done{display:block;background:#e8f6ef;color:var(--c-ok);}
.form-status.is-error{display:block;background:#fdeaea;color:var(--c-err);}

/* =========================================================
   Reveal animation
   ========================================================= */
.reveal{opacity:0;transform:translateY(26px);transition:opacity .9s ease,transform .9s ease;}
.reveal.is-visible{opacity:1;transform:none;}
.reveal.d1{transition-delay:.1s;}
.reveal.d2{transition-delay:.2s;}
.reveal.d3{transition-delay:.3s;}
@media(prefers-reduced-motion:reduce){*{animation:none !important;transition:none !important;scroll-behavior:auto !important;}.reveal{opacity:1;transform:none;}}

/* missing image -> show parent's dark/soft color */
img.is-missing{opacity:0;}

/* =========================================================
   service.html : 訪問看護の内容（.feature 流用＋アイコン丸）
   ========================================================= */
.feature .f-ic{width:48px;height:48px;border-radius:var(--r-circle);
  background:var(--c-blue-soft);color:var(--c-blue-deep);display:grid;place-items:center;align-self:start;}
.feature .f-ic svg{width:24px;height:24px;}
/* 各ブロック末の控えめな相談導線 */
.block-cta{margin-top:var(--sp-7);}

/* partner.html : ご依頼の流れ（4ステップ版） */
@media(min-width:900px){.flow-steps--4{grid-template-columns:repeat(4,1fr);}}

/* utilities */
.mt-0{margin-top:0;}.mb-0{margin-bottom:0;}
.text-pink{color:var(--c-pink-deep);}.text-blue{color:var(--c-blue-deep);}
/* 改行調整：文節塊を分割させない（行末の孤立文字を防ぐ／main.js が付与する .nb 用） */
.nb{white-space:nowrap;}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);border:0;}

/* =========================================================
   タスクG：コントラスト微調整（白地/ペーパー上の小ラベルをAA≥4.5に）
   ・本文セクションの eyebrow を blue-deep に統一（page-hero と同じ。3.94→6.62）
   ・eyebrow--pink を一段濃いコーラルに（白5.1 / paper4.7）
   ※navy 面の eyebrow はインライン color が優先されるため影響なし
   ========================================================= */
.eyebrow{color:var(--c-blue-deep);}
.eyebrow--pink{color:#c23a6c;}