/* NU Car Rentals — visual system 2026
   Presentation-only layer. Application hooks, IDs and behaviour remain unchanged. */

:root {
    --nu-green: #78b82a;
    --nu-green-dark: #426f14;
    --nu-green-ink: #29480d;
    --nu-action: #6fac1b;
    --nu-action-hover: #578d12;
    --nu-action-active: #46730c;
    --nu-lime-soft: #eff7e5;
    --nu-orange: #ed6b2d;
    --nu-ink: #162018;
    --nu-muted: #637067;
    --nu-line: #dfe5df;
    --nu-surface: #ffffff;
    --nu-canvas: #f4f6f3;
    --nu-night: #172218;
    --nu-radius: 14px;
    --nu-shadow: 0 18px 48px rgba(26, 45, 27, .12);
}

html { max-width: 100%; scroll-behavior: smooth; overflow-x: hidden; }

body {
    max-width: 100%;
    background: var(--nu-canvas) !important;
    color: var(--nu-ink);
    font-family: "Segoe UI", Inter, Roboto, Arial, sans-serif;
    -webkit-font-smoothing: antialiased;
    overflow-x: hidden;
}

/* Responsive safety net shared by every public screen. */
img, video, canvas, svg { max-width: 100%; }
img, video { height: auto; }
iframe { display: block; width: 100%; max-width: 100%; border: 0; }
input, select, textarea, button { max-width: 100%; }
.container, .container-fluid, .row, [class*="col-"] { min-width: 0; }
.card, .modal-content, .jumbotron, fieldset { min-width: 0; }
p, li, td, th, label, a { overflow-wrap: anywhere; }

a { transition: color .18s ease, background-color .18s ease, border-color .18s ease, opacity .18s ease; }

/* Shared header */
#mn {
    position: relative;
    z-index: 40;
    min-height: 92px;
    padding: 0 4.5vw;
    background: rgba(255,255,255,.97) !important;
    border-bottom: 1px solid rgba(24, 52, 26, .08);
    box-shadow: 0 4px 22px rgba(19, 39, 21, .05);
}

#contlag {
    position: relative;
    z-index: 50;
    max-width: 1380px;
    margin: 0 auto -24px;
    color: var(--nu-muted);
    font-size: 12px;
    letter-spacing: .04em;
    pointer-events: none;
}

#contlag select {
    position: relative;
    z-index: 1;
    height: 30px;
    margin-left: 7px;
    padding: 0 25px 0 9px;
    color: var(--nu-ink);
    background: #fff;
    border: 1px solid var(--nu-line);
    border-radius: 6px;
    cursor: pointer;
    pointer-events: auto;
}

#mn .navbar {
    max-width: 1380px;
    min-height: 90px;
    margin: auto;
    padding: 8px 0;
}

#logos img { width: auto; height: 68px !important; object-fit: contain; }

#menu2 .nav-link,
#mn .navbar-nav a {
    position: relative;
    padding: 14px 13px !important;
    color: #29342c !important;
    font-size: 14px;
    font-weight: 600;
    letter-spacing: .01em;
}

#menu2 .nav-link::after,
#mn .navbar-nav a::after {
    position: absolute;
    right: 13px;
    bottom: 7px;
    left: 13px;
    height: 2px;
    content: "";
    background: var(--nu-green);
    transform: scaleX(0);
    transform-origin: left;
    transition: transform .18s ease;
}

#menu2 .nav-link:hover::after,
#mn .navbar-nav a:hover::after { transform: scaleX(1); }

.navbar-toggler { border: 1px solid var(--nu-line) !important; border-radius: 8px; }

/* Controls */
.form-control {
    min-height: 46px;
    padding: 10px 13px;
    color: var(--nu-ink);
    background-color: #fff;
    border: 1px solid #cfd8d0;
    border-radius: 8px;
    box-shadow: none;
}

.form-control:focus,
select:focus, textarea:focus, input:focus, input[type]:focus {
    border-color: var(--nu-green) !important;
    box-shadow: 0 0 0 3px rgba(120,184,42,.16) !important;
    outline: 0;
}

.btn {
    min-height: 44px;
    padding: 10px 20px;
    border-radius: 8px;
    font-weight: 700;
    letter-spacing: .01em;
    box-shadow: none !important;
}

.btn.bg-nu-gray,
.btn.bg-nu-green,
.btn.bg-nu-orange,
#btnbuscar,
.btn-success,
.btn-primary {
    color: #fff !important;
    background: var(--nu-action) !important;
    border-color: var(--nu-action) !important;
}

.btn.bg-nu-gray:hover,
.btn.bg-nu-green:hover,
.btn.bg-nu-orange:hover,
#btnbuscar:hover,
.btn-success:hover,
.btn-primary:hover,
.btn.bg-nu-gray:focus,
.btn.bg-nu-green:focus,
.btn.bg-nu-orange:focus,
#btnbuscar:focus,
.btn-success:focus,
.btn-primary:focus {
    color: #fff !important;
    background: var(--nu-action-hover) !important;
    border-color: var(--nu-action-hover) !important;
    box-shadow: 0 0 0 3px rgba(111,172,27,.22) !important;
}

.btn.bg-nu-gray:active,
.btn.bg-nu-green:active,
.btn.bg-nu-orange:active,
#btnbuscar:active,
.btn-success:active,
.btn-primary:active {
    background: var(--nu-action-active) !important;
    border-color: var(--nu-action-active) !important;
}

.btn-secondary {
    color: #fff;
    background: #59615c;
    border-color: #59615c;
}

.btn-secondary:hover,
.btn-secondary:focus {
    color: #fff;
    background: #424944;
    border-color: #424944;
}

.btn-primary:disabled,
.btn-success:disabled,
#btnbuscar:disabled {
    color: #fff !important;
    background: #9abf6d !important;
    border-color: #9abf6d !important;
    opacity: .72;
}
.bg-nu-green { background-color: var(--nu-green) !important; }
.bg-nu-gray { background-color: #27352b !important; }
.text-nu-green { color: var(--nu-green-dark) !important; }
.jumbotron-nu-green { background: var(--nu-green); }

/* Homepage hero */
body.nu-home .nu-hero {
    position: relative;
    min-height: 570px;
    overflow: hidden;
    background: #1a281d;
    width: 100%;
    max-width: 100%;
}

body.nu-home .nu-hero .carousel,
body.nu-home .nu-hero .carousel-inner,
body.nu-home .nu-hero .carousel-item { min-height: 570px; }

body.nu-home .nu-hero .carousel-item {
    background-position: center;
    background-size: cover;
}

body.nu-home .nu-hero .c-intem-1 { background-image: url(../ES/Frame/Web/caru-1.jpg); }
body.nu-home .nu-hero .c-intem-2 { background-image: url(../ES/Frame/Web/caru-2.jpg); }
body.nu-home .nu-hero .c-intem-3 { background-image: url(../ES/Frame/Web/caru-3.jpg); }

body.nu-home .nu-hero > .container-nu:last-of-type .col-lg-9 {
    flex: 0 0 100%;
    max-width: 100%;
}

body.nu-home .nu-hero > .container-nu:last-of-type .col-lg-3 { display: none; }

body.nu-home .nu-hero::after {
    position: absolute;
    inset: 0;
    z-index: 1;
    pointer-events: none;
    content: "";
    background: linear-gradient(90deg, rgba(10,20,12,.48) 0%, rgba(10,20,12,.18) 48%, rgba(10,20,12,.02) 80%);
}

.nu-hero-copy {
    position: absolute;
    top: 76px;
    left: max(5vw, calc((100vw - 1380px) / 2));
    z-index: 4;
    max-width: 590px;
    color: #fff;
}

.nu-eyebrow {
    display: inline-flex;
    align-items: center;
    gap: 9px;
    margin-bottom: 16px;
    color: #e9f8d9;
    font-size: 12px;
    font-weight: 800;
    letter-spacing: .17em;
    text-transform: uppercase;
}

.nu-eyebrow::before { width: 32px; height: 2px; content: ""; background: var(--nu-green); }
.nu-hero-copy h1 { margin: 0 0 15px; font-size: clamp(38px, 4.4vw, 70px); font-weight: 750; line-height: .99; letter-spacing: -.045em; }
.nu-hero-copy p { max-width: 510px; margin: 0; color: rgba(255,255,255,.9); font-size: 18px; line-height: 1.55; }

body.nu-home .arriba {
    position: absolute;
    top: 325px;
    right: max(4vw, calc((100vw - 1380px) / 2));
    left: max(4vw, calc((100vw - 1380px) / 2));
    z-index: 8;
    width: auto;
    max-width: none;
    margin: 0;
}

body.nu-home #frm {
    margin: 0 !important;
    padding: 22px !important;
    color: var(--nu-ink);
    background: rgba(255,255,255,.97);
    border: 1px solid rgba(255,255,255,.65);
    border-radius: var(--nu-radius);
    box-shadow: 0 24px 70px rgba(8,22,10,.28);
    backdrop-filter: blur(12px);
}

body.nu-home #frm > div:first-child { display: none; }
body.nu-home #frm > hr { display: none; }
body.nu-home #resv { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: 10px 12px; align-items: center; }
body.nu-home #ofisal { grid-column: 1 / 5; }
body.nu-home #cbxregreso { grid-column: 5; justify-self: end; margin: 0; }
body.nu-home #cbxretorno { grid-column: 6 / 9; margin: 0 !important; color: var(--nu-muted) !important; }
body.nu-home #ofregcont { grid-column: 9 / 13; margin: 0; }
body.nu-home #resv > .form-row:nth-of-type(2) { grid-column: 1 / 4; }
body.nu-home #resv > .form-row:nth-of-type(3) { grid-column: 4 / 7; }
body.nu-home #resv > .form-group:nth-of-type(4) { grid-column: 7 / 10; margin: 0; }
body.nu-home #divedad { grid-column: 10 / 13; margin: 0; }
body.nu-home #resv > .form-row.mb-2 { grid-column: 1 / 7; margin-bottom: 0 !important; }
body.nu-home #resv > .text-center { grid-column: 7 / 13; }
body.nu-home #resv .my-1 { margin-top: 0 !important; margin-bottom: 0 !important; }
body.nu-home #btnbuscar { min-height: 46px; }

.nu-home-sections { background: var(--nu-surface); }

.nu-section { max-width: 1240px; margin: 0 auto; padding: 74px 24px; }
.nu-section-head { display: flex; justify-content: space-between; align-items: end; gap: 20px; margin-bottom: 30px; }
.nu-section h2 { margin: 0; font-size: clamp(28px, 3vw, 43px); font-weight: 740; line-height: 1.08; letter-spacing: -.035em; }
.nu-section-head p { max-width: 520px; margin: 0; color: var(--nu-muted); line-height: 1.65; }
.nu-link { color: var(--nu-green-dark); font-weight: 700; }
.nu-link:hover { color: var(--nu-green-ink); text-decoration: none; }

.nu-fleet-showcase { background: var(--nu-canvas); }
.nu-fleet-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; }
.nu-fleet-card { position: relative; min-height: 330px; padding: 30px; overflow: hidden; color: var(--nu-ink); text-decoration: none !important; background: #fff; border: 1px solid var(--nu-line); border-radius: var(--nu-radius); }
.nu-fleet-card:first-child { background: #fff; color: var(--nu-ink); border-color: #cfe0bd; box-shadow: inset 0 4px 0 var(--nu-green); }
.nu-fleet-card small { color: var(--nu-green-dark); font-weight: 800; letter-spacing: .11em; text-transform: uppercase; }
.nu-fleet-card:first-child small { color: var(--nu-green-dark); }
.nu-fleet-card h3 { margin: 8px 0 4px; font-size: 25px; font-weight: 720; }
.nu-fleet-card h3 { color: var(--nu-ink); }
.nu-fleet-card:first-child h3 { color: var(--nu-ink); }
.nu-fleet-card p { color: var(--nu-muted); font-size: 14px; }
.nu-fleet-card:first-child p { color: var(--nu-muted); }
.nu-fleet-card img { position: absolute; right: -10px; bottom: 18px; display: block; width: 92%; height: 165px; object-fit: contain; transition: transform .25s ease; }
.nu-fleet-card:hover img { transform: translateX(-7px); }

.nu-promo-grid { display: grid; grid-template-columns: 1.4fr 1fr 1fr; gap: 16px; }
.nu-promo-card { position: relative; min-height: 330px; overflow: hidden; background: #263228; border-radius: var(--nu-radius); }
.nu-promo-card img { width: 100%; height: 100%; min-height: 330px; object-fit: cover; transition: transform .35s ease; }
.nu-promo-card:hover img { transform: scale(1.025); }
.nu-promo-card::after { position: absolute; inset: 0; content: ""; background: linear-gradient(180deg, transparent 45%, rgba(8,15,9,.76)); }
.nu-promo-label { position: absolute; right: 22px; bottom: 20px; left: 22px; z-index: 2; color: #fff; }
.nu-promo-label strong { display: block; font-size: 20px; }
.nu-promo-label span { color: rgba(255,255,255,.78); font-size: 13px; }

.nu-location-band { color: #fff; background: var(--nu-night); }
.nu-location-band .nu-section { display: grid; grid-template-columns: 1.15fr .85fr; align-items: center; gap: 70px; }
.nu-location-band p { color: rgba(255,255,255,.7); line-height: 1.7; }
.nu-location-points { display: grid; grid-template-columns: repeat(2,1fr); gap: 12px; }
.nu-location-point { padding: 18px; color: #fff; background: rgba(255,255,255,.07); border: 1px solid rgba(255,255,255,.1); border-radius: 10px; }
.nu-location-point i { margin-right: 7px; color: #b4dd83; }

/* Existing promotions on older markup */
body:not(.nu-home) .card { border: 1px solid var(--nu-line); border-radius: var(--nu-radius); box-shadow: 0 9px 28px rgba(20,39,22,.07); }
.zoom { transition: transform .2s ease, box-shadow .2s ease; }
.zoom:hover { z-index: 2; transform: translateY(-4px); }
.img-thumbnail { background: transparent; border: 0; }

/* Reservation journey */
body > .container:not(#mn):not(.nu-section),
body > .container-fluid:not(#mn):not(footer) { position: relative; }
#carga, #pagando { min-height: 55vh; height: auto; }

/* Compact loading state used before the vehicle grid is ready. */
#carga.nu-page-loader {
    min-height: 52vh;
    padding: 32px 18px;
}

#carga.nu-page-loader .nu-loader-card {
    display: flex !important;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 17px;
    width: 178px;
    min-height: 138px;
    padding: 24px;
    background: rgba(255,255,255,.94);
    border: 1px solid var(--nu-line);
    border-radius: 14px;
    box-shadow: 0 14px 38px rgba(20,39,22,.1);
}

#carga.nu-page-loader .nu-loader-card img {
    display: block;
    width: 104px;
    max-width: 104px;
    height: auto;
}

#carga.nu-page-loader .spinner-border {
    box-sizing: border-box;
    flex: 0 0 28px;
    width: 28px;
    height: 28px;
    border-width: 3px;
}

.jumbotron,
.jumbotron-nu-gray,
fieldset.scheduler-border {
    background: #fff;
    border: 1px solid var(--nu-line) !important;
    border-radius: var(--nu-radius);
    box-shadow: 0 8px 30px rgba(20,39,22,.06);
}

.ribbon-promo span { background: var(--nu-orange); }
.ribbon-sugerido span { background: var(--nu-green); }
.bg-nu-sugerido { background-color: #f0f7e7; }

/* Fleet, location and document pages */
body.bg-fondo-nu,
body.bg-gray { background: var(--nu-canvas) !important; }

body > .container.bg-nu-green {
    margin-top: 34px !important;
    padding: 22px !important;
    background: var(--nu-night) !important;
    border-radius: var(--nu-radius) !important;
    box-shadow: var(--nu-shadow);
}

#flota { padding-top: 28px; }
#flota .card { min-height: 100%; padding: 22px !important; box-shadow: none; }
#flota .card-title { font-size: 20px; font-weight: 720; }
#flota .img-thumbnail { height: 180px; width: 100%; object-fit: contain; }

article, .nu-document, .container > .text-justify {
    color: #344039;
    line-height: 1.75;
}

#map { border-radius: var(--nu-radius); box-shadow: var(--nu-shadow); }

/* Modals */
.modal-content { overflow: hidden; border: 0; border-radius: var(--nu-radius); box-shadow: 0 24px 80px rgba(7,20,9,.3); }
.modal-header.bg-nu-green { background: var(--nu-night) !important; border-bottom: 0; }

/* Shared footer */
footer.container-fluid {
    margin-top: 0;
    padding: 58px 5vw 24px !important;
    color: rgba(255,255,255,.74);
    background: #111b13 !important;
    border-top: 4px solid var(--nu-green);
}

footer .container-fluid { max-width: 1380px; padding: 0; }
footer .row { row-gap: 28px; }
footer .footer-nu { margin: 0 0 21px; padding: 0 20px 0 0; }
footer .footer-nu li { margin: 0 0 8px; color: rgba(255,255,255,.64); font-size: 13px; line-height: 1.45; }
footer .footer-nu li:first-child { margin-bottom: 12px; color: #fff; font-size: 13px; letter-spacing: .055em; text-transform: uppercase; }
footer .simple { color: rgba(255,255,255,.64); }
footer .simple:hover { color: #fff; }
footer .display-redes-nu { display: flex; justify-content: center; gap: 14px; font-size: 25px; }
footer .w-100.text-center { margin-top: 26px; padding-top: 22px; border-top: 1px solid rgba(255,255,255,.1); }

@media (max-width: 991.98px) {
    #mn { min-height: 90px; padding: 0 24px; }
    #contlag { margin-bottom: -20px; }
    #mn .navbar { min-height: 88px; }
    #logos img { height: 65px !important; }
    #navbarTogglerDemo02 { margin: 9px -24px -8px; padding: 8px 24px 20px; background: #fff; border-top: 1px solid var(--nu-line); }
    body.nu-home .nu-hero, body.nu-home .nu-hero .carousel, body.nu-home .nu-hero .carousel-inner, body.nu-home .nu-hero .carousel-item { min-height: 760px; }
    .nu-hero-copy { top: 50px; right: 7vw; left: 7vw; }
    body.nu-home .arriba { top: 315px; right: 5vw; left: 5vw; }
    body.nu-home #resv { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    body.nu-home #ofisal { grid-column: 1 / -1; }
    body.nu-home #cbxregreso { grid-column: 1; justify-self: start; }
    body.nu-home #cbxretorno { grid-column: 1 / -1; margin-left: 24px !important; }
    body.nu-home #ofregcont { grid-column: 1 / -1; }
    body.nu-home #resv > .form-row:nth-of-type(2), body.nu-home #resv > .form-row:nth-of-type(3), body.nu-home #resv > .form-group:nth-of-type(4), body.nu-home #divedad, body.nu-home #resv > .form-row.mb-2, body.nu-home #resv > .text-center { grid-column: auto; }
    .nu-fleet-grid { grid-template-columns: 1fr 1fr; }
    .nu-fleet-card:last-child { grid-column: 1 / -1; }
    .nu-promo-grid { grid-template-columns: 1fr 1fr; }
    .nu-promo-card:first-child { grid-column: 1 / -1; }
    .nu-location-band .nu-section { gap: 36px; }
    .modal-dialog { width: auto; max-width: calc(100vw - 32px); margin: 16px auto; }
    #map { width: 100%; min-height: 360px !important; }
    body:not(.nu-home) > .container,
    body:not(.nu-home) > .container-fluid:not(#mn):not(footer) { max-width: 100%; }
}

@media (min-width: 768px) and (max-width: 991.98px) {
    #flota > [class*="col-"] { flex: 0 0 50%; max-width: 50%; }
    footer .col-md-4 { padding-right: 14px !important; padding-left: 14px !important; }
}

@media (max-width: 767.98px) {
    #mn { padding: 0 18px; }
    #contlag { position: absolute; top: 12px; right: 82px; margin: 0; padding: 0; }
    #lbllag { display: none; }
    body.nu-home .nu-hero, body.nu-home .nu-hero .carousel, body.nu-home .nu-hero .carousel-inner, body.nu-home .nu-hero .carousel-item { min-height: 895px; }
    body.nu-home .debajo { visibility: visible; }
    body.nu-home .nu-hero::after { background: linear-gradient(180deg, rgba(9,18,10,.67), rgba(9,18,10,.28) 40%, rgba(9,18,10,.48)); }
    .nu-hero-copy { top: 44px; right: 20px; left: 20px; width: auto; max-width: calc(100vw - 40px); }
    .nu-hero-copy h1 { max-width: 100%; font-size: clamp(34px, 10vw, 42px); overflow-wrap: anywhere; }
    .nu-hero-copy p { font-size: 16px; }
    body.nu-home .arriba { top: 320px; right: 16px; left: 16px; width: auto; max-width: calc(100vw - 32px); }
    body.nu-home #frm { padding: 18px !important; }
    body.nu-home #resv { display: block; }
    body.nu-home #resv > * { margin-bottom: 9px !important; }
    body.nu-home #cbxregreso { margin: 5px 5px 8px 0 !important; }
    body.nu-home #cbxretorno { display: inline-block; margin: 0 0 8px 4px !important; }
    body.nu-home #resv .form-row { margin-right: -5px; margin-left: -5px; }
    body.nu-home #resv .form-row > [class*="col-"] { padding-right: 5px; padding-left: 5px; }
    .nu-section { padding: 52px 18px; }
    .nu-section-head { display: block; }
    .nu-section-head p { margin-top: 12px; }
    .nu-fleet-grid, .nu-promo-grid, .nu-location-band .nu-section, .nu-location-points { grid-template-columns: 1fr; }
    .nu-fleet-card:last-child, .nu-promo-card:first-child { grid-column: auto; }
    .nu-fleet-card { min-height: 300px; }
    footer.container-fluid { padding: 46px 22px 22px !important; }
    body:not(.nu-home) > .container,
    body:not(.nu-home) > .container-fluid:not(#mn):not(footer) { padding-right: 16px; padding-left: 16px; }
    body > .container.bg-nu-green { margin-top: 18px !important; padding: 16px !important; border-radius: 10px !important; }
    #flota { margin-right: -8px; margin-left: -8px; }
    #flota > [class*="col-"] { flex: 0 0 100%; max-width: 100%; padding-right: 8px; padding-left: 8px; }
    #flota .card { padding: 18px !important; }
    #map { min-height: 310px !important; }
    .jumbotron, .jumbotron-nu-gray, fieldset.scheduler-border { padding: 20px 16px !important; }
    .modal-dialog { max-width: calc(100vw - 24px); margin: 12px auto; }
    .modal-body { padding: 16px; }
    .table-responsive { width: 100%; overflow-x: auto; -webkit-overflow-scrolling: touch; }
    table.table { display: block; width: 100%; max-width: 100%; overflow-x: auto; white-space: nowrap; -webkit-overflow-scrolling: touch; }
    .btn, button, [role="button"] { min-height: 44px; }
    footer .row > [class*="col-"] { flex: 0 0 100%; max-width: 100%; }
    footer .footer-nu { padding-right: 0; }
    footer .display-redes-nu { justify-content: flex-start; }
}

@media (prefers-reduced-motion: reduce) {
    html { scroll-behavior: auto; }
    *, *::before, *::after { transition-duration: .01ms !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; }
}
