:root{
  --night:#0B1220;
  --night-2:#121A2C;
  --night-3:#1A2540;
  --chalk:#EDE9E1;
  --chalk-dim:#B7BAC6;
  --amber:#F2A93B;
  --amber-dim:#C98A2C;
  --clay:#C9713F;
  --turf:#3F8A63;
  --line:rgba(237,233,225,0.12);
}
*{box-sizing:border-box; margin:0; padding:0;}
html{scroll-behavior:smooth;}
body{
  background:var(--night);
  color:var(--chalk);
  font-family:-apple-system, BlinkMacSystemFont, 'SF Pro Display', 'Segoe UI', sans-serif;
  line-height:1.55;
  -webkit-font-smoothing:antialiased;
}
h1,h2,h3,.display{
  font-family:-apple-system, BlinkMacSystemFont, 'SF Pro Display', 'Segoe UI', sans-serif;
  text-transform:uppercase;
  letter-spacing:0.02em;
  color:var(--chalk);
  line-height:1.08;
  font-weight:700;
}
.mono{font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;}
a{color:inherit;}
.wrap{max-width:1120px; margin:0 auto; padding:0 28px;}
.eyebrow{
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size:0.78rem;
  letter-spacing:0.16em;
  text-transform:uppercase;
  color:var(--amber);
  font-weight:600;
}

/* NAV */
header{
  position:sticky; top:0; z-index:50;
  background:rgba(11,18,32,0.92);
  border-bottom:1px solid var(--line);
}
nav{
  position:relative;
  display:flex; align-items:center; justify-content:space-between; gap:16px;
  padding:18px 28px; max-width:1120px; margin:0 auto;
}
.logo{
  font-family:-apple-system, BlinkMacSystemFont, 'SF Pro Display', 'Segoe UI', sans-serif;
  font-weight:700; font-size:1.15rem;
  text-transform:uppercase; letter-spacing:0.03em;
  display:flex; align-items:baseline; gap:2px;
}
.logo sup{ color:var(--amber); font-size:0.75em; }
.logo--nav{ align-items:center; gap:10px; }
.logo--nav .logo-word{ display:flex; align-items:baseline; gap:2px; }
.logo-mark-wrap{
  display:inline-flex; align-items:center; justify-content:center;
  width:28px; height:28px;
  border-radius:8px;
  overflow:hidden;
  flex-shrink:0;
}
.logo-mark{
  width:100%; height:100%;
  object-fit:cover;
  transform:scale(1.3);
  display:block;
}
@media (max-width:640px){ .logo-mark-wrap{ width:22px; height:22px; } }
.navlinks{ display:flex; align-items:center; gap:28px; font-size:1rem; }
.navlinks a{ text-decoration:none; color:var(--chalk); font-weight:600; transition:color .2s; }
.navlinks a:hover{ color:var(--amber); }
.nav-right{ display:flex; align-items:center; gap:16px; }
.nav-right .nav-cta{ padding:10px 20px; font-size:0.85rem; }

.nav-toggle{
  display:none;
  background:transparent; border:1px solid var(--line); color:var(--chalk);
  border-radius:4px; padding:8px 12px; font-size:1rem; cursor:pointer;
}
@media (max-width:640px){
  nav{ gap:10px; }
  .logo--nav{ flex:1 1 auto; min-width:0; }
  .logo--nav .logo-word{ display:inline; }
  .logo--nav .logo-word sup{ margin-left:2px; }
  .nav-toggle{
    display:inline-flex;
    min-width:40px; min-height:40px;
    flex-shrink:0;
  }
  .navlinks{
    display:none;
    flex-direction:column; align-items:flex-start; gap:16px;
    position:absolute; top:100%; left:0; right:0;
    background:var(--night-2); padding:20px 28px;
    border-bottom:1px solid var(--line);
  }
  .navlinks.open{ display:flex; }
  .nav-right{ flex-shrink:0; }
  .nav-right .nav-cta{
    white-space:nowrap;
    padding:10px 14px;
    font-size:0.8rem;
  }
}

.btn{
  display:inline-flex; align-items:center; justify-content:center;
  padding:14px 28px; border-radius:3px; font-weight:600; font-size:0.95rem;
  text-decoration:none; cursor:pointer; border:none;
  font-family:-apple-system, BlinkMacSystemFont, 'SF Pro Display', 'Segoe UI', sans-serif;
  letter-spacing:0.01em;
  transition:transform .15s ease, box-shadow .15s ease;
}
.btn-primary{ background:var(--amber); color:var(--night); }
.btn-primary:hover{ transform:translateY(-1px); box-shadow:0 6px 20px rgba(242,169,59,0.25); }
.btn-ghost{ background:transparent; color:var(--chalk); border:1px solid var(--line); }
.btn-ghost:hover{ border-color:var(--amber); color:var(--amber); }

/* HERO */
.hero{
  padding:96px 0 80px;
  position:relative;
  overflow:hidden;
  background:
    radial-gradient(ellipse 900px 500px at 80% -10%, rgba(242,169,59,0.10), transparent 60%),
    var(--night);
}
.hero-grid{
  display:grid; grid-template-columns:1fr; gap:48px; align-items:center;
}
@media (min-width:1150px){
  .hero .wrap{ max-width:1560px; }
  .hero-grid{ grid-template-columns:2fr 3fr; gap:40px; }
}
.hero h1{ font-size:clamp(2.4rem, 5vw, 3.6rem); margin:18px 0 22px; }
.hero h1 .accent{ color:var(--amber); }
.hero p.sub{ color:var(--chalk-dim); font-size:1.08rem; max-width:480px; margin-bottom:34px; }
.hero-ctas{ display:flex; gap:14px; flex-wrap:wrap; margin-bottom:20px; }
.brand-line{ font-size:1.08rem; color:var(--chalk-dim); margin-top:0; margin-bottom:34px; font-weight:600; letter-spacing:0.01em; }

/* SIGNATURE: product showcase carousel */
.showcase-card{
  background:var(--night-2);
  border:1px solid var(--line);
  border-radius:10px;
  padding:20px;
}
@media (min-width:1150px){
  .showcase-card{ padding:12px; }
}
.carousel{ position:relative; }
.carousel-viewport{
  position:relative;
  width:100%;
  overflow:hidden;
  border-radius:8px;
  background:var(--night-3);
  aspect-ratio:1122/1402;
  cursor:zoom-in;
}
@media (min-width:701px){
  .carousel-viewport{ aspect-ratio:1710/920; }
}
.carousel-slide{
  position:absolute; inset:0;
  opacity:0;
  transition:opacity .5s ease;
  pointer-events:none;
}
.carousel-slide.is-active{ opacity:1; pointer-events:auto; }
.carousel-slide picture{ display:block; width:100%; height:100%; }
.carousel-slide img{ width:100%; height:100%; object-fit:contain; display:block; }

.carousel-arrow{
  position:absolute; top:50%; transform:translateY(-50%);
  display:inline-flex; align-items:center; justify-content:center;
  width:40px; height:40px;
  border-radius:50%;
  border:1px solid var(--line);
  background:rgba(11,18,32,0.55);
  color:var(--chalk);
  cursor:pointer;
  transition:color .2s ease, background-color .2s ease, border-color .2s ease;
  z-index:2;
}
.carousel-arrow svg{ width:20px; height:20px; }
.carousel-arrow--prev{ left:10px; }
.carousel-arrow--next{ right:10px; }
.carousel-arrow:hover, .carousel-arrow:focus-visible{
  color:var(--amber); border-color:var(--amber); background:rgba(242,169,59,0.18);
  outline:2px solid var(--amber); outline-offset:2px;
}
@media (max-width:700px){
  .carousel-arrow{ width:44px; height:44px; }
  .carousel-arrow svg{ width:22px; height:22px; }
}

.carousel-dots{
  display:flex; justify-content:center; align-items:center; gap:2px;
  margin-top:16px;
}
.carousel-dot{
  width:40px; height:40px;
  display:inline-flex; align-items:center; justify-content:center;
  background:transparent; border:none; cursor:pointer;
  padding:0;
}
.carousel-dot::before{
  content:""; width:8px; height:8px; border-radius:50%;
  background:var(--line);
  transition:background-color .2s ease, transform .2s ease;
}
.carousel-dot.is-active::before{ background:var(--amber); transform:scale(1.25); }
.carousel-dot:hover::before, .carousel-dot:focus-visible::before{ background:var(--amber-dim); }
.carousel-dot:focus-visible{ outline:2px solid var(--amber); outline-offset:2px; border-radius:50%; }

.carousel-expand{
  position:absolute; top:10px; right:10px;
  display:inline-flex; align-items:center; justify-content:center;
  width:40px; height:40px;
  border-radius:50%;
  border:1px solid var(--line);
  background:rgba(11,18,32,0.55);
  color:var(--chalk);
  cursor:pointer;
  transition:color .2s ease, background-color .2s ease, border-color .2s ease;
  z-index:2;
}
.carousel-expand svg{ width:18px; height:18px; }
.carousel-expand:hover, .carousel-expand:focus-visible{
  color:var(--amber); border-color:var(--amber); background:rgba(242,169,59,0.18);
  outline:2px solid var(--amber); outline-offset:2px;
}

@media (prefers-reduced-motion: reduce){
  .carousel-slide{ transition:none; }
}

/* EXPANDED PRODUCT HIGHLIGHT VIEWER */
.lightbox{
  position:fixed; inset:0; z-index:200;
  display:flex; align-items:center; justify-content:center;
}
.lightbox[hidden]{ display:none; }
.lightbox-backdrop{
  position:absolute; inset:0;
  background:rgba(11,18,32,0.92);
}
.lightbox-dialog{
  position:relative;
  max-width:92vw; max-height:92vh;
  display:flex; align-items:center; justify-content:center;
}
.lightbox-dialog picture{ display:block; max-width:92vw; max-height:92vh; }
.lightbox-dialog img{
  display:block;
  max-width:92vw; max-height:92vh;
  width:auto; height:auto;
  object-fit:contain;
  border-radius:8px;
}
.lightbox-close,
.lightbox-arrow{
  position:fixed;
  display:inline-flex; align-items:center; justify-content:center;
  width:44px; height:44px;
  border-radius:50%;
  border:1px solid var(--line);
  background:rgba(11,18,32,0.65);
  color:var(--chalk);
  cursor:pointer;
  transition:color .2s ease, background-color .2s ease, border-color .2s ease;
  z-index:201;
}
.lightbox-close svg,
.lightbox-arrow svg{ width:20px; height:20px; }
.lightbox-close:hover, .lightbox-close:focus-visible,
.lightbox-arrow:hover, .lightbox-arrow:focus-visible{
  color:var(--amber); border-color:var(--amber); background:rgba(242,169,59,0.18);
  outline:2px solid var(--amber); outline-offset:2px;
}
.lightbox-close{ top:20px; right:20px; }
.lightbox-arrow--prev{ left:20px; top:50%; transform:translateY(-50%); }
.lightbox-arrow--next{ right:20px; top:50%; transform:translateY(-50%); }

/* STAT STRIP */
.stats{ border-top:1px solid var(--line); border-bottom:1px solid var(--line); padding:52px 0; }
.stats-grid{
  display:grid; grid-template-columns:repeat(4,1fr); gap:32px;
}
@media (max-width:800px){ .stats-grid{ grid-template-columns:repeat(2,1fr); } }
.stat-num{ font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; font-size:2.1rem; font-weight:600; color:var(--amber); }
.stat-label{ font-size:0.85rem; color:var(--chalk-dim); margin-top:6px; }

/* FEATURES */
.section{ padding:96px 0; }
.section-head{ max-width:640px; margin-bottom:56px; }
.section-head h2{ font-size:clamp(1.8rem,3.4vw,2.5rem); margin-top:14px; }
.section-head p{ color:var(--chalk-dim); margin-top:14px; font-size:1.02rem; }

.feat-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:1px; background:var(--line); border:1px solid var(--line); border-radius:10px; overflow:hidden; }
@media (max-width:800px){ .feat-grid{ grid-template-columns:1fr; } }
.feat{ background:var(--night-2); padding:36px 30px; }
.feat .mono{ color:var(--clay); font-size:0.8rem; }
.feat h3{ font-size:1.15rem; margin:14px 0 10px; text-transform:none; letter-spacing:0; }
.feat p{ color:var(--chalk-dim); font-size:0.92rem; }

/* AUDIENCE */
.audience-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:24px; }
@media (max-width:800px){ .audience-grid{ grid-template-columns:1fr; } }
.aud-card{
  border:1px solid var(--line); border-radius:10px; padding:30px;
  background:linear-gradient(180deg, var(--night-2), var(--night));
}
.aud-card .eyebrow{ display:block; margin-bottom:10px; }
.aud-card h3{ text-transform:none; letter-spacing:0; font-size:1.25rem; margin-bottom:10px; }
.aud-card p{ color:var(--chalk-dim); font-size:0.92rem; }

/* FINAL CTA BAND */
.cta-band{
  background:linear-gradient(180deg, var(--night-3), var(--night));
  border-top:1px solid var(--line);
}
.cta-band-inner{ text-align:center; max-width:560px; margin:0 auto; padding:100px 0; }
.cta-band h2{ font-size:clamp(1.8rem,3.6vw,2.6rem); }
.cta-band p{ color:var(--chalk-dim); margin:16px 0 34px; }
.cta-band .btn{ margin:0 6px; }
.cta-band .form-note{ font-size:0.78rem; color:var(--chalk-dim); margin-top:22px; font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; }

/* FOOTER */
footer{ border-top:1px solid var(--line); padding:44px 0; }
.foot-social{
  display:flex; align-items:center; gap:4px; flex-wrap:wrap;
  padding-bottom:18px; margin-bottom:18px; border-bottom:1px solid var(--line);
  font-size:0.8rem;
}
.foot-social .social-label{
  color:var(--chalk-dim); font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  letter-spacing:0.1em; text-transform:uppercase; font-size:0.7rem; margin-right:8px;
}
.social-link{
  display:inline-flex; align-items:center; justify-content:center;
  width:40px; height:40px;
  color:var(--chalk-dim);
  border-radius:8px;
  text-decoration:none;
  transition:color .2s ease, background-color .2s ease;
}
.social-link:hover{ color:var(--amber); background:rgba(242,169,59,0.10); }
.social-link:focus-visible{
  color:var(--amber); background:rgba(242,169,59,0.10);
  outline:2px solid var(--amber); outline-offset:2px;
}
.social-icon{ width:18px; height:18px; display:block; }
.sr-only{
  position:absolute; width:1px; height:1px; padding:0; margin:-1px;
  overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0;
}
.foot-grid{ display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:20px; }
.foot-links{ display:flex; gap:26px; font-size:0.85rem; flex-wrap:wrap; }
.foot-links a{ color:var(--chalk-dim); text-decoration:none; }
.foot-links a:hover{ color:var(--amber); }
.foot-copy{ font-size:0.78rem; color:var(--chalk-dim); font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; }
