/* Sitio de la Dra. Alba Luz Robles. Papel Fabriano aperlado con tinte violeta; una sola banda de tabiques
   bajo la cabecera; cintillo de novedades; dos secciones con fotografía del mar en duotono morado y figuras
   blancas al frente; las obras sobre perla violeta (nada de fondos negros: la doctora tiene baja visión,
   por eso letra grande y contraste alto). Nada con borde; hover que aparece y desaparece; flechas >>>. */
:root{
  color-scheme:light;
  --perla:#FAF8FC;
  --perla-2:#F3EEFA;
  --blanco:#FFFFFF;
  --tinta:#2A2140;
  --tinta-2:#5B5373;
  --morado:#6A3FCB;
  --flama:#915EE8;
  --lila:#CDB8F3;
  --lavanda:#F1EBFB;
  --linea:#E4DDF2;
  --display:"Fraunces","Georgia","Times New Roman",serif;
  --body:"Figtree","Helvetica Neue",Arial,sans-serif;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--perla);color:var(--tinta);font-family:var(--body);font-size:18px;line-height:1.7;-webkit-font-smoothing:antialiased}
body::after{content:"";position:fixed;inset:0;z-index:60;pointer-events:none;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='360' height='360'><filter id='g'><feTurbulence type='fractalNoise' baseFrequency='0.8' numOctaves='2' stitchTiles='stitch' seed='7'/><feColorMatrix values='0 0 0 0 0.36 0 0 0 0 0.26 0 0 0 0 0.52 0 0 0 0.09 0'/></filter><filter id='f'><feTurbulence type='fractalNoise' baseFrequency='0.012 0.32' numOctaves='2' stitchTiles='stitch' seed='3'/><feColorMatrix values='0 0 0 0 0.36 0 0 0 0 0.26 0 0 0 0 0.52 0 0 0 0.06 0'/></filter><rect width='360' height='360' filter='url(%23g)'/><rect width='360' height='360' filter='url(%23f)'/></svg>");
  background-size:360px 360px}
a{color:var(--morado);text-decoration:none}
h1,h2,h3{font-family:var(--display);font-variation-settings:"SOFT" 100,"opsz" 96;font-weight:500;line-height:1.08;margin:0;text-wrap:balance;letter-spacing:-.01em}
p{margin:0}
.wrap{max-width:1120px;margin:0 auto;padding-inline:20px}
.eyebrow{font-size:.76rem;font-weight:600;letter-spacing:.2em;text-transform:uppercase;color:var(--morado)}
.sec{padding-block:84px}
.sec-head{text-align:center;display:grid;gap:12px;justify-items:center;margin-bottom:48px}
.sec-head h2{font-size:clamp(2rem,4.4vw,3rem)}
.sec-head p{max-width:58ch;color:var(--tinta-2)}
.ic{display:block;width:auto;color:var(--flama)}
:focus-visible{outline:2px solid var(--morado);outline-offset:4px}
@media (prefers-reduced-motion: reduce){ html{scroll-behavior:auto} }

/* Flechas >>> en marcha */
.ch{display:inline-flex;gap:1px;margin-left:.45em;font-weight:600;letter-spacing:0;vertical-align:baseline}
.ch i{font-style:normal;opacity:.3;animation:marcha 1.4s infinite}
.ch i:nth-child(2){animation-delay:.18s}
.ch i:nth-child(3){animation-delay:.36s}
a:hover .ch i,button:hover .ch i,.card:hover .ch i{animation-duration:.7s}
@keyframes marcha{0%,60%{opacity:.3}30%{opacity:1}}

/* Aparece al acercar el cursor, desaparece al alejarlo */
.rev{opacity:0;transform:translateY(5px);transition:opacity .35s ease,transform .35s ease}
:hover > .rev, .card:hover .rev, li:hover > .rev, li:hover > div > .rev, article:hover .rev{opacity:1;transform:none}
@media (hover:none){ .rev{opacity:1;transform:none} }

/* Botones sin borde */
.btn{display:inline-flex;align-items:center;padding:14px 22px;font:600 .84rem/1 var(--body);letter-spacing:.14em;text-transform:uppercase;color:var(--morado);background:transparent;border:0;cursor:pointer;transition:background .3s,color .3s,transform .3s}
.btn.fill{background:var(--lavanda)}
.btn:hover{background:var(--lavanda);transform:translateY(-1px)}
.btn.fill:hover{background:var(--lila)}
.btn.claro{color:#fff}
.btn.claro:hover{background:rgba(255,255,255,.16)}
.btn.claro.fill{background:rgba(255,255,255,.14)}
.btn.claro.fill:hover{background:rgba(255,255,255,.26)}

/* Cabecera */
.top{position:sticky;top:env(safe-area-inset-top,0px);z-index:62;background:rgba(250,248,252,.86);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}
.top .wrap{display:flex;align-items:center;justify-content:space-between;gap:16px;min-height:70px;flex-wrap:wrap}
/* Redes: logos arriba a la derecha, encima del nombre */
.top .redes-top{min-height:0;justify-content:flex-end;padding-top:10px;margin-bottom:-14px;position:relative;z-index:1}
#redes-top{display:flex;gap:6px}
#redes-top a,#redes-top span{display:grid;place-items:center;width:34px;height:34px;color:var(--morado);border-radius:2px;transition:background .3s,color .3s,transform .3s}
#redes-top a:hover{background:var(--lavanda);color:var(--flama);transform:translateY(-2px)}
#redes-top span{opacity:.55}
#redes-top svg{width:19px;height:19px;display:block}
.brand{display:flex;align-items:center;gap:12px;color:var(--tinta);min-width:0;flex:1 1 auto}
.brand .ic{height:30px}
.brand b{font-family:var(--display);font-variation-settings:"SOFT" 100,"opsz" 24;font-weight:600;font-size:1.2rem;letter-spacing:0}
.brand small{display:block;font-size:.66rem;letter-spacing:.2em;text-transform:uppercase;color:var(--tinta-2);margin-top:1px}
.top>.wrap:last-child{position:relative}
/* Menú plegable: el botón dice en qué sección vas (como marcador de elevador) */
.menu-btn{display:inline-flex;align-items:center;background:none;border:0;color:var(--morado);font:600 .8rem/1 var(--body);letter-spacing:.16em;text-transform:uppercase;padding:6px 0;cursor:pointer}
.piso{display:inline-block;position:relative;height:30px;overflow:hidden;border-radius:999px;background:var(--lavanda);transition:width .55s cubic-bezier(.65,0,.25,1),background .3s}
.piso span{position:absolute;left:0;top:0;line-height:30px;padding:0 14px;white-space:nowrap;transition:transform .5s cubic-bezier(.65,0,.25,1),opacity .35s}
.piso span:only-child{position:relative;display:block}
.piso span.sale-arriba{transform:translateY(-100%);opacity:0}
.piso span.sale-abajo{transform:translateY(100%);opacity:0}
.menu-btn:hover .piso,.menu-btn[aria-expanded="true"] .piso{background:var(--lila)}
.nav{position:absolute;right:20px;top:100%;z-index:5;list-style:none;margin:0;padding:8px;min-width:220px;background:var(--blanco);border:1px solid var(--linea);border-radius:18px;box-shadow:0 18px 40px -24px rgba(42,33,64,.35);opacity:0;visibility:hidden;transform:translateY(-8px);transition:opacity .25s,transform .35s cubic-bezier(.65,0,.25,1),visibility 0s .35s}
.nav.open{opacity:1;visibility:visible;transform:none;transition:opacity .25s,transform .35s cubic-bezier(.65,0,.25,1)}
.nav li{position:relative;z-index:1}
.nav a{display:block;padding:11px 16px;border-radius:999px;font-size:.78rem;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--tinta);transition:color .35s}
.nav a:hover{color:var(--morado)}
.nav a.aqui{color:var(--morado)}
/* La gota: una píldora opaca que escurre de una sección a otra (estira primero la orilla que va adelante) */
.nav .gota{position:absolute;z-index:0;left:8px;right:8px;top:var(--g-top,8px);bottom:var(--g-bajo,100%);border-radius:999px;background:var(--lavanda);pointer-events:none;transition:top .5s cubic-bezier(.65,0,.25,1),bottom .5s cubic-bezier(.65,0,.25,1)}
.nav .gota.baja{transition:bottom .32s cubic-bezier(.3,.7,.2,1),top .55s cubic-bezier(.7,0,.2,1) .1s}
.nav .gota.sube{transition:top .32s cubic-bezier(.3,.7,.2,1),bottom .55s cubic-bezier(.7,0,.2,1) .1s}
.nav .gota.quieta{transition:none}
@media (max-width:600px){ .nav{left:20px;right:20px;min-width:0} }
@media (prefers-reduced-motion: reduce){ .piso,.piso span,.nav,.nav .gota{transition:none!important} }
@media (max-width:480px){ .brand .ic{height:26px} .brand b{font-size:1rem} .brand small{letter-spacing:.14em} }

/* La única banda de tabiques */
.banda{display:block;width:100%;height:52px;overflow:hidden}
.banda svg{display:block;width:calc(100% + 48px);height:100%;will-change:transform}

/* Portada */
.hero{text-align:center;padding-block:88px 64px}
.hero .wrap{display:grid;justify-items:center;gap:22px}
.hero h1{font-size:clamp(1.6rem,9.1vw,6.3rem);font-weight:400;white-space:nowrap;max-width:100%;text-shadow:0 1px 0 rgba(255,255,255,.9),0 -1px 0 rgba(42,33,64,.06)}
.hero h1 em{font-style:italic;font-weight:400;color:var(--morado)}
.hero .lead{font-size:clamp(1.05rem,2vw,1.3rem);color:var(--tinta-2);max-width:46ch;text-wrap:balance}
.hero .cta{display:flex;gap:10px;flex-wrap:wrap;justify-content:center;margin-top:6px}
.creds{display:flex;flex-wrap:wrap;justify-content:center;gap:10px 0;list-style:none;margin:28px 0 0;padding:0}
.creds li{padding:0 18px;font-size:.8rem;letter-spacing:.12em;text-transform:uppercase;color:var(--tinta-2);position:relative}
.creds li + li::before{content:"";position:absolute;left:-3px;top:50%;width:6px;height:6px;border-radius:50%;background:var(--lila);transform:translateY(-50%)}
@media (max-width:560px){ .creds{flex-direction:column;align-items:center;gap:8px} .creds li + li::before{display:none} }

/* Cintas: filas de figuras (psi, flor, loto) que se deslizan a la izquierda.
   Tres profundidades: lejos (chica, tenue, desenfocada, lenta), medio y cerca (grande, nítida, rápida). */
.cintas{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:space-around;pointer-events:none;overflow:hidden}
.cinta{animation:mece 9s ease-in-out infinite alternate}
.cinta:nth-child(2n){animation-duration:11s;animation-delay:-4s}
.riel{display:flex;width:max-content;animation:desliza var(--dur,60s) linear infinite;will-change:transform}
.riel i{flex:none;display:grid;place-items:center;width:var(--celda);height:var(--celda)}
.riel svg{height:var(--fig);width:auto;display:block;overflow:visible}
.cinta.lejos{--celda:84px;--fig:26px}
.cinta.medio{--celda:112px;--fig:40px}
.cinta.cerca{--celda:150px;--fig:60px}
.cinta.lejos svg{filter:blur(1.2px)}
.blanco .cinta{color:#CDB8F3}
.blanco .cinta.lejos{opacity:.45}.blanco .cinta.medio{opacity:.75}
.blanco .cinta.cerca svg{filter:drop-shadow(0 8px 10px rgba(106,63,203,.18))}
.perla .cinta{color:var(--lila)}
.perla .cinta.lejos{opacity:.35}.perla .cinta.medio{opacity:.55}.perla .cinta.cerca{opacity:.8}
@keyframes desliza{to{transform:translateX(-50%)}}
@keyframes mece{from{transform:translateY(-7px)}to{transform:translateY(7px)}}

/* Tres accesos sobre blanco puro con las figuras en cinta */
.blanco{position:relative;z-index:61;overflow:hidden;background:#fff}
.blanco .wrap{position:relative}
/* Tres accesos, sin bordes */
.trio{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
.card{display:grid;gap:12px;justify-items:center;text-align:center;padding:40px 24px 34px;color:var(--tinta);transition:background .35s ease,transform .35s ease;border-radius:2px}
.card:hover{background:var(--lavanda);transform:translateY(-4px)}
.card .ic{height:54px;color:var(--flama);transition:color .35s ease,transform .35s ease}
.card:hover .ic{color:var(--morado);transform:scale(1.08)}
.card h3{font-size:1.8rem}
.card p{color:var(--tinta-2);max-width:28ch;font-size:.98rem}
.card span{font-size:.78rem;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:var(--morado);margin-top:4px}
@media (max-width:760px){ .trio{grid-template-columns:1fr;gap:6px} .card{padding:30px 20px} }

/* Secciones con fotografía en capas */
.capas{position:relative;overflow:hidden;isolation:isolate;color:#fff;padding-block:132px;text-align:center}
.capas .fondo{position:absolute;left:0;right:0;top:-22%;height:144%;background-size:cover;background-position:center;filter:grayscale(1) contrast(1.08);will-change:transform;z-index:-3}
.capas .tinte{position:absolute;inset:0;mix-blend-mode:multiply;z-index:-2}
.capas .sombra{position:absolute;inset:0;mix-blend-mode:lighten;z-index:-1}
.capas.morado .tinte{background:#A57BF2}
.capas.morado .sombra{background:#2A1157}
.capas .wrap{display:grid;justify-items:center;gap:18px;position:relative}
.capas .eyebrow{color:rgba(255,255,255,.8)}
.capas h2{font-size:clamp(2rem,4.6vw,3.3rem);max-width:20ch;text-shadow:0 2px 24px rgba(0,0,0,.25)}
.capas p{max-width:52ch;font-size:1.1rem;color:rgba(255,255,255,.86);text-wrap:balance}
.flot{position:absolute;color:#fff;opacity:.92;pointer-events:none;will-change:transform;filter:drop-shadow(0 12px 24px rgba(0,0,0,.25))}
.flot svg{display:block;height:100%;width:auto}
.flot.a{left:5%;top:12%;height:150px}
.flot.b{right:7%;top:18%;height:120px}
.flot.c{left:12%;bottom:10%;height:96px}
.flot.d{right:14%;bottom:8%;height:170px}
@media (max-width:760px){ .capas{padding-block:104px} .flot{opacity:.32} .flot.a{height:72px;left:2%;top:4%} .flot.b{height:60px;right:2%;top:5%} .flot.c{height:50px;left:3%;bottom:4%} .flot.d{height:80px;right:3%;bottom:3%} }

/* Semblanza */
.two{display:grid;grid-template-columns:1fr 1fr;gap:56px;align-items:start}
.prose{display:grid;gap:18px;max-width:62ch;font-size:1.08rem}
.prose p:first-child::first-letter{font-family:var(--display);font-variation-settings:"SOFT" 100,"opsz" 144;font-size:3.4em;float:left;line-height:.8;padding-right:10px;padding-top:7px;color:var(--flama)}
.ficha{margin:0;padding:0}
.ficha div{display:grid;grid-template-columns:140px 1fr;gap:16px;padding:16px 14px;transition:background .3s}
.ficha div:hover{background:var(--lavanda)}
.ficha div + div{border-top:1px solid var(--linea)}
.ficha dt{font-size:.72rem;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:var(--tinta-2);padding-top:5px}
.ficha dd{margin:0}
.ficha dd small{display:block;color:var(--tinta-2);font-size:.92rem}
@media (max-width:820px){ .two{grid-template-columns:1fr;gap:40px} .ficha div{grid-template-columns:1fr;gap:4px} }

/* Obras publicadas: perla violeta con las figuras en cinta, portadas al frente */
.perla{position:relative;overflow:hidden;background:var(--perla-2)}
.perla .wrap{position:relative}
.libros{display:grid;grid-template-columns:repeat(auto-fill,minmax(176px,1fr));gap:30px 22px}
.libro{display:grid;gap:12px;align-content:start;color:var(--tinta);padding:14px;border-radius:2px;transition:background .35s,transform .35s}
a.libro:hover{background:#fff;transform:translateY(-4px)}
.portada{aspect-ratio:2/3;background:linear-gradient(160deg,#E9DEFA,#CDB8F3 58%,#B89CEE);display:grid;align-content:end;padding:16px 16px 18px;box-shadow:0 12px 26px rgba(42,33,64,.16),inset 7px 0 0 rgba(255,255,255,.38);overflow:hidden;position:relative}
.portada img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.portada span{font-family:var(--display);font-variation-settings:"SOFT" 100,"opsz" 48;font-size:1.02rem;line-height:1.16;color:#2A1157;text-wrap:balance}
.portada small{display:block;font-size:.64rem;letter-spacing:.16em;text-transform:uppercase;color:#4A2E8F;margin-top:9px}
.libro h3{font-size:1.06rem;font-weight:500;line-height:1.3}
.libro p{font-size:.86rem;color:var(--tinta-2)}
.libro .tag{display:inline-block;font-size:.66rem;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--morado);background:#fff;padding:4px 8px;justify-self:start}
.libros.seis{grid-template-columns:repeat(6,1fr)}
@media (max-width:960px){ .libros.seis{grid-template-columns:repeat(3,1fr)} }
@media (max-width:540px){ .libros{grid-template-columns:1fr 1fr;gap:22px 14px} .libro{padding:8px} }
@media (max-width:540px){ .libros.seis{grid-template-columns:1fr 1fr} }

/* Filtros de la página de libros */
.filtros{display:flex;flex-wrap:wrap;gap:10px;justify-content:center;margin-bottom:14px}
.filtros + .filtros{margin-bottom:44px}
.chip{border:0;background:#fff;color:var(--tinta);font:600 .94rem/1 var(--body);letter-spacing:.04em;padding:15px 20px;cursor:pointer;transition:background .3s,color .3s;border-radius:2px}
.chip:hover{background:var(--lavanda)}
.chip[aria-pressed="true"]{background:var(--morado);color:#fff}
.vacio{text-align:center;color:var(--tinta-2);padding:48px 0;font-size:1.1rem}
.nota-prov{text-align:center;font-size:.9rem;color:var(--tinta-2);margin-top:36px}
.cuenta{text-align:center;color:var(--tinta-2);margin:-24px 0 28px;font-size:.95rem}

/* Cintillo de novedades: lento y se detiene al tocarlo o pasar el cursor; la lista completa está en #novedades */
.cintillo{background:var(--lavanda);overflow:hidden;position:relative;z-index:61}
.cintillo[hidden]{display:none}
.cintillo a{display:flex;width:max-content;padding:13px 0;animation:desliza var(--dur,40s) linear infinite;color:var(--tinta);font-size:1rem}
.cintillo:hover a,.cintillo:focus-within a,.cintillo.quieto a{animation-play-state:paused}
.cintillo span{padding:0 30px;white-space:nowrap}
.cintillo span b{color:var(--morado);font-weight:600;margin-right:12px;letter-spacing:.12em;text-transform:uppercase;font-size:.76rem}

/* Novedades */
.avisos{list-style:none;margin:0 auto;padding:0;max-width:880px}
.avisos li{display:grid;grid-template-columns:150px 1fr;gap:24px;padding:24px 16px;transition:background .3s;border-radius:2px}
.avisos li:hover{background:var(--lavanda)}
.avisos li + li{border-top:1px solid var(--linea)}
.avisos time{font-family:var(--display);font-variation-settings:"SOFT" 100,"opsz" 48;font-size:1.3rem;color:var(--flama);line-height:1.2}
.avisos h3{font-size:1.4rem;font-weight:500;margin-bottom:6px}
.avisos p{color:var(--tinta-2);font-size:1.02rem;white-space:pre-line}
.avisos a.rev{display:inline-block;margin-top:10px;font-size:.78rem;font-weight:600;letter-spacing:.14em;text-transform:uppercase}
@media (max-width:560px){ .avisos li{grid-template-columns:1fr;gap:6px} }


/* Artículos */
.arts{list-style:none;margin:0 auto;padding:0;max-width:880px}
.arts li{display:grid;grid-template-columns:96px 1fr;gap:24px;padding:24px 16px;transition:background .3s;border-radius:2px}
.arts li:hover{background:var(--lavanda)}
.arts li + li{border-top:1px solid var(--linea)}
.arts .year{font-family:var(--display);font-variation-settings:"SOFT" 100,"opsz" 72;font-size:1.9rem;color:var(--flama);line-height:1;font-variant-numeric:tabular-nums}
.arts h3{font-size:1.32rem;font-weight:500;margin-bottom:6px}
.arts p{color:var(--tinta-2);font-size:.96rem}
.arts p i{font-style:italic}
.arts .tag{display:inline-block;margin-top:10px;font-size:.7rem;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:var(--morado);background:var(--lavanda);padding:5px 10px}
.arts li:hover .tag{background:var(--blanco)}
.arts a.rev{display:inline-block;margin-top:10px;font-size:.76rem;font-weight:600;letter-spacing:.14em;text-transform:uppercase}
@media (max-width:560px){ .arts li{grid-template-columns:1fr;gap:8px} }
.sub{display:grid;gap:10px;justify-items:center;text-align:center;margin:64px auto 28px;max-width:60ch}
.sub h3{font-size:1.7rem}
.sub p{color:var(--tinta-2)}
.center{text-align:center;margin-top:32px}

/* Proyectos */
.proj{list-style:none;margin:0;padding:0;display:grid;gap:14px}
.proj li{background:var(--blanco);display:grid;grid-template-columns:150px 170px 1fr;gap:26px;padding:28px;align-items:start;transition:background .35s,transform .35s}
.proj li:hover{background:var(--lavanda);transform:translateX(6px)}
.proj .span{font-family:var(--display);font-variation-settings:"SOFT" 100,"opsz" 48;font-size:1.5rem;line-height:1.1;font-variant-numeric:tabular-nums}
.proj .code{font-size:.72rem;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:var(--tinta-2);display:grid;gap:6px}
.proj .code b{color:var(--morado);font-size:.9rem;letter-spacing:.08em}
.proj .code em{font-style:normal;color:var(--flama)}
.proj h3{font-family:var(--body);font-variation-settings:normal;font-size:1.06rem;font-weight:600;line-height:1.45}
.proj p{color:var(--tinta-2);font-size:.95rem;margin-top:6px}
@media (max-width:820px){ .proj li{grid-template-columns:1fr;gap:10px} .proj li:hover{transform:none} }

/* Docencia */
.theses{list-style:none;margin:0;padding:0}
.theses li{padding:16px 14px;display:grid;gap:4px;transition:background .3s}
.theses li:hover{background:var(--lavanda)}
.theses li + li{border-top:1px solid var(--linea)}
.theses li span{font-size:.72rem;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:var(--morado)}
.theses li em{font-style:normal;color:var(--tinta-2);font-size:.92rem}

/* Contacto */
.contact{display:grid;grid-template-columns:1fr 1fr;gap:56px}
.addr{display:grid;gap:14px;font-size:1.05rem}
.addr strong{font-family:var(--display);font-variation-settings:"SOFT" 100,"opsz" 48;font-weight:500;font-size:1.5rem}
.addr p{color:var(--tinta-2)}
.addr .ic{height:64px;color:var(--lila);margin-top:8px}
form{display:grid;gap:18px}
label{display:grid;gap:6px;font-size:.74rem;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:var(--tinta-2)}
input,textarea{font:400 1rem/1.5 var(--body);padding:12px 2px;border:0;border-bottom:1px solid var(--lila);background:transparent;color:var(--tinta);width:100%;transition:border-color .3s,background .3s}
input:focus,textarea:focus{outline:none;border-bottom-color:var(--morado);background:var(--lavanda)}
textarea{min-height:120px;resize:vertical}
form .btn{justify-self:start}
.status{color:var(--tinta-2);font-size:.95rem;min-height:1.5em}
@media (max-width:820px){ .contact{grid-template-columns:1fr;gap:40px} }

footer{background:var(--lavanda);text-align:center;padding-block:52px;font-size:.9rem;color:var(--tinta-2)}
footer .wrap{display:grid;gap:12px;justify-items:center}
footer .ic{height:48px}
footer b{font-family:var(--display);font-variation-settings:"SOFT" 100,"opsz" 24;font-weight:600;font-size:1.2rem;color:var(--tinta)}
footer .creditos{display:grid;gap:4px;justify-items:center;margin-top:10px;font-size:.78rem;color:var(--tinta-2);opacity:.72}
footer .creditos small{font-size:.72rem;max-width:72ch}
footer .creditos a{color:inherit;text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:2px}
footer .creditos a:hover{color:var(--morado)}
