/* Optional illustrated skin. Remove this stylesheet to restore the original. */
:root{--bg:#fffdf7;--ink:#382638;--muted:#67586d;--accent:#f8d569;--accent-deep:#b78528;--amber-tint:#fff0b9;--band:#f1e8f7;--line:#c9b6ce;--purple:#7347bd;--shadow-card:4px 5px 0 #38263820;--shadow-soft:5px 6px 0 #38263818}
body{background:repeating-linear-gradient(112deg,#694a7707 0 1px,transparent 1px 9px),var(--bg);color:var(--ink)}
body h1,body h2,body h3,.price strong,.step-num,.cost-step{font-family:'Manrope',system-ui,sans-serif;font-weight:800;letter-spacing:-.035em}
body h1{line-height:1.14;letter-spacing:-.045em}
body h2{line-height:1.2}
body h3{line-height:1.3}
.header{background:repeating-linear-gradient(116deg,transparent 0 8px,#24132f26 8px 9px),var(--purple);border-bottom:3px solid var(--ink);color:#fffdf7;backdrop-filter:none;box-shadow:0 3px 0 #38263818}
.header .brand,.header .nav-link,.header .menu-toggle{color:#fffdf7}
.header .brand-dot{filter:drop-shadow(2px 2px 0 #382638)}
.header .nav-link:hover{color:#ffe48e}
.header .menu-toggle{border:1.5px solid #e6d4f0;background:#ffffff10;border-radius:7px 10px 6px 9px}
.header .nav-mobile{background:#7347bd;color:white;border-color:var(--ink)}
.header .nav-mobile a:not(.btn){color:white}
.header .nav-mobile a.btn-navy{color:var(--ink)}
.header .nav-burger{color:white}
.header .nav-burger span{background:white}
body .btn{border:2px solid var(--ink);border-radius:9px 14px 8px 12px;box-shadow:3px 4px 0 #382638;transition:transform .18s,box-shadow .18s,background-color .18s}
body .btn:hover{transform:translate(-1px,-2px);box-shadow:4px 6px 0 #382638}
body .btn:active{transform:translate(2px,2px);box-shadow:1px 1px 0 #382638}
body .btn-amber,body .btn-white{background:var(--accent);color:var(--ink)}
body .btn-navy{background:#f1e8f7;color:var(--ink)}
body .btn-outline{background:var(--bg);color:var(--ink)}
.header .nav-whatsapp{background:#eff8e9;color:#245536}
body :is(a,button,input,select):focus-visible{outline:3px solid #ac7fd9;outline-offset:5px}
.hero{background:transparent}
.hero h1 .marker{color:var(--purple)}
.marker path{stroke:var(--accent);stroke-width:12;stroke-linecap:round}
.hero-blob{bottom:24px;background:radial-gradient(#7347bd30 1px,transparent 1.5px) 0 0/9px 9px,#f1e8f7;border:2px solid #38263855;border-radius:46% 54% 51% 49% / 47% 44% 56% 53%}
.hero .phone{border:3px solid var(--ink);border-radius:28px 35px 27px 33px;box-shadow:9px 12px 0 #38263820;background:var(--bg)}
.phone-app{background:var(--bg)}
.workflow-phone{border:3px solid var(--ink);border-radius:24px 29px 22px 27px;box-shadow:4px 5px 0 #38263820}
.workflow-message,.mini-bubble,.sms{border:1.5px solid #806787;border-radius:9px 14px 7px 12px}
.call-card,.sms-card,.wa-card{border:1.5px solid var(--ink);box-shadow:2px 3px 0 #38263815;border-radius:10px 15px 8px 13px}
.call-avatar{background:#e9dbf4;color:var(--purple);border:1.5px solid var(--ink)}
.hero-checks .check svg{border:1px solid #31764d;border-radius:6px 8px 5px 7px;background:#e9f5e5;padding:2px}
.section-head h2{color:var(--ink)}
.section-head h2::after{background:var(--accent);border-radius:60% 25% 65% 35%}
.band-gray{background:repeating-linear-gradient(112deg,#7347bd05 0 1px,transparent 1px 8px),#f0e8f5;border-block:2px solid #b69dbb}
.step,.sit,.trade-card,.inbox-preview,.voice-strip,.calc-card,.result-card,.trade-panel,.faq details{
  background:var(--bg);border:5px solid transparent;border-image:url('/assets/ink-frame.svg') 16 / 6px / 1px stretch;border-radius:10px 16px 9px 14px;box-shadow:3px 4px 0 #38263812;
}
.step-num,.cost-step{background:var(--accent);color:var(--ink);border:1.5px solid var(--ink);border-radius:7px 11px 6px 10px}
.step h3,.sit h3,.trade-card b{font-family:'Manrope',system-ui,sans-serif;font-size:24px}
.trade-card:nth-child(even){background:#f1e8f7}
.trade-card:hover{border-image:url('/assets/ink-frame.svg') 16 / 6px / 1px stretch;background:#fff0b9;box-shadow:4px 6px 0 #38263825}
.inbox-toolbar{background:repeating-linear-gradient(116deg,transparent 0 8px,#24132f25 8px 9px),var(--purple);color:white;border-bottom:2px solid var(--ink)}
.inbox-toolbar :is(b,span){color:white}
.inbox-kpis{background:#f1e8f7;border-bottom:2px solid #b69dbb}
.inbox-kpis>div{border-color:#c9b6ce}
.inbox-kpi-icon{color:var(--purple)}
.inbox-columns{background:#fff0b9;color:var(--ink)}
.inbox-entry{border-color:#c9b6ce}
.inbox-entry summary:hover{background:#f5eef8}
.inbox-status,.inbox-listen{border:1px solid currentColor;border-radius:5px 8px 4px 7px}
.voice-strip .player{background:#f1e8f7}
.play-btn{background:var(--purple);color:#fff;border:2px solid var(--ink);box-shadow:3px 3px 0 #38263825}
.wave span{background:var(--purple)}
.hl-amber{background:#f8d569;border-radius:7px 3px 10px 5px;padding-inline:5px;box-decoration-break:clone;-webkit-box-decoration-break:clone}
.pricing .amber-card{background:repeating-linear-gradient(116deg,transparent 0 9px,#24132f22 9px 10px),var(--purple);color:#fffdf7;border:3px solid var(--ink);border-radius:17px 25px 15px 22px;box-shadow:7px 8px 0 #38263820}
.pricing .amber-card :is(h3,p,.price){color:#fffdf7}
.pricing .price strong{color:#ffe28a}
.faq summary{color:var(--ink)}
.faq details{padding:18px 22px;margin-bottom:12px}
.faq details[open]{background:#f1e8f7}
.footer{background:var(--bg);border-top:2px solid var(--ink)}
input:not([type=range]),select,textarea{border:2px solid #806787;border-radius:7px 10px 6px 9px;background:var(--bg);color:var(--ink)}
input[type=range]{accent-color:var(--purple)}
svg{stroke-linecap:round;stroke-linejoin:round}
@media(max-width:640px){body h1{font-size:clamp(40px,10.5vw,54px)}body h2{font-size:clamp(28px,7.6vw,36px)}.step h3,.sit h3{font-size:25px}.hero .phone{box-shadow:6px 8px 0 #38263820}.header .btn{box-shadow:2px 2px 0 #382638}.pricing .amber-card{box-shadow:4px 5px 0 #38263820}}
@media(prefers-reduced-motion:reduce){body .btn{transition:none}body .btn:hover,body .btn:active{transform:none}}

/* Keep sign-in readable when the legacy navy hover rule applies. */
body .header .btn-navy:hover,body .header .btn-navy:focus-visible{background:#e3d2ef;color:#382638}
/* The final explanation step uses the same lilac paper and ink palette. */
body .cost-story .sit:last-child{background:#f1e8f7;color:#382638;border:2px solid #806787;border-image:none;border-radius:12px 20px 11px 17px;box-shadow:4px 5px 0 #38263820}
body .cost-story .sit:last-child h3{color:#382638}
body .cost-story .sit:last-child p{color:#67586d}
body .cost-story .sit:last-child .cost-step{background:#f8d569;border:1.5px solid #382638;color:#382638;border-radius:7px 11px 6px 10px}
