/* LOCAL (see PATCHES.md patch 495): /tools/no-show-calculator. Loaded AFTER for-schools.css (patch 491),
 * whose header, buttons, fields and palette it reuses (the page is `.fsc .nsc`). Only what is new here.
 *
 * Mobile first: one column, the 16px gutter of .fsc-wrap, no sideways scroll (.fsc has overflow-x: clip
 * and every row here can wrap). LOGICAL properties only. Contrast (tests/brand/contrast_test.php's
 * palette): white on navy 18.8:1, gold on navy 13.6:1, rgba(255,255,255,.80) on navy about 12:1 and on
 * the panel #011F5D about 9.6:1, navy on the gold button 13.6:1. */

.nsc-hero { padding-block: 28px 32px; }
.nsc h1 { font-size: 34px; line-height: 1.08; letter-spacing: -0.03em; }
.nsc-lead { margin-block-start: 14px !important; font-size: 18px; color: rgba(255,255,255,.88); }
.nsc .nsc-h2 { font-size: 24px; }
.nsc-hint { margin-block: 8px 18px !important; }
.nsc-note { margin-block-start: 6px !important; font-size: 14px; color: rgba(255,255,255,.80); }

.nsc-form { display: grid; gap: 18px; }
.nsc-row { display: flex; flex-wrap: wrap; gap: 18px 12px; }
.nsc-grow { flex: 1 1 160px; min-width: 0; }
.nsc-cur { flex: 0 1 130px; min-width: 0; }
.nsc .fsc-field select { width: 100%; min-height: 48px; padding: 10px 12px; border-radius: 10px; border: 1px solid rgba(255,255,255,.35); background: #011F5D; color: #fff; font: 600 16px Manrope, system-ui, sans-serif; }
.nsc .fsc-field select:focus-visible { outline: 3px solid #FFD800; outline-offset: 3px; }

.nsc-out { display: grid; gap: 12px; margin-block-start: 18px !important; }
.nsc-out li { padding: 16px 18px; border: 1px solid var(--fsc-line); border-inline-start: 4px solid var(--fsc-gold); border-radius: 14px; background: rgba(255,255,255,.03); }
.nsc-out p { font-size: 17px; color: #fff; overflow-wrap: anywhere; }
.nsc-out strong { font-family: Archivo, system-ui, sans-serif; font-weight: 900; font-size: 22px; color: #fff; }
.nsc-out strong.fsc-gold { color: var(--fsc-gold); }
.nsc-label { display: block; margin-block-end: 4px; font-size: 13px; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; color: var(--fsc-gold); }
.nsc-keep { background: rgba(255,216,0,.07) !important; border-color: rgba(255,216,0,.45) !important; }
.nsc-keep .nsc-note strong { font-size: 16px; }

.nsc-share { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 16px; margin-block-start: 18px; }
.nsc-share .fsc-btn { min-height: 48px; padding: 10px 22px; font-size: 16px; }


.nsc-cta { display: grid; gap: 10px; justify-items: start; margin-block-start: 32px; padding-block-start: 24px; border-top: 1px solid var(--fsc-line); }
.nsc-cta-lead { font-size: 17px; color: #fff; font-weight: 700; }
.nsc-cta .fsc-btn { width: 100%; white-space: normal; }
@media (min-width: 576px) { .nsc-cta .fsc-btn { width: auto; } }
@media (min-width: 992px) {
    .nsc-hero { padding-block: 48px 40px; }
    .nsc h1 { font-size: 48px; }
}
