:root{--night:#0F1D45;--night2:#1B3070;--ivory:#EFEBDD;--gold:#C9A45C;--gold-d:#8A6A2A;--bg:#ECEEF4;--ink:#101A38;--mute:#3F476B;--line:#BFC5D8;--panel:#F7F8FB;
box-sizing:border-box;padding-top:env(safe-area-inset-top,0px);padding-bottom:env(safe-area-inset-bottom,0px)}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){--bg:#0A1128;--ink:#EFEBDD;--mute:#B4B9CF;--line:#2A3765;--panel:#101B3F;--gold-d:#C9A45C}}
:root[data-theme="dark"]{--bg:#0A1128;--ink:#EFEBDD;--mute:#B4B9CF;--line:#2A3765;--panel:#101B3F;--gold-d:#C9A45C}
html{scroll-padding-top:env(safe-area-inset-top,0px);scroll-behavior:smooth}
*{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--ink);font:1.22rem/1.7 "EB Garamond",Georgia,serif;text-align:center}
h1,h2,h3{font-family:Cinzel,Georgia,serif;font-weight:500;margin:0;line-height:1.25}
a{color:inherit}
:focus-visible{outline:3px solid var(--gold);outline-offset:3px}
.wrap{max-width:880px;margin:0 auto;padding:0 26px}
header{position:absolute;top:env(safe-area-inset-top,0px);left:0;right:0;z-index:3}
nav{display:flex;justify-content:center;gap:clamp(14px,3vw,34px);flex-wrap:wrap;padding:22px 16px;font-size:1rem}
nav a{color:var(--ivory);text-decoration:none;opacity:.85;border-bottom:1px solid transparent}
nav a:hover{opacity:1;border-color:var(--gold)}
.hero{background:radial-gradient(ellipse at 50% 35%,var(--night2),var(--night) 72%);color:var(--ivory);padding:110px 0 90px;border-bottom:3px double var(--gold)}
.seal{width:min(300px,68vw);height:auto;border-radius:50%;display:block;margin:0 auto 40px;box-shadow:0 0 0 3px var(--gold),0 0 0 10px var(--night),0 0 0 11px var(--gold),0 18px 50px rgba(0,0,0,.45)}
.flag{position:absolute;top:0;left:0;right:0;height:7px;z-index:4;background:linear-gradient(90deg,#C4262E 0 33.4%,#fff 33.4% 66.6%,#C4262E 66.6%)}
.flag.f{position:static}
.hero h1{font-size:clamp(2.1rem,6.4vw,4.2rem);letter-spacing:.06em;color:var(--ivory)}
.hero .sub{font-family:Cinzel,serif;color:var(--gold);letter-spacing:.14em;font-size:clamp(.85rem,2.2vw,1.1rem);margin:20px 0 28px}
.hero p{max-width:34em;margin:0 auto 36px;color:#D8D5C8;font-style:italic}
.btn{display:inline-block;border:1px solid var(--gold);color:var(--gold);padding:13px 34px;text-decoration:none;font-family:Cinzel,serif;font-size:.95rem;letter-spacing:.1em;background:none;cursor:pointer}
.btn:hover{background:var(--gold);color:var(--night)}
section{padding:88px 0}
h2{font-size:clamp(1.5rem,4vw,2.3rem);letter-spacing:.05em;margin-bottom:22px}
.rule{display:flex;align-items:center;gap:14px;max-width:260px;margin:0 auto 26px;color:var(--gold-d)}
.rule::before,.rule::after{content:"";flex:1;height:1px;background:currentColor}
.rule i{width:9px;height:9px;transform:rotate(45deg);border:1px solid currentColor}
.lead{max-width:36em;margin:0 auto;color:var(--mute)}
.pillars{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));margin-top:56px;text-align:center}
.pillars>div{padding:6px 28px;border-left:1px solid var(--gold-d)}
.pillars>div:first-child{border-left:0}
.pillars h3{font-size:1.15rem;letter-spacing:.08em;margin-bottom:10px}
.pillars p{margin:0;color:var(--mute);font-size:1.08rem}
.dark{background:var(--night);color:var(--ivory)}
.dark .lead,.dark p{color:#CFCCBF}
.dark .rule{color:var(--gold)}
.founders{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:44px;margin-top:52px}
.founders h3{color:var(--gold);letter-spacing:.08em;font-size:1.2rem;margin-bottom:4px}
.founders small{display:block;font-style:italic;margin-bottom:12px;color:#A9A798}
.founders p{margin:0;font-size:1.08rem}
blockquote{margin:48px auto 0;max-width:30em;font-style:italic;font-size:1.3rem;color:var(--ivory)}
blockquote cite{display:block;margin-top:10px;font-family:Cinzel,serif;font-style:normal;font-size:.85rem;letter-spacing:.12em;color:var(--gold)}
.dates{list-style:none;margin:44px auto 0;padding:0;max-width:34em;display:grid;gap:18px}
.dates li{display:grid;grid-template-columns:76px 1fr;gap:20px;text-align:left;align-items:baseline}
.dates b{font-family:Cinzel,serif;color:var(--gold-d);font-weight:500;font-size:1.3rem}
.dates span{color:var(--mute);font-size:1.08rem}
.logias{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:22px;margin-top:44px}
.card{border:1px solid var(--line);background:var(--panel);padding:30px 22px;outline:1px solid var(--line);outline-offset:-8px}
.card h3{font-size:1.05rem;letter-spacing:.06em;margin-bottom:8px}
.card p{margin:0;color:var(--mute);font-size:1.02rem}
.card.empty{background:none;border-style:dashed;outline:0}
form{display:grid;gap:14px;max-width:500px;margin:38px auto 0;text-align:left}
label{font-family:Cinzel,serif;font-size:.85rem;letter-spacing:.08em;display:grid;gap:6px}
input,textarea{font:1.1rem "EB Garamond",serif;padding:12px;border:1px solid var(--line);background:var(--panel);color:var(--ink);border-radius:0}
textarea{min-height:110px}
form .btn{justify-self:center;color:var(--gold-d);border-color:var(--gold-d);margin-top:8px}
form .btn:hover{color:var(--night);background:var(--gold)}
output{text-align:center;color:var(--mute);font-size:1rem}
footer{background:var(--night);color:#B9B6A8;padding:36px 0;font-size:1rem;border-top:3px double var(--gold)}
@media (max-width:640px){.pillars>div{border-left:0;border-top:1px solid var(--gold-d);padding:24px 8px}.pillars>div:first-child{border-top:0}section{padding:64px 0}.dates li{grid-template-columns:62px 1fr;gap:14px}}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
.fig{margin:0}
.fig img{width:170px;height:228px;object-fit:cover;object-position:top;display:block;margin:0 auto 22px;border-radius:999px 999px 0 0;filter:grayscale(1) contrast(1.05);border:2px solid var(--gold);padding:5px;background:var(--night2)}
.wide{margin:60px auto 0}.wide img{width:100%;height:auto;display:block;border:1px solid var(--gold-d);padding:6px;background:var(--panel)}
.wide figcaption{margin-top:14px;font-style:italic;font-size:1.02rem;color:var(--mute)}
.lodge img{width:100%;height:auto;display:block;margin:0 auto 14px}
.lodge img.r{width:230px;max-width:100%;margin-bottom:6px}
.lodge .txt{font-family:Cinzel,serif;color:#fff;font-size:1.2rem;letter-spacing:.04em;padding:18px 0 22px;line-height:1.35}
.lodge .txt b{display:block;font-size:1.5rem;font-weight:500}
output a{color:var(--gold-d);font-weight:600}footer a{color:var(--gold)}
.ch{display:inline-block;opacity:0;transform:translateY(.5em) scale(.9);animation:chin .8s cubic-bezier(.2,.7,.2,1) forwards}
.w{display:inline-block;white-space:nowrap}
@keyframes chin{to{opacity:1;transform:none}}
@keyframes up{from{opacity:0;transform:translateY(22px)}to{opacity:1;transform:none}}
.hero .sub{min-height:1.7em}
.sub.typing::after{content:"";display:inline-block;width:2px;height:1em;background:var(--gold);margin-left:4px;vertical-align:-.1em;animation:blink 1s steps(1) infinite}
@keyframes blink{50%{opacity:0}}
.hero p{animation:up 1.1s 2.5s both}.hero .btn{animation:up 1.1s 3s both}
.seal{animation:sealin 1.4s ease-out both,glow 5s ease-in-out 1.5s infinite}
@keyframes sealin{from{opacity:0;transform:scale(.82) rotate(-6deg)}to{opacity:1;transform:none}}
@keyframes glow{50%{box-shadow:0 0 0 3px #C9A45C,0 0 0 10px #0F1D45,0 0 0 11px #C9A45C,0 0 70px rgba(201,164,92,.6)}}
.mq{overflow:hidden;background:var(--night);color:var(--gold);border-bottom:1px solid var(--gold);padding:15px 0;white-space:nowrap;font-family:Cinzel,serif;letter-spacing:.14em;font-size:1rem}
.mq.l{background:var(--panel);color:var(--gold-d);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.mq .t{display:inline-flex;animation:mq 46s linear infinite}
.mq.rev .t{animation-direction:reverse}
.mq:hover .t{animation-play-state:paused}
.mq span{padding:0 24px}
@keyframes mq{to{transform:translateX(-50%)}}
.rule i{animation:spin 14s linear infinite}
@keyframes spin{from{transform:rotate(45deg)}to{transform:rotate(405deg)}}
.js .rv{opacity:0;transform:translateY(28px);transition:opacity .9s ease,transform .9s cubic-bezier(.2,.7,.2,1)}
.js .rv.in{opacity:1;transform:none}
.fig img{transition:filter .7s}.fig img:hover{filter:none}
.btn{position:relative;overflow:hidden}
.btn::after{content:"";position:absolute;inset:0;background:linear-gradient(100deg,transparent 30%,rgba(255,255,255,.35) 50%,transparent 70%);transform:translateX(-120%);pointer-events:none}
.btn:hover::after{transition:transform .8s;transform:translateX(120%)}
@media (prefers-reduced-motion:reduce){.ch,.hero p,.hero .btn,.seal{animation:none;opacity:1;transform:none}.mq .t,.rule i{animation:none}.js .rv{opacity:1;transform:none;transition:none}}

body.wait{overflow:hidden}
.wait .ch,.wait .hero p,.wait .hero .btn,.wait .seal{animation-play-state:paused}
#pre{position:fixed;inset:0;z-index:100;background:radial-gradient(ellipse at 50% 40%,#1B3070,#0F1D45 70%);display:grid;place-items:center;transition:opacity .8s ease,visibility .8s;animation:prefb .6s 7s forwards}
#pre.out{opacity:0;visibility:hidden}
@keyframes prefb{to{opacity:0;visibility:hidden}}
.pl{text-align:center}
.pl img{width:min(220px,55vw);height:auto;border-radius:50%;display:block;margin:0 auto 30px;box-shadow:0 0 0 3px #C9A45C,0 0 0 9px #0F1D45,0 0 0 10px #C9A45C;animation:plp 1.8s ease-in-out infinite}
@keyframes plp{50%{transform:scale(1.05);box-shadow:0 0 0 3px #C9A45C,0 0 0 9px #0F1D45,0 0 0 10px #C9A45C,0 0 50px rgba(201,164,92,.55)}}
.bar{width:min(220px,55vw);height:2px;background:rgba(201,164,92,.25);margin:0 auto;overflow:hidden}
.bar i{display:block;height:100%;width:40%;background:#C9A45C;animation:barr 1.3s ease-in-out infinite}
@keyframes barr{from{transform:translateX(-100%)}to{transform:translateX(260%)}}
.chips{display:flex;flex-wrap:wrap;justify-content:center;gap:10px;margin:26px auto 0;max-width:740px;padding:0;list-style:none}
.chips li{border:1px solid var(--gold-d);padding:8px 18px;font-size:1.02rem;color:#DAD7CA}
.fab{position:fixed;right:max(18px,env(safe-area-inset-right,0px));bottom:calc(18px + env(safe-area-inset-bottom,0px));z-index:50;display:flex;flex-direction:column;align-items:flex-end;gap:12px}
.fab a{text-decoration:none}
.fab .post{background:var(--night);color:var(--gold);border:1px solid var(--gold);padding:11px 20px;font-family:Cinzel,serif;font-size:.85rem;letter-spacing:.1em;box-shadow:0 6px 20px rgba(0,0,0,.35)}
.fab .post:hover{background:var(--gold);color:var(--night)}
.fab .wa{width:58px;height:58px;border-radius:50%;background:#25D366;display:grid;place-items:center;box-shadow:0 6px 20px rgba(0,0,0,.35);position:relative}
.fab .wa::before{content:"";position:absolute;inset:0;border-radius:50%;border:2px solid #25D366;animation:wap 2.4s ease-out infinite}
@keyframes wap{from{transform:scale(1);opacity:.8}to{transform:scale(1.6);opacity:0}}
@media (prefers-reduced-motion:reduce){.pl img,.bar i,.fab .wa::before{animation:none}.bar i{width:100%}#pre{transition:none}}

.hd-r{position:absolute;right:max(18px,env(safe-area-inset-right,0px));top:14px;display:flex;align-items:center;gap:14px;z-index:5}
.hd-r .fb{width:40px;height:40px;border-radius:50%;border:1px solid var(--gold);color:var(--gold);display:grid;place-items:center;text-decoration:none;transition:background .3s,color .3s}
.hd-r .fb:hover{background:var(--gold);color:var(--night)}
.hlogo img{width:44px;height:44px;border-radius:50%;display:block;box-shadow:0 0 0 2px var(--gold),0 6px 18px rgba(0,0,0,.4);transition:transform .4s}
.hlogo:hover img{transform:scale(1.07) rotate(-4deg)}
header nav{padding-left:90px;padding-right:90px}
@media (max-width:900px){.hd-r{position:static;justify-content:center;padding-top:14px}header nav{padding:10px 16px 12px}.hero{padding-top:210px}.hd-r+nav{font-size:.95rem}}
.ffb{display:inline-grid;place-items:center;width:44px;height:44px;border-radius:50%;border:1px solid var(--gold);margin-bottom:18px;transition:background .3s,color .3s}.ffb:hover{background:var(--gold);color:var(--night)}.hero{position:relative;overflow:hidden;background:var(--night)}
.hero::before{content:"";position:absolute;inset:-5%;background:url(../assets/img/fondo-cabecera.jpg) center/cover no-repeat;animation:kb 30s ease-in-out infinite alternate;z-index:0}
.hero::after{content:"";position:absolute;inset:0;z-index:0;background:linear-gradient(180deg,rgba(15,29,69,.86) 0%,rgba(15,29,69,.74) 45%,rgba(15,29,69,.93) 100%)}
.hero>.wrap{position:relative;z-index:1}
@keyframes kb{from{transform:scale(1)}to{transform:scale(1.09) translateY(-1.5%)}}
@media (prefers-reduced-motion:reduce){.hero::before{animation:none}}
.pano{position:relative;height:clamp(280px,50vw,540px);overflow:hidden;background:var(--night);border-top:3px double var(--gold);border-bottom:3px double var(--gold)}
.pano .bg{position:absolute;inset:0 -6%;background:url(../assets/img/panoramica-templo.jpg) center/cover no-repeat;animation:pan 45s ease-in-out infinite alternate}
.pano::after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,rgba(15,29,69,.9) 0%,rgba(15,29,69,.25) 55%,rgba(15,29,69,.1) 100%)}
.pano p{position:absolute;left:0;right:0;bottom:clamp(20px,5vw,48px);z-index:2;margin:0;padding:0 24px;font-family:Cinzel,serif;font-size:clamp(1.1rem,3.2vw,2rem);letter-spacing:.08em;color:var(--ivory);text-shadow:0 2px 14px rgba(0,0,0,.7)}
@keyframes pan{from{transform:translateX(-3%)}to{transform:translateX(3%)}}
@media (prefers-reduced-motion:reduce){.pano .bg{animation:none}}
.welcome{margin:0;background:#0F1D45;border-bottom:3px double var(--gold)}
.welcome img{display:block;width:100%;max-width:1600px;height:auto;margin:0 auto}