/* Lightweight package pages: intrinsic mobile layout, no script dependency. */
:root { color-scheme: light; --ink:#252520; --muted:#58584f; --paper:#f5f3ed; --red:#ad1833; --line:#d8d6ce; }
* { box-sizing:border-box; }
html { scroll-padding-top:1rem; }
body { margin:0; color:var(--ink); background:var(--paper); font:1.0625rem/1.6 system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif; }
a { color:inherit; text-underline-offset:.2em; }
a:focus-visible,summary:focus-visible { outline:3px solid var(--red); outline-offset:5px; }
img { display:block; max-width:100%; height:auto; }
h1,h2,h3,p,figure { margin:0; }
h1,h2 { font-family:Georgia,"Times New Roman",serif; font-weight:400; line-height:1.12; }
h1 { font-size:clamp(2.25rem,6vw,4.25rem); letter-spacing:-.025em; max-width:14ch; }
h2 { font-size:clamp(1.875rem,4vw,2.75rem); }
h3 { font-size:1.125rem; line-height:1.35; }
p { max-width:66ch; }
.shell { width:min(100% - 2rem,72rem); margin-inline:auto; }
.skip { position:absolute; left:1rem; top:-8rem; padding:.75rem; background:white; z-index:5; }
.skip:focus { top:1rem; }
.header { border-bottom:1px solid var(--line); }
.header-inner { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:.5rem 1.5rem; padding-block:.75rem; }
.brand { display:flex; gap:.6rem; align-items:center; text-decoration:none; min-height:44px; font-weight:700; }
.brand-mark { color:white; background:var(--red); padding:.25rem .6rem; font-size:1.4rem; }
.header nav { display:flex; flex-wrap:wrap; gap:.25rem 1.25rem; }
.header nav a,.footer a { display:inline-flex; align-items:center; min-height:44px; font-size:1rem; }
.crumbs { padding-block:1.25rem; color:var(--muted); font-size:.9375rem; }
.hero { display:grid; gap:2rem; padding-block:1.25rem 3rem; }
.hero-copy { display:grid; align-content:start; gap:1.15rem; min-width:0; }
.eyebrow { color:var(--red); font-size:.8125rem; letter-spacing:.1em; font-weight:700; text-transform:uppercase; }
.lead { font-size:1.125rem; }
.actions { display:flex; flex-wrap:wrap; gap:.75rem; }
.button { display:inline-flex; align-items:center; justify-content:center; min-height:48px; padding:.8rem 1.2rem; border:1px solid var(--red); border-radius:4px; text-decoration:none; text-align:center; font-weight:650; line-height:1.35; max-width:100%; white-space:normal; }
.button-primary { background:var(--red); color:white; }
.button-secondary { background:transparent; color:var(--red); }
.micro { color:var(--muted); font-size:.9375rem; }
.product-pair { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:.625rem; align-self:start; }
.product-photo { min-width:0; background:#fff; border:1px solid var(--line); border-radius:6px; }
.product-photo img { width:100%; aspect-ratio:1; object-fit:contain; }
.product-photo figcaption { padding:.7rem; font-size:.9375rem; line-height:1.4; }
.product-photo strong { display:block; }
.photo-note { grid-column:1/-1; }
.section { border-top:1px solid var(--line); padding-block:2.5rem; }
.section-heading { margin-bottom:1.5rem; }
.section-heading p { margin-top:.75rem; }
.components { display:grid; gap:1rem; }
.component { background:#fff; border:1px solid var(--line); border-radius:6px; padding:1.25rem; min-width:0; }
.component h3 { margin:.5rem 0 .75rem; }
.component p + p { margin-top:.6rem; }
.component .sku { font-size:.875rem; color:var(--muted); overflow-wrap:anywhere; }
.specs { margin:1rem 0 0; }
.specs div { padding:.65rem 0; border-top:1px solid var(--line); }
.specs dt { font-weight:650; }
.specs dd { margin:0; color:var(--muted); }
.steps { display:grid; gap:1.25rem; padding:0; list-style:none; counter-reset:steps; }
.steps li { counter-increment:steps; padding-left:2.75rem; position:relative; }
.steps li::before { content:counter(steps,decimal-leading-zero); position:absolute; left:0; font-weight:700; color:var(--red); }
.steps p { color:var(--muted); margin-top:.5rem; }
details { border-top:1px solid var(--line); padding-block:1rem; }
summary { cursor:pointer; font-weight:650; min-height:44px; align-content:center; padding-right:.5rem; }
details p { padding-top:.5rem; }
.contact-panel { background:#e9e6dc; padding:1.5rem; border-radius:6px; }
.contact-panel p { margin:.75rem 0 1.25rem; }
.footer { border-top:1px solid var(--line); padding-block:1.5rem 7rem; color:var(--muted); font-size:.9375rem; }
.footer-links { display:flex; flex-wrap:wrap; gap:.25rem 1.25rem; margin-top:.5rem; }
.mobile-action { position:fixed; z-index:3; inset:auto 0 0; background:#fff; border-top:1px solid var(--line); padding:.6rem max(1rem,env(safe-area-inset-right)) calc(.6rem + env(safe-area-inset-bottom)) max(1rem,env(safe-area-inset-left)); }
.mobile-action .button { width:100%; }
@media(min-width:48rem) {
  .hero { grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:3rem; padding-block:2rem 4rem; }
  .components,.steps { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .steps { grid-template-columns:repeat(3,minmax(0,1fr)); }
  .mobile-action { display:none; }
  .footer { padding-bottom:2rem; }
}
@media(max-width:23rem) { .actions .button { width:100%; } .product-photo figcaption { padding:.5rem; } }
@media print { .mobile-action,.actions,.header nav { display:none; } .footer { padding-bottom:0; } .hero { padding-bottom:1rem; } .section { break-inside:avoid; } }