/* mypokerhaus — shared site styles (matches Home) */
@import url('https://fonts.googleapis.com/css2?family=JetBrains+Mono:wght@500;700&display=swap');
body{margin:0;background:var(--color-bg)}
.site{font-family:var(--font-body);color:var(--color-text);background:#0b0b0d;overflow:hidden;--mut0:#e9e3d8;--mut:#c9c4c4;--mut2:#7d7979;--mut3:#9b9797;--coral:#ff9783;--mono:'JetBrains Mono',ui-monospace,Menlo,monospace;--ink:#0b0b0d;--ink-2:#141416;--coral:#ff9783}
.site a,.site .btn,.site .tag{color:inherit;text-decoration:none}
.site .tag{white-space:nowrap;align-self:flex-start;border-radius:999px;padding:5px 12px;font-weight:700;font-size:11px;letter-spacing:.06em;text-transform:uppercase}
.kicker{display:flex;align-items:center;gap:10px;font-size:12px;font-weight:700;letter-spacing:.18em;text-transform:uppercase;color:var(--coral)}
.kicker-dark{color:var(--color-accent-700)}
.mono{font-family:var(--mono);font-weight:700;letter-spacing:.12em;text-transform:uppercase;font-size:10.5px}
.h-xl{font-family:var(--font-heading);font-size:clamp(46px,7vw,112px);line-height:1.04;letter-spacing:-.035em;font-weight:800;margin:0;text-wrap:balance}
.h-l{font-family:var(--font-heading);font-size:clamp(34px,4.6vw,60px);line-height:1;letter-spacing:-.025em;font-weight:800;margin:0;text-wrap:balance}
.h-m{font-family:var(--font-heading);font-size:clamp(26px,3vw,36px);line-height:1.06;letter-spacing:-.02em;font-weight:800;margin:0;text-wrap:pretty}
.lead{font-size:19px;line-height:1.55;margin:0;color:#c9c4c4;max-width:560px}
.lead-dark{color:var(--color-neutral-800)}
.outline{color:var(--color-accent);-webkit-text-stroke:0;transition:color .45s ease,text-shadow .45s ease}
.outline:hover{animation:neonOn 1.1s ease-out forwards}
@keyframes neonOn{0%{color:#ec3013;text-shadow:none}6%{color:#fff;text-shadow:0 0 1px #fff,0 0 6px #ffb3a8,0 0 18px #ff563c,0 0 40px #ec3013}10%{color:#ec3013;text-shadow:none}16%{color:#fff;text-shadow:0 0 1px #fff,0 0 6px #ffb3a8,0 0 18px #ff563c,0 0 40px #ec3013}22%{color:#c9290f;text-shadow:0 0 3px #ec3013}30%{color:#fff;text-shadow:0 0 1px #fff,0 0 5px #ffd2cb,0 0 14px #ff6a52,0 0 34px #ec3013,0 0 70px rgba(236,48,19,.7)}100%{color:#fff;text-shadow:0 0 1px #fff,0 0 6px #ffd2cb,0 0 16px #ff6a52,0 0 40px #ec3013,0 0 90px rgba(236,48,19,.65)}}
html[data-theme="light"] .outline:hover{animation-name:neonOnLight}
@keyframes neonOnLight{0%{color:#ec3013;text-shadow:none}6%{color:#ff3a1c;text-shadow:0 0 1px #fff,0 0 8px #fff,0 0 20px #ff6a52}10%{color:#ec3013;text-shadow:none}16%{color:#ff3a1c;text-shadow:0 0 1px #fff,0 0 8px #fff,0 0 20px #ff6a52}22%{color:#c9290f;text-shadow:none}30%,100%{color:#ff2e10;text-shadow:0 0 1px #fff,0 0 6px #fff,0 0 16px #ff8a76,0 0 36px rgba(236,48,19,.75)}}
/* buttons */
.site .btn{display:inline-flex;align-items:center;justify-content:center;white-space:nowrap;border-radius:999px;border:0;font-family:var(--font-body);font-weight:700;letter-spacing:.01em;padding:0 28px;height:54px;font-size:15px;gap:12px;cursor:pointer;transition:transform .3s cubic-bezier(.2,.7,.2,1),box-shadow .3s,background .25s,color .25s}
.site .btn:hover{transform:translateY(-3px)}
.site .btn-primary{background:#ec3013;color:#fff;box-shadow:0 10px 24px rgba(236,48,19,.28)}
.site .btn-primary:hover{box-shadow:0 18px 36px rgba(236,48,19,.4);background:#dd2b0f;color:#fff}
.site .btn-soft{background:#fff;color:#1a1917;border:1px solid rgba(26,25,23,.14);box-shadow:0 6px 18px rgba(26,25,23,.08)}
.site .btn-soft:hover{border-color:#1a1917}
.site .btn-glass{background:rgba(255,255,255,.1);color:#fff;border:1px solid rgba(255,255,255,.28);backdrop-filter:blur(10px)}
.site .btn-glass:hover{background:rgba(255,255,255,.2);color:#fff}
.site .btn-white{background:#fff;color:#1a1917;box-shadow:0 12px 30px rgba(0,0,0,.2)}
.site .btn-ink{background:#1a1917;color:#fff;box-shadow:0 10px 24px rgba(26,25,23,.22)}
.site .btn-sm{height:46px;padding:0 22px;font-size:14px}
.arrow{width:26px;height:26px;border-radius:50%;border:1.5px solid currentColor;display:inline-flex;align-items:center;justify-content:center;font-size:12px;flex:none;transition:transform .3s}
.btn:hover .arrow{transform:translateX(3px)}
/* hero */
.hero{position:relative;background:var(--ink);color:#fff;padding:120px 40px 96px;overflow:hidden}
.hero-grid{position:absolute;inset:0;pointer-events:none;background-image:linear-gradient(rgba(255,255,255,.045) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.045) 1px,transparent 1px);background-size:64px 64px;mask-image:radial-gradient(900px circle at 60% 30%,#000 30%,transparent 80%);-webkit-mask-image:radial-gradient(900px circle at 60% 30%,#000 30%,transparent 80%)}
.hero-in{position:relative;max-width:1240px;margin:0 auto;display:flex;flex-wrap:wrap;gap:56px;align-items:center}
.hero-copy{flex:1 1 520px;min-width:0;display:flex;flex-direction:column;gap:0}
.hero-side{flex:1 1 380px;min-width:0;display:flex;justify-content:center}
.wrap{max-width:1240px;margin:0 auto}
.sec{padding:110px 40px;background:var(--color-bg);color:var(--color-text)}
.sec-dark{background:var(--ink);color:#fff;position:relative;overflow:hidden}
.sec-surface{background:var(--color-surface)}
.glow{position:absolute;inset:0;pointer-events:none}
.band{background:var(--color-accent);color:#fff;padding:130px 40px;position:relative;overflow:hidden}
.band-ring{position:absolute;right:-120px;bottom:-160px;width:520px;height:520px;border-radius:50%;border:60px solid rgba(255,255,255,.12);pointer-events:none}
/* cards */
.cardgrid{display:grid;gap:2px;background:var(--color-divider);border:2px solid var(--color-divider)}
.feat{background:var(--color-bg);padding:40px 34px;display:flex;flex-direction:column;gap:16px;transition:transform .35s cubic-bezier(.2,.7,.2,1),background .3s,color .3s}
.feat:hover{transform:translateY(-6px);background:var(--color-text);color:#fff}
.feat .feat-n{display:block;width:32px;height:4px;border-radius:2px;background:var(--color-accent);margin-bottom:8px;transition:width .35s cubic-bezier(.2,.7,.2,1)}
.feat:hover .feat-n{width:56px}
.feat h3{font-family:var(--font-heading);font-size:21px;line-height:1.12;margin:0;font-weight:800}
.feat p{margin:0;font-size:15px;line-height:1.6;opacity:.8}
.frame{border-radius:24px;overflow:hidden;box-shadow:0 50px 100px rgba(0,0,0,.55),0 0 0 1px rgba(255,255,255,.12)}
.glass{border:1px solid rgba(255,255,255,.14);background:rgba(255,255,255,.05);backdrop-filter:blur(14px)}
/* pricing */
.plan{padding:40px 36px;display:flex;flex-direction:column;gap:18px;background:var(--color-bg);transition:transform .35s cubic-bezier(.2,.7,.2,1)}
.plan:hover{transform:translateY(-6px)}
.plan-hi{background:var(--ink);color:#fff;position:relative;overflow:hidden}
.plan-hi::before{content:"";position:absolute;inset:0;background:radial-gradient(420px circle at 80% 0%,rgba(236,48,19,.4),transparent 65%);pointer-events:none}
.plan>*{position:relative}
.price{font-family:var(--font-heading);font-size:52px;font-weight:800;line-height:1;letter-spacing:-.03em}
.price small{font-size:15px;font-weight:500;letter-spacing:0;opacity:.6}
.plan ul{margin:0;padding:0;list-style:none;display:flex;flex-direction:column;gap:10px;font-size:14.5px;line-height:1.5}
.plan li{display:flex;gap:12px;align-items:flex-start}
.plan li::before{content:"✓";flex:none;width:22px;height:22px;border-radius:50%;border:1.5px solid var(--color-accent);color:var(--color-accent);font-size:10px;font-weight:800;display:inline-flex;align-items:center;justify-content:center;margin-top:1px}
/* faq */
.faq{border-bottom:1px solid var(--color-divider);padding:24px 0;cursor:pointer;transition:padding .2s}
.faq:hover{padding-left:8px}
.faq-q{display:flex;justify-content:space-between;gap:24px;font-size:19px;font-weight:700;font-family:var(--font-heading)}
.faq-sign{width:34px;height:34px;border-radius:50%;border:1.5px solid var(--color-accent);color:var(--color-accent);display:inline-flex;align-items:center;justify-content:center;font-size:18px;flex:none}
.faq-a{margin:14px 0 0;font-size:15px;line-height:1.65;color:var(--color-neutral-800);max-width:720px}
/* form */
.fld{display:flex;flex-direction:column;gap:8px;font-size:12px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:#c9c4c4}
.fld input,.fld textarea{height:50px;padding:0 16px;font-size:15px;border-radius:14px;border:1px solid rgba(255,255,255,.14);background:rgba(255,255,255,.06);color:#fff;font-family:inherit;outline:none;transition:border-color .2s,background .2s;letter-spacing:0;text-transform:none;font-weight:500}
.fld textarea{height:auto;padding:14px 16px;resize:vertical;min-height:96px}
.fld input:focus,.fld textarea:focus{border-color:var(--color-accent);background:rgba(255,255,255,.09)}
/* motion */
.dot-live{width:8px;height:8px;border-radius:50%;background:#22c55e;animation:pulse 1.8s infinite;flex:none}
@keyframes pulse{0%,100%{box-shadow:0 0 0 0 rgba(34,197,94,.7)}70%{box-shadow:0 0 0 10px rgba(34,197,94,0)}}
.hi{animation:hi .9s cubic-bezier(.2,.7,.2,1) both}
.hi-1{animation-delay:.05s}.hi-2{animation-delay:.18s}.hi-3{animation-delay:.3s}.hi-4{animation-delay:.42s}.hi-5{animation-delay:.6s}
@keyframes hi{from{opacity:0;transform:translateY(28px)}to{opacity:1;transform:none}}
@supports (animation-timeline: view()){.rv{animation:rv linear both;animation-timeline:view();animation-range:entry 0% entry 35%}}
@keyframes rv{from{opacity:0;transform:translateY(36px)}to{opacity:1;transform:none}}
.lift{transition:transform .35s cubic-bezier(.2,.7,.2,1),box-shadow .35s}
.lift:hover{transform:translateY(-6px)}
.g2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px}
.g3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr))}
.g4{display:grid;grid-template-columns:repeat(4,minmax(0,1fr))}
@media (prefers-reduced-motion: reduce){.hi,.rv,.dot-live{animation:none !important}}
@media (max-width:980px){.g3,.g4{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:720px){.sec,.hero,.band{padding-left:20px !important;padding-right:20px !important}.g2,.g3,.g4{grid-template-columns:repeat(1,minmax(0,1fr))}}

/* ---------- LIGHT THEME (brand: white / black / red #E0182D) ---------- */
html[data-theme="light"] .site{background:#F4F4F5}
html[data-theme="light"] .sec{background:#FFFFFF}
html[data-theme="light"] .sec-surface{background:#F4F4F5 !important}
html[data-theme="light"] .hero{background-color:#F4F4F5 !important;background-image:radial-gradient(640px circle at 78% 20%,rgba(224,24,45,.16),transparent 62%),linear-gradient(180deg,#FFFFFF 0%,#F4F4F5 100%) !important;color:#0B0B0C !important;border-top:4px solid #E0182D}
html[data-theme="light"] .lead{color:#5C5C63}
html[data-theme="light"] .kicker{color:#C8102E}
html[data-theme="light"] .hero .mono{color:#5C5C63 !important}
html[data-theme="light"] .btn-glass{background:#0B0B0C;color:#fff;border:1px solid #0B0B0C;box-shadow:0 8px 20px rgba(11,11,12,.2)}
html[data-theme="light"] .btn-glass:hover{background:#222226;color:#fff}
html[data-theme="light"] .sec-dark{background:#0B0B0C !important;color:#fff !important}
html[data-theme="light"] .glass{background:#17171A;border-color:#2E2E33}
html[data-theme="light"] .frame{box-shadow:0 30px 70px rgba(11,11,12,.25),0 0 0 1px #DADADF}
html[data-theme="light"] .cardgrid{background:#DADADF;border-color:#DADADF}
html[data-theme="light"] .feat{background:#fff}
html[data-theme="light"] .feat:hover{background:#0B0B0C}
html[data-theme="light"] .plan{background:#fff;color:#0B0B0C}
html[data-theme="light"] .plan-hi{background:#0B0B0C !important;color:#fff !important}
html[data-theme="light"] .plan-hi .mono{color:#ff9783 !important}
html[data-theme="light"] .plan .mono{color:#5C5C63}
html[data-theme="light"] .faq{border-color:#DADADF}
html[data-theme="light"] .seg2{background:#fff !important;border-color:#DADADF !important}
html[data-theme="light"] .jump{background:#0B0B0C;color:#fff;border-color:#0B0B0C}
html[data-theme="light"] .jump:hover{background:#E0182D;border-color:#E0182D;color:#fff}
html[data-theme="light"] .legal{background:#fff}
html[data-theme="light"] .post{background:#fff}
html[data-theme="light"] .post:hover{background:#0B0B0C;color:#fff}

/* ---- tinted section (brand red, deep in dark / soft in light) ---- */
.sec-tint{background:#170b0d;color:#fff;position:relative;overflow:hidden}
.sec-tint::before{content:"";position:absolute;inset:0;background:radial-gradient(800px circle at 10% 0%,rgba(224,24,45,.22),transparent 60%);pointer-events:none}
.sec-tint>*{position:relative}
.sec-tint .kicker-dark{color:#ff9783}
.sec-tint .lead-dark{color:#c9c4c4}
.sec-tint .cardgrid{background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.08)}
.sec-tint .feat{background:#1f1214;color:#fff}
.sec-tint .feat p{opacity:.75}
.sec-tint .feat:hover{background:#E0182D;color:#fff}
.sec-tint .feat:hover .feat-n{background:#fff}
.sec-tint .btn-ink{background:#fff;color:#0B0B0C}
html[data-theme="light"] .sec-tint{background:#FDE7E9 !important;color:#0B0B0C !important}
html[data-theme="light"] .sec-tint::before{background:radial-gradient(800px circle at 90% 100%,rgba(224,24,45,.12),transparent 60%)}
html[data-theme="light"] .sec-tint .kicker-dark{color:#C8102E}
html[data-theme="light"] .sec-tint .lead-dark{color:#5C5C63}
html[data-theme="light"] .sec-tint .cardgrid{background:rgba(224,24,45,.18);border-color:rgba(224,24,45,.18)}
html[data-theme="light"] .sec-tint .feat{background:#fff;color:#0B0B0C}
html[data-theme="light"] .sec-tint .feat:hover{background:#E0182D;color:#fff}
html[data-theme="light"] .sec-tint .btn-ink{background:#0B0B0C;color:#fff}

/* ---- theme variables (light flips greys/coral; dark zones keep dark set) ---- */
.dk,.sec-dark,.plan-hi,.pcard-hi,.glass,.sec-tint{--mut0:#e9e3d8;--mut:#c9c4c4;--mut2:#7d7979;--mut3:#9b9797;--coral:#ff9783}
html[data-theme="light"] .site{--mut0:#0B0B0C;--mut:#5C5C63;--mut2:#5C5C63;--mut3:#6b6b72;--coral:#C8102E}
html[data-theme="light"] .hero{--mut0:#0B0B0C;--mut:#5C5C63;--mut2:#5C5C63;--mut3:#6b6b72;--coral:#C8102E}
html[data-theme="light"] .dk,html[data-theme="light"] .sec-dark,html[data-theme="light"] .plan-hi,html[data-theme="light"] .pcard-hi,html[data-theme="light"] .glass{--mut0:#e9e3d8;--mut:#c9c4c4;--mut2:#7d7979;--mut3:#9b9797;--coral:#ff9783}
html[data-theme="light"] .sec-tint{--mut0:#0B0B0C;--mut:#5C5C63;--mut2:#5C5C63;--mut3:#6b6b72;--coral:#C8102E}
html[data-theme="light"] .hero .glass{background:#17171A;color:#fff}
/* segmented toggles: class-driven so they survive theme changes */
.seg2 span.on{background:#fff;color:#0B0B0C}
.seg2 span:not(.on){color:#fff}
html[data-theme="light"] .hero .seg2 span.on{background:#0B0B0C;color:#fff}
html[data-theme="light"] .hero .seg2 span:not(.on){color:#0B0B0C}
