/* Layout: a charter brochure. A photo-led hero with the booking bar docked to it; below, a 12-column grid
   with thin rules where every experience carries a fare sheet whose last line reads "No charge".
   Built on logical properties so Arabic and Urdu mirror without a second stylesheet. */
:root{
  --bg:#F3F6F7; --surface:#FFFFFF; --ink:#0A2239; --ink-2:#3C5368; --muted:#5F7587; --line:#D3DDE3;
  --accent:#077A80; --accent-ink:#FFFFFF; --accent-soft:#DCEFEF;
  --deep:#0A2239; --deep-ink:#EAF2F6; --deep-muted:#A9BBC8; --deep-line:#27425B; --brass:#D0A867;
  --photo-ink:#FFFFFF; --photo-shade:rgba(6,22,38,.74); --photo-veil:rgba(6,22,38,.2); --shadow:rgba(10,34,57,.42);
  --ok-bg:#DDF1E6; --ok-ink:#146B3A; --warn-bg:#FBEFD3; --warn-ink:#8A5A00; --bad-bg:#F8DEDB; --bad-ink:#A3261B;
}
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]){
    color-scheme:dark;
    --bg:#071725; --surface:#0E2436; --ink:#E8F0F5; --ink-2:#BAC9D5; --muted:#8FA4B4; --line:#213A4F;
    --accent:#45C4C6; --accent-ink:#04201F; --accent-soft:#103A40;
    --deep:#04101B; --deep-ink:#EAF2F6; --deep-muted:#A9BBC8; --deep-line:#1F3850; --brass:#D0A867;
    --photo-ink:#FFFFFF; --photo-shade:rgba(4,14,24,.8); --photo-veil:rgba(4,14,24,.28); --shadow:rgba(0,0,0,.7);
    --ok-bg:#123A28; --ok-ink:#7FD8A5; --warn-bg:#3A2E10; --warn-ink:#F2C26B; --bad-bg:#42191A; --bad-ink:#F59A90;
  }
}
:root[data-theme="dark"]{
  color-scheme:dark;
  --bg:#071725; --surface:#0E2436; --ink:#E8F0F5; --ink-2:#BAC9D5; --muted:#8FA4B4; --line:#213A4F;
  --accent:#45C4C6; --accent-ink:#04201F; --accent-soft:#103A40;
  --deep:#04101B; --deep-ink:#EAF2F6; --deep-muted:#A9BBC8; --deep-line:#1F3850; --brass:#D0A867;
  --photo-ink:#FFFFFF; --photo-shade:rgba(4,14,24,.8); --photo-veil:rgba(4,14,24,.28); --shadow:rgba(0,0,0,.7);
  --ok-bg:#123A28; --ok-ink:#7FD8A5; --warn-bg:#3A2E10; --warn-ink:#F2C26B; --bad-bg:#42191A; --bad-ink:#F59A90;
}
*{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--ink)}
img{max-width:100%}
/* One type system for ten languages: the Noto family, display serif over sans text.
   Each script swaps in its own Noto faces, line height and heading scale. */
.page{--display:"Noto Serif Display","Iowan Old Style",Georgia,serif;--text:"Noto Sans","Segoe UI",system-ui,sans-serif;
  --lh:1.62;--lhd:1.07;--track:.16em;--ds:1;--caps:uppercase;
  font-family:var(--text);font-size:16px;line-height:var(--lh);color:var(--ink)}
.page[lang="de"]{--ds:.88}
.page[lang="fr"],.page[lang="pt"],.page[lang="es"]{--ds:.95}
.page[lang="zh"]{--display:"Noto Serif SC","Songti SC","SimSun",serif;--text:"Noto Sans SC","PingFang SC","Microsoft YaHei",sans-serif;--lh:1.85;--lhd:1.3;--track:.12em;--ds:.9}
.page[lang="hi"]{--display:"Noto Serif Devanagari","Nirmala UI",serif;--text:"Noto Sans Devanagari","Nirmala UI",sans-serif;--lh:1.85;--lhd:1.42;--track:0;--ds:.84;--caps:none}
.page[lang="ja"]{--display:"Noto Serif JP","Yu Mincho","Hiragino Mincho ProN",serif;--text:"Noto Sans JP","Yu Gothic","Hiragino Kaku Gothic ProN",Meiryo,sans-serif;--lh:1.9;--lhd:1.36;--track:.1em;--ds:.8;line-break:strict}
.page[lang="ko"]{--display:"Noto Serif KR",Batang,serif;--text:"Noto Sans KR","Malgun Gothic",sans-serif;--lh:1.85;--lhd:1.36;--track:.06em;--ds:.84;word-break:keep-all}
.w{max-width:1200px;margin-inline:auto;padding-inline:max(16px,4vw)}
h1,h2,h3,p,ul,ol,dl,dd,figure{margin:0}
h1,h2{font-family:var(--display);font-weight:300;line-height:var(--lhd);text-wrap:balance}
h2{font-size:calc(clamp(2rem,4.4vw,3.3rem)*var(--ds))}
.label{font-size:.74rem;font-weight:600;letter-spacing:var(--track);text-transform:var(--caps);color:var(--accent)}
a{color:inherit}
:focus-visible{outline:2px solid var(--accent);outline-offset:3px}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;font:inherit;font-weight:600;font-size:.92rem;line-height:1.3;padding:14px 24px;border:1px solid var(--accent);background:var(--accent);color:var(--accent-ink);text-decoration:none;cursor:pointer;border-radius:2px}
.btn.line{background:transparent;color:var(--ink);border-color:var(--ink)}
.btn.line:hover{background:var(--ink);color:var(--bg)}
.btn[disabled]{opacity:.55;cursor:default}
.arr{display:inline-block}
[dir="rtl"] .arr{transform:scaleX(-1)}

/* utility bar + header */
.util{background:var(--deep);color:var(--deep-ink);font-size:.8rem}
.util .w{display:flex;justify-content:space-between;align-items:center;gap:6px 16px;padding-block:7px;flex-wrap:wrap}
.pin{display:inline-flex;align-items:center;gap:8px;min-width:0}
.pin svg,.lang summary svg{flex:none}
.lang{position:relative}
.util-der{display:inline-flex;align-items:center;gap:18px}.mia-util{color:var(--deep-ink);font-weight:600;text-underline-offset:4px;white-space:nowrap}
.lang summary{list-style:none;cursor:pointer;display:inline-flex;align-items:center;gap:8px;padding:4px 0}
.lang summary::-webkit-details-marker{display:none}
.lang ul{position:absolute;inset-inline-end:0;top:calc(100% + 8px);z-index:30;background:var(--surface);color:var(--ink);border:1px solid var(--line);list-style:none;margin:0;padding:8px;display:grid;grid-template-columns:1fr 1fr;gap:2px;width:min(280px,calc(100vw - 32px));box-shadow:0 18px 40px -20px var(--shadow)}
.lang a{display:block;font-size:.95rem;text-decoration:none;padding:8px 10px;border-radius:2px}
.lang a:hover{background:var(--accent-soft)}
.lang a[aria-current="true"]{font-weight:600;color:var(--accent)}
.top{background:var(--surface);border-bottom:1px solid var(--line)}
.top .w{display:flex;align-items:center;justify-content:space-between;gap:24px;padding-block:18px}
.brand{font-family:"Noto Serif Display",Georgia,serif;font-size:1.2rem;font-weight:400;letter-spacing:.22em;text-transform:uppercase;text-decoration:none;white-space:nowrap}
.top nav{display:flex;gap:28px;font-size:.92rem}
.top nav a{text-decoration:none;color:var(--ink-2);white-space:nowrap}
.top nav a:hover{color:var(--ink);text-decoration:underline;text-underline-offset:6px}
.top .btn{padding:10px 20px;white-space:nowrap}

/* hero + docked booking bar */
.hero{position:relative;isolation:isolate;color:var(--photo-ink);overflow:hidden}
.hero>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-2;max-width:none}
.hero::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(to top,var(--photo-shade),var(--photo-veil) 62%)}
.hero .w{display:flex;flex-direction:column;gap:20px;padding-block:clamp(84px,13vw,176px) clamp(118px,13vw,166px)}
.hero .label{color:var(--photo-ink)}
.hero h1{font-size:calc(clamp(2.7rem,7.4vw,6rem)*var(--ds));max-width:11.5em}
.hero .sub{font-size:clamp(1.02rem,1.5vw,1.24rem);max-width:34em}
.bar{position:relative;z-index:2;margin-top:-58px}
.bar form{background:var(--surface);border:1px solid var(--line);display:grid;grid-template-columns:minmax(0,2.2fr) minmax(0,1.3fr) minmax(0,.9fr) auto;box-shadow:0 22px 48px -28px var(--shadow)}
.bar label{display:flex;flex-direction:column;gap:2px;padding:13px 20px;border-inline-end:1px solid var(--line);min-width:0}
.bar label span{font-size:.7rem;font-weight:600;letter-spacing:var(--track);text-transform:var(--caps);color:var(--muted)}
.bar select,.bar input{font:inherit;font-size:1rem;border:0;background:transparent;color:var(--ink);padding:4px 0;min-width:0;width:100%}
/* la lista desplegada toma el fondo del select: con fondo transparente, en modo oscuro quedaba texto claro sobre blanco */
.bar select{background:var(--surface)}
select option{background:var(--surface);color:var(--ink)}
.bar .btn{border-radius:0;padding-inline:30px}
.bar .note{margin-top:12px;font-size:.84rem;color:var(--muted)}

.sec{padding-block:clamp(64px,9vw,116px)}
.head{display:flex;flex-direction:column;gap:14px;margin-bottom:clamp(28px,4vw,52px);max-width:46em}

/* fare statement */
.free .cols{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:clamp(20px,4vw,64px)}
.free .cols>div{display:flex;flex-direction:column;gap:14px;min-width:0}
.free .cols>div:first-child{grid-column:span 5}
.free .cols>div:last-child{grid-column:span 7;color:var(--ink-2);font-size:1.04rem;padding-top:1.9rem}
.facts{list-style:none;padding:0;margin-top:clamp(36px,5vw,64px);display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(20px,3vw,40px)}
.facts li{border-top:1px solid var(--ink);padding-top:16px;display:flex;flex-direction:column;gap:6px;color:var(--ink-2);font-size:.94rem;min-width:0}
.facts strong{font-family:var(--display);font-weight:400;font-size:calc(1.55rem*var(--ds));line-height:var(--lhd);color:var(--ink)}

/* experiences */
.exps{background:var(--surface);border-block:1px solid var(--line)}
.exp{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:clamp(20px,3.4vw,56px);align-items:center;padding-block:clamp(30px,4.4vw,60px);border-top:1px solid var(--line)}
.exp figure{grid-column:span 7;min-width:0}
.exp figure img{display:block;width:100%;aspect-ratio:4/3;object-fit:cover}
/* galeria de cada experiencia y visor de fotos */
.exp figure{display:flex;flex-direction:column;gap:8px}
.g-main,.g-thumbs button{display:block;width:100%;padding:0;border:0;background:none;cursor:zoom-in;position:relative}
.g-main:focus-visible,.g-thumbs button:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.exp .g-thumbs{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}
.exp .g-thumbs li{padding:0;border:0}
.exp .g-thumbs li::before{display:none}
.g-thumbs button:hover img{opacity:.85}
.g-mas{position:absolute;inset:0;display:grid;place-items:center;background:rgba(6,22,38,.55);color:#fff;font-weight:600;font-size:1.1rem}
.visor{border:0;padding:0;margin:0;background:transparent;width:100vw;height:100vh;max-width:none;max-height:none;color:#fff}
.visor::backdrop{background:rgba(4,14,24,.97)}
.visor[open]{display:block}
.visor-in{position:fixed;inset:0;display:flex;align-items:center;justify-content:center;padding:60px 64px}
.visor-in img{max-width:min(1400px,100%);max-height:100%;object-fit:contain;display:block}
.visor button{position:absolute;width:46px;height:46px;border-radius:50%;border:1px solid rgba(255,255,255,.45);background:rgba(4,14,24,.55);color:#fff;font:inherit;font-size:1.6rem;line-height:1;cursor:pointer;display:grid;place-items:center;padding:0}
.visor button:hover{background:rgba(255,255,255,.15)}
.v-cerrar{top:12px;inset-inline-end:12px}
.v-ant{inset-inline-start:12px;top:50%;transform:translateY(-50%)}
.v-sig{inset-inline-end:12px;top:50%;transform:translateY(-50%)}
.v-cuenta{position:absolute;bottom:14px;left:0;right:0;margin:0;text-align:center;font-size:.9rem;color:rgba(255,255,255,.85)}
.v-credito{position:absolute;bottom:14px;inset-inline-end:16px;max-width:45%;font-size:.72rem;color:rgba(255,255,255,.7);text-align:end}
.v-credito[hidden]{display:none}
.creditos{margin-top:10px;font-size:.74rem;color:var(--deep-muted)}
.creditos summary{cursor:pointer}
.creditos ul{list-style:none;padding:8px 0 0;margin:0;display:flex;flex-direction:column;gap:3px;flex-direction:column}
.creditos a{color:var(--deep-muted);text-transform:capitalize}
@media (max-width:560px){.v-credito{bottom:62px;inset-inline-end:0;left:0;max-width:none;text-align:center}}
@media (max-width:560px){.visor-in{padding:56px 8px}.v-ant,.v-sig{top:auto;bottom:8px;transform:none}}
.exp .body{grid-column:span 5;display:flex;flex-direction:column;gap:18px;min-width:0}
.exp:nth-child(even) figure{order:2}
.exp h3{font-family:var(--display);font-weight:400;font-size:calc(clamp(1.65rem,2.7vw,2.25rem)*var(--ds));line-height:var(--lhd);text-wrap:balance}
.exp .lead{color:var(--ink-2)}
.mini{font-size:.72rem;font-weight:600;letter-spacing:var(--track);text-transform:var(--caps);color:var(--muted);margin-bottom:6px}
.exp ul{list-style:none;padding:0}
.exp li{position:relative;padding-block:7px;padding-inline-start:22px;font-size:.94rem;color:var(--ink-2);border-bottom:1px solid var(--line)}
.exp li::before{content:"";position:absolute;inset-inline-start:0;top:1.15em;width:10px;height:1px;background:var(--accent)}
.fare{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.6fr);border-top:1px solid var(--ink)}
.fare dt,.fare dd{padding:9px 0;border-bottom:1px solid var(--line);font-size:.9rem;min-width:0}
.fare dt{color:var(--muted);padding-inline-end:16px}
.fare .free-row{color:var(--accent);font-weight:600;border-bottom-color:var(--ink)}
.fare dt.free-row{font-weight:400;color:var(--muted)}

/* on board */
.tiles{list-style:none;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(20px,2.8vw,40px) clamp(16px,2.4vw,32px)}
.tiles li{display:flex;flex-direction:column;gap:8px;min-width:0}
.tiles img{display:block;width:100%;aspect-ratio:3/2;object-fit:cover;margin-bottom:6px}
.tiles figure{margin:0 0 6px}
.tiles .g-main img{margin-bottom:0}
.g-num{position:absolute;inset-inline-end:8px;bottom:8px;display:inline-flex;align-items:center;gap:5px;padding:3px 9px;border-radius:999px;background:rgba(6,22,38,.72);color:#fff;font-size:.78rem;font-weight:600;line-height:1.4}
.tiles h3{font-family:var(--text);font-size:1.05rem;font-weight:600;line-height:1.35}
.tiles p{font-size:.92rem;color:var(--ink-2)}

/* how to book */
.how{background:var(--deep);color:var(--deep-ink)}
.how .label{color:var(--brass)}
.steps{list-style:none;padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:clamp(20px,3vw,40px);counter-reset:s}
.steps li{counter-increment:s;border-top:1px solid var(--deep-line);padding-top:18px;display:flex;flex-direction:column;gap:8px;min-width:0}
.steps li::before{content:counter(s,decimal-leading-zero);font-family:"Noto Serif Display",Georgia,serif;font-weight:300;font-size:2.4rem;line-height:1;color:var(--brass)}
.steps h3{font-family:var(--text);font-size:1.05rem;font-weight:600;line-height:1.35}
.steps p{font-size:.92rem;color:var(--deep-muted)}

/* practical information */
.info{list-style:none;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(24px,4vw,56px) clamp(24px,5vw,80px)}
.info>li{border-top:1px solid var(--ink);padding-top:16px;display:flex;flex-direction:column;gap:8px;min-width:0}
.info h3{font-family:var(--display);font-weight:400;font-size:calc(1.6rem*var(--ds));line-height:var(--lhd)}
.info p{color:var(--ink-2)}
.marinas{list-style:none;padding:0;margin-top:6px}
.marinas li{display:flex;justify-content:space-between;align-items:baseline;gap:12px;padding-block:8px;border-bottom:1px solid var(--line);font-size:.94rem}
.marinas em{font-style:normal;font-size:.76rem;color:var(--muted)}
.marinas li:first-child em{color:var(--accent);font-weight:600}

/* help */
.faq{max-width:860px}
.faq details{border-top:1px solid var(--line)}
.faq details:last-child{border-bottom:1px solid var(--line)}
.faq summary{cursor:pointer;list-style:none;display:flex;justify-content:space-between;align-items:center;gap:16px;padding-block:18px;font-weight:600;font-size:1.02rem}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";font-family:"Noto Sans",sans-serif;font-weight:400;font-size:1.4rem;line-height:1;color:var(--accent);flex:none}
.faq details[open] summary::after{content:"−"}
.faq p{padding-bottom:20px;color:var(--ink-2);max-width:62ch}

/* booking */
.book{background:var(--surface);border-top:1px solid var(--line)}
.book .cols{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:clamp(24px,4vw,64px)}
.book .side{grid-column:span 5;display:flex;flex-direction:column;gap:16px;min-width:0}
.book .side p{color:var(--ink-2)}
.book .side img{display:block;width:100%;aspect-ratio:4/4.4;object-fit:cover;margin-top:14px}
.book form{grid-column:span 7;display:flex;flex-direction:column;gap:18px;min-width:0;position:relative}
.row{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}
.fld{display:flex;flex-direction:column;gap:6px;font-size:.88rem;color:var(--ink-2);min-width:0}
.fld small{color:var(--muted);font-size:.78rem}
.fld input,.fld select,.fld textarea{font:inherit;font-size:1rem;padding:12px;border:1px solid var(--line);background:var(--bg);color:var(--ink);border-radius:2px;width:100%;min-width:0}
.fld input:focus,.fld select:focus,.fld textarea:focus{outline:none;border-color:var(--accent)}
.fld textarea{resize:vertical;min-height:110px}
.hp{position:absolute;width:1px;height:1px;padding:0;border:0;opacity:0;overflow:hidden;clip-path:inset(50%);pointer-events:none}
.status{min-height:1.5em;font-size:.94rem;color:var(--ink-2)}
.status.ok{color:var(--accent);font-weight:600}
.fld [aria-invalid="true"]{border-color:var(--bad-ink)}
.vh{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}

/* formulario por pasos (con JavaScript se ve un paso a la vez) */
.pasos-form{list-style:none;margin:0;padding:0;display:flex;gap:10px}
.pasos-form li{flex:1 1 0;display:flex;align-items:center;gap:10px;padding-top:10px;border-top:3px solid var(--line);font-size:.82rem;font-weight:600;color:var(--muted);min-width:0;overflow-wrap:anywhere;hyphens:auto}
.pasos-form li span{flex:none;display:inline-grid;place-items:center;width:26px;height:26px;border-radius:50%;border:1px solid var(--line);font-size:.78rem}
.pasos-form li.on,.pasos-form li.ok{border-top-color:var(--accent);color:var(--ink)}
.pasos-form li.on span{background:var(--accent);border-color:var(--accent);color:var(--accent-ink)}
.pasos-form li.ok span{border-color:var(--accent);color:var(--accent)}
html:not(.js) .pasos-form,html:not(.js) .nav-pasos [data-ir]{display:none}
.paso{border:0;margin:0;padding:0;min-width:0;display:flex;flex-direction:column;gap:18px}
.paso legend{padding:0;margin-bottom:2px;font-family:var(--display);font-size:calc(1.3rem*var(--ds));color:var(--ink)}
html.js .paso:not(.on){display:none}
html.js .paso legend{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.nav-pasos{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;margin-top:4px}
.nav-pasos .btn:only-child{margin-inline-start:auto}
.estadia{display:flex;flex-direction:column;gap:10px;padding:14px 16px;background:var(--accent-soft);border-radius:4px}
html.js .estadia:not(.on){display:none}
.estadia-q{margin:0;font-size:.92rem;font-weight:600;color:var(--ink)}
.estadia-q small{font-weight:400;color:var(--muted)}
.estadia>small{font-size:.8rem;color:var(--ink-2)}
.estadia .fld input{background:var(--surface)}
.pax{display:flex;flex-direction:column;border-top:1px solid var(--line)}
.cnt{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:12px 0;border-bottom:1px solid var(--line)}
.cnt-t{display:flex;flex-direction:column;gap:2px;min-width:0}
.cnt-t b{font-weight:600;color:var(--ink)}
.cnt-t small{font-size:.8rem;color:var(--muted)}
.cnt-c{display:flex;align-items:center;gap:12px;flex:none}
.cnt-c output{min-width:1.6em;text-align:center;font-size:1.15rem;font-weight:600;color:var(--ink)}
.cnt-b{width:40px;height:40px;border-radius:50%;border:1px solid var(--accent);background:transparent;color:var(--accent);font:inherit;font-size:1.3rem;line-height:1;cursor:pointer;display:inline-grid;place-items:center;padding:0}
.cnt-b:hover:not([disabled]){background:var(--accent);color:var(--accent-ink)}
.cnt-b[disabled]{border-color:var(--line);color:var(--line);cursor:default}
.pax-total{margin:0;font-size:.86rem;font-weight:600;color:var(--ink-2)}
.edades{display:grid;grid-template-columns:repeat(auto-fill,minmax(170px,1fr));gap:12px 18px}
.edades:empty{display:none}
.pax-nota{margin:0;font-size:.84rem;color:var(--ink-2);background:var(--accent-soft);padding:10px 12px;border-radius:4px}

/* footer */
.foot{background:var(--deep);color:var(--deep-ink);padding-block:clamp(56px,7vw,88px) 28px}
.foot .cols{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:clamp(24px,4vw,56px)}
.foot .about{grid-column:span 5;display:flex;flex-direction:column;gap:16px;min-width:0}
.foot .brand{font-size:1.5rem;color:var(--deep-ink);white-space:normal}
.foot .about p{color:var(--deep-muted);max-width:40ch}
.foot .col{grid-column:span 3;min-width:0}
.foot .col:last-child{grid-column:span 4}
.foot h3{font-size:.72rem;font-weight:600;letter-spacing:var(--track);text-transform:var(--caps);color:var(--brass);margin-bottom:12px}
.foot ul{list-style:none;padding:0;display:flex;flex-direction:column;gap:8px;font-size:.92rem}
.foot .langs{flex-direction:row;flex-wrap:wrap;gap:6px 18px}
.foot a{text-decoration:none;color:var(--deep-ink)}
.foot a:hover{text-decoration:underline;text-underline-offset:4px}
.foot .fine{margin-top:clamp(36px,5vw,60px);padding-top:18px;border-top:1px solid var(--deep-line);font-size:.8rem;color:var(--deep-muted)}

@media (max-width:1020px){.top nav{display:none}}
@media (max-width:900px){
  .free .cols>div:first-child,.free .cols>div:last-child,.exp figure,.exp .body,.book .side,.book form,.foot .about,.foot .col,.foot .col:last-child{grid-column:1/-1}
  .free .cols>div:last-child{padding-top:0}
  .exp:nth-child(even) figure{order:0}
  .facts,.tiles{grid-template-columns:repeat(2,minmax(0,1fr))}
  .steps{grid-template-columns:repeat(2,minmax(0,1fr))}
  .book .side img{aspect-ratio:16/9}
  .bar form{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
  .bar label{border-bottom:1px solid var(--line)}
  .bar label:first-child,.bar .btn{grid-column:1/-1}
  .bar label:first-child,.bar label:nth-child(3){border-inline-end:0}
}
@media (max-width:560px){
  .facts,.tiles,.steps,.info,.row{grid-template-columns:minmax(0,1fr)}
  .brand{font-size:1rem;letter-spacing:.16em}
  .top .btn{padding:9px 14px}
  .bar{margin-top:-44px}
}

/* clima de los proximos 16 dias */
.clima-sec .head p{color:var(--ink-2)}
.clima-dest{max-width:480px;margin-bottom:16px}
.clima-strip{list-style:none;margin:0;padding:4px 0 14px;display:flex;gap:12px;overflow-x:auto;scroll-snap-type:x proximity}
.clima-strip .dc{position:relative;flex:0 0 136px;scroll-snap-align:start;background:var(--surface);border:1px solid var(--line);border-top:4px solid var(--line);border-radius:4px;padding:12px 12px 14px;display:flex;flex-direction:column;align-items:flex-start;gap:6px;font-size:.84rem;color:var(--ink-2)}
.clima-strip .dc.lvl-0{border-top-color:var(--ok-ink)}
.clima-strip .dc.lvl-1{border-top-color:var(--warn-ink)}
.clima-strip .dc.lvl-2{border-top-color:var(--bad-ink)}
.clima-strip .dia{font-size:.8rem;color:var(--muted);white-space:nowrap}
.clima-strip .dia b{font-weight:600;color:var(--ink);text-transform:capitalize}
.clima-strip .wx{width:44px;height:44px;color:var(--accent);margin-block:2px}
.clima-strip .t{display:flex;align-items:baseline;gap:6px;font-family:var(--display);line-height:1.1}
.clima-strip .t b{font-weight:400;font-size:1.65rem;color:var(--ink)}
.clima-strip .t small{font-size:1rem;color:var(--muted)}
.clima-strip .nav{align-self:stretch;margin-top:4px;padding-top:10px;border-top:1px dashed var(--line);display:flex;flex-direction:column;align-items:flex-start;gap:6px;color:var(--ink)}
.dato{display:inline-flex;align-items:center;gap:5px;white-space:nowrap}
.ic{width:16px;height:16px;flex:none;color:var(--accent);vertical-align:-3px}
.ic.flecha{color:var(--ink)}
.chip{display:inline-block;padding:2px 9px;border-radius:999px;font-size:.74rem;font-weight:600;line-height:1.5;white-space:nowrap}
.chip.lvl-0{background:var(--ok-bg);color:var(--ok-ink)}
.chip.lvl-1{background:var(--warn-bg);color:var(--warn-ink)}
.chip.lvl-2{background:var(--bad-bg);color:var(--bad-ink)}
.clima-ley{margin:10px 0 0;display:flex;flex-wrap:wrap;align-items:center;gap:8px 10px;font-size:.8rem;color:var(--muted)}
.clima-ley>span:last-child{flex:1 1 280px}
.clima-credit{margin-top:10px;font-size:.78rem;color:var(--muted)}
.clima-credit a{color:var(--muted)}
.clima-hint{margin:0;font-size:.86rem;line-height:1.55;color:var(--ink-2);background:var(--accent-soft);padding:10px 12px;border-radius:4px}
.clima-hint[hidden]{display:none}
.clima-hint.tarjeta{display:flex;gap:12px;align-items:flex-start;background:var(--surface);border:1px solid var(--line);border-inline-start:4px solid var(--accent)}
.clima-hint.tarjeta.lvl-0{border-inline-start-color:var(--ok-ink)}
.clima-hint.tarjeta.lvl-1{border-inline-start-color:var(--warn-ink)}
.clima-hint.tarjeta.lvl-2{border-inline-start-color:var(--bad-ink)}
.clima-hint .wx{width:40px;height:40px;flex:none;color:var(--accent)}
.clima-hint.tarjeta>div{display:flex;flex-direction:column;gap:4px;min-width:0}
.clima-hint b{display:block;color:var(--ink)}
.clima-hint b::first-letter{text-transform:uppercase}
.clima-hint .linea{display:block}
.clima-hint small{color:var(--muted);font-size:.78rem}
.bar .clima-hint{margin-top:10px}
/* franja chica dentro del formulario: tocar un dia lo elige */
.clima-mini{display:flex;flex-direction:column;gap:8px;min-width:0}
.clima-mini[hidden]{display:none}
.clima-mini-t{margin:0;font-size:.84rem;color:var(--ink-2)}
.clima-dias{list-style:none;margin:0;padding:3px 3px 10px;display:flex;gap:8px;overflow-x:auto;scroll-snap-type:x proximity}
.clima-dias li{flex:0 0 104px;scroll-snap-align:start;display:flex}
.dm{width:100%;display:flex;flex-direction:column;align-items:flex-start;gap:4px;padding:8px 9px 10px;font:inherit;font-size:.78rem;color:var(--ink-2);background:var(--surface);border:1px solid var(--line);border-top:3px solid var(--line);border-radius:4px;cursor:pointer;text-align:start}
.dm.lvl-0{border-top-color:var(--ok-ink)}
.dm.lvl-1{border-top-color:var(--warn-ink)}
.dm.lvl-2{border-top-color:var(--bad-ink)}
.dm:hover{box-shadow:0 0 0 1px var(--accent)}
.dm.no-disp{cursor:not-allowed;opacity:.55;background:repeating-linear-gradient(45deg,var(--surface),var(--surface) 6px,var(--line) 6px,var(--line) 7px)}
.dm[aria-pressed="true"]{background:var(--accent-soft);box-shadow:0 0 0 2px var(--accent)}
.dm .dia{white-space:nowrap;color:var(--muted)}
.dm .dia b{color:var(--ink);font-weight:600;text-transform:capitalize}
.dm .wx{width:28px;height:28px;color:var(--accent)}
.dm .t{font-family:var(--display);font-size:1.15rem;line-height:1.1;color:var(--ink)}
.dm .t small{font-size:.8rem;color:var(--muted);margin-inline-start:5px}
.dm .chip{font-size:.68rem;padding:1px 7px;max-width:100%;overflow:hidden;text-overflow:ellipsis}