/* Existing bot navy/teal identity; native accessible form and checkout patterns. */
:root{--navy:#142b40;--teal:#067d70;--teal-dark:#056458;--muted:#617078;--paper:#f7f8f5;--line:#dde4df;--soft:#eaf3ec;--white:#fff;--radius:18px}

*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:20px}
body{margin:0;background:var(--paper);color:var(--navy);font-family:"Segoe UI",Arial,sans-serif;font-size:16px;line-height:1.55}
a{color:var(--teal);text-decoration:none}
a:hover{text-decoration:underline}
button,input,select{font:inherit}
button,a,input,select,summary{-webkit-tap-highlight-color:transparent}
button,a,select,summary{touch-action:manipulation}
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,summary:focus-visible{outline:3px solid #0aa795;outline-offset:4px}
button{cursor:pointer}
button:disabled{cursor:not-allowed;opacity:.5}
.header,main,footer{max-width:1200px;margin:auto;padding-inline:36px}
.header{height:100px;display:flex;justify-content:space-between;align-items:center;gap:24px}
.brand{display:flex;align-items:center;gap:12px;color:var(--navy);font-size:18px;font-weight:700;line-height:1.15;letter-spacing:-.4px}
.brand:hover{text-decoration:none}
.brand img{border-radius:10px;object-fit:cover}
.brand-sub{display:block;font-size:13px;font-weight:500;letter-spacing:1px;margin-top:4px}
.header nav{display:flex;align-items:center;gap:28px;font-size:14px;font-weight:600}
.header nav a{color:var(--navy)}
.balance-pill{background:var(--soft);padding:6px 10px;border-radius:20px;font-size:12px;color:var(--teal);margin-left:8px}
.preview-bar{border-block:1px solid var(--line);padding:8px 20px;text-align:center;font-size:12px;color:#5d685e;background:#eef1e9}
.preview-bar span{margin:0 8px}
h1,h2,h3,p{margin-top:0}
h1{font-size:54px;line-height:1.12;letter-spacing:-2.5px;font-weight:650;margin-bottom:24px}
h2{font-size:31px;line-height:1.22;letter-spacing:-1.1px;font-weight:650}
h3{font-size:18px;line-height:1.35;font-weight:650;margin-bottom:8px}
p{color:var(--muted)}
.eyebrow{font-size:11px;text-transform:uppercase;letter-spacing:1.6px;font-weight:750;color:var(--teal);margin-bottom:20px}
.dot{display:inline-block;width:7px;height:7px;background:var(--teal);border-radius:50%;margin-right:6px}
.hero{display:grid;grid-template-columns:1.03fr 1fr;gap:64px;padding-block:64px 52px;align-items:center}
.hero h1{font-size:62px}
.hero em{font-style:normal;color:var(--teal)}
.lead{font-size:18px;line-height:1.65;max-width:480px;margin-bottom:25px}
.hero-facts{display:flex;flex-wrap:wrap;gap:10px 24px;color:var(--muted);font-size:12px}
.hero-facts span:before{content:"✓";margin-right:7px;color:var(--teal)}
.mini-sample{display:flex;gap:18px;align-items:center;border-top:1px solid var(--line);margin-top:32px;padding-top:26px}
.sample-lang{font-weight:700;font-size:18px;white-space:nowrap;color:var(--navy)}
.sample-lang span{color:var(--teal);margin:0 6px}
.mini-sample p{font-size:13px;margin:0}
.mini-sample strong{font-weight:500;color:var(--navy)}
.upload-card,.payment-card,.panel{background:var(--white);border:1px solid var(--line);border-radius:var(--radius);padding:28px}
.upload-card{box-shadow:0 14px 40px #15392708}
.section-top{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-bottom:22px}
.section-top .eyebrow{margin:0;color:var(--navy)}
.tag{font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:1px;background:var(--soft);border-radius:5px;padding:5px 9px;color:var(--teal)}
label{display:block;font-size:13px;font-weight:650;margin-bottom:8px}
input:not([type=hidden]):not([type=file]),select{display:block;width:100%;min-height:46px;padding:11px 13px;background:#fff;border:1px solid #c7d2cc;border-radius:8px;color:var(--navy);margin-bottom:20px;font-size:14px}
input:focus,select:focus{border-color:var(--teal)}
.dropzone{border:1.5px dashed #a7c7ba;background:#f4f8f3;border-radius:12px;padding:23px 14px;text-align:center;cursor:pointer;display:flex;flex-direction:column;align-items:center;margin-bottom:22px;font-weight:400;transition:background .15s}
.dropzone.dragging{background:#d4ece2;border-color:var(--teal)}
.upload-icon{display:grid;place-items:center;width:42px;height:42px;border:1px solid #d6e3da;background:#fff;border-radius:10px;font-size:27px;font-weight:400;line-height:1;color:var(--teal);margin-bottom:14px}
.dropzone strong{font-weight:600;font-size:15px;overflow-wrap:anywhere}
.dropzone span:not(.upload-icon){font-size:12px;color:var(--muted);margin-top:7px}
.dropzone small{font-size:11px;color:var(--muted);margin-top:2px}
.dropzone input{margin-top:14px;font-size:11px;max-width:100%;color:var(--muted)}
.dropzone input::file-selector-button{border:1px solid #c7d5ca;padding:5px 8px;border-radius:4px;background:white;color:var(--navy);font:inherit;cursor:pointer}
.button{background:var(--teal);color:#fff;border:1px solid transparent;border-radius:8px;min-height:46px;padding:12px 19px;font-size:14px;font-weight:600;display:inline-flex;align-items:center;justify-content:center;gap:16px;text-align:center;line-height:1.3}
.button:hover{background:var(--teal-dark);text-decoration:none}
.button.wide{display:flex;width:100%;justify-content:space-between}
.button.wide:not(:has(span)){justify-content:center}
.button.secondary{background:#fff;border-color:#ccd8cf;color:var(--navy)}
.button.secondary:hover{background:var(--soft)}
.button.ghost{background:transparent;border-color:var(--line);color:var(--navy)}
.button.small{font-size:12px;min-height:40px;padding:10px 13px}
.form-note{font-size:11px;line-height:1.6;margin-top:14px;margin-bottom:0}
.steps{display:grid;grid-template-columns:repeat(3,1fr);border-block:1px solid var(--line);padding-block:26px;gap:24px}
.steps>div{padding-left:38px;position:relative}
.steps>div>span{position:absolute;left:0;top:0;font-size:13px;font-weight:600;color:var(--teal)}
.steps h3{font-size:15px;margin-bottom:5px}
.steps p{font-size:12px;margin:0}
.packages{padding-block:64px 55px}
.section-heading{display:flex;justify-content:space-between;gap:24px;align-items:end;margin-bottom:26px}
.section-heading .eyebrow{margin-bottom:14px}
.section-heading h2{margin-bottom:0}
.section-heading>p{font-size:13px;margin-bottom:2px}
.price-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.price-card{border:1px solid var(--line);border-radius:12px;background:#fff;padding:25px}
.price-card.featured{border-color:var(--teal);box-shadow:0 0 0 1px var(--teal)}
.price-card .section-top{font-size:14px;font-weight:600;margin-bottom:20px}
.price-card h3{font-size:42px;letter-spacing:-1.5px;font-weight:650;margin:0}
.price-card h3 span{font-size:26px;font-weight:500}
.price-card>p{font-size:12px;margin-top:4px}
.price-volume{border-top:1px solid var(--line);padding-top:18px;margin-block:20px;display:flex;flex-direction:column}
.price-volume strong{font-size:14px;font-weight:600}
.price-volume span{font-size:11px;color:var(--muted);margin-top:4px}
.pricing-note{padding-top:21px;font-size:12px}
.pricing-note p{max-width:800px}
.pricing-note summary{font-weight:600}
.inline-form{display:flex;gap:12px;align-items:center;flex-wrap:wrap;margin-top:16px}
.inline-form input:not([type=hidden]){width:90px;margin:0}
.inline-form label{margin:0}
.faq{display:grid;grid-template-columns:1fr 1.7fr;gap:55px;border-top:1px solid var(--line);padding-block:50px 64px}
.faq details{padding:15px 0;border-bottom:1px solid var(--line)}
summary{cursor:pointer;font-size:14px;font-weight:600}
.faq details p{font-size:13px;margin-block:12px 0}
.faq .eyebrow{margin-bottom:14px}
footer{padding-block:28px;border-top:1px solid var(--line);display:flex;justify-content:space-between;gap:20px;font-size:11px;color:var(--muted)}
.page-heading{display:flex;align-items:center;justify-content:space-between;gap:20px;padding-block:45px 28px}
.page-heading h1{font-size:42px;margin-bottom:10px}
.page-heading .eyebrow{margin-bottom:12px}
.page-heading p{font-size:14px;margin-bottom:0}
.workspace-summary{background:var(--navy);color:white;display:flex;align-items:center;gap:24px;border-radius:12px;padding:25px 28px;margin-bottom:25px}
.workspace-summary>div{display:flex;flex-direction:column;flex:1}
.workspace-summary span{font-size:12px;color:#c0cdd5}
.workspace-summary strong{font-size:35px;line-height:1.4}
.workspace-summary small{font-size:16px;font-weight:400}
.workspace-summary .ghost{color:#fff;border-color:#627681}
.notice{padding:14px 16px;background:#f7f0da;color:#6d571e;border:1px solid #e9dfbd;border-radius:8px;font-size:13px;margin-block:18px}
.notice.success{background:var(--soft);color:var(--teal);border-color:#c4dacc}
.file-list,.invoice-list{margin-block:34px 45px}
.file-list h2,.invoice-list h2{font-size:22px}
.muted{color:var(--muted);font-weight:400}
.file-row{display:flex;align-items:center;gap:20px;padding-block:23px;border-bottom:1px solid var(--line)}
.file-mark{display:grid;place-items:center;min-width:56px;height:65px;background:var(--soft);border:1px solid var(--line);border-radius:7px;font-size:11px;font-weight:700;color:var(--teal)}
.file-main{flex:1;min-width:0}
.file-main h3{font-size:16px;overflow-wrap:anywhere}
.file-main p{font-size:12px;margin-bottom:8px}
.file-actions{display:flex;flex-direction:column;gap:8px}
.status{display:inline-block;padding:5px 9px;background:var(--soft);color:var(--teal);border-radius:5px;font-size:11px}
.job-line{font-size:12px;display:flex;flex-wrap:wrap;gap:12px;margin-top:8px}
.empty{text-align:center;border:1px dashed #c6d3c9;border-radius:12px;padding:45px 20px}
.empty-icon{font-size:32px;color:var(--teal)}
.empty p{font-size:13px}
.invoice-row{display:flex;align-items:center;gap:24px;padding-block:17px;border-bottom:1px solid var(--line);font-size:14px}
.invoice-row>div{flex:1;min-width:0}
.invoice-row strong{font-weight:600;overflow-wrap:anywhere}
.invoice-row small{display:block;font-size:11px;color:var(--muted);margin-top:4px}
.invoice-row>a{font-size:12px;white-space:nowrap}
.narrow{max-width:520px;margin:65px auto 100px;padding:30px;background:white;border:1px solid var(--line);border-radius:16px}
.narrow h1{font-size:34px;letter-spacing:-1px}
.narrow p{font-size:14px}
.back-links{display:flex;gap:25px;flex-wrap:wrap;margin-top:25px;font-size:13px}
.checkout-grid{display:grid;grid-template-columns:1fr 1fr;gap:80px;padding-block:65px 100px}
.checkout-intro h1{font-size:52px}
.payment-steps{padding-left:22px;font-size:14px;color:var(--muted);margin-block:30px}
.payment-steps li{padding:7px}
.checkout-intro>a{font-size:13px}
.payment-card h2{font-size:24px;margin-top:20px;overflow-wrap:anywhere}
.order-detail{display:flex;flex-direction:column;gap:5px;border-block:1px solid var(--line);padding-block:20px}
.order-detail span,.order-detail small{color:var(--muted);font-size:12px}
.order-detail strong{font-size:21px}
.total{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-block:22px}
.total>span{font-size:14px}
.total strong{font-size:34px;letter-spacing:-1px}
.admin-grid{display:grid;grid-template-columns:1.1fr 1fr;gap:25px}
.panel h2{font-size:24px;margin-bottom:25px}
.setup{background:#edf3ee}
.setup p{font-size:13px;margin-top:20px}
.setup dl{font-size:12px}
.setup dt{font-weight:650;margin-top:16px}
.setup dd{margin:5px 0 0;overflow-wrap:anywhere;color:var(--muted)}
.setup a{font-size:12px}
.price-preview{font-size:22px;color:var(--teal);font-weight:600}
.copy-value{font-size:12px!important}
.toast{position:fixed;bottom:30px;left:50%;transform:translateX(-50%);padding:14px 22px;background:var(--navy);color:#fff;border-radius:10px;box-shadow:0 5px 25px #0002;z-index:5;font-size:14px}
.skip{position:absolute;top:-100px;left:20px}
.skip:focus{top:10px;background:white;z-index:10;padding:10px}
[hidden]{display:none!important}

@media(min-width:1500px){.hero{padding-block:80px 65px}
.hero h1{font-size:68px}
}

@media(max-width:900px){.header,main,footer{padding-inline:24px}
.hero{gap:28px}
.hero h1{font-size:48px}
.hero .lead{font-size:16px}
.upload-card{padding:20px}
.section-heading{display:block}
.section-heading>p{margin-top:15px}
.price-card{padding:20px}
.price-card h3{font-size:36px}
.price-card .tag{display:none}
.checkout-grid{gap:35px}
.workspace-summary{flex-wrap:wrap}
.workspace-summary>div{min-width:200px}
.workspace-summary form{flex-basis:100%}
}

@media(max-width:640px){.header,main,footer{padding-inline:20px}
.header{height:82px;gap:12px}
.brand{font-size:15px;gap:8px}
.brand img{width:34px;height:34px}
.brand-sub{font-size:10px}
.header nav{gap:14px;font-size:12px}
.header nav>a:first-child,.header nav>a:nth-child(2),.balance-pill{display:none}
.preview-bar{font-size:10px;padding:8px 20px}
.preview-bar span{margin:0 3px}
.hero{grid-template-columns:1fr;padding-block:34px;gap:28px}
.hero h1{font-size:46px;letter-spacing:-2px;margin-bottom:20px}
.hero .lead{font-size:16px}
.hero .eyebrow{font-size:10px;margin-bottom:16px}
.mini-sample{margin-top:22px;padding-top:20px}
.upload-card{padding:21px}
.steps{grid-template-columns:1fr;gap:22px;padding-block:25px}
.steps p{font-size:13px}
.steps h3{font-size:16px}
.packages{padding-block:38px}
.section-heading h2{font-size:28px}
.price-grid{grid-template-columns:1fr}
.price-card{padding:24px}
.price-card .tag{display:inline}
.price-card h3{font-size:42px}
.price-volume{margin-block:15px}
.faq{grid-template-columns:1fr;gap:6px;padding-block:30px}
.faq h2 br{display:none}
.faq h2{font-size:27px}
.faq details p{font-size:14px}
footer{flex-wrap:wrap;gap:12px;font-size:11px}
.page-heading{padding-top:30px;align-items:flex-start;flex-direction:column}
.page-heading h1{font-size:36px}
.workspace-summary{padding:22px;gap:18px}
.workspace-summary .button{width:100%}
.workspace-summary form{width:100%}
.file-row{flex-wrap:wrap;gap:14px}
.file-actions{flex-basis:100%;flex-direction:row}
.file-actions .button{flex:1}
.invoice-row{flex-wrap:wrap;gap:12px}
.invoice-row>div{flex-basis:100%}
.checkout-grid{grid-template-columns:1fr;gap:26px;padding-block:35px 50px}
.checkout-intro h1{font-size:42px}
.checkout-intro .lead{font-size:16px}
.payment-steps{margin-block:20px}
.payment-card{padding:24px}
.admin-grid{grid-template-columns:1fr}
.panel{padding:22px}
.narrow{padding:24px;margin-block:35px 55px}
.narrow h1{font-size:31px}
.toast{max-width:90%;width:max-content}
.section-heading .eyebrow{font-size:10px}
}

@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}
*{transition:none!important}
}

.hero em{white-space:nowrap}

