/* partner.css — páginas de socios con la MISMA estructura y estilo que la home:
   secciones a pantalla completa con imagen de fondo, gradientes, canvas de
   partículas y los mismos reveals (blurFadeUp / ml-line / r-fade). */
:root{
  --bg:#0A0A0A; --ink:#F8F7F4; --stone:#B0ADA5; --gray:#6B6B6B; --faint:#4A4A47;
  --line:rgba(248,247,244,.10); --line-2:rgba(248,247,244,.16);
}
*{box-sizing:border-box}
html,body{margin:0; padding:0; background:#0A0A0A}
body{color:var(--ink); font-family:'Inter',-apple-system,BlinkMacSystemFont,sans-serif;
  font-weight:300; -webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility; overflow-x:hidden}
::selection{background:rgba(176,173,165,.22)}
a{color:inherit; text-decoration:none}

/* ---------- animaciones (idénticas a la home) ---------- */
@keyframes blurFadeUp{from{opacity:0; filter:blur(20px); transform:translateY(40px)} to{opacity:1; filter:blur(0); transform:translateY(0)}}
@keyframes simpleFade{from{opacity:0} to{opacity:1}}
@keyframes scrollPulse{0%,100%{opacity:.25} 50%{opacity:.9}}
.bfu{opacity:0; animation:blurFadeUp 1.4s cubic-bezier(.16,1,.3,1) forwards}
.ml-line{display:block; clip-path:inset(0 105% 0 -2%);
  transition:clip-path 1.15s cubic-bezier(.16,1,.3,1); will-change:clip-path}
.inview .ml-line{clip-path:inset(0 -2% 0 -2%)}
.r-fade{opacity:0; filter:blur(20px); transform:translateY(40px);
  transition:opacity 1.4s cubic-bezier(.16,1,.3,1), filter 1.4s cubic-bezier(.16,1,.3,1), transform 1.4s cubic-bezier(.16,1,.3,1);
  will-change:opacity,filter,transform}
.inview .r-fade{opacity:1; filter:blur(0); transform:translateY(0)}
@media (prefers-reduced-motion:reduce){
  .bfu{animation:simpleFade .9s ease forwards}
  .scroll-pulse{animation:none!important; opacity:.5!important}
  .ml-line{clip-path:none; opacity:0; transition:opacity .9s ease}
  .inview .ml-line{opacity:1}
  .r-fade{filter:none; transform:none; transition:opacity .9s ease}
  .inview .r-fade{opacity:1; filter:none; transform:none}
}

/* ---------- estructura de sección a pantalla completa ---------- */
.section{position:relative; width:100%; height:100vh; min-height:600px; overflow:hidden; background:#0A0A0A; font-family:'Inter',sans-serif}
.bg{position:absolute; inset:0; width:100%; height:100%; object-fit:cover; z-index:0; display:block}
.cv{position:absolute; inset:0; width:100%; height:100%; z-index:2; pointer-events:none}
.veil{position:absolute; inset:0; z-index:1; pointer-events:none}
.content{position:absolute; inset:0; z-index:3; display:flex}

/* ---------- tipografía (mismos tamaños/pesos que la home) ---------- */
.eyebrow{font-family:'Inter',sans-serif; font-weight:300; font-size:clamp(11px,.95vw,13px);
  letter-spacing:.42em; text-transform:uppercase; color:var(--stone)}
.title{font-family:'Space Grotesk',sans-serif; font-weight:300; letter-spacing:-.02em; color:var(--ink); margin:0}
.title.xl{font-size:clamp(38px,6.2vw,100px); line-height:1.02; max-width:16ch; text-wrap:balance}
.title.lg{font-size:clamp(34px,4.6vw,76px); line-height:1.07}
.statement{font-family:'Space Grotesk',sans-serif; font-weight:300; font-size:clamp(26px,3.5vw,50px);
  line-height:1.26; letter-spacing:-.015em; color:var(--ink); margin:0}
.sub{font-family:'Inter',sans-serif; font-weight:300; color:var(--gray);
  font-size:clamp(15px,1.45vw,21px); line-height:1.55; margin:0}
.sub.sg{font-family:'Space Grotesk',sans-serif; font-size:clamp(16px,1.6vw,24px); line-height:1.5}

/* retrato pequeño del hero */
.face{width:clamp(62px,7vw,84px); aspect-ratio:1; border-radius:50%; object-fit:cover;
  filter:grayscale(1) contrast(1.04); display:block;
  box-shadow:0 0 0 1px rgba(248,247,244,.14), 0 0 54px 8px rgba(176,173,165,.12)}

/* indicador de scroll (igual que la home) */
.cue{position:absolute; left:50%; bottom:clamp(28px,4vh,44px); transform:translateX(-50%); z-index:4;
  display:flex; flex-direction:column; align-items:center; gap:10px; pointer-events:none}
.cue .bar{width:1px; height:clamp(36px,6vh,56px); background:linear-gradient(to bottom,transparent,var(--stone));
  animation:scrollPulse 2.6s ease-in-out infinite}
.cue .chev{width:7px; height:7px; border-right:1px solid var(--stone); border-bottom:1px solid var(--stone);
  transform:rotate(45deg); margin-top:-4px; animation:scrollPulse 2.6s ease-in-out infinite; animation-delay:.15s}

/* botones (cierre) */
.btn{display:inline-flex; align-items:center; gap:9px; padding:13px 24px; border-radius:999px;
  font-size:13px; letter-spacing:.04em; transition:all .25s ease; pointer-events:auto}
.btn-primary{background:var(--ink); color:#0A0A0A; font-weight:400}
.btn-primary:hover{background:#fff; transform:translateY(-1px)}
.btn-ghost{border:1px solid var(--line-2); color:var(--ink)}
.btn-ghost:hover{border-color:var(--stone); background:rgba(248,247,244,.04)}
.btn svg{width:16px; height:16px; fill:currentColor}

/* cierre */
.wordmark{font-family:'Space Grotesk',sans-serif; font-weight:700; font-size:clamp(15px,1.4vw,21px);
  letter-spacing:.24em; color:var(--ink)}
.home-link{font-family:'Inter',sans-serif; font-size:12px; letter-spacing:.16em; text-transform:uppercase;
  color:var(--gray); pointer-events:auto}
.home-link:hover{color:var(--stone)}

/* topbar discreta */
.topbar{position:absolute; top:0; left:0; right:0; z-index:5; display:flex; align-items:center;
  justify-content:space-between; padding:clamp(24px,4vw,44px) clamp(28px,5vw,64px)}
.brand{font-family:'Space Grotesk',sans-serif; font-weight:700; font-size:clamp(13px,1.1vw,16px);
  letter-spacing:.22em; color:var(--ink)}
.back{font-family:'Inter',sans-serif; font-size:12px; letter-spacing:.16em; text-transform:uppercase; color:var(--gray)}
.back:hover{color:var(--stone)}

/* ---------- responsive + visibilidad de imágenes en móvil ---------- */
@media (max-width:768px){
  .title.lg{white-space:normal!important}
  /* busto del manifiesto: encuadrar al rostro y aclarar para que se vea (mismo fix que la home) */
  .img-busto{object-position:46% 50%!important; filter:grayscale(1) contrast(1.04) brightness(1.16)!important}
  .veil-soft{opacity:.5!important}
}