/* Descubre El Hoyo · acabado final consolidado · 2026-08-03 */

/* ===== Módulos editoriales ===== */


.discovery-path{
  margin:1.6rem 0 2rem;padding:clamp(1rem,3vw,1.45rem);border:1px solid rgba(15,31,25,.14);border-radius:22px;
  background:linear-gradient(145deg,#f7f7f2,#fff);box-shadow:0 15px 35px rgba(15,31,25,.075);
}
.discovery-path__eyebrow{
  margin:0 0 .35rem;color:#087f6b;font-size:.68rem;font-weight:950;letter-spacing:.12em;text-transform:uppercase;
}
.discovery-path h2,.discovery-path h3{margin:.15rem 0 .55rem;letter-spacing:-.035em}
.discovery-path__lead{max-width:68ch;margin:0;color:#48564f;font-size:1rem;line-height:1.62}
.clue-grid,.mineral-use-grid,.wildlife-story-grid{
  display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.8rem;margin:1rem 0 0;
}
.clue-card,.mineral-use-card,.wildlife-story-card{
  position:relative;overflow:hidden;padding:1rem;border:1px solid rgba(15,31,25,.12);border-radius:17px;background:#fff;
}
.clue-card::before,.mineral-use-card::before,.wildlife-story-card::before{
  content:"";position:absolute;inset:0 auto 0 0;width:5px;background:var(--card-accent,#087f6b);
}
.clue-card:nth-child(2),.mineral-use-card:nth-child(2),.wildlife-story-card:nth-child(2){--card-accent:#2458c7}
.clue-card:nth-child(3),.mineral-use-card:nth-child(3),.wildlife-story-card:nth-child(3){--card-accent:#b94e30}
.clue-card:nth-child(4),.mineral-use-card:nth-child(4),.wildlife-story-card:nth-child(4){--card-accent:#a46b14}
.clue-card span,.mineral-use-card>span,.wildlife-story-card>span{
  display:block;margin:0 0 .4rem;color:var(--card-accent,#087f6b);font-size:.65rem;font-weight:950;letter-spacing:.08em;text-transform:uppercase;
}
.clue-card strong,.mineral-use-card h3,.wildlife-story-card h3{display:block;margin:0 0 .35rem;color:#14221d}
.clue-card p,.mineral-use-card p,.wildlife-story-card p{margin:0;color:#4f5c56;font-size:.88rem;line-height:1.55}
.story-signal{
  position:relative;overflow:hidden;margin:1.8rem 0;padding:clamp(1.2rem,4vw,2rem);border-radius:24px;
  background:linear-gradient(128deg,#0d1714,#0b4235 66%,#08705e);color:#fff;box-shadow:0 20px 45px rgba(13,23,20,.2);
}
.story-signal::after{
  content:"";position:absolute;width:210px;height:210px;right:-100px;top:-120px;border:30px solid rgba(255,255,255,.055);border-radius:50%;
}
.story-signal__eyebrow{margin:0 0 .45rem;color:#f0c96f;font-size:.68rem;font-weight:950;letter-spacing:.12em;text-transform:uppercase}
.story-signal h2,.story-signal h3{max-width:22ch;margin:0 0 .65rem;color:#fff;letter-spacing:-.04em}
.story-signal p{max-width:70ch;margin:.5rem 0;color:rgba(255,255,255,.82);line-height:1.65}
.story-signal a{color:#fff;font-weight:850;text-decoration-color:#f0c96f;text-decoration-thickness:2px;text-underline-offset:3px}
.deep-time{
  display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:.55rem;margin:1.1rem 0;
}
.deep-time article{min-width:0;padding:.9rem;border-top:5px solid var(--time-accent,#087f6b);border-radius:5px 14px 14px;background:#edf1ee}
.deep-time article:nth-child(2){--time-accent:#2458c7}.deep-time article:nth-child(3){--time-accent:#b94e30}.deep-time article:nth-child(4){--time-accent:#a46b14}
.deep-time time{display:block;color:var(--time-accent,#087f6b);font-size:.66rem;font-weight:950;text-transform:uppercase}
.deep-time strong{display:block;margin:.4rem 0 .25rem;color:#14221d;font-size:.86rem}
.deep-time p{margin:0;color:#52605a;font-size:.75rem;line-height:1.42}
.field-note{
  margin:1.15rem 0;padding:1rem;border:1px solid rgba(36,88,199,.2);border-radius:16px;background:#f2f5fb;
}
.field-note strong{display:block;color:#173f88}
.field-note p{margin:.35rem 0 0;color:#44536a;line-height:1.55}
.local-memory{
  margin:1.4rem 0;padding:1rem 1.1rem;border-left:5px solid #b94e30;border-radius:6px 18px 18px 6px;background:#f6eee9;
}
.local-memory__label{display:block;color:#943a25;font-size:.66rem;font-weight:950;letter-spacing:.1em;text-transform:uppercase}
.local-memory h3{margin:.35rem 0 .45rem;color:#331b15}
.local-memory p{margin:.4rem 0;color:#55413a;line-height:1.62}
.source-chip{
  display:inline-flex;margin-top:.55rem;padding:.38rem .58rem;border-radius:999px;background:#fff;color:#5d3429!important;
  font-size:.7rem;font-weight:850;text-decoration:none!important;box-shadow:0 4px 12px rgba(75,37,27,.1);
}
.mineral-use-card h3{font-size:1.08rem}
.mineral-use-card dl{display:grid;grid-template-columns:auto 1fr;gap:.35rem .55rem;margin:.65rem 0 0;font-size:.79rem;line-height:1.42}
.mineral-use-card dt{color:#43504a;font-weight:900}.mineral-use-card dd{margin:0;color:#5a655f}
.process-line{
  display:grid;grid-template-columns:repeat(4,1fr);gap:.5rem;margin:1rem 0;
}
.process-line div{position:relative;padding:.75rem;border-radius:13px;background:#14221d;color:#fff;text-align:center}
.process-line div:not(:last-child)::after{content:"→";position:absolute;z-index:1;right:-.55rem;top:50%;transform:translateY(-50%);color:#d29a27;font-weight:950}
.process-line strong{display:block;font-size:.79rem}.process-line span{display:block;margin-top:.25rem;color:rgba(255,255,255,.68);font-size:.66rem}
.photo-duo{
  display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.8rem;margin:1rem 0 1.6rem;
}
.photo-duo figure{margin:0;overflow:hidden;border-radius:18px;background:#17231f;color:#fff}
.photo-duo img{width:100%;height:clamp(220px,38vw,390px);display:block;object-fit:cover}
.photo-duo figcaption{padding:.75rem .85rem;color:rgba(255,255,255,.8);font-size:.78rem;line-height:1.45}
.photo-duo figcaption strong{color:#fff}
.fact-check{
  display:flex;gap:.8rem;margin:1rem 0;padding:.9rem;border:1px solid rgba(8,127,107,.2);border-radius:15px;background:#eef7f4;
}
.fact-check>span{flex:0 0 auto;width:34px;height:34px;display:grid;place-items:center;border-radius:10px;background:#087f6b;color:#fff;font-weight:950}
.fact-check p{margin:0;color:#3e574e;font-size:.86rem;line-height:1.52}
.species-photo-list-item{list-style:none;margin-left:0!important;padding-left:0!important}

@media(max-width:680px){
  .clue-grid,.mineral-use-grid,.wildlife-story-grid,.photo-duo{grid-template-columns:1fr}
  .deep-time{grid-template-columns:repeat(2,minmax(0,1fr))}
  .process-line{grid-template-columns:1fr 1fr}
  .process-line div:nth-child(2)::after{display:none}
}
@media(max-width:420px){
  .deep-time{grid-template-columns:1fr}
  .process-line{grid-template-columns:1fr}
  .process-line div::after{display:none}
}


/* ===== Legibilidad y navegación ===== */


:root {
  --v79-forest: #063c33;
  --v79-ink: #0b1512;
  --v79-copper: #d36a3f;
  --v79-lime: #d7ff63;
}

.story-signal,
.archive-story--night,
.village-atlas,
.mining-night,
.dark-card {
  color: #fff;
}

.story-signal p,
.story-signal li,
.story-signal small,
.story-signal .source-chip {
  color: #fff;
}

.story-signal .story-signal__eyebrow {
  color: #ffdd87;
}

.v79-anchor-marker {
  display: block;
  position: relative;
  top: -7rem;
  visibility: hidden;
}

.v79-return-to-cards {
  position: fixed;
  z-index: 490;
  left: max(1rem, env(safe-area-inset-left));
  bottom: max(1rem, env(safe-area-inset-bottom));
  display: inline-flex;
  align-items: center;
  gap: .6rem;
  max-width: min(29rem, calc(100vw - 2rem));
  min-height: 3.25rem;
  padding: .72rem 1rem;
  border: 2px solid #fff;
  border-radius: 999px;
  background: var(--v79-ink);
  color: #fff;
  box-shadow: 0 10px 28px rgba(0, 0, 0, .28);
  font-weight: 900;
  line-height: 1.15;
  text-decoration: none;
  transition: transform .2s ease, background .2s ease, box-shadow .2s ease;
}

.v79-return-to-cards:hover,
.v79-return-to-cards:focus-visible {
  transform: translateY(-3px);
  background: var(--v79-forest);
  box-shadow: 0 14px 34px rgba(0, 0, 0, .34);
}

.v79-return-to-cards > span:first-child {
  display: grid;
  width: 1.8rem;
  height: 1.8rem;
  flex: 0 0 1.8rem;
  place-items: center;
  border-radius: 50%;
  background: var(--v79-lime);
  color: var(--v79-ink);
}

.v79-return-to-cards--other-page {
  border-color: var(--v79-lime);
}

body.village-alive:not(.home) .page-hero h1,
body.village-alive:not(.home) .section-hero h1,
.page-hero h1,
.section-hero h1 {
  max-width: min(100%, 13ch);
  overflow: visible;
  overflow-wrap: normal;
  word-break: normal;
  hyphens: auto;
  text-wrap: balance;
}

[class*="card"],
[class*="Card"],
.adaptive-page-summary__highlights li,
.story-scrap,
.service-entry {
  min-width: 0;
}

[class*="card"] h2,
[class*="card"] h3,
[class*="card"] strong,
.adaptive-page-summary__highlights strong,
.story-scrap h2,
.switch-card strong {
  max-width: 100%;
  overflow-wrap: anywhere;
  word-break: normal;
  text-wrap: balance;
}

.adaptive-page-summary__highlights li {
  grid-template-rows: auto auto 1fr;
}

.adaptive-page-summary__highlights li > span {
  overflow: visible;
}

.contribute-board h2 {
  max-width: 100%;
  overflow-wrap: anywhere;
  word-break: normal;
  text-wrap: balance;
}

.v79-evidence-story {
  margin: 2rem 0;
  padding: clamp(1.1rem, 3vw, 1.75rem);
  border: 1px solid rgba(11, 21, 18, .14);
  border-radius: 1.5rem;
  background: linear-gradient(145deg, #f4f7f4, #fff);
  box-shadow: 0 18px 40px rgba(11, 21, 18, .08);
}

.v79-evidence-story__eyebrow {
  margin: 0 0 .4rem;
  color: #08705e;
  font-size: .7rem;
  font-weight: 950;
  letter-spacing: .11em;
  text-transform: uppercase;
}

.v79-evidence-story h2,
.v79-evidence-story h3 {
  margin: .2rem 0 .6rem;
  color: var(--v79-ink);
  letter-spacing: -.04em;
}

.v79-evidence-story__lead {
  max-width: 72ch;
  color: #3d4f48;
  font-size: 1.05rem;
  line-height: 1.65;
}

.v79-evidence-grid,
.v79-stay-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: .8rem;
  margin-top: 1rem;
}

.v79-evidence-grid article,
.v79-stay-card {
  min-width: 0;
  padding: 1rem;
  border: 1px solid rgba(11, 21, 18, .13);
  border-radius: 1rem;
  background: #fff;
}

.v79-evidence-grid span,
.v79-stay-card > span {
  display: block;
  margin-bottom: .35rem;
  color: #08705e;
  font-size: .68rem;
  font-weight: 950;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.v79-evidence-grid strong,
.v79-stay-card strong {
  display: block;
  color: var(--v79-ink);
  font-size: 1.05rem;
}

.v79-evidence-grid p,
.v79-stay-card p {
  margin: .4rem 0 0;
  color: #4d5d56;
  font-size: .88rem;
  line-height: 1.52;
}

.v79-source-row {
  display: flex;
  flex-wrap: wrap;
  gap: .55rem;
  margin-top: 1rem;
}

.v79-source-row a,
.v79-stay-card a {
  display: inline-flex;
  margin-top: .7rem;
  color: #075f51;
  font-weight: 900;
  text-underline-offset: 3px;
}

.v79-practical-alert {
  margin: 1.5rem 0;
  padding: 1.1rem 1.2rem;
  border-left: 6px solid var(--v79-copper);
  border-radius: .5rem 1.2rem 1.2rem .5rem;
  background: #fff2ea;
}

.v79-practical-alert strong {
  display: block;
  color: #6d2d18;
}

.v79-practical-alert p {
  margin: .4rem 0 0;
  color: #533b33;
}

@media (max-width: 820px) {
  body.village-alive:not(.home) .page-hero h1,
  body.village-alive:not(.home) .section-hero h1,
  .page-hero h1,
  .section-hero h1 {
    max-width: 100%;
    font-size: clamp(2.65rem, 11.5vw, 5.2rem);
    line-height: .84;
    letter-spacing: -.06em;
  }

  .contribute-board h2 {
    font-size: clamp(2.9rem, 11vw, 5rem);
    line-height: .86;
    letter-spacing: -.055em;
  }

  .v79-return-to-cards {
    bottom: max(5.7rem, calc(4.8rem + env(safe-area-inset-bottom)));
    font-size: .86rem;
  }
}

@media (max-width: 680px) {
  .v79-evidence-grid,
  .v79-stay-grid {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 420px) {
  body.village-alive:not(.home) .page-hero h1,
  body.village-alive:not(.home) .section-hero h1,
  .page-hero h1,
  .section-hero h1 {
    font-size: clamp(2.4rem, 11vw, 3.65rem);
  }

  .contribute-board h2 {
    font-size: clamp(2.45rem, 10.5vw, 3.5rem);
  }

  .v79-return-to-cards {
    right: max(.7rem, env(safe-area-inset-right));
    left: max(.7rem, env(safe-area-inset-left));
    justify-content: center;
    max-width: none;
  }
}

@media (prefers-reduced-motion: reduce) {
  .v79-return-to-cards {
    transition: none;
  }
}


/* ===== Componentes y herramientas ===== */

/* Descubre El Hoyo · V80
   Ajustes globales de legibilidad, navegación, recetas y vistas. */

:root {
  --v80-ink: #13251f;
  --v80-forest: #173f33;
  --v80-forest-deep: #0d2b23;
  --v80-copper: #b45f35;
  --v80-cobalt: #1d4f79;
  --v80-paper: #f7f3ea;
  --v80-line: rgba(19, 37, 31, .16);
}

/* Las cabeceras editoriales llevan velo oscuro: el titular debe ser siempre
   claro, también cuando entra la hoja de estilos de lectura sencilla. */
:is(.page-hero, .section-hero, .article-hero) h1 {
  color: #fff !important;
  text-shadow: 0 2px 22px rgba(0, 0, 0, .24);
}

main [id] {
  scroll-margin-top: 8.5rem;
}

/* El texto sobre fondos oscuros no debe heredar verdes del artículo. */
.article-card :is(.story-signal, .discovery-card, .landscape-scale-card, .photo-duo figure),
.article-card :is(.story-signal, .discovery-card, .landscape-scale-card, .photo-duo figure)
  :is(h2, h3, h4, p, li, strong, em, small, figcaption) {
  color: #fff !important;
}

.article-card :is(.story-signal, .discovery-card, .landscape-scale-card, .photo-duo figure) a {
  color: #fff !important;
  text-decoration-color: rgba(255, 255, 255, .68);
}

.article-card :is(.story-signal, .discovery-card, .landscape-scale-card, .photo-duo figure)
  .photo-credit {
  color: rgba(255, 255, 255, .82) !important;
}

/* Se elimina el regreso persistente de V79: podía recuperar una visita antigua. */
.v79-return-to-cards {
  display: none !important;
}

.v80-scroll-top {
  position: fixed;
  z-index: 120;
  left: clamp(.75rem, 2vw, 1.35rem);
  bottom: clamp(4.8rem, 9vh, 6rem);
  display: grid;
  width: 3rem;
  height: 3rem;
  place-items: center;
  border: 1px solid rgba(255, 255, 255, .34);
  border-radius: 999px;
  background: rgba(13, 43, 35, .94);
  box-shadow: 0 12px 28px rgba(8, 25, 20, .26);
  color: #fff;
  font: 800 1.35rem/1 system-ui, sans-serif;
  cursor: pointer;
  opacity: 0;
  transform: translateY(.7rem);
  pointer-events: none;
  transition: opacity .2s ease, transform .2s ease, background .2s ease;
}

.v80-scroll-top.is-visible {
  opacity: 1;
  transform: translateY(0);
  pointer-events: auto;
}

.v80-scroll-top:hover,
.v80-scroll-top:focus-visible {
  background: #071e18;
  outline: 3px solid rgba(74, 189, 163, .42);
  outline-offset: 3px;
}

/* En la vista de mayores la ruta intermedia cortaba la lectura. */
body.elder-friendly .breadcrumbs,
html[data-adaptive-mode="senior"] .breadcrumbs {
  display: none !important;
}

/* MAGNA 861 y llamadas documentales evidentes. */
.magna-callout,
.heritage-evidence {
  margin: clamp(1.4rem, 3vw, 2.4rem) 0;
  padding: clamp(1.25rem, 3vw, 2rem);
  border: 1px solid rgba(29, 79, 121, .22);
  border-radius: 1.25rem;
  background:
    linear-gradient(135deg, rgba(29, 79, 121, .08), transparent 56%),
    #fbfaf6;
  box-shadow: 0 18px 44px rgba(19, 37, 31, .08);
}

.magna-callout > p:first-child,
.heritage-evidence__kicker {
  margin: 0 0 .45rem;
  color: var(--v80-copper);
  font-size: .76rem;
  font-weight: 850;
  letter-spacing: .12em;
  text-transform: uppercase;
}

.magna-callout h3,
.heritage-evidence h4 {
  margin: 0 0 .65rem;
  color: var(--v80-ink);
  font-size: clamp(1.35rem, 2.5vw, 2rem);
  line-height: 1.08;
  text-wrap: balance;
}

.magna-callout__link,
.heritage-evidence__link,
.san-isidro-cta {
  display: inline-flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  min-height: 3.25rem;
  margin-top: .75rem;
  padding: .82rem 1rem;
  border-radius: .8rem;
  background: var(--v80-cobalt);
  color: #fff !important;
  font-weight: 850;
  text-decoration: none !important;
  box-shadow: 0 10px 22px rgba(29, 79, 121, .22);
  transition: transform .18s ease, box-shadow .18s ease, background .18s ease;
}

.magna-callout__link:hover,
.heritage-evidence__link:hover,
.san-isidro-cta:hover {
  transform: translateY(-2px);
  background: #123c60;
  box-shadow: 0 15px 28px rgba(29, 79, 121, .3);
}

.archive-feature-link[href="/pueblo-san-isidro"] {
  border: 2px solid rgba(180, 95, 53, .42);
  box-shadow: 0 16px 36px rgba(19, 37, 31, .14);
}

.archive-feature-link[href="/pueblo-san-isidro"]::before {
  content: "ABRIR GUÍA";
  display: inline-grid;
  place-items: center;
  align-self: center;
  min-width: 5.7rem;
  min-height: 2.3rem;
  margin-right: .9rem;
  padding: .35rem .55rem;
  border-radius: 999px;
  background: var(--v80-copper);
  color: #fff;
  font-size: .66rem;
  font-style: normal;
  font-weight: 900;
  letter-spacing: .09em;
}

/* Fichas de recetas: una preparación por tarjeta, sin fingir una receta única. */
.recipe-intro {
  margin: 1rem 0 1.4rem;
  color: #405149;
  font-size: 1rem;
}

.recipe-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 18rem), 1fr));
  align-items: start;
  gap: 1rem;
  margin: 1.2rem 0 2.4rem;
}

.recipe-card {
  display: flex;
  min-width: 0;
  flex-direction: column;
  overflow: hidden;
  border: 1px solid var(--v80-line);
  border-radius: 1.15rem;
  background: #fff;
  box-shadow: 0 12px 30px rgba(19, 37, 31, .07);
}

.recipe-card__head {
  padding: 1rem 1.05rem .9rem;
  background:
    linear-gradient(135deg, rgba(180, 95, 53, .16), transparent 58%),
    var(--v80-paper);
}

.recipe-card__type {
  display: block;
  margin-bottom: .38rem;
  color: var(--v80-copper);
  font-size: .69rem;
  font-weight: 900;
  letter-spacing: .11em;
  text-transform: uppercase;
}

.recipe-card h4 {
  margin: 0;
  color: var(--v80-ink);
  font-size: clamp(1.2rem, 2.1vw, 1.55rem);
  line-height: 1.08;
  overflow-wrap: anywhere;
  text-wrap: balance;
}

.recipe-card > p {
  margin: .9rem 1.05rem .25rem;
  color: #4b5d54;
  font-size: .94rem;
}

.recipe-card details {
  margin: auto 1.05rem 1rem;
  border-top: 1px solid var(--v80-line);
}

.recipe-card summary {
  padding: .85rem 0 .2rem;
  color: var(--v80-forest);
  font-weight: 850;
  cursor: pointer;
}

.recipe-card dl {
  margin: .65rem 0 0;
}

.recipe-card dt {
  margin-top: .75rem;
  color: var(--v80-ink);
  font-size: .77rem;
  font-weight: 900;
  letter-spacing: .06em;
  text-transform: uppercase;
}

.recipe-card dd {
  margin: .22rem 0 0;
  color: #405149;
  line-height: 1.55;
}

.recipe-photo {
  width: 100%;
  margin: 0;
  border-radius: 0;
}

.recipe-photo img {
  width: 100%;
  aspect-ratio: 4 / 3;
  object-fit: cover;
}

/* Herramientas prácticas: sobrias, legibles y con jerarquía de producto. */
.visit-actions {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: .7rem;
}

.visit-actions a {
  position: relative;
  display: grid;
  min-height: 7.4rem;
  align-content: end;
  overflow: hidden;
  padding: 1rem;
  border: 1px solid rgba(255, 255, 255, .17);
  border-radius: 1rem;
  background:
    radial-gradient(circle at 86% 12%, rgba(78, 196, 170, .3), transparent 35%),
    linear-gradient(145deg, var(--v80-forest), var(--v80-forest-deep));
  color: #fff !important;
  font-size: clamp(.94rem, 1.5vw, 1.08rem);
  font-weight: 800;
  line-height: 1.18;
  text-decoration: none !important;
  box-shadow: 0 14px 30px rgba(13, 43, 35, .18);
  transition: transform .18s ease, box-shadow .18s ease;
}

.visit-actions a::after {
  content: "↗";
  position: absolute;
  top: .8rem;
  right: .9rem;
  color: rgba(255, 255, 255, .8);
}

.visit-actions a:hover,
.visit-actions a:focus-visible {
  transform: translateY(-3px);
  box-shadow: 0 18px 34px rgba(13, 43, 35, .28);
}

.visit-actions span {
  position: absolute;
  top: .75rem;
  left: .85rem;
  color: #9fe4d3;
  font-size: .65rem;
  font-weight: 900;
  letter-spacing: .1em;
}

/* Tarjetas de contenido: el texto manda y nunca se recorta. */
.adaptive-page-summary__highlights li,
.story-scrap,
.insight-card,
.discovery-card {
  min-width: 0;
  height: auto !important;
  min-height: 0;
  overflow: visible;
}

.adaptive-page-summary__highlights :is(strong, span),
.story-scrap :is(h2, h3, p),
.insight-card :is(h2, h3, p) {
  max-width: 100%;
  overflow-wrap: anywhere;
}

.adaptive-page-summary__highlights strong,
.story-scrap h2,
.story-scrap h3,
.insight-card h3 {
  font-size: clamp(1.08rem, 2.2vw, 1.55rem);
  line-height: 1.08;
  text-wrap: balance;
}

/* La app de bolsillo es una entrada móvil. En una pantalla grande se ofrecen
   páginas completas; las utilidades se convierten en un panel ancho. */
@media (min-width: 768px) {
  .choice-card--mobile,
  [data-mode-choice="mobile"],
  [data-dialog-mode="mobile"] {
    display: none !important;
  }

  body.pocket-home main,
  body.route-app-page main,
  body.tool-frame-page main,
  body.utilities-page main {
    width: min(1180px, calc(100% - 3rem));
    margin-inline: auto;
  }

  body.utilities-page .pocket-grid,
  body.utilities-page .utility-grid,
  body.utilities-page .tools-grid,
  body.utilities-page .menu-groups {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1rem;
  }

  body.utilities-page .app-shell {
    max-width: 1180px;
    padding: 1.4rem;
  }

  body.utilities-page .app-view {
    min-height: auto;
    border-radius: 1.4rem;
    background: #f8f6f0;
    box-shadow: 0 22px 54px rgba(19, 37, 31, .12);
  }

  body.weather-app-page {
    background:
      radial-gradient(circle at 82% 8%, rgba(29, 79, 121, .13), transparent 28rem),
      #eef2ee;
  }

  body.weather-app-page .weather-shell {
    width: min(1180px, calc(100% - 3rem));
    min-height: auto;
    margin: 2rem auto;
  }

  body.weather-app-page .weather-content:not([hidden]) {
    display: grid;
    grid-template-columns: minmax(0, 1.15fr) minmax(18rem, .85fr);
    gap: 1rem;
  }

  body.weather-app-page :is(.weather-heading, .weather-hours, .weather-source) {
    grid-column: 1 / -1;
  }

  body.weather-app-page .weather-now {
    min-height: 18rem;
  }

  body.weather-app-page .weather-summary {
    align-content: stretch;
  }
}

@media (max-width: 760px) {
  .visit-actions {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .visit-actions a {
    min-height: 6.6rem;
  }

  .v80-scroll-top {
    left: .75rem;
    bottom: 5.25rem;
    width: 2.8rem;
    height: 2.8rem;
  }

  .archive-feature-link[href="/pueblo-san-isidro"]::before {
    display: none;
  }
}

@media (prefers-reduced-motion: reduce) {
  .v80-scroll-top,
  .magna-callout__link,
  .heritage-evidence__link,
  .san-isidro-cta,
  .visit-actions a {
    transition: none;
  }
}


/* ===== Controles y experiencia adaptable ===== */

/* Descubre El Hoyo · V81
   Navegación coherente, contraste robusto y herramientas adaptativas. */
:root {
  --v81-ink: #071c19;
  --v81-forest: #0a322a;
  --v81-jade: #126653;
  --v81-cobalt: #174e72;
  --v81-copper: #c77545;
  --v81-mist: #eaf1ed;
  --v81-paper: #fffdfa;
}

/* El círculo del menú debe mostrar siempre las dos rayas. */
body.village-alive .menu-toggle .menu-toggle-icon,
.menu-toggle .menu-toggle-icon {
  background: var(--v81-ink) !important;
  color: #fff !important;
  border: 1px solid rgba(255, 255, 255, .24);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .15);
}

body.village-alive .menu-toggle .menu-toggle-icon i,
.menu-toggle .menu-toggle-icon i,
.menu-open .menu-toggle .menu-toggle-icon i,
.menu-toggle:hover .menu-toggle-icon i {
  background: #fff !important;
}

/* Pies de foto: fondo y texto viajan juntos; no puede quedar blanco sobre crema. */
.article-card .photo-duo figure,
.article-card .photo-duo figure figcaption {
  background: #102722 !important;
  color: #fff !important;
}

.article-card .photo-duo figcaption :is(strong, span, a),
.article-card .photo-duo .photo-credit,
.article-card .photo-duo .credit-modifications {
  color: rgba(255, 255, 255, .88) !important;
}

.article-card .photo-duo figcaption a {
  text-decoration-color: rgba(255, 255, 255, .55) !important;
}

.article-card .story-photo-single > figcaption,
.article-card .story-photo-card:not(.archive-story .story-photo-card) > figcaption {
  background: var(--v81-paper) !important;
  color: #17352e !important;
}

.article-card .story-photo-single > figcaption :is(strong, span, a),
.article-card .story-photo-card:not(.archive-story .story-photo-card) > figcaption :is(strong, span, a) {
  color: inherit !important;
}

/* Las tarjetas oscuras conservan texto blanco, también ante reglas heredadas. */
.article-card :is(.discovery-card, .landscape-scale-card, .story-signal, .archive-panel),
.article-card :is(.discovery-card, .landscape-scale-card, .story-signal, .archive-panel) :is(h2, h3, h4, p, strong, span, small, a) {
  color: #fff !important;
}

/* Accesos prácticos: sobrios, con jerarquía y respuesta de producto. */
.visit-actions {
  gap: clamp(.7rem, 1.4vw, 1rem) !important;
  counter-reset: practical;
}

.visit-actions a {
  counter-increment: practical;
  min-height: clamp(8.2rem, 13vw, 10.2rem) !important;
  padding: 1.2rem !important;
  border: 1px solid rgba(255, 255, 255, .13) !important;
  border-radius: 1.25rem !important;
  background:
    linear-gradient(180deg, rgba(255, 255, 255, .07), transparent 42%),
    linear-gradient(145deg, #123c34 0%, #071f1b 70%) !important;
  color: #fff !important;
  box-shadow: 0 18px 42px rgba(7, 28, 25, .2), inset 0 1px 0 rgba(255, 255, 255, .1) !important;
}

.visit-actions a:nth-child(2) { background: linear-gradient(145deg, #1b5274, #0b2636) !important; }
.visit-actions a:nth-child(3) { background: linear-gradient(145deg, #70442d, #2e1b14) !important; }
.visit-actions a:nth-child(4) { background: linear-gradient(145deg, #325348, #0d2923) !important; }

.visit-actions a::before {
  content: "0" counter(practical);
  position: absolute;
  top: .95rem;
  right: 1rem;
  color: rgba(255, 255, 255, .42);
  font: 800 .72rem/1 system-ui, sans-serif;
  letter-spacing: .12em;
}

.visit-actions a::after {
  top: auto !important;
  right: 1rem !important;
  bottom: 1rem;
  display: grid;
  width: 2rem;
  height: 2rem;
  place-items: center;
  border: 1px solid rgba(255, 255, 255, .25);
  border-radius: 50%;
  background: rgba(255, 255, 255, .08);
}

.visit-actions span {
  color: #9de2d1 !important;
  font-size: .68rem !important;
}

.visit-actions a:hover,
.visit-actions a:focus-visible {
  transform: translateY(-5px) !important;
  border-color: rgba(255, 255, 255, .34) !important;
  box-shadow: 0 25px 54px rgba(7, 28, 25, .3), inset 0 1px 0 rgba(255, 255, 255, .16) !important;
}

/* Controles flotantes premium: discretos, reconocibles y con foco claro. */
.v80-scroll-top,
.mobile-utility-launcher,
.round-nav,
.route-round,
.tool-circle {
  border: 1px solid rgba(255, 255, 255, .2) !important;
  background: linear-gradient(145deg, #154f42, #071f1b) !important;
  color: #fff !important;
  box-shadow: 0 14px 34px rgba(4, 24, 20, .3), inset 0 1px 0 rgba(255, 255, 255, .16) !important;
  backdrop-filter: blur(16px);
  transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease !important;
}

.round-nav--web,
.route-round--light,
.tool-circle--light {
  background: linear-gradient(145deg, #fff, #e4ece8) !important;
  color: var(--v81-ink) !important;
  border-color: rgba(7, 28, 25, .15) !important;
}

.v80-scroll-top:hover,
.mobile-utility-launcher:hover,
.round-nav:hover,
.route-round:hover,
.tool-circle:hover,
.v80-scroll-top:focus-visible,
.mobile-utility-launcher:focus-visible,
.round-nav:focus-visible,
.route-round:focus-visible,
.tool-circle:focus-visible {
  transform: translateY(-3px) scale(1.035) !important;
  border-color: rgba(255, 255, 255, .5) !important;
  box-shadow: 0 19px 40px rgba(4, 24, 20, .38), 0 0 0 4px rgba(199, 117, 69, .18) !important;
  outline: 3px solid transparent !important;
}

.v81-nav-chip {
  position: relative;
}

@media (min-width: 700px) {
  .v81-nav-chip[data-v81-label] {
    width: auto !important;
    min-width: 48px;
    padding: 0 14px !important;
    grid-auto-flow: column;
    gap: 8px;
    border-radius: 999px !important;
  }

  .v81-nav-chip[data-v81-label]::after {
    content: attr(data-v81-label);
    font: 800 .68rem/1 system-ui, sans-serif;
    letter-spacing: .04em;
    white-space: nowrap;
  }
}

/* Herramientas en formato ancho para tableta y portátil. */
@media (min-width: 768px) {
  .choice-card--mobile,
  [data-mode-choice="mobile"],
  [data-dialog-mode="mobile"] {
    display: flex !important;
  }

  html.pocket-wide body.pocket-home,
  html.pocket-wide body.utilities-page,
  html.pocket-wide body.route-app-page,
  html.pocket-wide body.tool-frame-page {
    background:
      radial-gradient(circle at 84% 8%, rgba(23, 78, 114, .15), transparent 30%),
      linear-gradient(135deg, #e8efeb, #f8f4ec);
  }

  html.pocket-wide .pocket-main {
    width: min(1180px, calc(100% - 48px));
    max-width: none !important;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1.35rem;
    padding: 2rem 0 3rem;
  }

  html.pocket-wide .pocket-main > :is(.pocket-welcome, .pocket-live-tools, .pocket-contribute) {
    grid-column: 1 / -1;
  }

  html.pocket-wide .pocket-main > section {
    margin: 0 !important;
    padding: clamp(1.2rem, 2vw, 1.8rem);
    border: 1px solid rgba(7, 28, 25, .1);
    border-radius: 1.4rem;
    background: rgba(255, 255, 255, .76);
    box-shadow: 0 18px 45px rgba(7, 28, 25, .08);
  }

  html.pocket-wide .pocket-grid--main { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  html.pocket-wide .pocket-dock { display: none !important; }

  html.pocket-wide .app-shell {
    width: min(1120px, calc(100% - 48px));
    max-width: none;
  }

  html.pocket-wide .menu-groups {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1rem;
  }

  html.pocket-wide .menu-group {
    margin: 0;
    padding: 1.25rem;
    border: 1px solid rgba(7, 28, 25, .1);
    border-radius: 1.35rem;
    background: rgba(255, 255, 255, .78);
    box-shadow: 0 16px 40px rgba(7, 28, 25, .07);
  }

  html.pocket-wide .route-shell {
    width: min(1120px, calc(100% - 48px));
    max-width: none;
  }

  html.pocket-wide .route-view[data-route-view="detail"].is-active {
    display: grid;
    grid-template-columns: minmax(0, 1.25fr) minmax(320px, .75fr);
    gap: 1.1rem;
    align-items: start;
  }

  html.pocket-wide .route-view[data-route-view="detail"] .route-toolbar { grid-column: 1 / -1; }
  html.pocket-wide .route-view[data-route-view="detail"] .route-map { height: min(70vh, 620px); }
  html.pocket-wide .route-view[data-route-view="detail"] .route-summary { margin-top: 0; }
}

/* Una sola navegación móvil, con hueco seguro y sin botones superpuestos. */
@media (max-width: 767px) {
  body:has(.pocket-dock) .mobile-utility-launcher,
  body:has(.adaptive-mobile-bar) .mobile-utility-launcher { display: none !important; }

  .pocket-dock,
  .adaptive-mobile-bar {
    min-height: 68px !important;
    padding: .38rem .4rem calc(.38rem + env(safe-area-inset-bottom)) !important;
    border-top: 1px solid rgba(255, 255, 255, .12) !important;
    background: rgba(6, 27, 24, .95) !important;
    box-shadow: 0 -14px 40px rgba(5, 25, 22, .22) !important;
    backdrop-filter: blur(18px) saturate(1.2);
  }

  .pocket-dock a,
  .pocket-dock button,
  .adaptive-mobile-bar a,
  .adaptive-mobile-bar button {
    min-height: 52px !important;
    border-radius: 14px !important;
    color: rgba(255, 255, 255, .78) !important;
    font-size: .68rem !important;
  }

  .pocket-dock :is(a, button):hover,
  .pocket-dock :is(a, button):focus-visible,
  .pocket-dock [aria-current="page"],
  .adaptive-mobile-bar :is(a, button):hover,
  .adaptive-mobile-bar :is(a, button):focus-visible {
    background: #126653 !important;
    color: #fff !important;
  }

  .v80-scroll-top {
    right: max(.75rem, env(safe-area-inset-right)) !important;
    bottom: calc(78px + env(safe-area-inset-bottom)) !important;
    width: 46px !important;
    height: 46px !important;
  }
}

/* Atracciones nuevas y enlaces documentales. */
.v81-attraction-grid,
.v81-resource-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1rem;
  margin: 1.4rem 0;
}

.v81-attraction-card,
.v81-source-card {
  overflow: hidden;
  border: 1px solid rgba(7, 28, 25, .12);
  border-radius: 1.35rem;
  background: var(--v81-paper);
  box-shadow: 0 18px 44px rgba(7, 28, 25, .1);
}

.v81-attraction-card img {
  width: 100%;
  aspect-ratio: 16 / 9;
  object-fit: cover;
}

.v81-attraction-copy,
.v81-source-card {
  padding: clamp(1rem, 2.4vw, 1.55rem);
}

.v81-attraction-copy > span,
.v81-source-card > span {
  color: var(--v81-copper);
  font-size: .7rem;
  font-weight: 900;
  letter-spacing: .09em;
  text-transform: uppercase;
}

.v81-attraction-copy h2,
.v81-attraction-copy h3,
.v81-source-card strong {
  display: block;
  margin: .35rem 0 .6rem;
  color: var(--v81-ink);
}

.v81-attraction-copy p,
.v81-source-card p { color: #3c554e; line-height: 1.65; }

.v81-cta {
  display: inline-flex;
  align-items: center;
  gap: .5rem;
  margin-top: .7rem;
  padding: .75rem 1rem;
  border-radius: 999px;
  background: var(--v81-ink);
  color: #fff !important;
  font-weight: 850;
  text-decoration: none !important;
}

.v81-corrillo-threads {
  display: grid;
  gap: 1rem;
  margin-top: 3rem;
}

.v81-thread {
  scroll-margin-top: 7rem;
  padding: clamp(1.2rem, 3vw, 2rem);
  border-left: 5px solid var(--v81-copper);
  border-radius: 0 1.2rem 1.2rem 0;
  background: #f7f1e7;
}

.v81-thread h2 { margin-top: 0; color: var(--v81-ink); }
.v81-thread p { max-width: 72ch; }

.phone-group--lodging .action-row { background: linear-gradient(145deg, #f4efe5, #fff); }
.phone-group--lodging .action-row small { white-space: normal; overflow: visible; text-overflow: clip; }
.phone-source-note { color: #5a6b65; font-size: .72rem; line-height: 1.5; }

@media (max-width: 700px) {
  .v81-attraction-grid,
  .v81-resource-grid { grid-template-columns: 1fr; }
  .visit-actions { grid-template-columns: 1fr 1fr !important; }
  .visit-actions a { min-height: 8.4rem !important; }
}

@media (max-width: 420px) {
  .visit-actions { grid-template-columns: 1fr !important; }
  .visit-actions a { min-height: 7.6rem !important; }
}

@media (prefers-reduced-motion: reduce) {
  .v80-scroll-top,
  .mobile-utility-launcher,
  .round-nav,
  .route-round,
  .tool-circle,
  .visit-actions a { transition: none !important; }
}

/* La vista infantil anuncia seis aventuras y muestra las seis. */
body.kids-version :is(.kids-mission-grid, .adventure-route-grid) {
  height: auto !important;
  max-height: none !important;
  overflow: visible !important;
}

body.kids-version :is(.kids-mission-card, .adventure-route) {
  display: flex !important;
  flex-direction: column;
  visibility: visible !important;
  opacity: 1 !important;
  content-visibility: visible !important;
}

.v81-adventure-count {
  width: fit-content;
  margin: 1rem 0 0;
  padding: .55rem .8rem;
  border: 2px solid currentColor;
  border-radius: 999px;
  background: #fff;
  color: #17324d;
  font-weight: 900;
}


/* ===== Contraste y controles táctiles ===== */

/* Descubre El Hoyo · V82 — controles, contraste y herramientas */
:root {
  --v82-ink: #071c19;
  --v82-paper: #fffaf0;
  --v82-acid: #d9f668;
  --v82-forest: #0b3e32;
  --v82-cobalt: #1557a5;
  --v82-copper: #a94727;
}

/* Pies y fuentes: nunca texto blanco sobre papel claro. */
.article-card .story-signal .story-photo-single > figcaption,
.article-card .story-signal .story-photo-single > figcaption :is(strong, span, a),
.article-card .story-signal .story-photo-single > figcaption .photo-credit,
.article-card .story-signal .open-media-figure > figcaption,
.article-card .story-signal .open-media-figure > figcaption :is(strong, span, a) {
  background: #fffdfa !important;
  color: #17352e !important;
  text-shadow: none !important;
}

.article-card .story-signal :is(a.source-chip, .source-chip.external-link),
.story-signal :is(a.source-chip, .source-chip.external-link) {
  background: #fffdfa !important;
  color: var(--v82-ink) !important;
  border-color: rgba(7, 28, 25, .24) !important;
  text-shadow: none !important;
}

/* El mismo lenguaje visual de Sorpréndeme: borde de tinta, papel y sombra franca. */
.v80-scroll-top,
.mobile-utility-launcher,
.village-page-tools .v82-hand-launcher {
  border: 2px solid var(--v82-ink) !important;
  background: linear-gradient(145deg, #fffef9 0%, #f5eddc 100%) !important;
  color: var(--v82-ink) !important;
  box-shadow: 4px 4px 0 var(--v82-ink), 0 16px 34px rgba(7, 28, 25, .19) !important;
  transition: transform .18s ease, box-shadow .18s ease, background .18s ease !important;
}

.v80-scroll-top:hover,
.v80-scroll-top:focus-visible,
.mobile-utility-launcher:hover,
.mobile-utility-launcher:focus-visible,
.village-page-tools .v82-hand-launcher:hover,
.village-page-tools .v82-hand-launcher:focus-visible {
  background: var(--v82-acid) !important;
  color: var(--v82-ink) !important;
  transform: translate(-3px, -3px) !important;
  box-shadow: 7px 7px 0 var(--v82-ink), 0 18px 40px rgba(7, 28, 25, .2) !important;
}

.v80-scroll-top {
  width: 3.6rem !important;
  height: 3.6rem !important;
  border-radius: 50% !important;
  display: grid !important;
  place-items: center !important;
}

.v80-scroll-top:not(.is-visible) { pointer-events: none !important; }
.v82-up-arrow { position: relative; width: 20px; height: 24px; display: block; }
.v82-up-arrow::before {
  content: ""; position: absolute; left: 9px; top: 4px; width: 3px; height: 19px;
  border-radius: 999px; background: currentColor;
}
.v82-up-arrow::after {
  content: ""; position: absolute; left: 4px; top: 3px; width: 11px; height: 11px;
  border-left: 3px solid currentColor; border-top: 3px solid currentColor;
  transform: rotate(45deg); border-radius: 2px 0 0 0;
}

.v82-hand-icon,
.mobile-utility-launcher svg {
  width: 25px !important; height: 25px !important; fill: none !important;
  stroke: currentColor !important; stroke-width: 1.8 !important;
  stroke-linecap: round !important; stroke-linejoin: round !important;
}

.village-page-tools .v82-hand-launcher {
  width: auto !important; min-width: 4.8rem !important; padding: .48rem .72rem !important;
  border-radius: 999px !important; gap: .32rem !important;
}
.village-page-tools .v82-hand-launcher span {
  display: inline !important; font-size: .64rem !important; font-weight: 900 !important;
  letter-spacing: .06em !important; text-transform: uppercase !important;
}
.mobile-utility-launcher { width: 66px !important; height: 66px !important; }
.mobile-utility-launcher span { font-size: .5rem !important; font-weight: 950 !important; }

/* En tableta y portátil, A mano sigue disponible y adopta una presencia lateral. */
@media (min-width: 901px) and (max-width: 1280px) {
  body:not(:has(.village-page-tools)):not(.utilities-page):not(.pocket-home) .mobile-utility-launcher {
    display: flex !important;
  }
}

/* Herramientas más nítidas, variadas y adultas, conservando texto grande. */
.utilities-page .menu-group { --v82-group: var(--v82-forest); }
.utilities-page .menu-group:nth-child(2) { --v82-group: var(--v82-cobalt); }
.utilities-page .menu-group:nth-child(3) { --v82-group: var(--v82-copper); }
.utilities-page .menu-group:nth-child(4) { --v82-group: #6544a3; }
.utilities-page .quick-row,
.utilities-page .action-row {
  position: relative; overflow: hidden; min-height: 70px;
  border: 1px solid color-mix(in srgb, var(--v82-group, var(--v82-forest)) 30%, white) !important;
  border-radius: 18px !important;
  background: linear-gradient(105deg, #fffef9 0%, color-mix(in srgb, var(--v82-group, var(--v82-forest)) 7%, white) 100%) !important;
  box-shadow: 0 10px 24px rgba(7, 28, 25, .09), inset 4px 0 0 var(--v82-group, var(--v82-forest)) !important;
}
.utilities-page .quick-row::after,
.utilities-page .action-row::after {
  content: "→"; color: var(--v82-group, var(--v82-forest)); font-weight: 950;
  position: absolute; right: 14px; top: 50%; transform: translateY(-50%);
}
.utilities-page .quick-row:hover,
.utilities-page .quick-row:focus-visible,
.utilities-page .action-row:hover,
.utilities-page .action-row:focus-visible {
  transform: translateY(-2px); box-shadow: 0 15px 30px rgba(7, 28, 25, .14), inset 4px 0 0 var(--v82-group, var(--v82-forest)) !important;
}
.utilities-page .quick-icon,
.utilities-page .action-icon {
  background: linear-gradient(145deg, color-mix(in srgb, var(--v82-group, var(--v82-forest)) 78%, white), var(--v82-group, var(--v82-forest))) !important;
  color: #fff !important; box-shadow: 0 6px 14px rgba(7, 28, 25, .2), inset 0 1px rgba(255,255,255,.32) !important;
}

/* Las seis aventuras siempre forman parte del flujo visible. */
body.kids-version :is(.kids-mission-grid, .adventure-route-grid) {
  max-height: none !important; overflow: visible !important;
}
body.kids-version :is(.kids-mission-card, .adventure-route) {
  display: grid !important; visibility: visible !important; opacity: 1 !important;
}
.kids-adventure-count {
  display: inline-flex; align-items: center; gap: .4rem; margin: .2rem 0 1rem;
  padding: .55rem .85rem; border: 2px solid #101813; border-radius: 999px;
  background: #fff; color: #101813; font-weight: 900;
  box-shadow: 3px 3px 0 #101813;
}

.v82-source-story {
  margin: 2.2rem 0; padding: clamp(1.2rem, 3vw, 2rem);
  border: 1px solid rgba(7, 28, 25, .2); border-radius: 24px;
  background: linear-gradient(135deg, #f7f0df 0%, #fffdf7 58%, #eef6ee 100%);
  box-shadow: 0 18px 44px rgba(7, 28, 25, .09);
}
.v82-source-story__eyebrow {
  margin: 0 0 .5rem; color: #8c351f; font-size: .72rem; font-weight: 950;
  letter-spacing: .12em; text-transform: uppercase;
}
.v82-source-story h2 { margin-top: 0; }
.v82-source-story .source-chip { display: inline-flex; margin-top: .55rem; }

@media (max-width: 767px) {
  .v80-scroll-top { width: 3.25rem !important; height: 3.25rem !important; }
  .mobile-utility-launcher { width: 60px !important; height: 60px !important; }
}

@media (prefers-reduced-motion: reduce) {
  .v80-scroll-top,
  .mobile-utility-launcher,
  .village-page-tools .v82-hand-launcher,
  .utilities-page :is(.quick-row, .action-row) { transition: none !important; }
}


/* ===== El Hoyo a mano ===== */




/* El acceso a El Hoyo a mano conserva el lenguaje de Sorpréndeme,
   pero queda reducido a una palma circular con etiqueta contextual. */
.village-page-tools .v82-hand-launcher {
  position: relative !important;
  width: 3.6rem !important;
  min-width: 3.6rem !important;
  height: 3.6rem !important;
  padding: 0 !important;
  border-radius: 50% !important;
  gap: 0 !important;
  overflow: visible !important;
}

.village-page-tools .v82-hand-launcher > span,
.mobile-utility-launcher > span {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  white-space: nowrap !important;
  border: 0 !important;
}

.village-page-tools .v82-hand-launcher::after,
.mobile-utility-launcher::after {
  content: "Hoyo a mano";
  position: absolute;
  z-index: 4;
  top: 50%;
  padding: .62rem .82rem;
  border: 2px solid var(--v82-ink);
  border-radius: 999px;
  background: var(--v82-ink);
  color: #fff;
  box-shadow: 4px 4px 0 rgba(217, 246, 104, .88);
  font: 900 .72rem/1 system-ui, sans-serif;
  letter-spacing: .025em;
  white-space: nowrap;
  opacity: 0;
  pointer-events: none;
  transition: opacity .16s ease, transform .16s ease;
}

.village-page-tools .v82-hand-launcher::after {
  right: calc(100% + .8rem);
  transform: translate(.35rem, -50%);
}

.mobile-utility-launcher::after {
  left: calc(100% + .8rem);
  transform: translate(-.35rem, -50%);
}

.village-page-tools .v82-hand-launcher:hover::after,
.village-page-tools .v82-hand-launcher:focus-visible::after,
.mobile-utility-launcher:hover::after,
.mobile-utility-launcher:focus-visible::after {
  opacity: 1;
  transform: translate(0, -50%);
}

.village-page-tools .v82-hand-launcher .v82-hand-icon,
.mobile-utility-launcher svg {
  width: 28px !important;
  height: 28px !important;
}

.mobile-utility-launcher {
  position: fixed;
  overflow: visible !important;
}

/* Aplicación El Hoyo en tus manos: paneles con etiquetas a sangre,
   botones táctiles y el mismo contraste franco de los controles principales. */
.utilities-page {
  --app-ink: #071c19;
  --app-paper: #fffdf7;
  --app-acid: #d9f668;
  background:
    radial-gradient(circle at 92% -8%, rgba(21, 87, 165, .18), transparent 28%),
    radial-gradient(circle at -8% 28%, rgba(217, 246, 104, .22), transparent 25%),
    linear-gradient(145deg, #e9eee8 0%, #f8f2e7 58%, #eef4f0 100%) !important;
}

.utilities-page .app-shell {
  width: min(100%, 620px);
  padding-inline: clamp(.75rem, 3vw, 1.35rem);
}

.utilities-page .app-menu-top,
.utilities-page .app-toolbar {
  padding: .65rem;
  border: 2px solid var(--app-ink);
  border-radius: 22px;
  background: rgba(255, 253, 247, .9);
  box-shadow: 5px 5px 0 var(--app-ink), 0 18px 38px rgba(7, 28, 25, .12);
  backdrop-filter: blur(16px) saturate(1.08);
}

.utilities-page .app-menu-top > div strong,
.utilities-page .app-toolbar strong {
  color: var(--app-ink);
  font-family: Inter, system-ui, sans-serif;
  font-weight: 950;
  letter-spacing: -.04em;
}

.utilities-page .app-menu-top > div small {
  color: #52645d;
  letter-spacing: .16em;
}

.utilities-page :is(.app-mark, .round-nav) {
  width: 48px !important;
  height: 48px !important;
  border: 2px solid var(--app-ink) !important;
  background: var(--app-acid) !important;
  color: var(--app-ink) !important;
  box-shadow: 3px 3px 0 var(--app-ink) !important;
}

.utilities-page .round-nav--web {
  background: #fff !important;
}

.utilities-page :is(.app-mark, .round-nav):hover,
.utilities-page :is(.app-mark, .round-nav):focus-visible {
  transform: translate(-2px, -2px) !important;
  box-shadow: 5px 5px 0 var(--app-ink) !important;
  outline: 3px solid rgba(21, 87, 165, .24) !important;
  outline-offset: 3px;
}

.utilities-page .menu-groups,
.utilities-page .phone-groups {
  gap: 1rem;
}

.utilities-page :is(.menu-group, .phone-group) {
  --group: #0b3e32;
  --group-ink: #fff;
  overflow: hidden;
  padding: 0 .72rem .78rem;
  border: 2px solid var(--app-ink) !important;
  border-radius: 25px !important;
  background: rgba(255, 253, 247, .96) !important;
  box-shadow: 6px 6px 0 var(--app-ink), 0 18px 38px rgba(7, 28, 25, .1) !important;
}

.utilities-page .menu-group:nth-child(1) { --group: #d9f668; --group-ink: #071c19; }
.utilities-page .menu-group:nth-child(2) { --group: #1557a5; }
.utilities-page .menu-group:nth-child(3) { --group: #0b6b57; }
.utilities-page .menu-group:nth-child(4) { --group: #a94727; }
.utilities-page .phone-group:nth-child(1) { --group: #0b6b57; }
.utilities-page .phone-group:nth-child(2) { --group: #1557a5; }
.utilities-page .phone-group:nth-child(3) { --group: #6c4aa1; }
.utilities-page .phone-group:nth-child(4) { --group: #a96f13; }
.utilities-page .phone-group:nth-child(5) { --group: #a94727; }

.utilities-page :is(.menu-group, .phone-group) > h2 {
  margin: 0 -.72rem .75rem !important;
  padding: .7rem 1rem .66rem !important;
  background: var(--group) !important;
  color: var(--group-ink) !important;
  font: 950 .7rem/1 Inter, system-ui, sans-serif !important;
  letter-spacing: .15em !important;
  text-transform: uppercase;
}

.utilities-page :is(.quick-list, .action-list) {
  gap: .62rem;
}

.utilities-page :is(.quick-row, .action-row) {
  grid-template-columns: 54px minmax(0, 1fr) !important;
  min-height: 76px !important;
  padding: .58rem 2.7rem .58rem .58rem !important;
  border: 2px solid var(--app-ink) !important;
  border-radius: 19px !important;
  background: linear-gradient(135deg, #fff 0%, color-mix(in srgb, var(--group) 8%, white) 100%) !important;
  box-shadow: 3px 3px 0 var(--app-ink) !important;
  transition: transform .17s ease, box-shadow .17s ease, background .17s ease !important;
}

.utilities-page :is(.quick-row, .action-row)::after {
  content: "↗" !important;
  right: 1rem !important;
  color: var(--app-ink) !important;
  font-size: 1.05rem;
  transform: translateY(-50%) rotate(0deg) !important;
  transition: transform .17s ease;
}

.utilities-page :is(.quick-row, .action-row):hover,
.utilities-page :is(.quick-row, .action-row):focus-visible {
  transform: translate(-2px, -2px) !important;
  background: color-mix(in srgb, var(--group) 13%, white) !important;
  box-shadow: 6px 6px 0 var(--app-ink), 0 14px 28px rgba(7, 28, 25, .12) !important;
  outline: 3px solid color-mix(in srgb, var(--group) 28%, transparent) !important;
  outline-offset: 3px;
}

.utilities-page :is(.quick-row, .action-row):hover::after,
.utilities-page :is(.quick-row, .action-row):focus-visible::after {
  transform: translate(2px, calc(-50% - 2px)) !important;
}

.utilities-page :is(.quick-icon, .action-icon) {
  width: 54px !important;
  height: 54px !important;
  border: 2px solid var(--app-ink) !important;
  border-radius: 17px !important;
  background: var(--group) !important;
  color: var(--group-ink) !important;
  box-shadow: 2px 2px 0 var(--app-ink) !important;
}

.utilities-page :is(.quick-row, .action-row) strong {
  color: var(--app-ink) !important;
  font-size: 1rem !important;
  font-weight: 950 !important;
}

.utilities-page :is(.quick-row, .action-row) small {
  margin-top: .24rem !important;
  color: #53615b !important;
  font-size: .76rem !important;
  line-height: 1.25;
}

.utilities-page .action-row--urgent {
  --group: #c43f2d;
  background: #c43f2d !important;
  color: #fff !important;
}

.utilities-page .action-row--urgent :is(strong, small) {
  color: #fff !important;
}

.utilities-page .action-row--urgent::after {
  color: #fff !important;
}

.utilities-page .action-row--urgent .action-icon {
  background: #fff !important;
  color: #c43f2d !important;
}

.utilities-page .app-gps-note,
.utilities-page .call-hint {
  width: fit-content;
  max-width: 100%;
  margin-inline: auto;
  padding: .58rem .8rem;
  border: 1px solid rgba(7, 28, 25, .16);
  border-radius: 999px;
  background: rgba(255, 255, 255, .7);
  color: #40534c;
  font-weight: 800;
  backdrop-filter: blur(10px);
}

.utilities-page .phone-source-note {
  margin: .75rem .1rem 0;
  padding: .72rem .8rem;
  border-radius: 15px;
  background: color-mix(in srgb, var(--group) 10%, white);
  color: #40534c;
  font-size: .72rem;
  line-height: 1.45;
}

/* Portada móvil: una composición editorial a sangre con fotografía local,
   jerarquía clara y tarjetas que conservan exactamente sus destinos. */
.pocket-home {
  --pocket-ink: #071c19;
  --pocket-paper: #fffaf0;
  --pocket-acid: #d9f668;
  background:
    radial-gradient(circle at 95% 2%, rgba(21, 87, 165, .15), transparent 24%),
    linear-gradient(145deg, #e7ede8 0%, #f7f1e7 42%, #edf3ef 100%) !important;
}

.pocket-home .pocket-top {
  margin: .55rem .65rem 0;
  padding: .62rem .7rem .62rem .85rem;
  border: 2px solid var(--pocket-ink) !important;
  border-radius: 22px !important;
  background: rgba(255, 250, 240, .88) !important;
  box-shadow: 4px 4px 0 var(--pocket-ink), 0 15px 34px rgba(7, 28, 25, .12) !important;
  backdrop-filter: blur(18px) saturate(1.12);
}

.pocket-home .pocket-top strong {
  font-weight: 950;
  letter-spacing: -.035em;
}

.pocket-home .pocket-top button {
  border: 2px solid var(--pocket-ink) !important;
  background: var(--pocket-acid) !important;
  color: var(--pocket-ink) !important;
  box-shadow: 3px 3px 0 var(--pocket-ink);
  transition: transform .16s ease, box-shadow .16s ease;
}

.pocket-home .pocket-top button:hover,
.pocket-home .pocket-top button:focus-visible {
  transform: translate(-2px, -2px);
  box-shadow: 5px 5px 0 var(--pocket-ink);
  outline: 3px solid rgba(21, 87, 165, .22);
  outline-offset: 3px;
}

.pocket-home .pocket-main {
  width: min(720px, 100%);
  padding-inline: clamp(.65rem, 3vw, 1rem);
}

.pocket-home .pocket-welcome {
  position: relative;
  isolation: isolate;
  min-height: clamp(350px, 64svh, 520px);
  margin-top: .9rem;
  padding: clamp(1.15rem, 5vw, 1.8rem);
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  overflow: hidden;
  border: 2px solid var(--pocket-ink) !important;
  border-radius: 31px !important;
  background:
    linear-gradient(180deg, rgba(3, 18, 15, .05) 0%, rgba(3, 18, 15, .32) 40%, rgba(3, 18, 15, .92) 100%),
    url("/images/archivo-ivan-rodrigo/pueblo-atardecer.webp") center 55% / cover no-repeat !important;
  box-shadow: 7px 7px 0 var(--pocket-ink), 0 24px 56px rgba(7, 28, 25, .2) !important;
}

.pocket-home .pocket-welcome::after {
  content: "";
  position: absolute;
  z-index: -1;
  inset: 0;
  border: 1px solid rgba(255, 255, 255, .2);
  border-radius: inherit;
  pointer-events: none;
}

.pocket-home .pocket-welcome > p:first-child {
  align-self: flex-start;
  margin-bottom: .65rem;
  padding: .5rem .72rem;
  border: 2px solid var(--pocket-ink);
  border-radius: 999px;
  background: var(--pocket-acid);
  color: var(--pocket-ink) !important;
  box-shadow: 3px 3px 0 var(--pocket-ink);
  font-size: .75rem;
  letter-spacing: .06em;
  text-transform: uppercase;
}

.pocket-home .pocket-welcome h1 {
  max-width: 7ch;
  color: #fff;
  text-wrap: balance;
  text-shadow: 0 3px 18px rgba(0, 0, 0, .3);
}

.pocket-home .pocket-welcome > p:nth-of-type(2) {
  max-width: 38rem;
  color: rgba(255, 255, 255, .86);
  font-weight: 650;
}

.pocket-home .pocket-clock {
  padding: .75rem .85rem;
  border: 1px solid rgba(255, 255, 255, .28);
  border-radius: 16px;
  background: rgba(4, 24, 20, .36);
  backdrop-filter: blur(12px);
}

.pocket-home .pocket-main > section:not(.pocket-welcome) > h2 {
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: .55rem;
  margin-bottom: 1rem;
  color: var(--pocket-ink);
  font-family: Inter, system-ui, sans-serif;
  font-size: clamp(1.42rem, 6vw, 2rem);
  font-weight: 950;
  letter-spacing: -.055em;
}

.pocket-home .pocket-main > section:not(.pocket-welcome) > h2::before {
  content: "";
  width: .78rem;
  height: .78rem;
  flex: 0 0 auto;
  border: 2px solid var(--pocket-ink);
  border-radius: 3px;
  background: var(--pocket-acid);
  box-shadow: 2px 2px 0 var(--pocket-ink);
  transform: rotate(-6deg);
}

.pocket-home :is(.pocket-grid, .pocket-list) a {
  isolation: isolate;
  position: relative;
  overflow: hidden;
  color: #fff !important;
  border: 2px solid var(--pocket-ink) !important;
  background-position: center !important;
  background-size: cover !important;
  box-shadow: 4px 4px 0 var(--pocket-ink), 0 17px 35px rgba(7, 28, 25, .15) !important;
  transition: transform .18s ease, box-shadow .18s ease, filter .18s ease !important;
}

.pocket-home :is(.pocket-grid, .pocket-list) a::before {
  content: "" !important;
  position: absolute;
  z-index: -1;
  inset: 0;
  background: linear-gradient(180deg, rgba(3, 18, 15, .04) 0%, rgba(3, 18, 15, .48) 48%, rgba(3, 18, 15, .94) 100%) !important;
  pointer-events: none;
}

.pocket-home :is(.pocket-grid, .pocket-list) a::after {
  content: "↗" !important;
  position: absolute;
  z-index: 2;
  top: .75rem;
  right: .75rem;
  width: 2rem;
  height: 2rem;
  display: grid;
  place-items: center;
  border: 1px solid rgba(255, 255, 255, .28);
  border-radius: 50%;
  background: rgba(3, 18, 15, .34) !important;
  color: #fff !important;
  font-weight: 950;
  backdrop-filter: blur(10px);
  transition: transform .18s ease, background .18s ease;
}

.pocket-home :is(.pocket-grid, .pocket-list) a:hover,
.pocket-home :is(.pocket-grid, .pocket-list) a:focus-visible {
  transform: translate(-3px, -3px) !important;
  filter: saturate(1.08);
  box-shadow: 7px 7px 0 var(--pocket-ink), 0 23px 48px rgba(7, 28, 25, .2) !important;
  outline: 3px solid rgba(217, 246, 104, .62) !important;
  outline-offset: 3px;
}

.pocket-home :is(.pocket-grid, .pocket-list) a:hover::after,
.pocket-home :is(.pocket-grid, .pocket-list) a:focus-visible::after {
  transform: translate(2px, -2px);
  background: var(--pocket-acid) !important;
  color: var(--pocket-ink) !important;
}

.pocket-home .pocket-grid--main {
  gap: .8rem;
}

.pocket-home .pocket-grid--main a {
  min-height: clamp(180px, 44vw, 240px);
  padding: 1rem;
  border-radius: 24px !important;
  justify-content: flex-end;
  gap: .22rem;
}

.pocket-home .pocket-grid--main a:nth-child(1) { background-image: url("/images/archivo-ivan-rodrigo/pueblo-atardecer.webp") !important; }
.pocket-home .pocket-grid--main a:nth-child(2) { background-image: url("/images/archivo-ivan-rodrigo/casino-el-hoyo.webp") !important; }
.pocket-home .pocket-grid--main a:nth-child(3) { background-image: url("/images/archivo-ivan-rodrigo/sendero-pedregoso.webp") !important; }
.pocket-home .pocket-grid--main a:nth-child(4) { background-image: url("/images/archivo-ivan-rodrigo/carretera-llegada.webp") !important; }

.pocket-home .pocket-grid a > span {
  width: 2.8rem;
  height: 2.8rem;
  margin-bottom: auto;
  display: grid;
  place-items: center;
  border: 1px solid rgba(255, 255, 255, .32);
  border-radius: 15px;
  background: rgba(3, 18, 15, .38);
  color: #fff;
  font-size: 1.35rem;
  backdrop-filter: blur(10px);
}

.pocket-home .pocket-grid strong {
  position: relative;
  z-index: 1;
  color: #fff;
  font-size: clamp(1.08rem, 4.4vw, 1.35rem);
  font-weight: 950;
  letter-spacing: -.03em;
}

.pocket-home .pocket-grid small {
  position: relative;
  z-index: 1;
  max-width: calc(100% - .2rem);
  color: rgba(255, 255, 255, .78) !important;
  line-height: 1.3;
}

.pocket-home .pocket-list {
  grid-template-columns: 1fr;
  gap: .75rem;
}

.pocket-home .pocket-list a {
  min-height: 138px;
  padding: 1rem 3.4rem 1rem 1rem;
  grid-template-columns: 48px minmax(0, 1fr) !important;
  align-content: end;
  align-items: end;
  border-radius: 24px !important;
}

.pocket-home .pocket-list a:nth-child(1) { background-image: url("/images/archivo-ivan-rodrigo/pueblo-panorama.webp") !important; }
.pocket-home .pocket-list a:nth-child(2) { background-image: url("/images/archivo-ivan-rodrigo/iglesia-san-ildefonso-noche.webp") !important; }
.pocket-home .pocket-list a:nth-child(3) { background-image: url("/images/archivo-ivan-rodrigo/san-isidro-celebracion-banner.webp") !important; }
.pocket-home .pocket-list a:nth-child(4) { background-image: url("/images/archivo-ivan-rodrigo/panaderia-el-hoyo.webp") !important; }
.pocket-home .pocket-list a:nth-child(5) { background-image: url("/images/archivo-ivan-rodrigo/mirador-astronomico.jpg") !important; }

.pocket-home .pocket-list a > span {
  width: 48px;
  height: 48px;
  display: grid;
  place-items: center;
  border: 1px solid rgba(255, 255, 255, .3);
  border-radius: 15px;
  background: rgba(3, 18, 15, .42) !important;
  color: #fff !important;
  backdrop-filter: blur(10px);
}

.pocket-home .pocket-list strong {
  color: #fff;
  font-size: 1.05rem;
  font-weight: 950;
}

.pocket-home .pocket-list small {
  color: rgba(255, 255, 255, .76) !important;
  line-height: 1.28;
}

.pocket-home .pocket-list b {
  display: none;
}

.pocket-home .pocket-grid:not(.pocket-grid--main) a {
  min-height: 160px;
  padding: .9rem;
  border-radius: 22px !important;
  justify-content: flex-end;
}

.pocket-home .pocket-grid:not(.pocket-grid--main) a:nth-child(1) { background-image: url("/images/archivo-ivan-rodrigo/antiguas-escuelas.webp") !important; }
.pocket-home .pocket-grid:not(.pocket-grid--main) a:nth-child(2) { background-image: url("/images/externas-licenciadas/lince-iberico-01-43901efc.jpg") !important; }
.pocket-home .pocket-grid:not(.pocket-grid--main) a:nth-child(3) { background-image: url("/images/archivo-ivan-rodrigo/flora-cabecera.webp") !important; }
.pocket-home .pocket-grid:not(.pocket-grid--main) a:nth-child(4) { background-image: url("/images/archivo-ivan-rodrigo/antiguo-sindicato.webp") !important; }

.pocket-home .pocket-live-tools {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  padding: clamp(1.25rem, 5vw, 1.8rem) !important;
  border: 2px solid var(--pocket-ink) !important;
  border-radius: 28px !important;
  background:
    linear-gradient(120deg, rgba(6, 28, 24, .93), rgba(10, 67, 55, .78)),
    url("/images/archivo-ivan-rodrigo/estructuras-geologicas.webp") center / cover no-repeat !important;
  box-shadow: 6px 6px 0 var(--pocket-ink), 0 22px 48px rgba(7, 28, 25, .18) !important;
}

.pocket-home .pocket-live-tools h2::before {
  background: #fff !important;
}

.pocket-home .pocket-live-tools p {
  max-width: 42rem;
  color: rgba(255, 255, 255, .78);
}

.pocket-home .pocket-live-tools > a {
  min-height: 54px;
  padding: .75rem 1rem;
  border: 2px solid var(--pocket-ink);
  border-radius: 999px;
  background: var(--pocket-acid) !important;
  color: var(--pocket-ink) !important;
  box-shadow: 4px 4px 0 var(--pocket-ink) !important;
  font-weight: 950;
  transition: transform .17s ease, box-shadow .17s ease;
}

.pocket-home .pocket-live-tools > a:hover,
.pocket-home .pocket-live-tools > a:focus-visible {
  transform: translate(-2px, -2px);
  box-shadow: 6px 6px 0 var(--pocket-ink) !important;
  outline: 3px solid rgba(255, 255, 255, .36);
  outline-offset: 3px;
}

.pocket-home .pocket-photo-card {
  position: relative;
  min-height: clamp(370px, 110vw, 520px);
  overflow: hidden;
  border: 2px solid var(--pocket-ink) !important;
  border-radius: 29px !important;
  background: var(--pocket-ink);
  box-shadow: 6px 6px 0 var(--pocket-ink), 0 22px 48px rgba(7, 28, 25, .18) !important;
}

.pocket-home .pocket-photo-card img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  max-height: none !important;
  object-fit: cover;
}

.pocket-home .pocket-photo-card::after {
  content: "";
  position: absolute;
  inset: 30% 0 0;
  background: linear-gradient(transparent, rgba(3, 18, 15, .94));
  pointer-events: none;
}

.pocket-home .pocket-photo-card > div {
  position: absolute;
  z-index: 2;
  left: 0;
  right: 0;
  bottom: 0;
  padding: 1.35rem;
  color: #fff;
}

.pocket-home .pocket-photo-card h3 {
  color: #fff;
  font-family: Inter, system-ui, sans-serif;
  font-size: clamp(1.6rem, 8vw, 2.5rem);
  font-weight: 950;
  letter-spacing: -.055em;
}

.pocket-home .pocket-photo-card p {
  color: rgba(255, 255, 255, .78);
}

.pocket-home .pocket-photo-card a,
.pocket-home .pocket-contribute a {
  border: 2px solid var(--pocket-ink);
  background: var(--pocket-acid) !important;
  color: var(--pocket-ink) !important;
  box-shadow: 3px 3px 0 var(--pocket-ink) !important;
  font-weight: 950;
}

.pocket-home .pocket-contribute {
  position: relative;
  overflow: hidden;
  padding: 1.35rem !important;
  border: 2px solid var(--pocket-ink) !important;
  border-radius: 27px !important;
  background: linear-gradient(135deg, #d9f668 0%, #efffb1 100%) !important;
  box-shadow: 6px 6px 0 var(--pocket-ink), 0 20px 42px rgba(7, 28, 25, .14) !important;
}

.pocket-home .pocket-contribute::after {
  content: "✦";
  position: absolute;
  right: -1rem;
  top: -2.3rem;
  color: rgba(7, 28, 25, .1);
  font-size: 8rem;
  transform: rotate(12deg);
}

.pocket-home .pocket-contribute > * {
  position: relative;
  z-index: 1;
}

@media (min-width: 560px) {
  .pocket-home .pocket-list {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .pocket-home .pocket-list a:last-child:nth-child(odd) {
    grid-column: 1 / -1;
  }
}

@media (max-width: 420px) {
  .village-page-tools .v82-hand-launcher::after,
  .mobile-utility-launcher::after {
    display: none;
  }

  .pocket-home .pocket-grid--main {
    grid-template-columns: 1fr;
  }

  .pocket-home .pocket-grid--main a {
    min-height: 178px;
  }

  .utilities-page :is(.menu-group, .phone-group) {
    border-radius: 22px !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  .village-page-tools .v82-hand-launcher::after,
  .mobile-utility-launcher::after,
  .utilities-page :is(.quick-row, .action-row),
  .pocket-home :is(.pocket-grid, .pocket-list) a {
    transition: none !important;
  }
}


@media (max-width: 767px) {
  .pocket-home .pocket-top {
    top: calc(env(safe-area-inset-top, 0px) + .42rem);
    min-height: 54px;
    margin: .42rem .65rem 0;
    padding: 0;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
  }

  .pocket-home .pocket-top > a {
    max-width: calc(100% - 64px);
    min-height: 50px;
    padding: .58rem .82rem;
    display: inline-flex;
    align-items: center;
    border: 2px solid var(--pocket-ink);
    border-radius: 999px;
    background: var(--pocket-acid);
    color: var(--pocket-ink);
    box-shadow: 3px 3px 0 var(--pocket-ink);
  }

  .pocket-home .pocket-top strong {
    overflow: hidden;
    font-size: clamp(.82rem, 4vw, 1rem);
    line-height: 1;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .pocket-home .pocket-top small {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    padding: 0 !important;
    margin: -1px !important;
    overflow: hidden !important;
    clip: rect(0, 0, 0, 0) !important;
    white-space: nowrap !important;
    border: 0 !important;
  }

  .pocket-home .pocket-top button {
    flex: 0 0 50px;
    width: 50px;
    height: 50px;
    padding: 0;
    border-radius: 50% !important;
  }
}




/* En móvil, dejamos más aire para que ningún CTA o barra quede medio tapado por el dock inferior. */
@media (max-width: 767px) {
  .pocket-home,
  .pocket-main {
    padding-bottom: calc(8.75rem + env(safe-area-inset-bottom)) !important;
  }

  .pocket-main > :last-child {
    margin-bottom: .5rem !important;
  }
}

/* Tarjetas principales de El Hoyo en tus manos: modernas, a sangre y con foto. */
.pocket-home .pocket-grid--main a,
.utilities-page .menu-group .quick-row {
  position: relative;
  overflow: hidden;
}

.pocket-home .pocket-grid--main a::before,
.utilities-page .menu-group .quick-row::before {
  content: "";
  position: absolute;
  inset: 0;
  width: auto;
  height: auto;
  right: 0;
  top: 0;
  border-radius: inherit;
  transform: none !important;
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
  opacity: .92;
  transition: transform .28s ease, filter .28s ease, opacity .28s ease;
}

.pocket-home .pocket-grid--main a::after,
.utilities-page .menu-group .quick-row::after {
  z-index: 2;
}

.pocket-home .pocket-grid--main a > *,
.utilities-page .menu-group .quick-row > * {
  position: relative;
  z-index: 2;
}

.pocket-home .pocket-grid--main a:hover::before,
.pocket-home .pocket-grid--main a:focus-visible::before,
.utilities-page .menu-group .quick-row:hover::before,
.utilities-page .menu-group .quick-row:focus-visible::before {
  transform: scale(1.05);
  filter: saturate(1.08);
}

.pocket-home .pocket-grid--main a > span {
  background: rgba(7, 28, 25, .42) !important;
  color: #fff !important;
  backdrop-filter: blur(8px);
}

.pocket-home .pocket-grid--main small {
  color: rgba(255,255,255,.88) !important;
}

.pocket-home .pocket-grid--main a:nth-child(1)::before {
  background-image:
    linear-gradient(180deg, rgba(5,18,36,.12), rgba(5,18,36,.58)),
    url('/images/archivo-ivan-rodrigo/seleccion-editorial/cielo-desde-plaza.webp');
}
.pocket-home .pocket-grid--main a:nth-child(2)::before {
  background-image:
    linear-gradient(180deg, rgba(6,27,24,.18), rgba(6,27,24,.62)),
    url('/images/archivo-ivan-rodrigo/panaderia-el-hoyo.webp');
}
.pocket-home .pocket-grid--main a:nth-child(3)::before {
  background-image:
    linear-gradient(180deg, rgba(34,18,7,.18), rgba(34,18,7,.62)),
    url('/images/archivo-ivan-rodrigo/archivo-local/ruta-cerca-el-hoyo.webp');
}
.pocket-home .pocket-grid--main a:nth-child(4)::before {
  background-image:
    linear-gradient(180deg, rgba(20,12,32,.18), rgba(20,12,32,.64)),
    url('/images/archivo-ivan-rodrigo/carretera-llegada.webp');
}

/* La tarjeta de Trabajos y memoria deja atrás la puerta del sindicato y pasa al arriero. */
.pocket-home .pocket-grid:not(.pocket-grid--main) a:nth-child(4) {
  color: #fff !important;
}
.pocket-home .pocket-grid:not(.pocket-grid--main) a:nth-child(4)::before {
  background-image:
    linear-gradient(180deg, rgba(25,13,6,.18), rgba(25,13,6,.68)),
    url('/images/externas-licenciadas/tolox-malaga-arriero-jose-antonio-berrocal.jpg');
  width: auto;
  height: auto;
  inset: 0;
  right: 0;
  top: 0;
  border-radius: inherit;
}
.pocket-home .pocket-grid:not(.pocket-grid--main) a:nth-child(4) > span,
.pocket-home .pocket-grid:not(.pocket-grid--main) a:nth-child(4)::after {
  background: rgba(255,255,255,.18) !important;
  color: #fff !important;
}

/* En utilidades, convertimos los accesos principales en tarjetas con imagen, manteniendo el mismo lenguaje visual. */
.utilities-page .menu-group .quick-row {
  min-height: 132px !important;
  align-items: end !important;
  padding: .78rem 2.7rem .82rem .78rem !important;
  background: transparent !important;
}

.utilities-page .menu-group .quick-row .quick-icon {
  align-self: start;
  background: rgba(7,28,25,.42) !important;
  color: #fff !important;
  box-shadow: 0 10px 24px rgba(7,28,25,.18) !important;
  backdrop-filter: blur(8px);
}

.utilities-page .menu-group .quick-row strong,
.utilities-page .menu-group .quick-row small {
  color: #fff !important;
  text-shadow: 0 1px 12px rgba(0,0,0,.28);
}

.utilities-page .menu-group .quick-row::after {
  background: rgba(255,255,255,.18) !important;
  color: #fff !important;
  backdrop-filter: blur(8px);
}

.utilities-page .menu-group:nth-child(1) .quick-row:nth-child(1)::before {
  background-image:
    linear-gradient(180deg, rgba(6,25,21,.14), rgba(6,25,21,.64)),
    url('/images/archivo-ivan-rodrigo/seleccion-editorial/entrada-el-hoyo.webp');
}
.utilities-page .menu-group:nth-child(1) .quick-row:nth-child(2)::before {
  background-image:
    linear-gradient(180deg, rgba(6,25,21,.12), rgba(6,25,21,.64)),
    url('/images/archivo-ivan-rodrigo/casino-el-hoyo.webp');
}
.utilities-page .menu-group:nth-child(2) .quick-row:nth-child(1)::before {
  background-image:
    linear-gradient(180deg, rgba(32,14,8,.14), rgba(32,14,8,.62)),
    url('/images/archivo-ivan-rodrigo/sendero-pedregoso.webp');
}
.utilities-page .menu-group:nth-child(2) .quick-row:nth-child(2)::before {
  background-image:
    linear-gradient(180deg, rgba(14,16,18,.16), rgba(14,16,18,.65)),
    url('/images/archivo-ivan-rodrigo/estructuras-geologicas.webp');
}
.utilities-page .menu-group:nth-child(3) .quick-row:nth-child(1)::before {
  background-image:
    linear-gradient(180deg, rgba(9,26,14,.16), rgba(9,26,14,.63)),
    url('/images/archivo-ivan-rodrigo/flora-herbacea-primavera.webp');
}
.utilities-page .menu-group:nth-child(3) .quick-row:nth-child(2)::before {
  background-image:
    linear-gradient(180deg, rgba(19,22,34,.16), rgba(19,22,34,.63)),
    url('/images/archivo-ivan-rodrigo/seleccion-editorial/buitre-curva-talleres.webp');
}
.utilities-page .menu-group:nth-child(4) .quick-row:nth-child(1)::before {
  background-image:
    linear-gradient(180deg, rgba(8,21,41,.14), rgba(8,21,41,.66)),
    url('/images/archivo-ivan-rodrigo/seleccion-editorial/cielo-desde-plaza.webp');
}
.utilities-page .menu-group:nth-child(4) .quick-row:nth-child(2)::before {
  background-image:
    linear-gradient(180deg, rgba(8,21,41,.14), rgba(8,21,41,.66)),
    url('/images/archivo-ivan-rodrigo/starlight-observacion-1.webp');
}
.utilities-page .menu-group:nth-child(4) .quick-row:nth-child(3)::before {
  background-image:
    linear-gradient(180deg, rgba(8,21,41,.14), rgba(8,21,41,.66)),
    url('/images/archivo-ivan-rodrigo/mirador-astronomico.jpg');
}

/* Botones de navegación en visor/externas: mismo lenguaje circular, elegante y sin texto fijo visible. */
.route-app-page .route-round,
.tool-frame-page .tool-circle {
  width: 48px !important;
  height: 48px !important;
  border: 2px solid #071c19 !important;
  background: #d9f668 !important;
  color: #071c19 !important;
  box-shadow: 3px 3px 0 #071c19 !important;
}

.route-app-page .route-round--light,
.tool-frame-page .tool-circle--light {
  background: #fffdf7 !important;
}

.route-app-page .route-round:hover,
.route-app-page .route-round:focus-visible,
.tool-frame-page .tool-circle:hover,
.tool-frame-page .tool-circle:focus-visible {
  transform: translate(-2px, -2px) !important;
  box-shadow: 5px 5px 0 #071c19 !important;
  outline: 3px solid rgba(21,87,165,.24) !important;
  outline-offset: 3px;
}

.tool-frame-page .tool-float-nav .tool-circle {
  position: relative;
  overflow: visible;
}

.tool-frame-page .tool-float-nav .tool-circle span {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  white-space: nowrap !important;
  border: 0 !important;
}

.tool-frame-page .tool-float-nav .tool-circle::after {
  position: absolute;
  top: 50%;
  left: calc(100% + .7rem);
  padding: .62rem .82rem;
  border: 2px solid #071c19;
  border-radius: 999px;
  background: #071c19;
  color: #fff;
  box-shadow: 4px 4px 0 rgba(217, 246, 104, .88);
  font: 900 .72rem/1 system-ui, sans-serif;
  letter-spacing: .025em;
  white-space: nowrap;
  opacity: 0;
  pointer-events: none;
  transform: translate(-.3rem, -50%);
  transition: opacity .16s ease, transform .16s ease;
}

.tool-frame-page .tool-float-nav .tool-circle:first-child::after { content: 'Menú'; }
.tool-frame-page .tool-float-nav .tool-circle.tool-circle--light::after { content: 'Web'; }

.tool-frame-page .tool-float-nav .tool-circle:hover::after,
.tool-frame-page .tool-float-nav .tool-circle:focus-visible::after {
  opacity: 1;
  transform: translate(0, -50%);
}

/* Rutas: las dos opciones se muestran con el mismo lenguaje premium del resto de la app. */
.route-app-page .route-choice-list {
  gap: 1rem;
}

.route-app-page .route-choice {
  position: relative;
  overflow: hidden;
  min-height: 170px;
  grid-template-columns: 1fr;
  align-items: end;
  padding: 1rem;
  border: 2px solid #071c19;
  border-radius: 24px;
  color: #fff;
  background: transparent;
  box-shadow: 6px 6px 0 #071c19, 0 18px 38px rgba(7, 28, 25, .1);
}

.route-app-page .route-choice::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 0;
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
  transition: transform .28s ease, filter .28s ease;
}

.route-app-page .route-choice:hover::before,
.route-app-page .route-choice:focus-visible::before {
  transform: scale(1.05);
  filter: saturate(1.08);
}

.route-app-page .route-choice > span:last-child,
.route-app-page .route-choice > .route-choice-icon {
  position: relative;
  z-index: 1;
}

.route-app-page .route-choice > span:last-child {
  padding-right: 2.7rem;
}

.route-app-page .route-choice::after {
  content: '→';
  position: absolute;
  right: 1rem;
  bottom: 1rem;
  z-index: 1;
  width: 38px;
  height: 38px;
  display: grid;
  place-items: center;
  border-radius: 50%;
  background: rgba(255,255,255,.18);
  color: #fff;
  font-size: 1.2rem;
  font-weight: 900;
  backdrop-filter: blur(8px);
}

.route-app-page .route-choice-icon {
  width: 54px;
  height: 54px;
  margin-bottom: .8rem;
  border: 2px solid rgba(255,255,255,.7);
  border-radius: 17px;
  background: rgba(7,28,25,.32);
  color: #fff;
  box-shadow: 0 10px 26px rgba(7,28,25,.22);
  backdrop-filter: blur(8px);
}

.route-app-page .route-choice strong,
.route-app-page .route-choice small {
  color: #fff;
  text-shadow: 0 1px 12px rgba(0,0,0,.28);
}

.route-app-page .route-choice[data-open-route="slcr12"]::before {
  background-image:
    linear-gradient(180deg, rgba(23,31,8,.14), rgba(23,31,8,.64)),
    url('/images/archivo-ivan-rodrigo/hoz-rio-frio-1.webp');
}

.route-app-page .route-choice[data-open-route="prcr73"]::before {
  background-image:
    linear-gradient(180deg, rgba(28,16,9,.14), rgba(28,16,9,.64)),
    url('/images/archivo-ivan-rodrigo/mina.webp');
}

@media (max-width: 520px) {
  .route-app-page .route-choice {
    min-height: 154px;
  }
}




/* Menú principal de El Hoyo en la palma: vuelve al diseño de tarjetas claras de V84. */
.utilities-page .menu-group .quick-row {
  grid-template-columns: 54px minmax(0, 1fr) !important;
  align-items: center !important;
  min-height: 76px !important;
  padding: .58rem 2.7rem .58rem .58rem !important;
  border: 2px solid var(--app-ink) !important;
  border-radius: 19px !important;
  background: linear-gradient(135deg, #fff 0%, color-mix(in srgb, var(--group) 8%, white) 100%) !important;
  color: var(--app-ink) !important;
  box-shadow: 3px 3px 0 var(--app-ink) !important;
}

.utilities-page .menu-group .quick-row::before {
  content: none !important;
  display: none !important;
  background: none !important;
  background-image: none !important;
}

.utilities-page .menu-group .quick-row .quick-icon {
  align-self: auto !important;
  width: 54px !important;
  height: 54px !important;
  border: 2px solid var(--app-ink) !important;
  border-radius: 17px !important;
  background: var(--group) !important;
  color: var(--group-ink) !important;
  box-shadow: 2px 2px 0 var(--app-ink) !important;
  backdrop-filter: none !important;
}

.utilities-page .menu-group .quick-row strong {
  color: var(--app-ink) !important;
  text-shadow: none !important;
}

.utilities-page .menu-group .quick-row small {
  color: #53615b !important;
  text-shadow: none !important;
}

.utilities-page .menu-group .quick-row::after {
  content: "↗" !important;
  width: auto !important;
  height: auto !important;
  right: 1rem !important;
  bottom: auto !important;
  top: 50% !important;
  display: block !important;
  border-radius: 0 !important;
  background: transparent !important;
  color: var(--app-ink) !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
  transform: translateY(-50%) !important;
}

.utilities-page .menu-group .quick-row:hover,
.utilities-page .menu-group .quick-row:focus-visible {
  transform: translate(-2px, -2px) !important;
  background: color-mix(in srgb, var(--group) 13%, white) !important;
  box-shadow: 6px 6px 0 var(--app-ink), 0 14px 28px rgba(7, 28, 25, .12) !important;
}

.utilities-page .menu-group .quick-row:hover::after,
.utilities-page .menu-group .quick-row:focus-visible::after {
  transform: translate(2px, calc(-50% - 2px)) !important;
}

/* Rutas: modernas y coherentes con el resto de la app, pero sin fotografías a sangre. */
.route-app-page .route-choice-list {
  gap: .8rem;
}

.route-app-page .route-choice {
  position: relative;
  overflow: visible;
  min-height: 82px;
  grid-template-columns: 56px minmax(0, 1fr);
  align-items: center;
  gap: .8rem;
  padding: .68rem 3rem .68rem .68rem;
  border: 2px solid #071c19;
  border-radius: 20px;
  background: #fffdf7;
  color: #071c19;
  box-shadow: 4px 4px 0 #071c19, 0 14px 28px rgba(7, 28, 25, .09);
}

.route-app-page .route-choice::before {
  content: none !important;
  display: none !important;
  background: none !important;
  background-image: none !important;
}

.route-app-page .route-choice::after {
  content: "→";
  position: absolute;
  right: 1rem;
  top: 50%;
  bottom: auto;
  z-index: 1;
  width: auto;
  height: auto;
  display: block;
  border-radius: 0;
  background: transparent;
  color: #071c19;
  font-size: 1.15rem;
  font-weight: 950;
  backdrop-filter: none;
  transform: translateY(-50%);
  transition: transform .17s ease;
}

.route-app-page .route-choice:hover,
.route-app-page .route-choice:focus-visible {
  transform: translate(-2px, -2px);
  background: #f1f7d7;
  box-shadow: 7px 7px 0 #071c19, 0 18px 34px rgba(7, 28, 25, .12);
  outline: 3px solid rgba(21,87,165,.24);
  outline-offset: 3px;
}

.route-app-page .route-choice:hover::after,
.route-app-page .route-choice:focus-visible::after {
  transform: translate(3px, calc(-50% - 2px));
}

.route-app-page .route-choice-icon {
  width: 56px;
  height: 56px;
  margin: 0;
  border: 2px solid #071c19;
  border-radius: 17px;
  background: #d9f668;
  color: #071c19;
  box-shadow: 2px 2px 0 #071c19;
  backdrop-filter: none;
}

.route-app-page .route-choice:nth-child(2) .route-choice-icon {
  background: #1557a5;
  color: #fff;
}

.route-app-page .route-choice > span:last-child {
  padding-right: 0;
}

.route-app-page .route-choice strong {
  color: #071c19;
  text-shadow: none;
  font-size: 1rem;
}

.route-app-page .route-choice small {
  color: #53615b;
  text-shadow: none;
}

@media (max-width: 520px) {
  .route-app-page .route-choice {
    min-height: 78px;
  }
}



/* La entrada ofrece las mismas cuatro formas editoriales en cualquier pantalla.
   El Hoyo a mano permanece como herramienta independiente, no como modo de lectura. */
.choice-options--all {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}
.choice-card--senior {
  background: linear-gradient(135deg, #fffef8, #e7f2eb) !important;
}
.choice-card--senior .choice-card__icon {
  background: #ffd969;
  color: #073d29;
}
@media (max-width: 767px) {
  .choice-options--all {
    grid-template-columns: 1fr;
  }
  .choice-options--all .choice-card {
    display: grid !important;
  }
}

/* El bloque verde de herramientas conserva siempre el título visible. */
.pocket-home .pocket-live-tools h2,
.pocket-home .pocket-live-tools h2 * {
  color: #fff !important;
  text-shadow: 0 2px 18px rgba(0,0,0,.28) !important;
}

/* Las fotos de Rutas y Cómo llegar respiran más; siguen siendo legibles sin quedar ennegrecidas. */
.pocket-home .pocket-grid--main a:nth-child(3)::before,
.pocket-home .pocket-grid--main a:nth-child(4)::before {
  background: linear-gradient(180deg, rgba(3,18,15,.01) 0%, rgba(3,18,15,.18) 48%, rgba(3,18,15,.72) 100%) !important;
}
.pocket-home .pocket-grid--main a:nth-child(3) strong,
.pocket-home .pocket-grid--main a:nth-child(4) strong,
.pocket-home .pocket-grid--main a:nth-child(3) small,
.pocket-home .pocket-grid--main a:nth-child(4) small {
  text-shadow: 0 2px 12px rgba(0,0,0,.7);
}

/* Primera visita: accesos fotográficos a sangre, modernos y claramente diferenciados. */
.visit-actions a {
  min-height: clamp(10rem, 18vw, 13rem) !important;
  padding: 1.15rem !important;
  align-content: end !important;
  border: 2px solid #071c19 !important;
  border-radius: 1.35rem !important;
  background-position: center !important;
  background-size: cover !important;
  background-repeat: no-repeat !important;
  box-shadow: 5px 5px 0 #071c19, 0 20px 42px rgba(7,28,25,.16) !important;
  color: #fff !important;
  text-shadow: 0 2px 14px rgba(0,0,0,.58);
}
.visit-actions a:nth-child(1) {
  background-image: linear-gradient(180deg, rgba(5,20,35,.06), rgba(5,20,35,.68)), url('/images/archivo-ivan-rodrigo/seleccion-editorial/cielo-desde-plaza.webp') !important;
}
.visit-actions a:nth-child(2) {
  background-image: linear-gradient(180deg, rgba(15,17,12,.04), rgba(15,17,12,.68)), url('/images/archivo-ivan-rodrigo/carretera-llegada.webp') !important;
}
.visit-actions a:nth-child(3) {
  background-image: linear-gradient(180deg, rgba(28,13,7,.05), rgba(28,13,7,.7)), url('/images/archivo-ivan-rodrigo/panaderia-el-hoyo.webp') !important;
}
.visit-actions a:nth-child(4) {
  background-image: linear-gradient(180deg, rgba(10,24,17,.04), rgba(10,24,17,.68)), url('/images/archivo-ivan-rodrigo/sendero-pedregoso.webp') !important;
}
.visit-actions a::before {
  color: rgba(255,255,255,.88) !important;
  text-shadow: 0 1px 8px rgba(0,0,0,.55);
}
.visit-actions a::after {
  background: rgba(7,28,25,.38) !important;
  color: #fff !important;
  backdrop-filter: blur(8px);
}
.visit-actions span {
  color: #fff !important;
  text-shadow: 0 1px 8px rgba(0,0,0,.7);
}
@media (max-width: 520px) {
  .visit-actions a {
    min-height: 12rem !important;
  }
}

/* Una familia visual para volver, menú y portada en todas las herramientas. */
.weather-nav,
.tool-frame-page .tool-float-nav {
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
}

:is(.weather-nav-button, .round-nav, .route-round, .tool-circle) {
  width: 50px !important;
  min-width: 50px !important;
  height: 50px !important;
  min-height: 50px !important;
  padding: 0 !important;
  display: grid !important;
  place-items: center !important;
  gap: 0 !important;
  border: 2px solid #071c19 !important;
  border-radius: 50% !important;
  background: #d9f668 !important;
  color: #071c19 !important;
  box-shadow: 4px 4px 0 #071c19, 0 15px 32px rgba(7,28,25,.16) !important;
  backdrop-filter: none !important;
  text-decoration: none !important;
  transition: transform .17s ease, box-shadow .17s ease, background .17s ease !important;
}
:is(.weather-nav-button--light, .round-nav--web, .route-round--light, .tool-circle--light) {
  background: #fffdf7 !important;
  color: #071c19 !important;
}
:is(.weather-nav-button, .round-nav, .route-round, .tool-circle):hover,
:is(.weather-nav-button, .round-nav, .route-round, .tool-circle):focus-visible {
  transform: translate(-2px, -2px) !important;
  background: #efffa9 !important;
  box-shadow: 7px 7px 0 #071c19, 0 19px 38px rgba(7,28,25,.19) !important;
  outline: 3px solid rgba(21,87,165,.28) !important;
  outline-offset: 3px;
}
:is(.weather-nav-button, .round-nav, .route-round, .tool-circle) svg {
  width: 23px !important;
  height: 23px !important;
}
.tool-frame-page .tool-float-nav .tool-circle span {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0,0,0,0) !important;
  white-space: nowrap !important;
  border: 0 !important;
}

/* Dock móvil editorial: sin duplicar El Hoyo a mano. */
.village-dock button:nth-child(2) {
  background: var(--alive-acid) !important;
}
.village-dock button:nth-child(2).is-saved {
  background: var(--alive-coral) !important;
}

@media (max-width: 767px) {
  /* La palma es el único acceso práctico y queda separada de la flecha de subida. */
  body.village-alive .mobile-utility-launcher {
    left: auto !important;
    right: max(.8rem, env(safe-area-inset-right)) !important;
    bottom: calc(92px + env(safe-area-inset-bottom)) !important;
    width: 58px !important;
    height: 58px !important;
    z-index: 820 !important;
  }
  body.village-alive .v80-scroll-top {
    left: max(.8rem, env(safe-area-inset-left)) !important;
    right: auto !important;
    bottom: calc(94px + env(safe-area-inset-bottom)) !important;
    width: 52px !important;
    height: 52px !important;
    z-index: 810 !important;
  }
  body.village-alive .adaptive-mode-button {
    top: calc(max(.75rem, env(safe-area-inset-top)) + 4.8rem) !important;
    right: .75rem !important;
    bottom: auto !important;
    min-height: 42px !important;
    padding: .5rem .72rem !important;
    font-size: .72rem !important;
  }
  body.village-alive {
    padding-bottom: calc(6.4rem + env(safe-area-inset-bottom)) !important;
  }
  .village-hero__doors a[hidden] {
    display: none !important;
  }
  .village-hero__doors {
    grid-template-columns: 1fr 1fr !important;
  }
  .village-switchboard .switchboard-grid {
    grid-template-columns: 1fr !important;
  }
  .village-switchboard .switch-card,
  .village-switchboard .switch-card--wide {
    grid-column: auto !important;
    min-height: 96px;
  }
}

/* Contraste reforzado en la versión para personas mayores. */
body.elder-friendly :is(.page-hero, .section-hero, .article-hero) h1,
body.elder-friendly :is(.page-hero, .section-hero, .article-hero) h2 {
  color: var(--senior-green-dark) !important;
  text-shadow: none !important;
}
body.elder-friendly .section-hero-inner,
body.elder-friendly .article-hero-inner {
  position: relative;
  z-index: 2;
  grid-column: 2;
  grid-row: 1;
  width: auto;
  max-width: none;
  margin: 0;
  padding: clamp(1.4rem, 4vw, 3rem);
  align-self: center;
  color: var(--senior-text) !important;
  text-shadow: none !important;
}
body.elder-friendly .section-hero-inner > p,
body.elder-friendly .article-hero-inner > p {
  color: var(--senior-text) !important;
  text-shadow: none !important;
}
body.elder-friendly .section-hero-inner .hero-index,
body.elder-friendly .article-hero-inner .hero-index {
  color: #3f4944 !important;
}
body.elder-friendly .section-stamp {
  position: static !important;
  width: auto !important;
  min-height: 0 !important;
  aspect-ratio: auto !important;
  margin: 1.2rem 0 0 !important;
  padding: 1rem 1.1rem !important;
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  justify-content: flex-start !important;
  gap: .85rem !important;
  border: 3px solid var(--senior-border) !important;
  border-radius: 15px !important;
  background: var(--senior-green-soft) !important;
  color: var(--senior-text) !important;
  box-shadow: var(--senior-shadow) !important;
  transform: none !important;
  backdrop-filter: none !important;
  text-align: left !important;
}
body.elder-friendly .section-stamp span {
  flex: 0 0 auto;
  color: var(--senior-green-dark) !important;
  font: 800 2rem/1 var(--senior-font) !important;
}
body.elder-friendly .section-stamp small {
  max-width: none !important;
  margin: 0 !important;
  color: #171717 !important;
  font: 800 .96rem/1.35 var(--senior-font) !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
}
body.elder-friendly :is(.adaptive-page-summary, .profile-home-panel, .reading-note, .resource-card, .visit-plan-card) {
  color: #171717 !important;
}
body.elder-friendly :is(.adaptive-page-summary, .profile-home-panel, .reading-note, .resource-card, .visit-plan-card)
:is(p, li, small, span) {
  color: #262626 !important;
}

@media (max-width: 820px) {
  body.elder-friendly .section-hero-inner,
  body.elder-friendly .article-hero-inner {
    grid-column: 1 !important;
    grid-row: 2 !important;
    background: #fff !important;
  }
}
.choice-practical {
  margin: 1.35rem 0 0;
  padding: .9rem 1rem;
  border-left: 5px solid var(--adapt-green-2);
  background: rgba(255,255,255,.58);
  color: #28332e;
  line-height: 1.45;
}
.choice-practical a {
  color: #073d29;
  font-weight: 900;
  text-underline-offset: .18em;
}




/* Los iconos de volver y casa son siempre iconos puros: sin chips ni etiquetas emergentes. */
.v81-nav-chip[data-v81-label] {
  width: 50px !important;
  min-width: 50px !important;
  padding: 0 !important;
  border-radius: 50% !important;
}
.v81-nav-chip[data-v81-label]::after,
.tool-frame-page .tool-float-nav .tool-circle::after {
  content: none !important;
  display: none !important;
}

/* Auditoría de contraste: superficies oscuras conservan texto claro en todas las vistas. */
.resource-card,
.resource-card:hover,
.resource-card:focus-visible,
body.kids-version .resource-card,
body.mode-quick-content .resource-card {
  color: #fff !important;
}
.resource-card :is(strong, small, span, p, .resource-eyebrow, .resource-arrow),
body.kids-version .resource-card :is(strong, small, span, p, .resource-eyebrow, .resource-arrow),
body.mode-quick-content .resource-card :is(strong, small, span, p, .resource-eyebrow, .resource-arrow) {
  color: #fff !important;
  text-shadow: none !important;
}
.resource-card small { color: rgba(255,255,255,.86) !important; }

/* La versión para mayores usa dos familias inequívocas: papel claro + tinta oscura; verde + blanco. */
body.elder-friendly :is(.adaptive-page-summary, .profile-home-panel, .reading-note, .visit-plan-card) {
  color: #171717 !important;
}
body.elder-friendly :is(.adaptive-page-summary, .profile-home-panel, .reading-note, .visit-plan-card)
:is(p, li, small, span, strong, h1, h2, h3) {
  color: #171717 !important;
  text-shadow: none !important;
}
body.elder-friendly :is(.resource-card, .adaptive-page-summary__trail, .senior-memory-block,
  .profile-home-panel__grid a:first-child, .button, .button-primary, .button-secondary,
  .tool-back-button, .source-link, .card-link) {
  color: #fff !important;
}
body.elder-friendly :is(.resource-card, .adaptive-page-summary__trail, .senior-memory-block,
  .profile-home-panel__grid a:first-child, .button, .button-primary, .button-secondary,
  .tool-back-button, .source-link, .card-link)
:is(p, li, small, span, strong, h1, h2, h3, b) {
  color: #fff !important;
  text-shadow: none !important;
}
body.elder-friendly .resource-card small,
body.elder-friendly .adaptive-page-summary__trail a span {
  color: rgba(255,255,255,.88) !important;
}
body.elder-friendly :is(.section-hero-inner, .article-hero-inner, .hero-inner) {
  background: #fff !important;
  color: #171717 !important;
}
body.elder-friendly :is(.section-hero-inner, .article-hero-inner, .hero-inner)
:is(p, span, small, strong, h1, h2, h3) {
  color: #171717 !important;
  text-shadow: none !important;
}
body.elder-friendly :is(.section-hero-inner, .article-hero-inner) .hero-index {
  color: #38433e !important;
}
body.elder-friendly .travel-share-links .resource-card {
  background: linear-gradient(135deg, #0a4b3a, #08372d) !important;
  border-color: #071c19 !important;
}

/* Primera visita: servicio más luminoso y mapa/rutas representado por una carretera real. */
.visit-actions a:nth-child(3) {
  background-image:
    linear-gradient(180deg, rgba(7,28,25,.02) 0%, rgba(7,28,25,.12) 46%, rgba(7,28,25,.66) 100%),
    url('/images/archivo-ivan-rodrigo/archivo-local/parque-y-chiringuito.webp') !important;
  background-position: center 58% !important;
}
.visit-actions a:nth-child(4) {
  background-image:
    linear-gradient(180deg, rgba(7,28,25,.02) 0%, rgba(7,28,25,.14) 48%, rgba(7,28,25,.66) 100%),
    url('/images/archivo-ivan-rodrigo/archivo-local/carretera-paisaje.webp') !important;
  background-position: center !important;
}

/* Palma integrada en la web editorial móvil: un único acceso, sobre el dock y lejos de la flecha. */
@media (max-width: 767px) {
  body.village-alive .village-page-tools {
    display: block !important;
    position: fixed !important;
    z-index: 840 !important;
    top: auto !important;
    right: max(.75rem, env(safe-area-inset-right)) !important;
    bottom: calc(86px + env(safe-area-inset-bottom)) !important;
    transform: none !important;
    width: 58px !important;
    height: 58px !important;
  }
  body.village-alive .village-page-tools > :not(.v82-hand-launcher) {
    display: none !important;
  }
  body.village-alive .village-page-tools .v82-hand-launcher {
    display: grid !important;
    width: 58px !important;
    min-width: 58px !important;
    height: 58px !important;
    padding: 0 !important;
    place-items: center !important;
    border-radius: 50% !important;
    gap: 0 !important;
  }
  body.village-alive .village-page-tools .v82-hand-launcher > span,
  body.village-alive .village-page-tools .v82-hand-launcher::after {
    display: none !important;
  }
  body.village-alive .v80-scroll-top {
    left: max(.75rem, env(safe-area-inset-left)) !important;
    right: auto !important;
    bottom: calc(89px + env(safe-area-inset-bottom)) !important;
  }
}

@media (max-width: 360px) {
  body.village-alive .village-page-tools {
    right: max(.55rem, env(safe-area-inset-right)) !important;
  }
  body.village-alive .v80-scroll-top {
    left: max(.55rem, env(safe-area-inset-left)) !important;
  }
}

/* Stellarium no documenta un parámetro estable para plegar su promoción lateral.
   En esa herramienta liberamos por completo la parte superior para poder cerrar su panel. */
.tool-frame-page.tool-sky .tool-float-nav,
.tool-frame-page.tool-sky .tool-side-actions {
  top: auto !important;
  bottom: max(14px, env(safe-area-inset-bottom)) !important;
}
.tool-frame-page.tool-sky .tool-float-nav {
  left: max(14px, env(safe-area-inset-left)) !important;
}
.tool-frame-page.tool-sky .tool-side-actions {
  right: max(14px, env(safe-area-inset-right)) !important;
}
.tool-frame-page.tool-sky .tool-return-hint {
  display: none !important;
}



.choice-hero__copy {
  max-width: min(760px, 92%);
}

.choice-hero__copy > p:not(.choice-brand) {
  max-width: 660px;
}

.choice-hero__promises {
  display: flex;
  flex-wrap: wrap;
  gap: .5rem;
  margin-top: 1.35rem;
}

.choice-hero__promises span {
  padding: .48rem .72rem;
  border: 1px solid rgba(255, 255, 255, .48);
  border-radius: 999px;
  background: rgba(4, 24, 18, .34);
  color: #fff;
  font-size: .76rem;
  font-weight: 850;
  backdrop-filter: blur(8px);
}

.choice-hero__start {
  width: fit-content;
  min-height: 52px;
  margin-top: 1.25rem;
  padding: .75rem 1rem;
  display: inline-flex;
  align-items: center;
  gap: .75rem;
  border: 2px solid #fff;
  border-radius: 999px;
  background: #d9f668;
  color: #071c19 !important;
  box-shadow: 4px 4px 0 #071c19;
  font-weight: 950;
  text-decoration: none;
  transition: transform .18s ease, box-shadow .18s ease;
}

.choice-hero__start:hover,
.choice-hero__start:focus-visible {
  transform: translate(-2px, -2px);
  box-shadow: 6px 6px 0 #071c19;
  outline: 3px solid rgba(255,255,255,.8);
  outline-offset: 3px;
}

.choice-panel__head {
  max-width: 780px;
}

.choice-panel__intro {
  max-width: 680px !important;
  margin-bottom: 1rem !important;
  font-size: 1.12rem !important;
}

.choice-discover {
  margin: 0 0 1.5rem;
  padding: 1rem 1.1rem;
  border-left: 6px solid #1e654e;
  border-radius: 0 18px 18px 0;
  background: rgba(255, 255, 255, .72);
}

.choice-discover strong {
  display: block;
  margin-bottom: .3rem;
  color: #073d29;
  font-size: 1rem;
}

.choice-discover p {
  margin: 0;
  color: #36423c;
  line-height: 1.5;
}

.choice-stage {
  margin: 0 0 1.35rem;
  padding: 1.1rem;
  border: 3px solid #17221e;
  border-radius: 24px;
  background: #fffaf0;
  box-shadow: 5px 5px 0 rgba(23, 34, 30, .13);
  transition: opacity .2s ease, transform .2s ease, border-color .2s ease, background .2s ease;
}

.choice-stage__head {
  display: grid;
  grid-template-columns: 64px minmax(0, 1fr);
  gap: .9rem;
  align-items: center;
  margin-bottom: 1rem;
}

.choice-stage__foot {
  position: relative;
  width: 60px;
  height: 60px;
  display: grid;
  place-items: center;
  border: 3px solid #17221e;
  border-radius: 50%;
  background: #d9f668;
  color: #17221e;
  box-shadow: 3px 3px 0 #17221e;
}

.choice-stage__foot svg {
  width: 38px;
  height: 38px;
  fill: currentColor;
  opacity: .26;
}

.choice-stage__foot b {
  position: absolute;
  inset: 0;
  display: grid;
  place-items: center;
  font-size: 1.35rem;
  font-weight: 950;
}

.choice-stage__eyebrow {
  margin: 0 0 .25rem;
  color: #1e654e;
  font-size: .72rem;
  font-weight: 950;
  letter-spacing: .13em;
  text-transform: uppercase;
}

.choice-stage h3 {
  margin: 0;
  font: 700 clamp(1.55rem, 3vw, 2.15rem)/1.05 Georgia, serif;
  letter-spacing: -.025em;
}

.choice-stage__head div > p:last-child {
  margin: .35rem 0 0;
  color: #46514c;
  line-height: 1.4;
}

.choice-stage.is-complete {
  border-color: #1e654e;
  background: #f1f8f3;
}

.choice-stage.is-complete .choice-stage__foot {
  background: #1e654e;
  color: #fff;
}

.choice-mode.is-locked {
  opacity: .55;
  filter: grayscale(.25);
}

.choice-mode.is-locked .choice-card {
  pointer-events: none;
}

.choice-mode.is-ready {
  opacity: 1;
  border-color: #1557a5;
  background: #f6f9ff;
  filter: none;
  transform: translateY(-2px);
}

.choice-mode.is-ready .choice-stage__foot {
  background: #a9d4ff;
}

.choice-mode.is-ready [data-mode-instruction] {
  color: #0b513e;
  font-weight: 850;
}

.choice-audience--needs-attention {
  animation: choice-attention .5s ease 2;
  border-color: #a94727 !important;
}

.choice-audience__status:not(:empty) {
  margin: .85rem 0 0;
  padding: .75rem .9rem;
  border-radius: 14px;
  background: #eef7f1;
  color: #0b513e;
  font-weight: 850;
}

@keyframes choice-attention {
  50% { transform: translateX(5px); }
}

@media (max-width: 767px) {
  .choice-hero__promises {
    gap: .35rem;
  }

  .choice-hero__promises span {
    padding: .38rem .58rem;
    font-size: .68rem;
  }

  .choice-hero__start {
    min-height: 48px;
    font-size: .86rem;
  }

  .choice-stage {
    padding: .9rem;
    border-radius: 20px;
  }

  .choice-stage__head {
    grid-template-columns: 52px minmax(0, 1fr);
    gap: .75rem;
  }

  .choice-stage__foot {
    width: 50px;
    height: 50px;
  }

  .choice-stage__foot svg {
    width: 31px;
    height: 31px;
  }

  .choice-stage h3 {
    font-size: 1.45rem;
  }
}

@media (prefers-reduced-motion: reduce) {
  .choice-audience--needs-attention {
    animation: none;
  }
}



/* ===== Bienvenida final: atractiva, rápida y sin bloqueos ===== */
.final-welcome .choice-shell { max-width: 1500px; }
.final-welcome__hero { min-height: min(92svh, 900px); }
.final-welcome__hero .choice-hero__copy { max-width: 760px; }
.final-welcome__hero h1 { max-width: 12ch; text-wrap: balance; }
.final-welcome__hero .final-welcome__invitation { max-width: 66ch; color: rgba(255,255,255,.92); }
.final-welcome__discover { padding: clamp(2rem,6vw,5.5rem) clamp(1rem,5vw,4.5rem); background: #f5f1e7; }
.final-welcome__section-head { max-width: 800px; margin-bottom: 1.5rem; }
.final-welcome__section-head h2 { margin: .2rem 0 .6rem; font: 800 clamp(2.4rem,6vw,5.8rem)/.94 Georgia,serif; letter-spacing: -.055em; text-wrap: balance; }
.final-welcome__section-head > p:last-child { max-width: 64ch; color:#48564f; font-size: clamp(1rem,2vw,1.25rem); line-height:1.55; }
.final-welcome__doors { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:clamp(.8rem,2vw,1.4rem); }
.final-welcome__doors a { position:relative; min-height:clamp(260px,38vw,500px); overflow:hidden; border:2px solid #071c19; border-radius:28px; color:#fff; box-shadow:7px 7px 0 #071c19; isolation:isolate; }
.final-welcome__doors img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; transition:transform .45s ease,filter .45s ease; }
.final-welcome__doors a::after { content:""; position:absolute; inset:0; z-index:0; background:linear-gradient(180deg,transparent 22%,rgba(4,18,15,.82)); }
.final-welcome__doors a > span { position:absolute; z-index:1; inset:auto 1.1rem 1.1rem; display:grid; gap:.35rem; }
.final-welcome__doors small { font-weight:950; letter-spacing:.13em; text-transform:uppercase; }
.final-welcome__doors strong { max-width:24ch; font:800 clamp(1.4rem,3vw,2.55rem)/1.03 Georgia,serif; text-wrap:balance; }
.final-welcome__doors b { width:fit-content; margin-top:.35rem; padding:.55rem .78rem; border-radius:999px; background:#d9f668; color:#071c19; }
.final-welcome__doors a:hover img,.final-welcome__doors a:focus-visible img { transform:scale(1.055); filter:saturate(1.08); }
.final-welcome__doors a:focus-visible { outline:4px solid #1557a5; outline-offset:5px; }
.final-welcome__personalize { padding-top:clamp(2.2rem,5vw,4.5rem); }
.final-welcome .choice-mode { opacity:1!important; filter:none!important; pointer-events:auto!important; }
.final-welcome .choice-mode .choice-card { pointer-events:auto!important; opacity:1!important; }
.final-welcome__practical { display:grid!important; grid-template-columns:52px minmax(0,1fr); gap:.8rem; align-items:center; max-width:780px; padding:1rem!important; }
.final-welcome__practical > span { width:52px; height:52px; display:grid; place-items:center; border:2px solid #071c19; border-radius:50%; background:#d9f668; box-shadow:3px 3px 0 #071c19; font-size:1.45rem; }
.final-welcome__practical p { margin:.2rem 0 0; }

/* ===== Responsive y tipografía resistente ===== */
html { max-width:100%; overflow-x:clip; }
body { max-width:100%; overflow-x:clip; }
:is(main,section,article,aside,nav,header,footer,div,figure,figcaption,li,a,button,span,strong,small,p,h1,h2,h3,h4) { min-width:0; }
:is(h1,h2,h3,h4,.card-title,.choice-card strong,.adaptive-card strong,.profile-card strong) { text-wrap:balance; word-break:normal; overflow-wrap:break-word; hyphens:none; }
:is(p,li,figcaption,small,a,button,label) { word-break:normal; overflow-wrap:break-word; hyphens:none; }
img,video,iframe,svg,canvas { max-width:100%; }
:is(.card-grid,.feature-grid,.story-grid,.resource-grid,.quick-grid,.profile-grid,.kids-mission-grid,.adventure-route-grid) > * { min-width:0; max-width:100%; }
:is(.choice-card,.quick-row,.action-row,.profile-card,.adaptive-card,.section-card,.story-card,.resource-card) { max-width:100%; }
:is(a,button,input,select,textarea,[tabindex]):focus-visible { outline:3px solid #1557a5!important; outline-offset:3px!important; }
@media (max-width:760px) {
  .final-welcome__doors { grid-template-columns:1fr; }
  .final-welcome__doors a { min-height:300px; }
  .final-welcome__discover { padding-inline:.85rem; }
  .final-welcome__section-head h2 { font-size:clamp(2.35rem,14vw,4.4rem); }
  .choice-options--all { grid-template-columns:1fr!important; }
  .choice-card { grid-template-columns:58px minmax(0,1fr)!important; }
}
@media (max-width:360px) {
  .choice-card { padding:.85rem!important; gap:.65rem!important; }
  .choice-card__icon { width:52px!important; height:52px!important; }
  .choice-card strong { font-size:1.05rem!important; }
  .choice-card small { font-size:.82rem!important; }
  .final-welcome__doors a { min-height:270px; }
}
@media (prefers-reduced-motion:reduce) {
  .final-welcome__doors img { transition:none; }
}

/* ===== Contraste sólido en la versión para personas mayores ===== */
body.elder-friendly :is(.senior-card,.elder-card,.quick-card,.profile-card,.adaptive-card,.resource-card,.visit-card,.transport-card) { color:#102018!important; }
body.elder-friendly :is(.senior-card,.elder-card,.quick-card,.profile-card,.adaptive-card,.resource-card,.visit-card,.transport-card) :is(h2,h3,h4,strong,p,small,span:not(.icon):not([aria-hidden="true"])) { color:inherit!important; opacity:1!important; }
body.elder-friendly :is(.senior-card,.elder-card,.quick-card,.profile-card,.adaptive-card,.resource-card,.visit-card,.transport-card)[class*="dark"],
body.elder-friendly :is(.senior-card,.elder-card,.quick-card,.profile-card,.adaptive-card,.resource-card,.visit-card,.transport-card)[style*="background"] { color:#fff!important; }
body.elder-friendly a { text-decoration-thickness:.12em; text-underline-offset:.16em; }
body.elder-friendly :is(button,a) { min-height:48px; }

/* Las tarjetas muestran el texto completo: sin elipsis ni cortes de palabras. */
:is(.choice-card,.resource-card,.story-card,.section-card,.profile-card,.adaptive-card,.quick-row,.action-row,.visit-card,.transport-card,.kids-mission-card,.adventure-route) :is(h2,h3,h4,strong,small,p,span:not([aria-hidden="true"])) {
  max-width: 100%;
  white-space: normal !important;
  overflow: visible !important;
  text-overflow: clip !important;
  -webkit-line-clamp: unset !important;
  line-clamp: unset !important;
}
.utilities-page :is(.quick-row,.action-row) small { white-space:normal!important; overflow:visible!important; text-overflow:clip!important; }

/* Cierre de contraste: las tarjetas oscuras conservan siempre texto blanco en la vista para mayores. */
body.elder-friendly :is(.resource-card,.travel-share-links .resource-card,.visit-actions a,.profile-home-panel__grid a:first-child,.adaptive-page-summary__trail,.senior-memory-block) {
  color:#fff !important;
}
body.elder-friendly :is(.resource-card,.travel-share-links .resource-card,.visit-actions a,.profile-home-panel__grid a:first-child,.adaptive-page-summary__trail,.senior-memory-block) :is(h1,h2,h3,h4,p,li,strong,small,span,b) {
  color:#fff !important;
  opacity:1 !important;
  text-shadow:none !important;
}

/* Contraste final WCAG: tonos secundarios y zonas oscuras. */
:root { --muted:#52645d; }
body.elder-friendly .site-footer,
body.elder-friendly .site-footer :is(h2,h3,p,a,span,small,strong,li) {
  color:#fff !important;
  opacity:1 !important;
}
body.elder-friendly .rail-next,
body.elder-friendly .rail-next :is(span,strong,small) { color:#fff !important; }
body.elder-friendly :is(.time-card,.atlas-card),
body.elder-friendly :is(.time-card,.atlas-card) :is(h2,h3,p,small,strong,span) { color:#fff !important; }
body.elder-friendly .senior-section h3,
body.elder-friendly .senior-home h3 { color:#173f33 !important; }
body.elder-friendly .section-number,
.error-page .section-number { color:#0b4b3b !important; }
.alive-kicker { color:#9a351f !important; }

/* Ajustes finales surgidos de la comprobación automática de contraste. */
.photo-credit,
.article-card figure .photo-credit { color:#675f57 !important; }
.author-primary .inline-photo-credit,
.author-feature .inline-photo-credit,
.author-portrait .inline-photo-credit { color:#f4efe5 !important; }

.section-manifesto > .section-number,
.privacy-policy-lead > .section-number,
.article-body > .section-number,
.error-page > .section-number { color:#0b4b3b !important; }

.poetry-pause,
.poetry-pause p { color:#102018 !important; }
.poetry-pause cite,
.poetry-pause cite a { color:#6b2818 !important; }
.poetry-pause--dark,
.poetry-pause--dark p,
.poetry-pause--dark cite,
.poetry-pause--dark cite a { color:#fff !important; }

.suggestion-back-link.button-primary,
.suggestion-back-link.button-primary :is(span,strong) { color:#fff !important; }

/* El pequeño rótulo cambia de color según la superficie sobre la que vive. */
.alive-kicker { color:#8a2d19 !important; }
.village-switchboard .alive-kicker,
.village-atlas .alive-kicker,
.memory-radio .alive-kicker,
.daily-door .alive-kicker { color:#d7ff63 !important; }
.book-alive .alive-kicker,
.village-voices .alive-kicker,
.village-contribute .alive-kicker { color:#10110d !important; }

body.elder-friendly .village-hero__doors :is(a,button),
body.elder-friendly .village-hero__doors :is(a,button) :is(span,strong,small) { color:#fff !important; }
body.elder-friendly .switch-card--wide,
body.elder-friendly .switch-card--wide :is(strong,small,span,p) { color:#10110d !important; }
body.elder-friendly .memory-radio,
body.elder-friendly .memory-radio :is(h2,h3,p,small,strong,span) { color:#fff !important; }

/* Los rótulos de la portada para mayores no dependen del dorado tenue. */
body.senior-home .senior-menu-section > h3,
body.elder-friendly .senior-menu-section > h3 { color:#173f33 !important; }

/* Especificidad final para componentes heredados. */
.article-card .poetry-pause p { color:#102018 !important; }
.article-card .poetry-pause cite,
.article-card .poetry-pause cite a { color:#6b2818 !important; }
.article-card .poetry-pause--dark p,
.article-card .poetry-pause--dark cite,
.article-card .poetry-pause--dark cite a { color:#fff !important; }

.senior-footer .footer-nav h3 { color:#173f33 !important; }
.creator-profile-media .inline-photo-credit { color:#fff !important; }

.article-card > section > .section-number,
.suggestion-intro > .section-number,
.privacy-first-layer > .section-number,
.license-intro > .section-number,
.v81-corrillo-threads > .section-number { color:#0b4b3b !important; }
.creator-profile .section-number { color:#fff !important; }
body.elder-friendly .creator-profile .section-number { color:#fff !important; }
.memory-radio .alive-kicker { color:#fff !important; }

/* La transcripción abre una hoja clara dentro de la tarjeta de radio: texto oscuro siempre. */
.memory-radio .audio-transcript,
.memory-radio .audio-transcript :is(summary,p,div,span,strong,small),
body.elder-friendly .memory-radio .audio-transcript,
body.elder-friendly .memory-radio .audio-transcript :is(summary,p,div,span,strong,small) {
  color: #102018 !important;
}
.memory-radio .audio-transcript summary::after,
body.elder-friendly .memory-radio .audio-transcript summary::after {
  color: #8a2d19 !important;
}

/* ===== Entrega final: portada fluida y tarjetas resistentes ===== */
*,*::before,*::after{box-sizing:border-box}
html,body{width:100%;max-width:100%;overflow-x:clip}

/* La portada se adapta al contenido: nunca recorta y no reserva una pantalla vacía. */
.final-welcome .choice-shell{
  display:block!important;
  width:100%;
  max-width:none!important;
  min-height:0!important;
}
.final-welcome__hero{
  position:relative!important;
  top:auto!important;
  width:100%;
  height:auto!important;
  min-height:clamp(42rem,88svh,58rem)!important;
  display:grid!important;
  align-items:center;
  overflow:hidden!important;
  padding:clamp(4.25rem,8vh,7rem) clamp(1rem,5vw,6rem) clamp(2.75rem,6vh,5rem)!important;
  isolation:isolate;
}
.final-welcome__hero .choice-hero__image,
.final-welcome__hero .choice-hero__shade{position:absolute;inset:0;width:100%;height:100%}
.final-welcome__hero .choice-hero__image{object-fit:cover;object-position:center 55%}
.final-welcome__hero .choice-hero__shade{
  background:linear-gradient(90deg,rgba(3,18,15,.88) 0%,rgba(3,18,15,.68) 48%,rgba(3,18,15,.24) 100%),linear-gradient(180deg,rgba(3,18,15,.08),rgba(3,18,15,.56));
}
.final-welcome__hero .choice-hero__copy{
  position:relative!important;
  inset:auto!important;
  z-index:2;
  width:min(100%,76rem);
  max-width:none!important;
  margin:0!important;
  color:#fff;
}
.final-welcome__hero .choice-brand{margin:0 0 clamp(.6rem,1.4vh,1rem);font-size:clamp(.72rem,.8vw,.9rem)}
.final-welcome__hero h1{
  width:100%;
  max-width:none!important;
  margin:0;
  font-size:clamp(5rem,8.55vw,11.5rem)!important;
  line-height:.78!important;
  letter-spacing:-.065em!important;
  font-weight:500;
  text-wrap:balance;
}
.final-welcome__hero .hero-title-line{display:block;white-space:normal}
.final-welcome__hero .hero-title-line--first{color:#fff}
.final-welcome__hero .hero-title-line--second{color:#f7cf61}
.final-welcome__hero .choice-hero__copy>p:not(.choice-brand){
  width:min(100%,70rem);
  max-width:70rem!important;
  margin:clamp(.85rem,1.6vh,1.2rem) 0 0!important;
  color:rgba(255,255,255,.95);
  font-size:clamp(1rem,1.2vw,1.32rem)!important;
  line-height:1.5!important;
  font-weight:620;
  text-wrap:pretty;
}
.final-welcome__hero .final-welcome__invitation{max-width:66rem!important}
.final-welcome__hero .choice-hero__promises{margin-top:clamp(.9rem,1.8vh,1.35rem)}
.final-welcome__hero .choice-hero__start{margin-top:clamp(1rem,2vh,1.45rem)}

/* Las tarjetas de la portada escalan por su propio ancho, sin cortar palabras. */
.final-welcome__doors{grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(.9rem,2vw,1.5rem)}
.final-welcome__doors>a{
  container-type:inline-size;
  min-width:0;
  min-height:clamp(19rem,34vw,31rem);
}
.final-welcome__doors>a>span{inset:auto clamp(.9rem,4cqi,1.4rem) clamp(.9rem,4cqi,1.4rem)}
.final-welcome__doors strong{
  max-width:22ch!important;
  font-size:clamp(1.42rem,6.4cqi,2.7rem)!important;
  line-height:1.04!important;
  letter-spacing:-.035em;
  overflow-wrap:normal!important;
  word-break:normal!important;
  hyphens:none!important;
  text-wrap:pretty;
}
.final-welcome__doors small,.final-welcome__doors b{
  overflow-wrap:normal!important;
  word-break:normal!important;
  hyphens:none!important;
}
.final-welcome__doors a[href="/memoria"] img{object-position:center 52%}
.final-welcome__doors a[href="/entorno"] img{object-position:center 55%}
.final-welcome__doors a[href="/primera-visita"] img{object-position:center 58%}

/* Todos los bloques flexibles pueden encogerse sin desbordar. */
:is(main,section,article,aside,nav,header,footer,div,figure,figcaption,li,a,button,span,strong,small,p,h1,h2,h3,h4){min-width:0}
:is(.choice-card,.resource-card,.story-card,.section-card,.profile-card,.adaptive-card,.quick-row,.action-row,.visit-card,.transport-card,.kids-mission-card,.adventure-route,.switch-card,.service-entry){max-width:100%;min-width:0}
:is(.choice-card,.resource-card,.story-card,.section-card,.profile-card,.adaptive-card,.quick-row,.action-row,.visit-card,.transport-card,.kids-mission-card,.adventure-route,.switch-card,.service-entry) :is(h2,h3,h4,strong,small,p,span:not([aria-hidden="true"])){
  max-width:100%;
  white-space:normal!important;
  overflow:visible!important;
  text-overflow:clip!important;
  overflow-wrap:normal!important;
  word-break:normal!important;
  hyphens:none!important;
  -webkit-line-clamp:unset!important;
  line-clamp:unset!important;
}
:is(.choice-card,.resource-card,.story-card,.section-card,.profile-card,.adaptive-card,.kids-mission-card,.adventure-route,.switch-card){container-type:inline-size}
.choice-card strong{font-size:clamp(1.08rem,6.5cqi,1.5rem)!important;line-height:1.08!important}
.choice-card small{font-size:clamp(.78rem,3.5cqi,.95rem)!important;line-height:1.4}
img,video,iframe,svg,canvas{max-width:100%}

@media (max-width:899px){
  .final-welcome__hero{
    min-height:0!important;
    align-items:end;
    padding:clamp(4.5rem,11vh,6.5rem) clamp(1rem,4vw,2rem) clamp(2.5rem,6vh,4rem)!important;
  }
  .final-welcome__hero .choice-hero__copy{width:100%}
  .final-welcome__hero h1{font-size:clamp(4rem,13vw,7.4rem)!important;line-height:.8!important;max-width:10ch!important}
  .final-welcome__hero .choice-hero__copy>p:not(.choice-brand){font-size:clamp(.98rem,2.3vw,1.16rem)!important}
  .final-welcome__doors>a{min-height:clamp(18rem,52vw,27rem)}
}
@media (max-width:760px){
  .final-welcome__hero{padding-top:clamp(4rem,8vh,5.5rem)!important}
  .final-welcome__hero h1{font-size:clamp(3.45rem,17vw,5.6rem)!important;line-height:.82!important;max-width:9ch!important}
  .final-welcome__hero .choice-hero__promises{gap:.38rem}
  .final-welcome__hero .choice-hero__promises span{font-size:.68rem;padding:.4rem .58rem}
  .final-welcome__doors{grid-template-columns:1fr}
  .final-welcome__doors>a{min-height:clamp(18rem,92vw,25rem)}
  .final-welcome__doors strong{font-size:clamp(1.55rem,7cqi,2.2rem)!important;max-width:19ch!important}
  .choice-options--all{grid-template-columns:1fr!important}
}
@media (max-width:390px){
  .final-welcome__hero{padding-inline:.85rem!important;padding-bottom:2.2rem!important}
  .final-welcome__hero h1{font-size:clamp(3.05rem,16.5vw,4.25rem)!important;line-height:.84!important}
  .final-welcome__hero .choice-hero__copy>p:not(.choice-brand){font-size:.96rem!important;line-height:1.45!important}
  .final-welcome__hero .choice-hero__start{width:100%;justify-content:center;text-align:center}
  .choice-card{grid-template-columns:52px minmax(0,1fr)!important;padding:.85rem!important;gap:.7rem!important}
  .choice-card__icon{width:52px!important;height:52px!important}
}
@media (min-width:1400px) and (min-height:850px){
  .final-welcome__hero h1{font-size:clamp(8rem,8.8vw,11.5rem)!important}
}
@media (min-width:900px) and (max-height:680px){
  .final-welcome__hero{min-height:0!important;padding-block:2.25rem!important}
  .final-welcome__hero h1{font-size:clamp(4.4rem,7.2vw,7rem)!important}
  .final-welcome__hero .choice-hero__copy>p:not(.choice-brand){margin-top:.65rem!important;font-size:clamp(.94rem,1.1vw,1.08rem)!important;line-height:1.38!important}
  .final-welcome__hero .choice-hero__promises{margin-top:.65rem}
  .final-welcome__hero .choice-hero__start{margin-top:.75rem;min-height:48px}
}
@media (prefers-reduced-motion:reduce){.final-welcome__doors img{transition:none}}

/* ===== Citas literarias: contraste, jerarquía y responsive =====
   Recupera el diseño oscuro original de poetry-pause y evita que las reglas
   generales de blockquote o de contraste lo conviertan en blanco sobre lima. */
body.village-alive .article-card .poetry-pause {
  position: relative;
  margin: clamp(1.6rem, 4vw, 2.6rem) 0;
  padding: clamp(1.5rem, 4vw, 2.8rem);
  overflow: hidden;
  border: 2px solid rgba(255, 255, 255, .16) !important;
  border-radius: clamp(20px, 3vw, 30px) !important;
  background:
    radial-gradient(circle at 92% 10%, rgba(215, 255, 99, .12), transparent 30%),
    linear-gradient(145deg, #123e34, #072b24) !important;
  color: #fff !important;
  box-shadow:
    8px 8px 0 #071c19,
    0 20px 44px rgba(7, 28, 25, .2) !important;
  transform: none !important;
}

body.village-alive .article-card .poetry-pause::after {
  content: "“";
  position: absolute;
  top: -.4rem;
  right: 1rem;
  color: rgba(255, 255, 255, .08) !important;
  font: 400 clamp(5rem, 12vw, 8rem)/1 Georgia, "Times New Roman", serif;
  pointer-events: none;
}

body.village-alive .article-card .poetry-pause p {
  position: relative;
  z-index: 1;
  max-width: 28ch;
  margin: 0 !important;
  color: #fff !important;
  font-family: Georgia, "Times New Roman", serif !important;
  font-size: clamp(1.35rem, 3vw, 2.25rem) !important;
  font-style: normal !important;
  font-weight: 700 !important;
  line-height: 1.28 !important;
  letter-spacing: -.025em;
  text-wrap: balance;
}

body.village-alive .article-card .poetry-pause cite {
  position: relative;
  z-index: 1;
  display: block;
  margin-top: clamp(.85rem, 2vw, 1.25rem);
  color: #f1d281 !important;
  font-family: Inter, system-ui, sans-serif !important;
  font-size: clamp(.78rem, 1.5vw, .96rem) !important;
  font-style: normal;
  font-weight: 850;
  line-height: 1.45;
}

body.village-alive .article-card .poetry-pause cite a {
  color: inherit !important;
  text-decoration-color: rgba(241, 210, 129, .65) !important;
  text-decoration-thickness: 2px;
  text-underline-offset: .2em;
}

body.village-alive .article-card .poetry-pause cite a:hover,
body.village-alive .article-card .poetry-pause cite a:focus-visible {
  color: #fff !important;
  text-decoration-color: #fff !important;
}

@media (max-width: 600px) {
  body.village-alive .article-card .poetry-pause {
    padding: 1.35rem 1.2rem 1.45rem;
    border-radius: 21px !important;
    box-shadow:
      5px 5px 0 #071c19,
      0 15px 30px rgba(7, 28, 25, .18) !important;
  }

  body.village-alive .article-card .poetry-pause p {
    max-width: none;
    font-size: clamp(1.25rem, 6.4vw, 1.7rem) !important;
    line-height: 1.32 !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  body.village-alive .article-card .poetry-pause {
    transform: none !important;
  }
}
