/* /Pages/Account/Subscription.razor.rz.scp.css */
.registration-page[b-bcnno4z60u] {
    min-height: 100vh;
    display: flex;
    flex-direction: column;
    background:
        radial-gradient(circle at 8% 15%, rgb(255 183 77 / 18%), transparent 26rem),
        radial-gradient(circle at 92% 78%, rgb(255 87 34 / 10%), transparent 30rem),
        var(--color-light);
}

.registration-header[b-bcnno4z60u],
.registration-footer[b-bcnno4z60u],
.registration-main[b-bcnno4z60u] {
    width: min(1180px, calc(100% - 3rem));
    margin-inline: auto;
}

.registration-header[b-bcnno4z60u] {
    min-height: 88px;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.brand[b-bcnno4z60u] { display: inline-flex; align-items: center; gap: .75rem; color: var(--color-dark); text-decoration: none; }
.brand-icon[b-bcnno4z60u] { width: 46px; height: 46px; display: block; }
.brand-text[b-bcnno4z60u] { font-size: 1.5rem; font-weight: 800; letter-spacing: -.03em; }
.brand-text span[b-bcnno4z60u] { color: var(--color-primary); }
.back-link[b-bcnno4z60u] { color: var(--color-dark-muted); font-weight: 650; text-decoration: none; }
.back-link:hover[b-bcnno4z60u] { color: var(--color-primary); }

.registration-main[b-bcnno4z60u] {
    flex: 1;
    display: grid;
    grid-template-columns: minmax(0, .85fr) minmax(520px, 1.15fr);
    gap: clamp(3rem, 8vw, 7rem);
    align-items: center;
    padding-block: clamp(3rem, 8vh, 6rem);
}

.registration-intro[b-bcnno4z60u] { max-width: 34rem; }
.intro-kicker[b-bcnno4z60u],
.step-label[b-bcnno4z60u] { color: var(--color-primary); font-weight: 750; }
.intro-kicker[b-bcnno4z60u] { display: inline-block; margin-bottom: 1rem; }
.registration-intro h1[b-bcnno4z60u] { font-size: clamp(2.5rem, 5vw, 4.7rem); line-height: 1.02; letter-spacing: -.035em; margin: 0 0 1.5rem; text-wrap: balance; }
.registration-intro > p[b-bcnno4z60u] { max-width: 62ch; color: var(--color-dark-muted); font-size: 1.08rem; line-height: 1.75; }

.benefits[b-bcnno4z60u] { list-style: none; padding: 0; margin: 2.75rem 0 0; display: grid; gap: 1.15rem; }
.benefits li[b-bcnno4z60u] { display: flex; align-items: center; gap: 1rem; color: #64748b; }
.benefits li > span[b-bcnno4z60u] { width: 2.4rem; height: 2.4rem; display: grid; place-items: center; border-radius: 50%; border: 1px solid #cbd5e1; background: #fff; font-weight: 750; }
.benefits strong[b-bcnno4z60u], .benefits small[b-bcnno4z60u] { display: block; }
.benefits strong[b-bcnno4z60u] { color: var(--color-dark); }
.benefits small[b-bcnno4z60u] { margin-top: .12rem; }
.benefits .is-current > span[b-bcnno4z60u] { background: var(--color-primary); border-color: var(--color-primary); color: #fff; box-shadow: 0 8px 18px -8px rgb(255 87 34 / 70%); }
.benefits .is-done > span[b-bcnno4z60u] { border-color: #22c55e; color: #15803d; }

.registration-panel[b-bcnno4z60u] { background: #fff; border-radius: 16px; box-shadow: var(--shadow-xl); padding: clamp(2rem, 5vw, 3.5rem); }
.panel-heading[b-bcnno4z60u] { margin-bottom: 2rem; }
.panel-heading h2[b-bcnno4z60u], .success-state h2[b-bcnno4z60u] { font-size: clamp(1.8rem, 3vw, 2.35rem); letter-spacing: -.025em; margin: .4rem 0 .65rem; }
.panel-heading > p:last-child[b-bcnno4z60u], .success-state > p[b-bcnno4z60u] { color: var(--color-dark-muted); line-height: 1.65; }

.registration-form[b-bcnno4z60u] { display: grid; gap: 1.35rem; }
.field-row[b-bcnno4z60u] { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; }
.field-group[b-bcnno4z60u] { display: grid; gap: .5rem; }
.field-group label[b-bcnno4z60u] { font-weight: 700; color: var(--color-dark); }
.field-group input[b-bcnno4z60u] { width: 100%; min-height: 50px; border: 1px solid #cbd5e1; border-radius: 12px; padding: .75rem .9rem; color: var(--color-dark); background: #fff; font: inherit; transition: border-color .2s ease, box-shadow .2s ease; }
.field-group input[b-bcnno4z60u]::placeholder { color: #64748b; }
.field-group input:focus[b-bcnno4z60u] { border-color: var(--color-primary); outline: none; box-shadow: 0 0 0 3px rgb(255 87 34 / 16%); }
.code-input[b-bcnno4z60u] { letter-spacing: .3em; font-size: 1.25rem !important; font-weight: 750 !important; text-align: center; }

.terms-field[b-bcnno4z60u] { display: grid; grid-template-columns: auto 1fr; gap: .7rem; align-items: start; color: var(--color-dark-muted); line-height: 1.5; }
.terms-field input[b-bcnno4z60u] { width: 1.15rem; height: 1.15rem; margin-top: .2rem; accent-color: var(--color-primary); }
.terms-field a[b-bcnno4z60u] { color: var(--color-primary-hover); text-decoration: underline; text-underline-offset: 2px; }

.primary-action[b-bcnno4z60u] { min-height: 52px; display: inline-flex; align-items: center; justify-content: center; border: 0; border-radius: 12px; padding: .85rem 1.4rem; background: linear-gradient(135deg, var(--color-primary), var(--color-primary-hover)); color: #fff; font: 750 1rem var(--font-sans); text-decoration: none; box-shadow: 0 10px 22px -10px rgb(230 74 25 / 75%); cursor: pointer; transition: transform .2s ease, box-shadow .2s ease; }
.primary-action:hover[b-bcnno4z60u] { color: #fff; transform: translateY(-2px); box-shadow: 0 14px 26px -10px rgb(230 74 25 / 80%); }
.primary-action:focus-visible[b-bcnno4z60u], .back-link:focus-visible[b-bcnno4z60u] { outline: 3px solid rgb(255 152 0 / 45%); outline-offset: 3px; }
.primary-action:disabled[b-bcnno4z60u] { cursor: wait; opacity: .72; transform: none; }
.button-loading[b-bcnno4z60u] { display: none; }
.registration-form.is-submitting .button-label[b-bcnno4z60u] { display: none; }
.registration-form.is-submitting .button-loading[b-bcnno4z60u] { display: inline; }

.validation-summary[b-bcnno4z60u] { border-radius: 12px; padding: .85rem 1rem; background: #fff1f2; color: #9f1239; }
.validation-summary:empty[b-bcnno4z60u] { display: none; }
[b-bcnno4z60u] .validation-message { color: #b42318; font-size: .9rem; font-weight: 600; }

.success-state[b-bcnno4z60u] { text-align: center; max-width: 34rem; margin: auto; }
.success-icon[b-bcnno4z60u] { width: 4.5rem; height: 4.5rem; display: grid; place-items: center; margin: 0 auto 1.5rem; border-radius: 50%; background: #dcfce7; color: #15803d; font-size: 2rem; font-weight: 800; }
.success-state .primary-action[b-bcnno4z60u] { margin-top: 1.25rem; }

.registration-footer[b-bcnno4z60u] { min-height: 82px; display: flex; align-items: center; justify-content: space-between; gap: 1rem; color: var(--color-dark-muted); font-size: .9rem; }
.registration-footer nav[b-bcnno4z60u] { display: flex; gap: 1.25rem; }
.registration-footer a[b-bcnno4z60u] { color: inherit; text-decoration: none; }
.registration-footer a:hover[b-bcnno4z60u] { color: var(--color-primary); }

@media (max-width: 900px) {
    .registration-main[b-bcnno4z60u] { grid-template-columns: 1fr; gap: 2.5rem; padding-block: 2rem 4rem; }
    .registration-intro[b-bcnno4z60u] { max-width: 46rem; }
    .benefits[b-bcnno4z60u] { grid-template-columns: repeat(3, 1fr); }
    .benefits li[b-bcnno4z60u] { align-items: flex-start; }
}

@media (max-width: 620px) {
    .registration-header[b-bcnno4z60u], .registration-footer[b-bcnno4z60u], .registration-main[b-bcnno4z60u] { width: min(100% - 2rem, 1180px); }
    .registration-header[b-bcnno4z60u] { min-height: 72px; }
    .brand-icon[b-bcnno4z60u] { width: 38px; height: 38px; }
    .brand-text[b-bcnno4z60u] { font-size: 1.25rem; }
    .back-link[b-bcnno4z60u] { font-size: .9rem; }
    .registration-intro h1[b-bcnno4z60u] { font-size: 2.5rem; }
    .benefits[b-bcnno4z60u] { grid-template-columns: 1fr; margin-top: 2rem; }
    .benefits li:not(.is-current):not(.is-done)[b-bcnno4z60u] { display: none; }
    .registration-panel[b-bcnno4z60u] { padding: 1.5rem; }
    .field-row[b-bcnno4z60u] { grid-template-columns: 1fr; }
    .registration-footer[b-bcnno4z60u] { padding-block: 1.5rem; flex-direction: column; align-items: flex-start; }
}

@media (prefers-reduced-motion: reduce) {
    .primary-action[b-bcnno4z60u], .field-group input[b-bcnno4z60u] { transition: none; }
}

[b-bcnno4z60u] .field-group input { width: 100%; min-height: 50px; border: 1px solid #cbd5e1; border-radius: 12px; padding: .75rem .9rem; color: var(--color-dark); background: #fff; font: inherit; transition: border-color .2s ease, box-shadow .2s ease; }
[b-bcnno4z60u] .field-group input::placeholder { color: #64748b; }
[b-bcnno4z60u] .field-group input:focus { border-color: var(--color-primary); outline: none; box-shadow: 0 0 0 3px rgb(255 87 34 / 16%); }
[b-bcnno4z60u] .code-input { letter-spacing: .3em; font-size: 1.25rem !important; font-weight: 750 !important; text-align: center; }
[b-bcnno4z60u] .terms-field input { width: 1.15rem; height: 1.15rem; margin-top: .2rem; accent-color: var(--color-primary); }
[b-bcnno4z60u] .registration-form > .primary-action { margin-top: .65rem; justify-self: start; }

.intro-kicker[b-bcnno4z60u],
.step-label[b-bcnno4z60u] {
    color: #c43d13;
}
/* /Pages/Home.razor.rz.scp.css */
.presentation-container[b-r7c02vtcad] { --font-sans: "Outfit", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif; --color-primary: #ff5722; --color-primary-hover: #e64a19; --color-primary-text: #c43d13; --color-primary-light: #fff3e0; --color-secondary: #ffb74d; --color-accent: #ff9800; --color-dark: #0f172a; --color-dark-muted: #475569; --color-light: #fafaf9; --color-white: #ffffff; --shadow-sm: 0 1px 2px 0 rgb(0 0 0 / 0.05); --shadow-md: 0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1); --shadow-lg: 0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1); --shadow-xl: 0 20px 25px -5px rgb(0 0 0 / 0.1), 0 8px 10px -6px rgb(0 0 0 / 0.1); --border-radius: 1rem; width: 100%; margin: 0 auto; position: relative; background-color: var(--color-light); color: var(--color-dark); font-family: var(--font-sans); line-height: 1.6;}
:where(.presentation-container, .presentation-container *)[b-r7c02vtcad] { box-sizing: border-box;}
:where(.presentation-container *)[b-r7c02vtcad] { margin: 0; padding: 0;}
:where(.presentation-container h1, .presentation-container h2, .presentation-container h3, .presentation-container h4, .presentation-container h5, .presentation-container h6)[b-r7c02vtcad] { color: var(--color-dark); font-weight: 700; line-height: 1.25;}
:where(.presentation-container a)[b-r7c02vtcad] { color: inherit; text-decoration: none; transition: all 0.2s ease;}
:where(.presentation-container button, .presentation-container input)[b-r7c02vtcad] { font-family: Arial, sans-serif; font-size: 13.3333px; font-weight: 400; line-height: normal;}
.mockup-product-title[b-r7c02vtcad] { font-size: 1rem; font-weight: 700; line-height: 1.25;}
.navbar[b-r7c02vtcad] { display: flex; justify-content: space-between; align-items: center; padding: 1rem 2rem; background: rgba(255, 255, 255, 0.85); backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px); position: sticky; top: 1rem; z-index: 100; border: 1px solid rgba(255, 87, 34, 0.1); border-radius: 9999px; max-width: 1200px; width: calc(100% - 4rem); margin: 1rem auto; box-shadow: var(--shadow-md);}
.brand[b-r7c02vtcad] { display: flex; align-items: center; gap: 0.75rem; color: var(--color-dark);}
.brand-text[b-r7c02vtcad] { font-weight: 800; font-size: 1.5rem; letter-spacing: -0.03em;}
.brand-text span[b-r7c02vtcad] { color: var(--color-primary);}
.version-badge[b-r7c02vtcad] { background: linear-gradient(135deg, var(--color-primary) 0%, var(--color-primary-hover) 100%); color: var(--color-white); font-size: 0.7rem; font-weight: 700; padding: 0.2rem 0.5rem; border-radius: 6px; letter-spacing: 0.05em; box-shadow: 0 2px 8px rgba(255, 87, 34, 0.25); margin-left: 0.25rem;}
.nav-links[b-r7c02vtcad] { display: flex; gap: 2rem; align-items: center; list-style: none;}
.nav-link[b-r7c02vtcad] { font-weight: 500; color: var(--color-dark-muted); font-size: 0.95rem; padding: 0.5rem 0; position: relative;}
.nav-link:hover[b-r7c02vtcad] { color: var(--color-primary);}
.nav-link[b-r7c02vtcad]::after { content: ''; position: absolute; bottom: 0; left: 0; width: 0; height: 2px; background-color: var(--color-primary); transition: width 0.3s ease;}
.nav-link:hover[b-r7c02vtcad]::after { width: 100%;}
.nav-actions[b-r7c02vtcad] { display: flex; align-items: center; gap: 1rem;}
.mobile-menu-toggle[b-r7c02vtcad], .mobile-menu[b-r7c02vtcad] { display: none;}
.btn[b-r7c02vtcad] { line-height: 1.6; display: inline-flex; align-items: center; justify-content: center; padding: 0.75rem 1.5rem; font-weight: 600; border-radius: 9999px; transition: all 0.25s cubic-bezier(0.4, 0, 0.2, 1); cursor: pointer; border: none; font-size: 0.95rem;}
.btn-secondary-outline[b-r7c02vtcad] { background: transparent; border: 2px solid rgba(15, 23, 42, 0.1); color: var(--color-dark);}
.btn-secondary-outline:hover[b-r7c02vtcad] { border-color: var(--color-primary); color: var(--color-primary); transform: translateY(-2px);}
.btn-primary[b-r7c02vtcad] { background: linear-gradient(135deg, var(--color-primary) 0%, var(--color-primary-hover) 100%); color: var(--color-white); box-shadow: 0 4px 14px rgba(255, 87, 34, 0.4);}
.btn-primary:hover[b-r7c02vtcad] { transform: translateY(-2px); box-shadow: 0 6px 20px rgba(255, 87, 34, 0.6);}
.btn-white[b-r7c02vtcad] { background: var(--color-white); color: var(--color-primary); box-shadow: 0 4px 14px rgba(0, 0, 0, 0.05);}
.btn-white:hover[b-r7c02vtcad] { transform: translateY(-2px); box-shadow: 0 6px 20px rgba(0, 0, 0, 0.1);}
.hero-section[b-r7c02vtcad] { position: relative; padding: 6rem 2rem 4rem 2rem; background: radial-gradient(circle at 85% 15%, rgba(255, 183, 77, 0.15) 0%, rgba(255, 87, 34, 0.05) 50%, rgba(250, 250, 249, 0) 100%); overflow: hidden;}
.hero-container[b-r7c02vtcad] { max-width: 1200px; margin: 0 auto; display: grid; grid-template-columns: 1.1fr 0.9fr; gap: 4rem; align-items: center;}
.badge[b-r7c02vtcad] { line-height: 1.6; white-space: normal; display: inline-flex; align-items: center; gap: 0.5rem; background-color: rgba(255, 87, 34, 0.08); color: var(--color-primary); padding: 0.5rem 1rem; border-radius: 9999px; font-size: 0.85rem; font-weight: 600; margin-bottom: 1.5rem; border: 1px solid rgba(255, 87, 34, 0.15);}
.hero-title[b-r7c02vtcad] { font-size: 3.5rem; font-weight: 800; letter-spacing: -0.03em; margin-bottom: 1.5rem;}
.hero-title span[b-r7c02vtcad] { background: linear-gradient(135deg, var(--color-primary) 0%, var(--color-primary-hover) 100%); -webkit-background-clip: text; -webkit-text-fill-color: transparent;}
.hero-desc[b-r7c02vtcad] { font-size: 1.2rem; color: var(--color-dark-muted); margin-bottom: 2.5rem; max-width: 580px; line-height: 1.6;}
.hero-actions[b-r7c02vtcad] { display: flex; gap: 1rem; flex-wrap: wrap;}
.hero-visual[b-r7c02vtcad] { position: relative; display: flex; justify-content: center;}
.visual-backdrop[b-r7c02vtcad] { position: absolute; width: 120%; height: 120%; background: radial-gradient(circle, rgba(255, 87, 34, 0.15) 0%, rgba(255, 183, 77, 0.05) 60%, transparent 100%); z-index: 1; top: -10%; left: -10%; filter: blur(40px);}
.mockup-card[b-r7c02vtcad] { background: var(--color-white); border-radius: 1.5rem; padding: 1.5rem; box-shadow: var(--shadow-xl); width: 100%; max-width: 440px; position: relative; z-index: 2; border: 1px solid rgba(0, 0, 0, 0.03); transition: transform 0.5s ease;}
.mockup-card:hover[b-r7c02vtcad] { transform: translateY(-5px) rotate(1deg);}
.mockup-header[b-r7c02vtcad] { display: flex; justify-content: space-between; align-items: center; border-bottom: 1px solid #f3f4f6; padding-bottom: 1rem; margin-bottom: 1rem;}
.mockup-club-info[b-r7c02vtcad] { display: flex; align-items: center; gap: 0.75rem;}
.mockup-logo-placeholder[b-r7c02vtcad] { width: 40px; height: 40px; background: linear-gradient(135deg, var(--color-primary) 0%, var(--color-secondary) 100%); border-radius: 50%; display: flex; align-items: center; justify-content: center; color: var(--color-white); font-weight: 700; font-size: 0.9rem;}
.mockup-title[b-r7c02vtcad] { font-weight: 700; font-size: 0.95rem;}
.mockup-tag[b-r7c02vtcad] { font-size: 0.75rem; background: #f1f5f9; padding: 0.25rem 0.5rem; border-radius: 4px; color: var(--color-dark-muted);}
.mockup-product[b-r7c02vtcad] { display: flex; flex-direction: column; gap: 0.75rem;}
.mockup-img[b-r7c02vtcad] { height: 200px; background: linear-gradient(135deg, #fef3c7 0%, #fff7ed 100%); border-radius: 1rem; display: flex; align-items: center; justify-content: center; position: relative; overflow: hidden;}
.mockup-options[b-r7c02vtcad] { display: flex; flex-direction: column; gap: 0.5rem; padding: 0.75rem 0; border-top: 1px solid #f1f5f9; border-bottom: 1px solid #f1f5f9; margin: 0.25rem 0;}
.mockup-option-item[b-r7c02vtcad] { display: flex; justify-content: space-between; align-items: center; font-size: 0.8rem;}
.mockup-option-label[b-r7c02vtcad] { color: var(--color-dark-muted); font-weight: 600;}
.mockup-option-choices[b-r7c02vtcad] { display: flex; gap: 0.4rem;}
.mockup-choice-size[b-r7c02vtcad] { font-size: 0.7rem; font-weight: 700; padding: 0.1rem 0.35rem; border-radius: 4px; border: 1px solid #cbd5e1; background: #f8fafc; color: var(--color-dark-muted);}
.mockup-choice-size.active[b-r7c02vtcad] { border-color: var(--color-primary); background: var(--color-primary); color: var(--color-white);}
.mockup-choice-color[b-r7c02vtcad] { width: 14px; height: 14px; border-radius: 50%; border: 1px solid #cbd5e1; display: inline-block; position: relative;}
.mockup-choice-color.active[b-r7c02vtcad]::after { content: '✓'; color: #ffffff; font-size: 8px; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); font-weight: bold;}
.mockup-option-input[b-r7c02vtcad] { width: 100px; padding: 0.2rem 0.4rem; border: 1px solid #cbd5e1; border-radius: 4px; font-size: 0.75rem; font-weight: 600; background: #f8fafc; color: var(--color-dark); text-align: center; outline: none;}
.mockup-badge-best[b-r7c02vtcad] { position: absolute; top: 10px; right: 10px; background: var(--color-primary); color: var(--color-white); font-size: 0.7rem; font-weight: 700; padding: 0.25rem 0.5rem; border-radius: 4px; text-transform: uppercase;}
.mockup-footer[b-r7c02vtcad] { display: flex; justify-content: space-between; align-items: center; margin-top: 0.5rem;}
.mockup-price[b-r7c02vtcad] { font-weight: 800; font-size: 1.25rem; color: var(--color-dark);}
.mockup-btn[b-r7c02vtcad] { background: var(--color-primary); color: var(--color-white); font-size: 0.8rem; font-weight: 600; padding: 0.5rem 1rem; border-radius: 6px;}
.stats-bar[b-r7c02vtcad] { background: var(--color-white); border-top: 1px solid rgba(0, 0, 0, 0.03); border-bottom: 1px solid rgba(0, 0, 0, 0.03); padding: 2.5rem 2rem;}
.stats-container[b-r7c02vtcad] { max-width: 1200px; margin: 0 auto; display: flex; justify-content: space-around; align-items: center; flex-wrap: wrap; gap: 2rem;}
.stat-item[b-r7c02vtcad] { text-align: center;}
.stat-val[b-r7c02vtcad] { font-size: 2.5rem; font-weight: 800; color: var(--color-primary); line-height: 1; margin-bottom: 0.25rem;}
.stat-lbl[b-r7c02vtcad] { font-size: 0.9rem; color: var(--color-dark-muted); font-weight: 500;}
.section[b-r7c02vtcad] { padding: 6rem 2rem;}
.section-alt[b-r7c02vtcad] { background-color: var(--color-white); padding: 6rem 2rem;}
.container-lg[b-r7c02vtcad] { max-width: 1200px; margin: 0 auto;}
.section-header[b-r7c02vtcad] { text-align: center; max-width: 850px; margin: 0 auto 4rem auto;}
.section-label[b-r7c02vtcad] { color: var(--color-primary); font-weight: 700; text-transform: uppercase; font-size: 0.85rem; letter-spacing: 0.05em; margin-bottom: 0.5rem; display: block;}
.section-title[b-r7c02vtcad] { font-size: 2.5rem; font-weight: 800; margin-bottom: 1rem; letter-spacing: -0.02em;}
.section-desc[b-r7c02vtcad] { color: var(--color-dark-muted); font-size: 1.1rem;}
.grid-3[b-r7c02vtcad] { display: grid; grid-template-columns: 1fr; gap: 2rem;}
@media (min-width: 640px) { .grid-3[b-r7c02vtcad] { grid-template-columns: repeat(2, 1fr);}
}
@media (min-width: 1024px) { .grid-3[b-r7c02vtcad] { grid-template-columns: repeat(4, 1fr);}
}
.card-feature[b-r7c02vtcad] { background: var(--color-white); border-radius: 1.25rem; padding: 2.5rem; box-shadow: var(--shadow-md); transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1); border: 1px solid rgba(0, 0, 0, 0.02); position: relative; overflow: hidden; display: flex; flex-direction: column; min-height: 320px;}
@media (min-width: 1024px) { .card-feature[b-r7c02vtcad] { min-height: 380px;}
}
.card-feature:hover[b-r7c02vtcad] { transform: translateY(-8px); box-shadow: var(--shadow-xl); border-color: rgba(255, 87, 34, 0.15);}
.card-feature[b-r7c02vtcad]::before { content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 4px; background: linear-gradient(90deg, var(--color-primary), var(--color-secondary)); opacity: 0; transition: opacity 0.3s ease;}
.card-feature:hover[b-r7c02vtcad]::before { opacity: 1;}
.feature-icon-wrapper[b-r7c02vtcad] { width: 60px; height: 60px; border-radius: 12px; background-color: var(--color-primary-light); color: var(--color-primary); display: flex; align-items: center; justify-content: center; font-size: 1.75rem; margin-bottom: 1.5rem;}
.feature-title[b-r7c02vtcad] { font-size: 1.35rem; font-weight: 700; margin-bottom: 1rem;}
.feature-text[b-r7c02vtcad] { color: var(--color-dark-muted); font-size: 0.95rem; line-height: 1.6;}
.tabs-section[b-r7c02vtcad] { background: linear-gradient(180deg, var(--color-light) 0%, rgba(255, 87, 34, 0.02) 100%); padding: 6rem 2rem;}
.tabs-container[b-r7c02vtcad] { display: flex; justify-content: center; gap: 1rem; margin-bottom: 3.5rem; flex-wrap: wrap;}
.tab-btn[b-r7c02vtcad] { background: var(--color-white); color: var(--color-dark-muted); border: 1px solid rgba(15, 23, 42, 0.08); padding: 0.85rem 2rem; font-weight: 600; border-radius: 9999px; cursor: pointer; transition: all 0.25s ease; box-shadow: var(--shadow-sm);}
.tab-btn:hover[b-r7c02vtcad] { color: var(--color-primary); border-color: var(--color-primary);}
.tab-btn.active[b-r7c02vtcad] { background: var(--color-primary); color: var(--color-white); border-color: var(--color-primary); box-shadow: 0 4px 14px rgba(255, 87, 34, 0.35);}
.tab-content[b-r7c02vtcad] { background: var(--color-white); border-radius: 1.5rem; padding: 3rem; box-shadow: var(--shadow-lg); max-width: 900px; margin: 0 auto; border: 1px solid rgba(0, 0, 0, 0.01);}
.tab-grid[b-r7c02vtcad] { display: grid; grid-template-columns: 1fr 1fr; gap: 3rem; align-items: center;}
.tab-info-header[b-r7c02vtcad] { margin-bottom: 1.5rem;}
.tab-tagline[b-r7c02vtcad] { font-size: 1.8rem; font-weight: 800; line-height: 1.25; margin-top: 0.5rem;}
.tab-benefit-list[b-r7c02vtcad] { list-style: none; display: flex; flex-direction: column; gap: 1rem;}
.tab-benefit-item[b-r7c02vtcad] { display: flex; gap: 0.75rem; align-items: flex-start; font-size: 0.95rem;}
.tab-benefit-icon[b-r7c02vtcad] { color: var(--color-primary); font-size: 1.2rem; margin-top: 0.1rem;}
.tab-visual-box[b-r7c02vtcad] { background: linear-gradient(135deg, var(--color-primary-light) 0%, rgba(255, 183, 77, 0.2) 100%); border-radius: 1rem; padding: 2.5rem; height: 100%; min-height: 250px; display: flex; flex-direction: column; justify-content: center; align-items: center; text-align: center; border: 1px dashed rgba(255, 87, 34, 0.25);}
.tab-visual-icon[b-r7c02vtcad] { font-size: 4rem; color: var(--color-primary); margin-bottom: 1rem;}
.tab-visual-title[b-r7c02vtcad] { font-weight: 800; font-size: 1.25rem; margin-bottom: 0.25rem;}
.tab-visual-sub[b-r7c02vtcad] { font-size: 0.85rem; color: var(--color-dark-muted);}
.showcase-row[b-r7c02vtcad] { display: grid; grid-template-columns: 1fr 1.1fr; gap: 5rem; align-items: center; margin-bottom: 6rem;}
.showcase-row:nth-child(even)[b-r7c02vtcad] { grid-template-columns: 1.1fr 1fr;}
.showcase-row:last-child[b-r7c02vtcad] { margin-bottom: 0;}
.showcase-visual[b-r7c02vtcad] { background: linear-gradient(135deg, var(--color-white) 0%, var(--color-light) 100%); border-radius: 1.5rem; padding: 2rem; box-shadow: var(--shadow-lg); border: 1px solid rgba(0, 0, 0, 0.02); display: flex; justify-content: center; align-items: center;}
.showcase-tag[b-r7c02vtcad] { color: var(--color-primary); font-weight: 700; font-size: 0.85rem; text-transform: uppercase; margin-bottom: 0.5rem; display: block;}
.showcase-title[b-r7c02vtcad] { font-size: 2rem; font-weight: 800; margin-bottom: 1.25rem; letter-spacing: -0.02em;}
.showcase-text[b-r7c02vtcad] { color: var(--color-dark-muted); margin-bottom: 1.5rem; line-height: 1.6;}
.showcase-list[b-r7c02vtcad] { list-style: none; display: flex; flex-direction: column; gap: 0.75rem;}
.showcase-list-item[b-r7c02vtcad] { display: flex; gap: 0.5rem; font-size: 0.95rem;}
.showcase-list-icon[b-r7c02vtcad] { color: var(--color-primary); margin-top: 0.2rem;}
.pricing-section[b-r7c02vtcad] { background: radial-gradient(circle at 15% 85%, rgba(255, 87, 34, 0.05) 0%, rgba(250, 250, 249, 0) 100%);}
.pricing-card[b-r7c02vtcad] { background: var(--color-white); border-radius: 2rem; padding: 4rem 3rem; max-width: 580px; margin: 0 auto; box-shadow: var(--shadow-xl); border: 2px solid rgba(255, 87, 34, 0.15); position: relative; overflow: hidden;}
.pricing-ribbon[b-r7c02vtcad] { position: absolute; top: 30px; right: -40px; background: var(--color-primary); color: var(--color-white); font-size: 0.75rem; font-weight: 700; padding: 0.5rem 3rem; transform: rotate(45deg); text-transform: uppercase; letter-spacing: 0.05em;}
.pricing-title[b-r7c02vtcad] { font-size: 1.75rem; font-weight: 800; text-align: center; margin-bottom: 0.5rem;}
.pricing-sub[b-r7c02vtcad] { color: var(--color-dark-muted); text-align: center; font-size: 0.95rem; margin-bottom: 2rem;}
.pricing-price-box[b-r7c02vtcad] { display: flex; justify-content: center; align-items: baseline; margin-bottom: 1.5rem;}
.price-currency[b-r7c02vtcad] { font-size: 2rem; font-weight: 800; color: var(--color-primary);}
.price-number[b-r7c02vtcad] { font-size: 6rem; font-weight: 900; color: var(--color-primary); line-height: 1; letter-spacing: -0.05em;}
.price-period[b-r7c02vtcad] { color: var(--color-dark-muted); font-size: 1rem; margin-left: 0.5rem;}
.pricing-features-title[b-r7c02vtcad] { font-weight: 700; font-size: 1rem; margin-bottom: 1rem; border-bottom: 1px solid #f3f4f6; padding-bottom: 0.5rem;}
.pricing-grid[b-r7c02vtcad] { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; margin-bottom: 2.5rem;}
.pricing-feature-item[b-r7c02vtcad] { display: flex; gap: 0.5rem; font-size: 0.9rem;}
.pricing-feature-icon[b-r7c02vtcad] { color: var(--color-primary); font-size: 1.1rem;}
.pricing-note[b-r7c02vtcad] { font-size: 0.85rem; color: var(--color-dark-muted); text-align: center; font-style: italic; margin-top: 1.5rem;}
.faq-container[b-r7c02vtcad] { max-width: 800px; margin: 0 auto; display: flex; flex-direction: column; gap: 1rem;}
.faq-item[b-r7c02vtcad] { background: var(--color-white); border-radius: 1rem; border: 1px solid rgba(0, 0, 0, 0.04); box-shadow: var(--shadow-sm); overflow: hidden; transition: all 0.25s ease;}
.faq-item:hover[b-r7c02vtcad] { border-color: rgba(255, 87, 34, 0.15);}
.faq-question[b-r7c02vtcad] { display: flex; justify-content: space-between; align-items: center; padding: 1.5rem; width: 100%; background: none; border: none; text-align: left; font-weight: 700; font-size: 1.05rem; color: var(--color-dark); cursor: pointer; list-style: none;}
.faq-question[b-r7c02vtcad]::-webkit-details-marker { display: none;}
.faq-answer[b-r7c02vtcad] { padding: 0 1.5rem 1.5rem 1.5rem; color: var(--color-dark-muted); font-size: 0.95rem; line-height: 1.6;}
.faq-icon[b-r7c02vtcad] { font-size: 1.25rem; transition: transform 0.2s ease; color: var(--color-primary);}
.faq-item.active .faq-icon[b-r7c02vtcad], .faq-item[open] .faq-icon[b-r7c02vtcad] { transform: rotate(180deg);}
.mobile-menu[hidden][b-r7c02vtcad], .tab-pane[hidden][b-r7c02vtcad], .preview-step-pane[hidden][b-r7c02vtcad] { display: none !important;}
.cta-footer[b-r7c02vtcad] { background: linear-gradient(135deg, var(--color-primary) 0%, var(--color-primary-hover) 100%); color: var(--color-white); padding: 6rem 2rem; text-align: center; position: relative; overflow: hidden;}
.cta-footer[b-r7c02vtcad]::before { content: ''; position: absolute; width: 300px; height: 300px; background: rgba(255, 255, 255, 0.1); border-radius: 50%; top: -150px; left: -150px;}
.cta-footer[b-r7c02vtcad]::after { content: ''; position: absolute; width: 400px; height: 400px; background: rgba(255, 255, 255, 0.05); border-radius: 50%; bottom: -200px; right: -200px;}
.cta-container[b-r7c02vtcad] { max-width: 700px; margin: 0 auto; position: relative; z-index: 2;}
.cta-title[b-r7c02vtcad] { color: var(--color-white); font-size: 2.5rem; font-weight: 800; margin-bottom: 1rem; letter-spacing: -0.02em;}
.cta-text[b-r7c02vtcad] { font-size: 1.15rem; margin-bottom: 2.5rem; opacity: 0.9;}
.footer[b-r7c02vtcad] { background: var(--color-dark); color: var(--color-white); padding: 4rem 2rem 2rem 2rem;}
.footer-container[b-r7c02vtcad] { max-width: 1200px; margin: 0 auto;}
.footer-top[b-r7c02vtcad] { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 3rem; margin-bottom: 3rem; border-bottom: 1px solid rgba(255, 255, 255, 0.1); padding-bottom: 3rem;}
.footer-brand[b-r7c02vtcad] { font-weight: 800; font-size: 1.35rem; margin-bottom: 1rem; color: var(--color-white);}
.footer-brand span[b-r7c02vtcad] { color: var(--color-secondary);}
.footer-brand-desc[b-r7c02vtcad] { font-size: 0.85rem; color: rgba(255, 255, 255, 0.6); line-height: 1.5;}
.footer-social-block[b-r7c02vtcad] { margin-top: 1.75rem;}
.footer-social-title[b-r7c02vtcad] { margin-bottom: 0.8rem; color: rgba(255, 255, 255, 0.78); font-size: 0.78rem; font-weight: 700; letter-spacing: 0.05em; text-transform: uppercase;}
.footer-social-links[b-r7c02vtcad] { display: flex; flex-wrap: wrap; gap: 0.65rem;}
.footer-social-link[b-r7c02vtcad] { display: inline-grid; place-items: center; width: 2.75rem; height: 2.75rem; flex: 0 0 2.75rem; overflow: hidden; border-radius: 0.875rem; color: #ffffff; box-shadow: 0 9px 20px -12px rgba(0, 0, 0, 0.9); transition: transform 0.22s cubic-bezier(0.22, 1, 0.36, 1), filter 0.22s ease, box-shadow 0.22s ease;}
.footer-social-link:hover[b-r7c02vtcad] { color: #ffffff; filter: saturate(1.12) brightness(1.06); transform: translateY(-3px); box-shadow: 0 14px 28px -15px rgba(0, 0, 0, 0.95);}
.footer-social-link:focus-visible[b-r7c02vtcad] { color: #ffffff; outline: 3px solid var(--color-secondary); outline-offset: 3px;}
.footer-social-link:active[b-r7c02vtcad] { transform: translateY(-1px);}
.footer-social-facebook[b-r7c02vtcad] { background: linear-gradient(145deg, #2d88ff 0%, #0866ff 58%, #0756d9 100%);}
.footer-social-instagram[b-r7c02vtcad] { background: radial-gradient(circle at 30% 105%, #ffd600 0 20%, #ff7a00 34%, #ff0169 58%, #d300c5 76%, #7638fa 100%);}
.footer-social-tiktok[b-r7c02vtcad] { background: linear-gradient(145deg, #18181b 0%, #000000 100%);}
.footer-social-youtube[b-r7c02vtcad] { background: linear-gradient(145deg, #ff3131 0%, #ff0000 58%, #d90000 100%);}
.footer-social-icon[b-r7c02vtcad] { width: 1.45rem; height: 1.45rem;}
.footer-social-icon-tiktok[b-r7c02vtcad] { width: 1.35rem; height: 1.35rem; overflow: visible;}
.footer-support-link[b-r7c02vtcad] { display: inline-flex; align-items: center; gap: 0.7rem; min-height: 2.75rem; margin-top: 0.9rem; padding: 0.35rem 0.75rem 0.35rem 0.4rem; border-radius: 0.875rem; background: rgba(255, 255, 255, 0.04); color: rgba(255, 255, 255, 0.78); font-size: 0.9rem; font-weight: 650; transition: color 0.22s ease, background-color 0.22s ease, transform 0.22s cubic-bezier(0.22, 1, 0.36, 1);}
.footer-support-link:hover[b-r7c02vtcad] { background: rgba(255, 255, 255, 0.08); color: var(--color-white); transform: translateX(2px);}
.footer-support-link:focus-visible[b-r7c02vtcad] { color: var(--color-white); outline: 3px solid var(--color-secondary); outline-offset: 3px;}
.footer-support-icon[b-r7c02vtcad] { display: inline-grid; place-items: center; width: 2rem; height: 2rem; flex: 0 0 2rem; border-radius: 0.625rem; background: rgba(255, 183, 77, 0.14); color: var(--color-secondary); transition: color 0.22s ease, background-color 0.22s ease;}
.footer-support-link:hover .footer-support-icon[b-r7c02vtcad] { background: var(--color-secondary); color: var(--color-dark);}
.footer-support-icon svg[b-r7c02vtcad] { width: 1.15rem; height: 1.15rem; fill: none; stroke: currentColor; stroke-linecap: round; stroke-linejoin: round; stroke-width: 1.9;}
@media (prefers-reduced-motion: reduce) { .footer-social-link[b-r7c02vtcad], .footer-support-link[b-r7c02vtcad], .footer-support-icon[b-r7c02vtcad] { transition: none;}
.footer-social-link:hover[b-r7c02vtcad], .footer-social-link:active[b-r7c02vtcad], .footer-support-link:hover[b-r7c02vtcad] { transform: none;}
}
.footer-title[b-r7c02vtcad] { font-size: 0.95rem; font-weight: 700; color: var(--color-white); margin-bottom: 1.25rem; text-transform: uppercase; letter-spacing: 0.05em;}
.footer-links[b-r7c02vtcad] { list-style: none; display: flex; flex-direction: column; gap: 0.75rem;}
.footer-link[b-r7c02vtcad] { font-size: 0.9rem; color: rgba(255, 255, 255, 0.7); transition: color 0.2s ease;}
.footer-link:hover[b-r7c02vtcad] { color: var(--color-secondary);}
.footer-bottom[b-r7c02vtcad] { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 1rem; font-size: 0.85rem; color: rgba(255, 255, 255, 0.5);}
.france-logo[b-r7c02vtcad] { display: inline-flex; align-items: center; gap: 0.5rem;}
@media (max-width: 991px) { .hero-container[b-r7c02vtcad] { grid-template-columns: 1fr; gap: 3rem; text-align: center;}
.hero-title[b-r7c02vtcad] { font-size: 2.75rem;}
.hero-desc[b-r7c02vtcad] { margin-left: auto; margin-right: auto;}
.hero-actions[b-r7c02vtcad] { justify-content: center;}
.tab-grid[b-r7c02vtcad] { grid-template-columns: 1fr; gap: 2.5rem;}
.tab-visual-box[b-r7c02vtcad] { min-height: 200px;}
.showcase-row[b-r7c02vtcad], .showcase-row:nth-child(even)[b-r7c02vtcad] { grid-template-columns: 1fr; gap: 2.5rem;}
.showcase-row:nth-child(even) .showcase-visual[b-r7c02vtcad] { order: -1;}
}
@media (max-width: 1100px) { .navbar[b-r7c02vtcad] { padding: 1rem 1.5rem; width: calc(100% - 2rem); margin: 0.5rem auto; top: 0.5rem; border-radius: 1.5rem; position: sticky;}
.navbar > nav:not(.mobile-menu)[b-r7c02vtcad], .nav-actions[b-r7c02vtcad] { display: none;}
.mobile-menu-toggle[b-r7c02vtcad] { width: 2.75rem; height: 2.75rem; flex: 0 0 2.75rem; display: inline-flex; align-items: center; justify-content: center; padding: 0; border: 1px solid rgba(255, 87, 34, 0.18); border-radius: 0.875rem; background: rgba(255, 255, 255, 0.94); color: var(--color-dark); box-shadow: 0 4px 14px rgba(15, 23, 42, 0.08); cursor: pointer; transition: color 0.2s ease, border-color 0.2s ease, background-color 0.2s ease, transform 0.2s ease;}
.mobile-menu-toggle:hover[b-r7c02vtcad], .mobile-menu-toggle:focus-visible[b-r7c02vtcad] { color: var(--color-primary); border-color: rgba(255, 87, 34, 0.45); background: var(--color-white); outline: none;}
.mobile-menu-toggle:active[b-r7c02vtcad] { transform: scale(0.96);}
.mobile-menu-toggle i[b-r7c02vtcad] { font-size: 1.35rem; line-height: 1;}
.mobile-menu[b-r7c02vtcad] { display: block; position: absolute; top: calc(100% + 0.5rem); right: 0; width: min(22rem, 100%); padding: 0.75rem; background: rgba(255, 255, 255, 0.98); border: 1px solid rgba(255, 87, 34, 0.14); border-radius: 1.25rem; box-shadow: 0 18px 45px rgba(15, 23, 42, 0.16); backdrop-filter: blur(16px); -webkit-backdrop-filter: blur(16px);}
.mobile-menu-links[b-r7c02vtcad] { display: grid; gap: 0.2rem; margin: 0; padding: 0; list-style: none;}
.mobile-menu-links a[b-r7c02vtcad] { display: flex; align-items: center; min-height: 2.75rem; padding: 0.65rem 0.9rem; border-radius: 0.75rem; color: var(--color-dark-muted); font-size: 0.95rem; font-weight: 600; transition: color 0.2s ease, background-color 0.2s ease;}
.mobile-menu-links a:hover[b-r7c02vtcad], .mobile-menu-links a:focus-visible[b-r7c02vtcad] { color: var(--color-primary); background: rgba(255, 87, 34, 0.07); outline: none;}
.mobile-menu-links .mobile-menu-primary[b-r7c02vtcad] { justify-content: center; margin-top: 0.15rem; color: var(--color-white); background: linear-gradient(135deg, var(--color-primary) 0%, var(--color-primary-hover) 100%); box-shadow: 0 4px 14px rgba(255, 87, 34, 0.28);}
.mobile-menu-links .mobile-menu-primary:hover[b-r7c02vtcad], .mobile-menu-links .mobile-menu-primary:focus-visible[b-r7c02vtcad] { color: var(--color-white); background: linear-gradient(135deg, var(--color-primary-hover) 0%, var(--color-primary) 100%);}
.mobile-menu-separator[b-r7c02vtcad] { height: 1px; margin: 0.4rem 0.75rem; background: rgba(15, 23, 42, 0.08);}
}
@media (max-width: 768px) { .pricing-grid[b-r7c02vtcad] { grid-template-columns: 1fr;}
.pricing-card[b-r7c02vtcad] { padding: 3rem 1.5rem;}
.footer-top[b-r7c02vtcad] { grid-template-columns: 1fr 1fr;}
}
@media (max-width: 480px) { .navbar[b-r7c02vtcad] { padding: 0.75rem 1rem;}
.brand[b-r7c02vtcad] { gap: 0.35rem; min-width: 0;}
.brand img[b-r7c02vtcad] { height: 2.35rem !important; margin-right: 0.25rem !important;}
.brand-text[b-r7c02vtcad] { font-size: 1.25rem;}
.version-badge[b-r7c02vtcad] { margin-left: 0.15rem; padding: 0.2rem 0.45rem; font-size: 0.65rem;}
.mobile-menu[b-r7c02vtcad] { right: 0; left: 0; width: auto;}
.footer-top[b-r7c02vtcad] { grid-template-columns: 1fr;}
}
.slider-section[b-r7c02vtcad] { background: linear-gradient(180deg, var(--color-white) 0%, var(--color-light) 100%); padding: 6rem 2rem;}
.slider-wrapper[b-r7c02vtcad] { max-width: 960px; margin: 0 auto; background: var(--color-white); border-radius: 2rem; padding: 4rem 3.5rem; box-shadow: var(--shadow-xl); border: 1px solid rgba(0, 0, 0, 0.02); position: relative;}
.slider-progress-bar[b-r7c02vtcad] { width: 100%; height: 6px; background: #e2e8f0; border-radius: 9999px; margin-bottom: 3.5rem; overflow: hidden;}
.slider-progress-fill[b-r7c02vtcad] { height: 100%; background: linear-gradient(90deg, var(--color-primary) 0%, var(--color-accent) 100%); transition: width 0.4s cubic-bezier(0.4, 0, 0.2, 1);}
.slide-container[b-r7c02vtcad] { display: grid; grid-template-columns: 1.1fr 0.9fr; gap: 3.5rem; align-items: center;}
.slide-info[b-r7c02vtcad] { text-align: left; display: flex; flex-direction: column;}
.slide-icon[b-r7c02vtcad] { font-size: 3.5rem; margin-bottom: 1rem; display: inline-block; filter: drop-shadow(0 4px 6px rgba(0, 0, 0, 0.08)); animation: bounceSlow-b-r7c02vtcad 3s infinite ease-in-out;}
.slide-title[b-r7c02vtcad] { font-size: 1.8rem; font-weight: 800; margin-bottom: 1.25rem; color: var(--color-dark); line-height: 1.2;}
.slide-desc[b-r7c02vtcad] { font-size: 1.05rem; color: var(--color-dark-muted); line-height: 1.6;}
.slide-visual-preview[b-r7c02vtcad] { background: #f8fafc; border-radius: 1.25rem; border: 1px solid #e2e8f0; padding: 2rem; min-height: 300px; display: flex; flex-direction: column; justify-content: center; box-shadow: inset 0 2px 8px rgba(0, 0, 0, 0.03); position: relative;}
.preview-form[b-r7c02vtcad] { display: flex; flex-direction: column; gap: 0.75rem; width: 100%;}
.preview-form-group[b-r7c02vtcad] { display: flex; flex-direction: column; gap: 0.25rem; text-align: left;}
.preview-label[b-r7c02vtcad] { font-size: 0.75rem; font-weight: 700; color: var(--color-dark-muted);}
.preview-input[b-r7c02vtcad] { padding: 0.5rem 0.75rem; font-size: 0.8rem; border: 1.5px solid #cbd5e1; border-radius: 6px; background: #ffffff;}
.preview-btn[b-r7c02vtcad] { background: var(--color-primary); color: #ffffff; font-size: 0.8rem; font-weight: 700; padding: 0.6rem; border-radius: 6px; text-align: center; border: none; cursor: default; margin-top: 0.25rem;}
.stripe-logo-box[b-r7c02vtcad] { display: flex; flex-direction: column; align-items: center; gap: 1rem;}
.stripe-preview-logo[b-r7c02vtcad] { display: inline-flex; align-items: center; justify-content: center; background: #635bff; padding: 0.75rem 1.5rem; border-radius: 8px; color: #ffffff; font-weight: 800; font-size: 1.4rem;}
.stripe-cards-row[b-r7c02vtcad] { display: flex; gap: 0.4rem; justify-content: center; flex-wrap: wrap;}
.preview-table[b-r7c02vtcad] { width: 100%; border-collapse: collapse; font-size: 0.75rem; text-align: left;}
.preview-table th[b-r7c02vtcad] { font-weight: 700; color: var(--color-dark-muted); border-bottom: 2px solid #e2e8f0; padding: 0.5rem;}
.preview-table td[b-r7c02vtcad] { padding: 0.5rem; border-bottom: 1px solid #f1f5f9; color: var(--color-dark);}
.preview-badge-status[b-r7c02vtcad] { background: #dcfce7; color: #15803d; padding: 0.15rem 0.4rem; border-radius: 4px; font-size: 0.65rem; font-weight: 700;}
.preview-badge-tag[b-r7c02vtcad] { background: #e0f2fe; color: #0369a1; padding: 0.15rem 0.4rem; border-radius: 4px; font-size: 0.65rem; font-weight: 700;}
.preview-cart-box[b-r7c02vtcad] { display: flex; flex-direction: column; gap: 0.75rem; text-align: left;}
.preview-cart-item[b-r7c02vtcad] { display: flex; justify-content: space-between; align-items: center; padding-bottom: 0.5rem; border-bottom: 1px solid #e2e8f0; font-size: 0.8rem;}
.preview-cart-total[b-r7c02vtcad] { display: flex; justify-content: space-between; font-weight: 800; font-size: 0.9rem; margin-top: 0.25rem;}
.config-preview-panel[b-r7c02vtcad] { display: flex; flex-direction: column; gap: 0.75rem; text-align: left;}
.config-color-row[b-r7c02vtcad] { display: flex; gap: 0.5rem; margin-top: 0.25rem;}
.config-color-dot[b-r7c02vtcad] { width: 24px; height: 24px; border-radius: 6px; border: 1.5px solid #cbd5e1;}
.slider-controls[b-r7c02vtcad] { display: flex; justify-content: space-between; align-items: center; margin-top: 3.5rem;}
.slider-btn[b-r7c02vtcad] { width: 48px; height: 48px; border-radius: 50%; background: var(--color-light); border: 1px solid rgba(0, 0, 0, 0.05); display: flex; align-items: center; justify-content: center; cursor: pointer; font-size: 1.2rem; color: var(--color-dark); transition: all 0.25s ease; box-shadow: var(--shadow-sm);}
.slider-btn:hover:not(:disabled)[b-r7c02vtcad] { background: var(--color-primary); color: var(--color-white); border-color: var(--color-primary); transform: scale(1.05);}
.slider-btn:disabled[b-r7c02vtcad] { opacity: 0.4; cursor: not-allowed;}
.slider-dots[b-r7c02vtcad] { display: flex; flex-wrap: wrap; gap: 0.125rem; justify-content: center; align-items: center;}
.slider-dot[b-r7c02vtcad] { width: 24px; height: 24px; border-radius: 50%; background: transparent; cursor: pointer; transition: all 0.25s ease; border: none; padding: 0; display: grid; place-items: center;}
.slider-dot[b-r7c02vtcad]::before { content: ""; width: 10px; height: 10px; border-radius: 50%; background: #cbd5e1;}
.slider-dot.active[b-r7c02vtcad] { width: 28px;}
.slider-dot.active[b-r7c02vtcad]::before { background: var(--color-primary); width: 28px; border-radius: 5px;}
.slider-step-indicator[b-r7c02vtcad] { font-size: 0.85rem; font-weight: 700; color: var(--color-primary); text-transform: uppercase; letter-spacing: 0.05em; margin-bottom: 0.5rem;}
@keyframes bounceSlow-b-r7c02vtcad { 0%, 100% { transform: translateY(0);}
50% { transform: translateY(-8px);}
}
@media (max-width: 768px) { .slider-wrapper[b-r7c02vtcad] { padding: 3rem 1.5rem;}
.slide-container[b-r7c02vtcad] { grid-template-columns: 1fr; gap: 2.5rem;}
.slide-info[b-r7c02vtcad] { text-align: center;}
.slide-icon[b-r7c02vtcad] { margin: 0 auto 1rem auto;}
}
.badge[b-r7c02vtcad], .section-label[b-r7c02vtcad], .showcase-tag[b-r7c02vtcad], .slider-step-indicator[b-r7c02vtcad] { color: var(--color-primary-text);}
.mockup-badge-best[b-r7c02vtcad], .mockup-btn[b-r7c02vtcad], .mockup-choice-size.active[b-r7c02vtcad], .tab-btn.active[b-r7c02vtcad], .preview-btn[b-r7c02vtcad], .pricing-ribbon[b-r7c02vtcad] { background: var(--color-primary-text);}
.slider-dot:focus-visible[b-r7c02vtcad] { outline: 2px solid var(--color-primary-text); outline-offset: 2px;}
.slider-btn[b-r7c02vtcad] { flex-shrink: 0;}
main > .section[b-r7c02vtcad], main > .section-alt[b-r7c02vtcad], main > .tabs-section[b-r7c02vtcad], main > .slider-section[b-r7c02vtcad], main > .cta-footer[b-r7c02vtcad] { content-visibility: auto; contain-intrinsic-size: auto 800px;}
@media (prefers-reduced-motion: reduce) { .slide-icon[b-r7c02vtcad] { animation: none;}
}
