/* =========================================================
   Serengeti Blinds — stylesheet
   theme: golf-estate | palette: iron grey + candlelight cream + fern
   fonts: Spectral (display) + Rubik (body/UI)
   ========================================================= */

:root{
  --ink:#262b22;
  --iron:#565d53;
  --iron-soft:#8b9184;
  --cream:#f7f0de;
  --cream-deep:#efe4c8;
  --paper:#fcfaf2;
  --fern:#4c6b41;
  --fern-deep:#33472c;
  --fern-light:#7e9b6e;
  --line:rgba(38,43,34,0.14);
  --line-strong:rgba(38,43,34,0.24);
  --shadow:0 24px 48px -24px rgba(38,43,34,0.35);
  --shadow-soft:0 12px 28px -18px rgba(38,43,34,0.28);
  --radius-lg:28px;
  --radius-md:16px;
  --radius-sm:10px;
  --maxw:1240px;
  --font-display:'Spectral',Georgia,serif;
  --font-body:'Rubik',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
}

*,*::before,*::after{box-sizing:border-box;}
html{scroll-behavior:smooth;}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto;}
}
body{
  margin:0;
  background:var(--cream);
  color:var(--ink);
  font-family:var(--font-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{margin:0;padding:0;list-style:none;}
h1,h2,h3,h4{font-family:var(--font-display);margin:0;color:var(--ink);font-weight:600;letter-spacing:-0.015em;line-height:1.08;}
p{margin:0;}
button{font-family:inherit;cursor:pointer;}
input,select,textarea{font-family:inherit;font-size:16px;}
:focus-visible{outline:2px solid var(--fern);outline-offset:3px;}

.container{max-width:var(--maxw);margin:0 auto;padding:0 32px;}
.section{padding:104px 0;}
.section--tight{padding:72px 0;}
.section--deep{background:var(--cream-deep);}
.section--dark{background:var(--ink);color:var(--cream);}
.section--dark h2,.section--dark h3{color:var(--cream);}

.eyebrow{
  font-family:var(--font-body);
  text-transform:uppercase;
  letter-spacing:0.24em;
  font-size:12.5px;
  font-weight:600;
  color:var(--fern);
  display:inline-flex;
  align-items:center;
  gap:10px;
}
.eyebrow::before{
  content:"";
  width:26px;height:1px;background:var(--fern);
  display:inline-block;
}
.section--dark .eyebrow{color:var(--fern-light);}
.section--dark .eyebrow::before{background:var(--fern-light);}

.section-head{max-width:680px;margin-bottom:52px;}
.section-head h2{font-size:clamp(2rem,1.4rem + 2.4vw,3rem);margin-top:14px;}
.section-head p{margin-top:16px;color:var(--iron);font-size:17px;max-width:60ch;}
.section--dark .section-head p{color:#cdd3c4;}

.rule{
  width:64px;height:2px;background:var(--fern);
  transform:scaleX(0);transform-origin:left;
  margin:20px 0;
}
.rule.in-view{transform:scaleX(1);transition:transform .9s cubic-bezier(.22,1,.36,1);}

/* ---------- reveal-on-scroll base (JS toggles .in-view) ---------- */
.reveal{opacity:0;transform:translateY(28px);transition:opacity .8s ease,transform .8s cubic-bezier(.22,1,.36,1);}
.reveal.in-view{opacity:1;transform:translateY(0);}
@media (prefers-reduced-motion:reduce){
  .reveal{opacity:1;transform:none;transition:none;}
}

/* ================= NAV ================= */
.site-nav{
  position:fixed;top:0;left:0;right:0;z-index:500;
  padding:22px 0;
  transition:background .35s ease,padding .35s ease,box-shadow .35s ease,border-color .35s ease;
  border-bottom:1px solid transparent;
}
.site-nav.is-solid{
  background:rgba(247,240,222,0.94);
  backdrop-filter:blur(10px);
  padding:14px 0;
  border-bottom:1px solid var(--line);
  box-shadow:var(--shadow-soft);
}
.nav-row{display:flex;align-items:center;justify-content:space-between;gap:24px;}
.brand{display:flex;align-items:center;gap:12px;font-family:var(--font-display);font-size:20px;font-weight:600;color:var(--ink);}
.brand svg{width:34px;height:34px;flex-shrink:0;}
.nav-links{display:flex;align-items:center;gap:34px;}
.nav-links a{
  font-size:14.5px;font-weight:500;color:var(--ink);
  position:relative;padding:4px 0;
}
.nav-links a::after{
  content:"";position:absolute;left:0;right:0;bottom:0;height:1px;background:var(--fern);
  transform:scaleX(0);transform-origin:left;transition:transform .25s ease;
}
.nav-links a:hover::after{transform:scaleX(1);}
.nav-cta{
  display:inline-flex;align-items:center;gap:8px;
  background:var(--ink);color:var(--cream);
  padding:11px 22px;border-radius:999px;
  font-size:14px;font-weight:600;
  transition:background .25s ease,transform .25s ease;
}
.nav-cta:hover{background:var(--fern-deep);transform:translateY(-1px);}
.nav-toggle{display:none;background:none;border:none;padding:6px;}
.nav-toggle span{display:block;width:24px;height:2px;background:var(--ink);margin:5px 0;transition:transform .25s ease,opacity .25s ease;}
.nav-toggle.is-open span:nth-child(1){transform:translateY(7px) rotate(45deg);}
.nav-toggle.is-open span:nth-child(2){opacity:0;}
.nav-toggle.is-open span:nth-child(3){transform:translateY(-7px) rotate(-45deg);}

/* ================= BUTTONS ================= */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:10px;
  padding:15px 30px;border-radius:999px;
  font-size:14.5px;font-weight:600;letter-spacing:0.01em;
  transition:transform .25s cubic-bezier(.22,1,.36,1),background .25s ease,color .25s ease,border-color .25s ease;
  border:1px solid transparent;
  will-change:transform;
}
.btn-primary{background:var(--fern);color:var(--paper);}
.btn-primary:hover{background:var(--fern-deep);}
.btn-outline{border-color:var(--ink);color:var(--ink);}
.btn-outline:hover{background:var(--ink);color:var(--cream);}
.section--dark .btn-outline{border-color:var(--cream);color:var(--cream);}
.section--dark .btn-outline:hover{background:var(--cream);color:var(--ink);}
.btn-block{width:100%;}

/* ================= HERO ================= */
.hero{padding:150px 0 80px;position:relative;overflow:visible;}
.hero-inner{display:grid;grid-template-columns:minmax(0,0.86fr) minmax(0,1.14fr);gap:56px;align-items:center;}
.hero-title{font-size:clamp(2.5rem,1.6rem + 3.4vw,4.4rem);margin-top:18px;}
.hero-title .word{display:inline-block;opacity:1;}
.hero-sub{margin-top:22px;font-size:18px;line-height:1.65;color:var(--iron);max-width:46ch;}
.hero-ctas{display:flex;flex-wrap:wrap;gap:16px;margin-top:34px;}
.trust-row{margin-top:38px;display:flex;flex-direction:column;gap:12px;}
.trust-row li{display:flex;align-items:center;gap:11px;font-size:14.5px;color:var(--iron);font-weight:500;}
.trust-row svg{width:19px;height:19px;flex-shrink:0;color:var(--fern);}

.hero-frame{position:relative;}
.hero-viewport{
  position:relative;border-radius:var(--radius-lg);overflow:hidden;
  box-shadow:var(--shadow);
  aspect-ratio:4/5;
  background:var(--ink);
  border:1px solid rgba(255,255,255,0.08);
}
.hero-viewport img{width:100%;height:100%;object-fit:cover;position:absolute;inset:0;transform:scale(1.06);}
.hero-scrim{position:absolute;inset:0;background:linear-gradient(190deg,rgba(38,43,34,0.05) 20%,rgba(38,43,34,0.55) 92%);}
.hero-slats{position:absolute;inset:0;display:flex;z-index:3;}
.hero-slats span{
  flex:1;background:var(--ink);
  transform-origin:left center;
  border-right:1px solid rgba(247,240,222,0.06);
  transform:scaleX(0); /* photo visible by default; JS re-arms to 1 before the opening sweep */
}
@media (prefers-reduced-motion:reduce){
  .hero-slats{display:none;}
}
.hero-chip{
  position:absolute;background:var(--paper);color:var(--ink);
  padding:11px 18px;border-radius:999px;
  font-size:13px;font-weight:600;
  box-shadow:var(--shadow-soft);
  display:flex;align-items:center;gap:8px;
  z-index:4;
}
.hero-chip::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--fern);flex-shrink:0;}
.hero-chip-1{top:9%;left:-7%;}
.hero-chip-2{bottom:12%;right:-8%;}
@media (max-width:1080px){
  .hero-chip-1{left:4%;}
  .hero-chip-2{right:4%;}
}

.hero-guide-link{display:inline-flex;align-items:center;gap:8px;margin-top:22px;font-size:14px;font-weight:600;color:var(--fern-deep);}
.hero-guide-link em{font-style:italic;}
.hero-guide-link svg{width:20px;height:14px;transition:transform .2s ease;}
.hero-guide-link:hover svg{transform:translateX(4px);}
.hero-guide-link:hover{color:var(--fern);}

/* ================= GUIDE TEASER (homepage) ================= */
.guide-teaser-grid{display:grid;grid-template-columns:1.02fr 1fr;gap:56px;align-items:center;}
.guide-teaser-figure{margin:0;border-radius:var(--radius-lg);overflow:hidden;box-shadow:var(--shadow);aspect-ratio:16/10;}
.guide-teaser-figure img{width:100%;height:100%;object-fit:cover;}
.guide-teaser-points{margin-top:22px;display:flex;flex-direction:column;gap:11px;}
.guide-teaser-points li{position:relative;padding-left:24px;font-size:14.5px;color:var(--iron);line-height:1.55;}
.guide-teaser-points li::before{content:"";position:absolute;left:0;top:11px;width:13px;height:1px;background:var(--fern);}
.guide-teaser-points em{font-style:italic;color:var(--ink);}

/* ================= MARQUEE ================= */
.marquee{background:var(--ink);color:var(--cream);overflow:hidden;padding:18px 0;border-top:1px solid rgba(247,240,222,0.12);border-bottom:1px solid rgba(247,240,222,0.12);}
.marquee-track{display:flex;width:max-content;animation:marquee 38s linear infinite;}
.marquee-track span{
  font-family:var(--font-display);font-style:italic;font-weight:500;
  font-size:17px;padding:0 28px;white-space:nowrap;color:var(--cream);
  opacity:0.88;
}
.marquee-track span.dot{color:var(--fern-light);opacity:1;font-style:normal;}
@keyframes marquee{from{transform:translateX(0);}to{transform:translateX(-50%);}}
@media (prefers-reduced-motion:reduce){
  .marquee-track{animation:none;overflow-x:auto;}
}

/* ================= PRODUCT GRID ================= */
.product-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--line);border:1px solid var(--line);border-radius:var(--radius-md);overflow:hidden;}
.product-card{background:var(--paper);padding:34px 28px;display:flex;flex-direction:column;gap:14px;transition:background .3s ease;}
.product-card:hover{background:var(--cream);}
.pthumb{width:100%!important;height:auto!important;max-width:none!important;
  aspect-ratio:4/3;overflow:hidden;display:block;margin:0 0 4px;
  border-radius:var(--radius-sm);background:rgba(38,43,34,.04);}
.pthumb img{width:100%;height:100%;object-fit:cover;display:block;
  transition:transform .7s cubic-bezier(.2,.7,.2,1);}
.product-card:hover .pthumb img{transform:scale(1.045);}
@media (prefers-reduced-motion:reduce){
  .pthumb img{transition:none;}
  .product-card:hover .pthumb img{transform:none;}
}
.product-card svg{width:44px;height:44px;color:var(--fern);stroke-width:1.5;}
.product-card h3{font-size:18px;font-weight:600;}
.product-card p{color:var(--iron);font-size:14.5px;line-height:1.6;flex-grow:1;}
.product-link{display:inline-flex;align-items:center;gap:6px;font-size:13.5px;font-weight:600;color:var(--fern);}
.product-link svg{width:14px;height:14px;color:var(--fern);transition:transform .25s ease;}
.product-card:hover .product-link svg{transform:translateX(4px);}

/* ================= EDITORIAL GALLERY ================= */
.gallery{display:grid;grid-template-columns:1.3fr 1fr;gap:20px;}
.gallery-col{display:grid;gap:20px;}
.gallery-item{position:relative;border-radius:var(--radius-md);overflow:hidden;box-shadow:var(--shadow-soft);}
.gallery-item img{width:100%;height:100%;object-fit:cover;}
.gallery-item.tall img{aspect-ratio:4/5;}
.gallery-item.wide img{aspect-ratio:16/11;}
.gallery-caption{
  position:absolute;left:0;right:0;bottom:0;padding:22px 24px;
  background:linear-gradient(0deg,rgba(38,43,34,0.82),rgba(38,43,34,0));
  color:var(--cream);
}
.gallery-caption p{font-family:var(--font-display);font-size:19px;font-style:italic;}

/* ================= LOCALE ================= */
.locale-grid{display:grid;grid-template-columns:1.1fr 0.9fr;gap:64px;align-items:start;}
.locale-copy p{margin-bottom:18px;color:var(--iron);max-width:58ch;}
.locale-copy p:last-child{margin-bottom:0;}
.specifier-note{
  background:var(--paper);border:1px solid var(--line);border-radius:var(--radius-md);
  padding:30px 30px;box-shadow:var(--shadow-soft);
}
.specifier-note .eyebrow{margin-bottom:12px;}
.specifier-note ul{display:flex;flex-direction:column;gap:14px;margin-top:8px;}
.specifier-note li{display:flex;gap:12px;font-size:14.5px;color:var(--iron);line-height:1.55;}
.specifier-note li svg{width:18px;height:18px;color:var(--fern);flex-shrink:0;margin-top:2px;}

/* ================= PROCESS ================= */
.process-list{display:grid;grid-template-columns:repeat(4,1fr);gap:32px;counter-reset:step;}
.process-step{position:relative;padding-top:8px;border-top:1px solid var(--line-strong);}
.process-step .num{
  font-family:var(--font-display);font-size:15px;font-weight:600;color:var(--fern);
  display:block;margin-bottom:18px;
}
.process-step h3{font-size:19px;margin-bottom:10px;}
.process-step p{color:var(--iron);font-size:14.5px;}

/* ================= AREA CHIPS ================= */
.area-chip-row{display:flex;flex-wrap:wrap;gap:14px;}
.area-chip{
  display:inline-flex;align-items:center;gap:10px;
  padding:14px 24px;border-radius:999px;
  border:1px solid var(--line-strong);
  background:var(--paper);
  font-size:14.5px;font-weight:600;
  transition:border-color .25s ease,background .25s ease,transform .25s ease;
}
.area-chip svg{width:16px;height:16px;color:var(--fern);}
.area-chip:hover{border-color:var(--fern);background:var(--cream-deep);transform:translateY(-2px);}

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

/* ================= CLOSING CTA ================= */
.cta-closing{position:relative;overflow:hidden;text-align:center;}
.cta-glow{
  position:absolute;inset:-20%;
  background:radial-gradient(closest-side,rgba(76,107,65,0.42),transparent 70%);
  filter:blur(40px);
  animation:drift 16s ease-in-out infinite;
}
@keyframes drift{
  0%,100%{transform:translate(-6%,-4%) scale(1);}
  50%{transform:translate(6%,6%) scale(1.15);}
}
@media (prefers-reduced-motion:reduce){.cta-glow{animation:none;}}
.cta-closing .container{position:relative;z-index:2;}
.cta-closing h2{font-size:clamp(2rem,1.4rem + 2.6vw,3.2rem);max-width:16ch;margin:16px auto 0;}
.cta-closing p{margin:20px auto 34px;color:var(--iron);max-width:52ch;}
.cta-closing .eyebrow{justify-content:center;}
.cta-closing .btn-row{display:flex;gap:16px;justify-content:center;flex-wrap:wrap;}

/* ================= FORM ================= */
.form-wrap{display:grid;grid-template-columns:0.9fr 1.1fr;gap:60px;align-items:start;}
.form-card{
  background:var(--paper);border:1px solid var(--line);border-radius:var(--radius-lg);
  padding:44px;box-shadow:var(--shadow-soft);
}
.field{margin-bottom:20px;}
.field label{display:block;font-size:13px;font-weight:600;text-transform:uppercase;letter-spacing:0.08em;color:var(--iron);margin-bottom:8px;}
.field input,.field select,.field textarea{
  width:100%;padding:13px 16px;border-radius:var(--radius-sm);
  border:1px solid var(--line-strong);background:var(--cream);color:var(--ink);
  transition:border-color .25s ease,background .25s ease;
}
.field input:focus,.field select:focus,.field textarea:focus{border-color:var(--fern);background:var(--paper);outline:none;}
.field textarea{resize:vertical;min-height:110px;}
.field-row{display:grid;grid-template-columns:1fr 1fr;gap:18px;}
.form-note{font-size:13px;color:var(--iron-soft);margin-top:16px;line-height:1.6;}
.field.field-error input,.field.field-error select{
  border-color:var(--ink);
  box-shadow:0 0 0 3px rgba(38,43,34,0.12);
}
.form-error-note{color:var(--ink);font-weight:500;margin:0 0 16px;}
.form-success{display:none;text-align:center;padding:40px 10px;}
.form-success.is-visible{display:block;}
.form-success svg{width:44px;height:44px;color:var(--fern);margin:0 auto 16px;}

/* ================= FOOTER ================= */
.site-footer{background:var(--ink);color:var(--cream);padding:80px 0 32px;}
.footer-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:48px;padding-bottom:52px;border-bottom:1px solid rgba(247,240,222,0.14);}
.footer-brand{display:flex;align-items:center;gap:12px;font-family:var(--font-display);font-size:20px;font-weight:600;margin-bottom:16px;}
.footer-brand svg{width:32px;height:32px;}
.footer-col p{color:#cdd3c4;font-size:14.5px;max-width:32ch;}
.footer-col h4{font-family:var(--font-body);text-transform:uppercase;letter-spacing:0.14em;font-size:12.5px;color:var(--fern-light);margin-bottom:18px;}
.footer-col ul{display:flex;flex-direction:column;gap:11px;}
.footer-col a{font-size:14.5px;color:#e3e6da;transition:color .2s ease;}
.footer-col a:hover{color:var(--fern-light);}
.footer-bottom{display:flex;justify-content:space-between;flex-wrap:wrap;gap:14px;padding-top:28px;font-size:12.5px;color:#9aa192;}
.footer-bottom p{max-width:60ch;}

/* ================= CHAT WIDGET ================= */
.chat-launcher{
  position:fixed;bottom:26px;right:26px;z-index:900;
  width:60px;height:60px;border-radius:50%;
  background:var(--fern);color:var(--paper);
  display:flex;align-items:center;justify-content:center;
  box-shadow:0 14px 30px -10px rgba(38,43,34,0.5);
  border:none;
  transition:transform .25s cubic-bezier(.22,1,.36,1),background .25s ease;
}
.chat-launcher:hover{background:var(--fern-deep);transform:scale(1.06);}
.chat-launcher svg{width:26px;height:26px;}
.chat-launcher .chat-close-icon{display:none;}
.chat-launcher.is-open .chat-chat-icon{display:none;}
.chat-launcher.is-open .chat-close-icon{display:block;}

.chat-panel{
  position:fixed;bottom:98px;right:26px;z-index:900;
  width:min(360px,calc(100vw - 40px));
  max-height:min(560px,calc(100vh - 140px));
  background:var(--paper);border-radius:var(--radius-md);
  box-shadow:var(--shadow);
  display:flex;flex-direction:column;overflow:hidden;
  opacity:0;transform:translateY(16px) scale(0.98);pointer-events:none;
  transition:opacity .25s ease,transform .25s ease;
  border:1px solid var(--line);
}
.chat-panel.is-open{opacity:1;transform:translateY(0) scale(1);pointer-events:auto;}
.chat-head{background:var(--ink);color:var(--cream);padding:18px 20px;display:flex;align-items:center;gap:12px;}
.chat-head svg{width:26px;height:26px;flex-shrink:0;}
.chat-head strong{display:block;font-family:var(--font-display);font-size:16px;}
.chat-head span{display:block;font-size:12px;color:var(--fern-light);}
.chat-body{flex:1;overflow-y:auto;padding:18px 20px;display:flex;flex-direction:column;gap:12px;background:var(--cream);}
.chat-msg{max-width:86%;padding:11px 15px;border-radius:14px;font-size:14px;line-height:1.55;}
.chat-msg.bot{background:var(--paper);border:1px solid var(--line);align-self:flex-start;border-bottom-left-radius:4px;}
.chat-msg.user{background:var(--fern);color:var(--paper);align-self:flex-end;border-bottom-right-radius:4px;}
.chat-popia{font-size:11.5px;color:var(--iron-soft);align-self:flex-start;max-width:92%;line-height:1.5;}
.chat-chips{display:flex;flex-wrap:wrap;gap:8px;padding:0 0 4px;}
.chat-chip{
  border:1px solid var(--line-strong);background:var(--paper);
  border-radius:999px;padding:9px 15px;font-size:13px;font-weight:500;
  transition:background .2s ease,border-color .2s ease;
}
.chat-chip:hover{background:var(--cream-deep);border-color:var(--fern);}
.chat-foot{border-top:1px solid var(--line);padding:12px 14px;display:flex;gap:8px;background:var(--paper);}
.chat-foot input{
  flex:1;border:1px solid var(--line-strong);border-radius:999px;
  padding:10px 16px;background:var(--cream);color:var(--ink);font-size:14px;
}
.chat-foot input:focus{outline:none;border-color:var(--fern);}
.chat-send{
  width:38px;height:38px;border-radius:50%;background:var(--fern);color:var(--paper);
  border:none;display:flex;align-items:center;justify-content:center;flex-shrink:0;
}
.chat-send svg{width:16px;height:16px;}

/* ================= INNER PAGE (product/area) HERO ================= */
.inner-hero{padding:150px 0 90px;position:relative;}
.inner-hero-media{
  margin-top:44px;border-radius:var(--radius-lg);overflow:hidden;position:relative;
  box-shadow:var(--shadow);aspect-ratio:21/9;
}
.inner-hero-media img{width:100%;height:100%;object-fit:cover;}
.inner-hero-media .hero-scrim{background:linear-gradient(0deg,rgba(38,43,34,0.55),rgba(38,43,34,0) 55%);}
.breadcrumb{display:flex;align-items:center;gap:8px;font-size:13px;color:var(--iron-soft);margin-bottom:20px;}
.breadcrumb a{color:var(--fern);font-weight:600;}
.inner-title{font-size:clamp(2.2rem,1.5rem + 2.6vw,3.6rem);margin-top:14px;max-width:16ch;}
.inner-sub{margin-top:20px;font-size:18px;color:var(--iron);max-width:60ch;}

.content-grid{display:grid;grid-template-columns:1.4fr 0.9fr;gap:56px;align-items:start;}
.content-copy p{margin-bottom:18px;color:var(--iron);max-width:64ch;}
.content-copy h3{font-size:22px;margin:36px 0 14px;}
.content-copy ul{display:flex;flex-direction:column;gap:12px;margin-bottom:22px;}
.content-copy ul li{display:flex;gap:12px;color:var(--iron);font-size:15.5px;line-height:1.6;}
.content-copy ul li svg{width:18px;height:18px;color:var(--fern);flex-shrink:0;margin-top:3px;}
.side-card{
  background:var(--paper);border:1px solid var(--line);border-radius:var(--radius-md);
  padding:32px;box-shadow:var(--shadow-soft);position:sticky;top:120px;
}
.side-card h4{font-family:var(--font-display);font-size:19px;margin-bottom:14px;}
.side-card p{color:var(--iron);font-size:14.5px;margin-bottom:20px;}
.side-list{display:flex;flex-direction:column;gap:12px;margin-bottom:24px;}
.side-list a{
  display:flex;align-items:center;justify-content:space-between;
  padding:12px 16px;border:1px solid var(--line);border-radius:var(--radius-sm);
  font-size:14px;font-weight:600;transition:border-color .2s ease,background .2s ease;
}
.side-list a:hover{border-color:var(--fern);background:var(--cream-deep);}

.pill-row{display:flex;flex-wrap:wrap;gap:10px;margin-top:20px;}
.pill{
  padding:8px 16px;border-radius:999px;background:var(--cream-deep);
  font-size:13px;font-weight:600;color:var(--fern-deep);
}

/* ================= RESPONSIVE ================= */
@media (max-width:1080px){
  .hero-inner{grid-template-columns:1fr;}
  .hero-frame{order:-1;}
  .form-wrap{grid-template-columns:1fr;}
  .locale-grid{grid-template-columns:1fr;}
  .guide-teaser-grid{grid-template-columns:1fr;}
  .content-grid{grid-template-columns:1fr;}
  .side-card{position:static;}
  .footer-grid{grid-template-columns:1fr 1fr;}
  .product-grid{grid-template-columns:repeat(3,1fr);}
  .process-list{grid-template-columns:repeat(2,1fr);}
}
@media (max-width:760px){
  .container{padding:0 22px;}
  .section{padding:76px 0;}
  .nav-links{
    position:fixed;top:0;right:0;height:100vh;width:min(78vw,320px);
    background:var(--paper);flex-direction:column;align-items:flex-start;
    padding:110px 32px 32px;gap:26px;
    transform:translateX(100%);transition:transform .35s cubic-bezier(.22,1,.36,1);
    box-shadow:var(--shadow);
  }
  .nav-links.is-open{transform:translateX(0);}
  .nav-toggle{display:block;}
  .nav-links .nav-cta{margin-top:8px;}
  .gallery{grid-template-columns:1fr;}
  .product-grid{grid-template-columns:repeat(2,1fr);}
  .process-list{grid-template-columns:1fr;}
  .footer-grid{grid-template-columns:1fr;}
  .field-row{grid-template-columns:1fr;}
  .hero{padding:126px 0 60px;}
  .hero-viewport{aspect-ratio:4/4.6;}
  .hero-chip{font-size:12px;padding:9px 14px;}
  .hero-chip-1{left:2%;top:6%;}
  .hero-chip-2{right:2%;}
  .chat-panel{right:16px;bottom:90px;}
  .chat-launcher{right:16px;bottom:18px;}
}
@media (max-width:480px){
  .product-grid{grid-template-columns:1fr 1fr;}
}


/* 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}

/* =========================================================
   GUIDE (Rung 1) — "The Whistling Thorn Light Book"
   ========================================================= */
.guide-meta{display:flex;flex-wrap:wrap;gap:10px 18px;margin-top:26px;}
.guide-meta span{font-size:13px;color:var(--iron);display:inline-flex;align-items:center;gap:8px;}
.guide-meta span::before{content:"";width:5px;height:5px;border-radius:50%;background:var(--fern);flex-shrink:0;}
.guide-ctas{display:flex;flex-wrap:wrap;gap:16px;margin-top:32px;}

.guide-toc{background:var(--cream-deep);border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:18px 0;}
.guide-toc .container{display:flex;flex-wrap:wrap;align-items:center;gap:10px 12px;}
.guide-toc .lbl{font-size:11.5px;font-weight:700;text-transform:uppercase;letter-spacing:0.2em;color:var(--iron-soft);margin-right:4px;}
.guide-toc a{font-size:13.5px;font-weight:500;color:var(--ink);padding:8px 16px;border:1px solid var(--line-strong);border-radius:999px;background:var(--paper);transition:border-color .2s ease,background .2s ease,color .2s ease;}
.guide-toc a:hover{border-color:var(--fern);background:var(--cream);color:var(--fern-deep);}

.guide-prose{max-width:66ch;}
.guide-prose p{color:var(--iron);margin-bottom:18px;}
.guide-prose p:last-child{margin-bottom:0;}
.guide-prose strong{color:var(--ink);font-weight:600;}
.guide-prose h3{font-size:21px;margin:34px 0 12px;}
.guide-prose ul{display:flex;flex-direction:column;gap:10px;margin-top:16px;}
.guide-prose ul li{position:relative;padding-left:22px;color:var(--iron);font-size:15.5px;line-height:1.6;}
.guide-prose ul li::before{content:"";position:absolute;left:0;top:11px;width:12px;height:1px;background:var(--fern);}
.guide-prose sup{font-size:0.68em;color:var(--fern-deep);font-weight:700;}

.photo-band{position:relative;background:var(--ink);}
.photo-band .pb-frame{position:relative;height:clamp(280px,44vw,520px);overflow:hidden;}
.photo-band img{width:100%;height:100%;object-fit:cover;display:block;}
.photo-band figcaption{position:absolute;left:0;right:0;bottom:0;padding:26px clamp(22px,4vw,64px);background:linear-gradient(0deg,rgba(38,43,34,0.88),rgba(38,43,34,0) 78%);color:var(--cream);}
.photo-band figcaption b{display:block;font-family:var(--font-display);font-size:19px;font-style:italic;font-weight:500;margin-bottom:6px;}
.photo-band figcaption span{display:block;max-width:64ch;color:#dfe3d6;font-size:14.5px;line-height:1.55;}

.elev-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:18px;margin-top:40px;}
.elev-card{background:var(--paper);border:1px solid var(--line);border-radius:var(--radius-md);padding:28px 28px 26px;box-shadow:var(--shadow-soft);}
.elev-head{display:flex;align-items:center;gap:12px;margin-bottom:14px;}
.elev-head svg{width:28px;height:28px;flex-shrink:0;color:var(--fern);}
.elev-head b{font-family:var(--font-display);font-size:18px;font-weight:600;}
.elev-card p{font-size:14.5px;color:var(--iron);margin-bottom:10px;}
.elev-card p:last-of-type{margin-bottom:0;}
.elev-verdict{margin-top:14px;padding-top:14px;border-top:1px solid var(--line);font-size:13.5px;color:var(--iron);}
.elev-verdict em{font-family:var(--font-display);font-style:italic;color:var(--fern-deep);}

.rec-list{display:flex;flex-direction:column;gap:16px;margin-top:40px;}
.rec{background:var(--paper);border:1px solid var(--line);border-radius:var(--radius-md);padding:30px 32px;display:grid;grid-template-columns:1fr 190px;gap:8px 28px;box-shadow:var(--shadow-soft);}
.rec-head{grid-column:1/-1;display:flex;align-items:baseline;gap:14px;flex-wrap:wrap;}
.rec-head h3{font-size:19px;}
.rec-head .where{font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:0.1em;color:var(--fern);}
.rec-body{grid-column:1;}
.rec-body p{font-size:15px;color:var(--iron);margin-bottom:12px;}
.rec-body p:last-of-type{margin-bottom:0;}
.rec-trade{margin-top:16px;background:var(--cream-deep);border-radius:var(--radius-sm);padding:14px 18px;}
.rec-trade b{display:block;font-size:11.5px;font-weight:700;text-transform:uppercase;letter-spacing:0.1em;color:var(--fern-deep);margin-bottom:6px;}
.rec-trade p{font-size:13.5px;margin:0;color:var(--iron);}
.rec-side{grid-column:2;grid-row:2;display:flex;align-items:flex-start;}
.rec-add{width:100%;display:inline-flex;align-items:center;justify-content:center;gap:8px;border:1px solid var(--line-strong);background:var(--cream);color:var(--ink);border-radius:999px;padding:11px 16px;font-size:13px;font-weight:600;transition:background .2s ease,border-color .2s ease,color .2s ease;cursor:pointer;}
.rec-add::before{content:"+";font-size:16px;line-height:1;}
.rec-add:hover{background:var(--fern);color:var(--paper);border-color:var(--fern);}
.rec-add.is-added{border-color:var(--line);color:var(--iron-soft);background:var(--cream-deep);cursor:default;}
.rec-add.is-added::before{content:"\2713";font-size:13px;}
.rec-add[disabled]{opacity:1;}
.rec-more{margin-top:28px;}

.check-list{display:grid;grid-template-columns:repeat(2,1fr);gap:22px 40px;margin-top:40px;}
.check-item{border-top:1px solid var(--line-strong);padding-top:16px;}
.check-item h4{font-size:16.5px;margin-bottom:8px;}
.check-item p{font-size:14px;color:var(--iron);}

.ladder-grid{display:grid;grid-template-columns:0.86fr 1.14fr;gap:52px;align-items:start;}
.ladder-side p{color:var(--iron);margin-top:14px;font-size:15px;}
.promise{margin-top:24px;display:flex;flex-direction:column;gap:13px;}
.promise-item{display:flex;gap:11px;align-items:flex-start;font-size:14.5px;color:var(--iron);font-weight:500;}
.promise-item svg{width:18px;height:18px;flex-shrink:0;margin-top:2px;color:var(--fern);}
.capacity-note{margin-top:22px;background:var(--cream-deep);border-radius:var(--radius-sm);padding:14px 18px;font-size:13.5px;color:var(--fern-deep);font-weight:500;line-height:1.6;}

.legend{display:block;font-size:12px;font-weight:600;letter-spacing:0.08em;text-transform:uppercase;color:var(--iron);margin-bottom:12px;}
.interest-grid{display:grid;grid-template-columns:1fr 1fr;gap:4px 18px;}
.interest-grid label{display:flex;align-items:flex-start;gap:10px;padding:7px 0;font-size:14px;color:var(--iron);cursor:pointer;}
.interest-grid input{width:16px;height:16px;flex-shrink:0;margin-top:3px;accent-color:var(--fern);}
.interest-grid input:checked + span{color:var(--ink);font-weight:600;}

.ballpark{margin-top:24px;border:1px dashed var(--line-strong);border-radius:var(--radius-md);background:var(--cream);}
.ballpark > summary{list-style:none;cursor:pointer;display:flex;align-items:center;justify-content:space-between;gap:16px;padding:18px 20px;font-size:14.5px;font-weight:600;color:var(--ink);}
.ballpark > summary::-webkit-details-marker{display:none;}
.ballpark > summary:hover{color:var(--fern-deep);}
.ballpark > summary .chev{width:15px;height:15px;flex-shrink:0;color:var(--fern);transition:transform .3s ease;}
.ballpark[open] > summary .chev{transform:rotate(180deg);}
.bp-inner{padding:0 20px 22px;}
.bp-pairing{font-size:13.5px;color:var(--iron);max-width:64ch;margin-bottom:18px;line-height:1.6;}
.bp-pairing strong{color:var(--ink);}
.bp-scroll{overflow-x:auto;}
.bp-table{width:100%;border-collapse:collapse;font-size:13px;}
.bp-table th{text-align:left;padding:0 8px 8px 0;font-size:11px;text-transform:uppercase;letter-spacing:0.08em;color:var(--iron-soft);border-bottom:1px solid var(--line-strong);}
.bp-table td{padding:7px 8px 7px 0;vertical-align:middle;}
.bp-table input,.bp-table select{width:100%;padding:8px 10px;border:1px solid var(--line-strong);border-radius:8px;background:var(--paper);color:var(--ink);font-size:13px;}
.bp-table input:focus,.bp-table select:focus{border-color:var(--fern);outline:none;}
.bp-table td.bp-rm{width:32px;padding-right:0;}
.bp-remove{width:26px;height:26px;border-radius:50%;border:1px solid var(--line-strong);background:var(--paper);color:var(--iron);font-size:15px;line-height:1;cursor:pointer;transition:border-color .2s ease,color .2s ease;}
.bp-remove:hover{border-color:var(--fern);color:var(--fern-deep);}
.bp-actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:16px;}
.bp-btn{display:inline-flex;align-items:center;gap:8px;border:1px solid var(--line-strong);background:var(--paper);color:var(--ink);border-radius:999px;padding:9px 16px;font-size:12.5px;font-weight:600;cursor:pointer;transition:border-color .2s ease,color .2s ease;}
.bp-btn:hover{border-color:var(--fern);color:var(--fern-deep);}
.bp-btn svg{width:14px;height:14px;}
.bp-count{font-size:12.5px;color:var(--iron);margin-top:13px;}
.bp-foot{font-size:12px;color:var(--iron-soft);margin-top:12px;line-height:1.6;max-width:70ch;}
.bp-print-head{display:none;}
.bp-holder{display:none;}

.sources{margin-top:34px;border-top:1px solid var(--line-strong);padding-top:28px;}
.sources ol{list-style:decimal;padding-left:22px;color:var(--iron);font-size:13.5px;max-width:92ch;display:flex;flex-direction:column;gap:11px;}
.sources a{color:var(--fern-deep);text-decoration:underline;text-underline-offset:2px;}
.sources a:hover{color:var(--fern);}
.sources .note{margin-top:18px;font-size:12.5px;color:var(--iron-soft);line-height:1.6;max-width:90ch;}

.form-success h3{font-size:22px;margin-bottom:8px;}
.form-success p{color:var(--iron);font-size:14.5px;line-height:1.6;}
.form-success p+p{margin-top:10px;}
.form-success a{color:var(--fern-deep);text-decoration:underline;text-underline-offset:2px;font-weight:600;}

@media (max-width:1080px){
  .elev-grid,.check-list{grid-template-columns:1fr;}
  .ladder-grid{grid-template-columns:1fr;gap:36px;}
}
@media (max-width:760px){
  .rec{grid-template-columns:1fr;padding:24px 22px;}
  .rec-side{grid-column:1;grid-row:auto;}
  .interest-grid{grid-template-columns:1fr;}
  .guide-toc{padding:14px 0;}
}
@media (max-width:640px){
  /* window rows become stacked cards */
  .bp-scroll{overflow-x:visible;}
  .bp-table,.bp-table tbody,.bp-table tr,.bp-table td{display:block;width:100%;}
  .bp-table thead{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;}
  .bp-table tr.bp-row{position:relative;background:var(--paper);border:1px solid var(--line);border-radius:var(--radius-sm);padding:14px 14px 6px;margin-bottom:12px;}
  .bp-table td{padding:0 0 10px;}
  .bp-table td[data-lbl]::before{content:attr(data-lbl);display:block;font-size:10.5px;letter-spacing:0.12em;text-transform:uppercase;font-weight:600;color:var(--iron-soft);margin-bottom:5px;}
  .bp-table td.bp-rm{position:absolute;top:10px;right:10px;width:auto;padding:0;}
  .bp-table td.bp-rm::before{content:none;}
  .bp-inner{padding:0 14px 18px;}
  .ballpark > summary{padding:15px 14px;}
}

/* ---------- Print: walk the house with paper ---------- */
@media print{
  body{background:#fff;color:#000;}
  .site-nav,.marquee,.cta-closing,.site-footer,.chat-launcher,.chat-panel,.guide-toc,
  .photo-band,.guide-ctas,.bp-actions,.bp-remove,.ballpark > summary,.bp-pairing,
  .form-note,[data-lead-capture]{display:none !important;}
  .ballpark{border:0;background:#fff;margin:0;}
  .bp-inner{padding:0;}
  .bp-print-head{display:block;margin-bottom:18px;}
  .bp-print-head h2{font-size:1.5rem;margin-bottom:6px;}
  .bp-print-head p{font-size:0.86rem;color:#444;}
  .bp-table input,.bp-table select{border:1px solid #999;background:#fff;}
  .bp-table th{border-bottom:1px solid #666;}
  .form-card{border:0;padding:0;background:#fff;box-shadow:none;}
  body.bp-printing .section{padding:0 !important;}
  body.bp-printing .guide-prose,body.bp-printing .rec-list,body.bp-printing .elev-grid,
  body.bp-printing .check-list,body.bp-printing .sources,body.bp-printing .section-head,
  body.bp-printing .ladder-side,body.bp-printing .field-row,body.bp-printing .interest-grid,
  body.bp-printing .field:not(.bp-holder),body.bp-printing .form-success,
  body.bp-printing .rec-more,body.bp-printing form > button{display:none !important;}
  body.bp-printing .ladder-grid{display:block !important;}
}
@media (prefers-reduced-motion:reduce){
  .rec,.elev-card,.check-item,.form-card{opacity:1 !important;transform:none !important;}
}
