:root { color: var(--rtd-ink); background: var(--rtd-soft); font: 16px/1.55 var(--rtd-font); }
* { box-sizing: border-box; }
body { margin: 0; }
main { max-width: 46rem; margin: auto; padding: clamp(.85rem, 3vw, 1.65rem); }
.portal-brand-bar { background: #fff; border: 1px solid var(--rtd-line); border-radius: 17px; padding: .85rem 1rem; margin-bottom: .85rem; }
.portal-hero { background: var(--rtd-hero); color: #fff; border-radius: 21px; padding: clamp(1.2rem, 4vw, 2rem); }
.portal-hero p { margin: .65rem 0 0; color: #dceaf3; max-width: 43rem; }
h1 { margin: .55rem 0 0; line-height: 1.1; font-size: clamp(1.8rem, 5vw, 2.7rem); letter-spacing: -.035em; }
section { background: #fff; border: 1px solid var(--rtd-line); border-radius: 16px; padding: clamp(1rem, 3vw, 1.5rem); margin: 1rem 0; }
h2 { margin: 0 0 .65rem; color: var(--rtd-navy); font-size: 1.25rem; line-height: 1.25; letter-spacing: -.02em; }
section p { margin: .5rem 0; }
input, button, select { font: inherit; }
button, input:not([type=checkbox]), select { min-height: 2.75rem; padding: .5rem .75rem; border: 1px solid #9cb4c5; border-radius: .55rem; }
input, select { color: var(--rtd-ink); background: #fff; max-width: 100%; }
button, .primary-link { min-height: 44px; border: 1px solid transparent; background: var(--rtd-blue); color: #fff; border-radius: 100px; padding: .66rem 1.1rem; font-weight: 750; cursor: pointer; margin: .5rem .35rem .25rem 0; }
button:hover:not(:disabled), .primary-link:hover { background: var(--rtd-navy); color: #fff; }
button:disabled { opacity: .55; cursor: default; }
:focus-visible { outline: 3px solid var(--rtd-teal); outline-offset: 3px; }
label { display: block; margin: .65rem 0; color: var(--rtd-navy); font-weight: 650; }
label input[type=checkbox] { margin-right: .5rem; accent-color: var(--rtd-blue); }
article { padding: .75rem 0; border-top: 1px solid var(--rtd-line); }
article strong, article address { display: block; }
article address { font-style: normal; }
a { color: var(--rtd-blue); }
#status:not(:empty) { padding: .65rem .85rem; border-radius: 9px; background: var(--rtd-blue-light); color: var(--rtd-navy); }
.purchase main { max-width: 48rem; }
.purchase-progress { display: flex; gap: .45rem; flex-wrap: wrap; padding: 0; list-style: none; margin: 1rem 0; }
.purchase-progress li { padding: .24rem .65rem; border: 1px solid var(--rtd-line); border-radius: 1rem; color: var(--rtd-muted); font-size: .84rem; }
.purchase-progress [aria-current] { background: var(--rtd-blue-light); color: var(--rtd-navy); font-weight: 750; }
.fields { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 0 1rem; }
.fields .wide { grid-column: 1/-1; }
.fields input, .fields select, #purchase-promotion input { display: block; width: 100%; margin-top: .3rem; }
.city-picker { position: relative; min-width: 0; }
#city-suggestions { position: absolute; z-index: 2; inset: 100% 0 auto; max-height: min(13rem, 28dvh); overflow-y: auto; list-style: none; margin: -.45rem 0 0; padding: 0; background: #fff; border: 1px solid #9cb4c5; border-radius: .55rem; box-shadow: 0 .35rem .8rem #172c4026; }
#city-suggestions [role=option] { display: flex; align-items: center; min-height: 44px; padding: .4rem .75rem; color: var(--rtd-navy); cursor: pointer; }
#city-suggestions [role=option] + [role=option] { border-top: 1px solid var(--rtd-line); }
#city-suggestions [role=option]:hover, #city-suggestions [aria-selected=true] { background: var(--rtd-blue-light); }
.price { float: right; color: var(--rtd-blue); }
.primary-link { text-decoration: none; display: inline-flex; align-items: center; }
button.secondary { color: var(--rtd-blue); background: #fff; border-color: #9cb4c5; }
#sap-search { width: 100%; }
#sap-search-status { margin: .45rem 0; color: var(--rtd-muted); }
#sap-matches { list-style: none; margin: 0; padding: 0; }
#sap-matches button { width: 100%; text-align: left; background: var(--rtd-soft); color: var(--rtd-navy); border-color: var(--rtd-line); border-radius: .65rem; }
#sap-matches button:hover { background: var(--rtd-blue-light); }
#sap-matches span { display: block; font-size: .9rem; }
#sap-unlisted-fields { min-width: 0; border: 1px solid var(--rtd-line); border-radius: .65rem; padding: .8rem; }
#sap-unlisted-fields legend { font-weight: 650; }
#sap-selection { border-left: .25rem solid var(--rtd-blue); padding: .4rem .65rem; }
#sap-review-notice { padding: .65rem; background: var(--rtd-soft); border-radius: .5rem; }
.sap-driver { padding: .65rem .8rem; border: 1px solid var(--rtd-line); border-radius: 10px; background: var(--rtd-soft); color: var(--rtd-navy); font-weight: 700; }
.sap-choices { min-width: 0; margin: .85rem 0; padding: 0; border: 0; }
.sap-choices legend { color: var(--rtd-navy); font-weight: 700; }
.sap-choices label { display: flex; align-items: center; gap: .65rem; min-height: 44px; padding: .65rem .8rem; border: 1px solid var(--rtd-line); border-radius: 10px; cursor: pointer; }
.sap-choices label:has(input:checked) { background: var(--rtd-blue-light); border-color: var(--rtd-blue); }
.sap-choices input { flex: none; width: 1rem; height: 1rem; min-height: 0; margin: 0; padding: 0; accent-color: var(--rtd-blue); }
.sap-about { background: var(--rtd-soft); color: var(--rtd-muted); font-size: .94rem; }
.sap-about h2 { font-size: 1.05rem; }
.field-error { display: block; margin-top: .3rem; color: #9e2b21; font-weight: 600; }
.purchase [aria-invalid="true"] { outline: 2px solid #9e2b21; outline-offset: 2px; }
[hidden], #status:empty { display: none !important; }
@media (max-width: 32rem) {
  .fields { grid-template-columns: 1fr; }
  .purchase button, .sap-panel button { width: 100%; }
}