/* ============================================================
   PIPE GALLEGOS — Landing
   ============================================================ */

:root{
  --bg: #08070b;
  --bg-alt: #110f16;
  --bg-black: #030303;
  --panel: #15121c;
  --line: rgba(255,255,255,.08);
  --line-soft: rgba(255,255,255,.05);

  --purple: #b98cff;
  --purple-2: #8b5cf6;
  --purple-deep: #6d28d9;
  --purple-dim: #4c3b70;

  --text: #f4f1f8;
  --text-dim: #aba3ba;
  --text-faint: #6d6580;

  --wa: #33d17a;

  --radius-xl: 32px;
  --radius-lg: 24px;
  --radius-md: 18px;
  --radius-sm: 12px;
  --radius-pill: 999px;

  --ease: cubic-bezier(.22,.9,.24,1);
  --ease-soft: cubic-bezier(.16,.8,.2,1);

  --container: 1240px;
}

*,*::before,*::after{ box-sizing: border-box; }

html{
  background: var(--bg);
  scroll-behavior: smooth;
}

body{
  margin:0;
  background: var(--bg);
  color: var(--text);
  font-family: 'Stem', 'Helvetica Neue', Arial, sans-serif;
  font-weight: 300;
  line-height: 1.5;
  -webkit-font-smoothing: antialiased;
  overflow-x: hidden;
  width: 100%;
  max-width: 100vw;
}

img{ max-width:100%; display:block; }

a{ color: inherit; text-decoration: none; }

button{ font-family: inherit; cursor: pointer; background: none; border: none; color: inherit; }

h1,h2,h3,h4{ margin:0; font-family:'Stem','Helvetica Neue',Arial,sans-serif; font-weight:600; letter-spacing:-.01em; }

p{ margin:0; }

.container{
  max-width: var(--container);
  margin: 0 auto;
  padding: 0 6vw;
}
.container--narrow{ max-width: 820px; }
.container--origen{ max-width: 1240px; }
.origen .h-xl{ font-size: clamp(2rem, 3.4vw, 3rem); }
.origen__row{ display:flex; align-items:center; gap: clamp(2rem,5vw,4rem); }
.origen__media{
  flex: 0 0 auto;
  width: min(30vw, 360px);
  aspect-ratio: 760 / 1144;
  border-radius: var(--radius-xl);
  overflow: hidden;
  box-shadow: 0 30px 70px -24px rgba(0,0,0,.65), 0 0 0 1px var(--line);
}
.origen__media video{ width:100%; height:100%; object-fit:cover; }
.origen__content{ flex: 1 1 480px; min-width:0; }
@media (max-width: 860px){
  .origen__row{ flex-direction:column; align-items:flex-start; }
  .origen__media{ width:min(70vw,320px); margin: 0 auto; }
}
.container--wide{ max-width: 1400px; }

.section{ padding: clamp(4rem, 8vw, 6.5rem) 0; position: relative; scroll-margin-top: 90px; }

/* ---------- typography helpers ---------- */
.h-giant{
  font-size: clamp(2.6rem, 8vw, 7.4rem);
  font-weight: 600;
  line-height: 1.08;
  letter-spacing: -.02em;
  text-align:center;
}
.h-giant .line{ display:block; white-space:nowrap; }
.h-giant__glow{
  position: relative;
  display: inline-block;
  color: #eadcff;
  text-shadow:
    0 0 10px rgba(190,150,255,.9),
    0 0 30px rgba(155,100,255,.6),
    0 0 78px rgba(124,58,237,.4);
  animation: glow-breathe 4.5s ease-in-out infinite;
}
.h-giant__sparkle{
  position:absolute; color: var(--purple); opacity:.55;
  font-size: .28em;
  animation: sparkle-twinkle 3.2s ease-in-out infinite;
  pointer-events:none;
}
.h-giant__sparkle--a{ top:-.1em; left:2%; animation-delay: 0s; }
.h-giant__sparkle--b{ top:.5em; right:4%; font-size:.2em; animation-delay: 1.1s; }
.h-giant__sparkle--c{ bottom:-.2em; left:38%; font-size:.16em; animation-delay: 2.1s; }
@keyframes sparkle-twinkle{
  0%,100%{ opacity:.2; transform:scale(.8); }
  50%{ opacity:.85; transform:scale(1.15); }
}
@media (max-width: 700px){ .h-giant .line{ white-space:normal; } }

.statement__pill{
  display: inline-flex; align-items:center; gap:.9rem;
  margin: clamp(1.8rem,3.4vw,2.4rem) auto 0;
  padding: 1rem 1.7rem;
  border-radius: var(--radius-pill);
  border: 1px solid var(--line);
  background: rgba(255,255,255,.03);
  color: var(--text-dim); font-weight: 600;
  font-size: clamp(1rem, 1.4vw, 1.2rem);
  max-width: 100%;
}
.statement__pill-icon{
  display:flex; flex:0 0 auto; width:20px; height:20px; color: var(--purple);
}
@media (max-width: 760px){
  .statement__pill{ text-align:left; }
}
.h-xl{
  font-size: clamp(2.6rem, 6.2vw, 4.6rem);
  font-weight: 600;
  line-height: 1.03;
  letter-spacing: -.015em;
  margin-bottom: clamp(2.5rem, 6vw, 4.5rem);
}
.h-lg{
  font-size: clamp(1.9rem, 4.2vw, 3.1rem);
  font-weight: 600;
  line-height: 1.12;
  letter-spacing: -.01em;
}
.h-sub{
  font-weight: 600;
  font-size: clamp(1.15rem, 1.7vw, 1.5rem);
  color: var(--text-dim);
  max-width: 46ch;
  margin-top: 1.4rem;
}
.h-sub--tight{ margin-top: .9rem; }
.statement .container{ text-align:center; }

.glow{
  font-style: normal;
  color: #eadcff;
  white-space: nowrap;
  text-shadow:
    0 0 6px rgba(190,150,255,.85),
    0 0 22px rgba(155,100,255,.55),
    0 0 60px rgba(124,58,237,.35);
  animation: glow-breathe 4.5s ease-in-out infinite;
}
@keyframes glow-breathe{
  0%,100%{
    text-shadow:
      0 0 6px rgba(190,150,255,.85),
      0 0 22px rgba(155,100,255,.55),
      0 0 60px rgba(124,58,237,.35);
  }
  50%{
    text-shadow:
      0 0 8px rgba(190,150,255,1),
      0 0 28px rgba(155,100,255,.7),
      0 0 72px rgba(124,58,237,.48);
  }
}
@media (prefers-reduced-motion: reduce){ .glow{ animation:none; } }
.glow-soft{
  color: #e6d9ff;
  text-shadow: 0 0 14px rgba(160,110,255,.35);
}

.prose p{
  font-size: clamp(1.15rem, 1.7vw, 1.4rem);
  font-weight: 600;
  line-height: 1.7;
  letter-spacing: .003em;
  color: var(--text-dim);
  margin-bottom: 1em;
  max-width: 62ch;
}
.manifiesto .prose p{ margin-left:auto; margin-right:auto; }
.prose strong{ color: var(--text); font-weight: 600; }
.prose__icon-line{ display:flex; align-items:center; gap:.7rem; }
.prose__icon{
  display:flex; align-items:center; justify-content:center; flex:0 0 auto;
  width:34px; height:34px; border-radius:10px;
  background: rgba(185,140,255,.1); border:1px solid rgba(185,140,255,.25);
  color: var(--purple);
}
.prose__icon svg{ width:18px; height:18px; }
.prose--lg p{ font-size: clamp(1.2rem, 2.1vw, 1.6rem); line-height: 1.6; }
.prose__cliff{ margin-top: 1.7em; color: var(--text) !important; font-weight: 500; }
.reveal-line--gap{ margin-top: 1.4em; }

/* ============================================================
   REVEAL ANIMATION BASE STATES (activated by JS -> .is-in)
   ============================================================ */
.reveal-up, .reveal-scale, .reveal-line{
  opacity: 0;
  transform: translateY(46px);
  filter: blur(6px);
  transition: opacity 1s var(--ease-soft), transform 1s var(--ease-soft), filter 1s var(--ease-soft);
  will-change: transform, opacity;
}
.reveal-scale{ transform: scale(.92); }
.reveal-line{ transform: translateY(24px); filter: blur(3px); }
.is-in.reveal-up, .is-in.reveal-scale, .is-in.reveal-line{
  opacity: 1;
  transform: none;
  filter: blur(0);
}

/* ---------- grain overlay ---------- */
.grain{
  position: fixed; inset:0; z-index: 3;
  pointer-events: none;
  opacity: .12;
  mix-blend-mode: overlay;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}

/* ---------- scroll progress rail ---------- */
.progress-rail{
  position: fixed; top:0; left:0; right:0; height: 2px; z-index: 60;
  background: transparent;
}
.progress-rail__fill{
  display:block; height:100%; width:100%;
  transform-origin: left;
  transform: scaleX(0);
  background: linear-gradient(90deg, var(--purple-deep), var(--purple));
  box-shadow: 0 0 12px rgba(185,140,255,.8);
}

/* ============================================================
   HEADER
   ============================================================ */
.site-header{
  position: fixed; top:0; left:0; right:0; z-index: 50;
  display:flex; align-items:center; justify-content: space-between;
  padding: 1.6rem 6vw;
  pointer-events: none;
}
.site-header::before{
  content:"";
  position:absolute; inset:0;
  background: linear-gradient(to bottom, rgba(6,5,9,.9) 0%, rgba(6,5,9,.55) 55%, transparent 100%);
  z-index:-1;
}
.wordmark, .ghost-link{ text-shadow: 0 2px 14px rgba(0,0,0,.6); }
.site-header > *{ pointer-events: auto; }
.wordmark{
  font-weight: 600;
  font-size: 1.05rem;
  letter-spacing: .02em;
}
.header-nav{ display:flex; align-items:center; gap:.6rem; pointer-events:auto; }
.ghost-link{
  font-size: .85rem;
  font-weight: 600;
  padding: .55rem 1.3rem;
  border: 1px solid var(--line);
  border-radius: var(--radius-pill);
  transition: border-color .5s var(--ease), background .5s var(--ease), box-shadow .5s var(--ease), transform .5s var(--ease);
}
.ghost-link:hover{
  border-color: var(--purple-dim);
  background: rgba(185,140,255,.1);
  box-shadow: 0 0 22px 2px rgba(185,140,255,.45);
  transform: translateY(-1px);
}
.ghost-link--primary{
  background: rgba(185,140,255,.1);
  border-color: rgba(185,140,255,.35);
}
.ghost-link--primary:hover{ box-shadow: 0 0 26px 4px rgba(185,140,255,.65); }
@media (max-width: 720px){
  .header-nav a:not(:last-child){ display:none; }
}

/* ============================================================
   HERO
   ============================================================ */
.hero{
  min-height: 100dvh;
  display:flex; flex-direction: column; align-items:center;
  text-align:center;
  padding: clamp(4.5rem,9vh,6.5rem) 6vw clamp(2.5rem,5vh,4rem);
  position: relative;
}

.hero__frame{
  position: relative;
  width: 100vw;
  margin-left: calc(50% - 50vw);
  margin-right: calc(50% - 50vw);
  aspect-ratio: 1.85;
  max-height: 95vh;
  border-radius: var(--radius-xl);
  overflow: hidden;
  box-shadow: 0 30px 80px -20px rgba(0,0,0,.7), 0 0 0 1px var(--line);
  background: #000;
}
.hero__img{ width:100%; height:100%; object-fit: cover; object-position: 50% 48%; }
.hero__frame-glow{
  position:absolute; inset:-30% 10% auto 10%; height: 50%;
  background: radial-gradient(closest-side, rgba(139,92,246,.4), transparent 70%);
  filter: blur(50px);
  z-index: 0;
  pointer-events: none;
}

.hero__clone-btn{
  position: absolute;
  right: clamp(1.5rem, 6vw, 6rem); top: 50%;
  transform: translateY(-50%);
  z-index: 3;
  display:inline-flex; align-items:center; gap:.8rem;
  padding: 1.15rem 2.1rem;
  border-radius: var(--radius-pill);
  background: linear-gradient(160deg, #a78bfa 0%, #8b5cf6 35%, #6d28d9 75%, #5b21b6 100%);
  border: 1px solid rgba(255,255,255,.35);
  color: #fff;
  font-weight: 600; font-size: clamp(1rem, 1.6vw, 1.2rem);
  box-shadow: 0 22px 50px -14px rgba(109,40,217,.75), 0 0 0 1px rgba(255,255,255,.06) inset;
  transition: transform .5s var(--ease), box-shadow .5s var(--ease);
  overflow: hidden;
  isolation: isolate;
}
.hero__clone-btn:hover{ transform: translateY(-50%) translateY(-3px) scale(1.03); box-shadow: 0 28px 60px -12px rgba(139,92,246,.9), 0 0 0 1px rgba(255,255,255,.08) inset; }
.hero__clone-btn:active{ transform: translateY(-50%) scale(.97); }
.hero__clone-btn-shine{
  position:absolute; inset:0; z-index:0;
  background: radial-gradient(120% 90% at 50% -30%, rgba(255,255,255,.65), transparent 60%),
              radial-gradient(90% 70% at 30% 120%, rgba(255,255,255,.28), transparent 60%);
  mix-blend-mode: overlay;
  pointer-events:none;
}
.hero__clone-btn-label{ position:relative; z-index:1; }
.hero__clone-dot{
  position:relative; z-index:1;
  width:10px; height:10px; border-radius:50%;
  background: #fff;
  box-shadow: 0 0 0 4px rgba(255,255,255,.25), 0 0 14px 3px rgba(255,255,255,.9);
  animation: pulse-dot 1.8s ease-in-out infinite;
}
@keyframes pulse-dot{ 0%,100%{ opacity:1; } 50%{ opacity:.4; } }
.hero__clone-ripple{
  position:absolute; z-index:2;
  border-radius:50%;
  background: radial-gradient(circle, rgba(255,255,255,.95), rgba(56,232,139,.65) 45%, transparent 70%);
  transform: translate(-50%,-50%) scale(0);
  pointer-events:none;
  animation: ripple-grow .65s var(--ease-soft) forwards;
}
@keyframes ripple-grow{
  0%{ transform: translate(-50%,-50%) scale(0); opacity:.9; }
  100%{ transform: translate(-50%,-50%) scale(1); opacity:0; }
}

.hero__headline{
  margin-top: clamp(1.6rem, 3.4vw, 2.4rem);
  max-width: 27ch;
  font-size: clamp(2.1rem, 5.6vw, 4.4rem);
  line-height: 1.08;
  letter-spacing: -.02em;
}
.hero__headline .line{ display:block; }
.hero__headline .line:first-child{ white-space: nowrap; }
@media (max-width: 640px){
  .hero__headline .line:first-child{ white-space: normal; }
}

.hero__lead{
  margin-top: clamp(1.1rem, 2.2vw, 1.6rem);
  max-width: 900px;
  font-size: clamp(1.3rem, 2vw, 1.55rem);
  color: var(--text-dim);
  font-weight: 600;
  line-height: 1.7;
}

.hero__actions{
  margin-top: clamp(1.5rem, 3vw, 2.2rem);
  display:flex; gap: 1rem; flex-wrap: wrap; justify-content:center;
}

.hero__scroll-cue{
  position:absolute; bottom: 2.2rem; left:50%; transform: translateX(-50%);
  width: 26px; height: 42px; border-radius: 20px; border: 1px solid var(--line);
}
.hero__scroll-cue span{
  position:absolute; top:8px; left:50%; width:4px; height:8px; border-radius:2px;
  background: var(--purple); transform: translateX(-50%);
  animation: scrollcue 2s ease-in-out infinite;
}
@keyframes scrollcue{
  0%{ opacity:1; top:8px; }
  70%{ opacity:0; top:22px; }
  100%{ opacity:0; top:8px; }
}

/* ============================================================
   BUTTONS
   ============================================================ */
.btn{
  position: relative;
  display:inline-flex; align-items:center; gap: .9rem;
  padding: .55rem .6rem .55rem 1.6rem;
  border-radius: var(--radius-pill);
  font-weight: 600; font-size: .98rem;
  transition: transform .5s var(--ease), background .5s var(--ease), border-color .5s var(--ease), box-shadow .5s var(--ease);
}
.btn:active{ transform: scale(.97); }

.btn__dot{
  width: 38px; height:38px; border-radius:50%;
  background: rgba(255,255,255,.12);
  display:inline-flex; align-items:center; justify-content:center;
  transition: transform .5s var(--ease), background .5s var(--ease);
}
.btn__dot::after{
  content:"↗"; font-size: 1rem; line-height:1;
}

.btn--primary{
  background: linear-gradient(135deg, var(--purple-2), var(--purple-deep));
  color: #fff;
  box-shadow: 0 10px 30px -8px rgba(124,58,237,.65);
}
.btn--primary:hover{ box-shadow: 0 16px 40px -6px rgba(124,58,237,.85); transform: translateY(-2px); }
.btn--primary:hover .btn__dot{ background: rgba(255,255,255,.28); transform: translate(2px,-2px) scale(1.06); }

.btn--ghost{
  background: transparent;
  border: 1px solid var(--line);
  color: var(--text);
}
.btn--ghost:hover{ border-color: var(--purple-dim); background: rgba(185,140,255,.06); transform: translateY(-2px); }
.btn--ghost:hover .btn__dot{ background: rgba(185,140,255,.22); transform: translate(2px,-2px) scale(1.06); }

.btn--whatsapp{
  background: linear-gradient(135deg, #38e88b, #1fae63);
  color: #06180d;
  box-shadow: 0 10px 30px -8px rgba(51,209,122,.55);
  padding: .55rem .6rem .55rem 1.5rem;
}
.btn--whatsapp:hover{ transform: translateY(-2px); box-shadow: 0 16px 36px -6px rgba(51,209,122,.75); }
.btn--lg{ font-size: 1.05rem; padding: .7rem .75rem .7rem 1.9rem; }

.btn--pulse{ overflow: visible; }
.btn--pulse::before,
.btn--pulse::after{
  content:"";
  position:absolute; inset:0; border-radius:inherit;
  border: 1.5px solid rgba(56,232,139,.65);
  pointer-events:none;
  animation: btn-pulse-ring 2.6s cubic-bezier(.22,.8,.32,1) infinite;
}
.btn--pulse::after{ animation-delay: 1.3s; }
@keyframes btn-pulse-ring{
  0%{ transform: scale(1); opacity:.65; }
  100%{ transform: scale(1.16); opacity:0; }
}
@media (prefers-reduced-motion: reduce){
  .btn--pulse::before, .btn--pulse::after{ animation:none; display:none; }
}

.btn__icon--wa{
  width: 38px; height: 38px; border-radius:50%;
  background: rgba(6,24,13,.16);
  display:inline-flex; align-items:center; justify-content:center;
}
.btn__icon--wa::after{
  content:"";
  width: 18px; height: 18px;
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3E%3Cpath d='M16 3C9 3 3.3 8.6 3.3 15.5c0 2.5.7 4.8 1.9 6.8L3 29l6.9-2.1c1.9 1 4 1.6 6.1 1.6 7 0 12.7-5.6 12.7-12.5C28.7 8.6 23 3 16 3zm0 22.7c-1.9 0-3.7-.5-5.3-1.4l-.4-.2-4.1 1.3 1.3-4-.3-.4a10.6 10.6 0 0 1-1.7-5.5C5.5 9.8 10.2 5.2 16 5.2S26.5 9.8 26.5 15.5 21.8 25.7 16 25.7zm5.8-7.6c-.3-.2-1.9-.9-2.2-1-.3-.1-.5-.2-.7.2s-.8 1-1 1.2c-.2.2-.4.2-.7.1-.3-.2-1.4-.5-2.6-1.6-1-.9-1.6-2-1.8-2.3-.2-.3 0-.5.1-.7l.5-.6c.2-.2.2-.3.3-.5.1-.2 0-.4 0-.5s-.7-1.7-1-2.3c-.2-.6-.5-.5-.7-.5h-.6c-.2 0-.5.1-.8.4-.3.3-1 1-1 2.4s1.1 2.8 1.2 3c.1.2 2.1 3.2 5 4.4.7.3 1.3.5 1.7.6.7.2 1.4.2 1.9.1.6-.1 1.9-.8 2.1-1.5.3-.7.3-1.3.2-1.5-.1-.1-.3-.2-.6-.4z' fill='%2306180d'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3E%3Cpath d='M16 3C9 3 3.3 8.6 3.3 15.5c0 2.5.7 4.8 1.9 6.8L3 29l6.9-2.1c1.9 1 4 1.6 6.1 1.6 7 0 12.7-5.6 12.7-12.5C28.7 8.6 23 3 16 3zm0 22.7c-1.9 0-3.7-.5-5.3-1.4l-.4-.2-4.1 1.3 1.3-4-.3-.4a10.6 10.6 0 0 1-1.7-5.5C5.5 9.8 10.2 5.2 16 5.2S26.5 9.8 26.5 15.5 21.8 25.7 16 25.7zm5.8-7.6c-.3-.2-1.9-.9-2.2-1-.3-.1-.5-.2-.7.2s-.8 1-1 1.2c-.2.2-.4.2-.7.1-.3-.2-1.4-.5-2.6-1.6-1-.9-1.6-2-1.8-2.3-.2-.3 0-.5.1-.7l.5-.6c.2-.2.2-.3.3-.5.1-.2 0-.4 0-.5s-.7-1.7-1-2.3c-.2-.6-.5-.5-.7-.5h-.6c-.2 0-.5.1-.8.4-.3.3-1 1-1 2.4s1.1 2.8 1.2 3c.1.2 2.1 3.2 5 4.4.7.3 1.3.5 1.7.6.7.2 1.4.2 1.9.1.6-.1 1.9-.8 2.1-1.5.3-.7.3-1.3.2-1.5-.1-.1-.3-.2-.6-.4z' fill='%2306180d'/%3E%3C/svg%3E");
  mask-size: contain; -webkit-mask-size: contain; mask-repeat: no-repeat; -webkit-mask-repeat: no-repeat;
  background-color: #06180d;
}

/* ============================================================
   FILOSOFIA — horizontal scroll gallery
   ============================================================ */
.filo{ position: relative; background: var(--bg); }
.filo__glow{
  position:absolute; inset:0; z-index:0; pointer-events:none;
  background:
    radial-gradient(46% 60% at 30% 45%, rgba(139,92,246,.28), transparent 70%),
    radial-gradient(38% 55% at 75% 55%, rgba(185,140,255,.2), transparent 70%);
  filter: blur(10px);
}
.filo__pin{ position:relative; height:100vh; overflow:hidden; display:flex; align-items:center; z-index:1; }
.filo__track{ display:flex; align-items:center; gap: clamp(1rem,2vw,2.2rem); padding: 0 8vw; will-change: transform; }
.filo__item{
  flex: 0 0 auto;
  width: clamp(220px, 24vw, 340px);
  height: clamp(280px, 34vw, 440px);
  border-radius: var(--radius-lg);
  opacity: .25;
  transform: scale(.86);
  filter: blur(2px);
}
.filo__item-inner{
  width:100%; height:100%; border-radius: var(--radius-lg); overflow:hidden;
  box-shadow: 0 20px 50px -18px rgba(0,0,0,.6);
  cursor: pointer;
  transition: transform .28s var(--ease);
}
.filo__item-inner.is-pressed{ transform: scale(.9); }
.filo__item-inner:hover{ transform: scale(1.03); }
.filo__item-inner.is-pressed:hover{ transform: scale(.9); }
.filo__item img{ width:100%; height:100%; object-fit: cover; display:block; }

/* ============================================================
   MANIFIESTO
   ============================================================ */
.manifiesto{ background: var(--bg-black); text-align: center; }

.manifiesto__grid{
  display:grid; grid-template-columns: repeat(3, 1fr);
  gap: clamp(1.2rem, 2.4vw, 1.8rem);
  text-align:left;
}
.manifiesto__block{
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  background: rgba(255,255,255,.025);
  padding: clamp(1.8rem, 2.6vw, 2.4rem);
}
.manifiesto__block p{
  font-weight: 600; font-size: clamp(1.1rem, 1.5vw, 1.3rem);
  color: var(--text-dim); line-height: 1.6; margin-bottom: .55em;
}
.manifiesto__block p:last-child{ margin-bottom: 0; }
@media (max-width: 800px){
  .manifiesto__grid{ grid-template-columns: 1fr; }
}

/* ---------- reusable traveling border light ---------- */
.card-border-glow{ position: relative; }
.card-border-glow::before{
  content:"";
  position:absolute; inset:0; border-radius: inherit;
  padding: 1px;
  background: conic-gradient(from var(--border-angle, 0deg),
    transparent 0%, transparent 78%,
    rgba(185,140,255,.9) 87%, rgba(238,225,255,.95) 90%, rgba(185,140,255,.9) 93%,
    transparent 100%);
  -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
  -webkit-mask-composite: xor;
  mask-composite: exclude;
  animation: border-travel 5s linear infinite;
  pointer-events:none;
}
@keyframes border-travel{ to{ --border-angle: 360deg; } }
@property --border-angle{
  syntax: '<angle>';
  inherits: false;
  initial-value: 0deg;
}
@media (prefers-reduced-motion: reduce){
  .card-border-glow::before{ animation:none; }
}

/* ============================================================
   CARDS
   ============================================================ */
.card-grid{
  display:grid; gap: clamp(1.2rem, 2vw, 1.8rem);
  grid-template-columns: repeat(4, 1fr);
}
.card-grid--numbers{ grid-template-columns: repeat(4, 1fr); grid-auto-flow: dense; }
.numeros .h-xl{ text-align:center; }
.card-grid--numbers .card--quote{ grid-column: span 4; }

.card{
  position: relative;
  background: linear-gradient(165deg, rgba(255,255,255,.05), rgba(255,255,255,.015));
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  padding: 2.2rem 1.9rem;
  box-shadow: 0 20px 40px -28px rgba(0,0,0,.6);
  transition: transform .6s var(--ease), border-color .6s var(--ease), background .6s var(--ease), box-shadow .6s var(--ease);
}
.card:hover{
  transform: translateY(-6px);
  border-color: var(--purple-dim);
  background: linear-gradient(165deg, rgba(185,140,255,.1), rgba(185,140,255,.02));
  box-shadow: 0 26px 52px -24px rgba(109,40,217,.5);
}
.card__icon{
  display:flex; align-items:center; justify-content:center;
  width: 46px; height: 46px; margin-bottom: 1.2rem;
  border-radius: var(--radius-md);
  background: rgba(185,140,255,.1);
  border: 1px solid rgba(185,140,255,.25);
  color: var(--purple);
}
.card__icon svg{ width: 22px; height: 22px; }
.card--quote .card__icon{ background: rgba(185,140,255,.16); }
.card__title{ font-family:'Stem'; font-weight:600; font-size: 1.15rem; margin-bottom: .8rem; line-height: 1.3; }
.card__text{ color: var(--text-dim); font-weight: 600; font-size: 1.06rem; line-height: 1.6; }
.card__title-badge{
  display:inline-block;
  padding: .55rem 1rem;
  border-radius: var(--radius-md);
  border: 1px solid rgba(185,140,255,.4);
  background: rgba(185,140,255,.08);
}

.neon-accent{
  font-style:normal; color:#eadcff;
  text-shadow: 0 0 8px rgba(190,150,255,.7), 0 0 26px rgba(155,100,255,.4);
}

.aprendizajes .h-xl{ text-align:center; }
.aprendizajes .card{ padding: 2.5rem 2.1rem; }
.aprendizajes .card__text{ font-size: 1.05rem; }

.card--stat{ text-align:left; }
.card__stat{
  font-family:'Stem'; font-weight:600;
  font-size: clamp(2.4rem, 4vw, 3.2rem);
  color: var(--purple);
  text-shadow: 0 0 26px rgba(160,110,255,.35);
  margin-bottom: .35rem;
  line-height: 1;
}
.card__stat--word{ font-size: clamp(1.9rem, 3vw, 2.5rem); }
.card--quote{
  background: linear-gradient(135deg, rgba(139,92,246,.12), rgba(139,92,246,.02));
  display:flex; flex-direction:column; justify-content:center;
}
.card__text--lead{ color: var(--text); font-weight: 500; font-size: 1.15rem; margin-bottom:.6rem; }

/* ============================================================
   COMPACT STATEMENT / CTA BLOCKS
   ============================================================ */
.compact-statement{ text-align:center; padding-top: clamp(4rem,8vw,6rem); padding-bottom: clamp(4rem,8vw,6rem); }
.compact-statement .h-sub{ margin-left:auto; margin-right:auto; text-align:center; }
.compact-statement .h-lg{ font-size: clamp(2rem, 4.6vw, 3.6rem); white-space: nowrap; }
.compact-statement .h-sub{ font-size: clamp(1.15rem, 2vw, 1.5rem); white-space: nowrap; max-width:none; }
@media (max-width: 760px){
  .compact-statement .h-lg, .compact-statement .h-sub{ white-space: normal; }
}

.cta-block{ background: var(--bg-alt); border-top: 1px solid var(--line-soft); border-bottom: 1px solid var(--line-soft); }
.cta-block--alt{ background: var(--bg); }
.cta-block__row{ display:flex; align-items:center; justify-content:space-between; gap: clamp(2rem,5vw,4rem); flex-wrap:wrap; }
.cta-block__copy{ flex: 1 1 420px; text-align:left; }
.cta-block .btn{ flex: 0 0 auto; }
.questions{ margin: 1.4rem 0 0; }
.questions p{ font-size: clamp(1.15rem,1.7vw,1.4rem); color: var(--text-dim); font-weight:600; line-height:1.6; margin-bottom:.5em; }
@media (max-width: 800px){
  .cta-block__row{ flex-direction:column; align-items:flex-start; }
  .cta-block__copy{ text-align:left; }
}

/* ============================================================
   METODOLOGIA — rotating ring
   ============================================================ */
.metodologia .container{ text-align:center; }
.method__tagline{
  display: inline-block;
  margin: 1.4rem auto 0;
  padding: 1rem 2rem;
  border-radius: var(--radius-pill);
  border: 1px solid rgba(139,92,246,.3);
  background: linear-gradient(160deg, rgba(76,59,112,.3), rgba(21,18,28,.45));
  color: var(--text);
  font-size: clamp(1.2rem, 2vw, 1.6rem);
  font-weight: 600;
}
.method{
  display:flex; flex-direction:column; align-items:center;
  margin: clamp(3.5rem,7vw,6rem) auto 0;
}
.method{ max-width: 100%; }
.method__stage{
  position: relative;
  width: min(88vw, 760px);
  max-width: 100%;
  aspect-ratio: 1;
  overflow: hidden;
}
.method__ring-bg{
  position:absolute; inset:0;
  animation: spin 34s linear infinite;
}
.method__ring-svg{ width:100%; height:100%; }
.method__ring-svg circle{
  fill:none; stroke: var(--purple-dim); stroke-width: 1.2; stroke-dasharray: 2 14; stroke-linecap: round;
  opacity:.6;
}
@keyframes spin{ to{ transform: rotate(360deg); } }

.method__nodes{ list-style:none; margin:0; padding:0; position:absolute; inset:0; }
.method__node{
  position:absolute; top:50%; left:50%;
  width: clamp(70px, 9vw, 108px); height: clamp(70px, 9vw, 108px);
  border-radius:50%;
  display:flex; align-items:center; justify-content:center;
  background: var(--panel);
  border: 1px solid var(--line);
  will-change: transform, opacity;
}
.method__node-num{
  font-family:'Stem'; font-weight:600; font-size: clamp(1.15rem, 1.6vw, 1.5rem);
  color: var(--text-faint);
}
.method__node.is-active{
  background: radial-gradient(120% 120% at 30% 20%, rgba(139,92,246,.3), rgba(21,18,28,.95) 70%);
  border-color: rgba(185,140,255,.55);
  box-shadow: 0 20px 50px -18px rgba(109,40,217,.7);
}
.method__node.is-active .method__node-num{
  color: var(--purple);
  text-shadow: 0 0 24px rgba(160,110,255,.55);
  display:inline-block;
  animation: node-pop .5s var(--ease-soft);
}
@keyframes node-pop{
  0%{ transform: scale(1); }
  55%{ transform: scale(1.35); }
  100%{ transform: scale(1); }
}
@media (prefers-reduced-motion: reduce){
  .method__node.is-active .method__node-num{ animation:none; }
}

.method__label{
  position: absolute;
  top: 50%; left: 0;
  right: calc(50% + clamp(75px, 9vw, 120px));
  transform: translateY(-50%);
  display:flex; align-items:center; justify-content:flex-end;
  text-align: right;
  pointer-events:none;
}
.method__label p{
  font-size: clamp(1.2rem, 2.4vw, 1.85rem); color: var(--text); font-weight:600; line-height:1.35;
  transition: opacity .3s var(--ease), transform .3s var(--ease);
}
.method__label p.is-swapping{ opacity:0; transform: translateY(8px); }

@media (max-width: 860px){
  .method__label{
    position: static;
    right:auto; left:auto; transform:none;
    justify-content:center; text-align:center;
    margin-top: clamp(1.4rem, 3vw, 2rem);
    min-height: 2.6em;
    padding: 0 6%;
  }
  .method__label p{ font-size: clamp(1.1rem, 2vw, 1.4rem); }
}

.method__controls{
  display:flex; align-items:center; gap: 1.4rem; margin-top: clamp(1.6rem, 3vw, 2.2rem);
}
.method__arrow{
  width:52px; height:52px; border-radius:50%;
  border: 1px solid var(--line); font-size:1.4rem;
  display:flex; align-items:center; justify-content:center;
  transition: border-color .4s var(--ease), background .4s var(--ease), transform .4s var(--ease);
}
.method__arrow:hover{ border-color: var(--purple-dim); background: rgba(185,140,255,.08); transform: scale(1.06); }
.method__dots{ display:flex; gap:.5rem; }
.method__dot{
  width:7px; height:7px; border-radius:50%;
  background: var(--line);
  transition: background .4s var(--ease), transform .4s var(--ease);
}
.method__dot.is-active{ background: var(--purple); transform: scale(1.3); }

/* ============================================================
   SERVICIOS
   ============================================================ */
.service-grid{
  display:grid; grid-template-columns: repeat(4,1fr); gap: clamp(1rem,2vw,1.6rem);
  grid-auto-flow: dense;
}
.service-card{
  position:relative; border-radius: var(--radius-lg); overflow:hidden;
  aspect-ratio: 3/4;
  border: 1px solid var(--line);
  transition: transform .6s var(--ease), box-shadow .6s var(--ease);
}
.service-card:nth-child(5){ grid-column: span 2; grid-row: span 2; }
.service-card:hover{ transform: translateY(-6px); box-shadow: 0 24px 50px -20px rgba(124,58,237,.5); }
.service-card__img{
  position:absolute; inset:0; background-size:cover; background-position:center;
  transition: transform 1s var(--ease);
  filter: saturate(.9) brightness(.75);
}
.service-card:hover .service-card__img{ transform: scale(1.08); }
.service-card::after{
  content:""; position:absolute; inset:0;
  background: linear-gradient(to top, rgba(3,3,5,.92) 10%, rgba(3,3,5,.15) 55%, transparent 90%);
}
.service-card__label{
  position:absolute; left: 1.2rem; bottom: 1.1rem; z-index:2;
  font-weight:600; font-size: 1.05rem; letter-spacing:-.01em;
}

/* ============================================================
   STAR STUDIO
   ============================================================ */
.starstudio__row{ display:flex; align-items:center; justify-content:space-between; gap: clamp(2rem,5vw,4rem); flex-wrap:wrap; }
.starstudio__content{ flex: 1 1 520px; }
.starstudio .btn{ flex: 0 0 auto; }

.starstudio__brand{ display:flex; align-items:center; gap: 1.8rem; margin-bottom: 2.8rem; }
.starstudio__logo{ width: clamp(76px, 9vw, 112px); }
.starstudio__word{ font-size: clamp(1.7rem, 3.2vw, 2.5rem); font-weight:600; letter-spacing:-.01em; }

.starstudio__prose{ max-width: 980px; }
.starstudio__prose p{ font-weight:600; margin-bottom:.7em; color: var(--text-dim); }
.starstudio__prose p:last-child{ margin-bottom:0; }
.starstudio__line--sm{ font-size: clamp(1.3rem, 2vw, 1.6rem); }
.starstudio__line--lg{ font-size: clamp(1.7rem, 3.2vw, 2.5rem); line-height:1.35; }
.starstudio__line--lg strong{ color: var(--text); font-weight:600; }
.starstudio__line--xl{ font-size: clamp(2.2rem, 4.4vw, 3.5rem); font-weight:600; color: var(--text); }

@media (max-width: 900px){
  .starstudio__row{ flex-direction:column; align-items:flex-start; }
}

.btn--shimmer{
  background-size: 220% 220%;
  background-position: 0% 50%;
  transition: background-position .7s var(--ease), transform .5s var(--ease), box-shadow .5s var(--ease);
}
.btn--shimmer:hover{ background-position: 100% 50%; }

/* ============================================================
   TESTIMONIOS — reel
   ============================================================ */
.testimonios{ overflow: hidden; }
.reel{ position:relative; margin-top: clamp(2.5rem,5vw,4rem); display:flex; align-items:center; justify-content:center; gap: 1.5rem; }
.reel__stage{
  position:relative; width:100%; max-width: 980px; height: clamp(440px, 56vw, 640px);
  display:flex; align-items:center; justify-content:center;
}
.reel__slide{
  position:absolute; border-radius: var(--radius-lg); overflow:hidden;
  width: clamp(300px, 42vw, 480px); height: clamp(380px, 52vw, 580px);
  box-shadow: 0 30px 60px -20px rgba(0,0,0,.7);
  transition: transform .7s var(--ease), opacity .7s var(--ease), filter .7s var(--ease);
  opacity:0; filter: blur(6px); transform: scale(.8) translateX(0);
  pointer-events:none;
}
.reel__slide img{ width:100%; height:100%; object-fit:cover; }
.reel__slide.is-active{ opacity:1; filter:blur(0); transform: scale(1) translateX(0); z-index:3; pointer-events:auto; }
.reel__slide.is-prev{ opacity:.45; filter: blur(3px); transform: scale(.82) translateX(-58%); z-index:2; }
.reel__slide.is-next{ opacity:.45; filter: blur(3px); transform: scale(.82) translateX(58%); z-index:2; }
.reel__arrow{
  flex: 0 0 auto; width:52px; height:52px; border-radius:50%;
  border: 1px solid var(--line); font-size:1.4rem;
  display:flex; align-items:center; justify-content:center;
  transition: border-color .4s var(--ease), background .4s var(--ease), transform .4s var(--ease);
}
.reel__arrow:hover{ border-color: var(--purple-dim); background: rgba(185,140,255,.08); transform: scale(1.06); }

/* ============================================================
   LONE QUOTE
   ============================================================ */
.lone-quote{ text-align:center; }
.lone-quote .container{ max-width: 900px; }
.lone-quote__text{
  font-size: clamp(1.5rem, 3.4vw, 2.4rem);
  font-weight: 600;
  color: var(--text-dim);
  line-height: 1.5;
  margin-bottom: .45em;
}
.lone-quote__text:last-child{ margin-bottom: 0; }
.lone-quote__text em{ font-style:normal; }

/* ============================================================
   FINAL CTA
   ============================================================ */
.final-cta{ background: var(--bg-alt); }
.final-cta__row{ display:flex; align-items:center; gap: clamp(2rem,5vw,4rem); flex-wrap: wrap; }
.final-cta__copy{ flex: 1 1 420px; }
.final-cta__copy .h-lg{ font-size: clamp(2.1rem, 4.4vw, 3.4rem); }
.final-cta__copy .h-sub{ font-size: clamp(1.15rem, 1.9vw, 1.4rem); text-align: justify; max-width: none; margin-top: 1.2rem; }
.final-cta .btn{ flex: 0 0 auto; }

/* ============================================================
   LOGOS MARQUEE
   ============================================================ */
/* ============================================================
   REDES SOCIALES
   ============================================================ */
.redes .container{ text-align:center; }
.redes .h-sub{ margin-bottom: clamp(2.5rem,5vw,3.5rem); }
.social-grid{
  display:flex; flex-wrap:wrap; justify-content:center;
  gap: clamp(1.8rem, 4vw, 3.2rem);
}
.social-item{
  display:flex; flex-direction:column; align-items:center; gap:1rem;
  width: 130px;
}
.social-item__ring{
  position:relative;
  width: 92px; height: 92px;
  border-radius:50%;
  display:flex; align-items:center; justify-content:center;
  transition: transform .5s var(--ease);
}
.social-item__ring::before{
  content:"";
  position:absolute; inset:0; border-radius:50%;
  background: conic-gradient(from 0deg, #ff5f6d, #ffc371, #47e0a0, #4fa9fe, #c06bdc, #ff5f6d);
  animation: ring-rotate 6s linear infinite, ring-shimmer 4.5s ease-in-out infinite;
}
.social-item__ring::after{
  content:"";
  position:absolute; inset:4px; border-radius:50%;
  background: var(--panel);
}
.social-item__icon{
  position:relative; z-index:1;
  width: 32px; height:32px;
  color: #f4f1f8;
  display:flex; align-items:center; justify-content:center;
}
.social-item__icon svg{ width:100%; height:100%; }
.social-item__label{
  font-weight:600; font-size:.92rem; color: var(--text-dim);
  transition: color .4s var(--ease);
}
.social-item:hover .social-item__ring{ transform: scale(1.08); }
.social-item:hover .social-item__label{ color: var(--text); }
@keyframes ring-rotate{ to{ transform: rotate(360deg); } }
@keyframes ring-shimmer{
  0%,100%{ filter: saturate(1.4) brightness(1.05) hue-rotate(0deg); }
  50%{ filter: saturate(1.9) brightness(1.25) hue-rotate(45deg); }
}
@media (prefers-reduced-motion: reduce){
  .social-item__ring::before{ animation: none; }
}

.logos{ padding-top: clamp(4rem,8vw,6rem); padding-bottom: clamp(4rem,8vw,6rem); }
.logos__eyebrow{
  position: relative;
  display: block;
  text-align:center; color: var(--text-dim);
  font-size: clamp(1.1rem, 2vw, 1.5rem); font-weight: 600;
  letter-spacing:.01em; text-transform:none;
  margin: 0 auto clamp(2.6rem,5vw,3.6rem);
  max-width: fit-content;
  padding: 1.1rem 2.2rem;
  border-radius: var(--radius-pill);
  border: 1px solid rgba(139,92,246,.3);
  background: linear-gradient(160deg, rgba(76,59,112,.35), rgba(21,18,28,.5));
  overflow: hidden;
}
.logos__eyebrow::before{
  content:"";
  position:absolute; inset:0; border-radius: inherit;
  background: radial-gradient(220px 140px at var(--mx,50%) var(--my,50%), rgba(185,140,255,.4), transparent 70%);
  opacity:0; transition: opacity .4s var(--ease);
  pointer-events:none;
}
.logos__eyebrow:hover::before{ opacity:1; }

.marquee{ overflow:hidden; -webkit-mask-image: linear-gradient(to right, transparent, #000 8%, #000 92%, transparent); mask-image: linear-gradient(to right, transparent, #000 8%, #000 92%, transparent); margin-bottom: 1.1rem; border-radius: var(--radius-lg); background: rgba(244,241,248,.96); }
.marquee__track{ display:flex; width:max-content; gap: 1.6rem; align-items:center; padding: 1.2rem 1.4rem; }
.marquee--a .marquee__track{ animation: marquee-left 46s linear infinite; }
.marquee--b .marquee__track{ animation: marquee-right 52s linear infinite; }
@keyframes marquee-left{ from{ transform: translateX(0); } to{ transform: translateX(-50%); } }
@keyframes marquee-right{ from{ transform: translateX(-50%); } to{ transform: translateX(0); } }
.logo-chip{
  flex: 0 0 auto;
  width: clamp(96px, 11vw, 132px);
  height: clamp(60px, 6.6vw, 78px);
  display:flex; align-items:center; justify-content:center;
  transition: transform .4s var(--ease);
}
.logo-chip img{ max-width:100%; max-height:100%; object-fit:contain; }
.logo-chip:hover{ transform: translateY(-3px) scale(1.06); }

/* ============================================================
   FOOTER
   ============================================================ */
.site-footer{
  display:flex; justify-content:space-between; align-items:center;
  padding: 2.4rem 6vw 3rem; font-size:.85rem; color: var(--text-faint);
  border-top: 1px solid var(--line-soft);
}
.site-footer a:hover{ color: var(--purple); }

/* ============================================================
   MODALS
   ============================================================ */
.modal{
  position: fixed; inset:0; z-index: 100;
  display:flex; align-items:center; justify-content:center;
  padding: 4vh 4vw;
  opacity:0; pointer-events:none;
  transition: opacity .5s var(--ease);
}
.modal.is-open{ opacity:1; pointer-events:auto; }
.modal__backdrop{
  position:absolute; inset:0;
  background: rgba(5,4,8,.82);
  backdrop-filter: blur(14px);
}
.modal__panel{
  position:relative; z-index:1;
  background: var(--panel);
  border: 1px solid var(--line);
  border-radius: var(--radius-xl);
  max-width: 980px; width:100%;
  max-height: 88vh; overflow-y:auto;
  padding: clamp(2rem, 4vw, 3.4rem);
  transform: translateY(30px) scale(.97);
  transition: transform .55s var(--ease-soft);
}
.modal.is-open .modal__panel{ transform: translateY(0) scale(1); }
.modal__close{
  position: absolute; top: clamp(1.2rem,3vw,2rem); right: clamp(1.2rem,3vw,2rem);
  width:40px; height:40px; border-radius:50%;
  background: rgba(255,255,255,.06); border:1px solid var(--line);
  display:flex; align-items:center; justify-content:center; z-index:5;
  transition: background .4s, transform .4s;
}
.modal__close:hover{ background: rgba(185,140,255,.15); transform: rotate(90deg); }

.modal__grid{ display:flex; gap: clamp(2rem,4vw,3.4rem); align-items:flex-start; flex-wrap:wrap; padding-right: 2.5rem; position:relative; z-index:1; }
.modal__prose{ flex: 1 1 360px; }
.modal__prose p{ color: var(--text-dim); font-weight:600; font-size: 1.05rem; margin-bottom: .8em; line-height:1.6; }

.modal__panel--historia{
  background: var(--bg-black);
  overflow: hidden;
  max-height: 90vh;
}
.modal__panel--historia .modal__grid{ overflow-y:auto; max-height: calc(90vh - clamp(4rem,8vw,6.8rem)); padding-right: 1.6rem; }
.modal__aurora{
  position:absolute; inset:-20%;
  background:
    radial-gradient(38% 30% at 20% 25%, rgba(139,92,246,.28), transparent 70%),
    radial-gradient(32% 26% at 80% 70%, rgba(185,140,255,.18), transparent 70%);
  filter: blur(10px);
  animation: aurora-drift 16s ease-in-out infinite;
  pointer-events:none;
}
@keyframes aurora-drift{
  0%,100%{ transform: translate(0,0) scale(1); }
  50%{ transform: translate(3%, -4%) scale(1.08); }
}
.modal__grain{
  position:absolute; inset:0; z-index:0;
  opacity:.1; mix-blend-mode:overlay; pointer-events:none;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}
@media (prefers-reduced-motion: reduce){ .modal__aurora{ animation:none; } }

.historia__chapter{ display:flex; gap:1.1rem; margin-bottom: 1.8rem; }
.historia__chapter:last-child{ margin-bottom:0; }
.historia__icon{
  flex: 0 0 auto;
  width:42px; height:42px; margin-top:.15rem;
  display:flex; align-items:center; justify-content:center;
  border-radius: var(--radius-md);
  background: rgba(185,140,255,.1);
  border: 1px solid rgba(185,140,255,.28);
  color: var(--purple);
  animation: icon-pulse 3.6s ease-in-out infinite;
}
.historia__icon svg{ width:20px; height:20px; }
.historia__chapter--climax .historia__icon{
  background: rgba(185,140,255,.18);
  box-shadow: 0 0 24px rgba(160,110,255,.35);
}
.historia__text{ flex: 1 1 auto; }
@keyframes icon-pulse{
  0%,100%{ box-shadow: 0 0 0 0 rgba(185,140,255,0); }
  50%{ box-shadow: 0 0 0 6px rgba(185,140,255,.08); }
}
@media (prefers-reduced-motion: reduce){ .historia__icon{ animation:none; } }

/* ---------- orbit photo (rotating name ring) ---------- */
.orbit-photo{
  position: relative;
  width: min(60vw, 320px); aspect-ratio:1;
  flex: 0 0 auto; margin: 0 auto;
}
.orbit-photo__img{
  position:absolute; inset: 13%;
  width:74%; height:74%; border-radius:50%;
  object-fit:cover; z-index:1;
  box-shadow: 0 0 0 1px var(--line), 0 20px 50px -16px rgba(0,0,0,.7);
}
.orbit-photo__ring{
  position:absolute; inset:0; width:100%; height:100%;
  animation: spin 18s linear infinite;
}
.orbit-photo__text{
  fill: var(--purple);
  font-family:'Stem'; font-weight:600;
  font-size: 20px; letter-spacing: 2px;
}

/* ---------- gallery modal ---------- */
.gallery__title{ font-size: 1.6rem; margin-bottom: 1.4rem; padding-right: 2.5rem; }
.gallery__stage{ display:flex; align-items:center; gap: 1rem; }
.gallery__frame{
  flex:1; border-radius: var(--radius-lg); overflow:hidden;
  height: min(62vh, 640px); background: rgba(255,255,255,.03);
  display:flex; align-items:center; justify-content:center;
}
.gallery__img{ width:auto; height:auto; max-width:100%; max-height:100%; object-fit: contain; transition: opacity .35s var(--ease); border-radius: var(--radius-md); }
.gallery__img.is-fading{ opacity:0; }
.gallery__arrow{
  flex:0 0 auto; width:48px; height:48px; border-radius:50%;
  border:1px solid var(--line); font-size:1.3rem;
  display:flex; align-items:center; justify-content:center;
  transition: border-color .4s, background .4s;
}
.gallery__arrow:hover{ border-color: var(--purple-dim); background: rgba(185,140,255,.08); }
.gallery__count{ text-align:center; margin-top:1rem; color: var(--text-faint); font-size:.85rem; }

/* ---------- clon chat modal ---------- */
.modal__panel--clon{ max-width: 620px; }
.clonchat{ display:flex; flex-direction:column; clear:both; }
.clonchat__header{ display:flex; align-items:center; gap:.9rem; margin-bottom: 1.4rem; padding-right: 2.5rem; }
.clonchat__avatar{
  width:44px; height:44px; border-radius:50%; flex:0 0 auto;
  display:flex; align-items:center; justify-content:center;
  background: linear-gradient(135deg, var(--purple-2), var(--purple-deep));
  color:#fff; font-weight:600; font-size:.9rem;
}
.clonchat__name{ font-weight:600; font-size:1rem; color: var(--text); }
.clonchat__status{ font-size:.82rem; color: var(--text-faint); display:flex; align-items:center; gap:.4rem; margin-top:.15rem; }
.clonchat__status-dot{ width:7px; height:7px; border-radius:50%; background:#38e88b; box-shadow:0 0 8px 1px rgba(56,232,139,.7); }

.clonchat__thread{
  display:flex; flex-direction:column; gap:.7rem;
  max-height: 44vh; overflow-y:auto;
  padding: .3rem .2rem 1rem;
  margin-bottom: 1rem;
}
.clonchat__bubble{
  max-width: 82%;
  padding: .75rem 1.05rem;
  border-radius: var(--radius-md);
  font-size: 1rem; line-height:1.5; font-weight:600;
  animation: bubble-in .4s var(--ease) both;
}
@keyframes bubble-in{ from{ opacity:0; transform: translateY(10px); } to{ opacity:1; transform:none; } }
.clonchat__bubble--bot{
  align-self:flex-start;
  background: rgba(255,255,255,.05);
  border: 1px solid var(--line);
  border-bottom-left-radius: 4px;
  color: var(--text-dim);
}
.clonchat__bubble--user{
  align-self:flex-end;
  background: linear-gradient(135deg, var(--purple-2), var(--purple-deep));
  border-bottom-right-radius: 4px;
  color: #fff; font-weight: 500;
}
.clonchat__typing{ display:flex; align-items:center; gap:5px; padding: 1rem 1.1rem; }
.clonchat__typing span{
  width:7px; height:7px; border-radius:50%;
  background: var(--text-faint);
  animation: typing-bounce 1.1s ease-in-out infinite;
}
.clonchat__typing span:nth-child(2){ animation-delay: .15s; }
.clonchat__typing span:nth-child(3){ animation-delay: .3s; }
@keyframes typing-bounce{
  0%, 60%, 100%{ transform: translateY(0); opacity:.5; }
  30%{ transform: translateY(-4px); opacity:1; }
}
.clonchat__topics{ display:flex; flex-wrap:wrap; gap:.6rem; margin-bottom: 1.2rem; }
.clonchat__topic{
  padding: .6rem 1.1rem;
  border-radius: var(--radius-pill);
  border: 1px solid var(--line);
  font-size: .85rem; font-weight: 600; color: var(--text-dim);
  transition: border-color .4s var(--ease), background .4s var(--ease), color .4s var(--ease);
}
.clonchat__topic:hover{ border-color: var(--purple-dim); background: rgba(185,140,255,.08); color: var(--text); }
.clonchat__cta{ align-self: stretch; justify-content:center; }

body.modal-open{ overflow:hidden; }

/* ============================================================
   CUSTOM CURSOR (stars)
   ============================================================ */
.cursor-orbit{
  position: fixed; top:0; left:0; z-index: 200;
  pointer-events:none; width:0; height:0;
  mix-blend-mode: difference;
}
html.has-custom-cursor, html.has-custom-cursor *{ cursor: none !important; }
.cursor-pt{
  position:absolute; top:0; left:0;
  will-change: transform;
}
.cursor-star{
  position:absolute; top:0; left:0;
  display:block;
  background: var(--purple);
  clip-path: polygon(50% 0%, 61% 35%, 98% 35%, 68% 57%, 79% 91%, 50% 70%, 21% 91%, 32% 57%, 2% 35%, 39% 35%);
  opacity: .35;
  transform: translate(-50%,-50%) scale(.5);
  transition: opacity .35s var(--ease), transform .4s var(--ease);
  will-change: transform;
}
.cursor-star--core{ width:14px; height:14px; }
.cursor-star--a{ width:8px; height:8px; opacity:.2; }
.cursor-star--b{ width:6px; height:6px; opacity:.15; }
html.cursor-grow .cursor-pt--core .cursor-star{ transform: translate(-50%,-50%) scale(3.2); opacity:1; }
html.cursor-grow .cursor-pt--a .cursor-star{ transform: translate(-50%,-50%) scale(3.6); opacity:.6; }
html.cursor-grow .cursor-pt--b .cursor-star{ transform: translate(-50%,-50%) scale(3); opacity:.5; }

/* ============================================================
   RESPONSIVE
   ============================================================ */
@media (max-width: 900px){
  .card-grid, .card-grid--numbers{ grid-template-columns: repeat(2,1fr); }
  .card-grid--numbers .card--quote{ grid-column: span 2; }
  .service-grid{ grid-template-columns: repeat(2,1fr); }
  .service-card:nth-child(5){ grid-column: span 2; grid-row: span 1; }
}

@media (max-width: 640px){
  .card-grid, .card-grid--numbers, .service-grid{ grid-template-columns: 1fr; }
  .card-grid--numbers .card--quote{ grid-column: span 1; }
  .service-card:nth-child(5){ grid-column: span 1; grid-row: span 1; }
  .final-cta__row{ flex-direction: column; align-items:flex-start; }
  .method__stage{ width: min(84vw, 320px); }
  .orbit-photo{ width: min(70vw, 260px); }
  html.has-custom-cursor, html.has-custom-cursor *{ cursor: auto !important; }
  .cursor-orbit{ display:none; }
}

@media (hover:none) and (pointer:coarse){
  .cursor-orbit{ display:none; }
}