/* InvoiceMyCar · shared styles. A Carifly product. */
:root{
  --ink:#14171c;--ink-2:#4d5560;--ink-3:#5f6773;--ground:#f7f5f0;--ground-2:#efece5;--sheet:#fff;
  --rule:#e6e3dc;--rule-2:#dcd8cf;--blue:#12357a;--blue-2:#0b2354;--blue-tint:#e8edf7;--yellow:#ffd400;--yellow-2:#f0c800;
  --green:#1f7a4d;--warn:#b3261e;--display:"Bricolage Grotesque","Archivo",sans-serif;--font:"Archivo","Helvetica Neue",Arial,sans-serif;
}
*{box-sizing:border-box}
html{color-scheme:light;-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{margin:0;background:var(--ground);color:var(--ink);font-family:var(--font);font-size:16px;line-height:1.5;font-variant-numeric:tabular-nums}
::selection{background:var(--yellow);color:var(--ink)}
:focus-visible{outline:3px solid var(--blue);outline-offset:2px;border-radius:4px}
button,input,select,textarea{font:inherit;color:inherit}
h1,h2,h3,p{margin:0}
a{color:var(--blue)}
.d{font-family:var(--display);font-weight:800;letter-spacing:-.03em}
.icon{width:18px;height:18px;stroke:currentColor;fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;flex:none}
.wrap{width:min(100% - 40px,1160px);margin:0 auto}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}

/* buttons */
.btn{height:52px;padding:0 22px;border-radius:10px;border:0;display:inline-flex;align-items:center;justify-content:center;gap:10px;font-size:16px;font-weight:700;cursor:pointer;text-decoration:none;color:var(--ink);background:var(--ground-2);transition:background .15s,transform .08s,opacity .15s;white-space:nowrap}
.btn:hover{background:#e4e0d6}.btn:active{transform:translateY(1px)}
.btn.y{background:var(--yellow)}.btn.y:hover{background:var(--yellow-2)}
.btn.g{background:transparent;border:1.5px solid var(--ink)}.btn.g:hover{background:rgba(20,23,28,.05)}
.btn.k{background:var(--ink);color:#fff}.btn.k:hover{background:#2a2f37}
.btn.sm{height:44px;padding:0 16px;font-size:15px}
.btn[disabled]{opacity:.45;cursor:not-allowed;transform:none}

/* nav */
.nav{height:72px;display:flex;align-items:center;gap:28px}
.brand{display:flex;align-items:center;gap:10px;text-decoration:none;color:inherit}
.brand b{font-family:var(--display);font-weight:800;font-size:21px;letter-spacing:-.03em}
.nav .links{display:flex;gap:26px;margin-left:auto}
.nav .links a{text-decoration:none;font-size:15px;font-weight:500;color:var(--ink)}
.nav .links a:hover{color:var(--blue)}

/* landing */
.hero{display:grid;grid-template-columns:minmax(0,560px) minmax(0,1fr);gap:60px;align-items:center;padding:48px 0 72px}
.hero h1{font-size:clamp(40px,6vw,64px);line-height:1;text-wrap:balance}
.hero .lead{font-size:19px;color:var(--ink-2);max-width:46ch}
.hero .cta{display:flex;gap:12px;flex-wrap:wrap}
.ticks{display:flex;gap:22px;flex-wrap:wrap;font-size:14px;color:var(--ink-2)}
.ticks span{display:flex;align-items:center;gap:7px}.ticks .icon{width:16px;height:16px;stroke:var(--green);stroke-width:2.5}
.phone{width:340px;height:640px;border-radius:36px;background:var(--ink);padding:12px;box-shadow:0 40px 80px -30px rgba(20,23,28,.5);margin:0 auto}
.phone .scr{width:100%;height:100%;border-radius:26px;background:var(--ground);overflow:hidden;display:flex;flex-direction:column}
.band{background:var(--blue);color:#fff;padding:72px 0}
.band h2,.band p{color:#fff}.band .p{color:#b7c3dc}
.h2{font-family:var(--display);font-weight:800;font-size:clamp(30px,4vw,40px);letter-spacing:-.03em;line-height:1.05;text-wrap:balance}
.p{font-size:17px;color:var(--ink-2)}
.steps{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:16px;margin-top:36px}
.steps div{background:rgba(255,255,255,.06);border-radius:12px;padding:22px 20px;display:flex;flex-direction:column;gap:10px}
.steps b{font-size:17px}.steps span{font-size:14px;color:#b7c3dc;line-height:1.5}.steps .n{font-size:16px;color:var(--ink);width:36px;height:36px}
.n{width:36px;height:36px;border-radius:10px;background:var(--yellow);color:var(--ink);display:flex;align-items:center;justify-content:center;font-family:var(--display);font-weight:800;font-size:16px}
.what{display:grid;grid-template-columns:minmax(0,1fr) 440px;gap:64px;align-items:start;padding:80px 0}
.cards{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;margin-top:28px}
.card{background:var(--sheet);border-radius:14px;padding:28px;display:flex;flex-direction:column;gap:10px;box-shadow:0 1px 2px rgba(20,23,28,.05)}
.card h3{font-family:var(--display);font-weight:700;font-size:20px;letter-spacing:-.01em}
.card p{font-size:15px;color:var(--ink-2)}
.card.y{background:#fff8cc}
.trio{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;padding-bottom:80px}
.faq{display:grid;grid-template-columns:380px minmax(0,1fr);gap:64px;padding-bottom:96px}
.q{display:flex;flex-direction:column;gap:6px;padding:18px 0;border-top:1px solid var(--rule)}
.q:last-child{border-bottom:1px solid var(--rule)}
.q b{font-size:17px}.q span{font-size:15px;color:var(--ink-2)}
.close{background:var(--ink);color:#fff;padding:72px 0}
.close .wrap{display:flex;align-items:center;gap:40px;flex-wrap:wrap}
.close .p{color:#b8bec6}
.foot{display:flex;align-items:center;gap:24px;padding:28px 0 40px;font-size:13px;color:var(--ink-3);flex-wrap:wrap}
.foot .sp{flex:1}.foot a{color:var(--ink-3)}

/* mini receipt used on the landing page */
.mini{background:var(--sheet);border-radius:6px;padding:30px 32px;box-shadow:0 30px 60px -30px rgba(20,23,28,.35);display:flex;flex-direction:column;gap:14px;transform:rotate(1.5deg)}
.mini .hd{display:flex;justify-content:space-between;align-items:flex-start;padding-bottom:12px;border-bottom:2px solid var(--ink)}
.lbl{font-size:11px;font-weight:600;letter-spacing:.04em;color:var(--ink-3);text-transform:uppercase}
.mini .v{font-size:12.5px;padding:3px 0 4px;border-bottom:1px solid var(--rule)}
.f{display:flex;flex-direction:column;gap:4px;min-width:0}

/* ---------- the maker ---------- */
.app{min-height:100vh;display:flex;flex-direction:column}
.topbar{height:64px;display:flex;align-items:center;gap:12px;padding:0 20px;border-bottom:1px solid var(--rule)}
.topbar .brand b{font-size:19px}
.topbar .status{margin-left:auto;font-size:13px;color:var(--ink-3)}
.prog{display:flex;gap:5px;padding:10px 20px 0}
.prog span{flex:1;height:4px;border-radius:2px;background:var(--rule-2)}
.prog span.on{background:var(--blue)}
.body{flex:1;display:grid;grid-template-columns:240px minmax(0,1fr) 420px;gap:40px;padding:28px 40px 120px;align-items:start}
.stepnav{display:flex;flex-direction:column;gap:6px;position:sticky;top:20px}
.stepnav button{display:flex;align-items:center;gap:12px;padding:12px 14px;border-radius:10px;border:0;background:transparent;font-size:15px;color:var(--ink-2);cursor:pointer;text-align:left}
.stepnav button i{width:26px;height:26px;border-radius:8px;display:inline-flex;align-items:center;justify-content:center;font-family:var(--display);font-weight:800;font-size:13px;font-style:normal;flex:none;background:var(--rule);color:var(--ink-2)}
.stepnav button.done i{background:var(--blue);color:var(--yellow)}
.stepnav button.cur{background:var(--sheet);color:var(--ink);font-weight:600;box-shadow:0 1px 2px rgba(20,23,28,.06)}
.stepnav button.cur i{background:var(--ink);color:var(--yellow)}
.stepnav button small{margin-left:auto;font-size:12px;color:var(--ink-3)}
.tip{margin-top:20px;padding:16px;border-radius:12px;background:#fff8cc;font-size:13px;line-height:1.5;color:var(--ink-2)}
.tip b{color:var(--ink)}
.pane{max-width:640px;display:flex;flex-direction:column;gap:22px}
.pane[hidden]{display:none}
.pane h2{font-family:var(--display);font-weight:800;font-size:clamp(28px,4vw,34px);letter-spacing:-.03em;line-height:1.02}
.pane .sub{font-size:15px;color:var(--ink-2)}
.grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px 14px}
.grid .full{grid-column:1/-1}
.f label{font-size:11px;font-weight:600;letter-spacing:.03em;color:var(--ink-3);text-transform:uppercase}
.f input,.f select,.f textarea{width:100%;min-width:0;height:48px;border-radius:10px;border:1.5px solid var(--rule-2);background:var(--sheet);padding:0 14px;font-size:17px;transition:border-color .15s,box-shadow .15s}
.f textarea{height:auto;min-height:72px;padding:12px 14px;resize:vertical}
.f select{appearance:none;padding-right:38px;background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%2314171c' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><path d='m6 9 6 6 6-6'/></svg>");background-repeat:no-repeat;background-position:right 12px center}
.f input:hover,.f select:hover,.f textarea:hover{border-color:#b9b3a6}
.f input:focus,.f select:focus,.f textarea:focus{outline:none;border-color:var(--blue);box-shadow:0 0 0 3px rgba(18,53,122,.15)}
.f input::placeholder,.f textarea::placeholder{color:#7a828d}
.f.bad input,.f.bad select{border-color:var(--warn);box-shadow:0 0 0 3px rgba(179,38,30,.12)}
.f .err{display:none;font-size:13px;color:var(--warn)}.f.bad .err{display:block}
.money{position:relative}.money::before{content:"£";position:absolute;left:14px;top:50%;transform:translateY(-50%);color:var(--ink-3);pointer-events:none}
.money input{padding-left:30px}
.big input{height:60px;font-size:26px;font-weight:700}
.plate{height:64px;border-radius:10px;background:var(--yellow);border:2px solid var(--ink);display:flex;align-items:stretch;overflow:hidden}
.plate .gb{width:38px;flex:none;background:var(--blue);color:#fff;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;font-size:10px;font-weight:700}
.plate .gb svg{width:16px;height:10px;display:block}
.plate input{flex:1;min-width:0;border:0;background:transparent;text-align:center;font-weight:700;font-size:34px;letter-spacing:.04em;font-stretch:87%;text-transform:uppercase;padding:0 8px;height:auto;border-radius:0}
.plate input::placeholder{color:#6b5800}.plate input:focus{outline:none;background:rgba(255,255,255,.3);box-shadow:none}
.f.bad .plate{border-color:var(--warn)}
.seg{display:flex;gap:8px;flex-wrap:wrap}
.seg label{flex:1;min-width:100px;height:46px;border-radius:10px;border:1.5px solid var(--rule-2);background:var(--sheet);display:flex;align-items:center;justify-content:center;font-size:15px;font-weight:500;cursor:pointer;position:relative}
.seg label:hover{border-color:var(--ink)}
.seg input{position:absolute;opacity:0;width:1px;height:1px}
.seg label.on{background:var(--blue);border-color:var(--blue);color:#fff;font-weight:700}
.seg input:focus-visible+span{outline:3px solid var(--blue);outline-offset:3px;border-radius:6px}
.tickrow{display:flex;align-items:center;gap:12px;min-height:48px;padding:0 14px;border-radius:10px;background:var(--sheet);border:1.5px solid var(--rule-2);font-size:16px;cursor:pointer}
.tickrow.on{border-color:var(--blue)}
.tickrow input[type=checkbox]{position:absolute;opacity:0;width:1px;height:1px}
.tickrow .bx{width:24px;height:24px;border-radius:7px;border:1.5px solid #c9c4b8;display:inline-flex;align-items:center;justify-content:center;flex:none}
.tickrow.on .bx{background:var(--blue);border-color:var(--blue)}
.tickrow .bx svg{width:14px;height:14px;stroke:var(--yellow);stroke-width:3;fill:none;stroke-linecap:round;display:none}
.tickrow.on .bx svg{display:block}
.tickrow .sp{flex:1}.tickrow small{font-size:13px;color:var(--ink-3)}
.tickrow input[type=number]{width:64px;height:36px;border-radius:8px;border:1.5px solid var(--rule-2);text-align:center;font-size:16px;font-weight:600;padding:0}
.sum{background:var(--ink);color:#fff;border-radius:12px;padding:16px 18px;display:flex;flex-direction:column;gap:8px}
.sum .r{display:flex;justify-content:space-between;font-size:14px;color:#b8bec6}
.sum .t{display:flex;justify-content:space-between;align-items:baseline;padding-top:6px;border-top:1px solid #3a3f47}
.sum .t span{font-size:12px;font-weight:700;letter-spacing:.03em;text-transform:uppercase;color:var(--yellow)}
.sum .t b{font-family:var(--display);font-weight:800;font-size:30px;letter-spacing:-.03em}
.sum .n{font-size:13px;color:#b8bec6;width:auto;height:auto;background:none;display:block}
.words{background:var(--sheet);border-radius:12px;padding:14px 16px;font-size:14px;color:var(--ink-2);line-height:1.55}
.words b{color:var(--ink)}
.padwrap{display:flex;flex-direction:column;gap:6px}
.padhd{display:flex;justify-content:space-between;align-items:baseline}
.padhd button{background:none;border:0;font-size:13px;color:var(--blue);font-weight:600;cursor:pointer;padding:0}
.pad{height:150px;border-radius:12px;background:var(--sheet);border:1.5px dashed #c9c4b8;position:relative;touch-action:none}
.pad.done{border:1.5px solid var(--blue)}
.pad canvas{width:100%;height:100%;display:block;border-radius:12px}
.pad .ph{position:absolute;inset:auto 0 22px;text-align:center;font-size:14px;color:var(--ink-3);pointer-events:none}
.pad.done .ph{display:none}
.pad .when{position:absolute;right:12px;bottom:8px;font-size:12px;color:var(--ink-3);pointer-events:none}
.actions{display:flex;gap:10px;padding-top:6px}
.actions .btn{flex:1}.actions .btn.g{flex:0 0 auto}
.info{display:flex;align-items:center;gap:10px;font-size:14px;color:var(--ink-2)}
.info i{width:24px;height:24px;border-radius:7px;background:var(--blue);display:inline-flex;align-items:center;justify-content:center;flex:none}
.info i svg{width:14px;height:14px;stroke:var(--yellow);stroke-width:3;fill:none;stroke-linecap:round}

/* preview column */
.prev{position:sticky;top:20px;display:flex;flex-direction:column;gap:10px}
.prev .hd{display:flex;justify-content:space-between;font-size:12px;color:var(--ink-3)}
.prev .scaler{position:relative;overflow:hidden}
.prev .receipt{width:794px;min-height:1123px;padding:48px 56px 40px;transform-origin:top left;position:absolute;left:0;top:0}

/* done screen */
.done{background:var(--blue);color:#fff;min-height:100vh;display:flex;flex-direction:column}
.done .in{width:min(100% - 40px,560px);margin:0 auto;padding:40px 0 60px;display:flex;flex-direction:column;gap:24px;flex:1}
.done .badge{width:52px;height:52px;border-radius:16px;background:var(--yellow);display:flex;align-items:center;justify-content:center}
.done .badge svg{width:28px;height:28px;stroke:var(--ink);stroke-width:3;fill:none;stroke-linecap:round;stroke-linejoin:round}
.done h1{font-size:34px;line-height:1.02}.done .p{color:#b7c3dc;font-size:15px}
.rows{display:flex;flex-direction:column;gap:8px}
.row{display:flex;align-items:center;gap:14px;min-height:60px;padding:10px 16px;border-radius:12px;background:var(--sheet);font-size:16px;font-weight:600;color:var(--ink);border:0;text-align:left;cursor:pointer;width:100%}
.row:hover{background:#f3f1ec}
.row .ic{width:36px;height:36px;border-radius:10px;background:var(--ground);display:inline-flex;align-items:center;justify-content:center;flex:none}
.row .ic svg{width:18px;height:18px;stroke:var(--ink);stroke-width:1.75;fill:none;stroke-linecap:round;stroke-linejoin:round}
.row .tx{flex:1;display:flex;flex-direction:column}.row small{font-weight:400;color:var(--ink-3);font-size:13px}
.row .chev{width:18px;height:18px;stroke:var(--ink-3);stroke-width:2;fill:none;stroke-linecap:round;stroke-linejoin:round}
.linkbox{display:flex;gap:8px}.linkbox input{flex:1;height:46px;border-radius:10px;border:0;padding:0 12px;font-size:14px;background:#fff;color:var(--ink)}
.todo{display:flex;flex-direction:column;gap:12px}
.todo .k{font-size:12px;font-weight:700;letter-spacing:.03em;text-transform:uppercase;color:var(--yellow)}
.todo label{display:flex;gap:12px;align-items:flex-start;font-size:14px;color:#b7c3dc;line-height:1.45;cursor:pointer}
.todo label b{color:#fff}
.todo input{width:22px;height:22px;margin:1px 0 0;accent-color:var(--yellow);flex:none}
.done .fine{font-size:13px;color:#b7c3dc;text-align:center;display:flex;flex-direction:column;gap:6px}
.done .fine a{color:var(--yellow)}

/* toast */
.toast{position:fixed;left:50%;bottom:22px;transform:translate(-50%,12px);opacity:0;background:var(--ink);color:#fff;padding:10px 14px;border-radius:8px;font-size:14px;pointer-events:none;transition:opacity .2s,transform .2s;z-index:30;max-width:92vw}
.toast.show{opacity:1;transform:translate(-50%,0)}

/* ---------- the receipt (screen preview + print) ---------- */
.receipt{background:#fff;color:#14171c;border-radius:6px;padding:28px 30px;box-shadow:0 20px 50px -30px rgba(20,23,28,.4);display:flex;flex-direction:column;gap:16px;font-size:13px}
.receipt .rh{display:flex;justify-content:space-between;align-items:flex-start;gap:16px;padding-bottom:12px;border-bottom:2px solid var(--ink)}
.receipt .rh h3{font-family:var(--display);font-weight:800;font-size:24px;letter-spacing:-.03em;line-height:1}
.receipt .rh .sub{font-size:11.5px;color:var(--ink-2);margin-top:3px}
.receipt .rh .meta{font-size:11px;color:var(--ink-2);text-align:right;display:flex;flex-direction:column;gap:2px;white-space:nowrap}
.receipt .rh .meta b{color:var(--ink)}
.receipt .sec{display:flex;flex-direction:column;gap:8px}
.receipt .sh{display:flex;align-items:baseline;gap:10px;padding-bottom:3px;border-bottom:1px solid var(--ink)}
.receipt .sh .num{font-family:var(--display);font-weight:800;font-size:11px;color:var(--ink-3)}
.receipt .sh b{font-family:var(--display);font-weight:700;font-size:13.5px}
.receipt .two{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
.receipt .g{display:grid;gap:6px 16px}
.receipt .lbl{font-size:9.5px}
.receipt .v{font-size:12.5px;padding:2px 0 3px;border-bottom:1px solid var(--rule);min-height:20px;overflow-wrap:anywhere}
.receipt .v.e{color:#b9b3a6}
.receipt .rplate{height:40px;border-radius:6px;background:var(--yellow);border:1.5px solid var(--ink);display:flex;align-items:stretch;overflow:hidden;width:180px;-webkit-print-color-adjust:exact;print-color-adjust:exact}
.receipt .rplate .gb{width:24px;background:var(--blue);color:#fff;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;font-size:7.5px;font-weight:700}
.receipt .rplate .gb svg{width:11px;height:7px}
.receipt .rplate span{flex:1;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:21px;letter-spacing:.04em;font-stretch:87%;white-space:nowrap}
.receipt .hand{display:flex;gap:18px;flex-wrap:wrap;font-size:12px;color:var(--ink-2)}
.receipt .hand span{display:flex;align-items:center;gap:6px}
.receipt .hand svg{width:13px;height:13px;stroke:var(--blue);stroke-width:3;fill:none;stroke-linecap:round}
.receipt .hand .no svg{stroke:#c9c4b8;stroke-width:2.5}
.receipt .agree{font-size:11.5px;color:var(--ink-2);line-height:1.5;display:flex;flex-direction:column;gap:6px}
.receipt .agree b{color:var(--ink)}
.receipt .pay{display:grid;grid-template-columns:minmax(0,1fr) 250px;gap:20px;align-items:start}
.receipt .tot{border:1.5px solid var(--ink);border-radius:8px;padding:12px 14px;display:flex;flex-direction:column}
.receipt .tr{display:flex;justify-content:space-between;gap:10px;padding:5px 0;border-bottom:1px solid var(--rule);font-size:12.5px}
.receipt .tr.last{border-bottom:1px solid var(--ink)}
.receipt .tr[hidden]{display:none}
.receipt .total{display:flex;flex-direction:column;gap:2px;padding-top:10px}
.receipt .total b{font-family:var(--display);font-weight:800;font-size:26px;letter-spacing:-.03em;line-height:1}
.receipt .total small{font-size:11px;color:var(--ink-2)}
.receipt .sigs{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:28px;margin-top:auto}
.receipt .sig{display:flex;flex-direction:column;gap:4px}
.receipt .sig .img{height:60px;display:flex;align-items:flex-end}
.receipt .sig img{max-height:60px;max-width:100%;display:none}
.receipt .sig img[src]{display:block}
.receipt .sig .line{border-top:1px solid var(--ink);padding-top:5px;display:flex;justify-content:space-between;font-size:10.5px;color:var(--ink-2);gap:8px}
.receipt .rf{display:flex;justify-content:space-between;gap:12px;font-size:9.5px;color:var(--ink-3);padding-top:10px;border-top:1px solid var(--rule);flex-wrap:wrap}

/* print: two A4 copies */
.printarea{display:none}
@page{size:A4;margin:14mm 16mm}
@media print{
  body{background:#fff}
  .app>*:not(.printarea),.done>*:not(.printarea),.toast{display:none!important}
  .printarea{display:block}
  .printarea .receipt{box-shadow:none;border-radius:0;padding:0;min-height:calc(297mm - 28mm);break-after:page;font-size:12.5px}
  .printarea .receipt:last-child{break-after:auto}
}

/* phone */
@media (max-width:900px){
  .nav{height:64px;gap:14px}.nav .links{display:none}
  .hero{grid-template-columns:1fr;gap:36px;padding:28px 0 56px}
  .phone{width:min(100%,320px);height:600px}
  .steps{grid-template-columns:1fr}.what{grid-template-columns:1fr;padding:56px 0}.cards{grid-template-columns:1fr}
  .trio{grid-template-columns:1fr}.faq{grid-template-columns:1fr;gap:24px;padding-bottom:64px}
  .mini{transform:none}.band,.close{padding:48px 0}
  .body{grid-template-columns:1fr;gap:0;padding:20px 20px 110px}
  .stepnav{display:none}.prev{display:none}
  .pane{max-width:none}
  .actions{position:fixed;left:0;right:0;bottom:0;z-index:10;padding:12px 16px calc(12px + env(safe-area-inset-bottom));background:var(--ground);border-top:1px solid var(--rule);margin:0}
  .grid{gap:14px 12px}
}
@media (max-width:480px){.grid{grid-template-columns:1fr}.grid .half{grid-column:auto}.grid.two{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (prefers-reduced-motion:reduce){*{transition:none!important}html{scroll-behavior:auto}}
