/* Mauro Cortés · estudio — sistema visual claro
   Yeso de fondo, tinta negra, un solo rojo (el de la corona). Inter Display Black para el nombre, Inter para leer. */
@font-face{font-family:"Inter Display";font-weight:900;font-display:swap;src:url(/fonts/inter-display-black.woff) format("woff")}
@font-face{font-family:"Inter";font-weight:400;font-display:swap;src:url(/fonts/inter-400.woff) format("woff")}
@font-face{font-family:"Inter";font-weight:500;font-display:swap;src:url(/fonts/inter-500.woff) format("woff")}
@font-face{font-family:"Inter";font-weight:600;font-display:swap;src:url(/fonts/inter-600.woff) format("woff")}

:root{
  --yeso:#fafaf7; --hormigon:#ececE8; --tinta:#000; --grafito:#6b6b66; --linea:#d6d6d0; --rojo:#c8102e;
  /* nombres que usan los módulos compartidos (pared.js) */
  --paper:var(--yeso); --sheet:#fff; --ink:var(--tinta); --graphite:var(--grafito); --rule:var(--linea); --red:var(--rojo);
  --f-display:"Inter Display","Inter",system-ui,sans-serif; --f-body:"Inter",system-ui,sans-serif;
  --ease-out:cubic-bezier(.23,1,.32,1); --ease-drawer:cubic-bezier(.32,.72,0,1);
  --gut:clamp(16px,2.2vw,32px); --max:1440px;
  color-scheme:light;
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-padding-top:84px}
body{margin:0;background:var(--yeso);color:var(--tinta);font:400 17px/1.55 var(--f-body);font-feature-settings:"ss01","cv11";-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
img,video,svg{display:block;max-width:100%}
img{height:auto}
picture{display:block}
a{color:inherit}
:focus-visible{outline:2px solid var(--tinta);outline-offset:3px;border-radius:4px}
.sr{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.skip{position:absolute;left:var(--gut);top:-60px;z-index:200;background:var(--tinta);color:var(--yeso);padding:10px 16px;border-radius:999px;text-decoration:none}
.skip:focus{top:12px}

/* ---------- pastillas (botones y enlaces de navegación) ---------- */
.pill{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:40px;padding:0 18px;border:1px solid var(--tinta);border-radius:999px;background:transparent;color:var(--tinta);font:500 15px/1 var(--f-body);text-decoration:none;white-space:nowrap;cursor:pointer;transition:background-color .2s,color .2s,transform .15s var(--ease-out)}
.pill:active{transform:scale(.97)}
@media (hover:hover){.pill:hover{background:var(--tinta);color:var(--yeso)}}
.pill.solid{background:var(--tinta);color:var(--yeso)}
@media (hover:hover){.pill.solid:hover{background:var(--rojo);border-color:var(--rojo)}}
.pill.big{min-height:52px;padding:0 26px;font-size:16px}
.pill[aria-disabled=true]{opacity:.4;pointer-events:none}
.paren{font:500 14px/1.3 var(--f-body);color:var(--tinta)}
.paren::before{content:"( "}.paren::after{content:" )"}

/* ---------- cabecera ---------- */
.top{position:fixed;inset:0 0 auto;z-index:50;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:12px;padding:14px var(--gut);transition:background-color .3s,backdrop-filter .3s}
.top.scrolled{background:color-mix(in srgb,var(--yeso) 86%,transparent);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}
.marca{display:flex;align-items:center;gap:10px;text-decoration:none;font:900 22px/1 var(--f-display);letter-spacing:-.04em}
.marca .sim{width:44px;height:auto;display:block}
.top nav{display:flex;gap:8px}
.top .der{display:flex;justify-content:end;gap:8px}
@media (max-width:860px){.top{grid-template-columns:1fr auto}.top nav{display:none}.top .der .ig{display:none}}

/* ---------- portada ---------- */
.hero{position:relative;min-height:100svh;display:grid;grid-template-columns:minmax(0,1.35fr) minmax(0,1fr);gap:var(--gut);align-items:end;padding:96px var(--gut) var(--gut);max-width:var(--max);margin:auto}
.nombre{margin:0;font:900 clamp(78px,15.4vw,236px)/.8 var(--f-display);letter-spacing:-.065em;text-wrap:balance}
.nombre span{display:block}
.nombre .pto{display:inline}
.nombre .dier{display:inline-block}
.nombre .paren{display:inline-block;vertical-align:top;margin:.35em 0 0 .3em;font-size:clamp(12px,1vw,15px);letter-spacing:0;line-height:1}
.hero .intro{display:grid;gap:22px;margin-top:clamp(28px,4vw,48px);max-width:30em}
.hero .intro p{margin:0;font-size:clamp(18px,1.5vw,21px);line-height:1.45}
.hero .acc{display:flex;flex-wrap:wrap;gap:10px}
.hero figure{margin:0;align-self:stretch;display:grid;align-content:end;gap:10px}
.hero figure img{width:100%;height:min(78svh,820px);object-fit:cover;object-position:50% 30%;border-radius:2px;filter:grayscale(1) contrast(1.05)}
.hero figcaption{font-size:14px;color:var(--grafito)}
@media (max-width:860px){
  .hero{grid-template-columns:1fr;align-items:start;padding-top:88px}
  .hero figure{order:-1}
  .hero figure img{height:52svh}
}

/* ---------- cinta (marquesina) ---------- */
.cinta{overflow:hidden;background:var(--hormigon);border-block:1px solid var(--linea);padding:14px 0}
.cinta .pista{display:flex;width:max-content;gap:40px;animation:cinta 42s linear infinite}
.cinta span{display:flex;align-items:center;gap:40px;font:500 15px/1 var(--f-body);white-space:nowrap}
.cinta svg{width:15px;height:auto;flex:none}
@keyframes cinta{to{transform:translateX(-50%)}}
.rm .cinta .pista{animation:none}

/* ---------- secciones ---------- */
.sec{max-width:var(--max);margin:auto;padding:clamp(72px,10vw,150px) var(--gut)}
.titulo{margin:0;font:900 clamp(48px,8.4vw,128px)/.86 var(--f-display);letter-spacing:-.06em}
.titulo .paren{display:inline-block;vertical-align:top;margin:.4em 0 0 .35em;font-size:14px;letter-spacing:0;line-height:1}
.lead{font-size:clamp(18px,1.45vw,21px);line-height:1.5;max-width:34em;margin:0}

/* ---------- manifiesto: el único momento animado ---------- */
.manifiesto{position:relative;height:340svh}
.manifiesto .escena{position:sticky;top:0;height:100svh;display:grid;place-items:center;overflow:hidden}
.manifiesto .personaje{width:min(24vw,36vh,300px);height:auto;overflow:visible;position:relative;z-index:1;transform:translateY(calc(var(--p,0) * -6vh))}
.simbolo{--g:1}
.simbolo .rojo{transform-box:fill-box}
.simbolo .r-corona{transform-origin:50% 100%;transform:translateY(calc((1 - var(--g,1)) * -260px));opacity:clamp(0,calc(var(--g,1) * 2.5 - .2),1)}
.simbolo .r-pica{opacity:clamp(0,calc(var(--g,1) * 2.5 - .9),1)}
.simbolo .r-punto{transform-origin:50% 50%;transform:scale(clamp(0,calc(var(--g,1) * 1.6 - .6),1))}
.manifiesto .frases{position:absolute;inset:0;max-width:var(--max);margin:auto;padding:0 var(--gut);pointer-events:none}
.frase{position:absolute;margin:0;max-width:min(30ch,34vw);font:900 clamp(26px,3.3vw,50px)/.98 var(--f-display);letter-spacing:-.045em;opacity:var(--o,0);transform:translateY(calc((1 - var(--o,0)) * 18px))}
.frase.f1{left:var(--gut);top:16vh}
.frase.f2{right:var(--gut);top:30vh;text-align:right}
.frase.f3{left:var(--gut);bottom:22vh}
.frase.f4{right:var(--gut);bottom:12vh;text-align:right}
.manifiesto .firma{white-space:nowrap;position:absolute;left:50%;bottom:5vh;translate:-50% 0;font-size:14px;color:var(--grafito);opacity:var(--o4,0)}
@media (max-width:760px){
  .manifiesto .escena{place-items:start center;padding-top:15svh}
  .manifiesto .personaje{width:min(72vw,28svh,300px)}
  .frase,.frase.f1,.frase.f2,.frase.f3,.frase.f4{left:var(--gut);right:var(--gut);top:auto;bottom:20svh;max-width:none;text-align:left;font-size:clamp(26px,7.6vw,36px)}
  .manifiesto .firma{bottom:9svh}
}
/* sin animación: el manifiesto se lee como texto normal */
.rm .manifiesto,.no-sticky .manifiesto{height:auto}
.rm .manifiesto .escena,.no-sticky .manifiesto .escena{position:static;height:auto;display:block;padding:clamp(72px,10vw,150px) var(--gut)}
.rm .manifiesto .frases,.no-sticky .manifiesto .frases{position:static;display:grid;gap:28px;padding:0}
.rm .frase,.no-sticky .frase{position:static;opacity:1;transform:none;max-width:22ch;text-align:left}
.rm .manifiesto .personaje,.no-sticky .manifiesto .personaje{margin:0 auto 48px}
.rm .manifiesto .firma,.no-sticky .manifiesto .firma{position:static;translate:none;opacity:1;margin-top:28px}

/* ---------- lo que hago ---------- */
.hago{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(32px,5vw,80px);align-items:start}
.hago ul{list-style:none;margin:28px 0 0;padding:0;border-top:1px solid var(--tinta)}
.hago li{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.3fr);gap:20px;padding:22px 0;border-bottom:1px solid var(--linea)}
.hago li b{font:900 clamp(28px,2.8vw,42px)/.95 var(--f-display);letter-spacing:-.045em}
.hago li span{color:var(--grafito);align-self:end}
.hago .vid-estudio{margin:0;justify-self:center;width:min(100%,400px)}
.hago .vid-estudio video{display:block;width:100%;aspect-ratio:9/16;object-fit:cover;background:#111;border-radius:2px}
.hago .vid-estudio figcaption{margin-top:12px;font:900 22px/1 var(--f-display);letter-spacing:-.03em}
@media (max-width:860px){.hago{grid-template-columns:1fr}.hago li{grid-template-columns:1fr;gap:6px}}

/* ---------- obras ---------- */
.cab{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:end;gap:20px;margin-bottom:clamp(32px,4vw,56px)}
.obras{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(16px,2vw,28px)}
.obra{display:grid;gap:18px;align-content:start}
.obra .img{display:block;background:var(--hormigon);border-radius:2px;overflow:hidden}
.obra .img img{width:100%;aspect-ratio:4/5;object-fit:cover;transition:transform .6s var(--ease-out)}
@media (hover:hover){.obra .img:hover img{transform:scale(1.02)}}
.obra .fila{display:flex;justify-content:space-between;align-items:baseline;gap:16px}
.obra h3{margin:0;font:900 clamp(34px,3.6vw,56px)/.9 var(--f-display);letter-spacing:-.05em}
.obra h3 a{text-decoration:none}
.obra .precio{font:900 clamp(28px,2.6vw,40px)/1 var(--f-display);letter-spacing:-.04em;white-space:nowrap}
.obra p{margin:0;color:var(--grafito);max-width:36em}
.obra .stock{display:grid;gap:8px}
.obra .stock small{font-size:14px}
.ticks{display:flex;gap:4px}
.ticks i{flex:1;height:6px;border-radius:2px;background:var(--tinta)}
.ticks i.sold{background:var(--linea)}
.obra .acc{display:flex;flex-wrap:wrap;gap:8px}
@media (max-width:760px){.obras{grid-template-columns:1fr}}

.archivo{margin-top:clamp(56px,7vw,96px);border-top:1px solid var(--tinta);padding-top:22px}
.archivo .cab{margin-bottom:22px}
.archivo h3{margin:0;font:900 clamp(26px,2.4vw,36px)/1 var(--f-display);letter-spacing:-.04em}
.mini{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(12px,1.6vw,22px)}
.mini figure{margin:0;display:grid;gap:10px}
.mini img{width:100%;aspect-ratio:3/4;object-fit:cover;background:var(--hormigon);border-radius:2px}
.mini figcaption{display:flex;justify-content:space-between;gap:10px;font-size:15px}
.mini figcaption span{color:var(--grafito)}
@media (max-width:640px){.mini{grid-template-columns:repeat(2,minmax(0,1fr))}.mini figure:last-child{display:none}}

/* ---------- el taller ---------- */
.taller{background:var(--tinta);color:var(--yeso)}
.taller .sec{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(32px,5vw,80px);align-items:center}
.taller .titulo{color:var(--yeso)}
.taller video{width:100%;aspect-ratio:4/5;object-fit:cover;border-radius:2px;background:#222}
.pasos{list-style:none;counter-reset:p;margin:32px 0 0;padding:0}
.pasos li{counter-increment:p;display:grid;grid-template-columns:44px 1fr;gap:12px;padding:18px 0;border-top:1px solid rgba(250,250,247,.18)}
.pasos li::before{content:counter(p);font:900 24px/1 var(--f-display);color:var(--rojo)}
.pasos b{display:block;font-weight:600;margin-bottom:4px}
.pasos span{color:rgba(250,250,247,.72)}
.taller .pill{border-color:var(--yeso);color:var(--yeso)}
@media (hover:hover){.taller .pill:hover{background:var(--yeso);color:var(--tinta)}}
@media (max-width:860px){.taller .sec{grid-template-columns:1fr}}

/* ---------- socios ---------- */
.socios{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);gap:clamp(32px,5vw,80px);align-items:end}
.join{display:grid;gap:12px}
.join .fila{display:flex;gap:8px;border:1px solid var(--tinta);border-radius:999px;padding:5px;background:#fff}
.join input{flex:1;min-width:0;border:0;background:transparent;font:400 17px var(--f-body);padding:0 16px;color:var(--tinta);outline:0}
.join .fila:focus-within{box-shadow:0 0 0 2px var(--tinta)}
.join button{border:0;border-radius:999px;background:var(--tinta);color:var(--yeso);font:500 15px var(--f-body);padding:0 22px;min-height:46px;cursor:pointer}
@media (hover:hover){.join button:hover{background:var(--rojo)}}
.join .fila.ig{padding:5px 5px 5px 18px;align-items:center}
.join .at{color:var(--grafito)}
.join input[type=text]{padding-left:4px;min-height:46px}
.join .fine{margin:4px 0 0;font-size:13px;color:var(--grafito);line-height:1.5}
.join .msg{margin:0;font-weight:500}
.hp{position:absolute;left:-9999px}
@media (max-width:860px){.socios{grid-template-columns:1fr}}

/* ---------- preguntas ---------- */
.faq{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.6fr);gap:clamp(32px,5vw,80px)}
.faq details{border-top:1px solid var(--linea)}
.faq details:last-child{border-bottom:1px solid var(--linea)}
.faq summary{display:flex;justify-content:space-between;gap:16px;padding:20px 0;font:600 18px/1.3 var(--f-body);cursor:pointer;list-style:none}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";font:400 24px/1 var(--f-body);transition:transform .2s var(--ease-out)}
.faq details[open] summary::after{transform:rotate(45deg)}
.faq details p{margin:0 0 22px;color:var(--grafito);max-width:40em}
@media (max-width:860px){.faq{grid-template-columns:1fr}}

/* ---------- pie ---------- */
.pie{padding:clamp(56px,7vw,96px) var(--gut) var(--gut);max-width:var(--max);margin:auto}
.pie .enlaces{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:24px;padding-bottom:clamp(40px,6vw,80px);border-bottom:1px solid var(--tinta)}
.pie h4{margin:0 0 12px;font-size:14px;font-weight:500;color:var(--grafito)}
.pie ul{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.pie ul a{text-decoration:none}
@media (hover:hover){.pie ul a:hover{text-decoration:underline}}
.pie .gigante{margin:clamp(24px,4vw,48px) 0 0;font:900 clamp(52px,15.4vw,236px)/.8 var(--f-display);letter-spacing:-.07em;white-space:nowrap}
.pie .legal{display:flex;flex-wrap:wrap;justify-content:space-between;gap:10px;margin-top:20px;font-size:13px;color:var(--grafito)}
@media (max-width:760px){.pie .enlaces{grid-template-columns:1fr 1fr}}

/* ---------- barra de compra en móvil ---------- */
.barra{position:fixed;left:12px;right:12px;bottom:calc(12px + env(safe-area-inset-bottom));z-index:40;display:flex;justify-content:space-between;align-items:center;gap:12px;padding:8px 8px 8px 18px;border-radius:999px;background:var(--tinta);color:var(--yeso);transform:translateY(140%);transition:transform .35s var(--ease-drawer)}
.barra.on{transform:none}
.barra a{background:var(--yeso);color:var(--tinta);border-radius:999px;padding:12px 18px;text-decoration:none;font-weight:500}
@media (min-width:861px){.barra{display:none}}

/* ---------- ajustes de ancho en móvil ---------- */
html,body{overflow-x:clip}
.socios>*,.faq>*,.hago>*,.hero>*{min-width:0}
.join input{width:100%}
.join button{flex:none}
@media (max-width:420px){.join button{padding:0 16px}.pie .enlaces{grid-template-columns:1fr 1fr;gap:28px 16px}}

/* ---------- portada: nombre, lema y ya asoman las obras ---------- */
.portada{max-width:var(--max);margin:auto;padding:clamp(92px,12vh,132px) var(--gut) clamp(28px,4vh,48px)}
.rotulo{margin:0;font:900 clamp(64px,14.6vw,226px)/.8 var(--f-display);letter-spacing:-.068em;white-space:nowrap}
.portada .bajo{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);gap:clamp(24px,4vw,64px);align-items:end;margin-top:clamp(18px,2.6vw,36px)}
.lema{margin:0;font:900 clamp(32px,4.6vw,72px)/.92 var(--f-display);letter-spacing:-.05em}
.portada .txt{display:grid;gap:18px}
.portada .txt p{margin:0;font-size:clamp(16px,1.2vw,18px);max-width:34em;color:var(--grafito)}
.portada .acc{display:flex;flex-wrap:wrap;gap:10px}
.obras-sec{padding-top:0}
.nota{margin:22px 0 0;font-size:14px;color:var(--grafito)}
@media (max-width:860px){
  .rotulo{white-space:normal;font-size:clamp(64px,23vw,150px);line-height:.82}
  .portada .bajo{grid-template-columns:1fr;gap:18px}
}
/* ---------- conoce a Mauro (portada) ---------- */
.conoce{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1fr);gap:clamp(32px,5vw,80px);align-items:center}
.conoce .foto img{width:100%;aspect-ratio:4/5;object-fit:cover;object-position:50% 30%;filter:grayscale(1);border-radius:2px}
.conoce .lead{margin-top:24px}
@media (max-width:860px){.conoce{grid-template-columns:1fr}}
/* ---------- página de Mauro ---------- */
.top .pill[aria-current=page]{background:var(--tinta);color:var(--yeso)}
.relato .beats{display:grid;gap:clamp(48px,7vw,104px);margin-top:clamp(32px,4vw,56px)}
.beat{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,6fr);gap:clamp(24px,5vw,80px);align-items:center}
.beat.inv picture{order:2}
.beat picture{display:block;overflow:hidden;border-radius:2px;background:var(--hormigon)}
.beat img{display:block;width:100%;height:auto;aspect-ratio:4/5;object-fit:cover}
.beat .txt{display:grid;gap:18px;min-width:0}
.beat .frase-b{margin:0;font:900 clamp(34px,4.6vw,68px)/.95 var(--f-display);letter-spacing:-.05em;text-wrap:balance}
.beat .txt p:last-child{margin:0;max-width:34em;font-size:clamp(17px,1.3vw,19px);line-height:1.6;color:var(--grafito)}
@supports (animation-timeline:view()){
  .beat img{animation:relato-entra linear both;animation-timeline:view();animation-range:entry 0% cover 40%}
  .beat .frase-b{animation:relato-sube linear both;animation-timeline:view();animation-range:entry 10% cover 35%}
}
@keyframes relato-entra{from{clip-path:inset(14% 8% 14% 8%);transform:scale(1.1)}to{clip-path:inset(0);transform:none}}
@keyframes relato-sube{from{opacity:0;transform:translateY(40px)}to{opacity:1;transform:none}}
@media (prefers-reduced-motion:reduce){.beat img,.beat .frase-b{animation:none}}
@media (max-width:760px){.beat{grid-template-columns:1fr}.beat.inv picture{order:0}.beat img{aspect-ratio:1/1}}
.videos .trio{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-top:clamp(28px,4vw,48px)}
.videos video{width:100%;aspect-ratio:9/16;object-fit:cover;background:var(--hormigon);border-radius:2px}
@media (max-width:640px){.videos .trio{grid-template-columns:1fr 1fr}.videos video:last-child{display:none}}
.contacto .lead{margin:24px 0 28px}
.contacto .acc{display:flex;flex-wrap:wrap;gap:10px}

/* pasos sincronizados con el vídeo */
.pasos li{transition:opacity .4s}
.taller:has(.pasos li.on) .pasos li{opacity:.45}
.taller .pasos li.on{opacity:1}
.taller video.llega{background:#151515}

/* ---------- portada sencilla: tarjetas que llevan a cada obra ---------- */
a.obra{text-decoration:none;color:inherit}
.obra .n{font:900 clamp(34px,3.6vw,56px)/.9 var(--f-display);letter-spacing:-.05em}
.obra .meta{display:flex;justify-content:space-between;gap:16px;font-size:15px;color:var(--grafito)}
.obra .quedan{color:var(--tinta);font-weight:500;white-space:nowrap}
.obra .quedan.pocas{color:var(--rojo)}
@media (hover:hover){a.obra:hover .n{text-decoration:underline;text-decoration-thickness:3px;text-underline-offset:6px}}
.puertas{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 clamp(24px,4vw,64px)}
.puertas a{display:grid;gap:6px;padding:28px 0;border-top:1px solid var(--tinta);text-decoration:none}
.puertas b{font:900 clamp(30px,3.4vw,52px)/.95 var(--f-display);letter-spacing:-.05em}
.puertas span{color:var(--grafito)}
@media (hover:hover){.puertas a:hover b{color:var(--rojo)}}
@media (max-width:760px){.puertas{grid-template-columns:1fr}.obra .meta{flex-direction:column;gap:4px}}
/* murales */
.mural-foto{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,6fr);gap:clamp(28px,5vw,80px);align-items:center}
.mural-foto picture{display:block}
.mural-foto img{display:block;width:100%;height:auto;aspect-ratio:4/5;object-fit:cover;border-radius:2px}
.mural-pasos .pasos{margin-top:28px}
@media (max-width:760px){.mural-foto{grid-template-columns:1fr}}
/* «Ya no quedan»: en móvil, las tres en fila deslizable; textos alineados arriba */
.mini figcaption{align-items:flex-start}
@media (max-width:640px){
  .mini{grid-template-columns:none;grid-auto-flow:column;grid-auto-columns:64%;overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:8px;scrollbar-width:none}
  .mini::-webkit-scrollbar{display:none}
  .mini figure{scroll-snap-align:start}
  .mini figure:last-child{display:grid}
}
.mural-pasos .pasos li{border-top-color:var(--linea)}
.mural-pasos .pasos span{color:var(--grafito)}
.mural-pasos .pasos b{color:var(--tinta)}
/* titular de murales: más largo que los demás rótulos, se parte en dos líneas */
#mu-t{white-space:normal;font-size:clamp(56px,10.5vw,170px);line-height:.84;max-width:100%}
#so-t{white-space:normal;font-size:clamp(56px,11.5vw,180px);line-height:.84;max-width:100%}
.bases details p{max-width:68ch}