/* Synaptic ID — página pública. Llegada de noche, lectura en papel (BRAND.md, «Noche y papel»).
   Lo único llamativo a propósito: la sinapsis del inicio, el orbe de la casa unido a los cuatro productos con su
   color de Brand Vault (lo pone el servidor en style="--connect:…"). El resto, papel callado y una columna de lectura. */
.landing{background:var(--paper)}
.site-top.night{position:relative;background:var(--night);border-bottom:1px solid rgba(255,255,255,.07);color:#E8ECEE;
  -webkit-backdrop-filter:none;backdrop-filter:none}
.site-top.night .brandmark,.site-top.night .site-nav a,.site-top.night .site-cart{color:#E8ECEE}
.site-top.night .site-nav a:hover,.site-top.night .site-cart:hover{background:rgba(255,255,255,.08);color:#fff}
.site-top.night .btn{background:transparent;border-color:rgba(255,255,255,.32);color:#fff}
.site-top.night .btn:hover{background:rgba(255,255,255,.1)}
.site-top.night .count{background:#2CEDFC;color:#01030B}
.site-top.night :focus-visible,.arrival :focus-visible,.closing :focus-visible{outline-color:#7FB0FF}

/* --- llegada ---------------------------------------------------------------------------------------------------- */
.arrival{background:radial-gradient(120% 90% at 78% 40%,#0B1A2E 0%,#060D18 45%,#01030B 80%);color:#E8ECEE;
  overflow:hidden}
.hero{display:grid;gap:var(--s-8);align-items:center;padding-top:var(--s-16);padding-bottom:var(--s-16)}
@media (min-width:960px){.hero{grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);padding-top:var(--s-20);
  padding-bottom:var(--s-24)}}
.hero h1{color:#fff;font-size:clamp(2.5rem,6.2vw,4.5rem);line-height:1.02;letter-spacing:-.045em;font-weight:640;
  max-width:12ch}
.hero .lead{color:#B9C3C9;margin-top:var(--s-5);font-size:clamp(var(--t-16),1.6vw,var(--t-20));max-width:46ch}
.hero-actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:var(--s-8)}
.arrival .btn.primary,.closing .btn.primary{background:#2CEDFC;border-color:#2CEDFC;color:#01030B}
.arrival .btn.primary:hover,.closing .btn.primary:hover{background:#7DF4FD;border-color:#7DF4FD}
.btn.on-night{background:transparent;border-color:rgba(255,255,255,.34);color:#fff}
.btn.on-night:hover{background:rgba(255,255,255,.1)}
.hero-note{margin-top:var(--s-4);font-size:var(--t-14);color:#8C979E}

/* La sinapsis: el orbe (marca de la casa) y una línea a cada producto. */
.synapse{margin:0;justify-self:center;width:min(100%,560px)}
.synapse svg{display:block;width:100%;height:auto;overflow:visible}
.synapse .ring{fill:none;stroke:rgba(140,220,255,.12);stroke-width:1}
.synapse .ring.far{stroke:rgba(140,220,255,.06);stroke-dasharray:2 6}
.synapse .n{--c:#2CEDFC}
.synapse .n-connect{--c:var(--connect,#2CEDFC)}.synapse .n-growth{--c:var(--growth,#8B5CF6)}
.synapse .n-work{--c:var(--work,#F4B942)}.synapse .n-finance{--c:var(--finance,#10B981)}
.synapse path{fill:none;stroke:var(--c);stroke-width:1.6;stroke-linecap:round;stroke-dasharray:220;
  stroke-dashoffset:0;opacity:.9}
.synapse .halo{fill:var(--c);opacity:.16}
.synapse .core{fill:var(--c)}
.synapse text{fill:#DDE4E8;font-family:var(--sans);font-size:17px;font-weight:560;text-anchor:middle;letter-spacing:-.01em}
.synapse .orb{filter:drop-shadow(0 0 28px rgba(44,237,252,.28))}
@media (prefers-reduced-motion:no-preference){
  .synapse path{animation:draw 1.1s var(--ease) both}
  .synapse .halo,.synapse .core,.synapse text{animation:arrive .5s var(--ease) both}
  .synapse .n-growth path{animation-delay:.12s}.synapse .n-work path{animation-delay:.24s}
  .synapse .n-finance path{animation-delay:.36s}
  .synapse .n-connect .halo,.synapse .n-connect .core,.synapse .n-connect text{animation-delay:.8s}
  .synapse .n-growth .halo,.synapse .n-growth .core,.synapse .n-growth text{animation-delay:.92s}
  .synapse .n-work .halo,.synapse .n-work .core,.synapse .n-work text{animation-delay:1.04s}
  .synapse .n-finance .halo,.synapse .n-finance .core,.synapse .n-finance text{animation-delay:1.16s}
}
@keyframes draw{from{stroke-dashoffset:220}to{stroke-dashoffset:0}}
@keyframes arrive{from{opacity:0}}

/* --- lectura en papel ------------------------------------------------------------------------------------------- */
.paper{padding-top:var(--s-8)}
.block{display:grid;gap:var(--s-6);padding-top:var(--s-16);padding-bottom:var(--s-4)}
@media (min-width:960px){.block{grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:var(--s-16)}}
.block-head h2{font-size:clamp(var(--t-24),3vw,var(--t-38));letter-spacing:-.03em;font-weight:640;line-height:1.1}
.block-head p{margin-top:var(--s-3);color:var(--ink-2);font-size:var(--t-16);max-width:46ch}
.block-head .btn{margin-top:var(--s-2)}
.points{list-style:none;margin:0;padding:0;border-top:1px solid var(--line)}
.points li{padding:18px 0;border-bottom:1px solid var(--line);font-size:var(--t-16);color:var(--ink-2)}
.points strong{color:var(--ink)}
.products{list-style:none;margin:0;padding:0;display:grid;gap:12px}
.product{display:flex;gap:16px;align-items:flex-start;padding:18px 20px;border:1px solid var(--line);
  border-radius:var(--r-l);background:var(--panel);position:relative;overflow:hidden}
.product::before{content:"";position:absolute;inset:0 auto 0 0;width:3px;background:var(--product,var(--accent))}
.product h3{font-size:var(--t-20);letter-spacing:-.02em}
.product h3 a{color:var(--ink);text-decoration:none}
.product h3 a::after{content:"";position:absolute;inset:0}
.product h3 a:hover{text-decoration:underline}
.product p{color:var(--ink-2);margin-top:2px}
.product .product-meta{display:flex;flex-wrap:wrap;gap:4px 14px;align-items:center;font-size:var(--t-13);
  color:var(--muted);margin-top:8px}

/* --- cierre ----------------------------------------------------------------------------------------------------- */
.closing{margin-top:var(--s-20);background:radial-gradient(90% 140% at 50% 120%,#0B1A2E 0%,#060D18 50%,#01030B 85%);
  color:#E8ECEE;padding:var(--s-20) 0;text-align:center}
.closing h2{color:#fff;font-size:clamp(var(--t-30),4.4vw,var(--t-48));letter-spacing:-.035em;font-weight:640;
  margin:0 auto;max-width:18ch}
.closing .hero-actions{justify-content:center}
.landing .site-foot{margin-top:0}