/* Costa del Sol Transfers, v2 «Mediterráneo luminoso».
   Arena, blanco y azul mar profundo. Bricolage Grotesque para titulares, Figtree para el texto. */
:root{
  --white:#FFFFFF;
  --sand:#F3E7D2;
  --sand-2:#E9D6B6;
  --sea:#0A4A73;
  --sea-deep:#06304D;
  --ink:#13293B;
  --muted:#4D5D6A;
  --line:#E2D4BD;
  --sun:#F6BE6A;
  --display:"Plus Jakarta Sans",system-ui,-apple-system,"Segoe UI",sans-serif;
  --text:"Plus Jakarta Sans",system-ui,-apple-system,"Segoe UI",sans-serif;
  --gutter:clamp(16px,4vw,56px);
  --max:1240px;
  color-scheme:light;
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:84px}
body{margin:0;background:var(--white);color:var(--ink);font-family:var(--text);font-size:18px;line-height:1.6;overflow-x:hidden;transition:opacity .2s}
img,video{display:block;max-width:100%}
a{color:var(--sea)}
h1,h2,h3{font-family:var(--display);font-optical-sizing:auto;margin:0;line-height:1.04;letter-spacing:-.02em;text-wrap:balance}
p{margin:0}
.wrap{width:100%;max-width:calc(var(--max) + 2*var(--gutter));margin-inline:auto;padding-inline:var(--gutter)}
:focus-visible{outline:3px solid var(--sea);outline-offset:3px;border-radius:4px}
.skip{position:absolute;left:16px;top:8px;transform:translateY(-300%);z-index:100;background:var(--white);padding:10px 16px;border-radius:8px}
.skip:focus{transform:none}

.h-sec{font-size:clamp(2.3rem,1.4rem + 3.4vw,4.6rem);font-weight:720;color:var(--sea-deep);max-width:17ch}
.lead{font-size:clamp(1.08rem,1rem + .35vw,1.3rem);color:var(--muted);max-width:60ch;margin-top:20px}

.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:52px;padding:0 26px;border-radius:999px;font:600 1.05rem/1 var(--text);text-decoration:none;border:0;cursor:pointer;transition:background .2s,transform .2s}
.btn-sea{background:var(--sea);color:#fff}
.btn-sea:hover{background:var(--sea-deep)}
.btn-sm{min-height:42px;padding:0 20px;font-size:.98rem}

/* ---------- Cabecera ---------- */
.top{position:fixed;inset:0 0 auto;z-index:50;color:#fff;transition:background .3s,color .3s,box-shadow .3s}
.top.is-solid{background:rgba(255,255,255,.96);color:var(--ink);box-shadow:0 1px 0 var(--line);backdrop-filter:blur(10px)}
.top-in{display:flex;align-items:center;gap:24px;height:76px;max-width:calc(var(--max) + 2*var(--gutter));margin:auto;padding-inline:var(--gutter)}
.brand{display:inline-flex;align-items:baseline;gap:8px;color:inherit;text-decoration:none;white-space:nowrap}
.brand-sun{align-self:center;color:inherit}
.brand-sun .sun{fill:var(--sun)}
.brand-name{font:760 1.45rem/1 var(--display);letter-spacing:-.025em}
.brand-sub{font:420 1.2rem/1 var(--display);opacity:.85}
.nav{display:flex;gap:26px;margin-inline-start:auto}
.nav a{color:inherit;text-decoration:none;font-weight:550;font-size:1rem}
.nav a:hover{text-decoration:underline;text-underline-offset:6px}
.top-act{display:flex;align-items:center;gap:12px}
/* Selector de idioma: banderas SVG + código + desplegable con los 12 idiomas (enlaces a la página equivalente). */
.langsel{position:relative}
.langsel-d summary{list-style:none;display:flex;align-items:center;gap:7px;cursor:pointer;color:inherit;border:1.5px solid currentColor;border-radius:999px;min-height:40px;padding:0 12px;font:650 .9rem/1 var(--text)}
.langsel-d summary::-webkit-details-marker{display:none}
.langsel-chev{transition:transform .2s}
.langsel-d[open] .langsel-chev{transform:rotate(180deg)}
.flag{flex:none;border-radius:3px;box-shadow:0 0 0 1px rgba(0,0,0,.15)}
.langsel-list{position:absolute;inset-inline-end:0;top:calc(100% + 8px);list-style:none;margin:0;padding:8px;background:#fff;color:var(--ink);border-radius:16px;box-shadow:0 20px 50px -20px rgba(6,48,77,.45);min-width:210px;max-height:min(72vh,560px);overflow-y:auto;z-index:60}
.langsel-list a{display:flex;align-items:center;gap:12px;padding:10px 12px;border-radius:10px;color:inherit;text-decoration:none;font-weight:550;font-size:1rem;line-height:1.2}
.langsel-list a:hover{background:var(--sand)}
.langsel-list a[aria-current]{font-weight:750;background:#F7FBFD;color:var(--sea-deep)}
.menu{display:none;position:relative}
.menu summary{list-style:none;cursor:pointer;width:44px;height:44px;display:grid;place-items:center;border-radius:50%}
.menu summary::-webkit-details-marker{display:none}
.menu-panel{position:absolute;inset-inline-end:0;top:52px;background:#fff;color:var(--ink);border-radius:16px;box-shadow:0 20px 50px -20px rgba(6,48,77,.45);padding:10px;min-width:220px;display:grid}
.menu-panel a{color:inherit;text-decoration:none;padding:12px 14px;border-radius:10px;font-weight:550}
.menu-panel a:hover{background:var(--sand)}

/* ---------- Hero ---------- */
.hero{position:relative;min-height:100svh;display:flex;align-items:flex-end;color:#fff;isolation:isolate;background:var(--sea-deep)}
.hero-media{position:absolute;inset:0;z-index:-1;overflow:hidden}
.hero-media video{width:100%;height:100%;object-fit:cover}
.hero-media::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(6,48,77,.55) 0,rgba(6,48,77,0) 22%,rgba(6,48,77,0) 40%,rgba(6,48,77,.72) 100%),linear-gradient(90deg,rgba(6,48,77,.6),rgba(6,48,77,.15) 55%,rgba(6,48,77,0) 70%)}
.hero-in{width:100%;max-width:calc(var(--max) + 2*var(--gutter));margin:auto auto 0;padding:120px var(--gutter) 56px;display:grid;grid-template-columns:minmax(0,1fr) minmax(360px,440px);gap:48px;align-items:end}
.hero-where{font-size:1.05rem;font-weight:600;margin-bottom:18px;text-shadow:0 1px 12px rgba(6,48,77,.8)}
.hero h1{font-size:clamp(3.1rem,1.6rem + 5.4vw,7rem);font-weight:740;letter-spacing:-.022em;line-height:.98;max-width:11ch;text-shadow:0 2px 30px rgba(6,48,77,.35)}
.hero-lead{font-size:clamp(1.1rem,1rem + .45vw,1.4rem);max-width:40ch;margin-top:24px}
.hero-facts{list-style:none;padding:0;margin:28px 0 0;display:flex;flex-wrap:wrap;gap:10px}
.hero-facts li{border:1.5px solid rgba(255,255,255,.7);border-radius:999px;padding:7px 16px;font-weight:550;font-size:1rem;backdrop-filter:blur(6px);background:rgba(255,255,255,.08)}
.booking{background:#fff;color:var(--ink);border-radius:24px;padding:26px 24px 20px;box-shadow:0 40px 80px -30px rgba(6,48,77,.6);scroll-margin-top:96px}
.booking-t{font-size:1.9rem;font-weight:740;color:var(--sea-deep)}
.booking-sub{color:var(--muted);font-size:1rem;margin:8px 0 14px}
.booking-slot{min-height:260px}
.vid-toggle{position:absolute;inset-inline-end:16px;top:92px;width:38px;height:38px;border-radius:50%;border:1.5px solid rgba(255,255,255,.7);background:rgba(6,48,77,.35);color:#fff;display:grid;place-items:center;cursor:pointer}
.vid-toggle .i-play{display:none}
.vid-toggle[aria-pressed="true"] .i-play{display:block}
.vid-toggle[aria-pressed="true"] .i-pause{display:none}

/* ---------- Por qué ---------- */
.why{background:var(--sand);padding:clamp(72px,9vw,128px) 0}
.why-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:40px 36px;margin-top:56px}
.why-item svg{color:var(--sea)}
.why-item h3{font-size:1.75rem;font-weight:700;color:var(--sea-deep);margin:18px 0 10px}
.why-item p{color:var(--muted)}

/* ---------- Bandas a sangre ---------- */
.band{position:relative;min-height:88svh;display:flex;align-items:flex-end;color:#fff;overflow:hidden;isolation:isolate}
.band-media{position:absolute;inset:0;z-index:-1}
.band-media img,.band-media video{width:100%;height:100%;object-fit:cover}
.band-media::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(6,48,77,0) 35%,rgba(6,48,77,.78) 100%)}
.band-copy{padding-block:0 clamp(56px,8vw,104px)}
.band-t{font-size:clamp(2.4rem,1.3rem + 4vw,5.4rem);font-weight:760;letter-spacing:-.03em;max-width:16ch}
.band-p{font-size:clamp(1.1rem,1rem + .4vw,1.35rem);max-width:46ch;margin-top:20px}
.band-road{min-height:80svh}

/* ---------- Flota ---------- */
.fleet{padding:clamp(80px,10vw,140px) 0}
.car{display:grid;grid-template-columns:1.25fr 1fr;gap:clamp(28px,5vw,72px);align-items:center;margin-top:64px}
.car-flip .car-img{order:2}
.car-img{border-radius:28px;overflow:hidden;aspect-ratio:4/3;background:var(--sand)}
.car-img img{width:100%;height:100%;object-fit:cover}
.car h3{font-size:clamp(2.1rem,1.5rem + 2vw,3.4rem);font-weight:740;color:var(--sea-deep)}
.car-cap{font-size:1.25rem;font-weight:600;color:var(--sea);margin:10px 0 16px}
.car-body > p:not(.car-cap){color:var(--muted)}
.car-spec{display:grid;grid-template-columns:auto auto minmax(0,1fr);gap:28px;margin:28px 0 0;padding-top:22px;border-top:1.5px solid var(--line)}
.car-spec dt{font-size:.95rem;color:var(--muted)}
.car-spec dd{overflow-wrap:anywhere;margin:2px 0 0;font:700 1.5rem/1.2 var(--display);color:var(--sea-deep)}

/* ---------- Destino a sangre ---------- */
.place{position:relative;min-height:92svh;display:flex;align-items:flex-end;color:#fff;overflow:hidden;isolation:isolate;scroll-margin-top:0}
.place-media{position:absolute;inset:0;z-index:-1}
.place-media img{width:100%;height:100%;object-fit:cover}
.place-media::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(6,48,77,0) 45%,rgba(6,48,77,.7) 100%)}
.place-copy{padding-bottom:clamp(40px,6vw,80px)}
.place-meta{font-size:clamp(1.1rem,1rem + .5vw,1.5rem);font-weight:600}
.place-name{font-size:clamp(3.6rem,1rem + 10vw,11rem);font-weight:800;letter-spacing:-.035em;line-height:.88;margin-top:8px}
.place-name span{display:block;font-weight:420;font-size:.42em;letter-spacing:-.02em;line-height:1.1;margin-top:.12em}

/* ---------- Destinos ---------- */
.dest{padding:clamp(80px,10vw,130px) 0;background:var(--white)}
.dest-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;margin-top:52px}
.dcard{position:relative;border-radius:22px;overflow:hidden;aspect-ratio:3/4;color:#fff;background:var(--sand)}
.dcard img{width:100%;height:100%;object-fit:cover;transition:transform .8s cubic-bezier(.2,.7,.2,1)}
.dcard:hover img{transform:scale(1.04)}
.dcard-b{position:absolute;inset:auto 0 0;padding:60px 20px 20px;background:linear-gradient(180deg,rgba(6,48,77,0),rgba(6,48,77,.82))}
.dcard h3{font-size:1.8rem;font-weight:720}
.dcard p{display:flex;justify-content:space-between;align-items:baseline;margin-top:6px;font-size:1rem}
.dcard b{font:700 1.2rem/1 var(--display)}
.table-wrap{margin-top:56px;overflow-x:auto;-webkit-overflow-scrolling:touch}
.rates{width:100%;border-collapse:collapse;min-width:520px}
.rates caption{text-align:start;font:650 1.35rem/1.3 var(--display);color:var(--sea-deep);padding-bottom:14px}
.rates th,.rates td{padding:15px 12px;text-align:start;border-bottom:1.5px solid var(--line)}
.rates thead th{font-size:.95rem;color:var(--muted);font-weight:600}
.rates tbody th{font-weight:600}
.rates td:nth-child(3),.rates td:nth-child(4),.rates thead th:nth-child(3),.rates thead th:nth-child(4){text-align:end}
.rates td:nth-child(3),.rates td:nth-child(4){font:700 1.15rem/1 var(--display);color:var(--sea-deep)}
.note{color:var(--muted);font-size:1rem;margin:18px 0 28px;max-width:70ch}

/* ---------- Cómo funciona ---------- */
.how{background:var(--sand);padding:clamp(80px,10vw,130px) 0}
.steps{list-style:none;padding:0;margin:56px 0 0;display:grid;grid-template-columns:repeat(3,1fr);gap:40px;counter-reset:s}
.steps li{counter-increment:s;position:relative;padding-top:96px}
.steps li::before{content:counter(s);position:absolute;top:0;inset-inline-start:0;font:800 5.4rem/1 var(--display);color:var(--sea);letter-spacing:-.05em}
.steps li::after{content:"";position:absolute;top:44px;inset-inline:72px -20px;height:2px;background:var(--sand-2)}
.steps li:last-child::after{display:none}
.steps h3{font-size:1.7rem;font-weight:700;color:var(--sea-deep);margin-bottom:10px}
.steps p{color:var(--muted)}

/* ---------- Opiniones ---------- */
.reviews{padding:clamp(80px,10vw,130px) 0}
.rev-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:40px;margin-top:52px}
.rev{margin:0;padding-top:24px;border-top:3px solid var(--sea)}
.stars{color:var(--sun);font-size:1.25rem;letter-spacing:3px}
.rev blockquote{margin:14px 0 18px;font:500 1.38rem/1.4 var(--display);color:var(--ink);letter-spacing:-.01em}
.rev figcaption{color:var(--muted);font-size:1rem}

/* ---------- Contacto ---------- */
.contact{position:relative;padding:clamp(120px,14vw,200px) 0;isolation:isolate;overflow:hidden}
.contact-media{position:absolute;inset:0;z-index:-1}
.contact-media img{width:100%;height:100%;object-fit:cover}
.contact-card{background:#fff;border-radius:28px;padding:clamp(26px,3.4vw,40px);max-width:520px;box-shadow:0 40px 90px -40px rgba(6,48,77,.55)}
.contact-card > p{color:var(--muted);margin-top:18px}
.contact-actions{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:12px;margin-top:24px}
.act{display:flex;align-items:center;gap:12px;padding:14px 16px;border-radius:18px;border:1.5px solid var(--line);background:#fff;color:var(--ink);text-decoration:none;font:inherit;text-align:start;cursor:pointer;transition:border-color .2s,background .2s}
.act:hover{border-color:var(--sea);background:#F7FBFD}
.act svg{flex:none;color:var(--sea)}
.act span{display:grid;line-height:1.3}
.act b{font-weight:650;font-size:1.05rem}
.act small{color:var(--muted);font-size:.9rem;text-wrap:balance}
.act small.pending{color:#9A5B12}
.act-call{background:var(--sea);border-color:var(--sea);color:#fff}
.act-call svg,.act-call small{color:#fff}
.act-call:hover{background:var(--sea-deep);border-color:var(--sea-deep)}
.contact-mail{margin-top:22px;font-size:1rem}
.hint{margin-top:8px;font-size:.95rem;color:var(--sea)}

/* ---------- FAQ ---------- */
.faq{padding:clamp(80px,10vw,130px) 0}
.faq-in{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:56px;align-items:start}
.faq-list details{border-bottom:1.5px solid var(--line)}
.faq-list details:first-child{border-top:1.5px solid var(--line)}
.faq-list summary{list-style:none;cursor:pointer;padding:22px 0;padding-inline-end:44px;position:relative;font:650 1.3rem/1.3 var(--display);color:var(--sea-deep)}
.faq-list summary::-webkit-details-marker{display:none}
.faq-list summary::after{content:"";position:absolute;inset-inline-end:6px;top:50%;width:14px;height:14px;border-right:2.5px solid var(--sea);border-bottom:2.5px solid var(--sea);transform:translateY(-70%) rotate(45deg);transition:transform .25s}
.faq-list details[open] summary::after{transform:translateY(-30%) rotate(225deg)}
.faq-list details p{padding:0 0 24px;color:var(--muted);max-width:62ch}

/* ---------- Pie ---------- */
.foot{background:var(--sand);padding:80px 0 120px}
.foot-in{display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:48px}
.brand-foot{color:var(--sea-deep)}
.foot-brand p{color:var(--muted);margin:16px 0 24px;max-width:36ch}
.foot-h{font:700 1.2rem/1.2 var(--display);color:var(--sea-deep);margin-bottom:14px;letter-spacing:-.01em}
.foot-list{list-style:none;padding:0;margin:0;display:grid;gap:8px;color:var(--muted);font-size:1rem}
.foot-legal{margin-top:56px;padding-top:24px;border-top:1.5px solid var(--sand-2);color:var(--muted);font-size:.92rem}

/* ---------- Mensajería flotante ---------- */
.msg{position:fixed;right:90px;bottom:24px;display:flex;gap:10px;z-index:2147482000}
.js .msg:not(.is-on){opacity:0;visibility:hidden;transform:translateY(12px)}
.msg{transition:opacity .3s,transform .3s,visibility .3s}
.msg a{width:48px;height:48px;border-radius:50%;display:grid;place-items:center;background:#fff;box-shadow:0 8px 22px -8px rgba(6,48,77,.55);border:1px solid var(--line)}

/* ---------- Movimiento (solo con .anim, que pone el JS si no hay reduce-motion) ---------- */
.anim .reveal{opacity:0;transform:translateY(32px);transition:opacity 1s cubic-bezier(.2,.7,.2,1),transform 1s cubic-bezier(.2,.7,.2,1)}
.anim .reveal.is-in{opacity:1;transform:none}
.anim .place-name.reveal{transform:translateY(60px);transition-duration:1.3s}
.anim .place-name.reveal.is-in{transform:none}
.anim .kb{animation:kb 28s ease-in-out infinite alternate}
@keyframes kb{from{transform:scale(1.02)}to{transform:scale(1.12) translate3d(-1.5%,-1%,0)}}
.anim .hero-copy > *{animation:rise 1.1s cubic-bezier(.2,.7,.2,1) both}
.anim .hero-copy > :nth-child(2){animation-delay:.12s}
.anim .hero-copy > :nth-child(3){animation-delay:.24s}
.anim .hero-copy > :nth-child(4){animation-delay:.36s}
.anim .booking{animation:rise 1.1s .3s cubic-bezier(.2,.7,.2,1) both}
@keyframes rise{from{opacity:0;transform:translateY(26px)}to{opacity:1;transform:none}}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{animation:none!important;transition:none!important}}

/* ---------- Responsive ---------- */
@media (max-width:1100px){
  .nav{display:none}
  .menu{display:block}
  .why-grid{grid-template-columns:repeat(2,1fr)}
  .dest-grid{grid-template-columns:repeat(2,1fr)}
  .hero-in{grid-template-columns:1fr;gap:36px;padding-top:140px}
  .booking{max-width:560px}
}
@media (max-width:760px){
  body{font-size:17px}
  .top-in{height:64px;gap:10px}
  .brand-name{font-size:1.2rem}
  .top .brand{display:grid;grid-template-columns:auto auto;column-gap:8px;align-items:end}
  .top .brand-sun{grid-row:1 / span 2;align-self:center}
  .top .brand-name{line-height:1}
  .top .brand-sub{font-size:.82rem;line-height:1.1;letter-spacing:.01em}
  .brand-sun{width:28px;height:18px}
  .top-cta{display:none}
  .langsel-d summary{min-height:38px;padding:0 10px;gap:6px;font-size:.85rem}
  .langsel-list{min-width:200px}
  .hero{min-height:0;display:block}
  .hero-media{position:relative;height:66svh;min-height:420px;z-index:0}
  .hero-media::after{background:linear-gradient(180deg,rgba(6,48,77,.5) 0,rgba(6,48,77,0) 22%,rgba(6,48,77,.35) 45%,rgba(6,48,77,.85) 100%)}
  .hero{background:var(--sand)}
  .hero-in{position:relative;padding:0 var(--gutter) 40px;margin-top:-330px;gap:28px;z-index:1}
  .hero h1{font-size:clamp(2.9rem,12.5vw,3.6rem)}
  .hero-lead{margin-top:16px}
  .hero-where{font-size:.98rem;margin-bottom:12px}
  .hero-facts{display:none}
  .hero-where{display:none}
  .rates{min-width:0}
  .rates th:nth-child(2),.rates td:nth-child(2){display:none}
  .rates th,.rates td{padding:13px 6px}
  .rates caption{font-size:1.15rem}
  .booking{padding:22px 16px 16px;border-radius:20px;margin-inline:-4px}
  .booking-t{font-size:1.6rem}
  .vid-toggle{top:76px}
  .why-grid{grid-template-columns:1fr;gap:36px}
  .car,.car-flip{grid-template-columns:minmax(0,1fr)}
  .car-flip .car-img{order:0}
  .car-spec{gap:20px}
  .band{min-height:76svh}
  .place{min-height:78svh}
  .dest-grid{grid-template-columns:1fr 1fr;gap:12px}
  .dcard{aspect-ratio:3/4;border-radius:16px}
  .dcard-b{padding:40px 12px 12px}
  .dcard h3{font-size:1.25rem}
  .dcard p{flex-direction:column;gap:2px;font-size:.9rem}
  .steps{grid-template-columns:1fr;gap:36px}
  .steps li{padding-top:0;padding-inline-start:72px}
  .steps li::before{font-size:3.6rem}
  .steps li::after{display:none}
  .rev-grid{grid-template-columns:1fr}
  .contact-actions{grid-template-columns:1fr}
  .faq-in{grid-template-columns:1fr;gap:28px}
  .foot-in{grid-template-columns:1fr;gap:36px}
  .msg{right:auto;left:16px;bottom:16px}
}

/* Ronda 3 (2026-10-31): el motor va sin tarjeta propia, para que ocupe lo mínimo; el texto queda sobre el vídeo. */
.booking{background:none;box-shadow:none;border:0;border-radius:0;padding:0;margin-left:0;margin-right:0;color:#fff}
.booking-t,.booking-sub{color:#fff;text-shadow:0 1px 12px rgba(0,0,0,.45)}
.booking-t{font-weight:700;letter-spacing:-.02em}

/* Logo 07 (2026-11-01): símbolo y nombre de marca iguales en cabecera y pie de las tres versiones.
   El mar del símbolo y «CostaDelSol» toman currentColor: blancos sobre el vídeo, azul marca sobre fondo claro. */
.csl-logo{display:inline-flex;align-items:center;gap:.45em;font-family:"Plus Jakarta Sans",system-ui,-apple-system,"Segoe UI",sans-serif;font-size:19px;line-height:1;white-space:nowrap;text-decoration:none}
.top .csl-logo{display:inline-flex;align-items:center}
.csl-mark{width:2.3em;height:2.3em;flex:none;clip-path:circle(50%)}
.csl-sun{fill:#E8992A}
.csl-sea{fill:currentColor}
.csl-word{font-weight:700;letter-spacing:-.012em}
.csl-w2{color:#E8992A}
.top.is-solid .csl-logo,.foot .csl-logo{color:#133E65}
@media (max-width:480px){.csl-logo{font-size:14px}}
/* 2026-11-01: en móvil el motor cae debajo del vídeo, sobre arena; ahí el titular vuelve a azul (en blanco no se leía). */
@media (max-width:760px){.booking{color:var(--ink)}.booking-t{color:var(--sea-deep);text-shadow:none}.booking-sub{color:var(--muted);text-shadow:none}}
/* El motor sube sobre el vídeo como una hoja de arena: el titular queda siempre sobre fondo claro, mida lo que mida el texto de arriba. */
@media (max-width:760px){.booking{background:var(--sand);margin-inline:calc(-1 * var(--gutter));padding:26px var(--gutter) 0;border-radius:24px 24px 0 0}}

/* ---------- Árabe (RTL): lógica de flujo en inline; el resto se refleja solo (grid, flex, order). ---------- */
:root[dir="rtl"]{--display:"Plus Jakarta Sans","Noto Sans Arabic","Segoe UI",Tahoma,system-ui,sans-serif;--text:"Plus Jakarta Sans","Noto Sans Arabic","Segoe UI",Tahoma,system-ui,sans-serif}
[dir="rtl"] *{letter-spacing:0!important}
[dir="rtl"] h1,[dir="rtl"] h2,[dir="rtl"] h3{line-height:1.3;text-wrap:balance}
[dir="rtl"] .hero h1{line-height:1.15;max-width:12ch}
[dir="rtl"] .place-name{line-height:1.05}
[dir="rtl"] .place-name span{line-height:1.3}
[dir="rtl"] .csl-logo{direction:ltr}
[dir="rtl"] .rates td:nth-child(n+3){direction:ltr;text-align:left}
[dir="rtl"] .rates thead th:nth-child(n+3){text-align:left}
[dir="rtl"] .stars{letter-spacing:3px!important;direction:ltr}
@media (min-width:761px){[dir="rtl"] .hero-media::after{background:linear-gradient(180deg,rgba(6,48,77,.55) 0,rgba(6,48,77,0) 22%,rgba(6,48,77,0) 40%,rgba(6,48,77,.72) 100%),linear-gradient(270deg,rgba(6,48,77,.6),rgba(6,48,77,.15) 55%,rgba(6,48,77,0) 70%)}}