.bt-p {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.55em;
  background: #0f172a;
  color: var(--action-on-inverse);
  border: 1px solid var(--action-on-inverse);
  border-radius: 0.5em;
  padding: 0.85em 1.7em;
  font-family: 'Work Sans', 'Segoe UI', sans-serif;
  font-weight: 600;
  font-size: 1em;
  line-height: 1.2;
  min-height: 2.75em;
  text-decoration: none;
  cursor: pointer;
  box-shadow: 0 0 0.75em rgba(224, 75, 52, 0.5), inset 0 0 0.5em rgba(224, 75, 52, 0.3);
}
.bt-p:hover, .bt-p:focus-visible { background: var(--action-primary); color: #ffffff; border-color: var(--action-primary); box-shadow: 0 0 1.1em rgba(224, 75, 52, 0.62); }
.bt-p[disabled] { background: var(--surface-sunken); color: var(--action-disabled); border-color: var(--line-strong); box-shadow: none; cursor: not-allowed; }
.bt-w { width: 100%; }
.bt-s {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.5em;
  background: transparent;
  color: var(--text-primary);
  border: 1px solid var(--line-strong);
  border-radius: 0.5em;
  padding: 0.8em 1.4em;
  font-family: 'Work Sans', 'Segoe UI', sans-serif;
  font-weight: 600;
  font-size: 0.95em;
  min-height: 2.75em;
  text-decoration: none;
  cursor: pointer;
}
.bt-s:hover { border-color: var(--action-primary); color: var(--action-hover); }
.bt-s-i { color: var(--text-inverse); border-color: rgba(255, 255, 255, 0.4); }
.bt-s-i:hover { color: #ffffff; border-color: #ffffff; }
.bt-lk { background: none; border: none; padding: 0; font: inherit; color: var(--action-hover); text-decoration: underline; cursor: pointer; }


.fm-g { margin-bottom: 1em; }
.fm-l { display: block; font-size: 0.86em; font-weight: 600; color: var(--text-secondary); margin-bottom: 0.35em; }
.fm-i {
  width: 100%;
  padding: 0.78em 0.9em;
  border: 1px solid var(--line-strong);
  border-radius: 0.5em;
  background: var(--surface-base);
  color: var(--text-primary);
  font-size: 1em;
  min-height: 2.75em;
}
.fm-i:focus { border-color: var(--action-primary); outline: none; box-shadow: 0 0 0 0.1875em rgba(224, 75, 52, 0.18); }
.fm-i[aria-invalid="true"] { border-color: var(--intent-danger); }
.fm-ck { display: flex; align-items: flex-start; gap: 0.6em; font-size: 0.84em; color: var(--text-secondary); margin: 1.1em 0; }
.fm-ck input { width: 1.15em; height: 1.15em; margin-top: 0.22em; flex: 0 0 auto; accent-color: var(--action-primary); }
.fm-nt { font-size: 0.82em; color: var(--text-muted); margin: 0.9em 0 0; }
.fm-er { margin: 0 0 1em; padding: 0.85em 1em; border-left: 0.1875em solid var(--intent-danger); background: #fdf1ef; color: #7f1d1d; font-size: 0.9em; border-radius: 0.35em; }
.fm-er ul { margin: 0.4em 0 0; padding-left: 1.1em; }
.fm-ok { margin: 0 0 1em; padding: 1.2em 1.3em; border-left: 0.1875em solid var(--intent-positive); background: #f0f7f3; border-radius: 0.35em; }
.fm-ok h2 { font-size: 1.2em; margin-bottom: 0.35em; }
.fm-ok p { margin: 0 0 0.5em; color: var(--text-secondary); font-size: 0.95em; }
.fm-ok p:last-child { margin-bottom: 0; }
.fm-ono { font-family: 'Work Sans', 'Segoe UI', sans-serif; font-weight: 700; color: var(--text-primary); }


.pgh { background: var(--surface-inverse); color: var(--text-inverse); padding: 3em 1em 3.2em; }
.pgh-in { width: 100%; max-width: var(--measure-page); margin: 0 auto; }
.pgh h1 { color: #ffffff; margin-bottom: 0.3em; max-width: 18em; }
.pgh p { color: #cbd5e1; max-width: 42em; margin: 0; }
.bc { list-style: none; margin: 0 0 1.4em; padding: 0; display: flex; flex-wrap: wrap; gap: 0.5em; font-size: 0.82em; color: var(--metal-silver); }
.bc li { margin: 0; }
.bc li + li::before { content: "›"; margin-right: 0.5em; color: #64748b; }
.bc a { color: var(--metal-silver); text-decoration: none; }
.bc a:hover { color: #ffffff; text-decoration: underline; }
.bc [aria-current="page"] { color: #ffffff; }


.pd-grid { display: grid; grid-template-columns: 1fr 1.05fr; gap: 3em; align-items: start; }
.pd-fig { margin: 0; background: var(--surface-raised); border: 1px solid var(--line-hairline); border-radius: 1em; padding: 2em; text-align: center; position: sticky; top: 1.5em; }
.pd-fig img { width: 100%; max-width: 24em; height: auto; display: block; margin: 0 auto; }
.pd-cap { font-size: 0.82em; color: var(--text-muted); margin: 1.2em 0 0; }
.pd-h { margin-bottom: 0.25em; }
.pd-sub { font-size: 1.06em; color: var(--text-secondary); margin-bottom: 1.2em; }
.pd-meta { display: flex; flex-wrap: wrap; gap: 1.4em; font-size: 0.84em; letter-spacing: 0.08em; text-transform: uppercase; color: var(--text-muted); padding-bottom: 1.2em; border-bottom: 1px solid var(--line-hairline); margin-bottom: 1.4em; }
.pd-buy { background: var(--surface-raised); border: 1px solid var(--line-hairline); border-radius: 1em; padding: 1.7em; margin-bottom: 2em; }
.pd-pr { display: flex; align-items: baseline; flex-wrap: wrap; gap: 0.7em; margin-bottom: 0.35em; }
.pd-now { font-family: 'Work Sans', 'Segoe UI', sans-serif; font-size: 2.1em; font-weight: 700; }
.pd-old { text-decoration: line-through; color: var(--text-muted); }
.pd-bdg { font-size: 0.74em; font-weight: 700; letter-spacing: 0.08em; background: var(--action-primary); color: #ffffff; padding: 0.28em 0.62em; border-radius: 0.35em; }
.pd-unit { font-size: 0.84em; color: var(--text-muted); margin-bottom: 1.3em; }
.pd-row { display: flex; flex-wrap: wrap; gap: 1em; align-items: center; }
.pd-qty { display: inline-flex; align-items: center; border: 1px solid var(--line-strong); border-radius: 0.5em; background: var(--surface-base); overflow: hidden; }
.pd-qty button { width: 2.75em; height: 2.75em; border: none; background: none; font-size: 1.05em; font-weight: 700; color: var(--text-primary); cursor: pointer; }
.pd-qty button:hover { color: var(--action-hover); }
.pd-qty input { width: 3em; height: 2.75em; border: none; border-left: 1px solid var(--line-hairline); border-right: 1px solid var(--line-hairline); text-align: center; font-size: 1em; font-weight: 700; background: none; color: var(--text-primary); }
.pd-tot { font-size: 0.9em; color: var(--text-secondary); margin: 1.1em 0 0; }
.pd-tot strong { color: var(--text-primary); font-size: 1.15em; }
.pd-ben { list-style: none; margin: 0 0 2em; padding: 0; }
.pd-ben li { position: relative; padding-left: 1.7em; margin-bottom: 0.6em; color: var(--text-secondary); }
.pd-ben li::before { content: ""; position: absolute; left: 0; top: 0.68em; width: 0.9em; height: 1px; background: var(--action-primary); }


.dt-i { border-top: 1px solid var(--line-hairline); }
.dt-i:last-of-type { border-bottom: 1px solid var(--line-hairline); }
.dt-h { margin: 0; }
.dt-b { display: flex; align-items: center; justify-content: space-between; gap: 1em; width: 100%; padding: 1.05em 0; background: none; border: none; cursor: pointer; text-align: left; font-family: 'Work Sans', 'Segoe UI', sans-serif; font-size: 1.02em; font-weight: 700; color: var(--text-primary); }
.dt-b::after { content: "+"; font-size: 1.25em; font-weight: 400; color: var(--action-primary); flex: 0 0 auto; }
.dt-b[aria-expanded="true"]::after { content: "–"; }
.dt-p { padding: 0 0 1.4em; color: var(--text-secondary); }
.dt-p[hidden] { display: none; }
.dt-p ul { padding-left: 1.15em; }
.dt-p li { font-size: 0.95em; }
.dt-inci { font-size: 0.86em; color: var(--text-muted); background: var(--surface-raised); border-radius: 0.5em; padding: 1em 1.1em; margin: 0.6em 0 0; }


.tr-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(18.75em, 1fr)); gap: 2em; }
.tr-i { border-top: 0.1875em solid var(--action-primary); padding-top: 1em; }
.tr-i h3 { font-size: 1em; margin-bottom: 0.3em; }
.tr-i p { font-size: 0.92em; color: var(--text-secondary); margin: 0; }


.rv-t { height: 1px; }
.rv-p { background: var(--surface-base); border: 1px solid var(--line-hairline); border-radius: 1em; padding: 2.2em; box-shadow: 0 0.75em 2.5em rgba(15, 23, 42, 0.09); max-width: 46em; margin: 0 auto; }
.rv-p.is-armed { opacity: 0; visibility: hidden; }
.rv-p h2 { font-size: 1.5em; margin-bottom: 0.3em; text-align: center; }
.rv-lead { text-align: center; color: var(--text-secondary); margin-bottom: 1.6em; }
.rv-f { display: grid; grid-template-columns: 1fr 1fr; gap: 1em; }
.rv-f .fm-full { grid-column: 1 / -1; }


.ct-grid { display: grid; grid-template-columns: 1.35fr 1fr; gap: 3em; align-items: start; }
.ct-tb { width: 100%; margin-bottom: 1.5em; }
.ct-tb caption { text-align: left; font-size: 0.8em; letter-spacing: 0.14em; text-transform: uppercase; color: var(--text-muted); padding-bottom: 0.8em; }
.ct-tb th { text-align: left; font-size: 0.78em; letter-spacing: 0.1em; text-transform: uppercase; color: var(--text-muted); font-weight: 700; padding-bottom: 0.7em; border-bottom: 1px solid var(--line-hairline); }
.ct-tb td { padding: 1.1em 0; border-bottom: 1px solid var(--line-hairline); vertical-align: middle; }
.ct-th { width: 5.5em; }
.ct-th img { width: 4.6em; height: auto; display: block; background: var(--surface-raised); border-radius: 0.5em; padding: 0.35em; }
.ct-nm { font-family: 'Work Sans', 'Segoe UI', sans-serif; font-weight: 700; }
.ct-sk { display: block; font-size: 0.8em; color: var(--text-muted); font-weight: 400; letter-spacing: 0.06em; }
.ct-un { white-space: nowrap; color: var(--text-secondary); }
.ct-ln { text-align: right; font-weight: 700; white-space: nowrap; }
.ct-rm { font-size: 0.82em; }
.ct-em { text-align: center; padding: 3em 1em; border: 1px dashed var(--line-strong); border-radius: 1em; background: var(--surface-raised); }
.ct-em p { color: var(--text-secondary); max-width: 28em; margin: 0 auto 1.4em; }
.ct-sm { background: var(--surface-raised); border: 1px solid var(--line-hairline); border-radius: 1em; padding: 1.7em; }
.ct-sm h2 { font-size: 1.2em; margin-bottom: 1em; }
.ct-rw { display: flex; justify-content: space-between; gap: 1em; padding: 0.55em 0; font-size: 0.94em; color: var(--text-secondary); }
.ct-rw:last-of-type { border-top: 1px solid var(--line-strong); margin-top: 0.5em; padding-top: 0.9em; font-size: 1.18em; font-weight: 700; color: var(--text-primary); }
.ct-fg { background: var(--surface-base); border: 1px solid var(--line-hairline); border-radius: 1em; padding: 1.9em; margin-top: 2.5em; }
.ct-fg h2 { font-size: 1.35em; margin-bottom: 0.3em; }
.ct-fl { display: grid; grid-template-columns: 1fr 1fr; gap: 1em; }
.ct-fl .fm-full { grid-column: 1 / -1; }
.ct-hid { display: none; }


.pr-w { width: 100%; max-width: 52em; margin: 0 auto; }
.pr-w h2 { font-size: 1.42em; margin-top: 1.8em; }
.pr-w h2:first-of-type { margin-top: 0; }
.pr-w h3 { font-size: 1.1em; margin-top: 1.4em; }
.pr-w p, .pr-w li { color: var(--text-secondary); }
.pr-w strong { color: var(--text-primary); }
.pr-w table { margin: 1.2em 0 1.8em; font-size: 0.95em; }
.pr-w th, .pr-w td { text-align: left; padding: 0.62em 0.8em 0.62em 0; border-bottom: 1px solid var(--line-hairline); vertical-align: top; }
.pr-w th { color: var(--text-primary); font-weight: 600; width: 38%; }
.pr-upd { font-size: 0.84em; color: var(--text-muted); border-top: 1px solid var(--line-hairline); padding-top: 1.2em; margin-top: 2.5em; }
.pr-box { background: var(--surface-raised); border-left: 0.1875em solid var(--action-primary); border-radius: 0.35em; padding: 1.3em 1.5em; margin: 1.6em 0; }
.pr-box p:last-child { margin-bottom: 0; }


@media (max-width: 64em) {
  .pd-grid { grid-template-columns: 1fr; gap: 2.2em; }
  .pd-fig { position: static; }
  .ct-grid { grid-template-columns: 1fr; gap: 2.2em; }
}
@media (max-width: 48em) {
  .pgh { padding: 2em 1em 2.2em; }
  .rv-f, .ct-fl { grid-template-columns: 1fr; }
  .rv-p { padding: 1.4em; }
  .ct-fg { padding: 1.3em; }
  .bt-p { padding: 0.85em 1.1em; font-size: 0.95em; }

  
  .ct-tb, .ct-tb tbody, .ct-tb tr { display: block; }
  .ct-tb thead { display: none; }
  .ct-tb caption { display: block; }
  .ct-tb tr { display: grid; grid-template-columns: auto 1fr; gap: 0.9em 1em; align-items: center; padding: 1.1em 0; border-bottom: 1px solid var(--line-hairline); }
  .ct-tb td { display: block; padding: 0; border-bottom: none; }
  .ct-tb td.ct-th { grid-column: 1; grid-row: 1; width: auto; }
  .ct-tb td.ct-nmc { grid-column: 2; grid-row: 1; }
  .ct-tb td.ct-qc { grid-column: 1; grid-row: 2; }
  .ct-tb td.ct-un, .ct-tb th:nth-child(2) { display: none; }
  .ct-tb td.ct-ln { grid-column: 2; grid-row: 2; }
  .pd-meta { gap: 0.9em; font-size: 0.76em; }
}