/* Shared fluid layout: spacious desktop sections and readable text columns. */
body > .container-fluid { padding-right: clamp(0px, 2vw, 32px); padding-left: clamp(0px, 2vw, 32px); }
.container { width: 100%; max-width: 1410px; padding-right: clamp(20px, 3vw, 56px); padding-left: clamp(20px, 3vw, 56px); }
main, main .row > *, form .row > * { min-width: 0; }
main > .container { display: flow-root; }
h1 { font-size: clamp(30px, 3.5vw, 50px); line-height: 1.15; }
main p, main li { overflow-wrap: break-word; }
main iframe { max-width: 100%; }
input, textarea, select { min-width: 0; max-width: 100%; }
textarea { resize: vertical; }

/* Logo remains in the layout instead of overlapping navigation and content. */
body > .container-fluid > .container:first-child { padding-top: 0; }
#navigation { padding: 16px 0; column-gap: 24px; }
#logo { position: static; padding: 0; flex: 0 0 auto; width: clamp(72px, 8vw, 124px); }
#logo img { width: 100%; max-height: none; height: auto; }
#navigation .navbar-collapse { min-width: 0; }
#navigation .nav { width: 100%; padding: 0; margin: 0; align-items: center; justify-content: flex-end; }
#navigation a.nav-link { padding: 10px 12px; line-height: 1.35; }
#navigation .nav-item:last-child .nav-link { display: flex; gap: 8px; }
#navigation .nav-item:last-child img { width: 28px; height: 28px; }
#navigation .navbar-toggler { min-width: 48px; min-height: 44px; }

/* Home imagery and navigation. */
#carousel-portada .carousel-item img { height: clamp(220px, 41vw, 640px); object-fit: cover; }
#cloud-letras { width: 560px !important; max-width: 100%; height: 310px; transform: none; }
.bg-fran-productor, .bg-idemm-pro-club { height: clamp(360px, 42vw, 640px); background-position: center; }
.bg-fran-productor { height: auto; min-height: 360px; aspect-ratio: 16 / 9; background-position: center top; }
.bg-fran-productor h2 { font-size: clamp(32px, 3.6vw, 54px); }
.bg-fran-productor h3 { font-size: clamp(18px, 1.6vw, 24px); line-height: 1.5; }
#productor-cabecera { height: clamp(280px, 42vw, 640px); }

/* Wider image and inventory layouts; keep long prose easy to read. */
#estudio .row { max-width: 1440px; }
#estudio h1 { font-size: clamp(30px, 3.5vw, 48px); }
#estudio h2 { font-size: clamp(26px, 3vw, 38px); overflow-wrap: break-word; }
#estudio p { font-size: 18px; line-height: 1.6; text-align: left; }
#estudio .col-md-12 img, #estudio .col > img { width: 100%; }
#quienes-somos-intro { max-width: 1080px; }
#quienes-somos .about-profile { max-width: 1320px; margin-right: auto; margin-left: auto; }
#productor-intro, #productor-saludo, #productor-texto { max-width: 1040px; margin-left: auto; margin-right: auto; }
#productor p { font-size: 18px; line-height: 1.65; text-align: left; }
#productor-saludo p { font-size: 21px; }
#idemm-pro-club .pro-club-content > .row { max-width: 1120px; }
#equipo .equipo-caja, #equipo .equipo-caja-backline-sub1 { padding: clamp(18px, 2vw, 30px); }
#equipo li { line-height: 1.55; }
#equipo h3 { overflow-wrap: break-word; }
#equipo > .container > .row > .col-lg-12 > p { padding: 24px !important; max-width: 1100px; margin: auto; }

/* Cover artwork uses the available width without uneven leftover gaps. */
#clientes-sup { width: 100%; }
#clientes-caratulas { display: grid; grid-template-columns: repeat(auto-fit, minmax(120px, 1fr)); }
#clientes-caratulas img { display: block; width: 100%; height: auto; margin: 0; }
#clientes-inf [id$="-letter"] { pointer-events: none; }
#clientes-productores h3, #clientes-ingenieros h3 { padding: 20px 24px; font-size: clamp(24px, 2.5vw, 30px); }

/* Prices and service titles must wrap without colliding with controls. */
#tarifas .tarifas { margin: 24px 0; }
#tarifas .tarifas ul li { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px; padding: 5px 0; }
#tarifas .tarifas ul li b { float: none; margin-left: auto; white-space: nowrap; }
#tarifas .condiciones-tarifas p { font-size: 17px; line-height: 1.6; }
#servicios-accordion { max-width: 1320px; margin: auto; }
#servicios-accordion h2 { font-size: clamp(20px, 2vw, 26px); line-height: 1.4; padding: 14px 24px; }
#servicios-produccion { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 8px 20px; }
#servicios-accordion .divMasInfo { float: none; margin: 0; }
#servicios-accordion .card-body { text-align: left; }
#servicios-accordion-otros { max-width: 1320px; }
#cursos iframe { width: 100%; max-width: 800px; height: auto; aspect-ratio: 610 / 344; }
#cursos .caja-cursos { height: auto; min-height: 100%; }

/* Contact and registration keep useful columns on desktop. */
#contacto-footer > .row { max-width: 1320px !important; }
#contacto-idemm-pro-club > .row { max-width: 1120px !important; }
#contacto-idemm-pro-club h1 { font-size: clamp(28px, 3vw, 40px); }
#contacto .container { padding-bottom: 30px; }
#contacto #contacto-footer { padding: 24px 0; }
#contacto-d { padding-left: 32px; }
#contacto-accesos-tren p, #contacto-situacion ul { text-align: left; }
#contacto-footer input, #contacto-footer textarea,
#contacto-idemm-pro-club input, #contacto-idemm-pro-club textarea { font-size: 16px; }
#form-contacto-general button, #contacto-idemm-pro-club-form button { min-height: 48px; }
#footer { padding-top: 28px; padding-bottom: 20px; }
#footer .footer-links { display: flex; flex-wrap: wrap; gap: 8px 16px; align-items: center; }
#footer .footer-links a { display: inline-block; margin: 0; padding: 4px 0; }
#infobox3 p { padding: 16px 20px; line-height: 1.5; }

@media (min-width: 768px) and (max-width: 1199px) {
    #clientes .col-md-3 { flex: 0 0 50%; max-width: 50%; }
    #equipo > .container > .row > .col-lg-4 { flex: 0 0 50%; max-width: 50%; }
    #equipo > .container > .row > .col-lg-4:last-child { flex-basis: 100%; max-width: 100%; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; }
    #contacto-i, #contacto-d { flex: 0 0 100%; max-width: 100%; }
    #contacto-d { margin-top: 32px; border-left: 0; border-top: 2px dotted #f0e7d6; padding: 24px 15px 0; }
}

@media (max-width: 1199px) {
    #navigation .navbar-collapse { flex-basis: 100%; }
    #navigation .nav { justify-content: flex-start; padding-top: 16px; }
    #navigation .nav-item { flex: 0 0 50%; }
}

@media (max-width: 767px) {
    body > .container-fluid { padding: 0; }
    .container { padding-left: 20px; padding-right: 20px; padding-top: 24px; }
    #navigation { padding: 12px 0; }
    #navigation .nav-item { flex-basis: 100%; }
    #navigation a.nav-link { padding: 12px 0; }
    .bg-fran-productor { background-position: 35% top; align-items: flex-end; }
    .bg-fran-productor > .col-md-6:first-child { display: none; }
    .bg-fran-productor .vcenterflex { padding: 24px; background: linear-gradient(transparent, rgba(0,0,0,.8)); }
    #estudio .row { margin-left: -15px; margin-right: -15px; }
    #estudio img { margin-top: 16px; }
    #quienes-somos .about-profile { margin: 0 15px; }
    #equipo .equipo-caja-backline-sub1 { margin-bottom: 20px; }
    #equipo > .container > .row > .col-lg-12 > p { padding: 16px 0 !important; }
    #tarifas .tarifas { margin: 16px 0; }
    #servicios-accordion h2 { padding: 12px 16px; }
    #servicios-accordion-otros { padding: 24px; border-radius: 20px; }
    #idemm-pro-club .pro-club-intro p { font-size: 20px; text-align: left; }
    #idemm-pro-club section h2 { font-size: 23px; }
    #idemm-pro-club .pro-club-requisitos { padding: 20px 16px; }
    #contacto-d { margin-top: 28px; padding: 24px 15px 0; border-left: 0; border-top: 2px dotted #f0e7d6; }
    #contacto-autobuses-lineas { padding: 12px 20px; }
    .datos-contacto-footer { justify-content: flex-start; margin-bottom: 20px; }
    #contacto-footer form label, #contacto-idemm-pro-club-form label { font-size: 18px; }
    #contacto-idemm-pro-club-form .separador-2 { margin: 24px auto; }
    #contacto-idemm-pro-club-form label[for="condiciones-idemm-pro-club"] { font-size: 17px !important; line-height: 1.6; }
    .legal-page .row { margin-left: -15px; margin-right: -15px; }
    .separador { margin: 32px auto; }
}

@media (max-width: 575px) {
    #cloud-letras { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); align-items: center; gap: 12px; width: 100% !important; height: auto; padding-bottom: 24px; }
    #cloud-letras a { position: static !important; font-size: clamp(22px, 6vw, 30px) !important; line-height: 1.3 !important; text-align: center; padding: 10px 0; }
    #clientes-caratulas { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

@media (prefers-reduced-motion: reduce) {
    .animated, .carousel-item { animation: none !important; transition: none !important; }
}

/* The edge-to-edge map has no room for Bootstrap's negative row gutters. */
#contacto > .container:last-child > .row { margin-left: 0; margin-right: 0; }
#contacto > .container:last-child > .row > .col { padding-left: 0; padding-right: 0; }

#clientes .col-md-3 { overflow: hidden; }
#clientes .col-md-3 li { font-family: 'Ubuntu', sans-serif; font-size: 15px; line-height: 1.5; padding: 3px 0; }

/* Imágenes de portada y Pro Club alineadas con los bordes del contenedor. */
#portada > .container.nopadding,
#idemm-pro-club > .container.nopadding { padding-left: 0; padding-right: 0; }
#portada > .container.nopadding > .row,
#idemm-pro-club > .container.nopadding > .row { margin-left: 0; margin-right: 0; }
