/* Fuentes del sitio */
@font-face { font-family: 'Crimson Pro'; font-style: normal; font-weight: 200 900; font-display: swap; src: url('fuentes/CrimsonPro-VariableFont_wght.woff2') format('woff2'); }
@font-face { font-family: 'Crimson Pro'; font-style: italic; font-weight: 200 900; font-display: swap; src: url('fuentes/CrimsonPro-Italic-VariableFont_wght.woff2') format('woff2'); }
@font-face { font-family: 'Montserrat'; font-style: normal; font-weight: 100 900; font-display: swap; src: url('fuentes/Montserrat-VariableFont_wght.woff2') format('woff2'); }
/* Reinicio frente al tema de WordPress */
:is(#cali27, #cali27-enc, #cali27-pie) h1, :is(#cali27, #cali27-enc, #cali27-pie) h2, :is(#cali27, #cali27-enc, #cali27-pie) h3, :is(#cali27, #cali27-enc, #cali27-pie) h4, :is(#cali27, #cali27-enc, #cali27-pie) h5, :is(#cali27, #cali27-enc, #cali27-pie) h6 { color: inherit; font-family: inherit; font-size: revert; font-weight: revert; letter-spacing: normal; text-transform: none; text-shadow: none; }
:is(#cali27, #cali27-enc, #cali27-pie) p, :is(#cali27, #cali27-enc, #cali27-pie) li, :is(#cali27, #cali27-enc, #cali27-pie) dd, :is(#cali27, #cali27-enc, #cali27-pie) dt, :is(#cali27, #cali27-enc, #cali27-pie) blockquote, :is(#cali27, #cali27-enc, #cali27-pie) figcaption, :is(#cali27, #cali27-enc, #cali27-pie) label, :is(#cali27, #cali27-enc, #cali27-pie) td, :is(#cali27, #cali27-enc, #cali27-pie) th { color: inherit; font-family: inherit; font-size: inherit; line-height: inherit; letter-spacing: inherit; }
:is(#cali27, #cali27-enc, #cali27-pie) a { font-family: inherit; text-transform: none; box-shadow: none; }
:is(#cali27, #cali27-enc, #cali27-pie) img, :is(#cali27, #cali27-enc, #cali27-pie) svg, :is(#cali27, #cali27-enc, #cali27-pie) video, :is(#cali27, #cali27-enc, #cali27-pie) iframe { border: 0; border-radius: 0; box-shadow: none; }
:is(#cali27, #cali27-enc, #cali27-pie) button, :is(#cali27, #cali27-enc, #cali27-pie) input, :is(#cali27, #cali27-enc, #cali27-pie) select, :is(#cali27, #cali27-enc, #cali27-pie) textarea { background: none; border: 0; border-radius: 0; box-shadow: none; padding: 0; margin: 0; min-height: 0; text-transform: none; letter-spacing: normal; font-weight: inherit; line-height: inherit; font-family: inherit; text-shadow: none; color: inherit; }
:is(#cali27, #cali27-enc, #cali27-pie) ul, :is(#cali27, #cali27-enc, #cali27-pie) ol, :is(#cali27, #cali27-enc, #cali27-pie) li { margin: 0; padding: 0; }
:is(#cali27, #cali27-enc, #cali27-pie) table, :is(#cali27, #cali27-enc, #cali27-pie) th, :is(#cali27, #cali27-enc, #cali27-pie) td { border: 0; background: none; margin: 0; padding: revert; text-align: revert; vertical-align: revert; font-weight: revert; }
@charset "UTF-8";
/* XXXVII Congreso Colombiano de Anestesiología y Reanimación — hoja de estilos del sitio.
   Colores y tipografía: Kit de marca XXXVII v1.0 (03_Color/XXXVII_Paleta.css, 04_Tipografia).
   Fondo único Papel en las secciones claras: las ilustraciones (transparentes) se apoyan siempre sobre el mismo color.
   Sin degradados de color: tintas planas, filetes, tramas de semitono y frisos de azulejo.
   Movimiento (derivado del isotipo): gira (aspas), posa (aves), traza (filete doble), estampa (botones). */

:is(#cali27, #cali27-enc, #cali27-pie) {
  --azul: #18355F;
  --oro: #EFAF21;
  --rojo: #CB3227;
  --papel: #F8EFE1;
  --azul-profundo: #102442;
  --azul-80: #465D7F;
  --azul-60: #74869F;
  --azul-40: #A3AEBF;
  --azul-20: #D1D7DF;
  --azul-10: #E8EBEF;
  --line: rgba(24, 53, 95, .16);
  --line-strong: rgba(24, 53, 95, .38);
  --line-on-azul: rgba(248, 239, 225, .24);

  --font: "Crimson Pro", Georgia, "Times New Roman", serif;
  --wrap: 1200px;
  --gutter: clamp(20px, 4vw, 48px);
  --section-y: clamp(72px, 8.5vw, 120px);
  --radius: 2px;
  --ease-in: cubic-bezier(.2, .8, .2, 1);
  --ease-draw: cubic-bezier(.6, 0, .3, 1);

  --iso-hub-x: 282.970px; --iso-hub-y: 283.271px;
}

/* ------------------------------------------------------------------ base */

:is(#cali27, #cali27-enc, #cali27-pie) *, :is(#cali27, #cali27-enc, #cali27-pie), :is(#cali27, #cali27-enc, #cali27-pie) *::before, :is(#cali27, #cali27-enc, #cali27-pie)::before, :is(#cali27, #cali27-enc, #cali27-pie) *::after, :is(#cali27, #cali27-enc, #cali27-pie)::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; scroll-padding-top: 120px; }
:is(#cali27, #cali27-enc, #cali27-pie) {
  margin: 0;
  background: var(--papel);
  color: var(--azul);
  font-family: var(--font);
  font-size: 1.1875rem;
  line-height: 1.55;
  font-optical-sizing: auto;
  font-kerning: normal;
  font-variant-ligatures: common-ligatures;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
  overflow-x: clip;
}
:is(#cali27, #cali27-enc, #cali27-pie) img, :is(#cali27, #cali27-enc, #cali27-pie) svg { display: block; max-width: 100%; height: auto; }
:is(#cali27, #cali27-enc, #cali27-pie) a { color: inherit; text-decoration-thickness: 1px; text-underline-offset: .2em; }
:is(#cali27, #cali27-enc, #cali27-pie) a:hover { text-decoration-thickness: 2px; }
:is(#cali27, #cali27-enc, #cali27-pie) p { margin: 0 0 1em; }
:is(#cali27, #cali27-enc, #cali27-pie) h1, :is(#cali27, #cali27-enc, #cali27-pie) h2, :is(#cali27, #cali27-enc, #cali27-pie) h3 { margin: 0; line-height: 1.08; }
:is(#cali27, #cali27-enc, #cali27-pie) ul, :is(#cali27, #cali27-enc, #cali27-pie) ol { margin: 0; padding: 0; list-style: none; }
:is(#cali27, #cali27-enc, #cali27-pie) figure { margin: 0; }
:is(#cali27, #cali27-enc, #cali27-pie) button { font: inherit; color: inherit; }
:is(#cali27, #cali27-enc, #cali27-pie) abbr[title] { text-decoration: none; }
:is(#cali27, #cali27-enc, #cali27-pie) ::selection { background: var(--oro); color: var(--azul); }
:is(#cali27, #cali27-enc, #cali27-pie) :focus-visible { outline: 2px solid var(--rojo); outline-offset: 3px; }
:is(#cali27, #cali27-enc, #cali27-pie) .section--azul :focus-visible, :is(#cali27, #cali27-enc, #cali27-pie) .site-footer :focus-visible, :is(#cali27, #cali27-enc, #cali27-pie) .topbar :focus-visible, :is(#cali27, #cali27-enc, #cali27-pie) .creyentes :focus-visible { outline-color: var(--oro); }
:is(#cali27, #cali27-enc, #cali27-pie) main:focus { outline: none; }

:is(#cali27, #cali27-enc, #cali27-pie) .sr-only {
  position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px;
  overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0;
}
:is(#cali27, #cali27-enc, #cali27-pie) .skip { position: absolute; left: 16px; top: -100px; z-index: 100; background: var(--azul); color: var(--papel); padding: 10px 16px; font-weight: 600; }
:is(#cali27, #cali27-enc, #cali27-pie) .skip:focus { top: 56px; } /* sobre el Papel de la cabecera, no sobre la barra Azul */

/* ------------------------------------------------------------------ tipografía */

:is(#cali27, #cali27-enc, #cali27-pie) .eyebrow {
  margin: 0 0 14px;
  font-size: .8125rem; font-weight: 600; line-height: 1.3;
  text-transform: uppercase; letter-spacing: .12em;
  color: var(--rojo);
}
:is(#cali27, #cali27-enc, #cali27-pie) .eyebrow.eyebrow--on-azul { color: var(--oro); } /* gana a «.pres p», «.section--azul p» */
:is(#cali27, #cali27-enc, #cali27-pie) .h1, :is(#cali27, #cali27-enc, #cali27-pie) .h2 { font-weight: 700; text-transform: uppercase; letter-spacing: .015em; text-wrap: balance; overflow-wrap: break-word; }
:is(#cali27, #cali27-enc, #cali27-pie) .h1 { font-size: clamp(2rem, 3.6vw + 1rem, 4rem); line-height: 1.02; margin: 0 0 22px; }
:is(#cali27, #cali27-enc, #cali27-pie) .h2 { font-size: clamp(1.875rem, 2vw + 1rem, 2.75rem); line-height: 1.06; margin: 0 0 22px; max-width: 20em; }
:is(#cali27, #cali27-enc, #cali27-pie) .h3 { font-size: clamp(1.375rem, .6vw + 1.1rem, 1.625rem); font-weight: 600; line-height: 1.2; margin: 0 0 10px; text-wrap: balance; }
:is(#cali27, #cali27-enc, #cali27-pie) .lead { font-size: clamp(1.1875rem, .45vw + 1.05rem, 1.375rem); line-height: 1.5; color: var(--azul-profundo); max-width: 36em; text-wrap: pretty; }
:is(#cali27, #cali27-enc, #cali27-pie) .note { font-size: .9375rem; line-height: 1.5; color: var(--azul-80); max-width: 46em; }
:is(#cali27, #cali27-enc, #cali27-pie) .note--on-azul { color: var(--papel) !important; opacity: .9; }
:is(#cali27, #cali27-enc, #cali27-pie) .gloss { display: block; font-weight: 400; font-size: .875em; line-height: 1.35; color: var(--azul-80); margin-top: 3px; }
:is(#cali27, #cali27-enc, #cali27-pie) .section--azul .gloss { color: var(--papel); }
:is(#cali27, #cali27-enc, #cali27-pie) .prose p { max-width: 36em; }
:is(#cali27, #cali27-enc, #cali27-pie) .narrow { max-width: calc(780px + 2 * var(--gutter)); }

/* «Próximamente»: texto discreto, no etiqueta llamativa */
:is(#cali27, #cali27-enc, #cali27-pie) .pending { display: inline-flex; align-items: center; gap: 8px; font-style: italic; font-size: .9375em; color: var(--azul-80); }
:is(#cali27, #cali27-enc, #cali27-pie) .pending::before { content: ""; width: 7px; height: 7px; border-radius: 50%; background: var(--oro); flex: none; }
:is(#cali27, #cali27-enc, #cali27-pie) .pending--on-azul { color: var(--papel); }

/* Filete doble (traza) */
:is(#cali27, #cali27-enc, #cali27-pie) .filete {
  display: block; width: 120px; height: 7px; margin: 0 0 26px;
  border-top: 2px solid var(--azul); border-bottom: 2px solid var(--azul);
  transform-origin: left center;
}

/* ------------------------------------------------------------------ disposición */

:is(#cali27, #cali27-enc, #cali27-pie) .wrap { width: 100%; max-width: calc(var(--wrap) + 2 * var(--gutter)); margin-inline: auto; padding-inline: var(--gutter); }
:is(#cali27, #cali27-enc, #cali27-pie) .section { position: relative; padding-block: var(--section-y); }
:is(#cali27, #cali27-enc, #cali27-pie) .section--azul { background: var(--azul); color: var(--papel); padding-top: calc(var(--section-y) + 20px); }
:is(#cali27, #cali27-enc, #cali27-pie) .section--azul p, :is(#cali27, #cali27-enc, #cali27-pie) .section--azul .lead { color: var(--papel); }

:is(#cali27, #cali27-enc, #cali27-pie) .split { display: grid; gap: clamp(40px, 6vw, 88px); align-items: center; }
:is(#cali27, #cali27-enc, #cali27-pie) .split > *, :is(#cali27, #cali27-enc, #cali27-pie) .page-head__grid > * { min-width: 0; }
:is(#cali27, #cali27-enc, #cali27-pie) .section-head { display: grid; gap: 8px 48px; margin-bottom: clamp(32px, 4vw, 52px); }
:is(#cali27, #cali27-enc, #cali27-pie) .section-head .h2 { margin-bottom: 14px; }
:is(#cali27, #cali27-enc, #cali27-pie) .section-head .lead { margin-bottom: 0; }
:is(#cali27, #cali27-enc, #cali27-pie) .section-head__aside { align-self: end; }
:is(#cali27, #cali27-enc, #cali27-pie) .section-head__aside .flag { margin-bottom: 8px; }
:is(#cali27, #cali27-enc, #cali27-pie) .actions { display: flex; flex-wrap: wrap; align-items: center; gap: 14px 26px; margin: 30px 0 0; }

@media (min-width: 900px) {
  :is(#cali27, #cali27-enc, #cali27-pie) .split { grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); }
  :is(#cali27, #cali27-enc, #cali27-pie) .split--reverse { grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); }
  :is(#cali27, #cali27-enc, #cali27-pie) .split--reverse > :first-child { order: 2; }
  :is(#cali27, #cali27-enc, #cali27-pie) .split--even { grid-template-columns: 1fr 1fr; align-items: start; }
  :is(#cali27, #cali27-enc, #cali27-pie) .split--faq { grid-template-columns: minmax(0, 4fr) minmax(0, 8fr); align-items: start; }
  :is(#cali27, #cali27-enc, #cali27-pie) .section-head { grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); align-items: end; }
}

/* ------------------------------------------------------------------ barra superior */

:is(#cali27, #cali27-enc, #cali27-pie) .topbar { background: var(--azul); color: var(--papel); font-size: .875rem; }
:is(#cali27, #cali27-enc, #cali27-pie) .topbar__inner { display: flex; align-items: center; justify-content: space-between; gap: 16px; min-height: 40px; }
:is(#cali27, #cali27-enc, #cali27-pie) .topbar__facts { margin: 0; display: flex; flex-wrap: wrap; align-items: center; gap: 4px 10px; letter-spacing: .02em; }
:is(#cali27, #cali27-enc, #cali27-pie) .topbar__sep { opacity: .6; }
:is(#cali27, #cali27-enc, #cali27-pie) .lang { display: flex; align-items: center; gap: 6px; }
:is(#cali27, #cali27-enc, #cali27-pie) .lang__link { padding: 6px 4px; text-decoration: none; font-weight: 600; letter-spacing: .1em; font-size: .8125rem; opacity: .75; }
:is(#cali27, #cali27-enc, #cali27-pie) .lang__link:hover { opacity: 1; }
:is(#cali27, #cali27-enc, #cali27-pie) .lang__link[aria-current="true"] { opacity: 1; color: var(--oro); }
:is(#cali27, #cali27-enc, #cali27-pie) .lang__sep { opacity: .4; }
@media (max-width: 599px) { :is(#cali27, #cali27-enc, #cali27-pie) .topbar__facts > span:nth-child(n+2) { display: none; } } /* 3 nov 2026 (Martin): sin la etiqueta «Versión de prueba» en el encabezado */

/* ------------------------------------------------------------------ cabecera y navegación */

:is(#cali27, #cali27-enc, #cali27-pie) .site-header {
  position: sticky; top: 0; z-index: 40;
  background: var(--papel);
  border-bottom: 4px double var(--azul);
}
:is(#cali27, #cali27-enc, #cali27-pie) .site-header__bar { display: flex; align-items: center; justify-content: space-between; gap: 24px; min-height: 76px; }
:is(#cali27, #cali27-enc, #cali27-pie) .brand { display: block; flex: none; padding: 8px 0; text-decoration: none; }
:is(#cali27, #cali27-enc, #cali27-pie) .brand__logotipo { width: 160px; height: auto; display: none; }
:is(#cali27, #cali27-enc, #cali27-pie) .brand__iso { display: block; width: 46px; }
:is(#cali27, #cali27-enc, #cali27-pie) .brand__iso .iso { overflow: visible; }
@media (min-width: 600px) {
  :is(#cali27, #cali27-enc, #cali27-pie) .site-header__bar { min-height: 96px; }
  :is(#cali27, #cali27-enc, #cali27-pie) .brand__logotipo { display: block; }
  :is(#cali27, #cali27-enc, #cali27-pie) .brand__iso { display: none; }
}

:is(#cali27, #cali27-enc, #cali27-pie) .nav-toggle {
  display: inline-flex; align-items: center; gap: 10px;
  background: none; border: 1.5px solid var(--azul); border-radius: var(--radius);
  padding: 9px 14px; cursor: pointer;
  font-size: .8125rem; font-weight: 600; letter-spacing: .12em; text-transform: uppercase;
}
:is(#cali27, #cali27-enc, #cali27-pie) .nav-toggle__bars, :is(#cali27, #cali27-enc, #cali27-pie) .nav-toggle__bars::before, :is(#cali27, #cali27-enc, #cali27-pie) .nav-toggle__bars::after {
  display: block; width: 18px; height: 2px; background: var(--azul); position: relative;
  transition: transform .2s ease, background-color .2s ease;
}
:is(#cali27, #cali27-enc, #cali27-pie) .nav-toggle__bars::before, :is(#cali27, #cali27-enc, #cali27-pie) .nav-toggle__bars::after { content: ""; position: absolute; left: 0; }
:is(#cali27, #cali27-enc, #cali27-pie) .nav-toggle__bars::before { top: -6px; }
:is(#cali27, #cali27-enc, #cali27-pie) .nav-toggle__bars::after { top: 6px; }
:is(#cali27, #cali27-enc, #cali27-pie) .nav-toggle[aria-expanded="true"] .nav-toggle__bars { background: transparent; }
:is(#cali27, #cali27-enc, #cali27-pie) .nav-toggle[aria-expanded="true"] .nav-toggle__bars::before { transform: translateY(6px) rotate(45deg); }
:is(#cali27, #cali27-enc, #cali27-pie) .nav-toggle[aria-expanded="true"] .nav-toggle__bars::after { transform: translateY(-6px) rotate(-45deg); }

:is(#cali27, #cali27-enc, #cali27-pie) .site-nav__list a { display: block; text-decoration: none; font-weight: 500; padding: 8px 0; position: relative; }
:is(#cali27, #cali27-enc, #cali27-pie) .site-nav__list a::after {
  content: ""; position: absolute; left: 0; right: 0; bottom: 2px; height: 2px; background: var(--rojo);
  transform: scaleX(0); transform-origin: left; transition: transform .25s var(--ease-in);
}
/* [aria-current]: «page» en la página misma; «true» en Noticias cuando se lee un artículo */
:is(#cali27, #cali27-enc, #cali27-pie) .site-nav__list a:hover::after, :is(#cali27, #cali27-enc, #cali27-pie) .site-nav__list a[aria-current]::after { transform: scaleX(1); }
:is(#cali27, #cali27-enc, #cali27-pie) .site-nav__list a[aria-current] { color: var(--rojo); }
:is(#cali27, #cali27-enc, #cali27-pie) .site-nav__lang { display: none; }

html:not(.js) :is(#cali27, #cali27-enc, #cali27-pie) .nav-toggle { display: none; }
html:not(.js) :is(#cali27, #cali27-enc, #cali27-pie) .site-header__bar { flex-wrap: wrap; }
html:not(.js) :is(#cali27, #cali27-enc, #cali27-pie) .site-nav__list { display: flex; flex-wrap: wrap; gap: 0 20px; }
html:not(.js) :is(#cali27, #cali27-enc, #cali27-pie) .site-nav { padding-bottom: 12px; }
html:not(.js) :is(#cali27, #cali27-enc, #cali27-pie) .site-header { position: static; }

@media (max-width: 1199px) {
  html.js :is(#cali27, #cali27-enc, #cali27-pie) .site-nav {
    position: fixed; inset: var(--nav-top, 120px) 0 0; z-index: 39;
    background: var(--papel); padding: 12px var(--gutter) 48px; overflow-y: auto; display: none;
    border-top: 1px solid var(--line);
  }
  html.js :is(#cali27, #cali27-enc, #cali27-pie) .site-nav.is-open { display: block; }
  html.js :is(#cali27, #cali27-enc, #cali27-pie) .site-nav__list a { font-size: 1.5rem; border-bottom: 1px solid var(--line); padding: 14px 0; }
  html.js :is(#cali27, #cali27-enc, #cali27-pie) .site-nav__list a::after { display: none; }
  :is(#cali27, #cali27-enc, #cali27-pie) .site-nav .site-nav__cta { margin-top: 28px; }
  html.js :is(#cali27, #cali27-enc, #cali27-pie) .site-nav__lang { display: flex; gap: 8px; margin-top: 28px; font-size: 1rem; }
  :is(#cali27, #cali27-enc, #cali27-pie) .site-nav__lang .lang__link { opacity: 1; font-size: 1rem; }
  :is(#cali27, #cali27-enc, #cali27-pie) .site-nav__lang .lang__link[aria-current="true"] { color: var(--rojo); }
  html.js body.nav-open { overflow: hidden; }
}
@media (min-width: 1200px) {
  :is(#cali27, #cali27-enc, #cali27-pie) .nav-toggle { display: none; }
  :is(#cali27, #cali27-enc, #cali27-pie) .site-nav { display: flex; align-items: center; gap: 26px; }
  :is(#cali27, #cali27-enc, #cali27-pie) .site-nav__list { display: flex; gap: 20px; }
  :is(#cali27, #cali27-enc, #cali27-pie) .site-nav__list a { font-size: 1.0625rem; white-space: nowrap; }
}
@media (min-width: 1200px) and (max-width: 1299px) {
  :is(#cali27, #cali27-enc, #cali27-pie) .site-header__bar { gap: 16px; }
  :is(#cali27, #cali27-enc, #cali27-pie) .site-nav { gap: 18px; }
  :is(#cali27, #cali27-enc, #cali27-pie) .site-nav__list { gap: 13px; }
}

/* ------------------------------------------------------------------ botones (estampa) */

:is(#cali27, #cali27-enc, #cali27-pie) .btn {
  --ink: var(--oro);
  --fill: var(--azul);
  position: relative; isolation: isolate;
  display: inline-flex; align-items: center; justify-content: center; gap: .5em;
  min-height: 50px; padding: 12px 24px; margin: 0 5px 5px 0;
  background: transparent; color: var(--papel);
  border: 0; border-radius: var(--radius);
  font-family: var(--font); font-size: 1rem; font-weight: 700; line-height: 1.15;
  letter-spacing: .08em; text-transform: uppercase; text-decoration: none;
  cursor: pointer; transition: transform .18s ease;
}
:is(#cali27, #cali27-enc, #cali27-pie) .btn::before { content: ""; position: absolute; inset: 0; z-index: -1; background: var(--fill); border-radius: var(--radius); }
:is(#cali27, #cali27-enc, #cali27-pie) .btn::after {
  /* tinta desplazada con trama de semitono de baja opacidad: el registro de una serigrafía */
  content: ""; position: absolute; inset: 0; z-index: -2; border-radius: var(--radius);
  background: var(--ink) radial-gradient(circle, rgba(24, 53, 95, .2) 0 1px, transparent 1.3px) 0 0 / 4px 4px;
  transform: translate(5px, 5px); transition: transform .18s ease;
}
:is(#cali27, #cali27-enc, #cali27-pie) .btn:hover { transform: translate(2px, 2px); }
:is(#cali27, #cali27-enc, #cali27-pie) .btn:hover::after { transform: translate(3px, 3px); }
:is(#cali27, #cali27-enc, #cali27-pie) .btn:active { transform: translate(5px, 5px); }
:is(#cali27, #cali27-enc, #cali27-pie) .btn:active::after { transform: translate(0, 0); }
:is(#cali27, #cali27-enc, #cali27-pie) .btn--oro { --ink: var(--papel); --fill: var(--oro); color: var(--azul); }
:is(#cali27, #cali27-enc, #cali27-pie) .btn--ghost { color: var(--azul); }
:is(#cali27, #cali27-enc, #cali27-pie) .btn--ghost::before { background: transparent; box-shadow: inset 0 0 0 1.5px var(--azul); }
:is(#cali27, #cali27-enc, #cali27-pie) .btn--ghost::after { display: none; }
:is(#cali27, #cali27-enc, #cali27-pie) .btn--ghost:hover { transform: none; color: var(--papel); }
:is(#cali27, #cali27-enc, #cali27-pie) .btn--ghost:hover::before { background: var(--azul); }
:is(#cali27, #cali27-enc, #cali27-pie) .btn--small { min-height: 42px; padding: 8px 18px; font-size: .875rem; }
:is(#cali27, #cali27-enc, #cali27-pie) .btn[aria-disabled="true"] { color: var(--azul-80); cursor: not-allowed; text-transform: none; letter-spacing: .01em; font-weight: 600; font-size: 1.0625rem; }
:is(#cali27, #cali27-enc, #cali27-pie) .btn[aria-disabled="true"]::before { background: transparent; box-shadow: inset 0 0 0 1.5px var(--azul-40); }
:is(#cali27, #cali27-enc, #cali27-pie) .btn[aria-disabled="true"]::after { display: none; }
:is(#cali27, #cali27-enc, #cali27-pie) .btn[aria-disabled="true"]:hover, :is(#cali27, #cali27-enc, #cali27-pie) .btn[aria-disabled="true"]:active { transform: none; }
:is(#cali27, #cali27-enc, #cali27-pie) .section--azul .btn[aria-disabled="true"] { color: var(--papel); }

:is(#cali27, #cali27-enc, #cali27-pie) .link-arrow { display: inline-flex; align-items: center; gap: .45em; font-weight: 600; text-decoration: none; border-bottom: 1.5px solid currentColor; padding-bottom: 1px; }
:is(#cali27, #cali27-enc, #cali27-pie) .link-arrow::after { content: "→"; transition: transform .2s ease; }
:is(#cali27, #cali27-enc, #cali27-pie) .link-arrow:hover::after { transform: translateX(4px); }
:is(#cali27, #cali27-enc, #cali27-pie) .link-arrow--back { flex-direction: row-reverse; }
:is(#cali27, #cali27-enc, #cali27-pie) .link-arrow--back::after { content: "←"; }
:is(#cali27, #cali27-enc, #cali27-pie) .link-arrow--back:hover::after { transform: translateX(-4px); }
:is(#cali27, #cali27-enc, #cali27-pie) .link-list li + li { margin-top: 10px; }

:is(#cali27, #cali27-enc, #cali27-pie) .chip { display: inline-block; vertical-align: middle; font-size: .8125rem; font-weight: 600; letter-spacing: .06em; text-transform: uppercase; padding: 5px 11px; border-radius: var(--radius); line-height: 1.3; background: rgba(24, 53, 95, .08); color: var(--azul); }
:is(#cali27, #cali27-enc, #cali27-pie) .chip--oro { background: var(--oro); color: var(--azul); }
:is(#cali27, #cali27-enc, #cali27-pie) .status { margin: 0; display: flex; flex-wrap: wrap; align-items: center; gap: 8px 12px; }
:is(#cali27, #cali27-enc, #cali27-pie) .status__label { font-size: .8125rem; font-weight: 600; letter-spacing: .12em; text-transform: uppercase; color: var(--azul-80); }
:is(#cali27, #cali27-enc, #cali27-pie) .flag { margin: 0 0 12px; border-left: 3px solid var(--rojo); padding: 2px 0 2px 14px; font-weight: 600; color: var(--azul); }
:is(#cali27, #cali27-enc, #cali27-pie) .sample { display: inline-block; padding: 1px 9px; border: 1px solid var(--line-strong); border-radius: 999px; font-size: .75rem; font-weight: 600; letter-spacing: .1em; text-transform: uppercase; color: var(--azul-80); }

:is(#cali27, #cali27-enc, #cali27-pie) .callout { border-left: 4px solid var(--rojo); padding: 6px 0 6px 20px; margin-bottom: clamp(40px, 5vw, 64px); max-width: 760px; }
:is(#cali27, #cali27-enc, #cali27-pie) .callout p { margin: 0; }
:is(#cali27, #cali27-enc, #cali27-pie) .callout__title { font-weight: 700; text-transform: uppercase; letter-spacing: .1em; color: var(--rojo); font-size: .8125rem; margin-bottom: 4px !important; }
:is(#cali27, #cali27-enc, #cali27-pie) .callout--azul { border-left-color: var(--azul); margin: clamp(40px, 5vw, 56px) 0 0; }
:is(#cali27, #cali27-enc, #cali27-pie) .callout--azul .callout__title { color: var(--azul); }


/* ------------------------------------------------------------------ marcadores e imágenes */

:is(#cali27, #cali27-enc, #cali27-pie) .r-1-1 { aspect-ratio: 1 / 1; }
:is(#cali27, #cali27-enc, #cali27-pie) .r-3-2 { aspect-ratio: 3 / 2; }
:is(#cali27, #cali27-enc, #cali27-pie) .r-4-3 { aspect-ratio: 4 / 3; }
:is(#cali27, #cali27-enc, #cali27-pie) .r-4-5 { aspect-ratio: 4 / 5; }
:is(#cali27, #cali27-enc, #cali27-pie) .r-3-1 { aspect-ratio: 3 / 1; }
:is(#cali27, #cali27-enc, #cali27-pie) .r-3-4 { aspect-ratio: 3 / 4; }

:is(#cali27, #cali27-enc, #cali27-pie) .ph {
  position: relative; width: 100%; overflow: hidden;
  display: flex; flex-direction: column; justify-content: flex-end; gap: 2px;
  padding: 14px 16px;
  font-size: .8125rem; line-height: 1.3;
}
:is(#cali27, #cali27-enc, #cali27-pie) .ph__code { font-weight: 700; letter-spacing: .14em; font-size: .75rem; }
:is(#cali27, #cali27-enc, #cali27-pie) .ph__label { max-width: 26em; }
:is(#cali27, #cali27-enc, #cali27-pie) .ph :is(.ph__code, .ph__label) { position: relative; align-self: flex-start; background: var(--plate, var(--papel)); padding: 2px 6px; }
:is(#cali27, #cali27-enc, #cali27-pie) .ph--icono .ph__code { padding: 1px 3px; }
:is(#cali27, #cali27-enc, #cali27-pie) .ph--ilustracion, :is(#cali27, #cali27-enc, #cali27-pie) .ph--icono, :is(#cali27, #cali27-enc, #cali27-pie) .ph--logo {
  border: 1px dashed var(--line-strong); color: var(--azul-80);
  background: radial-gradient(circle, rgba(24, 53, 95, .09) 0 1px, transparent 1.4px) 0 0 / 7px 7px;
}
:is(#cali27, #cali27-enc, #cali27-pie) .ph--ilustracion .ph__code, :is(#cali27, #cali27-enc, #cali27-pie) .ph--icono .ph__code, :is(#cali27, #cali27-enc, #cali27-pie) .ph--logo .ph__code { color: var(--rojo); }
:is(#cali27, #cali27-enc, #cali27-pie) .ph--foto {
  /* foto pendiente: se publicará en duotono Azul; el marcador anticipa la tinta con una trama más densa */
  border: 1px solid var(--line-strong); color: var(--azul-80);
  background: radial-gradient(circle, rgba(24, 53, 95, .16) 0 1.1px, transparent 1.5px) 0 0 / 6px 6px;
}
:is(#cali27, #cali27-enc, #cali27-pie) .ph--foto .ph__code { color: var(--azul); }
:is(#cali27, #cali27-enc, #cali27-pie) .ph--icono { padding: 8px; font-size: .6875rem; }
:is(#cali27, #cali27-enc, #cali27-pie) .ph--icono .ph__label { display: none; }
:is(#cali27, #cali27-enc, #cali27-pie) .ph--logo { justify-content: center; align-items: center; text-align: center; }
:is(#cali27, #cali27-enc, #cali27-pie) .ph--logo :is(.ph__code, .ph__label) { align-self: center; }

/* Fotografía real con duotono Azul y semitono suave (obligatorio para fotos de concursos, brief §12) */
:is(#cali27, #cali27-enc, #cali27-pie) .media { position: relative; overflow: hidden; }
:is(#cali27, #cali27-enc, #cali27-pie) .media img { width: 100%; height: 100%; object-fit: cover; }
:is(#cali27, #cali27-enc, #cali27-pie) .media--foto { background: var(--azul); isolation: isolate; }
:is(#cali27, #cali27-enc, #cali27-pie) .media--foto img { filter: grayscale(1) contrast(1.08) brightness(1.05); mix-blend-mode: screen; }
:is(#cali27, #cali27-enc, #cali27-pie) .media--foto::after { content: ""; position: absolute; inset: 0; background: var(--papel); mix-blend-mode: multiply; pointer-events: none; }
:is(#cali27, #cali27-enc, #cali27-pie) .media--foto::before { content: ""; position: absolute; inset: 0; z-index: 1; pointer-events: none; background: radial-gradient(circle, rgba(16, 36, 66, .18) 0 1px, transparent 1.4px) 0 0 / 5px 5px; }
:is(#cali27, #cali27-enc, #cali27-pie) .media--ilustracion img, :is(#cali27, #cali27-enc, #cali27-pie) .media--icono img, :is(#cali27, #cali27-enc, #cali27-pie) .media--logo img { object-fit: contain; }

:is(#cali27, #cali27-enc, #cali27-pie) .art { justify-self: center; width: 100%; max-width: 440px; }
:is(#cali27, #cali27-enc, #cali27-pie) .art img { width: 100%; }
:is(#cali27, #cali27-enc, #cali27-pie) .art--keyart { max-width: 420px; }

:is(#cali27, #cali27-enc, #cali27-pie) .plate-firma { max-width: 320px; }
:is(#cali27, #cali27-enc, #cali27-pie) .site-footer .plate-firma { padding-block: 14px; } /* sobre Azul va la firma blanca oficial de S.C.A.R.E., sin plato */
:is(#cali27, #cali27-enc, #cali27-pie) .plate-firma--large { max-width: 460px; justify-self: center; } /* la firma va directa sobre el Papel, sin caja */

/* ------------------------------------------------------------------ portada */

:is(#cali27, #cali27-enc, #cali27-pie) .hero { position: relative; overflow-x: clip; }
:is(#cali27, #cali27-enc, #cali27-pie) .hero__copy { display: flex; flex-direction: column; align-items: flex-start; }
:is(#cali27, #cali27-enc, #cali27-pie) .hero__logo { margin: 0 0 32px; width: clamp(240px, 62vw, 300px); }
:is(#cali27, #cali27-enc, #cali27-pie) .hero__logo img { width: 100%; }
:is(#cali27, #cali27-enc, #cali27-pie) .hero__dates { font-size: clamp(1.625rem, 1.6vw + 1rem, 2.25rem); font-weight: 600; line-height: 1.12; margin: 0 0 6px; }
:is(#cali27, #cali27-enc, #cali27-pie) .hero__place { font-size: 1.1875rem; margin: 0; color: var(--azul-profundo); }
:is(#cali27, #cali27-enc, #cali27-pie) .hero__actions { display: flex; flex-wrap: wrap; gap: 14px 16px; margin-top: 28px; }
:is(#cali27, #cali27-enc, #cali27-pie) .hero__lema { font-style: italic; font-size: clamp(1.25rem, .9vw + 1rem, 1.625rem); color: var(--rojo); line-height: 1.3; margin: 28px 0 0; max-width: 20em; }
:is(#cali27, #cali27-enc, #cali27-pie) .hero__art { justify-self: center; align-self: end; width: min(78vw, 400px); }
:is(#cali27, #cali27-enc, #cali27-pie) .hero__maceta { display: block; position: relative; width: 100%; }
:is(#cali27, #cali27-enc, #cali27-pie) .hero__tallo { display: block; width: 100%; height: auto; }
/* aspas del ringlete: eje en (373, 301) de 720 × 1352; caja de 652 px centrada en el eje */
:is(#cali27, #cali27-enc, #cali27-pie) .hero__aspas { position: absolute; left: 6.53%; top: -1.78%; width: 90.6%; height: auto; transform-origin: 50% 50%; transform: rotate(calc(var(--wind, 0deg) * .5)); }
html.mov :is(#cali27, #cali27-enc, #cali27-pie) .hero__maceta { cursor: pointer; }
@keyframes gira-lento { to { rotate: 360deg; } }
html.mov :is(#cali27, #cali27-enc, #cali27-pie) .hero__aspas { animation: gira-lento 120s linear infinite; }
:is(#cali27, #cali27-enc, #cali27-pie) .hero__flock { position: absolute; width: 34%; right: -16%; top: 44%; }
@media (min-width: 900px) {
  :is(#cali27, #cali27-enc, #cali27-pie) .hero__logo { width: 340px; }
  :is(#cali27, #cali27-enc, #cali27-pie) .hero__dates { font-size: clamp(2rem, 1.4vw + 1.2rem, 2.625rem); }
}

:is(#cali27, #cali27-enc, #cali27-pie) .tricolor { height: 10px; background: var(--azul); position: relative; }
:is(#cali27, #cali27-enc, #cali27-pie) .tricolor::before, :is(#cali27, #cali27-enc, #cali27-pie) .tricolor::after { content: ""; position: absolute; top: 0; bottom: 0; }
:is(#cali27, #cali27-enc, #cali27-pie) .tricolor::before { left: 80%; right: 6.667%; background: var(--oro); }
:is(#cali27, #cali27-enc, #cali27-pie) .tricolor::after { left: 93.333%; right: 0; background: var(--rojo); }

/* Creyentes: panel Azul con marco Oro y ornamentos de esquina */
:is(#cali27, #cali27-enc, #cali27-pie) .creyentes {
  position: relative; background: var(--azul); color: var(--papel);
  padding: clamp(44px, 5vw, 60px) clamp(28px, 4vw, 52px) 80px;
  outline: 1.5px solid var(--oro); outline-offset: -12px; text-align: center;
}
:is(#cali27, #cali27-enc, #cali27-pie) .creyentes__corner { position: absolute; width: 40px; height: 44px; background: url("assets/Ornamento_Esquina_Oro.svg") center / contain no-repeat; }
:is(#cali27, #cali27-enc, #cali27-pie) .creyentes__corner--tl { top: 22px; left: 22px; }
:is(#cali27, #cali27-enc, #cali27-pie) .creyentes__corner--br { bottom: 22px; right: 22px; transform: rotate(180deg); }
:is(#cali27, #cali27-enc, #cali27-pie) .creyentes .eyebrow { margin-bottom: 8px; }
:is(#cali27, #cali27-enc, #cali27-pie) .creyentes__name { font-size: clamp(2rem, 3.4vw + .75rem, 3.75rem); font-weight: 700; text-transform: uppercase; letter-spacing: .02em; line-height: 1; margin: 0 0 14px; color: var(--papel); }
:is(#cali27, #cali27-enc, #cali27-pie) .creyentes__msg { font-style: italic; font-size: clamp(1.1875rem, .6vw + 1rem, 1.5rem); line-height: 1.3; color: var(--oro) !important; max-width: 17em; margin: 0 auto 18px; }
:is(#cali27, #cali27-enc, #cali27-pie) .creyentes__dates { font-size: .9375rem; max-width: 26em; margin: 0 auto 18px; }

/* Novedades: lista corta de modalidades */
:is(#cali27, #cali27-enc, #cali27-pie) .modlist { border-top: 1px solid var(--line-on-azul); }
:is(#cali27, #cali27-enc, #cali27-pie) .modlist li { display: grid; grid-template-columns: 44px 1fr; gap: 2px 12px; padding: 16px 0; border-bottom: 1px solid var(--line-on-azul); }
:is(#cali27, #cali27-enc, #cali27-pie) .modlist__n { grid-row: span 2; color: var(--oro); font-weight: 600; font-variant-numeric: lining-nums tabular-nums; padding-top: 3px; }
:is(#cali27, #cali27-enc, #cali27-pie) .modlist__name { font-size: 1.3125rem; font-weight: 600; color: var(--papel); line-height: 1.2; }
:is(#cali27, #cali27-enc, #cali27-pie) .modlist__format { font-size: .9375rem; color: var(--papel); opacity: .9; }

/* Noticias */
:is(#cali27, #cali27-enc, #cali27-pie) .news-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 300px), 1fr)); gap: 40px 32px; }
:is(#cali27, #cali27-enc, #cali27-pie) .news__link { display: flex; flex-direction: column; text-decoration: none; height: 100%; }
:is(#cali27, #cali27-enc, #cali27-pie) .news__media { margin: 0; }
:is(#cali27, #cali27-enc, #cali27-pie) .news__meta { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 12px; margin-bottom: 8px; }
:is(#cali27, #cali27-enc, #cali27-pie) .news__date { font-size: .8125rem; font-weight: 600; letter-spacing: .1em; text-transform: uppercase; color: var(--rojo); }
:is(#cali27, #cali27-enc, #cali27-pie) .news__title { font-size: 1.5rem; font-weight: 600; line-height: 1.15; margin: 0 0 8px; overflow-wrap: anywhere; }
:is(#cali27, #cali27-enc, #cali27-pie) a.news__link:hover .news__title { text-decoration: underline; text-decoration-thickness: 1.5px; text-underline-offset: .15em; }
:is(#cali27, #cali27-enc, #cali27-pie) .news__summary { color: var(--azul-profundo); margin: 0; overflow-wrap: anywhere; }

/* Identidad (avance) y citas */
:is(#cali27, #cali27-enc, #cali27-pie) .verse { margin: 0 0 28px; padding-left: 20px; border-left: 3px solid var(--oro); }
:is(#cali27, #cali27-enc, #cali27-pie) .verse p { font-style: italic; font-size: 1.25rem; line-height: 1.35; margin: 0 0 8px; color: var(--azul); }
:is(#cali27, #cali27-enc, #cali27-pie) .verse footer { font-size: .9375rem; color: var(--azul-80); }
:is(#cali27, #cali27-enc, #cali27-pie) .verse cite { font-style: italic; }
:is(#cali27, #cali27-enc, #cali27-pie) .verse--large p { font-size: clamp(1.375rem, 1vw + 1.05rem, 1.875rem); }
:is(#cali27, #cali27-enc, #cali27-pie) .verse__translation { font-size: 1rem !important; font-style: normal !important; color: var(--azul-80) !important; margin-top: 10px !important; }

/* Paisaje de Cali */
:is(#cali27, #cali27-enc, #cali27-pie) .landscape { position: relative; background: var(--azul); margin: 0; }
:is(#cali27, #cali27-enc, #cali27-pie) .landscape__img { width: 100%; height: auto; aspect-ratio: 1920 / 1083; object-fit: cover; }
:is(#cali27, #cali27-enc, #cali27-pie) .landscape__wrap { position: relative; }
@media (min-width: 900px) {
  :is(#cali27, #cali27-enc, #cali27-pie) .landscape { min-height: 620px; }
  :is(#cali27, #cali27-enc, #cali27-pie) .landscape__img { position: absolute; inset: 0; height: 100%; aspect-ratio: auto; }
  :is(#cali27, #cali27-enc, #cali27-pie) .landscape__wrap { padding-block: clamp(64px, 8vw, 112px); }
}
:is(#cali27, #cali27-enc, #cali27-pie) .landscape--figure figcaption { font-size: .875rem; color: var(--papel); padding-block: 12px 16px; }
@media (min-width: 900px) {
  :is(#cali27, #cali27-enc, #cali27-pie) .landscape--figure { min-height: 0; }
  :is(#cali27, #cali27-enc, #cali27-pie) .landscape--figure .landscape__img { position: static; height: auto; aspect-ratio: 1920 / 1083; max-height: 72vh; }
}

/* ------------------------------------------------------------------ páginas internas */

:is(#cali27, #cali27-enc, #cali27-pie) .page-head .lead { margin-bottom: 0; }
:is(#cali27, #cali27-enc, #cali27-pie) .crumbs { display: flex; flex-wrap: wrap; gap: 8px; font-size: .875rem; color: var(--azul-80); margin-bottom: 26px; }
:is(#cali27, #cali27-enc, #cali27-pie) .crumbs a { color: inherit; }
:is(#cali27, #cali27-enc, #cali27-pie) .crumbs [aria-current] { color: var(--azul); }
:is(#cali27, #cali27-enc, #cali27-pie) .page-head__art { justify-self: center; width: min(100%, 420px); }
:is(#cali27, #cali27-enc, #cali27-pie) .page-head__art img { width: 100%; }
:is(#cali27, #cali27-enc, #cali27-pie) .page-head__art--keyart { width: min(70%, 340px); }
:is(#cali27, #cali27-enc, #cali27-pie) .page-head__art--bird { width: min(70%, 320px); }
:is(#cali27, #cali27-enc, #cali27-pie) .page-head__art--flock { width: min(60%, 260px); }
@media (max-width: 899px) {
  :is(#cali27, #cali27-enc, #cali27-pie) .page-head__grid { gap: 24px; }
  :is(#cali27, #cali27-enc, #cali27-pie) .page-head__art { justify-self: end; width: min(56%, 240px); }
  :is(#cali27, #cali27-enc, #cali27-pie) .page-head__art--keyart, :is(#cali27, #cali27-enc, #cali27-pie) .page-head__art--bird, :is(#cali27, #cali27-enc, #cali27-pie) .page-head__art--flock { width: min(46%, 190px); }
}
@media (min-width: 900px) {
  :is(#cali27, #cali27-enc, #cali27-pie) .page-head__art { justify-self: end; align-self: center; }
  :is(#cali27, #cali27-enc, #cali27-pie) .page-head__art--flock { width: min(100%, 300px); }
}

/* Tablas */
:is(#cali27, #cali27-enc, #cali27-pie) .table-wrap { width: 100%; }
:is(#cali27, #cali27-enc, #cali27-pie) table { border-collapse: collapse; width: 100%; font-variant-numeric: lining-nums tabular-nums; }
:is(#cali27, #cali27-enc, #cali27-pie) .tarifas th, :is(#cali27, #cali27-enc, #cali27-pie) .tarifas td, :is(#cali27, #cali27-enc, #cali27-pie) .hitos th, :is(#cali27, #cali27-enc, #cali27-pie) .hitos td { text-align: left; vertical-align: top; padding: 15px 16px 15px 0; border-bottom: 1px solid var(--line); }
:is(#cali27, #cali27-enc, #cali27-pie) .tarifas thead th, :is(#cali27, #cali27-enc, #cali27-pie) .hitos thead th { font-size: .75rem; font-weight: 600; letter-spacing: .12em; text-transform: uppercase; color: var(--azul-80); border-bottom: 2px solid var(--azul); vertical-align: bottom; }
:is(#cali27, #cali27-enc, #cali27-pie) .tarifas tbody th { font-weight: 600; font-size: 1.0625rem; line-height: 1.3; max-width: 24em; }
:is(#cali27, #cali27-enc, #cali27-pie) .row-note { display: block; font-weight: 400; font-size: .875rem; color: var(--azul-80); margin-top: 4px; }
:is(#cali27, #cali27-enc, #cali27-pie) .price { display: block; white-space: nowrap; font-size: 1.0625rem; }
:is(#cali27, #cali27-enc, #cali27-pie) .price + .price { color: var(--azul-80); font-size: .9375rem; }
:is(#cali27, #cali27-enc, #cali27-pie) .price__cur { font-size: .6875rem; font-weight: 600; letter-spacing: .1em; margin-right: .3em; color: var(--azul-80); }
:is(#cali27, #cali27-enc, #cali27-pie) .price--free { font-weight: 600; color: var(--azul); }
:is(#cali27, #cali27-enc, #cali27-pie) .price--na { font-size: .8125rem; font-style: italic; color: var(--azul-80); }
:is(#cali27, #cali27-enc, #cali27-pie) .tarifas__dates { display: block; margin-top: 4px; font-size: .6875rem; font-weight: 400; letter-spacing: 0; text-transform: none; line-height: 1.3; }
:is(#cali27, #cali27-enc, #cali27-pie) .virtual-soon { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 12px; margin: 0 0 16px; }
:is(#cali27, #cali27-enc, #cali27-pie) .table-wrap.is-soon { opacity: .55; }
:is(#cali27, #cali27-enc, #cali27-pie) .tarifas .is-featured { background: rgba(239, 175, 33, .16); padding-left: 14px; }
:is(#cali27, #cali27-enc, #cali27-pie) .tarifas thead .is-featured { background: var(--oro); color: var(--azul); border-bottom-color: var(--oro); }
:is(#cali27, #cali27-enc, #cali27-pie) .tarifas--virtual { margin-top: 28px; }
@media (min-width: 900px) {
  :is(#cali27, #cali27-enc, #cali27-pie) .tarifas:not(.tarifas--virtual) :is(th, td) { padding-inline: 22px; }
  :is(#cali27, #cali27-enc, #cali27-pie) .tarifas:not(.tarifas--virtual) :is(th, td):first-child { padding-left: 0; padding-right: 40px; }
  :is(#cali27, #cali27-enc, #cali27-pie) .tarifas:not(.tarifas--virtual) :is(th, td):last-child { padding-right: 0; }
  :is(#cali27, #cali27-enc, #cali27-pie) .tarifas .is-featured { padding-left: 22px; padding-right: 22px; }
}
:is(#cali27, #cali27-enc, #cali27-pie) .tarifas--virtual th, :is(#cali27, #cali27-enc, #cali27-pie) .tarifas--virtual td { padding-right: 20px; }
@media (max-width: 480px) {
  :is(#cali27, #cali27-enc, #cali27-pie) .tarifas--virtual th, :is(#cali27, #cali27-enc, #cali27-pie) .tarifas--virtual td { padding: 12px 8px 12px 0; }
  :is(#cali27, #cali27-enc, #cali27-pie) .tarifas--virtual td .price__cur { display: none; }
}
@media (max-width: 899px) {
  :is(#cali27, #cali27-enc, #cali27-pie) .tarifas:not(.tarifas--virtual) thead { display: none; }
  :is(#cali27, #cali27-enc, #cali27-pie) .tarifas:not(.tarifas--virtual), :is(#cali27, #cali27-enc, #cali27-pie) .tarifas:not(.tarifas--virtual) tbody, :is(#cali27, #cali27-enc, #cali27-pie) .tarifas:not(.tarifas--virtual) tr { display: block; }
  :is(#cali27, #cali27-enc, #cali27-pie) .tarifas:not(.tarifas--virtual) tr { border-top: 3px solid var(--azul); margin-bottom: 26px; }
  :is(#cali27, #cali27-enc, #cali27-pie) .tarifas:not(.tarifas--virtual) tbody th { display: block; padding: 12px 0 10px; }
  :is(#cali27, #cali27-enc, #cali27-pie) .tarifas:not(.tarifas--virtual) td { display: grid; grid-template-columns: 7.5em 1fr; gap: 8px; align-items: baseline; padding: 10px 0; }
  :is(#cali27, #cali27-enc, #cali27-pie) .tarifas:not(.tarifas--virtual) td::before { content: attr(data-label); font-size: .75rem; font-weight: 600; letter-spacing: .1em; text-transform: uppercase; color: var(--azul-80); }
  :is(#cali27, #cali27-enc, #cali27-pie) .tarifas:not(.tarifas--virtual) td.is-featured { padding-left: 10px; margin-inline: -10px; }
  :is(#cali27, #cali27-enc, #cali27-pie) .tarifas:not(.tarifas--virtual) td.is-featured::before { color: var(--azul); }
  :is(#cali27, #cali27-enc, #cali27-pie) .tarifas .price { display: inline-block; margin-right: 12px; }
  :is(#cali27, #cali27-enc, #cali27-pie) .tarifas tr.is-free td { display: none; }
  :is(#cali27, #cali27-enc, #cali27-pie) .tarifas tr.is-free td:first-of-type { display: block; padding-left: 10px; }
  :is(#cali27, #cali27-enc, #cali27-pie) .tarifas tr.is-free td:first-of-type::before { content: none; }
}

/* Convocatorias */
:is(#cali27, #cali27-enc, #cali27-pie) .hitos tbody th { font-weight: 600; }
:is(#cali27, #cali27-enc, #cali27-pie) .hitos tr.is-past th, :is(#cali27, #cali27-enc, #cali27-pie) .hitos tr.is-past td { color: var(--azul-80); }
:is(#cali27, #cali27-enc, #cali27-pie) .hitos tr.is-next th::before { content: "→ "; color: var(--rojo); }
:is(#cali27, #cali27-enc, #cali27-pie) .status { margin-top: 6px; }
:is(#cali27, #cali27-enc, #cali27-pie) .group { margin-bottom: clamp(48px, 6vw, 72px); }
:is(#cali27, #cali27-enc, #cali27-pie) .group__head { display: flex; align-items: baseline; gap: 16px; margin-bottom: 28px; }
:is(#cali27, #cali27-enc, #cali27-pie) .group__head .h3 { margin: 0; }
:is(#cali27, #cali27-enc, #cali27-pie) .group__n { font-size: 2.25rem; font-weight: 700; line-height: 1; color: var(--rojo); font-variant-numeric: lining-nums; }
:is(#cali27, #cali27-enc, #cali27-pie) .entries { display: grid; gap: 36px 48px; }
@media (min-width: 900px) { :is(#cali27, #cali27-enc, #cali27-pie) .entries { grid-template-columns: 1fr 1fr; } }
:is(#cali27, #cali27-enc, #cali27-pie) .entry { display: grid; grid-template-columns: minmax(110px, 160px) 1fr; gap: 22px; align-items: start; scroll-margin-top: 140px; }
@media (max-width: 479px) { :is(#cali27, #cali27-enc, #cali27-pie) .entry { grid-template-columns: 104px 1fr; gap: 16px; } }
:is(#cali27, #cali27-enc, #cali27-pie) .entry:target .entry__name { color: var(--rojo); }
:is(#cali27, #cali27-enc, #cali27-pie) .entry__group { margin: 0 0 4px; font-size: .8125rem; font-weight: 600; letter-spacing: .12em; text-transform: uppercase; color: var(--azul-80); }
:is(#cali27, #cali27-enc, #cali27-pie) .entry__name { font-size: 1.375rem; font-weight: 600; line-height: 1.2; margin: 0 0 12px; }
:is(#cali27, #cali27-enc, #cali27-pie) .ficha { border-top: 1px solid var(--line-strong); border-bottom: 1px solid var(--line-strong); }
:is(#cali27, #cali27-enc, #cali27-pie) .ficha summary { display: flex; align-items: center; gap: 8px 16px; padding: 10px 0; cursor: pointer; list-style: none; }
:is(#cali27, #cali27-enc, #cali27-pie) .ficha summary::-webkit-details-marker { display: none; }
:is(#cali27, #cali27-enc, #cali27-pie) .ficha__name { font-size: .875rem; font-weight: 600; letter-spacing: .1em; text-transform: uppercase; display: inline-flex; align-items: center; gap: 12px; }
:is(#cali27, #cali27-enc, #cali27-pie) .ficha__name::before { content: "+"; display: inline-grid; place-items: center; width: 22px; height: 22px; border: 1.5px solid var(--azul); font-weight: 400; flex: none; }
:is(#cali27, #cali27-enc, #cali27-pie) .ficha[open] .ficha__name::before { content: "–"; }
:is(#cali27, #cali27-enc, #cali27-pie) .ficha__list { margin: 0 0 22px; border-top: 1px solid var(--line); }
:is(#cali27, #cali27-enc, #cali27-pie) .ficha__list > div { display: grid; gap: 2px 24px; padding: 12px 0; border-bottom: 1px solid var(--line); }
:is(#cali27, #cali27-enc, #cali27-pie) .ficha__list dt { font-size: .75rem; font-weight: 600; letter-spacing: .1em; text-transform: uppercase; color: var(--azul-80); }
:is(#cali27, #cali27-enc, #cali27-pie) .ficha__list dd { margin: 0; }
:is(#cali27, #cali27-enc, #cali27-pie) .ficha__ul { margin: 0; padding-left: 1.1em; }
:is(#cali27, #cali27-enc, #cali27-pie) .ficha__ul li + li { margin-top: 6px; }
:is(#cali27, #cali27-enc, #cali27-pie) .entry__obj { margin: 0 0 12px; font-size: .9375rem; color: var(--azul-profundo); }
:is(#cali27, #cali27-enc, #cali27-pie) .entry__pdf { margin: 0 0 12px; }
:is(#cali27, #cali27-enc, #cali27-pie) .ficha__list .note { display: block; margin-top: 4px; }
@media (min-width: 1200px) { :is(#cali27, #cali27-enc, #cali27-pie) .ficha__list > div { grid-template-columns: 11em 1fr; } }

:is(#cali27, #cali27-enc, #cali27-pie) .downloads { border-top: 1px solid var(--line-strong); }
:is(#cali27, #cali27-enc, #cali27-pie) .download { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 4px 16px; padding: 14px 0; border-bottom: 1px solid var(--line-strong); color: var(--azul-80); cursor: not-allowed; text-decoration: none; }
:is(#cali27, #cali27-enc, #cali27-pie) .download__name { font-weight: 600; color: var(--azul); }
:is(#cali27, #cali27-enc, #cali27-pie) .download__name::before { content: "↓"; display: inline-block; margin-right: 10px; color: var(--azul-60); }
:is(#cali27, #cali27-enc, #cali27-pie) .download__state { font-size: .875rem; font-style: italic; }

:is(#cali27, #cali27-enc, #cali27-pie) .modfull { border-top: 1px solid var(--line-on-azul); margin-bottom: 32px; }
:is(#cali27, #cali27-enc, #cali27-pie) .modfull__item { display: grid; grid-template-columns: 80px 1fr; gap: 12px 22px; padding: 28px 0; border-bottom: 1px solid var(--line-on-azul); align-items: start; }
:is(#cali27, #cali27-enc, #cali27-pie) .modfull__item > * { min-width: 0; }
@media (max-width: 420px) { :is(#cali27, #cali27-enc, #cali27-pie) .modfull__item { grid-template-columns: 56px 1fr; gap: 10px 16px; } }
:is(#cali27, #cali27-enc, #cali27-pie) .modfull__n { display: block; color: var(--oro); font-size: .875rem; font-weight: 700; letter-spacing: .1em; margin-bottom: 4px; font-variant-numeric: lining-nums tabular-nums; }
:is(#cali27, #cali27-enc, #cali27-pie) .modfull__name { font-size: clamp(1.375rem, .8vw + 1.1rem, 1.875rem); font-weight: 600; color: var(--papel); margin-bottom: 6px; }
:is(#cali27, #cali27-enc, #cali27-pie) .modfull__format { margin: 0; font-style: italic; color: var(--oro) !important; }
:is(#cali27, #cali27-enc, #cali27-pie) .modfull__body { grid-column: 2; margin: 0; max-width: 44em; }
@media (min-width: 1000px) {
  :is(#cali27, #cali27-enc, #cali27-pie) .modfull__item { grid-template-columns: 80px 5fr 7fr; gap: 12px 36px; }
  :is(#cali27, #cali27-enc, #cali27-pie) .modfull__body { grid-column: 3; padding-top: 22px; }
}

/* Sede */
:is(#cali27, #cali27-enc, #cali27-pie) .topics { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 32px 20px; }
@media (min-width: 760px) { :is(#cali27, #cali27-enc, #cali27-pie) .topics { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (min-width: 1000px) { :is(#cali27, #cali27-enc, #cali27-pie) .topics { grid-template-columns: repeat(5, minmax(0, 1fr)); } }
:is(#cali27, #cali27-enc, #cali27-pie) .topic { display: flex; flex-direction: column; gap: 4px; }
:is(#cali27, #cali27-enc, #cali27-pie) .topic .ph { margin-bottom: 12px; }
:is(#cali27, #cali27-enc, #cali27-pie) .topic__name { font-size: 1.25rem; font-weight: 600; }

/* Preguntas frecuentes */
:is(#cali27, #cali27-enc, #cali27-pie) .faq__group + .faq__group { margin-top: 44px; }
:is(#cali27, #cali27-enc, #cali27-pie) .faq__cat { font-size: .8125rem; font-weight: 600; letter-spacing: .12em; text-transform: uppercase; color: var(--rojo); margin: 0 0 6px; }
:is(#cali27, #cali27-enc, #cali27-pie) .faq__item { border-bottom: 1px solid var(--line-strong); }
:is(#cali27, #cali27-enc, #cali27-pie) .faq__cat + .faq__item { border-top: 2px solid var(--azul); }
:is(#cali27, #cali27-enc, #cali27-pie) .faq__item summary { cursor: pointer; padding: 20px 44px 20px 0; font-size: 1.1875rem; font-weight: 600; list-style: none; position: relative; }
:is(#cali27, #cali27-enc, #cali27-pie) .faq__item summary::-webkit-details-marker { display: none; }
:is(#cali27, #cali27-enc, #cali27-pie) .faq__item summary::after { content: "+"; position: absolute; right: 6px; top: 15px; font-size: 1.75rem; font-weight: 400; color: var(--rojo); transition: transform .2s ease; }
:is(#cali27, #cali27-enc, #cali27-pie) .faq__item[open] summary::after { transform: rotate(45deg); }
:is(#cali27, #cali27-enc, #cali27-pie) .faq__item p { margin: 0 0 22px; max-width: 40em; color: var(--azul-profundo); }

/* Identidad */
:is(#cali27, #cali27-enc, #cali27-pie) .lead--drop::first-letter { float: left; font-size: 4.2em; line-height: .82; font-weight: 700; color: var(--rojo); margin: .06em .08em 0 0; }
:is(#cali27, #cali27-enc, #cali27-pie) .elemento { display: grid; gap: 32px; align-items: center; padding-block: clamp(44px, 6vw, 80px); }
:is(#cali27, #cali27-enc, #cali27-pie) .elemento:first-of-type { border-top: 0; padding-top: 0; }
:is(#cali27, #cali27-enc, #cali27-pie) .h-element { font-size: clamp(1.5rem, 1.2vw + 1.1rem, 2.125rem); font-weight: 700; line-height: 1.12; margin-bottom: 16px; display: grid; grid-template-columns: auto 1fr; gap: 16px; align-items: baseline; text-wrap: balance; }
:is(#cali27, #cali27-enc, #cali27-pie) .elemento__n { font-size: .875rem; font-weight: 600; color: var(--rojo); border: 1.5px solid var(--rojo); width: 32px; height: 32px; display: grid; place-items: center; transform: translateY(-4px); font-variant-numeric: lining-nums; }
:is(#cali27, #cali27-enc, #cali27-pie) .elemento__text p { max-width: 34em; font-size: 1.25rem; color: var(--azul-profundo); }
:is(#cali27, #cali27-enc, #cali27-pie) .elemento__art { justify-self: center; width: 100%; max-width: 460px; }
:is(#cali27, #cali27-enc, #cali27-pie) .elemento__art img { width: 100%; }
:is(#cali27, #cali27-enc, #cali27-pie) .elemento__art--tall { max-width: 360px; }
:is(#cali27, #cali27-enc, #cali27-pie) .elemento__art--landscape { max-width: 560px; position: relative; } /* lleva marco de estampilla y semitono vivo (reactivo.*) */
@media (min-width: 900px) {
  :is(#cali27, #cali27-enc, #cali27-pie) .elemento { grid-template-columns: 6fr 5fr; gap: 80px; }
  :is(#cali27, #cali27-enc, #cali27-pie) .elemento--reverse { grid-template-columns: 5fr 6fr; }
  :is(#cali27, #cali27-enc, #cali27-pie) .elemento--reverse > :first-child { order: 2; }
}
:is(#cali27, #cali27-enc, #cali27-pie) .bird-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 12px 20px; width: 100%; max-width: 480px; justify-self: center; align-items: center; }
:is(#cali27, #cali27-enc, #cali27-pie) .swatches { display: grid; grid-template-columns: 2fr 1fr 1fr; gap: 0; width: 100%; max-width: 460px; justify-self: center; }
:is(#cali27, #cali27-enc, #cali27-pie) .swatch { aspect-ratio: 3 / 4; padding: 14px; display: flex; flex-direction: column; justify-content: flex-end; font-weight: 600; font-size: 1rem; }
:is(#cali27, #cali27-enc, #cali27-pie) .swatch--azul { aspect-ratio: auto; }
:is(#cali27, #cali27-enc, #cali27-pie) .swatch code { font-family: var(--font); font-weight: 400; font-variant-numeric: lining-nums; font-size: .875rem; }
:is(#cali27, #cali27-enc, #cali27-pie) .swatch--azul { background: var(--azul); color: var(--papel); }
:is(#cali27, #cali27-enc, #cali27-pie) .swatch--oro { background: var(--oro); color: var(--azul); }
:is(#cali27, #cali27-enc, #cali27-pie) .swatch--rojo { background: var(--rojo); color: var(--papel); }
:is(#cali27, #cali27-enc, #cali27-pie) .spin-button { display: inline-flex; align-items: center; gap: 14px; margin-top: 8px; background: none; border: 1.5px solid var(--azul); border-radius: var(--radius); padding: 8px 18px 8px 10px; cursor: pointer; font-weight: 600; font-size: 1.0625rem; }
:is(#cali27, #cali27-enc, #cali27-pie) .spin-button .iso { width: 40px; }
:is(#cali27, #cali27-enc, #cali27-pie) .spin-button:hover { background: rgba(24, 53, 95, .06); }
:is(#cali27, #cali27-enc, #cali27-pie) .flock { position: relative; min-height: 380px; width: 100%; }
:is(#cali27, #cali27-enc, #cali27-pie) .flock__bird { position: absolute; }
:is(#cali27, #cali27-enc, #cali27-pie) .flock__bird--1 { width: 52%; left: 0; top: 0; }
:is(#cali27, #cali27-enc, #cali27-pie) .flock__bird--2 { width: 46%; right: 0; top: 24%; }
:is(#cali27, #cali27-enc, #cali27-pie) .flock__bird--3 { width: 48%; left: 20%; bottom: 0; }
/* Pliego de aves regionales: 22 estampillas Papel con borde perforado a tinta. */
:is(#cali27, #cali27-enc, #cali27-pie) .regiones { padding-block: clamp(56px, 7vw, 104px); }
:is(#cali27, #cali27-enc, #cali27-pie) .regiones__head { max-width: 40em; margin-bottom: 36px; }
:is(#cali27, #cali27-enc, #cali27-pie) .regiones__head p:last-child { font-size: 1.25rem; color: var(--azul-profundo); }
:is(#cali27, #cali27-enc, #cali27-pie) .pliego { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; margin: 0 0 20px; padding: 0; list-style: none; }
@media (min-width: 600px) { :is(#cali27, #cali27-enc, #cali27-pie) .pliego { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (min-width: 900px) { :is(#cali27, #cali27-enc, #cali27-pie) .pliego { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
@media (min-width: 1200px) { :is(#cali27, #cali27-enc, #cali27-pie) .pliego { grid-template-columns: repeat(6, minmax(0, 1fr)); } }
:is(#cali27, #cali27-enc, #cali27-pie) .pliego .pliego__item { display: flex; flex-direction: column; gap: 2px; padding: 16px 16px 18px; } /* gana a .stamp (display: block), declarado después */
:is(#cali27, #cali27-enc, #cali27-pie) .pliego__item:nth-child(3n+1) { --tilt: -.5deg; }
:is(#cali27, #cali27-enc, #cali27-pie) .pliego__item:nth-child(3n+2) { --tilt: .4deg; }
:is(#cali27, #cali27-enc, #cali27-pie) .pliego__n { font-size: .8125rem; font-weight: 700; letter-spacing: .12em; color: var(--rojo); font-variant-numeric: lining-nums tabular-nums; margin-bottom: 6px; }
:is(#cali27, #cali27-enc, #cali27-pie) .pliego__ph { margin-bottom: 10px; border: 1px solid var(--azul); }
:is(#cali27, #cali27-enc, #cali27-pie) .pliego__ph .ph__label { display: none; }
:is(#cali27, #cali27-enc, #cali27-pie) .pliego__ph.media--ilustracion img { padding: 8%; } /* el ave respira dentro del marco de la estampilla */
:is(#cali27, #cali27-enc, #cali27-pie) .pliego__dept { font-weight: 700; font-size: 1.0625rem; line-height: 1.2; text-transform: uppercase; letter-spacing: .03em; }
:is(#cali27, #cali27-enc, #cali27-pie) .pliego__dept--pending { text-transform: none; font-style: italic; font-weight: 600; color: var(--azul-80); }
:is(#cali27, #cali27-enc, #cali27-pie) .pliego__bird { font-style: italic; font-size: 1rem; color: var(--azul-profundo); line-height: 1.3; }
:is(#cali27, #cali27-enc, #cali27-pie) .pliego__sci { font-style: italic; font-size: .875rem; color: var(--azul-80); line-height: 1.3; }
:is(#cali27, #cali27-enc, #cali27-pie) .pliego__soc { font-size: .8125rem; font-weight: 600; letter-spacing: .1em; color: var(--azul-80); margin-top: 4px; text-decoration: none; }
html.mov :is(#cali27, #cali27-enc, #cali27-pie) .pliego__item:nth-child(6n+2) { animation-delay: 60ms; }
html.mov :is(#cali27, #cali27-enc, #cali27-pie) .pliego__item:nth-child(6n+3) { animation-delay: 120ms; }
html.mov :is(#cali27, #cali27-enc, #cali27-pie) .pliego__item:nth-child(6n+4) { animation-delay: 180ms; }
html.mov :is(#cali27, #cali27-enc, #cali27-pie) .pliego__item:nth-child(6n+5) { animation-delay: 240ms; }
html.mov :is(#cali27, #cali27-enc, #cali27-pie) .pliego__item:nth-child(6n) { animation-delay: 300ms; }
:is(#cali27, #cali27-enc, #cali27-pie) .cierre .lead { font-size: clamp(1.25rem, .5vw + 1.1rem, 1.5rem); max-width: 34em; }
:is(#cali27, #cali27-enc, #cali27-pie) .cierre__lema { font-style: italic; font-size: clamp(1.875rem, 2.2vw + 1rem, 2.875rem); line-height: 1.15; color: var(--oro) !important; margin: 40px 0 0; }

/* ------------------------------------------------------------------ pie de página */

:is(#cali27, #cali27-enc, #cali27-pie) .site-footer { position: relative; background: var(--azul); color: var(--papel); padding-top: clamp(64px, 7vw, 104px); }
:is(#cali27, #cali27-enc, #cali27-pie) .site-footer__grid { display: grid; gap: 40px; }
:is(#cali27, #cali27-enc, #cali27-pie) .site-footer__brand img { width: 240px; }
:is(#cali27, #cali27-enc, #cali27-pie) .site-footer__big { font-size: 1.375rem; font-weight: 600; margin-bottom: 8px; color: var(--papel); }
:is(#cali27, #cali27-enc, #cali27-pie) .site-footer__col p { margin-bottom: 10px; }
:is(#cali27, #cali27-enc, #cali27-pie) .site-footer__cta { margin-top: 20px; }
:is(#cali27, #cali27-enc, #cali27-pie) .site-footer__nav li a { display: inline-block; padding: 4px 0; color: var(--papel); text-decoration: none; }
:is(#cali27, #cali27-enc, #cali27-pie) .site-footer__nav li a:hover, :is(#cali27, #cali27-enc, #cali27-pie) .site-footer__nav li a[aria-current] { color: var(--oro); text-decoration: underline; }
:is(#cali27, #cali27-enc, #cali27-pie) .site-footer__contact { margin-top: 22px; }
:is(#cali27, #cali27-enc, #cali27-pie) .site-footer__contact .eyebrow { display: inline-block; margin-bottom: 4px; }
:is(#cali27, #cali27-enc, #cali27-pie) .site-footer__legal { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 8px 24px; margin-top: clamp(40px, 5vw, 64px); padding-block: 20px 26px; font-size: .875rem; }
:is(#cali27, #cali27-enc, #cali27-pie) .site-footer__legal p { margin: 0; opacity: .85; }
@media (min-width: 700px) { :is(#cali27, #cali27-enc, #cali27-pie) .site-footer__grid { grid-template-columns: 1fr 1fr; } }
@media (min-width: 1100px) { :is(#cali27, #cali27-enc, #cali27-pie) .site-footer__grid { grid-template-columns: 1.1fr 1fr 1fr 1.1fr; gap: 48px; } }

/* ================================================================== lenguaje postal (tercera pasada)
   El sitio como correspondencia enviada desde Cali: estampillas perforadas, matasellos, sobres y postales.
   Reglas: solo se inclina el papel (los textos quedan rectos); nada se estampa sobre logotipos, tablas,
   formularios ni textos legales; un conjunto postal por sección; colores planos del kit, sin degradados de color
   (los puntos de semitono y las perforaciones usan radial-gradient como textura, no como degradado). */

:is(#cali27, #cali27-enc, #cali27-pie) {
  --col-gap: 24px;
  --col: calc((var(--wrap) - 11 * var(--col-gap)) / 12);
  --air-s: clamp(40px, 5vw, 72px);
  --air-m: clamp(64px, 7vw, 112px);
  --air-l: clamp(96px, 10vw, 168px);
  --air-xl: clamp(128px, 14vw, 224px);
  --ease-stamp: cubic-bezier(.2, 1.25, .35, 1);
  --perf: 5px;
  --coil-overlap: 56px;
  --straddle: 0px;
}
@media (max-width: 599px) { :is(#cali27, #cali27-enc, #cali27-pie) { --col-gap: 16px; } }
@media (min-width: 900px) { :is(#cali27, #cali27-enc, #cali27-pie) { --coil-overlap: 72px; } }
@media (min-width: 1000px) { :is(#cali27, #cali27-enc, #cali27-pie) { --straddle: 96px; } }

:is(#cali27, #cali27-enc, #cali27-pie) [hidden] { display: none !important; }

/* C1 · Rejilla de 12 columnas con líneas con nombre: las secciones empiezan en columnas distintas y los
   sangrados usan full-start / full-end (nunca 100vw). */
:is(#cali27, #cali27-enc, #cali27-pie) .g {
  display: grid; column-gap: var(--col-gap);
  grid-template-columns:
    [full-start] minmax(max(0px, calc(var(--gutter) - var(--col-gap))), 1fr)
    [content-start] repeat(12, [c] minmax(0, var(--col)))
    [content-end] minmax(max(0px, calc(var(--gutter) - var(--col-gap))), 1fr) [full-end];
}
:is(#cali27, #cali27-enc, #cali27-pie) .g > * { grid-column: content; min-width: 0; }

/* C2 · Estampilla perforada. El papel vive en los pseudoelementos: --tilt inclina solo el papel; --rot gira
   toda la estampilla (solo en las que no llevan texto). */
:is(#cali27, #cali27-enc, #cali27-pie) .stamp {
  --plate: var(--papel); --edge-c: var(--azul-40); --t: calc(var(--perf) * 3); --tilt: 0deg;
  position: relative; isolation: isolate; display: block; padding: calc(var(--perf) * 2.6); rotate: var(--rot, 0deg);
}
:is(#cali27, #cali27-enc, #cali27-pie) .stamp::before, :is(#cali27, #cali27-enc, #cali27-pie) .stamp::after { content: ""; position: absolute; z-index: -1; rotate: var(--tilt); pointer-events: none; }
:is(#cali27, #cali27-enc, #cali27-pie) .stamp::before {
  inset: 0; border: 1px solid transparent;
  background:
    radial-gradient(calc(var(--perf) + 1px), #0000 96%, var(--plate)) calc(var(--t) / -2) calc(var(--t) / -2) / var(--t) var(--t) round padding-box,
    radial-gradient(var(--perf), #0000 96%, var(--edge-c)) calc(var(--t) / -2) calc(var(--t) / -2) / var(--t) var(--t) round padding-box border-box;
}
:is(#cali27, #cali27-enc, #cali27-pie) .stamp::after { inset: calc(var(--t) / 2 + 1px); background: var(--plate); }
:is(#cali27, #cali27-enc, #cali27-pie) .stamp__face { display: block; border: 1px solid var(--azul); padding: 8px; background: var(--plate); }
:is(#cali27, #cali27-enc, #cali27-pie) .stamp__face img { width: 100%; height: auto; }
:is(#cali27, #cali27-enc, #cali27-pie) .stamp__legend { display: block; margin-top: 6px; font-size: .75rem; font-weight: 700; letter-spacing: .12em; white-space: nowrap; text-transform: uppercase; color: var(--rojo); line-height: 1; text-align: center; }
:is(#cali27, #cali27-enc, #cali27-pie) .stamp--bird { width: 108px; }
:is(#cali27, #cali27-enc, #cali27-pie) .stamp--bird .stamp__face { aspect-ratio: 1; display: grid; place-items: center; padding: 6px; }
:is(#cali27, #cali27-enc, #cali27-pie) .stamp--bird .stamp__face img { width: 100%; height: 100%; object-fit: contain; }

/* Estampilla de la cuenta regresiva: el plato es el Marco Azulejo del kit (la forma legal de un ave sobre Azul). */
:is(#cali27, #cali27-enc, #cali27-pie) .stamp--count { --plate: var(--papel); --edge-c: var(--papel); width: 236px; text-align: center; color: var(--azul); }
:is(#cali27, #cali27-enc, #cali27-pie) .stamp__plate { display: grid; place-items: center; aspect-ratio: 1; padding: 17%; background: url("assets/Marco_Azulejo_Azul.svg") center / contain no-repeat; }
:is(#cali27, #cali27-enc, #cali27-pie) .stamp__plate img { width: 100%; height: 100%; object-fit: contain; }
:is(#cali27, #cali27-enc, #cali27-pie) .stamp__pre { display: block; margin-top: 10px; font-size: .875rem; color: var(--azul-80); }
:is(#cali27, #cali27-enc, #cali27-pie) .stamp__value { display: block; font-size: 3.25rem; font-weight: 700; line-height: 1; font-variant-numeric: lining-nums tabular-nums; color: var(--azul); }
:is(#cali27, #cali27-enc, #cali27-pie) .stamp__unit { display: block; margin-top: 4px; font-size: .9375rem; color: var(--azul-profundo); line-height: 1.25; }

/* Estampilla conmemorativa: envuelve el panel Creyentes (margen Papel perforado, borde a tinta). */
:is(#cali27, #cali27-enc, #cali27-pie) .stamp--commemorative { --plate: var(--papel); --edge-c: var(--azul-40); --perf: 7px; padding: 22px; }
:is(#cali27, #cali27-enc, #cali27-pie) .stamp--commemorative .creyentes { position: relative; z-index: 1; }
:is(#cali27, #cali27-enc, #cali27-pie) .stamp--photo { --plate: var(--papel); --edge-c: var(--azul-40); }
:is(#cali27, #cali27-enc, #cali27-pie) .stamp--photo .ph, :is(#cali27, #cali27-enc, #cali27-pie) .stamp--photo .media { border: 1px solid var(--azul); }
:is(#cali27, #cali27-enc, #cali27-pie) .stamp--photo .ph--foto { border-style: solid; }
:is(#cali27, #cali27-enc, #cali27-pie) .stamp--icon { --plate: var(--papel); --edge-c: var(--papel); width: 80px; padding: 9px; }
:is(#cali27, #cali27-enc, #cali27-pie) .stamp--icon .ph { border: 0; padding: 4px; }

/* C3 · Matasellos (SVG generado en build.mjs con atributos de presentación). */
:is(#cali27, #cali27-enc, #cali27-pie) .pm { position: absolute; display: block; color: var(--azul); pointer-events: none; rotate: calc(var(--rot, -8deg) + var(--turn, 0deg)); z-index: 0; }
:is(#cali27, #cali27-enc, #cali27-pie) .pm--oro { color: var(--oro); }
:is(#cali27, #cali27-enc, #cali27-pie) .pm[data-turn] { will-change: rotate; }
:is(#cali27, #cali27-enc, #cali27-pie) .pm svg { width: 100%; max-width: none; height: auto; overflow: visible; }
:is(#cali27, #cali27-enc, #cali27-pie) .pm text { font-family: var(--font); font-weight: 700; fill: currentColor; }
:is(#cali27, #cali27-enc, #cali27-pie) .pm__arc { font-size: 15px; letter-spacing: .17em; }
:is(#cali27, #cali27-enc, #cali27-pie) .pm__big { font-size: 34px; font-variant-numeric: lining-nums; }
:is(#cali27, #cali27-enc, #cali27-pie) .pm__small { font-size: 13.5px; letter-spacing: .2em; }
:is(#cali27, #cali27-enc, #cali27-pie) .pm__ring { transform-box: fill-box; transform-origin: center; }

/* C4 · Tira de estampillas con los datos clave (entre la portada y la Presentación). */
:is(#cali27, #cali27-enc, #cali27-pie) .coil-wrap { position: relative; z-index: 3; margin-bottom: calc(-1 * var(--coil-overlap)); }
:is(#cali27, #cali27-enc, #cali27-pie) .coil { display: grid; gap: 14px; margin: 0; }
:is(#cali27, #cali27-enc, #cali27-pie) .coil__cell { --plate: var(--papel); --edge-c: var(--azul-40); padding: 22px 24px 20px; }
:is(#cali27, #cali27-enc, #cali27-pie) .coil dt { font-size: .8125rem; font-weight: 600; letter-spacing: .14em; text-transform: uppercase; color: var(--rojo); margin-bottom: 6px; }
:is(#cali27, #cali27-enc, #cali27-pie) .coil dd { margin: 0; font-size: 1.0625rem; line-height: 1.35; color: var(--azul-profundo); }
@media (max-width: 479px) { :is(#cali27, #cali27-enc, #cali27-pie) .coil__cell { width: 88%; } :is(#cali27, #cali27-enc, #cali27-pie) .coil__cell:nth-child(even) { justify-self: end; } }
@media (min-width: 480px) { :is(#cali27, #cali27-enc, #cali27-pie) .coil { grid-template-columns: 1fr 1fr; } }
@media (min-width: 900px) {
  :is(#cali27, #cali27-enc, #cali27-pie) .coil { grid-column: c 3 / content-end; grid-template-columns: 1.4fr 1fr 1fr 1fr; gap: 18px; align-items: start; }
  :is(#cali27, #cali27-enc, #cali27-pie) .coil__cell:nth-child(1) { --tilt: -.8deg; translate: 0 -6px; }
  :is(#cali27, #cali27-enc, #cali27-pie) .coil__cell:nth-child(2) { --tilt: .6deg; translate: 0 12px; }
  :is(#cali27, #cali27-enc, #cali27-pie) .coil__cell:nth-child(3) { --tilt: -.4deg; }
  :is(#cali27, #cali27-enc, #cali27-pie) .coil__cell:nth-child(4) { --tilt: .8deg; translate: 0 20px; }
}

/* C5 · Marco Oro con ornamentos de esquina del kit. */
:is(#cali27, #cali27-enc, #cali27-pie) .frame-oro { position: absolute; inset: clamp(12px, 1.8vw, 26px); border: 1px solid var(--oro); pointer-events: none; z-index: 0; grid-column: auto; grid-row: auto; }
:is(#cali27, #cali27-enc, #cali27-pie) .frame-oro::before, :is(#cali27, #cali27-enc, #cali27-pie) .frame-oro::after { content: ""; position: absolute; bottom: 10px; width: 34px; height: 37px; background: url("assets/Ornamento_Esquina_Oro.svg") center / contain no-repeat; }
:is(#cali27, #cali27-enc, #cali27-pie) .frame-oro::before { left: 10px; transform: scaleY(-1); }
:is(#cali27, #cali27-enc, #cali27-pie) .frame-oro::after { right: 10px; transform: rotate(180deg); }

/* C6 · Borde perforado: el Papel «muerde» el Azul. */
:is(#cali27, #cali27-enc, #cali27-pie) .perf-edge { position: absolute; z-index: 2; pointer-events: none; grid-column: auto; grid-row: auto; }
:is(#cali27, #cali27-enc, #cali27-pie) .perf-edge--top { inset: -1px 0 auto; height: 10px; background: radial-gradient(circle at 9px 0, var(--papel) 0 6px, #0000 6.5px) 0 0 / 18px 10px repeat-x; }
:is(#cali27, #cali27-enc, #cali27-pie) .perf-edge--left { inset: 0 auto 0 -1px; width: 10px; background: radial-gradient(circle at 0 9px, var(--papel) 0 6px, #0000 6.5px) 0 0 / 10px 18px repeat-y; }

/* ------------------------------------------------------------------ Inicio, sección por sección */

/* Portada: misma composición; se suman la división de postal, la estampilla y la profundidad del arte. */
:is(#cali27, #cali27-enc, #cali27-pie) .hero__grid { padding-top: clamp(28px, 4vw, 56px); }
:is(#cali27, #cali27-enc, #cali27-pie) .hero__copy { padding-bottom: clamp(56px, 6vw, 88px); }
:is(#cali27, #cali27-enc, #cali27-pie) .hero__art { position: relative; }
:is(#cali27, #cali27-enc, #cali27-pie) .hero__keyart { display: block; position: relative; }
:is(#cali27, #cali27-enc, #cali27-pie) .hero__stamp { display: none; }
@media (min-width: 600px) and (max-width: 899px) {
  :is(#cali27, #cali27-enc, #cali27-pie) .hero__grid { position: relative; }
  :is(#cali27, #cali27-enc, #cali27-pie) .hero__art { position: static; }
  :is(#cali27, #cali27-enc, #cali27-pie) .hero__stamp { display: block; position: absolute; top: 24px; right: var(--gutter); width: 92px; --rot: 4deg; }
}
@media (min-width: 900px) {
  :is(#cali27, #cali27-enc, #cali27-pie) .hero__grid { grid-template-rows: auto; }
  :is(#cali27, #cali27-enc, #cali27-pie) .hero__grid::before {
    content: ""; grid-column: c 8; grid-row: 1; justify-self: start; align-self: stretch;
    margin: 56px 0 96px calc(var(--col-gap) / -2); width: 1px; background: var(--line-strong);
  }
  :is(#cali27, #cali27-enc, #cali27-pie) .hero__copy { grid-column: c 1 / c 8; grid-row: 1; align-self: center; }
  :is(#cali27, #cali27-enc, #cali27-pie) .hero__art { grid-column: c 8 / content-end; grid-row: 1; align-self: end; justify-self: end; width: min(100%, 400px); margin-right: 7%; }
  :is(#cali27, #cali27-enc, #cali27-pie) .hero__stamp { display: block; position: absolute; top: -44px; right: -20%; width: 112px; --rot: 4deg; z-index: 1; }
}
@media (min-width: 900px) and (max-width: 1359px) { :is(#cali27, #cali27-enc, #cali27-pie) .hero__stamp { top: -20px; right: -14%; width: 96px; } }
@media (max-width: 899px) { :is(#cali27, #cali27-enc, #cali27-pie) .hero__grid::before { display: none; } }

/* Presentación: tarjeta Azul a sangre con marco Oro, carta con De/Para, matasellos y estampilla de cuenta regresiva.
   El gran espacio inferior queda reservado para la ilustración IL-19 / IL-20. */
:is(#cali27, #cali27-enc, #cali27-pie) .pres {
  position: relative; isolation: isolate; overflow: clip; background: var(--azul); color: var(--papel);
  padding: calc(var(--coil-overlap) + var(--air-l)) 0 calc(var(--straddle) + clamp(200px, 20vw, 300px));
}
:is(#cali27, #cali27-enc, #cali27-pie) .pres p, :is(#cali27, #cali27-enc, #cali27-pie) .pres .lead { color: var(--papel); }
:is(#cali27, #cali27-enc, #cali27-pie) .pres__letter { position: relative; z-index: 1; }
:is(#cali27, #cali27-enc, #cali27-pie) .pres__text { font-size: clamp(1.4375rem, 1.15vw + 1.05rem, 2.125rem); line-height: 1.4; margin: 0 0 36px; max-width: 26em; color: var(--papel); text-wrap: pretty; }
:is(#cali27, #cali27-enc, #cali27-pie) .pres__route { display: flex; flex-wrap: wrap; gap: 18px 44px; margin: 0; }
:is(#cali27, #cali27-enc, #cali27-pie) .pres__route div { display: flex; align-items: baseline; gap: 12px; }
:is(#cali27, #cali27-enc, #cali27-pie) .pres__route dt { font-size: .8125rem; font-weight: 600; letter-spacing: .14em; text-transform: uppercase; color: var(--oro); }
:is(#cali27, #cali27-enc, #cali27-pie) .pres__route dd { margin: 0; min-width: 13em; padding-bottom: 4px; border-bottom: 1px solid var(--line-on-azul); font-style: italic; font-size: 1.25rem; color: var(--papel); }
:is(#cali27, #cali27-enc, #cali27-pie) .pres__aside { position: relative; z-index: 1; min-height: 540px; margin-top: 64px; } /* contiene la estampilla de la cuenta */
:is(#cali27, #cali27-enc, #cali27-pie) .pres__pm { width: 420px; left: -12px; top: 0; --rot: -8deg; }
:is(#cali27, #cali27-enc, #cali27-pie) .pres .stamp--count { position: absolute; right: 0; top: 150px; width: min(220px, 58vw); }
:is(#cali27, #cali27-enc, #cali27-pie) .pres__ill { position: absolute; inset: 0; z-index: -1; pointer-events: none; grid-column: auto; grid-row: auto; }
:is(#cali27, #cali27-enc, #cali27-pie) .pres__ill img { position: absolute; left: 0; right: 0; bottom: 0; width: 100%; height: auto; }
:is(#cali27, #cali27-enc, #cali27-pie) .pres__ph {
  position: absolute; inset: 0; width: auto; aspect-ratio: auto; border: 0; background: none; color: var(--papel);
  justify-content: flex-end; align-items: flex-start; padding: 0 clamp(40px, 5vw, 72px) clamp(36px, 4vw, 56px);
}
:is(#cali27, #cali27-enc, #cali27-pie) .pres__ph::before {
  content: ""; position: absolute; inset: auto 0 0; z-index: -1; height: calc(var(--straddle) + clamp(200px, 20vw, 300px));
  background: radial-gradient(circle, var(--oro) 0 1px, #0000 1.4px) 0 0 / 9px 9px;
  clip-path: polygon(0 18%, 30% 20%, 52% 14%, 70% 8%, 100% 0, 100% 100%, 0 100%);
}
:is(#cali27, #cali27-enc, #cali27-pie) .pres__ph :is(.ph__code, .ph__label) { position: relative; background: var(--azul); padding: 2px 8px; }
:is(#cali27, #cali27-enc, #cali27-pie) .pres__ph .ph__code { color: var(--oro); }
:is(#cali27, #cali27-enc, #cali27-pie) .pres__ph--tall { display: none; }
@media (max-width: 999px) {
  :is(#cali27, #cali27-enc, #cali27-pie) .pres__ph--wide { display: none; }
  :is(#cali27, #cali27-enc, #cali27-pie) .pres__ph--tall { display: flex; }
  :is(#cali27, #cali27-enc, #cali27-pie) .pres__ph--tall::before { clip-path: polygon(0 18%, 50% 10%, 100% 0, 100% 100%, 0 100%); }
}
@media (min-width: 1000px) {
  :is(#cali27, #cali27-enc, #cali27-pie) .pres__letter { grid-column: c 2 / span 7; }
  :is(#cali27, #cali27-enc, #cali27-pie) .pres__aside { grid-column: c 10 / span 3; min-height: calc(clamp(560px, 46vw, 720px) * .42 + 390px); margin-top: 0; }
  :is(#cali27, #cali27-enc, #cali27-pie) .pres__pm { width: clamp(560px, 46vw, 720px); left: -28px; top: -24px; }
  /* la estampilla baja con el matasellos (crece con 46vw) para no tapar el texto del anillo */
  :is(#cali27, #cali27-enc, #cali27-pie) .pres .stamp--count { left: 36px; right: auto; top: calc(clamp(560px, 46vw, 720px) * .42 + 8px); width: 236px; }
}
@media (min-width: 1000px) and (max-width: 1199px) { :is(#cali27, #cali27-enc, #cali27-pie) .pres .stamp--count { left: 0; width: 200px; } }
@media (max-width: 479px) { :is(#cali27, #cali27-enc, #cali27-pie) .pres .stamp--count { top: 190px; } :is(#cali27, #cali27-enc, #cali27-pie) .pres__aside { min-height: 590px; } }
@media (max-width: 599px) { :is(#cali27, #cali27-enc, #cali27-pie) .pres, :is(#cali27, #cali27-enc, #cali27-pie) .cierre { --gutter: 32px; } }

/* Inscripción + Creyentes: la estampilla conmemorativa cruza la costura hacia el Azul. */
:is(#cali27, #cali27-enc, #cali27-pie) .reg { position: relative; padding: 0 0 var(--air-l); overflow-x: clip; }
:is(#cali27, #cali27-enc, #cali27-pie) .reg__text { padding-top: var(--air-m); }
:is(#cali27, #cali27-enc, #cali27-pie) .reg__stamp { position: relative; z-index: 2; margin-top: 48px; }
:is(#cali27, #cali27-enc, #cali27-pie) .reg__pm { width: 460px; left: calc(100% - 92px); bottom: -96px; --rot: -10deg; }
@media (min-width: 1000px) {
  :is(#cali27, #cali27-enc, #cali27-pie) .reg__text { grid-column: c 1 / span 5; padding-top: var(--air-l); }
  :is(#cali27, #cali27-enc, #cali27-pie) .reg__stamp { grid-column: c 7 / span 5; grid-row: 1; margin-top: calc(-1 * var(--straddle)); align-self: start; }
}
@supports not (overflow: clip) { :is(#cali27, #cali27-enc, #cali27-pie) .reg { overflow-x: visible; } :is(#cali27, #cali27-enc, #cali27-pie) .reg .pm__waves { display: none; } }
@media (max-width: 999px) { :is(#cali27, #cali27-enc, #cali27-pie) .reg__pm { width: 300px; left: auto; right: -40px; bottom: -84px; } }
@media (min-width: 1000px) { :is(#cali27, #cali27-enc, #cali27-pie) .reg__pm { left: calc(100% - 72px); bottom: -150px; } }

/* Novedades: una hoja Azul que sangra hacia la derecha, con perforación a la izquierda. */
:is(#cali27, #cali27-enc, #cali27-pie) .nov { position: relative; padding-block: var(--air-m); overflow-x: clip; }
:is(#cali27, #cali27-enc, #cali27-pie) .nov__bird { display: none; }
:is(#cali27, #cali27-enc, #cali27-pie) .nov__sheet { position: relative; background: var(--azul); color: var(--papel); padding: 56px var(--gutter) 64px 32px; grid-column: content-start / full-end; }
:is(#cali27, #cali27-enc, #cali27-pie) .nov__sheet p, :is(#cali27, #cali27-enc, #cali27-pie) .nov__sheet .lead { color: var(--papel); }
:is(#cali27, #cali27-enc, #cali27-pie) .nov__list { margin-top: 40px; }
@media (min-width: 1000px) {
  :is(#cali27, #cali27-enc, #cali27-pie) .nov__bird { display: block; grid-column: c 1 / span 2; align-self: center; width: 150px; justify-self: center; }
  :is(#cali27, #cali27-enc, #cali27-pie) .nov__sheet { grid-column: c 3 / full-end; padding: var(--air-m) 0; }
}
@supports (grid-template-columns: subgrid) {
  @media (min-width: 1000px) {
    :is(#cali27, #cali27-enc, #cali27-pie) .nov__sheet { display: grid; grid-template-columns: subgrid; align-items: center; }
    :is(#cali27, #cali27-enc, #cali27-pie) .nov__head { grid-column: c 2 / span 4; }          /* = columnas 4–7 de la página */
    :is(#cali27, #cali27-enc, #cali27-pie) .nov__list { grid-column: c 6 / content-end; margin-top: 0; }  /* = columna 8 en adelante */
  }
}
@supports not (grid-template-columns: subgrid) {
  @media (min-width: 1000px) { :is(#cali27, #cali27-enc, #cali27-pie) .nov__sheet { padding: var(--air-m) var(--gutter) var(--air-m) 8%; } }
}

/* C14 · Escalera de modalidades. */
:is(#cali27, #cali27-enc, #cali27-pie) .modlist--escalera { border: 0; }
:is(#cali27, #cali27-enc, #cali27-pie) .modlist--escalera li { grid-template-columns: 4.2rem 1fr; gap: 2px 14px; padding: 16px 0; border: 0; max-width: 30em; }
:is(#cali27, #cali27-enc, #cali27-pie) .modlist--escalera .modlist__n { font-size: clamp(2.5rem, 2vw + 1.5rem, 3.5rem); font-weight: 500; line-height: .82; color: var(--oro); padding-top: 0; }
@media (min-width: 1000px) {
  :is(#cali27, #cali27-enc, #cali27-pie) .modlist--escalera li:nth-child(2) { margin-left: 2.5rem; }
  :is(#cali27, #cali27-enc, #cali27-pie) .modlist--escalera li:nth-child(3) { margin-left: .75rem; }
  :is(#cali27, #cali27-enc, #cali27-pie) .modlist--escalera li:nth-child(4) { margin-left: 3.5rem; }
  :is(#cali27, #cali27-enc, #cali27-pie) .modlist--escalera li:nth-child(5) { margin-left: 1.5rem; }
}

/* Programa: casi vacío; un sello de goma «Muy pronto» cruza el espacio para la estampilla. */
:is(#cali27, #cali27-enc, #cali27-pie) .prog { padding-block: var(--air-xl) var(--air-m); align-items: start; overflow-x: clip; } /* el sello ya cabe en reposo; esto solo recorta su entrada (escala 1,6) */
:is(#cali27, #cali27-enc, #cali27-pie) .prog .h2 { margin-bottom: 0; }
:is(#cali27, #cali27-enc, #cali27-pie) .prog__body { margin: 20px 0 0; max-width: 24em; color: var(--azul-profundo); }
:is(#cali27, #cali27-enc, #cali27-pie) .slot { margin-top: 40px; }
@media (min-width: 900px) {
  :is(#cali27, #cali27-enc, #cali27-pie) .prog__head { grid-column: c 2 / span 4; }
  :is(#cali27, #cali27-enc, #cali27-pie) .prog__body { grid-column: c 6 / span 3; margin-top: 24px; }
  :is(#cali27, #cali27-enc, #cali27-pie) .slot { grid-column: c 10 / span 3; margin-top: 0; }
  :is(#cali27, #cali27-enc, #cali27-pie) .prog--page .prog__body { grid-column: c 2 / span 5; margin-top: 0; }
}
:is(#cali27, #cali27-enc, #cali27-pie) .prog--page { padding-top: var(--air-m); }
:is(#cali27, #cali27-enc, #cali27-pie) .prog__actions { margin: 16px 0 0; }
@media (min-width: 900px) { :is(#cali27, #cali27-enc, #cali27-pie) .prog__actions { grid-column: c 6 / span 3; margin-top: -120px; } }

/* C13 · Sello de goma + espacio para la estampilla. */
:is(#cali27, #cali27-enc, #cali27-pie) .slot { position: relative; width: 200px; height: 236px; justify-self: end; }
:is(#cali27, #cali27-enc, #cali27-pie) .slot__box { position: absolute; right: 0; top: 0; width: 150px; aspect-ratio: 4 / 5; border: 1.5px dashed var(--azul-60); rotate: 3deg; display: grid; place-items: start center; padding: 14px 10px; }
:is(#cali27, #cali27-enc, #cali27-pie) .slot__note { font-size: .75rem; font-weight: 700; letter-spacing: .18em; line-height: 1.4; text-transform: uppercase; color: var(--azul-80); text-align: center; }
:is(#cali27, #cali27-enc, #cali27-pie) .rubber { margin: 0; rotate: -7deg; justify-self: start; }
:is(#cali27, #cali27-enc, #cali27-pie) .slot .rubber { position: absolute; left: auto; right: 6px; top: 104px; }
:is(#cali27, #cali27-enc, #cali27-pie) .rubber span {
  display: block; padding: .3em .8em .26em; border: 3px solid var(--rojo); border-radius: 4px;
  outline: 1.5px solid var(--rojo); outline-offset: 4px; background: var(--papel); color: var(--rojo);
  font-weight: 700; font-size: clamp(1.375rem, 1vw + 1rem, 1.875rem); letter-spacing: .16em; text-transform: uppercase; white-space: nowrap;
}
:is(#cali27, #cali27-enc, #cali27-pie) .rubber--lg { rotate: -6deg; margin: 36px 0 8px; max-width: 100%; }
:is(#cali27, #cali27-enc, #cali27-pie) .rubber--lg span { white-space: normal; text-align: center; }
@media (max-width: 419px) {
  :is(#cali27, #cali27-enc, #cali27-pie) .rubber span { font-size: clamp(1.0625rem, 5.2vw, 1.375rem); letter-spacing: .1em; }
  :is(#cali27, #cali27-enc, #cali27-pie) .rubber--lg { max-width: calc(100% - 16px); }
}

/* Convocatorias: numerales de fechador + álbum colgado «al estilo salón». */
:is(#cali27, #cali27-enc, #cali27-pie) .conv { padding-block: var(--air-m) var(--air-l); align-items: end; }
@media (min-width: 900px) { :is(#cali27, #cali27-enc, #cali27-pie) .conv__head { grid-column: c 1 / span 6; } }
/* Botón a la izquierda y los dos enlaces apilados a su derecha (en una fila, «Inscribe tu trabajo» quedaba solo abajo).
   Desde 1100 px: más angosto, «Formatos académicos» se partiría en dos líneas. */
@media (min-width: 1100px) {
  :is(#cali27, #cali27-enc, #cali27-pie) .conv__head .actions { display: grid; grid-template-columns: auto auto; justify-content: start; justify-items: start; column-gap: 32px; row-gap: 10px; }
  :is(#cali27, #cali27-enc, #cali27-pie) .conv__head .actions .btn { grid-row: span 2; }
}

/* C8 · Fechador. */
:is(#cali27, #cali27-enc, #cali27-pie) .fechador { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px clamp(16px, 3vw, 40px); margin: 40px 0 0; padding: 0; list-style: none; }
@media (min-width: 900px) { :is(#cali27, #cali27-enc, #cali27-pie) .fechador { grid-column: c 8 / content-end; align-self: end; margin: 0; } }
:is(#cali27, #cali27-enc, #cali27-pie) .fechador__item { display: flex; flex-direction: column; align-items: flex-start; color: var(--azul); }
:is(#cali27, #cali27-enc, #cali27-pie) .fechador__next { font-size: .8125rem; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: var(--rojo); margin-bottom: 6px; }
:is(#cali27, #cali27-enc, #cali27-pie) .fechador__d { font-size: clamp(3.25rem, 4vw + 1rem, 6.25rem); font-weight: 600; line-height: .78; font-variant-numeric: lining-nums; }
:is(#cali27, #cali27-enc, #cali27-pie) .fechador__m { margin-top: 10px; padding: 3px 0; border-block: 1.5px solid currentColor; font-size: .8125rem; font-weight: 700; letter-spacing: .16em; }
:is(#cali27, #cali27-enc, #cali27-pie) .fechador__l { margin-top: 10px; font-size: .9375rem; line-height: 1.3; color: var(--azul-80); }
:is(#cali27, #cali27-enc, #cali27-pie) .fechador__item.is-next { color: var(--rojo); }
:is(#cali27, #cali27-enc, #cali27-pie) .fechador__item.is-past .fechador__d { color: var(--azul-60); }

/* C9 · Álbum de concursos. */
:is(#cali27, #cali27-enc, #cali27-pie) .album { display: grid; grid-template-columns: 1fr 1fr; gap: 44px 18px; margin: var(--air-m) 0 0; padding: 0; list-style: none; }
:is(#cali27, #cali27-enc, #cali27-pie) .album__item:nth-child(even) { margin-top: 36px; }
@supports (grid-template-columns: subgrid) {
  @media (min-width: 900px) {
    :is(#cali27, #cali27-enc, #cali27-pie) .album { grid-template-columns: subgrid; row-gap: 64px; }
    :is(#cali27, #cali27-enc, #cali27-pie) .album__item:nth-child(1) { grid-column: c 1 / span 3; margin-top: 0; }
    :is(#cali27, #cali27-enc, #cali27-pie) .album__item:nth-child(2) { grid-column: c 4 / span 3; margin-top: 88px; }
    :is(#cali27, #cali27-enc, #cali27-pie) .album__item:nth-child(3) { grid-column: c 7 / span 3; margin-top: 28px; }
    :is(#cali27, #cali27-enc, #cali27-pie) .album__item:nth-child(4) { grid-column: c 10 / span 3; margin-top: 120px; }
    :is(#cali27, #cali27-enc, #cali27-pie) .album__item:nth-child(5) { grid-column: c 2 / span 3; margin-top: -40px; }
    :is(#cali27, #cali27-enc, #cali27-pie) .album__item:nth-child(6) { grid-column: c 5 / span 3; margin-top: 40px; }
    :is(#cali27, #cali27-enc, #cali27-pie) .album__item:nth-child(7) { grid-column: c 9 / span 3; margin-top: 8px; }
  }
}
@supports not (grid-template-columns: subgrid) { @media (min-width: 900px) { :is(#cali27, #cali27-enc, #cali27-pie) .album { grid-template-columns: repeat(4, 1fr); } } }
:is(#cali27, #cali27-enc, #cali27-pie) .album__item:nth-child(4n+1) .stamp { --rot: -1.2deg; }
:is(#cali27, #cali27-enc, #cali27-pie) .album__item:nth-child(4n+2) .stamp { --rot: .8deg; }
:is(#cali27, #cali27-enc, #cali27-pie) .album__item:nth-child(4n+3) .stamp { --rot: -.5deg; }
:is(#cali27, #cali27-enc, #cali27-pie) .album__item:nth-child(4n) .stamp { --rot: 1.4deg; }
:is(#cali27, #cali27-enc, #cali27-pie) .album__link { display: flex; flex-direction: column; gap: 6px; text-decoration: none; height: 100%; }
:is(#cali27, #cali27-enc, #cali27-pie) .album__link .stamp { margin-bottom: 12px; transition: rotate .45s var(--ease-in), translate .45s var(--ease-in); }
:is(#cali27, #cali27-enc, #cali27-pie) .album__link:is(:hover, :focus-visible) .stamp { rotate: 0deg; translate: 0 -6px; }
:is(#cali27, #cali27-enc, #cali27-pie) .album__link:is(:hover, :focus-visible) .album__name { text-decoration: underline; text-decoration-thickness: 1.5px; text-underline-offset: .18em; }
:is(#cali27, #cali27-enc, #cali27-pie) .album__group { font-size: .8125rem; font-weight: 600; letter-spacing: .12em; text-transform: uppercase; color: var(--azul-80); }
:is(#cali27, #cali27-enc, #cali27-pie) .album__name { font-size: 1.25rem; font-weight: 600; line-height: 1.2; }

/* C10 · Dorso de postal: el First World Congress of Perioperative Medicine es el «destinatario», intacto. */
:is(#cali27, #cali27-enc, #cali27-pie) .peri { padding-block: var(--air-m) var(--air-l); }
:is(#cali27, #cali27-enc, #cali27-pie) .postcard {
  position: relative; background: var(--papel); padding: 72px clamp(32px, 4.5vw, 64px) 56px; display: grid; gap: 40px;
  border: 1.5px solid var(--azul); outline: 1px solid var(--azul); outline-offset: -9px;
}
:is(#cali27, #cali27-enc, #cali27-pie) .postcard__corner { position: absolute; width: 34px; height: 37px; background: url("assets/Ornamento_Esquina_Azul.svg") center / contain no-repeat; pointer-events: none; }
:is(#cali27, #cali27-enc, #cali27-pie) .postcard__corner--tl { top: 16px; left: 16px; }
:is(#cali27, #cali27-enc, #cali27-pie) .postcard__corner--tr { top: 16px; right: 16px; transform: scaleX(-1); }
:is(#cali27, #cali27-enc, #cali27-pie) .postcard__corner--bl { bottom: 16px; left: 16px; transform: scaleY(-1); }
:is(#cali27, #cali27-enc, #cali27-pie) .postcard__corner--br { bottom: 16px; right: 16px; transform: rotate(180deg); }
:is(#cali27, #cali27-enc, #cali27-pie) .postcard__caption { position: absolute; top: 26px; inset-inline: 0; margin: 0; display: flex; align-items: center; justify-content: center; gap: 14px; text-align: center; font-size: .75rem; font-weight: 600; letter-spacing: .34em; text-transform: uppercase; color: var(--azul-80); }
:is(#cali27, #cali27-enc, #cali27-pie) .postcard__caption::before, :is(#cali27, #cali27-enc, #cali27-pie) .postcard__caption::after { content: ""; width: 48px; height: 5px; border-block: 1px solid currentColor; }
:is(#cali27, #cali27-enc, #cali27-pie) .postcard__msg .lead { margin-bottom: 0; }
:is(#cali27, #cali27-enc, #cali27-pie) .postcard__addr { display: flex; flex-direction: column; border-top: 1px solid var(--line-strong); padding-top: 32px; }
:is(#cali27, #cali27-enc, #cali27-pie) .postcard__franking { position: relative; align-self: flex-end; width: 220px; height: 140px; margin-bottom: 40px; }
:is(#cali27, #cali27-enc, #cali27-pie) .postcard__franking .stamp--bird { position: absolute; right: 0; top: 0; width: 104px; --rot: 3deg; }
:is(#cali27, #cali27-enc, #cali27-pie) .postcard__franking .pm { width: 124px; left: 14px; top: 16px; --rot: -14deg; z-index: 1; }
:is(#cali27, #cali27-enc, #cali27-pie) .postcard__logo { margin: 0; }
:is(#cali27, #cali27-enc, #cali27-pie) .postcard__logo--real img { width: 200px; height: auto; }
@media (min-width: 700px) { :is(#cali27, #cali27-enc, #cali27-pie) .postcard__logo--real img { width: clamp(320px, 30vw, 380px); } }
:is(#cali27, #cali27-enc, #cali27-pie) .postcard__lines { margin: 40px 0 0; padding: 0; list-style: none; }
:is(#cali27, #cali27-enc, #cali27-pie) .postcard__lines li { border-bottom: 1px solid var(--line-strong); padding: 12px 0 5px; font-style: italic; color: var(--azul-profundo); }
@media (min-width: 1000px) {
  :is(#cali27, #cali27-enc, #cali27-pie) .postcard { grid-column: c 2 / span 10; grid-template-columns: minmax(0, 1fr) minmax(369px, 1fr); gap: 0; }
  :is(#cali27, #cali27-enc, #cali27-pie) .postcard__msg { padding-right: 48px; align-self: end; }
  :is(#cali27, #cali27-enc, #cali27-pie) .postcard__addr { border-top: 0; padding: 0 0 0 48px; border-left: 1px solid var(--line-strong); }
}

/* C10b · La postal del First World Congress of Perioperative Medicine llega «de otra hoja de estilos»: los colores
   de su logotipo (magenta, morado y ciruela) sobre lavanda, sus paneles inclinados, su línea de pulso, borde de
   correo aéreo en sus colores y tipografía sin serifa (Montserrat, cercana a la del logotipo). */
:is(#cali27, #cali27-enc, #cali27-pie) .postcard--wcpm {
  --wcpm-magenta: #EC2474; --wcpm-morado: #5E439B; --wcpm-ciruela: #580A47; --wcpm-lavanda: #F4EEF6;
  --wcpm-font: "Montserrat", "Segoe UI", system-ui, sans-serif;
  overflow: hidden; background: var(--wcpm-lavanda); color: var(--wcpm-ciruela);
  border: 2px solid var(--wcpm-morado); outline: 1px solid var(--wcpm-magenta); outline-offset: -12px;
  padding-block: 84px 72px;
}
:is(#cali27, #cali27-enc, #cali27-pie) .wcpm-edge { position: absolute; inset-inline: 0; height: 14px; background: url("assets/WCPM_Borde.svg") 0 0 / 56px 14px repeat-x; pointer-events: none; }
:is(#cali27, #cali27-enc, #cali27-pie) .wcpm-edge--top { top: 0; }
:is(#cali27, #cali27-enc, #cali27-pie) .wcpm-edge--bottom { bottom: 0; background-position: 28px 0; }
/* Paneles del símbolo: tres planos inclinados que se multiplican donde se cruzan (como en el logotipo). */
:is(#cali27, #cali27-enc, #cali27-pie) .wcpm-panels { position: absolute; left: -36px; bottom: -70px; width: 230px; height: 260px; pointer-events: none; opacity: .16; }
:is(#cali27, #cali27-enc, #cali27-pie) .wcpm-panels span { position: absolute; bottom: 0; width: 34%; height: 78%; transform: skewY(-27deg); transform-origin: 0 100%; mix-blend-mode: multiply; }
:is(#cali27, #cali27-enc, #cali27-pie) .wcpm-panels span:nth-child(1) { left: 0; background: var(--wcpm-magenta); }
:is(#cali27, #cali27-enc, #cali27-pie) .wcpm-panels span:nth-child(2) { left: 25%; height: 100%; background: var(--wcpm-morado); }
:is(#cali27, #cali27-enc, #cali27-pie) .wcpm-panels span:nth-child(3) { left: 59%; background: var(--wcpm-magenta); }
:is(#cali27, #cali27-enc, #cali27-pie) .postcard--wcpm .postcard__caption { top: 32px; font-family: var(--wcpm-font); font-weight: 700; letter-spacing: .3em; color: var(--wcpm-morado); }
:is(#cali27, #cali27-enc, #cali27-pie) .postcard--wcpm .postcard__caption::before, :is(#cali27, #cali27-enc, #cali27-pie) .postcard--wcpm .postcard__caption::after { width: 40px; height: 8px; border: 0; background: url("assets/WCPM_Borde.svg") 0 0 / 28px 8px repeat-x; }
:is(#cali27, #cali27-enc, #cali27-pie) .postcard--wcpm .postcard__msg { position: relative; z-index: 1; }
:is(#cali27, #cali27-enc, #cali27-pie) .postcard--wcpm .eyebrow { font-family: var(--wcpm-font); font-weight: 800; letter-spacing: .16em; color: var(--wcpm-morado); }
:is(#cali27, #cali27-enc, #cali27-pie) .postcard--wcpm .peri__name { font-family: var(--wcpm-font); font-weight: 800; color: var(--wcpm-morado); text-transform: uppercase; }
:is(#cali27, #cali27-enc, #cali27-pie) .postcard--wcpm .lead { font-family: var(--wcpm-font); font-weight: 500; font-size: 1.0625rem; line-height: 1.65; color: var(--wcpm-ciruela); }
:is(#cali27, #cali27-enc, #cali27-pie) .wcpm-pulse { display: block; height: 40px; margin: 28px 0 20px; background: url("assets/WCPM_Pulso.svg") center / 100% 100% no-repeat; }
:is(#cali27, #cali27-enc, #cali27-pie) .btn--wcpm { --fill: var(--wcpm-morado); --ink: var(--wcpm-magenta); color: var(--wcpm-lavanda); font-family: var(--wcpm-font); font-weight: 700; font-size: .875rem; letter-spacing: .12em; border-radius: 0; }
:is(#cali27, #cali27-enc, #cali27-pie) .btn--wcpm::before { border-radius: 0; }
:is(#cali27, #cali27-enc, #cali27-pie) .postcard--wcpm .postcard__addr { position: relative; z-index: 1; border-color: rgba(94, 67, 155, .35); }
:is(#cali27, #cali27-enc, #cali27-pie) .postcard--wcpm .postcard__lines li { font-family: var(--wcpm-font); font-style: normal; font-weight: 600; font-size: .9375rem; letter-spacing: .06em; text-transform: uppercase; color: var(--wcpm-ciruela); border-color: rgba(94, 67, 155, .35); }
:is(#cali27, #cali27-enc, #cali27-pie) .postcard--wcpm .postcard__franking .stamp--wcpm { position: absolute; right: 0; top: 0; width: 112px; --rot: 3deg; }
:is(#cali27, #cali27-enc, #cali27-pie) .postcard--wcpm .postcard__franking .pm { width: 124px; left: -8px; top: 26px; --rot: -12deg; z-index: 1; }
:is(#cali27, #cali27-enc, #cali27-pie) .stamp--wcpm { --plate: var(--wcpm-lavanda); --edge-c: var(--wcpm-magenta); }
:is(#cali27, #cali27-enc, #cali27-pie) .stamp--wcpm .stamp__face { aspect-ratio: 1; display: grid; place-items: center; padding: 10px; border-color: var(--wcpm-morado); }
:is(#cali27, #cali27-enc, #cali27-pie) .stamp--wcpm .stamp__face img { width: 100%; height: 100%; object-fit: contain; }
:is(#cali27, #cali27-enc, #cali27-pie) .stamp--wcpm .stamp__legend { font-family: var(--wcpm-font); font-weight: 800; letter-spacing: .1em; color: var(--wcpm-magenta); }
:is(#cali27, #cali27-enc, #cali27-pie) .pm--wcpm { color: var(--wcpm-magenta); }
:is(#cali27, #cali27-enc, #cali27-pie) .pm--wcpm text { font-family: var(--wcpm-font); font-weight: 800; }
@media (min-width: 1000px) {
  :is(#cali27, #cali27-enc, #cali27-pie) .postcard--wcpm .postcard__addr { border-left-color: rgba(94, 67, 155, .35); }
}
@media (max-width: 999px) { :is(#cali27, #cali27-enc, #cali27-pie) .wcpm-panels { width: 150px; height: 170px; bottom: -50px; } }
@media (forced-colors: active) {
  :is(#cali27, #cali27-enc, #cali27-pie) .wcpm-panels, :is(#cali27, #cali27-enc, #cali27-pie) .wcpm-edge { display: none; }
}

/* C11 · Noticias como postales con foto. */
:is(#cali27, #cali27-enc, #cali27-pie) .newsx { padding-block: var(--air-m) var(--air-l); }
:is(#cali27, #cali27-enc, #cali27-pie) .photo-card { display: block; background: var(--papel); padding: 12px 12px 36px; border: 1px solid var(--line-strong); margin-bottom: 18px; rotate: var(--rot, 0deg); transition: rotate .45s var(--ease-in), translate .45s var(--ease-in); }
:is(#cali27, #cali27-enc, #cali27-pie) .photo-card .ph, :is(#cali27, #cali27-enc, #cali27-pie) .photo-card .media { margin: 0; }
:is(#cali27, #cali27-enc, #cali27-pie) .news:nth-child(odd) .photo-card { --rot: -1.2deg; }
:is(#cali27, #cali27-enc, #cali27-pie) .news:nth-child(even) .photo-card { --rot: 1deg; }
:is(#cali27, #cali27-enc, #cali27-pie) a.news__link:is(:hover, :focus-visible) .photo-card { rotate: 0deg; translate: 0 -6px; }
/* En Inicio la cabecera va sobre el carrusel (C17); empieza en c 2 porque la Inscripción, justo antes, empieza en c 1. */
@media (min-width: 900px) { :is(#cali27, #cali27-enc, #cali27-pie) .newsx__head { grid-column: c 2 / span 7; } }

/* C16 · Identidad: el ringlete sangra por el borde izquierdo; el semitono se resuelve al entrar. */
:is(#cali27, #cali27-enc, #cali27-pie) .idt { padding-block: var(--air-m) var(--air-l); align-items: center; overflow-x: clip; }
:is(#cali27, #cali27-enc, #cali27-pie) .idt__art { width: 108%; margin-left: -14%; }
:is(#cali27, #cali27-enc, #cali27-pie) .idt__art img { width: 100%; height: auto; }
@media (min-width: 900px) {
  :is(#cali27, #cali27-enc, #cali27-pie) .idt__art { grid-column: full-start / c 8; width: max(min(780px, 60vw), calc(100% + 48px)); max-width: none; margin-left: 0; justify-self: end; }
  :is(#cali27, #cali27-enc, #cali27-pie) .idt__text { grid-column: c 8 / content-end; }
}
/* Después de Identidad, Programa no necesita el aire extra (--air-xl) que pedía la antigua sección azul. */
:is(#cali27, #cali27-enc, #cali27-pie) .idt + .prog { padding-top: var(--air-l); }
:is(#cali27, #cali27-enc, #cali27-pie) .semitono { position: relative; }

/* Ringlete: con una ráfaga, las aspas dan una vuelta alrededor de su eje (centro de la imagen). */
:is(#cali27, #cali27-enc, #cali27-pie) .ringlete { position: relative; display: block; aspect-ratio: 1; overflow: clip; } /* las esquinas de la imagen girada no desbordan; las aspas caben en el círculo inscrito */
:is(#cali27, #cali27-enc, #cali27-pie) .ringlete img { position: absolute; inset: 0; width: 100%; height: 100%; }
:is(#cali27, #cali27-enc, #cali27-pie) .ringlete__aspas { transform-origin: 50% 50%; }
html.mov :is(#cali27, #cali27-enc, #cali27-pie) .ringlete { cursor: pointer; }
@keyframes rafaga { from { transform: rotate(0); } to { transform: rotate(360deg); } }
html.mov :is(#cali27, #cali27-enc, #cali27-pie) .ringlete.is-gust .ringlete__aspas { animation: rafaga 4.2s cubic-bezier(.4, .05, .2, 1) both; }

html.mov :is(#cali27, #cali27-enc, #cali27-pie) .semitono::before, html.mov :is(#cali27, #cali27-enc, #cali27-pie) .semitono::after { content: ""; position: absolute; inset: -2px; pointer-events: none; z-index: 1; }
html.mov :is(#cali27, #cali27-enc, #cali27-pie) .semitono::before { background: radial-gradient(circle, #0000 0 2.3px, var(--papel) 2.8px) 0 0 / 7px 7px; }
html.mov :is(#cali27, #cali27-enc, #cali27-pie) .semitono::after { background: radial-gradient(circle, #0000 0 1.1px, var(--papel) 1.6px) 0 0 / 3.5px 3.5px; opacity: 0; }
html.mov :is(#cali27, #cali27-enc, #cali27-pie) .semitono.is-in::before { animation: semitono-grueso 1.2s linear forwards; }
html.mov :is(#cali27, #cali27-enc, #cali27-pie) .semitono.is-in::after { animation: semitono-fino 1.2s linear forwards; }
@keyframes semitono-grueso { 0%, 33% { opacity: 1; } 34%, 100% { opacity: 0; } }
@keyframes semitono-fino { 0%, 33% { opacity: 0; } 34%, 67% { opacity: 1; } 68%, 100% { opacity: 0; } }

/* Sede: paisaje a sangre + postal Papel con estampilla (nada se coloca sobre el paisaje). */
:is(#cali27, #cali27-enc, #cali27-pie) .landscape--home { position: relative; background: var(--papel); overflow: clip; }
:is(#cali27, #cali27-enc, #cali27-pie) .landscape--home .landscape__img { position: relative; width: 100%; height: auto; aspect-ratio: 1920 / 1083; object-fit: cover; }
:is(#cali27, #cali27-enc, #cali27-pie) .sede-card { position: relative; background: var(--papel); border: 1px solid var(--line); padding: clamp(32px, 4vw, 48px) clamp(24px, 3.4vw, 44px); margin-top: -64px; }
:is(#cali27, #cali27-enc, #cali27-pie) .sede-card .h2 { margin-bottom: 14px; }
:is(#cali27, #cali27-enc, #cali27-pie) .sede-card :is(.eyebrow, .h2) { padding-right: 92px; }
:is(#cali27, #cali27-enc, #cali27-pie) .sede-card__stamp { position: absolute; top: -22px; right: -14px; width: 96px; --rot: 3deg; }
:is(#cali27, #cali27-enc, #cali27-pie) .sede-card__lines { margin: 22px 0 0; padding: 0; list-style: none; }
:is(#cali27, #cali27-enc, #cali27-pie) .sede-card__lines li { border-bottom: 1px solid var(--line-strong); padding: 10px 0 4px; font-style: italic; color: var(--azul-profundo); }
@media (min-width: 900px) {
  :is(#cali27, #cali27-enc, #cali27-pie) .landscape--home { min-height: 680px; background: var(--azul); }
  :is(#cali27, #cali27-enc, #cali27-pie) .landscape--home .landscape__img { position: absolute; inset: 0; height: 100%; aspect-ratio: auto; scale: 1.06; }
  :is(#cali27, #cali27-enc, #cali27-pie) .landscape--home .landscape__wrap { position: relative; padding-block: clamp(72px, 9vw, 128px); }
  :is(#cali27, #cali27-enc, #cali27-pie) .sede-card { grid-column: c 1 / span 5; margin-top: 0; }
}

/* C12 · Sobres (Industria / Contacto); el de correo aéreo aparece una sola vez por página. */
:is(#cali27, #cali27-enc, #cali27-pie) .duo2 { padding-block: var(--air-m) var(--air-xl); row-gap: 48px; }
:is(#cali27, #cali27-enc, #cali27-pie) .envelope { position: relative; background: var(--papel); border: 1px solid var(--azul); margin-top: 40px; }
:is(#cali27, #cali27-enc, #cali27-pie) .envelope__body { position: relative; padding: 112px clamp(24px, 3vw, 44px) 36px; background: var(--papel); }
:is(#cali27, #cali27-enc, #cali27-pie) .envelope__body > :last-child { margin-bottom: 0; }
/* Solapa (28 oct 2026, 21:23): se abre en 3D hacia arriba, despacio, en Papel con filete Azul por las dos caras (antes
   se aplastaba con scaleY y el filete era Azul 40 %). */
:is(#cali27, #cali27-enc, #cali27-pie) .envelope__flap { position: absolute; z-index: 1; inset: 0 0 auto; height: 84px; transform-origin: 50% 0; transform: perspective(700px) rotateX(0deg); transition: transform .55s cubic-bezier(.45, .05, .25, 1); pointer-events: none; }
:is(#cali27, #cali27-enc, #cali27-pie) .envelope__flap::before, :is(#cali27, #cali27-enc, #cali27-pie) .envelope__flap::after { content: ""; position: absolute; inset: 0; clip-path: polygon(0 0, 100% 0, 50% 100%); }
:is(#cali27, #cali27-enc, #cali27-pie) .envelope__flap::before { background: var(--azul); }
:is(#cali27, #cali27-enc, #cali27-pie) .envelope__flap::after { background: var(--papel); clip-path: polygon(1.5px 0, calc(100% - 1.5px) 0, 50% calc(100% - 1.5px)); }
:is(#cali27, #cali27-enc, #cali27-pie) .envelope:is(:hover, :focus-within) .envelope__flap { transform: perspective(700px) rotateX(155deg); }
@media (prefers-reduced-motion: reduce) { :is(#cali27, #cali27-enc, #cali27-pie) .envelope__flap { transition: none; } }
:is(#cali27, #cali27-enc, #cali27-pie) .envelope--air { border: 0; padding: 10px; background: url("assets/Franja_Correo_Aereo.svg") 0 0 / 28px 28px; }
:is(#cali27, #cali27-enc, #cali27-pie) .envelope--air .envelope__body { padding-top: 102px; }
:is(#cali27, #cali27-enc, #cali27-pie) .envelope--air .envelope__flap { inset: 10px 10px auto; }
:is(#cali27, #cali27-enc, #cali27-pie) .envelope__label { position: absolute; z-index: 2; top: -18px; right: clamp(20px, 4vw, 48px); rotate: 3deg; margin: 0; background: var(--azul); padding: 4px; }
:is(#cali27, #cali27-enc, #cali27-pie) .envelope__label span { display: block; padding: 5px 14px; border: 1px solid var(--papel); color: var(--papel); font-size: .8125rem; font-weight: 700; letter-spacing: .16em; text-transform: uppercase; }
@media (max-width: 899px) { :is(#cali27, #cali27-enc, #cali27-pie) .duo2__b { margin-left: 24px; } }
@media (min-width: 900px) {
  :is(#cali27, #cali27-enc, #cali27-pie) .duo2__a { grid-column: c 2 / span 5; grid-row: 1; align-self: start; }
  :is(#cali27, #cali27-enc, #cali27-pie) .duo2__b { grid-column: c 8 / span 5; grid-row: 1; margin-top: 112px; align-self: start; }
}

/* Cabeceras internas: el lado de escritura de una postal (texto | franqueo + ilustración). */
:is(#cali27, #cali27-enc, #cali27-pie) .page-head { position: relative; padding-block: clamp(36px, 5vw, 64px) var(--air-s); border-bottom: 0; }
:is(#cali27, #cali27-enc, #cali27-pie) .page-head__grid { row-gap: 32px; align-items: end; }
:is(#cali27, #cali27-enc, #cali27-pie) .page-head__post { display: flex; flex-direction: column; align-items: flex-end; gap: 24px; }
:is(#cali27, #cali27-enc, #cali27-pie) .franking { position: relative; width: 236px; height: 150px; flex: none; }
:is(#cali27, #cali27-enc, #cali27-pie) .franking .stamp--bird { position: absolute; right: 0; top: 0; width: 108px; --rot: 3deg; }
:is(#cali27, #cali27-enc, #cali27-pie) .franking .pm { width: 140px; left: 6px; top: 22px; --rot: -12deg; z-index: 1; }
@media (min-width: 900px) {
  :is(#cali27, #cali27-enc, #cali27-pie) .page-head__text { grid-column: c 1 / span 7; }
  :is(#cali27, #cali27-enc, #cali27-pie) .page-head__post { grid-column: c 9 / content-end; border-left: 1px solid var(--line-strong); padding-left: clamp(24px, 3vw, 48px); align-self: stretch; justify-content: space-between; }
}
@media (max-width: 899px) {
  :is(#cali27, #cali27-enc, #cali27-pie) .page-head--franked .page-head__text { padding-top: 84px; }
  :is(#cali27, #cali27-enc, #cali27-pie) .page-head--franked .franking { position: absolute; top: 20px; right: var(--gutter); width: 150px; height: 100px; }
  :is(#cali27, #cali27-enc, #cali27-pie) .franking .stamp__legend { display: none; }
  :is(#cali27, #cali27-enc, #cali27-pie) .franking .stamp--bird { width: 76px; }
  :is(#cali27, #cali27-enc, #cali27-pie) .franking .pm { width: 96px; left: 0; top: 14px; }
}

/* Páginas internas: secciones separadas por aire, no por filetes. */
:is(#cali27, #cali27-enc, #cali27-pie) .section--air { padding-block: var(--air-m); }
:is(#cali27, #cali27-enc, #cali27-pie) .section--air + .section--air { padding-top: 0; }
:is(#cali27, #cali27-enc, #cali27-pie) .reg--page { padding-bottom: var(--air-m); }
:is(#cali27, #cali27-enc, #cali27-pie) .reg--page .reg__text { padding-top: var(--air-s); }
@media (min-width: 1000px) { :is(#cali27, #cali27-enc, #cali27-pie) .reg--page .reg__stamp { margin-top: var(--air-s); align-self: start; } }
:is(#cali27, #cali27-enc, #cali27-pie) .news-grid { grid-template-columns: minmax(0, 1fr); gap: 56px 48px; } /* minmax(0, …): una palabra larga no ensancha la columna */
@media (min-width: 900px) {
  :is(#cali27, #cali27-enc, #cali27-pie) .news-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  :is(#cali27, #cali27-enc, #cali27-pie) .news-grid > :nth-child(even) { margin-top: 96px; }
}
:is(#cali27, #cali27-enc, #cali27-pie) .duo2--sede { padding-block: var(--air-m); }
:is(#cali27, #cali27-enc, #cali27-pie) .duo2--sede .ph { margin-bottom: 24px; }
:is(#cali27, #cali27-enc, #cali27-pie) .envelope--compact { margin-top: 40px; max-width: 420px; }
:is(#cali27, #cali27-enc, #cali27-pie) .envelope--compact .envelope__body { padding-top: 96px; }
:is(#cali27, #cali27-enc, #cali27-pie) .cierre { padding-block: var(--air-l); overflow: clip; }
:is(#cali27, #cali27-enc, #cali27-pie) main > .section--azul:last-child { margin-bottom: var(--air-s); }
:is(#cali27, #cali27-enc, #cali27-pie) .cierre > .wrap { position: relative; z-index: 1; }

/* Mapa de la sede: marco de postal (sin inclinar, es interactivo). */
:is(#cali27, #cali27-enc, #cali27-pie) .map-card { margin: 0; background: var(--papel); border: 1px solid var(--line-strong); padding: 12px 12px 16px; width: 100%; }
:is(#cali27, #cali27-enc, #cali27-pie) .map-card__frame { position: relative; height: 280px; background: var(--azul-10); }
@media (min-width: 480px) { :is(#cali27, #cali27-enc, #cali27-pie) .map-card__frame { height: auto; aspect-ratio: 4 / 3; } }
:is(#cali27, #cali27-enc, #cali27-pie) .map-card__frame iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; filter: sepia(.22) saturate(.9); } /* el mapa se entibia hacia el Papel */
:is(#cali27, #cali27-enc, #cali27-pie) .map-card__caption { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: 8px 20px; padding: 14px 4px 0; }
:is(#cali27, #cali27-enc, #cali27-pie) .map-card__place { font-weight: 600; }
:is(#cali27, #cali27-enc, #cali27-pie) .map-card__sub { display: block; font-weight: 400; font-size: .9375rem; color: var(--azul-80); }
@media (min-width: 900px) {
  :is(#cali27, #cali27-enc, #cali27-pie) .split--map { grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); }
  :is(#cali27, #cali27-enc, #cali27-pie) .map-card__frame { aspect-ratio: 16 / 10; }
}

/* ------------------------------------------------------------------ movimiento postal
   Un solo interruptor (html.mov): sin JS o con «reducir movimiento» todo se ve en su estado final impreso. */
@keyframes pega { 0% { opacity: 0; transform: translateY(-24px) rotate(-6deg) scale(1.05); } 70% { opacity: 1; transform: translateY(2px) rotate(.6deg); } 100% { opacity: 1; transform: none; } }
@keyframes sella { 0% { opacity: 0; transform: scale(1.32) rotate(-6deg); } 55% { opacity: 1; transform: scale(.97) rotate(1deg); } 100% { opacity: 1; transform: none; } }
@keyframes ondea { to { stroke-dashoffset: 0; } }
@keyframes entinta { 0% { opacity: 0; transform: scale(1.6); } 45% { opacity: 1; transform: scale(.95); } 70% { transform: scale(1.02); } 100% { opacity: 1; transform: none; } }
@keyframes alimenta { from { opacity: 0; transform: translateX(6%); } to { opacity: 1; transform: none; } }
@keyframes fecha { 0% { opacity: 0; transform: scale(1.25); } 60% { opacity: 1; transform: scale(.98); } 100% { opacity: 1; transform: none; } }

html.mov :is(#cali27, #cali27-enc, #cali27-pie) :is([data-anim="pega"], [data-anim="entinta"], [data-anim="alimenta"], [data-anim="fecha"], [data-anim="sube"]):not(.is-in) { opacity: 0; }
html.mov :is(#cali27, #cali27-enc, #cali27-pie) [data-anim="pega"].is-in { animation: pega .7s var(--ease-stamp) both; }
html.mov :is(#cali27, #cali27-enc, #cali27-pie) [data-anim="sube"].is-in { animation: sube .5s var(--ease-in) both; }
html.mov :is(#cali27, #cali27-enc, #cali27-pie) [data-anim="entinta"].is-in { animation: entinta .6s var(--ease-stamp) .15s both; }
html.mov :is(#cali27, #cali27-enc, #cali27-pie) [data-anim="alimenta"].is-in { animation: alimenta .9s var(--ease-in) both; }
html.mov :is(#cali27, #cali27-enc, #cali27-pie) [data-anim="fecha"].is-in { animation: fecha .45s var(--ease-stamp) both; }
html.mov :is(#cali27, #cali27-enc, #cali27-pie) .pm:not(.is-in) .pm__ring { opacity: 0; }
html.mov :is(#cali27, #cali27-enc, #cali27-pie) .pm.is-in .pm__ring { animation: sella .55s var(--ease-stamp) both; }
html.mov :is(#cali27, #cali27-enc, #cali27-pie) .pm .pm__waves path { stroke-dasharray: 1 2; stroke-dashoffset: 1.01; }
html.mov :is(#cali27, #cali27-enc, #cali27-pie) .pm.is-in .pm__waves path { animation: ondea 1s var(--ease-draw) .35s forwards; }
html.mov :is(#cali27, #cali27-enc, #cali27-pie) .pm.is-in .pm__waves path:nth-child(2) { animation-delay: .42s; }
html.mov :is(#cali27, #cali27-enc, #cali27-pie) .pm.is-in .pm__waves path:nth-child(3) { animation-delay: .49s; }
html.mov :is(#cali27, #cali27-enc, #cali27-pie) .pm.is-in .pm__waves path:nth-child(4) { animation-delay: .56s; }
html.mov :is(#cali27, #cali27-enc, #cali27-pie) .coil__cell:nth-child(2) { animation-delay: 80ms; }
html.mov :is(#cali27, #cali27-enc, #cali27-pie) .coil__cell:nth-child(3) { animation-delay: 160ms; }
html.mov :is(#cali27, #cali27-enc, #cali27-pie) .coil__cell:nth-child(4) { animation-delay: 240ms; }
html.mov :is(#cali27, #cali27-enc, #cali27-pie) .album__item:nth-child(2) .stamp { animation-delay: 90ms; }
html.mov :is(#cali27, #cali27-enc, #cali27-pie) .album__item:nth-child(3) .stamp { animation-delay: 180ms; }
html.mov :is(#cali27, #cali27-enc, #cali27-pie) .album__item:nth-child(4) .stamp { animation-delay: 270ms; }
html.mov :is(#cali27, #cali27-enc, #cali27-pie) .album__item:nth-child(5) .stamp { animation-delay: 360ms; }
html.mov :is(#cali27, #cali27-enc, #cali27-pie) .album__item:nth-child(6) .stamp { animation-delay: 450ms; }
html.mov :is(#cali27, #cali27-enc, #cali27-pie) .album__item:nth-child(7) .stamp { animation-delay: 540ms; }
html.mov :is(#cali27, #cali27-enc, #cali27-pie) .fechador__item:nth-child(2) { animation-delay: 120ms; }
html.mov :is(#cali27, #cali27-enc, #cali27-pie) .fechador__item:nth-child(3) { animation-delay: 240ms; }
html.mov :is(#cali27, #cali27-enc, #cali27-pie) .modlist--escalera li:nth-child(2) { animation-delay: 80ms; }
html.mov :is(#cali27, #cali27-enc, #cali27-pie) .modlist--escalera li:nth-child(3) { animation-delay: 160ms; }
html.mov :is(#cali27, #cali27-enc, #cali27-pie) .modlist--escalera li:nth-child(4) { animation-delay: 240ms; }
html.mov :is(#cali27, #cali27-enc, #cali27-pie) .modlist--escalera li:nth-child(5) { animation-delay: 320ms; }
html.mov :is(#cali27, #cali27-enc, #cali27-pie) .hero__stamp.is-in { animation-delay: .9s; }
html.mov :is(#cali27, #cali27-enc, #cali27-pie) .pres .stamp--count.is-in { animation-delay: .45s; }
html.mov :is(#cali27, #cali27-enc, #cali27-pie) .stages--sheet .stages__item:nth-child(2) { animation-delay: 80ms; }
html.mov :is(#cali27, #cali27-enc, #cali27-pie) .stages--sheet .stages__item:nth-child(3) { animation-delay: 160ms; }
html.mov :is(#cali27, #cali27-enc, #cali27-pie) .stages--sheet .stages__item:nth-child(4) { animation-delay: 240ms; }
/* primera visita: la portada espera a que termine la introducción */
html.has-intro :is(#cali27, #cali27-enc, #cali27-pie) :is(.hero, .coil-wrap) :is([data-anim], .hero__maceta, .hero__flock, .hero__aspas) { animation-play-state: paused !important; }

/* Foco Oro en los nuevos fondos Azul */
:is(#cali27, #cali27-enc, #cali27-pie) .pres :focus-visible, :is(#cali27, #cali27-enc, #cali27-pie) .nov__sheet :focus-visible, :is(#cali27, #cali27-enc, #cali27-pie) .stages__item--featured :focus-visible { outline-color: var(--oro); }

/* C7 · Pliego de etapas (Inscripciones): cuatro estampillas unidas; la etapa cerrada recibe un matasellos. */
:is(#cali27, #cali27-enc, #cali27-pie) .stages--sheet { display: grid; gap: 14px; border: 0; margin: 0; padding: 0; list-style: none; }
:is(#cali27, #cali27-enc, #cali27-pie) .stages--sheet .stages__item { display: flex; flex-direction: column; gap: 6px; padding: 28px 26px 26px; border: 0; margin: 0; }
:is(#cali27, #cali27-enc, #cali27-pie) .stages--sheet .stages__n { font-size: 2.25rem; font-weight: 700; line-height: 1; color: var(--azul-60); margin: 0; }
:is(#cali27, #cali27-enc, #cali27-pie) .stages--sheet .stages__name { margin: 0; font-size: 1.5rem; font-weight: 700; line-height: 1.1; text-transform: uppercase; letter-spacing: .02em; }
:is(#cali27, #cali27-enc, #cali27-pie) .stages--sheet .stages__msg { margin: 0; font-style: italic; color: var(--rojo); }
:is(#cali27, #cali27-enc, #cali27-pie) .stages--sheet .stages__dates { margin: 0; font-size: 1.0625rem; color: var(--azul-profundo); }
:is(#cali27, #cali27-enc, #cali27-pie) .stages__item--featured { --plate: var(--azul); --edge-c: var(--azul); color: var(--papel); }
:is(#cali27, #cali27-enc, #cali27-pie) .stages__item--featured::after { outline: 1.5px solid var(--oro); outline-offset: -10px; }
:is(#cali27, #cali27-enc, #cali27-pie) .stages__item--featured :is(.stages__n, .stages__msg) { color: var(--oro); }
:is(#cali27, #cali27-enc, #cali27-pie) .stages__item--featured .stages__dates { color: var(--papel); }
:is(#cali27, #cali27-enc, #cali27-pie) .stages__now, :is(#cali27, #cali27-enc, #cali27-pie) .stages__closed, :is(#cali27, #cali27-enc, #cali27-pie) .stages__cancel { display: none; }
:is(#cali27, #cali27-enc, #cali27-pie) .stages__item.is-current .stages__now { display: inline-block; align-self: flex-start; }
:is(#cali27, #cali27-enc, #cali27-pie) .stages__item.is-past .stages__closed { display: block; margin: 0; font-size: .8125rem; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: var(--azul-80); }
:is(#cali27, #cali27-enc, #cali27-pie) .stages__item.is-past :is(.stages__name, .stages__dates) { color: var(--azul-80); }
:is(#cali27, #cali27-enc, #cali27-pie) .stages__item.is-past .stages__cancel { display: block; position: absolute; top: 14px; right: 10px; width: min(46%, 150px); color: var(--azul); }
:is(#cali27, #cali27-enc, #cali27-pie) .stages__item--featured.is-past .stages__cancel { color: var(--oro); }
@media (min-width: 700px) and (max-width: 999px) { :is(#cali27, #cali27-enc, #cali27-pie) .stages__item--featured .stages__cancel { width: 30%; } }
:is(#cali27, #cali27-enc, #cali27-pie) .stages__item--featured.is-past .stages__closed, :is(#cali27, #cali27-enc, #cali27-pie) .stages__item--featured.is-past :is(.stages__name, .stages__dates) { color: var(--papel); }
@media (min-width: 700px) { :is(#cali27, #cali27-enc, #cali27-pie) .stages--sheet { grid-template-columns: 1fr 1fr; } :is(#cali27, #cali27-enc, #cali27-pie) .stages--sheet .stages__item--featured { grid-column: span 2; } }
@media (min-width: 1000px) {
  :is(#cali27, #cali27-enc, #cali27-pie) .stages--sheet { grid-template-columns: 1.5fr 1fr 1fr 1fr; align-items: start; }
  :is(#cali27, #cali27-enc, #cali27-pie) .stages--sheet .stages__item--featured { grid-column: auto; margin-top: -24px; }
}

/* Convocatorias (página): fotos de concursos como estampillas. */
:is(#cali27, #cali27-enc, #cali27-pie) .entry__stamp { align-self: start; }
:is(#cali27, #cali27-enc, #cali27-pie) .entry:nth-child(odd) .entry__stamp { --rot: -.8deg; }
:is(#cali27, #cali27-enc, #cali27-pie) .entry:nth-child(even) .entry__stamp { --rot: .6deg; }

/* Modalidades: los íconos van en platos Papel (obligatorio sobre Azul). */
:is(#cali27, #cali27-enc, #cali27-pie) .modfull__icon.stamp--icon { width: 80px; }
@media (max-width: 420px) { :is(#cali27, #cali27-enc, #cali27-pie) .modfull__icon.stamp--icon { width: 56px; padding: 7px; } }

/* Seguridad: si «reducir movimiento» cambia durante la visita, todo queda en su estado final. */
@media (prefers-reduced-motion: reduce) {
  html.mov :is(#cali27, #cali27-enc, #cali27-pie) :is([data-anim], .reveal, .pm__ring) { opacity: 1 !important; transform: none !important; }
  html.mov :is(#cali27, #cali27-enc, #cali27-pie) .pm__waves path { stroke-dasharray: none !important; stroke-dashoffset: 0 !important; }
  html.mov :is(#cali27, #cali27-enc, #cali27-pie) .semitono::before, html.mov :is(#cali27, #cali27-enc, #cali27-pie) .semitono::after { display: none !important; }
  :is(#cali27, #cali27-enc, #cali27-pie) [data-drift], :is(#cali27, #cali27-enc, #cali27-pie) [data-sway] { translate: none !important; rotate: none !important; }
  :is(#cali27, #cali27-enc, #cali27-pie) .pm[data-turn] { --turn: 0deg !important; }
}
@media print {
  :is(#cali27, #cali27-enc, #cali27-pie) .pm, :is(#cali27, #cali27-enc, #cali27-pie) .franking, :is(#cali27, #cali27-enc, #cali27-pie) .perf-edge, :is(#cali27, #cali27-enc, #cali27-pie) .frame-oro, :is(#cali27, #cali27-enc, #cali27-pie) .pres__ill, :is(#cali27, #cali27-enc, #cali27-pie) .slot__box { display: none !important; }
  /* al imprimir antes de desplazarse, todo sale en su estado final */
  html.mov :is(#cali27, #cali27-enc, #cali27-pie) :is([data-anim], .reveal, .pm__ring) { opacity: 1 !important; transform: none !important; animation: none !important; }
  html.mov :is(#cali27, #cali27-enc, #cali27-pie) .filete { transform: none !important; animation: none !important; }
  html.mov :is(#cali27, #cali27-enc, #cali27-pie) .pm__waves path { stroke-dasharray: none !important; stroke-dashoffset: 0 !important; }
  html.mov :is(#cali27, #cali27-enc, #cali27-pie) .semitono::before, html.mov :is(#cali27, #cali27-enc, #cali27-pie) .semitono::after { display: none !important; }
}
/* Alto contraste de Windows: los logotipos a color conservan un plato claro */
@media (forced-colors: active) {
  :is(#cali27, #cali27-enc, #cali27-pie) .brand, :is(#cali27, #cali27-enc, #cali27-pie) .hero__logo, :is(#cali27, #cali27-enc, #cali27-pie) .postcard__logo, :is(#cali27, #cali27-enc, #cali27-pie) .plate-firma { forced-color-adjust: none; background: #F8EFE1; padding: 6px; }
  :is(#cali27, #cali27-enc, #cali27-pie) .plate-firma--blanca { background: var(--azul); } /* la firma blanca conserva su fondo Azul */
}

/* ------------------------------------------------------------------ isotipo y movimiento */

:is(#cali27, #cali27-enc, #cali27-pie) .iso { width: 100%; }
:is(#cali27, #cali27-enc, #cali27-pie) .iso .iso-aspa, :is(#cali27, #cali27-enc, #cali27-pie) .iso .iso-ave, :is(#cali27, #cali27-enc, #cali27-pie) .iso .iso-eje { transform-box: view-box; transform-origin: var(--iso-hub-x) var(--iso-hub-y); }

@keyframes gira { from { transform: rotate(0); } to { transform: rotate(360deg); } }
@keyframes gira-entra { from { transform: rotate(-150deg) scale(.4); opacity: 0; } to { transform: none; opacity: 1; } }
@keyframes posa {
  0% { transform: translate(-22px, -46px) rotate(-6deg); opacity: 0; }
  60% { transform: translate(0, 4px) rotate(1deg); opacity: 1; }
  80% { transform: translate(0, -2px); }
  100% { transform: none; opacity: 1; }
}
@keyframes late { 0% { transform: scale(1); } 25% { transform: scale(1.07); } 50% { transform: scale(.98); } 75% { transform: scale(1.03); } 100% { transform: scale(1); } }
@keyframes traza { from { transform: scaleX(0); } to { transform: scaleX(1); } }
@keyframes sube { from { opacity: 0; transform: translateY(18px); } to { opacity: 1; transform: none; } }
@keyframes vuela { from { opacity: 0; transform: translate(-28px, 18px); } to { opacity: 1; transform: none; } }

:is(#cali27, #cali27-enc, #cali27-pie) .brand:is(:hover, :focus-visible) .iso-aspa, :is(#cali27, #cali27-enc, #cali27-pie) .spin-button.is-spinning .iso-aspa { animation: gira 1s var(--ease-draw); }

html.mov :is(#cali27, #cali27-enc, #cali27-pie) .reveal:not(.is-visible) { opacity: 0; transform: translateY(18px); }
html.mov :is(#cali27, #cali27-enc, #cali27-pie) .reveal.is-visible { animation: sube .5s var(--ease-in) forwards; }
html.mov :is(#cali27, #cali27-enc, #cali27-pie) .filete { transform: scaleX(0); animation: traza 1s var(--ease-draw) .2s forwards; }
html.mov :is(#cali27, #cali27-enc, #cali27-pie) .hero__flock { animation: vuela 1.2s var(--ease-in) .5s both; }
html.mov :is(#cali27, #cali27-enc, #cali27-pie) .hero__maceta { animation: sube .9s var(--ease-in) .1s both; }

/* Introducción (primera visita): las aspas giran hasta su sitio, el ave se posa, el eje late. */
:is(#cali27, #cali27-enc, #cali27-pie) .intro { display: none; }
html.has-intro :is(#cali27, #cali27-enc, #cali27-pie) .intro { display: grid; place-items: center; position: fixed; inset: 0; z-index: 200; background: var(--papel); transition: opacity .5s ease; }
html.has-intro :is(#cali27, #cali27-enc, #cali27-pie) .intro.is-done { opacity: 0; pointer-events: none; }
html.has-intro body { overflow: hidden; }
:is(#cali27, #cali27-enc, #cali27-pie) .intro__mark { width: min(46vw, 240px); }
:is(#cali27, #cali27-enc, #cali27-pie) .intro__mark .iso { overflow: visible; }
html.has-intro :is(#cali27, #cali27-enc, #cali27-pie) .intro .iso-aspa { opacity: 0; animation: gira-entra .8s var(--ease-in) forwards; }
html.has-intro :is(#cali27, #cali27-enc, #cali27-pie) .intro .iso-aspa--1 { animation-delay: .10s; }
html.has-intro :is(#cali27, #cali27-enc, #cali27-pie) .intro .iso-aspa--2 { animation-delay: .20s; }
html.has-intro :is(#cali27, #cali27-enc, #cali27-pie) .intro .iso-aspa--3 { animation-delay: .30s; }
html.has-intro :is(#cali27, #cali27-enc, #cali27-pie) .intro .iso-aspa--4 { animation-delay: .40s; }
html.has-intro :is(#cali27, #cali27-enc, #cali27-pie) .intro .iso-aspa--5 { animation-delay: .50s; }
html.has-intro :is(#cali27, #cali27-enc, #cali27-pie) .intro .iso-aspa--6 { animation-delay: .60s; }
html.has-intro :is(#cali27, #cali27-enc, #cali27-pie) .intro .iso-aspa--7 { animation-delay: .70s; }
html.has-intro :is(#cali27, #cali27-enc, #cali27-pie) .intro .iso-aspa--8 { animation-delay: .80s; }
html.has-intro :is(#cali27, #cali27-enc, #cali27-pie) .intro .iso-ave { opacity: 0; animation: posa .9s var(--ease-in) 1.15s forwards; }
html.has-intro :is(#cali27, #cali27-enc, #cali27-pie) .intro .iso-eje { opacity: 0; animation: sube .01s linear 1.9s forwards, late .5s ease 1.9s; }
:is(#cali27, #cali27-enc, #cali27-pie) .intro__skip { position: absolute; right: 20px; bottom: 20px; background: none; border: 1px solid var(--azul); border-radius: var(--radius); padding: 8px 14px; cursor: pointer; font-size: .9375rem; }

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  :is(#cali27, #cali27-enc, #cali27-pie) *, :is(#cali27, #cali27-enc, #cali27-pie), :is(#cali27, #cali27-enc, #cali27-pie) *::before, :is(#cali27, #cali27-enc, #cali27-pie)::before, :is(#cali27, #cali27-enc, #cali27-pie) *::after, :is(#cali27, #cali27-enc, #cali27-pie)::after { animation: none !important; transition: none !important; }
  html.has-intro :is(#cali27, #cali27-enc, #cali27-pie) .intro { display: none !important; }
  html.has-intro body { overflow: auto; }
}

@media print {
  :is(#cali27, #cali27-enc, #cali27-pie) .site-header, :is(#cali27, #cali27-enc, #cali27-pie) .topbar, :is(#cali27, #cali27-enc, #cali27-pie) .intro { display: none !important; }
  :is(#cali27, #cali27-enc, #cali27-pie) { background: var(--papel); }
}

/* Etiquetas de redes (recomendaciones 13 oct 2026) */
:is(#cali27, #cali27-enc, #cali27-pie) .hero__tags, :is(#cali27, #cali27-enc, #cali27-pie) .reg__tags { font-weight: 600; letter-spacing: .04em; color: var(--azul); margin: 12px 0 0; }
:is(#cali27, #cali27-enc, #cali27-pie) .hero__id { margin: 16px 0 0; }

/* ------------------------------------------------------------------ menú con submenús (recomendaciones 13 oct 2026) */

:is(#cali27, #cali27-enc, #cali27-pie) .nav-group__row { display: flex; align-items: center; }
:is(#cali27, #cali27-enc, #cali27-pie) .nav-group__toggle { display: inline-flex; align-items: center; justify-content: center; background: none; border: 0; padding: 6px; cursor: pointer; color: inherit; }
:is(#cali27, #cali27-enc, #cali27-pie) .nav-group__toggle::before {
  content: ""; width: 7px; height: 7px; border-right: 1.5px solid currentColor; border-bottom: 1.5px solid currentColor;
  transform: translateY(-2px) rotate(45deg); transition: transform .2s ease;
}
:is(#cali27, #cali27-enc, #cali27-pie) .nav-group.is-open .nav-group__toggle::before { transform: translateY(2px) rotate(-135deg); }
:is(#cali27, #cali27-enc, #cali27-pie) .nav-sub { list-style: none; margin: 0; padding: 0; display: none; }
:is(#cali27, #cali27-enc, #cali27-pie) .nav-group.is-open > .nav-sub { display: block; }
:is(#cali27, #cali27-enc, #cali27-pie) .site-nav__list .nav-group.is-current > .nav-group__row > a { color: var(--rojo); }
html:not(.js) :is(#cali27, #cali27-enc, #cali27-pie) .nav-group__toggle, html:not(.js) :is(#cali27, #cali27-enc, #cali27-pie) .nav-sub { display: none; }

@media (max-width: 1199px) {
  html.js :is(#cali27, #cali27-enc, #cali27-pie) .nav-group__row { border-bottom: 1px solid var(--line); }
  html.js :is(#cali27, #cali27-enc, #cali27-pie) .nav-group__row > a { flex: 1; border-bottom: 0; }
  html.js :is(#cali27, #cali27-enc, #cali27-pie) .nav-group__toggle { width: 48px; height: 48px; }
  html.js :is(#cali27, #cali27-enc, #cali27-pie) .nav-sub { padding: 4px 0 12px; border-bottom: 1px solid var(--line); }
  html.js :is(#cali27, #cali27-enc, #cali27-pie) .site-nav__list .nav-sub a { font-size: 1.125rem; padding: 9px 0 9px 20px; border-bottom: 0; }
}
@media (min-width: 1200px) {
  :is(#cali27, #cali27-enc, #cali27-pie) .site-nav__list > li { position: relative; }
  :is(#cali27, #cali27-enc, #cali27-pie) .nav-group__toggle { padding: 8px 0 8px 7px; }
  :is(#cali27, #cali27-enc, #cali27-pie) .nav-sub {
    position: absolute; top: 100%; left: -20px; z-index: 45; width: max-content; min-width: 230px; max-width: 320px;
    background: var(--papel); border: 1.5px solid var(--azul); border-top: 3px solid var(--oro); padding: 8px 20px 10px;
  }
  :is(#cali27, #cali27-enc, #cali27-pie) .nav-group:hover > .nav-sub { display: block; }
  :is(#cali27, #cali27-enc, #cali27-pie) .site-nav__list .nav-sub a { font-size: 1rem; white-space: normal; padding: 8px 0; }
  :is(#cali27, #cali27-enc, #cali27-pie) .site-nav__list .nav-sub li + li { border-top: 1px solid var(--line); }
}

/* ------------------------------------------------------------------ conferencistas */

:is(#cali27, #cali27-enc, #cali27-pie) .spk-filters { display: grid; gap: 14px 18px; grid-template-columns: 1fr; align-items: end; margin: 8px 0 14px; }
@media (min-width: 640px) { :is(#cali27, #cali27-enc, #cali27-pie) .spk-filters { grid-template-columns: 1fr 1fr; } :is(#cali27, #cali27-enc, #cali27-pie) .spk-filter--q { grid-column: 1 / -1; } }
@media (min-width: 1000px) { :is(#cali27, #cali27-enc, #cali27-pie) .spk-filters { grid-template-columns: 2fr 1.3fr 1fr 1fr auto; } :is(#cali27, #cali27-enc, #cali27-pie) .spk-filter--q { grid-column: auto; } }
:is(#cali27, #cali27-enc, #cali27-pie) .spk-filter { display: flex; flex-direction: column; gap: 6px; font-size: .8125rem; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; color: var(--azul); }
:is(#cali27, #cali27-enc, #cali27-pie) .spk-filter input, :is(#cali27, #cali27-enc, #cali27-pie) .spk-filter select {
  font: inherit; font-size: 1.0625rem; font-weight: 400; letter-spacing: 0; text-transform: none;
  min-height: 46px; padding: 8px 12px; border: 1.5px solid var(--azul); border-radius: var(--radius); background: var(--papel); color: var(--azul);
}
:is(#cali27, #cali27-enc, #cali27-pie) .spk-count { font-size: .9375rem; color: var(--azul-80); margin: 0 0 18px; }
html:not(.js) :is(#cali27, #cali27-enc, #cali27-pie) .spk-filters, html:not(.js) :is(#cali27, #cali27-enc, #cali27-pie) .spk-count { display: none; }
:is(#cali27, #cali27-enc, #cali27-pie) .spk-grid { list-style: none; margin: 0; padding: 0; display: grid; gap: 22px; grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); }
:is(#cali27, #cali27-enc, #cali27-pie) .spk { display: flex; flex-direction: column; gap: 6px; padding: 20px; border: 1px solid var(--line); border-radius: var(--radius); }
:is(#cali27, #cali27-enc, #cali27-pie) .spk[hidden], :is(#cali27, #cali27-enc, #cali27-pie) .spk-empty[hidden] { display: none; }
:is(#cali27, #cali27-enc, #cali27-pie) .spk__photo {
  width: 84px; height: 84px; border-radius: 50%; border: 1.5px solid var(--azul); overflow: hidden; margin-bottom: 6px;
  display: grid; place-items: center; font-size: 1.5rem; font-weight: 600; letter-spacing: .04em; color: var(--azul);
}
:is(#cali27, #cali27-enc, #cali27-pie) .spk__photo img { width: 100%; height: 100%; object-fit: cover; }
:is(#cali27, #cali27-enc, #cali27-pie) .spk__name { font-size: 1.25rem; line-height: 1.2; margin: 0; }
:is(#cali27, #cali27-enc, #cali27-pie) .spk__meta { margin: 0; font-size: .9375rem; color: var(--azul-80); }
:is(#cali27, #cali27-enc, #cali27-pie) .spk__topics { margin: 0; font-size: .875rem; color: var(--rojo); }
:is(#cali27, #cali27-enc, #cali27-pie) .spk__bio { margin-top: 6px; }
:is(#cali27, #cali27-enc, #cali27-pie) .spk__bio summary { cursor: pointer; font-weight: 600; font-size: .9375rem; color: var(--azul); }
:is(#cali27, #cali27-enc, #cali27-pie) .spk__bio p { margin: 8px 0 0; font-size: .9375rem; }
:is(#cali27, #cali27-enc, #cali27-pie) .spk-empty { font-style: italic; color: var(--azul-80); }

/* ------------------------------------------------------------------ en escena */

:is(#cali27, #cali27-enc, #cali27-pie) .escena-grid { display: grid; gap: 28px; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); margin-bottom: 32px; }
:is(#cali27, #cali27-enc, #cali27-pie) #la-sede, :is(#cali27, #cali27-enc, #cali27-pie) #alojamiento, :is(#cali27, #cali27-enc, #cali27-pie) #transporte, :is(#cali27, #cali27-enc, #cali27-pie) #cali, :is(#cali27, #cali27-enc, #cali27-pie) #agenda, :is(#cali27, #cali27-enc, #cali27-pie) #perioperatorio, :is(#cali27, #cali27-enc, #cali27-pie) #inauguracion, :is(#cali27, #cali27-enc, #cali27-pie) #familias, :is(#cali27, #cali27-enc, #cali27-pie) #cultura { scroll-margin-top: 140px; }

/* ------------------------------------------------------------------ ajustes 13 oct 2026 (comentarios de Martín) */

/* Cabecera: isotipo con marco junto al logotipo */
:is(#cali27, #cali27-enc, #cali27-pie) .brand { display: flex; align-items: center; gap: 12px; }
:is(#cali27, #cali27-enc, #cali27-pie) .brand__marco { width: 50px; height: auto; flex: none; }
@media (min-width: 600px) { :is(#cali27, #cali27-enc, #cali27-pie) .brand__marco { width: 74px; } }
@media (min-width: 1200px) and (max-width: 1299px) { :is(#cali27, #cali27-enc, #cali27-pie) .brand__marco { width: 62px; } :is(#cali27, #cali27-enc, #cali27-pie) .brand__logotipo { width: 140px; } }

/* Presentación: De / Para más grandes */
:is(#cali27, #cali27-enc, #cali27-pie) .pres__route { gap: 22px 52px; }
:is(#cali27, #cali27-enc, #cali27-pie) .pres__route dt { font-size: 1.0625rem; }
:is(#cali27, #cali27-enc, #cali27-pie) .pres__route dd { font-size: clamp(1.5rem, 1vw + 1.1rem, 1.875rem); min-width: 11em; }

/* Creyentes más pequeña, con botón; etapas siguientes como estampillas */
:is(#cali27, #cali27-enc, #cali27-pie) .reg__stamps { position: relative; z-index: 2; margin-top: 48px; }
:is(#cali27, #cali27-enc, #cali27-pie) .reg__stamps .reg__stamp { margin-top: 0; }
@media (min-width: 1000px) {
  :is(#cali27, #cali27-enc, #cali27-pie) .reg__stamps { grid-column: c 7 / span 5; grid-row: 1; margin-top: calc(-1 * var(--straddle)); align-self: start; }
  :is(#cali27, #cali27-enc, #cali27-pie) .reg__stamps .reg__stamp { grid-column: auto; grid-row: auto; }
}
:is(#cali27, #cali27-enc, #cali27-pie) .reg__stamps .creyentes { padding: 40px 28px 52px; }
:is(#cali27, #cali27-enc, #cali27-pie) .reg__stamps .creyentes__name { font-size: clamp(1.75rem, 2vw + .9rem, 2.75rem); }
:is(#cali27, #cali27-enc, #cali27-pie) .reg__stamps .creyentes__msg { font-size: clamp(1.0625rem, .4vw + .95rem, 1.25rem); margin-bottom: 18px; }
:is(#cali27, #cali27-enc, #cali27-pie) .reg__stamps .creyentes__corner { width: 30px; height: 33px; }
:is(#cali27, #cali27-enc, #cali27-pie) .creyentes__cta { margin: 0 0 16px; }
:is(#cali27, #cali27-enc, #cali27-pie) .stage-stamps { list-style: none; margin: 22px 0 0; padding: 0; display: grid; gap: 12px; grid-template-columns: repeat(auto-fit, minmax(128px, 1fr)); }
:is(#cali27, #cali27-enc, #cali27-pie) .stage-stamp { --perf: 5px; --plate: var(--papel); --edge-c: var(--azul-40); text-align: center; }
:is(#cali27, #cali27-enc, #cali27-pie) .stage-stamp__face { position: relative; z-index: 1; border: 1.5px solid var(--azul); padding: 16px 8px 14px; height: 100%; }
:is(#cali27, #cali27-enc, #cali27-pie) .stage-stamp__n { margin: 0 0 6px; font-size: .6875rem; font-weight: 600; letter-spacing: .14em; text-transform: uppercase; color: var(--rojo); }
:is(#cali27, #cali27-enc, #cali27-pie) .stage-stamp__name { margin: 0 0 6px; font-size: 1.1875rem; font-weight: 700; letter-spacing: .02em; text-transform: uppercase; line-height: 1.05; color: var(--azul); }
:is(#cali27, #cali27-enc, #cali27-pie) .stage-stamp__date { margin: 0; font-size: .875rem; line-height: 1.3; }

/* Convocatorias (Inicio): el ave lleva una carta con todas las fechas de las convocatorias (antes en Novedades).
   --ave es el ancho del ave: el hilo sale de sus patas (≈ 55 % del ancho, 84 % del alto) y se esconde bajo la carta. */
:is(#cali27, #cali27-enc, #cali27-pie) .carrier { --ave: 120px; position: relative; z-index: 1; display: flex; flex-direction: column; align-items: center; width: min(100%, 320px); margin: 48px auto 0; }
:is(#cali27, #cali27-enc, #cali27-pie) .carrier__bird { position: relative; z-index: 1; width: var(--ave); height: auto; margin: 0; }
:is(#cali27, #cali27-enc, #cali27-pie) .carrier__string { position: absolute; top: calc(var(--ave) * .84); left: calc(50% + var(--ave) * .05); width: 0; height: calc(var(--ave) * .26 + 20px); border-left: 1.5px solid var(--azul); }
:is(#cali27, #cali27-enc, #cali27-pie) .carrier__letter {
  position: relative; width: 100%; margin-top: 18px; background: var(--papel); color: var(--azul);
  border: 1.5px solid var(--azul); outline: 1px solid var(--azul); outline-offset: 3px; padding: 16px 18px 14px; rotate: -3deg;
}
:is(#cali27, #cali27-enc, #cali27-pie) .carrier__kicker { margin: 0 0 10px; font-size: .75rem; font-weight: 600; letter-spacing: .12em; text-transform: uppercase; color: var(--rojo); }
:is(#cali27, #cali27-enc, #cali27-pie) .carrier__dates { margin: 0; }
:is(#cali27, #cali27-enc, #cali27-pie) .carrier__dates div { padding: 6px 0; border-top: 1px solid var(--line); }
:is(#cali27, #cali27-enc, #cali27-pie) .carrier__dates dt { font-size: .8125rem; color: var(--azul-80); }
:is(#cali27, #cali27-enc, #cali27-pie) .carrier__dates dd { margin: 0; font-weight: 600; font-size: .9375rem; line-height: 1.25; }
@media (min-width: 1000px) {
  /* el hueco del antiguo fechador: a la derecha del texto, centrada en la fila (.conv alinea abajo) */
  :is(#cali27, #cali27-enc, #cali27-pie) .conv__carrier { --ave: 150px; grid-column: c 8 / content-end; grid-row: 1; align-self: center; justify-self: center; width: min(100%, 330px); margin: 0; }
}

/* Convocatorias: botón por categoría y por modalidad */
:is(#cali27, #cali27-enc, #cali27-pie) .group__cta { margin: 0 0 0 auto; }
:is(#cali27, #cali27-enc, #cali27-pie) .group__head { flex-wrap: wrap; }
:is(#cali27, #cali27-enc, #cali27-pie) .modfull__body p { margin: 0; }
:is(#cali27, #cali27-enc, #cali27-pie) .modfull__body .modfull__cta { margin-top: 16px; }
:is(#cali27, #cali27-enc, #cali27-pie) .download--inline { display: inline-flex; flex-direction: column; }
@media (min-width: 1000px) { :is(#cali27, #cali27-enc, #cali27-pie) .nov__sheet { grid-row: 1; } }

/* ------------------------------------------------------------------ noticias: carrusel, lista y artículo (13 oct 2026) */

/* Imágenes de las noticias: se ven tal cual (sin duotono). Las ilustraciones con transparencia (media--plate, lo decide
   build.mjs) van sueltas sobre el Papel, sin plato ni marco de postal (21 oct 2026: el plato no es de la marca). */
:is(#cali27, #cali27-enc, #cali27-pie) .media--plate { background: none; }
:is(#cali27, #cali27-enc, #cali27-pie) .media--plate img { object-fit: contain; padding: 4%; }
:is(#cali27, #cali27-enc, #cali27-pie) .photo-card:has(.media--plate) { background: none; border-color: transparent; }

/* C17 · Carrusel de noticias (Inicio): una postal por noticia (imagen | dorso con fecha, título y enlace).
   Sin JS es una tira horizontal con «scroll-snap»: se desliza, asoma la siguiente postal y los controles siguen ocultos.
   app.js añade .is-ready (controles visibles, sin barra de desplazamiento) y .is-paused (icono «Reproducir»).
   Los controles van antes que las postales en el código y también en pantalla. */
:is(#cali27, #cali27-enc, #cali27-pie) .newsx__carousel { margin-top: clamp(28px, 3.5vw, 44px); }
:is(#cali27, #cali27-enc, #cali27-pie) .carousel__controls { display: flex; flex-wrap: wrap; align-items: center; justify-content: flex-end; gap: 8px; margin-bottom: 18px; }
:is(#cali27, #cali27-enc, #cali27-pie) .carousel__btn {
  position: relative; display: inline-flex; align-items: center; justify-content: center; gap: 10px; min-width: 44px; min-height: 44px; padding: 0;
  background: none; border: 1.5px solid var(--azul); border-radius: var(--radius); color: var(--azul); cursor: pointer;
  font-size: .8125rem; font-weight: 600; line-height: 1; letter-spacing: .12em; text-transform: uppercase;
}
:is(#cali27, #cali27-enc, #cali27-pie) .carousel__btn:hover { background: var(--azul); color: var(--papel); }
:is(#cali27, #cali27-enc, #cali27-pie) .carousel__icon { display: block; flex: none; }
/* Pausar: dos barras; Reproducir (en pausa): triángulo. Flechas: el mismo ángulo de los submenús. */
:is(#cali27, #cali27-enc, #cali27-pie) .carousel__btn--pause .carousel__icon { width: 12px; height: 14px; border-inline: 4px solid currentColor; }
:is(#cali27, #cali27-enc, #cali27-pie) .carousel.is-paused .carousel__btn--pause .carousel__icon { width: 12px; border: 0; background: currentColor; clip-path: polygon(0 0, 100% 50%, 0 100%); translate: 1px 0; }
:is(#cali27, #cali27-enc, #cali27-pie) .carousel__btn--prev .carousel__icon, :is(#cali27, #cali27-enc, #cali27-pie) .carousel__btn--next .carousel__icon { width: 10px; height: 10px; border-right: 2px solid currentColor; border-bottom: 2px solid currentColor; }
:is(#cali27, #cali27-enc, #cali27-pie) .carousel__btn--prev .carousel__icon { transform: translateX(2px) rotate(135deg); }
:is(#cali27, #cali27-enc, #cali27-pie) .carousel__btn--next .carousel__icon { transform: translateX(-2px) rotate(-45deg); }
/* En un teléfono «Pausar / Reproducir» queda como icono; el texto sigue siendo el nombre del botón. */
@media (max-width: 479px) {
  :is(#cali27, #cali27-enc, #cali27-pie) .carousel__btn--pause { padding: 0; }
  :is(#cali27, #cali27-enc, #cali27-pie) .carousel__btn--pause .carousel__label { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
}
/* Puntos: estampillas pequeñas con perforación; la actual es Oro y queda «pegada» con un leve giro. */
:is(#cali27, #cali27-enc, #cali27-pie) .carousel__dots { display: flex; flex-wrap: wrap; }
:is(#cali27, #cali27-enc, #cali27-pie) .carousel__dot { position: relative; width: 44px; height: 44px; padding: 0; background: none; border: 0; border-radius: var(--radius); cursor: pointer; }
:is(#cali27, #cali27-enc, #cali27-pie) .carousel__dot::before {
  content: ""; position: absolute; left: 50%; top: 50%; width: 14px; height: 18px; margin: -9px 0 0 -7px;
  background: var(--papel); border: 1.5px solid var(--azul-60); outline: 1px dotted var(--azul-40); outline-offset: 2px;
}
:is(#cali27, #cali27-enc, #cali27-pie) .carousel__dot:hover::before { background: var(--azul-20); border-color: var(--azul); }
:is(#cali27, #cali27-enc, #cali27-pie) .carousel__dot[aria-current="true"]::before { background: var(--oro); border-color: var(--azul); rotate: -6deg; }
html.mov :is(#cali27, #cali27-enc, #cali27-pie) .carousel__dot::before { transition: background-color .2s ease, rotate .35s var(--ease-stamp); }

:is(#cali27, #cali27-enc, #cali27-pie) .carousel__viewport { position: relative; }
:is(#cali27, #cali27-enc, #cali27-pie) .carousel__track {
  position: relative; display: flex; gap: var(--col-gap); overflow-x: auto; overscroll-behavior-x: contain;
  scroll-snap-type: x mandatory; scrollbar-width: thin; scrollbar-color: var(--azul-40) transparent;
}
:is(#cali27, #cali27-enc, #cali27-pie) .carousel__slide { flex: 0 0 100%; min-width: 0; scroll-snap-align: start; scroll-snap-stop: always; }
html:not(.js) :is(#cali27, #cali27-enc, #cali27-pie) .carousel__slide { flex-basis: calc(100% - 40px); } /* sin JS asoma la postal siguiente */
html:not(.js) :is(#cali27, #cali27-enc, #cali27-pie) .carousel__slide:only-child { flex-basis: 100%; }    /* …salvo si es la única */
:is(#cali27, #cali27-enc, #cali27-pie) .carousel.is-ready .carousel__track { scrollbar-width: none; }
/* Con app.js (acta de revisión, oct 2026): la noticia actual al centro y las vecinas asoman a los lados, tenues y más
   pequeñas, como en el carrusel de postales; un clic en una vecina la trae al centro. */
:is(#cali27, #cali27-enc, #cali27-pie) .carousel.is-ready .carousel__track { --sw: min(84%, 1080px); padding-inline: calc((100% - var(--sw)) / 2); gap: clamp(14px, 2vw, 28px); }
:is(#cali27, #cali27-enc, #cali27-pie) .carousel.is-ready .carousel__slide { flex-basis: var(--sw); scroll-snap-align: center; transition: opacity .3s ease; opacity: calc(1 - .5 * var(--ad, 0)); }
:is(#cali27, #cali27-enc, #cali27-pie) .carousel.is-ready .carousel__slide:not(.is-current) { cursor: pointer; }
:is(#cali27, #cali27-enc, #cali27-pie) .carousel.is-ready .carousel__slide .news-slide { transform: scale(calc(1 - .08 * var(--ad, 0))); transform-origin: 50% 60%; }
@media (max-width: 599px) { :is(#cali27, #cali27-enc, #cali27-pie) .carousel.is-ready .carousel__track { --sw: 88%; } }
/* Barra de avance de los carruseles (5 s por postal): se llena de izquierda a derecha y se congela con las pausas. */
:is(#cali27, #cali27-enc, #cali27-pie) .car-bar { position: relative; height: 4px; margin: 14px auto 0; width: min(84%, 1080px); background: var(--azul-20); overflow: hidden; }
:is(#cali27, #cali27-enc, #cali27-pie) .car-bar--feria { width: min(var(--cw-bar, 82%), 860px); margin-top: 4px; }
:is(#cali27, #cali27-enc, #cali27-pie) .car-bar__fill { position: absolute; inset: 0; background: var(--oro); border-right: 2px solid var(--azul); transform-origin: 0 50%; scale: 0 1; }
:is(#cali27, #cali27-enc, #cali27-pie) .car-bar__fill.is-on { animation: car-progreso var(--car-ms, 5s) linear forwards; }
@keyframes car-progreso { from { scale: 0 1; } to { scale: 1 1; } }
html:not(.mov) :is(#cali27, #cali27-enc, #cali27-pie) .car-bar { display: none; }
:is(#cali27, #cali27-enc, #cali27-pie) .carousel.is-ready .carousel__track::-webkit-scrollbar { display: none; }

:is(#cali27, #cali27-enc, #cali27-pie) .news-slide {
  height: 100%; display: grid; grid-template-rows: auto 1fr; gap: 20px; padding: 16px 16px 24px;
  background: var(--papel); border: 1.5px solid var(--azul); outline: 1px solid var(--azul); outline-offset: -8px;
}
:is(#cali27, #cali27-enc, #cali27-pie) .news-slide__media { margin: 0; }
:is(#cali27, #cali27-enc, #cali27-pie) .news-slide__text { display: flex; flex-direction: column; min-width: 0; padding: 0 6px; }
:is(#cali27, #cali27-enc, #cali27-pie) .news-slide__meta { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px 16px; margin: 0 0 14px; }
:is(#cali27, #cali27-enc, #cali27-pie) .news-slide__date { font-size: .8125rem; font-weight: 600; letter-spacing: .1em; text-transform: uppercase; color: var(--rojo); }
:is(#cali27, #cali27-enc, #cali27-pie) .news-slide__count {
  flex: none; padding: 3px 7px 2px; border: 1.5px solid var(--azul); outline: 1px dotted var(--azul-40); outline-offset: 2px;
  font-size: .75rem; font-weight: 700; letter-spacing: .14em; font-variant-numeric: lining-nums tabular-nums; color: var(--azul);
}
:is(#cali27, #cali27-enc, #cali27-pie) .news-slide__title { font-size: clamp(1.5rem, 1vw + 1.15rem, 2.125rem); font-weight: 600; line-height: 1.12; margin: 0 0 12px; text-wrap: balance; overflow-wrap: break-word; }
:is(#cali27, #cali27-enc, #cali27-pie) .news-slide__summary { color: var(--azul-profundo); margin: 0 0 20px; max-width: 30em; text-wrap: pretty; overflow-wrap: anywhere; }
:is(#cali27, #cali27-enc, #cali27-pie) .news-slide__more { margin: auto 0 0; padding-top: 14px; border-top: 1px solid var(--line-strong); } /* como las líneas de dirección de la postal */
@media (min-width: 900px) {
  :is(#cali27, #cali27-enc, #cali27-pie) .news-slide { grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); grid-template-rows: none; gap: 0; padding: 24px; }
  :is(#cali27, #cali27-enc, #cali27-pie) .news-slide__media { align-self: center; }
  :is(#cali27, #cali27-enc, #cali27-pie) .news-slide__text { margin-left: clamp(28px, 3vw, 44px); padding: 10px 8px 6px clamp(28px, 3vw, 44px); border-left: 1px solid var(--line-strong); }
  :is(#cali27, #cali27-enc, #cali27-pie) .news-slide__summary { font-size: clamp(1.1875rem, .35vw + 1.05rem, 1.3125rem); }
}
/* la postal que llega recibe otra vez su número, como un fechador */
html.mov :is(#cali27, #cali27-enc, #cali27-pie) .carousel.is-ready .carousel__slide.is-current .news-slide__count { animation: fecha .45s var(--ease-stamp) .25s both; }

/* Noticias (lista y «Más noticias»): ilustraciones sobre plato; en «Más noticias» tres por fila, más pequeñas. */
:is(#cali27, #cali27-enc, #cali27-pie) .news-more { padding-top: 0; }
:is(#cali27, #cali27-enc, #cali27-pie) .news-more > .wrap::before { content: ""; display: block; margin-bottom: var(--air-s); border-top: 4px double var(--azul); }
:is(#cali27, #cali27-enc, #cali27-pie) .news-more .h2 { margin-bottom: clamp(32px, 4vw, 48px); }
:is(#cali27, #cali27-enc, #cali27-pie) .news-grid--more .news__title { font-size: 1.3125rem; }
@media (min-width: 900px) {
  :is(#cali27, #cali27-enc, #cali27-pie) .news-grid--more { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 40px 32px; }
  :is(#cali27, #cali27-enc, #cali27-pie) .news-grid--more > :nth-child(even) { margin-top: 40px; }
  :is(#cali27, #cali27-enc, #cali27-pie) .news-grid--pair { grid-template-columns: repeat(2, minmax(0, 1fr)); max-width: calc(8 * var(--col) + 7 * var(--col-gap)); } /* sin tercera columna vacía */
}

/* Artículo: el lado de escritura de la postal en la cabecera; debajo, una columna de lectura alineada con el título. */
:is(#cali27, #cali27-enc, #cali27-pie) .article__title { font-size: clamp(1.875rem, 2.4vw + 1rem, 3.25rem); }
:is(#cali27, #cali27-enc, #cali27-pie) .article__title--long { font-size: clamp(1.625rem, 1.5vw + 1rem, 2.5rem); } /* más de 60 caracteres (lo decide build.mjs) */
:is(#cali27, #cali27-enc, #cali27-pie) .article .lead { overflow-wrap: anywhere; } /* el resumen viene del editor: una dirección larga no ensancha la página */
:is(#cali27, #cali27-enc, #cali27-pie) .article__main { padding-top: clamp(8px, 2.4vw, 32px); } /* la cabecera ya deja --air-s debajo */
:is(#cali27, #cali27-enc, #cali27-pie) .article__main .wrap > * { max-width: calc(8 * var(--col) + 7 * var(--col-gap)); }
:is(#cali27, #cali27-enc, #cali27-pie) .article__media { margin: 0 0 clamp(32px, 4vw, 52px); padding: 10px; border: 1px solid var(--line-strong); }
:is(#cali27, #cali27-enc, #cali27-pie) .article__media.media--plate, :is(#cali27, #cali27-enc, #cali27-pie) .article__fig.media--plate { background-clip: content-box; } /* margen Papel alrededor de la ilustración */
:is(#cali27, #cali27-enc, #cali27-pie) .article__body { font-size: 1.25rem; color: var(--azul-profundo); overflow-wrap: break-word; }
:is(#cali27, #cali27-enc, #cali27-pie) .article__body > :first-child { margin-top: 0; }
:is(#cali27, #cali27-enc, #cali27-pie) .article__body :is(p, ul, ol, blockquote) { max-width: 36em; }
:is(#cali27, #cali27-enc, #cali27-pie) .article__body h2 {
  margin: 1.8em 0 .55em; font-size: clamp(1.375rem, .9vw + 1.05rem, 1.75rem); font-weight: 700; line-height: 1.15;
  text-transform: uppercase; letter-spacing: .02em; color: var(--azul); text-wrap: balance;
}
:is(#cali27, #cali27-enc, #cali27-pie) .article__body h2::before { content: ""; display: block; width: 48px; height: 5px; margin-bottom: 14px; border-block: 1.5px solid var(--rojo); }
:is(#cali27, #cali27-enc, #cali27-pie) .article__body h3 { margin: 1.5em 0 .45em; font-size: clamp(1.1875rem, .5vw + 1.05rem, 1.375rem); font-weight: 600; line-height: 1.2; color: var(--azul); }
:is(#cali27, #cali27-enc, #cali27-pie) .article__body h4 { margin: 1.4em 0 .4em; font-size: .9375rem; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: var(--azul); }
:is(#cali27, #cali27-enc, #cali27-pie) .article__body :is(ul, ol) { margin: 0 0 1.1em; padding-left: 1.4em; }
:is(#cali27, #cali27-enc, #cali27-pie) .article__body ul { list-style: square; }
:is(#cali27, #cali27-enc, #cali27-pie) .article__body ol { list-style: decimal; }
:is(#cali27, #cali27-enc, #cali27-pie) .article__body li { margin: .3em 0; padding-left: .2em; }
:is(#cali27, #cali27-enc, #cali27-pie) .article__body li::marker { color: var(--rojo); font-weight: 600; font-variant-numeric: lining-nums; }
:is(#cali27, #cali27-enc, #cali27-pie) .article__body blockquote { margin: 1.4em 0; padding-left: 20px; border-left: 3px solid var(--oro); font-style: italic; font-size: 1.3125rem; line-height: 1.4; color: var(--azul); }
:is(#cali27, #cali27-enc, #cali27-pie) .article__body blockquote p:last-child { margin-bottom: 0; }
:is(#cali27, #cali27-enc, #cali27-pie) .article__body a { color: var(--azul); text-decoration: underline; text-decoration-color: var(--rojo); text-decoration-thickness: 1.5px; text-underline-offset: .18em; }
:is(#cali27, #cali27-enc, #cali27-pie) .article__body a:hover { text-decoration-thickness: 2.5px; }
:is(#cali27, #cali27-enc, #cali27-pie) .article__body strong { font-weight: 700; color: var(--azul); }
:is(#cali27, #cali27-enc, #cali27-pie) .article__body code { font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; font-size: .82em; padding: .1em .35em; background: var(--azul-10); border-radius: var(--radius); overflow-wrap: anywhere; }
:is(#cali27, #cali27-enc, #cali27-pie) .article__gallery { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 220px), 1fr)); gap: 16px; align-items: start; margin: clamp(32px, 4vw, 48px) 0 0; }
:is(#cali27, #cali27-enc, #cali27-pie) .article__fig { padding: 8px; border: 1px solid var(--line-strong); }
:is(#cali27, #cali27-enc, #cali27-pie) .article__cta { margin-top: clamp(32px, 4vw, 48px); }
:is(#cali27, #cali27-enc, #cali27-pie) .article__back { margin: 28px 0 0; }

@media print {
  :is(#cali27, #cali27-enc, #cali27-pie) .carousel__controls { display: none !important; }
  :is(#cali27, #cali27-enc, #cali27-pie) .carousel__track { display: block; overflow: visible; }
  :is(#cali27, #cali27-enc, #cali27-pie) .carousel__slide { break-inside: avoid; }
  :is(#cali27, #cali27-enc, #cali27-pie) .carousel__slide + .carousel__slide { margin-top: 24px; }
  :is(#cali27, #cali27-enc, #cali27-pie) .news-slide__count { animation: none !important; }
}
/* Alto contraste de Windows: iconos y estampillas de los puntos con colores del sistema */
@media (forced-colors: active) {
  :is(#cali27, #cali27-enc, #cali27-pie) .carousel__icon, :is(#cali27, #cali27-enc, #cali27-pie) .carousel__dot::before { forced-color-adjust: none; }
  :is(#cali27, #cali27-enc, #cali27-pie) .carousel__btn--pause .carousel__icon, :is(#cali27, #cali27-enc, #cali27-pie) .carousel__btn--prev .carousel__icon, :is(#cali27, #cali27-enc, #cali27-pie) .carousel__btn--next .carousel__icon { border-color: ButtonText; }
  :is(#cali27, #cali27-enc, #cali27-pie) .carousel.is-paused .carousel__btn--pause .carousel__icon { background: ButtonText; }
  :is(#cali27, #cali27-enc, #cali27-pie) .carousel__dot::before { background: Canvas; border-color: ButtonText; outline-color: ButtonText; }
  :is(#cali27, #cali27-enc, #cali27-pie) .carousel__dot[aria-current="true"]::before { background: Highlight; border-color: Highlight; }
}

/* ------------------------------------------------------------------ mapa de la sede (mapa/)
   Botón «Mapa» fijo abajo a la izquierda en todas las páginas, diálogo con el visor y marco de la sección Industria.
   El visor (mapa/index.html) es un iframe con su propia hoja: mapa/mapa.css. */

:is(#cali27, #cali27-enc, #cali27-pie) .btn.map-fab {
  position: fixed; z-index: 30; margin: 0;
  left: max(16px, env(safe-area-inset-left, 0px));
  bottom: max(16px, env(safe-area-inset-bottom, 0px));
  gap: .5em; padding-inline: 14px 18px;
}
:is(#cali27, #cali27-enc, #cali27-pie) .map-fab__icon { width: 22px; height: 22px; flex: none; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linejoin: round; }

/* Carta del First World Congress of Perioperative Medicine: sobre en los colores de su logotipo, encima del botón
   «Mapa», que lleva a su sitio. La carta asoma del sobre una vez al cargar y sube un poco al pasar el cursor. */
:is(#cali27, #cali27-enc, #cali27-pie) .wcpm-fab {
  --wcpm-magenta: #EC2474; --wcpm-morado: #5E439B; --wcpm-ciruela: #580A47; --wcpm-lavanda: #F4EEF6;
  position: fixed; z-index: 30; display: grid; place-items: center; width: 56px; height: 56px;
  left: max(16px, env(safe-area-inset-left, 0px));
  bottom: calc(max(16px, env(safe-area-inset-bottom, 0px)) + 60px);
  background: var(--wcpm-lavanda); border: 2px solid var(--wcpm-morado); outline: 1px solid var(--wcpm-magenta); outline-offset: -6px;
  transition: transform .2s ease;
}
:is(#cali27, #cali27-enc, #cali27-pie) .wcpm-fab:hover { transform: translateY(-2px); }
:is(#cali27, #cali27-enc, #cali27-pie) .wcpm-fab:focus-visible { outline: 3px solid var(--wcpm-magenta); outline-offset: 3px; }
@media (forced-colors: active) { :is(#cali27, #cali27-enc, #cali27-pie) .wcpm-fab { forced-color-adjust: none; } }

:is(#cali27, #cali27-enc, #cali27-pie) .map-dialog {
  width: min(1440px, calc(100vw - 40px)); height: min(940px, calc(100dvh - 40px));
  max-width: none; max-height: none; margin: auto; padding: 0;
  background: var(--papel); color: var(--azul);
  border: 1.5px solid var(--azul); outline: 1px solid var(--oro); outline-offset: 4px;
}
:is(#cali27, #cali27-enc, #cali27-pie) .map-dialog[open] { display: flex; flex-direction: column; }
:is(#cali27, #cali27-enc, #cali27-pie) .map-dialog::backdrop { background: rgba(16, 36, 66, .55); }
:is(#cali27, #cali27-enc, #cali27-pie) .map-dialog__bar { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 22px; padding: 8px 10px 8px 18px; border-bottom: 2px solid var(--azul); }
:is(#cali27, #cali27-enc, #cali27-pie) .map-dialog__title { margin: 0 auto 0 0; font-size: 1.125rem; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; }
:is(#cali27, #cali27-enc, #cali27-pie) .map-dialog__full { font-size: .9375rem; }
:is(#cali27, #cali27-enc, #cali27-pie) .btn.map-dialog__close { margin: 0; }
:is(#cali27, #cali27-enc, #cali27-pie) .map-dialog__frame { flex: 1; display: block; width: 100%; min-height: 0; border: 0; background: var(--papel); }
html:has(.map-dialog[open]) { overflow: hidden; }
@media (max-width: 640px) {
  :is(#cali27, #cali27-enc, #cali27-pie) .map-dialog { width: 100vw; height: 100dvh; border: 0; outline: 0; }
  :is(#cali27, #cali27-enc, #cali27-pie) .map-dialog__full { display: none; }
}

:is(#cali27, #cali27-enc, #cali27-pie) .mapa-embed { margin: 6px; background: var(--papel); border: 1.5px solid var(--azul); outline: 1px solid var(--oro); outline-offset: 5px; }
:is(#cali27, #cali27-enc, #cali27-pie) .mapa-embed__frame { display: block; width: 100%; height: clamp(540px, 82vh, 880px); border: 0; }

@media print {
  :is(#cali27, #cali27-enc, #cali27-pie) .map-fab, :is(#cali27, #cali27-enc, #cali27-pie) .wcpm-fab, :is(#cali27, #cali27-enc, #cali27-pie) .album-fab, :is(#cali27, #cali27-enc, #cali27-pie) .map-dialog { display: none !important; }
}

/* Reestructuración (21 oct 2026): enlace de contacto en la barra superior, pie por público, industria */
:is(#cali27, #cali27-enc, #cali27-pie) .topbar__end { display: flex; align-items: center; gap: 18px; }
:is(#cali27, #cali27-enc, #cali27-pie) .topbar__link { color: var(--papel); text-decoration: none; font-size: .8125rem; letter-spacing: .02em; opacity: .85; }
:is(#cali27, #cali27-enc, #cali27-pie) .topbar__link:hover { opacity: 1; text-decoration: underline; }
@media (max-width: 599px) { :is(#cali27, #cali27-enc, #cali27-pie) .topbar__link { display: none; } }
/* Acceso al Ave del día desde todas las páginas (acta de revisión, oct 2026): pastilla Oro en la barra superior. */
:is(#cali27, #cali27-enc, #cali27-pie) .topbar__ave {
  display: inline-flex; align-items: center; gap: 6px; padding: 2px 10px 2px 4px; border-radius: 999px;
  background: var(--oro); color: var(--azul); font-size: .75rem; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; text-decoration: none;
}
:is(#cali27, #cali27-enc, #cali27-pie) .topbar__ave img { width: 22px; height: 22px; object-fit: contain; }
:is(#cali27, #cali27-enc, #cali27-pie) .topbar__ave:hover { background: var(--papel); }
html.mov :is(#cali27, #cali27-enc, #cali27-pie) .topbar__ave img { animation: ave-asoma 4s ease-in-out 3; transform-origin: 50% 90%; }
@keyframes ave-asoma { 0%, 80%, 100% { rotate: 0deg; } 85% { rotate: -14deg; } 90% { rotate: 8deg; } }
:is(#cali27, #cali27-enc, #cali27-pie) .diaria { scroll-margin-top: 120px; }
:is(#cali27, #cali27-enc, #cali27-pie) .site-nav__util { display: none; }
@media (max-width: 1199px) {
  html.js :is(#cali27, #cali27-enc, #cali27-pie) .site-nav__util { display: block; margin-top: 22px; font-size: 1.125rem; color: var(--azul); }
}
:is(#cali27, #cali27-enc, #cali27-pie) .site-footer__groups { display: grid; gap: 22px; }
:is(#cali27, #cali27-enc, #cali27-pie) .site-footer__group-title { margin: 0 0 2px; font-size: .8125rem; font-weight: 600; letter-spacing: .1em; text-transform: uppercase; color: var(--papel); opacity: .7; }
:is(#cali27, #cali27-enc, #cali27-pie) .site-footer__group .site-footer__nav li a { padding: 3px 0; }

:is(#cali27, #cali27-enc, #cali27-pie) .ind-list { margin: 0; padding-left: 1.2em; display: grid; gap: 8px; list-style: disc; }
:is(#cali27, #cali27-enc, #cali27-pie) .ind-list li::marker { color: var(--rojo); }
:is(#cali27, #cali27-enc, #cali27-pie) .ind-steps { margin: 0; padding: 0; list-style: none; counter-reset: paso; display: grid; gap: 18px; max-width: 46em; }
:is(#cali27, #cali27-enc, #cali27-pie) .ind-steps li { counter-increment: paso; display: grid; grid-template-columns: 2.4em 1fr; gap: 12px; align-items: baseline; }
:is(#cali27, #cali27-enc, #cali27-pie) .ind-steps li::before { content: counter(paso); font-size: 1.75rem; font-weight: 700; line-height: 1; color: var(--rojo); font-variant-numeric: lining-nums; }
:is(#cali27, #cali27-enc, #cali27-pie) .ind-figure { margin: 0; display: grid; gap: 6px; }
:is(#cali27, #cali27-enc, #cali27-pie) .ind-figure__num { font-size: clamp(3rem, 7vw, 4.5rem); font-weight: 700; line-height: 1; color: var(--azul); font-variant-numeric: lining-nums; }
:is(#cali27, #cali27-enc, #cali27-pie) .ind-figure__label { font-size: 1.125rem; font-weight: 600; line-height: 1.3; }
:is(#cali27, #cali27-enc, #cali27-pie) .ind-cols { display: grid; gap: 40px; margin-top: clamp(40px, 5vw, 64px); }
@media (min-width: 900px) { :is(#cali27, #cali27-enc, #cali27-pie) .ind-cols { grid-template-columns: 1fr 1fr; gap: 64px; } }
:is(#cali27, #cali27-enc, #cali27-pie) .ind-cols h3 { margin-bottom: 14px; }
:is(#cali27, #cali27-enc, #cali27-pie) .ind-sub { margin-top: clamp(48px, 6vw, 72px); }
:is(#cali27, #cali27-enc, #cali27-pie) .ind-sub .h3 { margin-bottom: 10px; }
:is(#cali27, #cali27-enc, #cali27-pie) .tarifas--ind tbody td { font-size: 1rem; line-height: 1.45; }
:is(#cali27, #cali27-enc, #cali27-pie) .tarifas--ind .row-note { white-space: nowrap; }
@media (min-width: 900px) {
  :is(#cali27, #cali27-enc, #cali27-pie) .tarifas--ind tbody th { width: 15em; }
  :is(#cali27, #cali27-enc, #cali27-pie) .tarifas--ind-stands tbody th { width: auto; }
  :is(#cali27, #cali27-enc, #cali27-pie) .tarifas--ind td:has(.price) { white-space: nowrap; }
}
:is(#cali27, #cali27-enc, #cali27-pie) .ind-contact { font-style: normal; display: grid; gap: 6px; }
:is(#cali27, #cali27-enc, #cali27-pie) .ind-contact p { margin: 0; }
:is(#cali27, #cali27-enc, #cali27-pie) .ind-contact p.ind-contact__name { font-size: 1.375rem; font-weight: 600; margin-bottom: 6px; }
:is(#cali27, #cali27-enc, #cali27-pie) .ind-contact__label { display: inline-block; min-width: 5.5em; font-size: .75rem; font-weight: 600; letter-spacing: .1em; text-transform: uppercase; color: var(--azul-80); }
:is(#cali27, #cali27-enc, #cali27-pie) .section--azul .ind-contact__label { color: var(--oro); }
:is(#cali27, #cali27-enc, #cali27-pie) .section--azul .ind-contact a { color: var(--papel); }
:is(#cali27, #cali27-enc, #cali27-pie) .section--azul .ind-contact .row-note { color: var(--papel); opacity: .8; }

/* Inicio: franja de industria a todo lo ancho */
:is(#cali27, #cali27-enc, #cali27-pie) .ind-band .split { align-items: start; }
:is(#cali27, #cali27-enc, #cali27-pie) .ind-band__facts { margin: 0; display: grid; gap: 0; border-top: 1px solid var(--line-on-azul); }
:is(#cali27, #cali27-enc, #cali27-pie) .ind-band__facts div { display: grid; grid-template-columns: 8.5em 1fr; gap: 16px; align-items: baseline; padding: 14px 0; border-bottom: 1px solid var(--line-on-azul); }
:is(#cali27, #cali27-enc, #cali27-pie) .ind-band__facts dt { font-size: 1.5rem; font-weight: 700; line-height: 1; color: var(--oro); font-variant-numeric: lining-nums; }
:is(#cali27, #cali27-enc, #cali27-pie) .ind-band__facts dd { margin: 0; color: var(--papel); }
:is(#cali27, #cali27-enc, #cali27-pie) .ind-band .link-arrow { color: var(--papel); }

/* Inicio sin repeticiones (21 oct 2026) */
:is(#cali27, #cali27-enc, #cali27-pie) .pres:not(:has(.pres__ill)) { padding-bottom: calc(var(--straddle) + var(--air-m)); }
:is(#cali27, #cali27-enc, #cali27-pie) .pres__aside { min-height: 230px; }
@media (min-width: 1000px) { :is(#cali27, #cali27-enc, #cali27-pie) .pres__aside { min-height: calc(clamp(560px, 46vw, 720px) * .5); } }
@media (max-width: 479px) { :is(#cali27, #cali27-enc, #cali27-pie) .pres__aside { min-height: 210px; } }
:is(#cali27, #cali27-enc, #cali27-pie) .coil__days { font-size: 1.375rem; font-weight: 700; color: var(--azul); font-variant-numeric: lining-nums; }
:is(#cali27, #cali27-enc, #cali27-pie) .idt--slim { padding-block: var(--air-m); }
@media (min-width: 900px) {
  :is(#cali27, #cali27-enc, #cali27-pie) .idt--slim .idt__text { grid-column: c 3 / span 8; display: grid; grid-template-columns: 1fr 1fr; column-gap: 56px; align-items: start; }
  :is(#cali27, #cali27-enc, #cali27-pie) .idt--slim .idt__text > :is(.eyebrow, .h2) { grid-column: 1 / -1; }
  :is(#cali27, #cali27-enc, #cali27-pie) .idt--slim .verse { grid-row: span 2; margin: 0; }
}
:is(#cali27, #cali27-enc, #cali27-pie) .prog-band { padding-block: var(--air-s); }
:is(#cali27, #cali27-enc, #cali27-pie) .prog-band__inner { display: flex; flex-wrap: wrap; align-items: center; gap: 12px 28px; padding-block: 28px; border-block: 1px solid var(--line-strong); }
:is(#cali27, #cali27-enc, #cali27-pie) .prog-band__inner .eyebrow { flex-basis: 100%; margin: 0; }
:is(#cali27, #cali27-enc, #cali27-pie) .prog-band__title { margin: 0; }
:is(#cali27, #cali27-enc, #cali27-pie) .prog-band__text { margin: 0; flex: 1 1 22em; max-width: 34em; color: var(--azul-profundo); }
:is(#cali27, #cali27-enc, #cali27-pie) .rubber--band { rotate: -4deg; font-size: .8em; }
:is(#cali27, #cali27-enc, #cali27-pie) .conv__links { margin-top: 28px; }
:is(#cali27, #cali27-enc, #cali27-pie) .conv__links ul { display: flex; flex-wrap: wrap; gap: 10px 28px; }
:is(#cali27, #cali27-enc, #cali27-pie) .conv__links::before { content: none; }

/* ================================================================== carrusel de postales (galería de Cali, 26 oct 2026)
   build.mjs feria() y app.js «carrusel de postales». Antes, carrusel de feria en 3D (v4.7 en versiones/): las fotos
   quedaban pequeñas. Ahora cada foto es una postal grande (Papel, doble filete Azul, pie con número y estampilla de
   ave) en una tira con scroll-snap que ocupa todo el ancho: la postal de frente queda al centro y las vecinas asoman.
   Sin JS: la misma tira, que se desliza a mano. Con app.js (.is-ready): las vecinas se achican e inclinan según su
   distancia al centro (--d con signo, --ad sin signo, hasta 1), el matasellos (.feria__pm) se mueve a la postal de
   frente y se vuelve a estampar cuando llega una nueva, y aparecen los controles. --cw: ancho de la postal, limitado
   también por el alto de la ventana para que la postal entera quepa en pantalla. */
:is(#cali27, #cali27-enc, #cali27-pie) .feria-sec { padding-block: var(--air-m) var(--air-l); overflow: clip; }
:is(#cali27, #cali27-enc, #cali27-pie) .feria-sec--galeria { padding-block: var(--air-s) var(--air-m); }
@media (min-width: 900px) {
  :is(#cali27, #cali27-enc, #cali27-pie) .feria-sec--inicio .feria-sec__head { grid-column: c 3 / span 7; }
  :is(#cali27, #cali27-enc, #cali27-pie) .feria-sec--galeria .feria-sec__head { grid-column: c 1 / span 8; }
}
:is(#cali27, #cali27-enc, #cali27-pie) .feria-sec__head .lead { margin-bottom: 14px; }
:is(#cali27, #cali27-enc, #cali27-pie) .g > .feria { grid-column: full; }
:is(#cali27, #cali27-enc, #cali27-pie) .feria { margin-top: clamp(8px, 1.6vw, 20px); }
:is(#cali27, #cali27-enc, #cali27-pie) .feria__stage { position: relative; container-type: inline-size; }
:is(#cali27, #cali27-enc, #cali27-pie) .feria__track {
  --cw: min(var(--cw-max, 82cqw), 860px, max(300px, (100svh - 290px) * 1.32));
  position: relative; display: flex; gap: clamp(14px, 2.6cqw, 40px); margin: 0; list-style: none;
  padding: 30px calc((100cqw - var(--cw)) / 2) 34px;
  overflow-x: auto; overscroll-behavior-x: contain; scroll-snap-type: x mandatory;
  scrollbar-width: thin; scrollbar-color: var(--azul-40) transparent;
}
:is(#cali27, #cali27-enc, #cali27-pie) .feria__slide { flex: 0 0 var(--cw); min-width: 0; scroll-snap-align: center; scroll-snap-stop: always; }
:is(#cali27, #cali27-enc, #cali27-pie) .feria__card {
  --pad: clamp(12px, 1.7cqw, 18px);
  position: relative; margin: 0; padding: var(--pad) var(--pad) 0;
  background: var(--papel); border: 1.5px solid var(--azul); outline: 1px solid var(--azul); outline-offset: -8px;
  transform-origin: 50% 70%;
}
:is(#cali27, #cali27-enc, #cali27-pie) .feria__photo { display: block; border: 1px solid var(--azul); background: var(--azul-20); }
:is(#cali27, #cali27-enc, #cali27-pie) .feria__photo img { display: block; width: 100%; height: auto; aspect-ratio: 3 / 2; object-fit: cover; -webkit-user-drag: none; }
:is(#cali27, #cali27-enc, #cali27-pie) .feria__cap {
  display: flex; align-items: center; gap: 8px 14px; min-height: clamp(58px, 7cqw, 76px);
  padding: 10px calc(clamp(64px, 9cqw, 100px) + 30px) 12px 2px;
}
:is(#cali27, #cali27-enc, #cali27-pie) .feria__num, :is(#cali27, #cali27-enc, #cali27-pie) .feria-dlg__num {
  flex: none; padding: 3px 7px 2px; border: 1.5px solid var(--azul); outline: 1px dotted var(--azul-40); outline-offset: 2px;
  font-size: .75rem; font-weight: 700; letter-spacing: .14em; line-height: 1.2; font-variant-numeric: lining-nums tabular-nums; color: var(--azul);
}
:is(#cali27, #cali27-enc, #cali27-pie) .feria__text { font-size: clamp(1.0625rem, .7cqw + .85rem, 1.375rem); font-weight: 600; line-height: 1.2; color: var(--azul); text-wrap: balance; }
/* Franqueo: estampilla de ave abajo a la derecha, montada sobre el borde de la foto. */
:is(#cali27, #cali27-enc, #cali27-pie) .feria__franking { position: absolute; z-index: 1; right: calc(var(--pad) + 6px); bottom: calc(var(--pad) - 2px); width: clamp(64px, 9cqw, 100px); }
:is(#cali27, #cali27-enc, #cali27-pie) .feria__franking .feria__stamp { width: 100%; --perf: 4px; --rot: 4deg; padding: 9px; }
:is(#cali27, #cali27-enc, #cali27-pie) .feria__franking .stamp__face { padding: 4px; }
:is(#cali27, #cali27-enc, #cali27-pie) .feria__franking .stamp__legend { margin-top: 4px; font-size: clamp(.5625rem, .9cqw, .6875rem); letter-spacing: .08em; }
:is(#cali27, #cali27-enc, #cali27-pie) .feria__stage > .feria__pm { display: none; }
:is(#cali27, #cali27-enc, #cali27-pie) .feria__photo { position: relative; }
:is(#cali27, #cali27-enc, #cali27-pie) .feria__photo .feria__pm { width: clamp(96px, 15cqw, 150px); left: clamp(8px, 1.6cqw, 18px); top: clamp(8px, 1.6cqw, 18px); --rot: -12deg; z-index: 2; }
@media (max-width: 599px) {
  :is(#cali27, #cali27-enc, #cali27-pie) .feria__track { --cw-max: 88cqw; }
  :is(#cali27, #cali27-enc, #cali27-pie) .feria__franking { width: 58px; }
  :is(#cali27, #cali27-enc, #cali27-pie) .feria__cap { padding-right: 84px; }
}

/* con app.js */
:is(#cali27, #cali27-enc, #cali27-pie) .feria.is-ready .feria__track { scrollbar-width: none; }
:is(#cali27, #cali27-enc, #cali27-pie) .feria.is-ready .feria__track::-webkit-scrollbar { display: none; }
:is(#cali27, #cali27-enc, #cali27-pie) .feria.is-ready .feria__track:focus-visible { outline-offset: -4px; }
:is(#cali27, #cali27-enc, #cali27-pie) .feria.is-ready .feria__track.is-dragging { cursor: grabbing; scroll-snap-type: none; user-select: none; -webkit-user-select: none; }
:is(#cali27, #cali27-enc, #cali27-pie) .feria.is-ready .feria__slide { cursor: pointer; opacity: calc(1 - .4 * var(--ad, 0)); }
:is(#cali27, #cali27-enc, #cali27-pie) .feria--zoom.is-ready .feria__slide.is-current { cursor: zoom-in; }
:is(#cali27, #cali27-enc, #cali27-pie) .feria.is-ready .feria__card { transform: scale(calc(1 - .1 * var(--ad, 0))) rotate(calc(var(--d, 0) * 2.4deg)); }
@media (hover: hover) {
  :is(#cali27, #cali27-enc, #cali27-pie) .feria.is-ready .feria__slide:not(.is-current):hover { opacity: calc(1 - .25 * var(--ad, 0)); }
}
:is(#cali27, #cali27-enc, #cali27-pie) .feria__controls.carousel__controls { justify-content: center; margin: 4px var(--gutter) 0; }
:is(#cali27, #cali27-enc, #cali27-pie) .feria.is-paused .carousel__btn--pause .carousel__icon { width: 12px; border: 0; background: currentColor; clip-path: polygon(0 0, 100% 50%, 0 100%); translate: 1px 0; }
@media (max-width: 699px) { :is(#cali27, #cali27-enc, #cali27-pie) .feria__controls .carousel__dots { display: none; } }
:is(#cali27, #cali27-enc, #cali27-pie) .feria__hint { margin: 2px auto 0; padding-inline: var(--gutter); max-width: none; text-align: center; }

/* la postal en grande (Vive Cali) */
:is(#cali27, #cali27-enc, #cali27-pie) .feria-dlg {
  width: min(1280px, calc(100vw - 32px)); max-width: none; max-height: calc(100dvh - 32px); margin: auto; padding: 0;
  background: var(--papel); color: var(--azul); border: 1.5px solid var(--azul); outline: 1px solid var(--oro); outline-offset: 4px;
}
:is(#cali27, #cali27-enc, #cali27-pie) .feria-dlg::backdrop { background: rgba(16, 36, 66, .78); }
:is(#cali27, #cali27-enc, #cali27-pie) .feria-dlg__bar { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 8px 10px 8px 18px; border-bottom: 2px solid var(--azul); }
:is(#cali27, #cali27-enc, #cali27-pie) .feria-dlg__num { margin: 0; }
:is(#cali27, #cali27-enc, #cali27-pie) .btn.feria-dlg__close { margin: 0; }
:is(#cali27, #cali27-enc, #cali27-pie) .feria-dlg__fig { margin: 0; padding: 16px clamp(16px, 5vw, 76px) 18px; }
:is(#cali27, #cali27-enc, #cali27-pie) .feria-dlg__img { display: block; width: auto; height: auto; max-width: 100%; max-height: calc(100dvh - 190px); margin: 0 auto; border: 1px solid var(--azul); }
:is(#cali27, #cali27-enc, #cali27-pie) .feria-dlg__cap { margin: 14px 0 0; text-align: center; font-size: clamp(1.125rem, .5vw + 1rem, 1.375rem); font-weight: 600; line-height: 1.25; text-wrap: balance; }
:is(#cali27, #cali27-enc, #cali27-pie) .feria-dlg .carousel__btn { position: absolute; top: 50%; translate: 0 -50%; background: var(--papel); }
:is(#cali27, #cali27-enc, #cali27-pie) .feria-dlg .carousel__btn:hover { background: var(--azul); }
:is(#cali27, #cali27-enc, #cali27-pie) .feria-dlg__prev { left: 12px; }
:is(#cali27, #cali27-enc, #cali27-pie) .feria-dlg__next { right: 12px; }
@media (max-width: 599px) {
  :is(#cali27, #cali27-enc, #cali27-pie) .feria-dlg .carousel__btn { top: auto; bottom: 12px; translate: none; }
  :is(#cali27, #cali27-enc, #cali27-pie) .feria-dlg__fig { padding-bottom: 68px; }
}
html:has(.feria-dlg[open]) { overflow: hidden; }
html.mov :is(#cali27, #cali27-enc, #cali27-pie) .feria-dlg[open] .feria-dlg__img { animation: fecha .35s var(--ease-stamp) both; }

@media print {
  :is(#cali27, #cali27-enc, #cali27-pie) .feria__controls, :is(#cali27, #cali27-enc, #cali27-pie) .feria__hint, :is(#cali27, #cali27-enc, #cali27-pie) .feria__pm, :is(#cali27, #cali27-enc, #cali27-pie) .feria-dlg { display: none !important; }
  :is(#cali27, #cali27-enc, #cali27-pie) .feria__track { flex-wrap: wrap; overflow: visible; padding-inline: 0; }
  :is(#cali27, #cali27-enc, #cali27-pie) .feria__slide { flex-basis: calc(50% - 20px); opacity: 1 !important; }
  :is(#cali27, #cali27-enc, #cali27-pie) .feria__card { transform: none !important; }
}

/* ================================================================== juegos (26 oct 2026)
   build.mjs play() / memoryDialog() y app.js «juegos». Botón de texto, aviario (diálogo), ave escondida (.hunt),
   aviso (.toast), aves sueltas (.vuelo) y parejas de aves (.memoria). Sin JS nada de esto se muestra. */
:is(#cali27, #cali27-enc, #cali27-pie) .link-btn {
  padding: 0; background: none; border: 0; border-bottom: 1.5px solid currentColor; color: inherit; cursor: pointer;
  font: inherit; font-weight: 600; line-height: 1.2;
}
:is(#cali27, #cali27-enc, #cali27-pie) .link-btn:hover { color: var(--rojo); }

/* -- botón del aviario en el pie */
:is(#cali27, #cali27-enc, #cali27-pie) .site-footer__play { margin-top: 14px; }
:is(#cali27, #cali27-enc, #cali27-pie) .aviario-btn {
  display: inline-flex; align-items: center; gap: 10px; min-height: 44px; padding: 6px 14px 6px 8px;
  background: transparent; border: 1.5px dashed var(--oro); border-radius: var(--radius); color: var(--papel); cursor: pointer;
  font: inherit; font-size: .875rem; font-weight: 700; letter-spacing: .1em; text-transform: uppercase;
}
:is(#cali27, #cali27-enc, #cali27-pie) .aviario-btn:hover { background: rgba(239, 175, 33, .14); }
:is(#cali27, #cali27-enc, #cali27-pie) .aviario-btn__icon { width: 28px; height: 28px; background: url("assets/XXXVII_Ave-04_240px.webp") center / contain no-repeat; }
:is(#cali27, #cali27-enc, #cali27-pie) .aviario-btn__count { color: var(--oro); font-variant-numeric: lining-nums tabular-nums; }
html.mov :is(#cali27, #cali27-enc, #cali27-pie) .aviario-btn:hover .aviario-btn__icon { animation: salta .6s var(--ease-stamp); }

/* -- ave escondida: posada en el borde de una sección, picotea de vez en cuando */
:is(#cali27, #cali27-enc, #cali27-pie) .hunt-host { position: relative; }
:is(#cali27, #cali27-enc, #cali27-pie) .hunt {
  position: absolute; z-index: 5; top: 10px; width: clamp(60px, 6vw, 84px); aspect-ratio: 1; padding: 0;
  background: none; border: 0; border-radius: 50%; cursor: pointer; -webkit-tap-highlight-color: transparent;
}
:is(#cali27, #cali27-enc, #cali27-pie) .hunt--right { right: clamp(10px, 4vw, 56px); }
:is(#cali27, #cali27-enc, #cali27-pie) .hunt--left { left: clamp(10px, 4vw, 56px); }
:is(#cali27, #cali27-enc, #cali27-pie) .hunt--left img { scale: -1 1; }
:is(#cali27, #cali27-enc, #cali27-pie) .hunt--bottom { top: auto; bottom: 10px; }
:is(#cali27, #cali27-enc, #cali27-pie) .hunt img { display: block; width: 100%; height: 100%; object-fit: contain; transform-origin: 50% 90%; pointer-events: none; }
:is(#cali27, #cali27-enc, #cali27-pie) .hunt:focus-visible { outline: 2px solid var(--rojo); outline-offset: 3px; }
@keyframes picotea {
  0%, 62%, 100% { transform: none; }
  66% { transform: rotate(-14deg) translateY(2px); } 70% { transform: none; }
  74% { transform: rotate(-14deg) translateY(2px); } 78% { transform: none; }
  86% { transform: translateY(-8px) rotate(4deg); } 90% { transform: none; }
}
@keyframes escapa {
  0% { transform: none; opacity: 1; }
  20% { transform: translateY(6px) scale(1.05, .9); }
  100% { transform: translate(var(--away, 40vw), -60vh) rotate(-18deg) scale(.6); opacity: 0; }
}
html.mov :is(#cali27, #cali27-enc, #cali27-pie) .hunt img { animation: picotea 4.6s ease-in-out infinite; }
html.mov :is(#cali27, #cali27-enc, #cali27-pie) .hunt:hover img { animation: salta .6s var(--ease-stamp); }
html.mov :is(#cali27, #cali27-enc, #cali27-pie) .hunt--left { --away: -40vw; }
html.mov :is(#cali27, #cali27-enc, #cali27-pie) .hunt.is-caught img { animation: escapa .9s var(--ease-in) forwards; }

/* -- aviso */
:is(#cali27, #cali27-enc, #cali27-pie) .toast {
  position: fixed; z-index: 60; right: max(16px, env(safe-area-inset-right, 0px)); bottom: max(16px, env(safe-area-inset-bottom, 0px));
  display: flex; flex-wrap: wrap; align-items: center; gap: 10px 16px; max-width: min(420px, calc(100vw - 32px)); padding: 16px 16px 12px 18px;
  background: var(--azul); color: var(--papel); border: 1.5px solid var(--oro); outline: 1px solid var(--azul); outline-offset: 3px;
}
:is(#cali27, #cali27-enc, #cali27-pie) .toast__msg { flex: 1 1 200px; margin: 0; font-size: 1.0625rem; font-weight: 600; line-height: 1.3; }
:is(#cali27, #cali27-enc, #cali27-pie) .toast .btn { margin: 0 5px 5px 0; }
html.mov :is(#cali27, #cali27-enc, #cali27-pie) .toast:not([hidden]) { animation: pega .6s var(--ease-stamp) both; }
html.mov :is(#cali27, #cali27-enc, #cali27-pie) .toast.is-out { opacity: 0; translate: 0 12px; transition: opacity .35s ease, translate .35s ease; }

/* -- aviario */
:is(#cali27, #cali27-enc, #cali27-pie) .aviario, :is(#cali27, #cali27-enc, #cali27-pie) .memoria {
  max-width: none; max-height: none; margin: auto; padding: 0;
  background: var(--papel); color: var(--azul); border: 1.5px solid var(--azul); outline: 1px solid var(--oro); outline-offset: 4px;
}
:is(#cali27, #cali27-enc, #cali27-pie) .aviario { width: min(1100px, calc(100vw - 32px)); max-height: calc(100dvh - 32px); }
:is(#cali27, #cali27-enc, #cali27-pie) .aviario::backdrop, :is(#cali27, #cali27-enc, #cali27-pie) .memoria::backdrop { background: rgba(16, 36, 66, .7); }
:is(#cali27, #cali27-enc, #cali27-pie) .aviario__bar, :is(#cali27, #cali27-enc, #cali27-pie) .memoria__bar {
  position: sticky; top: 0; z-index: 2; display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 10px 18px;
  padding: 8px 10px 8px 18px; background: var(--papel); border-bottom: 2px solid var(--azul);
}
:is(#cali27, #cali27-enc, #cali27-pie) .aviario__title, :is(#cali27, #cali27-enc, #cali27-pie) .memoria__title { margin: 0; font-size: 1.125rem; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; }
:is(#cali27, #cali27-enc, #cali27-pie) .aviario__count { margin-left: .5em; padding: 2px 7px 1px; border: 1.5px solid var(--azul); outline: 1px dotted var(--azul-40); outline-offset: 2px; font-size: .8125rem; letter-spacing: .12em; font-variant-numeric: lining-nums tabular-nums; }
:is(#cali27, #cali27-enc, #cali27-pie) .aviario .btn, :is(#cali27, #cali27-enc, #cali27-pie) .memoria__bar .btn { margin: 0; }
:is(#cali27, #cali27-enc, #cali27-pie) .aviario__body { padding: 20px clamp(18px, 3vw, 32px) 24px; }
:is(#cali27, #cali27-enc, #cali27-pie) .aviario__lead { margin: 0 0 18px; font-size: 1.125rem; color: var(--azul-profundo); max-width: 40em; }
:is(#cali27, #cali27-enc, #cali27-pie) .aviario__grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(118px, 1fr)); gap: 14px 10px; margin: 0; padding: 0; list-style: none; }
:is(#cali27, #cali27-enc, #cali27-pie) .aviario__slot { display: flex; flex-direction: column; align-items: center; gap: 8px; text-align: center; }
:is(#cali27, #cali27-enc, #cali27-pie) .aviario__stamp { --perf: 4px; --edge-c: var(--azul-40); width: 100%; max-width: 130px; padding: 10px; }
:is(#cali27, #cali27-enc, #cali27-pie) .aviario__stamp .stamp__face { position: relative; aspect-ratio: 1; display: grid; place-items: center; padding: 8px; border-style: dashed; }
:is(#cali27, #cali27-enc, #cali27-pie) .aviario__stamp img { width: 100%; height: 100%; object-fit: contain; filter: brightness(0) opacity(.12); }
:is(#cali27, #cali27-enc, #cali27-pie) .aviario__bird { display: none; font-style: italic; color: var(--azul-profundo); }
:is(#cali27, #cali27-enc, #cali27-pie) .aviario__slot.is-found .aviario__bird { display: block; }
:is(#cali27, #cali27-enc, #cali27-pie) .aviario__slot.is-found .aviario__page { display: none; }
:is(#cali27, #cali27-enc, #cali27-pie) .aviario__n { position: absolute; left: 18px; top: 16px; font-size: .75rem; font-weight: 700; letter-spacing: .12em; color: var(--rojo); }
:is(#cali27, #cali27-enc, #cali27-pie) .aviario__slot.is-found .stamp__face { border-style: solid; }
:is(#cali27, #cali27-enc, #cali27-pie) .aviario__slot.is-found img { filter: none; }
html.mov :is(#cali27, #cali27-enc, #cali27-pie) .aviario[open] .aviario__slot.is-found .aviario__stamp { animation: pega .6s var(--ease-stamp) both; animation-delay: calc(var(--k, 0) * 60ms); }
:is(#cali27, #cali27-enc, #cali27-pie) .aviario__where { display: flex; flex-direction: column; gap: 2px; font-size: .9375rem; line-height: 1.25; }
:is(#cali27, #cali27-enc, #cali27-pie) .aviario__state { font-size: .75rem; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: var(--azul-80); }
:is(#cali27, #cali27-enc, #cali27-pie) .aviario__slot.is-found .aviario__state { color: var(--rojo); }
:is(#cali27, #cali27-enc, #cali27-pie) .aviario__page a { font-weight: 600; }
:is(#cali27, #cali27-enc, #cali27-pie) .aviario__slot.is-found .aviario__pre { display: none; }
:is(#cali27, #cali27-enc, #cali27-pie) .aviario__foot { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 12px 28px; margin-top: 22px; padding-top: 16px; border-top: 1px solid var(--line-strong); }
:is(#cali27, #cali27-enc, #cali27-pie) .aviario__foot p { margin: 0; }
:is(#cali27, #cali27-enc, #cali27-pie) .aviario__links { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 24px; }
:is(#cali27, #cali27-enc, #cali27-pie) .aviario__reset { font-size: .875rem; color: var(--azul-80); }

/* -- aves sueltas: bandadas lejanas en vector (app.js fly): cada ave es una «m» que aletea; la bandada va en V,
   ondula un poco y cruza la pantalla (cruza: izquierda → derecha; vuelve: al revés; sube: en diagonal; alto: lejos). */
:is(#cali27, #cali27-enc, #cali27-pie) .flyers { position: fixed; inset: 0; z-index: -1; pointer-events: none; overflow: hidden; } /* 3 nov 2026 (Martin): las aves sueltas vuelan detrás de todo el contenido */
:is(#cali27, #cali27-enc, #cali27-pie) .flyers--arriba { z-index: 55; } /* las celebraciones (álbum completo, salsa) siguen por encima del contenido */
:is(#cali27, #cali27-enc, #cali27-pie) .vuelo { position: fixed; left: 0; top: 0; z-index: 3; pointer-events: none; color: var(--azul); animation: var(--anim) var(--dur, 14s) linear both; }
:is(#cali27, #cali27-enc, #cali27-pie) .vuelo__v { position: relative; display: block; scale: var(--s, 1); animation: ondula 3.4s ease-in-out infinite alternate; }
:is(#cali27, #cali27-enc, #cali27-pie) .vuelo__ave { position: absolute; left: var(--x, 0); top: var(--yy, 0); width: var(--w, 28px); }
:is(#cali27, #cali27-enc, #cali27-pie) .vuelo__ave svg { display: block; width: 100%; height: auto; overflow: visible; transform-origin: 50% 58%; animation: aleteo var(--flap, .45s) ease-in-out var(--delay, 0s) infinite alternate; }
:is(#cali27, #cali27-enc, #cali27-pie) .vuelo__ave path { fill: none; stroke: currentColor; stroke-width: 2.6; stroke-linecap: round; stroke-linejoin: round; }
:is(#cali27, #cali27-enc, #cali27-pie) .vuelo__ave ellipse { fill: currentColor; }
:is(#cali27, #cali27-enc, #cali27-pie) .vuelo--cruza { --anim: vuelo-cruza; }
:is(#cali27, #cali27-enc, #cali27-pie) .vuelo--vuelve { --anim: vuelo-vuelve; }
:is(#cali27, #cali27-enc, #cali27-pie) .vuelo--vuelve .vuelo__v { scale: calc(var(--s, 1) * -1) var(--s, 1); }
:is(#cali27, #cali27-enc, #cali27-pie) .vuelo--sube { --anim: vuelo-sube; }
:is(#cali27, #cali27-enc, #cali27-pie) .vuelo--alto { --anim: vuelo-cruza; opacity: .55; }
:is(#cali27, #cali27-enc, #cali27-pie) .vuelo:nth-child(3n) { color: var(--azul-80); }
:is(#cali27, #cali27-enc, #cali27-pie) .memoria .vuelo, :is(#cali27, #cali27-enc, #cali27-pie) .aviario .vuelo { color: var(--azul); }
@keyframes aleteo { from { transform: scaleY(1); } to { transform: scaleY(-.55) translateY(2px); } }
@keyframes ondula { from { translate: 0 -10px; } to { translate: 0 12px; } }
@keyframes vuelo-cruza { from { translate: -14vw var(--y); } to { translate: 112vw var(--y2); } }
@keyframes vuelo-vuelve { from { translate: 112vw var(--y); } to { translate: -14vw var(--y2); } }
@keyframes vuelo-sube { from { translate: -14vw 92vh; } to { translate: 112vw 6vh; } }
/* -- parejas de aves */
:is(#cali27, #cali27-enc, #cali27-pie) .regiones__play { display: flex; flex-wrap: wrap; align-items: center; gap: 14px 26px; margin: -8px 0 32px; }
:is(#cali27, #cali27-enc, #cali27-pie) .regiones__play .btn { margin: 0 5px 5px 0; }
:is(#cali27, #cali27-enc, #cali27-pie) .regiones__play-note { margin: 0; max-width: 34em; color: var(--azul-profundo); }
:is(#cali27, #cali27-enc, #cali27-pie) .memoria-open__cards { position: relative; width: 22px; height: 26px; margin-right: 4px; }
:is(#cali27, #cali27-enc, #cali27-pie) .memoria-open__cards::before, :is(#cali27, #cali27-enc, #cali27-pie) .memoria-open__cards::after { content: ""; position: absolute; inset: 0; border: 1.5px solid currentColor; border-radius: 1px; background: var(--azul); }
:is(#cali27, #cali27-enc, #cali27-pie) .memoria-open__cards::before { rotate: -10deg; translate: -3px 0; }
:is(#cali27, #cali27-enc, #cali27-pie) .memoria-open__cards::after { rotate: 8deg; translate: 3px 1px; background: var(--oro); }
html.mov :is(#cali27, #cali27-enc, #cali27-pie) .memoria-open:hover .memoria-open__cards::after { rotate: 20deg; translate: 6px -2px; transition: rotate .3s var(--ease-stamp), translate .3s var(--ease-stamp); }

:is(#cali27, #cali27-enc, #cali27-pie) .memoria { width: min(1180px, calc(100vw - 24px)); height: calc(100dvh - 24px); overflow: auto; }
:is(#cali27, #cali27-enc, #cali27-pie) .memoria[open] { display: flex; flex-direction: column; }
:is(#cali27, #cali27-enc, #cali27-pie) .memoria__levels { display: flex; gap: 6px; margin-right: auto; }
:is(#cali27, #cali27-enc, #cali27-pie) .memoria__level {
  min-height: 40px; padding: 0 14px; background: none; border: 1.5px solid var(--azul); border-radius: var(--radius); color: var(--azul); cursor: pointer;
  font: inherit; font-size: .8125rem; font-weight: 700; letter-spacing: .1em; text-transform: uppercase;
}
:is(#cali27, #cali27-enc, #cali27-pie) .memoria__level:hover { background: var(--azul-20); }
:is(#cali27, #cali27-enc, #cali27-pie) .memoria__level[aria-pressed="true"] { background: var(--azul); color: var(--papel); }
:is(#cali27, #cali27-enc, #cali27-pie) .memoria__body { position: relative; flex: 1; display: flex; flex-direction: column; min-height: 0; padding: 14px clamp(12px, 2.4vw, 28px) 18px; }
:is(#cali27, #cali27-enc, #cali27-pie) .memoria__top { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px 24px; margin-bottom: 14px; }
:is(#cali27, #cali27-enc, #cali27-pie) .memoria__lead { margin: 0; max-width: 32em; color: var(--azul-profundo); }
:is(#cali27, #cali27-enc, #cali27-pie) .memoria__stats { display: flex; flex-wrap: wrap; gap: 6px 20px; margin: 0; }
:is(#cali27, #cali27-enc, #cali27-pie) .memoria__stat { display: flex; flex-direction: column; }
:is(#cali27, #cali27-enc, #cali27-pie) .memoria__stat dt { font-size: .6875rem; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: var(--rojo); }
:is(#cali27, #cali27-enc, #cali27-pie) .memoria__stat dd { margin: 0; font-size: 1.25rem; font-weight: 700; font-variant-numeric: lining-nums tabular-nums; }
@media (max-width: 639px) {
  :is(#cali27, #cali27-enc, #cali27-pie) .memoria__lead, :is(#cali27, #cali27-enc, #cali27-pie) .memoria__title { display: none; }
  :is(#cali27, #cali27-enc, #cali27-pie) .memoria__bar { flex-wrap: nowrap; padding-left: 10px; gap: 8px; }
  :is(#cali27, #cali27-enc, #cali27-pie) .memoria__levels { gap: 4px; }
  :is(#cali27, #cali27-enc, #cali27-pie) .memoria__level { padding: 0 9px; font-size: .6875rem; letter-spacing: .06em; }
  :is(#cali27, #cali27-enc, #cali27-pie) .memoria__bar .btn { min-height: 40px; padding: 8px 10px; font-size: .75rem; }
  :is(#cali27, #cali27-enc, #cali27-pie) .memoria__stats { gap: 4px 14px; }
}

/* tablero: las postales caben enteras en la ventana (--cols/--rows vienen de app.js) */
:is(#cali27, #cali27-enc, #cali27-pie) .memoria__board {
  --gap: clamp(6px, 1.2vw, 14px);
  display: grid; grid-template-columns: repeat(var(--cols, 4), minmax(0, 1fr)); gap: var(--gap);
  width: min(100%, calc(((100dvh - 230px) / var(--rows, 3) - var(--gap)) * .78 * var(--cols, 4) + var(--gap) * (var(--cols, 4) - 1)));
  margin: auto; padding: 0; list-style: none; perspective: 1400px;
}
:is(#cali27, #cali27-enc, #cali27-pie) .memo-card { position: relative; display: block; width: 100%; aspect-ratio: 4 / 5; padding: 0; background: none; border: 0; cursor: pointer; }
:is(#cali27, #cali27-enc, #cali27-pie) .memo-card:focus-visible { outline: 2px solid var(--rojo); outline-offset: 3px; }
:is(#cali27, #cali27-enc, #cali27-pie) .memo-card__inner { position: absolute; inset: 0; transform-style: preserve-3d; }
:is(#cali27, #cali27-enc, #cali27-pie) .memo-card__back, :is(#cali27, #cali27-enc, #cali27-pie) .memo-card__front {
  position: absolute; inset: 0; backface-visibility: hidden; -webkit-backface-visibility: hidden;
  border: 1.5px solid var(--azul); outline: 1px solid var(--azul); outline-offset: -6px;
}
/* dorso: Azul con el isotipo y una trama de puntos Oro */
:is(#cali27, #cali27-enc, #cali27-pie) .memo-card__back {
  background:
    url("assets/XXXVII_02-Isotipo-Marco_Color.svg") center / 52% no-repeat,
    radial-gradient(circle, rgba(239, 175, 33, .35) 1px, transparent 1.6px) 0 0 / 10px 10px,
    var(--azul);
  outline-color: var(--oro);
}
:is(#cali27, #cali27-enc, #cali27-pie) .memo-card__front { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 4px; padding: 10% 8% 8%; background: var(--papel); transform: rotateY(180deg); }
:is(#cali27, #cali27-enc, #cali27-pie) .memo-card__front img { flex: 1; min-height: 0; width: 100%; object-fit: contain; }
:is(#cali27, #cali27-enc, #cali27-pie) .memo-card__dept { font-size: clamp(.5625rem, 1.1vw, .8125rem); font-weight: 700; letter-spacing: .06em; text-transform: uppercase; line-height: 1.1; text-align: center; }
:is(#cali27, #cali27-enc, #cali27-pie) .memo-card.is-up .memo-card__inner, :is(#cali27, #cali27-enc, #cali27-pie) .memo-card.is-done .memo-card__inner { transform: rotateY(180deg); }
:is(#cali27, #cali27-enc, #cali27-pie) .memo-card.is-done { cursor: default; }
:is(#cali27, #cali27-enc, #cali27-pie) .memo-card.is-done .memo-card__front { background: #FBE7B5; }
:is(#cali27, #cali27-enc, #cali27-pie) .memo-card.is-done .memo-card__front::after {
  content: ""; position: absolute; right: 6%; top: 5%; width: 26%; aspect-ratio: 1; border: 2px solid var(--rojo); border-radius: 50%;
  background: radial-gradient(circle, transparent 52%, var(--rojo) 54% 60%, transparent 62%); rotate: -14deg; opacity: .85;
}
html.mov :is(#cali27, #cali27-enc, #cali27-pie) .memo-card__inner { transition: transform .5s var(--ease-stamp); }
html.mov :is(#cali27, #cali27-enc, #cali27-pie) .memo-card:not(.is-up):not(.is-done):hover .memo-card__inner { transform: rotateY(14deg) translateY(-3px); }
html.mov :is(#cali27, #cali27-enc, #cali27-pie) .memo-card.is-miss .memo-card__inner { animation: niega .38s ease-in-out; }
html.mov :is(#cali27, #cali27-enc, #cali27-pie) .memo-card.is-done .memo-card__front { animation: acierta .5s var(--ease-stamp); }
html.mov :is(#cali27, #cali27-enc, #cali27-pie) .memoria__board.is-dealt .memo-card { animation: reparte .45s var(--ease-stamp) both; animation-delay: calc(var(--i) * 28ms); }
@keyframes niega { 0%, 100% { translate: 0; } 25% { translate: -6px; } 75% { translate: 6px; } }
@keyframes acierta { 0% { scale: 1; } 40% { scale: 1.08; } 100% { scale: 1; } }
@keyframes reparte { from { opacity: 0; transform: translateY(-30px) rotate(-8deg) scale(.9); } to { opacity: 1; transform: none; } }
@keyframes salta { 0%, 100% { translate: 0 0; } 40% { translate: 0 -10%; } 60% { translate: 0 0; } 78% { translate: 0 -3%; } }

/* felicitación */
:is(#cali27, #cali27-enc, #cali27-pie) .memoria__win { position: absolute; inset: 0; z-index: 2; display: grid; place-items: center; padding: 20px; background: rgba(248, 239, 225, .82); }
:is(#cali27, #cali27-enc, #cali27-pie) .memoria__card {
  position: relative; width: min(520px, 100%); padding: 40px clamp(22px, 4vw, 44px) 30px; text-align: center;
  background: var(--papel); border: 1.5px solid var(--azul); outline: 1px solid var(--azul); outline-offset: -9px;
}
:is(#cali27, #cali27-enc, #cali27-pie) .memoria__pm { width: 120px; right: -26px; top: -40px; --rot: 12deg; }
:is(#cali27, #cali27-enc, #cali27-pie) .memoria__win-title { margin: 6px 0 10px; font-size: clamp(2rem, 4vw, 2.75rem); line-height: 1.05; text-transform: uppercase; color: var(--azul); }
:is(#cali27, #cali27-enc, #cali27-pie) .memoria__win-title:focus { outline: none; }
:is(#cali27, #cali27-enc, #cali27-pie) .memoria__stars { display: flex; justify-content: center; gap: 12px; margin: 0 0 14px; }
:is(#cali27, #cali27-enc, #cali27-pie) .memoria__star {
  width: 40px; height: 48px; background: var(--papel); border: 1.5px solid var(--azul-40); outline: 1px dotted var(--azul-40); outline-offset: 3px;
}
:is(#cali27, #cali27-enc, #cali27-pie) .memoria__star.is-on { background: var(--oro) url("assets/XXXVII_Ave-04_240px.webp") center / 80% no-repeat; border-color: var(--azul); rotate: calc((var(--k) - 1) * 6deg); }
html.mov :is(#cali27, #cali27-enc, #cali27-pie) .memoria.is-won .memoria__star { animation: pega .6s var(--ease-stamp) both; animation-delay: calc(.35s + var(--k) * .22s); }
html.mov :is(#cali27, #cali27-enc, #cali27-pie) .memoria.is-won .memoria__card { animation: pega .7s var(--ease-stamp) both; }
:is(#cali27, #cali27-enc, #cali27-pie) .memoria__win-body { font-size: 1.1875rem; margin: 0 0 8px; }
:is(#cali27, #cali27-enc, #cali27-pie) .memoria__record { margin: 0 0 8px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: var(--rojo); }
:is(#cali27, #cali27-enc, #cali27-pie) .memoria__free { margin: 0 auto 18px; }
:is(#cali27, #cali27-enc, #cali27-pie) .memoria__win-actions { margin: 0; }
:is(#cali27, #cali27-enc, #cali27-pie) .memoria__win-actions .btn { margin: 0 5px 5px 0; }

/* -- detalles juguetones: estampillas que se levantan, aves que saltan */
@keyframes menea { 0%, 100% { rotate: var(--rot, 0deg); } 25% { rotate: calc(var(--rot, 0deg) - 5deg); } 75% { rotate: calc(var(--rot, 0deg) + 5deg); } }
@media (hover: hover) {
  html.mov :is(#cali27, #cali27-enc, #cali27-pie) .pliego__item { transition: translate .3s var(--ease-stamp); }
  html.mov :is(#cali27, #cali27-enc, #cali27-pie) .pliego__item:hover { translate: 0 -6px; }
  html.mov :is(#cali27, #cali27-enc, #cali27-pie) .pliego__item:hover .pliego__ph img { animation: salta .6s var(--ease-stamp); }
  html.mov :is(#cali27, #cali27-enc, #cali27-pie) .stamp--bird:hover { animation: menea .5s ease-in-out; }
  html.mov :is(#cali27, #cali27-enc, #cali27-pie) .ave:hover { animation: salta .6s var(--ease-stamp); }
}
@media (prefers-reduced-motion: reduce) {
  :is(#cali27, #cali27-enc, #cali27-pie) .flyers, :is(#cali27, #cali27-enc, #cali27-pie) .vuelo { display: none !important; }
  :is(#cali27, #cali27-enc, #cali27-pie) .hunt img, :is(#cali27, #cali27-enc, #cali27-pie) .memo-card__inner, :is(#cali27, #cali27-enc, #cali27-pie) .memo-card { animation: none !important; transition: none !important; }
}
@media print { :is(#cali27, #cali27-enc, #cali27-pie) .hunt, :is(#cali27, #cali27-enc, #cali27-pie) .toast, :is(#cali27, #cali27-enc, #cali27-pie) .flyers, :is(#cali27, #cali27-enc, #cali27-pie) .aviario, :is(#cali27, #cali27-enc, #cali27-pie) .memoria, :is(#cali27, #cali27-enc, #cali27-pie) .regiones__play, :is(#cali27, #cali27-enc, #cali27-pie) .site-footer__play { display: none !important; } }


/* ================================================================== más juego (26 oct 2026)
   build.mjs (birdMap, birdOfDay, ruta, callButton, play) y app.js «más juego». */

html.mov :is(#cali27, #cali27-enc, #cali27-pie) .brand:is(:hover, :focus-visible) .iso .iso-aspa { rotate: var(--wind, 0deg); }
:is(#cali27, #cali27-enc, #cali27-pie) .ringlete__aspas { rotate: var(--wind, 0deg); }

/* -- botón de canto: altavoz con ondas; suena = las ondas laten */
:is(#cali27, #cali27-enc, #cali27-pie) .call-btn {
  display: inline-grid; place-items: center; width: 36px; height: 36px; padding: 0; flex: none;
  background: var(--papel); border: 1.5px solid var(--azul); border-radius: 50%; color: var(--azul); cursor: pointer;
}
:is(#cali27, #cali27-enc, #cali27-pie) .call-btn:hover { background: var(--oro); }
:is(#cali27, #cali27-enc, #cali27-pie) .call-btn__icon {
  width: 18px; height: 18px; background: currentColor;
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M3 9h4l5-4v14l-5-4H3z' fill='black'/%3E%3Cpath d='M15.5 8.5a5 5 0 0 1 0 7M18.5 5.5a9 9 0 0 1 0 13' stroke='black' stroke-width='2' fill='none' stroke-linecap='round'/%3E%3C/svg%3E") center / contain no-repeat;
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M3 9h4l5-4v14l-5-4H3z' fill='black'/%3E%3Cpath d='M15.5 8.5a5 5 0 0 1 0 7M18.5 5.5a9 9 0 0 1 0 13' stroke='black' stroke-width='2' fill='none' stroke-linecap='round'/%3E%3C/svg%3E") center / contain no-repeat;
}
:is(#cali27, #cali27-enc, #cali27-pie) .call-btn.is-playing { background: var(--oro); }
html.mov :is(#cali27, #cali27-enc, #cali27-pie) .call-btn.is-playing .call-btn__icon { animation: late .5s ease-in-out infinite; }
:is(#cali27, #cali27-enc, #cali27-pie) .call-btn--text { width: auto; height: auto; min-height: 40px; gap: 8px; grid-auto-flow: column; padding: 6px 14px 6px 10px; border-radius: var(--radius); font: inherit; font-size: .875rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; }
:is(#cali27, #cali27-enc, #cali27-pie) .pliego__item { position: relative; }
:is(#cali27, #cali27-enc, #cali27-pie) .pliego__call { position: absolute; top: 44px; right: 22px; z-index: 1; width: 32px; height: 32px; }
:is(#cali27, #cali27-enc, #cali27-pie) .pliego__ph { cursor: pointer; }
html.mov :is(#cali27, #cali27-enc, #cali27-pie) .is-singing .pliego__ph img, html.mov :is(#cali27, #cali27-enc, #cali27-pie) .is-singing .stamp__face img { animation: canta .5s ease-in-out infinite alternate; transform-origin: 50% 90%; }
@keyframes canta { from { transform: rotate(-3deg) translateY(0); } to { transform: rotate(3deg) translateY(-4%); } }

/* -- mapa de las aves */
:is(#cali27, #cali27-enc, #cali27-pie) .mapa-aves { margin: 0 0 40px; padding: clamp(18px, 3vw, 32px); background: var(--papel); border: 1.5px solid var(--azul); outline: 1px solid var(--azul); outline-offset: -8px; }
:is(#cali27, #cali27-enc, #cali27-pie) .mapa-aves__head { margin-bottom: 14px; }
:is(#cali27, #cali27-enc, #cali27-pie) .mapa-aves__title { margin: 0 0 4px; font-size: 1.375rem; font-weight: 700; }
:is(#cali27, #cali27-enc, #cali27-pie) .mapa-aves__lead { margin: 0; color: var(--azul-profundo); }
:is(#cali27, #cali27-enc, #cali27-pie) .mapa-aves__grid { display: grid; gap: 20px; align-items: center; }
@media (min-width: 860px) { :is(#cali27, #cali27-enc, #cali27-pie) .mapa-aves__grid { grid-template-columns: minmax(0, 1.05fr) minmax(0, 1fr); gap: 36px; } }
:is(#cali27, #cali27-enc, #cali27-pie) .mapa-aves__svg { display: block; width: 100%; max-height: 640px; height: auto; overflow: visible; }
:is(#cali27, #cali27-enc, #cali27-pie) .dep { fill: var(--azul-20); stroke: var(--papel); stroke-width: 1.4; }
:is(#cali27, #cali27-enc, #cali27-pie) .dep--on { fill: var(--azul); cursor: pointer; transition: fill .2s ease; }
:is(#cali27, #cali27-enc, #cali27-pie) .dep--on:nth-child(3n) { fill: #22457A; }
:is(#cali27, #cali27-enc, #cali27-pie) .dep--on:hover, :is(#cali27, #cali27-enc, #cali27-pie) .dep--on:focus-visible { fill: var(--oro); outline: none; }
:is(#cali27, #cali27-enc, #cali27-pie) .dep--on.is-sel { fill: var(--rojo); }
:is(#cali27, #cali27-enc, #cali27-pie) .dep-dot { fill: var(--oro); stroke: var(--azul); stroke-width: 2; pointer-events: none; transform-box: fill-box; transform-origin: center; }
:is(#cali27, #cali27-enc, #cali27-pie) .dep-dot.is-sel { fill: var(--papel); }
html.mov :is(#cali27, #cali27-enc, #cali27-pie) .dep-dot.is-sel { animation: late .6s var(--ease-stamp); }
:is(#cali27, #cali27-enc, #cali27-pie) .mapa-aves__panel { min-height: 240px; }
:is(#cali27, #cali27-enc, #cali27-pie) .mapa-aves__card { display: grid; grid-template-columns: minmax(110px, 160px) 1fr; gap: 20px; align-items: start; }
html.mov :is(#cali27, #cali27-enc, #cali27-pie) .mapa-aves__card:not([hidden]) { animation: pega .5s var(--ease-stamp) both; }
:is(#cali27, #cali27-enc, #cali27-pie) .mapa-aves__stamp { --perf: 4px; padding: 11px; }
:is(#cali27, #cali27-enc, #cali27-pie) .mapa-aves__stamp .stamp__face { aspect-ratio: 1; display: grid; place-items: center; padding: 6px; }
:is(#cali27, #cali27-enc, #cali27-pie) .mapa-aves__stamp img { width: 100%; height: 100%; object-fit: contain; }
:is(#cali27, #cali27-enc, #cali27-pie) .mapa-aves__text p { margin: 0 0 8px; }
:is(#cali27, #cali27-enc, #cali27-pie) .mapa-aves__dept { font-size: .8125rem; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: var(--rojo); }
:is(#cali27, #cali27-enc, #cali27-pie) .mapa-aves__bird { font-size: 1.5rem; font-weight: 700; line-height: 1.15; }
:is(#cali27, #cali27-enc, #cali27-pie) .mapa-aves__sci, :is(#cali27, #cali27-enc, #cali27-pie) .diaria__sci { display: block; font-size: 1rem; font-style: italic; font-weight: 400; color: var(--azul-80); }
:is(#cali27, #cali27-enc, #cali27-pie) .mapa-aves__fact { color: var(--azul-profundo); }
:is(#cali27, #cali27-enc, #cali27-pie) .mapa-aves__soc { font-size: .875rem; color: var(--azul-80); }
:is(#cali27, #cali27-enc, #cali27-pie) .mapa-aves__soc abbr { font-weight: 700; text-decoration: none; letter-spacing: .08em; }
@media (max-width: 479px) { :is(#cali27, #cali27-enc, #cali27-pie) .mapa-aves__card { grid-template-columns: 96px 1fr; gap: 14px; } :is(#cali27, #cali27-enc, #cali27-pie) .mapa-aves__bird { font-size: 1.25rem; } }

:is(#cali27, #cali27-enc, #cali27-pie) .cantos-creditos { margin-top: 18px; font-size: .875rem; color: var(--azul-80); }
:is(#cali27, #cali27-enc, #cali27-pie) .cantos-creditos summary { cursor: pointer; font-weight: 700; color: var(--azul); }
:is(#cali27, #cali27-enc, #cali27-pie) .cantos-creditos ul { margin: 8px 0 0; padding-left: 1.2em; columns: 2 320px; }
:is(#cali27, #cali27-enc, #cali27-pie) .cantos-creditos li { break-inside: avoid; margin-bottom: 4px; }

/* -- ave del día (Inicio) */
:is(#cali27, #cali27-enc, #cali27-pie) .diaria { padding-block: var(--air-s) var(--air-m); }
:is(#cali27, #cali27-enc, #cali27-pie) .diaria__wrap { position: relative; }
@media (min-width: 900px) { :is(#cali27, #cali27-enc, #cali27-pie) .diaria__wrap { grid-column: c 3 / span 9; } }
:is(#cali27, #cali27-enc, #cali27-pie) .diaria__card { display: grid; grid-template-columns: minmax(130px, 220px) 1fr; gap: clamp(20px, 3vw, 40px); align-items: center; padding: clamp(18px, 3vw, 30px); background: var(--papel); border: 1.5px solid var(--azul); outline: 1px solid var(--azul); outline-offset: -8px; }
:is(#cali27, #cali27-enc, #cali27-pie) .diaria__stamp { --perf: 5px; padding: 13px; --rot: -3deg; }
:is(#cali27, #cali27-enc, #cali27-pie) .diaria__stamp .stamp__face { aspect-ratio: 1; display: grid; place-items: center; padding: 8px; }
:is(#cali27, #cali27-enc, #cali27-pie) .diaria__stamp img { width: 100%; height: 100%; object-fit: contain; }
:is(#cali27, #cali27-enc, #cali27-pie) .diaria__title { margin: 4px 0 6px; }
:is(#cali27, #cali27-enc, #cali27-pie) .diaria__bird { margin: 0 0 8px; font-size: 1.25rem; font-weight: 700; }
:is(#cali27, #cali27-enc, #cali27-pie) .diaria__fact { margin: 0 0 14px; font-size: 1.125rem; color: var(--azul-profundo); max-width: 36em; }
:is(#cali27, #cali27-enc, #cali27-pie) .diaria__actions { display: flex; flex-wrap: wrap; align-items: center; gap: 12px 24px; margin: 0; }
:is(#cali27, #cali27-enc, #cali27-pie) .diaria__next { margin: 10px 0 0; text-align: right; }
@media (max-width: 559px) { :is(#cali27, #cali27-enc, #cali27-pie) .diaria__card { grid-template-columns: 1fr; } :is(#cali27, #cali27-enc, #cali27-pie) .diaria__stamp { width: 160px; } }

/* -- confeti de ringletes */
:is(#cali27, #cali27-enc, #cali27-pie) .confeti { position: fixed; inset: 0; z-index: 70; pointer-events: none; overflow: hidden; }
:is(#cali27, #cali27-enc, #cali27-pie) .confeti__p { position: fixed; left: var(--x); top: var(--y); width: 18px; height: 18px; margin: -9px 0 0 -9px; animation: confeti .9s cubic-bezier(.2, .7, .4, 1) forwards; }
:is(#cali27, #cali27-enc, #cali27-pie) .confeti__p svg { display: block; width: 100%; height: 100%; }
:is(#cali27, #cali27-enc, #cali27-pie) .confeti__p--chip { width: 8px; height: 5px; margin: -2px 0 0 -4px; background: var(--c); }
@keyframes confeti {
  0% { transform: translate(0, 0) rotate(0) scale(.4); opacity: 1; }
  70% { opacity: 1; }
  100% { transform: translate(var(--dx), calc(var(--dy) + 60px)) rotate(var(--rot)) scale(1); opacity: 0; }
}

/* -- modo salsa: todo baila a 180 ppm (un pulso cada 1/3 s) */
:is(#cali27, #cali27-enc, #cali27-pie) .salsa-bar {
  position: fixed; z-index: 65; left: 50%; top: 14px; translate: -50% 0; max-width: calc(100vw - 24px);
  display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 8px 12px; padding: 12px 14px 10px 20px;
  background: var(--rojo); color: var(--papel); border: 2px solid var(--oro); outline: 1px solid var(--rojo); outline-offset: 3px;
}
:is(#cali27, #cali27-enc, #cali27-pie) .salsa-bar__title { margin: 0 8px 0 0; font-size: 1.25rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; }
:is(#cali27, #cali27-enc, #cali27-pie) .salsa-bar .btn { margin: 0 5px 5px 0; }
:is(#cali27, #cali27-enc, #cali27-pie) .salsa-bar .btn--ghost { color: var(--papel); }
:is(#cali27, #cali27-enc, #cali27-pie) .salsa-bar .btn--ghost::before { box-shadow: inset 0 0 0 1.5px var(--papel); }
html.mov :is(#cali27, #cali27-enc, #cali27-pie) .salsa-bar:not([hidden]) { animation: pega .5s var(--ease-stamp) both; }
@keyframes salsa-a { 0%, 100% { transform: translateY(0) rotate(-4deg); } 50% { transform: translateY(-10px) rotate(4deg); } }
@keyframes salsa-b { 0%, 100% { transform: rotate(3deg) scale(1); } 50% { transform: rotate(-3deg) scale(1.04); } }
html.mov.salsa :is(#cali27, #cali27-enc, #cali27-pie) :is(.ave, .pliego__ph img, .hunt img, .stamp__face img, .hero__flock, .carrier__bird) { animation: salsa-a .667s ease-in-out infinite; }
html.mov.salsa :is(#cali27, #cali27-enc, #cali27-pie) :is(.stamp, .coil__cell, .pliego__item, .stage-stamp):nth-child(odd) { animation: salsa-b .667s ease-in-out infinite; }
html.mov.salsa :is(#cali27, #cali27-enc, #cali27-pie) :is(.stamp, .coil__cell, .pliego__item, .stage-stamp):nth-child(even) { animation: salsa-b .667s ease-in-out infinite reverse; }
html.mov.salsa :is(#cali27, #cali27-enc, #cali27-pie) .h1, html.mov.salsa :is(#cali27, #cali27-enc, #cali27-pie) .h2 { animation: salsa-b 1.333s ease-in-out infinite; transform-origin: 0 100%; }
html.mov.salsa :is(#cali27, #cali27-enc, #cali27-pie) .ringlete__aspas { animation: gira .667s linear infinite; }

/* -- ruta por Cali */
:is(#cali27, #cali27-enc, #cali27-pie) .ruta { padding-block: var(--air-m); overflow: clip; }
:is(#cali27, #cali27-enc, #cali27-pie) .ruta__track { position: relative; margin-top: 24px; }
:is(#cali27, #cali27-enc, #cali27-pie) .ruta__svg { position: absolute; inset: 0; width: 100%; height: 100%; overflow: visible; pointer-events: none; display: none; }
:is(#cali27, #cali27-enc, #cali27-pie) .ruta.is-ready .ruta__svg { display: block; }
:is(#cali27, #cali27-enc, #cali27-pie) .ruta__bg { fill: none; stroke: var(--azul-20); stroke-width: 6; stroke-linecap: round; stroke-dasharray: 2 12; }
:is(#cali27, #cali27-enc, #cali27-pie) .ruta__line { fill: none; stroke: var(--rojo); stroke-width: 4; stroke-linecap: round; }
:is(#cali27, #cali27-enc, #cali27-pie) .ruta__chiva { position: absolute; left: 0; top: 0; z-index: 3; width: 96px; height: auto; translate: calc(var(--cx, -999px) - 48px) calc(var(--cy, 0px) - 72px); display: none; pointer-events: none; }
:is(#cali27, #cali27-enc, #cali27-pie) .ruta.is-ready .ruta__chiva { display: block; }
:is(#cali27, #cali27-enc, #cali27-pie) .ruta__chiva.is-flip { scale: -1 1; }
html.mov :is(#cali27, #cali27-enc, #cali27-pie) .ruta__chiva { animation: traqueteo .35s ease-in-out infinite alternate; }
@keyframes traqueteo { from { transform: translateY(0) rotate(-1.5deg); } to { transform: translateY(-2px) rotate(1.5deg); } }
:is(#cali27, #cali27-enc, #cali27-pie) .ruta__stops { position: relative; z-index: 2; display: grid; gap: clamp(40px, 6vw, 90px); margin: 0; padding: 70px 0 20px; list-style: none; }
:is(#cali27, #cali27-enc, #cali27-pie) .ruta__stop { position: relative; display: grid; grid-template-columns: 52px minmax(0, 1fr); gap: 14px; align-items: start; }
@media (min-width: 900px) {
  :is(#cali27, #cali27-enc, #cali27-pie) .ruta__stop { grid-template-columns: 1fr 64px 1fr; gap: 28px; }
  :is(#cali27, #cali27-enc, #cali27-pie) .ruta__stop .ruta__pin { grid-column: 2; }
  :is(#cali27, #cali27-enc, #cali27-pie) .ruta__stop:nth-child(odd) .ruta__card { grid-column: 3; }
  :is(#cali27, #cali27-enc, #cali27-pie) .ruta__stop:nth-child(even) .ruta__card { grid-column: 1; grid-row: 1; justify-self: end; }
}
:is(#cali27, #cali27-enc, #cali27-pie) .ruta__pin {
  display: grid; place-items: center; width: 52px; height: 52px; border-radius: 50% 50% 50% 0; rotate: -45deg; justify-self: center;
  background: var(--papel); border: 3px solid var(--azul); font-size: 1.25rem; font-weight: 700; color: var(--azul);
}
:is(#cali27, #cali27-enc, #cali27-pie) .ruta__pin > * { rotate: 45deg; }
:is(#cali27, #cali27-enc, #cali27-pie) .ruta__pin { font-variant-numeric: lining-nums; }
:is(#cali27, #cali27-enc, #cali27-pie) .ruta__stop.is-reached .ruta__pin { background: var(--oro); border-color: var(--rojo); }
html.mov :is(#cali27, #cali27-enc, #cali27-pie) .ruta.is-ready .ruta__stop.is-reached .ruta__pin { animation: pin .5s var(--ease-stamp); }
@keyframes pin { 0% { scale: .6; } 60% { scale: 1.15; } 100% { scale: 1; } }
:is(#cali27, #cali27-enc, #cali27-pie) .ruta__card { max-width: 440px; padding: 14px 14px 18px; background: var(--papel); border: 1.5px solid var(--azul); outline: 1px solid var(--azul); outline-offset: -7px; }
html.mov :is(#cali27, #cali27-enc, #cali27-pie) .ruta.is-ready .ruta__card { opacity: .35; translate: 0 16px; transition: opacity .5s ease, translate .5s var(--ease-stamp); }
html.mov :is(#cali27, #cali27-enc, #cali27-pie) .ruta.is-ready .ruta__stop.is-reached .ruta__card { opacity: 1; translate: 0 0; }
:is(#cali27, #cali27-enc, #cali27-pie) .ruta__photo { display: block; margin-bottom: 12px; border: 1px solid var(--azul); }
:is(#cali27, #cali27-enc, #cali27-pie) .ruta__photo img { display: block; width: 100%; height: auto; aspect-ratio: 3 / 2; object-fit: cover; }
:is(#cali27, #cali27-enc, #cali27-pie) .ruta__name { margin: 0 0 6px; font-size: 1.375rem; font-weight: 700; line-height: 1.15; }
:is(#cali27, #cali27-enc, #cali27-pie) .ruta__body { margin: 0; color: var(--azul-profundo); }

/* -- álbum: secciones, pasaporte y logros */
:is(#cali27, #cali27-enc, #cali27-pie) .aviario__h { display: flex; align-items: center; gap: 4px; margin: 28px 0 8px; padding-top: 18px; border-top: 1px solid var(--line-strong); font-size: 1.25rem; font-weight: 700; text-transform: uppercase; letter-spacing: .06em; }
:is(#cali27, #cali27-enc, #cali27-pie) .aviario__h:first-child { margin-top: 0; padding-top: 0; border-top: 0; }
:is(#cali27, #cali27-enc, #cali27-pie) .pasaporte { display: grid; grid-template-columns: repeat(auto-fill, minmax(104px, 1fr)); gap: 14px 10px; margin: 0; padding: 0; list-style: none; }
:is(#cali27, #cali27-enc, #cali27-pie) .pasaporte__visa { display: flex; flex-direction: column; align-items: center; gap: 6px; text-decoration: none; color: inherit; }
:is(#cali27, #cali27-enc, #cali27-pie) .pasaporte__ring {
  display: grid; place-items: center; width: 78px; aspect-ratio: 1; border-radius: 50%; border: 2px dashed var(--azul-40);
  font-weight: 700; color: var(--azul-40);
}
:is(#cali27, #cali27-enc, #cali27-pie) .pasaporte__name { font-size: .875rem; font-weight: 600; text-align: center; line-height: 1.2; }
:is(#cali27, #cali27-enc, #cali27-pie) .pasaporte__slot.is-visa .pasaporte__ring {
  border: 3px double var(--rojo); color: var(--rojo); rotate: -12deg;
  background: radial-gradient(circle, transparent 54%, rgba(203, 50, 39, .9) 55% 58%, transparent 59%);
}
:is(#cali27, #cali27-enc, #cali27-pie) .pasaporte__slot.is-visa:nth-child(even) .pasaporte__ring { rotate: 9deg; border-color: var(--azul); color: var(--azul); background: radial-gradient(circle, transparent 54%, rgba(24, 53, 95, .9) 55% 58%, transparent 59%); }
html.mov :is(#cali27, #cali27-enc, #cali27-pie) .aviario[open] .pasaporte__slot.is-visa .pasaporte__ring { animation: sella .5s var(--ease-stamp) both; }
:is(#cali27, #cali27-enc, #cali27-pie) .pasaporte__premio { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 18px; margin-top: 16px; padding: 12px 16px; border: 1.5px dashed var(--azul-40); }
:is(#cali27, #cali27-enc, #cali27-pie) .pasaporte__premio p { margin: 0; }
:is(#cali27, #cali27-enc, #cali27-pie) .pasaporte__premio-t { font-weight: 700; text-transform: uppercase; letter-spacing: .1em; }
:is(#cali27, #cali27-enc, #cali27-pie) .pasaporte__premio-links { display: flex; flex-wrap: wrap; gap: 8px 12px; }
:is(#cali27, #cali27-enc, #cali27-pie) .pasaporte__premio-links .btn { margin: 0 5px 5px 0; }
:is(#cali27, #cali27-enc, #cali27-pie) .logros { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 16px 12px; margin: 0; padding: 0; list-style: none; }
:is(#cali27, #cali27-enc, #cali27-pie) .logro { display: flex; flex-direction: column; align-items: center; gap: 4px; text-align: center; }
:is(#cali27, #cali27-enc, #cali27-pie) .logro__seal { display: grid; place-items: center; width: 70px; aspect-ratio: 1; border-radius: 47% 53% 50% 50% / 52% 48% 52% 48%; border: 2px dashed var(--azul-40); }
:is(#cali27, #cali27-enc, #cali27-pie) .logro__icon { width: 34px; height: 34px; background: var(--azul-40); -webkit-mask: var(--icon) center / contain no-repeat; mask: var(--icon) center / contain no-repeat; }
:is(#cali27, #cali27-enc, #cali27-pie) .logro__name { font-weight: 700; line-height: 1.15; }
:is(#cali27, #cali27-enc, #cali27-pie) .logro__desc { font-size: .8125rem; line-height: 1.25; color: var(--azul-80); }
:is(#cali27, #cali27-enc, #cali27-pie) .logro.is-earned .logro__seal { border: 0; background: var(--rojo); box-shadow: inset 0 0 0 4px #B22A20; outline: 1.5px solid var(--oro); outline-offset: -9px; rotate: -8deg; }
:is(#cali27, #cali27-enc, #cali27-pie) .logro.is-earned .logro__icon { background: var(--oro); }
html.mov :is(#cali27, #cali27-enc, #cali27-pie) .aviario[open] .logro.is-earned .logro__seal { animation: sella .5s var(--ease-stamp) both; }
:is(#cali27, #cali27-enc, #cali27-pie) .logro:not(.is-earned) .logro__name { color: var(--azul-80); }
:is(#cali27, #cali27-enc, #cali27-pie) .logro__icon--ave1, :is(#cali27, #cali27-enc, #cali27-pie) .logro__icon--ave11, :is(#cali27, #cali27-enc, #cali27-pie) .logro__icon--ave22, :is(#cali27, #cali27-enc, #cali27-pie) .logro__icon--memoriaDificil { --icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3E%3Cpath d='M4 20c2-8 10-12 17-9l7-3-3 6c1 6-4 11-11 11l-8 4 2-5c-3-1-4-2-4-4z'/%3E%3C/svg%3E"); }
:is(#cali27, #cali27-enc, #cali27-pie) .logro__icon--pasaporte { --icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3E%3Cpath d='M7 3h17a2 2 0 0 1 2 2v22a2 2 0 0 1-2 2H7zM16 9a6 6 0 1 0 .1 0zm-5 15h10v2H11z' fill-rule='evenodd'/%3E%3C/svg%3E"); }
:is(#cali27, #cali27-enc, #cali27-pie) .logro__icon--memoria3 { --icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3E%3Cpath d='M3 8l11-3 4 15-11 3zM16 6h12v18H16z'/%3E%3C/svg%3E"); }
:is(#cali27, #cali27-enc, #cali27-pie) .logro__icon--salsa { --icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3E%3Cpath d='M12 4l14-3v18a4 4 0 1 1-3-4V7l-8 2v14a4 4 0 1 1-3-4z'/%3E%3C/svg%3E"); }
:is(#cali27, #cali27-enc, #cali27-pie) .logro__icon--cantos { --icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M3 9h4l5-4v14l-5-4H3z'/%3E%3Cpath d='M15.5 8.5a5 5 0 0 1 0 7M18.5 5.5a9 9 0 0 1 0 13' stroke='black' stroke-width='2' fill='none'/%3E%3C/svg%3E"); }
:is(#cali27, #cali27-enc, #cali27-pie) .logro__icon--mapa { --icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3E%3Cpath d='M16 2a9 9 0 0 1 9 9c0 7-9 19-9 19S7 18 7 11a9 9 0 0 1 9-9zm0 5a4 4 0 1 0 .1 0z' fill-rule='evenodd'/%3E%3C/svg%3E"); }
:is(#cali27, #cali27-enc, #cali27-pie) .logro__icon--diaria { --icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3E%3Ccircle cx='16' cy='16' r='6'/%3E%3Cpath d='M16 2v5M16 25v5M2 16h5M25 16h5M6 6l3 3M23 23l3 3M26 6l-3 3M9 23l-3 3' stroke='black' stroke-width='3'/%3E%3C/svg%3E"); }
:is(#cali27, #cali27-enc, #cali27-pie) .logro__icon--viento { --icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='-10 -10 20 20'%3E%3Cpath d='M0 0L0-10C6-9 6-3 1 0ZM0 0L10 0C9 6 3 6 0 1ZM0 0L0 10C-6 9-6 3-1 0ZM0 0L-10 0C-9-6-3-6 0-1Z'/%3E%3C/svg%3E"); }

@media (prefers-reduced-motion: reduce) { :is(#cali27, #cali27-enc, #cali27-pie) .confeti, :is(#cali27, #cali27-enc, #cali27-pie) .salsa-bar { display: none !important; } }
@media print { :is(#cali27, #cali27-enc, #cali27-pie) .confeti, :is(#cali27, #cali27-enc, #cali27-pie) .salsa-bar, :is(#cali27, #cali27-enc, #cali27-pie) .call-btn, :is(#cali27, #cali27-enc, #cali27-pie) .mapa-aves, :is(#cali27, #cali27-enc, #cali27-pie) .diaria, :is(#cali27, #cali27-enc, #cali27-pie) .ruta__svg, :is(#cali27, #cali27-enc, #cali27-pie) .ruta__chiva, :is(#cali27, #cali27-enc, #cali27-pie) .cantos-creditos { display: none !important; } }

/* -- cuenta regresiva: tablero de paletas (split-flap, 27 oct 2026; reemplaza la hoja que se arrancaba). Tablero Azul
   profundo con marco Oro; cada paleta es una mitad superior y una inferior; al cambiar, la mitad de arriba cae
   (rotateX) y la de abajo se despliega con la cifra nueva. app.js «tablero de paletas». */
:is(#cali27, #cali27-enc, #cali27-pie) .coil__cell--flap {
  padding: 16px 18px 14px; background: #0B1A30; color: var(--papel); cursor: pointer;
  border: 1.5px solid var(--azul-profundo); outline: 1px solid var(--oro); outline-offset: -7px;
}
:is(#cali27, #cali27-enc, #cali27-pie) .coil .coil__cell--flap dt { color: var(--oro); }
:is(#cali27, #cali27-enc, #cali27-pie) .coil .coil__cell--flap dd { margin: 10px 0 0; }
:is(#cali27, #cali27-enc, #cali27-pie) .flap { --fs: clamp(20px, 1.8vw, 30px); display: flex; flex-wrap: nowrap; justify-content: center; gap: clamp(8px, .9vw, 14px); font-family: 'Montserrat', sans-serif; font-weight: 700; font-size: var(--fs); }
:is(#cali27, #cali27-enc, #cali27-pie) .flap__g { display: flex; flex-direction: column; align-items: center; gap: 6px; }
:is(#cali27, #cali27-enc, #cali27-pie) .flap__row { display: flex; gap: 3px; }
:is(#cali27, #cali27-enc, #cali27-pie) .flap__c { position: relative; width: 1.02em; height: 1.46em; perspective: 260px; color: var(--papel); font-variant-numeric: tabular-nums lining-nums; }
:is(#cali27, #cali27-enc, #cali27-pie) .flap__top, :is(#cali27, #cali27-enc, #cali27-pie) .flap__bot, :is(#cali27, #cali27-enc, #cali27-pie) .flap__leaf { position: absolute; left: 0; right: 0; height: 50%; overflow: hidden; text-align: center; backface-visibility: hidden; }
:is(#cali27, #cali27-enc, #cali27-pie) .flap__top, :is(#cali27, #cali27-enc, #cali27-pie) .flap__leaf--top { top: 0; line-height: 1.46em; background: #20416F; border-radius: 3px 3px 0 0; }
:is(#cali27, #cali27-enc, #cali27-pie) .flap__bot, :is(#cali27, #cali27-enc, #cali27-pie) .flap__leaf--bot { bottom: 0; line-height: 0; background: var(--azul); border-radius: 0 0 3px 3px; border-top: 1px solid #0B1A30; }
:is(#cali27, #cali27-enc, #cali27-pie) .flap__leaf { z-index: 2; }
:is(#cali27, #cali27-enc, #cali27-pie) .flap__leaf--top { transform-origin: 50% 100%; animation: paleta-cae .06s ease-in forwards; }
:is(#cali27, #cali27-enc, #cali27-pie) .flap__leaf--bot { transform-origin: 50% 0; transform: rotateX(90deg); animation: paleta-sube .06s ease-out .06s forwards; }
@keyframes paleta-cae { to { transform: rotateX(-90deg); } }
@keyframes paleta-sube { to { transform: rotateX(0); } }
:is(#cali27, #cali27-enc, #cali27-pie) .flap__lab { font-size: .6875rem; font-weight: 700; letter-spacing: .16em; text-transform: uppercase; color: var(--oro); }
@media (min-width: 480px) and (max-width: 899px) { :is(#cali27, #cali27-enc, #cali27-pie) .coil__cell--flap { grid-column: 1 / -1; } }
@media (min-width: 900px) { :is(#cali27, #cali27-enc, #cali27-pie) .coil { grid-template-columns: 1.25fr 1fr 1fr 1.45fr; } }

/* Pie compacto (27 oct 2026): logotipo más pequeño, menos aire y el mapa del sitio en tres columnas (Asistentes,
   Industria, El Congreso) para que todo quepa en una misma altura. */
:is(#cali27, #cali27-enc, #cali27-pie) .site-footer { padding-top: clamp(36px, 4vw, 56px); }
:is(#cali27, #cali27-enc, #cali27-pie) .site-footer__grid { gap: 28px 36px; }
:is(#cali27, #cali27-enc, #cali27-pie) .site-footer__brand img { width: 150px; }
:is(#cali27, #cali27-enc, #cali27-pie) .site-footer__big { font-size: 1.1875rem; margin-bottom: 6px; }
:is(#cali27, #cali27-enc, #cali27-pie) .site-footer__col p { margin-bottom: 6px; font-size: .9375rem; line-height: 1.4; }
:is(#cali27, #cali27-enc, #cali27-pie) .site-footer__cta { margin-top: 12px; }
:is(#cali27, #cali27-enc, #cali27-pie) .site-footer__play { margin-top: 8px; }
:is(#cali27, #cali27-enc, #cali27-pie) .site-footer__contact { margin-top: 12px; }
:is(#cali27, #cali27-enc, #cali27-pie) .site-footer .plate-firma { padding-block: 6px; }
:is(#cali27, #cali27-enc, #cali27-pie) .site-footer .plate-firma img { width: min(100%, 300px); height: auto; }
:is(#cali27, #cali27-enc, #cali27-pie) .site-footer__groups { grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 12px 24px; }
:is(#cali27, #cali27-enc, #cali27-pie) .site-footer__group .site-footer__nav li a { padding: 2px 0; font-size: .9375rem; line-height: 1.3; }
:is(#cali27, #cali27-enc, #cali27-pie) .site-footer__group-title { margin-bottom: 4px; }
:is(#cali27, #cali27-enc, #cali27-pie) .site-footer__legal { margin-top: clamp(24px, 3vw, 36px); padding-block: 14px 18px; }
@media (min-width: 700px) and (max-width: 1099px) { :is(#cali27, #cali27-enc, #cali27-pie) .site-footer__grid > nav.site-footer__col { grid-column: 1 / -1; grid-row: 3; } }
@media (min-width: 1100px) {
  :is(#cali27, #cali27-enc, #cali27-pie) .site-footer__grid { grid-template-columns: 150px minmax(0, 1fr) minmax(0, 2.5fr) minmax(0, 1.1fr); gap: 40px; }
  :is(#cali27, #cali27-enc, #cali27-pie) .site-footer__groups { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

/* 404: el ave perdida (IL-17, acta de revisión oct 2026) */
:is(#cali27, #cali27-enc, #cali27-pie) .notfound__ill { max-width: 640px; margin-top: clamp(24px, 4vw, 48px); }
:is(#cali27, #cali27-enc, #cali27-pie) .elemento__credit { margin-top: 10px; font-size: .8125rem; font-style: italic; color: var(--azul-80); text-align: center; }
:is(#cali27, #cali27-enc, #cali27-pie) .conv-stamp { display: flex; justify-content: flex-end; }
:is(#cali27, #cali27-enc, #cali27-pie) .conv-stamp__s { width: clamp(96px, 11vw, 140px); --rot: 5deg; }

/* -- plumas al tocar un ave de la colección (acta de revisión, oct 2026) */
:is(#cali27, #cali27-enc, #cali27-pie) .plumas { position: fixed; z-index: 80; left: var(--x); top: var(--y); width: 0; height: 0; pointer-events: none; }
:is(#cali27, #cali27-enc, #cali27-pie) .plumas__p { position: absolute; left: -6px; top: -12px; width: 12px; height: 24px; animation: pluma 1.15s cubic-bezier(.2, .7, .3, 1) var(--d, 0s) both; }
:is(#cali27, #cali27-enc, #cali27-pie) .plumas__p svg { display: block; width: 100%; height: 100%; }
:is(#cali27, #cali27-enc, #cali27-pie) .plumas__ring { position: absolute; left: -40px; top: -40px; width: 80px; height: 80px; border: 3px solid var(--oro); border-radius: 50%; animation: pluma-ring .7s ease-out both; }
:is(#cali27, #cali27-enc, #cali27-pie) .plumas__flash { position: absolute; left: -22px; top: -22px; width: 44px; height: 44px; border-radius: 50%; background: radial-gradient(circle, var(--papel) 0 30%, rgba(239, 175, 33, .7) 31% 55%, transparent 56%); animation: pluma-flash .45s ease-out both; }
@keyframes pluma {
  0% { transform: translate(0, 0) rotate(0) scale(.3); opacity: 0; }
  12% { opacity: 1; }
  60% { transform: translate(var(--dx), var(--dy)) rotate(calc(var(--rot) * .6)) scale(1); opacity: 1; }
  100% { transform: translate(calc(var(--dx) * 1.1), calc(var(--dy) + 70px)) rotate(var(--rot)) scale(.9); opacity: 0; }
}
@keyframes pluma-ring { from { transform: scale(.2); opacity: 1; } to { transform: scale(1.6); opacity: 0; } }
@keyframes pluma-flash { from { transform: scale(.3); opacity: 1; } to { transform: scale(1.4); opacity: 0; } }

/* ================================================================== Inicio · ajustes del 28 oct 2026 (pedido de Martin)
   Solo Inicio (.page-inicio), salvo el botón de la postal WCPM, que es el mismo en todas las páginas. */

/* Ringlete de la portada: app.js lo gira con un solo ángulo continuo (giro lento + ráfagas); sin animación CSS que
   pueda reiniciarse. Sin movimiento queda quieto. */
html.mov :is(#cali27, #cali27-enc, #cali27-pie) .hero__aspas { animation: none; transform: none; will-change: rotate; }

/* Aviso del ave del día en la primera pantalla: estampilla pequeña + nombre; baja a #ave-del-dia. */
:is(#cali27, #cali27-enc, #cali27-pie) .hero__ave {
  display: inline-grid; grid-template-columns: 64px auto 28px; align-items: center; gap: 14px; margin-top: 26px;
  padding: 10px 16px 10px 10px; color: var(--azul); text-decoration: none;
  background: var(--papel); border: 1.5px solid var(--azul); outline: 1px dotted var(--azul-40); outline-offset: 3px;
  transition: transform .2s var(--ease-in), box-shadow .2s var(--ease-in);
}
:is(#cali27, #cali27-enc, #cali27-pie) .hero__ave:hover, :is(#cali27, #cali27-enc, #cali27-pie) .hero__ave:focus-visible { transform: translate(-2px, -2px); }
:is(#cali27, #cali27-enc, #cali27-pie) .hero__ave-stamp { --perf: 3px; padding: 7px; --rot: -5deg; }
:is(#cali27, #cali27-enc, #cali27-pie) .hero__ave-stamp .stamp__face { aspect-ratio: 1; padding: 3px; display: grid; place-items: center; }
:is(#cali27, #cali27-enc, #cali27-pie) .hero__ave-stamp img { width: 100%; height: 100%; object-fit: contain; }
:is(#cali27, #cali27-enc, #cali27-pie) .hero__ave-text { display: grid; line-height: 1.2; min-width: 0; }
:is(#cali27, #cali27-enc, #cali27-pie) .hero__ave-kicker { font-size: .75rem; font-weight: 700; letter-spacing: .16em; text-transform: uppercase; color: var(--rojo); }
:is(#cali27, #cali27-enc, #cali27-pie) .hero__ave-name { font-size: 1.1875rem; font-weight: 700; }
:is(#cali27, #cali27-enc, #cali27-pie) .hero__ave-dept { font-size: .9375rem; font-style: italic; color: var(--azul-80); }
:is(#cali27, #cali27-enc, #cali27-pie) .hero__ave-go { position: relative; width: 28px; height: 28px; border: 1.5px solid var(--azul); border-radius: 50%; }
:is(#cali27, #cali27-enc, #cali27-pie) .hero__ave-go::before { content: ""; position: absolute; left: 50%; top: 42%; width: 8px; height: 8px; border: solid var(--azul); border-width: 0 2px 2px 0; transform: translate(-50%, -50%) rotate(45deg); }
@keyframes ave-baja { 0%, 100% { translate: 0 0; } 50% { translate: 0 5px; } }
html.mov :is(#cali27, #cali27-enc, #cali27-pie) .hero__ave-go { animation: ave-baja 1.6s ease-in-out infinite; }
@media (max-width: 479px) { :is(#cali27, #cali27-enc, #cali27-pie) .hero__ave { grid-template-columns: 52px 1fr 24px; gap: 10px; } :is(#cali27, #cali27-enc, #cali27-pie) .hero__ave-name { font-size: 1.0625rem; } }

/* Presentación: el texto termina antes de que empiece el dibujo (IL-19 desde el 25 % de su alto; IL-20 desde arriba).
   El fondo toma el Azul del cielo de la ilustración para que no se vea un corte entre los dos tonos. */
/* 29 oct 2026 (Martin: «un corte duro, tenue»): el fondo toma el tono exacto del cielo de cada ilustración (medido en
   las filas de arriba: IL-20 rgb 3 46 88, IL-19 rgb 1 49 99) y sin las motas de tinta gastada, que la lámina no tiene. */
:is(#cali27, #cali27-enc, #cali27-pie).page-inicio .pres:has(.pres__ill) { background: rgb(3 46 88); padding-bottom: calc(var(--straddle) + 150vw * .92); }
@media (min-width: 1000px) {
  :is(#cali27, #cali27-enc, #cali27-pie).page-inicio .pres:has(.pres__ill) { background-color: rgb(1 49 99); padding-bottom: calc(50vw * .76 + 24px); }
}
/* 29 oct 2026 (Martin): el texto baja todo lo posible sobre el cielo Azul sin tocar los otros colores. Cuanto más
   ancha la pantalla, más a la derecha empieza el texto y más abajo empiezan ahí los colores de IL-19 (32 % del alto
   a 1280 px, 39 % a 1500 px, 49 % desde 1700 px). */
@media (min-width: 1280px) { :is(#cali27, #cali27-enc, #cali27-pie).page-inicio .pres:has(.pres__ill) { padding-bottom: calc(50vw * .72 + 24px); } }
@media (min-width: 1500px) { :is(#cali27, #cali27-enc, #cali27-pie).page-inicio .pres:has(.pres__ill) { padding-bottom: calc(50vw * .64 + 24px); } }
@media (min-width: 1700px) { :is(#cali27, #cali27-enc, #cali27-pie).page-inicio .pres:has(.pres__ill) { padding-bottom: calc(50vw * .55 + 24px); } }

/* Postal del First World Congress of Perioperative Medicine: en Inicio, sobre Papel como el resto de la página. */
:is(#cali27, #cali27-enc, #cali27-pie).page-inicio .postcard--wcpm { background: var(--papel); }
:is(#cali27, #cali27-enc, #cali27-pie).page-inicio .postcard--wcpm .stamp--wcpm { --plate: var(--papel); }

/* Botón fijo de la postal WCPM (abajo a la izquierda, todas las páginas): una postal pequeña en los colores del
   WCPM, con su símbolo como estampilla, borde de correo aéreo y matasellos. Se endereza al pasar el cursor. */
:is(#cali27, #cali27-enc, #cali27-pie) .wcpm-fab {
  width: 108px; height: 72px; display: block; padding: 0; background: var(--papel);
  border: 1.5px solid var(--wcpm-morado); outline: 0; rotate: -4deg;
  transition: rotate .25s var(--ease-in), transform .25s var(--ease-in), box-shadow .25s var(--ease-in);
}
:is(#cali27, #cali27-enc, #cali27-pie) .wcpm-fab:hover, :is(#cali27, #cali27-enc, #cali27-pie) .wcpm-fab:focus-visible { rotate: 0deg; transform: translateY(-3px); }
:is(#cali27, #cali27-enc, #cali27-pie) .wcpm-fab::before, :is(#cali27, #cali27-enc, #cali27-pie) .wcpm-fab::after { content: ""; position: absolute; inset-inline: 0; height: 6px; background: url("assets/WCPM_Borde.svg") 0 0 / 24px 6px repeat-x; }
:is(#cali27, #cali27-enc, #cali27-pie) .wcpm-fab::before { top: 0; }
:is(#cali27, #cali27-enc, #cali27-pie) .wcpm-fab::after { bottom: 0; background-position: 12px 0; }
:is(#cali27, #cali27-enc, #cali27-pie) .wcpm-fab__card { position: absolute; inset: 6px 0; display: grid; grid-template-columns: 1fr 42px; align-items: center; gap: 4px; padding: 3px 6px 3px 9px; }
:is(#cali27, #cali27-enc, #cali27-pie) .wcpm-fab__lines { display: grid; gap: 5px; }
:is(#cali27, #cali27-enc, #cali27-pie) .wcpm-fab__lines b { display: block; font-family: "Montserrat", "Segoe UI", system-ui, sans-serif; font-weight: 800; font-size: 13px; letter-spacing: .04em; line-height: 1; color: var(--wcpm-morado); }
:is(#cali27, #cali27-enc, #cali27-pie) .wcpm-fab__lines small { display: block; font-family: "Montserrat", "Segoe UI", system-ui, sans-serif; font-weight: 700; font-size: 8px; letter-spacing: .12em; line-height: 1; color: var(--wcpm-magenta); }
:is(#cali27, #cali27-enc, #cali27-pie) .wcpm-fab__lines i { display: block; height: 1px; background: rgba(94, 67, 155, .35); }
:is(#cali27, #cali27-enc, #cali27-pie) .wcpm-fab__stamp { --plate: var(--papel); --edge-c: var(--wcpm-magenta); --perf: 2px; padding: 4px; width: 42px; rotate: 6deg; }
:is(#cali27, #cali27-enc, #cali27-pie) .wcpm-fab__stamp .stamp__face { padding: 2px; border-color: var(--wcpm-morado); aspect-ratio: 1; display: grid; place-items: center; }
:is(#cali27, #cali27-enc, #cali27-pie) .wcpm-fab__stamp img { width: 100%; height: auto; }
:is(#cali27, #cali27-enc, #cali27-pie) .wcpm-fab__pm { position: absolute; right: 30px; top: 30px; width: 26px; height: 26px; border: 1.5px solid var(--wcpm-magenta); border-radius: 50%; opacity: .75; pointer-events: none; }
:is(#cali27, #cali27-enc, #cali27-pie) .wcpm-fab__pm::after { content: ""; position: absolute; right: 100%; top: 7px; width: 14px; height: 7px; border-block: 1.5px solid var(--wcpm-magenta); }
html.mov :is(#cali27, #cali27-enc, #cali27-pie) .wcpm-fab { animation: wcpm-llega .7s var(--ease-stamp) 1s both; }
@keyframes wcpm-llega { from { translate: -140px 0; } to { translate: 0 0; } }

/* Carrusel de noticias de Inicio: fundido suave entre noticias (app.js) y la imagen llena su columna. */
:is(#cali27, #cali27-enc, #cali27-pie) .newsx .news-slide__media:not(.media--plate) { aspect-ratio: auto; }
:is(#cali27, #cali27-enc, #cali27-pie) .newsx .news-slide__media:not(.media--plate) img { width: 100%; height: 100%; object-fit: cover; }
@media (min-width: 900px) {
  :is(#cali27, #cali27-enc, #cali27-pie) .newsx .news-slide { grid-template-columns: minmax(0, 6fr) minmax(0, 5fr); min-height: 440px; }
  :is(#cali27, #cali27-enc, #cali27-pie) .newsx .news-slide__media { align-self: stretch; height: 100%; min-height: 360px; }
  /* La ilustración (plate) conservaba su 3:2 y, estirada a la altura de la fila, se salía de su columna y tapaba el texto. */
  :is(#cali27, #cali27-enc, #cali27-pie) .newsx .news-slide__media.media--plate { display: grid; place-items: center; aspect-ratio: auto; width: 100%; min-width: 0; }
}
@media (max-width: 899px) { :is(#cali27, #cali27-enc, #cali27-pie) .newsx .news-slide__media:not(.media--plate) { aspect-ratio: 3 / 2; } }
/* 29 oct 2026 (Martin: «la vista previa de noticias es muy alta, bájala un 25 %»): columnas parejas para que el texto
   ocupe menos renglones, título y resumen un punto más pequeños, resumen de seis renglones como máximo y una altura fija de unos 570 px
   (antes unos 760). */
@media (min-width: 900px) {
  :is(#cali27, #cali27-enc, #cali27-pie) .newsx .news-slide { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); min-height: clamp(460px, 41vw, 570px); padding: 20px; }
  :is(#cali27, #cali27-enc, #cali27-pie) .newsx .news-slide__media { min-height: 0; }
  :is(#cali27, #cali27-enc, #cali27-pie) .newsx .news-slide__text { padding-block: 4px 2px; }
  :is(#cali27, #cali27-enc, #cali27-pie) .newsx .news-slide__meta { margin-bottom: 10px; }
  :is(#cali27, #cali27-enc, #cali27-pie) .newsx .news-slide__title { font-size: clamp(1.375rem, .6vw + 1.05rem, 1.75rem); margin-bottom: 10px; }
  :is(#cali27, #cali27-enc, #cali27-pie) .newsx .news-slide__summary { font-size: clamp(1.0625rem, .2vw + 1rem, 1.1875rem); line-height: 1.5; margin-bottom: 14px; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 6; line-clamp: 6; overflow: hidden; }
  :is(#cali27, #cali27-enc, #cali27-pie) .newsx .news-slide__more { padding-top: 10px; }
}

/* Puntos-estampilla de los carruseles de Inicio: el Oro pasa enseguida a la nueva postal y, en un salto largo,
   recorre deprisa las del medio (app.js .is-lit). */
:is(#cali27, #cali27-enc, #cali27-pie).page-inicio .carousel__dot[aria-current="true"]::before { background: var(--papel); border-color: var(--azul-60); rotate: 0deg; }
:is(#cali27, #cali27-enc, #cali27-pie).page-inicio .carousel__dot.is-lit::before { background: var(--oro); border-color: var(--azul); rotate: -6deg; }
html.mov :is(#cali27, #cali27-enc, #cali27-pie) .page-inicio .carousel__dot::before { transition: background-color .06s linear, rotate .2s var(--ease-stamp); }

/* Identidad: pliego de estampillas con aves, matasellos y las cuatro tintas. */
:is(#cali27, #cali27-enc, #cali27-pie) .idt--pliego { position: relative; row-gap: 40px; }
:is(#cali27, #cali27-enc, #cali27-pie) .idt__pliego { position: relative; min-height: 400px; }
:is(#cali27, #cali27-enc, #cali27-pie) .idt__pliego::before {
  content: ""; position: absolute; inset: 4% 2% 16% 3%; z-index: -1;
  background: url("assets/Patron_Azulejo_Papel.svg") 0 0 / 120px 120px; opacity: .6;
  border: 1px solid var(--line-strong); outline: 1px solid var(--line-strong); outline-offset: 6px; rotate: -1.5deg;
}
:is(#cali27, #cali27-enc, #cali27-pie) .idt__st { position: absolute; width: clamp(100px, 11vw, 140px); }
:is(#cali27, #cali27-enc, #cali27-pie) .idt__st--1 { left: 7%; top: 6%; --rot: -9deg; }
:is(#cali27, #cali27-enc, #cali27-pie) .idt__st--2 { left: 40%; top: 1%; --rot: 5deg; }
:is(#cali27, #cali27-enc, #cali27-pie) .idt__st--3 { left: 16%; top: 42%; --rot: 7deg; }
:is(#cali27, #cali27-enc, #cali27-pie) .idt__st--4 { left: 50%; top: 38%; --rot: -4deg; }
:is(#cali27, #cali27-enc, #cali27-pie) .idt__pm { width: 190px; left: 62%; top: 4%; --rot: 14deg; z-index: 2; }
:is(#cali27, #cali27-enc, #cali27-pie) .idt__inks { position: absolute; left: 3%; right: 2%; bottom: 0; display: flex; flex-wrap: wrap; gap: 10px; margin: 0; padding: 0; list-style: none; }
:is(#cali27, #cali27-enc, #cali27-pie) .idt__ink { display: grid; grid-template-columns: 26px auto; column-gap: 8px; align-items: center; padding: 6px 12px 6px 6px; background: var(--papel); border: 1px solid var(--line-strong); font-size: .875rem; line-height: 1.15; }
:is(#cali27, #cali27-enc, #cali27-pie) .idt__chip { grid-row: span 2; width: 26px; height: 26px; border: 1px solid var(--azul); }
:is(#cali27, #cali27-enc, #cali27-pie) .idt__ink--azul .idt__chip { background: var(--azul); }
:is(#cali27, #cali27-enc, #cali27-pie) .idt__ink--oro .idt__chip { background: var(--oro); }
:is(#cali27, #cali27-enc, #cali27-pie) .idt__ink--rojo .idt__chip { background: var(--rojo); }
:is(#cali27, #cali27-enc, #cali27-pie) .idt__ink--papel .idt__chip { background: var(--papel); }
:is(#cali27, #cali27-enc, #cali27-pie) .idt__ink-name { font-weight: 700; color: var(--azul); }
:is(#cali27, #cali27-enc, #cali27-pie) .idt__ink-hex { font-size: .75rem; letter-spacing: .06em; color: var(--azul-80); font-variant-numeric: lining-nums; }
html.mov :is(#cali27, #cali27-enc, #cali27-pie) .idt__st .stamp__face { transition: rotate .4s var(--ease-stamp); }
html.mov :is(#cali27, #cali27-enc, #cali27-pie) .idt__pliego:hover .idt__st .stamp__face { rotate: -4deg; }
@media (min-width: 900px) {
  :is(#cali27, #cali27-enc, #cali27-pie) .idt--pliego .idt__pliego { grid-column: c 1 / span 6; grid-row: 1; min-height: 480px; }
  :is(#cali27, #cali27-enc, #cali27-pie) .idt--pliego .idt__text { grid-column: c 7 / content-end; grid-row: 1; }
}
@media (max-width: 559px) { :is(#cali27, #cali27-enc, #cali27-pie) .idt__pliego { min-height: 440px; } :is(#cali27, #cali27-enc, #cali27-pie) .idt__st { width: 104px; } :is(#cali27, #cali27-enc, #cali27-pie) .idt__st--2, :is(#cali27, #cali27-enc, #cali27-pie) .idt__st--4 { left: 50%; } :is(#cali27, #cali27-enc, #cali27-pie) .idt__pm { width: 140px; left: 56%; top: 28%; } }

/* Convocatorias de Inicio: solo dos enlaces, uno por convocatoria, más grandes. */
:is(#cali27, #cali27-enc, #cali27-pie) .conv__head .conv__two { display: flex; flex-direction: column; align-items: flex-start; gap: 14px; }
:is(#cali27, #cali27-enc, #cali27-pie) .conv__two .link-arrow { font-size: clamp(1.25rem, .6vw + 1.05rem, 1.5rem); font-weight: 700; }

/* Muestra comercial: toldo de feria Oro y Azul, el stand ilustrado, cifras en estampillas y dos llamadas. */
:is(#cali27, #cali27-enc, #cali27-pie) .ind-band--feria { position: relative; overflow: clip; background: var(--azul); color: var(--papel); padding: calc(var(--air-m) + 56px) 0 var(--air-l); }
:is(#cali27, #cali27-enc, #cali27-pie) .ind-band__awning { position: absolute; inset: 0 0 auto; height: 60px; border-top: 6px solid var(--rojo); background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='128' height='60'%3E%3Cpath d='M0 0h64v36a32 22 0 0 1-64 0z' fill='%23EFAF21'/%3E%3Cpath d='M64 0h64v36a32 22 0 0 1-64 0z' fill='%23F8EFE1'/%3E%3C/svg%3E") 0 0 / 128px 60px repeat-x; }
:is(#cali27, #cali27-enc, #cali27-pie) .ind-band__grid { display: grid; gap: 56px; align-items: center; }
:is(#cali27, #cali27-enc, #cali27-pie) .ind-band--feria .h2 { color: var(--papel); }
:is(#cali27, #cali27-enc, #cali27-pie) .ind-band__claim { margin: 0 0 16px; font-size: clamp(1.5rem, 1.4vw + 1rem, 2.25rem); font-style: italic; line-height: 1.2; color: var(--oro); }
:is(#cali27, #cali27-enc, #cali27-pie) .ind-band--feria .lead { color: var(--papel); max-width: 34em; }
:is(#cali27, #cali27-enc, #cali27-pie) .ind-band--feria .actions { display: flex; flex-wrap: wrap; align-items: center; gap: 18px 22px; margin-top: 30px; }
:is(#cali27, #cali27-enc, #cali27-pie) .ind-band--feria .link-arrow { color: var(--papel); }
:is(#cali27, #cali27-enc, #cali27-pie) .btn--big { min-height: 60px; padding: 16px 32px; font-size: 1.125rem; }
:is(#cali27, #cali27-enc, #cali27-pie) .btn--ghost-papel { color: var(--papel); }
:is(#cali27, #cali27-enc, #cali27-pie) .btn--ghost-papel::before { background: transparent; }
:is(#cali27, #cali27-enc, #cali27-pie) .btn--ghost-papel::after { display: none; }
:is(#cali27, #cali27-enc, #cali27-pie) .btn--ghost-papel:hover { transform: none; color: var(--azul); }
:is(#cali27, #cali27-enc, #cali27-pie) .btn--ghost-papel:hover::before { background: var(--papel); }
html.mov :is(#cali27, #cali27-enc, #cali27-pie) .ind-band--feria .btn--big { animation: llamada 3.2s ease-in-out 2s infinite; }
@keyframes llamada { 0%, 88%, 100% { rotate: 0deg; } 91% { rotate: -2.5deg; } 94% { rotate: 2.5deg; } 97% { rotate: -1deg; } }
:is(#cali27, #cali27-enc, #cali27-pie) .ind-band__art { position: relative; }
:is(#cali27, #cali27-enc, #cali27-pie) .ind-band__frame { position: relative; padding: 12px; background: var(--papel); rotate: 1.5deg; outline: 3px solid var(--oro); outline-offset: 6px; }
:is(#cali27, #cali27-enc, #cali27-pie) .ind-band__frame img { display: block; width: 100%; height: auto; border: 1px solid var(--azul); }
:is(#cali27, #cali27-enc, #cali27-pie) .ind-band__facts { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; margin: -36px 3% 0; position: relative; z-index: 1; }
:is(#cali27, #cali27-enc, #cali27-pie) .ind-band__fact { --plate: var(--papel); --edge-c: var(--papel); padding: 16px 14px 14px; color: var(--azul); text-align: center; }
:is(#cali27, #cali27-enc, #cali27-pie) .ind-band__fact:nth-child(1) { --rot: -3deg; }
:is(#cali27, #cali27-enc, #cali27-pie) .ind-band__fact:nth-child(2) { --rot: 2deg; }
:is(#cali27, #cali27-enc, #cali27-pie) .ind-band__fact:nth-child(3) { --rot: 1.5deg; }
:is(#cali27, #cali27-enc, #cali27-pie) .ind-band__fact:nth-child(4) { --rot: -2deg; }
:is(#cali27, #cali27-enc, #cali27-pie) .ind-band__fact dt { font-size: clamp(2rem, 2vw + 1.2rem, 2.75rem); font-weight: 700; line-height: 1; color: var(--azul); font-variant-numeric: lining-nums; }
:is(#cali27, #cali27-enc, #cali27-pie) .ind-band__fact dd { margin: 6px 0 0; font-size: .9375rem; line-height: 1.25; color: var(--azul-profundo); }
:is(#cali27, #cali27-enc, #cali27-pie) .ind-band__fact--due { --plate: var(--oro); --edge-c: var(--oro); }
:is(#cali27, #cali27-enc, #cali27-pie) .ind-band__fact--due dt { font-size: clamp(1.375rem, 1vw + 1rem, 1.75rem); color: var(--rojo); }
@media (min-width: 1000px) {
  :is(#cali27, #cali27-enc, #cali27-pie) .ind-band__grid { grid-template-columns: minmax(0, 5fr) minmax(0, 6fr); gap: clamp(48px, 5vw, 88px); }
  :is(#cali27, #cali27-enc, #cali27-pie) .ind-band__facts { grid-template-columns: repeat(4, minmax(0, 1fr)); margin: -44px -3% 0; }
}
@media print { :is(#cali27, #cali27-enc, #cali27-pie) .ind-band__awning { display: none; } }
@media (forced-colors: active) { :is(#cali27, #cali27-enc, #cali27-pie) .ind-band__awning, :is(#cali27, #cali27-enc, #cali27-pie) .idt__pliego::before { display: none; } }

/* Revisión en pantalla (28 oct 2026, 1280 y 390 px). La pastilla «Ave del día» se partía letra por letra en móvil. */
:is(#cali27, #cali27-enc, #cali27-pie) .topbar__ave { flex: none; white-space: nowrap; }
@media (max-width: 419px) { :is(#cali27, #cali27-enc, #cali27-pie) .topbar__inner { gap: 8px; } :is(#cali27, #cali27-enc, #cali27-pie) .topbar__facts { min-width: 0; font-size: .8125rem; } :is(#cali27, #cali27-enc, #cali27-pie) .topbar__end { gap: 10px; flex: none; } :is(#cali27, #cali27-enc, #cali27-pie) .topbar__ave { letter-spacing: .03em; padding-right: 8px; } }
/* Postal WCPM fija: se aparta (sale por la izquierda) mientras taparía el ave del día de la portada (app.js). En móvil
   va en la misma fila que «Mapa», más baja, para no levantar una columna de botones sobre el contenido; el pie deja
   ese espacio libre al final de la página. */
:is(#cali27, #cali27-enc, #cali27-pie) .wcpm-fab { transition: rotate .25s var(--ease-in), transform .25s var(--ease-in), margin .35s var(--ease-in), opacity .35s ease, visibility .35s; }
/* margin y no translate: la animación de llegada (wcpm-llega) deja fijado su translate. */
:is(#cali27, #cali27-enc, #cali27-pie) .wcpm-fab.is-tucked { margin-left: -160px; opacity: 0; visibility: hidden; pointer-events: none; }
@media (max-width: 699px) {
  :is(#cali27, #cali27-enc, #cali27-pie) .wcpm-fab { width: 92px; height: 44px; bottom: max(16px, env(safe-area-inset-bottom, 0px)); left: calc(max(16px, env(safe-area-inset-left, 0px)) + var(--map-fab-w, 104px) + 10px); rotate: -2deg; }
  :is(#cali27, #cali27-enc, #cali27-pie) .wcpm-fab::before, :is(#cali27, #cali27-enc, #cali27-pie) .wcpm-fab::after { height: 4px; background-size: 16px 4px; }
  :is(#cali27, #cali27-enc, #cali27-pie) .wcpm-fab::after { background-position: 8px 0; }
  :is(#cali27, #cali27-enc, #cali27-pie) .wcpm-fab__card { inset: 4px 0; grid-template-columns: 1fr 28px; padding: 2px 5px 2px 7px; }
  :is(#cali27, #cali27-enc, #cali27-pie) .wcpm-fab__lines { gap: 3px; }
  :is(#cali27, #cali27-enc, #cali27-pie) .wcpm-fab__lines b { font-size: 12px; }
  :is(#cali27, #cali27-enc, #cali27-pie) .wcpm-fab__lines small { font-size: 7px; letter-spacing: .08em; }
  :is(#cali27, #cali27-enc, #cali27-pie) .wcpm-fab__lines i, :is(#cali27, #cali27-enc, #cali27-pie) .wcpm-fab__pm { display: none; }
  :is(#cali27, #cali27-enc, #cali27-pie) .wcpm-fab__stamp { width: 28px; padding: 3px; }
  :is(#cali27, #cali27-enc, #cali27-pie) .site-footer { padding-bottom: 76px; }
}
@media (prefers-reduced-motion: reduce) { :is(#cali27, #cali27-enc, #cali27-pie) .wcpm-fab, :is(#cali27, #cali27-enc, #cali27-pie) .wcpm-fab.is-tucked { transition: none; } }

/* Muestra comercial (28 oct 2026, 20:44): la regla antigua «.ind-band__facts div» (rejilla de dos columnas con filete)
   sacaba la leyenda de cada estampilla. Cifra arriba, leyenda debajo, dentro del sello; las cuatro del mismo tamaño. */
:is(#cali27, #cali27-enc, #cali27-pie) .ind-band__facts .ind-band__fact {
  display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 8px;
  min-height: 150px; padding: 22px 16px 20px; border: 0;
}
:is(#cali27, #cali27-enc, #cali27-pie) .ind-band__facts .ind-band__fact dt { color: var(--azul); white-space: nowrap; }
/* En una fila de cuatro quedaban de ~120 px y «3K · 5K» se partía: siempre 2 × 2, todas iguales. */
@media (min-width: 1000px) { :is(#cali27, #cali27-enc, #cali27-pie) .ind-band__facts { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; margin: -44px 4% 0; } }
:is(#cali27, #cali27-enc, #cali27-pie) .ind-band__facts .ind-band__fact--due dt { color: var(--rojo); }
:is(#cali27, #cali27-enc, #cali27-pie) .ind-band__facts .ind-band__fact dd { margin: 0; max-width: 13em; font-size: 1rem; color: var(--azul); text-wrap: balance; }
@media (max-width: 479px) { :is(#cali27, #cali27-enc, #cali27-pie) .ind-band__facts .ind-band__fact { min-height: 132px; padding: 18px 10px 16px; } :is(#cali27, #cali27-enc, #cali27-pie) .ind-band__facts .ind-band__fact dd { font-size: .875rem; } }

/* Noticias de Inicio: las vecinas que asoman a los lados se disuelven en el Papel en lugar de cortarse en seco, y el
   cambio de noticia es un fundido más largo. */
:is(#cali27, #cali27-enc, #cali27-pie) .newsx .carousel__viewport {
  -webkit-mask-image: linear-gradient(to right, transparent 1%, #000 8.5%, #000 91.5%, transparent 99%);
  mask-image: linear-gradient(to right, transparent 1%, #000 8.5%, #000 91.5%, transparent 99%);
}
@media (max-width: 599px) {
  :is(#cali27, #cali27-enc, #cali27-pie) .newsx .carousel__viewport {
    -webkit-mask-image: linear-gradient(to right, transparent, #000 5.5%, #000 94.5%, transparent);
    mask-image: linear-gradient(to right, transparent, #000 5.5%, #000 94.5%, transparent);
  }
}
@media print { :is(#cali27, #cali27-enc, #cali27-pie) .newsx .carousel__viewport { -webkit-mask-image: none; mask-image: none; } }

/* Cuenta regresiva en las tintas del Congreso (28 oct 2026, 21:06, Martin: «se ve fuera de estilo»): ya no es un
   tablero Azul oscuro sino una estampilla Papel como las otras celdas de la franja. Paletas Papel con cifras Azul en
   Crimson Pro, filete Azul al medio, etiqueta Rojo y un filete Oro bajo el título. */
:is(#cali27, #cali27-enc, #cali27-pie) .coil__cell--flap { --plate: var(--papel); --edge-c: var(--azul-40); background: none; color: var(--azul); border: 0; outline: 0; }
:is(#cali27, #cali27-enc, #cali27-pie) .coil .coil__cell--flap dt { color: var(--rojo); display: flex; align-items: center; gap: 10px; }
:is(#cali27, #cali27-enc, #cali27-pie) .coil .coil__cell--flap dt::after { content: ""; flex: 1; height: 3px; border-block: 1px solid var(--oro); }
:is(#cali27, #cali27-enc, #cali27-pie) .coil__cell--flap .flap { font-family: "Crimson Pro", Georgia, serif; font-weight: 700; --fs: clamp(24px, 2.1vw, 34px); }
:is(#cali27, #cali27-enc, #cali27-pie) .coil__cell--flap .flap__c { color: var(--azul); }
:is(#cali27, #cali27-enc, #cali27-pie) .coil__cell--flap .flap__top, :is(#cali27, #cali27-enc, #cali27-pie) .coil__cell--flap .flap__leaf--top { background: var(--papel); border: 1px solid var(--azul); border-bottom: 0; border-radius: 2px 2px 0 0; }
:is(#cali27, #cali27-enc, #cali27-pie) .coil__cell--flap .flap__bot, :is(#cali27, #cali27-enc, #cali27-pie) .coil__cell--flap .flap__leaf--bot { background: #F1E4CF; border: 1px solid var(--azul); border-top: 1px solid var(--azul); border-radius: 0 0 2px 2px; }
:is(#cali27, #cali27-enc, #cali27-pie) .coil__cell--flap .flap__row { gap: 4px; }
:is(#cali27, #cali27-enc, #cali27-pie) .coil__cell--flap .flap__lab { font-family: "Crimson Pro", Georgia, serif; font-size: .8125rem; letter-spacing: .14em; color: var(--azul-80, var(--azul)); }

/* ================================================================== «Pop» al pasar el cursor (28 oct 2026, 21:06)
   Pedido de Martin: postales, tarjetas, estampillas, botones e imágenes reaccionan al cursor con un pequeño salto y
   una sombra muy suave y difusa en Azul (excepción a «sin sombras»: solo esta, nunca desplazada ni de color).
   «translate» y «scale» (no «transform»): no chocan con las animaciones de entrada, que usan transform.
   Sin cursor (pantallas táctiles) no hay pop; con movimiento reducido queda solo la sombra. */
:is(#cali27, #cali27-enc, #cali27-pie) { --pop-shadow: 0 16px 36px -16px rgba(24, 53, 95, .30), 0 3px 10px -4px rgba(24, 53, 95, .12); }
:is(#cali27, #cali27-enc, #cali27-pie) .pop, :is(#cali27, #cali27-enc, #cali27-pie) .postcard, :is(#cali27, #cali27-enc, #cali27-pie) .duo-card, :is(#cali27, #cali27-enc, #cali27-pie) .sede-card, :is(#cali27, #cali27-enc, #cali27-pie) .map-card, :is(#cali27, #cali27-enc, #cali27-pie) .stages__item--featured, :is(#cali27, #cali27-enc, #cali27-pie) .coil__cell, :is(#cali27, #cali27-enc, #cali27-pie) .ind-band__fact, :is(#cali27, #cali27-enc, #cali27-pie) .ind-band__frame, :is(#cali27, #cali27-enc, #cali27-pie) .feria__card, :is(#cali27, #cali27-enc, #cali27-pie) .newsx .news-slide, :is(#cali27, #cali27-enc, #cali27-pie) .article__media, :is(#cali27, #cali27-enc, #cali27-pie) .photo-card, :is(#cali27, #cali27-enc, #cali27-pie) .modfull__item, :is(#cali27, #cali27-enc, #cali27-pie) .faq__item {
  transition: translate .22s var(--ease-in), scale .22s var(--ease-in), box-shadow .22s var(--ease-in);
}
@media (hover: hover) and (pointer: fine) {
  :is(#cali27, #cali27-enc, #cali27-pie) :is(.postcard, .duo-card, .sede-card, .map-card, .stages__item--featured, .ind-band__frame, .article__media, .modfull__item):is(:hover, :focus-within), :is(#cali27, #cali27-enc, #cali27-pie) :is(.coil__cell, .ind-band__fact, .feria__slide.is-current .feria__card):hover, :is(#cali27, #cali27-enc, #cali27-pie) .newsx .carousel__slide.is-current .news-slide:is(:hover, :focus-within), :is(#cali27, #cali27-enc, #cali27-pie) .faq__item:hover {
    translate: 0 -3px; scale: 1.012; box-shadow: var(--pop-shadow);
  }
  /* Ya tienen su propio movimiento: solo la sombra. */
  :is(#cali27, #cali27-enc, #cali27-pie) .hero__ave:is(:hover, :focus-visible), :is(#cali27, #cali27-enc, #cali27-pie) .wcpm-fab:is(:hover, :focus-visible), :is(#cali27, #cali27-enc, #cali27-pie) a.news__link:is(:hover, :focus-visible) .photo-card, :is(#cali27, #cali27-enc, #cali27-pie) .album__link:is(:hover, :focus-visible) .stamp { box-shadow: var(--pop-shadow); }
  /* Botones: se levantan en lugar de hundirse; la tinta Oro se separa un poco más (registro de serigrafía). */
  :is(#cali27, #cali27-enc, #cali27-pie) .btn { transition: translate .2s var(--ease-in), transform .2s var(--ease-in), box-shadow .2s var(--ease-in); }
  :is(#cali27, #cali27-enc, #cali27-pie) .btn:not([aria-disabled="true"]):is(:hover, :focus-visible) { transform: none; translate: 0 -2px; box-shadow: var(--pop-shadow); }
  :is(#cali27, #cali27-enc, #cali27-pie) .btn:not([aria-disabled="true"]):active { translate: 0 0; transform: translate(4px, 4px); box-shadow: none; }
  :is(#cali27, #cali27-enc, #cali27-pie) .map-fab:is(:hover, :focus-visible), :is(#cali27, #cali27-enc, #cali27-pie) .album-fab:is(:hover, :focus-visible) { translate: 0 -2px; box-shadow: var(--pop-shadow); }
}
@media (prefers-reduced-motion: reduce) {
  :is(#cali27, #cali27-enc, #cali27-pie) :is(.postcard, .duo-card, .sede-card, .map-card, .stages__item--featured, .coil__cell, .ind-band__fact, .ind-band__frame,
      .feria__card, .news-slide, .article__media, .photo-card, .modfull__item, .faq__item, .btn, .map-fab, .album-fab):is(:hover, :focus-visible, :focus-within) { translate: none !important; scale: none !important; }
}

/* Botón «Álbum» fijo abajo a la derecha (28 oct 2026), gemelo del de «Mapa». El aviso de logros sube por encima. */
:is(#cali27, #cali27-enc, #cali27-pie) .btn.album-fab {
  position: fixed; z-index: 30; margin: 0;
  right: max(16px, env(safe-area-inset-right, 0px));
  bottom: max(16px, env(safe-area-inset-bottom, 0px));
  gap: .5em; padding-inline: 14px 18px;
}
:is(#cali27, #cali27-enc, #cali27-pie) .btn.album-fab[hidden] { display: none; }
:is(#cali27, #cali27-enc, #cali27-pie) .toast { bottom: calc(max(16px, env(safe-area-inset-bottom, 0px)) + 60px); }
@media (max-width: 359px) { :is(#cali27, #cali27-enc, #cali27-pie) .btn.album-fab { padding-inline: 10px 12px; } :is(#cali27, #cali27-enc, #cali27-pie) .btn.album-fab span { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; } }

/* ================================================================== Inicio · «Una sede, dos experiencias» (28 oct 2026)
   build.mjs duoBlock(). Una carta que mezcla las dos identidades: cuerpo Papel con filete Azul y esquinas Oro (Cali),
   borde de correo aéreo WCPM arriba y la franja aérea del Congreso abajo, forro lavanda en la solapa, título en Crimson Pro
   con la segunda mitad en cursiva morada sobre la línea de pulso magenta, y un sello con los dos símbolos. Al abrirse
   (app.js «carta de dos congresos»: al verla o al tocarla) la solapa se levanta, la carta da un pequeño salto y
   salen dos postales: la del Congreso a un lado y la del WCPM al otro. */
:is(#cali27, #cali27-enc, #cali27-pie) .duo {
  --wcpm-magenta: #EC2474; --wcpm-morado: #5E439B; --wcpm-ciruela: #580A47; --wcpm-lavanda: #F4EEF6;
  --wcpm-font: "Montserrat", "Segoe UI", system-ui, sans-serif;
  padding-block: var(--air-m) var(--air-l);
}
:is(#cali27, #cali27-enc, #cali27-pie) .duo__stage { display: grid; gap: 40px 28px; align-items: center; justify-items: center; }
@media (min-width: 1100px) {
  :is(#cali27, #cali27-enc, #cali27-pie) .duo__stage { grid-template-columns: minmax(0, 1fr) minmax(400px, 1.05fr) minmax(0, 1fr); }
  :is(#cali27, #cali27-enc, #cali27-pie) .duo__env { grid-column: 2; grid-row: 1; }
  :is(#cali27, #cali27-enc, #cali27-pie) .duo-card--cali { grid-column: 1; grid-row: 1; --tilt-card: -2.5deg; }
  :is(#cali27, #cali27-enc, #cali27-pie) .duo-card--wcpm { grid-column: 3; grid-row: 1; --tilt-card: 2.5deg; }
}
@media (min-width: 700px) and (max-width: 1099px) {
  :is(#cali27, #cali27-enc, #cali27-pie) .duo__stage { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  :is(#cali27, #cali27-enc, #cali27-pie) .duo__env { grid-column: 1 / -1; }
  :is(#cali27, #cali27-enc, #cali27-pie) .duo-card--cali { --tilt-card: -1.5deg; }
  :is(#cali27, #cali27-enc, #cali27-pie) .duo-card--wcpm { --tilt-card: 1.5deg; }
}

/* -- la carta */
/* El sobre no crea contexto de apilamiento (sin z-index, transform ni perspective): así sus capas se intercalan con
   las postales. Orden: dorso (0) · solapa abierta (1) · postales (2) · bolsillo delantero (3) · texto (4) ·
   solapa cerrada (5) · sello (6) · botón (7). --mouth: altura de la boca del sobre. */
:is(#cali27, #cali27-enc, #cali27-pie) .duo__env {
  --mouth: 26px;
  position: relative; width: min(100%, 460px); min-height: 420px;
  margin-top: 150px; /* sitio para la solapa abierta, que se levanta por encima */
  padding: 200px clamp(24px, 3vw, 36px) 52px; color: var(--azul);
}
:is(#cali27, #cali27-enc, #cali27-pie) .duo__back { position: absolute; z-index: 0; inset: 0; background: #EFE3CF; border: 1.5px solid var(--azul); pointer-events: none; }
:is(#cali27, #cali27-enc, #cali27-pie) .duo__face {
  position: absolute; z-index: 3; inset: var(--mouth) 0 0; background: var(--papel); pointer-events: none;
  border: 1.5px solid var(--azul); border-top: 0; outline: 1px solid var(--wcpm-magenta); outline-offset: -9px;
}
:is(#cali27, #cali27-enc, #cali27-pie) .duo__face::before, :is(#cali27, #cali27-enc, #cali27-pie) .duo__face::after { content: ""; position: absolute; width: 30px; height: 33px; bottom: 22px; background: url("assets/Ornamento_Esquina_Oro.svg") center / contain no-repeat; }
:is(#cali27, #cali27-enc, #cali27-pie) .duo__face::before { left: 20px; transform: scaleY(-1); }
:is(#cali27, #cali27-enc, #cali27-pie) .duo__face::after { right: 20px; transform: rotate(180deg); }
/* Boca del sobre: filete Azul con un pliegue punteado debajo y la muesca para el pulgar al centro. */
:is(#cali27, #cali27-enc, #cali27-pie) .duo__mouth { position: absolute; z-index: 1; left: -1.5px; right: -1.5px; top: 0; height: 7px; border-top: 2px solid var(--azul); border-bottom: 1px dotted var(--azul-40); }
:is(#cali27, #cali27-enc, #cali27-pie) .duo__notch { position: absolute; z-index: 2; left: 50%; top: -1px; width: 52px; height: 24px; translate: -50% 0; background: #EFE3CF; border: 2px solid var(--azul); border-top: 0; border-radius: 0 0 26px 26px; }
:is(#cali27, #cali27-enc, #cali27-pie) .duo__edge { position: absolute; inset-inline: 0; height: 12px; pointer-events: none; }
:is(#cali27, #cali27-enc, #cali27-pie) .duo__edge--wcpm { top: 0; background: url("assets/WCPM_Borde.svg") 0 0 / 48px 12px repeat-x; }
:is(#cali27, #cali27-enc, #cali27-pie) .duo__edge--cali { bottom: 0; background: url("assets/Franja_Correo_Aereo.svg") 0 0 / auto 12px repeat-x; }
:is(#cali27, #cali27-enc, #cali27-pie) .duo__flap { position: absolute; z-index: 5; top: 12px; left: 0; right: 0; height: 170px; transform-origin: 50% 0; transform: perspective(1100px) rotateX(0deg); transform-style: preserve-3d; pointer-events: none; }
:is(#cali27, #cali27-enc, #cali27-pie) .duo__flap-front, :is(#cali27, #cali27-enc, #cali27-pie) .duo__flap-back { position: absolute; inset: 0; backface-visibility: hidden; clip-path: polygon(0 0, 100% 0, 50% 100%); }
:is(#cali27, #cali27-enc, #cali27-pie) .duo__flap-front { background: var(--azul); }
:is(#cali27, #cali27-enc, #cali27-pie) .duo__flap-front::after { content: ""; position: absolute; inset: 0; background: var(--papel); clip-path: polygon(2px 0, calc(100% - 2px) 0, 50% calc(100% - 2.5px)); }
:is(#cali27, #cali27-enc, #cali27-pie) .duo__flap-back { transform: rotateX(180deg); background: var(--azul); clip-path: polygon(0 100%, 100% 100%, 50% 0); } /* invertida: con los dos giros queda con la base junto a la carta */
:is(#cali27, #cali27-enc, #cali27-pie) .duo__flap-back::after { content: ""; position: absolute; inset: 0; background: var(--papel); clip-path: polygon(2px 100%, calc(100% - 2px) 100%, 50% 2.5px); }
/* 28 oct 2026, 21:23 (Martin): forro de la solapa en Papel con filete Azul, como el frente; sin lavanda ni rosa. */
:is(#cali27, #cali27-enc, #cali27-pie) .duo__seal {
  position: absolute; z-index: 6; left: 50%; top: 142px; translate: -50% 0; display: flex; align-items: center; justify-content: center; gap: 4px;
  width: 84px; height: 84px; border-radius: 50%; background: var(--papel);
  border: 3px solid var(--oro); outline: 1.5px solid var(--wcpm-magenta); outline-offset: -8px;
}
:is(#cali27, #cali27-enc, #cali27-pie) .duo__seal img { width: 26px; height: 26px; object-fit: contain; }
:is(#cali27, #cali27-enc, #cali27-pie) .duo__letter { position: relative; z-index: 4; text-align: center; }
:is(#cali27, #cali27-enc, #cali27-pie) .duo__kicker { margin: 0 0 10px; font-family: var(--wcpm-font); font-size: .75rem; font-weight: 800; letter-spacing: .2em; text-transform: uppercase; color: var(--wcpm-magenta); }
:is(#cali27, #cali27-enc, #cali27-pie) .duo__title { margin: 0; font-family: "Crimson Pro", Georgia, serif; font-weight: 700; font-size: clamp(1.75rem, 1.6vw + 1.1rem, 2.375rem); line-height: 1.08; color: var(--azul); }
:is(#cali27, #cali27-enc, #cali27-pie) .duo__title em { display: block; font-style: italic; font-weight: 600; color: var(--wcpm-morado); }
:is(#cali27, #cali27-enc, #cali27-pie) .duo__pulse { display: block; width: 72%; height: 26px; margin: 10px auto 14px; background: url("assets/WCPM_Pulso.svg") center / 100% 100% no-repeat; }
:is(#cali27, #cali27-enc, #cali27-pie) .duo__body { margin: 0 auto; max-width: 30em; font-size: 1.0625rem; line-height: 1.5; color: var(--azul-profundo); }
:is(#cali27, #cali27-enc, #cali27-pie) .duo__open { position: absolute; inset: 0; z-index: 7; width: 100%; padding: 0; border: 0; background: none; cursor: pointer; display: none; }
:is(#cali27, #cali27-enc, #cali27-pie) .duo__open:focus-visible { outline: 3px solid var(--wcpm-magenta); outline-offset: 4px; }
html.mov :is(#cali27, #cali27-enc, #cali27-pie) .duo:not(.is-open) .duo__open { display: block; }

/* -- las dos postales */
:is(#cali27, #cali27-enc, #cali27-pie) .duo-card { position: relative; z-index: 2; width: min(100%, 400px); padding: 64px 28px 30px; rotate: var(--tilt-card, 0deg); display: flex; flex-direction: column; }
:is(#cali27, #cali27-enc, #cali27-pie) .duo-card .actions { margin: 22px 0 0; }
:is(#cali27, #cali27-enc, #cali27-pie) .duo-card .btn { align-self: flex-start; }
:is(#cali27, #cali27-enc, #cali27-pie) .duo-card__caption { position: absolute; top: 24px; inset-inline: 0; margin: 0; text-align: center; font-size: .6875rem; font-weight: 600; letter-spacing: .3em; text-transform: uppercase; }
:is(#cali27, #cali27-enc, #cali27-pie) .duo-card__franking { position: absolute; top: 18px; right: 16px; width: 150px; height: 110px; pointer-events: none; }
:is(#cali27, #cali27-enc, #cali27-pie) .duo-card__franking .stamp { position: absolute; right: 0; top: 0; width: 76px; --rot: 4deg; }
:is(#cali27, #cali27-enc, #cali27-pie) .duo-card__franking .duo-card__pm { width: 92px; left: 0; top: 30px; --rot: -12deg; z-index: 1; }
:is(#cali27, #cali27-enc, #cali27-pie) .duo-card__lines { margin: 20px 0 0; padding: 0; list-style: none; }
:is(#cali27, #cali27-enc, #cali27-pie) .duo-card__lines li { padding: 9px 0 4px; border-bottom: 1px solid var(--line-strong); }
:is(#cali27, #cali27-enc, #cali27-pie) .duo-card--cali { background: var(--papel); border: 1.5px solid var(--azul); outline: 1px solid var(--azul); outline-offset: -9px; color: var(--azul); }
:is(#cali27, #cali27-enc, #cali27-pie) .duo-card--cali .postcard__corner { width: 26px; height: 28px; }
:is(#cali27, #cali27-enc, #cali27-pie) .duo-card--cali .postcard__corner--tl { top: 14px; left: 14px; }
:is(#cali27, #cali27-enc, #cali27-pie) .duo-card--cali .postcard__corner--tr { display: none; } /* ahí va el franqueo */
:is(#cali27, #cali27-enc, #cali27-pie) .duo-card--cali .postcard__corner--bl { bottom: 14px; left: 14px; }
:is(#cali27, #cali27-enc, #cali27-pie) .duo-card--cali .postcard__corner--br { bottom: 14px; right: 14px; }
:is(#cali27, #cali27-enc, #cali27-pie) .duo-card--cali .duo-card__caption { color: var(--azul-80); }
:is(#cali27, #cali27-enc, #cali27-pie) .duo-card__iso { width: 64px; height: auto; margin: 46px 0 14px; }
:is(#cali27, #cali27-enc, #cali27-pie) .duo-card__title { margin: 0; font-family: "Crimson Pro", Georgia, serif; font-size: 1.375rem; font-weight: 700; line-height: 1.15; }
:is(#cali27, #cali27-enc, #cali27-pie) .duo-card--cali .duo-card__title { color: var(--azul); }
:is(#cali27, #cali27-enc, #cali27-pie) .duo-card__lema { margin: 10px 0 0; font-style: italic; color: var(--rojo); line-height: 1.35; }
:is(#cali27, #cali27-enc, #cali27-pie) .duo-card--cali .duo-card__lines li { font-style: italic; color: var(--azul-profundo); }
:is(#cali27, #cali27-enc, #cali27-pie) .duo-card--wcpm {
  overflow: hidden; background: var(--wcpm-lavanda); color: var(--wcpm-ciruela);
  border: 2px solid var(--wcpm-morado); outline: 1px solid var(--wcpm-magenta); outline-offset: -12px; padding-block: 72px 40px;
}
:is(#cali27, #cali27-enc, #cali27-pie) .duo-card--wcpm .wcpm-panels { width: 150px; height: 170px; bottom: -50px; }
:is(#cali27, #cali27-enc, #cali27-pie) .duo-card--wcpm .duo-card__caption { top: 26px; font-family: var(--wcpm-font); font-weight: 700; color: var(--wcpm-morado); }
:is(#cali27, #cali27-enc, #cali27-pie) .duo-card--wcpm .duo-card__franking .stamp { width: 80px; }
:is(#cali27, #cali27-enc, #cali27-pie) .duo-card__logo { position: relative; z-index: 1; margin: 84px 0 0; }
:is(#cali27, #cali27-enc, #cali27-pie) .duo-card__logo img { width: min(100%, 250px); height: auto; }
:is(#cali27, #cali27-enc, #cali27-pie) .duo-card--wcpm .duo-card__title { position: relative; z-index: 1; font-family: var(--wcpm-font); font-weight: 800; text-transform: uppercase; color: var(--wcpm-morado); }
:is(#cali27, #cali27-enc, #cali27-pie) .duo-card--wcpm .wcpm-pulse { position: relative; z-index: 1; height: 30px; margin: 18px 0 0; }
:is(#cali27, #cali27-enc, #cali27-pie) .duo-card--wcpm .duo-card__lines, :is(#cali27, #cali27-enc, #cali27-pie) .duo-card--wcpm .actions { position: relative; z-index: 1; }
:is(#cali27, #cali27-enc, #cali27-pie) .duo-card--wcpm .duo-card__lines li { font-family: var(--wcpm-font); font-weight: 600; font-size: .875rem; letter-spacing: .06em; text-transform: uppercase; border-color: rgba(94, 67, 155, .35); }

/* -- cerrada (solo con movimiento): las postales esperan dentro del sobre. Al abrirse (29 oct 2026) salen por la boca:
   suben desde detrás del bolsillo delantero, asoman por encima y luego se abren a los lados. app.js calcula --dx,
   --dy-in, --dy-out y --s-in con la posición real del sobre (centro del bolsillo, boca). */
html.mov :is(#cali27, #cali27-enc, #cali27-pie) .duo:not(.is-open) .duo-card { visibility: hidden; opacity: 0; }
html.mov :is(#cali27, #cali27-enc, #cali27-pie) .duo.is-open .duo-card { animation: duo-sale .85s cubic-bezier(.33, .6, .25, 1) .73s both; } /* 29 oct: la mitad del tiempo */
html.mov :is(#cali27, #cali27-enc, #cali27-pie) .duo.is-open .duo-card--wcpm { animation-delay: .9s; }
@keyframes duo-sale {
  0% { transform: translate(var(--dx, 0px), var(--dy-in, 0px)) scale(var(--s-in, .7)); }
  48% { transform: translate(var(--dx, 0px), var(--dy-out, 0px)) scale(.84); }
  100% { transform: none; }
}
html.mov :is(#cali27, #cali27-enc, #cali27-pie) .duo__flap { transition: transform .8s cubic-bezier(.45, .05, .25, 1), z-index 0s .4s; }
html.mov :is(#cali27, #cali27-enc, #cali27-pie) .duo.is-open .duo__flap, html:not(.mov) :is(#cali27, #cali27-enc, #cali27-pie) .duo__flap { transform: perspective(1100px) rotateX(180deg); z-index: 1; }
html.mov :is(#cali27, #cali27-enc, #cali27-pie) .duo__seal { transition: opacity .25s ease, scale .25s ease; }
html.mov :is(#cali27, #cali27-enc, #cali27-pie) .duo.is-open .duo__seal, html:not(.mov) :is(#cali27, #cali27-enc, #cali27-pie) .duo__seal { opacity: 0; scale: .6; }
/* Saltito al terminar de abrir: el mismo desplazamiento en el dorso, el bolsillo y el texto (sin escalar, para que las
   capas no se descuadren y sin crear un contexto de apilamiento en el sobre). */
html.mov :is(#cali27, #cali27-enc, #cali27-pie) .duo.is-open :is(.duo__back, .duo__face, .duo__letter) { animation: duo-pop .4s ease-in-out .55s both; }
@keyframes duo-pop { 0%, 100% { transform: none; } 45% { transform: translateY(-7px); } }
@media (prefers-reduced-motion: reduce) {
  html.mov :is(#cali27, #cali27-enc, #cali27-pie) .duo .duo-card { visibility: visible !important; opacity: 1 !important; transform: none !important; animation: none !important; }
  html.mov :is(#cali27, #cali27-enc, #cali27-pie) .duo .duo__flap { transform: perspective(1100px) rotateX(180deg); z-index: 1; transition: none; }
  html.mov :is(#cali27, #cali27-enc, #cali27-pie) .duo .duo__seal { opacity: 0; }
  html.mov :is(#cali27, #cali27-enc, #cali27-pie) .duo .duo__open { display: none !important; }
}
@media print { :is(#cali27, #cali27-enc, #cali27-pie) .duo__flap, :is(#cali27, #cali27-enc, #cali27-pie) .duo__seal, :is(#cali27, #cali27-enc, #cali27-pie) .duo__open { display: none; } }
@media (max-width: 479px) {
  :is(#cali27, #cali27-enc, #cali27-pie) .duo__env { padding-top: 184px; min-height: 0; }
  :is(#cali27, #cali27-enc, #cali27-pie) .duo__flap { height: 150px; }
  :is(#cali27, #cali27-enc, #cali27-pie) .duo__seal { top: 124px; width: 72px; height: 72px; }
  :is(#cali27, #cali27-enc, #cali27-pie) .duo__seal img { width: 22px; height: 22px; }
  :is(#cali27, #cali27-enc, #cali27-pie) .duo-card { padding-inline: 22px; }
}

/* ================================================================== Ilustraciones pequeñas: postal o sello (28 oct 2026, 21:32)
   Pedido de Martin: toda ilustración pequeña se lee como postal o como sello. Postal: las ilustraciones IL de
   apoyo (.media--ilustracion, .postal-ill) en una tarjeta Papel con doble filete Azul, leve inclinación y un
   franqueo Oro en la esquina. Sello: las aves sueltas (rejilla y bandada de Identidad, cabeceras con ave) en un
   disco Papel con anillo Oro y filete Azul. No aplica al afiche (keyart), a los paisajes ni a las aves del juego. */
:is(#cali27, #cali27-enc, #cali27-pie) .media--ilustracion, :is(#cali27, #cali27-enc, #cali27-pie) .postal-ill {
  position: relative; background: var(--papel); padding: clamp(12px, 1.6vw, 18px);
  border: 1.5px solid var(--azul); outline: 1px solid var(--azul); outline-offset: -8px; rotate: var(--tilt-p, -1deg);
}
:is(#cali27, #cali27-enc, #cali27-pie) .media--ilustracion img, :is(#cali27, #cali27-enc, #cali27-pie) .postal-ill > img { position: relative; z-index: 0; object-fit: contain; }
:is(#cali27, #cali27-enc, #cali27-pie) .media--ilustracion::after, :is(#cali27, #cali27-enc, #cali27-pie) .postal-ill::after {
  content: ""; position: absolute; z-index: 1; top: 14px; right: 14px; width: 22px; height: 26px;
  background: var(--oro); outline: 2px dotted var(--papel); outline-offset: -4px; rotate: 4deg; pointer-events: none;
}
:is(#cali27, #cali27-enc, #cali27-pie) .topic:nth-child(even) .media--ilustracion, :is(#cali27, #cali27-enc, #cali27-pie) .duo2__b .media--ilustracion { --tilt-p: 1.2deg; }
:is(#cali27, #cali27-enc, #cali27-pie) .postal-ill { max-width: 420px; }
:is(#cali27, #cali27-enc, #cali27-pie) .postal-ill::after { display: none; } /* lleva estampilla de verdad */
:is(#cali27, #cali27-enc, #cali27-pie) .postal-ill__stamp { position: absolute; z-index: 2; top: -18px; right: -14px; width: 92px; --rot: 5deg; }
:is(#cali27, #cali27-enc, #cali27-pie) .ph.media--ilustracion::after { display: none; } /* marcador sin ilustración todavía */

:is(#cali27, #cali27-enc, #cali27-pie) .bird-grid > img.ave, :is(#cali27, #cali27-enc, #cali27-pie) .flock > img.ave, :is(#cali27, #cali27-enc, #cali27-pie) .page-head__art--bird > img.ave {
  aspect-ratio: 1; object-fit: contain; padding: 15%; background: var(--papel); border-radius: 50%;
  border: 3px solid var(--oro); outline: 1.5px solid var(--azul); outline-offset: -10px;
}
:is(#cali27, #cali27-enc, #cali27-pie) .flock > img.ave { width: 46%; }
:is(#cali27, #cali27-enc, #cali27-pie) .flock__bird--1 { left: 2%; top: 0; }
:is(#cali27, #cali27-enc, #cali27-pie) .flock__bird--2 { right: 2%; top: 22%; }
:is(#cali27, #cali27-enc, #cali27-pie) .flock__bird--3 { left: 24%; bottom: 0; }
@media (forced-colors: active) { :is(#cali27, #cali27-enc, #cali27-pie) .media--ilustracion::after { display: none; } }

/* Botón de sonidos (28 oct 2026): círculo pequeño junto a «Mapa» (escritorio) o encima de él (móvil). Tachado = apagado. */
:is(#cali27, #cali27-enc, #cali27-pie) .sound-fab {
  position: fixed; z-index: 30; display: grid; place-items: center; width: 38px; height: 38px; padding: 0;
  left: calc(max(16px, env(safe-area-inset-left, 0px)) + var(--map-fab-w, 104px) + 10px);
  bottom: calc(max(16px, env(safe-area-inset-bottom, 0px)) + 2px);
  background: var(--papel); color: var(--azul); border: 1.5px solid var(--azul); border-radius: 50%; cursor: pointer;
  outline: 1px solid var(--oro); outline-offset: 2px;
  transition: translate .2s var(--ease-in), box-shadow .2s var(--ease-in), background .2s ease;
}
:is(#cali27, #cali27-enc, #cali27-pie) .sound-fab[hidden] { display: none; }
:is(#cali27, #cali27-enc, #cali27-pie) .sound-fab:hover { background: var(--oro); }
:is(#cali27, #cali27-enc, #cali27-pie) .sound-fab:focus-visible { outline: 3px solid var(--rojo); outline-offset: 3px; }
:is(#cali27, #cali27-enc, #cali27-pie) .sound-fab svg { display: block; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
:is(#cali27, #cali27-enc, #cali27-pie) .sound-fab__body { fill: currentColor; }
:is(#cali27, #cali27-enc, #cali27-pie) .sound-fab__mute { display: none; }
:is(#cali27, #cali27-enc, #cali27-pie) .sound-fab.is-off .sound-fab__waves { display: none; }
:is(#cali27, #cali27-enc, #cali27-pie) .sound-fab.is-off .sound-fab__mute { display: inline; }
:is(#cali27, #cali27-enc, #cali27-pie) .sound-fab.is-off { color: var(--azul-80); }
@media (hover: hover) and (pointer: fine) { :is(#cali27, #cali27-enc, #cali27-pie) .sound-fab:is(:hover, :focus-visible) { translate: 0 -2px; box-shadow: var(--pop-shadow); } }
@media print { :is(#cali27, #cali27-enc, #cali27-pie) .sound-fab { display: none !important; } }
/* La postal WCPM, en escritorio sobre «Mapa»; en móvil, a la derecha del botón de sonido. */
@media (max-width: 699px) {
  :is(#cali27, #cali27-enc, #cali27-pie) .wcpm-fab { left: calc(max(16px, env(safe-area-inset-left, 0px)) + var(--map-fab-w, 104px) + 10px + 38px + 8px); width: 80px; }
  :is(#cali27, #cali27-enc, #cali27-pie) .wcpm-fab__card { grid-template-columns: 1fr 24px; }
  :is(#cali27, #cali27-enc, #cali27-pie) .wcpm-fab__stamp { width: 24px; }
  :is(#cali27, #cali27-enc, #cali27-pie) .btn.album-fab { padding-inline: 12px 14px; }
}
@media (max-width: 419px) {
  /* 390 px: Mapa · sonido · WCPM · Álbum en una fila; el Álbum queda solo con su ícono. */
  :is(#cali27, #cali27-enc, #cali27-pie) .btn.album-fab span { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
  :is(#cali27, #cali27-enc, #cali27-pie) .btn.album-fab { padding-inline: 11px; }
  :is(#cali27, #cali27-enc, #cali27-pie) .btn.album-fab .map-fab__icon { margin: 0; }
}

/* Aves lejanas (app.js flyFar): diminutas, tenues, alguna en Oro; cruzan en uno u otro sentido muy despacio. */
:is(#cali27, #cali27-enc, #cali27-pie) .vuelo--lejos { --anim: vuelo-cruza; opacity: .5; } /* 29 oct: más grandes y visibles (Martin) */
:is(#cali27, #cali27-enc, #cali27-pie) .vuelo--lejos.vuelo--der { --anim: vuelo-vuelve; }
:is(#cali27, #cali27-enc, #cali27-pie) .vuelo--lejos.vuelo--der .vuelo__v { scale: calc(var(--s, 1) * -1) var(--s, 1); }
:is(#cali27, #cali27-enc, #cali27-pie) .vuelo--lejos.vuelo--oro { color: var(--oro); opacity: .75; }
:is(#cali27, #cali27-enc, #cali27-pie) .vuelo--lejos .vuelo__v { animation-duration: 5s; }


/* Identidad · Isaacs sobre los Farallones (28 oct 2026). IL-11 con borde de serigrafía horneado en la imagen (puntos
   de semitono y grano que se achican hacia afuera; scripts/borde-serigrafia.py), sin máscaras ni degradados en CSS. */
:is(#cali27, #cali27-enc, #cali27-pie) .isaacs { position: relative; overflow: hidden; padding-block: clamp(48px, 7vw, 104px); }
:is(#cali27, #cali27-enc, #cali27-pie) .isaacs__art { display: block; pointer-events: none; }
:is(#cali27, #cali27-enc, #cali27-pie) .isaacs__wrap { position: relative; z-index: 1; }
:is(#cali27, #cali27-enc, #cali27-pie) .isaacs__text .lead { color: var(--azul); }
@media (min-width: 900px) {
  :is(#cali27, #cali27-enc, #cali27-pie) .isaacs { min-height: clamp(560px, 50vw, 760px); display: grid; align-items: center; }
  :is(#cali27, #cali27-enc, #cali27-pie) .isaacs__art {
    position: absolute; z-index: 0; right: -6vw; top: 50%; translate: 0 -50%; width: min(60vw, 1000px); height: auto;
  }
  :is(#cali27, #cali27-enc, #cali27-pie) .isaacs__text { max-width: min(32em, 40%); }
}
@media (max-width: 899px) {
  :is(#cali27, #cali27-enc, #cali27-pie) .isaacs { padding-bottom: 0; }
  :is(#cali27, #cali27-enc, #cali27-pie) .isaacs__art {
    position: relative; width: 116%; max-width: none; margin: 8px 0 0 -8%;
  }
  :is(#cali27, #cali27-enc, #cali27-pie) .isaacs { display: flex; flex-direction: column-reverse; }
}

/* ================================================================== Sellos (28 oct 2026, 21:48) · build.mjs seal()
   Lacre de borde irregular con aro en relieve (filete claro y sombra interior en la misma tinta), leyenda curva,
   ranura y una cara Papel donde el ave llena el centro; grano de semitono encima. Tintas: rojo (lacre), azul, oro. */
:is(#cali27, #cali27-enc, #cali27-pie) .seal { --wax: var(--rojo); --wax-deep: #9E2219; --wax-ink: var(--papel); position: relative; display: block; width: 100%; aspect-ratio: 1; rotate: var(--seal-rot, -4deg); }
:is(#cali27, #cali27-enc, #cali27-pie) .seal--azul { --wax: var(--azul); --wax-deep: #0F2341; --wax-ink: var(--papel); }
:is(#cali27, #cali27-enc, #cali27-pie) .seal--oro { --wax: var(--oro); --wax-deep: #B9820E; --wax-ink: var(--azul); }
:is(#cali27, #cali27-enc, #cali27-pie) .seal__wax { position: absolute; inset: 0; width: 100%; height: 100%; overflow: visible; }
:is(#cali27, #cali27-enc, #cali27-pie) .seal__edge { fill: var(--wax); stroke: var(--wax-deep); stroke-width: 2.5; }
:is(#cali27, #cali27-enc, #cali27-pie) .seal__rim { fill: none; stroke: var(--wax-deep); stroke-width: 5; opacity: .55; }
:is(#cali27, #cali27-enc, #cali27-pie) .seal__groove { fill: none; stroke: var(--wax-ink); stroke-width: 1.4; stroke-dasharray: 2 3; opacity: .85; }
:is(#cali27, #cali27-enc, #cali27-pie) .seal__text { fill: var(--wax-ink); font-family: "Montserrat", sans-serif; font-weight: 800; font-size: 13.5px; letter-spacing: .08em; }
:is(#cali27, #cali27-enc, #cali27-pie) .seal__face { fill: var(--papel); stroke: var(--wax-deep); stroke-width: 3; }
:is(#cali27, #cali27-enc, #cali27-pie) .seal__img { position: absolute; z-index: 1; left: 21%; top: 21%; width: 58%; height: 58%; object-fit: contain; padding: 0; border: 0; outline: 0; background: none; border-radius: 0; aspect-ratio: auto; }
:is(#cali27, #cali27-enc, #cali27-pie) .seal__grain {
  position: absolute; inset: 2%; z-index: 2; border-radius: 50%; pointer-events: none; mix-blend-mode: multiply; opacity: .18;
  background: radial-gradient(circle, var(--wax-deep) 0 .8px, transparent 1.2px) 0 0 / 5px 5px;
}
:is(#cali27, #cali27-enc, #cali27-pie) .bird-grid > .seal:nth-child(1) { --seal-rot: -6deg; }
:is(#cali27, #cali27-enc, #cali27-pie) .bird-grid > .seal:nth-child(2) { --seal-rot: 5deg; margin-top: 18%; }
:is(#cali27, #cali27-enc, #cali27-pie) .bird-grid > .seal:nth-child(3) { --seal-rot: 3deg; margin-top: -10%; }
:is(#cali27, #cali27-enc, #cali27-pie) .bird-grid > .seal:nth-child(4) { --seal-rot: -3deg; margin-top: 8%; }
html.mov :is(#cali27, #cali27-enc, #cali27-pie) .seal { transition: rotate .4s var(--ease-stamp), scale .3s var(--ease-in); }
@media (hover: hover) and (pointer: fine) { html.mov :is(#cali27, #cali27-enc, #cali27-pie) .seal:hover { rotate: 0deg; scale: 1.03; } }
@media (forced-colors: active) { :is(#cali27, #cali27-enc, #cali27-pie) .seal__grain { display: none; } }

/* El ringlete que gira en Identidad asomaba 1–6 px por la derecha en teléfonos. */
:is(#cali27, #cali27-enc, #cali27-pie) .elementos { overflow-x: clip; }

/* Convocatorias (28 oct 2026, 22:06, Martin). Archivos disponibles: mano del cursor e ícono de descarga (bandeja con
   flecha) en Azul; los que aún no están, con «Próximamente», conservan el cursor de bloqueo y no llevan ícono. */
:is(#cali27, #cali27-enc, #cali27-pie) .download[href] { cursor: pointer; color: var(--azul-80); }
:is(#cali27, #cali27-enc, #cali27-pie) .download[aria-disabled="true"] { cursor: not-allowed; }
:is(#cali27, #cali27-enc, #cali27-pie) .download[href] .download__name::before { content: none; }
:is(#cali27, #cali27-enc, #cali27-pie) .download { align-items: center; }
:is(#cali27, #cali27-enc, #cali27-pie) .download__icon { flex: none; width: 22px; height: 22px; margin-right: -6px; fill: none; stroke: var(--azul); stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; transition: translate .2s var(--ease-in); }
:is(#cali27, #cali27-enc, #cali27-pie) .download[href]:is(:hover, :focus-visible) .download__icon { translate: 0 2px; }
:is(#cali27, #cali27-enc, #cali27-pie) .download[href]:is(:hover, :focus-visible) .download__name { text-decoration: underline; text-decoration-thickness: 1.5px; text-underline-offset: .18em; }
:is(#cali27, #cali27-enc, #cali27-pie) .download--inline { flex-direction: row; flex-wrap: wrap; align-items: center; justify-content: flex-start; column-gap: 10px; }
:is(#cali27, #cali27-enc, #cali27-pie) .download--inline .download__state { flex-basis: 100%; padding-left: 32px; }
:is(#cali27, #cali27-enc, #cali27-pie) .downloads .download { justify-content: flex-start; }
:is(#cali27, #cali27-enc, #cali27-pie) .downloads .download__name { flex: 1; }
/* Fichas: etiqueta arriba y texto a todo el ancho (antes, dos columnas que dejaban una franja estrecha de texto). */
:is(#cali27, #cali27-enc, #cali27-pie) .ficha__list > div, :is(#cali27, #cali27-enc, #cali27-pie) .ficha__list > div:is(*) { grid-template-columns: minmax(0, 1fr); gap: 4px; }
@media (min-width: 1200px) { :is(#cali27, #cali27-enc, #cali27-pie) .ficha__list > div { grid-template-columns: minmax(0, 1fr); } }
:is(#cali27, #cali27-enc, #cali27-pie) .ficha__list dd { max-width: 62ch; }

/* El ave siempre dentro del sello: la regla de las cabeceras (.page-head__art img { width: 100% }) la agrandaba. */
:is(#cali27, #cali27-enc, #cali27-pie) .seal > img.seal__img { left: 21%; top: 21%; width: 58%; height: 58%; max-width: none; object-fit: contain; }

/* Carta en tableta y teléfono (29 oct 2026): las postales quedan arriba y el sobre debajo, para que suban por la boca
   hasta su lugar (si quedaran debajo tendrían que volver a pasar por detrás del sobre). */
@media (max-width: 1099px) {
  :is(#cali27, #cali27-enc, #cali27-pie) .duo__env { order: 3; margin-top: 64px; }
}
@media (min-width: 700px) and (max-width: 1099px) {
  :is(#cali27, #cali27-enc, #cali27-pie) .duo__env { grid-row: 2; }
  :is(#cali27, #cali27-enc, #cali27-pie) .duo-card { grid-row: 1; }
}

/* Ícono del hotel (29 oct 2026, Assets/Icons/SCARE-Hotel-icon.png): calcomanía sobre el sobre de Alojamiento en Vive Cali */
:is(#cali27, #cali27-enc, #cali27-pie) .envelope__sticker { position: absolute; z-index: 3; top: -64px; right: clamp(12px, 3vw, 32px); width: clamp(104px, 11vw, 136px); height: auto; rotate: 5deg; pointer-events: none; }
html.mov :is(#cali27, #cali27-enc, #cali27-pie) .envelope:hover .envelope__sticker { rotate: 2deg; translate: 0 -4px; transition: rotate .4s var(--ease-in), translate .4s var(--ease-in); }

/* ================================================================== Sobres abiertos con bolsillo en V (29 oct 2026)
   Pedido de Martin (con una foto de un sobre abierto de referencia): abiertos, los sobres muestran la solapa levantada
   hacia arriba con su cara interior en el tono del forro (#EFE3CF, el mismo del dorso) y, debajo, el bolsillo con los
   pliegues laterales en V que se juntan al centro; entre la V y el borde se ve el forro. */
/* Carta de Inicio: el bolsillo delantero se recorta en V (deja ver el dorso, que es el forro) y su borde lleva el filete
   Azul y, 9 px más abajo, el filete magenta que sigue la V (sustituyen la boca recta y la muesca). */
:is(#cali27, #cali27-enc, #cali27-pie) .duo__face { --v: 72px; clip-path: polygon(0 0, 50% var(--v), 100% 0, 100% 100%, 0 100%); }
:is(#cali27, #cali27-enc, #cali27-pie) .duo__mouth { inset: 0 0 auto; left: 0; right: 0; height: calc(var(--v) + 12px); border: 0; background: var(--azul);
  clip-path: polygon(0 0, 50% var(--v), 100% 0, 100% 2px, 50% calc(var(--v) + 2.5px), 0 2px); }
/* la muesca se vuelve el filete magenta que sigue la V, 9 px por dentro (el marco magenta del bolsillo, su outline,
   queda recortado por la V y continúa por esta línea) */
:is(#cali27, #cali27-enc, #cali27-pie) .duo__notch { inset: 0 0 auto; left: 0; top: 0; width: auto; height: calc(var(--v) + 12px); translate: none; border: 0; border-radius: 0; background: var(--wcpm-magenta);
  clip-path: polygon(9px 9px, 50% calc(var(--v) + 9px), calc(100% - 9px) 9px, calc(100% - 9px) 10px, 50% calc(var(--v) + 10.2px), 9px 10px); }
:is(#cali27, #cali27-enc, #cali27-pie) .duo__flap-back::after { background: #EFE3CF; } /* cara interior de la solapa: el forro */
@media (max-width: 479px) { :is(#cali27, #cali27-enc, #cali27-pie) .duo__face { --v: 56px; } }

/* Sobres de Industria, Contacto, Convocatorias y Vive Cali: al abrirse (cursor o foco) la solapa sube hasta quedar
   vertical hacia arriba, con su cara interior en el forro, y aparece el bolsillo en V que tapaba. */
:is(#cali27, #cali27-enc, #cali27-pie) .envelope__body::before, :is(#cali27, #cali27-enc, #cali27-pie) .envelope__body::after { content: ""; position: absolute; inset: 0 0 auto; height: 62px; pointer-events: none; clip-path: polygon(0 0, 100% 0, 50% 100%); }
:is(#cali27, #cali27-enc, #cali27-pie) .envelope__body::before { background: var(--azul); }
:is(#cali27, #cali27-enc, #cali27-pie) .envelope__body::after { background: #EFE3CF; clip-path: polygon(0 0, 100% 0, 50% calc(100% - 2px)); }
:is(#cali27, #cali27-enc, #cali27-pie) .envelope--air .envelope__body::before, :is(#cali27, #cali27-enc, #cali27-pie) .envelope--air .envelope__body::after { top: 0; }
:is(#cali27, #cali27-enc, #cali27-pie) .envelope:is(:hover, :focus-within) .envelope__flap { transform: perspective(700px) rotateX(178deg); }
html.mov :is(#cali27, #cali27-enc, #cali27-pie) .envelope__flap::after { transition: background-color 0s .27s; }
:is(#cali27, #cali27-enc, #cali27-pie) .envelope:is(:hover, :focus-within) .envelope__flap::after { background: #EFE3CF; }
@media print { :is(#cali27, #cali27-enc, #cali27-pie) .envelope__body::before, :is(#cali27, #cali27-enc, #cali27-pie) .envelope__body::after { content: none; } }

/* ================================================================== Botón «Noticias» (29 oct 2026)
   Pedido de Martin: un botón Rojo fijo abajo a la derecha, encima de «Álbum», con una marca cuando hay noticias que no
   se han visto o hace tiempo que no se abren. La marca es un sello Oro con «!» que se estampa una vez. */
:is(#cali27, #cali27-enc, #cali27-pie) .btn.news-fab {
  --fill: var(--rojo); --ink: var(--oro);
  position: fixed; z-index: 30; margin: 0;
  right: max(16px, env(safe-area-inset-right, 0px));
  bottom: calc(max(16px, env(safe-area-inset-bottom, 0px)) + 62px);
  gap: .5em; padding-inline: 14px 18px;
}
:is(#cali27, #cali27-enc, #cali27-pie) .news-fab__mark {
  position: absolute; top: -10px; right: -10px; display: grid; place-items: center; width: 24px; height: 24px;
  border-radius: 50%; background: var(--oro); color: var(--azul); border: 2px solid var(--papel); outline: 1.5px solid var(--azul);
  font-size: .9375rem; font-weight: 800; line-height: 1; letter-spacing: 0; rotate: 8deg;
}
:is(#cali27, #cali27-enc, #cali27-pie) .news-fab__mark[hidden] { display: none; }
html.mov :is(#cali27, #cali27-enc, #cali27-pie) .news-fab.is-nuevo .news-fab__mark { animation: news-sello .6s var(--ease-stamp, cubic-bezier(.3, 1.6, .5, 1)) 1.2s both; }
@keyframes news-sello { 0% { scale: 2.2; opacity: 0; } 60% { scale: .9; opacity: 1; } 100% { scale: 1; } }
:is(#cali27, #cali27-enc, #cali27-pie) .toast { bottom: calc(max(16px, env(safe-area-inset-bottom, 0px)) + 120px); }
@media (hover: hover) and (pointer: fine) { :is(#cali27, #cali27-enc, #cali27-pie) .btn.news-fab:is(:hover, :focus-visible) { translate: 0 -2px; box-shadow: var(--pop-shadow); } }
@media (max-width: 699px) { :is(#cali27, #cali27-enc, #cali27-pie) .btn.news-fab { padding-inline: 12px 14px; } }
@media (max-width: 419px) {
  :is(#cali27, #cali27-enc, #cali27-pie) .btn.news-fab .news-fab__label { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
  :is(#cali27, #cali27-enc, #cali27-pie) .btn.news-fab { padding-inline: 11px; }
  :is(#cali27, #cali27-enc, #cali27-pie) .btn.news-fab .map-fab__icon { margin: 0; }
}
@media print { :is(#cali27, #cali27-enc, #cali27-pie) .btn.news-fab { display: none !important; } }

/* ================================================================== Noticias a lo ancho (29 oct 2026)
   Martin: «they look really crammed up». En escritorio la noticia usa todo el ancho: el título y la entrada ocupan
   nueve columnas, la imagen va a todo lo ancho (16:9), el texto en ocho columnas con renglones más largos y, a su lado,
   la invitación (botón) fija mientras se lee. «Más noticias» también a todo lo ancho. */
@media (min-width: 1000px) {
  :is(#cali27, #cali27-enc, #cali27-pie) .article .page-head__text { grid-column: c 1 / span 9; }
  :is(#cali27, #cali27-enc, #cali27-pie) .article .page-head__post { grid-column: c 10 / content-end; }
  :is(#cali27, #cali27-enc, #cali27-pie) .article .lead { max-width: 48em; }
  :is(#cali27, #cali27-enc, #cali27-pie) .article__main .wrap.narrow { max-width: calc(var(--wrap) + 2 * var(--gutter)); }
  :is(#cali27, #cali27-enc, #cali27-pie) .article__main .wrap {
    display: grid; grid-template-columns: minmax(0, 8fr) minmax(0, 4fr); column-gap: calc(2 * var(--col-gap)); align-items: start;
  }
  :is(#cali27, #cali27-enc, #cali27-pie) .article__main .wrap > * { max-width: none; grid-column: 1; }
  :is(#cali27, #cali27-enc, #cali27-pie) .article__main .wrap > .article__media { grid-column: 1 / -1; }
  :is(#cali27, #cali27-enc, #cali27-pie) .article__media img { width: 100%; height: auto; aspect-ratio: 16 / 9; object-fit: cover; }
  :is(#cali27, #cali27-enc, #cali27-pie) .article__media.media--plate img { object-fit: contain; }
  :is(#cali27, #cali27-enc, #cali27-pie) .article__body :is(p, ul, ol, blockquote) { max-width: 44em; }
  :is(#cali27, #cali27-enc, #cali27-pie) .article__main .wrap > .article__gallery { grid-column: 1 / -1; }
  :is(#cali27, #cali27-enc, #cali27-pie) .article__main .wrap > .article__side { grid-column: 2; grid-row: 2 / span 3; align-self: stretch; margin: 0; }
  :is(#cali27, #cali27-enc, #cali27-pie) .article__side .article__card { position: sticky; top: 120px; margin: 0; }
  :is(#cali27, #cali27-enc, #cali27-pie) .news-grid--pair { max-width: none; }
}

/* ================================================================== Bienvenida recortada (29 oct 2026)
   Martin marcó una línea roja sobre IL-19: la lámina termina ahí (a 78,7 % de su alto, debajo de las primeras flores)
   y lo que sigue empieza justo debajo. La imagen baja 21,3 % de su alto dentro de un marco que recorta, y la sección
   se acorta lo mismo (21,3 % de 50vw = 10,65vw), así el texto queda donde estaba sobre el cielo. Solo escritorio. */
@media (min-width: 1000px) {
  :is(#cali27, #cali27-enc, #cali27-pie).page-inicio .pres__ill { overflow: clip; }
  :is(#cali27, #cali27-enc, #cali27-pie).page-inicio .pres__ill img { translate: 0 21.3%; }
  :is(#cali27, #cali27-enc, #cali27-pie).page-inicio .pres:has(.pres__ill) { padding-bottom: calc(50vw * .547 + 24px); }
}
@media (min-width: 1280px) { :is(#cali27, #cali27-enc, #cali27-pie).page-inicio .pres:has(.pres__ill) { padding-bottom: calc(50vw * .507 + 24px); } }
@media (min-width: 1500px) { :is(#cali27, #cali27-enc, #cali27-pie).page-inicio .pres:has(.pres__ill) { padding-bottom: calc(50vw * .427 + 24px); } }
@media (min-width: 1700px) { :is(#cali27, #cali27-enc, #cali27-pie).page-inicio .pres:has(.pres__ill) { padding-bottom: calc(50vw * .337 + 24px); } }


/* Tarjeta postal al lado de la noticia (29 oct 2026): Papel con doble filete Azul y esquinas Oro, un ave del kit, las
   fechas y el botón centrado. En móvil va después del texto, centrada. */
:is(#cali27, #cali27-enc, #cali27-pie) .article__side { margin-top: clamp(32px, 4vw, 48px); }
:is(#cali27, #cali27-enc, #cali27-pie) .article__card {
  position: relative; display: flex; flex-direction: column; align-items: center; gap: 16px; max-width: 420px; margin-inline: auto;
  padding: 36px 28px 30px; text-align: center; background: var(--papel);
  border: 1.5px solid var(--azul); outline: 1px solid var(--azul); outline-offset: -9px;
}
:is(#cali27, #cali27-enc, #cali27-pie) .article__card::before, :is(#cali27, #cali27-enc, #cali27-pie) .article__card::after { content: ""; position: absolute; width: 26px; height: 28px; background: url("assets/Ornamento_Esquina_Oro.svg") center / contain no-repeat; }
:is(#cali27, #cali27-enc, #cali27-pie) .article__card::before { left: 16px; bottom: 16px; transform: scaleY(-1); }
:is(#cali27, #cali27-enc, #cali27-pie) .article__card::after { right: 16px; bottom: 16px; transform: rotate(180deg); }
:is(#cali27, #cali27-enc, #cali27-pie) .article__card-ave { width: min(70%, 220px); height: auto; }
:is(#cali27, #cali27-enc, #cali27-pie) .article__card-kicker { margin: 0; font-size: .875rem; font-weight: 600; letter-spacing: .14em; text-transform: uppercase; line-height: 1.6; color: var(--rojo); }
:is(#cali27, #cali27-enc, #cali27-pie) .article__card .article__cta { margin: 6px 0 0; display: flex; justify-content: center; }
:is(#cali27, #cali27-enc, #cali27-pie) .article__card .article__cta .btn { margin: 0 5px 5px 0; text-align: center; }

/* ================================================================== Inscripción más arriba y más cerca de la carta (29 oct 2026)
   Martin: el bloque «Una inscripción, dos congresos» sube junto a la estampilla de Creyentes y se quita parte del aire
   vacío entre la sección y la carta «Una sede, dos experiencias». */
@media (min-width: 1000px) {
  :is(#cali27, #cali27-enc, #cali27-pie).page-inicio .reg__text { padding-top: 96px; align-self: start; }
}
:is(#cali27, #cali27-enc, #cali27-pie).page-inicio .reg { padding-bottom: var(--air-s); }
:is(#cali27, #cali27-enc, #cali27-pie).page-inicio .reg + .duo { padding-top: 0; }

/* ================================================================== Carta de fechas más grande (29 oct 2026, Martin: «make this bigger»)
   La carta que lleva el ave en Convocatorias de Inicio crece a unos 440 px, con el ave y los textos en proporción. */
@media (min-width: 900px) {
  :is(#cali27, #cali27-enc, #cali27-pie) .conv__carrier { --ave: 200px; width: min(100%, 440px); grid-column: c 7 / content-end; }
  :is(#cali27, #cali27-enc, #cali27-pie) .conv__carrier .carrier__letter { padding: 30px 32px 26px; }
  :is(#cali27, #cali27-enc, #cali27-pie) .conv__carrier .carrier__kicker { font-size: .875rem; margin-bottom: 14px; }
  :is(#cali27, #cali27-enc, #cali27-pie) .conv__carrier .carrier__dates div { padding: 9px 0; }
  :is(#cali27, #cali27-enc, #cali27-pie) .conv__carrier .carrier__dates dt { font-size: .9375rem; }
  :is(#cali27, #cali27-enc, #cali27-pie) .conv__carrier .carrier__dates dd { font-size: 1.125rem; }
}

/* ================================================================== Friso de azulejos sobre el pie (29 oct 2026)
   Martin: «make the footer division prettier… flourishes on the top edge that properly separate the section». La
   línea de perforaciones pasa a ser un friso: una banda de azulejos del kit (Patrón Azulejo, Papel con Azul) entre dos
   filetes Oro (el medallón central se quitó a pedido de Martin). Separa el pie
   aunque la sección de arriba también sea Azul. */
:is(#cali27, #cali27-enc, #cali27-pie) .site-footer { padding-top: calc(clamp(36px, 4vw, 56px) + 64px); }
:is(#cali27, #cali27-enc, #cali27-pie) .site-footer .perf-edge--top {
  inset: 0 0 auto; height: 64px;
  background: var(--papel) url("assets/Patron_Azulejo_Papel.svg") center / 52px 52px repeat-x;
  border-block: 3px solid var(--oro); outline: 1px solid var(--oro); outline-offset: -8px;
}
:is(#cali27, #cali27-enc, #cali27-pie) .site-footer .perf-edge--top::after { content: none; } /* 29 oct: Martin quitó el medallón central */
@media (max-width: 599px) {
  :is(#cali27, #cali27-enc, #cali27-pie) .site-footer { padding-top: calc(36px + 52px); }
  :is(#cali27, #cali27-enc, #cali27-pie) .site-footer .perf-edge--top { height: 52px; background-size: 42px 42px; }
}
@media (forced-colors: active) { :is(#cali27, #cali27-enc, #cali27-pie) .site-footer .perf-edge--top { background: none; } }
/* la última sección no deja una franja de Papel entre ella y el friso (su margen inferior se salía de <main>) */
:is(#cali27, #cali27-enc, #cali27-pie) main > :last-child, :is(#cali27, #cali27-enc, #cali27-pie) main > .section--azul:last-child { margin-bottom: 0; } /* antes el margen separaba dos Azules; ahora lo hace el friso */

/* ------------------------------------------------------------------ Pieza 6 · popup «Creyentes 2027» (solo Inicio)
   Estampilla conmemorativa sobre Papel: ilustración de las dos aves, título con registro Rojo/Oro fijo, franja de
   correo aéreo con la fecha de cierre y botón Rojo. En móvil sube como hoja inferior. */
:is(#cali27, #cali27-enc, #cali27-pie) .cpop { width: min(500px, calc(100vw - 24px)); max-height: calc(100dvh - 24px); padding: 0; border: 0; background: transparent; color: var(--azul); overflow: visible; }
:is(#cali27, #cali27-enc, #cali27-pie) .cpop::backdrop { background: rgba(16, 36, 66, .7); }
html:has(.cpop[open]) { overflow: hidden; }
/* 30 oct (Martin: sin scroll): columna flexible; la ilustración cede altura (recorta el cielo) para que el botón quepa siempre. */
:is(#cali27, #cali27-enc, #cali27-pie) .cpop__sheet { display: flex; flex-direction: column; max-height: calc(100dvh - 24px); overflow: hidden; padding: 18px 26px 30px; text-align: center; }
:is(#cali27, #cali27-enc, #cali27-pie) .cpop__sheet > * { flex: none; }
:is(#cali27, #cali27-enc, #cali27-pie) .cpop__x {
  position: absolute; top: 14px; right: 14px; z-index: 2; width: 44px; height: 44px; display: grid; place-items: center;
  border: 0; border-radius: 50%; background: var(--papel); color: var(--azul); font: 700 1.75rem/1 var(--font); cursor: pointer;
  box-shadow: inset 0 0 0 1.5px var(--azul);
}
:is(#cali27, #cali27-enc, #cali27-pie) .cpop__x:hover { background: var(--azul); color: var(--papel); }
:is(#cali27, #cali27-enc, #cali27-pie) .cpop__sheet > .cpop__art { flex: 0 1 auto; display: block; width: auto; max-width: none; min-height: 90px; height: auto; object-fit: cover; object-position: 50% 82%; margin: -4px -10px 12px; }
:is(#cali27, #cali27-enc, #cali27-pie) .cpop__t {
  position: relative; isolation: isolate; margin: 0 0 10px; font-size: clamp(2.125rem, 6vw, 2.875rem); font-weight: 700; line-height: 1;
  letter-spacing: .04em; text-transform: uppercase; color: var(--azul);
}
:is(#cali27, #cali27-enc, #cali27-pie) .cpop__t::before, :is(#cali27, #cali27-enc, #cali27-pie) .cpop__t::after { content: attr(data-reg); position: absolute; inset: 0; z-index: -1; pointer-events: none; font: inherit; letter-spacing: inherit; }
:is(#cali27, #cali27-enc, #cali27-pie) .cpop__t::before { color: var(--rojo); opacity: .85; translate: 2px 2px; }
:is(#cali27, #cali27-enc, #cali27-pie) .cpop__t::after { color: var(--oro); opacity: .9; translate: -1.5px -1.5px; }
:is(#cali27, #cali27-enc, #cali27-pie) .cpop__wait { margin: 0 0 2px; font-size: 1.1875rem; color: var(--azul-80); }
:is(#cali27, #cali27-enc, #cali27-pie) .cpop__know { margin: 0 auto 8px; max-width: 14em; font-size: clamp(1.625rem, 4.6vw, 2.125rem); font-weight: 700; line-height: 1.08; color: var(--azul); text-wrap: balance; }
:is(#cali27, #cali27-enc, #cali27-pie) .cpop__ask { margin: 0 0 18px; font-size: 1.375rem; font-style: italic; font-weight: 600; color: var(--rojo); }
:is(#cali27, #cali27-enc, #cali27-pie) .cpop__strip {
  position: relative; isolation: isolate; display: flex; flex-wrap: wrap; justify-content: center; gap: 2px 8px; margin: 0 0 22px; padding: 16px 20px;
  background: url("assets/Franja_Correo_Aereo.svg") 0 0 / 28px 28px; font-size: 1rem; line-height: 1.3; color: var(--azul);
}
:is(#cali27, #cali27-enc, #cali27-pie) .cpop__strip::before { content: ""; position: absolute; inset: 7px; z-index: -1; background: var(--papel); }
:is(#cali27, #cali27-enc, #cali27-pie) .cpop__strip strong { font-weight: 700; }
:is(#cali27, #cali27-enc, #cali27-pie) .cpop__cta { margin: 0; }
:is(#cali27, #cali27-enc, #cali27-pie) .cpop .btn { --fill: var(--rojo); --ink: var(--azul); color: var(--papel); }
html.mov :is(#cali27, #cali27-enc, #cali27-pie) .cpop[open] .cpop__sheet { animation: cpop-in .6s var(--ease-stamp) both; }
html.mov :is(#cali27, #cali27-enc, #cali27-pie) .cpop[open] .cpop__t { animation: cpop-t .5s .35s var(--ease-stamp) both; }
@keyframes cpop-in { from { opacity: 0; translate: 0 26px; rotate: -1.5deg; } }
@keyframes cpop-t { from { opacity: 0; scale: 1.25; } }
@media (max-width: 560px) {
  :is(#cali27, #cali27-enc, #cali27-pie) .cpop { width: 100vw; max-width: 100vw; margin: auto 0 0; max-height: 92dvh; }
  :is(#cali27, #cali27-enc, #cali27-pie) .cpop__sheet { max-height: 92dvh; padding: 12px 18px 24px; }
  html.mov :is(#cali27, #cali27-enc, #cali27-pie) .cpop[open] .cpop__sheet { animation-name: cpop-up; }
  @keyframes cpop-up { from { translate: 0 100%; } }
}
@media (max-height: 760px) {
  :is(#cali27, #cali27-enc, #cali27-pie) .cpop__sheet { padding-bottom: 22px; }
  :is(#cali27, #cali27-enc, #cali27-pie) .cpop__sheet > .cpop__art { margin-bottom: 8px; }
  :is(#cali27, #cali27-enc, #cali27-pie) .cpop__t { font-size: 2.125rem; margin-bottom: 6px; }
  :is(#cali27, #cali27-enc, #cali27-pie) .cpop__know { font-size: 1.625rem; margin-bottom: 4px; }
  :is(#cali27, #cali27-enc, #cali27-pie) .cpop__ask { font-size: 1.1875rem; margin-bottom: 12px; }
  :is(#cali27, #cali27-enc, #cali27-pie) .cpop__strip { margin-bottom: 16px; padding: 12px 16px; font-size: .9375rem; }
}
@media print { :is(#cali27, #cali27-enc, #cali27-pie) .cpop { display: none !important; } }

/* ================================================================== Capa reactiva (29 oct 2026, pedido de Martin)
   Inspirada en la «reactividad» de williamrajwan.com, pero ligera y dentro del manual (propuesta con demos:
   claude.ai/artifact/7nNbzjum4S7ogYeQzE3stp). Va en su propio archivo (con reactivo.js) para no tocar styles.css
   ni app.js. Contiene:
   1. Tinta gastada: motas un tono más oscuras que la tinta (assets/grano-tinta_640px.png) en los planos de tinta y motas Azul muy suaves
      en el Papel de la página, siempre debajo del contenido.
   2. Marco de estampilla: toda imagen de contenido va dentro de un borde perforado (mismo dentado que .stamp).
      Las ilustraciones sueltas son la estampilla; en las postales (noticias, ruta, galería) la estampilla es la
      foto dentro de la postal. No aplica a logos, afiche (keyart), paisajes a sangre, sellos de aves ni al juego.
   3. Apoyos de reactivo.js: entintado y sellos de los botones, y paisaje punteado de Inicio.
   Todo queda quieto con «reducir movimiento» (lo decide reactivo.js; aquí solo hay estados finales). */

/* -- 1 · tinta gastada (versión tranquila, 29 oct: la textura sobre toda la página era ruidosa y pesada) --------
   Motas grises que se multiplican con la tinta (29 oct, Martin: «más oscuras, no Papel»). Solo en los planos de tinta (bandas Azul, barra superior, pie, paneles y botones llenos), como imagen de fondo:
   queda debajo del texto y de las fotos, no cubre el Papel y no se redibuja nunca. */
:is(#cali27, #cali27-enc, #cali27-pie) :is(.section--azul, .topbar, .site-footer, .creyentes, .pres, .nov__sheet, .ind-band--feria, .chip--oro), :is(#cali27, #cali27-enc, #cali27-pie) .btn:not(.btn--ghost):not(.btn--ghost-papel):not([aria-disabled="true"])::before {
  background-image: url("assets/grano-tinta_640px.png"); background-size: 320px 320px; background-repeat: repeat;
  background-blend-mode: multiply; /* motas grises × el color del plano: un tono más oscuro de la misma tinta */
}
/* la Presentación de Inicio continúa el cielo de IL-19/IL-20, que no tiene motas: sin textura para que no se vea el corte */
:is(#cali27, #cali27-enc, #cali27-pie).page-inicio .pres:has(.pres__ill) { background-image: none; }
@media (forced-colors: active) {
  :is(#cali27, #cali27-enc, #cali27-pie) :is(.section--azul, .topbar, .site-footer, .creyentes, .pres, .nov__sheet, .ind-band--feria, .chip--oro), :is(#cali27, #cali27-enc, #cali27-pie) .btn::before { background-image: none; }
}

/* Papel con grano (29 oct, Martin: «un poco de ruido en el papel y un poco de reacción, poco en cantidad y opacidad»):
   motas Azul muy suaves (assets/grano-papel-suave_640px.png, 1,5 % de cobertura) en el fondo de la página, debajo de
   todo. Sin reacción al cursor (29 oct, Martin: se sentía lento). */
/* 3 nov 2026 (Martin: «reduce the background noise just a bit»): las mismas motas, un 30 % más tenues (assets/grano-papel-tenue_640px.png). */
:is(#cali27, #cali27-enc, #cali27-pie) { background-image: url("assets/grano-papel-tenue_640px.png"); background-size: 320px 320px; }
@media print, (forced-colors: active) { :is(#cali27, #cali27-enc, #cali27-pie) { background-image: none; } }

/* -- 2 · marco de estampilla --------------------------------------------------------------------------------- */
/* El dentado vive en el fondo del propio elemento (sin seudoelementos, que estos marcos ya usan): una placa Papel
   al centro y, alrededor, los agujeros con su filete. Mismas capas que .stamp::before/::after (C2 de styles.css). */
:is(#cali27, #cali27-enc, #cali27-pie) .media--ilustracion:not(.ph), :is(#cali27, #cali27-enc, #cali27-pie) .postal-ill, :is(#cali27, #cali27-enc, #cali27-pie) .ind-band__frame, :is(#cali27, #cali27-enc, #cali27-pie) .elemento__art--landscape, :is(#cali27, #cali27-enc, #cali27-pie) .photo-card .media:not(.media--foto), :is(#cali27, #cali27-enc, #cali27-pie) .ruta__photo, :is(#cali27, #cali27-enc, #cali27-pie) .feria__photo, :is(#cali27, #cali27-enc, #cali27-pie) .news-slide__media:not(.media--foto), :is(#cali27, #cali27-enc, #cali27-pie) .article__media:not(.media--foto), :is(#cali27, #cali27-enc, #cali27-pie) .article__fig:not(.media--foto) {
  --perf: 5px; --t: calc(var(--perf) * 3); --plate: var(--papel); --edge-c: var(--azul-40);
  border: 1px solid transparent !important;
  background:
    radial-gradient(var(--plate), var(--plate)) center / calc(100% - var(--t) - 2px) calc(100% - var(--t) - 2px) no-repeat padding-box,
    radial-gradient(calc(var(--perf) + 1px), #0000 96%, var(--plate)) calc(var(--t) / -2) calc(var(--t) / -2) / var(--t) var(--t) round padding-box,
    radial-gradient(var(--perf), #0000 96%, var(--edge-c)) calc(var(--t) / -2) calc(var(--t) / -2) / var(--t) var(--t) round padding-box border-box !important;
}
/* sin la sombra suave del «pop»: un rectángulo borroso detrás del dentado lo delataría */
html:is(#cali27, #cali27-enc, #cali27-pie) body :is(.media--ilustracion, .postal-ill, .elemento__art--landscape, .ind-band__frame, .photo-card .media, .ruta__photo, .feria__photo, .news-slide__media, .article__media, .article__fig), html:is(#cali27, #cali27-enc, #cali27-pie) body :is(.media--ilustracion, .postal-ill, .elemento__art--landscape, .ind-band__frame, .photo-card .media, .ruta__photo, .feria__photo, .news-slide__media, .article__media, .article__fig):is(:hover, :focus-visible, :focus-within) { box-shadow: none; }
/* ilustraciones sueltas: la estampilla entera, con el filete interior Azul donde antes iba el doble filete */
:is(#cali27, #cali27-enc, #cali27-pie) .media--ilustracion:not(.ph), :is(#cali27, #cali27-enc, #cali27-pie) .postal-ill, :is(#cali27, #cali27-enc, #cali27-pie) .elemento__art--landscape {
  padding: clamp(18px, 2vw, 24px); outline: 1px solid var(--azul); outline-offset: calc(-1 * (var(--t) / 2 + 6px));
}
:is(#cali27, #cali27-enc, #cali27-pie) .media--ilustracion:not(.ph)::after { top: 22px; right: 22px; }
:is(#cali27, #cali27-enc, #cali27-pie) .ind-band__frame { padding: 20px; outline: 2px solid var(--oro); outline-offset: -14px; --edge-c: var(--azul-60); }
/* fotos dentro de postales: el filete Azul pasa a la imagen y el dentado la rodea */
:is(#cali27, #cali27-enc, #cali27-pie) .photo-card .media:not(.media--foto), :is(#cali27, #cali27-enc, #cali27-pie) .ruta__photo, :is(#cali27, #cali27-enc, #cali27-pie) .feria__photo, :is(#cali27, #cali27-enc, #cali27-pie) .news-slide__media:not(.media--foto), :is(#cali27, #cali27-enc, #cali27-pie) .article__media:not(.media--foto), :is(#cali27, #cali27-enc, #cali27-pie) .article__fig:not(.media--foto) { padding: 13px; }
:is(#cali27, #cali27-enc, #cali27-pie) .photo-card .media:not(.media--foto) > img, :is(#cali27, #cali27-enc, #cali27-pie) .ruta__photo > img, :is(#cali27, #cali27-enc, #cali27-pie) .feria__photo > img, :is(#cali27, #cali27-enc, #cali27-pie) .news-slide__media:not(.media--foto) img, :is(#cali27, #cali27-enc, #cali27-pie) .article__media:not(.media--foto) img, :is(#cali27, #cali27-enc, #cali27-pie) .article__fig:not(.media--foto) img { border: 1px solid var(--azul); }
:is(#cali27, #cali27-enc, #cali27-pie) .photo-card:has(.media--plate) { background: var(--papel); border-color: var(--line-strong); }
@media (forced-colors: active) {
  :is(#cali27, #cali27-enc, #cali27-pie) .media--ilustracion:not(.ph), :is(#cali27, #cali27-enc, #cali27-pie) .postal-ill, :is(#cali27, #cali27-enc, #cali27-pie) .elemento__art--landscape, :is(#cali27, #cali27-enc, #cali27-pie) .ind-band__frame, :is(#cali27, #cali27-enc, #cali27-pie) .photo-card .media, :is(#cali27, #cali27-enc, #cali27-pie) .ruta__photo, :is(#cali27, #cali27-enc, #cali27-pie) .feria__photo, :is(#cali27, #cali27-enc, #cali27-pie) .news-slide__media, :is(#cali27, #cali27-enc, #cali27-pie) .article__media, :is(#cali27, #cali27-enc, #cali27-pie) .article__fig { background: none !important; border: 1px solid CanvasText !important; }
}

/* -- 3 · apoyos de reactivo.js -------------------------------------------------------------------------------- */
/* entintado desde el cursor (opción A): la tinta del estado activo entra en puntos duros desde donde llega el
   cursor (reactivo.js mueve --tinta-f, el frente, y --tinta-d, el radio de los puntos en una trama de 5 px).
   Con la capa activa, los botones de línea ya no se rellenan de golpe al pasar: lo hace la tinta. */
:is(#cali27, #cali27-enc, #cali27-pie) .btn-tinta {
  position: absolute; inset: 0; z-index: -1; border-radius: var(--radius); pointer-events: none; background: var(--azul-profundo);
  -webkit-mask: radial-gradient(circle at var(--tinta-x, 50%) var(--tinta-y, 50%), #000 var(--tinta-f, 0px), #0000 calc(var(--tinta-f, 0px) + .5px)), radial-gradient(circle, #000 var(--tinta-d, 0px), #0000 calc(var(--tinta-d, 0px) + .01px)) 0 0 / 5px 5px;
  -webkit-mask-composite: source-in;
  mask: radial-gradient(circle at var(--tinta-x, 50%) var(--tinta-y, 50%), #000 var(--tinta-f, 0px), #0000 calc(var(--tinta-f, 0px) + .5px)) intersect, radial-gradient(circle, #000 var(--tinta-d, 0px), #0000 calc(var(--tinta-d, 0px) + .01px)) 0 0 / 5px 5px;
}
:is(#cali27, #cali27-enc, #cali27-pie) .btn--oro .btn-tinta, :is(#cali27, #cali27-enc, #cali27-pie) .btn--ghost .btn-tinta { background: var(--azul); }
:is(#cali27, #cali27-enc, #cali27-pie) .btn--ghost-papel .btn-tinta { background: var(--papel); }
:is(#cali27, #cali27-enc, #cali27-pie) .btn--wcpm .btn-tinta { background: var(--wcpm-ciruela); }
html.btn-entinta :is(#cali27, #cali27-enc, #cali27-pie) .btn--ghost:hover { color: var(--azul); }
html.btn-entinta :is(#cali27, #cali27-enc, #cali27-pie) .btn--ghost:hover::before { background: transparent; }
html.btn-entinta :is(#cali27, #cali27-enc, #cali27-pie) .btn--ghost-papel:hover { color: var(--papel); }
html.btn-entinta :is(#cali27, #cali27-enc, #cali27-pie) .btn--ghost-papel:hover::before { background: transparent; }
html.btn-entinta :is(#cali27, #cali27-enc, #cali27-pie) .btn--ghost.is-entintado { color: var(--papel); }
html.btn-entinta :is(#cali27, #cali27-enc, #cali27-pie) .btn--ghost-papel.is-entintado { color: var(--azul); }
html.btn-entinta :is(#cali27, #cali27-enc, #cali27-pie) .btn--oro.is-entintado { color: var(--oro); }
@media (forced-colors: active) { :is(#cali27, #cali27-enc, #cali27-pie) .btn-tinta { display: none; } }
/* sellos de los botones: matasellos pequeño en la esquina del botón pulsado */
:is(#cali27, #cali27-enc, #cali27-pie) .btn-sello { position: absolute; z-index: 52; width: 64px; height: 64px; margin: -32px 0 0 -32px; pointer-events: none; rotate: var(--rot, -8deg); }
:is(#cali27, #cali27-enc, #cali27-pie) .btn-sello svg { display: block; width: 100%; height: 100%; overflow: visible; }
:is(#cali27, #cali27-enc, #cali27-pie) .btn-sello text { font-family: var(--font); }
html.mov :is(#cali27, #cali27-enc, #cali27-pie) .btn-sello { animation: btn-sella .5s var(--ease-stamp) both; }
@keyframes btn-sella { 0% { opacity: 0; scale: 1.4; } 55% { opacity: 1; scale: .95; } 100% { opacity: 1; scale: 1; } }
@media print { :is(#cali27, #cali27-enc, #cali27-pie) .btn-sello { display: none; } }

/* semitono vivo (paisaje de Inicio): el lienzo se coloca sobre la imagen, que queda debajo como respaldo */
:is(#cali27, #cali27-enc, #cali27-pie) .semitono-vivo { position: absolute; display: block; pointer-events: none; }
/* paisaje de Identidad: estampilla con una leve inclinación, como las postales */
:is(#cali27, #cali27-enc, #cali27-pie) .elemento__art--landscape { rotate: 1deg; }
:is(#cali27, #cali27-enc, #cali27-pie) .elemento__art--landscape > img { display: block; }

/* -- 4 · registro RYB en los títulos (reactivo.js): copias Rojo y Oro detrás del texto; --reg (px) las corre en
   sentidos opuestos mientras se hace scroll. En reposo no existen (opacidad 0). */
:is(#cali27, #cali27-enc, #cali27-pie) .reg-t { position: relative; isolation: isolate; }
:is(#cali27, #cali27-enc, #cali27-pie) .reg-t::before, :is(#cali27, #cali27-enc, #cali27-pie) .reg-t::after {
  content: attr(data-reg); position: absolute; inset: 0; z-index: -1; pointer-events: none; opacity: 0;
  font: inherit; letter-spacing: inherit; text-transform: inherit; text-align: inherit; line-height: inherit;
  padding: inherit; box-sizing: border-box; /* 29 oct: con el relleno del título («Cali nos recibe» se partía distinto) */
}
:is(#cali27, #cali27-enc, #cali27-pie) .reg-t::before { color: var(--rojo); }
:is(#cali27, #cali27-enc, #cali27-pie) .reg-t::after { color: var(--oro); }
:is(#cali27, #cali27-enc, #cali27-pie) .reg-t[style*="--reg"]::before { opacity: .8; translate: calc(var(--reg) * .5px) calc(var(--reg) * 1px); }
:is(#cali27, #cali27-enc, #cali27-pie) .reg-t[style*="--reg"]::after { opacity: .9; translate: calc(var(--reg) * -.5px) calc(var(--reg) * -1px); }
@media print, (forced-colors: active), (prefers-reduced-motion: reduce) { :is(#cali27, #cali27-enc, #cali27-pie) .reg-t::before, :is(#cali27, #cali27-enc, #cali27-pie) .reg-t::after { content: none; } }

@media print { :is(#cali27, #cali27-enc, #cali27-pie) .btn-tinta { display: none; } }

/* -- 5 · serigrafía leve en todas las ilustraciones (29 oct 2026, Martin: «really slight»): una máscara de motas
   (assets/grano-serigrafia-mascara_256px.png, ~4 % de la superficie) deja asomar el Papel en puntitos, como la tinta
   que no cubre del todo el pliego al pasar por la malla. No toca fotos, logotipos ni íconos. */
:is(#cali27, #cali27-enc, #cali27-pie) :is(img[src*="_IL-"], img[src*="keyart-"], img[src*="_Ave-"], img[src*="_Paisaje-"]) {
  -webkit-mask: url("assets/grano-serigrafia-mascara_256px.png") 0 0 / 256px 256px repeat;
  mask: url("assets/grano-serigrafia-mascara_256px.png") 0 0 / 256px 256px repeat;
}
@media print, (forced-colors: active) { :is(#cali27, #cali27-enc, #cali27-pie) :is(img[src*="_IL-"], img[src*="keyart-"], img[src*="_Ave-"], img[src*="_Paisaje-"]) { -webkit-mask: none; mask: none; } }

/* -- 6 · grano de colores al hacer clic (reactivo.js 5): brotes de motas Rojo, Oro y Azul pegados a la página donde
   cayeron (el cuerpo es su referencia); se abren un poco y se desvanecen en 5 s */
:is(#cali27, #cali27-enc, #cali27-pie) { position: relative; }
:is(#cali27, #cali27-enc, #cali27-pie) .grano-clic { position: absolute; z-index: 60; pointer-events: none; opacity: 0; animation: grano-clic 5s ease-out forwards; }
@keyframes grano-clic { 0% { opacity: .55; scale: .5; } 6% { opacity: .48; scale: 1; } 60% { opacity: .32; } 100% { opacity: 0; scale: 1.08; } }
@media print, (forced-colors: active) { :is(#cali27, #cali27-enc, #cali27-pie) .grano-clic { display: none; } }

/* WordPress: el contenedor ocupa todo el ancho, no hereda márgenes del tema y es su propio contexto de apilamiento
   (en el sitio estático el fondo Papel era el de <body>, y los adornos con z-index: -1 quedaban encima de él) */
:is(#cali27, #cali27-enc, #cali27-pie) { width: 100%; isolation: isolate; position: relative; }
.cali27-seccion > .elementor-container, .cali27-seccion .elementor-widget-wrap { padding: 0 !important; }
/* Elementor separa los widgets con 20 px y el Lienzo deja ver el fondo del tema bajo el pie: se igualan al sitio */
.elementor-widget:has(#cali27) { margin-bottom: 0 !important; }
.elementor-widget:has(#cali27) > .elementor-widget-container { padding: 0 !important; margin: 0 !important; }
.elementor-section:has(#cali27) > .elementor-container { max-width: none !important; }
.elementor-column:has(#cali27) > .elementor-widget-wrap { padding: 0 !important; }
body.elementor-template-canvas:has(#cali27) { background: #F8EFE1; margin: 0; }
.e-con:has(#cali27) { --padding-top: 0px; --padding-right: 0px; --padding-bottom: 0px; --padding-left: 0px; --gap: 0px; --row-gap: 0px; --column-gap: 0px; --content-width: 100%; --width: 100%; padding: 0 !important; max-width: none !important; }
.e-con:has(#cali27) > .e-con-inner { max-width: none !important; padding: 0 !important; gap: 0 !important; }
/* Algunos temas fijan html { font-size: 62.5% }: el diseño usa rem y necesita el tamaño normal del navegador */
html:has(#cali27) { font-size: 100%; }
/* Con la barra de administración de WordPress (solo al revisar con sesión iniciada) el encabezado fijo baja lo que ella mide */
body.admin-bar :is(#cali27, #cali27-enc, #cali27-pie) .site-header { top: var(--wp-admin--admin-bar--height, 32px); }
@media (max-width: 600px) { body.admin-bar :is(#cali27, #cali27-enc, #cali27-pie) .site-header { top: 0; } }
/* Contenido que edita medios: el widget de origen solo se ve en el editor de Elementor */
body:not(.elementor-editor-active) .cali27-fuente { display: none !important; }
.elementor-editor-active .cali27-fuente { max-width: 1100px; margin: 24px auto !important; padding: 16px 20px; border: 2px dashed #c9a227; background: #fffbea; font: 15px/1.4 Montserrat, sans-serif; color: #1d2b4f; }
.elementor-editor-active .cali27-fuente::before { content: 'Contenido que edita medios (no se ve así en el sitio)'; display: block; font-weight: 700; margin-bottom: 8px; text-transform: uppercase; font-size: 12px; letter-spacing: .08em; }
.elementor-editor-active .cali27-fuente--noticias::before { content: 'Noticias del carrusel de Inicio: las entradas de la categoría «Noticias» publicadas desde el 1 de octubre de 2026 (este widget no se ve en el sitio)'; }
.elementor-editor-active .cali27-fuente table { width: 100%; border-collapse: collapse; }
.elementor-editor-active .cali27-fuente td, .elementor-editor-active .cali27-fuente th { border: 1px solid #c9b98a; padding: 4px 6px; text-align: left; vertical-align: top; }