/* Guías de Arlequin Suites · misma paleta y tipografía que la web principal */
@font-face{font-family:'Marcellus';font-style:normal;font-weight:400;font-display:swap;src:url('/fonts/marcellus-400.woff2') format('woff2')}
@font-face{font-family:'Cormorant Garamond';font-style:normal;font-weight:300;font-display:swap;src:url('/fonts/cormorant-300.woff2') format('woff2')}
@font-face{font-family:'Cormorant Garamond';font-style:normal;font-weight:400;font-display:swap;src:url('/fonts/cormorant-400.woff2') format('woff2')}
@font-face{font-family:'Cormorant Garamond';font-style:italic;font-weight:400;font-display:swap;src:url('/fonts/cormorant-400i.woff2') format('woff2')}

:root{
  --ink:#2b2a26; --ink-soft:#57544c; --ink-mute:#8f8a7e;
  --sand:#f5f3ee; --card:#fbfaf7; --line:#e2ddd2;
  --sea:#6b7872; --sea-dark:#4d5852; --sea-soft:#eceae2;
  --display:'Marcellus',Georgia,serif;
  --serif:'Cormorant Garamond','Palatino Linotype',Palatino,Georgia,serif;
  --sans:-apple-system,BlinkMacSystemFont,'Segoe UI',Helvetica,Arial,sans-serif;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--sand);color:var(--ink);font-family:var(--serif);font-size:1.06rem;line-height:1.85;-webkit-font-smoothing:antialiased}

/* cabecera */
.hdr{position:sticky;top:0;z-index:20;background:rgba(245,243,238,.94);backdrop-filter:saturate(140%) blur(8px);border-bottom:1px solid var(--line)}
.hdr-in{max-width:1080px;margin:0 auto;padding:.9rem 1.5rem;display:flex;align-items:center;gap:1.4rem}
.logo{font-family:var(--display);font-size:1.05rem;letter-spacing:.3em;text-transform:uppercase;color:var(--ink);text-decoration:none;white-space:nowrap}
.logo span{display:block;font-family:var(--sans);font-size:.55rem;letter-spacing:.34em;color:var(--ink-mute);margin-top:.25rem}
.hdr nav{margin-left:auto;display:flex;align-items:center;gap:1.3rem}
.hdr nav a{font-family:var(--sans);font-size:.7rem;letter-spacing:.16em;text-transform:uppercase;color:var(--ink-soft);text-decoration:none}
.hdr nav a:hover{color:var(--ink)}
.hdr .cta{background:var(--sea-dark);color:#fff;padding:.7rem 1.2rem}
.hdr .cta:hover{color:#fff;background:var(--ink)}
.lang{display:flex;gap:.5rem;font-family:var(--sans);font-size:.68rem;letter-spacing:.1em}
.lang a{color:var(--ink-mute);text-decoration:none;padding:.15rem .3rem}
.lang a.on{color:var(--ink);border-bottom:1px solid var(--ink)}

/* portada del artículo */
.wrap{max-width:760px;margin:0 auto;padding:0 1.5rem}
.crumbs{font-family:var(--sans);font-size:.66rem;letter-spacing:.18em;text-transform:uppercase;color:var(--ink-mute);padding:2.6rem 0 1.4rem}
.crumbs a{color:var(--ink-mute);text-decoration:none}
.crumbs a:hover{color:var(--ink)}
h1{font-family:var(--display);font-weight:400;font-size:clamp(2rem,5vw,3rem);line-height:1.14;margin:0 0 1rem;letter-spacing:-.01em}
.lede{font-size:1.24rem;color:var(--ink-soft);margin:0 0 2.2rem;font-style:italic}
.meta{font-family:var(--sans);font-size:.66rem;letter-spacing:.16em;text-transform:uppercase;color:var(--ink-mute);border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:.9rem 0;margin-bottom:2.6rem}

article h2{font-family:var(--display);font-weight:400;font-size:1.7rem;line-height:1.25;margin:3rem 0 .9rem}
article h3{font-family:var(--sans);font-size:.76rem;letter-spacing:.2em;text-transform:uppercase;color:var(--ink);margin:2.3rem 0 .6rem}
article p{margin:0 0 1.15rem;color:var(--ink-soft)}
article p strong{color:var(--ink);font-weight:600}
article a{color:var(--sea-dark);text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:.18em}
article ul{margin:0 0 1.3rem;padding-left:1.15rem;color:var(--ink-soft)}
article li{margin:.35rem 0}

/* tabla */
.tabla{width:100%;border-collapse:collapse;margin:1.6rem 0 2rem;font-size:.98rem}
.tabla th{font-family:var(--sans);font-size:.62rem;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-mute);text-align:left;padding:.6rem .7rem;border-bottom:1px solid var(--ink);font-weight:400}
.tabla td{padding:.7rem .7rem;border-bottom:1px solid var(--line);color:var(--ink-soft);vertical-align:top}
.tabla td:first-child{color:var(--ink)}
.tabla-envoltura{overflow-x:auto;-webkit-overflow-scrolling:touch}

/* aviso / nota */
.nota{background:var(--sea-soft);border-left:2px solid var(--sea);padding:1.2rem 1.4rem;margin:1.8rem 0;font-size:.98rem}
.nota p{margin:0;color:var(--ink-soft)}
.nota p + p{margin-top:.7rem}

/* llamada a la reserva */
.reserva{background:var(--card);border:1px solid var(--line);padding:2.2rem 2rem;margin:3.2rem 0;text-align:center}
.reserva h2{margin:0 0 .6rem;font-size:1.5rem}
.reserva p{margin:0 auto 1.5rem;max-width:44ch}
.btn{display:inline-block;background:var(--sea-dark);color:#fff;text-decoration:none;font-family:var(--sans);font-size:.72rem;letter-spacing:.2em;text-transform:uppercase;padding:1rem 2.2rem}
.btn:hover{background:var(--ink)}

/* otras guías */
.otras{border-top:1px solid var(--line);margin-top:3.4rem;padding-top:2rem}
.otras h2{font-size:1.3rem;margin:0 0 1.2rem}
.otras-lista{display:grid;gap:1rem;grid-template-columns:repeat(auto-fit,minmax(220px,1fr))}
.otras-lista a{display:block;background:var(--card);border:1px solid var(--line);padding:1.1rem 1.2rem;text-decoration:none;color:var(--ink)}
.otras-lista a:hover{border-color:var(--sea)}
.otras-lista b{display:block;font-family:var(--display);font-weight:400;font-size:1.08rem;line-height:1.3;margin-bottom:.3rem}
.otras-lista span{font-family:var(--sans);font-size:.72rem;color:var(--ink-mute);line-height:1.6}

/* pie */
footer{margin-top:4rem;border-top:1px solid var(--line);background:var(--card)}
.pie-in{max-width:1080px;margin:0 auto;padding:2.6rem 1.5rem;font-family:var(--sans);font-size:.74rem;color:var(--ink-soft);line-height:2}
.pie-in a{color:var(--sea-dark);text-decoration:none}
.pie-in a:hover{text-decoration:underline}
.pie-legal{margin-top:1rem;font-size:.66rem;color:var(--ink-mute);line-height:1.9}

@media(max-width:700px){
  body{font-size:1.02rem}
  .hdr nav > a:not(.cta){display:none}   /* el selector de idioma va dentro de .lang y no se oculta */
  .lede{font-size:1.12rem}
  .reserva{padding:1.8rem 1.2rem}
}
