/* th-fq.css — the quick questionnaire (th-fq.js, Duval 2026-10-26). Opens in place under the button row: a paper card in a double
   bezel on the void hero, one question per screen, big tap rows; the discount timer pinned to the top of the screen while it is open. */
html.fq-js .tp-go--fq .tp-more{display:inline-flex;align-items:center;gap:.45rem;opacity:1;transform:none;pointer-events:auto;margin-top:1rem;min-height:44px;
  padding:0 .5rem;border:0;background:none;color:rgba(255,255,255,.78);font:600 15px/1 Switzer,ui-sans-serif,system-ui,sans-serif;cursor:pointer}
.tp-go--fq .tp-more svg{width:18px;height:18px;color:#4FD8A6}
.tp-go--fq .tp-more:hover,.tp-go--fq .tp-more:focus-visible{color:#4FD8A6}

/* 10-27: every root/heading rule is scoped to body>.fq: the FAQ blocks (section#faq) use the same .fq / .fq__h class names, and
   the bare full-screen .fq rule turned every FAQ item into a full-screen panel once "More info" opened. */
body>.fq{position:relative;z-index:3;width:min(100%,760px);margin:clamp(14px,2.4vw,24px) auto 0;padding:6px;border:1px solid rgba(255,255,255,.15);
  border-radius:32px;background:rgba(255,255,255,.04);text-align:left;scroll-margin-top:clamp(120px,18vw,150px);
  font-family:Switzer,ui-sans-serif,system-ui,-apple-system,sans-serif}
.fq[hidden]{display:none}
.fq__in{background:#F2F7F4;color:#04241A;border-radius:26px;padding:clamp(16px,3.4vw,30px);min-height:min(560px,80svh);display:flex;flex-direction:column}
.fq__top{display:flex;align-items:center;gap:12px;margin:0 0 clamp(18px,3vh,28px)}
.fq__back{flex:none;width:44px;height:44px;border-radius:50%;border:1.5px solid rgba(2,36,25,.14);background:#fff;color:#04241A;display:grid;place-items:center;cursor:pointer}
.fq__back svg{width:20px;height:20px}
.fq__back--off{visibility:hidden}
.fq__bar{flex:1;height:4px;border-radius:4px;background:rgba(2,36,25,.1);overflow:hidden}
.fq__bar b{display:block;height:100%;background:#37C08C;border-radius:4px;transition:width .4s cubic-bezier(.16,1,.3,1)}
.fq__x{flex:none;min-height:44px;padding:0 6px;border:0;background:none;color:rgba(2,36,25,.62);font:600 14px/1 Switzer,sans-serif;cursor:pointer}
.fq__x:hover,.fq__x:focus-visible{color:#04241A;text-decoration:underline}
body>.fq .fq__h{color:#04241A;margin:0 0 18px;font:900 clamp(26px,5.2vw,40px)/1 Satoshi,ui-sans-serif,system-ui,sans-serif;letter-spacing:-.04em;text-wrap:balance;outline:0}
body>.fq .fq__h--q5{font-size:clamp(20px,3.3vw,28px);line-height:1.2;letter-spacing:-.02em}
.fq__last{margin:0 0 10px;font:700 12px/1 Switzer,sans-serif;letter-spacing:.2em;text-transform:uppercase;color:#0B7A55}
.fq__s{margin:-6px 0 18px;font:500 15px/1.45 Switzer,sans-serif;color:rgba(2,36,25,.7)}
.fq__opts{display:grid;gap:10px}
.fq__o{display:flex;align-items:center;gap:14px;width:100%;min-height:60px;padding:13px 16px;text-align:left;cursor:pointer;background:#fff;
  border:1.5px solid rgba(2,36,25,.12);border-radius:16px;color:#04241A;font:600 16px/1.3 Switzer,sans-serif;transition:border-color .2s,background-color .2s,transform .15s}
.fq__o:hover{border-color:rgba(2,36,25,.32)}
.fq__o:active{transform:scale(.985)}
.fq__o:focus-visible{outline:2px solid #0B7A55;outline-offset:2px}
.fq__o i{flex:none;width:26px;height:26px;border-radius:50%;border:1.5px solid rgba(2,36,25,.28);display:grid;place-items:center;color:transparent;transition:background-color .2s,border-color .2s,color .2s}
.fq__o i svg{width:15px;height:15px}
.fq__o.is-on{border-color:#37C08C;background:#E8F9F1}
.fq__o.is-on i{background:#4FD8A6;border-color:#4FD8A6;color:#02241A}
.fq__yn{display:flex;flex-wrap:wrap;align-items:center;gap:12px;margin-top:auto;padding-top:18px}
.fq__no{min-height:48px;padding:0 14px;border:0;background:none;color:rgba(2,36,25,.66);font:600 15px/1 Switzer,sans-serif;cursor:pointer;text-decoration:underline;text-underline-offset:3px}
.fq__form{display:grid;gap:12px}
.fq__f{display:grid;gap:6px;font:600 13px/1 Switzer,sans-serif;color:rgba(2,36,25,.72)}
.fq__f input{width:100%;min-height:52px;padding:0 14px;border:1.5px solid rgba(2,36,25,.16);border-radius:14px;background:#fff;color:#04241A;font:500 16px/1 Switzer,sans-serif}
.fq__f input:focus{outline:2px solid #0B7A55;outline-offset:1px;border-color:transparent}
.fq__hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.fq__err{margin:0;padding:10px 12px;border-radius:12px;background:#FDECEA;color:#8E1E14;font:600 14px/1.4 Switzer,sans-serif}
.fq__err[hidden]{display:none}
.fq__go{justify-self:stretch;justify-content:space-between;margin-top:6px;min-height:58px;height:auto;padding-top:8px;padding-bottom:8px;text-align:left;white-space:normal;line-height:1.2}
.fq__fine{margin:2px 0 0;font:500 12.5px/1.45 Switzer,sans-serif;color:rgba(2,36,25,.6)}
.fq__fine a{color:#0B7A55}
.fq__load{margin:auto;display:grid;place-items:center;gap:16px;text-align:center;outline:0}
.fq__load i{width:46px;height:46px;border-radius:50%;border:4px solid rgba(2,36,25,.1);border-top-color:#37C08C;animation:fqspin .6s linear infinite}
.fq__load p{margin:0;font:600 15px/1.3 Switzer,sans-serif;color:rgba(2,36,25,.7)}
@keyframes fqspin{to{transform:rotate(360deg)}}
.fq__lock{margin:-6px 0 16px;font:500 15px/1.45 Switzer,sans-serif;color:rgba(2,36,25,.75)}
.fq__lock b{color:#0B7A55}
.fq__plans{display:grid;gap:12px}
@media (min-width:700px){.fq__plans{grid-template-columns:1fr 1fr}}
.fqp{position:relative;display:flex;flex-direction:column;gap:10px;padding:20px 18px 18px;background:#fff;border:1.5px solid rgba(2,36,25,.12);border-radius:20px}
.fqp--rec{border:2px solid #37C08C;box-shadow:0 18px 40px -28px rgba(6,61,43,.55)}
.fqp__badge{align-self:flex-start;padding:6px 10px;border-radius:999px;background:#4FD8A6;color:#02241A;font:700 11.5px/1 Switzer,sans-serif;letter-spacing:.06em;text-transform:uppercase}
.fqp__n{color:#04241A;margin:0;font:900 22px/1.05 Satoshi,ui-sans-serif,system-ui,sans-serif;letter-spacing:-.03em}
.fqp__now{margin:0;display:flex;flex-wrap:wrap;align-items:baseline;gap:8px}
.fqp__now b{font:900 clamp(34px,6vw,44px)/1 'Cabinet Grotesk',Satoshi,ui-sans-serif,system-ui,sans-serif;letter-spacing:-.03em;color:#04241A}
.fqp__now s{font:600 17px/1 Switzer,sans-serif;color:rgba(2,36,25,.5)}
.fqp__now span{font:600 14px/1 Switzer,sans-serif;color:rgba(2,36,25,.62)}
.fqp__how{margin:0;font:500 14px/1.45 Switzer,sans-serif;color:rgba(2,36,25,.72)}
.fqp__f{margin:0;padding:0;list-style:none;display:grid;gap:6px}
.fqp__f li{position:relative;padding-left:18px;font:500 14px/1.4 Switzer,sans-serif;color:#04241A}
.fqp__f li::before{content:"";position:absolute;left:0;top:.5em;width:8px;height:8px;border-radius:50%;background:#37C08C}
.fqp__go{margin-top:auto;justify-content:space-between}
.fqp__note{margin:0;font:500 12.5px/1.4 Switzer,sans-serif;color:rgba(2,36,25,.62)}

.fqbar{position:fixed;left:0;right:0;top:0;z-index:90;display:flex;align-items:center;justify-content:center;gap:clamp(10px,3vw,28px);
  padding:calc(8px + env(safe-area-inset-top,0px)) 14px 8px;background:#063D2B;color:#fff;box-shadow:0 10px 30px -18px rgba(0,0,0,.8);
  font:600 13px/1.1 Switzer,ui-sans-serif,system-ui,sans-serif;transform:translateY(-110%);transition:transform .35s cubic-bezier(.16,1,.3,1)}
.fqbar.is-on{transform:none}
.fqbar__k{color:rgba(255,255,255,.72);letter-spacing:.04em}
.fqbar__w{display:flex;align-items:baseline;gap:7px}
.fqbar__w b{font-weight:700;color:#fff}
.fqbar__w i{font:800 18px/1 'Cabinet Grotesk',Satoshi,ui-sans-serif,sans-serif;font-style:normal;letter-spacing:.02em;color:#4FD8A6;font-variant-numeric:tabular-nums}
.fqbar.is-past20 .fqbar__w:first-of-type{opacity:.45}
@media (max-width:520px){.fqbar__k{display:none}.fqbar__w i{font-size:16px}}
@media (prefers-reduced-motion:reduce){.fqbar{transition:none}.fq__load i{animation-duration:1.6s}.fq__bar b,.fq__o{transition:none}}

/* th-fl.js — the questionnaire lead on a get-started page: details folded into one line, the timer on top, the offer at payment */
html.fl-on body{padding-top:44px}
.fl-hide{display:none!important}
.fl-me{grid-column:1/-1;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:8px 14px;margin:0;padding:12px 14px;
  border:1.5px solid #37C08C;border-radius:14px;background:#E8F9F1;color:#04241A;font:500 14.5px/1.45 Switzer,ui-sans-serif,system-ui,sans-serif}
.fl-me b{font-weight:600;word-break:break-word}
.fl-me button{min-height:40px;padding:0 10px;border:0;background:none;color:#0B7A55;font:600 14px/1 Switzer,sans-serif;text-decoration:underline;text-underline-offset:3px;cursor:pointer}
.fl-note{margin:8px 0 0;padding:10px 12px;border-radius:12px;background:#E8F9F1;color:#04241A;font:600 14px/1.45 Switzer,ui-sans-serif,system-ui,sans-serif}
.fl-note[hidden]{display:none}
/* every text inside the card is ink on paper: the hero paints its own headings white */
.fq__in h3,.fq__in h4,.fq__in p,.fq__in label{color:#04241A}
.fq__in .fq__s,.fq__in .fq__lock,.fq__in .fqp__how,.fq__in .fq__fine{color:rgba(2,36,25,.72)}
.fq__in .fq__last{color:#0B7A55}
.fq__in .fq__err{color:#8E1E14}

/* /pricing — "More products. Priced for you." (fq_build.js applyPricing): every product the picker does not price, from R…, with
   the instant-quote button (opens the questionnaire in place, after this block) */
.fqm{margin-top:clamp(36px,6vw,64px);padding-top:clamp(24px,4vw,40px);border-top:1px solid rgba(2,36,25,.14)}
.fqm__h{margin:0;font:900 clamp(26px,4vw,40px)/1 Satoshi,ui-sans-serif,system-ui,sans-serif;letter-spacing:-.04em;color:#04241A}
.fqm__s{margin:10px 0 22px;font:500 16px/1.45 Switzer,ui-sans-serif,system-ui,sans-serif;color:rgba(2,36,25,.7)}
.fqm__g{display:grid;gap:12px;grid-template-columns:repeat(auto-fill,minmax(250px,1fr))}
.fqm__c{display:flex;flex-direction:column;gap:8px;padding:20px 18px 18px;background:#fff;border:1.5px solid rgba(2,36,25,.12);border-radius:20px}
.fqm__n{margin:0;font:900 20px/1.1 Satoshi,ui-sans-serif,system-ui,sans-serif;letter-spacing:-.02em;color:#04241A}
.fqm__l{margin:0;font:500 14.5px/1.45 Switzer,sans-serif;color:rgba(2,36,25,.72)}
.fqm__p{margin:4px 0 6px;font:700 16px/1.2 Switzer,sans-serif;color:#0B7A55}
.fqm__go{margin-top:auto;justify-content:space-between}

/* FULL SCREEN (Duval 2026-10-26 night: "i need the questionare to be full screen ... with an exit button ontop ... when i hover over
   the text it turns white"). th-fq.js appends .fq to <body> and sets html.fq-open; the page behind does not scroll. Every text
   inside keeps its ink on hover, focus and press, whatever the page's own button rules say. */
html.fq-open,html.fq-open body{overflow:hidden!important}
body>.fq{position:fixed;inset:0;z-index:2147483000;width:auto;max-width:none;margin:0;padding:0;border:0;border-radius:0;background:#F2F7F4;
  overflow-y:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch;scroll-margin-top:0}
.fq__in{box-sizing:border-box;width:100%;max-width:680px;margin:0 auto;min-height:100%;border-radius:0;background:transparent;
  padding:calc(52px + env(safe-area-inset-top,0px)) clamp(18px,5vw,32px) calc(28px + env(safe-area-inset-bottom,0px))}
.fq__top{position:sticky;top:calc(40px + env(safe-area-inset-top,0px));z-index:2;margin:0 0 clamp(18px,3vh,28px);padding:10px 0;background:#F2F7F4}
.fq .fq__x{display:inline-flex;align-items:center;gap:6px;min-height:44px;padding:0 14px 0 16px;border:1.5px solid rgba(2,36,25,.18);
  border-radius:999px;background:#fff;color:#04241A;font:700 14px/1 Switzer,ui-sans-serif,system-ui,sans-serif;text-decoration:none}
.fq .fq__x svg{width:16px;height:16px}
.fq .fq__x:hover,.fq .fq__x:focus-visible{background:#04241A;border-color:#04241A;color:#fff;text-decoration:none}
.fqbar{z-index:2147483001}
.fq .fq__o,.fq .fq__o:hover,.fq .fq__o:focus,.fq .fq__o:active,.fq .fq__o span,.fq .fq__o:hover span{color:#04241A}
.fq .fq__o:hover,.fq .fq__o:focus{background:#fff}
.fq .fq__o.is-on,.fq .fq__o.is-on:hover{background:#E8F9F1}
.fq .fq__no,.fq .fq__no:hover,.fq .fq__no:focus{color:rgba(2,36,25,.7);background:none}
.fq .fq__back:hover,.fq .fq__back:focus{color:#04241A;background:#fff}
.fq .btn--mint,.fq .btn--mint:hover,.fq .btn--mint:focus{color:#02241A}

/* SIMPLE GET-STARTED (Duval 2026-10-26 night: "the entie top of the page the part thats black msut be taken away ... extreemly quick and
   simple almst liek the questionare ... way to much random other text making it extreemly long on mobile"). On the four get-started
   pages (this file + th-fl.js load there): no void hero, no step ledes / field hints / step eyebrows, the agreement as ONE tick
   (th-fl.js builds .gsaccept--all), and a short footer. The checkout engines, their fields, prices, the agreement text, the
   e-signature line and every error message are untouched. */
main.gs .gs-hero{display:none!important}
main.gs{padding-top:calc(92px + env(safe-area-inset-top,0px))}
main.gs .gstep__p,main.gs .gstep .eyebrow,main.gs span.gsf__h{display:none!important}
main.gs .gsaccept--one{display:none!important}
main.gs .gsaccept--all ul{margin:8px 0 0;padding:0 0 0 18px;display:grid;gap:6px;font:500 14px/1.45 Switzer,ui-sans-serif,system-ui,sans-serif;color:rgba(2,36,25,.78)}
main.gs .gsaccept--all b{display:block}
body:has(main.gs) .foot__col,body:has(main.gs) .foot__lede,body:has(main.gs) .foot__nap{display:none!important}
/* 10-27 (Duval): the "No" screen: the product's demos + More info, then the site chatbot for questions now (scoped: the FAQ uses .fq too) */
body>.fq .fq__k{margin:18px 0 10px;font:700 15px/1.35 Switzer,sans-serif;color:#04241A}
body>.fq .fq__nos{display:flex;flex-wrap:wrap;gap:10px}
body>.fq .fq__nos .btn{min-height:48px}
