/* GENERATED from pages/css/poster.css by site/build.py */
/* ---------- product detail ----------
   Image column scrolls, buy column sticks -- the one structural move worth
   taking from the GARM template. Everything else here is the homepage's
   system: Chivo, the cochinilla palette, the 28px gutter, and the same button
   block used by the hero CTA and the split pills. */
.pdp{
  display:grid;
  grid-template-columns:minmax(0,5fr) minmax(0,3fr);
  border-bottom:1px solid var(--tinta);
}
.pdp[hidden]{display:none}

.pdp-art{
  background:var(--marco);
  border-right:1px solid var(--tinta);
  padding:clamp(28px,4vw,64px) clamp(20px,3vw,56px);
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  gap:18px;
}
.pdp-figure{position:relative;margin:0;width:100%;max-width:620px}
/* aspect-ratio as well as the width/height attributes: the attributes cover
   the empty-src moment, this covers any future non-square asset landing here
   without anyone noticing the box collapse. Every mockup is 1:1 today. */
.pdp-art img{width:100%;height:auto;display:block;aspect-ratio:1/1;background:var(--marco)}
.pdp-chip[hidden],.pdp-example[hidden]{display:none}
.pdp-example{
  font-size:11px;line-height:1.6;letter-spacing:.05em;
  color:var(--carbon);text-align:center;max-width:46ch;
}

.pdp-buy{
  padding:clamp(28px,3.4vw,56px) 28px clamp(40px,4vw,72px);
  position:sticky;top:0;align-self:start;
}
.pdp-back{
  display:inline-block;font-size:11px;letter-spacing:.14em;
  text-transform:uppercase;color:var(--carbon);margin-bottom:26px;
}
.pdp-back:hover{color:var(--cochinilla)}
.pdp-buy h1{
  font-weight:700;line-height:1.02;letter-spacing:-.01em;
  font-size:clamp(26px,2.5vw,40px);color:var(--tinta);
}
.pdp-sub{
  margin-top:10px;font-size:12px;letter-spacing:.12em;
  text-transform:uppercase;color:var(--carbon);
}
.pdp-price{
  display:flex;align-items:baseline;gap:14px;
  margin:24px 0 22px;padding-top:20px;
  border-top:1px solid var(--tinta);
}
.pdp-price .amount{font-weight:700;font-size:26px;color:var(--tinta)}
.pdp-price .mono{font-size:11px;letter-spacing:.12em;color:var(--carbon);text-transform:uppercase}

/* Same button block as .hero .cta -- one button language everywhere. */
#pdp-form .cta{
  display:block;width:100%;border:0;cursor:pointer;text-align:center;
  background:var(--tinta);color:var(--cal);
  font-family:"Lindero Text",system-ui,sans-serif;font-weight:700;font-size:13px;
  letter-spacing:.16em;padding:17px 26px;
}
#pdp-form .cta:hover{background:var(--coch-oscura)}
#pdp-form .cta[disabled]{background:var(--piedra);cursor:not-allowed}
.pdp-note{
  margin-top:12px;font-size:11px;line-height:1.65;
  color:var(--carbon);text-align:center;
}

.pdp-facts{
  margin:30px 0 0;padding-top:20px;
  border-top:1px solid var(--arena);
  font-size:11px;line-height:1.9;
}
.pdp-facts div{display:flex;justify-content:space-between;gap:18px}
.pdp-facts dt{color:var(--carbon);letter-spacing:.1em;text-transform:uppercase}
.pdp-facts dd{margin:0;color:var(--tinta);text-align:right}

.acc{margin-top:30px;border-top:1px solid var(--arena)}
.acc details{border-bottom:1px solid var(--arena)}
.acc summary{
  cursor:pointer;list-style:none;padding:16px 0;
  font-weight:700;font-size:12px;letter-spacing:.13em;text-transform:uppercase;
  display:flex;justify-content:space-between;align-items:center;
}
.acc summary::-webkit-details-marker{display:none}
.acc summary::after{content:"+";color:var(--cochinilla);font-weight:400;font-size:17px}
.acc details[open] summary::after{content:"–"}
.acc-body{padding:0 0 18px}
.acc-body p{font:12px/1.75 "Lindero Text",system-ui,sans-serif;color:var(--carbon)}

.pdp-miss[hidden]{display:none}

@media(max-width:900px){
  .pdp{grid-template-columns:1fr}
  .pdp-art{border-right:0;border-bottom:1px solid var(--tinta)}
  .pdp-buy{position:static}
}
@media(max-width:430px){
  .pdp-art{padding:22px 18px}
  .pdp-buy{padding:26px 18px 40px}
  .pdp-facts div{flex-direction:column;gap:0;margin-bottom:9px}
  .pdp-facts dd{text-align:left}
}