/* Presentation only. Existing field IDs, state, validation and print forms remain intact. */
@media screen {
  :root { --dpp-primary:#233565; --dpp-primary-dark:#233565; --dpp-accent:#8BD8BC; --dpp-lightblue:#9BC9E2; }
  body { background:#f4f8f7; color:#233565; font-size:17px; line-height:1.55; }
  .app-shell { width:100%; max-width:1500px; margin:0 auto; padding:24px clamp(16px,3vw,48px) 48px; }
  .hero { display:block; max-width:none; margin:0 0 16px; padding:8px 0 0; border:0; border-radius:0; background:transparent; box-shadow:none; }
  .hero .hero-main { padding:0; border:0; border-radius:0; background:transparent; box-shadow:none; overflow:visible; }
  .hero .hero-main::after { content:none; }
  .hero-main h1 { color:#233565; font-size:32px; line-height:1.2; letter-spacing:-.025em; margin:0 0 6px; }
  .hero-main>p { max-width:65ch; margin:0; font-size:18px; color:#445571; }
  .hero-badges { gap:8px; margin-top:10px; }
  .hero-badges .badge { background:#edf8f3; color:#233565; border:1px solid #cbe9dc; font-size:13px; padding:5px 9px; }
  .hero-side { display:block; margin-top:8px; padding:0; border:0; border-radius:0; background:transparent; box-shadow:none; }
  .hero-side summary { padding:8px 0; min-height:44px; font-size:15px; }
  .hero-side>div { margin:16px 0 0; max-width:65ch; }
  .hero-side p { color:#445571; }
  summary { cursor:pointer; min-height:44px; padding:12px 0; font-weight:700; color:#233565; }
  summary::marker { color:#286749; }
  .stepper { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); max-width:none; margin:0 0 16px; padding:0; gap:8px; }
  .stepper .step { display:flex; align-items:center; gap:8px; min-height:58px; padding:10px 12px; border:1px solid #dbe7e3; border-radius:10px; color:#56647a; background:#fff; font-size:14px; font-weight:650; }
  .stepper .step span { flex:0 0 28px; width:28px; height:28px; line-height:28px; border-radius:50%; background:#edf1f6; color:#233565; }
  .stepper .step.active { border:2px solid #233565; background:#edf6fc; color:#233565; }
  .stepper .step.active span { background:#233565; color:#fff; }
  .stepper .step.done { background:#edf8f3; border-color:#8BD8BC; }
  #catalogLoadingStatus { max-width:none; margin:0 0 10px; font-size:14px; color:#526278; }
  main { max-width:none; margin:0 auto; }
  #step-data { max-width:1050px; margin-inline:auto; }
  .panel { padding:clamp(18px,3vw,32px); border:1px solid #dbe7e3; border-radius:18px; background:#fff; box-shadow:none; }
  .section-head h2 { font-size:clamp(23px,2.5vw,29px); letter-spacing:-.02em; line-height:1.25; }
  .section-head p { max-width:68ch; color:#445571; font-size:17px; }
  .mode-choice-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:18px; }
  .mode-start-card { display:grid; grid-template-columns:1fr; grid-template-rows:auto 1fr auto; padding:22px; min-height:195px; border:1px solid #bfd4ce; border-top:5px solid #8BD8BC; border-radius:12px; background:#f8fcfa; text-align:left; box-shadow:none; }
  .mode-start-card strong { font-size:20px; grid-column:1; }
  .mode-start-card>span:not(.mode-arrow) { grid-column:1; max-width:65ch; font-size:16px; color:#445571; }
  .mode-start-card .mode-arrow { grid-column:1; grid-row:3; align-self:end; padding:16px 0 0; color:#233565; }
  button { min-height:48px; font-size:17px; border-radius:10px; box-shadow:none; }
  button.small,.qty-controls button { min-width:44px; min-height:44px; }
  button:hover { transform:none; box-shadow:none; }
  button:active { transform:translateY(1px); }
  button:focus-visible,summary:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible { outline:3px solid #4786ae; outline-offset:3px; }
  .package-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:20px; }
  .card { padding:20px; border:1px solid #cfddd7; border-radius:14px; box-shadow:none; }
  .card.selected { border:2px solid #2f7659; background:#f6fcf9; box-shadow:none; }
  .card h3 { font-size:22px; }
  .package-image-strip { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:8px; margin:16px 0; }
  .package-image { display:flex; align-items:center; justify-content:center; height:156px; min-width:0; min-height:0; padding:8px; box-sizing:border-box; background:#fff; border:1px solid #e4ece8; border-radius:8px; }
  .package-image>img { display:block; flex:0 1 auto; width:100%; height:100%; max-width:100%; max-height:100%; min-width:0; min-height:0; padding:0; box-sizing:border-box; object-fit:contain; }
  .card ul { padding-left:20px; font-size:16px; line-height:1.65; }
  .product-image { min-height:100px; }
  .product-image img { max-height:110px; object-fit:contain; }
  .product-row { grid-template-columns:96px minmax(0,1fr) 110px 140px; }
  .product-icon { width:88px; height:100px; border-radius:9px; background:#fff; }
  .product-icon img { max-width:100%; max-height:96px; object-fit:contain; }
  .dpp-chosen-package,.dpp-data-help { border-bottom:1px solid #dbe7e3; margin-bottom:8px; }
  .dpp-chosen-package .summary-card { margin-bottom:16px; background:#f8fcfa; }
  .dpp-data-help p { max-width:65ch; margin:0 0 16px; color:#445571; }
  .dpp-intake-progress { margin:20px 0; padding:18px 20px; border-radius:12px; border-left:5px solid #8BD8BC; background:#f0f8f5; scroll-margin-top:16px; }
  .dpp-intake-progress p { margin:0 0 4px; font-size:14px; color:#50685e; }
  .dpp-intake-progress h3 { font-size:24px; line-height:1.3; }
  .dpp-stepped-form fieldset { padding:20px 0; margin:0; border:0; min-width:0; }
  .dpp-stepped-form fieldset>legend { position:absolute; width:1px; height:1px; overflow:hidden; clip-path:inset(50%); }
  .dpp-form-group>fieldset { padding:24px 0; border-top:1px solid #dbe7e3; }
  .dpp-form-group>fieldset:first-child { border-top:0; padding-top:8px; }
  .dpp-form-group>fieldset>legend { position:static; width:auto; height:auto; overflow:visible; clip-path:none; padding:0 0 10px; font-size:21px; font-weight:700; color:#233565; }
  .dpp-form-group>details { padding:8px 0 20px; border-top:1px solid #dbe7e3; }
  .dpp-form-group>details>summary { min-height:48px; }
  .dpp-form-group fieldset>p { max-width:72ch; color:#445571; font-size:16px; }
  .dpp-intake-progress .dpp-group-help { max-width:72ch; margin:10px 0 0; font-size:16px; line-height:1.55; color:#445571; }
  .dpp-group-track { display:flex; flex-wrap:wrap; gap:8px 20px; padding:0; margin:0 0 16px; list-style:none; counter-reset:dpp-group; }
  .dpp-group-track li { display:flex; align-items:center; gap:7px; color:#526278; font-size:14px; counter-increment:dpp-group; }
  .dpp-group-track li::before { content:counter(dpp-group); display:grid; place-items:center; width:25px; height:25px; border:1px solid #aebfbb; border-radius:50%; background:#fff; }
  .dpp-group-track li[aria-current=step] { color:#233565; font-weight:750; }
  .dpp-group-track li[aria-current=step]::before { color:#fff; background:#233565; border-color:#233565; }
  .dpp-group-track li.complete::before { background:#8BD8BC; border-color:#8BD8BC; }
  .dpp-form-group .check-row p { margin:6px 0 0; font-weight:400; font-size:16px; line-height:1.6; }
  #documentReview #reviewStatus { padding:12px 15px; border-left:4px solid #9BC9E2; border-radius:5px; background:#f0f6fb; color:#233565; }
  #documentReview[aria-busy=true] #reviewStatus { border-color:#8BD8BC; background:#f0f8f5; }
  #documentReview .check-row { padding:16px; border:1px solid #bfd4ce; border-radius:10px; background:#f8fcfa; }
  #reviewGroup fieldset:disabled .signature-pad { background:#f3f5f6; border-color:#cbd4dc; }
  #reviewGroup fieldset:disabled { color:#526278; }
  label.field,.dpp-stepped-form .check-row { font-size:18px; line-height:1.5; font-weight:650; }
  .dpp-stepped-form input:not([type=checkbox]):not([type=radio]),.dpp-stepped-form select,.dpp-stepped-form textarea { font-size:18px; min-height:50px; padding:12px 14px; border:1px solid #aebfbb; border-radius:9px; }
  .dpp-stepped-form .field-hint,.dpp-stepped-form small { font-size:15px; line-height:1.5; color:#526278; font-weight:400; }
  .dpp-intake-actions { padding-top:20px; border-top:1px solid #dbe7e3; margin-top:12px; }
  .status-message { box-shadow:none; border-radius:10px; font-size:16px; }
  .status-message.success { background:#f0f8f4; color:#233565; border-color:#cbe3d7; }
  .signature-pad { background:#fff; border:2px solid #859aae; }
  .quick-action-bar { position:static; background:#eaf6f0; border-color:#8BD8BC; box-shadow:none; }
  @media(max-width:767px) {
    .app-shell { padding:12px 12px 28px; }
    .hero { padding:6px 0 0; margin-bottom:14px; }
    .hero-main h1 { font-size:28px; }
    .hero-badges { display:grid; grid-template-columns:1fr 1fr; }
    .hero-badges .badge { white-space:normal; }
    .stepper { gap:5px; }
    .stepper .step { display:flex; flex-direction:column; text-align:center; gap:5px; font-size:11px; line-height:1.3; padding:8px 3px; }
    .panel { padding:18px; }
    .mode-choice-grid { grid-template-columns:1fr; }
    .mode-start-card { grid-template-columns:1fr; padding:18px; min-height:150px; }
    .mode-start-card .mode-arrow { grid-column:1; grid-row:auto; padding:8px 0 0; }
    .package-grid,.product-grid,.form-grid,.grid-2,.signature-choice-grid { grid-template-columns:1fr !important; }
    .package-image { height:120px; }
    .product-row { grid-template-columns:88px minmax(0,1fr); }
    .product-main,.stepper .step { min-width:0; overflow-wrap:anywhere; hyphens:auto; }
    .card { padding:16px; }
    .dpp-intake-progress { padding:14px; }
    .dpp-intake-progress h3 { font-size:22px; }
    .dpp-intake-actions,.actions { gap:12px; }
    .actions button { width:100%; }
  }
  @media(prefers-reduced-motion:reduce) { *,*::before,*::after { scroll-behavior:auto !important; animation:none !important; transition:none !important; } }
}
