/* =========================================================================
   SAMA · Sociedad Argentina de Medicina Aeroespacial
   Sistema de diseño institucional
   ========================================================================= */

/* ----- Tokens ----------------------------------------------------------- */
:root {
  --navy-900:#0a1f3c;
  --navy-800:#0b2545;
  --navy-700:#11315c;
  --navy-600:#1d4e89;
  --blue:#1f5fa6;
  --blue-light:#2f6fb0;

  --gold:#c9a227;
  --gold-soft:#d8b755;
  --gold-100:#f6edd3;

  --ink:#16243a;
  --slate:#46566d;
  --muted:#6b7890;
  --line:#e4e9f0;
  --line-strong:#cfd8e4;
  --mist:#eef2f7;
  --mist-2:#f6f8fb;
  --paper:#ffffff;

  --ok-bg:#e7f4ec; --ok-fg:#1c6b42;
  --err-bg:#fbeae8; --err-fg:#a52b22;

  --font-display:'Spectral', Georgia, 'Times New Roman', serif;
  --font-body:'Inter', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;

  --r-sm:6px; --r:10px; --r-lg:16px; --r-pill:999px;
  --sh-1:0 1px 2px rgba(11,37,69,.06), 0 1px 3px rgba(11,37,69,.05);
  --sh-2:0 6px 18px rgba(11,37,69,.08);
  --sh-3:0 18px 48px rgba(11,37,69,.14);

  --wrap:1160px;
  --gutter:clamp(1rem, 4vw, 2rem);
}

/* ----- Reset / base ----------------------------------------------------- */
*,*::before,*::after { box-sizing:border-box; }
* { margin:0; }
html { -webkit-text-size-adjust:100%; scroll-behavior:smooth; }
body {
  font-family:var(--font-body);
  color:var(--ink);
  background:var(--paper);
  line-height:1.65;
  font-size:clamp(1rem, .96rem + .2vw, 1.0625rem);
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}
img,svg { display:block; max-width:100%; }
a { color:var(--blue); text-decoration:none; }
a:hover { color:var(--navy-700); text-decoration:underline; }
ul,ol { padding-left:1.2em; }
h1,h2,h3,h4 { font-family:var(--font-display); line-height:1.18; color:var(--navy-800); font-weight:600; }
strong { font-weight:600; color:var(--navy-800); }
:focus-visible { outline:3px solid var(--blue-light); outline-offset:2px; border-radius:3px; }

/* ----- Layout ----------------------------------------------------------- */
.wrap { width:100%; max-width:var(--wrap); margin-inline:auto; padding-inline:var(--gutter); }
.section { padding-block:clamp(3rem, 6vw, 5.5rem); }
.section--alt { background:var(--mist-2); border-block:1px solid var(--line); }
.section--navy { background:var(--navy-800); color:#e8eef7; }
.section--navy h2,.section--navy h3 { color:#fff; }
.narrow { max-width:760px; }
.center { text-align:center; }
.mt-0{margin-top:0}.mb-0{margin-bottom:0}

.section__head { max-width:760px; margin-bottom:2.5rem; }
.section__head.center { margin-inline:auto; }
.eyebrow {
  font-family:var(--font-body); font-weight:600; font-size:.8rem;
  letter-spacing:.14em; text-transform:uppercase; color:var(--gold);
  display:inline-flex; align-items:center; gap:.6em; margin-bottom:.85rem;
}
.eyebrow::before { content:""; width:26px; height:2px; background:var(--gold); display:inline-block; }
.section--navy .eyebrow { color:var(--gold-soft); }
h2.section__title { font-size:clamp(1.7rem, 1.2rem + 1.8vw, 2.5rem); letter-spacing:-.01em; }
.section__intro { color:var(--slate); font-size:1.075rem; margin-top:.9rem; }
.section--navy .section__intro { color:#c4d2e6; }

/* ----- Skip link -------------------------------------------------------- */
.skip-link {
  position:absolute; left:.5rem; top:-3.5rem; z-index:200;
  background:var(--navy-800); color:#fff; padding:.6rem 1rem; border-radius:var(--r-sm);
  transition:top .15s ease;
}
.skip-link:focus { top:.5rem; color:#fff; text-decoration:none; }

/* ----- Emblem ----------------------------------------------------------- */
.emblem { width:120px; height:auto; }
.emblem--brand { width:52px; flex:0 0 auto; }
.emblem--hero { width:clamp(108px, 16vw, 150px); filter:drop-shadow(0 8px 22px rgba(0,0,0,.35)); }
.emblem--footer { width:64px; margin-bottom:1rem; }

/* ----- Header ----------------------------------------------------------- */
.site-header { position:sticky; top:0; z-index:100; background:rgba(255,255,255,.92);
  backdrop-filter:saturate(140%) blur(8px); border-bottom:1px solid var(--line); }
.topbar { background:var(--navy-800); color:#cdd9ea; font-size:.78rem; }
.topbar__inner { display:flex; justify-content:space-between; gap:1rem; padding-block:.45rem; flex-wrap:wrap; }
.topbar__lead { font-weight:500; letter-spacing:.01em; }
.topbar__meta { color:#9fb2cd; }

.header__inner { display:flex; align-items:center; gap:1.5rem; padding-block:.7rem; }
.brand { display:flex; align-items:center; gap:.85rem; color:var(--navy-800); }
.brand:hover { text-decoration:none; }
.brand__text { display:flex; flex-direction:column; line-height:1.12; }
.brand__name { font-family:var(--font-display); font-weight:600; font-size:1.04rem; color:var(--navy-800); }
.brand__sigla { font-family:var(--font-body); font-weight:700; font-size:.72rem; letter-spacing:.32em; color:var(--gold); margin-top:.2rem; }

.site-nav { margin-left:auto; }
.site-nav__list { list-style:none; display:flex; gap:.35rem; padding:0; margin:0; }
.site-nav__list a {
  display:block; padding:.55rem .8rem; border-radius:var(--r-sm);
  color:var(--navy-700); font-weight:500; font-size:.95rem; letter-spacing:.005em;
}
.site-nav__list a:hover { background:var(--mist); color:var(--navy-800); text-decoration:none; }
.site-nav__list a.is-active { color:var(--navy-800); }
.site-nav__list a.is-active { box-shadow:inset 0 -2px 0 var(--gold); border-radius:0; }

.nav-toggle { display:none; align-items:center; gap:.55rem; margin-left:auto;
  background:var(--navy-800); color:#fff; border:0; border-radius:var(--r-sm);
  padding:.55rem .85rem; font:inherit; font-weight:600; font-size:.9rem; cursor:pointer; }
.nav-toggle__bars, .nav-toggle__bars::before, .nav-toggle__bars::after {
  content:""; display:block; width:18px; height:2px; background:#fff; position:relative; transition:.2s; }
.nav-toggle__bars::before { position:absolute; top:-6px; }
.nav-toggle__bars::after { position:absolute; top:6px; }

/* ----- Buttons ---------------------------------------------------------- */
.btn { display:inline-flex; align-items:center; gap:.5em; font-family:var(--font-body);
  font-weight:600; font-size:.97rem; line-height:1; padding:.85em 1.4em; border-radius:var(--r-pill);
  border:1.5px solid transparent; cursor:pointer; transition:.18s ease; text-decoration:none; }
.btn:hover { text-decoration:none; transform:translateY(-1px); }
.btn--primary { background:var(--gold); color:var(--navy-900); border-color:var(--gold); }
.btn--primary:hover { background:var(--gold-soft); color:var(--navy-900); box-shadow:var(--sh-2); }
.btn--solid { background:var(--navy-800); color:#fff; border-color:var(--navy-800); }
.btn--solid:hover { background:var(--navy-700); color:#fff; box-shadow:var(--sh-2); }
.btn--ghost { background:transparent; color:var(--navy-800); border-color:var(--line-strong); }
.btn--ghost:hover { border-color:var(--navy-700); background:var(--mist); color:var(--navy-800); }
.btn--on-dark { background:transparent; color:#fff; border-color:rgba(255,255,255,.4); }
.btn--on-dark:hover { background:rgba(255,255,255,.1); color:#fff; border-color:#fff; }
.btn--lg { font-size:1.02rem; padding:1em 1.7em; }
.btn-row { display:flex; flex-wrap:wrap; gap:.85rem; }

/* ----- Hero ------------------------------------------------------------- */
.hero { position:relative; color:#eaf1fb; overflow:hidden;
  background:
    radial-gradient(1200px 500px at 80% -10%, rgba(45,103,176,.55), transparent 60%),
    radial-gradient(900px 600px at 10% 110%, rgba(201,162,39,.18), transparent 55%),
    linear-gradient(180deg, var(--navy-900) 0%, var(--navy-800) 55%, var(--navy-700) 100%);
}
.hero::before { /* campo de estrellas */
  content:""; position:absolute; inset:0; opacity:.6; pointer-events:none;
  background-image:
    radial-gradient(1.4px 1.4px at 20% 30%, #fff, transparent),
    radial-gradient(1.2px 1.2px at 70% 20%, #fff, transparent),
    radial-gradient(1.6px 1.6px at 40% 70%, #fff, transparent),
    radial-gradient(1px 1px at 85% 60%, #fff, transparent),
    radial-gradient(1.3px 1.3px at 55% 45%, #fff, transparent),
    radial-gradient(1px 1px at 30% 85%, #fff, transparent),
    radial-gradient(1.2px 1.2px at 90% 35%, #fff, transparent);
  background-repeat:no-repeat;
}
.hero__inner { position:relative; text-align:center; padding-block:clamp(3.5rem, 8vw, 6rem);
  display:flex; flex-direction:column; align-items:center; gap:1.25rem; }
.hero__eyebrow { color:var(--gold-soft); font-weight:600; letter-spacing:.16em; text-transform:uppercase;
  font-size:.82rem; }
.hero h1 { color:#fff; font-size:clamp(2.1rem, 1.4rem + 3.4vw, 3.6rem); letter-spacing:-.015em; max-width:16ch; }
.hero__lead { color:#cad8ec; font-size:clamp(1.05rem, 1rem + .5vw, 1.28rem); max-width:60ch; }
.hero .btn-row { justify-content:center; margin-top:.6rem; }
.hero__rule { width:64px; height:3px; background:var(--gold); border-radius:2px; margin:.2rem 0; }

/* ----- Page hero (subpáginas) ------------------------------------------ */
.page-hero { background:
    radial-gradient(900px 400px at 85% -20%, rgba(45,103,176,.5), transparent 60%),
    linear-gradient(180deg, var(--navy-800), var(--navy-700));
  color:#eaf1fb; }
.page-hero__inner { padding-block:clamp(2.5rem, 5vw, 3.75rem); }
.page-hero h1 { color:#fff; font-size:clamp(1.9rem, 1.4rem + 2.2vw, 2.9rem); letter-spacing:-.01em; max-width:20ch; }
.page-hero__lead { color:#c4d2e6; max-width:62ch; margin-top:.85rem; font-size:1.08rem; }
.breadcrumb { font-size:.82rem; color:#9fb2cd; margin-bottom:.9rem; }
.breadcrumb a { color:#cfe; }
.breadcrumb a:hover { color:#fff; }

/* ----- Grids ------------------------------------------------------------ */
.grid { display:grid; gap:1.5rem; }
.grid--2 { grid-template-columns:repeat(2, 1fr); }
.grid--3 { grid-template-columns:repeat(3, 1fr); }
.grid--4 { grid-template-columns:repeat(4, 1fr); }
.grid--auto { grid-template-columns:repeat(auto-fit, minmax(255px, 1fr)); }

/* ----- Cards ------------------------------------------------------------ */
.card { background:var(--paper); border:1px solid var(--line); border-radius:var(--r-lg);
  padding:1.6rem 1.6rem; box-shadow:var(--sh-1); transition:.2s ease; height:100%; }
.card:hover { box-shadow:var(--sh-2); transform:translateY(-3px); border-color:var(--line-strong); }
.card__icon { width:46px; height:46px; display:grid; place-items:center; border-radius:12px;
  background:linear-gradient(160deg, var(--navy-700), var(--navy-600)); color:var(--gold-soft); margin-bottom:1rem; }
.card__icon svg { width:24px; height:24px; }
.card__kicker { font-size:.78rem; font-weight:700; letter-spacing:.1em; text-transform:uppercase; color:var(--gold); }
.card h3 { font-size:1.2rem; margin:.15rem 0 .5rem; }
.card p { color:var(--slate); font-size:.98rem; }
.card--pillar { border-top:3px solid var(--gold); }
.card--link { display:flex; flex-direction:column; }
.card--link .card__more { margin-top:auto; padding-top:.9rem; font-weight:600; color:var(--blue); font-size:.92rem; }
a.card { color:inherit; }
a.card:hover { text-decoration:none; }

/* ----- Stats ------------------------------------------------------------ */
.stats { display:grid; grid-template-columns:repeat(auto-fit, minmax(160px,1fr)); gap:1.5rem; }
.stat { text-align:center; padding:1.25rem 1rem; }
.stat__num { font-family:var(--font-display); font-weight:700; font-size:clamp(2rem, 1.4rem + 2vw, 2.9rem);
  color:var(--navy-800); line-height:1; }
.section--navy .stat__num { color:#fff; }
.stat__num span { color:var(--gold); }
.stat__label { margin-top:.5rem; font-size:.92rem; color:var(--muted); }
.section--navy .stat__label { color:#aebfd6; }

/* ----- Callout / quote -------------------------------------------------- */
.callout { background:var(--mist-2); border:1px solid var(--line); border-left:4px solid var(--gold);
  border-radius:var(--r); padding:1.4rem 1.6rem; }
.callout--navy { background:linear-gradient(160deg, var(--navy-800), var(--navy-700)); color:#dde7f4;
  border-color:transparent; border-left-color:var(--gold); }
.callout--navy strong { color:#fff; }
blockquote.quote { font-family:var(--font-display); font-size:1.2rem; color:var(--navy-700);
  font-style:italic; line-height:1.5; padding-left:1.2rem; border-left:3px solid var(--gold); }
blockquote.quote cite { display:block; font-style:normal; font-family:var(--font-body); font-size:.9rem;
  color:var(--muted); margin-top:.7rem; }

/* ----- Feature (texto + aside) ----------------------------------------- */
.feature { display:grid; grid-template-columns:1.15fr .85fr; gap:clamp(2rem,4vw,3.5rem); align-items:center; }
.feature--rev { grid-template-columns:.85fr 1.15fr; }
.feature__aside { background:linear-gradient(165deg, var(--navy-800), var(--navy-700)); color:#dde7f4;
  border-radius:var(--r-lg); padding:2rem; box-shadow:var(--sh-2); }
.feature__aside h3 { color:#fff; }

/* ----- Prose ------------------------------------------------------------ */
.prose { max-width:760px; }
.prose > * + * { margin-top:1.1rem; }
.prose h2 { font-size:1.6rem; margin-top:2.4rem; }
.prose h3 { font-size:1.25rem; margin-top:1.8rem; color:var(--navy-700); }
.prose p, .prose li { color:var(--slate); }
.prose ul { padding-left:1.2em; }
.prose li::marker { color:var(--gold); }

/* ----- Timeline --------------------------------------------------------- */
.timeline { position:relative; max-width:820px; }
.timeline::before { content:""; position:absolute; left:104px; top:6px; bottom:6px; width:2px;
  background:linear-gradient(var(--gold), var(--line)); }
.tl-item { position:relative; display:grid; grid-template-columns:88px 1fr; gap:1.6rem; padding-bottom:2rem; }
.tl-item:last-child { padding-bottom:0; }
.tl-year { font-family:var(--font-display); font-weight:700; color:var(--navy-800); font-size:1.05rem;
  text-align:right; padding-top:.1rem; }
.tl-body { position:relative; padding-left:1.7rem; }
.tl-body::before { content:""; position:absolute; left:-7px; top:7px; width:14px; height:14px;
  background:var(--paper); border:3px solid var(--gold); border-radius:50%; box-shadow:0 0 0 4px var(--mist-2); }
.tl-body h3 { font-size:1.12rem; margin-bottom:.3rem; }
.tl-body p { color:var(--slate); font-size:.97rem; }
.tl-item--major .tl-body::before { background:var(--gold); }

/* ----- People / autoridades -------------------------------------------- */
.people { display:grid; grid-template-columns:repeat(auto-fit, minmax(230px,1fr)); gap:1.2rem; }
.person { background:var(--paper); border:1px solid var(--line); border-radius:var(--r); padding:1.2rem 1.3rem; }
.person__role { font-size:.76rem; font-weight:700; letter-spacing:.08em; text-transform:uppercase; color:var(--gold); }
.person__name { font-family:var(--font-display); font-weight:600; font-size:1.1rem; color:var(--navy-800); margin:.25rem 0 .15rem; }
.person__meta { font-size:.9rem; color:var(--muted); }
.person--memoriam { background:var(--mist-2); border-style:dashed; }

/* ----- Link / network lists -------------------------------------------- */
.linklist { list-style:none; padding:0; display:grid; gap:.8rem; }
.linklist li { background:var(--paper); border:1px solid var(--line); border-radius:var(--r);
  padding:1rem 1.2rem; }
.linklist h3 { font-size:1.05rem; margin-bottom:.2rem; }
.linklist p { color:var(--slate); font-size:.93rem; }

/* ----- Tag / badge ------------------------------------------------------ */
.tag { display:inline-block; background:var(--gold-100); color:#8a6d12; font-weight:600;
  font-size:.74rem; letter-spacing:.06em; text-transform:uppercase; padding:.3em .7em; border-radius:var(--r-pill); }
.tag--soon { background:#e8eef7; color:var(--navy-600); }

/* ----- Forms ------------------------------------------------------------ */
.form { display:grid; gap:1.1rem; }
.field { display:grid; gap:.4rem; }
.field label { font-weight:600; font-size:.92rem; color:var(--navy-700); }
.field .req { color:var(--err-fg); }
.field input, .field textarea, .field select {
  font:inherit; color:var(--ink); background:var(--paper);
  border:1.5px solid var(--line-strong); border-radius:var(--r); padding:.75rem .9rem; width:100%; transition:.15s; }
.field input:focus, .field textarea:focus { border-color:var(--blue-light); outline:none;
  box-shadow:0 0 0 3px rgba(47,111,176,.15); }
.field textarea { min-height:150px; resize:vertical; }
.field__hint { font-size:.82rem; color:var(--muted); }
.form__note { font-size:.85rem; color:var(--muted); }
.alert { border-radius:var(--r); padding:1rem 1.2rem; font-size:.96rem; }
.alert--ok { background:var(--ok-bg); color:var(--ok-fg); border:1px solid #bfe2cd; }
.alert--err { background:var(--err-bg); color:var(--err-fg); border:1px solid #f0c4bf; }
.hp { position:absolute; left:-9999px; width:1px; height:1px; overflow:hidden; }

/* ----- Info cards (contacto) ------------------------------------------- */
.info-card { background:var(--paper); border:1px solid var(--line); border-radius:var(--r-lg); padding:1.6rem; box-shadow:var(--sh-1); }
.info-card h3 { font-size:1.1rem; margin-bottom:.5rem; }
.info-card p { color:var(--slate); font-size:.97rem; }
.map-embed { border:1px solid var(--line); border-radius:var(--r-lg); overflow:hidden; box-shadow:var(--sh-1); }
.map-embed iframe { width:100%; height:340px; border:0; display:block; }

/* ----- Footer ----------------------------------------------------------- */
.site-footer { background:var(--navy-900); color:#b9c7dc; margin-top:0; }
.footer__grid { display:grid; grid-template-columns:1.4fr 1fr 1fr 1.1fr; gap:2rem;
  padding-block:clamp(2.5rem,5vw,3.5rem); }
.footer__name { font-family:var(--font-display); color:#fff; font-weight:600; font-size:1.05rem; }
.footer__desc { font-size:.9rem; color:#9fb0c8; margin-top:.5rem; max-width:34ch; }
.footer__title { font-family:var(--font-body); font-size:.78rem; letter-spacing:.12em; text-transform:uppercase;
  color:var(--gold-soft); margin-bottom:.9rem; font-weight:700; }
.footer__col ul { list-style:none; padding:0; display:grid; gap:.5rem; }
.footer__col a { color:#c3d0e3; font-size:.93rem; }
.footer__col a:hover { color:#fff; }
.footer__col p { font-size:.92rem; color:#9fb0c8; }
.footer__bottom { border-top:1px solid rgba(255,255,255,.1); }
.footer__bottom-inner { display:flex; justify-content:space-between; gap:1rem; flex-wrap:wrap;
  padding-block:1.1rem; font-size:.83rem; color:#8194ae; }

/* ----- Responsive ------------------------------------------------------- */
@media (max-width:920px){
  .nav-toggle { display:inline-flex; }
  .site-nav { position:absolute; left:0; right:0; top:100%; background:#fff;
    border-bottom:1px solid var(--line); box-shadow:var(--sh-2);
    max-height:0; overflow:hidden; transition:max-height .28s ease; }
  .header__inner { position:relative; }
  .site-header.nav-open .site-nav { max-height:75vh; }
  .site-nav__list { flex-direction:column; gap:0; padding:.5rem var(--gutter) 1rem; }
  .site-nav__list a { padding:.8rem .4rem; border-bottom:1px solid var(--line); border-radius:0; }
  .site-nav__list a.is-active { box-shadow:inset 3px 0 0 var(--gold); }
  .site-header.nav-open .nav-toggle__bars { background:transparent; }
  .site-header.nav-open .nav-toggle__bars::before { transform:rotate(45deg); top:0; }
  .site-header.nav-open .nav-toggle__bars::after { transform:rotate(-45deg); top:0; }
  .feature, .feature--rev { grid-template-columns:1fr; }
  .grid--4 { grid-template-columns:repeat(2,1fr); }
}
@media (max-width:680px){
  .grid--2, .grid--3 { grid-template-columns:1fr; }
  .topbar__meta { display:none; }
  .brand__name { font-size:.96rem; }
  .timeline::before { left:0; }
  .tl-item { grid-template-columns:1fr; gap:.2rem; padding-left:1.7rem; }
  .tl-year { text-align:left; }
  .footer__grid { grid-template-columns:1fr 1fr; }
}
@media (max-width:480px){
  .grid--4 { grid-template-columns:1fr; }
  .footer__grid { grid-template-columns:1fr; }
  .footer__bottom-inner { flex-direction:column; gap:.3rem; }
}

/* ----- Animación de entrada -------------------------------------------- */
@media (prefers-reduced-motion:no-preference){
  .reveal { opacity:0; transform:translateY(16px); transition:opacity .6s ease, transform .6s ease; }
  .reveal.is-in { opacity:1; transform:none; }
}
