/* Be Small Claims Wise: design pilot (v118, 28 October 2026). Loaded last on the app page only, so the other Be Wise
   apps that share bw-nav.css and bw-family-claims-uni.css are untouched. Visual only: no wording, order or function
   changes. From the Impeccable critique: R1-R8, R10-R13 (see CHANGES-v118.txt). The ad box is left as decided in v94. */

:root{ --bw-control-edge:#7A8699; }

/* R1. The claim is the primary action on home: one coral button, the other two outlined */
.route:first-child .btn{ background:var(--bw-coral-strong); border-color:var(--bw-coral-strong); color:#fff; }
.route:first-child .btn:hover{ background:#A63B19; border-color:#A63B19; color:#fff; }
.route:not(:first-child) .btn{ background:#fff; color:var(--bw-ink); border-color:var(--bw-harbour); }
.route:not(:first-child) .btn:hover{ background:var(--bw-mist); color:var(--bw-ink); }

/* R2. Pull the three routes up into the first screen */
.hero{ padding:28px 0 64px; margin-bottom:0; }
.routes{ position:relative; margin-top:-40px; box-shadow:0 8px 24px rgba(20,33,61,.10); }
@media (max-width:600px){
  .hero{ padding:20px 0 56px; }
  .hero .lede{ font-size:1rem; line-height:1.55; }
  .hero h1{ font-size:clamp(1.9rem,8vw,2.2rem); }
}

/* R3. Inner-view "Be Wise Apps" strip lines up with the logo and content */
.bw-strip{ padding-left:max(16px, calc((100% - 1080px) / 2 + 16px));
           padding-right:max(16px, calc((100% - 1080px) / 2 + 16px)); background:#0D1629; }

/* R4. Room between the ad box and the page heading */
main > .bw-spot{ margin-bottom:24px !important; }

/* R5. Form controls get a visible edge (3:1) */
select, input[type=text], input[type=number], input[type=search], input[type=date],
input[type=email], input[type=tel], textarea{ border-color:var(--bw-control-edge); }
.opt span, .evrow .x, .sugg button{ border-color:var(--bw-control-edge); }

/* R6. Touch targets of 44px, same text size */
.bw-bottom button{ min-height:44px; padding:12px 8px; }
.bw-burger{ width:44px; height:44px; }
.sugg button{ min-height:44px; }
@media (max-width:840px){ .wsteps button{ min-height:44px; } }
.opt span{ min-height:44px; display:inline-flex; align-items:center; }
.dis-bar button{ min-height:32px; padding:5px 10px; }

/* R8. One coral focus ring; themed selection and placeholders */
.opt input:focus-visible + span{ outline:3px solid var(--bw-coral); outline-offset:2px; }
::selection{ background:#F9D3C6; color:var(--bw-ink); }
input::placeholder, textarea::placeholder{ color:#6B7689; }

/* R9. Shared nav pieces in the site typeface */
.bw-appsbtn, .bw-bottom button{ font-family:"Public Sans", system-ui, sans-serif; }

/* R10. Calculator panels line up */
.grid2 > .panel + .panel, .grid3 > .panel + .panel{ margin-top:0; }
.grid2{ align-items:start; }

/* R11. The five stages drawn as waypoints on one line, not as cards that look clickable */
.steps-strip{ gap:0 12px; position:relative; }
.steps-strip div{ background:transparent; border:0; border-top:2px solid var(--bw-rule-strong);
  border-radius:0; padding:14px 4px 0; position:relative; box-shadow:none; }
.steps-strip div::before{ content:""; position:absolute; top:-7px; left:0; width:12px; height:12px;
  background:var(--bw-harbour);
  -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpolygon points='8,0 10,6 16,8 10,10 8,16 6,10 0,8 6,6'/%3E%3C/svg%3E") center/contain no-repeat;
          mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpolygon points='8,0 10,6 16,8 10,10 8,16 6,10 0,8 6,6'/%3E%3C/svg%3E") center/contain no-repeat; }
.steps-strip div:first-child::before{ background:var(--bw-coral); }

/* R12. Clearer marker for the current wizard stage; fade hints that the phone rail scrolls */
@media (min-width:841px){ .wsteps button.on{ box-shadow:inset 3px 0 0 var(--bw-coral); } }
@media (max-width:840px){
  .wsteps button.on{ box-shadow:inset 0 -3px 0 var(--bw-coral); }
  .wsteps{ -webkit-mask-image:linear-gradient(90deg,#000 88%,transparent); mask-image:linear-gradient(90deg,#000 88%,transparent); }
}

/* R13. Notes set apart by surface and border, not a thick side stripe */
.note{ border:1px solid var(--bw-rule-strong); border-left-width:1px; border-radius:8px; background:#fff; }
.warn{ border:1px solid #E7B9B3; border-left-width:1px; border-radius:8px; }

/* Typography: even headings and no single-word last lines */
h1, h2, h3, summary{ text-wrap:balance; }
p, li{ text-wrap:pretty; }

/* Badge colours readable (amber 4.3:1 -> 5.2:1, red 4.4:1 -> 5.9:1); same hues, a shade darker */
.flag.warn{ color:#7A5D27; }
.flag.stop{ color:#9E3F34; }