/* Self-hosted fonts */
@font-face{font-family:'Barlow';font-style:normal;font-weight:400;font-display:swap;src:url('../assets/fonts/barlow-400.woff2') format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Barlow';font-style:normal;font-weight:600;font-display:swap;src:url('../assets/fonts/barlow-600.woff2') format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Barlow';font-style:normal;font-weight:700;font-display:swap;src:url('../assets/fonts/barlow-700.woff2') format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Barlow';font-style:normal;font-weight:800;font-display:swap;src:url('../assets/fonts/barlow-800.woff2') format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Barlow';font-style:normal;font-weight:900;font-display:swap;src:url('../assets/fonts/barlow-900.woff2') format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Inter';font-style:normal;font-weight:300 700;font-display:swap;src:url('../assets/fonts/inter-latin.woff2') format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
:root{
  --primary:hsl(84,81%,35%);
  --primary-fg:#fff;
  --secondary:hsl(0,0%,15%);
  --secondary-fg:#fff;
  --bg:#fff;
  --fg:hsl(0,0%,10%);
  --card:#fff;
  --muted:hsl(0,0%,96%);
  --muted-fg:hsl(0,0%,45%);
  --border:hsl(0,0%,90%);
  --font-body:'Inter',sans-serif;
  --font-display:'Barlow',sans-serif;
}
html{scroll-behavior:smooth;scrollbar-gutter:stable;scroll-padding-top:110px}
@media(min-width:1024px){html{scroll-padding-top:136px}}
section[id],div[id]{scroll-margin-top:110px}
@media(min-width:1024px){section[id],div[id]{scroll-margin-top:136px}}
body{font-family:var(--font-body);color:var(--fg);background:var(--bg);line-height:1.6;-webkit-font-smoothing:antialiased}
h1,h2,h3,h4,h5,h6{font-family:var(--font-display);text-transform:uppercase;letter-spacing:-.02em;line-height:1.1}
a{color:inherit;text-decoration:none}
img{max-width:100%;height:auto;display:block}
button,input,select,textarea{font-family:inherit;font-size:inherit}
button{cursor:pointer}

.container{width:100%;max-width:1200px;margin:0 auto;padding:0 1rem}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);border:0}

/* HEADER / NAVBAR */
.site-header{position:sticky;top:0;z-index:50;width:100%;border-bottom:1px solid var(--border);background:rgba(255,255,255,.95);backdrop-filter:blur(8px)}
@supports(backdrop-filter:blur(8px)){.site-header{background:rgba(255,255,255,.8)}}
.header-inner{display:flex;align-items:center;justify-content:space-between;height:64px;gap:1.5rem}
@media(min-width:1024px){.header-inner{height:88px}}
.logo{flex-shrink:0}
.logo img{height:40px;width:auto;object-fit:contain}
@media(min-width:1024px){.logo img{height:48px}}
.desktop-nav{display:none;align-items:center;justify-content:space-evenly;gap:0;flex:1;margin:0 1.5rem;flex-wrap:nowrap}
@media(min-width:1024px){.desktop-nav{display:flex}}
.desktop-nav a,.desktop-nav .nav-link{white-space:nowrap;font-size:.875rem;font-weight:600;text-transform:uppercase;letter-spacing:.05em;color:rgba(26,26,26,.8);transition:color .2s;line-height:1}
@media(min-width:1280px){.desktop-nav a,.desktop-nav .nav-link{font-size:.9375rem}}
.desktop-nav a:hover,.desktop-nav a.active{color:var(--primary)}
.nav-product{display:inline-flex;flex-direction:column;align-items:center;text-align:center;line-height:1}
.nav-product .nav-sublabel{display:block;font-size:.58rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;opacity:0;transform:translateY(-3px);transition:opacity .2s,transform .2s,max-height .2s,margin-top .2s;max-height:0;overflow:hidden;line-height:1;margin-top:0}
.desktop-nav a:hover .nav-sublabel,.desktop-nav a.active .nav-sublabel{opacity:1;transform:translateY(0);max-height:1em;margin-top:3px}
.nav-separator{color:var(--border)}
.nav-cta{display:none;flex-shrink:0}
@media(min-width:1024px){.nav-cta{display:block}}
.nav-cta .btn{font-size:.875rem;height:44px;padding:0 1.5rem;min-width:9rem;text-align:center}
@media(min-width:1280px){.nav-cta .btn{font-size:1rem;height:44px;padding:0 1.5rem}}

/* Products dropdown */
.products-dropdown{position:relative;padding:.5rem 0}
.products-dropdown .dropdown-menu{display:none;position:absolute;top:100%;left:0;width:16rem;background:var(--card);border:1px solid var(--border);box-shadow:0 4px 12px rgba(0,0,0,.1);padding:.5rem 0;margin-top:-2px;z-index:60}
.products-dropdown:hover .dropdown-menu{display:block}
.dropdown-menu a{display:block;padding:.75rem 1rem;font-size:.875rem;font-weight:600;text-transform:uppercase}
.dropdown-menu a:hover{background:var(--muted);color:var(--primary)}

/* Mobile menu */
.mobile-toggle{display:block;padding:.5rem;background:none;border:none;cursor:pointer;color:var(--fg)}
@media(min-width:1024px){.mobile-toggle{display:none}}
.mobile-toggle svg{width:24px;height:24px}
.mobile-nav{display:none!important;position:fixed;top:64px;left:0;right:0;bottom:0;z-index:100;background:#fff;overflow-y:auto;flex-direction:column;border-top:2px solid var(--primary)}
.mobile-nav.open{display:flex!important}
.mobile-nav-backdrop{display:none!important;position:fixed;top:0;left:0;right:0;bottom:0;z-index:99;background:rgba(0,0,0,.4)}
.mobile-nav-backdrop.open{display:block!important}
.mobile-nav a,.mobile-nav button.mobile-link{display:flex!important;width:100%;align-items:center;justify-content:space-between;padding:1rem 1.5rem;font-family:var(--font-display);font-weight:700;font-size:1.125rem;text-transform:uppercase;letter-spacing:.05em;border-bottom:1px solid #e0e0e0;background:#fff;border-left:none;border-right:none;border-top:none;cursor:pointer;text-align:left;color:#000}
.mobile-nav a:hover,.mobile-nav button.mobile-link:hover{background:var(--muted)}
.mobile-nav a.active{color:var(--primary);background:rgba(74,140,28,.05)}
.mobile-sub{background:rgba(0,0,0,.02)}
.mobile-sub a{padding-left:2.5rem;font-size:.875rem;font-weight:600;color:var(--muted-fg)}
.mobile-nav-cta{padding:1.5rem;border-top:1px solid var(--border);background:rgba(0,0,0,.02)}

/* BUTTONS */
.btn{display:inline-flex;align-items:center;justify-content:center;font-family:var(--font-display);font-weight:700;text-transform:uppercase;letter-spacing:.05em;border:none;cursor:pointer;transition:all .2s;white-space:nowrap}
.btn-primary{background:var(--primary);color:#fff;padding:.75rem 2rem;font-size:1rem}
.btn-primary:hover{filter:brightness(1.1)}
.btn-lg{padding:0 2rem;font-size:1.125rem;height:48px}
@media(min-width:640px){.btn-lg{height:56px;padding:0 2.5rem;font-size:1.25rem}}
.btn-outline{background:transparent;border:2px solid var(--primary);color:var(--primary);padding:.75rem 2rem;font-size:1rem}
.btn-outline:hover{background:var(--primary);color:#fff}
.btn-outline-white{background:transparent;border:2px solid #fff;color:#fff;padding:.75rem 2rem;font-size:1rem}
.btn-outline-white:hover{background:#fff;color:var(--primary)}
.btn-white{background:#fff;color:var(--primary);padding:.75rem 2rem;font-size:1rem}
.btn-white:hover{background:var(--secondary);color:#fff}
.btn-dark{background:var(--secondary);color:#fff;padding:.75rem 2rem}
.btn-full{width:100%}
@media(min-width:640px){.btn-sm-auto{width:auto}}

/* FOOTER */
.site-footer{background:var(--secondary);color:rgba(255,255,255,.85);padding:4rem 0 2rem;border-top:6px solid var(--primary)}
.footer-grid{display:grid;grid-template-columns:1fr;gap:3rem;margin-bottom:3rem}
@media(min-width:768px){.footer-grid{grid-template-columns:minmax(18rem,1.3fr) repeat(2,minmax(0,1fr));gap:4rem}}
.footer-grid-wide{align-items:start}
.footer-brand p{color:rgba(255,255,255,.7);font-weight:500;margin-bottom:1.5rem}
.footer-heading{font-family:var(--font-display);font-weight:700;font-size:1.25rem;color:#fff;text-transform:uppercase;letter-spacing:.05em;margin-bottom:1.5rem}
.footer-links{list-style:none;display:flex;flex-direction:column;gap:.75rem}
.footer-links a{font-weight:500;transition:color .2s}
.footer-links a:hover{color:var(--primary)}
.footer-affiliate-name{font-family:var(--font-display);font-weight:700;font-size:1.125rem;color:var(--primary);display:inline-block;margin-bottom:.25rem;transition:color .2s}
.footer-affiliate-name:hover{opacity:.8}
.footer-affiliate-desc{font-size:.875rem;color:rgba(255,255,255,.7)}
.footer-socials{display:flex;align-items:center;gap:.75rem;margin-top:1rem}
.footer-social-link{display:inline-flex;align-items:center;justify-content:center;width:2.5rem;height:2.5rem;color:#fff;opacity:.85;transition:opacity .2s,transform .2s}
.footer-social-link:hover{opacity:1;transform:translateY(-1px)}
.footer-social-link svg{width:1.4rem;height:1.4rem}
.footer-bottom{border-top:1px solid rgba(255,255,255,.1);padding-top:2rem;display:flex;flex-direction:column;align-items:center;gap:1rem;font-size:.875rem;color:rgba(255,255,255,.6)}
@media(min-width:768px){.footer-bottom{flex-direction:row;justify-content:space-between}}

/* HERO SECTIONS */
.hero{position:relative;min-height:85vh;display:flex;align-items:center;overflow:hidden;padding-bottom:1rem}
.hero-bg{position:absolute;inset:0;background-size:cover;background-position:center;background-repeat:no-repeat}
.hero-video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.hero-overlay{position:absolute;inset:0;background:linear-gradient(to right,rgba(0,0,0,.8),rgba(0,0,0,.5),transparent)}
.hero-content{position:relative;z-index:10;width:100%;max-width:1200px;margin:0 auto;padding:0 1rem;display:flex;align-items:stretch}
.hero h1{font-size:clamp(2rem,6vw,6rem);font-weight:900;color:#fff;margin-bottom:1.5rem;line-height:1.1;letter-spacing:-.03em}
.hero h1 .accent{color:var(--primary)}
.hero-headline{display:flex;flex-direction:column;gap:.35rem;max-width:18ch;text-wrap:balance}
.hero-headline-line{display:block}
.hero-headline-line-break{display:block}
.hero-headline-line-secondary{font-size:.82em;line-height:1;color:var(--primary)}
.hero-headline-line:not(.hero-headline-line-secondary){font-size:.55em}
.hero p{font-size:clamp(1rem,2vw,1.5rem);color:rgba(255,255,255,.9);font-weight:500;max-width:42rem;line-height:1.6;margin-bottom:2.5rem}
.hero-btns{display:flex;flex-direction:column;gap:1rem}
@media(min-width:640px){.hero-btns{flex-direction:row}}

.hero-context-section{padding:2rem 0 3rem;text-align:center}
.hero-context-title-mobile-center{margin-left:auto}
@media(max-width:767px){.hero-context-title-mobile-center{text-align:center!important;margin-left:auto;margin-right:auto}}
.hero-context-heading{font-size:clamp(1.75rem,4vw,3rem);font-weight:900;margin-bottom:1rem;color:var(--secondary)}
.hero-context-stack{display:flex;flex-direction:column;gap:1rem;padding-top:1.5rem;border-top:1px solid rgba(0,0,0,.08);max-width:48rem;margin:0 auto}
.hero-context-title{font-size:clamp(1.5rem,3vw,2.25rem);font-weight:900;margin-bottom:1rem;color:var(--secondary)}
.hero-context-list{list-style:none;display:grid;gap:.75rem;padding:0;margin:0 auto;text-align:left;max-width:34rem}
.hero-context-list li{position:relative;padding-left:1.5rem;font-size:1rem;line-height:1.6;color:var(--fg)}
.hero-context-list li::before{content:"";position:absolute;left:0;top:.6em;width:.6rem;height:.6rem;border-radius:999px;background:var(--primary);box-shadow:0 0 0 4px rgba(74,140,28,.12)}
.content-list{list-style:disc;text-align:left;padding-left:1.5rem;margin-top:1rem}
.content-list li{margin:.4rem 0;line-height:1.6;color:var(--muted-fg);font-weight:500}
.text-center .content-list,.section-center .content-list{max-width:34rem;margin-left:auto;margin-right:auto}
.list-group{margin-top:1.25rem;padding-top:1rem;border-top:1px solid rgba(0,0,0,.08)}
.list-group-label{display:block;font-family:var(--font-display);font-size:.72rem;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:var(--primary);margin-bottom:.5rem}
.text-center .list-group,.section-center .list-group{max-width:34rem;margin-left:auto;margin-right:auto}
.stat-row{display:grid;grid-template-columns:1fr;gap:2.5rem;text-align:center;padding:1rem 0}
@media(min-width:640px){.stat-row{grid-template-columns:repeat(3,1fr)}}
.stat-value{font-family:var(--font-display);font-size:clamp(2rem,4vw,3rem);font-weight:900;color:var(--primary);line-height:1;margin-bottom:.5rem}
.stat-label{font-size:.9375rem;font-weight:600;color:rgba(255,255,255,.7);line-height:1.4;text-transform:uppercase;letter-spacing:.04em}
.stat-desc{font-size:.875rem;font-weight:400;color:rgba(255,255,255,.5);margin-top:.25rem}
.faq-accordion{max-width:48rem;margin:0 auto;display:grid;gap:1rem;text-align:left}
.faq-item{border:1px solid var(--border);background:#fff}
.faq-question{width:100%;display:flex;justify-content:space-between;align-items:center;gap:1rem;padding:1.25rem 1.5rem;font-family:var(--font-display);font-size:1rem;font-weight:800;text-transform:uppercase;letter-spacing:.04em;background:none;border:none;color:var(--secondary);text-align:left}
.faq-answer{display:none;padding:0 1.5rem 1.25rem;color:var(--muted-fg);font-weight:500;line-height:1.7}
.faq-item.open .faq-answer{display:block}
.hp-panel-toggle{display:inline-flex;align-items:center;justify-content:center;margin:.5rem 0 1rem;padding:.7rem 1rem;border:1px solid var(--border);background:var(--muted);color:var(--secondary);font-family:var(--font-display);font-size:.75rem;font-weight:800;text-transform:uppercase;letter-spacing:.08em}
.hp-panel{margin-top:.5rem}
.hp-panel-scroll{overflow-x:auto;-webkit-overflow-scrolling:touch;border:1px solid var(--border);background:#fff}
.hp-compare-table{width:100%;min-width:720px;border-collapse:collapse;font-size:.875rem}
.hp-compare-table th,.hp-compare-table td{padding:.7rem .8rem;border-bottom:1px solid var(--border);text-align:center;vertical-align:middle;white-space:nowrap}
.hp-compare-table th:first-child,.hp-compare-table td:first-child{text-align:left;font-weight:800}
.hp-compare-table thead th{position:sticky;top:0;background:#fafafa;z-index:1}
.hp-compare-table tbody tr:nth-child(even){background:#fcfcfc}
.hp-compare-table tbody tr:hover{background:rgba(74,140,28,.05)}
.hp-compare-table-wrap{scrollbar-color:rgba(0,0,0,.55) rgba(0,0,0,.08)}
.model-spec-grid{display:flex;flex-direction:column;gap:1rem;margin-top:1rem}
.model-spec-card{background:#fff;border:1px solid var(--border);border-radius:1rem;padding:1.25rem;box-shadow:0 10px 28px rgba(0,0,0,.05);text-align:left;width:100%}
.model-spec-card-header{display:flex;justify-content:space-between;gap:1rem;align-items:flex-start;margin-bottom:1rem}
.model-spec-toggle{display:flex;align-items:flex-start;justify-content:space-between;width:100%;gap:1rem;border:0;background:transparent;padding:0;text-align:left;cursor:pointer}
.model-spec-card-title{font-family:var(--font-display);font-size:1.4rem;font-weight:900;color:var(--secondary);line-height:1}
.model-spec-card-subtitle{font-size:.72rem;font-weight:800;text-transform:uppercase;letter-spacing:.08em;color:var(--muted-fg);margin-top:.35rem}
.model-spec-toggle-icon{flex:0 0 auto;font-size:1.5rem;line-height:1;color:var(--primary);font-weight:900;margin-top:.05rem}
.model-spec-table-wrap{overflow:hidden;border:1px solid rgba(0,0,0,.06);border-radius:1rem}
.model-spec-table{width:100%;border-collapse:separate;border-spacing:0}
.model-spec-table th,.model-spec-table td{padding:.9rem .95rem;text-align:center;font-size:1rem;font-weight:800;line-height:1.3}
.model-spec-table th{font-size:.72rem;text-transform:uppercase;letter-spacing:.08em;color:var(--muted-fg);background:#fff}
.model-spec-table tbody tr + tr td{border-top:1px solid rgba(0,0,0,.08)}
.model-spec-table tbody tr:nth-child(odd) td:nth-child(odd),.model-spec-table tbody tr:nth-child(even) td:nth-child(odd){background:#f2f5ef}
.model-spec-table tbody tr:nth-child(odd) td:nth-child(even),.model-spec-table tbody tr:nth-child(even) td:nth-child(even){background:#e7ece2}
.model-spec-table td{color:#1d1d1d}
.hero-context-note{font-size:1rem;line-height:1.7;color:var(--muted-fg);font-weight:500;margin-top:.25rem}
.two-col-text{display:grid;gap:3rem}
@media(min-width:768px){.two-col-text{grid-template-columns:1fr 1fr}}
.two-col-text-center{align-items:center}

.page-hero{position:relative;min-height:50vh;display:flex;align-items:center;padding:5rem 0 8rem;overflow:hidden}
.page-hero-dark{background:var(--secondary);color:#fff}
.page-hero-dark h1{color:#fff}
.page-hero .hero-bg{opacity:.3;mix-blend-mode:overlay}
.page-hero-img{position:absolute;inset:0;background-size:cover;background-position:center;opacity:.4}
.page-hero-gradient{position:absolute;inset:0;background:linear-gradient(to right,#000,#000,rgba(0,0,0,.7))}
.page-hero h1{font-size:2.5rem;font-weight:900;color:#fff;margin-bottom:1.5rem;text-shadow:2px 2px 8px rgba(0,0,0,.8)}
@media(min-width:640px){.page-hero h1{font-size:3.5rem}}
@media(min-width:768px){.page-hero h1{font-size:4.5rem}}
.page-hero p{font-size:1.125rem;color:rgba(255,255,255,.9);font-weight:500;text-shadow:1px 1px 4px rgba(0,0,0,.8)}
@media(min-width:640px){.page-hero p{font-size:1.5rem}}
.page-hero-center{text-align:center}

.divider{width:5rem;height:4px;background:var(--primary);margin-bottom:1.5rem}
@media(min-width:768px){.divider{width:6rem;height:6px}}
.divider-center{margin-left:auto;margin-right:auto}

/* SECTIONS */
.section{padding:4rem 0}
.section:first-child{padding-top:0}
.section-muted{background:var(--muted)}
.section-white{background:#fff}
.section-dark{background:var(--secondary);color:#fff}
.section-dark h2,.section-dark h3{color:#fff}
.section-primary{background:var(--primary);color:#fff}
.section-primary h2{color:#fff}
.section-center{text-align:center}
.section-title-wrap h2{font-size:clamp(1.75rem,3vw,2.5rem);font-weight:900;letter-spacing:-.02em;margin-bottom:1rem;text-align:center}
.section-title-wrap .divider{margin-top:0.25rem}
.condition-feature{max-width:52rem;margin:0 auto;padding:1.5rem 1.5rem 1.75rem;background:linear-gradient(180deg,rgba(255,255,255,.96),rgba(255,255,255,.9));border:1px solid var(--border);border-radius:1.25rem;box-shadow:0 12px 30px rgba(0,0,0,.06)}
.condition-feature-intro{display:grid;gap:.5rem;text-align:center;margin-bottom:1.25rem}
.condition-feature-kicker{font-family:var(--font-display);font-size:1rem;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:var(--primary)}
.condition-body{font-size:1rem;line-height:1.8;color:var(--muted-fg);font-weight:500}
.condition-feature-grid{display:grid;gap:.9rem}
@media(min-width:768px){.condition-feature-grid{grid-template-columns:repeat(2,1fr);gap:1rem}}
.condition-feature-item{padding:1rem 1rem 1.05rem;border-radius:1rem;background:#fff;border:1px solid rgba(0,0,0,.06);box-shadow:0 6px 16px rgba(0,0,0,.03)}
.condition-feature-item h3{font-size:1rem;line-height:1.35;font-weight:800;color:var(--secondary);margin-bottom:.35rem;text-transform:none;letter-spacing:-.01em}
.condition-feature-item p{font-size:.95rem;line-height:1.65;color:var(--muted-fg);font-weight:500}
.condition-feature-footnote{font-size:1rem;line-height:1.8;color:var(--muted-fg);font-weight:600;margin-top:1.1rem;text-align:center}
.section-copy-left{max-width:44rem;margin:0 auto;text-align:left}
.text-center .section-copy-left .list-group{max-width:none;margin-left:0;margin-right:0}
.text-center .section-copy-left .content-list{max-width:none;margin-left:0;margin-right:0}
.with-sidebar{display:grid;gap:2rem;text-align:left;max-width:56rem;margin:0 auto}
@media(min-width:768px){.with-sidebar{grid-template-columns:1fr 220px;align-items:start;gap:3rem}}
.with-sidebar .main-col{min-width:0}
.with-sidebar .main-col .list-group{max-width:none;margin-left:0;margin-right:0}
.sidebar-card{background:var(--muted);border-top:4px solid var(--primary);padding:1.25rem 1.5rem 1.5rem}
.sidebar-card .list-group{margin-top:0;padding-top:0;border-top:none}
.sidebar-card .content-list{padding-left:1rem}
@media(min-width:768px){.sidebar-card{position:sticky;top:calc(88px + 3rem)}}
.technology-section .container{max-width:72rem!important;display:block}
.technology-columns{display:flex;flex-direction:column;gap:1rem;text-align:left;margin-top:1.75rem;width:100%;max-width:100%;margin-left:auto;margin-right:auto}
.technology-columns .list-group{background:#fff;border:1px solid rgba(0,0,0,.06);border-radius:1rem;padding:1.25rem 1.35rem;box-shadow:0 10px 24px rgba(0,0,0,.04)}
.technology-columns .list-group-label{margin-bottom:.75rem}
.technology-columns .content-list{margin-top:0}
@media(min-width:768px){.technology-columns .list-group{display:flex;gap:2rem;align-items:flex-start;padding:1.4rem 1.6rem;width:100%;max-width:none}.technology-columns .list-group-label{width:14rem;flex:0 0 14rem;margin-bottom:0;padding-top:.2rem;font-size:.82rem}.technology-columns .content-list{flex:1 1 auto;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:2rem;row-gap:.25rem;max-width:none!important;margin-left:0!important;margin-right:0!important}.technology-columns .content-list li{margin:.2rem 0}}
.spec-info-grid{display:grid;gap:1.25rem;text-align:left}
@media(min-width:640px){.spec-info-grid{grid-template-columns:repeat(2,1fr)}}
@media(min-width:1024px){.spec-info-grid{grid-template-columns:repeat(3,minmax(0,1.2fr))}}
.modal-overlay{display:none;position:fixed;inset:0;z-index:100;background:rgba(0,0,0,.6);align-items:center;justify-content:center;padding:1rem}
.modal-overlay.open{display:flex}
.modal{width:min(100%,56rem);max-height:90vh;overflow:auto;background:#fff;border-radius:1rem;box-shadow:0 24px 60px rgba(0,0,0,.25)}
.configurator-modal{width:min(100%,72rem)}
.modal-header{display:flex;align-items:center;justify-content:space-between;padding:1.25rem 1.5rem;border-bottom:1px solid var(--border)}
.modal-header h2{font-size:1.5rem;font-weight:900}
.modal-close{background:none;border:none;font-size:2rem;line-height:1;color:var(--muted-fg);cursor:pointer}
.modal-body{padding:1.5rem}

/* GRIDS */
.grid-2{display:grid;gap:2rem}
@media(min-width:768px){.grid-2{grid-template-columns:repeat(2,1fr);gap:2.5rem}}
@media(min-width:1024px){.grid-2{gap:3rem}}
.grid-3{display:grid;gap:2rem}
@media(min-width:640px){.grid-3{grid-template-columns:repeat(2,1fr);gap:2rem}}
@media(min-width:1024px){.grid-3{grid-template-columns:repeat(3,1fr);gap:2.5rem}}
.grid-4{display:grid;gap:2rem}
@media(min-width:640px){.grid-4{grid-template-columns:repeat(2,1fr);gap:2rem}}
@media(min-width:1024px){.grid-4{grid-template-columns:repeat(4,1fr);gap:2rem}}
.grid-5{display:grid;gap:2rem}
@media(min-width:768px){.grid-5{grid-template-columns:repeat(2,1fr)}}
@media(min-width:1024px){.grid-5{grid-template-columns:repeat(5,1fr)}}
.items-center{align-items:center}

/* Responsive ordering — mobile-first: natural order. Desktop: swap. */
.order-1{order:1}
.order-2{order:2}
@media(min-width:768px){
  .md-order-1{order:1!important}
  .md-order-2{order:2!important}
}

/* CARDS */
.card{background:var(--card);border:1px solid var(--border);overflow:hidden;transition:border-color .3s}
.card:hover{border-color:rgba(74,140,28,.5)}
.card-content{padding:1.5rem}
@media(min-width:768px){.card-content{padding:2rem}}

/* VALUE PROPS */
.value-card{padding:2rem;border:1px solid var(--border);background:var(--card);transition:border-color .3s;display:flex;flex-direction:column}
@media(min-width:768px){.value-card{padding:2.5rem}}
.value-card:hover{border-color:rgba(74,140,28,.5)}
.value-icon{display:inline-flex;padding:1rem;border-radius:50%;background:var(--muted);margin-bottom:1.5rem;transition:background .3s;align-items:center;justify-content:center;width:fit-content}
@media(min-width:768px){.value-icon{padding:1.25rem;margin-bottom:2rem}}
.value-card:hover .value-icon{background:rgba(74,140,28,.1)}
.value-icon svg{width:28px;height:28px;color:var(--primary)}
@media(min-width:768px){.value-icon svg{width:36px;height:36px}}
.value-card h4{font-size:clamp(1.125rem,2vw,1.375rem);font-weight:700;margin-bottom:1rem;letter-spacing:.05em;text-transform:uppercase}
.value-card p{color:var(--muted-fg);font-weight:500;font-size:clamp(.875rem,1.5vw,1rem);line-height:1.6}

/* STATS */
.stat-card{background:rgba(255,255,255,.05);padding:1.5rem;border:1px solid rgba(255,255,255,.1);text-align:center}
@media(min-width:768px){.stat-card{padding:2rem}}
.stat-number{font-size:2rem;font-weight:900;color:var(--primary);margin-bottom:.5rem;font-family:var(--font-display)}
@media(min-width:768px){.stat-number{font-size:3rem}}
.stat-label{font-family:var(--font-display);font-weight:700;font-size:.6875rem;text-transform:uppercase;letter-spacing:.1em;color:rgba(255,255,255,.8)}
@media(min-width:768px){.stat-label{font-size:.875rem}}

/* FEATURE LIST */
.feature-check{display:flex;align-items:flex-start;gap:.75rem;margin-bottom:.75rem}
.feature-check .check{color:var(--primary);font-weight:700;flex-shrink:0}
.feature-check span{color:var(--muted-fg);font-weight:500}

/* PRODUCT STRIPS */
.product-img{width:100%;height:100%;object-fit:cover;box-shadow:0 4px 12px rgba(0,0,0,.1)}
.product-img-overlay{position:relative;overflow:hidden;box-shadow:0 4px 12px rgba(0,0,0,.1)}
.product-img-overlay::after{content:'';position:absolute;inset:0;background:rgba(0,0,0,.4);z-index:1}
.product-img-overlay img{filter:grayscale(1);width:100%;height:100%;object-fit:cover}
.product-badge{display:inline-block;background:var(--primary);color:#fff;font-family:var(--font-display);font-weight:900;text-transform:uppercase;font-size:.875rem;letter-spacing:.1em;padding:.5rem 1rem;margin-bottom:1rem}

/* SECTION NAV (Spyder sticky pill-bar) */
.section-nav{position:sticky;top:64px;z-index:40;background:#fff;border-bottom:1px solid var(--border);box-shadow:0 2px 8px rgba(0,0,0,.06)}
@media(min-width:1024px){.section-nav{top:88px}}
.section-nav-inner{display:flex;align-items:center;gap:.25rem;overflow-x:auto;scrollbar-width:none;-ms-overflow-style:none;padding:.5rem 1rem;max-width:1200px;margin:0 auto}
.section-nav-inner::-webkit-scrollbar{display:none}
.section-nav-pill{flex-shrink:0;font-family:var(--font-display);font-size:.72rem;font-weight:700;text-transform:uppercase;letter-spacing:.08em;color:hsl(0,0%,40%);padding:.4rem .9rem;border-radius:999px;border:1px solid transparent;transition:color .15s,background .15s,border-color .15s;white-space:nowrap;background:none}
.section-nav-pill:hover,.section-nav-pill.active{color:var(--primary);border-color:rgba(74,140,28,.3)}
.section-nav-pill.active{background:var(--primary);color:#fff;border-color:var(--primary)}
.spyder-page .section-nav + .section,
.spyder-page .section-nav + section{padding-top:4rem}
@media(min-width:1024px){.spyder-page .section-nav + .section,.spyder-page .section-nav + section{padding-top:4.75rem}}

.feature-cards{display:flex;flex-direction:column;width:100%;max-width:80rem;margin:0 auto;background:#fff}
.feature-card{padding:3rem 2rem;border-bottom:1px solid var(--border);background:#fff;width:100%}
.feature-card:last-child{border-bottom:none}
.feature-card .grid-2{display:flex;flex-direction:column;gap:2rem;align-items:center;width:100%}
.feature-card .grid-2>div{min-width:0;width:100%}
@media(min-width:768px){.feature-card .grid-2{flex-direction:row;gap:2.5rem}.feature-card.feature-card-alt .grid-2{flex-direction:row-reverse}}

/* FEATURE CARD CAROUSEL */
.fc-carousel{position:relative;overflow:hidden}
.fc-carousel-track{display:flex;flex-wrap:nowrap;transition:transform .4s ease;will-change:transform}
.fc-carousel-slide{min-width:100%;flex:0 0 100%;overflow:hidden}
.fc-carousel-slide img{width:100%;height:100%;display:block;aspect-ratio:16/9;object-fit:cover}
.fc-carousel-btn{position:absolute;top:50%;transform:translateY(-50%);background:rgba(0,0,0,.7);border:2px solid rgba(255,255,255,.9);color:#fff;width:44px;height:44px;display:flex;align-items:center;justify-content:center;cursor:pointer;z-index:2;border-radius:999px;transition:background .2s,transform .2s,opacity .2s;padding:0;box-shadow:0 6px 18px rgba(0,0,0,.35)}
.fc-carousel-btn:hover{background:rgba(0,0,0,.92);transform:translateY(-50%) scale(1.04)}
.fc-carousel-btn svg{width:20px;height:20px;flex-shrink:0}
.fc-carousel-prev{left:.75rem}
.fc-carousel-next{right:.75rem}
.fc-carousel-dots{position:absolute;bottom:.75rem;left:50%;transform:translateX(-50%);display:flex;gap:.5rem;z-index:2;background:rgba(0,0,0,.35);padding:.35rem .6rem;border-radius:999px}
.fc-carousel-dot{width:10px;height:10px;border-radius:50%;background:rgba(255,255,255,.55);border:1px solid rgba(255,255,255,.5);cursor:pointer;padding:0;transition:all .15s}
.fc-carousel-dot.active{background:#fff;width:12px;height:12px;border-color:#fff;box-shadow:0 0 0 2px rgba(255,255,255,.18)}

/* FEATURE STRIPS (Spyder page) */
.feature-strip{padding:2.5rem 0}
@media(min-width:768px){.feature-strip{padding:3.5rem 0}}
.feature-card .feature-img{width:100%;height:auto;max-height:320px;object-fit:cover;display:block}
.serviceability-image-wrap .feature-img{border:0;max-height:none;background:#fff}

/* CONFIGURATOR MODAL */
.modal-overlay{display:none;position:fixed;inset:0;background:rgba(0,0,0,.5);z-index:999999;align-items:center;justify-content:center;padding:1rem;overflow:hidden}
.modal-overlay.open{display:flex}
.modal{background:#fff;max-width:56rem;width:100%;max-height:90vh;overflow:hidden;border:1px solid var(--border);box-shadow:0 20px 60px rgba(0,0,0,.3);display:flex;flex-direction:column;color:var(--fg)}
.modal-header{display:flex;justify-content:space-between;align-items:center;padding:1.5rem;border-bottom:1px solid var(--border)}
.modal-header h2{font-size:1.75rem;font-weight:900}
.modal-close{background:none;border:none;font-size:1.5rem;cursor:pointer;padding:.5rem}
.modal-body{padding:1.5rem;overflow-y:auto;overscroll-behavior:contain;color:var(--fg)}
.config-grid{display:grid;gap:2rem;grid-template-columns:1fr}
@media(min-width:768px){.config-grid{grid-template-columns:1fr 1fr}}
.config-options{background:var(--card);padding:2rem;border:1px solid var(--border);box-shadow:0 4px 12px rgba(0,0,0,.08);color:var(--fg)}
.config-options h3{color:var(--fg)}
.config-summary{background:var(--primary);color:#fff;padding:2rem;border:4px solid var(--primary);box-shadow:0 10px 30px rgba(0,0,0,.15);display:flex;flex-direction:column;justify-content:space-between}
.config-label{display:block;font-size:.75rem;font-weight:700;text-transform:uppercase;color:var(--muted-fg);margin-bottom:.75rem}
.config-select{width:100%;padding:.75rem;border:2px solid var(--border);background:var(--bg);font-weight:500;cursor:pointer;font-size:1rem;color:var(--fg)}
.config-select:hover,.config-select:focus{border-color:var(--primary);outline:none}
.config-row{display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid rgba(255,255,255,.2);padding-bottom:.75rem;margin-bottom:.75rem}
.config-row span:first-child{font-weight:500}
.config-row span:last-child{font-weight:700;font-size:1.25rem}
.spec-info-grid{display:grid;gap:1.25rem;text-align:left}
@media(min-width:640px){.spec-info-grid{grid-template-columns:repeat(2,1fr)}}
@media(min-width:1024px){.spec-info-grid{grid-template-columns:repeat(3,1fr)}}
.spec-info-card--wide{grid-column:1/-1}
@media(min-width:1024px){.spec-info-card--wide{grid-column:span 2}}
.monitor-keypad-grid .spec-info-card--wide{grid-column:1/-1}
@media(min-width:1024px){.monitor-keypad-grid{grid-template-columns:repeat(3,1fr)}.monitor-keypad-grid .spec-info-card--wide{grid-column:span 2}}
.spec-info-card{background:#fff;border:1px solid var(--border);border-radius:1rem;padding:1.5rem;display:flex;flex-direction:column;gap:.75rem}
.spec-info-icon{display:inline-flex;align-items:center;justify-content:center;width:2.5rem;height:2.5rem;border-radius:.6rem;background:rgba(74,140,28,.1);color:var(--primary);flex-shrink:0}
.spec-info-heading{font-family:var(--font-display);font-size:.8rem;font-weight:900;text-transform:uppercase;letter-spacing:.08em;color:var(--secondary)}
.spec-info-list{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:.5rem}
.spec-info-list li{display:flex;align-items:baseline;gap:.6rem;font-size:.9375rem;font-weight:500;color:var(--muted-fg);line-height:1.5}
.spec-info-list li::before{content:'';display:block;width:.45rem;height:.45rem;border-radius:50%;background:var(--primary);flex-shrink:0;margin-top:.4rem}
.config-hp-box{background:rgba(0,0,0,.3);padding:1.5rem;border:2px solid var(--primary);text-align:center;margin:1.5rem 0}
.config-hp-label{font-size:.75rem;text-transform:uppercase;letter-spacing:.1em;color:rgba(255,255,255,.8);margin-bottom:.5rem}
.config-hp-value{font-size:3rem;font-weight:900;font-family:var(--font-display);color:#fff}
.config-summary h3{font-size:1.5rem;font-weight:700;margin-bottom:2rem;color:#fff}
@media(max-width:767px){
  .modal{max-height:100dvh;width:100%;height:100dvh;margin:0;padding:0;border-radius:0;overflow:hidden}
  .modal-header{padding:1rem}
  .modal-header h2{font-size:1.35rem}
  .modal-body{padding:0 0 1rem;overflow-y:auto;overflow-x:hidden;flex:1 1 auto;-webkit-overflow-scrolling:touch}
  .config-grid{gap:0;grid-template-columns:1fr;min-width:0}
  .config-options,.config-summary{padding:1rem;min-width:0}
  .config-options{order:1}
  .config-summary{order:2}
  .config-options,.config-summary{min-height:0}
  .config-summary h3{margin-bottom:1rem;font-size:1.2rem}
  .config-options h3{font-size:1.25rem !important;margin-bottom:1rem !important}
  .config-select{padding:.65rem .85rem;font-size:.95rem}
  .config-hp-box{margin:1rem 0;padding:1rem}
  .config-hp-value{font-size:2.25rem}
  .config-row{gap:.5rem}
  .config-row span:last-child{font-size:1rem}
  .upgrade-item{padding:.6rem}
  .upgrade-desc{margin:0 .5rem .5rem;padding:.85rem}
  .spec-info-grid{grid-template-columns:1fr;gap:.85rem}
  .spec-info-card{padding:1rem;border-radius:.85rem}
  .spec-info-heading{font-size:.72rem}
  .spec-info-list li{font-size:.9rem}
  .model-spec-table-wrap{overflow-x:auto;-webkit-overflow-scrolling:touch;border-radius:.85rem}
  .model-spec-table,.hp-compare-table{font-size:.72rem;min-width:720px}
  .model-spec-table th,.model-spec-table td,.hp-compare-table th,.hp-compare-table td{padding:.45rem .35rem;white-space:nowrap}
  .hp-compare-table-wrap::-webkit-scrollbar,.model-spec-table-wrap::-webkit-scrollbar{height:.7rem}
  .hp-compare-table-wrap::-webkit-scrollbar-track,.model-spec-table-wrap::-webkit-scrollbar-track{background:rgba(0,0,0,.08)}
  .hp-compare-table-wrap::-webkit-scrollbar-thumb,.model-spec-table-wrap::-webkit-scrollbar-thumb{background:rgba(0,0,0,.55);border-radius:999px}
  .hp-compare-table-wrap,.model-spec-table-wrap{scrollbar-width:thin;scrollbar-color:rgba(0,0,0,.55) rgba(0,0,0,.08)}
  .section-copy-left{max-width:none;padding:0 1rem}
  .section-copy-left .sidebar-card{padding-left:1rem;padding-right:1rem}
  .quote-modal{max-width:100%;width:100%;max-height:100dvh;height:100dvh;overflow:hidden}
  .quote-modal-overlay{padding:0;overflow:hidden}
  .quote-body{max-width:100%;overflow-y:auto;overflow-x:hidden;-webkit-overflow-scrolling:touch}
}
.upgrade-item{display:flex;align-items:center;gap:.75rem;cursor:pointer;padding:.75rem;transition:background .2s}
.upgrade-item:hover{background:var(--muted)}
.upgrade-item input[type="checkbox"]{width:1.25rem;height:1.25rem;accent-color:var(--primary)}
.upgrade-item label{flex:1;font-weight:500;cursor:pointer}
.upgrade-info-btn{background:none;border:none;cursor:pointer;padding:.25rem;border-radius:50%;transition:background .2s;color:var(--primary)}
.upgrade-info-btn:hover{background:rgba(74,140,28,.1)}
.upgrade-info-btn svg{width:20px;height:20px}
.upgrade-desc{margin:0 .75rem .75rem;padding:1rem;background:rgba(74,140,28,.05);border-left:4px solid var(--primary);font-size:.875rem;line-height:1.6;display:none}
.upgrade-desc.open{display:block}

/* QUOTE MODAL */
.quote-modal-overlay{display:none;position:fixed;inset:0;background:rgba(0,0,0,.5);z-index:200;align-items:center;justify-content:center;padding:1rem}
.quote-modal-overlay.open{display:flex}
.quote-modal{background:var(--card);max-width:42rem;width:100%;max-height:90vh;overflow-y:auto;border:1px solid var(--border);box-shadow:0 20px 60px rgba(0,0,0,.3)}
.quote-header{position:sticky;top:0;background:var(--primary);color:#fff;padding:1.5rem;display:flex;justify-content:space-between;align-items:center;z-index:1}
.quote-header h2{font-size:1.5rem;font-weight:900}
.quote-close{background:none;border:none;color:#fff;font-size:1.5rem;cursor:pointer;padding:.25rem}
.quote-body{padding:2rem}
.quote-summary{background:var(--muted);padding:1rem;border:1px solid var(--border);margin-bottom:1.5rem}
.quote-summary .config-row{border-color:var(--border);color:var(--fg)}
.quote-summary .config-row span:last-child{color:var(--fg)}
.thank-you{padding:3rem;text-align:center;min-height:300px;display:flex;flex-direction:column;align-items:center;justify-content:center}
.thank-you .big-check{font-size:4rem;margin-bottom:1.5rem;color:var(--primary)}
.thank-you h3{font-size:2rem;font-weight:900;margin-bottom:1rem}
.thank-you p{font-size:1.125rem;color:var(--muted-fg)}

/* FORMS */
.form-group{margin-bottom:1.25rem}
.form-label{display:block;font-weight:700;text-transform:uppercase;font-size:.75rem;color:var(--muted-fg);margin-bottom:.5rem}
.form-input,.form-select,.form-textarea{width:100%;padding:.75rem 1rem;border:2px solid var(--border);background:#fff;font-size:1rem;font-weight:500;transition:border-color .2s}
.form-input:focus,.form-select:focus,.form-textarea:focus{border-color:var(--primary);outline:none}
.form-textarea{min-height:150px;resize:vertical}
.form-grid-2{display:grid;gap:1rem}
@media(min-width:640px){.form-grid-2{grid-template-columns:1fr 1fr}}
.form-checkbox{display:flex;align-items:center;gap:.5rem;cursor:pointer}
.form-checkbox input{width:1.25rem;height:1.25rem;accent-color:var(--primary)}
.form-hint{font-size:.625rem;color:var(--muted-fg);text-align:center;margin-top:1rem}
@media(min-width:640px){.form-hint{font-size:.75rem}}
.form-section-title{font-size:1.25rem;font-weight:900;text-transform:uppercase;border-bottom:1px solid var(--border);padding-bottom:.5rem;color:var(--primary);margin-bottom:1.5rem}
@media(min-width:768px){.form-section-title{font-size:1.5rem}}
.form-card{background:var(--card);border:1px solid var(--border);box-shadow:0 10px 40px rgba(0,0,0,.08);padding:1.5rem;position:relative;overflow:hidden}
@media(min-width:640px){.form-card{padding:2rem}}
@media(min-width:768px){.form-card{padding:3rem}}
.form-success{text-align:center;padding:3rem 0}
.form-success svg{width:64px;height:64px;color:var(--primary);margin:0 auto 1.5rem}

/* CONTACT INFO */
.contact-info-item{display:flex;align-items:flex-start;gap:1rem;color:var(--muted-fg);font-weight:500;margin-bottom:1rem}
.contact-info-item svg{width:20px;height:20px;color:var(--primary);flex-shrink:0;margin-top:.25rem}
@media(min-width:768px){.contact-info-item svg{width:24px;height:24px}}
.contact-section{margin-bottom:2rem;padding-bottom:2rem;border-bottom:1px solid var(--border)}
.contact-section:last-child{border-bottom:none}

/* DEALER MAP */
.map-container{width:100%;height:350px;border:1px solid var(--border);box-shadow:0 4px 12px rgba(0,0,0,.08);overflow:hidden;margin-bottom:3rem}
@media(min-width:768px){.map-container{height:500px;margin-bottom:4rem}}
.dealer-card{padding:1.5rem;background:var(--card);border:1px solid var(--border);box-shadow:0 2px 6px rgba(0,0,0,.04);transition:border-color .3s}
.dealer-card:hover{border-color:rgba(74,140,28,.5)}
.dealer-card h3{font-size:1.25rem;font-weight:700;color:var(--primary);margin-bottom:1rem;text-transform:none}
.dealer-info{display:flex;align-items:center;gap:.75rem;color:var(--muted-fg);font-weight:500;margin-bottom:.75rem;font-size:.875rem}
.dealer-info svg{width:18px;height:18px;color:var(--fg);flex-shrink:0}
.dealer-info a{transition:color .2s}
.dealer-info a:hover{color:var(--primary)}
.region-title{font-size:1.125rem;font-weight:700;text-transform:uppercase;letter-spacing:.05em;margin-bottom:1rem;padding-left:.25rem}
.country-title{font-size:1.25rem;font-weight:700;text-transform:uppercase;letter-spacing:.05em;color:var(--primary);margin-bottom:1.5rem;border-bottom:2px solid var(--primary);padding-bottom:.5rem}

/* RESOURCES */
.search-bar{display:flex;align-items:center;gap:.75rem;max-width:28rem;margin:0 auto 2rem}
.search-bar svg{color:var(--muted-fg);flex-shrink:0}
.search-bar input{flex:1;padding:.5rem 1rem;border:2px solid var(--border);background:#fff}
.search-bar input:focus{border-color:var(--primary);outline:none}
.filter-btns{display:flex;flex-wrap:wrap;gap:1rem;justify-content:center;margin-bottom:2rem}
.filter-btn{font-family:var(--font-display);font-weight:700;text-transform:uppercase;padding:.5rem 1.25rem;border:2px solid var(--border);background:var(--muted);cursor:pointer;transition:all .2s;font-size:.875rem}
.filter-btn:hover{border-color:var(--primary)}
.filter-btn.active{background:var(--primary);color:#fff;border-color:var(--primary)}
.resource-card{padding:1.5rem;border:1px solid var(--border);background:var(--muted);display:flex;align-items:flex-start;gap:1rem;transition:border-color .3s,background .3s}
.resource-card:hover{background:var(--card);border-color:rgba(74,140,28,.5)}
.resource-icon{width:40px;height:40px;background:rgba(74,140,28,.1);display:flex;align-items:center;justify-content:center;flex-shrink:0;border-radius:4px}
.resource-icon svg{width:20px;height:20px;color:var(--primary)}
.resource-title{font-weight:700;margin-bottom:.25rem}
.resource-meta{font-size:.8125rem;color:var(--muted-fg)}
.resource-tags{display:flex;flex-wrap:wrap;gap:.5rem;margin-top:.5rem}
.resource-tag{font-size:.6875rem;font-weight:600;text-transform:uppercase;padding:.125rem .5rem;background:rgba(74,140,28,.1);color:var(--primary);border-radius:9999px}
.resource-group{margin-bottom:3rem}
.resource-group-header{font-family:var(--font-display);font-weight:800;text-transform:uppercase;font-size:1.25rem;letter-spacing:.02em;margin-bottom:1rem;padding-bottom:.5rem;border-bottom:2px solid var(--primary);color:var(--secondary)}
.resource-row{display:flex;flex-wrap:wrap;gap:1rem;align-items:stretch}
.resource-row .resource-card{flex:1 1 280px;max-width:320px;min-width:260px;flex-direction:column;align-items:flex-start;padding:1.25rem}
.resource-row .resource-card a{flex:1;display:flex;flex-direction:column;gap:0.75rem}
.resource-row .resource-card .resource-title{font-size:0.9375rem;line-height:1.4}
.resource-row .resource-card .resource-meta{margin-top:auto}
.resource-see-more{display:flex;align-items:center;justify-content:center;flex:1 1 280px;max-width:320px;min-width:260px;min-height:120px;border:2px dashed var(--border);background:var(--muted);cursor:pointer;transition:all .3s;font-family:var(--font-display);font-weight:700;text-transform:uppercase;font-size:0.875rem;letter-spacing:0.05em;color:var(--primary);gap:0.5rem}
.resource-see-more:hover{border-color:var(--primary);background:rgba(74,140,28,.05)}
.resource-see-more svg{width:18px;height:18px;transition:transform .3s}
.resource-see-more.expanded svg{transform:rotate(180deg)}
.resource-row.expanded .resource-card{display:flex!important}
.resource-row:not(.expanded) .resource-card:nth-child(n+5){display:none}

/* WHY K-HART VALUES CARDS */
.values-card{padding:2rem;border:1px solid var(--border);background:var(--bg);transition:transform .3s}
.values-card:hover{transform:translateY(-.5rem)}
.values-card svg{width:48px;height:48px;color:var(--primary);margin-bottom:1.5rem}
.values-card h3{font-size:1.25rem;font-weight:700;margin-bottom:.75rem}
.values-card p{color:var(--muted-fg);font-weight:500}

/* TIMELINE */
.timeline{position:relative;max-width:72rem;margin:0 auto;overflow-x:auto;padding-bottom:1rem}
.timeline-line{position:absolute;left:0;right:0;top:28px;height:4px;background:rgba(74,140,28,.6)}
.timeline-items{display:flex;gap:1rem;position:relative;z-index:1;min-width:max-content}
@media(min-width:768px){.timeline-items{min-width:0}}
.timeline-item{flex:1;cursor:pointer;min-width:140px}
@media(min-width:768px){.timeline-item{min-width:0}}
.timeline-year{font-size:.875rem;font-weight:900;color:var(--primary);margin-bottom:.25rem}
.timeline-dot{width:16px;height:16px;background:var(--primary);border-radius:50%;border:4px solid var(--bg);box-shadow:0 2px 6px rgba(0,0,0,.15);margin-bottom:.5rem}
.timeline-item h3{font-size:.875rem;font-weight:700;text-transform:uppercase;line-height:1.3}
.timeline-desc{max-height:0;overflow:hidden;transition:max-height .3s;font-size:.75rem;color:var(--muted-fg);line-height:1.5;margin-top:.25rem}
.timeline-item:hover .timeline-desc{max-height:10rem}

/* TIMELINE MOSAIC BACKDROP */
.timeline-mosaic-section{position:relative;background:#111}
.timeline-mosaic{position:absolute;inset:0;overflow:hidden;display:grid;grid-template-columns:repeat(2,1fr);grid-template-rows:repeat(4,1fr);gap:2px;pointer-events:none;background:#111}
.timeline-mosaic>img{width:100%;height:100%;object-fit:cover;filter:saturate(.55) brightness(.75);display:block}
@media(min-width:768px){.timeline-mosaic{grid-template-columns:repeat(4,1fr);grid-template-rows:repeat(2,1fr);gap:0}}
@media(max-width:480px){.timeline-mosaic{grid-template-columns:1fr;grid-template-rows:repeat(8,1fr);gap:0}}
.timeline-mosaic-overlay{position:absolute;inset:0;background:rgba(0,0,0,.48);pointer-events:none}
.timeline-mosaic-section .timeline-line{top:32px}
.timeline-mosaic-section .timeline-dot{border-color:rgba(0,0,0,.5)}
.timeline-mosaic-section .timeline-item{background:transparent;border-radius:4px;padding:0 .5rem .75rem;transition:background .25s}
.timeline-mosaic-section .timeline-item:hover{background:rgba(0,0,0,.78)}
.timeline-mosaic-section .timeline-item h3{color:#fff}
.timeline-mosaic-section .timeline-desc{color:rgba(255,255,255,.85)}

/* SPEC TABLE */
.spec-table{background:var(--card);box-shadow:0 10px 40px rgba(0,0,0,.08);border:1px solid var(--border)}
.spec-row{display:grid;grid-template-columns:1fr 1fr;padding:1rem 1.5rem;border-bottom:1px solid var(--border);transition:background .2s}
.spec-row:last-child{border-bottom:none}
.spec-row:hover{background:rgba(0,0,0,.03)}
.spec-row:nth-child(even){background:rgba(0,0,0,.02)}
.spec-row:nth-child(even):hover{background:rgba(0,0,0,.04)}
.spec-label{font-weight:700;text-transform:uppercase;color:var(--muted-fg);font-size:.875rem}
.spec-value{text-align:right;font-weight:500}

/* REGISTRATION BANNER */
.reg-banner{background:var(--secondary);color:#fff;padding:1.5rem;display:flex;flex-direction:column;gap:1.5rem;box-shadow:0 10px 40px rgba(0,0,0,.2);position:relative;overflow:hidden}
@media(min-width:640px){.reg-banner{padding:2rem}}
@media(min-width:768px){.reg-banner{flex-direction:row;align-items:center;justify-content:space-between;padding:3rem}}
.reg-banner h3{font-family:var(--font-display);font-size:1.5rem;font-weight:700;text-transform:uppercase;letter-spacing:.05em;color:#fff}
@media(min-width:640px){.reg-banner h3{font-size:1.75rem}}
.reg-banner p{color:rgba(255,255,255,.8);font-weight:500;max-width:42rem;font-size:1rem}
@media(min-width:640px){.reg-banner p{font-size:1.125rem}}

/* PRODUCT CARD (Home page) */
.product-card{box-shadow:0 20px 60px rgba(0,0,0,.12);overflow:hidden;display:flex;flex-direction:column;transition:box-shadow .3s}
.product-card:hover{box-shadow:0 25px 70px rgba(0,0,0,.15)}
.product-card-img{aspect-ratio:21/9;overflow:hidden;position:relative;background:var(--muted)}
.product-card-img img{width:100%;height:100%;object-fit:cover;transition:transform .7s}
.product-card:hover .product-card-img img{transform:scale(1.05)}
.product-card-img::after{content:'';position:absolute;inset:0;background:rgba(0,0,0,.2);transition:background .3s}
.product-card:hover .product-card-img::after{background:rgba(0,0,0,.1)}
.product-card-body{padding:2rem;background:var(--card);display:flex;flex-direction:column;gap:2rem;position:relative}
@media(min-width:768px){.product-card-body{padding:3rem;gap:2.5rem}}
.product-card-badge{position:absolute;top:0;right:1.5rem;transform:translateY(-50%);background:var(--primary);color:#fff;padding:.5rem .75rem;border-radius:50%;box-shadow:0 4px 12px rgba(0,0,0,.15);display:flex;align-items:center;justify-content:center}
@media(min-width:640px){.product-card-badge{right:2rem;padding:.75rem}}
@media(min-width:768px){.product-card-badge{right:2.5rem}}

/* VIDEO */
.video-wrapper{max-width:64rem;margin:0 auto;background:#000;aspect-ratio:16/9;position:relative;overflow:hidden;box-shadow:0 10px 40px rgba(0,0,0,.2)}
.video-wrapper iframe{position:absolute;inset:0;width:100%;height:100%}

/* BLOCKQUOTE */
.testimonial{font-size:1.25rem;font-weight:500;font-style:italic;line-height:1.6;border-left:4px solid var(--primary);padding-left:1.5rem;margin-bottom:2rem}
@media(min-width:768px){.testimonial{font-size:1.5rem}}
.testimonial-author{color:var(--primary);font-weight:700;font-style:normal;font-family:var(--font-display);text-transform:uppercase;letter-spacing:.05em;margin-top:1rem;display:block;font-size:.875rem}
@media(min-width:768px){.testimonial-author{font-size:1rem}}

/* TESTIMONIAL CAROUSEL */
.testimonial-carousel{margin-bottom:2rem}
.testimonial-track{position:relative;overflow:hidden}
.testimonial-slide{display:none;opacity:0;transition:opacity .4s}
.testimonial-slide.active{display:block;opacity:1}
.testimonial-controls{display:flex;align-items:center;justify-content:center;gap:2rem;margin-top:2rem}
.carousel-btn{background:none;border:none;color:#fff;cursor:pointer;padding:.5rem;transition:opacity .2s;display:flex;align-items:center;justify-content:center}
.carousel-btn:hover{opacity:.7}
.carousel-btn svg{width:24px;height:24px}
.carousel-dots{display:flex;gap:.75rem;justify-content:center;margin:1.5rem 0;position:relative;z-index:10}
.carousel-dot{width:6px;height:6px;border-radius:50%;background:#888;cursor:pointer;transition:all .2s;border:none;padding:0;display:inline-block}
.carousel-dot.active{background:#bbb;box-shadow:0 0 4px rgba(255,255,255,.3);width:8px;height:8px}
.carousel-dot:hover{background:#aaa}

/* OPENER FEATURES */
.opener-feature{display:flex;align-items:flex-start;gap:.75rem;padding:1rem;background:var(--card);border:1px solid var(--border)}
.opener-feature .check{color:var(--primary);font-weight:700;font-size:1.125rem;flex-shrink:0;margin-top:.125rem}

/* PACKER OPTIONS */
.packer-option{padding:1.5rem;background:var(--muted);border:1px solid var(--border);text-align:center;font-family:var(--font-display);font-weight:700;text-transform:uppercase;font-size:1.125rem}

/* UTILITIES */
.text-center{text-align:center}
.text-primary{color:var(--primary)}
.text-muted{color:var(--muted-fg)}
.text-white{color:#fff}
.font-bold{font-weight:700}
.font-black{font-weight:900}
.font-medium{font-weight:500}
.uppercase{text-transform:uppercase}
.mb-2{margin-bottom:.5rem}
.mb-4{margin-bottom:1rem}
.mb-6{margin-bottom:1.5rem}
.mb-8{margin-bottom:2rem}
.mb-12{margin-bottom:3rem}
.mb-16{margin-bottom:4rem}
.mt-4{margin-top:1rem}
.mt-8{margin-top:2rem}
.mx-auto{margin-left:auto;margin-right:auto}
.max-w-3xl{max-width:48rem}
.max-w-4xl{max-width:56rem}
.max-w-5xl{max-width:64rem}
.max-w-6xl{max-width:72rem}
.hidden{display:none}
.gap-4{gap:1rem}
.gap-6{gap:1.5rem}
.shrink-0{flex-shrink:0}

/* Leaflet overrides */
.leaflet-container{font-family:var(--font-body)!important}
