:root{--bg:#f7f9fc;--card:#fff;--text:#172033;--muted:#667085;--line:#e6eaf0;--blue:#2563eb;--blue2:#1d4ed8;--danger:#b42318}*{box-sizing:border-box}body{margin:0;font:15px/1.55 system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;background:var(--bg);color:var(--text)}a{color:var(--blue);text-decoration:none}.topbar{height:68px;background:#fff;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;padding:0 max(24px,calc((100vw - 1180px)/2));position:sticky;top:0;z-index:20}.brand{font-weight:800;color:var(--text);font-size:18px}.brand span{color:var(--blue)}nav{display:flex;align-items:center;gap:18px}.page{max-width:1180px;margin:0 auto;padding:42px 24px 70px}.hero{min-height:65vh;display:grid;grid-template-columns:1.2fr .8fr;align-items:center;gap:48px}.hero h1,.pagehead h1,.authcard h1{font-size:clamp(34px,5vw,60px);line-height:1.05;margin:12px 0 18px}.authcard h1{font-size:32px}.hero p,.pagehead p{font-size:18px;color:var(--muted)}.eyebrow{font-weight:800;font-size:12px;letter-spacing:.12em;color:var(--blue)}.actions{display:flex;gap:12px;margin-top:24px}.btn{display:inline-flex;align-items:center;justify-content:center;background:var(--blue);color:#fff;border:0;border-radius:10px;padding:12px 18px;font-weight:700;cursor:pointer}.btn:hover{background:var(--blue2)}.btn.secondary{background:#fff;color:var(--text);border:1px solid var(--line)}.btn.small{padding:8px 12px}.btn.full{width:100%}.codecard,.card,.stat{background:var(--card);border:1px solid var(--line);border-radius:16px;box-shadow:0 10px 30px rgba(16,24,40,.05)}.codecard{padding:26px}.codecard code{display:block;padding:16px;border-radius:10px;background:#0f172a;color:#dbeafe;overflow:auto}.authwrap{min-height:65vh;display:flex;align-items:center;justify-content:center}.authcard{width:min(480px,100%);padding:30px}.authcard p{color:var(--muted)}label{display:block;font-weight:700;margin:15px 0}input{width:100%;margin-top:7px;border:1px solid #cfd5df;border-radius:9px;padding:12px 13px;font:inherit;outline:none;background:#fff}input:focus{border-color:var(--blue);box-shadow:0 0 0 3px rgba(37,99,235,.12)}.alert{padding:12px 14px;border-radius:10px;margin:15px 0}.alert.error{background:#fef3f2;color:var(--danger);border:1px solid #fecdca}.muted{color:var(--muted)}.pagehead{display:flex;align-items:flex-start;justify-content:space-between;gap:30px;margin-bottom:30px}.pagehead h1{font-size:42px}.badge{background:#eef4ff;color:#3538cd;padding:7px 11px;border-radius:999px;font-weight:700}.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin:25px 0}.stat{padding:22px}.stat strong{display:block;font-size:30px}.stat span{color:var(--muted)}.card{padding:24px}.inline{display:inline}.linkbtn{border:0;background:transparent;font:inherit;color:var(--blue);cursor:pointer;padding:0}.footer{text-align:center;color:var(--muted);padding:28px}.footer:before{content:"";display:block;border-top:1px solid var(--line);margin-bottom:24px}@media(max-width:760px){.topbar{padding:0 16px}.topbar nav>a:not(.btn){display:none}.page{padding:28px 16px 55px}.hero{grid-template-columns:1fr;gap:24px}.stats{grid-template-columns:1fr 1fr}.pagehead{display:block}.badge{display:inline-block;margin-top:8px}}@media(max-width:450px){.stats{grid-template-columns:1fr}.brand{font-size:15px}}
/* Module 2 — customer dashboard and website management */
select,textarea{width:100%;margin-top:7px;border:1px solid #cfd5df;border-radius:9px;padding:12px 13px;font:inherit;outline:none;background:#fff;color:var(--text)}select:focus,textarea:focus{border-color:var(--blue);box-shadow:0 0 0 3px rgba(37,99,235,.12)}textarea{resize:vertical;min-height:120px}.alert.success{background:#ecfdf3;color:#027a48;border:1px solid #abefc6}.alert ul{margin:8px 0 0;padding-left:20px}.head-actions{display:flex;gap:10px;align-items:center;flex-wrap:wrap}.stats-6{grid-template-columns:repeat(6,1fr)}.stat small{display:block;color:var(--muted);margin-top:4px}.progress,.usagebar{height:8px;border-radius:999px;background:#edf0f5;overflow:hidden;margin-top:10px}.progress i,.usagebar div{display:block;height:100%;background:var(--blue);border-radius:inherit}.grid-2{display:grid;grid-template-columns:1.35fr .65fr;gap:18px}.cardhead{display:flex;justify-content:space-between;align-items:flex-start;gap:20px;margin-bottom:18px}.cardhead h2{margin:0;font-size:20px}.cardhead p{margin:4px 0 0;color:var(--muted)}.site-list{border-top:1px solid var(--line)}.site-row{display:flex;gap:12px;align-items:center;padding:15px 2px;border-bottom:1px solid var(--line);color:var(--text)}.site-row:hover{background:#fafcff}.site-icon{width:40px;height:40px;display:grid;place-items:center;border-radius:10px;background:#eef4ff}.grow{flex:1;min-width:0}.grow strong,.grow small{display:block}.grow small{color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.chev{font-size:24px;color:#98a2b3}.status{display:inline-flex;align-items:center;border-radius:999px;padding:5px 9px;font-size:12px;font-weight:800;background:#f2f4f7;color:#475467}.status.active{background:#ecfdf3;color:#027a48}.status.inactive,.status.suspended{background:#f2f4f7;color:#667085}.plan-list>div,.summary-row{display:flex;justify-content:space-between;gap:14px;padding:11px 0;border-bottom:1px solid var(--line)}.smalltext{font-size:13px}.empty{text-align:center;padding:48px 20px}.empty-icon{font-size:38px}.empty h3{margin:10px 0 5px}.empty p{color:var(--muted);margin:0 0 18px}.plan-strip{display:flex;gap:24px;justify-content:space-between;background:#eef4ff;border:1px solid #d9e4ff;border-radius:12px;padding:13px 16px;margin-bottom:18px;color:#344054}.tablecard{padding:0;overflow:hidden}.tablewrap{overflow:auto}table{width:100%;border-collapse:collapse}th,td{text-align:left;padding:15px 18px;border-bottom:1px solid var(--line);white-space:nowrap}th{background:#fafbfc;color:#667085;font-size:12px;text-transform:uppercase;letter-spacing:.04em}.table-sub{display:block;color:var(--muted);font-weight:400;max-width:380px;overflow:hidden;text-overflow:ellipsis}.right{text-align:right}.langpill{display:inline-flex;padding:5px 9px;background:#eef4ff;color:#3538cd;border-radius:999px;font-size:12px;font-weight:800}.settings-layout{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:20px}.settings-main{display:grid;gap:20px}.form-card{padding:24px}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}.hint{display:block;color:var(--muted);font-weight:400;margin-top:6px}.language-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.language-choice{display:flex;align-items:center;gap:10px;margin:0;padding:13px;border:1px solid var(--line);border-radius:11px;cursor:pointer}.language-choice input{width:auto;margin:0}.language-choice span{display:block}.language-choice b,.language-choice small{display:block}.language-choice small{color:var(--muted)}.language-choice.disabled{opacity:.45;cursor:not-allowed}.counter{font-weight:800;color:var(--blue);white-space:nowrap}.sticky-card{position:sticky;top:88px}.sticky-card h3{margin-top:0}.sticky-card .btn{margin-top:18px}.key-banner{display:grid;grid-template-columns:1fr 1.2fr;gap:24px;background:#101828;color:#fff;border-radius:16px;padding:24px;margin-bottom:20px}.key-banner h2{margin:5px 0}.key-banner p{color:#b6c1d4;margin-bottom:0}.key-copy{display:flex;gap:10px;align-items:center}.key-copy code{background:#1d2939;padding:13px;border-radius:9px;overflow:auto;flex:1;color:#dbeafe}.detail-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px}.details{margin:0}.details>div{display:flex;justify-content:space-between;gap:16px;padding:12px 0;border-bottom:1px solid var(--line)}.details dt{color:var(--muted)}.details dd{margin:0;text-align:right}.pill-list{display:flex;gap:8px;flex-wrap:wrap}.domain-list{display:grid;gap:10px}.domain-list>div{display:flex;gap:10px;align-items:center;padding:11px 0;border-bottom:1px solid var(--line)}.badge.subtle{margin-left:auto;background:#f2f4f7;color:#475467}.install-preview pre{margin:0;background:#0f172a;color:#dbeafe;padding:16px;border-radius:10px;overflow:auto}.install-preview code{font-family:ui-monospace,SFMono-Regular,Menlo,monospace}
@media(max-width:1100px){.stats-6{grid-template-columns:repeat(3,1fr)}.language-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:800px){.grid-2,.detail-grid,.settings-layout,.key-banner{grid-template-columns:1fr}.settings-side{order:-1}.sticky-card{position:static}.plan-strip{flex-direction:column;gap:5px}.form-grid{grid-template-columns:1fr}.pagehead .head-actions{margin-top:12px}.key-copy{flex-direction:column;align-items:stretch}.stats-6{grid-template-columns:repeat(2,1fr)}}
@media(max-width:520px){.language-grid,.stats-6{grid-template-columns:1fr}.pagehead>.btn{margin-top:12px}.topbar nav{gap:10px}.topbar nav>a[href*="websites"]{display:none}}

/* Module 3: API key management */
.copy-row{display:flex;gap:12px;align-items:center;flex-wrap:wrap}.copy-row code{flex:1;min-width:260px;overflow-wrap:anywhere;padding:12px;border:1px solid var(--border,#dfe5ee);border-radius:10px;background:#f7f9fc}.key-reveal{border:1px solid #b8ddc8}.table-wrap{overflow-x:auto}.table-wrap table{width:100%;border-collapse:collapse}.table-wrap th,.table-wrap td{text-align:left;padding:12px;border-bottom:1px solid #e7ebf0;white-space:nowrap}.btn.danger{border-color:#d64b4b}.page-head,.actions{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap}
/* Module 7 — advanced translation controls */
.check-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:10px;margin:14px 0 20px}.checkrow{display:flex;align-items:center;gap:10px;margin:0;padding:11px 12px;border:1px solid var(--line);border-radius:10px;font-weight:600}.checkrow input{width:auto;margin:0}.checkrow.compact{align-self:end;margin-bottom:0}.glossary-card{margin-top:20px}.glossary-form{display:grid;grid-template-columns:1.2fr .8fr 1.2fr auto auto;gap:12px;align-items:end;margin-bottom:20px}.glossary-form label{margin:0}.danger-text{color:#b42318}@media(max-width:900px){.glossary-form{grid-template-columns:1fr 1fr}.check-grid{grid-template-columns:1fr}}@media(max-width:600px){.glossary-form{grid-template-columns:1fr}}

.alert.warning{background:#fff8db;border:1px solid #eed889;color:#5d4a00;padding:12px 14px;border-radius:10px;margin:0 0 16px}

/* Module 9 admin */
.admin-shell{display:grid;grid-template-columns:220px minmax(0,1fr);gap:24px;align-items:start}.admin-nav{position:sticky;top:86px;background:#101828;color:#fff;border-radius:18px;padding:18px;display:flex;flex-direction:column;gap:5px}.admin-nav strong{font-size:18px;margin:0 8px 8px}.admin-nav a{color:#d0d5dd;text-decoration:none;padding:9px 10px;border-radius:9px}.admin-nav a:hover{background:#1d2939;color:#fff}.admin-main{min-width:0}.admin-heading{display:flex;justify-content:space-between;gap:20px;align-items:flex-start}.table-wrap{overflow:auto;background:#fff;border:1px solid #eaecf0;border-radius:16px;margin:16px 0}.table-wrap table{width:100%;border-collapse:collapse;min-width:850px}.table-wrap th,.table-wrap td{text-align:left;padding:12px 14px;border-bottom:1px solid #eaecf0;vertical-align:top;font-size:14px}.table-wrap th{background:#f9fafb;color:#475467;white-space:nowrap}.compact-form{display:flex;flex-wrap:wrap;gap:8px;align-items:center}.compact-form input,.compact-form select{width:auto;min-width:110px;margin:0}.admin-form{margin:16px 0}.admin-plan-title{display:flex;justify-content:space-between;align-items:center}.form-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}.form-grid label{display:flex;flex-direction:column;gap:6px}.form-grid textarea{width:100%;resize:vertical}.badge{display:inline-flex;padding:4px 8px;border-radius:99px;background:#f2f4f7;font-size:12px}.btn.danger,.danger{background:#b42318;color:#fff}.alert.success{background:#ecfdf3;color:#027a48;border-color:#abefc6}.alert.danger{background:#fef3f2;color:#b42318;border-color:#fecdca}@media(max-width:900px){.admin-shell{grid-template-columns:1fr}.admin-nav{position:static;display:grid;grid-template-columns:repeat(2,1fr)}.form-grid{grid-template-columns:1fr}.admin-nav strong{grid-column:1/-1}}

/* Module 10 — marketing, docs, installation and production polish */
.landing-hero{display:grid;grid-template-columns:1.1fr .9fr;gap:48px;align-items:center;padding:70px 0 60px}.landing-hero h1{font-size:clamp(44px,6vw,72px);line-height:1.02;letter-spacing:-.045em;margin:14px 0 20px}.lead{font-size:19px;color:var(--muted);max-width:720px}.trust-row{display:flex;gap:16px;flex-wrap:wrap;margin-top:24px;color:#344054;font-weight:650}.demo-card{padding:26px;border-radius:22px;background:linear-gradient(145deg,#0f172a,#172554);color:#fff;min-height:330px;display:flex;flex-direction:column;justify-content:center}.demo-toolbar{display:flex;justify-content:space-between;align-items:center;gap:15px;margin-bottom:45px;color:#bfdbfe}.demo-toolbar select{width:auto;margin:0;background:#fff}.demo-card h3{font-size:32px;margin:0 0 12px}.demo-card p{color:#dbeafe;font-size:17px}.landing-section{padding:56px 0}.section-head{text-align:center;max-width:760px;margin:0 auto 30px}.section-head h2{font-size:38px;margin:8px 0}.feature-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.feature-grid .card h3{margin:8px 0}.feature-grid .card>b{display:grid;place-items:center;width:34px;height:34px;border-radius:9px;background:#eef4ff;color:var(--blue)}.pricing-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:16px}.price-card{background:#fff;border:1px solid var(--line);border-radius:18px;padding:24px}.price{font-size:38px;font-weight:850;margin:14px 0}.price small{font-size:13px;color:var(--muted);font-weight:600}.price-card ul{padding-left:18px;color:#475467;min-height:150px}.block{display:block;text-align:center}.center{text-align:center}.cta-band{margin:60px 0 20px;padding:34px;border-radius:22px;background:#101828;color:#fff;display:flex;align-items:center;justify-content:space-between;gap:24px}.cta-band h2{margin:5px 0}.docs-layout{display:grid;grid-template-columns:230px minmax(0,1fr);gap:28px}.docs-nav{position:sticky;top:88px;align-self:start;background:#fff;border:1px solid var(--line);border-radius:14px;padding:12px;display:flex;flex-direction:column}.docs-nav a{padding:9px;border-radius:8px;color:#475467}.docs-nav a:hover{background:#f2f4f7}.docs-content{max-width:850px}.docs-content.wide{max-width:none}.docs-content section{padding:0 0 35px;margin-bottom:35px;border-bottom:1px solid var(--line)}.docs-content h2{font-size:27px}.codebox{position:relative}.codebox button{position:absolute;right:9px;top:9px;z-index:1;border:0;border-radius:7px;padding:6px 9px;cursor:pointer}.codebox pre,.docs-content>pre{background:#0f172a;color:#dbeafe;padding:20px;border-radius:12px;overflow:auto}.endpoint-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:12px;margin:18px 0 30px}.endpoint-grid .card{display:grid;gap:8px}.endpoint-grid b{color:var(--blue)}.legal{max-width:800px;margin:20px auto}.legal h1{font-size:44px}.legal h2{margin-top:32px}.install-status{display:flex;align-items:center;gap:16px;padding:22px;border:1px solid #fedf89;background:#fffaeb;border-radius:16px;margin-bottom:22px}.install-status.detected{border-color:#abefc6;background:#ecfdf3}.install-status h2{margin:0}.install-status p{margin:4px 0 0}.status-dot{width:15px;height:15px;border-radius:50%;background:#f79009;box-shadow:0 0 0 6px rgba(247,144,9,.13)}.detected .status-dot{background:#12b76a;box-shadow:0 0 0 6px rgba(18,183,106,.13)}.install-steps{display:grid;gap:16px}.install-steps>article>span{color:var(--blue);font-weight:850;font-size:12px}.footer-links{display:flex;justify-content:center;gap:18px;flex-wrap:wrap;margin-bottom:12px}.footer-links a{color:var(--muted)}
@media(max-width:900px){.landing-hero{grid-template-columns:1fr}.feature-grid{grid-template-columns:1fr 1fr}.docs-layout{grid-template-columns:1fr}.docs-nav{position:static;display:grid;grid-template-columns:1fr 1fr}.cta-band{align-items:flex-start;flex-direction:column}}
@media(max-width:600px){.landing-hero{padding-top:35px}.landing-hero h1{font-size:42px}.feature-grid,.endpoint-grid{grid-template-columns:1fr}.docs-nav{grid-template-columns:1fr}.section-head h2{font-size:31px}.legal h1{font-size:36px}.trust-row{display:grid}.pricing-grid{grid-template-columns:1fr}.demo-card{min-height:280px}}
