/*
Theme Name: はしづめ内科 (Hashizume Clinic)
Theme URI: https://www.hashizume-naika.com/
Author: Hashizume Clinic
Description: 「信頼とやさしさのパートナー」をコンセプトにした、はしづめ内科の公式テーマ。内科・腎臓内科・腹膜透析。やさしい光（Gentle Light）をテーマにした温かみのあるデザイン。
Version: 1.0.0
Requires at least: 6.0
Tested up to: 6.5
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: hashizume
*/

/* =====================================================================
   はしづめ内科 — style.css
   Concept: やさしい光 / Gentle Light
   Tokens & principles per DESIGN.md
   ===================================================================== */

/* ---------- Design Tokens ---------- */
:root {
  /* Base */
  --c-cream:        #FAF6EE;
  --c-cream-deep:   #F2EADB;
  --c-paper:        #FFFFFF;

  /* Sage (primary) */
  --c-sage-900:     #2F4334;
  --c-sage-700:     #4A6B54;
  --c-sage-500:     #6E927A;
  --c-sage-200:     #C7D6CB;
  --c-sage-100:     #E4ECE6;

  /* Apricot (accent / CTA) */
  --c-apricot:      #E8916B;
  --c-apricot-deep: #D2774F;
  --c-apricot-soft: #F6D9C8;

  /* Text */
  --c-ink:          #33352F;
  --c-ink-soft:     #5E6157;

  /* Utility */
  --c-gold:         #C9A86A;
  --shadow-soft:    0 12px 40px -16px rgba(47, 67, 52, 0.22);
  --shadow-card:    0 4px 24px -10px rgba(47, 67, 52, 0.16);

  /* Type */
  --font-serif: "Shippori Mincho", "Zen Old Mincho", "Hiragino Mincho ProN", serif;
  --font-sans:  "Zen Kaku Gothic New", "Hiragino Sans", "Noto Sans JP", sans-serif;
  --font-en:    "Cormorant Garamond", "Shippori Mincho", serif;

  --fs-hero:   clamp(2.4rem, 6vw, 4.6rem);
  --fs-h2:     clamp(1.7rem, 3.4vw, 2.6rem);
  --fs-h3:     clamp(1.2rem, 2vw, 1.5rem);
  --fs-body:   clamp(0.95rem, 1.6vw, 1.06rem);
  --fs-small:  0.86rem;

  /* Space / Shape */
  --radius-sm:  10px;
  --radius-md:  18px;
  --radius-lg:  28px;
  --radius-pill: 999px;
  --maxw:       1120px;
  --gutter:     clamp(20px, 5vw, 64px);

  /* Motion */
  --ease-soft: cubic-bezier(0.22, 1, 0.36, 1);
  --dur-base:  0.6s;

  --header-h: 84px;
}

/* ---------- Reset ---------- */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; -webkit-text-size-adjust: 100%; }
body {
  font-family: var(--font-sans);
  font-size: var(--fs-body);
  line-height: 1.9;
  color: var(--c-ink);
  background: var(--c-cream);
  overflow-x: hidden;
  position: relative;
}
img { max-width: 100%; height: auto; display: block; }
a { color: inherit; text-decoration: none; }
ul { list-style: none; }
button { font-family: inherit; cursor: pointer; border: none; background: none; }

/* paper-grain overlay */
body::before {
  content: "";
  position: fixed; inset: 0;
  pointer-events: none; z-index: 1;
  opacity: 0.4; mix-blend-mode: multiply;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.04'/%3E%3C/svg%3E");
}

/* ---------- Layout helpers ---------- */
.wrap { width: 100%; max-width: var(--maxw); margin-inline: auto; padding-inline: var(--gutter); }
.section { padding-block: clamp(64px, 9vw, 130px); position: relative; z-index: 2; }
.section--cream-deep { background: var(--c-cream-deep); }
.section--sage { background: var(--c-sage-100); }

.eyebrow {
  font-family: var(--font-en);
  font-size: 0.95rem; letter-spacing: 0.28em; text-transform: uppercase;
  color: var(--c-apricot-deep); font-weight: 600;
  display: inline-flex; align-items: center; gap: 0.7em;
}
.eyebrow::before { content: ""; width: 34px; height: 1px; background: var(--c-gold); }

.section-title {
  font-family: var(--font-serif);
  font-size: var(--fs-h2); font-weight: 600;
  color: var(--c-sage-900); line-height: 1.4;
  letter-spacing: 0.04em; margin-top: 0.5rem;
}
.section-lead { color: var(--c-ink-soft); margin-top: 1rem; max-width: 46ch; }

/* ---------- Buttons ---------- */
.btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 0.6em;
  font-family: var(--font-sans); font-weight: 700;
  padding: 0.9em 1.8em; border-radius: var(--radius-pill);
  min-height: 48px; transition: transform .3s var(--ease-soft), box-shadow .3s var(--ease-soft), background .3s;
  letter-spacing: 0.04em; line-height: 1;
}
.btn svg { width: 1.2em; height: 1.2em; }
.btn--primary { background: var(--c-apricot); color: #fff; box-shadow: var(--shadow-card); }
.btn--primary:hover { background: var(--c-apricot-deep); transform: translateY(-3px); box-shadow: var(--shadow-soft); }
.btn--sage { background: var(--c-sage-700); color: #fff; }
.btn--sage:hover { background: var(--c-sage-900); transform: translateY(-3px); box-shadow: var(--shadow-soft); }
.btn--ghost { background: transparent; color: var(--c-sage-900); border: 1.5px solid var(--c-sage-200); }
.btn--ghost:hover { border-color: var(--c-sage-500); transform: translateY(-3px); }

/* =====================================================================
   S0 — Header / Nav
   ===================================================================== */
.header {
  position: fixed; top: 0; left: 0; right: 0; z-index: 100;
  height: var(--header-h);
  display: flex; align-items: center;
  transition: height .35s var(--ease-soft), background .35s, box-shadow .35s;
}
.header::after { content: ""; position: absolute; inset: 0; z-index: -1;
  background: rgba(250, 246, 238, 0); transition: background .35s, backdrop-filter .35s; }
.header.is-scrolled { height: 68px; }
.header.is-scrolled::after { background: rgba(250, 246, 238, 0.92); backdrop-filter: blur(10px); box-shadow: 0 1px 0 var(--c-sage-100), var(--shadow-card); }
.header .wrap { display: flex; align-items: center; justify-content: space-between; gap: 1.5rem; }

.brand { display: flex; align-items: center; gap: 0.7rem; }
.brand__mark { width: 42px; height: 42px; flex: 0 0 auto; }
.brand__name { font-family: var(--font-serif); font-weight: 600; font-size: 1.3rem; color: var(--c-sage-900); letter-spacing: 0.06em; }
.brand__sub { display: block; font-family: var(--font-en); font-size: 0.62rem; letter-spacing: 0.24em; color: var(--c-sage-500); text-transform: uppercase; line-height: 1; }

.nav { display: flex; align-items: center; gap: clamp(0.4rem, 1.6vw, 1.6rem); }
.nav__links { display: flex; gap: clamp(0.6rem, 1.4vw, 1.4rem); }
.nav__links a {
  font-size: 0.92rem; color: var(--c-sage-900); font-weight: 500;
  padding: 0.3em 0.1em; position: relative; white-space: nowrap;
}
.nav__links a::after { content: ""; position: absolute; left: 0; bottom: -2px; width: 0; height: 1.5px; background: var(--c-apricot); transition: width .3s var(--ease-soft); }
.nav__links a:hover::after { width: 100%; }
.nav__cta { display: flex; gap: 0.6rem; align-items: center; }
.nav__cta .btn { padding: 0.65em 1.2em; min-height: 42px; font-size: 0.88rem; }

.nav-toggle { display: none; width: 46px; height: 46px; border-radius: var(--radius-sm); flex-direction: column; gap: 5px; align-items: center; justify-content: center; }
.nav-toggle span { width: 24px; height: 2px; background: var(--c-sage-900); border-radius: 2px; transition: transform .35s var(--ease-soft), opacity .25s; }
.nav-toggle.is-open span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
.nav-toggle.is-open span:nth-child(2) { opacity: 0; }
.nav-toggle.is-open span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }

/* =====================================================================
   S1 — Hero
   ===================================================================== */
.hero {
  position: relative; min-height: 100svh;
  display: flex; align-items: center;
  padding-top: var(--header-h);
  overflow: hidden;
}
/* komorebi light */
.hero__glow {
  position: absolute; z-index: 0; inset: -10% -10% auto auto;
  width: 70vw; height: 70vw; max-width: 900px; max-height: 900px;
  background: radial-gradient(circle at 70% 30%, rgba(232, 145, 107, 0.20), transparent 55%),
              radial-gradient(circle at 40% 60%, rgba(110, 146, 122, 0.22), transparent 60%);
  filter: blur(10px); pointer-events: none;
}
.hero__leaf { position: absolute; z-index: 0; pointer-events: none; opacity: 0.5; }
.hero__leaf--1 { right: -40px; top: 12%; width: clamp(160px, 26vw, 360px); color: var(--c-sage-200); }
.hero__leaf--2 { left: -60px; bottom: -40px; width: clamp(140px, 22vw, 300px); color: var(--c-apricot-soft); transform: rotate(20deg); }

.hero .wrap { position: relative; z-index: 2; }
.hero__grid { display: grid; grid-template-columns: 1.05fr 0.95fr; gap: clamp(2rem, 5vw, 4.5rem); align-items: center; }
.hero__inner { max-width: 620px; }

/* hero photo slot */
.hero__media { position: relative; justify-self: end; width: 100%; max-width: 460px; }
.hero__photo {
  position: relative; margin: 0; overflow: hidden;
  border-radius: 280px 280px var(--radius-lg) var(--radius-lg); /* やわらかいアーチ型 */
  box-shadow: var(--shadow-soft);
  background: var(--c-sage-100);
  aspect-ratio: 4 / 5;
}
.hero__photo img { width: 100%; height: 100%; object-fit: cover; display: block; }
.hero__photo-accent {
  position: absolute; z-index: -1; right: -22px; bottom: -22px;
  width: 70%; height: 70%; border-radius: 220px 220px var(--radius-lg) var(--radius-lg);
  border: 1.5px solid var(--c-gold); opacity: 0.6;
}
.hero__photo-tag {
  position: absolute; left: -14px; bottom: 26px;
  display: inline-flex; align-items: center; gap: 0.5em;
  background: var(--c-paper); color: var(--c-sage-900);
  font-size: 0.82rem; font-weight: 700; letter-spacing: 0.04em;
  padding: 0.6em 1.1em; border-radius: var(--radius-pill);
  box-shadow: var(--shadow-card);
}
.hero__photo-tag svg { width: 1.1em; height: 1.1em; color: var(--c-apricot-deep); }
.hero__eyebrow { margin-bottom: 1.4rem; }
.hero__title {
  font-family: var(--font-serif); font-weight: 600;
  font-size: var(--fs-hero); line-height: 1.32; letter-spacing: 0.04em;
  color: var(--c-sage-900);
}
.hero__title .accent { color: var(--c-apricot-deep); }
.hero__sub { margin-top: 1.6rem; font-size: clamp(1rem, 2vw, 1.2rem); color: var(--c-ink-soft); line-height: 1.85; }
.hero__meta { margin-top: 1.2rem; display: flex; flex-wrap: wrap; gap: 0.6rem 1.4rem; font-size: 0.92rem; color: var(--c-sage-700); }
.hero__meta span { display: inline-flex; align-items: center; gap: 0.4em; }
.hero__meta svg { width: 1.1em; height: 1.1em; color: var(--c-apricot-deep); }
.hero__cta { margin-top: 2.6rem; display: flex; flex-wrap: wrap; gap: 1rem; }

.hero__scroll { position: absolute; left: 50%; bottom: 26px; transform: translateX(-50%); z-index: 2; display: flex; flex-direction: column; align-items: center; gap: 0.5rem; color: var(--c-sage-500); font-family: var(--font-en); font-size: 0.7rem; letter-spacing: 0.2em; }
.hero__scroll .line { width: 1px; height: 40px; background: var(--c-sage-500); animation: scrollline 2.2s var(--ease-soft) infinite; transform-origin: top; }
@keyframes scrollline { 0% { transform: scaleY(0); } 40% { transform: scaleY(1); } 100% { transform: scaleY(0); transform-origin: bottom; } }

/* hero load animation */
.reveal-load { opacity: 0; transform: translateY(26px); }
.hero.is-ready .reveal-load { animation: riseIn var(--dur-base) var(--ease-soft) forwards; }
.hero.is-ready .reveal-load:nth-child(1) { animation-delay: .05s; }
.hero__eyebrow.reveal-load { animation-delay: .05s; }
.hero__title.reveal-load   { animation-delay: .15s; }
.hero__sub.reveal-load     { animation-delay: .28s; }
.hero__meta.reveal-load    { animation-delay: .4s; }
.hero__cta.reveal-load     { animation-delay: .52s; }
.hero__media.reveal-load   { animation-delay: .3s; }
@keyframes riseIn { to { opacity: 1; transform: translateY(0); } }

/* =====================================================================
   S2 — Greeting / ひと・こと
   ===================================================================== */
.greeting__grid { display: grid; grid-template-columns: 0.85fr 1.15fr; gap: clamp(2rem, 5vw, 5rem); align-items: center; }
.greeting__media { position: relative; }
.greeting__photo { border-radius: var(--radius-lg); box-shadow: var(--shadow-soft); width: 100%; aspect-ratio: 4/5; object-fit: cover; background: var(--c-sage-100); }
.greeting__badge { position: absolute; bottom: -22px; right: -14px; background: var(--c-paper); border-radius: var(--radius-md); padding: 1rem 1.3rem; box-shadow: var(--shadow-card); text-align: center; }
.greeting__badge b { font-family: var(--font-serif); color: var(--c-sage-900); font-size: 1.05rem; display: block; }
.greeting__badge small { color: var(--c-ink-soft); font-size: 0.72rem; letter-spacing: 0.08em; }

.greeting__body .quote { font-family: var(--font-serif); font-size: clamp(1.3rem, 2.6vw, 1.9rem); line-height: 1.7; color: var(--c-sage-900); position: relative; padding-top: 1.4rem; }
.greeting__body .quote::before { content: "“"; font-family: var(--font-en); position: absolute; top: -1.4rem; left: -0.3rem; font-size: 5rem; color: var(--c-apricot-soft); line-height: 1; }
.greeting__body p { margin-top: 1.4rem; color: var(--c-ink-soft); }
.greeting__body .sign { margin-top: 1.6rem; font-family: var(--font-serif); color: var(--c-sage-700); }
.greeting__body .sign b { font-size: 1.2rem; color: var(--c-sage-900); }
.greeting__body .btn { margin-top: 2rem; }

/* =====================================================================
   S3 — News
   ===================================================================== */
.news__head { display: flex; justify-content: space-between; align-items: flex-end; flex-wrap: wrap; gap: 1rem; }
.news__list { margin-top: 2.5rem; border-top: 1px solid var(--c-sage-200); }
.news__item { display: grid; grid-template-columns: auto auto 1fr; gap: 1.4rem; align-items: center; padding: 1.4rem 0.4rem; border-bottom: 1px solid var(--c-sage-200); transition: background .3s, padding-left .3s var(--ease-soft); }
.news__item:hover { background: var(--c-sage-100); padding-left: 1rem; }
.news__date { font-family: var(--font-en); font-size: 1rem; color: var(--c-sage-500); letter-spacing: 0.05em; white-space: nowrap; }
.news__tag { font-size: 0.72rem; font-weight: 700; color: var(--c-apricot-deep); background: var(--c-apricot-soft); padding: 0.25em 0.9em; border-radius: var(--radius-pill); white-space: nowrap; }
.news__title { color: var(--c-sage-900); font-weight: 500; }
.news .btn { margin-top: 2.5rem; }

/* =====================================================================
   S4 — Reservation & Web Interview
   ===================================================================== */
.access-cards { display: grid; grid-template-columns: repeat(2, 1fr); gap: clamp(1.4rem, 3vw, 2.2rem); }
.acard {
  background: var(--c-paper); border-radius: var(--radius-lg); padding: clamp(1.8rem, 3.5vw, 2.8rem);
  box-shadow: var(--shadow-card); position: relative; overflow: hidden;
  display: flex; flex-direction: column; transition: transform .35s var(--ease-soft), box-shadow .35s;
  border: 1px solid var(--c-sage-100);
}
.acard:hover { transform: translateY(-5px); box-shadow: var(--shadow-soft); }
.acard__icon { width: 58px; height: 58px; border-radius: var(--radius-md); display: grid; place-items: center; margin-bottom: 1.4rem; }
.acard__icon svg { width: 28px; height: 28px; }
.acard--book .acard__icon { background: var(--c-sage-100); color: var(--c-sage-700); }
.acard--ubie .acard__icon { background: var(--c-apricot-soft); color: var(--c-apricot-deep); }
.acard h3 { font-family: var(--font-serif); font-size: var(--fs-h3); color: var(--c-sage-900); letter-spacing: 0.04em; }
.acard p { margin-top: 0.8rem; color: var(--c-ink-soft); font-size: 0.96rem; flex: 1; }
.acard .btn { margin-top: 1.6rem; align-self: flex-start; }
.acard__note {
  margin-top: 1.2rem; background: var(--c-apricot-soft); color: var(--c-apricot-deep);
  border-radius: var(--radius-sm); padding: 0.8em 1em; font-size: 0.84rem; font-weight: 700;
  display: flex; gap: 0.6em; align-items: flex-start;
}
.acard__note svg { width: 1.2em; height: 1.2em; flex: 0 0 auto; margin-top: 0.15em; }

/* =====================================================================
   S5 — Hours
   ===================================================================== */
.hours__grid { display: grid; grid-template-columns: 1.4fr 1fr; gap: clamp(2rem, 4vw, 3.5rem); align-items: start; }
.table-wrap { overflow-x: auto; border-radius: var(--radius-md); box-shadow: var(--shadow-card); background: var(--c-paper); }
.hours-table { width: 100%; border-collapse: collapse; min-width: 520px; text-align: center; }
.hours-table th, .hours-table td { padding: 0.95em 0.5em; border-bottom: 1px solid var(--c-sage-100); }
.hours-table thead th { background: var(--c-sage-700); color: #fff; font-weight: 600; font-size: 0.92rem; letter-spacing: 0.05em; }
.hours-table thead th:first-child { background: var(--c-sage-900); }
.hours-table tbody th { background: var(--c-sage-100); color: var(--c-sage-900); font-weight: 600; text-align: left; padding-left: 1.2em; white-space: nowrap; }
.hours-table .mark { color: var(--c-sage-700); font-weight: 700; font-size: 1.1rem; }
.hours-table .closed { color: var(--c-apricot-deep); }
.hours-table .sun { color: #b8483a; }
.hours-table tbody tr:last-child th, .hours-table tbody tr:last-child td { border-bottom: none; }

.hours__notes { background: var(--c-paper); border-radius: var(--radius-md); padding: clamp(1.4rem, 3vw, 2rem); box-shadow: var(--shadow-card); }
.hours__notes h3 { font-family: var(--font-serif); color: var(--c-sage-900); font-size: 1.15rem; margin-bottom: 1rem; }
.hours__notes ul { display: flex; flex-direction: column; gap: 0.9rem; }
.hours__notes li { display: flex; gap: 0.7em; font-size: 0.92rem; color: var(--c-ink-soft); align-items: flex-start; }
.hours__notes li svg { width: 1.15em; height: 1.15em; color: var(--c-apricot-deep); flex: 0 0 auto; margin-top: 0.3em; }
.hours__notes .highlight { color: var(--c-sage-900); font-weight: 700; }

/* =====================================================================
   S6 — Access
   ===================================================================== */
.access__grid { display: grid; grid-template-columns: 1fr 1.2fr; gap: clamp(2rem, 4vw, 3.5rem); align-items: stretch; }
.access__info { display: flex; flex-direction: column; gap: 1.4rem; }
.access__row { display: flex; gap: 1rem; align-items: flex-start; }
.access__row svg { width: 22px; height: 22px; color: var(--c-apricot-deep); flex: 0 0 auto; margin-top: 0.3rem; }
.access__row b { font-family: var(--font-serif); color: var(--c-sage-900); display: block; margin-bottom: 0.2rem; letter-spacing: 0.04em; }
.access__row p { color: var(--c-ink-soft); font-size: 0.95rem; }
.access__map { border-radius: var(--radius-lg); overflow: hidden; box-shadow: var(--shadow-soft); min-height: 320px; border: 1px solid var(--c-sage-100); }
.access__map iframe { width: 100%; height: 100%; min-height: 320px; border: 0; display: block; }
.access__info .btn { align-self: flex-start; margin-top: 0.4rem; }

/* =====================================================================
   S7 — Contact (phone)
   ===================================================================== */
.contact { background: linear-gradient(135deg, var(--c-sage-700), var(--c-sage-900)); color: #fff; position: relative; overflow: hidden; }
.contact::before { content: ""; position: absolute; inset: auto -5% -30% auto; width: 50vw; height: 50vw; max-width: 600px; max-height: 600px; background: radial-gradient(circle, rgba(232,145,107,0.28), transparent 60%); pointer-events: none; }
.contact .wrap { position: relative; z-index: 2; text-align: center; }
.contact .eyebrow { color: var(--c-apricot-soft); }
.contact .eyebrow::before { background: var(--c-apricot-soft); }
.contact h2 { font-family: var(--font-serif); font-size: var(--fs-h2); margin-top: 0.6rem; letter-spacing: 0.04em; }
.contact__tel { display: inline-flex; align-items: center; gap: 0.6rem; margin-top: 1.8rem; font-family: var(--font-en); font-size: clamp(2.6rem, 8vw, 4.8rem); font-weight: 600; color: #fff; letter-spacing: 0.02em; transition: transform .3s var(--ease-soft); }
.contact__tel svg { width: 0.7em; height: 0.7em; color: var(--c-apricot); }
.contact__tel:hover { transform: scale(1.02); }
.contact__hours { margin-top: 1rem; color: var(--c-sage-200); font-size: 0.98rem; }
.contact__hours b { color: #fff; }
.contact__cta { margin-top: 2rem; display: flex; gap: 1rem; justify-content: center; flex-wrap: wrap; }

/* =====================================================================
   S8 — Footer
   ===================================================================== */
.footer { background: var(--c-sage-900); color: var(--c-sage-200); padding-block: clamp(48px, 6vw, 80px); position: relative; z-index: 2; }
.footer__top { display: grid; grid-template-columns: 1.2fr 1fr; gap: 2.5rem; padding-bottom: 2.5rem; border-bottom: 1px solid rgba(255,255,255,0.12); }
.footer__brand .brand__name { color: #fff; }
.footer__brand .brand__sub { color: var(--c-sage-500); }
.footer__brand p { margin-top: 1.2rem; font-size: 0.9rem; line-height: 1.8; }
.footer__nav { display: flex; flex-wrap: wrap; gap: 0.8rem 2rem; align-content: start; }
.footer__nav a { font-size: 0.9rem; transition: color .25s; }
.footer__nav a:hover { color: var(--c-apricot); }
.footer__bottom { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 1rem; padding-top: 2rem; font-size: 0.78rem; color: var(--c-sage-500); }
.to-top { display: inline-flex; align-items: center; gap: 0.5em; color: var(--c-sage-200); font-size: 0.82rem; transition: color .25s; }
.to-top:hover { color: var(--c-apricot); }

/* =====================================================================
   Mobile Drawer
   ===================================================================== */
.drawer { position: fixed; inset: 0; z-index: 99; background: var(--c-cream); transform: translateY(-100%); transition: transform .5s var(--ease-soft); display: flex; flex-direction: column; justify-content: center; padding: var(--gutter); visibility: hidden; }
.drawer.is-open { transform: translateY(0); visibility: visible; }
.drawer a { font-family: var(--font-serif); font-size: 1.5rem; color: var(--c-sage-900); padding: 0.7rem 0; border-bottom: 1px solid var(--c-sage-100); display: flex; justify-content: space-between; align-items: center; }
.drawer a span { font-family: var(--font-en); font-size: 0.7rem; color: var(--c-sage-500); }
.drawer__cta { display: flex; gap: 1rem; margin-top: 2rem; flex-wrap: wrap; }

/* =====================================================================
   Scroll reveal
   ===================================================================== */
.reveal { opacity: 0; transform: translateY(34px); transition: opacity .8s var(--ease-soft), transform .8s var(--ease-soft); }
.reveal.is-in { opacity: 1; transform: translateY(0); }

/* =====================================================================
   Responsive
   ===================================================================== */
@media (max-width: 920px) {
  .nav__links, .nav__cta { display: none; }
  .nav-toggle { display: flex; }
  .greeting__grid, .hours__grid, .access__grid, .footer__top { grid-template-columns: 1fr; }
  .greeting__media { max-width: 420px; }
  .access-cards { grid-template-columns: 1fr; }
  /* hero: stack text then photo, photo centered & smaller */
  .hero { min-height: auto; padding-block: calc(var(--header-h) + 32px) 56px; }
  .hero__grid { grid-template-columns: 1fr; gap: clamp(2.2rem, 7vw, 3rem); }
  .hero__inner { max-width: 620px; }
  .hero__media { justify-self: center; max-width: 360px; }
  .hero__scroll { display: none; }
}
@media (max-width: 560px) {
  .hero__cta .btn { flex: 1 1 100%; }
  .hero__media { max-width: 300px; }
  .hero__photo { border-radius: 180px 180px var(--radius-lg) var(--radius-lg); }
  .news__item { grid-template-columns: 1fr; gap: 0.4rem; }
  .news__date { font-size: 0.9rem; }
  .footer__bottom { flex-direction: column; align-items: flex-start; }
}

/* Reduced motion */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: 0.001ms !important; animation-iteration-count: 1 !important; transition-duration: 0.001ms !important; scroll-behavior: auto !important; }
  .reveal, .reveal-load { opacity: 1 !important; transform: none !important; }
}

/* Focus visibility */
:focus-visible { outline: 3px solid var(--c-apricot); outline-offset: 3px; border-radius: 4px; }

/* =====================================================================
   SUBPAGES — shared
   ===================================================================== */
.page-hero { position: relative; padding-top: calc(var(--header-h) + clamp(38px, 7vw, 82px)); padding-bottom: clamp(34px, 6vw, 64px); overflow: hidden; }
.page-hero__glow { position:absolute; inset:-30% -10% auto auto; width:60vw; height:60vw; max-width:680px; max-height:680px; z-index:0; pointer-events:none; filter: blur(8px);
  background: radial-gradient(circle at 70% 30%, rgba(232,145,107,0.16), transparent 55%), radial-gradient(circle at 40% 60%, rgba(110,146,122,0.18), transparent 60%); }
.page-hero__leaf { position:absolute; right:-26px; bottom:-26px; width:clamp(120px,18vw,230px); color:var(--c-sage-100); z-index:0; pointer-events:none; }
.page-hero .wrap { position: relative; z-index: 2; }
.breadcrumb { display:flex; flex-wrap:wrap; gap:0.5em; align-items:center; font-size:0.82rem; color:var(--c-ink-soft); margin-bottom:1.3rem; }
.breadcrumb a { color:var(--c-sage-700); } .breadcrumb a:hover { color:var(--c-apricot-deep); }
.breadcrumb .sep { color:var(--c-sage-200); }
.page-hero__title { font-family:var(--font-serif); font-weight:600; font-size:clamp(2rem,5vw,3.1rem); color:var(--c-sage-900); letter-spacing:0.05em; line-height:1.3; margin-top:0.7rem; }
.page-hero__sub { margin-top:1rem; color:var(--c-ink-soft); max-width:56ch; }

.page-body { position: relative; z-index: 2; }
.stack { display:flex; flex-direction:column; gap:clamp(2.4rem,5vw,4rem); }
.prose { max-width:820px; }
.prose p { margin-bottom:1.25rem; } .prose p:last-child { margin-bottom:0; }
.prose strong { color:var(--c-sage-900); }
.block-title { font-family:var(--font-serif); font-size:var(--fs-h3); color:var(--c-sage-900); letter-spacing:0.04em; margin-bottom:1.3rem; padding-bottom:0.6rem; border-bottom:2px solid var(--c-sage-100); display:flex; align-items:center; gap:0.55em; }
.block-title svg { width:1.05em; height:1.05em; color:var(--c-apricot-deep); flex:0 0 auto; }
.surface { background:var(--c-paper); border:1px solid var(--c-sage-100); border-radius:var(--radius-lg); padding:clamp(1.5rem,3.5vw,2.6rem); box-shadow:var(--shadow-card); }
.note-small { font-size:0.82rem; color:var(--c-ink-soft); }

/* Director profile */
.profile { display:grid; grid-template-columns:280px 1fr; gap:clamp(1.6rem,4vw,3rem); align-items:start; }
.profile__photo { border-radius:var(--radius-lg); overflow:hidden; box-shadow:var(--shadow-card); background:var(--c-sage-100); aspect-ratio:3/4; }
.profile__photo img { width:100%; height:100%; object-fit:cover; }
.profile__role { color:var(--c-apricot-deep); font-weight:700; font-size:0.8rem; letter-spacing:0.14em; }
.profile__name { font-family:var(--font-serif); font-size:1.6rem; color:var(--c-sage-900); margin-top:0.3rem; }
.cred-list { display:flex; flex-wrap:wrap; gap:0.5rem; margin-top:1.2rem; }
.cred-list li { background:var(--c-sage-100); color:var(--c-sage-900); font-size:0.8rem; padding:0.4em 0.95em; border-radius:var(--radius-pill); }
.career-list { margin-top:1.4rem; display:flex; flex-direction:column; gap:0.5rem; }
.career-list li { position:relative; padding-left:1.3em; color:var(--c-ink-soft); font-size:0.92rem; }
.career-list li::before { content:""; position:absolute; left:0; top:0.7em; width:7px; height:7px; border-radius:50%; background:var(--c-sage-500); }

/* Staff cards */
.staff-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(280px,1fr)); gap:clamp(1.2rem,3vw,1.8rem); }
.staff-card { background:var(--c-paper); border:1px solid var(--c-sage-100); border-radius:var(--radius-md); overflow:hidden; box-shadow:var(--shadow-card); display:flex; flex-direction:column; transition:transform .35s var(--ease-soft), box-shadow .35s; }
.staff-card:hover { transform:translateY(-4px); box-shadow:var(--shadow-soft); }
.staff-card__media { aspect-ratio:4/3; background:var(--c-sage-100); overflow:hidden; }
.staff-card__media img { width:100%; height:100%; object-fit:cover; }
.staff-card__body { padding:1.3rem 1.4rem 1.6rem; }
.staff-card__role { font-family:var(--font-serif); font-size:1.15rem; color:var(--c-sage-900); }
.staff-card__role span { display:block; font-family:var(--font-en); font-size:0.7rem; letter-spacing:0.18em; color:var(--c-sage-500); text-transform:uppercase; }
.staff-card__body p { margin-top:0.7rem; font-size:0.9rem; color:var(--c-ink-soft); }

/* Services */
.service-cols { columns:2; column-gap:2.4rem; }
.service-cols li { break-inside:avoid; display:flex; gap:0.6em; align-items:flex-start; padding:0.5em 0; color:var(--c-ink); font-size:0.95rem; }
.service-cols li::before { content:""; flex:0 0 auto; width:8px; height:8px; border-radius:50%; background:var(--c-apricot); margin-top:0.65em; }
.pill-row { display:flex; flex-wrap:wrap; gap:0.6rem; margin-top:0.4rem; }
.pill { background:var(--c-sage-100); color:var(--c-sage-900); border-radius:var(--radius-pill); padding:0.4em 1em; font-size:0.86rem; }
.hospital-list { display:flex; flex-wrap:wrap; gap:0.55rem; }
.hospital-list li { border:1px solid var(--c-sage-200); border-radius:var(--radius-pill); padding:0.45em 1em; font-size:0.86rem; color:var(--c-sage-900); background:var(--c-cream); }

/* Facility photo grid */
.facility-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(220px,1fr)); gap:1.1rem; }
.facility-grid figure { margin:0; border-radius:var(--radius-md); overflow:hidden; box-shadow:var(--shadow-card); background:var(--c-sage-100); }
.facility-grid img { width:100%; aspect-ratio:4/3; object-fit:cover; display:block; }
.facility-grid figcaption { padding:0.7em 0.9em; font-size:0.86rem; color:var(--c-sage-900); font-weight:600; background:var(--c-paper); }

/* Principles (numbered) */
.principle-list { counter-reset:p; display:flex; flex-direction:column; gap:1rem; }
.principle-list li { counter-increment:p; display:flex; gap:1.1rem; align-items:flex-start; background:var(--c-paper); border:1px solid var(--c-sage-100); border-radius:var(--radius-md); padding:1.1rem 1.3rem; box-shadow:var(--shadow-card); }
.principle-list li::before { content:counter(p); flex:0 0 auto; width:36px; height:36px; border-radius:50%; background:var(--c-sage-700); color:#fff; font-family:var(--font-en); font-size:1.1rem; display:grid; place-items:center; }
.principle-list li p { color:var(--c-ink); }
.quote-band { background:var(--c-sage-100); border-radius:var(--radius-lg); padding:clamp(1.6rem,4vw,2.6rem); text-align:center; }
.quote-band .q { font-family:var(--font-serif); font-size:clamp(1.2rem,2.6vw,1.7rem); color:var(--c-sage-900); line-height:1.7; }
.quote-band .by { margin-top:0.8rem; color:var(--c-ink-soft); font-size:0.88rem; }

/* Info table (access) */
.info-list { display:flex; flex-direction:column; }
.info-list > div { display:grid; grid-template-columns:140px 1fr; gap:1rem; padding:1rem 0; border-bottom:1px solid var(--c-sage-100); }
.info-list > div:last-child { border-bottom:none; }
.info-list dt { font-family:var(--font-serif); color:var(--c-sage-900); font-weight:600; }
.info-list dd { color:var(--c-ink); }
.info-list dd a { color:var(--c-apricot-deep); font-weight:700; }
.access-map-lg { border-radius:var(--radius-lg); overflow:hidden; box-shadow:var(--shadow-soft); border:1px solid var(--c-sage-100); min-height:360px; }
.access-map-lg iframe { width:100%; height:100%; min-height:360px; border:0; display:block; }

/* Policy */
.policy-section { margin-bottom:2rem; } .policy-section:last-child { margin-bottom:0; }
.policy-section h3 { font-family:var(--font-serif); color:var(--c-sage-900); font-size:1.12rem; margin-bottom:0.7rem; }
.policy-section ul, .policy-section ol { padding-left:1.3em; display:flex; flex-direction:column; gap:0.45rem; color:var(--c-ink); }
.policy-section ul li { list-style:disc; } .policy-section ol li { list-style:decimal; }

/* Noel */
.noel-grid { display:grid; grid-template-columns:1fr 300px; gap:clamp(2rem,4vw,3.4rem); align-items:start; }
.noel-article .vol { font-family:var(--font-en); color:var(--c-apricot-deep); font-weight:600; letter-spacing:0.1em; }
.backnumbers { position:sticky; top:90px; }
.backnumbers h3 { font-family:var(--font-serif); color:var(--c-sage-900); font-size:1.1rem; margin-bottom:1rem; padding-bottom:0.6rem; border-bottom:2px solid var(--c-sage-100); }
.backnumbers ul { display:flex; flex-direction:column; max-height:520px; overflow:auto; }
.backnumbers a { display:flex; justify-content:space-between; gap:0.6rem; padding:0.7em 0.2em; border-bottom:1px solid var(--c-sage-100); font-size:0.9rem; color:var(--c-sage-900); transition:padding-left .25s var(--ease-soft), background .25s; }
.backnumbers a:hover { background:var(--c-sage-100); padding-left:0.6em; color:var(--c-apricot-deep); }
.backnumbers a time { font-family:var(--font-en); color:var(--c-sage-500); white-space:nowrap; }

/* shared bottom CTA band (subpages) */
.cta-band { background:linear-gradient(135deg,var(--c-sage-700),var(--c-sage-900)); color:#fff; text-align:center; position:relative; overflow:hidden; }
.cta-band::before { content:""; position:absolute; inset:auto -5% -40% auto; width:46vw; height:46vw; max-width:520px; max-height:520px; background:radial-gradient(circle,rgba(232,145,107,0.26),transparent 60%); pointer-events:none; }
.cta-band .wrap { position:relative; z-index:2; }
.cta-band h2 { font-family:var(--font-serif); font-size:var(--fs-h2); letter-spacing:0.04em; }
.cta-band p { color:var(--c-sage-200); margin-top:0.8rem; }
.cta-band__btns { margin-top:1.8rem; display:flex; gap:1rem; justify-content:center; flex-wrap:wrap; }

@media (max-width: 760px) {
  .profile { grid-template-columns:1fr; } .profile__photo { max-width:280px; }
  .service-cols { columns:1; }
  .noel-grid { grid-template-columns:1fr; } .backnumbers { position:static; }
  .info-list > div { grid-template-columns:1fr; gap:0.2rem; }
}

/* active nav state */
.nav__links a[aria-current="page"] { color:var(--c-apricot-deep); }
.nav__links a[aria-current="page"]::after { width:100%; }
.drawer a[aria-current="page"] { color:var(--c-apricot-deep); }

/* WordPress pagination */
.pagination, .nav-links { display:inline-flex; gap:0.4rem; flex-wrap:wrap; }
.page-numbers { display:inline-grid; place-items:center; min-width:42px; height:42px; padding:0 0.6em; border-radius:var(--radius-pill); background:var(--c-paper); border:1px solid var(--c-sage-200); color:var(--c-sage-900); font-family:var(--font-en); }
.page-numbers.current { background:var(--c-sage-700); color:#fff; border-color:var(--c-sage-700); }
.page-numbers:hover:not(.current) { border-color:var(--c-apricot); }
/* WP alignment helpers inside prose */
.page-body img { border-radius:var(--radius-sm); }
.page-body .aligncenter { margin-inline:auto; }