/* Blair Atholl Blinds — stylesheet
   Theme: golf-estate · palette: ink charcoal + bone white + brass
   Fonts: Gelasio (display) + Red Hat Text (body/UI) */

:root{
  --ink:#1c1a17;
  --ink-2:#2a2620;
  --ink-soft:#524c43;
  --bone:#f8f4ea;
  --bone-dim:#efe7d6;
  --bone-2:#e7dcc3;
  --brass:#a9803f;
  --brass-light:#cba05e;
  --brass-dark:#6d593b;
  --line:rgba(28,26,23,.14);
  --line-dark:rgba(248,244,234,.18);
  --shadow:0 24px 60px -30px rgba(20,17,10,.45);
  --radius:2px;
  --font-display:"Gelasio", "Iowan Old Style", Georgia, serif;
  --font-body:"Red Hat Text", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --ease:cubic-bezier(.22,.68,.18,1);
  --section-pad:clamp(64px,8vw,104px);
}

*,*::before,*::after{box-sizing:border-box;}
html{scroll-behavior:smooth;}
@media (prefers-reduced-motion: reduce){html{scroll-behavior:auto;}}

body{
  margin:0;
  font-family:var(--font-body);
  color:var(--ink);
  background:var(--bone);
  font-size:17px;
  line-height:1.7;
  -webkit-font-smoothing:antialiased;
}

img{max-width:100%;display:block;object-fit:cover;}
a{color:inherit;text-decoration:none;}
ul{list-style:none;margin:0;padding:0;}
h1,h2,h3,h4{font-family:var(--font-display);font-weight:600;line-height:1.08;letter-spacing:-.015em;margin:0;color:var(--ink);}
p{margin:0;}
button{font-family:inherit;cursor:pointer;background:none;border:none;color:inherit;}
input,select,textarea{font-family:inherit;font-size:1rem;}
:focus-visible{outline:2px solid var(--brass);outline-offset:3px;}

.container{max-width:1240px;margin:0 auto;padding:0 28px;}
.skip-link{position:absolute;left:-999px;top:0;background:var(--ink);color:var(--bone);padding:12px 20px;z-index:999;}
.skip-link:focus{left:12px;top:12px;}

.eyebrow{
  display:inline-block;
  font-family:var(--font-body);
  font-size:.72rem;
  font-weight:700;
  letter-spacing:.24em;
  text-transform:uppercase;
  color:var(--brass-dark);
}
.eyebrow.on-dark{color:var(--brass-light);}

.rule{width:64px;height:2px;background:var(--brass);margin-top:22px;transform:scaleX(0);transform-origin:left;transition:transform .8s var(--ease);}
.rule.in-view{transform:scaleX(1);}

.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:8px;
  padding:15px 28px;font-size:.92rem;font-weight:600;letter-spacing:.02em;
  border-radius:var(--radius);transition:transform .25s var(--ease),background .25s,color .25s,border-color .25s;
  white-space:nowrap;
}
.btn-primary{background:var(--ink);color:var(--bone);border:1px solid var(--ink);}
.btn-primary:hover{background:var(--brass-dark);border-color:var(--brass-dark);}
.btn-outline{background:transparent;color:var(--ink);border:1px solid var(--ink);}
.btn-outline:hover{background:var(--ink);color:var(--bone);}
.btn-outline.on-dark{color:var(--bone);border-color:rgba(248,244,234,.55);}
.btn-outline.on-dark:hover{background:var(--bone);color:var(--ink);}
.btn-block{width:100%;}
.magnetic{will-change:transform;}

/* ============ NAV ============ */
.site-nav{
  position:fixed;top:0;left:0;right:0;z-index:200;
  padding:20px 0;
  transition:background .35s var(--ease),padding .35s var(--ease),box-shadow .35s var(--ease),border-color .35s;
  border-bottom:1px solid transparent;
}
.site-nav .container{display:flex;align-items:center;justify-content:space-between;gap:24px;}
.site-nav.is-scrolled{background:rgba(248,244,234,.96);backdrop-filter:blur(10px);padding:12px 0;border-color:var(--line);box-shadow:0 8px 30px -20px rgba(20,17,10,.35);}
.brand{display:flex;align-items:center;gap:12px;color:var(--bone);}
.site-nav.is-scrolled .brand{color:var(--ink);}
.brand-mark{width:38px;height:30px;flex:0 0 auto;}
.brand-mark .m-line{stroke:currentColor;}
.brand-mark .m-brass{stroke:var(--brass-light);}
.site-nav.is-scrolled .brand-mark .m-brass{stroke:var(--brass);}
.brand-word{font-family:var(--font-display);font-size:1.18rem;font-weight:600;letter-spacing:-.01em;display:flex;flex-direction:column;line-height:1.15;}
.brand-word small{font-family:var(--font-body);font-size:.6rem;font-weight:600;letter-spacing:.18em;text-transform:uppercase;opacity:.72;}
.nav-links{display:flex;align-items:center;gap:30px;font-size:.88rem;font-weight:600;color:var(--bone);}
.site-nav.is-scrolled .nav-links{color:var(--ink);}
.nav-links a{position:relative;padding:4px 0;}
.nav-links a::after{content:"";position:absolute;left:0;bottom:0;width:100%;height:1px;background:var(--brass);transform:scaleX(0);transform-origin:right;transition:transform .25s var(--ease);}
.nav-links a:hover::after{transform:scaleX(1);transform-origin:left;}
.nav-cta{display:flex;align-items:center;gap:14px;}
.nav-cta .btn{color:var(--bone);border-color:rgba(248,244,234,.6);}
.site-nav.is-scrolled .nav-cta .btn-outline{color:var(--ink);border-color:var(--ink);}
.nav-toggle{display:none;width:36px;height:36px;align-items:center;justify-content:center;color:var(--bone);transition:color .3s var(--ease),transform .25s var(--ease);}
.nav-toggle:hover{transform:scale(1.08);}
.site-nav.is-scrolled .nav-toggle{color:var(--ink);}
/* open mobile menu forces the solid nav treatment, whatever the scroll position */
.site-nav.menu-open{background:rgba(248,244,234,.97);backdrop-filter:blur(10px);border-color:var(--line);}
.site-nav.menu-open .brand,.site-nav.menu-open .nav-toggle{color:var(--ink);}
.site-nav.menu-open .brand-mark .m-brass{stroke:var(--brass);}
.site-nav.menu-open .nav-cta .btn-outline{color:var(--ink);border-color:var(--ink);}

/* ============ HERO ============ */
.hero{position:relative;background:var(--ink);overflow:hidden;}
.hero-photo-wrap{position:relative;height:88vh;min-height:620px;overflow:hidden;}
.hero-photo{width:100%;height:100%;object-fit:cover;transform:scale(1.06);will-change:transform;}
.hero-scrim{position:absolute;inset:0;background:linear-gradient(180deg,rgba(18,16,13,.42) 0%,rgba(18,16,13,.10) 34%,rgba(18,16,13,.40) 66%,rgba(18,16,13,.90) 100%);}

/* signature moment: the Louvre Reveal — a bank of slats tilted over the hero photo
   that opens as you arrive and lifts away as you scroll. The resting state below is
   ALREADY open, so the photograph stays clearly visible with no JS at all. */
.hero-louvre{position:absolute;inset:0;display:flex;flex-direction:column;pointer-events:none;z-index:3;}
.hero-louvre .slat{
  flex:1;
  background:linear-gradient(180deg,rgba(18,16,13,.60) 0%,rgba(18,16,13,.30) 62%,rgba(18,16,13,0) 100%);
  border-top:1px solid rgba(203,160,94,.38);
  transform:scaleY(.26);
  transform-origin:top center;
  will-change:transform,opacity;
}

.hero-eyebrow-wrap{position:absolute;top:120px;left:0;right:0;z-index:4;}
.hero-chips{position:absolute;top:120px;right:28px;z-index:4;display:flex;flex-direction:column;gap:10px;max-width:220px;}
.hero-chip{background:rgba(28,26,23,.55);backdrop-filter:blur(6px);border:1px solid rgba(248,244,234,.25);color:var(--bone);font-size:.76rem;font-weight:600;padding:9px 14px;border-radius:20px;}

.hero-headline-wrap{position:relative;z-index:4;margin-top:-160px;padding:0 28px 0;}
.hero-headline-inner{max-width:1240px;margin:0 auto;}
.hero-headline{
  font-size:clamp(2.6rem,6vw,5rem);
  color:var(--bone);
  max-width:18ch;
  text-shadow:0 2px 30px rgba(18,16,13,.5);
}
.hero-headline .word{display:inline-block;overflow:hidden;}
.hero-headline .word span{display:inline-block;transform:translateY(115%);}
.hero-panel{
  background:var(--bone);
  margin-top:34px;
  padding:38px 28px 44px;
}
.hero-panel-inner{max-width:1240px;margin:0 auto;display:grid;grid-template-columns:1.1fr .9fr;gap:48px;align-items:end;}
.hero-sub{font-size:1.06rem;color:var(--ink-soft);max-width:46ch;line-height:1.65;}
.hero-ctas{display:flex;gap:16px;margin-top:26px;flex-wrap:wrap;}
.trust-row{display:flex;flex-wrap:wrap;gap:22px 34px;justify-self:end;}
.trust-row li{display:flex;align-items:center;gap:9px;font-size:.86rem;font-weight:600;color:var(--ink-soft);max-width:220px;}
.trust-row svg{flex:0 0 auto;width:18px;height:18px;color:var(--brass);}

/* ============ MARQUEE ============ */
.marquee-band{background:var(--ink);border-top:1px solid var(--line-dark);border-bottom:1px solid var(--line-dark);overflow:hidden;padding:16px 0;}
.marquee-track{display:flex;gap:56px;white-space:nowrap;width:max-content;animation:marquee 32s linear infinite;}
@media (prefers-reduced-motion: reduce){.marquee-track{animation:none;}}
.marquee-track span{font-family:var(--font-display);font-style:italic;font-size:1.05rem;color:var(--bone-2);}
.marquee-track span::after{content:"—";margin-left:56px;color:var(--brass);}
@keyframes marquee{from{transform:translateX(0);}to{transform:translateX(-50%);}}

/* ============ SECTION SCAFFOLDING ============ */
section{padding:var(--section-pad) 0;}
.section-head{max-width:640px;margin-bottom:56px;}
.section-head h2{font-size:clamp(2rem,3vw,2.9rem);margin-top:14px;}
.section-head p{margin-top:18px;color:var(--ink-soft);font-size:1.02rem;max-width:56ch;}
.section-head.center{margin-left:auto;margin-right:auto;text-align:center;}
.section-head.center .rule{margin-left:auto;margin-right:auto;}

.reveal{opacity:0;transform:translateY(34px);transition:opacity .8s var(--ease),transform .8s var(--ease);}
.reveal.in-view{opacity:1;transform:translateY(0);}
@media (prefers-reduced-motion: reduce){.reveal{opacity:1;transform:none;transition:none;}}

/* ============ PRODUCTS GRID ============ */
.products{background:var(--bone);}
.product-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--line);border:1px solid var(--line);}
.product-card{background:var(--bone);padding:34px 26px 30px;transition:background .3s var(--ease);display:flex;flex-direction:column;}
.product-card:hover{background:var(--bone-dim);}
.product-card .icon{width:52px;height:52px;color:var(--ink);margin-bottom:22px;}
.product-card .icon .accent{stroke:var(--brass);}
/* full-bleed photo at the head of the card, with a slow zoom on hover */
.pthumb{display:block;overflow:hidden;aspect-ratio:4/3;margin:-34px -26px 24px;background:var(--bone-2);}
.pthumb img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .75s var(--ease);}
.product-card:hover .pthumb img,.product-card:focus-within .pthumb img{transform:scale(1.07);}
.product-card h3{font-size:1.14rem;margin-bottom:9px;}
.product-card p{font-size:.9rem;color:var(--ink-soft);line-height:1.55;}
.product-card .card-link{display:inline-flex;align-items:center;gap:6px;margin-top:auto;padding-top:16px;font-size:.82rem;font-weight:700;color:var(--brass-dark);letter-spacing:.02em;}
/* closes the grid where the last row runs short, and earns its place as a CTA */
.product-cta{
  background:var(--ink);color:var(--bone);padding:40px 34px;
  display:flex;flex-direction:column;justify-content:center;
  grid-column:span 3;
}
.product-cta h3{color:var(--bone);font-size:clamp(1.3rem,1.8vw,1.7rem);max-width:22ch;}
.product-cta p{color:var(--bone-2);font-size:.96rem;margin-top:14px;max-width:52ch;}
.product-cta .card-link{color:var(--brass-light);margin-top:22px;padding-top:0;}
.product-cta .card-link svg{width:14px;height:14px;transition:transform .25s var(--ease);}
.product-cta:hover .card-link svg{transform:translateX(4px);}
.product-card .card-link svg{width:14px;height:14px;transition:transform .25s var(--ease);}
.product-card:hover .card-link svg{transform:translateX(4px);}

/* ============ EDITORIAL ============ */
.editorial{background:var(--bone-dim);}
.editorial-grid{display:grid;grid-template-columns:1.15fr .85fr;gap:22px;align-items:start;}
.editorial-figure{position:relative;overflow:hidden;}
.editorial-figure img{width:100%;height:100%;}
.editorial-figure figcaption{position:absolute;left:0;right:0;bottom:0;padding:18px 22px;background:linear-gradient(0deg,rgba(18,16,13,.82),transparent);color:var(--bone);font-size:.82rem;font-weight:600;letter-spacing:.02em;}
.editorial-main{height:560px;}
.editorial-side{display:flex;flex-direction:column;gap:22px;}
.editorial-side .editorial-figure{height:269px;}
.editorial-copy{grid-column:1 / -1;margin-top:34px;max-width:66ch;}
.editorial-copy h3{font-size:1.5rem;margin-bottom:14px;}
.editorial-copy p{color:var(--ink-soft);font-size:1.02rem;}

/* ============ LOCALE ============ */
.locale{background:var(--ink);color:var(--bone);position:relative;}
.locale-grid{display:grid;grid-template-columns:.9fr 1.1fr;gap:60px;}
.locale h2{color:var(--bone);}
.locale .section-head p{color:var(--bone-2);}
.locale-facts{display:grid;gap:28px;}
.locale-fact{border-top:1px solid var(--line-dark);padding-top:20px;}
.locale-fact h4{font-family:var(--font-display);font-weight:600;font-size:1.12rem;color:var(--brass-light);margin-bottom:8px;}
.locale-fact p{color:var(--bone-2);font-size:.96rem;}

/* ============ PROCESS ============ */
.process{background:var(--bone);}
.process-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:34px;}
.process-step{position:relative;padding-top:34px;border-top:1px solid var(--line);}
.process-step .num{font-family:var(--font-display);font-size:2.6rem;color:var(--brass-light);position:absolute;top:-24px;left:0;-webkit-text-stroke:1px var(--brass);color:transparent;}
.process-step h3{font-size:1.12rem;margin:18px 0 10px;}
.process-step p{font-size:.92rem;color:var(--ink-soft);}

/* ============ AREAS ============ */
.areas{background:var(--bone-dim);}
.area-chip-row{display:flex;flex-wrap:wrap;gap:14px;}
.area-chip{
  display:flex;align-items:center;gap:10px;padding:16px 24px;background:var(--bone);border:1px solid var(--line);
  font-weight:600;font-size:.98rem;transition:border-color .25s,transform .25s var(--ease),background .25s;
}
.area-chip:hover{border-color:var(--brass);transform:translateY(-3px);background:var(--bone);}
.area-chip svg{width:16px;height:16px;color:var(--brass);}

/* ============ FAQ ============ */
.faq{background:var(--bone);}
.faq-list{max-width:820px;}
.faq-item{border-bottom:1px solid var(--line);}
.faq-item summary{
  list-style:none;cursor:pointer;display:flex;align-items:center;justify-content:space-between;gap:20px;
  padding:24px 4px;font-family:var(--font-display);font-size:1.14rem;font-weight:600;
}
.faq-item summary::-webkit-details-marker{display:none;}
.faq-toggle{position:relative;width:22px;height:22px;flex:0 0 auto;}
.faq-toggle::before,.faq-toggle::after{content:"";position:absolute;background:var(--brass);transition:transform .3s var(--ease);}
.faq-toggle::before{left:0;top:50%;width:100%;height:2px;transform:translateY(-50%);}
.faq-toggle::after{top:0;left:50%;width:2px;height:100%;transform:translateX(-50%);}
.faq-item[open] .faq-toggle::after{transform:translateX(-50%) rotate(90deg);opacity:0;}
.faq-answer{padding:0 4px 26px;color:var(--ink-soft);max-width:70ch;font-size:.98rem;}

/* ============ CTA ============ */
.cta{position:relative;background:var(--ink);color:var(--bone);overflow:hidden;}
.cta-glow{position:absolute;inset:-20%;background:
    radial-gradient(circle at 20% 30%,rgba(169,128,63,.35),transparent 55%),
    radial-gradient(circle at 80% 70%,rgba(203,160,94,.22),transparent 50%);
  animation:drift 18s ease-in-out infinite alternate;
}
@keyframes drift{from{transform:translate(-3%,-2%) scale(1);}to{transform:translate(3%,3%) scale(1.08);}}
@media (prefers-reduced-motion: reduce){.cta-glow{animation:none;}}
.cta-inner{position:relative;z-index:2;text-align:center;max-width:640px;margin:0 auto;}
.cta h2{color:var(--bone);font-size:clamp(2rem,4vw,3rem);}
.cta p{margin-top:16px;color:var(--bone-2);font-size:1.05rem;}
.cta .btn-group{margin-top:32px;display:flex;gap:16px;justify-content:center;flex-wrap:wrap;}

/* ============ ENQUIRE ============ */
.enquire{background:var(--bone-dim);}
.enquire-grid{display:grid;grid-template-columns:.9fr 1.1fr;gap:56px;align-items:start;}
.enquire-copy h2{font-size:clamp(1.9rem,3vw,2.6rem);}
.enquire-list{margin-top:28px;display:grid;gap:16px;}
.enquire-list li{display:flex;gap:12px;align-items:flex-start;font-size:.95rem;color:var(--ink-soft);}
.enquire-list svg{flex:0 0 auto;width:18px;height:18px;color:var(--brass);margin-top:2px;}
.form-card{background:var(--bone);padding:38px;border:1px solid var(--line);box-shadow:var(--shadow);}
.form-row{display:grid;grid-template-columns:1fr 1fr;gap:18px;}
.field{margin-bottom:18px;}
.field label{display:block;font-size:.82rem;font-weight:700;letter-spacing:.03em;margin-bottom:7px;color:var(--ink);}
.field input,.field select,.field textarea{
  width:100%;padding:13px 14px;border:1px solid var(--line);background:var(--bone);color:var(--ink);
  border-radius:var(--radius);transition:border-color .25s;
}
.field input:focus,.field select:focus,.field textarea:focus{border-color:var(--brass);outline:none;}
.field textarea{min-height:100px;resize:vertical;}
.popia-note{font-size:.82rem;color:var(--ink-soft);background:var(--bone-dim);border-left:2px solid var(--brass);padding:12px 16px;margin:6px 0 22px;}
.form-success{display:none;text-align:center;padding:40px 10px;}
.form-success.visible{display:block;}
.form-success strong{display:block;font-family:var(--font-display);font-size:1.3rem;margin-bottom:8px;}

/* ============ INNER PAGE HERO (product/area pages) ============ */
.page-hero{position:relative;background:var(--ink);color:var(--bone);overflow:hidden;}
.page-hero-photo-wrap{position:relative;height:56vh;min-height:400px;overflow:hidden;}
.page-hero-photo{width:100%;height:100%;object-fit:cover;transform:scale(1.05);}
/* the letterbox crop must keep the part of the photo that identifies the product —
   a roller's headrail, an awning's arms — not just a slice of the middle */
.page-hero-photo.pos-top{object-position:center top;}
/* light enough at the top that the product photograph actually reads, weighted
   heavily at the foot where the headline sits */
.page-hero-scrim{position:absolute;inset:0;background:linear-gradient(180deg,rgba(18,16,13,.34) 0%,rgba(18,16,13,.10) 30%,rgba(18,16,13,.56) 66%,rgba(18,16,13,.93) 100%);}
.page-hero-content{position:absolute;bottom:0;left:0;right:0;padding-bottom:52px;}
.page-hero h1{color:var(--bone);font-size:clamp(2.2rem,4.6vw,3.6rem);max-width:16ch;text-shadow:0 2px 26px rgba(18,16,13,.55);}
.page-hero .eyebrow{margin-bottom:14px;}
.page-hero p.lead{margin-top:16px;max-width:60ch;color:var(--bone-2);font-size:1.02rem;}
.breadcrumb{font-size:.8rem;color:var(--bone-2);margin-bottom:18px;}
.breadcrumb a{color:var(--brass-light);}
.breadcrumb a:hover{text-decoration:underline;}

.article{background:var(--bone);}
.article-grid{display:grid;grid-template-columns:1.4fr .9fr;gap:60px;}
.article-body h2{font-size:1.7rem;margin-top:44px;margin-bottom:16px;}
.article-body h2:first-child{margin-top:0;}
.article-body p{color:var(--ink-soft);margin-bottom:16px;font-size:1.02rem;}
.article-body ul{margin:16px 0 20px;display:grid;gap:10px;}
.article-body ul li{display:flex;gap:10px;color:var(--ink-soft);font-size:.98rem;}
.article-body ul li svg{flex:0 0 auto;width:17px;height:17px;color:var(--brass);margin-top:3px;}
.article-aside{position:sticky;top:110px;align-self:start;}
.aside-card{background:var(--bone-dim);border:1px solid var(--line);padding:28px;margin-bottom:22px;}
.aside-card h3{font-size:1.1rem;margin-bottom:12px;}
.aside-card p{color:var(--ink-soft);font-size:.92rem;margin-bottom:16px;}
.aside-list{display:grid;gap:10px;margin-bottom:0;}
.aside-list a{display:flex;justify-content:space-between;font-size:.9rem;font-weight:600;padding:8px 0;border-bottom:1px solid var(--line);}
.aside-list a:hover{color:var(--brass-dark);}

/* ============ FOOTER ============ */
footer{background:var(--ink);color:var(--bone-2);padding:72px 0 32px;}
.footer-top{display:grid;grid-template-columns:1.3fr 1fr 1fr 1fr;gap:40px;padding-bottom:42px;border-bottom:1px solid var(--line-dark);}
.footer-brand .brand{color:var(--bone);margin-bottom:14px;}
.footer-brand .brand-mark .m-brass{stroke:var(--brass-light);}
.footer-tag{font-size:.92rem;max-width:34ch;color:var(--bone-2);}
.footer-col h5{font-family:var(--font-body);font-size:.76rem;letter-spacing:.18em;text-transform:uppercase;color:var(--brass-light);margin-bottom:18px;}
.footer-col ul{display:grid;gap:11px;}
.footer-col a{font-size:.92rem;color:var(--bone-2);transition:color .2s;}
.footer-col a:hover{color:var(--bone);}
.footer-bottom{display:flex;justify-content:space-between;flex-wrap:wrap;gap:10px;padding-top:26px;font-size:.82rem;color:var(--bone-2);opacity:.85;}
.footer-popia{font-size:.78rem;color:var(--bone-2);opacity:.7;max-width:80ch;margin-top:18px;}
.legal-links a{color:var(--bone-2);}

/* ============ CHAT WIDGET ============ */
.chat-widget{position:fixed;right:22px;bottom:22px;z-index:400;}
.chat-toggle{
  width:60px;height:60px;border-radius:50%;background:var(--brass-dark);color:var(--bone);
  display:flex;align-items:center;justify-content:center;box-shadow:0 14px 34px -12px rgba(20,17,10,.55);
  transition:transform .25s var(--ease),background .25s;
}
.chat-toggle:hover{transform:scale(1.06);background:var(--brass);}
.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-toggle svg{width:24px;height:24px;}
.chat-panel{
  position:absolute;right:0;bottom:76px;width:min(360px,88vw);max-height:min(560px,72vh);
  background:var(--bone);border:1px solid var(--line);box-shadow:var(--shadow);
  display:flex;flex-direction:column;opacity:0;transform:translateY(16px) scale(.98);pointer-events:none;
  transition:opacity .25s var(--ease),transform .25s var(--ease);
}
.chat-widget.open .chat-panel{opacity:1;transform:translateY(0) scale(1);pointer-events:auto;}
.chat-header{display:flex;align-items:center;gap:12px;padding:16px 18px;background:var(--ink);color:var(--bone);}
.chat-header .brand-mark{width:26px;height:20px;}
.chat-header-text{display:flex;flex-direction:column;flex:1;}
.chat-header-text strong{font-family:var(--font-display);font-size:.98rem;}
.chat-header-text span{font-size:.72rem;color:var(--bone-2);}
.chat-header-close{color:var(--bone-2);}
.chat-header-close svg{width:16px;height:16px;}
.chat-body{padding:18px;overflow-y:auto;flex:1;display:flex;flex-direction:column;gap:12px;min-height:220px;}
.chat-msg{max-width:82%;padding:10px 14px;font-size:.88rem;line-height:1.5;border-radius:12px;}
.chat-msg.bot{background:var(--bone-dim);align-self:flex-start;border-bottom-left-radius:2px;}
.chat-msg.user{background:var(--ink);color:var(--bone);align-self:flex-end;border-bottom-right-radius:2px;}
.chat-msg.popia{background:transparent;border:1px dashed var(--line);font-size:.76rem;color:var(--ink-soft);align-self:stretch;max-width:100%;}
.chat-quick{display:flex;flex-wrap:wrap;gap:8px;padding:0 18px 16px;}
.chat-quick button{border:1px solid var(--brass);color:var(--brass-dark);padding:8px 13px;border-radius:20px;font-size:.8rem;font-weight:600;transition:background .2s,color .2s;}
.chat-quick button:hover{background:var(--brass);color:var(--bone);}
.chat-form{display:flex;gap:10px;padding:14px;border-top:1px solid var(--line);}
.chat-form.hidden{display:none;}
.chat-form input{flex:1;border:1px solid var(--line);padding:11px 14px;border-radius:20px;background:var(--bone);}
.chat-form button{width:38px;height:38px;border-radius:50%;background:var(--ink);color:var(--bone);display:flex;align-items:center;justify-content:center;flex:0 0 auto;}
.chat-form button svg{width:16px;height:16px;}

/* ============ RESPONSIVE ============ */
@media (max-width:1080px){
  .hero-panel-inner{grid-template-columns:1fr;gap:26px;}
  .trust-row{justify-self:start;}
  .locale-grid{grid-template-columns:1fr;gap:36px;}
  .editorial-grid{grid-template-columns:1fr;}
  .editorial-main{height:380px;}
  .editorial-side{flex-direction:row;}
  .editorial-side .editorial-figure{height:260px;flex:1;}
  .article-grid{grid-template-columns:1fr;}
  .article-aside{position:static;}
  .product-grid{grid-template-columns:repeat(2,1fr);}
  .product-cta{grid-column:span 1;padding:34px 26px;}
  .process-grid{grid-template-columns:repeat(2,1fr);gap:44px 34px;}
  .enquire-grid{grid-template-columns:1fr;}
}
@media (max-width:860px){
  .nav-links{display:none;}
  .nav-links.mobile-open{
    display:flex;flex-direction:column;align-items:flex-start;gap:20px;
    position:fixed;top:60px;left:0;right:0;
    background:var(--bone);color:var(--ink);
    padding:24px 28px 28px;border-bottom:1px solid var(--line);
    box-shadow:0 22px 44px -28px rgba(20,17,10,.55);
    font-size:1rem;
  }
  .nav-links.mobile-open a{width:100%;padding:6px 0;}
  .nav-toggle{display:flex;}
  .footer-top{grid-template-columns:1fr;gap:32px;}
}
@media (max-width:640px){
  .container{padding:0 20px;}
  .hero-photo-wrap{height:78vh;min-height:520px;}
  .hero-headline-wrap{margin-top:-120px;padding:0 20px;}
  .hero-chips{display:none;}
  .hero-panel{padding:30px 20px 34px;}
  .product-grid{grid-template-columns:1fr;}
  .process-grid{grid-template-columns:1fr;}
  .form-row{grid-template-columns:1fr;}
  .editorial-side{flex-direction:column;}
  :root{--section-pad:56px;}
}


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

/* ======================================================================
   THE LEAD LADDER — guide.html + homepage teaser + ballpark/measure form
   Palette stays ink / bone / brass throughout; only the background token
   changes between sections (paper / shell / ink / warm).
   ====================================================================== */

.container-mid{max-width:800px;margin:0 auto;padding:0 28px;}
.container-narrow{max-width:700px;margin:0 auto;padding:0 28px;}

.section-paper{background:var(--bone);}
.section-shell{background:var(--bone-dim);}
.section-warm{background:var(--bone-2);}
.section-ink{background:var(--ink);color:var(--bone);}
.section-ink h2,.section-ink h3{color:var(--bone);}
.section-ink .section-head p{color:var(--bone-2);}
.section-ink .eyebrow{color:var(--brass-light);}
.section-ink .rule{background:var(--brass-light);}
.section-head.left{max-width:720px;margin-left:0;margin-right:0;text-align:left;}

/* ---------------- breadcrumb / guide meta on the page-hero ---------------- */
.guide-lead{margin-top:18px;max-width:58ch;color:var(--bone-2);font-size:1.05rem;line-height:1.65;}
.guide-meta{display:flex;flex-wrap:wrap;gap:8px 26px;margin-top:22px;font-size:.8rem;font-weight:600;color:rgba(248,244,234,.78);}
.guide-meta span{display:inline-flex;align-items:center;gap:8px;}
.guide-meta span::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--brass-light);}
.page-hero .hero-ctas{margin-top:28px;display:flex;gap:14px;flex-wrap:wrap;}

/* ---------------- table of contents strip ---------------- */
.guide-toc{background:var(--ink-2);padding:18px 0;border-bottom:1px solid var(--line-dark);}
.guide-toc ol{display:flex;flex-wrap:wrap;gap:9px 8px;list-style:none;margin:0;padding:0;counter-reset:toc;}
.guide-toc li{counter-increment:toc;}
.guide-toc a{display:inline-flex;align-items:center;gap:8px;padding:8px 15px;border:1px solid rgba(248,244,234,.25);border-radius:20px;font-size:.8rem;font-weight:600;color:var(--bone);opacity:.85;transition:background .25s var(--ease),border-color .25s var(--ease),opacity .25s var(--ease);}
.guide-toc a::before{content:counter(toc,decimal-leading-zero);font-family:var(--font-display);color:var(--brass-light);font-size:.76rem;}
.guide-toc a:hover{background:var(--brass-dark);border-color:var(--brass-dark);opacity:1;}

/* ---------------- prose + numbered field notes ---------------- */
.prose-narrow{max-width:66ch;}
.prose-narrow p{font-size:1.02rem;color:var(--ink-soft);}
.prose-narrow p + p{margin-top:16px;}
.prose-narrow strong{color:var(--ink);font-weight:700;}
.section-ink .prose-narrow p{color:var(--bone-2);}
.section-ink .prose-narrow strong{color:var(--bone);}

.fieldnotes{display:grid;gap:0;counter-reset:fn;margin-top:6px;}
.fieldnotes li{display:flex;gap:20px;padding:22px 0;border-top:1px solid var(--line);}
.fieldnotes li:last-child{border-bottom:1px solid var(--line);}
.fieldnotes li::before{counter-increment:fn;content:counter(fn,decimal-leading-zero);flex:none;width:42px;height:42px;border:1px solid var(--line);border-radius:50%;display:flex;align-items:center;justify-content:center;font-family:var(--font-display);font-size:.9rem;color:var(--brass-dark);}
.fieldnotes h3{font-size:1.04rem;margin-bottom:6px;}
.fieldnotes p{font-size:.94rem;color:var(--ink-soft);max-width:64ch;}
.section-ink .fieldnotes li{border-color:var(--line-dark);}
.section-ink .fieldnotes li::before{border-color:rgba(248,244,234,.32);color:var(--brass-light);}
.section-ink .fieldnotes h3{color:var(--bone);}
.section-ink .fieldnotes p{color:var(--bone-2);}
@media (max-width:600px){.fieldnotes li{gap:14px;}.fieldnotes li::before{width:36px;height:36px;font-size:.8rem;}}

/* ---------------- elevation-by-elevation cards ---------------- */
.elev-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:1px;background:var(--line);border:1px solid var(--line);margin-top:12px;}
.elev{background:var(--bone);padding:28px 26px;}
.elev-face{font-size:.68rem;font-weight:700;letter-spacing:.2em;text-transform:uppercase;color:var(--brass-dark);display:flex;align-items:center;gap:8px;}
.elev-face::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--brass);}
.elev h3{font-size:1.08rem;margin:10px 0 8px;}
.elev p{font-size:.93rem;color:var(--ink-soft);}
.elev-do{border-left:2px solid var(--brass);padding:2px 0 2px 13px;margin-top:10px;font-size:.9rem;font-weight:600;color:var(--ink);}
@media (max-width:760px){.elev-grid{grid-template-columns:1fr;}}

/* ---------------- product recommendation cards ---------------- */
.recs{display:grid;grid-template-columns:repeat(2,1fr);gap:1px;background:var(--line);border:1px solid var(--line);margin-top:12px;}
.rec{background:var(--bone);padding:28px 26px;display:flex;flex-direction:column;gap:8px;}
.rec--wide{grid-column:1/-1;display:grid;grid-template-columns:.82fr 1.18fr;gap:0;padding:0;}
.rec--wide .rec-photo{margin:0;height:100%;min-height:250px;overflow:hidden;background:var(--bone-2);}
.rec--wide .rec-photo img{width:100%;height:100%;object-fit:cover;display:block;}
.rec--wide .rec-body{padding:30px 28px;display:flex;flex-direction:column;gap:8px;}
.rec h3{font-size:1.08rem;}
.rec-where{font-size:.68rem;font-weight:700;letter-spacing:.13em;text-transform:uppercase;color:var(--brass-dark);}
.rec p{font-size:.92rem;color:var(--ink-soft);}
.rec-catch{border-left:2px solid var(--brass);padding:2px 0 2px 14px;}
.rec-btns{display:flex;flex-wrap:wrap;gap:9px;margin-top:auto;padding-top:10px;}
.rec-add{border:1.5px solid var(--brass-dark);background:transparent;color:var(--brass-dark);padding:9px 15px;border-radius:var(--radius);font-size:.78rem;font-weight:700;transition:background .2s var(--ease),color .2s var(--ease);}
.rec-add:hover{background:var(--brass-dark);color:var(--bone);}
.rec-add.is-added{background:var(--ink);border-color:var(--ink);color:var(--bone);cursor:default;}
.rec-add[disabled]{opacity:1;}
.rec-add:focus-visible{outline:2px solid var(--brass-dark);outline-offset:3px;}
.rec .rs-note{border-color:var(--brass);}
@media (max-width:900px){.recs{grid-template-columns:1fr;}.rec--wide{grid-template-columns:1fr;}.rec--wide .rec-photo{min-height:0;aspect-ratio:16/10;}}

/* ---------------- full-bleed photo band ---------------- */
.guide-band{position:relative;min-height:42vh;display:flex;align-items:flex-end;overflow:hidden;}
.guide-band img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;}
.guide-band-scrim{position:absolute;inset:0;background:linear-gradient(0deg,rgba(18,16,13,.88) 0%,rgba(18,16,13,.08) 55%,rgba(18,16,13,.32) 100%);}
.guide-band-copy{position:relative;z-index:1;padding:48px 0;color:var(--bone);}
.guide-band-copy h2{color:var(--bone);font-size:clamp(1.4rem,2.6vw,2.1rem);}
.guide-band-copy .eyebrow{color:var(--brass-light);}
@media (max-width:640px){.guide-band{min-height:32vh;}}

/* ---------------- mid-page personalised-guide capture ---------------- */
.mini-cap{display:grid;grid-template-columns:.85fr 1.15fr;gap:48px;align-items:start;}
.lead-form{background:var(--bone);border:1px solid var(--line);padding:34px;box-shadow:var(--shadow);}
.lead-form.is-sent{display:none;}
@media (max-width:820px){.mini-cap{grid-template-columns:1fr;gap:28px;}.lead-form{padding:24px;}}

/* ---------------- form fields shared by both ladder forms ---------------- */
.field-row{display:grid;grid-template-columns:1fr 1fr;gap:16px;}
.lead-form .field{margin-bottom:16px;}
.lead-form .field label{display:block;font-size:.8rem;font-weight:700;letter-spacing:.02em;margin-bottom:6px;color:var(--ink);}
.lead-form .field input,.lead-form .field select,.lead-form .field textarea{width:100%;padding:12px 13px;border:1px solid var(--line);background:var(--bone);color:var(--ink);border-radius:var(--radius);transition:border-color .25s;font-family:inherit;}
.lead-form .field input:focus,.lead-form .field select:focus,.lead-form .field textarea:focus{border-color:var(--brass);outline:none;}
.lead-form .field textarea{min-height:88px;resize:vertical;}
.form-submit{margin-top:6px;}

.chk-set{border:none;margin:4px 0 20px;padding:0;}
.chk-set legend{font-size:.76rem;font-weight:700;letter-spacing:.05em;text-transform:uppercase;color:var(--ink-soft);margin-bottom:9px;padding:0;}
.chk-set legend .opt{font-weight:500;text-transform:none;letter-spacing:0;color:var(--ink-soft);}
.chk-grid{display:grid;grid-template-columns:1fr 1fr;gap:7px 16px;}
.chk{display:flex;align-items:center;gap:9px;font-size:.88rem;color:var(--ink-soft);padding:4px 0;}
.chk input{width:16px;height:16px;accent-color:var(--brass-dark);flex:none;}
@media (max-width:640px){.chk-grid{grid-template-columns:1fr;}.field-row{grid-template-columns:1fr;}}

.carry-note{font-size:.82rem;line-height:1.5;color:var(--ink);background:var(--bone-dim);border:1px solid var(--line);padding:10px 14px;margin-top:9px;border-radius:var(--radius);}

/* ---------------- two ways forward ---------------- */
.ways{display:grid;grid-template-columns:1.28fr .72fr;gap:22px;align-items:stretch;margin-top:12px;}
.way{padding:32px;min-width:0;}
.way-main{background:var(--ink);color:var(--bone);}
.way-main h3{color:var(--bone);font-size:1.4rem;margin-top:6px;}
.way-main p{color:var(--bone-2);font-size:.96rem;}
.way-main .btn-primary{margin-top:18px;background:var(--brass-dark);border-color:var(--brass-dark);}
.way-alt{background:var(--bone);border:1.5px solid var(--line);}
.way-alt h3{font-size:1.1rem;margin-top:6px;}
.way-alt p{color:var(--ink-soft);font-size:.9rem;}
.way-alt .btn-outline{margin-top:18px;color:var(--brass-dark);border-color:var(--brass-dark);}
.way-alt .btn-outline:hover{background:var(--brass-dark);color:var(--bone);}
.way-tag{font-size:.66rem;font-weight:700;text-transform:uppercase;letter-spacing:.18em;}
.way-main .way-tag{color:var(--brass-light);}
.way-alt .way-tag{color:var(--brass-dark);}
.capacity-note{margin-top:14px;font-size:.85rem;color:var(--bone-2);opacity:.85;}
@media (max-width:820px){.ways{grid-template-columns:1fr;}}

/* ---------------- Rung 2 — the ballpark / window list ---------------- */
.ballpark{margin-top:8px;border:1.5px solid var(--line);border-radius:var(--radius);background:var(--bone-dim);}
.ballpark summary{list-style:none;cursor:pointer;padding:15px 18px;display:flex;align-items:center;justify-content:space-between;gap:16px;font-weight:700;font-size:.9rem;color:var(--ink);}
.ballpark summary::-webkit-details-marker{display:none;}
.ballpark .ind{position:relative;width:18px;height:18px;flex:none;}
.ballpark .ind::before,.ballpark .ind::after{content:"";position:absolute;background:var(--brass-dark);transition:transform .3s var(--ease),opacity .3s var(--ease);}
.ballpark .ind::before{left:0;top:50%;width:100%;height:2px;transform:translateY(-50%);}
.ballpark .ind::after{top:0;left:50%;height:100%;width:2px;transform:translateX(-50%);}
.ballpark[open] .ind::after{transform:translateX(-50%) rotate(90deg);opacity:0;}
.bp-inner{padding:0 18px 20px;}
.bp-note{font-size:.85rem;line-height:1.6;color:var(--ink-soft);margin-bottom:14px;max-width:72ch;}
.bp-scroll{overflow-x:auto;}
.bp-table{width:100%;border-collapse:collapse;min-width:640px;}
.bp-table th{text-align:left;font-size:.66rem;font-weight:700;text-transform:uppercase;letter-spacing:.05em;color:var(--ink-soft);padding:0 8px 8px 0;}
.bp-table td{padding:6px 8px 6px 0;vertical-align:top;}
.bp-table input,.bp-table select{width:100%;font-family:inherit;font-size:.86rem;padding:9px 10px;border:1.5px solid var(--line);border-radius:var(--radius);background:var(--bone);color:var(--ink);}
.bp-table input:focus,.bp-table select:focus{outline:none;border-color:var(--brass);}
.bp-rm{width:36px;}
.bp-remove{width:30px;height:34px;line-height:1;border:1px solid var(--line);background:var(--bone);color:var(--ink-soft);border-radius:var(--radius);font-size:1.1rem;}
.bp-remove:hover{border-color:var(--brass-dark);color:var(--brass-dark);}
.bp-actions{display:flex;flex-wrap:wrap;align-items:center;gap:12px;margin-top:14px;}
.bp-actions .btn{padding:11px 18px;font-size:.8rem;}
.bp-count{font-size:.83rem;color:var(--ink-soft);}
.bp-print-head{display:none;}
@media (max-width:680px){
  .bp-table{min-width:0;}
  .bp-table thead{display:none;}
  .bp-table tbody{display:block;}
  .bp-row{display:block;background:var(--bone);border:1px solid var(--line);border-radius:var(--radius);padding:12px;margin-bottom:10px;position:relative;}
  .bp-table td{display:block;padding:0 0 10px;}
  .bp-table td[data-lbl]::before{content:attr(data-lbl);display:block;font-size:.64rem;font-weight:700;text-transform:uppercase;letter-spacing:.05em;color:var(--ink-soft);margin-bottom:4px;}
  .bp-rm{width:auto;position:absolute;top:8px;right:8px;padding:0;}
}

/* ---------------- screen-reader-only utility ---------------- */
.visually-hidden{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0;}

/* ---------------- sources list ---------------- */
.sources-list{display:flex;flex-direction:column;gap:9px;margin-top:8px;}
.sources-list li{font-size:.88rem;color:var(--ink-soft);line-height:1.6;overflow-wrap:break-word;word-break:break-word;}
.sources-list a{color:var(--brass-dark);font-weight:700;text-decoration:underline;text-underline-offset:2px;overflow-wrap:break-word;word-break:break-word;}

/* ---------------- print stylesheet for the window list ---------------- */
@media print{
  body.bp-printing > *:not(main){display:none !important;}
  body.bp-printing main > section:not([data-bp-scope]){display:none !important;}
  body.bp-printing [data-bp-scope] .section-head,
  body.bp-printing [data-bp-scope] .field-row,
  body.bp-printing [data-bp-scope] .field,
  body.bp-printing [data-bp-scope] .chk-set,
  body.bp-printing [data-bp-scope] .popia-note,
  body.bp-printing [data-bp-scope] .carry-note,
  body.bp-printing [data-bp-scope] .capacity-note,
  body.bp-printing [data-bp-scope] button,
  body.bp-printing [data-bp-scope] .bp-actions,
  body.bp-printing [data-bp-scope] .bp-note,
  body.bp-printing [data-bp-scope] .bp-rm,
  body.bp-printing [data-bp-scope] .form-success,
  body.bp-printing .ballpark > summary{display:none !important;}
  body.bp-printing [data-bp-scope]{padding:0 !important;background:#fff !important;}
  body.bp-printing .lead-form{background:none !important;border:none !important;box-shadow:none !important;padding:0 !important;}
  body.bp-printing .ballpark{border:none !important;background:none !important;margin:0 !important;}
  body.bp-printing .bp-inner{display:block !important;padding:0 !important;}
  body.bp-printing .bp-print-head{display:block !important;margin-bottom:16px;}
  body.bp-printing .bp-print-head h2{font-size:1.4rem;margin-bottom:8px;font-family:var(--font-display);}
  body.bp-printing .bp-print-head p{font-size:.86rem;color:#444;max-width:none;}
  body.bp-printing .bp-scroll{overflow:visible !important;}
  body.bp-printing .bp-table{min-width:0 !important;}
  body.bp-printing .bp-table input,body.bp-printing .bp-table select{border:none !important;border-bottom:1px solid #999 !important;background:none !important;padding:4px 2px !important;}
}

/* ---------------- homepage guide teaser ---------------- */
.guide-teaser{display:grid;grid-template-columns:1fr 1fr;gap:52px;align-items:center;}
.guide-teaser-photo{position:relative;overflow:hidden;box-shadow:var(--shadow);}
.guide-teaser-photo img{width:100%;aspect-ratio:4/3;object-fit:cover;display:block;transition:transform .6s var(--ease);}
.guide-teaser-photo:hover img{transform:scale(1.04);}
.guide-teaser-copy .rule{margin-top:16px;}
.guide-teaser-copy p{margin-top:16px;}
.guide-teaser-copy .btn{margin-top:24px;}
@media (max-width:900px){.guide-teaser{grid-template-columns:1fr;gap:28px;}.guide-teaser-photo{order:-1;}}

.hero-guide-link{display:inline-flex;align-items:center;gap:8px;margin-top:18px;font-size:.86rem;font-weight:600;color:var(--ink);border-bottom:1px solid var(--brass);padding-bottom:2px;transition:color .2s;}
.hero-guide-link:hover{color:var(--brass-dark);}
.hero-guide-link svg{width:14px;height:14px;color:var(--brass);transition:transform .25s var(--ease);}
.hero-guide-link:hover svg{transform:translateX(3px);}

/* ============ REDUCED MOTION ============
   One authoritative block, last in the file. Every animation is stopped AND every
   animated element is forced to its finished, visible state — nothing may be left
   sitting at opacity 0 or mid-transform if the visitor has asked for less motion. */
@media (prefers-reduced-motion: reduce){
  *,*::before,*::after{
    animation-duration:.001ms !important;
    animation-iteration-count:1 !important;
    transition-duration:.001ms !important;
    scroll-behavior:auto !important;
  }
  html{scroll-behavior:auto !important;}
  .hero-louvre{display:none !important;}
  .hero-photo{transform:none !important;}
  .hero-headline .word{overflow:visible;}
  .hero-headline .word span{transform:none !important;}
  .hero-eyebrow-wrap,.hero-chips,.hero-panel{opacity:1 !important;}
  .reveal,.reveal.in-view{opacity:1 !important;transform:none !important;}
  .process-step,.cta .btn-group .btn,.editorial-figure img{opacity:1 !important;transform:none !important;}
  .rule{transform:scaleX(1) !important;}
  .marquee-track{animation:none !important;transform:none !important;}
  .cta-glow{animation:none !important;}
  .product-card:hover .pthumb img{transform:none !important;}
}