/* =============================================
   WACAR V2 — Pixel-perfect desde Figma
   ============================================= */

:root {
    --navy:              #00478A;
    --teal:              #00A09A;
    --text-primary:      #002C55;
    --text-dark:         #0A0A0A;
    --text-body:         #4A5565;
    --text-muted:        #838383;
    --text-footer:       #333333;
    --text-links:        #666666;
    --card-border:       #CCE6FF;
    --faq-bg:            #EAF5FF;
    --white:             #FFFFFF;

    --gradient-dark:
        linear-gradient(135deg,
            #001F3F 0%, #002347 7%, #00274F 14%, #002B57 21%,
            #003060 29%, #003468 36%, #003971 43%, #003D7A 50%,
            #003971 57%, #003468 64%, #003060 71%, #002B57 79%,
            #00274F 86%, #002347 93%, #001F3F 100%);

    --gradient-nav-btn:  linear-gradient(90deg, #00478A 13%, #00A09A 88%);

    --gradient-cta-btn:
        linear-gradient(135deg,
            #00C9B8 0%, #00CBB2 7%, #00CEAC 14%, #00D0A6 21%,
            #00D2A0 29%, #00D59A 36%, #00D793 43%, #00D98C 50%,
            #00D793 57%, #00D59A 64%, #00D2A0 71%, #00D0A6 79%,
            #00CEAC 86%, #00CBB2 93%, #00C9B8 100%);

    --gradient-icon:
        linear-gradient(135deg,
            #00478A 0%, #004E8C 7%, #00548D 14%, #005B8F 21%,
            #006190 29%, #006791 36%, #006E93 43%, #007494 50%,
            #007A95 57%, #008196 64%, #008797 71%, #008D98 79%,
            #009399 86%, #009A99 93%, #00A09A 100%);

    --gradient-service-overlay: linear-gradient(180deg, rgba(0,71,138,0) 41%, #00478A 100%);
    --gradient-section-fade:    linear-gradient(180deg, #fff 0%, rgba(234,245,255,.80) 50%, #fff 100%);

    --card-shadow: 0px 4px 6px -4px rgba(0,0,0,.10), 0px 10px 15px -3px rgba(0,0,0,.10);
}

*, *::before, *::after { box-sizing: border-box; }

body {
    font-family: 'Be Vietnam Pro', 'Roboto', sans-serif;
    color: var(--text-body);
    background: var(--white);
    margin: 0;
    padding: 0;
    overflow-x: hidden;
}

img { max-width: 100%; height: auto; }
a  { text-decoration: none; }

/* ============================================
   NAVBAR
   ============================================ */
.v2-navbar {
    background: white;
    box-shadow: 0 4px 4px rgba(88,88,88,.20);
    height: 90px;
    position: fixed;
    top: 0; left: 0; right: 0;
    z-index: 1000;
    padding: 0;
}

.v2-navbar .container {
    height: 100%;
    display: flex;
    align-items: center;
}

.v2-navbar .navbar-brand img { height: 44px; }

.v2-navbar .nav-link {
    font-family: 'Be Vietnam Pro', sans-serif;
    font-size: 16px;
    font-weight: 400;
    line-height: 24px;
    color: #4A5565 !important;
    padding: .5rem 1rem !important;
    transition: color .2s;
}
.v2-navbar .nav-link:hover { color: var(--navy) !important; }

.v2-btn-nav,
.v2-navbar .v2-btn-nav {
    background: var(--gradient-nav-btn) !important;
    color: white !important;
    font-family: 'Be Vietnam Pro', sans-serif;
    font-size: 18px;
    font-weight: 600;
    line-height: 28px;
    padding: .5rem 1.5rem !important;
    border-radius: 30px;
    white-space: nowrap;
    transition: opacity .2s;
    margin-left: .5rem;
}
.v2-btn-nav:hover,
.v2-navbar .v2-btn-nav:hover { opacity: .9; color: white !important; }

/* Icon inside CTA buttons */
.v2-btn-icon {
    width: 18px;
    height: 18px;
    object-fit: contain;
    display: inline-block;
    vertical-align: middle;
    margin-right: 6px;
    flex-shrink: 0;
}

/* ============================================
   HERO
   ============================================ */
.v2-hero {
    padding: 140px 0 80px;
    background: white;
    position: relative;
    overflow: hidden;
}

/* Subtle blue gradient overlay */
.v2-hero::before {
    content: '';
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, rgba(255,255,255,.35) 0%, rgba(204,230,255,.35) 100%);
    pointer-events: none;
}

/* Teal glow orbs */
.v2-hero-glow {
    position: absolute;
    border-radius: 50%;
    filter: blur(64px);
    pointer-events: none;
}
.v2-hero-glow-1 {
    width: 256px; height: 256px;
    right: 100px; top: 80px;
    background: rgba(0,201,184,.20);
}
.v2-hero-glow-2 {
    width: 384px; height: 384px;
    left: 40px; top: 220px;
    background: rgba(0,160,154,.10);
}

.v2-hero-content { position: relative; z-index: 1; }

.v2-hero h1 {
    color: var(--text-primary);
    font-family: 'Be Vietnam Pro', sans-serif;
    font-size: clamp(26px, 0.33rem + 5.5vw, 60px);
    font-weight: 700;
    line-height: 1.25;
    margin-bottom: 1.5rem;
}

.v2-hero-desc {
    color: #000;
    font-family: 'Be Vietnam Pro', sans-serif;
    font-size: clamp(15px, 0.75rem + 0.8vw, 20px);
    font-weight: 300;
    line-height: 1.4;
    max-width: 533px;
    margin-bottom: 1.5rem;
}

.v2-hero-label {
    color: var(--text-primary);
    font-family: 'Be Vietnam Pro', sans-serif;
    font-size: 20px;
    font-weight: 600;
    line-height: 28px;
    margin-bottom: 1rem;
}

/* App store badges — compensate SVG's internal shadow padding (10.5px left) */
.v2-store-badges { display: flex; gap: 6px; flex-wrap: wrap; margin-top: 8px; align-items: center; margin-left: -10px; }

.v2-store-badges a { display: inline-block; transition: opacity .2s; }
.v2-store-badges a:hover { opacity: .85; }

.v2-store-badge-img { width: auto; display: block; }

.v2-hero-image {
    display: flex;
    justify-content: center;
    align-items: center;
}
.v2-hero-image img { max-height: 540px; object-fit: contain; }

/* ============================================
   SECTION SHARED
   ============================================ */
.v2-section-title {
    font-family: 'Be Vietnam Pro', sans-serif;
    font-size: clamp(24px, 0.6rem + 3.9vw, 48px);
    font-weight: 700;
    line-height: 1;
    color: var(--text-primary);
    margin-bottom: 16px;
}

.v2-section-subtitle {
    font-family: 'Be Vietnam Pro', sans-serif;
    font-size: 20px;
    font-weight: 400;
    line-height: 28px;
    color: var(--text-body);
    margin-bottom: 0;
}

/* ============================================
   4 PASOS
   ============================================ */
.v2-steps { padding: 80px 0; background: white; }

.v2-steps .v2-section-title {
    font-size: 45px;
    line-height: 40px;
    color: var(--text-primary);
}

.v2-steps-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 25px;
    margin-top: 40px;
}

.v2-step-card {
    position: relative;
    background: #EAF5FF;
    border-radius: 24px;
    outline: 1.18px #CCE6FF solid;
    padding: 33px 23px 24px;
    min-height: 266px;
    overflow: hidden;
}

.v2-step-top {
    display: flex;
    align-items: flex-start;
    margin-bottom: 15px;
}

.v2-step-icon {
    width: 56px; height: 56px;
    background: var(--gradient-icon);
    border-radius: 16px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    color: white;
    font-size: 1.25rem;
    box-shadow: var(--card-shadow);
}

.v2-step-icon img { width: 28px; height: 28px; object-fit: contain; display: block; }

.v2-step-number {
    font-family: 'Be Vietnam Pro', sans-serif;
    font-size: 60px;
    font-weight: 700;
    line-height: 40px;
    color: #CCE6FF;
    margin-left: 16px;
    padding-top: 8px;
    flex-shrink: 0;
}

.v2-step-card h4 {
    font-family: 'Be Vietnam Pro', sans-serif;
    font-size: 20px;
    font-weight: 500;
    color: var(--text-dark);
    margin-bottom: 8px;
    line-height: 1.3;
}

.v2-step-card p {
    font-family: 'Be Vietnam Pro', sans-serif;
    font-size: 16px;
    font-weight: 400;
    color: var(--text-body);
    line-height: 1.5;
    margin: 0;
}

/* ============================================
   ¿POR QUÉ WACAR?
   ============================================ */
.v2-why {
    background: var(--gradient-dark);
    padding: 80px 0;
}

.v2-why .v2-section-title { color: white; }
.v2-why .v2-section-subtitle { color: #FCFCFC; }

.v2-why-card {
    background: white;
    box-shadow: var(--card-shadow);
    border-radius: 24px;
    outline: 0.8px var(--card-border) solid;
    padding: 32px;
    height: 100%;
}

.v2-why-card-icon {
    width: 64px; height: 64px;
    background: var(--gradient-icon);
    border-radius: 16px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 24px;
    box-shadow: var(--card-shadow);
    color: white;
    font-size: 1.5rem;
}

.v2-why-card-icon img { width: 32px; height: 32px; object-fit: contain; display: block; }

.v2-why-card h3 {
    font-family: 'Be Vietnam Pro', sans-serif;
    font-size: 24px;
    font-weight: 500;
    line-height: 32px;
    color: var(--text-dark);
    margin-bottom: 12px;
}

.v2-why-card p {
    font-family: 'Be Vietnam Pro', sans-serif;
    font-size: 16px;
    font-weight: 400;
    line-height: 26px;
    color: var(--text-body);
    margin: 0;
}

/* ============================================
   SERVICIOS
   ============================================ */
.v2-services { padding: 80px 0; background: white; }

.v2-services .v2-section-title { color: var(--text-primary); }
.v2-services .v2-section-subtitle { color: var(--text-muted); }

.v2-services-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 20px;
}

.v2-service-card {
    position: relative;
    border-radius: 15px;
    overflow: hidden;
    height: 250px;
    cursor: pointer;
}

.v2-service-card img {
    width: 100%; height: 100%;
    object-fit: cover;
    transition: transform .35s ease;
}
.v2-service-card:hover img { transform: scale(1.05); }

.v2-service-overlay {
    position: absolute;
    inset: 0;
    background: var(--gradient-service-overlay);
}

.v2-service-label {
    position: absolute;
    bottom: 16px; left: 16px;
    color: white;
    font-family: 'Be Vietnam Pro', sans-serif;
    font-size: 20px;
    font-weight: 700;
    line-height: 1.2;
}

/* ============================================
   OPINIONES
   ============================================ */
.v2-testimonials {
    padding: 80px 0;
    background: var(--gradient-section-fade);
}

.v2-testimonials .v2-section-title { color: var(--text-dark); }
.v2-testimonials .v2-section-subtitle { color: var(--text-body); }

.v2-testimonial-card {
    background: white;
    box-shadow: var(--card-shadow);
    border-radius: 24px;
    outline: 0.8px var(--card-border) solid;
    padding: 32px;
    height: 100%;
    display: flex;
    flex-direction: column;
}

.v2-testimonial-name {
    font-family: 'Be Vietnam Pro', sans-serif;
    font-size: 16px;
    font-weight: 500;
    line-height: 24px;
    color: var(--text-dark);
    margin-bottom: 4px;
}

.v2-stars {
    display: flex;
    gap: 4px;
    margin-bottom: 16px;
    color: var(--teal);
    font-size: 15px;
    line-height: 16px;
}

.v2-testimonial-text {
    font-family: 'Be Vietnam Pro', sans-serif;
    font-size: 16px;
    font-weight: 400;
    line-height: 26px;
    color: var(--text-body);
    flex: 1;
    margin: 0;
}

.v2-testimonial-footer {
    border-top: 0.8px var(--card-border) solid;
    margin-top: 20px;
    padding-top: 19px;
}

.v2-testimonial-service {
    font-family: 'Be Vietnam Pro', sans-serif;
    font-size: 14px;
    font-weight: 300;
    line-height: 20px;
    color: var(--text-muted);
}

/* ============================================
   CTA CENTRAL
   ============================================ */
.v2-cta {
    background: var(--gradient-dark);
    padding: 40px 0;
    overflow: visible;
    position: relative;
}

.v2-cta .row { align-items: center; }

.v2-cta-text {
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 20px;
}

.v2-cta-text h2 {
    color: white;
    font-family: 'Be Vietnam Pro', sans-serif;
    font-size: clamp(26px, 0.33rem + 5.5vw, 60px);
    font-weight: 700;
    line-height: 1.1;
    margin: 0;
}

.v2-cta-text p {
    font-family: 'Be Vietnam Pro', sans-serif;
    font-size: 20px;
    font-weight: 400;
    line-height: 32.5px;
    color: rgba(255,255,255,.90);
    max-width: 520px;
    margin: 0;
}

.v2-btn-cta {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    background: var(--gradient-nav-btn);
    color: white !important;
    font-family: 'Be Vietnam Pro', sans-serif;
    font-size: 18px;
    font-weight: 600;
    line-height: 28px;
    padding: 8px 36px;
    border-radius: 30px;
    border: none;
    cursor: pointer;
    transition: opacity .2s;
    align-self: center;
    text-decoration: none;
    height: 45px;
}
.v2-btn-cta:hover { opacity: .9; color: white !important; }

.v2-cta-image {
    display: flex;
    justify-content: center;
    align-items: center;
    margin-top: -80px;
    margin-bottom: -80px;
}
.v2-cta-image img {
    max-height: 600px;
    object-fit: contain;
}

/* ============================================
   ¿ERES PROFESIONAL?
   ============================================ */
.v2-pro {
    padding: 96px 0;
    text-align: center;
    background: var(--gradient-section-fade);
}

.v2-pro .v2-section-title { color: var(--text-dark); }

.v2-pro p {
    font-family: 'Be Vietnam Pro', sans-serif;
    font-size: 20px;
    font-weight: 400;
    line-height: 28px;
    color: var(--text-body);
    max-width: 672px;
    margin: 16px auto 40px;
}

.v2-btn-pro {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 16px 32px;
    background: var(--navy);
    color: white !important;
    font-family: 'Be Vietnam Pro', sans-serif;
    font-size: 16px;
    font-weight: 500;
    line-height: 24px;
    border-radius: 9999px;
    transition: opacity .2s;
    text-decoration: none;
}
.v2-btn-pro:hover { opacity: .85; color: white !important; }

/* ============================================
   FAQ
   ============================================ */
.v2-faq { padding: 96px 0; background: white; }

.v2-faq .v2-section-title { color: var(--text-dark); }
.v2-faq .v2-section-subtitle { color: var(--text-body); }

.v2-faq .accordion-item {
    background: var(--faq-bg);
    border-radius: 16px !important;
    margin-bottom: 16px;
    overflow: hidden;
    border: 0.8px var(--card-border) solid;
}

.v2-faq .accordion-button {
    font-family: 'Be Vietnam Pro', sans-serif;
    font-size: 18px;
    font-weight: 500;
    line-height: 24px;
    color: var(--text-dark);
    background: var(--faq-bg);
    padding: 20px 24px;
    box-shadow: none;
}
.v2-faq .accordion-button:not(.collapsed) {
    color: var(--navy);
    background: var(--faq-bg);
    box-shadow: none;
}

.v2-faq .accordion-button::after {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6' viewBox='0 0 10 6'%3E%3Cpath d='M1 1l4 4 4-4' stroke='%2300478A' stroke-width='1.67' fill='none' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
    background-size: 10px 6px;
    background-repeat: no-repeat;
    background-position: center;
    width: 20px; height: 20px;
}
.v2-faq .accordion-button:not(.collapsed)::after { transform: rotate(180deg); }

.v2-faq .accordion-body {
    font-family: 'Be Vietnam Pro', sans-serif;
    font-size: 16px;
    font-weight: 400;
    line-height: 26px;
    color: var(--text-body);
    padding: 0 24px 20px;
    background: var(--faq-bg);
}

/* ============================================
   FOOTER (fondo blanco)
   ============================================ */
.v2-footer {
    background: white;
    padding: 50px 0 0;
}

.v2-footer-logo img { height: 62px; }

.v2-footer-desc {
    font-family: 'Roboto', sans-serif;
    font-size: 16.8px;
    font-weight: 300;
    line-height: 27.72px;
    color: var(--text-footer);
    max-width: 540px;
    margin-top: 10px;
}

.v2-footer-social {
    display: flex;
    gap: 13px;
    margin-top: 16px;
    padding-bottom: 25px;
}
.v2-footer-social a {
    color: var(--text-footer);
    font-size: 16px;
    transition: color .2s;
}
.v2-footer-social a:hover { color: var(--navy); }

.v2-footer-logos-row {
    padding: 20px 0;
    border-top: 1px #DDDDDD solid;
}
.v2-footer-logos-row img { max-width: 100%; height: auto; }

.v2-footer-bottom {
    border-top: 1px #DDDDDD solid;
    padding: 16px 0 20px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: .75rem;
}

.v2-footer-bottom .copyright {
    font-family: 'Roboto', sans-serif;
    font-size: 15.2px;
    font-weight: 300;
    line-height: 22.8px;
    color: var(--text-footer);
}
.v2-footer-bottom .copyright strong {
    font-weight: 500;
}

.v2-footer-links {
    display: flex;
    gap: 26px;
    flex-wrap: wrap;
    justify-content: flex-end;
}
.v2-footer-links a {
    font-family: 'Roboto', sans-serif;
    font-size: 15.2px;
    font-weight: 300;
    line-height: 22.8px;
    color: #666666;
    transition: color .2s;
}
.v2-footer-links a:hover { color: var(--navy); }

/* ============================================
   CARRUSEL (sólo móvil — oculto en desktop)
   ============================================ */
.v2-carousel-dots { display: none; }

.v2-carousel-dot {
    width: 8px; height: 8px;
    border-radius: 50%;
    border: none;
    padding: 0;
    background: var(--card-border);
    cursor: pointer;
    transition: background .2s, width .2s;
}
.v2-carousel-dot.is-active {
    background: var(--navy);
    width: 22px;
    border-radius: 4px;
}

/* ============================================
   PROMO BANNER (se elimina junto al @if del blade cuando acabe la promo)
   ============================================ */
.v2-promo-banner {
    position: fixed;
    top: 0; left: 0; right: 0;
    z-index: 1001;
    min-height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 6px 20px;
    color: white;
    font-family: 'Be Vietnam Pro', sans-serif;
    font-size: 14px;
    font-weight: 500;
    text-align: center;
    line-height: 1.4;
}
/* --banner-h se mide con JS y se actualiza en resize; el fallback cubre el render inicial */
.has-promo-banner .v2-navbar { top: var(--banner-h, 40px); }
.has-promo-banner .v2-hero   { padding-top: calc(140px + var(--banner-h, 40px)); }

@media (max-width: 991.98px) {
    .has-promo-banner .v2-hero { padding-top: calc(100px + var(--banner-h, 40px)); }
}
@media (max-width: 767.98px) {
    .v2-promo-banner { font-size: 13px; padding: 8px 16px; }
    .has-promo-banner .v2-hero { padding-top: calc(88px + var(--banner-h, 40px)); }
}

/* ============================================
   STICKY CTA (sólo móvil — oculto en desktop)
   ============================================ */
.v2-sticky-cta-wrap { display: none; }

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

/* ── Tablet (≤ 991 px) ── */
@media (max-width: 991.98px) {

    /* Navbar — hamburguesa a la izquierda, logo centrado */
    .v2-navbar          { height: auto; min-height: 72px; }
    .v2-navbar .container {
        display: grid;
        grid-template-columns: 52px 1fr 52px;
        grid-template-rows: 72px auto;
        align-items: center;
        padding-top: 0; padding-bottom: 0;
    }
    .v2-navbar .navbar-toggler {
        grid-column: 1; grid-row: 1;
        justify-self: start;
        padding: .25rem .4rem;
        z-index: 2;
    }
    .v2-navbar .navbar-toggler:focus { box-shadow: none; }
    .v2-navbar .navbar-brand {
        grid-column: 2; grid-row: 1;
        text-align: center;
        margin: 0;
        padding-top: 0; padding-bottom: 0;
    }
    /* .v2-navbar .navbar-brand img { height: 38px; } */

    /* Menú colapsado */
    .v2-navbar .navbar-collapse {
        grid-column: 1 / -1; grid-row: 2;
        width: 100%;
        background: white;
        border-top: 1px solid var(--border);
        padding: .75rem 0 1rem;
        box-shadow: 0 6px 20px rgba(0,71,138,.10);
    }
    .v2-navbar .nav-link { padding: .6rem 1rem !important; }
    .v2-btn-nav {
        display: block !important;
        text-align: center;
        margin: .75rem 1rem 0 !important;
        width: calc(100% - 2rem);
    }

    /* Hero (tamaño de h1 = clamp fluido base) */
    .v2-hero        { padding: 100px 0 48px; }
    .v2-hero-image  { margin-top: 2rem; }
    /* .v2-hero-image img { max-height: 420px; } */
    .v2-store-badges { justify-content: center; margin-left: 0; }

    /* Secciones — padding general reducido */
    .v2-steps        { padding: 60px 0; }
    .v2-why          { padding: 60px 0; }
    .v2-services     { padding: 60px 0; }
    .v2-testimonials { padding: 60px 0; }
    .v2-pro          { padding: 60px 0; }
    .v2-faq          { padding: 60px 0; }

    /* 4 Pasos */
    .v2-steps-grid { grid-template-columns: repeat(2, 1fr); }

    /* Servicios */
    .v2-services-grid { grid-template-columns: repeat(2, 1fr); }

    /* CTA — desactiva el overflow del iPhone (tipografía = clamp base) */
    .v2-cta         { padding: 40px 0; overflow: hidden; }
    .v2-cta-text    { padding-bottom: 0; }
    .v2-cta-image   { margin-top: 2rem; margin-bottom: 0; }
    .v2-cta-image img { max-height: 400px; }
}

/* ── Móvil (≤ 767 px) ── */
@media (max-width: 767.98px) {

    /* Navbar */
    .v2-navbar          { min-height: 64px; }
    .v2-navbar .container { grid-template-rows: 64px auto; }
    /* .v2-navbar .navbar-brand img { height: 34px; } */

    /* Hero (h1 y desc = clamp fluido base) */
    .v2-hero        { padding: 88px 0 40px; }
    .v2-hero-image  { margin-top: 1.5rem; }
    /* .v2-hero-image img { max-height: 360px; } */

    /* Badges App Store + Google Play — uno al lado del otro, centrados */
    .v2-store-badges    { flex-wrap: nowrap; gap: 10px; justify-content: center; margin-left: 0; }
    /* .v2-store-badge-img { height: 46px; } */

    /* 4 Pasos — columna única */
    .v2-steps       { padding: 48px 0; }
    .v2-steps-grid  { grid-template-columns: 1fr; gap: 1rem; }
    .v2-step-card   { min-height: auto; padding: 22px 18px; }
    .v2-step-number { font-size: 52px; }
    .v2-steps .v2-section-title { font-size: 28px; line-height: 36px; }

    /* ¿Por qué Wacar? */
    .v2-why { padding: 48px 0; }
    .v2-why-card { padding: 24px; }

    /* ---- CARRUSEL móvil (servicios + opiniones) ---- */
    .v2-carousel-track {
        display: flex !important;
        flex-wrap: nowrap !important;
        overflow-x: auto;
        scroll-snap-type: x mandatory;
        scroll-padding-left: 2px;
        -webkit-overflow-scrolling: touch;
        gap: 14px;
        margin: 0 !important;
        padding: 4px 2px 8px;
        scrollbar-width: none;
    }
    .v2-carousel-track::-webkit-scrollbar { display: none; }
    .v2-carousel-track > * {
        flex: 0 0 85% !important;
        width: 85% !important;
        max-width: 85% !important;
        margin: 0 !important;
        padding: 0 !important;
        scroll-snap-align: start;
    }
    .v2-carousel-dots {
        display: flex;
        justify-content: center;
        align-items: center;
        gap: 8px;
        margin-top: 18px;
    }

    /* Servicios — carrusel */
    .v2-services { padding: 48px 0; }
    .v2-service-card  { height: 200px; }
    .v2-service-label { font-size: 16px; }

    /* Opiniones — carrusel */
    .v2-testimonials { padding: 48px 0; }
    .v2-testimonial-card { padding: 24px; }

    /* CTA — sin imagen de iPhone, botón en gradiente teal */
    .v2-cta         { padding: 48px 0; overflow: hidden; }
    .v2-cta-text    { gap: 16px; }
    .v2-cta-image   { display: none; }
    .v2-btn-cta {
        background: var(--gradient-cta-btn);
        color: white !important;
    }

    /* ¿Eres profesional? */
    .v2-pro { padding: 48px 0; }

    /* FAQ */
    .v2-faq { padding: 48px 0; }
    .v2-faq .accordion-button { font-size: 16px; padding: 16px 18px; }

    /* Footer */
    .v2-footer { padding: 36px 0 0; }
    .v2-footer-bottom { flex-direction: column; align-items: flex-start; gap: .4rem; }
    .v2-footer-links  { justify-content: flex-start; gap: 14px; flex-wrap: wrap; }

    /* Tipografía (tamaños = clamp base; holgura de interlineado en móvil) */
    .v2-section-title  { line-height: 1.15; }
    .v2-section-subtitle { font-size: 16px; }

    /* ---- Sticky CTA ---- */
    .v2-sticky-cta-wrap {
        display: block;
        position: fixed;
        left: 0; right: 0; bottom: 0;
        z-index: 1040;
        background: #001F3F;
        padding: 18px 16px 18px;
        transform: translateY(100%);
        opacity: 0;
        pointer-events: none;
        transition: transform .35s ease, opacity .35s ease;
    }
    .v2-sticky-cta-wrap.is-visible {
        transform: translateY(0);
        opacity: 1;
        pointer-events: auto;
    }
    .v2-sticky-cta {
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 8px;
        width: 100%;
        height: 52px;
        border-radius: 30px;
        background: var(--gradient-nav-btn);
        color: white !important;
        font-family: 'Be Vietnam Pro', sans-serif;
        font-size: 17px;
        font-weight: 600;
        text-decoration: none;
    }
    /* espacio para que el footer no quede tapado por la barra sticky */
    .v2-footer { padding-bottom: 96px; }
}

@media (prefers-reduced-motion: reduce) {
    .v2-sticky-cta-wrap { transition: none; }
}

/* ── Móvil pequeño (≤ 575 px) ── */
@media (max-width: 575.98px) {

    /* Hero (h1 y desc = clamp fluido base) */
    .v2-hero        { padding: 80px 0 32px; }
    /* .v2-hero-image img { max-height: 300px; } */

    /* Badges App Store + Google Play — siguen en fila, algo más pequeños */
    .v2-store-badges    { flex-wrap: nowrap; gap: 8px; justify-content: center; margin-left: 0; }
    /* .v2-store-badge-img { height: 42px; } */

    /* Servicios — carrusel, tarjeta algo más alta al ocupar más ancho */
    .v2-service-card  { height: 210px; }

    /* Tipografía */
    .v2-steps .v2-section-title { font-size: 24px; }

    /* CTA (tamaño h2 = clamp fluido base) */
    .v2-cta-image img  { max-height: 270px; }

    /* ¿Eres profesional? */
    .v2-pro p { font-size: 16px; }

    /* Footer */
    .v2-footer-desc { font-size: 15px; }
    .v2-footer-logos-row img { max-width: 100%; }
}
