/* ============================================================================
   KONTENT — landing page stylesheet
   Built on the KONTENT Design System tokens. "Lima sobre negro." Make it Real.
   Dark-first. One accent: neon lime #CBFF08. Ruder Plakat caps + Monument Grotesk.
   ========================================================================== */

/* ---- Fonts --------------------------------------------------------------- */
@font-face {
  font-family: "Ruder Plakat";
  src: url("../assets/fonts/RuderPlakat-Regular.woff2") format("woff2"),
       url("../assets/fonts/RuderPlakat-Regular.woff") format("woff");
  font-weight: 400 900; font-style: normal; font-display: swap;
}
@font-face {
  font-family: "Monument Grotesk";
  src: url("../assets/fonts/MonumentGrotesk-Regular.woff2") format("woff2"),
       url("../assets/fonts/MonumentGrotesk-Regular.woff") format("woff");
  font-weight: 400; font-style: normal; font-display: swap;
}
@font-face {
  font-family: "Monument Grotesk";
  src: url("../assets/fonts/MonumentGrotesk-Italic.woff2") format("woff2");
  font-weight: 400; font-style: italic; font-display: swap;
}
@font-face {
  font-family: "Monument Grotesk";
  src: url("../assets/fonts/MonumentGrotesk-Medium.woff2") format("woff2"),
       url("../assets/fonts/MonumentGrotesk-Medium.woff") format("woff");
  font-weight: 500; font-style: normal; font-display: swap;
}
@font-face {
  font-family: "Monument Grotesk";
  src: url("../assets/fonts/MonumentGrotesk-Bold.woff2") format("woff2"),
       url("../assets/fonts/MonumentGrotesk-Bold.woff") format("woff");
  font-weight: 700; font-style: normal; font-display: swap;
}
@font-face {
  font-family: "Monument Grotesk Mono";
  src: url("../assets/fonts/MonumentGrotesk-Mono.woff2") format("woff2"),
       url("../assets/fonts/MonumentGrotesk-Mono.woff") format("woff");
  font-weight: 400; font-style: normal; font-display: swap;
}

/* ---- Tokens -------------------------------------------------------------- */
:root {
  /* color */
  --lime-500:#CBFF08; --lime-400:#D7FF45; --lime-600:#B2E000;
  --lime-glow:rgba(203,255,8,.35);
  --ink-900:#000; --ink-850:#070707; --ink-800:#0E0E0E; --ink-700:#161616;
  --ink-600:#1E1E1E; --ink-500:#2A2A2A; --ink-400:#3A3A3A;
  --grey-500:#6E6E6E; --grey-400:#8A8A8A; --grey-300:#B4B4B4; --grey-200:#DADADA; --grey-100:#F0F0F0;
  --white:#FFF; --paper:#F4F4F1;
  --surface-page:var(--ink-850); --surface-base:var(--ink-800);
  --surface-card:var(--ink-700); --surface-raised:var(--ink-600);
  --text-primary:var(--white); --text-secondary:var(--grey-400); --text-muted:var(--grey-500);
  --text-accent:var(--lime-500); --text-on-lime:#0A0A00; --text-on-light:var(--ink-850);
  --border-subtle:var(--ink-500); --border-strong:var(--ink-400); --border-lime:var(--lime-500);
  --action-fill:var(--lime-500); --action-fill-hover:var(--lime-400); --action-fill-active:var(--lime-600);
  --focus-ring:var(--lime-glow);

  /* type */
  --font-display:"Ruder Plakat","Arial Narrow",system-ui,sans-serif;
  --font-text:"Inter","Monument Grotesk","Helvetica Neue",Arial,sans-serif;
  --font-ui:"Archivo","Inter","Helvetica Neue",Arial,sans-serif;
  --font-mono:"Monument Grotesk Mono",ui-monospace,"SF Mono",Menlo,monospace;
  --display-hero:clamp(2.7rem,7vw,6.6rem);
  --display-xl:clamp(2.6rem,6vw,5.5rem);
  --display-lg:clamp(2.15rem,4.5vw,4rem);
  --display-md:clamp(1.75rem,3vw,2.75rem);
  --heading-md:1.5rem; --heading-sm:1.25rem;
  --text-lead:clamp(1.15rem,1.6vw,1.4rem); --text-lg:1.125rem; --text-base:1rem;
  --text-sm:.875rem; --text-xs:.8125rem;
  --label-md:.875rem; --label-sm:.75rem; --label-xs:.6875rem;
  --tracking-display:.04em; --tracking-label:.14em;

  /* spacing / layout */
  --space-1:4px; --space-2:8px; --space-3:12px; --space-4:16px; --space-5:24px;
  --space-6:32px; --space-7:48px; --space-8:64px; --space-9:96px; --space-10:128px; --space-11:160px;
  --container-max:1280px; --container-wide:1480px;
  --gutter:clamp(20px,5vw,64px); --section-y:clamp(52px,7vw,104px);

  /* radii / borders / shadow */
  --radius-xs:2px; --radius-sm:4px; --radius-md:8px; --radius-lg:14px; --radius-pill:999px;
  --shadow-card:0 1px 0 rgba(255,255,255,.04) inset,0 8px 30px rgba(0,0,0,.45);
  --shadow-pop:0 18px 50px rgba(0,0,0,.6);
  --glow-lime:0 0 0 1px rgba(203,255,8,.5),0 0 28px rgba(203,255,8,.28);
  --glow-lime-soft:0 0 22px rgba(203,255,8,.22);

  /* motion */
  --ease-out:cubic-bezier(.22,1,.36,1); --ease-in-out:cubic-bezier(.65,0,.35,1);
  --dur-fast:120ms; --dur-base:220ms; --dur-slow:420ms; --dur-marquee:42s;
}

/* ---- Reset / base -------------------------------------------------------- */
*,*::before,*::after{box-sizing:border-box;}
html{-webkit-text-size-adjust:100%;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;scroll-behavior:smooth;}
body{
  margin:0;background:var(--surface-page);color:var(--text-primary);
  font-family:var(--font-text);font-size:var(--text-base);font-weight:400;line-height:1.5;
  overflow-x:hidden;
}
img,svg,video{display:block;max-width:100%;}
a{color:inherit;text-decoration:none;}
button{font-family:inherit;}
h1,h2,h3,h4,p{margin:0;}
::selection{background:var(--lime-500);color:var(--text-on-lime);}
:focus-visible{outline:none;box-shadow:0 0 0 3px var(--focus-ring);}
::-webkit-scrollbar{width:10px;}
::-webkit-scrollbar-track{background:var(--ink-900);}
::-webkit-scrollbar-thumb{background:var(--ink-500);border-radius:999px;}
::-webkit-scrollbar-thumb:hover{background:var(--lime-600);}

/* ---- Typography utilities ----------------------------------------------- */
.k-display{
  font-family:var(--font-display);text-transform:uppercase;line-height:.96;
  letter-spacing:var(--tracking-display);font-weight:400;
}
.eyebrow{
  font-family:var(--font-mono);text-transform:uppercase;letter-spacing:var(--tracking-label);
  font-size:var(--label-sm);color:var(--text-accent);display:inline-flex;gap:.6em;align-items:baseline;
}
.eyebrow .num{color:var(--grey-500);}
.lead{font-size:var(--text-lead);line-height:1.5;color:var(--grey-300);}
.muted{color:var(--grey-400);}
.lime{color:var(--lime-500);}

/* ---- Layout primitives --------------------------------------------------- */
.container{max-width:var(--container-max);margin:0 auto;padding:0 var(--gutter);}
.container-wide{max-width:var(--container-wide);margin:0 auto;padding:0 var(--gutter);}
.section{padding:var(--section-y) 0;position:relative;}
.section--page{background:#0a0a0a;}
.section--base{background:#1c1c1c;}
.section--ink{background:var(--ink-900);}
.section-head{margin-bottom:var(--space-7);}
.section-title{
  font-family:var(--font-display);text-transform:uppercase;line-height:.96;
  letter-spacing:var(--tracking-display);font-size:var(--display-lg);
  color:var(--text-primary);max-width:18ch;margin-top:var(--space-4);text-wrap:balance;
}
.divider{height:1px;background:var(--border-subtle);border:0;margin:0;}

/* ---- Header / nav -------------------------------------------------------- */
.nav{position:sticky;top:0;z-index:50;transition:background var(--dur-base) var(--ease-out),border-color var(--dur-base),backdrop-filter var(--dur-base);
  border-bottom:1px solid transparent;}
.nav.scrolled{background:rgba(7,7,7,.82);backdrop-filter:blur(12px);border-bottom-color:var(--border-subtle);}
.nav-inner{max-width:var(--container-wide);margin:0 auto;padding:11px var(--gutter);
  display:flex;align-items:center;justify-content:space-between;gap:24px;}
.nav-logo{height:21px;width:auto;transition:transform var(--dur-base) var(--ease-out);}
.nav-logo:hover{transform:translateX(4px);}
.nav-links{display:flex;gap:30px;align-items:center;}
.nav-links a{font-family:var(--font-display);text-transform:uppercase;letter-spacing:var(--tracking-display);font-size:clamp(.975rem,1.3vw,1.17rem);color:var(--grey-300);position:relative;padding:4px 0;
  transition:color var(--dur-fast);}
.nav-links a::after{content:"";position:absolute;left:0;right:0;bottom:0;height:1px;
  background:var(--lime-500);transform:scaleX(0);transform-origin:left;transition:transform var(--dur-base) var(--ease-out);}
.nav-links a:hover{color:var(--lime-500);}
.nav-links a:hover::after{transform:scaleX(1);}
.nav-right{display:flex;gap:12px;align-items:center;}
.lang-toggle{background:none;border:1px solid var(--border-subtle);color:var(--grey-300);
  font-family:var(--font-mono);font-size:var(--label-xs);text-transform:uppercase;letter-spacing:var(--tracking-label);
  min-height:46px;padding:0 11px;display:inline-flex;align-items:center;border-radius:var(--radius-sm);cursor:pointer;transition:all var(--dur-fast) var(--ease-out);}
.lang-toggle:hover{border-color:var(--lime-500);color:var(--lime-500);}
.nav-burger{display:none;background:none;border:0;cursor:pointer;padding:6px;color:var(--white);}
.nav-burger svg{width:26px;height:26px;}

/* mobile menu drawer */
.mobile-menu{display:none;}

/* ---- Buttons ------------------------------------------------------------- */
.btn{
  --b:var(--action-fill);
  display:inline-flex;align-items:center;justify-content:center;gap:10px;
  font-family:var(--font-ui);font-weight:500;font-size:var(--text-base);line-height:1;
  letter-spacing:-0.01em;border-radius:var(--radius-sm);cursor:pointer;border:1.5px solid var(--b);
  min-height:52px;padding:0 24px;position:relative;overflow:hidden;
  transition:background var(--dur-fast) var(--ease-out),color var(--dur-fast) var(--ease-out),
    box-shadow var(--dur-base) var(--ease-out),transform var(--dur-fast) var(--ease-out),border-color var(--dur-fast);
}
.btn .ico{display:inline-flex;transition:transform var(--dur-base) var(--ease-out);}
.btn--primary{background:var(--action-fill);color:var(--text-on-lime);}
.btn--primary:hover{background:var(--action-fill-hover);border-color:var(--action-fill-hover);box-shadow:var(--glow-lime-soft);}
.btn--primary:hover .ico{transform:translateX(4px);}
.btn--primary:active{transform:scale(.98);background:var(--action-fill-active);}
.btn--secondary{background:transparent;color:var(--text-primary);border-color:var(--border-strong);}
.btn--secondary:hover{border-color:var(--lime-500);color:var(--lime-500);box-shadow:var(--glow-lime-soft);}
.btn--secondary:hover .ico{transform:translateX(4px);}
.btn--secondary:active{transform:scale(.98);}
.btn--lg{min-height:60px;padding:0 32px;font-size:var(--text-lg);gap:12px;}
.btn--sm{min-height:46px;padding:0 16px;font-size:var(--text-sm);gap:8px;}
.btn--uppercase{text-transform:uppercase;letter-spacing:.04em;}
.btn--full{display:flex;width:100%;align-items:center;justify-content:center;}
/* sheen sweep on primary hover */
.btn--primary::before{content:"";position:absolute;top:0;left:-120%;width:60%;height:100%;
  background:linear-gradient(100deg,transparent,rgba(255,255,255,.45),transparent);
  transform:skewX(-18deg);transition:left var(--dur-slow) var(--ease-out);pointer-events:none;}
.btn--primary:hover::before{left:160%;}

/* ---- Eyebrow component (mono numbered label) ---------------------------- */
.eyebrow .prefix{color:var(--grey-500);}

/* ---- Tag / chip ---------------------------------------------------------- */
.tag{display:inline-flex;align-items:center;gap:6px;font-family:var(--font-mono);
  text-transform:uppercase;letter-spacing:var(--tracking-label);line-height:1;
  padding:6px 13px;border-radius:var(--radius-pill);white-space:nowrap;font-size:var(--label-sm);
  border:1px solid var(--border-subtle);background:var(--surface-raised);color:var(--text-secondary);}
.tag--lime{background:var(--lime-500);color:var(--text-on-lime);border-color:var(--lime-500);}
.tag--outline{background:transparent;color:var(--text-accent);border-color:var(--border-lime);}

/* ---- Card ---------------------------------------------------------------- */
.card{background:var(--surface-card);border:1px solid var(--border-subtle);border-radius:var(--radius-md);
  padding:var(--space-6);transition:transform var(--dur-base) var(--ease-out),
    border-color var(--dur-base) var(--ease-out),box-shadow var(--dur-base) var(--ease-out),background var(--dur-base);}
.card--base{background:var(--surface-base);}
.card--interactive{cursor:default;}
.card--interactive:hover{transform:translateY(-4px);border-color:var(--lime-500);box-shadow:var(--glow-lime-soft);background:var(--surface-raised);}
.card--glow{box-shadow:var(--glow-lime-soft);}

/* format cards */
.format-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:var(--space-4);}
.format-card{display:flex;flex-direction:column;gap:var(--space-5);min-height:148px;justify-content:center;}
.format-card .ico{color:var(--lime-500);transition:transform var(--dur-base) var(--ease-out);}
.format-card:hover .ico{transform:translateY(-3px) scale(1.08);}
.format-card .label{font-family:var(--font-text);font-weight:500;font-size:var(--text-lg);color:var(--text-primary);}

/* ---- Stat card ----------------------------------------------------------- */
.stat{display:flex;flex-direction:column;gap:10px;padding:var(--space-6);
  background:var(--surface-card);border:1px solid var(--border-subtle);border-radius:var(--radius-md);
  transition:transform var(--dur-base) var(--ease-out),border-color var(--dur-base),box-shadow var(--dur-base);}
.stat:hover{transform:translateY(-3px);border-color:var(--border-strong);}
.stat--lime{background:var(--lime-500);border-color:var(--lime-500);}
.stat--lime:hover{box-shadow:var(--glow-lime);}
.stat .value{font-family:var(--font-mono);font-size:clamp(2.25rem,4vw,3.25rem);line-height:.95;
  letter-spacing:-0.03em;color:var(--lime-500);font-variant-numeric:tabular-nums;white-space:nowrap;}
.stat--plain .value{color:var(--text-primary);}
.stat--lime .value{color:var(--text-on-lime);}
.stat .caption{font-family:var(--font-mono);font-size:var(--label-sm);text-transform:uppercase;
  letter-spacing:var(--tracking-label);color:var(--text-muted);max-width:22ch;}
.stat--lime .caption{color:rgba(10,10,0,.65);}

/* ---- Plan card ----------------------------------------------------------- */
.plans-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(270px,1fr));gap:var(--space-4);align-items:stretch;}
.plan{display:flex;flex-direction:column;gap:var(--space-5);padding:var(--space-6);
  background:var(--surface-base);border:1.5px solid var(--border-subtle);border-radius:var(--radius-md);
  transition:transform var(--dur-base) var(--ease-out),border-color var(--dur-base),box-shadow var(--dur-base);}
.plan:hover{transform:translateY(-4px);border-color:var(--border-strong);}
.plan--rec{background:var(--surface-card);border-color:var(--border-lime);box-shadow:var(--glow-lime-soft);}
.plan--rec:hover{box-shadow:var(--glow-lime);}
.plan-head{display:flex;align-items:center;justify-content:space-between;gap:12px;}
.plan-name{font-family:var(--font-display);text-transform:uppercase;font-size:var(--display-md);
  line-height:.95;letter-spacing:var(--tracking-display);color:var(--text-primary);}
.plan-purpose{font-size:var(--text-base);color:var(--text-secondary);line-height:1.55;}
.plan-features{display:flex;flex-direction:column;gap:10px;list-style:none;padding:0;margin:0;}
.plan-features li{display:flex;gap:10px;align-items:flex-start;font-size:var(--text-sm);color:var(--text-primary);line-height:1.4;}
.plan-features li::before{content:"—";color:var(--lime-500);font-family:var(--font-mono);}
.plan-foot{margin-top:auto;display:flex;flex-direction:column;gap:14px;}
.plan-note{font-family:var(--font-mono);font-size:var(--label-xs);color:var(--text-muted);letter-spacing:.04em;}

/* ---- Inputs / form ------------------------------------------------------- */
.field{display:flex;flex-direction:column;gap:8px;}
.field-label{font-family:var(--font-mono);font-size:var(--label-sm);text-transform:uppercase;
  letter-spacing:var(--tracking-label);color:var(--text-secondary);display:flex;gap:6px;}
.field-label .req{color:var(--lime-500);}
.field input,.field textarea,.field select{
  width:100%;background:var(--surface-base);color:var(--text-primary);font-family:var(--font-text);
  font-size:var(--text-base);padding:13px 15px;border:1.5px solid var(--border-subtle);border-radius:var(--radius-sm);
  outline:none;transition:border-color var(--dur-fast) var(--ease-out),box-shadow var(--dur-base) var(--ease-out);}
.field textarea{resize:vertical;min-height:96px;}
.field input::placeholder,.field textarea::placeholder{color:var(--grey-500);}
.field input:focus,.field textarea:focus,.field select:focus{border-color:var(--lime-500);box-shadow:var(--glow-lime-soft);}
.field select{appearance:none;cursor:pointer;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%238A8A8A' stroke-width='1.5' fill='none'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:right 15px center;padding-right:38px;}
.form-row{display:grid;grid-template-columns:1fr 1fr;gap:var(--space-4);}
.form-success{display:flex;flex-direction:column;align-items:center;gap:16px;padding:var(--space-7) 0;text-align:center;}

/* ---- Marquee ------------------------------------------------------------- */
.marquee{overflow:hidden;white-space:nowrap;background:var(--lime-500);padding:21px 0;}
.marquee__track{display:inline-block;animation:km-scroll var(--dur-marquee) linear infinite;will-change:transform;}
.marquee:hover .marquee__track{animation-play-state:paused;}
.marquee__item{
  font-family:var(--font-ui);font-weight:700;text-transform:uppercase;
  letter-spacing:.08em;font-size:clamp(0.8125rem,1.3vw,1.2rem);
  color:var(--text-on-lime);display:inline-flex;align-items:center;padding:0;
}
/* bolt separator — 52 px equal margin each side */
.marquee__item .sep{
  display:inline-flex;align-items:center;justify-content:center;
  width:20px;height:28px;flex-shrink:0;
  margin:0 52px;
  background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 14 26'%3E%3Cpath d='M9 1L2 14H7L4 25L13 11H8Z' fill='%230A0A00'/%3E%3C/svg%3E") center/contain no-repeat;
  font-size:0;line-height:0;
}
@keyframes km-scroll{from{transform:translateX(0);}to{transform:translateX(-50%);}}

/* ---- Hero ---------------------------------------------------------------- */
.hero{position:relative;overflow:hidden;background:var(--ink-900);isolation:isolate;}
.hero__media{position:absolute;inset:0;z-index:-2;}
.hero__media{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-2;opacity:.9;}
.hero__media image-slot,.hero__media .media-fallback{width:100%;height:100%;}
.hero__bg{position:absolute;inset:0;z-index:-2;
  background:radial-gradient(120% 90% at 72% 8%,rgba(203,255,8,.12),transparent 55%),
    repeating-linear-gradient(135deg,#0b0b0b 0 22px,#0e0e0e 22px 23px);}
.hero__scrim{position:absolute;inset:0;z-index:-1;
  background:linear-gradient(180deg,rgba(7,7,7,.45) 0%,rgba(7,7,7,.15) 38%,rgba(7,7,7,.92) 100%);}
.hero__inner{max-width:var(--container-wide);margin:0 auto;
  padding:clamp(130px,19vh,230px) var(--gutter) clamp(72px,11vh,128px);}
.hero h1{font-family:var(--font-display);text-transform:uppercase;line-height:.94;
  letter-spacing:var(--tracking-display);font-size:var(--display-hero);max-width:18ch;
  color:var(--text-primary);margin-top:var(--space-6);text-wrap:balance;}
.hero__sub{margin-top:var(--space-6);max-width:54ch;font-size:var(--text-lead);line-height:1.45;color:var(--grey-300);}
.hero__cta{margin-top:var(--space-7);display:flex;gap:18px;align-items:center;flex-wrap:wrap;}
.hero__micro{font-family:var(--font-mono);font-size:var(--label-sm);color:var(--grey-400);
  text-transform:uppercase;letter-spacing:var(--tracking-label);}
.hero__scroll{position:absolute;bottom:24px;left:50%;transform:translateX(-50%);z-index:1;
  font-family:var(--font-mono);font-size:var(--label-xs);text-transform:uppercase;letter-spacing:var(--tracking-label);
  color:var(--grey-500);display:flex;flex-direction:column;align-items:center;gap:8px;}
.hero__scroll .line{width:1px;height:34px;background:linear-gradient(var(--lime-500),transparent);animation:scrolldot 2s var(--ease-in-out) infinite;}
@keyframes scrolldot{0%{transform:scaleY(0);transform-origin:top;}45%{transform:scaleY(1);transform-origin:top;}55%{transform:scaleY(1);transform-origin:bottom;}100%{transform:scaleY(0);transform-origin:bottom;}}

/* ---- Two-column section layout ------------------------------------------ */
.two-col{display:grid;grid-template-columns:1.1fr 1fr;gap:var(--space-8);align-items:center;}
.two-col--narrow{grid-template-columns:1fr 1.25fr;}
.two-col--media-left{grid-template-columns:1fr 1fr;}

/* ---- Engine steps -------------------------------------------------------- */
.engine-steps{display:flex;flex-direction:column;gap:8px;margin-top:var(--space-5);}
.engine-step{
  font-family:var(--font-mono);font-size:var(--text-base);text-transform:uppercase;
  letter-spacing:var(--tracking-label);color:var(--lime-500);font-weight:500;
}

/* ---- Pulse meter --------------------------------------------------------- */
.pulse-card{display:flex;flex-direction:column;gap:var(--space-5);}
.pulse-row{display:flex;align-items:center;justify-content:space-between;gap:16px;padding-bottom:12px;border-bottom:1px solid var(--border-subtle);}
.pulse-row:last-child{border-bottom:0;padding-bottom:0;}
.pulse-row .name{font-family:var(--font-mono);font-size:var(--text-sm);color:var(--grey-300);text-transform:uppercase;letter-spacing:.08em;}
.pulse-bar{width:130px;max-width:42vw;height:6px;background:var(--ink-600);border-radius:3px;overflow:hidden;}
.pulse-bar i{display:block;height:100%;width:0;background:var(--lime-500);border-radius:3px;transition:width 1.1s var(--ease-out);}

/* ---- Logo wall ----------------------------------------------------------- */
.logo-wall{display:grid;grid-template-columns:repeat(6,1fr);gap:1px;
  background:#000;border:1px solid #000;border-radius:var(--radius-md);overflow:hidden;}
.logo-cell{background:#000;min-height:92px;display:flex;align-items:center;justify-content:center;padding:18px;
  transition:background var(--dur-base);}
.logo-cell:hover{background:#000;cursor:default;}
.logo-cell img{max-height:54px;width:auto;max-width:100%;object-fit:contain;display:block;}
.logo-cell--lg img{max-height:76px;}
.logo-cell--gemswell img{filter:contrast(100);}
.media img{width:100%;height:100%;object-fit:cover;display:block;border-radius:var(--radius-md);}
.img-ph{width:100%;height:100%;background:var(--ink-600);border-radius:var(--radius-sm);}

/* ---- Media slot framing -------------------------------------------------- */
.media{position:relative;border:1px solid var(--border-subtle);border-radius:var(--radius-md);overflow:hidden;background:var(--ink-800);}
.media image-slot{width:100%;height:100%;display:block;}
.media__label{position:absolute;bottom:12px;left:14px;font-family:var(--font-mono);font-size:var(--label-xs);
  text-transform:uppercase;letter-spacing:var(--tracking-label);color:var(--grey-400);pointer-events:none;z-index:2;
  background:rgba(7,7,7,.6);padding:4px 8px;border-radius:var(--radius-xs);}
.media__play{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:64px;height:64px;border-radius:50%;
  background:var(--lime-500);display:flex;align-items:center;justify-content:center;color:var(--text-on-lime);
  box-shadow:var(--glow-lime-soft);z-index:2;transition:transform var(--dur-base) var(--ease-out);text-decoration:none;}
span.media__play{pointer-events:none;}
a.media__play{pointer-events:auto;cursor:pointer;}
.media:hover .media__play{transform:translate(-50%,-50%) scale(1.08);}

/* ---- FAQ ----------------------------------------------------------------- */
.faq{display:flex;flex-direction:column;border-top:1px solid var(--border-subtle);}
.faq-item{border-bottom:1px solid var(--border-subtle);}
.faq-q{width:100%;background:none;border:0;cursor:pointer;text-align:left;color:var(--text-primary);
  font-family:var(--font-text);font-weight:500;font-size:clamp(1.05rem,2vw,1.35rem);
  padding:var(--space-5) 0;display:flex;align-items:center;justify-content:space-between;gap:20px;transition:color var(--dur-fast);}
.faq-q:hover{color:var(--lime-500);}
.faq-q .sign{flex:0 0 auto;color:var(--lime-500);transition:transform var(--dur-base) var(--ease-out);font-family:var(--font-mono);}
.faq-item.open .faq-q .sign{transform:rotate(45deg);}
.faq-a{max-height:0;overflow:hidden;transition:max-height var(--dur-slow) var(--ease-out);}
.faq-a p{padding:0 0 var(--space-5);max-width:62ch;color:var(--grey-300);font-size:var(--text-lg);line-height:1.6;}

/* ---- Footer -------------------------------------------------------------- */
.footer{background:var(--ink-900);border-top:1px solid var(--border-subtle);padding:var(--space-7) 0 var(--space-5);}
.footer__logo{height:40px;width:auto;margin-bottom:var(--space-6);}
.footer__grid{display:flex;justify-content:space-between;flex-wrap:wrap;gap:32px;align-items:flex-end;}
.footer__sign{font-family:var(--font-display);text-transform:uppercase;font-size:var(--display-md);
  line-height:.95;letter-spacing:var(--tracking-display);color:var(--text-primary);max-width:16ch;margin-bottom:10px;}
.footer__note{font-family:var(--font-mono);font-size:var(--label-sm);color:var(--grey-500);
  text-transform:uppercase;letter-spacing:var(--tracking-label);}
.footer__socials{display:flex;gap:16px;margin-top:18px;}
.footer__socials a{color:var(--grey-400);transition:color var(--dur-fast),transform var(--dur-base) var(--ease-out);}
.footer__socials a:hover{color:var(--lime-500);transform:translateY(-3px);}
.footer__legal{font-family:var(--font-mono);font-size:var(--label-xs);color:var(--grey-500);
  text-transform:uppercase;letter-spacing:var(--tracking-label);}
.footer__powered{font-family:var(--font-mono);font-size:var(--label-xs);text-transform:uppercase;
  letter-spacing:var(--tracking-label);color:var(--grey-500);margin-bottom:16px;}
.footer__glassy{display:block;height:26px;width:auto;margin-bottom:var(--space-5);
  transition:opacity var(--dur-fast);}
.footer__glassy:hover{opacity:.65;}

/* ---- Three-photo engine grid -------------------------------------------- */
.media-trio{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--space-3);}

#motor{padding-bottom:0;}
#motor .lead{margin-bottom:var(--space-4) !important;}
#formatos{padding-top:var(--space-4);}
#contacto,#contact{padding-bottom:var(--space-6);}
/* ---- Format list (section 03) ------------------------------------------- */
.format-list{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:1fr 1fr;}
.format-list-item{
  display:flex;align-items:center;gap:var(--space-3);
  padding:var(--space-4) 0;border-bottom:1px solid var(--border-subtle);
  transition:color var(--dur-fast);
}
.format-list-item:nth-child(odd){padding-right:var(--space-5);border-right:1px solid var(--border-subtle);}
.format-list-item:nth-child(even){padding-left:var(--space-5);}
.format-list-item:nth-last-child(-n+2){border-bottom:0;}
.format-list-item:hover .ico{color:var(--lime-400);transform:translateY(-2px);}
.format-list-item .label{font-family:var(--font-text);font-weight:500;font-size:var(--text-lg);color:var(--text-primary);}
.format-list-item .ico{color:var(--lime-500);flex:0 0 auto;transition:color var(--dur-base),transform var(--dur-base) var(--ease-out);}
@media(max-width:600px){
  .format-list{grid-template-columns:1fr;}
  .format-list-item:nth-child(odd){padding-right:0;border-right:0;}
  .format-list-item:nth-child(even){padding-left:0;}
  .format-list-item:nth-last-child(-n+2){border-bottom:1px solid var(--border-subtle);}
  .format-list-item:last-child{border-bottom:0;}
}

/* ---- Media carousel (formats section) ------------------------------------ */
.media-carousel{overflow:hidden;position:relative;margin-top:var(--space-8);}
.media-carousel::before,.media-carousel::after{
  content:"";position:absolute;top:0;bottom:0;width:80px;z-index:2;pointer-events:none;
}
.media-carousel::before{left:0;background:linear-gradient(to right,var(--surface-page),transparent);}
.media-carousel::after{right:0;background:linear-gradient(to left,var(--surface-page),transparent);}
.media-carousel__track{
  display:flex;gap:12px;
  animation:mc-scroll 5.625s linear infinite;
  will-change:transform;
}
.media-carousel:hover .media-carousel__track{animation-play-state:paused;cursor:default;}
.media-carousel__item{flex:0 0 auto;width:clamp(148px,16vw,216px);}
.carousel-card{
  width:100%;aspect-ratio:9/16;
  background-color:var(--surface-card);
  background-image:repeating-linear-gradient(135deg,#161616 0 18px,rgba(255,255,255,.02) 18px 19px);
  background-size:cover;background-position:center;
  border:1px solid var(--border-subtle);border-radius:var(--radius-md);
  display:flex;align-items:flex-end;padding:var(--space-3);overflow:hidden;
  position:relative;
  transition:transform var(--dur-base) var(--ease-out),border-color var(--dur-base);
}
.carousel-card video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;border-radius:var(--radius-md);}
/* Section background media */
.section-bg-img,.section-bg-video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;pointer-events:none;z-index:0;}
.section-bg-img{opacity:.35;}
#problema .section-bg-img,#problem .section-bg-img{transform:scaleX(-1);}
.section-bg-video{opacity:.35;
  mask-image:linear-gradient(to bottom,black 55%,transparent 82%);
  -webkit-mask-image:linear-gradient(to bottom,black 55%,transparent 82%);}
.section--has-bg{position:relative;overflow:hidden;}
.section--has-bg>.container{position:relative;z-index:1;}
.carousel-card:hover{transform:scale(1.04);border-color:var(--border-strong);}
.carousel-num{
  font-family:var(--font-mono);font-size:var(--label-xs);text-transform:uppercase;
  letter-spacing:var(--tracking-label);color:var(--grey-400);
}
@keyframes mc-scroll{from{transform:translateX(0);}to{transform:translateX(-50%);}}

/* ---- Avatar carousel (dobles digitales) ----------------------------------- */
.media-carousel--avatars .media-carousel__track{animation-duration:14s;}
.media-carousel--avatars .carousel-card{cursor:pointer;}
.section--ink .media-carousel::before{background:linear-gradient(to right,var(--ink-900),transparent);}
.section--ink .media-carousel::after{background:linear-gradient(to left,var(--ink-900),transparent);}

/* ---- Scroll reveal ------------------------------------------------------- */
.reveal{opacity:0;transform:translateY(26px);transition:opacity var(--dur-slow) var(--ease-out),transform var(--dur-slow) var(--ease-out);}
.reveal.in{opacity:1;transform:none;}
/* Progressive enhancement: with JS off (or before the engine runs), show everything. */
html:not(.js) .reveal{opacity:1;transform:none;}
.reveal[data-delay="1"]{transition-delay:.08s;}
.reveal[data-delay="2"]{transition-delay:.16s;}
.reveal[data-delay="3"]{transition-delay:.24s;}
.reveal[data-delay="4"]{transition-delay:.32s;}
.reveal[data-delay="5"]{transition-delay:.40s;}

/* ---- Sticky mobile CTA --------------------------------------------------- */
.sticky-cta{display:none;}

/* ---- Responsive ---------------------------------------------------------- */
@media (max-width:920px){
  .two-col,.two-col--narrow,.two-col--media-left{grid-template-columns:1fr;gap:var(--space-6);}
  .two-col--media-left .media{order:-1;}
}
@media (max-width:780px){
  .nav-links{display:none;}
  .nav-burger{display:inline-flex;}
  .nav-right .lang-toggle{display:inline-flex;}
  .nav-right .btn{display:none;}
  .mobile-menu{display:block;position:fixed;inset:0;z-index:60;background:var(--ink-900);
    transform:translateY(-100%);transition:transform var(--dur-slow) var(--ease-out);
    padding:88px var(--gutter) var(--gutter);overflow-y:auto;}
  .mobile-menu.open{transform:none;}
  .mobile-menu a{display:block;font-family:var(--font-display);text-transform:uppercase;
    font-size:clamp(2rem,9vw,3rem);line-height:1.05;letter-spacing:var(--tracking-display);
    color:var(--text-primary);padding:14px 0;border-bottom:1px solid var(--border-subtle);}
  .mobile-menu a:hover{color:var(--lime-500);}
  .mobile-close{position:absolute;top:22px;right:var(--gutter);background:none;border:0;color:var(--white);cursor:pointer;}
  .form-row{grid-template-columns:1fr;}
  .sticky-cta{display:flex;position:fixed;left:0;right:0;bottom:0;z-index:40;padding:12px var(--gutter);
    background:rgba(7,7,7,.92);backdrop-filter:blur(12px);border-top:1px solid var(--border-subtle);}
  .sticky-cta .btn{width:100%;}
  body{padding-bottom:72px;}
}
@media (max-width:520px){
  .hero h1{font-size:clamp(2.6rem,12vw,3.6rem);}
  .stat-grid-2{grid-template-columns:1fr 1fr !important;}
}

/* ---- Reduced motion ------------------------------------------------------ */
@media (prefers-reduced-motion:reduce){
  *{animation-duration:.001ms !important;animation-iteration-count:1 !important;transition-duration:.001ms !important;scroll-behavior:auto !important;}
  .reveal{opacity:1;transform:none;}
}