@font-face {
    font-family: "Poppins";
    src:
            local("Poppins"),
            url("/content/poppins.woff") format("woff"),
            url("/content/poppins.woff2") format("woff2");
}

:root {
    --theme-color: #2F2F2F;
    --green: #16a34a;
    --green-deep: #0f7a37;
    --red: #c0392b;
    --gold: #c9a14a;
    --paper-2:#FFFFFF;
    --ink-900:#101823;
    --slate:#5D6B79;
    --line-2:#EDEEEA;
    --signal:#F0A81E;
    --signal-deep:#C9861A;
    --teal:#1C7A67;
    --radius:14px;
    --radius-sm:10px;
    --ease:cubic-bezier(.22,.61,.36,1);
    --shadow-sm:0 1px 2px rgba(21,32,46,.06), 0 4px 14px rgba(21,32,46,.05);
    --shadow-md:0 10px 30px rgba(21,32,46,.10), 0 2px 8px rgba(21,32,46,.06);

    --ink:#17182B;
    --ink-soft:#22243C;
    --paper:#F1F1F8;
    --card:#FFFFFF;
    --brand:#574FE6;
    --brand-strong:#423AD4;
    --order:#EE9F33;
    --order-deep:#D8862A;
    --text:#292B41;
    --muted:#787C95;
    --line:#E4E4EF;
    --line-ink:rgba(255,255,255,.12);
    --good:#22A981;
    --shadow:0 1px 2px rgba(23,24,43,.05), 0 12px 30px -12px rgba(23,24,43,.14);
    --shadow-lg:0 2px 4px rgba(23,24,43,.06), 0 30px 60px -22px rgba(23,24,43,.28);
    --r:14px;
    --maxw:1120px;
    --disp:"Bricolage Grotesque", system-ui, sans-serif;
    --body:"IBM Plex Sans", system-ui, sans-serif;
    --mono:"IBM Plex Mono", ui-monospace, monospace;
}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
    margin:0;
    background:var(--paper);
    color:var(--ink);
    font-family:"Instrument Sans",system-ui,-apple-system,Segoe UI,Roboto,sans-serif;
    font-size:17px;
    line-height:1.6;
    -webkit-font-smoothing:antialiased;
    text-rendering:optimizeLegibility;
}
h1,h2,h3,h4{font-family:"Bricolage Grotesque",serif;font-weight:700;letter-spacing:-.02em;line-height:1.05;margin:0}
p{margin:0}
a{color:inherit;text-decoration:none}
img{max-width:100%;display:block}

body { margin: 0; padding:0; font-family: 'Poppins'; }
.mainbody { min-height: calc(100vh - 280px); }

a { text-decoration: none; color: inherit; }

h1 { font-weight: 700;
    margin: 0 0 10px 0;
    padding: 0;
    font-size: 42px; line-height: 1.2; }
h2 { font-weight: 700;
    margin: 0 0 10px 0;
    padding: 0;
    font-size: 28px; line-height: 1.2;
    color: var(--theme-color); }

p { font-size: 16px; line-height: 1.6; }

.hilight1 { position: relative; }
.hilight1:after { content: ''; bottom:-10px; left:-20px; right: -20px; height:20px; position: absolute; background-image: url('/content/underline.png'); background-position: center center; background-size: contain; background-repeat: no-repeat; }

.btn_primary { text-decoration: none; padding:8px 30px; background: var(--theme-color); border-radius: 10px; color: #FFF; display: block; text-align: center; width: 90%; max-width: 140px; cursor: pointer; font-weight: bold; }

section.title { padding:10px 20px 80px 20px; text-align: center; color: #444; }




header { padding: 10px; background:#FFF; z-index: 100; position: sticky; top: 0px; left: 0px; right:0px;  color: #444; border-bottom: 2px solid var(--theme-color); }
header > div { display: flex; max-width: 1320px; margin: auto; align-items: center; }
header > div > * { flex: 1; font-size: 15px; text-align: center; }
header > div > *:first-child { flex: 4; align-items: center; text-align: left; }
header > div > * .link { padding:8px 20px; display: block; text-align: center; }
header > div > *:last-child .link.register { background:var(--theme-color); border-radius: 10px; color: #FFF; font-size: 90%; }

header .logo { display: flex; color: #000; }
header .logo > *:first-child { padding-right: 20px;  }
header .logo img { height:60px; vertical-align: top; }
header .logo .subtitle { display:block; margin-top:0; font-size:90%; }
header .logo .title > span:first-child { display: block; font-size: 120%; font-weight: bold; }

header .profile > * { display: inline-block; vertical-align: middle; }
header .profile img { width: 36px; height: 36px; margin-right:8px; }  

footer { background:var(--theme-color); color: #FFF; text-shadow: 1px 1px 3px rgba(0,0,0,0.3); }
footer > * { padding: 30px; }
footer .menu { display: flex; gap:30px;  max-width: 1320px; margin: auto; }
footer .menu > * { flex:1; color: #EEE; line-height:20px; }
footer .menu > *:first-child { flex: 2; }
footer .menu .title { font-weight: bold; margin-bottom:20px; display: block; opacity: 0.7; text-transform: uppercase; font-size: 80%; }
footer .menu a { display: block; text-decoration: none; color: inherit; margin-bottom: 13px; }
footer .menu img { width: 20px; height: 20px; display: inline-block; }
footer .company { display: flex; align-items: center; width: 100%; font-size: 20px; gap: 10px; margin-bottom: 10px; }
footer .company .icon { display: block; width: 36px; padding:6px; background: #FFF; border-radius: 5px; }
footer .company .icon svg { width: 100%; }
footer .companydesc { display: block; font-size: 90%; line-height: 1.7; max-width: 300px; }


.paragraph { padding:50px; }
.paragraph.hero { padding:80px 20px; }
.paragraph.dark { background: var(--theme-color); color: #fff; }
.paragraph.dark h2 { color:#FFF; }
.paragraph.dark em { color: var(--green); }
.paragraph .content { max-width: 1320px; margin: auto; display: flex; gap:40px; width: 100%; align-items: center;  }
.paragraph.center { text-align: center; }
.paragraph h1, .paragraph h2, .paragraph h3, .paragraph h4 { margin-bottom: 20px; }
.paragraph table { margin: 30px 0; }
.paragraph.fulltable table { width: 100%; }
.paragraph table th { background: var(#222); color: #FFF; padding:10px; }
.paragraph ul { margin: 10px 30px; }
.paragraph li { padding:4px 0; }
.paragraph img { width: 100%; vertical-align: top; }

.table { display: flex; width: 100%; align-items: center; }
.table > * { flex:2; }
.table > *:first-child { flex: 1; }



.paragraph.hero {
    background-image: url(/content/greensquiggle.png), url(/content/yellowsquiggle.png);
    background-position: right bottom, left top;
    background-repeat: no-repeat, no-repeat;
    background-size: contain, contain;
}
.paragraph.hero:nth-child(odd){
    background-image: url(/content/greensquiggle2.png), url(/content/yellowsquiggle2.png);
    background-position: 20% top, 80% bottom;
    background-repeat: no-repeat, no-repeat;
    background-size: contain, contain;
}
.paragraph.hero:nth-child(even){
    background-color: #EEE;
}

.paragraph .subtitle { text-transform: uppercase;
    opacity: 0.6; font-size: 20px; font-weight: normal; }
.paragraph.center { text-align: center; }
.paragraph.nobottom { margin-bottom: 0; padding-bottom: 0; }

@keyframes linkbounce {
    0%   { transform: scale(1,1)      translateX(0); }
    10%  { transform: scale(1.1,.95)   translateX(0); }
    30%  { transform: scale(.95,1.1)   translateX(20px); }
    50%  { transform: scale(1.05,.95) translateX(0); }
    100% { transform: scale(1,1)      translateX(0); }
}


.question { text-align: left; display: block; margin-top: 20px; }
.question h2 { display: block; border-radius: 10px; background: var(--theme-color); color: #FFF; cursor: pointer;font-size: 18px;
    padding: 10px; }
.question input { display: none; }
.question .answer { display: none; padding: 20px;
    box-sizing: border-box; }
.question input:checked + .answer { display: block; }

.greyhero { background: #EEE; }

.contacttext { margin:60px auto 40px auto; }
.contacttext .paragraph { padding: 0 !important; background:none; }
.contact {
    width: 100%; margin:20px auto 60px auto; padding:30px 40px; background:#FFF; border-radius: 10px; box-shadow: 0 0 10px rgba(0,0,0,0.1);  overflow: hidden; box-sizing: border-box;
}
.contact > span {
    display: table; table-layout: fixed; width: 100%; margin-bottom: 15px;
}
.contact > span > span, .contact > span > label{ display:  table-cell; vertical-align: middle; }
.contact label { width: 100px; font-size: 14px; }
.contact .inputrow { width:100%; box-sizing: border-box; }
.contact .inputrow input { width: 100%; max-width: 100%; border: 1px solid #CCC;  border-radius: 5px; padding: 6px; box-sizing: border-box; }
.contact textarea { width: 100%; max-width: 100%; height: 120px; border: 1px solid #CCC;  border-radius: 5px; padding: 6px; box-sizing: border-box; margin-bottom: 15px; }
.contact button { float: right; border:none; width: auto; max-width: none; }




@media only screen and (max-width: 700px) {  
    header > div { text-align: center; }
    .hero_section .content { display: block; padding: 20px; box-sizing: border-box; }
    header .logo .title { display: none; }
    header > div > :first-child { flex: 0.5; }
    .table { display: block; }
    .features, .question { padding-left: 0; }
    .featurepanel { margin:0px auto 40px auto; }
    .pricingtable { display: block; }
    .pricingtable > * { margin-bottom: 20px; }
}

.fade-up {
    opacity: 0;
    transform: translateY(20px);
    animation: fadeUp 0.8s forwards;
}
@keyframes fadeUp { to { opacity: 1; transform: translateY(0); } }
.fade-up:nth-child(1) { animation-delay: 0.05s; }
.fade-up:nth-child(2) { animation-delay: 0.15s; }
.fade-up:nth-child(3) { animation-delay: 0.25s; }
.fade-up:nth-child(4) { animation-delay: 0.35s; }
.fade-up:nth-child(5) { animation-delay: 0.45s; }



.pricing-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 24px;
    margin-top: 28px;
}
@media (max-width: 720px) { .pricing-grid { grid-template-columns: 1fr; } }

.tier {
    background: #FFF;
    border: 1px solid var(--line);
    border-radius: 24px;
    padding: 36px 32px;
    position: relative;
}
.tier.pro {
    background: var(--theme-color);
    color: #FFF;
    border-color: var(--ink);
}
.tier.pro h2 { color: inherit; }
.tier .price {
    font-size: 40px;
    font-weight: 500;
    letter-spacing: -0.02em;
    display: inline-block;
    align-items: baseline;
    margin-right: 10px;
}
.tier .year { display: block; margin-top: 15px; opacity: 0.7;
    opacity: 0.6; font-size: 90%; }
.tier ul {
    list-style: none;
    margin:20px 0 0 0;
    padding: 0;
}
.tier li {
    padding: 10px 0;
    display: flex;
    align-items: center;
    gap: 10px;
    font-size: 14.5px;
}
.tier-pro li { border-color: rgba(245,241,234,0.1); }
.tier li::before {
    content: '✓';
    color: var(--green);
    font-weight: 700;
    flex-shrink: 0;
}


body{
    margin:0;
    font-family:var(--body);
    color:var(--text);
    background:var(--paper);
    font-size:17px;
    line-height:1.62;
    -webkit-font-smoothing:antialiased;
}
h1,h2,h3{font-family:var(--disp);font-weight:700;line-height:1.05;letter-spacing:-.02em;margin:0}
p{margin:0}
a{color:inherit;text-decoration:none}
.wrap{max-width:var(--maxw);margin:0 auto;padding:0 28px}
.mono{font-family:var(--mono)}
.eyebrow{
    font-family:var(--mono);font-size:12.5px;font-weight:500;letter-spacing:.14em;
    text-transform:uppercase;color:var(--brand);
}

/* ---------- buttons ---------- */
.btn{
    display:inline-flex;align-items:center;gap:.5em;
    font-family:var(--body);font-weight:600;font-size:16px;
    padding:.72em 1.3em;border-radius:11px;cursor:pointer;border:1px solid transparent;
    transition:transform .15s ease, box-shadow .2s ease, background .2s ease;
}
.btn-primary{background:var(--brand);color:#fff;box-shadow:0 8px 20px -8px rgba(87,79,230,.7)}
.btn-primary:hover{background:var(--brand-strong);transform:translateY(-1px)}
.btn-ghost{background:transparent;color:var(--text);border-color:var(--line)}
.btn-ghost:hover{border-color:#c9c9db;background:#fff}
.btn-light{background:#fff;color:var(--ink)}
.btn-light:hover{transform:translateY(-1px);box-shadow:0 10px 24px -10px rgba(0,0,0,.45)}
.btn .arw{transition:transform .15s ease}
.btn:hover .arw{transform:translateX(3px)}

/* ---------- hero ---------- */
.hero{padding:70px 0 40px}
.hero-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:56px;align-items:center}
.hero h1{font-size:clamp(38px,5.4vw,62px);font-weight:800}
.hero h1 .thread{
    background:linear-gradient(96deg,var(--brand),var(--order));
    -webkit-background-clip:text;background-clip:text;color:transparent;
}
.hero .lede{margin-top:22px;font-size:19px;color:#4a4d64;max-width:33ch}
.hero-cta{margin-top:32px;display:flex;gap:14px;flex-wrap:wrap;align-items:center}
.hero-note{margin-top:18px;font-family:var(--mono);font-size:12.5px;color:var(--muted);letter-spacing:.02em}

/* ---------- signature: ticket ↔ order ---------- */
.link-stack{position:relative;display:flex;flex-direction:column;align-items:stretch;max-width:400px;margin-left:auto}
.tkt{
    background:var(--card);border:1px solid var(--line);border-radius:var(--r);
    box-shadow:var(--shadow-lg);padding:18px 20px;position:relative;z-index:2;
}
.tkt-top{display:flex;align-items:center;justify-content:space-between;margin-bottom:12px}
.tkt-id{font-family:var(--mono);font-size:13px;color:var(--muted);font-weight:500}
.chip{font-family:var(--mono);font-size:11.5px;font-weight:600;padding:3px 9px;border-radius:999px;letter-spacing:.02em}
.chip.open{background:rgba(87,79,230,.12);color:var(--brand)}
.chip.resolved{background:rgba(34,169,129,.14);color:var(--good)}
.tkt-subj{font-family:var(--disp);font-weight:600;font-size:18px;color:var(--ink);letter-spacing:-.01em}
.tkt-msg{font-size:14.5px;color:#5c5f77;margin-top:6px;line-height:1.5}
.tkt-foot{display:flex;align-items:center;gap:8px;margin-top:14px;padding-top:13px;border-top:1px solid var(--line)}
.avatar{width:26px;height:26px;border-radius:50%;background:linear-gradient(135deg,#8a83ff,#574FE6);color:#fff;font-size:12px;font-weight:600;display:flex;align-items:center;justify-content:center;font-family:var(--body)}
.tkt-who{font-size:13.5px;color:#5c5f77}
.attach{margin-left:auto;font-family:var(--mono);font-size:11.5px;color:var(--muted);display:flex;align-items:center;gap:5px}

.connector{position:relative;height:74px;display:flex;justify-content:center}
.connector svg{position:absolute;top:0;left:50%;transform:translateX(-50%);overflow:visible}
.conn-pill{
    position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);
    background:#fff;border:1px solid var(--line);border-radius:999px;
    font-family:var(--mono);font-size:11px;font-weight:600;letter-spacing:.04em;
    padding:5px 12px;color:var(--ink);z-index:3;white-space:nowrap;box-shadow:var(--shadow);
    display:flex;align-items:center;gap:7px;
}
.conn-pill .dot{width:6px;height:6px;border-radius:50%;background:var(--order)}

.ord{
    background:var(--ink);color:#fff;border-radius:var(--r);padding:18px 20px;position:relative;z-index:2;
    box-shadow:var(--shadow-lg);border:1px solid var(--ink);
}
.ord-top{display:flex;align-items:center;justify-content:space-between;margin-bottom:14px}
.ord-id{font-family:var(--mono);font-size:13px;color:#fff;font-weight:600}
.ord-tag{font-family:var(--mono);font-size:11px;color:var(--order);letter-spacing:.06em;text-transform:uppercase}
.ord-row{display:flex;align-items:center;gap:12px;margin-bottom:11px}
.ord-thumb{width:38px;height:38px;border-radius:8px;background:linear-gradient(135deg,#3a3c5a,#26283f);flex:0 0 auto;border:1px solid rgba(255,255,255,.08)}
.ord-item{font-size:14px;color:#ececf5;font-weight:500}
.ord-sub{font-family:var(--mono);font-size:11.5px;color:#9a9db8;margin-top:1px}
.ord-meta{display:flex;justify-content:space-between;border-top:1px solid var(--line-ink);padding-top:12px;margin-top:2px}
.ord-meta span{font-family:var(--mono);font-size:12px;color:#b9bbd0}
.ord-meta b{color:#fff;font-weight:600}

/* draw-in animation */
.draw-path{stroke-dasharray:120;stroke-dashoffset:120;animation:draw 1.1s .35s ease forwards}
.fade-up{opacity:0;transform:translateY(14px);animation:fadeup .7s ease forwards}
.tkt.fade-up{animation-delay:.05s}
.conn-pill.fade-up{animation-delay:.9s}
.ord.fade-up{animation-delay:.55s}
@keyframes draw{to{stroke-dashoffset:0}}
@keyframes fadeup{to{opacity:1;transform:none}}

/* ---------- generic section ---------- */
section{padding:88px 0}
.sec-head{max-width:640px}
.sec-head h2{font-size:clamp(28px,3.6vw,40px);margin-top:14px}
.sec-head p{margin-top:16px;color:var(--muted);font-size:18px}

/* ---------- problem ---------- */
.problem{background:var(--ink);color:#fff}
.problem .eyebrow{color:var(--order)}
.problem .sec-head h2{color:#fff}
.problem .sec-head p{color:#b7b9d0}
.prob-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;margin-top:44px}
.prob-card{background:var(--ink-soft);border:1px solid var(--line-ink);border-radius:var(--r);padding:26px}
.prob-num{font-family:var(--mono);font-size:12px;color:var(--order);letter-spacing:.08em;margin-bottom:14px}
.prob-card h3{font-size:19px;color:#fff;margin-bottom:8px}
.prob-card p{font-size:15px;color:#a9abc4;line-height:1.55}

/* ---------- steps ---------- */
.steps{position:relative}
.step-list{margin-top:52px;display:grid;gap:0}
.step{display:grid;grid-template-columns:56px 1fr;gap:24px;padding:30px 0;border-top:1px solid var(--line);position:relative}
.step:last-child{border-bottom:1px solid var(--line)}
.step-n{font-family:var(--mono);font-size:14px;font-weight:600;color:#fff;background:var(--brand);width:40px;height:40px;border-radius:11px;display:flex;align-items:center;justify-content:center}
.step:nth-child(3) .step-n{background:var(--order)}
.step-body h3{font-size:22px;color:var(--ink);margin-bottom:8px}
.step-body p{color:#5c5f77;font-size:16.5px;max-width:60ch}
.step-body .tag{font-family:var(--mono);font-size:12.5px;color:var(--brand);background:rgba(87,79,230,.09);padding:2px 8px;border-radius:6px}

/* ---------- benefits ---------- */
.benefits{background:#fff}
.ben-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;margin-top:48px;background:var(--line);border:1px solid var(--line);border-radius:var(--r);overflow:hidden}
.ben{background:#fff;padding:30px 28px}
.ben .ic{width:34px;height:34px;margin-bottom:16px;color:var(--brand)}
.ben h3{font-size:18px;color:var(--ink);margin-bottom:8px}
.ben p{font-size:15px;color:#5c5f77;line-height:1.55}

/* ---------- dispute band ---------- */
.dispute{background:linear-gradient(120deg,#1b1d33,#262845);color:#fff;border-radius:22px;padding:56px;margin:0 auto;display:grid;grid-template-columns:1.2fr 1fr;gap:44px;align-items:center;max-width:var(--maxw)}
.dispute-wrap{padding:40px 0}
.dispute .eyebrow{color:var(--order)}
.dispute h2{font-size:clamp(26px,3.2vw,36px);color:#fff;margin-top:12px}
.dispute p{color:#c2c4da;margin-top:16px;font-size:17px}
.stat-card{background:rgba(255,255,255,.05);border:1px solid var(--line-ink);border-radius:16px;padding:28px;text-align:center}
.stat-card .big{font-family:var(--disp);font-weight:800;font-size:clamp(40px,6vw,60px);background:linear-gradient(96deg,#8f88ff,var(--order));-webkit-background-clip:text;background-clip:text;color:transparent;line-height:1}
.stat-card .cap{font-family:var(--mono);font-size:13px;color:#b7b9d0;margin-top:12px;line-height:1.5}

/* ---------- comparison ---------- */
.compare{background:var(--paper)}
.ctable{margin-top:44px;background:#fff;border:1px solid var(--line);border-radius:var(--r);overflow:hidden}
.crow{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr}
.crow>div{padding:18px 20px;border-bottom:1px solid var(--line)}
.crow:last-child>div{border-bottom:none}
.chead>div{font-family:var(--mono);font-size:12.5px;letter-spacing:.04em;text-transform:uppercase;color:var(--muted);background:#fafafd}
.chead .hi{color:var(--brand);font-weight:600}
.crow .rl{font-weight:500;color:var(--ink);font-size:15.5px}
.cell{font-size:14px;color:#6a6d84}
.cell.yes{color:var(--good);font-weight:600}
.cell.no{color:#b9bcce}
.col-hi{background:rgba(87,79,230,.045)}

/* ---------- pricing ---------- */
.pricing{background:#fff}
.price-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;margin-top:48px}
.plan{border:1px solid var(--line);border-radius:18px;padding:30px 28px;display:flex;flex-direction:column;background:#fff;position:relative}
.plan.hi{border-color:var(--brand);box-shadow:0 20px 44px -20px rgba(87,79,230,.4)}
.plan .badge{position:absolute;top:-12px;left:28px;background:var(--brand);color:#fff;font-family:var(--mono);font-size:11px;font-weight:600;letter-spacing:.05em;padding:4px 11px;border-radius:999px;text-transform:uppercase}
.plan-name{font-family:var(--mono);font-size:13px;letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
.plan-price{font-family:var(--disp);font-weight:800;font-size:44px;color:var(--ink);margin-top:14px;letter-spacing:-.02em}
.plan-price span{font-family:var(--body);font-size:16px;font-weight:500;color:var(--muted);letter-spacing:0}
.plan-year{font-family:var(--mono);font-size:12.5px;color:var(--muted);margin-top:6px}
.plan ul{list-style:none;padding:0;margin:24px 0 26px;display:grid;gap:12px}
.plan li{display:flex;gap:11px;font-size:15px;color:#4c4f66;align-items:flex-start}
.plan li .tick{color:var(--brand);flex:0 0 auto;margin-top:3px}
.plan .btn{width:100%;justify-content:center;margin-top:auto}
.plan-trial{text-align:center;font-family:var(--mono);font-size:12px;color:var(--muted);margin-top:12px}

/* ---------- proof ---------- */
.proof{background:var(--paper)}
.proof-in{max-width:760px;margin:0 auto;text-align:center}
.stars{color:var(--order);font-size:20px;letter-spacing:3px}
.quote{font-family:var(--disp);font-weight:600;font-size:clamp(22px,3vw,30px);color:var(--ink);margin-top:20px;line-height:1.28;letter-spacing:-.01em}
.quote-by{font-family:var(--mono);font-size:13px;color:var(--muted);margin-top:20px}

/* ---------- faq ---------- */
.faq-list{margin-top:44px;max-width:820px}
details.qa{border-top:1px solid var(--line);padding:6px 0}
details.qa:last-child{border-bottom:1px solid var(--line)}
.qa summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:20px;padding:20px 0;font-family:var(--disp);font-weight:600;font-size:19px;color:var(--ink)}
.qa summary::-webkit-details-marker{display:none}
.qa .plus{flex:0 0 auto;width:22px;height:22px;position:relative;transition:transform .2s}
.qa[open] .plus{transform:rotate(45deg)}
.qa .plus::before,.qa .plus::after{content:"";position:absolute;background:var(--muted);border-radius:2px}
.qa .plus::before{left:10px;top:2px;width:2px;height:18px}
.qa .plus::after{top:10px;left:2px;height:2px;width:18px}
.qa .ans{padding:0 0 22px;color:#5c5f77;font-size:16px;max-width:70ch;line-height:1.6}

/* ---------- final cta ---------- */
.final{background:var(--ink);color:#fff;text-align:center}
.final h2{font-size:clamp(30px,4vw,46px);color:#fff;max-width:16ch;margin:0 auto}
.final p{color:#b7b9d0;margin-top:18px;font-size:18px}
.final .hero-cta{justify-content:center;margin-top:30px}
.final .hero-note{color:#8b8ea8}

/* ---------- footer ---------- */
footer{background:var(--ink);color:#9a9db8;padding:0;border-top:1px solid var(--line-ink)}
.foot-in{display:flex;justify-content:space-between;gap:30px;flex-wrap:wrap;align-items:flex-start}
.foot-brand{max-width:280px}
.foot-brand .logo{color:#fff;margin-bottom:12px}
.foot-brand p{font-size:13.5px;color:#8b8ea8;line-height:1.6}
.foot-cols{display:flex;gap:60px;flex-wrap:wrap}
.foot-col h4{font-family:var(--mono);font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:#8b8ea8;margin:0 0 14px}
.foot-col a{display:block;font-size:14px;color:#b9bbd0;margin-bottom:9px;transition:color .15s}
.foot-col a:hover{color:#fff}
.foot-legal{border-top:1px solid var(--line-ink);margin-top:36px;padding-top:22px;font-family:var(--mono);font-size:12px;color:#787c95;display:flex;justify-content:space-between;flex-wrap:wrap;gap:10px}

/* ---------- responsive ---------- */
@media (max-width:900px){
    .hero-grid{grid-template-columns:1fr;gap:44px}
    .link-stack{margin:0 auto}
    .prob-grid{grid-template-columns:1fr}
    .ben-grid{grid-template-columns:1fr}
    .dispute{grid-template-columns:1fr;padding:38px 30px}
    .price-grid{grid-template-columns:1fr;max-width:420px;margin-left:auto;margin-right:auto}
    .nav-links{display:none}
    section{padding:64px 0}
    .crow{grid-template-columns:1.3fr 1fr 1fr}
    .crow .cell:nth-child(4),.chead div:nth-child(4){display:none}
}
@media (max-width:540px){
    body{font-size:16px}
    .wrap{padding:0 20px}
    .hero{padding:44px 0 20px}
    .step{grid-template-columns:44px 1fr;gap:16px}
    .dispute{padding:30px 22px}
}
@media (prefers-reduced-motion:reduce){
    *{animation:none!important;transition:none!important}
    html{scroll-behavior:auto}
    .draw-path{stroke-dashoffset:0}
    .fade-up{opacity:1;transform:none}
}


.guides a { display: flex; margin: -40px 0 10px 0; padding: 20px; border-top:1px solid #CCC; gap:20px; align-items: center; }
.guides a:last-child { border-bottom:1px solid #CCC; }
.guides a > *:first-child { width:200px; }
.guides a > *:last-child { flex:1; }
.guides a .title { font-weight: bold; margin-bottom: 4px; display: block; }
.guides a .footer { margin-top: 4px; display: block; font-size: 80%; opacity: 0.7; }