
.online-hero{padding:clamp(4rem,8vw,8rem) 0 3.5rem;background:linear-gradient(135deg,var(--dark) 0%,#0b1510 55%,var(--ink) 100%);color:#e5e8dc;overflow:hidden;position:relative}
.online-hero:after{content:"";position:absolute;right:-8rem;top:-8rem;width:28rem;height:28rem;border-radius:50%;background:radial-gradient(circle,rgba(199,165,106,.22),transparent 68%)}
.online-hero-grid{display:grid;grid-template-columns:1.25fr .75fr;gap:4rem;align-items:center}
.online-hero h1{font-size:clamp(3.2rem,7vw,7.2rem);line-height:.94;letter-spacing:-.045em;margin:.6rem 0 1.4rem;max-width:900px}
.online-hero .hero-copy{font-size:1.15rem;line-height:1.7;max-width:720px;color:#cfd4c5}
.online-actions{display:flex;gap:.8rem;flex-wrap:wrap;margin-top:2rem}
.online-actions a{display:inline-flex;align-items:center;gap:.5rem;padding:.9rem 1.15rem;border-radius:999px;text-decoration:none;font-weight:700}
.online-actions .primary{background:var(--gold);color:var(--dark)}
.online-actions .secondary{border:1px solid #65715d;color:#e5e8dc}
.digital-board{width:min(100%,390px);aspect-ratio:1;display:grid;grid-template-columns:repeat(8,1fr);border:1px solid #65715d;box-shadow:0 30px 70px rgba(11,21,16,.35);transform:rotate(2deg);position:relative;z-index:1}
.digital-board span{display:grid;place-items:center;font-size:clamp(1.2rem,3.2vw,2.1rem)}
.digital-board span:nth-child(16n+1),.digital-board span:nth-child(16n+3),.digital-board span:nth-child(16n+5),.digital-board span:nth-child(16n+7),.digital-board span:nth-child(16n+10),.digital-board span:nth-child(16n+12),.digital-board span:nth-child(16n+14),.digital-board span:nth-child(16n+16){background:#d7bd90;color:var(--dark)}
.digital-board span{background:#536751;color:#e5e8dc}
.online-quick{display:grid;grid-template-columns:repeat(4,1fr);border-bottom:1px solid var(--line)}
.online-quick a{padding:1.35rem 1rem;text-align:center;text-decoration:none;color:inherit;border-right:1px solid var(--line);font-weight:700}
.online-section{padding:clamp(4rem,8vw,7rem) 0}
.online-heading{display:grid;grid-template-columns:1fr .7fr;gap:3rem;align-items:end;margin-bottom:2.4rem}
.online-heading h2{font-size:clamp(2.4rem,5vw,4.8rem);line-height:1.02;margin:.35rem 0 0}
.online-heading p{font-size:1.05rem;line-height:1.75;color:var(--muted)}
.intent-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:.8rem}
.intent-btn{border:1px solid var(--line);background:white;padding:1.2rem;text-align:left;cursor:pointer;min-height:155px;transition:.2s}
.intent-btn:hover,.intent-btn.active{border-color:var(--gold);transform:translateY(-2px);box-shadow:0 12px 30px rgba(11,21,16,.08)}
.intent-btn small{display:block;color:#947239;font-weight:800;letter-spacing:.08em;margin-bottom:.8rem}
.intent-btn strong{font-size:1.15rem;line-height:1.2;display:block}
.intent-result{margin-top:1rem;background:var(--dark);color:#e5e8dc;padding:2rem;display:grid;grid-template-columns:1fr auto;gap:2rem;align-items:center}
.intent-result p{color:#cfd4c5;margin:.5rem 0 0;max-width:760px}
.intent-result a{background:var(--gold);color:var(--dark);padding:.85rem 1rem;text-decoration:none;font-weight:800;white-space:nowrap}
.platforms{background:#f0eee5}
.platform-grid{display:grid;grid-template-columns:1fr 1fr;gap:1.2rem}
.platform-card{background:white;border:1px solid var(--line);padding:2rem;display:flex;flex-direction:column}
.platform-card .number{font-size:.8rem;letter-spacing:.12em;font-weight:800;color:#947239}
.platform-card h3{font-size:2.2rem;margin:.5rem 0}
.platform-card p{line-height:1.7;color:var(--muted)}
.feature-list{list-style:none;padding:0;margin:1.2rem 0 1.7rem}
.feature-list li{padding:.65rem 0;border-top:1px solid var(--line)}
.platform-links{display:flex;gap:.65rem;flex-wrap:wrap;margin-top:auto}
.platform-links a{padding:.75rem .9rem;border:1px solid var(--ink);text-decoration:none;color:var(--ink);font-weight:700}
.platform-links a.primary{background:var(--ink);color:#e5e8dc}
.cluster-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem}
.cluster-card{border-top:3px solid var(--gold);padding:1.5rem;background:white;box-shadow:0 12px 30px rgba(11,21,16,.06)}
.cluster-card h3{font-size:1.45rem;margin:.25rem 0 .65rem}
.cluster-card p{line-height:1.65;color:var(--muted)}
.cluster-card a{font-weight:800;color:var(--ink)}
.beginner{background:#0b1510;color:#e5e8dc}
.beginner .online-heading p{color:#cfd4c5}
.step-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem}
.online-step{border:1px solid #65715d;padding:1.6rem}
.online-step .step-no{color:var(--gold);font-weight:800;letter-spacing:.1em}
.online-step h3{font-size:1.45rem;margin:.6rem 0}
.online-step p{color:#cfd4c5;line-height:1.65}
.club-bridge{display:grid;grid-template-columns:1.1fr .9fr;gap:2rem;align-items:stretch}
.club-copy{background:#e9eadf;padding:2.3rem}
.club-copy h2{font-size:clamp(2.3rem,5vw,4.6rem);line-height:1}
.club-copy p{line-height:1.75}
.club-facts{background:var(--ink);color:#e5e8dc;padding:2rem;display:grid;gap:1rem}
.club-fact{border-bottom:1px solid #65715d;padding-bottom:1rem}
.club-fact small{display:block;color:var(--gold);font-weight:800;letter-spacing:.09em;margin-bottom:.3rem}
.faq-online details{border-top:1px solid var(--line);padding:1rem 0}
.faq-online summary{font-weight:800;font-size:1.1rem;cursor:pointer}
.faq-online p{line-height:1.7;color:var(--muted);max-width:900px}
.online-note{font-size:.92rem;color:var(--muted);line-height:1.6;margin-top:1.3rem}
.online-cta{padding:4rem 0;background:var(--gold)}
.online-cta .wrap{display:flex;justify-content:space-between;gap:2rem;align-items:center}
.online-cta h2{font-size:clamp(2rem,4vw,4rem);line-height:1;margin:0}
.online-cta a{background:var(--ink);color:#e5e8dc;padding:1rem 1.2rem;text-decoration:none;font-weight:800}
.seo-answer{background:white;border-left:4px solid var(--gold);padding:1.3rem 1.4rem;margin:1.5rem 0 0;box-shadow:0 8px 24px rgba(11,21,16,.05)}
.seo-answer strong{display:block;margin-bottom:.35rem}
.seo-answer p{margin:0;line-height:1.65;color:var(--muted)}
@media(max-width:980px){.online-hero-grid,.online-heading,.club-bridge{grid-template-columns:1fr}.digital-board{max-width:340px}.intent-grid{grid-template-columns:repeat(2,1fr)}.platform-grid,.cluster-grid,.step-grid{grid-template-columns:1fr}.online-quick{grid-template-columns:repeat(2,1fr)}}
@media(max-width:600px){.online-hero h1{font-size:3rem}.intent-grid{grid-template-columns:1fr}.intent-result{grid-template-columns:1fr}.online-quick{grid-template-columns:1fr}.online-quick a{border-right:0;border-bottom:1px solid var(--line)}.online-cta .wrap{display:block}.online-cta a{display:inline-block;margin-top:1.2rem}}