/* ═══════════════════════════════════════════════════════════════════════════
   Chrome compartido — header / footer / drawer del sitio IHM
   ─────────────────────────────────────────────────────────────────────────
   Usado por todas las páginas EXCEPTO /cuerpo/index.html y /en/body/index.html
   que tienen diseño propio.
   ═══════════════════════════════════════════════════════════════════════ */

:root{
  --ihm-purple:#1E1148;
  --ihm-purple-darker:#150B33;
  --ihm-lavender:#5B3FD9;
  --ihm-lavender-soft:#EEE9F7;
  --ihm-amber:#F59E0B;
  --ihm-cream:#F0EEE9;
  --ihm-white:#FFFFFF;
  --ihm-text-dark:#1E1148;
  --ihm-text-body:#3A3340;
  --ihm-text-muted:#6B6680;
  --ihm-border:rgba(30,17,72,.10);
  --ihm-font-serif:'DM Serif Display', Georgia, 'Times New Roman', serif;
  --ihm-font-sans:'DM Sans', system-ui, -apple-system, 'Segoe UI', sans-serif;
  --ihm-font-mono:'JetBrains Mono', ui-monospace, 'SF Mono', Menlo, monospace;
  --ihm-container:1240px;
}

/* ─────────────────────────────────────────────────────────────────────────
   HEADER
   ───────────────────────────────────────────────────────────────────── */
.ihm-header{
  position:sticky; top:0; left:0; right:0; z-index:100;
  background:rgba(255,255,255,.92);
  backdrop-filter:saturate(1.2) blur(10px);
  -webkit-backdrop-filter:saturate(1.2) blur(10px);
  border-bottom:1px solid var(--ihm-border);
  font-family:var(--ihm-font-sans);
}
.ihm-header__inner{
  max-width:var(--ihm-container);
  margin:0 auto;
  padding:14px 28px;
  display:flex; align-items:center; justify-content:space-between; gap:24px;
}
.ihm-header__logo{
  display:inline-flex; align-items:center; gap:10px;
  text-decoration:none; color:var(--ihm-purple);
  font-family:var(--ihm-font-serif); font-size:17px; line-height:1; font-weight:400;
}
.ihm-header__logo img{ height:28px; width:auto; display:block; }
.ihm-header__logo em{ color:var(--ihm-lavender); font-style:italic; }
.ihm-header__nav{
  display:flex; align-items:center; gap:28px;
  font-family:var(--ihm-font-mono);
  font-size:11px; letter-spacing:.16em; text-transform:uppercase;
}
.ihm-header__nav a:not(.ihm-lang__btn){
  color:var(--ihm-text-muted); text-decoration:none;
  transition:color .15s ease;
}
.ihm-header__nav a:not(.ihm-lang__btn):hover{ color:var(--ihm-purple); }
.ihm-header__nav a:not(.ihm-lang__btn).is-active{ color:var(--ihm-purple); }

/* Pill ES/EN: pill oscura con letra blanca en activo */
.ihm-lang{
  display:inline-flex; align-items:stretch;
  background:rgba(30,17,72,.06);
  border:1px solid var(--ihm-border);
  border-radius:999px;
  padding:3px;
  font-family:var(--ihm-font-mono);
  font-size:11px; letter-spacing:.1em;
}
.ihm-lang__btn{
  display:inline-flex; align-items:center; justify-content:center;
  padding:6px 14px;
  border-radius:999px;
  color:var(--ihm-text-muted);
  text-decoration:none;
  font-weight:500;
  transition:background .18s ease, color .18s ease;
}
.ihm-lang__btn:hover{ color:var(--ihm-purple); }
.ihm-lang__btn[aria-pressed="true"]{
  background:var(--ihm-purple);
  color:var(--ihm-white);
}

/* Hamburger (mobile only) */
.ihm-burger{
  display:none;
  position:relative;
  width:42px; height:42px;
  border:1px solid var(--ihm-border);
  background:transparent;
  border-radius:10px;
  cursor:pointer;
  padding:0;
}
.ihm-burger .bar{
  position:absolute; left:50%; transform:translateX(-50%);
  width:18px; height:1.6px;
  background:var(--ihm-purple);
  border-radius:2px;
  transition:transform .25s ease, top .25s ease, opacity .15s ease, width .25s ease;
}
.ihm-burger .bar:nth-child(1){ top:15px; }
.ihm-burger .bar:nth-child(2){ top:24px; }

/* ─────────────────────────────────────────────────────────────────────────
   MOBILE DRAWER
   ───────────────────────────────────────────────────────────────────── */
.ihm-drawer{
  position:fixed; inset:0; z-index:1000;
  display:none;
  background:rgba(15,8,40,.55);
  backdrop-filter:blur(4px);
  -webkit-backdrop-filter:blur(4px);
  animation:ihmDrawerFade .2s ease both;
}
.ihm-drawer.is-open{ display:block; }
.ihm-drawer__panel{
  position:absolute; inset:0;
  background:var(--ihm-white);
  padding:24px 28px 36px;
  overflow-y:auto;
  display:flex; flex-direction:column;
  animation:ihmDrawerIn .26s ease both;
}
.ihm-drawer__top{
  display:flex; align-items:center; justify-content:space-between;
  margin-bottom:36px;
}
.ihm-drawer__brand{
  display:inline-flex; align-items:center; gap:10px;
  font-family:var(--ihm-font-serif); font-size:16px; color:var(--ihm-purple);
  text-decoration:none;
}
.ihm-drawer__brand img{ height:26px; width:auto; }
.ihm-drawer__close{
  width:42px; height:42px;
  border:1px solid var(--ihm-border);
  background:transparent;
  border-radius:10px;
  cursor:pointer; padding:0;
  position:relative;
}
.ihm-drawer__close::before,
.ihm-drawer__close::after{
  content:""; position:absolute; left:50%; top:50%;
  width:18px; height:1.6px;
  background:var(--ihm-purple);
  border-radius:2px;
  transform-origin:center;
}
.ihm-drawer__close::before{ transform:translate(-50%,-50%) rotate(45deg); }
.ihm-drawer__close::after{  transform:translate(-50%,-50%) rotate(-45deg); }

.ihm-drawer__nav{
  list-style:none; padding:0; margin:0 0 36px;
  display:flex; flex-direction:column; gap:2px;
}
.ihm-drawer__nav a{
  display:flex; align-items:baseline; justify-content:space-between; gap:18px;
  padding:12px 4px;
  font-family:var(--ihm-font-serif); font-size:22px; line-height:1.15;
  color:var(--ihm-purple); text-decoration:none;
  border-bottom:1px solid rgba(30,17,72,.06);
  transition:color .2s ease, padding-left .2s ease;
}
.ihm-drawer__nav a:hover,
.ihm-drawer__nav a:focus-visible{ color:var(--ihm-lavender); padding-left:6px; outline:none; }
.ihm-drawer__nav .arr{
  font-family:var(--ihm-font-mono); font-size:14px;
  color:var(--ihm-lavender);
}

.ihm-drawer__lang{
  margin-top:auto; padding-top:28px;
  border-top:1px solid var(--ihm-border);
}
.ihm-drawer__lang-label{
  display:block;
  font-family:var(--ihm-font-mono);
  font-size:10px; letter-spacing:.2em; text-transform:uppercase;
  color:var(--ihm-text-muted);
  margin-bottom:14px;
}
.ihm-drawer__lang-row{
  display:flex; gap:10px;
}
.ihm-drawer__lang-row a{
  flex:1;
  display:inline-flex; align-items:center; justify-content:center;
  padding:13px 18px;
  border:1px solid var(--ihm-border);
  border-radius:999px;
  font-family:var(--ihm-font-mono); font-size:11px; letter-spacing:.16em;
  text-transform:uppercase;
  color:var(--ihm-text-body);
  text-decoration:none;
  transition:background .18s ease, color .18s ease, border-color .18s ease;
}
.ihm-drawer__lang-row a:hover{ border-color:var(--ihm-purple); }
.ihm-drawer__lang-row a[aria-pressed="true"]{
  background:var(--ihm-purple);
  border-color:var(--ihm-purple);
  color:var(--ihm-white);
}

body.ihm-menu-open{ overflow:hidden; }

/* ─────────────────────────────────────────────────────────────────────────
   FOOTER
   ───────────────────────────────────────────────────────────────────── */
.ihm-footer{
  background:var(--ihm-purple);
  color:rgba(255,255,255,.78);
  font-family:var(--ihm-font-sans);
  font-size:14px;
  line-height:1.6;
  padding:56px 0 32px;
  margin-top:80px;
}
.ihm-footer__inner{
  max-width:var(--ihm-container);
  margin:0 auto;
  padding:0 28px;
}
.ihm-footer__grid{
  display:grid;
  grid-template-columns:1.2fr 1fr 1fr;
  gap:48px;
  margin-bottom:40px;
}
.ihm-footer__col h4{
  font-family:var(--ihm-font-mono);
  font-size:11px;
  letter-spacing:.18em;
  text-transform:uppercase;
  color:rgba(255,255,255,.5);
  font-weight:500;
  margin:0 0 18px;
}
.ihm-footer__col ul{
  list-style:none; padding:0; margin:0;
  display:flex; flex-direction:column; gap:10px;
}
.ihm-footer__col a{
  color:rgba(255,255,255,.85);
  text-decoration:none;
  transition:color .15s ease;
}
.ihm-footer__col a:hover{ color:var(--ihm-amber); }

.ihm-footer__identity{
  display:flex; flex-direction:column; gap:14px;
}
.ihm-footer__logo{
  display:inline-flex; align-items:center; gap:10px;
}
.ihm-footer__logo img{
  height:32px; width:auto;
  filter:brightness(0) invert(1);
}
.ihm-footer__name{
  font-family:var(--ihm-font-serif);
  font-size:18px;
  color:var(--ihm-white);
  margin:0;
  line-height:1.2;
}
.ihm-footer__desc{
  font-size:14px;
  color:rgba(255,255,255,.7);
  margin:0;
  max-width:300px;
}

.ihm-footer__divider{
  border:none;
  height:1px;
  background:rgba(255,255,255,.12);
  margin:0 0 24px;
}
.ihm-footer__bottom p{
  margin:0 0 12px;
  font-size:13px;
  color:rgba(255,255,255,.62);
  line-height:1.55;
}
.ihm-footer__bottom p:first-child{
  font-family:var(--ihm-font-mono);
  font-size:11px;
  letter-spacing:.08em;
}
.ihm-footer__bottom a{
  color:rgba(255,255,255,.85);
  text-decoration:none;
}
.ihm-footer__bottom a:hover{ color:var(--ihm-amber); }
.ihm-footer__bottom .disclaimer{
  font-size:12.5px;
  color:rgba(255,255,255,.55);
  font-style:italic;
  max-width:760px;
}

/* ─────────────────────────────────────────────────────────────────────────
   RESPONSIVE: mobile < 768px
   ───────────────────────────────────────────────────────────────────── */
@media (max-width: 767px){
  .ihm-header__inner{ padding:12px 18px; gap:12px; }
  .ihm-header__logo{ font-size:15px; }
  .ihm-header__logo img{ height:26px; }
  .ihm-header__nav{ display:none; }
  .ihm-burger{ display:inline-block; }

  .ihm-footer{ padding:48px 0 28px; margin-top:56px; }
  .ihm-footer__inner{ padding:0 22px; }
  .ihm-footer__grid{
    grid-template-columns:1fr;
    gap:36px;
    margin-bottom:32px;
  }
  .ihm-footer__name{ font-size:17px; }
  .ihm-footer__desc{ max-width:none; font-size:13.5px; }
  .ihm-footer__bottom p{ font-size:12.5px; }
  .ihm-footer__bottom .disclaimer{ font-size:12px; }
}

/* ─────────────────────────────────────────────────────────────────────────
   ANIMATIONS
   ───────────────────────────────────────────────────────────────────── */
@keyframes ihmDrawerFade{
  from{ opacity:0; } to{ opacity:1; }
}
@keyframes ihmDrawerIn{
  from{ opacity:0; transform:translateY(-6px); }
  to{ opacity:1; transform:none; }
}

/* ─────────────────────────────────────────────────────────────────────────
   PRINT
   ───────────────────────────────────────────────────────────────────── */
@media print{
  .ihm-header, .ihm-drawer{ display:none !important; }
  .ihm-footer{ background:transparent; color:#000; padding:24px 0; }
}

/* ─────────────────────────────────────────────────────────────────────────
   DOSE CONTEXT CALLOUT — auto-inyectado por chrome.js en artículos
   con sección de protocolo / pasos. Aclara que los volúmenes son
   mínimos estudiados, no un techo.
   ───────────────────────────────────────────────────────────────────── */
.ihm-dose-note{
  margin:32px 0;
  padding:22px 24px;
  border-radius:14px;
  background:linear-gradient(135deg, rgba(245,158,11,.08), rgba(91,63,217,.05));
  border:1px solid rgba(91,63,217,.18);
  border-left:3px solid var(--ihm-lavender);
  font-family:var(--ihm-font-sans);
  color:var(--ihm-text-body);
}
.ihm-dose-note__label{
  display:inline-block;
  font-family:var(--ihm-font-mono);
  font-size:11px;
  letter-spacing:.18em;
  text-transform:uppercase;
  color:var(--ihm-lavender);
  margin-bottom:10px;
  font-weight:500;
}
.ihm-dose-note__title{
  font-family:var(--ihm-font-serif);
  font-size:22px;
  line-height:1.2;
  color:var(--ihm-purple);
  margin:0 0 10px;
  font-weight:400;
}
.ihm-dose-note__body{
  font-size:15.5px;
  line-height:1.6;
  margin:0;
}
.ihm-dose-note__body strong{ color:var(--ihm-purple); font-weight:600; }
@media (max-width: 767px){
  .ihm-dose-note{
    margin:26px -6px;
    padding:18px 18px;
  }
  .ihm-dose-note__title{ font-size:19px; }
  .ihm-dose-note__body{ font-size:16px; line-height:1.55; }
  .ihm-dose-note__label{ font-size:11.5px; letter-spacing:.16em; }
}
