/* ==================================================================
   f0314-pdp-v3.css   —   scoped entirely under .f0314-pdp-v3
   Closes: P1-21/22/23 (layout), P2-25/26 (CLS), P2-27/28 (a11y)
   No global selector. No !important on theme elements except the
   two soldout artefacts noted below, which must not appear inside
   a preorder page.
   Contrast, computed (tests/test_invariants.py recomputes these from
   the variables below, so changing a colour fails the build):
             body  #1F2430 on #FFFFFF = 15.52:1
             muted #5A6472 on #FFFFFF =  6.00:1
             muted #5A6472 on #F6F7F9 =  5.60:1
             label #FFFFFF on #A8320F =  6.71:1
             error #96331B on #FFFFFF =  7.54:1
             ok    #1B6B3A on #FFFFFF =  6.54:1
             focus #0B57D0 on #FFFFFF =  6.39:1   all >= WCAG AA
   ================================================================== */

.f0314-pdp-v3{
  --ink:#1F2430; --muted:#5A6472; --line:#E2E6EC; --bg:#FFFFFF;
  --soft:#F6F7F9; --brand:#A8320F; --brand-ink:#FFFFFF; --brand-soft:#FDF1ED;
  --ok:#1B6B3A; --warn:#8A5A00; --stop:#96331B;
  --r:10px; --focus:#0B57D0;
  color:var(--ink); background:var(--bg);
  font:400 16px/1.6 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif;
  /* the shared layout applies its own margin/width to blocks in this slot,
     which collapsed the page to a narrow right-hand column at install time.
     These four are forced so the wrapper owns its own box. Scoped to the
     V3 wrapper only, so no other page or template is affected. */
  max-width:1180px !important; width:auto !important;
  margin-left:auto !important; margin-right:auto !important;
  float:none !important; clear:both !important;
  padding:20px 16px 56px; overflow-x:hidden;
}
.f0314-pdp-v3 *,.f0314-pdp-v3 *::before,.f0314-pdp-v3 *::after{box-sizing:border-box}
.f0314-pdp-v3 :focus-visible{outline:3px solid var(--focus); outline-offset:2px; border-radius:4px}

/* the live theme paints a sold-out badge from inventory=0; a preorder
   page must never show it (P0-01 / P0-08) */
.f0314-pdp-v3 .soldout,.f0314-pdp-v3 img[src*="soldout"]{display:none !important}

/* ---------- layout ---------- */
.f0314-pdp-v3 .pxv{display:grid; grid-template-columns:minmax(0,1.05fr) minmax(0,1fr); gap:36px; align-items:start}
@media (max-width:900px){.f0314-pdp-v3 .pxv{grid-template-columns:1fr; gap:24px}}

.f0314-pdp-v3 .pxv__hero{margin:0; border:1px solid var(--line); border-radius:var(--r); overflow:hidden; background:var(--soft)}
.f0314-pdp-v3 .pxv__hero img{display:block; width:100%; height:auto; aspect-ratio:1/1; object-fit:contain}
.f0314-pdp-v3 .pxv__thumbs{list-style:none; display:flex; gap:8px; padding:10px 0 0; margin:0; overflow-x:auto; scrollbar-width:thin}
.f0314-pdp-v3 .pxv__thumbs img{width:72px; height:72px; object-fit:contain; border:1px solid var(--line); border-radius:8px; background:var(--soft)}
.f0314-pdp-v3 .pxv__media-note{margin:8px 0 0; font-size:13px; color:var(--muted)}

.f0314-pdp-v3 .pxv__title{margin:0 0 12px; font-size:clamp(22px,3.2vw,30px); line-height:1.25; font-weight:700}

.f0314-pdp-v3 .pxv__status{display:flex; flex-wrap:wrap; align-items:baseline; gap:8px; margin:0 0 14px;
  padding:10px 12px; background:var(--brand-soft); border:1px solid #F0D6CD; border-radius:var(--r)}
.f0314-pdp-v3 .pxv__status-dot{width:9px; height:9px; border-radius:50%; background:var(--brand); flex:0 0 auto}
.f0314-pdp-v3 .pxv__status-main{font-weight:700; color:var(--brand)}
.f0314-pdp-v3 .pxv__status-sub{font-size:14px; color:var(--muted)}

.f0314-pdp-v3 .pxv__price{margin:0 0 18px; display:flex; flex-wrap:wrap; align-items:baseline; gap:10px}
.f0314-pdp-v3 .pxv__price [data-pxv-price]{font-size:clamp(24px,3.6vw,32px); font-weight:800; letter-spacing:-.01em}
.f0314-pdp-v3 .pxv__price-tag{font-size:13px; color:var(--muted)}

.f0314-pdp-v3 .pxv__variant-head{margin:0 0 10px; font-size:15px}
.f0314-pdp-v3 .pxv__sku{margin-left:10px; color:var(--muted); font-size:14px}
.f0314-pdp-v3 .pxv__swatches{display:grid; grid-template-columns:repeat(auto-fit,minmax(140px,1fr)); gap:10px; margin-bottom:18px}
.f0314-pdp-v3 .pxv__swatch{display:flex; align-items:center; gap:10px; min-height:56px; padding:10px 12px;
  background:#fff; border:1.5px solid var(--line); border-radius:var(--r); cursor:pointer; text-align:left; font:inherit; color:inherit}
.f0314-pdp-v3 .pxv__swatch:hover{border-color:#B9C0CA}
.f0314-pdp-v3 .pxv__swatch.is-selected{border-color:var(--brand); box-shadow:inset 0 0 0 1px var(--brand); background:var(--brand-soft)}
.f0314-pdp-v3 .pxv__swatch-chip{width:26px; height:26px; border-radius:50%; border:1px solid rgba(0,0,0,.18); flex:0 0 auto}
.f0314-pdp-v3 .pxv__swatch-name{font-size:14px; font-weight:600; line-height:1.2}
.f0314-pdp-v3 .pxv__swatch-sku{font-size:12px; color:var(--muted); margin-left:auto}

.f0314-pdp-v3 .pxv__qty{display:flex; align-items:center; gap:10px; margin-bottom:20px}
.f0314-pdp-v3 .pxv__qty-label{font-size:15px; font-weight:600}
.f0314-pdp-v3 .pxv__qty-input{width:84px; min-height:44px; padding:8px 10px; font:inherit;
  border:1.5px solid var(--line); border-radius:8px; background:#fff; color:var(--ink)}

.f0314-pdp-v3 .pxv__nocart{margin:14px 0 0; padding:12px 14px; background:var(--soft);
  border-left:3px solid var(--line); border-radius:0 8px 8px 0; font-size:14px; color:var(--muted)}
.f0314-pdp-v3 .pxv__assure{list-style:none; padding:16px 0 0; margin:0; display:grid; gap:8px; font-size:14px; color:var(--muted)}
.f0314-pdp-v3 .pxv__assure li{padding-left:22px; position:relative}
.f0314-pdp-v3 .pxv__assure li::before{content:"✓"; position:absolute; left:0; color:var(--ok); font-weight:700}

/* ---------- G1 gate ---------- */
.f0314-pdp-v3 .pxg{margin:22px 0 0; padding:20px; border:1.5px solid var(--line); border-radius:14px; background:var(--soft)}
.f0314-pdp-v3 .pxg__title{margin:0 0 8px; font-size:19px; font-weight:700}
.f0314-pdp-v3 .pxg__lede{margin:0 0 16px; font-size:15px; color:var(--muted)}

.f0314-pdp-v3 .pxg__btn{display:block; width:100%; min-height:56px; padding:12px 18px; border-radius:var(--r);
  font:inherit; font-weight:700; cursor:pointer; border:1.5px solid transparent; text-align:center; text-decoration:none}
.f0314-pdp-v3 .pxg__btn--pri{background:var(--brand); color:var(--brand-ink); border-color:var(--brand)}
.f0314-pdp-v3 .pxg__btn--pri:hover{background:#8E2A0C}
.f0314-pdp-v3 .pxg__btn--sec{background:#fff; color:var(--ink); border-color:#C3CAD4; font-weight:600; min-height:48px}
.f0314-pdp-v3 .pxg__btn--ghost{background:transparent; color:var(--muted); border-color:transparent; font-weight:600; min-height:48px; width:auto; padding:12px 4px}
.f0314-pdp-v3 .pxg__btn-main{display:block; font-size:15px; letter-spacing:.01em}
.f0314-pdp-v3 .pxg__btn-sub{display:block; font-size:12.5px; font-weight:500; opacity:.9; margin-top:3px}
.f0314-pdp-v3 .pxg__intro-alt{margin:12px 0 0; font-size:14px; color:var(--muted); text-align:center}
.f0314-pdp-v3 .pxg__intro-alt a{color:var(--ink); font-weight:600}

.f0314-pdp-v3 .pxg__progress{margin-bottom:16px}
.f0314-pdp-v3 .pxg__progress-text{margin:0 0 6px; font-size:13px; font-weight:600; color:var(--muted)}
.f0314-pdp-v3 .pxg__progress-bar{height:6px; background:#E7EAEF; border-radius:99px; overflow:hidden}
.f0314-pdp-v3 .pxg__progress-bar i{display:block; height:100%; width:33%; background:var(--brand); transition:width .2s ease}

.f0314-pdp-v3 .pxg__step{border:0; padding:0; margin:0 0 8px; min-width:0}
.f0314-pdp-v3 .pxg__legend{padding:0; margin:0 0 14px; font-size:16px; font-weight:700}
.f0314-pdp-v3 .pxg__q{margin-bottom:18px; padding-bottom:16px; border-bottom:1px solid var(--line)}
.f0314-pdp-v3 .pxg__q:last-child{border-bottom:0}
.f0314-pdp-v3 .pxg__q.is-muted{opacity:.5}
.f0314-pdp-v3 .pxg__q.has-err .pxg__q-label{color:var(--stop)}
.f0314-pdp-v3 .pxg__q-label{margin:0 0 10px; font-size:15px; font-weight:600}
.f0314-pdp-v3 .pxg__q-hint{margin:8px 0 0; font-size:13px; color:var(--muted)}
.f0314-pdp-v3 .pxg__opts{display:grid; gap:8px}
.f0314-pdp-v3 .pxg__opt{min-height:48px; padding:11px 14px; text-align:left; font:inherit; font-size:14.5px;
  background:#fff; color:var(--ink); border:1.5px solid var(--line); border-radius:var(--r); cursor:pointer}
.f0314-pdp-v3 .pxg__opt:hover{border-color:#B9C0CA}
.f0314-pdp-v3 .pxg__opt.is-on{border-color:var(--brand); background:var(--brand-soft); font-weight:600; box-shadow:inset 0 0 0 1px var(--brand)}

.f0314-pdp-v3 .pxg__fields{margin-top:20px; padding-top:18px; border-top:1px solid var(--line)}
.f0314-pdp-v3 .pxg__fields-note{margin:0 0 14px; font-size:14px; color:var(--muted)}
.f0314-pdp-v3 .pxg__field{margin-bottom:14px}
.f0314-pdp-v3 .pxg__label{display:block; margin-bottom:6px; font-size:14px; font-weight:600}
.f0314-pdp-v3 .pxg__opt-tag{font-weight:400; color:var(--muted); font-size:13px}
.f0314-pdp-v3 .pxg__input{width:100%; min-height:48px; padding:11px 13px; font:inherit;
  border:1.5px solid #C3CAD4; border-radius:var(--r); background:#fff; color:var(--ink)}
.f0314-pdp-v3 .pxg__input[aria-invalid="true"]{border-color:var(--stop)}
.f0314-pdp-v3 .pxg__err{margin:6px 0 0; font-size:13px; color:var(--stop); font-weight:600}
.f0314-pdp-v3 .pxg__privacy{margin:14px 0 0; font-size:12.5px; color:var(--muted)}

.f0314-pdp-v3 .pxg__result{margin-top:18px; padding:16px; border-radius:var(--r); background:#fff; border:1.5px solid var(--line)}
.f0314-pdp-v3 .pxg__result[data-outcome="READY_FOR_QUOTE"]{border-color:#B7D9C4; background:#F2FAF5}
.f0314-pdp-v3 .pxg__result[data-outcome="TECHNICAL_REVIEW_REQUIRED"]{border-color:#E6CE9A; background:#FDF8EE}
.f0314-pdp-v3 .pxg__result[data-outcome="NOT_READY_TO_ORDER"]{border-color:#E3BCB0; background:#FDF3F0}
.f0314-pdp-v3 .pxg__result-badge{margin:0 0 6px; font-size:12px; font-weight:800; letter-spacing:.06em; text-transform:uppercase; color:var(--muted)}
.f0314-pdp-v3 .pxg__result-title{margin:0 0 8px; font-size:17px; font-weight:700}
.f0314-pdp-v3 .pxg__result-body{margin:0 0 10px; font-size:14.5px; color:var(--muted)}
.f0314-pdp-v3 .pxg__result-reasons{margin:0 0 10px; padding-left:20px; font-size:14px; display:grid; gap:5px}
.f0314-pdp-v3 .pxg__result-case{margin:0; font-size:13.5px; color:var(--muted)}

.f0314-pdp-v3 .pxg__nav{display:flex; gap:10px; align-items:center; margin-top:18px}
.f0314-pdp-v3 .pxg__nav .pxg__btn--pri{flex:1}
.f0314-pdp-v3 .pxg__formerr{margin:12px 0 0; padding:10px 12px; background:#FDF3F0; border:1px solid #E3BCB0;
  border-radius:8px; font-size:14px; font-weight:600; color:var(--stop)}

.f0314-pdp-v3 .pxg__done{text-align:left}
.f0314-pdp-v3 .pxg__done-badge{margin:0 0 6px; font-size:12px; font-weight:800; letter-spacing:.06em; text-transform:uppercase; color:var(--ok)}
.f0314-pdp-v3 .pxg__done-title{margin:0 0 10px; font-size:19px; font-weight:700}
.f0314-pdp-v3 .pxg__done-case{margin:0 0 12px; font-size:15px}
.f0314-pdp-v3 .pxg__done-note{margin:0 0 10px; font-size:14.5px; color:var(--muted)}
.f0314-pdp-v3 .pxg__done-note--muted{font-size:13px}
.f0314-pdp-v3 .pxg__done-actions{display:grid; gap:8px; margin-top:14px}

/* ---------- decision content ---------- */
.f0314-pdp-v3 .pxc{margin-top:48px; display:grid; gap:32px; max-width:840px}
.f0314-pdp-v3 .pxc__sec h2{margin:0 0 14px; font-size:20px; font-weight:700}
.f0314-pdp-v3 .pxc__spec{display:grid; grid-template-columns:minmax(120px,180px) 1fr; gap:0; margin:0; border-top:1px solid var(--line)}
.f0314-pdp-v3 .pxc__spec dt{padding:11px 12px 11px 0; font-weight:600; font-size:14.5px; border-bottom:1px solid var(--line)}
.f0314-pdp-v3 .pxc__spec dd{padding:11px 0; margin:0; font-size:14.5px; color:var(--muted); border-bottom:1px solid var(--line)}
.f0314-pdp-v3 .pxc__gap{margin:14px 0 0; padding:12px 14px; background:var(--soft); border-left:3px solid #C3CAD4;
  border-radius:0 8px 8px 0; font-size:14px; color:var(--muted)}
.f0314-pdp-v3 .pxc__gap-note{margin:8px 0 0; font-size:13px; color:var(--muted)}
.f0314-pdp-v3 .pxc__steps{margin:0; padding-left:22px; display:grid; gap:10px; font-size:15px}
.f0314-pdp-v3 .pxc__sec details{border:1px solid var(--line); border-radius:var(--r); margin-bottom:8px; background:#fff}
.f0314-pdp-v3 .pxc__sec summary{padding:14px 16px; cursor:pointer; font-weight:600; font-size:15px; min-height:48px; display:flex; align-items:center}
.f0314-pdp-v3 .pxc__sec details p{margin:0; padding:0 16px 16px; font-size:14.5px; color:var(--muted)}
.f0314-pdp-v3 .pxc__policy{list-style:none; padding:0; margin:0; display:grid; gap:8px}
.f0314-pdp-v3 .pxc__policy a{display:inline-flex; align-items:center; min-height:44px; color:var(--ink); font-weight:600; font-size:15px}
.f0314-pdp-v3 .pxc__policy-lede,.f0314-pdp-v3 .pxc__policy-note{font-size:14px; color:var(--muted)}
.f0314-pdp-v3 .pxc__policy-note{margin:14px 0 0}
.f0314-pdp-v3 .pxc__rte img{max-width:100%; height:auto}
.f0314-pdp-v3 .pxc__rte table{width:100%; display:block; overflow-x:auto}

@media (prefers-reduced-motion:reduce){.f0314-pdp-v3 *{transition:none !important; animation:none !important}}