/* Service / Experience detail (PAGE-PUB-004, TASK-038)
   A03 detail archetype: header, gallery, key details, options, copy and a
   request panel that stays close to the decision. Tokens only. */

.svc-page { padding: var(--space-8) 0 var(--space-12); background: var(--color-bg-paper); }
.svc-head { max-width: 860px; margin-bottom: var(--space-8); }
.svc-chip { display: inline-block; margin: 0 0 var(--space-3); padding: 5px 12px; border-radius: var(--radius-pill); background: rgba(1, 42, 85, 0.07); font-size: var(--type-caption); font-weight: 600; color: var(--color-brand-navy); }
.svc-head h1 { font-family: var(--font-editorial); font-weight: 400; font-size: var(--type-display-section); line-height: 1.08; color: var(--color-brand-navy); margin: 0 0 var(--space-3); }
.svc-context > span { display: inline-flex; align-items: center; gap: 6px; }
.svc-context svg { width: 15px; height: 15px; flex: none; color: var(--color-brand-navy); }
.svc-context { display: flex; flex-wrap: wrap; gap: var(--space-1) var(--space-5); margin: 0 0 var(--space-4); font-size: var(--type-body-small); color: var(--color-text-secondary); }
.svc-context a { color: inherit; text-underline-offset: 3px; }
.svc-lead { margin: 0; font-size: var(--type-body-large); color: var(--color-text-primary); }

.svc-layout { display: grid; grid-template-columns: minmax(0, 1fr) minmax(300px, 360px); gap: var(--space-10); align-items: start; }
.svc-layout > .gal { grid-column: 1; grid-row: 1; min-width: 0; }
.svc-layout > .svc-main { grid-column: 1; grid-row: 2; }
.svc-layout > .req-panel { grid-column: 2; grid-row: 1 / span 2; }
/* No photos: the content starts in the first row. */
.svc-layout > .svc-main:first-child { grid-row: 1 / span 2; }
.svc-main { min-width: 0; display: grid; gap: var(--space-10); }
.svc-sec h2, .svc-related h2 { font-family: var(--font-editorial); font-weight: 400; font-size: var(--type-heading-editorial); color: var(--color-brand-navy); margin: 0 0 var(--space-4); }
.svc-copy { max-width: var(--container-text); line-height: 1.7; color: var(--color-text-primary); }

/* ---------- Gallery ---------- */
.gal { position: relative; }
.gal-track { list-style: none; margin: 0; padding: 0; display: flex; overflow-x: auto; scroll-snap-type: x mandatory; border-radius: var(--radius-2xl); background: var(--color-bg-sand); scrollbar-width: none; }
.gal-track::-webkit-scrollbar { display: none; }
.gal-track:focus-visible { outline: var(--focus-ring); outline-offset: 3px; }
.gal-slide { flex: 0 0 100%; scroll-snap-align: start; aspect-ratio: 3 / 2; }
.gal-slide img { width: 100%; height: 100%; object-fit: cover; display: block; }
.gal-count { position: absolute; right: var(--space-4); top: var(--space-4); padding: 5px 12px; border-radius: var(--radius-pill); background: rgba(0, 23, 47, 0.72); color: var(--color-text-inverse); font-size: var(--type-caption); font-weight: 600; font-variant-numeric: tabular-nums; }
.gal-btn { position: absolute; top: 0; margin-top: calc((100% * 2 / 3) / 2 - 22px); width: 44px; height: 44px; border: 0; border-radius: 50%; background: rgba(255, 255, 255, 0.92); color: var(--color-brand-navy); display: grid; place-items: center; cursor: pointer; box-shadow: 0 4px 14px rgba(0, 18, 40, 0.18); }
.gal-btn[hidden] { display: none; }
.gal-btn.is-prev { left: var(--space-4); }
.gal-btn.is-next { right: var(--space-4); }
.gal-btn svg { width: 18px; height: 18px; }
.gal-btn:hover:not(:disabled) { background: #fff; }
.gal-btn:disabled { opacity: .45; cursor: default; }
.gal-btn:focus-visible, .gal-thumbs button:focus-visible { outline: var(--focus-ring); outline-offset: 2px; }
.gal-thumbs { list-style: none; margin: var(--space-3) 0 0; padding: 0 0 2px; display: flex; gap: var(--space-2); overflow-x: auto; scrollbar-width: thin; }
.gal-thumbs[hidden] { display: none; }
.gal-thumbs button { display: block; width: 84px; height: 62px; padding: 0; border: 2px solid transparent; border-radius: var(--radius-sm); overflow: hidden; background: var(--color-bg-sand); cursor: pointer; opacity: .7; }
.gal-thumbs button[aria-current="true"] { border-color: var(--color-brand-navy); opacity: 1; }
.gal-thumbs img { width: 100%; height: 100%; object-fit: cover; display: block; }
.gal-caption { margin: var(--space-2) 0 0; font-size: var(--type-caption); color: var(--color-text-secondary); }

/* ---------- Key details ---------- */
.facts-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-3); margin: 0; }
.facts-grid > div { display: grid; grid-template-columns: 36px minmax(0, 1fr); gap: 0 var(--space-3); align-items: center; padding: var(--space-4); border: var(--border-subtle); border-radius: var(--radius-md); background: var(--color-surface-clean); }
.facts-ic { grid-row: span 2; width: 36px; height: 36px; border-radius: 50%; background: rgba(1, 42, 85, 0.07); color: var(--color-brand-navy); display: grid; place-items: center; }
.facts-ic svg { width: 16px; height: 16px; }
.facts-grid dt { font-size: var(--type-caption); font-weight: 600; color: var(--color-text-secondary); }
.facts-grid dd { margin: 0; font-size: var(--type-body); font-weight: 500; color: var(--color-text-primary); overflow-wrap: anywhere; }

/* ---------- Options ---------- */
.opt-intro, .opt-help { font-size: var(--type-body-small); color: var(--color-text-secondary); }
.opt-intro { margin: 0 0 var(--space-4); }
.opt-help { margin: var(--space-5) 0 0; max-width: var(--container-text); }
.opt-list { list-style: none; margin: 0; padding: 0; display: grid; gap: var(--space-3); }
.opt { display: flex; gap: var(--space-4); padding: var(--space-5); border: var(--border-subtle); border-radius: var(--radius-lg); background: var(--color-surface-clean); }
.opt.is-selected { border-color: var(--color-brand-navy); box-shadow: inset 0 0 0 1px var(--color-brand-navy); }
.opt-img { flex: none; width: 120px; height: 90px; object-fit: cover; border-radius: var(--radius-sm); }
.opt-body { flex: 1; min-width: 0; }
.opt-top { display: flex; justify-content: space-between; align-items: flex-start; gap: var(--space-4); margin-bottom: var(--space-1); }
.opt h3 { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-2); font-family: var(--font-ui); font-size: var(--type-heading-ui); font-weight: 600; margin: 0; }
.opt-radio { width: 20px; height: 20px; border-radius: 50%; border: 2px solid var(--color-border-strong); flex: none; display: grid; place-items: center; }
.opt.is-selected .opt-radio { border-color: var(--color-brand-navy); }
.opt.is-selected .opt-radio::after { content: ""; width: 10px; height: 10px; border-radius: 50%; background: var(--color-brand-navy); }
.opt-partner { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-2) var(--space-3); margin: var(--space-3) 0 0; padding: var(--space-3); border-radius: var(--radius-md); background: var(--color-bg-paper); font-size: var(--type-body-small); }
.opt-partner img { width: 36px; height: 36px; border-radius: 50%; object-fit: cover; flex: none; }
.opt-partner span { flex: 1; min-width: 140px; color: var(--color-text-secondary); }
.opt-partner b { color: var(--color-text-primary); font-weight: 600; }
.opt-partner small { display: block; font-size: var(--type-caption); }
.opt-partner a { font-weight: 600; color: var(--color-brand-navy); text-underline-offset: 3px; white-space: nowrap; }
.opt-incl { list-style: none; margin: var(--space-3) 0 0; padding: 0; display: flex; flex-wrap: wrap; gap: 6px var(--space-4); font-size: var(--type-body-small); color: var(--color-text-primary); }
.opt-incl li { position: relative; padding-left: 18px; }
.opt-incl li::before { content: ""; position: absolute; left: 0; top: .45em; width: 8px; height: 5px; border-left: 2px solid var(--color-success); border-bottom: 2px solid var(--color-success); transform: rotate(-45deg); }
.opt-incl li.more { padding-left: 0; color: var(--color-text-secondary); }
.opt-incl li.more::before { display: none; }
.opt-terms { margin-top: var(--space-3); border-top: var(--border-subtle); }
.opt-terms summary { cursor: pointer; padding: var(--space-3) 0 0; font-size: var(--type-body-small); font-weight: 600; color: var(--color-brand-navy); }
.opt-terms summary:focus-visible { outline: var(--focus-ring); outline-offset: 2px; }
.opt-terms .terms { margin-top: var(--space-3); }

/* What an Offering covers (shared with the Partner page) */
.terms { display: grid; gap: var(--space-4); }
.terms-block h4 { font-family: var(--font-ui); font-size: var(--type-body-small); font-weight: 600; color: var(--color-brand-navy); margin: 0 0 var(--space-2); }
.terms-block p { margin: 0; font-size: var(--type-body-small); color: var(--color-text-primary); line-height: 1.6; }
.terms-list { list-style: none; margin: 0; padding: 0; display: grid; gap: 6px; font-size: var(--type-body-small); color: var(--color-text-primary); }
.terms-list li { position: relative; padding-left: 18px; }
.terms-list li::before { content: ""; position: absolute; left: 3px; top: .6em; width: 5px; height: 5px; border-radius: 50%; background: var(--color-accent-ochre); }
.terms-list.is-check li::before { left: 0; top: .45em; width: 8px; height: 5px; border-radius: 0; background: none; border-left: 2px solid var(--color-success); border-bottom: 2px solid var(--color-success); transform: rotate(-45deg); }
.opt h3 a { color: var(--color-brand-navy); text-underline-offset: 3px; }
.opt h3 a:focus-visible, .var:focus-visible { outline: var(--focus-ring); outline-offset: 2px; }
.opt-picked { padding: 2px 10px; border-radius: var(--radius-pill); background: var(--color-brand-navy); color: var(--color-text-inverse); font-size: var(--type-caption); font-weight: 600; }
.opt-place { margin: 0 0 var(--space-1); font-size: var(--type-caption); color: var(--color-text-secondary); }
.opt-desc { margin: 0 0 var(--space-2); font-size: var(--type-body-small); color: var(--color-text-secondary); }
.opt-price { margin: 0; flex: none; text-align: right; font-size: var(--type-body-small); color: var(--color-text-primary); }
.opt-price b { display: block; font-weight: 600; white-space: nowrap; }
.opt-price small { display: block; font-size: var(--type-caption); color: var(--color-text-secondary); }
.opt-none { padding: var(--space-6); border: 1px dashed var(--color-border-strong); border-radius: var(--radius-lg); background: var(--color-surface-clean); }
.opt-none h3 { font-family: var(--font-ui); font-size: var(--type-heading-ui); font-weight: 600; margin: 0 0 var(--space-2); }
.opt-none p { margin: 0; color: var(--color-text-secondary); }

.var-group { margin-top: var(--space-4); padding-top: var(--space-4); border-top: var(--border-subtle); }
.var-title { margin: 0 0 var(--space-2); font-size: var(--type-caption); font-weight: 600; color: var(--color-text-secondary); }
.var-list { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); gap: var(--space-2); }
.var-list li { display: flex; flex-direction: column; min-width: 0; }
.var { display: grid; gap: 2px; flex: 1; padding: var(--space-3) var(--space-4); border: var(--border-strong); border-radius: var(--radius-md); background: var(--color-surface-clean); color: var(--color-text-primary); text-decoration: none; font-size: var(--type-body-small); }
.var:hover { border-color: var(--color-brand-navy); }
.var.is-selected { border-color: var(--color-brand-navy); background: var(--color-brand-navy); color: var(--color-text-inverse); }
.var small { opacity: .8; }
.var span { font-weight: 600; }
.var-info { margin: var(--space-2) 0 0; font-size: var(--type-caption); color: var(--color-text-secondary); }

/* ---------- Concierge note ---------- */
.svc-tip { display: grid; grid-template-columns: 52px minmax(0, 1fr); gap: var(--space-4); margin: var(--space-6) 0 0; padding: var(--space-5) var(--space-6); border: var(--border-subtle); border-radius: var(--radius-lg); background: var(--color-surface-clean); max-width: var(--container-text); }
.svc-tip-mark { width: 52px; height: 52px; border-radius: 50%; background: var(--color-brand-navy); display: grid; place-items: center; }
.svc-tip-mark img { width: 34px; height: 34px; border-radius: 50%; background: #fff; }
.svc-tip figcaption { font-size: var(--type-caption); font-weight: 600; color: var(--color-accent-ochre-deep); margin-bottom: var(--space-2); }
.svc-tip blockquote { margin: 0; font-family: var(--font-editorial); font-size: 1.25rem; line-height: 1.45; color: var(--color-brand-navy); }
.svc-tip-by { margin: var(--space-3) 0 0; font-size: var(--type-caption); color: var(--color-text-secondary); }

/* ---------- Request panel ---------- */
.req-panel { position: sticky; top: 100px; display: grid; gap: var(--space-5); padding: var(--space-6); border: var(--border-subtle); border-radius: var(--radius-xl); background: var(--color-surface-clean); box-shadow: var(--shadow-subtle); }
.req-price-top { display: flex; justify-content: space-between; align-items: center; gap: var(--space-3); }
.req-mode { margin: 0; font-size: var(--type-caption); font-weight: 600; color: var(--color-accent-ochre-deep); }
.req-amount { margin: var(--space-2) 0 0; font-family: var(--font-ui); font-weight: 600; font-size: 1.75rem; line-height: 1.15; color: var(--color-text-primary); overflow-wrap: anywhere; }
.req-unit { margin: 2px 0 0; font-size: var(--type-body-small); color: var(--color-text-secondary); }
.req-note { margin: var(--space-3) 0 0; font-size: var(--type-caption); color: var(--color-text-secondary); }
.req-selection { margin: 0; padding: var(--space-4) 0; border-top: var(--border-subtle); border-bottom: var(--border-subtle); }
.req-selection dt { font-size: var(--type-caption); font-weight: 600; color: var(--color-text-secondary); margin-bottom: 2px; }
.req-selection dd { margin: 0; font-size: var(--type-body-small); font-weight: 500; }
.req-selection a { display: inline-block; margin-left: var(--space-2); font-weight: 600; color: var(--color-brand-navy); text-underline-offset: 3px; }
.req-need { color: var(--color-warning); font-weight: 600; }
.req-actions { display: grid; gap: var(--space-2); }
.req-actions .btn { width: 100%; justify-content: center; text-align: center; }
.req-assure { list-style: none; margin: 0; padding: 0; display: grid; gap: var(--space-2); font-size: var(--type-caption); color: var(--color-text-secondary); }
.req-assure li { padding-left: 18px; position: relative; }
.req-assure.is-below, .req-note-short { display: none; }
.req-assure li::before { content: ""; position: absolute; left: 0; top: .45em; width: 8px; height: 5px; border-left: 2px solid var(--color-success); border-bottom: 2px solid var(--color-success); transform: rotate(-45deg); }

.svc-ready { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: var(--space-4); padding: var(--space-5) var(--space-6); border-radius: var(--radius-lg); background: var(--color-bg-sand); }
.svc-ready h2 { font-family: var(--font-editorial); font-weight: 400; font-size: 1.4rem; color: var(--color-brand-navy); margin: 0 0 2px; }
.svc-ready p { margin: 0; font-size: var(--type-body-small); color: var(--color-text-secondary); }

.svc-related { background: var(--color-bg-paper); padding: 0 0 var(--space-12); }
.svc-related-head { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: flex-end; gap: var(--space-3); margin-bottom: var(--space-6); }
.svc-related-head h2, .svc-explore h2 { font-family: var(--font-editorial); font-weight: 400; font-size: clamp(1.6rem, 2.6vw, 2.1rem); color: var(--color-brand-navy); margin: 0; }
.svc-more { display: inline-flex; align-items: center; gap: 6px; font-weight: 600; color: var(--color-brand-navy); text-decoration: none; }
.svc-more svg { width: 16px; height: 16px; }
.svc-explore { background: var(--color-bg-paper); padding: 0 0 var(--space-12); }
.svc-chips { list-style: none; margin: var(--space-4) 0 0; padding: 0; display: flex; flex-wrap: wrap; gap: var(--space-2); }
.svc-chips a { display: block; padding: 9px 16px; border-radius: var(--radius-pill); background: rgba(1, 42, 85, 0.06); font-weight: 500; font-size: var(--type-body-small); color: var(--color-brand-navy); text-decoration: none; }
.svc-chips a:hover { background: var(--color-brand-navy); color: #fff; }
.svc-chips a:focus-visible, .svc-more:focus-visible { outline: var(--focus-ring); outline-offset: 2px; }

/* Photo cards with a caption plate (related Services). No blur: a plain dark plate keeps scrolling smooth. */
.photo-cards { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--space-4); }
.photo-card { position: relative; height: 380px; border-radius: var(--radius-2xl); overflow: hidden; color: #fff; background: linear-gradient(160deg, var(--color-brand-navy-soft) 0%, #3f6f6a 48%, var(--color-accent-ochre) 100%); }
.photo-card > img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; transition: transform var(--motion-image-slow) var(--motion-ease); }
.photo-card:hover > img { transform: scale(1.05); }
.photo-card .tag { position: absolute; top: 14px; left: 14px; z-index: 2; padding: 6px 12px; border-radius: var(--radius-pill); font-size: 0.76rem; font-weight: 600; background: rgba(255, 255, 255, 0.92); color: var(--color-brand-navy); }
.photo-card .plate { position: absolute; left: 10px; right: 10px; bottom: 10px; z-index: 2; border-radius: var(--radius-lg); padding: 16px 18px; background: rgba(0, 23, 47, 0.62); box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.18); }
.photo-card h3 { font-family: var(--font-editorial); font-weight: 400; font-size: 1.4rem; line-height: 1.15; margin: 0 0 4px; color: #fff; }
.photo-card h3 a { color: inherit; text-decoration: none; }
.photo-card h3 a::after { content: ""; position: absolute; inset: -400px -20px -20px; }
.photo-card h3 a:focus-visible { outline: none; }
.photo-card:focus-within { outline: var(--focus-ring); outline-offset: 2px; }
.photo-card .loc { font-size: 0.84rem; color: rgba(255, 255, 255, 0.82); }
.photo-card .row { display: flex; justify-content: space-between; align-items: center; gap: 10px; margin-top: 12px; }
.photo-card .price { font-weight: 600; font-size: 0.9rem; }
.photo-card .go { font-size: 0.82rem; font-weight: 600; padding: 7px 13px; border-radius: var(--radius-pill); background: #fff; color: var(--color-brand-navy); flex: none; }

/* ---------- Partner page (IMP-ISSUE-014) ---------- */
.partner-svc + .partner-svc { margin-top: var(--space-10); padding-top: var(--space-8); border-top: var(--border-subtle); }
.partner-svc-head { display: flex; gap: var(--space-4); align-items: center; margin-bottom: var(--space-4); }
.partner-svc-head img { width: 96px; height: 72px; object-fit: cover; border-radius: var(--radius-md); flex: none; }
.partner-svc-cat { margin: 0 0 2px; font-size: var(--type-caption); font-weight: 600; color: var(--color-accent-ochre-deep); }
.partner-svc-head h3 { font-family: var(--font-editorial); font-weight: 400; font-size: 1.5rem; line-height: 1.2; margin: 0 0 2px; color: var(--color-brand-navy); }
.partner-svc-head h3 a { color: inherit; text-underline-offset: 4px; }
.partner-svc-head p:last-child { margin: 0; font-size: var(--type-body-small); color: var(--color-text-secondary); }
.partner-opt-title { font-family: var(--font-ui); font-size: var(--type-heading-ui); font-weight: 600; color: var(--color-brand-navy); margin: 0; }
.partner-vars { list-style: none; margin: 0; padding: 0; display: grid; gap: 6px; font-size: var(--type-body-small); }
.partner-vars li { display: flex; justify-content: space-between; gap: var(--space-4); padding: 8px 12px; border-radius: var(--radius-sm); background: var(--color-bg-paper); }
.partner-vars b { font-weight: 500; }
.partner-vars span { font-weight: 600; white-space: nowrap; }
.partner-terms:not(:empty) { margin-top: var(--space-4); padding-top: var(--space-4); border-top: var(--border-subtle); }
.partner-actions { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-3) var(--space-5); margin-top: var(--space-5); }
.partner-panel-title { font-family: var(--font-editorial); font-weight: 400; font-size: 1.4rem; line-height: 1.2; color: var(--color-brand-navy); margin: 0; }
.partner-page .svc-layout > .svc-main:first-child { grid-row: 1 / span 2; }

/* Sticky Request bar: tablet and mobile only; the dock steps aside on this page. */
.sticky-req { display: none; }
.svc-page .notice { margin: 0 0 var(--space-4); }

/* ---------- Responsive ---------- */
@media (max-width: 1100px) {
    /* Photos, then price and request, then the detail. */
    .svc-layout { display: flex; flex-direction: column; gap: var(--space-8); }
    .svc-layout > .gal { order: 1; }
    .svc-layout > .req-panel { position: static; order: 2; }
    .svc-layout > .svc-main { order: 3; }
    .photo-cards { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 900px) {
    .sticky-req { display: flex; align-items: center; gap: 12px; position: fixed; z-index: 1100; left: 0; right: 0; bottom: 0; padding: 12px 16px calc(12px + env(safe-area-inset-bottom, 0px)); background: var(--color-surface-clean); border-top: var(--border-subtle); box-shadow: 0 -12px 30px rgba(0, 20, 45, 0.1); }
    .sticky-req.is-auto { transform: translateY(110%); visibility: hidden; transition: transform var(--motion-base) var(--motion-ease), visibility var(--motion-base); }
    .sticky-req.is-auto.show { transform: none; visibility: visible; }
    .sticky-req .sp { flex: 1; min-width: 0; line-height: 1.3; }
    .sticky-req .sp b { display: block; font-size: 0.95rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
    .sticky-req .sp span { display: block; font-size: 0.78rem; color: var(--color-text-secondary); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
    .sticky-req .btn { flex: none; }
    body:has(.sticky-req) .mobile-dock { display: none; }
    body:has(.sticky-req) .consent-banner { bottom: calc(82px + env(safe-area-inset-bottom, 0px)); }
}
@media (max-width: 620px) {
    .svc-page { padding-top: var(--space-6); }
    .gal-track { border-radius: var(--radius-lg); }
    .gal-slide { aspect-ratio: 4 / 3; }
    .opt { flex-direction: column; padding: var(--space-4); }
    .opt-top { flex-direction: column; gap: var(--space-2); }
    .opt-price { text-align: left; }
    .opt-price b, .opt-price small { display: inline; }
    .facts-grid, .photo-cards { grid-template-columns: minmax(0, 1fr); }
    .photo-card { height: 340px; }
    .svc-tip { grid-template-columns: minmax(0, 1fr); padding: var(--space-5); }
    .svc-ready .btn { width: 100%; justify-content: center; }
    .gal-btn { width: 38px; height: 38px; margin-top: calc((100% * 3 / 4) / 2 - 19px); }
    .gal-thumbs button { width: 68px; height: 51px; }
    .opt-img { width: 100%; height: 160px; }
    .var-list { grid-template-columns: minmax(0, 1fr); }
    /* Compact price panel on phones: price, currency, selection and the two actions. */
    .req-panel { padding: var(--space-5); gap: var(--space-4); }
    .req-panel .req-assure { display: none; }
    .req-assure.is-below { display: grid; margin: var(--space-5) 0 0; padding: var(--space-4); border-radius: var(--radius-md); background: var(--color-bg-sand); }
    .req-note-full { display: none; }
    .req-note-short { display: inline; }
    .req-note { margin-top: var(--space-2); }
    .req-selection { padding: var(--space-3) 0; }
    .req-amount { font-size: 1.7rem; }
}
