/* ===== MD Nichrome display font ===== */
@font-face{font-family:'MD Nichrome';src:url('assets/fonts/Nichrome-Thin.otf') format('opentype');font-weight:100;font-style:normal;font-display:swap;}
@font-face{font-family:'MD Nichrome';src:url('assets/fonts/Nichrome-Light.otf') format('opentype');font-weight:300;font-style:normal;font-display:swap;}
@font-face{font-family:'MD Nichrome';src:url('assets/fonts/Nichrome-Regular.otf') format('opentype');font-weight:400;font-style:normal;font-display:swap;}
@font-face{font-family:'MD Nichrome';src:url('assets/fonts/Nichrome-Bold.otf') format('opentype');font-weight:700;font-style:normal;font-display:swap;}
@font-face{font-family:'MD Nichrome';src:url('assets/fonts/Nichrome-Dark.otf') format('opentype');font-weight:800;font-style:normal;font-display:swap;}
@font-face{font-family:'MD Nichrome';src:url('assets/fonts/Nichrome-Ultra.otf') format('opentype');font-weight:900;font-style:normal;font-display:swap;}

/* ===== base ===== */
*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{margin:0;background:#f7f3ea;}
section{scroll-margin-top:88px;}
img{max-width:100%;}

/* ===== interactions ===== */
details > summary{list-style:none;cursor:pointer;}
details > summary::-webkit-details-marker{display:none;}
details[open] .faq-plus{transform:rotate(45deg);}
.nav-link:hover{color:#fa4d09 !important;}
.shop-card:hover{transform:translateY(-4px);box-shadow:0 18px 40px rgba(23,58,106,.16) !important;}

/* ===== responsive (the handoff prototype had no mobile rules) ===== */
@media (max-width:900px){
  .hero-grid,.ad-grid,.coming-grid,.steps-imgs{grid-template-columns:1fr !important;}
  .grid-2,.grid-3,.stats-grid,.footer-grid{grid-template-columns:1fr !important;}
  .grid-4{grid-template-columns:repeat(2,1fr) !important;}
  .hero-h1{font-size:46px !important;}
  .sec-h2{font-size:34px !important;}
  .stats-grid > div{border-left:none !important;border-right:none !important;}
  .hero-bottles{aspect-ratio:16/10 !important;}
}
@media (max-width:600px){
  .nav-menu{display:none !important;}
  .grid-4,.coming-features{grid-template-columns:1fr !important;}
  .hero-h1{font-size:38px !important;}
  .sec-h2{font-size:28px !important;}
  .mascota-card{flex-direction:column !important;text-align:center;}
  .mascota-card > img{margin:0 auto;}
}