/* ==========================================================================
   River Club Blinds — stylesheet
   Theme: golf-estate | Layout: boxed editorial hero, centred, asymmetric
   Palette: pewter + almond + wine red | Fonts: Cormorant Garamond + Work Sans
   ========================================================================== */

:root{
  --ink:#242019;
  --ink-soft:#4a4438;
  --pewter:#8d8d82;
  --pewter-light:#cfcdc0;
  --pewter-dark:#5c5c52;
  --almond:#e9dcc2;
  --almond-pale:#f8f2e4;
  --wine:#6d1f2c;
  --wine-deep:#40101a;
  --wine-light:#9a4451;
  --paper:#f6f1e5;
  --white:#fffdf9;
  --line:rgba(36,32,25,.14);
  --line-strong:rgba(36,32,25,.24);
  --shadow-lg:0 30px 70px -30px rgba(29,24,15,.45);
  --shadow-md:0 14px 34px -18px rgba(29,24,15,.35);
  --radius:3px;
  --maxw:1240px;
  --ff-display:'Cormorant Garamond', Georgia, serif;
  --ff-body:'Work Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --ease:cubic-bezier(.22,.68,.25,1);
}

*,*::before,*::after{box-sizing:border-box;}
html{scroll-behavior:smooth;}
@media (prefers-reduced-motion: reduce){
  html{scroll-behavior:auto;}
}
body{
  margin:0;
  background:var(--paper);
  color:var(--ink);
  font-family:var(--ff-body);
  font-size:17px;
  line-height:1.7;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
img{max-width:100%;display:block;}
a{color:inherit;text-decoration:none;}
ul{list-style:none;margin:0;padding:0;}
h1,h2,h3,h4{font-family:var(--ff-display);font-weight:600;line-height:1.08;letter-spacing:-0.015em;margin:0;color:var(--ink);}
p{margin:0;}
button{font-family:inherit;cursor:pointer;}
input,select,textarea{font-family:inherit;font-size:16px;}
:focus-visible{outline:2px solid var(--wine);outline-offset:3px;}
.visually-hidden{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;}

.skip-link{
  position:absolute;left:-999px;top:0;background:var(--ink);color:var(--white);
  padding:.8em 1.4em;z-index:999;
}
.skip-link:focus{left:1em;top:1em;}

.container{max-width:var(--maxw);margin:0 auto;padding:0 28px;}
.eyebrow{
  font-family:var(--ff-body);
  font-size:12.5px;
  letter-spacing:.24em;
  text-transform:uppercase;
  color:var(--wine);
  font-weight:600;
  margin:0 0 14px;
  display:inline-flex;
  align-items:center;
  gap:10px;
}
.eyebrow::before{
  content:"";
  width:26px;height:1px;background:var(--wine);
  display:inline-block;
}
.section-head{text-align:center;max-width:640px;margin:0 auto 56px;}
.section-head.left{text-align:left;margin-left:0;}
.section-head h2{font-size:clamp(2rem,3.6vw,2.9rem);}
.section-head p{margin-top:16px;color:var(--ink-soft);font-size:1.06rem;}

section{padding:96px 0;position:relative;}
@media (max-width:720px){section{padding:64px 0;}}

.rule{
  width:64px;height:2px;background:var(--wine);
  transform-origin:left;
  margin:22px auto 0;
}
.section-head.left .rule{margin-left:0;}
.js-anim .rule{transform:scaleX(0);}
.js-anim .rule.in-view{transform:scaleX(1);transition:transform .9s var(--ease);}

/* ---------- Buttons ---------- */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:10px;
  padding:15px 30px;border-radius:1px;font-size:.92rem;font-weight:600;
  letter-spacing:.03em;border:1px solid transparent;transition:transform .25s var(--ease),background .25s var(--ease),color .25s var(--ease),border-color .25s var(--ease),box-shadow .25s var(--ease);
  position:relative;
}
.btn-primary{background:var(--wine);color:var(--white);}
.btn-primary:hover{background:var(--wine-deep);box-shadow:var(--shadow-md);}
.btn-outline{border-color:var(--ink);color:var(--ink);background:transparent;}
.btn-outline:hover{background:var(--ink);color:var(--white);}
.btn-outline.light{border-color:rgba(255,253,249,.55);color:var(--white);}
.btn-outline.light:hover{background:var(--white);color:var(--ink);}
.btn-block{width:100%;}

/* ---------- Nav ---------- */
.nav{
  position:fixed;top:0;left:0;right:0;z-index:200;
  padding:22px 0;
  transition:background .35s var(--ease),padding .35s var(--ease),box-shadow .35s var(--ease),border-color .35s var(--ease);
  border-bottom:1px solid transparent;
}
.nav.scrolled{
  background:rgba(246,241,229,.92);
  -webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);
  padding:14px 0;
  border-color:var(--line);
  box-shadow:0 8px 24px -18px rgba(29,24,15,.4);
}
.nav .container{display:flex;align-items:center;justify-content:space-between;gap:24px;}
.brand{display:flex;align-items:center;gap:12px;}
.brand-mark{width:36px;height:auto;flex:none;color:var(--ink);}
.brand-mark .accent{color:var(--wine);}
.brand-word{font-family:var(--ff-display);font-size:1.32rem;font-weight:600;color:var(--ink);letter-spacing:-.01em;}
.brand-word small{display:block;font-family:var(--ff-body);font-size:.56rem;letter-spacing:.26em;text-transform:uppercase;color:var(--wine);font-weight:600;margin-top:2px;}

.nav-links{display:flex;align-items:center;gap:34px;}
.nav-links a{font-size:.9rem;font-weight:500;position:relative;padding:4px 0;color:var(--ink-soft);transition:color .25s var(--ease);}
.nav-links a::after{content:"";position:absolute;left:0;bottom:-2px;width:100%;height:1px;background:var(--wine);transform:scaleX(0);transform-origin:left;transition:transform .3s var(--ease);}
.nav-links a:hover{color:var(--ink);}
.nav-links a:hover::after{transform:scaleX(1);}
.nav-cta{display:flex;align-items:center;gap:18px;}
.nav-cta .btn{padding:11px 22px;font-size:.82rem;}
.nav-toggle{display:none;background:none;border:none;padding:8px;color:var(--ink);}
.nav-toggle svg{width:24px;height:24px;}

@media (max-width:880px){
  .nav-links{position:fixed;top:0;right:0;height:100vh;width:min(78vw,320px);
    background:var(--paper);flex-direction:column;justify-content:center;align-items:flex-start;
    padding:40px 40px;gap:26px;transform:translateX(100%);transition:transform .4s var(--ease);
    box-shadow:-20px 0 50px -20px rgba(0,0,0,.3);}
  .nav-links.open{transform:translateX(0);}
  .nav-links a{font-size:1.1rem;}
  .nav-cta .btn-outline{display:none;}
  .nav-toggle{display:block;}
}

/* ---------- Hero ---------- */
.hero{
  padding:168px 0 80px;
  position:relative;
  background:
    radial-gradient(circle at 18% 20%, rgba(109,31,44,.05), transparent 40%),
    repeating-linear-gradient(115deg, rgba(36,32,25,.035) 0 1px, transparent 1px 34px),
    var(--paper);
  text-align:center;
  overflow:hidden;
}
.hero-eyebrow{justify-content:center;}
.hero-headline{
  font-size:clamp(2.5rem,5.6vw,4.5rem);
  max-width:16ch;margin:0 auto;color:var(--ink);
}
[data-split-words] .word{display:inline-block;opacity:1;transform:none;}
.js-anim [data-split-words] .word{opacity:0;transform:translateY(24px);}
.hero-sub{
  max-width:52ch;margin:26px auto 0;color:var(--ink-soft);font-size:1.12rem;line-height:1.65;
}
.hero-ctas{display:flex;gap:16px;justify-content:center;margin:38px 0 0;flex-wrap:wrap;}

.hero-frame{
  max-width:1040px;margin:64px auto 0;padding:0 8px;
}
.hero-frame-inner{
  position:relative;border-radius:var(--radius);overflow:hidden;
  box-shadow:var(--shadow-lg);
  perspective:1400px;
  aspect-ratio:16/10;
  background:var(--pewter-dark);
}
.hero-photo{width:100%;height:100%;object-fit:cover;position:absolute;inset:0;}
.hero-scrim{
  position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(180deg, rgba(20,16,10,0) 58%, rgba(20,16,10,.34) 100%);
}
/* Signature moment — the louvre reveal.
   The slats are a translucent venetian veil over the hero photograph: the
   picture is legible from the first frame, and GSAP tilts the slats open on
   load, then dissolves them as you scroll into the page. The resting state
   below is the OPEN one on purpose — if the script never runs, or throws,
   the photograph is still clearly visible. */
.hero-slats{
  position:absolute;inset:0;display:none;flex-direction:column;
  transform-style:preserve-3d;pointer-events:none;
}
.js-anim .hero-slats{display:flex;}
.hero-slats .slat{
  flex:1 1 0;position:relative;transform-origin:top center;
  transform:rotateX(-84deg);
  background:linear-gradient(180deg,rgba(207,205,192,.92),rgba(92,92,82,.85));
  border-bottom:1px solid rgba(20,16,10,.3);
  box-shadow:inset 0 -6px 10px -6px rgba(20,16,10,.3);
}
.hero-slats .slat:nth-child(odd){background:linear-gradient(180deg,rgba(233,220,194,.9),rgba(201,191,162,.82));}
.hero-glint{
  position:absolute;top:-30%;bottom:-30%;left:-40%;width:26%;
  background:linear-gradient(100deg,rgba(255,253,249,0),rgba(255,253,249,.5),rgba(255,253,249,0));
  transform:skewX(-14deg);opacity:0;pointer-events:none;display:none;
}
.js-anim .hero-glint{display:block;}
@media (prefers-reduced-motion: reduce){
  .hero-slats,.hero-glint{display:none !important;}
}
.hero-frame-caption{
  display:flex;justify-content:space-between;gap:16px;margin-top:16px;
  font-size:.78rem;color:var(--pewter-dark);letter-spacing:.03em;text-align:left;
}

.trust-row{
  max-width:920px;margin:52px auto 0;
  display:flex;justify-content:center;gap:36px;flex-wrap:wrap;
}
.trust-row li{
  display:flex;align-items:center;gap:10px;font-size:.92rem;color:var(--ink-soft);font-weight:500;
}
.trust-row svg{width:18px;height:18px;color:var(--wine);flex:none;}

/* ---------- Marquee ---------- */
.marquee-band{
  background:var(--ink);color:var(--almond-pale);
  padding:16px 0;overflow:hidden;white-space:nowrap;
}
.marquee-track{display:inline-flex;gap:0;animation:marquee 42s linear infinite;}
@media (prefers-reduced-motion: reduce){.marquee-track{animation:none;}}
.marquee-track span{
  font-family:var(--ff-display);font-style:italic;font-size:1.18rem;font-weight:500;
  padding:0 34px;display:inline-flex;align-items:center;gap:34px;color:var(--almond-pale);
}
.marquee-track span::after{content:"✦";color:var(--wine-light);font-size:.8rem;}
@keyframes marquee{from{transform:translateX(0);}to{transform:translateX(-50%);}}

/* ---------- Products grid ---------- */
.products{background:var(--paper);}
.product-grid{
  display:grid;grid-template-columns:repeat(4,1fr);gap:1px;
  background:var(--line);border:1px solid var(--line);
}
@media (max-width:980px){.product-grid{grid-template-columns:repeat(2,1fr);}}
@media (max-width:560px){.product-grid{grid-template-columns:1fr;}}
.product-card{
  background:var(--white);padding:38px 30px;display:flex;flex-direction:column;gap:16px;
  transition:background .3s var(--ease);
}
.product-card:hover{background:var(--almond-pale);}
.product-card .icon{
  width:52px;height:52px;color:var(--ink);transition:color .3s var(--ease),transform .3s var(--ease);
}
.product-card:hover .icon{color:var(--wine);transform:translateY(-3px);}
.product-card h3{font-size:1.28rem;font-weight:600;}
.product-card p{color:var(--ink-soft);font-size:.94rem;flex:1;}
.product-link{
  font-size:.82rem;font-weight:600;letter-spacing:.03em;color:var(--wine);
  display:inline-flex;align-items:center;gap:6px;
}
.product-link svg{width:14px;height:14px;transition:transform .25s var(--ease);}
.product-card:hover .product-link svg{transform:translateX(4px);}

/* ---------- Editorial (asymmetric) ---------- */
.editorial{background:var(--white);}
.editorial-grid{
  display:grid;grid-template-columns:7fr 5fr;gap:30px;align-items:start;
}
@media (max-width:900px){.editorial-grid{grid-template-columns:1fr;}}
.editorial-lead{grid-column:1 / 2;grid-row:1 / 3;}
@media (max-width:900px){.editorial-lead{grid-column:auto;grid-row:auto;}}
.ed-photo{position:relative;border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow-md);}
.ed-photo img{width:100%;height:100%;object-fit:cover;}
.ed-caption{
  position:absolute;left:0;right:0;bottom:0;padding:22px 24px;
  background:linear-gradient(180deg, transparent, rgba(20,16,10,.72));
  color:var(--almond-pale);font-size:.9rem;line-height:1.5;
}
.editorial-lead .ed-photo{aspect-ratio:4/5;}
.ed-secondary{display:flex;flex-direction:column;gap:30px;}
.ed-secondary .ed-photo{aspect-ratio:16/10;}
.ed-secondary.offset{margin-top:46px;}
.ed-note{
  background:var(--almond-pale);padding:30px 28px;border-left:3px solid var(--wine);
}
.ed-note h4{font-family:var(--ff-display);font-size:1.3rem;margin-bottom:10px;}
.ed-note p{color:var(--ink-soft);font-size:.96rem;}

/* ---------- Locale story ---------- */
.locale{background:var(--ink);color:var(--almond-pale);}
.locale .eyebrow{color:var(--wine-light);}
.locale .eyebrow::before{background:var(--wine-light);}
.locale-grid{display:grid;grid-template-columns:5fr 7fr;gap:64px;align-items:start;}
@media (max-width:900px){.locale-grid{grid-template-columns:1fr;gap:32px;}}
.locale h2{color:var(--white);font-size:clamp(2rem,3.4vw,2.7rem);}
.locale-body p{color:rgba(248,242,228,.82);font-size:1.02rem;margin-bottom:18px;}
.locale-facts{display:grid;gap:22px;}
.locale-fact{padding:22px 0;border-top:1px solid rgba(248,242,228,.18);}
.locale-fact:first-child{border-top:none;}
.locale-fact h4{color:var(--almond);font-family:var(--ff-display);font-size:1.22rem;margin-bottom:8px;font-weight:600;}
.locale-fact p{color:rgba(248,242,228,.72);font-size:.94rem;}

/* ---------- Process ---------- */
.process{background:var(--paper);}
.process-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:36px;position:relative;}
.process-grid::before{
  content:"";position:absolute;top:26px;left:8%;right:8%;height:1px;background:var(--line-strong);
}
@media (max-width:860px){.process-grid{grid-template-columns:1fr 1fr;row-gap:44px;}.process-grid::before{display:none;}}
@media (max-width:520px){.process-grid{grid-template-columns:1fr;}}
.step{position:relative;}
.step-num{
  width:54px;height:54px;border-radius:50%;background:var(--white);border:1px solid var(--line-strong);
  display:flex;align-items:center;justify-content:center;font-family:var(--ff-display);font-size:1.4rem;color:var(--wine);
  margin-bottom:20px;position:relative;z-index:1;
}
.step h3{font-size:1.18rem;margin-bottom:8px;}
.step p{color:var(--ink-soft);font-size:.92rem;}

/* ---------- Areas ---------- */
.areas{background:var(--white);}
.area-chip-row{display:flex;flex-wrap:wrap;gap:14px;justify-content:center;margin-top:8px;}
.area-chip{
  border:1px solid var(--line-strong);padding:13px 26px;border-radius:100px;
  font-size:.92rem;font-weight:500;display:inline-flex;align-items:center;gap:10px;
  transition:border-color .25s var(--ease),background .25s var(--ease),color .25s var(--ease);
}
.area-chip svg{width:14px;height:14px;color:var(--wine);}
.area-chip:hover{background:var(--ink);border-color:var(--ink);color:var(--white);}
.area-chip:hover svg{color:var(--almond);}

/* ---------- FAQ ---------- */
.faq{background:var(--paper);}
.faq-list{max-width:820px;margin:0 auto;}
.faq-item{border-bottom:1px solid var(--line-strong);}
.faq-item summary{
  list-style:none;cursor:pointer;padding:26px 4px;display:flex;align-items:center;justify-content:space-between;gap:20px;
  font-family:var(--ff-display);font-size:1.24rem;font-weight:600;color:var(--ink);
}
.faq-item summary::-webkit-details-marker{display:none;}
.faq-indicator{
  width:26px;height:26px;flex:none;position:relative;
}
.faq-indicator::before,.faq-indicator::after{
  content:"";position:absolute;background:var(--wine);top:50%;left:50%;transition:transform .3s var(--ease);
}
.faq-indicator::before{width:16px;height:2px;transform:translate(-50%,-50%);}
.faq-indicator::after{width:2px;height:16px;transform:translate(-50%,-50%);}
.faq-item[open] .faq-indicator::after{transform:translate(-50%,-50%) rotate(90deg);opacity:0;}
.faq-item[open] .faq-indicator::before{transform:translate(-50%,-50%) rotate(180deg);}
.faq-a{padding:0 4px 28px;color:var(--ink-soft);font-size:.98rem;max-width:68ch;}

/* ---------- Closing CTA ---------- */
.closing-cta{
  position:relative;overflow:hidden;background:var(--wine-deep);color:var(--white);text-align:center;
}
.closing-cta::before,.closing-cta::after{
  content:"";position:absolute;border-radius:50%;filter:blur(60px);opacity:.55;
  animation:drift 22s ease-in-out infinite;
}
.closing-cta::before{width:520px;height:520px;background:var(--wine-light);top:-220px;left:-140px;}
.closing-cta::after{width:420px;height:420px;background:var(--almond);top:auto;bottom:-220px;right:-120px;animation-delay:-9s;opacity:.18;}
@keyframes drift{
  0%,100%{transform:translate(0,0) scale(1);}
  50%{transform:translate(60px,40px) scale(1.15);}
}
@media (prefers-reduced-motion: reduce){.closing-cta::before,.closing-cta::after{animation:none;}}
.closing-cta .container{position:relative;z-index:1;max-width:680px;}
.closing-cta h2{color:var(--white);font-size:clamp(2rem,4vw,3rem);}
.closing-cta p{color:rgba(255,253,249,.78);margin-top:18px;font-size:1.05rem;}
.closing-cta .btn-primary{background:var(--almond);color:var(--wine-deep);margin-top:34px;}
.closing-cta .btn-primary:hover{background:var(--white);}

/* ---------- Enquiry form ---------- */
.enquiry{background:var(--white);}
.enquiry-grid{display:grid;grid-template-columns:5fr 7fr;gap:60px;align-items:start;}
@media (max-width:900px){.enquiry-grid{grid-template-columns:1fr;gap:36px;}}
.enquiry-side h2{font-size:clamp(1.9rem,3.2vw,2.5rem);margin-bottom:18px;}
.enquiry-side p{color:var(--ink-soft);margin-bottom:14px;}
.enquiry-side ul{margin-top:24px;display:grid;gap:14px;}
.enquiry-side li{display:flex;gap:12px;align-items:flex-start;font-size:.94rem;color:var(--ink-soft);}
.enquiry-side svg{width:18px;height:18px;color:var(--wine);flex:none;margin-top:2px;}

.form-card{background:var(--almond-pale);padding:40px;border-radius:var(--radius);border:1px solid var(--line);}
.form-row{display:grid;grid-template-columns:1fr 1fr;gap:20px;}
@media (max-width:560px){.form-row{grid-template-columns:1fr;}}
.field{margin-bottom:20px;}
.field label{display:block;font-size:.82rem;font-weight:600;letter-spacing:.02em;margin-bottom:8px;color:var(--ink);}
.field input,.field select,.field textarea{
  width:100%;padding:13px 15px;border:1px solid var(--line-strong);border-radius:1px;background:var(--white);
  color:var(--ink);transition:border-color .25s var(--ease),box-shadow .25s var(--ease);
}
.field input:focus,.field select:focus,.field textarea:focus{border-color:var(--wine);box-shadow:0 0 0 3px rgba(109,31,44,.12);outline:none;}
.field textarea{resize:vertical;min-height:110px;}
.popia-note{font-size:.82rem;color:var(--ink-soft);margin:6px 0 22px;line-height:1.55;}
.popia-note strong{color:var(--ink);}
.form-success{
  display:none;background:var(--white);border:1px solid var(--line-strong);border-left:3px solid var(--wine);
  padding:24px;font-size:.95rem;color:var(--ink-soft);
}
.form-success.visible{display:block;}
.form-success strong{color:var(--ink);display:block;font-family:var(--ff-display);font-size:1.2rem;margin-bottom:6px;}

/* ---------- Footer ---------- */
footer{background:var(--ink);color:rgba(248,242,228,.75);padding:70px 0 30px;}
.footer-top{display:grid;grid-template-columns:1.3fr 1fr 1fr 1fr;gap:40px;padding-bottom:46px;border-bottom:1px solid rgba(248,242,228,.14);}
@media (max-width:980px){.footer-top{grid-template-columns:1fr 1fr;gap:32px;}}
@media (max-width:820px){.footer-top{grid-template-columns:1fr;gap:36px;}}
.footer-brand .brand-word{color:var(--white);}
.footer-brand .brand-mark{color:var(--almond);}
.footer-brand .brand-mark .accent{color:var(--wine-light);}
.footer-tag{margin-top:16px;max-width:34ch;font-size:.94rem;color:rgba(248,242,228,.68);}
.footer-col h5{color:var(--white);font-family:var(--ff-body);font-size:.82rem;letter-spacing:.16em;text-transform:uppercase;margin-bottom:18px;font-weight:600;}
.footer-col ul{display:grid;gap:11px;}
.footer-col a{font-size:.92rem;color:rgba(248,242,228,.68);transition:color .2s var(--ease);}
.footer-col a:hover{color:var(--almond);}
.footer-bottom{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:14px;padding-top:26px;font-size:.82rem;color:rgba(248,242,228,.55);}
.footer-popia{max-width:60ch;font-size:.82rem;color:rgba(248,242,228,.55);margin-top:26px;line-height:1.6;}

/* ---------- Reveal utility ---------- */
.reveal{opacity:1;transform:none;}
.js-anim .reveal{opacity:0;transform:translateY(34px);}
.js-anim .reveal.in-view{opacity:1;transform:none;transition:opacity .8s var(--ease),transform .8s var(--ease);}

/* ---------- Interior pages: product / area templates ---------- */
.page-hero{padding:150px 0 66px;background:
    radial-gradient(circle at 18% 20%, rgba(109,31,44,.05), transparent 40%),
    repeating-linear-gradient(115deg, rgba(36,32,25,.035) 0 1px, transparent 1px 34px),
    var(--paper);}
.breadcrumb{font-size:.82rem;color:var(--pewter-dark);margin-bottom:20px;display:flex;gap:8px;align-items:center;flex-wrap:wrap;}
.breadcrumb a{color:var(--wine);font-weight:600;}
.breadcrumb a:hover{text-decoration:underline;}
.page-hero h1{font-size:clamp(2.2rem,4.4vw,3.3rem);max-width:19ch;}
.page-hero .hero-sub{margin:20px 0 0;text-align:left;max-width:64ch;}
.page-hero .hero-eyebrow{justify-content:flex-start;}
.page-photo{margin-top:44px;border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow-lg);position:relative;aspect-ratio:21/9;}
.page-photo img{width:100%;height:100%;object-fit:cover;}
/* A product close-up is a smaller native-resolution file — frame it to its own
   size rather than stretching it across the full column. */
.page-photo.tight{max-width:900px;aspect-ratio:3/2;}

.prose-section{background:var(--white);}
.prose-grid{display:grid;grid-template-columns:7fr 5fr;gap:60px;align-items:start;}
@media (max-width:900px){.prose-grid{grid-template-columns:1fr;}}
.prose h2{font-size:clamp(1.6rem,2.8vw,2.15rem);margin:44px 0 16px;}
.prose h2:first-child{margin-top:0;}
.prose p{color:var(--ink-soft);margin-bottom:16px;font-size:1rem;}
.prose ul.check-list{display:grid;gap:12px;margin:18px 0 28px;}
.prose ul.check-list li{display:flex;gap:12px;align-items:flex-start;color:var(--ink-soft);font-size:.98rem;}
.prose ul.check-list li svg{width:18px;height:18px;color:var(--wine);flex:none;margin-top:3px;}
.limitation-box{background:var(--almond-pale);border-left:3px solid var(--wine);padding:24px 26px;margin-top:36px;}
.limitation-box h4{font-family:var(--ff-display);font-size:1.18rem;margin-bottom:8px;font-weight:600;}
.limitation-box p{color:var(--ink-soft);font-size:.94rem;margin:0;}

.side-card{background:var(--almond-pale);padding:30px;border-radius:var(--radius);border:1px solid var(--line);position:sticky;top:110px;}
.side-card h4{font-family:var(--ff-display);font-size:1.25rem;margin-bottom:16px;font-weight:600;}
.side-card + .side-card{margin-top:24px;}
.side-card ul{display:grid;gap:2px;margin-bottom:6px;}
.side-card ul li a{font-size:.92rem;color:var(--ink-soft);display:flex;justify-content:space-between;padding:9px 0;border-bottom:1px solid var(--line);transition:color .2s var(--ease);}
.side-card ul li:last-child a{border-bottom:none;}
.side-card ul li a:hover{color:var(--wine);}
.side-card p{font-size:.9rem;color:var(--ink-soft);margin-bottom:16px;}
.side-card dl{display:grid;grid-template-columns:auto 1fr;gap:8px 14px;font-size:.88rem;}
.side-card dt{color:var(--pewter-dark);font-weight:600;}
.side-card dd{margin:0;color:var(--ink-soft);}

.mini-cta{background:var(--ink);color:var(--almond-pale);text-align:center;padding:64px 0;}
.mini-cta h2{color:var(--white);font-size:clamp(1.8rem,3.2vw,2.4rem);}
.mini-cta p{color:rgba(248,242,228,.75);margin:14px auto 0;max-width:52ch;}
.mini-cta .btn{margin-top:28px;}

.related{background:var(--paper);}

/* ---------- Chat widget ---------- */
.chat-widget{position:fixed;right:22px;bottom:22px;z-index:400;font-family:var(--ff-body);}
.chat-toggle{
  width:60px;height:60px;border-radius:50%;background:var(--wine);color:var(--white);border:none;
  display:flex;align-items:center;justify-content:center;box-shadow:0 16px 34px -12px rgba(64,16,26,.55);
  transition:transform .3s var(--ease),background .3s var(--ease);
}
.chat-toggle:hover{background:var(--wine-deep);transform:translateY(-3px);}
.chat-toggle svg{width:26px;height:26px;}
.chat-toggle .icon-close{display:none;}
.chat-widget.open .chat-toggle .icon-chat{display:none;}
.chat-widget.open .chat-toggle .icon-close{display:block;}

.chat-panel{
  position:absolute;right:0;bottom:76px;width:340px;max-width:calc(100vw - 40px);
  background:var(--white);border-radius:8px;box-shadow:0 30px 70px -20px rgba(20,16,10,.45);
  border:1px solid var(--line);overflow:hidden;
  display:flex;flex-direction:column;max-height:min(560px,70vh);
  opacity:0;transform:translateY(16px) scale(.98);pointer-events:none;visibility:hidden;
  transition:opacity .28s var(--ease),transform .28s var(--ease),visibility .28s var(--ease);
}
.chat-widget.open .chat-panel{opacity:1;transform:translateY(0) scale(1);pointer-events:auto;visibility:visible;}
.chat-header{
  background:var(--ink);color:var(--white);padding:16px 18px;display:flex;align-items:center;gap:12px;
}
.chat-header .brand-mark{width:26px;color:var(--almond);}
.chat-header .brand-mark .accent{color:var(--wine-light);}
.chat-header-text strong{display:block;font-family:var(--ff-display);font-size:1.05rem;font-weight:600;}
.chat-header-text span{font-size:.74rem;color:rgba(248,242,228,.65);}
.chat-header-close{margin-left:auto;background:none;border:none;color:rgba(248,242,228,.7);padding:4px;}
.chat-header-close svg{width:18px;height:18px;}

.chat-body{flex:1;overflow-y:auto;padding:18px;display:flex;flex-direction:column;gap:12px;background:var(--almond-pale);}
.chat-msg{max-width:85%;padding:11px 14px;border-radius:12px;font-size:.88rem;line-height:1.5;}
.chat-msg.bot{background:var(--white);border:1px solid var(--line);align-self:flex-start;border-bottom-left-radius:3px;}
.chat-msg.user{background:var(--wine);color:var(--white);align-self:flex-end;border-bottom-right-radius:3px;}
.chat-msg.bot small{display:block;margin-top:6px;color:var(--pewter-dark);font-size:.72rem;line-height:1.4;}

.chat-quick{display:flex;flex-wrap:wrap;gap:8px;padding:0 18px 14px;background:var(--almond-pale);}
.chat-quick[hidden]{display:none;}
.chat-chip{
  border:1px solid var(--line-strong);background:var(--white);border-radius:100px;padding:8px 14px;
  font-size:.8rem;font-weight:500;color:var(--ink);transition:background .2s var(--ease),color .2s var(--ease);
}
.chat-chip:hover{background:var(--wine);color:var(--white);border-color:var(--wine);}

.chat-form{display:flex;gap:8px;padding:14px;border-top:1px solid var(--line);background:var(--white);}
.chat-form input{flex:1;border:1px solid var(--line-strong);border-radius:100px;padding:10px 16px;font-size:.86rem;}
.chat-form input:focus{outline:none;border-color:var(--wine);}
.chat-form button{
  width:38px;height:38px;border-radius:50%;background:var(--wine);color:var(--white);border:none;
  display:flex;align-items:center;justify-content:center;flex:none;
}
.chat-form button svg{width:16px;height:16px;}
.chat-form.hidden{display:none;}

@media (max-width:480px){
  .chat-panel{width:calc(100vw - 40px);}
}


/* roller shutters are shading products, not security products — see design-brief.md */
.rs-note{font-size:.94rem;line-height:1.6;opacity:.85;margin:14px 0 0;
  padding:12px 14px;border-left:2px solid currentColor}
.rs-note strong{font-weight:600}

/* ==========================================================================
   Craft pass — product thumbnails, chat detail, focus & motion manners
   ========================================================================== */

/* Product card photo: framed, and it eases in closer on hover */
.pthumb{
  display:block;overflow:hidden;border-radius:2px;aspect-ratio:4/3;
  background:var(--pewter-light);
}
.pthumb img{
  width:100%;height:100%;object-fit:cover;display:block;
  transition:transform .7s var(--ease);
}
.product-card:hover .pthumb img,
.product-card:focus-within .pthumb img{transform:scale(1.06);}

/* Inline figure inside a prose column */
.prose-figure{
  margin:26px 0 32px;position:relative;border-radius:var(--radius);
  overflow:hidden;box-shadow:var(--shadow-md);
}
.prose-figure img{width:100%;height:auto;aspect-ratio:16/10;object-fit:cover;display:block;}

/* Anchor targets clear the fixed nav */
section[id]{scroll-margin-top:96px;}

/* FAQ answer settles in when the panel opens */
.faq-item[open] .faq-a{animation:faqOpen .38s var(--ease) both;}
@keyframes faqOpen{from{opacity:0;transform:translateY(-6px);}to{opacity:1;transform:none;}}
.faq-item summary:hover{color:var(--wine);}

/* Mobile drawer is properly hidden from keyboard and screen readers when shut */
@media (max-width:880px){
  .nav-links{visibility:hidden;transition:transform .4s var(--ease),visibility .4s var(--ease);}
  .nav-links.open{visibility:visible;}
}

/* Chat: typing indicator + POPIA line */
.chat-typing{
  align-self:flex-start;display:inline-flex;gap:5px;align-items:center;
  background:var(--white);border:1px solid var(--line);
  border-radius:12px;border-bottom-left-radius:3px;padding:13px 15px;
}
.chat-typing span{
  width:6px;height:6px;border-radius:50%;background:var(--pewter);
  animation:chatDot 1.1s ease-in-out infinite;
}
.chat-typing span:nth-child(2){animation-delay:.15s;}
.chat-typing span:nth-child(3){animation-delay:.3s;}
@keyframes chatDot{0%,100%{opacity:.3;transform:translateY(0);}50%{opacity:1;transform:translateY(-3px);}}
.chat-msg.popia{
  max-width:100%;align-self:flex-start;background:transparent;border:none;
  border-left:2px solid var(--wine-light);border-radius:0;
  padding:2px 0 2px 12px;font-size:.78rem;line-height:1.5;color:var(--pewter-dark);
}
.chat-chip:focus-visible{outline:2px solid var(--wine);outline-offset:2px;}

@media (prefers-reduced-motion: reduce){
  .pthumb img{transition:none;}
  .product-card:hover .pthumb img,
  .product-card:focus-within .pthumb img{transform:none;}
  .faq-item[open] .faq-a{animation:none;}
  .chat-typing span{animation:none;opacity:.6;}
  .btn,.area-chip,.nav-links a::after,.chat-toggle,.chat-panel{transition:none !important;}
}

/* ==========================================================================
   THE LEAD LADDER — "Four O'Clock on the Fairway" (guide.html), the window
   list (the ballpark) and the free-measure close.
   Built from the site's own tokens only: paper / white / ink / almond /
   pewter / wine. No new colour enters the palette here.
   ========================================================================== */

/* ---------- Guide hero: the boxed editorial frame, on its own ---------- */
.guide-hero{
  padding:150px 0 0;
  background:
    radial-gradient(circle at 82% 12%, rgba(109,31,44,.06), transparent 46%),
    repeating-linear-gradient(115deg, rgba(36,32,25,.035) 0 1px, transparent 1px 34px),
    var(--paper);
}
.guide-hero-box{
  background:var(--white);
  border:1px solid var(--line);
  box-shadow:var(--shadow-lg);
  display:grid;grid-template-columns:6.5fr 5.5fr;align-items:stretch;
}
@media (max-width:900px){.guide-hero-box{grid-template-columns:1fr;}}
.guide-hero-copy{padding:52px 48px 46px;}
@media (max-width:720px){.guide-hero-copy{padding:38px 26px 34px;}}
.guide-hero-copy h1{font-size:clamp(2.1rem,4.2vw,3.25rem);max-width:15ch;}
.guide-lead{margin-top:22px;color:var(--ink-soft);font-size:1.08rem;line-height:1.65;max-width:46ch;}
.guide-meta{
  margin-top:26px;display:flex;flex-wrap:wrap;gap:10px 22px;
  font-size:.76rem;letter-spacing:.13em;text-transform:uppercase;color:var(--pewter-dark);font-weight:600;
}
.guide-meta span{display:inline-flex;align-items:center;gap:8px;}
.guide-meta span::before{content:"";width:5px;height:5px;background:var(--wine);border-radius:50%;flex:none;}
.guide-hero-photo{position:relative;overflow:hidden;min-height:300px;}
.guide-hero-photo img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;}
.guide-hero-photo .ed-caption{background:linear-gradient(180deg,transparent,rgba(20,16,10,.78));}
.guide-hero-strip{
  margin-top:-1px;background:var(--ink);
  border:1px solid var(--ink);padding:20px 30px;
  display:flex;flex-wrap:wrap;gap:10px 34px;font-size:.88rem;
}
.guide-hero-strip li{display:flex;gap:10px;align-items:flex-start;color:rgba(248,242,228,.82);}
.guide-hero-strip svg{width:16px;height:16px;flex:none;margin-top:4px;color:var(--almond);}

/* ---------- Guide prose ---------- */
.guide-body{background:var(--white);}
.guide-body.alt{background:var(--paper);}
.guide-narrow{max-width:780px;margin:0 auto;}
.guide-prose p{color:var(--ink-soft);font-size:1.03rem;margin-bottom:18px;max-width:68ch;}
.guide-prose h3{font-size:1.34rem;margin:34px 0 12px;}
.guide-prose strong{color:var(--ink);}
.pull{
  border-left:3px solid var(--wine);background:var(--almond-pale);
  padding:22px 26px;margin:30px 0;font-family:var(--ff-display);
  font-size:1.26rem;line-height:1.38;color:var(--ink);
}

/* ---------- The sun table (sits on the dark band) ---------- */
.sun-table{width:100%;border-collapse:collapse;margin:26px 0 8px;font-size:.95rem;}
.sun-table caption{
  text-align:left;font-size:.74rem;letter-spacing:.2em;text-transform:uppercase;
  color:var(--wine-light);font-weight:600;padding-bottom:12px;
}
.sun-table th,.sun-table td{
  text-align:left;padding:13px 14px 13px 0;border-bottom:1px solid rgba(248,242,228,.18);
  vertical-align:top;
}
.sun-table thead th{
  font-family:var(--ff-body);font-size:.72rem;letter-spacing:.16em;text-transform:uppercase;
  color:var(--almond);font-weight:600;
}
.sun-table tbody th{font-family:var(--ff-display);font-size:1.08rem;font-weight:600;color:var(--white);}
.sun-table td{color:rgba(248,242,228,.78);}
@media (max-width:640px){
  .sun-table,.sun-table tbody,.sun-table tr,.sun-table td,.sun-table th{display:block;}
  .sun-table thead{display:none;}
  .sun-table tbody tr{padding:14px 0;border-bottom:1px solid rgba(248,242,228,.18);}
  .sun-table th,.sun-table td{border:none;padding:2px 0;}
  .sun-table td::before{content:attr(data-lbl) " — ";color:var(--almond);font-weight:600;}
}

/* ---------- Elevation cards ---------- */
.elev-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:1px;background:var(--line);border:1px solid var(--line);}
@media (max-width:760px){.elev-grid{grid-template-columns:1fr;}}
.elev{background:var(--white);padding:34px 30px;}
.elev-tag{
  font-size:.7rem;letter-spacing:.22em;text-transform:uppercase;color:var(--wine);font-weight:600;
  display:block;margin-bottom:10px;
}
.elev h3{font-size:1.28rem;margin-bottom:10px;}
.elev p{color:var(--ink-soft);font-size:.96rem;margin-bottom:12px;}
.elev p:last-child{margin-bottom:0;}
.elev .verdict{
  margin-top:14px;padding-top:14px;border-top:1px solid var(--line);
  font-size:.92rem;color:var(--ink-soft);
}
.elev .verdict strong{color:var(--wine);}

/* ---------- Recommendation cards (with the add-to-list button) ---------- */
.rec-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:28px;}
@media (max-width:820px){.rec-grid{grid-template-columns:1fr;}}
.rec{
  background:var(--white);border:1px solid var(--line);
  display:flex;flex-direction:column;box-shadow:var(--shadow-md);
}
.rec--wide{grid-column:1 / -1;display:grid;grid-template-columns:.9fr 1.1fr;}
@media (max-width:820px){.rec--wide{grid-template-columns:1fr;}}
.rec-photo{position:relative;overflow:hidden;aspect-ratio:16/10;background:var(--pewter-light);}
.rec--wide .rec-photo{aspect-ratio:auto;min-height:290px;}
@media (max-width:820px){.rec--wide .rec-photo{aspect-ratio:16/10;min-height:0;}}
.rec-photo img{width:100%;height:100%;object-fit:cover;display:block;}
.rec-body{padding:30px 28px 28px;display:flex;flex-direction:column;gap:12px;flex:1;}
.rec-body h3{font-size:1.3rem;}
.rec-body p{color:var(--ink-soft);font-size:.96rem;}
.rec-where{
  font-size:.7rem;letter-spacing:.2em;text-transform:uppercase;color:var(--wine);font-weight:600;
}
.rec-catch{
  background:var(--almond-pale);border-left:3px solid var(--pewter);
  padding:14px 16px;font-size:.9rem;color:var(--ink-soft);
}
.rec-catch strong{color:var(--ink);}
.rec-btns{display:flex;flex-wrap:wrap;gap:10px;margin-top:auto;padding-top:6px;}
.rec-add{
  border:1px solid var(--wine);background:transparent;color:var(--wine);
  padding:11px 20px;border-radius:1px;font-size:.82rem;font-weight:600;letter-spacing:.03em;
  transition:background .25s var(--ease),color .25s var(--ease),border-color .25s var(--ease);
}
.rec-add:hover{background:var(--wine);color:var(--white);}
.rec-add.is-added{background:var(--almond);border-color:var(--almond);color:var(--ink);cursor:default;}
.rec-add[disabled]{opacity:1;}

/* ---------- Numbered "what we'd still check on site" list ---------- */
.check-ol{counter-reset:chk;display:grid;gap:22px;max-width:780px;margin:0;padding:0;}
.check-ol li{
  counter-increment:chk;display:grid;grid-template-columns:54px 1fr;gap:20px;align-items:start;
  padding-bottom:22px;border-bottom:1px solid var(--line);
}
.check-ol li:last-child{border-bottom:none;padding-bottom:0;}
.check-ol li::before{
  content:counter(chk,decimal-leading-zero);
  font-family:var(--ff-display);font-size:1.5rem;color:var(--wine);line-height:1;padding-top:4px;
}
.check-ol h3{font-size:1.16rem;margin-bottom:7px;}
.check-ol p{color:var(--ink-soft);font-size:.96rem;}

/* ---------- The two ways forward ---------- */
.ways{display:grid;grid-template-columns:1.25fr 1fr;gap:26px;align-items:stretch;}
@media (max-width:820px){.ways{grid-template-columns:1fr;}}
.way{padding:36px 34px;display:flex;flex-direction:column;gap:14px;}
.way-main{background:var(--ink);}
.way-main h3{color:var(--white);font-size:clamp(1.5rem,2.4vw,2rem);}
.way-main p{color:rgba(248,242,228,.8);font-size:1rem;}
.way-main .btn{margin-top:auto;align-self:flex-start;background:var(--almond);color:var(--wine-deep);border-color:var(--almond);}
.way-main .btn:hover{background:var(--white);color:var(--wine-deep);}
.way-alt{background:var(--white);border:1px solid var(--line-strong);}
.way-alt h3{font-size:1.3rem;}
.way-alt p{color:var(--ink-soft);font-size:.95rem;}
.way-alt .btn{margin-top:auto;align-self:flex-start;}
.way-tag{font-size:.68rem;letter-spacing:.22em;text-transform:uppercase;font-weight:600;}
.way-main .way-tag{color:var(--almond);}
.way-alt .way-tag{color:var(--pewter-dark);}
.capacity-note{margin-top:6px;font-size:.88rem;color:var(--ink-soft);max-width:56ch;}
.way-main .capacity-note{color:rgba(248,242,228,.62);}

/* ---------- Ladder forms ---------- */
.lead-form{background:var(--almond-pale);border:1px solid var(--line);padding:38px;}
@media (max-width:620px){.lead-form{padding:26px 22px;}}
.f-grid{display:grid;grid-template-columns:1fr 1fr;gap:0 20px;}
@media (max-width:620px){.f-grid{grid-template-columns:1fr;}}
.lead-form legend{
  display:block;font-size:.82rem;font-weight:600;letter-spacing:.02em;margin-bottom:8px;color:var(--ink);
}
.lead-form legend .opt{font-weight:400;color:var(--ink-soft);letter-spacing:0;}
.chk-set{border:none;padding:0;margin:0 0 20px;}
.chk-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:10px 20px;margin-top:4px;}
@media (max-width:620px){.chk-grid{grid-template-columns:1fr;}}
.chk{display:flex;gap:10px;align-items:flex-start;font-size:.92rem;color:var(--ink-soft);cursor:pointer;}
.chk input{width:17px;height:17px;flex:none;margin-top:3px;accent-color:var(--wine);}
.chk span{line-height:1.45;}
.carry-note{
  margin-top:10px;font-size:.85rem;color:var(--ink-soft);
  border-left:2px solid var(--wine-light);padding-left:12px;
}
.carry-note strong{color:var(--ink);}
.lead-thanks{
  background:var(--white);border:1px solid var(--line-strong);border-left:3px solid var(--wine);
  padding:28px 30px;
}
.lead-thanks h3{font-size:1.35rem;margin-bottom:12px;}
.lead-thanks p{color:var(--ink-soft);font-size:.98rem;}
.lead-thanks p + p{margin-top:12px;}
.lead-thanks a{color:var(--wine);font-weight:600;text-decoration:underline;text-underline-offset:3px;}

/* ---------- Rung 2: the window list ---------- */
.ballpark{border:1px solid var(--line-strong);background:var(--white);margin:6px 0 22px;}
.ballpark > summary{
  list-style:none;cursor:pointer;padding:16px 18px;display:flex;align-items:center;justify-content:space-between;
  gap:16px;font-size:.92rem;font-weight:600;color:var(--ink);
}
.ballpark > summary::-webkit-details-marker{display:none;}
.ballpark > summary:hover{color:var(--wine);}
.ballpark .ind{width:20px;height:20px;flex:none;position:relative;}
.ballpark .ind::before,.ballpark .ind::after{
  content:"";position:absolute;background:var(--wine);top:50%;left:50%;transition:transform .3s var(--ease);
}
.ballpark .ind::before{width:14px;height:2px;transform:translate(-50%,-50%);}
.ballpark .ind::after{width:2px;height:14px;transform:translate(-50%,-50%);}
.ballpark[open] .ind::after{transform:translate(-50%,-50%) rotate(90deg);opacity:0;}
.bp-inner{padding:0 18px 20px;}
.bp-note{font-size:.86rem;line-height:1.6;color:var(--ink-soft);margin-bottom:16px;max-width:70ch;}
.bp-scroll{overflow-x:auto;}
.bp-table{width:100%;border-collapse:collapse;min-width:660px;}
.bp-table th{
  text-align:left;font-size:.68rem;letter-spacing:.14em;text-transform:uppercase;color:var(--pewter-dark);
  font-weight:600;padding:0 8px 8px 0;
}
.bp-table td{padding:7px 8px 7px 0;vertical-align:top;}
.bp-table input,.bp-table select{
  width:100%;padding:9px 11px;border:1px solid var(--line-strong);border-radius:1px;
  background:var(--white);color:var(--ink);font-size:.9rem;
}
.bp-table input:focus,.bp-table select:focus{border-color:var(--wine);outline:none;box-shadow:0 0 0 3px rgba(109,31,44,.12);}
.bp-rm{width:38px;}
.bp-remove{
  width:30px;height:30px;line-height:1;border:1px solid var(--line-strong);background:var(--white);
  color:var(--pewter-dark);border-radius:1px;font-size:1.1rem;
  transition:border-color .2s var(--ease),color .2s var(--ease);
}
.bp-remove:hover{border-color:var(--wine);color:var(--wine);}
.bp-actions{display:flex;flex-wrap:wrap;align-items:center;gap:12px;margin-top:16px;}
.bp-actions .btn{padding:11px 20px;font-size:.82rem;}
.bp-count{font-size:.84rem;color:var(--ink-soft);}
.bp-print-head{display:none;}

@media (max-width:640px){
  .bp-table{min-width:0;}
  .bp-table thead{display:none;}
  .bp-table tbody{display:block;}
  .bp-row{
    display:block;position:relative;border:1px solid var(--line-strong);
    padding:16px 16px 8px;margin-bottom:14px;background:var(--white);
  }
  .bp-table td{display:block;padding:0 0 10px;}
  .bp-table td[data-lbl]::before{
    content:attr(data-lbl);display:block;font-size:.68rem;letter-spacing:.14em;
    text-transform:uppercase;color:var(--pewter-dark);font-weight:600;margin-bottom:5px;
  }
  .bp-rm{width:auto;position:absolute;top:8px;right:8px;padding:0;}
  .bp-rm::before{display:none;}
}

/* ---------- Sources ---------- */
.sources-list{display:grid;gap:13px;max-width:840px;}
.sources-list li{font-size:.92rem;color:var(--ink-soft);line-height:1.6;padding-left:18px;position:relative;}
.sources-list li::before{content:"";position:absolute;left:0;top:11px;width:8px;height:1px;background:var(--wine);}
.sources-list a{color:var(--wine);text-decoration:underline;text-underline-offset:3px;word-break:break-word;}
.sources-list a:hover{color:var(--wine-deep);}

/* ---------- Guide promo (homepage + area pages) ---------- */
.guide-promo{
  display:grid;grid-template-columns:5fr 7fr;background:var(--white);
  border:1px solid var(--line);box-shadow:var(--shadow-md);
}
@media (max-width:820px){.guide-promo{grid-template-columns:1fr;}}
.guide-promo-photo{position:relative;overflow:hidden;min-height:260px;}
.guide-promo-photo img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;}
.guide-promo-body{padding:44px 42px;display:flex;flex-direction:column;justify-content:center;gap:14px;}
@media (max-width:620px){.guide-promo-body{padding:32px 24px;}}
.guide-promo-body h2,
.guide-promo-body h3{font-size:clamp(1.45rem,2.2vw,1.9rem);}
.guide-promo-body p{color:var(--ink-soft);font-size:1rem;max-width:54ch;}
.guide-promo-body .btn{align-self:flex-start;margin-top:8px;}
.guide-promo-list{display:grid;gap:8px;margin-top:2px;}
.guide-promo-list li{font-size:.93rem;color:var(--ink-soft);display:flex;gap:10px;align-items:flex-start;}
.guide-promo-list svg{width:16px;height:16px;flex:none;margin-top:4px;color:var(--wine);}

/* ---------- Print: the window list on paper ----------
   The list sits in a different section on each page (#close on the guide,
   #enquire on the homepage), so js/ladder.js tags whichever section holds it
   with .bp-print-host and the rules below work from that, not from an id. */
@media print{
  body.bp-printing .nav,
  body.bp-printing footer,
  body.bp-printing .chat-widget,
  body.bp-printing .marquee-band,
  body.bp-printing section{display:none !important;}
  body.bp-printing section.bp-print-host{display:block !important;padding:0 !important;}
  body.bp-printing .bp-print-host .section-head,
  body.bp-printing .bp-print-host .enquiry-side,
  body.bp-printing .bp-print-host .f-grid,
  body.bp-printing .bp-print-host .form-row,
  body.bp-printing .bp-print-host .field,
  body.bp-printing .bp-print-host .chk-set,
  body.bp-printing .bp-print-host .popia-note,
  body.bp-printing .bp-print-host .carry-note,
  body.bp-printing .bp-print-host .capacity-note,
  body.bp-printing .bp-print-host .form-success,
  body.bp-printing .bp-print-host button,
  body.bp-printing .bp-print-host .bp-note,
  body.bp-printing .bp-print-host .bp-actions,
  body.bp-printing .ballpark > summary{display:none !important;}
  body.bp-printing{background:#fff;}
  body.bp-printing .ballpark{border:none;background:#fff;margin:0;}
  body.bp-printing .bp-inner{padding:0;}
  body.bp-printing .bp-print-head{display:block;margin-bottom:18px;}
  body.bp-printing .bp-print-head h2{font-size:1.4rem;margin-bottom:8px;}
  body.bp-printing .bp-print-head p{font-size:.86rem;max-width:none;}
  body.bp-printing .bp-scroll{overflow:visible;}
  body.bp-printing .bp-table{min-width:0;}
  body.bp-printing .bp-table input,
  body.bp-printing .bp-table select{border:none;border-bottom:1px solid #999;border-radius:0;}
  body.bp-printing .bp-rm{display:none;}
  body.bp-printing .lead-form,
  body.bp-printing .form-card{border:none;padding:0;background:#fff;}
  body.bp-printing .bp-count{display:none;}
  body.bp-printing .enquiry-grid,
  body.bp-printing .guide-narrow{display:block;max-width:none;}
}

/* ---------- Hero: the quiet third link under the two CTAs ---------- */
.hero-secondary-link{margin:18px 0 0;font-size:.9rem;}
.hero-secondary-link a{
  color:var(--ink-soft);border-bottom:1px solid var(--line-strong);padding-bottom:2px;
  display:inline-flex;align-items:center;gap:8px;
  transition:color .25s var(--ease),border-color .25s var(--ease);
}
.hero-secondary-link a:hover{color:var(--wine);border-color:var(--wine);}
.hero-secondary-link svg{width:14px;height:14px;transition:transform .25s var(--ease);}
.hero-secondary-link a:hover svg{transform:translateX(4px);}
@media (prefers-reduced-motion: reduce){
  .hero-secondary-link a,.hero-secondary-link svg{transition:none;}
  .hero-secondary-link a:hover svg{transform:none;}
}

/* The homepage success panel is reused by the ladder's thank-you copy, which
   arrives as an <h3> + paragraphs rather than the original <strong>. */
.form-success h3{
  font-family:var(--ff-display);font-size:1.3rem;font-weight:600;color:var(--ink);
  margin:0 0 10px;line-height:1.15;
}
.form-success p{color:var(--ink-soft);font-size:.96rem;margin:0;}
.form-success p + p{margin-top:12px;}
.form-success a{color:var(--wine);font-weight:600;text-decoration:underline;text-underline-offset:3px;}

/* ---------- Fact list on the dark "light here" band ---------- */
.fact-list{display:grid;gap:14px;margin:4px 0 18px;max-width:60ch;}
.fact-list li{
  position:relative;padding-left:20px;font-size:.98rem;line-height:1.6;
  color:rgba(248,242,228,.78);
}
.fact-list li::before{
  content:"";position:absolute;left:0;top:12px;width:10px;height:1px;background:var(--wine-light);
}
.fact-list strong{color:var(--almond);font-weight:600;}

/* The guide hero's contents strip is a set of jump links, not plain text */
.guide-hero-strip a{
  color:rgba(248,242,228,.86);border-bottom:1px solid transparent;padding-bottom:2px;
  transition:color .25s var(--ease),border-color .25s var(--ease);
}
.guide-hero-strip a:hover{color:var(--almond);border-color:var(--almond);}
.guide-hero-strip a:focus-visible{outline:2px solid var(--almond);outline-offset:3px;}

/* Section anchors on the guide clear the fixed nav even when the target is a
   section that only gains its id at build time. */
[id]{scroll-margin-top:96px;}
