:root { color-scheme: light; --navy:#102532; --ink:#17313e; --muted:#61727c; --teal:#0c766d; --teal-deep:#075d56; --mint:#eaf5f1; --cream:#faf8f3; --line:#dbe3e3; --red:#a53b32; font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',Arial,sans-serif; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; color:var(--ink); background:var(--cream); min-width:320px; }
button,input,textarea { font:inherit; }
button { cursor:pointer; }
.site-shell { min-height:100vh; display:flex; flex-direction:column; }
.site-header { min-height:86px; background:var(--navy); color:white; display:flex; align-items:center; gap:14px; padding:16px max(28px,calc((100vw - 1180px)/2)); }
.brand-mark { width:40px; height:40px; flex:0 0 40px; border-radius:12px; background:#d7eecf; position:relative; transform:rotate(-8deg); }
.brand-mark span:first-child { position:absolute; width:16px; height:16px; border:5px solid var(--navy); border-radius:50%; top:7px; left:7px; }
.brand-mark span:last-child { position:absolute; width:16px; height:5px; border-radius:4px; background:var(--navy); top:22px; left:19px; transform:rotate(45deg); }
.brand-text { display:flex; flex-direction:column; line-height:1.1; }
.brand-text strong { font-family:'Avenir Next',-apple-system,BlinkMacSystemFont,'Segoe UI',Arial,sans-serif; font-weight:800; letter-spacing:-.04em; font-size:20px; }
.brand-text small { margin-top:5px; color:#b3c7cb; font-size:11px; letter-spacing:.08em; text-transform:uppercase; }
.secure-note { margin-left:auto; border:1px solid #53717b; border-radius:50px; color:#bbd5d2; padding:8px 12px; font-weight:700; font-size:10px; letter-spacing:.16em; }
.main-panel { width:min(100% - 40px,870px); margin:62px auto 90px; flex:1; }
.eyebrow { font-size:11px; font-weight:800; color:var(--teal); letter-spacing:.2em; }
h1,h2,h3,p { margin-top:0; }
h1,h2,h3 { font-family:'Avenir Next',-apple-system,BlinkMacSystemFont,'Segoe UI',Arial,sans-serif; }
h1 { font-size:clamp(34px,5vw,56px); letter-spacing:-.065em; line-height:1.06; margin:12px 0 12px; color:var(--navy); }
h2 { font-size:clamp(26px,4vw,36px); letter-spacing:-.055em; line-height:1.15; margin:10px 0 10px; color:var(--navy); }
h3 { font-size:18px; letter-spacing:-.03em; }
.form-topline { display:flex; align-items:flex-start; justify-content:space-between; gap:28px; }
.form-topline > div:first-child { max-width:680px; }
.lede,.section-intro { color:var(--muted); font-size:16px; line-height:1.6; }
.lede { margin-bottom:28px; }
.status-pill { display:inline-flex; align-items:center; border:1px solid #cadbd8; background:white; color:var(--teal-deep); border-radius:50px; padding:7px 12px; font-size:11px; font-weight:800; letter-spacing:.05em; white-space:nowrap; text-transform:capitalize; }
.status-pill::before { content:""; width:6px; height:6px; border-radius:50%; background:#28a489; margin-right:7px; }
.status-pill.save-error { border-color:#ebc8c5; color:var(--red); white-space:normal; }
.status-pill.save-error::before { background:var(--red); }
.status-pill.sent { background:#e4f4ec; }
.progress-wrap { margin:10px 0 16px; }
.progress-head { display:flex; justify-content:space-between; margin-bottom:10px; font-size:12px; color:#6e7f86; font-weight:700; }
.progress-track { height:6px; border-radius:99px; background:#dae5e2; overflow:hidden; }
.progress-track div { height:100%; background:var(--teal); border-radius:99px; transition:width .25s; }
.step-list { display:flex; align-items:center; gap:8px; overflow-x:auto; padding:8px 0 18px; scrollbar-width:thin; }
.step-chip { border:1px solid transparent; border-radius:50px; padding:9px 13px; color:#718189; background:transparent; font-size:12px; font-weight:800; white-space:nowrap; }
.step-chip.active { background:#e3f1ed; color:var(--teal-deep); border-color:#c8e3dc; }
.step-chip.done { color:var(--teal); }
.card { background:#fff; border:1px solid #e6eae8; border-radius:22px; box-shadow:0 12px 38px rgba(13,41,48,.045); padding:42px 48px; }
.section-number { color:var(--teal); font-size:11px; font-weight:800; letter-spacing:.18em; }
.section-intro { margin:0 0 28px; max-width:660px; }
.questions { display:grid; grid-template-columns:1fr 1fr; column-gap:24px; }
.question { grid-column:span 2; border-top:1px solid #edf0ef; padding:23px 0 24px; }
.question:first-child { border-top:none; padding-top:2px; }
.question[data-field="businessName"],.question[data-field="baseCity"],.question[data-field="publicPhone"],.question[data-field="privatePhone"],.question[data-field="website"],.question[data-field="startTime"],.question[data-field="endTime"],.question[data-field="backupName"],.question[data-field="backupPhone"] { grid-column:span 1; }
.question[data-field="baseCity"],.question[data-field="privatePhone"],.question[data-field="endTime"],.question[data-field="backupPhone"] { border-top:1px solid #edf0ef; }
.question-label { display:flex; align-items:center; gap:10px; margin-bottom:12px; }
.question-label label,.question-label span:first-child { font-weight:800; font-size:15px; color:var(--navy); line-height:1.35; }
.required { background:#eef1ec; color:#6e796e; text-transform:uppercase; font-weight:800; letter-spacing:.1em; font-size:9px; border-radius:4px; padding:4px 6px; }
.hint { color:#697e87; margin:-5px 0 13px; font-size:13px; line-height:1.45; }
.question > input,.question textarea { display:block; width:100%; border:1px solid #d5dfdd; border-radius:10px; outline:none; background:#fcfdfb; color:var(--navy); padding:14px 15px; min-height:49px; font-size:15px; transition:border-color .15s,box-shadow .15s; }
.question textarea { min-height:98px; resize:vertical; }
.question > input:focus,.question textarea:focus { border-color:var(--teal); box-shadow:0 0 0 3px #d8eeea; }
.question > input::placeholder,.question textarea::placeholder { color:#a1afb2; }
.option-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:9px; }
.option-grid.days { grid-template-columns:repeat(7,minmax(0,1fr)); }
.option { position:relative; display:block; }
.option input { position:absolute; opacity:0; width:1px; height:1px; }
.option span { min-height:48px; display:flex; align-items:center; padding:10px 13px; border:1px solid #dbe4e1; border-radius:9px; background:#fbfcfa; color:#38505a; font-size:13px; font-weight:700; line-height:1.3; cursor:pointer; transition:background .15s,border-color .15s,box-shadow .15s; }
.option input:checked + span { color:var(--teal-deep); background:var(--mint); border-color:#7bb8aa; box-shadow:inset 0 0 0 1px #7bb8aa; }
.option input:checked + span::before { content:"✓"; display:inline-flex; align-items:center; justify-content:center; width:18px; height:18px; flex:0 0 18px; border-radius:5px; background:var(--teal); color:white; font-size:11px; margin-right:10px; }
.option input:focus-visible + span { outline:3px solid #7ac8ba; outline-offset:2px; }
.option-grid.days .option span { justify-content:center; padding:10px 4px; }
.option-grid.days .option input:checked + span::before { display:none; }
.question.invalid > input,.question.invalid textarea,.question.invalid .option-grid { border-color:var(--red); }
.field-error { margin:8px 0 0; font-size:12px; color:var(--red); }
.form-actions { display:flex; justify-content:space-between; gap:14px; margin-top:30px; padding-top:25px; border-top:1px solid #edf0ef; }
.btn { display:inline-flex; justify-content:center; align-items:center; gap:18px; min-height:52px; padding:12px 24px; border-radius:10px; font-weight:800; font-size:14px; border:1px solid transparent; transition:transform .12s,background .12s; }
.btn:hover:not(:disabled) { transform:translateY(-1px); }
.btn:disabled { cursor:default; opacity:.45; }
.btn.primary { background:var(--teal); color:white; }
.btn.primary:hover:not(:disabled) { background:var(--teal-deep); }
.btn.ghost { background:white; border-color:#d8e1df; color:var(--navy); }
.below-card { text-align:center; margin:19px 0; color:#8b9b9b; font-size:12px; }
.notice { background:#eaf5f1; border-radius:10px; padding:17px 20px; color:#285a52; margin:20px 0 8px; font-size:13px; line-height:1.5; }
.notice strong { display:block; font-size:14px; margin-bottom:4px; }
.notice p { margin:0; }
.notice.warning { background:#fff4e7; color:#754e22; }
.resubmit-note { margin:0 0 18px; }
.review-section { padding:22px 0; border-top:1px solid #edf0ef; }
.review-heading { display:flex; align-items:center; justify-content:space-between; }
.review-heading h3 { margin:0 0 12px; }
.review-heading button { border:0; color:var(--teal); background:none; font-size:13px; font-weight:800; text-decoration:underline; }
.review-row { display:grid; grid-template-columns:40% 60%; gap:16px; font-size:12px; line-height:1.5; padding:6px 0; }
.review-row span { color:#6d7d84; }
.review-row strong { color:#203943; font-weight:700; overflow-wrap:anywhere; white-space:pre-wrap; }
.review-row .empty { color:#a3aeb1; font-style:italic; }
.completion { text-align:center; padding:80px 48px; }
.completion h1 { margin-top:14px; }
.completion p { margin:0 auto 28px; max-width:470px; color:var(--muted); line-height:1.6; }
.completion-icon { width:64px; height:64px; margin:0 auto 24px; display:grid; place-items:center; background:var(--mint); border-radius:50%; color:var(--teal); font-size:34px; font-weight:800; }
.landing { min-height:440px; overflow:hidden; position:relative; }
.landing h1 { max-width:540px; }
.landing p { color:var(--muted); max-width:470px; line-height:1.6; }
.landing-art { position:absolute; right:-80px; bottom:-130px; width:380px; height:380px; border-radius:50%; background:#e9f3ed; }
.moon { position:absolute; width:150px; height:150px; top:45px; left:72px; border-radius:50%; box-shadow:30px 0 0 #cfdfcb; transform:rotate(-25deg); }
.signal { position:absolute; border:3px solid #85b7a9; border-radius:50%; }
.s1 { width:180px; height:180px; top:94px; left:95px; }.s2 { width:245px; height:245px; top:61px; left:63px; opacity:.6; }.s3 { width:310px; height:310px; top:28px; left:30px; opacity:.3; }
.loading { display:flex; flex-direction:column; align-items:center; padding:130px 0; color:var(--muted); }
.spinner { width:28px; height:28px; border:3px solid #c9ddd6; border-top-color:var(--teal); border-radius:50%; animation:spin .8s linear infinite; margin-bottom:14px; }
@keyframes spin { to { transform:rotate(360deg); } }
.admin-top { margin-bottom:25px; }.admin-top p { color:var(--muted); }
.admin-grid { display:grid; grid-template-columns:1fr 1fr; gap:20px; }
.admin-card { padding:30px; }.admin-card-top { display:flex; align-items:center; justify-content:space-between; gap:10px; }.admin-card h2 { font-size:27px; margin:0; }.admin-card p { color:var(--muted); font-size:13px; line-height:1.5; }.admin-card details { margin-top:20px; border-top:1px solid var(--line); padding-top:15px; }.admin-card summary { color:var(--teal); font-size:13px; font-weight:800; cursor:pointer; }.admin-card h3 { margin:18px 0 5px; font-size:15px; }.admin-card .review-row { grid-template-columns:1fr; gap:0; border-bottom:1px solid #edf0ef; }
.site-footer { display:flex; justify-content:space-between; gap:15px; background:var(--navy); color:#91abb0; font-size:11px; padding:25px max(28px,calc((100vw - 1180px)/2)); }
@media (max-width:680px) {
  .site-header { min-height:72px; padding:14px 20px; }.secure-note { display:none; }
  .main-panel { width:calc(100% - 28px); margin:38px auto 55px; }
  .form-topline { display:block; }.form-topline .status-pill { margin-bottom:18px; }.lede { font-size:14px; margin-bottom:14px; }
  .step-list { margin-right:-14px; }.card { padding:28px 21px; border-radius:16px; }
  .questions { grid-template-columns:1fr; }.question,.question[data-field] { grid-column:span 1; }
  .question { padding:21px 0; }.option-grid { grid-template-columns:1fr; }.option-grid.days { grid-template-columns:repeat(4,1fr); }
  .form-actions { gap:10px; }.btn { padding:11px 15px; min-height:50px; font-size:13px; }.btn.primary { flex:1; }
  .review-row { grid-template-columns:1fr; gap:2px; padding:8px 0; }.completion { padding:65px 25px; }.landing { min-height:420px; }.landing-art { opacity:.45; right:-210px; }
  .admin-grid { grid-template-columns:1fr; }.site-footer { padding:22px 20px; }
}
