/* Scoped additions; existing hero, calculator and palette remain unchanged. */
.header-contact { position:relative; flex-shrink:0; }
.header-contact .header-phone { display:flex; align-items:center; gap:10px; padding:10px 0; border:0; background:none; color:var(--white); cursor:pointer; }
.contact-mobile-icon { display:none; }
.header-contact .header-phone span { margin-left:0; color:inherit; }
.header-contact .header-phone .contact-caret { color:var(--green); }
.contact-menu { position:absolute; top:calc(100% + 12px); right:0; width:240px; padding:10px; border:1px solid var(--line); background:var(--panel); box-shadow:0 16px 40px #0005; z-index:30; }
.contact-menu[hidden] { display:none; }
.contact-menu a,.contact-unavailable { display:flex; align-items:center; gap:13px; padding:12px; font-size:14px; line-height:1.5; }
.contact-menu a:hover { color:var(--green); background:#35442e; }
.contact-menu svg { width:22px; height:22px; flex-shrink:0; fill:none; stroke:currentColor; stroke-width:1.6; stroke-linecap:round; stroke-linejoin:round; }
.contact-unavailable { color:var(--muted); }
.contact-unavailable small { display:block; font-size:10px; }
.about-company { border-top:1px solid var(--line); }
.about-company h2 { max-width:830px; margin-bottom:35px; }
.about-company-layout { display:grid; grid-template-columns:minmax(0,1.4fr) minmax(0,1fr); gap:8%; }
.about-company-copy { font-size:15px; color:var(--muted); }
.about-company-copy p { margin-bottom:20px; }
.about-company-advantages { border-top:1px solid var(--line); padding-top:20px; }
.about-company-advantages h3 { font-size:21px; }
.about-company-advantages ul { padding:0; list-style:none; }
.about-company-advantages li { padding:13px 0; border-bottom:1px solid var(--line); font-size:14px; }
.about-company-advantages li::before { content:'↗'; color:var(--green); margin-right:12px; }
.works-filters { display:flex; flex-wrap:wrap; gap:10px; margin:32px 0; }
.works-filters button { border:1px solid var(--line); background:transparent; color:var(--muted); font-size:13px; padding:12px 18px; }
.works-filters button[aria-pressed=true] { color:var(--bg); background:var(--green); border-color:var(--green); }
.works-grid,.product-photo-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:24px; }
.works-empty { border:1px solid var(--line); padding:36px; color:var(--muted); font-size:15px; }
.work-photo { background:none; border:0; padding:0; color:var(--white); text-align:left; overflow:hidden; }
.work-photo img { aspect-ratio:3/4; object-fit:contain; background:#1b211c; height:auto; transition:transform .4s ease; }
.work-photo span { display:block; padding:14px 0; font-size:13px; }
.work-photo:hover img { transform:scale(1.025); }
.photo-is-open { overflow:hidden; }
.photo-viewer { max-width:none; max-height:none; width:100vw; height:100dvh; margin:0; padding:70px 70px 40px; border:0; background:#151a17f5; color:var(--white); box-sizing:border-box; }
.photo-viewer[open] { display:flex; align-items:center; justify-content:center; animation:photoIn .2s ease; }
.photo-viewer::backdrop { background:#101510ed; }
.photo-viewer figure { display:flex; flex-direction:column; align-items:center; max-width:100%; max-height:100%; }
.photo-viewer figure img { max-height:calc(100dvh - 160px); max-width:100%; width:auto; height:auto; object-fit:contain; }
.photo-viewer figcaption { font-size:13px; color:var(--muted); margin-top:16px; text-align:center; }
.photo-toolbar { position:absolute; top:15px; left:25px; right:25px; display:flex; justify-content:space-between; align-items:center; }
.photo-viewer button { color:var(--white); background:#303c2a; border:1px solid var(--line); min-width:44px; min-height:44px; font-size:25px; }
.photo-prev,.photo-next { position:absolute; top:50%; }
.photo-prev { left:14px; }.photo-next { right:14px; }
.photo-viewer button[hidden] { display:none; }
@keyframes photoIn { from {opacity:0;} to {opacity:1;} }
.product-page-main { padding:42px 6% 80px; }
.product-breadcrumb { display:inline-block; font-size:12px; color:var(--muted); margin-bottom:35px; }
.product-hero { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1.1fr); gap:5%; align-items:center; padding-bottom:60px; }
.product-hero h1 { font-size:clamp(34px,3.3vw,60px); letter-spacing:-.04em; overflow-wrap:anywhere; margin:24px 0; }
.product-hero p { color:var(--muted); font-size:15px; }
.product-hero .hero-actions { flex-wrap:wrap; gap:20px; }
.product-photo-button { padding:0; margin:0; border:0; background:none; width:100%; cursor:zoom-in; overflow:hidden; }
.product-photo-button img { aspect-ratio:8/5; height:auto; transition:transform .4s ease; }
.product-photo-button:hover img { transform:scale(1.025); }
.product-detail-section { padding:55px 0; border-top:1px solid var(--line); }
.product-detail-section h2 { margin-bottom:30px; }
.product-detail-columns { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:5%; color:var(--muted); font-size:15px; }
.product-detail-columns h3 { color:var(--white); font-size:21px; }
.product-detail-columns ul { padding-left:20px; }
.product-detail-columns li { margin-bottom:10px; }
.product-specs { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:0 40px; }
.product-specs div { padding:20px 0; border-bottom:1px solid var(--line); }
.product-specs dt { font-weight:700; margin-bottom:8px; }
.product-specs dd { margin:0; color:var(--muted); font-size:14px; }
.awning-size-table { border-collapse:collapse; width:100%; margin:28px 0; font-size:14px; }
.awning-size-table th,.awning-size-table td { padding:15px 10px; border-bottom:1px solid var(--line); text-align:left; }
.product-gallery-note { color:var(--muted); font-size:12px; margin-top:14px; }
.product-page-footer { padding:30px 6%; border-top:1px solid var(--line); display:flex; flex-wrap:wrap; gap:25px; justify-content:space-between; font-size:13px; }
@media(min-width:761px) and (max-width:960px) { .header-contact {grid-column:2;grid-row:1;} }
@media(max-width:760px) {
 .header .brand { order:0; }.header-contact {order:1;margin-left:auto;margin-right:10px;}.header .menu-toggle {order:2;}.header nav {order:3;}
 .header-contact .header-phone {display:flex;font-size:20px;padding:6px;}.contact-number-text,.contact-caret {display:none;}.contact-mobile-icon {display:block;}
 .contact-menu {right:-35px;top:calc(100% + 22px);width:230px;}
 .about-company-layout,.works-grid,.product-photo-grid,.product-hero,.product-detail-columns,.product-specs {grid-template-columns:1fr;gap:25px;}
 .about-company h2 {font-size:34px;}.works-empty {padding:24px;}.works-filters {gap:8px;}.works-filters button {font-size:12px;padding:10px 12px;}
 .product-page-main {padding-top:30px;}.product-hero {padding-bottom:40px;}.product-hero h1 {font-size:36px;}.product-detail-section {padding:40px 0;}
 .photo-viewer {padding:70px 48px 35px;}.photo-viewer figure img {max-height:calc(100dvh - 150px);}.photo-prev {left:3px;}.photo-next {right:3px;}
}
@media(prefers-reduced-motion:reduce){.photo-viewer[open]{animation:none;}.work-photo img,.product-photo-button img{transition:none;}}
.field-error { display:block; color:var(--green); font-size:12px; line-height:1.6; margin-top:6px; }
.unknown-dimensions { display:flex; align-items:center; gap:10px; }
.unknown-dimensions input { width:20px; height:20px; padding:0; }
.request-channels { line-height:2; margin:18px 0 0; }
input,select,textarea { scroll-margin-block:100px; }
input[readonly] { color:var(--muted); }
@media(max-width:760px) {
 body.form-in-view .mobile-call, body:has(input:focus,select:focus,textarea:focus,dialog[open]) .mobile-call { display:none; }
 .zip-result,.zip-editor,.zip-screen { min-width:0; }
 .zip-result .button { white-space:normal; }
 .hero-geography strong { overflow-wrap:anywhere; }
}

/* The shrinking header keeps a constant footprint in document flow. */
:root { --header-expanded:106px; --header-height:106px; --header-bleed:-4.347826%; }
html { scroll-padding-top:var(--header-scroll-offset,calc(var(--header-expanded) + 16px)); }
.header {
 position:sticky; top:0; z-index:100; isolation:isolate;
 height:var(--header-height); margin-bottom:calc(var(--header-expanded) - var(--header-height));
 transition:height .2s ease,margin-bottom .2s ease;
}
.header::before {
 content:""; position:absolute; inset:0 var(--header-bleed); z-index:-1;
 background:var(--bg); transition:background .2s ease,box-shadow .2s ease;
}
.header.is-scrolled { --header-height:86px; }
.header.is-scrolled::before { background:rgba(32,37,34,.97); box-shadow:0 1px 0 #424a4180,0 6px 18px #0002; }
@supports ((backdrop-filter:blur(10px)) or (-webkit-backdrop-filter:blur(10px))) {
 .header.is-scrolled::before { background:rgba(32,37,34,.94); -webkit-backdrop-filter:blur(10px); backdrop-filter:blur(10px); }
}
.header .header-phone { min-height:44px; }
.header .contact-menu { max-height:calc(100dvh - var(--header-height) - 24px); overflow-y:auto; overscroll-behavior:contain; z-index:40; }
.header .contact-menu a { min-height:44px; }
.catalog-block { scroll-margin-top:0; }
input,select,textarea { scroll-margin-top:16px; }
@media(min-width:761px) and (max-width:960px) {
 .header.is-scrolled { --header-height:94px; }
}
@media(max-width:760px) {
 :root { --header-expanded:85px; --header-height:85px; --header-bleed:-6.818182%; }
 .header { flex-wrap:nowrap; }
 .header.is-scrolled { --header-height:73px; }
 .header .header-contact { margin:0 2px 0 auto; }
 .header .header-phone,.header .menu-toggle { min-width:45px; width:45px; min-height:45px; height:45px; padding:0; justify-content:center; flex-shrink:0; }
 .header nav {
  position:absolute; top:100%; left:var(--header-bleed); right:var(--header-bleed);
  margin:0; padding:14px 6.818182%; gap:0;
  max-height:calc(100dvh - var(--header-height)); overflow-y:auto; overscroll-behavior:contain;
  z-index:30; box-shadow:0 10px 20px #0003;
 }
 .header nav a { display:flex; align-items:center; min-height:48px; padding:10px 0; }
 .header .contact-menu { top:calc(100% + 10px); right:-46px; width:min(260px,88vw); }
}
@media(max-width:340px) { .header .brand {font-size:18.5px;gap:6px;} }

.pergola-drawing{display:block;width:100%;max-width:700px;height:auto;margin:20px 0}.product-photo-grid figure{margin:0;min-width:0}

.header-contact{display:flex;align-items:center;gap:8px;flex-shrink:0}.contact-icons{display:flex;gap:3px;align-items:center}.contact-icon{display:inline-flex!important;align-items:center;justify-content:center;min-width:44px;width:44px;height:44px;min-height:44px;border-radius:7px;transition:background .2s,transform .2s}.contact-icon:hover{background:#b6d68f20}.contact-icon:active{transform:scale(.94)}.contact-icon:focus-visible{outline:2px solid #b7d88e;outline-offset:2px}.contact-symbol{display:block;width:30px;height:30px;overflow:hidden}.contact-symbol img{display:block!important;height:30px!important;width:auto!important;max-width:none!important}.contact-icon svg{width:25px;height:25px}.contact-phone-number{display:block;white-space:nowrap;color:inherit;font-size:14px;font-weight:700}.footer .contact-icons{margin-top:10px}.max-channel{grid-column:1/-1;display:flex;gap:28px;align-items:center;padding:26px 0;border-top:1px solid #4c5848}.max-channel img{width:180px;height:180px;max-width:45vw;object-fit:contain;background:#fff;flex-shrink:0}.max-channel .eyebrow{font-size:15px;letter-spacing:.02em}.zip-disclaimer{font-size:14px!important;line-height:1.7!important;color:#43523a!important;padding:14px 0;border-top:1px solid #c4cfb7}.approved-breakdown p{display:flex;justify-content:space-between;gap:15px;font-size:13px;line-height:1.7}.approved-breakdown strong{white-space:nowrap}.consent-line{display:block!important;font-size:12px!important;line-height:1.7!important;margin:15px 0}.consent-line input{display:inline-block!important;width:18px!important;height:18px!important;min-height:18px!important;vertical-align:middle;margin-right:8px}.consent-line a{text-decoration:underline}.form-trap{position:absolute!important;left:-10000px!important;width:1px!important;height:1px!important;overflow:hidden!important}.privacy-page{max-width:950px;margin:auto}.privacy-page h1{font-size:clamp(28px,4vw,48px)}.privacy-page p{line-height:1.8}.privacy-pending{padding:18px;border:1px solid #b9d294}

.privacy-page h2{font-size:clamp(20px,3vw,26px);line-height:1.35;letter-spacing:-.02em;margin:30px 0 12px}.privacy-page a{overflow-wrap:anywhere}

/* Catalogue descriptions must occupy their natural height. flex:1 previously
   gave the long final card a zero basis and allowed its copy to shrink over the list. */
#solutions .product{min-width:0;height:auto}
#solutions .product>p{flex:0 0 auto;min-height:0;line-height:1.75;margin:0 0 20px;overflow-wrap:break-word}
#solutions .product>ul{flex:0 0 auto;min-height:0;margin:0 0 18px;line-height:1.75}
#solutions .product>ul li{margin:0 0 7px}
#solutions .product>.product-link{flex:0 0 auto;margin-top:auto;min-height:44px;align-items:center}
#solutions .product>.text-link{display:inline-flex;align-items:center;min-height:44px;margin-top:10px;align-self:flex-start}
#solutions .product>.product-visual{flex-shrink:0}

/* One header layout per breakpoint, preserving its sticky, constant flow footprint. */
.header{--header-expanded:104px;--header-height:104px;display:grid!important;grid-template-columns:auto minmax(0,1fr) auto!important;grid-template-areas:'brand nav contact'!important;align-items:center;column-gap:clamp(16px,1.4vw,28px);row-gap:0;min-height:0!important;height:var(--header-height)!important;padding:0!important;flex-wrap:nowrap}
.header.is-scrolled{--header-height:86px}
.header .brand{grid-area:brand;min-width:0;max-width:100%;gap:9px;font-size:clamp(23px,1.9vw,30px);line-height:1.08;letter-spacing:-.045em;order:initial}
.header .header-logo-mark{width:clamp(44px,3.4vw,62px);height:auto;aspect-ratio:724/522}
.header .header-logo-wordmark{min-width:0}
.header .brand-caption{font-size:clamp(7px,.57vw,9px);font-weight:600;line-height:1.4;letter-spacing:.16em;margin:6px 0 0;text-align:center}
.header nav{grid-area:nav;display:flex;position:static;flex-direction:row;align-items:center;justify-content:center;gap:clamp(10px,1.1vw,22px);padding:0;margin:0;min-width:0;width:auto;height:auto;white-space:nowrap;font-size:clamp(12px,1vw,16px);font-weight:600;line-height:1.4;letter-spacing:0;background:transparent;border:0;box-shadow:none}
.header nav a{display:flex;align-items:center;min-height:44px;padding:0}
.header .header-contact{grid-area:contact;display:flex;align-items:center;justify-content:flex-end;gap:8px;margin:0!important;order:initial!important}
.header .contact-phone-number{font-size:clamp(12px,.95vw,15px);font-weight:600;line-height:1.4;min-height:44px;display:flex;align-items:center}
.contact-icons{gap:0}
.contact-icon{flex-shrink:0}
.contact-symbol{display:flex;align-items:center;justify-content:center;width:28px;height:28px;overflow:visible}
.contact-symbol img{width:28px!important;height:28px!important;max-width:100%!important;object-fit:contain}
.contact-symbol:has(img[src$="contact-max.png"]){display:block;overflow:hidden}
.contact-symbol img[src$="contact-max.png"]{width:auto!important;height:28px!important;max-width:none!important;object-fit:initial}
.contact-icon svg{width:25px;height:25px;object-fit:contain}
.header .menu-toggle{display:none!important;grid-area:toggle;align-items:center;justify-content:center;min-height:44px;min-width:44px;width:44px;height:44px;padding:0;border:1px solid transparent;background:transparent;color:var(--white);font-size:24px;line-height:1;order:initial}
.max-channel-qr{display:grid;place-items:center;width:180px;height:180px;aspect-ratio:1;flex:0 0 180px;padding:16px;background:#fff;color:#354331;border-radius:2px}
.max-channel .max-channel-qr img{width:100%;height:100%;max-width:100%;object-fit:contain;aspect-ratio:1;background:#fff}
.max-qr-pending{text-align:center;font-size:13px;line-height:1.6}
@media(max-width:1279px){
 .header{--header-expanded:94px;--header-height:94px;grid-template-columns:auto minmax(0,1fr) 44px!important;grid-template-areas:'brand contact toggle'!important;column-gap:14px}
 .header.is-scrolled{--header-height:82px}
 .header .brand{font-size:23px;gap:8px}.header .header-logo-mark{width:46px}.header .brand-caption{font-size:7.5px}
 .header .menu-toggle{display:flex!important}
 .header nav{display:none;position:absolute;top:100%;left:var(--header-bleed);right:var(--header-bleed);width:auto;height:auto;max-height:calc(100dvh - var(--header-height));overflow-y:auto;overscroll-behavior:contain;flex-direction:column;align-items:stretch;justify-content:flex-start;padding:16px 5%;gap:0;background:var(--bg);box-shadow:0 12px 24px #0004;font-size:16px;white-space:normal;z-index:50;border-bottom:1px solid var(--line)}
 .header nav.open{display:flex}.header nav a{min-height:48px;padding:10px 0}
 .header .contact-phone-number{font-size:14px}
}
@media(max-width:600px){
 .header{--header-expanded:116px;--header-height:116px;grid-template-columns:minmax(0,1fr) 44px!important;grid-template-areas:'brand toggle' 'contact contact'!important;grid-template-rows:1fr 44px;column-gap:8px;row-gap:2px;padding:6px 0!important}
 .header.is-scrolled{--header-height:104px}
 .header .brand{font-size:22px;gap:7px}.header .header-logo-mark{width:44px}.header .brand-caption{font-size:7px;margin-top:5px}
 .header .header-contact{justify-content:center;gap:8px}.header .contact-phone-number{font-size:13px}
 .max-channel{gap:20px;align-items:flex-start;flex-direction:column}.max-channel-qr{width:160px;height:160px;flex-basis:160px}
}
@media(max-width:350px){.header .brand{font-size:19px}.header .header-logo-mark{width:38px}.header .brand-caption{font-size:6.5px}.header .contact-phone-number{font-size:12px}.header .header-contact{gap:4px}}

/* Owner-supplied MAX card: display its original QR pixels, crop only in CSS.
   Source 1320x1536; square viewing region x336,y615,648x648 plus outer quiet space. */
.max-channel .max-qr-window{display:block;position:relative;width:100%;height:100%;aspect-ratio:1;overflow:hidden;background:#fff}
.max-channel .max-qr-window img{position:absolute;left:-51.851852%;top:-94.907407%;width:203.703704%!important;height:237.037037%!important;max-width:none!important;object-fit:fill;aspect-ratio:auto}
.max-channel-qr:has(.max-qr-pending:not([hidden])) .max-qr-window{display:none}