/* ══════════════════════════════════════════════
   LANDING-PAGE HERO — same look as the homepage hero (beams background, letter
   reveal, Text Rotate pill) with a page-specific stats card on the right.
   Self-contained: only needs the brand tokens from styles.css.
   ══════════════════════════════════════════════ */
.lp-hero{position:relative;overflow:hidden;isolation:isolate;background:#0a0a0a;padding:150px 5% 90px;min-height:88vh;display:flex;align-items:center}
.lp-beams{position:absolute;inset:0;width:100%;height:100%;z-index:0}
.lp-bg-fade{position:absolute;inset:0;z-index:0;pointer-events:none;background:radial-gradient(ellipse 45% 55% at 25% 52%,rgba(10,10,10,.5) 0%,transparent 75%),linear-gradient(180deg,transparent 78%,rgba(10,10,10,.9) 100%)}
.lp-inner{position:relative;z-index:2;width:100%;max-width:var(--container,1200px);margin:0 auto;display:grid;grid-template-columns:1.3fr .7fr;gap:3rem;align-items:center}
.lp-inner>*{min-width:0}

/* entrance */
.lp-in{opacity:0;animation:lp-up .8s cubic-bezier(.22,1,.36,1) forwards}
.lp-d1{animation-delay:.1s}.lp-d3{animation-delay:.9s}.lp-d4{animation-delay:1.05s}.lp-d5{animation-delay:1.2s}.lp-d6{animation-delay:1.35s}
@keyframes lp-up{from{opacity:0;transform:translateY(22px)}to{opacity:1;transform:none}}

/* left */
.lp-left{display:flex;flex-direction:column;gap:1.5rem;text-align:left}
.lp-badge{align-self:flex-start;display:inline-flex;align-items:center;gap:.6rem;padding:.5rem 1rem;border-radius:999px;border:1px solid rgba(250,243,225,.12);background:rgba(250,243,225,.05);font-family:var(--font-body);font-size:.72rem;font-weight:700;letter-spacing:1.2px;text-transform:uppercase;color:rgba(250,243,225,.85)}
.lp-dot{width:7px;height:7px;flex-shrink:0;border-radius:50%;background:var(--orange);animation:lp-ping 1.8s infinite}
@keyframes lp-ping{0%{box-shadow:0 0 0 0 rgba(255,85,85,.6)}70%{box-shadow:0 0 0 8px rgba(255,85,85,0)}100%{box-shadow:0 0 0 0 rgba(255,85,85,0)}}

.lp-title{font-family:var(--font-display);font-weight:800;font-size:clamp(2rem,3.7vw,3.4rem);line-height:1.06;letter-spacing:-.03em;color:var(--cream);margin:0}
.lp-title em{font-style:normal;color:#ff6f5e}
/* masked letter reveal (letters are split by lp-hero.js) */
.lp-w{display:inline-block;overflow:hidden;vertical-align:top;padding:.04em .02em .14em;margin:-.04em -.02em -.14em}
.lp-c{display:inline-block;transform:translateY(110%) rotate(9deg);transform-origin:0 100%;animation:lp-char .9s cubic-bezier(.2,.9,.25,1) forwards;animation-delay:calc(.15s + var(--ci) * 26ms)}
@keyframes lp-char{to{transform:none}}

/* Text Rotate pill */
.lp-rot-line{display:flex;align-items:center;flex-wrap:wrap;gap:.25em .4em;margin-top:-.3rem;font-family:var(--font-display);font-weight:800;font-size:clamp(1.25rem,2vw,1.8rem);letter-spacing:-.03em;line-height:1.1;color:rgba(250,243,225,.55)}
.lp-rot{position:relative;display:inline-flex;overflow:hidden;padding:.12em .42em .18em;border-radius:.34em;background:linear-gradient(135deg,#ff5555 0%,#ff6b5a 55%,#ff8a5c 100%);color:#fff;white-space:nowrap;box-shadow:0 14px 40px -12px rgba(255,85,85,.75),inset 0 1px 0 rgba(255,255,255,.3);transition:width .6s cubic-bezier(.34,1.35,.64,1)}
.lp-rot::after{content:"";position:absolute;inset:0;background:linear-gradient(105deg,transparent 35%,rgba(255,255,255,.28) 50%,transparent 65%);transform:translateX(-100%);animation:lp-sweep 3s 1.6s ease-in-out infinite;pointer-events:none}
@keyframes lp-sweep{60%,100%{transform:translateX(100%)}}
.lp-rot-word{display:inline-flex}
.lp-rot .ch{display:inline-block;transform:translateY(110%);opacity:0;transition:transform .6s cubic-bezier(.34,1.5,.64,1),opacity .3s ease}
.lp-rot .ch.in{transform:none;opacity:1}
.lp-rot .ch.out{transform:translateY(-125%);opacity:0;transition:transform .38s cubic-bezier(.55,0,.75,.2),opacity .3s ease}
.lp-sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

.lp-sub{max-width:580px;margin:0;font-family:var(--font-body);font-size:1.05rem;line-height:1.7;color:rgba(250,243,225,.65)}
.lp-sub .lp-tw{opacity:0;filter:blur(8px);transition:opacity .5s ease,filter .5s ease;transition-delay:calc(var(--i) * 30ms)}
.lp-sub.go .lp-tw{opacity:1;filter:none}

.lp-pills{display:flex;flex-wrap:wrap;gap:.5rem}
.lp-pills span{padding:.35rem .8rem;border-radius:999px;border:1px solid rgba(250,243,225,.12);background:rgba(250,243,225,.04);font-size:.78rem;font-weight:700;color:rgba(250,243,225,.75)}

.lp-ctas{display:flex;flex-wrap:wrap;gap:1rem}
.lp-btn{display:inline-flex;align-items:center;justify-content:center;gap:.6rem;padding:1rem 1.8rem;border-radius:999px;font-family:var(--font-body);font-size:.95rem;font-weight:700;text-decoration:none;transition:transform .25s ease,background .25s ease,box-shadow .25s ease,border-color .25s ease}
.lp-btn svg{width:16px;height:16px;transition:transform .25s ease}
.lp-btn-primary{background:var(--orange);color:#fff;box-shadow:0 10px 36px -8px rgba(255,85,85,.65),inset 0 1px 0 rgba(255,255,255,.25)}
.lp-btn-primary:hover{transform:translateY(-2px) scale(1.02);box-shadow:0 16px 44px -8px rgba(255,85,85,.8),inset 0 1px 0 rgba(255,255,255,.25)}
.lp-btn-primary:hover svg{transform:translateX(4px)}
.lp-btn-ghost{color:var(--cream);border:1px solid rgba(250,243,225,.14);background:rgba(250,243,225,.05)}
.lp-btn-ghost:hover{background:rgba(250,243,225,.1);border-color:rgba(250,243,225,.28)}

.lp-checks{list-style:none;margin:0;padding:0;display:grid;gap:.45rem}
.lp-checks li{position:relative;padding-left:1.4rem;font-size:.9rem;color:rgba(250,243,225,.7)}
.lp-checks li::before{content:"";position:absolute;left:0;top:.5em;width:7px;height:7px;border-radius:50%;background:var(--orange)}

.lp-proof{display:flex;align-items:center;gap:1rem;flex-wrap:wrap}
.lp-avatars{display:flex}
.lp-avatars span{width:36px;height:36px;border-radius:50%;display:grid;place-items:center;font-size:.7rem;font-weight:800;color:#fff;border:2px solid #0a0a0a;margin-left:-10px}
.lp-avatars span:first-child{margin-left:0}
.lp-avatars span:nth-child(1){background:linear-gradient(135deg,#ff5555,#ff8a5c)}
.lp-avatars span:nth-child(2){background:linear-gradient(135deg,#7c5cff,#b18cff)}
.lp-avatars span:nth-child(3){background:linear-gradient(135deg,#1fa971,#a3d78a)}
.lp-avatars span:nth-child(4){background:linear-gradient(135deg,#2d7ff9,#64b5ff)}
.lp-avatars span:nth-child(5){background:#2a1a1c;color:var(--cream)}
.lp-proof-text{font-size:.85rem;line-height:1.4;color:rgba(250,243,225,.55)}
.lp-proof-text b{color:var(--cream)}
.lp-proof-text .lp-stars{color:#ffc857;letter-spacing:1px}

/* right — page-specific stats card */
.lp-card{position:relative;overflow:hidden;padding:1.8rem;border-radius:28px;border:1px solid rgba(250,243,225,.1);background:linear-gradient(160deg,rgba(250,243,225,.08),rgba(250,243,225,.02));backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);box-shadow:0 30px 80px -30px rgba(0,0,0,.85),inset 0 1px 0 rgba(255,255,255,.06)}
.lp-card-glow{position:absolute;top:-90px;right:-90px;width:240px;height:240px;border-radius:50%;background:rgba(255,85,85,.2);filter:blur(60px);pointer-events:none}
.lp-card-head{position:relative;display:flex;align-items:center;justify-content:space-between;gap:1rem;margin-bottom:1.4rem}
.lp-card-head h2{margin:0;font-family:var(--font-display);font-size:1rem;font-weight:800;color:var(--cream);letter-spacing:-.01em}
.lp-live{display:inline-flex;align-items:center;gap:.4rem;padding:.3rem .7rem;border-radius:999px;font-size:.6rem;font-weight:800;letter-spacing:1px;color:#a3d78a;background:rgba(163,215,138,.08);border:1px solid rgba(163,215,138,.25);white-space:nowrap}
.lp-live i{width:6px;height:6px;border-radius:50%;background:#a3d78a;animation:lp-ping-g 1.6s infinite}
@keyframes lp-ping-g{0%{box-shadow:0 0 0 0 rgba(163,215,138,.7)}70%{box-shadow:0 0 0 7px rgba(163,215,138,0)}100%{box-shadow:0 0 0 0 rgba(163,215,138,0)}}
.lp-stats{position:relative;display:grid;grid-template-columns:1fr 1fr;gap:1px;border-radius:18px;overflow:hidden;background:rgba(250,243,225,.08)}
.lp-stat{padding:1.2rem 1rem;background:rgba(14,10,12,.85);transition:background .25s}
.lp-stat:hover{background:rgba(30,16,18,.9)}
.lp-stat b{display:block;font-family:var(--font-display);font-size:1.7rem;font-weight:800;line-height:1;background:linear-gradient(135deg,#fff,#ffb3a7);-webkit-background-clip:text;background-clip:text;color:transparent}
.lp-stat span{display:block;margin-top:.45rem;font-size:.72rem;font-weight:700;letter-spacing:.6px;text-transform:uppercase;color:rgba(250,243,225,.5)}
.lp-card-foot{position:relative;display:flex;align-items:center;justify-content:space-between;gap:.8rem;margin-top:1.3rem;padding-top:1.2rem;border-top:1px solid rgba(250,243,225,.08);font-size:.85rem;color:rgba(250,243,225,.6)}
.lp-card-foot a{color:var(--cream);font-weight:800;text-decoration:none;white-space:nowrap}
.lp-card-foot a:hover{color:var(--orange)}

@media (max-width:1024px){
  .lp-inner{grid-template-columns:1fr;gap:2.5rem}
  .lp-right{max-width:520px}
}
@media (max-width:767px){
  .lp-hero{min-height:auto;padding:110px 16px 56px}
  .lp-left{gap:1.2rem}
  .lp-title{font-size:clamp(1.8rem,8vw,2.4rem);font-family:"Unbounded",system-ui,-apple-system,sans-serif}
  .lp-rot-line{font-size:clamp(1.2rem,5.6vw,1.6rem);font-family:"Unbounded",system-ui,-apple-system,sans-serif}
  .lp-sub{font-size:.98rem}
  .lp-badge{font-size:.6rem;letter-spacing:.8px}
  .lp-ctas{flex-direction:column}
  .lp-btn{width:100%}
  .lp-stat b{font-size:1.4rem}
}
@media (prefers-reduced-motion:reduce){
  .lp-in,.lp-c{opacity:1;transform:none;animation:none}
  .lp-dot,.lp-live i,.lp-rot::after{animation:none}
  .lp-rot,.lp-rot .ch{transition:none}
  .lp-sub .lp-tw{opacity:1;filter:none;transition:none}
}
