:root{
  --black:#050505;
  --gold:#D4AF37;
  --white:#EAEAEA;
  --font-head:'Syncopate',sans-serif;
  --font-serif:'Playfair Display',serif;
  --font-body:'Manrope',sans-serif;
  --font-mono:'Share Tech Mono',monospace;
}

*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{background:var(--black);color:var(--white);font-family:var(--font-body);overflow-x:hidden}
img{max-width:100%;display:block}

/* Reduce motion */
@media (prefers-reduced-motion: reduce){
  *{animation:none!important;transition:none!important;scroll-behavior:auto!important}
  [data-reveal]{opacity:1!important;transform:none!important;filter:none!important}
}

/* Iluminación dorada sutil global */
body::before{
  content:"";
  position:fixed;
  inset:-20%;
  pointer-events:none;
  z-index:-4;
  background:
    radial-gradient(700px 360px at 15% 12%, rgba(212,175,55,.16), transparent 60%),
    radial-gradient(600px 320px at 85% 25%, rgba(212,175,55,.12), transparent 62%),
    radial-gradient(900px 520px at 50% 95%, rgba(212,175,55,.08), transparent 60%);
  filter:blur(1px);
}

/* Puntos infinitos (como capa adicional) */
.dotfield{
  position:fixed;
  inset:0;
  pointer-events:none;
  z-index:-3;
  opacity:.09;
  mix-blend-mode:screen;
  background-image:
    radial-gradient(rgba(212,175,55,.55) 1px, transparent 1px),
    radial-gradient(rgba(255,255,255,.12) 1px, transparent 1px);
  background-size: 64px 64px, 120px 120px;
  background-position: 0 0, 30px 40px;
  animation: dotsDrift 28s linear infinite;
}
@keyframes dotsDrift{
  0%{background-position: 0 0, 30px 40px}
  100%{background-position: -520px 520px, 430px -430px}
}

/* Canvas de partículas (JS) */
#god-bg{
  position:fixed;top:0;left:0;width:100%;height:100%;
  z-index:-2;
  pointer-events:none;
}

/* Ruido */
.noise-overlay{
  position:fixed;top:0;left:0;width:100%;height:100%;
  pointer-events:none;z-index:9000;opacity:.04;
  background:url('https://grainy-gradients.vercel.app/noise.svg');
}

/* Cursor custom (solo desktop) */
.cursor,.cursor-follower{display:none}
@media (pointer:fine){
  body{cursor:none}
  .cursor{
    display:block;width:10px;height:10px;background:var(--gold);
    border-radius:50%;position:fixed;pointer-events:none;
    z-index:999999;mix-blend-mode:difference;will-change:transform
  }
  .cursor-follower{
    display:block;width:40px;height:40px;border:1px solid var(--gold);
    border-radius:50%;position:fixed;pointer-events:none;
    z-index:999998;will-change:transform
  }
}

/* PRELOADER */
.preloader{
  position:fixed;inset:0;background:#000;z-index:20000;
  display:flex;justify-content:center;align-items:center;
  transform-origin:top;
}
.loader-content{display:flex;flex-direction:column;align-items:center;gap:20px}
.loader-logo-wrap{
  font-family:var(--font-head);font-size:5rem;font-weight:700;
  display:flex;gap:10px;overflow:hidden
}
.l-letter{color:#fff;transform:translateY(100%)}
.l-amp{color:var(--gold);transform:translateY(100%)}
.loader-line-mask{width:250px;height:2px;background:#222;overflow:hidden;position:relative}
.loader-line{width:100%;height:100%;background:var(--gold);transform:translateX(-100%)}

/* MENU OVERLAY */
.menu-overlay{
  position:fixed;inset:0;background:#000;z-index:20000;
  display:flex;flex-direction:column;justify-content:center;align-items:center;
  opacity:0;pointer-events:none;transition:opacity .3s;
}
.menu-overlay.active{opacity:1;pointer-events:all}
.menu-links{display:flex;flex-direction:column;gap:2rem;text-align:center}
.menu-link{
  font-family:var(--font-head);font-size:3rem;color:#fff;text-decoration:none;
  transition:.2s;-webkit-text-stroke:1px transparent;
}
.menu-link:hover{color:transparent;-webkit-text-stroke:1px var(--gold);transform:scale(1.05)}
.close-menu-btn{
  position:absolute;top:30px;right:30px;background:none;border:none;
  color:var(--gold);font-size:2rem;cursor:pointer
}

/* NAV */
.nav{
  position:fixed;top:0;width:100%;padding:1.5rem 5%;
  display:flex;justify-content:space-between;align-items:center;z-index:10000
}
.nav-blur{
  position:absolute;inset:0;background:rgba(0,0,0,.85);
  backdrop-filter:blur(8px);z-index:-1;border-bottom:1px solid rgba(212,175,55,.2)
}
.logo{
  font-family:var(--font-head);font-weight:700;font-size:1.5rem;color:#fff;
  text-shadow:0 0 10px rgba(212,175,55,.3)
}
.gold-accent{color:var(--gold);margin:0 5px}
.menu-bar{display:flex;align-items:center;gap:15px;cursor:pointer}
.menu-txt{font-family:var(--font-head);font-size:.8rem;color:var(--gold)}
.menu-icon{width:30px;display:flex;flex-direction:column;gap:6px;align-items:flex-end}
.menu-icon span{width:100%;height:2px;background:var(--gold);transition:.3s}

/* REVEAL fallback */
[data-reveal]{opacity:0;transform:translateY(18px);filter:blur(2px)}
.revealed{opacity:1;transform:translateY(0);filter:blur(0)}

/* CTA */
.hero-cta-row{display:flex;gap:12px;flex-wrap:wrap;margin-top:1.7rem}
.cta-gold,.cta-ghost{
  display:inline-flex;align-items:center;justify-content:center;
  padding:12px 18px;border-radius:999px;text-decoration:none;
  font-family:var(--font-head);font-size:.75rem;letter-spacing:2px;
  transition:.2s;cursor:pointer
}
.cta-gold{
  background:var(--gold);color:#000;border:1px solid var(--gold);
  box-shadow:0 10px 40px rgba(212,175,55,.18)
}
.cta-gold:hover{transform:translateY(-1px);filter:brightness(1.03)}
.cta-ghost{background:transparent;color:#fff;border:1px solid rgba(212,175,55,.35)}
.cta-ghost:hover{transform:translateY(-1px);border-color:var(--gold);color:var(--gold)}

/* HERO */
.hero{
  min-height:100vh;display:flex;align-items:center;padding:0 5%;
  position:relative;perspective:1000px;padding-top:100px
}
.hero-layout{display:grid;grid-template-columns:1.2fr 1fr;gap:2rem;width:100%;align-items:center}
.hero-title{font-family:var(--font-head);font-size:5vw;line-height:.9;font-weight:900}
.outline-text{-webkit-text-stroke:1px var(--white);color:transparent}
.gold-text{color:var(--gold);text-shadow:0 0 30px rgba(212,175,55,.4)}
.hero-sub{
  margin-top:2rem;border-left:3px solid var(--gold);
  padding-left:1.5rem;color:#bbb;max-width:680px;line-height:1.7
}

.hero-microfacts{
  margin-top:1.6rem;display:grid;grid-template-columns:repeat(3,1fr);
  gap:12px;max-width:720px
}
.mf{border:1px solid rgba(255,255,255,.08);background:rgba(0,0,0,.25);padding:12px}
.mf-k{font-family:var(--font-head);font-size:.65rem;letter-spacing:2px;color:rgba(212,175,55,.9);margin-bottom:6px}
.mf-v{color:#cfcfcf;font-size:.95rem;line-height:1.45}

/* Scroll hint */
.scroll-hint{
  position:absolute;left:50%;bottom:22px;transform:translateX(-50%);
  width:28px;height:56px;display:flex;flex-direction:column;align-items:center;
  gap:10px;opacity:.9;text-decoration:none
}
.sh-dot{
  width:8px;height:8px;border-radius:50%;background:var(--gold);
  box-shadow:0 0 18px rgba(212,175,55,.6);
  animation:sh 1.6s ease-in-out infinite
}
.sh-line{width:2px;height:28px;background:rgba(212,175,55,.6)}
@keyframes sh{
  0%{transform:translateY(0);opacity:.8}
  50%{transform:translateY(10px);opacity:1}
  100%{transform:translateY(0);opacity:.8}
}

/* Cámara */
.camera-container{width:100%;height:400px;display:flex;align-items:center;justify-content:center;perspective:1000px}
.camera-3d{width:320px;height:220px;position:relative;transform-style:preserve-3d;transition:transform .1s;will-change:transform}
.camera-body{width:100%;height:100%;background:#111;border-radius:30px;border:1px solid #333;box-shadow:20px 20px 60px rgba(0,0,0,.8);position:relative}
.lens-ring{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:160px;height:160px;background:#080808;border-radius:50%;border:4px solid #222;display:flex;align-items:center;justify-content:center;box-shadow:0 0 30px rgba(0,0,0,.8)}
.lens-glass{width:120px;height:120px;background:#000;border-radius:50%;border:2px solid var(--gold);position:relative;overflow:hidden}
.reflection{width:150%;height:100%;background:linear-gradient(120deg,rgba(255,255,255,.2) 0%,transparent 40%,rgba(212,175,55,.1) 100%);transform:skewX(-20deg)}
.flash{position:absolute;top:20px;right:30px;width:40px;height:15px;background:#fff;border-radius:4px;box-shadow:0 0 15px #fff}
.sensor-light{position:absolute;top:25px;left:30px;width:8px;height:8px;background:#f00;border-radius:50%;animation:blink 2s infinite}
@keyframes blink{0%,100%{opacity:1}50%{opacity:.2}}

/* Labels */
.label-gold{
  font-family:var(--font-head);color:var(--gold);
  letter-spacing:3px;font-size:.8rem;display:block;margin-bottom:1rem
}
.slider-help{
  margin-top:1rem;color:#9c9c9c;max-width:820px;margin-left:auto;margin-right:auto;
  line-height:1.6
}

/* Slider principal */
.transformation-main{padding:8rem 5% 4rem;background:#080808;position:relative;overflow:hidden}
.section-header{text-align:center;margin-bottom:2rem}
.section-header h2{font-family:var(--font-serif);font-size:3.5rem;color:#fff;text-shadow:0 0 20px rgba(255,255,255,.1)}

.tape-container{
  width:120%;margin-left:-10%;margin-bottom:4rem;transform:rotate(-2deg);
  background:var(--gold);padding:5px 0;border-top:2px solid #fff;border-bottom:2px solid #fff;
  box-shadow:0 0 20px rgba(212,175,55,.5)
}
.glitch-tape{display:flex;width:fit-content;animation:tapeScroll 15s linear infinite;will-change:transform}
.tape-content{white-space:nowrap;font-family:var(--font-head);font-size:1.5rem;color:#000;font-weight:900;padding-right:50px}
@keyframes tapeScroll{0%{transform:translateX(0)}100%{transform:translateX(-50%)}}

.main-slider-container{
  width:100%;max-width:1100px;margin:0 auto;
  border:1px solid var(--gold);box-shadow:0 0 50px rgba(212,175,55,.1)
}
.comparison-slider{
  position:relative;width:100%;aspect-ratio:16/9;overflow:hidden;
  cursor:col-resize;touch-action:pan-y
}
.img-layer{position:absolute;top:0;left:0;width:100%;height:100%}
.img-layer img{width:100%;height:100%;object-fit:contain}
.layer-before{background:#000;z-index:1}
.layer-after{z-index:2;clip-path:inset(0 50% 0 0)}
.handle{position:absolute;top:0;bottom:0;left:50%;width:2px;background:var(--gold);z-index:10;pointer-events:none}
.handle-circle{
  position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);
  width:40px;height:40px;background:var(--gold);border-radius:50%;
  box-shadow:0 0 15px var(--gold)
}
.img-tag{
  position:absolute;top:20px;padding:5px 15px;background:rgba(0,0,0,.8);
  border:1px solid #333;font-size:.7rem;color:#fff;z-index:5
}
.tag-right{right:20px;color:var(--gold);border-color:var(--gold)}
.tag-left{left:20px}

/* DNA */
.dna-memory{padding:8rem 5%;background:#050505;border-top:1px solid #222}
.dna-title{font-family:var(--font-serif);font-size:4rem;text-align:center;margin-bottom:2rem}
.dna-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:3rem}
.dna-card{padding:2rem;border:1px solid #222;background:#080808;transition:.3s;position:relative}
.dna-card:hover{border-color:var(--gold);transform:translateY(-5px)}
.dna-icon{font-family:var(--font-head);font-size:3rem;color:var(--gold);opacity:.5;margin-bottom:1rem}
.dna-card h3{font-family:var(--font-serif);font-size:1.5rem;margin-bottom:1rem;color:#fff}
.dna-card p{color:#aaa;font-size:.95rem;line-height:1.7}

/* PERSONALIZADO */
.personalizado{padding:8rem 5%;background:#070707;border-top:1px solid #111;border-bottom:1px solid #111}
.perso-head{max-width:1100px;margin:0 auto 2rem;text-align:center}
.perso-title{font-family:var(--font-serif);font-size:3.2rem;color:#fff}
.perso-desc{color:#bdbdbd;max-width:980px;margin:1rem auto 0;line-height:1.75}
.perso-grid{max-width:1200px;margin:2.2rem auto 0;display:grid;grid-template-columns:repeat(4,1fr);gap:1.2rem}

.perso-card{
  text-align:left;
  background:radial-gradient(700px 240px at 20% 0%, rgba(212,175,55,.18), transparent 60%), #050505;
  border:1px solid #222;padding:1.2rem;cursor:pointer;
  transition:transform .18s ease,border-color .18s ease,box-shadow .18s ease;
  transform-style:preserve-3d;will-change:transform
}
.perso-card:hover{
  border-color:rgba(212,175,55,.7);
  transform:perspective(900px) rotateX(6deg) rotateY(-8deg) translateY(-2px);
  box-shadow:0 18px 60px rgba(0,0,0,.55)
}
.perso-card.is-active{border-color:var(--gold);box-shadow:0 0 0 1px rgba(212,175,55,.25),0 18px 65px rgba(0,0,0,.6)}
.pc-top{display:flex;justify-content:space-between;align-items:center;margin-bottom:.9rem}
.pc-chip{
  display:inline-block;padding:6px 10px;border:1px solid rgba(212,175,55,.35);
  color:var(--gold);font-family:var(--font-head);font-size:.65rem;letter-spacing:2px;background:rgba(0,0,0,.35)
}
.pc-num{font-family:var(--font-mono);color:rgba(255,255,255,.35);font-size:1rem}
.perso-card h3{font-family:var(--font-serif);font-size:1.35rem;color:#fff;margin-bottom:.4rem}
.perso-card p{color:#b8b8b8;line-height:1.6}

.perso-note{max-width:1000px;margin:1.6rem auto 0}
.note-box{border:1px solid #222;background:#050505;padding:1rem}
.note-title{font-family:var(--font-head);font-size:.7rem;letter-spacing:2px;color:rgba(212,175,55,.85);margin-bottom:.5rem}
.note-text{color:#bdbdbd;line-height:1.65}

/* GOLD INVASION */
.gold-invasion{
  position:relative;padding:15vh 5%;
  background:var(--gold);
  text-align:center;min-height:70vh;
  display:flex;align-items:center;justify-content:center;
  overflow:hidden
}
#explosion-canvas{
  position:absolute;top:0;left:0;width:100%;height:100%;
  pointer-events:none; /* canvas de lluvia negra (JS) */
}
.glitch-container{position:relative;z-index:2}
.glitch-title-mega{
  font-family:var(--font-head);
  font-size:clamp(3rem,7vw,7rem);
  font-weight:900;line-height:.9;color:#000;
  text-shadow:4px 4px 0 rgba(255,255,255,.2)
}

/* PORTFOLIO */
.showcase-section{background:var(--black);overflow:hidden;position:relative}
.showcase-header-vip{padding:6rem 5% 2rem;max-width:1400px;margin:0 auto;position:relative;z-index:10}
.section-title-left{font-family:var(--font-serif);font-size:4rem;line-height:1}
.showcase-desc{color:#888;font-size:1.1rem}

.pin-wrap-container{height:100vh;display:flex;align-items:center;overflow:hidden}
.cases-horizontal-grid{display:flex;gap:4vw;padding-left:5vw;width:max-content}

.case-card{width:60vh;max-width:600px;flex-shrink:0;cursor:pointer;transition:transform .3s}
.case-card:hover{transform:scale(1.02)}
.case-visual{position:relative;aspect-ratio:4/3;overflow:hidden;border:1px solid #222;background:#050505}
.img-base{width:100%;height:100%;object-fit:contain;transition:.5s}
.case-overlay{
  position:absolute;inset:0;background:rgba(0,0,0,.5);
  display:flex;align-items:center;justify-content:center;
  opacity:0;transition:.3s;backdrop-filter:blur(3px)
}
.case-card:hover .case-overlay{opacity:1}
.overlay-text{border:1px solid var(--gold);padding:10px 20px;color:var(--gold);font-family:var(--font-head);font-size:.8rem;background:#000}
.case-info{padding:1rem 0;border-bottom:1px solid #222}
.case-info h3{font-family:var(--font-serif);font-size:1.3rem;color:#fff}

/* MODAL */
.case-modal{
  position:fixed;inset:0;z-index:15000;
  opacity:0;pointer-events:none;transition:.35s;
  display:flex;align-items:center;justify-content:center
}
.case-modal.active{opacity:1;pointer-events:all}
.modal-overlay{position:absolute;inset:0;background:rgba(0,0,0,.95);backdrop-filter:blur(5px)}
.modal-wrapper{
  position:relative;
  width:min(1400px,92vw);
  height:min(86vh,860px);
  background:#050505;border:1px solid var(--gold);
  z-index:2;padding:2rem;
  display:flex;flex-direction:column;
  box-shadow:0 0 50px rgba(212,175,55,.2);
  overflow:hidden; /* CLAVE: nada se sale */
}
.close-modal{
  position:absolute;top:20px;right:20px;
  background:none;border:1px solid var(--gold);
  color:var(--gold);padding:8px 15px;
  cursor:pointer;font-family:var(--font-head);
  font-size:.7rem;z-index:20;transition:.2s
}
.close-modal:hover{transform:translateY(-1px)}
.modal-grid{
  display:flex;
  height:100%;
  gap:2.2rem;
  margin-top:.5rem;
  min-height:0; /* CLAVE para flex overflow */
}
.modal-visual-col{
  flex:1.55;
  min-width:0;
  height:100%;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  background:#020202;
  border:1px solid #222;
  position:relative;
  overflow:hidden;
}
.modal-comparison{width:100%;height:100%}
.modal-comparison img{object-fit:contain}

.modal-info-col{
  flex:1;
  min-width:0;     /* CLAVE: permite wrap y no desborda */
  height:100%;
  display:flex;
}
.modal-info-scroll{
  width:100%;
  height:100%;
  min-height:0;    /* CLAVE para que el overflow funcione */
  overflow:auto;   /* SCROLL interno, no se sale del cuadro */
  padding-right:10px;
}
.modal-title{
  font-family:var(--font-serif);
  font-size:2.4rem;
  color:var(--gold);
  line-height:1.1;
  text-shadow:0 0 20px rgba(212,175,55,.3);
  margin-top:.3rem;
}
.modal-line{width:50px;height:3px;background:#fff;margin:1.2rem 0}
.modal-story-content{
  font-size:1.08rem;
  line-height:1.75;
  color:#ccc;
  margin-bottom:2rem;
  overflow-wrap:anywhere; /* evita que se salga por palabras largas */
}
.slider-help--modal{margin-top:10px;color:#a3a3a3;text-align:center}

/* Scrollbar (webkit) para modal */
.modal-info-scroll::-webkit-scrollbar{width:10px}
.modal-info-scroll::-webkit-scrollbar-track{background:#0a0a0a;border-left:1px solid rgba(255,255,255,.06)}
.modal-info-scroll::-webkit-scrollbar-thumb{background:rgba(212,175,55,.35);border:2px solid #0a0a0a;border-radius:10px}
.modal-info-scroll::-webkit-scrollbar-thumb:hover{background:rgba(212,175,55,.55)}

/* BIO */
.bio-section-vip{padding:8rem 5%;background:#050505;border-bottom:1px solid #111}
.bio-container-vip{display:grid;grid-template-columns:1fr 1fr;gap:6rem;align-items:center;max-width:1500px;margin:0 auto}
.deyby-layout{grid-template-columns:1fr 1fr}
.image-wrapper-vip{position:relative;overflow:hidden;box-shadow:0 20px 50px rgba(0,0,0,.5)}
.image-wrapper-vip img{width:100%;filter:grayscale(100%);transition:.5s}
.image-wrapper-vip:hover img{filter:grayscale(0%);transform:scale(1.02)}
.bio-name-vip{
  font-family:var(--font-serif);
  font-size:4rem;
  color:var(--gold);
  margin:1rem 0;
  text-shadow:0 0 30px rgba(212,175,55,.2)
}
.line-gold-vip{width:80px;height:3px;background:var(--gold);margin-bottom:2rem;box-shadow:0 0 10px var(--gold)}
.bio-subtitle-vip{font-family:var(--font-serif);font-size:1.8rem;color:#666;margin-bottom:2rem;font-style:italic}
.bio-text-vip p{font-size:1.1rem;line-height:1.8;color:#aaa;margin-bottom:1rem}
.bio-badges{display:flex;gap:10px;margin-top:2rem;flex-wrap:wrap}
.badge{border:1px solid #333;padding:5px 15px;font-family:var(--font-head);font-size:.7rem;color:var(--gold);letter-spacing:2px}

/* PACTO + GALERÍA */
.alliance-fullscreen{position:relative;width:100%;height:100vh;overflow:hidden}
.pacto-bg-container{position:absolute;inset:0}
.alliance-bg-image{width:100%;height:100%;object-fit:cover;object-position:center;opacity:.5}
.alliance-content-overlay{position:absolute;bottom:0;left:0;width:100%;padding:5rem 5%;background:linear-gradient(to top,#000,transparent)}
.alliance-title-vip{font-family:var(--font-head);font-size:5rem;color:var(--gold);font-weight:900;text-shadow:0 0 30px rgba(212,175,55,.3)}
.alliance-subtitle-vip{font-family:var(--font-serif);font-size:2rem;color:#fff}

.gallery-large-vip{display:grid;grid-template-columns:1fr 1fr}
.gallery-item-large{height:100vh;position:relative;overflow:hidden}
.gallery-item-large img{width:100%;height:100%;object-fit:cover;transition:1s}
.gallery-item-large:hover img{transform:scale(1.03)}
.gallery-text-overlay{position:absolute;bottom:0;left:0;width:100%;padding:3rem;background:linear-gradient(to top,rgba(0,0,0,.9),transparent)}
.gallery-text-overlay h3{font-family:var(--font-head);font-size:2rem;color:var(--gold)}

/* PROCESO */
.process-vip-alive{padding:10rem 5%;background:#0a0a0a}
.process-container-vip{max-width:1200px;margin:0 auto}
.process-title-vip{font-family:var(--font-serif);font-size:3.5rem;text-align:center;color:var(--gold);margin-bottom:5rem}
.process-cards-container{display:grid;grid-template-columns:repeat(3,1fr);gap:2rem}
.process-card{background:#050505;border:1px solid #222;padding:2rem;position:relative;overflow:hidden;transition:.4s}
.process-card:hover{border-color:var(--gold);transform:translateY(-5px)}
.p-card-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:1.5rem}
.p-num{font-family:var(--font-mono);font-size:2rem;color:#333}
.p-status-light{width:10px;height:10px;background:#333;border-radius:50%}
.process-card:hover .p-status-light{background:var(--gold);box-shadow:0 0 10px var(--gold)}
.process-card:hover .p-status-light.success{background:#0f0;box-shadow:0 0 10px #0f0}
.p-title{font-family:var(--font-head);font-size:1.2rem;color:#fff;margin-bottom:1.5rem;min-height:3rem}
.p-bar-container{width:100%;height:2px;background:#222;margin-bottom:1.5rem;position:relative}
.p-bar-fill{width:0;height:100%;background:var(--gold);transition:width 1s ease-in-out}
.process-card:hover .p-bar-fill{width:100%}
.p-desc{font-size:.9rem;color:#888;line-height:1.6}

/* FAQ */
.faq{padding:9rem 5%;background:#060606;border-top:1px solid rgba(255,255,255,.06)}
.faq-head{max-width:1000px;margin:0 auto 2rem;text-align:center}
.faq-title{font-family:var(--font-serif);font-size:3.2rem;color:#fff}
.faq-desc{color:#bdbdbd;margin-top:.8rem;line-height:1.7}
.faq-wrap{max-width:1000px;margin:2rem auto 0;display:flex;flex-direction:column;gap:12px}

.faq-item{border:1px solid #222;background:#050505;overflow:hidden}
.faq-q{
  width:100%;
  background:transparent;border:none;
  padding:18px 18px;
  display:flex;align-items:center;justify-content:space-between;gap:14px;
  color:#fff;cursor:pointer;text-align:left;
  font-family:var(--font-serif);font-size:1.1rem;
}
.faq-ico{font-family:var(--font-head);color:var(--gold);letter-spacing:2px;transition:transform .2s}
.faq-a{
  padding:0 18px 18px;
  color:#bdbdbd;line-height:1.75;
  border-top:1px solid rgba(255,255,255,.06)
}
.faq-item.is-open{border-color:rgba(212,175,55,.55);box-shadow:0 10px 40px rgba(0,0,0,.35)}
.faq-item.is-open .faq-ico{transform:rotate(45deg)}

/* TESTIMONIOS */
.testimonials{padding:9rem 5%;background:#080808;border-top:1px solid rgba(255,255,255,.06)}
.center-title-vip{text-align:center;font-family:var(--font-serif);font-size:3.5rem;margin-bottom:4rem;color:#fff}
.testi-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:2rem}
.testi-card{padding:2rem;border:1px solid #222;background:#050505;transition:.3s;will-change:transform}
.testi-card:hover{border-color:var(--gold);box-shadow:0 5px 20px rgba(212,175,55,.1);transform:translateY(-2px)}
.testi-text{font-family:var(--font-serif);font-size:1.1rem;color:#ccc;font-style:italic;margin-bottom:1.5rem;line-height:1.7}
.testi-author{display:flex;align-items:center;gap:15px}
.testi-author img{width:50px;height:50px;border-radius:50%;object-fit:cover;border:1px solid var(--gold)}

/* FOOTER */
.footer{padding:4rem 5%;text-align:center;background:#000;border-top:1px solid #222}
.footer h2{font-family:var(--font-head);letter-spacing:2px}
.footer p{color:#888;margin-top:10px}

/* Responsive */
@media (max-width:1100px){
  .perso-grid{grid-template-columns:repeat(2,1fr)}
  .dna-grid{grid-template-columns:1fr;gap:1.4rem}
  .process-cards-container{grid-template-columns:1fr}
  .bio-container-vip{grid-template-columns:1fr;gap:3rem}
  .gallery-large-vip{grid-template-columns:1fr}
  .testi-grid{grid-template-columns:repeat(2,1fr)}
}

@media (max-width:900px){
  .hero-layout{grid-template-columns:1fr}
  .hero{padding-top:120px;text-align:center}
  .hero-visual-side{order:-1;height:300px}
  .camera-3d{transform:scale(.7)}
  .hero-title{font-size:13vw}
  .hero-microfacts{grid-template-columns:1fr;max-width:520px;margin-left:auto;margin-right:auto}

  .pin-wrap-container{height:auto;display:block;overflow-x:auto;padding:2rem 0;-webkit-overflow-scrolling:touch}
  .cases-horizontal-grid{padding:0 5%;width:auto;gap:20px}
  .case-card{width:85vw}

  .modal-grid{display:block;overflow:hidden}
  .modal-wrapper{padding:1.2rem;height:min(90vh,920px)}
  .modal-visual-col{height:40vh;margin-bottom:1rem}
  .modal-info-col{height:calc(90vh - 40vh - 120px)}
  .modal-info-scroll{height:100%}
  .glitch-title-mega{font-size:13vw}
  .menu-link{font-size:2rem}
}

@media (max-width:680px){
  .perso-grid{grid-template-columns:1fr}
  .testi-grid{grid-template-columns:1fr}
  .section-header h2{font-size:2.5rem}
  .dna-title{font-size:2.5rem}
  .process-title-vip{font-size:2.5rem}
  .center-title-vip{font-size:2.5rem}
  .faq-title{font-size:2.5rem}
  .alliance-title-vip{font-size:3rem}
  .alliance-subtitle-vip{font-size:1.2rem}
  .gallery-item-large{height:60vh}
  .gallery-item-large img{object-fit:contain;background:#000}
}