/* ============================================
   PIVOT POWER — Design System v3 "Documental"
   Full-bleed photography, warm near-black palette, rounded corners,
   Montserrat only (weight contrast carries the personality).
   People and real moments are the hero — not abstract graphics.
   ============================================ */

@import url('https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,600&display=swap');

:root{
  --black: #0f0d0a;
  --black-soft: #17140f;
  --surface: #1c1811;
  --surface-2: #241f16;
  --cream: #F5F1E8;
  --cream-dim: #7a7568;
  --white: #ffffff;
  --white-dim: #d8d2c8;
  --orange: #FF7A3D;
  --orange-soft: #FF9D6B;
  --green: #3E8E63;
  --green-rolex: #00573F;
  --purple: #8B5FE0;
  --line: rgba(255,255,255,.14);
  --accent: var(--orange);
  --accent-text: var(--black);

  --font: 'Montserrat', sans-serif;
  --wrap: 1240px;
  --pad: clamp(20px, 5vw, 64px);
  --ease: cubic-bezier(.2,.7,.2,1);
}

*,*::before,*::after{ box-sizing: border-box; }
html{ scroll-behavior: smooth; }
@media (prefers-reduced-motion: reduce){
  html{ scroll-behavior: auto; }
  *,*::before,*::after{ animation-duration: 0.001ms !important; animation-iteration-count: 1 !important; transition-duration: 0.001ms !important; scroll-behavior: auto !important; }
}

body{
  margin:0; background: var(--black); color: var(--white);
  font-family: var(--font); font-weight: 400; line-height: 1.5;
  -webkit-font-smoothing: antialiased; overflow-x: hidden;
}
img{ max-width:100%; display:block; }
a{ color:inherit; text-decoration:none; }
button{ font-family:inherit; cursor:pointer; }
ul{ margin:0; padding:0; list-style:none; }
h1,h2,h3,h4,p{ margin:0; }
:focus-visible{ outline: 2px solid var(--orange); outline-offset: 3px; }
.wrap{ max-width: var(--wrap); margin: 0 auto; padding-left: var(--pad); padding-right: var(--pad); }

/* ---------- Type ---------- */
.eyebrow{
  font-size: 12.5px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase;
  color: var(--accent); display:flex; align-items:center; gap:10px;
}
.eyebrow .dots{ display:flex; gap:5px; }
.dots span{ width:5px; height:5px; border-radius:50%; display:inline-block; }
.dots span:nth-child(1){ background: var(--orange); }
.dots span:nth-child(2){ background: var(--green); }
.dots span:nth-child(3){ background: var(--purple); }

h1, .h1{ font-weight: 800; letter-spacing: -0.02em; line-height: 1.02; font-size: clamp(38px, 6vw, 78px); }
h2, .h2{ font-weight: 700; letter-spacing: -0.015em; line-height: 1.08; font-size: clamp(28px, 4vw, 46px); }
h3, .h3{ font-weight: 700; letter-spacing: -0.005em; font-size: clamp(19px, 2.2vw, 25px); }
.lede{ font-weight: 300; font-size: clamp(16px, 1.8vw, 20px); color: var(--white-dim); line-height: 1.58; max-width: 600px; }
p.body{ font-weight: 300; color: var(--white-dim); font-size: 15.5px; }
.mono-label{ font-size: 11.5px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--white-dim); }

/* ---------- Buttons ---------- */
.btn{
  display:inline-flex; align-items:center; gap:9px; padding: 15px 26px; border-radius: 10px;
  font-weight: 700; font-size: 14px; letter-spacing: .01em; border: 1.5px solid transparent;
  transition: background .25s var(--ease), color .25s var(--ease), border-color .25s var(--ease), transform .25s var(--ease);
  white-space: nowrap;
}
.btn-primary{ background: var(--orange); color: var(--black); }
.btn-primary:hover{ background: var(--orange-soft); transform: translateY(-1px); }
.btn-ghost{ border-color: rgba(255,255,255,.35); color: var(--white); background: rgba(255,255,255,.04); }
.btn-ghost:hover{ border-color: var(--white); }
.sec-light .btn-ghost{ border-color: rgba(15,13,10,.3); color: var(--black); background:transparent; }
.sec-light .btn-ghost:hover{ border-color: var(--black); background: rgba(15,13,10,.06); }
.btn-arrow{ transition: transform .25s var(--ease); }
.btn:hover .btn-arrow{ transform: translateX(4px); }

/* ---------- Nav ---------- */
.nav{
  position: fixed; top:0; left:0; right:0; z-index: 100; padding: 18px var(--pad);
  display:flex; align-items:center; justify-content:space-between;
  background: linear-gradient(to bottom, rgba(15,13,10,.85), rgba(15,13,10,0));
  transition: background .3s, padding .3s;
}
.nav.scrolled{ background: rgba(15,13,10,.92); border-bottom:1px solid var(--line); padding-top:13px; padding-bottom:13px; }
.nav-brand{ display:flex; align-items:center; gap:10px; font-weight:800; font-size:16px; letter-spacing:-0.01em; }
.nav-brand img{ height: 26px; width:auto; }
.footer-brand .nav-brand img{ height: 24px; }
.nav-links{ display:flex; align-items:center; gap:30px; font-size:13.5px; font-weight:600; }
.nav-links a{ opacity:.85; transition: opacity .2s; }
.nav-links a:hover{ opacity:1; }
.nav-right{ display:flex; align-items:center; gap:16px; }
.lang-toggle{ display:flex; border:1px solid var(--line); border-radius:999px; overflow:hidden; font-size:11.5px; font-weight:700; }
.lang-toggle button{ background:none; border:none; color: var(--white-dim); padding:7px 12px; transition: all .2s; }
.lang-toggle button.active{ background: var(--white); color: var(--black); }
.nav-toggle{ display:none; background:none; border:none; color:var(--white); }
@media (max-width: 900px){ .nav-links{ display:none; } .nav-toggle{ display:block; } }

/* ---------- Cube logo mark (small, brand detail only) ---------- */
.cube-mark{ width: 15px; height: 15px; display: grid; grid-template-columns: repeat(2,1fr); grid-template-rows: repeat(2,1fr); gap: 2px; }
.cube-mark span{ border-radius: 2px; }
.cube-mark span:nth-child(1){ background: var(--orange); }
.cube-mark span:nth-child(2){ background: var(--green); }
.cube-mark span:nth-child(3){ background: var(--purple); }
.cube-mark span:nth-child(4){ background: var(--orange-soft); }
.cube-mark span:nth-child(5),.cube-mark span:nth-child(6),.cube-mark span:nth-child(7),.cube-mark span:nth-child(8),.cube-mark span:nth-child(9){ display:none; }

body.theme-orange{ --accent: var(--orange); --accent-text: var(--black); }
body.theme-green{ --accent: var(--green-rolex); --accent-text: #ffffff; }
body.theme-purple{ --accent: var(--purple); --accent-text: var(--black); }


.ticker{ position:relative; margin-top: 62px; overflow:hidden; border-bottom:1px solid var(--line); background: var(--black-soft); white-space:nowrap; }
.ticker-track{ display:inline-flex; align-items:center; gap:20px; padding:9px 0; animation: ticker-scroll 32s linear infinite; will-change: transform; }
.ticker-track span{ font-size:11.5px; font-weight:700; letter-spacing:.06em; text-transform:uppercase; color: var(--white-dim); }
.ticker-track span.tdot{ color: var(--orange); font-size:8px; }
@keyframes ticker-scroll{ from{ transform:translateX(0); } to{ transform:translateX(-50%); } }

/* ---------- Big marquee band ---------- */
.marquee-band{ overflow:hidden; border-bottom:1px solid var(--line); padding: 22px 0; white-space:nowrap; }
.marquee-track{ display:inline-flex; align-items:center; gap: 26px; animation: marquee-scroll 22s linear infinite; will-change: transform; }
.marquee-track span{ font-size: clamp(22px,4vw,48px); font-weight:800; letter-spacing:-0.02em; color: var(--white); opacity:.92; }
.marquee-track .mq-sep{ color: var(--orange); font-weight:400; font-size: clamp(18px,3vw,36px); }
@keyframes marquee-scroll{ from{ transform:translateX(0); } to{ transform:translateX(-50%); } }
@media (prefers-reduced-motion: reduce){ .ticker-track, .marquee-track{ animation: none; } }

/* ---------- Hero: full-bleed photo ---------- */
.hero{ position: relative; min-height: 92svh; display:flex; flex-direction:column; justify-content:flex-end; padding-top: 120px; padding-bottom: 70px; overflow: hidden; isolation: isolate; }
.hero-bg{ position:absolute; inset:0; z-index:-2; background: radial-gradient(circle at 25% 20%, color-mix(in srgb, var(--orange) 35%, var(--black)) 0%, var(--black) 65%); }
.hero-bg img{ width:100%; height:100%; object-fit:cover; }
.hero-bg::after{ content:''; position:absolute; inset:0; background: linear-gradient(180deg, rgba(15,13,10,.35) 0%, rgba(15,13,10,.25) 35%, rgba(15,13,10,.96) 92%); }
.hero-bg canvas{ display:none; }
.hero-content{ max-width: 820px; }
.hero h1{ margin: 20px 0 24px; }
.hero h1 em{ font-style: normal; color: var(--orange); }
.hero-actions{ display:flex; gap:14px; flex-wrap:wrap; margin-top: 30px; align-items:center; }
.hero-note{ font-size: 12.5px; color: var(--white-dim); margin-top:18px; font-weight:500; }

.hero-stats{ display:flex; flex-wrap:wrap; gap: 34px; margin-top: 46px; padding-top: 24px; border-top: 1px solid var(--line); }
.hero-stats div{ display:flex; align-items:baseline; gap:8px; }
.hero-stats strong{ font-size: 21px; font-weight:800; color: var(--white); }
.hero-stats span{ font-size: 12.5px; color: var(--white-dim); font-weight:500; }

/* ---------- Section scaffolding ---------- */
section{ position: relative; padding: 96px 0; }
.section-head{ max-width: 660px; margin-bottom: 46px; }
.section-head h2{ margin-top:14px; }
.tight{ padding-top: 56px; padding-bottom: 56px; }
.divider{ height:1px; background: var(--line); }

.sec-light{ background: var(--cream); color: var(--black); --line: rgba(15,13,10,.12); }
.sec-light .eyebrow{ color: var(--accent); }
.sec-light .lede, .sec-light p.body{ color: #5c584f; }
.sec-light h2, .sec-light h3, .sec-light h1{ color: var(--black); }
.sec-light .face-card{ background: #fff; }
.sec-light .face-tags span{ color:#5c584f; border-color: rgba(15,13,10,.16); }
.sec-light .face-link{ color: var(--black); }
.sec-light .process-step{ background: transparent; }
.sec-light .process-step h4{ color: var(--black); }
.sec-light .feature-item{ background: #fff; border-color: rgba(15,13,10,.1); }
.sec-light .feature-item h4{ color: var(--black); }
.sec-light .field input, .sec-light .field textarea, .sec-light .field select{ background:#fff; color: var(--black); border-color: rgba(15,13,10,.16); }
.sec-light .field label{ color:#6b665c; }
.sec-light .diag-card{ background:#fff; border-color: rgba(15,13,10,.1); }
.sec-light .diag-progress i{ background: rgba(15,13,10,.12); }
.sec-light .testi-card{ background:#fff; border-color: rgba(15,13,10,.1); }

/* ---------- Philosophy ---------- */
.philosophy{ border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.philosophy .wrap{ display:grid; grid-template-columns: 1fr 1.3fr; gap: 60px; align-items:center; }
.philosophy-quote{ font-size: clamp(22px,2.8vw,36px); font-weight: 700; letter-spacing:-0.01em; line-height:1.22; }
.philosophy-quote span{ color: #5c584f; font-weight:300; }
@media (max-width: 860px){ .philosophy .wrap{ grid-template-columns:1fr; } }

/* ---------- Services: photo-backed cards ---------- */
.services-grid{ display:grid; grid-template-columns: repeat(2,1fr); gap: 16px; }
@media (max-width: 780px){ .services-grid{ grid-template-columns: 1fr; } }

.face-card{
  position: relative; padding: 30px; min-height: 320px; border-radius: 18px; overflow:hidden;
  display:flex; flex-direction:column; justify-content:flex-end;
  background: var(--surface);
  transition: transform .35s var(--ease);
}
.face-card .face-photo{ position:absolute; inset:0; z-index:0; }
.face-card .face-photo img{ width:100%; height:100%; object-fit:cover; transition: transform .5s var(--ease); }
.face-card::after{ content:''; position:absolute; inset:0; z-index:1; background: linear-gradient(180deg, rgba(15,13,10,.15) 0%, rgba(15,13,10,.9) 85%); }
.face-card:hover{ transform: translateY(-4px); }
.face-card:hover .face-photo img{ transform: scale(1.06); }
.face-num{ position:relative; z-index:2; font-size:12px; font-weight:800; letter-spacing:.08em; color: var(--face-color, var(--orange)); }
.face-card h3{ position:relative; z-index:2; margin-top:14px; color:#fff; }
.face-card p{ position:relative; z-index:2; margin-top:12px; color: var(--white-dim); font-weight:300; font-size:14.5px; }
.face-tags{ position:relative; z-index:2; display:flex; flex-wrap:wrap; gap:8px; margin-top:18px; }
.face-tags span{ font-size:11px; font-weight:600; padding:6px 12px; border:1px solid rgba(255,255,255,.3); border-radius:999px; color: var(--white-dim); }
.face-link{ position:relative; z-index:2; margin-top:20px; display:flex; align-items:center; gap:8px; font-weight:700; font-size:14px; color:#fff; }
.face-link .arr{ transition: transform .2s var(--ease); }
.face-card:hover .face-link .arr{ transform: translateX(4px); }

.face-card[data-service="diagnostico"]{ --face-color: var(--orange); }
.face-card[data-service="laboratorios"]{ --face-color: var(--orange); }
.face-card[data-service="agentes"]{ --face-color: var(--green-rolex); }
.face-card[data-service="cocreacion"]{ --face-color: var(--purple); }

/* ---------- Media blocks ---------- */
.media-frame{ position: relative; overflow: hidden; aspect-ratio: 16/10; background: var(--surface); border-radius: 16px; }
.media-frame img, .media-frame video{ width:100%; height:100%; object-fit: cover; transition: transform .5s var(--ease); }
.media-frame:hover img{ transform: scale(1.045); }
.media-frame .tag{ position:absolute; top:12px; left:12px; font-size:10.5px; font-weight:700; letter-spacing:.06em; text-transform:uppercase; background: rgba(15,13,10,.7); backdrop-filter: blur(4px); color: var(--white); padding:7px 13px; border-radius: 999px; }
.play-btn{ position:absolute; inset:0; display:flex; align-items:center; justify-content:center; }
.play-btn span{ width:58px; height:58px; background: rgba(255,255,255,.95); display:flex; align-items:center; justify-content:center; border-radius: 50%; }

/* ---------- Process rail ---------- */
.process{ border-top:1px solid var(--line); border-bottom:1px solid var(--line); }
.process-rail{ display:grid; grid-template-columns: repeat(4,1fr); gap:14px; margin-top:46px; }
.process-step{ background: var(--surface); padding: 28px 22px; border-radius: 16px; }
.sec-light .process-step{ background: #fff; border:1px solid rgba(15,13,10,.1); }
.process-step .step-n{ font-size:12px; font-weight:800; color: var(--accent); }
.process-step h4{ margin-top:14px; font-weight:700; font-size:17px; }
.process-step p{ margin-top:10px; font-size:13.5px; color: var(--white-dim); font-weight:300; }
.sec-light .process-step p{ color:#6b665c; }
@media (max-width: 900px){ .process-rail{ grid-template-columns: 1fr 1fr; } }
@media (max-width: 560px){ .process-rail{ grid-template-columns: 1fr; } }

/* ---------- Gallery: asymmetric people grid ---------- */
.gallery{ display:grid; grid-template-columns: repeat(4, 1fr); grid-auto-rows: 160px; gap: 12px; }
.gallery .media-frame:nth-child(1){ grid-column: span 2; grid-row: span 2; }
.gallery .media-frame:nth-child(4){ grid-column: span 2; }
@media (max-width: 800px){
  .gallery{ grid-template-columns: repeat(2,1fr); grid-auto-rows: 140px; }
  .gallery .media-frame:nth-child(1){ grid-column: span 2; grid-row: span 1; aspect-ratio: 16/9; }
}

/* ---------- Team row (circular founder/client photos) ---------- */
.team-row{ display:flex; gap:20px; margin-top:44px; overflow-x:auto; padding-bottom:8px; scrollbar-width:none; }
.team-row::-webkit-scrollbar{ display:none; }
.team-card{ flex:0 0 168px; text-align:center; }
.team-card img{ width:100%; aspect-ratio:1; object-fit:cover; border-radius:50%; margin-bottom:12px; filter: grayscale(.15); }
.team-card h5{ font-size:13.5px; font-weight:700; }
.team-card p{ font-size:12px; color: var(--white-dim); margin-top:2px; font-weight:400; }
.sec-light .team-card p{ color:#6b665c; }

/* ---------- Testimonials ---------- */
.testimonials{ display:flex; gap: 14px; overflow-x:auto; scroll-snap-type: x mandatory; scrollbar-width: none; }
.testimonials::-webkit-scrollbar{ display:none; }
.testi-card{ position:relative; background: var(--surface); border-radius: 18px; min-height: 300px; min-width: 320px; flex: 0 0 min(78vw, 340px); scroll-snap-align: start; display:flex; flex-direction:column; overflow:hidden; }
@media (min-width: 901px){ .testi-card{ flex: 1 0 33.333%; } }
.testi-body{ padding: 28px; display:flex; flex-direction:column; gap:16px; flex:1; }
.testi-card img{ width:56px; height:56px; object-fit:cover; border-radius: 50%; }
.testi-quote{ font-weight:600; font-size:15.5px; line-height:1.44; }
.testi-meta{ margin-top:auto; padding-top:14px; border-top:1px solid var(--line); }
.sec-light .testi-meta{ border-color: rgba(15,13,10,.1); }
.testi-name{ font-size:12.5px; font-weight:700; color: var(--accent); text-transform:uppercase; letter-spacing:.03em; }
.sec-light .testi-name{ color: var(--accent); }
.testi-role{ font-size:12.5px; color: var(--white-dim); margin-top:3px; }
.sec-light .testi-role{ color:#6b665c; }

/* ---------- Logos strip ---------- */
.logos-strip{ display:flex; flex-wrap:wrap; gap:44px; align-items:center; justify-content:space-between; opacity:.65; }
.logos-strip div{ font-weight:700; font-size:14px; letter-spacing:-0.01em; color: var(--white-dim); }

/* ---------- Minidiagnóstico form ---------- */
.diag{ border-top: 1px solid var(--line); }
.diag-card{ border-radius: 22px; background: var(--surface); padding: clamp(24px,4vw,52px); position: relative; }
.diag-progress{ display:flex; gap:6px; margin-bottom: 32px; }
.diag-progress i{ height:3px; border-radius:2px; flex:1; background: var(--line); }
.diag-progress i.done, .diag-progress i.current{ background: var(--orange); }
.diag-step{ display:none; }
.diag-step.active{ display:block; animation: step-in .4s var(--ease); }
@keyframes step-in{ from{ opacity:0; transform: translateY(8px);} to{ opacity:1; transform:none; } }
.diag-step h3{ margin-bottom: 6px; }
.diag-step .step-sub{ color: var(--white-dim); font-weight:300; font-size:14.5px; margin-bottom:26px; }
.sec-light .diag-step .step-sub{ color:#6b665c; }

.field{ margin-bottom: 20px; }
.field label{ display:block; font-size:11.5px; font-weight:700; letter-spacing:.04em; text-transform:uppercase; color: var(--white-dim); margin-bottom:9px; }
.field input[type=text], .field input[type=email], .field input[type=tel], .field textarea, .field select{
  width:100%; background: var(--black); border:1px solid var(--line); border-radius:10px;
  padding: 13px 15px; color: var(--white); font-family: var(--font); font-size:15px; font-weight:500;
  transition: border-color .2s;
}
.field input:focus, .field textarea:focus, .field select:focus{ border-color: var(--orange); outline:none; }
.field textarea{ resize: vertical; min-height:90px; }

.choice-grid{ display:grid; grid-template-columns: repeat(2,1fr); gap:10px; }
@media (max-width:600px){ .choice-grid{ grid-template-columns:1fr; } }
.choice{ background: var(--black); border: 1px solid var(--line); padding:17px; cursor:pointer; position:relative; transition: background .2s, border-color .2s; border-radius: 12px; }
.sec-light .choice{ background: #fff; }
.choice input{ position:absolute; opacity:0; inset:0; cursor:pointer; margin:0; }
.choice strong{ display:block; font-size:14.5px; font-weight:700; }
.choice span{ display:block; margin-top:6px; font-size:12.5px; color: var(--white-dim); font-weight:300; }
.sec-light .choice span{ color:#6b665c; }
.choice:has(input:checked){ background: rgba(255,122,61,.14); border-color: var(--orange); }

.diag-nav{ display:flex; justify-content:space-between; align-items:center; margin-top: 32px; }
.diag-back{ font-size:12.5px; font-weight:700; color: var(--white-dim); text-transform:uppercase; letter-spacing:.03em; }
.diag-back[disabled]{ opacity: 0; pointer-events:none; }

.diag-success{ display:none; text-align:center; padding: 36px 0; }
.diag-success.active{ display:block; animation: step-in .4s var(--ease); }
.diag-success .cube-mark{ width:34px; height:34px; margin: 0 auto 22px; }

/* ---------- CTA band ---------- */
.cta-band{ position:relative; overflow:hidden; background: var(--accent); color: var(--accent-text); padding: clamp(36px,5vw,64px); border-radius: 22px; display:flex; justify-content:space-between; align-items:center; gap: 28px; flex-wrap:wrap; isolation:isolate; }
.cta-band .cta-band-bg{ position:absolute; inset:0; z-index:-1; background: var(--accent); }
.cta-band .cta-band-bg img{ width:100%; height:100%; object-fit:cover; }
.cta-band .cta-band-bg::after{ content:''; position:absolute; inset:0; background: var(--accent); opacity:.82; mix-blend-mode: multiply; }
.cta-band h2{ color: var(--accent-text); max-width:560px; position:relative; z-index:1; }
.cta-band p{ position:relative; z-index:1; }
.cta-band > a, .cta-band > div{ position:relative; z-index:1; }
.cta-band .btn-primary{ background: var(--black); color: var(--white); }
.cta-band .btn-primary:hover{ background: #2a251c; }

/* ---------- Footer ---------- */
footer{ border-top:1px solid var(--line); padding: 60px 0 30px; }
.footer-top{ display:grid; grid-template-columns: 1.4fr 1fr 1fr 1fr; gap: 40px; padding-bottom: 44px; }
@media (max-width: 800px){ .footer-top{ grid-template-columns: 1fr 1fr; } }
.footer-brand p{ margin-top:16px; color: var(--white-dim); font-weight:300; font-size:14px; max-width:280px; }
.footer-col h5{ font-size:11.5px; text-transform:uppercase; letter-spacing:.06em; color: var(--white-dim); margin-bottom:16px; font-weight:700; }
.footer-col ul li{ margin-bottom:10px; font-size:14.5px; font-weight:500; }
.footer-col ul li a{ opacity:.85; transition:opacity .2s; }
.footer-col ul li a:hover{ opacity:1; }
.footer-bottom{ display:flex; justify-content:space-between; padding-top:24px; border-top:1px solid var(--line); font-size:12px; color: var(--white-dim); flex-wrap:wrap; gap:12px; }

/* ---------- Reveal on scroll ---------- */
.reveal{ opacity:0; transform: translateY(18px); transition: opacity .6s var(--ease), transform .6s var(--ease); }
.reveal.in{ opacity:1; transform:none; }

/* ---------- Sub-page hero (service pages): full-bleed photo too ---------- */
.subhero{ position:relative; padding-top: 150px; padding-bottom: 64px; overflow:hidden; isolation:isolate; }
.subhero-bg{ position:absolute; inset:0; z-index:-2; background: radial-gradient(circle at 30% 20%, color-mix(in srgb, var(--accent) 45%, var(--black)) 0%, var(--black) 70%); }
.subhero-bg img{ width:100%; height:100%; object-fit:cover; }
.subhero-bg::after{ content:''; position:absolute; inset:0; background: linear-gradient(180deg, rgba(15,13,10,.55) 0%, rgba(15,13,10,.4) 30%, rgba(15,13,10,.97) 96%); }
.subhero .eyebrow{ margin-bottom: 16px; }
.subhero-meta{ display:flex; gap:0; flex-wrap:wrap; margin-top: 38px; border-top:1px solid var(--line); }
.subhero-meta div{ padding: 18px 28px 0 0; }
.subhero-meta div strong{ display:block; font-size:11px; text-transform:uppercase; letter-spacing:.05em; color: var(--white-dim); font-weight:700; }
.subhero-meta div span{ font-size:14px; font-weight:600; display:block; margin-top:6px; }

.feature-list{ display:grid; grid-template-columns: repeat(2,1fr); gap: 12px; }
@media (max-width: 760px){ .feature-list{ grid-template-columns: 1fr; } }
.feature-item{ background: var(--surface); border: 1px solid var(--line); padding:24px; border-radius: 16px; }
.feature-item h4{ font-size:16px; font-weight:700; }
.feature-item p{ margin-top:10px; font-size:13.5px; color: var(--white-dim); font-weight:300; }
.sec-light .feature-item p{ color:#6b665c; }
.feature-item .fi-n{ font-size:11px; font-weight:800; color: var(--accent); margin-bottom:12px; display:block; letter-spacing:.03em; }
.sec-light .feature-item .fi-n{ color: var(--accent); }

.pill-nav{ display:flex; gap:8px; flex-wrap:wrap; }
.pill-nav a{ font-size:12.5px; font-weight:600; padding:10px 16px; border: 1px solid rgba(255,255,255,.3); border-radius: 999px; transition: background .2s, color .2s, border-color .2s; }
.pill-nav a.active, .pill-nav a:hover{ background: var(--accent); color: var(--accent-text); border-color: var(--accent); }

/* language visibility */
/* !important para que ninguna regla de componente (ej. .choice strong{display:block}) muestre los dos idiomas a la vez */
html:not([lang="en"]) [data-en]{ display: none !important; }
html[lang="en"] [data-es]{ display: none !important; }

/* ============================================
   HECHO EN PIVOT · soluciones propias
   (segundo cerebro, personas sintéticas, la caja que vende más)
   Morado = co-creación. Mockups vivos en CSS, sin fotos de stock.
   ============================================ */
.hp-section{ background: var(--black); overflow:hidden; isolation:isolate; }
.hp-section::before{ content:''; position:absolute; z-index:-1; width: 900px; height: 900px; right:-300px; top:-320px; border-radius:50%; background: radial-gradient(circle, rgba(139,95,224,.28) 0%, rgba(139,95,224,0) 65%); pointer-events:none; }
.hp-section .eyebrow{ color: var(--purple); }
.hp-kicker{ margin-top:16px; font-size: clamp(17px,2vw,22px); font-weight:700; font-style: italic; color: #C7A6FF; }

.hp-grid{ display:grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap:16px; }
@media (max-width: 1240px){ .hp-grid{ grid-template-columns: 1fr 1fr; } }
@media (max-width: 1000px){ .hp-grid{ grid-template-columns: 1fr 1fr; } }
@media (max-width: 680px){ .hp-grid{ grid-template-columns: 1fr; } }

.hp-card{ position:relative; display:flex; flex-direction:column; background: var(--surface); border:1px solid var(--line); border-radius: 20px; overflow:hidden; transition: transform .35s var(--ease), border-color .35s var(--ease); }
.hp-card:hover{ transform: translateY(-4px); border-color: rgba(139,95,224,.6); }
.hp-card .hp-demo{ height: 300px; padding-bottom: 36px; }
.hp-body{ padding: 26px 26px 28px; display:flex; flex-direction:column; flex:1; }
.hp-label{ align-self:flex-start; font-size:10.5px; font-weight:800; letter-spacing:.08em; text-transform:uppercase; padding:6px 12px; border-radius:999px; background: rgba(139,95,224,.16); color:#C7A6FF; }
.hp-card h3{ margin-top:16px; color:#fff; }
.hp-hook{ margin-top:8px; font-size:15px; font-weight:700; color:#C7A6FF; line-height:1.35; }
.hp-card p.hp-desc{ margin-top:12px; color: var(--white-dim); font-weight:300; font-size:14.5px; }
.hp-card .face-link{ margin-top:auto; padding-top:22px; }
.hp-card:hover .face-link .arr{ transform: translateX(4px); }

.hp-foot{ margin-top:28px; display:flex; flex-wrap:wrap; gap:14px; align-items:center; justify-content:space-between; padding: 22px 26px; border:1px dashed rgba(139,95,224,.5); border-radius:16px; }
.hp-foot p{ font-size:14px; color: var(--white-dim); max-width: 640px; }
.hp-foot p strong{ color:#fff; }

/* ---------- Demo stage (shared) ---------- */
.hp-demo{ position:relative; overflow:hidden; background: linear-gradient(160deg, #8B5FE0 0%, #5B2DB8 100%); display:flex; align-items:center; justify-content:center; padding: 22px; }
.hp-demo.is-dark{ background: radial-gradient(circle at 70% 20%, #2a2140 0%, #141018 70%); }
.hp-demo .demo-tag{ position:absolute; left:14px; bottom:12px; font-size:9.5px; font-weight:800; letter-spacing:.12em; text-transform:uppercase; color: rgba(255,255,255,.7); }

/* Segundo cerebro: chat con fuente */
.demo-brain{ width:100%; max-width: 340px; display:flex; flex-direction:column; gap:10px; }
.db-q{ align-self:flex-end; max-width: 86%; background:#fff; color:#141414; padding: 11px 14px; border-radius: 16px 16px 4px 16px; font-size:13px; font-weight:600; line-height:1.35; animation: hp-in 9s var(--ease) infinite; }
.db-a-wrap{ position:relative; align-self:flex-start; max-width: 92%; min-height: 42px; }
.db-typing{ position:absolute; left:0; top:0; display:flex; gap:5px; padding: 14px 16px; background:#141414; border-radius:16px 16px 16px 4px; animation: hp-typing 9s linear infinite; }
.db-typing i{ width:7px; height:7px; border-radius:50%; background:#C7A6FF; animation: hp-blink .9s ease-in-out infinite; }
.db-typing i:nth-child(2){ animation-delay:.15s; } .db-typing i:nth-child(3){ animation-delay:.3s; }
.db-a{ transform-origin:left bottom; background:#141414; color:#fff; padding: 12px 14px; border-radius:16px 16px 16px 4px; font-size:13px; font-weight:600; line-height:1.4; animation: hp-answer 9s var(--ease) infinite; }
.db-src{ display:inline-flex; align-items:center; gap:6px; margin-top:9px; padding:4px 10px; border:1.5px solid #C7A6FF; color:#C7A6FF; border-radius:999px; font-size:10.5px; font-weight:700; }
.db-src svg{ width:12px; height:12px; }

@keyframes hp-in{ 0%{opacity:0; transform:translateY(10px);} 6%,94%{opacity:1; transform:none;} 100%{opacity:0; transform:none;} }
@keyframes hp-typing{ 0%,10%{opacity:0;} 13%,26%{opacity:1;} 29%,100%{opacity:0;} }
@keyframes hp-answer{ 0%,27%{opacity:0; transform:scale(.9);} 33%,94%{opacity:1; transform:none;} 100%{opacity:0; transform:none;} }
@keyframes hp-blink{ 0%,100%{opacity:1;} 50%{opacity:.25;} }

/* Focus group que no existe: 12 personas, 3 campañas */
.demo-focus{ width:100%; max-width: 340px; display:flex; flex-direction:column; gap:14px; }
.df-people{ display:grid; grid-template-columns: repeat(12, 1fr); gap:5px; }
.df-people span{ aspect-ratio:1; border-radius:50%; background: rgba(255,255,255,.85); position:relative; animation: hp-pop 8s var(--ease) infinite both; }
.df-people span::after{ content:''; position:absolute; left:28%; top:22%; width:44%; height:44%; border-radius:50%; background:#5B2DB8; opacity:.55; }
.df-people span:nth-child(2){animation-delay:.05s} .df-people span:nth-child(3){animation-delay:.1s} .df-people span:nth-child(4){animation-delay:.15s}
.df-people span:nth-child(5){animation-delay:.2s} .df-people span:nth-child(6){animation-delay:.25s} .df-people span:nth-child(7){animation-delay:.3s}
.df-people span:nth-child(8){animation-delay:.35s} .df-people span:nth-child(9){animation-delay:.4s} .df-people span:nth-child(10){animation-delay:.45s}
.df-people span:nth-child(11){animation-delay:.5s} .df-people span:nth-child(12){animation-delay:.55s}
.df-rows{ display:flex; flex-direction:column; gap:8px; }
.df-row{ display:grid; grid-template-columns: 74px 1fr 38px; align-items:center; gap:10px; font-size:11.5px; font-weight:800; color:#fff; }
.df-bar{ height:14px; border-radius:999px; background: rgba(255,255,255,.18); overflow:hidden; }
.df-bar i{ display:block; height:100%; border-radius:999px; background:#fff; transform-origin:left; animation: hp-grow 8s var(--ease) infinite both; }
.df-row.win .df-bar i{ background:#6FD39A; }
.df-row.lose .df-bar i{ background:#FF7A3D; }
.df-row:nth-child(2) .df-bar i{ animation-delay:.15s; } .df-row:nth-child(3) .df-bar i{ animation-delay:.3s; }
.df-pct{ text-align:right; }
.df-verdict{ align-self:flex-start; display:inline-flex; gap:8px; align-items:center; padding:7px 12px; border-radius:10px; background:#141414; color:#fff; font-size:11.5px; font-weight:700; animation: hp-stamp 8s var(--ease) infinite both; }
.df-verdict b{ color:#FF7A3D; }
@keyframes hp-pop{ 0%{opacity:0; transform:scale(.4);} 6%,92%{opacity:1; transform:none;} 100%{opacity:0; transform:none;} }
@keyframes hp-grow{ 0%,12%{transform:scaleX(0); opacity:1;} 30%,92%{transform:scaleX(1); opacity:1;} 100%{transform:scaleX(1); opacity:0;} }
@keyframes hp-stamp{ 0%,36%{opacity:0; transform:scale(1.4) rotate(-6deg);} 42%,92%{opacity:1; transform:rotate(-2deg);} 100%{opacity:0; transform:rotate(-2deg);} }

/* La caja que vende más: pantalla del cajero */
.demo-pos{ width:100%; max-width: 330px; background:#fff; color:#141414; border-radius:16px; padding:14px; box-shadow: 0 20px 50px rgba(0,0,0,.35); display:flex; flex-direction:column; gap:8px; }
.dp-head{ display:flex; justify-content:space-between; font-size:10.5px; font-weight:800; letter-spacing:.06em; color:#6b665c; }
.dp-head b{ color:#2f8f5b; display:inline-flex; align-items:center; gap:5px; }
.dp-head b::before{ content:''; width:6px; height:6px; border-radius:50%; background:#2f8f5b; }
.dp-item{ display:flex; justify-content:space-between; font-size:13px; font-weight:600; padding: 6px 0; border-bottom:1px solid #eee; }
.dp-item.added{ color:#5B2DB8; animation: hp-added 9s var(--ease) infinite both; }
.dp-sug{ max-height:140px; overflow:hidden; margin-top:4px; background:#141414; color:#fff; border-radius:12px; padding:11px 12px; animation: hp-sug 9s var(--ease) infinite both; }
.dp-sug small{ display:block; font-size:9.5px; font-weight:800; letter-spacing:.1em; color:#C7A6FF; }
.dp-sug strong{ display:block; margin-top:4px; font-size:13.5px; font-weight:700; }
.dp-sug .dp-btns{ display:flex; gap:6px; margin-top:9px; }
.dp-sug .dp-btns span{ font-size:11px; font-weight:800; padding:5px 12px; border-radius:8px; background: rgba(255,255,255,.12); }
.dp-sug .dp-btns span.yes{ background:#8B5FE0; animation: hp-press 9s var(--ease) infinite both; }
@keyframes hp-sug{ 0%,14%{opacity:0; transform:translateY(12px); max-height:140px; padding:11px 12px; margin-top:4px;} 20%,52%{opacity:1; transform:none; max-height:140px; padding:11px 12px; margin-top:4px;} 58%,100%{opacity:0; transform:translateY(-6px); max-height:0; padding:0 12px; margin-top:0;} }
@keyframes hp-press{ 0%,40%{transform:none; box-shadow:none;} 44%{transform:scale(.9);} 48%,100%{transform:none; box-shadow:0 0 0 4px rgba(139,95,224,.35);} }
@keyframes hp-added{ 0%,54%{opacity:0; max-height:0; padding:0; border-width:0;} 60%,94%{opacity:1; max-height:40px; padding:6px 0; border-width:1px;} 100%{opacity:0; max-height:40px; padding:6px 0; border-width:1px;} }

/* Concilia: los egresos se concilian uno a uno */
.hp-demo.is-green{ background: linear-gradient(160deg, #0b7a59 0%, #00412f 100%); }
.demo-conc{ width:100%; max-width: 340px; background:#fff; color:#141414; border-radius:14px; box-shadow: 0 20px 50px rgba(0,0,0,.35); overflow:hidden; font-size:12px; display:flex; flex-direction:column; }
.dc-bar{ display:flex; align-items:center; gap:6px; padding: 8px 12px; background:#f3f1ec; border-bottom:1px solid rgba(15,13,10,.08); }
.dc-bar i{ width:7px; height:7px; border-radius:50%; background:#d6d1c6; }
.dc-bar > span{ margin-left:6px; font-size:11px; font-weight:700; color:#5c584f; }
.dc-rows{ padding: 4px 12px; }
.dc-row{ display:grid; grid-template-columns: minmax(0,1fr) auto auto; gap:8px; align-items:center; padding: 7px 0; border-bottom:1px solid #eee; font-weight:600; }
.dc-src{ overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.dc-amt{ font-variant-numeric: tabular-nums; color:#5c584f; }
.dc-chip{ display:inline-grid; justify-items:end; min-width: 80px; }
/* En la grilla de 4 tarjetas (≥ 1241 px) la tarjeta es angosta: se omite el monto para que los bancos se lean. */
@media (min-width: 1241px){ .hp-card .dc-row{ grid-template-columns: minmax(0,1fr) auto; gap:6px; font-size:11px; } .hp-card .dc-amt{ display:none; } .hp-card .dc-rows{ padding: 4px 10px; } .hp-card .dc-chip{ min-width:0; } .hp-card .dc-chip > span{ padding: 3px 7px; font-size:9.5px; } }
.dc-chip > span{ grid-area: 1 / 1; padding: 3px 9px; border-radius:999px; font-size:10px; font-weight:800; white-space:nowrap; }
.dc-chip .pend{ background:#ECEAE4; color:#6b665c; animation: dc-pend 9s var(--ease) infinite both; }
.dc-chip .done{ background:#DDF2E6; color:#1d7a4d; animation: dc-done 9s var(--ease) infinite both; }
.dc-chip .done.info{ background:#E3ECFF; color:#2a4fb3; }
.dc-chip .done.warn{ background:#FFE9D6; color:#b35400; }
.dc-row:nth-child(2) .dc-chip > span{ animation-delay: .7s; }
.dc-row:nth-child(3) .dc-chip > span{ animation-delay: 1.4s; }
.dc-row:nth-child(4) .dc-chip > span{ animation-delay: 2.1s; }
.dc-meter{ display:grid; grid-template-columns: auto 1fr auto; gap:8px; align-items:center; padding: 9px 12px 4px; font-size:10.5px; font-weight:700; color:#5c584f; }
.dc-track{ height:7px; border-radius:999px; background:#ECEAE4; overflow:hidden; }
.dc-track i{ display:block; height:100%; width:94%; border-radius:999px; background:#0b7a59; transform-origin:left; animation: dc-fill 9s var(--ease) infinite both; }
.dc-meter b{ color:#0b7a59; }
.dc-stamp{ align-self:flex-start; margin: 6px 12px 12px; padding: 6px 11px; border-radius:9px; background:#141414; color:#fff; font-size:11px; font-weight:700; animation: dc-stamp 9s var(--ease) infinite both; }
@keyframes dc-pend{ 0%,16%{opacity:1;} 21%,100%{opacity:0;} }
@keyframes dc-done{ 0%,16%{opacity:0; transform:scale(.7);} 22%,92%{opacity:1; transform:none;} 100%{opacity:0; transform:none;} }
@keyframes dc-fill{ 0%,10%{transform:scaleX(0); opacity:1;} 52%,92%{transform:scaleX(1); opacity:1;} 100%{transform:scaleX(1); opacity:0;} }
@keyframes dc-stamp{ 0%,54%{opacity:0; transform:scale(1.3) rotate(-5deg);} 60%,92%{opacity:1; transform:rotate(-2deg);} 100%{opacity:0; transform:rotate(-2deg);} }

@media (prefers-reduced-motion: reduce){
  .hp-demo *, .hp-demo *::after{ animation: none !important; opacity: 1 !important; transform: none !important; }
  .db-typing{ display:none; }
  .dc-chip .pend{ display:none; }
}

/* ---------- Detalle (servicios/hecho-en-pivot.html) ---------- */
.hp-detail{ display:grid; grid-template-columns: 1fr 1.05fr; gap: clamp(28px,5vw,64px); align-items:center; }
.hp-detail .hp-demo{ min-height: 400px; border-radius: 22px; }
.hp-detail .hp-demo .demo-brain, .hp-detail .hp-demo .demo-focus, .hp-detail .hp-demo .demo-pos, .hp-detail .hp-demo .demo-conc{ max-width: 400px; transform: scale(1.08); }
@media (max-width: 880px){ .hp-detail{ grid-template-columns: 1fr; } .hp-detail .hp-demo{ min-height: 320px; } .hp-detail .hp-demo > div{ transform:none; } }
.hp-detail h2{ margin-top:14px; }
.hp-detail .lede{ margin-top:18px; }
.hp-checks{ margin-top:24px; display:flex; flex-direction:column; gap:12px; }
.hp-checks li{ display:flex; gap:12px; align-items:flex-start; font-size:15px; font-weight:500; line-height:1.45; }
.hp-checks li::before{ content:''; flex:none; width:20px; height:20px; margin-top:1px; border-radius:50%; background: var(--purple) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='3.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 12 4 4 8-9'/%3E%3C/svg%3E") center/12px no-repeat; }
.sec-light .hp-checks li{ color: var(--black); }
.hp-steps{ margin-top:48px; }
.hp-honest{ margin-top:14px; display:grid; grid-template-columns: 1fr 1fr; gap:12px; }
@media (max-width: 680px){ .hp-honest{ grid-template-columns: 1fr; } }
.hp-honest div{ padding:22px 24px; border-radius:16px; }
.hp-honest .yes{ background: rgba(62,142,99,.14); border:1px solid rgba(62,142,99,.45); }
.hp-honest .no{ background: rgba(255,122,61,.1); border:1px solid rgba(255,122,61,.45); }
.hp-honest small{ display:block; font-size:11px; font-weight:800; letter-spacing:.08em; text-transform:uppercase; }
.hp-honest .yes small{ color: #2f7a52; } .hp-honest .no small{ color:#c2551f; }
.hp-honest p{ margin-top:8px; font-size:15px; font-weight:600; color: var(--black); }
.hp-mini-cta{ margin-top:28px; display:flex; gap:12px; flex-wrap:wrap; }
.sec-light .hp-label{ background: rgba(139,95,224,.14); color:#5B2DB8; }
.sec-light .hp-kicker{ color:#5B2DB8; }

/* Choice grid: opción que ocupa el ancho completo */
.choice.span-2{ grid-column: 1 / -1; }
a.feature-item{ display:block; transition: border-color .25s var(--ease), transform .25s var(--ease); }
a.feature-item:hover{ border-color: var(--purple); transform: translateY(-2px); }

/* Fotos reales: encuadre para fotos cuadradas/verticales en bandas anchas */
.hero-bg img, .subhero-bg img{ object-position: center 40%; }
.media-frame img, .cta-band-bg img{ object-position: center 45%; }

/* Fundadores: monograma de marca hasta tener retratos oficiales */
.team-mono{ display:flex; align-items:center; justify-content:center; width:100%; aspect-ratio:1; border-radius:50%; margin-bottom:12px; font-size:40px; font-weight:800; letter-spacing:-.02em; color:#fff; }
.team-mono.o{ background: var(--orange); color: var(--black); }
.team-mono.g{ background: var(--green-rolex); }
.team-mono.p{ background: var(--purple); }
.testi-mark{ display:block; font-size:64px; line-height:.8; font-weight:800; color: var(--accent); height:40px; }

/* Tira de fotos reales (estilo flyer) */
.photo-strip{ display:grid; grid-template-columns: repeat(4, minmax(0,1fr)); gap:14px; }
.photo-strip-item{ position:relative; margin:0; height: clamp(220px, 24vw, 320px); border-radius:16px; overflow:hidden; background: var(--surface); }
.photo-strip-item img{ width:100%; height:100%; object-fit:cover; transition: transform .5s var(--ease); }
.photo-strip-item:hover img{ transform: scale(1.05); }
.photo-strip-item::after{ content:''; position:absolute; inset:auto 0 0 0; height:55%; background: linear-gradient(0deg, rgba(15,13,10,.78), rgba(15,13,10,0)); pointer-events:none; }
.photo-strip-item figcaption{ position:absolute; left:14px; right:14px; bottom:12px; z-index:1; font-size:12.5px; font-weight:700; line-height:1.3; color:#fff; }
@media (max-width: 860px){ .photo-strip{ grid-template-columns: 1fr 1fr; } }

/* ============ OLIMPO (agentes-ia) ============ */
.ol-section{ background: var(--black-soft); border-top:1px solid var(--line); border-bottom:1px solid var(--line); }
.ol-section h2{ margin-top:14px; }
.ol-section .lede{ margin-top:18px; }
.ol-head{ display:grid; grid-template-columns: 1fr 1fr; gap: clamp(28px,5vw,64px); align-items:center; }
@media (max-width: 900px){ .ol-head{ grid-template-columns:1fr; } }
.ol-promises{ margin-top:26px; display:flex; flex-direction:column; gap:12px; }
.ol-promises li{ display:flex; gap:12px; align-items:flex-start; font-size:15px; font-weight:600; line-height:1.45; }
.ol-promises svg{ flex:none; width:22px; height:22px; padding:4px; border-radius:50%; background: var(--green); color:#fff; margin-top:1px; }
.ol-visual{ position:relative; padding-bottom: 60px; }
.ol-photo{ border-radius:20px; overflow:hidden; aspect-ratio: 4/3; }
.ol-photo img{ width:100%; height:100%; object-fit:cover; object-position: center 40%; }
.ol-board{ position:absolute; right: clamp(-10px, -1vw, 0px); bottom:0; width: min(340px, 86%); background:#fff; color:#141414; border-radius:18px; padding:18px; box-shadow: 0 30px 60px rgba(0,0,0,.45); }
.ol-board-top{ display:flex; justify-content:space-between; font-size:10px; font-weight:800; letter-spacing:.12em; color:#6b665c; }
.ol-board-top em{ font-style:normal; color:#8B5FE0; }
.ol-board strong{ display:block; margin-top:10px; font-size:15px; font-weight:800; }
.ol-board p{ font-size:12.5px; color:#6b665c; margin-top:2px; }
.ol-board ol{ list-style:none; margin:12px 0 0; padding:0; display:flex; flex-direction:column; gap:7px; }
.ol-board li{ display:flex; align-items:center; gap:8px; font-size:12px; font-weight:600; }
.ol-board li svg{ flex:none; width:18px; height:18px; padding:3px; border-radius:50%; }
.ol-board li.ok svg{ background:#2f8f5b; color:#fff; }
.ol-board li.wait svg{ background:#F0E9FF; color:#5B2DB8; }
.ol-board li b{ margin-left:auto; font-size:11px; font-weight:800; padding:6px 12px; border-radius:8px; background:#8B5FE0; color:#fff; animation: ol-pulse 2.2s ease-in-out infinite; }
@keyframes ol-pulse{ 0%,100%{ box-shadow:0 0 0 0 rgba(139,95,224,.5);} 50%{ box-shadow:0 0 0 7px rgba(139,95,224,0);} }

.ol-flow{ margin-top: 70px; display:grid; grid-template-columns: repeat(5,1fr); gap:12px; counter-reset: s; }
@media (max-width: 1000px){ .ol-flow{ grid-template-columns: 1fr 1fr; } }
@media (max-width: 560px){ .ol-flow{ grid-template-columns: 1fr; } }
.ol-step{ position:relative; display:flex; flex-direction:column; gap:8px; padding: 22px 20px 20px; background: var(--surface); border:1px solid var(--line); border-radius:16px; }
.ol-step small{ font-size:11px; font-weight:800; color: var(--green); letter-spacing:.06em; }
.ol-step h4{ font-size:16.5px; font-weight:700; }
.ol-step p{ font-size:13.5px; color: var(--white-dim); font-weight:300; flex:1; }
.ol-gate{ margin-top:10px; padding-top:12px; border-top:1px dashed rgba(255,255,255,.2); display:flex; align-items:center; gap:8px; font-size:12px; font-weight:700; color:#8fe0b0; }
.ol-gate svg{ flex:none; width:22px; height:22px; padding:4px; border-radius:50%; background: rgba(62,142,99,.22); color:#8fe0b0; }

.ol-gods{ margin-top: 56px; display:grid; grid-template-columns: repeat(3,1fr); gap:12px; }
@media (max-width: 900px){ .ol-gods{ grid-template-columns: 1fr; } }
.ol-kratos{ grid-column: 1 / -1; display:flex; gap:22px; align-items:center; padding: 24px 26px; border-radius:18px; background: linear-gradient(120deg, #8B5FE0, #5B2DB8); }
.ol-k{ flex:none; width:74px; height:74px; border-radius:50%; background:#141414; display:flex; align-items:center; justify-content:center; font-size:34px; font-weight:900; color:#fff; box-shadow: 0 0 0 6px rgba(255,255,255,.15); }
.ol-kratos small, .ol-group small{ display:block; font-size:11px; font-weight:800; letter-spacing:.1em; }
.ol-kratos small{ color: rgba(255,255,255,.8); }
.ol-kratos h4{ font-size:24px; font-weight:800; margin-top:2px; }
.ol-kratos p{ margin-top:6px; font-size:14.5px; color: rgba(255,255,255,.9); max-width: 760px; }
.ol-group{ padding: 22px 22px 18px; border-radius:18px; background: var(--surface); border:1px solid var(--line); }
.ol-group.o small{ color: var(--orange); } .ol-group.g small{ color: #8fe0b0; } .ol-group.p small{ color:#C7A6FF; }
.ol-group ul{ margin-top:14px; display:flex; flex-direction:column; gap:10px; }
.ol-group li{ display:flex; flex-direction:column; padding-bottom:10px; border-bottom:1px solid var(--line); }
.ol-group li:last-child{ border-bottom:0; padding-bottom:0; }
.ol-group li strong{ font-size:15px; font-weight:800; }
.ol-group li span{ font-size:13px; color: var(--white-dim); font-weight:300; }
.ol-close{ margin-top: 40px; display:flex; flex-wrap:wrap; gap:18px; align-items:center; justify-content:space-between; padding: 26px 28px; border-radius:18px; border:1px solid rgba(62,142,99,.5); background: rgba(62,142,99,.1); }
.ol-close p{ font-size: clamp(16px,1.8vw,19px); max-width: 780px; line-height:1.45; }
@media (prefers-reduced-motion: reduce){ .ol-board li b{ animation:none; } }
.ol-section .eyebrow{ color:#8fe0b0; }
@media (max-width: 600px){ .ol-visual{ padding-bottom:0; } .ol-board{ position:relative; right:auto; width:auto; margin:-48px 12px 0; } }

/* =====================================================
   HOME v2 · experiencia rediseñada
   ===================================================== */
.nav-brand img{ height: 30px; }
.nav-links a{ position:relative; }
.nav-links a.is-active{ opacity:1; }
.nav-links a.is-active::after{ content:''; position:absolute; left:0; right:0; bottom:-6px; height:2px; border-radius:2px; background: var(--orange); }
.nav-cta{ padding:11px 20px !important; }
.btn-lg{ padding: 17px 28px; font-size: 15px; }

/* Menú móvil */
.nav-burger{ display:none; width:44px; height:44px; border-radius:12px; border:1px solid var(--line); background: rgba(255,255,255,.04); flex-direction:column; align-items:center; justify-content:center; gap:5px; padding:0; }
.nav-burger span{ display:block; width:18px; height:2px; border-radius:2px; background:#fff; transition: transform .25s var(--ease), opacity .2s; }
.nav-burger[aria-expanded="true"] span:nth-child(1){ transform: translateY(7px) rotate(45deg); }
.nav-burger[aria-expanded="true"] span:nth-child(2){ opacity:0; }
.nav-burger[aria-expanded="true"] span:nth-child(3){ transform: translateY(-7px) rotate(-45deg); }
.mobile-menu{ position:fixed; z-index:99; inset: 70px 0 auto 0; background: rgba(15,13,10,.98); border-bottom:1px solid var(--line); padding: 10px var(--pad) 26px; display:flex; flex-direction:column; }
.mobile-menu[hidden]{ display:none; }
.mobile-menu a:not(.btn){ padding: 16px 0; border-bottom:1px solid var(--line); font-size:17px; font-weight:700; }
.mobile-menu .btn{ margin-top:20px; justify-content:center; }
@media (max-width: 900px){
  .nav-burger{ display:flex; }
  .nav-cta{ display:none !important; }
  .nav-brand img{ height: 24px; }
}

/* Hero v2 */
.hero-v2{ min-height: 100svh; padding-top: 130px; padding-bottom: 0; justify-content: space-between; }
.hero-v2 .hero-bg::after{ background: linear-gradient(90deg, rgba(15,13,10,.94) 0%, rgba(15,13,10,.78) 42%, rgba(15,13,10,.35) 75%, rgba(15,13,10,.55) 100%), linear-gradient(0deg, rgba(15,13,10,.95) 0%, rgba(15,13,10,0) 40%); }
.hero-v2 .hero-bg img{ object-position: 65% 40%; }
.hero-grid{ display:grid; grid-template-columns: minmax(0,1.35fr) minmax(0,.8fr); gap: 48px; align-items:end; flex:1; padding-bottom: 56px; }
.hero-v2 .hero-content{ max-width: 720px; align-self:center; }
.hero-v2 h1{ font-size: clamp(38px, 5.4vw, 72px); margin: 22px 0 22px; text-wrap: balance; }
.hero-v2 .lede{ color: #e6e0d6; max-width: 560px; }
.hero-v2 .hero-actions{ margin-top: 32px; }
.hero-note{ display:flex; align-items:center; gap:10px; font-size:13px; }
.live-dot{ width:8px; height:8px; border-radius:50%; background:#3ecf7a; box-shadow:0 0 0 0 rgba(62,207,122,.6); animation: live 2.4s infinite; flex:none; }
@keyframes live{ 70%{ box-shadow:0 0 0 9px rgba(62,207,122,0);} 100%{ box-shadow:0 0 0 0 rgba(62,207,122,0);} }
.hero-card{ background: rgba(23,20,15,.72); backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(14px); border:1px solid rgba(255,255,255,.14); border-radius: 22px; padding: 10px 26px 22px; }
.hc-row{ display:flex; align-items:baseline; gap:16px; padding: 18px 0; border-bottom:1px solid rgba(255,255,255,.12); }
.hc-row strong{ font-size: 44px; font-weight:800; line-height:1; min-width: 44px; color: var(--orange); }
.hc-row:nth-child(2) strong{ color:#6fd39a; } .hc-row:nth-child(3) strong{ color:#b79bff; }
.hc-row span{ font-size:14px; color: var(--white-dim); font-weight:500; line-height:1.35; }
.hc-flags{ padding-top:16px; font-size:12px; font-weight:700; letter-spacing:.06em; text-transform:uppercase; color: var(--white-dim); }
@media (max-width: 960px){ .hero-grid{ grid-template-columns:1fr; gap:28px; } .hero-card{ display:grid; grid-template-columns: repeat(3,1fr); gap:0 16px; padding:16px 18px; } .hc-row{ flex-direction:column; gap:6px; border-bottom:0; padding:6px 0; } .hc-row strong{ font-size:32px; } .hc-flags{ grid-column:1/-1; border-top:1px solid rgba(255,255,255,.12); padding-top:12px; margin-top:6px; } }
@media (max-width: 480px){ .hc-row span{ font-size:12px; } }

/* Franja de clientes */
.clients-band{ position:relative; display:flex; align-items:center; gap:28px; border-top:1px solid rgba(255,255,255,.12); padding: 18px var(--pad); background: rgba(15,13,10,.6); backdrop-filter: blur(6px); }
.clients-label{ flex:none; font-size:11.5px; font-weight:800; letter-spacing:.1em; text-transform:uppercase; color: var(--white-dim); }
.clients-viewport{ overflow:hidden; flex:1; -webkit-mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent); mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent); }
.clients-track{ display:inline-flex; align-items:center; gap:26px; white-space:nowrap; animation: marquee-scroll 45s linear infinite; }
.clients-track span{ font-size:15px; font-weight:700; color:#fff; opacity:.85; }
.clients-track i{ width:6px; height:6px; border-radius:50%; background: var(--orange); opacity:.8; }
.clients-track i:nth-of-type(3n+2){ background: var(--green); } .clients-track i:nth-of-type(3n){ background: var(--purple); }
.clients-band:hover .clients-track{ animation-play-state: paused; }
@media (max-width: 700px){ .clients-band{ flex-direction:column; align-items:flex-start; gap:10px; } .clients-viewport{ width:100%; } }
@media (prefers-reduced-motion: reduce){ .clients-track{ animation:none; flex-wrap:wrap; white-space:normal; } }

/* Selector ¿por dónde empiezo? */
.chooser{ background: var(--cream); color: var(--black); }
.chooser .eyebrow{ color: #c2551f; }
.chooser-head{ display:grid; grid-template-columns: 1fr 1fr; gap: 40px; align-items:end; margin-bottom: 40px; }
.chooser-head h2{ margin-top:14px; font-size: clamp(30px,4.2vw,52px); }
.chooser-head .lede{ color:#5c584f; }
@media (max-width: 860px){ .chooser-head{ grid-template-columns:1fr; gap:14px; } }
.chooser-box{ display:grid; grid-template-columns: minmax(0,.9fr) minmax(0,1.6fr); gap:16px; }
@media (max-width: 960px){ .chooser-box{ grid-template-columns:1fr; } }
.ch-tabs{ display:flex; flex-direction:column; gap:10px; }
.ch-tab{ --c: var(--orange); text-align:left; display:flex; gap:14px; align-items:flex-start; padding: 20px 20px; border-radius:16px; border:1.5px solid rgba(15,13,10,.12); background:#fff; color: var(--black); font-size:16px; font-weight:700; line-height:1.35; transition: border-color .2s, transform .2s, box-shadow .2s, background .2s; }
.ch-tab[data-color="green"]{ --c: var(--green-rolex); } .ch-tab[data-color="purple"]{ --c: #6a3bd0; }
.ch-tab:hover{ transform: translateX(4px); border-color: var(--c); }
.ch-tab[aria-selected="true"]{ background: var(--black); color:#fff; border-color: var(--black); box-shadow: 0 14px 30px -14px rgba(15,13,10,.45); }
.ch-n{ flex:none; width:30px; height:30px; border-radius:50%; display:flex; align-items:center; justify-content:center; font-size:11.5px; font-weight:800; background: rgba(15,13,10,.07); color: var(--c); }
.ch-tab[aria-selected="true"] .ch-n{ background: var(--c); color:#fff; }
.ch-tab[data-color="orange"][aria-selected="true"] .ch-n{ color: var(--black); }
@media (max-width: 960px){ .ch-tabs{ flex-direction:row; overflow-x:auto; scroll-snap-type:x mandatory; padding-bottom:4px; scrollbar-width:none; } .ch-tabs::-webkit-scrollbar{ display:none; } .ch-tab{ flex: 0 0 78%; scroll-snap-align:start; font-size:15px; } .ch-tab:hover{ transform:none; } }
.ch-panel{ --c: var(--orange); display:grid; grid-template-columns: 1fr 1fr; min-height: 100%; border-radius:20px; overflow:hidden; background: var(--black); color:#fff; animation: step-in .45s var(--ease); }
.ch-panel[hidden]{ display:none; }
.ch-panel[data-color="green"]{ --c: #3E8E63; } .ch-panel[data-color="purple"]{ --c: var(--purple); }
.ch-photo{ position:relative; min-height: 300px; }
.ch-photo img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
.ch-photo::after{ content:''; position:absolute; inset:0; background: linear-gradient(90deg, rgba(15,13,10,0) 60%, rgba(15,13,10,.9)); }
.ch-body{ padding: clamp(24px,3.2vw,40px); display:flex; flex-direction:column; }
.ch-kicker{ font-size:11.5px; font-weight:800; letter-spacing:.1em; text-transform:uppercase; color: var(--c); }
.ch-body h3{ margin-top:10px; font-size: clamp(22px,2.4vw,30px); color:#fff; }
.ch-list{ margin-top:20px; display:flex; flex-direction:column; gap:12px; }
.ch-list li{ display:flex; gap:12px; font-size:15px; line-height:1.45; color:#e6e0d6; }
.ch-list li::before{ content:''; flex:none; width:8px; height:8px; margin-top:7px; border-radius:50%; background: var(--c); }
.ch-actions{ margin-top:auto; padding-top:28px; display:flex; gap:10px; flex-wrap:wrap; }
@media (max-width: 640px){ .ch-panel{ grid-template-columns:1fr; } .ch-photo{ min-height:200px; } .ch-photo::after{ background: linear-gradient(0deg, rgba(15,13,10,.85), rgba(15,13,10,0) 55%); } }

/* Nosotros v2 */
.about-grid{ display:grid; grid-template-columns: minmax(0,1fr) minmax(0,1.1fr); gap: clamp(28px,5vw,64px); align-items:center; }
@media (max-width: 960px){ .about-grid{ grid-template-columns:1fr; } }
.about .section-head{ margin-bottom:0; }
.about-quote{ margin-top:22px; font-size: clamp(18px,2vw,22px); font-weight:700; line-height:1.35; color: var(--black); padding-left:18px; border-left:3px solid var(--orange); }
.about .team-row{ margin-top:32px; gap:14px; overflow:visible; }
.about .team-card{ flex:1 1 0; min-width:0; }
.about .team-mono{ font-size: clamp(22px,3vw,34px); }
.mosaic{ display:grid; grid-template-columns: 1.3fr 1fr; grid-template-rows: 220px 170px 190px; gap:12px; }
.mosaic figure{ margin:0; position:relative; border-radius:18px; overflow:hidden; background:#ddd; }
.mosaic img{ width:100%; height:100%; object-fit:cover; transition: transform .6s var(--ease); }
.mosaic figure:hover img{ transform: scale(1.05); }
.mosaic .m1{ grid-row: 1 / 3; } .mosaic .m2{ grid-row: 1 / 2; } .mosaic .m3{ grid-row: 2 / 4; } .mosaic .m4{ grid-row: 3 / 4; grid-column: 1 / 2; }
.mosaic .m4 img{ object-position: center 78%; }
.mosaic figcaption{ position:absolute; top:12px; left:12px; font-size:10.5px; font-weight:800; letter-spacing:.06em; text-transform:uppercase; background: rgba(15,13,10,.72); color:#fff; padding:7px 12px; border-radius:999px; }
@media (max-width: 560px){ .mosaic{ grid-template-rows: 170px 130px 150px; } }

/* Proceso: línea de tiempo */
.timeline{ list-style:none; margin: 10px 0 0; padding:0; display:grid; grid-template-columns: repeat(4,1fr); gap:14px; position:relative; }
.timeline::before{ content:''; position:absolute; top:26px; left:26px; right:26px; height:2px; background: linear-gradient(90deg, var(--orange), var(--green), var(--purple)); opacity:.7; }
.timeline li{ position:relative; }
.tl-n{ position:relative; z-index:1; display:flex; align-items:center; justify-content:center; width:54px; height:54px; border-radius:50%; background: var(--black); border:2px solid var(--orange); font-weight:800; font-size:14px; color:#fff; }
.timeline li:nth-child(2) .tl-n{ border-color:#c9a13a; } .timeline li:nth-child(3) .tl-n{ border-color: var(--green); } .timeline li:nth-child(4) .tl-n{ border-color: var(--purple); }
.timeline h4{ margin-top:18px; font-size:18px; font-weight:700; }
.timeline p{ margin-top:8px; font-size:14px; color: var(--white-dim); font-weight:300; max-width: 260px; }
@media (max-width: 860px){ .timeline{ grid-template-columns:1fr; gap:22px; } .timeline::before{ top:26px; bottom:26px; left:26px; right:auto; width:2px; height:auto; background: linear-gradient(180deg, var(--orange), var(--green), var(--purple)); } .timeline li{ display:grid; grid-template-columns: 54px 1fr; column-gap:18px; } .timeline h4{ margin-top:4px; } .timeline p{ grid-column:2; max-width:none; } }

/* Minidiagnóstico v2 */
.diag-grid{ display:grid; grid-template-columns: minmax(0,.85fr) minmax(0,1.15fr); gap: clamp(28px,5vw,64px); align-items:start; }
@media (max-width: 960px){ .diag-grid{ grid-template-columns:1fr; } }
.diag-side h2{ margin-top:14px; }
.diag-side .lede{ margin-top:16px; }
.next-steps{ list-style:none; margin: 28px 0 0; padding:0; display:flex; flex-direction:column; gap:14px; }
.next-steps li{ display:flex; gap:14px; align-items:flex-start; font-size:15px; font-weight:500; color:#e6e0d6; line-height:1.45; }
.next-steps b{ flex:none; width:30px; height:30px; border-radius:50%; background: rgba(255,122,61,.16); color: var(--orange); display:flex; align-items:center; justify-content:center; font-size:13px; }
.diag-direct{ margin-top:26px; font-size:14px; color: var(--white-dim); }
.diag-direct a{ color:#fff; font-weight:700; text-decoration: underline; text-underline-offset:4px; }
@media (min-width: 961px){ .diag-side{ position: sticky; top: 110px; } }

/* CTA fijo en celular */
.sticky-cta{ display:none; }
@media (max-width: 760px){
  .sticky-cta{ display:block; position:fixed; z-index:90; left:0; right:0; bottom:0; padding: 12px 16px calc(12px + env(safe-area-inset-bottom)); background: linear-gradient(0deg, rgba(15,13,10,.96) 60%, rgba(15,13,10,0)); transform: translateY(110%); transition: transform .35s var(--ease); }
  .sticky-cta.show{ transform:none; }
  .sticky-cta .btn{ width:100%; justify-content:center; padding:16px; }
}
/* Logo recortado: tamaños reales */
.nav-brand img{ height: 34px; }
.footer-brand .nav-brand img{ height: 32px; }
@media (max-width: 900px){ .nav-brand img{ height: 28px; } }
/* Testimonios: grilla en escritorio para que no se corten */
@media (min-width: 901px){ .testimonials{ display:grid; grid-template-columns: repeat(3,1fr); overflow:visible; } .testi-card{ min-width:0; } }
.ch-hint{ display:none; }
@media (max-width: 960px){ .ch-hint{ display:block; font-size:12.5px; font-weight:700; color:#8a8478; margin-bottom:10px; } }
.hero-v2 .hero-bg img{ object-position: 70% 62%; }
.hero-v2 .hero-bg::after{ background: linear-gradient(90deg, rgba(15,13,10,.92) 0%, rgba(15,13,10,.7) 38%, rgba(15,13,10,.15) 70%, rgba(15,13,10,.2) 100%), linear-gradient(0deg, rgba(15,13,10,.9) 0%, rgba(15,13,10,0) 35%); }
.hero-v2 .hero-bg img{ object-position: 80% 70%; }

/* =====================================================
   PULIDO UX / UI
   ===================================================== */
/* Anclas: que el menú fijo no tape los títulos */
section[id], header[id]{ scroll-margin-top: 84px; }

/* Saltar al contenido (teclado / lectores de pantalla) */
.skip-link{ position:fixed; top:-60px; left:16px; z-index:200; background: var(--orange); color: var(--black); font-weight:800; padding:12px 18px; border-radius:10px; transition: top .2s; }
.skip-link:focus{ top:12px; }

/* Barra de progreso de lectura */
.scroll-progress{ position:fixed; top:0; left:0; height:3px; width:100%; z-index:120; transform-origin:0 50%; transform: scaleX(0); background: linear-gradient(90deg, var(--orange), #c9a13a 35%, var(--green) 65%, var(--purple)); pointer-events:none; }

/* Menú que se esconde al bajar y aparece al subir */
.nav{ transition: transform .35s var(--ease), background .3s, padding .3s; }
.nav.nav-hidden{ transform: translateY(-100%); }

/* Hero: movimiento lento de la foto + indicador de scroll */
.hero-v2 .hero-bg img{ animation: kenburns 22s ease-in-out infinite alternate; transform-origin: 70% 60%; }
@keyframes kenburns{ from{ transform: scale(1); } to{ transform: scale(1.08); } }
.hero-v2 .hero-content > *{ animation: hero-in .9s var(--ease) both; }
.hero-v2 .hero-content > *:nth-child(2){ animation-delay: .08s; } .hero-v2 .hero-content > *:nth-child(3){ animation-delay: .16s; }
.hero-v2 .hero-content > *:nth-child(4){ animation-delay: .24s; } .hero-v2 .hero-content > *:nth-child(5){ animation-delay: .32s; }
.hero-v2 .hero-card{ animation: hero-in 1s var(--ease) .4s both; }
@keyframes hero-in{ from{ opacity:0; transform: translateY(22px); } to{ opacity:1; transform:none; } }
.hero-v2 .hero-card.reveal{ opacity:1; transform:none; }
@media (max-width: 760px){ .hero-v2{ min-height: auto; padding-top: 110px; } .hero-grid{ padding-bottom: 36px; } }

/* Aparición escalonada de grillas */
.reveal.stagger > *{ opacity:0; transform: translateY(18px); transition: opacity .6s var(--ease), transform .6s var(--ease); }
.reveal.stagger.in > *{ opacity:1; transform:none; }
.reveal.stagger.in > *:nth-child(2){ transition-delay:.08s; } .reveal.stagger.in > *:nth-child(3){ transition-delay:.16s; }
.reveal.stagger.in > *:nth-child(4){ transition-delay:.24s; } .reveal.stagger.in > *:nth-child(5){ transition-delay:.32s; }

/* Imágenes: aparecen suave al cargar */
img.img-fade{ opacity:0; transition: opacity .6s var(--ease), transform .6s var(--ease); }
img.img-fade.loaded{ opacity:1; }

/* Foco visible y consistente */
.btn:focus-visible, .ch-tab:focus-visible, .choice:has(input:focus-visible), .hp-card:focus-visible, a:focus-visible{ outline: 3px solid var(--orange); outline-offset: 3px; }
.btn:active{ transform: translateY(0) scale(.98); }

/* Tarjetas: elevación al pasar el mouse */
.testi-card, .ol-group, .ol-step, .feature-item, .process-step{ transition: transform .3s var(--ease), box-shadow .3s var(--ease), border-color .3s; }
.testi-card:hover, .ol-group:hover, .ol-step:hover, .feature-item:hover{ transform: translateY(-4px); box-shadow: 0 18px 40px -22px rgba(0,0,0,.45); }

/* Formulario: paso actual, check en opción elegida, errores claros */
.diag-steplabel{ display:flex; justify-content:space-between; align-items:center; margin: -18px 0 22px; font-size:12px; font-weight:800; letter-spacing:.08em; text-transform:uppercase; color: var(--white-dim); }
.diag-steplabel b{ color: var(--orange); }
.choice{ padding-right: 44px; }
.choice::after{ content:''; position:absolute; top:16px; right:16px; width:20px; height:20px; border-radius:50%; border:1.5px solid rgba(255,255,255,.3); transition: all .2s var(--ease); }
.choice:has(input:checked)::after{ border-color: var(--orange); background: var(--orange) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230f0d0a' stroke-width='3.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 12 4 4 8-9'/%3E%3C/svg%3E") center/12px no-repeat; }
.choice:hover{ border-color: rgba(255,122,61,.55); }
.field.has-error input, .field.has-error textarea, .field.has-error select{ border-color:#ff6b5b; }
.field-error{ display:block; margin-top:7px; font-size:12.5px; font-weight:600; color:#ff8b7e; }
.diag-alert{ margin-top:14px; font-size:13px; font-weight:600; color:#ff8b7e; }
.diag-step.shake{ animation: shake .4s; }
@keyframes shake{ 20%,60%{ transform: translateX(-6px);} 40%,80%{ transform: translateX(6px);} }
.field input, .field textarea, .field select{ min-height: 48px; }

/* Volver arriba */
.to-top{ position:fixed; right:20px; bottom:22px; z-index:85; width:48px; height:48px; border-radius:50%; border:1px solid rgba(255,255,255,.2); background: rgba(23,20,15,.85); backdrop-filter: blur(8px); color:#fff; display:flex; align-items:center; justify-content:center; opacity:0; pointer-events:none; transform: translateY(10px); transition: opacity .3s, transform .3s; }
.to-top.show{ opacity:1; pointer-events:auto; transform:none; }
.to-top:hover{ border-color: var(--orange); }
.to-top svg{ width:20px; height:20px; }
@media (max-width: 760px){ .to-top{ bottom: 88px; right:14px; width:44px; height:44px; } }

@media (prefers-reduced-motion: reduce){
  .hero-v2 .hero-bg img, .hero-v2 .hero-content > *, .hero-v2 .hero-card{ animation:none !important; }
  .reveal.stagger > *, img.img-fade{ opacity:1 !important; transform:none !important; transition:none !important; }
  .nav.nav-hidden{ transform:none; }
}
.diag-back{ background:none; border:0; padding:12px 4px; min-height:44px; transition: color .2s; }
.diag-back:hover{ color:#fff; }
@media (max-width: 960px){ .hero-v2 .hero-bg::after{ background: linear-gradient(180deg, rgba(15,13,10,.86) 0%, rgba(15,13,10,.74) 55%, rgba(15,13,10,.9) 100%); } }

/* ===== Servicios visibles + minidiagnóstico PRO ===== */
.services-v2{ background: var(--black); }
.services-v2 .services-grid{ grid-template-columns: repeat(4, 1fr); }
.services-v2 .face-card{ min-height: 420px; }
@media (max-width: 1100px){ .services-v2 .services-grid{ grid-template-columns: repeat(2, 1fr); } .services-v2 .face-card{ min-height: 340px; } }
@media (max-width: 640px){ .services-v2 .services-grid{ grid-template-columns: 1fr; } }
.svc-help{ margin-top: 26px; font-size: 15px; color: var(--white-dim); }
.svc-help a{ color:#fff; font-weight:700; text-decoration: underline; text-decoration-color: var(--orange); text-underline-offset: 5px; margin-left:6px; }
.svc-help a:hover{ color: var(--orange); }

.field-row{ display:grid; grid-template-columns: 1fr 1fr; gap: 0 14px; }
@media (max-width: 560px){ .field-row{ grid-template-columns: 1fr; } }
.chip-grid{ display:flex; flex-wrap:wrap; gap:8px; }
.chipc{ position:relative; display:inline-flex; align-items:center; min-height:40px; padding: 9px 15px; border-radius:999px; border:1px solid var(--line); background: var(--black); font-size:13.5px; font-weight:600; color: var(--white-dim); cursor:pointer; transition: all .2s var(--ease); text-transform:none; letter-spacing:0; margin:0; }
.field .chipc{ display:inline-flex; margin-bottom:0; }
.chipc input{ position:absolute; opacity:0; inset:0; margin:0; cursor:pointer; }
.chipc:hover{ border-color: rgba(255,122,61,.55); color:#fff; }
.chipc:has(input:checked){ background: rgba(255,122,61,.16); border-color: var(--orange); color:#fff; }
.chipc:has(input:checked)::before{ content:'✓'; margin-right:7px; color: var(--orange); font-weight:800; }
.chipc:has(input:focus-visible){ outline: 3px solid var(--orange); outline-offset: 2px; }
.chip-grid.has-error .chipc{ border-color:#ff6b5b; }
.field select:invalid, .field select option[value=""]{ color: var(--white-dim); }
.consent{ display:flex; gap:12px; align-items:flex-start; margin-top: 6px; font-size:13px; line-height:1.5; color: var(--white-dim); cursor:pointer; }
.consent input{ flex:none; width:20px; height:20px; margin-top:1px; accent-color: var(--orange); }
.consent.has-error span{ color:#ff8b7e; }
.diag-privacy{ margin-top:26px; padding:14px 16px; border-radius:12px; background: rgba(62,142,99,.12); border:1px solid rgba(62,142,99,.35); font-size:13.5px; color:#cfe9da; }
.diag-step textarea{ min-height: 110px; }
.field .chipc{ font-size:13.5px; font-weight:600; color: var(--white-dim); letter-spacing:0; text-transform:none; }
.field .chipc:has(input:checked){ color:#fff; }

/* Entrevista de diagnóstico (página Diagnóstico) */
.iv-section{ background: var(--black-soft); border-top:1px solid var(--line); }
.iv-head{ display:grid; grid-template-columns: 1fr 1fr; gap: 40px; align-items:end; margin-bottom: 40px; }
.iv-head h2{ margin-top:14px; }
@media (max-width: 860px){ .iv-head{ grid-template-columns:1fr; gap:14px; } }
.iv-grid{ display:grid; grid-template-columns: repeat(4,1fr); gap:12px; }
@media (max-width: 1000px){ .iv-grid{ grid-template-columns: 1fr 1fr; } }
@media (max-width: 560px){ .iv-grid{ grid-template-columns: 1fr; } }
.iv-card{ padding: 22px 20px; border-radius:16px; background: var(--surface); border:1px solid var(--line); transition: transform .3s var(--ease), border-color .3s; }
.iv-card:hover{ transform: translateY(-4px); border-color: rgba(255,122,61,.5); }
.iv-n{ display:inline-flex; align-items:center; justify-content:center; width:36px; height:36px; border-radius:10px; background: rgba(255,122,61,.14); color: var(--orange); font-weight:800; font-size:13px; }
.iv-card h4{ margin-top:14px; font-size:16.5px; font-weight:700; }
.iv-card p{ margin-top:8px; font-size:13.5px; line-height:1.5; color: var(--white-dim); font-weight:300; }
.iv-lab{ margin-top:24px; display:flex; gap:22px; align-items:center; justify-content:space-between; flex-wrap:wrap; padding: 24px 26px; border-radius:18px; border:1px dashed rgba(255,122,61,.5); }
.iv-lab > div{ flex: 1 1 420px; }
.iv-tag{ font-size:11.5px; font-weight:800; letter-spacing:.1em; text-transform:uppercase; color: var(--orange); }
.iv-lab p{ margin-top:6px; font-size:14.5px; color: var(--white-dim); }
.services-v2 .face-card::after{ background: linear-gradient(180deg, rgba(15,13,10,.25) 0%, rgba(15,13,10,.78) 38%, rgba(15,13,10,.96) 75%); }
.services-v2 .face-card[data-service="agentes"]{ --face-color: #6fd39a; }
.services-v2 .face-card[data-service="cocreacion"]{ --face-color: #b79bff; }
.services-v2 .section-head .lede{ margin-top:14px; }
.services-v2 .face-card p{ color:#e6e0d6; }
