/* pomada.net — hoja de estilos única. Sin fuentes externas, sin imágenes, sin JS.
   Paleta: verde farmacia, tinta, papel, menta, ámbar (avisos de receta). */
:root{
  --verde:#0E7A54;
  --verde-osc:#0A5C40;
  --tinta:#1A2620;
  --gris:#4A5A52;
  --papel:#F7FAF7;
  --menta:#DFF0E6;
  --linea:#CFE0D6;
  --ambar-txt:#7A4E00;
  --ambar-bg:#FFF3D6;
  --blanco:#FFFFFF;
  --serif:Georgia,'Times New Roman',serif;
  --sans:system-ui,-apple-system,'Segoe UI',Roboto,Ubuntu,sans-serif;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;font-family:var(--sans);font-size:1.0625rem;line-height:1.65;color:var(--tinta);background:var(--papel)}
img,svg{max-width:100%;height:auto}
a{color:var(--verde-osc);text-underline-offset:2px}
a:hover{color:var(--verde)}
:focus-visible{outline:3px solid var(--verde);outline-offset:2px;border-radius:2px}
.contenedor{max-width:68rem;margin:0 auto;padding:0 1.25rem}

/* Cabecera */
.cabecera{background:var(--blanco);border-bottom:3px solid var(--verde)}
.cabecera-int{display:flex;flex-wrap:wrap;align-items:center;gap:.75rem 1.5rem;padding:.9rem 0}
.logo{display:flex;align-items:center;gap:.55rem;text-decoration:none;color:var(--tinta);font-family:var(--serif);font-size:1.45rem;font-weight:700;letter-spacing:-.01em}
.logo .cruz{color:var(--verde);flex:none}
.logo span b{color:var(--verde-osc)}
.nav{display:flex;flex-wrap:wrap;gap:.15rem .35rem;padding:0 0 .8rem;margin-left:auto}
.nav a{font-size:.9rem;text-decoration:none;color:var(--gris);padding:.35rem .6rem;border-radius:999px}
.nav a:hover,.nav a[aria-current="page"]{background:var(--menta);color:var(--verde-osc)}

/* Migas */
.migas{font-size:.85rem;color:var(--gris);padding:1rem 0 0}
.migas ol{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:.35rem}
.migas li+li::before{content:"›";margin-right:.35rem;color:var(--linea)}
.migas a{color:var(--gris)}

/* Tipografía */
h1,h2,h3{font-family:var(--serif);line-height:1.2;color:var(--tinta);text-wrap:balance}
h1{font-size:clamp(1.9rem,4.5vw,2.7rem);margin:.9rem 0 .6rem;letter-spacing:-.015em}
h2{font-size:clamp(1.35rem,3vw,1.7rem);margin:2.4rem 0 .7rem;padding-top:1.1rem;border-top:2px solid var(--verde)}
h3{font-size:1.15rem;margin:1.5rem 0 .4rem}
.entradilla{font-size:1.15rem;color:var(--gris);max-width:52rem;margin:0 0 1.2rem}
.etiqueta{font-family:var(--sans);font-size:.75rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--verde-osc)}

/* Sello de dispensación */
.sello{display:inline-block;font-size:.72rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;padding:.15rem .55rem;border-radius:3px}
.sello.receta{background:var(--ambar-bg);color:var(--ambar-txt);border:1px solid #E8C87E}
.sello.libre{background:var(--menta);color:var(--verde-osc);border:1px solid var(--linea)}

/* Rejillas de tarjetas */
.rejilla{display:grid;gap:.9rem;grid-template-columns:repeat(auto-fill,minmax(15rem,1fr));padding:0;margin:1.2rem 0;list-style:none}
.tarjeta{background:var(--blanco);border:1px solid var(--linea);border-radius:8px;padding:1rem 1.1rem}
.tarjeta h3{margin:0 0 .25rem;font-size:1.05rem}
.tarjeta h3 a{text-decoration:none}
.tarjeta h3 a:hover{text-decoration:underline}
.tarjeta p{margin:.25rem 0 .5rem;font-size:.9rem;color:var(--gris)}
.tarjeta.hub{border-left:4px solid var(--verde)}

/* Listas de enlaces (índices de páginas) */
.indice{columns:2;column-gap:2.5rem;padding-left:1.2rem;margin:.8rem 0 1.4rem}
.indice li{break-inside:avoid;margin:.25rem 0}
@media (max-width:40rem){.indice{columns:1}}

/* Cajas prospecto */
.prospecto{background:var(--blanco);border:1px solid var(--linea);border-left:5px solid var(--verde);border-radius:6px;padding:1rem 1.2rem;margin:1.4rem 0}
.prospecto .etiqueta{display:block;margin-bottom:.3rem}
.aviso{background:var(--ambar-bg);border:1px solid #E8C87E;border-radius:6px;padding:.9rem 1.1rem;margin:1.4rem 0;font-size:.95rem;color:var(--ambar-txt)}
.aviso strong{color:inherit}

/* Tablas */
.tabla-envoltura{overflow-x:auto;margin:1.2rem 0}
table{border-collapse:collapse;width:100%;background:var(--blanco);font-size:.95rem}
th,td{border:1px solid var(--linea);padding:.55rem .7rem;text-align:left;vertical-align:top}
th{background:var(--menta);font-family:var(--sans);font-size:.85rem;letter-spacing:.03em}

/* FAQ */
details{background:var(--blanco);border:1px solid var(--linea);border-radius:6px;margin:.5rem 0;padding:.2rem .9rem}
summary{cursor:pointer;font-weight:600;padding:.55rem 0}
details[open] summary{color:var(--verde-osc)}
details p{margin:.2rem 0 .8rem}

/* Pie */
.pie{margin-top:3.5rem;background:var(--tinta);color:#C7D4CC;font-size:.9rem}
.pie a{color:#DDEAE2}
.pie-int{display:grid;gap:1.6rem;grid-template-columns:repeat(auto-fit,minmax(13rem,1fr));padding:2.2rem 0 1.4rem}
.pie h2{border:0;margin:0 0 .5rem;padding:0;font-size:1rem;color:var(--blanco);font-family:var(--sans)}
.pie ul{list-style:none;margin:0;padding:0}
.pie li{margin:.3rem 0}
.pie-legal{border-top:1px solid #33443B;padding:1rem 0 1.6rem}
.pie-legal p{margin:.4rem 0}

@media print{.cabecera,.pie,.nav{display:none}}