/* ============================================================
   AMÉRICA VIRTUAL — Sistema de diseño 2026
   Editorial premium · navy profundo + coral · luz y oscuro alternados
   ============================================================ */

:root{
  /* ---- navy / ink ---- */
  --ink:#15162B;          /* navy marca (fondo oscuro) */
  --ink-deep:#0F1022;     /* navy más profundo */
  --ink-soft:#1E2040;     /* superficie elevada en oscuro */
  --ink-line:rgba(255,255,255,.10);
  --ink-line-2:rgba(255,255,255,.18);

  /* ---- coral marca ---- */
  --coral:#FF5A3C;
  --coral-deep:#E8431D;
  --coral-bright:#FF7A5E;
  --coral-soft:#FFF1ED;   /* LCORAL: wash claro */
  --coral-line:rgba(255,90,60,.30);

  /* ---- luz ---- */
  --paper:#FFFFFF;
  --paper-2:#F7F8FA;
  --paper-3:#EEF0F5;
  --hair:#E4E7EE;         /* borde en claro */
  --hair-2:#D7DBE4;

  /* ---- texto sobre claro ---- */
  --t1:#16172C;           /* títulos */
  --t2:#4D5468;           /* cuerpo */
  --t3:#878DA0;           /* muted */

  /* ---- texto sobre oscuro ---- */
  --d1:#FFFFFF;
  --d2:#B7BCCE;
  --d3:#7E849C;

  /* ---- tipografía ---- */
  --display:'Bricolage Grotesque',Georgia,serif;
  --sans:'Hanken Grotesk',system-ui,sans-serif;
  --mono:'IBM Plex Mono',ui-monospace,monospace;

  /* ---- layout ---- */
  --maxw:1240px;
  --wide:1380px;
  --pad:clamp(20px,5vw,68px);
  --r:18px;
  --r-lg:26px;
  --nav-h:74px;

  --ease:cubic-bezier(.22,.61,.27,1);
  --shadow-sm:0 2px 10px -4px rgba(20,22,45,.14);
  --shadow:0 22px 50px -26px rgba(20,22,45,.30);
  --shadow-lg:0 40px 90px -40px rgba(20,22,45,.45);
  --shadow-coral:0 22px 50px -22px rgba(255,90,60,.5);
}

*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{
  font-family:var(--sans);
  background:var(--paper);
  color:var(--t2);
  font-size:17px;
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
  overflow-x:hidden;
}
::selection{background:var(--coral);color:#fff}
a{color:inherit;text-decoration:none}
img{max-width:100%;display:block}
button{font-family:inherit}
*::-webkit-scrollbar{width:12px;height:12px}
*::-webkit-scrollbar-thumb{background:rgba(120,130,160,.35);border-radius:20px;border:3px solid transparent;background-clip:padding-box}

/* ---------- tipografía ---------- */
h1,h2,h3,h4,h5{font-family:var(--display);color:var(--t1);font-weight:600;line-height:1.04;letter-spacing:-.02em}
.display{font-family:var(--display);font-weight:600;font-size:clamp(44px,7vw,92px);line-height:.99;letter-spacing:-.035em}
.h1{font-size:clamp(38px,5.4vw,68px);letter-spacing:-.03em;line-height:1.02}
.h2{font-size:clamp(30px,4.2vw,52px);letter-spacing:-.025em;line-height:1.05}
.h3{font-size:clamp(23px,2.6vw,32px);letter-spacing:-.02em}
.h4{font-size:clamp(19px,2vw,23px)}
.lede{font-size:clamp(18px,1.55vw,21px);line-height:1.55;color:var(--t2);font-weight:400}
.measure{max-width:60ch}
.measure-sm{max-width:46ch}

.kicker{
  font-family:var(--mono);font-size:12px;font-weight:500;letter-spacing:.2em;text-transform:uppercase;
  color:var(--coral-deep);display:inline-flex;align-items:center;gap:11px;
}
.kicker::before{content:"";width:24px;height:2px;background:var(--coral);border-radius:2px}
.coral{color:var(--coral-deep)}
.serif-it{font-style:italic}

/* ---------- layout ---------- */
.wrap{max-width:var(--maxw);margin-inline:auto;padding-inline:var(--pad)}
.wrap-wide{max-width:var(--wide);margin-inline:auto;padding-inline:var(--pad)}
section{position:relative}
.sec{padding-block:clamp(64px,8.5vw,120px)}
.sec-sm{padding-block:clamp(44px,5vw,72px)}
.dark{background:var(--ink);color:var(--d2)}
.dark h1,.dark h2,.dark h3,.dark h4,.dark h5{color:var(--d1)}
.dark .lede{color:var(--d2)}
.soft{background:var(--paper-2)}
.coral-wash{background:var(--coral-soft)}

.eyebrow{display:flex;align-items:flex-end;justify-content:space-between;gap:30px;flex-wrap:wrap;margin-bottom:clamp(34px,4vw,56px)}
.eyebrow .h2{max-width:18ch}
.hr{height:1px;background:var(--hair);border:0}
.dark .hr{background:var(--ink-line)}

/* ---------- botones ---------- */
.btn{
  --bg:var(--coral);--fg:#fff;
  font-family:var(--sans);font-size:15.5px;font-weight:600;cursor:pointer;
  display:inline-flex;align-items:center;gap:10px;white-space:nowrap;
  padding:14px 24px;border-radius:999px;border:1.5px solid transparent;
  transition:transform .2s var(--ease),box-shadow .2s var(--ease),background .2s,color .2s,border-color .2s;
  position:relative;
}
.btn svg{width:17px;height:17px;transition:transform .2s var(--ease)}
.btn-primary{background:var(--coral);color:#fff;box-shadow:var(--shadow-coral)}
.btn-primary:hover{background:var(--coral-deep);transform:translateY(-2px);box-shadow:0 26px 56px -20px rgba(255,90,60,.7)}
.btn-primary:hover svg{transform:translateX(4px)}
.btn-dark{background:var(--ink);color:#fff}
.btn-dark:hover{transform:translateY(-2px);box-shadow:var(--shadow)}
.btn-ghost{background:transparent;border-color:var(--hair-2);color:var(--t1)}
.btn-ghost:hover{border-color:var(--ink);background:var(--ink);color:#fff;transform:translateY(-2px)}
.dark .btn-ghost{border-color:var(--ink-line-2);color:#fff}
.dark .btn-ghost:hover{background:#fff;color:var(--ink);border-color:#fff}
.btn-lg{padding:17px 30px;font-size:16.5px}
.btn-sm{padding:11px 18px;font-size:14.5px}
.link{
  font-weight:600;color:var(--coral-deep);display:inline-flex;align-items:center;gap:8px;font-size:15.5px;
  transition:gap .2s var(--ease);
}
.link svg{width:16px;height:16px;transition:transform .2s var(--ease)}
.link:hover{gap:12px}
.link:hover svg{transform:translateX(3px)}
.dark .link{color:var(--coral-bright)}

/* ---------- chips / tags ---------- */
.tag{
  font-family:var(--mono);font-size:11.5px;font-weight:500;letter-spacing:.08em;text-transform:uppercase;
  color:var(--t3);border:1px solid var(--hair);border-radius:999px;padding:6px 13px;display:inline-flex;align-items:center;gap:7px;
  background:var(--paper);
}
.dark .tag{color:var(--d3);border-color:var(--ink-line);background:transparent}
.tag.on{color:var(--coral-deep);border-color:var(--coral-line);background:var(--coral-soft)}

/* ---------- reveal ---------- */
[data-rv]{transition:opacity .8s var(--ease),transform .8s var(--ease)}
[data-rv].armed{opacity:0;transform:translateY(30px)}
[data-rv].armed.in{opacity:1;transform:none}
[data-rv-d="1"]{transition-delay:.09s}
[data-rv-d="2"]{transition-delay:.18s}
[data-rv-d="3"]{transition-delay:.27s}
[data-rv-d="4"]{transition-delay:.36s}
[data-rv-d="5"]{transition-delay:.45s}
@media (prefers-reduced-motion:reduce){
  [data-rv],[data-rv].armed{opacity:1!important;transform:none!important;transition:none}
  html{scroll-behavior:auto}
}

/* ---------- footer base ---------- */
.foot{background:var(--ink-deep);color:var(--d2);padding-top:clamp(56px,7vw,84px)}
.foot a{color:var(--d2);transition:color .16s}
.foot a:hover{color:#fff}
.foot .topline{height:3px;background:var(--coral);width:100%}