/* Menu movil comun a todo el sitio (site-nav.js lo construye).
   En escritorio no cambia nada: el boton y el panel solo aparecen por debajo de 760px. */
.nav-toggle{ display:none; }
.nav-drawer, .nav-backdrop{ display:none; }

@media (max-width:760px){
  /* Cabecera compacta: logo a la izquierda, boton de menu a la derecha */
  header.site .site-inner{ flex-wrap:nowrap; padding:10px 16px; gap:12px; }
  header.site .logo{ font-size:20px; }
  header.site .logo-mark{ width:28px; height:28px; }
  header.site .main-nav,
  header.site .header-cta,
  header.site .back-link{ display:none !important; }

  .nav-toggle{
    display:inline-flex; align-items:center; justify-content:center; gap:8px; flex:none;
    margin-left:auto; min-width:48px; height:44px; padding:0 14px;
    border:1.5px solid var(--ink-2, #0B2C28); border-radius:999px;
    background:transparent; color:var(--ink-2, #0B2C28);
    font:700 14px/1 'Public Sans', -apple-system, BlinkMacSystemFont, sans-serif;
    cursor:pointer; -webkit-tap-highlight-color:transparent;
  }
  .nav-toggle:active{ background:var(--ink-2, #0B2C28); color:#F1F4EF; }
  .nav-toggle-icon{ position:relative; width:18px; height:12px; }
  .nav-toggle-icon span{ position:absolute; left:0; width:100%; height:2px; border-radius:2px; background:currentColor; transition:transform .25s ease, opacity .2s ease; }
  .nav-toggle-icon span:nth-child(1){ top:0; }
  .nav-toggle-icon span:nth-child(2){ top:5px; }
  .nav-toggle-icon span:nth-child(3){ top:10px; }

  .nav-backdrop{
    display:block; position:fixed; inset:0; z-index:90;
    background:rgba(11,44,40,0.45); opacity:0; pointer-events:none; transition:opacity .25s ease;
  }
  .nav-drawer{
    display:flex; flex-direction:column; position:fixed; top:0; right:0; bottom:0; z-index:91;
    width:min(86vw, 340px); background:#F1F4EF; box-shadow:-12px 0 40px rgba(11,44,40,0.25);
    transform:translateX(100%); transition:transform .3s cubic-bezier(.2,.8,.2,1);
    overflow-y:auto; overscroll-behavior:contain; visibility:hidden;
  }
  html.nav-open .nav-backdrop{ opacity:1; pointer-events:auto; }
  html.nav-open .nav-drawer{ transform:translateX(0); visibility:visible; }
  html.nav-open, html.nav-open body{ overflow:hidden; }

  .nav-drawer-head{ display:flex; align-items:center; justify-content:space-between; padding:14px 16px 10px 22px; }
  .nav-drawer-title{ font:600 20px/1.2 'Fraunces', Georgia, serif; color:#0B2C28; }
  .nav-close{
    width:44px; height:44px; border:0; border-radius:50%; background:#E7EBE1; color:#0B2C28;
    font-size:26px; line-height:1; cursor:pointer; display:flex; align-items:center; justify-content:center;
  }
  .nav-list{ list-style:none; margin:0; padding:6px 12px 10px; }
  .nav-list a{
    display:flex; align-items:center; justify-content:space-between; gap:10px;
    min-height:50px; padding:10px 12px; border-radius:12px;
    font:700 16.5px/1.3 'Public Sans', -apple-system, BlinkMacSystemFont, sans-serif;
    color:#0B2C28; text-decoration:none;
  }
  .nav-list a:active, .nav-list a:hover{ background:#E7EBE1; }
  .nav-list a[aria-current="page"]{ background:#0B2C28; color:#F6F1E4; }
  .nav-list a .nav-arrow{ color:#895518; font-weight:700; }
  .nav-list a[aria-current="page"] .nav-arrow{ color:#EFDBAE; }
  .nav-expand{
    display:flex; align-items:center; justify-content:space-between; gap:10px; width:100%;
    min-height:50px; padding:10px 12px; border:0; border-radius:12px; background:transparent; cursor:pointer;
    font:700 16.5px/1.3 'Public Sans', -apple-system, BlinkMacSystemFont, sans-serif; color:#0B2C28; text-align:left;
    -webkit-tap-highlight-color:transparent;
  }
  .nav-expand:active, .nav-expand:hover{ background:#E7EBE1; }
  .nav-chev{ color:#895518; font-weight:700; font-size:20px; line-height:1; transition:transform .2s ease; }
  .nav-parent.is-open .nav-chev{ transform:rotate(90deg); }
  .nav-children{ list-style:none; margin:0 0 6px 12px; padding:0 0 0 8px; border-left:2px solid #E7EBE1; }
  .nav-children[hidden]{ display:none; }
  .nav-group-label{ margin:14px 12px 4px; font:700 12.5px/1.2 'Public Sans', sans-serif; letter-spacing:.06em; text-transform:uppercase; color:#4B5D58; }
  .nav-list .nav-sub a{ min-height:54px; font-weight:600; font-size:16px; }
  .nav-sub small{ display:block; font-weight:500; font-size:13.5px; color:#4B5D58; margin-top:2px; }
  .nav-list a[aria-current="page"] small{ color:#CFE3DC; }
  .nav-drawer-cta{ margin:auto 22px 26px; padding-top:14px; }
  .nav-drawer-cta a{
    display:flex; align-items:center; justify-content:center; min-height:52px; border-radius:999px;
    background:#D98E3B; color:#241300; font:700 16px/1 'Public Sans', sans-serif; text-decoration:none;
  }
}
@media (max-width:760px) and (prefers-reduced-motion: reduce){
  .nav-drawer, .nav-backdrop{ transition:none; }
}

/* ---------- Comodidad tactil en movil (todo el sitio) ---------- */
@media (max-width:760px){
  html{ -webkit-text-size-adjust:100%; }
  /* Enlaces del pie: zona de pulsacion de al menos 40px */
  footer .foot-links{ gap:4px 18px !important; }
  footer .foot-links a{ display:inline-flex; align-items:center; min-height:40px; }
  /* "Leer mas" de los avisos legales del pie */
  .legal-more summary{ display:inline-block; padding:8px 0; }
  /* Etiquetas de oferta de la tienda (son enlaces) */
  a.prod-discount{ padding:8px 14px !important; }
  /* Boton de cerrar del pop-up de la newsletter */
  .newsletter-popup-close{ width:44px !important; height:44px !important; font-size:22px !important; top:10px !important; right:10px !important; }
  /* Enlace "Mas informacion" de la barra de aviso */
  .disclosure-bar a{ display:inline-block; padding:4px 0; }
  /* Volver al blog al final de cada articulo */
  .article-back a{ display:inline-flex; align-items:center; min-height:44px; }
}