/**
 * VCommerce — Material You (Material Design 3) Layer
 *
 * MD3 referans alınarak, kendi e-ticaret mağazamıza uyarlanmıştır.
 * Tonal yüzeyler, hap butonlar, cömert köşe yarıçapları, organik blur
 * şekilleri, state-layer etkileşimleri. Google demo'su değil; ürün odaklı,
 * premium bir mağaza. Mevcut dinamik PHP yapıları korunur.
 *
 * En son yüklenen katman olduğu için vc-refined sistemini üstten geçersiz kılar.
 */

/* =========================================================
   1. RENK TOKENLARI — Yumuşak mercan (#EF5C66) ana renk
   ========================================================= */
:root {
    /* Tipografi — MD3 kanonik */
    --font-display: "Roboto Flex", "Roboto", -apple-system, BlinkMacSystemFont, sans-serif;
    --font-body: "Roboto", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;

    /* MD3 Renk Rolleri */
    --md-primary: #10a99b;
    --md-primary-hover: #0c8a7f;
    --md-on-primary: #ffffff;
    --md-primary-container: #cbeee9;
    --md-on-primary-container: #00382f;

    --md-secondary-container: #cbeee9;
    --md-on-secondary-container: #06413a;

    --md-tertiary: #e2384a;
    --md-tertiary-hover: #cf2f40;
    --md-on-tertiary: #ffffff;
    --md-tertiary-container: #ffe3e6;
    --md-on-tertiary-container: #5c1420;

    --md-error: #b3261e;

    /* Nötr yüzey sistemi (lavanta/pembe alt tonlar kaldırıldı) */
    --md-background: #ffffff;
    --md-surface: #ffffff;
    --md-surface-container-low: #f8f8f9;
    --md-surface-container: #f3f3f5;
    --md-surface-container-high: #ededf0;
    --md-surface-variant: #f1f1f3;

    --md-on-surface: #1c1b1f;
    --md-on-surface-variant: #49454f;
    --md-outline: #79747e;
    --md-outline-variant: #d7d5da;

    /* MD3 köşe yarıçapları */
    --md-radius-xs: 8px;
    --md-radius-sm: 12px;
    --md-radius-md: 16px;
    --md-radius-lg: 24px;
    --md-radius-xl: 28px;
    --md-radius-2xl: 36px;
    --md-radius-3xl: 48px;

    /* MD3 elevation (yumuşak, difüz) */
    --md-elev-1: 0 1px 2px rgba(28, 27, 31, 0.06), 0 1px 3px 1px rgba(28, 27, 31, 0.08);
    --md-elev-2: 0 1px 2px rgba(28, 27, 31, 0.06), 0 2px 6px 2px rgba(28, 27, 31, 0.10);
    --md-elev-3: 0 4px 8px 3px rgba(28, 27, 31, 0.10), 0 1px 3px rgba(28, 27, 31, 0.08);
    --md-elev-4: 0 8px 24px 6px rgba(16, 169, 155, 0.14), 0 2px 6px rgba(28, 27, 31, 0.10);

    /* MD3 imza easing — Emphasized Decelerate */
    --md-ease: cubic-bezier(0.2, 0, 0, 1);

    /* vc-refined değişkenlerini MD3'e yeniden eşle (bileşenler miras alsın) */
    --vc-canvas: var(--md-background);
    --vc-surface: var(--md-surface-container);
    --vc-surface-soft: var(--md-surface-container-low);
    --vc-ink: var(--md-on-surface);
    --vc-ink-secondary: var(--md-on-surface-variant);
    --vc-ink-muted: #6e6a75;
    --vc-line: var(--md-outline-variant);
    --vc-line-strong: var(--md-outline);
    --vc-blue: var(--md-primary);
    --vc-blue-hover: var(--md-primary-hover);
    --vc-accent: var(--md-primary);
    --vc-accent-deep: var(--md-primary-hover);
    --vc-accent-soft: var(--md-secondary-container);
    --vc-dark: #1c1b1f;
    --vc-shadow-sm: var(--md-elev-1);
    --vc-shadow-md: var(--md-elev-2);
    --vc-shadow-lg: var(--md-elev-3);
    --vc-ease: var(--md-ease);
    --color-accent: var(--md-primary);
}

/* =========================================================
   2. TEMEL TİPOGRAFİ — Roboto
   ========================================================= */
body.luxury-theme.vc-refined {
    font-family: var(--font-body);
    letter-spacing: 0;
    background: var(--md-background);
    color: var(--md-on-surface);
    -webkit-font-smoothing: antialiased;
}

.vc-refined .wd-slide-title,
.vc-section-heading h2,
.vc-refined .wd-section-title,
.vc-newsletter-inner h2,
.vc-promo-title,
.vc-category-name,
.vc-refined .luxury-footer-logo,
.vc-refined .wd-logo-text {
    font-family: var(--font-display);
    font-weight: 700;
    letter-spacing: -0.01em;
}

/* =========================================================
   3. HEADER — tonal yüzey + state-layer etkileşimleri
   ========================================================= */
.vc-refined .wd-topbar {
    background: var(--md-surface-container-high);
    color: var(--md-on-surface-variant);
    border-bottom: 1px solid var(--md-outline-variant);
}
.vc-refined .wd-topbar a { color: var(--md-on-surface-variant); }
.vc-refined .wd-topbar a:hover { color: var(--md-primary); }

.vc-header-shell { box-shadow: none; }

.vc-refined .wd-header {
    background: rgba(255, 251, 254, 0.82);
    border-bottom: 1px solid var(--md-outline-variant);
    -webkit-backdrop-filter: saturate(180%) blur(20px);
    backdrop-filter: saturate(180%) blur(20px);
}
.vc-refined .wd-logo-text { color: var(--md-on-surface); font-weight: 700; }

/* Arama — MD3 hap arama çubuğu */
.vc-refined .wd-search-bar input,
.vc-refined .wd-mobile-search input {
    background: var(--md-surface-variant);
    border: 1px solid transparent;
    border-radius: 9999px;
    font-family: var(--font-body);
    font-size: 15px;
    color: var(--md-on-surface);
}
.vc-refined .wd-search-bar input::placeholder { color: var(--md-on-surface-variant); }
.vc-refined .wd-search-bar input:focus,
.vc-refined .wd-mobile-search input:focus {
    background: var(--md-surface-container-low);
    border-color: var(--md-primary);
    box-shadow: 0 0 0 3px rgba(16, 169, 155, 0.16);
}
.vc-refined .wd-search-bar button { border-radius: 9999px; color: var(--md-on-surface-variant); }

/* İkonlar — dairesel state layer */
.vc-refined .wd-header-icon:hover,
.vc-refined .wd-mobile-menu-btn:hover,
.vc-refined .wd-mobile-overlay-close:hover {
    color: var(--md-primary);
    background: rgba(16, 169, 155, 0.10);
}
.vc-refined .wd-header-icon:active,
.vc-refined .wd-mobile-menu-btn:active { transform: scale(0.92); }
.vc-refined .wd-header-icon .wd-badge {
    background: var(--md-primary);
    color: var(--md-on-primary);
    border: 2px solid var(--md-background);
    font-weight: 500;
}

/* Kategori nav — state layer + hap */
.vc-refined .wd-catnav {
    background: rgba(255, 251, 254, 0.90);
    border-bottom: 1px solid var(--md-outline-variant);
}
.vc-refined .wd-catnav-link {
    font-family: var(--font-body);
    font-weight: 500;
    border-radius: 9999px;
}
.vc-refined .wd-catnav-link:hover {
    color: var(--md-primary);
    background: rgba(16, 169, 155, 0.10);
}
.vc-refined .wd-catnav-shipping {
    color: var(--md-on-secondary-container);
    background: var(--md-secondary-container);
    border: none;
    border-radius: 9999px;
    font-weight: 500;
}

/* =========================================================
   4. HERO — tonal örtü + organik blur şekilleri + hap CTA
   ========================================================= */
.vc-refined .wd-hero-section {
    position: relative;
    border-radius: var(--md-radius-3xl);
    background: var(--md-surface-container);
    box-shadow: none;
    isolation: isolate;
}
/* Organik blur şekilleri (CSS-only, DOM değişikliği yok) */
.vc-refined .wd-hero-section::before,
.vc-refined .wd-hero-section::after {
    content: "";
    position: absolute;
    z-index: 0;
    border-radius: 9999px;
    filter: blur(64px);
    pointer-events: none;
}
.vc-refined .wd-hero-section::before {
    width: 42%;
    height: 70%;
    top: -12%;
    right: -8%;
    background: radial-gradient(circle, rgba(16, 169, 155, 0.28), transparent 70%);
}
.vc-refined .wd-hero-section::after {
    width: 38%;
    height: 60%;
    bottom: -14%;
    left: -6%;
    background: radial-gradient(circle, rgba(224, 80, 91, 0.22), transparent 70%);
}
.vc-refined .wd-slide { z-index: 1; }
.vc-refined .wd-slide-overlay {
    background: linear-gradient(90deg,
        rgba(255, 251, 254, 0.92) 0%,
        rgba(255, 251, 254, 0.68) 32%,
        rgba(255, 251, 254, 0.10) 66%,
        rgba(255, 251, 254, 0) 100%);
}
.vc-refined .wd-slide-title { color: var(--md-on-surface); letter-spacing: -0.02em; }
.vc-refined .wd-slide-category-icon {
    color: var(--md-primary);
    background: var(--md-primary-container);
    border: none;
}
.vc-refined .wd-slide-category-text { color: var(--md-on-surface-variant); }

/* Hap butonlar + state layer + tactile press */
.vc-refined .wd-slide-btn {
    background: var(--md-primary);
    color: var(--md-on-primary);
    border: none;
    border-radius: 9999px;
    font-family: var(--font-body);
    font-weight: 500;
    letter-spacing: 0.01em;
    box-shadow: none;
    transition: background 300ms var(--md-ease), box-shadow 300ms var(--md-ease), transform 200ms var(--md-ease);
}
.vc-refined .wd-slide-btn:hover {
    background: var(--md-primary-hover);
    box-shadow: var(--md-elev-2);
    transform: none;
}
.vc-refined .wd-slide-btn:active { transform: scale(0.95); }
.vc-refined .wd-slide-btn-secondary,
.vc-refined .wd-slide-btn[style] {
    color: var(--md-primary) !important;
    background: rgba(255, 251, 254, 0.7) !important;
    border: 1px solid var(--md-outline) !important;
}
.vc-refined .wd-slider-arrow {
    background: rgba(255, 251, 254, 0.86);
    border: none;
    box-shadow: var(--md-elev-1);
}
.vc-refined .wd-slider-arrow:hover { color: var(--md-primary); background: #fff; }
.vc-refined .wd-slider-dot.active { background: var(--md-primary); }

/* =========================================================
   5. BÖLÜM BAŞLIKLARI — primary eyebrow (MD3 chip hissi)
   ========================================================= */
.vc-eyebrow,
.vc-refined .wd-section-subtitle {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 6px 14px;
    color: var(--md-on-secondary-container);
    background: var(--md-secondary-container);
    border-radius: 9999px;
    font-family: var(--font-body);
    font-size: 12px;
    font-weight: 500;
    letter-spacing: 0.03em;
    text-transform: uppercase;
}
.vc-eyebrow::before,
.vc-refined .wd-section-subtitle::before { display: none; }

.vc-section-heading h2,
.vc-refined .wd-section-title {
    font-family: var(--font-display);
    font-size: clamp(30px, 3.6vw, 46px);
    font-weight: 700;
    line-height: 1.15;
    letter-spacing: -0.015em;
    color: var(--md-on-surface);
    margin-top: 14px;
}
.vc-section-heading p { color: var(--md-on-surface-variant); font-size: 16px; }

/* "Tüm ürünler →" — text button state layer */
.vc-section-link {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 8px 16px;
    color: var(--md-primary);
    border-radius: 9999px;
    font-weight: 500;
    transition: background 200ms var(--md-ease), color 200ms var(--md-ease);
}
.vc-section-link:hover { color: var(--md-primary); background: rgba(16, 169, 155, 0.10); }
.vc-section-link:active { transform: scale(0.97); }
.vc-section-link svg { transition: transform 250ms var(--md-ease); }
.vc-section-link:hover svg { transform: translateX(3px); }

/* =========================================================
   6. KATEGORİ KARTLARI — tonal, 24px, scale + elevation
   ========================================================= */
.vc-category-card {
    padding: 10px 10px 18px;
    background: var(--md-surface-container);
    border: none;
    border-radius: var(--md-radius-lg);
    box-shadow: var(--md-elev-1);
    transition: transform 300ms var(--md-ease), box-shadow 300ms var(--md-ease), background 300ms var(--md-ease);
}
.vc-category-card:hover {
    transform: translateY(-4px) scale(1.02);
    box-shadow: var(--md-elev-3);
    background: var(--md-surface-container-high);
}
.vc-category-card:active { transform: scale(0.98); }
.vc-category-image { border-radius: var(--md-radius-md); background: var(--md-surface-variant); }
.vc-category-name { font-family: var(--font-display); font-size: 15px; font-weight: 500; color: var(--md-on-surface); letter-spacing: -0.01em; }
.vc-category-count { color: var(--md-on-surface-variant); font-size: 13px; }

/* =========================================================
   7. TAB'LAR — MD3 chip (secondary container / primary active)
   ========================================================= */
.vc-refined .wd-tab {
    background: transparent;
    border: 1px solid var(--md-outline-variant);
    border-radius: 9999px;
    color: var(--md-on-surface-variant);
    font-family: var(--font-body);
    font-weight: 500;
    transition: background 200ms var(--md-ease), color 200ms var(--md-ease), border-color 200ms var(--md-ease);
}
.vc-refined .wd-tab:hover {
    background: rgba(16, 169, 155, 0.08);
    border-color: var(--md-outline-variant);
    color: var(--md-on-surface);
}
.vc-refined .wd-tab.active {
    background: var(--md-secondary-container);
    border-color: var(--md-secondary-container);
    color: var(--md-on-secondary-container);
}
.vc-refined .wd-tab:active { transform: scale(0.96); }

/* =========================================================
   8. ÜRÜN KARTLARI — tonal, micro-interactions
   ========================================================= */
.vc-refined .wd-product-card {
    padding: 8px 8px 16px;
    background: var(--md-surface-container);
    border: none;
    border-radius: var(--md-radius-lg);
    box-shadow: var(--md-elev-1);
    transition: transform 300ms var(--md-ease), box-shadow 300ms var(--md-ease), background 300ms var(--md-ease);
}
.vc-refined .wd-product-card:hover {
    transform: translateY(-4px) scale(1.02);
    box-shadow: var(--md-elev-3);
    background: var(--md-surface-container-high);
}
.vc-refined .wd-product-card .wd-product-img {
    border-radius: var(--md-radius-md);
    background: var(--md-surface-variant);
}
.vc-refined .wd-product-card:hover .wd-product-img img { transform: scale(1.06); }

/* Sale badge — tertiary container (MD3 renkli chip) */
.vc-refined .wd-sale-badge {
    background: var(--md-tertiary);
    color: var(--md-on-tertiary);
    border-radius: 9999px;
    font-weight: 500;
    box-shadow: none;
}
/* Wishlist — dairesel state layer */
.vc-refined .wd-wishlist-btn {
    background: rgba(255, 251, 254, 0.9);
    border: none;
    box-shadow: var(--md-elev-1);
    color: var(--md-on-surface-variant);
}
.vc-refined .wd-wishlist-btn:hover { color: var(--md-error); background: #fff; transform: scale(1.06); }
/* Sepete ekle — filled primary hap buton */
.vc-refined .wd-add-cart-btn {
    background: var(--md-primary);
    color: var(--md-on-primary);
    border: none;
    border-radius: 9999px;
    font-family: var(--font-body);
    font-weight: 500;
    letter-spacing: 0.01em;
    transition: background 250ms var(--md-ease), transform 150ms var(--md-ease);
}
.vc-refined .wd-add-cart-btn:hover { background: var(--md-primary-hover); }
.vc-refined .wd-add-cart-btn:active { transform: scale(0.95); }

/* Kart metin hiyerarşisi (Roboto) */
.vc-refined .wd-product-card a > div:last-child > div:first-child {
    color: var(--md-on-surface-variant) !important;
    font-size: 11px !important;
    font-weight: 500 !important;
    letter-spacing: 0.05em !important;
}
.vc-refined .wd-product-card a > div:last-child > div:nth-child(2) {
    font-family: var(--font-body) !important;
    color: var(--md-on-surface) !important;
    font-size: 14.5px !important;
    font-weight: 500 !important;
}
.vc-refined .wd-product-card a > div:last-child > div:last-child span:first-child {
    font-family: var(--font-display) !important;
    color: var(--md-on-surface) !important;
    font-size: 16px !important;
    font-weight: 700 !important;
    letter-spacing: -0.01em;
}

/* =========================================================
   9. PROMO KARTLARI — büyük radius, elevation
   ========================================================= */
.vc-promo-card {
    border-radius: var(--md-radius-2xl);
    box-shadow: var(--md-elev-1);
    transition: transform 300ms var(--md-ease), box-shadow 300ms var(--md-ease);
}
.vc-promo-card:hover { transform: translateY(-4px); box-shadow: var(--md-elev-4); }
.vc-promo-eyebrow {
    display: inline-block;
    padding: 5px 12px;
    background: rgba(255, 255, 255, 0.18);
    border-radius: 9999px;
    -webkit-backdrop-filter: blur(6px);
    backdrop-filter: blur(6px);
    color: #fff;
}
.vc-promo-eyebrow::before { display: none; }
.vc-promo-title { font-family: var(--font-display); letter-spacing: -0.015em; }

/* =========================================================
   10. TRUST — glass-morphism kartlar + secondary container ikon
   ========================================================= */
.vc-trust-section {
    background: var(--md-surface-container-low);
    border-block: none;
}
.vc-trust-grid > div {
    background: var(--md-surface);
    border: 1px solid var(--md-outline-variant);
    border-radius: var(--md-radius-lg);
    transition: transform 300ms var(--md-ease), box-shadow 300ms var(--md-ease);
}
.vc-trust-grid > div:hover { transform: translateY(-3px); box-shadow: var(--md-elev-2); }
.vc-trust-grid > div > div:first-child {
    background: var(--md-secondary-container) !important;
    border-radius: var(--md-radius-md) !important;
}
.vc-trust-grid > div > div:first-child svg { color: var(--md-primary) !important; }
.vc-trust-grid > div > div:last-child > div:first-child {
    font-family: var(--font-display) !important;
    font-weight: 500 !important;
    color: var(--md-on-surface) !important;
}

/* =========================================================
   11. NEWSLETTER — MD3 renkli CTA bloğu (primary) + blur şekiller
   ========================================================= */
.vc-newsletter-section {
    position: relative;
    overflow: hidden;
    background: var(--md-primary);
}
.vc-newsletter-section::before,
.vc-newsletter-section::after {
    content: "";
    position: absolute;
    z-index: 0;
    border-radius: 9999px;
    filter: blur(72px);
    pointer-events: none;
}
.vc-newsletter-section::before {
    width: 46%; height: 120%;
    top: -30%; left: -10%;
    background: radial-gradient(circle, rgba(203, 238, 233, 0.30), transparent 70%);
}
.vc-newsletter-section::after {
    width: 42%; height: 120%;
    bottom: -30%; right: -8%;
    background: radial-gradient(circle, rgba(224, 80, 91, 0.40), transparent 70%);
}
.vc-newsletter-inner { position: relative; z-index: 1; }
.vc-newsletter-eyebrow {
    display: inline-block;
    padding: 6px 14px;
    background: rgba(255, 255, 255, 0.16);
    border-radius: 9999px;
    color: #fff;
    -webkit-backdrop-filter: blur(6px);
    backdrop-filter: blur(6px);
}
.vc-newsletter-eyebrow::before { display: none; }
.vc-newsletter-inner h2 { font-family: var(--font-display); color: #fff; letter-spacing: -0.015em; }
.vc-newsletter-inner p { color: rgba(255, 255, 255, 0.86); }
.vc-newsletter-form {
    background: rgba(255, 255, 255, 0.14);
    border: 1px solid rgba(255, 255, 255, 0.24);
    border-radius: 9999px;
    -webkit-backdrop-filter: blur(12px);
    backdrop-filter: blur(12px);
}
.vc-refined .vc-newsletter-form input { color: #fff; border-radius: 9999px; }
.vc-refined .vc-newsletter-form input::placeholder { color: rgba(255, 255, 255, 0.72); }
.vc-newsletter-form button {
    background: #fff;
    color: var(--md-primary);
    border-radius: 9999px;
    font-family: var(--font-body);
    font-weight: 500;
    transition: background 200ms var(--md-ease), transform 150ms var(--md-ease);
}
.vc-newsletter-form button:hover { background: var(--md-primary-container); color: var(--md-on-primary-container); }
.vc-newsletter-form button:active { transform: scale(0.96); }

/* =========================================================
   12. FOOTER
   ========================================================= */
.vc-refined .luxury-footer { background: var(--md-surface-container-low); border-top: 1px solid var(--md-outline-variant); }
.vc-refined .luxury-footer-logo { color: var(--md-on-surface); }
.vc-refined .luxury-footer-column h4 { font-family: var(--font-body); color: var(--md-on-surface); letter-spacing: 0.06em; }
.vc-refined .luxury-footer-column a:hover { color: var(--md-primary); }
.vc-refined .luxury-scroll-top {
    background: var(--md-primary);
    color: var(--md-on-primary);
    border: none;
    border-radius: 9999px;
    box-shadow: var(--md-elev-2);
}
.vc-refined .luxury-scroll-top:hover { background: var(--md-primary-hover); color: #fff; box-shadow: var(--md-elev-3); }

/* =========================================================
   13. GLOBAL: odak, seçim, inputlar (MD3 filled text field)
   ========================================================= */
.vc-refined :focus-visible {
    outline: 2px solid var(--md-primary) !important;
    outline-offset: 2px !important;
}
.vc-refined ::selection { background: var(--md-primary); color: #fff; }

/* Genel form inputları — MD3 filled text field (üst yuvarlak, alt çizgi) */
.vc-refined input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not(.wd-search-bar input):not(.vc-newsletter-form input),
.vc-refined select,
.vc-refined textarea {
    background: #fff;
    border: 1px solid var(--md-outline-variant);
    border-radius: 12px;
    transition: border-color 200ms var(--md-ease), box-shadow 200ms var(--md-ease);
}
.vc-refined input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not(.wd-search-bar input):not(.vc-newsletter-form input):focus,
.vc-refined select:focus,
.vc-refined textarea:focus {
    border-color: var(--md-primary) !important;
    box-shadow: 0 0 0 3px rgba(16, 169, 155, 0.14) !important;
    background: #fff;
}

/* Genel Tailwind-classlı butonları hap yap (mağaza tarafı) */
.vc-refined button[class*="rounded"],
.vc-refined a[class*="rounded-lg"],
.vc-refined a[class*="rounded-xl"] {
    transition: transform 150ms var(--md-ease), background 250ms var(--md-ease), box-shadow 250ms var(--md-ease);
}
.vc-refined button[class*="rounded"]:active { transform: scale(0.96); }

/* =========================================================
   14. GİRİŞ ANİMASYONLARI — scroll-timeline (progressive)
   ========================================================= */
@media (prefers-reduced-motion: no-preference) {
    @supports (animation-timeline: view()) {
        .vc-home-section,
        .vc-trust-section {
            animation: vc-rise-in linear both;
            animation-timeline: view();
            animation-range: entry 0% cover 22%;
        }
        .vc-category-card,
        .vc-refined .wd-product-card,
        .vc-promo-card {
            animation: vc-rise-in linear both;
            animation-timeline: view();
            animation-range: entry 5% cover 18%;
        }
    }
    @keyframes vc-rise-in {
        from { opacity: 0; transform: translateY(24px); }
        to   { opacity: 1; transform: translateY(0); }
    }
    .vc-refined .wd-hero-section { animation: vc-hero-in 700ms var(--md-ease) both; }
    @keyframes vc-hero-in {
        from { opacity: 0; transform: translateY(12px); }
        to   { opacity: 1; transform: translateY(0); }
    }
}

@media (prefers-reduced-motion: reduce) {
    .vc-refined *,
    .vc-refined *::before,
    .vc-refined *::after {
        animation-duration: 0.01ms !important;
        transition-duration: 0.01ms !important;
    }
}

/* =========================================================
   15. RESPONSIVE İNCE AYARLAR
   ========================================================= */
@media (max-width: 767px) {
    .vc-refined .wd-hero-section { border-radius: var(--md-radius-xl); }
    .vc-section-heading h2,
    .vc-refined .wd-section-title { font-size: 30px; }
    .vc-newsletter-inner h2 { font-size: clamp(30px, 8vw, 40px); }
}