/* Multivant storefront
   Clean and flat: white pages, one plum accent, one type family. No gradients, no glows. */

@font-face{font-family:"Public Sans";src:url("../fonts/PublicSans-var.82f88cc85093.woff2") format("woff2");font-weight:400 800;font-style:normal;font-display:swap}

:root{
  --paper:#FFFFFF;
  --soft:#F7F4F9;
  --panel:#FFFFFF;
  --ink:#1D1633;
  --ink-2:#352B52;
  --steel:#5E5873;
  --line:#DED9E7;
  --line-2:#C8C0D6;
  --brand:#9A1F73;
  --brand-d:#7B185B;
  --brand-tint:#F8EAF3;
  --card-tint:#FBF5F9;
  --teal:#0F7B6C;
  --blue:#3454D1;
  --signal:#B3261E;
  --r:10px;
  --wrap:1200px;
  --gutter:clamp(1rem,4vw,2rem);
  --sp:clamp(3rem,7vw,5.5rem);
  --head:"Public Sans","Segoe UI",system-ui,-apple-system,Roboto,Helvetica,Arial,sans-serif;
  --body:"Public Sans","Segoe UI",system-ui,-apple-system,Roboto,Helvetica,Arial,sans-serif;
}
*,*::before,*::after{box-sizing:border-box}
[hidden]{display:none!important}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:96px}
body{margin:0;background:var(--paper);color:var(--ink);font:400 1rem/1.6 var(--body);min-height:100vh;display:flex;flex-direction:column;-webkit-font-smoothing:antialiased;overflow-x:clip}
main{flex:1}
img,svg{max-width:100%}
a{color:var(--ink);text-underline-offset:3px}
a:hover{color:var(--brand)}
:focus-visible{outline:3px solid var(--blue);outline-offset:2px}
.on-ink :focus-visible,.site-foot :focus-visible,.util :focus-visible,.section--brand :focus-visible{outline-color:#fff}
h1,h2,h3,h4{font-family:var(--head);font-weight:700;line-height:1.15;margin:0;letter-spacing:-.01em;text-wrap:balance}
h1{font-weight:800;letter-spacing:-.02em}
h2{font-size:clamp(1.6rem,3vw,2.25rem)}
h3{font-size:1.2rem}
p{margin:0 0 1em}
.wrap{width:100%;max-width:var(--wrap);margin:0 auto;padding-inline:var(--gutter)}
.section{padding-block:var(--sp)}
.section--tight{padding-block:calc(var(--sp)*.6)}
.section--ink{background:var(--ink);color:#fff}
.section--white{background:var(--soft)}
.section--brand{background:var(--brand);color:#fff}
.measure{max-width:64ch}
.muted{color:var(--steel)}
.small{font-size:.9rem}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.skip{position:absolute;left:1rem;top:-4rem;background:var(--ink);color:#fff;padding:.6rem 1rem;font-weight:600;z-index:100;border-radius:var(--r)}
.skip:focus{top:1rem}
.ic{width:1.2em;height:1.2em;fill:currentColor;flex:none;vertical-align:-.2em}
.ic--lg{width:1.6em;height:1.6em}

/* ---- buttons ---- */
.btn{white-space:nowrap;display:inline-flex;align-items:center;justify-content:center;gap:.5rem;font:600 1rem/1.1 var(--body);padding:.8rem 1.25rem;min-height:2.9rem;border:1.5px solid var(--ink);background:var(--panel);color:var(--ink);text-decoration:none;cursor:pointer;border-radius:var(--r);transition:background-color .15s,color .15s,border-color .15s}
.btn:hover{background:var(--ink);color:#fff}
.btn--hivis{background:var(--brand);border-color:var(--brand);color:#fff}
.btn--hivis:hover{background:var(--brand-d);border-color:var(--brand-d);color:#fff}
.btn--ink{background:var(--ink);color:#fff}
.btn--ink:hover{background:var(--brand);border-color:var(--brand);color:#fff}
.btn--ghost{background:transparent}
.btn--wide{width:100%}
.btn--sm{min-height:2.4rem;padding:.5rem .9rem;font-size:.92rem}
.btn[disabled],.btn[aria-disabled=true]{opacity:.5;cursor:not-allowed}
.btn--on-ink{border-color:#fff;color:#fff;background:transparent}
.btn--on-ink:hover{background:#fff;color:var(--ink)}
.link-btn{background:none;border:0;padding:0;font:inherit;color:var(--ink);text-decoration:underline;cursor:pointer}

/* ---- header ---- */
.util{background:var(--ink);color:#D8D2E6;font-size:.875rem}
.util .wrap{display:flex;justify-content:space-between;gap:1rem;padding-block:.45rem;flex-wrap:wrap}
.util ul{list-style:none;margin:0;padding:0;display:flex;gap:1.4rem;flex-wrap:wrap}
.util li{display:flex;align-items:center;gap:.4rem}
.util a{color:#fff;text-decoration:none}
.util a:hover{text-decoration:underline}
.util .ic{color:#E7B7D6}
.test-banner{background:#FFF3C2;color:var(--ink);text-align:center;padding:.5rem var(--gutter);font-size:.9rem;font-weight:600}
.site-head{background:var(--panel);border-bottom:1px solid var(--line);position:sticky;top:0;z-index:50}
.nav{display:flex;align-items:center;gap:1.5rem;min-height:4.25rem}
.brand{display:flex;align-items:center;gap:.65rem;text-decoration:none;color:var(--ink)}
.brand:hover{color:var(--ink)}
.brand svg{width:2.25rem;height:2.25rem;flex:none}
.brand-name{display:block;line-height:1;white-space:nowrap}
.brand-name b{font:800 1.3rem/1 var(--head);letter-spacing:-.01em}
.mark .mk-bg{fill:var(--brand)}
.mark .mk-fg{fill:#fff}
.nav-links{display:flex;gap:.15rem;margin-left:auto;align-items:center}
.nav-links a:not(.btn){padding:.6rem .85rem;text-decoration:none;font-weight:600;font-size:.97rem;color:var(--ink-2);border-radius:var(--r)}
.nav-links a:not(.btn):hover{color:var(--brand);background:var(--brand-tint)}
.nav-links a[aria-current=page]:not(.btn){color:var(--brand)}
.cart-link{position:relative;margin-left:.5rem}
.cart-count{background:#fff;color:var(--brand);min-width:1.45rem;height:1.45rem;display:inline-grid;place-items:center;font-size:.78rem;font-weight:700;border-radius:99px;padding-inline:.25rem}
.cart-count[data-n="0"]{background:rgba(255,255,255,.25);color:#fff}
.menu-btn{display:none;margin-left:auto}
.nav-links a{white-space:nowrap}
@media(max-width:960px){
  .menu-btn{display:inline-flex}
  .nav-links{position:absolute;left:0;right:0;top:100%;background:var(--panel);border-bottom:1px solid var(--line);flex-direction:column;align-items:stretch;padding:.5rem var(--gutter) 1.25rem;margin:0;display:none}
  .nav-links[data-open=true]{display:flex}
  .nav-links a:not(.btn){padding:.9rem .25rem;border-bottom:1px solid var(--line);border-radius:0}
  .cart-link{margin:.75rem 0 0}
}
@media(max-width:760px){.util ul:last-child{display:none}}
@media(max-width:560px){.util ul:first-child li:nth-child(3){display:none}}
@media(max-width:420px){.menu-btn span{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}.menu-btn{padding-inline:.7rem}.nav{gap:.75rem}}

/* ---- hero ---- */
.hero{background:var(--paper);padding-top:clamp(2rem,5vw,3.75rem)}
.hero h1{font-size:clamp(2.1rem,4.9vw,3.7rem);line-height:1.08;max-width:22ch}
.hero-row{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);gap:clamp(1.5rem,4vw,3.5rem);align-items:start;margin-top:clamp(1.25rem,2.5vw,2rem)}
.lede{font-size:clamp(1.05rem,1.5vw,1.2rem);line-height:1.55;max-width:52ch;color:var(--ink-2)}
.hero .lede{margin-bottom:0}
.cta-row{display:flex;gap:.8rem;flex-wrap:wrap;margin-top:1.5rem}
.facts{list-style:none;margin:0;padding:0;display:grid;gap:0;border-top:1px solid var(--line)}
.facts li{display:flex;gap:.8rem;align-items:flex-start;padding:.85rem 0;border-bottom:1px solid var(--line)}
.facts .ic{margin-top:.2rem;color:var(--brand)}
.facts b{display:block;line-height:1.3}
.facts span{font-size:.92rem;color:var(--steel);line-height:1.45;display:block}
@media(max-width:860px){.hero-row{grid-template-columns:1fr}}

/* ---- the work board: example tasks move from requested to in progress to delivered ---- */
.board-band{background:var(--ink);color:#fff;padding-block:clamp(2.25rem,5vw,3.5rem);margin-top:clamp(2rem,4vw,3rem)}
.board-head{display:flex;justify-content:space-between;align-items:flex-end;gap:1.5rem;flex-wrap:wrap;margin-bottom:1.5rem}
.board-head h2{color:#fff}
.board-head p{margin:.5rem 0 0;color:#CFC8E0;max-width:56ch}
.board{--card-h:88px;--card-gap:10px;position:relative;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1rem;min-height:300px}
.lane{background:#271F42;border-radius:16px;padding:.8rem .75rem}
.lane h3{display:flex;justify-content:space-between;align-items:center;font-size:.95rem;color:#fff;margin:0 .25rem}
.lane-count{background:#3C3160;border-radius:99px;min-width:1.7rem;text-align:center;padding:.05rem .5rem;font-size:.8rem;font-weight:700;color:#E7B7D6}
.work{position:absolute;left:0;top:0;height:var(--card-h);display:flex;align-items:center;gap:.75rem;padding:.6rem .8rem;background:#fff;color:var(--ink);border-radius:12px;opacity:0;transition:transform .8s cubic-bezier(.2,.7,.2,1),opacity .5s;will-change:transform;overflow:hidden}
.work.is-in{opacity:1}
.work-ic{width:2.5rem;height:2.5rem;border-radius:10px;background:var(--brand-tint);color:var(--brand);display:grid;place-items:center;flex:none}
.work-ic .ic{width:1.35rem;height:1.35rem}
.work-body{min-width:0;display:grid;gap:.1rem;flex:1}
.work-body b{font-size:.92rem;line-height:1.25;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.work-body small{font-size:.8rem;line-height:1.3;color:var(--steel);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.work-bar{display:block;height:5px;border-radius:99px;background:#E9E1F0;margin-top:.35rem;opacity:0;transition:opacity .3s}
.work-bar u{display:block;height:100%;width:0;background:var(--brand);border-radius:99px;transition:width 4.2s linear;text-decoration:none}
.work.is-doing .work-bar{opacity:1}
.work.is-doing .work-bar u{width:100%}
.work-done{width:1.6rem;height:1.6rem;border-radius:50%;background:var(--teal);color:#fff;display:grid;place-items:center;flex:none;opacity:0;transform:scale(.4);transition:opacity .3s .35s,transform .4s .35s cubic-bezier(.3,1.5,.5,1)}
.work-done .ic{width:1rem;height:1rem}
.work.is-done .work-done{opacity:1;transform:none}
.work.is-done .work-bar{opacity:0}
.board.is-static .work{transition:none}
.board.is-static .work-bar u{transition:none}
@media(max-width:720px){
  .board{--card-h:70px;gap:.5rem;min-height:260px}
  .lane{padding:.6rem .45rem}
  .lane h3{font-size:.82rem;margin:0 .1rem}
  .lane-count{min-width:1.4rem;padding:.02rem .35rem;font-size:.72rem}
  .work{flex-direction:column;align-items:flex-start;justify-content:center;gap:.3rem;padding:.5rem .55rem}
  .work-ic{width:1.9rem;height:1.9rem;border-radius:8px}
  .work-ic .ic{width:1.05rem;height:1.05rem}
  .work-body small{display:none}
  .work-body b{font-size:.78rem}
  .work-done{position:absolute;right:.4rem;top:.4rem;width:1.3rem;height:1.3rem}
}

/* ---- section heads ---- */
.sec-head{display:flex;justify-content:space-between;align-items:flex-end;gap:1.5rem;flex-wrap:wrap;margin-bottom:clamp(1.5rem,3vw,2.25rem)}
.sec-head p{margin:.6rem 0 0;max-width:56ch;color:var(--steel)}
.section--ink .sec-head p{color:#C9C1DC}
.sec-head--center{justify-content:center;text-align:center}
.sec-head--center p{margin-inline:auto}
.section--brand .sec-head p{color:#F4DDEB}

/* ---- services on the plum band ---- */
.svc-grid{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:1.25rem}
.svc{grid-column:span 4;position:relative;display:flex;flex-direction:column;background:var(--card-tint);color:var(--ink);border-radius:16px;padding:1.5rem 1.5rem 1.35rem;transition:transform .18s}
.svc:nth-child(-n+4){grid-column:span 3;background:#fff}
.svc:hover{transform:translateY(-3px)}
.svc .tile{margin-bottom:1rem}
.svc h3{font-size:1.1rem;margin-bottom:.4rem}
.svc h3 a{text-decoration:none;color:var(--ink)}
.svc h3 a::after{content:"";position:absolute;inset:0;border-radius:16px}
.svc:hover h3 a{color:var(--brand)}
.svc p{color:var(--steel);font-size:.95rem;line-height:1.5;margin:0 0 1.1rem}
.svc-foot{margin-top:auto;display:flex;flex-direction:column;align-items:flex-start;gap:.2rem}
.svc-price{font:800 1.35rem/1 var(--head);color:var(--ink)}
.svc-note{font-size:.85rem;color:var(--steel)}
@media(max-width:1000px){.svc,.svc:nth-child(-n+4){grid-column:span 6}}
@media(max-width:620px){.svc,.svc:nth-child(-n+4){grid-column:span 12}}

/* ---- service cards (catalogue and related) ---- */
.tag{position:relative;background:var(--panel);border:1px solid var(--line);border-radius:14px;transition:border-color .15s,box-shadow .15s;display:flex}
.tag:hover{border-color:var(--line-2);box-shadow:0 8px 22px rgba(29,22,51,.08)}
.tag-in{padding:1.25rem 1.3rem 1.3rem;display:flex;flex-direction:column;width:100%;min-height:100%}
.tag-top{display:flex;align-items:center;justify-content:space-between;gap:.5rem;margin-bottom:1rem}
.tile{width:3rem;height:3rem;display:grid;place-items:center;flex:none;background:var(--brand-tint);color:var(--brand);border-radius:12px}
.tile .ic{width:1.6rem;height:1.6rem}
.tile--lg{width:4.5rem;height:4.5rem;border-radius:16px}
.tile--lg .ic{width:2.4rem;height:2.4rem}
.chip{display:inline-block;font-size:.8rem;font-weight:600;padding:.2rem .6rem;background:var(--soft);border:1px solid var(--line);border-radius:99px;color:var(--ink-2);white-space:nowrap}
.tag h3{margin-bottom:.45rem}
.tag h3 a{text-decoration:none}
.tag h3 a::after{content:"";position:absolute;inset:0;border-radius:14px}
.tag p{color:var(--steel);font-size:.97rem;line-height:1.5;margin-bottom:1.1rem}
.tag-foot{margin-top:auto;display:flex;flex-direction:column;align-items:stretch;gap:.8rem;position:relative;z-index:2}
.tag-price{display:flex;flex-direction:column;align-items:flex-start;gap:.2rem}
.tag-note{color:var(--steel);font-size:.85rem}
.price{font:800 1.75rem/1 var(--head);letter-spacing:-.01em;display:inline-flex;align-items:baseline;gap:.35rem;flex-wrap:wrap}
.price small{font:600 .8rem/1 var(--body);color:var(--steel);letter-spacing:0}
.price--lg{font-size:2.6rem}
.tag-form{margin:0}
.tag-form .btn,.tag-foot>.btn{width:100%}
.grid{display:grid;gap:clamp(1rem,2vw,1.5rem);grid-template-columns:repeat(auto-fill,minmax(min(100%,290px),1fr))}

/* ---- carousel ---- */
.carousel{position:relative}
.rail{display:grid;grid-auto-flow:column;grid-auto-columns:min(82vw,340px);gap:1.25rem;overflow-x:auto;scroll-snap-type:x mandatory;scroll-padding-inline:var(--gutter);scrollbar-width:none;padding:.5rem var(--gutter) 1rem;margin-inline:calc(var(--gutter)*-1);cursor:grab;overscroll-behavior-x:contain}
.rail::-webkit-scrollbar{display:none}
.rail>*{scroll-snap-align:start}
.rail.is-drag{cursor:grabbing;scroll-snap-type:none}
.rail.is-drag a{pointer-events:none}
.rail-ctl{display:flex;gap:.5rem;align-items:center}
.rail-btn{width:2.75rem;height:2.75rem;border:1.5px solid var(--ink);background:var(--panel);display:grid;place-items:center;cursor:pointer;border-radius:50%;color:var(--ink)}
.rail-btn:hover:not([disabled]){background:var(--ink);color:#fff}
.rail-btn[disabled]{opacity:.35;cursor:default}
.rail-progress{height:4px;background:var(--line);margin-top:.25rem;border-radius:99px;overflow:hidden}
.rail-progress i{display:block;height:100%;background:var(--brand);width:20%}

/* ---- catalogue filters ---- */
.filters{display:grid;grid-template-columns:1fr;gap:1.25rem 2rem;align-items:end;margin-bottom:1.75rem;padding:1.1rem 1.25rem;background:var(--soft);border:1px solid var(--line);border-radius:14px}
.filters-main{display:grid;gap:1rem}
.search-field{margin:0}
.field input[type=search]{width:100%;font:inherit;padding:.75rem .9rem;border:1.5px solid var(--line-2);background:#fff;border-radius:var(--r);min-height:3rem;color:var(--ink)}
.field input[type=search]:focus{border-color:var(--ink);outline:none;box-shadow:0 0 0 3px rgba(154,31,115,.25)}
.chips{display:flex;gap:.5rem;flex-wrap:wrap}
.chips button{font:600 .95rem/1 var(--body);padding:.65rem 1rem;border:1.5px solid var(--line-2);background:var(--panel);color:var(--ink);cursor:pointer;border-radius:99px;min-height:2.5rem}
.chips button[aria-pressed=true]{background:var(--ink);border-color:var(--ink);color:#fff}
.chips button:hover:not([aria-pressed=true]){border-color:var(--ink)}
.budget{max-width:440px}
.budget label{display:flex;justify-content:space-between;font-weight:600;margin-bottom:.35rem}
.budget output{font:800 1.25rem/1 var(--head)}
input[type=range]{-webkit-appearance:none;appearance:none;width:100%;height:2rem;background:transparent;cursor:pointer;margin:0;accent-color:var(--brand)}
input[type=range]::-webkit-slider-runnable-track{height:6px;background:var(--line-2);border-radius:99px}
input[type=range]::-moz-range-track{height:6px;background:var(--line-2);border-radius:99px}
input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;width:22px;height:22px;margin-top:-8px;background:var(--brand);border:3px solid #fff;border-radius:50%;box-shadow:0 0 0 1px var(--brand)}
input[type=range]::-moz-range-thumb{width:18px;height:18px;background:var(--brand);border:3px solid #fff;border-radius:50%}
.count{margin:0 0 1rem;color:var(--steel)}
.empty{padding:2.5rem 1rem;text-align:center;border:1.5px dashed var(--line-2);background:var(--soft);border-radius:14px}
.tag[hidden]{display:none}
@media(max-width:820px){.filters{grid-template-columns:1fr}}

/* ---- steps ---- */
.steps{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1.25rem;list-style:none;margin:0;padding:0}
.steps li{padding:1.5rem;background:var(--panel);border:1px solid var(--line);border-radius:14px;position:relative}
.steps .no{display:grid;place-items:center;width:2.25rem;height:2.25rem;border-radius:50%;background:var(--brand);color:#fff;font:800 1rem/1 var(--head);margin-bottom:.9rem}
.steps h3{margin-bottom:.5rem}
.steps p{color:var(--steel);margin:0}
@media(max-width:760px){.steps{grid-template-columns:1fr}}

/* ---- commitments ---- */
.pledge{display:grid;gap:clamp(1.25rem,3vw,2.25rem);grid-template-columns:repeat(auto-fit,minmax(min(100%,250px),1fr))}
.pledge div{border-top:3px solid var(--brand);padding-top:1rem}
.pledge .ic{width:1.9rem;height:1.9rem;color:#E7B7D6;margin-bottom:.6rem}
.pledge h3{margin-bottom:.4rem;font-size:1.2rem}
.pledge p{margin:0;color:#D8D2E6;font-size:.97rem}

/* ---- FAQ ---- */
.faq-wrap{display:grid;grid-template-columns:minmax(0,820px) minmax(240px,1fr);gap:clamp(1.5rem,5vw,4rem);align-items:start}
@media(max-width:900px){.faq-wrap{grid-template-columns:1fr}}
.faq-aside{border:1px solid var(--line);background:var(--soft);padding:1.4rem;border-radius:14px}
.faq-aside h3{margin-bottom:.5rem}
.faq-aside p{margin:0 0 .75rem;color:var(--steel)}
.faq-aside a{font-weight:600;color:var(--brand)}
.faq details{border-top:1px solid var(--line)}
.faq details:last-child{border-bottom:1px solid var(--line)}
.faq summary{list-style:none;cursor:pointer;padding:1.1rem 3rem 1.1rem 0;font:700 1.1rem/1.35 var(--head);position:relative}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";position:absolute;right:.25rem;top:.85rem;font:600 1.6rem/1 var(--head);color:var(--brand)}
.faq details[open] summary::after{content:"\2212"}
.faq details p{padding:0 3rem 1.25rem 0;margin:0;color:var(--ink-2);max-width:64ch}

/* ---- service page ---- */
.crumbs{font-size:.92rem;color:var(--steel);margin-bottom:1.25rem}
.crumbs a{color:var(--steel)}
.p-head{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);gap:clamp(1.5rem,4vw,3.5rem);align-items:start}
.p-head h1{font-size:clamp(2rem,4.6vw,3.2rem);line-height:1.1;margin:1rem 0 .8rem}
.p-meta{display:flex;gap:.5rem;flex-wrap:wrap;margin:1.1rem 0 0}
.buybox{background:var(--panel);border:1px solid var(--line-2);border-top:6px solid var(--brand);border-radius:14px;padding:1.5rem;position:relative}
.buybox .price{margin-top:.25rem}
.buybox ul{list-style:none;padding:0;margin:1rem 0;display:grid;gap:.5rem;font-size:.95rem}
.buybox li{display:flex;gap:.55rem;align-items:flex-start}
.buybox li .ic{color:var(--teal);margin-top:.2rem}
.buybox form{margin:0 0 .6rem}
.flow{display:grid;grid-template-columns:1fr auto 1fr;gap:.75rem;align-items:center;margin-top:1.5rem}
.flow .io{padding:.9rem 1rem;font-size:.95rem;line-height:1.4;color:var(--ink);border-radius:var(--r)}
.flow .io--in{background:var(--soft);border:1.5px dashed var(--line-2)}
.flow .io--out{background:var(--panel);border:1px solid var(--line-2);border-left:6px solid var(--brand)}
.flow small{display:block;font-weight:600;color:var(--steel);font-size:.82rem;margin-bottom:.15rem}
.flow>.ic{width:1.75rem;height:1.75rem;color:var(--brand)}
.p-body{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);gap:clamp(1.5rem,4vw,3.5rem);align-items:start}
.checks{list-style:none;padding:0;margin:0;display:grid;gap:.7rem}
.checks li{display:flex;gap:.7rem;align-items:flex-start}
.checks .ic{color:var(--teal);margin-top:.28rem}
.numbered{counter-reset:s;list-style:none;padding:0;margin:0;display:grid;gap:.9rem}
.numbered li{counter-increment:s;display:grid;grid-template-columns:2.25rem 1fr;gap:.8rem;align-items:start}
.numbered li::before{content:counter(s);font:800 1rem/1 var(--head);background:var(--brand);color:#fff;width:2.25rem;height:2.25rem;display:grid;place-items:center;border-radius:50%}
.spec{width:100%;border-collapse:separate;border-spacing:0;background:var(--panel);border:1px solid var(--line);border-radius:var(--r);overflow:hidden}
.spec th,.spec td{text-align:left;padding:.75rem 1rem;border-bottom:1px solid var(--line);vertical-align:top;font-size:.97rem}
.spec th{width:38%;font-weight:600;color:var(--steel);background:var(--soft)}
.spec tr:last-child th,.spec tr:last-child td{border-bottom:0}
.block+.block{margin-top:clamp(2rem,4vw,3rem)}
.block h2{font-size:clamp(1.4rem,2.4vw,1.8rem);margin-bottom:1rem}
@media(max-width:900px){.p-head,.p-body{grid-template-columns:1fr}}

/* ---- cart / checkout / order ---- */
.page-head{padding-block:clamp(2rem,4vw,3rem) 1rem}
.page-head h1{font-size:clamp(2rem,4.4vw,3rem);line-height:1.1}
.page-head .lede,.page-head p{margin-top:.9rem}
.layout-2{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,1fr);gap:clamp(1.25rem,3vw,2.5rem);align-items:start}
@media(max-width:900px){.layout-2{grid-template-columns:1fr}}
.box{background:var(--panel);border:1px solid var(--line);border-radius:14px;padding:1.4rem}
.box+.box{margin-top:1.25rem}
.box h2{font-size:1.4rem;margin-bottom:1rem}
.line{display:grid;grid-template-columns:auto 1fr auto;gap:1rem;align-items:center;padding:1rem 0;border-bottom:1px solid var(--line)}
.line:first-child{padding-top:0}
.line:last-child{border-bottom:0;padding-bottom:0}
.line h3{font-size:1.1rem;margin:0}
.line p{margin:.1rem 0 0;color:var(--steel);font-size:.92rem;line-height:1.4}
.line .amount{font:800 1.3rem/1 var(--head)}
.sum{display:flex;justify-content:space-between;align-items:baseline;font-size:1.05rem;padding-top:1rem;border-top:1.5px solid var(--ink);margin-top:1rem}
.sum b{font:800 1.9rem/1 var(--head)}
.field{margin-bottom:1.1rem}
.field label{display:block;font-weight:600;margin-bottom:.35rem}
.field input[type=email],.field input[type=text]{width:100%;font:inherit;padding:.75rem .9rem;border:1.5px solid var(--line-2);background:#fff;border-radius:var(--r);min-height:3rem;color:var(--ink)}
.field input:focus{border-color:var(--ink);outline:none;box-shadow:0 0 0 3px rgba(154,31,115,.25)}
.field .hint{font-size:.88rem;color:var(--steel);margin-top:.3rem}
.field .err,.alert{color:var(--signal);font-weight:500;margin-top:.35rem}
.alert{background:#FDECEA;border:1px solid var(--signal);padding:.9rem 1rem;margin-bottom:1.25rem;border-radius:var(--r)}
.agree{display:flex;gap:.7rem;align-items:flex-start;padding:1rem;background:var(--soft);border:1px solid var(--line);border-radius:var(--r);margin-bottom:1.25rem}
.agree input{width:1.25rem;height:1.25rem;margin-top:.2rem;accent-color:var(--brand);flex:none}
.hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.brands{display:flex;gap:.6rem;align-items:center;flex-wrap:wrap;color:var(--ink-2)}
.pay{box-sizing:content-box;width:2.1rem;height:1.15rem;padding:.4rem .6rem;background:#fff;border:1px solid var(--line);border-radius:6px}
.pay-visa{color:#1A1F71}.pay-mastercard{color:#EB001B}.pay-americanexpress{color:#2E77BC}.pay-discover{color:#E55C00}
.assure{list-style:none;margin:1rem 0 0;padding:0;display:grid;gap:.6rem;font-size:.95rem}
.assure li{display:flex;gap:.6rem;align-items:flex-start}
.assure .ic{color:var(--teal);margin-top:.2rem}
.notice{display:flex;gap:.8rem;padding:1rem 1.1rem;border:1px solid var(--brand);background:var(--brand-tint);border-radius:var(--r);margin-bottom:1.5rem}
.notice--sim{background:#FFF3C2;border-color:#E6D200}
.dl{display:grid;grid-template-columns:auto 1fr auto;gap:1rem;align-items:center;padding:1.1rem 0;border-bottom:1px solid var(--line)}
.dl:last-child{border-bottom:0}
.dl h3{font-size:1.15rem;margin:0}
.dl p{margin:.15rem 0 0;font-size:.92rem;color:var(--steel)}
.dl details{margin-top:.5rem;font-size:.95rem}
.dl summary{cursor:pointer;font-weight:600}
.dl ol{margin:.5rem 0 0;padding-left:1.25rem}
@media(max-width:620px){.line,.dl{grid-template-columns:auto 1fr}.line .amount,.dl .btn{grid-column:1/-1}}
.status{display:inline-flex;gap:.5rem;align-items:center;font-weight:600;padding:.3rem .8rem;border:1px solid var(--line-2);background:var(--soft);border-radius:99px;font-size:.92rem}
.status--paid{background:#E3F4F0;border-color:var(--teal);color:#0A4F45}
.status--bad{background:#FDECEA;border-color:var(--signal);color:#7A1710}

/* ---- legal & prose ---- */
.prose{max-width:74ch}
.prose h2{font-size:1.5rem;margin:2.2rem 0 .7rem}
.prose h3{font-size:1.15rem;margin:1.5rem 0 .4rem}
.prose ul{padding-left:1.25rem}
.prose li{margin-bottom:.4rem}
.prose .updated{color:var(--steel);font-size:.95rem}
.toc{background:var(--soft);border:1px solid var(--line);border-radius:var(--r);padding:1rem 1.25rem;margin:1.5rem 0 2rem;max-width:74ch}
.toc ol{margin:.4rem 0 0;padding-left:1.25rem;columns:2;column-gap:2rem}
@media(max-width:620px){.toc ol{columns:1}}
.contact-grid{display:grid;gap:1.25rem;grid-template-columns:repeat(auto-fit,minmax(min(100%,260px),1fr))}
.contact-grid .box{margin:0}
.contact-grid .ic{width:1.6rem;height:1.6rem;margin-bottom:.5rem;color:var(--brand)}

/* ---- footer ---- */
.site-foot{background:var(--ink);color:#D8D2E6;margin-top:auto}
.foot-grid{display:grid;gap:2.5rem;grid-template-columns:1.4fr 1fr 1fr 1.2fr;padding-block:clamp(2.5rem,5vw,3.75rem) 2.5rem}
.site-foot h2{font:700 1rem/1.2 var(--head);color:#fff;margin-bottom:.9rem}
.site-foot ul{list-style:none;margin:0;padding:0;display:grid;gap:.5rem;font-size:.95rem}
.site-foot a{color:#EDE9F5}
.site-foot a:hover{color:#fff}
.site-foot address{font-style:normal;line-height:1.6}
.site-foot .brand{color:#fff;margin-bottom:1rem}
.site-foot .brands{margin-top:.9rem}
.foot-base{border-top:1px solid #3A2F59;padding-block:1.1rem;font-size:.88rem;display:flex;justify-content:space-between;gap:1rem;flex-wrap:wrap}
@media(max-width:900px){.foot-grid{grid-template-columns:1fr 1fr}}
@media(max-width:560px){.foot-grid{grid-template-columns:1fr}}

/* ---- cookie notice & toast ---- */
.cookie{position:fixed;left:var(--gutter);right:var(--gutter);bottom:1rem;max-width:620px;background:var(--panel);border:1px solid var(--line-2);border-radius:14px;padding:1rem 1.1rem;z-index:80;display:none;box-shadow:0 10px 30px rgba(29,22,51,.18)}
.cookie[data-show=true]{display:block}
.cookie p{margin:0 0 .8rem;font-size:.92rem;line-height:1.5}
.cookie .row{display:flex;gap:.6rem;flex-wrap:wrap}
.toast{position:fixed;left:50%;bottom:1.25rem;transform:translateX(-50%);background:var(--ink);color:#fff;padding:.8rem 1.1rem;z-index:90;border-radius:var(--r);display:flex;gap:1rem;align-items:center;max-width:calc(100vw - 2rem)}
.toast a{color:#F2C6E0;font-weight:600}

/* ---- hero entrance: one orchestrated moment on load ---- */
@media(prefers-reduced-motion:no-preference){
  .hero h1,.hero-row{animation:rise .7s cubic-bezier(.2,.7,.2,1) both}
  .hero-row{animation-delay:.12s}
  @keyframes rise{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
}
@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .tag,.svc,.btn{transition:none}
}

/* ---- payment provider choice ---- */
.providers{border:0;margin:0 0 1.25rem;padding:0;display:grid;gap:.6rem}
.providers legend{font-weight:600;margin-bottom:.5rem;padding:0}
.provider{display:block;cursor:pointer}
.provider input{position:absolute;opacity:0;pointer-events:none}
.provider-body{display:flex;gap:.9rem;align-items:center;padding:.9rem 1rem;background:#fff;border:1.5px solid var(--line-2);border-radius:var(--r);transition:border-color .15s,background-color .15s}
.provider:hover .provider-body{border-color:var(--ink)}
.provider input:checked+.provider-body{border-color:var(--brand);background:var(--brand-tint);box-shadow:inset 0 0 0 1px var(--brand)}
.provider input:focus-visible+.provider-body{outline:3px solid var(--blue);outline-offset:2px}
.provider-mark{width:2.6rem;height:2.6rem;display:grid;place-items:center;background:var(--ink);color:#fff;flex:none;border-radius:var(--r)}
.provider-body b{display:block}
.provider-body small{display:block;color:var(--steel);font-size:.88rem;line-height:1.4}
.ic.proc{width:1.5rem;height:1.5rem}
.processors{display:flex;align-items:center;gap:.5rem;margin-top:.9rem;font-weight:600;color:#fff}
.processors .proc{color:#fff;width:1.5rem;height:1.5rem}
.processors span{margin-right:.8rem}

/* ---- home: more services, browse by need ---- */
.svc-more{display:flex;justify-content:center;margin-top:2rem}
.cat-links{list-style:none;margin:0;padding:0;display:grid;gap:.75rem;grid-template-columns:repeat(auto-fill,minmax(min(100%,230px),1fr))}
.cat-links a{display:flex;align-items:center;justify-content:space-between;gap:.75rem;padding:1rem 1.1rem;border:1px solid var(--line);border-radius:12px;text-decoration:none;font-weight:600;color:var(--ink);background:var(--panel);transition:border-color .15s,color .15s}
.cat-links a::after{content:"";width:.6rem;height:.6rem;border-top:2px solid currentColor;border-right:2px solid currentColor;transform:rotate(45deg);flex:none;margin-right:.2rem}
.cat-links a:hover{border-color:var(--brand);color:var(--brand)}
