/* IKIGAI Women — hoja de estilos del sitio.
   Las rutas de imagen son relativas a esta carpeta: ../img/ */

/* ============================================================
   IKIGAI Women — sistema de diseño
   Verde musgo #546038 y crema #E4D6A7 tomados del logo real.
   ============================================================ */
:root{
  --ground:   #EDEEE7;   /* piedra: musgo desaturado, no beige */
  --ground-2: #E3E5DA;
  --ink:      #20241A;
  --ink-2:    #5A6049;
  --band:     #546038;   /* verde del logo */
  --band-ink: #F1EFE4;
  --band-ink-2:#C2C9A9;
  --deep:     #2F3722;
  --cream:    #E4D6A7;   /* crema del logo */
  --marea:    #3E5A63;   /* petróleo: el "azul océano" de la marca */
  --marea-ink:#3E5A63;
  --brand-ink:#546038;   /* marca sobre fondo claro */
  --line:     rgba(32,36,26,.14);
  --line-2:   rgba(32,36,26,.07);
  --shadow:   0 1px 2px rgba(32,36,26,.05), 0 12px 34px -18px rgba(32,36,26,.28);

  --f-display:'Fraunces', 'Hoefler Text', Georgia, serif;
  --f-body:'Karla', 'Helvetica Neue', Helvetica, Arial, sans-serif;
  --f-util:'Jost', 'Futura', 'Avenir Next', Helvetica, Arial, sans-serif;

  --ease: cubic-bezier(.21,.6,.35,1);
  --ease-out: cubic-bezier(.16,.84,.28,1);
  --gut: clamp(20px, 5vw, 76px);
  --maxw: 1320px;
}
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]){
    --ground:#23291B; --ground-2:#2B3122; --ink:#E9E9DD; --ink-2:#A7AF93;
    --band:#3B4527; --band-ink:#EFEDE1; --band-ink-2:#B4BC9A; --deep:#181D11;
    --marea:#8FAEB6; --marea-ink:#8FAEB6; --brand-ink:#E4D6A7;
    --line:rgba(233,233,221,.17); --line-2:rgba(233,233,221,.08);
    --shadow:0 1px 2px rgba(0,0,0,.3), 0 14px 40px -18px rgba(0,0,0,.6);
  }
}
:root[data-theme="dark"]{
  --ground:#23291B; --ground-2:#2B3122; --ink:#E9E9DD; --ink-2:#A7AF93;
  --band:#3B4527; --band-ink:#EFEDE1; --band-ink-2:#B4BC9A; --deep:#181D11;
  --marea:#8FAEB6; --marea-ink:#8FAEB6; --brand-ink:#E4D6A7;
  --line:rgba(233,233,221,.17); --line-2:rgba(233,233,221,.08);
  --shadow:0 1px 2px rgba(0,0,0,.3), 0 14px 40px -18px rgba(0,0,0,.6);
}

*{box-sizing:border-box}
[hidden]{display:none!important}   /* gana sobre display:flex de .ann */
html{scroll-behavior:smooth}
body{
  margin:0; background:var(--ground); color:var(--ink);
  font-family:var(--f-body); font-size:16.5px; line-height:1.62;
  -webkit-font-smoothing:antialiased; overflow-x:hidden;
}
img{display:block; max-width:100%}
figure{margin:0}
a{color:inherit}
::selection{background:var(--cream); color:#20241A}
:focus-visible{outline:2px solid var(--marea); outline-offset:3px; border-radius:2px}

/* ---------- tipografía ---------- */
.u{ font-family:var(--f-util); text-transform:uppercase; letter-spacing:.22em;
    font-size:11px; font-weight:400; }
h1,h2,h3,.d{
  font-family:var(--f-display); font-weight:300;
  letter-spacing:-.018em; line-height:1.02; text-wrap:balance; margin:0;
  font-variation-settings:"SOFT" 42,"WONK" 1,"opsz" 120;
}
h1{ font-size:clamp(2.9rem, 8.2vw, 6.6rem); }
h2{ font-size:clamp(2.2rem, 5.4vw, 4.1rem); }
h3{ font-size:clamp(1.35rem, 2.1vw, 1.85rem); line-height:1.1; }
p{margin:0 0 1.05em}
.lede{ font-size:clamp(1.06rem,1.55vw,1.28rem); line-height:1.55; color:var(--ink-2); max-width:60ch; }
.meas{max-width:63ch}

/* ---------- layout ---------- */
.wrap{ max-width:var(--maxw); margin-inline:auto; padding-inline:var(--gut); }
section{ position:relative; }
.pad{ padding-block:clamp(72px,10vw,148px); }
.band{ background:var(--band); color:var(--band-ink); }
.band .lede,.band .u{ color:var(--band-ink-2); }
.rule{ height:1px; background:var(--line); border:0; margin:0; }

.eyebrow{ display:flex; align-items:center; gap:14px; margin-bottom:26px; color:var(--ink-2); }
.eyebrow::after{ content:""; flex:1; height:1px; background:var(--line); }
.band .eyebrow::after{ background:rgba(241,239,228,.22); }

/* ---------- logo (máscara del logo real, tintable) ---------- */
.logo{ display:block; background:currentColor;
  -webkit-mask:var(--logo) center/contain no-repeat; mask:var(--logo) center/contain no-repeat; }
.mark{ display:block; background:currentColor;
  -webkit-mask:var(--mark) center/contain no-repeat; mask:var(--mark) center/contain no-repeat; }

/* ---------- barra de anuncio ---------- */
.ann{ background:var(--deep); color:var(--band-ink); position:relative; z-index:60;
      display:flex; align-items:center; justify-content:center; gap:16px;
      padding:9px 46px 9px 20px; text-align:center; }
.ann .u{ color:var(--cream); }
.ann a{ text-decoration:none; border-bottom:1px solid rgba(228,214,167,.45); padding-bottom:1px; }
.ann a:hover{ border-bottom-color:var(--cream); }
.ann-x{ position:absolute; right:12px; top:50%; translate:0 -50%; background:none; border:0;
        color:inherit; opacity:.55; cursor:pointer; font-size:17px; line-height:1; padding:6px; }
.ann-x:hover{opacity:1}
body.ann-off .ann{display:none}

/* ---------- navegación ---------- */
.nav{ position:sticky; top:0; z-index:50; transition:background .5s var(--ease), border-color .5s var(--ease); border-bottom:1px solid transparent; }
.nav-in{ max-width:var(--maxw); margin-inline:auto; padding:14px var(--gut);
         display:flex; align-items:center; gap:clamp(14px,3vw,42px); }
.nav .logo{ width:112px; height:96px; color:var(--band-ink); transition:color .5s var(--ease), width .5s var(--ease), height .5s var(--ease); flex:none; }
.nav-links{ display:flex; gap:clamp(12px,1.9vw,30px); margin-left:auto; align-items:center; }
.nav a.nl{ text-decoration:none; color:var(--band-ink); position:relative; padding:6px 0;
           font-family:var(--f-util); text-transform:uppercase; letter-spacing:.17em; font-size:11px;
           transition:color .5s var(--ease); }
.nav a.nl::after{ content:""; position:absolute; left:0; bottom:0; height:1px; width:100%;
                  background:currentColor; scale:0 1; transform-origin:left; transition:scale .45s var(--ease); }
.nav a.nl:hover::after,.nav a.nl.on::after{ scale:1 1; }
.nav.solid{ background:color-mix(in srgb, var(--ground) 88%, transparent); backdrop-filter:blur(14px) saturate(1.2);
            border-bottom-color:var(--line); }
.nav.solid .logo{ color:var(--brand-ink); width:76px; height:65px; }
.nav.solid a.nl{ color:var(--ink); }

.btn{ display:inline-flex; align-items:center; gap:10px; border:1px solid currentColor; border-radius:999px;
      padding:13px 24px; text-decoration:none; cursor:pointer; background:none; color:inherit;
      font-family:var(--f-util); text-transform:uppercase; letter-spacing:.15em; font-size:11px;
      position:relative; overflow:hidden; isolation:isolate; transition:color .45s var(--ease); }
.btn::before{ content:""; position:absolute; inset:0; background:currentColor; z-index:-1;
              scale:1 0; transform-origin:bottom; transition:scale .45s var(--ease); }
.btn:hover::before{ scale:1 1; transform-origin:top; }
.btn.fill{ background:var(--band); color:var(--band-ink); border-color:var(--band); }
.btn.fill::before{ background:var(--cream); }
.btn.fill:hover{ color:var(--deep); }
.btn.cream{ background:var(--cream); border-color:var(--cream); color:#2F3722; }
.btn.cream::before{ background:var(--band-ink); }
.btn.ghost:hover{ color:var(--ground); }
.band .btn.ghost:hover{ color:var(--band); }
.nav .btn{ padding:11px 20px; }

.burger{ display:none; margin-left:auto; background:none; border:0; cursor:pointer; padding:10px; color:var(--band-ink); transition:color .5s var(--ease); }
.nav.solid .burger{ color:var(--ink); }
.burger span{ display:block; width:24px; height:1.5px; background:currentColor; margin:5px 0; transition:transform .4s var(--ease), opacity .3s; }
.menu{ position:fixed; inset:0; background:var(--band); z-index:55; display:flex; flex-direction:column;
       justify-content:center; padding:var(--gut); gap:6px; clip-path:inset(0 0 100% 0); transition:clip-path .7s var(--ease); }
.menu.open{ clip-path:inset(0 0 0 0); }
.menu a{ font-family:var(--f-display); text-transform:lowercase; font-size:clamp(2rem,7vw,3.4rem);
         color:var(--band-ink); text-decoration:none; font-weight:300; line-height:1.16;
         opacity:0; translate:0 22px; transition:opacity .5s var(--ease), translate .5s var(--ease), color .3s; }
.menu.open a{ opacity:1; translate:0 0; }
.menu a:hover{ color:var(--cream); }
.menu-x{ position:absolute; top:22px; right:calc(var(--gut) - 8px); background:none; border:0; color:var(--band-ink);
         font-size:30px; cursor:pointer; line-height:1; padding:8px; }

/* ---------- hero ---------- */
.hero{ position:relative; min-height:min(94vh,900px); display:flex; align-items:flex-end;
       margin-top:calc(-1 * var(--nav-h,110px)); padding-top:var(--nav-h,110px); overflow:hidden; background:var(--deep); }
.hero .hero-img{ position:absolute; inset:0; z-index:1; }
.hero .hero-scrim{ z-index:1; }
.hero-img img{ width:100%; height:100%; object-fit:cover; scale:1.08; opacity:0;
               animation:heroIn 2.4s var(--ease-out) .15s forwards, drift 26s ease-in-out 2.6s infinite alternate; }
@keyframes heroIn{ to{ opacity:1; scale:1.01 } }
@keyframes drift{ to{ scale:1.07; translate:-1.2% 0 } }
.hero-scrim{ position:absolute; inset:0;
  background:linear-gradient(100deg, rgba(41,48,28,.92) 0%, rgba(41,48,28,.74) 32%, rgba(41,48,28,.2) 66%, rgba(41,48,28,.42) 100%),
             linear-gradient(to top, rgba(41,48,28,.7), transparent 52%); }
.hero-body{ position:relative; z-index:2; width:100%; padding-block:clamp(46px,7vw,92px); color:#F1EFE4; }
.hero h1{ color:#F5F2E6; max-width:15ch; }
.hero .lede{ color:rgba(243,241,231,.94); margin-top:22px; max-width:44ch; }
.hero .u{ color:var(--cream); }
.hero-cta{ display:flex; flex-wrap:wrap; gap:12px; margin-top:38px; }
.hero-foot{ display:flex; flex-wrap:wrap; align-items:center; gap:12px 26px; margin-top:clamp(34px,5vw,64px);
            padding-top:20px; border-top:1px solid rgba(241,239,228,.28); color:rgba(241,239,228,.85); }

/* reveal de titular por líneas */
.rl{ display:block; overflow:hidden; }
.rl > span{ display:block; translate:0 105%; transition:translate 1.05s var(--ease-out); }
.ready .rl > span{ translate:0 0; }
.ready .rl:nth-child(2) > span{ transition-delay:.1s }
.ready .rl:nth-child(3) > span{ transition-delay:.2s }
.fade{ opacity:0; translate:0 14px; transition:opacity .9s var(--ease), translate .9s var(--ease); }
.ready .fade{ opacity:1; translate:0 0; }
.ready .fade.d1{transition-delay:.42s} .ready .fade.d2{transition-delay:.54s} .ready .fade.d3{transition-delay:.66s}

.scroll-cue{ position:absolute; right:var(--gut); bottom:clamp(46px,7vw,92px); z-index:3;
             width:60px; height:60px; border:1px solid rgba(241,239,228,.35); border-radius:50%;
             display:grid; place-items:center; color:#F1EFE4; text-decoration:none; }
.scroll-cue::after{ content:""; width:1px; height:15px; background:currentColor;
                    animation:cue 1.9s var(--ease) infinite; }
@keyframes cue{ 0%,100%{ translate:0 -4px; opacity:.3 } 50%{ translate:0 5px; opacity:1 } }
@media (max-width:760px){ .scroll-cue{display:none} }

/* ---------- marquee de vocabulario ---------- */
.mq{ background:var(--band); color:var(--band-ink); padding:15px 0; overflow:hidden;
     border-block:1px solid rgba(241,239,228,.14); }
.mq-t{ display:flex; width:max-content; animation:mq 46s linear infinite; }
.mq:hover .mq-t{ animation-play-state:paused; }
.mq-t span{ font-family:var(--f-display); text-transform:lowercase; font-size:clamp(1.1rem,2vw,1.6rem);
            font-weight:300; padding-inline:.6em; white-space:nowrap; }
.mq-t i{ font-style:normal; color:var(--cream); padding-inline:.1em; }
@keyframes mq{ to{ translate:-50% 0 } }

/* ---------- manifiesto ---------- */
.man{ display:grid; grid-template-columns:1.05fr .95fr; gap:clamp(28px,5vw,88px); align-items:start; }
.man-imgs{ position:relative; }
.man-imgs .fig-a img{ aspect-ratio:4/5; object-fit:cover; width:100%; }
.man-imgs .fig-b{ position:absolute; right:-8%; bottom:-13%; width:47%; box-shadow:var(--shadow); }
.man-imgs .fig-b img{ aspect-ratio:1; object-fit:cover; width:100%; }
.pull{ font-family:var(--f-display); font-weight:300; line-height:1.08;
       font-size:clamp(1.75rem,3.3vw,2.75rem); letter-spacing:-.02em; margin:0 0 30px; }
.pull em{ font-style:normal; color:var(--brand-ink); }
.sig{ margin-top:32px; padding-top:18px; border-top:1px solid var(--line); color:var(--ink-2); }

/* ---------- grilla de experiencias ---------- */
.exp{ display:grid; grid-template-columns:repeat(2,1fr); gap:clamp(14px,2.2vw,30px); }
.card-x{ position:relative; display:block; text-decoration:none; color:inherit; overflow:hidden; }
.card-x .ph{ overflow:hidden; }
.card-x .ph img{ width:100%; aspect-ratio:4/3; object-fit:cover; transition:scale 1.1s var(--ease); }
.card-x:hover .ph img{ scale:1.05 }
.card-x h3{ margin-top:18px; }
.card-x .u{ color:var(--ink-2); margin-top:9px; display:block }
.card-x .bar{ height:1px; background:var(--line); margin-top:16px; position:relative; }
.card-x .bar::after{ content:""; position:absolute; inset:0; background:var(--band); scale:0 1;
                     transform-origin:left; transition:scale .6s var(--ease); }
.card-x:hover .bar::after{ scale:1 1; }

/* ---------- agenda ---------- */
.ag{ display:grid; grid-template-columns:repeat(3,1fr); gap:clamp(14px,2vw,26px); }
.ev{ background:color-mix(in srgb, var(--band-ink) 7%, transparent); border:1px solid rgba(241,239,228,.16);
     display:flex; flex-direction:column; overflow:hidden; }
.ev .ph{ overflow:hidden; }
.ev .ph img{ width:100%; aspect-ratio:4/3; object-fit:cover; transition:scale 1.1s var(--ease); }
.ev:hover .ph img{ scale:1.045 }
.ev-b{ padding:24px 22px 22px; display:flex; flex-direction:column; flex:1; gap:14px; }
.ev h3{ color:var(--band-ink); }
.ev .who{ color:var(--cream); font-size:.92rem; }
.dl{ list-style:none; margin:0; padding:0; display:grid; gap:7px; font-size:.9rem; color:var(--band-ink-2); }
.dl li{ display:flex; gap:12px; }
.dl b{ font-family:var(--f-util); text-transform:uppercase; letter-spacing:.14em; font-size:10px;
       font-weight:400; color:rgba(241,239,228,.5); flex:none; width:62px; padding-top:3px; }
.dl span{ color:var(--band-ink); font-variant-numeric:tabular-nums; }

/* cupos: el dato que se repite en cada anuncio de IKIGAI, hecho forma */
.cupos{ margin-top:auto; padding-top:16px; border-top:1px solid rgba(241,239,228,.16); }
.dots{ display:flex; flex-wrap:wrap; gap:6px; margin-bottom:9px; }
.dots i{ width:11px; height:11px; border-radius:50%; border:1px solid var(--cream); display:block;
         scale:0; transition:scale .4s var(--ease); }
.dots i.taken{ background:var(--cream); }
.in-view .dots i{ scale:1; }
.cupos .u{ color:var(--cream); }

/* ---------- cifras ---------- */
.nums{ display:grid; grid-template-columns:repeat(4,1fr); gap:clamp(20px,3vw,40px); }
.num b{ display:block; font-family:var(--f-display); font-weight:300; font-size:clamp(2.6rem,5.2vw,4.4rem);
        line-height:.95; letter-spacing:-.03em; font-variant-numeric:tabular-nums; }
.num .u{ display:block; margin-top:12px; color:var(--ink-2); line-height:1.7 }
.num{ padding-top:20px; border-top:1px solid var(--line); }

/* ---------- galería (riel arrastrable) ---------- */
.rail{ display:flex; gap:clamp(12px,1.6vw,22px); overflow-x:auto; scroll-snap-type:x mandatory;
       padding-inline:var(--gut); scroll-padding-inline:var(--gut); padding-bottom:14px; cursor:grab;
       scrollbar-width:thin; scrollbar-color:var(--line) transparent; }
.rail.drag{ cursor:grabbing; scroll-snap-type:none; }
.rail::-webkit-scrollbar{ height:3px }
.rail::-webkit-scrollbar-thumb{ background:var(--line) }
.gi{ flex:none; width:min(74vw,336px); scroll-snap-align:start; display:flex; flex-direction:column; }
.gi.tall{ width:min(58vw,252px) }
.gi img{ width:100%; height:clamp(230px,26vw,336px); object-fit:cover; }
.gi figcaption{ margin-top:12px; display:flex; justify-content:space-between; gap:12px; align-items:baseline;
                border-top:1px solid var(--line); padding-top:10px; }
.gi figcaption b{ font-weight:500; font-size:.95rem }
.gi figcaption .u{ color:var(--ink-2); flex:none }
.gi .cred{ display:block; color:var(--ink-2); font-size:.8rem; margin-top:3px }

/* ---------- colaboradoras ---------- */
.co{ display:grid; grid-template-columns:repeat(6,1fr); gap:clamp(14px,2vw,28px); }
.co-i{ text-align:center; text-decoration:none; color:inherit; display:block }
.co-ph{ display:block; position:relative; border-radius:50%; overflow:hidden; aspect-ratio:1; }
.co-ph img{ width:100%; height:100%; object-fit:cover; filter:saturate(.55); transition:filter .6s var(--ease), scale 1s var(--ease); }
.co-i:hover .co-ph img{ filter:saturate(1); scale:1.06 }
.co-ph::after{ content:""; position:absolute; inset:0; border-radius:50%; border:1px solid var(--band);
               scale:.9; opacity:0; transition:scale .55s var(--ease), opacity .55s var(--ease); }
.co-i:hover .co-ph::after{ scale:1.06; opacity:1 }
.co-i b{ display:block; margin-top:15px; font-weight:500; font-size:.98rem }
.co-i .u{ display:block; margin-top:4px; color:var(--ink-2) }
.co-i .at{ display:block; margin-top:6px; color:var(--ink-2); font-size:.82rem;
           transition:color .4s var(--ease) }
.co-i:hover .at{ color:var(--marea) }

/* ---------- sede ---------- */
.sede{ display:grid; grid-template-columns:1fr 1fr; gap:clamp(24px,4vw,72px); align-items:center }
.sede img{ width:100%; aspect-ratio:4/3; object-fit:cover }

/* ---------- únete ---------- */
.join{ display:grid; grid-template-columns:1fr 1fr; gap:clamp(28px,5vw,80px); align-items:center }
.espera{ min-height:60px }
.marco-form{ background:var(--band-ink); border-radius:3px; overflow:hidden }
.marco-form iframe{ display:block; width:100%; border:0 }
.escape-form{ margin:12px 0 0; font-size:.86rem; color:var(--band-ink-2) }
.escape-form a{ color:var(--cream) }
.espera-aviso{ border-left:3px solid var(--cream); padding:16px 20px;
               background:rgba(228,214,167,.1) }
.espera-aviso p{ margin:0 }
.espera-aviso p + p{ margin-top:8px }
.espera-aviso a{ color:var(--cream) }

/* ---------- footer ---------- */
.ft{ background:var(--deep); color:var(--band-ink); }
.ft-top{ display:grid; grid-template-columns:1.2fr 1fr 1fr 1fr; gap:clamp(24px,4vw,56px); }
.ft .logo{ width:150px; height:129px; color:var(--cream) }
.ft h4{ font-family:var(--f-util); text-transform:uppercase; letter-spacing:.2em; font-size:11px;
        font-weight:400; color:rgba(241,239,228,.5); margin:0 0 16px }
.ft ul{ list-style:none; margin:0; padding:0; display:grid; gap:9px }
.ft a{ text-decoration:none; color:var(--band-ink); opacity:.86; transition:opacity .3s, color .3s }
.ft a:hover{ opacity:1; color:var(--cream) }
.ft-bot{ margin-top:clamp(38px,6vw,72px); padding-top:22px; border-top:1px solid rgba(241,239,228,.15);
         display:flex; flex-wrap:wrap; gap:12px 28px; justify-content:space-between;
         color:rgba(241,239,228,.5); font-size:.84rem }

/* ---------- progreso de scroll ---------- */
.prog{ position:fixed; left:0; top:0; height:2px; background:var(--cream); width:0; z-index:70; }

/* ---------- capa de notas de propuesta ---------- */
.pin{ position:absolute; z-index:20; width:26px; height:26px; border-radius:50%; border:0; cursor:pointer;
      background:var(--marea); color:#fff; font-family:var(--f-util); font-size:11px; font-weight:500;
      display:none; place-items:center; box-shadow:0 3px 14px rgba(0,0,0,.3); }
body.notes .pin{ display:grid; animation:pop .5s var(--ease) backwards }
@keyframes pop{ from{ scale:0; opacity:0 } }
.pin:hover{ scale:1.15 }
.refbadge{ position:absolute; left:10px; top:10px; z-index:6; background:rgba(47,55,34,.82); color:#F1EFE4;
           font-family:var(--f-util); text-transform:uppercase; letter-spacing:.14em; font-size:9px;
           padding:5px 9px; border-radius:2px; opacity:0; transition:opacity .3s; pointer-events:none }
body.notes .refbadge{ opacity:1 }
.hasref{ position:relative }
.hero .hasref{ position:absolute }
.notes-btn{ position:fixed; right:18px; bottom:18px; z-index:64;
            transition:opacity .35s var(--ease), translate .35s var(--ease); }
body.notes .notes-btn{ opacity:0; translate:0 14px; pointer-events:none; }
.panel{ position:fixed; right:0; top:0; bottom:0; width:min(430px,92vw); background:var(--ground-2);
        border-left:1px solid var(--line); z-index:66; translate:100% 0; transition:translate .6s var(--ease);
        display:flex; flex-direction:column; }
.panel.open{ translate:0 0 }
.panel-h{ padding:22px 26px 18px; border-bottom:1px solid var(--line); display:flex;
          justify-content:space-between; align-items:flex-start; gap:14px }
.panel-b{ overflow-y:auto; padding:8px 26px 30px }
.qn{ padding:18px 0; border-bottom:1px solid var(--line-2) }
.qn:last-child{border-bottom:0}
.qn b{ display:flex; gap:10px; font-weight:500; font-size:.98rem; align-items:baseline }
.qn b i{ font-style:normal; color:var(--marea); font-family:var(--f-util); font-size:11px; flex:none; width:20px }
.qn p{ margin:7px 0 0 30px; color:var(--ink-2); font-size:.9rem; line-height:1.55 }
.qn.hl{ background:color-mix(in srgb, var(--marea) 11%, transparent) }

/* ---------- reveals ---------- */
.rev{ opacity:0; translate:0 26px; transition:opacity .95s var(--ease), translate .95s var(--ease) }
.rev.in-view{ opacity:1; translate:0 0 }

/* ---------- responsive ---------- */
@media (max-width:1080px){
  .co{ grid-template-columns:repeat(3,1fr) }
  .ft-top{ grid-template-columns:1fr 1fr }
  .nums{ grid-template-columns:repeat(2,1fr) }
}
@media (max-width:900px){
  .nav-links{ display:none }
  .burger{ display:block }
  .man,.sede,.join,.ag,.exp{ grid-template-columns:1fr }
  .man-imgs .fig-b{ position:static; width:56%; margin:-14% 0 0 auto; }
  .ag{ gap:18px }
}
@media (max-width:560px){
  .co{ grid-template-columns:repeat(2,1fr) }
  .ft-top{ grid-template-columns:1fr }
  .nums{ grid-template-columns:1fr 1fr }
  .ann{ font-size:11px; padding-right:40px; gap:10px }
  .ann .u{ display:none }
}

@media (prefers-reduced-motion: reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{ animation-duration:.001ms !important; animation-iteration-count:1 !important;
                        transition-duration:.001ms !important; scroll-behavior:auto !important }
  .rl > span,.fade,.rev{ opacity:1 !important; translate:0 0 !important }
  .dots i{ scale:1 !important }
  .hero-img img{ opacity:1 !important; scale:1 !important }
}

/* --- máscaras del logo --- */
:root{ --logo:url("../img/logo.png"); --mark:url("../img/logo-mark.png"); }