/* ============================================================
   NEW NEST ESSENTIALS — sitewide design system  ·  v2 "handcrafted"
   One shared stylesheet for every page.
   Brand-matched to the pin design kit:
   cream/greige · terracotta · sage · charcoal
   Fraunces display serif · clean warm sans everything else.
   Motifs: nest weave · arches · leaf sprigs · stitch lines.
   ============================================================ */

/* ---------- 0 · Self-hosted display font (Fraunces variable, latin) ----------
   Self-hosted to avoid a render-blocking Google Fonts round-trip. One variable
   file per style covers weights 300–700; optical sizing is automatic. */
@font-face{
  font-family:"Fraunces";
  font-style:normal;
  font-weight:300 700;
  font-display:swap;
  src:url("../fonts/fraunces-latin.woff2") format("woff2");
}
@font-face{
  font-family:"Fraunces";
  font-style:italic;
  font-weight:300 700;
  font-display:swap;
  src:url("../fonts/fraunces-latin-italic.woff2") format("woff2");
}

/* ---------- 1 · Design tokens ---------- */
:root{
  /* palette (locked — same hex as the pins) */
  --cream:#F4EDE1;
  --cream-bright:#FBF6EC;
  --card:#F8F2E6;
  --terracotta:#C4663F;
  --terra-deep:#A9522F;
  --terra-soft:#D98E68;          /* terracotta lifted for dark backgrounds */
  --sage:#7F9068;
  --sage-deep:#5F7147;
  --charcoal:#34322D;
  --ink:#413E36;
  --muted:#635D50;
  --faint:#6B6456;
  --hair:rgba(52,50,45,.16);
  --paper:#FFF7EE;               /* warm white for text on terracotta */
  --cream-on-dark:rgba(251,246,236,.92);
  --cream-dim:rgba(251,246,236,.62);

  /* type */
  --display:"Fraunces",Georgia,"Times New Roman",serif;
  --serif:var(--display);
  --sans:-apple-system,BlinkMacSystemFont,"Segoe UI","Helvetica Neue",Helvetica,Arial,sans-serif;

  /* shape + shadow */
  --radius:14px;
  --radius-sm:8px;
  --arch:340px;                          /* arch-top curve, echoes the pins */
  --shadow-soft:0 10px 22px rgba(52,50,45,.10);
  --shadow-lift:0 16px 32px rgba(52,50,45,.15);

  /* texture — paper grain, tiny inline SVG (no image request) */
  --grain: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='.8' numOctaves='3' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.045'/%3E%3C/svg%3E");

  /* hand-drawn squiggle underlines */
  --squiggle:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='72' height='7' viewBox='0 0 72 7'%3E%3Cpath d='M1 4.6 Q 10 1.6 20 3.8 T 38 3.2 T 56 4 T 71 3' fill='none' stroke='%23C4663F' stroke-width='2.1' stroke-linecap='round'/%3E%3C/svg%3E");
  --squiggle-paper:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='72' height='7' viewBox='0 0 72 7'%3E%3Cpath d='M1 4.6 Q 10 1.6 20 3.8 T 38 3.2 T 56 4 T 71 3' fill='none' stroke='%23FFF7EE' stroke-width='2.1' stroke-linecap='round'/%3E%3C/svg%3E");

  /* layout */
  --maxw:1080px;
  --maxw-wide:1180px;
  --prose:44rem;
}

/* ---------- 2 · Base ---------- */
*,*::before,*::after{margin:0;padding:0;box-sizing:border-box;}
html{scroll-behavior:smooth;scroll-padding-top:5rem;}
body{
  font-family:var(--sans);
  font-size:1rem;
  line-height:1.7;
  color:var(--ink);
  background-color:var(--cream);
  background-image:var(--grain);
  overflow-x:clip;
  -webkit-font-smoothing:antialiased;
}
img{max-width:100%;display:block;}
a{color:var(--terra-deep);}
a:hover{color:var(--terra-deep);}
::selection{background:var(--terracotta);color:var(--paper);}
:focus-visible{outline:2px solid var(--terracotta);outline-offset:3px;border-radius:2px;}

h1,h2,h3,h4{color:var(--charcoal);}
h1,h2{text-wrap:balance;}

.container{width:min(100% - 2.5rem, var(--maxw));margin-inline:auto;}
.container-wide{width:min(100% - 2.5rem, var(--maxw-wide));margin-inline:auto;}
.section{padding-block:3rem;}
.center{text-align:center;}
.serif{font-family:var(--serif);font-weight:400;}

.visually-hidden{
  position:absolute;width:1px;height:1px;padding:0;margin:-1px;
  overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0;
}
.skip-link{
  position:absolute;left:1rem;top:-3.5rem;z-index:100;
  background:var(--charcoal);color:var(--cream-bright);
  padding:.6rem 1rem;border-radius:0 0 8px 8px;
  font-size:.85rem;text-decoration:none;transition:top .15s ease;
}
.skip-link:focus{top:0;color:var(--cream-bright);}

/* ---------- 3 · Typography helpers + hand-touched marks ---------- */
.kicker{
  display:inline-block;
  font-size:.72rem;font-weight:700;
  letter-spacing:.24em;text-indent:.05em;text-transform:uppercase;
  color:var(--terra-deep);
}
.kicker-leaf{display:inline-flex;align-items:center;gap:.55rem;text-indent:0;}
.kicker-leaf svg{width:15px;height:15px;flex:none;}

.headline-em{font-style:italic;color:var(--sage-deep);}
em.brand-em{font-style:italic;color:var(--sage-deep);}

/* squiggly hand-underline on a key word */
.hand-underline{
  font-style:normal;
  background:var(--squiggle) no-repeat left bottom / 100% 6px;
  padding-bottom:5px;
}

/* legacy centered section head (guide + utility pages) */
.section-head{text-align:center;max-width:44rem;margin-inline:auto;}
.section-head h2{
  font-family:var(--serif);font-weight:450;
  font-size:clamp(1.6rem,3.6vw,2.15rem);line-height:1.2;
  margin-top:.6rem;
}
.section-head .lede{margin-top:.9rem;color:var(--muted);}

/* serif h2 flanked by terracotta rosettes (legacy, still used on guide pages) */
.rosette-row{display:flex;align-items:center;justify-content:center;gap:14px;}
.rosette-row .rule{height:1px;width:70px;background:rgba(52,50,45,.28);}
.rosette-row svg{width:18px;height:18px;flex:none;}

/* stitched divider — the brand's running-thread motif */
hr.stitch{
  border:none;width:130px;margin:3rem auto;
  border-top:1.6px dashed rgba(196,102,63,.5);
}

/* organic hand-drawn wave divider (left-set, deliberately off-centre) */
.wave-divider{margin:0;line-height:0;}
.wave-divider svg{width:min(300px,60%);height:26px;display:block;}

/* ---------- 4 · Buttons ---------- */
.btn{
  display:inline-block;
  font-family:var(--sans);font-size:.8rem;font-weight:700;
  letter-spacing:.14em;text-indent:.04em;text-transform:uppercase;
  text-decoration:none;text-align:center;
  padding:1rem 1.8rem;border-radius:999px;
  transition:transform .15s ease, background-color .15s ease,
             border-color .15s ease, color .15s ease, box-shadow .15s ease;
}
.btn-primary{
  background:var(--terra-deep);color:#fff;
  box-shadow:0 10px 22px rgba(196,102,63,.30), 0 2px 6px rgba(169,82,47,.22);
}
.btn-primary:hover{background:#8F4526;color:#fff;transform:translateY(-2px);}
.btn-ghost{
  color:var(--charcoal);background:transparent;
  border:1.5px solid rgba(52,50,45,.35);
}
.btn-ghost:hover{border-color:var(--terracotta);color:var(--terra-deep);transform:translateY(-2px);}
.btn-light{
  color:var(--cream-bright);background:transparent;
  border:1.5px solid rgba(251,246,236,.65);
}
.btn-light:hover{background:var(--cream-bright);color:var(--charcoal);transform:translateY(-2px);}
.btn .arrow{letter-spacing:0;margin-left:.5rem;}

/* ---------- 5 · Header + nav ---------- */
.site-header{
  background-color:var(--cream-bright);
  background-image:var(--grain);
  border-bottom:1px solid var(--hair);
  position:sticky;top:0;z-index:50;
}
.header-inner{
  display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;
  padding-block:.85rem;
}
.brand{display:flex;align-items:center;gap:.8rem;text-decoration:none;}
.brand-seal{
  width:48px;height:48px;border-radius:50%;overflow:hidden;flex:none;
  background:var(--cream);box-shadow:0 0 0 1px var(--hair);
}
.brand-seal img{width:100%;height:100%;object-fit:cover;}
.brand-name{
  display:block;
  font-family:var(--display);font-weight:600;
  font-size:1.06rem;letter-spacing:.005em;
  color:var(--charcoal);line-height:1.15;
}
.brand-tag{
  display:block;
  font-family:var(--display);font-style:italic;font-weight:400;
  font-size:.8rem;letter-spacing:.02em;
  color:var(--terra-deep);margin-top:.1rem;
}

/* CSS-only mobile menu (checkbox toggle, no JS) */
.nav-toggle{position:absolute;opacity:0;pointer-events:none;}
.nav-toggle-label{
  display:flex;align-items:center;justify-content:center;
  width:44px;height:44px;cursor:pointer;border-radius:10px;
}
.nav-toggle-label:hover{background:rgba(52,50,45,.06);}
.nav-toggle:focus-visible ~ .nav-toggle-label{outline:2px solid var(--terracotta);outline-offset:2px;}
.nav-toggle-bars{
  position:relative;display:block;width:22px;height:2px;
  background:var(--charcoal);border-radius:2px;
  transition:background-color .15s ease;
}
.nav-toggle-bars::before,
.nav-toggle-bars::after{
  content:"";position:absolute;left:0;width:22px;height:2px;
  background:var(--charcoal);border-radius:2px;
  transition:transform .2s ease, top .2s ease;
}
.nav-toggle-bars::before{top:-7px;}
.nav-toggle-bars::after{top:7px;}
.nav-toggle:checked ~ .nav-toggle-label .nav-toggle-bars{background:transparent;}
.nav-toggle:checked ~ .nav-toggle-label .nav-toggle-bars::before{top:0;transform:rotate(45deg);}
.nav-toggle:checked ~ .nav-toggle-label .nav-toggle-bars::after{top:0;transform:rotate(-45deg);}

.site-nav{
  flex-basis:100%;
  max-height:0;overflow:hidden;
  transition:max-height .3s ease;
}
.nav-toggle:checked ~ .site-nav{max-height:40rem;}
.site-nav ul{list-style:none;}
.site-nav > ul{padding-block:.5rem 1rem;}
.site-nav a{
  display:block;padding:.72rem .25rem;
  font-size:.98rem;font-weight:600;
  color:var(--ink);text-decoration:none;
  border-bottom:1px solid rgba(52,50,45,.08);
}
.site-nav a:hover{color:var(--terra-deep);}
.site-nav a[aria-current="page"]{color:var(--terra-deep);}

/* Guides dropdown — native <details>, accessible with zero/minimal JS */
.nav-drop summary{
  list-style:none;cursor:pointer;
  display:flex;align-items:center;gap:.45rem;
  padding:.72rem .25rem;
  font-size:.98rem;font-weight:600;color:var(--ink);
  border-bottom:1px solid rgba(52,50,45,.08);
}
.nav-drop summary::-webkit-details-marker{display:none;}
.nav-drop summary:hover{color:var(--terra-deep);}
.nav-drop .chev{width:12px;height:12px;flex:none;transition:transform .2s ease;}
.nav-drop[open] > summary .chev{transform:rotate(180deg);}

.drop-panel{margin:.25rem 0 .6rem .4rem;padding-left:1rem;
  border-left:1.6px dashed rgba(196,102,63,.5);}
.drop-panel a{
  display:flex;align-items:baseline;gap:.65rem;
  padding:.66rem .2rem;border-bottom:none;
  font-size:.95rem;
}
.drop-num{
  font-family:var(--display);font-style:italic;font-weight:500;
  font-size:.8rem;color:var(--terra-deep);min-width:1.3rem;
}
.drop-panel a[aria-current="page"]{color:var(--terra-deep);font-weight:700;}

/* ---------- 6 · Image slots (with labeled placeholder fallback) ---------- */
.img-slot{
  position:relative;overflow:hidden;
  background:var(--card);
  border-radius:var(--radius);
  box-shadow:0 0 0 1px var(--hair);
}
.img-slot::before{                 /* dashed inner frame — visible only when the photo is missing */
  content:"";position:absolute;inset:10px;
  border:1.5px dashed rgba(196,102,63,.5);
  border-radius:calc(var(--radius) - 6px);
}
.img-slot::after{                  /* placeholder label */
  content:attr(data-label);
  position:absolute;inset:0;
  display:flex;align-items:center;justify-content:center;
  padding:1.2rem;text-align:center;
  font-family:var(--serif);font-style:italic;
  font-size:1rem;color:var(--muted);
}
.img-slot img{
  position:absolute;inset:0;z-index:1;
  width:100%;height:100%;object-fit:cover;
}
.img-slot img.is-missing{display:none;}
.img-slot--flush{border-radius:0;box-shadow:none;}

.ratio-3x2{aspect-ratio:3/2;}
.ratio-4x3{aspect-ratio:4/3;}
.ratio-16x9{aspect-ratio:16/9;}
.ratio-21x9{aspect-ratio:21/9;}

/* ---------- 7 · Hero (homepage) ---------- */
.hero{padding-block:2.6rem 2.8rem;position:relative;}
.hero-grid{display:grid;gap:3rem;align-items:center;}
.hero-title{
  font-family:var(--display);font-weight:440;
  font-size:clamp(2.3rem, 4vw + .75rem, 3.8rem);
  line-height:1.04;letter-spacing:-.01em;
  margin-top:1rem;
}
.hero-title .line{display:block;}
.hero-title .circled{
  position:relative;display:inline-block;
  font-style:italic;color:var(--terra-deep);
  padding:0 .08em;
}
.hero-title .circled .scribble{
  position:absolute;left:-11%;top:-30%;
  width:128%;height:170%;
  overflow:visible;pointer-events:none;
}
.hero-title .circled .scribble path{
  stroke:var(--terracotta);stroke-width:3.4;fill:none;stroke-linecap:round;
  stroke-dasharray:1;stroke-dashoffset:1;
  animation:draw-scribble 1s ease-out .5s forwards;
}
@keyframes draw-scribble{to{stroke-dashoffset:0;}}

.hero-lede{
  margin-top:1.3rem;max-width:33rem;
  font-size:1.05rem;line-height:1.72;
}
.hero-actions{margin-top:1.8rem;display:flex;flex-wrap:wrap;gap:.85rem;align-items:center;}

/* hero art — arch photo + nest weave + rotating seal */
.hero-art{position:relative;max-width:400px;margin:1.5rem auto 0;}
.arch-frame{
  position:relative;z-index:2;
  border-radius:var(--arch) var(--arch) 20px 20px;
  overflow:hidden;
  aspect-ratio:5/5.9;
  box-shadow:var(--shadow-lift);
}
.arch-frame img{width:100%;height:100%;object-fit:cover;}
.hero-art::before{                      /* offset hand-drawn arch echo */
  content:"";position:absolute;z-index:1;
  inset:14px -14px -14px 14px;
  border:1.6px solid rgba(196,102,63,.55);
  border-radius:var(--arch) var(--arch) 22px 22px;
}
.nest-lines{
  position:absolute;z-index:0;
  left:-9%;bottom:-4.5%;width:64%;height:auto;
  pointer-events:none;
}
.hero-stamp{
  position:absolute;z-index:3;
  left:-26px;bottom:34px;
  width:104px;height:104px;
  filter:drop-shadow(0 6px 12px rgba(52,50,45,.18));
}
.hero-stamp .stamp-ring{display:block;width:100%;height:100%;}
.hero-stamp .spin{                      /* only the text ring rotates */
  transform-box:view-box;transform-origin:50% 50%;
  animation:stamp-spin 30s linear infinite;
  will-change:transform;
}
@keyframes stamp-spin{from{transform:rotate(0deg);}to{transform:rotate(360deg);}}
.stamp-logo{                            /* static brand seal, centered */
  position:absolute;left:50%;top:50%;
  width:62px;height:62px;
  transform:translate(-50%,-50%);
  border-radius:50%;
  overflow:hidden;
  background:#FBF6EC;
}
.stamp-logo img{                        /* sharp seal logo (logo-seal.png, 240px) at
                                           ~60% fill; nudge + counter-rotate so the mark
                                           sits optically centered and upright */
  position:absolute;left:50%;top:50%;
  width:115%;height:115%;
  transform:translate(-50%,-48.8%) rotate(-3deg);
}
.hero-sprig{
  position:absolute;z-index:3;
  right:-12px;top:-20px;width:58px;height:auto;
  pointer-events:none;
}

/* ---------- 8 · Manifesto (homepage value props, asymmetric) ---------- */
.manifesto{padding-block:2.6rem 3rem;}
.manifesto-grid{display:grid;gap:2.6rem;}
.manifesto-head h2{
  font-family:var(--display);font-weight:460;
  font-size:clamp(1.7rem,2.6vw + .5rem,2.4rem);line-height:1.16;
  margin-top:.7rem;
}
.manifesto-head h2 em{font-style:italic;color:var(--sage-deep);}
.manifesto-head p{margin-top:1.1rem;color:var(--muted);max-width:26rem;}
.manifesto-head .head-sprig{margin-top:1.6rem;width:74px;height:auto;display:block;}

.manifesto-list{list-style:none;}
.manifesto-list li{
  display:flex;gap:1.35rem;align-items:flex-start;
  padding-block:1.5rem;
}
.manifesto-list li + li{border-top:1.6px dashed rgba(196,102,63,.45);}
.manifesto-list li:first-child{padding-top:.4rem;}
.mark{
  width:66px;height:66px;flex:none;
  display:grid;place-items:center;
  background:var(--cream-bright);
  border:1.5px solid rgba(65,62,54,.3);
  box-shadow:0 4px 10px rgba(52,50,45,.06);
  border-radius:58% 42% 55% 45% / 52% 58% 42% 48%;   /* organic pebble */
}
.manifesto-list li:nth-child(2) .mark{border-radius:45% 55% 48% 52% / 55% 45% 55% 45%;}
.manifesto-list li:nth-child(3) .mark{border-radius:52% 48% 60% 40% / 45% 52% 48% 55%;}
.mark svg{width:32px;height:32px;}
.mno{
  display:block;
  font-family:var(--display);font-style:italic;font-weight:500;
  font-size:.92rem;color:var(--terra-deep);
}
.manifesto-list h3{
  font-family:var(--display);font-weight:520;
  font-size:1.32rem;line-height:1.25;margin-top:.15rem;
}
.manifesto-list p{margin-top:.4rem;font-size:.96rem;line-height:1.6;color:var(--muted);max-width:30rem;}

/* legacy ring-icon callouts (kept for other pages) */
.callouts{display:grid;gap:2rem;margin-top:2.4rem;}
.co{text-align:center;max-width:16rem;margin-inline:auto;}
.ring{
  width:78px;height:78px;margin:0 auto;border-radius:50%;
  background:var(--cream-bright);
  border:1.5px solid rgba(65,62,54,.32);
  box-shadow:0 0 0 6px rgba(196,102,63,.06), 0 4px 10px rgba(52,50,45,.05);
  display:flex;align-items:center;justify-content:center;
}
.co h3{
  margin-top:.85rem;
  font-size:.8rem;font-weight:800;
  letter-spacing:.14em;text-indent:.04em;text-transform:uppercase;
}
.co p{margin-top:.35rem;font-size:.92rem;line-height:1.55;color:var(--muted);}

/* ---------- 9 · Guides (homepage: feature card + room index) ---------- */
.guides{padding-block:2.6rem 3.2rem;}
.guides-head{max-width:38rem;}
.guides-head .kicker{display:inline-flex;align-items:center;gap:.8rem;text-indent:0;}
.guides-head .kicker::before{
  content:"";display:inline-block;width:44px;
  border-top:1.6px dashed rgba(196,102,63,.55);
}
.guides-head h2{
  font-family:var(--display);font-weight:460;
  font-size:clamp(1.7rem,2.6vw + .5rem,2.4rem);line-height:1.16;
  margin-top:.7rem;
}
.guides-head h2 em{font-style:italic;color:var(--sage-deep);}

/* featured pillar — First Apartment Checklist */
.feature-card{
  display:grid;overflow:hidden;
  margin-top:2.2rem;
  background-color:var(--terra-deep);
  background-image:var(--grain);
  border-radius:26px;
  box-shadow:var(--shadow-lift);
  text-decoration:none;
  transition:transform .18s ease, box-shadow .18s ease;
}
.feature-card:hover{transform:translateY(-4px);box-shadow:0 22px 44px rgba(52,50,45,.22);}
.feature-row{display:grid;gap:1.5rem;margin-top:2.2rem;}
.feature-row .feature-card{margin-top:0;}
.feature-media{
  margin:1.15rem 1.15rem 0;
  border-radius:var(--arch) var(--arch) 14px 14px;
  overflow:hidden;
  aspect-ratio:4/3;
  box-shadow:0 10px 24px rgba(60,25,10,.28);
}
.feature-media img{width:100%;height:100%;object-fit:cover;transition:transform .35s ease;}
.feature-card:hover .feature-media img{transform:scale(1.04);}
.feature-body{padding:1.7rem 1.5rem 1.9rem;}
.sticker{
  display:inline-block;transform:rotate(-3deg);
  background:var(--paper);color:var(--terra-deep);
  font-size:.64rem;font-weight:800;
  letter-spacing:.22em;text-indent:.05em;text-transform:uppercase;
  padding:.5rem .85rem;border-radius:3px;
  box-shadow:0 3px 8px rgba(40,16,6,.25);
}
.feature-body h3{
  font-family:var(--display);font-weight:470;
  font-size:clamp(1.6rem,2.4vw + .5rem,2.15rem);line-height:1.12;
  color:var(--paper);margin-top:1.05rem;
}
.feature-body h3 em{font-style:italic;}
.feature-body p{margin-top:.8rem;color:var(--paper);font-size:.99rem;line-height:1.65;max-width:26rem;}
.feature-link{
  display:inline-block;margin-top:1.35rem;
  color:var(--paper);font-weight:700;font-size:.8rem;
  letter-spacing:.14em;text-transform:uppercase;
  background:var(--squiggle-paper) no-repeat left bottom / 100% 6px;
  padding-bottom:7px;
}

/* room index — editorial list, replaces the uniform card grid */
.room-index{list-style:none;margin-top:1.4rem;}
.room-index li{border-bottom:1.6px dashed rgba(196,102,63,.4);}
.room-index a{
  display:grid;grid-template-columns:1fr auto;
  column-gap:1.1rem;row-gap:.15rem;align-items:center;
  padding-block:1.3rem;
  text-decoration:none;color:inherit;
}
.room-index .idx{
  grid-column:1;
  font-family:var(--display);font-style:italic;font-weight:500;
  font-size:.88rem;color:var(--terra-deep);
}
.room-index h3{
  grid-column:1;
  font-family:var(--display);font-weight:480;
  font-size:clamp(1.3rem,1.4vw + .8rem,1.65rem);line-height:1.2;
  transition:color .18s ease;
}
.room-index p{
  grid-column:1;
  margin-top:.3rem;font-size:.93rem;line-height:1.55;
  color:var(--muted);max-width:32rem;
}
.room-thumb{
  grid-column:2;grid-row:1 / span 3;
  width:84px;height:102px;flex:none;overflow:hidden;
  border-radius:52px 52px 12px 12px;
  box-shadow:0 0 0 1px var(--hair), var(--shadow-soft);
  transition:transform .22s ease;
}
.room-thumb img{width:100%;height:100%;object-fit:cover;}
.room-index .go{
  grid-column:2;grid-row:auto;display:none;
}
.room-index a:hover h3{color:var(--terra-deep);}
.room-index a:hover .room-thumb{transform:rotate(-2.5deg) scale(1.04);}

/* ---------- Plan-first guides (homepage: before you buy) ---------- */
.plan{padding-block:2.4rem 1rem;}
.plan-head{max-width:40rem;}
.plan-head h2{
  font-family:var(--display);font-weight:460;
  font-size:clamp(1.7rem,2.6vw + .5rem,2.4rem);line-height:1.16;
  margin-top:.7rem;
}
.plan-head h2 em{font-style:italic;color:var(--sage-deep);}
.plan-intro{margin-top:.85rem;font-size:.98rem;line-height:1.65;color:var(--muted);max-width:34rem;}
.plan-grid{display:grid;gap:1.3rem;margin-top:2rem;grid-template-columns:1fr;}
.plan-card{
  display:flex;flex-direction:column;align-items:flex-start;
  padding:1.55rem 1.5rem 1.65rem;
  background:var(--cream-bright);background-image:var(--grain);
  border:1px solid var(--hair);border-top:3px solid var(--terracotta);
  border-radius:var(--radius);box-shadow:var(--shadow-soft);
  text-decoration:none;color:inherit;
  transition:transform .18s ease, box-shadow .18s ease;
}
.plan-card:hover{transform:translateY(-4px);box-shadow:var(--shadow-lift);}
.plan-icon{
  display:inline-flex;align-items:center;justify-content:center;
  width:52px;height:52px;border-radius:14px;
  background:rgba(127,144,104,.12);margin-bottom:1rem;
}
.plan-icon svg{width:30px;height:30px;}
.plan-card h3{
  font-family:var(--display);font-weight:480;
  font-size:1.4rem;line-height:1.18;color:var(--charcoal);
}
.plan-card p{margin-top:.5rem;font-size:.94rem;line-height:1.6;color:var(--muted);}
.plan-cta{
  display:inline-block;margin-top:auto;padding-top:1.1rem;
  color:var(--terra-deep);font-weight:700;font-size:.76rem;
  letter-spacing:.14em;text-transform:uppercase;
}
.plan-cta span:not(.arrow){
  background:var(--squiggle) no-repeat left bottom / 0% 6px;
  transition:background-size .25s ease;padding-bottom:7px;
}
.plan-card:hover .plan-cta span:not(.arrow){background-size:100% 6px;}
.plan-cta .arrow{margin-left:.35rem;display:inline-block;transition:transform .18s ease;}
.plan-card:hover .plan-cta .arrow{transform:translateX(3px);}
@media (min-width:760px){
  .plan{padding-block:2.8rem 1.4rem;}
  .plan-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:1.5rem;}
}

/* legacy uniform guide cards (kept for other pages) */
.card-grid{display:grid;gap:1.5rem;margin-top:2.4rem;}
.guide-card{
  display:flex;flex-direction:column;
  background:var(--cream-bright);
  border-radius:var(--radius);overflow:hidden;
  box-shadow:0 0 0 1px var(--hair), var(--shadow-soft);
  text-decoration:none;color:inherit;
  transition:transform .18s ease, box-shadow .18s ease;
}
.guide-card:hover{transform:translateY(-4px);box-shadow:0 0 0 1px var(--hair), var(--shadow-lift);}
.guide-card:hover .card-link{color:var(--terra-deep);}
.guide-card:hover h3{color:var(--terra-deep);}
.guide-card .img-slot{border-radius:0;box-shadow:none;}
.guide-card-body{
  flex:1;display:flex;flex-direction:column;
  padding:1.35rem 1.4rem 1.45rem;
}
.guide-card .card-kicker{
  font-size:.65rem;font-weight:700;
  letter-spacing:.26em;text-indent:.06em;text-transform:uppercase;
  color:var(--faint);
}
.guide-card h3{
  font-family:var(--serif);font-weight:450;
  font-size:1.35rem;line-height:1.2;margin-top:.45rem;
  transition:color .18s ease;
}
.guide-card p{margin-top:.55rem;font-size:.94rem;line-height:1.6;color:var(--muted);}
.card-link{
  margin-top:auto;padding-top:.9rem;
  font-size:.72rem;font-weight:700;
  letter-spacing:.18em;text-indent:.04em;text-transform:uppercase;
  color:var(--terra-deep);transition:color .18s ease;
}

/* ---------- 9b · Day-one-first narrative (homepage) ----------
   Priority story: the terracotta day-one panel leads, the stitched
   "what can wait" list relieves the pressure. Teasers only — links
   into What to Buy's tier anchors, never product data. */
.dayone{padding-block:.4rem 3rem;}
.dayone-head{max-width:40rem;}
.dayone-head h2{
  font-family:var(--display);font-weight:460;
  font-size:clamp(1.7rem,2.6vw + .5rem,2.4rem);line-height:1.16;
  margin-top:.7rem;
}
.dayone-head h2 em{font-style:italic;color:var(--sage-deep);}
.dayone-grid{display:grid;gap:2.1rem;margin-top:2.1rem;}
.dayone-panel{
  position:relative;
  background-color:var(--terra-deep);
  background-image:var(--grain);
  border-radius:26px;
  box-shadow:var(--shadow-lift);
  padding:clamp(1.8rem,3.4vw,2.6rem);
}
.dayone-panel h3{
  font-family:var(--display);font-weight:470;
  font-size:clamp(1.5rem,2vw + .5rem,2rem);line-height:1.14;
  color:var(--paper);margin-top:1.05rem;
}
.dayone-panel p{margin-top:.85rem;color:var(--paper);font-size:.98rem;line-height:1.68;max-width:30rem;}
.dayone-panel p a{color:var(--paper);text-decoration:underline;text-decoration-color:rgba(255,247,238,.5);text-underline-offset:2px;}
.dayone-panel p a:hover{text-decoration-color:var(--paper);}
.dayone-panel .btn-light{margin-top:1.5rem;}
.dayone-wait h3{
  font-family:var(--display);font-weight:500;
  font-size:1.35rem;line-height:1.2;
}
.dayone-wait > p{margin-top:.6rem;font-size:.96rem;line-height:1.65;color:var(--muted);max-width:32rem;}
.wait-list{list-style:none;margin-top:1.15rem;}
.wait-list li{border-bottom:1.6px dashed rgba(196,102,63,.4);}
.wait-list li:first-child{border-top:1.6px dashed rgba(196,102,63,.4);}
.wait-list a{
  display:grid;grid-template-columns:1fr auto;
  column-gap:1rem;align-items:center;
  padding-block:1rem;
  text-decoration:none;color:inherit;
}
.wait-when{
  grid-column:1;
  font-family:var(--display);font-style:italic;font-weight:500;
  font-size:.85rem;color:var(--terra-deep);
}
.wait-name{
  grid-column:1;
  font-family:var(--display);font-weight:500;
  font-size:1.18rem;line-height:1.25;color:var(--charcoal);
  transition:color .18s ease;
}
.wait-note{grid-column:1;margin-top:.15rem;font-size:.9rem;line-height:1.55;color:var(--muted);max-width:28rem;}
.wait-list .go{
  grid-column:2;grid-row:1 / span 3;align-self:center;
  font-family:var(--display);font-size:1.35rem;color:var(--terra-deep);
  transition:transform .2s ease;
}
.wait-list a:hover .wait-name{color:var(--terra-deep);}
.wait-list a:hover .go{transform:translateX(7px);}

@media (min-width:860px){
  .dayone-grid{grid-template-columns:1.04fr .96fr;gap:clamp(2.4rem,4vw,4rem);align-items:center;}
}
@media (min-width:980px){
  .dayone{padding-block:.6rem 3.6rem;}
}

/* ---------- 9c · Personality layer — quiet make-it-yours coda (homepage) ----------
   Deliberately subordinate to the day-one section: narrow, centered,
   text link instead of a big button. */
.personality{padding-block:.4rem 3.2rem;}
.personality-inner{max-width:34rem;text-align:center;}
.personality-sprig{width:64px;height:auto;margin:0 auto 1.1rem;display:block;}
.personality h2{
  font-family:var(--display);font-weight:470;
  font-size:clamp(1.35rem,1.6vw + .6rem,1.75rem);line-height:1.22;
  margin-top:.6rem;
}
.personality h2 em{font-style:italic;color:var(--sage-deep);}
.personality p{margin-top:.8rem;font-size:.94rem;line-height:1.68;color:var(--muted);}
.personality-link{
  display:inline-block;margin-top:1.15rem;
  color:var(--terra-deep);font-weight:700;font-size:.74rem;
  letter-spacing:.16em;text-indent:.04em;text-transform:uppercase;
  text-decoration:none;
  background:var(--squiggle) no-repeat left bottom / 100% 6px;
  padding-bottom:7px;
}
.personality-link:hover{color:var(--terra-deep);}
.personality-follow{margin-top:1.1rem;font-size:.9rem;color:var(--muted);}
.personality-follow a{color:var(--terra-deep);text-decoration:underline;text-decoration-color:rgba(160,82,52,.4);text-underline-offset:2px;}
.personality-follow a:hover{text-decoration-color:var(--terra-deep);}

/* ---------- 10 · Mission (homepage: inset organic panel) ---------- */
.mission{padding-block:.6rem 3.4rem;}
.mission-panel{
  position:relative;overflow:hidden;
  background-color:var(--sage-deep);
  background-image:var(--grain);
  border-radius:2.4rem 4.5rem 2.4rem 4.5rem;
  padding:clamp(2.1rem,5vw,3.4rem);
  color:var(--cream-on-dark);
}
.mission-grid{display:grid;gap:2.2rem;position:relative;z-index:1;}
.mission-panel .kicker{color:var(--cream-bright);}
.mission-quote{
  font-family:var(--display);font-style:italic;font-weight:430;
  font-size:clamp(1.5rem,2.4vw + .55rem,2.2rem);line-height:1.3;
  color:var(--cream-bright);
  margin-top:1rem;text-wrap:balance;
}
.mission-quote::before{
  content:"\201C";
  display:block;height:.25em;
  font-size:2.6em;line-height:.9;font-style:normal;
  color:rgba(251,246,236,.35);
}
.mission-side p{color:var(--cream-on-dark);font-size:.98rem;line-height:1.7;}
.mission-side .btn-light{margin-top:1.5rem;}
.mission-leaves{
  position:absolute;z-index:0;right:-16px;bottom:-22px;
  width:190px;height:auto;pointer-events:none;
}

/* legacy full-width sage band (kept for other pages) */
.band-sage{background:var(--sage-deep);color:var(--cream-on-dark);}
.band-sage .kicker{color:var(--cream-bright);}
.band-sage h2,.band-sage .mission-line{color:var(--cream-bright);}
.mission-line{
  font-family:var(--serif);font-style:italic;font-weight:400;
  font-size:clamp(1.45rem,3.4vw,2.05rem);line-height:1.35;
  max-width:44rem;margin:.9rem auto 0;
}
.mission-copy{max-width:40rem;margin:1.1rem auto 0;color:var(--cream-bright);}
.band-sage .btn-light{margin-top:1.8rem;}

/* ---------- 11 · Page head (guide + utility pages) ---------- */
.page-head{padding-top:2.6rem;text-align:center;}
.crumbs{font-size:.78rem;color:var(--faint);letter-spacing:.04em;}
.crumbs a{color:var(--faint);text-decoration:none;}
.crumbs a:hover{color:var(--terra-deep);}
.crumbs .sep{padding-inline:.45rem;}
.page-head .kicker{margin-top:1.4rem;}
.page-head h1{
  font-family:var(--serif);font-weight:440;
  font-size:clamp(1.95rem,5vw,2.9rem);line-height:1.13;
  max-width:46rem;margin:.7rem auto 0;
}
.dek{max-width:40rem;margin:1rem auto 0;font-size:1.04rem;line-height:1.7;}
.byline{
  margin-top:1rem;
  font-size:.7rem;font-weight:600;
  letter-spacing:.22em;text-indent:.06em;text-transform:uppercase;
  color:var(--faint);
}
.page-hero-img{margin-top:2.2rem;}

/* ---------- 12 · Article prose ---------- */
.prose{max-width:var(--prose);margin-inline:auto;font-size:1.02rem;line-height:1.75;}
.prose > * + *{margin-top:1.15rem;}
.prose h2{
  font-family:var(--serif);font-weight:450;
  font-size:1.7rem;line-height:1.25;
  margin-top:2.9rem;
}
.prose h3{
  font-size:.88rem;font-weight:800;
  letter-spacing:.16em;text-indent:.04em;text-transform:uppercase;
  margin-top:2.3rem;
}
.prose h3::before{
  content:"";display:inline-block;
  width:22px;height:2px;background:var(--terracotta);
  vertical-align:.28em;margin-right:.65rem;
}
.prose strong{color:var(--charcoal);}
.prose ul:not(.checklist){padding-left:1.3rem;}
.prose ul:not(.checklist) li{margin-top:.55rem;}
.prose ul:not(.checklist) li::marker{color:var(--terracotta);}

/* checklist — terracotta checkmarks */
ul.checklist{list-style:none;}
.checklist li{position:relative;padding-left:2rem;margin-top:.85rem;}
.checklist li::before{
  content:"\2713";
  position:absolute;left:.15rem;top:0;
  color:var(--terracotta);font-weight:700;
}
.checklist strong{color:var(--charcoal);}

/* "in this guide" box */
.toc{
  background:var(--card);border-radius:var(--radius);
  box-shadow:0 0 0 1px var(--hair);
  padding:1.4rem 1.6rem;margin-top:2.2rem;
}
.toc-title{
  font-size:.68rem;font-weight:700;
  letter-spacing:.26em;text-indent:.06em;text-transform:uppercase;
  color:var(--faint);
}
.toc ul{list-style:none;margin-top:.7rem;}
.toc li{margin-top:.35rem;}
.toc a{
  color:var(--ink);text-decoration:none;font-size:.96rem;
  border-bottom:1px dashed rgba(196,102,63,.45);
}
.toc a:hover{color:var(--terra-deep);}

/* "our pick" placeholder card */
.pick-card{
  position:relative;
  background:var(--cream-bright);border-radius:var(--radius);
  box-shadow:0 0 0 1px var(--hair), var(--shadow-soft);
  padding:1.5rem 1.7rem;margin-top:2rem;
}
.pick-card::before{
  content:"";position:absolute;inset:8px;pointer-events:none;
  border:1.4px dashed rgba(196,102,63,.5);
  border-radius:calc(var(--radius) - 6px);
}
.pick-kicker{
  font-size:.68rem;font-weight:800;
  letter-spacing:.24em;text-indent:.06em;text-transform:uppercase;
  color:var(--terra-deep);
}
.pick-card h4{
  font-family:var(--serif);font-weight:450;
  font-size:1.28rem;margin-top:.5rem;
}
.pick-card p{margin-top:.45rem;font-size:.95rem;line-height:1.6;color:var(--muted);}

/* tip callout */
.tip{
  background:var(--card);
  border-left:3px solid var(--sage);
  border-radius:0 10px 10px 0;
  padding:1.1rem 1.3rem;
  font-size:.98rem;
}
.tip .tip-label{
  display:block;
  font-size:.66rem;font-weight:800;
  letter-spacing:.24em;text-indent:.06em;text-transform:uppercase;
  color:var(--sage-deep);margin-bottom:.35rem;
}

/* end-of-article cross links */
.next-guides{margin-top:3rem;padding-top:2rem;border-top:1.6px dashed rgba(196,102,63,.4);}
.next-guides .toc-title{color:var(--faint);}
.next-links{display:flex;flex-wrap:wrap;gap:.8rem;margin-top:1rem;}

/* ---------- 13 · Footer ---------- */
.site-footer{background:var(--charcoal);color:var(--cream-on-dark);margin-top:0;}
.footer-grid{display:grid;gap:2.4rem 2rem;padding-block:3rem 2.4rem;}
.footer-brand-row{display:flex;align-items:center;gap:.9rem;}
.footer-seal{
  width:54px;height:54px;border-radius:50%;overflow:hidden;flex:none;
  background:var(--cream);border:1px solid rgba(251,246,236,.4);
}
.footer-seal img{width:100%;height:100%;object-fit:cover;}
.footer-name{
  font-family:var(--display);font-weight:550;
  font-size:1.05rem;letter-spacing:.01em;
  color:var(--cream-bright);
}
.footer-tagline{
  margin-top:.15rem;
  font-family:var(--display);font-style:italic;
  font-size:.85rem;letter-spacing:.02em;
  color:var(--cream-dim);
}
.footer-blurb{margin-top:1.1rem;max-width:20rem;font-size:.9rem;line-height:1.65;color:var(--cream-dim);}
.footer-head{
  font-size:.66rem;font-weight:700;
  letter-spacing:.28em;text-indent:.06em;text-transform:uppercase;
  color:var(--cream-dim);
}
.footer-links{list-style:none;margin-top:.9rem;}
.footer-links a{
  display:inline-block;padding-block:.26rem;
  color:var(--cream-on-dark);text-decoration:none;font-size:.92rem;
}
.footer-links a:hover{color:var(--terra-soft);}
.footer-col{min-width:0;}
.footer-bottom{
  border-top:1px solid rgba(251,246,236,.18);
  padding-block:1.2rem;
  display:flex;flex-wrap:wrap;gap:.5rem 1.6rem;
  align-items:center;justify-content:space-between;
  font-size:.8rem;color:var(--cream-dim);
}
.footer-bottom a{color:var(--cream-dim);text-decoration:none;}
.footer-bottom a:hover{color:var(--terra-soft);}
.footer-legal{display:flex;flex-wrap:wrap;gap:1.2rem;}

/* ---------- 14 · Breakpoints ---------- */
@media (min-width:640px){
  .section{padding-block:3.8rem;}
  .callouts{grid-template-columns:repeat(3,1fr);}
  .card-grid{grid-template-columns:repeat(2,1fr);}
  .footer-grid{grid-template-columns:1fr 1fr;}
  .toc ul{columns:2;column-gap:2.5rem;}

  .room-thumb{width:104px;height:126px;border-radius:64px 64px 12px 12px;}
  .room-index a{grid-template-columns:5.2rem 1fr auto auto;column-gap:1.6rem;}
  .room-index .idx{grid-column:1;grid-row:1 / span 2;align-self:center;font-size:.95rem;}
  .room-index h3{grid-column:2;grid-row:1;align-self:end;}
  .room-index p{grid-column:2;grid-row:2;margin-top:.25rem;}
  .room-index .go{
    display:block;grid-column:3;grid-row:1 / span 2;align-self:center;
    font-family:var(--display);font-size:1.5rem;color:var(--terra-deep);
    transition:transform .2s ease;
  }
  .room-index .room-thumb{grid-column:4;grid-row:1 / span 2;}
  .room-index a:hover .go{transform:translateX(7px);}
}

@media (min-width:820px){
  .feature-card{grid-template-columns:.95fr 1.05fr;align-items:center;}
  .feature-media{margin:1.3rem 0 1.3rem 1.3rem;aspect-ratio:4/3.55;}
  .feature-body{padding:2.4rem 2.8rem;}
  /* Two pillar cards sit side by side; each reverts to the vertical (image-top) form.
     Cards stretch to equal height (aligned bottoms); align-content:start packs each
     card's rows to the top so the image keeps its natural 4:3 (both arches identical)
     and any height difference falls as space at the bottom. */
  .feature-row{grid-template-columns:1fr 1fr;gap:1.7rem;align-items:stretch;}
  .feature-row .feature-card{grid-template-columns:1fr;align-content:start;}
  .feature-row .feature-media{margin:1.5rem 1.5rem 0;aspect-ratio:4/3;}
  .feature-row .feature-body{padding:1.8rem 1.5rem 2rem;}
  .mission-grid{grid-template-columns:1.15fr .85fr;gap:3.2rem;align-items:center;}
}

@media (min-width:1024px){
  /* Four balanced columns: a wider brand column, then Planning, Room Guides, Company. */
  .footer-grid{grid-template-columns:1.7fr 1fr 1fr 1.15fr;}
}

@media (min-width:900px){
  /* header: brand left, 4-item nav right, single row */
  .header-inner{flex-wrap:nowrap;padding-block:1.05rem;}
  .nav-toggle-label{display:none;}
  .site-nav{flex-basis:auto;max-height:none;overflow:visible;}
  .site-nav > ul{
    display:flex;align-items:center;gap:1.7rem;padding:0;
  }
  .site-nav a,
  .nav-drop summary{
    padding:.35rem 0;border-bottom:none;
    font-size:.95rem;
    background:var(--squiggle) no-repeat left calc(100% + 1px) / 0% 6px;
    transition:background-size .25s ease, color .15s ease;
  }
  .site-nav a:hover,
  .nav-drop summary:hover,
  .site-nav a[aria-current="page"]{
    background-size:100% 6px;
  }
  .has-drop{position:relative;}
  .nav-drop .drop-panel{
    position:absolute;top:calc(100% + .85rem);left:-.6rem;
    margin:0;padding:.55rem;border-left:none;
    min-width:15.5rem;z-index:60;
    background-color:var(--cream-bright);
    background-image:var(--grain);
    border-radius:16px;
    box-shadow:0 0 0 1px var(--hair), var(--shadow-lift);
  }
  .nav-drop .drop-panel::before{         /* little stitched top notch */
    content:"";position:absolute;top:-5px;left:1.7rem;
    width:10px;height:10px;transform:rotate(45deg);
    background:var(--cream-bright);
    border-left:1px solid var(--hair);border-top:1px solid var(--hair);
  }
  .drop-panel a{
    padding:.58rem .7rem;border-radius:10px;
    background:none;transition:background-color .15s ease, color .15s ease;
  }
  .drop-panel a:hover{background:var(--cream);color:var(--terra-deep);}
  .drop-panel a[aria-current="page"]{background:var(--cream);}
}

@media (min-width:980px){
  .section{padding-block:4.4rem;}
  .card-grid{grid-template-columns:repeat(3,1fr);}

  .hero{padding-block:3.6rem 3.4rem;}
  .hero-grid{grid-template-columns:1.08fr .92fr;gap:clamp(2.5rem,4.5vw,4.2rem);}
  .hero-art{max-width:430px;margin:0 0 0 auto;}
  .hero-title{margin-top:1.1rem;}

  .manifesto{padding-block:3.2rem 3.6rem;}
  .manifesto-grid{grid-template-columns:.85fr 1.15fr;gap:4rem;align-items:center;}

  .guides{padding-block:3.2rem 4rem;}
  .mission{padding-block:.6rem 4.2rem;}
}

/* ---------- 15 · Utility page head (about · contact · legal) ---------- */
.page-hd{padding-block:2.8rem 0;}
.page-hd-grid{position:relative;display:grid;gap:2.6rem;align-items:center;}

.kicker-stitch{display:inline-flex;align-items:center;gap:.8rem;text-indent:0;}
.kicker-stitch::before{
  content:"";display:inline-block;width:44px;
  border-top:1.6px dashed rgba(196,102,63,.55);
}

.page-hd .crumbs{margin-bottom:1.4rem;}
.page-hd .kicker{margin-top:0;}
.page-hd h1{
  font-family:var(--display);font-weight:440;
  font-size:clamp(2.05rem,3vw + .8rem,3.1rem);line-height:1.1;
  letter-spacing:-.005em;margin-top:.75rem;max-width:20ch;
}
.page-hd .dek{margin:1.15rem 0 0;max-width:36rem;font-size:1.05rem;line-height:1.72;}
.page-hd .byline{margin-top:1.15rem;}

/* italic sage word with the hand-drawn terracotta squiggle beneath */
.em-squiggle{
  font-style:italic;color:var(--sage-deep);
  background:var(--squiggle) no-repeat left bottom / 100% 6px;
  padding-bottom:6px;
}

/* corner leaf sprig for heads without an image */
.hd-sprig{
  position:absolute;right:0;top:.2rem;
  width:52px;height:auto;pointer-events:none;
}

/* art column (about) — arch photo reuses .hero-art/.arch-frame */
.page-hd-art{margin-top:.4rem;}
.page-hd-art .arch-frame{aspect-ratio:5/5.4;}

.page-hd-wave{margin-top:2.4rem;}

@media (min-width:900px){
  .page-hd{padding-block:3.4rem 0;}
  .page-hd-grid.has-art{grid-template-columns:1.12fr .88fr;gap:clamp(2.5rem,4vw,4rem);}
  .hd-sprig{width:64px;right:.5rem;}
}

/* ---------- 16 · Guide pages (room guides) ---------- */
/* Guide titles run longer than utility-page titles — ease the size, widen the measure */
.guide-hd h1{
  font-size:clamp(1.85rem,2.2vw + .7rem,2.6rem);
  max-width:24ch;
}
.guide-hd .dek{max-width:34rem;}

/* hand-stitched "in this guide" box */
.guide-article .toc{
  background:var(--cream-bright);
  box-shadow:none;
  border:1.6px dashed rgba(196,102,63,.5);
  border-radius:18px;
}

@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto;}
  *,*::before,*::after{transition:none !important;animation:none !important;}
  .hero-title .circled .scribble path{stroke-dashoffset:0;}
}

/* ---------- 17 · Guide skimmability: quick-five summary + section figures ---------- */

/* "the 5 you actually need" — scannable summary card */
.quick-five{
  background:var(--cream-bright);
  border-radius:var(--radius);
  box-shadow:0 0 0 1px var(--hair), var(--shadow-soft);
  border-top:3px solid var(--terracotta);
  padding:1.45rem 1.7rem 1.55rem;
  margin-top:1.6rem;
}
.quick-five-kicker{
  font-size:.68rem;font-weight:800;
  letter-spacing:.24em;text-indent:.06em;text-transform:uppercase;
  color:var(--terra-deep);
}
.quick-five ol{list-style:none;margin-top:.9rem;counter-reset:qf;}
.quick-five li{
  counter-increment:qf;
  position:relative;padding-left:2.2rem;margin-top:.6rem;
  font-size:.97rem;line-height:1.6;
}
.quick-five li::before{
  content:counter(qf,decimal-leading-zero);
  position:absolute;left:.1rem;top:.18em;
  font-family:var(--display);font-weight:600;
  font-size:.8rem;letter-spacing:.05em;
  color:var(--terra-deep);
}
.quick-five li strong{color:var(--charcoal);}
.quick-five-note{
  margin-top:1rem;
  font-family:var(--display);font-style:italic;
  font-size:.88rem;color:var(--faint);
}

/* full-column section figure — arch corners; hides itself while the image file is missing */
.guide-figure{margin-top:2rem;}
.guide-figure img{
  display:block;width:100%;height:auto;
  aspect-ratio:3/2;object-fit:cover;
  border-radius:46px 46px 14px 14px;
  box-shadow:0 0 0 1px var(--hair), var(--shadow-soft);
  background:var(--card);
}

/* ---------- 18 · Inline "pick coming soon" chip (replaces the old promo-style pick-cards in guides; .pick-card itself still styles the contact-page card) ---------- */
.pick-chip{
  display:inline-flex;align-items:center;gap:.5rem;
  margin-top:.85rem;
  padding:.32rem .85rem .36rem;
  border:1.4px dashed rgba(196,102,63,.55);
  border-radius:999px;
  background:var(--cream-bright);
  font-size:.66rem;font-weight:800;
  letter-spacing:.16em;text-indent:.02em;text-transform:uppercase;
  color:var(--terra-deep);
  line-height:1.4;
}
.pick-chip::before{
  content:"";flex:none;
  width:.45rem;height:.45rem;border-radius:50%;
  background:var(--terracotta);opacity:.75;
}

/* ---------- 19 · Guide FAQ — stitched native-details accordion (matches the nav-drop pattern) ---------- */
.faq-list{border-top:1.6px dashed rgba(196,102,63,.45);}
.faq-item{border-bottom:1.6px dashed rgba(196,102,63,.45);}
.faq-item summary{
  list-style:none;cursor:pointer;
  display:flex;align-items:center;justify-content:space-between;gap:1.1rem;
  padding:1.05rem .15rem;
}
.faq-item summary::-webkit-details-marker{display:none;}
.faq-q{
  font-family:var(--serif);font-weight:500;
  font-size:1.07rem;line-height:1.4;color:var(--charcoal);
  transition:color .15s ease;
}
.faq-item summary:hover .faq-q{color:var(--terra-deep);}
.faq-chev{
  width:13px;height:13px;flex:none;
  color:var(--terra-deep);
  transition:transform .2s ease;
}
.faq-item[open] > summary .faq-chev{transform:rotate(180deg);}
.faq-item[open] > summary .faq-q{color:var(--terra-deep);}
.faq-a{padding:0 .15rem 1.2rem;}
.faq-a p{max-width:40rem;font-size:.97rem;line-height:1.7;}
.faq-a p + p{margin-top:.6rem;}

/* ---------- 20 · Product pick card — filled + coming-soon states ----------
   Filled = solid card, sticker flag, terracotta CTA.
   Coming-soon (.pick--soon) = same silhouette, hand-stitched dashed outline
   ("not sewn in yet" — same semantics as empty .img-slot frames).
   Compliance: name + why-line + CTA only — never price/stars/reviews/badges. */
.pick{
  position:relative;
  background:var(--cream-bright);
  border-radius:var(--radius);
  box-shadow:0 0 0 1px var(--hair), var(--shadow-soft);
  padding:1.55rem 1.6rem 1.5rem;
  margin-top:1.7rem;
}
.pick-flag{
  position:absolute;top:-.8rem;left:1.15rem;
  display:inline-block;transform:rotate(-2deg);
  background:var(--terra-deep);color:var(--paper);
  font-size:.62rem;font-weight:800;
  letter-spacing:.22em;text-indent:.05em;text-transform:uppercase;
  padding:.42rem .8rem;border-radius:3px;
  box-shadow:0 3px 8px rgba(40,16,6,.22);
}
.pick-name{
  font-family:var(--serif);font-weight:520;
  font-size:1.24rem;line-height:1.25;color:var(--charcoal);
}
.pick-why{margin-top:.5rem;font-size:.95rem;line-height:1.62;color:var(--muted);}
.pick-cta{
  display:inline-block;margin-top:1.05rem;
  background:var(--terra-deep);color:#fff;
  font-size:.72rem;font-weight:700;
  letter-spacing:.15em;text-indent:.04em;text-transform:uppercase;
  text-decoration:none;
  padding:.72rem 1.35rem;border-radius:999px;
  box-shadow:0 8px 18px rgba(196,102,63,.28), 0 2px 5px rgba(169,82,47,.2);
  transition:background-color .15s ease, transform .15s ease;
}
.pick-cta:hover{background:#8F4526;color:#fff;transform:translateY(-2px);}
.pick-cta .arrow{letter-spacing:0;margin-left:.45rem;}

.pick--soon{
  box-shadow:none;
  border:1.6px dashed rgba(196,102,63,.5);
}
.pick--soon .pick-flag{
  background:var(--cream-bright);color:var(--terra-deep);
  border:1.4px dashed rgba(196,102,63,.55);
  box-shadow:none;
}
.pick--soon .pick-name{color:var(--muted);}
.pick--soon .pick-why{
  font-family:var(--serif);font-style:italic;
  font-size:.92rem;color:var(--faint);
}

/* consecutive guide picks sit side-by-side instead of stacking (2-up; collapses to 1 on mobile) */
.pick-grid{
  display:grid;grid-template-columns:repeat(2,1fr);
  gap:1.7rem;margin-top:1.7rem;
}
.pick-grid .pick{margin-top:0;display:flex;flex-direction:column;}
.pick-grid .pick .pick-why{margin-bottom:1.05rem;}
.pick-grid .pick .pick-cta{margin-top:auto;align-self:flex-start;}
@media (max-width:640px){.pick-grid{grid-template-columns:1fr;}}

/* affiliate-disclosure micro-note — sits near a guide's picks */
.affiliate-note{
  margin-top:2.2rem;
  font-family:var(--serif);font-style:italic;
  font-size:.9rem;line-height:1.65;color:var(--faint);
}
.affiliate-note::before{
  content:"";display:inline-block;
  width:30px;margin-right:.65rem;
  border-top:1.6px dashed rgba(196,102,63,.55);
  vertical-align:.32em;
}
.affiliate-note a{
  color:var(--terra-deep);text-decoration:none;
  border-bottom:1px dashed rgba(196,102,63,.45);
}
.affiliate-note a:hover{border-bottom-style:solid;}

/* ============================================================
   Our Picks hub — .picks-* components (reusable on roundup pages)
   ============================================================ */

/* how-we-pick intro */
.picks-intro{max-width:var(--prose);margin-inline:auto;}
.picks-intro p{margin-top:1rem;font-size:1.02rem;line-height:1.75;}
.picks-stats{display:flex;flex-wrap:wrap;gap:.6rem;margin-top:1.35rem;}
.picks-stats .pick-chip{margin-top:0;}
.picks-intro .affiliate-note{margin-top:1.7rem;}

/* room section head — idx + serif title + stitched rule running out */
.picks-section{margin-top:3.2rem;}
.picks-section:first-of-type{margin-top:0;}
.picks-head{display:flex;align-items:baseline;gap:1.1rem;}
.picks-head .idx{
  font-family:var(--display);font-style:italic;font-weight:500;
  font-size:.95rem;color:var(--terra-deep);white-space:nowrap;
}
.picks-head h2{
  font-family:var(--display);font-weight:470;
  font-size:clamp(1.5rem,1.8vw + .7rem,2rem);line-height:1.15;
}
.picks-head .rule{
  flex:1;align-self:center;margin-top:.55rem;
  border-top:1.6px dashed rgba(196,102,63,.4);
}
.picks-sub{
  margin-top:.45rem;
  font-family:var(--display);font-style:italic;
  font-size:.98rem;color:var(--faint);
}

/* the pick cards */
.picks-grid{display:grid;gap:1.7rem;margin-top:1.9rem;}
/* Full-width single-column card stack (furniture checklist) — matches the guides,
   which render pick cards one per row rather than 2-up. */
.picks-stack{display:grid;gap:1.7rem;margin-top:1.9rem;}
.picks-card{
  position:relative;
  display:flex;flex-direction:column;
  background:var(--cream-bright);
  border-radius:var(--radius);
  box-shadow:0 0 0 1px var(--hair), var(--shadow-soft);
  transition:transform .18s ease, box-shadow .18s ease;
}
.picks-card:hover{
  transform:translateY(-4px);
  box-shadow:0 0 0 1px var(--hair), var(--shadow-lift);
}
.picks-card .pick-flag{z-index:3;}
.picks-media{
  margin:1.05rem 1.05rem 0;
  border-radius:52px 52px 10px 10px;
}
.picks-media::before{border-radius:46px 46px 6px 6px;}
.picks-media::after{font-size:.9rem;}
.picks-body{
  flex:1;display:flex;flex-direction:column;align-items:flex-start;
  padding:1.2rem 1.4rem 1.5rem;
}
.picks-room{
  font-size:.62rem;font-weight:800;
  letter-spacing:.24em;text-indent:.06em;text-transform:uppercase;
  color:var(--faint);margin-bottom:.45rem;
}
.picks-variant{
  display:block;
  font-family:var(--display);font-style:italic;font-weight:400;
  font-size:.86rem;letter-spacing:.02em;color:var(--terra-deep);
  margin-top:.25rem;
}
.picks-body .pick-why{margin-bottom:1.15rem;}
.picks-body .pick-cta{margin-top:auto;}
/* Per-product-type line icon, top-left of every pick card (hand-drawn set). */
.pick-icon{
  display:block;width:32px;height:32px;
  color:var(--terra-deep);
  margin-bottom:.6rem;
}
.pick-icon svg{display:block;width:100%;height:100%;}

@media (min-width:720px){
  .picks-grid{grid-template-columns:repeat(2,1fr);}
  .picks-card--wide{
    grid-column:1 / -1;
    display:grid;grid-template-columns:.85fr 1.15fr;align-items:center;
  }
  .picks-card--wide .picks-media{margin:1.05rem 0 1.05rem 1.05rem;height:calc(100% - 2.1rem);aspect-ratio:auto;min-height:250px;}
  .picks-card--wide .picks-body{padding:1.7rem 2rem;}
}

/* ============================================================
   What to Buy for a New Home — essentials system
   .room-bar (shop-by-room) + .ess-* item treatments.
   Extends the Our Picks .picks-* card family: one item = one
   treatment — full card (researched pick — text-forward, NO product
   image until PA-API unlocks at 3 sales; see spec §6.2),
   review-flagged card (no CTA), or compact guidance row.
   Compliance: price BANDS as plain words only — never a price,
   star rating, review count, or Amazon badge.
   ============================================================ */

/* ---------- 21 · Shop-by-room bar ---------- */
.room-bar{
  margin-top:2.2rem;
  display:flex;flex-wrap:wrap;align-items:center;column-gap:1rem;row-gap:0;
}
.room-bar-label{
  flex:none;white-space:nowrap;
  font-size:.66rem;font-weight:800;
  letter-spacing:.18em;text-indent:.06em;text-transform:uppercase;
  color:var(--faint);
}
.room-bar-list{
  list-style:none;
  display:flex;flex-wrap:nowrap;overflow-x:auto;gap:.4rem;
  flex:1 1 auto;min-width:0;
  /* vertical padding gives the hover lift (translateY) room so the chip
     border isn't clipped by the horizontal-scroll container's overflow */
  margin-top:0;padding:.45rem 0;
  scrollbar-width:thin;-webkit-overflow-scrolling:touch;
}
.room-bar-list li{flex:none;}
.room-link{
  display:inline-flex;align-items:center;gap:.4rem;
  padding:.44rem .74rem .48rem;
  background:var(--cream-bright);
  border:1.5px solid rgba(52,50,45,.28);border-radius:999px;
  font-size:.71rem;font-weight:700;
  letter-spacing:.05em;text-indent:.02em;text-transform:uppercase;
  color:var(--charcoal);text-decoration:none;line-height:1.3;white-space:nowrap;
  transition:border-color .15s ease, color .15s ease, transform .15s ease;
}
a.room-link:hover{border-color:var(--terracotta);color:var(--terra-deep);transform:translateY(-2px);}
.room-link--soon{                 /* disabled entry — a <span>, never an <a> */
  border-style:dashed;border-color:rgba(196,102,63,.5);
  background:transparent;color:var(--faint);
}
.room-link-tag{
  font-family:var(--serif);font-style:italic;font-weight:400;
  font-size:.82rem;letter-spacing:.02em;text-transform:none;text-indent:0;
  color:var(--terra-deep);
}

/* filter state — the room bar doubles as the What-to-Buy room filter.
   Controls are real hash links (progressive enhancement); the pressed
   one fills terracotta, matching .btn-primary. */
a.room-link[aria-pressed="true"]{
  background:var(--terra-deep);border-color:var(--terra-deep);
  color:var(--paper);
}
a.room-link[aria-pressed="true"]:hover{
  border-color:var(--terra-deep);color:var(--paper);
}
.room-bar-status,
.room-bar-noscript{
  flex-basis:100%;
  margin-top:.7rem;
  font-family:var(--serif);font-style:italic;
  font-size:.94rem;line-height:1.55;color:var(--muted);
}

/* Sticky bottom shop-by-room bar (What to Buy) — a persistent filter that
   slides up once the in-page bar scrolls out of view, so users don't have to
   scroll back up to switch rooms. Shares chips with the primary bar. */
.room-bar-sticky{
  position:fixed;left:0;right:0;bottom:0;z-index:60;
  display:flex;align-items:center;gap:.85rem;
  padding:.6rem clamp(.9rem,4vw,2rem);
  background:var(--paper);
  border-top:1.5px solid rgba(52,50,45,.16);
  box-shadow:0 -7px 22px rgba(52,50,45,.13);
  transform:translateY(115%);pointer-events:none;
  transition:transform .24s ease;
}
.room-bar-sticky.is-visible{transform:translateY(0);pointer-events:auto;}
.room-bar-sticky-label{
  flex:none;
  font-size:.62rem;font-weight:800;letter-spacing:.2em;text-transform:uppercase;
  color:var(--faint);
}
.room-bar-list--sticky{margin-top:0;padding-bottom:0;flex:1 1 auto;min-width:0;}
@media (max-width:560px){ .room-bar-sticky-label{display:none;} }
@media (prefers-reduced-motion:reduce){ .room-bar-sticky{transition:none;} }

/* New Home Checklist — per-room "featured" showcase label + funnel link */
.featured-head{
  margin:1.9rem 0 1.1rem;
  font-size:.7rem;font-weight:800;letter-spacing:.18em;text-transform:uppercase;
  color:var(--terra-deep);
}
.featured-more{margin:.2rem 0 2.4rem;}
.featured-more a{
  font-family:var(--serif);font-style:italic;font-size:1.02rem;
  color:var(--terra-deep);text-decoration:none;
  border-bottom:1px solid rgba(160,82,52,.35);
}
.featured-more a:hover{border-bottom-color:currentColor;}

/* muted per-tier empty note — shown by JS when a room filter leaves a
   tier with no visible items; the tier heading itself never hides */
.tier-empty-note{
  margin-top:1.6rem;
  font-family:var(--serif);font-style:italic;
  font-size:.95rem;line-height:1.6;color:var(--muted);
}

/* filtered-out items: author display rules (e.g. .picks-card{display:flex})
   would otherwise beat the UA's [hidden]{display:none} */
.ess-card[hidden],
.ess-row[hidden],
.ess-rows[hidden],
.tier-empty-note[hidden]{display:none !important;}

/* ---------- 22 · Status + price-band chips (text-first, wrap-safe) ---------- */
.ess-chips{display:flex;flex-wrap:wrap;gap:.45rem;margin-top:.75rem;}
.ess-chip{
  display:inline-flex;align-items:center;gap:.4rem;
  padding:.28rem .7rem .32rem;
  border:1.4px solid rgba(52,50,45,.22);border-radius:999px;
  background:var(--cream-bright);
  font-size:.62rem;font-weight:800;
  letter-spacing:.16em;text-indent:.02em;text-transform:uppercase;
  color:var(--muted);line-height:1.45;
}
.ess-chip--band{border-color:rgba(127,144,104,.55);color:var(--sage-deep);}
.ess-chip--guidance{border-color:rgba(127,144,104,.55);background:rgba(127,144,104,.14);color:#54633F;}  /* darker sage: 5.3:1 on the tinted fill (sage-deep was 4.3 — under AA) */
.ess-chip--soon{border-style:dashed;border-color:rgba(196,102,63,.55);color:var(--terra-deep);}
/* tier chip (guide Essential-picks cards only) — a DIFFERENT axis from the
   outlined price-band chip: soft FILLED sage-greige pill, charcoal text,
   text-only (no color scheme, no icon). */
.ess-chip-tier{border-color:transparent;background:rgba(127,144,104,.16);color:var(--charcoal);}

/* ---------- 23 · Full essential card (extends .picks-card) ----------
   TEXT-FORWARD: no media column, no product image, no placeholder panel
   (PA-API is the only sanctioned image source and unlocks at 3 sales).
   The "Our pick" sticker flag hangs off the card's top-left edge — the
   same treatment the imageless guide .pick cards already use. */
.ess-card{margin-top:2rem;}
.ess-card .picks-body{padding:1.5rem 1.55rem 1.6rem;}
.ess-card .pick-why{margin-top:.85rem;margin-bottom:0;}
/* keep reading measures airy on the wide master page (cards span the
   container there; guide cards already sit in the 44rem prose column) */
.picks-section .ess-card .pick-why{max-width:46rem;}
.ess-details .ess-facts dd{max-width:46rem;}

/* Best for / Not ideal for / Main tradeoff — also reused inside <details>
   for Dimensions / Care / Cheaper alternative / Secondhand */
.ess-facts{width:100%;margin-top:1.05rem;}
.ess-facts > div{
  display:grid;grid-template-columns:8rem 1fr;gap:.15rem 1rem;
  padding-block:.6rem;
  border-top:1px dashed rgba(52,50,45,.18);
}
.ess-facts > div:last-child{border-bottom:1px dashed rgba(52,50,45,.18);}
.ess-facts dt{
  font-size:.63rem;font-weight:800;
  letter-spacing:.18em;text-indent:.02em;text-transform:uppercase;
  color:var(--terra-deep);padding-top:.32em;
}
.ess-facts dd{font-size:.93rem;line-height:1.6;color:var(--ink);}
@media (max-width:520px){
  .ess-facts > div{grid-template-columns:1fr;}
  .ess-facts dt{padding-top:0;}
}

/* native <details> — "More details ▾" */
.ess-details{width:100%;margin-top:1.05rem;margin-bottom:1.5rem;}
.ess-details summary{
  list-style:none;cursor:pointer;
  display:inline-flex;align-items:center;gap:.45rem;
  font-size:.7rem;font-weight:800;
  letter-spacing:.18em;text-indent:.04em;text-transform:uppercase;
  color:var(--terra-deep);
  padding:.35rem 0;
  border-bottom:1.4px dashed rgba(196,102,63,.5);
}
.ess-details summary::-webkit-details-marker{display:none;}
.ess-details summary:hover{border-bottom-style:solid;}
.ess-caret{font-size:.9em;transition:transform .2s ease;}
.ess-details[open] > summary .ess-caret{transform:rotate(180deg);}
.ess-details .ess-facts{margin-top:.75rem;}

/* needs-review state — sage ring + sage flag, CTA replaced by a note */
.ess-card--review,
.ess-card--review:hover{
  transform:none;
  box-shadow:0 0 0 1.6px rgba(95,113,71,.6), var(--shadow-soft);
}
.pick-flag--review{background:var(--sage-deep);color:var(--cream-bright);}
.ess-review-note{
  margin-top:1.15rem;
  font-family:var(--serif);font-style:italic;
  font-size:.92rem;line-height:1.6;color:var(--sage-deep);
}
.ess-review-note::before{
  content:"";display:inline-block;width:26px;margin-right:.6rem;
  border-top:1.6px dashed rgba(95,113,71,.55);
  vertical-align:.32em;
}

/* ---------- 24 · Compact rows (guidance-only · pick coming soon) ---------- */
.ess-rows{
  list-style:none;margin-top:2.1rem;
  border-top:1.6px dashed rgba(196,102,63,.4);
}
.ess-row{
  padding:1.2rem .1rem 1.35rem;
  border-bottom:1.6px dashed rgba(196,102,63,.4);
}
.ess-row-head{display:flex;flex-wrap:wrap;align-items:center;gap:.5rem .6rem;}
.ess-row-name{
  font-family:var(--serif);font-weight:520;
  font-size:1.14rem;line-height:1.3;color:var(--charcoal);
  margin-right:.4rem;
}
.ess-row-why{margin-top:.45rem;font-size:.94rem;line-height:1.62;color:var(--muted);max-width:46rem;}
.ess-row-tip{margin-top:.5rem;font-size:.9rem;line-height:1.6;color:var(--ink);max-width:46rem;}
.ess-tip-label{
  font-size:.62rem;font-weight:800;
  letter-spacing:.18em;text-indent:.02em;text-transform:uppercase;
  color:var(--sage-deep);margin-right:.45rem;
}
.ess-row-tip--warn .ess-tip-label{color:var(--terra-deep);}

/* ---------- 24b · Ess components inside guide prose ----------
   Room guides render the same .ess-card / .ess-row components inside
   .prose articles — neutralize the prose element rules that would
   otherwise restyle them (list padding/margins, strong color, spacing). */
.prose .ess-card{margin-top:2rem;}
.prose ul.ess-rows{padding-left:0;margin-top:2.1rem;}
.prose ul.ess-rows > li{margin-top:0;}
.prose .ess-tip-label{color:var(--sage-deep);}
.prose .ess-row-tip--warn .ess-tip-label{color:var(--terra-deep);}

/* ---------- 25 · Essentials breakpoints ---------- */
@media (min-width:760px){
  .ess-card .picks-body{padding:1.7rem 2rem 1.8rem;}
}

/* master What-to-Buy page only (.picks-section — guide cards live in the
   44rem .prose column and keep stacked label rows): the three headline
   facts sit side by side, using the width the photo used to hold */
@media (min-width:860px){
  .picks-section .ess-card .picks-body > .ess-facts{
    display:grid;grid-template-columns:repeat(3,1fr);column-gap:2.4rem;
  }
  .picks-section .ess-card .picks-body > .ess-facts > div{
    grid-template-columns:1fr;gap:.35rem 0;align-content:start;
    border-bottom:1px dashed rgba(52,50,45,.18);
  }
  .picks-section .ess-card .picks-body > .ess-facts dt{padding-top:0;}
}

/* ---------- 26 · What-to-Buy hero + UX refinements ---------- */

/* day-one jump CTA — sits directly under the dek, above everything else */
.day-one-cta{margin-top:1.7rem;}
.page-hd .affiliate-note{margin-top:1.5rem;}

/* jump target breathing room for #tier-* anchors */
.picks-head h2{scroll-margin-top:1.4rem;}

/* graceful hero placeholder — shows only while guide-what-to-buy.webp
   is missing (img onerror flags the frame); never a broken-image icon */
.hero-art:has(.arch-frame--ph){width:100%;}  /* the hidden broken img gives no intrinsic
                              width, so .hero-art's auto margins would shrink-wrap it to 0;
                              stretch to the grid column (max-width still caps it) */
.arch-frame--ph{
  background:linear-gradient(165deg,var(--cream-bright) 0%,var(--cream) 55%,rgba(127,144,104,.22) 135%);
}
.arch-frame--ph img{display:none;}
.arch-ph{
  position:absolute;inset:0;display:none;
  flex-direction:column;align-items:center;justify-content:center;gap:1rem;
  padding:2.2rem;text-align:center;
}
.arch-ph::before{
  content:"";position:absolute;inset:12px;pointer-events:none;
  border:1.5px dashed rgba(127,144,104,.5);
  border-radius:var(--arch) var(--arch) 12px 12px;
}
.arch-ph svg{width:62px;height:auto;opacity:.9;}
.arch-ph-word{
  font-family:var(--serif);font-style:italic;
  font-size:1.02rem;letter-spacing:.02em;color:var(--sage-deep);
}
.arch-frame--ph .arch-ph{display:flex;}

/* "How we pick" — collapsed to a compact native details */
.picks-intro-fold{margin-top:2rem;}
.picks-intro-fold summary{
  list-style:none;cursor:pointer;
  display:inline-flex;align-items:center;gap:.5rem;
  font-size:.72rem;font-weight:800;
  letter-spacing:.18em;text-indent:.04em;text-transform:uppercase;
  color:var(--terra-deep);
  padding:.4rem 0;
  border-bottom:1.4px dashed rgba(196,102,63,.5);
}
.picks-intro-fold summary::-webkit-details-marker{display:none;}
.picks-intro-fold summary:hover{border-bottom-style:solid;}
.picks-intro-fold .ess-caret{font-size:.9em;transition:transform .2s ease;}
.picks-intro-fold[open] > summary .ess-caret{transform:rotate(180deg);}
.picks-intro-fold p{margin-top:.9rem;font-size:.98rem;}
.picks-intro-fold .picks-stats{margin-top:1rem;}

/* tier heading meta — quiet count line under each h2 */
.tier-meta{
  margin-top:.55rem;
  font-size:.64rem;font-weight:700;
  letter-spacing:.2em;text-indent:.02em;text-transform:uppercase;
  color:var(--faint);
}

/* back-to-top — light footer link on each tier */
.back-top{margin-top:1.9rem;text-align:right;}
.back-top a{
  display:inline-block;
  font-size:.66rem;font-weight:800;
  letter-spacing:.18em;text-indent:.04em;text-transform:uppercase;
  color:var(--terra-deep);text-decoration:none;
  padding-bottom:.25rem;
  border-bottom:1.4px dashed rgba(196,102,63,.5);
}
.back-top a:hover{border-bottom-style:solid;}

/* ---------- 27 · Guide editorial callouts (Phase 6) ----------
   Two hand-authored blocks per room guide, sitting between the narrative
   and the data-driven picks region. Prose, not data — no affiliate links,
   prices, or product images inside either one.
   .guide-adjust  = "Adjust for your home" — friendly/advisory, airy sage wash.
   .guide-safety  = room safety — prominent but CALM: cream card, terracotta
                    ring + a small shield icon. Never alarm-red. */

.guide-callout-kicker{
  display:block;
  font-size:.66rem;font-weight:800;
  letter-spacing:.24em;text-indent:.06em;text-transform:uppercase;
}

/* "Adjust for your home" — soft sage panel, hand-stitched border */
.guide-adjust{
  background:rgba(127,144,104,.11);
  border:1.5px solid rgba(127,144,104,.35);
  border-radius:18px;
  padding:1.55rem 1.7rem 1.6rem;
  margin-top:2rem;
}
.guide-adjust .guide-callout-kicker{color:var(--sage-deep);}
.guide-adjust h2{
  font-family:var(--serif);font-weight:470;
  font-size:1.42rem;line-height:1.2;
  margin-top:.45rem;
}
.guide-adjust-intro{margin-top:.6rem;font-size:.97rem;line-height:1.65;color:var(--muted);}
.guide-adjust-list{list-style:none;margin-top:1.05rem;}
.prose ul.guide-adjust-list{padding-left:0;}
.guide-adjust-list li,
.prose ul.guide-adjust-list li{
  position:relative;padding-left:1.7rem;margin-top:.75rem;
  font-size:.96rem;line-height:1.62;
}
.guide-adjust-list li::before{
  content:"\2192";                       /* small sage arrow: if → then */
  position:absolute;left:.05rem;top:0;
  color:var(--sage-deep);font-weight:700;
}
.guide-adjust-list li strong{color:var(--charcoal);}

/* safety callout — the more prominent block, kept calm + on-brand */
.guide-safety{
  background:var(--cream-bright);
  border-radius:18px;
  box-shadow:0 0 0 1.6px rgba(196,102,63,.55), var(--shadow-soft);
  padding:1.6rem 1.7rem 1.4rem;
  margin-top:1.9rem;
}
.guide-safety-head{display:flex;align-items:center;gap:1rem;}
.guide-safety-icon{
  width:46px;height:46px;flex:none;
  display:grid;place-items:center;
  background:rgba(196,102,63,.12);
  border-radius:56% 44% 52% 48% / 50% 56% 44% 50%;   /* organic pebble, echoes .mark */
  color:var(--terra-deep);
}
.guide-safety-icon svg{width:23px;height:23px;}
.guide-safety .guide-callout-kicker{color:var(--terra-deep);}
.guide-safety h2{
  font-family:var(--serif);font-weight:490;
  font-size:1.42rem;line-height:1.2;
  margin-top:.3rem;
}
.guide-safety-list{list-style:none;margin-top:1.1rem;}
.prose ul.guide-safety-list{padding-left:0;}
.guide-safety-list li,
.prose ul.guide-safety-list li{
  position:relative;padding-left:1.7rem;margin-top:.85rem;
  font-size:.96rem;line-height:1.64;
}
.guide-safety-list li::before{
  content:"";position:absolute;left:.15rem;top:.6em;
  width:.48rem;height:.48rem;border-radius:50%;
  background:var(--terracotta);opacity:.75;
}
.guide-safety-list li strong{color:var(--charcoal);}
.guide-safety-defer{
  margin-top:1.1rem;
  font-size:.92rem;line-height:1.6;color:var(--muted);
}
.guide-safety-reviewed{
  margin-top:1.15rem;padding-top:.85rem;
  border-top:1.6px dashed rgba(196,102,63,.4);
  font-family:var(--serif);font-style:italic;
  font-size:.85rem;letter-spacing:.01em;color:var(--faint);
}

/* inline one-line safety reminder — sits inside the narrative beside the
   relevant decision; a quiet aside, never a box */
.safety-note{
  font-family:var(--serif);font-style:italic;
  font-size:.93rem;line-height:1.6;color:var(--terra-deep);
}
.safety-note::before{
  content:"";display:inline-block;width:26px;margin-right:.6rem;
  border-top:1.6px dashed rgba(196,102,63,.55);
  vertical-align:.32em;
}

/* ---------- 28 · Home Safety & Setup: "before the first night" checklist ----------
   A do-these-first action list (editorial, not data) — hand-drawn empty
   checkboxes on a cream card, calm not alarmed. Used only on
   home-safety-setup.html. */
.first-night-checklist{
  background:var(--cream-bright);
  border-radius:18px;
  box-shadow:0 0 0 1.5px rgba(127,144,104,.45), var(--shadow-soft);
  padding:1.55rem 1.7rem 1.6rem;
  margin-top:2.3rem;
}
.first-night-checklist .guide-callout-kicker{color:var(--sage-deep);}
.first-night-checklist h2{
  font-family:var(--serif);font-weight:470;
  font-size:1.42rem;line-height:1.2;
  margin-top:.45rem;
}
.fnc-intro{margin-top:.55rem;font-size:.95rem;line-height:1.6;color:var(--muted);}
.fnc-list{
  list-style:none;margin-top:1.15rem;
  display:grid;grid-template-columns:1fr 1fr;gap:.85rem 1.8rem;
}
.prose ul.fnc-list{padding-left:0;}
.fnc-list li,
.prose ul.fnc-list li{
  position:relative;padding-left:1.85rem;margin-top:0;
  font-size:.95rem;line-height:1.58;
}
.fnc-list li::before{
  content:"";position:absolute;left:.05rem;top:.28em;
  width:.9rem;height:.9rem;
  border:1.6px solid rgba(196,102,63,.6);
  border-radius:5px 4px 6px 4px / 4px 6px 4px 5px;   /* slightly wobbly, hand-drawn */
  background:rgba(196,102,63,.06);
}
.fnc-list li strong{color:var(--charcoal);}
.fnc-note{
  margin-top:1.15rem;padding-top:.85rem;
  border-top:1.6px dashed rgba(127,144,104,.45);
  font-family:var(--serif);font-style:italic;
  font-size:.88rem;letter-spacing:.01em;color:var(--faint);
}
@media (max-width:640px){
  .fnc-list{grid-template-columns:1fr;}
}

/* ---------- 29 · New guide pages: diagrams, worksheet, checklists, moving timeline ---------- */
/* Explanatory diagrams (measuring guide) */
.measure-guide-page .guide-article{--prose:48rem;}
.diagram{position:relative;margin:2.35rem 0 2.7rem;padding:1.15rem 1.15rem 1.25rem;background:linear-gradient(145deg,rgba(255,247,238,.96),rgba(248,242,230,.76));border:1px solid rgba(169,82,47,.2);border-radius:26px 26px 10px 26px;box-shadow:0 18px 45px rgba(52,50,45,.08);overflow:hidden;isolation:isolate;}
.diagram::before{content:"01";position:absolute;right:1.05rem;top:.58rem;font-family:var(--display);font-size:3.8rem;line-height:1;color:rgba(196,102,63,.09);z-index:-1;}
.diagram:nth-of-type(2)::before{content:"02"}.diagram:nth-of-type(3)::before{content:"03"}.diagram:nth-of-type(4)::before{content:"04"}
.diagram::after{content:"MEASURE NOTE";display:block;width:max-content;margin:.8rem 0 .45rem;padding:.18rem .55rem;border-radius:999px;background:rgba(127,144,104,.13);color:var(--sage-deep);font-size:.66rem;font-weight:800;letter-spacing:.13em;}
.diagram svg{width:100%;height:auto;max-width:620px;display:block;margin-inline:auto;border:0;border-radius:18px;background:#fbf6ec;box-shadow:inset 0 0 0 1px rgba(52,50,45,.09);}
.guide-diagram-image{width:100%;height:auto;display:block;border-radius:18px;box-shadow:inset 0 0 0 1px rgba(52,50,45,.09);}
.floorplan-route-visual,.delivery-route-visual{position:relative;}
.floorplan-route-visual>svg,.delivery-route-visual>svg{position:absolute;inset:0;width:100%;height:100%;max-width:none;margin:0;border:0;background:transparent;box-shadow:none;pointer-events:none;}
.diagram figcaption{margin:0;font-size:.94rem;line-height:1.65;color:var(--muted);max-width:42rem;}
.diagram figcaption strong{color:var(--charcoal);}
.measure-guide-page .worksheet-wrap{border-radius:22px;box-shadow:0 18px 44px rgba(52,50,45,.08);}

/* Interactive checkbox lists (measuring worksheet + moving timeline) */
.check-list{list-style:none;margin:1rem 0;display:grid;gap:.55rem;}
.check-list li{margin:0;}
.check-list label{display:block;position:relative;padding-left:1.75rem;cursor:pointer;line-height:1.55;}
.check-list input[type=checkbox]{position:absolute;left:0;top:.3rem;width:1.05rem;height:1.05rem;accent-color:var(--terracotta);}
.check-list .task-tag{position:relative;top:-.06em;margin-right:.15rem;}
.ws-check-title{margin-top:1.4rem;}
.task-note{color:var(--muted);font-size:.9em;}

/* Print button */
.print-btn{font:inherit;font-weight:700;color:var(--paper);background:var(--terracotta);border:none;border-radius:999px;padding:.45rem 1rem;cursor:pointer;line-height:1.2;box-shadow:var(--shadow-soft);}
.print-btn:hover{background:var(--terra-deep);}

/* Measurement worksheet table */
.worksheet-wrap{overflow-x:auto;margin:1rem 0 1.4rem;}
.worksheet{width:100%;border-collapse:collapse;font-size:.95rem;background:var(--cream-bright);border:1px solid var(--hair);}
.worksheet caption{caption-side:top;text-align:left;font-family:var(--display);font-size:1.25rem;color:var(--charcoal);padding:1rem 1.1rem .7rem;background:var(--charcoal);color:var(--paper);}
.worksheet th,.worksheet td{border:1px solid var(--hair);padding:.78rem .85rem;text-align:left;vertical-align:top;}
.worksheet th[scope=row]{font-weight:600;color:var(--charcoal);width:52%;}
.worksheet th[scope=colgroup]{background:rgba(127,144,104,.14);font-family:var(--display);font-size:1.05rem;color:var(--sage-deep);}
.fill-line{display:block;min-height:1.35rem;border-bottom:1px dashed rgba(52,50,45,.4);}

/* Fillable worksheet call-to-action (measuring guide) */
.worksheet-cta{position:relative;display:grid;grid-template-columns:1fr 138px;gap:1.6rem;align-items:center;margin:1.6rem 0 2.2rem;padding:1.9rem 2rem;background:var(--cream-bright);border:1px solid var(--hair);border-top:3px solid var(--terracotta);border-radius:var(--radius);box-shadow:var(--shadow-soft);}
.worksheet-cta-body{min-width:0;}
.worksheet-cta h2{font-size:1.7rem;margin:.35rem 0 .55rem;}
.worksheet-cta-dek{margin:0 0 1.05rem;color:var(--ink);max-width:34rem;}
.worksheet-cta-dek strong{color:var(--terra-deep);}
.worksheet-chips{display:flex;flex-wrap:nowrap;gap:.5rem;list-style:none;margin:0 0 1.15rem;overflow-x:auto;scrollbar-width:none;}
.worksheet-chips::-webkit-scrollbar{display:none;}
.worksheet-chips li{flex:0 0 auto;display:inline-flex;align-items:center;gap:.42rem;padding:.3rem .72rem;border:1px solid rgba(127,144,104,.4);border-radius:999px;background:rgba(127,144,104,.1);font-size:.8rem;font-weight:600;color:var(--sage-deep);white-space:nowrap;}
.wc-dot{width:.42rem;height:.42rem;border-radius:50%;background:var(--terracotta);flex:none;}
.worksheet-cta-meta{margin:.7rem 0 0;color:var(--muted);font-size:.78rem;}
.worksheet-cta-art{align-self:center;justify-self:center;}
.worksheet-cta-art svg{width:138px;height:auto;display:block;}

/* Moving timeline */
.moving-legend{display:flex;flex-wrap:wrap;gap:.5rem;margin:1.2rem 0;}
.task-tag{display:inline-block;font-size:.72rem;font-weight:700;letter-spacing:.02em;text-transform:uppercase;padding:.14rem .5rem;border-radius:999px;background:var(--card);color:var(--charcoal);border:1px solid var(--hair);white-space:nowrap;}
.task-tag.tag-renter{background:rgba(127,144,104,.16);color:var(--sage-deep);border-color:rgba(127,144,104,.4);}
.task-tag.tag-owner{background:rgba(196,102,63,.14);color:var(--terra-deep);border-color:rgba(196,102,63,.4);}
.task-tag.tag-optional{background:transparent;color:var(--muted);}
.task-tag.tag-state{background:rgba(52,50,45,.08);color:var(--charcoal);}
.moving-guide-page .guide-article{--prose:48rem;}
.move-route{margin:1.5rem 0 2.4rem;padding:1.15rem 1.2rem 1.25rem;border:1px solid rgba(169,82,47,.2);border-radius:22px;background:rgba(251,246,236,.78);box-shadow:var(--shadow-soft);}
.move-route-label{display:block;margin-bottom:.8rem;font-size:.68rem;font-weight:800;letter-spacing:.16em;text-transform:uppercase;color:var(--terra-deep);}
.move-route ol{position:relative;display:grid;grid-template-columns:repeat(8,1fr);list-style:none;gap:.3rem;}
.move-route ol::before{content:"";position:absolute;left:5%;right:5%;top:1.25rem;height:2px;background:linear-gradient(90deg,var(--terracotta),var(--sage));opacity:.35;}
.move-route li{position:relative;margin:0;text-align:center;}
.move-route a{display:flex;flex-direction:column;align-items:center;gap:.22rem;color:var(--charcoal);text-decoration:none;font-size:.66rem;line-height:1.1;}
.move-route strong{display:grid;place-items:center;width:2.5rem;height:2.5rem;border-radius:50%;background:var(--cream-bright);border:1px solid rgba(169,82,47,.35);box-shadow:0 5px 13px rgba(52,50,45,.09);font-family:var(--display);font-size:.96rem;color:var(--terra-deep);}
.move-route a:hover strong{background:var(--terracotta);color:var(--paper);transform:translateY(-2px);}
.timeline{position:relative;display:grid;min-width:0;gap:1.55rem;margin-top:1rem;padding-left:2.8rem;counter-reset:phase;}
.timeline::before{content:"";position:absolute;left:.78rem;top:1.3rem;bottom:1.3rem;width:2px;background:linear-gradient(var(--terracotta),rgba(196,102,63,.45) 58%,var(--sage));}
.phase{counter-increment:phase;position:relative;min-width:0;overflow-wrap:anywhere;border:1px solid rgba(52,50,45,.13);border-radius:10px 28px 28px 28px;background:rgba(251,246,236,.9);padding:1.35rem 1.45rem 1.25rem;box-shadow:0 14px 34px rgba(52,50,45,.07);break-inside:avoid;scroll-margin-top:6rem;}
.phase::before{content:counter(phase,decimal-leading-zero);position:absolute;left:-3.78rem;top:.95rem;display:grid;place-items:center;width:2.8rem;height:2.8rem;border:5px solid var(--cream);border-radius:50%;background:var(--terracotta);color:var(--paper);font-family:var(--display);font-weight:650;font-size:.82rem;box-shadow:0 5px 12px rgba(52,50,45,.12);}
.phase:nth-child(n+6)::before{background:var(--sage-deep);}
.phase-head{display:grid;grid-template-columns:auto 1fr;align-items:center;gap:.65rem .85rem;margin-bottom:.75rem;padding-bottom:.72rem;border-bottom:1px solid rgba(52,50,45,.11);}
.phase-when{font-size:.67rem;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:var(--terra-deep);background:rgba(196,102,63,.11);border:1px solid rgba(196,102,63,.22);border-radius:999px;padding:.18rem .58rem;}
.phase-head h2{font-size:1.35rem;margin:0;}
.phase .check-list{margin:.2rem 0 0;gap:0;}
.phase .check-list li{padding:.62rem 0;border-bottom:1px dashed rgba(52,50,45,.12);}
.phase .check-list li:last-child{border-bottom:0;padding-bottom:.15rem;}
.phase .check-list input[type=checkbox]{width:1.18rem;height:1.18rem;top:.28rem;}

/* Notes area (prints cleanly) */
.notes-box{margin-top:1.4rem;border:1px solid var(--hair);border-radius:var(--radius-sm);padding:.9rem 1rem;background:var(--cream-bright);break-inside:avoid;}
.notes-title{display:block;font-family:var(--display);font-weight:600;color:var(--charcoal);margin-bottom:.5rem;}
.notes-lines{display:block;min-height:5.2rem;background-image:repeating-linear-gradient(transparent,transparent 1.55rem,rgba(52,50,45,.22) 1.55rem,rgba(52,50,45,.22) calc(1.55rem + 1px));}

/* Print-only helpers */
.print-only{display:none;}

@media (max-width:640px){
  .diagram{margin:1.7rem -.2rem 2.1rem;padding:.7rem .7rem 1rem;border-radius:20px 20px 8px 20px;}
  .diagram::before{font-size:2.8rem;}
  .diagram figcaption{font-size:.88rem;}
  .move-route{margin-inline:-.2rem;padding:1rem .8rem;overflow-x:auto;}
  .move-route ol{min-width:550px;}
  .timeline{padding-left:2rem;gap:1.15rem;}
  .timeline::before{left:.52rem;}
  .phase{padding:1.05rem 1rem;border-radius:8px 20px 20px 20px;}
  .phase::before{left:-2.8rem;top:.82rem;width:2.35rem;height:2.35rem;border-width:4px;}
  .phase-head{grid-template-columns:1fr;gap:.35rem;}
  .phase-head h2{font-size:1.2rem;}
  .phase .check-list label{min-width:0;}
  .worksheet-cta{grid-template-columns:1fr;gap:1.1rem;padding:1.5rem 1.35rem;}
  .worksheet-cta-art{display:none;}
  .worksheet-cta h2{font-size:1.45rem;}
}
@media (max-width:520px){
  .worksheet-chips{gap:.4rem;flex-wrap:wrap;overflow-x:visible;}
  .worksheet-chips li{font-size:.72rem;padding:.28rem .62rem;}
  .worksheet-chips .wc-dot{display:none;}
}

/* ---------- 30 · Print styles (worksheet + moving checklist print cleanly) ---------- */
@media print{
  body{background:#fff;color:#000;}
  .site-header,.site-footer,.skip-link,.no-print,.page-hd,.page-hd-wave,.wave-divider,.toc,.next-guides,.print-btn,.moving-legend,.affiliate-note,.hero-art{display:none !important;}
  main,.container,.section{margin:0 !important;padding:0 !important;width:auto !important;max-width:none !important;}
  .prose,.guide-article{max-width:none !important;}
  .print-only{display:block;}
  .print-head{font-size:.8rem;color:#333;border-bottom:1px solid #999;padding-bottom:.4rem;margin-bottom:.8rem;}
  a{color:#000;text-decoration:underline;}
  .phase,.notes-box,.worksheet tr,.check-list li{break-inside:avoid;}
  .phase{border:1px solid #999;border-left:3px solid #333;background:#fff;box-shadow:none;}
  .phase-when{background:#eee !important;color:#000 !important;border:1px solid #999;}
  .task-tag{background:#fff !important;color:#000 !important;border:1px solid #999;}
  .check-list input[type=checkbox]{-webkit-appearance:none;appearance:none;border:1px solid #333;background:#fff;}
  .worksheet{background:#fff;}
  .worksheet th[scope=colgroup]{background:#eee !important;}
  h2,h3{page-break-after:avoid;}
}
