/* XBT Outdoors Base Styles */
:root{
  --color-gunmetal:#2C3539;
  --color-desert:#D4B996;
  --color-orange:#D85E2A;
  --color-offwhite:#F7F7F7;
  --color-body-bg:var(--color-offwhite);
  --color-text:var(--color-gunmetal);
  --radius:12px;
  --shadow:0 6px 20px rgba(0,0,0,.08);
}
@media (prefers-color-scheme: dark){
  :root{
    --color-body-bg:#202528;
    --color-text:#F5F5F5;
  }
}
*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{
  font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial; 
  color:var(--color-text);
  background:var(--color-body-bg);
  line-height:1.6;
}
img{max-width:100%;height:auto;display:block}
.container{width:min(1100px,90%);margin:0 auto}
.visually-hidden{position:absolute !important;left:-9999px !important}
.skip-link{position:absolute;left:-9999px;top:auto;z-index:999;background:#000;color:#fff;padding:8px 12px}
.skip-link:focus{left:12px;top:12px}

/* Header */
.site-header{position:sticky;top:0;z-index:50;background:var(--color-body-bg);backdrop-filter:saturate(180%) blur(8px)}
.header-inner{display:flex;align-items:center;justify-content:space-between;padding:14px 0}
.logo img{height:40px;width:auto}
.primary-nav ul{display:flex;gap:18px;list-style:none;margin:0;padding:0}
.primary-nav a{color:var(--color-text);text-decoration:none;font-weight:600}
.nav-toggle{display:none;background:none;border:0;cursor:pointer}
.nav-toggle-bar{display:block;width:22px;height:2px;background:var(--color-text);margin:4px 0}
@media (max-width: 760px){
  .nav-toggle{display:block}
  .primary-nav{position:absolute;inset:60px 0 auto 0;background:var(--color-body-bg);border-top:1px solid rgba(0,0,0,.06);display:none}
  .primary-nav.open{display:block}
  .primary-nav ul{flex-direction:column;padding:12px 20px}
}

/* Buttons */
.btn{display:inline-block;padding:12px 18px;border-radius:999px;text-decoration:none;font-weight:700;transition:.2s box-shadow,.2s transform}
.btn:hover{box-shadow:var(--shadow);transform:translateY(-1px)}
.btn-primary{background:var(--color-orange);color:var(--color-gunmetal)}
.btn-ghost{border:2px solid var(--color-gunmetal);color:var(--color-gunmetal);background:transparent}
.cta{background:var(--color-orange);color:var(--color-gunmetal);padding:8px 14px;border-radius:999px}

/* Hero */
.hero{position:relative;color:var(--color-text)}
.hero-bg{position:absolute;inset:0;background:
  linear-gradient(to bottom, rgba(0,0,0,.35), rgba(0,0,0,.25)), 
  image-set(
    url('assets/images/hero/hero1-2x1-1024x512.jpg') 1x,
    url('assets/images/hero/hero1-2x1-2048x1024.jpg') 2x
  );
  background-size:cover;background-position:center;filter:saturate(.95);}
.hero-inner{position:relative;padding:64px 0 80px}
.hero h1{font-family:'Roboto Condensed',Inter,Arial,sans-serif;font-size:clamp(32px,6vw,56px);line-height:1.05;margin:0 0 12px}
.hero p{max-width:760px;margin:0 0 18px;font-size:clamp(16px,2.6vw,18px);color:#fff}
.hero .btn{margin-right:10px}
.hero :is(h1,p){color:#fff}

/* Sections */
.section{padding:56px 0}
.section.alt{background:var(--color-desert)}
.section-title{font-family:'Roboto Condensed',Inter,Arial,sans-serif;font-size:clamp(24px,3.6vw,34px);margin:0 0 18px}
.grid.two{display:grid;grid-template-columns:1fr;gap:18px}
.grid.three{display:grid;grid-template-columns:1fr;gap:18px}
@media (min-width: 760px){
  .grid.two{grid-template-columns:1fr 1fr}
  .grid.three{grid-template-columns:repeat(3,1fr)}
}
.card{background:#fff;border-radius:var(--radius);padding:20px;box-shadow:var(--shadow)}
@media (prefers-color-scheme: dark){.card{background:#1b1f22}}
.product h3{margin:10px 0 6px}

/* Form */
:root{ --field-h:52px; --field-gap:12px }
.form-grid{display:grid;grid-template-columns:1fr;gap:var(--field-gap)}
@media (min-width:760px){.form-grid{grid-template-columns:1fr 1fr}}
.form-grid .left{display:grid;gap:var(--field-gap)}
.field{display:flex;flex-direction:column;gap:8px}
.field input,.field textarea{padding:12px;border-radius:10px;border:1px solid rgba(0,0,0,.12);background:#fff;color:#111;font-size:16px;height:var(--field-h)}
.field textarea{resize:vertical;height:auto;min-height:calc(var(--field-h)*3 + var(--field-gap)*2)}
@media (prefers-color-scheme: dark){
  .field input,.field textarea{background:#101417;border-color:#333;color:#f2f2f2}
}
.form-actions{display:flex;justify-content:center;margin-top:14px}
.form-status{margin-top:10px;font-weight:600}

/* Footer */
.site-footer{padding:26px 0;border-top:1px solid rgba(0,0,0,.06)}
.footer-inner{display:flex;align-items:center;justify-content:space-between;gap:10px}
.footer-inner a{color:inherit;text-decoration:none}

.site-header .logo{color:var(--color-text);text-decoration:none;font-weight:700}



.section.alt{ color: var(--color-gunmetal); }
.section.alt a{ color: var(--color-gunmetal); }
@media (min-width:760px){ .form-grid{ align-items:stretch } }
.form-grid .right .field{ display:flex; flex-direction:column; height:100% }
.form-grid .right .field textarea{ flex:1; min-height:calc(var(--field-h)*3 + var(--field-gap)*2 + 24px) }
.logo img{ height:48px }
/* Logo sizing override */
.logo img{ height:80px }
@media (max-width:760px){ .logo img{ height:56px } }
/* Header compaction: bigger logo, tighter bar */
.site-header .header-inner{ padding:6px 0 !important }
.site-header .logo img{ height:68px !important }
@media (max-width:760px){ .site-header .logo img{ height:56px !important } }
/* Logo size final tweak */
.site-header .logo img{ height:100px !important }
@media (max-width:760px){ .site-header .logo img{ height:56px !important } }
/* Logo size adjust to 90px */
.site-header .logo img{ height:90px !important }
@media (max-width:760px){ .site-header .logo img{ height:56px !important } }