/* Editorial product-facts panel in ROTT's warm, restrained palette. */
.pdp-facts {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  grid-template-columns: .78fr 1.22fr;
  align-items: center;
  background: radial-gradient(ellipse at 8% 100%,#b8884a20,transparent 42%),#302117;
}
.pdp-facts::after {
  content: "ROTT / 01";
  position: absolute;
  z-index: -1;
  right: -20px;
  bottom: -48px;
  color: #f2e7d306;
  font-size: clamp(100px,18vw,250px);
  font-weight: 800;
  letter-spacing: -.1em;
  pointer-events: none;
}
.pdp-facts-heading { position: relative; z-index: 1; }
.pdp-facts-heading .eyebrow { color: #c99a5d; }
.pdp-facts h2 { color: #f5eddf; font-size: clamp(3.2rem,5.8vw,6.1rem); }
.pdp-facts h2 em { color: #c99a5d; }
.pdp-facts-heading > p:last-of-type { color: #dfd2c0; }
.pdp-facts-footnote { display: inline-flex; align-items: center; gap: 9px; margin-top: 17px; color: #c2ad92; font-size: 7px; font-weight: 700; letter-spacing: .15em; }
.pdp-facts-footnote i { width: 7px; height: 7px; border-radius: 50%; background: #c99a5d; box-shadow: 0 0 0 5px #c99a5d1c,0 0 14px #c99a5d66; }
.pdp-facts .pdp-fact-grid { position: relative; display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 12px; border: 0; }
.pdp-fact-card {
  position: relative;
  isolation: isolate;
  display: flex;
  flex-direction: column;
  min-width: 0;
  min-height: 174px;
  padding: 18px 20px 16px;
  overflow: hidden;
  border: 1px solid #d8bd9950;
  border-radius: 3px;
  color: #f4e9d8;
  background: #38271b;
  transform: translateY(0) rotate(0);
  transition: transform .4s cubic-bezier(.2,.75,.25,1),box-shadow .4s;
}
.pdp-fact-card:nth-child(2) { border-radius: 3px; }
.pdp-fact-card:nth-child(3) { border-radius: 3px; }
.pdp-fact-card:nth-child(4) { border-radius: 3px; }
.pdp-fact-portion { background: linear-gradient(145deg,#483324,#38271b 68%); }
.pdp-fact-protein { background: linear-gradient(145deg,#493326,#35241a 68%); }
.pdp-fact-energy { background: linear-gradient(145deg,#453023,#332319 68%); }
.pdp-fact-content { background: linear-gradient(145deg,#4b3627,#39281c 68%); }
.pdp-fact-card::before { content: ""; position: absolute; z-index: -1; top: -32px; right: -36px; width: 126px; aspect-ratio: 1; border: 1px solid currentColor; border-radius: 50%; opacity: .17; transition: transform .6s cubic-bezier(.2,.75,.25,1),opacity .4s; }
.pdp-fact-card::after { content: ""; position: absolute; z-index: -1; top: -18px; right: -18px; width: 90px; aspect-ratio: 1; border: 1px solid currentColor; border-radius: 43% 57% 63% 37%; opacity: .13; transform: rotate(40deg); transition: transform .7s cubic-bezier(.2,.75,.25,1); }
.pdp-fact-card-head { display: flex; align-items: center; justify-content: space-between; gap: 8px; font-size: 7px; font-weight: 750; letter-spacing: .16em; }
.pdp-fact-card-head { color: #d2ad7d; }
.pdp-fact-card-head b { display: grid; place-items: center; width: 27px; height: 27px; border: 1px solid #d2ad7d65; border-radius: 50%; color: #d2ad7d; font-size: 12px; font-weight: 500; transition: transform .4s cubic-bezier(.2,.75,.25,1); }
.pdp-fact-card > strong { display: flex; align-items: baseline; gap: 7px; margin: auto 0 1px; color: #e4b775; font: 600 clamp(2.7rem,4.8vw,4.4rem)/.98 Manrope,sans-serif; letter-spacing: -.09em; }
.pdp-fact-card > strong small { font: 500 .34em Manrope,sans-serif; letter-spacing: -.02em; }
.pdp-fact-card > p { margin: 9px 0 0; color: #e1d3c1; font-size: 9px; line-height: 1.45; opacity: .9; }
.pdp-fact-protein > p { opacity: .9; }
.pdp-fact-orbit { position: absolute; z-index: -1; top: 20px; right: 22px; width: 42px; height: 42px; border: 1px solid currentColor; border-radius: 50%; opacity: .12; }
.pdp-fact-orbit::after { content: ""; position: absolute; inset: 10px -5px; border: 1px solid currentColor; border-radius: 50%; transform: rotate(55deg); }
.pdp-fact-card:hover,.pdp-fact-card:focus-within { transform: translateY(-6px) rotate(-1deg); box-shadow: 0 18px 32px #100c2833; }
.pdp-fact-card:hover::before { transform: scale(1.25) rotate(24deg); opacity: .3; }
.pdp-fact-card:hover::after { transform: rotate(120deg) scale(1.15); }
.pdp-fact-card:hover .pdp-fact-card-head b { transform: rotate(45deg) scale(1.08); }
@media(max-width:760px) {
  .pdp-facts { grid-template-columns: 1fr; gap: 25px; padding: 62px 7%; }
  .pdp-facts h2 { font-size: clamp(3.1rem,12vw,5rem); }
  .pdp-fact-card { min-height: 148px; padding: 14px 15px 13px; }
  .pdp-fact-card > strong { font-size: clamp(2.25rem,9vw,3.4rem); }
  .pdp-fact-card > p { font-size: 8px; }
  .pdp-fact-card-head { font-size: 6px; }
  .pdp-fact-card-head b { width: 23px; height: 23px; }
}
@media(max-width:360px) {
  .pdp-facts .pdp-fact-grid { gap: 8px; }
  .pdp-fact-card { min-height: 137px; padding: 12px; }
  .pdp-fact-card > strong { font-size: 2.15rem; }
  .pdp-fact-card > p { font-size: 7px; }
}
@media(prefers-reduced-motion:reduce) {
  .pdp-fact-card,.pdp-fact-card::before,.pdp-fact-card::after,.pdp-fact-card-head b { transition: none; }
  .pdp-fact-card:hover,.pdp-fact-card:focus-within { transform: none; }
}
