html {
    line-height: 1.15;
    -webkit-text-size-adjust: 100%;
}
*,
:after,
:before {
    box-sizing: border-box;
}
body {
    margin: 0;
    /*font-family: -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Helvetica Neue, Arial, Noto Sans, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol, Noto Color Emoji;*/
    font-family: 'Roboto';
    font-size: 1rem;
    font-weight: 400;
    line-height: 1.5;
    color: #333;
    background-color: #fff;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}
h1,
h2,
h3,
h4,
h5,
h6 {
    margin-block-start: 0.5rem;
    margin-block-end: 1rem;
    font-family: inherit;
    font-weight: 500;
    line-height: 1.2;
    color: inherit;
}
h1 {
    font-size: 2.5rem;
}
h2 {
    font-size: 2rem;
}
h3 {
    font-size: 1.75rem;
}
h4 {
    font-size: 1.5rem;
}
h5 {
    font-size: 1.25rem;
}
h6 {
    font-size: 1rem;
}
p {
    margin-block-start: 0;
    margin-block-end: 0.9rem;
}
hr {
    box-sizing: content-box;
    height: 0;
    overflow: visible;
}
pre {
    font-family: monospace, monospace;
    font-size: 1em;
    white-space: pre-wrap;
}
a {
    background-color: transparent;
    text-decoration: none;
    color: #c36;
}
a:active,
a:hover {
    color: #336;
}
a:not([href]):not([tabindex]),
a:not([href]):not([tabindex]):focus,
a:not([href]):not([tabindex]):hover {
    color: inherit;
    text-decoration: none;
}
a:not([href]):not([tabindex]):focus {
    outline: 0;
}
abbr[title] {
    border-block-end: none;
    -webkit-text-decoration: underline dotted;
    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: -0.25em;
}
sup {
    top: -0.5em;
}
img {
    border-style: none;
    height: auto;
    max-width: 100%;
}
details {
    display: block;
}
summary {
    display: list-item;
}
figcaption {
    font-size: 16px;
    color: #333;
    line-height: 1.4;
    font-style: italic;
    font-weight: 400;
}
[hidden],
template {
    display: none;
}
@media print {
    *,
    :after,
    :before {
        background: transparent !important;
        color: #000 !important;
        box-shadow: none !important;
        text-shadow: none !important;
    }
    a,
    a:visited {
        text-decoration: underline;
    }
    a[href]:after {
        content: " (" attr(href) ")";
    }
    abbr[title]:after {
        content: " (" attr(title) ")";
    }
    a[href^="#"]:after,
    a[href^="javascript:"]:after {
        content: "";
    }
    pre {
        white-space: pre-wrap !important;
    }
    blockquote,
    pre {
        -moz-column-break-inside: avoid;
        break-inside: avoid;
        border: 1px solid #ccc;
    }
    thead {
        display: table-header-group;
    }
    img,
    tr {
        -moz-column-break-inside: avoid;
        break-inside: avoid;
    }
    h2,
    h3,
    p {
        orphans: 3;
        widows: 3;
    }
    h2,
    h3 {
        -moz-column-break-after: avoid;
        break-after: avoid;
    }
}
label {
    display: inline-block;
    line-height: 1;
    vertical-align: middle;
}
button,
input,
optgroup,
select,
textarea {
    font-family: inherit;
    font-size: 1rem;
    line-height: 1.5;
    margin: 0;
}
input[type="date"],
input[type="email"],
input[type="number"],
input[type="password"],
input[type="search"],
input[type="tel"],
input[type="text"],
input[type="url"],
select,
textarea {
    width: 100%;
    border: 1px solid #666;
    border-radius: 3px;
    padding: 0.5rem 1rem;
    transition: all 0.3s;
}
input[type="date"]:focus,
input[type="email"]:focus,
input[type="number"]:focus,
input[type="password"]:focus,
input[type="search"]:focus,
input[type="tel"]:focus,
input[type="text"]:focus,
input[type="url"]:focus,
select:focus,
textarea:focus {
    border-color: #333;
}
button,
input {
    overflow: visible;
}
button,
select {
    text-transform: none;
}
[type="button"],
[type="reset"],
[type="submit"],
button {
    width: auto;
    -webkit-appearance: button;
}
[type="button"],
[type="submit"],
button {
    display: inline-block;
    font-weight: 400;
    color: #c36;
    text-align: center;
    white-space: nowrap;
    -webkit-user-select: none;
    -moz-user-select: none;
    user-select: none;
    background-color: transparent;
    border: 1px solid #c36;
    padding: 0.5rem 1rem;
    font-size: 1rem;
    border-radius: 3px;
    transition: all 0.3s;
}
[type="button"]:focus:not(:focus-visible),
[type="submit"]:focus:not(:focus-visible),
button:focus:not(:focus-visible) {
    outline: none;
}
[type="button"]:focus,
[type="button"]:hover,
[type="submit"]:focus,
[type="submit"]:hover,
button:focus,
button:hover {
    color: #fff;
    background-color: #c36;
    text-decoration: none;
}
[type="button"]:not(:disabled),
[type="submit"]:not(:disabled),
button:not(:disabled) {
    cursor: pointer;
}
fieldset {
    padding: 0.35em 0.75em 0.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;
    resize: vertical;
}
[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;
}
select {
    display: block;
}
table {
    background-color: transparent;
    width: 100%;
    margin-block-end: 15px;
    font-size: 0.9em;
    border-spacing: 0;
    border-collapse: collapse;
}
table td,
table th {
    padding: 15px;
    line-height: 1.5;
    vertical-align: top;
    border: 1px solid hsla(0, 0%, 50.2%, 0.5019607843);
}
table th {
    font-weight: 700;
}
table tfoot th,
table thead th {
    font-size: 1em;
}
table caption + thead tr:first-child td,
table caption + thead tr:first-child th,
table colgroup + thead tr:first-child td,
table colgroup + thead tr:first-child th,
table thead:first-child tr:first-child td,
table thead:first-child tr:first-child th {
    border-block-start: 1px solid hsla(0, 0%, 50.2%, 0.5019607843);
}
table tbody > tr:nth-child(odd) > td,
table tbody > tr:nth-child(odd) > th {
    background-color: hsla(0, 0%, 50.2%, 0.0705882353);
}
table tbody tr:hover > td,
table tbody tr:hover > th {
    background-color: hsla(0, 0%, 50.2%, 0.1019607843);
}
table tbody + tbody {
    border-block-start: 2px solid hsla(0, 0%, 50.2%, 0.5019607843);
}
@media (max-width: 767px) {
    table table {
        font-size: 0.8em;
    }
    table table td,
    table table th {
        padding: 7px;
        line-height: 1.3;
    }
    table table th {
        font-weight: 400;
    }
}
dd,
dl,
dt,
li,
ol,
ul {
    margin-block-start: 0;
    margin-block-end: 0;
    border: 0;
    outline: 0;
    font-size: 100%;
    vertical-align: baseline;
    background: transparent;
}
.gt_switcher {
    width: 133px !important;
}
img:is([sizes="auto" i], [sizes^="auto," i]) {
    contain-intrinsic-size: 3000px 1500px;
}

img.wp-smiley,
img.emoji {
    display: inline !important;
    border: none !important;
    box-shadow: none !important;
    height: 1em !important;
    width: 1em !important;
    margin: 0 0.07em !important;
    vertical-align: -0.1em !important;
    background: none !important;
    padding: 0 !important;
}

.wp-block-button__link {
    color: #fff;
    background-color: #32373c;
    border-radius: 9999px;
    box-shadow: none;
    text-decoration: none;
    padding: calc(0.667em + 2px) calc(1.333em + 2px);
    font-size: 1.125em;
}
.wp-block-file__button {
    background: #32373c;
    color: #fff;
    text-decoration: none;
}

:root {
    --wp--preset--aspect-ratio--square: 1;
    --wp--preset--aspect-ratio--4-3: 4/3;
    --wp--preset--aspect-ratio--3-4: 3/4;
    --wp--preset--aspect-ratio--3-2: 3/2;
    --wp--preset--aspect-ratio--2-3: 2/3;
    --wp--preset--aspect-ratio--16-9: 16/9;
    --wp--preset--aspect-ratio--9-16: 9/16;
    --wp--preset--color--black: #000000;
    --wp--preset--color--cyan-bluish-gray: #abb8c3;
    --wp--preset--color--white: #ffffff;
    --wp--preset--color--pale-pink: #f78da7;
    --wp--preset--color--vivid-red: #cf2e2e;
    --wp--preset--color--luminous-vivid-orange: #ff6900;
    --wp--preset--color--luminous-vivid-amber: #fcb900;
    --wp--preset--color--light-green-cyan: #7bdcb5;
    --wp--preset--color--vivid-green-cyan: #00d084;
    --wp--preset--color--pale-cyan-blue: #8ed1fc;
    --wp--preset--color--vivid-cyan-blue: #0693e3;
    --wp--preset--color--vivid-purple: #9b51e0;
    --wp--preset--gradient--vivid-cyan-blue-to-vivid-purple: linear-gradient(135deg, rgba(6, 147, 227, 1) 0%, rgb(155, 81, 224) 100%);
    --wp--preset--gradient--light-green-cyan-to-vivid-green-cyan: linear-gradient(135deg, rgb(122, 220, 180) 0%, rgb(0, 208, 130) 100%);
    --wp--preset--gradient--luminous-vivid-amber-to-luminous-vivid-orange: linear-gradient(135deg, rgba(252, 185, 0, 1) 0%, rgba(255, 105, 0, 1) 100%);
    --wp--preset--gradient--luminous-vivid-orange-to-vivid-red: linear-gradient(135deg, rgba(255, 105, 0, 1) 0%, rgb(207, 46, 46) 100%);
    --wp--preset--gradient--very-light-gray-to-cyan-bluish-gray: linear-gradient(135deg, rgb(238, 238, 238) 0%, rgb(169, 184, 195) 100%);
    --wp--preset--gradient--cool-to-warm-spectrum: linear-gradient(135deg, rgb(74, 234, 220) 0%, rgb(151, 120, 209) 20%, rgb(207, 42, 186) 40%, rgb(238, 44, 130) 60%, rgb(251, 105, 98) 80%, rgb(254, 248, 76) 100%);
    --wp--preset--gradient--blush-light-purple: linear-gradient(135deg, rgb(255, 206, 236) 0%, rgb(152, 150, 240) 100%);
    --wp--preset--gradient--blush-bordeaux: linear-gradient(135deg, rgb(254, 205, 165) 0%, rgb(254, 45, 45) 50%, rgb(107, 0, 62) 100%);
    --wp--preset--gradient--luminous-dusk: linear-gradient(135deg, rgb(255, 203, 112) 0%, rgb(199, 81, 192) 50%, rgb(65, 88, 208) 100%);
    --wp--preset--gradient--pale-ocean: linear-gradient(135deg, rgb(255, 245, 203) 0%, rgb(182, 227, 212) 50%, rgb(51, 167, 181) 100%);
    --wp--preset--gradient--electric-grass: linear-gradient(135deg, rgb(202, 248, 128) 0%, rgb(113, 206, 126) 100%);
    --wp--preset--gradient--midnight: linear-gradient(135deg, rgb(2, 3, 129) 0%, rgb(40, 116, 252) 100%);
    --wp--preset--font-size--small: 13px;
    --wp--preset--font-size--medium: 20px;
    --wp--preset--font-size--large: 36px;
    --wp--preset--font-size--x-large: 42px;
    --wp--preset--spacing--20: 0.44rem;
    --wp--preset--spacing--30: 0.67rem;
    --wp--preset--spacing--40: 1rem;
    --wp--preset--spacing--50: 1.5rem;
    --wp--preset--spacing--60: 2.25rem;
    --wp--preset--spacing--70: 3.38rem;
    --wp--preset--spacing--80: 5.06rem;
    --wp--preset--shadow--natural: 6px 6px 9px rgba(0, 0, 0, 0.2);
    --wp--preset--shadow--deep: 12px 12px 50px rgba(0, 0, 0, 0.4);
    --wp--preset--shadow--sharp: 6px 6px 0px rgba(0, 0, 0, 0.2);
    --wp--preset--shadow--outlined: 6px 6px 0px -3px rgba(255, 255, 255, 1), 6px 6px rgba(0, 0, 0, 1);
    --wp--preset--shadow--crisp: 6px 6px 0px rgba(0, 0, 0, 1);
    --zoom-scale: 1;
    --panel: #112d35;
    --panel-2: #0b2228;
    --ink: #ffffff;
    --muted: #b7d3d8;
    --accent: #20c4d3;
    --accent-2: #18aebb;
    --radius: 16px;
    --shadow: 0 10px 24px rgba(0, 0, 0, 0.35), 0 2px 8px rgba(0, 0, 0, 0.28);
}
:where(.is-layout-flex) {
    gap: 0.5em;
}
:where(.is-layout-grid) {
    gap: 0.5em;
}
body .is-layout-flex {
    display: flex;
}
.is-layout-flex {
    flex-wrap: wrap;
    align-items: center;
}
.is-layout-flex > :is(*, div) {
    margin: 0;
}
body .is-layout-grid {
    display: grid;
}
.is-layout-grid > :is(*, div) {
    margin: 0;
}
:where(.wp-block-columns.is-layout-flex) {
    gap: 2em;
}
:where(.wp-block-columns.is-layout-grid) {
    gap: 2em;
}
:where(.wp-block-post-template.is-layout-flex) {
    gap: 1.25em;
}
:where(.wp-block-post-template.is-layout-grid) {
    gap: 1.25em;
}
.has-black-color {
    color: var(--wp--preset--color--black) !important;
}
.has-cyan-bluish-gray-color {
    color: var(--wp--preset--color--cyan-bluish-gray) !important;
}
.has-white-color {
    color: var(--wp--preset--color--white) !important;
}
.has-pale-pink-color {
    color: var(--wp--preset--color--pale-pink) !important;
}
.has-vivid-red-color {
    color: var(--wp--preset--color--vivid-red) !important;
}
.has-luminous-vivid-orange-color {
    color: var(--wp--preset--color--luminous-vivid-orange) !important;
}
.has-luminous-vivid-amber-color {
    color: var(--wp--preset--color--luminous-vivid-amber) !important;
}
.has-light-green-cyan-color {
    color: var(--wp--preset--color--light-green-cyan) !important;
}
.has-vivid-green-cyan-color {
    color: var(--wp--preset--color--vivid-green-cyan) !important;
}
.has-pale-cyan-blue-color {
    color: var(--wp--preset--color--pale-cyan-blue) !important;
}
.has-vivid-cyan-blue-color {
    color: var(--wp--preset--color--vivid-cyan-blue) !important;
}
.has-vivid-purple-color {
    color: var(--wp--preset--color--vivid-purple) !important;
}
.has-black-background-color {
    background-color: var(--wp--preset--color--black) !important;
}
.has-cyan-bluish-gray-background-color {
    background-color: var(--wp--preset--color--cyan-bluish-gray) !important;
}
.has-white-background-color {
    background-color: var(--wp--preset--color--white) !important;
}
.has-pale-pink-background-color {
    background-color: var(--wp--preset--color--pale-pink) !important;
}
.has-vivid-red-background-color {
    background-color: var(--wp--preset--color--vivid-red) !important;
}
.has-luminous-vivid-orange-background-color {
    background-color: var(--wp--preset--color--luminous-vivid-orange) !important;
}
.has-luminous-vivid-amber-background-color {
    background-color: var(--wp--preset--color--luminous-vivid-amber) !important;
}
.has-light-green-cyan-background-color {
    background-color: var(--wp--preset--color--light-green-cyan) !important;
}
.has-vivid-green-cyan-background-color {
    background-color: var(--wp--preset--color--vivid-green-cyan) !important;
}
.has-pale-cyan-blue-background-color {
    background-color: var(--wp--preset--color--pale-cyan-blue) !important;
}
.has-vivid-cyan-blue-background-color {
    background-color: var(--wp--preset--color--vivid-cyan-blue) !important;
}
.has-vivid-purple-background-color {
    background-color: var(--wp--preset--color--vivid-purple) !important;
}
.has-black-border-color {
    border-color: var(--wp--preset--color--black) !important;
}
.has-cyan-bluish-gray-border-color {
    border-color: var(--wp--preset--color--cyan-bluish-gray) !important;
}
.has-white-border-color {
    border-color: var(--wp--preset--color--white) !important;
}
.has-pale-pink-border-color {
    border-color: var(--wp--preset--color--pale-pink) !important;
}
.has-vivid-red-border-color {
    border-color: var(--wp--preset--color--vivid-red) !important;
}
.has-luminous-vivid-orange-border-color {
    border-color: var(--wp--preset--color--luminous-vivid-orange) !important;
}
.has-luminous-vivid-amber-border-color {
    border-color: var(--wp--preset--color--luminous-vivid-amber) !important;
}
.has-light-green-cyan-border-color {
    border-color: var(--wp--preset--color--light-green-cyan) !important;
}
.has-vivid-green-cyan-border-color {
    border-color: var(--wp--preset--color--vivid-green-cyan) !important;
}
.has-pale-cyan-blue-border-color {
    border-color: var(--wp--preset--color--pale-cyan-blue) !important;
}
.has-vivid-cyan-blue-border-color {
    border-color: var(--wp--preset--color--vivid-cyan-blue) !important;
}
.has-vivid-purple-border-color {
    border-color: var(--wp--preset--color--vivid-purple) !important;
}
.has-vivid-cyan-blue-to-vivid-purple-gradient-background {
    background: var(--wp--preset--gradient--vivid-cyan-blue-to-vivid-purple) !important;
}
.has-light-green-cyan-to-vivid-green-cyan-gradient-background {
    background: var(--wp--preset--gradient--light-green-cyan-to-vivid-green-cyan) !important;
}
.has-luminous-vivid-amber-to-luminous-vivid-orange-gradient-background {
    background: var(--wp--preset--gradient--luminous-vivid-amber-to-luminous-vivid-orange) !important;
}
.has-luminous-vivid-orange-to-vivid-red-gradient-background {
    background: var(--wp--preset--gradient--luminous-vivid-orange-to-vivid-red) !important;
}
.has-very-light-gray-to-cyan-bluish-gray-gradient-background {
    background: var(--wp--preset--gradient--very-light-gray-to-cyan-bluish-gray) !important;
}
.has-cool-to-warm-spectrum-gradient-background {
    background: var(--wp--preset--gradient--cool-to-warm-spectrum) !important;
}
.has-blush-light-purple-gradient-background {
    background: var(--wp--preset--gradient--blush-light-purple) !important;
}
.has-blush-bordeaux-gradient-background {
    background: var(--wp--preset--gradient--blush-bordeaux) !important;
}
.has-luminous-dusk-gradient-background {
    background: var(--wp--preset--gradient--luminous-dusk) !important;
}
.has-pale-ocean-gradient-background {
    background: var(--wp--preset--gradient--pale-ocean) !important;
}
.has-electric-grass-gradient-background {
    background: var(--wp--preset--gradient--electric-grass) !important;
}
.has-midnight-gradient-background {
    background: var(--wp--preset--gradient--midnight) !important;
}
.has-small-font-size {
    font-size: var(--wp--preset--font-size--small) !important;
}
.has-medium-font-size {
    font-size: var(--wp--preset--font-size--medium) !important;
}
.has-large-font-size {
    font-size: var(--wp--preset--font-size--large) !important;
}
.has-x-large-font-size {
    font-size: var(--wp--preset--font-size--x-large) !important;
}
:where(.wp-block-post-template.is-layout-flex) {
    gap: 1.25em;
}
:where(.wp-block-post-template.is-layout-grid) {
    gap: 1.25em;
}
:where(.wp-block-columns.is-layout-flex) {
    gap: 2em;
}
:where(.wp-block-columns.is-layout-grid) {
    gap: 2em;
}
:root :where(.wp-block-pullquote) {
    font-size: 1.5em;
    line-height: 1.6;
}

.e-con.e-parent:nth-of-type(n + 4):not(.e-lazyloaded):not(.e-no-lazyload),
.e-con.e-parent:nth-of-type(n + 4):not(.e-lazyloaded):not(.e-no-lazyload) * {
    background-image: none !important;
}
@media screen and (max-height: 1024px) {
    .e-con.e-parent:nth-of-type(n + 3):not(.e-lazyloaded):not(.e-no-lazyload),
    .e-con.e-parent:nth-of-type(n + 3):not(.e-lazyloaded):not(.e-no-lazyload) * {
        background-image: none !important;
    }
}
@media screen and (max-height: 640px) {
    .e-con.e-parent:nth-of-type(n + 2):not(.e-lazyloaded):not(.e-no-lazyload),
    .e-con.e-parent:nth-of-type(n + 2):not(.e-lazyloaded):not(.e-no-lazyload) * {
        background-image: none !important;
    }
}

.vehicle-selector {
    max-width: 1400px;
    margin: 0 auto;
    border-radius: 10px;
    padding: 40px 20px;
    color: var(--ink);
    font-family: ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, sans-serif;
}

.vehicle-selector img {
    display: block;
    max-width: 100%;
}

.header {
    text-align: center;
    margin-bottom: 30px;
}

.header h2 {
    font-size: 2.2em;
    color: #333;
    margin-bottom: 20px;
    font-weight: 600;
}
/* Vista Grid (Carousel) */
.grid-view {
    display: block;
}

.carousel-track {
    display: flex;
    transition: transform 0.5s ease;
    gap: 20px;
}

.vehicle-card {
    color: #fff;
    overflow: hidden;
    transition: transform 0.3s ease;
}

.vehicle-card:hover {
    transform: translateY(-5px);
}

.vehicle-title {
    font-size: 1.2em;
    font-weight: 600;
    margin-bottom: 10px;
    color: #fff;
}

.spec-item {
    display: flex;
    align-items: center;
    gap: 5px;
}

.spec-item::before {
    content: "👥";
    font-size: 12px;
}

.spec-item:nth-child(2)::before {
    content: "🧳";
}

.spec-item:nth-child(3)::before {
    content: "⚙️";
}

.spec-item:nth-child(4)::before {
    content: "❄️";
}


    .carousel-track {
        display: flex;
        transition: transform 0.5s ease;
    }

    .carousel-page {
        display: grid;
        grid-template-columns: repeat(4, 1fr);
        grid-template-rows: repeat(2, 1fr);
        gap: 20px;
        min-width: 100%;
        flex-shrink: 0;
        padding: 0 10px;
    }
    .desktop-only .vehicle-image {
        width: 100%;
        height: 200px;
        overflow: hidden;
        display: flex;
        align-items: center;
        justify-content: center;
        background: #f5f5f5;
        border-radius: 10px;
    }

    .desktop-only .vehicle-image img {
        width: 100%;
        height: 100%;
        object-fit: cover;
    }

    .desktop-only .vehicle-info {
        padding: 15px;
        flex-grow: 1;
        display: flex;
        flex-direction: column;
        justify-content: space-between;
    }

    .desktop-only .price-btn {
        display: inline-block;
        padding: 8px 16px;
        background: #20C4D3;
        color: white;
        text-decoration: none;
        border-radius: 5px;
        font-weight: 600;
        transition: background 0.3s ease;
        font-size: 14px;
        margin-top: auto;
    }

    .desktop-only .price-btn:hover {
        background: #1ba3b0;
    }

    .vehicle-image-wrapper {
        position: relative;
        display: inline-block;
        width: 100%;
    }

    .mobile-arrow {
        position: absolute;
        top: 50%;
        transform: translateY(-50%);
        background: rgba(0, 0, 0, 0.5);
        border: none;
        color: white;
        font-size: 24px;
        padding: 10px;
        z-index: 2;
        cursor: pointer;
        border-radius: 3px;
    }

    .mobile-arrow.left {
        left: 10px;
    }

    .mobile-arrow.right {
        right: 10px;
    }

    .carousel-btn:hover {
        background: #1ba3b0;
    }

    .carousel-btn:disabled {
        background: #ccc;
        cursor: not-allowed;
    }

    /* Estilos para la vista individual (sin cambios) */
    .single-vehicle {
        text-align: center;
        max-width: 800px;
        margin: 0 auto;
    }

    .single-vehicle .vehicle-image {
        /*background: transparent !important;*/
        height: auto !important;
        max-height: 400px;
    }

    .single-vehicle .vehicle-description {
        font-size: 16px;
        color: #666;
        margin: 10px 0 20px 0;
        line-height: 1.5;
    }

    @media (min-width: 769px) {
        .mobile-arrow {
            display: none;
        }
    }

    @media (max-width: 1200px) {
        .carousel-page {
            grid-template-columns: repeat(3, 1fr);
        }
    }

    @media (max-width: 900px) {
        .carousel-page {
            grid-template-columns: repeat(2, 1fr);
        }
    }

    @media (max-width: 768px) {
        .vehicle-card {
            width: 100%;
            max-width: none;
        }
        
        .carousel-page {
            grid-template-columns: 1fr;
            flex-direction: column;
        }
    }
    @keyframes glowShift {
        0% {
            transform: translate3d(-2%, -2%, 0) scale(1);
        }
        100% {
            transform: translate3d(2%, 3%, 0) scale(1.03);
        }
    }

    /* Ornamentos SVG posicionados/animados */
    .wb-ornaments {
        position: absolute;
        inset: 0;
        pointer-events: none;
    }
    .wb-bubble {
        position: absolute;
        opacity: 0.9;
    }
    .wb-bubble-a {
        top: -20px;
        left: -10px;
        width: 140px;
        height: 140px;
        animation: floatA 12s ease-in-out infinite;
    }
    .wb-bubble-b {
        bottom: -30px;
        right: 12%;
        width: 200px;
        height: 200px;
        animation: floatB 16s ease-in-out infinite;
    }
    @keyframes floatA {
        0%,
        100% {
            transform: translateY(0);
        }
        50% {
            transform: translateY(-10px);
        }
    }
    @keyframes floatB {
        0%,
        100% {
            transform: translate(0, 0);
        }
        50% {
            transform: translate(-10px, 8px);
        }
    }

    .wb-ring {
        position: absolute;
        top: 18%;
        right: 3%;
        width: 180px;
        height: 180px;
        opacity: 0.75;
        animation: slowSpin 40s linear infinite;
    }
    @keyframes slowSpin {
        to {
            transform: rotate(360deg);
        }
    }

    /* chips */
    .wb-chips {
        display: flex;
        gap: 8px;
        flex-wrap: wrap;
        margin: 6px 0 10px;
    }
    .chip {
        display: inline-block;
        padding: 6px 10px;
        border-radius: 999px;
        background: rgba(255, 255, 255, 0.1);
        color: #fff;
        border: 1px solid rgba(255, 255, 255, 0.25);
        font-weight: 600;
        font-size: 0.85rem;
        backdrop-filter: blur(2px);
    }

    /* accesibilidad: reduce animaciones si el usuario lo pide */
    @media (prefers-reduced-motion: reduce) {
        .wb-bubble-a,
        .wb-bubble-b,
        .wb-ring {
            animation: none !important;
        }
    }

    /* responsive */
    @media (max-width: 768px) {
        .wb-ring {
            width: 140px;
            height: 140px;
            right: -10px;
            top: 12%;
            opacity: 0.5;
        }
    }

.char-grid{
  display: grid;
  grid-template-columns: repeat(4, max-content);
  justify-content: center;
  row-gap: 5px;
  column-gap: 5px;
  padding: 0;
  list-style: none;
}

.char-cell{
  display: inline-flex;
  align-items: center;
}

.char-cell img{
  width: 15px;
  height: 15px;
  object-fit: contain;
}

.char-val{
  font-size: 14px;
  font-weight: 800;
  color: #FFFFFF;       /* texto blanco como en la captura */
  letter-spacing: .2px;
}

/* Ajuste fino en móvil, manteniendo 4 por fila */
@media (max-width: 480px){
  .char-grid { column-gap: 18px; row-gap: 10px; }
  .char-cell img { width: 24px; height: 24px; }
  .char-val { font-size: 13px; }
}

.price-btn {
    background: #10C2CD;
    color: white;
    border: none;
    padding: 5px;
    margin-top: 20px !important;
    border-radius: 4px;
    width: 100% !important;
    max-width: none !important;
    font-size: 1em;
    font-weight: 600;
    cursor: pointer;
    transition: background 0.3s ease;
    display: block !important;
    text-align: center;
}

.price-btn:hover {
    background: #45b7b8;
    color: white;
}

/* Vista Lista (Individual) */
.list-view {
    display: none;
}

.single-vehicle {
    text-align: center;
    max-width: 600px;
    margin: 0 auto;
}

.single-vehicle .vehicle-image {
    height: 300px;
    background: #f0f0f0;
    border-radius: 15px;
}

.single-vehicle .vehicle-image img {
    width: 80%;
    height: 80%;
    object-fit: contain;
}

.single-vehicle .vehicle-specs {
    justify-content: center;
    font-size: 1em;
    margin-bottom: 20px;
}

.vehicle-description {
    color: #666;
    line-height: 1.6;
    margin-bottom: 30px;
    font-size: 1em;
}

.single-vehicle .price-btn {
    max-width: 300px;
    margin: 0 auto;
}

.carousel-controls {
    display: flex !important;
    justify-content: flex-end !important;
    gap: 10px;
    margin-top: 30px;
    padding-right: 20px;
}

.carousel-btn {
    background: #20C4D3 !important;
    color: #0F2228 !important;
    border: none;
    border-radius: 50%;
    width: 45px;
    height: 45px;
    cursor: pointer;
    font-size: 20px;
}


/* Responsive */
@media (max-width: 768px) {
    .vehicle-card {
        flex: 0 0 250px;
    }
    
    .header h2 {
        font-size: 1.8em;
    }
    
}

.select-input {
    @apply w-full p-3 border border-gray-300 rounded-md bg-blue-50 focus:outline-none focus:ring-2 focus:ring-blue-500;
}
.thumbnail-container:hover {
    transform: scale(1.05);
    transition: transform 0.2s ease;
}
.image-dot:hover {
    transform: scale(1.2);
}

.select-input {
    @apply w-full p-3 border border-gray-300 rounded-md bg-blue-50 focus:outline-none focus:ring-2 focus:ring-blue-500;
}

.input-date {
    @apply w-full p-3 border border-gray-300 rounded-md bg-blue-50 focus:outline-none focus:ring-2 focus:ring-blue-500;
}

.thumbnail-container:hover {
    transform: scale(1.05);
    transition: transform 0.2s ease;
}

.image-dot {
    transition: all 0.2s ease;
}

.image-dot:hover {
    transform: scale(1.2);
}

input[type="date"]::-webkit-calendar-picker-indicator {
    background: transparent;
    bottom: 0;
    color: transparent;
    cursor: pointer;
    height: auto;
    left: 0;
    position: absolute;
    right: 0;
    top: 0;
    width: auto;
}

input:focus, select:focus {
    outline: none;
    ring: 2px;
    ring-color: #3b82f6;
}

.view-toggle-btn {
    width: 60px;
    height: 60px;
    background-color: #0f1e23; /* mismo fondo oscuro */
    border: none;
    border-radius: 12px;
    box-shadow: 0px 4px 10px rgba(0, 0, 0, 0.4);
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    grid-template-rows: repeat(2, 1fr);
    gap: 4px;
    padding: 10px;
    cursor: pointer;
}

.view-toggle-btn::before,
.view-toggle-btn::after,
.view-toggle-btn span,
.view-toggle-btn i {
    content: "";
    background-color: #00d2e8; /* celeste como en la imagen */
    display: block;
    width: 100%;
    height: 100%;
    border-radius: 2px;
}
.desktop-only { display: block; }
.mobile-only { display: none; }

.txt-h1-{
    font-size: 50px !important
}

@media (max-width: 768px) {
    .desktop-only { display: none !important; }
    .mobile-only { display: block !important; }

    .txt-h1-{
        font-size: 30px !important
    }
}

.vehicle-image-wrapper {
    position: relative;
    width: 100%;
    height: auto;
}


.mobile-arrow.left {
    left: 10px;
}

.mobile-arrow.right {
    right: 10px;
}

@media (min-width: 769px) {
    .mobile-arrow {
        display: none;
    }
}

.btn-cotizador{
    background-color: #0F2228 !important;
    border: none !important;
    min-width: 300px;
}

.btn-cotizador-2{
    min-width: 300px;
    border: none !important;
}

.btn-cotizador-2:not(:disabled) {
    background-color: #04D18D !important;
}

.btn-cotizador-2:disabled {
    background-color: #C0C0C0 !important;
}

.btn-cotizador-3{
    min-width: 200px;
    border: none !important;
}

.btn-cotizador-3:not(:disabled) {
    background-color: #10C2CD !important;
}

.btn-cotizador-3:disabled {
    background-color: #C0C0C0 !important;
}

.btn-closep{
    border: none !important;
    color: #676666 !important;
}

.btn-closep:hover{
    background-color: transparent !important;
}

.btn-reservation{
    background-color: #10C2CD !important;
    color: #fff !important;
    border: none !important;
    font-weight: bold !important;
}

.text-cyan-custom {
    color: #10C2CD;
}

.text-gray-custom {
    color: #D5D5D7;
}

.btn-continue{
    background-color: #fff !important;
    color: #0F2228 !important;
    font-weight: bold !important;
}

.body-no-scroll {
    overflow: hidden;
}

.modal-scrollable {
    max-height: 90vh;
    overflow-y: auto;
}
.btn-whatsapp {
    background-color: #04D18D !important;
    border: none !important;
    width: 300px !important;
}

.content-cr {
    background-color: #0F2228;
    background-size: cover;
}

.content-cr p {
    margin: 0;
    color: #fff;
}

@media (max-width: 768px) {
    .glide__slide {
        height: 90vh;
    }
}

.glide__slide {
    height: 90vh;
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
}

.carousel-image {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.content-cr,
.glide,
.glide__track {
    height: 100%;
}

@media (max-width: 480px) {
    .glide__slide {
        height: 600px;
    }

    .carousel-image{
        height: 250px;
    }
}

.document-upload-item {
    transition: all 0.3s ease;
}

.document-upload-item:hover {
    transform: translateY(-2px);
}

.btn-upload {
    transition: all 0.3s ease;
    box-shadow: 0 2px 4px rgba(0,0,0,0.1);
}

.btn-upload:hover {
    transform: translateY(-1px);
    box-shadow: 0 4px 8px rgba(0,0,0,0.15);
}

.upload-success {
    animation: fadeIn 0.5s ease;
}

.upload-error {
    animation: shake 0.5s ease;
}

@keyframes fadeIn {
    from {
        opacity: 0;
        transform: scale(0.9);
    }
    to {
        opacity: 1;
        transform: scale(1);
    }
}

@keyframes shake {
    0%, 20%, 40%, 60%, 80% {
        transform: translateX(0);
    }
    10%, 30%, 50%, 70%, 90% {
        transform: translateX(-5px);
    }
}

#uploadModal .bg-white {
    animation: modalFadeIn 0.3s ease;
}

@keyframes modalFadeIn {
    from {
        opacity: 0;
        transform: scale(0.9);
    }
    to {
        opacity: 1;
        transform: scale(1);
    }
}

@media (max-width: 768px) {
    .document-upload-item {
        margin-bottom: 1rem;
    }
    
    .upload-area svg {
        height: 2rem;
        width: 2rem;
    }
    
    .upload-area p {
        font-size: 0.875rem;
    }
}

.drag-over {
    border-color: #06b6d4 !important;
    background-color: #ecfeff;
}

.drag-over svg {
    color: #06b6d4;
}

.upload-success svg,
.upload-error svg {
    animation: scaleIn 0.3s ease;
}

@keyframes scaleIn {
    from {
        transform: scale(0);
    }
    to {
        transform: scale(1);
    }
}

/* Estilos para el modal de éxito */
        #successModal {
            backdrop-filter: blur(4px);
        }

        .modal-scrollable {
            max-height: 90vh;
            overflow-y: auto;
        }

        .btn-cotizador {
            background: linear-gradient(135deg, #20C4D3 0%, #1a9ba8 100%);
            border: none;
            transition: all 0.3s ease;
        }

        .btn-cotizador:hover {
            background: linear-gradient(135deg, #1a9ba8 0%, #158a96 100%);
            transform: translateY(-1px);
            box-shadow: 0 4px 12px rgba(32, 196, 211, 0.3);
        }

        /* Estilos para el botón de pago */
        .btn-reservation {
            background: linear-gradient(135deg, #20C4D3 0%, #1a9ba8 100%);
            border: none;
            transition: all 0.3s ease;
        }

        .btn-reservation:hover:not(:disabled) {
            background: linear-gradient(135deg, #1a9ba8 0%, #158a96 100%);
            transform: translateY(-1px);
            box-shadow: 0 4px 12px rgba(32, 196, 211, 0.3);
        }

        .btn-reservation:disabled {
            opacity: 0.6;
            cursor: not-allowed;
            transform: none;
        }

        /* Estilos para opciones de pago seleccionadas */
        .payment-option-selected {
            border: 2px solid #20C4D3 !important;
            background-color: rgba(32, 196, 211, 0.1) !important;
        }

        /* Animación para el loading del botón */
        @keyframes spin {
            0% { transform: rotate(0deg); }
            100% { transform: rotate(360deg); }
        }

        .btn-reservation:disabled::before {
            content: '';
            display: inline-block;
            width: 16px;
            height: 16px;
            border: 2px solid #ffffff;
            border-radius: 50%;
            border-top-color: transparent;
            animation: spin 1s linear infinite;
            margin-right: 8px;
        }

        /* Estilos para campos de formulario con error */
        .form-error {
            border-color: #ef4444 !important;
            box-shadow: 0 0 0 1px #ef4444;
        }

        /* Mensaje de error */
        .error-message {
            color: #ef4444;
            font-size: 0.875rem;
            margin-top: 0.25rem;
        }



#zoomWrapper{
    width: calc(100% / var(--zoom-scale, 1));
}

#zoomRoot{
    transform: scale(var(--zoom-scale, 1));
    transform-origin: top left;
}

:root{
    --zoom-accent: #20C4D3;
    --zoom-bg: #0F2228;
}

.zoom-fab{
    width: 44px; height: 44px; border-radius: 9999px;
    background: var(--zoom-bg);
    border: 2px solid var(--zoom-accent);
    box-shadow: 0 10px 24px rgba(0,0,0,.35), 0 0 0 1px rgba(255,255,255,.1) inset;
    color: var(--zoom-accent); 
    display:flex; align-items:center; justify-content:center;
    transition: transform .18s ease, box-shadow .18s ease, background .15s ease, color .15s ease, border-color .15s ease;
}
.zoom-fab:hover{
  background: #20C4D3 !important;
  color: #fff;
  border-color: var(--zoom-accent);
  transform: scale(1.04);
  box-shadow: 0 14px 28px rgba(0,0,0,.4);
}

.zoom-menu{
  margin-top: .5rem;
  width: 220px;
  padding: .5rem;
  background: #fff;
  border: 1px solid #e5e7eb;
  border-radius: 14px;
  box-shadow: 0 12px 30px rgba(0,0,0,.22);
  animation: zoom-pop .16s ease;
}
@keyframes zoom-pop { from{ transform: scale(.96); opacity:.0 } to{ transform: scale(1); opacity:1 } }

.zoom-option{
  width: 100%;
  display: flex; align-items: center; gap: .5rem;
  padding: .55rem .75rem;
  margin: .35rem 0;
  border: 1.5px solid var(--zoom-accent);
  border-radius: 12px;
  background: #fff;
  color: #0b1f24;
  font-weight: 600;
  transition: background .15s ease, color .15s ease, border-color .15s ease, transform .05s ease;
}
.zoom-option:hover{
  background: #E6FBFD;
  color: #0b1f24;
}
.zoom-option:active{ transform: scale(.99); }

.zoom-option[aria-current="true"]{
  background: var(--zoom-accent);
  color: #fff;
  border-color: transparent;
}
.zoom-option[aria-current="true"] .zoom-check{ opacity: 1; }

.zoom-check{
  width: 1.1rem; height: 1.1rem;
  display: inline-flex; align-items:center; justify-content:center;
  font-size: .8rem; line-height: 1;
  border-radius: 6px;
  border: 1px solid currentColor;
  opacity: 0; transition: opacity .12s ease;
}
.zoom-option:not([aria-current="true"]) .zoom-check{ color: var(--zoom-accent); }
.zoom-option[aria-current="true"] .zoom-check{
  background: rgba(255,255,255,.15);
  color: #fff; border-color: rgba(255,255,255,.8);
}

.carousel-track { display: flex; transition: transform .4s ease; }
.carousel-page{
  /* cada página ocupa el 100% de ancho del track */
  flex: 0 0 100%;
  box-sizing: border-box;
  padding: 0 10px;

  /* AQUÍ la magia: 4 columnas x 2 filas SIEMPRE */
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  grid-template-rows: repeat(2, 1fr);
  gap: 24px;
  align-items: stretch;   /* que todas las celdas midan lo mismo */
}

/* Todas las tarjetas llenan su celda */
.vehicle-card{
  display: flex;
  flex-direction: column;
  height: 100%;           /* clave para que se estiren igual */
  border-radius: 14px;
  overflow: hidden;
}

/* Área de imagen con alto estable */
.vehicle-image{
  width: 100%;
  aspect-ratio: 16 / 9;   /* fija el “alto relativo” */
}
.vehicle-image img{
  width: 100%;
  height: 100%;
  object-fit: contain;     /* no recorta, no deforma */
}

/* El contenido no debe empujar la altura */
.vehicle-info{ flex: 1; display: flex; flex-direction: column; }
.vehicle-title{ margin: 12px 0 8px; text-transform: uppercase;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.char-grid{
  display: grid; grid-template-columns: repeat(6, minmax(0,1fr));
  gap: 8px 10px; margin-bottom: 14px;
}
.char-grid .char-val{ white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

@media (max-width: 991px){
  /* ya tienes versión mobile, esto es solo por si acaso */
  .desktop-only{ display:none !important; }
  .mobile-only{ display:block !important; }
}
@media (min-width: 992px){
  .desktop-only{ display:block !important; }
  .mobile-only{ display:none !important; }
}
.char-grid,
.char-strip{
  --cols: 4;
  display: grid;
  grid-template-columns: repeat(var(--cols), minmax(0, 1fr)); /* 4 por fila */
  gap: 10px 12px;             /* espacio entre iconos */
  align-items: center;
}

/*.char-strip2{
  --cols: 4;
  display: grid;
  grid-template-columns: repeat(var(--cols), minmax(0, 1fr));
  align-items: center;
}*/
/* Móvil: 2 columnas */
.char-strip2{
  --cols: 2;
  display: grid;
  grid-template-columns: repeat(var(--cols), minmax(0, 1fr));
  align-items: center;
  gap: .75rem;            /* opcional */
}

/* Desktop (ajusta el ancho que quieras: 1024px, 992px, 768px, etc.) */
@media (min-width: 1024px){
  .char-strip2{ --cols: 4; }
}


/* Cada celda: icono + valor en una línea */
.char-cell,
.char-item{
  display: grid;
  grid-template-columns: 24px 1fr; /* icono | texto */
  align-items: center;
  column-gap: 8px;
  min-width: 0;                   /* permite elipsis del texto */
}

.char-item2{
  display: grid;
  grid-template-columns: 54px 1fr;
  font-size: 25px;
  font-weight: bold;
  align-items: center;
  column-gap: 8px;
  min-width: 0; 
}

.char-cell img,
.char-item img{
  width: 24px;
  height: 24px;
  object-fit: contain;
}

.char-item2 img{
  width: 44px;
  height: 44px;
  object-fit: contain;
}

.char-val,
/*.char-value{
  font-size: 14px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}*/
.char-value{
  font-size: 12px;
  white-space: normal;        /* permitir multi-línea */
  overflow: visible;          /* no ocultar */
  text-overflow: clip;        /* sin “…” */
  max-width: none;            /* sin límite de ancho */
}


/* (Opcional) Si quieres forzar MÁXIMO 4 filas visibles y cortar lo demás: */
.char-grid{
  /* altura = 4 filas * alto estimado (32px) + gaps (3 * 10px) */
  max-height: calc(4 * 32px + 3 * 10px);
  overflow: hidden;
}

.benefits-strip {
    margin: 14px auto 10px;
    padding: 25px;
    list-style: none;
    display: flex;
    gap: 0;
    background: var(--panel);
    border-radius: 14px;
    box-shadow: var(--shadow);
    overflow: hidden;
}
.benefits-strip li {
    flex: 1 1 0;
    min-width: 0;
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 10px 16px;
    position: relative;
}
.benefits-strip li + li::before {
    content: "";
    position: absolute;
    left: -1px;
    top: 10px;
    bottom: 10px;
    width: 1px;
    background: #DEDEDE;
}
.benefits-strip svg {
    width: 48px;
    height: 48px;
    flex: 0 0 48px;
    color: var(--accent);
    filter: drop-shadow(0 1px 1px rgba(0, 0, 0, 0.25));
}
.benefits-strip span {
    font-size: 0.92rem;
    line-height: 1.2;
    color: #e8f5f6;
}
.no-fees {
    text-align: center;
    font-weight: 800;
    font-size: clamp(1.1rem, 0.9rem + 1vw, 1.6rem);
    margin: 18px 0 8px;
}

.welcome-band {
    margin: 0 auto 22px;
    padding: 24px;
}
.wb-grid {
    display: grid;
    grid-template-columns: 430px 1fr;
    gap: 26px;
    align-items: center;
    /*padding-left: 140px;
    padding-right: 200px;*/
}
.wb-media img {
    border-radius: 12px;
    outline: 2px solid #fff;
    box-shadow: 0 12px 28px rgba(0, 0, 0, 0.45);
}
.wb-kicker {
    margin: 0 0 6px;
    text-transform: uppercase;
    letter-spacing: 0.12em;
    font-weight: 800;
    color: #dff6f7;
    opacity: 0.95;
    font-size: 0.85rem;
}
.wb-title {
    margin: 0;
    line-height: 1.05;
    font-weight: 700;
    font-size: clamp(1.8rem, 1.2rem + 2.6vw, 3rem);
}
.wb-title span {
    color: var(--accent);
}
.wb-sub {
    color: var(--ink);
    font-weight: 500;
    margin: 0.25rem 0 0;
    font-size: 30px;
}
.wb-text {
    color: #e9f6f7;
    opacity: 0.9;
    margin: 0.25rem 0 0;
}
.wb-steps {
    display: block;
    margin: 16px 0 6px;
    color: var(--ink);
    font-weight: 800;
    text-align: center;
    font-size: 32px;
}
.wb-invite {
    margin: 0;
    color: #dff4f6;
    text-align: center;
}

.steps-band {
    margin: 28px auto 22px;
    display: flex;
    justify-content: center;
}
.steps-grid {
    width: 100%;
    max-width: 1980px;
    display: grid;
    grid-template-columns: 1fr 120px 1fr 120px 1fr 120px 1fr;
    align-items: center;
}
.step {
    text-align: center;
    padding: 0 6px;
}
.step-icon {
    width: 70px;
    height: 70px;
    border-radius: 14px;
    display: grid;
    place-items: center;
    margin: 0 auto 12px;
    box-shadow: 0 10px 18px rgba(32, 196, 211, 0.28), inset 0 1px 0 rgba(255, 255, 255, 0.35);
}
.step-icon svg {
    width: 70px;
    height: 70px;
    color: #0a2a30;
}
.step h4 {
    margin: 0;
    font-size: 1rem;
    font-weight: 800;
}
.step p {
    margin: 6px auto 0;
    color: var(--muted);
    font-size: 0.9rem;
}

.step-curve {
    width: 100%;
    height: 60px;
}
.step-curve path {
    stroke: #7daeb3;
    stroke-width: 3;
    stroke-dasharray: 3 8;
    fill: none;
    opacity: 0.7;
}

.category-title {
    margin: 6px 0 0;
    text-align: center;
    font-weight: 900;
    font-size: 3rem;
    line-height: 25px;
}
.category-sub {
    text-align: center;
    color: #d6ebee;
    margin: 4px 0 16px;
    font-size: 3rem;
}

.carousel-container {
    position: relative;
    overflow: hidden;
    border-radius: 16px;
}

.vehicle-selector .carousel-btn{
  width: 34px;
  height: 34px;
  border-radius: 50%;
  background: transparent;
  border: 2px solid #20C4D3;
  box-shadow: none;
  place-items: center;
  padding: 0;
  cursor: pointer;
  transition: background .15s ease, transform .15s ease, border-color .15s ease;
  transform: translateY(-1px);
}

.vehicle-selector .carousel-btn svg{
  width: 12px; height: 22px; display:block;
}

.vehicle-selector .carousel-btn svg path{
  stroke: #0F2228 !important;
  stroke-width: 2;
}

.vehicle-selector .carousel-btn:disabled{
  opacity: .4; cursor: not-allowed; transform:none;
}
.hamburger{
    border: none !important;
}
.close-menu{
    border: none !important;
}
.view-controls {
    margin: 8px 0 10px;
    display: flex;
    gap: 10px;
    justify-content: flex-end;
}
.view-btn {
    border: 1px solid rgba(255, 255, 255, 0.14);
    padding: 8px;
    border-radius: 12px;
    cursor: pointer;
    text-align: center !important;
    width: 40px;
    height: 40px;
}
.view-btn.active {
    outline: 2px solid var(--accent);
    border-color: transparent;
    background-color: #20C4D3
}

@media (min-width: 992px) {
    .desktop-only {
        display: block;
    }
    .mobile-only {
        display: none;
    }
}
@media (max-width: 1024px) {
    .wb-grid {
        grid-template-columns: 1fr;
    }
    .wb-media {
        order: 1;
    }
    .wb-copy {
        order: 2;
        text-align: center;
    }
}
@media (max-width: 1200px) {
    .carousel-page {
        grid-template-columns: repeat(3, 1fr);
    }
}
@media (max-width: 768px) {
    .steps-grid {
        grid-template-columns: 1fr;
        gap: 18px;
    }
    .step-curve {
        display: none;
    }
    .benefits-strip {
        flex-wrap: wrap;
        row-gap: 6px;
    }
    .benefits-strip li {
        flex: 1 1 50%;
    }
    .benefits-strip li + li::before {
        display: none;
    }

    .wb-grid{
        padding-left: 0px;
    }
}

.document-upload-item {
    transition: all 0.3s ease;
}

.document-upload-item:hover {
    transform: translateY(-2px);
}

.upload-area {
    transition: all 0.3s ease;
}

.btn-upload {
    transition: all 0.3s ease;
    box-shadow: 0 2px 4px rgba(0,0,0,0.1);
}

.btn-upload:hover {
    transform: translateY(-1px);
    box-shadow: 0 4px 8px rgba(0,0,0,0.15);
}

.upload-success {
    animation: fadeIn 0.5s ease;
}

.upload-error {
    animation: shake 0.5s ease;
}

@keyframes fadeIn {
    from {
        opacity: 0;
        transform: scale(0.9);
    }
    to {
        opacity: 1;
        transform: scale(1);
    }
}

@keyframes shake {
    0%, 20%, 40%, 60%, 80% {
        transform: translateX(0);
    }
    10%, 30%, 50%, 70%, 90% {
        transform: translateX(-5px);
    }
}

#uploadModal .bg-white {
    animation: modalFadeIn 0.3s ease;
}

@keyframes modalFadeIn {
    from {
        opacity: 0;
        transform: scale(0.9);
    }
    to {
        opacity: 1;
        transform: scale(1);
    }
}

@media (max-width: 768px) {
    .document-upload-item {
        margin-bottom: 1rem;
    }
    
    .upload-area svg {
        height: 2rem;
        width: 2rem;
    }
    
    .upload-area p {
        font-size: 0.875rem;
    }
}

.drag-over {
    border-color: #06b6d4 !important;
    background-color: #ecfeff;
}

.drag-over svg {
    color: #06b6d4;
}

.upload-success svg,
.upload-error svg {
    animation: scaleIn 0.3s ease;
}

@keyframes scaleIn {
    from {
        transform: scale(0);
    }
    to {
        transform: scale(1);
    }
}


.gt_white_content{
    top:7% !important;
}

input[type="date"],
input[type="time"],
input[type="datetime-local"] {
  color: inherit;
}

input[type="date"]::-webkit-datetime-edit,
input[type="time"]::-webkit-datetime-edit,
input[type="datetime-local"]::-webkit-datetime-edit {
  color: inherit;
}

input[type="date"]::-webkit-datetime-edit-text,
input[type="date"]::-webkit-datetime-edit-month-field,
input[type="date"]::-webkit-datetime-edit-day-field,
input[type="date"]::-webkit-datetime-edit-year-field,
input[type="datetime-local"]::-webkit-datetime-edit-text,
input[type="datetime-local"]::-webkit-datetime-edit-month-field,
input[type="datetime-local"]::-webkit-datetime-edit-day-field,
input[type="datetime-local"]::-webkit-datetime-edit-year-field,
input[type="datetime-local"]::-webkit-datetime-edit-hour-field,
input[type="datetime-local"]::-webkit-datetime-edit-minute-field {
  color: inherit;
}

input[type="date"]::-webkit-calendar-picker-indicator,
input[type="datetime-local"]::-webkit-calendar-picker-indicator {
  opacity: 1;
  filter: none;
}

.air-datepicker,
  .air-datepicker.-inline-,
  .air-datepicker-global-container {
    --adp-bg-color: #091A21;
    --adp-color: #20C4D3;
    --adp-accent-color: #20C4D3;      /* para focus, bordes y range */
    --adp-nav-color: #20C4D3;
    --adp-nav-arrow-color: #20C4D3;
    --adp-other-month-color: rgba(32,196,211,.35);
    --adp-disabled-color: rgba(32,196,211,.25);
    --adp-cell-background-color-selected: rgba(32,196,211,.18);
    --adp-cell-background-color-in-range: rgba(32,196,211,.10);
    --adp-cell-background-color-hover: rgba(32,196,211,.08);
    --adp-border-color: rgba(32,196,211,.22);
    --adp-transition-duration: .15s;
    background: #091A21 !important;
    color: #20C4D3 !important;
    border-color: var(--adp-border-color) !important;
  }

  /* Header (mes/año y flechas) */
  .air-datepicker-nav,
  .air-datepicker--pointer {
    color: var(--adp-nav-color);
    border-color: var(--adp-border-color);
  }
  .air-datepicker-nav--title,
  .air-datepicker-nav--action svg {
    color: var(--adp-nav-color);
    fill: var(--adp-nav-arrow-color);
  }
  .air-datepicker-nav--action:hover svg {
    opacity: .8;
  }

  /* Encabezados de días (L, M, X, …) y líneas */
  .air-datepicker-body--day-names {
    border-bottom: 1px solid var(--adp-border-color);
  }
  .air-datepicker-body--day-name {
    color: #20C4D3;
    opacity: .9;
  }

  /* Días */
  .air-datepicker-cell.-day- {
    color: #20C4D3;
  }
  .air-datepicker-cell.-day-.-other-month- {
    color: var(--adp-other-month-color);
  }
  .air-datepicker-cell.-disabled- {
    color: var(--adp-disabled-color) !important;
    cursor: not-allowed;
  }
  .air-datepicker-cell.-day-:hover {
    background: var(--adp-cell-background-color-hover);
  }
  .air-datepicker-cell.-current- {
    box-shadow: inset 0 0 0 1px var(--adp-accent-color);
  }
  .air-datepicker-cell.-selected-,
  .air-datepicker-cell.-selected-.-current- {
    background: var(--adp-cell-background-color-selected) !important;
    color: #20C4D3 !important;
  }
  .air-datepicker-cell.-in-range- {
    background: var(--adp-cell-background-color-in-range);
  }

  /* Timepicker */
  .air-datepicker-time {
    border-top: 1px solid var(--adp-border-color);
  }
  .air-datepicker-time--row input[type="range"]::-webkit-slider-thumb {
    background: #20C4D3;
  }
  .air-datepicker-time--row input[type="range"]::-moz-range-thumb {
    background: #20C4D3;
  }
  .air-datepicker-time--current {
    color: #20C4D3;
  }

  /* Botones (Hoy / OK) */
  .air-datepicker-buttons {
    border-top: 1px solid var(--adp-border-color);
  }
  .air-datepicker-button {
    color: #20C4D3;
  }
  .air-datepicker-button:hover {
    background: var(--adp-cell-background-color-hover);
  }

  /* Pointer triangulito */
  .air-datepicker--pointer:after {
    background: #091A21;
    border: 1px solid var(--adp-border-color);
  }

  /* (Opcional) Feriados que deshabilitaste con onRenderCell */
  .ap-disabled-holiday {
    text-decoration: line-through;
    opacity: .55;
  }
  /* Día seleccionado: fondo cian sólido y número oscuro para alto contraste */
  .air-datepicker-cell.-selected-,
  .air-datepicker-cell.-selected-.-current-,
  .air-datepicker-cell.-selected-.-focus- {
    background: #20C4D3 !important;   /* fondo sólido */
    color: #091A21 !important;         /* número en oscuro */
    border-radius: 8px;
    box-shadow: none !important;
  }

  /* Hover sobre seleccionado (mantener contraste) */
  .air-datepicker-cell.-selected-:hover {
    background: #20C4D3 !important;
    color: #091A21 !important;
  }

  /* Rango (si lo usas) — bordes del rango con buen contraste */
  .air-datepicker-cell.-in-range- {
    background: rgba(32, 196, 211, 0.12) !important;
    color: #20C4D3 !important;
  }
  .air-datepicker-cell.-range-from-,
  .air-datepicker-cell.-range-to- {
    background: #20C4D3 !important;
    color: #091A21 !important;
    border-radius: 8px !important;
  }

  /* Día de hoy sin seleccionar: un contorno sutil, pero visible */
  .air-datepicker-cell.-current-:not(.-selected-) {
    box-shadow: inset 0 0 0 1.5px #20C4D3 !important;
    color: #20C4D3 !important;
  }