﻿
/* ============================================================
   LANDING  (main page — https://axeno.pro/)
   ============================================================ */
.landing{position:relative;z-index:1;min-height:100vh;overflow-x:hidden}

.lp-wrap{max-width:1180px;margin:0 auto;padding:0 24px;position:relative;z-index:2}

/* header */
.lp-header{position:sticky;top:0;z-index:25;background:rgba(8,9,16,.74);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);border-bottom:1px solid var(--line)}
.lp-head-in{display:flex;align-items:center;justify-content:space-between;gap:16px;height:68px}
.lp-nav{display:flex;gap:2px;flex-wrap:wrap}
.lp-nav a{font-size:13.4px;color:var(--text-dim);text-decoration:none;padding:8px 12px;border-radius:10px;transition:.16s}
.lp-nav a:hover{background:var(--surface-2);color:var(--text);text-decoration:none}

/* hero */
.lp-hero{padding:64px 0 72px}
.lp-hero-grid{display:grid;grid-template-columns:1.06fr .94fr;gap:56px;align-items:start}
.lp-pill{display:inline-flex;align-items:center;gap:8px;font-size:12.2px;font-weight:600;color:#d8ccff;
  padding:7px 14px;border-radius:99px;background:linear-gradient(135deg,rgba(139,92,255,.18),rgba(34,211,238,.1));
  border:1px solid rgba(139,92,255,.32)}
.lp-h1{font-size:53px;line-height:1.05;letter-spacing:-.042em;font-weight:790;margin:18px 0 20px}
.lp-lead{font-size:16.2px;color:var(--text-dim);line-height:1.72;max-width:56ch}
.lp-cta{display:flex;gap:12px;flex-wrap:wrap;margin-top:28px}
.lp-trust{display:flex;gap:18px;flex-wrap:wrap;margin-top:16px;font-size:12.4px;color:var(--text-mute)}
.lp-stat-row{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-top:36px;max-width:520px}
.lp-stat{background:var(--surface);border:1px solid var(--line);border-radius:16px;padding:14px 16px;transition:.2s}
.lp-stat:hover{border-color:var(--line-strong);background:var(--surface-2);transform:translateY(-2px)}
.lp-stat b{display:block;font-size:20px;font-weight:760;letter-spacing:-.02em;
  background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent}
.lp-stat span{font-size:11.6px;color:var(--text-mute);line-height:1.4;display:block;margin-top:2px}

/* auth card */
.lp-auth{position:sticky;top:88px}
.lp-auth-card{
  background:rgba(13,14,24,.74);backdrop-filter:blur(26px);-webkit-backdrop-filter:blur(26px);
  border:1px solid var(--line-strong);border-radius:24px;padding:22px;
  display:flex;flex-direction:column;gap:13px;box-shadow:var(--shadow-lg);position:relative;overflow:hidden;
}
.lp-auth-card::before{
  content:"";position:absolute;inset:0;pointer-events:none;
  background:radial-gradient(420px 160px at 100% 0%,rgba(139,92,255,.16),transparent 70%);
}
.lp-auth-head{position:relative}
.lp-auth-title{font-size:19px;font-weight:720;letter-spacing:-.02em}
.lp-auth-sub{font-size:12.6px;color:var(--text-mute);margin-top:2px}
.lp-auth-foot{display:flex;align-items:center;gap:7px;font-size:11.8px;color:var(--text-mute);
  border-top:1px solid var(--line);padding-top:12px;margin-top:2px}
.lp-auth-note{font-size:11.6px;color:var(--text-mute);text-align:center;margin-top:10px;line-height:1.5}

/* sections */
.lp-section{padding:76px 0;border-top:1px solid var(--line);scroll-margin-top:84px}
.lp-hero, #top{scroll-margin-top:84px}
.lp-eyebrow{font-size:11.4px;letter-spacing:.15em;text-transform:uppercase;color:var(--brand-2);font-weight:700}
.lp-h2{font-size:35px;letter-spacing:-.036em;margin:10px 0 10px;font-weight:770;line-height:1.12}
.lp-sub{font-size:14.8px;color:var(--text-dim);line-height:1.7;max-width:70ch;margin-bottom:30px}

/* features */
.lp-feat-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(292px,1fr));gap:16px}
.lp-feat{background:var(--surface);border:1px solid var(--line);border-radius:20px;padding:24px;transition:.22s;position:relative;overflow:hidden}
.lp-feat::after{content:"";position:absolute;inset:0;pointer-events:none;opacity:0;transition:opacity .25s;
  background:radial-gradient(340px 130px at 100% 0%,rgba(139,92,255,.16),transparent 70%)}
.lp-feat:hover{border-color:rgba(139,92,255,.42);transform:translateY(-3px);box-shadow:var(--shadow-md)}
.lp-feat:hover::after{opacity:1}
.lp-ico{width:44px;height:44px;border-radius:14px;background:var(--grad-soft);border:1px solid var(--line-strong);
  display:grid;place-items:center;font-size:20px;margin-bottom:15px}
.lp-feat h3{font-size:15.6px;letter-spacing:-.01em;margin-bottom:7px}
.lp-feat p{font-size:13.3px;color:var(--text-dim);line-height:1.62}

/* steps */
.lp-steps{display:grid;grid-template-columns:repeat(auto-fit,minmax(262px,1fr));gap:16px}
.lp-step{background:var(--surface);border:1px solid var(--line);border-radius:20px;padding:26px 24px;transition:.22s}
.lp-step:hover{border-color:var(--line-strong);transform:translateY(-3px)}
.lp-step-num{width:36px;height:36px;border-radius:12px;background:var(--grad);color:#fff;font-weight:800;font-size:15px;
  display:grid;place-items:center;margin-bottom:15px;box-shadow:0 10px 24px rgba(99,102,241,.34)}
.lp-step h3{font-size:15.4px;margin-bottom:7px}
.lp-step p{font-size:13.2px;color:var(--text-dim);line-height:1.62}

/* two column + phone mock */
.lp-two{display:grid;grid-template-columns:1fr 380px;gap:52px;align-items:center}
.lp-checks{margin-top:6px;display:flex;flex-direction:column;gap:10px}
.lp-checks li{position:relative;padding-left:28px;font-size:13.6px;color:var(--text-dim);line-height:1.5}
.lp-checks li::before{content:"✓";position:absolute;left:0;top:-1px;width:19px;height:19px;border-radius:6px;
  background:rgba(52,211,153,.16);color:#a7f3d0;display:grid;place-items:center;font-size:11px;font-weight:800}
.lp-phone{background:rgba(6,7,13,.85);border:1px solid var(--line-strong);border-radius:26px;padding:16px;
  box-shadow:var(--shadow-lg);position:relative}
.lp-phone::before{content:"";position:absolute;inset:-1px;border-radius:26px;pointer-events:none;
  background:linear-gradient(135deg,rgba(139,92,255,.35),transparent 45%,rgba(34,211,238,.3));
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;padding:1px}
.lp-phone-top{display:flex;align-items:center;gap:9px;margin-bottom:12px}
.lp-phone-ava{width:32px;height:32px;border-radius:10px;background:var(--grad);display:grid;place-items:center;font-weight:800;color:#fff;font-size:13px}
.lp-phone-top b{font-size:13px;display:block}
.lp-phone-top small{font-size:10.8px;color:var(--text-mute)}
.lp-phone-media{height:130px;border-radius:16px;background:linear-gradient(150deg,rgba(139,92,255,.28),rgba(34,211,238,.12));
  display:grid;place-items:center;font-size:38px;margin-bottom:10px}
.lp-phone-text{font-size:13px;line-height:1.5;color:var(--text)}
.lp-phone-adv{margin-top:12px;padding:12px;border-radius:14px;background:rgba(251,191,36,.07);border:1px dashed rgba(251,191,36,.34)}
.lp-adv-label{font-size:9.8px;letter-spacing:.13em;text-transform:uppercase;color:#fde68a;font-weight:700}

/* pricing */
.lp-price-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(232px,1fr));gap:16px}
.lp-price-card{position:relative;background:var(--surface);border:1px solid var(--line);border-radius:20px;padding:24px;transition:.22s}
.lp-price-card:hover{transform:translateY(-3px);border-color:var(--line-strong);box-shadow:var(--shadow-md)}
.lp-price-card.hot{border-color:rgba(139,92,255,.48);background:linear-gradient(160deg,rgba(139,92,255,.12),rgba(255,255,255,.02));box-shadow:0 14px 44px rgba(99,102,241,.18)}
.lp-price-badge{position:absolute;top:-11px;right:18px}
.lp-price-name{font-size:13.2px;color:var(--text-dim);font-weight:600}
.lp-price-value{display:flex;align-items:baseline;gap:6px;margin:10px 0 4px}
.lp-price-value b{font-size:32px;font-weight:780;letter-spacing:-.03em}
.lp-price-value span{font-size:15px}
.lp-price-meta{font-size:12.2px;color:var(--text-mute)}
.lp-price-desc{font-size:12.7px;color:var(--text-dim);line-height:1.55;margin:12px 0 14px;min-height:38px}
.lp-price-feats{display:flex;flex-direction:column;gap:6px;font-size:12.3px;color:var(--text-dim);margin-bottom:16px}
.lp-price-feats li::before{content:"✓ ";color:var(--ok)}

/* faq */
.lp-faq{max-width:880px}
.lp-det{background:var(--surface);border:1px solid var(--line);border-radius:16px;padding:17px 20px;margin-bottom:10px;transition:.18s}
.lp-det:hover{border-color:var(--line-strong)}
.lp-det summary{cursor:pointer;font-weight:620;font-size:14.6px;list-style:none;display:flex;align-items:center;gap:10px}
.lp-det summary::-webkit-details-marker{display:none}
.lp-det summary::before{content:"＋";color:var(--brand-2);font-weight:700;font-size:15px}
.lp-det[open] summary::before{content:"−"}
.lp-det p{margin-top:11px;font-size:13.4px;color:var(--text-dim);line-height:1.68}

/* final cta */
.lp-final{padding:76px 0;border-top:1px solid var(--line)}
.lp-final-card{text-align:center;padding:54px 26px;border-radius:28px;position:relative;overflow:hidden;
  background:linear-gradient(135deg,rgba(139,92,255,.18),rgba(34,211,238,.09));border:1px solid rgba(139,92,255,.32)}
.lp-final-card h2{font-size:32px;letter-spacing:-.035em;margin-bottom:10px}
.lp-final-card p{font-size:14.6px;color:var(--text-dim);margin-bottom:24px}

/* footer */
.lp-footer{border-top:1px solid var(--line);padding:26px 0}
.lp-foot-in{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap}
.lp-foot-links{display:flex;gap:18px;font-size:12.8px;flex-wrap:wrap}
.lp-foot-links a{color:var(--text-mute);text-decoration:none}
.lp-foot-links a:hover{color:var(--brand-2);text-decoration:none}

/* reveal on scroll */
.reveal{opacity:0;transform:translateY(22px);transition:opacity .65s cubic-bezier(.2,.8,.2,1),transform .65s cubic-bezier(.2,.8,.2,1)}
.reveal.in{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){.reveal{opacity:1;transform:none;transition:none}}

/* responsive */
@media (max-width:1080px){
  .lp-hero-grid{grid-template-columns:1fr;gap:36px}
  .lp-auth{position:static;max-width:480px;margin:8px auto 0;width:100%}
  .lp-hero{padding:36px 0 52px}
  .lp-h1{font-size:41px}
  .lp-two{grid-template-columns:1fr;gap:34px}
  .lp-phone{max-width:360px;margin:0 auto}
  .lp-section{padding:56px 0}
}
@media (max-width:860px){
  .lp-nav{display:none}
  .lp-hide-sm{display:none}
  .lp-h1{font-size:34px}
  .lp-h2{font-size:26px}
  .lp-stat-row{max-width:none}
  .lp-final-card h2{font-size:25px}
  .lp-final-card{padding:38px 20px}
}
@media (max-width:560px){
  .lp-wrap{padding:0 16px}
  .lp-h1{font-size:29px}
  .lp-lead{font-size:14.6px}
  .lp-stat-row{grid-template-columns:1fr;gap:8px}
  .lp-stat{display:flex;align-items:baseline;gap:10px;padding:11px 14px}
  .lp-stat b{font-size:17px}
  .lp-stat span{margin-top:0}
  .lp-cta .btn{width:100%}
  .lp-auth-card{padding:17px}
  .lp-feat,.lp-step{padding:19px}
}

/* ---------------- hero logo (top-tier effects) ---------------- */
.hero-logo{
  position:relative;width:132px;height:132px;margin:4px 0 22px;
  perspective:700px;cursor:pointer;
  transform:translateY(0) rotateX(calc(var(--my,0) * -7deg)) rotateY(calc(var(--mx,0) * 9deg));
  transition:transform .25s ease-out;
  animation:hlFloat 7s ease-in-out infinite;
}
@keyframes hlFloat{0%,100%{translate:0 0}50%{translate:0 -7px}}
.hero-logo:hover{animation-play-state:paused}
.hl-halo{
  position:absolute;inset:-22px;border-radius:50%;pointer-events:none;filter:blur(26px);opacity:.65;
  background:conic-gradient(from 0deg,rgba(139,92,255,.85),rgba(34,211,238,.7),rgba(244,114,182,.55),rgba(139,92,255,.85));
  animation:hlHaloSpin 9s linear infinite;
}
@keyframes hlHaloSpin{to{transform:rotate(360deg)}}
.hl-shine{
  position:absolute;inset:0;border-radius:36px;pointer-events:none;overflow:hidden;
}
.hl-shine::after{
  content:"";position:absolute;top:-60%;left:-140%;width:70%;height:220%;
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.55),transparent);
  transform:rotate(22deg);animation:hlShine 5.5s ease-in-out infinite;
}
@keyframes hlShine{0%{left:-140%}55%,100%{left:170%}}
.hl-svg{width:100%;height:100%;display:block;overflow:visible}
.hl-ring{transform-origin:60px 60px}
.hl-r1{animation:hlSpin 16s linear infinite}
.hl-r2{animation:hlSpin 11s linear infinite reverse}
.hl-r3{animation:hlSpin 5.5s linear infinite}
@keyframes hlSpin{to{transform:rotate(360deg)}}
.hl-a,.hl-bar{
  filter:drop-shadow(0 0 7px rgba(139,92,255,.7));
  animation:hlGlow 3.2s ease-in-out infinite;
}
.hl-bar{animation-delay:.55s}
@keyframes hlGlow{
  0%,100%{filter:drop-shadow(0 0 5px rgba(139,92,255,.55))}
  50%{filter:drop-shadow(0 0 16px rgba(34,211,238,1))}
}
.hl-orbit{transform-origin:60px 60px;animation:hlSpin 7s linear infinite}
.hl-orbit-2{animation-duration:4.4s;animation-direction:reverse}
.hero-logo:hover .hl-r1,.hero-logo:hover .hl-r2,.hero-logo:hover .hl-r3{animation-duration:2.2s}
@media (prefers-reduced-motion:reduce){
  .hero-logo,.hl-halo,.hl-shine::after,.hl-ring,.hl-a,.hl-bar,.hl-orbit{animation:none!important}
}