/* ============================================================
   FUENTES LOCALES — Sin dependencias externas
   ============================================================ */
@font-face {
  font-family: 'Playfair Display';
  font-style: normal; font-weight: 400; font-display: swap;
  src: url(/public/fonts/playfair-400.woff2) format('woff2');
}
@font-face {
  font-family: 'Playfair Display';
  font-style: normal; font-weight: 700; font-display: swap;
  src: url(/public/fonts/playfair-700.woff2) format('woff2');
}
@font-face {
  font-family: 'Playfair Display';
  font-style: italic; font-weight: 400; font-display: swap;
  src: url(/public/fonts/playfair-400i.woff2) format('woff2');
}
@font-face {
  font-family: 'Lora';
  font-style: normal; font-weight: 400; font-display: swap;
  src: url(/public/fonts/lora-400.woff2) format('woff2');
}
@font-face {
  font-family: 'Lora';
  font-style: italic; font-weight: 400; font-display: swap;
  src: url(/public/fonts/lora-400i.woff2) format('woff2');
}
@font-face {
  font-family: 'DM Mono';
  font-style: normal; font-weight: 400; font-display: swap;
  src: url(/public/fonts/dmmono-400.woff2) format('woff2');
}


/* ============================================================ VARIABLES */
:root {
  --tierra-xo:  #2A1A0F;
  --tierra-o:   #3D2B1F;
  --tierra-m:   #7A4E35;
  --tierra:     #B5763A;
  --tierra-c:   #D4A96A;
  --tierra-s:   #EDD9B4;

  --verde-o:    #1E3320;
  --verde-m:    #2D4A2D;
  --verde:      #4A6741;
  --verde-c:    #7A9E6B;
  --verde-s:    #C8DDB8;
  --verde-xs:   #EBF3E4;

  --azul-o:     #1A3A50;
  --azul-m:     #2D5A7A;
  --azul:       #3A7AAA;
  --azul-c:     #6BAAD0;
  --azul-s:     #D0ECF8;

  --piedra-o:   #8A7A6A;
  --piedra:     #C8B89A;
  --piedra-c:   #EDE4D3;
  --hueso:      #F7F2EA;
  --blanco:     #FDFBF7;

  --txt:        #2A1F14;
  --txt-m:      #5A4030;
  --txt-s:      #8A7060;

  --ff-t: 'Playfair Display', Georgia, serif;
  --ff-b: 'Lora', Georgia, serif;
  --ff-m: 'DM Mono', monospace;

  --nav-h: 70px;
  --r:     10px;
  --r-lg:  20px;
  --sh:    0 2px 16px rgba(42,26,15,.1);
  --sh-lg: 0 6px 36px rgba(42,26,15,.18);
  --sh-xl: 0 12px 56px rgba(42,26,15,.24);
  --ease:  cubic-bezier(.25,.46,.45,.94);
  --bounce:cubic-bezier(.34,1.56,.64,1);
}

/* ============================================================ RESET */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;font-size:16px}
body{font-family:var(--ff-b);font-size:1.1rem;line-height:1.75;color:var(--txt);background:var(--blanco);overflow-x:hidden}
img{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
ul{list-style:none}
button{cursor:pointer;border:none;background:none;font-family:inherit}
input,textarea,select{font-family:inherit}

/* ============================================================ TYPOGRAPHY */
h1,h2,h3,h4{font-family:var(--ff-t);line-height:1.15;color:var(--tierra-o)}
h1{font-size:clamp(2.4rem,6vw,4.8rem);letter-spacing:-.02em}
h2{font-size:clamp(1.8rem,3.5vw,2.8rem)}
h3{font-size:clamp(1.2rem,2.5vw,1.6rem)}
h4{font-size:1.1rem}
p{max-width:66ch}
.mono{font-family:var(--ff-m);font-size:.68rem;letter-spacing:.14em;text-transform:uppercase}

/* ============================================================ LAYOUT */
.wrap{width:100%;max-width:1160px;margin:0 auto;padding:0 1.25rem}
.wrap--slim{max-width:740px}
.sec{padding:5rem 0}
.sec--lg{padding:7.5rem 0}
.sec--sm{padding:3rem 0}

/* ============================================================ NAVBAR */
.navbar{position:fixed;top:0;left:0;right:0;z-index:200;height:var(--nav-h);display:flex;align-items:center;transition:background .4s var(--ease),box-shadow .4s var(--ease)}
.navbar.scrolled{background:var(--tierra-o);box-shadow:0 2px 24px rgba(0,0,0,.28)}
.navbar__inner{display:flex;align-items:center;justify-content:space-between;width:100%;max-width:1160px;margin:0 auto;padding:0 1.25rem}
.navbar__logo{display:flex;flex-direction:column;gap:1px;text-decoration:none}
.navbar__logo-name{font-family:var(--ff-t);font-size:1.45rem;font-weight:700;color:#fff;letter-spacing:.02em;line-height:1}
.navbar__logo-sub{font-family:var(--ff-m);font-size:.55rem;letter-spacing:.18em;color:rgba(255,255,255,.4);text-transform:uppercase}
.navbar__links{display:none;align-items:center;gap:.2rem}
.navbar__link{font-family:var(--ff-b);font-size:.95rem;color:rgba(255,255,255,.82);padding:.45rem .9rem;border-radius:6px;position:relative;transition:color .2s;white-space:nowrap}
.navbar__link::after{content:'';position:absolute;bottom:4px;left:.9rem;right:.9rem;height:1px;background:var(--tierra-c);transform:scaleX(0);transform-origin:left;transition:transform .3s var(--ease)}
.navbar__link:hover,.navbar__link.activo{color:#fff}
.navbar__link:hover::after,.navbar__link.activo::after{transform:scaleX(1)}
.burger{display:flex;flex-direction:column;gap:5px;padding:.5rem}
.burger span{display:block;width:24px;height:2px;background:#fff;border-radius:99px;transition:all .3s var(--ease);transform-origin:center}
.burger.open span:nth-child(1){transform:translateY(7px) rotate(45deg)}
.burger.open span:nth-child(2){opacity:0;transform:scaleX(0)}
.burger.open span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}
.mobile-nav{position:fixed;top:var(--nav-h);left:0;right:0;bottom:0;background:var(--tierra-o);z-index:199;display:flex;flex-direction:column;padding:2.5rem 2rem;transform:translateX(100%);transition:transform .35s var(--ease);overflow-y:auto}
.mobile-nav.open{transform:translateX(0)}
.mobile-nav__link{font-family:var(--ff-t);font-size:2rem;font-style:italic;color:rgba(255,255,255,.8);padding:.75rem 0;border-bottom:1px solid rgba(255,255,255,.07);transition:color .2s,padding-left .25s var(--ease)}
.mobile-nav__link:hover,.mobile-nav__link.activo{color:var(--tierra-c);padding-left:.75rem}
.mobile-nav__foot{margin-top:auto;padding-top:2rem;font-family:var(--ff-m);font-size:.58rem;color:rgba(255,255,255,.2);letter-spacing:.1em;text-transform:uppercase}
@media(min-width:768px){.navbar__links{display:flex}.burger{display:none}}

/* ============================================================ FOOTER */
.footer{background:var(--tierra-o);color:rgba(255,255,255,.7);padding:4rem 0 2.5rem}
.footer__grid{display:grid;grid-template-columns:1fr;gap:2.5rem;margin-bottom:3rem}
.footer__name{font-family:var(--ff-t);font-size:1.8rem;color:#fff;margin-bottom:.4rem}
.footer__tag{font-style:italic;color:rgba(255,255,255,.4);font-size:.95rem;margin:0}
.footer__htitle{font-family:var(--ff-m);font-size:.62rem;letter-spacing:.15em;text-transform:uppercase;color:var(--tierra-c);margin-bottom:1rem}
.footer__flinks{display:flex;flex-direction:column;gap:.55rem}
.footer__flink{color:rgba(255,255,255,.6);font-size:.95rem;transition:color .2s}
.footer__flink:hover{color:var(--tierra-s)}
.footer__base{border-top:1px solid rgba(255,255,255,.08);padding-top:1.5rem;display:flex;flex-direction:column;gap:.75rem}
.footer__aviso{border-left:3px solid var(--tierra);background:rgba(255,255,255,.04);padding:.65rem 1rem;font-family:var(--ff-m);font-size:.62rem;letter-spacing:.05em;color:rgba(255,255,255,.4);line-height:1.7;border-radius:0 6px 6px 0}
.footer__copy{font-family:var(--ff-m);font-size:.58rem;color:rgba(255,255,255,.2);letter-spacing:.08em}
@media(min-width:640px){.footer__grid{grid-template-columns:2fr 1fr 1fr}.footer__base{flex-direction:row;align-items:center;justify-content:space-between}}

/* ============================================================ BUTTONS */
.btn{display:inline-flex;align-items:center;gap:.5rem;padding:.7rem 1.5rem;font-family:var(--ff-b);font-size:.95rem;border-radius:6px;transition:all .3s var(--ease);cursor:pointer;white-space:nowrap}
.btn--dark{background:var(--tierra-o);color:var(--hueso);box-shadow:var(--sh)}
.btn--dark:hover{background:var(--tierra-m);transform:translateY(-2px);box-shadow:var(--sh-lg)}
.btn--outline{border:1.5px solid var(--tierra);color:var(--tierra-o);background:transparent}
.btn--outline:hover{background:var(--tierra-s)}
.btn--ghost{border:1.5px solid rgba(255,255,255,.35);color:rgba(255,255,255,.9);background:transparent}
.btn--ghost:hover{background:rgba(255,255,255,.1)}
.btn--verde{background:var(--verde-m);color:var(--verde-s);box-shadow:var(--sh)}
.btn--verde:hover{background:var(--verde);transform:translateY(-2px)}
.btn--sm{padding:.4rem 1rem;font-size:.85rem}

/* ============================================================ TABS SYSTEM */
.tabs-bar{background:var(--hueso);border-bottom:1px solid var(--piedra-c);position:sticky;top:var(--nav-h);z-index:50}
.tabs-list{display:flex;overflow-x:auto;scrollbar-width:none;-webkit-overflow-scrolling:touch}
.tabs-list::-webkit-scrollbar{display:none}
.tab-btn{display:flex;align-items:center;gap:.4rem;padding:1rem 1.25rem;white-space:nowrap;font-family:var(--ff-b);font-size:.92rem;color:var(--txt-s);border-bottom:2px solid transparent;background:none;cursor:pointer;transition:all .2s}
.tab-btn:hover{color:var(--tierra-m)}
.tab-btn.activo{color:var(--tierra-o);border-bottom-color:var(--tierra);font-weight:600}
.tab-panel{display:none;animation:fadeUp .4s var(--ease)}
.tab-panel.activo{display:block}

/* ============================================================ PLACEHOLDER IMAGE */
.ph{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.6rem;width:100%;height:100%;padding:1.5rem;text-align:center;color:rgba(255,255,255,.7);font-family:var(--ff-m);font-size:.6rem;letter-spacing:.1em;text-transform:uppercase;min-height:200px}
.ph__icon{font-size:2.5rem;opacity:.4;line-height:1;display:block;margin-bottom:.25rem}
.ph--img{border:2px dashed rgba(255,255,255,.25);border-radius:8px;background:rgba(0,0,0,.15)}

/* ============================================================ SECTION HEADER */
.sh{margin-bottom:3rem}
.sh__pre{display:inline-flex;align-items:center;gap:.7rem;font-family:var(--ff-m);font-size:.65rem;letter-spacing:.15em;text-transform:uppercase;color:var(--tierra);margin-bottom:.5rem}
.sh__pre::after{content:'';display:block;width:24px;height:1px;background:var(--tierra)}
.sh__title{margin-bottom:.75rem}
.sh__sub{font-style:italic;color:var(--txt-m);margin:0}

/* ============================================================ CARDS */
.card{background:#fff;border-radius:var(--r);overflow:hidden;box-shadow:var(--sh);transition:transform .3s var(--ease),box-shadow .3s var(--ease)}
.card:hover{transform:translateY(-5px);box-shadow:var(--sh-lg)}
.badge{display:inline-block;padding:.2rem .75rem;border-radius:99px;font-family:var(--ff-m);font-size:.6rem;letter-spacing:.1em;text-transform:uppercase;background:var(--tierra-s);color:var(--tierra-o)}
.badge--verde{background:var(--verde-s);color:var(--verde-m)}
.badge--azul{background:var(--azul-s);color:var(--azul-o)}
.badge--dark{background:var(--tierra-o);color:var(--tierra-s)}

/* ============================================================ GRIDS */
.grid-2{display:grid;grid-template-columns:1fr;gap:1.5rem}
.grid-3{display:grid;grid-template-columns:1fr;gap:1.5rem}
.grid-4{display:grid;grid-template-columns:repeat(2,1fr);gap:1.25rem}
@media(min-width:600px){.grid-2{grid-template-columns:repeat(2,1fr)}.grid-3{grid-template-columns:repeat(2,1fr)}}
@media(min-width:900px){.grid-3{grid-template-columns:repeat(3,1fr)}.grid-4{grid-template-columns:repeat(4,1fr)}}

/* ============================================================ ANIMATIONS */
.fade-in{opacity:0;transform:translateY(20px);transition:opacity .65s var(--ease),transform .65s var(--ease)}
.fade-in.visible{opacity:1;transform:none}
.d1{transition-delay:.08s}.d2{transition-delay:.16s}.d3{transition-delay:.24s}
.d4{transition-delay:.32s}.d5{transition-delay:.40s}
@keyframes fadeUp{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:none}}
@keyframes float{0%,100%{transform:translateY(0)}50%{transform:translateY(-10px)}}
@keyframes scrollpulse{0%,100%{opacity:1}50%{opacity:.15}}
@keyframes spin{to{transform:rotate(360deg)}}

/* ============================================================ HERO INICIO */
.hero{min-height:100svh;display:flex;flex-direction:column;justify-content:flex-end;position:relative;overflow:hidden;padding-bottom:5rem}
.hero__bg{position:absolute;inset:0;background:linear-gradient(155deg,var(--verde-m) 0%,var(--tierra-m) 45%,var(--tierra-o) 100%);background-size:cover;background-position:center}
.hero__pattern{position:absolute;inset:0;opacity:.045;background-image:url("data:image/svg+xml,%3Csvg width='60' height='60' viewBox='0 0 60 60' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='%23fff' fill-rule='evenodd'%3E%3Cpath d='M36 34v-4h-2v4h-4v2h4v4h2v-4h4v-2h-4zm0-30V0h-2v4h-4v2h4v4h2V6h4V4h-4zM6 34v-4H4v4H0v2h4v4h2v-4h4v-2H6zM6 4V0H4v4H0v2h4v4h2V6h4V4H6z'/%3E%3C/g%3E%3C/svg%3E")}
.hero__vignette{position:absolute;inset:0;background:linear-gradient(to bottom,rgba(10,5,2,.72) 0%,rgba(10,5,2,.15) 30%,rgba(10,5,2,.15) 55%,rgba(10,5,2,.72) 80%,rgba(10,5,2,.97) 100%)}
.hero__vignette::after{content:'';position:absolute;inset:0;background:rgba(61,43,31,.18);mix-blend-mode:multiply}
.hero__content{position:relative;z-index:2}
.hero__pre{font-family:var(--ff-m);font-size:.62rem;letter-spacing:.18em;text-transform:uppercase;color:rgba(255,255,255,.5);margin-bottom:1rem;display:flex;align-items:center;gap:.75rem}
.hero__pre::before{content:'';display:block;width:24px;height:1px;background:var(--tierra-c)}
.hero__title{font-family:var(--ff-t);font-size:clamp(3.2rem,9vw,6.5rem);color:#fff;line-height:.95;letter-spacing:-.03em;margin-bottom:1.5rem}
.hero__title em{font-style:italic;color:var(--tierra-s)}
.hero__desc{font-size:clamp(1rem,2vw,1.25rem);font-style:italic;color:rgba(255,255,255,.78);max-width:44ch;margin-bottom:2rem}
.hero__btns{display:flex;flex-wrap:wrap;gap:.75rem}
.scroll-hint{position:absolute;bottom:1.75rem;left:50%;transform:translateX(-50%);z-index:2;display:flex;flex-direction:column;align-items:center;gap:.4rem}
.scroll-hint span{font-family:var(--ff-m);font-size:.55rem;letter-spacing:.2em;text-transform:uppercase;color:rgba(255,255,255,.3)}
.scroll-hint i{width:1px;height:36px;background:linear-gradient(to bottom,rgba(255,255,255,.4),transparent);animation:scrollpulse 2s ease-in-out infinite}

/* Weather widget */
.weather{position:absolute;top:calc(var(--nav-h) + 1.25rem);right:1.25rem;z-index:3;background:rgba(255,255,255,.1);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);border:1px solid rgba(255,255,255,.18);border-radius:12px;padding:.9rem 1.25rem;text-align:center;min-width:88px}
.weather__dot{width:22px;height:22px;border-radius:50%;margin:0 auto .4rem;transition:background .5s}
.weather__dot.sol{background:#F5C542;box-shadow:0 0 14px rgba(245,197,66,.45)}
.weather__dot.nube{background:#A8C8D8}
.weather__dot.lluvia{background:#6BAAD0}
.weather__dot.noche{background:#2A3A5A}
.weather__dot.nieve{background:#A8C8D8;box-shadow:0 0 10px rgba(168,200,216,.5)}
.weather__temp{font-family:var(--ff-t);font-size:1.55rem;color:#fff;line-height:1}
.weather__desc{font-family:var(--ff-m);font-size:.52rem;letter-spacing:.1em;text-transform:uppercase;color:rgba(255,255,255,.45);margin-top:.3rem}

/* Datos rápidos */
.datos-bar{background:var(--tierra-o);padding:1.25rem 0}
.datos-bar__inner{display:flex;flex-wrap:wrap;justify-content:center;gap:0;align-items:center}
.dato-r{text-align:center;padding:.6rem 1.5rem}
.dato-r+.dato-r{border-left:1px solid rgba(255,255,255,.1)}
.dato-r__val{font-family:var(--ff-t);font-size:1.4rem;color:var(--tierra-c);line-height:1}
.dato-r__lab{font-family:var(--ff-m);font-size:.55rem;letter-spacing:.12em;text-transform:uppercase;color:rgba(255,255,255,.32);margin-top:.25rem}

/* Accesos */
.accesos-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:1rem}
.acceso{background:#fff;border-radius:var(--r);padding:1.5rem 1rem;text-align:center;box-shadow:var(--sh);display:flex;flex-direction:column;align-items:center;gap:.6rem;border:1.5px solid transparent;transition:all .3s var(--ease);cursor:pointer;text-decoration:none;color:inherit}
.acceso:hover{transform:translateY(-5px);box-shadow:var(--sh-lg);border-color:var(--tierra-s)}
.acceso__strip{width:100%;height:5px;border-radius:3px;margin-bottom:.25rem}
.acceso__name{font-family:var(--ff-t);font-size:1rem;font-weight:700;color:var(--tierra-o)}
.acceso__desc{font-size:.82rem;color:var(--txt-s);margin:0}
@media(min-width:600px){.accesos-grid{grid-template-columns:repeat(3,1fr)}}
@media(min-width:900px){.accesos-grid{grid-template-columns:repeat(5,1fr)}}

/* Split intro */
.split{display:grid;grid-template-columns:1fr;gap:3rem;align-items:center}
@media(min-width:768px){.split{grid-template-columns:1fr 1fr}}
.split--rev @media(min-width:768px){.split--rev .split__img{order:-1}}

/* ============================================================ PAGE HERO */
.page-hero{padding:calc(var(--nav-h) + 2.5rem) 0 2.5rem;position:relative;overflow:hidden;min-height:40vh;display:flex;align-items:flex-end}
.page-hero__bg{position:absolute;inset:0;z-index:0}
.page-hero__ov{position:absolute;inset:0;z-index:1;background:linear-gradient(to top,rgba(0,0,0,.75) 0%,rgba(0,0,0,.4) 50%,rgba(0,0,0,.15) 100%)}
.page-hero__content{position:relative;z-index:2;width:100%}
.page-hero__pre{font-family:var(--ff-m);font-size:.62rem;letter-spacing:.15em;text-transform:uppercase;color:rgba(255,255,255,.5);margin-bottom:.75rem}
.page-hero__title{color:#fff;text-shadow:0 2px 20px rgba(0,0,0,.3);margin-bottom:.75rem;font-size:clamp(2rem,5vw,3.5rem);}
.page-hero__desc{font-size:1.1rem;font-style:italic;color:rgba(255,255,255,.78);max-width:50ch;margin:0}

/* ============================================================ ALDEA */
.stats{display:flex;flex-wrap:wrap;gap:1.5rem;margin:2rem 0}
.stat__val{font-family:var(--ff-t);font-size:1.9rem;color:var(--tierra-m);line-height:1}
.stat__lab{font-family:var(--ff-m);font-size:.58rem;letter-spacing:.1em;text-transform:uppercase;color:var(--txt-s);margin-top:.2rem}

/* Lugar cards */
.lugar-card{display:grid;grid-template-columns:1fr;border-radius:var(--r);overflow:hidden;background:#fff;box-shadow:var(--sh);transition:box-shadow .3s var(--ease)}
.lugar-card:hover{box-shadow:var(--sh-lg)}
.lugar-card .ph{min-height:240px}
.lugar-card__body{padding:1.75rem}
.lugar-card__title{font-family:var(--ff-t);font-size:1.3rem;color:var(--tierra-o);margin:.65rem 0 .65rem}
.lugar-card__text{color:var(--txt-m);margin-bottom:.75rem}
.lugar-card__extra{font-family:var(--ff-m);font-size:.6rem;letter-spacing:.1em;text-transform:uppercase;color:var(--txt-s)}
@media(min-width:640px){.lugar-card{grid-template-columns:1fr 1fr}.lugar-card:nth-child(even) .ph{order:2}.lugar-card:nth-child(even) .lugar-card__body{order:1}.lugar-card .ph{min-height:260px}}

/* Timeline historia */
.timeline{display:flex;flex-direction:column;gap:0;position:relative}
.timeline::before{content:'';position:absolute;left:90px;top:0;bottom:0;width:1px;background:linear-gradient(to bottom,transparent,var(--piedra) 10%,var(--piedra) 90%,transparent)}
.tl-item{display:grid;grid-template-columns:90px 1fr;gap:2rem;padding:2rem 0}
.tl-item+.tl-item{border-top:1px solid var(--piedra-c)}
.tl-item__epoca{font-family:var(--ff-m);font-size:.6rem;letter-spacing:.1em;text-transform:uppercase;color:var(--txt-s);text-align:right;padding-top:.25rem;position:relative}
.tl-item__epoca::after{content:'';position:absolute;right:-2rem;top:.65rem;width:10px;height:10px;border-radius:50%;background:var(--tierra-c);border:2px solid var(--tierra);box-shadow:0 0 0 3px var(--hueso)}
.tl-item__titulo{font-family:var(--ff-t);font-size:1.15rem;color:var(--tierra-o);margin-bottom:.5rem}
.tl-item__texto{color:var(--txt-m);font-size:.95rem;margin:0}
.tl-item--cita .tl-item__texto{font-style:italic;border-left:3px solid var(--tierra-c);padding-left:1rem;color:var(--txt-o)}
@media(max-width:600px){.timeline::before{display:none}.tl-item{grid-template-columns:1fr}.tl-item__epoca{text-align:left;padding-top:0}.tl-item__epoca::after{display:none}}

/* Fiesta cards */
.fiesta-card{background:#fff;border-radius:var(--r);padding:1.5rem;box-shadow:var(--sh);border-top:3px solid var(--tierra);transition:transform .3s var(--ease),box-shadow .3s var(--ease)}
.fiesta-card:hover{transform:translateY(-4px);box-shadow:var(--sh-lg)}
.fiesta-card__mes{font-family:var(--ff-m);font-size:.62rem;letter-spacing:.12em;text-transform:uppercase;color:var(--tierra);margin-bottom:.5rem}
.fiesta-card__title{font-family:var(--ff-t);font-size:1.1rem;color:var(--tierra-o);margin-bottom:.5rem}
.fiesta-card__text{font-size:.92rem;color:var(--txt-m);margin:0}

/* Placeholder histórico */
.hist-img-placeholder{border-radius:var(--r);overflow:hidden;position:relative;aspect-ratio:4/3;background:var(--piedra-c);border:2px dashed var(--piedra);display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:2rem;gap:.75rem}
.hist-img-placeholder__label{font-family:var(--ff-m);font-size:.62rem;letter-spacing:.1em;text-transform:uppercase;color:var(--txt-s)}
.hist-img-placeholder__sub{font-size:.85rem;color:var(--txt-s);font-style:italic;margin:0}

/* ============================================================ ENTORNO */
.lugar-dest{display:grid;grid-template-columns:1fr;border-radius:var(--r);overflow:hidden;box-shadow:var(--sh-xl);margin-bottom:2.5rem}
.lugar-dest__img{min-height:280px}
.lugar-dest__body{background:#fff;padding:2.25rem;display:flex;flex-direction:column;justify-content:center}
.lugar-dest__dist{font-family:var(--ff-m);font-size:.6rem;letter-spacing:.1em;text-transform:uppercase;color:var(--txt-s);margin:.5rem 0 .75rem}
.lugar-dest__title{font-family:var(--ff-t);font-size:1.6rem;color:var(--tierra-o);margin-bottom:.75rem}
.lugar-dest__text{color:var(--txt-m);margin:0}
@media(min-width:768px){.lugar-dest{grid-template-columns:1fr 1fr}.lugar-dest__img{min-height:auto}}

/* Entorno cards */
.e-card{border-radius:var(--r);overflow:hidden;background:#fff;box-shadow:var(--sh);transition:transform .3s var(--ease),box-shadow .3s var(--ease)}
.e-card:hover{transform:translateY(-5px);box-shadow:var(--sh-lg)}
.e-card .ph{height:185px;min-height:unset}
.e-card__body{padding:1.25rem}
.e-card__name{font-family:var(--ff-t);font-size:1.1rem;color:var(--tierra-o);margin-bottom:.4rem}
.e-card__dist{font-family:var(--ff-m);font-size:.58rem;letter-spacing:.08em;text-transform:uppercase;color:var(--txt-s);margin-bottom:.4rem}
.e-card__text{font-size:.9rem;color:var(--txt-m);margin:0}

/* Ruta cards */
.ruta-card{background:#fff;border-radius:var(--r);box-shadow:var(--sh);overflow:hidden;transition:box-shadow .3s var(--ease)}
.ruta-card:hover{box-shadow:var(--sh-lg)}
.ruta-card__head{display:grid;grid-template-columns:1fr;gap:1rem;padding:1.5rem 1.5rem 0}
@media(min-width:640px){.ruta-card__head{grid-template-columns:1fr auto;align-items:start}}
.ruta-card__title{font-family:var(--ff-t);font-size:1.25rem;color:var(--tierra-o);margin:.4rem 0}
.ruta-card__chips{display:flex;flex-wrap:wrap;gap:.4rem;align-items:center}
.chip{font-family:var(--ff-m);font-size:.58rem;letter-spacing:.08em;text-transform:uppercase;background:var(--hueso);color:var(--txt-m);padding:.25rem .65rem;border-radius:4px;white-space:nowrap}
.chip--facil{background:#d4edda;color:#155724}
.chip--moderada{background:#fff3cd;color:#856404}
.chip--dificil{background:#f8d7da;color:#721c24}
.ruta-card__desc{padding:1rem 1.5rem;color:var(--txt-m);font-size:.95rem;margin:0}
.ruta-card__inicio{padding:0 1.5rem 1.5rem;font-family:var(--ff-m);font-size:.58rem;letter-spacing:.08em;text-transform:uppercase;color:var(--txt-s)}
.ruta-card__map{height:280px;background:var(--verde-xs);position:relative}
.ruta-card__map-placeholder{width:100%;height:100%;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:.75rem;color:var(--verde-m);font-family:var(--ff-m);font-size:.65rem;letter-spacing:.1em;text-transform:uppercase}
.map-spinner{width:32px;height:32px;border:2px solid var(--verde-s);border-top-color:var(--verde);border-radius:50%;animation:spin .8s linear infinite}

/* Leaflet override */
.leaflet-container{font-family:var(--ff-b)!important}

/* ============================================================ EL PORTALÓN */
.agenda-list{display:flex;flex-direction:column;gap:1rem}
.agenda-item{background:#fff;border-radius:var(--r);padding:1.25rem 1.5rem;box-shadow:var(--sh);display:grid;grid-template-columns:80px 1fr;gap:1.25rem;align-items:start;transition:box-shadow .3s var(--ease)}
.agenda-item:hover{box-shadow:var(--sh-lg)}
.agenda-item__mes{font-family:var(--ff-m);font-size:.62rem;letter-spacing:.1em;text-transform:uppercase;color:var(--txt-s);text-align:right;padding-top:.2rem}
.agenda-item__tipo{display:inline-block;padding:.15rem .6rem;border-radius:99px;font-family:var(--ff-m);font-size:.55rem;letter-spacing:.08em;text-transform:uppercase;color:#fff;margin-bottom:.5rem}
.agenda-item__nombre{font-family:var(--ff-t);font-size:1.05rem;color:var(--tierra-o);margin-bottom:.3rem}
.agenda-item__desc{font-size:.88rem;color:var(--txt-m);margin:0}

/* Actividades portalon */
.act-card{border-radius:var(--r);overflow:hidden;background:#fff;box-shadow:var(--sh);transition:transform .3s var(--ease),box-shadow .3s var(--ease)}
.act-card:hover{transform:translateY(-4px);box-shadow:var(--sh-lg)}
.act-card__strip{height:110px}
.act-card__body{padding:1.25rem}
.act-card__title{font-family:var(--ff-t);font-size:1.05rem;color:var(--tierra-o);margin-bottom:.4rem}
.act-card__text{font-size:.88rem;color:var(--txt-m);margin:0}

/* ============================================================ ITUEROCK */
.rock-hero{min-height:48vh;display:flex;align-items:flex-end;position:relative;overflow:hidden;padding-bottom:3rem}
.rock-hero__bg{position:absolute;inset:0;background:linear-gradient(155deg,#0A0A14,#1A1A2A)}
.rock-hero__glow1{position:absolute;width:500px;height:500px;border-radius:50%;background:radial-gradient(circle,rgba(181,118,58,.18),transparent 70%);top:-100px;right:-100px;pointer-events:none}
.rock-hero__glow2{position:absolute;width:400px;height:400px;border-radius:50%;background:radial-gradient(circle,rgba(74,103,65,.14),transparent 70%);bottom:-50px;left:-80px;pointer-events:none}
.rock-hero__ov{position:absolute;inset:0;background:linear-gradient(to top,rgba(0,0,0,.7),rgba(0,0,0,.05))}
.rock-hero__content{position:relative;z-index:2;width:100%}

/* ============================================================ RECURSOS / GALERÍA */
.gallery-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:.75rem}
.gallery-item{border-radius:var(--r);overflow:hidden;cursor:pointer;position:relative}
.gallery-item .ph{height:165px;min-height:unset}
.gallery-item__ov{position:absolute;inset:0;background:rgba(0,0,0,0);display:flex;align-items:center;justify-content:center;font-family:var(--ff-m);font-size:.6rem;letter-spacing:.1em;text-transform:uppercase;color:rgba(255,255,255,0);transition:all .25s}
.gallery-item:hover .gallery-item__ov{background:rgba(0,0,0,.35);color:rgba(255,255,255,.9)}
@media(min-width:600px){.gallery-grid{grid-template-columns:repeat(3,1fr)}}
@media(min-width:900px){.gallery-grid{grid-template-columns:repeat(4,1fr)}}

/* Galería filtros */
.gallery-filters{display:flex;flex-wrap:wrap;gap:.5rem;margin-bottom:2rem}
.gf-btn{font-family:var(--ff-m);font-size:.62rem;letter-spacing:.1em;text-transform:uppercase;padding:.35rem .85rem;border-radius:99px;border:1.5px solid var(--piedra);color:var(--txt-s);background:transparent;cursor:pointer;transition:all .2s}
.gf-btn:hover,.gf-btn.activo{background:var(--tierra-o);color:#fff;border-color:var(--tierra-o)}

/* Game box */
.game-box{background:linear-gradient(135deg,var(--tierra-o),var(--verde-m));border-radius:var(--r-lg);padding:4rem 2rem;text-align:center;position:relative;overflow:hidden;margin-top:4rem}
.game-box::before{content:'';position:absolute;inset:0;background:radial-gradient(circle at 30% 70%,rgba(181,118,58,.2),transparent 55%),radial-gradient(circle at 70% 30%,rgba(74,103,65,.2),transparent 55%)}
.game-box__inner{position:relative;z-index:1}
.game-box h3{font-family:var(--ff-t);font-size:1.8rem;color:#fff;margin:1rem 0 .5rem}
.game-box p{color:rgba(255,255,255,.6);font-style:italic;margin-bottom:1.5rem;max-width:40ch;margin-left:auto;margin-right:auto}
.game-box__chip{display:inline-block;border:1px solid rgba(255,255,255,.2);border-radius:99px;background:rgba(255,255,255,.08);padding:.5rem 1.25rem;font-family:var(--ff-m);font-size:.62rem;letter-spacing:.12em;text-transform:uppercase;color:rgba(255,255,255,.5)}

/* ============================================================ CHARTS */
.charts-section{background:var(--hueso);padding:5rem 0}
.chart-card{background:#fff;border-radius:var(--r);padding:1.75rem;box-shadow:var(--sh)}
.chart-card__title{font-family:var(--ff-t);font-size:1.15rem;color:var(--tierra-o);margin-bottom:1.25rem}
.chart-wrap{position:relative;height:240px}
.distancias-list{display:flex;flex-direction:column;gap:.75rem;margin-top:.5rem}
.dist-item{display:grid;grid-template-columns:120px 1fr 40px;gap:.75rem;align-items:center}
.dist-item__label{font-family:var(--ff-m);font-size:.62rem;letter-spacing:.06em;text-transform:uppercase;color:var(--txt-m)}
.dist-item__bar-wrap{height:8px;background:var(--piedra-c);border-radius:99px;overflow:hidden}
.dist-item__bar{height:100%;border-radius:99px;transition:width 1.2s var(--ease)}
.dist-item__val{font-family:var(--ff-m);font-size:.62rem;color:var(--txt-s);text-align:right}

/* ============================================================
   HISTORIAS DE LOS MAYORES
   ============================================================ */
.historia-card {
  background: #fff;
  border-radius: var(--r);
  padding: 1.75rem;
  box-shadow: var(--sh);
  border-left: 4px solid var(--tierra-c);
  transition: box-shadow .3s var(--ease);
}
.historia-card:hover { box-shadow: var(--sh-lg); }
.historia-card__header {
  display: flex;
  align-items: center;
  gap: 1rem;
  margin-bottom: 1rem;
}
.historia-card__avatar {
  width: 48px; height: 48px;
  border-radius: 50%;
  background: var(--tierra-s);
  color: var(--tierra-o);
  font-family: var(--ff-t);
  font-size: 1.4rem;
  display: flex; align-items: center; justify-content: center;
  flex-shrink: 0;
}
.historia-card__nombre {
  font-family: var(--ff-t);
  font-size: 1rem;
  color: var(--tierra-o);
  font-weight: 700;
}
.historia-card__edad {
  font-family: var(--ff-m);
  font-size: .58rem;
  letter-spacing: .1em;
  text-transform: uppercase;
  color: var(--txt-s);
  margin-top: .15rem;
}
.historia-card__texto {
  font-style: italic;
  color: var(--txt-m);
  font-size: .95rem;
  margin-bottom: .75rem;
  line-height: 1.7;
}
.historia-card__tag {
  font-family: var(--ff-m);
  font-size: .58rem;
  letter-spacing: .1em;
  text-transform: uppercase;
  color: var(--txt-s);
  background: var(--hueso);
  padding: .2rem .65rem;
  border-radius: 99px;
}

/* ============================================================
   RUTAS — Layout mapa fijo + lista seleccionable
   ============================================================ */
.rutas-layout {
  display: grid;
  grid-template-columns: 1fr;
  gap: 0;
  min-height: 600px;
}
@media (min-width: 900px) {
  .rutas-layout {
    grid-template-columns: 420px 1fr;
    min-height: 700px;
  }
}

/* Panel izquierdo: lista de rutas */
.rutas-lista {
  display: flex;
  flex-direction: column;
  gap: 0;
  overflow-y: auto;
  background: var(--blanco);
  border-right: 1px solid var(--piedra-c);
  max-height: 700px;
}
@media (max-width: 899px) {
  .rutas-lista { max-height: none; border-right: none; border-bottom: 1px solid var(--piedra-c); }
}

.ruta-item {
  padding: 1.5rem 1.75rem;
  border-bottom: 1px solid var(--piedra-c);
  cursor: pointer;
  transition: background .2s, border-left .2s;
  border-left: 4px solid transparent;
  position: relative;
}
.ruta-item:hover { background: var(--hueso); }
.ruta-item.activo {
  background: var(--hueso);
  border-left-color: var(--tierra);
}
.ruta-item__tipo {
  font-family: var(--ff-m);
  font-size: .58rem;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: var(--txt-s);
  margin-bottom: .35rem;
}
.ruta-item__nombre {
  font-family: var(--ff-t);
  font-size: 1.05rem;
  color: var(--tierra-o);
  margin-bottom: .5rem;
  line-height: 1.2;
}
.ruta-item__chips {
  display: flex;
  flex-wrap: wrap;
  gap: .35rem;
  margin-bottom: .6rem;
}
.ruta-item__desc {
  font-size: .88rem;
  color: var(--txt-m);
  margin: 0;
  display: none;
  line-height: 1.6;
}
.ruta-item.activo .ruta-item__desc { display: block; }
.ruta-item__inicio {
  font-family: var(--ff-m);
  font-size: .58rem;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--txt-s);
  margin-top: .5rem;
  display: none;
}
.ruta-item.activo .ruta-item__inicio { display: block; }

/* Panel derecho: mapa */
.rutas-mapa {
  position: relative;
  background: var(--verde-xs);
  min-height: 420px;
}
@media (min-width: 900px) {
  .rutas-mapa { position: sticky; top: var(--nav-h); height: calc(100vh - var(--nav-h)); max-height: 700px; }
}

#mapa-rutas {
  width: 100%;
  height: 100%;
  min-height: 420px;
}

/* Leyenda del mapa */
.mapa-leyenda {
  position: absolute;
  bottom: 12px;
  left: 12px;
  z-index: 1000;
  background: rgba(255,255,255,.92);
  backdrop-filter: blur(8px);
  border-radius: 8px;
  padding: .6rem .9rem;
  display: flex;
  flex-direction: column;
  gap: .35rem;
  box-shadow: 0 2px 12px rgba(0,0,0,.12);
}
.leyenda-item {
  display: flex;
  align-items: center;
  gap: .5rem;
  font-family: var(--ff-m);
  font-size: .58rem;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: var(--txt-m);
}
.leyenda-dot {
  width: 10px; height: 10px;
  border-radius: 50%;
  flex-shrink: 0;
}
/* Info del mapa (nombre ruta activa) */
.mapa-info {
  position: absolute;
  top: 12px;
  left: 50%;
  transform: translateX(-50%);
  z-index: 1000;
  background: rgba(255,255,255,.92);
  backdrop-filter: blur(8px);
  border-radius: 6px;
  padding: .4rem 1rem;
  font-family: var(--ff-m);
  font-size: .62rem;
  letter-spacing: .1em;
  text-transform: uppercase;
  color: var(--tierra-o);
  box-shadow: 0 2px 12px rgba(0,0,0,.1);
  white-space: nowrap;
  transition: opacity .3s;
}

/* ============================================================
   LIGHTBOX
   ============================================================ */
#lightbox {
  display: none;
  position: fixed;
  inset: 0;
  z-index: 9000;
  align-items: center;
  justify-content: center;
}
#lightbox.activo { display: flex; }
#lb-overlay {
  position: absolute;
  inset: 0;
  background: rgba(20,10,4,.88);
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
}
#lb-box {
  position: relative;
  z-index: 1;
  max-width: min(760px, 92vw);
  width: 100%;
  padding: 0 1rem;
}
#lb-cerrar {
  position: absolute;
  top: -2.5rem;
  right: 1rem;
  font-size: 2rem;
  color: rgba(255,255,255,.7);
  cursor: pointer;
  line-height: 1;
  background: none;
  border: none;
  transition: color .2s;
  z-index: 2;
}
#lb-cerrar:hover { color: #fff; }
#lb-img { margin-bottom: .75rem; }
#lb-label {
  text-align: center;
  font-family: var(--ff-m);
  font-size: .65rem;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: rgba(255,255,255,.45);
}

/* ============================================================
   AGENDA CARDS
   ============================================================ */
.agenda-card {
  background: #fff;
  border-radius: var(--r);
  padding: 1.5rem;
  box-shadow: var(--sh);
  border-top: 3px solid var(--tierra);
  transition: transform .3s var(--ease), box-shadow .3s var(--ease);
}
.agenda-card:hover { transform: translateY(-4px); box-shadow: var(--sh-lg); }
.agenda-card__mes {
  font-family: var(--ff-m);
  font-size: .62rem;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: var(--txt-s);
  margin-bottom: .4rem;
}
.agenda-card__tipo {
  display: inline-block;
  padding: .15rem .6rem;
  border-radius: 99px;
  font-family: var(--ff-m);
  font-size: .55rem;
  letter-spacing: .08em;
  text-transform: uppercase;
  color: #fff;
  margin-bottom: .5rem;
}
.agenda-card__nombre {
  font-family: var(--ff-t);
  font-size: 1.05rem;
  color: var(--tierra-o);
  margin-bottom: .4rem;
  line-height: 1.3;
}
.agenda-card__desc {
  font-size: .88rem;
  color: var(--txt-m);
  margin: 0;
  line-height: 1.6;
}

/* ============================================================
   SOCIO CUOTAS
   ============================================================ */
.socio-cuota {
  background: rgba(255,255,255,.07);
  border: 2px solid rgba(255,255,255,.15);
  border-radius: var(--r);
  padding: 2rem;
  text-align: center;
  transition: border-color .3s, background .3s;
}
.socio-cuota:hover {
  background: rgba(255,255,255,.12);
  border-color: var(--tierra-c);
}
.socio-cuota__precio {
  font-family: var(--ff-t);
  font-size: 3rem;
  color: var(--tierra-s);
  line-height: 1;
  margin-bottom: .25rem;
}
.socio-cuota__precio span {
  font-size: 1.1rem;
  color: rgba(255,255,255,.5);
}
.socio-cuota__tipo {
  font-family: var(--ff-m);
  font-size: .65rem;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--tierra-c);
  margin-bottom: .75rem;
}
.socio-cuota__desc {
  font-size: .88rem;
  color: rgba(255,255,255,.6);
  margin: 0;
  line-height: 1.6;
}

/* ============================================================
   MINIJUEGO DE PESCA
   ============================================================ */
.juego-wrap {
  background: #0A1A3A;
  border-radius: var(--r-lg);
  overflow: hidden;
  margin-top: 2.5rem;
  box-shadow: var(--sh-xl);
  position: relative;
}
.juego-canvas-cont {
  position: relative;
  width: 100%;
  aspect-ratio: 16/9;
  max-height: 520px;
}
@media (max-width: 599px) {
  .juego-canvas-cont {
    aspect-ratio: unset;
    height: 60vw;
    max-height: 380px;
  }
}
.juego-canvas-cont canvas {
  display: block;
  width: 100%;
  height: 100%;
  cursor: pointer;
  touch-action: none;
}
.juego-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: .85rem 1.25rem;
  background: rgba(0,0,0,.35);
  border-bottom: 1px solid rgba(255,255,255,.06);
}
.juego-header__titulo {
  font-family: var(--ff-t);
  font-size: 1rem;
  color: var(--tierra-c);
  font-style: italic;
}
.juego-header__sub {
  font-family: var(--ff-m);
  font-size: .58rem;
  letter-spacing: .1em;
  color: rgba(255,255,255,.35);
  text-transform: uppercase;
}

/* ============================================================
   EL BARBO DE ITUERO — Periódico local
   ============================================================ */
.periodico {
  background: var(--hueso);
  font-family: var(--ff-b);
}
.periodico__cabecera {
  background: var(--tierra-o);
  color: #fff;
  padding: 1.5rem 0 1.25rem;
  text-align: center;
  border-bottom: 4px double rgba(255,255,255,.2);
}
.periodico__titulo-pub {
  font-family: var(--ff-t);
  font-size: clamp(2rem,6vw,3.5rem);
  font-weight: 700;
  letter-spacing: .02em;
  line-height: 1;
  color: var(--tierra-s);
  margin-bottom: .2rem;
}
.periodico__subtitulo {
  font-family: var(--ff-m);
  font-size: .6rem;
  letter-spacing: .18em;
  text-transform: uppercase;
  color: rgba(255,255,255,.45);
  margin-bottom: .6rem;
}
.periodico__meta {
  font-family: var(--ff-m);
  font-size: .6rem;
  letter-spacing: .1em;
  color: rgba(255,255,255,.35);
  display: flex;
  justify-content: center;
  gap: 1.5rem;
  flex-wrap: wrap;
}
.periodico__cuerpo {
  padding: 2.5rem 0 3rem;
}
.periodico__grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 1.5rem;
}
@media(min-width:700px) {
  .periodico__grid { grid-template-columns: repeat(2,1fr); }
}
@media(min-width:1000px) {
  .periodico__grid { grid-template-columns: 2fr 1fr; }
  .periodico__grid .noticia:first-child { grid-row: span 2; }
}
.noticia {
  background: #fff;
  border-radius: var(--radio-sm, 4px);
  overflow: hidden;
  box-shadow: var(--sh);
  transition: box-shadow .3s var(--ease);
}
.noticia:hover { box-shadow: var(--sh-lg); }
.noticia__img {
  width: 100%;
  aspect-ratio: 16/9;
}
.noticia__img.noticia__img--tall { aspect-ratio: 4/3; }
.noticia__cuerpo { padding: 1.25rem 1.5rem; }
.noticia__seccion {
  font-family: var(--ff-m);
  font-size: .58rem;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--tierra);
  margin-bottom: .4rem;
}
.noticia__titular {
  font-family: var(--ff-t);
  font-size: 1.15rem;
  color: var(--tierra-o);
  line-height: 1.25;
  margin-bottom: .5rem;
}
.noticia:first-child .noticia__titular { font-size: 1.5rem; }
.noticia__entradilla {
  font-size: .88rem;
  color: var(--txt-m);
  margin: 0;
  line-height: 1.65;
}
.noticia__fecha {
  font-family: var(--ff-m);
  font-size: .58rem;
  letter-spacing: .08em;
  color: var(--txt-s);
  margin-top: .75rem;
  display: block;
}
/* Separador decorativo */
.periodico__sep {
  border: none;
  border-top: 1px solid var(--piedra);
  margin: 2rem 0;
  position: relative;
}
.periodico__sep::before {
  content: '❧';
  position: absolute;
  left: 50%;
  top: -10px;
  transform: translateX(-50%);
  background: var(--hueso);
  padding: 0 .75rem;
  color: var(--tierra-c);
  font-size: .9rem;
}
/* Columna de breves */
.breves-titulo {
  font-family: var(--ff-t);
  font-size: 1rem;
  color: var(--tierra-o);
  border-bottom: 2px solid var(--tierra-c);
  padding-bottom: .4rem;
  margin-bottom: 1rem;
}
.breve {
  padding: .75rem 0;
  border-bottom: 1px solid var(--piedra-c);
}
.breve:last-child { border-bottom: none; }
.breve__titulo {
  font-family: var(--ff-t);
  font-size: .95rem;
  color: var(--tierra-o);
  margin-bottom: .25rem;
}
.breve__texto {
  font-size: .82rem;
  color: var(--txt-m);
  margin: 0;
}
.breve__fecha {
  font-family: var(--ff-m);
  font-size: .55rem;
  letter-spacing: .08em;
  color: var(--txt-s);
  margin-top: .2rem;
  display: block;
}

/* ============================================================
   EL CIERVO DE ITUERO — Periódico local
   ============================================================ */

/* Contenedor general */
.periodico {
  background: #F5F0E8;
  min-height: 100vh;
}

/* ── Cabecera ── */
.periodico__cabecera {
  background: var(--tierra-o);
  padding-top: calc(var(--nav-h) + 1.75rem);
  padding-bottom: 1.5rem;
  text-align: center;
}
.periodico__titulo-pub {
  font-family: var(--ff-t);
  font-size: clamp(2.2rem, 6vw, 3.8rem);
  font-weight: 700;
  color: var(--tierra-s);
  letter-spacing: .01em;
  line-height: 1;
  margin-bottom: .3rem;
}
.periodico__subtitulo {
  font-family: var(--ff-m);
  font-size: .58rem;
  letter-spacing: .18em;
  text-transform: uppercase;
  color: rgba(255,255,255,.4);
  margin-bottom: .75rem;
}
.periodico__meta {
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  gap: .5rem 1.5rem;
  font-family: var(--ff-m);
  font-size: .58rem;
  letter-spacing: .08em;
  color: rgba(255,255,255,.3);
}

/* ── Lema ── */
.periodico__lema {
  text-align: center;
  padding: 1rem 0;
  border-top: 1px solid var(--tierra-c);
  border-bottom: 1px solid var(--tierra-c);
  margin: 1.5rem 0;
}
.periodico__lema p {
  font-family: var(--ff-t);
  font-style: italic;
  font-size: 1rem;
  color: var(--txt-m);
  margin: 0;
}

/* ── Cuerpo ── */
.periodico__cuerpo { padding: 0 0 3rem; }

/* ── Layout dos columnas ── */
.periodico__layout {
  display: grid;
  grid-template-columns: 1fr;
  gap: 2rem;
}
@media (min-width: 900px) {
  .periodico__layout {
    grid-template-columns: 1fr 320px;
    gap: 2.5rem;
    align-items: start;
  }
}

/* ── Noticias ── */
.periodico__noticias {
  display: flex;
  flex-direction: column;
  gap: 2rem;
}

.noticia {
  background: #fff;
  border-radius: 6px;
  overflow: hidden;
  box-shadow: 0 2px 12px rgba(61,43,31,.08);
  transition: box-shadow .3s var(--ease);
}
.noticia:hover { box-shadow: 0 4px 24px rgba(61,43,31,.16); }

/* Foto de la noticia — placeholder visible */
.noticia__foto {
  width: 100%;
  height: 180px;
  display: flex;
  align-items: flex-end;
  padding: .75rem 1rem;
  position: relative;
}
.noticia--grande .noticia__foto { height: 260px; }
.noticia__foto-label {
  font-family: var(--ff-m);
  font-size: .6rem;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: rgba(255,255,255,.65);
  background: rgba(0,0,0,.3);
  padding: .2rem .6rem;
  border-radius: 3px;
}

.noticia__cuerpo { padding: 1.25rem 1.5rem 1.5rem; }
.noticia__seccion {
  font-family: var(--ff-m);
  font-size: .6rem;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--tierra);
  margin-bottom: .35rem;
}
.noticia__titular {
  font-family: var(--ff-t);
  font-size: 1.2rem;
  color: var(--tierra-o);
  line-height: 1.25;
  margin-bottom: .6rem;
}
.noticia--grande .noticia__titular { font-size: 1.55rem; }
.noticia__entradilla {
  font-size: .92rem;
  color: var(--txt-m);
  line-height: 1.7;
  margin: 0 0 .5rem;
}
.noticia__fecha {
  font-family: var(--ff-m);
  font-size: .58rem;
  letter-spacing: .08em;
  color: var(--txt-s);
}

/* Filete decorativo */
.periodico__filete {
  border: none;
  border-top: 2px solid var(--tierra-c);
  margin: .5rem 0;
}
.periodico__filete--ornamento {
  border-top-style: double;
  border-top-width: 3px;
  position: relative;
  margin: 1.25rem 0;
}
.periodico__filete--ornamento::after {
  content: '✦';
  position: absolute;
  left: 50%;
  top: -9px;
  transform: translateX(-50%);
  background: #fff;
  padding: 0 .5rem;
  color: var(--tierra-c);
  font-size: .7rem;
}

/* ── Aside ── */
.periodico__aside {
  display: flex;
  flex-direction: column;
  gap: 0;
}
@media (min-width: 900px) {
  .periodico__aside {
    position: sticky;
    top: calc(var(--nav-h) + 1rem);
    max-height: calc(100vh - var(--nav-h) - 2rem);
    overflow-y: auto;
    scrollbar-width: thin;
  }
}

.periodico__bloque {
  background: #fff;
  border-radius: 6px;
  padding: 1.25rem;
  margin-bottom: 1rem;
  box-shadow: 0 2px 10px rgba(61,43,31,.06);
}
.periodico__bloque-titulo {
  font-family: var(--ff-t);
  font-size: 1.05rem;
  color: var(--tierra-o);
  border-bottom: 2px solid var(--tierra-c);
  padding-bottom: .4rem;
  margin-bottom: .9rem;
}

/* Breves */
.breve { padding: .65rem 0; border-bottom: 1px solid #EDE4D3; }
.breve:last-child { border-bottom: none; }
.breve__titulo { font-family: var(--ff-t); font-size: .95rem; color: var(--tierra-o); margin-bottom: .2rem; }
.breve__texto  { font-size: .82rem; color: var(--txt-m); margin: 0; line-height: 1.55; }
.breve__fecha  { font-family: var(--ff-m); font-size: .55rem; letter-spacing: .08em; color: var(--txt-s); display: block; margin-top: .2rem; }

/* Columna del ciervo — chistes y curiosidades */
.columna-item {
  padding: .65rem 0;
  border-bottom: 1px dashed #EDE4D3;
}
.columna-item:last-child { border-bottom: none; }
.columna-item__tipo {
  font-family: var(--ff-m);
  font-size: .55rem;
  letter-spacing: .1em;
  text-transform: uppercase;
  display: inline-block;
  padding: .15rem .5rem;
  border-radius: 3px;
  margin-bottom: .3rem;
}
.columna-item__tipo--chiste    { background: #FFF3CD; color: #856404; }
.columna-item__tipo--curiosidad{ background: var(--verde-s); color: var(--verde-m); }
.columna-item__tipo--refrán    { background: var(--tierra-s); color: var(--tierra-o); }
.columna-item__texto {
  font-size: .85rem;
  color: var(--txt-m);
  font-style: italic;
  margin: 0;
  line-height: 1.6;
}

/* Aviso contribuir */
.periodico__bloque--aviso { text-align: center; background: var(--hueso); }
.periodico__aviso-titulo {
  font-family: var(--ff-m);
  font-size: .62rem;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: var(--tierra);
  margin-bottom: .4rem;
}
.periodico__aviso-texto { font-size: .82rem; color: var(--txt-m); margin: 0; }

/* Logo pie */
.periodico__logo-pie {
  text-align: center;
  padding: .75rem 0;
}
.periodico__logo-nombre {
  font-family: var(--ff-t);
  font-size: 1.1rem;
  font-style: italic;
  color: var(--tierra-o);
}
.periodico__logo-sub {
  font-family: var(--ff-m);
  font-size: .55rem;
  letter-spacing: .1em;
  text-transform: uppercase;
  color: var(--txt-s);
  margin-top: .15rem;
}

/* Pie legal */
.periodico__pie {
  border-top: 1px solid #D4C8B0;
  margin-top: 2.5rem;
  padding-top: 1rem;
  font-family: var(--ff-m);
  font-size: .58rem;
  letter-spacing: .06em;
  color: var(--txt-s);
  text-align: center;
}

/* ============================================================
   JUNTA DIRECTIVA
   ============================================================ */
.junta-card {
  background: #fff;
  border-radius: var(--r);
  overflow: hidden;
  box-shadow: var(--sh);
  transition: transform .3s var(--ease), box-shadow .3s var(--ease);
}
.junta-card:hover { transform: translateY(-4px); box-shadow: var(--sh-lg); }

.junta-card__foto {
  height: 160px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: .5rem;
}

.junta-card__body { padding: 1.25rem; }

.junta-card__cargo {
  font-family: var(--ff-m);
  font-size: .58rem;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--tierra);
  margin-bottom: .3rem;
}
.junta-card__nombre {
  font-family: var(--ff-t);
  font-size: 1.2rem;
  color: var(--tierra-o);
  margin-bottom: .6rem;
}
.junta-card__curiosidad {
  font-size: .85rem;
  color: var(--txt-m);
  line-height: 1.65;
  margin-bottom: .75rem;
}
.junta-card__refran {
  font-family: var(--ff-b);
  font-style: italic;
  font-size: .82rem;
  color: var(--txt-s);
  margin: 0;
  border-left: 3px solid var(--tierra-c);
  padding-left: .6rem;
}

/* ============================================================
   AGENDA CALENDARIO
   ============================================================ */
.agenda-cal {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}

.agenda-cal__item {
  display: grid;
  grid-template-columns: 80px 1fr;
  background: #fff;
  border-radius: var(--r);
  overflow: hidden;
  box-shadow: var(--sh);
  transition: transform .25s var(--ease), box-shadow .25s var(--ease);
}
.agenda-cal__item:hover { transform: translateX(4px); box-shadow: var(--sh-lg); }
.agenda-cal__item--pendiente { opacity: .85; }
.agenda-cal__item--pendiente .agenda-cal__fecha { filter: saturate(.6); }

/* Bloque fecha */
.agenda-cal__fecha {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 1rem .5rem;
  min-height: 90px;
}
.agenda-cal__dia {
  font-family: var(--ff-t);
  font-size: 2rem;
  font-weight: 700;
  color: #fff;
  line-height: 1;
}
.agenda-cal__mes {
  font-family: var(--ff-m);
  font-size: .55rem;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: rgba(255,255,255,.75);
  margin-top: .2rem;
}

/* Cuerpo */
.agenda-cal__body {
  padding: 1rem 1.25rem;
}
.agenda-cal__meta {
  display: flex;
  align-items: center;
  gap: .5rem;
  flex-wrap: wrap;
  margin-bottom: .4rem;
}
.agenda-cal__tipo {
  font-family: var(--ff-m);
  font-size: .55rem;
  letter-spacing: .1em;
  text-transform: uppercase;
  padding: .15rem .55rem;
  border-radius: 99px;
  border: 1px solid currentColor;
}
.agenda-cal__badge {
  font-family: var(--ff-m);
  font-size: .55rem;
  letter-spacing: .08em;
  text-transform: uppercase;
  padding: .15rem .55rem;
  border-radius: 99px;
}
.agenda-cal__badge--ok   { background: #D1FAE5; color: #065F46; }
.agenda-cal__badge--pend { background: #FEF3C7; color: #92400E; }

.agenda-cal__nombre {
  font-family: var(--ff-t);
  font-size: 1.05rem;
  color: var(--tierra-o);
  margin-bottom: .35rem;
  line-height: 1.25;
}
.agenda-cal__desc {
  font-size: .85rem;
  color: var(--txt-m);
  margin-bottom: .5rem;
  line-height: 1.6;
}
.agenda-cal__detalles {
  display: flex;
  flex-wrap: wrap;
  gap: .5rem 1.25rem;
  font-family: var(--ff-m);
  font-size: .6rem;
  letter-spacing: .06em;
  color: var(--txt-s);
}
@media (max-width: 500px) {
  .agenda-cal__item { grid-template-columns: 64px 1fr; }
  .agenda-cal__dia  { font-size: 1.5rem; }
}

/* ============================================================
   AVES DEL ENTORNO
   ============================================================ */
.aves-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 1.5rem;
}
@media (min-width: 600px)  { .aves-grid { grid-template-columns: repeat(2,1fr); } }
@media (min-width: 1000px) { .aves-grid { grid-template-columns: repeat(2,1fr); } }

.ave-card {
  background: #fff;
  border-radius: var(--r);
  overflow: hidden;
  box-shadow: var(--sh);
  transition: transform .3s var(--ease), box-shadow .3s var(--ease);
}
.ave-card:hover { transform: translateY(-4px); box-shadow: var(--sh-lg); }

.ave-card__foto { position: relative; overflow: hidden; }

.ave-card__body { padding: 1.25rem; }

.ave-card__head {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: .75rem;
  margin-bottom: .6rem;
}
.ave-card__nombre {
  font-family: var(--ff-t);
  font-size: 1.1rem;
  color: var(--tierra-o);
  margin-bottom: .1rem;
  line-height: 1.2;
}
.ave-card__cientifico {
  font-style: italic;
  font-size: .78rem;
  color: var(--txt-s);
}
.ave-card__estado {
  font-family: var(--ff-m);
  font-size: .52rem;
  letter-spacing: .08em;
  text-transform: uppercase;
  padding: .2rem .6rem;
  border-radius: 99px;
  white-space: nowrap;
  flex-shrink: 0;
}
.ave-card__texto {
  font-size: .88rem;
  color: var(--txt-m);
  line-height: 1.65;
  margin-bottom: .75rem;
}
.ave-card__meta {
  display: flex;
  flex-direction: column;
  gap: .25rem;
  font-family: var(--ff-m);
  font-size: .6rem;
  letter-spacing: .06em;
  color: var(--txt-s);
}

/* ============================================================
   GALERÍA — overlay fotógrafo (ya generado por helpers.php)
   ============================================================ */
.gallery-item { position: relative; overflow: hidden; }
.gallery-item > div[style*="position:relative"] { height: 100%; }
.gallery-item > div[style*="position:relative"] img { height: 100%; }

/* ============================================================
   PROYECTOS
   ============================================================ */
.proy-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 2rem;
}
@media (min-width: 700px)  { .proy-grid { grid-template-columns: repeat(2,1fr); } }
@media (min-width: 1000px) { .proy-grid { grid-template-columns: repeat(3,1fr); } }

.proy-card {
  background: #fff;
  border-radius: var(--r);
  overflow: hidden;
  box-shadow: var(--sh);
  display: flex;
  flex-direction: column;
  transition: transform .3s var(--ease), box-shadow .3s var(--ease);
}
.proy-card:hover { transform: translateY(-6px); box-shadow: var(--sh-lg); }

/* Visual */
.proy-card__visual { position: relative; overflow: hidden; }

/* Badge estado */
.proy-card__estado {
  position: absolute;
  top: 12px; right: 12px;
  font-family: var(--ff-m);
  font-size: .58rem;
  letter-spacing: .1em;
  text-transform: uppercase;
  padding: .3rem .8rem;
  border-radius: 99px;
  display: flex;
  align-items: center;
  gap: .4rem;
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
}
.proy-card__estado--desarrollo {
  background: rgba(34,197,94,.15);
  color: #16A34A;
  border: 1px solid rgba(34,197,94,.3);
}
.proy-card__estado--pronto {
  background: rgba(234,179,8,.15);
  color: #A16207;
  border: 1px solid rgba(234,179,8,.3);
}
.proy-card__estado--sin_enlace {
  background: rgba(100,116,139,.15);
  color: #475569;
  border: 1px solid rgba(100,116,139,.3);
}
.proy-estado__dot {
  width: 7px; height: 7px;
  border-radius: 50%;
  background: #16A34A;
  animation: pulso 1.8s infinite;
  flex-shrink: 0;
}
@keyframes pulso {
  0%,100% { opacity: 1; transform: scale(1); }
  50%      { opacity: .5; transform: scale(.7); }
}

/* Body */
.proy-card__body {
  padding: 1.5rem;
  display: flex;
  flex-direction: column;
  flex: 1;
  gap: .5rem;
}
.proy-card__icon {
  font-size: 1.75rem;
  line-height: 1;
  margin-bottom: .25rem;
}
.proy-card__titulo {
  font-family: var(--ff-t);
  font-size: 1.3rem;
  color: var(--tierra-o);
  margin: 0;
  line-height: 1.2;
}
.proy-card__subtitulo {
  font-family: var(--ff-m);
  font-size: .62rem;
  letter-spacing: .08em;
  color: var(--txt-s);
  text-transform: uppercase;
  margin: 0;
}
.proy-card__desc {
  font-size: .9rem;
  color: var(--txt-m);
  line-height: 1.65;
  margin: .25rem 0 0;
  flex: 1;
}

/* Tecnologías */
.proy-card__techs {
  display: flex;
  flex-wrap: wrap;
  gap: .35rem;
  margin-top: .5rem;
}
.proy-tech {
  font-family: var(--ff-m);
  font-size: .55rem;
  letter-spacing: .08em;
  background: var(--hueso);
  color: var(--txt-m);
  padding: .2rem .6rem;
  border-radius: 4px;
  border: 1px solid var(--piedra-c);
}

/* CTA */
.proy-card__cta { margin-top: 1rem; }
.proy-card__nodispo {
  font-family: var(--ff-m);
  font-size: .65rem;
  letter-spacing: .06em;
  color: var(--txt-s);
}

/* Botón tierra */
.btn--tierra {
  display: inline-block;
  background: var(--tierra-o);
  color: #fff;
  font-family: var(--ff-m);
  font-size: .7rem;
  letter-spacing: .1em;
  text-transform: uppercase;
  text-decoration: none;
  padding: .65rem 1.25rem;
  border-radius: 6px;
  transition: background .2s, transform .2s;
}
.btn--tierra:hover { background: var(--tierra); transform: translateY(-2px); }

/* ============================================================
   NATURALEZA — Subsecciones y tarjetas unificadas
   ============================================================ */
.nat-subseccion {
  margin-bottom: 3rem;
}
.nat-subseccion__titulo {
  display: flex;
  align-items: center;
  gap: .6rem;
  font-family: var(--ff-t);
  font-size: 1.3rem;
  color: var(--tierra-o);
  margin-bottom: 1.25rem;
  padding-bottom: .6rem;
  border-bottom: 2px solid var(--piedra-c);
}
.nat-subseccion__icon { font-size: 1.4rem; }

.nat-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
  gap: 1.25rem;
}

.nat-card {
  background: #fff;
  border-radius: var(--r);
  overflow: hidden;
  box-shadow: var(--sh);
  transition: transform .25s var(--ease), box-shadow .25s var(--ease);
}
.nat-card:hover { transform: translateY(-3px); box-shadow: var(--sh-lg); }

.nat-card__body { padding: 1rem 1.1rem 1.2rem; }

.nat-card__nombre {
  font-family: var(--ff-t);
  font-size: 1rem;
  color: var(--tierra-o);
  margin-bottom: .15rem;
  line-height: 1.2;
}
.nat-card__cientifico {
  font-style: italic;
  font-size: .72rem;
  color: var(--txt-s);
  margin-bottom: .5rem;
}
.nat-card__texto {
  font-size: .82rem;
  color: var(--txt-m);
  line-height: 1.6;
  margin: 0;
}

/* Aviso catálogo creciente */
.nat-catalogo-aviso {
  background: var(--hueso);
  border-radius: var(--r);
  padding: 1rem 1.25rem;
  font-family: var(--ff-m);
  font-size: .65rem;
  letter-spacing: .06em;
  color: var(--txt-s);
  font-style: italic;
  border-left: 3px solid var(--tierra-c);
  margin-top: 1rem;
}