/* Pallet calculator page (how-many-pallets-fit.html), compact layout v2. Loaded only on that page.
   Calculator first with a sticky live result panel and a to-scale load plan, then short answers in a grid,
   the summary table beside the method, and sources. Backgrounds white or #EEF3FA only; accents #003DA5
   (navy #002B75) and #FF6720. No gradients, no shadows. */
.pf-tool [hidden], .pf-form[hidden] { display: none !important; }
/* ---------- Page rhythm ---------- */
body:has(#pf-form) .page-hero { padding: 40px 48px 30px; }
body:has(#pf-form) .page-hero h1 { font-size: clamp(32px, 3.6vw, 48px); line-height: 1.02; margin-bottom: 10px; }
body:has(#pf-form) .page-hero p { max-width: 70ch; font-size: 17px; line-height: 1.55; margin-bottom: 0; }
body:has(#pf-form) .cta-section { padding: 56px 48px; }
body:has(#pf-form) .cta-headline { font-size: clamp(32px, 4vw, 48px); }
body:has(#pf-form) .cta-subheadline { margin-bottom: 24px; }
.pf2-jump { background: #FFFFFF; border-bottom: 1px solid #D3DCE9; padding: 0 48px; position: relative; z-index: 2; }
.pf2-jump .content-container { display: flex; flex-wrap: wrap; gap: 4px 26px; }
.pf2-jump a { display: inline-flex; align-items: center; min-height: 44px; font-family: 'Oswald', sans-serif; font-size: 14px; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; color: #003DA5; text-decoration: none; border-bottom: 3px solid transparent; }
.pf2-jump a:hover, .pf2-jump a:focus-visible { border-bottom-color: #FF6720; }
main:has(#pf-form) .content-section { padding: 48px 48px; }
main:has(#pf-form) .section-eyebrow { margin-bottom: 8px; }
main:has(#pf-form) p, main:has(#pf-form) li { max-width: 70ch; }
.pf2-h2 { font-family: 'Oswald', sans-serif; font-size: clamp(26px, 2.6vw, 34px); font-weight: 700; line-height: 1.08; text-transform: uppercase; color: var(--navy); margin: 0 0 8px; }
.pf2-lead { font-size: 16px; line-height: 1.55; color: var(--body-ink); max-width: 70ch; margin: 0 0 14px; }
.pf-intro { font-size: 16.5px; line-height: 1.6; color: var(--body-ink); max-width: 70ch; margin: 0 0 22px; }
[id] { scroll-margin-top: 130px; }
/* ---------- Calculator: two columns ---------- */
.pf2-calc-s { background: #FFFFFF; }
.pf2-grid { display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(380px, .95fr); gap: 32px; align-items: start; }
.pf-form.wf-form { padding: 6px 22px 12px; border: 1px solid #D3DCE9; border-top: 4px solid #003DA5; margin: 0; }
.pf2-step { padding: 12px 0 8px; border-bottom: 1px solid #E1E8F2; margin: 0; min-width: 0; }
.pf2-step:last-of-type { border-bottom: 0; }
.pf-form legend.pf2-h3, .pf-form label.pf2-h3, .pf2-h3 { display: flex; font-weight: 700; line-height: 1.2; border: 0; align-items: center; gap: 10px; font-family: 'Oswald', sans-serif; font-size: 17px; letter-spacing: .04em; text-transform: uppercase; color: var(--navy); margin: 0 0 10px; padding: 0; }
.pf2-sn { flex: 0 0 26px; width: 26px; height: 26px; border-radius: 50%; background: #003DA5; color: #FFFFFF; font-size: 14px; display: inline-flex; align-items: center; justify-content: center; }
fieldset.pf2-step { border: 0; border-bottom: 1px solid #E1E8F2; }
fieldset.pf2-step > legend { float: left; width: 100%; }
fieldset.pf2-step > legend + * { clear: both; }
.pf2-seg { display: grid; border: 2px solid #003DA5; border-radius: 4px; overflow: hidden; gap: 0; }
.pf2-seg-3 { grid-template-columns: repeat(3, 1fr); }
.pf2-seg-4 { grid-template-columns: repeat(4, 1fr); }
.pf2-seg-2 { grid-template-columns: repeat(2, 1fr); }
.pf2-seg .pf-choice { min-height: 44px; display: flex; align-items: center; justify-content: center; text-align: center; padding: 6px 8px; margin: 0; background: #FFFFFF; font-size: 14px; font-weight: 600; line-height: 1.2; color: var(--navy); cursor: pointer; border: 0; border-left: 1px solid rgba(0, 61, 165, .35); border-radius: 0; position: relative; }
.pf2-seg-3 .pf-choice:nth-child(3n+1), .pf2-seg-4 .pf-choice:first-child, .pf2-seg-2 .pf-choice:first-child { border-left: 0; }
.pf2-seg-3 .pf-choice:nth-child(n+4) { border-top: 1px solid rgba(0, 61, 165, .35); }
.pf2-seg .pf-choice input { position: absolute; opacity: 0; inset: 0; width: 100%; height: 100%; margin: 0; }
.pf2-seg .pf-choice:hover { background: #EEF3FA; }
.pf2-seg .pf-choice:has(input:checked) { background: #003DA5; color: #FFFFFF; border-bottom: 4px solid #FF6720; padding-bottom: 2px; }
.pf2-seg .pf-choice:focus-within { outline: 3px solid #003DA5; outline-offset: -3px; }
.pf2-seg .pf-choice:focus-within:has(input:checked) { outline-color: #fff; }
.pf2-row { display: grid; grid-template-columns: 1fr 1fr 1.2fr; gap: 0 12px; align-items: end; }
.pf-form legend.pf2-sub, .pf2-sub { display: block; float: none; width: auto; border: 0; line-height: 1.3; font-family: 'Oswald', sans-serif; font-size: 11.5px; letter-spacing: .1em; text-transform: uppercase; color: var(--steel); font-weight: 600; margin: 0 0 5px; padding: 0; }
.pf-form .form-row { margin-bottom: 8px; }
.pf-form .form-row label { font-size: 11.5px; letter-spacing: .1em; margin-bottom: 5px; }
.pf-form select, .pf-form input[type="number"] { min-height: 44px; width: 100%; max-width: 100%; padding: 9px 11px; }
.pf-form fieldset.pf2-fs { border: 0; padding: 0; margin: 0 0 8px; min-width: 0; }
.pf2-custom { display: grid; grid-template-columns: 1fr 1fr; gap: 0 12px; margin-top: 10px; }
.pf-opt { font-weight: 400; text-transform: none; letter-spacing: 0; color: var(--body-ink); font-size: 13px; }
.pf-more { border-top: 1px solid #E1E8F2; }
.pf-more summary { cursor: pointer; min-height: 46px; display: flex; align-items: center; gap: 8px; font-family: 'Oswald', sans-serif; font-size: 15px; letter-spacing: .04em; text-transform: uppercase; font-weight: 600; color: #003DA5; }
.pf-more summary:focus-visible { outline: 3px solid #FF6720; outline-offset: 2px; }
.pf-more .pf2-row { padding-bottom: 6px; }
.pf2-actions { display: flex; align-items: center; gap: 14px; padding: 10px 0 4px; }
.pf-form .form-submit { min-height: 44px; margin: 0; }
.pf2-actions .pf2-hint { font-size: 13.5px; color: var(--body-ink); margin: 0; }
.pf-noscript { margin-top: 12px; font-weight: 600; color: var(--navy); }
.pf2-calc-s .planner-disclaimer { margin: 12px 0 0; padding: 10px 14px; background: #EEF3FA; border-left: 4px solid #FF6720; font-size: 13.5px; line-height: 1.5; max-width: none; }
.pf2-mini { display: none; }
/* Result panel (sticky on desktop, no shadow) */
.pf2-panel { position: sticky; top: 150px; background: #FFFFFF; border: 1px solid #C9D4E5; border-top: 4px solid #FF6720; padding: 14px 18px 14px; }
.pf2-panel:focus { outline: 3px solid #FF6720; outline-offset: 2px; }
.pf2-panel .result-label { font-family: 'Oswald', sans-serif; font-size: 12px; letter-spacing: .14em; text-transform: uppercase; color: var(--steel); font-weight: 600; }
.pf2-top { display: grid; grid-template-columns: auto 1fr; gap: 2px 12px; align-items: center; }
.pf2-top .pf2-mk { grid-row: span 2; }
.pf2-mk { flex: 0 0 24px; width: 24px; height: 24px; border-radius: 50%; background: #FF6720; color: #FFFFFF; font: 700 13px/24px Oswald, sans-serif; text-align: center; display: inline-block; }
.pf-big { font-family: 'Oswald', sans-serif; font-size: 44px; line-height: 1; color: #003DA5; font-weight: 700; font-variant-numeric: tabular-nums; }
.pf2-top .pf-big { display: inline-block; margin-right: 10px; vertical-align: baseline; }
.pf-sub { font-size: 13.5px; color: var(--body-ink); line-height: 1.45; }
.pf2-top .pf-sub { display: inline; }
.pf-diagram { margin: 10px -8px 2px; }
.pf-svg-wrap { background: #FFFFFF; padding: 0; overflow: hidden; }
.pf-svg { display: block; width: 100%; height: auto; }
.pf-legend { display: flex; flex-wrap: wrap; gap: 4px 16px; margin: 4px 8px 0; font-size: 12.5px; color: var(--navy); }
.pf-legend span { display: inline-flex; align-items: center; gap: 6px; }
.pf-key { display: inline-block; width: 16px; height: 12px; border: 2px solid #003DA5; }
.pf-key.s { background: #003DA5; }
.pf-key.t { background: #002B75; border-color: #002B75; border-bottom: 4px solid #FF6720; }
.pf-key.o { background: #FFFFFF; border-style: dashed; }
.pf-key.d { background: #FF6720; border-color: #FF6720; width: 7px; }
.pf2-rows { list-style: none; margin: 8px 0 0; padding: 0; display: grid; grid-template-columns: 1fr 1fr; border-top: 1px solid #D3DCE9; }
.pf2-rows > li { display: grid; grid-template-columns: 24px 1fr; gap: 0 9px; padding: 8px 4px 6px; border-bottom: 1px solid #EEF3FA; max-width: none !important; }
.pf2-rows > li + li { border-left: 1px solid #EEF3FA; padding-left: 10px; }
.pf2-rows .pf2-wide { grid-column: 1 / -1; border-left: 0 !important; padding-left: 4px !important; }
.pf2-mid { font-family: 'Oswald', sans-serif; font-size: 22px; color: var(--navy); font-weight: 700; line-height: 1.15; font-variant-numeric: tabular-nums; }
.pf-pats { font-size: 14.5px; font-weight: 700; color: var(--navy); line-height: 1.45; }
.pf2-x { background: transparent; }
.pf-bd { margin-top: 10px; padding: 8px 12px; background: #EEF3FA; border-left: 4px solid #003DA5; }
.pf-bd-list { list-style: none; margin: 4px 0 0; padding: 0; }
.pf-bd-list li { display: flex; gap: 10px; align-items: baseline; padding: 3px 0; border-bottom: 1px solid rgba(0, 61, 165, .2); max-width: none; }
.pf-bd-list li:last-child { border-bottom: 0; }
.pf-bd-n { flex: 0 0 1.8em; font-family: 'Oswald', sans-serif; font-size: 19px; font-weight: 700; color: #003DA5; text-align: right; }
.pf-bd-t { font-size: 13.5px; line-height: 1.4; color: var(--navy); }
.pf-bd-note { margin: 6px 0 0; font-size: 12.5px; line-height: 1.45; color: var(--navy); }
.pf-notes { margin: 10px 0 0; padding: 0 0 0 18px; }
.pf-notes li { font-size: 13.5px; line-height: 1.45; margin-bottom: 4px; color: var(--navy); }
.pf2-panel .btn-primary { margin-top: 12px; min-height: 48px; display: flex; justify-content: center; }
/* ---------- Short answers ---------- */
.pf2-faq { background: #EEF3FA; }
.pf2-faq-h { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: baseline; gap: 4px 20px; }
.pf2-faq .last-reviewed { font-size: 13px; margin: 0 0 8px; }
.pf2-group { font-family: 'Oswald', sans-serif; font-size: 18px; letter-spacing: .05em; text-transform: uppercase; color: var(--navy); margin: 22px 0 10px; display: flex; align-items: center; gap: 12px; }
.pf2-group::after { content: ""; flex: 1; height: 2px; background: #003DA5; opacity: .25; }
.pf2-qgrid { columns: 2; column-gap: 20px; }
.pf2-qgrid > .pf2-q { display: block; break-inside: avoid; margin: 0 0 14px; }
.pf2-q { background: #FFFFFF; border: 1px solid #D3DCE9; border-top: 3px solid #003DA5; padding: 12px 16px; scroll-margin-top: 130px; }
.pf2-q:target { border-top-color: #FF6720; }
.pf2-q > summary { list-style: none; cursor: default; min-height: 24px; }
.pf2-q > summary::-webkit-details-marker { display: none; }
.pf2-q h3 { font-family: 'Oswald', sans-serif; font-size: 16.5px; letter-spacing: .02em; color: var(--navy); margin: 0 0 6px; line-height: 1.3; }
.pf2-q p { font-size: 14.5px; line-height: 1.55; color: var(--body-ink); margin: 0 0 8px; }
.pf2-q p:last-child { margin-bottom: 0; }
.pf-qa-list { margin: 0 0 8px 1.1em; padding: 0; font-size: 14.5px; line-height: 1.5; }
.pf-qa-list li { margin-bottom: 2px; }
.pf2-q a { color: #003DA5; }
/* ---------- Table + method ---------- */
.pf2-ref { background: #FFFFFF; }
.pf2-ref-grid { display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(0, .75fr); gap: 32px; align-items: start; }
.pf-table { min-width: 0; width: 100%; }
.pf-table caption { caption-side: bottom; text-align: left; font-size: 12.5px; line-height: 1.5; color: var(--body-ink); padding-top: 8px; }
.pf-table th, .pf-table td { padding: 7px 8px; }
.pf-table td { text-align: center; font-variant-numeric: tabular-nums; }
.pf-table thead th:not(:first-child) { text-align: center; }
.pf-table tbody th { white-space: normal; font-size: 14px; }
.pf-dim { display: block; font-weight: 400; font-size: 12.5px; color: var(--body-ink); }
.pf2-method p { font-size: 14.5px; line-height: 1.6; color: var(--body-ink); margin: 0 0 10px; }
.pf2-method a { color: #003DA5; }
/* ---------- Sources ---------- */
.pf2-src-s { background: #EEF3FA; }
main:has(#pf-form) .pf2-src-s.content-section { padding-top: 36px; padding-bottom: 36px; }
.pf2-srcs > summary { list-style: none; cursor: default; min-height: 24px; }
.pf2-srcs > summary::-webkit-details-marker { display: none; }
.pf2-src-intro { font-size: 14px; margin: 0 0 8px; }
.pf2-src-list { columns: 3; column-gap: 28px; margin: 0; padding-left: 18px; font-size: 12.5px; line-height: 1.4; }
.pf2-src-list li { margin-bottom: 5px; overflow-wrap: anywhere; break-inside: avoid; max-width: none; }
.pf2-src-list a { color: #003DA5; }
/* ---------- Responsive ---------- */
@media (max-width: 1100px) { .pf2-grid { grid-template-columns: minmax(0, 1fr) 380px; gap: 22px; } .pf2-ref-grid { grid-template-columns: 1fr; gap: 10px; } .pf2-src-list { columns: 2; } }
@media (max-width: 960px) {
  .pf2-grid { grid-template-columns: 1fr; }
  .pf2-panel { position: static; max-height: none; overflow: visible; }
  .pf2-mini { display: flex; position: sticky; bottom: 0; z-index: 5; margin: 0 -22px -12px; padding: 4px 14px; background: #002B75; color: #FFFFFF; align-items: center; justify-content: space-between; gap: 10px; font-variant-numeric: tabular-nums; }
  .pf2-mini-l { font-family: 'Oswald', sans-serif; letter-spacing: .1em; font-size: 12px; }
  .pf2-mini b { color: #FFFFFF; font-size: 16px; margin-left: 4px; }
  .pf2-mini a { color: #FFFFFF; min-height: 44px; display: inline-flex; align-items: center; font-size: 13.5px; font-weight: 600; text-decoration: underline; }
}
@media (max-width: 760px) {
  body:has(#pf-form) .page-hero { padding: 28px 18px 22px; }
  body:has(#pf-form) .page-hero p { font-size: 15.5px; }
  .pf2-jump { padding: 0 14px; } .pf2-jump .content-container { gap: 0 16px; } .pf2-jump a { font-size: 12.5px; }
  main:has(#pf-form) .content-section { padding: 32px 14px; }
  body:has(#pf-form) .cta-section { padding: 40px 18px; }
  .pf2-qgrid { columns: 1; }
  .pf2-src-list { columns: 1; }
  .pf2-row { grid-template-columns: 1fr 1fr; } .pf2-row > :last-child { grid-column: 1 / -1; }
  .pf-form.wf-form { padding: 4px 12px 12px; }
  .pf2-mini { margin: 0 -12px -12px; }
  .pf2-panel { padding: 12px 12px; }
  .pf-big { font-size: 38px; }
  .pf-intro { font-size: 15.5px; }
  .pf2-art text { font-size: 24px; }
}
@media (max-width: 600px) {
  .pf2-seg .pf-choice { font-size: 13px; padding: 6px 4px; }
  .pf2-seg-4 { grid-template-columns: repeat(2, 1fr); }
  .pf2-seg-4 .pf-choice:nth-child(3) { border-left: 0; }
  .pf2-seg-4 .pf-choice:nth-child(n+3) { border-top: 1px solid rgba(0, 61, 165, .35); }
  .pf2-seg-3 { grid-template-columns: repeat(2, 1fr); }
  .pf2-seg-3 .pf-choice { border-left: 1px solid rgba(0, 61, 165, .35) !important; border-top: 0 !important; }
  .pf2-seg-3 .pf-choice:nth-child(odd) { border-left: 0 !important; }
  .pf2-seg-3 .pf-choice:nth-child(n+3) { border-top: 1px solid rgba(0, 61, 165, .35) !important; }
  .pf2-rows { grid-template-columns: 1fr; }
  .pf2-rows > li + li { border-left: 0; padding-left: 4px; }
  .pf2-actions { flex-wrap: wrap; } .pf2-actions .form-submit { flex: 1 1 100%; justify-content: center; display: flex; }
  .pf2-q > summary, .pf2-srcs > summary { cursor: pointer; min-height: 44px; display: flex; align-items: center; justify-content: space-between; gap: 10px; }
  .pf2-q > summary::after, .pf2-srcs > summary::after { content: "+"; flex: 0 0 auto; font: 700 22px/1 Oswald, sans-serif; color: #FF6720; }
  .pf2-q[open] > summary::after, .pf2-srcs[open] > summary::after { content: "\2212"; }
  .pf2-q h3 { margin: 0; }
  .pf2-q[open] h3 { margin-bottom: 6px; }
  .pf2-q { padding: 6px 14px; }
  .pf2-srcs > summary .pf2-h2 { margin: 0; }
  .pf-table th, .pf-table td { padding: 8px 6px; font-size: 14px; }
  .pf-table thead th { font-size: 11.5px; letter-spacing: 0.02em; }
}
@media (max-width: 360px) {
  .pf-table th, .pf-table td { padding: 7px 3px; font-size: 13px; }
  .pf-table thead th { font-size: 10.5px; letter-spacing: 0; }
  .pf-dim { font-size: 12px; }
}
@media print {
  .pf2-jump, .pf2-mini, .pf-form { display: none !important; }
  .pf2-panel { position: static; max-height: none; overflow: visible; }
  .pf2-grid, .pf2-qgrid, .pf2-ref-grid { display: block; }
}
.pf-form .form-row label.pf2-h3 { font-size: 17px; letter-spacing: .04em; margin-bottom: 10px; color: var(--navy); }
.pf-table.spec-table th, .pf-table.spec-table td { padding: 5px 8px; line-height: 1.3; }
.pf-table.spec-table thead th { padding: 8px; }
.pf2-ref-m p { margin: 0 0 12px; font-size: 15px; line-height: 1.6; }
.pf2-ref-grid { grid-template-columns: minmax(0, 1.15fr) minmax(0, .85fr); }
@media (max-width: 1100px) { .pf2-ref-grid { grid-template-columns: 1fr; } }
@media (max-width: 760px) { .pf-table.spec-table th, .pf-table.spec-table td { padding: 7px 4px; } }
.pf2-faq-head { display: grid; grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr); gap: 8px 40px; align-items: end; margin-bottom: 20px; }
.pf2-faq-head .pf-intro { margin: 0; font-size: 15.5px; }
@media (max-width: 960px) { .pf2-faq-head { grid-template-columns: 1fr; } }
