:root{
  --pink:#F9C1B4;
  --pink-soft:#FBCEC2;
  --navy:#2E313D;
  --slate:#5C6D96;
  --text-dark:#2E313D;
}
*{ box-sizing:border-box; margin:0; padding:0; }
body{
  font-family:"Montserrat", Arial, sans-serif;
  color:var(--text-dark);
  background:#fff;
}
h1,h2,h3{ font-family:"Cormorant Garamond", Georgia, serif; font-weight:500; }
a{ color:inherit; text-decoration:none; }
img{ max-width:100%; display:block; }
ul{ list-style:none; }

.ph{
  background: repeating-linear-gradient(135deg, #d8d8d8 0 2px, #e9e9e9 2px 18px);
  display:flex; align-items:center; justify-content:center;
  color:#8a8a8a; font-size:0.72rem; letter-spacing:0.04em; text-align:center; padding:8px;
}

/* topbar */
.topbar{ background:var(--pink); padding:14px 24px; display:flex; align-items:center; justify-content:space-between; }
.topbar .tagline{ flex:1; font-family:"Cormorant Garamond", serif; font-size:1.05rem; text-align:center; letter-spacing:0.18em; line-height:1.4; }
.topbar .actions{ display:flex; align-items:center; gap:22px; font-size:0.85rem; }
.topbar .actions .login{ display:flex; align-items:center; gap:6px; }
.topbar .bag-icon{ display:flex; align-items:center; }

/* main nav */
.mainnav{ background:var(--navy); color:#fff; padding:16px 24px; display:flex; align-items:center; justify-content:space-between; }
.mainnav .brand{ display:flex; align-items:center; gap:14px; }
.brand-icon{ width:38px; height:38px; border:1.5px solid #fff; display:grid; place-items:center; }
.brand-icon svg{ width:20px; height:20px; }
.brand-name{ font-weight:700; font-size:1.05rem; line-height:1.2; text-transform:uppercase; }
.mainnav ul{ display:flex; gap:34px; }
.mainnav ul a{ font-size:0.82rem; font-weight:500; }
.mainnav ul a:hover{ color:var(--pink); }
.nav-toggle{ display:none; background:none; border:none; color:#fff; font-size:1.4rem; }

/* hero */
.hero{ background:#fff; }

.hero-inner{
  max-width:1300px;
  margin:0 auto;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:48px;
  flex-wrap:wrap;
}

.hero-text{ flex:1 1 340px; text-align:left; }

/* La foto se muestra a su tamaño real (procesada a 980x651 en el servidor),
   escalada dentro de su columna, y SIEMPRE centrada horizontalmente en su
   propio espacio — nunca se desborda ni se estira fuera de su caja. */
.hero-photo{
  flex:1 1 380px;
  width:100%;
  max-width:325px;
  aspect-ratio:360 / 500;
  margin:0 auto;
  display:block;
  object-fit:cover;
  object-position:center;
}

.hero h1{ font-size:clamp(2.1rem, 4vw, 3.1rem); line-height:1.15; text-transform:lowercase; }
.btn{ display:inline-block; margin-top:36px; background:var(--pink); color:var(--text-dark); padding:16px 32px; font-size:0.85rem; font-weight:600; }
.btn:hover{ background:var(--pink-soft); }

/* cta block */
.cta-outer{ background:var(--pink); padding:40px; }
.cta-inner{ background:var(--navy); max-width:1300px; margin:0 auto; padding:80px 40px; text-align:center; }
.cta-inner h2{ color:var(--pink); font-size:2rem; margin-bottom:22px; }
.cta-inner p{ color:#fff; font-size:1.25rem; font-weight:600; margin-bottom:26px; text-align: justify}
.cta-inner a.more{ color:#fff; text-decoration:underline; font-size:0.78rem; font-weight:700; }

/* references */

/* split packages */
.split{ position:relative; min-height:490px; background:#fff; }
.split-bg{ position:absolute; inset:0; display:flex; }
.split-bg .half{ flex:1; position:relative; overflow:hidden; }
.split-bg .half img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position:center; display:block; }
.split-bg .half.slate{ background-color:var(--slate); }
.split-bg .half.white{ background-color:#fff; }
.split-cards{ position:relative; display:flex; max-width:820px; margin:0 auto; padding-top:60px; }
.split-card{ flex:1; padding:70px 40px; text-align:center; }
.split-card.video{ background:var(--navy); color:#fff; }
.split-card.photo{ background:var(--pink); color:var(--text-dark); }
.split-card h3{ font-size:1.6rem; margin-bottom:34px; }
.split-card .buy{ display:inline-block; padding:12px 26px; font-size:0.78rem; font-weight:700; }
.split-card.video .buy{ background:var(--pink); color:var(--text-dark); }
.split-card.photo .buy{ background:var(--navy); color:#fff; }

/* bestsellers */
.bestsellers{ padding:90px 40px 100px; text-align:center; }
.bestsellers h2{ font-size:2.1rem; letter-spacing:0.06em; margin-bottom:56px; }
.products{ display:grid; grid-template-columns:repeat(4, 1fr); gap:30px; text-align:left; }
.product{ position:relative; }
.product .image{ aspect-ratio:1; position:relative; overflow:hidden; }
.product .image img{ width:100%; height:100%; object-fit:cover; }
.product .tag{ position:absolute; top:10px; left:10px; background:var(--text-dark); color:#fff; font-size:0.65rem; padding:5px 10px; }
.product .name{ margin-top:16px; font-size:0.85rem; }
.product .pack-count{ margin-top:4px; font-size:0.75rem; color:#777; }
.product .price{ margin-top:6px; font-family:"Cormorant Garamond", serif; font-size:1rem; color:var(--navy); }

/* footer */
footer{ background:var(--navy); color:#fff; }
.footer-cta{ padding:80px 40px 60px; max-width:700px; margin:0 auto; text-align:center; }
.footer-cta h2{ color:var(--pink); font-size:1.6rem; margin-bottom:28px; font-family:"Cormorant Garamond",serif; font-weight:500; }
.footer-social{ display:flex; justify-content:center; gap:20px; padding:0 40px 50px; max-width:1300px; margin:0 auto; }
.footer-social a{ width:34px; height:34px; border-radius:50%; border:1px solid rgba(255,255,255,0.5); display:grid; place-items:center; }
.footer-bottom{ background:var(--pink); color:var(--text-dark); text-align:center; padding:16px; font-size:0.8rem; }

/* dueño viendo su propia página */
.owner-bar{ background:var(--text-dark); color:#fff; text-align:center; padding:10px; font-size:0.8rem; }
.owner-bar a{ text-decoration:underline; }

@media (max-width: 960px){
  .mainnav ul{ display:none; }
  .nav-toggle{ display:block; }
  .topbar{ flex-wrap:wrap; gap:12px; justify-content:center; text-align:center; }
  .split-cards{ flex-direction:column; }
  .products{ grid-template-columns:repeat(2,1fr); }
}
@media (max-width:560px){
  .hero, .cta-inner, .reviews, .bestsellers, .footer-cta, .footer-social{ padding-left:20px; padding-right:20px; }
  .products{ grid-template-columns:1fr; }
  form.newsletter .field{ min-width:100%; }
}

/* packs (antes "paquetes"/"más vendidos") */
.pack-caption{ font-size:0.82rem; margin-bottom:8px; opacity:0.9; }
.pack-count{ font-size:0.75rem; margin-bottom:20px; opacity:0.75; }
.video-badge{
  display:inline-block; background:var(--navy); color:#fff;
  font-size:0.62rem; text-transform:uppercase; letter-spacing:0.04em;
  padding:4px 9px; position:absolute; top:10px; right:10px;
}
.product{ position:relative; }

/* comentarios de clientes */
.reviews{ background:#fff; padding:80px 40px 90px; }
.reviews h2{ color:var(--navy); text-align:center; font-size:2rem; margin-bottom:48px; }
.reviews-grid{ max-width:1100px; margin:0 auto; display:grid; grid-template-columns:repeat(3, 1fr); gap:26px; }
.review-card{ background:#f7f4ee; border:1px solid #e7e1d8; padding:26px 24px; }
.review-card .stars{ color:#c98a3d; letter-spacing:2px; margin-bottom:12px; font-size:1rem; }
.review-card p{ color:var(--text-dark); font-size:0.9rem; line-height:1.55; }
.review-card .review-meta{ margin-top:14px; font-size:0.78rem; color:#777; }
.reviews-empty{ text-align:center; color:#888; font-size:0.9rem; }
@media (max-width:900px){ .reviews-grid{ grid-template-columns:1fr; } }

.review-hidden{ display:none; }

/* boton "ver mas" */
.btn-outline{
  background:none; border:1.5px solid var(--navy); color:var(--navy);
  padding:12px 34px; font-size:0.82rem; font-weight:700; letter-spacing:0.02em;
  cursor:pointer; font-family:"Montserrat", sans-serif;
}
.btn-outline:hover{ background:var(--navy); color:#fff; }

/* lightbox: popup de foto/video a tamano completo */
.lightbox-overlay{
  display:none;
  position:fixed; inset:0; z-index:1000;
  background:rgba(20,21,27,0.92);
  align-items:center; justify-content:center;
  padding:30px;
}
.lightbox-overlay.open{ display:flex; }
.lightbox-content{
  max-width:min(92vw, 1100px); max-height:88vh;
  display:flex; align-items:center; justify-content:center;
}
.lightbox-content img, .lightbox-content video{
  max-width:100%; max-height:88vh;
  object-fit:contain;
  display:block;
}
.lightbox-close{
  position:absolute; top:22px; right:28px;
  background:none; border:none; color:#fff;
  font-size:2.2rem; line-height:1; cursor:pointer;
  font-family:Arial, sans-serif;
}
.lightbox-nav{
  position:absolute; top:50%; transform:translateY(-50%);
  background:rgba(255,255,255,0.12); border:none; color:#fff;
  font-size:1.8rem; width:52px; height:52px; cursor:pointer;
  display:flex; align-items:center; justify-content:center;
}
.lightbox-nav:hover{ background:rgba(255,255,255,0.25); }
.lightbox-prev{ left:20px; }
.lightbox-next{ right:20px; }
.work-gallery-item{ cursor:zoom-in; }
