
:root{
  --bg:#070809;
  --bg-2:#0b0d10;
  --panel:#101317;
  --panel-2:#15181d;
  --line:rgba(255,255,255,.09);
  --line-hot:rgba(255,109,0,.38);
  --text:#f6f7f8;
  --muted:#a3a8b0;
  --orange:#ff6a00;
  --orange-2:#ff8a1f;
  --cyan:#42d6e8;
  --max:1240px;
  --radius:18px;
}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  background:
    radial-gradient(circle at 72% 0%, rgba(255,106,0,.10), transparent 28rem),
    linear-gradient(180deg,#060708 0%,#090b0d 50%,#060708 100%);
  color:var(--text);
  font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  line-height:1.55;
}
body::before{
  content:"";
  position:fixed; inset:0; z-index:-1; pointer-events:none;
  background-image:
    linear-gradient(rgba(255,255,255,.018) 1px,transparent 1px),
    linear-gradient(90deg,rgba(255,255,255,.018) 1px,transparent 1px);
  background-size:48px 48px;
  mask-image:linear-gradient(to bottom,rgba(0,0,0,.6),transparent 70%);
}
a{color:inherit;text-decoration:none}
img{max-width:100%;display:block}
.section-shell{width:min(calc(100% - 40px),var(--max));margin-inline:auto}

.site-header{
  width:min(calc(100% - 40px),var(--max));
  margin:0 auto;
  min-height:84px;
  display:flex;align-items:center;justify-content:space-between;
  border-bottom:1px solid var(--line);
  position:relative;z-index:20;
}
.brand{display:flex;flex-direction:column;gap:2px}
.brand-word,.footer-brand{
  font-weight:800;letter-spacing:.16em;font-size:1.2rem;line-height:1;
}
.brand-word span,.footer-brand span{color:var(--orange)}
.brand small,.footer-inner small{
  font-size:.52rem;letter-spacing:.35em;color:#9ca0a7;
}
.nav{display:flex;align-items:center;gap:28px;color:#d5d7da;font-size:.92rem}
.nav a:hover{color:white}
.nav-cta{
  padding:10px 16px;border:1px solid var(--line-hot);border-radius:10px;
  box-shadow:inset 0 0 0 1px rgba(255,106,0,.04);
}
.nav-toggle{display:none;background:none;border:0;padding:8px}
.nav-toggle span{display:block;width:23px;height:2px;background:white;margin:5px}

.hero{
  min-height:620px;display:grid;grid-template-columns:1.03fr .97fr;
  align-items:stretch;border-bottom:1px solid var(--line);
}
.hero-copy{padding:84px 54px 64px 0;display:flex;flex-direction:column;justify-content:center}
.eyebrow{
  color:var(--orange-2);font-size:.68rem;font-weight:800;
  letter-spacing:.30em;text-transform:uppercase;
}
.eyebrow span{color:#797e86;margin:0 .65em}
h1,h2,h3,h4,p{margin-top:0}
h1{font-size:clamp(3rem,5.2vw,5.4rem);line-height:.95;letter-spacing:-.055em;margin:20px 0 26px}
h1 em{display:block;color:var(--orange);font-style:normal}
.hero-lead{font-size:1.1rem;color:#c6c9ce;max-width:650px}
.hero-actions,.product-actions{display:flex;gap:14px;align-items:center;flex-wrap:wrap;margin-top:22px}
.button{
  font:inherit;
  cursor:pointer;
  display:inline-flex;align-items:center;justify-content:center;gap:12px;
  min-height:48px;padding:0 22px;border-radius:8px;font-weight:750;
  transition:.2s ease;border:1px solid transparent;
}
.button-primary{background:linear-gradient(135deg,var(--orange),var(--orange-2));color:#080808}
.button-primary:hover{transform:translateY(-2px);box-shadow:0 12px 40px rgba(255,106,0,.22)}
.button-secondary{border-color:rgba(255,255,255,.2);background:rgba(10,11,13,.7)}
.button-secondary:hover{border-color:var(--orange);color:white}
.value-row{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:52px}
.value-row div{border-left:2px solid var(--orange);padding-left:13px}
.value-row b{display:block;font-size:.7rem;letter-spacing:.16em}
.value-row span{display:block;color:#81868e;font-size:.77rem;margin-top:4px}

.hero-visual{position:relative;overflow:hidden;min-height:560px;border-left:1px solid var(--line)}
.hero-visual img{width:100%;height:100%;object-fit:cover;object-position:center 48%;filter:saturate(.90) contrast(1.05)}
.visual-overlay{position:absolute;inset:0;background:linear-gradient(90deg,var(--bg) 0%,transparent 26%,transparent 74%,rgba(0,0,0,.16) 100%)}
.visual-mark{
  position:absolute;left:50%;top:45%;transform:translate(-50%,-50%);
  font-size:clamp(8rem,18vw,16rem);font-weight:900;color:transparent;
  -webkit-text-stroke:1px rgba(255,106,0,.23);opacity:.5
}
.visual-caption{
  position:absolute;right:22px;top:40px;border-right:2px solid var(--orange);
  padding-right:12px;text-align:right;font-size:.62rem;letter-spacing:.3em;line-height:1.9
}

.content-section{padding:72px 0;border-bottom:1px solid var(--line)}
.section-heading{display:flex;justify-content:space-between;align-items:end;gap:30px;margin-bottom:26px}
.section-heading h2,.about-card h2,.launch-card h2{
  font-size:clamp(2rem,3vw,3rem);line-height:1.08;letter-spacing:-.035em;margin:10px 0 0
}
.text-link{color:#c7c9ce}.text-link span{color:var(--orange)}
.category-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.category-card{
  min-height:210px;padding:26px;border:1px solid var(--line);border-radius:var(--radius);
  background:
   linear-gradient(135deg,rgba(255,106,0,.04),transparent 48%),
   linear-gradient(180deg,var(--panel),#0b0d10);
  position:relative;overflow:hidden;transition:.25s ease
}
.category-card::after{
  content:"";position:absolute;width:180px;height:180px;border:1px solid rgba(255,106,0,.13);
  transform:rotate(45deg);right:-110px;bottom:-100px
}
.category-card:hover{transform:translateY(-4px);border-color:rgba(255,106,0,.38)}
.category-icon{font-size:2rem;color:var(--orange)}
.category-icon.cyan{color:var(--cyan)}
.category-kicker,.product-category,.mini-category{font-size:.62rem;letter-spacing:.2em;color:#7f858e}
.category-card h3{font-size:1.65rem;margin:28px 0 7px}
.category-card p{color:#9ba0a8;max-width:330px;margin-bottom:0}
.card-arrow{position:absolute;right:24px;bottom:22px;color:var(--orange);font-size:1.3rem}

.product-grid{display:grid;grid-template-columns:1.65fr .8fr;gap:18px}
.product-feature{
  min-height:450px;border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;
  display:grid;grid-template-columns:.95fr 1.05fr;background:var(--panel)
}
.product-media{position:relative;min-height:450px;overflow:hidden}
.product-media img{width:100%;height:100%;object-fit:cover}
.product-media::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,transparent 55%,var(--panel) 100%)}
.status-badge,.pill{
  display:inline-flex;border:1px solid var(--orange);color:var(--orange-2);
  border-radius:999px;padding:6px 10px;font-size:.58rem;font-weight:800;letter-spacing:.16em;
}
.status-badge{position:absolute;left:20px;top:20px;z-index:2;background:rgba(6,7,8,.76)}
.product-info{padding:44px 40px;display:flex;flex-direction:column;justify-content:center}
.product-info h3{font-size:2.5rem;letter-spacing:-.04em;margin:10px 0 14px}
.product-info p{color:#afb3ba}
.product-points{display:flex;gap:10px;flex-wrap:wrap;margin:10px 0 0}
.product-points span{padding:8px 10px;border:1px solid var(--line);border-radius:7px;font-size:.75rem;color:#b7bbc2}
.muted-note{font-size:.72rem;color:#777d85;max-width:230px}

.coming-soon{border:1px solid var(--line);border-radius:var(--radius);padding:24px;background:#0d0f12}
.mini-product{display:grid;grid-template-columns:112px 1fr;gap:16px;position:relative;padding:18px 0;border-bottom:1px solid var(--line)}
.mini-product:last-child{border-bottom:0}
.mini-product img{width:112px;height:102px;object-fit:cover;border-radius:10px}
.mini-product h4{font-size:1.15rem;margin:6px 0 5px}
.mini-product p{font-size:.84rem;color:#969ba3;margin:0 0 10px}
.mini-product .pill{grid-column:2;width:max-content}

.about{padding:70px 0}
.about-card,.launch-card{
  border:1px solid var(--line);border-radius:var(--radius);
  background:
   radial-gradient(circle at 10% 0%,rgba(255,106,0,.09),transparent 25rem),
   var(--panel);
}
.about-card{padding:42px;display:grid;grid-template-columns:1fr 1fr;gap:70px;align-items:center}
.about-card p{margin:0;color:#aab0b7;font-size:1.04rem}

.launch{padding:0 0 70px}
.launch-card{display:grid;grid-template-columns:6px 1fr auto;gap:30px;align-items:center;padding:38px}
.launch-line{width:3px;height:100%;min-height:85px;background:linear-gradient(var(--orange),transparent)}
.launch-card p{margin:14px 0 0;color:#9ea4ac;max-width:760px}

.support{padding:0 0 80px}
.support-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.support-card{padding:25px;border:1px solid var(--line);border-radius:var(--radius);background:var(--panel)}
.support-card h3{margin-bottom:8px}.support-card p{margin:0;color:#9399a2;font-size:.92rem}

footer{border-top:1px solid var(--line);padding:30px 0 45px;background:#050607}
.footer-inner{display:flex;justify-content:space-between;align-items:center;gap:24px}
.footer-inner p{margin:0;color:#777d84;font-size:.82rem}

.reveal{opacity:0;transform:translateY(14px);transition:opacity .65s ease,transform .65s ease}
.reveal.visible{opacity:1;transform:none}

@media (max-width:980px){
  .nav-toggle{display:block}
  .nav{
    display:none;position:absolute;top:74px;right:0;left:0;
    padding:18px;background:#0b0d10;border:1px solid var(--line);border-radius:12px;
    flex-direction:column;align-items:stretch
  }
  .nav.open{display:flex}
  .hero{grid-template-columns:1fr}
  .hero-copy{padding:72px 0 42px}
  .hero-visual{border-left:0;min-height:420px}
  .category-grid,.support-grid{grid-template-columns:1fr}
  .product-grid{grid-template-columns:1fr}
  .product-feature{grid-template-columns:1fr}
  .product-media{min-height:330px}
  .about-card{grid-template-columns:1fr;gap:22px}
  .launch-card{grid-template-columns:6px 1fr}
  .launch-card .button{grid-column:2;width:max-content}
}

@media (max-width:640px){
  .section-shell,.site-header{width:min(calc(100% - 26px),var(--max))}
  .site-header{min-height:72px}
  h1{font-size:3.15rem}
  .hero-copy{padding-top:54px}
  .hero-visual{min-height:330px}
  .visual-caption{display:none}
  .value-row{grid-template-columns:1fr}
  .section-heading{align-items:start;flex-direction:column}
  .product-info{padding:30px 24px}
  .product-info h3{font-size:2rem}
  .mini-product{grid-template-columns:86px 1fr}
  .mini-product img{width:86px;height:86px}
  .footer-inner{align-items:flex-start;flex-direction:column}
}


/* Contact modal */
.text-button{
  margin-top:16px;padding:0;border:0;background:none;color:var(--orange-2);
  font:inherit;font-weight:750;cursor:pointer;
}
.text-button:hover{color:#fff}

.modal{
  position:fixed;inset:0;z-index:1000;display:none;
  align-items:center;justify-content:center;padding:24px;
}
.modal.open{display:flex}
.modal-backdrop{
  position:absolute;inset:0;background:rgba(0,0,0,.76);
  backdrop-filter:blur(9px);
}
.contact-dialog{
  position:relative;z-index:2;width:min(100%,680px);max-height:min(90vh,820px);
  overflow:auto;padding:34px;border:1px solid rgba(255,255,255,.13);
  border-radius:18px;background:
    radial-gradient(circle at 0 0,rgba(255,106,0,.09),transparent 22rem),
    #0e1114;
  box-shadow:0 30px 100px rgba(0,0,0,.65);
}
.contact-dialog h2{
  font-size:2rem;letter-spacing:-.035em;margin:10px 0 8px;
}
.contact-intro{color:#9ea4ac;margin-bottom:26px}
.modal-close{
  position:absolute;right:18px;top:13px;border:0;background:none;
  color:#b5bac1;font-size:2rem;line-height:1;cursor:pointer;
}
.modal-close:hover{color:#fff}

#contact-form{display:grid;gap:17px}
.field-row{display:grid;grid-template-columns:1fr 1fr;gap:14px}
#contact-form label{display:grid;gap:7px}
#contact-form label>span{
  font-size:.76rem;font-weight:750;color:#d9dce0;letter-spacing:.04em;
}
#contact-form input,
#contact-form select,
#contact-form textarea{
  width:100%;border:1px solid rgba(255,255,255,.14);border-radius:9px;
  background:#12161a;color:#f5f6f7;padding:13px 14px;
  font:inherit;outline:none;
}
#contact-form textarea{resize:vertical;min-height:130px}
#contact-form input:focus,
#contact-form select:focus,
#contact-form textarea:focus{
  border-color:var(--orange);box-shadow:0 0 0 3px rgba(255,106,0,.09);
}
.contact-submit{width:100%;margin-top:3px}
.form-status{min-height:1.3em;margin:0;color:#c4c8ce;font-size:.85rem}
.form-status.error{color:#ff9d72}
.form-status.ok{color:#ffb36f}
.contact-note{
  border-top:1px solid var(--line);padding-top:18px;margin:22px 0 0;
  color:#737981;font-size:.75rem;
}
body.modal-open{overflow:hidden}

@media (max-width:640px){
  .modal{padding:12px}
  .contact-dialog{padding:27px 20px}
  .field-row{grid-template-columns:1fr}
}

/* v0.3 fixes */
button.button{
  color:var(--text);
  appearance:none;
  -webkit-appearance:none;
}
button.button-secondary{
  color:var(--text);
  background:rgba(10,11,13,.78);
  border-color:rgba(255,255,255,.24);
}
button.button-secondary:hover{
  color:#fff;
  border-color:var(--orange);
  background:rgba(255,106,0,.08);
}

.hero-visual img{
  display:block;
  opacity:1;
}

.modal{
  visibility:hidden;
  opacity:0;
  pointer-events:none;
  display:flex;
  transition:opacity .18s ease, visibility .18s ease;
}
.modal.open{
  visibility:visible;
  opacity:1;
  pointer-events:auto;
}
.contact-dialog{
  transform:translateY(10px) scale(.985);
  transition:transform .18s ease;
}
.modal.open .contact-dialog{
  transform:none;
}


/* v0.4 contact delivery */
.hp-field{
  position:absolute !important;
  left:-9999px !important;
  width:1px !important;
  height:1px !important;
  opacity:0 !important;
  pointer-events:none !important;
}
.contact-submit[disabled]{
  opacity:.6;
  cursor:wait;
  transform:none;
  box-shadow:none;
}
.form-status.error{color:#ff8a65}
.form-status.ok{color:#ffb067}


/* v0.5 — forced fresh assets + send-success popup */
.hp-field{
  display:none !important;
  position:absolute !important;
  left:-99999px !important;
  width:1px !important;
  height:1px !important;
  opacity:0 !important;
  pointer-events:none !important;
}

.send-result-modal{
  position:fixed;
  inset:0;
  z-index:1100;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:24px;
  visibility:hidden;
  opacity:0;
  pointer-events:none;
  transition:opacity .18s ease, visibility .18s ease;
}
.send-result-modal.open{
  visibility:visible;
  opacity:1;
  pointer-events:auto;
}
.send-result-backdrop{
  position:absolute;
  inset:0;
  background:rgba(0,0,0,.76);
  backdrop-filter:blur(9px);
}
.send-result-dialog{
  position:relative;
  z-index:2;
  width:min(100%,520px);
  padding:38px;
  text-align:center;
  border:1px solid rgba(255,255,255,.13);
  border-radius:18px;
  background:
    radial-gradient(circle at 50% 0%,rgba(255,106,0,.12),transparent 20rem),
    #0e1114;
  box-shadow:0 30px 100px rgba(0,0,0,.68);
  transform:translateY(10px) scale(.985);
  transition:transform .18s ease;
}
.send-result-modal.open .send-result-dialog{transform:none}
.success-icon{
  width:64px;height:64px;margin:0 auto 18px;
  display:grid;place-items:center;
  border-radius:50%;
  border:1px solid var(--orange);
  color:#0b0c0d;
  background:linear-gradient(135deg,var(--orange),var(--orange-2));
  font-size:2rem;font-weight:900;
  box-shadow:0 0 42px rgba(255,106,0,.2);
}
.send-result-dialog h2{
  margin:10px 0 12px;
  font-size:2rem;
  letter-spacing:-.035em;
}
.send-result-dialog p{
  color:#aeb3ba;
  margin:0 auto 26px;
  max-width:390px;
}
.send-result-dialog .button{min-width:150px}

.contact-submit[disabled]{
  opacity:.62;
  cursor:wait;
  transform:none !important;
  box-shadow:none !important;
}
