/* check.css — rules specific to check.html.
   Loaded after site.css; later source order settles any overlap.
   ------------------------------------------------------------------------- */
:root{
    --bg:#f7f5f2;
    --bg-alt:#ffffff;
    --bg-2:#efe9e1;
    --card:#ffffff;
    --card-2:#fcfbf9;
    --ink:#1a1a1a;
    --ink-2:#33454e;
    --muted:#7a736b;
    --line:#e5e1db;
    --line-2:#d8d2c8;
    --primary:#598193;
    --accent:#356277;
    --rainbow:linear-gradient(90deg,#356277,#598193,#689ab1,#7ea597,#d6a441);
    --nav-bg:rgba(247,245,242,.9);
    --bg-glow:radial-gradient(900px 480px at 85% 8%,rgba(233,240,244,.9) 0,transparent 60%),
              radial-gradient(760px 420px at 0% 0%,rgba(239,233,225,.7) 0,transparent 55%);
    --shadow:0 22px 46px -26px rgba(53,98,119,.45);
    --shadow-sm:0 10px 24px -18px rgba(53,98,119,.42);

    --cold:#6f93b8;
    --nurturing:#7ea597;
    --warming:#d6a441;
    --ready:#cf5a34;
    --score:#b0432c;

    --primary-light:color-mix(in srgb,var(--primary) 74%,#fff);
    --primary-dark:color-mix(in srgb,var(--primary) 74%,#000);
    --primary-soft:color-mix(in srgb,var(--primary) 13%,var(--card));
    --primary-ink:#ffffff;

    --radius:26px;
    --radius-sm:16px;
    --font-display:"Segoe UI Rounded","SF Pro Rounded",ui-rounded,"Hiragino Maru Gothic ProN",Quicksand,Comfortaa,Manjari,"Arial Rounded MT","Arial Rounded MT Bold",Calibri,system-ui,sans-serif;
    --font-body:"Open Sans",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
    --font-mono:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
    --h-weight:700;
    --h-track:-.01em;
  }
.btn.ghost{background:var(--card);color:var(--ink);border:1.5px solid var(--line-2);box-shadow:var(--shadow-sm)}
.btn.ghost:hover{background:var(--card);border-color:var(--primary);color:var(--ink)}
.btn:focus-visible,a:focus-visible,button:focus-visible{outline:3px solid var(--warming);outline-offset:2px}
.logo{font-weight:800;font-size:21px;letter-spacing:-.03em;color:var(--ink);
    display:flex;align-items:center;gap:9px;text-decoration:none}
.logo:hover{text-decoration:none}
main{padding:64px 0 80px}
h1.page{font-size:clamp(30px,4vw,44px);margin:0 0 10px;text-align:center}
/* ==========================================================================
     THE CHECK — panels, radar, diagnosis (behaviour from loopinleads-public)
     ========================================================================== */
#thread{max-width:820px;margin:0 auto}
.prompt-label{font-family:var(--font-mono);font-size:12px;letter-spacing:.16em;
    text-transform:uppercase;color:var(--muted);margin:0 0 14px}
.panel{display:none;animation:rise .45s cubic-bezier(.2,.7,.2,1)}
.panel.active{display:block}
@keyframes rise{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
.qcard{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);
    padding:30px 30px 26px;box-shadow:var(--shadow-sm)}
.qcard h2{font-size:clamp(22px,3vw,30px);margin:0 0 6px;text-align:left}
.qcard .hint{color:var(--muted);font-size:15.5px;margin:0 0 20px}
textarea{width:100%;min-height:104px;resize:vertical;border:1.5px solid var(--line-2);
    border-radius:12px;padding:14px 16px;font:16px/1.5 var(--font-body);background:var(--card-2);color:var(--ink)}
textarea::placeholder{color:var(--muted)}
textarea:focus-visible{outline:3px solid var(--warming);outline-offset:2px}
.answers{display:flex;gap:12px;flex-wrap:wrap;margin-top:22px}
.quiz{margin:20px 0 0;border:0;padding:0}
.quiz legend{font-size:14.5px;color:var(--muted);padding:0;margin:0 0 10px}
.quiz .opts{display:flex;gap:10px;flex-wrap:wrap}
.quiz label{display:inline-flex;align-items:center;gap:8px;cursor:pointer;font-size:14.5px;
    border:1.5px solid var(--line-2);border-radius:999px;padding:8px 14px;background:var(--card-2);
    transition:border-color .12s,background .12s,color .12s}
.quiz label:hover{border-color:var(--primary)}
.quiz label:has(input:checked){border-color:var(--primary);background:var(--primary-soft);
    color:var(--primary-dark);font-weight:600}
.quiz input{accent-color:var(--primary);margin:0}
.lanes{display:grid;grid-template-columns:1fr 1fr;gap:16px}
@media (max-width:640px){.lanes{grid-template-columns:1fr}}
.choice{display:block;width:100%;text-align:left;cursor:pointer;background:var(--card);
    border:1.5px solid var(--line-2);border-radius:var(--radius);padding:22px;font:inherit;color:inherit;
    transition:border-color .12s,transform .12s,box-shadow .12s}
.choice:hover{border-color:var(--primary);transform:translateY(-2px);box-shadow:var(--shadow)}
.choice .t{font-family:var(--font-display);font-weight:var(--h-weight);font-size:19px;margin:0 0 4px;
    letter-spacing:-.01em}
.choice .d{color:var(--muted);font-size:14.5px}
.choice.sub{padding:16px 18px}
.choice.sub .t{font-size:16.5px}
.backline{margin-top:18px}
.backlink{background:none;border:0;color:var(--muted);font:600 14px var(--font-body);cursor:pointer;
    padding:6px 0;text-decoration:underline}
.backlink:hover{color:var(--ink)}
.out{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;
    box-shadow:var(--shadow)}
.out-head{padding:26px 30px;color:#fff}
.out.cold .out-head{background:linear-gradient(135deg,color-mix(in srgb,var(--cold) 76%,#000),var(--cold))}
.out.warming .out-head{background:linear-gradient(135deg,color-mix(in srgb,var(--warming) 76%,#000),var(--warming))}
.out.ready .out-head{background:linear-gradient(135deg,color-mix(in srgb,var(--ready) 76%,#000),var(--ready))}
.out-head .stage{font-family:var(--font-mono);font-size:11px;letter-spacing:.16em;text-transform:uppercase;opacity:.85}
.out-head h2{font-size:clamp(23px,3.2vw,32px);margin:8px 0 0;color:#fff;text-align:left}
.out-head h3{font-family:var(--font-body);font-weight:600;font-size:17px;margin:8px 0 0;color:#fff;
    opacity:.92;letter-spacing:0}
.out-body{padding:30px 30px 32px}
.diag{max-width:620px;margin:0 auto;text-align:center}
.radar-wrap svg{max-width:460px;width:100%;height:auto}
.radar-cap{font-family:var(--font-mono);font-size:11px;letter-spacing:.05em;color:var(--muted);margin-top:2px}
.meter-title{font-family:var(--font-mono);font-size:11px;letter-spacing:.14em;text-transform:uppercase;
    color:var(--muted);text-align:center;margin:26px 0 10px}
.meter{display:flex;align-items:center;gap:13px;max-width:480px;margin:0 auto}
.meter-cap{font-family:var(--font-mono);font-size:10px;letter-spacing:.14em;color:var(--muted)}
.meter-track{position:relative;flex:1;height:9px;border-radius:9px;
    background:linear-gradient(90deg,var(--cold),var(--nurturing),var(--warming),var(--ready))}
.meter-dot{position:absolute;top:50%;width:19px;height:19px;border-radius:50%;background:var(--card);
    border:3px solid var(--ink);transform:translate(-50%,-50%);box-shadow:0 2px 7px rgba(0,0,0,.28)}
.diag-lead{font-size:17.5px;color:var(--ink-2);max-width:600px;margin:24px auto 0}
.diag-lead b{color:var(--ink)}
.rblocks{display:grid;gap:14px;margin-top:30px}
.rblock{background:var(--card-2);border:1px solid var(--line);border-radius:14px;padding:22px 24px}
.rblock-label{font-family:var(--font-mono);font-size:12px;letter-spacing:.12em;text-transform:uppercase;
    color:var(--muted);margin:0 0 20px;display:flex;align-items:center;gap:10px}
.rblock-label::before{content:"";width:9px;height:9px;border-radius:50%;background:var(--dot,var(--muted));flex:none}
ul.pains{list-style:none;margin:0;padding:0;display:grid;gap:10px}
ul.pains li{position:relative;padding:0 0 0 24px;font-size:15.5px;color:var(--ink-2);line-height:1.5}
ul.pains li::before{content:"–";position:absolute;left:4px;top:0;color:var(--score);font-weight:800}
ol.road{margin:0;padding:0;counter-reset:r;list-style:none;display:grid;gap:12px}
ol.road li{position:relative;padding:3px 0 3px 42px;font-size:15.5px;color:var(--ink-2);line-height:1.5;min-height:30px}
ol.road li::before{counter-increment:r;content:counter(r);position:absolute;left:0;top:1px;width:30px;height:30px;
    border-radius:50%;background:var(--primary);color:var(--primary-ink);font:800 14px var(--font-display);
    display:flex;align-items:center;justify-content:center}
.rblock p{margin:0;font-size:15.5px;color:var(--ink-2)}
.rblock p b{color:var(--ink)}
.cta-row{display:flex;align-items:center;gap:16px;flex-wrap:wrap;margin-top:28px}
.cta-note{font-size:13.5px;color:var(--muted);max-width:360px}
.soft-out{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);
    padding:34px 32px;text-align:center;box-shadow:var(--shadow-sm)}
.soft-out h2{text-align:center;margin:0 0 12px}
.soft-out p{color:var(--ink-2);max-width:520px;margin:0 auto 8px;font-size:16.5px}
@media (prefers-reduced-motion:reduce){
    html{scroll-behavior:auto}
    .panel{animation:none}
    .btn,.choice{transition:none}
  }
@media (max-width:860px){
    nav .links{gap:12px}
    main{padding:46px 0 60px}
  }

/* Was style="…" on the element; the service's CSP forbids that. */
.dot--rust{--dot:#b0432c}
.dot--gold{--dot:#d6a441}
.dot--ink{--dot:#1a1a1a}
.dot--sage{--dot:#7ea597}
.u-center{text-align:center}
.u-one-col{grid-template-columns:1fr;gap:12px;margin-top:6px}
.u-left-12{left:12%}
.u-left-50{left:50%}
.u-left-92{left:92%}
