/* Look carancho, en prueba. Se quita borrando este archivo, carancho.js y sus enlaces. */
:root{
  --linea:url(/img/carancho/linea.svg);
  --pincelada:url(/img/carancho/pincelada.svg);
  --mancha-1:url(/img/carancho/mancha-1.svg);
  --mancha-2:url(/img/carancho/mancha-2.svg);
  --papel:#eadfcb;
  --tinta:#151211;
  --rojo:#f82c00;
  --naranja:#a8520e;
  --marron:#3a1c10;
  --petroleo:#0a3440;
  --blanco:#f7f1e6;
  --trazo:#ff8a1f;
  --periodo:1800px;
}

/* Comunes a los dos temas */
.hero h1{font-size:clamp(3.84rem,10.4vw,12rem)}
.btn,.chip{border-radius:255px 18px 225px 18px/18px 225px 18px 255px}
.con-ola{position:relative;padding-top:0}
.ola{display:block;width:100%;height:clamp(96px,12vw,170px);margin-bottom:clamp(24px,4.5vw,56px);fill:var(--trazo);overflow:visible}
.ola-esquina{--alto:clamp(130px,30svh,340px);position:absolute;z-index:0;top:var(--bar);width:min(52vw,760px);height:var(--alto);fill:var(--trazo);pointer-events:none}
.ola-vertical{position:absolute;z-index:2;top:0;left:36vw;width:20vw;height:calc(100% + 120px);fill:var(--trazo);pointer-events:none;overflow:visible}
.ola-hero{position:absolute;z-index:2;left:0;right:0;width:100%;bottom:calc(100% - 22px);height:96px;fill:var(--trazo);pointer-events:none}
.ola-esquina.espejo{right:0;transform:scaleX(-1)}
.phead .wrap{position:relative;z-index:2}
.phead::before{display:none}
.flujo{display:none}
main h2::after,.trips.trayectoria h2::after,.trips.trayectoria main h2::after{height:.2em;min-height:12px;width:2.6em;margin-top:.2em;
  background:var(--trazo);-webkit-mask:var(--pincelada) left center/100% 100% no-repeat;mask:var(--pincelada) left center/100% 100% no-repeat}
.trips ul{border-top:0;border-image:none}
.trips li>a,.trips li .row{border-bottom:0;border-image:none}
.trips li>a::after,.trips li .row::after{content:"";position:absolute;left:0;right:0;bottom:0;height:10px;
  background:var(--h,var(--accent));opacity:.8;-webkit-mask:var(--linea) 0 0/var(--periodo) 100% repeat-x;mask:var(--linea) 0 0/var(--periodo) 100% repeat-x}
.trips li:nth-child(2n) .row::after,.trips li:nth-child(2n)>a::after{-webkit-mask-position:-640px 0;mask-position:-640px 0}

/* ===== Tema principal: papel ===== */
html[data-theme="light"]{
  --night:var(--papel);--on-night:var(--tinta);--on-night-soft:#51463e;
  --lamp:var(--rojo);--amber:var(--naranja);--ember:var(--rojo);--rose:var(--petroleo);
  --bg:var(--papel);--bg-2:var(--papel);--fg:var(--tinta);--fg-soft:#4a3f37;--line:rgba(21,18,17,.26);
  --accent:var(--rojo);--accent-text:#b82000;
  --flow:linear-gradient(var(--marron),var(--marron));
  --trazo:var(--marron);
  background:var(--papel);
}
html[data-theme="light"] body{background:var(--papel)}
/* Textura de papel sobre todo el impreso */
html[data-theme="light"] body::before{background:url(/img/carancho/papel.webp) 0 0/640px 640px;opacity:1;filter:none;mix-blend-mode:multiply}
html[data-theme="light"] .plates,html[data-theme="light"] .field,html[data-theme="light"] .contact,
html[data-theme="light"] .phead,html[data-theme="light"] .bar{--amber:var(--naranja);--ember:var(--rojo);--rose:var(--petroleo)}
/* sin degradados: todas las secciones planas, menos la portada */
html[data-theme="light"] main>section:not(.hero),html[data-theme="light"] .phead,html[data-theme="light"] .about .col,
html[data-theme="light"] .field,html[data-theme="light"] .plates,html[data-theme="light"] .contact{background:var(--papel);background-image:none}
html[data-theme="light"] .card::before,html[data-theme="light"] .contact::before{display:none}
html[data-theme="light"]::after{background:var(--rojo)!important}
html[data-theme="light"] .bar{background:var(--papel);-webkit-backdrop-filter:none;backdrop-filter:none;color:var(--tinta)}
html[data-theme="light"] .bar::after{background:var(--tinta);height:2px;animation:none}
html[data-theme="light"] .bar .lang{border-color:var(--tinta);color:var(--tinta)}
html[data-theme="light"] .bar .lang:hover{background:var(--tinta);color:var(--papel)}
html[data-theme="light"] main h2::after{background:var(--rojo)}
html[data-theme="light"] .trips li>a:hover,html[data-theme="light"] .trips.trayectoria li>a:hover{background:color-mix(in srgb,var(--h,var(--accent)) 9%,transparent)}
html[data-theme="light"] .btn{border-color:var(--tinta);color:var(--tinta)}
html[data-theme="light"] .btn.solid{background:var(--rojo);border-color:var(--rojo);color:var(--tinta)}
html[data-theme="light"] .btn:hover,html[data-theme="light"] .btn.solid:hover{background:var(--petroleo);border-color:var(--petroleo);color:#f6efe2}
html[data-theme="light"] .chip.on{background:var(--rojo);border-color:var(--rojo);color:var(--tinta)}
html[data-theme="light"] ::selection{background:var(--rojo);color:var(--tinta)}
html[data-theme="light"] .social a{border-color:rgba(21,18,17,.5)}
html[data-theme="light"] .social a:hover,html[data-theme="light"] .social a:focus-visible{color:var(--tinta)}
html[data-theme="light"] footer{border-top-color:var(--line)}
html[data-theme="light"] .contact .ola{fill:var(--marron)}
html[data-theme="light"] .novedades .ola{fill:var(--petroleo)}
html[data-theme="light"] .ola-esquina.espejo{fill:var(--rojo)}
/* líneas a mano también en tarjetas y destacados */
html[data-theme="light"] .cards{border:0;border-image:none}
html[data-theme="light"] .card,html[data-theme="light"] .hlc,html[data-theme="light"] .counters div{border:0;border-image:none;
  background:url(/img/carancho/linea.svg) 0 0/var(--periodo) 10px repeat-x}
/* lo que va sobre una foto sigue claro */

/* Portada: negra, nombre naranja y ondas blancas */
html[data-theme="light"] .hero{position:relative;z-index:6;overflow-x:clip;overflow-y:visible;--night:#010206;--on-night:#f7f1e6;--on-night-soft:#c9bdb0;background:#010206;color:#f7f1e6}
html[data-theme="light"] .hero::before{background:linear-gradient(to top,#010206 0,rgba(1,2,6,.6) 14%,rgba(1,2,6,0) 38%)}
html[data-theme="light"] .hero h1{color:var(--rojo)}
html[data-theme="light"] .hero .btn{border-color:var(--rojo);color:var(--rojo)}
html[data-theme="light"] .hero .btn.solid{background:var(--rojo);border-color:var(--rojo);color:#010206}
html[data-theme="light"] .hero .btn:hover{background:var(--blanco);border-color:var(--blanco);color:#010206}
html[data-theme="light"] .hero .facts::before{background:var(--blanco)}
html[data-theme="light"] .ola-vertical,html[data-theme="light"] .ola-hero{fill:var(--blanco)}

/* Bordes que fluyen entre bloques */
html[data-theme="light"] .con-flujo{position:relative}
html[data-theme="light"] .flujo{display:block;position:absolute;z-index:5;left:0;top:-1px;width:100%;height:clamp(64px,8vw,110px);pointer-events:none}
html[data-theme="light"] .flujo-negro{fill:#010206}
html[data-theme="light"] .flujo-papel{fill:var(--papel)}
html[data-theme="light"] .flujo-naranja{fill:var(--rojo)}

/* Trayectoria: bloque naranja plano, con texto oscuro */
html[data-theme="light"] .trips.trayectoria{--fg:var(--tinta);--fg-soft:var(--tinta);--line:rgba(21,18,17,.4);--accent:var(--tinta);--accent-text:var(--tinta);--h:var(--tinta);
  --flow:linear-gradient(var(--tinta),var(--tinta));--trazo:var(--tinta);background:var(--rojo);background-image:none;animation:none;color:var(--tinta);
  padding-top:calc(clamp(64px,8vw,110px) + clamp(40px,6vw,80px))}
html[data-theme="light"] .trips.trayectoria h2::after{background:var(--tinta)}
html[data-theme="light"] .trips.trayectoria li:nth-child(n){--h:var(--tinta)}
html[data-theme="light"] .trips.trayectoria .what a,html[data-theme="light"] .trips.trayectoria .name a{text-decoration-color:var(--tinta)}
html[data-theme="light"] .trips.trayectoria+section{padding-top:calc(clamp(64px,8vw,110px) + clamp(40px,6vw,80px))}

/* Expediciones: bloque petróleo plano */
html[data-theme="light"] #viajes{--fg:#f7f1e6;--fg-soft:#eadfd6;--line:rgba(247,241,230,.35);--accent:#f7f1e6;--accent-text:#f7f1e6;--h:#f7f1e6;--amber:#f7f1e6;--ember:#f7f1e6;--rose:#f7f1e6;--trazo:#f7f1e6;
  background:var(--petroleo);background-image:none;color:#f7f1e6}
html[data-theme="light"] #viajes h2::after{background:var(--rojo)}
html[data-theme="light"] #viajes li:nth-child(n){--h:#f7f1e6}
html[data-theme="light"] #viajes a{text-decoration-color:var(--rojo)}
html[data-theme="light"] .contact.con-flujo{padding-top:calc(clamp(64px,8vw,110px) + 24px)}
html[data-theme="light"] .flujo-petroleo{fill:var(--petroleo)}

/* Proyectos: bloque negro */
html[data-theme="light"] .projects{--fg:#f7f1e6;--fg-soft:#d8cdbf;--line:rgba(247,241,230,.35);--accent:var(--rojo);--accent-text:var(--rojo);--h:var(--rojo);--amber:var(--rojo);--ember:var(--rojo);--rose:var(--rojo);
  background:#010206;background-image:none;color:#f7f1e6;padding-top:calc(clamp(64px,8vw,110px) + 24px)}
html[data-theme="light"] main>section.projects:not(.hero){background:#010206;background-image:none}
html[data-theme="light"] .projects .ola{fill:var(--blanco)}
html[data-theme="light"] .projects .card{--h:var(--rojo);background:none;border-top:1px solid rgba(247,241,230,.3)}
html[data-theme="light"] .projects .card h3,html[data-theme="light"] .projects h2{color:#f7f1e6}
/* Azul de acento en lo claro */
html[data-theme="light"] .about h2::after,html[data-theme="light"] .novedades h2::after{background:var(--petroleo)}
html[data-theme="light"] .about .links a{text-decoration-color:var(--petroleo)}
html[data-theme="light"] .novedades{--accent:var(--petroleo);--accent-text:var(--petroleo);--flow:linear-gradient(var(--petroleo),var(--petroleo));padding-top:calc(clamp(64px,8vw,110px) + 24px)}
html[data-theme="light"] .novedades li:nth-child(n){--h:var(--petroleo)}
html[data-theme="light"] .novedades .name a,html[data-theme="light"] .novedades .what a{text-decoration-color:var(--petroleo)}

/* Fotos con forma irregular. Tono unificado solo donde no importa el color exacto de una especie */
html[data-theme="light"] .about figure img,html[data-theme="light"] .fotos img{filter:saturate(.8) sepia(.14) contrast(1.05)}
.about figure img,.fotos img{-webkit-mask:var(--mancha-1) center/100% 100% no-repeat;mask:var(--mancha-1) center/100% 100% no-repeat}
.fotos figure:nth-child(2n) img{-webkit-mask-image:var(--mancha-2);mask-image:var(--mancha-2)}
.about figure{position:sticky;top:calc(var(--bar) + 16px);height:calc(100svh - var(--bar) - 32px);display:flex;flex-direction:column;overflow:visible;background:none;padding:0 0 0 clamp(16px,3vw,48px)}
.about figure::after{display:none}
.about figure img{flex:1 1 0;min-height:0}
.about figcaption,.fotos figcaption{position:static;margin:.3rem 0 0;text-align:center;color:var(--fg-soft)}

/* Interruptores: tema (I encendido, O apagado) e idioma */
.bar nav #themeBtn,.bar nav a.lang{position:relative;display:inline-block;flex:0 0 auto;width:48px;height:24px;padding:0;border:1px solid currentColor;border-radius:999px;background:none;cursor:pointer;color:var(--fg);box-shadow:none;transition:opacity .2s}
.bar nav #themeBtn{margin-left:clamp(10px,2.4vw,34px)}
.bar nav a.lang{margin-left:clamp(-20px,-1.4vw,-6px)}
.bar nav #themeBtn::before,.bar nav a.lang::before{content:"";position:absolute;z-index:0;top:2px;left:2px;width:21px;height:18px;border-radius:999px;background:var(--fg);transition:transform .22s cubic-bezier(.3,.8,.3,1)}
.bar nav #themeBtn::before{display:grid;place-items:center;font:700 .64rem/1 var(--ui);color:var(--bg)}
.bar nav #themeBtn::after{position:absolute;top:50%;transform:translate(-50%,-50%);font:600 .64rem/1 var(--ui);opacity:.6}
html[data-theme="light"] .bar nav #themeBtn::before{content:"I";transform:translateX(21px)}
html[data-theme="light"] .bar nav #themeBtn::after{content:"O";left:12.5px}
html[data-theme="dark"] .bar nav #themeBtn::before{content:"O"}
html[data-theme="dark"] .bar nav #themeBtn::after{content:"I";left:33.5px}
html[lang="en"] .bar nav a.lang::before{transform:translateX(21px)}
.bar .op{position:absolute;z-index:1;top:50%;width:21px;transform:translateY(-50%);text-align:center;font:600 .6rem/1 var(--ui);font-stretch:100%;letter-spacing:0;opacity:.6}
.bar .op.es{left:2px}
.bar .op.en{right:2px}
html[lang="es"] .bar .op.es,html[lang="en"] .bar .op.en{color:var(--bg);font-weight:700;opacity:1}
html[data-theme] .bar nav #themeBtn:hover,html[data-theme] .bar nav a.lang:hover{background:none;color:var(--fg);opacity:.75}
.bar nav #themeBtn:focus-visible,.bar nav a.lang:focus-visible{outline:2px solid currentColor;outline-offset:2px}
html[data-theme="dark"] .bar nav #themeBtn,html[data-theme="dark"] .bar nav a.lang{--fg:var(--v);border-color:var(--v)}
html[data-theme="dark"] .bar nav #themeBtn::before,html[data-theme="dark"] .bar nav a.lang::before{box-shadow:0 0 5px rgba(110,242,168,.4)}
@media (prefers-reduced-motion:reduce){.bar nav #themeBtn::before,.bar nav a.lang::before{transition:none}}
@media (max-width:820px){
  .bar nav #themeBtn{margin-left:0}
  .bar nav a.lang{margin-left:-10px;margin-right:12px}
}

/* Propósito y visión */
.rumbo{display:grid;gap:clamp(22px,3vw,34px);margin:clamp(30px,4vw,52px) 0;padding:clamp(28px,3.6vw,46px) clamp(26px,3.4vw,44px);border-radius:150px 26px 170px 30px/34px 150px 28px 170px}
.rumbo div{margin:0}
.rumbo dt{font-family:var(--ui);font-stretch:85%;font-weight:700;font-size:1rem;letter-spacing:.02em;margin-bottom:.45rem}
.rumbo dd{margin:0;font-family:var(--display);font-size:clamp(1.3rem,1.9vw,1.6rem);line-height:1.28}
html[data-theme="light"] .rumbo{background:var(--petroleo);color:var(--blanco)}
html[data-theme="light"] .rumbo dt{color:var(--blanco);opacity:.85}
html[data-theme="dark"] .rumbo{background:none;border:1.5px solid var(--v);box-shadow:0 0 10px rgba(110,242,168,.35),inset 0 0 12px rgba(110,242,168,.1)}
html[data-theme="dark"] .rumbo dt{color:var(--v)}

@media (max-width:820px){
  .rumbo{border-radius:90px 20px 100px 22px/24px 90px 22px 100px}
  .hero h1{font-size:clamp(3.5rem,19.2vw,7.2rem)}
  .ola{height:112px;margin-bottom:28px}
  html[data-theme="light"] .hero .wrap>div{position:relative;margin-inline:calc(var(--gutter)*-1);padding-inline:var(--gutter);padding-top:44px;background:#010206}
  html[data-theme="light"] .hero .wrap{padding-bottom:0}
  html[data-theme="light"] .hero{padding-bottom:0}
  html[data-theme="light"] .hero figcaption{top:26%}
  .ola-esquina{--alto:clamp(90px,15svh,170px);width:74vw}
  .about figure{position:relative;top:auto;height:72svh;padding:16px var(--gutter) 0}
}

/* ===== Tema oscuro: se apaga la luz. Negro grisáceo, blanco y verde agua que brilla ===== */
html[data-theme="dark"]{
  --v:#6ef2a8;--b:#edf4f0;
  /* casi negros: gris, verde, azul y petróleo */
  --n-gris:#0e1012;--n-noche:#060b12;--n-verde:#040e09;--n-azul:#050b18;--n-petroleo:#031113;--n-musgo:#07140e;
  --d1:var(--n-noche);--d2:var(--n-gris);
  --brillo-fuerte:0 0 8px rgba(110,242,168,.55),0 0 26px rgba(110,242,168,.28);
  --night:var(--d2);--on-night:var(--b);--on-night-soft:#a9c4b7;
  --lamp:var(--v);--amber:var(--v);--ember:var(--v);--rose:var(--v);
  --bg:var(--d1);--bg-2:var(--d1);--fg:var(--b);--fg-soft:#a9c4b7;--line:rgba(110,242,168,.24);
  --accent:var(--v);--accent-text:var(--v);--h:var(--v);--trazo:var(--v);
  --flow:linear-gradient(var(--v),var(--v));
  background:var(--d1)}
html[data-theme="dark"] body{background:var(--d1);color:var(--b)}
html[data-theme="dark"]::after{background:var(--v)!important;box-shadow:0 0 10px var(--v)}
html[data-theme="dark"] body::before{mix-blend-mode:normal;background-image:none;opacity:0}
html[data-theme="dark"] ::selection{background:var(--v);color:var(--d2)}
html[data-theme="dark"] a{text-decoration-color:var(--v)}
html[data-theme="dark"] main>section:not(.hero),html[data-theme="dark"] .phead,html[data-theme="dark"] .about .col,html[data-theme="dark"] .field,html[data-theme="dark"] .plates,html[data-theme="dark"] .contact{background:var(--d1);background-image:none;animation:none}
html[data-theme="dark"] main>section.projects:not(.hero){background:var(--n-verde)}
html[data-theme="dark"] main>section.novedades:not(.hero),html[data-theme="dark"] .phead,html[data-theme="dark"] main>section.tline:not(.hero){background:var(--n-azul)}
html[data-theme="dark"] main>section.trayectoria:not(.hero){background:var(--n-petroleo)}
html[data-theme="dark"] main>section.contact:not(.hero){background:var(--d2)}
html[data-theme="dark"] .bar{background:var(--d2);-webkit-backdrop-filter:none;backdrop-filter:none;color:var(--b)}
html[data-theme="dark"] .bar::after{background:var(--v);height:1px;animation:none;box-shadow:0 0 8px var(--v)}
html[data-theme="dark"] .bar .lang{border-color:var(--v);color:var(--v)}
html[data-theme="dark"] .bar .lang:hover{background:var(--v);color:var(--d2)}
html[data-theme="dark"] main h2,html[data-theme="dark"] main h1,html[data-theme="dark"] main h3{color:var(--b)}
html[data-theme="dark"] main h2::after{background:var(--v);filter:drop-shadow(0 0 5px var(--v))}
html[data-theme="dark"] .btn{border-color:var(--v);color:var(--v);box-shadow:0 0 10px rgba(110,242,168,.25),inset 0 0 8px rgba(110,242,168,.1)}
html[data-theme="dark"] .btn.solid{background:var(--v);border-color:var(--v);color:var(--d2);box-shadow:var(--brillo-fuerte)}
html[data-theme="dark"] .btn:hover,html[data-theme="dark"] .btn.solid:hover{background:var(--b);border-color:var(--b);color:var(--d2);box-shadow:var(--brillo-fuerte)}
html[data-theme="dark"] .chip{border-color:var(--line);color:var(--b)}
html[data-theme="dark"] .chip.on{background:var(--v);border-color:var(--v);color:var(--d2);box-shadow:0 0 12px rgba(110,242,168,.55)}
html[data-theme="dark"] .social a{border-color:var(--line);color:var(--v)}
html[data-theme="dark"] .social a:hover,html[data-theme="dark"] .social a:focus-visible{background:var(--v);border-color:var(--v);color:var(--d2)}
html[data-theme="dark"] footer{border-top-color:var(--line)}
html[data-theme="dark"] .cards{border:0;border-image:none}
html[data-theme="dark"] .card,html[data-theme="dark"] .hlc,html[data-theme="dark"] .counters div{border:0;border-image:none;background:none;border-top:1px solid var(--line)}
html[data-theme="dark"] .card::before,html[data-theme="dark"] .contact::before{display:none}
/* Ondas y líneas que brillan */
html[data-theme="dark"] .ola,html[data-theme="dark"] .ola-esquina,html[data-theme="dark"] .ola-vertical,html[data-theme="dark"] .ola-hero{fill:var(--v);filter:drop-shadow(0 0 6px rgba(110,242,168,.6))}
html[data-theme="dark"] .trips li>a::after,html[data-theme="dark"] .trips li .row::after{box-shadow:none;filter:drop-shadow(0 0 3px var(--v))}
/* Portada */
html[data-theme="dark"] .hero{position:relative;z-index:6;overflow-x:clip;overflow-y:visible;background:var(--d2);color:var(--b)}
html[data-theme="dark"] .hero::before{background:linear-gradient(to top,var(--d2) 0,rgba(14,16,18,.6) 14%,rgba(14,16,18,0) 38%)}
html[data-theme="dark"] .hero h1{color:var(--v)}
html[data-theme="dark"] .hero .facts::before{background:var(--b)}
/* Fotos: sin color cálido, en la misma luz */
html[data-theme="dark"] .hero img,html[data-theme="dark"] .about figure img,html[data-theme="dark"] .fotos img{filter:grayscale(1) contrast(1.08) brightness(.94)!important}
html[data-theme="dark"] .about figure,html[data-theme="dark"] .fotos figure{background:none;filter:drop-shadow(0 0 14px rgba(110,242,168,.32))}
html[data-theme="dark"] .about figcaption,html[data-theme="dark"] .fotos figcaption{color:var(--fg-soft)}
/* Bordes que fluyen: una línea de luz */
html[data-theme="dark"] .con-flujo{position:relative}
html[data-theme="dark"] .flujo{display:block;position:absolute;z-index:5;left:0;top:-1px;width:100%;height:clamp(64px,8vw,110px);pointer-events:none;overflow:visible}
.flujo-luz{display:none}
html[data-theme="dark"] .flujo-luz{display:block;fill:none;stroke:var(--v);stroke-width:2;vector-effect:non-scaling-stroke;filter:drop-shadow(0 0 6px rgba(110,242,168,.8))}
html[data-theme="dark"] .about .flujo-negro{fill:var(--d2)}
html[data-theme="dark"] .projects .flujo-papel{fill:var(--n-noche)}
html[data-theme="dark"] .novedades .flujo-negro{fill:var(--n-verde)}
html[data-theme="dark"] .trayectoria .flujo-papel{fill:var(--n-azul)}
html[data-theme="dark"] #viajes .flujo-naranja{fill:var(--n-petroleo)}
html[data-theme="dark"] .contact .flujo-petroleo{fill:var(--n-musgo)}
html[data-theme="dark"] .projects,html[data-theme="dark"] .novedades,html[data-theme="dark"] .contact.con-flujo{padding-top:calc(clamp(64px,8vw,110px) + 24px)}
html[data-theme="dark"] .trips.trayectoria,html[data-theme="dark"] .trips.trayectoria+section{padding-top:calc(clamp(64px,8vw,110px) + clamp(40px,6vw,80px))}
/* Restos cálidos de la hoja base */
html[data-theme="dark"] .hero,html[data-theme="dark"] .plates,html[data-theme="dark"] .field,html[data-theme="dark"] .contact,html[data-theme="dark"] .phead,html[data-theme="dark"] .bar,html[data-theme="dark"] #viajes{--amber:var(--v);--ember:var(--v);--rose:var(--v)}
html[data-theme="dark"] .trips,html[data-theme="dark"] .trips#viajes,html[data-theme="dark"] .trips.trayectoria{--fg:var(--b);--fg-soft:#a9c4b7;--line:rgba(110,242,168,.24);--accent:var(--v);--accent-text:var(--v);color:var(--b)}
html[data-theme="dark"] .trips li:nth-child(n),html[data-theme="dark"] .trips#viajes li:nth-child(n),html[data-theme="dark"] .cards .card:nth-child(n){--h:var(--v)}
html[data-theme="dark"] .trips li>a:hover{background:rgba(110,242,168,.08)}
html[data-theme="dark"] .plate button{background:var(--d2)}
html[data-theme="dark"] .plate .sci{border-bottom-color:var(--v)}
html[data-theme="dark"] .contact::before,html[data-theme="dark"] .phead::before{display:none}
html[data-theme="dark"] .trips.trayectoria .what a,html[data-theme="dark"] .trips.trayectoria .name a,html[data-theme="dark"] .trips .what a,html[data-theme="dark"] .trips .name a{text-decoration-color:var(--v)}
.about{overflow-x:clip}
html[data-theme="dark"] .trips#viajes{background:var(--n-musgo);background-image:none}
/* Apagón: primero se ven las formas, con el brillo cargado, que baja hasta quedar leve. Después llega lo demás */
html.encendiendo main p,html.encendiendo main h1,html.encendiendo main h2,html.encendiendo main h3,html.encendiendo main li,html.encendiendo main figure,html.encendiendo main .btn,html.encendiendo main .links,html.encendiendo main .chips,html.encendiendo .bar .wrap{animation:aparece 1.3s .9s both!important}
html.encendiendo .ola,html.encendiendo .ola-vertical,html.encendiendo .ola-hero,html.encendiendo .ola-esquina,html.encendiendo .flujo-luz{animation:carga 2.6s ease-out both}
@keyframes aparece{from{opacity:0}to{opacity:1}}
@keyframes carga{from{filter:drop-shadow(0 0 16px rgba(110,242,168,1))}to{filter:drop-shadow(0 0 6px rgba(110,242,168,.6))}}
/* Telón de apagón */
.apagon{position:fixed;inset:0;z-index:9999;background:#000;opacity:0;pointer-events:none}
@media (max-width:820px){
  html[data-theme="dark"] .hero .wrap>div{position:relative;margin-inline:calc(var(--gutter)*-1);padding-inline:var(--gutter);padding-top:44px;background:var(--d2)}
  html[data-theme="dark"] .hero .wrap,html[data-theme="dark"] .hero{padding-bottom:0}
  html[data-theme="dark"] .hero figcaption{top:26%}
}
@media (prefers-reduced-motion:reduce){.apagon{display:none}html.encendiendo *{animation:none!important}}
