/* ============================================
   SKATING APP — Site vitrine
   Sidebar nav + Light/Dark + Scroll anims
   ============================================ */

/* Reset */
*,*::before,*::after{margin:0;padding:0;box-sizing:border-box}

/* ---- Tokens ---- */
:root {
    --blue: #1e88e5;
    --blue-light: #42a5f5;
    --blue-bg: #e3f2fd;
    --green: #43a047;
    --green-bg: #e8f5e9;
    --red: #e53935;
    --red-bg: #ffebee;
    --pink: #e91e63;
    --pink-bg: #fce4ec;
    --orange: #f57c00;
    --orange-bg: #fff3e0;
    --purple: #8e24aa;
    --purple-bg: #f3e5f5;
    --teal: #26a69a;
    --ice: #4fc3f7;
    --ice-light: #b3e5fc;
    --ice-bg: #e0f7fa;
    --cyan: #80deea;

    --font: 'Inter',-apple-system,BlinkMacSystemFont,sans-serif;
    --font-d: 'Space Grotesk','Inter',sans-serif;
    --ease: cubic-bezier(.4,0,.2,1);
    --ease-out: cubic-bezier(.16,1,.3,1);
    --dur: .3s;
    --radius: 14px;
    --radius-lg: 20px;
    --sidebar-w: 260px;
}

/* ---- Light ---- */
[data-theme="light"] {
    --bg: #f7fbff;
    --bg-2: #eef5fb;
    --bg-3: #e4edf6;
    --bg-card: #ffffff;
    --bg-card-hover: #fafbfc;
    --bg-elevated: #ffffff;
    --border: #e8e8ec;
    --border-hover: #d0d0d6;
    --text: #1a1a2e;
    --text-2: #5a5a72;
    --text-3: #9a9ab0;
    --shadow-sm: 0 1px 3px rgba(0,0,0,.04);
    --shadow-md: 0 4px 24px rgba(0,0,0,.06);
    --shadow-lg: 0 12px 48px rgba(0,0,0,.08);
    --nav-bg: rgba(255,255,255,.85);
    --loader-bg: #ffffff;
    --phone-bg: #1a1a2e;
    --phone-text: #fff;
    --phone-card: rgba(255,255,255,.08);
    --phone-border: rgba(255,255,255,.1);
}

/* ---- Dark ---- */
[data-theme="dark"] {
    --bg: #0a0e18;
    --bg-2: #0f1420;
    --bg-3: #181e2e;
    --bg-card: rgba(255,255,255,.04);
    --bg-card-hover: rgba(255,255,255,.07);
    --bg-elevated: #16161f;
    --border: rgba(255,255,255,.08);
    --border-hover: rgba(255,255,255,.14);
    --text: #eeeef4;
    --text-2: #8888a0;
    --text-3: #55556a;
    --shadow-sm: 0 1px 3px rgba(0,0,0,.2);
    --shadow-md: 0 4px 24px rgba(0,0,0,.3);
    --shadow-lg: 0 12px 48px rgba(0,0,0,.4);
    --nav-bg: rgba(11,11,20,.85);
    --loader-bg: #0b0b14;
    --phone-bg: #0f0f1a;
    --phone-text: #eee;
    --phone-card: rgba(255,255,255,.06);
    --phone-border: rgba(255,255,255,.08);
}

[data-theme] { transition: background-color .4s var(--ease), color .4s var(--ease); }

/* ---- Base ---- */
html { scroll-behavior: auto; -webkit-font-smoothing: antialiased; overflow-x: hidden; }
body {
    font-family: var(--font); background: var(--bg); color: var(--text); overflow-x: hidden; line-height: 1.6;
    background-image:
        radial-gradient(ellipse 100% 80% at 50% 0%, rgba(79,195,247,.03) 0%, transparent 50%),
        radial-gradient(ellipse 80% 60% at 100% 100%, rgba(128,222,234,.02) 0%, transparent 40%);
    background-attachment: scroll;
}
[data-theme="dark"] body {
    background-image:
        radial-gradient(ellipse 100% 80% at 50% 0%, rgba(79,195,247,.02) 0%, transparent 50%),
        radial-gradient(ellipse 80% 60% at 100% 100%, rgba(128,222,234,.01) 0%, transparent 40%);
}
a { text-decoration: none; color: inherit; }
button { border: none; background: none; cursor: pointer; font-family: inherit; color: inherit; }
.container { max-width: 1100px; margin: 0 auto; padding: 0 24px; }

.accent {
    background: linear-gradient(135deg, var(--blue), var(--ice), var(--cyan));
    -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text;
}

/* ---- Loader ---- */
.loader { position:fixed;inset:0;z-index:9999;background:var(--loader-bg);display:flex;align-items:center;justify-content:center;transition:opacity .5s,visibility .5s; }
.loader.hidden { opacity:0;visibility:hidden;pointer-events:none; }
.loader-inner { text-align:center; }
.loader-icon { margin:0 auto 12px;animation: pulse 1s ease infinite alternate; }
@keyframes pulse { from{transform:scale(1)} to{transform:scale(1.1)} }
.loader-text { font-family:var(--font-d);font-weight:800;font-size:1.1rem;display:block;margin-bottom:16px; }
.loader-bar { width:120px;height:3px;background:var(--border);border-radius:3px;overflow:hidden;margin:0 auto; }
.loader-fill { height:100%;background:var(--blue);border-radius:3px;animation:fill 1.2s var(--ease-out) forwards; }
@keyframes fill { from{width:0} to{width:100%} }

/* ---- SIDEBAR ---- */
.sidebar-overlay {
    position:fixed;inset:0;z-index:998;background:rgba(0,0,0,.35);
    opacity:0;visibility:hidden;transition:opacity var(--dur),visibility var(--dur);
    backdrop-filter:blur(4px);
}
.sidebar-overlay.open { opacity:1;visibility:visible; }

.sidebar {
    position:fixed;top:0;left:0;bottom:0;width:var(--sidebar-w);z-index:999;
    background:var(--bg-elevated);
    border-right:1px solid var(--border);
    transform:translateX(-100%);
    transition:transform .4s var(--ease-out);
    display:flex;flex-direction:column;
    box-shadow:var(--shadow-lg);
}
.sidebar.open { transform:translateX(0); }

.sidebar-header {
    display:flex;align-items:center;justify-content:space-between;
    padding:20px 20px 16px;border-bottom:1px solid var(--border);
}
.sidebar-brand { display:flex;align-items:center;gap:10px;font-family:var(--font-d);font-weight:800;font-size:1rem; }
.brand-icon {
    width:34px;height:34px;border-radius:10px;
    background:linear-gradient(135deg,var(--blue),var(--ice));
    display:flex;align-items:center;justify-content:center;flex-shrink:0;
}
.brand-icon.sm { width:28px;height:28px;border-radius:8px; }
.sidebar-close { width:32px;height:32px;border-radius:8px;display:flex;align-items:center;justify-content:center;color:var(--text-3);transition:all var(--dur); }
.sidebar-close:hover { background:var(--bg-2);color:var(--text); }

.sidebar-nav { flex:1;padding:16px 12px;display:flex;flex-direction:column;gap:2px;overflow-y:auto; }
.sidebar-link {
    display:flex;align-items:center;gap:12px;padding:11px 14px;border-radius:10px;
    font-size:.88rem;font-weight:500;color:var(--text-2);
    transition:all var(--dur) var(--ease);
}
.sidebar-link:hover { background:var(--bg-2);color:var(--text); }
.sidebar-link.active { background:var(--blue-bg);color:var(--blue);font-weight:600; }
[data-theme="dark"] .sidebar-link.active { background:rgba(30,136,229,.12);color:var(--blue-light); }

.sidebar-footer { padding:16px 20px;border-top:1px solid var(--border); }
.sidebar-lang { display:flex;flex-direction:column;gap:4px; }
.sidebar-lang-option {
    display:flex;align-items:center;gap:8px;padding:8px 14px;border-radius:10px;width:100%;
    font-size:.85rem;color:var(--text-2);background:none;border:none;cursor:pointer;
    transition:all var(--dur);text-align:left;
}
.sidebar-lang-option:hover { background:var(--bg-2);color:var(--text); }
.sidebar-lang-option.active { background:var(--blue-bg);color:var(--blue);font-weight:600; }
.theme-toggle {
    display:flex;align-items:center;gap:10px;padding:10px 14px;border-radius:10px;width:100%;
    font-size:.85rem;color:var(--text-2);transition:all var(--dur);
}
.theme-toggle:hover { background:var(--bg-2);color:var(--text); }
.theme-label { font-weight:500; }
[data-theme="light"] .icon-moon { display:none; }
[data-theme="dark"] .icon-sun { display:none; }

/* ---- TOPBAR ---- */
.topbar {
    position:fixed;top:0;left:0;right:0;z-index:100;height:56px;
    display:flex;align-items:center;justify-content:space-between;padding:0 16px;
    transition:background var(--dur),box-shadow var(--dur),backdrop-filter var(--dur);
}
.topbar.scrolled {
    background:var(--nav-bg);
    backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);
    box-shadow:var(--shadow-sm);border-bottom:1px solid var(--border);
}
.topbar-brand { display:flex;align-items:center;gap:8px;font-family:var(--font-d);font-weight:800;font-size:.95rem;position:absolute;left:50%;transform:translateX(-50%); }
.topbar-logo { width:32px;height:32px;object-fit:contain; }
.footer-logo { width:28px;height:28px;object-fit:contain; }

.burger {
    width:38px;height:38px;border-radius:10px;display:flex;flex-direction:column;
    align-items:center;justify-content:center;gap:5px;
    border:1px solid var(--border);background:var(--bg-card);
    transition:all var(--dur);
}
.burger:hover { background:var(--bg-2);border-color:var(--border-hover); }
.burger span { display:block;width:18px;height:2px;background:var(--text);border-radius:2px;transition:all var(--dur); }

.topbar-theme {
    width:38px;height:38px;border-radius:10px;display:flex;align-items:center;justify-content:center;
    border:1px solid var(--border);color:var(--text-2);background:var(--bg-card);
    transition:all var(--dur);
}
.topbar-theme:hover { background:var(--bg-2);color:var(--text); }
[data-theme="light"] .topbar-theme .icon-moon { display:none; }
[data-theme="dark"] .topbar-theme .icon-sun { display:none; }

/* ---- SCROLL REVEAL ---- */
.sr {
    opacity:0;transform:translateY(44px);
    transition:opacity .8s var(--ease-out),transform .8s var(--ease-out);
    will-change:transform,opacity;
}
.sr.vis { opacity:1;transform:translateY(0); }

/* ---- HERO ---- */
.hero {
    min-height:100vh;min-height:100dvh;
    display:flex;align-items:center;justify-content:center;
    padding:100px 24px 80px;position:relative;overflow-x:clip;overflow-y:visible;
}
.hero-bg { position:absolute;inset:0;z-index:0;pointer-events:none;overflow:hidden; }
.hero-blob {
    position:absolute;border-radius:50%;filter:blur(80px);opacity:.18;
    will-change:transform;
}
.hero-blob.blob-1 { width:600px;height:600px;top:-15%;right:-8%;background:var(--ice); }
.hero-blob.blob-2 { width:500px;height:500px;bottom:-18%;left:-10%;background:var(--cyan); }
.hero-blob.blob-3 { width:350px;height:350px;top:30%;left:40%;background:var(--ice-light);opacity:.12; }
[data-theme="dark"] .hero-blob { opacity:.08; }

/* ---- Hero ice crystal decorations ---- */
.hero-crystal {
    position:absolute;z-index:1;pointer-events:none;
    color:rgba(79,195,247,.12);
    will-change:transform,opacity;
}
.hero-crystal.crystal-1 {
    width:120px;height:120px;top:12%;right:8%;
    animation:crystal-spin 30s linear infinite, crystal-float 8s ease-in-out infinite;
}
.hero-crystal.crystal-2 {
    width:70px;height:70px;bottom:20%;left:5%;
    animation:crystal-spin 25s linear infinite reverse, crystal-float 6s ease-in-out infinite 2s;
}
.hero-crystal.crystal-3 {
    width:90px;height:90px;top:60%;right:15%;
    animation:crystal-spin 35s linear infinite, crystal-float 7s ease-in-out infinite 4s;
}
[data-theme="dark"] .hero-crystal { color:rgba(79,195,247,.06); }
@keyframes crystal-spin { from{transform:rotate(0deg)} to{transform:rotate(360deg)} }
@keyframes crystal-float { 0%,100%{opacity:1} 50%{opacity:.4} }
@media(max-width:768px){
    .hero-crystal.crystal-1 { width:70px;height:70px;right:3%; }
    .hero-crystal.crystal-2 { width:50px;height:50px; }
    .hero-crystal.crystal-3 { display:none; }
}

.hero-inner {
    position:relative;z-index:1;display:flex;align-items:center;justify-content:center;
    gap:60px;max-width:1100px;width:100%;margin:0 auto;
}
.hero-centered .hero-inner { justify-content:center; }
.hero-centered .hero-content { text-align:center;max-width:700px; }
.hero-centered .hero-sub { margin-left:auto;margin-right:auto; }

.hero-content {
    flex:1;text-align:left;max-width:540px;
}
.hero-overtitle { display:inline-flex;align-items:center;gap:10px;margin-bottom:28px;font-size:.85rem;color:var(--text-2); }
.pill { padding:4px 11px;border-radius:50px;background:var(--blue);color:#fff;font-size:.68rem;font-weight:700;text-transform:uppercase;letter-spacing:.04em; }

.hero-title {
    font-family:var(--font-d);font-size:clamp(2.4rem,5vw,4.5rem);
    font-weight:900;line-height:1.05;letter-spacing:-.04em;margin-bottom:24px;
}
.hero-title .line { display:block;overflow:hidden; }
.hero-title .line-inner {
    display:inline-block;transform:translateY(115%);
    transition:transform 1s var(--ease-out);
}
.hero-title .line.sr.vis .line-inner { transform:translateY(0); }
.hero-title .line:nth-child(1) .line-inner { transition-delay:.1s; }
.hero-title .line:nth-child(2) .line-inner { transition-delay:.22s; }

.hero-sub { font-size:clamp(.95rem,2vw,1.15rem);color:var(--text-2);max-width:480px;margin-bottom:32px;line-height:1.7; }

.hero-actions { display:flex;gap:12px;flex-wrap:wrap; }
.btn-primary {
    display:inline-flex;align-items:center;gap:8px;
    padding:13px 28px;border-radius:50px;
    background:var(--blue);color:#fff;
    font-weight:600;font-size:.92rem;transition:all var(--dur) var(--ease);
    box-shadow:0 4px 16px rgba(79,195,247,.25);
}
.btn-primary:hover { transform:translateY(-2px);box-shadow:0 8px 30px rgba(79,195,247,.3); }
.btn-outline {
    display:inline-flex;align-items:center;gap:8px;
    padding:13px 28px;border-radius:50px;
    border:1px solid var(--border);color:var(--text-2);
    font-weight:600;font-size:.92rem;transition:all var(--dur) var(--ease);
}
.btn-outline:hover { border-color:var(--text);color:var(--text); }

.hero-scroll-hint { position:absolute;bottom:28px;left:50%;transform:translateX(-50%);display:flex;flex-direction:column;align-items:center;gap:6px; }
.scroll-dot { width:6px;height:6px;border-radius:50%;background:var(--blue);animation:bounce 2s ease-in-out infinite; }
@keyframes bounce { 0%,100%{transform:translateY(0)} 50%{transform:translateY(8px)} }

.hero-scroll-cta {
    position:absolute;bottom:28px;left:50%;transform:translateX(-50%);
    display:flex;align-items:center;gap:8px;z-index:3;
    color:var(--text-2);font-size:.9rem;font-weight:500;
    text-decoration:none;transition:color .3s,gap .3s;
    white-space:nowrap;
}
.hero-scroll-cta:hover { color:var(--blue);gap:12px; }
.hero-scroll-cta svg { animation:bounce 2s ease-in-out infinite; }
@media(max-width:640px){
    .hero-scroll-cta { font-size:.78rem;white-space:normal;text-align:center;flex-direction:column;gap:4px;bottom:16px;left:0;right:0;transform:none;justify-content:center;align-items:center;width:100%;padding:0 24px; }
}

/* ---- Login inline form in action card ---- */
.login-inline {
    display:flex;flex-direction:column;gap:10px;margin-top:4px;
}
.login-inline input {
    width:100%;padding:11px 14px;border-radius:10px;border:1px solid var(--border);
    background:var(--bg);color:var(--text);font-size:.9rem;
    transition:border-color .2s,box-shadow .2s;outline:none;
}
.login-inline input:focus { border-color:var(--blue);box-shadow:0 0 0 3px rgba(30,136,229,.15); }
.password-wrapper {
    position:relative;width:100%;
}
.password-wrapper input {
    padding-right:42px;
}
.toggle-password {
    position:absolute;right:10px;top:50%;transform:translateY(-50%);
    background:none;border:none;cursor:pointer;color:var(--text-3);
    padding:4px;display:flex;align-items:center;justify-content:center;
    transition:color .2s;
}
.toggle-password:hover { color:var(--text); }
.login-inline-error {
    font-size:.82rem;color:var(--red);font-weight:500;padding:0 2px;
}
.login-submit-btn {
    width:100%;justify-content:center;border:none;cursor:pointer;
}
.action-card-login { cursor:default; }
.action-card-login:hover { transform:none;box-shadow:none; }

/* Hero mobile */
@media(max-width:768px){
    .hero-inner { flex-direction:column;text-align:center;gap:40px; }
    .hero-content { text-align:center;max-width:100%; }
    .hero-sub { margin-left:auto;margin-right:auto; }
    .hero-actions { justify-content:center; }
}

/* ---- MARQUEE ---- */
.marquee { padding:22px 0;background:var(--bg-2);border-bottom:1px solid var(--border);overflow:hidden;position:relative; }
.marquee::before {
    content:'';position:absolute;top:0;left:0;right:0;height:1px;
    background:linear-gradient(90deg,transparent,var(--ice-light),var(--cyan),var(--ice-light),transparent);
    opacity:.4;
}
[data-theme="dark"] .marquee::before { opacity:.15; }
.marquee-track { display:flex;white-space:nowrap; }
.marquee-content { display:flex;align-items:center;flex-shrink:0; }
.marquee-content span { font-family:var(--font-d);font-size:clamp(.85rem,1.5vw,1.15rem);font-weight:700;white-space:nowrap;padding:0 14px;color:var(--text); }
.marquee-content .sep { color:var(--text-3);font-weight:400;padding:0 4px; }

/* ---- SECTIONS COMMON ---- */
.section-label {
    display:inline-block;padding:5px 14px;border-radius:50px;border:1px solid var(--border);
    font-size:.72rem;font-weight:600;text-transform:uppercase;letter-spacing:.06em;color:var(--text-2);
    margin-bottom:18px;
}
.section-heading {
    font-family:var(--font-d);font-size:clamp(1.8rem,4.5vw,3.4rem);
    font-weight:900;line-height:1.1;letter-spacing:-.03em;margin-bottom:14px;
}
.section-sub { font-size:1rem;color:var(--text-2);max-width:460px;margin:0 auto;line-height:1.7; }

/* ---- FEATURES ---- */
.features { padding:100px 0 0; }
.features > .container { text-align:center;margin-bottom:70px; }

.feat-block { padding:80px 0;border-top:1px solid var(--border);position:relative; }
.feat-block::before {
    content:'';position:absolute;top:0;left:10%;right:10%;height:1px;
    background:linear-gradient(90deg,transparent,rgba(79,195,247,.2),rgba(128,222,234,.15),rgba(79,195,247,.2),transparent);
}
[data-theme="dark"] .feat-block::before { opacity:.5; }
.feat-block.alt { background:var(--bg-2); }

.feat-row { display:grid;grid-template-columns:1fr 1fr;gap:56px;align-items:center; }
.feat-row.reverse { direction:rtl; }
.feat-row.reverse > * { direction:ltr; }

.feat-num {
    font-family:var(--font-d);font-size:3.5rem;font-weight:900;line-height:1;display:block;margin-bottom:4px;
    background:linear-gradient(135deg,var(--blue),var(--ice));
    -webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;
    opacity:.2;
}
.feat-title { font-family:var(--font-d);font-size:clamp(1.5rem,2.8vw,2.2rem);font-weight:800;margin-bottom:12px; }
.feat-desc { font-size:.95rem;color:var(--text-2);line-height:1.7;margin-bottom:16px;max-width:400px; }
.feat-list { list-style:none;display:flex;flex-direction:column;gap:8px; }
.feat-list li {
    position:relative;padding-left:22px;font-size:.88rem;color:var(--text-2);
}
.feat-list li::before {
    content:'';position:absolute;left:0;top:8px;width:10px;height:10px;border-radius:50%;
    background:var(--blue-bg);border:2px solid var(--blue);
}

/* ---- MOCKUP CARDS (feature visuals) ---- */
.feat-visual {
    border-radius:var(--radius-lg);background:var(--bg-card);border:1px solid var(--border);
    padding:24px;box-shadow:var(--shadow-md);
    transition:transform var(--dur) var(--ease),box-shadow var(--dur);
}
.feat-visual:hover { transform:translateY(-4px);box-shadow:var(--shadow-lg),0 0 20px rgba(79,195,247,.06); }

.mockup-card { font-size:.82rem; }

/* Planning mock */
.mock-header { display:flex;align-items:center;justify-content:space-between;margin-bottom:14px; }
.mock-title-sm { font-weight:700;font-size:.9rem; }
.mock-badge { font-size:.7rem;padding:4px 10px;border-radius:8px;border:1px solid var(--border);color:var(--blue);font-weight:600; }
.mock-date { display:flex;align-items:center;justify-content:center;gap:16px;padding:10px;background:var(--bg-2);border-radius:10px;margin-bottom:14px;text-align:center;font-size:.8rem; }
.mock-date small { color:var(--text-3); }
.mock-arrow { font-size:1.2rem;color:var(--text-3);cursor:pointer; }

.mock-timeline { display:flex;flex-direction:column;gap:6px; }
.tl-slot { display:flex;align-items:flex-start;gap:12px;padding:8px 10px;border-radius:10px;font-size:.78rem; }
.tl-slot.free { color:var(--text-3); }
.tl-slot.event { background:var(--bg-2);border:1px solid var(--border);
    opacity:0;transform:translateX(-20px);transition:all .5s var(--ease-out); }
.sr.vis .tl-slot.event { opacity:1;transform:translateX(0); }
.sr.vis .tl-slot.event:nth-child(2) { transition-delay:.15s; }
.sr.vis .tl-slot.event:nth-child(4) { transition-delay:.3s; }
.tl-time { font-weight:600;min-width:36px;color:var(--text-3);line-height:1.3; }
.tl-event { flex:1; }
.tl-event strong { display:block;font-size:.82rem; }
.tl-event small { color:var(--text-3); }
.tl-tag { display:inline-block;padding:2px 8px;border-radius:50px;font-size:.62rem;font-weight:700;margin-top:4px;
    background:var(--red-bg);color:var(--red);text-transform:uppercase;letter-spacing:.03em; }
.tl-tag.tag-reunion { background:var(--purple-bg);color:var(--purple); }

/* Presence mock */
.mock-presence-stats { display:flex;gap:10px;margin-bottom:14px; }
.mp-stat { display:flex;flex-direction:column;align-items:center;gap:2px;flex:1;padding:10px;border-radius:10px;border:1px solid var(--border);background:var(--bg-2); }
.mp-icon { font-family:var(--font-d);font-weight:800;font-size:1.1rem; }
.mp-icon.blue { color:var(--blue); }
.mp-icon.green { color:var(--green); }
.mp-icon.red { color:var(--red); }
.mp-stat small { font-size:.65rem;color:var(--text-3); }
.mock-training { padding:12px;border-radius:10px;border:1px solid var(--border);margin-bottom:12px; }
.mt-header { display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-bottom:4px; }
.mt-header strong { font-size:.8rem; }
.mt-coaches { color:var(--text-3);display:block;margin-bottom:4px; }
.mt-count { font-size:.75rem;color:var(--text-2);font-weight:600; }

.mock-student-list { display:flex;flex-direction:column;gap:8px; }
.ms-row {
    display:flex;align-items:center;gap:10px;padding:10px;border-radius:10px;border:1px solid var(--border);
    opacity:0;transform:translateX(-16px);transition:all .5s var(--ease-out);
    transition-delay:calc(var(--i,0)*.12s);
}
.sr.vis .ms-row { opacity:1;transform:translateX(0); }
.ms-avatar { width:34px;height:34px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:.65rem;font-weight:700;flex-shrink:0; }
.ms-avatar.small { width:30px;height:30px;font-size:.6rem; }
.ms-avatar.tiny { width:26px;height:26px;font-size:.55rem; }
.ms-info { flex:1; }
.ms-info strong { font-size:.8rem;display:block; }
.ms-info small { color:var(--text-3);font-size:.68rem; }
.ms-status { font-size:.68rem;font-weight:700;padding:3px 8px;border-radius:50px; }
.ms-status.present { background:var(--green-bg);color:var(--green); }
.ms-status.absent { background:var(--red-bg);color:var(--red); }
.ms-actions { display:flex;gap:4px; }
.ms-btn { width:20px;height:20px;border-radius:50%;border:1px solid var(--border); }
.ms-btn.green { background:var(--green-bg);border-color:var(--green); }
.ms-btn.red { background:var(--red-bg);border-color:var(--red); }

/* Couple mock */
.mock-couple-header { display:flex;align-items:center;gap:10px;margin-bottom:14px; }
.mc-count { font-size:.75rem;color:var(--text-2);padding:4px 10px;border:1px solid var(--border);border-radius:50px; }
.mc-btn { font-size:.75rem;font-weight:700;padding:6px 14px;border-radius:50px;background:var(--pink);color:#fff; }
.mock-couple-card { padding:14px;border-radius:12px;border:1px solid var(--border); }
.mc-title { font-weight:700;font-size:.9rem;margin-bottom:2px; }
.mc-meta { color:var(--text-3);display:block;margin-bottom:12px; }
.mc-partners { display:flex;gap:10px;margin-bottom:12px; }
.mc-partner { display:flex;align-items:center;gap:8px;flex:1;padding:8px;border-radius:8px;border:1px solid var(--border);font-size:.75rem; }
.mc-partner strong { font-size:.78rem; }
.mc-partner small { color:var(--text-3); }
.mc-courses { display:flex;flex-direction:column;gap:4px; }
.mc-courses small { color:var(--text-3);margin-bottom:2px; }
.mc-course-tag { display:inline-block;padding:3px 10px;border-radius:50px;font-size:.68rem;font-weight:600;background:var(--blue-bg);color:var(--blue);margin-right:4px; }

/* Invoice mock */
.mock-inv-tabs { display:flex;gap:10px;margin-bottom:14px; }
.inv-tab { display:flex;align-items:center;gap:6px;font-size:.78rem;font-weight:600;padding:6px 12px;border-radius:50px;border:1px solid var(--border);color:var(--text-2); }
.inv-tab.active { background:var(--bg-2);color:var(--text); }
.tab-dot { width:8px;height:8px;border-radius:50%; }
.tab-dot.green { background:var(--green); }
.tab-dot.pink { background:var(--pink); }
.mock-inv-stats { display:flex;gap:8px;margin-bottom:14px; }
.inv-stat { flex:1;padding:10px;border-radius:10px;border:1px solid var(--border);text-align:center; }
.inv-val { font-family:var(--font-d);font-weight:800;font-size:.95rem;display:block; }
.inv-val.blue { color:var(--blue); }
.inv-val.green { color:var(--green); }
.inv-val.orange { color:var(--orange); }
.inv-stat small { font-size:.62rem;color:var(--text-3); }
.mock-inv-table { display:flex;flex-direction:column;gap:6px; }
.inv-row {
    display:flex;align-items:center;gap:8px;padding:8px 10px;border-radius:8px;border:1px solid var(--border);font-size:.78rem;
    opacity:0;transform:translateY(10px);transition:all .5s var(--ease-out);
    transition-delay:calc(var(--i,0)*.1s);
}
.sr.vis .inv-row { opacity:1;transform:translateY(0); }
.inv-row span { font-weight:600; }
.inv-row small { color:var(--text-3); }
.inv-row em { margin-left:auto;font-style:normal;color:var(--text-2); }

/* Chat mock */
.mock-chat-header { display:flex;align-items:center;justify-content:space-between;margin-bottom:10px; }
.mock-chat-title { font-weight:700;font-size:.95rem; }
.mock-chat-actions { display:flex;gap:8px;align-items:center; }
.mca-plus { width:28px;height:28px;border-radius:8px;background:var(--blue);color:#fff;display:flex;align-items:center;justify-content:center;font-size:1rem;font-weight:700; }
.mock-chat-search { padding:8px 12px;border-radius:8px;background:var(--bg-2);border:1px solid var(--border);color:var(--text-3);font-size:.8rem;margin-bottom:10px; }
.mock-chat-tabs { display:flex;gap:6px;margin-bottom:14px; }
.ct { padding:4px 12px;border-radius:50px;font-size:.72rem;font-weight:600;color:var(--text-3);border:1px solid transparent; }
.ct.active { background:var(--blue-bg);color:var(--blue);border-color:rgba(30,136,229,.15); }
[data-theme="dark"] .ct.active { background:rgba(30,136,229,.12); }
.mock-chat-list { display:flex;flex-direction:column;gap:6px; }
.chat-row {
    display:flex;align-items:center;gap:10px;padding:10px;border-radius:10px;border:1px solid var(--border);
    opacity:0;transform:translateX(-12px);transition:all .5s var(--ease-out);
    transition-delay:calc(var(--i,0)*.12s);
}
.sr.vis .chat-row { opacity:1;transform:translateX(0); }
.chat-row-info { flex:1; }
.chat-row-info strong { font-size:.82rem;display:block; }
.chat-row-info small { color:var(--text-3);font-size:.7rem; }
.chat-row-time { font-size:.68rem;color:var(--text-3); }

/* Dispo mock */
.mock-dispo-stats { display:flex;gap:8px;margin-bottom:12px;flex-wrap:wrap; }
.ds-stat { padding:10px;border-radius:10px;border:1px solid var(--border);flex:1;min-width:80px; }
.ds-stat.full { flex:2; }
.ds-val { font-family:var(--font-d);font-weight:800;font-size:1.1rem;display:block; }
.ds-stat small { font-size:.62rem;color:var(--text-3); }
.mock-dispo-user { padding:8px 12px;border-radius:8px;background:var(--bg-2);border:1px solid var(--border);font-size:.8rem;font-weight:600;margin-bottom:12px; }
.mock-dispo-days { display:flex;flex-direction:column;gap:8px; }
.dd-row {
    padding:12px;border-radius:12px;border:1px solid var(--border);
    opacity:0;transform:translateY(12px);transition:all .5s var(--ease-out);
    transition-delay:calc(var(--i,0)*.12s);
}
.sr.vis .dd-row { opacity:1;transform:translateY(0); }
.dd-day { font-weight:700;font-size:.82rem;padding:3px 10px;border-radius:50px;display:inline-block;margin-bottom:6px; }
.dd-row:nth-child(1) .dd-day { background:var(--blue-bg);color:var(--blue); }
.dd-row:nth-child(2) .dd-day { background:var(--pink-bg);color:var(--pink); }
.dd-row:nth-child(3) .dd-day { background:var(--purple-bg);color:var(--purple); }
.dd-count { float:right;font-size:.7rem;color:var(--text-3); }
.dd-slot { font-size:.8rem;color:var(--text-2);margin-top:4px; }

/* ---- BONUS GRID ---- */
.bonus-section { padding:80px 0;text-align:center; }
.bonus-heading { font-family:var(--font-d);font-size:clamp(1.4rem,3vw,2rem);font-weight:800;margin-bottom:36px; }
.bonus-grid { display:grid;grid-template-columns:repeat(4,1fr);gap:16px;text-align:left; }
.bonus-card {
    padding:24px;border-radius:var(--radius-lg);background:var(--bg-card);border:1px solid var(--border);
    transition:transform var(--dur) var(--ease),opacity var(--dur) var(--ease),border-color var(--dur) var(--ease);box-shadow:var(--shadow-sm);
}
.bonus-card:hover { transform:translateY(-4px);box-shadow:var(--shadow-md); }
.bonus-icon { width:44px;height:44px;border-radius:12px;display:flex;align-items:center;justify-content:center;margin-bottom:14px; }
.bonus-card h4 { font-size:.92rem;font-weight:700;margin-bottom:6px; }
.bonus-card p { font-size:.82rem;color:var(--text-2);line-height:1.6; }

/* ---- PHONE SECTION ---- */
.phone-section { padding:100px 0;text-align:center;background:var(--bg-2);border-top:1px solid var(--border);border-bottom:1px solid var(--border); }
.phone-section .section-sub { margin-bottom:50px; }

.phone-stage { position:relative;display:flex;justify-content:center; }
.phone-wrap { perspective:1200px; }
.phone-device {
    width:270px;height:540px;background:var(--phone-bg);border-radius:34px;padding:10px;
    border:1px solid rgba(255,255,255,.06);box-shadow:var(--shadow-lg),0 0 60px rgba(79,195,247,.1);
    transform:rotateY(-8deg) rotateX(4deg);transition:transform .6s var(--ease-out);
    transform-style:preserve-3d;
}
.phone-device:hover { transform:rotateY(0deg) rotateX(0deg); }
.phone-notch { width:90px;height:22px;margin:0 auto;background:var(--phone-bg);border-radius:0 0 12px 12px;position:relative;z-index:2; }
.phone-screen-area {
    width:100%;height:calc(100% - 22px);
    background:var(--phone-bg);border-radius:26px;overflow:hidden;padding:16px 14px;
}

/* Dashboard inside phone (always dark-ish to match screenshot) */
.app-dash { color:var(--phone-text); }
.dash-greeting { font-family:var(--font-d);font-weight:800;font-size:.95rem; }
.dash-sub { color:rgba(255,255,255,.5);display:block;margin-bottom:14px;font-size:.7rem; }
.dash-cards { display:grid;grid-template-columns:1fr 1fr;gap:6px;margin-bottom:14px; }
.dc {
    padding:10px;border-radius:10px;background:var(--phone-card);border:1px solid var(--phone-border);
    border-left:3px solid var(--dc-clr);
}
.dc-label { font-size:.6rem;color:rgba(255,255,255,.5);display:block; }
.dc-val { font-family:var(--font-d);font-weight:800;font-size:1.1rem;color:var(--phone-text); }
.dash-calendar { background:var(--phone-card);border:1px solid var(--phone-border);border-radius:10px;padding:10px; }
.dcal-head { display:flex;justify-content:space-between;align-items:center;margin-bottom:6px;font-size:.75rem;font-weight:600; }
.dcal-link { font-size:.65rem;color:var(--blue-light);font-weight:500; }
.dcal-date { font-size:.7rem;color:rgba(255,255,255,.5);margin-bottom:8px; }
.dcal-event { display:flex;gap:8px;align-items:flex-start;padding:8px;border-radius:8px;background:rgba(255,255,255,.04);border-left:3px solid var(--blue); }
.dcal-time { font-size:.68rem;font-weight:600;min-width:28px;color:rgba(255,255,255,.5); }
.dcal-info strong { font-size:.75rem;display:block; }
.dcal-info small { font-size:.62rem;color:rgba(255,255,255,.4); }

/* Floating cards */
.phone-float { position:absolute;z-index:2; }
.fl-left { left:5%;top:35%; }
.fl-right { right:5%;top:55%; }
.float-card {
    display:flex;align-items:center;gap:8px;padding:10px 16px;border-radius:12px;
    background:var(--bg-elevated);border:1px solid var(--border);box-shadow:var(--shadow-md);
    font-size:.78rem;font-weight:500;white-space:nowrap;
    animation:float 5s ease-in-out infinite;
}
.fl-left .float-card { animation-delay:0s; }
.fl-right .float-card { animation-delay:2.5s; }
@keyframes float { 0%,100%{transform:translateY(0)} 50%{transform:translateY(-8px)} }
.fl-dot { width:8px;height:8px;border-radius:50%;flex-shrink:0; }

/* ---- STATS ---- */
.stats { padding:80px 0; }
.stats-grid { display:grid;grid-template-columns:repeat(3,1fr);gap:20px;text-align:center; }
.stat-item { display:flex;flex-direction:column;align-items:center; }
.stat-num { font-family:var(--font-d);font-size:clamp(2rem,4vw,3.2rem);font-weight:900;line-height:1; }
.stat-suf {
    font-family:var(--font-d);font-size:clamp(2rem,4vw,3.2rem);font-weight:900;line-height:1;
    background:linear-gradient(135deg,var(--blue),var(--ice));
    -webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;
    display:inline;
}
.stat-label { font-size:.82rem;color:var(--text-2);margin-top:4px; }

/* ---- TESTIMONIALS ---- */
.clubs { padding:100px 0; }
.clubs > .container { text-align:center; }
.clubs .section-heading { margin-bottom:48px; }
.testi-grid { display:grid;grid-template-columns:repeat(3,1fr);gap:18px;text-align:left; }
.testi-card {
    padding:26px;border-radius:var(--radius-lg);background:var(--bg-card);border:1px solid var(--border);
    box-shadow:var(--shadow-sm);transition:all var(--dur) var(--ease);
}
.testi-card:hover { transform:translateY(-5px);box-shadow:var(--shadow-md); }
.testi-quote { font-size:.88rem;color:var(--text-2);line-height:1.7;margin-bottom:18px;font-style:italic; }
.testi-author { display:flex;align-items:center;gap:10px; }
.testi-av { width:36px;height:36px;border-radius:50%;display:flex;align-items:center;justify-content:center;color:#fff;font-size:.65rem;font-weight:700;flex-shrink:0; }
.testi-author strong { font-size:.82rem;display:block; }
.testi-author small { color:var(--text-3);font-size:.7rem; }

/* ---- DOWNLOAD ---- */
.download { padding:100px 0;background:var(--bg-2);border-top:1px solid var(--border); }
.dl-inner { text-align:center;max-width:700px;margin:0 auto; }
.dl-heading {
    font-family:var(--font-d);font-size:clamp(1.8rem,4.5vw,3.2rem);
    font-weight:900;line-height:1.1;letter-spacing:-.03em;margin-bottom:14px;
}
.dl-sub { font-size:.95rem;color:var(--text-2);margin-bottom:32px;line-height:1.7; }
.dl-btns { display:flex;gap:12px;justify-content:center;flex-wrap:wrap; }
.store-btn {
    display:flex;align-items:center;gap:12px;padding:13px 24px;border-radius:var(--radius);
    background:var(--bg-card);border:1px solid var(--border);box-shadow:var(--shadow-sm);
    transition:all var(--dur) var(--ease);
}
.store-btn:hover { transform:translateY(-2px);box-shadow:var(--shadow-md);border-color:var(--border-hover); }
.store-btn small { font-size:.6rem;color:var(--text-3);display:block;text-align:left;text-transform:uppercase;letter-spacing:.04em; }
.store-btn strong { font-size:.9rem;display:block;text-align:left; }

/* ---- FOOTER ---- */
.footer { padding:50px 0 24px;border-top:1px solid var(--border);width:100%;background:var(--bg-2);box-sizing:border-box; }
.footer-inner { width:100%;padding:0 24px;box-sizing:border-box; }
.footer-top { display:flex;justify-content:space-between;gap:40px;margin-bottom:32px; }
.footer-brand { display:flex;align-items:center;gap:8px;font-family:var(--font-d);font-weight:800;font-size:.95rem; }
.footer-cols { display:flex;gap:48px; }
.footer-col { display:flex;flex-direction:column;gap:8px; }
.footer-col h4 { font-size:.78rem;font-weight:700;margin-bottom:2px; }
.footer-col a { font-size:.8rem;color:var(--text-2);transition:color var(--dur); }
.footer-col a:hover { color:var(--text); }
.footer-left { display:flex;flex-direction:column;gap:16px; }
.footer-partner { display:flex;align-items:center;gap:8px;font-size:.78rem;color:var(--text-2);flex-wrap:wrap; }
.footer-partner-name { font-weight:600;color:var(--text); }
.footer-partner-logo { height:32px;width:auto;object-fit:contain; }
.footer-bottom { padding-top:16px;border-top:1px solid var(--border);font-size:.72rem;color:var(--text-3);display:flex;justify-content:space-between;align-items:center; }
.footer-collab { font-size:.68rem;color:var(--text-3);transition:color var(--dur);text-decoration:none; }
.footer-collab strong { color:var(--text-2);font-weight:600; }
.footer-collab:hover { color:var(--text); }
.footer-collab:hover strong { color:var(--text); }

/* ============================================
   ENHANCED ANIMATIONS
   ============================================ */

/* ---- Scroll progress bar ---- */
.scroll-progress {
    position:fixed;top:0;left:0;height:3px;z-index:9999;
    background:linear-gradient(90deg,var(--blue),var(--ice),var(--cyan));
    width:0;transition:none;
    box-shadow:0 0 10px rgba(79,195,247,.4);
}

/* ---- Cursor glow ---- */
.cursor-glow {
    position:fixed;width:500px;height:500px;border-radius:50%;
    background:radial-gradient(circle,rgba(79,195,247,.06) 0%,transparent 70%);
    pointer-events:none;z-index:0;transform:translate(-50%,-50%);
    transition:opacity .4s;opacity:0;
}
body:hover .cursor-glow { opacity:1; }
@media (hover:none) { .cursor-glow { display:none; } }

/* ---- Hero particles (ice crystals) ---- */
.hero-particles { position:absolute;inset:0;overflow:hidden; }
.particle {
    position:absolute;opacity:0;
    animation:particle-drift linear infinite;
    will-change:transform,opacity;
    contain:strict;
}
.particle:nth-child(odd) {
    border-radius:50%;
}
.particle:nth-child(even) {
    border-radius:1px;
    transform:rotate(45deg);
}
.particle:nth-child(3n) {
    border-radius:50% 0 50% 0;
}
@keyframes particle-drift {
    0% { opacity:0;transform:translateY(0) rotate(0deg) scale(0); }
    8% { opacity:.6;transform:rotate(45deg) scale(1); }
    50% { opacity:.3;transform:translateY(-50vh) translateX(20px) rotate(180deg) scale(.8); }
    85% { opacity:.1; }
    100% { opacity:0;transform:translateY(-100vh) translateX(-10px) rotate(360deg) scale(0); }
}
/* particle ::after blur removed for performance */

/* ---- Hero ice scratch background ---- */
.hero-grid-bg {
    position:absolute;inset:0;
    background-image:
        linear-gradient(72deg, rgba(79,195,247,.05) 0.5px, transparent 0.5px),
        linear-gradient(108deg, rgba(79,195,247,.04) 0.5px, transparent 0.5px),
        linear-gradient(165deg, rgba(128,222,234,.03) 0.3px, transparent 0.3px),
        linear-gradient(15deg, rgba(79,195,247,.025) 0.3px, transparent 0.3px),
        linear-gradient(85deg, rgba(179,229,252,.035) 0.4px, transparent 0.4px);
    background-size: 120px 80px, 90px 110px, 70px 140px, 150px 60px, 55px 95px;
    mask-image:radial-gradient(ellipse 70% 60% at 50% 40%,black 10%,transparent 100%);
    -webkit-mask-image:radial-gradient(ellipse 70% 60% at 50% 40%,black 10%,transparent 100%);
}
[data-theme="dark"] .hero-grid-bg {
    background-image:
        linear-gradient(72deg, rgba(79,195,247,.08) 0.5px, transparent 0.5px),
        linear-gradient(108deg, rgba(79,195,247,.06) 0.5px, transparent 0.5px),
        linear-gradient(165deg, rgba(128,222,234,.04) 0.3px, transparent 0.3px),
        linear-gradient(15deg, rgba(79,195,247,.035) 0.3px, transparent 0.3px),
        linear-gradient(85deg, rgba(179,229,252,.05) 0.4px, transparent 0.4px);
    background-size: 120px 80px, 90px 110px, 70px 140px, 150px 60px, 55px 95px;
}

/* ---- Hero frost overlay ---- */
.hero-frost {
    position:absolute;inset:0;
    background:
        radial-gradient(ellipse 80% 50% at 50% 100%, rgba(79,195,247,.08) 0%, transparent 70%),
        radial-gradient(ellipse 60% 40% at 20% 0%, rgba(179,229,252,.06) 0%, transparent 60%),
        radial-gradient(ellipse 50% 30% at 80% 10%, rgba(128,222,234,.05) 0%, transparent 50%);
    pointer-events:none;
}
[data-theme="dark"] .hero-frost {
    background:
        radial-gradient(ellipse 80% 50% at 50% 100%, rgba(79,195,247,.05) 0%, transparent 70%),
        radial-gradient(ellipse 60% 40% at 20% 0%, rgba(179,229,252,.03) 0%, transparent 60%),
        radial-gradient(ellipse 50% 30% at 80% 10%, rgba(128,222,234,.03) 0%, transparent 50%);
}

/* ---- Hero ice shine (rink spotlight) ---- */
.hero-ice-shine {
    position:absolute;inset:0;
    background:radial-gradient(ellipse 40% 35% at 50% 55%, rgba(255,255,255,.15) 0%, transparent 100%);
    pointer-events:none;
}
[data-theme="dark"] .hero-ice-shine {
    background:radial-gradient(ellipse 40% 35% at 50% 55%, rgba(79,195,247,.06) 0%, transparent 100%);
}

/* ---- Multi-direction reveals ---- */
.sr-left {
    opacity:0;transform:translateX(-60px);
    transition:opacity .8s var(--ease-out),transform .8s var(--ease-out);
}
.sr-left.vis { opacity:1;transform:translateX(0); }

.sr-right {
    opacity:0;transform:translateX(60px);
    transition:opacity .8s var(--ease-out),transform .8s var(--ease-out);
}
.sr-right.vis { opacity:1;transform:translateX(0); }

.sr-scale {
    opacity:0;transform:scale(.85);
    transition:opacity .7s var(--ease-out),transform .7s var(--ease-out);
}
.sr-scale.vis { opacity:1;transform:scale(1); }

.sr-rotate {
    opacity:0;transform:translateY(30px) rotate(3deg);
    transition:opacity .8s var(--ease-out),transform .8s var(--ease-out);
}
.sr-rotate.vis { opacity:1;transform:translateY(0) rotate(0); }

/* ---- Section heading clip reveal ---- */
.section-heading {
    overflow:hidden;
}
.section-heading .heading-line {
    display:block;overflow:hidden;
}
.section-heading .heading-line-inner {
    display:block;
    transform:translateY(105%);
    transition:transform .8s var(--ease-out);
}
.section-heading.vis .heading-line-inner {
    transform:translateY(0);
}
.section-heading.vis .heading-line:nth-child(2) .heading-line-inner {
    transition-delay:.12s;
}

/* ---- Section divider ---- */
.section-divider {
    display:flex;justify-content:center;padding:20px 0;
}
.divider-line {
    width:0;height:1px;
    background:linear-gradient(90deg,transparent,var(--ice),transparent);
    transition:width 1.2s var(--ease-out) .2s;
}
.section-divider.vis .divider-line { width:200px; }

/* ---- Tilt card 3D ---- */
[data-tilt] {
    transform-style:preserve-3d;
    transition:transform .3s var(--ease),box-shadow .3s var(--ease);
}

/* ---- Magnetic button ---- */
[data-magnetic] {
    transition:transform .25s var(--ease-out),box-shadow var(--dur) var(--ease);
}

/* ---- Feature number entrance (scale) ---- */
.feat-num {
    transform:scale(0);
    transition:transform .7s var(--ease-out);
}
.feat-num.vis { transform:scale(1); }

/* ---- Feature list items stagger ---- */
.feat-list li {
    opacity:0;transform:translateX(-20px);
    transition:opacity .5s var(--ease-out),transform .5s var(--ease-out);
}
.feat-list.vis li { opacity:1;transform:translateX(0); }
.feat-list.vis li:nth-child(1) { transition-delay:.1s; }
.feat-list.vis li:nth-child(2) { transition-delay:.2s; }
.feat-list.vis li:nth-child(3) { transition-delay:.3s; }

/* ---- Stat bounce ---- */
.stat-item {
    transition:transform .6s var(--ease-out);
}
.stat-item.counted {
    animation:stat-pop .5s var(--ease-out);
}
@keyframes stat-pop {
    0% { transform:scale(1); }
    50% { transform:scale(1.08); }
    100% { transform:scale(1); }
}

/* ---- Bonus card icon spin on hover ---- */
.bonus-icon {
    transition:transform .5s var(--ease-out);
}
.bonus-card:hover .bonus-icon {
    transform:rotate(8deg) scale(1.1);
}

/* ---- Store button shimmer ---- */
.store-btn {
    position:relative;overflow:hidden;
}
.store-btn::after {
    content:'';position:absolute;top:0;left:-100%;width:100%;height:100%;
    background:linear-gradient(90deg,transparent,rgba(255,255,255,.08),transparent);
    transition:none;
}
.store-btn:hover::after {
    animation:shimmer .8s ease;
}
@keyframes shimmer {
    from { left:-100%; }
    to { left:100%; }
}

/* ---- Marquee hover slowdown ---- */
.marquee:hover .marquee-track {
    animation-play-state:paused;
}

/* ---- Button ripple effect ---- */
.btn-primary {
    position:relative;overflow:hidden;
}
.btn-primary .ripple {
    position:absolute;border-radius:50%;
    background:rgba(255,255,255,.25);
    transform:scale(0);animation:ripple-out .6s ease-out forwards;
    pointer-events:none;
}
@keyframes ripple-out {
    to { transform:scale(4);opacity:0; }
}

/* ---- Glow pulse on download heading ---- */
.dl-heading {
    animation:glow-text 4s ease-in-out infinite alternate;
}
@keyframes glow-text {
    0% { text-shadow:none; }
    100% { text-shadow:0 0 40px rgba(79,195,247,.2); }
}
[data-theme="dark"] .dl-heading {
    animation-name:glow-text-dark;
}
@keyframes glow-text-dark {
    0% { text-shadow:none; }
    100% { text-shadow:0 0 50px rgba(79,195,247,.3); }
}

/* ---- Floating card pulse dot ---- */
.fl-dot {
    animation:dot-pulse 2s ease-in-out infinite;
}
@keyframes dot-pulse {
    0%,100% { opacity:1;transform:scale(1); }
    50% { opacity:.4;transform:scale(.7); }
}

/* ---- RESPONSIVE ---- */
@media (max-width:1024px) {
    .feat-row,.feat-row.reverse { grid-template-columns:1fr;direction:ltr;gap:36px; }
    .feat-row.reverse > * { direction:ltr; }
    .testi-grid { grid-template-columns:1fr;max-width:480px;margin:0 auto; }
    .stats-grid { grid-template-columns:repeat(2,1fr); }
    .bonus-grid { grid-template-columns:repeat(2,1fr); }
    .phone-float { display:none; }
}
/* ---- TOPBAR ACTIONS ---- */
.topbar-actions {
    display:flex;align-items:center;gap:8px;
}
.topbar-app-btn {
    display:flex;align-items:center;gap:6px;
    padding:8px 16px;border-radius:10px;border:none;cursor:pointer;
    background:linear-gradient(135deg,var(--blue),var(--ice));
    color:#fff;font-size:.82rem;font-weight:600;font-family:var(--font);
    transition:all var(--dur) var(--ease);
    white-space:nowrap;
}
.topbar-app-btn:hover {
    transform:translateY(-1px);
    box-shadow:0 4px 16px rgba(79,195,247,.35);
}
.topbar-app-btn svg { flex-shrink:0; }

/* ---- LANGUAGE SWITCHER ---- */
.lang-switcher { position:relative; }
.lang-btn {
    display:flex;align-items:center;gap:6px;
    padding:7px 12px;border-radius:10px;
    border:1px solid var(--border);background:var(--bg-card);
    color:var(--text-2);font-size:.82rem;font-weight:600;
    transition:all var(--dur);cursor:pointer;
}
.lang-btn:hover { background:var(--bg-2);color:var(--text);border-color:var(--border-hover); }
.lang-current { font-family:var(--font-d); }

.lang-dropdown {
    position:absolute;top:calc(100% + 8px);right:0;
    min-width:160px;padding:6px;border-radius:12px;
    background:var(--bg-elevated);border:1px solid var(--border);
    box-shadow:var(--shadow-lg);
    opacity:0;visibility:hidden;transform:translateY(-8px);
    transition:all .2s var(--ease);z-index:200;
}
.lang-dropdown.open {
    opacity:1;visibility:visible;transform:translateY(0);
}
.lang-option {
    display:flex;align-items:center;gap:8px;width:100%;
    padding:9px 12px;border-radius:8px;
    font-size:.85rem;color:var(--text-2);
    transition:all var(--dur);text-align:left;
}
.lang-option:hover { background:var(--bg-2);color:var(--text); }
.lang-option.active { background:var(--blue-bg);color:var(--blue);font-weight:600; }
[data-theme="dark"] .lang-option.active { background:rgba(30,136,229,.12);color:var(--blue-light); }

/* ---- EXPERTS SECTION ---- */
.experts {
    padding:100px 0;
}
.experts > .container { max-width:1300px; }
.experts-grid {
    display:flex;flex-wrap:wrap;justify-content:center;gap:32px;
    margin-top:48px;
}
.expert-card {
    flex:0 1 380px;max-width:400px;
    background:var(--bg-card);border:1px solid var(--border);
    border-radius:var(--radius-lg);padding:36px;
    transition:all .4s var(--ease);
    display:flex;flex-direction:column;align-items:center;text-align:center;
}
.expert-card:hover {
    border-color:var(--border-hover);
    box-shadow:var(--shadow-lg);
    transform:translateY(-4px);
}
.expert-photo { margin-bottom:20px; }
.expert-img {
    width:100px;height:100px;border-radius:50%;object-fit:cover;
    box-shadow:0 8px 24px rgba(79,195,247,.25);
    border:3px solid var(--border);
}
.expert-avatar {
    width:80px;height:80px;border-radius:50%;
    display:flex;align-items:center;justify-content:center;
    font-family:var(--font-d);font-weight:800;font-size:1.4rem;color:#fff;
    box-shadow:0 8px 24px rgba(79,195,247,.25);
}
.expert-info { display:flex;flex-direction:column;gap:8px; }
.expert-name {
    font-family:var(--font-d);font-size:1.3rem;font-weight:800;
    color:var(--text);
}
.expert-role {
    font-size:.88rem;font-weight:600;
    background:linear-gradient(135deg,var(--blue),var(--ice));
    -webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;
}
.expert-bio {
    font-size:.9rem;color:var(--text-2);line-height:1.7;
    margin-top:4px;
}
.expert-tags {
    display:flex;flex-wrap:wrap;gap:8px;justify-content:center;
    margin-top:12px;
}
.expert-tag {
    padding:5px 12px;border-radius:20px;
    background:var(--bg-2);border:1px solid var(--border);
    font-size:.75rem;font-weight:600;color:var(--text-2);
}

@media (max-width:768px) {
    .hero { padding:90px 24px 50px; }
    .feat-block { padding:50px 0; }
    .bonus-grid { grid-template-columns:1fr; }
    .footer-top { flex-direction:column; }
    .footer-cols { flex-wrap:wrap;gap:24px; }
    .dl-btns { flex-direction:column;align-items:center; }
    .experts-grid { flex-direction:column;align-items:center; }
    .topbar-app-btn span { display:none; }
    .topbar-app-btn { padding:8px 10px; }
}
@media (max-width:480px) {
    .hero-actions { flex-direction:column;align-items:center; }
    .stats-grid { grid-template-columns:1fr 1fr; }
    .topbar-actions { gap:4px; }
    .dl-btns { flex-direction:column;align-items:stretch; }
    .store-btn { width:100%;justify-content:center; }
    .toggle-row { flex-direction:column;align-items:flex-start;gap:10px; }
    .recap-field { flex-direction:column;gap:4px; }
    .recap-field-value { text-align:left;max-width:100%; }
    .field-error { white-space:normal;max-width:240px; }
}

/* ---- SCROLL TO TOP ---- */
.scroll-top-btn {
    position:fixed;bottom:32px;right:32px;z-index:900;
    width:44px;height:44px;border-radius:50%;border:1px solid var(--border);
    background:var(--bg-card);color:var(--text);
    display:flex;align-items:center;justify-content:center;
    cursor:pointer;
    opacity:0;visibility:hidden;transform:translateY(12px);
    transition:opacity .4s var(--ease),transform .4s var(--ease),
               visibility .4s,background .2s,border-color .2s,box-shadow .2s;
    backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);
    box-shadow:0 2px 12px rgba(0,0,0,.08);
}
.scroll-top-btn.visible {
    opacity:.7;visibility:visible;transform:translateY(0);
}
.scroll-top-btn:hover {
    opacity:1;border-color:var(--border-hover);
    box-shadow:var(--shadow-lg);transform:translateY(-2px);
}
@media (max-width:768px) {
    .scroll-top-btn { bottom:20px;right:20px;width:40px;height:40px; }
}

/* ============================================
   WIZARD / MULTI-STEP FORMS
   ============================================ */

.wizard-container { max-width:720px;margin:0 auto;padding:0 24px 80px; }

/* Progress bar */
.wizard-progress { display:flex;align-items:center;justify-content:center;gap:0;margin-bottom:40px;padding:0 16px; }
.wizard-progress-step { display:flex;align-items:center;gap:0; }
.wizard-progress-dot {
    width:36px;height:36px;border-radius:50%;display:flex;align-items:center;justify-content:center;
    font-family:var(--font-d);font-weight:700;font-size:.85rem;
    border:2px solid var(--border);color:var(--text-3);background:var(--bg);
    transition:all .3s var(--ease);flex-shrink:0;
}
.wizard-progress-dot.active { border-color:var(--blue);color:#fff;background:var(--blue); }
.wizard-progress-dot.completed { border-color:var(--green);color:#fff;background:var(--green); }
.wizard-progress-line {
    width:40px;height:2px;background:var(--border);transition:background .3s;flex-shrink:0;
}
.wizard-progress-line.completed { background:var(--green); }
.wizard-progress-label {
    display:none;
}
@media(max-width:640px){
    .wizard-progress { padding:0 4px;gap:0; }
    .wizard-progress-dot { width:28px;height:28px;font-size:.72rem; }
    .wizard-progress-line { width:20px; }
}
@media(max-width:400px){
    .wizard-progress-dot { width:24px;height:24px;font-size:.65rem; }
    .wizard-progress-line { width:12px; }
}

/* Steps */
.wizard-step { display:none; }
.wizard-step.active { display:block;animation:fadeInStep .3s var(--ease); }
@keyframes fadeInStep { from{opacity:0;transform:translateY(12px)} to{opacity:1;transform:translateY(0)} }

.wizard-step-title {
    font-family:var(--font-d);font-size:clamp(1.4rem,3vw,1.8rem);font-weight:800;
    margin-bottom:8px;color:var(--text);
}
.wizard-step-desc { color:var(--text-2);font-size:.95rem;margin-bottom:32px; }

/* Nav buttons */
.wizard-nav { display:flex;justify-content:space-between;gap:16px;margin-top:32px; }
.wizard-btn {
    padding:12px 28px;border-radius:12px;font-family:var(--font-d);font-weight:700;font-size:.95rem;
    transition:all .3s var(--ease);display:inline-flex;align-items:center;gap:8px;cursor:pointer;
}
.wizard-btn-prev {
    background:var(--bg-2);color:var(--text-2);border:1px solid var(--border);
}
.wizard-btn-prev:hover { background:var(--bg-3);color:var(--text); }
.wizard-btn-next {
    background:linear-gradient(135deg,var(--blue),var(--ice));color:#fff;border:none;
    box-shadow:0 4px 16px rgba(30,136,229,.25);
}
.wizard-btn-next:hover { transform:translateY(-2px);box-shadow:0 8px 24px rgba(30,136,229,.3); }
.wizard-btn-next:active { transform:translateY(0); }
.wizard-btn-next:disabled { opacity:.5;cursor:not-allowed;transform:none;box-shadow:none; }

/* ---- FORM COMPONENTS ---- */
.form-group { display:flex;flex-direction:column;gap:6px;margin-bottom:16px; }
.form-row { display:grid;grid-template-columns:1fr 1fr;gap:16px; }
@media(max-width:560px){ .form-row { grid-template-columns:1fr; } }
.form-label { font-size:.85rem;font-weight:600;color:var(--text); }
.form-label .required { color:var(--red);margin-left:2px; }
.form-input, .form-select, .form-textarea {
    padding:12px 14px;border-radius:10px;border:1px solid var(--border);
    background:var(--bg-card);color:var(--text);font-family:var(--font);font-size:.92rem;
    transition:all .3s;outline:none;width:100%;
}
.form-input:focus, .form-select:focus, .form-textarea:focus {
    border-color:var(--blue);box-shadow:0 0 0 3px rgba(30,136,229,.12);
}
.form-input::placeholder, .form-textarea::placeholder { color:var(--text-3); }
.form-textarea { resize:vertical;min-height:100px; }
.form-select { cursor:pointer;appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath d='M2 4l4 4 4-4' stroke='%239a9ab0' stroke-width='1.5' fill='none'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 14px center; }
.form-hint { font-size:.78rem;color:var(--text-3);margin-top:2px; }
.form-error { font-size:.78rem;color:var(--red);margin-top:2px;display:none; }
.form-group.has-error .form-input,
.form-group.has-error .form-select { border-color:var(--red); }
.form-group.has-error .form-error { display:block; }

.form-submit {
    padding:14px 32px;border-radius:12px;border:none;cursor:pointer;
    background:linear-gradient(135deg,var(--blue),var(--ice));
    color:#fff;font-family:var(--font-d);font-weight:700;font-size:1rem;
    transition:all .3s;display:flex;align-items:center;justify-content:center;gap:8px;
}
.form-submit:hover { transform:translateY(-2px);box-shadow:0 8px 24px rgba(30,136,229,.3); }
.form-submit:active { transform:translateY(0); }

.form-msg { padding:14px 18px;border-radius:10px;font-size:.9rem;font-weight:500;display:none;text-align:center; }
.form-msg.success { display:block;background:#e8f5e9;color:#2e7d32;border:1px solid #c8e6c9; }
.form-msg.error { display:block;background:#ffebee;color:#c62828;border:1px solid #ffcdd2; }
[data-theme="dark"] .form-msg.success { background:rgba(46,125,50,.15);color:#66bb6a;border-color:rgba(46,125,50,.3); }
[data-theme="dark"] .form-msg.error { background:rgba(198,40,40,.15);color:#ef5350;border-color:rgba(198,40,40,.3); }

/* ---- OPTION CARDS (choice steps) ---- */
.option-cards { display:grid;grid-template-columns:1fr 1fr;gap:16px; }
@media(max-width:560px){ .option-cards { grid-template-columns:1fr; } }
.option-card {
    padding:28px 24px;border-radius:var(--radius-lg);border:2px solid var(--border);
    background:var(--bg-card);cursor:pointer;transition:all .3s var(--ease);text-align:center;
}
.option-card:hover { border-color:var(--blue);background:var(--bg-card-hover);transform:translateY(-2px); }
.option-card.selected { border-color:var(--blue);background:rgba(30,136,229,.06);box-shadow:0 0 0 3px rgba(30,136,229,.12); }
[data-theme="dark"] .option-card.selected { background:rgba(30,136,229,.1); }
.option-card-icon { font-size:2rem;margin-bottom:12px; }
.option-card-title { font-family:var(--font-d);font-weight:700;font-size:1.05rem;margin-bottom:6px;color:var(--text); }
.option-card-desc { font-size:.85rem;color:var(--text-2);line-height:1.5; }

/* ---- CLUB SEARCH ---- */
.club-search { position:relative;margin-bottom:24px; }
.club-search-input {
    width:100%;padding:14px 14px 14px 44px;border-radius:14px;border:1px solid var(--border);
    background:var(--bg-card);color:var(--text);font-family:var(--font);font-size:.95rem;
    transition:all .3s;outline:none;
}
.club-search-input:focus { border-color:var(--blue);box-shadow:0 0 0 3px rgba(30,136,229,.12); }
.club-search-icon { position:absolute;left:14px;top:50%;transform:translateY(-50%);color:var(--text-3); }
.club-grid { display:grid;grid-template-columns:1fr;gap:12px;max-height:400px;overflow-y:auto;padding-right:4px; }
.club-card {
    display:flex;align-items:center;gap:16px;padding:16px 20px;border-radius:var(--radius);
    border:2px solid var(--border);background:var(--bg-card);cursor:pointer;transition:all .3s;
}
.club-card:hover { border-color:var(--blue);background:var(--bg-card-hover); }
.club-card.selected { border-color:var(--blue);background:rgba(30,136,229,.06);box-shadow:0 0 0 3px rgba(30,136,229,.12); }
.club-card-logo { width:44px;height:44px;border-radius:10px;object-fit:cover;background:var(--bg-2);flex-shrink:0; }
.club-card-info { flex:1;min-width:0; }
.club-card-name { font-family:var(--font-d);font-weight:700;font-size:.95rem;color:var(--text); }
.club-card-meta { font-size:.8rem;color:var(--text-3);margin-top:2px; }

/* ---- TOGGLE SWITCH ---- */
.toggle-row { display:flex;align-items:center;justify-content:space-between;padding:14px 0;border-bottom:1px solid var(--border); }
.toggle-row:last-child { border-bottom:none; }
.toggle-label { font-size:.92rem;font-weight:500;color:var(--text); }
.toggle-switch {
    position:relative;width:48px;height:26px;border-radius:13px;
    background:var(--border);cursor:pointer;transition:background .3s;flex-shrink:0;
}
.toggle-switch.active { background:var(--blue); }
.toggle-switch::after {
    content:'';position:absolute;top:3px;left:3px;width:20px;height:20px;border-radius:50%;
    background:#fff;transition:transform .3s var(--ease);box-shadow:0 1px 4px rgba(0,0,0,.15);
}
.toggle-switch.active::after { transform:translateX(22px); }

/* ---- PLAN CARDS ---- */
.plan-grid { display:grid;grid-template-columns:1fr 1fr;gap:16px; }
@media(max-width:640px){ .plan-grid { grid-template-columns:1fr; } }
.plan-card {
    padding:28px 24px;border-radius:var(--radius-lg);border:2px solid var(--border);
    background:var(--bg-card);cursor:pointer;transition:all .3s var(--ease);text-align:center;
    position:relative;
}
.plan-card:hover { border-color:var(--blue);transform:translateY(-2px); }
.plan-card.selected { border-color:var(--blue);background:rgba(30,136,229,.06);box-shadow:0 0 0 3px rgba(30,136,229,.12); }
.plan-card-name { font-family:var(--font-d);font-weight:700;font-size:1.1rem;margin-bottom:8px;color:var(--text); }
.plan-card-price { font-family:var(--font-d);font-weight:800;font-size:1.6rem;color:var(--blue);margin-bottom:4px; }
.plan-card-period { font-size:.8rem;color:var(--text-3);margin-bottom:12px; }
.plan-card-limit { font-size:.85rem;color:var(--text-2);padding:8px 16px;border-radius:8px;background:var(--bg-2);display:inline-block; }

/* ---- CATEGORY ROWS (dynamic) ---- */
.category-row {
    display:grid;grid-template-columns:1fr 80px 80px 120px 40px;gap:12px;align-items:end;
    padding:12px 0;border-bottom:1px solid var(--border);
}
@media(max-width:640px){ .category-row { grid-template-columns:1fr 1fr;gap:8px; } }
.category-remove {
    width:36px;height:36px;border-radius:8px;display:flex;align-items:center;justify-content:center;
    color:var(--red);border:1px solid var(--border);background:var(--bg-card);cursor:pointer;transition:all .3s;
}
.category-remove:hover { background:var(--red-bg);border-color:var(--red); }

/* ---- CHILD FORM BLOCK ---- */
.child-block {
    padding:24px;border-radius:var(--radius-lg);border:1px solid var(--border);
    background:var(--bg-card);margin-bottom:16px;position:relative;
}
.child-block-header {
    display:flex;align-items:center;justify-content:space-between;margin-bottom:20px;
}
.child-block-title { font-family:var(--font-d);font-weight:700;font-size:1rem;color:var(--text); }
.child-block-remove {
    padding:6px 12px;border-radius:8px;font-size:.82rem;font-weight:600;
    color:var(--red);border:1px solid var(--border);background:var(--bg);cursor:pointer;transition:all .3s;
}
.child-block-remove:hover { background:var(--red-bg);border-color:var(--red); }

.add-child-btn {
    width:100%;padding:16px;border-radius:var(--radius);border:2px dashed var(--border);
    background:transparent;color:var(--text-2);font-family:var(--font-d);font-weight:600;
    font-size:.92rem;cursor:pointer;transition:all .3s;display:flex;align-items:center;justify-content:center;gap:8px;
}
.add-child-btn:hover { border-color:var(--blue);color:var(--blue);background:rgba(30,136,229,.04); }

/* ---- CHECKBOX / CONDITIONS ---- */
.form-checkbox-row {
    display:flex;align-items:flex-start;gap:10px;padding:16px 0;
}
.form-checkbox {
    width:20px;height:20px;border-radius:6px;border:2px solid var(--border);
    background:var(--bg-card);cursor:pointer;transition:all .3s;flex-shrink:0;margin-top:2px;
    display:flex;align-items:center;justify-content:center;
}
.form-checkbox.checked { background:var(--blue);border-color:var(--blue); }
.form-checkbox.checked::after { content:'✓';color:#fff;font-size:.75rem;font-weight:700; }
.form-checkbox-text { font-size:.88rem;color:var(--text-2);line-height:1.5; }
.form-checkbox-text a { color:var(--blue);font-weight:600; }
.form-checkbox-text a:hover { text-decoration:underline; }

/* ---- QS SPORT QUESTIONNAIRE ---- */
.qs-sport { padding:20px;border-radius:var(--radius);border:1px solid var(--border);background:var(--bg-2);margin:16px 0; }
.qs-sport-title { font-family:var(--font-d);font-weight:700;font-size:.95rem;margin-bottom:16px;color:var(--text); }
.qs-sport-section { font-weight:700;font-size:.82rem;color:var(--blue);margin:16px 0 8px;text-transform:uppercase;letter-spacing:.5px; }
.qs-sport-q {
    display:flex;align-items:flex-start;gap:12px;padding:10px 0;border-bottom:1px solid var(--border);
}
.qs-sport-q:last-child { border-bottom:none; }
.qs-sport-q-text { flex:1;font-size:.88rem;color:var(--text);line-height:1.5; }
.qs-sport-q-btns { display:flex;gap:6px;flex-shrink:0; }
.qs-sport-btn {
    padding:5px 14px;border-radius:8px;font-size:.8rem;font-weight:600;
    border:1px solid var(--border);background:var(--bg-card);color:var(--text-2);cursor:pointer;transition:all .3s;
}
.qs-sport-btn.yes.selected { background:var(--red-bg);border-color:var(--red);color:var(--red); }
.qs-sport-btn.no.selected { background:var(--green-bg);border-color:var(--green);color:var(--green); }
.qs-sport-result {
    margin-top:16px;padding:14px 18px;border-radius:10px;font-size:.88rem;line-height:1.5;
}
.qs-sport-result.all-no { background:var(--green-bg);color:var(--green);border:1px solid var(--green); }
.qs-sport-result.has-yes { background:var(--red-bg);color:var(--red);border:1px solid var(--red); }
[data-theme="dark"] .qs-sport-result.all-no { background:rgba(67,160,71,.12);color:#66bb6a;border-color:rgba(67,160,71,.3); }
[data-theme="dark"] .qs-sport-result.has-yes { background:rgba(229,57,53,.12);color:#ef5350;border-color:rgba(229,57,53,.3); }

/* ---- RECAP ---- */
.recap-section {
    padding:20px;border-radius:var(--radius);border:1px solid var(--border);
    background:var(--bg-card);margin-bottom:16px;
}
.recap-section-title {
    display:flex;align-items:center;justify-content:space-between;margin-bottom:16px;
}
.recap-section-title h3 { font-family:var(--font-d);font-weight:700;font-size:1rem;color:var(--text); }
.recap-edit-btn {
    padding:5px 14px;border-radius:8px;font-size:.8rem;font-weight:600;
    color:var(--blue);border:1px solid var(--border);background:var(--bg);cursor:pointer;transition:all .3s;
}
.recap-edit-btn:hover { background:var(--blue-bg);border-color:var(--blue); }
.recap-field { display:flex;justify-content:space-between;padding:8px 0;border-bottom:1px solid var(--border); }
.recap-field:last-child { border-bottom:none; }
.recap-field-label { font-size:.85rem;color:var(--text-3); }
.recap-field-value { font-size:.85rem;font-weight:600;color:var(--text);text-align:right;max-width:60%; }

/* ---- ADDRESS AUTOCOMPLETE ---- */
.address-autocomplete { position:relative; }
.address-dropdown {
    position:absolute;top:100%;left:0;right:0;z-index:100;
    background:var(--bg-elevated);border:1px solid var(--border);border-radius:10px;
    box-shadow:var(--shadow-md);margin-top:4px;max-height:200px;overflow-y:auto;display:none;
}
.address-dropdown.open { display:block; }
.address-option {
    padding:10px 14px;cursor:pointer;font-size:.88rem;color:var(--text);transition:background .2s;
}
.address-option:hover { background:var(--bg-2); }
.address-option-main { font-weight:500; }
.address-option-context { font-size:.78rem;color:var(--text-3);margin-top:2px; }

/* ---- ACTION SECTION (full-page 3-col) ---- */
.action-section {
    position:relative;padding:0;
    border-top:1px solid var(--border);
    border-bottom:1px solid var(--border);
}
.action-section > .container { max-width:100%;padding:0;margin:0; }
.action-cards {
    display:grid;grid-template-columns:repeat(2,1fr);
    text-align:left;min-height:420px;
}
.action-cards-3 {
    grid-template-columns:repeat(3,1fr);
}
.action-card {
    position:relative;background:var(--bg);
    border:none;border-radius:0;
    padding:60px 48px;text-decoration:none;color:var(--text);
    transition:background .35s var(--ease);
    display:flex;flex-direction:column;gap:16px;
}
.action-card + .action-card { border-left:1px solid var(--border); }
.action-card:hover {
    transform:none;box-shadow:none;
    background:var(--bg-2);
}
.action-card-icon {
    width:60px;height:60px;border-radius:16px;
    display:flex;align-items:center;justify-content:center;
}
.action-card-title {
    font-family:var(--font-d);font-size:1.25rem;font-weight:800;
}
.action-card-desc {
    color:var(--text-2);font-size:.9rem;line-height:1.6;flex:1;
}
.action-card-link {
    display:inline-flex;align-items:center;gap:6px;
    color:var(--blue);font-weight:600;font-size:.92rem;
    margin-top:auto;transition:gap .3s;
}
.action-card:hover .action-card-link { gap:10px; }
@media(max-width:900px){
    .action-cards-3 { grid-template-columns:1fr; }
    .action-card + .action-card { border-left:none;border-top:1px solid var(--border); }
    .action-card { padding:48px 32px; }
}
@media(max-width:640px){
    .action-cards { grid-template-columns:1fr; }
    .action-card + .action-card { border-left:none;border-top:1px solid var(--border); }
    .action-card { padding:36px 20px; }
}

/* ---- PAGE LAYOUT (shared for inscription & creation-club) ---- */
.page-hero { padding:120px 24px 40px;text-align:center; }
.page-hero h1 { font-family:var(--font-d);font-size:clamp(2rem,5vw,3rem);font-weight:900;margin-bottom:12px; }
.page-hero p { color:var(--text-2);font-size:1.05rem;max-width:600px;margin:0 auto; }
.back-link { display:inline-flex;align-items:center;gap:8px;color:var(--blue);font-weight:600;font-size:.9rem;margin-bottom:32px; }
.back-link:hover { text-decoration:underline; }

/* ---- PHOTO UPLOAD ---- */
.photo-upload-wrap { display:flex;align-items:center;gap:14px; }
.photo-preview-circle {
    width:84px;height:84px;border-radius:50%;
    background:var(--bg-2);border:1.5px dashed var(--border);
    display:flex;align-items:center;justify-content:center;
    overflow:hidden;flex-shrink:0;transition:border-color .2s;
}
.photo-preview-circle.has-photo { border-style:solid;border-color:var(--blue); }
.photo-preview-circle img { width:100%;height:100%;object-fit:cover; }
.photo-preview-placeholder { font-size:1.6rem;color:var(--text-3);opacity:.55; }
.photo-upload-actions { display:flex;flex-direction:column;gap:6px; }
.photo-upload-btn {
    display:inline-flex;align-items:center;gap:6px;
    padding:8px 14px;border-radius:8px;cursor:pointer;
    background:var(--bg-card);border:1px solid var(--border);
    color:var(--text);font-size:.82rem;font-weight:600;
    transition:all .2s;
}
.photo-upload-btn:hover { border-color:var(--blue);color:var(--blue); }
.photo-remove-btn {
    padding:4px 10px;border-radius:6px;cursor:pointer;
    background:transparent;border:none;
    color:var(--text-3);font-size:.78rem;
    transition:color .2s;
}
.photo-remove-btn:hover { color:var(--red); }
.photo-hint { font-size:.72rem;color:var(--text-3); }
.photo-upload-wrap.has-error .photo-preview-circle { border-color:rgba(229,57,53,.5);background:rgba(229,57,53,.04); }

/* ---- INLINE FIELD ERRORS ---- */
.field-error {
    display:flex;align-items:center;gap:6px;
    margin-top:6px;padding:5px 10px;border-radius:6px;
    background:rgba(229,57,53,.08);
    color:var(--red);
    border:1px solid rgba(229,57,53,.22);
    font-size:.75rem;font-weight:500;line-height:1.35;
    animation:fieldErrorIn .2s var(--ease-out);
    pointer-events:none;
}
.field-error::before {
    content:"!";flex:0 0 auto;
    width:14px;height:14px;border-radius:50%;
    background:var(--red);color:#fff;
    font-size:.68rem;font-weight:700;
    display:inline-flex;align-items:center;justify-content:center;
    line-height:1;
}
@keyframes fieldErrorIn { from{opacity:0;transform:translateY(-2px)} to{opacity:1;transform:translateY(0)} }
.form-input.has-error, .form-select.has-error, .form-textarea.has-error, .captcha-input.has-error {
    border-color:rgba(229,57,53,.5);
    box-shadow:0 0 0 2px rgba(229,57,53,.08);
}
.plan-grid.has-error .plan-card { border-color:rgba(229,57,53,.5); }
.form-checkbox-row.has-error .form-checkbox { border-color:rgba(229,57,53,.6); }
.child-categories.has-error .child-categories-list,
#categoriesSection.has-error #categoriesCheckboxes { outline:1.5px solid rgba(229,57,53,.38);outline-offset:3px;border-radius:8px; }
.qs-sport.has-error { border-color:rgba(229,57,53,.5);box-shadow:0 0 0 2px rgba(229,57,53,.08); }
.form-checkbox-row, .photo-upload-wrap { flex-wrap:wrap; }
.form-checkbox-row > .field-error,
.photo-upload-wrap > .field-error,
.option-cards > .field-error,
.form-row > .field-error { flex:1 0 100%;grid-column:1 / -1; }

/* ---- CATEGORY FILTERS ---- */
.cat-filter-btn {
    padding:5px 14px;border-radius:20px;
    border:1px solid var(--border);background:var(--bg-card);
    color:var(--text-3);font-size:.78rem;font-weight:500;
    cursor:pointer;transition:all .2s;white-space:nowrap;
}
.cat-filter-btn:hover { border-color:var(--blue);color:var(--blue); }
.cat-filter-btn.active {
    background:var(--blue);color:#fff;border-color:var(--blue);
}
.cat-sort-btn.active {
    background:rgba(30,136,229,.1);color:var(--blue);border-color:var(--blue);
}
