/* ============================================================
   PONTI — Inicio y páginas
   ============================================================ */

/* ------------------------------------------------------------
   HERO
   ------------------------------------------------------------ */
.pt-hero{
  position:relative;
  background:var(--pt-bone);
  background-size:cover;
  background-position:center;
  min-height:clamp(24rem,58vh,38rem);
  display:flex;
  align-items:flex-end;
  padding:var(--pt-gut);
}
.pt-hero--image::after{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(to right, rgba(20,18,15,.42) 0%, rgba(20,18,15,.12) 55%, transparent 100%);
}
.pt-hero__panel{
  position:relative;
  z-index:2;
  max-width:34rem;
  background:var(--pt-paper);
  padding:clamp(1.5rem,3vw,2.5rem);
}
.pt-hero__title{
  font-family:var(--pt-serif);
  font-size:clamp(1.9rem,4.4vw,3.1rem);
  font-weight:300;
  line-height:1.08;
  letter-spacing:-.015em;
  margin:.7rem 0 .85rem;
}
.pt-hero__title em{ font-style:italic; }
.pt-hero__body{
  color:var(--pt-slate);
  font-size:.97rem;
  max-width:38ch;
  margin:0 0 1.5rem;
}

/* ------------------------------------------------------------
   LAS TRES PUERTAS
   ------------------------------------------------------------ */
.pt-doors{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:1px;
  background:var(--pt-rule);
  margin-top:1px;
}
.pt-door{
  position:relative;
  display:block;
  background:var(--pt-bone);
  text-decoration:none;
  color:var(--pt-ink);
  overflow:hidden;
}
.pt-door__stage{
  display:block;
  aspect-ratio:4/3;
  background:var(--pt-bone);
  overflow:hidden;
}
.pt-door__stage img{
  width:100%; height:100%;
  object-fit:cover;
  transition:transform .55s cubic-bezier(.2,.7,.3,1);
}
.pt-door:hover .pt-door__stage img{ transform:scale(1.045); }
.pt-door__label{
  display:block;
  padding:clamp(1.1rem,2vw,1.6rem);
  background:var(--pt-paper);
}
.pt-door__name{
  display:block;
  font-size:clamp(1.15rem,2.2vw,1.5rem);
  font-weight:600;
  letter-spacing:-.02em;
  margin-top:.35rem;
}
.pt-door__name::after{
  content:" →";
  color:var(--pt-ash);
  transition:color .2s ease;
}
.pt-door:hover .pt-door__name::after{ color:var(--pt-ink); }

/* ------------------------------------------------------------
   ESTANTERÍA DE DESTACADOS
   ------------------------------------------------------------ */
.pt-shelf{
  padding:clamp(3rem,6.4vw,5.5rem) 0 0;
}
.pt-shelf__head{
  display:flex;
  justify-content:space-between;
  align-items:flex-end;
  gap:1rem;
  flex-wrap:wrap;
  padding:0 var(--pt-gut) 1.1rem;
  border-bottom:1px solid var(--pt-rule);
  margin:0 0 0;
}
.pt-shelf__head h2{
  font-size:clamp(1.35rem,2.6vw,1.8rem);
  font-weight:600;
  letter-spacing:-.025em;
  margin:.3rem 0 0;
}
.pt-shelf .products{
  grid-template-columns:repeat(4,1fr) !important;
}

/* ------------------------------------------------------------
   EXCLUSIVO ONLINE — el único bloque sobre tinta
   ------------------------------------------------------------ */
.pt-online{
  background:var(--pt-ink);
  color:var(--pt-paper);
  margin-top:clamp(3rem,6.4vw,5.5rem);
  padding:clamp(2.25rem,4.4vw,3.5rem) var(--pt-gut);
  display:grid;
  grid-template-columns:1fr auto;
  gap:clamp(1.75rem,4vw,3.5rem);
  align-items:center;
}
.pt-online .pt-eyebrow{ color:var(--pt-ash); }
.pt-online h2{
  font-size:clamp(1.35rem,2.8vw,2rem);
  font-weight:600;
  letter-spacing:-.025em;
  margin:.6rem 0 .6rem;
  color:var(--pt-paper);
}
.pt-online p{
  color:var(--pt-ash);
  font-size:.9rem;
  max-width:42ch;
  margin:0 0 1.5rem;
}
.pt-btn--invert{
  background:var(--pt-paper);
  border-color:var(--pt-paper);
  color:var(--pt-ink);
}
.pt-btn--invert:hover{
  background:var(--pt-taupe);
  border-color:var(--pt-taupe);
  color:var(--pt-ink);
}
.pt-online__strip{
  display:flex;
  gap:.7rem;
}
.pt-online__item{
  display:block;
  width:clamp(6rem,11vw,9.5rem);
  background:var(--pt-bone);
}
.pt-online__item img{
  width:100%;
  aspect-ratio:4/5;
  object-fit:cover;
  display:block;
  transition:opacity .25s ease;
}
.pt-online__item:hover img{ opacity:.86; }

/* ------------------------------------------------------------
   PROMESAS DE SERVICIO
   ------------------------------------------------------------ */
.pt-service{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  border-top:1px solid var(--pt-rule);
}
.pt-service__item{
  padding:clamp(1.75rem,3.5vw,2.75rem) var(--pt-gut);
  border-right:1px solid var(--pt-rule);
}
.pt-service__item:last-child{ border-right:none; }
.pt-service__num{
  font-family:var(--pt-serif);
  font-size:1.5rem;
  font-weight:300;
  color:var(--pt-ash);
  line-height:1;
  font-variant-numeric:tabular-nums;
}
.pt-service__item h3{
  font-size:.97rem;
  font-weight:600;
  letter-spacing:-.01em;
  margin:.65rem 0 .35rem;
}
.pt-service__item p{
  font-size:.845rem;
  color:var(--pt-slate);
  max-width:32ch;
  margin:0;
}

/* ------------------------------------------------------------
   PÁGINAS DE CONTENIDO
   ------------------------------------------------------------ */
.pt-page{
  max-width:44rem;
  margin:0 auto;
  padding:clamp(2.25rem,4.4vw,3.5rem) var(--pt-gut) clamp(3rem,6.4vw,5.5rem);
}
.pt-page--center{ text-align:center; }
.pt-page__title{
  font-size:clamp(1.6rem,3.4vw,2.4rem);
  font-weight:600;
  letter-spacing:-.025em;
  line-height:1.1;
  margin:.5rem 0 1.35rem;
}
.pt-page__content p{ margin:0 0 1.1rem; }
.pt-page__content h2{ margin:2rem 0 .75rem; }
.pt-page__content h3{ margin:1.5rem 0 .5rem; }

/* Contenedor de tienda */
.pt-shop{ padding-bottom:clamp(3rem,6.4vw,5.5rem); }

/* ------------------------------------------------------------
   RESPONSIVE
   ------------------------------------------------------------ */
@media(max-width:1000px){
  .pt-shelf .products{ grid-template-columns:repeat(2,1fr) !important; }
  .pt-doors{ grid-template-columns:1fr; }
  .pt-door__stage{ aspect-ratio:16/9; }
  .pt-online{ grid-template-columns:1fr; }
  .pt-online__strip{ overflow-x:auto; scrollbar-width:none; }
  .pt-online__strip::-webkit-scrollbar{ display:none; }
  .pt-service{ grid-template-columns:1fr; }
  .pt-service__item{
    border-right:none;
    border-bottom:1px solid var(--pt-rule);
  }
  .pt-service__item:last-child{ border-bottom:none; }
}

@media(max-width:640px){
  .pt-hero{
    min-height:clamp(33rem,82vh,44rem);
    padding:0;
    display:flex;
    align-items:flex-end;
    overflow:hidden;
    background-position:center center;
  }
  .pt-hero--image{
    aspect-ratio:auto;
    max-height:none;
    display:flex;
  }
  .pt-hero--image::after{
    background:linear-gradient(to top, rgba(20,18,15,.82) 0%, rgba(20,18,15,.56) 42%, rgba(20,18,15,.10) 100%);
  }
  .pt-hero__panel{
    max-width:none;
    width:100%;
    margin:0;
    padding:1.6rem 1.5rem 1.8rem;
    position:relative;
    top:0;
    background:linear-gradient(to top, rgba(20,18,15,.84) 0%, rgba(20,18,15,.68) 58%, rgba(20,18,15,0) 100%);
    color:var(--pt-paper);
  }
  .pt-hero--image .pt-hero__panel{
    position:absolute;
    left:0; right:0; bottom:0;
  }
  .pt-hero__panel .pt-eyebrow{
    color:rgba(255,255,255,.78);
  }
  .pt-hero__title,
  .pt-hero__title em,
  .pt-hero__body{
    color:var(--pt-paper);
  }
  .pt-hero__body{
    max-width:22ch;
    font-size:1rem;
    margin-bottom:1.35rem;
  }
  .pt-hero__panel .pt-btn{
    background:var(--pt-paper);
    border-color:var(--pt-paper);
    color:var(--pt-ink);
  }
  .pt-hero__panel .pt-btn:hover{
    background:#f1ece7;
    border-color:#f1ece7;
    color:var(--pt-ink);
  }
}

/* ============================================================
   PONTI 2.3.1 — cierre de Home alineado al wireframe aprobado
   ============================================================ */

/* La Home usa tarjetas de WooCommerce, pero con proporción editorial
   horizontal y una sola fila de cuatro en escritorio. */
.pt-shelf{
  overflow:hidden;
}
.pt-shelf .products{
  margin-top:1rem !important;
  gap:clamp(.9rem,1.8vw,1.35rem) !important;
}
.pt-shelf .products li.product img,
.pt-shelf .products li.product .pt-card__alt{
  aspect-ratio:4/3 !important;
}
.pt-shelf .products li.product .woocommerce-loop-product__title{
  padding-top:.65rem !important;
}

/* Exclusivo Online: bloque oscuro compacto, texto a la izquierda,
   tres imágenes en una sola línea a la derecha. */
.pt-online{
  margin-left:var(--pt-gut);
  margin-right:var(--pt-gut);
  padding:clamp(1.65rem,3vw,2.35rem) clamp(1.65rem,3vw,2.6rem);
  grid-template-columns:minmax(16rem,1fr) minmax(28rem,42rem);
  min-height:11.5rem;
}
.pt-online__strip{
  width:100%;
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:.7rem;
}
.pt-online__item{
  width:auto;
  min-width:0;
  overflow:hidden;
}
.pt-online__item img{
  width:100%;
  aspect-ratio:4/3;
  object-fit:cover;
}

/* THE PONTI LOOK — exactamente después de Exclusivo Online. */
.pt-look{
  margin:clamp(2rem,4.2vw,3.25rem) var(--pt-gut) clamp(3rem,6vw,5rem);
  padding-top:0;
}
.pt-look__eyebrow{
  display:block;
  margin-bottom:.85rem;
}
.pt-look__row{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  gap:clamp(1.5rem,3vw,3rem);
  align-items:center;
}
.pt-look__products{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto minmax(0,1fr) auto minmax(0,1fr);
  gap:clamp(.65rem,1.4vw,1rem);
  align-items:center;
}
.pt-look__plus{
  font-size:1.35rem;
  font-weight:500;
  line-height:1;
  color:var(--pt-ink);
}
.pt-look__item{
  display:block;
  background:var(--pt-bone);
  overflow:hidden;
  text-decoration:none;
}
.pt-look__item img{
  width:100%;
  aspect-ratio:3.25/1;
  object-fit:cover;
  display:block;
  transition:transform .35s ease, opacity .25s ease;
}
.pt-look__item:hover img{
  transform:scale(1.025);
  opacity:.94;
}
.pt-look__cta{
  min-width:clamp(12.5rem,15vw,15rem);
  text-align:center;
  white-space:nowrap;
}

@media(max-width:1000px){
  .pt-online{
    grid-template-columns:1fr;
  }
  .pt-online__strip{
    overflow-x:visible;
  }
  .pt-look__row{
    grid-template-columns:1fr;
  }
  .pt-look__cta{
    justify-self:start;
  }
}

@media(max-width:700px){
  .pt-shelf .products{
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
  }
  .pt-online{
    margin-left:0;
    margin-right:0;
  }
  .pt-online__strip{
    display:flex;
    overflow-x:auto;
    scroll-snap-type:x mandatory;
    scrollbar-width:none;
  }
  .pt-online__strip::-webkit-scrollbar{ display:none; }
  .pt-online__item{
    flex:0 0 72%;
    scroll-snap-align:start;
  }
  .pt-look{
    margin-left:var(--pt-gut);
    margin-right:0;
    overflow:hidden;
  }
  .pt-look__products{
    display:flex;
    overflow-x:auto;
    gap:.7rem;
    padding-right:var(--pt-gut);
    scroll-snap-type:x mandatory;
    scrollbar-width:none;
  }
  .pt-look__products::-webkit-scrollbar{ display:none; }
  .pt-look__item{
    flex:0 0 78%;
    scroll-snap-align:start;
  }
  .pt-look__item img{
    aspect-ratio:16/7;
  }
  .pt-look__plus{
    flex:0 0 auto;
  }
}


/* ------------------------------------------------------------
   JOURNAL / BLOG EN PORTADA — 2.3.3
   ------------------------------------------------------------ */
.pt-home-blog{
  margin:0;
  padding:clamp(3rem,6vw,5rem) var(--pt-gut);
  border-top:1px solid var(--pt-rule);
}
.pt-home-blog__head{
  display:flex;
  justify-content:space-between;
  align-items:flex-end;
  gap:1.5rem;
  margin-bottom:1.35rem;
}
.pt-home-blog__head h2{
  font-size:clamp(1.5rem,3vw,2.15rem);
  line-height:1.1;
  letter-spacing:-.03em;
  margin:.35rem 0 0;
}
.pt-home-blog__grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:clamp(1rem,2vw,1.6rem);
}
.pt-home-blog .pt-blog-card{
  min-width:0;
}
.pt-home-blog .pt-blog-card__media{
  display:block;
  background:var(--pt-bone);
  overflow:hidden;
}
.pt-home-blog .pt-blog-card__image,
.pt-home-blog .pt-blog-card__placeholder{
  width:100%;
  aspect-ratio:4/3;
  object-fit:cover;
  display:block;
}
.pt-home-blog .pt-blog-card__placeholder{ background:var(--pt-bone); }
.pt-home-blog .pt-blog-card__body{ padding-top:.9rem; }
.pt-home-blog .pt-blog-card__title{
  font-size:1.12rem;
  line-height:1.25;
  margin:.45rem 0 .4rem;
}
.pt-home-blog .pt-blog-card__title a{
  color:var(--pt-ink);
  text-decoration:none;
}
.pt-home-blog .pt-blog-card__body p{
  color:var(--pt-slate);
  font-size:.85rem;
  line-height:1.55;
  margin:0 0 .65rem;
}
.pt-home-blog .pt-blog-card__more{
  color:var(--pt-ink);
  font-size:.72rem;
  font-weight:600;
  text-decoration:none;
  border-bottom:1px solid var(--pt-rule);
  padding-bottom:.18rem;
}
@media(max-width:800px){
  .pt-home-blog__grid{ grid-template-columns:1fr; }
  .pt-home-blog__head{ align-items:flex-start; flex-direction:column; }
}