/* Websites for Heroes - "About your business" step (tft-biz.js).
   Uses the order flow's tokens and parts: --tf-bg, --tf-surface, --tf-ink, --tf-muted, --tf-line,
   --x-line, --x-box, .tfw-card, .tfw-in, .tfw-note, .tfw-err, .tfw-yn, .tfw-add, .tfx-cta, .tfx-link */
.tfb{display:flex;flex-direction:column;gap:22px;min-width:0}
.tfb [hidden]{display:none !important}
.tfb *{box-sizing:border-box}

/* progress */
.tfb-prog{display:flex;flex-direction:column;gap:10px}
.tfb-count{margin:0;font-size:13px;font-weight:800;letter-spacing:.2em;text-transform:uppercase;color:var(--tf-ink)}
.tfb-bar{height:12px;border-radius:999px;background:var(--tf-line);overflow:hidden;border:2px solid var(--x-line,#111)}
.tfb-bar i{display:block;height:100%;width:0;background:#FFC400;border-radius:999px;transition:width .3s ease}

/* question card */
.tfb-q{gap:18px;min-width:0}
.tfb .tfb-h{margin:0;font-family:Anton,Impact,sans-serif;font-weight:400;font-size:44px;line-height:1.02;letter-spacing:.01em;text-transform:uppercase;color:var(--tf-ink);overflow-wrap:break-word}
.tfb .tfb-h:focus{outline:none}
.tfb .tfb-h:focus-visible{outline:3px solid #FFC400;outline-offset:6px;border-radius:4px}
.tfb-help{margin:-6px 0 0;max-width:680px;font-size:17px;line-height:1.55;color:var(--tf-muted)}
.tfb-opt{display:inline-block;margin-left:6px;padding:3px 10px;border-radius:999px;background:var(--tf-line);color:var(--tf-ink);font-size:12px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;vertical-align:2px}
.tfb .tfw-in{width:100%;min-height:52px}
.tfb .tfw-in:focus{outline:none;border-color:#FFC400;box-shadow:0 0 0 3px rgba(255,196,0,.45)}
.tfb .tfw-in:focus-visible{outline:none}
.tfb .tfw-in[aria-invalid="true"]{border-color:#E3262E}
.tfb-ta{padding:14px 16px;min-height:150px;line-height:1.55;resize:vertical;font-weight:500 !important}
.tfb-ta::placeholder,.tfb .tfw-in::placeholder{color:var(--tf-muted);opacity:.85;font-weight:500}
.tfb-err{margin:0}
.tfb-lab{display:block;font-size:15px;font-weight:800;color:var(--tf-ink);margin-bottom:8px}

/* nav */
.tfb-nav{display:flex;flex-wrap:wrap;align-items:center;gap:14px 24px}
.tfb-nav .tfx-cta{min-height:56px;font-size:17px;padding:0 30px}
.tfb-nav .tfx-link{min-height:44px;font-size:16px}
.tfb-back{margin-left:auto}

/* 1. area */
.tfb-area{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(300px,1fr);gap:24px;align-items:stretch}
.tfb-map{position:relative;z-index:0;isolation:isolate;min-height:440px;border-radius:14px;overflow:hidden;border:3px solid var(--x-line,#111);box-shadow:5px 5px 0 var(--x-box,#111);background:#E8EAE4}
.tfb-map .leaflet-container,.tfb-map.leaflet-container{font:inherit;background:#E8EAE4}
.tfb-map .leaflet-control-attribution{font-size:11px;background:rgba(255,255,255,.85);color:#333}
.tfb-map .leaflet-control-attribution a{color:#333}
.tfb-map-ph{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;padding:24px;text-align:center;color:#44474C;font-weight:800;background:repeating-linear-gradient(45deg,#E8EAE4 0 14px,#DFE2DA 14px 28px)}
.tfb-ctl{display:flex;flex-direction:column;gap:22px;min-width:0;justify-content:center}
.tfb-pcrow{display:flex;gap:10px}
.tfb-pcrow .tfw-in{flex:1 1 auto;min-width:0;text-transform:uppercase;letter-spacing:.06em;font-size:18px;font-weight:800}
.tfb-pcrow .tfw-in::placeholder{text-transform:none;letter-spacing:0}
.tfb-find{flex:0 0 auto;min-height:52px !important;padding:0 24px !important;font-size:16px !important}
.tfb-pcmsg{margin:8px 0 0;min-height:1em;font-weight:700}
.tfb-pcmsg:empty{display:none}
.tfb-town{display:flex;flex-wrap:wrap;align-items:center;gap:6px 10px;padding:12px 14px;border-radius:12px;border:2px dashed var(--tf-line);font-size:15px;color:var(--tf-muted);font-weight:700}
.tfb-townbtn{display:inline-flex;align-items:center;gap:8px;min-height:52px;padding:0 14px;border-radius:999px;border:2px solid var(--x-line,#111);background:var(--tf-surface);color:var(--tf-ink);font:inherit;font-size:16px;cursor:pointer}
.tfb-townbtn b{font-weight:800}
.tfb-townbtn span{color:#FFC400;font-size:18px}
.tfb-townbtn:hover{border-color:#FFC400}
.tfb-townin{flex:1 1 200px}
.tfb-rad{display:flex;align-items:center;gap:14px}
.tfb-step{flex:0 0 auto;width:60px;height:60px;border-radius:50%;border:3px solid var(--x-line,#111);background:#FFC400;color:#111;font:inherit;font-size:32px;font-weight:800;line-height:1;cursor:pointer;box-shadow:3px 3px 0 var(--x-box,#111);display:inline-flex;align-items:center;justify-content:center;padding:0 0 4px}
.tfb-step:active{transform:translate(2px,2px);box-shadow:1px 1px 0 var(--x-box,#111)}
.tfb-step:disabled{opacity:.35;cursor:default;box-shadow:none;transform:none}
.tfb-step:focus-visible{outline:3px solid #FFC400;outline-offset:3px}
.tfb-miles{flex:1 1 auto;display:flex;align-items:baseline;justify-content:center;gap:8px;min-width:0;text-align:center;color:var(--tf-ink)}
.tfb-miles b{font-family:Anton,Impact,sans-serif;font-weight:400;font-size:64px;line-height:1}
.tfb-miles span{font-size:20px;font-weight:800}
.tfb-sum{margin:0;padding:14px 16px;border-radius:12px;background:#FFC400;color:#111;font-size:17px;line-height:1.4;font-weight:600;border:2px solid #111}
.tfb-sum b{font-weight:800}

/* 5. contact */
.tfb-clist{display:flex;flex-direction:column;gap:12px}
.tfb-crow{display:flex;flex-direction:column;gap:12px;padding:14px 16px;border-radius:14px;border:2px solid var(--tf-line);background:var(--tf-bg)}
.tfb-crow.is-on{border-color:#FFC400;box-shadow:inset 0 0 0 1px #FFC400}
.tfb-tick{display:flex;align-items:center;gap:14px;min-height:48px;cursor:pointer}
.tfb-tick input{flex:0 0 auto;width:26px;height:26px;margin:0;accent-color:#FFC400;cursor:pointer}
.tfb-tick > span:last-child{display:flex;flex-direction:column;gap:2px;min-width:0}
.tfb-tick b{font-size:18px;font-weight:800;color:var(--tf-ink)}
.tfb-tick small{font-size:14px;font-weight:600;color:var(--tf-muted)}
.tfb-ico{flex:0 0 auto;width:42px;height:42px;border-radius:50%;display:inline-flex;align-items:center;justify-content:center;background:var(--tf-surface);border:2px solid var(--tf-line);color:var(--tf-ink)}
.tfb-crow.is-on .tfb-ico{background:#FFC400;border-color:#111;color:#111}
.tfb-csub{display:flex;flex-direction:column;gap:10px;padding-left:40px}
.tfb-radios{display:flex;flex-wrap:wrap;gap:8px 18px}
.tfb-radio{display:inline-flex;align-items:center;gap:10px;min-height:44px;font-size:15px;font-weight:600;color:var(--tf-ink);cursor:pointer}
.tfb-radio input{width:22px;height:22px;margin:0;accent-color:#FFC400;flex:0 0 auto}
.tfb-radio > span{min-width:0;overflow-wrap:anywhere}
.tfb-radio b{font-weight:800}
.tfb-radio b.tfb-nw{white-space:nowrap}
.tfb-cin{display:block;max-width:420px}

/* 6. hours */
.tfb-hours{display:flex;flex-direction:column;gap:8px;max-width:760px}
.tfb-day{display:flex;align-items:center;justify-content:space-between;gap:10px 18px;flex-wrap:wrap;padding:8px 12px 8px 14px;border-radius:14px;border:2px solid var(--tf-line);background:var(--tf-bg)}
.tfb-day.is-off{opacity:.8}
.tfb-sw{display:flex;align-items:center;gap:12px;min-height:48px;cursor:pointer;flex:1 1 220px;min-width:0}
.tfb-sw input{position:absolute;opacity:0;width:1px;height:1px;margin:0}
.tfb-swt{position:relative;flex:0 0 auto;width:52px;height:30px;border-radius:999px;background:var(--tf-line);border:2px solid var(--x-line,#111);transition:background .15s}
.tfb-swt::after{content:"";position:absolute;top:3px;left:3px;width:20px;height:20px;border-radius:50%;background:#fff;box-shadow:0 1px 2px rgba(0,0,0,.35);transition:transform .15s}
.tfb-sw input:checked + .tfb-swt{background:#FFC400}
.tfb-sw input:checked + .tfb-swt::after{transform:translateX(22px);background:#111}
.tfb-sw input:focus-visible + .tfb-swt{outline:3px solid #FFC400;outline-offset:3px}
.tfb-sw b{font-size:17px;font-weight:800;color:var(--tf-ink);min-width:104px}
.tfb-sw em{font-style:normal;font-size:13px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;color:var(--tf-muted)}
.tfb-day:not(.is-off) .tfb-sw em{color:var(--tf-ink)}
.tfb-tt{display:flex;align-items:center;gap:10px;flex:0 1 auto}
.tfb-tt > span{font-weight:700;color:var(--tf-muted)}
.tfb-time{display:block}
.tfb-time .tfw-in{width:128px;min-height:48px;padding:0 10px;cursor:pointer}
.tfb-copy{align-self:flex-start;min-height:44px;font-size:16px}
.tfb-ok{margin:-8px 0 0;font-weight:700;color:var(--tf-ink)}
.tfb-ok:empty{display:none}

/* 7. social */
.tfb-soc{display:flex;flex-direction:column;gap:10px}
.tfb-srow{display:grid;grid-template-columns:230px minmax(0,1fr);align-items:center;gap:8px 16px}
.tfb-sname{display:flex;align-items:center;gap:12px;font-size:16px;font-weight:800;color:var(--tf-ink)}
.tfb-sico{flex:0 0 auto;width:44px;height:44px;border-radius:12px;display:inline-flex;align-items:center;justify-content:center;background:var(--tf-ink);color:var(--tf-bg);--tfb-icon-cut:var(--tf-ink)}
.tfb-sico svg{width:24px;height:24px}
.tfb-sico.tfb-s-li,.tfb-sico.tfb-s-yt{color:var(--tf-bg);--tfb-icon-cut:var(--tf-ink)}
.tfb-at{display:flex;min-width:0;max-width:520px}
.tfb-at > span{flex:0 0 auto;display:flex;align-items:center;justify-content:center;width:46px;min-height:52px;border:2px solid var(--x-line,#111);border-right:0;border-radius:12px 0 0 12px;background:var(--tf-surface2,rgba(127,127,127,.14));font-weight:800;font-size:18px;color:var(--tf-ink)}
.tfx-hero-dark .tfb-at > span{border-color:var(--tf-line)}
.tfb-at .tfw-in{flex:1 1 auto;min-width:0;border-radius:0 12px 12px 0}
.tfb .tfb-other{max-width:520px}

/* 8. pages */
.tfb-pages{display:flex;flex-direction:column;gap:12px}
.tfb-plist{display:flex;flex-direction:column;gap:10px}
.tfb-page{display:flex;gap:10px;max-width:560px}
.tfb-page .tfw-in{flex:1 1 auto;min-width:0}
.tfb-x{flex:0 0 auto;width:52px;height:52px;border-radius:12px;border:2px solid var(--tf-line);background:transparent;color:var(--tf-ink);font-size:26px;line-height:1;cursor:pointer}
.tfb-x:hover{border-color:#E3262E;color:#E3262E}
.tfb-x:focus-visible{outline:3px solid #FFC400;outline-offset:2px}
.tfb .tfw-add{min-height:48px;font-size:15px}
.tfb-pnote{max-width:620px;padding:12px 14px;border-radius:12px;border:2px dashed #FFC400;color:var(--tf-ink)}
.tfb .tfw-yn label{min-height:52px;font-size:16px}

/* 9. gas safe */
.tfb-gs{display:flex;flex-direction:column;gap:8px;max-width:420px}
.tfb-gsn{font-size:20px !important;font-weight:800 !important;letter-spacing:.12em}

@media (max-width:900px){
  .tfb .tfb-h{font-size:36px}
  .tfb-area{grid-template-columns:1fr;gap:18px}
  .tfb-map{min-height:0;height:260px;order:-1}
  .tfb-ctl{gap:18px}
}
@media (max-width:760px){
  .tfb{gap:18px}
  .tfb .tfb-h{font-size:30px}
  .tfb-help{font-size:16px;margin-top:-4px}
  .tfb-nav{gap:12px 18px}
  .tfb-nav .tfx-cta{flex:1 1 100%;min-height:56px}
  .tfb-back{margin-left:0;order:3}
  .tfb-skip{order:2}
  .tfb-miles b{font-size:56px}
  .tfb-step{width:56px;height:56px}
  .tfb-csub{padding-left:0}
  .tfb-cin{max-width:none}
  .tfb-srow{grid-template-columns:1fr;gap:6px}
  .tfb-at{max-width:none}
  .tfb-day{flex-direction:column;align-items:stretch;gap:4px;padding:6px 12px 10px}
  .tfb-sw{flex:0 0 auto}
  .tfb-tt{display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);gap:8px}
  .tfb-time .tfw-in{width:100%}
}
@media (max-width:400px){
  .tfb-find{padding:0 18px !important}
  .tfb-radio{font-size:14px}
}
@media (prefers-reduced-motion:reduce){.tfb-bar i,.tfb-swt,.tfb-swt::after{transition:none}}

.tfb-keep{border:0;margin:0 0 18px;padding:0;display:flex;flex-direction:column;gap:8px}
.tfb-keep legend{font-weight:800;font-size:17px;margin-bottom:8px;padding:0}
.tfb-krow{display:flex;align-items:flex-start;gap:12px;padding:12px 14px;border:2px solid var(--tf-line);border-radius:14px;background:var(--tf-surface,#fff);cursor:pointer}
.tfb-krow input{width:22px;height:22px;margin:2px 0 0;flex:none;accent-color:#111}
.tfb-krow span{display:flex;flex-direction:column;gap:2px;min-width:0}
.tfb-krow small{opacity:.75;font-size:13px;line-height:1.35}
.tfb-krow.is-locked{opacity:.6;cursor:default}
.tfb-addq{font-weight:800;font-size:17px;margin:6px 0 10px}

/* Companies House */
.tfb-ch{display:flex;flex-direction:column;gap:14px}
.tfb-ch-find{display:flex;flex-direction:column;gap:8px}
.tfb-chrow .tfw-in{text-transform:none !important;letter-spacing:0 !important;font-size:17px !important;font-weight:600 !important}
.tfb-ch-list{display:flex;flex-direction:column;gap:8px}
.tfb-ch-q{margin:6px 0 2px;font-weight:800;font-size:17px}
.tfb-ch-card{display:flex;align-items:center;gap:12px;width:100%;text-align:left;padding:12px 14px;border:2px solid var(--tf-line);border-radius:14px;background:var(--tf-surface,#fff);color:var(--tf-ink);font:inherit;cursor:pointer}
.tfb-ch-card > span:first-child,.tfb-ch-card.is-on > span:nth-child(2){display:flex;flex-direction:column;gap:3px;min-width:0;flex:1 1 auto}
.tfb-ch-card b{font-size:16px;font-weight:800;overflow-wrap:anywhere}
.tfb-ch-card small{font-size:13px;line-height:1.4;color:var(--tf-muted);overflow-wrap:anywhere}
.tfb-ch-card:hover,.tfb-ch-card:focus-visible{border-color:#111;box-shadow:3px 3px 0 #111}
.tfb-ch-yes{flex:none;padding:6px 12px;border-radius:99px;background:#FFC400;color:#111;font-weight:800;font-size:13px;white-space:nowrap}
.tfb-ch-card.is-on{cursor:default;border-color:#1a7f37;background:rgba(26,127,55,.07)}
.tfb-ch-card.is-on:hover{box-shadow:none}
.tfb-ch-tick{flex:none;width:30px;height:30px;border-radius:99px;background:#1a7f37;color:#fff;display:flex;align-items:center;justify-content:center;font-weight:900}
.tfb-ch-bad{font-style:normal;font-weight:800;color:#B42318;text-transform:capitalize}
.tfb-ch-warn{color:#B42318 !important;font-weight:700}
.tfb-ch-man{display:flex;flex-direction:column;gap:6px;max-width:520px}
.tfb-ch-man .tfb-lab{margin-top:6px}
.tfb-ch-type{align-self:flex-start}
.tfb-ch-sole{margin-top:4px}
.tfb-ch-card.is-on{flex-wrap:wrap;align-items:flex-start}
.tfb-ch-card.is-on > span:nth-child(2){flex:1 1 calc(100% - 60px)}
.tfb-ch-card.is-on [data-ch-change]{margin-left:42px}
@media (min-width:561px){.tfb-ch-card.is-on{flex-wrap:nowrap;align-items:center}.tfb-ch-card.is-on [data-ch-change]{margin-left:0}}
@media (max-width:560px){.tfb-ch-card:not(.is-on){flex-wrap:wrap}.tfb-ch-yes{margin-left:auto}}
/* Google Business listing question */
.tfb-gp-row{display:grid;grid-template-columns:minmax(0,1.4fr) minmax(0,1fr) auto;gap:10px;align-items:end}
.tfb-gp-f{display:flex;flex-direction:column;gap:6px;min-width:0}
.tfb-gp-row .tfb-find{min-height:48px}
.tfb-gp-rate{color:var(--tf-ink) !important;margin-top:2px}
.tfb-gp-rate a{font-weight:700}
.tfb-gp-stars{color:#E8A700}
.tfb-gp-attr{margin:4px 0 0;font-size:12px;color:var(--tf-muted)}
@media (max-width:640px){.tfb-gp-row{grid-template-columns:1fr}.tfb-gp-row .tfb-find{width:100%}}
