/* gg249.info — Retablo abierto: a contemporary Ayacucho retablo as a guide.
   Lime-plaster wall, pine box with gabled pediment, painted doors, flower cenefa, niches, plinths. */
:root{
 --yeso:#F4EEE3;--papel:#FBF8F2;--tinta:#221B18;--tinta-2:#5A4C44;--line:#E3D6C3;
 --pino:#D4A872;--pino-d:#9A6532;--nogal:#2B1F19;
 --rojo:#C0303D;--rojo-d:#8E2230;--rosa:#E98A9C;--rosa-p:#F8E1E4;--verde:#2E6B4F;--verde-p:#DFECE1;
 --maiz:#EDB330;--maiz-p:#F8E9BF;--anil:#1F3561;--anil-d:#152648;--celeste:#D9E8EE;
 --display:"Alfa Slab One",Rockwell,Georgia,serif;--body:"Nunito Sans",system-ui,-apple-system,"Segoe UI",sans-serif;
 --wood:repeating-linear-gradient(90deg,rgba(154,101,50,.13) 0 2px,transparent 2px 9px,rgba(154,101,50,.08) 9px 10px,transparent 10px 23px,rgba(255,244,222,.14) 23px 25px,transparent 25px 41px),#D4A872;
 --cenefa:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='28' height='18'%3E%3Cg fill='%23C0303D'%3E%3Ccircle cx='14' cy='5' r='2.6'/%3E%3Ccircle cx='17.8' cy='7.8' r='2.6'/%3E%3Ccircle cx='16.4' cy='12.2' r='2.6'/%3E%3Ccircle cx='11.6' cy='12.2' r='2.6'/%3E%3Ccircle cx='10.2' cy='7.8' r='2.6'/%3E%3C/g%3E%3Ccircle cx='14' cy='9' r='2' fill='%23EDB330'/%3E%3Cellipse cx='0' cy='9' rx='5' ry='2.2' fill='%232E6B4F'/%3E%3Cellipse cx='28' cy='9' rx='5' ry='2.2' fill='%232E6B4F'/%3E%3C/svg%3E");
 /* game runtime tokens */
 --primary:#C0303D;--primary-contrast:#FFF8F0;--accent:#EDB330;--surface:#FBF8F2;--surface-2:#F4EEE3;--text:#221B18;--heading:#221B18;--muted:#5A4C44;--border:#E3D6C3;
 --font-head:var(--display);--font-body:var(--body);
 color-scheme:light;
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%}
body{margin:0;background:var(--yeso);color:var(--tinta);font:400 17px/1.65 var(--body);font-optical-sizing:auto;overflow-wrap:break-word;
 background-image:radial-gradient(120% 60% at 10% 0,rgba(255,252,245,.9),transparent 60%),radial-gradient(90% 50% at 100% 30%,rgba(233,218,196,.35),transparent 70%)}
img,svg{display:block;max-width:100%}
a{color:var(--rojo-d);text-decoration-thickness:1.5px;text-underline-offset:3px}
a:hover{color:var(--rojo)}
:focus-visible{outline:3px solid var(--anil);outline-offset:3px}
.rt-play :focus-visible,.cajita :focus-visible,.ft :focus-visible{outline-color:var(--maiz)}
h1,h2,h3{margin:0;font-weight:400}
p{margin:0 0 1em}
.skip{position:absolute;left:12px;top:-80px;z-index:99;background:var(--tinta);color:var(--papel);padding:12px 16px;font-weight:800;text-decoration:none;border-radius:4px}
.skip:focus{top:12px;color:var(--papel)}

/* ---------- header ---------- */
.hd{position:relative;z-index:30;background:var(--papel)}
.hd-in{max-width:1240px;margin:0 auto;padding:10px 16px;display:grid;grid-template-columns:auto minmax(0,1fr) auto auto;grid-template-areas:"wm . lsw tg" "nav nav nav nav";align-items:center;column-gap:8px}
.wm{grid-area:wm;display:flex;align-items:center;gap:10px;min-height:48px;color:var(--tinta);text-decoration:none}
.wm:hover{color:var(--tinta)}
.wm-mark{width:40px;height:40px;flex:none}
.wm-txt{display:flex;flex-direction:column;min-width:0}
.wm-name{font:25px/1 var(--display);letter-spacing:.01em}
.wm-tag{margin-top:4px;font:800 11.5px/1.2 var(--body);letter-spacing:.09em;text-transform:uppercase;color:var(--verde);white-space:nowrap}
.hd-tg{grid-area:tg;display:inline-flex;align-items:center;gap:9px;min-height:44px;min-width:44px;padding:0 12px;border:2px solid var(--tinta);border-radius:4px;background:var(--papel);color:var(--tinta);font:800 15px/1 var(--body);cursor:pointer}
.hd-tg:hover{background:var(--maiz-p)}
.tg-doors{display:flex;width:22px;height:18px;border:2px solid var(--tinta);background:var(--maiz)}
.tg-doors i{flex:1;background:var(--rojo);transition:transform .3s ease}
.tg-doors i:first-child{transform-origin:left;border-right:1px solid var(--tinta)}
.tg-doors i:last-child{transform-origin:right}
.hd-tg[aria-expanded="true"] .tg-doors i{transform:scaleX(.2)}
.hd-nav{grid-area:nav;display:none}
.hd.nav-open .hd-nav{display:block;margin-top:10px;padding:6px 0 14px;border-top:2px solid var(--tinta)}
.nv{list-style:none;margin:0;padding:0}
.nv a{position:relative;display:flex;align-items:center;gap:12px;min-height:50px;padding:6px 4px;border-bottom:1px solid var(--line);color:var(--tinta);font:700 17px/1.3 var(--body);text-decoration:none}
.nv a::before{content:"";flex:none;width:9px;height:9px;border-radius:50% 0;transform:rotate(45deg);background:var(--rosa)}
.nv a[aria-current="page"]{color:var(--rojo-d)}
.nv a[aria-current="page"]::before{background:var(--rojo)}
.hd-demo{display:flex;align-items:center;justify-content:center;min-height:50px;margin-top:14px;padding:0 18px;border-radius:4px;background:var(--rojo);color:#FFF8F0;font:800 16px/1.2 var(--body);text-decoration:none;box-shadow:0 4px 0 var(--rojo-d)}
.hd-demo:hover{color:#FFF8F0;background:#A92A36}
.lsw{grid-area:lsw;display:flex;border:2px solid var(--tinta);border-radius:4px;overflow:hidden}
.lsw a{display:grid;place-items:center;min-width:44px;min-height:44px;color:var(--tinta);font:800 14px/1 var(--body);letter-spacing:.04em;text-decoration:none}
.lsw a+a{border-left:2px solid var(--tinta)}
.lsw a:hover{background:var(--maiz-p);color:var(--tinta)}
.lsw a[aria-current]{background:var(--tinta);color:var(--papel)}
@media (max-width:420px){.wm-tag{display:none}.wm-name{font-size:23px}}
@media (max-width:359px){.tg-t{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}.hd-tg{padding:0 10px}}
@media (min-width:1180px){
 .hd-in{grid-template-columns:auto minmax(0,1fr) auto;grid-template-areas:"wm nav lsw";column-gap:20px}
 .hd-tg{display:none}
 .hd-nav,.hd.nav-open .hd-nav{display:flex;align-items:center;justify-content:flex-end;gap:14px;margin:0;padding:0;border:0}
 .nv{display:flex;flex-wrap:wrap;justify-content:flex-end}
 .nv a{min-height:46px;padding:0 10px;border:0;font-size:15px;gap:0}
 .nv a::before{display:none}
 .nv a::after{content:"";position:absolute;left:10px;right:10px;bottom:5px;height:4px;background:linear-gradient(90deg,var(--rojo) 0 34%,var(--maiz) 34% 67%,var(--verde) 67%);transform:scaleX(0);transform-origin:left;transition:transform .25s ease}
 .nv a:hover::after,.nv a[aria-current="page"]::after{transform:scaleX(1)}
 .hd-demo{margin:0;min-height:46px;font-size:15px;white-space:nowrap}
}
.cenefa{height:22px;border-top:2px solid var(--pino-d);border-bottom:2px solid var(--pino-d);background:var(--cenefa) 0 50%/28px 18px repeat-x,var(--yeso)}

/* ---------- buttons, chips, kicker ---------- */
.btn{display:inline-flex;align-items:center;justify-content:center;min-height:52px;padding:12px 22px;border-radius:4px;font:800 16px/1.2 var(--body);text-align:center;text-decoration:none;transition:transform .15s ease,background .15s ease}
.btn--rojo{background:var(--rojo);color:#FFF8F0;box-shadow:0 4px 0 var(--rojo-d)}
.btn--rojo:hover{background:#A92A36;color:#FFF8F0;transform:translateY(-1px)}
.btn--line{border:2px solid var(--tinta);background:rgba(251,248,242,.6);color:var(--tinta)}
.btn--line:hover{background:var(--papel);color:var(--tinta)}
.kicker{display:inline-block;margin:0 0 16px;padding:6px 10px 6px 12px;border-left:5px solid var(--verde);background:var(--papel);color:var(--verde);font:800 13px/1.3 var(--body);letter-spacing:.08em;text-transform:uppercase}
.chips{list-style:none;display:flex;flex-wrap:wrap;gap:6px;margin:20px 0 0;padding:0}
.chips li{padding:6px 11px;border:1.5px solid currentColor;border-radius:999px;color:var(--verde);font:700 13.5px/1.25 var(--body)}
.chips--dark li{color:#F3D98A}

/* ---------- home: the retablo ---------- */
.rt{padding:clamp(20px,3.5vw,44px) 0 0}
.rt-wrap{max-width:1300px;margin:0 auto;padding:0 16px;display:grid;grid-template-columns:minmax(0,1fr);perspective:1600px}
.rt-door{display:none}
.rt-box{position:relative;container:rt/inline-size}
.rt-body{padding:0 10px 10px;background:var(--wood);box-shadow:0 30px 40px -30px rgba(43,31,25,.55)}
.rt-roof{position:relative;display:grid;place-items:end center;height:clamp(58px,9vw,118px);background:var(--pino-d);clip-path:polygon(50% 0,100% 100%,0 100%)}
.rt-roof::before{content:"";position:absolute;inset:9px 18px 0;background:var(--rojo);clip-path:polygon(50% 0,100% 100%,0 100%)}
.rt-roof::after{content:"";position:absolute;left:0;right:0;bottom:0;height:10px;background:var(--wood)}
.rt-sun{position:relative;z-index:1;width:clamp(40px,6.5vw,78px);margin-bottom:12px}
.rt-floor{position:relative}
.rt-up{display:grid;gap:28px;padding:clamp(24px,4.5vw,60px) clamp(16px,4.5vw,60px);background:linear-gradient(180deg,#CFE2EA 0,#E4EEEF 70%,#EDF2EE 100%);box-shadow:inset 0 10px 18px -10px rgba(31,53,97,.35)}
.rt-up h1{font:clamp(31px,5vw,60px)/1.06 var(--display);color:var(--tinta);text-wrap:balance;margin-bottom:18px}
.h1a{display:block;color:var(--rojo)}
.h1b{display:block}
.lead p{max-width:62ch;font-size:clamp(17px,1.5vw,19px);line-height:1.6}
.lead p:last-child{margin-bottom:0}
.actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:24px}
.up-niche{display:none}
.un-arch{position:relative;display:grid;place-content:center;justify-items:center;aspect-ratio:3/4;border:12px solid transparent;border-radius:999px 999px 4px 4px;background:linear-gradient(180deg,#F8E1E4,#FBF1EC) padding-box,var(--wood) border-box;box-shadow:inset 0 14px 22px -12px rgba(142,34,48,.35)}
.un-arch::before{content:"";position:absolute;inset:14px;border:2px dotted var(--rosa);border-radius:999px 999px 2px 2px}
.un-a{font:clamp(84px,10vw,132px)/.82 var(--display);color:var(--rojo);text-shadow:4px 4px 0 var(--maiz)}
.un-b{margin-top:6px;font:clamp(46px,5.6vw,74px)/1 var(--display);color:var(--anil);letter-spacing:.02em}
.un-base{height:26px;margin:0 -10px;background:linear-gradient(var(--verde) 0 8px,var(--maiz) 8px 13px,var(--pino-d) 13px);clip-path:polygon(4% 0,96% 0,100% 100%,0 100%)}
@container rt (min-width:760px){
 .rt-up{grid-template-columns:minmax(0,1.6fr) minmax(190px,.75fr);align-items:center;column-gap:clamp(28px,4vw,56px)}
 .up-niche{display:block}
}
.rt-shelf{height:32px;margin:0 -10px;border-top:3px solid var(--pino-d);border-bottom:3px solid var(--pino-d);background:var(--cenefa) 0 50%/28px 18px repeat-x,var(--wood)}
.rt-play{display:grid;grid-template-areas:"side" "game" "help";gap:22px;padding:clamp(18px,3.5vw,44px) clamp(10px,3vw,40px) clamp(18px,3vw,36px);color:#F4EEE3;scroll-margin-top:12px;
 background:radial-gradient(circle,rgba(237,179,48,.22) 0 1.4px,transparent 2px) 0 0/34px 34px,radial-gradient(circle,rgba(233,138,156,.18) 0 1.2px,transparent 1.8px) 17px 17px/34px 34px,linear-gradient(180deg,var(--anil),var(--anil-d));
 box-shadow:inset 0 12px 20px -12px rgba(0,0,0,.6)}
.pl-side{grid-area:side;padding:0 6px}
.pl-help{grid-area:help;padding:0 6px}
.pl-k{margin:0 0 8px;color:var(--maiz);font:800 13px/1.3 var(--body);letter-spacing:.09em;text-transform:uppercase}
.rt-play h2{font:clamp(26px,3vw,34px)/1.1 var(--display);color:#FBF8F2;margin-bottom:12px}
.pl-p{color:#DCE3EE;font-size:16.5px}
.pl-steps{list-style:none;counter-reset:st;margin:6px 0 0;padding:0;display:grid;gap:10px}
.pl-steps li{counter-increment:st;display:grid;grid-template-columns:34px minmax(0,1fr);gap:12px;align-items:start;color:#EEF1F6;font-size:16px;line-height:1.45}
.pl-steps li::before{content:counter(st);display:grid;place-items:center;width:34px;height:34px;border-radius:50%;background:var(--maiz);color:var(--anil-d);font:16px/1 var(--display)}
.pl-game{grid-area:game;min-width:0;padding:8px;background:var(--wood);box-shadow:0 0 0 2px var(--pino-d),0 18px 30px -16px rgba(0,0,0,.7)}
@container rt (min-width:860px){
 .rt-play{grid-template-columns:minmax(230px,290px) minmax(0,1fr);grid-template-areas:"side game" "help game";grid-template-rows:auto 1fr;align-items:start;column-gap:clamp(24px,3vw,40px)}
 .pl-side{padding-top:8px}
}
.rt-base{height:26px;max-width:min(1060px,calc(100% - 20px));margin:0 auto;background:linear-gradient(var(--pino-d),#6B4322);clip-path:polygon(1.5% 0,98.5% 0,100% 100%,0 100%)}
@media (max-width:599px){
 .rt-wrap{padding:0}
 .rt-body{padding:0 6px 6px}
 .rt-shelf{margin:0 -6px}
 .rt-play{padding-left:8px;padding-right:8px}
 .pl-game{padding:5px}
}
@media (min-width:1240px){
 .rt-wrap{grid-template-columns:122px minmax(0,1fr) 122px}
 .rt-door{display:block;align-self:start;margin-top:clamp(58px,9vw,118px)}
 .rt-leaf{width:122px;filter:drop-shadow(0 16px 14px rgba(43,31,25,.28))}
 .rt-leaf svg{width:122px;height:auto}
 .rt-leaf .flip{transform:scaleX(-1)}
 .rt-door--l .rt-leaf{transform-origin:right center;transform:rotateY(22deg)}
 .rt-door--r .rt-leaf{transform-origin:left center;transform:rotateY(-22deg)}
}

/* ---------- inner page head ---------- */
.ph{padding:18px 16px 0}
.ph-in{max-width:1180px;margin:0 auto}
.bc ol{list-style:none;display:flex;flex-wrap:wrap;align-items:center;gap:0 10px;margin:0 0 12px;padding:0;font:700 15px/1.3 var(--body)}
.bc li{display:flex;align-items:center;gap:10px;min-width:0}
.bc li+li::before{content:"";flex:none;width:8px;height:8px;border-radius:50% 0;transform:rotate(45deg);background:var(--rosa)}
.bc a{display:inline-flex;align-items:center;min-height:44px;color:var(--rojo-d)}
.bc span{color:var(--tinta-2)}
.ph-roof{position:relative;height:clamp(40px,6.5vw,78px);background:var(--pino-d);clip-path:polygon(50% 0,100% 100%,0 100%)}
.ph-roof::before{content:"";position:absolute;inset:8px 16px 0;background:var(--rojo);clip-path:polygon(50% 0,100% 100%,0 100%)}
.ph-roof::after{content:"";position:absolute;left:50%;bottom:6px;width:clamp(16px,2vw,24px);aspect-ratio:1;translate:-50% 0;border-radius:50%;background:var(--maiz);box-shadow:0 0 0 5px var(--rosa)}
.ph-body{display:grid;gap:24px;padding:clamp(20px,4vw,50px);border:10px solid transparent;border-top-width:12px;background:linear-gradient(180deg,#D3E4EB,#EAF1EF) padding-box,var(--wood) border-box;box-shadow:inset 0 10px 16px -10px rgba(31,53,97,.3)}
.ph-body h1{font:clamp(28px,4.2vw,50px)/1.08 var(--display);text-wrap:balance;margin-bottom:16px}
.ph-doors{display:none}
@media (min-width:900px){
 .ph-body{grid-template-columns:minmax(0,1fr) 200px;align-items:center}
 .ph-doors{display:flex;justify-content:center;height:190px;perspective:600px}
 .ph-doors i{width:46px;background:radial-gradient(circle at 50% 30%,var(--maiz) 0 5px,var(--rosa) 5.5px 11px,transparent 11.5px),radial-gradient(circle at 50% 66%,#F4EEE3 0 4px,transparent 4.5px),var(--rojo);box-shadow:inset 0 0 0 3px var(--rojo),inset 0 0 0 5px var(--maiz)}
 .ph-doors i:first-child{transform-origin:right;transform:rotateY(28deg)}
 .ph-doors i:last-child{transform-origin:left;transform:rotateY(-28deg)}
 .ph-doors span{display:grid;place-items:center;width:100px;border:7px solid transparent;border-radius:60px 60px 3px 3px;background:linear-gradient(var(--anil),var(--anil-d)) padding-box,var(--wood) border-box;color:var(--maiz);font:66px/1 var(--display);text-transform:lowercase}
}

/* ---------- document ---------- */
.doc{padding:clamp(36px,5vw,64px) 16px clamp(48px,6vw,80px)}
.doc-in{max-width:1180px;margin:0 auto}
.shelf{margin:0 0 clamp(30px,4vw,52px);padding:10px 10px 12px;background:var(--wood);box-shadow:0 0 0 2px var(--pino-d),0 20px 26px -22px rgba(43,31,25,.6)}
.shelf-k{margin:0 0 8px;padding:0 4px;color:var(--nogal);font:800 13px/1.3 var(--body);letter-spacing:.1em;text-transform:uppercase}
.niches{list-style:none;display:grid;grid-template-columns:repeat(auto-fit,minmax(158px,1fr));gap:8px;margin:0;padding:0}
.niches a{display:flex;flex-direction:column;align-items:center;justify-content:flex-start;gap:6px;height:100%;min-height:100px;padding:20px 10px 12px;border-radius:90px 90px 3px 3px/38px 38px 3px 3px;background:var(--celeste);box-shadow:inset 0 8px 12px -8px rgba(43,31,25,.5);color:var(--tinta);font:700 15px/1.3 var(--body);text-align:center;text-decoration:none;transition:background .2s ease,color .2s ease}
.niches li:nth-child(4n+2) a{background:var(--rosa-p)}
.niches li:nth-child(4n+3) a{background:var(--verde-p)}
.niches li:nth-child(4n) a{background:var(--maiz-p)}
.ni-no{font:21px/1 var(--display);color:var(--rojo)}
.niches a:hover{color:var(--rojo-d)}
.niches a.is-on{background:var(--anil);color:#FBF8F2}
.niches a.is-on .ni-no{color:var(--maiz)}
@media (max-width:479px){.niches{grid-template-columns:repeat(2,minmax(0,1fr))}.niches li:last-child:nth-child(odd){grid-column:1/-1}.niches a{font-size:14.5px;padding:18px 8px 10px}}
.doc-grid{display:grid;gap:44px}
.doc--home .doc-grid{max-width:800px;margin:0 auto}
@media (min-width:1100px){.doc:not(.doc--home) .doc-grid{grid-template-columns:minmax(0,1fr) 300px;align-items:start;column-gap:60px}}
.doc-main{min-width:0}
.sec{margin-top:clamp(40px,5vw,64px);scroll-margin-top:16px}
.prose--intro+.sec,.doc-main>.sec:first-child{margin-top:clamp(28px,3vw,40px)}
.sec-hd{position:relative;display:grid;grid-template-columns:58px minmax(0,1fr);align-items:center;gap:14px;margin-bottom:22px;padding-bottom:16px}
.sec-hd::after{content:"";position:absolute;left:0;right:0;bottom:4px;height:5px;background:linear-gradient(90deg,var(--rojo) 0 58px,var(--pino) 58px);box-shadow:0 4px 0 var(--maiz)}
.sec-hd h2{font:clamp(24px,3vw,33px)/1.15 var(--display);color:var(--tinta);text-wrap:balance}
.rs{position:relative;display:grid;place-items:center;width:58px;height:58px;color:var(--rosa)}
.rs svg{position:absolute;inset:0;width:100%;height:100%}
.rs b{position:relative;color:var(--tinta);font:17px/1 var(--display)}
.rs--2{color:var(--maiz)}.rs--3{color:#8FC2A6}.rs--0{color:#9EBBDC}.rs--q{color:var(--rojo)}
.prose{max-width:70ch}
.prose>:last-child{margin-bottom:0}
.prose h3{margin:1.5em 0 .5em;color:var(--verde);font:800 20px/1.3 var(--body)}
.prose strong{font-weight:800}
.prose ul,.prose ol{margin:0 0 1.2em;padding:0}
.prose ul>li,.prose ol>li{position:relative;list-style:none;margin:0 0 .55em;padding-left:30px}
.prose ul>li::before{content:"";position:absolute;left:6px;top:.62em;width:10px;height:10px;border-radius:50% 0;transform:rotate(45deg);background:var(--rojo)}
.prose ul>li:nth-child(3n+2)::before{background:var(--verde)}
.prose ul>li:nth-child(3n)::before{background:var(--maiz)}
.prose ol{counter-reset:ol}
.prose ol>li{counter-increment:ol}
.prose ol>li::before{content:counter(ol);position:absolute;left:0;top:.2em;display:grid;place-items:center;width:22px;height:22px;border-radius:50%;background:var(--anil);color:var(--papel);font:12px/1 var(--display)}
.prose--intro p{font-size:18px}
.tbl{overflow-x:auto;margin:1.4em 0;border:4px solid var(--pino);background:var(--papel)}
.tbl:focus-visible{outline-offset:2px}
table{width:100%;min-width:460px;border-collapse:collapse;font-size:15.5px;line-height:1.45}
th{padding:10px 12px;background:var(--anil);color:#FBF8F2;font-weight:800;text-align:left;vertical-align:bottom}
td{padding:10px 12px;border-top:1px solid var(--line);vertical-align:top}
tr:nth-child(even) td{background:#F7F1E7}
/* faq — little double doors */
.faq{display:grid;gap:10px}
.qa{border:2px solid var(--pino);border-radius:3px;background:var(--papel);transition:border-color .2s ease}
.qa[open]{border-color:var(--rojo)}
.qa summary{display:grid;grid-template-columns:minmax(0,1fr) 36px;align-items:center;gap:14px;min-height:58px;padding:12px 14px 12px 18px;cursor:pointer;list-style:none;font:800 17px/1.35 var(--body)}
.qa summary::-webkit-details-marker{display:none}
.qa summary:hover .qa-q{color:var(--rojo-d)}
.qa-d{display:flex;width:36px;height:30px;border:3px solid var(--pino-d);background:var(--maiz)}
.qa-d i{flex:1;background:var(--rojo);transition:transform .3s ease}
.qa-d i:first-child{transform-origin:left;border-right:1px solid var(--rojo-d)}
.qa-d i:last-child{transform-origin:right}
.qa[open] .qa-d i{transform:scaleX(.16)}
.qa-a{padding:14px 18px 16px;border-top:1px dashed var(--line)}
.qa-a>:last-child{margin-bottom:0}
/* inner aside: a little retablo holding the demo link */
.cajita{max-width:420px}
.cj-roof{height:46px;background:var(--pino-d);clip-path:polygon(50% 0,100% 100%,0 100%);position:relative}
.cj-roof::before{content:"";position:absolute;inset:7px 12px 0;background:var(--rojo);clip-path:polygon(50% 0,100% 100%,0 100%)}
.cj-box{padding:22px 18px 20px;border:10px solid transparent;border-top-width:8px;background:linear-gradient(180deg,var(--anil),var(--anil-d)) padding-box,var(--wood) border-box;color:#F4EEE3}
.cj-k{margin:0 0 6px;color:var(--maiz);font:800 12.5px/1.3 var(--body);letter-spacing:.09em;text-transform:uppercase}
.cj-h{margin:0 0 10px;color:#FBF8F2;font:25px/1.12 var(--display)}
.cj-p{color:#DCE3EE;font-size:16px}
.cajita .btn{width:100%}
@media (min-width:1100px){.cajita{position:sticky;top:20px}}

/* ---------- related: mini retablos ---------- */
.rel{padding:clamp(44px,6vw,76px) 16px;background:var(--papel);border-top:2px solid var(--pino-d)}
.rel-in{max-width:1180px;margin:0 auto}
.rel-hd{display:flex;align-items:center;gap:18px;margin-bottom:12px}
.rel-hd h2{flex:none;max-width:100%;font:clamp(26px,3vw,34px)/1.1 var(--display)}
.rel-rule{flex:1;min-width:30px;height:22px;border-top:2px solid var(--pino-d);border-bottom:2px solid var(--pino-d);background:var(--cenefa) 0 50%/28px 18px repeat-x}
.rel-list{list-style:none;display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,200px),1fr));gap:18px;margin:0;padding:0}
.mr a{position:relative;display:flex;flex-direction:column;align-items:center;gap:8px;height:calc(100% - 50px);margin-top:50px;padding:16px 18px 20px;border:8px solid transparent;border-top:0;background:linear-gradient(180deg,var(--celeste),#EEF3F1) padding-box,var(--wood) border-box;color:var(--tinta);text-align:center;text-decoration:none;transition:transform .2s ease}
.mr a::before{content:"";position:absolute;left:-8px;right:-8px;top:-48px;height:48px;background:var(--rojo);clip-path:polygon(50% 0,100% 100%,0 100%);transition:background .2s ease}
.mr--2 a{background:linear-gradient(180deg,var(--rosa-p),#FBF1EF) padding-box,var(--wood) border-box}
.mr--3 a{background:linear-gradient(180deg,var(--verde-p),#F1F5EE) padding-box,var(--wood) border-box}
.mr--0 a{background:linear-gradient(180deg,var(--maiz-p),#FBF4E2) padding-box,var(--wood) border-box}
.mr-no{display:grid;place-items:center;width:46px;height:46px;border-radius:50%;background:var(--papel);box-shadow:0 0 0 3px var(--maiz);color:var(--rojo);font:18px/1 var(--display)}
.mr-t{font:800 18px/1.3 var(--body)}
.mr-d{color:var(--tinta-2);font-size:16px;line-height:1.5}
.mr a:hover{transform:translateY(-3px);color:var(--tinta)}
.mr a:hover::before{background:var(--anil)}

/* ---------- footer: the pine base ---------- */
.ft{background:var(--nogal);color:#E9DECD}
.ft .cenefa{border-color:var(--pino-d)}
.ft-in{max-width:1180px;margin:0 auto;padding:44px 16px 28px;display:grid;gap:32px}
@media (min-width:860px){.ft-in{grid-template-columns:1.5fr 1fr 1fr;gap:48px}}
.ft-wm{display:inline-flex;align-items:center;gap:12px;min-height:48px;color:#FBF8F2;font:28px/1 var(--display);text-decoration:none}
.ft-wm:hover{color:var(--maiz)}
.ft-mark{width:46px;height:46px}
.ft-disc{max-width:54ch;margin-top:14px;color:#DACDBB;font-size:16px;line-height:1.6}
.ft-h{margin:0 0 8px;color:var(--maiz);font:800 13px/1.3 var(--body);letter-spacing:.1em;text-transform:uppercase}
.ft-col ul{list-style:none;margin:0;padding:0}
.ft-col a{display:flex;align-items:center;min-height:46px;border-bottom:1px solid rgba(244,238,227,.13);color:#F4EEE3;font-weight:600;text-decoration:none}
.ft-col a:hover{color:var(--maiz)}
.ft-bot{max-width:1180px;margin:0 auto;padding:18px 16px 30px;display:flex;flex-wrap:wrap;align-items:center;gap:10px 20px;border-top:1px solid rgba(244,238,227,.15);color:#D2C4B0;font-size:15px}
.age{display:grid;place-items:center;width:48px;height:48px;border-radius:50%;background:var(--rojo);box-shadow:0 0 0 3px var(--maiz);color:#FFF8F0;font:17px/1 var(--display)}
.ft-tag{margin-left:auto}
@media (max-width:640px){.ft-tag{margin-left:0;flex-basis:100%}}

/* ---------- 404 ---------- */
.nf{padding:clamp(60px,10vw,120px) 16px;text-align:center}
.nf-in{max-width:560px;margin:0 auto}
.nf-code{margin:0 0 10px;color:var(--rojo);font:clamp(90px,16vw,150px)/1 var(--display);text-shadow:6px 6px 0 var(--maiz)}
.nf h1{margin-bottom:12px;font:clamp(28px,4vw,40px)/1.1 var(--display)}

/* ---------- motion (never hides content) ---------- */
@media (prefers-reduced-motion:no-preference){
 html{scroll-behavior:smooth}
 .rt-sun{animation:sunspin 90s linear infinite}
 @keyframes sunspin{to{transform:rotate(360deg)}}
 @media (min-width:1240px){
  .rt-door--l .rt-leaf{animation:swingL 1.6s cubic-bezier(.2,.75,.25,1) .15s both}
  .rt-door--r .rt-leaf{animation:swingR 1.6s cubic-bezier(.2,.75,.25,1) .15s both}
  @keyframes swingL{from{transform:rotateY(62deg)}to{transform:rotateY(22deg)}}
  @keyframes swingR{from{transform:rotateY(-62deg)}to{transform:rotateY(-22deg)}}
 }
}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important}}