/* =====================================================================
   IDEAS FURNITURE & INTERIOR: site.css
   "Rich Modern": deep forest + espresso + gold on warm off-white.
   Change a colour here and every page follows.
   ===================================================================== */

:root{
  /* Base */
  --bg:#f4f1ea;
  --surface:#ffffff;
  --surface-alt:#ece6d8;
  /* Ink */
  --ink:#1b1712;
  --muted:#6b6156;
  /* Brand */
  --forest:#16302a;
  --forest-deep:#0d211c;
  --espresso:#2b1d15;
  /* Accent */
  --gold:#c9a24b;
  --gold-soft:#e4d3a4;
  --gold-deep:#85651b;   /* gold for TEXT on light backgrounds (passes AA contrast) */
  /* Lines */
  --line:#ded5c2;
  --line-dark:#2c463d;

  --radius:16px;
  --radius-sm:10px;
  --serif:"Cormorant Garamond",Georgia,serif;
  --sans:"Hanken Grotesk",system-ui,-apple-system,"Segoe UI",sans-serif;

  --pad:clamp(20px,5vw,72px);
  --nav-h:80px;
  --ease:cubic-bezier(.2,.7,.2,1);
}

*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:88px;-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--ink);font:400 16px/1.6 var(--sans);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
html.menu-open body{overflow:hidden}
img,svg,video{display:block;max-width:100%}
a{color:inherit}
button,input,select,textarea{font:inherit;color:inherit}
button{cursor:pointer}
p{margin:0 0 1em}
h1,h2,h3,h4{margin:0;font-family:var(--serif);font-weight:500;line-height:1.02;letter-spacing:-.01em}
h2{font-size:clamp(2.4rem,4.6vw,4rem)}
h3{font-size:1.7rem;line-height:1.08}
ul,ol{margin:0;padding:0}
:focus-visible{outline:2px solid var(--gold);outline-offset:3px;border-radius:4px}
.dark :focus-visible,.forest :focus-visible,.cta-band :focus-visible,.cta-box :focus-visible,.site-nav :focus-visible,.mobile-panel :focus-visible,.site-footer :focus-visible,.page-hero :focus-visible,.hero :focus-visible{outline-color:var(--gold-soft)}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.skip-link{position:fixed;left:16px;top:-60px;z-index:100;background:var(--gold);color:var(--forest-deep);padding:12px 18px;border-radius:999px;font-weight:600;text-decoration:none;transition:top .2s}
.skip-link:focus{top:16px}

/* ---------- layout helpers ---------- */
.wrap{max-width:1400px;margin-inline:auto;padding-inline:var(--pad)}
.section{padding-block:clamp(64px,9vw,120px)}
.section.tight{padding-block:clamp(44px,6vw,80px)}
.section.alt{background:var(--surface-alt)}
.section.dark{background:var(--forest-deep);color:var(--bg)}
.section.forest{background:var(--forest);color:var(--bg)}
.section.flush-top{padding-top:0}
.dark,.forest{--muted:rgba(244,241,234,.72);--line:var(--line-dark)}
.section-head{display:flex;justify-content:space-between;align-items:flex-end;gap:24px 48px;flex-wrap:wrap;margin-bottom:clamp(30px,4vw,52px)}
.section-head > div:first-child{flex:1 1 420px;max-width:780px}
.section-head p{flex:0 1 380px;max-width:46ch;color:var(--muted);margin:0}
.section-head.stack{display:block}
.section-head.stack p{margin-top:16px}
.eyebrow{display:inline-flex;align-items:center;gap:12px;margin-bottom:18px;font:600 .74rem/1 var(--sans);letter-spacing:.2em;text-transform:uppercase;color:var(--gold-deep)}
.eyebrow::before{content:"";width:28px;height:1px;background:currentColor}
.dark .eyebrow,.forest .eyebrow,.page-hero .eyebrow,.hero .eyebrow,.site-footer .eyebrow{color:var(--gold)}
.lead{font-size:1.14rem;line-height:1.7;color:var(--muted);max-width:56ch}
.split{display:grid;grid-template-columns:1fr 1fr;gap:clamp(32px,7vw,110px);align-items:center}
.split.top{align-items:start}
.split .copy p{color:var(--muted);max-width:50ch}
.split .copy h2{margin-bottom:22px}
.split .copy .button{margin-top:10px}
.photo{width:100%;height:100%;min-height:440px;object-fit:cover;border-radius:var(--radius);background:var(--surface-alt)}
.photo,.product-image img,.gallery img,.room-tile img,.post-card img,.look img{filter:saturate(.94) contrast(1.03)}
.arch{border-radius:999px 999px var(--radius) var(--radius)}
.button-row{display:flex;gap:12px;flex-wrap:wrap;align-items:center}
.text-link{font-weight:600;text-decoration:none;border-bottom:1.5px solid var(--gold);padding-bottom:2px;transition:color .2s}
.text-link:hover{color:var(--gold-deep)}
.dark .text-link:hover,.forest .text-link:hover{color:var(--gold-soft)}

/* ---------- buttons ---------- */
.button{display:inline-flex;align-items:center;justify-content:center;gap:.6em;padding:14px 26px;border-radius:999px;border:1.5px solid transparent;font:600 .95rem/1 var(--sans);text-decoration:none;text-align:center;cursor:pointer;transition:transform .2s var(--ease),background-color .2s,color .2s,border-color .2s}
.button:hover{transform:translateY(-2px)}
.button:active{transform:translateY(0)}
.button.primary{background:var(--gold);color:var(--forest-deep)}
.button.primary:hover{background:#d8b45c}
.button.outline{border-color:rgba(27,23,18,.3);color:var(--ink);background:transparent}
.button.outline:hover{background:var(--ink);border-color:var(--ink);color:var(--bg)}
.button.ghost,.dark .button.outline,.forest .button.outline,.cta-band .button.outline,.cta-box .button.outline{border-color:rgba(228,211,164,.45);color:var(--bg);background:transparent}
.button.ghost:hover,.dark .button.outline:hover,.forest .button.outline:hover,.cta-band .button.outline:hover,.cta-box .button.outline:hover{background:rgba(228,211,164,.14);border-color:var(--gold-soft);color:var(--bg)}
.button.small{padding:10px 16px;font-size:.85rem}
.button.block{width:100%}
.wa-icon{width:1.2em;height:1.2em;flex:none;fill:currentColor}

/* =====================================================================
   NAVBAR (shared component, injected by components.js)
   ===================================================================== */
.site-nav{position:fixed;inset:0 0 auto 0;z-index:60;height:var(--nav-h);color:var(--bg);
  background:linear-gradient(180deg,rgba(13,33,28,.62),rgba(13,33,28,0));
  transition:height .3s var(--ease),background-color .3s,box-shadow .3s}
.site-nav.is-scrolled,html.menu-open .site-nav{height:64px;background:color-mix(in srgb,var(--forest-deep) 94%,transparent);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);box-shadow:0 1px 0 var(--line-dark)}
html.menu-open .site-nav{background:var(--forest-deep)}
.nav-inner{height:100%;max-width:1520px;margin-inline:auto;padding-inline:var(--pad);display:flex;align-items:center;justify-content:space-between;gap:clamp(16px,2vw,36px)}
.brand{font:600 1.75rem/1 var(--serif);letter-spacing:-.005em;text-decoration:none;flex:none;transition:font-size .3s var(--ease)}
.brand small{display:block;margin-top:5px;font:500 .6rem/1 var(--sans);letter-spacing:.24em;text-transform:uppercase;color:var(--gold-soft)}
.site-nav.is-scrolled .brand{font-size:1.55rem}
.nav-links{display:flex;gap:clamp(14px,1.7vw,30px);list-style:none;white-space:nowrap}
.nav-links a{position:relative;display:block;padding:8px 0;font-size:.92rem;font-weight:500;text-decoration:none;opacity:.86;transition:opacity .2s}
.nav-links a::after{content:"";position:absolute;left:0;right:0;bottom:2px;height:2px;background:var(--gold);transform:scaleX(0);transform-origin:left;transition:transform .3s var(--ease)}
.nav-links a:hover{opacity:1}
.nav-links a:hover::after,.nav-links a[aria-current="page"]::after{transform:scaleX(1)}
.nav-links a[aria-current="page"]{opacity:1}
.nav-actions{display:flex;align-items:center;gap:18px;flex:none}
.nav-actions .tel{font-size:.92rem;font-weight:500;text-decoration:none;white-space:nowrap;opacity:.9}
.nav-actions .tel:hover{color:var(--gold-soft)}
.nav-actions .button{padding:11px 20px;font-size:.88rem}
.nav-toggle{display:none;position:relative;width:44px;height:44px;border:1px solid rgba(228,211,164,.4);border-radius:50%;background:transparent;color:var(--bg)}
.nav-toggle span,.nav-toggle span::before,.nav-toggle span::after{position:absolute;left:50%;top:50%;width:18px;height:2px;background:currentColor;border-radius:2px;transition:transform .3s var(--ease),opacity .2s}
.nav-toggle span{transform:translate(-50%,-50%)}
.nav-toggle span::before,.nav-toggle span::after{content:""}
.nav-toggle span::before{transform:translate(-50%,-6px)}
.nav-toggle span::after{transform:translate(-50%,4px)}
html.menu-open .nav-toggle span{background:transparent}
html.menu-open .nav-toggle span::before{transform:translate(-50%,-1px) rotate(45deg)}
html.menu-open .nav-toggle span::after{transform:translate(-50%,-1px) rotate(-45deg)}

.mobile-panel{position:fixed;inset:0;z-index:55;display:flex;flex-direction:column;padding:calc(64px + 28px) var(--pad) 28px;background:var(--forest-deep);color:var(--bg);overflow-y:auto;
  transform:translateY(-100%);visibility:hidden;transition:transform .5s var(--ease),visibility 0s .5s}
html.menu-open .mobile-panel{transform:none;visibility:visible;transition:transform .5s var(--ease),visibility 0s}
.mobile-panel ul{list-style:none;display:block}
.mobile-panel li{border-bottom:1px solid var(--line-dark)}
.mobile-panel a.m-link{display:flex;align-items:center;justify-content:space-between;min-height:60px;padding:8px 0;font:500 clamp(1.9rem,7vw,2.5rem)/1.1 var(--serif);text-decoration:none}
.mobile-panel a.m-link[aria-current="page"]{color:var(--gold)}
.mobile-panel a.m-link[aria-current="page"]::after{content:"";width:8px;height:8px;border-radius:50%;background:var(--gold)}
.mobile-panel-foot{margin-top:auto;padding-top:32px;display:grid;gap:14px}
.mobile-panel-foot .tel{display:block;text-align:center;font-size:1.05rem;text-decoration:none;color:var(--gold-soft);padding:8px}

@media(max-width:1359px){.nav-actions .tel{display:none}}
@media(max-width:1179px){
  .nav-primary,.nav-actions .button{display:none}
  .nav-toggle{display:block}
}
@media(min-width:1180px){.mobile-panel{display:none}}

/* =====================================================================
   HEROES
   ===================================================================== */
/* Home hero: a full-bleed, editorial carousel. Each slide lives in index.html,
   so new photography and copy can be added without touching the JavaScript. */
.hero{position:relative;background:var(--forest-deep);color:var(--bg);overflow:hidden}
.hero-slider{height:max(780px,100svh);isolation:isolate}
.hero-slides,.hero-slide{position:absolute;inset:0}
.hero-slide{display:flex;align-items:flex-end;opacity:0;visibility:hidden;pointer-events:none;transform:scale(1.018);transition:opacity .8s var(--ease),transform 1.1s var(--ease),visibility 0s .9s}
.hero-slide.is-active{opacity:1;visibility:visible;pointer-events:auto;transform:none;transition:opacity .8s var(--ease),transform 1.1s var(--ease),visibility 0s}
.hero-media{position:absolute;inset:0;z-index:-2;overflow:hidden;background:var(--forest-deep)}
.hero-media img{width:100%;height:100%;object-fit:cover;object-position:center;filter:saturate(.88) contrast(1.04) brightness(.78);transform:scale(1.045);transition:transform 6.8s linear,filter .8s var(--ease)}
.hero-slide.is-active .hero-media img{transform:scale(1);filter:saturate(.92) contrast(1.04) brightness(.78)}
.hero-slide:nth-child(2) .hero-media img{object-position:center 46%}
.hero-slide:nth-child(3) .hero-media img{object-position:center 54%}
.hero-shade{position:absolute;inset:0;z-index:-1;background:
  linear-gradient(90deg,rgba(9,26,21,.94) 0%,rgba(9,26,21,.76) 38%,rgba(9,26,21,.22) 78%,rgba(9,26,21,.1) 100%),
  linear-gradient(0deg,rgba(9,26,21,.88) 0%,rgba(9,26,21,.1) 44%,rgba(9,26,21,.12) 100%),
  radial-gradient(circle at 76% 20%,rgba(201,162,75,.16),transparent 29%)}
.hero-inner{position:relative;width:100%;display:grid;grid-template-columns:minmax(0,1fr) minmax(236px,280px);align-items:end;gap:clamp(32px,6vw,100px);padding-block:calc(var(--nav-h) + 56px) clamp(132px,12vw,168px)}
.hero-copy{max-width:760px}
/* The viewport-height cap keeps longer slide titles safely below the fixed nav
   on shorter laptop screens, without reducing the large-screen impact. */
.hero :is(h1,h2){max-width:11ch;font-size:clamp(3.65rem,min(8.6vw,13vh),8.3rem);line-height:.89;letter-spacing:-.034em;font-weight:500}
.hero .lede{max-width:48ch;margin:28px 0 34px;font-size:clamp(1.04rem,1.45vw,1.23rem);line-height:1.65;color:rgba(244,241,234,.84)}
.hero-plate{align-self:end;max-width:280px;margin-bottom:8px;padding:22px 22px 21px;border:1px solid rgba(228,211,164,.43);border-radius:var(--radius-sm);background:linear-gradient(145deg,rgba(20,48,41,.82),rgba(8,24,20,.58));box-shadow:0 18px 50px rgba(0,0,0,.16);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);font-size:.9rem;line-height:1.55}
.hero-plate-label{margin-bottom:10px;font:600 .65rem/1 var(--sans);letter-spacing:.18em;text-transform:uppercase;color:var(--gold)}
.hero-plate b{display:block;margin-bottom:7px;font:600 1.48rem/1.05 var(--serif);color:var(--gold-soft)}
.hero-plate span:not(.hero-plate-label){display:block;color:rgba(244,241,234,.75)}
.hero-plate a{display:inline-block;margin-top:14px;color:var(--gold-soft);font-weight:600;text-decoration:none;border-bottom:1px solid currentColor}
/* The content comes in softly whenever a new collection becomes active. */
@keyframes rise{from{opacity:0;transform:translateY(20px)}to{opacity:1;transform:none}}
.hero-slide.is-active .eyebrow,.hero-slide.is-active :is(h1,h2),.hero-slide.is-active .lede,.hero-slide.is-active .button-row,.hero-slide.is-active .hero-plate{animation:rise .75s var(--ease) both}
.hero-slide.is-active .eyebrow{animation-delay:.08s}
.hero-slide.is-active :is(h1,h2){animation-delay:.17s}
.hero-slide.is-active .lede{animation-delay:.28s}
.hero-slide.is-active .button-row{animation-delay:.38s}
.hero-slide.is-active .hero-plate{animation-delay:.48s}
.hero-controls{position:absolute;z-index:3;right:0;bottom:clamp(26px,3.6vw,48px);left:0;display:flex;align-items:center;justify-content:space-between;gap:20px;pointer-events:none}
.hero-arrows,.hero-pagination{display:flex;align-items:center;gap:10px;pointer-events:auto}
.hero-arrow,.hero-pause{width:44px;height:44px;padding:0;border:1px solid rgba(228,211,164,.42);border-radius:50%;background:rgba(8,24,20,.28);color:var(--gold-soft);display:grid;place-items:center;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);transition:background-color .2s,border-color .2s,transform .2s var(--ease)}
.hero-arrow:hover,.hero-pause:hover{background:rgba(228,211,164,.15);border-color:var(--gold-soft);transform:translateY(-2px)}
.hero-arrow svg{width:19px;height:19px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.hero-pagination{gap:16px}
.hero-count{font:600 .72rem/1 var(--sans);letter-spacing:.18em;color:rgba(244,241,234,.78);white-space:nowrap}
.hero-dots{display:flex;gap:8px}
.hero-dot{position:relative;width:34px;height:16px;padding:0;border:0;background:transparent;cursor:pointer}
.hero-dot::before{content:"";position:absolute;top:7px;right:0;left:0;height:2px;background:rgba(244,241,234,.44);transition:background-color .2s,height .2s}
.hero-dot.is-active::before{height:3px;background:var(--gold-soft)}
.hero-pause{width:38px;height:38px}
.hero-pause > span:not(.sr){width:9px;height:11px;border-inline:2px solid currentColor}
.hero-pause[aria-pressed="true"] > span:not(.sr){width:0;height:0;border-top:6px solid transparent;border-bottom:6px solid transparent;border-left:9px solid currentColor;border-right:0}
.hero-slider:focus-visible{outline-offset:-6px}

/* Long campaign headlines need a fixed safe starting point on short desktop
   viewports. This keeps the eyebrow and title below the 80px fixed nav. */
@media (min-width:861px) and (max-height:920px){
  .hero-inner{height:100%}
  .hero-copy{align-self:start}
  .hero-controls{justify-content:flex-end}
  .hero-plate{margin-bottom:68px}
}

/* A quiet confidence band connects the immersive hero to the shop content. */
.assurance{position:relative;z-index:4;background:var(--surface);border-bottom:1px solid var(--line)}
.assurance-grid{display:grid;grid-template-columns:repeat(3,1fr)}
.assurance p{display:flex;flex-direction:column;gap:3px;margin:0;padding:24px clamp(18px,3vw,44px);border-left:1px solid var(--line)}
.assurance p:first-child{border-left:0;padding-left:0}
.assurance p:last-child{padding-right:0}
.assurance b{font:600 1.25rem/1.1 var(--serif);color:var(--forest)}
.assurance span{font-size:.84rem;line-height:1.45;color:var(--muted)}

/* Inner-page hero: forest-deep banner with an arch outline (echoes an arched headboard / mirror) */
.page-hero{position:relative;overflow:hidden;background:var(--forest-deep);color:var(--bg);padding:calc(var(--nav-h) + clamp(56px,8vw,112px)) 0 clamp(56px,7vw,96px);border-bottom:1px solid rgba(201,162,75,.28)}
.page-hero::after{content:"";position:absolute;right:calc(var(--pad) + 2vw);bottom:0;width:clamp(150px,20vw,300px);height:clamp(210px,28vw,420px);border:1px solid rgba(201,162,75,.32);border-bottom:0;border-radius:999px 999px 0 0;pointer-events:none}
.page-hero::before{content:"";position:absolute;right:calc(var(--pad) + 2vw + 18px);bottom:0;width:calc(clamp(150px,20vw,300px) - 36px);height:calc(clamp(210px,28vw,420px) - 18px);border:1px solid rgba(201,162,75,.16);border-bottom:0;border-radius:999px 999px 0 0;pointer-events:none}
.page-hero .wrap{position:relative;z-index:1}
.page-hero h1{max-width:15ch;font-size:clamp(3rem,7vw,6.2rem);line-height:.94;letter-spacing:-.025em}
.page-hero p{max-width:54ch;margin:22px 0 0;font-size:1.12rem;color:rgba(244,241,234,.78)}
.page-hero .button-row{margin-top:32px}
.about-intro{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);gap:clamp(36px,7vw,100px);align-items:center;max-width:1160px;margin-inline:auto}
.about-heading{position:relative;z-index:1}
.about-heading h1{max-width:13ch;font-size:clamp(3.2rem,5.8vw,5.5rem);line-height:.98}
.about-hero .about-lead{max-width:54ch;margin:0;padding-left:clamp(22px,3vw,42px);border-left:1px solid rgba(201,162,75,.45);font-size:clamp(1.15rem,1.8vw,1.4rem);line-height:1.75;color:rgba(244,241,234,.82)}
.about-narrative .wrap{max-width:1160px}
.about-narrative-heading{max-width:850px;margin-bottom:clamp(30px,4vw,48px)}
.about-narrative-heading h2{max-width:20ch;font-size:clamp(2.4rem,4vw,3.5rem)}
.about-narrative .about-copy{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:clamp(24px,4vw,56px);align-items:start;color:var(--muted);font-size:1rem;line-height:1.75}
.about-narrative .about-copy p{margin:0 0 24px}
.about-narrative .about-copy p:first-child{grid-column:1/-1;max-width:78ch;color:var(--ink);font-size:clamp(1.08rem,1.45vw,1.22rem);line-height:1.7}
.about-narrative .about-copy .about-signoff{grid-column:1/-1;margin:8px 0 0;padding-top:24px;border-top:1px solid var(--line);color:var(--forest);font:500 clamp(1.7rem,2.8vw,2.25rem)/1.2 var(--serif)}
.hero-facts{display:flex;flex-wrap:wrap;gap:0;margin:40px 0 0;padding:0;list-style:none}
.hero-facts li{padding:2px 28px;border-left:1px solid rgba(201,162,75,.4);color:rgba(244,241,234,.72);font-size:.9rem}
.hero-facts li:first-child{padding-left:0;border-left:0}
.hero-facts b{display:block;font:500 1.7rem/1.1 var(--serif);color:var(--gold-soft)}

@media(max-width:860px){
  .hero-slider{height:max(830px,100svh)}
  .hero-inner{grid-template-columns:1fr;gap:26px;padding-top:calc(var(--nav-h) + 48px)}
  .hero-plate{max-width:440px;align-self:start}
  .assurance-grid{grid-template-columns:1fr}
  .assurance p,.assurance p:first-child,.assurance p:last-child{padding:18px 0;border:0;border-top:1px solid var(--line)}
  .assurance p:first-child{border-top:0}
  .page-hero::after,.page-hero::before{opacity:.5}
  .about-intro{grid-template-columns:1fr;gap:30px}
  .about-narrative .about-copy{grid-template-columns:1fr}
  .about-heading h1{max-width:12ch}
  .about-hero .about-lead{max-width:65ch;padding:24px 0 0;border-top:1px solid rgba(201,162,75,.45);border-left:0}
  .about-narrative .about-copy p:first-child,.about-narrative .about-copy .about-signoff{grid-column:auto}
  .hero-facts li{padding:2px 18px}
}
@media(max-width:560px){
  .hero-slider{height:max(850px,100svh)}
  .hero-inner{padding-top:calc(var(--nav-h) + 38px);padding-bottom:132px}
  .hero :is(h1,h2){font-size:clamp(3.15rem,15vw,4.35rem)}
  .hero .lede{margin:22px 0 27px;line-height:1.58}
  .hero .button-row .button{width:100%}
  .hero-controls{bottom:22px}
  .hero-pagination{gap:10px}
  .hero-count{font-size:.66rem}
  .hero-dot{width:24px}
  .hero-pause{display:none}
  .page-hero::after,.page-hero::before{display:none}
  .about-heading h1{max-width:10ch}
  .hero-facts{gap:18px 0}
}

/* =====================================================================
   SHOP BY ROOM
   ===================================================================== */
.room-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(14px,2vw,28px);align-items:start}
.room-tile{position:relative;display:block;aspect-ratio:4/5;overflow:hidden;border-radius:var(--radius);text-decoration:none;color:#fff;background:var(--forest)}
.room-tile img{width:100%;height:100%;object-fit:cover;transition:transform .9s var(--ease)}
.room-tile::after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,rgba(13,33,28,.86) 0%,rgba(13,33,28,.15) 55%,rgba(13,33,28,0) 100%);pointer-events:none}
.room-tile:hover img,.room-tile:focus-visible img{transform:scale(1.06)}
.room-tile .room-copy{position:absolute;left:0;right:0;bottom:0;z-index:1;padding:clamp(18px,2.4vw,30px);display:flex;justify-content:space-between;align-items:flex-end;gap:12px}
.room-tile h3{font-size:clamp(2rem,3.2vw,2.8rem);color:#fff}
.room-tile p{margin:6px 0 0;font-size:.9rem;color:rgba(255,255,255,.8)}
.room-tile .go{flex:none;width:46px;height:46px;border-radius:50%;background:var(--gold);color:var(--forest-deep);display:grid;place-items:center;transition:transform .3s var(--ease)}
.room-tile:hover .go{transform:translateX(4px)}
.room-tile .go svg{width:18px;height:18px;stroke:currentColor;fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
@media(min-width:861px){.room-grid .room-tile:nth-child(2){margin-top:56px}}

/* =====================================================================
   PRODUCTS
   ===================================================================== */
.product-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(28px,3vw,44px) clamp(14px,1.6vw,24px)}
.product-grid.cols-3{grid-template-columns:repeat(3,1fr);gap:clamp(30px,3.4vw,52px) clamp(16px,2vw,32px)}
.product{position:relative;display:flex;flex-direction:column}
.product-image{position:relative;aspect-ratio:4/5;border-radius:var(--radius-sm);overflow:hidden;background:var(--surface-alt);box-shadow:inset 0 0 0 1px rgba(27,23,18,.06)}
.product-image img{width:100%;height:100%;object-fit:cover;transition:transform .8s var(--ease)}
.product:hover .product-image img{transform:scale(1.045)}
.badge{position:absolute;left:0;top:18px;z-index:1;padding:7px 14px 7px 12px;background:var(--gold);color:var(--forest-deep);font:700 .68rem/1 var(--sans);letter-spacing:.14em;text-transform:uppercase;clip-path:polygon(0 0,100% 0,calc(100% - 8px) 50%,100% 100%,0 100%)}
.save{position:absolute;right:12px;top:12px;z-index:1;width:40px;height:40px;border:0;border-radius:50%;background:rgba(255,255,255,.94);color:var(--ink);font-size:1.15rem;line-height:1;display:grid;place-items:center;transition:transform .2s var(--ease),background-color .2s,color .2s}
.save:hover{transform:scale(1.08)}
.save.saved{background:var(--forest);color:var(--gold)}
.product-copy{padding:16px 2px 0;display:flex;flex-direction:column;flex:1;align-items:flex-start}
.product-copy h3{font-size:clamp(1.45rem,2vw,1.75rem)}
.product-copy .meta{margin:6px 0 0;font-size:.88rem;color:var(--muted)}
.product-copy .desc{margin:10px 0 0;font-size:.92rem;color:var(--muted);max-width:44ch}
.price-tag{display:inline-block;margin:12px 0 16px;padding:5px 11px;border:1px solid var(--gold);border-radius:999px;font:600 .74rem/1 var(--sans);letter-spacing:.06em;color:var(--gold-deep)}
.product-copy .button{margin-top:auto}
.empty-state{grid-column:1/-1;padding:56px 24px;text-align:center;border:1px dashed var(--line);border-radius:var(--radius);background:var(--surface)}
.empty-state h3{margin-bottom:8px}
.empty-state p{color:var(--muted);max-width:44ch;margin:0 auto 20px}

/* shop toolbar */
.toolbar{display:flex;justify-content:space-between;align-items:center;gap:16px 24px;flex-wrap:wrap;padding:18px 0;border-block:1px solid var(--line);margin-bottom:clamp(24px,3vw,40px)}
.filters{display:flex;gap:8px;flex-wrap:wrap}
.filter{padding:9px 18px;border:1px solid var(--line);border-radius:999px;background:transparent;color:var(--muted);font-weight:500;font-size:.92rem;transition:background-color .2s,color .2s,border-color .2s}
.filter:hover{border-color:var(--forest);color:var(--ink)}
.filter[aria-pressed="true"]{background:var(--forest);border-color:var(--forest);color:var(--gold-soft)}
.tools{display:flex;gap:10px;flex-wrap:wrap}
.field{width:100%;padding:12px 14px;border:1px solid var(--line);border-radius:var(--radius-sm);background:var(--surface);color:var(--ink);transition:border-color .2s,box-shadow .2s}
.field::placeholder{color:#8f857a}
.field:focus{outline:none;border-color:var(--gold);box-shadow:0 0 0 3px rgba(201,162,75,.28)}
.tools .field{width:auto}
.tools .search{min-width:220px}
.result-count{margin:-10px 0 24px;color:var(--muted);font-size:.9rem}

/* =====================================================================
   VALUE PROPS / STEPS / CARDS
   ===================================================================== */
.value-list{display:grid;grid-template-columns:1fr 1fr;gap:clamp(28px,3vw,44px) clamp(24px,3vw,44px)}
.value .icon{width:52px;height:52px;margin-bottom:18px;display:grid;place-items:center;border:1px solid var(--gold);border-radius:50%;color:var(--gold-deep)}
.value .icon svg{width:30px;height:30px;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
.value h3{margin-bottom:8px;font-size:1.75rem}
.value p{margin:0;color:var(--muted);font-size:.98rem}

.steps{list-style:none;display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(20px,3vw,44px);counter-reset:step}
.steps.four{grid-template-columns:repeat(4,1fr)}
.step{position:relative;padding-top:30px;border-top:1px solid var(--line)}
.step::before{content:"";position:absolute;left:0;top:-5px;width:9px;height:9px;border-radius:50%;background:var(--gold)}
.step .num{display:block;margin-bottom:14px;font:500 clamp(3.4rem,5vw,4.6rem)/.9 var(--serif);color:var(--gold-deep)}
.dark .step .num,.forest .step .num{color:var(--gold)}
.step h3{margin-bottom:10px}
.step p{margin:0;color:var(--muted);max-width:34ch}

.card{padding:clamp(22px,3vw,34px);background:var(--surface);border:1px solid var(--line);border-radius:var(--radius)}
.card h3{margin-bottom:8px}
.card p{margin:0;color:var(--muted)}

/* =====================================================================
   REVIEWS
   ===================================================================== */
.rating{display:flex;align-items:center;gap:22px;flex-wrap:wrap}
.rating .score{font:500 clamp(4.4rem,8vw,6.6rem)/.85 var(--serif)}
.stars{display:flex;gap:3px;color:var(--gold)}
.stars svg{width:20px;height:20px;fill:currentColor}
.rating small{display:block;margin-top:6px;color:var(--muted);font-size:.92rem}
.review-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(16px,2vw,26px)}
.review{display:flex;flex-direction:column;padding:clamp(24px,3vw,34px);background:var(--surface);border:1px solid var(--line);border-radius:var(--radius)}
.review .stars{margin-bottom:18px}
.review .stars svg{width:16px;height:16px}
.review blockquote{margin:0 0 26px;font:500 1.42rem/1.28 var(--serif)}
.review footer{margin-top:auto;display:flex;align-items:center;gap:12px;font-size:.9rem;color:var(--muted)}
.review .avatar{width:40px;height:40px;border-radius:50%;display:grid;place-items:center;background:var(--forest);color:var(--gold-soft);font:600 1rem/1 var(--serif)}
.review b{display:block;color:var(--ink);font-weight:600}

/* =====================================================================
   FAQ
   ===================================================================== */
.faq-item{border-bottom:1px solid var(--line)}
.faq-item:first-of-type{border-top:1px solid var(--line)}
.faq-item summary{display:flex;justify-content:space-between;align-items:center;gap:20px;padding:22px 0;list-style:none;cursor:pointer;font:500 clamp(1.35rem,2.2vw,1.7rem)/1.15 var(--serif)}
.faq-item summary::-webkit-details-marker{display:none}
.faq-item summary::after{content:"+";flex:none;width:34px;height:34px;display:grid;place-items:center;border:1px solid var(--gold);border-radius:50%;font:400 1.4rem/1 var(--sans);color:var(--gold-deep);transition:transform .3s var(--ease),background-color .2s,color .2s}
.faq-item summary:hover::after{background:var(--gold);color:var(--forest-deep)}
.faq-item[open] summary::after{transform:rotate(45deg);background:var(--gold);color:var(--forest-deep)}
.faq-item .answer{padding:0 54px 24px 0;color:var(--muted);max-width:66ch}
.faq-item .answer p:last-child{margin-bottom:0}
.faq-layout{display:grid;grid-template-columns:260px minmax(0,1fr);gap:clamp(32px,6vw,90px);align-items:start}
.faq-nav{position:sticky;top:96px;display:grid;gap:4px}
.faq-nav h2{font-size:1.6rem;margin-bottom:14px}
.faq-nav a{padding:10px 14px;border-left:2px solid var(--line);text-decoration:none;color:var(--muted);font-weight:500;transition:color .2s,border-color .2s,background-color .2s}
.faq-nav a:hover,.faq-nav a.on{color:var(--ink);border-left-color:var(--gold);background:var(--surface-alt)}
.faq-group + .faq-group{margin-top:clamp(48px,6vw,80px)}
.faq-group > h2{font-size:clamp(2rem,3.4vw,2.8rem);margin-bottom:22px}
.faq-group{scroll-margin-top:96px}

/* =====================================================================
   FORMS
   ===================================================================== */
.form-layout{display:grid;grid-template-columns:.85fr 1.15fr;gap:clamp(32px,5vw,72px);align-items:start}
.form-card{padding:clamp(24px,4vw,46px);background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);box-shadow:0 24px 60px -30px rgba(27,23,18,.25)}
.form-card h2{font-size:clamp(2rem,3vw,2.6rem);margin-bottom:8px}
.form-card > p{color:var(--muted);margin-bottom:26px}
.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.form-grid .full{grid-column:1/-1}
.form-label{display:block;margin-bottom:7px;font-size:.86rem;font-weight:600}
textarea.field{min-height:130px;resize:vertical}
.option-row{display:flex;gap:8px;flex-wrap:wrap}
.option{position:relative}
.option input{position:absolute;opacity:0;inset:0;width:100%;height:100%;cursor:pointer;margin:0}
.option label{display:block;padding:10px 18px;border:1px solid var(--line);border-radius:999px;color:var(--muted);font-weight:500;transition:background-color .2s,color .2s,border-color .2s}
.option input:hover + label{border-color:var(--forest)}
.option input:checked + label{background:var(--forest);border-color:var(--forest);color:var(--gold-soft)}
.option input:focus-visible + label{outline:2px solid var(--gold);outline-offset:3px}
input[type=range]{width:100%;accent-color:var(--gold);height:28px}
.range-output{font-weight:700;color:var(--gold-deep)}
.form-note{min-height:1.4em;margin:14px 0 0;font-size:.92rem;color:var(--muted)}

/* inspiration picker (Custom Design) */
.look-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(10px,1.6vw,18px)}
.look{position:relative;display:block}
.look input{position:absolute;opacity:0;inset:0;width:100%;height:100%;cursor:pointer;margin:0;z-index:2}
.look .frame{position:relative;display:block;aspect-ratio:4/5;overflow:hidden;border-radius:var(--radius-sm);outline:0 solid var(--gold);outline-offset:3px;transition:outline-width .15s}
.look img{width:100%;height:100%;object-fit:cover;transition:transform .7s var(--ease)}
.look:hover img{transform:scale(1.04)}
.look .cap{position:absolute;left:0;right:0;bottom:0;padding:26px 14px 12px;background:linear-gradient(0deg,rgba(13,33,28,.85),transparent);color:#fff;font-weight:600;font-size:.92rem}
.look .tick{position:absolute;top:10px;right:10px;width:30px;height:30px;border-radius:50%;background:var(--gold);color:var(--forest-deep);display:grid;place-items:center;opacity:0;transform:scale(.6);transition:opacity .2s,transform .25s var(--ease)}
.look .tick svg{width:16px;height:16px;stroke:currentColor;fill:none;stroke-width:2.6;stroke-linecap:round;stroke-linejoin:round}
.look input:checked ~ .frame{outline-width:3px}
.look input:checked ~ .frame .tick{opacity:1;transform:none}
.look input:focus-visible ~ .frame{outline-width:3px;outline-color:var(--forest)}

/* =====================================================================
   GALLERY + LIGHTBOX
   ===================================================================== */
.gallery{display:grid;grid-template-columns:repeat(12,1fr);gap:clamp(10px,1.4vw,16px)}
.gallery figure{position:relative;margin:0;grid-column:span 3;min-height:260px;overflow:hidden;border-radius:var(--radius-sm);background:var(--surface-alt)}
.gallery figure:nth-child(1),.gallery figure:nth-child(6){grid-column:span 6}
.gallery-btn{display:block;width:100%;height:100%;padding:0;border:0;background:none;cursor:zoom-in}
.gallery img{width:100%;height:100%;min-height:260px;object-fit:cover;transition:transform .8s var(--ease)}
.gallery figure:hover img{transform:scale(1.05)}
.gallery figcaption{position:absolute;left:0;right:0;bottom:0;min-height:84px;padding:44px 190px 18px 20px;background:linear-gradient(0deg,rgba(13,33,28,.9) 0%,rgba(13,33,28,0) 100%);color:#fff;font-weight:600;pointer-events:none}
.gallery figcaption span{display:inline-block;padding-left:12px;border-left:3px solid var(--gold)}
.photo-estimate{position:absolute;right:12px;bottom:12px;z-index:2;max-width:calc(100% - 24px);padding:9px 13px;background:var(--gold);color:var(--forest-deep);font-size:.76rem;white-space:nowrap;box-shadow:0 4px 14px rgba(13,33,28,.2)}
.photo-estimate:hover{background:#d8b45c;color:var(--forest-deep)}
.category-jump{display:flex;gap:10px;flex-wrap:wrap;margin:-18px 0 56px;padding-bottom:22px;border-bottom:1px solid var(--line)}
.category-jump a{padding:10px 16px;border:1px solid var(--line);border-radius:999px;color:var(--muted);font-weight:600;text-decoration:none;transition:background-color .2s,color .2s,border-color .2s}
.category-jump a:hover,.category-jump a:focus-visible{border-color:var(--forest);background:var(--forest);color:var(--gold-soft)}
.category-block{padding-top:18px;margin-top:clamp(48px,7vw,88px);scroll-margin-top:96px}
.category-block:first-child{margin-top:0}
.category-block-head{display:flex;align-items:flex-end;justify-content:space-between;gap:24px;margin-bottom:28px}
.category-block-head h3{font-size:clamp(2rem,3.4vw,3rem)}
.category-block-head p{max-width:38ch;margin:0;color:var(--muted)}
.category-gallery figure{grid-column:span 3;min-height:220px}
.category-gallery figure:nth-child(1),.category-gallery figure:nth-child(6){grid-column:span 6}
.category-gallery img{min-height:220px}
.zoom-hint{position:absolute;top:12px;right:12px;width:36px;height:36px;border-radius:50%;background:rgba(13,33,28,.6);color:var(--gold-soft);display:grid;place-items:center;opacity:0;transition:opacity .25s;pointer-events:none}
.zoom-hint svg{width:16px;height:16px;stroke:currentColor;fill:none;stroke-width:2;stroke-linecap:round}
.gallery figure:hover .zoom-hint,.gallery-btn:focus-visible + .zoom-hint{opacity:1}

.lightbox{width:100vw;max-width:none;height:100vh;height:100dvh;max-height:none;margin:0;padding:0;border:0;background:rgba(9,22,19,.96);color:#fff}
.lightbox::backdrop{background:rgba(9,22,19,.96)}
.lightbox[open]{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:clamp(8px,2vw,28px);padding:clamp(56px,7vw,80px) clamp(12px,3vw,40px) clamp(24px,4vw,40px)}
.lightbox figure{margin:0;display:flex;flex-direction:column;align-items:center;gap:16px;min-width:0;max-height:100%}
.lightbox img{max-width:100%;max-height:calc(100dvh - 190px);width:auto;height:auto;object-fit:contain;border-radius:6px}
.lightbox figcaption{font:500 1.5rem/1.2 var(--serif);color:var(--gold-soft);text-align:center}
.lb-btn{width:48px;height:48px;border:1px solid rgba(228,211,164,.45);border-radius:50%;background:transparent;color:var(--gold-soft);display:grid;place-items:center;transition:background-color .2s}
.lb-btn:hover{background:rgba(228,211,164,.16)}
.lb-btn svg{width:20px;height:20px;stroke:currentColor;fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.lb-close{position:absolute;top:clamp(12px,2vw,24px);right:clamp(12px,2vw,24px)}
.lb-count{position:absolute;top:clamp(20px,2.6vw,34px);left:clamp(16px,3vw,40px);font-size:.85rem;letter-spacing:.14em;color:rgba(255,255,255,.7)}

/* =====================================================================
   MAP / CONTACT
   ===================================================================== */
.map-card{position:relative;min-height:400px;overflow:hidden;border-radius:var(--radius);border:1px solid var(--line);background:var(--surface-alt) repeating-linear-gradient(45deg,transparent 0 22px,rgba(27,23,18,.035) 22px 23px)}
.dark .map-card,.forest .map-card{border-color:var(--line-dark)}
.map-card iframe{position:absolute;inset:0;width:100%;height:100%;border:0;filter:grayscale(.3) contrast(1.05) saturate(.9)}
.map-label{position:absolute;left:18px;bottom:18px;padding:12px 16px;background:var(--surface);color:var(--ink);border-radius:var(--radius-sm);box-shadow:0 10px 30px rgba(13,33,28,.25);pointer-events:none;line-height:1.35}
.map-label small{color:#6b6156}
.info-list{display:grid;gap:0;margin:0 0 30px;padding:0;list-style:none}
.info-list li{display:grid;grid-template-columns:130px 1fr;gap:16px;padding:16px 0;border-bottom:1px solid var(--line)}
.info-list li:first-child{border-top:1px solid var(--line)}
.info-list b{font:600 .74rem/1.6 var(--sans);letter-spacing:.16em;text-transform:uppercase;color:var(--gold-deep)}
.dark .info-list b,.forest .info-list b{color:var(--gold)}
.info-list a{justify-self:start;align-self:start;text-decoration:none;border-bottom:1px solid var(--gold)}
.contact-grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(32px,6vw,90px);align-items:start}

/* =====================================================================
   BLOG
   ===================================================================== */
.post-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(34px,4vw,56px) clamp(18px,2.4vw,34px)}
.post-card{display:flex;flex-direction:column}
.post-card .cover{display:block;aspect-ratio:3/2;overflow:hidden;border-radius:var(--radius-sm);background:var(--surface-alt)}
.post-card img{width:100%;height:100%;object-fit:cover;transition:transform .8s var(--ease)}
.post-card:hover img{transform:scale(1.045)}
.tag{display:inline-block;align-self:flex-start;margin:18px 0 10px;padding:5px 11px;border:1px solid var(--gold);border-radius:999px;font:600 .68rem/1 var(--sans);letter-spacing:.12em;text-transform:uppercase;color:var(--gold-deep)}
.post-card h3{font-size:clamp(1.65rem,2.2vw,2.05rem);line-height:1.08}
.post-card h3 a{text-decoration:none}
.post-card h3 a:hover{color:var(--gold-deep)}
.post-card p{margin:12px 0 16px;color:var(--muted);font-size:.96rem}
.post-card .foot{margin-top:auto;display:flex;justify-content:space-between;align-items:center;gap:12px;font-size:.86rem;color:var(--muted)}
.post-card.featured{grid-column:1/-1;display:grid;grid-template-columns:1.25fr 1fr;gap:clamp(24px,4vw,64px);align-items:center;padding-bottom:clamp(24px,3vw,40px);border-bottom:1px solid var(--line)}
.post-card.featured .cover{aspect-ratio:16/10}
.post-card.featured h3{font-size:clamp(2.2rem,4vw,3.4rem);line-height:1}
.post-card.featured .tag{margin-top:0}

.article-hero{padding-bottom:clamp(48px,6vw,80px)}
.article-hero h1{max-width:20ch;font-size:clamp(2.6rem,6vw,5.2rem)}
.article-meta{margin-top:26px;display:flex;flex-wrap:wrap;gap:6px 22px;color:rgba(244,241,234,.7);font-size:.92rem}
.article-cover{max-width:1100px;margin:calc(-1 * clamp(28px,4vw,60px)) auto 0;padding-inline:var(--pad);position:relative;z-index:2}
.article-cover img{width:100%;aspect-ratio:16/9;object-fit:cover;border-radius:var(--radius);box-shadow:0 30px 70px -30px rgba(13,33,28,.5);filter:saturate(.94) contrast(1.03)}
.prose{max-width:68ch;margin-inline:auto;font-size:1.12rem;line-height:1.78}
.prose p{margin-bottom:1.35em}
.prose h2{margin:2em 0 .55em;font-size:clamp(1.9rem,3vw,2.5rem);line-height:1.08}
.prose ul{margin:0 0 1.5em;padding-left:1.3em}
.prose li{margin-bottom:.5em;padding-left:.3em}
.prose li::marker{color:var(--gold-deep)}
.pull-quote{margin:2em 0;padding:6px 0 6px 28px;border-left:3px solid var(--gold);font:italic 500 clamp(1.7rem,3vw,2.3rem)/1.22 var(--serif);color:var(--forest)}
.prose figure{margin:2em 0}
.prose figure img{width:100%;border-radius:var(--radius-sm)}
.prose figcaption{margin-top:10px;font-size:.9rem;color:var(--muted)}
.cta-box{max-width:68ch;margin:clamp(40px,5vw,64px) auto 0;padding:clamp(26px,4vw,40px);border-radius:var(--radius);background:var(--forest-deep);color:var(--bg)}
.cta-box h3{margin-bottom:10px;font-size:clamp(1.8rem,3vw,2.3rem)}
.cta-box p{color:rgba(244,241,234,.78);margin-bottom:20px}

/* =====================================================================
   CTA BAND (used above the footer)
   ===================================================================== */
.cta-band{background:var(--forest);color:var(--bg);padding-block:clamp(48px,6vw,80px)}
.cta-band .wrap{display:flex;justify-content:space-between;align-items:center;gap:28px 48px;flex-wrap:wrap}
.cta-band h2{font-size:clamp(2rem,3.6vw,3rem);max-width:20ch}
.cta-band p{margin:10px 0 0;color:rgba(244,241,234,.75);max-width:48ch}

/* =====================================================================
   FOOTER, TOAST, FAB
   ===================================================================== */
.site-footer{background:var(--forest-deep);color:var(--bg);padding:clamp(52px,6vw,84px) 0 28px}
.footer-grid{display:grid;grid-template-columns:1.5fr 1fr 1fr 1.3fr;gap:clamp(28px,4vw,56px)}
.site-footer h4{margin:0 0 16px;font:600 .74rem/1 var(--sans);letter-spacing:.2em;text-transform:uppercase;color:var(--gold)}
.site-footer p,.site-footer li{color:rgba(244,241,234,.7);font-size:.94rem}
.site-footer ul{list-style:none}
.site-footer li{margin:8px 0}
.site-footer a{text-decoration:none;transition:color .2s}
.site-footer a:hover{color:var(--gold-soft)}
.site-footer .brand{display:inline-block;margin-bottom:16px;color:var(--bg)}
.site-footer .blurb{max-width:34ch}
.footer-social{display:flex;gap:10px;margin-top:18px}
.footer-social a{width:42px;height:42px;display:grid;place-items:center;border:1px solid var(--line-dark);border-radius:50%;color:var(--gold-soft)}
.footer-social a:hover{border-color:var(--gold);background:rgba(201,162,75,.12)}
.footer-social svg{width:18px;height:18px;fill:currentColor}
.legal{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;margin-top:clamp(36px,5vw,60px);padding-top:20px;border-top:1px solid var(--line-dark);font-size:.84rem;color:rgba(244,241,234,.55)}
.legal a{color:var(--gold);font-weight:700;text-decoration:none;transition:color .2s;margin-left:10px}
.legal a:hover{color:var(--gold-soft)}
.legal .credit{color:rgba(244,241,234,.7);font-weight:600;margin-left:12px;letter-spacing:.02em}

.toast{position:fixed;left:50%;bottom:24px;z-index:90;max-width:calc(100vw - 32px);padding:14px 20px;background:var(--forest-deep);color:var(--bg);border-left:4px solid var(--gold);border-radius:var(--radius-sm);box-shadow:0 14px 40px rgba(13,33,28,.4);font-weight:500;transform:translate(-50%,20px);opacity:0;pointer-events:none;transition:transform .3s var(--ease),opacity .3s}
.toast.show{transform:translate(-50%,0);opacity:1}
.fab{position:fixed;right:clamp(16px,2.4vw,28px);bottom:clamp(16px,2.4vw,28px);z-index:70;width:58px;height:58px;display:grid;place-items:center;border-radius:50%;background:var(--gold);color:var(--forest-deep);box-shadow:0 12px 30px -6px rgba(13,33,28,.55);transition:transform .25s var(--ease)}
.fab:hover{transform:scale(1.08)}
.fab svg{width:28px;height:28px;fill:currentColor}
html.menu-open .fab{display:none}
@media(max-width:760px){
  .fab{width:52px;height:52px}
  .fab svg{width:25px;height:25px}
  .site-footer{padding-bottom:92px}   /* keeps the last footer line clear of the floating button */
}

/* =====================================================================
   RESPONSIVE
   ===================================================================== */
@media(max-width:1100px){
  .product-grid{grid-template-columns:repeat(3,1fr)}
  .footer-grid{grid-template-columns:1fr 1fr}
  .steps.four{grid-template-columns:1fr 1fr;row-gap:40px}
}
@media(max-width:960px){
  .form-layout,.contact-grid,.split{grid-template-columns:1fr}
  .faq-layout{grid-template-columns:1fr}
  .faq-nav{position:static;display:flex;gap:8px;overflow-x:auto;margin-inline:calc(-1 * var(--pad));padding:0 var(--pad) 6px;scrollbar-width:none}
  .faq-nav h2{display:none}
  .faq-nav a{flex:none;border:1px solid var(--line);border-radius:999px;padding:9px 16px;white-space:nowrap}
  .faq-nav a:hover,.faq-nav a.on{border-color:var(--gold)}
  .review-grid,.steps{grid-template-columns:1fr}
  .steps{gap:36px}
  .post-grid{grid-template-columns:1fr 1fr}
  .post-card.featured{grid-template-columns:1fr}
  .split.reverse .photo-col{order:-1}
}
@media(max-width:860px){
  .room-grid{grid-template-columns:1fr;max-width:520px;margin-inline:auto}
  .room-tile{aspect-ratio:4/3.4}
  .look-grid{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:760px){
  .product-grid,.product-grid.cols-3{grid-template-columns:repeat(2,1fr);gap:26px 12px}
  .value-list{grid-template-columns:1fr}
  .gallery figure,.gallery figure:nth-child(1),.gallery figure:nth-child(6){grid-column:span 6}
  .gallery figure:nth-child(1),.gallery figure:nth-child(6){grid-column:span 12}
   .category-block-head{display:block}
   .category-block-head p{margin-top:10px}
  .photo{min-height:340px}
  .info-list li{grid-template-columns:1fr;gap:2px}
  .lightbox[open]{grid-template-columns:1fr;grid-template-rows:1fr auto;align-content:center}
  .lightbox .lb-prev,.lightbox .lb-next{position:absolute;bottom:20px}
  .lightbox .lb-prev{left:20px}
  .lightbox .lb-next{right:20px}
}
@media(max-width:560px){
  .form-grid{grid-template-columns:1fr}
  .form-grid .full{grid-column:auto}
  .post-grid{grid-template-columns:1fr}
  .footer-grid{grid-template-columns:1fr}
  .product-copy .button{width:100%}
  .tools,.tools .field{width:100%}
  .gallery figure,.gallery figure:nth-child(1),.gallery figure:nth-child(6){grid-column:span 12;min-height:220px}
   .category-jump{margin-bottom:34px}
   .category-gallery figure,.category-gallery figure:nth-child(1),.category-gallery figure:nth-child(6){grid-column:span 12}
   .gallery figcaption{padding-right:160px}
   .photo-estimate{font-size:.7rem;padding-inline:10px}
  .steps.four{grid-template-columns:1fr}
}
@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation:none!important;transition-duration:.01ms!important}
}
@media print{.site-nav,.mobile-panel,.fab,.toast{display:none!important}}

/* ---------- small layout helpers added for page composition ---------- */
.photo-col{display:flex;align-self:stretch}
.photo-col .photo{height:auto;flex:1;width:100%}
.split .copy .value-list{margin:34px 0 30px}
.steps.stack{grid-template-columns:1fr;gap:34px;margin-top:34px}
.steps.stack .step{padding-top:24px}
.steps.stack .step .num{font-size:3rem;margin-bottom:8px}
.section-head .button-row{flex:none}
.center{text-align:center}
.story-photos{position:relative;padding-bottom:clamp(40px,8vw,90px)}
.story-photos .p1{width:82%;aspect-ratio:4/5;object-fit:cover;border-radius:999px 999px var(--radius) var(--radius);background:var(--surface-alt)}
.story-photos .p2{position:absolute;right:0;bottom:0;width:52%;aspect-ratio:4/3;object-fit:cover;border-radius:var(--radius);border:6px solid var(--bg);background:var(--surface-alt)}
.story-photos img{height:auto;filter:saturate(.94) contrast(1.03)}
.workshop-grid img,.article-cover img{height:auto}
.workshop-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(12px,2vw,26px)}
.workshop-grid figure{margin:0}
.workshop-grid img{width:100%;aspect-ratio:4/5;object-fit:cover;border-radius:var(--radius-sm);filter:saturate(.94) contrast(1.03)}
.workshop-grid figcaption{margin-top:12px;padding-left:12px;border-left:3px solid var(--gold);font-weight:600}
.reviews-foot{margin-top:clamp(28px,4vw,44px);display:flex;gap:12px;flex-wrap:wrap}
.chips{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:clamp(28px,4vw,44px)}
@media(max-width:760px){.workshop-grid{grid-template-columns:1fr 1fr}.workshop-grid figure:last-child{grid-column:1/-1}.workshop-grid figure:last-child img{aspect-ratio:16/10}}

/* ---------- refined storefront direction ---------- */
:root{
  --bg:#f7f5ef;
  --surface:#fffefa;
  --surface-alt:#eeeadf;
  --ink:#211d18;
  --muted:#71695e;
  --forest:#203b32;
  --forest-deep:#142a23;
  --gold:#c8a45b;
  --gold-soft:#e6d3a8;
  --gold-deep:#85651b;
  --line:#e2dbcd;
  --radius:18px;
  --radius-sm:12px;
}

body{background:var(--bg)}
.section{padding-block:clamp(72px,9vw,132px)}
.section.alt{background:#efede6}
.site-nav,.site-nav.is-scrolled{
  background:rgba(20,42,35,.97);
  -webkit-backdrop-filter:blur(14px);
  backdrop-filter:blur(14px);
  box-shadow:0 1px 0 rgba(255,255,255,.08)
}
.site-nav{height:76px}
.nav-inner{max-width:1440px}
.brand{font-size:1.85rem}
.nav-links{gap:clamp(12px,1.4vw,24px)}
.nav-actions .button{box-shadow:0 6px 20px rgba(0,0,0,.12)}

.hero-slider{
  height:min(900px,100svh);
  min-height:710px;
  background:var(--bg);
  color:var(--ink);
}
.hero-slide{align-items:center}
.hero-media{
  inset:112px max(24px,calc((100vw - 1400px)/2 + 24px)) 86px 51%;
  z-index:0;
  border-radius:190px 18px 18px 18px;
  overflow:hidden;
  box-shadow:0 26px 70px rgba(48,39,24,.16)
}
.hero-media img{
  filter:saturate(.96) contrast(1.02);
}
.hero-slide.is-active .hero-media img{filter:saturate(.98) contrast(1.02)}
.hero-shade{display:none}
.hero-inner{
  z-index:1;
  display:block;
  padding-block:calc(var(--nav-h) + 80px) 120px;
}
.hero-copy{max-width:49%;padding-right:clamp(20px,4vw,64px)}
.hero .eyebrow{color:var(--gold-deep)}
.hero :is(h1,h2){
  max-width:10ch;
  font-size:clamp(4rem,min(7vw,11vh),7.2rem);
  line-height:.9;
  color:var(--forest-deep);
}
.hero .lede{
  max-width:42ch;
  margin:25px 0 30px;
  color:#625a50;
}
.hero .button.primary{box-shadow:0 8px 22px rgba(165,128,49,.2)}
.hero .button.ghost{
  border-color:rgba(32,59,50,.34);
  color:var(--forest);
}
.hero .button.ghost:hover{
  border-color:var(--forest);
  background:var(--forest);
  color:var(--bg);
}
.hero-plate{
  position:absolute;
  right:0;
  bottom:clamp(126px,13vw,170px);
  z-index:2;
  max-width:260px;
  padding:21px 23px;
  border-color:rgba(230,211,168,.42);
  background:rgba(20,42,35,.94);
  box-shadow:0 18px 48px rgba(15,29,23,.2)
}
.hero-controls{
  left:50%;
  right:auto;
  bottom:22px;
  width:100%;
  display:flex;
  align-items:center;
  justify-content:space-between;
  transform:translateX(-50%);
  color:var(--forest-deep)
}
.hero-arrow{border-color:rgba(32,59,50,.25);color:var(--forest)}
.hero-arrow:hover{background:var(--forest);color:var(--bg)}
.hero-count{color:var(--muted)}
.hero-dot{background:rgba(32,59,50,.3)}
.hero-dot.is-active{background:var(--forest)}
.hero-pause{border-color:rgba(32,59,50,.3);color:var(--forest)}

.assurance{
  background:var(--surface);
  border-block:1px solid var(--line);
  box-shadow:0 8px 30px rgba(52,43,28,.035)
}
.assurance-grid{max-width:1320px}
.room-grid{gap:clamp(16px,2vw,28px)}
.room-tile{aspect-ratio:4/4.6;border-radius:var(--radius)}
.room-tile:nth-child(2){margin-top:0}
.room-tile::after{
  background:linear-gradient(0deg,rgba(15,34,27,.84),rgba(15,34,27,.04) 72%)
}
.product-grid.cols-3{gap:clamp(28px,3vw,44px) clamp(18px,2vw,30px)}
.product-image{border-radius:var(--radius-sm)}
.product-copy h3{font-size:clamp(1.5rem,2vw,1.85rem)}
.product-copy .button{margin-top:10px}
.value .icon{background:rgba(201,164,91,.1)}
.map-card{border-radius:var(--radius);overflow:hidden}
.site-footer{background:#142a23}

.section[aria-labelledby="rev-h"][hidden]{display:none!important}
.project-showcase{background:#efede6}
.project-grid{
  display:grid;
  grid-template-columns:1.12fr .88fr .88fr;
  gap:clamp(14px,2vw,26px);
  align-items:start
}
.project-card{
  position:relative;
  display:block;
  min-width:0;
  aspect-ratio:4/5;
  overflow:hidden;
  border-radius:var(--radius);
  color:#fff;
  background:var(--forest);
  text-decoration:none;
  box-shadow:0 12px 34px rgba(38,33,25,.1)
}
.project-card:first-child{aspect-ratio:1/1.08}
.project-card img{
  width:100%;
  height:100%;
  object-fit:cover;
  transition:transform .8s var(--ease),filter .4s;
  filter:saturate(.9) contrast(1.02)
}
.project-card::after{
  content:"";
  position:absolute;
  inset:35% 0 0;
  background:linear-gradient(0deg,rgba(13,33,28,.82),transparent);
  pointer-events:none
}
.project-card:hover img{transform:scale(1.045);filter:saturate(1)}
.project-label{
  position:absolute;
  z-index:1;
  inset:auto 0 0;
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:12px;
  padding:clamp(18px,2.5vw,30px)
}
.project-label small{
  display:block;
  margin-bottom:8px;
  color:var(--gold-soft);
  font:600 .68rem/1 var(--sans);
  letter-spacing:.18em;
  text-transform:uppercase
}
.project-label b{font:500 clamp(1.65rem,2.5vw,2.35rem)/1.02 var(--serif)}
.project-arrow{
  display:grid;
  width:42px;
  height:42px;
  flex:none;
  place-items:center;
  border:1px solid rgba(255,255,255,.65);
  border-radius:50%;
  font-size:1.35rem;
  transition:background-color .2s,color .2s,transform .2s
}
.project-card:hover .project-arrow{
  transform:translateX(3px);
  background:var(--gold);
  border-color:var(--gold);
  color:var(--forest-deep)
}
.projects-action{display:flex;justify-content:center;margin-top:34px}

@media(max-width:1179px){
  .hero-slider{min-height:700px}
  .hero-media{left:48%;right:24px}
  .hero-copy{max-width:52%;padding-right:20px}
  .hero .hero-plate{display:none}
}
@media(max-width:860px){
  .hero-slider{height:auto;min-height:850px}
  .hero-slide{align-items:flex-start}
  .hero-media{
    inset:98px var(--pad) auto;
    height:min(44svh,390px);
    min-height:280px;
    border-radius:140px 16px 16px 16px
  }
  .hero-inner{padding:calc(min(44svh,390px) + 132px) var(--pad) 140px}
  .hero-copy{max-width:700px;padding:0}
  .hero :is(h1,h2){max-width:12ch;font-size:clamp(3.4rem,9vw,5rem)}
  .hero .lede{margin:18px 0 24px}
  .hero-controls{bottom:18px}
  .project-grid{grid-template-columns:1fr 1fr}
  .project-card:first-child{grid-row:span 2;aspect-ratio:auto;min-height:100%}
  .project-card{aspect-ratio:4/5}
}
@media(max-width:560px){
  .section{padding-block:66px}
  .hero-slider{height:max(860px,112svh);min-height:0}
  .hero-media{
    inset:92px 16px auto;
    height:34svh;
    min-height:250px;
    border-radius:100px 14px 14px 14px
  }
  .hero-inner{padding:calc(34svh + 118px) 0 142px}
  .hero :is(h1,h2){font-size:clamp(3.3rem,14vw,4.4rem)}
  .hero .lede{font-size:1rem}
  .hero .button-row{gap:10px}
  .hero .button-row .button{width:auto;flex:1;padding:13px 14px;font-size:.86rem}
  .hero-controls{bottom:20px}
  .hero-pagination{gap:9px}
  .hero-dot{width:22px}
  .room-tile{aspect-ratio:4/3.2}
  .project-grid{grid-template-columns:1fr;max-width:520px;margin-inline:auto}
  .project-card,.project-card:first-child{aspect-ratio:4/3;grid-row:auto;min-height:0}
  .project-label{padding:20px}
}
@media(min-width:561px) and (max-width:860px) and (max-height:700px){
  .hero-slider{height:940px;min-height:940px}
}
@media(min-width:861px){
  .hero :is(h1,h2){max-width:12ch;font-size:clamp(3.4rem,min(7vw,8vh),6rem)}
  .hero .lede{margin:20px 0 22px}
}
