/* AI4Trening V16.12 — Frontpage Signature Premium
   Visual-only landing page refinement. No pricing, auth or workout logic changes. */

:root{
  --sig-bg:#050a07;
  --sig-panel:#0b130e;
  --sig-panel-2:#101b13;
  --sig-ink:#f4f7f4;
  --sig-muted:#aeb8b0;
  --sig-line:rgba(255,255,255,.09);
  --sig-lime:#b7ff00;
  --sig-lime-soft:#d8ff78;
  --sig-shadow:0 32px 90px rgba(0,0,0,.38);
}

body{
  background:
    radial-gradient(92% 52% at 50% -8%,rgba(183,255,0,.08),transparent 62%),
    linear-gradient(180deg,#071009 0%,#050a07 58%,#030604 100%)!important;
  color:var(--sig-ink)!important;
}

header{
  background:rgba(4,10,7,.78)!important;
  border-bottom:1px solid rgba(255,255,255,.07)!important;
  backdrop-filter:blur(24px) saturate(1.18)!important;
  -webkit-backdrop-filter:blur(24px) saturate(1.18)!important;
}
.nav{height:74px!important}
.brand-text{color:#f2f6f3!important;letter-spacing:-.03em}
.brand-logo-img{
  width:52px!important;height:34px!important;border-radius:10px!important;
  background:#030704!important;
  box-shadow:0 8px 24px rgba(0,0,0,.32),0 0 0 1px rgba(255,255,255,.055)!important;
}
.links{color:#aeb8b0!important}
.links a{transition:color .16s ease,opacity .16s ease}
.links a:hover{color:#fff!important}
.btn-login{
  background:rgba(255,255,255,.035)!important;
  border-color:rgba(255,255,255,.10)!important;
  color:#eaf0eb!important;
}
.header-actions .btn-primary{
  background:linear-gradient(180deg,#d9ff79 0%,#b7ff00 58%,#9ee400 100%)!important;
  color:#071008!important;
  box-shadow:inset 0 1px rgba(255,255,255,.52),0 10px 28px rgba(183,255,0,.12)!important;
}

.hero{
  position:relative;isolation:isolate;overflow:hidden;
  padding:88px 0 78px!important;
  background:
    radial-gradient(52% 78% at 82% 12%,rgba(183,255,0,.15),transparent 64%),
    radial-gradient(52% 60% at 5% 38%,rgba(88,148,103,.08),transparent 70%),
    linear-gradient(180deg,#071009 0%,#08120b 52%,#050a07 100%)!important;
}
.hero::before{
  content:"";position:absolute;z-index:-1;inset:-20% -10% auto auto;
  width:58vw;height:58vw;max-width:760px;max-height:760px;border-radius:50%;
  background:radial-gradient(circle,rgba(183,255,0,.08),rgba(183,255,0,.025) 38%,transparent 68%);
  filter:blur(14px);pointer-events:none;
}
.hero::after{
  content:"";position:absolute;left:0;right:0;bottom:0;height:1px;
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.10),transparent);
}
.hero-grid{gap:72px!important}
.kicker{
  background:rgba(255,255,255,.055)!important;
  border:1px solid rgba(255,255,255,.08)!important;
  color:#d7e0d9!important;
  box-shadow:inset 0 1px rgba(255,255,255,.035)!important;
}
.kicker:before{
  background:var(--sig-lime)!important;
  box-shadow:0 0 0 5px rgba(183,255,0,.09),0 0 24px rgba(183,255,0,.28);
}
h1{
  color:#f6f9f7!important;
  text-wrap:balance;
  font-weight:950!important;
  letter-spacing:-.068em!important;
  text-shadow:0 18px 55px rgba(0,0,0,.28);
}
.hero-copy{
  color:#aeb8b0!important;
  max-width:670px!important;
  line-height:1.52!important;
}
.hero-actions{margin-top:32px!important}
.hero-actions .btn{
  min-height:56px;padding-inline:24px!important;
  border-radius:18px!important;
}
.hero-actions .btn-primary{
  background:linear-gradient(180deg,#d9ff79,#b7ff00 56%,#9ee200)!important;
  color:#071008!important;
  box-shadow:inset 0 1px rgba(255,255,255,.52),0 16px 40px rgba(183,255,0,.15),0 0 0 1px rgba(183,255,0,.11)!important;
}
.hero-actions .btn-ghost{
  background:rgba(255,255,255,.035)!important;
  border:1px solid rgba(255,255,255,.11)!important;
  color:#eef3ef!important;
  box-shadow:inset 0 1px rgba(255,255,255,.03)!important;
}
.micro{gap:10px!important;color:#aeb8b0!important}
.micro span{
  display:inline-flex;align-items:center;
  min-height:34px;padding:0 12px;border-radius:999px;
  border:1px solid rgba(255,255,255,.075);
  background:rgba(255,255,255,.025);
}
.micro span:before{color:var(--sig-lime)!important}

.launch-offer{
  margin-top:20px!important;padding:18px!important;border-radius:22px!important;
  background:
    radial-gradient(80% 120% at 0 0,rgba(183,255,0,.095),transparent 68%),
    linear-gradient(145deg,rgba(18,31,22,.98),rgba(8,15,10,.99))!important;
  border:1px solid rgba(183,255,0,.20)!important;
  color:#e8eee9!important;
  box-shadow:0 22px 58px rgba(0,0,0,.24),inset 0 1px rgba(255,255,255,.04)!important;
}
.launch-offer .launch-icon{
  background:rgba(183,255,0,.10)!important;color:var(--sig-lime)!important;
  border:1px solid rgba(183,255,0,.16)!important;
}
.launch-offer .launch-copy strong{color:#f5f8f6!important;font-size:18px!important}
.launch-offer .launch-copy>span{color:#b0bbb2!important}
.launch-offer .launch-copy small{color:#93a097!important}

.product{
  position:relative;border-radius:32px!important;
  background:
    radial-gradient(90% 70% at 100% 0,rgba(183,255,0,.08),transparent 62%),
    linear-gradient(155deg,#111c14,#07100a)!important;
  border:1px solid rgba(255,255,255,.10)!important;
  box-shadow:0 42px 110px rgba(0,0,0,.42),0 0 0 1px rgba(183,255,0,.025),inset 0 1px rgba(255,255,255,.045)!important;
  transform:perspective(1200px) rotateY(-1.5deg) rotateX(.6deg);
}
.product::before{
  content:"LIVE PLAN";position:absolute;z-index:3;right:18px;top:18px;
  padding:6px 9px;border-radius:999px;
  background:rgba(183,255,0,.09);border:1px solid rgba(183,255,0,.16);
  color:#d9ff7f;font-size:10px;font-weight:950;letter-spacing:.15em;
}
.product-top{
  border-bottom-color:rgba(255,255,255,.075)!important;
  color:#eef3ef!important;
}
.product-top>div:last-child{color:#95a198!important}
.product-body h3{color:#f6f9f7!important;font-size:28px!important}
.product-body p{color:#9eaaa1!important}
.stat,.prog{
  border-color:rgba(255,255,255,.085)!important;
  background:rgba(255,255,255,.025)!important;
  box-shadow:inset 0 1px rgba(255,255,255,.025)!important;
}
.stat small,.prog{color:#aab5ad!important}
.stat strong,.prog strong{color:#f5f8f6!important}
.plan{
  border:1px solid rgba(183,255,0,.14)!important;
  background:
    radial-gradient(90% 120% at 100% 0,rgba(183,255,0,.11),transparent 64%),
    linear-gradient(145deg,#17261b,#0b140e)!important;
  box-shadow:0 18px 42px rgba(0,0,0,.24)!important;
}
.plan small{color:#aab6ad!important}
.plan .pill{
  background:linear-gradient(180deg,#d7ff73,#b7ff00)!important;
  box-shadow:inset 0 1px rgba(255,255,255,.5),0 10px 24px rgba(183,255,0,.14)!important;
}
.bar{background:rgba(255,255,255,.07)!important}
.bar i{background:linear-gradient(90deg,#8fd000,#b7ff00)!important}

section:not(.hero){background:transparent!important}
.section-head h2,.combo-copy h2,.cta h2{color:#f4f7f5!important}
.section-head p,.feature p,.step p,.discipline-card p{color:#aab5ad!important}
.section-trial{color:#d6ff78!important}

.discipline-card,.feature,.step,.price,.trust-photo-card{
  background:
    radial-gradient(90% 80% at 100% 0,rgba(183,255,0,.045),transparent 68%),
    linear-gradient(145deg,rgba(16,27,19,.98),rgba(7,13,9,.995))!important;
  border-color:rgba(255,255,255,.085)!important;
  box-shadow:0 22px 56px rgba(0,0,0,.22),inset 0 1px rgba(255,255,255,.028)!important;
}
.discipline-card h3,.feature h3,.step h3,.price h3{color:#f2f6f3!important}
.discipline-code{color:#98a59b!important}
.discipline-metric{color:#d7ff78!important}
.icon,.discipline-icon{
  background:rgba(183,255,0,.075)!important;
  color:#d7ff78!important;border:1px solid rgba(183,255,0,.10);
}

.combo{
  border:1px solid rgba(255,255,255,.085)!important;
  background:linear-gradient(145deg,#0f1a12,#050a07)!important;
  box-shadow:var(--sig-shadow)!important;
}
.combo-visual{
  background:
   radial-gradient(circle at 75% 20%,rgba(183,255,0,.16),transparent 14rem),
   linear-gradient(135deg,#17251a,#080e0a)!important;
}
.combo-copy p{color:#aeb8b0!important}
.combo-copy .line{color:#e7ece8!important}

.price.featured{
  background:
    radial-gradient(95% 70% at 100% 0,rgba(183,255,0,.11),transparent 68%),
    linear-gradient(145deg,#142119,#08100b)!important;
  border-color:rgba(183,255,0,.25)!important;
}
.price .sub,.amount small,.fine,.payment-note{color:#98a49b!important}
.price li{color:#c2ccc4!important}
.after-trial{
  background:rgba(183,255,0,.055)!important;
  border-color:rgba(183,255,0,.13)!important;
  color:#bdc8bf!important;
}
.after-trial strong{color:#eff4f0!important}
.price .btn-ghost{
  background:rgba(255,255,255,.035)!important;
  border-color:rgba(255,255,255,.10)!important;
  color:#e9eeea!important;
}
.price .btn-primary{
  background:linear-gradient(180deg,#d8ff77,#b7ff00 58%,#9ee300)!important;
  color:#071008!important;
  box-shadow:inset 0 1px rgba(255,255,255,.48),0 12px 30px rgba(183,255,0,.12)!important;
}

.cta{
  position:relative;overflow:hidden;
  background:
    radial-gradient(80% 160% at 100% 0,rgba(183,255,0,.15),transparent 64%),
    linear-gradient(145deg,#111d15,#050a07)!important;
  border:1px solid rgba(255,255,255,.09)!important;
  box-shadow:var(--sig-shadow)!important;
}
.cta::after{
  content:"";position:absolute;right:-80px;bottom:-110px;width:260px;height:260px;border-radius:50%;
  background:radial-gradient(circle,rgba(183,255,0,.08),transparent 70%);
}
.cta p{color:#aeb8b0!important}
footer{color:#96a198!important}
.foot{color:#96a198!important}

@media(hover:hover) and (pointer:fine){
  .product,.discipline-card,.feature,.step,.price,.launch-offer{
    transition:transform .18s ease,border-color .18s ease,box-shadow .18s ease;
  }
  .product:hover{transform:perspective(1200px) rotateY(0) rotateX(0) translateY(-3px)}
  .discipline-card:hover,.feature:hover,.step:hover,.price:hover{
    transform:translateY(-3px);border-color:rgba(183,255,0,.16)!important;
    box-shadow:0 28px 68px rgba(0,0,0,.28),inset 0 1px rgba(255,255,255,.035)!important;
  }
}

@media(max-width:820px){
  .hero{padding:58px 0 48px!important}
  .hero-grid{gap:34px!important}
  .product{transform:none!important}
}

@media(max-width:640px){
  .wrap{width:min(var(--max),calc(100% - 32px))!important}
  header .nav{height:64px!important}
  .brand-text,.links,.btn-login{display:none!important}
  .brand-logo-img{width:48px!important;height:32px!important}
  .header-actions .btn-primary{
    min-height:44px!important;padding:0 18px!important;border-radius:999px!important;
    font-size:13px!important;
  }
  .hero{padding:54px 0 46px!important}
  .hero-grid{display:block!important}
  .hero h1{
    margin:16px 0 18px!important;
    font-size:clamp(50px,14.5vw,68px)!important;
    line-height:.91!important;
    letter-spacing:-.073em!important;
  }
  .hero-copy{font-size:18px!important;line-height:1.52!important}
  .hero-actions{display:grid!important;grid-template-columns:1fr!important;gap:10px!important}
  .hero-actions .btn{width:100%!important;min-height:58px!important}
  .micro{display:grid!important;gap:8px!important;margin-top:20px!important}
  .micro span{
    min-height:32px!important;padding:0!important;border:0!important;background:transparent!important;
  }
  .launch-offer{grid-template-columns:44px minmax(0,1fr)!important;padding:17px!important}
  .launch-offer .launch-copy strong{font-size:17px!important;line-height:1.17!important}
  .product{margin-top:28px!important;border-radius:26px!important}
  .stats{grid-template-columns:repeat(3,minmax(0,1fr))!important}
  .stat{padding:11px 9px!important}
  .stat strong{font-size:21px!important}
  .plan{grid-template-columns:1fr!important;gap:14px!important}
  .plan .pill{justify-self:start!important}
  .section-head{text-align:left!important;margin-left:0!important;margin-right:0!important}
  section{padding:54px 0!important}
  .cta{padding:30px 24px!important;border-radius:26px!important}
}

@media(prefers-reduced-motion:reduce){
  .product,.discipline-card,.feature,.step,.price,.launch-offer,.btn{transition:none!important;transform:none!important}
}
