/* ============================================================
   Petti Organic — Detalles de Productos (páginas individuales)
   Hoja de estilos compartida por las 13 fichas de producto.
============================================================ */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0;}
:root{
  --green-black:#051c14;
  --green-forest:#0a291b;
  --brown-dark:#23180a;
  --teal:#92c0ca;
  --peach:#fca86b;
  --peach-light:#fcd2a0;
  --cream:#F5F0E8;
  --ivory:#FAF7F2;
  --white:#ffffff;
  --text-dark:#0f1a14;
  --text-muted:#5a6b62;
  --wa-green:#25D366;
  --wa-hover:#1ebe5b;
  --radius-sm:6px;--radius-md:12px;--radius-lg:20px;--radius-pill:50px;
  --shadow-sm:0 2px 12px rgba(5,28,20,.10);
  --shadow-md:0 8px 32px rgba(5,28,20,.15);
  --shadow-lg:0 20px 60px rgba(5,28,20,.20);
  --transition:.35s cubic-bezier(.4,0,.2,1);
}
html{scroll-behavior:smooth;font-size:16px;}
body{font-family:'Jost',sans-serif;font-weight:300;color:var(--text-dark);background:var(--cream);line-height:1.7;overflow-x:hidden;}
h1,h2,h3,h4{font-family:'Cormorant Garamond',serif;line-height:1.15;}
em{font-style:italic;color:var(--teal);}
.container{max-width:1180px;margin:0 auto;padding:0 1.5rem;}
a{color:inherit;}
.wa-icon{width:16px;height:16px;flex-shrink:0;}

/* Top bar */
.topbar{background:var(--green-black);padding:1rem 0;position:sticky;top:0;z-index:500;box-shadow:0 2px 20px rgba(0,0,0,.25);}
.topbar-inner{display:flex;align-items:center;justify-content:space-between;gap:1rem;flex-wrap:wrap;}
.topbar-logo{font-family:'Cormorant Garamond',serif;font-size:1.3rem;color:var(--white);text-decoration:none;letter-spacing:.04em;}
.topbar-back{font-size:.78rem;letter-spacing:.1em;text-transform:uppercase;color:rgba(255,255,255,.75);text-decoration:none;border:1px solid rgba(255,255,255,.3);padding:.5rem 1.1rem;border-radius:var(--radius-pill);transition:all var(--transition);}
.topbar-back:hover{background:rgba(255,255,255,.1);color:var(--white);}

/* Breadcrumb */
.pd-breadcrumb{padding:1.2rem 0 0;font-size:.75rem;color:var(--text-muted);letter-spacing:.02em;}
.pd-breadcrumb a{color:var(--green-forest);text-decoration:none;}
.pd-breadcrumb a:hover{color:var(--teal);}

/* Producto detalle (página individual) */
.product-detail-page{padding:2.5rem 0 5rem;background:var(--cream);}
.pd-grid{display:grid;grid-template-columns:0.85fr 1.15fr;gap:3.5rem;align-items:start;}
.pd-media{position:sticky;top:110px;}
.pd-media-main{width:100%;aspect-ratio:3/4;border-radius:var(--radius-lg);overflow:hidden;box-shadow:var(--shadow-md);background:var(--white);position:relative;}
.pd-media-main img{width:100%;height:100%;object-fit:cover;display:block;}
.pd-badge{position:absolute;top:1rem;left:1rem;font-size:.62rem;font-weight:600;letter-spacing:.15em;text-transform:uppercase;padding:.35rem .85rem;border-radius:var(--radius-pill);z-index:2;}
.badge-best{background:var(--peach);color:var(--brown-dark);}
.badge-new{background:var(--teal);color:var(--white);}

.pd-thumbs{display:grid;grid-template-columns:repeat(3,1fr);gap:.8rem;margin-top:.9rem;}
.pd-thumb{aspect-ratio:1/1;border-radius:var(--radius-md);overflow:hidden;border:2px solid transparent;background:var(--white);box-shadow:var(--shadow-sm);cursor:pointer;padding:0;margin:0;outline:none;transition:var(--transition);font:inherit;}
.pd-thumb img{width:100%;height:100%;object-fit:cover;display:block;}
.pd-thumb:hover{border-color:var(--teal);transform:translateY(-2px);}
.pd-thumb.active{border-color:var(--green-forest);box-shadow:var(--shadow-md);}

.pd-info .tag{display:inline-block;font-size:.68rem;font-weight:500;letter-spacing:.18em;text-transform:uppercase;padding:.35rem 1rem;border-radius:var(--radius-pill);border:1px solid var(--green-forest);color:var(--green-forest);margin-bottom:1rem;}
.pd-info h1{color:var(--green-black);font-size:clamp(1.9rem,3.4vw,2.6rem);margin-bottom:.4rem;}
.pd-tagline{color:var(--teal);font-style:italic;font-size:1rem;margin-bottom:1rem;}
.pd-price-row{display:flex;align-items:baseline;gap:.8rem;margin-bottom:1.2rem;}
.pd-price{font-family:'Cormorant Garamond',serif;font-size:2rem;font-weight:500;color:var(--green-black);}
.pd-content-size{font-size:.85rem;color:var(--text-muted);}
.pd-lead{color:var(--text-muted);font-size:.95rem;margin-bottom:1.6rem;}

.pd-actions{display:flex;gap:.8rem;flex-wrap:wrap;margin-bottom:2.2rem;}
.btn{display:inline-flex;align-items:center;gap:.6rem;padding:.85rem 1.8rem;font-family:'Jost',sans-serif;font-size:.82rem;font-weight:500;letter-spacing:.06em;border-radius:var(--radius-pill);text-decoration:none;border:2px solid transparent;cursor:pointer;transition:all var(--transition);white-space:nowrap;}
.btn-wa{background:var(--wa-green);color:var(--white);border-color:var(--wa-green);}
.btn-wa:hover{background:var(--wa-hover);border-color:var(--wa-hover);transform:translateY(-2px);}
.btn-outline-dark{background:transparent;color:var(--green-forest);border-color:var(--green-forest);}
.btn-outline-dark:hover{background:var(--green-forest);color:var(--white);}

.pd-block{margin-bottom:2.2rem;}
.pd-block h2{font-size:1.15rem;font-weight:500;color:var(--green-black);margin-bottom:.9rem;font-family:'Jost',sans-serif;}
.pd-tags-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:.7rem;}
.pd-tag-item{background:var(--white);border:1px solid rgba(10,41,27,.09);border-radius:var(--radius-sm);padding:.7rem .9rem;font-size:.82rem;color:var(--text-dark);}

.pd-steps{display:flex;flex-direction:column;gap:.9rem;}
.pd-step{display:flex;gap:.9rem;align-items:flex-start;}
.pd-step-num{width:26px;height:26px;border-radius:50%;background:var(--green-forest);color:var(--white);font-size:.78rem;display:flex;align-items:center;justify-content:center;flex-shrink:0;margin-top:.1rem;}
.pd-step p{font-size:.88rem;color:var(--text-muted);margin:0;}

.pd-ingredients{display:grid;grid-template-columns:repeat(2,1fr);gap:.9rem;}
.pd-ingredient{border:1px solid rgba(10,41,27,.1);border-radius:var(--radius-md);padding:1rem;background:var(--white);}
.pd-ingredient .ico{font-size:1.3rem;margin-bottom:.4rem;display:block;}
.pd-ingredient strong{font-size:.85rem;color:var(--green-black);display:block;margin-bottom:.15rem;}
.pd-ingredient span{font-size:.78rem;color:var(--text-muted);}

.pd-article{font-size:.92rem;color:var(--text-muted);line-height:1.85;}
.pd-article h2{font-size:1.25rem;}
.pd-article p{margin-bottom:.9rem;}
.pd-article strong{color:var(--text-dark);font-weight:500;}

.pd-diag-cta{background:var(--green-black);border-radius:var(--radius-md);padding:1.4rem 1.6rem;display:flex;align-items:center;justify-content:space-between;gap:1.2rem;flex-wrap:wrap;}
.pd-diag-cta p{color:rgba(255,255,255,.75);font-size:.88rem;margin:0;max-width:340px;}

/* Cross-sell (productos similares) */
.pd-crosssell-section{background:var(--ivory);padding:4rem 0;border-top:1px solid rgba(10,41,27,.08);}
.pd-crosssell-section h4{font-size:1.4rem;font-weight:500;color:var(--green-black);margin-bottom:1.6rem;text-align:center;}
.pd-cross-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1.2rem;}
.pd-cross-card{display:block;text-decoration:none;border:1px solid rgba(10,41,27,.1);border-radius:var(--radius-md);padding:1rem;background:var(--white);transition:all var(--transition);}
.pd-cross-card:hover{transform:translateY(-3px);box-shadow:var(--shadow-sm);border-color:var(--teal);}
.pd-cross-thumb{width:100%;aspect-ratio:1/1;border-radius:var(--radius-sm);overflow:hidden;margin-bottom:.6rem;background:var(--cream);}
.pd-cross-thumb img{width:100%;height:100%;object-fit:cover;display:block;}
.pd-cross-card p.name{font-size:.85rem;font-weight:500;color:var(--green-black);margin:0 0 .2rem;}
.pd-cross-card p.price{font-size:.8rem;color:var(--text-muted);margin:0;}

/* Diagnóstico final CTA */
#cta-final{background:var(--green-forest);padding:5rem 0;text-align:center;color:var(--white);}
#cta-final h2{color:var(--white);margin-bottom:.8rem;}
#cta-final h2 em{color:var(--teal);}
#cta-final p{max-width:560px;margin:0 auto 2rem;color:rgba(255,255,255,.72);font-size:.95rem;}

footer.simple-footer{background:var(--brown-dark);color:rgba(255,255,255,.55);padding:2.5rem 0;text-align:center;font-size:.8rem;}
footer.simple-footer a{color:var(--teal);text-decoration:none;}

#wa-float{position:fixed;bottom:1.8rem;right:1.8rem;z-index:900;width:56px;height:56px;background:var(--wa-green);border-radius:50%;display:flex;align-items:center;justify-content:center;text-decoration:none;box-shadow:0 4px 20px rgba(37,211,102,.5);}
#wa-float svg{width:28px;height:28px;}

@media (max-width:900px){
  .pd-grid{grid-template-columns:1fr;gap:2rem;}
  .pd-media{position:static;}
  .pd-tags-grid{grid-template-columns:1fr;}
  .pd-ingredients{grid-template-columns:1fr;}
  .pd-cross-grid{grid-template-columns:repeat(3,1fr);}
}
@media (max-width:600px){
  .pd-cross-grid{grid-template-columns:repeat(2,1fr);}
  .pd-diag-cta{flex-direction:column;align-items:flex-start;}
  .pd-thumbs{gap:.5rem;margin-top:.7rem;}
}