
  :root{
    --ink:#0B1220;
    --ink-soft:#111E33;
    --paper:#F6F9FF;
    --paper-raised:#ffffff;
    --graphite:#465775;
    --graphite-dim:#647594;
    --blue:#3B82F6;
    --accent-dark:#285DC1;
    --trace:#06B6D4;
    --line:#D7E3F5;
    --line-dark:#233552;
    --max:1120px;
  }

  *{box-sizing:border-box;}
  html{scroll-behavior:smooth;}
  body{
    margin:0;
    background:var(--paper);
    color:var(--ink);
    font-family:'Montserrat', system-ui, sans-serif;
    font-size:17px;
    line-height:1.6;
    -webkit-font-smoothing:antialiased;
  }
  h1,h2,h3{
    font-family:'Montserrat', system-ui, sans-serif;
    font-weight:600;
    line-height:1.08;
    margin:0;
    letter-spacing:-0.01em;
  }
  p{margin:0;}
  a{color:inherit;}
  a:focus-visible, button:focus-visible{
    outline:2px solid var(--blue);
    outline-offset:3px;
  }
  ::selection{background:var(--blue); color:var(--paper);}

  .wrap{
    max-width:var(--max);
    margin:0 auto;
    padding:0 32px;
  }
  @media (max-width:640px){ .wrap{ padding:0 22px; } }

  /* ---------- Header ---------- */
  header{
    position:sticky; top:0; z-index:20;
    background:rgba(246,249,255,0.94);
    backdrop-filter:blur(8px);
    border-bottom:1px solid var(--line);
  }
  .nav{
    display:flex; align-items:center; justify-content:space-between;
    padding:20px 32px;
    max-width:var(--max); margin:0 auto;
  }
  .brand{
    display:flex; align-items:center; gap:10px;
    font-family:'Montserrat', sans-serif;
    font-weight:600; font-size:1.05rem;
    text-decoration:none; color:var(--ink);
  }
  .brand svg{ width:22px; height:22px; }
  .nav-links{ display:flex; gap:32px; align-items:center; }
  .nav-links a{
    text-decoration:none; color:var(--graphite); font-size:0.95rem;
    transition:color .15s ease;
  }
  .nav-links a:hover{ color:var(--ink); }
  .nav-cta{
    padding:10px 18px;
    background:var(--ink);
    color:var(--paper) !important;
    border-radius:2px;
    font-size:0.9rem;
    font-weight:500;
  }
  .nav-cta:hover{ background:var(--ink-soft); }
  @media (max-width:720px){
    .nav-links a:not(.nav-cta){ display:none; }
  }

  /* ---------- Hero ---------- */
  .hero{
    background:var(--ink);
    color:var(--paper);
    padding:96px 0 88px;
    position:relative;
    overflow:hidden;
  }
  .hero-grid{
    display:grid;
    grid-template-columns:1.15fr 0.85fr;
    gap:48px;
    align-items:center;
  }
  @media (max-width:880px){
    .hero-grid{ grid-template-columns:1fr; }
    .hero-diagram{ order:-1; max-width:280px; margin:0 auto 8px; }
  }
  .hero h1{
    font-size:clamp(2.1rem, 4.4vw, 3.4rem);
    color:#fff;
    max-width:15ch;
  }
  .hero .kicker{
    font-size:0.95rem;
    color:var(--blue);
    margin-bottom:18px;
    display:block;
  }
  .hero p.lead{
    margin-top:22px;
    font-size:1.15rem;
    color:#c7cad3;
    max-width:46ch;
  }
  .hero-actions{
    margin-top:36px;
    display:flex; gap:18px; align-items:center; flex-wrap:wrap;
  }
  .btn-primary{
    display:inline-block;
    padding:14px 26px;
    background:var(--blue);
    color:#0B1220;
    text-decoration:none;
    font-weight:600;
    border-radius:2px;
    transition:background .15s ease, transform .15s ease;
  }
  .btn-primary:hover{ background:#72C9FF; transform:translateY(-1px); }
  .btn-ghost{
    color:#c7cad3;
    text-decoration:none;
    border-bottom:1px solid #444a58;
    padding-bottom:2px;
    font-size:0.95rem;
  }
  .btn-ghost:hover{ color:#fff; border-color:#c7cad3; }

  .hero-diagram{ position:relative; }
  .hero-diagram svg{ width:100%; height:auto; display:block; }

  /* ---------- Section shared ---------- */
  section{ padding:88px 0; }
  .section-head{
    display:grid;
    grid-template-columns:1fr 1.6fr;
    gap:40px;
    margin-bottom:56px;
  }
  @media (max-width:720px){
    .section-head{ grid-template-columns:1fr; gap:14px; }
  }
  .section-label{
    font-size:0.95rem;
    color:var(--accent-dark);
  }
  .section-head h2{
    font-size:clamp(1.6rem, 3vw, 2.1rem);
    max-width:20ch;
  }
  .section-head .desc{
    color:var(--graphite);
    font-size:1.05rem;
    max-width:52ch;
    align-self:end;
  }

  /* ---------- Services ---------- */
  .services{ background:var(--paper); }
  .service-list{
    border-top:1px solid var(--line);
  }
  .service-row{
    display:grid;
    grid-template-columns:1fr 1.6fr;
    gap:40px;
    padding:34px 0;
    border-bottom:1px solid var(--line);
  }
  @media (max-width:720px){
    .service-row{ grid-template-columns:1fr; gap:10px; }
  }
  .service-row h3{
    font-size:1.25rem;
    display:flex; align-items:baseline; gap:12px;
  }
  .service-row h3 .mark{
    width:8px; height:8px;
    border-radius:50%;
    background:var(--blue);
    display:inline-block;
    flex:none;
    transform:translateY(-2px);
  }
  .service-row p{
    color:var(--graphite);
    max-width:56ch;
  }

  /* ---------- About ---------- */
  .about{
    background:var(--ink);
    color:var(--paper);
  }
  .about-grid{
    display:grid;
    grid-template-columns:0.9fr 1.4fr;
    gap:56px;
    align-items:start;
  }
  @media (max-width:780px){
    .about-grid{ grid-template-columns:1fr; }
  }
  .about h2{
    color:#fff;
    font-size:clamp(1.6rem,3vw,2.1rem);
    max-width:14ch;
  }
  .about-body p{
    color:#c7cad3;
    font-size:1.08rem;
    max-width:58ch;
  }
  .about-body p + p{ margin-top:18px; }
  .about-body .highlight{ color:#fff; }
  .about-facts{
    margin-top:32px;
    display:flex; gap:36px; flex-wrap:wrap;
  }
  .about-facts div{ min-width:120px; }
  .about-facts strong{
    display:block;
    font-family:'Montserrat', sans-serif;
    font-size:1.4rem;
    color:var(--blue);
  }
  .about-facts span{
    font-size:0.9rem;
    color:var(--graphite-dim);
  }

  /* ---------- Contact ---------- */
  .contact{
    background:var(--paper);
  }
  .contact-inner{
    border:1px solid var(--line);
    border-radius:2px;
    padding:56px;
    display:grid;
    grid-template-columns:1.3fr 1fr;
    gap:40px;
    align-items:center;
    background:var(--paper-raised);
  }
  @media (max-width:780px){
    .contact-inner{ grid-template-columns:1fr; padding:36px 26px; }
  }
  .contact h2{ font-size:clamp(1.5rem,3vw,2rem); max-width:16ch; }
  .contact p{ color:var(--graphite); margin-top:16px; max-width:44ch; }
  .contact-actions{ text-align:left; }
  .contact-actions .btn-primary{ background:var(--ink); color:var(--paper); }
  .contact-actions .btn-primary:hover{ background:var(--ink-soft); }
  .contact-note{
    margin-top:14px;
    font-size:0.88rem;
    color:var(--graphite-dim);
  }

  /* ---------- Footer ---------- */
  footer{
    border-top:1px solid var(--line);
    padding:32px 0;
  }
  .footer-row{
    display:flex; justify-content:space-between; align-items:center;
    flex-wrap:wrap; gap:12px;
    font-size:0.88rem;
    color:var(--graphite-dim);
  }
  .footer-links{display:flex;align-items:center;flex-wrap:wrap;gap:20px;}

  @media (prefers-reduced-motion: reduce){
    html{ scroll-behavior:auto; }
    .btn-primary{ transition:none; }
  }

/* Refinamiento visual y adaptación a móvil. */
:root{--max:1240px}
html{scroll-padding-top:100px}
body{overflow-wrap:break-word}
main:focus{outline:none}
.skip-link{position:fixed;top:8px;left:12px;z-index:100;background:var(--paper);padding:12px 18px;transform:translateY(-180%)}
.skip-link:focus{transform:translateY(0)}
.nav{gap:20px;padding-top:22px;padding-bottom:22px}
.brand{gap:12px;letter-spacing:-.04em;font-size:1.125rem}
.brand img{flex:none}
.menu-toggle{display:none}
.hero{padding:100px 0 110px}
.hero-grid{grid-template-columns:1.3fr .85fr;gap:64px}
.hero h1{font-size:clamp(2.5rem,4.8vw,4.25rem);line-height:1.06;letter-spacing:-.045em;max-width:17ch}
.hero h1 em{font-style:normal;color:#7ACDFF}
.hero .kicker,.section-label,.diagram-label{font-family:'Montserrat',monospace;font-size:.875rem;letter-spacing:.07em}
.hero .kicker{color:#7ACDFF;margin-bottom:28px}
.hero p.lead{font-size:1.125rem;line-height:1.75;max-width:48ch;margin-top:28px}
.hero-diagram{border:1px solid #353a45;background:linear-gradient(135deg,#202531,#0B1220);padding:28px 20px 14px;border-radius:2px}
.hero-diagram img{width:100%;height:auto;display:block}
.diagram-label{display:block;color:#b6bbc7;font-size:.75rem;text-align:center}
.btn-primary{padding:16px 24px;line-height:1.4}
section{padding:96px 0}
.section-head{grid-template-columns:1fr 1.6fr;margin-bottom:48px}
.section-head h2{max-width:26ch;font-size:clamp(1.8rem,3vw,2.6rem);letter-spacing:-.035em}
.service-row{padding:34px 0;transition:background .2s}
.service-row h3{line-height:1.35;font-size:1.2rem}
.service-row p{line-height:1.75}
.about h2{font-size:clamp(2rem,3vw,2.6rem);line-height:1.16;letter-spacing:-.035em}
.about-body p{line-height:1.8}
.about-facts{border-top:1px solid #353a45;padding-top:28px;gap:30px}
.about-facts strong{color:#7ACDFF;font-size:1.75rem}
.about-facts span{color:#b1b6c3}
.contact-inner{padding:60px;border-top:3px solid var(--blue);gap:48px}
.contact h2{font-size:clamp(2rem,3vw,2.6rem);letter-spacing:-.035em;max-width:20ch}
.contact-note,.footer-row{color:var(--graphite);font-size:.875rem}
.email-link{text-underline-offset:4px}
.social-link{display:inline-flex;align-items:center;gap:6px;text-underline-offset:4px}
.social-link svg{width:18px;height:18px;fill:currentColor;flex:none}
@media(max-width:880px){
.hero-grid{grid-template-columns:1fr;gap:40px}
.hero-diagram{order:0;width:100%;max-width:420px;margin:0}
.hero h1{max-width:19ch}
.hero{padding:64px 0}
}
@media(max-width:720px){
.nav{padding:18px 22px;flex-wrap:wrap;gap:14px}
.brand{font-size:1rem}
.menu-toggle{display:flex;align-items:center;gap:12px;font:inherit;font-size:.875rem;border:1px solid var(--line);border-radius:2px;padding:8px 12px;background:transparent;color:var(--ink);cursor:pointer}
.nav-links{width:100%;gap:0;flex-direction:column;align-items:stretch}
.nav-links a:not(.nav-cta){display:block}
.nav-links a{padding:12px}
.js .nav-links{display:none}
.js .nav-links.is-open{display:flex}
.section-head,.service-row{grid-template-columns:1fr;gap:16px}
section{padding:64px 0}
.hero h1{font-size:clamp(2.3rem,8.5vw,3.7rem)}
.hero .kicker{font-size:.75rem}
.hero-actions{gap:24px}
.contact-inner{padding:32px 24px;gap:28px}
.contact-actions .btn-primary{width:100%;text-align:center}
.about-grid{gap:32px}
}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{transition:none!important;animation:none!important}}

/* Identidad Nexus: navy, blue, cyan, violet y Montserrat. */
:root{--navy:#0B1220;--blue:#3B82F6;--cyan:#06B6D4;--violet:#8B5CF6;--light-blue:#E8F1FF}
::selection{background:var(--blue);color:white}
a:focus-visible,button:focus-visible{outline:3px solid var(--violet);outline-offset:4px}
.brand{letter-spacing:0;gap:12px}
.wordmark{font-size:1.6rem;line-height:1.1;letter-spacing:.24em;font-weight:500}
.wordmark span{display:block;font-size:.625rem;letter-spacing:.27em;margin-top:5px}
.hero{background:radial-gradient(ellipse at 95% 25%,#14264a 0,transparent 52%),var(--navy)}
.hero-grid{grid-template-columns:1.2fr 1fr;gap:48px}
.hero h1{letter-spacing:-.045em;font-weight:600;font-size:clamp(2.5rem,4.5vw,4rem);max-width:18ch}
.hero h1 em{color:#86CFFF}
.hero .kicker{color:#92CCFF;font-size:.8125rem;font-weight:500}
.hero p.lead{color:#C5D4EB;line-height:1.8;font-size:1.0625rem}
.hero-diagram{border:0;background:radial-gradient(ellipse at center,#142b46 0,transparent 68%);padding:32px 0;text-align:center;max-width:540px;width:100%}
.hero-diagram img{width:100%;height:auto}
.hero-diagram .brand-motto{font-size:clamp(1.4rem,2.5vw,2rem);color:var(--light-blue);margin:28px 0 22px;line-height:1.3;letter-spacing:-.04em}
.brand-motto span{color:#85CCFF;font-weight:600}
.diagram-label{color:#B8CBE6;letter-spacing:.17em;font-size:.75rem}
.btn-primary,.contact-actions .btn-primary{background:linear-gradient(110deg,#06B6D4,#60A5FA);color:var(--navy);border-radius:8px;font-weight:700;box-shadow:0 6px 25px #06b6d41a}
.btn-primary:hover,.contact-actions .btn-primary:hover{background:linear-gradient(110deg,#33D3E6,#93C5FD);color:var(--navy)}
.nav-cta{border-radius:8px;background:var(--navy)}
.section-label{font-weight:600;color:#285DC1}
.service-row h3 .mark{width:10px;height:10px;border-radius:3px;background:linear-gradient(135deg,var(--cyan),var(--violet))}
.service-row h3{font-size:1.125rem;line-height:1.5;letter-spacing:-.025em}
.service-row p{font-size:1rem}
.about{background:radial-gradient(ellipse at 0 100%,#192647,transparent 65%),var(--navy)}
.about-body p{color:#C5D4EB;font-size:1rem}
.about-facts{border-color:#293D5C}
.about-facts strong{color:#83CDFF}
.about-facts span{color:#BDCCE2}
.contact{background:var(--light-blue)}
.contact-inner{border:1px solid #C9DBF6;border-top:3px solid var(--blue);border-radius:16px;box-shadow:0 20px 60px #0b122008}
.contact h2{font-size:clamp(1.8rem,3vw,2.5rem)}
footer{background:#F6F9FF}
@media(max-width:880px){.hero-grid{grid-template-columns:1fr}.hero-diagram{max-width:440px;margin:0 auto}.hero h1{max-width:20ch}}
@media(max-width:720px){.wordmark{font-size:1.25rem}.wordmark span{font-size:.5625rem}.brand img{width:40px;height:40px}.hero h1{font-size:clamp(2.2rem,8.5vw,3.5rem)}.hero-diagram{padding:8px 0;max-width:350px}.hero-diagram .brand-motto{margin-top:16px}.hero .kicker{font-size:.75rem}.nav{gap:12px}.hero-actions .btn-primary{font-size:.9375rem}.about-facts{gap:24px}}

/* Especialidades: encabezado destacado y bloques de lectura rápida. */
.services-heading{display:block;margin-bottom:48px;max-width:850px}
.services-heading h2{font-size:clamp(2.75rem,5.5vw,4.5rem);line-height:1.08;font-weight:600;letter-spacing:-.045em;color:var(--navy)}
.services-heading>p{margin-top:20px;color:var(--graphite);font-size:clamp(1.0625rem,2vw,1.25rem);line-height:1.6}
.services-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px}
.service-card{display:flex;flex-direction:column;align-items:flex-start;padding:36px;border:1px solid var(--line);border-radius:16px;background:var(--paper-raised);min-width:0}
.service-number{font-size:.875rem;font-weight:600;letter-spacing:.08em;color:#285DC1;margin-bottom:24px}
.service-card h3{font-size:clamp(1.5rem,2.3vw,1.875rem);line-height:1.2;letter-spacing:-.035em;max-width:22ch}
.service-benefit{margin-top:20px;font-weight:600;color:var(--navy);font-size:1rem}
.service-description{margin-top:10px;margin-bottom:28px;color:var(--graphite);line-height:1.75;font-size:1rem}
.service-examples{margin-top:auto;padding-top:20px;border-top:1px solid var(--line);color:var(--graphite);font-size:.875rem;line-height:1.7;width:100%}
@media(max-width:720px){.services-grid{grid-template-columns:1fr;gap:20px}.service-card{padding:28px 24px}.services-heading{margin-bottom:32px}.service-number{margin-bottom:18px}.service-card h3{max-width:none}}

/* Formas de trabajar: opciones de colaboración claras y complementarias. */
.ways-of-working{background:var(--light-blue)}
.ways-heading{display:block;margin-bottom:48px;max-width:960px}
.ways-heading h2{font-size:clamp(2rem,3.8vw,3.25rem);letter-spacing:-.045em;line-height:1.1}
.ways-heading>p{margin-top:20px;color:var(--graphite);font-size:1.0625rem;line-height:1.75;max-width:62ch}
.ways-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}
.way-card{background:var(--paper-raised);border:1px solid #C9DBF6;border-top:3px solid var(--blue);border-radius:12px;padding:28px 24px}
.way-card:nth-child(2){border-top-color:var(--cyan)}
.way-card:nth-child(3){border-top-color:var(--violet)}
.way-card:nth-child(4){border-top-color:#285DC1}
.way-card h3{font-size:1.2rem;letter-spacing:-.025em;line-height:1.3}
.way-card p{margin-top:14px;color:var(--graphite);font-size:.9375rem;line-height:1.7}
.ways-summary{max-width:74ch;margin:32px 0 0;color:var(--graphite);font-size:1rem;line-height:1.75}
.engagement-heading{display:block;max-width:960px;margin:64px 0 28px}
.engagement-heading h3{font-size:clamp(1.6rem,2.6vw,2.25rem);letter-spacing:-.04em;line-height:1.15}
.engagement-heading p{margin-top:20px;color:var(--graphite);font-size:1rem;line-height:1.7;max-width:62ch}
.engagement-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.engagement-card{display:flex;flex-direction:column;background:var(--paper-raised);border:1px solid #C9DBF6;border-top:3px solid var(--blue);border-radius:12px;padding:28px 24px}
.engagement-card:nth-child(2){border-top:3px solid var(--cyan)}
.engagement-card:nth-child(3){border-top:3px solid var(--violet)}
.engagement-card h4{font-size:1.2rem;letter-spacing:-.025em;line-height:1.3}
.engagement-card>p{margin-top:14px;color:var(--graphite);font-size:.9375rem;line-height:1.7}
.engagement-card .engagement-detail{margin-top:auto;padding-top:20px;font-weight:700;color:var(--ink)}
.engagement-note{max-width:74ch;margin:24px 0 0;color:var(--graphite);font-size:.9375rem;line-height:1.7}
@media(max-width:960px){.ways-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:960px){.engagement-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:720px){.ways-heading,.engagement-heading{grid-template-columns:1fr;gap:16px}.ways-heading{margin-bottom:32px}.engagement-heading{margin:48px 0 24px}.ways-heading h2,.ways-heading>p{grid-column:auto}.ways-grid,.engagement-grid{grid-template-columns:1fr;gap:14px}.way-card,.engagement-card{padding:24px}}
