/* Shared styles for the free tools pages (WhatsApp QR, price list, Google checklist). */
.tool{display:grid;grid-template-columns:1fr 1fr;gap:40px;align-items:start}
@media (max-width:860px){.tool{grid-template-columns:1fr;gap:28px}}
.tool-form{display:grid;gap:20px;background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:24px}
.tool-form h2{font-size:22px}
.qf{display:grid;gap:7px}
.qf label{font-weight:600;font-size:15.5px}
.qf label small{font-weight:400;color:var(--muted);font-size:13.5px}
.qf input,.qf textarea{font:500 17px var(--font-body);color:var(--ink);background:var(--bg);border:1.5px solid var(--line);border-radius:10px;padding:12px 14px;width:100%;box-sizing:border-box}
.qf textarea{min-height:76px;resize:vertical}
.qf input:focus,.qf textarea:focus{outline:none;border-color:var(--pin);box-shadow:0 0 0 3px rgba(247,147,30,.22)}
.qf .hint{font-size:13.5px;color:var(--muted)}
.qf .err{font-size:14px;color:#C0392B;font-weight:600}
.qf-check{display:flex;gap:10px;align-items:center;font-size:15px;cursor:pointer}
.qf-check input{width:20px;height:20px;accent-color:var(--pin)}
.tool-out{display:grid;gap:16px;justify-items:center;position:sticky;top:90px}
@media (max-width:860px){.tool-out{position:static}}
.tool-out canvas{width:100%;max-width:380px;height:auto;border-radius:10px;box-shadow:0 18px 40px -18px rgba(10,42,94,.45),0 0 0 1px var(--line);background:#fff}
.tool-actions{display:flex;flex-wrap:wrap;gap:10px;justify-content:center}
.tool-actions .btn[disabled]{opacity:.45;cursor:not-allowed}
.tool-test{font-size:14.5px;color:var(--amber-text);font-weight:600}
.tool-safe{display:flex;gap:8px;align-items:flex-start;font-size:14px;color:var(--muted);background:var(--teal-soft);border-radius:10px;padding:10px 12px}
.steps3{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;counter-reset:s}
@media (max-width:760px){.steps3{grid-template-columns:1fr}}
.steps3 div{background:var(--bg);border:1px solid var(--line);border-radius:var(--r);padding:20px;counter-increment:s}
.steps3 div::before{content:counter(s);display:inline-grid;place-items:center;width:34px;height:34px;border-radius:50%;background:var(--pin);color:var(--pin-ink);font-weight:700;margin-bottom:10px}
.steps3 h3{font-size:18px;margin-bottom:6px}
.steps3 p{color:var(--muted);font-size:15.5px}
.upsell{display:grid;grid-template-columns:1fr auto;gap:24px;align-items:center;background:var(--band);color:var(--band-fg);border-radius:var(--r);padding:28px}
@media (max-width:760px){.upsell{grid-template-columns:1fr}}
.upsell h2{font-size:clamp(22px,3vw,30px)}
.upsell p{color:var(--band-muted);margin-top:8px}
.upsell .btn-ghost{color:#fff;border-color:rgba(255,255,255,.6)}
.upsell .ctas{display:flex;flex-wrap:wrap;gap:10px}
#printSheet{display:none}
@media print{
  body *{visibility:hidden}
  #printSheet,#printSheet *{visibility:visible}
  #printSheet{display:block;position:fixed;inset:0}
  #printSheet img{width:100%;height:auto}
  @page{size:A4;margin:10mm}
}

/* Price list maker */
.pl-rows{display:grid;gap:10px}
.pl-row{display:grid;grid-template-columns:1fr 110px 40px;gap:8px;align-items:center}
.pl-row input{font:500 16px var(--font-body);color:var(--ink);background:var(--bg);border:1.5px solid var(--line);border-radius:10px;padding:10px 12px;width:100%;box-sizing:border-box}
.pl-row input:focus{outline:none;border-color:var(--pin);box-shadow:0 0 0 3px rgba(247,147,30,.22)}
.pl-del{width:40px;height:40px;border-radius:50%;border:1.5px solid var(--line);background:transparent;color:var(--muted);font-size:20px;line-height:1;cursor:pointer}
.pl-del:hover{border-color:#C0392B;color:#C0392B}
.pl-add{justify-self:start;background:var(--teal-soft);color:var(--teal);border:0;border-radius:999px;padding:9px 18px;font:600 15px var(--font-body);cursor:pointer}
.pl-head{display:grid;grid-template-columns:1fr 110px 40px;gap:8px;font-size:13.5px;color:var(--muted);font-weight:600}

/* Google checklist */
.gc-search{display:grid;gap:12px;background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:24px;margin-bottom:28px}
.gc-search-r{display:flex;flex-wrap:wrap;gap:10px}
.gc-search-r input{flex:1 1 240px;font:500 17px var(--font-body);color:var(--ink);background:var(--bg);border:1.5px solid var(--line);border-radius:10px;padding:12px 14px}
.gc-search-r input:focus{outline:none;border-color:var(--pin);box-shadow:0 0 0 3px rgba(247,147,30,.22)}
.gc-list{display:grid;gap:12px;counter-reset:q}
.gc-q{display:grid;grid-template-columns:1fr auto;gap:12px 20px;align-items:center;background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:16px 18px;counter-increment:q}
.gc-q p{font-weight:600;font-size:16.5px}
.gc-q p::before{content:counter(q) ". ";color:var(--amber-text)}
.gc-yn{display:flex;gap:8px}
.gc-yn button{min-width:64px;padding:9px 14px;border-radius:999px;border:1.5px solid var(--line);background:transparent;color:var(--ink);font:600 15px var(--font-body);cursor:pointer}
.gc-yn button.on.yes{background:#1E8E4F;border-color:#1E8E4F;color:#fff}
.gc-yn button.on.no{background:#C0392B;border-color:#C0392B;color:#fff}
@media (max-width:560px){.gc-q{grid-template-columns:1fr}}
.gc-result{display:grid;gap:14px;background:var(--band);color:var(--band-fg);border-radius:var(--r);padding:24px;position:sticky;top:90px}
@media (max-width:860px){.gc-result{position:static}}
.gc-score{font:700 56px var(--font-display);line-height:1}
.gc-score small{font-size:22px;color:var(--band-muted);font-weight:500}
.gc-meter{height:10px;border-radius:999px;background:rgba(255,255,255,.14);overflow:hidden}
.gc-meter i{display:block;height:100%;width:0;background:var(--pin);border-radius:999px;transition:width .3s}
.gc-verdict{font-weight:600;font-size:18px}
.gc-left{color:var(--band-muted);font-size:14.5px}
.gc-tips{display:grid;gap:10px;margin:0;padding:0;list-style:none}
.gc-tips li{background:rgba(255,255,255,.07);border-radius:10px;padding:12px 14px;font-size:15px;line-height:1.6}
.gc-tips li b{display:block;color:#F7A440;margin-bottom:2px}
.gc-tips a{color:#fff}

/* Website cost page */
.cost-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:16px}
.cost-card,.cost-hid{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:20px;display:grid;gap:8px;align-content:start}
.cost-card{border-top:3px solid var(--pin)}
.cost-card h3,.cost-hid h3{font-size:18px}
.cost-card p,.cost-hid p{color:var(--muted);font-size:15.5px}
.cost-card .cost-price{color:var(--ink);font:700 19px var(--font-display)}
.cost-note{margin-top:16px;font-size:13.5px;color:var(--muted)}
.cost-two{display:grid;grid-template-columns:1fr 1fr;gap:40px}
@media (max-width:860px){.cost-two{grid-template-columns:1fr;gap:20px}}
.cost-list{display:grid;gap:10px;margin:0;padding-inline-start:22px;font-size:16.5px}
.cost-list li::marker{color:var(--amber-text);font-weight:700}
.cc{display:grid;grid-template-columns:1fr 1fr 1.1fr;gap:20px;align-items:start}
@media (max-width:960px){.cc{grid-template-columns:1fr}}
.cc-opt{display:grid;gap:14px;background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:20px}
.cc-a{border-top:3px solid var(--pin)}
.cc-b{border-top:3px solid var(--muted)}
.cc-opt h3{font-size:18px}
.cc-in{display:flex;align-items:center;gap:8px}
.cc-in input{flex:1;min-width:0;font:600 18px var(--font-body);color:var(--ink);background:var(--bg);border:1.5px solid var(--line);border-radius:10px;padding:10px 12px}
.cc-in input:focus{outline:none;border-color:var(--pin);box-shadow:0 0 0 3px rgba(247,147,30,.22)}
.cc-in span{color:var(--muted);font-weight:600;font-size:14px}
.cc-res{display:grid;gap:16px;background:var(--band);color:var(--band-fg);border-radius:var(--r);padding:22px;position:sticky;top:90px}
@media (max-width:960px){.cc-res{position:static}}
.cc-years{display:flex;flex-wrap:wrap;gap:8px;align-items:center;color:var(--band-muted);font-size:14.5px}
.cc-years button{padding:7px 14px;border-radius:999px;border:1.5px solid rgba(255,255,255,.35);background:transparent;color:#fff;font:600 14.5px var(--font-body);cursor:pointer}
.cc-years button.on{background:var(--pin);border-color:var(--pin);color:var(--pin-ink)}
.cc-bar{display:grid;grid-template-columns:70px 1fr auto;gap:10px;align-items:center}
.cc-lab{font-size:14px;color:var(--band-muted)}
.cc-track{height:14px;border-radius:999px;background:rgba(255,255,255,.12);overflow:hidden}
.cc-track i{display:block;height:100%;width:0;border-radius:999px;transition:width .3s}
#barA{background:var(--pin)}
#barB{background:#B7C4DD}
.cc-bar b{font:700 18px var(--font-display);white-space:nowrap}
.cc-verdict{font-weight:700;font-size:19px;color:#F7A440}
.cc-res .hint{color:var(--band-muted);font-size:13.5px}
