/* =====================================================================
   RR v2 — versión de prueba (solo con ?v=2). Todo bajo html.rr-v2.
   1) Scroll suave (Lenis) + capítulos con GSAP (rr-v2.js)
   2) Escala tipográfica más grande (cuerpo 18 px)
   ===================================================================== */

/* Lenis: el scroll-behavior:smooth del sitio lo pelea → anularlo SIEMPRE */
html.rr-v2, html.rr-v2.lenis, html.rr-v2.lenis-smooth{ scroll-behavior:auto !important; }
html.lenis, html.lenis body{ height:auto; }
/* overflow-x:hidden en html/body convierte body en contenedor de scroll y rompe position:sticky → clip */
html.rr-v2, html.rr-v2 body{ overflow-x:clip !important; }
.lenis.lenis-stopped{ overflow:hidden; }
.lenis.lenis-smooth iframe{ pointer-events:none; }

/* aviso de versión de prueba */
.v2-badge{ position:fixed; left:18px; bottom:18px; z-index:120; display:inline-flex; gap:10px; align-items:center;
  padding:9px 16px; border-radius:100px; background:var(--accent); color:var(--on-accent); font:600 13px/1 var(--sans);
  letter-spacing:.02em; }
.v2-badge span{ opacity:.75; font-weight:500; }
.v2-badge:hover span{ opacity:1; }

/* ---------- 2) LETRA MÁS GRANDE (cuerpo 18 px) ---------- */
.rr-v2 .hero-sub{ font-size:clamp(18px,1.6vw,22px); }
.rr-v2 .sec-tag{ font-size:14.5px; }
.rr-v2 .pills span{ font-size:15px; padding:10px 18px; }
.rr-v2 .srv-card .sd{ font-size:18px; line-height:1.6; }
.rr-v2 .srv-card .tags span{ font-size:14px; }
.rr-v2 .srv-card .more{ font-size:16px; }
.rr-v2 .t-card .q{ font-size:clamp(22px,1.8vw,26px); line-height:1.3; }
.rr-v2 .t-card p{ font-size:18px; line-height:1.6; }
.rr-v2 .t-card .who{ font-size:14.5px; }
.rr-v2 .rating small{ font-size:15px; }
.rr-v2 .work .all, .rr-v2 .sec-head .all{ font-size:16px; }
.rr-v2 .work-card .cat{ font-size:12.5px; }
.rr-v2 .work-card .ttl{ font-size:clamp(22px,1.9vw,28px); }
.rr-v2 .cta .sub{ font-size:clamp(19px,1.6vw,22px); }
.rr-v2 .cta .insta{ font-size:14.5px; }
.rr-v2 footer{ font-size:16px; }
.rr-v2 footer p{ font-size:16.5px; line-height:1.6; }

/* ---------- 1) CAPÍTULOS (solo si GSAP cargó: html.v2-gsap) ---------- */

/* Capítulo «El estudio»: palabras que se encienden al leer */
.v2-gsap .about-center .big .v2w{ opacity:.16; transition:none; }
.v2-gsap .about-center .big b .v2w{ opacity:.22; }
.v2-gsap .about.v2-pin{ min-height:100vh; display:flex; align-items:center; }
.v2-gsap .about.v2-pin > .wrap{ width:100%; }

/* Capítulo «Servicios»: baraja de tarjetas que se apilan (escritorio) */
@media (min-width:901px){
  /* overflow:hidden rompe position:sticky → clip recorta igual sin crear contenedor de scroll */
  .v2-gsap .services.v2-deck{ overflow:clip; padding-bottom:16vh; }
  .v2-gsap .services.v2-deck > .wrap{ display:grid; grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr); gap:clamp(40px,5vw,90px); align-items:start; }
  .v2-gsap .services.v2-deck .sec-head{ position:sticky; top:clamp(120px,18vh,170px); margin-bottom:0; display:block !important; }
  .v2-gsap .services.v2-deck .sec-head h2{ max-width:13ch; }
  .v2-gsap .services.v2-deck .sec-head .all{ display:inline-block; margin-top:28px; }
  .v2-gsap .services.v2-deck .srv-grid{ display:block; }
  .v2-gsap .services.v2-deck .srv-card{ position:sticky; top:clamp(110px,16vh,150px); min-height:min(54vh,420px); margin-bottom:6vh;
    box-shadow:0 -10px 40px -28px rgba(27,24,21,.35); transform-origin:50% 0; will-change:transform; }
  .v2-gsap .services.v2-deck .srv-card:last-child{ margin-bottom:0; }
  .v2-gsap .services.v2-deck .srv-card .name{ font-size:clamp(34px,3.6vw,52px); }
  .v2-gsap .services.v2-deck .srv-card .num{ font-size:15px; }
  .v2-gsap .services.v2-deck .srv-card:hover{ transform:none; }
}
/* móvil: carrusel deslizable */
@media (max-width:900px){
  .rr-v2 .services .srv-grid{ display:flex; gap:14px; overflow-x:auto; scroll-snap-type:x mandatory; margin:0 -32px; padding:4px 32px 18px;
    scrollbar-width:none; -webkit-overflow-scrolling:touch; }
  .rr-v2 .services .srv-grid::-webkit-scrollbar{ display:none; }
  .rr-v2 .services .srv-card{ flex:0 0 84%; scroll-snap-align:center; }
  .rr-v2 .services .srv-card.reveal{ opacity:1; transform:none; }
}

/* Capítulo «Proyectos»: galería horizontal anclada (escritorio) */
@media (min-width:901px){
  .v2-gsap .work.v2-h{ height:100vh; padding:clamp(96px,13vh,130px) 0 clamp(28px,5vh,56px); display:flex; flex-direction:column; }
  .v2-gsap .work.v2-h > .wrap{ max-width:none; padding:0; flex:1; min-height:0; display:flex; flex-direction:column; width:100%; }
  .v2-gsap .work.v2-h .sec-head{ max-width:1320px; width:100%; margin:0 auto clamp(20px,3.5vh,40px); padding:0 32px; flex:none; }
  .v2-gsap .work.v2-h .sec-head h2{ font-size:clamp(34px,min(5vw,8vh),68px); }
  .v2-gsap .work.v2-h .w-grid{ display:flex; gap:clamp(16px,1.6vw,26px); flex:1; min-height:0; width:max-content;
    padding:0 max(32px, calc((100vw - 1320px)/2 + 32px)); will-change:transform; }
  .v2-gsap .work.v2-h .work-card{ height:100%; max-height:66vh; aspect-ratio:4/5; flex:none; opacity:1; transform:none; }
  .v2-gsap .work.v2-h .work-card img{ transform:scale(1.14); }
  .v2-gsap .work.v2-h .work-card:hover img{ transform:scale(1.18); }
  .v2-gsap .work.v2-h .v2-bar{ position:absolute; left:50%; bottom:clamp(14px,2.6vh,26px); width:min(320px,40vw); height:2px; transform:translateX(-50%);
    background:var(--line-dark); border-radius:2px; overflow:hidden; }
  .v2-gsap .work.v2-h .v2-bar i{ display:block; height:100%; width:100%; background:var(--accent); transform-origin:0 50%; transform:scaleX(0); }
  .v2-gsap .work.v2-h .w-grid .v2-endcard{ height:100%; max-height:66vh; aspect-ratio:4/5; flex:none; border-radius:var(--r-md);
    border:1px solid var(--line-dark); display:flex; flex-direction:column; justify-content:flex-end; padding:34px; color:var(--bone);
    transition:border-color .5s var(--ease), background .5s var(--ease); }
  .v2-gsap .work.v2-h .v2-endcard b{ font-family:var(--display); font-weight:600; font-size:clamp(28px,2.6vw,40px); line-height:1.05; letter-spacing:-.02em; }
  .v2-gsap .work.v2-h .v2-endcard span{ margin-top:16px; color:var(--accent); font-weight:600; font-size:16px; }
  .v2-gsap .work.v2-h .v2-endcard:hover{ border-color:var(--accent); background:var(--ink-2); }
}
@media (max-width:900px){
  .rr-v2 .work .w-grid{ display:flex; gap:14px; overflow-x:auto; scroll-snap-type:x mandatory; margin:0 -32px; padding:4px 32px 18px; scrollbar-width:none; }
  .rr-v2 .work .w-grid::-webkit-scrollbar{ display:none; }
  .rr-v2 .work .work-card{ flex:0 0 78%; scroll-snap-align:center; }
  .rr-v2 .work .work-card.reveal{ opacity:1; transform:none; }
  .rr-v2 .work .v2-endcard{ display:none; }
}

/* Capítulo «Reseñas»: tarjetas que entran por lados alternos y flotan */
.v2-gsap .testi .t-card{ will-change:transform; }
.v2-gsap .testi .t-card.reveal{ opacity:1; transform:none; transition:border-color .5s var(--ease), box-shadow .5s var(--ease); }
@media (min-width:881px){
  .v2-gsap .testi .t-grid{ align-items:start; }
  .v2-gsap .testi .t-card:nth-child(2){ margin-top:56px; }
  .v2-gsap .testi .t-card:nth-child(3){ margin-top:18px; }
}

/* Capítulo «¿Hablamos?» */
.v2-gsap .cta h2{ transform-origin:50% 60%; }

@media (prefers-reduced-motion:reduce){
  .v2-gsap .about-center .big .v2w{ opacity:1 !important; }
}

/* ---------- PORTADA = LOGO GRANDE sobre fondo oscuro (entrada de /prueba-home/) ---------- */
.rr-v2 .hero.v2-logo{ justify-content:center; padding:clamp(110px,15vh,150px) 0 clamp(90px,13vh,130px); }
.rr-v2 .hero.v2-logo > .wrap{ max-width:1160px; text-align:center; }
.rr-v2 .hero.v2-logo .scroll-hint{ position:absolute; left:50%; bottom:clamp(22px,4vh,40px); transform:translateX(-50%); }
.v2l-eyebrow{ text-wrap:balance; font-size:13.5px; letter-spacing:.3em; text-transform:uppercase; color:var(--accent); margin:0 0 clamp(26px,4.5vh,48px);
  opacity:0; animation:v2lUp .9s var(--ease) .15s forwards; }
.v2l-h1{ margin:0; font-size:inherit; line-height:0; }
.v2l-sr{ position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; }
.v2l-stage{ position:relative; display:block; width:min(980px,82vw); aspect-ratio:784.2/102.2; margin:0 auto; }
/* máscaras VECTORIALES (masters 02_Diseno/MARCA_RR/logo) → nítido a cualquier tamaño; antes PNG 785 px = pixelado */
.v2l-stage i{ position:absolute; inset:0; display:block; -webkit-mask-size:100% 100%; mask-size:100% 100%;
  -webkit-mask-repeat:no-repeat; mask-repeat:no-repeat; }
.v2l-w1{ background:var(--bone); -webkit-mask-image:url('/wp-content/uploads/rr-v2/rr-mask-rackel.svg'); mask-image:url('/wp-content/uploads/rr-v2/rr-mask-rackel.svg');
  animation:v2lSweep 1.05s cubic-bezier(.65,0,.35,1) .45s both; }
.v2l-w2{ background:var(--accent); -webkit-mask-image:url('/wp-content/uploads/rr-v2/rr-mask-rocha.svg'); mask-image:url('/wp-content/uploads/rr-v2/rr-mask-rocha.svg');
  animation:v2lSweep 1.05s cubic-bezier(.65,0,.35,1) .95s both; }
/* «rackel» hueso · «rocha» clay; cada palabra se dibuja de izquierda a derecha */
@keyframes v2lSweep{ from{ clip-path:inset(0 100% 0 0); } to{ clip-path:inset(0 0 0 0); } }
.v2l-sub{ margin:clamp(28px,5vh,52px) auto 0; max-width:560px; font-size:clamp(18px,1.7vw,22px); line-height:1.55; color:#d8d2ca;
  text-wrap:balance; opacity:0; animation:v2lUp 1s var(--ease) 1.5s forwards; }
@keyframes v2lUp{ from{ opacity:0; transform:translateY(12px); } to{ opacity:1; transform:none; } }
/* arriba del todo el logo pequeño del menú sobra (el grande ES la marca); vuelve al hacer scroll */
.rr-v2 body.page-inicio .nav .brand{ transition:opacity .5s var(--ease); }
.rr-v2 body.page-inicio .nav:not(.scrolled) .brand{ opacity:0; pointer-events:none; }
@media (max-width:760px){ .v2l-stage{ width:88vw; } .v2l-eyebrow{ font-size:12px; letter-spacing:.24em; } }
@media (prefers-reduced-motion:reduce){
  .v2l-eyebrow, .v2l-sub{ opacity:1; animation:none; }
  .v2l-w1, .v2l-w2{ animation:none; }
}

/* =====================================================================
   RESTO DE PÁGINAS — capítulos (2026-10-13)
   ===================================================================== */
.v2-gsap .v2-words .v2w{ opacity:.16; }
.v2-gsap .v2-words em .v2w{ opacity:.24; }
/* lámina que sube sobre el encabezado: se apoya con sombra suave por arriba */
.v2-gsap .v2-sheet{ position:relative; z-index:2; transform-origin:50% 0; box-shadow:0 -30px 60px -30px rgba(27,24,21,.45); overflow:clip; }
/* paquetes en baraja (escritorio) */
@media (min-width:901px){
  .v2-gsap .v2-pkdeck{ overflow:clip; }
  .v2-gsap .v2-pkdeck .pk-list{ display:block; }
  .v2-gsap .v2-pkdeck .pk{ position:sticky; top:clamp(100px,14vh,130px); margin-bottom:5vh; transform-origin:50% 0; will-change:transform;
    box-shadow:0 -14px 44px -30px rgba(27,24,21,.4); }
  .v2-gsap .v2-pkdeck .pk:last-child{ margin-bottom:0; }
  .v2-gsap .v2-pkdeck .pk:hover{ transform:none; }
}
/* proceso: línea que se dibuja (horizontal en escritorio, vertical en móvil) */
.v2-gsap .proc-tl .tl{ position:relative; }
.v2-tl-line{ position:absolute; z-index:0; background:var(--accent); pointer-events:none; }
@media (min-width:901px){ .v2-tl-line{ top:24px; left:10%; right:10%; height:2px; transform-origin:0 50%; } }
@media (max-width:900px){ .v2-tl-line{ left:24px; top:25px; bottom:55px; width:2px; transform-origin:50% 0; } }
.v2-gsap .proc-tl .tl-num{ z-index:1; }
.v2-gsap .combo-grid{ position:relative; }
.v2-gsap .combo{ will-change:transform; }
.v2-gsap .combo:nth-child(2){ z-index:2; }
.v2-gsap .principles{ perspective:1000px; }
footer{ overflow:clip; }
/* las tablas y tarjetas animadas no deben heredar el transform del :hover durante el scroll */
.v2-gsap .principle:hover, .v2-gsap .combo:hover{ transform:none; }
