/* Encabezado global de AgroWin® (plantillas/header-agrowin/header.html).
   Independiente de la hoja de cada página: define sus colores y su contenedor,
   y neutraliza estilos heredados (Bootstrap y el reset de las páginas antiguas) dentro de .awh.
   La fuente Open Sans (400, 600 y 700) se carga desde el <head> de la página (ver header.html). */

.awh {
  --awh-green: #83CC5F; --awh-btn: #A2D985; --awh-btn-hover: #B3E09C; --awh-green-hover: #6AB23B;
  --awh-pale: #CFE2C7; --awh-deep: #1A630F; --awh-navy: #1B1E35; --awh-text: #4F505C;
  --awh-line: #E4E8F2; --awh-line-soft: #EEF2F7; --awh-bg-soft: #F9FAFC; --awh-r: 10px; --awh-r-xl: 24px;
  position: sticky; top: 0; z-index: 50; width: 100%; margin: 0; padding: 0; border: 0;
  background: var(--awh-green); font-family: 'Open Sans', system-ui, sans-serif; font-size: 16px; text-align: left;
  -webkit-font-smoothing: antialiased;
}
/* Páginas antiguas: el contenido ya deja espacio para un menú fijo */
.awh.awh--fijo { position: fixed; left: 0; right: 0; }
.awh *, .awh *::before, .awh *::after { box-sizing: border-box; line-height: normal; }
.awh a, .awh a:hover, .awh a:focus { text-decoration: none; }
.awh img { display: block; max-width: 100%; border: 0; }
.awh button { font-family: inherit; margin: 0; }

.awh__in { display: flex; align-items: center; gap: 28px; width: 90%; max-width: 1400px; margin: 0 auto; padding: 12px 0; }
.awh__logo { flex: none; display: block; }
.awh__logo img { height: 40px; width: auto; }

/* Menú */
.awh__nav { display: flex; gap: 4px; margin: 0 0 0 auto; padding: 0; }
.awh__i { position: relative; }
.awh .awh__i > a { display: block; padding: 10px 13px; font-weight: 600; font-size: 14.5px; color: #fff; border-radius: var(--awh-r); }
.awh .awh__i > a:hover, .awh .awh__i:focus-within > a { background: rgba(255,255,255,.3); color: var(--awh-navy); }
.awh__dd { position: absolute; top: 100%; left: 0; min-width: 200px; padding: 8px; background: #fff; border: 1px solid var(--awh-line);
  border-radius: var(--awh-r); box-shadow: 0 12px 32px rgba(27,30,53,.12); opacity: 0; visibility: hidden; transform: translateY(6px); transition: .18s; }
.awh__i:hover .awh__dd, .awh__i:focus-within .awh__dd { opacity: 1; visibility: visible; transform: none; }
.awh .awh__dd a { display: block; padding: 9px 12px; font-size: 14px; font-weight: 400; color: var(--awh-text); border-radius: 8px; }
.awh .awh__dd a:hover { background: var(--awh-bg-soft); color: var(--awh-deep); }

/* Botón del menú: verde más claro sobre el verde del menú */
.awh .awh__cta { flex: none; display: inline-flex; align-items: center; justify-content: center; padding: 10px 22px; border-radius: 999px;
  background: var(--awh-btn); color: #fff; font-weight: 600; font-size: 15px; transition: background .15s; }
.awh .awh__cta:hover { background: var(--awh-btn-hover); color: #fff; }

.awh .awh__burger { display: none; margin-left: auto; width: 42px; height: 42px; padding: 0; border: 1px solid rgba(255,255,255,.7); background: #fff;
  border-radius: var(--awh-r); cursor: pointer; }
.awh__burger span, .awh__burger span::before, .awh__burger span::after { display: block; width: 18px; height: 2px; background: var(--awh-navy);
  margin: 0 auto; position: relative; content: ""; }
.awh__burger span::before { position: absolute; top: -6px; } .awh__burger span::after { position: absolute; top: 6px; }
.awh .awh__cta:focus-visible, .awh__burger:focus-visible, .awh .awh__btn:focus-visible { outline: none; box-shadow: 0 0 0 3px rgba(26,99,15,.3); }

/* ===== Menú hamburguesa: panel lateral en tabletas, portátiles pequeños y celulares ===== */
.awh__head, .awh__foot, .awh__overlay { display: none; }
@media (max-width: 1279px) {
  .awh .awh__cta { display: none; }
  .awh .awh__burger { display: block; }
  .awh.is-open { z-index: 1000; }
  html.awh-open { overflow: hidden; }

  .awh__nav { position: fixed; top: 0; right: 0; bottom: 0; z-index: 2; width: min(380px, 88vw); margin: 0;
    display: flex; flex-direction: column; gap: 0; background: #fff; overflow-y: auto; overscroll-behavior: contain;
    box-shadow: -24px 0 60px rgba(9,81,13,.22); border-radius: var(--awh-r-xl) 0 0 var(--awh-r-xl);
    transform: translateX(105%); visibility: hidden; transition: transform .38s cubic-bezier(.22,.8,.3,1), visibility 0s linear .38s; }
  .awh.is-open .awh__nav { transform: none; visibility: visible; transition: transform .38s cubic-bezier(.22,.8,.3,1); }

  .awh__overlay { display: block; position: fixed; inset: 0; z-index: 1; background: rgba(9,81,13,.38); backdrop-filter: blur(3px);
    opacity: 0; visibility: hidden; transition: opacity .3s ease, visibility 0s linear .3s; }
  .awh.is-open .awh__overlay { opacity: 1; visibility: visible; transition: opacity .3s ease; }

  /* Encabezado del panel */
  .awh__head { display: flex; align-items: center; justify-content: space-between; flex: none; padding: 18px 20px;
    background: var(--awh-green); border-radius: var(--awh-r-xl) 0 0 0; }
  .awh__head img { height: 34px; width: auto; }
  .awh__close { position: relative; width: 40px; height: 40px; padding: 0; border: 0; border-radius: var(--awh-r); background: #fff; cursor: pointer;
    box-shadow: 0 4px 12px rgba(9,81,13,.18); transition: transform .2s; }
  .awh__close:hover { transform: rotate(90deg); }
  .awh__close::before, .awh__close::after { content: ""; position: absolute; left: 11px; top: 19px; width: 18px; height: 2px; border-radius: 2px; background: var(--awh-navy); }
  .awh__close::before { transform: rotate(45deg); } .awh__close::after { transform: rotate(-45deg); }

  /* Opciones y submenús desplegables */
  .awh__i { margin: 0 20px; border-bottom: 1px solid var(--awh-line-soft); opacity: 0; transform: translateX(16px); transition: opacity .3s ease, transform .3s ease; }
  .awh.is-open .awh__i { opacity: 1; transform: none; }
  .awh.is-open .awh__i:nth-of-type(2) { transition-delay: .08s; } .awh.is-open .awh__i:nth-of-type(3) { transition-delay: .12s; }
  .awh.is-open .awh__i:nth-of-type(4) { transition-delay: .16s; } .awh.is-open .awh__i:nth-of-type(5) { transition-delay: .2s; }
  .awh.is-open .awh__i:nth-of-type(6) { transition-delay: .24s; } .awh.is-open .awh__i:nth-of-type(7) { transition-delay: .28s; }
  .awh .awh__i > a { display: flex; align-items: center; justify-content: space-between; padding: 16px 6px; font-size: 16px; font-weight: 700;
    color: var(--awh-navy); background: none; border-radius: 0; }
  .awh .awh__i > a:hover, .awh .awh__i.is-open > a, .awh .awh__i:focus-within > a { color: var(--awh-deep); background: none; }
  .awh__i.has-dd > a::after { content: ""; width: 8px; height: 8px; margin-right: 4px; border-right: 2px solid currentColor; border-bottom: 2px solid currentColor;
    transform: rotate(45deg) translateY(-3px); transition: transform .25s ease; }
  .awh__i.is-open > a::after { transform: rotate(-135deg) translateY(-2px); }
  .awh__dd, .awh__i:hover .awh__dd, .awh__i:focus-within .awh__dd { position: static; min-width: 0; padding: 0; border: 0; border-radius: 0; box-shadow: none;
    background: none; opacity: 1; visibility: visible; transform: none; max-height: 0; overflow: hidden; transition: max-height .3s ease, padding .3s ease; }
  .awh__i.is-open .awh__dd { max-height: 320px; padding: 0 0 12px; }
  .awh .awh__dd a { margin: 2px 0 2px 6px; padding: 10px 14px; font-size: 15px; color: var(--awh-text); border-left: 2px solid var(--awh-pale); border-radius: 0 var(--awh-r) var(--awh-r) 0; }
  .awh .awh__dd a:hover { background: #EEF7E8; color: var(--awh-deep); border-left-color: var(--awh-green); }

  /* Pie del panel */
  .awh__foot { display: flex; flex-direction: column; gap: 12px; margin-top: auto; padding: 24px 20px; background: var(--awh-bg-soft); }
  .awh .awh__btn { display: flex; align-items: center; justify-content: center; width: 100%; padding: 14px 26px; border-radius: 999px;
    background: var(--awh-green); color: #fff; font-weight: 700; font-size: 16px; box-shadow: 0 8px 20px rgba(131,204,95,.35); transition: background .15s; }
  .awh .awh__btn:hover { background: var(--awh-green-hover); color: #fff; }
  .awh .awh__wa { display: block; text-align: center; font-size: 14px; font-weight: 600; color: var(--awh-deep); }
  .awh .awh__wa:hover { text-decoration: underline; color: var(--awh-deep); }
}
@media (prefers-reduced-motion: reduce) { .awh__nav, .awh__overlay, .awh__i { transition: none !important; } }
