/* =========================================================
   EVLI CLEAN HEADER HERO
   Fuente única final para header/hero desktop.
   No usa márgenes negativos agresivos.
========================================================= */

@media (min-width: 921px){

  :root{
    --evli-green:#063f2d;
    --evli-green-2:#087a58;
    --evli-gold:#e3bf4f;
    --evli-gold-2:#f3d86b;
    --evli-cream:#f7f1e6;
    --evli-paper:#fffdf8;
  }

  html,
  body{
    background:#f7f1e6 !important;
  }

  body::before,
  body::after,
  .v16-shell::before,
  .v16-shell::after,
  .v16-page-shell::before,
  .v16-page-shell::after,
  .page-shell::before,
  .page-shell::after{
    display:none !important;
    content:none !important;
  }

  .v16-shell,
  .v16-page-shell,
  .page-shell{
    border-top:0 !important;
    overflow:visible !important;
  }

  body .site-header,
  body .evli-desktop-header{
    width:min(1160px, calc(100% - 72px)) !important;
    min-height:68px !important;
    margin:20px auto 12px !important;
    padding:10px 16px !important;
    border-radius:26px !important;
    background:rgba(255,253,248,.97) !important;
    border:1px solid rgba(6,63,45,.09) !important;
    box-shadow:
      0 14px 42px rgba(6,63,45,.10),
      inset 0 1px 0 rgba(255,255,255,.85) !important;
    display:grid !important;
    grid-template-columns:178px minmax(480px,1fr) 292px !important;
    align-items:center !important;
    gap:16px !important;
    position:relative !important;
    z-index:1000 !important;
    backdrop-filter:blur(16px) !important;
  }

  body .site-header .brand,
  body .evli-desktop-header .brand{
    width:178px !important;
    min-width:178px !important;
    max-width:178px !important;
    height:54px !important;
    display:flex !important;
    align-items:center !important;
    justify-content:flex-start !important;
    text-decoration:none !important;
    overflow:visible !important;
  }

  body .site-header .brand img,
  body .evli-desktop-header .brand img,
  body .evli-safe-logo{
    width:146px !important;
    max-width:146px !important;
    height:auto !important;
    max-height:46px !important;
    object-fit:contain !important;
    display:block !important;
  }

  body .site-header .brand::after,
  body .evli-desktop-header .brand::after,
  body .evli-safe-brand::after{
    display:none !important;
    content:none !important;
  }

  body .nav-links,
  body .evli-desktop-nav{
    width:100% !important;
    min-width:0 !important;
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
    gap:7px !important;
    flex-wrap:nowrap !important;
  }

  body .nav-links a,
  body .evli-desktop-nav a{
    display:inline-flex !important;
    align-items:center !important;
    justify-content:center !important;
    min-height:38px !important;
    padding:0 11px !important;
    border-radius:999px !important;
    color:#063f2d !important;
    font-size:14px !important;
    font-weight:850 !important;
    line-height:1 !important;
    letter-spacing:-.015em !important;
    text-decoration:none !important;
    white-space:nowrap !important;
    transition:all .22s ease !important;
  }

  body .nav-links a:hover,
  body .evli-desktop-nav a:hover{
    background:linear-gradient(135deg,#063f2d,#087a58) !important;
    color:#fff !important;
    transform:translateY(-2px) !important;
    box-shadow:0 12px 26px rgba(6,63,45,.18) !important;
  }

  body .nav-actions,
  body .evli-desktop-actions{
    width:292px !important;
    min-width:292px !important;
    display:flex !important;
    align-items:center !important;
    justify-content:flex-end !important;
    gap:9px !important;
    white-space:nowrap !important;
  }

  body .nav-actions .btn,
  body .evli-desktop-actions .btn{
    min-height:42px !important;
    padding:0 20px !important;
    border-radius:999px !important;
    display:inline-flex !important;
    align-items:center !important;
    justify-content:center !important;
    font-size:14.5px !important;
    font-weight:900 !important;
    text-decoration:none !important;
    transition:all .22s ease !important;
  }

  body .nav-actions .btn.white,
  body .evli-desktop-actions .btn.white{
    background:#fff !important;
    color:#063f2d !important;
    border:1px solid rgba(6,63,45,.13) !important;
    box-shadow:0 8px 22px rgba(6,63,45,.055) !important;
  }

  body .nav-actions .btn.gold,
  body .evli-desktop-actions .btn.gold{
    background:linear-gradient(135deg,#e3bf4f,#f4db72) !important;
    color:#063f2d !important;
    border:0 !important;
    box-shadow:0 12px 28px rgba(227,191,79,.25) !important;
  }

  body .nav-actions .btn:hover,
  body .evli-desktop-actions .btn:hover{
    transform:translateY(-2px) !important;
    box-shadow:0 16px 34px rgba(6,63,45,.15) !important;
  }

  body .cart-button{
    width:46px !important;
    height:46px !important;
    min-width:46px !important;
    border-radius:999px !important;
    border:1px solid rgba(6,63,45,.12) !important;
    background:#fff !important;
    color:#063f2d !important;
    display:inline-flex !important;
    align-items:center !important;
    justify-content:center !important;
    position:relative !important;
    cursor:pointer !important;
    box-shadow:0 10px 24px rgba(6,63,45,.09) !important;
    transition:all .22s ease !important;
  }

  body .cart-button:hover{
    background:linear-gradient(135deg,#063f2d,#087a58) !important;
    color:#fff !important;
    transform:translateY(-2px) !important;
  }

  body .cart-count{
    position:absolute !important;
    top:-7px !important;
    right:-4px !important;
    min-width:22px !important;
    height:22px !important;
    padding:0 7px !important;
    border-radius:999px !important;
    background:#e3bf4f !important;
    color:#063f2d !important;
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
    font-size:11.5px !important;
    font-weight:950 !important;
    box-shadow:0 8px 16px rgba(6,63,45,.16) !important;
  }

  /* Hero estable: nada de margin negativo */
  body .v16-hero,
  body .page-hero,
  body .hero{
    width:min(1280px, calc(100% - 64px)) !important;
    margin:12px auto 0 !important;
    border-radius:30px !important;
    overflow:hidden !important;
    box-shadow:0 26px 80px rgba(6,63,45,.13) !important;
    border:0 !important;
  }

  body .v16-hero .v16-wrap,
  body .page-hero .v16-wrap,
  body .hero .v16-wrap{
    padding-top:78px !important;
    padding-bottom:78px !important;
  }

  body .v16-hero h1,
  body .page-hero h1,
  body .hero h1{
    letter-spacing:-.045em !important;
  }
}

@media (min-width:921px) and (max-width:1180px){
  body .site-header,
  body .evli-desktop-header{
    width:calc(100% - 36px) !important;
    grid-template-columns:158px minmax(420px,1fr) 272px !important;
    gap:10px !important;
    padding:10px 14px !important;
  }

  body .site-header .brand,
  body .evli-desktop-header .brand{
    width:158px !important;
    min-width:158px !important;
    max-width:158px !important;
  }

  body .site-header .brand img,
  body .evli-desktop-header .brand img{
    width:138px !important;
    max-width:138px !important;
  }

  body .nav-links,
  body .evli-desktop-nav{
    gap:3px !important;
  }

  body .nav-links a,
  body .evli-desktop-nav a{
    font-size:13px !important;
    padding:0 7px !important;
  }

  body .nav-actions,
  body .evli-desktop-actions{
    width:272px !important;
    min-width:272px !important;
    gap:7px !important;
  }

  body .nav-actions .btn,
  body .evli-desktop-actions .btn{
    padding:0 15px !important;
    font-size:14px !important;
  }

  body .cart-button{
    width:44px !important;
    height:44px !important;
    min-width:44px !important;
  }
}
