/* ==========================================
   CABINET PUBLIC — public/css/cabinet/cabinet.css
   ========================================== */

@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800;900&display=swap');

/* ====== TOKENS ====== */
:root {
    --orange:   #FA6A2D;
    --orange-h: #e85e24;
    --blue:     #369AE3;
    --blue-2:   #0099DF;
    --teal:     #36A88F;
    --green:    #34A853;
    --yellow:   #F79E1B;
    --dark:     #1E1E1E;
    --slate:    #405362;
    --light:    #EFF2F4;
    --slate-10: rgba(64,83,98,.10);
    --slate-50: rgba(64,83,98,.50);
    --bg:       #f4f5fb;
}

/* ====== RESET ====== */
*, *::before, *::after { box-sizing: border-box; }
input, button, select, textarea { font-family: inherit; }

.cabinet-body {
    margin: 0;
    font-family: 'Inter', system-ui, -apple-system, sans-serif;
    background: var(--bg);
    color: var(--dark);
    min-width: 320px;
}

img { max-width: 100%; display: block; }
a   { color: inherit; text-decoration: none; }

.cab-container {
    width: 100%;
    max-width: 1160px;
    margin: 0 auto;
    padding: 0 20px;
}

/* ====== HEADER ====== */

.cab-header {
    position: fixed;
    top: 0; left: 0; right: 0;
    z-index: 100;
    background: #ffffff;
    border-bottom: 1px solid #e8eaf2;
    transition: transform .35s ease, box-shadow .3s ease;
}

.cab-header.is-header-hidden {
    transform: translateY(-100%);
}

.cab-header-inner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
    height: 64px;
}

.cab-logo img { height: 30px; }

.cab-nav {
    display: flex;
    gap: 28px;
    font-size: 14px;
    font-weight: 500;
}

.cab-nav a {
    color: var(--slate);
    transition: color .18s ease;
}

.cab-nav a:hover { color: var(--dark); }
.cab-nav a.is-active { color: var(--orange); font-weight: 600; }

.cab-header-right {
    display: flex;
    gap: 10px;
    align-items: center;
}

/* ====== BUTTONS ====== */

.cab-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    font-size: 14px;
    font-weight: 600;
    border-radius: 12px;
    padding: 10px 22px;
    cursor: pointer;
    border: none;
    text-decoration: none;
    transition: all .2s ease;
    white-space: nowrap;
}

.cab-btn--primary {
    background: var(--orange);
    color: #ffffff;
}

.cab-btn--primary:hover {
    background: var(--orange-h);
    transform: translateY(-1px);
}

.cab-btn--outline {
    background: #ffffff;
    color: var(--slate);
    border: 1.5px solid #e5e7eb;
}

.cab-btn--outline:hover {
    border-color: var(--blue);
    color: var(--blue);
}

.cab-btn--ghost {
    background: transparent;
    color: var(--blue);
    padding-inline: 0;
}

.cab-btn--ghost:hover { opacity: .8; }

.cab-btn--full { width: 100%; }

.cab-btn--lg {
    padding: 13px 28px;
    font-size: 15px;
    border-radius: 14px;
}

.cab-btn--sm {
    padding: 7px 16px;
    font-size: 13px;
}

/* ====== MAIN css/cabinet/cabinet.css ====== */

.cab-main { padding-top: 64px; }

/* ====== HERO (info page) ====== */

.cab-hero {
    background: linear-gradient(160deg, var(--slate) 0%, #2a3d4f 100%);
    color: #ffffff;
    padding: 80px 0 72px;
    text-align: center;
    position: relative;
    overflow: hidden;
}

.cab-hero::before {
    content: '';
    position: absolute;
    inset: 0;
    background:
        radial-gradient(ellipse 60% 50% at 20% 50%, rgba(54,154,227,0.18) 0%, transparent 70%),
        radial-gradient(ellipse 50% 60% at 80% 50%, rgba(250,106,45,0.12) 0%, transparent 70%);
    pointer-events: none;
}

.cab-hero__inner {
    position: relative;
    z-index: 1;
    max-width: 720px;
    margin: 0 auto;
}

.cab-hero__label {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 6px 16px;
    border-radius: 999px;
    background: rgba(255,255,255,0.1);
    border: 1px solid rgba(255,255,255,0.18);
    font-size: 13px;
    font-weight: 500;
    color: rgba(255,255,255,0.85);
    margin-bottom: 24px;
}

.cab-hero__label span {
    width: 6px; height: 6px;
    border-radius: 999px;
    background: var(--green);
    flex-shrink: 0;
}

.cab-hero__title {
    font-size: 48px;
    font-weight: 800;
    line-height: 1.1;
    letter-spacing: -.02em;
    margin: 0 0 16px;
}

.cab-hero__title em {
    font-style: normal;
    color: var(--orange);
}

.cab-hero__sub {
    font-size: 17px;
    color: rgba(255,255,255,0.72);
    line-height: 1.65;
    margin: 0 0 36px;
    max-width: 560px;
    margin-left: auto;
    margin-right: auto;
}

.cab-hero__actions {
    display: flex;
    gap: 12px;
    justify-content: center;
    flex-wrap: wrap;
}

.cab-hero__btn-white {
    background: #ffffff;
    color: var(--dark);
    padding: 13px 28px;
    border-radius: 14px;
    font-size: 15px;
    font-weight: 700;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    transition: all .2s ease;
}

.cab-hero__btn-white:hover {
    background: var(--light);
    transform: translateY(-1px);
}

.cab-hero__btn-ghost {
    background: rgba(255,255,255,0.1);
    border: 1.5px solid rgba(255,255,255,0.22);
    color: #ffffff;
    padding: 13px 28px;
    border-radius: 14px;
    font-size: 15px;
    font-weight: 600;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    transition: all .2s ease;
}

.cab-hero__btn-ghost:hover { background: rgba(255,255,255,0.18); }

/* ====== HOW IT WORKS ====== */

.cab-section {
    padding: 64px 0;
}

.cab-section--gray {
    background: #ffffff;
}

.cab-section__head {
    text-align: center;
    margin-bottom: 44px;
}

.cab-section__eyebrow {
    font-size: 12px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .08em;
    color: var(--blue);
    margin-bottom: 10px;
}

.cab-section__title {
    font-size: 32px;
    font-weight: 800;
    color: var(--dark);
    margin: 0 0 12px;
    line-height: 1.15;
}

.cab-section__sub {
    font-size: 15px;
    color: #6b7280;
    max-width: 520px;
    margin: 0 auto;
    line-height: 1.65;
}

/* Steps */
.cab-steps {
    display: grid;
    grid-template-columns: repeat(4, minmax(0,1fr));
    gap: 20px;
    position: relative;
}

.cab-steps::before {
    content: '';
    position: absolute;
    top: 36px;
    left: 10%;
    right: 10%;
    height: 1px;
    background: linear-gradient(to right, transparent, #e5e7eb 20%, #e5e7eb 80%, transparent);
    z-index: 0;
}

.cab-step {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    gap: 14px;
    position: relative;
    z-index: 1;
}

.cab-step__num {
    width: 52px; height: 52px;
    border-radius: 999px;
    background: var(--slate);
    color: #ffffff;
    font-size: 18px;
    font-weight: 800;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    box-shadow: 0 4px 16px rgba(64,83,98,0.25);
}

.cab-step__num--orange { background: var(--orange); box-shadow: 0 4px 16px rgba(250,106,45,0.3); }
.cab-step__num--blue   { background: var(--blue);   box-shadow: 0 4px 16px rgba(54,154,227,0.3); }
.cab-step__num--teal   { background: var(--teal);   box-shadow: 0 4px 16px rgba(54,168,143,0.3); }
.cab-step__num--green  { background: var(--green);  box-shadow: 0 4px 16px rgba(52,168,83,0.3); }

.cab-step__title {
    font-size: 15px;
    font-weight: 700;
    color: var(--dark);
}

.cab-step__text {
    font-size: 13px;
    color: #6b7280;
    line-height: 1.55;
}

/* Features grid */
.cab-features {
    display: grid;
    grid-template-columns: repeat(3, minmax(0,1fr));
    gap: 16px;
}

.cab-feature {
    background: var(--bg);
    border-radius: 20px;
    padding: 24px;
    border: 1px solid #eef1f8;
    transition: box-shadow .2s ease, transform .2s ease;
}

.cab-feature:hover {
    box-shadow: 0 8px 24px rgba(15,29,68,0.09);
    transform: translateY(-2px);
}

.cab-feature__icon {
    width: 48px; height: 48px;
    border-radius: 14px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 16px;
    font-size: 22px;
}

.cab-feature__icon--orange { background: rgba(250,106,45,0.1); }
.cab-feature__icon--blue   { background: rgba(54,154,227,0.1); }
.cab-feature__icon--teal   { background: rgba(54,168,143,0.1); }
.cab-feature__icon--green  { background: rgba(52,168,83,0.1); }
.cab-feature__icon--yellow { background: rgba(247,158,27,0.1); }
.cab-feature__icon--slate  { background: rgba(64,83,98,0.1); }

.cab-feature__title {
    font-size: 15px;
    font-weight: 700;
    color: var(--dark);
    margin-bottom: 8px;
}

.cab-feature__text {
    font-size: 13px;
    color: #6b7280;
    line-height: 1.6;
}

/* ====== TELEGRAM BOT NOTICE ====== */

.cab-tg-notice {
    background: linear-gradient(135deg, #1a2a3a 0%, #233040 100%);
    border-radius: 22px;
    padding: 32px 36px;
    display: flex;
    align-items: center;
    gap: 28px;
    color: #ffffff;
}

.cab-tg-notice__icon {
    width: 64px; height: 64px;
    border-radius: 18px;
    background: #29a9eb;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    font-size: 30px;
}

.cab-tg-notice__body h3 {
    font-size: 18px;
    font-weight: 700;
    margin: 0 0 6px;
}

.cab-tg-notice__body p {
    font-size: 14px;
    color: rgba(255,255,255,0.72);
    margin: 0;
    line-height: 1.55;
}

.cab-tg-notice__badge {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    margin-top: 10px;
    padding: 5px 12px;
    border-radius: 999px;
    background: rgba(255,255,255,0.1);
    border: 1px solid rgba(255,255,255,0.18);
    font-size: 12px;
    font-weight: 600;
    color: rgba(255,255,255,0.75);
}

/* ====== CTA BANNER ====== */

.cab-cta-banner {
    background: linear-gradient(135deg, var(--slate) 0%, #2a3d4f 100%);
    border-radius: 24px;
    padding: 48px;
    text-align: center;
    color: #ffffff;
    position: relative;
    overflow: hidden;
}

.cab-cta-banner::before {
    content: '';
    position: absolute;
    inset: 0;
    background: radial-gradient(ellipse 60% 70% at 70% 50%, rgba(250,106,45,0.15) 0%, transparent 70%);
    pointer-events: none;
}

.cab-cta-banner__inner { position: relative; z-index: 1; }

.cab-cta-banner h2 {
    font-size: 30px;
    font-weight: 800;
    margin: 0 0 10px;
}

.cab-cta-banner p {
    font-size: 15px;
    color: rgba(255,255,255,0.72);
    margin: 0 0 28px;
    max-width: 480px;
    margin-left: auto;
    margin-right: auto;
    line-height: 1.6;
}

.cab-cta-banner__free {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 6px 16px;
    border-radius: 999px;
    background: rgba(52,168,83,0.2);
    border: 1px solid rgba(52,168,83,0.4);
    color: #6ee7a0;
    font-size: 13px;
    font-weight: 600;
    margin-bottom: 20px;
}

/* ====== PRICE PAGE ====== */

.cab-price-hero {
    padding: 56px 0 48px;
    text-align: center;
}

.cab-price-hero h1 {
    font-size: 38px;
    font-weight: 800;
    color: var(--dark);
    margin: 0 0 12px;
}

.cab-price-hero p {
    font-size: 16px;
    color: #6b7280;
    max-width: 480px;
    margin: 0 auto;
    line-height: 1.65;
}

.cab-free-badge {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 8px 18px;
    border-radius: 999px;
    background: rgba(52,168,83,0.1);
    border: 1px solid rgba(52,168,83,0.3);
    color: var(--green);
    font-size: 14px;
    font-weight: 700;
    margin-bottom: 20px;
}

/* Plans grid */
.cab-plans {
    display: grid;
    grid-template-columns: repeat(2, minmax(0,1fr));
    gap: 24px;
    max-width: 860px;
    margin: 0 auto;
}

.cab-plan {
    background: #ffffff;
    border-radius: 22px;
    padding: 28px 26px;
    border: 1.5px solid #e8eaf2;
    display: flex;
    flex-direction: column;
    gap: 0;
    box-shadow: 0 6px 24px rgba(15,29,68,0.06);
    position: relative;
    transition: box-shadow .2s ease;
}

.cab-plan:hover { box-shadow: 0 12px 36px rgba(15,29,68,0.1); }

.cab-plan--featured {
    border-color: var(--blue);
    box-shadow: 0 8px 32px rgba(54,154,227,0.18);
}

.cab-plan__badge {
    position: absolute;
    top: -13px;
    left: 50%;
    transform: translateX(-50%);
    background: var(--blue);
    color: #ffffff;
    font-size: 12px;
    font-weight: 700;
    padding: 4px 16px;
    border-radius: 999px;
    white-space: nowrap;
}

.cab-plan__name {
    font-size: 13px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .06em;
    color: var(--slate-50);
    margin-bottom: 8px;
}

.cab-plan__price {
    display: flex;
    align-items: baseline;
    gap: 4px;
    margin-bottom: 4px;
}

.cab-plan__amount {
    font-size: 36px;
    font-weight: 800;
    color: var(--dark);
    line-height: 1;
}

.cab-plan__currency {
    font-size: 18px;
    font-weight: 700;
    color: var(--dark);
}

.cab-plan__period {
    font-size: 13px;
    color: #9ca3af;
}

.cab-plan__trial {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    font-size: 12px;
    font-weight: 600;
    color: var(--green);
    background: rgba(52,168,83,0.08);
    border: 1px solid rgba(52,168,83,0.2);
    padding: 4px 10px;
    border-radius: 999px;
    margin-bottom: 20px;
    margin-top: 8px;
}

.cab-plan__divider {
    height: 1px;
    background: #f1f5f9;
    margin: 16px 0;
}

.cab-plan__features {
    list-style: none;
    margin: 0 0 24px;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 11px;
    flex: 1;
}

.cab-plan__features li {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    font-size: 14px;
    color: var(--slate);
    line-height: 1.45;
}

.cab-plan__features li::before {
    content: '';
    width: 18px; height: 18px;
    border-radius: 999px;
    background: rgba(52,168,83,0.1);
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='10' viewBox='0 0 24 24' fill='none' stroke='%2334A853' stroke-width='3'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: center;
    flex-shrink: 0;
    margin-top: 1px;
}

/* Period selector (готово к подключению скидок) */
.cab-period-selector {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 4px;
    background: #ffffff;
    border: 1.5px solid #e8eaf2;
    border-radius: 14px;
    padding: 5px;
    margin: 0 auto 36px;
    width: fit-content;
}

.cab-period-btn {
    padding: 8px 20px;
    border-radius: 10px;
    border: none;
    background: transparent;
    font-size: 14px;
    font-weight: 500;
    color: var(--slate);
    cursor: pointer;
    transition: all .18s ease;
    position: relative;
}

.cab-period-btn.is-active {
    background: var(--slate);
    color: #ffffff;
    font-weight: 600;
}

.cab-period-btn .cab-period-discount {
    position: absolute;
    top: -8px;
    right: -4px;
    background: var(--green);
    color: #ffffff;
    font-size: 10px;
    font-weight: 700;
    padding: 2px 6px;
    border-radius: 999px;
    opacity: 0;
    transition: opacity .18s ease;
}

/* Показываем скидки когда будут доступны */
/* .cab-period-btn.has-discount .cab-period-discount { opacity: 1; } */

.cab-price-note {
    text-align: center;
    font-size: 13px;
    color: #9ca3af;
    margin-top: 24px;
}

/* FAQ */
.cab-faq {
    display: flex;
    flex-direction: column;
    gap: 10px;
    max-width: 720px;
    margin: 0 auto;
}

.cab-faq-item {
    background: #ffffff;
    border-radius: 16px;
    border: 1.5px solid #eef1f8;
    overflow: hidden;
}

.cab-faq-item__q {
    width: 100%;
    text-align: left;
    padding: 16px 20px;
    border: none;
    background: transparent;
    font-size: 15px;
    font-weight: 600;
    color: var(--dark);
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.cab-faq-item__q svg {
    flex-shrink: 0;
    transition: transform .22s ease;
    color: var(--slate-50);
}

.cab-faq-item.is-open .cab-faq-item__q svg { transform: rotate(180deg); }

.cab-faq-item__a {
    padding: 0 20px;
    max-height: 0;
    overflow: hidden;
    transition: max-height .3s ease, padding .3s ease;
    font-size: 14px;
    color: #6b7280;
    line-height: 1.65;
}

.cab-faq-item.is-open .cab-faq-item__a {
    max-height: 300px;
    padding: 0 20px 16px;
}

/* ====== CONTACTS PAGE ====== */

.cab-contact-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 24px;
    max-width: 860px;
    margin: 0 auto;
}

.cab-contact-card {
    background: #ffffff;
    border-radius: 20px;
    padding: 28px;
    border: 1.5px solid #eef1f8;
    box-shadow: 0 4px 16px rgba(15,29,68,0.05);
    gap: 14px;

    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

.cab-contact-card__icon {
    width: 52px; height: 52px;
    border-radius: 16px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 24px;
    flex-shrink: 0;
}

.cab-contact-card__title {
    font-size: 17px;
    font-weight: 700;
    color: var(--dark);
    margin: 0;
}

.cab-contact-card__text {
    font-size: 14px;
    color: #6b7280;
    line-height: 1.6;
    margin: 0 0 auto 0;
}

.cab-contact-card__link {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: 14px;
    font-weight: 600;
    color: var(--blue);
    transition: opacity .18s ease;
    margin: 8px 0 0 0;
}

.cab-contact-card__link:hover { opacity: .8; }

/* ====== AUTH ====== */

.cab-auth-wrap {
    min-height: calc(100vh - 64px);
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 40px 20px;
}

.cab-auth-card {
    width: 100%;
    max-width: 440px;
    background: #ffffff;
    border-radius: 22px;
    padding: 36px 32px;
    box-shadow: 0 16px 48px rgba(15,29,68,0.12);
    border: 1px solid #f1f5f9;
}

.cab-auth-card__logo {
    display: flex;
    justify-content: center;
    margin-bottom: 28px;
}

.cab-auth-card__logo img { height: 28px; }

.cab-auth-card h1 {
    font-size: 22px;
    font-weight: 800;
    color: var(--dark);
    text-align: center;
    margin: 0 0 6px;
}

.cab-auth-card__sub {
    font-size: 14px;
    color: #6b7280;
    text-align: center;
    margin: 0 0 24px;
    line-height: 1.5;
}

.cab-auth-errors {
    margin-bottom: 16px;
    padding: 10px 14px;
    border-radius: 12px;
    background: #fef2f2;
    color: #b91c1c;
    font-size: 13px;
    border-left: 3px solid #b91c1c;
}

.cab-field {
    display: flex;
    flex-direction: column;
    gap: 5px;
    margin-bottom: 14px;
}

.cab-field label {
    font-size: 12px;
    font-weight: 600;
    color: var(--slate-50);
    text-transform: uppercase;
    letter-spacing: .04em;
}

.cab-field input {
    width: 100%;
    height: 48px;
    border-radius: 14px;
    border: 1.5px solid #e5e7eb;
    padding: 0 14px;
    font-size: 15px;
    outline: none;
    background: #fafbff;
    color: var(--dark);
    transition: border-color .2s ease, box-shadow .2s ease;
}

.cab-field input:focus {
    border-color: var(--blue);
    box-shadow: 0 0 0 3px rgba(54,154,227,0.1);
    background: #ffffff;
}

.cab-field-hint {
    font-size: 12px;
    color: #9ca3af;
    line-height: 1.45;
}

.cab-auth-divider {
    display: flex;
    align-items: center;
    gap: 10px;
    margin: 20px 0;
    font-size: 12px;
    color: #9ca3af;
}

.cab-auth-divider::before,
.cab-auth-divider::after {
    content: '';
    flex: 1;
    height: 1px;
    background: #e5e7eb;
}

.cab-btn-google {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    padding: 12px 20px;
    border-radius: 14px;
    border: 1.5px solid #e5e7eb;
    background: #ffffff;
    font-size: 14px;
    font-weight: 600;
    color: var(--dark);
    cursor: pointer;
    transition: all .18s ease;
}

.cab-btn-google:hover { background: var(--bg); border-color: #d1d5db; }
.cab-btn-google img { width: 18px; height: 18px; }

.cab-auth-bottom {
    margin-top: 20px;
    text-align: center;
    font-size: 13px;
    color: #6b7280;
    display: flex;
    flex-wrap: wrap;
    gap: 4px;
    justify-content: center;
}

.cab-auth-bottom a { color: var(--blue); font-weight: 500; }

.cab-auth-submit {
    width: 100%;
    height: 50px;
    border: none;
    border-radius: 14px;
    background: var(--orange);
    color: #ffffff;
    font-size: 15px;
    font-weight: 700;
    cursor: pointer;
    transition: background .2s ease, transform .2s ease;
    margin-top: 4px;
}

.cab-auth-submit:hover {
    background: var(--orange-h);
    transform: translateY(-1px);
}

.cab-auth-submit:disabled { opacity: .65; cursor: default; transform: none; }

.cab-auth-legal {
    margin-top: 14px;
    text-align: center;
    font-size: 12px;
    color: #9ca3af;
    line-height: 1.5;
}

.cab-auth-legal a { color: var(--blue); }

/* ====== FOOTER ====== */

.cab-footer {
    background: var(--slate);
    color: rgba(255,255,255,0.8);
    padding: 48px 0 0;
    margin-top: 0;
}

.cab-footer-top {
    display: grid;
    grid-template-columns: 260px 1fr;
    gap: 48px;
    padding-bottom: 40px;
    border-bottom: 1px solid rgba(255,255,255,0.1);
}

.cab-footer-brand {
    display: flex;
    flex-direction: column;
    gap: 14px;
}

.cab-footer-logo img { height: 32px; }

.cab-footer-desc {
    font-size: 13px;
    color: rgba(255,255,255,0.55);
    line-height: 1.65;
    margin: 0;
}

.cab-footer-socials {
    display: flex;
    gap: 8px;
}

.cab-footer-social {
    width: 34px; height: 34px;
    border-radius: 10px;
    background: rgba(255,255,255,0.08);
    display: flex;
    align-items: center;
    justify-content: center;
    transition: background .18s ease;
}

.cab-footer-social:hover { background: rgba(255,255,255,0.16); }
.cab-footer-social img { width: 16px; height: 16px; }

.cab-footer-nav {
    display: grid;
    grid-template-columns: repeat(3, minmax(0,1fr));
    gap: 24px;
}

.cab-footer-col { display: flex; flex-direction: column; gap: 10px; }

.cab-footer-col__title {
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .07em;
    color: rgba(255,255,255,0.38);
    margin-bottom: 4px;
}

.cab-footer-col a {
    font-size: 13px;
    color: rgba(255,255,255,0.65);
    transition: color .18s ease;
}

.cab-footer-col a:hover { color: rgba(255,255,255,0.95); }

.cab-footer-bottom {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    flex-wrap: wrap;
    padding: 18px 0;
    font-size: 12px;
    color: rgba(255,255,255,0.35);
}

/* ====== BURGER ====== */

.cab-burger {
    display: none;
    flex-direction: column;
    justify-content: center;
    gap: 5px;
    width: 40px; height: 40px;
    border: 1.5px solid #e5e7eb;
    border-radius: 10px;
    background: var(--light);
    padding: 0;
    cursor: pointer;
    align-items: center;
}

.cab-burger span {
    display: block;
    height: 2px; width: 18px;
    background: var(--slate);
    border-radius: 1px;
    transition: transform .25s ease, opacity .25s ease;
}

.cab-burger.is-open span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
.cab-burger.is-open span:nth-child(2) { opacity: 0; }
.cab-burger.is-open span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }

.cab-mobile-menu {
    position: fixed;
    top: 64px; left: 0; right: 0;
    z-index: 99;
    background: #ffffff;
    border-bottom: 1px solid #e8eaf2;
    padding: 16px 20px 20px;
    display: flex;
    flex-direction: column;
    gap: 4px;
    box-shadow: 0 16px 40px rgba(15,29,68,0.12);
    transform: translateY(-110%);
    opacity: 0;
    transition: transform .3s ease, opacity .3s ease;
}

.cab-mobile-menu.is-open {
    transform: translateY(0);
    opacity: 1;
}

.cab-mobile-menu a {
    display: block;
    padding: 12px 14px;
    border-radius: 12px;
    font-size: 15px;
    font-weight: 500;
    color: var(--dark);
    transition: background .15s ease;
}

.cab-mobile-menu a:hover { background: var(--light); }

.cab-mobile-menu__divider {
    height: 1px;
    background: #f1f5f9;
    margin: 8px 0;
}

/* ====== RESPONSIVE ====== */

@media (max-width: 900px) {
    .cab-nav,
    .cab-header-right { display: none; }
    .cab-burger { display: flex; }

    .cab-hero__title { font-size: 34px; }
    .cab-hero__sub { font-size: 15px; }

    .cab-steps { grid-template-columns: repeat(2, minmax(0,1fr)); }
    .cab-steps::before { display: none; }

    .cab-features { grid-template-columns: repeat(2, minmax(0,1fr)); }

    .cab-plans { grid-template-columns: 1fr; max-width: 480px; }

    .cab-contact-grid { grid-template-columns: 1fr; max-width: 480px; }

    .cab-tg-notice { flex-direction: column; text-align: center; }

    .cab-footer-top { grid-template-columns: 1fr; gap: 28px; }
    .cab-footer-nav { grid-template-columns: repeat(2, minmax(0,1fr)); }
    .cab-footer-bottom { flex-direction: column; align-items: flex-start; gap: 6px; }

    .cab-section { padding: 44px 0; }
    .cab-cta-banner { padding: 32px 24px; }
}

@media (max-width: 600px) {
    .cab-hero { padding: 52px 0 48px; }
    .cab-hero__title { font-size: 28px; }

    .cab-section__title { font-size: 24px; }

    .cab-steps { grid-template-columns: 1fr; }
    .cab-features { grid-template-columns: 1fr; }

    .cab-footer-nav { grid-template-columns: 1fr; }

    .cab-auth-card { padding: 28px 20px; }

    .cab-price-hero h1 { font-size: 28px; }

    .cab-contact-grid { grid-template-columns: 1fr; }
}