@font-face{font-family:"Bricolage";src:url("/assets/fonts/bricolage.woff2") format("woff2");font-weight:200 800;font-display:swap}
:root{
  --violet:#6D5BF6;--orchid:#B15CF0;--ink:#1A1633;--muted:#5E5978;--mist:#F4F2FC;--paper:#FFFFFF;--line:#E2DDF4;
  --grad:linear-gradient(135deg,#7C6AF7 0%,#9A5FF2 55%,#B15CF0 100%);
  --display:"Bricolage",ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif;
  --body:ui-sans-serif,system-ui,-apple-system,"SF Pro Text","Segoe UI",Roboto,sans-serif;
  color-scheme:light dark
}
@media (prefers-color-scheme:dark){:root{--ink:#EFECFB;--muted:#ABA5C8;--mist:#110F22;--paper:#1B1832;--line:#2E2A52}}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;overflow-x:clip}
body{overflow-x:clip}
body{margin:0;background:var(--mist);color:var(--ink);font:400 18px/1.6 var(--body);font-variant-numeric:tabular-nums}
img{max-width:100%;height:auto;display:block}
a{color:var(--violet)}
@media (prefers-color-scheme:dark){a{color:#A99CFF}}
a:focus-visible,button:focus-visible,summary:focus-visible{outline:3px solid var(--orchid);outline-offset:3px;border-radius:6px}
.wrap{width:min(1120px,100% - 40px);margin-inline:auto}
.skip{position:absolute;left:-999px}.skip:focus{left:16px;top:16px;background:var(--paper);padding:8px 12px;z-index:9}

/* header */
.top{display:flex;align-items:center;justify-content:space-between;padding:22px 0}
.brand{display:flex;align-items:center;gap:12px;text-decoration:none;color:var(--ink);font:700 22px/1 var(--display);letter-spacing:-.02em}
.brand img{width:40px;height:40px;border-radius:10px}
.top nav{display:flex;gap:22px}
.top nav a{color:var(--muted);text-decoration:none;font-size:16px}
.top nav a:hover,.top nav a[aria-current]{color:var(--ink)}

/* hero */
.hero{display:grid;grid-template-columns:1.1fr .9fr;gap:56px;align-items:center;padding:40px 0 88px}
.hero h1{font:780 clamp(46px,7.2vw,88px)/.96 var(--display);letter-spacing:-.04em;margin:0 0 26px;text-wrap:balance}
.lede{font-size:21px;line-height:1.55;color:var(--muted);max-width:34em;margin:0 0 32px}
.cta{display:flex;flex-wrap:wrap;align-items:center;gap:14px 20px}
.btn{display:inline-flex;align-items:center;gap:10px;background:var(--ink);color:var(--mist);border-radius:14px;padding:15px 22px;font:600 17px/1 var(--body);text-decoration:none}
.btn svg{width:20px;height:20px}
.btn[aria-disabled="true"]{cursor:default}
.cta small{color:var(--muted);font-size:15px}
.stage{position:relative;justify-self:center;width:min(380px,100%)}
.tile img{background:var(--paper);aspect-ratio:720/1488;border-radius:34px;box-shadow:0 30px 60px -30px rgba(109,91,246,.6)}
.px{position:absolute;width:22px;height:22px;border-radius:5px;background:#fff;opacity:0}
.spark{position:absolute;right:-58px;top:-66px;width:64px;height:64px;opacity:0}
.spark path{fill:var(--orchid)}
@media (prefers-color-scheme:dark){.spark path{fill:#C9B8FF}.px{background:#E9E4FF}}
@media (prefers-reduced-motion:no-preference){
  .px{animation:drift 2.4s cubic-bezier(.2,.7,.2,1) .5s forwards}
  .px:nth-of-type(2){animation-delay:.62s}.px:nth-of-type(3){animation-delay:.74s}.px:nth-of-type(4){animation-delay:.86s}
  .spark{animation:pop .9s ease-out 1.5s forwards}
}
@media (prefers-reduced-motion:reduce){.px{opacity:.9}.spark{opacity:1}}
.px:nth-of-type(1){right:-10px;top:-8px;--dx:34px;--dy:-46px}
.px:nth-of-type(2){right:-34px;top:22px;--dx:52px;--dy:-30px;width:18px;height:18px}
.px:nth-of-type(3){right:22px;top:-30px;--dx:20px;--dy:-64px;width:16px;height:16px}
.px:nth-of-type(4){right:-38px;top:-20px;--dx:44px;--dy:-58px;width:12px;height:12px}
@keyframes drift{0%{opacity:0;transform:translate(0,0)}25%{opacity:.95}100%{opacity:.55;transform:translate(var(--dx),var(--dy)) rotate(14deg)}}
@keyframes pop{0%{opacity:0;transform:scale(.4) rotate(-20deg)}70%{opacity:1;transform:scale(1.1)}100%{opacity:1;transform:scale(1)}}

/* itemized */
.itemized{display:grid;grid-template-columns:.9fr 1.1fr;gap:56px;padding:72px 0;border-top:1px solid var(--line)}
h2{font:740 clamp(32px,4.4vw,52px)/1.02 var(--display);letter-spacing:-.035em;margin:0 0 18px;text-wrap:balance}
.itemized p{color:var(--muted);margin:0 0 14px;max-width:30em}
.bill{background:var(--paper);border-radius:22px;padding:30px 32px;border:1px solid var(--line)}
.bill ul{list-style:none;margin:0;padding:0}
.bill li{display:flex;align-items:baseline;gap:10px;padding:11px 0}
.bill li span:first-child{white-space:nowrap}
.bill .what{color:var(--muted);font-size:16px}
.bill .lead{flex:1;border-bottom:2px dotted var(--line);transform:translateY(-5px);min-width:16px}
.bill b{font-weight:650}
.bill .total{margin-top:10px;padding-top:18px;border-top:2px solid var(--ink);font:720 26px/1.1 var(--display);letter-spacing:-.02em}
.bill .total .lead{border-color:transparent}
.bill .alt,.bill .note{max-width:none}
.bill .alt{margin-top:18px;padding:14px 16px;border-radius:14px;background:var(--mist);font-size:16px;color:var(--muted)}
.bill .alt b{color:var(--ink)}
.note{font-size:14px;color:var(--muted);margin-top:14px}

/* features */
.feature{display:grid;grid-template-columns:1fr 1fr;gap:64px;align-items:center;padding:56px 0}
.feature.flip .shot{order:2}
.shot{width:min(380px,100%);justify-self:center}
.shot img{background:var(--paper);aspect-ratio:720/1488;border-radius:30px}
.feature h3{font:720 clamp(28px,3.4vw,40px)/1.05 var(--display);letter-spacing:-.03em;margin:0 0 14px}
.feature p{color:var(--muted);margin:0;max-width:30em}
.also{padding:40px 0 72px;border-bottom:1px solid var(--line)}
.also h3{font:700 24px/1.2 var(--display);letter-spacing:-.02em;margin:0 0 18px}
.also dl{display:grid;grid-template-columns:repeat(4,1fr);gap:26px;margin:0}
.also dt{font-weight:650;margin-bottom:4px}
.also dd{margin:0;color:var(--muted);font-size:16px}

/* trust */
.trust{display:grid;grid-template-columns:1fr 1.2fr;gap:56px;padding:80px 0}
.trust ul{list-style:none;margin:0;padding:0}
.trust li{padding:18px 0;border-top:1px solid var(--line)}
.trust li:first-child{border-top:0;padding-top:4px}
.trust li b{display:block;font:700 21px/1.25 var(--display);letter-spacing:-.015em;margin-bottom:4px}
.trust li span{color:var(--muted)}
.price{background:var(--ink);color:var(--mist);border-radius:28px;padding:40px 44px;margin:0 0 80px;display:flex;gap:28px;align-items:center;justify-content:space-between;flex-wrap:wrap}
.price p{margin:0;max-width:36em;font-size:19px}
.price .btn{background:var(--mist);color:var(--ink)}

/* docs */
.doc{background:var(--paper);border:1px solid var(--line);border-radius:26px;padding:clamp(24px,5vw,56px);max-width:880px;margin:16px auto 72px}
.doc h1{font:760 clamp(38px,5.5vw,60px)/1 var(--display);letter-spacing:-.035em;margin:0 0 10px}
.doc h1+p{color:var(--muted);margin-top:0}
.doc h2{font-size:clamp(24px,3vw,30px);margin:44px 0 12px}
.doc p,.doc li{max-width:72ch}
.doc li{margin:6px 0}
.table{overflow-x:auto;margin:18px 0;border:1px solid var(--line);border-radius:14px}
.table table{border-collapse:collapse;width:100%;min-width:560px;font-size:15.5px;line-height:1.5}
.table th,.table td{text-align:left;vertical-align:top;padding:12px 14px;border-bottom:1px solid var(--line)}
.table th{background:var(--mist);font-weight:650}
.table tr:last-child td{border-bottom:0}
details{border-top:1px solid var(--line);padding:4px 0}
details:last-of-type{border-bottom:1px solid var(--line)}
summary{cursor:pointer;font:650 19px/1.4 var(--body);padding:16px 0;list-style:none;display:flex;justify-content:space-between;gap:16px}
summary::-webkit-details-marker{display:none}
summary::after{content:"+";font:400 26px/1 var(--display);color:var(--violet)}
details[open] summary::after{content:"\2212"}
details p{margin:0 0 18px;color:var(--muted);max-width:68ch}
.contact{display:grid;grid-template-columns:repeat(2,1fr);gap:18px;margin:28px 0 8px}
.contact div{background:var(--mist);border-radius:16px;padding:20px 22px}
.contact b{display:block;margin-bottom:4px}

/* footer */
footer{padding:36px 0 48px;color:var(--muted);font-size:15px}
footer .wrap{display:flex;flex-wrap:wrap;justify-content:space-between;gap:16px}
footer nav{display:flex;gap:20px}
footer a{color:var(--muted)}
.nf{text-align:center;padding:120px 0}
.nf h1{font:780 clamp(60px,10vw,120px)/1 var(--display);letter-spacing:-.05em;margin:0}

@media (max-width:860px){
  .spark{right:-6px;top:-44px;width:48px;height:48px}.px{display:none}
  .hero,.itemized,.feature,.trust{grid-template-columns:1fr;gap:36px}
  .hero{padding-top:16px}
  .feature.flip .shot{order:0}
  .also dl{grid-template-columns:1fr 1fr}
  .contact{grid-template-columns:1fr}
  .price{padding:30px 26px}
  .top nav{gap:16px}
}
@media (max-width:560px){.bill{padding:22px 20px}.bill li span:first-child{white-space:normal}.bill .what{display:block;font-size:15px}.bill li{align-items:flex-end}}
.hero>*,.itemized>*,.feature>*,.trust>*{min-width:0}
@media (max-width:420px){.also dl{grid-template-columns:1fr}.top nav{gap:12px}.top nav a{font-size:15px}.brand{gap:10px;font-size:20px}.brand img{width:34px;height:34px}}
