/* Iberian Analytical v3 — "pharmaceutical dossier". Sin fuentes externas, sin CDNs, sin analítica. */

:root {
  --navy: #0E2A47;
  --navy-deep: #08192E;
  --cobalt: #1156B3;
  --cobalt-soft: #E8F0FA;
  --sky: #4D93E8;
  --bg: #FFFFFF;
  --clinical: #F3F6F9;
  --ink: #122031;
  --slate: #51677D;
  --line: #DCE3EA;
  --line2: #C3CFDA;
  --pass: #157A4A;
  --pass-bg: #E9F5EE;
  --fail: #B3261E;
  --fail-bg: #FBEDEB;
  --amber: #E8A13C;
  --sans: "Segoe UI", -apple-system, Roboto, Helvetica, Arial, sans-serif;
  --mono: Consolas, "SF Mono", Menlo, "Liberation Mono", monospace;
  --shadow-card: 0 1px 2px rgba(14,42,71,.06), 0 10px 32px rgba(14,42,71,.08);
  --shadow-deep: 0 2px 8px rgba(4,12,22,.35), 0 28px 70px rgba(4,12,22,.4);
}

* { margin: 0; padding: 0; box-sizing: border-box; }
html { scroll-behavior: smooth; }
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  * { animation: none !important; transition: none !important; }
  .reveal { opacity: 1 !important; transform: none !important; }
}

body {
  background: var(--bg);
  color: var(--ink);
  font-family: var(--sans);
  font-size: 16.5px;
  line-height: 1.65;
  -webkit-font-smoothing: antialiased;
}

.wrap { max-width: 1160px; margin: 0 auto; padding: 0 28px; }

a { color: var(--cobalt); text-decoration: none; }
a:hover { text-decoration: underline; }
:focus-visible { outline: 2px solid var(--cobalt); outline-offset: 3px; }

.reveal { opacity: 0; transform: translateY(16px); transition: opacity .7s ease, transform .7s ease; }
.reveal.in { opacity: 1; transform: none; }

/* ---------- utility topbar ---------- */

.topbar {
  background: var(--navy-deep); color: #B8C8D9;
  font-family: var(--mono); font-size: 11.5px; letter-spacing: 0.06em;
}
.topbar .wrap { display: flex; justify-content: space-between; gap: 16px; padding-top: 7px; padding-bottom: 7px; flex-wrap: wrap; }
.topbar b { color: #fff; font-weight: 600; }
.topbar .dot { color: var(--sky); }

/* ---------- header ---------- */

header.site {
  position: sticky; top: 0; z-index: 50;
  background: rgba(255,255,255,.92);
  backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(14px);
  border-bottom: 1px solid var(--line);
}
.masthead {
  display: flex; align-items: center; justify-content: space-between;
  gap: 16px; padding: 14px 0 10px; flex-wrap: wrap;
}
.brand { display: flex; align-items: center; gap: 12px; text-decoration: none; }
.brand:hover { text-decoration: none; }
.brand .mark { width: 40px; height: 40px; flex: none; }
.wordmark {
  font-family: var(--sans); font-weight: 700; font-size: 17px; letter-spacing: 0.14em;
  color: var(--navy); text-transform: uppercase; line-height: 1.15;
}
.wordmark small {
  display: block; font-family: var(--mono); font-weight: 400; font-size: 9.5px;
  letter-spacing: 0.22em; color: var(--slate);
}
.status-chip {
  font-family: var(--mono); font-size: 11px; color: var(--slate);
  border: 1px solid var(--line); border-radius: 3px; padding: 4px 10px; background: var(--clinical);
}
.status-chip i { font-style: normal; color: var(--cobalt); font-weight: 600; }
nav.site { display: flex; gap: 26px; flex-wrap: wrap; padding-bottom: 12px; align-items: center; }
nav.site a { color: var(--slate); font-size: 14px; font-weight: 600; letter-spacing: 0.01em; }
nav.site a:hover { color: var(--navy); text-decoration: none; }
nav.site a.cta {
  color: #fff; background: var(--cobalt); padding: 9px 18px; border-radius: 4px;
  box-shadow: 0 4px 14px rgba(17,86,179,.3);
}
nav.site a.cta:hover { background: #0D4794; }

/* ---------- botones ---------- */

.btn {
  display: inline-block; font-family: var(--sans); font-size: 15px; font-weight: 650;
  padding: 14px 28px; border-radius: 4px; border: 1px solid transparent; cursor: pointer;
  transition: transform .15s ease, box-shadow .15s ease, background .15s ease, border-color .15s ease;
}
.btn:active { transform: translateY(1px); }
.btn-primary { background: var(--cobalt); color: #fff; box-shadow: 0 6px 20px rgba(17,86,179,.32); }
.btn-primary:hover { background: #0D4794; text-decoration: none; box-shadow: 0 8px 26px rgba(17,86,179,.4); }
.btn-ghost { border-color: var(--line2); color: var(--navy); background: #fff; }
.btn-ghost:hover { border-color: var(--cobalt); color: var(--cobalt); text-decoration: none; }
.btn-onnavy { background: #fff; color: var(--navy); }
.btn-onnavy:hover { background: var(--cobalt-soft); text-decoration: none; }

/* ---------- hero clínico ---------- */

.hero {
  background:
    radial-gradient(900px 420px at 88% -10%, rgba(17,86,179,.07), transparent 65%),
    linear-gradient(180deg, #FFFFFF, var(--clinical));
  border-bottom: 1px solid var(--line);
  position: relative; overflow: hidden;
}
.hero-molecule { position: absolute; right: -60px; top: 30px; width: 520px; opacity: .05; pointer-events: none; }
.hero-inner { padding: 72px 0 64px; position: relative; display: grid; grid-template-columns: minmax(0,5fr) minmax(0,6fr); gap: 56px; align-items: center; }
.hero-kicker {
  font-family: var(--mono); font-size: 12px; letter-spacing: 0.24em; text-transform: uppercase;
  color: var(--cobalt); margin-bottom: 18px;
}
.hero h1 {
  font-weight: 700; font-size: clamp(34px, 4.6vw, 54px);
  line-height: 1.08; letter-spacing: -0.025em; color: var(--navy);
}
.hero h1 em { font-style: normal; color: var(--cobalt); }
.hero .sub { margin-top: 22px; max-width: 54ch; color: var(--slate); font-size: 17.5px; }
.hero .sub b { color: var(--ink); }
.hero-actions { margin-top: 30px; display: flex; gap: 14px; flex-wrap: wrap; align-items: center; }
.hero-proof {
  margin-top: 36px; display: flex; gap: 30px; flex-wrap: wrap;
  font-family: var(--mono); font-size: 12px; color: var(--slate);
}
.hero-proof span b { display: block; color: var(--navy); font-size: 20px; font-weight: 600; }

/* ---------- panel de instrumento ---------- */

.instrument {
  background: linear-gradient(180deg, var(--navy), var(--navy-deep));
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 10px;
  box-shadow: var(--shadow-deep);
  overflow: hidden;
}
.instrument-bar {
  display: flex; justify-content: space-between; align-items: center; gap: 10px; flex-wrap: wrap;
  padding: 11px 16px; border-bottom: 1px solid rgba(255,255,255,.09);
  font-family: var(--mono); font-size: 11px; color: #8FA5BC;
}
.instrument-bar .leds { display: flex; gap: 13px; align-items: center; }
.led { display: inline-flex; align-items: center; gap: 6px; white-space: nowrap; }
.led i {
  width: 7px; height: 7px; border-radius: 50%; display: inline-block;
  background: var(--amber); box-shadow: 0 0 8px rgba(232,161,60,.8);
}
.led.ok i { background: #43C97A; box-shadow: 0 0 8px rgba(67,201,122,.8); }
@media (prefers-reduced-motion: no-preference) { .led.blink i { animation: blink 1.6s steps(1) infinite; } }
@keyframes blink { 50% { opacity: .25; } }
.instrument-body { padding: 8px 6px 2px; }
.instrument svg { width: 100%; height: auto; display: block; }
.trace { fill: none; stroke: var(--sky); stroke-width: 2; filter: drop-shadow(0 0 6px rgba(77,147,232,.6)); }
@media (prefers-reduced-motion: no-preference) {
  /* el trazado se dibuja cuando el panel entra en pantalla (clave en móvil,
     donde queda por debajo del pliegue) */
  .instrument .trace { stroke-dasharray: 2400; stroke-dashoffset: 2400; }
  .instrument.in .trace { animation: draw 2.6s ease-out .15s forwards; }
}
@keyframes draw { to { stroke-dashoffset: 0; } }
.instrument-readout {
  display: flex; justify-content: space-between; gap: 10px; flex-wrap: wrap;
  padding: 8px 16px 12px;
  font-family: var(--mono); font-size: 11.5px; color: #8FA5BC;
}
.instrument-readout .live { color: var(--amber); }
.instrument-readout .flag { color: var(--sky); }

/* ---------- divisor cadena peptídica ---------- */

.peptide-divider { display: block; width: 100%; margin: 0; background: var(--bg); }
.peptide-divider.on-clinical { background: var(--clinical); }
.peptide-divider path, .peptide-divider circle { stroke: var(--line2); fill: none; stroke-width: 1.3; }
.peptide-divider text { font-family: var(--mono); font-size: 9px; fill: var(--line2); }

/* ---------- secciones ---------- */

section { padding: 72px 0 10px; position: relative; }
.band { background: var(--clinical); border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.band section { padding: 64px 0 56px; }
.sec-head { display: flex; justify-content: space-between; align-items: flex-start; gap: 20px; }
.doccode {
  font-family: var(--mono); font-size: 10.5px; letter-spacing: 0.14em; color: #8FA5BC;
  text-transform: uppercase; white-space: nowrap; padding-top: 8px;
}
.eyebrow {
  font-family: var(--mono); font-size: 12px; letter-spacing: 0.2em;
  text-transform: uppercase; color: var(--cobalt); margin-bottom: 14px;
}
section h2 {
  font-weight: 700; font-size: clamp(26px, 3.2vw, 38px);
  line-height: 1.14; max-width: 28ch; margin-bottom: 18px; letter-spacing: -0.02em; color: var(--navy);
}
section .lead { color: var(--slate); max-width: 66ch; font-size: 17px; }
section .lead b { color: var(--ink); }

/* trust band */
.trust { display: grid; grid-template-columns: repeat(5, 1fr); gap: 14px; margin: 44px 0 8px; }
.trust .chip {
  background: #fff; border: 1px solid var(--line); border-radius: 6px; padding: 16px 14px;
  display: flex; flex-direction: column; gap: 10px; box-shadow: var(--shadow-card);
}
.trust .chip svg { width: 26px; height: 26px; stroke: var(--cobalt); fill: none; stroke-width: 1.7; }
.trust .chip b { font-size: 13px; color: var(--navy); line-height: 1.3; }
.trust .chip small { font-family: var(--mono); font-size: 10.5px; color: var(--slate); letter-spacing: 0.04em; }

/* timeline pasos */
.steps { position: relative; display: grid; grid-template-columns: repeat(4, 1fr); gap: 22px; margin-top: 42px; }
.steps::before {
  content: ""; position: absolute; top: 21px; left: 6%; right: 6%;
  border-top: 2px dashed var(--line2); z-index: 0;
}
.step { position: relative; z-index: 1; }
.step .node {
  width: 42px; height: 42px; border-radius: 50%; background: #fff; border: 2px solid var(--cobalt);
  color: var(--cobalt); font-family: var(--mono); font-size: 14px; font-weight: 700;
  display: flex; align-items: center; justify-content: center; margin-bottom: 16px;
}
.step h3 { font-size: 16px; font-weight: 700; color: var(--navy); margin-bottom: 6px; }
.step p { font-size: 14px; color: var(--slate); }

/* stats navy band */
.stats-navy { background: linear-gradient(120deg, var(--navy), var(--navy-deep)); color: #fff; margin-top: 64px; }
.stats-navy .inner { padding: 54px 0 46px; }
.stats-navy .grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 40px; }
.stats-navy .num { font-family: var(--mono); font-size: clamp(28px, 3.4vw, 42px); color: #fff; }
.stats-navy .num i { font-style: normal; color: var(--sky); }
.stats-navy p { font-size: 14px; color: #A9BBCE; margin-top: 10px; max-width: 32ch; }
.stats-navy sup { color: var(--sky); }
.stats-navy .src { font-family: var(--mono); font-size: 11px; color: #6C8299; margin-top: 26px; }

/* spec + CoA */
.spec-grid { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1fr); gap: 44px; margin-top: 40px; align-items: start; }
.spec { width: 100%; border-collapse: collapse; background: #fff; border: 1px solid var(--line); box-shadow: var(--shadow-card); }
.spec caption {
  text-align: left; font-family: var(--mono); font-size: 11.5px; letter-spacing: 0.1em; color: #fff;
  padding: 11px 18px; background: var(--navy); border: 1px solid var(--navy);
}
.spec th, .spec td { text-align: left; padding: 14px 18px; border-top: 1px solid var(--line); vertical-align: top; font-size: 14.5px; }
.spec th { font-family: var(--mono); font-weight: 400; font-size: 12px; letter-spacing: 0.06em; color: var(--slate); white-space: nowrap; width: 150px; text-transform: uppercase; }
.spec td b { font-weight: 650; color: var(--navy); }
.spec .mono { font-family: var(--mono); font-size: 13.5px; }

.coa-doc {
  background: #fff; border: 1px solid var(--line2); border-radius: 3px;
  box-shadow: var(--shadow-card); padding: 0; position: relative; overflow: hidden; font-size: 13px;
}
.coa-doc::after {
  content: "SPECIMEN"; position: absolute; inset: 0; display: flex; align-items: center; justify-content: center;
  font-family: var(--mono); font-size: 62px; letter-spacing: 0.3em; color: rgba(17,86,179,.06);
  transform: rotate(-24deg); pointer-events: none;
}
.coa-letterhead {
  display: flex; justify-content: space-between; align-items: center; gap: 12px;
  background: var(--navy); color: #fff; padding: 14px 26px;
}
.coa-letterhead .lh-brand { display: flex; align-items: center; gap: 10px; }
.coa-letterhead .lh-brand svg { width: 30px; height: 30px; }
.coa-letterhead .lh-name { font-weight: 700; font-size: 13px; letter-spacing: 0.14em; text-transform: uppercase; }
.coa-letterhead .lh-name small { display: block; font-family: var(--mono); font-weight: 400; font-size: 9px; letter-spacing: 0.2em; color: #A9BBCE; }
.coa-letterhead .lh-id { font-family: var(--mono); font-size: 10.5px; text-align: right; color: #A9BBCE; }
.coa-letterhead .lh-id b { color: #fff; font-weight: 600; }
.coa-body { padding: 20px 26px 22px; }
.coa-title { font-family: var(--mono); font-size: 11px; letter-spacing: 0.24em; color: var(--cobalt); text-transform: uppercase; border-bottom: 2px solid var(--navy); padding-bottom: 8px; margin-bottom: 14px; }
.coa-fields { display: grid; grid-template-columns: 1fr 1fr; gap: 5px 26px; margin-bottom: 14px; }
.coa-fields div { border-bottom: 1px dotted var(--line); padding: 5px 0; display: flex; justify-content: space-between; gap: 10px; }
.coa-fields dt { color: var(--slate); font-family: var(--mono); font-size: 10.5px; text-transform: uppercase; letter-spacing: 0.08em; }
.coa-fields dd { font-family: var(--mono); font-size: 12.5px; color: var(--ink); }
.coa-fields dd.pass { color: var(--pass); font-weight: 700; }
.coa-trace { border: 1px solid var(--line); background: var(--clinical); margin: 4px 0 14px; }
.coa-trace svg { display: block; width: 100%; height: auto; }
.coa-foot { display: flex; justify-content: space-between; align-items: flex-end; gap: 14px; }
.coa-foot .sig { font-family: Georgia, serif; font-style: italic; font-size: 15px; border-top: 1px solid var(--ink); padding-top: 4px; }
.coa-foot .sig small { display: block; font-family: var(--mono); font-style: normal; font-size: 9.5px; color: var(--slate); letter-spacing: 0.08em; }
.coa-foot .seals { display: flex; align-items: flex-end; gap: 14px; }
.coa-stamp { width: 64px; height: 64px; flex: none; }
.coa-qr { width: 64px; height: 64px; flex: none; }
.coa-barcode { display: flex; align-items: flex-end; height: 34px; gap: 2px; }
.coa-barcode i { display: block; width: 2px; background: var(--ink); height: 100%; }
.coa-barcode i:nth-child(2n) { width: 1px; height: 80%; }
.coa-barcode i:nth-child(3n) { width: 3px; }
.coa-barcode i:nth-child(5n) { height: 65%; }

.honesty { border-left: 3px solid var(--cobalt); background: var(--cobalt-soft); padding: 18px 22px; margin-top: 28px; max-width: 74ch; font-size: 15px; border-radius: 0 4px 4px 0; }
.honesty b { color: var(--cobalt); }

/* tiers */
.tiers { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; margin-top: 42px; }
.tier {
  background: #fff; border: 1px solid var(--line); border-radius: 8px; overflow: hidden;
  display: flex; flex-direction: column; box-shadow: var(--shadow-card);
  transition: transform .2s ease, box-shadow .2s ease;
}
.tier:hover { transform: translateY(-3px); box-shadow: 0 3px 6px rgba(14,42,71,.08), 0 20px 48px rgba(14,42,71,.14); }
.tier .tag {
  font-family: var(--mono); font-size: 11.5px; letter-spacing: 0.16em; text-transform: uppercase;
  color: #fff; background: var(--slate); padding: 10px 26px;
}
.tier.featured .tag { background: var(--cobalt); }
.tier .tier-body { padding: 24px 26px 28px; display: flex; flex-direction: column; flex: 1; }
.tier .price { font-family: var(--mono); font-size: 38px; color: var(--navy); }
.tier .per { font-family: var(--mono); font-size: 12.5px; color: var(--slate); margin: 2px 0 16px; }
.tier ul { list-style: none; margin: 0 0 24px; flex: 1; }
.tier li { padding: 8px 0 8px 26px; position: relative; font-size: 14px; border-top: 1px solid var(--line); }
.tier li::before { content: "✓"; position: absolute; left: 2px; color: var(--pass); font-weight: 700; }
.tier .btn { text-align: center; }
.tier .slots { font-family: var(--mono); font-size: 11.5px; color: var(--cobalt); margin-top: 12px; text-align: center; }

/* pledge */
.pledge { background: linear-gradient(120deg, var(--navy), var(--navy-deep)); color: #fff; margin-top: 72px; }
.pledge .inner { padding: 64px 0; display: grid; grid-template-columns: minmax(0,3fr) minmax(0,2fr); gap: 48px; align-items: center; }
.pledge .eyebrow { color: var(--sky); }
.pledge h2 { color: #fff; max-width: 30ch; }
.pledge p { color: #A9BBCE; max-width: 58ch; margin-top: 14px; }
.pledge .mono { font-family: var(--mono); color: var(--amber); }
.pledge-cert {
  background: rgba(255,255,255,.05); border: 1px dashed rgba(255,255,255,.25); border-radius: 8px;
  padding: 26px 28px; font-family: var(--mono); font-size: 13px; color: #C7D4E2; line-height: 1.9;
}
.pledge-cert b { color: #fff; }
.pledge-cert .big { font-size: 30px; color: var(--amber); display: block; }

/* persona + buildlog */
.person { display: grid; grid-template-columns: 210px 1fr; gap: 36px; margin-top: 34px; align-items: start; }
.headshot {
  width: 210px; height: 240px; border: 1px dashed var(--line2); border-radius: 6px; background: #fff;
  display: flex; align-items: center; justify-content: center;
  font-family: var(--mono); font-size: 11.5px; color: var(--slate); text-align: center; padding: 12px;
}
.log { margin-top: 34px; border-top: 1px solid var(--line); }
.log-entry { display: grid; grid-template-columns: 160px 1fr; gap: 22px; padding: 20px 0; border-bottom: 1px solid var(--line); }
.log-entry .date { font-family: var(--mono); font-size: 12.5px; color: var(--slate); }
.log-entry h3 { font-size: 16px; font-weight: 700; color: var(--navy); margin-bottom: 5px; }
.log-entry p { font-size: 14.5px; color: var(--slate); }

/* faq */
.faq details { border-top: 1px solid var(--line); }
.faq details:last-child { border-bottom: 1px solid var(--line); }
.faq summary {
  cursor: pointer; padding: 20px 0; font-weight: 700; font-size: 16px; color: var(--navy); list-style: none;
  display: flex; justify-content: space-between; gap: 16px;
}
.faq summary::-webkit-details-marker { display: none; }
.faq summary::after { content: "+"; font-family: var(--mono); color: var(--cobalt); }
.faq details[open] summary::after { content: "−"; }
.faq .a { padding: 0 0 22px; color: var(--slate); max-width: 72ch; font-size: 15px; }
.faq .a b { color: var(--ink); }

/* form */
.reserve { background: #fff; border: 1px solid var(--line); border-radius: 8px; padding: 40px 38px; margin-top: 38px; box-shadow: var(--shadow-card); }
.reserve form { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; margin-top: 22px; }
.field { display: flex; flex-direction: column; gap: 7px; }
.field.full { grid-column: 1 / -1; }
.field label { font-family: var(--mono); font-size: 11px; letter-spacing: 0.12em; text-transform: uppercase; color: var(--slate); }
.field input, .field select, .field textarea {
  font-family: var(--sans); font-size: 15px; padding: 13px 15px;
  border: 1px solid var(--line2); border-radius: 4px; background: #fff; color: var(--ink);
  transition: border-color .15s ease, box-shadow .15s ease;
}
.field input:focus, .field select:focus, .field textarea:focus { border-color: var(--cobalt); box-shadow: 0 0 0 3px rgba(17,86,179,.12); outline: none; }
.form-note { font-size: 13px; color: var(--slate); }

/* footer corporativo */
footer.site { margin-top: 88px; background: var(--navy-deep); color: #A9BBCE; }
footer.site .cols {
  display: grid; grid-template-columns: 2fr 1fr 1fr 1fr; gap: 40px;
  padding: 52px 0 40px;
}
footer.site h4 { font-family: var(--mono); font-size: 11px; letter-spacing: 0.2em; text-transform: uppercase; color: #6C8299; margin-bottom: 14px; }
footer.site a { color: #C7D4E2; display: block; font-size: 14px; padding: 4px 0; }
footer.site a:hover { color: #fff; }
footer.site p { font-size: 13.5px; max-width: 44ch; }
footer.site .f-brand { display: flex; align-items: center; gap: 12px; margin-bottom: 16px; }
footer.site .f-brand svg { width: 36px; height: 36px; }
footer.site .f-brand .wordmark { color: #fff; }
footer.site .f-brand .wordmark small { color: #6C8299; }
footer.site .legal {
  border-top: 1px solid rgba(255,255,255,.09); padding: 18px 0 26px;
  display: flex; justify-content: space-between; gap: 16px; flex-wrap: wrap;
  font-family: var(--mono); font-size: 11.5px; color: #6C8299;
}

/* doc pages */
.doc h1 { font-weight: 700; font-size: clamp(30px, 4vw, 46px); margin: 56px 0 10px; letter-spacing: -0.02em; color: var(--navy); }
.doc .docmeta { font-family: var(--mono); font-size: 12.5px; color: var(--slate); margin-bottom: 34px; max-width: 96ch; line-height: 1.8; }
.doc h2 { margin-top: 44px; }
.doc p { max-width: 72ch; margin-top: 12px; }
.doc p.g { color: var(--slate); }
.doc ul.plain { margin: 12px 0 0 20px; max-width: 70ch; }
.doc ul.plain li { margin-top: 7px; }

/* pricelist */
.toolbar { display: flex; gap: 14px; align-items: center; margin-top: 30px; flex-wrap: wrap; }
.toolbar input[type="search"] {
  flex: 1; min-width: 240px; font-family: var(--sans); font-size: 15px; padding: 13px 15px;
  border: 1px solid var(--line2); border-radius: 4px; background: #fff; color: var(--ink);
}
.toolbar input[type="search"]:focus { border-color: var(--cobalt); box-shadow: 0 0 0 3px rgba(17,86,179,.12); outline: none; }
.toolbar .count { font-family: var(--mono); font-size: 12.5px; color: var(--slate); white-space: nowrap; }

.pricelist { width: 100%; border-collapse: collapse; margin-top: 22px; background: #fff; border: 1px solid var(--line); box-shadow: var(--shadow-card); }
.pricelist th, .pricelist td { text-align: left; padding: 13px 18px; border-top: 1px solid var(--line); font-size: 14.5px; vertical-align: top; }
.pricelist thead th { font-family: var(--mono); font-size: 11px; letter-spacing: 0.12em; text-transform: uppercase; color: #fff; font-weight: 400; background: var(--navy); border-top: none; }
.pricelist .cat td {
  font-family: var(--mono); font-size: 11.5px; letter-spacing: 0.16em; text-transform: uppercase;
  color: var(--cobalt); background: var(--clinical); padding: 10px 18px;
}
.pricelist .price-cell { font-family: var(--mono); white-space: nowrap; text-align: right; color: var(--navy); font-weight: 600; }
.pricelist .price-cell.soon { color: var(--slate); font-weight: 400; }
.pricelist .founder-cell { font-family: var(--mono); white-space: nowrap; text-align: right; color: var(--pass); font-weight: 600; }
.pricelist td .note { display: block; font-size: 12.5px; color: var(--slate); margin-top: 3px; font-weight: 400; }
.pricelist tr.hidden { display: none; }

/* database */
.db-banner {
  border: 1px solid var(--line); border-left: 3px solid var(--cobalt); background: #fff;
  padding: 20px 24px; margin-top: 32px; max-width: 82ch; font-size: 15px; border-radius: 0 6px 6px 0;
  box-shadow: var(--shadow-card);
}
.db-banner b { color: var(--cobalt); }

.db-stats { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1px; background: var(--line); border: 1px solid var(--line); margin-top: 28px; border-radius: 6px; overflow: hidden; box-shadow: var(--shadow-card); }
.db-stats .cell { background: #fff; padding: 20px 22px; }
.db-stats .cell .v { font-family: var(--mono); font-size: 28px; color: var(--navy); }
.db-stats .cell p { font-size: 13px; color: var(--slate); margin-top: 5px; }

.verify-box { display: flex; gap: 12px; margin-top: 32px; flex-wrap: wrap; }
.verify-box input {
  flex: 1; min-width: 220px; font-family: var(--mono); font-size: 15px; padding: 13px 15px;
  border: 1px solid var(--line2); border-radius: 4px; background: #fff; color: var(--ink);
  text-transform: uppercase;
}
.verify-box input:focus { border-color: var(--cobalt); box-shadow: 0 0 0 3px rgba(17,86,179,.12); outline: none; }
.verify-result { font-family: var(--mono); font-size: 13px; margin-top: 12px; color: var(--slate); }
.verify-result.bad { color: var(--fail); }
.verify-result.ok { color: var(--pass); }

.db-table { width: 100%; border-collapse: collapse; margin-top: 28px; background: #fff; border: 1px solid var(--line); box-shadow: var(--shadow-card); }
.db-table th, .db-table td { text-align: left; padding: 13px 15px; border-top: 1px solid var(--line); font-size: 14px; }
.db-table thead th { font-family: var(--mono); font-size: 11px; letter-spacing: 0.12em; text-transform: uppercase; color: #fff; font-weight: 400; background: var(--navy); border-top: none; }
.db-table .mono { font-family: var(--mono); font-size: 13px; white-space: nowrap; }
.db-table tr.result-row { cursor: pointer; transition: background .12s ease; }
.db-table tr.result-row:hover { background: var(--cobalt-soft); }
.db-table tr.highlight { outline: 2px solid var(--cobalt); outline-offset: -2px; }
.db-table tr.detail td { background: var(--clinical); font-size: 13px; color: var(--slate); }
.db-table tr.detail.hidden { display: none; }

.badge { display: inline-block; font-family: var(--mono); font-size: 11px; letter-spacing: 0.08em; padding: 3px 9px; border-radius: 3px; font-weight: 600; }
.badge.pass { color: var(--pass); background: var(--pass-bg); border: 1px solid #BFE0CC; }
.badge.fail { color: var(--fail); background: var(--fail-bg); border: 1px solid #EFC7C2; }
.badge.demo { color: var(--slate); border: 1px dashed var(--line2); background: #fff; }

/* figure bands (imagen editorial con pie de figura) */
.figure-band { position: relative; margin-top: 72px; }
.figure-band img { display: block; width: 100%; height: 360px; object-fit: cover; filter: saturate(.9); }
.figure-band figcaption {
  position: absolute; left: 0; right: 0; bottom: 0;
  background: linear-gradient(transparent, rgba(8,25,46,.78));
  color: #C7D4E2; font-family: var(--mono); font-size: 11px; letter-spacing: 0.16em;
  text-transform: uppercase; padding: 44px 0 14px;
}

/* responsive */
@media (max-width: 980px) {
  .hero-inner { grid-template-columns: 1fr; gap: 40px; }
  .trust { grid-template-columns: repeat(3, 1fr); }
  .pledge .inner { grid-template-columns: 1fr; }
  footer.site .cols { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 800px) {
  .steps { grid-template-columns: 1fr 1fr; }
  .steps::before { display: none; }
  .stats-navy .grid, .tiers, .db-stats, .trust { grid-template-columns: 1fr; }
  .spec-grid { grid-template-columns: 1fr; }
  .person { grid-template-columns: 1fr; }
  .headshot { width: 100%; max-width: 280px; }
  .reserve form { grid-template-columns: 1fr; }
  .log-entry { grid-template-columns: 1fr; gap: 5px; }
  .db-table, .pricelist { display: block; overflow-x: auto; }
  footer.site .cols { grid-template-columns: 1fr; gap: 26px; }
}
@media (max-width: 640px) {
  .steps { grid-template-columns: 1fr; }
}


/* anclas bajo el header sticky */
[id] { scroll-margin-top: 112px; }

/* ============================================================
   MÓVIL — sistema completo (≤760px)
   Objetivos: cero scroll horizontal · targets ≥44px · texto ≥13px ·
   tablas legibles sin deslizar · inputs a 16px (sin zoom en iOS)
   ============================================================ */
@media (max-width: 760px) {

  html, body { overflow-x: hidden; }
  body { font-size: 16px; }
  .wrap { padding: 0 18px; }
  [id] { scroll-margin-top: 16px; }

  /* --- cabecera: estática, marca legible, nav en rejilla tocable --- */
  header.site { position: static; backdrop-filter: none; -webkit-backdrop-filter: none; }
  .topbar .wrap { justify-content: center; padding-top: 9px; padding-bottom: 9px; }
  .topbar { font-size: 10.8px; letter-spacing: 0.08em; }
  .topbar .wrap span:not(:first-child) { display: none; }
  .masthead { padding: 14px 0 12px; gap: 10px; }
  .brand .mark { width: 34px; height: 34px; }
  .wordmark { font-size: 15px; letter-spacing: 0.1em; }
  .wordmark small { font-size: 10px; letter-spacing: 0.14em; }
  .status-chip { display: none; }

  nav.site {
    display: grid; grid-template-columns: repeat(3, 1fr);
    gap: 0; padding-bottom: 14px;
    border-top: 1px solid var(--line);
  }
  nav.site a {
    display: flex; align-items: center; justify-content: center;
    min-height: 44px; padding: 4px; font-size: 13px; text-align: center;
    border-bottom: 1px solid var(--line);
  }
  nav.site a.cta {
    grid-column: 1 / -1; margin-top: 10px; border-bottom: none;
    min-height: 48px; font-size: 15px; border-radius: 6px;
  }

  /* --- hero --- */
  .hero-inner { padding: 40px 0 44px; gap: 32px; }
  .hero-molecule { display: none; }
  .hero-kicker { font-size: 11.5px; letter-spacing: 0.18em; margin-bottom: 14px; }
  .hero h1 { font-size: clamp(30px, 8.6vw, 38px); line-height: 1.12; }
  .hero .sub { font-size: 16.5px; margin-top: 18px; }
  .hero-actions { margin-top: 24px; gap: 12px; }
  .hero-actions .btn { flex: 1 1 100%; text-align: center; min-height: 52px; padding: 15px 20px; }
  .hero-proof { gap: 18px 26px; margin-top: 30px; font-size: 12.5px; }
  .hero-proof span { flex: 1 1 40%; }
  .hero-proof span b { font-size: 19px; }

  /* --- panel de instrumento --- */
  .instrument-bar { font-size: 10.5px; padding: 10px 12px; gap: 8px; }
  .instrument-bar .leds { gap: 10px; flex-wrap: wrap; }
  .instrument-readout { font-size: 11px; padding: 8px 12px 12px; }

  /* --- secciones --- */
  section { padding-top: 48px; }
  .band section { padding: 44px 0 40px; }
  section h2 { font-size: clamp(23px, 6.4vw, 30px); }
  section .lead { font-size: 16.5px; }
  .doccode { display: none; }
  .eyebrow { font-size: 11.5px; letter-spacing: 0.16em; }

  /* --- chips de confianza y pasos --- */
  .trust { gap: 12px; margin: 32px 0 4px; }
  .trust .chip { flex-direction: row; align-items: center; gap: 14px; padding: 16px; }
  .trust .chip svg { flex: none; }
  .trust .chip b { font-size: 14px; }
  .trust .chip small { font-size: 11px; display: block; margin-top: 2px; }
  .trust .chip > div { min-width: 0; }
  .steps { gap: 18px; margin-top: 32px; }
  .step .node { width: 38px; height: 38px; margin-bottom: 12px; }

  /* --- banda de estadísticas --- */
  .stats-navy .inner { padding: 40px 0 36px; }
  .stats-navy .grid { gap: 28px; }
  .stats-navy .num { font-size: 30px; }
  .stats-navy p { font-size: 14.5px; max-width: none; }
  .stats-navy .src { font-size: 11.5px; line-height: 1.7; }

  /* --- ficha técnica: etiqueta encima del dato --- */
  .spec-grid { gap: 30px; margin-top: 30px; }
  .spec caption { font-size: 11px; padding: 12px 16px; }
  .spec th, .spec td { display: block; width: auto; white-space: normal; }
  .spec th { border-top: 1px solid var(--line); padding: 12px 16px 0; font-size: 11.5px; }
  .spec td { border-top: none; padding: 4px 16px 14px; font-size: 15px; }

  /* --- CoA specimen --- */
  .coa-letterhead { padding: 12px 16px; }
  .coa-letterhead .lh-id { font-size: 9.5px; }
  .coa-body { padding: 16px 16px 18px; }
  .coa-fields { grid-template-columns: 1fr; gap: 3px; }
  .coa-fields dd { font-size: 12px; }
  .coa-foot { flex-wrap: wrap; gap: 16px; }
  .coa-doc::after { font-size: 42px; }

  /* --- imágenes editoriales --- */
  .figure-band { margin-top: 52px; }
  .figure-band img { height: 210px; }
  .figure-band figcaption { font-size: 10px; letter-spacing: 0.1em; padding: 32px 0 12px; }

  /* --- charter / tiers --- */
  .tiers { gap: 18px; margin-top: 32px; }
  .tier .tag { padding: 11px 20px; font-size: 11px; }
  .tier .tier-body { padding: 20px 20px 24px; }
  .tier .price { font-size: 32px; }
  .tier li { font-size: 14.5px; padding: 10px 0 10px 26px; }
  .tier .btn { min-height: 50px; padding: 15px 20px; }
  .honesty { padding: 16px 18px; font-size: 15px; }

  /* --- pledge --- */
  .pledge .inner { padding: 44px 0; gap: 28px; }
  .pledge-cert { padding: 20px 20px; font-size: 12px; line-height: 1.85; }
  .pledge-cert .big { font-size: 26px; }

  /* --- quién firma / build log --- */
  .headshot { height: 200px; }
  .log-entry { padding: 16px 0; }
  .log-entry .date { font-size: 12px; }

  /* --- FAQ --- */
  .faq summary { padding: 18px 0; font-size: 15.5px; min-height: 52px; }
  .faq .a { font-size: 15px; padding-bottom: 20px; }

  /* --- formulario: 16px evita el zoom automático de iOS --- */
  .reserve { padding: 24px 20px; }
  .reserve form { gap: 16px; margin-top: 18px; }
  .field label { font-size: 11.5px; }
  .field input, .field select, .field textarea { font-size: 16px; padding: 14px; min-height: 50px; }
  .field textarea { min-height: 88px; }
  .reserve .btn { width: 100%; min-height: 52px; }

  /* --- pie --- */
  footer.site { margin-top: 56px; }
  footer.site .cols { padding: 36px 0 26px; gap: 26px; }
  footer.site a { padding: 11px 0; min-height: 44px; display: flex; align-items: center; font-size: 15px; }
  footer.site h4 { font-size: 11.5px; }
  footer.site .legal { font-size: 11px; line-height: 1.8; padding-bottom: 30px; }

  /* --- páginas de documento --- */
  .doc h1 { font-size: clamp(28px, 7.6vw, 36px); margin: 34px 0 10px; }
  .doc .docmeta { font-size: 12.5px; line-height: 1.75; margin-bottom: 26px; }
  .doc p { font-size: 16px; }
  .doc ul.plain { margin-left: 18px; }

  /* --- buscador del pricelist --- */
  .toolbar { gap: 10px; }
  .toolbar input[type="search"] { font-size: 16px; min-height: 50px; }
  .toolbar .count { font-size: 12.5px; }

  /* ============ TABLAS: legibles sin deslizar ============ */
  /* revierte el modo "bloque deslizable" y prioriza columnas */
  .pricelist, .db-table { display: table; overflow-x: visible; table-layout: fixed; width: 100%; }
  .pricelist th, .pricelist td, .db-table th, .db-table td { padding: 11px 10px; font-size: 13.5px; word-break: break-word; }
  .pricelist thead th, .db-table thead th { font-size: 10px; letter-spacing: 0.06em; }

  /* precios: se oculta la columna de notas (la info vive en el método) */
  .pricelist thead th:nth-child(2), .pricelist tbody td:nth-child(2) { display: none; }
  .pricelist thead th:nth-child(1) { width: 44%; }
  .pricelist thead th:nth-child(3) { width: 26%; }
  .pricelist thead th:nth-child(4) { width: 30%; }
  .pricelist .price-cell, .pricelist .founder-cell { font-size: 13.5px; }
  .pricelist .cat td { font-size: 11px; letter-spacing: 0.1em; padding: 10px; }

  /* base de datos: fecha, valor declarado, pureza y cliente pasan al detalle */
  .db-table thead th:nth-child(2), .db-table tbody td:nth-child(2),
  .db-table thead th:nth-child(4), .db-table tbody td:nth-child(4),
  .db-table thead th:nth-child(6), .db-table tbody td:nth-child(6),
  .db-table thead th:nth-child(8), .db-table tbody td:nth-child(8) { display: none; }
  .db-table tr.result-row { min-height: 52px; }
  .db-table .mono { font-size: 12.5px; white-space: normal; }
  .db-table .badge { font-size: 10px; padding: 2px 6px; }
  .db-table tr.detail td { display: table-cell !important; font-size: 12.5px; line-height: 1.65; }

  /* base de datos: verificador y stats */
  .db-banner { padding: 16px 18px; font-size: 15px; }
  .db-stats { gap: 1px; }
  .db-stats .cell { padding: 16px 18px; }
  .db-stats .cell .v { font-size: 24px; }
  .verify-box { gap: 10px; }
  .verify-box input { font-size: 16px; min-height: 50px; }
  .verify-box .btn { width: 100%; min-height: 50px; }
  .verify-result { font-size: 12.5px; }
}

/* pantallas muy estrechas */
@media (max-width: 400px) {
  .wrap { padding: 0 15px; }
  nav.site a { font-size: 12.2px; }
  .hero h1 { font-size: 29px; }
  .pricelist th, .pricelist td, .db-table th, .db-table td { padding: 10px 7px; font-size: 12.5px; }
  .trust .chip { padding: 14px; gap: 12px; }
}

/* ---- alta de cuenta profesional ---- */
.hp { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.hp-inline { position: absolute; left: -9999px; width: 1px; height: 1px; }
.field .opt { color: var(--slate); font-weight: 400; }
.notify {
  margin-top: 30px; padding: 22px 24px; background: var(--clinical);
  border: 1px solid var(--line); border-radius: 4px;
}
.notify p { max-width: 62ch; margin: 0 0 14px; font-size: 15px; }
.notify form { display: flex; gap: 10px; flex-wrap: wrap; }
.notify input[type=email] {
  flex: 1 1 260px; min-width: 0; padding: 12px 14px; font-size: 16px;
  border: 1px solid var(--line2); border-radius: 3px; background: #fff;
  color: var(--ink); font-family: inherit;
}
.notify input[type=email]:focus-visible { outline: 2px solid var(--cobalt); outline-offset: 1px; }
.notify .btn { flex: 0 0 auto; }
.notify .form-note { margin-top: 10px; }
@media (max-width: 760px) {
  .notify { padding: 18px 16px; }
  .notify form { flex-direction: column; }
  .notify .btn { width: 100%; }
}

/* ---- gancho de cuenta profesional ---- */
.tradebox {
  max-width: 1160px; margin: 0 auto 64px; padding: 26px 28px;
  background: var(--cobalt-soft); border: 1px solid var(--line2); border-radius: 4px;
}
.tradebox p { max-width: 74ch; margin: 0 0 14px; font-size: 15.5px; }
.tradebox p:last-child { margin-bottom: 0; }
@media (max-width: 760px) { .tradebox { margin: 0 20px 44px; padding: 20px 18px; } }