/* blackroom.com.co v2: referentes: Paragon (estructura, movimiento) + Deus (menú, Records). Tono rockero y grunge. */
@font-face { font-family: "Inter Tight"; font-style: normal; font-weight: 100 900; font-display: swap; src: url("/assets/fonts/inter-tight-normal-latin.woff2") format("woff2"); }
@font-face { font-family: "Roboto"; font-style: normal; font-weight: 100 900; font-display: swap; src: url("/assets/fonts/roboto-normal-latin.woff2") format("woff2"); }
@font-face { font-family: "WPPageBuilder"; font-display: block; src: url("/assets/fonts/iconos-servicios.woff2") format("woff2"); }
@font-face { font-family: "Homemade Apple"; font-weight: 400; font-display: swap; src: url("fonts/homemade-apple-400.woff2") format("woff2"); }

:root {
  --negro: #101010; --negro-2: #1a1a1a; --hueso: #ffffff; --hueso-2: #f2f2f2; --gris: #8d8a84; --linea: rgba(16, 16, 16, .16); --linea-clara: rgba(255, 255, 255, .18);
  --acento: #f2e600; /* amarillo de las propuestas de BlackRoom: un solo color, fácil de cambiar */
  --display: "Inter Tight", system-ui, sans-serif; --texto: "Roboto", system-ui, sans-serif; --mano: "Homemade Apple", cursive;
  --pad: clamp(22px, 3.8vw, 76px); --max: 1680px; --nav-h: 56px;
}
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }
body { margin: 0; background: var(--hueso); color: var(--negro); font-family: var(--texto); font-size: 17px; line-height: 1.55; -webkit-font-smoothing: antialiased; overflow-x: hidden; }
img { display: block; max-width: 100%; height: auto; }
a { color: inherit; }
h1, h2, h3, h4, h5, h6, p, ul, ol, figure, dl, dd { margin: 0; padding: 0; }
ul { list-style: none; }
button { font: inherit; color: inherit; background: none; border: 0; cursor: pointer; }
.sr { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.centro { text-align: center; }
.s-in { max-width: var(--max); margin: 0 auto; padding: 0 var(--pad); }
.oculto-todo { display: none !important; }

/* grano (textura de fotocopia, sobre todo el sitio) */
.grano { position: fixed; inset: -50%; z-index: 90; pointer-events: none; opacity: .07; mix-blend-mode: multiply;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='220' height='220'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
  animation: grano 1s steps(4) infinite; }
@keyframes grano { 0% { transform: translate(0, 0); } 25% { transform: translate(-3%, 2%); } 50% { transform: translate(2%, -3%); } 75% { transform: translate(-2%, -1%); } }

/* ---------- tipografía ---------- */
.titular { display: flex; flex-direction: column; gap: .35em; margin-bottom: clamp(28px, 4vw, 64px); }
.titular.centro { align-items: center; }
.t-pre, .t-post { font-family: var(--display); font-weight: 400; font-size: clamp(13px, 1vw, 17px); letter-spacing: .2em; line-height: 1.15; text-transform: uppercase; }
.t-post { max-width: 46ch; }
.t-grande { font-family: var(--display); font-weight: 800; font-size: clamp(40px, 6.2vw, 116px); line-height: .9; letter-spacing: -.035em; text-transform: uppercase; }
.t-grande b, .t-grande strong { font-weight: 800; color: var(--acento); -webkit-text-stroke: 0; }
.t-medio { font-family: var(--display); font-weight: 800; font-size: clamp(24px, 2.6vw, 42px); line-height: 1; letter-spacing: -.02em; text-transform: uppercase; }
.n-gigante { font-family: var(--display); font-weight: 800; font-size: clamp(90px, 17vw, 300px); line-height: .85; letter-spacing: -.05em; }
.s-lead { font-size: clamp(18px, 1.45vw, 23px); line-height: 1.5; max-width: 62ch; }
.centro .s-lead { margin-left: auto; margin-right: auto; }

/* ---------- botones y enlaces ---------- */
.btn { display: inline-flex; align-items: center; gap: .6em; padding: .9em 1.2em .85em; border: 1.5px solid var(--negro); font-family: var(--display); font-weight: 700; font-size: clamp(13px, .95vw, 15px); letter-spacing: .12em; text-transform: uppercase; text-decoration: none; line-height: 1; transition: background .25s, color .25s, transform .25s; }
/* botones: negros sobre fondo claro, blancos sobre fondo oscuro o foto; al pasar el mouse, amarillos */
.btn, .btn-acento, .btn-negro, .btn-borde-claro { background: var(--negro); color: var(--hueso); border-color: var(--negro); }
:is(.ho-heroe, .srv-heroe, .s-cifras, .s-hoteles, .s-crece, .s-cta, .pie, .oscuro, .s-paneles, .s-cta-simple, .menu-movil, .hilton-caja) .btn { background: var(--hueso); color: var(--negro); border-color: var(--hueso); }
.btn:hover, :is(.ho-heroe, .srv-heroe, .s-cifras, .s-hoteles, .s-crece, .s-cta, .pie, .oscuro, .s-paneles, .s-cta-simple, .menu-movil, .hilton-caja) .btn:hover { background: var(--acento); color: var(--negro); border-color: var(--acento); }
.ico-flecha { width: .9em; height: .9em; flex: none; }
.enlace { display: inline-block; font-family: var(--display); font-weight: 700; font-size: clamp(13px, 1vw, 16px); letter-spacing: .12em; text-transform: uppercase; text-decoration: none; border-bottom: 2px solid currentColor; padding-bottom: 3px; transition: color .2s; }
.enlace:hover { color: var(--acento); }
.oscuro .enlace:hover, .s-hoteles .enlace:hover { color: var(--acento); }

/* ---------- cabecera (cajas tipo Paragon + menú desplegado tipo Deus) ---------- */
.nav { position: fixed; top: 0; left: 0; right: 0; z-index: 60; display: flex; justify-content: space-between; align-items: flex-start; gap: 16px; padding: 22px var(--pad) 0; pointer-events: none; transition: transform .35s; }
.nav.escondido { transform: translateY(-120%); }
.nav-izq, .nav-der { display: flex; pointer-events: auto; }
.nav-items { display: flex; }
.nav-caja { display: flex; align-items: center; height: var(--nav-h); padding: 0 18px; background: var(--hueso); border: 1.5px solid var(--negro); margin-left: -1.5px; font-family: var(--display); font-weight: 600; font-size: 14px; letter-spacing: .14em; text-transform: uppercase; text-decoration: none; color: var(--negro); white-space: nowrap; transition: background .2s, color .2s; }
.nav-izq > :first-child { margin-left: 0; }
.nav-caja:hover, .nav-caja[aria-expanded="true"] { background: var(--acento); color: var(--negro); }
.nav-caja[aria-current="page"] { background: var(--acento); color: var(--negro); }
.nav-logo { background: var(--negro); padding: 0 16px; }
.nav-logo img { filter: brightness(0) invert(1); transition: filter .2s; }
.nav-logo:hover { background: var(--acento); }
.nav-logo:hover img { filter: none; }
.nav-logo img { width: 128px; }
.nav-menu { display: none; }
.hamb { display: none; }
.nav-cinta { width: clamp(220px, 22vw, 360px); height: var(--nav-h); overflow: hidden; background: var(--hueso); border: 1.5px solid var(--negro); border-right: 0; display: flex; align-items: center; }
.cinta-mov { display: flex; gap: 14px; white-space: nowrap; font-family: var(--texto); font-weight: 500; font-size: 15px; text-transform: uppercase; letter-spacing: .04em; animation: cinta 26s linear infinite; padding-left: 14px; }
.cinta-mov i { font-style: normal; opacity: .6; }
@keyframes cinta { to { transform: translateX(-50%); } }
.nav-cta { background: var(--negro); color: var(--hueso); gap: 10px; margin-left: 0; }
.nav-cta:hover { background: var(--acento); color: var(--negro); }

.mega { position: absolute; top: calc(22px + var(--nav-h) + 10px); left: var(--pad); right: var(--pad); background: var(--hueso); border: 1.5px solid var(--negro); pointer-events: auto; opacity: 0; visibility: hidden; transform: translateY(-8px); transition: opacity .25s, transform .25s, visibility 0s .25s; box-shadow: 0 30px 60px rgba(0, 0, 0, .25); }
.mega.abierto { opacity: 1; visibility: visible; transform: none; transition: opacity .25s, transform .25s; }
.mega-in { display: grid; grid-template-columns: minmax(260px, 1fr) 2.2fr; gap: 32px; padding: 28px; }
.mega-pre { font-family: var(--display); font-weight: 700; letter-spacing: .14em; text-transform: uppercase; font-size: 14px; color: var(--gris); margin-bottom: 14px; }
.mega-lista li a, .mega-lista li.prox { display: flex; justify-content: space-between; gap: 12px; padding: 5px 0; font-family: var(--display); font-weight: 700; font-size: 19px; letter-spacing: -.01em; line-height: 1.05; text-transform: uppercase; text-decoration: none; }
.mega-lista li a:hover span { color: var(--negro); background: var(--acento); }
.mega-lista small { font-family: var(--texto); font-size: 12px; letter-spacing: .08em; color: var(--gris); align-self: center; font-weight: 500; }
.mega-lista li.prox span { opacity: .45; }
.mega-lista li.sin-enlace { display: flex; justify-content: space-between; gap: 12px; padding: 5px 0; font-family: var(--display); font-weight: 700; font-size: 19px; text-transform: uppercase; }
.mega-lista-2 { columns: 2; column-gap: 28px; }
.mega-lista-2 li { break-inside: avoid; }
.mega-todo { display: inline-flex; gap: 8px; align-items: center; margin-top: 18px; font-family: var(--display); font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.mega-fotos { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; }
.mega-foto { display: flex; flex-direction: column; gap: 10px; text-decoration: none; font-family: var(--display); font-weight: 800; font-size: 20px; line-height: 1; text-transform: uppercase; }
.mega-foto img { width: 100%; aspect-ratio: 4 / 5; object-fit: cover; transition: transform .6s; }
.mega-foto:hover img { transform: scale(1.03); }
/* menú de Hoteles, con el funcionamiento del de Materia Prima */
.mega-hot { grid-template-columns: 5fr 7fr; gap: clamp(32px, 4vw, 64px); padding: 32px; align-items: start; }
.mh-pre { font-family: var(--display); font-size: 11px; font-weight: 700; letter-spacing: .18em; text-transform: uppercase; color: var(--gris); margin-bottom: 6px; }
.mh-cols { display: grid; grid-template-columns: 1fr 1fr; grid-template-rows: repeat(var(--filas, 7), auto); grid-auto-flow: column; column-gap: clamp(20px, 2.4vw, 40px); } /* se lee por columnas, de arriba abajo */
.mh-item { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; padding: 11px 0; border-bottom: 1px solid var(--linea); text-decoration: none; color: var(--negro); }
.mh-nom { font-family: var(--display); font-weight: 700; font-size: clamp(14px, 1.05vw, 16px); text-transform: uppercase; letter-spacing: -.005em; line-height: 1.15; opacity: .45; transition: opacity .3s, transform .35s cubic-bezier(.2, .7, .2, 1); }
.mh-item.is-on .mh-nom, .mh-item:hover .mh-nom, .mh-item:focus-visible .mh-nom { opacity: 1; transform: translateX(6px); }
.mh-cat { font-size: 10.5px; letter-spacing: .14em; text-transform: uppercase; color: var(--gris); white-space: nowrap; transition: color .3s; }
.mh-item.is-on .mh-cat { color: var(--negro); }
.mh-prox { margin-top: 18px; font-size: 13px; line-height: 1.5; color: var(--gris); }
.mh-prox span { display: block; font-family: var(--display); font-size: 10.5px; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; margin-bottom: 2px; }
.mh-todo { display: inline-flex; align-items: center; gap: 8px; margin-top: 20px; font-family: var(--display); font-size: 12px; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: var(--negro); text-decoration: none; }
.mh-todo:hover { background: var(--acento); }
.mh-media { position: relative; aspect-ratio: 16 / 10; overflow: hidden; background: var(--negro); }
.mh-img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; opacity: 0; transform: scale(1.05); transition: opacity .6s cubic-bezier(.2, .7, .2, 1), transform 1.3s cubic-bezier(.2, .7, .2, 1); }
.mh-img.is-on { opacity: 1; transform: none; }
.mh-media::after { content: ""; position: absolute; inset: 0; pointer-events: none; background: linear-gradient(180deg, rgba(0, 0, 0, 0) 45%, rgba(16, 16, 16, .72) 100%); }
.mh-cap { position: absolute; left: 26px; right: 26px; bottom: 22px; z-index: 1; color: var(--hueso); font-family: var(--display); font-weight: 800; font-size: clamp(22px, 2vw, 32px); line-height: 1; letter-spacing: -.03em; text-transform: uppercase; }
.mh-cols--1 { grid-template-columns: 1fr; grid-template-rows: none; grid-auto-flow: row; }
.mh-temas { display: flex; flex-wrap: wrap; gap: 6px 18px; }
.mh-temas a { font-size: 13px; color: var(--negro); text-decoration: none; border-bottom: 1px solid var(--linea); }
.mh-temas a:hover { background: var(--acento); }
/* menú de Noticias: temas a la izquierda; a la derecha la nota más reciente del tema */
.mega-blog { grid-template-columns: 4fr 8fr; }
.mega-blog .mh-nom { font-size: clamp(18px, 1.5vw, 24px); letter-spacing: -.02em; }
.mh-notas { display: grid; }
.mh-nota { grid-area: 1 / 1; display: grid; grid-template-columns: 1.15fr 1fr; gap: 0 clamp(20px, 2.4vw, 36px); align-content: start; text-decoration: none; color: var(--negro); opacity: 0; visibility: hidden; transition: opacity .45s, visibility 0s .45s; }
.mega.abierto .mh-nota.is-on { opacity: 1; visibility: visible; transition: opacity .45s; } /* solo con el menú abierto: si no, la nota invisible tapaba la página y se robaba el mouse */
.mh-nota-img { grid-row: 1 / span 3; aspect-ratio: 4 / 3; overflow: hidden; background: var(--hueso-2); }
.mh-nota-img img { width: 100%; height: 100%; object-fit: cover; transform: scale(1.04); transition: transform 1.2s cubic-bezier(.2, .7, .2, 1); }
.mh-nota.is-on .mh-nota-img img { transform: none; }
.mh-nota-meta { align-self: end; font-size: 10.5px; letter-spacing: .14em; text-transform: uppercase; color: var(--gris); margin-bottom: 10px; }
.mh-nota-tit { font-family: var(--display); font-weight: 800; font-size: clamp(22px, 2vw, 32px); line-height: 1.02; letter-spacing: -.03em; text-transform: uppercase; }
.mh-nota-leer { display: inline-flex; align-items: center; gap: 8px; align-self: start; margin-top: 16px; font-family: var(--display); font-size: 12px; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; }
.mh-nota:hover .mh-nota-leer { background: var(--acento); }
/* la página de atrás se oscurece un poco mientras un menú está abierto */
.mega-velo { position: fixed; inset: 0; z-index: 59; background: rgba(16, 16, 16, .34); opacity: 0; pointer-events: none; transition: opacity .4s; }
.mega-velo.on { opacity: 1; pointer-events: auto; }

.menu-movil { position: fixed; inset: 0; z-index: 55; background: var(--negro); color: var(--hueso); padding: 120px var(--pad) 40px; overflow-y: auto; }
.menu-movil ul { margin-bottom: 30px; }
.menu-movil a:not(.btn) { display: block; padding: 8px 0; font-family: var(--display); font-weight: 800; font-size: 32px; letter-spacing: -.03em; line-height: 1; text-transform: uppercase; text-decoration: none; border-bottom: 1px solid var(--linea-clara); }

/* ---------- pantalla de carga ---------- */
.carga { position: fixed; inset: 0; z-index: 100; display: none; }
.js .carga.activa { display: block; }
.carga-logos { position: absolute; inset: 0; background: var(--negro); display: grid; place-items: center; transition: transform .8s cubic-bezier(.77, 0, .18, 1); }
.carga-logos img { grid-area: 1 / 1; width: min(42vw, 360px); max-height: 30vh; object-fit: contain; filter: brightness(0) invert(1); opacity: 0; }
.carga-logos img.ver { opacity: 1; }
.carga-logos .carga-br { width: min(64vw, 560px); }
.carga-cortina { position: absolute; inset: 0; background: var(--hueso); transform: translateY(100%); transition: transform .8s cubic-bezier(.77, 0, .18, 1); }
.carga.sube .carga-cortina { transform: translateY(0); }
.carga.sale .carga-logos { transform: translateY(-100%); }
.carga.sale .carga-cortina { transform: translateY(-100%); transition-delay: .12s; }

/* ---------- aparecer al bajar ---------- */
.js [data-ap] { opacity: 0; transform: translateY(36px); transition: opacity .9s ease, transform .9s cubic-bezier(.2, .7, .2, 1); }
.js [data-ap].visto { opacity: 1; transform: none; }

/* ---------- inicio: héroe calado (la palabra deja ver las fotos/video de atrás) ---------- */
/* líneas de avance de los encabezados con varias fotos (referente Paragon) */
.h-barras { position: absolute; left: 16px; right: 16px; bottom: 16px; z-index: 2; display: flex; gap: clamp(6px, 1vw, 16px); } /* a 16 px de los lados y de abajo */
.h-barra { flex: 1; padding: 12px 0 0; background: none; border: 0; cursor: pointer; }
.h-barra i { display: block; position: relative; height: 2px; background: rgba(255, 255, 255, .4); overflow: hidden; transition: background .25s; }
.h-barra i::after { content: ""; position: absolute; inset: 0; background: var(--hueso); transform: scaleX(0); transform-origin: left; }
.h-barra.activa i::after { animation: llenar var(--dur, 4200ms) linear forwards; }
.h-barra:hover i { background: rgba(255, 255, 255, .6); }
.h-barra:focus-visible { outline: 2px solid var(--acento); outline-offset: 2px; }
@keyframes llenar { to { transform: scaleX(1); } }
@media (prefers-reduced-motion: reduce) { .h-barra.activa i::after { animation: none; transform: scaleX(1); } }
/* inicio: encabezado como el original + fotos que pasan a ancho completo */
.h-ini { background: var(--hueso); }
.h-ini-tit { padding: calc(22px + var(--nav-h) + clamp(64px, 9vw, 150px)) var(--pad) clamp(44px, 5vw, 90px); margin: 0; }
.h-ini-tit .t-grande { font-size: clamp(40px, 6.6vw, 124px); }
.h-ini-tit .t-pre, .h-ini-tit .t-post { font-size: clamp(12px, .9vw, 15px); }
.h-ini-tit .t-post { max-width: none; }
.h-ini-fotos { position: relative; width: 100%; height: clamp(380px, 78vh, 820px); overflow: hidden; background: var(--negro); }
.h-ini-fotos::after { content: ""; position: absolute; inset: auto 0 0; height: 30%; z-index: 1; pointer-events: none; background: linear-gradient(to top, rgba(0, 0, 0, .45), rgba(0, 0, 0, 0)); } /* sombra suave abajo: las líneas se leen sobre fotos claras */
.h-heroe { position: relative; min-height: 100vh; min-height: 100svh; display: flex; flex-direction: column; color: var(--hueso); overflow: hidden; background: var(--negro); }
.h-media { position: absolute; inset: 0 0 -12% 0; z-index: 0; will-change: transform; }
/* Velo negro sobre la foto (debajo del texto): da contraste cuando la foto es muy clara. Se va aclarando hacia arriba. */
.h-heroe::after { content: ""; position: absolute; inset: 0; z-index: 0; pointer-events: none; background: linear-gradient(to top, rgba(0, 0, 0, .6) 0%, rgba(0, 0, 0, .45) 30%, rgba(0, 0, 0, .15) 60%, rgba(0, 0, 0, 0) 80%); }
.h-foto, .h-video { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; background: center / cover no-repeat; opacity: 0; transition: opacity 1.2s; transform: scale(1.12); }
.h-foto.activa, .h-video { opacity: 1; animation: kenburns 9s linear forwards; }
@keyframes kenburns { from { transform: scale(1.02); } to { transform: scale(1.14); } }
.h-banner { position: relative; z-index: 1; padding-top: calc(22px + var(--nav-h) + clamp(24px, 4vw, 70px)); background: linear-gradient(var(--hueso), var(--hueso)) top / 100% calc(22px + var(--nav-h) + clamp(24px, 4vw, 70px)) no-repeat; }
.h-calado { display: block; width: 100%; height: auto; margin: -1px 0 -1px; }
.h-calado .cal-fondo { fill: var(--hueso); }
.h-calado text { font-family: var(--display); font-weight: 800; }
.h-calado .cal-1 { font-size: 148px; }
.h-calado .cal-2 { font-size: 49.6px; }
.h-calado + * { margin: 0; }
.h-banner::after { content: ""; position: absolute; left: 0; right: 0; bottom: -2px; height: 2px; background: var(--hueso); display: none; }
.h-pie { position: relative; z-index: 1; margin-top: auto; padding: 40px var(--pad) clamp(26px, 4.5vh, 52px); display: flex; flex-direction: column; align-items: center; gap: 18px; text-align: center; }
.h-lema { display: flex; flex-direction: column; align-items: center; gap: 8px; text-transform: uppercase; text-shadow: 0 2px 20px rgba(0, 0, 0, .45); }
.h-lema-pre { font-family: var(--display); font-weight: 400; font-size: clamp(13px, 1.1vw, 18px); letter-spacing: .22em; line-height: 1.3; }
.h-lema-grande { font-family: var(--display); font-weight: 800; font-size: clamp(28px, 3.3vw, 58px); letter-spacing: -.035em; line-height: .95; }

/* ---------- cifras ---------- */
.s-cifras { background: var(--negro); color: var(--hueso); padding: clamp(80px, 10vw, 170px) 0 clamp(50px, 6vw, 90px); }
.cifras { display: grid; grid-template-columns: repeat(4, 1fr); border-top: 1px solid var(--linea-clara); }
.cifra { padding: clamp(22px, 2.6vw, 44px) clamp(14px, 1.6vw, 28px); border-bottom: 1px solid var(--linea-clara); border-right: 1px solid var(--linea-clara); }
.cifra:nth-child(4n) { border-right: 0; }
.cifra-n { font-family: var(--display); font-weight: 600; font-size: clamp(32px, 3.6vw, 66px); line-height: .95; letter-spacing: -.04em; }
.cifra-t { margin-top: 10px; font-size: 13px; letter-spacing: .14em; text-transform: uppercase; color: rgba(255, 255, 255, .7); }
.aviso { margin-top: 36px; font-size: 11px; line-height: 1.5; color: rgba(255, 255, 255, .45); max-width: 120ch; }

/* ---------- lo que operamos ---------- */
.s-operamos { padding: clamp(80px, 10vw, 170px) 0; }
.p-servicios .s-operamos { padding-top: 0; } /* en Servicios va justo después de las tarjetas: no se duplica el espacio */
.operamos { display: grid; grid-template-columns: 1.2fr 1fr; gap: clamp(30px, 6vw, 110px); align-items: start; }
.operamos-lista { display: grid; grid-template-columns: 1fr 1fr; border-top: 1.5px solid var(--negro); }
.operamos-lista li { display: flex; gap: 12px; align-items: center; padding: 14px 4px; border-bottom: 1px solid var(--linea); font-family: var(--display); font-weight: 500; font-size: clamp(13px, 1vw, 15px); letter-spacing: .12em; text-transform: uppercase; line-height: 1.05; }
.operamos-lista li:nth-child(odd) { padding-right: 18px; }
.op-ico { width: 22px; height: 22px; flex: none; display: grid; place-items: center; }
.op-ico svg { width: 18px; height: 18px; }
.op-times { color: #b4271b; }
.op-times { text-decoration: line-through; text-decoration-thickness: 2px; }
.operamos { align-items: center; }
.logos-h { display: grid; grid-template-columns: repeat(3, 1fr); gap: clamp(36px, 4vw, 64px) clamp(20px, 3vw, 48px); align-items: center; justify-items: center; }
.logo-h { display: grid; place-items: center; }
.logo-h img { width: calc(var(--w) * 1px); max-width: 100%; height: auto; filter: brightness(0); opacity: .82; transition: opacity .25s; }
.logo-h:hover img { opacity: 1; }
/* Hilton: cuadro negro con las marcas en blanco */
.hilton-caja { margin-top: clamp(40px, 5vw, 80px); background: var(--negro); color: var(--hueso); display: flex; align-items: center; gap: clamp(24px, 3vw, 56px); padding: clamp(32px, 3vw, 56px) clamp(24px, 3vw, 56px); }
/* una sola franja: "Somos operador" + Hilton | línea | las cuatro marcas. El logo de Hilton mide lo mismo que los dos renglones */
.hilton-izq { flex: 0 0 auto; display: flex; align-items: center; gap: clamp(14px, 1.6vw, 28px); padding-right: clamp(24px, 3vw, 56px); border-right: 1px solid var(--linea-clara); font-size: clamp(26px, 3.9vw, 72px); }
.hilton-izq .t-grande { font-size: 1em; }
.hilton { height: 1.62em; width: auto; filter: brightness(0) invert(1); }
.marcas-h { flex: 1; list-style: none; display: flex; justify-content: space-between; align-items: center; gap: clamp(12px, 2vw, 40px); }
.marca-h img { display: block; width: min(calc(var(--w) * .8px), calc(var(--w) * .055vw)); height: auto; }
.marca-h img.a-blanco { filter: brightness(0) invert(1); }

/* ---------- manifiesto ---------- */
.s-manifiesto { padding: clamp(60px, 8vw, 140px) 0; border-top: 1.5px solid var(--negro); }
.s-manifiesto .t-grande { text-wrap: balance; } /* reparte el título en renglones parejos, sin una palabra sola */
.manif-gop { font-size: clamp(21px, 1.9vw, 30px); line-height: 1.4; max-width: 42ch; margin: 0 0 clamp(40px, 4.5vw, 72px); } /* lo principal del modelo: cobramos sobre el GOP */
.manif-txt { columns: 3 300px; column-gap: clamp(24px, 3vw, 56px); font-size: clamp(17px, 1.25vw, 20px); }
.manif-txt p { break-inside: avoid; margin-bottom: 1.1em; }

/* ---------- lista grande (hoteles / socios), como los directores de Paragon ---------- */
.s-hoteles { position: relative; background: var(--negro); color: var(--hueso); padding: clamp(90px, 10vw, 170px) 0; overflow: hidden; }
.hl-fondos { position: absolute; inset: 0; z-index: 0; }
.hl-fondo { position: absolute; inset: 0; background: center / cover no-repeat; opacity: 0; transition: opacity .5s; filter: grayscale(.4) brightness(.38); transform: scale(1.04); }
.hl-fondo.activo { opacity: 1; }
.s-hoteles .s-in { position: relative; z-index: 1; }
.s-hoteles .titular .t-post { text-transform: none; letter-spacing: 0; font-family: var(--texto); font-weight: 400; font-size: 17px; max-width: 52ch; }
.hl-lista { border-top: 1px solid var(--linea-clara); margin-bottom: clamp(48px, 5vw, 80px); }
.hl-ciudad { position: relative; font-family: var(--display); font-weight: 400; font-size: clamp(13px, 1vw, 17px); letter-spacing: .2em; text-transform: uppercase; text-align: center; margin-bottom: 18px; } /* separa la lista por ciudad */
.hl > a, .hl > div { position: relative; display: flex; align-items: center; justify-content: center; gap: 4px clamp(10px, 1.5vw, 24px); flex-wrap: wrap; padding: clamp(6px, .65vw, 11px) 0; border-bottom: 1px solid var(--linea-clara); text-decoration: none; transition: color .3s, opacity .3s; }
.hl-nom { font-family: var(--display); font-weight: 700; font-size: clamp(24px, 3.3vw, 60px); line-height: 1; text-transform: uppercase; letter-spacing: -.04em; text-align: center; }
.hl-mini { width: 0; overflow: hidden; transition: width .45s cubic-bezier(.2, .7, .2, 1); flex: none; }
.hl-mini img { width: clamp(70px, 6.5vw, 116px); max-width: none; aspect-ratio: 4 / 3; object-fit: cover; }
.hl-meta { flex-basis: 100%; text-align: center; font-size: 12px; letter-spacing: .14em; text-transform: uppercase; color: rgba(255, 255, 255, .5); height: 0; overflow: hidden; transition: height .35s; }
.hl-tag { font-family: var(--display); font-weight: 800; font-size: 14px; letter-spacing: .1em; text-transform: uppercase; background: var(--hueso); color: var(--negro); padding: 4px 8px; transform: rotate(-4deg); }
.hl-lista:hover .hl:not(:hover) > * { opacity: .3; }
.hl:hover .hl-nom { color: var(--acento); }
.hl:hover .hl-mini { width: clamp(70px, 6.5vw, 116px); }
.hl:hover .hl-meta { height: 1.6em; }

/* ---------- pilares ("Always in pursuit") ---------- */
.s-pilares { background: var(--hueso); color: var(--negro); padding: clamp(80px, 9vw, 160px) 0; }
.s-pilares .pilar p { color: rgba(16, 16, 16, .78); }
.s-pilares .pilares-txt { color: rgba(16, 16, 16, .72); }
.pilares-cab { display: flex; justify-content: space-between; align-items: flex-start; gap: 30px; }
.pilares-logo img { width: clamp(120px, 12vw, 220px); }
.pilares { display: grid; grid-template-columns: repeat(3, 1fr); gap: clamp(24px, 4vw, 80px); margin: clamp(20px, 3vw, 50px) 0 clamp(30px, 4vw, 60px); }
.pilar h3 { font-family: var(--display); font-weight: 600; font-size: clamp(18px, 1.5vw, 25px); line-height: 1.02; letter-spacing: -.025em; text-transform: uppercase; margin-bottom: 18px; }
.pilar p { font-size: 16px; color: rgba(255, 255, 255, .78); max-width: 42ch; }
.pilares-claro .pilar p { color: rgba(16, 16, 16, .78); }
.pilares-txt { max-width: 70ch; color: rgba(255, 255, 255, .7); margin-bottom: 30px; }

/* ---------- polaroids (crecimiento acelerado) ---------- */
.s-crece { position: relative; background: var(--negro); color: var(--hueso); padding-bottom: 6vh; }
/* el título queda detrás: las polaroids pasan por encima */
/* el título se queda fijo mientras pasan las tarjetas y termina justo encima de "+ Otras 12 nuevas aperturas";
   --tit-h (alto del título) lo mide v2.js; el espacio final de la lista queda libre para que ninguna tarjeta lo tape */
.crece-pista { position: relative; padding-top: clamp(80px, 9vw, 150px); } /* aire arriba: el título no arranca pegado al borde del negro */
.crece-tit { position: sticky; top: max(calc(22px + var(--nav-h) + 56px), calc(50vh - (var(--tit-h, 340px) + 130px) / 2)); /* título + "Otras 12" quedan centrados juntos, lejos del menú */ display: grid; place-items: start center; z-index: 0; pointer-events: none; }
.crece-tit .titular { margin-bottom: 0; }
.crece-nota { font-family: var(--mano); font-size: clamp(18px, 1.7vw, 28px); line-height: 1.6; color: var(--acento); transform: rotate(-3deg); margin-top: 12px; }
.pol-lista { position: relative; z-index: 1; margin-top: calc(-1 * var(--tit-h, 340px)); padding: 70vh 3vw calc(var(--tit-h, 340px) + 14vh); display: flex; flex-wrap: wrap; }
.pol { width: 26%; position: relative; } /* cada tarjeta va encima de la siguiente (z-index en el HTML): la de abajo se mete por debajo y no tapa el nombre de la de arriba */
.pol figure { background: #ffffff; padding: 12px 12px 0; box-shadow: 0 18px 40px rgba(0, 0, 0, .45); }
.pol img { width: 100%; aspect-ratio: 1 / 1; object-fit: cover; filter: saturate(.92) contrast(1.04); }
.pol figcaption { font-family: var(--mano); font-weight: 400; color: #4b2bbf; font-size: clamp(15px, 1.3vw, 22px); line-height: 1.55; padding: 12px 6px 16px; min-height: 3.1em; }
.pol:nth-child(9n+1) { transform: rotate(8.78deg); margin-left: -2%; margin-top: -2%; }
.pol:nth-child(9n+2) { transform: rotate(-13.98deg); margin-left: 22%; margin-right: 3%; margin-top: -6%; }
.pol:nth-child(9n+3) { transform: rotate(6.58deg); margin-left: auto; margin-right: .6%; margin-top: 6.6%; }
.pol:nth-child(9n+4) { transform: rotate(-5.97deg); margin-left: 2%; margin-right: 1.2%; margin-top: -8%; }
.pol:nth-child(9n+5) { transform: rotate(16.22deg); margin-left: auto; margin-right: 1.2%; margin-top: -5%; }
.pol:nth-child(9n+6) { transform: rotate(-8.2deg); margin-left: auto; margin-right: -2%; margin-top: 8%; }
.pol:nth-child(9n+7) { transform: rotate(-13.98deg); margin-left: 22%; margin-right: 3%; margin-top: 4%; }
.pol:nth-child(9n+8) { transform: rotate(-8.2deg); margin-left: auto; margin-right: -2%; margin-top: 8%; }
.pol:nth-child(9n+9) { transform: rotate(6.58deg); margin-left: 30%; margin-right: auto; margin-top: 4.6%; }
.crece-fin { position: relative; z-index: 2; padding: clamp(24px, 3vw, 48px) var(--pad) 10vh; }

/* ---------- campus ---------- */
.s-campus { padding: clamp(80px, 10vw, 170px) 0; }
.campus { display: grid; grid-template-columns: 1fr 1.15fr; gap: clamp(30px, 5vw, 90px); align-items: center; }
.campus-txt p { margin-bottom: 1em; font-size: clamp(17px, 1.25vw, 20px); max-width: 56ch; }
.campus-logo { width: 220px; margin-top: 20px; }
.campus-foto img { width: 100%; }

/* ---------- noticias (tarjetas) ---------- */
.s-notis { background: var(--hueso-2); padding: clamp(70px, 8vw, 140px) 0; }
.notis-cab { display: flex; justify-content: space-between; align-items: flex-end; gap: 20px; margin-bottom: clamp(24px, 3vw, 46px); }
.notis-cab .titular { margin: 0; }
.notis { display: grid; grid-template-columns: repeat(3, 1fr); gap: clamp(16px, 2vw, 32px); }
.post-card { display: flex; flex-direction: column; gap: 12px; text-decoration: none; }
.pc-fecha { font-size: 12px; letter-spacing: .14em; text-transform: uppercase; color: var(--gris); text-align: right; }
.pc-img { overflow: hidden; }
.pc-img img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; transition: transform .6s; }
.post-card:hover .pc-img img { transform: scale(1.04); }
.pc-tit { font-family: var(--display); font-weight: 600; font-size: clamp(18px, 1.4vw, 23px); line-height: 1.08; letter-spacing: -.02em; text-transform: uppercase; }
.post-card:hover .pc-tit { text-decoration: underline; text-decoration-thickness: 2px; }
.pc-autor { font-size: 13px; color: var(--gris); }

/* ---------- llamado con stickers que se arrastran ---------- */
.s-cta { position: relative; min-height: 100vh; background: var(--negro); color: var(--hueso); overflow: hidden; display: grid; place-items: center; padding: 120px var(--pad); }
.stickers { position: absolute; inset: 0; z-index: 2; pointer-events: none; }
.sticker { position: absolute; pointer-events: auto; cursor: grab; touch-action: none; user-select: none; background: #fff; border-radius: 26px; padding: 22px 26px; box-shadow: 0 0 0 6px #fff, 0 16px 34px rgba(0, 0, 0, .5); display: grid; place-items: center; }
.sticker:active { cursor: grabbing; }
.sticker img { width: clamp(80px, 10vw, 170px); filter: brightness(0); pointer-events: none; }
.st-1 { top: 12%; left: 6%; transform: rotate(-12deg); background: var(--acento); }
.st-2 { top: 9%; left: 62%; transform: rotate(9deg); border-radius: 50%; padding: 34px; }
.st-3 { top: 18%; right: 4%; transform: rotate(18deg); background: #ffb878; }
.st-4 { bottom: 9%; left: 4%; transform: rotate(10deg); border-radius: 50%; padding: 34px; background: #b4e39e; }
.st-5 { bottom: 14%; right: 8%; transform: rotate(-14deg); background: #e3d0a2; }
.st-6 { top: 42%; left: 2%; transform: rotate(-6deg); }
.st-7 { bottom: 6%; left: 40%; transform: rotate(5deg); background: var(--acento); }
.st-8 { top: 6%; left: 30%; transform: rotate(-4deg); border-radius: 50%; padding: 34px; }
.st-br { top: 46%; right: 3%; transform: rotate(-8deg); background: var(--acento); border-radius: 14px; }
.st-br img { width: clamp(160px, 15vw, 260px); filter: none; }
.st-campus { bottom: 24%; left: 18%; transform: rotate(7deg); }
.st-campus img { filter: none; }
.cta-in { position: relative; z-index: 1; text-align: center; display: flex; flex-direction: column; align-items: center; gap: 26px; pointer-events: none; }
.cta-in a { pointer-events: auto; }
.cta-tit { font-family: var(--display); font-weight: 800; font-size: clamp(46px, 8vw, 150px); line-height: .88; letter-spacing: -.045em; text-transform: uppercase; max-width: 9ch; }
.enlace-claro { color: var(--hueso); }

/* ---------- pie ---------- */
.pie { background: var(--negro); color: var(--hueso); padding: clamp(60px, 7vw, 110px) var(--pad) 26px; position: relative; z-index: 3; }
.pie-arriba { display: grid; grid-template-columns: 1fr .7fr 1.3fr 1fr; gap: 30px; max-width: var(--max); margin: 0 auto; }
.pie-menu a { display: inline-block; padding: 4px 0; font-size: 16px; text-decoration: none; }
.pie-menu a:hover { color: var(--acento); }
.pie-grande { font-family: var(--display); font-weight: 800; font-size: clamp(24px, 2vw, 34px); line-height: .95; letter-spacing: -.03em; text-transform: uppercase; }
.pie-chico { font-family: var(--display); font-weight: 700; letter-spacing: .14em; text-transform: uppercase; margin: 10px 0 22px; color: rgba(255, 255, 255, .7); }
.pie-tit { font-family: var(--display); font-weight: 800; letter-spacing: .1em; text-transform: uppercase; margin-bottom: 10px; }
.pie-datos p { margin-bottom: 14px; color: rgba(255, 255, 255, .8); font-size: 15px; }
.pie-datos a { text-decoration: none; }
.pie-logo { max-width: var(--max); margin: clamp(60px, 7vw, 120px) auto 30px; }
.pie-logo img { width: 100%; }
.pie-baja { max-width: var(--max); margin: 0 auto; display: flex; justify-content: space-between; gap: 20px; font-size: 13px; color: rgba(255, 255, 255, .55); }

/* ---------- páginas interiores ---------- */
.s-pagtit { padding: calc(22px + var(--nav-h) + clamp(60px, 9vw, 150px)) 0 clamp(40px, 5vw, 80px); }
.s-pagtit .s-lead { margin-top: -10px; }
.oscuro { background: var(--negro); color: var(--hueso); }
.chips { display: flex; flex-wrap: wrap; justify-content: center; gap: 0; margin: 10px 0 24px; }
.chip { padding: 10px 16px; border: 1.5px solid currentColor; margin-left: -1.5px; font-family: var(--display); font-weight: 800; letter-spacing: .06em; text-transform: uppercase; text-decoration: none; font-size: 16px; }
.chip.activo, .chip:hover { background: var(--hueso); color: var(--negro); }
.vista { display: inline-flex; border: 1.5px solid var(--hueso); }
.vista button { padding: 9px 18px; font-family: var(--display); font-weight: 800; letter-spacing: .06em; text-transform: uppercase; font-size: 15px; }
.vista button.activo { background: var(--hueso); color: var(--negro); }
.s-filas { padding: 0 0 clamp(70px, 8vw, 140px); }
.filas { border-top: 1px solid var(--linea-clara); }
.filas-claras { border-top-color: var(--linea); }
.fila { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: clamp(20px, 3vw, 60px); padding: clamp(26px, 3vw, 52px) 0; border-bottom: 1px solid var(--linea-clara); }
.filas-claras .fila { border-bottom-color: var(--linea); }
.fila-tit { font-family: var(--display); font-weight: 700; font-size: clamp(21px, 1.8vw, 31px); line-height: 1.02; letter-spacing: -.025em; text-transform: uppercase; margin-bottom: 18px; }
.fila-tit a { text-decoration: none; }
.fila-tit a:hover { color: var(--acento); }
.filas-claras .fila-tit a:hover { color: inherit; background: var(--acento); }
.fila-meta { font-size: 15px; opacity: .75; margin-bottom: 4px; }
.fila-img { overflow: hidden; }
.fila-img img { width: 100%; aspect-ratio: 16 / 9; object-fit: cover; transition: transform .6s; }
.fila:hover .fila-img img { transform: scale(1.03); }
.fila-der { display: flex; flex-direction: column; justify-content: space-between; align-items: flex-start; gap: 18px; }
.fila-der p { font-size: 16px; opacity: .85; }
.fila-der .enlace { align-self: flex-end; }
.fila-est svg { width: 18px; height: 18px; }
.fila-simple { grid-template-columns: 2fr 1fr; align-items: center; }
.fila-simple .fila-tit { margin: 0; }
.fila-simple .fila-der { align-items: flex-end; }
.filas.grilla { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0 clamp(16px, 2vw, 32px); border: 0; }
.filas.grilla .fila { grid-template-columns: 1fr; grid-auto-flow: row; gap: 14px; }
.filas.grilla .fila-img { order: -1; }
.filas.grilla .fila-der p, .filas.grilla .fila-est { display: none; }
.paginas { display: flex; gap: 0; justify-content: center; margin-top: 40px; }
.pag { padding: 10px 18px; border: 1.5px solid currentColor; margin-left: -1.5px; font-family: var(--display); font-weight: 800; text-decoration: none; }
.pag.activo { background: var(--hueso); color: var(--negro); }

/* ---------- artículo (estética de los posts de Paragon) ---------- */
.lectura { position: fixed; top: 0; left: 0; right: 0; height: 4px; z-index: 70; }
.lectura span { display: block; height: 100%; width: 0; background: var(--acento); }
.art-cab { padding: calc(22px + var(--nav-h) + clamp(70px, 8vw, 140px)) 0 clamp(30px, 4vw, 60px); }
.art-cab .t-pre a { text-decoration: none; border-bottom: 2px solid var(--acento); }
.art-tit { font-family: var(--display); font-weight: 800; font-size: clamp(34px, 4.6vw, 84px); line-height: .95; letter-spacing: -.035em; text-transform: uppercase; max-width: 16ch; margin-top: 18px; }
.art-portada img { width: 100%; max-height: 82vh; object-fit: cover; }
.art-cuerpo { display: grid; grid-template-columns: 1fr minmax(0, 720px) 1fr; gap: clamp(20px, 4vw, 70px); max-width: var(--max); margin: 0 auto; padding: clamp(50px, 6vw, 100px) var(--pad) clamp(70px, 8vw, 130px); border-top: 1px solid var(--linea); }
.art-sin-portada { border-top: 0; padding-top: 0; }
.art-comparte, .art-autor { position: sticky; top: 110px; align-self: start; display: flex; flex-direction: column; gap: 10px; font-size: 14px; }
.art-comparte p { font-size: 12px; letter-spacing: .14em; text-transform: uppercase; color: var(--gris); }
.art-comparte a { width: 38px; height: 38px; display: grid; place-items: center; border: 1.5px solid var(--negro); font-family: var(--display); font-weight: 800; text-decoration: none; text-transform: uppercase; }
.art-comparte a:hover { background: var(--acento); }
.art-autor { border-top: 3px solid var(--acento); padding-top: 14px; justify-self: end; min-width: 180px; }
.aa-nom { font-family: var(--display); font-weight: 800; font-size: 20px; text-transform: uppercase; }
.aa-nom a { text-decoration: none; }
.art-txt { font-size: 18px; line-height: 1.7; }
.art-txt > * + * { margin-top: 1.1em; }
.art-txt h2, .art-txt h3, .art-txt h4 { font-family: var(--display); font-weight: 700; text-transform: uppercase; line-height: 1.05; letter-spacing: -.02em; margin-top: 1.8em; }
.art-txt h2 { font-size: clamp(24px, 2vw, 32px); }
.art-txt h3 { font-size: clamp(21px, 1.7vw, 27px); }
.art-txt h4 { font-size: 20px; }
.art-txt ul, .art-txt ol { padding-left: 1.3em; }
.art-txt ul { list-style: disc; }
.art-txt li + li { margin-top: .4em; }
.art-txt a { text-decoration-color: var(--acento); text-decoration-thickness: 2px; }
.art-txt img { margin: 1.4em 0; width: 100%; }
.art-txt figure { margin: 1.6em 0; }
.art-txt figcaption { font-size: 13px; color: var(--gris); text-align: center; padding-top: 10px; }
.art-txt blockquote { border-left: 4px solid var(--acento); padding-left: 20px; font-size: 22px; font-family: var(--display); font-weight: 700; text-transform: uppercase; line-height: 1.1; }
.art-txt table { width: 100%; border-collapse: collapse; font-size: 15px; display: block; overflow-x: auto; }
.art-txt td, .art-txt th { border: 1px solid var(--linea); padding: 8px 10px; text-align: left; }
.s-mas { border-top: 1.5px solid var(--negro); }
.s-cta-simple { background: var(--negro); color: var(--hueso); padding: clamp(70px, 8vw, 140px) 0; }
.s-cta-simple .t-grande { margin-bottom: 26px; }

/* ---------- servicios ---------- */
.srv-heroe { position: relative; min-height: 88vh; min-height: 88svh; display: flex; align-items: flex-end; color: var(--hueso); background: var(--negro) var(--bg) center / cover no-repeat; }
.srv-heroe::before { content: ""; position: absolute; inset: 0; background: linear-gradient(to top, rgba(0, 0, 0, .78) 0%, rgba(0, 0, 0, .45) 45%, rgba(0, 0, 0, .2) 100%); }
.srv-heroe-in { position: relative; width: 100%; padding-top: calc(22px + var(--nav-h) + 60px); padding-bottom: clamp(48px, 7vw, 110px); }
.srv-heroe-txt .t-grande { max-width: 13ch; font-size: clamp(42px, 6.4vw, 112px); line-height: .92; text-wrap: balance; }
.srv-heroe .btn { white-space: nowrap; }
.srv-heroe-cta { display: flex; align-items: center; flex-wrap: wrap; gap: 14px 22px; margin-top: clamp(26px, 3vw, 40px); }
.srv-heroe .btn { font-size: clamp(14px, 1.1vw, 17px); padding: 1.05em 1.5em 1em; }
.srv-heroe-nota { font-family: var(--display); font-size: 13px; letter-spacing: .16em; text-transform: uppercase; opacity: .8; }
.s-planes { padding: clamp(80px, 9vw, 160px) 0; }
.planes { display: grid; grid-template-columns: repeat(3, 1fr); gap: clamp(16px, 2vw, 32px); margin-bottom: 50px; } /* cada servicio en su propia tarjeta */
.plan { padding: clamp(22px, 2.6vw, 42px); border: 1.5px solid var(--negro); display: flex; flex-direction: column; gap: 16px; background: #fff; }
.plan .operamos-lista { grid-template-columns: 1fr; }
.plan .operamos-lista li { font-size: 18px; padding: 10px 0; }
.plan-pre { font-family: var(--display); font-weight: 700; letter-spacing: .14em; text-transform: uppercase; font-size: 14px; }
.plan-tit { font-family: var(--display); font-weight: 800; font-size: clamp(30px, 2.7vw, 46px); line-height: .95; letter-spacing: -.035em; text-transform: uppercase; }
.plan-precio { margin-top: auto; padding-top: 14px; border-top: 1.5px solid var(--negro); }
.plan-n { font-family: var(--display); font-weight: 800; font-size: clamp(28px, 2.4vw, 40px); letter-spacing: -.03em; line-height: 1; text-transform: uppercase; }
.plan-nota { font-size: 13px; color: var(--gris); }
.s-paneles { background: var(--negro); color: var(--hueso); padding: clamp(80px, 9vw, 160px) 0; }
.paneles { display: grid; grid-template-columns: repeat(3, 1fr); border-top: 1px solid var(--linea-clara); border-left: 1px solid var(--linea-clara); }
.panel { padding: clamp(24px, 3vw, 48px); border-right: 1px solid var(--linea-clara); border-bottom: 1px solid var(--linea-clara); min-height: 300px; display: flex; flex-direction: column; gap: 16px; transition: background .3s, color .3s; }
.panel:hover { background: var(--negro-2); }
.panel-ico { font-family: "WPPageBuilder"; font-size: 50px; line-height: 1; height: 50px; speak: none; -webkit-font-smoothing: antialiased; }
.panel-tit { font-family: var(--display); font-weight: 800; font-size: clamp(24px, 2.1vw, 36px); line-height: .95; letter-spacing: -.03em; text-transform: uppercase; margin-top: auto; }
.panel p { font-size: 16px; opacity: .85; }
.s-ventas { padding: clamp(80px, 9vw, 160px) 0; }
.plataformas { list-style: none; display: grid; grid-template-columns: repeat(5, 1fr); align-items: center; justify-items: center; gap: clamp(40px, 4.5vw, 72px) clamp(20px, 3vw, 48px); margin: clamp(48px, 5.5vw, 88px) 0 clamp(56px, 6.5vw, 100px); }
.plataformas img { display: block; width: min(calc(var(--w) * 1px), calc(var(--w) * .075vw)); max-width: 100%; height: auto; } /* 5 por fila siempre: en celular se achican, no se alarga la página */
@media (max-width: 599px) { .plataformas { gap: 22px 12px; } }
.dos-col { columns: 2 320px; column-gap: 50px; font-size: 18px; }
.dos-col p { margin-bottom: 1em; break-inside: avoid; }
.s-lesek { padding: clamp(80px, 9vw, 160px) 0; border-top: 1.5px solid var(--negro); }
/* como el original: título centrado arriba, foto a la izquierda y texto + razones con íconos a la derecha */
.lesek { display: grid; grid-template-columns: 37fr 63fr; gap: clamp(24px, 3vw, 48px); align-items: stretch; max-width: 1240px; margin: 0 auto; }
.lesek-foto img { width: 100%; height: 100%; object-fit: cover; object-position: center top; } /* la foto llega hasta el botón */
.lesek-txt .s-lead { margin-bottom: 32px; }
.lesek-h3 { font-family: var(--display); font-weight: 800; font-size: clamp(22px, 1.9vw, 30px); line-height: 1.05; letter-spacing: -.02em; text-transform: uppercase; margin-bottom: 28px; }
.razones { list-style: none; display: grid; gap: 18px; margin-bottom: 36px; }
.lesek-txt .btn { margin-bottom: 0; }
.razones li { display: flex; align-items: center; gap: clamp(16px, 1.8vw, 26px); }
.raz-ico { flex: 0 0 auto; width: clamp(52px, 4.6vw, 72px); aspect-ratio: 1; border-radius: 50%; background: var(--negro); display: grid; place-items: center; }
.raz-ico svg { width: 36%; height: 36%; fill: var(--hueso); }
.raz-tit { font-family: var(--display); font-weight: 700; font-size: 17px; line-height: 1.2; text-transform: uppercase; letter-spacing: .02em; margin-bottom: 4px; }
.razones p { font-size: 17px; line-height: 1.4; }
@media (max-width: 767px) { .lesek { grid-template-columns: 1fr; } .lesek-foto { max-width: 420px; } .lesek-foto img { height: auto; } }

/* ---------- nosotros ---------- */
.nos-heroe { padding: calc(22px + var(--nav-h) + clamp(50px, 7vw, 120px)) 0 clamp(60px, 7vw, 120px); }
.nos-heroe-in { display: grid; grid-template-columns: 1.1fr 1fr; gap: clamp(30px, 5vw, 90px); align-items: center; }
.nos-heroe-txt .s-lead { margin-bottom: 1em; }
.nos-heroe-foto img { width: 100%; }
/* página Hoteles: fotos de los hoteles que se turnan + texto + mapa pequeño */
.ho-heroe { position: relative; min-height: 88vh; min-height: 88svh; display: flex; align-items: flex-end; color: var(--hueso); background: var(--negro); overflow: hidden; }
.ho-media { position: absolute; inset: 0; }
.ho-heroe::after { content: ""; position: absolute; inset: 0; pointer-events: none; background: linear-gradient(to top, rgba(0, 0, 0, .75) 0%, rgba(0, 0, 0, .45) 40%, rgba(0, 0, 0, .1) 75%); }
.ho-in { position: relative; z-index: 1; width: 100%; display: flex; justify-content: space-between; align-items: flex-end; gap: clamp(30px, 5vw, 90px); padding-top: calc(22px + var(--nav-h) + 60px); padding-bottom: clamp(44px, 5vw, 76px); /* deja sitio a las líneas de avance */ }
.ho-logo { display: block; width: clamp(220px, 26vw, 420px); height: auto; margin-bottom: 18px; } /* el logo de BR Hotels reemplaza el título; el H1 queda para Google */
.ho-txt .t-post { margin-bottom: 18px; }
.ho-txt .s-lead { margin-bottom: 28px; max-width: 44ch; }
/* cierre de Hoteles: el mapa de BR Hotels se funde en el negro, con el botón encima */
.ho-cierre { position: relative; background: var(--negro); color: var(--hueso); height: clamp(420px, 54vw, 900px); display: grid; place-items: center; overflow: hidden; }
/* la página del mapa de BR Hotels completa; se funde en negro solo arriba y abajo */
.ho-cierre-mapa { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: top center; opacity: .7; filter: brightness(.7); -webkit-mask-image: linear-gradient(to bottom, transparent 0%, #000 24%, #000 68%, transparent 100%); mask-image: linear-gradient(to bottom, transparent 0%, #000 24%, #000 68%, transparent 100%); }
/* foto de la viajera con BR Hotels en pantalla (Alejo 2026-10-22): centrada en la pantalla del computador */
.ho-cierre-foto { object-position: center 45%; }
.ho-cierre-in { position: relative; z-index: 1; }
.ho-cierre .btn { background: var(--hueso); color: var(--negro); border-color: var(--hueso); font-size: clamp(14px, 1.1vw, 17px); padding: 1.1em 1.5em 1.05em; box-shadow: 0 20px 50px rgba(0, 0, 0, .55); }
.ho-cierre .btn:hover { background: var(--acento); border-color: var(--acento); }
.ho-cierre-cred { position: absolute; right: var(--pad); bottom: 14px; font-size: 11px; color: rgba(255, 255, 255, .4); }
/* flecha para bajar, en la franja negra bajo el encabezado de Hoteles */
.ho-bajar { position: absolute; top: clamp(18px, 3.5vh, 40px); left: 50%; width: 44px; height: 44px; margin-left: -22px; display: grid; place-items: center; z-index: 2; color: var(--hueso); border: 1.5px solid rgba(255, 255, 255, .35); border-radius: 50%; transition: border-color .25s, color .25s; }
.ho-bajar svg { width: 18px; height: 18px; transform: rotate(90deg); animation: bajar 1.8s ease-in-out infinite; }
.ho-bajar:hover { color: var(--acento); border-color: var(--acento); }
@keyframes bajar { 0%, 100% { translate: 0 -3px; } 50% { translate: 0 5px; } }
@media (prefers-reduced-motion: reduce) { .ho-bajar svg { animation: none; } }
.ho-btns { display: flex; flex-wrap: wrap; gap: 14px; }
.ho-heroe .btn-sec { background: transparent; color: var(--hueso); border-color: var(--hueso); } /* segundo botón: solo borde, para que el principal mande */
.s-socios .hl-nom { font-size: clamp(30px, 5vw, 92px); }
.s-socios .hl > a { padding: clamp(10px, 1.2vw, 18px) 0; }
.s-fichas { padding: clamp(70px, 8vw, 140px) 0; }
.fichas { display: grid; grid-template-columns: repeat(4, 1fr); gap: clamp(16px, 2vw, 32px); }
.ficha img { width: 100%; aspect-ratio: 3 / 4; object-fit: cover; margin-bottom: 18px; }
.ficha-nom { font-family: var(--display); font-weight: 800; font-size: clamp(24px, 2vw, 34px); line-height: .95; letter-spacing: -.03em; text-transform: uppercase; }
.ficha-rol { font-family: var(--display); font-weight: 400; letter-spacing: .08em; text-transform: uppercase; font-size: 15px; margin: 10px 0 14px; color: var(--gris); }
.ficha-txt { font-size: 15px; }
.s-fichas.oscuro .ficha-rol { color: #a9a6a0; } /* gris más claro: contraste AA sobre negro */
.s-equipo { padding: clamp(70px, 8vw, 140px) 0; background: var(--hueso-2); }
.equipo { display: grid; grid-template-columns: repeat(6, 1fr); gap: clamp(28px, 3vw, 48px) clamp(16px, 1.6vw, 28px); }
@media (max-width: 1279px) { .equipo { grid-template-columns: repeat(5, 1fr); } }
@media (max-width: 1099px) { .equipo { grid-template-columns: repeat(4, 1fr); } }
@media (max-width: 899px) { .equipo { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 599px) { .equipo { grid-template-columns: repeat(2, 1fr); } }
.eq-foto { overflow: hidden; margin-bottom: 14px; }
.eq-foto img { width: 100%; aspect-ratio: 630 / 830; object-fit: cover; object-position: center top; transform-origin: center top; transition: transform .6s; }
.eq:hover .eq-foto img { transform: scale(1.03); }
.eq-nom { font-family: var(--display); font-weight: 700; font-size: 20px; line-height: 1.05; letter-spacing: -.02em; text-transform: uppercase; }
.eq-cargo { font-size: 13px; letter-spacing: .1em; text-transform: uppercase; color: var(--gris); margin: 6px 0 10px; }
.eq-txt { font-size: 15px; }
.s-180 { padding: clamp(80px, 10vw, 170px) 0; background: var(--negro); color: var(--hueso); }
/* como el original: centrado, párrafo ancho (1140 px) para que quede en 5 renglones */
.s-180 .titular { margin-bottom: clamp(30px, 3vw, 48px); }
.s-180 .s-lead { max-width: 1140px; font-size: 20px; line-height: 1.6; }
@media (max-width: 767px) { .s-180 .s-lead { text-align: left; } }
.s-trabaja { padding: clamp(70px, 8vw, 140px) 0; background: var(--hueso-2); color: var(--negro); } /* gris claro: no se funde con el pie negro */
.s-trabaja .s-lead { margin: 20px auto 30px; }
/* "Trabaja con nosotros": carrusel con todas las vacantes (2026-10-26). Se desliza con el dedo, el trackpad o las flechas */
.vac-carrusel { max-width: var(--max); margin: clamp(50px, 6vw, 96px) auto 0; padding: 0 var(--pad); text-align: left; }
.vac-flechas { display: flex; justify-content: flex-end; gap: 0; margin-bottom: 18px; }
.vac-flecha { width: 52px; height: 52px; display: grid; place-items: center; border: 1.5px solid var(--negro); margin-left: -1.5px; background: var(--hueso); transition: background .2s; }
.vac-flecha:hover { background: var(--acento); }
.vac-flecha[data-mover="-1"] svg { transform: rotate(180deg); }
.vac-flecha:disabled { opacity: .3; cursor: default; background: var(--hueso); }
.vac-pista { display: grid; grid-auto-flow: column; grid-auto-columns: clamp(260px, 30%, 460px); gap: clamp(14px, 1.8vw, 28px); overflow-x: auto; scroll-snap-type: x mandatory; scroll-behavior: smooth; scrollbar-width: none; padding-bottom: 6px; }
.vac-pista::-webkit-scrollbar { display: none; }
.vac { scroll-snap-align: start; }
.vac a { display: flex; flex-direction: column; gap: 10px; text-decoration: none; color: var(--negro); }
.vac-img { overflow: hidden; }
.vac-img img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; transition: transform .8s cubic-bezier(.2, .7, .2, 1); }
.vac a:hover .vac-img img { transform: scale(1.05); }
.vac-meta { margin-top: 6px; font-size: 12px; letter-spacing: .14em; text-transform: uppercase; color: var(--gris); }
.vac-tit { font-family: var(--display); font-weight: 800; font-size: clamp(22px, 1.9vw, 32px); line-height: 1; letter-spacing: -.03em; text-transform: uppercase; }
.vac-ver { display: inline-flex; align-items: center; gap: 8px; align-self: flex-start; font-family: var(--display); font-weight: 700; font-size: 13px; letter-spacing: .12em; text-transform: uppercase; border-bottom: 2px solid currentColor; padding-bottom: 3px; }
.vac a:hover .vac-ver { background: var(--acento); }
.vac-hc { display: inline-block; height: 1.05em; width: auto; vertical-align: -.12em; filter: brightness(0); }
@media (max-width: 767px) { .vac-pista { grid-auto-columns: 80%; } }
/* ===== Empleos (rediseño 2026-10-26): portada como Servicios, filtros del blog y tarjetas del carrusel ===== */
.emp-heroe { min-height: 72vh; min-height: 72svh; }
.emp-heroe .t-grande { max-width: 14ch; }
.emp-heroe-p { margin-top: 20px; font-size: clamp(17px, 1.4vw, 22px); line-height: 1.45; max-width: 44ch; opacity: .9; }
.s-vacantes { padding: clamp(50px, 6vw, 100px) 0 clamp(80px, 9vw, 150px); }
.emp-filtros { justify-content: flex-start; margin: 0 0 clamp(30px, 3.5vw, 56px); }
.emp-filtros .chip { background: var(--hueso); color: var(--negro); cursor: pointer; }
.emp-filtros .chip:hover { background: var(--acento); }
.emp-filtros .chip.activo { background: var(--negro); color: var(--hueso); }
.vac-grilla { display: grid; grid-template-columns: repeat(6, 1fr); gap: clamp(36px, 4vw, 64px) clamp(16px, 2vw, 32px); }
.vac-grilla .vac { grid-column: span 2; }
.vac-grilla .vac[data-ancha] { grid-column: span 3; }
.vac-grilla .vac[data-ancha] .vac-img img { aspect-ratio: 16 / 9; }
.vac-grilla .vac[hidden] { display: none; }
@media (max-width: 1024px) { .vac-grilla { grid-template-columns: 1fr 1fr; } .vac-grilla .vac, .vac-grilla .vac[data-ancha] { grid-column: span 1; } .vac-grilla .vac[data-ancha] .vac-img img { aspect-ratio: 4 / 3; } }
@media (max-width: 640px) { .vac-grilla { grid-template-columns: 1fr; } .vac-ver { font-size: 11.5px; letter-spacing: .07em; } }
/* detalle de una vacante: portada con su foto, texto a la izquierda y ficha fija a la derecha */
.emp-det .t-grande { max-width: 16ch; font-size: clamp(40px, 5.6vw, 96px); }
.emp-volver a { font-family: var(--display); font-weight: 700; font-size: 13px; letter-spacing: .16em; text-transform: uppercase; text-decoration: none; border-bottom: 2px solid currentColor; padding-bottom: 3px; }
.emp-volver a:hover { color: var(--acento); }
.emp-volver { margin-bottom: 22px; }
.s-emp-det { padding: clamp(60px, 7vw, 120px) 0; }
.emp-det-in { display: grid; grid-template-columns: minmax(0, 1fr) minmax(300px, 400px); gap: clamp(40px, 6vw, 110px); align-items: start; }
.emp-txt { font-size: 18px; line-height: 1.65; max-width: 68ch; }
.emp-txt > * + * { margin-top: 1em; }
.emp-txt strong { font-family: var(--display); font-weight: 800; text-transform: uppercase; letter-spacing: -.01em; }
.emp-txt > p > strong:only-child { display: block; margin-top: 1.4em; font-size: clamp(20px, 1.6vw, 26px); }
.emp-txt ol, .emp-txt ul { padding-left: 1.2em; }
.emp-txt ul { list-style: disc; }
.emp-txt li + li { margin-top: .45em; }
.emp-txt ol > li { margin-top: 1em; }
.emp-ficha { position: sticky; top: 110px; border: 1.5px solid var(--negro); padding: clamp(24px, 2.4vw, 36px); display: grid; gap: 22px; background: #fff; }
.emp-ficha dl { display: grid; gap: 14px; }
.emp-ficha dt { font-size: 12px; letter-spacing: .14em; text-transform: uppercase; color: var(--gris); }
.emp-ficha dd { margin: 2px 0 0; font-family: var(--display); font-weight: 700; font-size: 19px; line-height: 1.15; text-transform: uppercase; }
.emp-ficha .btn { justify-self: start; }
.emp-ficha-nota { font-size: 14px; color: var(--gris); }
.emp-otras { padding: clamp(70px, 8vw, 140px) 0; }
.emp-otras .t-grande { font-size: clamp(36px, 4.4vw, 76px); }
@media (max-width: 1024px) { .emp-det-in { grid-template-columns: 1fr; } .emp-ficha { position: static; } }

/* ---------- contacto y FAQ ---------- */
.con { padding: calc(22px + var(--nav-h) + clamp(50px, 7vw, 120px)) 0 clamp(60px, 7vw, 120px); }
.con-in { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(30px, 5vw, 90px); }
.con-datos { display: grid; gap: 18px; margin-bottom: 30px; }
.con-datos dt { font-family: var(--display); font-weight: 700; letter-spacing: .14em; text-transform: uppercase; font-size: 14px; color: var(--gris); }
.con-datos dd { font-family: var(--display); font-weight: 700; font-size: clamp(19px, 1.5vw, 26px); line-height: 1.1; letter-spacing: -.02em; text-transform: uppercase; }
.con-datos a { text-decoration: none; }
.con-foto img { width: 100%; }
.con-der { border: 1.5px solid var(--negro); background: #fff; padding: clamp(22px, 3vw, 48px); align-self: start; box-shadow: 14px 14px 0 var(--acento); }
.fe-campos { display: flex; flex-wrap: wrap; gap: 18px; }
.fe-grupo { display: flex; flex-direction: column; gap: 6px; width: 100%; }
.fe-50 { width: calc(50% - 9px); }
.fe-html { font-family: var(--display); font-weight: 800; font-size: clamp(28px, 2.4vw, 42px); letter-spacing: -.03em; text-transform: uppercase; line-height: .9; }
.fe-grupo label { font-family: var(--display); font-weight: 700; letter-spacing: .12em; text-transform: uppercase; font-size: 13px; }
.fe-grupo input, .fe-grupo select, .fe-grupo textarea { font: inherit; padding: 12px; border: 1.5px solid var(--negro); background: var(--hueso); border-radius: 0; width: 100%; }
.fe-oculto { display: none; }
.fe-boton { padding: 14px 22px; background: var(--negro); color: var(--hueso); font-family: var(--display); font-weight: 800; letter-spacing: .08em; text-transform: uppercase; font-size: 18px; }
.fe-boton:hover { background: var(--acento); color: var(--negro); }
.aviso-sin-conectar { width: 100%; font-size: 14px; background: var(--acento); padding: 8px 10px; }
.con-mapa iframe { width: 100%; height: 420px; border: 0; display: block; filter: grayscale(1) contrast(1.1); }
.s-faq { padding: 0 0 clamp(70px, 8vw, 140px); }
.faq-g { margin-bottom: clamp(50px, 6vw, 100px); }
.faq-g .t-grande { font-size: clamp(32px, 3.8vw, 68px); }
.faq-lista { border-top: 1.5px solid var(--negro); }
.acc { border-bottom: 1px solid var(--linea); }
.acc summary { list-style: none; display: flex; justify-content: space-between; gap: 20px; align-items: center; padding: 20px 0; cursor: pointer; font-family: var(--display); font-weight: 700; font-size: clamp(18px, 1.5vw, 24px); line-height: 1.1; letter-spacing: -.02em; text-transform: uppercase; }
.acc summary::-webkit-details-marker { display: none; }
.acc-mas { width: 22px; height: 22px; flex: none; position: relative; }
.acc-mas::before, .acc-mas::after { content: ""; position: absolute; left: 0; right: 0; top: 50%; height: 2px; background: currentColor; transition: transform .3s; }
.acc-mas::after { transform: rotate(90deg); }
.acc[open] .acc-mas::after { transform: rotate(0); }
.acc[open] summary { color: var(--negro); }
.acc-r { padding: 0 0 24px; max-width: 80ch; font-size: 17px; }
.acc-r p + p { margin-top: .8em; }

/* ---------- records ---------- */
.s-records { padding: 0 0 clamp(70px, 8vw, 140px); }
.discos { display: grid; grid-template-columns: repeat(4, 1fr); gap: clamp(16px, 2vw, 32px); }
.disco-tapa { position: relative; aspect-ratio: 1 / 1; background: center / cover no-repeat; filter: grayscale(1) contrast(1.4); overflow: hidden; display: flex; flex-direction: column; justify-content: space-between; padding: 16px; transition: filter .4s; }
.disco-tapa::after { content: ""; position: absolute; inset: 0; background: var(--acento); mix-blend-mode: multiply; }
.disco:hover .disco-tapa { filter: grayscale(0) contrast(1.1); }
.disco-vol, .disco-hotel { position: relative; z-index: 1; font-family: var(--display); font-weight: 800; letter-spacing: -.03em; text-transform: uppercase; color: var(--negro); line-height: .85; }
.disco-vol { font-size: clamp(30px, 3vw, 54px); }
.disco-hotel { font-size: clamp(22px, 2vw, 34px); }
.disco-tit { font-family: var(--display); font-weight: 800; font-size: 22px; text-transform: uppercase; margin-top: 12px; }
.disco-meta { font-size: 13px; opacity: .6; }
.s-404 { padding: calc(22px + var(--nav-h) + 100px) 0 140px; }
.s-404 .btn { margin-top: 30px; }

/* ---------- tablet ---------- */
@media (max-width: 1024px) {
  .nav-items, .nav-cinta { display: none; }
  .nav-menu { display: flex; }
  .mega { display: none; }
  .cifras { grid-template-columns: repeat(2, 1fr); }
  .cifra:nth-child(4n) { border-right: 1px solid var(--linea-clara); }
  .cifra:nth-child(2n) { border-right: 0; }
  .ho-in { flex-direction: column; align-items: flex-start; }
  .operamos, .campus, .nos-heroe-in, .con-in { grid-template-columns: 1fr; }
  .fichas, .discos { grid-template-columns: repeat(2, 1fr); }
  .pie-arriba { grid-template-columns: 1fr 1fr; }
  .art-cuerpo { grid-template-columns: 1fr; }
  .art-comparte { position: static; flex-direction: row; align-items: center; order: 2; }
  .art-autor { position: static; justify-self: start; order: -1; }
  .fila { grid-template-columns: 1fr 1fr; }
  .fila-der { grid-column: 1 / -1; }
  .paneles { grid-template-columns: repeat(2, 1fr); }
  .planes { grid-template-columns: 1fr; }
  .pol { width: 34%; }
}

/* ---------- celular ---------- */
@media (max-width: 767px) {
  :root { --nav-h: 48px; }
  .nav { padding-top: 12px; }
  .nav-caja { padding: 0 14px; font-size: 16px; }
  .nav-logo img { width: 104px; }
  /* celular: logo a la izquierda y el menú de tres rayas a la derecha; Contáctanos vive dentro del menú */
  .nav-der { display: none; }
  .nav-izq { flex: 1; }
  .nav-menu { margin-left: auto; width: var(--nav-h); padding: 0; justify-content: center; }
  .nav-menu-txt { display: none; }
  .hamb { display: grid; gap: 5px; width: 20px; }
  .hamb i { display: block; height: 2px; background: currentColor; transition: transform .25s, opacity .25s; }
  .nav-menu[aria-expanded="true"] .hamb i:nth-child(1) { transform: translateY(7px) rotate(45deg); }
  .nav-menu[aria-expanded="true"] .hamb i:nth-child(2) { opacity: 0; }
  .nav-menu[aria-expanded="true"] .hamb i:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }
  .h-banner { padding-top: calc(12px + var(--nav-h) + 30px); background-size: 100% calc(12px + var(--nav-h) + 30px); }
  .h-calado .cal-2 { font-size: 49.6px; }
  .h-lema-grande { font-size: 27px; }
  .h-lema-pre { font-size: 11px; letter-spacing: .16em; }
  .cifras { grid-template-columns: 1fr 1fr; }
  .cifra-n { font-size: 29px; }
  .cifra-t { font-size: 11px; }
  .operamos-lista { grid-template-columns: 1fr; }
  .logos-h { grid-template-columns: repeat(2, 1fr); }
  .logo-h img { width: calc(var(--w) * .78px); }
  .hilton-caja { flex-direction: column; align-items: stretch; }
  .hilton-izq { justify-content: center; padding: 0 0 24px; border-right: 0; border-bottom: 1px solid var(--linea-clara); font-size: clamp(32px, 9vw, 48px); }
  .marca-h img { width: calc(var(--w) * .115vw); }
  .manif-txt { columns: 1; }
  .hl-nom { font-size: 22px; }
  .hl > a, .hl > div { padding: 8px 0; }
  .hl-meta { height: auto; }
  .hl-lista:hover .hl:not(:hover) > * { opacity: 1; }
  .pilares, .notis, .fichas { grid-template-columns: 1fr; }
  .pilares-cab { flex-direction: column; }
  .pol-lista { padding: 60vh 4vw calc(var(--tit-h, 260px) + 10vh); }
  .pol { width: 62%; }
  .pol:nth-child(odd) { margin-left: 0 !important; margin-right: auto !important; }
  .pol:nth-child(even) { margin-left: auto !important; margin-right: 0 !important; }
  .pol:nth-child(n) { margin-top: 4vh; }
  .sticker { padding: 14px 16px; border-radius: 18px; }
  .sticker img { width: 70px; }
  .st-br img { width: 120px; }
  .st-6, .st-7, .st-8, .st-campus { display: none; }
  .cta-tit { font-size: 44px; }
  .pie-arriba { grid-template-columns: 1fr; }
  .pie-baja { flex-direction: column; }
  .fila, .fila-simple { grid-template-columns: 1fr; }
  .fila-img { order: -1; }
  .filas.grilla { grid-template-columns: 1fr; }
  .vista { display: none; }
  .paneles, .discos { grid-template-columns: 1fr; }
  .panel { min-height: 0; }
  .fe-50 { width: 100%; }
  .art-tit { font-size: 33px; }
  .notis-cab { flex-direction: column; align-items: flex-start; }
}

@media (prefers-reduced-motion: reduce) {
  .grano, .cinta-mov, .h-foto.activa { animation: none; }
  .js [data-ap] { opacity: 1; transform: none; transition: none; }
}

/* Servicios: el nombre de la página va dentro del H1 (SEO), en pequeño sobre la pregunta (2026-10-25) */
.srv-heroe .srv-heroe-pre { display: block; margin-bottom: .6em; }

/* Servicios: botón "Ver el video" con latido + lightbox (2026-10-25) */
.ver-video { display: inline-flex; align-items: center; gap: 16px; padding: 0; border: 0; background: none; color: inherit; cursor: pointer; font: inherit; }
.ver-video-circulo { position: relative; flex: none; width: 64px; height: 64px; display: grid; place-items: center; border-radius: 50%; background: var(--hueso); color: var(--negro); transition: background .25s, transform .25s; }
.ver-video-circulo svg { margin-left: 3px; }
.ver-video-circulo::before, .ver-video-circulo::after { content: ""; position: absolute; inset: 0; border-radius: 50%; border: 2px solid var(--hueso); animation: vv-latido 2.4s cubic-bezier(.215, .61, .355, 1) infinite; pointer-events: none; }
.ver-video-circulo::after { animation-delay: 1.2s; }
@keyframes vv-latido { 0% { transform: scale(1); opacity: .7; } 100% { transform: scale(1.9); opacity: 0; } }
.ver-video-txt { display: flex; flex-direction: column; align-items: flex-start; font-family: var(--display); font-weight: 700; font-size: clamp(14px, 1.1vw, 17px); letter-spacing: .12em; text-transform: uppercase; line-height: 1.2; }
.ver-video-txt small { font-size: 12px; letter-spacing: .16em; opacity: .7; }
.ver-video:hover .ver-video-circulo, .ver-video:focus-visible .ver-video-circulo { background: var(--acento); transform: scale(1.08); }
.ver-video:focus-visible { outline: 2px solid var(--acento); outline-offset: 6px; }
@media (prefers-reduced-motion: reduce) { .ver-video-circulo::before, .ver-video-circulo::after { animation: none; opacity: 0; } }
.lb-video { position: fixed; inset: 0; z-index: 120; display: grid; place-items: center; padding: 70px 22px 22px; background: rgba(10, 10, 10, .97); opacity: 0; visibility: hidden; transition: opacity .3s, visibility .3s; }
.lb-video.abierto { opacity: 1; visibility: visible; }
.lb-video video { width: min(1200px, 100%); aspect-ratio: 16 / 9; background: #000; display: block; }
.lb-cerrar { position: absolute; top: 18px; right: 18px; width: 48px; height: 48px; display: grid; place-items: center; border: 1.5px solid var(--hueso); background: none; color: var(--hueso); cursor: pointer; transition: background .2s, color .2s, border-color .2s; }
.lb-cerrar:hover, .lb-cerrar:focus-visible { background: var(--acento); border-color: var(--acento); color: var(--negro); }

/* ===================== Contacto (2026-10-25): piezas del sitio + lo mínimo propio ===================== */
.ct-heroe .t-grande { max-width: 15ch; }
.ct-quien .plan-tit { margin-top: 4px; }
.ct-nota-mano { margin: 14px 0 0; }
.ct-wa-claro { display: inline-flex; align-items: center; gap: .6em; font-family: var(--display); font-weight: 700; font-size: clamp(14px, 1.1vw, 17px); letter-spacing: .12em; text-transform: uppercase; text-decoration: none; color: var(--hueso); border-bottom: 2px solid currentColor; padding-bottom: 4px; transition: color .2s; }
.ct-wa-claro:hover, .ct-wa-claro:focus-visible { color: var(--acento); }
.ct-cartas { display: grid; grid-template-columns: repeat(6, 1fr); gap: clamp(16px, 2vw, 32px); }
.ct-carta { grid-column: span 2; }
.ct-carta.ct-grande { grid-column: span 3; }
.ct-carta.ct-grande .plan-tit { font-size: clamp(34px, 3.6vw, 64px); }
.ct-carta-txt { font-size: clamp(16px, 1.2vw, 19px); max-width: 52ch; }
.ct-acciones { display: flex; flex-wrap: wrap; align-items: center; gap: 14px 22px; margin-top: auto; padding-top: 10px; }
.ct-escribe-in { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: clamp(30px, 5vw, 96px); align-items: start; }
.ct-pasos { grid-template-columns: 1fr 1fr; margin-bottom: 34px; }
.ct-pasos .panel { min-height: 0; }
.panel .ct-paso-n { opacity: 1; font-family: var(--display); font-weight: 800; font-size: clamp(44px, 4vw, 72px); line-height: .9; color: var(--hueso); }
.ct-form { display: grid; gap: 26px; align-content: start; }
.ct-dos { display: grid; grid-template-columns: 1fr 1fr; gap: 26px; }
.ct-campo { display: grid; gap: 8px; }
.ct-campo span { font-family: var(--display); font-weight: 700; font-size: 13px; letter-spacing: .16em; text-transform: uppercase; }
.ct-campo em { font-style: normal; font-weight: 400; letter-spacing: .06em; text-transform: none; opacity: .65; }
.ct-campo input, .ct-campo textarea, .ct-campo select { width: 100%; padding: 12px 0 10px; border: 0; border-bottom: 1.5px solid rgba(255, 255, 255, .55); border-radius: 0; background: transparent; color: var(--hueso); font: inherit; font-size: 18px; transition: border-color .2s; }
.ct-campo select { appearance: none; -webkit-appearance: none; cursor: pointer; background: transparent url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M3 6l5 5 5-5' fill='none' stroke='%23ffffff' stroke-width='1.8'/%3E%3C/svg%3E") no-repeat right 2px center / 14px; }
.ct-campo select option { color: var(--negro); }
.ct-campo textarea { resize: vertical; min-height: 120px; }
.ct-campo input:focus, .ct-campo textarea:focus, .ct-campo select:focus { outline: none; border-bottom-color: var(--acento); }
.ct-form .btn { justify-self: start; }
.ct-form .btn:disabled { opacity: .6; cursor: wait; }
.ct-estado { font-size: 16px; padding: 12px 14px; border-left: 3px solid var(--hueso); }
.ct-estado.ok { border-left-color: var(--acento); }
.ct-trampa { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.ct-dir { font-style: normal; font-family: var(--display); font-weight: 700; font-size: clamp(20px, 1.7vw, 28px); line-height: 1.2; text-transform: uppercase; }
.ct-tel { margin: 16px 0 30px; font-size: 18px; }
.ct-tel a { text-decoration: none; border-bottom: 1.5px solid currentColor; }
.ct-mapa { aspect-ratio: 4 / 3; overflow: hidden; }
.ct-mapa iframe { width: 100%; height: 100%; border: 0; display: block; }
.ct-br-in { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(40px, 6vw, 110px); align-items: center; }
.ct-br .t-grande { font-size: clamp(40px, 4.6vw, 76px); line-height: 1.08; }
.ct-br-p { margin: 24px 0 36px; font-size: clamp(17px, 1.3vw, 20px); line-height: 1.5; max-width: 40ch; color: rgba(255, 255, 255, .78); }
.ct-br .btn { background: var(--hueso); color: var(--negro); border-color: var(--hueso); }
.ct-br .btn:hover { background: var(--acento); border-color: var(--acento); }
.ct-br-foto { width: 100%; height: auto; aspect-ratio: 1; object-fit: cover; display: block; }
@media (max-width: 1024px) { .ct-br-in { grid-template-columns: 1fr; } }
@media (max-width: 1024px) {
  .ct-cartas { grid-template-columns: 1fr 1fr; }
  .ct-carta, .ct-carta.ct-grande { grid-column: span 1; }
  .ct-carta.ct-grande { grid-column: 1 / -1; }
  .ct-escribe-in { grid-template-columns: 1fr; }
}
@media (max-width: 640px) {
  .ct-cartas, .ct-pasos, .ct-dos { grid-template-columns: 1fr; }
  .ct-carta, .ct-carta.ct-grande { grid-column: 1 / -1; }
}

/* postulación a una vacante (2026-10-26): mismo bloque negro y campos del formulario de Contacto */
.ct-archivo input[type=file] { padding: 10px 0; font-size: 15px; color: var(--hueso); }
.ct-archivo input[type=file]::file-selector-button { margin-right: 14px; padding: .7em 1em; border: 1.5px solid var(--hueso); background: var(--hueso); color: var(--negro); font-family: var(--display); font-weight: 700; font-size: 12px; letter-spacing: .12em; text-transform: uppercase; cursor: pointer; }
.ct-archivo input[type=file]::file-selector-button:hover { background: var(--acento); border-color: var(--acento); }
.emp-ley { font-size: 13px; opacity: .65; }
.emp-postular .t-grande { font-size: clamp(36px, 4.4vw, 76px); }
