/* ════════════════════════════════════════════════
   BABY BOO · Moda Infantil — Utrera (Sevilla)
   ════════════════════════════════════════════════ */

:root{
  --crema:      #FBF7F2;
  --crema-2:    #F5EDE3;
  --crema-3:    #EFE4D6;
  --tinta:      #2B2320;
  --tinta-2:    #6E625B;
  --tinta-3:    #9C8F86;
  --caramelo:   #B08151;
  --caramelo-d: #8E663D;
  --rosa:       #E7CDC5;
  --salvia:     #A8B69E;
  --linea:      #E6DACB;
  --blanco:     #FFFFFF;
  --wa:         #25D366;
  --wa-d:       #1EA753;

  --r-s: 10px;
  --r-m: 18px;
  --r-l: 28px;
  --r-xl: 40px;

  --sombra:   0 2px 8px rgba(43,35,32,.05), 0 12px 34px rgba(43,35,32,.07);
  --sombra-l: 0 4px 14px rgba(43,35,32,.06), 0 28px 70px rgba(43,35,32,.12);

  --ff-d: "Fraunces", Georgia, "Times New Roman", serif;
  --ff-b: "Jost", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;

  --wrap: 1240px;
  --nav-h: 74px;
}

*,*::before,*::after{ box-sizing:border-box; }

html{ scroll-behavior:smooth; scroll-padding-top:calc(var(--nav-h) + 20px); -webkit-text-size-adjust:100%; }

body{
  margin:0;
  background:var(--crema);
  color:var(--tinta);
  font-family:var(--ff-b);
  font-weight:300;
  font-size:17px;
  line-height:1.65;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}

img{ max-width:100%; height:auto; display:block; }
a{ color:inherit; text-decoration:none; }
ul,ol,dl,dd{ margin:0; padding:0; list-style:none; }
h1,h2,h3,h4,p{ margin:0; }
button{ font:inherit; color:inherit; border:0; background:none; cursor:pointer; }

.wrap{ width:min(100% - 40px, var(--wrap)); margin-inline:auto; }

::selection{ background:var(--caramelo); color:var(--crema); }

/* ───────── tipografía base ───────── */
.eyebrow{
  font-size:12px; letter-spacing:.22em; text-transform:uppercase;
  font-weight:500; color:var(--caramelo); margin-bottom:14px;
}
.eyebrow--claro{ color:var(--rosa); }

.sec__h2{
  font-family:var(--ff-d);
  font-weight:400;
  font-size:clamp(30px, 4.4vw, 50px);
  line-height:1.08;
  letter-spacing:-.02em;
  font-variation-settings:"opsz" 100, "SOFT" 20;
}

.sec__p{ color:var(--tinta-2); max-width:52ch; margin-top:16px; font-size:17px; }

/* ───────── botones ───────── */
.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:9px;
  padding:14px 26px; border-radius:999px;
  font-family:var(--ff-b); font-weight:500; font-size:15px; letter-spacing:.01em;
  cursor:pointer; white-space:nowrap;
  transition:transform .25s cubic-bezier(.2,.7,.3,1), box-shadow .25s, background .25s, color .25s, border-color .25s;
}
.btn:hover{ transform:translateY(-2px); }
.btn:active{ transform:translateY(0); }

.btn--dark{ background:var(--tinta); color:var(--crema); box-shadow:0 6px 20px rgba(43,35,32,.18); }
.btn--dark:hover{ background:#3A302B; box-shadow:0 12px 30px rgba(43,35,32,.24); }

.btn--ghost{ border:1px solid var(--linea); background:rgba(255,255,255,.5); color:var(--tinta); }
.btn--ghost:hover{ border-color:var(--caramelo); color:var(--caramelo-d); background:var(--blanco); }

.btn--wa{ background:var(--wa); color:#0B3D22; box-shadow:0 6px 20px rgba(37,211,102,.28); }
.btn--wa:hover{ background:var(--wa-d); color:#fff; box-shadow:0 12px 32px rgba(37,211,102,.36); }
.btn--xl{ padding:18px 38px; font-size:17px; }

.ico-wa{ width:19px; height:19px; flex:none; }

.link-arrow{
  display:inline-flex; align-items:center; gap:9px; margin-top:22px;
  font-weight:500; font-size:15px; color:var(--caramelo-d);
  border-bottom:1px solid rgba(176,129,81,.35); padding-bottom:3px;
  transition:gap .25s, border-color .25s;
}
.link-arrow:hover{ gap:15px; border-color:var(--caramelo); }

/* ═════════ AVISOS ═════════ */
.avisos{
  background:var(--tinta); color:var(--crema-2);
  font-size:13px; letter-spacing:.05em; text-align:center;
  height:38px; display:flex; align-items:center; justify-content:center;
  overflow:hidden; position:relative; padding-inline:16px;
}
.avisos span{ display:block; animation:avisoIn .55s cubic-bezier(.2,.7,.3,1) both; }
.avisos strong{ color:var(--rosa); font-weight:500; }
@keyframes avisoIn{ from{ opacity:0; transform:translateY(100%); } to{ opacity:1; transform:none; } }

/* ═════════ NAV ═════════ */
.nav{
  position:sticky; top:0; z-index:60;
  background:rgba(251,247,242,.82);
  backdrop-filter:saturate(180%) blur(14px);
  -webkit-backdrop-filter:saturate(180%) blur(14px);
  border-bottom:1px solid transparent;
  transition:border-color .3s, box-shadow .3s, background .3s;
}
.nav.is-stuck{ border-bottom-color:var(--linea); box-shadow:0 6px 24px rgba(43,35,32,.05); }
.nav__in{ height:var(--nav-h); display:flex; align-items:center; gap:24px; }

.logo{ display:flex; align-items:center; gap:11px; margin-right:auto; }
.logo__mark{ width:36px; height:36px; color:var(--caramelo); flex:none; }
.logo__mark svg{ width:100%; height:100%; }
.logo__name{
  font-family:var(--ff-d); font-weight:500; font-size:24px; letter-spacing:-.02em;
  line-height:1; display:block; font-variation-settings:"SOFT" 40;
}
.logo__sub{
  display:block; font-size:9.5px; letter-spacing:.34em; text-transform:uppercase;
  color:var(--tinta-3); margin-top:3px;
}

.nav__links{ display:flex; gap:30px; }
.nav__links a{
  font-size:15px; color:var(--tinta-2); position:relative; padding:6px 0;
  transition:color .2s;
}
.nav__links a::after{
  content:""; position:absolute; left:0; right:100%; bottom:0; height:1px;
  background:var(--caramelo); transition:right .3s cubic-bezier(.2,.7,.3,1);
}
.nav__links a:hover{ color:var(--tinta); }
.nav__links a:hover::after{ right:0; }

.nav__cta{ display:flex; align-items:center; gap:12px; }
.nav__cta .btn{ padding:11px 20px; font-size:14px; }

.burger{ display:none; width:42px; height:42px; flex-direction:column; justify-content:center; align-items:center; gap:5px; }
.burger span{ display:block; width:20px; height:1.5px; background:var(--tinta); border-radius:2px; transition:transform .3s, opacity .2s; }
.burger.is-open span:nth-child(1){ transform:translateY(6.5px) rotate(45deg); }
.burger.is-open span:nth-child(2){ opacity:0; }
.burger.is-open span:nth-child(3){ transform:translateY(-6.5px) rotate(-45deg); }

/* ═════════ HERO ═════════ */
.hero{ padding:clamp(46px,7vw,88px) 0 clamp(60px,8vw,110px); position:relative; overflow:hidden; }
.hero::before{
  content:""; position:absolute; top:-22%; right:-14%;
  width:min(62vw,760px); aspect-ratio:1; border-radius:50%;
  background:radial-gradient(circle at 35% 35%, rgba(231,205,197,.55), rgba(245,237,227,0) 68%);
  pointer-events:none;
}
.hero__in{ display:grid; grid-template-columns:1fr 1.02fr; gap:clamp(34px,5vw,80px); align-items:center; position:relative; }

.hero__h1{
  font-family:var(--ff-d); font-weight:300;
  font-size:clamp(38px, 5.6vw, 70px); line-height:1.02; letter-spacing:-.03em;
  font-variation-settings:"opsz" 144, "SOFT" 30;
}
.hero__h1 em{ font-style:italic; font-weight:400; color:var(--caramelo-d); font-variation-settings:"opsz" 144, "SOFT" 60; }
.hero__h1 span{ display:block; }

.hero__p{ margin-top:24px; color:var(--tinta-2); max-width:47ch; font-size:17.5px; }

.hero__btns{ display:flex; flex-wrap:wrap; gap:12px; margin-top:34px; }

.hero__trust{
  display:grid; grid-template-columns:repeat(3,auto); justify-content:space-between;
  gap:18px 22px; margin-top:36px; padding-top:26px; border-top:1px solid var(--linea);
}
.trust{ display:flex; align-items:center; gap:9px; }
.trust__n{ font-family:var(--ff-d); font-size:25px; font-weight:500; line-height:1; letter-spacing:-.02em; white-space:nowrap; }
.trust__t{ font-size:12.5px; line-height:1.32; color:var(--tinta-2); }
.stars{ display:flex; gap:2px; color:#E0A800; }
.stars svg{ width:13px; height:13px; }

/* arte del hero */
.hero__art{ position:relative; padding-bottom:34px; }
.hero__figA{ margin:0; border-radius:var(--r-xl); overflow:hidden; box-shadow:var(--sombra-l); }
.hero__figA img{ width:100%; height:clamp(360px,46vw,520px); object-fit:cover; object-position:center 30%; }
.hero__figB{
  position:absolute; left:-34px; bottom:-6px; width:clamp(120px,15vw,178px);
  margin:0; border-radius:var(--r-m); overflow:hidden;
  box-shadow:var(--sombra-l); border:5px solid var(--crema);
}
.hero__figB img{ width:100%; aspect-ratio:3/4; object-fit:cover; }

.hero__badge{
  position:absolute; right:-14px; top:-22px;
  background:var(--blanco); border-radius:var(--r-m);
  padding:16px 20px; box-shadow:var(--sombra-l);
  display:flex; align-items:center; gap:13px; max-width:230px;
}
.hero__badge-n{
  width:44px; height:44px; flex:none; border-radius:50%;
  background:var(--crema-3); color:var(--caramelo-d);
  display:grid; place-items:center;
}
.hero__badge-n svg{ width:22px; height:22px; }
.hero__badge-t{ font-size:13px; line-height:1.35; color:var(--tinta-2); }
.hero__badge-t strong{ color:var(--tinta); font-weight:500; }

/* ═════════ MARCAS ═════════ */
.marcas{
  border-block:1px solid var(--linea);
  background:var(--crema-2);
  padding:20px 0; overflow:hidden;
  -webkit-mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent);
          mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent);
}
.marcas__track{ display:flex; gap:0; width:max-content; animation:marquee 34s linear infinite; }
.marcas:hover .marcas__track{ animation-play-state:paused; }
.marcas__track span{
  font-family:var(--ff-d); font-size:clamp(17px,2vw,23px); font-weight:400;
  letter-spacing:.02em; color:var(--tinta-2); padding:0 30px;
  display:inline-flex; align-items:center; gap:30px; white-space:nowrap;
}
.marcas__track span::after{ content:"·"; color:var(--caramelo); font-size:22px; }
@keyframes marquee{ to{ transform:translateX(-50%); } }

/* ═════════ SECCIONES ═════════ */
.sec{ padding:clamp(64px,8vw,116px) 0; }
.sec--crema{ background:var(--crema-2); }
.sec--oscura{ background:var(--tinta); color:var(--crema-2); }
.sec--oscura .sec__p{ color:rgba(251,247,242,.66); }

.sec__head{ max-width:640px; margin:0 auto clamp(38px,5vw,62px); text-align:center; }
.sec__head--left{ margin-inline:0; text-align:left; }
.sec__head--row{
  max-width:none; display:flex; justify-content:space-between; align-items:flex-end;
  gap:26px; text-align:left; margin-bottom:clamp(30px,4vw,48px);
}
.sec__note{ font-size:14.5px; color:var(--tinta-2); max-width:30ch; padding-bottom:6px; }
.sec__head--left .btn{ margin-top:28px; }

/* ═════════ COLECCIONES ═════════ */
.cols{ display:grid; grid-template-columns:repeat(3,1fr); gap:18px; }
.col{
  position:relative; border-radius:var(--r-l); overflow:hidden;
  background:var(--crema-3); isolation:isolate; display:block;
  box-shadow:var(--sombra);
  transition:transform .45s cubic-bezier(.2,.7,.3,1), box-shadow .45s;
}
.col:hover{ transform:translateY(-5px); box-shadow:var(--sombra-l); }
.col__img{ width:100%; height:100%; position:absolute; inset:0; object-fit:cover; transition:transform .8s cubic-bezier(.2,.7,.3,1); }
.col:hover .col__img{ transform:scale(1.05); }
.col__pad{ position:relative; z-index:2; padding:26px; height:clamp(320px,30vw,410px); display:flex; flex-direction:column; justify-content:flex-end; }
.col__pad::before{
  content:""; position:absolute; inset:0; z-index:-1;
  background:linear-gradient(0deg, rgba(28,22,19,.82) 0%, rgba(28,22,19,.42) 38%, rgba(28,22,19,.02) 72%);
}
.col__n{ font-family:var(--ff-d); font-size:clamp(21px,2.4vw,27px); font-weight:400; color:#fff; letter-spacing:-.01em; line-height:1.15; }
.col__d{ color:rgba(255,255,255,.78); font-size:14.5px; margin-top:7px; max-width:34ch; }
.col__go{
  margin-top:16px; display:inline-flex; align-items:center; gap:8px;
  font-size:13px; letter-spacing:.12em; text-transform:uppercase; font-weight:500;
  color:#fff; opacity:.85; transition:gap .3s, opacity .3s;
}
.col:hover .col__go{ gap:14px; opacity:1; }

/* ═════════ NOVEDADES (carrusel) ═════════ */
.carrusel{ overflow:hidden; }
.carrusel__track{
  display:flex; gap:18px; overflow-x:auto; scroll-snap-type:x mandatory;
  padding:6px calc((100vw - min(100vw - 40px, var(--wrap)))/2) 12px;
  scrollbar-width:none; -ms-overflow-style:none; scroll-behavior:smooth;
}
.carrusel__track::-webkit-scrollbar{ display:none; }
.nov{
  flex:0 0 clamp(220px,25vw,282px); scroll-snap-align:start;
  background:var(--blanco); border-radius:var(--r-m); overflow:hidden;
  box-shadow:var(--sombra); display:flex; flex-direction:column;
  transition:transform .35s cubic-bezier(.2,.7,.3,1), box-shadow .35s;
}
.nov:hover{ transform:translateY(-5px); box-shadow:var(--sombra-l); }
.nov__ph{ position:relative; overflow:hidden; background:var(--crema-3); }
.nov__ph img{ width:100%; aspect-ratio:4/5; object-fit:cover; transition:transform .7s cubic-bezier(.2,.7,.3,1); }
.nov:hover .nov__ph img{ transform:scale(1.06); }
.nov__tag{
  position:absolute; top:12px; left:12px;
  background:rgba(251,247,242,.94); backdrop-filter:blur(6px);
  font-size:10.5px; letter-spacing:.16em; text-transform:uppercase; font-weight:500;
  padding:6px 11px; border-radius:999px; color:var(--caramelo-d);
}
.nov__in{ padding:16px 17px 18px; display:flex; flex-direction:column; gap:5px; flex:1; }
.nov__n{ font-family:var(--ff-d); font-size:17px; font-weight:400; line-height:1.25; }
.nov__t{ font-size:13px; color:var(--tinta-3); letter-spacing:.04em; }
.nov__wa{
  margin-top:auto; padding-top:13px; display:inline-flex; align-items:center; gap:7px;
  font-size:13.5px; font-weight:500; color:var(--caramelo-d); transition:gap .25s;
}
.nov__wa:hover{ gap:12px; }
.nov__wa svg{ width:15px; height:15px; }

.carrusel__nav{ display:flex; gap:10px; justify-content:flex-end; margin-top:20px; }
.cbtn{
  width:46px; height:46px; border-radius:50%; border:1px solid var(--linea);
  background:var(--blanco); display:grid; place-items:center; color:var(--tinta);
  transition:background .25s, color .25s, border-color .25s, transform .25s;
}
.cbtn svg{ width:20px; height:20px; }
.cbtn:hover{ background:var(--tinta); color:var(--crema); border-color:var(--tinta); transform:translateY(-2px); }

/* ═════════ TALLAS ═════════ */
.tallas{ background:var(--tinta); color:var(--crema-2); padding:clamp(56px,7vw,92px) 0; }
.tallas__in{ display:grid; grid-template-columns:1fr 1.1fr; gap:clamp(30px,5vw,70px); align-items:center; }
.tallas__h2{
  font-family:var(--ff-d); font-weight:300; font-size:clamp(28px,3.8vw,44px);
  line-height:1.12; letter-spacing:-.02em;
}
.tallas__h2 em{ font-style:italic; color:var(--rosa); font-weight:400; }
.tallas__copy p{ color:rgba(251,247,242,.66); margin-top:16px; max-width:42ch; }
.tallas__copy .link-arrow{ color:var(--rosa); border-color:rgba(231,205,197,.35); }
.tallas__copy .link-arrow:hover{ border-color:var(--rosa); }
.tallas__grid{ display:grid; grid-template-columns:repeat(auto-fill,minmax(78px,1fr)); gap:10px; }
.tallas__grid li{
  border:1px solid rgba(251,247,242,.16); border-radius:var(--r-s);
  padding:14px 6px; text-align:center; font-size:14.5px; letter-spacing:.04em;
  color:rgba(251,247,242,.82); transition:background .25s, border-color .25s, color .25s, transform .25s;
}
.tallas__grid li:hover{ background:rgba(251,247,242,.08); border-color:var(--rosa); color:#fff; transform:translateY(-2px); }

/* ═════════ SERVICIOS ═════════ */
.servs{ display:grid; grid-template-columns:repeat(3,1fr); gap:18px; }
.serv{
  background:var(--blanco); border:1px solid var(--linea); border-radius:var(--r-l);
  padding:30px 28px; transition:transform .35s cubic-bezier(.2,.7,.3,1), box-shadow .35s, border-color .35s;
}
.serv:hover{ transform:translateY(-4px); box-shadow:var(--sombra); border-color:var(--crema-3); }
.serv__i{
  width:48px; height:48px; border-radius:14px; background:var(--crema-2);
  color:var(--caramelo-d); display:grid; place-items:center; margin-bottom:20px;
}
.serv__i svg{ width:23px; height:23px; }
.serv__t{ font-family:var(--ff-d); font-size:20px; font-weight:400; letter-spacing:-.01em; }
.serv__d{ color:var(--tinta-2); font-size:15.5px; margin-top:9px; }

/* ═════════ RESEÑAS ═════════ */
.google{ display:inline-flex; align-items:center; gap:12px; margin-top:22px; padding:11px 20px; border:1px solid rgba(251,247,242,.16); border-radius:999px; }
.google__n{ font-family:var(--ff-d); font-size:22px; font-weight:500; line-height:1; }
.google__t{ font-size:13px; color:rgba(251,247,242,.6); }

.revs{ display:grid; grid-template-columns:repeat(3,1fr); gap:18px; }
.rev{
  background:rgba(251,247,242,.05); border:1px solid rgba(251,247,242,.12);
  border-radius:var(--r-l); padding:28px 26px;
  transition:background .35s, transform .35s cubic-bezier(.2,.7,.3,1);
}
.rev:hover{ background:rgba(251,247,242,.09); transform:translateY(-4px); }
.rev__stars{ display:flex; gap:2px; color:#E9B949; margin-bottom:16px; }
.rev__stars svg{ width:14px; height:14px; }
.rev__t{ font-family:var(--ff-d); font-size:17px; font-weight:300; line-height:1.55; font-style:italic; color:rgba(251,247,242,.9); }
.rev__n{ margin-top:18px; font-size:13px; letter-spacing:.1em; text-transform:uppercase; color:var(--rosa); }

/* ═════════ MOSAICO IG ═════════ */
.mosaico{ display:grid; grid-template-columns:repeat(8,1fr); gap:6px; padding-inline:6px; }
.mosaico a{ position:relative; overflow:hidden; background:var(--crema-3); display:block; }
.mosaico img{ width:100%; aspect-ratio:1; object-fit:cover; transition:transform .7s cubic-bezier(.2,.7,.3,1), filter .5s; }
.mosaico a:hover img{ transform:scale(1.08); }
.mosaico a::after{
  content:""; position:absolute; inset:0; background:rgba(43,35,32,.28);
  opacity:0; transition:opacity .4s;
}
.mosaico a:hover::after{ opacity:1; }
.mosaico a::before{
  content:""; position:absolute; inset:0; z-index:2; opacity:0; transition:opacity .4s;
  background:center/26px no-repeat url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='1.5'%3E%3Crect x='2.5' y='2.5' width='19' height='19' rx='5.5'/%3E%3Ccircle cx='12' cy='12' r='4.2'/%3E%3Ccircle cx='17.6' cy='6.4' r='1.1' fill='%23fff' stroke='none'/%3E%3C/svg%3E");
}
.mosaico a:hover::before{ opacity:1; }

/* ═════════ TIENDA ═════════ */
.tienda__in{ display:grid; grid-template-columns:1.05fr 1fr; gap:clamp(34px,6vw,84px); align-items:center; }
.tienda__art{ position:relative; padding:0 0 44px 44px; }
.tienda__img1{ width:100%; aspect-ratio:4/5; object-fit:cover; border-radius:var(--r-xl); box-shadow:var(--sombra-l); }
.tienda__img2{
  position:absolute; left:0; bottom:0; width:46%; aspect-ratio:3/4; object-fit:cover;
  border-radius:var(--r-m); border:7px solid var(--crema); box-shadow:var(--sombra-l);
}
.tienda__p{ color:var(--tinta-2); margin-top:18px; max-width:46ch; }

.datos{ margin-top:32px; border-top:1px solid var(--linea); }
.dato{ display:flex; gap:18px; padding:16px 0; border-bottom:1px solid var(--linea); align-items:baseline; }
.dato dt{ flex:0 0 132px; font-size:12px; letter-spacing:.18em; text-transform:uppercase; color:var(--tinta-3); }
.dato dd{ font-size:16px; color:var(--tinta); }
.dato dd small{ display:block; color:var(--tinta-2); font-size:14.5px; }
.tienda__btns{ display:flex; flex-wrap:wrap; gap:12px; margin-top:30px; }

/* ═════════ FAQ ═════════ */
.faq__in{ display:grid; grid-template-columns:.85fr 1.15fr; gap:clamp(30px,5vw,70px); align-items:start; }
.faq{ border-top:1px solid var(--linea); }
.faq__i{ border-bottom:1px solid var(--linea); }
.faq__q{
  width:100%; text-align:left; display:flex; align-items:center; gap:18px;
  padding:22px 0; font-family:var(--ff-d); font-size:19px; font-weight:400; line-height:1.35;
  transition:color .25s;
}
.faq__q:hover{ color:var(--caramelo-d); }
.faq__ico{ margin-left:auto; flex:none; width:26px; height:26px; position:relative; }
.faq__ico::before,.faq__ico::after{
  content:""; position:absolute; left:50%; top:50%; background:var(--caramelo);
  transform:translate(-50%,-50%); transition:transform .3s cubic-bezier(.2,.7,.3,1);
}
.faq__ico::before{ width:13px; height:1.5px; }
.faq__ico::after{ width:1.5px; height:13px; }
.faq__i.is-open .faq__ico::after{ transform:translate(-50%,-50%) scaleY(0); }
.faq__a{ overflow:hidden; height:0; transition:height .4s cubic-bezier(.2,.7,.3,1); }
.faq__a p{ padding:0 46px 24px 0; color:var(--tinta-2); font-size:16px; }

/* ═════════ CIERRE ═════════ */
.cierre{
  padding:clamp(64px,8vw,110px) 0;
  background:
    radial-gradient(80% 120% at 50% 0%, rgba(231,205,197,.5), rgba(245,237,227,0) 70%),
    var(--crema);
  border-top:1px solid var(--linea);
}
.cierre__in{ text-align:center; max-width:640px; margin-inline:auto; }
.cierre__h2{
  font-family:var(--ff-d); font-weight:300; font-size:clamp(30px,4.4vw,50px);
  line-height:1.1; letter-spacing:-.02em;
}
.cierre__p{ color:var(--tinta-2); margin-top:16px; }
.cierre__in .btn{ margin-top:30px; }
.cierre__nota{ margin-top:18px; font-size:13.5px; color:var(--tinta-3); }

/* ═════════ FOOTER ═════════ */
.pie{ background:var(--tinta); color:rgba(251,247,242,.66); padding:clamp(48px,6vw,74px) 0 26px; font-size:15px; }
.pie__in{ display:grid; grid-template-columns:1.4fr 1fr 1fr 1fr; gap:34px; }
.pie__col h3{ font-size:11.5px; letter-spacing:.2em; text-transform:uppercase; color:var(--rosa); margin-bottom:16px; font-weight:500; }
.pie__col a{ display:block; padding:4px 0; transition:color .2s; }
.pie__col a:hover{ color:var(--crema); }
.pie__col--marca .logo__name{ color:var(--crema); }
.pie__claim{ margin-top:8px; font-size:14px; }
.pie__social{ display:flex; gap:10px; margin-top:20px; }
.pie__social a{
  width:40px; height:40px; border-radius:50%; border:1px solid rgba(251,247,242,.18);
  display:grid; place-items:center; transition:background .25s, border-color .25s, transform .25s;
}
.pie__social a:hover{ background:rgba(251,247,242,.1); border-color:var(--rosa); transform:translateY(-2px); }
.pie__social svg{ width:18px; height:18px; }
.pie__bajo{
  margin-top:44px; padding-top:22px; border-top:1px solid rgba(251,247,242,.12);
  display:flex; justify-content:space-between; gap:14px; flex-wrap:wrap; font-size:13px;
  color:rgba(251,247,242,.45);
}
.pie__widy a{ color:rgba(251,247,242,.7); border-bottom:1px solid rgba(251,247,242,.25); }
.pie__widy a:hover{ color:var(--crema); }

/* ═════════ WHATSAPP FLOTANTE ═════════ */
.wa-float{
  position:fixed; right:20px; bottom:20px; z-index:70;
  display:inline-flex; align-items:center; gap:10px;
  background:var(--wa); color:#0B3D22; font-weight:500; font-size:15px;
  padding:14px 20px; border-radius:999px;
  box-shadow:0 8px 28px rgba(37,211,102,.4);
  transform:translateY(90px); opacity:0;
  transition:transform .45s cubic-bezier(.2,.7,.3,1), opacity .35s, background .25s, color .25s;
}
.wa-float.is-on{ transform:none; opacity:1; }
.wa-float:hover{ background:var(--wa-d); color:#fff; }
.wa-float svg{ width:22px; height:22px; flex:none; }

/* ═════════ ENTRADA DEL HERO ═════════ */
.enter{ animation:enter .9s cubic-bezier(.2,.7,.3,1) both; }
.enter--2{ animation-delay:.14s; }
.enter--3{ animation-delay:.28s; }
@keyframes enter{ from{ opacity:0; transform:translateY(20px) scale(.985); } to{ opacity:1; transform:none; } }

/* ═════════ REVEAL ═════════ */
.reveal{ opacity:0; transform:translateY(24px); transition:opacity .8s cubic-bezier(.2,.7,.3,1), transform .8s cubic-bezier(.2,.7,.3,1); }
.reveal.is-in{ opacity:1; transform:none; }

/* ════════════════════════════════════════════════
   RESPONSIVE
   ════════════════════════════════════════════════ */
@media (max-width:1080px){
  .cols{ grid-template-columns:repeat(2,1fr); }
  .servs{ grid-template-columns:repeat(2,1fr); }
  .revs{ grid-template-columns:repeat(2,1fr); }
  .pie__in{ grid-template-columns:1fr 1fr; }
}

@media (max-width:900px){
  .nav__links{
    position:fixed; inset:0 0 auto; top:calc(var(--nav-h) + 38px);
    flex-direction:column; gap:0; background:var(--crema);
    border-bottom:1px solid var(--linea); padding:8px 20px 22px;
    transform:translateY(-120%); transition:transform .4s cubic-bezier(.2,.7,.3,1);
    box-shadow:0 20px 40px rgba(43,35,32,.08);
  }
  .nav__links.is-open{ transform:none; }
  .nav__links a{ padding:15px 0; border-bottom:1px solid var(--linea); font-size:17px; }
  .nav__links a:last-child{ border-bottom:0; }
  .burger{ display:flex; }

  .hero__in{ grid-template-columns:1fr; }
  .hero__art{ order:-1; padding-bottom:22px; }
  .hero__figA img{ height:clamp(300px,62vw,430px); }
  .hero__figB{ left:auto; right:14px; bottom:-4px; width:118px; }
  .hero__badge{ right:auto; left:0; top:-14px; padding:12px 15px; max-width:196px; }
  .hero__badge-n{ width:38px; height:38px; }
  .hero__badge-t{ font-size:12px; }

  .tallas__in{ grid-template-columns:1fr; }
  .tienda__in{ grid-template-columns:1fr; }
  .tienda__art{ padding:0 0 36px 34px; max-width:520px; }
  .faq__in{ grid-template-columns:1fr; }
  .mosaico{ grid-template-columns:repeat(4,1fr); }
}

@media (max-width:640px){
  body{ font-size:16px; }
  :root{ --nav-h:66px; }
  .wrap{ width:min(100% - 32px, var(--wrap)); }
  .avisos{ font-size:12px; height:36px; }
  .nav__cta .btn span{ display:none; }
  .logo__name{ font-size:21px; }

  .cols{ grid-template-columns:1fr; gap:14px; }
  .col__pad{ height:300px; padding:22px; }

  .sec__head--row{ flex-direction:column; align-items:flex-start; }
  .servs{ grid-template-columns:1fr; }
  .revs{ grid-template-columns:1fr; }
  .pie__in{ grid-template-columns:1fr; gap:28px; }
  .dato{ flex-direction:column; gap:4px; }
  .dato dt{ flex:none; }
  .tallas__grid{ grid-template-columns:repeat(auto-fill,minmax(66px,1fr)); }
  .hero__trust{ grid-template-columns:1fr 1fr; justify-content:start; }
  .hero__trust .trust:last-child{ grid-column:span 2; }
  .wa-float{ right:14px; bottom:14px; padding:13px 18px; }
  .carrusel__nav{ justify-content:center; }
}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{ animation-duration:.01ms !important; animation-iteration-count:1 !important; transition-duration:.01ms !important; scroll-behavior:auto !important; }
  .reveal{ opacity:1; transform:none; }
}
