/* Free homepage check (/scanner, resources/views/guest/scanner.blade.php) on top of base.css: the scan flow's teal-sky-peach
   canvas (the one /analyzing uses), the two-tone hero with the check form, a picture of the report on the stage, the ten checks
   in two wash tiles, the limits list with plan tags. Preview statuses use base tokens: wheat = to do, good = in place. */
:root{
  --canvas-base:linear-gradient(172deg,#fbfdfc 0%,#eaf4f3 40%,#fbeee5 72%,#e6eff9 100%);
  --canvas-a:rgba(92,194,186,.58);
  --canvas-b:rgba(126,178,240,.62);
  --canvas-c:rgba(246,176,138,.6);
  --canvas-d:rgba(150,208,236,.55);
}
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]){
    --canvas-base:linear-gradient(172deg,#121618 0%,#13191b 42%,#1c1715 72%,#121926 100%);
    --canvas-a:rgba(60,150,144,.26); --canvas-b:rgba(80,128,210,.28); --canvas-c:rgba(200,118,80,.22); --canvas-d:rgba(76,148,190,.2);
  }
}
:root[data-theme="dark"]{
  --canvas-base:linear-gradient(172deg,#121618 0%,#13191b 42%,#1c1715 72%,#121926 100%);
  --canvas-a:rgba(60,150,144,.26); --canvas-b:rgba(80,128,210,.28); --canvas-c:rgba(200,118,80,.22); --canvas-d:rgba(76,148,190,.2);
}

/* ---------- hero ---------- */
.sc-kicker{font-size:14px;font-weight:500;line-height:1.4;color:var(--muted)}
.sc-hero .sc-kicker{margin-bottom:18px}
.h1.sc-duo{max-width:15em}
.sc-duo > span:not(.nw){color:var(--muted)}
.sc-hero .form-note a{color:inherit;font-weight:500;text-underline-offset:3px}
.sc-marks{list-style:none;display:flex;flex-wrap:wrap;justify-content:center;gap:8px 20px;margin:20px 0 0;padding:0}
.sc-marks li{display:inline-flex;align-items:center;gap:7px;font-size:14px;line-height:1.4;color:var(--ink-2)}
.sc-marks .ic{width:14px;height:14px;stroke-width:2.25;color:var(--good)}

/* ---------- stage: the report preview (fictional site) ---------- */
.sc-stage .stage-inner{padding-block:clamp(48px,6vw,88px)}
.sc-fig{max-width:920px;margin:0 auto}
.sc-shot{overflow:hidden;background:var(--paper);box-shadow:var(--sh-shot)}
.sc-bar{display:flex;align-items:center;gap:12px;height:46px;padding:0 12px 0 16px;border-bottom:var(--hair) solid var(--rule);background:var(--wash)}
.sc-dots{display:flex;gap:6px}
.sc-dots i{width:10px;height:10px;border-radius:50%;background:var(--line-2)}
.sc-url{display:flex;align-items:center;gap:6px;flex:1 1 auto;min-width:0;max-width:420px;height:28px;margin-inline:auto;padding:0 12px;border-radius:7px;background:var(--card);box-shadow:inset 0 0 0 var(--hair) var(--line);font:400 12px/1 var(--mono);color:var(--muted)}
.sc-url span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.sc-url .ic{width:12px;height:12px}
.sc-tag{flex:none;display:inline-flex;align-items:center;height:24px;padding:0 9px;border-radius:7px;background:var(--card);box-shadow:inset 0 0 0 var(--hair) var(--line-2);font-size:12px;font-weight:500;color:var(--ink)}
.sc-rep{display:flex;flex-direction:column;gap:24px;padding:clamp(22px,4vw,44px)}
.sc-rep-k{font-size:13px;color:var(--muted)}
.sc-rep-dom{margin-top:6px;font:400 clamp(28px,3.4vw,44px)/1.08 var(--display);letter-spacing:-.012em;color:var(--ink);overflow-wrap:anywhere}
.sc-rep-meta{margin-top:10px;font-size:13px;line-height:1.5;color:var(--muted)}
.sc-sum{display:flex;flex-direction:column;gap:18px;padding-top:24px;border-top:var(--hair) solid var(--line-2)}
.sc-sum-h{font-size:14px;font-weight:500;color:var(--ink)}
.sc-sum-row{display:grid;grid-template-columns:auto minmax(0,1fr);gap:clamp(24px,4vw,48px);align-items:center}
.sc-sum-l{display:flex;flex-direction:column;align-items:flex-start;gap:14px}
.sc-count{display:flex;align-items:baseline;gap:12px}
.sc-count-n{font:400 clamp(64px,7vw,84px)/.86 var(--display);letter-spacing:-.03em;font-variant-numeric:lining-nums;color:var(--ink)}
.sc-count-l{max-width:7.5em;font-size:14px;line-height:1.35;color:var(--muted)}
.sc-ok{display:inline-flex;align-items:center;gap:7px;height:28px;padding:0 10px 0 11px;border-radius:7px;background:var(--good-soft);color:var(--good);font-size:13px;font-weight:500;white-space:nowrap}
.sc-ok .ic{width:13px;height:13px;stroke-width:2.25}
.sc-verdict{font:400 clamp(18px,1.8vw,22px)/1.42 var(--display);color:var(--ink);text-wrap:pretty}
.sc-rows{list-style:none;margin:0;padding:0;border-radius:var(--r-l);background:var(--card);box-shadow:var(--sh-1)}
.sc-rows li{display:grid;grid-template-columns:22px minmax(0,1fr) 16px;gap:14px;align-items:start;padding:16px 20px;border-top:var(--hair) solid var(--rule)}
.sc-rows li:first-child{border-top:0}
.sc-mk{display:grid;place-items:center;width:22px;height:22px;border-radius:6px;background:var(--wheat-soft);color:var(--wheat-ink)}
.sc-mk .ic{width:13px;height:13px;stroke-width:2.25}
.sc-row-t{display:flex;flex-direction:column;gap:4px;min-width:0}
.sc-row-t b{font-size:15px;font-weight:500;line-height:1.4;color:var(--ink)}
.sc-row-t code{font-size:12px;line-height:1.4;color:var(--muted);overflow-wrap:anywhere}
.sc-chev{margin-top:3px;color:var(--muted)}
.sc-band{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:16px 24px;padding:20px 24px;border-radius:var(--r-l);background:var(--wash)}
.sc-band p{flex:1 1 320px;font:400 18px/1.45 var(--display);color:var(--ink);text-wrap:pretty}
.sc-band .btn{flex:none;pointer-events:none}
.sc-band .btn .ic{width:15px;height:15px}
.sc-cap{margin-top:20px;text-align:center;font-size:13px;color:var(--ink-2)}
@media (max-width:640px){
  .sc-dots{display:none}
  .sc-sum-row{grid-template-columns:1fr;gap:18px}
  .sc-rows li{padding:14px 16px;gap:12px}
  .sc-band{padding:18px}
  .sc-band p{flex-basis:100%;font-size:17px}
  .sc-band .btn{width:100%;white-space:normal;height:auto;min-height:44px;padding-block:10px;text-align:center}
}

/* ---------- the ten checks ---------- */
.uq-head .sc-kicker{margin-bottom:-6px}
.sc-groups{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
.sc-group{gap:0}
.sc-group-h{display:flex;align-items:baseline;justify-content:space-between;gap:16px;padding-bottom:18px}
.sc-group-n{font:500 12px/1 var(--mono);color:var(--muted)}
.sc-checks{list-style:none;margin:0;padding:0}
.sc-checks li{display:grid;grid-template-columns:28px minmax(0,1fr);gap:12px;padding:16px 12px;margin-inline:-12px;border-top:var(--hair) solid var(--line-2);border-radius:0;transition:background-color var(--t-2)}
.sc-step{font:500 12px/22px var(--mono);color:var(--muted);font-variant-numeric:tabular-nums}
.sc-checks b{display:block;font-size:15px;font-weight:500;line-height:22px;color:var(--ink)}
.sc-checks p{margin-top:2px;font-size:14px;line-height:1.5;color:var(--muted)}
/* a link from the report (/scanner#check-<id>) lights its row */
.sc-checks li:target{border-radius:var(--r-s);background:var(--card);box-shadow:var(--sh-1)}
.sc-checks li:target + li{border-top-color:transparent}
@media (max-width:860px){.sc-groups{grid-template-columns:1fr}}

/* ---------- limits: what the free check won't show, and which plan does ---------- */
.sc-limits{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:32px clamp(32px,5vw,72px);align-items:start}
.sc-limits-head{position:sticky;top:96px;display:flex;flex-direction:column;align-items:flex-start;gap:18px}
.sc-limits-head .uq-lead{text-align:left}
.sc-more{display:inline-flex;align-items:center;gap:8px;margin-top:4px;font-size:15px;font-weight:500;color:var(--ink);text-decoration:none}
.sc-more:hover{text-decoration:underline;text-underline-offset:4px}
.sc-more .ic{width:15px;height:15px;transition:transform var(--t-2) var(--ease-out)}
.sc-more:hover .ic{transform:translateX(3px)}
.sc-lim{list-style:none;margin:0;padding:0;border-top:var(--hair) solid var(--line-2)}
.sc-lim li{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px 24px;align-items:start;padding:22px 0;border-bottom:var(--hair) solid var(--line-2)}
.sc-lim b{display:block;font:400 20px/1.3 var(--display);color:var(--ink);text-wrap:balance}
.sc-lim p{margin-top:6px;font-size:15px;line-height:1.55;color:var(--muted)}
.sc-plan{display:inline-flex;align-items:center;height:24px;margin-top:2px;padding:0 9px;border-radius:7px;background:var(--wash);box-shadow:inset 0 0 0 var(--hair) var(--line);font-size:12px;font-weight:500;color:var(--ink);white-space:nowrap}
.sc-plan.is-max{background:var(--ink);color:var(--paper);box-shadow:none}
@media (max-width:860px){.sc-limits{grid-template-columns:1fr}.sc-limits-head{position:static}}
@media (max-width:520px){.sc-lim li{grid-template-columns:1fr}.sc-plan{grid-row:1;justify-self:start;margin-top:0}}

/* ---------- finale ---------- */
.sc-finale .finale-card{max-width:680px}
.sc-final-h{font-size:clamp(28px,3vw,40px)}
.finale-card .sc-marks{margin-top:16px}
