/* Naturalmente — página provisoria */
@font-face{font-family:"Raleway";font-style:normal;font-weight:300;font-display:swap;src:url(/assets/fonts/raleway-latin-300-normal.woff2) format("woff2")}
@font-face{font-family:"Raleway";font-style:normal;font-weight:400;font-display:swap;src:url(/assets/fonts/raleway-latin-400-normal.woff2) format("woff2")}
@font-face{font-family:"Raleway";font-style:normal;font-weight:500;font-display:swap;src:url(/assets/fonts/raleway-latin-500-normal.woff2) format("woff2")}
@font-face{font-family:"Raleway";font-style:normal;font-weight:600;font-display:swap;src:url(/assets/fonts/raleway-latin-600-normal.woff2) format("woff2")}
@font-face{font-family:"Raleway";font-style:normal;font-weight:700;font-display:swap;src:url(/assets/fonts/raleway-latin-700-normal.woff2) format("woff2")}

:root{
  --papel:#F4F1EC; --tinta:#2d261e; --marron:#342c22; --oscuro:#1c1813;
  --texto2:#4a4038; --crema:#e1ddd2; --suave:#cfc6b8; --linea:#ddd5c8;
  --hdr-h:max(4.714vw,60px);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:var(--hdr-h)}
@media (prefers-reduced-motion: reduce){html{scroll-behavior:auto}}
body{margin:0;background:var(--papel);color:var(--tinta);font-family:"Raleway",system-ui,sans-serif;-webkit-font-smoothing:antialiased}
img{max-width:100%}
h1,h2,p{margin:0}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
[hidden]{display:none !important}
.hp{position:absolute;left:-9999px;width:1px;height:1px;opacity:0}
.eyebrow{font-size:13px;font-weight:600;letter-spacing:.22em;text-transform:uppercase;color:var(--suave)}
:focus-visible{outline:2px solid var(--crema);outline-offset:3px}

/* Header: transparente sobre el hero, marrón al scrollear */
.hdr{position:fixed;top:0;left:0;right:0;z-index:50;height:var(--hdr-h);padding:0 max(5.807vw,20px);
  display:grid;grid-template-columns:1fr auto 1fr;align-items:center;
  background-color:rgba(52,44,34,0);transition:background-color .35s ease,box-shadow .35s ease}
.hdr.solido{background-color:var(--marron);box-shadow:0 1px 0 rgba(0,0,0,.25)}
.hdr-brand{display:flex;align-items:center;text-decoration:none;justify-self:start}
.hdr-wordmark{height:max(1.865vw,22px);width:auto;display:block}
.hdr-line{width:1px;height:max(1.98vw,22px);background:var(--crema);margin:0 max(1.3vw,10px) 0 max(1.72vw,12px)}
.hdr-arte{height:max(.807vw,9px);width:auto;display:block}
.hdr-n{height:max(3.21vw,38px);width:auto;display:block;justify-self:center}

/* Hero */
.hero{color:var(--papel);background:var(--oscuro) url(/assets/img/hero-serena.jpg) right center/cover no-repeat}
.hero-in{max-width:1360px;margin:0 auto;padding:0 32px;min-height:min(86vh,840px);display:flex;align-items:center}
.hero-copy{max-width:520px;padding:calc(var(--hdr-h) + 72px) 0 96px;display:flex;flex-direction:column;gap:28px}
.hero h1{font-size:clamp(44px,6vw,80px);line-height:1.02;font-weight:300;letter-spacing:-.02em}
.hero .lead{max-width:460px;font-size:19px;line-height:1.6;color:var(--crema)}
.f-aviso{display:flex;flex-wrap:wrap;gap:12px;max-width:520px}
.f-aviso input[type=email]{flex:1 1 240px;min-width:0;height:52px;padding:0 20px;font:inherit;font-size:16px;color:var(--papel);
  background:rgba(244,241,236,.08);border:1px solid #8a7f70;border-radius:999px}
.f-aviso input::placeholder{color:#b8ae9f}
.f-aviso button,.btn-claro{height:52px;padding:0 28px;font:inherit;font-size:16px;font-weight:600;color:var(--tinta);background:var(--papel);
  border:0;border-radius:999px;cursor:pointer;display:inline-flex;align-items:center;gap:10px;text-decoration:none}
.btn-claro span{font-weight:400;font-size:13px;color:#6b6157}
.f-aviso button:hover,.btn-claro:hover{background:#fff}
.nota{font-size:14px;color:#b8ae9f}
.nota.error{color:#f2b8a0}
.gracias{font-size:19px;font-weight:500}

/* Colección */
.coleccion{max-width:1240px;margin:0 auto;padding:96px 24px;display:flex;flex-direction:column;gap:48px}
.col-head{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:flex-end;gap:24px}
.col-head h2{font-size:clamp(32px,4vw,48px);line-height:1.1;font-weight:300;letter-spacing:-.01em;max-width:640px}
.col-head p{max-width:420px;font-size:17px;line-height:1.6;color:var(--texto2)}
.cards{display:flex;flex-wrap:wrap;gap:32px}
.cards article{flex:1 1 300px;min-width:0;display:flex;flex-direction:column;gap:20px}
.cards img{width:100%;height:auto;aspect-ratio:900/1272;object-fit:cover;display:block;border-radius:4px}
.cards p{font-size:17px;line-height:1.55;color:var(--texto2)}
.cards strong{font-weight:700;color:var(--tinta)}

/* Empresas + carrusel */
.emp{background:var(--tinta);color:var(--papel);display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);min-height:760px}
.emp-car{position:relative;overflow:hidden;background:var(--oscuro);min-height:760px}
.car-slides img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block;opacity:0;transition:opacity 1.1s ease}
.car-slides img.activa{opacity:1}
.car-ui{position:absolute;left:24px;right:24px;bottom:24px;display:flex;align-items:center;justify-content:space-between;gap:12px}
.car-count{font-size:13px;letter-spacing:.12em;background:rgba(28,24,19,.55);padding:8px 14px;border-radius:999px}
.car-btns{display:flex;gap:8px}
.car-btns button{width:44px;height:44px;border-radius:999px;border:0;background:rgba(28,24,19,.55);color:var(--papel);cursor:pointer;display:flex;align-items:center;justify-content:center}
.car-btns button:hover{background:rgba(28,24,19,.8)}
.emp-copy{display:flex;flex-direction:column;justify-content:center;gap:24px;padding:96px max(5.807vw,24px) 96px 72px}
.emp-copy h2{font-size:clamp(32px,4vw,52px);line-height:1.08;font-weight:300;letter-spacing:-.01em}
.emp-copy .lead{max-width:500px;font-size:18px;line-height:1.6;color:var(--crema)}
.f-cat{display:flex;flex-direction:column;gap:16px;max-width:520px;padding-top:8px}
.campos{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.campo{display:flex;flex-direction:column;gap:6px}
.campo-full{grid-column:1/-1}
.campo label{font-size:13px;font-weight:500;color:var(--suave)}
.campo input{height:48px;padding:0 16px;font:inherit;font-size:16px;color:var(--papel);background:rgba(244,241,236,.06);border:1px solid #6e6458;border-radius:10px}
.campo input:focus{border-color:var(--crema);outline:none}
.f-cat .btn-claro{align-self:flex-start}
.descargas{display:flex;flex-direction:column;gap:16px;max-width:560px}
.descargas[hidden]{display:none}
.ok{font-size:19px;font-weight:500}
.desc-btns{display:flex;flex-wrap:wrap;gap:12px}
.contacto{display:flex;flex-wrap:wrap;align-items:center;gap:20px;padding-top:8px;border-top:1px solid rgba(244,241,236,.15);margin-top:8px;padding-top:24px;max-width:520px}
.btn-borde{height:48px;padding:0 24px;display:inline-flex;align-items:center;font-size:15px;font-weight:600;color:var(--papel);border:1px solid var(--papel);border-radius:999px;text-decoration:none}
.btn-borde:hover{background:rgba(244,241,236,.08)}
.link-claro{color:var(--suave);font-size:15px}
.link-claro:hover{color:var(--papel)}

/* Pie */
.pie{max-width:1240px;margin:0 auto;padding:72px 24px 56px;display:flex;flex-direction:column;align-items:center;gap:20px;text-align:center}
.pie-n{height:64px;width:auto}
.pie-wm{height:24px;width:auto}
.pie-lema{font-size:clamp(24px,3vw,34px);font-weight:300}
.pie-legal{font-size:14px;color:#6b6157}

/* Celular */
@media (max-width: 860px){
  .emp{grid-template-columns:minmax(0,1fr)}
  .emp-car{min-height:0;height:115vw}
  .emp-copy{padding:56px 24px 72px}
}
@media (max-width: 760px){
  .hdr{grid-template-columns:1fr auto}
  .hdr-n{justify-self:end}
  .hdr-line,.hdr-arte{display:none}
  .hero{background-image:linear-gradient(to bottom,rgba(28,24,19,0) 30%,rgba(28,24,19,.92) 62%),url(/assets/img/hero-serena-movil.jpg);
    background-position:center top,center top;background-size:100% 98vw,100% auto}
  .hero-in{padding:0 24px}
  .hero-copy{padding:72vw 0 64px}
  .campos{grid-template-columns:minmax(0,1fr)}
}