@import url('https://fonts.googleapis.com/css2?family=Pinyon+Script&display=swap');

/* ============================================================
   Summers Mothers — shared design system
   Fonts: Fraunces (display) + Spectral (body)
   Palette: warm cream / ivory · espresso brown · gold · sun gold · taupe
   Used by every page. Edit the :root tokens below to change the whole site.
   ============================================================ */

:root{
  --bone:#F6E7CE;          /* page background — logo cream */
  --bone-2:#EFDCBA;        /* alternating band — deeper cream */
  --cream-card:#FCF5E6;    /* cards — ivory */
  --ink:#34302A;           /* primary text — warm charcoal ink (not brown) */
  --ink-soft:#6E6450;      /* secondary text — warm taupe-gray */
  --accent:#A6741C;         /* primary accent — deep gold (links, italics, wordmark) — darkened for legibility on cream */
  --charcoal:#3B2D1C;    /* darkest — headings, footer, dark bands, buttons (warm charcoal) */
  --sand:#B6A074;          /* muted labels — warm sand */
  --gold-soft:#D2A24C;          /* secondary accent — light gold */
  --gold:#DDAE3D;          /* golden pop — badges, highlights */
  --line:rgba(60,52,36,.20);
  --line-soft:rgba(60,52,36,.11);
  --shadow:0 18px 50px -28px rgba(52,46,38,.40);
  --serif:'Spectral',Georgia,serif;
  --display:'Fraunces','Spectral',Georgia,serif;
}

*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{
  background-color:var(--bone);
  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.85' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.04'/%3E%3C/svg%3E");
  color:var(--ink);
  font-family:var(--serif);
  font-weight:400;
  font-size:18px;
  line-height:1.75;
  -webkit-font-smoothing:antialiased;
  overflow-x:clip;
}
::selection{background:var(--accent);color:var(--cream-card)}

.wrap{max-width:1120px;margin:0 auto;padding:0 32px}
.narrow{max-width:720px;margin-left:auto;margin-right:auto}

h1,h2,h3{font-family:var(--display);font-weight:400;line-height:1.12;letter-spacing:-.01em;color:var(--charcoal)}
em,.it{font-style:italic}
.clay{color:var(--gold-soft)}
.olive{color:var(--accent)}

/* botanical divider */
.swash{display:block;text-align:center;color:var(--sand);font-size:24px;letter-spacing:.3em;margin:0 auto;opacity:.8}

/* ---------- NAV ---------- */
nav{
  position:sticky;top:0;z-index:50;
  background:var(--bone);
  border-bottom:1px solid var(--line-soft);
  will-change:transform;
}
nav.scrolled{
  box-shadow:0 2px 18px -4px rgba(52,46,38,.10);
}
nav .wrap{display:flex;align-items:center;justify-content:space-between;height:72px}
.mark{font-family:var(--display);font-size:21px;letter-spacing:.02em;color:var(--accent);text-transform:lowercase;text-decoration:none}
.navlinks{display:flex;gap:34px;align-items:center}
.navlinks a{font-size:14px;letter-spacing:.14em;text-transform:lowercase;color:var(--ink-soft);text-decoration:none;transition:color .25s}
.navlinks a:hover,.navlinks a.active{color:var(--accent)}
.nav-cta{border:1px solid var(--accent);border-radius:999px;padding:9px 20px !important;color:var(--accent) !important}
.nav-cta:hover{background:var(--accent);color:var(--cream-card) !important}


/* ---------- buttons ---------- */
.btn{
  display:inline-flex;align-items:center;gap:12px;
  background:var(--charcoal);color:var(--cream-card);
  font-family:var(--serif);font-size:16px;letter-spacing:.06em;
  border:none;border-radius:999px;padding:17px 34px;cursor:pointer;
  text-decoration:none;transition:transform .3s ease,background .3s ease,box-shadow .3s ease;
  box-shadow:var(--shadow);
}
.btn:hover{background:var(--accent);transform:translateY(-2px)}
.btn.ghost{background:transparent;color:var(--accent);border:1px solid var(--accent);box-shadow:none}
.btn.ghost:hover{background:var(--accent);color:var(--cream-card)}
.btn .price{font-style:italic;opacity:.85}
.micro{font-size:13px;letter-spacing:.08em;color:var(--ink-soft);font-style:italic;margin-top:14px}

/* eyebrow label */
.eyebrow{font-size:13px;letter-spacing:.32em;text-transform:uppercase;color:var(--ink-soft);margin-bottom:22px}

/* ---------- HERO (home) ---------- */
header.hero{position:relative;padding:96px 0 70px;overflow:hidden}
.hero-grid{display:grid;grid-template-columns:1fr 1fr;gap:56px;align-items:stretch}
.hero .tagline{font-family:var(--serif);font-style:italic;font-size:18px;color:var(--sand);letter-spacing:.04em;margin-bottom:30px}
.hero h1{font-size:clamp(34px,4.7vw,58px);font-weight:300}
.hero h1 .line1{display:block;width:fit-content}
.hero h1 .line2{display:block;color:var(--accent);width:fit-content}
.hero .lede{margin:28px 0 0;font-size:20px;line-height:1.7;color:var(--ink-soft);max-width:42ch;font-weight:300}
.hero .meta{margin-top:34px;font-size:14px;letter-spacing:.18em;text-transform:lowercase;color:var(--ink-soft)}
.hero .cta-row{margin-top:34px;display:flex;flex-direction:column;align-items:flex-start}
.hero-img{position:relative;aspect-ratio:4/5;border-radius:4px;overflow:hidden;background:var(--bone-2);box-shadow:var(--shadow)}
.hero-img img{width:100%;height:100%;object-fit:cover;object-position:center 20%;display:block}
@media(max-width:860px){
  .hero-grid{grid-template-columns:1fr;gap:42px}
  .hero-img{aspect-ratio:4/3;order:-1}
  .hero .lede{max-width:none}
}

/* ---------- interior page hero ---------- */
.page-hero{padding:84px 0 18px;text-align:center}
.page-hero h1{font-size:clamp(34px,4.6vw,56px);font-weight:300}
.page-hero .lede{max-width:34ch;margin:26px auto 0;font-size:20px;color:var(--ink-soft);font-weight:300}

/* ---------- image slots ---------- */
.slot{
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;
  width:100%;height:100%;min-height:200px;
  background:
    repeating-linear-gradient(45deg,rgba(92,58,20,.04) 0 12px,transparent 12px 24px),
    var(--bone-2);
  border:1px dashed var(--line);color:var(--sand);text-align:center;padding:24px;
}
.slot svg{opacity:.7}
.slot .slot-label{font-size:12px;letter-spacing:.22em;text-transform:uppercase}
.slot .slot-sub{font-size:13px;font-style:italic;color:var(--ink-soft);opacity:.8}

/* ---------- sections / bands ---------- */
section{padding:96px 0;position:relative}
.band{background:var(--bone-2)}
.band-dark{background-color:var(--charcoal);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.85' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.05'/%3E%3C/svg%3E");color:#EFE0C2}
.band-dark h2,.band-dark h3{color:#FFF8EA}
.band-dark .eyebrow{color:var(--gold)}
/* text that sits directly on a dark band, not inside a light card */
.band-dark .access-note,.band-dark .belong p{color:#E7D8B8}
.band-dark .belong .closer{color:var(--gold)}
.band-dark .story-link{color:var(--gold);border-color:rgba(255,248,234,.28)}
.band-dark .story-link:hover{border-color:var(--gold)}
.section-head{text-align:center;margin-bottom:18px}
.section-head h2{font-size:clamp(30px,4vw,46px);font-weight:300}

/* ---------- belonging / general prose block ---------- */
.belong p{font-size:21px;line-height:1.85;margin-top:26px;font-weight:300}
.belong .closer{font-family:var(--display);font-style:italic;font-size:26px;color:var(--accent);margin-top:36px;text-align:center}

/* ---------- longform (story / letters) ---------- */
.longform p{font-size:19px;font-weight:300;color:var(--ink-soft);margin-top:24px}
.longform p:first-of-type{margin-top:0}
.longform p .lead-in{font-style:italic;color:var(--accent)}

/* ---------- manifesto ---------- */
.manifesto{text-align:center;max-width:34ch;margin:0 auto}
.manifesto p{font-family:var(--display);font-weight:300;font-size:clamp(22px,3vw,30px);line-height:1.5;color:var(--charcoal);margin-top:26px}
.band-dark .manifesto p{color:#FFF8EA}
.manifesto .sign{font-family:var(--serif);font-style:italic;font-size:18px;color:var(--gold);margin-top:34px;letter-spacing:.04em}

/* ---------- the rooms ---------- */
.rooms{display:grid;grid-template-columns:repeat(2,1fr);gap:54px 56px;margin-top:64px}
.room{display:grid;grid-template-rows:auto auto;gap:22px}
.room .room-img{aspect-ratio:3/2;border-radius:3px;overflow:hidden;background:var(--bone)}
.room h3{font-size:25px}
.room p{font-size:17px;color:var(--ink-soft);margin-top:10px;font-weight:300}
.room .accent{font-style:italic;color:var(--accent)}
@media(max-width:760px){.rooms{grid-template-columns:1fr;gap:48px}}
.floorplan{margin-top:72px}
.floorplan .slot{aspect-ratio:16/7;min-height:260px}

/* ---------- presence ---------- */
.presence{text-align:center}
.presence p{font-size:21px;font-weight:300;margin-top:24px}
.presence .peak{font-family:var(--display);font-style:italic;font-weight:300;font-size:clamp(24px,3.2vw,33px);line-height:1.4;color:#FFF8EA;margin:36px auto;max-width:24ch}
.presence .resolve{color:#E7D2A0;font-style:italic;font-size:19px}

/* ---------- story grid ---------- */
.story-grid{display:grid;grid-template-columns:1fr 1fr;gap:64px;align-items:center}
.story-grid .portrait{aspect-ratio:4/5;border-radius:3px;overflow:hidden;box-shadow:var(--shadow);background:var(--bone-2)}
.story-grid .portrait img{width:100%;height:100%;object-fit:cover;display:block}
.story-cap{font-style:italic;color:var(--sand);font-size:14px;letter-spacing:.04em;text-align:center;margin-top:14px}
.story-body p{margin-top:22px;font-size:18px;font-weight:300;color:var(--ink-soft)}
.story-body p:first-child{margin-top:0}
.three-gen{font-family:var(--display);font-style:italic;color:var(--accent);font-size:17px;letter-spacing:.04em;margin-top:30px}
.story-link{display:inline-block;margin-top:30px;font-size:14px;letter-spacing:.14em;text-transform:lowercase;color:var(--accent);border-bottom:1px solid var(--line);padding-bottom:3px;text-decoration:none;transition:border-color .3s}
.story-link:hover{border-color:var(--accent)}
@media(max-width:820px){.story-grid{grid-template-columns:1fr;gap:40px}.story-grid .portrait{max-width:420px;margin:0 auto;width:100%}}

/* ---------- membership tiers ---------- */
.tiers{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;margin-top:60px;align-items:start}
.tier{background:var(--cream-card);border:1px solid var(--accent);border-radius:5px;padding:26px 24px;display:flex;flex-direction:column;transition:transform .35s ease,box-shadow .35s ease}
.tier:hover{transform:translateY(-4px);box-shadow:var(--shadow)}
.tier.heart{border-color:var(--accent);position:relative}
.tier.heart::before{content:'the heart of the room';position:absolute;top:-13px;left:50%;transform:translateX(-50%);background:var(--gold);color:var(--charcoal);font-size:11px;letter-spacing:.18em;text-transform:uppercase;padding:5px 14px;border-radius:999px;white-space:nowrap}
.tier h3{font-size:26px;font-weight:500;color:var(--charcoal);margin-top:4px}
.tier .cost{font-family:var(--display);font-size:30px;color:var(--charcoal);margin:6px 0 4px}
.tier .cost span{font-size:14px;font-style:italic;color:var(--ink-soft)}
.tier .for{font-size:16px;font-style:italic;color:var(--ink-soft);margin-top:4px}
.tier ul{list-style:none;margin:14px 0;display:flex;flex-direction:column;gap:9px;flex:1}
.tier li{font-size:15px;font-weight:400;padding-left:20px;position:relative;color:var(--ink)}
.tier li::before{content:'';position:absolute;left:0;top:10px;width:6px;height:6px;border-radius:50%;background:var(--gold)}
.tier .heartline{font-family:var(--display);font-style:italic;color:var(--accent);font-size:15px;line-height:1.4;border-top:1px solid var(--line-soft);padding-top:14px;margin-top:4px}
.tier-who{font-size:12px;letter-spacing:.2em;text-transform:uppercase;color:var(--gold);margin-bottom:2px;font-family:var(--serif)}
.tier-gift{display:inline-block;font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--charcoal);background:var(--gold-soft);border-radius:999px;padding:3px 11px;margin-bottom:8px;font-family:var(--serif)}
/* accordion tiers (home page) */
.tier-toggle{background:var(--bone-2);border:1px solid var(--line-soft);border-radius:4px;cursor:pointer;font-family:var(--serif);font-size:15px;color:var(--accent);padding:10px 14px;margin-top:16px;display:flex;align-items:center;justify-content:space-between;width:100%}
.tier-toggle .tier-arrow{display:inline-block;transition:transform .3s ease;font-style:normal;font-size:13px}
.tier.open .tier-arrow{transform:rotate(180deg)}
.tier-body{max-height:0;overflow:hidden;transition:max-height .4s ease}
.tier.open .tier-body{max-height:600px}
.access-note{text-align:center;font-style:italic;color:var(--ink-soft);font-size:16px;margin-top:46px;font-weight:300}
@media(max-width:980px){.tiers{grid-template-columns:repeat(2,1fr);gap:18px}}@media(max-width:500px){.tiers{grid-template-columns:1fr;gap:16px}}

/* ---------- waitlist ---------- */
.waitlist{text-align:center}
.waitlist .card{background:var(--cream-card);border:1px solid var(--line);border-radius:6px;padding:56px 48px;box-shadow:var(--shadow);max-width:640px;margin:48px auto 0}
.waitlist h2{font-size:clamp(30px,4vw,44px);font-weight:300}
.waitlist .body p{margin-top:20px;font-size:18px;font-weight:300;color:var(--ink-soft)}
.waitlist .cap{margin-top:26px;font-style:italic;color:var(--sand);font-size:16px}
.waitlist .btn{margin-top:34px}
#wl-confirm{display:none;margin-top:26px;font-family:var(--display);font-style:italic;font-size:20px;color:var(--accent)}
.waitlist.done .card .body,.waitlist.done .card .btn,.waitlist.done .card .micro,.waitlist.done .card .cap{display:none}
.waitlist.done #wl-confirm{display:block;font-size:23px}

/* ---------- FAQ ---------- */
.qa{border-top:1px solid var(--line-soft);padding:30px 0}
.qa:last-child{border-bottom:1px solid var(--line-soft)}
.qa h3{font-size:21px;font-weight:400}
.qa p{margin-top:14px;font-size:17px;font-weight:300;color:var(--ink-soft)}

/* ---------- business co-op ---------- */
.coop-section{padding:80px 0}
.coop-inner{max-width:860px;margin:0 auto;text-align:center}
.coop-inner .eyebrow{margin-bottom:28px}
.coop-cards{display:grid;grid-template-columns:1fr 1fr;gap:24px;text-align:left}
.coop-card{background:var(--cream-card);border:1px solid var(--line-soft);border-radius:8px;padding:36px 32px}
.coop-card h3{font-size:clamp(20px,2.4vw,24px);font-weight:400;margin-bottom:14px;line-height:1.2}
.coop-card p{font-size:16px;line-height:1.7;color:var(--ink-soft);font-weight:300;margin-bottom:20px}
.coop-link{font-size:15px;letter-spacing:.03em;color:var(--accent);text-decoration:none;font-style:italic;transition:opacity .2s}
.coop-link:hover{opacity:.7}
@media(max-width:640px){.coop-cards{grid-template-columns:1fr}.coop-card{padding:28px 24px}}

/* ---------- local guide lead magnet ---------- */
.guide-magnet{background:var(--bone-2);padding:80px 0;text-align:center}
.guide-inner{max-width:540px;margin:0 auto}
.guide-magnet h2{font-size:clamp(26px,3.8vw,38px);font-weight:300;margin-bottom:16px}
.guide-sub{font-size:18px;line-height:1.7;color:var(--ink-soft);margin-bottom:32px;font-weight:300}
.guide-form{}
.guide-row{display:flex;gap:10px;max-width:440px;margin:0 auto}
.guide-input{flex:1;font-family:var(--serif);font-size:16px;padding:14px 20px;border:1px solid var(--line);border-radius:999px;background:var(--cream-card);color:var(--ink);outline:none;transition:border-color .2s}
.guide-input:focus{border-color:var(--accent)}
.guide-input::placeholder{color:var(--sand)}
.guide-btn{font-family:var(--serif);font-size:15px;letter-spacing:.04em;white-space:nowrap;background:var(--charcoal);color:var(--cream-card);border:none;border-radius:999px;padding:14px 24px;cursor:pointer;transition:background .25s,transform .2s}
.guide-btn:hover{background:var(--accent);transform:translateY(-1px)}
.guide-fine{font-size:13px;letter-spacing:.04em;color:var(--sand);font-style:italic;margin-top:14px}
.guide-ok{font-size:18px;color:var(--accent);font-style:italic;margin-top:8px}
@media(max-width:600px){.guide-row{flex-direction:column}.guide-btn{border-radius:999px;padding:15px}}

/* ---------- bottom CTA band (interior pages) ---------- */
.cta-band{text-align:center}
.cta-band h2{font-size:clamp(28px,3.6vw,42px);font-weight:300}
.cta-band p{margin-top:18px;color:var(--ink-soft);font-weight:300;font-size:18px;max-width:34ch;margin-left:auto;margin-right:auto}
.cta-band .btn{margin-top:32px}

/* ---------- footer ---------- */
footer{background-color:var(--charcoal);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.85' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.05'/%3E%3C/svg%3E");color:#D9C49A;padding:70px 0 56px;text-align:center}
footer .mark{color:var(--gold);font-size:26px;display:inline-block;margin-bottom:18px}
footer .f-nav{display:flex;gap:26px;justify-content:center;flex-wrap:wrap;margin-bottom:24px}
footer .f-nav a{font-size:13px;letter-spacing:.14em;text-transform:lowercase;color:#C9B488;text-decoration:none}
footer .f-nav a:hover{color:#FFF8EA}
footer .f-line{font-size:14px;letter-spacing:.14em;text-transform:lowercase;color:#C9B488}
footer a.mail{color:#F2E6C8;text-decoration:none;border-bottom:1px solid rgba(242,230,200,.3)}
footer .f-call{font-family:var(--display);font-style:italic;font-size:19px;color:#F2E6C8;margin:26px auto 28px;max-width:30ch}

/* ---------- reveal animation ---------- */
.rv{opacity:0;transform:translateY(26px);transition:opacity 1.1s cubic-bezier(.2,.7,.2,1),transform 1.1s cubic-bezier(.2,.7,.2,1)}
.rv.in{opacity:1;transform:none}
.d1{transition-delay:.12s}.d2{transition-delay:.24s}.d3{transition-delay:.36s}.d4{transition-delay:.48s}
@media(prefers-reduced-motion:reduce){.rv{opacity:1;transform:none;transition:none}}

/* ---------- editorial: chapters, pull-quote, signature, colophon ---------- */
.section-head .chap{display:block;font-family:var(--display);font-style:italic;font-weight:300;font-size:30px;color:var(--gold-soft);margin-bottom:8px;letter-spacing:.02em}
.band-dark .section-head .chap{color:var(--gold)}
.pullquote{padding:108px 0;text-align:center}
.pullquote .flo{display:flex;justify-content:center;margin-bottom:22px}
.pullquote .flo svg{width:24px;height:24px;stroke:var(--gold);fill:none;stroke-width:1.2}
.pullquote p{font-family:var(--display);font-weight:300;font-style:italic;font-size:clamp(28px,4.4vw,46px);line-height:1.32;color:var(--charcoal);max-width:20ch;margin:0 auto}
.sign-off{font-style:italic;color:var(--ink-soft);font-size:18px;margin-top:30px}
.signature{font-family:'Pinyon Script',cursive;font-size:46px;line-height:.9;color:var(--ink);margin-top:4px}
.band-dark .signature{color:var(--gold)}
footer .colophon{font-size:11px;letter-spacing:.18em;text-transform:lowercase;color:#C9B488;opacity:.75;margin-top:16px}

/* ---------- experiences (the space page) ---------- */
.exp{margin-top:54px}
.exp h3{font-size:25px;color:var(--charcoal);margin-bottom:4px}
.exp p{font-size:18px;font-weight:300;color:var(--ink-soft);margin-top:16px;line-height:1.8}
.exp-divider{display:block;text-align:center;color:var(--sand);font-size:16px;letter-spacing:.5em;margin-top:54px}

/* ---------- experiences, photo-paired (the space page) ---------- */
.exp-row{display:grid;grid-template-columns:1fr 1fr;gap:56px;align-items:center;margin-top:84px}
.exp-row:first-of-type{margin-top:60px}
.exp-img{aspect-ratio:4/5;border-radius:3px;overflow:hidden;box-shadow:var(--shadow);background:var(--bone-2)}
.exp-img img{width:100%;height:100%;object-fit:cover;display:block}
.exp-text h3{font-size:26px;color:var(--charcoal);margin-bottom:6px}
.exp-text p{font-size:17px;font-weight:300;color:var(--ink-soft);margin-top:14px;line-height:1.8}
@media(max-width:820px){.exp-row{grid-template-columns:1fr;gap:30px;margin-top:60px}.exp-img{order:-1;max-width:440px;margin:0 auto;width:100%}}

/* ---------- rooms swipe gallery (space page) ---------- */
.rooms-wrap{position:relative;margin-top:56px}
.rooms-gallery{display:flex;gap:26px;overflow-x:auto;scroll-snap-type:x mandatory;scroll-padding:0 4px;padding:6px 2px 26px;scroll-behavior:smooth;-webkit-overflow-scrolling:touch}
.rooms-gallery .room{flex:0 0 min(82vw,360px);scroll-snap-align:start;margin-top:0}
.rooms-gallery .room .room-img{aspect-ratio:3/2}
.rooms-gallery::-webkit-scrollbar{height:6px}
.rooms-gallery::-webkit-scrollbar-thumb{background:var(--accent);border-radius:99px;opacity:.6}
.rooms-gallery::-webkit-scrollbar-track{background:var(--bone-2);border-radius:99px}
.gallery-hint{font-size:13px;letter-spacing:.18em;text-transform:lowercase;color:var(--sand);font-style:italic;text-align:center;margin-top:12px}
.gnav{position:absolute;top:34%;transform:translateY(-50%);width:44px;height:44px;border-radius:999px;border:1px solid var(--line);background:var(--cream-card);color:var(--charcoal);font-size:22px;line-height:1;cursor:pointer;display:flex;align-items:center;justify-content:center;box-shadow:var(--shadow);z-index:5;transition:background .25s,color .25s,border-color .25s}
.gnav:hover{background:var(--accent);color:var(--cream-card);border-color:var(--accent)}
.gnav.prev{left:-12px}
.gnav.next{right:-12px}
@media(max-width:760px){.gnav{display:none}}

/* collapsible experiences on mobile (progressive enhancement) */
.exp-toggle{display:none}
.exp-chev{display:none}
@media(max-width:820px){
  .exp-row.acc-ready{display:flex;flex-direction:column;margin-top:0;border-top:1px solid var(--line-soft)}
  .exp-row.acc-ready:first-of-type{border-top:none}
  .exp-row.acc-ready .exp-toggle{display:flex;order:0;align-items:center;justify-content:space-between;width:100%;background:none;border:none;padding:22px 2px;font-family:var(--display);font-size:22px;line-height:1.2;color:var(--charcoal);text-align:left;cursor:pointer}
  .exp-row.acc-ready .exp-chev{display:block;width:11px;height:11px;border-right:2px solid var(--accent);border-bottom:2px solid var(--accent);transform:rotate(45deg);transition:transform .3s;flex:0 0 auto;margin-left:16px}
  .exp-row.acc-ready.open .exp-chev{transform:rotate(-135deg)}
  .exp-row.acc-ready .exp-text h3{display:none}
  .exp-row.acc-ready .exp-img{order:1;display:none;max-width:440px;width:100%;margin:0 auto}
  .exp-row.acc-ready .exp-text{order:2;display:none}
  .exp-row.acc-ready.open .exp-img{display:block;margin-top:4px}
  .exp-row.acc-ready.open .exp-text{display:block;margin-top:14px;padding-bottom:12px}
}

/* ---------- weekly rhythm calendar (classes page) ---------- */
.rhythm{margin-top:50px}
.day{background:var(--cream-card);border:1px solid var(--accent);border-radius:8px;padding:16px 20px;margin-bottom:12px;display:grid;grid-template-columns:72px 1fr;gap:18px;align-items:center}
.day .dname{font-family:var(--display);font-size:19px;color:var(--charcoal)}
.day .slots{display:flex;flex-direction:column;gap:10px}
.day .c-slot{display:flex;flex-wrap:wrap;align-items:baseline;gap:10px}
.day .time{font-size:13px;color:var(--sand);min-width:44px;font-variant-numeric:tabular-nums;letter-spacing:.04em}
.day .what{font-size:17px;color:var(--ink);font-weight:300}
.day .alt{color:var(--sand);font-style:italic;font-size:13px}
.day.sat{border-color:var(--accent)}
.day.closed{background:transparent;border-style:dashed}
.day.closed .what{color:var(--ink-soft);font-style:italic}
.tag-free{font-size:11px;letter-spacing:.1em;text-transform:uppercase;padding:3px 11px;border-radius:999px;background:transparent;color:var(--accent);border:1px solid var(--accent);white-space:nowrap}
.rhythm-note{font-size:14px;color:var(--ink-soft);font-style:italic;margin-top:18px;font-weight:300}
.village-tag{display:inline-block;background:var(--gold);color:var(--charcoal);font-size:11px;letter-spacing:.12em;text-transform:uppercase;padding:4px 13px;border-radius:999px;margin-bottom:16px}
@media(max-width:520px){.day{grid-template-columns:50px 1fr;gap:12px;padding:14px 16px}.day .what{font-size:15.5px}}

/* ---------- membership access grid (classes page) ---------- */
.grid-scroll{overflow-x:auto;-webkit-overflow-scrolling:touch;border:1px solid var(--line-soft);border-radius:8px;margin-top:18px}
table.access{border-collapse:collapse;width:100%;min-width:640px;background:var(--cream-card)}
table.access th,table.access td{padding:13px 14px;text-align:center;font-size:14px;border-bottom:1px solid var(--line-soft)}
table.access thead th{background:var(--charcoal);color:#FFF8EA;font-family:var(--display);font-weight:400;font-size:14px;line-height:1.3}
table.access thead th .price{display:block;font-family:var(--serif);font-style:italic;font-size:12px;color:var(--gold);margin-top:4px}
table.access tbody th{text-align:left;font-weight:400;color:var(--ink);background:var(--bone-2);font-family:var(--serif);font-size:14px;position:sticky;left:0}
table.access td.yes{color:var(--accent);font-weight:600}
table.access td.no{color:var(--sand)}
table.access td.note{font-size:12.5px;font-style:italic;color:var(--ink-soft)}
table.access tbody tr:last-child td,table.access tbody tr:last-child th{border-bottom:none}
.grid-note{font-size:14px;color:var(--ink-soft);font-style:italic;margin-top:16px;font-weight:300}
.grid-hint{font-size:12px;color:var(--sand);font-style:italic;margin-top:6px}

/* ---------- photo hero (care page) ---------- */
.page-hero.photo-bg{padding:120px 0 96px;background-size:cover;background-position:center;position:relative}
.page-hero.photo-bg::before{content:"";position:absolute;inset:0;background:rgba(30,22,12,.52)}
.page-hero.photo-bg .wrap{position:relative;z-index:1}
.page-hero.photo-bg h1,.page-hero.photo-bg .eyebrow,.page-hero.photo-bg .lede{color:#FFF8EA}
.page-hero.photo-bg .eyebrow{color:var(--gold)}
.page-hero.photo-bg .lede{color:#EADFC6}
@media(max-width:720px){.page-hero.photo-bg{padding:80px 0 60px}}
/* scene stacks (space page — photo then text) */
.scene-stack{max-width:720px;margin:0 auto 32px;border-radius:6px;overflow:hidden;box-shadow:var(--shadow)}
.scene-stack-photo{width:100%;height:340px;object-fit:cover;display:block}
.scene-stack-card{background:var(--cream-card);border-top:1px solid var(--line-soft);padding:24px 28px 28px}
.scene-stack-card h3{font-family:var(--display);font-size:clamp(20px,2.4vw,26px);font-weight:300;color:var(--charcoal);margin-bottom:12px}
.scene-stack-card p{font-size:17px;font-weight:300;color:var(--ink-soft);line-height:1.75}
@media(max-width:720px){.scene-stack{border-radius:0;margin-left:-20px;margin-right:-20px}.scene-stack-photo{height:240px}}
/* typewriter heading */
.typewriter{visibility:hidden}
.typewriter.typed{visibility:visible}
/* word-by-word fade */
.wf{opacity:0;transform:translateY(5px);display:inline;transition:opacity .5s ease,transform .5s ease}
.wf.in{opacity:1;transform:none}
/* underline sweep — background-size draw approach (works on inline elements) */
.sweep{background-image:linear-gradient(to right,#C9B488,#C9B488);background-size:0% 2px;background-repeat:no-repeat;background-position:left bottom;transition:background-size .9s ease;padding-bottom:2px}
.sweep.swept{background-size:100% 2px}
/* staggered list items */
.stagger-list li{opacity:0;transform:translateX(-10px);transition:opacity .4s ease,transform .4s ease}
.stagger-list li.sl-in{opacity:1;transform:none}
/* color reveal */
.color-reveal{color:var(--bone-2)}
.color-reveal.revealed{color:var(--charcoal);transition:color 1.5s ease .5s}
/* floating listen button */
.listen-btn{position:fixed;bottom:24px;right:20px;z-index:200;background:var(--charcoal);color:#FFF8EA;border:none;border-radius:999px;padding:12px 16px 12px 14px;display:flex;align-items:center;gap:8px;font-family:var(--serif);font-size:13px;letter-spacing:.05em;cursor:pointer;box-shadow:0 4px 24px rgba(52,46,38,.42);transition:background .2s,transform .15s}
.listen-btn:hover,.listen-btn.playing{background:var(--accent)}
.listen-btn:hover{transform:scale(1.04)}
.listen-dot{width:7px;height:7px;border-radius:50%;background:#FFF8EA;flex-shrink:0;display:none;animation:pulse-dot 1.1s ease-in-out infinite}
@keyframes pulse-dot{0%,100%{opacity:1;transform:scale(1)}50%{opacity:.35;transform:scale(.6)}}
/* room cards inside dark band */
.band-dark .room p{color:rgba(239,220,186,.82)}
.band-dark .room .accent{color:var(--gold)}
.band-dark .gnav{background:rgba(255,248,234,.1);border-color:rgba(255,248,234,.22);color:#FFF8EA}
.band-dark .gnav:hover{background:var(--accent);border-color:var(--accent)}
/* mobile swipe hint */
.swipe-hint{display:none;align-items:center;justify-content:center;gap:8px;margin-top:14px;color:rgba(239,220,186,.55);font-size:13px;letter-spacing:.08em;text-transform:uppercase}
.swipe-arrow{font-size:18px;animation:swipe-bounce 1.4s ease-in-out infinite}
@keyframes swipe-bounce{0%,100%{transform:translateX(0)}55%{transform:translateX(9px)}}
@media(max-width:760px){.swipe-hint{display:flex}}
/* access tier cards (replaces table on classes.html) */
.access-cards{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;margin-top:48px}
.ac-card{background:var(--cream-card);border:1px solid var(--line-soft);border-radius:8px;padding:24px 22px}
.ac-card.featured{border-color:var(--accent);background:#FDF6EC}
.ac-head{margin-bottom:18px;padding-bottom:14px;border-bottom:1px solid var(--line-soft)}
.ac-head h3{font-family:var(--display);font-size:20px;font-weight:400;color:var(--charcoal);margin:0}
.ac-price{font-size:13px;color:var(--accent);letter-spacing:.04em;margin-top:4px;display:block}
.ac-card ul{list-style:none;margin:0;padding:0}
.ac-card li{font-size:15px;color:var(--ink-soft);font-weight:300;padding:9px 0;border-bottom:1px solid var(--line-soft);display:flex;align-items:start;gap:8px;line-height:1.5}
.ac-card li:last-child{border-bottom:none}
.ac-card li::before{content:'✓';color:var(--accent);flex-shrink:0;font-size:14px;margin-top:1px}
.ac-card li.note::before{content:'+';color:var(--sand)}
@media(max-width:900px){.access-cards{grid-template-columns:1fr 1fr}}
@media(max-width:500px){.access-cards{grid-template-columns:1fr}}
/* care page full-bleed photo above text */
.care-hero-photo{width:100%;max-height:520px;overflow:hidden}
.care-hero-photo img{width:100%;height:100%;object-fit:cover;display:block;max-height:520px}
@media(max-width:720px){.care-hero-photo{max-height:300px}.care-hero-photo img{max-height:300px}}

/* ---------- practitioner care page ---------- */
.care-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:24px;margin-top:52px}
.care-card{background:var(--cream-card);border:1px solid var(--line-soft);border-radius:6px;padding:30px 32px}
.care-card h3{font-size:22px;color:var(--charcoal);margin-bottom:10px}
.care-card p{font-size:16px;color:var(--ink-soft);font-weight:300;line-height:1.75}
@media(max-width:760px){.care-grid{grid-template-columns:1fr;gap:18px}}

/* ---------- story page: small dedication + photo alongside letter ---------- */
.dedication{font-family:var(--display);font-style:italic;font-weight:400;font-size:clamp(20px,2.4vw,26px);color:var(--accent);line-height:1.5;max-width:26ch;margin:0 auto}
.story-layout{display:grid;grid-template-columns:0.82fr 1.18fr;gap:54px;align-items:start;margin-top:8px}
.story-layout .photo-col{position:sticky;top:100px}
.story-photo{aspect-ratio:4/5;border-radius:3px;overflow:hidden;box-shadow:var(--shadow);background:var(--bone-2)}
.story-photo img{width:100%;height:100%;object-fit:cover;display:block}
.story-layout .longform p:first-of-type{margin-top:0}
@media(max-width:860px){.story-layout{grid-template-columns:1fr;gap:26px}.story-layout .photo-col{position:static}.story-photo{max-width:420px;margin:0 auto}}

/* belonging section: larger emphasis beats between body paragraphs (home) */
.belong .beat{font-family:var(--display);font-weight:300;font-style:italic;font-size:clamp(23px,3vw,31px);line-height:1.42;color:var(--charcoal);text-align:center;max-width:24ch;margin:44px auto}

/* inline photo within a content section */
.section-photo{border-radius:4px;overflow:hidden;box-shadow:var(--shadow);margin:38px auto 6px}
.section-photo img{width:100%;height:auto;display:block}

/* ---------- mobile nav (hamburger) + tired-mom spacing ---------- */
.nav-toggle{display:none;background:none;border:none;cursor:pointer;width:42px;height:42px;flex-direction:column;justify-content:center;align-items:center;gap:5px;padding:0}
.nav-toggle span{display:block;width:24px;height:2px;background:var(--accent);border-radius:2px;transition:transform .3s ease,opacity .25s ease}
.nav-toggle.open span:nth-child(1){transform:translateY(7px) rotate(45deg)}
.nav-toggle.open span:nth-child(2){opacity:0}
.nav-toggle.open span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}
@media(max-width:720px){
  .nav-toggle{display:flex}
  nav .wrap{height:56px}
  .navlinks{position:fixed;top:56px;left:0;right:0;background:var(--bone);flex-direction:column;align-items:stretch;gap:0;padding:6px 0 14px;border-bottom:1px solid var(--line-soft);box-shadow:0 18px 40px -22px rgba(52,46,38,.45);display:none;z-index:49}
  .navlinks.open{display:flex}
  .navlinks a{font-size:18px;letter-spacing:.06em;color:var(--ink);padding:16px 24px;border-top:1px solid var(--line-soft)}
  .navlinks a:first-of-type{border-top:none}
  .navlinks .nav-cta{margin:14px 24px 4px;padding:15px !important;text-align:center;background:var(--accent) !important;color:var(--cream-card) !important;border:none}
  section{padding:62px 0}
  .wrap{padding:0 22px}
  header.hero{padding:0 0 54px}
  .page-hero{padding:54px 0 8px}
}

/* screen-reader-only heading (SEO h1 without changing layout) */
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}



/* center a lone trailing room card on desktop when the count is odd */
@media(min-width:761px){.rooms .room:last-child:nth-child(odd){grid-column:1 / -1;justify-self:center;max-width:calc(50% - 28px);width:100%}}

/* ---------- icon room cards (no photo) ---------- */
.room .room-icon{aspect-ratio:3/2;border-radius:3px;background:var(--bone);border:1px solid var(--line-soft);display:flex;align-items:center;justify-content:center}
.room .room-icon svg{width:54px;height:54px;fill:none;stroke:var(--accent);stroke-width:1.1;stroke-linecap:round;stroke-linejoin:round;opacity:.9}
.room .room-icon svg .dot{fill:var(--accent);stroke:none}

.room .room-img img{width:100%;height:100%;object-fit:cover;display:block}

/* nav logo mark (icon + wordmark) */
.mark{display:inline-flex;align-items:center;gap:9px}
.mark-icon{height:30px;width:auto;display:block}
@media(max-width:720px){.mark-icon{height:26px}}

/* ---------- text-only room list (space page) ---------- */
.roomgrid{display:grid;grid-template-columns:1fr 1fr;gap:42px 56px;margin-top:50px}
.roomgrid .roomnote h3{font-size:23px}
.roomgrid .roomnote p{margin-top:9px;color:var(--ink-soft);font-weight:300;font-size:17px;line-height:1.7}
.roomgrid .roomnote .accent{font-style:italic;color:var(--accent)}
@media(max-width:760px){.roomgrid{grid-template-columns:1fr;gap:34px}}

/* ---------- photo scenes (space page "a day here") ---------- */
.scene{position:relative;background-size:cover;background-position:center;padding:120px 0;min-height:480px}
.scene::before{content:"";position:absolute;inset:0;background:rgba(30,24,14,.28)}
.scene .wrap{position:relative;z-index:1}
.scene-card{background:rgba(246,231,206,.88);max-width:480px;padding:38px 40px;border-radius:5px}
.scene.right .scene-card{margin-left:auto}
.scene-card h3{font-family:var(--display);font-weight:300;font-size:clamp(23px,2.8vw,30px);color:#3A2410;margin-bottom:2px}
.scene-card p{font-size:16.5px;font-weight:300;color:#4A3520;margin-top:13px;line-height:1.75}
@media(max-width:760px){.scene{padding:60px 0;min-height:360px}.scene-card{max-width:none;padding:28px 24px}.scene.right .scene-card{margin-left:0}}