/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */
html{line-height:1.15;-webkit-text-size-adjust:100%;}main{display:block;}hr{box-sizing:content-box;height:0;overflow:visible;}pre{font-family:monospace,monospace;font-size:1em;}a{background-color:transparent;}abbr[title]{border-bottom:none;text-decoration:underline;text-decoration:underline dotted;}b,strong{font-weight:bolder;}code,kbd,samp{font-family:monospace,monospace;font-size:1em;}small{font-size:80%;}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline;}sub{bottom:-.25em;}sup{top:-.5em;}img{border-style:none;}button,input,optgroup,select,textarea{font-family:inherit;font-size:100%;line-height:1.15;margin:0;}button,input{overflow:visible;}button,select{text-transform:none;}[type=button],[type=reset],[type=submit],button{-webkit-appearance:button;}[type=button]::-moz-focus-inner,[type=reset]::-moz-focus-inner,[type=submit]::-moz-focus-inner,button::-moz-focus-inner{border-style:none;padding:0;}[type=button]:-moz-focusring,[type=reset]:-moz-focusring,[type=submit]:-moz-focusring,button:-moz-focusring{outline:1px dotted ButtonText;}fieldset{padding:.35em .75em .625em;}legend{box-sizing:border-box;color:inherit;display:table;max-width:100%;padding:0;white-space:normal;}progress{vertical-align:baseline;}textarea{overflow:auto;}[type=checkbox],[type=radio]{box-sizing:border-box;padding:0;}[type=number]::-webkit-inner-spin-button,[type=number]::-webkit-outer-spin-button{height:auto;}[type=search]{-webkit-appearance:textfield;outline-offset:-2px;}[type=search]::-webkit-search-decoration{-webkit-appearance:none;}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit;}details{display:block;}summary{display:list-item;}template{display:none;}[hidden]{display:none;}

/* ===========================================
   CSS VARIABLES & THEME
   =========================================== */
*, *::before, *::after {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
}

:root {
    /* Primary Brand Colors */
    --primary: #79D7EF;           /* Cyan gradient start */
    --secondary: #b367ff;         /* Purple gradient end */
    --accent: #ff67c2;            /* Pink accent */
    
    /* Background Colors */
    --bg-primary: #030D2F;        /* Main dark background */
    --bg-secondary: #232041;      /* Secondary dark background */
    --bg-tertiary: #1a1833;       /* Tertiary dark background */
    --bg-card: #232041;           /* Card background */
    
    /* Text Colors */
    --text-primary: #ffffff;      /* Primary text (white) */
    --text-secondary: #b3b3c6;    /* Secondary text (light gray) */
    --text-tertiary: #e0e0e0;     /* Tertiary text */
    --text-muted: #b3b3c6;        /* Muted text */
    
    /* Gradients */
    --gradient: linear-gradient(90deg, var(--primary) 0%, var(--secondary) 100%);
    --gradient-hover: linear-gradient(90deg, #e04a96 21.13%, #a55eef 83.95%);
    
    /* Shadows */
    --shadow-primary: 0 4px 15px rgba(255, 103, 194, 0.3);
    --shadow-hover: 0 6px 20px rgba(255, 103, 194, 0.4);
    --shadow-card: 0 4px 32px 0 rgba(40, 30, 80, 0.18);
    --shadow-card-hover: 0 8px 40px 0 rgba(255, 103, 194, 0.10);
    
    /* Borders */
    --border-primary: 1px solid var(--text-primary);
    --border-accent: 2px solid var(--primary);
    
    /* Utility Colors */
    --white: #ffffff;
    --black: #000000;
    --transparent: transparent;

    /* Fluid layout variables (reduce breakpoint reliance) */
    --header-h: clamp(100px, 12vw, 140px);
    --hero-gap: clamp(12px, 3.5vw, 24px);
    --hero-pt: clamp(36px, 10vw, 64px);
    --hero-pb: clamp(28px, 8vw, 56px);
    --h1-size: clamp(1.3rem, 6.5vw, 2.8rem);
    --hero-logo-w: clamp(140px, 55vw, 480px);
    --hero-logo-h: calc(var(--hero-logo-w) * 0.3);
}

/* ===========================================
   BASE STYLES
   =========================================== */
body, html {
    min-height: 100vh;
    background: var(--bg-primary);
    color: var(--text-primary);
    font-family: 'Montserrat', -apple-system, BlinkMacSystemFont, 'Segoe UI', Arial, sans-serif;
    font-display: swap;
}

/* ===========================================
   UTILITY CLASSES
   =========================================== */
.gradient {
    background: var(--gradient);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    color: transparent;
    font-weight: 800;
    transition: background 0.3s;
}

/* ===========================================
   UNIFIED H2 STYLES (All breakpoints)
   =========================================== */
h2 {
    font-size: 1.6rem;
    font-weight: 800;
    color: var(--text-primary);
    margin-bottom: 24px;
    text-align: center;
    line-height: 1.2;
}

/* Responsive H2 sizes */
@media (min-width: 768px) {
    h2 {
        font-size: 1.8rem;
        margin-bottom: 28px;
    }
}

@media (min-width: 1024px) {
    h2 {
        font-size: 2.2rem;
        margin-bottom: 32px;
    }
}

@media (min-width: 1200px) {
    h2 {
        font-size: 2.4rem;
        margin-bottom: 36px;
    }
}

/* ===========================================
   UNIFIED H3 STYLES (All breakpoints)
   =========================================== */
h3 {
    font-size: 1.2rem;
    font-weight: 600;
    color: #fff;
    margin-bottom: 16px;
    line-height: 1.4;
    text-align: center;
}

/* Responsive H3 sizes */
@media (min-width: 768px) {
    h3 {
        font-size: 1.3rem;
        margin-bottom: 20px;
    }
}

@media (min-width: 1024px) {
    h3 {
        font-size: 1.4rem;
        margin-bottom: 24px;
    }
}

@media (min-width: 1200px) {
    h3 {
        font-size: 1.5rem;
        margin-bottom: 28px;
    }
}

/* ===========================================
   UNIFIED COMMON TEXT STYLES (All breakpoints)
   =========================================== */
.common-text {
    font-size: 1rem;
    color: var(--text-secondary);
    margin-bottom: 24px;
    text-align: center;
    line-height: 1.6;
}

/* Responsive Common Text sizes */
@media (min-width: 768px) {
    .common-text {
        font-size: 1.1rem;
        margin-bottom: 32px;
    }
}

@media (min-width: 1024px) {
    .common-text {
        font-size: 1.15rem;
        margin-bottom: 36px;
    }
}

@media (min-width: 1200px) {
    .common-text {
        font-size: 1.2rem;
        margin-bottom: 40px;
    }
}

/* ===========================================
   MOBILE FIRST STYLES (320px+)
   =========================================== */
.header {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 16px;
    gap: 16px;
    
    /* Фиксированная высота через переменную для предотвращения CLS */
    height: var(--header-h);
    min-height: var(--header-h);
    max-height: var(--header-h);
}

.mobal-block {
    display: flex;
    gap: 40px;
    align-items: center;
}

.header__logo {
    /* Фиксированные размеры для предотвращения CLS */
    width: 160px;
    height: 32px;
    object-fit: contain;
    display: block;
}

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

.header__link {
    color: var(--text-primary);
    text-decoration: none;
    font-weight: 500;
    font-size: 14px;
    transition: color 0.2s;
    position: relative;
}

.header__link:hover {
    color: var(--primary);
}

.header__actions {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
    justify-content: center;
}

/* Button Styles */
.btn {
    /* Размеры */
    min-width: 220px;
    max-width: 300px;
    padding: 10px 24px;
    border-radius: 6px;
    
    /* Типографика */
    font-size: 18px;
    font-weight: 600;
    text-align: center;
    white-space: nowrap;
    text-decoration: none;
    
    /* Визуальное оформление */
    background: var(--gradient);
    color: var(--text-primary);
    box-shadow: var(--shadow-primary);
    
    /* Интерактивность */
    cursor: pointer;
    transition: all 0.3s ease;
    
    /* Структура */
    border: none;
    display: inline-block;
}

.btn:hover {
    background: var(--gradient-hover);
    box-shadow: var(--shadow-hover);
    transform: translateY(-2px);
}

/* Log In Button with fixed font sizes for all breakpoints */
.btn--dark {
    background: transparent;
    color: var(--text-primary);
    border: 1px solid var(--text-secondary);
    box-shadow: none;
    transition: all 0.3s ease;
    
    /* Fixed dimensions to prevent CLS */
    width: 72px;
    height: 32px;
    min-width: 72px;
    min-height: 32px;
    
    /* Layout */
    display: inline-flex;
    align-items: center;
    justify-content: center;
    
    /* Typography - Fixed font size for mobile */
    
    font-weight: 500;
    text-decoration: none;
    white-space: nowrap;
    
    /* Border radius for modern look */
    border-radius: 6px;
    
    /* Ensure consistent box model */
    box-sizing: border-box;
    padding: 0;

    
}

.btn--dark:hover {
    background: transparent;
    border: 1px solid var(--primary);
    color: var(--primary);
    transform: none;
}

/* Fixed font sizes for all breakpoints */
@media (min-width: 410px) {
    .btn--dark {
    }
}

@media (min-width: 767px) {
    .btn--dark {
    }
}

@media (min-width: 1024px) {
    .btn--dark {
    }
}

@media (min-width: 1200px) {
    .btn--dark {
    }
}.experience__desc,


.experience__visual,
.interface__mockup {
    display: flex;
    align-items: center;
    justify-content: center;
}

.power-glow {
    width: 160px;
    height: 160px;
    border-radius: 50%;
    background: radial-gradient(ellipse at center, var(--secondary) 0%, var(--bg-secondary) 80%, transparent 100%);
    box-shadow: 0 0 60px 20px var(--secondary)44, 0 0 0 0 var(--primary);
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    animation: glowPulse 3s infinite alternate;
}

.power-glow--alt {
    background: radial-gradient(ellipse at center, var(--primary) 0%, var(--bg-secondary) 80%, transparent 100%);
    box-shadow: 0 0 60px 20px var(--primary)44, 0 0 0 0 var(--secondary);
}

@keyframes glowPulse {
    0% {
        box-shadow: 0 0 60px 20px var(--secondary)44, 0 0 0 0 var(--primary);
    }

    100% {
        box-shadow: 0 0 90px 35px var(--secondary)88, 0 0 0 0 var(--primary);
    }
}

.power-icon {
    width: 80px;
    height: 80px;
    z-index: 2;
}

.flags-svg {
    width: 100%;
    max-width: 320px;
    height: auto;
}

.interface-mockup-img {
    width: 640px;
    max-width: 100%;
    height: auto;
    aspect-ratio: 4/3;
    object-fit: contain;
    border-radius: 24px;
    box-shadow: 0 6px 36px 0 #b86cff66;
}


.interface__grid {
    gap: 32px;
}

.reviews {
    margin: 60px auto 0 auto;
    max-width: 900px;
    text-align: center;
    padding: 0 16px;
}



.reviews__grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 16px;
    max-width: 100%;
    margin: 0 auto;
}

.review-card {
    background: var(--bg-secondary);
    border-radius: 9px;
    padding: 16px 14px;
    color: var(--text-tertiary);
    
    box-shadow: 0 2px 16px 0 #b86cff11;
    text-align: left;
    min-height: 75px;
}

.review-card p {
    color: var(--text-secondary);
}

.review-card b {
    background: linear-gradient(90deg, var(--primary) 21.13%, var(--secondary) 83.95%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    text-fill-color: transparent;
    font-weight: 700;
    
    display: block;
    margin-bottom: 8px;
}

.platforms {
    margin: 60px auto 0 auto;

    /* max-width: 1200px; */
    text-align: center;
    padding: 0 16px;
}



.platforms__grid {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 8px;
    margin-top: 20px;
    width: 100%;
    justify-items: center;
}

.platform-card {
    background: linear-gradient(90deg, var(--bg-secondary) 0%, #1a1833 100%);
    border-radius: 9px;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 8px;
    padding: 12px 8px;
    box-shadow: 0 4px 32px 0 rgba(40, 30, 80, 0.18);
    position: relative;
    transition: box-shadow 0.2s, background 0.2s, transform 0.2s;
    text-align: center;
    max-width: 120px;
    width: 100%;
}

.platform-card:hover {
    box-shadow: 0 8px 40px 0 rgba(255, 103, 194, 0.10);
    background: linear-gradient(90deg, #2e2850 0%, var(--bg-secondary) 100%);
    transform: translateY(-2px) scale(1.02);
}

.platform-card__icon {
    width: 32px;
    height: 32px;
    color: white;
    transition: all 0.3s ease;
}

.platform-card__icon svg {
    width: 100%;
    height: 100%;
    fill: white !important;
    color: white !important;
}

.platform-card__icon svg * {
    fill: white !important;
    color: white !important;
}

.platform-card__icon svg.text-primary {
    fill: white !important;
    color: white !important;
}

.platform-card__icon svg.text-primary * {
    fill: white !important;
    color: white !important;
}

.platform-card:hover .platform-card__icon {
    opacity: 1;
    transform: scale(1.1);
}

.platform-card__name {
    font-size: 0.8rem;
    color: #fff;
}

.platform-card {
    text-decoration: none;
}

.platform-card__link {
    color: #fff;
    text-decoration: none;
    font-weight: 500;
    font-size: 14px;
    transition: color 0.2s;
    position: relative;
}

.platform-card:hover .platform-card__link {
    color: var(--primary) !important;
}

.privacy {
    margin: 60px auto 0 auto;
    max-width: 1200px;
    text-align: center;
    padding: 0 16px;
}



.privacy__grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 16px;
    margin-top: 32px;
}

.privacy__item {
    background: linear-gradient(90deg, var(--bg-secondary) 0%, #1a1833 100%);
    border-radius: 9px;
    display: flex;
    align-items: flex-start;
    gap: 12px;
    padding: 14px 16px;
    box-shadow: 0 4px 32px 0 rgba(40, 30, 80, 0.18);
    position: relative;
    transition: box-shadow 0.2s, background 0.2s, transform 0.2s;
    text-align: left;
    width: 100%;
    max-width: 280px;
}

.privacy__item:hover {
    box-shadow: 0 8px 40px 0 rgba(255, 103, 194, 0.10);
    background: linear-gradient(90deg, #2e2850 0%, var(--bg-secondary) 100%);
    transform: translateY(-2px) scale(1.02);
}

.privacy__icon {
    min-width: 36px;
    min-height: 36px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 20px;
    border-radius: 6px;
    background: rgba(255, 103, 194, 0.1);
    flex-shrink: 0;
}

.privacy__item-title {
    font-size: 1rem;
    font-weight: 700;
    color: #fff;
    margin-bottom: 4px;
}

.privacy__item-desc {
    font-size: 0.9rem;
    color: var(--text-secondary);
}

.trusted-users {
    margin: 60px auto 0 auto;
    max-width: 1200px;
    text-align: center;
    padding: 0 16px;
}


.trusted-users__subtitle {
    font-size: 1rem;
    color: var(--text-secondary);
    max-width: 800px;
    margin: 0 auto 40px auto;
    line-height: 1.6;
}

.trusted-users__stats {
    display: flex;
    flex-direction: column;
    gap: 16px;
    margin-top: 20px;
    align-items: center;
}

.trusted-users__stat {
    background: var(--bg-secondary);
    border-radius: 9px;
    padding: 14px 24px;
    color: #fff;
    font-size: 1rem;
    font-weight: 600;
    display: flex;
    align-items: center;
    gap: 10px;
    box-shadow: 0 2px 16px 0 #b86cff11;
    text-align: center;
}

.trusted-users__stat b {
    color: var(--primary);
    font-size: 1.1rem;
    font-weight: 800;
}

.awards {
    margin: 60px auto 0 auto;
    max-width: 1200px;
    text-align: center;
    padding: 0 16px;
}

.awards__grid {
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
    justify-content: center;
    align-items: center;
    margin-top: 20px;
}

.awards__item {
    background: var(--bg-secondary);
    border-radius: 9px;
    padding: 16px 20px;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 10px;
    min-width: 160px;
    max-width: 200px;
    box-shadow: 0 2px 16px 0 #b86cff11;
}

.awards__item img {
    width: 60px;
    height: auto;
    margin-bottom: 6px;
}

.awards__item span {
    color: var(--text-secondary);
    font-size: 0.85rem;
}

.prices {
    margin: 80px auto 0 auto;
    max-width: 1200px;
    text-align: center;
    padding: 0 16px;
    position: relative;
}

.prices::before {
    content: '';
    position: absolute;
    top: -20px;
    left: 50%;
    transform: translateX(-50%);
    width: 90%;
    height: calc(100% + 40px);
    background: linear-gradient(135deg, rgba(35, 32, 65, 0.3) 0%, rgba(26, 24, 51, 0.3) 100%);
    border-radius: 32px;
    z-index: -1;
    border: 1px solid rgba(255, 103, 194, 0.1);
}



.prices__grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 40px;
    max-width: 750px;
    margin: 0 auto;
    justify-items: center;
}

.prices__card {
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    min-height: 0;
    height: 100%;
    padding: 30px 24px 24px 24px;
}
.prices__card .connect-now-btn {
  margin-top: auto;
  margin-bottom: 0;
  align-self: center;
}

.prices__card:hover {
    transform: translateY(-4px);
    box-shadow: 0 12px 48px rgba(255, 103, 194, 0.15);
}

.prices__card--featured {
    border: 2px solid var(--primary);
    background: linear-gradient(135deg, var(--bg-secondary) 0%, #2a1f4a 100%);
}

.prices__card--featured:hover {
    box-shadow: 0 12px 48px rgba(255, 103, 194, 0.25);
}


.prices__card-header {
    margin-bottom: 18px;
}

.prices__card-title {
    font-size: 1.35rem;
    font-weight: 800;
    color: #fff;
    margin-bottom: 10.4px;

    /* 8px * 1.3 = 10.4px, increase by 30% */
}

.price .cents {
    font-size: 0.6em;
    vertical-align: super;
    line-height: 1.2;
    padding-top: 0.1em;
    display: inline-block;
}

.prices__card-price {
    margin-bottom: 8px;
    text-align: center;
}

.prices__card-price-old {
    text-decoration: line-through;
    opacity: 0.8;
    font-size: 0.85em;
    color: #fff;
    background: none !important;
    -webkit-text-fill-color: #fff !important;
}

.prices__card-price-new {
    font-size: 2.25rem;
    font-weight: 800;
    background: linear-gradient(90deg, var(--primary) 0%, var(--secondary) 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}

.prices__card-price-new sup {
    font-size: 0.6em;
    vertical-align: super;
    line-height: 1;
    position: static;
    top: auto;
}

.prices__card-desc {
    font-size: 1rem;
    color: var(--text-secondary);
    margin-bottom: 0;
    text-align: center;
    font-weight: 600;
}

.prices__card--featured .prices__card-desc {
    font-size: 1.2rem;
    color: #fff;
    font-weight: 700;
}

.prices__card--featured .prices__card-desc strong {
    background: linear-gradient(90deg, var(--primary) 0%, var(--secondary) 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    font-weight: 800;
    font-size: 1.2em;
}

.prices__card-features {
    list-style: none;
    padding: 0;
    margin: 0 0 24px 0;
    text-align: left;
}

.prices__card-features li {
    color: var(--text-tertiary);
    font-size: 0.825rem;
    margin-bottom: 12px;
    display: flex;
    align-items: center;
    gap: 8px;
    padding-left: 24px;
}

.prices__card-features li:last-child {
    margin-bottom: 0;
}

/* Connect Now buttons now use .connect-now-btn class */

.prices__disclaimer {
    font-size: 0.75rem;
    color: var(--text-secondary);
    text-align: center;
    margin-top: 20px;
    opacity: 0.8;
}

/* Payment Methods */
.payment-methods {
    margin: 80px auto 0 auto;
    max-width: 1200px;
    text-align: center;
    padding: 0 16px;
}



/* Common text styling for feature descriptions */

.payment-methods__grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 12px;

    /* max-width: 400px; */
    margin: 0 auto;
}

.payment-method {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 12px 8px;
    background: linear-gradient(135deg, var(--bg-secondary) 0%, #1a1833 100%);
    border-radius: 12px;
    border: 1px solid rgba(179, 103, 255, 0.2);
    transition: all 0.3s ease;
    text-decoration: none;
    color: inherit;
}

.payment-method:hover {
    transform: translateY(-4px);
    border-color: rgba(255, 103, 194, 0.4);
    box-shadow: 0 8px 32px rgba(179, 103, 255, 0.2);
}

.payment-method__icon {
    width: 40px;
    height: 25px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.payment-method__icon img {
    max-width: 32px !important;
    max-height: 32px !important;
    object-fit: contain;
    filter: brightness(0.9);
    transition: filter 0.3s ease;
}

.payment-method:hover .payment-method__icon img {
    filter: brightness(1.1);
}

.payment-method__label {
    font-size: 14px;
    font-weight: 600;
    color: #fff;
    text-align: center;
}

.upgrade {
    margin: 60px auto 0 auto;
    max-width: 1200px;
    text-align: center;
    padding: 0 16px;
}

.upgrade__grid {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 24px;
}

.upgrade__icon {
    display: flex;
    justify-content: center;
    align-items: center;
    min-height: 100px;
}

.upgrade__icon img {
    width: 80px;
    height: 80px;
    border-radius: 24px;
    box-shadow: 0 6px 36px 0 #b86cff22;
    display: block;
    object-fit: contain;
}

.upgrade__desc {
    max-width: 100%;
    text-align: center;
}

.upgrade__desc h2 {
    font-size: 1.6rem;
    font-weight: 800;
    color: #fff;
    margin-bottom: 12px;
}

.upgrade__desc p {
    font-size: 1rem;
    color: var(--text-secondary);
    margin-bottom: 20px;
}

.header {
    flex-direction: row;
    justify-content: space-between;
    padding: 24px 32px 0 32px;
    
    /* Фиксированная высота для планшетов */
    height: 100px;
    min-height: 100px;
    max-height: 100px;
}

    .header__logo {
        /* Фиксированные размеры для планшетов */
        width: 180px;
        height: 36px;
        object-fit: contain;
    }

.header__nav {
    gap: 20px;
    flex-wrap: nowrap;
}

.header__link {
    font-size: 15px;
}

    .header__actions {
        gap: 10px;
        flex-wrap: nowrap;
    }
    
    /* Sign In Button responsive - tablet */
    .btn--dark {
        width: 74px;
        height: 32px;
        min-width: 74px;
        min-height: 32px;
    }

.btn {
    padding: 8px 18px;
    font-size: 18px;
    white-space: nowrap;
}

.hero {
    aspect-ratio: 16/7;
    min-height: 40vh;
    gap: var(--hero-gap);
    padding: var(--hero-pt) 32px var(--hero-pb) 32px;
    margin-top: var(--header-h);
    width: 100%;
    max-width: 100vw;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
}

    .hero__subtitle {
        font-size: clamp(13px, 2.2vw, 20px);
        color: var(--text-tertiary);
        margin-bottom: 20px;
        line-height: 1.5;
        max-width: 80vw;
    }

.footer {
    padding: 64px 0 24px 0;
    background: var(--bg-primary) !important;
    color: #fff;
}


.features__desc p {
    font-size: 1rem;
    color: var(--text-secondary);
}

.features__grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 16px;
    margin-top: 32px;
    justify-items: center;
    max-width: 800px;
    margin-left: auto;
    margin-right: auto;
}

.footer__main {
    display: flex;
    flex-direction: column;
    gap: 32px;
    justify-content: center;
    align-items: center;
    max-width: 1400px;
    margin: 0 auto 24px auto;
    padding: 0 16px;
}

/* Footer styles updated to remove subscribe section */

.footer__links,
.footer__menu {
    display: flex;
    flex-direction: column;
    gap: 6px;
    min-width: 160px;
    text-align: center;
    margin-left: 40px;
}

.footer__links a,
.footer__menu a {
    color: #fff;
    text-decoration: none;
    opacity: 0.7;
    transition: opacity 0.2s;
    font-size: 0.9rem;
}

.footer__links a:hover,
.footer__menu a:hover {
    opacity: 1;
}

.footer__legal-links {
    display: flex;
    gap: 16px;
    align-items: center;
    justify-content: center;
    max-width: 1400px;
    margin: 0 auto 20px auto;
    padding: 0 16px;
}

.footer__legal-links a {
    color: var(--text-secondary);
    text-decoration: none;
    font-size: 0.85rem;
    transition: color 0.2s;
}

.footer__legal-links a:hover {
    color: var(--primary);
}

.footer__bottom {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 20px;
    border-top: 1px solid var(--bg-secondary);
    font-size: 0.8rem;
    color: var(--text-secondary);
    gap: 12px;
    max-width: 1400px;
    margin: 0 auto;
    text-align: center;
    padding-left: 16px;
    padding-right: 16px;
}

.footer__socials {
    display: flex;
    gap: 12px;
}

.footer__socials img {
    width: 24px;
    height: 24px;
    opacity: 0.7;
    transition: opacity 0.2s, transform 0.2s;
}

.footer__socials img:hover {
    opacity: 1;
    transform: scale(1.08);
}

.header__lang-dropdown {
    position: relative;
    display: inline-block;
}

.header__lang-btn {
    background: none;
    border: none;
    color: #fff;
    font-size: 16px;
    font-weight: 500;
    cursor: pointer;
    display: flex;
    align-items: center;
    gap: 4px;
    padding: 0 6px;
    transition: color 0.2s;
}

.header__lang-btn svg {
    transition: transform 0.2s;
}

.header__lang-dropdown:hover .header__lang-btn svg,
.header__lang-btn[aria-expanded="true"] svg {
    transform: rotate(180deg);
}

.header__lang-list {
    display: none;
    position: absolute;
    top: 120%;
    left: 0;
    min-width: 140px;
    background: var(--bg-secondary);
    border-radius: 6px;
    box-shadow: 0 4px 24px 0 #18162a44;
    z-index: 100;
    padding: 6px 0;
    margin: 0;
    list-style: none;
    transition: opacity 0.2s, visibility 0.2s;
    opacity: 0;
    visibility: hidden;
}

.header__lang-dropdown:hover .header__lang-list,
.header__lang-btn[aria-expanded="true"]+.header__lang-list {
    display: block;
    opacity: 1;
    visibility: visible;
}

.header__lang-list li {
    width: 100%;
}

.header__lang-list a {
    display: block;
    padding: 8px 16px;
    color: #fff;
    text-decoration: none;
    font-size: 0.9rem;
    opacity: 0.8;
    transition: background 0.2s, opacity 0.2s;
}

.header__lang-list a:hover {
    background: #18162a;
    opacity: 1;
}

.header__link--active {
    color: var(--primary) !important;
    font-weight: 600;
}

.support-categories {
    padding: 40px 16px;
    background: var(--bg-primary);
    text-align: center;
}


.support-categories__grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 16px;
    max-width: 1200px;
    margin: 0 auto;
}

.support-category {
    background: var(--bg-secondary);
    padding: 28px 21px;
    border-radius: 12px;
    text-align: center;
    transition: transform 0.3s, box-shadow 0.3s;
    display: flex;
    flex-direction: column;
    min-height: 200px;
}

.support-category:hover {
    transform: translateY(-3px);
    box-shadow: 0 15px 30px rgba(255, 103, 194, 0.08);
}

.support-category__icon {
    font-size: 2.1rem;
    display: block;
    margin-bottom: 14px;
}


.support-category__desc {
    color: #b0b0b0;
    margin-bottom: auto;
    line-height: 1.5;
    font-size: 0.75rem;
    flex-grow: 1;
}

.support-category__link {
    color: var(--primary);
    text-decoration: none;
    font-weight: 500;
    transition: color 0.3s;
    font-size: 0.75rem;
    margin-top: 12px;
    align-self: center;
}

.support-category__link:hover {
    color: var(--secondary);
}

/* FAQ Section */
.faq {
    padding: 40px 16px;
    background: var(--bg-primary);
}


.faq__grid {
    max-width: 800px;
    margin: 0 auto;
}

.faq__item {
    background: var(--bg-secondary);
    border-radius: 10px;
    margin-bottom: 12px;
    overflow: hidden;
    transition: box-shadow 0.3s;
}

.faq__item:hover {
    box-shadow: 0 8px 25px rgba(255, 103, 194, 0.08);
}

.faq__question {
    padding: 16px 16px;
    cursor: pointer;
    display: flex;
    justify-content: space-between;
    align-items: center;
    background: var(--bg-secondary);
    transition: background 0.3s;
}

.faq__question:hover {
    background: #2a2658;
}

.faq__question h3 {
    margin: 0;
    padding-right: 12px;
    text-align: left;
}

.faq__toggle {
    font-size: 1.2rem;
    color: var(--primary);
    font-weight: 300;
    transition: transform 0.3s;
    flex-shrink: 0;
}

.faq__item.active .faq__toggle {
    transform: rotate(45deg);
}

.faq__answer {
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.3s ease;
}

.faq__answer p {
    padding: 0 16px 16px;
    color: #b0b0b0;
    line-height: 1.6;
    margin: 0;
    font-size: 0.8rem;
}

/* Contact Support Section */
.contact-support {
    padding: 40px 16px;
    background: var(--bg-primary);
}

.contact-support__grid {
    max-width: 1200px;
    margin: 0 auto;
    display: grid;
    grid-template-columns: 1fr;
    gap: 32px;
}


.contact-support__info p {
    color: #b0b0b0;
    line-height: 1.6;
    margin-bottom: 24px;
    font-size: 0.85rem;
}

.contact-methods {
    display: flex;
    flex-direction: column;
    gap: 20px;
}

.contact-method {
    display: flex;
    align-items: flex-start;
    gap: 12px;
}

.contact-method__icon {
    font-size: 1.5rem;
    flex-shrink: 0;
}

.contact-method h4 {
    font-size: 1rem;
    font-weight: 600;
    color: #fff;
    margin-bottom: 5px;
}

.contact-method p {
    color: #b0b0b0;
    margin-bottom: 6px;
    font-size: 0.8rem;
}

.contact-method__link {
    color: var(--primary);
    text-decoration: none;
    font-weight: 500;
    transition: color 0.3s;
    font-size: 0.8rem;
}

.contact-method__link:hover {
    color: var(--secondary);
}

.social-links {
    display: flex;
    gap: 10px;
}

.social-link {
    color: var(--primary);
    text-decoration: none;
    font-weight: 500;
    transition: color 0.3s;
    font-size: 0.8rem;
}

.social-link:hover {
    color: var(--secondary);
}

/* Contact Form */
.contact-form {
    background: var(--bg-secondary);
    padding: 24px 16px;
    border-radius: 12px;
}


.support-form {
    display: flex;
    flex-direction: column;
    gap: 14px;
}

.support-form input,
.support-form select,
.support-form textarea {
    padding: 10px 14px;
    background: #18162a;
    border: 1px solid #333;
    border-radius: 6px;
    color: #fff;
    font-size: 0.85rem;
    transition: border-color 0.3s;
    width: 100%;
}

.support-form input:focus,
.support-form select:focus,
.support-form textarea:focus {
    outline: none;
    border-color: var(--primary);
}

.support-form select option {
    background: #18162a;
    color: #fff;
}

.support-form textarea {
    resize: vertical;
    min-height: 80px;
}

.support-form .btn {
    margin-top: 6px;
    padding: 10px 20px;
    font-size: 18px;
}

/* Quick Links */
.quick-links {
    padding: 40px 16px;
    background: var(--bg-primary);
}


.quick-links__grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 12px;
    max-width: 800px;
    margin: 0 auto;
}

.quick-link {
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 16px 16px;
    background: var(--bg-secondary);
    border-radius: 10px;
    text-decoration: none;
    transition: transform 0.3s, box-shadow 0.3s;
}

.quick-link:hover {
    transform: translateY(-2px);
    box-shadow: 0 12px 25px rgba(255, 103, 194, 0.08);
}

.quick-link__icon {
    font-size: 1.5rem;
    flex-shrink: 0;
}

.quick-link h4 {
    font-size: 1rem;
    font-weight: 600;
    color: #fff;
    margin-bottom: 3px;
}

.quick-link p {
    color: #b0b0b0;
    margin: 0;
    font-size: 0.8rem;
}

/* !!!!!!!!!!!!!!!!!! */
@media (min-width: 768px) {
    .comparison {
        margin: 70px auto 0 auto;
        padding: 0 32px;
    }


    .comparison__table {
        font-size: 0.9rem;
    }

    .comparison__table-wrapper {
        max-width: 100%;
    }

    .comparison__table th,
    .comparison__table td {
        padding: 14px 10px;
    }

    .comparison__table th {
        font-size: 0.9rem;
        padding: 18px 10px;
    }

    .comparison__feature-header {
        font-size: 1rem;
        padding: 18px 10px;
    }

    .comparison__feature {
        padding: 14px 10px;
    }

    .comparison__feature strong {
        font-size: 0.9rem;
    }

    .comparison__feature-desc {
        font-size: 0.7rem;
    }

    .comparison__check {
        font-size: 0.85rem;
        padding: 14px 8px;
    }

    .footer {
        padding: 56px 0 22px 0;
    }

    .footer__main {
        flex-direction: row;
        flex-wrap: wrap;
        gap: 36px;
        align-items: flex-start;
        padding: 0 32px;
    }

    /* Footer form styles removed */

    .footer__links,
    .footer__menu {
        gap: 8px;
        text-align: left;
        margin-left: 60px;
    }

    .footer__links a,
    .footer__menu a {
        font-size: 0.95rem;
    }

    .footer__legal-links {
        flex-direction: row;
        gap: 20px;
        margin-bottom: 22px;
        padding: 0 32px;
    }

    .footer__legal-links a {
        font-size: 0.9rem;
    }

    .footer__bottom {
        flex-direction: row;
        justify-content: space-between;
        padding: 22px 32px;
        font-size: 0.85rem;
        gap: 14px;
    }

    .footer__socials {
        gap: 14px;
    }

    .footer__socials img {
        width: 26px;
        height: 26px;
    }

    .support-categories {
        padding: 80px 32px;
    }


    .support-categories__grid {
        grid-template-columns: repeat(2, 1fr);
        gap: 30px;
    }

    .support-category {
        padding: 40px 30px;
        min-height: 280px;
    }

    .support-category__icon {
        font-size: 3rem;
        margin-bottom: 20px;
    }


    .support-category__desc {
        font-size: 1rem;
    }

    .support-category__link {
        font-size: 1rem;
        margin-top: 20px;
    }

    .faq {
        padding: 40px 32px;
    }


    .faq__item {
        margin-bottom: 20px;
    }

    .faq__question {
        padding: 25px 30px;
    }

    .faq__question h3 {
        padding-right: 20px;
        text-align: left;
    }

    .faq__toggle {
        font-size: 1.5rem;
    }

    .faq__answer p {
        padding: 0 30px 25px;
        font-size: 1rem;
    }

    .contact-support {
        padding: 80px 32px;
    }

    .contact-support__grid {
        grid-template-columns: 1fr 1fr;
        gap: 60px;
        align-items: start;
    }


    .contact-support__info p {
        font-size: 1rem;
        margin-bottom: 40px;
    }

    .contact-methods {
        gap: 35px;
    }

    .contact-method {
        gap: 20px;
    }

    .contact-method__icon {
        font-size: 2rem;
    }

    .contact-method h4 {
        font-size: 1.3rem;
        margin-bottom: 8px;
    }

    .contact-method p {
        font-size: 1rem;
        margin-bottom: 10px;
    }

    .contact-method__link {
        font-size: 1rem;
    }

    .social-link {
        font-size: 1rem;
    }

    .contact-form {
        padding: 40px 30px;
    }


    .support-form {
        gap: 20px;
    }

    .support-form input,
    .support-form select,
    .support-form textarea {
        padding: 15px 20px;
        font-size: 1rem;
    }

    .support-form textarea {
        min-height: 120px;
    }

    .support-form .btn {
        padding: 14px 28px;
        font-size: 18px;
    }

    .quick-links {
        padding: 80px 32px;
    }


    .quick-links__grid {
        grid-template-columns: repeat(2, 1fr);
        gap: 20px;
    }

    .quick-link {
        padding: 25px 30px;
        gap: 20px;
    }

    .quick-link__icon {
        font-size: 2rem;
    }

    .quick-link h4 {
        font-size: 1.2rem;
        margin-bottom: 5px;
    }

    .quick-link p {
        font-size: 1rem;
    }
}

/* ===========================================
   DESKTOP STYLES (1024px+)
   =========================================== */
@media (min-width: 1024px) {
    .features__grid {
        grid-template-columns: repeat(2, 1fr);
        gap: 20px;
        margin-top: 32px;
        justify-items: center;
        max-width: 800px;
        margin-left: auto;
        margin-right: auto;
    }

    .header {
        padding: 32px 48px 0 48px;
        
        /* Фиксированная высота для десктопов */
        height: 120px;
        min-height: 120px;
        max-height: 120px;
    }

    .header__logo {
        /* Фиксированные размеры для десктопов */
        width: 200px;
        height: 40px;
        object-fit: contain;
    }

    .header__nav {
        gap: 32px;
    }

    .header__link {
        font-size: 18px;
    }

    .header__actions {
        gap: 16px;
    }
    
    /* Sign In Button responsive - desktop */
    .btn--dark {
        width: 76px;
        height: 34px;
        min-width: 76px;
        min-height: 34px;
    }

    /* Unified button style is applied */

    .hero {
        aspect-ratio: 16/7;
        min-height: 70vh;
        gap: 24px;
        margin-top: 100px;
        padding: clamp(30px, 5vw, 60px) clamp(16px, 3vw, 48px);
        
        /* Фиксированная высота для десктопов */
        height: 480px;
        min-height: 480px;
        max-height: 480px;
    }

    .hero__subtitle {
        
        color: var(--text-tertiary);
        margin-bottom: 20px;
        line-height: 1.5;
        max-width: 80vw;
    }

    .trusted {
        margin-top: 48px;
        margin-bottom: 32px;
        gap: 24px;
        padding: 0;
    }


    .trusted__subtitle {
        
        max-width: 700px;
    }

    .trusted__logos {
        gap: 40px;
        margin-top: 24px;
    }

    .trusted__logo {
        font-size: 1.5rem;
    }

    .trusted__logo svg {
        width: 92px;
        height: 60px;
    }

    .trusted__logo img {
        width: 92px;
        height: 60px;
        max-width: 92px;
        max-height: 60px;
    }

    .trusted__logo--small img {
        width: 58px;
        height: 38px;
        max-width: 58px;
        max-height: 38px;
    }

    .features {
        gap: 20;
        padding: 120px 50px 0px 50px;
        margin-left: 0;
        margin-right: 0;
    }


    .features__subtitle {
        font-size: 1.2rem;
    }

    .features__tags {
        gap: 16px;
    }

    .features__tag {
        padding: 8px 18px;
        font-size: 1rem;
    }

    .features__tag svg {
        width: 18px;
        height: 18px;
    }


    .features__desc {
        font-size: 1.15rem;
        max-width: 480px;
        order: 1;
        margin-top: 108px;
    }


    .features__cards {
        gap: 18px;
        order: 2;
    }

    .features__card {
        gap: 18px;
        padding: 22px 32px;
    }

    .features__card-icon {
        min-width: 48px;
        min-height: 48px;
        font-size: 32px;
    }

    .features__card-title {
        font-size: 1.15rem;
    }

    .features__card-desc {
        font-size: 1rem;
    }

    .hero__download {
        font-size: 18px;
        padding: 18px 48px;
        margin-top: 30px;
    }

    .experience__grid,
    .interface__grid {
        grid-template-columns: 1fr 1fr;
        gap: 64px;
        margin: 100px auto 64px auto;
    }

    .servers__grid {
        padding: 0 20px !important;
    }

    .reviews {
        margin: 80px auto 0 auto;
        padding: 0;
    }


    .reviews__grid {
        grid-template-columns: repeat(3, 1fr);
        grid-template-rows: repeat(3, 1fr);
        gap: 20px;
    }

    .review-card {
        padding: 20px 18px;
        font-size: 0.74rem;
        min-height: 85px;
    }

    .review-card b {
        font-size: 0.77rem;
    }

    .platforms {
        margin: 80px auto 0 auto;
    }



    .platforms__grid {
        gap: 12px;
        margin-top: 24px;
        width: 100%;
    }

    .platform-card {
        gap: 12px;
        padding: 16px 12px;
    }

    .platform-card__icon {
        width: 32px;
        height: 32px;
        color: white;
    }

    .platform-card__name {
        font-size: 0.8rem;
    }

    .platform-card__link {
        font-size: 14px;
    }

    .privacy {
        margin: 80px auto 0 auto;
    }



    .privacy__grid {
        grid-template-columns: repeat(3, 1fr);
        gap: 20px;
        margin-top: 32px;
    }

    .privacy__item {
        padding: 18px 20px;
        gap: 16px;
    }

    .privacy__icon {
        min-width: 40px;
        min-height: 40px;
        font-size: 24px;
    }

    .privacy__item-title {
        font-size: 1rem;
        font-weight: 700;
        color: #fff;
        margin-bottom: 4px;
    }

    .privacy__item-desc {
        font-size: 0.9rem;
        color: var(--text-secondary);
    }

    .trusted-users {
        margin: 80px auto 0 auto;
    }


    .trusted-users__subtitle {
        font-size: 1.1rem;
        margin-bottom: 24px;
    }

    .trusted-users__stats {
        gap: 48px;
        margin-top: 24px;
    }

    .trusted-users__stat {
        padding: 18px 32px;
        font-size: 1.15rem;
        gap: 12px;
    }

    .trusted-users__stat b {
        font-size: 1.3rem;
    }

    .awards {
        margin: 80px auto 0 auto;
        padding: 0;
    }

    .awards__grid {
        gap: 40px;
        margin-top: 24px;
    }

    .awards__item {
        padding: 18px 24px;
        gap: 12px;
        min-width: 180px;
        max-width: 220px;
    }

    .awards__item img {
        width: 80px;
        margin-bottom: 8px;
    }

    .awards__item span {
        font-size: 0.95rem;
    }

    .prices {
        margin: 40px auto 0 auto;
        padding: 0;
    }



    .prices__grid {
        grid-template-columns: 1fr 1fr;
        gap: 40px;
        max-width: 750px;
    }

    .prices__card {
        padding: 30px 24px 24px 24px;
    }

    .prices__card-title {
        font-size: 1.35rem;
    }

    .prices__card-price {
        font-size: 2.25rem;
    }

    .prices__card-features li {
        font-size: 0.825rem;
        margin-bottom: 12px;
    }

    /* Unified button style is applied */

    .prices__disclaimer {
        font-size: 0.85rem;
        margin-top: 28px;
    }

    .payment-methods {
        margin: 100px auto 0 auto;
        padding: 0;
    }



    .payment-methods__grid {
        grid-template-columns: repeat(4, 1fr);
        gap: 20px;
        max-width: 900px;
        display: grid;
    }

    .payment-method {
        padding: 20px 16px;
        gap: 12px;
        border-radius: 16px;
    }

    .payment-method__icon {
        width: 60px;
        height: 35px;
    }

    .upgrade {
        margin: 80px auto 0 auto;
        padding: 0;
    }

    .upgrade__grid {
        flex-direction: row;
        gap: 48px;
    }

    .upgrade__icon img {
        width: 120px;
        height: 120px;
        border-radius: 32px;
        box-shadow: 0 8px 48px 0 #b86cff22;
    }

    .upgrade__desc {
        max-width: 480px;
        text-align: left;
    }

    .upgrade__desc h2 {
        font-size: 2rem;
    }

    .upgrade__desc p {
        font-size: 1.1rem;
        margin-bottom: 24px;
    }

    .connect-now-btn {
        height: 54px !important;
        min-height: 54px !important;
        max-height: 54px !important;
        font-size: 18px;
    }
}

@media (min-width: 1200px) {
    .connect-now-btn {
        height: 60px !important;
        min-height: 60px !important;
        max-height: 60px !important;
        font-size: 20px;
    }
}

@media (min-width: 768px) and (max-width: 1023px) {
    .hero {
        aspect-ratio: 16/9;
        min-height: 60vh;
        gap: 22px;
        padding: 40px 32px;
        margin-top: 80px;
    }

    .hero__subtitle {
        font-size: 18px;
        max-width: 90vw;
    }

    .hero__download {
        font-size: 18px;
        padding: 14px 32px;
        margin-top: 30px;
    }
}

@media (max-width: 767px) {
    .hero {
        aspect-ratio: 16/7;
        min-height: 30vh;
        gap: 10px;
        padding: 20px 12px;
        margin-top: 3px;
    }
.hero__subtitle {
    font-size: clamp(13px, 3.5vw, 16px);
    max-width: 98vw;
}
    .hero__download {
        padding: 10px 20px;
        font-size: 16px;
    }
    
    /* Connect Now buttons now use unified .connect-now-btn class */
}

@media (max-width: 410px) {
    .hero__subtitle {
        font-size: clamp(12px, 3.8vw, 13px);
        max-width: 99vw;
    }
}

/* Ultra-small devices: ensure hero spacing below header and prevent overlaps */
@media (max-width: 400px) {
    .hero {
        /* Uses fluid variables; only keep for edge devices */
        margin-top: var(--header-h);
        padding-top: calc(var(--hero-pt) + 8px);
        gap: var(--hero-gap);
    }
    .hero__title {
        font-size: calc(var(--h1-size) * 0.95);
        line-height: 1.25;
        text-align: center;
        word-wrap: break-word;
    }
    .hero h3 {
        font-size: clamp(0.9rem, 3.8vw, 0.98rem);
        min-height: 2.4rem;
    }
    .hero__logo {
        width: calc(var(--hero-logo-w) * 0.9);
        height: calc(var(--hero-logo-h) * 0.9);
        margin: 12px auto 0 auto;
        display: block;
        object-fit: contain;
    }
}

/* Blog Construction Section */
.blog-construction-section {
    padding: 30px 40px;
    background: var(--bg-primary);
}

.blog-construction {
    max-width: 800px;
    margin: 0 auto;
    padding: 40px 20px;
    background: linear-gradient(135deg, rgba(35, 32, 65, 0.3) 0%, rgba(26, 24, 51, 0.3) 100%);
    border-radius: 16px;
    border: 1px solid rgba(255, 103, 194, 0.1);
    text-align: center;
}

.blog-construction h2 {
    font-size: 1.8rem;
    font-weight: 700;
    color: #fff;
    margin-bottom: 16px;
}

.blog-construction p {
    font-size: 1.1rem;
    color: #b0b0b0;
    line-height: 1.6;
    margin-bottom: 0;
}

.flags-svg {
    width: 100%;
    max-width: 320px;
    height: auto;
}

.flags-grid {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 12px;
    max-width: 100%;
    width: 100%;
    margin: 0 auto;
}

.flag-icon {
    width: 48px;
    height: 32px;
    border-radius: 4px;
    object-fit: cover;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.2);
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.flag-icon:hover {
    transform: scale(1.1);
    box-shadow: 0 4px 12px rgba(255, 103, 194, 0.3);
}

.experience__grid,
.interface__grid {
    grid-template-columns: 1fr;
    gap: 32px;
    align-items: center;
    max-width: 1200px;
    margin: 75px auto 40px auto;
    padding: 0 16px;
}

.experience__desc,


.experience__visual,
.interface__mockup {
    display: flex;
    align-items: center;
    justify-content: center;
}

.flags-grid {
    gap: 16px;
}

.flag-icon {
    width: 64px;
    height: 42px;
}

/* Comparison Table */
.comparison {
    margin: 60px auto 0 auto;
    max-width: 1200px;
    text-align: center;
    padding: 0 16px;
    position: relative;
}

.comparison::before {
    content: '';
    position: absolute;
    top: -20px;
    left: 50%;
    transform: translateX(-50%);
    width: 90%;
    height: calc(100% + 40px);
    background: linear-gradient(135deg, rgba(12, 12, 28, 0.8) 0%, rgba(26, 26, 47, 0.8) 100%);
    border-radius: 24px;
    z-index: -1;
    border: 1px solid rgba(179, 103, 255, 0.2);
}


.comparison__table-wrapper {
    background: linear-gradient(135deg, var(--bg-secondary) 0%, #1a1833 100%);
    border-radius: 16px;
    box-shadow: 0 8px 48px rgba(179, 103, 255, 0.15);
    border: 1px solid rgba(255, 103, 194, 0.1);
    position: relative;
    max-width: 950px;
    margin: 0 auto;
}

.comparison__table {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.7rem;
    position: relative;
    overflow-x: auto;
    display: block;
    white-space: nowrap;
}

.comparison__table thead,
.comparison__table tbody,
.comparison__table tr {
    display: table;
    width: 100%;
    table-layout: fixed;
}

.comparison__table th,
.comparison__table td {
    padding: 12px 8px;
    border-bottom: 1px solid rgba(26, 24, 51, 0.8);
    vertical-align: middle;
}

.comparison__table th {
    background: linear-gradient(135deg, #1a1833 0%, #0c0c1c 100%);
    font-weight: 700;
    color: #fff;
    font-size: 0.85rem;
    padding: 16px 8px;
    position: sticky;
    top: 0;
    z-index: 10;
    border-bottom: 2px solid rgba(255, 103, 194, 0.2);
    text-align: center;
}

.comparison__feature-header,
.comparison__feature {
    width: auto !important;
    text-align: left;
    white-space: normal;
    padding-left: 5% !important;
}

.comparison__provider--narrow,
.comparison__provider,
.comparison__check {
    width: 12% !important;
    min-width: 60px !important;
    max-width: 120px !important;
    text-align: center !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    margin: 0 !important;
    vertical-align: middle !important;
}

.comparison__table th,
.comparison__table td {
    padding-top: 10px !important;
    padding-bottom: 10px !important;
    padding-left: 4px !important;
    padding-right: 4px !important;
    word-break: break-word;
    overflow-wrap: anywhere;
}

.comparison__provider-content {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 4px;
}

.comparison__provider-badge {
    font-size: 0.7rem;
    background: linear-gradient(90deg, var(--primary) 0%, var(--secondary) 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    font-weight: 600;
}

.comparison__feature {
    font-weight: 600;
    color: #fff;
    width: 25%;
    text-align: left;
    padding: 12px 8px;
    word-wrap: break-word;
    vertical-align: top;
}

.comparison__feature strong {
    font-size: 0.85rem;
    font-weight: 700;
    color: #fff;
    margin: 0;
    line-height: 1.3;
}

.comparison__feature-desc {
    font-size: 0.65rem;
    color: var(--text-secondary);
    font-weight: 400;
    margin: 2px 0 0 0;
    cursor: help;
    line-height: 1.2;
    display: block;
}

.comparison__feature-desc[data-tooltip] {
    position: relative;
}

.comparison__feature-desc[data-tooltip]:hover::after {
    content: attr(data-tooltip);
    position: absolute;
    top: -40px;
    left: 0;
    background: #0c0c1c;
    color: #fff;
    padding: 8px 12px;
    border-radius: 6px;
    font-size: 0.75rem;
    white-space: nowrap;
    z-index: 1000;
    border: 1px solid rgba(255, 103, 194, 0.3);
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.3);
}

.comparison__check {
    font-size: 0.8rem;
    font-weight: 600;
    text-align: center;
    padding: 12px 6px;
    border-radius: 4px;
    transition: all 0.2s ease;
    width: 15%;
}

.comparison__check--good {
    color: #4ade80;
    background: rgba(74, 222, 128, 0.1);
    border: 1px solid rgba(74, 222, 128, 0.2);
}

.comparison__check--bad {
    color: #f87171;
    background: rgba(248, 113, 113, 0.1);
    border: 1px solid rgba(248, 113, 113, 0.2);
}

.comparison__check--warning {
    color: #fbbf24;
    background: rgba(251, 191, 36, 0.1);
    border: 1px solid rgba(251, 191, 36, 0.2);
}

.comparison__table tbody tr {
    transition: background-color 0.2s ease;
}

.comparison__table tbody tr:nth-child(even) {
    background: rgba(26, 24, 51, 0.3);
}

.comparison__table tbody tr:hover {
    background: rgba(255, 103, 194, 0.05);
}

.flags-grid {
    gap: 16px;
}

.flag-icon {
    width: 64px;
    height: 42px;
}

.comparison {
    margin: 80px auto 0 auto;
    padding: 0;
}


.comparison__table {
    font-size: 1rem;
}

.comparison__table-wrapper {
    max-width: 950px;
}

.comparison__table th,
.comparison__table td {
    padding: 16px 12px;
}

.comparison__table th {
    font-size: 1rem;
    padding: 20px 12px;
}

.comparison__feature-header {
    font-size: 1.1rem;
    padding: 20px 12px;
}

.comparison__feature {
    padding: 16px 12px;
}

.comparison__feature strong {
    font-size: 1rem;
}

.comparison__feature-desc {
    font-size: 0.75rem;
}

.comparison__check {
    font-size: 0.9rem;
    padding: 16px 10px;
}

.payment-method:nth-child(1) .payment-method__icon img {
    transform: scale(1.5);
}

.payment-method:nth-child(3) .payment-method__icon img {
    transform: scale(1.25);
}

.payment-method:nth-child(2) .payment-method__icon img {
    filter: brightness(1.4);
}

.payment-method:hover:nth-child(2) .payment-method__icon img {
    filter: brightness(1.5);
}

.review-card .review-flag {
    width: 16px;
    height: 12px;
    margin-right: 6px;
    vertical-align: middle;
    border-radius: 2px;
    display: inline-block;
}

.mission-block {
    margin-top: 50px;
}

.comparison__provider--narrow {
    width: 11%;
    min-width: 80px;
    max-width: 120px;
}

.comparison__provider,
.comparison__check {
    width: 13%;
    min-width: 80px;
    max-width: 140px;
    word-break: break-word;
    overflow-wrap: anywhere;
}

.comparison__table th,
.comparison__table td {
    word-break: break-word;
    overflow-wrap: anywhere;
}

.nav-links {
    display: flex;
    gap: 32px;
    align-items: center;
}

.header__lang-dropdown {
    display: flex !important;
}

/* Стиль для бургер-меню — показывается только на мобильных устройствах */
.burger-menu {
  display: none;
  flex-direction: column;
  gap: 4px;
  cursor: pointer;
  width: 24px;
  height: 18px;
  z-index: 99999;
  background: none;
  border: none;
  box-shadow: none;
  align-items: center;
  justify-content: center;
}
.burger-menu span {
  width: 100%;
  height: 3px;
  background: #fff;
  border-radius: 2px;
  display: block;
  transition: background 0.2s;
}

@media (max-width: 1294px) {
    .footer__main {
        gap: 0 !important;
    }

    .footer__links,
    .footer__menu {
        margin-left: 0;
        margin-top: 30px;
    }

    .footer__main {
        flex-direction: column;
    }

    /* Footer brand and form styles removed */

    .all-links-footer {
        display: flex;
        justify-content: space-between;
        width: 100%;
    }
}

@media (max-width: 1136px) {
    .nav-links {
        display: flex;
        gap: 30px;
    }

    .nav-links {
        display: none;
        position: absolute;
        top: 0;
        right: 0;
        z-index: 3;
        padding-top: 50px;
        width: 50%;
        background-color: #030d30;
        flex-direction: column;
        padding: 75px 10px 75px 10px;
    }

    .burger-menu {
        display: flex !important;
    }

    .nav-links.show {
        display: flex !important;
    }

    .close-btn {
        display: block;
    }


    .header__nav {
        gap: 25px;
    }

    .header {
        flex-direction: row !important;
        justify-content: space-between !important;
    }
}

@media (max-width: 800px) {
    .review-card b {
        font-size: 1.2rem;
    }

    .review-card p {
        font-size: 14px;
    }

    .review-card {
        display: flex;
        flex-direction: column;
        gap: 8px;
    }

    .review-flag {
        width: 29px !important;
        height: 15px !important;
    }

    .interface__grid {
        grid-template-columns: 1fr;
    }

    /* Footer form styles removed */

    .flags-grid {
        max-width: 100% !important;
        gap: 10px !important;
    }

    .comparison__table-wrapper {
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
    }

    .comparison__table {
        min-width: 500px;
        font-size: 0.6rem !important;
    }

    .comparison__table th,
    .comparison__table td {
        padding: 8px 4px !important;
        font-size: 0.6rem !important;
    }

    .comparison__feature-header {
        width: 25% !important;
        font-size: 0.65rem !important;
        padding: 8px 4px !important;
    }

    .comparison__provider {
        width: 15% !important;
        font-size: 0.55rem !important;
    }
}

@media (max-width: 767px) {
    .comparison__provider--narrow,
    .comparison__provider,
    .comparison__check {
        width: 15% !important;
        min-width: 48px !important;
        max-width: 80px !important;
        font-size: 0.6rem !important;
    }

    .comparison__feature-header,
    .comparison__feature {
        font-size: 0.7rem !important;
    }
}

/* Features grid responsive layout */
@media (min-width: 768px) {
    .features__grid {
        grid-template-columns: repeat(2, 1fr);
        gap: 20px;
        margin-top: 32px;
        justify-items: center;
        max-width: 800px;
        margin-left: auto;
        margin-right: auto;
    }
    
    .privacy__item {
        max-width: 350px;
        padding: 18px 20px;
        gap: 16px;
    }
}

/* Take Control section styles */
.take-control {
    padding: 60px 20px;
    text-align: center;
}

.take-control__container {
    display: flex;
    align-items: center;
    gap: 40px;
    max-width: 1000px;
    margin: 0 auto;
}

.take-control__icon {
    flex-shrink: 0;
}

.take-control__icon img {
    width: 200px;
    height: 200px;
}

.take-control__content {
    flex: 1;
    text-align: center;
}

.take-control__content h2 {
    text-align: center;
    margin-bottom: 20px;
}

.take-control__content .connect-now-btn {
    margin-top: 24px;
}

@media (max-width: 768px) {
    .take-control__container {
        flex-direction: column;
        text-align: center;
        gap: 30px;
    }
    
    .take-control__content {
        text-align: center;
    }
    
    .take-control__content h2 {
        text-align: center;
    }
    
    .take-control__icon img {
        width: 150px;
        height: 150px;
    }
}

@media (max-width: 610px) {
    .features__grid,
    .prices__grid,
    .privacy__grid,
    .reviews__grid {
        grid-template-columns: 1fr;
        gap: 10px;
    }
    
    .privacy__item {
        max-width: 100%;
    }

    .footer__links,
    .footer__menu {
        min-width: 0;
        width: max-content;
        align-items: flex-start;
    }

    .trusted-users__stats {
        gap: 10px;
    }

    .all-links-footer {
        display: flex;
        gap: 15px;
        flex-wrap: wrap;
        justify-content: space-between;
    }

    .footer__legal-links {
        flex-direction: row;
        flex-wrap: wrap;
        gap: 10px;
    }

    /* Unified button style is applied */

    .payment-methods__grid {
        grid-template-columns: repeat(1, 1fr) !important;
    }

    .platform-card {
        max-width: none;
        width: 48%;
    }


    .header__nav {
        justify-content: space-between;

        /* width: 100%; */
    }

    .trusted-users__stat {
        width: 100%;
        flex-direction: column;
        align-items: center;
    }

    .header__link {
        font-size: 18px;
    }

    .nav-links {
        width: 65%;
        height: 100%;
    }

    .mobal-block {
        gap: 10px;
    }

    .header {
        padding: 16px 10px;
        gap: 5px;
        
        /* Фиксированная высота для мобильных устройств */
        height: 100px;
        min-height: 100px;
        max-height: 100px;
    }
    
    /* Sign In Button responsive - small mobile */
    .btn--dark {
        width: 64px;
        height: 28px;
        min-width: 64px;
        min-height: 28px;
    }

    .hero {
        background-image: url('images/backgrounds/BG_Mobile_half.webp') !important;
        
        /* Фиксированная высота для мобильных устройств */
        height: 350px;
        min-height: 350px;
        max-height: 350px;
    }
}

@media (max-width: 410px) {
    /* Unified button style is applied */
}

.trusted-stats {
  display: flex;
  justify-content: center;
  gap: 32px;
  margin: 40px auto 0 auto;
}
.trusted-stats__item {
  width: 320px;
  min-width: 220px;
  max-width: 100%;
  white-space: nowrap;
  overflow: hidden;
}
@media (max-width: 700px) {
  .trusted-stats {
    flex-direction: column;
    align-items: center;
    gap: 16px;
  }
}

.stat-bullet {
  display: inline-block;
  width: 12px;
  height: 12px;
  border-radius: 50%;
  background: linear-gradient(135deg, var(--accent) 0%, #b86cff 100%);
  margin-right: 8px;
  vertical-align: middle;
}

.trusted-users__stat-value {
  
  line-height: 1.2;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.trusted-users__stat-label {
  
  line-height: 1.2;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

/* Connect Now buttons now use .connect-now-btn class */

@media (max-width: 1023px) {
    .hero {
        aspect-ratio: unset;
        min-height: 50vh;
        padding: var(--hero-pt) 8px;
        gap: var(--hero-gap);
    }
    .hero__subtitle {
        max-width: 100%;
    }
    /* Connect Now buttons now use .connect-now-btn class */
    .hero__logo {
        width: var(--hero-logo-w);
        height: var(--hero-logo-h);
        margin: 8px auto 0 auto;
        display: block;
        object-fit: contain;
    }
}

@media (max-width: 410px) {
    /* Connect Now buttons now use .connect-now-btn class */
    .hero__subtitle {
        font-size: 0.9rem;
    }
}

.interface {
    margin-top: 60px;
    }

.ip-details-section {
  width: 100%;
  max-width: 900px;
  margin: -10px auto 30px auto;
  padding: 0 16px;
}
.ip-details-grid {
  display: flex;
  flex-direction: row;
  gap: 24px;
  justify-content: center;
  align-items: flex-start;
}
.ip-map-block {
  flex: 1 1 320px;
  min-width: 220px;
  max-width: 400px;
  background: rgba(35,32,65,0.18);
  border-radius: 16px;
  box-shadow: 0 4px 24px 0 rgba(40,30,80,0.10);
  padding: 14px 10px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.ip-map-placeholder {
  width: 100%;
  min-height: 180px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--text-secondary);
  font-size: 1rem;
}
.ip-info-block {
  flex: 1 1 220px;
  min-width: 180px;
  max-width: 320px;
  background: rgba(35,32,65,0.18);
  border-radius: 16px;
  box-shadow: 0 4px 24px 0 rgba(40,30,80,0.10);
  padding: 20px 16px;
  display: flex;
  align-items: flex-start;
  justify-content: center;
}
/* Old IP list styles removed - using new styles from IP hero section */

@media (max-width: 767px) {
  .ip-info-list {
    font-size: 1rem;
    gap: 12px;
  }
  
  .ip-info-list li {
    flex-direction: column;
    align-items: flex-start;
    gap: 4px;
  }
  
  .ip-info-label {
    margin-right: 0;
    margin-bottom: 2px;
  }
}

@media (max-width: 480px) {
  .ip-info-list {
    padding-left: 15px;
  }
  
  .features {
    padding: 60px 20px 0px 20px;
  }
}

@media (max-width: 768px) and (min-width: 481px) {
  .features {
    padding: 80px 40px 0px 40px;
  }
}

.ip-leaflet-map {
  min-height: 200px;
  height: 200px;
}

.ip-hero-flex {
  display: flex;
  flex-direction: row;
  gap: 32px;
  justify-content: center;
  align-items: flex-start;
  margin: 32px auto 0 auto;
  width: 100%;
  max-width: 1000px;
  padding: 0 16px;
}
.ip-hero-map {
  flex: 1 1 320px;
  min-width: 220px;
  max-width: 400px;
  background: rgba(35,32,65,0.18);
  border-radius: 16px;
  box-shadow: 0 4px 24px 0 rgba(40,30,80,0.10);
  padding: 18px 12px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.ip-leaflet-map {
  width: 100%;
  min-width: 180px;
  min-height: 220px;
  height: 220px;
  border-radius: 12px;
  overflow: hidden;
}
.ip-hero-info {
  flex: 1 1 220px;
  min-width: 180px;
  max-width: none;
  background: rgba(35,32,65,0.18);
  border-radius: 16px;
  box-shadow: 0 4px 24px 0 rgba(40,30,80,0.10);
  padding: 24px 18px;
  display: flex;
  align-items: flex-start;
  justify-content: center;
}

.ip-info-list {
  list-style-type: disc;
  padding-left: 20px;
  color: var(--text-tertiary);
  font-size: 1rem;
  line-height: 1.6;
  display: flex;
  flex-direction: column;
  gap: 12px;
  width: 100%;
}

.ip-info-list li {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  word-break: break-word;
  white-space: normal;
  flex-wrap: wrap;
}

.ip-info-label {
  color: var(--primary);
  font-weight: 500;
  min-width: 80px;
  flex-shrink: 0;
}

@media (max-width: 900px) {
  .ip-hero-flex {
    flex-direction: column;
    gap: 18px;
    align-items: stretch;
    padding: 0 12px;
  }
  .ip-hero-map, .ip-hero-info {
    max-width: 100%;
    min-width: 0;
  }
  .ip-leaflet-map {
    min-height: 160px;
    height: 160px;
  }
}
@media (max-width: 600px) {
  .ip-hero-map, .ip-hero-info {
    padding: 16px 12px;
  }
  .ip-leaflet-map {
    min-height: 120px;
    height: 120px;
  }
  .ip-info-list {
    gap: 16px;
  }
  .ip-hero-flex {
    padding: 0 8px;
  }
  .ip-info-list li {
    flex-direction: column;
    align-items: flex-start;
    gap: 4px;
  }
  .ip-info-label {
    color: var(--primary);
    min-width: auto;
    margin-bottom: 2px;
  }
}

/* ===========================================
   TABLET STYLES (768px - 1199px)
   =========================================== */
@media (min-width: 768px) and (max-width: 1199px) {
  /* Fix for prices section buttons overflowing */
  /* Unified button style is applied */
  
  /* Hero logo для планшетов */
  .hero__logo {
    width: 360px;
    height: 108px;
    margin: 10px auto 0 auto;
    display: block;
    object-fit: contain;
  }
  
  /* Adjust prices grid for better fit */
  .prices__grid {
    gap: 20px;
  }
  
  /* Reduce padding in price cards for better fit */
  .prices__card {
    padding: 30px 16px 24px 16px;
  }
}

/* ===========================================
   DESKTOP STYLES (1200px+)
   =========================================== */
@media (min-width: 1200px) {
    .header {
        padding: 32px 48px 0 48px;
        
        /* Фиксированная высота для больших экранов */
        height: 140px;
        min-height: 140px;
        max-height: 140px;
    }

    .header__logo {
        /* Фиксированные размеры для больших экранов */
        width: 240px;
        height: 48px;
        object-fit: contain;
    }

    .header__nav {
        gap: 32px;
    }

    .header__link {
        font-size: 18px;
    }

    .header__actions {
        gap: 16px;
    }
    
    /* Sign In Button responsive - large screens */
    .btn--dark {
        width: 80px;
        height: 36px;
        min-width: 80px;
        min-height: 36px;
    }

    .hero {
        aspect-ratio: 16/7;
        min-height: 70vh;
        gap: 24px;
        margin-top: 100px;
        padding: clamp(40px, 6vw, 80px) clamp(24px, 4vw, 64px);
        width: 100%;
        max-width: 100vw;
        
        /* Фиксированная высота для больших экранов */
        height: 560px;
        min-height: 560px;
        max-height: 560px;
    }

    .hero__subtitle {
        
        color: var(--text-tertiary);
        margin-bottom: 20px;
        line-height: 1.5;
        max-width: 80vw;
    }

    /* Hero logo для больших экранов */
    .hero__logo {
        width: 480px;
        height: 144px;
        margin: 30px auto 0 auto;
        display: block;
        object-fit: contain;
    }

    .trusted {
        margin-top: 48px;
        margin-bottom: 32px;
        gap: 24px;
        padding: 0;
    }


    .trusted__subtitle {
        
        max-width: 700px;
    }

    .trusted__logos {
        gap: 40px;
        margin-top: 24px;
    }

    .trusted__logo {
        font-size: 1.5rem;
    }

    .trusted__logo svg {
        width: 92px;
        height: 60px;
    }

    .trusted__logo img {
        width: 92px;
        height: 60px;
        max-width: 92px;
        max-height: 60px;
    }

    .trusted__logo--small img {
        width: 58px;
        height: 38px;
        max-width: 58px;
        max-height: 38px;
    }

    .features {
        gap: 20;
        padding: 120px 50px 0px 50px;
        margin-left: 0;
        margin-right: 0;
    }


    .features__subtitle {
        font-size: 1.2rem;
    }

    .features__tags {
        gap: 16px;
    }

    .features__tag {
        padding: 8px 18px;
        font-size: 1rem;
    }

    .features__tag svg {
        width: 18px;
        height: 18px;
    }


    .features__desc {
        font-size: 1.15rem;
        max-width: 480px;
        order: 1;
        margin-top: 108px;
    }


    .features__cards {
        gap: 18px;
        order: 2;
    }

    .features__card {
        gap: 18px;
        padding: 22px 32px;
    }

    .features__card-icon {
        min-width: 48px;
        min-height: 48px;
        font-size: 32px;
    }

    .features__card-title {
        font-size: 1.15rem;
    }

    .features__card-desc {
        font-size: 1rem;
    }

    .hero__download {
        font-size: 18px;
        padding: 18px 48px;
        margin-top: 30px;
    }

    .experience__grid,
    .interface__grid {
        grid-template-columns: 1fr 1fr;
        gap: 64px;
        margin: 100px auto 64px auto;
    }

    .servers__grid {
        padding: 0 20px !important;
    }

    .reviews {
        margin: 80px auto 0 auto;
        padding: 0;
    }


    .reviews__grid {
        grid-template-columns: repeat(3, 1fr);
        grid-template-rows: repeat(3, 1fr);
        gap: 20px;
    }

    .review-card {
        padding: 20px 18px;
        font-size: 0.74rem;
        min-height: 85px;
    }

    .review-card b {
        font-size: 0.77rem;
    }

    .platforms {
        margin: 80px auto 0 auto;
    }



    .platforms__grid {
        gap: 12px;
        margin-top: 24px;
        width: 100%;
    }

    .platform-card {
        gap: 12px;
        padding: 16px 12px;
    }

    .platform-card__icon {
        width: 32px;
        height: 32px;
        color: white;
    }

    .platform-card__name {
        font-size: 0.8rem;
    }

    .platform-card__link {
        font-size: 14px;
    }

    .privacy {
        margin: 80px auto 0 auto;
    }



    .privacy__grid {
        grid-template-columns: repeat(3, 1fr);
        gap: 20px;
        margin-top: 32px;
    }

    .privacy__item {
        padding: 18px 20px;
        gap: 16px;
    }

    .privacy__icon {
        min-width: 40px;
        min-height: 40px;
        font-size: 24px;
    }

    .privacy__item-title {
        font-size: 1rem;
        font-weight: 700;
        color: #fff;
        margin-bottom: 4px;
    }

    .privacy__item-desc {
        font-size: 0.9rem;
        color: var(--text-secondary);
    }

    .trusted-users {
        margin: 80px auto 0 auto;
    }


    .trusted-users__subtitle {
        font-size: 1.1rem;
        margin-bottom: 24px;
    }

    .trusted-users__stats {
        gap: 48px;
        margin-top: 24px;
    }

    .trusted-users__stat {
        padding: 18px 32px;
        font-size: 1.15rem;
        gap: 12px;
    }

    .trusted-users__stat b {
        font-size: 1.3rem;
    }

    .awards {
        margin: 80px auto 0 auto;
        padding: 0;
    }

    .awards__grid {
        gap: 40px;
        margin-top: 24px;
    }

    .awards__item {
        padding: 18px 24px;
        gap: 12px;
        min-width: 180px;
        max-width: 220px;
    }

    .awards__item img {
        width: 80px;
        margin-bottom: 8px;
    }

    .awards__item span {
        font-size: 0.95rem;
    }

    .prices {
        margin: 40px auto 0 auto;
        padding: 0;
    }



    .prices__grid {
        grid-template-columns: 1fr 1fr;
        gap: 40px;
        max-width: 750px;
    }

    .prices__card {
        padding: 30px 24px 24px 24px;
    }

    .prices__card-title {
        font-size: 1.35rem;
    }

    .prices__card-price {
        font-size: 2.25rem;
    }

    .prices__card-features li {
        font-size: 0.825rem;
        margin-bottom: 12px;
    }

    /* Unified button style is applied */

    .prices__disclaimer {
        font-size: 0.85rem;
        margin-top: 28px;
    }

    .payment-methods {
        margin: 100px auto 0 auto;
        padding: 0;
    }



    .payment-methods__grid {
        grid-template-columns: repeat(4, 1fr);
        gap: 20px;
        max-width: 900px;
        display: grid;
    }

    .payment-method {
        padding: 20px 16px;
        gap: 12px;
        border-radius: 16px;
    }

    .payment-method__icon {
        width: 60px;
        height: 35px;
    }

    .upgrade {
        margin: 80px auto 0 auto;
        padding: 0;
    }

    .upgrade__grid {
        flex-direction: row;
        gap: 48px;
    }

    .upgrade__icon img {
        width: 120px;
        height: 120px;
        border-radius: 32px;
        box-shadow: 0 8px 48px 0 #b86cff22;
    }

    .upgrade__desc {
        max-width: 480px;
        text-align: left;
    }

    .upgrade__desc h2 {
        font-size: 2rem;
    }

    .upgrade__desc p {
        font-size: 1.1rem;
        margin-bottom: 24px;
    }
}

/* Connect Now! — фиксированные стили для всех брейкпоинтов */
.connect-now-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: #fff;
  background: linear-gradient(90deg, var(--primary) 0%, var(--secondary) 100%);
  border: none;
  border-radius: 8px;
  font-weight: 700;
  text-align: center;
  text-decoration: none;
  cursor: pointer;
  transition: background 0.2s, box-shadow 0.2s;
  box-shadow: 0 4px 15px rgba(179, 103, 255, 0.15);
  white-space: nowrap;
  overflow: hidden;
  padding: 0;
}
.connect-now-btn:hover {
  background: linear-gradient(90deg, var(--accent) 0%, #b86cff 100%);
}

/* Prices card: 220px ширина, высота = 3x шрифт */
.prices__card .connect-now-btn {
  width: 220px;
  font-size: 16px;
  height: 48px;
  min-width: 220px;
  max-width: 220px;
  min-height: 48px;
  max-height: 48px;
}

/* Hero и футер: 350px ширина, высота = 3x шрифт */
.hero .connect-now-btn,
.upgrade .connect-now-btn,
.footer .connect-now-btn,
.take-control .connect-now-btn {
  width: 350px;
  font-size: 20px;
  height: 60px;
  min-width: 350px;
  max-width: 350px;
  min-height: 60px;
  max-height: 60px;
}

@media (max-width: 1023px) {
  .prices__card .connect-now-btn {
    width: 220px;
    font-size: 15px;
    height: 45px;
    min-width: 220px;
    max-width: 220px;
    min-height: 45px;
    max-height: 45px;
  }
  .hero .connect-now-btn,
  .upgrade .connect-now-btn,
  .footer .connect-now-btn,
  .take-control .connect-now-btn {
    width: 320px;
    font-size: 18px;
    height: 54px;
    min-width: 320px;
    max-width: 320px;
    min-height: 54px;
    max-height: 54px;
  }
}
@media (max-width: 767px) {
  .prices__card .connect-now-btn {
    width: 180px;
    font-size: 14px;
    height: 42px;
    min-width: 180px;
    max-width: 180px;
    min-height: 42px;
    max-height: 42px;
  }
  .hero .connect-now-btn,
  .upgrade .connect-now-btn,
  .footer .connect-now-btn,
  .take-control .connect-now-btn {
    width: 220px;
    font-size: 16px;
    height: 48px;
    min-width: 220px;
    max-width: 220px;
    min-height: 48px;
    max-height: 48px;
  }
}
@media (max-width: 410px) {
  .prices__card .connect-now-btn {
    width: 140px;
    font-size: 12px;
    height: 36px;
    min-width: 140px;
    max-width: 140px;
    min-height: 36px;
    max-height: 36px;
  }
  .hero .connect-now-btn,
  .upgrade .connect-now-btn,
  .footer .connect-now-btn,
  .take-control .connect-now-btn {
    width: 160px;
    font-size: 13px;
    height: 39px;
    min-width: 160px;
    max-width: 160px;
    min-height: 39px;
    max-height: 39px;
  }
}

@media (min-width: 1200px) {
  .prices__card {
    padding: 30px 24px 24px 24px;
  }
}
@media (min-width: 768px) and (max-width: 1199px) {
  .prices__card {
    padding: 30px 16px 24px 16px;
  }
}
@media (max-width: 767px) {
  .prices__card {
    padding: 24px 8px 20px 8px;
  }
}

/* Hero height reduction for Affiliate, Support, and Blog pages */
.affiliate .hero,
.support .hero,
.blog .hero {
    min-height: 196px; /* 400px * 0.49 = 196px */
    max-height: 196px;
    height: 196px;
}

@media (min-width: 1024px) {
    .affiliate .hero,
    .support .hero,
    .blog .hero {
        min-height: 294px; /* 600px * 0.49 = 294px */
        max-height: 294px;
        height: 294px;
    }
}

@media (min-width: 1200px) {
    .affiliate .hero,
    .support .hero,
    .blog .hero {
        min-height: 343px; /* 700px * 0.49 = 343px */
        max-height: 343px;
        height: 343px;
    }
}

@media (max-width: 1023px) {
    .affiliate .hero,
    .support .hero,
    .blog .hero {
        min-height: 245px; /* 500px * 0.49 = 245px */
        max-height: 245px;
        height: 245px;
    }
}

@media (max-width: 767px) {
    .affiliate .hero,
    .support .hero,
    .blog .hero {
        min-height: 171px; /* 350px * 0.49 = 171px */
        max-height: 171px;
        height: 171px;
    }
}

@media (max-width: 410px) {
    .affiliate .hero,
    .support .hero,
    .blog .hero {
        min-height: 127px; /* 260px * 0.49 = 127px */
        max-height: 127px;
        height: 127px;
    }
}

/* ===========================================
   FOOTER CONSISTENCY FIX (FROM footer-fix.css)
   =========================================== */
/* Footer consistency fix for all breakpoints */

/* Base footer layout - consistent centering */
.all-links-footer {
    display: flex !important;
    flex-wrap: wrap !important;
    justify-content: center !important;
    gap: 40px !important;
}

.footer__main {
    display: flex;
    flex-direction: column;
    gap: 32px !important;
    justify-content: center;
    align-items: center;
    max-width: 1400px;
    margin: 0 auto 24px auto;
    padding: 0 16px;
}

.footer__links,
.footer__menu {
    display: flex;
    flex-direction: column;
    gap: 8px;
    min-width: 160px;
    text-align: center !important;
    margin-left: 0 !important;
    margin-top: 0 !important;
}

/* Tablet and up - horizontal layout with consistent centering */
@media (min-width: 768px) {
    .footer__main {
        flex-direction: row;
        flex-wrap: wrap;
        gap: 40px !important;
        align-items: flex-start;
        padding: 0 32px;
        justify-content: center !important;
    }
    
    .all-links-footer {
        justify-content: center !important;
        gap: 40px !important;
    }
    
    .footer__links,
    .footer__menu {
        text-align: center !important;
        margin-left: 0 !important;
        margin-top: 0 !important;
    }
}

/* Large desktop - maintain consistent centering */
@media (min-width: 1200px) {
    .footer__main {
        gap: 40px !important;
        flex-direction: row !important;
        justify-content: center !important;
    }
    
    .all-links-footer {
        justify-content: center !important;
        gap: 40px !important;
        width: auto !important;
    }
    
    .footer__links,
    .footer__menu {
        margin-left: 0 !important;
        margin-top: 0 !important;
    }
}

/* Mobile - stack vertically with center alignment */
@media (max-width: 767px) {
    .footer__main {
        flex-direction: column !important;
        gap: 32px !important;
    }
    
    .all-links-footer {
        flex-direction: column !important;
        justify-content: center !important;
        align-items: center !important;
        gap: 32px !important;
    }
    
    .footer__links,
    .footer__menu {
        text-align: center !important;
        align-items: center !important;
        margin-left: 0 !important;
        margin-top: 0 !important;
        width: max-content;
    }
}

/* Small mobile - ensure proper stacking */
@media (max-width: 610px) {
    .all-links-footer {
        flex-direction: column !important;
        justify-content: center !important;
        align-items: center !important;
        gap: 24px !important;
    }
    
    .footer__links,
    .footer__menu {
        min-width: 0;
        width: max-content;
        align-items: center !important;
        text-align: center !important;
    }
}
.inline-link{color:#79D7EF;text-decoration:none;border-bottom:1px solid rgba(121,215,239,.35)}
.inline-link:hover{border-bottom-color:rgba(121,215,239,.6)}