/* ==========================================================================
   Normativo · Internal Product Pages Lab
   Sistema visual compartido por las tres arquitecturas.

   Derivado del baseline Home V2 G.5.1 (home-v2-g5-1.css, intacto):
   blanco de lienzo, azul de identidad, marfil como superficie de media,
   tipografia Instrument Sans, radios amplios solo en media, cero sombra SaaS.

   Lo que una pagina interna SI puede anadir frente a la Home:
   mas densidad, mas modulo, mas producto real, mas ritmo variable.
   ========================================================================== */

:root {
  /* identidad */
  --navy:      #1a2e5e;
  --navy-deep: #0f1f42;
  --gold:      #c5a06c;
  --teal:      #1f8a76;
  --clay:      #c4622f;
  --sand:      #e8d9c0;

  /* tinta */
  --ink:   #101418;
  --ink-2: #4e5865;
  --ink-3: #6b7480;

  /* superficies */
  --paper:   #ffffff;
  --ivory:   #f7f6f2;
  --ivory-2: #f1ede4;
  --line:    #e9e7e1;
  --line-2:  #d9d6cf;

  /* paleta real de la entrega (deliveries/email-template-v2.js) */
  --entrega-navy:  #06263f;
  --entrega-gold:  #c8a765;
  --entrega-ivory: #fffaf0;
  --entrega-line:  #eee7d6;
  --plazo:         #8b2e2b;

  --sans: "Instrument Sans", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --mono: ui-monospace, SFMono-Regular, "SF Mono", Menlo, Consolas, monospace;

  --s3:8px; --s4:12px; --s5:16px; --s6:24px; --s7:32px; --s8:48px;
  --s9:64px; --s10:96px; --s11:140px; --s12:200px;

  --wrap: 1300px;
  --gutter: 48px;
}

*, *::before, *::after { box-sizing: border-box; }
html {
  overflow-x: hidden; overflow-x: clip;
  scroll-behavior: smooth;
  scroll-padding-top: 108px;
}

body {
  margin: 0;
  background: var(--paper);
  color: var(--ink);
  font-family: var(--sans);
  font-size: 17px;
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
}

a { color: inherit; text-decoration: none; }
:focus-visible { outline: 2px solid var(--navy); outline-offset: 3px; border-radius: 2px; }
img { max-width: 100%; }

.wrap { width: 100%; max-width: var(--wrap); margin: 0 auto; padding: 0 var(--gutter); }
.skip { position: absolute; left: -9999px; top: 0; z-index: 60; padding: 12px 18px; background: var(--navy); color: #fff; font-size: 14px; font-weight: 600; }
.skip:focus { left: 12px; top: 12px; }
.sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

/* ================================================================ TIPOGRAFIA */

.h1 { margin: 0; font-size: clamp(36px, 4.4vw, 64px); line-height: 1.03; font-weight: 400; letter-spacing: 0; color: var(--ink); }
.h1 em { font-style: normal; color: var(--navy); }
.h2 { margin: 0; font-size: clamp(26px, 2.9vw, 42px); line-height: 1.08; font-weight: 400; letter-spacing: 0; color: var(--ink); }
.h2 em { font-style: normal; color: var(--navy); }
.h3 { margin: 0; font-size: clamp(20px, 1.6vw, 25px); line-height: 1.15; font-weight: 500; color: var(--ink); }
.h4 { margin: 0; font-size: 17px; line-height: 1.25; font-weight: 600; color: var(--ink); }

.kicker {
  margin: 0; font-size: 11px; font-weight: 600; letter-spacing: .15em;
  text-transform: uppercase; color: var(--ink-3);
}
.kicker.is-navy { color: var(--navy); }
.eyebrow {
  margin: 0; display: inline-flex; align-items: center; gap: 10px;
  font-size: 12.5px; color: var(--ink-3);
}
.eyebrow::before { content: ""; width: 18px; height: 1px; background: var(--gold); flex: none; }
.eyebrow.is-plain::before { display: none; }

.lede { margin: 0; font-size: 18px; line-height: 1.55; color: var(--ink-2); max-width: 52ch; }
.body { margin: 0; font-size: 16.5px; line-height: 1.6; color: var(--ink-2); max-width: 56ch; }
.body.is-tight { max-width: 44ch; }
.note { margin: 0; font-size: 13.5px; line-height: 1.5; color: var(--ink-3); }
.num { font-variant-numeric: tabular-nums; }

/* cifra editorial: dato real, no decoracion */
.figure-num {
  display: block; font-size: clamp(30px, 3.4vw, 46px); line-height: 1;
  font-weight: 500; color: var(--navy); font-variant-numeric: tabular-nums;
}
.figure-cap { display: block; margin-top: 6px; font-size: 13px; line-height: 1.4; color: var(--ink-3); }

/* ================================================================= HEADER == */

.site-header {
  position: sticky; top: 0; z-index: 40;
  background: var(--paper);
  border-bottom: 1px solid transparent;
  transition: background-color .25s ease, border-color .25s ease;
}
.site-header.is-stuck { background: rgba(255,255,255,.9); backdrop-filter: saturate(180%) blur(14px); border-bottom-color: var(--line); }

.header-in {
  display: flex; align-items: center; justify-content: space-between;
  gap: var(--s7); min-height: 64px;
}
.brand { display: block; flex: none; }
.brand img { display: block; width: 164px; height: auto; transition: width .22s ease; }
.site-header.is-stuck .brand img { width: 148px; }

.header-nav { display: flex; align-items: center; gap: var(--s7); }
.header-links { display: flex; align-items: center; gap: var(--s7); }
.header-actions { display: flex; align-items: center; gap: var(--s6); }

.link {
  display: inline-flex; align-items: center; gap: 7px; min-height: 44px;
  font-size: 15px; color: var(--ink);
  border-bottom: 1px solid transparent;
  transition: color .18s ease, border-color .18s ease;
}
.link:hover { color: var(--navy); border-color: var(--navy); }
.link.is-product { color: var(--navy); }
.link.is-client { font-size: 14px; color: var(--ink-3); }
.link.is-client:hover { color: var(--navy); }

.btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 9px;
  min-height: 44px; padding: 0 20px; border: 1px solid transparent; border-radius: 4px;
  font-family: inherit; font-size: 15px; font-weight: 500; white-space: nowrap;
  cursor: pointer; transition: background-color .18s ease, border-color .18s ease, color .18s ease;
}
.btn-navy { background: var(--navy); color: #fff; }
.btn-navy:hover { background: var(--navy-deep); }
.btn-line { border-color: var(--line-2); color: var(--ink); background: var(--paper); }
.btn-line:hover { border-color: var(--navy); color: var(--navy); }
.ico { width: 12px; height: 12px; flex: none; stroke: currentColor; stroke-width: 1.7; fill: none; }

/* ---- conmutador de producto: segunda fila, discreta, siempre visible ------ */

.product-bar { border-top: 1px solid var(--line); }
.product-bar .wrap { display: flex; align-items: center; justify-content: space-between; gap: var(--s6); min-height: 46px; }
.crumbs { display: flex; align-items: center; gap: 10px; min-width: 0; font-size: 13px; color: var(--ink-3); }
.crumbs a { color: var(--ink-3); border-bottom: 1px solid transparent; }
.crumbs a:hover { color: var(--navy); border-color: var(--navy); }
.crumbs .sep { color: var(--line-2); }
.crumbs .here { color: var(--ink); font-weight: 500; }

.p-switch { display: flex; align-items: center; gap: 6px; flex: none; }
.p-switch .p-label { font-size: 10.5px; font-weight: 600; letter-spacing: .14em; text-transform: uppercase; color: var(--ink-3); margin-right: 4px; }
.p-item {
  display: inline-flex; align-items: center; gap: 7px; min-height: 30px; padding: 0 11px;
  font-size: 13px; color: var(--ink-2);
  border: 1px solid var(--line); border-radius: 3px; background: var(--paper);
  transition: border-color .18s ease, color .18s ease, background-color .18s ease;
}
.p-item:hover { border-color: var(--navy); color: var(--navy); }
.p-item[aria-current="page"] { border-color: var(--navy); color: var(--navy); background: var(--ivory); font-weight: 500; }
.p-item .dot { width: 5px; height: 5px; border-radius: 50%; background: var(--gold); flex: none; }
.p-item.is-soon .dot { background: var(--line-2); }

.menu { position: relative; display: none; }
.menu > summary {
  list-style: none; cursor: pointer;
  display: inline-flex; align-items: center; gap: 9px; min-height: 44px;
  font-size: 15px; color: var(--ink);
}
.menu > summary::-webkit-details-marker { display: none; }
.menu-icon { width: 16px; height: 10px; position: relative; flex: none; }
.menu-icon span { position: absolute; left: 0; right: 0; height: 1.5px; background: currentColor; }
.menu-icon span:nth-child(1) { top: 0; }
.menu-icon span:nth-child(2) { top: 4.25px; }
.menu-icon span:nth-child(3) { top: 8.5px; }
.menu-panel {
  position: absolute; right: 0; top: calc(100% + 10px); z-index: 50;
  min-width: 260px; padding: var(--s5);
  background: var(--paper); border: 1px solid var(--line); border-radius: 8px;
  display: flex; flex-direction: column; gap: 2px;
}
.menu-panel a:not(.btn) { display: flex; align-items: center; min-height: 44px; font-size: 16px; color: var(--ink); }
.menu-panel a:not(.btn):hover { color: var(--navy); }
/* el CTA del panel movil conserva su tratamiento en todos los estados */
.menu-panel .btn-navy,
.menu-panel .btn-navy:link,
.menu-panel .btn-navy:visited,
.menu-panel .btn-navy:hover,
.menu-panel .btn-navy:focus-visible,
.menu-panel .btn-navy:active { color: #fff; background: var(--navy); }
.menu-panel .btn-navy:hover, .menu-panel .btn-navy:focus-visible { background: var(--navy-deep); color: #fff; }
.menu-panel .btn { margin-top: var(--s4); width: 100%; }
.menu-h { margin: var(--s4) 0 2px; font-size: 10.5px; font-weight: 600; letter-spacing: .14em; text-transform: uppercase; color: var(--ink-3); }

/* ================================================================ SECCIONES */

.band { padding: var(--s11) 0; }
.band.is-tight { padding: var(--s10) 0; }
.band.is-open { padding-bottom: var(--s12); }
.band.is-alt { background: var(--ivory); }
.band.is-line { border-top: 1px solid var(--line); }

.sec-head { display: flex; flex-direction: column; gap: var(--s5); max-width: 62rem; }
.sec-head.is-split { flex-direction: row; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: var(--s6); max-width: none; }
.sec-head .h2 { max-width: 24ch; }

.meta-row { display: flex; flex-wrap: wrap; gap: 6px var(--s6); font-size: 13px; color: var(--ink-3); }

/* =============================================================== SUPERFICIE */

/* marco neutro para producto real. hairline, sin sombra, radio contenido. */
.surface {
  position: relative; margin: 0;
  background: var(--paper);
  border: 1px solid var(--line-2);
  border-radius: 8px;
  overflow: hidden;
}
.surface.is-ivory { background: var(--ivory); }
.surface.is-soft { border-color: var(--line); }
.surface > .surface-bar {
  display: flex; align-items: center; justify-content: space-between; gap: var(--s5);
  min-height: 42px; padding: 0 var(--s5);
  border-bottom: 1px solid var(--line);
  background: var(--ivory);
}
.surface-bar .s-label { font-size: 11px; font-weight: 600; letter-spacing: .13em; text-transform: uppercase; color: var(--ink-3); }
.surface-bar .s-meta { font-size: 12.5px; color: var(--ink-3); font-variant-numeric: tabular-nums; }
.surface-body { padding: var(--s6); }
.surface-body.is-flush { padding: 0; }

.media-frame { position: relative; margin: 0; overflow: hidden; border-radius: 8px; background: var(--ivory); }
.media-frame.is-round { border-radius: 20px; }
.media-frame.is-portrait { aspect-ratio: 4 / 5; }
.media-frame img { display: block; width: 100%; height: 100%; object-fit: cover; }

/* ================================================================ PRIMITIVAS */

/* lista de datos con hairlines: densa, escaneable, sin tarjetas */
.data-list { margin: 0; padding: 0; list-style: none; border-top: 1px solid var(--line); }
.data-list > li {
  display: grid; grid-template-columns: minmax(0, 1fr) auto;
  gap: var(--s5); align-items: baseline;
  padding: 13px 0; border-bottom: 1px solid var(--line);
}
.data-list .d-name { font-size: 15.5px; color: var(--ink); }
.data-list .d-name small { display: block; font-size: 12.5px; color: var(--ink-3); margin-top: 2px; }
.data-list .d-val { font-size: 15.5px; color: var(--navy); font-variant-numeric: tabular-nums; font-weight: 500; }

.chip {
  display: inline-flex; align-items: center; gap: 6px;
  padding: 3px 9px; border: 1px solid var(--line-2); border-radius: 3px;
  font-size: 12px; color: var(--ink-2); white-space: nowrap;
}
.chip.is-topic { border-color: var(--entrega-gold); background: var(--entrega-ivory); color: var(--navy); }
.chip.is-gray { border-color: var(--line); color: var(--ink-3); }
.chip.is-live { border-color: var(--teal); color: var(--teal); }
.chip.is-plazo { border-color: var(--plazo); color: var(--plazo); }

/* estado operativo: punto + etiqueta. nunca un badge decorativo. */
.state { display: inline-flex; align-items: center; gap: 8px; font-size: 13px; color: var(--ink-2); }
.state .s-dot { width: 6px; height: 6px; border-radius: 50%; background: var(--teal); flex: none; }
.state.is-warn .s-dot { background: var(--gold); }
.state.is-down .s-dot { background: var(--plazo); }
.state.is-idle .s-dot { background: var(--line-2); }

.cta-row { display: flex; flex-wrap: wrap; align-items: center; gap: var(--s5) var(--s7); }
.cta-row.is-stack { flex-direction: column; align-items: flex-start; }
.stack { display: flex; flex-direction: column; gap: var(--s5); }
.stack.is-roomy { gap: var(--s7); }
.text-link {
  display: inline-flex; align-items: center; gap: 8px; min-height: 44px;
  font-size: 15px; font-weight: 500; color: var(--navy);
  border-bottom: 1px solid var(--line);
}
.text-link:hover { border-color: var(--navy); }

/* marcador de origen: REAL PRODUCT vs EDITORIAL REPRESENTATION */
.origin {
  display: inline-flex; align-items: center; gap: 7px;
  font-size: 10.5px; font-weight: 600; letter-spacing: .12em; text-transform: uppercase;
  color: var(--ink-3);
}
.origin::before { content: ""; width: 5px; height: 5px; border: 1px solid var(--ink-3); flex: none; }
.origin.is-real { color: var(--teal); }
.origin.is-real::before { border-color: var(--teal); background: var(--teal); }

/* ====================================================== SUPERFICIE ENTREGA == */

/* representacion editorial de la entrega real (paleta real del email v2) */
.mail {
  width: 100%; background: #fff; border: 1px solid var(--entrega-line); border-radius: 8px; overflow: hidden;
  font-size: 14px;
}
.mail-head { display: flex; align-items: center; justify-content: space-between; gap: var(--s5); padding: 16px 20px; border-bottom: 1px solid var(--entrega-line); }
.mail-mark { display: flex; align-items: center; gap: 9px; }
.mail-mark .m-glyph {
  width: 22px; height: 22px; border: 1px solid var(--entrega-navy); border-radius: 3px;
  display: grid; place-items: center; font-size: 12px; font-weight: 600; color: var(--entrega-navy);
}
.mail-mark .m-name { font-size: 13px; font-weight: 600; letter-spacing: .1em; text-transform: uppercase; color: var(--entrega-navy); }
.mail-head .m-date { font-size: 12.5px; color: var(--ink-3); font-variant-numeric: tabular-nums; }
.mail-title { padding: 20px 20px 4px; }
.mail-title .t-k { font-size: 11px; font-weight: 600; letter-spacing: .13em; text-transform: uppercase; color: var(--ink-3); }
.mail-title .t-h { margin: 6px 0 0; font-size: 20px; line-height: 1.2; font-weight: 400; color: var(--entrega-navy); }
.mail-body { padding: 4px 20px 20px; }
.mail-section { border-top: 1px solid var(--entrega-line); padding-top: 14px; margin-top: 16px; }
.mail-section .sec-row { display: flex; align-items: baseline; justify-content: space-between; gap: var(--s5); }
.mail-section .sec-t { font-size: 13px; font-weight: 600; letter-spacing: .04em; color: var(--entrega-navy); margin: 0; }
.mail-section .sec-n { font-size: 12px; color: var(--ink-3); font-variant-numeric: tabular-nums; }
.mail-item { padding: 11px 0; border-bottom: 1px solid var(--entrega-line); }
.mail-item:last-child { border-bottom: 0; }
.mail-item .i-t { margin: 0; font-size: 14.5px; line-height: 1.35; color: var(--ink); }
.mail-item .i-m { margin: 5px 0 0; font-size: 12px; color: var(--ink-3); }
.mail-item .i-tags { display: flex; flex-wrap: wrap; gap: 5px; margin-top: 7px; }
.mail-foot { padding: 14px 20px; border-top: 1px solid var(--entrega-line); background: var(--entrega-ivory); display: flex; align-items: center; justify-content: space-between; gap: var(--s5); }
.mail-foot .f-a { font-size: 12.5px; color: var(--entrega-navy); font-weight: 500; }
.mail-foot .f-b { font-size: 11.5px; color: var(--ink-3); }

/* ============================================================== CIERRE/FIN == */

.closing { padding: var(--s11) 0 var(--s10); }
.closing-in { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: var(--s7) var(--s6); align-items: end; }
.closing-copy { grid-column: 1 / span 7; display: flex; flex-direction: column; gap: var(--s5); }
.closing-actions { grid-column: 9 / span 4; display: flex; flex-direction: column; align-items: flex-start; gap: var(--s5); }
.closing-actions .btn { width: 100%; }

.site-footer { padding: var(--s10) 0 var(--s8); border-top: 1px solid var(--line); }
.foot-grid { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: var(--s8) var(--s6); }
.foot-brand { grid-column: 1 / span 4; display: flex; flex-direction: column; gap: var(--s5); }
.foot-brand img { display: block; width: 168px; height: auto; }
.foot-claim { margin: 0; font-size: 15px; line-height: 1.5; color: var(--ink-2); max-width: 32ch; }
.foot-mail { margin: 0; }
.foot-mail a { font-size: 15px; color: var(--navy); border-bottom: 1px solid var(--line); }
.foot-mail a:hover { border-color: var(--navy); }
.foot-grid > .foot-col:nth-child(2) { grid-column: 6 / span 2; }
.foot-grid > .foot-col:nth-child(3) { grid-column: 8 / span 2; }
.foot-grid > .foot-col:nth-child(4) { grid-column: 10 / span 3; }
.foot-col { display: flex; flex-direction: column; gap: 8px; }
.foot-h { margin: 0 0 6px; font-size: 11px; font-weight: 600; letter-spacing: .14em; text-transform: uppercase; color: var(--ink-3); }
.foot-col a { display: inline-flex; align-items: center; min-height: 30px; font-size: 15px; color: var(--ink); }
.foot-col a:hover { color: var(--navy); }
.foot-col a.is-here { color: var(--navy); }
.foot-note { color: var(--ink-3); font-weight: 400; }
.foot-legal {
  display: flex; flex-wrap: wrap; justify-content: space-between; gap: 8px var(--s6);
  margin-top: var(--s9); padding-top: var(--s5);
  border-top: 1px solid var(--line);
  font-size: 12.5px; color: var(--ink-3);
}

/* ================================================================== MOTION == */

@keyframes lab-up { from { opacity: 0; transform: translateY(14px); } to { opacity: 1; transform: none; } }
@keyframes lab-in { from { opacity: 0; } to { opacity: 1; } }
@keyframes lab-trace { from { transform: translateX(-10px); opacity: 0; } 20% { opacity: .9; } to { transform: translateX(0); opacity: .9; } }
@keyframes lab-breathe { 0%, 100% { opacity: .35; } 50% { opacity: .95; } }

/* sin JS el contenido esta completo: el motion solo refuerza */
.motion .fu { animation: lab-up .8s cubic-bezier(.2,.7,.3,1) both; }
.motion .fu[data-d="1"] { animation-delay: .09s; }
.motion .fu[data-d="2"] { animation-delay: .18s; }
.motion .fu[data-d="3"] { animation-delay: .27s; }
.motion .fi { animation: lab-in .9s ease-out .1s both; }
.is-live .pulse { animation: lab-breathe 9s ease-in-out infinite; }
.is-live .pulse.p2 { animation-delay: -3s; }
.is-live .pulse.p3 { animation-delay: -6s; }

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  .motion .fu, .motion .fi, .is-live .pulse { animation: none !important; }
}

/* =============================================================== RESPONSIVE */

@media (max-width: 1080px) {
  :root { --gutter: 32px; }
  .header-nav { gap: var(--s6); }
  .header-links { gap: var(--s6); }
  .foot-brand { grid-column: 1 / span 4; }
  .band { padding: var(--s10) 0; }
}

@media (max-width: 900px) {
  :root { --gutter: 22px; }
  html { scroll-padding-top: 96px; }

  .header-in { min-height: 58px; }
  .site-header.is-stuck .header-in { min-height: 54px; }
  .brand img, .site-header.is-stuck .brand img { width: 144px; }
  .header-links, .header-actions { display: none; }
  .menu { display: block; }

  .product-bar .wrap { min-height: 42px; }
  .crumbs { font-size: 12.5px; }
  .p-switch .p-label { display: none; }

  /* el conmutador no cabe en pantallas estrechas: se desplaza en su propia
     franja en lugar de empujar la pagina. */
  .product-bar .wrap { flex-wrap: wrap; gap: 4px var(--s5); padding-top: 7px; padding-bottom: 7px; }
  .p-switch {
    flex: 1 1 100%; min-width: 0; overflow-x: auto;
    scrollbar-width: none; -webkit-overflow-scrolling: touch;
  }
  .p-switch::-webkit-scrollbar { display: none; }
  .p-item { flex: none; }

  .band { padding: var(--s9) 0; }
  .band.is-open { padding-bottom: var(--s10); }

  .closing { padding: var(--s10) 0 var(--s9); }
  .closing-in { grid-template-columns: minmax(0, 1fr); gap: var(--s7); }
  .closing-copy, .closing-actions { grid-column: 1 / -1; }

  .foot-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--s8) var(--s6); }
  .foot-brand { grid-column: 1 / -1; }
  .foot-grid > .foot-col:nth-child(2) { grid-column: 1 / span 1; }
  .foot-grid > .foot-col:nth-child(3) { grid-column: 2 / span 1; }
  .foot-grid > .foot-col:nth-child(4) { grid-column: 1 / -1; }
}

@media (max-width: 640px) {
  body { font-size: 16px; }
  .h1 { font-size: clamp(32px, 9.6vw, 44px); }
  .h2 { font-size: clamp(24px, 7.6vw, 32px); }
  .lede, .body { font-size: 16px; }
  .surface-body { padding: var(--s5); }
  .foot-grid { grid-template-columns: minmax(0, 1fr); }
  .foot-grid > .foot-col:nth-child(2),
  .foot-grid > .foot-col:nth-child(3),
  .foot-grid > .foot-col:nth-child(4) { grid-column: 1 / -1; }
  .foot-col { gap: 2px; }
  .cta-row .btn { width: 100%; }
  .p-switch { overflow-x: auto; }
  .p-item { min-height: 32px; padding: 0 9px; font-size: 12.5px; }
}


/* marca de Atlas en línea con el logo (patrón aprobado) */
.brand { display: inline-flex; align-items: center; }
.brand-atlas { display: inline-flex; align-items: center; gap: 10px; margin-left: 12px; padding-left: 12px; border-left: 1px solid var(--line-2); font-size: 13px; font-weight: 500; color: var(--navy); }
.brand-atlas a { border-bottom: 1px solid transparent; }
.brand-atlas a:hover { border-color: var(--navy); }
@media (max-width: 900px) { .brand-atlas { font-size: 12px; } }
@media (max-width: 640px) { .brand-atlas { display: none; } }

/* ==========================================================================
   R2 · ajustes pedidos en la segunda pasada
   ========================================================================== */

/* el header de marketing se funde con el hero blanco: sin hairline inferior */
.site-header.is-flat { border-bottom: 0; box-shadow: none; background: #fff; }

/* Atlas Home · dos acciones en el hero.
   El ancla #areas se apoya en el scroll-padding-top del documento (108 px);
   no se añade scroll-margin para no sumar dos desplazamientos. */
.a-hero-actions { display: flex; flex-wrap: wrap; align-items: center; gap: var(--s4); margin-top: var(--s5); }

/* R2 · el hero institucional se funde con Áreas: se elimina la única línea
   divisoria (border-top de la cabecera de sección), sin tocar espaciados */
.a-areas .a-head { border-top: 0; }

/* Radar · envíos del día (unidad editorial, no bandeja de correo) */
.deliv .d-side { display: flex; flex-direction: column; align-items: flex-end; gap: 4px; }
.deliv-open { color: var(--navy); font-size: 11.5px; font-weight: 600; border-bottom: 1px solid rgba(26, 46, 94, .22); }
.deliv-open:hover, .deliv-open:focus-visible { border-color: var(--navy); }

/* Directo · la transcripción es salida propia */
.d5-link.is-primary { color: var(--navy); font-weight: 600; }
.d5-link.is-quiet { color: var(--ink-3); font-weight: 500; }

/* Atlas informativo · el mapa y su entorno, una sola superficie blanca */
.band.is-white, .b4-actors.is-white { background: #fff; }
.b4-map-wrap { position: relative; margin-top: var(--s7); }

/* ==========================================================================
   Botones dentro del header publico (familia marketing)

   Un unico tratamiento compacto para los controles de cabecera: 38-40 px de
   alto, padding contenido y tipo de 14 px, con aire por encima y por debajo
   dentro de la cabecera de 64 px. El boton solido "Area Cliente" sigue siendo
   la accion principal; los secundarios pesan todavia menos.

   El alcance es SOLO .site-header: los CTA de hero y de contenido conservan
   su tamano.
   ========================================================================== */

.site-header .header-actions .btn,
.site-header .menu-panel .btn {
  min-height: 38px;
  padding: 0 16px;
  font-size: 14px;
  border-radius: 4px;
}

.site-header .header-actions .btn-line,
.site-header .menu-panel .btn-line {
  min-height: 36px;
  padding: 0 14px;
}

@media (max-width: 900px) {
  .site-header .menu-panel .btn { min-height: 38px; }
  .site-header .menu-panel .btn-line { min-height: 36px; }
}