/* Landing page for replayer.live. Tokens from coaching.css; the hero and Pro card stay dark in both themes. */
body.L{padding:0}
.lw{max-width:1140px;margin:0 auto;padding:0 max(20px,env(safe-area-inset-left))}
.L h1,.L h2,.L h3{text-wrap:balance}
.eyebrow{display:inline-block;font-size:12px;font-weight:700;letter-spacing:1.4px;text-transform:uppercase;color:var(--accent)}
.eyebrow.light{color:#D9A445}

/* nav */
.lnav{position:sticky;top:0;z-index:20;background:color-mix(in srgb,#0B1110 82%,transparent);backdrop-filter:saturate(1.4) blur(12px);-webkit-backdrop-filter:saturate(1.4) blur(12px);border-bottom:1px solid transparent;transition:border-color .2s}
.lnav.scrolled{border-bottom-color:rgba(255,255,255,.08)}
.navin{display:flex;align-items:center;gap:20px;min-height:68px;padding-top:env(safe-area-inset-top)}
.lnav .logo{color:#F1F4F2}.lnav .logo .by{color:#94A29B}
.nlinks{display:flex;gap:2px;margin-left:auto}
.nlinks a{color:#C9D2CD;text-decoration:none;font-weight:600;font-size:14.5px;padding:8px 12px;border-radius:8px}
.nlinks a:hover{color:#fff;background:rgba(255,255,255,.06)}
.ncta{min-height:40px;font-size:14px}
.L .btn.primary{background:#D9A445;border-color:#D9A445;color:#1A1408}
.L .btn.primary:hover{background:#E4B256;border-color:#E4B256}

/* hero */
.hero2{background:radial-gradient(1100px 520px at 78% 30%,rgba(31,92,75,.55),transparent 65%),radial-gradient(700px 400px at 10% 0%,rgba(217,164,69,.12),transparent 60%),#0B1110;color:#EEF2EF;margin-top:-65px;padding:65px 0 0}
.hgrid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.12fr);gap:48px;align-items:center;padding-top:56px;padding-bottom:40px}
.pill{display:inline-flex;align-items:center;gap:8px;font-size:13px;font-weight:600;color:#C9D2CD;padding:6px 12px;border-radius:999px;border:1px solid rgba(255,255,255,.12);background:rgba(255,255,255,.04)}
.pill i{width:7px;height:7px;border-radius:50%;background:#3FCB8A;box-shadow:0 0 0 4px rgba(63,203,138,.18)}
.hero2 h1{margin:18px 0 0;font:700 clamp(40px,5.6vw,66px)/1.02 var(--display);letter-spacing:-2px;color:#F5F7F6}
.hero2 h1 em{font-style:normal;background:linear-gradient(90deg,#E9BC62,#C98C2C);-webkit-background-clip:text;background-clip:text;color:transparent}
.hero2 p{margin:20px 0 0;font-size:18px;line-height:1.6;color:#A9B6AF;max-width:500px}
.hacts{display:flex;gap:10px;flex-wrap:wrap;margin-top:28px}
.btn.big{min-height:54px;padding:0 24px;font-size:16px;border-radius:12px}
.btn.ghostl{background:rgba(255,255,255,.06);border-color:rgba(255,255,255,.16);color:#EEF2EF}
.btn.ghostl:hover{background:rgba(255,255,255,.12)}
.trust{list-style:none;margin:22px 0 0;padding:0;display:flex;flex-wrap:wrap;gap:8px 18px;font-size:13.5px;color:#94A29B}
.trust li{display:flex;align-items:center;gap:7px}
.trust li::before{content:"";width:14px;height:14px;border-radius:50%;background:rgba(63,203,138,.16) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%233FCB8A' stroke-width='3.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12l5 5 9-10'/%3E%3C/svg%3E") center/9px no-repeat}
.hshot{display:block;border-radius:18px;overflow:hidden;box-shadow:0 40px 80px rgba(0,0,0,.55),0 0 0 1px rgba(255,255,255,.08),0 0 80px rgba(63,203,138,.08);transition:transform .3s}
.hshot:hover{transform:translateY(-4px)}
.hshot img{display:block;width:100%;height:auto}
.sites{display:flex;flex-wrap:wrap;align-items:center;gap:8px 26px;padding-top:22px;padding-bottom:26px;border-top:1px solid rgba(255,255,255,.07);font-size:13px;color:#7D8B84}
.sites span{font-weight:600;margin-right:4px}
.sites b{font:700 15px var(--display);color:#B9C4BE;letter-spacing:-.2px;opacity:.85}

/* stats */
.stats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:0;margin-top:-1px;padding-top:36px;padding-bottom:8px}
.stats div{padding:4px 22px;border-left:1px solid var(--line)}
.stats div:first-child{border-left:0;padding-left:0}
.stats b{display:block;font:700 34px/1.1 var(--display);letter-spacing:-1px}
.stats span{color:var(--muted);font-size:14px}

/* sections */
.blk{padding-top:72px}
.shd{max-width:640px;margin-bottom:28px}
.shd h2{margin:8px 0 0;font:700 clamp(26px,3.2vw,36px)/1.15 var(--display);letter-spacing:-.8px}
.tcols{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}
.tcol{display:flex;flex-direction:column;gap:10px}
.tcol h3{display:flex;align-items:baseline;gap:10px;margin:0 0 4px;font:700 13px var(--body);letter-spacing:1.2px;text-transform:uppercase;color:var(--muted)}
.tcol h3 span{font-family:var(--mono);color:var(--accent)}
.titem{display:flex;gap:14px;align-items:flex-start;padding:16px;border-radius:14px;background:var(--surface);border:1px solid var(--line);color:inherit;text-decoration:none;transition:border-color .15s,box-shadow .15s,transform .15s}
.titem:hover{border-color:color-mix(in srgb,var(--accent) 55%,var(--line));box-shadow:0 10px 24px rgba(16,24,20,.08);transform:translateY(-1px)}
.titem .ti{flex:none;width:40px;height:40px;border-radius:10px;display:flex;align-items:center;justify-content:center;background:color-mix(in srgb,var(--accent) 13%,transparent);color:var(--accent)}
.titem .ti svg{width:20px;height:20px}
.titem b{display:block;font:700 16.5px/1.25 var(--display)}
.titem small{display:block;margin-top:3px;color:var(--muted);font-size:14px;line-height:1.45}
.titem.big{background:linear-gradient(160deg,color-mix(in srgb,var(--accent) 10%,var(--surface)),var(--surface) 70%);border-color:color-mix(in srgb,var(--accent) 35%,var(--line))}
.steps2{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;counter-reset:s;position:relative}
.steps2 li{position:relative;padding:22px;border-radius:16px;background:var(--surface);border:1px solid var(--line)}
.steps2 .n{display:inline-flex;width:36px;height:36px;border-radius:10px;align-items:center;justify-content:center;background:var(--ink);color:var(--bg);font:700 16px var(--display);margin-bottom:14px}
.steps2 b{display:block;font:700 18px var(--display)}
.steps2 p{margin:6px 0 0;color:var(--muted);font-size:14.5px}

/* pro */
.procard{display:grid;grid-template-columns:minmax(0,1.4fr) minmax(0,.8fr);gap:30px;align-items:center;padding:40px;border-radius:22px;color:#EEF2EF;background:radial-gradient(600px 300px at 90% 10%,rgba(217,164,69,.22),transparent 60%),radial-gradient(500px 300px at 0% 100%,rgba(31,92,75,.5),transparent 60%),#0E1513;box-shadow:0 30px 60px rgba(10,16,13,.18)}
.procard h2{margin:10px 0 0;font:700 clamp(26px,3vw,36px)/1.1 var(--display);letter-spacing:-.8px;color:#F5F7F6}
.procard ul{list-style:none;margin:20px 0 0;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px 22px;font-size:15px;color:#C3CDC8}
.procard li{display:flex;gap:9px}
.procard li::before{content:"";flex:none;margin-top:3px;width:16px;height:16px;border-radius:50%;background:rgba(217,164,69,.18) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23D9A445' stroke-width='3.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12l5 5 9-10'/%3E%3C/svg%3E") center/10px no-repeat}
.pprice{display:flex;flex-direction:column;align-items:flex-start;gap:8px;padding:24px;border-radius:16px;background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.1)}
.pprice b{font:700 48px/1 var(--display);letter-spacing:-1.5px;color:#fff}
.pprice span{color:#94A29B;font-size:14px;margin-bottom:8px}
.pprice .btn{width:100%}
.plink{color:#C9D2CD;font-size:14px;align-self:center}
.coachcta{display:flex;justify-content:space-between;align-items:center;gap:16px;flex-wrap:wrap;padding:24px 28px;border-radius:16px;border:1px solid var(--line);background:var(--surface)}
.coachcta b{display:block;font:700 19px var(--display)}
.coachcta span{color:var(--muted)}

/* footer */
.lfoot{margin-top:88px;border-top:1px solid var(--line);background:var(--surface)}
.fgrid2{display:grid;grid-template-columns:1.6fr repeat(4,minmax(0,1fr));gap:28px;padding-top:44px;padding-bottom:30px}
.fgrid2 h4{margin:4px 0 12px;font:700 12px var(--body);letter-spacing:1.2px;text-transform:uppercase;color:var(--muted)}
.fgrid2 div>a{display:block;color:var(--ink);text-decoration:none;font-size:14.5px;padding:4px 0}
.fgrid2 div>a:hover{color:var(--accent)}
.fbrand p{color:var(--muted);font-size:14px;margin:14px 0 8px;max-width:260px}
.fbrand>a:last-child{color:var(--accent)!important}
.fbase{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;border-top:1px solid var(--line);padding-top:16px;padding-bottom:max(24px,env(safe-area-inset-bottom));font-size:13px;color:var(--muted)}

@media (max-width:980px){.nlinks{display:none}.ncta{margin-left:auto}.hgrid{grid-template-columns:minmax(0,1fr);gap:32px;padding-top:34px}.tcols,.steps2{grid-template-columns:minmax(0,1fr)}.procard{grid-template-columns:minmax(0,1fr);padding:28px}.fgrid2{grid-template-columns:repeat(2,minmax(0,1fr))}.fbrand{grid-column:1/-1}.stats{grid-template-columns:repeat(2,minmax(0,1fr));row-gap:22px}.stats div:nth-child(3){border-left:0;padding-left:0}}
@media (max-width:560px){.lnav .logo .by{display:none}.ncta{min-height:38px;padding:0 12px;font-size:13px}.hero2 h1{letter-spacing:-1.4px}.hero2 p{font-size:16.5px}.hacts .btn{width:100%}.procard ul{grid-template-columns:minmax(0,1fr)}.blk{padding-top:56px}.stats b{font-size:28px}.stats div{padding:4px 14px}.sites{gap:6px 16px}.sites span{width:100%}}
.fgrid2 .fbrand>a.logo{display:flex;padding:0}
