.co-guide,.co-await{--azul:#446dab;--oro:#f2c35f;--rojo:#bf594c;--carbon:#191716;--linea:#d1c2a8}
.co-hero{position:relative;isolation:isolate;overflow:hidden;color:#fff5df;background:#190e0d}
.co-hero picture,.co-hero::after{position:absolute;z-index:-2;inset:0 0 0 20%;pointer-events:none}
.co-hero picture img{width:100%;height:100%;object-fit:cover;object-position:50% 20%}
.co-hero::after{content:"";inset:0;z-index:-1;background:linear-gradient(90deg,#190e0d 3%,#190e0df7 20%,#190e0ddc 31%,#190e0d90 42%,transparent 57%),linear-gradient(0deg,#190f0bd6,transparent 23%)}
.co-stage{min-height:clamp(460px,38vw,630px);display:flex;flex-direction:column;align-items:flex-start;justify-content:space-between;padding-block:14px clamp(30px,3.6vw,64px)}
.co-back{display:inline-flex;align-items:center;min-height:44px;font-size:.88rem;font-weight:650;color:inherit;text-underline-offset:4px}.co-back:hover{text-decoration:underline}
.gastro .co-label,.co-edition,.co-table-no,.co-type{font:750 .69rem/1.45 "Segoe UI",Arial,sans-serif;letter-spacing:.14em;text-transform:uppercase}
.co-label{display:flex;align-items:center;gap:9px}.co-label i{display:inline-block;width:27px;height:5px;background:linear-gradient(90deg,var(--oro) 50%,var(--azul) 50% 75%,var(--rojo) 75%)}
.co-hero .co-label,.co-await .co-label{color:var(--oro)}
.gastro .co-hero h1{margin:12px 0;font-size:clamp(2.9rem,4.65vw,6.1rem);line-height:.96}.co-hero h1 span,.co-hero h1 em{display:block}
.co-hero h1 em{font:italic 500 .98em/1.03 Georgia,serif;color:var(--oro);letter-spacing:-.065em}
.gastro .co-intro{max-width:34ch;font-weight:550;line-height:1.45;font-size:clamp(.96rem,1.2vw,1.15rem);text-wrap:pretty}
.gastro .co-button{display:inline-flex;align-items:center;justify-content:space-between;gap:22px;min-height:44px;padding:7px 9px 7px 17px;border-radius:30px;color:#241c15;background:var(--oro);font:750 .88rem/1.3 "Segoe UI",Arial,sans-serif;margin-top:18px}
.co-button span{display:grid;place-items:center;width:30px;height:30px;border-radius:50%;background:#261c13;color:white}
.co-directory{padding-block:clamp(28px,4vw,62px)}
.co-section-head{display:flex;align-items:flex-end;justify-content:space-between;gap:20px}
.co-section-head .co-label{color:#66533f;margin-bottom:8px}.co-section-head h2{font-size:clamp(2.25rem,3.8vw,4.4rem)}
.gastro .co-edition{white-space:nowrap;color:#65543e}.co-edition b{color:var(--rojo)}
.gastro .co-disclosure{font-size:.94rem;color:#5d5549;margin:10px 0 22px}
.co-await{color:var(--paper);background:#201b19;padding-block:15px 48px}.co-await-panel{padding:clamp(24px,5vw,75px) 0}
.co-await h1{max-width:13em;margin:17px 0!important}.co-await h2{margin:36px 0 6px!important;color:var(--oro);font-size:1.8rem}
@media(hover:hover){.co-button:hover{background:#ffda90}}
@media(max-width:900px){.co-stage{min-height:410px}.co-hero picture{left:14%}.co-hero picture img{object-position:48% 15%}}
@media(max-width:620px){
 .co-hero picture{inset:0 0 auto;width:100%;height:clamp(320px,95vw,510px)}.co-hero picture img{object-position:50% 0}
 .co-hero::after{background:linear-gradient(0deg,#190e0d 1%,#190e0d 24%,#190e0dea 37%,#190e0d85 53%,transparent 66%)}
 .co-stage{min-height:0;padding-block:8px 24px}.co-stage .co-back{padding-inline:12px;border-radius:22px;background:#190e0dcf}
 .co-title{margin-top:clamp(166px,46vw,270px)}.gastro .co-hero h1{font-size:clamp(2.32rem,9.5vw,3.5rem);margin-block:8px}.co-title .co-intro{font-size:.96rem}
 .co-section-head{display:block}.gastro .co-edition{margin-top:9px;font-size:.61rem}
}

/* Un solo patrón para todas las mesas, independientemente de su disponibilidad. */
.co-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));grid-auto-rows:1fr;gap:clamp(14px,1.5vw,22px)}
.co-card{display:grid;grid-template-rows:auto 1fr auto;min-width:0;overflow:hidden;border:1px solid #d7c8ae;border-radius:10px;background:#fffaf0;color:#302a20;box-shadow:0 5px 15px -9px #56402566}
.co-card-cover{position:relative;aspect-ratio:16/9;background:#e0cba5;overflow:hidden}
.co-card-cover img{display:block;width:100%;height:100%;object-fit:cover}
.co-table-no{position:absolute;bottom:9px;left:11px;padding:4px 8px;color:#fff4da;background:#29281fee;border-radius:3px;font-size:.61rem}
.co-card-body{display:flex;flex-direction:column;align-items:stretch;padding:16px 14px 12px}
.gastro .co-card .co-type{font-size:.64rem;color:#725b3a;line-height:1.45;min-height:2.9em;display:flex;align-items:flex-start}
.gastro .co-card h3{font-size:clamp(1.18rem,1.62vw,1.72rem);line-height:1.12;letter-spacing:-.045em;min-height:3.36em;overflow-wrap:break-word;text-wrap:initial}
.gastro .co-blurb{margin:6px 0 16px;color:#554a3e;font-size:.92rem;line-height:1.4}
.co-status{display:flex;align-items:center;gap:7px;margin-top:auto;font-size:.75rem;font-weight:600;line-height:1.3;color:#5c554a}
.co-status i{width:7px;height:7px;border-radius:50%;border:1px solid #847c6d}.co-status .is-ready{background:#497453;border-color:#497453}
.co-card-cta{display:flex;align-items:center;justify-content:space-between;gap:6px;margin-inline:14px;min-height:48px;border-top:1px solid #d9cebb;color:#433b2c;font-weight:700;font-size:.88rem}
.co-card-cta span{display:grid;place-items:center;width:25px;height:25px;border:1px solid #c8bda9;border-radius:50%}
.co-frieze{display:flex;align-items:center;gap:14px;margin-top:clamp(24px,3.5vw,48px);color:#9f8553;opacity:.6}
.co-frieze i{flex:1;height:8px;border-block:1px solid #ccba97;background:repeating-linear-gradient(45deg,transparent 0 8px,#cbb68d 8px 9px,transparent 9px 13px),repeating-linear-gradient(-45deg,transparent 0 8px,#cbb68d 8px 9px,transparent 9px 13px)}
.co-frieze span{font:1.1rem/1 Georgia,serif;border-bottom:3px solid;border-image:linear-gradient(90deg,var(--oro) 50%,var(--azul) 50% 75%,var(--rojo) 75%) 1;padding:0 6px 4px}
@media(min-width:1200px){.co-grid{grid-template-columns:repeat(5,minmax(0,1fr))}}
@media(max-width:1199px){.gastro .co-card h3{font-size:1.55rem;min-height:2.24em}.gastro .co-card .co-type{min-height:1.45em;margin-bottom:6px}}
@media(max-width:620px){.co-grid{grid-template-columns:1fr;gap:18px}.co-card-body{padding:17px 18px 14px}.co-card-cta{margin-inline:18px}}
@media(hover:hover){.co-card:hover{border-color:#ab8c5e;box-shadow:0 8px 19px -8px #56402555}.co-card:hover .co-card-cta span{background:#ede0c6}}
@media(prefers-reduced-motion:no-preference){.co-card,.co-card-cta span{transition:transform .22s ease,box-shadow .22s,border-color .22s}.co-card:active{transform:scale(.994)}}
@media(hover:hover) and (prefers-reduced-motion:no-preference){.co-card:hover{transform:translateY(-2px)}.co-card:hover .co-card-cta span{transform:translate(1px,-1px)}}

/* Unión tricolor del hero con los escenarios: proporción visual 2:1:1. */
.co-hero + .co-landscapes::before {
  content:"";position:absolute;inset:0 0 auto;height:clamp(8px,.8vw,12px);
  z-index:1;pointer-events:none;
  background:var(--bandera,linear-gradient(90deg,#f4cb43 0% 46%,#2862cf 54% 71%,#dc4545 79% 100%));
  box-shadow:0 2px 12px #050b1638;
}

/* Escenarios del directorio. La altura y el desplazamiento los determina la cuadrícula. */
.co-landscapes {
  position:relative; isolation:isolate; background:#10151a; color:#fff6e5;
  view-timeline-name:--co-ciudades;
}
.co-backgrounds,.co-background {position:absolute;inset:0;pointer-events:none}
.co-backgrounds {z-index:-1}
.co-background picture {
  position:sticky;top:0;display:block;height:100vh;height:100svh;max-height:100%;overflow:hidden;
}
.co-background img {width:100%;height:100%;object-fit:cover;object-position:64% 8%}
.co-background picture::after {
  content:"";position:absolute;inset:0;
  background:linear-gradient(95deg,#071018bd,transparent 72%),linear-gradient(0deg,#0c1019a8,#0b101a37 56%,#0d11194d);
}
.co-background + .co-background {mask-image:linear-gradient(transparent 37%,black 63%)}
@supports (animation-timeline:view()) {
  @media(prefers-reduced-motion:no-preference){
    .co-background + .co-background {
      mask-image:none;animation:co-dissolve linear both;
      animation-timeline:--co-ciudades;animation-range:contain 22% contain 78%;
    }
    @keyframes co-dissolve{from{opacity:0}to{opacity:1}}
  }
}
.co-landscapes .co-directory {padding-block:clamp(42px,8vh,90px) clamp(40px,8vh,85px)}
.co-landscapes .co-section-head .co-label {color:#f8d890}
.co-landscapes .co-section-head h2,.co-landscapes .co-edition,.co-landscapes .co-disclosure {
  color:#fff6e6;text-shadow:0 2px 12px #070a0f,0 1px 3px #070a0f;
}
.co-landscapes .co-edition {padding:5px 9px;background:#121619cf;border-radius:4px}
.co-landscapes .co-disclosure {margin-bottom:clamp(40px,8vh,88px)}
.co-landscapes .co-grid {row-gap:clamp(28px,7vh,72px)}
@media(min-width:1200px){.co-landscapes .co-grid{row-gap:clamp(80px,16vh,175px)} .co-landscapes .co-directory{padding-bottom:clamp(100px,22svh,220px)}}
.co-landscapes .co-card {
  --edge:#ffca50;
  --halo:#ffae16;
  --lit-shadow:0 0 0 1px var(--edge),0 0 10px 2px color-mix(in srgb,var(--halo) 86%,transparent),0 0 26px 4px color-mix(in srgb,var(--halo) 58%,transparent),0 0 46px 5px color-mix(in srgb,var(--halo) 30%,transparent),0 14px 26px #03050999;
  position:relative;
  transform-origin:var(--pivot,50%) 50%;
  color:#fff6e7;background:linear-gradient(145deg,#201f20f2,#14191df5);
  border:3px solid var(--edge);
  box-shadow:inset 0 -2px 0 color-mix(in srgb,var(--edge) 40%,transparent),0 6px 18px #06090d77;
}
.co-landscapes .co-card:nth-child(3n+2){--edge:#78a6ff;--halo:#2776ff}
.co-landscapes .co-card:nth-child(3n){--edge:#ff8278;--halo:#ff3e44}
.co-landscapes .co-card h3 {color:#fff6e7}
.co-landscapes .co-card .co-type {color:#ead7b7}
.co-landscapes .co-blurb,.co-landscapes .co-status {color:#e4dbce}
.co-landscapes .co-status i {border-color:#c9bcaa}
.co-landscapes .co-status .is-ready {border-color:#98d1a2;background:#98d1a2}
.co-landscapes .co-card-cta {color:#fff4df;border-color:#ffffff38}
.co-landscapes .co-card-cta span {color:var(--edge);border-color:color-mix(in srgb,var(--edge) 65%,transparent)}
.co-landscapes .co-frieze {opacity:.85;color:#f3cd78}
.co-landscapes .co-card:focus-visible {outline:3px solid #fff;outline-offset:3px}
/* El zoom se pinta sobre la rejilla sin redimensionar sus pistas. */
.co-landscapes .co-grid{isolation:isolate;overflow:visible}
.co-landscapes .co-card:focus-visible,.co-landscapes .co-card:is(:active,.co-pressed){
  z-index:3;box-shadow:var(--lit-shadow)
}
@media(hover:hover) and (pointer:fine){
  .co-landscapes .co-card:hover{
    z-index:4;background-color:#181b1e;border-color:color-mix(in srgb,var(--edge) 84%,white);box-shadow:var(--lit-shadow)
  }
  .co-landscapes .co-card:hover .co-card-cta span{background:#ffffff17}
}
@media(min-width:1200px){
  .co-landscapes .co-card:nth-child(5n+1){--pivot:12%}
  .co-landscapes .co-card:nth-child(5n){--pivot:88%}
}
@media(min-width:621px) and (max-width:1199px){
  .co-landscapes .co-card:nth-child(odd){--pivot:8%}
  .co-landscapes .co-card:nth-child(even){--pivot:92%}
}
@media(hover:hover) and (pointer:fine) and (prefers-reduced-motion:no-preference){
  .co-landscapes .co-card{transition:transform .32s cubic-bezier(.2,.74,.22,1),box-shadow .26s ease,border-color .24s}
  .co-landscapes .co-card:hover{transform:scale(var(--zoom,1.2))}
}
@media(max-width:620px){
  /* Con ratón y una sola columna el margen lateral limita la ampliación. */
  .co-landscapes .co-card{--zoom:1.065}
}
@media(hover:none),(pointer:coarse){
  .co-landscapes .co-card:is(:active,.co-pressed){transition-duration:0s}
}
@media(prefers-reduced-motion:no-preference) and (pointer:coarse){
  .co-landscapes .co-card:is(:active,.co-pressed){transform:scale(1.018)}
}
@media(prefers-reduced-motion:reduce){
  .co-landscapes .co-card:is(:hover,:active,:focus-visible){transform:none;transition:none}
}
@media(max-width:1199px){.co-background img{object-position:80% top}}
@media(max-width:620px){
  .co-background img {object-position:68% top}
  .co-landscapes .co-directory {padding-block:54px 44px}
  .co-landscapes .co-grid {row-gap:32px}
  .co-landscapes .co-disclosure {margin-bottom:40px}
  .co-landscapes .co-edition {display:inline-block}
}
/* Fotogramas en el flujo de lectura, sin fondo adherido ni animación. */
@media(prefers-reduced-motion:reduce){
  .co-background{bottom:44%}
  .co-background + .co-background{top:44%;bottom:0;mask-image:linear-gradient(transparent,black 16%)}
  .co-background picture{position:relative;height:100%;background:#0e151c}
  .co-background img{height:auto;min-height:min(100%,55svh);max-height:100%;object-fit:cover}
  .co-background picture::after{background:linear-gradient(90deg,#071018aa,transparent 75%),linear-gradient(0deg,#0e151c 2%,transparent 44%),#0a101b38}
}