/*
Theme Name: Abadía — Tierra Común
Theme URI: https://proyectoabadia.org
Author: Proyecto Abadía
Description: Tema editorial de bloques para un movimiento internacional de regeneración comunitaria desde los espacios de fe.
Version: 1.4.0
Requires at least: 6.5
Requires PHP: 8.0
Text Domain: abadia
*/

:root { --abadia-transition: 240ms cubic-bezier(.2,.75,.25,1); }
html { scroll-behavior: smooth; }
body { text-rendering: optimizeLegibility; }
a { text-underline-offset: .18em; }
.wp-site-blocks { overflow: clip; }
.site-shell { max-width: 1440px; margin-inline: auto; }
.site-header { display:flex; align-items:center; justify-content:space-between; gap:2rem; padding:1.15rem clamp(1.25rem,4vw,4rem); }
.site-brand { display:flex; align-items:center; gap:.8rem; font:600 1.9rem/1 var(--wp--preset--font-family--display); }
.site-brand__mark { width:2.15rem; height:2.15rem; flex:none; }
.site-nav { display:flex; flex-wrap:wrap; gap:1.5rem; font-size:.88rem; font-weight:700; }
.site-nav li { list-style:none; margin:0; padding:0; }
.site-nav a { position:relative; }
.site-nav a::after { content:""; position:absolute; left:0; right:100%; bottom:-.35rem; height:2px; background:#D45E3D; transition:right var(--abadia-transition); }
.site-nav a:hover::after,.site-nav .current-menu-item a::after { right:0; }
.home-hero { min-height:82svh; display:flex; flex-direction:column; justify-content:space-between; padding:clamp(2rem,5vw,5rem); background:linear-gradient(90deg,rgba(40,39,34,.92) 0%,rgba(40,39,34,.72) 30%,rgba(40,39,34,.12) 72%),url('assets/images/hero-abadia.png') center/cover no-repeat; color:#fff; }
.home-hero h1 { max-width:1050px; margin:0; font-size:clamp(3.7rem,9.5vw,9rem); }
.home-hero__bottom { display:flex; align-items:flex-end; justify-content:space-between; gap:2rem; flex-wrap:wrap; }
.home-hero__bottom p { margin:0; font-size:clamp(1rem,1.5vw,1.3rem); }
.button-link { display:inline-block; border-radius:999px; padding:.9rem 1.5rem; background:#D45E3D; color:#fff; font-weight:700; font-size:.88rem; }
.section { padding:clamp(5rem,10vw,10rem) clamp(1.25rem,4vw,4rem); }
.section h2 { font-size:clamp(2.6rem,6vw,5.7rem); }
.question { text-align:center; max-width:1180px; margin:auto; }
.pillars { background:#354536; color:#F4F0E8; }
.roots-timeline { position:relative; display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:1.5rem; margin-top:4rem; padding-top:1rem; }
.roots-timeline::before { content:""; position:absolute; top:2.1rem; left:8%; right:8%; height:2px; background:rgb(244 240 232 / .3); }
.root-item { position:relative; text-align:center; }
.root-number { position:relative; z-index:1; display:grid; place-items:center; width:2.25rem; height:2.25rem; margin:0 auto 1.25rem; border:2px solid rgb(244 240 232 / .45); border-radius:50%; background:#354536; font-weight:700; transition:background var(--abadia-transition),color var(--abadia-transition),transform var(--abadia-transition); }
.root-item:hover .root-number { background:#F4F0E8; color:#354536; transform:scale(1.08); }
.root-item h3 { margin-bottom:.4rem; }
.root-verb { display:block; color:#D8C9AF; font-weight:700; margin-bottom:.75rem; }
.root-item p { font-size:.92rem; color:rgb(244 240 232 / .78); }
.grid-3 { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:2rem; }
.grid-2 { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:2rem; }
.panel { padding:2rem; border-radius:20px; background:#fff; color:#282722; }
.cta-section { background:#D45E3D; color:#fff; text-align:center; }
.site-footer { background:#282722; color:#F4F0E8; padding:clamp(4rem,8vw,7rem) clamp(1.25rem,4vw,4rem) 2rem; }
.site-footer__top { display:grid; grid-template-columns:2fr 1fr 1fr; gap:3rem; }
.site-footer__brand { font:500 clamp(2.5rem,5vw,5rem)/1 var(--wp--preset--font-family--display); }
.site-footer__identity { display:flex; align-items:center; gap:1.25rem; }
.site-footer__mark { width:4rem; height:4rem; flex:none; }
.site-footer__links { margin:0; padding:0; list-style:none; }
.site-footer__links li { margin:.65rem 0; }
.site-footer__links a { color:inherit; text-decoration:none; }
.site-footer__links a:hover,.site-footer__links a:focus-visible { color:#D8C9AF; text-decoration:underline; }
.entry-wrap { max-width:760px; margin:auto; padding:clamp(4rem,8vw,8rem) 1.25rem; }
.entry-wrap--wide { max-width:1220px; }
.entry-wrap > article > h1 { font-size:clamp(3.2rem,8vw,7rem); margin-bottom:3rem; }
.entry-wrap h2 { margin-top:3.5rem; font-size:clamp(2rem,4vw,3.5rem); }
.entry-wrap blockquote { margin:3rem 0; padding:1.5rem 0 1.5rem 2rem; border-left:3px solid #D45E3D; font-family:var(--wp--preset--font-family--display); font-size:clamp(1.5rem,3vw,2.5rem); line-height:1.2; }
.interactive-section { margin-top:clamp(4rem,8vw,8rem); }
.interactive-intro { max-width:760px; }
.actors-viz { display:grid; grid-template-columns:minmax(0,1.4fr) minmax(280px,.8fr); gap:clamp(2rem,5vw,5rem); align-items:center; margin-top:3rem; }
.actors-orbit { position:relative; min-height:620px; display:grid; place-items:center; }
.actors-orbit::before,.actors-orbit::after { content:""; position:absolute; border:1px solid rgb(40 39 34 / .16); border-radius:50%; }
.actors-orbit::before { width:72%; aspect-ratio:1; }
.actors-orbit::after { width:48%; aspect-ratio:1; }
.actors-center { position:relative; z-index:2; display:grid; place-items:center; width:170px; aspect-ratio:1; border-radius:50%; background:#354536; color:#F4F0E8; text-align:center; font-family:var(--wp--preset--font-family--display); font-size:1.65rem; }
.actor-node { position:absolute; z-index:3; width:150px; min-height:86px; padding:1rem; border:1px solid rgb(40 39 34 / .16); border-radius:999px; background:#F4F0E8; color:#282722; font:700 .86rem/1.25 inherit; cursor:pointer; transition:transform var(--abadia-transition),background var(--abadia-transition),color var(--abadia-transition); }
.actor-node:hover,.actor-node:focus-visible,.actor-node.is-active { transform:scale(1.06); background:#D45E3D; color:#fff; }
.actor-node:nth-of-type(1){top:4%;left:50%;transform:translateX(-50%)} .actor-node:nth-of-type(1):hover,.actor-node:nth-of-type(1):focus-visible,.actor-node:nth-of-type(1).is-active{transform:translateX(-50%) scale(1.06)}
.actor-node:nth-of-type(2){top:25%;right:2%} .actor-node:nth-of-type(3){bottom:15%;right:9%} .actor-node:nth-of-type(4){bottom:15%;left:9%} .actor-node:nth-of-type(5){top:25%;left:2%}
.actor-detail { min-height:330px; padding:clamp(1.5rem,4vw,3rem); border-left:3px solid #D45E3D; background:#E8DFCF; }
.actor-detail h3 { font-size:clamp(2rem,4vw,3.5rem); margin:.35rem 0 1rem; }
.actor-detail__value { font-weight:700; color:#354536; }
.map-viz { display:grid; grid-template-columns:minmax(0,1.35fr) minmax(300px,.65fr); gap:clamp(1.5rem,4vw,4rem); align-items:stretch; margin-top:3rem; }
.map-stage { position:relative; min-height:650px; background:#DCE3D8; overflow:hidden; }
.map-stage svg { width:100%; height:100%; min-height:650px; display:block; }
.map-country { fill:#F4F0E8; stroke:#A89F90; stroke-width:.65; }
.map-point { cursor:pointer; }
.map-point circle { fill:#D45E3D; stroke:#fff; stroke-width:2.5; transition:r var(--abadia-transition),fill var(--abadia-transition); }
.map-point:hover circle,.map-point:focus circle,.map-point.is-active circle { r:9; fill:#354536; }
.map-point text { font-size:11px; font-weight:700; fill:#282722; paint-order:stroke; stroke:#F4F0E8; stroke-width:3px; }
.map-detail { padding:clamp(1.5rem,4vw,3rem); background:#282722; color:#F4F0E8; }
.map-detail h3 { font-size:clamp(2rem,3.5vw,3.25rem); margin:.4rem 0; }
.map-detail__faith { color:#D8C9AF; font-weight:700; }
.map-metrics { display:grid; grid-template-columns:1fr 1fr; gap:1rem; margin:2rem 0; }
.map-metric { padding-top:1rem; border-top:1px solid rgb(244 240 232 / .25); }
.map-metric strong { display:block; font-family:var(--wp--preset--font-family--display); font-size:2.25rem; }
.demo-note { margin-top:1.25rem; padding:1rem; border:1px solid currentColor; font-size:.82rem; }
.abadia-kicker { letter-spacing: .15em; text-transform: uppercase; font-size: .75rem; font-weight: 700; }
.abadia-display { text-wrap: balance; }
.abadia-prose { text-wrap: pretty; }
.abadia-rounded { border-radius: var(--wp--custom--radius--large); overflow: hidden; }
.abadia-card { transition: transform var(--abadia-transition), box-shadow var(--abadia-transition); }
.abadia-card:hover { transform: translateY(-4px); box-shadow: 0 18px 55px rgb(40 39 34 / .12); }
.abadia-card img { transition: transform 600ms cubic-bezier(.2,.75,.25,1); }
.abadia-card:hover img { transform: scale(1.025); }
.abadia-pill { border-radius: 999px; }
.abadia-rule { border-top: 1px solid color-mix(in srgb, currentColor 22%, transparent); }
.abadia-stat strong { display: block; font-family: var(--wp--preset--font-family--display); font-size: clamp(2.75rem, 7vw, 6.5rem); line-height: .9; font-weight: 500; }
.abadia-quote { position: relative; }
.abadia-quote:before { content: "“"; position: absolute; left: -.45em; top: -.3em; color: var(--wp--preset--color--terracotta); font: 500 4em/1 var(--wp--preset--font-family--display); }
.abadia-marquee { white-space: nowrap; overflow: hidden; }
.abadia-marquee > * { display: inline-block; animation: abadia-marquee 26s linear infinite; }
@keyframes abadia-marquee { to { transform: translateX(-50%); } }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } *,*:before,*:after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; } }
@media (max-width: 781px) {
  .abadia-reverse-mobile { flex-direction: column-reverse; }
  .abadia-hide-mobile { display: none !important; }
  .abadia-hero { min-height: 78svh !important; }
  .site-nav { display:none; }
  .grid-3,.grid-2,.site-footer__top { grid-template-columns:1fr; }
  .home-hero { min-height:78svh; }
  .roots-timeline { grid-template-columns:1fr; gap:0; margin-top:3rem; padding-top:0; }
  .roots-timeline::before { top:1rem; bottom:1rem; left:1.05rem; right:auto; width:2px; height:auto; }
  .root-item { display:grid; grid-template-columns:2.25rem 1fr; column-gap:1rem; padding-bottom:2rem; text-align:left; }
  .root-number { grid-row:1 / span 4; margin:0; }
  .root-item h3,.root-verb,.root-item p { grid-column:2; }
  .actors-viz,.map-viz { grid-template-columns:1fr; }
  .actors-orbit { min-height:540px; }
  .actor-node { width:125px; min-height:76px; font-size:.76rem; }
  .map-stage,.map-stage svg { min-height:520px; }
}