/* ═══════════════════════════════════════════════════════════
   beng. Page Layout v0.2 – Dark Impact Theme
   ═══════════════════════════════════════════════════════════ */

/* ── HERO ── */
.hero{
  position:relative;
  padding:100px 0 60px;
  min-height:85vh;
  display:flex;
  align-items:center;
  overflow:hidden;
}

/* Atmospheric gradients */
.hero::before{
  content:"";position:absolute;inset:0;z-index:0;pointer-events:none;
  background:
    radial-gradient(ellipse 1200px 800px at 12% 18%, rgba(46,142,224,0.22), transparent 60%),
    radial-gradient(ellipse 900px 600px at 78% 8%, rgba(242,107,43,0.15), transparent 55%),
    radial-gradient(ellipse 700px 800px at 65% 100%, rgba(46,142,224,0.08), transparent 50%);
}

/* Subtle grid overlay */
.hero::after{
  content:"";position:absolute;inset:0;z-index:0;pointer-events:none;
  background-image:
    linear-gradient(rgba(255,255,255,0.02) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,0.02) 1px, transparent 1px);
  background-size:72px 72px;
  mask-image:radial-gradient(ellipse 80% 70% at 50% 40%, black 20%, transparent 70%);
  -webkit-mask-image:radial-gradient(ellipse 80% 70% at 50% 40%, black 20%, transparent 70%);
}

.hero .container{position:relative;z-index:1;}

.hero-inner{
  width:100%;
  display:flex;flex-direction:column;
  align-items:flex-start;text-align:left;
}

.hero-title{
  margin:0 0 28px;max-width:20ch;
  font-size:clamp(38px,6.5vw,80px);
  line-height:0.98;letter-spacing:-.04em;font-weight:800;
  animation:heroFadeUp .7s ease both;
  animation-delay:.2s;
}

/* The orange dot on "beng." */
.hero-title .beng-dot{
  color:var(--highlight);
  display:inline-block;
  animation:dotPulse 2.5s ease-in-out infinite;
  animation-delay:1.5s;
}

.hero-subtitle{
  max-width:58ch;
  font-size:clamp(16px,1.8vw,20px);
  color:var(--muted);
  line-height:1.6;
  margin-bottom:8px;
  animation:heroFadeUp .7s ease both;
  animation-delay:.45s;
}

.hero-ctas{
  margin-top:24px;
  display:flex;gap:14px;flex-wrap:wrap;
  justify-content:flex-start;
  animation:heroFadeUp .7s ease both;
  animation-delay:.65s;
}

/* Hero-specific CTA with orange impact */
.hero-ctas .btn:first-child{
  background:var(--highlight);
  box-shadow:0 4px 24px rgba(242,107,43,0.3);
}
.hero-ctas .btn:first-child:hover{
  box-shadow:0 8px 36px rgba(242,107,43,0.4);
}

/* Hero proof badges */
.hero-proof{
  display:flex;flex-wrap:wrap;gap:8px;
  margin-top:20px;
  animation:heroFadeUp .6s ease both;
  animation-delay:.85s;
}
.hero-proof .badge{
  background:rgba(46,142,224,0.08);
  border-color:rgba(46,142,224,0.2);
  color:rgba(147,197,253,0.9);
}

/* Bottom fade */
.hero-fade{
  position:absolute;left:0;right:0;bottom:-1px;
  height:80px;pointer-events:none;z-index:1;
  background:linear-gradient(to bottom, rgba(5,8,14,0), rgba(5,8,14,1));
}

/* Hero animations */
@keyframes heroFadeUp{
  from{opacity:0;transform:translateY(28px);}
  to{opacity:1;transform:translateY(0);}
}
@keyframes dotPulse{
  0%,100%{transform:scale(1);}
  50%{transform:scale(1.25);}
}

/* Scroll hint */
.scroll-hint{
  position:absolute;bottom:32px;left:50%;
  transform:translateX(-50%);
  display:flex;flex-direction:column;align-items:center;gap:8px;
  color:var(--muted);font-size:11px;font-weight:500;
  letter-spacing:.1em;text-transform:uppercase;
  animation:heroFadeUp .5s ease both;
  animation-delay:1.2s;
  z-index:1;
}
.scroll-hint-line{
  width:1px;height:28px;
  background:linear-gradient(to bottom, var(--primary), transparent);
  animation:scrollPulse 2s ease-in-out infinite;
}
@keyframes scrollPulse{
  0%,100%{opacity:.3;transform:scaleY(1);}
  50%{opacity:1;transform:scaleY(1.3);}
}

/* ── SECTION TITLES (upgraded) ── */
.section{padding:56px 0;}
.section-head h2{
  margin:0;
  font-size:clamp(24px,2.8vw,38px);
  line-height:1.1;letter-spacing:-.025em;font-weight:800;
}
.section-head p{margin:10px 0 0;max-width:60ch;color:var(--muted);}

/* ── RESPONSIVE ── */
@media (max-width:720px){
  .hero{padding:100px 0 50px;min-height:auto;}
  .hero-title{max-width:16ch;}
  .scroll-hint{display:none;}
  .form-row{grid-template-columns:1fr;}
}
@media (max-width:480px){
  .hero{padding:90px 0 40px;}
  .hero-ctas{flex-direction:column;}
  .hero-ctas .btn{width:100%;text-align:center;}
}

/* ── beng. STATEMENT (large text interlude) ── */
.beng-statement{
  padding:80px 0;text-align:center;position:relative;
}
.beng-statement-text{
  font-size:clamp(48px,10vw,140px);
  font-weight:800;letter-spacing:-.05em;line-height:.9;
  background:linear-gradient(135deg, var(--text) 0%, var(--primary) 40%, var(--highlight) 80%);
  -webkit-background-clip:text;-webkit-text-fill-color:transparent;
  background-clip:text;
  display: inline-block;
  padding-bottom: 0.08em;
}
.beng-statement-sub{
  margin-top:20px;font-size:17px;color:var(--muted);letter-spacing:.05em;
}

/* ── SECTION DIVIDER ── */
.section-divider{
  width:100%;height:1px;border:none;margin:0;
  background:linear-gradient(90deg, transparent, var(--border), transparent);
}


/* ═══════════════════════════════════════════════════════════
   XENTRAL LANDING PAGE
   (Preserved for xentral.html – already dark-themed)
   ═══════════════════════════════════════════════════════════ */

.hero-xentral .eyebrow{font-size:.9rem;color:var(--muted);margin:0 0 10px;}
.hero-xentral .hero-title{max-width:34ch;}
.hero-xentral .hero-subtitle{max-width:72ch;}
.hero-bullets{margin:18px 0 0;padding-left:18px;max-width:72ch;color:var(--text);}
.hero-bullets li{margin:10px 0;}
.hero-proof{display:flex;flex-wrap:wrap;gap:10px;margin-top:16px;}
.badge-soft{
  background:rgba(46,142,224,0.1);
  border:1px solid var(--border);
  padding:6px 10px;border-radius:999px;
  font-size:.85rem;color:var(--muted);
}
.badge-trust{
  border-color:rgba(34,197,94,0.25);
  background:rgba(34,197,94,0.1);
  color:#86EFAC;
}

.grid-2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;margin-top:18px;}
@media (max-width:920px){.grid-2{grid-template-columns:1fr;}}

.tiles{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin-top:18px;}
@media (max-width:980px){.tiles{grid-template-columns:repeat(2,minmax(0,1fr));}}
@media (max-width:620px){.tiles{grid-template-columns:1fr;}}

.tile{
  background:var(--surface);
  border:1px solid var(--border);border-radius:var(--radius-lg);
  padding:16px;box-shadow:var(--shadow-sm);
  transition:transform .15s ease, box-shadow .15s ease;
}
.tile h3{margin:0 0 8px;font-size:1.02rem;}
.tile p{margin:0;color:var(--muted);}
.tile:hover{transform:translateY(-2px);box-shadow:var(--shadow-md);}
@media (prefers-reduced-motion:reduce){.tile{transition:none;}.tile:hover{transform:none;}}

.steps{list-style:none;margin:14px 0 0;padding:0;display:grid;gap:10px;}
.steps li{
  display:flex;justify-content:space-between;gap:12px;
  padding:12px 14px;
  background:var(--surface);border:1px solid var(--border);
  border-radius:var(--radius-lg);box-shadow:var(--shadow-sm);
}
.steps li strong{font-weight:800;}
.steps li span{color:var(--muted);font-size:.95rem;}
@media (max-width:900px){.steps li{flex-direction:column;}}

.step{
  display:flex;gap:14px;align-items:flex-start;
  background:var(--surface);border:1px solid var(--border);
  border-radius:var(--radius-lg);padding:14px;box-shadow:var(--shadow-sm);
}
.step-no{
  width:34px;height:34px;border-radius:10px;
  display:flex;align-items:center;justify-content:center;
  background:rgba(46,142,224,0.12);
  border:1px solid rgba(46,142,224,0.25);
  color:var(--primary);font-weight:800;flex:0 0 auto;
}
.step h3{margin:0 0 6px;}
.step p{margin:0;color:var(--muted);}

/* Xentral LP specific */
.lp-hero{position:relative;padding:60px 0 28px;}
.lp-hero-inner{max-width:82ch;}
.lp-title{font-size:clamp(2.25rem,4.4vw,3.3rem);letter-spacing:-.03em;margin:10px 0 10px;line-height:1.05;}
.lp-subtitle{font-size:clamp(1.05rem,1.5vw,1.25rem);max-width:76ch;color:var(--muted);}
.eyebrow{font-weight:700;letter-spacing:.08em;text-transform:uppercase;font-size:.78rem;color:var(--muted);margin:0;}

.lp-bullets{margin:18px 0 0;padding-left:18px;display:grid;gap:8px;max-width:72ch;color:var(--text);}
.lp-cta{display:flex;gap:12px;flex-wrap:wrap;margin-top:20px;align-items:center;}
.lp-proof{display:flex;gap:8px;flex-wrap:wrap;margin-top:16px;}

.lp-hero-bg{
  position:absolute;inset:0;z-index:-1;pointer-events:none;
  background:
    radial-gradient(1100px 620px at 18% 12%, rgba(46,142,224,0.35), transparent 62%),
    radial-gradient(900px 520px at 76% 0%, rgba(242,107,43,0.22), transparent 64%),
    radial-gradient(1200px 720px at 65% 95%, rgba(46,142,224,0.1), transparent 60%),
    linear-gradient(180deg, rgba(5,8,14,0) 0%, rgba(5,8,14,.92) 78%, rgba(5,8,14,1) 100%);
}

.lp-section h2{font-size:clamp(1.6rem,2.2vw,2.05rem);letter-spacing:-.02em;margin-bottom:10px;}
.lp-section h3{font-size:1.05rem;margin:0 0 6px;}
.lp-section .maxw-70{max-width:70ch;}

.lp-grid-2{display:grid;grid-template-columns:1.05fr .95fr;gap:18px;align-items:start;}
@media (max-width:900px){.lp-grid-2{grid-template-columns:1fr;}.lp-hero-inner{max-width:100%;}}

.surface{
  background:var(--surface);
  border:1px solid var(--border);
  border-radius:18px;padding:16px;
  box-shadow:var(--shadow-md);
}

.checklist{list-style:none;padding:0;margin:12px 0 0;display:grid;gap:10px;}
.checklist li{position:relative;padding-left:26px;color:var(--text);}
.checklist li::before{
  content:"";position:absolute;left:0;top:.55em;
  width:14px;height:14px;border-radius:999px;
  background:rgba(46,142,224,0.15);
  border:1px solid rgba(46,142,224,0.3);
}

.kpi{list-style:none;padding:0;margin:10px 0 0;display:grid;gap:10px;}
.kpi li{display:flex;justify-content:space-between;gap:10px;align-items:baseline;}
.kpi li strong{font-weight:800;}
.kpi li span{color:var(--muted);font-size:.95rem;}

.feature-row{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-top:14px;}
.feature{
  background:var(--surface);border:1px solid var(--border);
  border-radius:16px;padding:14px;box-shadow:var(--shadow-sm);
}
.feature p{color:var(--muted);}
@media (max-width:900px){.feature-row{grid-template-columns:1fr;}}

.lp-head{display:flex;align-items:flex-end;justify-content:space-between;gap:12px;margin-bottom:12px;}
.lp-head p{margin:0;max-width:60ch;color:var(--muted);}

.tile-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;}
.tile-grid-3{grid-template-columns:repeat(3,1fr);}
@media (max-width:1100px){.tile-grid{grid-template-columns:repeat(2,1fr);}}
@media (max-width:640px){.tile-grid{grid-template-columns:1fr;}}

.video-embed{
  margin-top:12px;border-radius:16px;overflow:hidden;
  border:1px solid var(--border);
  background:rgba(255,255,255,0.03);
  aspect-ratio:16/9;position:relative;
}
.video-iframe{width:100%;aspect-ratio:16/9;border:0;border-radius:var(--radius-lg);}
.video-poster{
  display:block;cursor:pointer;outline:none;
  background:
    radial-gradient(700px 300px at 15% 30%, rgba(46,142,224,0.22), transparent 60%),
    radial-gradient(700px 300px at 75% 20%, rgba(242,107,43,0.18), transparent 60%);
}
.video-poster:focus-visible{box-shadow:0 0 0 3px rgba(46,142,224,0.35);}
.video-poster-title{position:absolute;left:14px;top:14px;font-weight:800;letter-spacing:-.01em;}
.video-poster-sub{position:absolute;left:14px;top:44px;color:var(--muted);font-size:.95rem;}
.video-play-fab{
  position:absolute;inset:auto 14px 14px auto;
  width:52px;height:52px;display:grid;place-items:center;
  border-radius:999px;
  background:rgba(255,255,255,0.08);
  border:1px solid var(--border);
  box-shadow:var(--shadow-md);color:var(--text);
}
.video-embed iframe{width:100%;height:100%;border:0;display:block;}
.video-grid{display:grid;grid-template-columns:1fr;gap:14px;margin-top:12px;}
.video-surface{padding:16px;}

.faq{display:grid;gap:10px;margin-top:12px;}
.faq details{
  background:var(--surface);border:1px solid var(--border);
  border-radius:16px;padding:12px 14px;box-shadow:var(--shadow-sm);
}
.faq summary{cursor:pointer;font-weight:700;color:var(--text);}
.faq summary::-webkit-details-marker{display:none;}
.faq p{margin:8px 0 0;color:var(--muted);}

.lp-final .final-cta{
  background:var(--surface);border:1px solid var(--border);
  border-radius:20px;padding:18px;box-shadow:var(--shadow-md);
}

.form-wide{max-width:840px;}
.status-error{color:var(--highlight);}
.status-muted{color:var(--muted);}
.cta-panel{padding:24px;}
.muted{color:var(--muted);}
.bullets{list-style:disc;padding-left:18px;color:var(--text);}
.bullets li{margin:6px 0;}

/* ── Dark theme body class (xentral LP compat) ── */
/* No longer needed since base is already dark, but keep for backwards compat */
body.theme-beng-dark{
  background:var(--bg);color:var(--text);
}
body.theme-beng-dark .topbar{
  background:rgba(5,8,14,0.62);
  border-bottom:1px solid var(--border);
  backdrop-filter:blur(10px);
}
body.theme-beng-dark .site-header{
  background:rgba(5,8,14,0.6);
  border-bottom:1px solid var(--border);
}
body.theme-beng-dark .nav a{color:var(--muted);}
body.theme-beng-dark .nav a:hover{color:var(--text);}
body.theme-beng-dark a{color:rgba(147,197,253,.95);}
body.theme-beng-dark a:hover{color:rgba(191,219,254,.98);}
body.theme-beng-dark .btn{border-color:rgba(255,255,255,0.1);}
body.theme-beng-dark .btn-primary{
  background:linear-gradient(180deg, var(--primary) 0%, rgba(20,98,171,1) 100%);
  color:#fff;border-color:rgba(46,142,224,0.3);
  box-shadow:0 14px 32px rgba(46,142,224,0.2);
}
body.theme-beng-dark .btn-primary:hover{
  transform:translateY(-1px);box-shadow:0 18px 40px rgba(46,142,224,0.25);
}
body.theme-beng-dark .btn-ghost{
  background:rgba(255,255,255,0.05);color:var(--text);
}
body.theme-beng-dark .btn-ghost:hover{
  background:rgba(255,255,255,0.09);transform:translateY(-1px);
}
body.theme-beng-dark .section::before{
  content:"";position:absolute;left:0;right:0;top:-1px;height:1px;
  background:linear-gradient(90deg, transparent, rgba(255,255,255,0.06), transparent);
}