/* ==========================================================================
   RIMA CONSULTING — Hoja de estilos global
   Destino: este archivo es el que se pega en global.css de Wix Studio.
   Paleta y tipografias segun Cuaderno de Marca (julio 2026).
   ========================================================================== */

/* ---------- Tipografias alojadas en nuestro servidor ----------
   Antes se cargaban desde Google Fonts. Se trajeron aqui por dos motivos:
   bloqueaban el pintado de la pagina 1.460 ms en movil, y enviaban la IP del
   visitante a un tercero. Ahora no hay ninguna peticion externa en toda la web.

   font-display:swap muestra el texto con una tipografia del sistema mientras
   llega la definitiva, en vez de dejar la pagina en blanco.
   Los subconjuntos 'ext' cubren acentos y caracteres que el basico no trae; el
   navegador solo descarga el que necesita segun unicode-range. */
@font-face{font-family:'Montserrat';font-style:normal;font-weight:300;font-display:swap;
  src:url('../fonts/montserrat-300.woff2') format('woff2');
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Montserrat';font-style:normal;font-weight:300;font-display:swap;
  src:url('../fonts/montserrat-ext-300.woff2') format('woff2');
  unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:'Montserrat';font-style:normal;font-weight:400;font-display:swap;
  src:url('../fonts/montserrat-400.woff2') format('woff2');
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Montserrat';font-style:normal;font-weight:400;font-display:swap;
  src:url('../fonts/montserrat-ext-400.woff2') format('woff2');
  unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:'Montserrat';font-style:normal;font-weight:500;font-display:swap;
  src:url('../fonts/montserrat-500.woff2') format('woff2');
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Montserrat';font-style:normal;font-weight:500;font-display:swap;
  src:url('../fonts/montserrat-ext-500.woff2') format('woff2');
  unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:'Montserrat';font-style:normal;font-weight:600;font-display:swap;
  src:url('../fonts/montserrat-600.woff2') format('woff2');
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Montserrat';font-style:normal;font-weight:600;font-display:swap;
  src:url('../fonts/montserrat-ext-600.woff2') format('woff2');
  unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:'Playfair Display';font-style:normal;font-weight:500;font-display:swap;
  src:url('../fonts/playfair-500.woff2') format('woff2');
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Playfair Display';font-style:normal;font-weight:500;font-display:swap;
  src:url('../fonts/playfair-ext-500.woff2') format('woff2');
  unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:'Playfair Display';font-style:normal;font-weight:600;font-display:swap;
  src:url('../fonts/playfair-600.woff2') format('woff2');
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Playfair Display';font-style:normal;font-weight:600;font-display:swap;
  src:url('../fonts/playfair-ext-600.woff2') format('woff2');
  unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:'Playfair Display';font-style:normal;font-weight:700;font-display:swap;
  src:url('../fonts/playfair-700.woff2') format('woff2');
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Playfair Display';font-style:normal;font-weight:700;font-display:swap;
  src:url('../fonts/playfair-ext-700.woff2') format('woff2');
  unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}

:root{
  /* Paleta de marca */
  --antracita:#121212;      /* fondo oscuro. El negro puro se evita */
  --blanco-roto:#F8F7F2;
  --oro:#C8AF78;            /* solo acentos, nunca fondo grande */
  --piedra:#4A4A47;

  --oro-suave:rgba(200,175,120,.16);
  --linea:rgba(200,175,120,.28);

  /* Escala de texto sobre fondo oscuro — contraste WCAG verificado sobre #121212
     No usar --piedra sobre oscuro: da 1.6:1 y es ilegible. */
  --sobre-oscuro-1:#E8E5DD;  /* principal   · 14.9:1 · AAA */
  --sobre-oscuro-2:#BFBAB0;  /* secundario  ·  9.7:1 · AAA */
  --sobre-oscuro-3:#97928A;  /* terciario   ·  6.1:1 · AA  */

  --serif:'Playfair Display',Georgia,serif;
  --sans:'Montserrat',system-ui,-apple-system,sans-serif;
  --maxw:1180px;
  --r:2px;
}

*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{background:var(--blanco-roto);color:var(--antracita);font-family:var(--sans);
  font-weight:400;line-height:1.7;font-size:17px;-webkit-font-smoothing:antialiased}
.wrap{max-width:var(--maxw);margin:0 auto;padding:0 28px}
.narrow{max-width:860px}
h1,h2,h3{font-family:var(--serif);font-weight:600;line-height:1.18;letter-spacing:-.01em}
h1{font-size:clamp(2.1rem,5vw,3.6rem)}
h2{font-size:clamp(1.6rem,3.3vw,2.4rem);margin-bottom:1rem}
h3{font-size:1.15rem;margin-bottom:.45rem}
p{margin-bottom:1rem}
a{color:inherit}
.eyebrow{font-size:.72rem;font-weight:600;letter-spacing:.19em;text-transform:uppercase;
  color:var(--oro);margin-bottom:.9rem;display:block}
.lead{font-size:1.1rem;color:var(--piedra)}
section{padding:clamp(56px,6.5vw,92px) 0}

/* Toda seccion de fondo oscuro hereda la misma escala de texto */
.local,.forwho,.exclusive,.cta,.langs,.clients,footer{color:var(--sobre-oscuro-1)}
.local h2,.local h3,.forwho h2,.forwho h3,
.exclusive h2,.cta h2,.langs h2,.clients h2{color:var(--sobre-oscuro-1)}
.local p,.local .lead,.forwho p,.forwho .lead,
.exclusive p,.cta p,.langs p{color:var(--sobre-oscuro-2)}

/* ---------- Cabecera ---------- */
header{position:sticky;top:0;z-index:60;background:rgba(18,18,18,.94);
  backdrop-filter:blur(12px);border-bottom:1px solid rgba(200,175,120,.16)}
nav{display:flex;align-items:center;justify-content:space-between;height:88px;
  max-width:var(--maxw);margin:0 auto;padding:0 28px}
/* Cabecera: solo el logotipo de texto (ratio 3,47). El isotipo con el cuchillo
   se reserva para el pie, donde hay sitio para que se aprecie. */
nav img{height:38px;width:auto;display:block}
.nav-links{display:flex;gap:30px;list-style:none}
.nav-links a{color:#cfcdc7;text-decoration:none;font-size:.85rem;font-weight:500;transition:color .2s}
.nav-links a:hover{color:var(--oro)}
/* Boton de la cabecera: contorno de oro sobre fondo transparente y forma de
   pastilla. El oro macizo lo convertia en el elemento mas pesado de la barra y
   competia con el boton real de cada pagina, que es el que debe ganar. */
.nav-cta{background:transparent;color:var(--oro)!important;padding:10px 24px;
  border:1px solid rgba(200,175,120,.5);border-radius:999px;font-weight:600;
  font-size:.8rem;letter-spacing:.02em;text-decoration:none;transition:.25s;white-space:nowrap}
.nav-cta:hover{background:rgba(200,175,120,.12);border-color:var(--oro)}
/* La misma llamada, dentro del desplegable del movil */
.solo-movil{display:none}
.burger{display:none;background:none;border:0;color:var(--oro);font-size:1.5rem;cursor:pointer}

/* ---------- Hero ---------- */
.hero{position:relative;color:var(--blanco-roto);
  padding:clamp(80px,10vw,130px) 0 clamp(70px,8vw,105px);overflow:hidden}
.hero::before{content:'';position:absolute;inset:0;background-size:cover;
  background-position:center;background-repeat:no-repeat;transform:scale(1.04)}
.hero::after{content:'';position:absolute;inset:0;
  background:linear-gradient(105deg,rgba(18,18,18,.94) 0%,rgba(18,18,18,.82) 46%,rgba(18,18,18,.44) 100%)}
.hero .wrap{position:relative;z-index:2}
.hero-inner{max-width:800px}
.hero h1{margin-bottom:1.3rem}
.hero h1 em{font-style:normal;color:var(--oro)}
.hero p{font-size:1.14rem;color:var(--sobre-oscuro-1);max-width:610px}
.hero-actions{display:flex;gap:15px;flex-wrap:wrap;margin-top:2.1rem;align-items:center}
.hero-note{font-size:.83rem;color:var(--sobre-oscuro-2);margin-top:1.4rem}

.btn{display:inline-block;padding:16px 34px;border-radius:var(--r);font-weight:600;
  font-size:.92rem;text-decoration:none;transition:.25s;border:1px solid transparent;cursor:pointer}
.btn-primary{background:var(--oro);color:var(--antracita)}
.btn-primary:hover{background:#d8c191;transform:translateY(-2px)}
.btn-ghost{border-color:rgba(248,247,242,.34);color:var(--blanco-roto)}
.btn-ghost:hover{border-color:var(--oro);color:var(--oro)}

/* ---------- Miga de pan ---------- */
/* La miga de pan hereda el color de la seccion que va DEBAJO, para que no
   quede una franja suelta entre dos bloques. */
.bc-band{background:var(--antracita)}
.bc-band.claro{background:var(--blanco-roto)}
.bc-band.claro .bc,.bc-band.claro .bc a{color:#7c776f}
.bc-band.claro .bc a:hover{color:#96793c}
.bc-band.claro .bc span{color:var(--piedra)}
.bc-band.crema{background:#efece4}
.bc-band.crema .bc,.bc-band.crema .bc a{color:#7c776f}
.bc-band.crema .bc a:hover{color:#96793c}
.bc-band.crema .bc span{color:var(--piedra)}
.bc{font-size:.75rem;color:var(--sobre-oscuro-3);padding:20px 0 4px}
.bc a{color:var(--sobre-oscuro-3);text-decoration:none;transition:color .2s}
.bc a:hover{color:var(--oro)}
.bc span{color:var(--sobre-oscuro-2)}

/* ---------- Bloques de fondo oscuro ----------
   IMPORTANTE: toda clase que aparezca en la lista de "secciones de fondo
   oscuro" de arriba DEBE declarar aqui su background. Si hereda el texto
   claro pero no el fondo, queda texto casi blanco sobre blanco. */
.local,.forwho{background:var(--antracita);padding-top:clamp(44px,5vw,68px)}
/* min(Xpx,100%) en vez de Xpx: sin esto la rejilla exige mas ancho del que hay
   en un movil de 320px y provoca scroll horizontal. */
.local-grid,.fw-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(280px,100%),1fr));
  gap:1px;background:rgba(200,175,120,.2);border:1px solid rgba(200,175,120,.2);margin-top:2.2rem}
.local-item,.fw-item{background:#191919;padding:30px 28px}
.local-item .tag{font-size:.68rem;letter-spacing:.16em;text-transform:uppercase;
  color:var(--oro);font-weight:600;display:block;margin-bottom:12px}
.local-item p,.fw-item p{font-size:.92rem;margin-bottom:0}
.fw-item h3{font-size:1.08rem}

/* ---------- Fases del servicio ---------- */
.phase{display:grid;grid-template-columns:78px 1fr;gap:26px;padding:30px 0;
  border-bottom:1px solid rgba(74,74,71,.15)}
.phase:last-child{border-bottom:0}
.phase-n{font-family:var(--serif);font-size:2.2rem;color:var(--oro);line-height:1;font-weight:600}
.phase-n small{display:block;font-family:var(--sans);font-size:.62rem;letter-spacing:.16em;
  text-transform:uppercase;color:var(--piedra);margin-top:8px;font-weight:600}
.phase h3{font-size:1.25rem;margin-bottom:.5rem}
.phase>div>p{color:var(--piedra);font-size:.97rem;margin-bottom:0;max-width:76ch}
.phase ul{margin:.7rem 0 0;padding-left:1.1rem;color:var(--piedra);font-size:.94rem}
.phase li{margin-bottom:.3rem}
.phase-lg{grid-template-columns:96px 1fr;gap:30px;padding:42px 0}
.phase-lg .phase-n{font-size:2.6rem}
.phase-lg h3{font-size:1.42rem;margin-bottom:.6rem}
.deliver{margin-top:1.4rem;border-left:2px solid var(--oro);padding:2px 0 2px 22px}
.deliver b{font-size:.7rem;letter-spacing:.15em;text-transform:uppercase;color:var(--oro);
  display:block;margin-bottom:.6rem}
.deliver ul{list-style:none;display:grid;gap:.45rem;margin:0;padding:0}
.deliver li{font-size:.95rem;color:var(--piedra);padding-left:18px;position:relative}
.deliver li::before{content:'';position:absolute;left:0;top:12px;width:9px;height:1px;background:var(--oro)}

/* ---------- Resultado ---------- */
.outcome{background:#efece4}
.out-list{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(300px,100%),1fr));
  gap:16px 40px;margin-top:2rem;list-style:none}
.out-list li{padding-left:30px;position:relative;font-size:1rem}
.out-list li::before{content:'';position:absolute;left:0;top:11px;width:14px;height:1px;background:var(--oro)}

/* ---------- Banda intermedia ---------- */
.band{background:var(--antracita);color:var(--sobre-oscuro-1);padding:clamp(48px,5vw,64px) 0}
.band-in{display:flex;justify-content:space-between;align-items:center;gap:34px;flex-wrap:wrap}
.band h2{color:var(--sobre-oscuro-1);margin-bottom:.4rem;font-size:clamp(1.4rem,2.6vw,1.95rem)}
.band p{color:var(--sobre-oscuro-2);margin-bottom:0;max-width:52ch;font-size:.98rem}

/* ---------- Diferencial ---------- */
.exclusive{background:var(--antracita);text-align:center}
.exclusive .wrap{max-width:800px}
.exclusive h2{font-size:clamp(1.8rem,4vw,2.8rem)}
.exclusive p{font-size:1.06rem;max-width:66ch;margin-left:auto;margin-right:auto}
.pm{background:#efece4}
.pm-grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(36px,5vw,72px);align-items:center}
.pm blockquote{font-family:var(--serif);font-size:1.5rem;line-height:1.42;
  border-left:2px solid var(--oro);padding-left:26px}

/* ---------- Clientes ----------
   Los logos de cliente son CLAROS: van siempre sobre fondo oscuro.
   Alturas calculadas combinando caja y densidad de tinta, ancladas a Carina=73px:
   igualar la altura de archivo no iguala el peso optico. */
.clients{background:var(--antracita);text-align:center}
/* La fila es un contenedor de scroll horizontal real, no una animacion CSS.
   Asi se puede arrastrar con el dedo o con el raton, y rima.js se limita a
   empujarla despacio cuando nadie la toca. El grupo de logos va repetido tres
   veces para que el bucle sea continuo en ambas direcciones. */
.client-marquee{overflow-x:auto;overscroll-behavior-x:contain;margin-top:2.6rem;
  scrollbar-width:none;-ms-overflow-style:none;cursor:grab;
  -webkit-mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent);
  mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent)}
.client-marquee::-webkit-scrollbar{display:none}
.client-marquee.arrastrando{cursor:grabbing}
.client-row{display:flex;flex-wrap:nowrap;align-items:center;width:max-content;
  gap:clamp(38px,4.5vw,60px)}
.client-set{display:flex;align-items:center;flex-shrink:0;gap:clamp(38px,4.5vw,60px)}
.client-row a{display:inline-flex;align-items:center;transition:transform .25s}
.client-row a:hover{transform:translateY(-3px)}
.client-row img{width:auto;display:block;transition:opacity .25s}
.client-row a:hover img{opacity:.82}
.client-row a[data-l='azul'] img{height:64px}
.client-row a[data-l='carina'] img{height:73px}
.client-row a[data-l='gallego-playa'] img{height:86px}
.client-row a[data-l='in-bocca-al-lupo'] img{height:50px}
.client-row a[data-l='kentucky'] img{height:41px}
.client-row a[data-l='nou-lloc-de-joc'] img{height:72px}
.client-row a[data-l='soho'] img{height:58px}
.client-row a[data-l='teselas'] img{height:54px}
.client-row a[data-l='vamora-ver'] img{height:86px}

/* ---------- Zonas de servicio ----------
   Ciudades con y sin landing se ven EXACTAMENTE igual.
   La unica diferencia es que unas navegan al hacer clic. */
.zones{background:#efece4}
.zone-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(268px,100%),1fr));gap:20px;margin-top:2rem}
.zone{background:var(--blanco-roto);border:1px solid rgba(74,74,71,.12);
  padding:22px 22px 19px;border-radius:var(--r);transition:.25s}
.zone:hover{border-color:var(--linea);transform:translateY(-3px)}
.zone h3{font-size:1.02rem;margin-bottom:.7rem}
.zone h3 a{color:inherit;text-decoration:none;border-bottom:1px solid var(--oro)}
.zone ul{list-style:none;display:flex;flex-wrap:wrap;gap:5px}
.zone li a,.zone li span{font-size:.755rem;padding:3px 9px;border-radius:var(--r);
  display:inline-block;line-height:1.45;color:var(--piedra);text-decoration:none;
  border:1px solid rgba(74,74,71,.2);transition:.2s}
.zone:hover li a,.zone:hover li span{border-color:rgba(200,175,120,.5)}

/* ---------- Idiomas ---------- */
.langs{background:var(--antracita)}
.lang-in{display:grid;grid-template-columns:1fr auto;gap:36px;align-items:center}
.langs h2{font-size:clamp(1.4rem,2.6vw,1.95rem);margin-bottom:.5rem}
.langs p{margin-bottom:0;max-width:60ch;font-size:.98rem}
.lang-links{display:flex;gap:10px;flex-wrap:wrap}
.lang-links a{font-size:.84rem;color:var(--sobre-oscuro-1);text-decoration:none;
  border:1px solid rgba(200,175,120,.34);padding:9px 18px;border-radius:var(--r);
  transition:.22s;white-space:nowrap}
.lang-links a:hover{border-color:var(--oro);color:var(--oro);background:rgba(200,175,120,.08)}

/* ---------- Acordeon FAQ ---------- */
details{border-bottom:1px solid rgba(74,74,71,.16);padding:22px 0}
details summary{font-family:var(--serif);font-size:1.1rem;cursor:pointer;list-style:none;
  display:flex;justify-content:space-between;gap:20px;align-items:flex-start}
details summary::-webkit-details-marker{display:none}
details summary::after{content:'+';color:var(--oro);font-size:1.4rem;line-height:1;
  flex-shrink:0;transition:transform .25s}
details[open] summary::after{transform:rotate(45deg)}
details p{margin:14px 0 0;color:var(--piedra);font-size:.96rem;max-width:82ch}

/* ---------- Llamada a la accion y formulario ---------- */
.cta{background:var(--antracita);border-top:1px solid rgba(200,175,120,.16)}
.cta-grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(38px,5vw,76px);align-items:start}
form{display:grid;gap:15px}
label{font-size:.72rem;letter-spacing:.1em;text-transform:uppercase;color:var(--oro);
  font-weight:600;margin-bottom:6px;display:block}
input,select,textarea{width:100%;background:rgba(248,247,242,.05);
  border:1px solid rgba(200,175,120,.25);color:var(--blanco-roto);padding:14px 16px;
  border-radius:var(--r);font-family:var(--sans);font-size:.94rem;transition:border-color .2s}
input:focus,select:focus,textarea:focus{outline:none;border-color:var(--oro)}
textarea{min-height:96px;resize:vertical}
::placeholder{color:var(--sobre-oscuro-3);opacity:1}
select option{background:var(--antracita)}
.form-note{font-size:.78rem;color:var(--sobre-oscuro-3);margin-top:2px}
.contact-inline{display:flex;gap:30px;flex-wrap:wrap;margin-top:2rem;padding-top:1.6rem;
  border-top:1px solid rgba(200,175,120,.2)}
.contact-inline strong{display:block;font-size:1.02rem;color:var(--oro);font-family:var(--serif)}
.contact-inline span{font-size:.77rem;color:var(--sobre-oscuro-3)}

/* ---------- Pie ---------- */
footer{background:#0d0d0d;color:var(--sobre-oscuro-2);padding:56px 0 32px;font-size:.86rem}
footer p{color:var(--sobre-oscuro-2)}
.foot-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:44px;padding-bottom:34px;
  border-bottom:1px solid rgba(200,175,120,.14)}
.foot-logo{display:inline-block;margin-bottom:22px}
footer img{height:120px;width:auto;display:block}
.social{display:flex;gap:12px;margin-top:20px}
.social a{width:42px;height:42px;display:inline-flex;align-items:center;justify-content:center;
  border:1px solid rgba(200,175,120,.32);border-radius:50%;color:var(--sobre-oscuro-2);
  transition:.25s}
.social a:hover{border-color:var(--oro);color:var(--oro);background:rgba(200,175,120,.1)}
.social svg{width:19px;height:19px;fill:currentColor;display:block}
footer h4{color:var(--oro);font-size:.72rem;letter-spacing:.16em;text-transform:uppercase;
  margin-bottom:14px;font-weight:600}
footer ul{list-style:none;display:grid;gap:8px}
footer a{color:var(--sobre-oscuro-2);text-decoration:none;transition:color .2s}
footer a:hover{color:var(--oro)}
.foot-bottom{padding-top:24px;display:flex;justify-content:space-between;gap:18px;
  flex-wrap:wrap;font-size:.79rem;color:var(--sobre-oscuro-3)}
.foot-bottom a{color:var(--sobre-oscuro-3)}

/* ---------- Enlace de texto sobre fondo claro ---------- */
.link-oro{color:#96793c;font-weight:600;text-decoration:none;
  border-bottom:1px solid var(--oro);padding-bottom:2px;font-size:.94rem}

/* ---------- Responsive ---------- */
@media(max-width:900px){
  /* Escala tipografica del movil, un 9 % por debajo del escritorio.
     Se toca la raiz y no cada regla: todo lo definido en rem baja a la vez y
     las proporciones entre titulo, texto y nota se mantienen intactas.
     Menos lineas por parrafo = menos scroll para llegar al formulario. */
  html{font-size:14.6px}
  body{font-size:15.4px}
  .btn{padding:13px 26px;font-size:.9rem}
  /* Excepcion deliberada: por debajo de 16px iOS hace zoom automatico al
     tocar un campo y descoloca la pagina. El formulario no baja de ahi. */
  input,select,textarea{font-size:16px}
  .cta-grid,.foot-grid,.pm-grid,.lang-in{grid-template-columns:1fr}
  .nav-links{display:none}
  .burger{display:block}
  .phase,.phase-lg{grid-template-columns:52px 1fr;gap:18px;padding:30px 0}
  .phase-n,.phase-lg .phase-n{font-size:1.8rem}
  nav{height:76px;position:relative}
  nav img{height:30px}
  footer img{height:96px}
  /* Panel desplegable del menu movil */
  .nav-links{display:none;position:absolute;top:100%;left:0;right:0;
    flex-direction:column;gap:0;padding:0;background:rgba(18,18,18,.985);
    backdrop-filter:blur(14px);border-bottom:1px solid var(--linea);
    box-shadow:0 18px 40px rgba(0,0,0,.4)}
  .nav-links.open{display:flex}
  .nav-links li{border-top:1px solid rgba(200,175,120,.13)}
  .nav-links li:first-child{border-top:0}
  .nav-links a{display:block;padding:17px 28px;font-size:.95rem;color:var(--sobre-oscuro-1)}
  .nav-links a:active{background:rgba(200,175,120,.1)}
  .burger{display:block;padding:8px 4px;line-height:1;min-width:44px;min-height:44px}
  /* En movil la llamada a la accion sale de la barra y entra en el
     desplegable: en una pantalla estrecha el boton se comia el ancho que
     necesita el logotipo. */
  .nav-cta{display:none}
  /* Excepcion: las paginas en otros idiomas tienen una barra sin menu ni
     hamburguesa. Ahi el boton es lo unico que hay, y se queda. */
  .nav-cta.siempre{display:inline-block;padding:9px 18px;font-size:.78rem}
  .solo-movil{display:block}
  .nav-links a.nav-menu-cta{background:rgba(200,175,120,.13);color:var(--oro);
    font-weight:600;letter-spacing:.02em}
  .nav-links a.nav-menu-cta:active{background:rgba(200,175,120,.22)}
}
/* Evita cualquier desbordamiento lateral residual.
   'clip' y no 'hidden': hidden convierte al elemento en contenedor de scroll y
   eso ANULA el position:sticky de la cabecera. Era la razon por la que el menu
   no se quedaba anclado al bajar. */
html,body{max-width:100%;overflow-x:clip}

/* ---------- Logos de cliente en movil ---------- */
@media(max-width:700px){
  /* Alturas del escritorio reducidas al 78 %: se conserva el equilibrio optico
     ya ajustado entre marcas en lugar de igualarlas a ciegas. */
  .client-row a[data-l='azul'] img{height:50px}
  .client-row a[data-l='carina'] img{height:57px}
  .client-row a[data-l='gallego-playa'] img{height:67px}
  .client-row a[data-l='in-bocca-al-lupo'] img{height:39px}
  .client-row a[data-l='kentucky'] img{height:32px}
  .client-row a[data-l='nou-lloc-de-joc'] img{height:56px}
  .client-row a[data-l='soho'] img{height:45px}
  .client-row a[data-l='teselas'] img{height:42px}
  .client-row a[data-l='vamora-ver'] img{height:67px}
}
/* Quien pide menos movimiento ve la fila quieta y repartida en varias lineas.
   rima.js comprueba lo mismo y no arranca el avance automatico. */
@media(prefers-reduced-motion:reduce){
  .client-marquee{overflow-x:visible;cursor:auto;
    -webkit-mask-image:none;mask-image:none}
  .client-row{flex-wrap:wrap;justify-content:center;width:auto;gap:clamp(30px,4.5vw,60px)}
  .client-set{display:contents}
  .client-set~.client-set{display:none}
}

/* ---------- Animacion de entrada ---------- */
.reveal{opacity:0;transform:translateY(24px);transition:opacity .65s ease,transform .65s ease}
.reveal.in{opacity:1;transform:none}
@media(prefers-reduced-motion:reduce){.reveal{opacity:1;transform:none;transition:none}}