:root{
  --azul:#273c8a;
  --lineaHeader:#2d3aa5;

  /* rojo */
  --rosa:#ff0000;

  --altoHeader:66.75px;
  --altoTopbar:44px;

  /* topbar real */
  --topbarReal: var(--altoTopbar);

  --navOffset: calc(var(--topbarReal) + var(--altoHeader));

  --max:1320px;
  --texto:#0b1b3a;
  --menuBlue:#001B57;
  --sideW:160px;
  --iconMobile:#111;

  /* footer */
  --footerBlue:#0b1b3a;
  --footerBlue2:#0b1b3a;
  --footerBlack:#111;
}

*{box-sizing:border-box}
html,body{height:100%}
html,body{overflow-x:hidden}

body{
  margin:0;
  font-family:"Sofia Sans", system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
  color:var(--texto);
  padding-top:0;
  background:#fff;
  transition:none;
}

body.menu-open{
  overflow:hidden;
  touch-action:none;
}

/* ===== TOPBAR ===== */
.topbar{
  position:sticky;
  top:0;
  left:0; right:0;
  z-index:2000;
  height:var(--altoTopbar);
  background:var(--lineaHeader);
  color:#fff;
  display:flex;
  align-items:center;
  transition: transform .22s cubic-bezier(.2,.8,.2,1);
}
.topbar.is-hidden{
  transform: translateY(-100%);
  pointer-events:none;
}

.topbar .inner{
  width:min(var(--max), calc(100% - 40px));
  margin:0 auto;
  display:flex;
  justify-content:flex-end;
  align-items:center;
  gap:22px;
  font-size:13px;
  font-weight:800;
}
.topbar-left{
  display:flex;
  gap:18px;
  align-items:center;
  margin-left:auto;
}
.topbar-left a{
  color:#fff; text-decoration:none; opacity:.95;
  font-size:13px; font-weight:800;
}
.topbar-left a:hover{ opacity:1; text-decoration:underline; }

body.topbar-hidden{
  --topbarReal: 0px;
}

/* ===== HEADER ===== */
.siteHeader{
  position:sticky;
  top:var(--topbarReal);
  left:0; right:0;
  z-index:1999;
  background:#fff;
  height:var(--altoHeader);
  display:flex;
  align-items:center;
  overflow:visible;
  transition: top .22s cubic-bezier(.2,.8,.2,1);
}

.siteHeader::after{
  content:"";
  position:absolute;
  left:0; right:0;
  bottom:0;
  height:3px;
  background:var(--lineaHeader);
}

.siteHeader .inner{
  width:min(var(--max), calc(100% - 24px));
  margin:0 auto;
  display:grid;
  grid-template-columns: var(--sideW) 1fr var(--sideW);
  align-items:center;
  gap:12px;
  overflow:visible;
}

/* brand */
.brand{
  display:flex;
  align-items:center;
  justify-self:start;
  text-decoration:none;
  width:100%;
  max-width:var(--sideW);
}
.brand img{
  height:54px;
  width:auto;
  max-width:100%;
  display:block;
  object-fit:contain;
}

/* NAV DESKTOP */
.mainNav{
  min-width:0;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:16px;
  font-size:13.8px;
  font-weight:800;
  overflow:hidden;
  padding:0 10px;
}
.navItem{ position:relative; display:flex; align-items:center; flex:0 0 auto; }
.navLink{
  text-decoration:none;
  color:var(--texto);
  opacity:.98;
  padding:10px 4px;
  position:relative;
  display:flex;
  align-items:center;
  gap:8px;
  white-space:nowrap;
}
.navLink::before{
  content:"";
  position:absolute;
  top:2px;
  left:50%;
  width:6px;
  height:6px;
  border-radius:999px;
  background:transparent;
  transform:translateX(-50%);
}
.navItem:hover .navLink{ color:var(--rosa); }
.navItem:hover .navLink::before{ background:var(--rosa); }

.chev{ width:12px; height:12px; display:inline-block; transform:translateY(1px); opacity:.9; }
.chev svg{ width:12px; height:12px; fill:none; stroke:currentColor; stroke-width:2; }

/* =========================
   MEGAMENU
========================= */
.hasMega{ position:relative; }
.hasMega::after{
  content:"";
  position:absolute;
  left:-50px;
  right:-50px;
  top:100%;
  height:170px;
  background:transparent;
}

.megaBar{
  position:fixed;
  left:0; right:0;
  top: calc(var(--topbarReal) + var(--altoHeader) - 3px);
  background:var(--rosa);
  padding:36px 0;
  z-index:2001;

  opacity:0;
  transform: translateY(-8px);
  pointer-events:none;
  visibility:hidden;

  transition:
    top .22s cubic-bezier(.2,.8,.2,1),
    opacity .16s ease,
    transform .16s ease,
    visibility 0s linear .16s;
}

.hasMega:hover .megaBar,
.hasMega.is-open .megaBar,
.hasMega:focus-within .megaBar,
.megaBar:hover{
  opacity:1;
  transform: translateY(0);
  pointer-events:auto;
  visibility:visible;
  transition:
    top .22s cubic-bezier(.2,.8,.2,1),
    opacity .16s ease,
    transform .16s ease,
    visibility 0s;
}

.megaInner{
  width:min(var(--max), calc(100% - 40px));
  margin:0 auto;
  display:flex;
  justify-content:center;
  gap:70px;
  flex-wrap:wrap;
}
.megaBar a{
  color:#fff;
  text-decoration:none;
  font-weight:900;
  font-size:13.5px;
  padding:6px 0;
  opacity:.95;
}
.megaBar a:hover{ opacity:1; text-decoration:underline; }

/* ACTIONS */
.actions{
  justify-self:end;
  width:100%;
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:10px;
}

/* LUPA DESKTOP */
.headerSearch{
  width:38px; height:38px;
  border:0;
  background:#fff;
  border-radius:0;
  cursor:pointer;
  display:grid;
  place-items:center;
  padding:0;
}
.headerSearch:hover{ filter:brightness(1.02); transform:translateY(-1px); }
.headerSearch svg{
  width:18px;height:18px;
  fill:none;
  stroke:var(--rosa);
  stroke-width:2.4;
  stroke-linecap:round;
  stroke-linejoin:round;
}

/* icon buttons */
.iconBtn{
  width:38px;height:38px;
  display:grid;
  place-items:center;
  border-radius:999px;
  background:transparent;
  border:0;
  cursor:pointer;
  text-decoration:none;
  position:relative;
}
.iconBtn:hover{ background:#f3f4f7; }
.iconSvgImg{
  width:20px;height:20px;
  display:block;
  filter: brightness(0) invert(0);
}

/* ===== LOGIN dropdown (CLICK) ===== */
.accountWrap{ position:relative; display:flex; align-items:center; }
.accountToggle{
  height:38px;
  padding:0 8px;
  display:flex;
  align-items:center;
  gap:6px;
  border-radius:999px;
  text-decoration:none;
  background:transparent;
}
.accountToggle:hover{ background:#f3f4f7; }
.accountToggle .chevIco{
  width:16px; height:16px;
  fill:none;
  stroke: var(--iconMobile);
  stroke-width:2;
  stroke-linecap:round;
  stroke-linejoin:round;
  opacity:.85;
}

.accountDropdown{
  position:fixed;
  right:18px;
  top: calc(var(--topbarReal) + var(--altoHeader) + 12px);
  width:320px;
  max-width: calc(100vw - 24px);
  background:#fff;
  border-radius:10px;
  box-shadow:0 18px 45px rgba(0,0,0,.22);
  border:1px solid #e9e9ee;
  padding:14px;
  opacity:0;
  transform:translateY(8px);
  pointer-events:none;
  transition: opacity .16s ease, transform .16s ease;
  z-index:99998;
}
.accountWrap.open-login .accountDropdown{
  opacity:1;
  transform:translateY(0);
  pointer-events:auto;
}

.loginBox{ display:flex; flex-direction:column; gap:10px; }
.loginBox input{
  height:42px;
  border:1px solid #e6e6ee;
  border-radius:8px;
  padding:0 12px;
  font-family:"Sofia Sans", system-ui, sans-serif;
  font-weight:700;
  outline:none;
}
.loginRow{ display:flex; align-items:center; justify-content:space-between; gap:10px; margin-top:2px; }
.loginRow .remember{ display:flex; gap:8px; align-items:center; font-weight:700; font-size:13px; }
.loginBtn{
  height:40px;
  border:0;
  background:var(--rosa);
  color:#fff;
  font-weight:900;
  border-radius:10px;
  padding:0 14px;
  cursor:pointer;
}
.registerLink{ font-weight:900; color:#1a2a7a; text-decoration:none; font-size:13px; }

/* ===== CARRITO dropdown ===== */
.cartDropdown{
  position:fixed;
  right:18px;
  top: calc(var(--topbarReal) + var(--altoHeader) + 12px);
  width:340px;
  max-width: calc(100vw - 24px);
  background:#fff;
  border-radius:10px;
  border:1px solid rgba(0,0,0,.10);
  box-shadow:0 18px 45px rgba(0,0,0,.22);
  padding:0;
  opacity:0;
  transform: translateY(8px);
  pointer-events:none;
  transition: opacity .16s ease, transform .16s ease;
  z-index:99999;
}
.cartDropdown.open{
  opacity:1;
  transform: translateY(0);
  pointer-events:auto;
}
.cartDropdown .cartHead{
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:16px 16px 10px;
}
.cartDropdown .cartTitle{
  margin:0;
  font-size:22px;
  font-weight:500;
  color:#2b2f7a;
}
.cartDropdown .cartClose{
  width:36px;height:36px;
  border:0;
  background:transparent;
  cursor:pointer;
  border-radius:10px;
  display:grid;
  place-items:center;
}
.cartDropdown .cartClose:hover{ background:#f3f4f7; }
.cartDropdown .cartClose::before{
  content:"×";
  font-size:22px;
  line-height:1;
  color:#444;
}
.cartDropdown .cartBody{
  padding:0 16px 16px;
  font-size:18px;
  color:#222;
}

/* ===== HAMBURGUESA ===== */
.menuBtn{
  display:none;
  width:44px;height:44px;
  border:0;
  background:transparent;
  border-radius:10px;
  cursor:pointer;
  padding:0;
  align-items:center;
  justify-content:center;
  flex-direction:column;
  gap:6px;
}
.menuBtn span{
  display:block;
  width:22px;
  height:2.6px;
  background:var(--iconMobile);
  border-radius:999px;
}

/* ==========================================
   HERO (TIENDA - CÚRCUMA)
========================================== */
@keyframes heroZoom{
  from { transform: scale(1); }
  to   { transform: scale(1.08); }
}

.heroKicker{
  margin:0 0 12px;
  font-family:"Pacifico", cursive;
  font-size:30px;
  font-weight:400;
  opacity:.98;
}

.cta{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  background:var(--rosa);
  color:#fff;
  text-decoration:none;
  font-weight:900;
  padding:14px 34px;
  border-radius:999px;
  box-shadow:0 14px 26px rgba(0,0,0,.25);
}
.cta:hover{ filter:brightness(1.05); }

.shopHero{
  position:relative;
  min-height:520px;
  display:flex;
  align-items:center;
  justify-content:center;
  text-align:center;
  padding:70px 18px;
  overflow:hidden;
  background:#000;
}
.shopHero::before{
  content:"";
  position:absolute;
  inset:0;
  background-image:url("https://images.unsplash.com/photo-1632404249769-3b56a5b8bbf8?auto=format&fit=crop&fm=jpg&q=80&w=2400");
  background-size:cover;
  background-position:center;
  transform:scale(1);
  animation: heroZoom 24s ease-in-out infinite alternate;
  will-change: transform;
  z-index:0;
}
.shopHero::after{
  content:"";
  position:absolute;
  inset:0;
  background: linear-gradient(180deg, rgba(0,0,0,.60), rgba(0,0,0,.30) 55%, rgba(0,0,0,.18));
  z-index:1;
}
.shopHero .content{
  position:relative;
  z-index:2;
  max-width:980px;
  color:#fff;
  text-shadow:0 10px 22px rgba(0,0,0,.55);
}
.shopHero h1{
  margin:0 0 12px;
  font-family: Georgia, "Times New Roman", serif;
  font-size: clamp(40px, 5vw, 72px);
  font-weight:800;
  line-height:1.05;
}
.heroSub{
  margin:0 auto 22px;
  max-width:820px;
  font-size:18px;
  font-weight:700;
  line-height:1.5;
  opacity:.95;
}

/* ==========================================
   TIENDA - CONTENIDO
========================================== */
.shopMain{
  padding:48px 0 10px;
  background:#fff;
}

.productWrap{
  width:min(var(--max), calc(100% - 40px));
  margin:0 auto;
  padding:10px 0 60px;
}

.productGrid{
  display:grid;
  grid-template-columns: 1.05fr .95fr;
  gap:32px;
  align-items:start;
}

/* Galería */
.pGallery{
  background:#fff;
  border:1px solid #ececf2;
  border-radius:14px;
  box-shadow:0 16px 40px rgba(0,0,0,.07);
  padding:16px;
}
.pMainImg{
  width:100%;
  height:420px;
  object-fit:cover;
  border-radius:12px;
  display:block;
}
.pThumbs{
  display:flex;
  gap:10px;
  margin-top:12px;
}
.pThumb{
  width:110px;
  height:76px;
  border-radius:10px;
  border:1px solid #e8e8f0;
  background:#fff;
  overflow:hidden;
  padding:0;
  cursor:pointer;
  opacity:.92;
}
.pThumb img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}
.pThumb.is-active{
  outline:3px solid rgba(255,0,0,.18);
  border-color: rgba(255,0,0,.35);
  opacity:1;
}

.pBadges{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  margin-top:14px;
}
.pBadge{
  font-size:12.5px;
  font-weight:900;
  color:#2b2b2b;
  background:#f4f4f8;
  border:1px solid #e6e6ef;
  padding:8px 10px;
  border-radius:999px;
}

/* Info */
.pInfo{
  padding:10px 2px;
}
.pTitle{
  margin:0 0 10px;
  font-size:36px;
  font-weight:900;
  color:#0b1b3a;
}
.pDesc{
  margin:0 0 14px;
  font-size:16.5px;
  line-height:1.65;
  font-weight:650;
  color:#27314b;
}
.pBullets{
  margin:0 0 18px;
  padding-left:18px;
  display:grid;
  gap:8px;
  color:#1d2947;
  font-weight:750;
}

/* Compra */
.buyBox{
  border:1px solid #ececf2;
  border-radius:14px;
  background:#fff;
  padding:16px;
  box-shadow:0 16px 40px rgba(0,0,0,.06);
}
.buyRow{
  display:flex;
  flex-direction:column;
  gap:8px;
  margin-bottom:14px;
}
.buyRow--split{
  display:grid;
  grid-template-columns: 1fr 1fr;
  gap:14px;
  align-items:end;
}

.buyLabel{
  font-weight:900;
  font-size:13px;
  letter-spacing:.06em;
  text-transform:uppercase;
  color:#0b1b3a;
}
.buySelect{
  height:44px;
  border-radius:10px;
  border:1px solid #e6e6ee;
  padding:0 12px;
  font-weight:900;
  font-family:"Sofia Sans", system-ui, sans-serif;
  outline:none;
}

.qty{
  display:flex;
  align-items:center;
  gap:10px;
}
.qtyBtn{
  width:44px;
  height:44px;
  border-radius:12px;
  border:1px solid #e6e6ee;
  background:#fff;
  font-weight:900;
  font-size:18px;
  cursor:pointer;
}
.qtyInput{
  width:86px;
  height:44px;
  border-radius:12px;
  border:1px solid #e6e6ee;
  text-align:center;
  font-weight:900;
  outline:none;
  font-family:"Sofia Sans", system-ui, sans-serif;
}

.priceBox{
  text-align:right;
  background:#fff5f5;
  border:1px solid rgba(255,0,0,.12);
  border-radius:12px;
  padding:10px 12px;
}
.priceLabel{
  font-weight:900;
  font-size:12px;
  opacity:.85;
}
.priceValue{
  font-weight:900;
  font-size:22px;
  color:#111;
  margin-top:2px;
}

.buyActions{
  display:flex;
  gap:10px;
  margin-top:10px;
  flex-wrap:wrap;
}
.btnPrimary{
  height:46px;
  padding:0 18px;
  border-radius:12px;
  border:0;
  background:var(--rosa);
  color:#fff;
  font-weight:900;
  cursor:pointer;
}
.btnOutline{
  height:46px;
  padding:0 18px;
  border-radius:12px;
  border:1px solid rgba(255,0,0,.25);
  background:#fff;
  color:#1b1b1b;
  font-weight:900;
  text-decoration:none;
  display:inline-flex;
  align-items:center;
  justify-content:center;
}
.btnPrimary:hover,
.btnOutline:hover{ filter:brightness(1.03); }

.buyNote{
  margin-top:12px;
  font-size:13.5px;
  color:#2a2a2a;
  line-height:1.55;
  opacity:.92;
}

/* Confianza */
.trustRow{
  margin-top:16px;
  display:grid;
  grid-template-columns: repeat(3, 1fr);
  gap:12px;
}
.trustCard{
  border:1px solid #ececf2;
  border-radius:14px;
  padding:14px 12px;
  background:#fff;
}
.trustTitle{
  font-weight:900;
  font-size:14px;
  color:#0b1b3a;
}
.trustText{
  margin-top:6px;
  font-size:13.5px;
  color:#2b3550;
  font-weight:650;
  line-height:1.45;
}

/* =========================
   FOOTER
========================= */
.siteFooter,
.siteFooter *{
  font-family: sofia-pro, "Sofia Sans", system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
}
.siteFooter{ width:100%; }

/* NEWSLETTER */
.newsletterBar{
  background: var(--footerBlue);
  padding:28px 0;
  position:relative;
}
.newsletterBar::after{
  content:"";
  position:absolute;
  left:50%;
  transform:translateX(-50%);
  bottom:0;
  width:min(var(--max), calc(100% - 40px));
  height:1px;
  background:rgba(255,255,255,.22);
  pointer-events:none;
}

.newsletterInner{
  width:min(var(--max), calc(100% - 40px));
  margin:0 auto;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:28px;
  color:#fff;
}

.newsText{
  flex:1 1 auto;
  min-width:260px;
  text-align:left;
}
.newsText h3{
  margin:0 0 8px;
  font-weight:900;
  font-size:18px;
  line-height:1.2;
}
.newsText p{
  margin:0;
  opacity:.9;
  font-weight:600;
  line-height:1.45;
  font-size:13.5px;
}

.newsForm{
  flex:0 0 520px;
  max-width:520px;
  display:flex;
  flex-direction:column;
  gap:10px;
}

.newsRow{
  display:flex;
  align-items:center;
  gap:12px;
}
.newsRow input{
  flex:1 1 auto;
  height:40px;
  border-radius:6px;
  border:1px solid rgba(255,255,255,.22);
  background:rgba(0,0,0,.28);
  color:#fff;
  padding:0 14px;
  outline:none;
  font-weight:700;
  font-size:13px;
}
.newsRow input::placeholder{ color:rgba(255,255,255,.75); }
.newsRow button{
  height:40px;
  padding:0 18px;
  border-radius:6px;
  border:0;
  background:#fff;
  color:#000;
  font-weight:900;
  font-size:12.6px;
  cursor:pointer;
  white-space:nowrap;
}
.newsCheck{
  display:flex;
  gap:10px;
  align-items:flex-start;
  line-height:1.35;
  opacity:.92;
  font-size:12.5px;
  color:rgba(255,255,255,.88);
}
.newsCheck input{ margin-top:2px; }

/* FOOTER MAIN */
.footerMain{
  background: var(--footerBlue);
  padding:44px 0;
}
.footerInner{
  width:min(var(--max), calc(100% - 40px));
  margin:0 auto;
  display:grid;
  grid-template-columns: repeat(4, 1fr);
  gap:40px;
  color:#cfd6ff;
}

.siteFooter .fCol h4{
  color:#fff !important;
  font-size:16px !important;
  font-weight:900 !important;
  letter-spacing:.10em !important;
  margin:0 0 14px !important;
}

.siteFooter .fCol a,
.siteFooter .fCol p{
  font-size:13.5px !important;
  color:rgba(255,255,255,.88) !important;
  opacity:1 !important;
}

.fCol a{
  display:block;
  text-decoration:none;
  font-weight:700;
  padding:6px 0;
}
.fCol a:hover{
  color:#fff !important;
  text-decoration:underline;
}

.fMail{
  color:#fff !important;
  font-weight:900 !important;
}

/* CONTÁCTANOS */
.contactList{
  display:flex;
  flex-direction:column;
  gap:14px;
  margin-top:10px;
}
.cRow{
  display:flex;
  align-items:flex-start;
  gap:12px;
}
.cIcon{
  width:30px;
  flex:0 0 30px;
  display:flex;
  align-items:flex-start;
  justify-content:center;
  padding-top:2px;
}
.cIcon svg{
  width:18px;
  height:18px;
  fill:none;
  stroke:#fff;
  stroke-width:2.2;
  stroke-linecap:round;
  stroke-linejoin:round;
  display:block;
}
.cText p{
  margin:0;
  color:rgba(255,255,255,.88);
  line-height:1.55;
}
.cText .fMail{
  margin-top:0;
  display:inline-block;
}

/* REDES */
.socialRow{
  display:flex;
  gap:14px;
  margin-top:14px;
}
.socialBtn{
  width:40px;
  height:40px;
  border-radius:999px;
  background:#fff;
  position:relative;
  display:inline-block;
  text-decoration:none;
  padding:0;
  border:0;
  overflow:hidden;
}
.socialBtn svg{
  position:absolute !important;
  top:50% !important;
  left:50% !important;
  transform:translate(-50%, -50%) !important;
  display:block !important;
  margin:0 !important;
  padding:0 !important;
}
.socialBtn--fb svg{
  width:16px !important;
  height:16px !important;
  fill:#111 !important;
  stroke:none !important;
  transform:translate(-50%, -50%) translateY(0.6px) !important;
}
.socialBtn--ig svg{
  width:19px !important;
  height:19px !important;
  fill:none !important;
  stroke:#111 !important;
  stroke-width:2.2 !important;
  stroke-linecap:round !important;
  stroke-linejoin:round !important;
}

/* BARRA FINAL */
.footerBottomBar{
  background: var(--footerBlack);
  color:#bdbdbd;
  height:46px;
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:12.642px;
  font-weight:700;
  padding:0 16px;
}

/* =========================
   MENÚ MÓVIL
========================= */
.mMenu{
  position:fixed;
  inset:0;
  z-index:9999;
  opacity:0;
  pointer-events:none;
  transition:opacity .18s ease;
}
.mMenu.open{ opacity:1; pointer-events:auto; }

.mMenu__backdrop{
  position:absolute;
  inset:0;
  background:rgba(11,27,58,.35);
  border:0;
  cursor:pointer;
  z-index:0;
}
.mMenu__panel{
  position:absolute;
  inset:0;
  background:transparent;
  transform:translateX(14px);
  transition:transform .18s ease;
  display:flex;
  flex-direction:column;
  z-index:1;
  overflow:auto;
}
.mMenu.open .mMenu__panel{ transform:translateX(0); }

.mMenu__top{
  height:86px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:14px 16px;
  background:#fff;
  flex:0 0 auto;
}
.mMenu__brand img{ height:48px; width:auto; display:block; object-fit:contain; }
.mMenu__close{
  width:46px;height:46px;
  border-radius:12px;
  border:0;
  background:#fff;
  cursor:pointer;
  display:grid;
  place-items:center;
}
.mMenu__close svg{
  width:22px;height:22px;
  fill:none;
  stroke:var(--rosa);
  stroke-width:2.6;
  stroke-linecap:round;
  stroke-linejoin:round;
}
.mMenu__body{
  background:#fff;
  padding:16px 16px 0;
  display:flex;
  flex-direction:column;
  gap:16px;
  flex:0 0 auto;
}

/* buscador */
.mSearch{
  display:flex;
  align-items:center;
  gap:8px;
  border:1px solid #dbe2ef;
  border-radius:999px;
  background:#fff;
  height:44px;
  overflow:hidden;
}
.mSearch input{
  border:0;
  outline:none;
  height:44px;
  flex:1;
  font-size:16px;
  font-weight:600;
  color: var(--menuBlue);
  padding:14px 14px 14px 18px;
  background:transparent;
}
.mSearchBtn{
  width:44px;height:44px;
  border:0;
  background:transparent;
  cursor:pointer;
  display:grid;
  place-items:center;
}
.mSearchBtn svg{
  width:18px;height:18px;
  fill:none;
  stroke:var(--rosa);
  stroke-width:2.6;
  stroke-linecap:round;
  stroke-linejoin:round;
}

/* lista */
.mLink, .mAcc{
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:16px 12px;
  color: var(--menuBlue);
  font-size:16px;
  font-weight:900;
  border:0;
  background:transparent;
  text-decoration:none;
}
.mAcc{ width:100%; cursor:pointer; }

.mCaret{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:36px;height:36px;
  border-radius:10px;
}
.mCaret svg{
  width:18px;height:18px;
  fill:none;
  stroke:var(--rosa);
  stroke-width:2.8;
  transition:transform .18s ease;
}
.mAcc[aria-expanded="true"] .mCaret svg{ transform:rotate(180deg); }

.mSub{
  background:var(--rosa);
  overflow:hidden;
  max-height:0;
  transition:max-height .2s ease;
  width: calc(100% + 32px);
  margin-left: -16px;
  margin-right: -16px;
}
.mSub a{
  display:block;
  color:#fff;
  text-decoration:none;
  font-weight:800;
  padding:16px 28px;
  font-size:16px;
}
.mSub a:hover{ text-decoration:underline; }

.mAudience{
  background:var(--lineaHeader);
  padding:16px 28px;
  color:#fff;
  width: calc(100% + 32px);
  margin-left: -16px;
  margin-right: -16px;
  margin-top:10px;
}
.mAudience a{
  display:block;
  color:#fff;
  text-decoration:none;
  font-weight:800;
  font-size:16px;
  padding:8px 0;
  opacity:.95;
}
.mAudience a:hover{ opacity:1; text-decoration:underline; }

.mMenu .mList a.mLink,
.mMenu .mList button.mAcc{
  font-family:"Sofia Sans", system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif !important;
  font-size:16px !important;
  font-weight:900 !important;
  color: var(--menuBlue) !important;
  letter-spacing:0 !important;
  text-rendering:optimizeLegibility;
}

/* WHATSAPP */
.waFloat{
  position:fixed;
  right:18px;
  bottom:18px;
  width:60px;
  height:60px;
  border-radius:999px;
  background: rgb(45, 183, 66);
  display:grid;
  place-items:center;
  z-index:99999;
  box-shadow:0 10px 22px rgba(0,0,0,.25);
  text-decoration:none;
  overflow:hidden;
  border:0;
}
.waFloat::before{ content:none; }
.waFloat svg{
  position:relative;
  width:48px;
  height:48px;
  fill:#fff;
  display:block;
}

/* RESPONSIVE */
@media (max-width:980px){
  :root{ --topbarReal: 0px; }

  .topbar{ display:none; }
  .siteHeader{ top:0; }

  .siteHeader .inner{ grid-template-columns:auto 1fr auto; }
  .mainNav{ display:none; }

  .headerSearch{ display:none; }
  .menuBtn{ display:flex; }

  .productGrid{ grid-template-columns:1fr; }
  .pMainImg{ height:320px; }
  .trustRow{ grid-template-columns:1fr; }
}

@media (max-width:900px){
  .newsletterInner{
    flex-direction:column;
    align-items:stretch;
    gap:18px;
  }

  .newsForm{
    flex: 0 1 auto !important;
    width:100% !important;
    max-width:560px;
  }

  .newsText{
    width:100%;
    max-width:560px;
  }

  .newsRow{ flex-wrap:wrap; }
  .newsRow input{ flex:1 1 320px; min-width:220px; }
  .newsRow button{ min-width:160px; }

  .footerInner{
    grid-template-columns:1fr;
    justify-items:center;
    text-align:center;
    gap:26px;
  }
  .fCol{ width:min(560px, 100%); }

  .contactList{ width:min(560px, 100%); }
  .cRow{ justify-content:flex-start; }
  .cText{ text-align:left; }
  .socialRow{ justify-content:center; }
}