:root { --navy:#083b75; --blue:#1265d8; --cyan:#0cb8ad; --ink:#10253f; --muted:#5c7088; --line:#dce7f1; }
/* Demo access: scoped modal; no changes to shared branding or consent UI. */
.demo-access-dialog { width:min(460px,calc(100vw - 32px)); max-height:90dvh; overflow:auto; padding:28px; border:1px solid #dce7f1; border-radius:18px; color:#10253f; background:#fff; box-shadow:0 24px 80px #10253f40; }
.demo-access-dialog::backdrop { background:#101838bb; }
.demo-access-dialog h2 { margin:0 28px 12px 0; font-size:24px; line-height:1.25; }
.demo-access-dialog p { font-size:14px; line-height:1.6; color:#5c7088; }
.demo-access-close { position:absolute; top:10px; right:12px; min-width:40px; min-height:40px; border:0; border-radius:8px; background:#edf2ff; color:#10253f; cursor:pointer; font-size:28px; }
.demo-access-form { display:grid; gap:10px; }
.demo-access-form [hidden],.demo-access-form.is-complete label,.demo-access-form.is-complete input,.demo-access-form.is-complete .demo-access-privacy { display:none; }
.demo-access-form label { font-size:14px; font-weight:650; }
.demo-access-form input { min-width:0; width:100%; min-height:44px; padding:10px 12px; border:1px solid #c5d3e5; border-radius:8px; font:inherit; background:#fff; color:#10253f; }
.demo-access-form input:focus-visible,.demo-access-close:focus-visible { outline:3px solid #9cb8ff; outline-offset:2px; }
.demo-access-form .button { width:100%; cursor:pointer; font:inherit; }
.demo-access-form .button:disabled,.demo-access-close:disabled { opacity:.6; cursor:wait; }
.demo-access-form .demo-access-privacy { font-size:12px; margin:4px 0; }
.demo-access-privacy a { text-decoration:underline; color:#1265d8; }
.demo-access-form .demo-access-status { margin:0; color:#10253f; }
.demo-access-trap { position:absolute; left:-10000px; width:1px; height:1px; overflow:hidden; }
.header-actions .login-link[data-demo-access] { white-space:normal; text-align:center; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
@font-face { font-family:"Inter"; src:url("/fonts/inter-variable.ttf") format("truetype"); font-style:normal; font-weight:100 900; font-display:swap; }
body { margin:0; color:var(--ink); background:#fff; font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif; }
a { color:inherit; text-decoration:none; }
.site-header { width:min(1180px,calc(100% - 40px)); height:84px; margin:0 auto; display:grid; grid-template-columns:1fr auto 1fr; align-items:center; gap:28px; position:relative; z-index:10; }
.brand { display:inline-flex; width:176px; align-items:center; }
.brand img { width:100%; height:58px; object-fit:contain; object-position:left center; }
.site-header nav { display:flex; gap:34px; color:#40566f; font-size:14px; font-weight:650; }
.site-header nav a:hover { color:var(--blue); }
.site-header>.button { justify-self:end; }
.button { min-height:50px; display:inline-flex; align-items:center; justify-content:center; gap:16px; padding:0 23px; border-radius:14px; color:white; font-size:15px; font-weight:750; background:linear-gradient(120deg,#0b59c7,#0db5ac); box-shadow:0 14px 30px rgba(5,101,183,.2); transition:transform .2s ease,box-shadow .2s ease; }
.button:hover { transform:translateY(-2px); box-shadow:0 18px 34px rgba(5,101,183,.28); }
.button-small { min-height:42px; border-radius:12px; padding-inline:18px; font-size:14px; }
.hero { min-height:calc(100vh - 84px); overflow:hidden; position:relative; display:grid; grid-template-columns:minmax(0,.88fr) minmax(520px,1.12fr); gap:54px; align-items:center; padding:48px max(34px,calc((100vw - 1180px)/2)) 90px; background:radial-gradient(circle at 75% 35%,rgba(18,184,174,.10),transparent 34%),radial-gradient(circle at 10% 90%,rgba(18,101,216,.08),transparent 32%),linear-gradient(180deg,#fff 0%,#f8fbff 100%); }
.hero:before { content:""; position:absolute; inset:0; opacity:.35; pointer-events:none; background-image:linear-gradient(rgba(10,67,128,.045) 1px,transparent 1px),linear-gradient(90deg,rgba(10,67,128,.045) 1px,transparent 1px); background-size:54px 54px; mask-image:linear-gradient(to bottom,black,transparent 80%); }
.hero-copy { position:relative; z-index:2; padding-bottom:24px; }
.eyebrow { display:inline-flex; align-items:center; gap:9px; margin:0 0 24px; color:#087b83; font-size:12px; font-weight:800; letter-spacing:.12em; text-transform:uppercase; }
.eyebrow span { width:22px; height:2px; background:var(--cyan); }
h1 { max-width:650px; margin:0; color:#0e2949; font-size:clamp(54px,5.5vw,82px); line-height:.97; letter-spacing:-.055em; font-weight:820; }
h1 em { font-style:normal; color:transparent; background:linear-gradient(100deg,#0b55b5,#0aaeaa); background-clip:text; -webkit-background-clip:text; }
.hero-lead { max-width:590px; margin:28px 0 0; color:var(--muted); font-size:18px; line-height:1.72; }
.hero-actions { display:flex; align-items:center; gap:28px; margin-top:34px; }
.text-link { color:#173b63; font-weight:750; font-size:15px; }
.text-link span { margin-left:7px; color:var(--cyan); }
.trust-row { display:flex; flex-wrap:wrap; gap:18px 26px; margin-top:32px; color:#546b82; font-size:12px; font-weight:700; }
.product-stage { min-height:610px; position:relative; display:grid; place-items:center; perspective:1500px; }
.stage-orbit { position:absolute; border:1px solid rgba(14,126,171,.14); border-radius:50%; transform:rotate(-15deg); }
.orbit-one { width:580px; height:580px; }
.orbit-two { width:450px; height:450px; border-style:dashed; }
.app-window { width:min(720px,100%); position:relative; z-index:2; overflow:hidden; border:1px solid rgba(40,85,125,.18); border-radius:22px; background:white; box-shadow:0 40px 90px rgba(20,67,108,.22); transform:rotateY(-5deg) rotateX(2deg); }
.app-topbar { height:46px; display:grid; grid-template-columns:1fr auto 1fr; align-items:center; padding:0 17px; border-bottom:1px solid #e8eef4; background:#fbfdff; color:#8090a1; font-size:10px; }
.window-dots { display:flex; gap:6px; }
.window-dots span { width:7px; height:7px; border-radius:50%; background:#dbe4ed; }
.secure { justify-self:end; color:#36a18d; }
.app-shell { min-height:430px; display:grid; grid-template-columns:68px 1fr; }
.app-shell aside { display:flex; flex-direction:column; align-items:center; gap:19px; padding:15px 12px; border-right:1px solid #eaf0f5; background:#fbfdff; }
.app-shell aside img { width:40px; height:40px; object-fit:contain; margin-bottom:5px; }
.app-shell aside i { width:27px; height:27px; border-radius:8px; background:#e8eef5; }
.app-shell aside i.active { background:linear-gradient(135deg,#146ad5,#0ab3ad); }
.dashboard-preview { padding:30px 30px 34px; background:linear-gradient(135deg,#f6fbff,#fbfaff); }
.dashboard-preview>p { margin:0 0 4px; color:#8799aa; font-size:10px; }
.dashboard-preview h2 { margin:0; color:#153858; font-size:22px; letter-spacing:-.02em; }
.metric-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:11px; margin:24px 0 16px; }
.metric-grid article { min-height:98px; display:flex; flex-direction:column; padding:15px; border:1px solid #e4ebf2; border-radius:13px; background:rgba(255,255,255,.9); box-shadow:0 8px 18px rgba(34,73,109,.055); }
.metric-grid span,.metric-grid small { color:#7d8fa1; font-size:9px; }
.metric-grid strong { margin:7px 0 3px; color:#0a5aa4; font-size:23px; line-height:1; }
.schedule-card { padding:17px; border:1px solid #e3eaf1; border-radius:14px; background:white; }
.schedule-card>div { display:flex; justify-content:space-between; color:#183a5b; font-size:11px; }
.schedule-card>div span { color:#8292a2; }
.schedule-card ul { padding:0; margin:12px 0 0; list-style:none; }
.schedule-card li { display:grid; grid-template-columns:42px 1fr auto; gap:9px; align-items:center; padding:10px 0; border-top:1px solid #edf2f6; font-size:10px; }
.schedule-card li>b { color:#62778b; }
.schedule-card li>span { display:flex; flex-direction:column; gap:2px; }
.schedule-card li small { color:#8798a8; }
.schedule-card em { padding:4px 7px; border-radius:999px; color:#697b0b; background:#eff8d8; font-size:8px; font-style:normal; font-weight:800; }
.schedule-card em.blue { color:#087679; background:#dcf7f4; }
.schedule-card em.purple { color:#5842ae; background:#eee9ff; }
.floating-card { position:absolute; z-index:4; display:flex; align-items:center; gap:12px; border:1px solid rgba(19,87,139,.15); border-radius:13px; background:rgba(255,255,255,.94); box-shadow:0 18px 38px rgba(27,70,105,.16); backdrop-filter:blur(12px); }
.floating-top { top:78px; right:-12px; flex-direction:column; align-items:flex-start; padding:14px 22px; }
.floating-top span,.floating-bottom small { color:#7b8c9e; font-size:9px; }
.floating-top strong { color:#078f8c; font-size:17px; }
.floating-bottom { bottom:54px; left:-30px; padding:13px 17px; }
.floating-bottom div { display:flex; flex-direction:column; gap:3px; }
.floating-bottom strong { color:#24435e; font-size:10px; }
.check { width:28px; height:28px; display:grid; place-items:center; border-radius:50%; color:white; background:#0ca59f; font-size:13px; font-weight:900; }
@media(max-width:980px) { .site-header{grid-template-columns:1fr auto}.site-header nav{display:none}.hero{grid-template-columns:1fr;padding-top:76px}.hero-copy{text-align:center}.eyebrow,.hero-actions,.trust-row{justify-content:center}h1,.hero-lead{margin-inline:auto}.product-stage{min-height:540px} }
@media(max-width:620px) { .site-header{width:calc(100% - 28px);height:72px}.brand{width:142px}.brand img{height:48px}.site-header .button{min-height:38px;padding:0 13px;font-size:12px}.hero{padding:58px 18px 68px}h1{font-size:clamp(44px,13vw,62px)}.hero-lead{font-size:16px}.hero-actions{flex-direction:column;gap:18px}.hero-actions .button{width:100%}.trust-row{gap:12px 16px}.product-stage{min-height:390px}.app-window{transform:none}.app-shell{min-height:300px;grid-template-columns:50px 1fr}.app-shell aside{gap:10px;padding-inline:8px}.app-shell aside img{width:32px;height:32px}.app-shell aside i{width:22px;height:22px}.dashboard-preview{padding:18px 14px}.metric-grid{gap:6px}.metric-grid article{min-height:82px;padding:10px}.metric-grid strong{font-size:18px}.schedule-card li{grid-template-columns:36px 1fr}.schedule-card em{display:none}.floating-card,.stage-orbit{display:none} }
@media(prefers-reduced-motion:reduce) { html{scroll-behavior:auto}.button{transition:none} }

/* Shared site sections */
.section { width:min(1180px,calc(100% - 40px)); margin:0 auto; padding:118px 0; }
.site-header.solid { border-bottom:1px solid #e5edf4; }
.header-actions { justify-self:end; display:flex; align-items:center; gap:18px; }
.login-link { color:#36536f; font-size:13px; font-weight:750; }
.login-link:hover { color:var(--blue); }
.mobile-menu { display:none; position:relative; justify-self:end; }
.mobile-menu summary { list-style:none; cursor:pointer; padding:10px 13px; border:1px solid var(--line); border-radius:10px; font-size:12px; font-weight:800; }
.mobile-menu summary::-webkit-details-marker { display:none; }
.mobile-menu>div { min-width:190px; position:absolute; right:0; top:46px; display:flex; flex-direction:column; gap:2px; padding:10px; border:1px solid var(--line); border-radius:14px; background:white; box-shadow:0 20px 45px rgba(12,57,96,.16); }
.mobile-menu a { padding:10px 12px; border-radius:8px; font-size:13px; font-weight:700; }
.mobile-menu a:hover { background:#f0f7fd; color:var(--blue); }
.section-heading { margin-bottom:54px; }
.section-heading.narrow { max-width:800px; margin-inline:auto; text-align:center; }
.section-heading.narrow .eyebrow { justify-content:center; }
.section-heading h2,.workflow-copy h2,.isolation-copy h2,.demo-copy h2,.contact-copy h2,.help-panel h2,.legal-content h1 { margin:0; color:#102e4f; font-size:clamp(40px,4.4vw,62px); line-height:1.06; letter-spacing:-.045em; }
.section-heading h2 em,.workflow-copy h2 em,.isolation-copy h2 em,.demo-copy h2 em,.contact-copy h2 em,.help-panel h2 em,.legal-content h1 em { color:transparent; font-style:normal; background:linear-gradient(100deg,#0b56b7,#0aa9a4); background-clip:text; -webkit-background-clip:text; }
.section-heading>p:last-child { max-width:680px; margin:22px auto 0; color:var(--muted); font-size:17px; line-height:1.7; }
.split-heading { display:grid; grid-template-columns:1fr 420px; gap:80px; align-items:end; }
.split-heading>p { color:var(--muted); line-height:1.75; margin:0 0 7px; }
.signal-strip { min-height:126px; display:grid; grid-template-columns:repeat(4,1fr); border-top:1px solid #e4edf5; border-bottom:1px solid #e4edf5; background:#fbfdff; padding-inline:max(24px,calc((100vw - 1180px)/2)); }
.signal-strip div { display:flex; align-items:center; justify-content:center; gap:15px; border-right:1px solid #e4edf5; }
.signal-strip div:first-child { border-left:1px solid #e4edf5; }
.signal-strip strong { color:#0a5f9c; font-size:28px; letter-spacing:-.04em; }
.signal-strip span { color:#718296; font-size:11px; line-height:1.45; text-transform:uppercase; letter-spacing:.06em; }
.problem-section { padding-top:128px; }
.problem-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:22px; }
.problem-grid article { min-height:300px; position:relative; overflow:hidden; padding:36px; border:1px solid #dde8f1; border-radius:22px; background:white; box-shadow:0 16px 40px rgba(34,75,111,.07); }
.problem-grid article:after { content:""; width:150px; height:150px; position:absolute; right:-75px; bottom:-75px; border-radius:50%; background:linear-gradient(135deg,rgba(22,102,216,.12),rgba(11,184,174,.08)); }
.problem-number { display:inline-grid; place-items:center; width:42px; height:42px; border-radius:12px; color:#0a6f9f; background:#e9f8f7; font-size:11px; font-weight:850; }
.problem-grid h3,.module-card h3,.role-card h3 { margin:32px 0 12px; color:#183958; font-size:22px; letter-spacing:-.025em; }
.problem-grid p,.module-card p,.role-card p { color:#6b7e91; line-height:1.7; font-size:14px; }
.problem-grid b { display:block; margin-top:28px; color:#0a8e8a; font-size:12px; }
.modules-section { max-width:none; width:100%; padding-inline:max(20px,calc((100vw - 1180px)/2)); background:linear-gradient(180deg,#f7fbff,#fff); }
.module-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:18px; }
.module-card { min-height:345px; display:flex; flex-direction:column; padding:30px; border:1px solid #dfe9f1; border-radius:20px; background:white; transition:transform .2s ease,box-shadow .2s ease; }
.module-card:hover { transform:translateY(-5px); box-shadow:0 22px 50px rgba(25,72,112,.12); }
.module-code { color:#0aa49f; font-size:11px; font-weight:850; letter-spacing:.12em; }
.module-card h3 { margin-top:44px; }
.module-card p { flex:1; }
.module-card>div { display:flex; flex-wrap:wrap; gap:7px; margin:16px 0 22px; }
.module-card>div span { padding:6px 9px; border-radius:999px; color:#43617b; background:#f0f5fa; font-size:9px; font-weight:750; }
.module-card>a { color:#0c639e; font-size:12px; font-weight:800; }
.module-card>a b { margin-left:7px; color:#0aa49f; }
.workflow-section { background:radial-gradient(circle at 15% 20%,rgba(10,181,172,.18),transparent 28%),linear-gradient(130deg,#082b55,#064176 60%,#075b76); color:white; }
.workflow-inner { display:grid; grid-template-columns:.88fr 1.12fr; gap:100px; align-items:center; }
.eyebrow.light { color:#6ee5dc; }
.workflow-copy h2,.demo-copy h2,.contact-copy h2 { color:white; }
.workflow-copy h2 em,.demo-copy h2 em,.contact-copy h2 em { background:linear-gradient(90deg,#70e3dc,#9cc9ff); background-clip:text; -webkit-background-clip:text; }
.workflow-copy>p:not(.eyebrow),.demo-copy>p:not(.eyebrow),.contact-copy>p:not(.eyebrow) { color:#bdd0e3; font-size:16px; line-height:1.8; }
.button-light { color:#07446e; background:white; box-shadow:0 14px 30px rgba(0,0,0,.15); }
.workflow-copy .button { margin-top:24px; }
.workflow-list { padding:0; margin:0; list-style:none; }
.workflow-list li { display:grid; grid-template-columns:58px 1fr; gap:20px; padding:23px 0; border-bottom:1px solid rgba(255,255,255,.14); }
.workflow-list li>span { width:42px; height:42px; display:grid; place-items:center; border:1px solid rgba(104,228,220,.4); border-radius:50%; color:#79e4dd; font-size:10px; font-weight:850; }
.workflow-list strong { font-size:17px; }
.workflow-list p { margin:7px 0 0; color:#b5c9db; font-size:13px; line-height:1.55; }
.role-section { padding-bottom:130px; }
.role-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:16px; }
.role-card { padding:28px; border:1px solid #dfe8f0; border-radius:20px; background:#fff; }
.role-card>span { width:50px; height:50px; display:grid; place-items:center; border-radius:15px; color:white; background:linear-gradient(135deg,#0b61ca,#0dafaa); font-weight:850; }
.role-card.operator>span { background:linear-gradient(135deg,#1766a9,#514fc5); }
.role-card.staff>span { background:linear-gradient(135deg,#0a897f,#1ebaa7); }
.role-card.tech>span { background:linear-gradient(135deg,#6d49b5,#a14dcc); }
.role-card h3 { margin-top:28px; }
.role-card ul,.isolation-copy ul,.price-card ul { padding:0; margin:20px 0 0; list-style:none; }
.role-card li,.price-card li { padding:8px 0; color:#526d84; font-size:12px; border-top:1px solid #edf2f6; }
.role-card li:before,.price-card li:before { content:"✓"; margin-right:8px; color:#09a39e; font-weight:900; }
.isolation-section { background:#f2f8fd; border-block:1px solid #e0eaf3; }
.isolation-inner { display:grid; grid-template-columns:.8fr 1.2fr; gap:100px; align-items:center; }
.isolation-visual { min-height:430px; position:relative; display:grid; place-items:center; border:1px solid #d9e7f1; border-radius:32px; background:radial-gradient(circle at 50% 44%,rgba(9,177,168,.16),transparent 34%),white; box-shadow:0 24px 65px rgba(18,70,110,.1); }
.domain-pill { padding:17px 24px; border-radius:12px; color:white; background:linear-gradient(110deg,#0b5cc2,#09aaa4); font-size:16px; font-weight:850; box-shadow:0 14px 30px rgba(7,101,158,.22); }
.database-stack { position:absolute; top:235px; width:86px; height:75px; }
.database-stack span { display:block; height:24px; margin-top:-6px; border:2px solid #0b7397; border-radius:50%; background:#e8f8f7; }
.isolation-line { position:absolute; top:204px; width:1px; height:43px; background:#78c8d0; }
.isolation-visual small { position:absolute; bottom:45px; color:#75899c; font-size:11px; text-transform:uppercase; letter-spacing:.1em; }
.isolation-copy>p:not(.eyebrow) { color:#60758a; font-size:16px; line-height:1.75; }
.isolation-copy li { display:grid; grid-template-columns:150px 1fr; gap:15px; padding:16px 0; border-top:1px solid #dce7ef; }
.isolation-copy li b { color:#174364; font-size:13px; }
.isolation-copy li span { color:#708296; font-size:12px; line-height:1.5; }
.pricing-section { max-width:1320px; width:calc(100% - 40px); }
.pricing-grid { display:grid; grid-template-columns:repeat(5,1fr); gap:12px; align-items:start; }
.price-card { min-height:600px; position:relative; display:flex; flex-direction:column; padding:26px 22px; border:1px solid #dce6ef; border-radius:20px; background:white; box-shadow:0 12px 32px rgba(30,72,108,.06); }
.price-card.featured { border:2px solid #0a9f9a; box-shadow:0 22px 54px rgba(7,126,143,.15); transform:translateY(-12px); }
.popular { position:absolute; top:-14px; left:50%; transform:translateX(-50%); width:max-content; padding:7px 13px; border-radius:999px; color:white; background:#079a96; font-size:9px; font-weight:850; text-transform:uppercase; letter-spacing:.05em; }
.price-card h3 { margin:10px 0 24px; font-size:19px; }
.price { display:flex; align-items:flex-start; color:#0a4475; }
.price>strong { font-size:48px; line-height:1; letter-spacing:-.06em; }
.price>span { display:flex; flex-direction:column; margin:5px 0 0 5px; font-size:15px; font-weight:800; }
.price small { color:#7a8b9a; font-size:9px; font-weight:600; }
.limits { display:grid; grid-template-columns:1fr 1fr; gap:7px; margin:26px 0 8px; }
.limits span { display:flex; flex-direction:column; gap:8px; padding:12px 10px; border-radius:10px; background:#f4f8fb; }
.limits small { color:#8493a1; font-size:8px; }
.limits b { color:#244b6b; font-size:12px; }
.price-card ul { flex:1; }
.price-card li { font-size:11px; }
.yearly { display:flex; flex-direction:column; gap:5px; padding:15px 0; border-top:1px solid #e8eef3; }
.yearly span { color:#49647b; font-size:10px; }
.yearly small { color:#078f7f; font-size:9px; font-weight:750; }
.price-card .button { width:100%; min-height:44px; padding-inline:10px; font-size:11px; }
.button-outline { color:#0a6295; background:white; border:1px solid #b9d1df; box-shadow:none; }
.pricing-note { max-width:650px; margin:34px auto 0; text-align:center; color:#6f8293; font-size:12px; }
.demo-section,.contact-section { background:radial-gradient(circle at 85% 20%,rgba(11,179,170,.16),transparent 30%),linear-gradient(125deg,#082c56,#063d6d); color:white; }
.demo-inner,.contact-inner { display:grid; grid-template-columns:.88fr 1.12fr; gap:90px; align-items:center; }
.demo-copy>.button { margin-top:20px; }
.demo-copy>small { display:block; margin-top:18px; color:#8fb2cd; font-size:10px; }
.credential-list { display:grid; gap:14px; }
.credential-card { padding:24px; border:1px solid rgba(255,255,255,.16); border-radius:20px; background:rgba(255,255,255,.09); backdrop-filter:blur(14px); }
.credential-heading { display:flex; gap:13px; align-items:center; margin-bottom:20px; }
.credential-heading>span { width:42px; height:42px; display:grid; place-items:center; border-radius:12px; color:#074b6d; background:#80e1da; font-weight:850; }
.credential-heading>div { display:flex; flex-direction:column; gap:5px; }
.credential-heading strong { font-size:15px; }
.credential-heading small { color:#aec6d8; font-size:10px; }
.credential-field { display:grid; grid-template-columns:64px 1fr auto; align-items:center; gap:10px; padding:10px 0; border-top:1px solid rgba(255,255,255,.12); }
.credential-field>span { color:#91adc3; font-size:9px; text-transform:uppercase; }
.credential-field code { color:white; font-family:inherit; font-size:13px; }
.credential-field button { padding:6px 9px; border:1px solid rgba(255,255,255,.2); border-radius:7px; color:#cde8f0; background:rgba(255,255,255,.08); cursor:pointer; font-size:9px; }
.help-panel { display:grid; grid-template-columns:1.2fr .8fr; gap:70px; padding:58px; border:1px solid #dce7f0; border-radius:30px; background:linear-gradient(135deg,#f7fbff,#effaf9); box-shadow:0 24px 60px rgba(25,70,108,.09); }
.help-panel p:not(.eyebrow) { max-width:630px; color:#64798d; line-height:1.7; }
.help-topics { display:flex; flex-wrap:wrap; gap:10px; align-content:center; }
.help-topics span { padding:11px 14px; border:1px solid #d8e6ef; border-radius:999px; color:#38617e; background:white; font-size:11px; font-weight:700; }
.faq-section { padding-top:60px; }
.faq-list { max-width:900px; margin:0 auto; }
.faq-list details { border-top:1px solid #dfe7ee; }
.faq-list details:last-child { border-bottom:1px solid #dfe7ee; }
.faq-list summary { display:flex; align-items:center; justify-content:space-between; gap:30px; padding:24px 4px; cursor:pointer; list-style:none; color:#1b405f; font-size:16px; font-weight:750; }
.faq-list summary::-webkit-details-marker { display:none; }
.faq-list summary b { width:28px; height:28px; display:grid; place-items:center; border-radius:50%; color:#0b8687; background:#e9f7f6; }
.faq-list details[open] summary b { transform:rotate(45deg); }
.faq-list details p { margin:0; padding:0 60px 25px 4px; color:#6c7f91; font-size:14px; line-height:1.7; }
.contact-inner { align-items:start; }
.contact-promises { display:grid; gap:13px; margin-top:34px; }
.contact-promises>span { display:grid; grid-template-columns:32px 150px 1fr; gap:13px; align-items:center; padding:12px 0; border-top:1px solid rgba(255,255,255,.13); color:#6bdcd5; font-size:9px; }
.contact-promises b { color:white; font-size:12px; }
.contact-promises small { color:#a7c0d3; }
.form-card { padding:38px; border-radius:24px; color:#173c5c; background:white; box-shadow:0 28px 70px rgba(0,0,0,.22); }
.form-card>h3 { margin:0; font-size:25px; }
.form-card>p { margin:8px 0 24px; color:#7b8c9c; font-size:11px; }
.lead-form { display:grid; gap:15px; }
.field-row { display:grid; grid-template-columns:1fr 1fr; gap:13px; }
.lead-form label { display:flex; flex-direction:column; gap:7px; color:#46647d; font-size:10px; font-weight:750; }
.lead-form input,.lead-form select,.lead-form textarea { width:100%; padding:12px 13px; border:1px solid #d7e2ea; border-radius:10px; outline:none; color:#173c5c; background:white; font:inherit; font-size:12px; font-weight:500; }
.lead-form input:focus,.lead-form select:focus,.lead-form textarea:focus { border-color:#149d9b; box-shadow:0 0 0 3px rgba(20,157,155,.1); }
.lead-form textarea { resize:vertical; }
.consent { flex-direction:row!important; align-items:flex-start; font-weight:500!important; line-height:1.5; }
.consent input { width:15px; height:15px; margin:1px 0 0; }
.submit-button { border:0; cursor:pointer; margin-top:4px; }
.submit-button:disabled { opacity:.6; cursor:wait; }
.form-message { margin:0; padding:10px; border-radius:8px; font-size:11px; }
.form-message.success { color:#076a5f; background:#e7f8f4; }
.form-message.error { color:#9c2d2d; background:#fff0f0; }
.honeypot { position:absolute!important; left:-9999px!important; opacity:0!important; }
.site-footer { padding:70px max(24px,calc((100vw - 1180px)/2)) 26px; border-top:1px solid #dfe8ef; background:#f7fafc; }
.footer-grid { display:grid; grid-template-columns:2fr 1fr 1fr 1fr; gap:60px; }
.footer-brand img { width:170px; height:58px; object-fit:contain; object-position:left; }
.footer-grid>div { display:flex; flex-direction:column; gap:10px; }
.footer-grid strong { color:#214360; font-size:11px; text-transform:uppercase; letter-spacing:.06em; }
.footer-grid a,.footer-grid p { margin:0; color:#718293; font-size:11px; line-height:1.6; }
.footer-grid a:hover { color:#087f8c; }
.footer-bottom { display:flex; justify-content:space-between; gap:20px; margin-top:50px; padding-top:22px; border-top:1px solid #dfe8ef; color:#91a0ad; font-size:9px; }

/* Help center */
.help-hero { min-height:470px; display:grid; grid-template-columns:1fr 250px; gap:70px; align-items:center; padding:80px max(24px,calc((100vw - 1180px)/2)); background:radial-gradient(circle at 80% 25%,rgba(10,178,169,.15),transparent 28%),linear-gradient(180deg,#f8fcff,#f2f8fd); }
.help-hero h1 { margin:0; color:#102f50; font-size:clamp(48px,6vw,76px); line-height:1; letter-spacing:-.055em; }
.help-hero h1 em { color:transparent; font-style:normal; background:linear-gradient(100deg,#0b57b7,#09a7a2); background-clip:text; -webkit-background-clip:text; }
.help-hero>div>p:last-child { max-width:700px; color:#657b8f; font-size:17px; line-height:1.7; }
.help-hero aside { display:flex; flex-direction:column; gap:5px; padding:26px; border:1px solid #d6e6ee; border-radius:20px; background:white; box-shadow:0 20px 50px rgba(28,76,112,.09); }
.help-hero aside span { color:#087e91; font-size:50px; font-weight:850; line-height:1; }
.help-hero aside strong { color:#264d6a; font-size:12px; }
.help-hero aside small { margin-top:8px; color:#8a9aa8; font-size:9px; }
.help-layout { width:min(1260px,calc(100% - 40px)); display:grid; grid-template-columns:210px 1fr; gap:54px; margin:0 auto; padding:72px 0 120px; }
.help-sidebar { align-self:start; position:sticky; top:24px; display:flex; flex-direction:column; gap:18px; }
.help-sidebar>strong { color:#274b66; font-size:11px; text-transform:uppercase; letter-spacing:.08em; }
.help-sidebar nav { display:flex; flex-direction:column; }
.help-sidebar nav a { padding:8px 0; color:#728596; font-size:11px; }
.help-sidebar nav a:hover { color:#07928e; }
.help-sidebar>div { display:flex; flex-direction:column; gap:8px; margin-top:14px; padding:16px; border-radius:13px; color:#dbeefa; background:#0a4876; font-size:10px; line-height:1.5; }
.help-sidebar>div a { color:#73e3db; font-weight:800; }
.help-search-panel { display:grid; gap:18px; padding:24px; border:1px solid #dce7ef; border-radius:18px; background:white; box-shadow:0 14px 36px rgba(25,70,105,.07); }
.help-search-panel label>span { display:block; margin-bottom:8px; color:#557086; font-size:10px; font-weight:800; }
.search-input { display:flex; align-items:center; gap:10px; padding:0 14px; border:1px solid #d4e1ea; border-radius:11px; }
.search-input b { color:#0b918e; font-size:20px; }
.search-input input { width:100%; padding:14px 0; border:0; outline:none; color:#173d5c; background:transparent; font:inherit; font-size:13px; }
.category-tabs { display:flex; flex-wrap:wrap; gap:7px; }
.category-tabs button { padding:8px 11px; border:1px solid #dbe5ed; border-radius:999px; color:#5e7487; background:#f9fbfd; cursor:pointer; font-size:9px; font-weight:750; }
.category-tabs button.active { color:white; border-color:#0b8e91; background:#0b8e91; }
.help-results-meta { display:flex; align-items:baseline; gap:6px; padding:24px 2px 10px; color:#8796a4; font-size:10px; }
.help-results-meta strong { color:#0b6d8e; font-size:24px; }
.help-results-meta button { margin-left:auto; border:0; color:#0b8787; background:transparent; cursor:pointer; font-size:10px; font-weight:750; }
.help-module-list { display:grid; gap:18px; }
.help-module { scroll-margin-top:20px; overflow:hidden; border:1px solid #dbe6ee; border-radius:20px; background:white; box-shadow:0 12px 34px rgba(23,66,101,.055); }
.help-module-head { display:grid; grid-template-columns:58px 1fr; gap:18px; padding:28px 30px; }
.help-number { width:48px; height:48px; display:grid; place-items:center; border-radius:14px; color:#077f85; background:#e5f7f5; font-size:11px; font-weight:850; }
.help-module-head small { color:#0b9290; font-size:9px; font-weight:800; text-transform:uppercase; letter-spacing:.08em; }
.help-module-head h2 { margin:5px 0 8px; color:#1a405f; font-size:25px; letter-spacing:-.025em; }
.help-module-head p { max-width:790px; margin:0; color:#6b7f91; font-size:13px; line-height:1.65; }
.help-module-body { display:grid; grid-template-columns:1.5fr .8fr; gap:30px; padding:28px 30px; border-top:1px solid #e8eef3; background:#fbfdff; }
.help-module-body h3 { margin:0 0 15px; color:#31566f; font-size:10px; text-transform:uppercase; letter-spacing:.08em; }
.how-it-works ol { display:grid; gap:12px; margin:0; padding:0; list-style:none; }
.how-it-works li { display:grid; grid-template-columns:25px 1fr; gap:10px; }
.how-it-works li span { width:22px; height:22px; display:grid; place-items:center; border:1px solid #badfdc; border-radius:50%; color:#078c88; font-size:8px; font-weight:850; }
.how-it-works li p { margin:1px 0 0; color:#526e83; font-size:11px; line-height:1.6; }
.dependency-box { padding:19px; border:1px solid #dbe7ef; border-radius:14px; background:white; }
.dependency-box>div { display:flex; flex-wrap:wrap; gap:6px; margin-bottom:22px; }
.dependency-box>div span { padding:6px 8px; border-radius:7px; color:#36627b; background:#edf5f8; font-size:8px; font-weight:700; }
.dependency-box ul { margin:0; padding-left:16px; color:#657c8f; font-size:9px; line-height:1.7; }
.related-links { display:flex; flex-wrap:wrap; align-items:center; gap:8px; padding:13px 30px; border-top:1px solid #e8eef3; }
.related-links>span { margin-right:4px; color:#8b9aa6; font-size:8px; text-transform:uppercase; }
.related-links a { padding:5px 8px; border-radius:999px; color:#087c88; background:#eaf7f6; font-size:8px; font-weight:750; }
.empty-help { padding:70px 20px; text-align:center; border:1px dashed #cddde8; border-radius:18px; color:#6d8293; }
.empty-help strong { color:#284e69; font-size:20px; }
.empty-help button { padding:9px 13px; border:0; border-radius:8px; color:white; background:#0b8c8c; cursor:pointer; }
.help-cta { width:min(1180px,calc(100% - 40px)); display:flex; justify-content:space-between; align-items:center; gap:40px; margin:0 auto 100px; padding:40px 46px; border-radius:24px; color:white; background:linear-gradient(110deg,#0a3d70,#087a8c); }
.help-cta h2 { margin:0; font-size:28px; }
.help-cta p { margin:8px 0 0; color:#b8d8e2; font-size:12px; }
.help-cta .button { background:white; color:#0a5575; box-shadow:none; }
.legal-content { width:min(850px,calc(100% - 40px)); margin:0 auto; padding:100px 0; }
.legal-content h1 { margin-bottom:24px; }
.legal-intro { color:#60778a; font-size:17px; line-height:1.7; }
.legal-content section { padding:25px 0; border-top:1px solid #e0e8ef; }
.legal-content section h2 { color:#244b68; font-size:18px; }
.legal-content section p { color:#6d8192; line-height:1.7; }
.legal-content>.button { margin-top:24px; }

@media(max-width:1120px) {
  .pricing-grid { grid-template-columns:repeat(3,1fr); }
  .price-card.featured { transform:none; }
  .role-grid { grid-template-columns:repeat(2,1fr); }
}
@media(max-width:900px) {
  .header-actions,.site-header nav { display:none; }
  .mobile-menu { display:block; }
  .site-header { grid-template-columns:1fr auto; }
  .section { padding-block:86px; }
  .split-heading,.workflow-inner,.isolation-inner,.demo-inner,.contact-inner,.help-panel { grid-template-columns:1fr; gap:45px; }
  .module-grid,.problem-grid { grid-template-columns:1fr 1fr; }
  .signal-strip { grid-template-columns:1fr 1fr; }
  .signal-strip div:nth-child(2) { border-right:0; }
  .pricing-grid { grid-template-columns:repeat(2,1fr); }
  .footer-grid { grid-template-columns:2fr 1fr 1fr; }
  .footer-grid>div:last-child { grid-column:2/4; }
  .help-layout { grid-template-columns:1fr; }
  .help-sidebar { position:static; display:none; }
  .help-module-body { grid-template-columns:1fr; }
  .help-hero { grid-template-columns:1fr; }
  .help-hero aside { max-width:260px; }
}
@media(max-width:620px) {
  .section { width:calc(100% - 28px); padding-block:70px; }
  .section-heading h2,.workflow-copy h2,.isolation-copy h2,.demo-copy h2,.contact-copy h2,.help-panel h2,.legal-content h1 { font-size:38px; }
  .split-heading { gap:20px; }
  .module-grid,.problem-grid,.role-grid,.pricing-grid { grid-template-columns:1fr; }
  .signal-strip { min-height:220px; padding-inline:14px; }
  .signal-strip div { border-bottom:1px solid #e4edf5; }
  .signal-strip div:first-child { border-left:0; }
  .signal-strip div:nth-child(2) { border-right:0; }
  .problem-grid article { min-height:260px; padding:27px; }
  .module-card { min-height:300px; }
  .workflow-list li { grid-template-columns:48px 1fr; }
  .role-card { padding:25px; }
  .isolation-visual { min-height:350px; }
  .isolation-copy li { grid-template-columns:1fr; gap:5px; }
  .price-card { min-height:560px; }
  .help-panel { padding:30px 24px; }
  .credential-card { padding:19px; }
  .credential-field { grid-template-columns:54px 1fr; }
  .credential-field button { grid-column:2; justify-self:start; }
  .contact-promises>span { grid-template-columns:28px 1fr; }
  .contact-promises small { grid-column:2; }
  .form-card { padding:25px 20px; }
  .field-row { grid-template-columns:1fr; }
  .footer-grid { grid-template-columns:1fr 1fr; gap:34px; }
  .footer-brand { grid-column:1/3; }
  .footer-grid>div:last-child { grid-column:auto; }
  .footer-bottom { flex-direction:column; }
  .help-hero { min-height:520px; padding-block:65px; }
  .help-hero h1 { font-size:48px; }
  .help-layout { width:calc(100% - 28px); padding-block:40px 80px; }
  .help-search-panel { padding:17px; }
  .help-module-head { grid-template-columns:42px 1fr; gap:12px; padding:22px 18px; }
  .help-number { width:38px; height:38px; border-radius:11px; }
  .help-module-head h2 { font-size:21px; }
  .help-module-body { padding:22px 18px; }
  .related-links { padding-inline:18px; }
  .help-cta { width:calc(100% - 28px); flex-direction:column; align-items:flex-start; padding:28px; }
}



/* 2026 blue-purple readability refresh */
:root {
  --blue:#2563eb;
  --cyan:#9333ea;
  --ink:#111827;
  --muted:#526174;
  --line:#dce5f0;
}
html { scroll-behavior:smooth; scroll-padding-top:92px; }
body { color:var(--ink); font-size:17px; background:#f8faff; }
::selection { color:white; background:#6d3df0; }
.site-header { width:min(1320px,calc(100% - 48px)); height:92px; }
.site-header nav { gap:26px; color:#344054; font-size:16px; }
.brand { width:184px; }
.brand img { max-height:68px; }
.login-link { font-size:15px; }
.button { min-height:52px; padding:0 24px; border:0; border-radius:13px; font-size:16px; background:linear-gradient(100deg,#3b82f6,#9333ea); box-shadow:0 12px 30px rgba(99,74,231,.24); }
.button:hover { transform:translateY(-2px); box-shadow:0 16px 36px rgba(99,74,231,.32); }
.button:focus-visible,a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible { outline:3px solid rgba(59,130,246,.36); outline-offset:3px; }
.button-small { min-height:44px; padding-inline:18px; font-size:15px; }
.hero {
  min-height:calc(100vh - 92px);
  grid-template-columns:minmax(0,.86fr) minmax(600px,1.14fr);
  gap:64px;
  padding:64px max(32px,calc((100vw - 1320px)/2)) 104px;
  background:
    radial-gradient(circle at 78% 12%,rgba(147,51,234,.16),transparent 31%),
    radial-gradient(circle at 12% 88%,rgba(59,130,246,.15),transparent 32%),
    linear-gradient(180deg,#fff 0%,#f5f8ff 100%);
}
.hero:before { opacity:.46; background-size:64px 64px; }
.eyebrow { color:#5b35d5; font-size:14px; letter-spacing:.12em; }
.eyebrow span { background:linear-gradient(135deg,#3b82f6,#9333ea); }
h1 { font-size:clamp(58px,6vw,88px); color:#101828; line-height:.98; }
h1 em,.section-heading h2 em,.workflow-copy h2 em,.isolation-copy h2 em,.demo-copy h2 em,.contact-copy h2 em,.help-panel h2 em,.legal-content h1 em,.help-hero h1 em { background:linear-gradient(100deg,#2563eb,#9333ea); background-clip:text; -webkit-background-clip:text; }
.hero-lead { max-width:650px; color:#475467; font-size:21px; line-height:1.68; }
.hero-actions { gap:24px; margin-top:36px; }
.text-link { font-size:17px; }
.trust-row { gap:20px; margin-top:30px; color:#344054; font-size:14px; }
.hero-demo-panel {
  position:relative;
  z-index:2;
  overflow:hidden;
  padding:16px;
  border:1px solid rgba(148,163,184,.32);
  border-radius:28px;
  background:rgba(255,255,255,.92);
  box-shadow:0 32px 80px rgba(48,52,110,.18);
  backdrop-filter:blur(18px);
}
.hero-demo-top { display:flex; justify-content:space-between; align-items:center; gap:20px; padding:4px 4px 16px; color:#475467; font-size:14px; font-weight:750; }
.hero-demo-top span { display:flex; align-items:center; gap:8px; }
.hero-demo-top i { width:9px; height:9px; border-radius:50%; background:#22c55e; box-shadow:0 0 0 6px rgba(34,197,94,.12); }
.hero-demo-top a { color:#5b35d5; }
.hero-demo-screen { overflow:hidden; border:1px solid #d8e1ee; border-radius:18px; background:#eef4ff; }
.hero-demo-screen img { display:block; width:100%; aspect-ratio:16/9; object-fit:cover; object-position:top center; }
.hero-credentials { display:grid; grid-template-columns:1fr 1fr; gap:12px; margin-top:14px; }
.hero-credentials article { min-width:0; padding:17px 18px; border:1px solid #dce5f0; border-radius:16px; background:linear-gradient(145deg,#eff6ff,#faf5ff); }
.hero-credentials span,.hero-credentials small { display:block; color:#667085; font-size:13px; }
.hero-credentials strong { display:block; overflow-wrap:anywhere; margin:6px 0; color:#172554; font-size:16px; }
.hero-credentials b { color:#6d28d9; font-size:15px; }
.hero-demo-panel>p { margin:13px 4px 2px; color:#667085; font-size:13px; text-align:center; }
.signal-strip { width:min(1320px,calc(100% - 48px)); border-color:#dbe4ef; background:white; box-shadow:0 20px 50px rgba(36,47,87,.08); }
.signal-strip strong { color:#3b4fd8; font-size:34px; }
.signal-strip span { color:#526174; font-size:14px; line-height:1.45; }
.section { width:min(1320px,calc(100% - 48px)); padding-block:116px; }
.section-heading h2,.workflow-copy h2,.isolation-copy h2,.demo-copy h2,.contact-copy h2,.help-panel h2,.legal-content h1 { color:#101828; font-size:clamp(48px,4.7vw,72px); }
.section-heading>p:last-child,.split-heading>p { color:#526174; font-size:19px; line-height:1.72; }
.problem-grid article,.module-card,.role-card,.price-card,.faq-list details,.form-card { border-color:#dce5f0; box-shadow:0 18px 45px rgba(40,52,92,.08); }
.problem-grid article { min-height:320px; padding:34px; }
.problem-grid h3,.module-card h3,.role-card h3 { font-size:25px; line-height:1.2; }
.problem-grid p,.module-card p,.role-card p { color:#526174; font-size:17px; line-height:1.68; }
.problem-grid b,.module-card a { font-size:15px; }
.problem-number,.module-code { color:#6d28d9; background:#f3e8ff; }
.module-card { min-height:360px; padding:34px; background:linear-gradient(160deg,#fff 58%,#f6f1ff); }
.module-card>div>span { font-size:13px; }
.role-card { padding:34px; }
.role-card li { font-size:15px; }
.workflow-section,.demo-section,.contact-section {
  background:
    radial-gradient(circle at 88% 18%,rgba(147,51,234,.28),transparent 30%),
    radial-gradient(circle at 10% 84%,rgba(59,130,246,.24),transparent 34%),
    linear-gradient(125deg,#111c4e,#32145f);
}
.workflow-copy>p,.demo-copy>p,.contact-copy>p { font-size:18px; line-height:1.72; }
.workflow-list strong { font-size:20px; }
.workflow-list p { font-size:16px; line-height:1.62; }
.isolation-copy>p,.isolation-copy li span { font-size:17px; line-height:1.7; }
.isolation-copy li b { font-size:16px; }
.pricing-grid { grid-template-columns:repeat(3,1fr); gap:18px; }
.price-card { min-height:590px; padding:30px; }
.price-card h3 { font-size:24px; }
.price strong { font-size:56px; }
.price span { font-size:24px; }
.price small,.limits small { font-size:13px; }
.limits b { font-size:18px; }
.price-card li { font-size:15px; }
.yearly span,.yearly small { font-size:14px; }
.popular { font-size:12px; }
.demo-copy small { font-size:14px; }
.faq-list summary { padding:24px 28px; font-size:18px; }
.faq-list details p { padding:0 28px 25px; font-size:16px; line-height:1.65; }
.form-card label { gap:8px; font-size:15px; }
.form-card input,.form-card select,.form-card textarea { min-height:52px; font-size:16px; }
.consent span { font-size:14px; line-height:1.55; }
.form-message { font-size:15px; }
.site-footer { font-size:15px; }
.site-footer a,.site-footer p { font-size:14px; }

/* Product screenshots */
.screenshots-section { padding-top:124px; }
.product-gallery { overflow:hidden; border:1px solid #dbe4ef; border-radius:30px; background:white; box-shadow:0 30px 80px rgba(49,46,129,.13); }
.gallery-toolbar { display:flex; gap:8px; padding:16px; border-bottom:1px solid #e5eaf2; background:#f8faff; }
.gallery-toolbar button { min-height:46px; padding:0 20px; border:1px solid transparent; border-radius:12px; color:#526174; background:transparent; font-size:15px; font-weight:800; cursor:pointer; }
.gallery-toolbar button.active { color:white; background:linear-gradient(100deg,#3b82f6,#9333ea); box-shadow:0 10px 24px rgba(99,74,231,.2); }
.gallery-stage { padding:22px; background:linear-gradient(145deg,#edf5ff,#f8f1ff); }
.gallery-browser-bar { height:40px; display:flex; align-items:center; gap:7px; padding:0 14px; border:1px solid #d9e2ee; border-bottom:0; border-radius:15px 15px 0 0; background:white; }
.gallery-browser-bar span { width:9px; height:9px; border-radius:50%; background:#cbd5e1; }
.gallery-browser-bar b { margin-left:10px; color:#667085; font-size:12px; font-weight:700; }
.gallery-stage>img { display:block; width:100%; max-height:720px; object-fit:contain; object-position:top center; border:1px solid #d9e2ee; border-radius:0 0 15px 15px; background:white; }
.product-gallery.mobile .gallery-stage>img { width:auto; max-width:min(100%,460px); max-height:780px; margin:0 auto; border-radius:0 0 22px 22px; }
.product-gallery.mobile .gallery-browser-bar { max-width:460px; margin:0 auto; }
.gallery-caption { display:flex; justify-content:space-between; align-items:center; gap:24px; padding:22px 24px 16px; }
.gallery-caption strong { color:#172554; font-size:23px; }
.gallery-caption p { margin:6px 0 0; color:#526174; font-size:16px; }
.gallery-caption>span { color:#7c3aed; font-size:15px; font-weight:850; }
.gallery-thumbs { display:grid; grid-template-columns:repeat(6,1fr); gap:10px; padding:0 16px 18px; }
.gallery-thumbs button { overflow:hidden; padding:7px; border:1px solid #dce5f0; border-radius:13px; color:#526174; background:white; font-size:12px; font-weight:750; cursor:pointer; text-align:left; }
.gallery-thumbs button.active { border-color:#7c3aed; color:#5b21b6; box-shadow:0 0 0 2px rgba(124,58,237,.12); }
.gallery-thumbs img { display:block; width:100%; aspect-ratio:16/10; margin-bottom:7px; border-radius:8px; object-fit:cover; object-position:top; }

/* Help center screenshots and readable content */
.help-hero { min-height:520px; background:radial-gradient(circle at 82% 18%,rgba(147,51,234,.16),transparent 30%),linear-gradient(180deg,#fff,#f1f6ff); }
.help-hero h1 { font-size:clamp(56px,6vw,84px); }
.help-hero>div>p:last-child { font-size:19px; }
.help-hero aside span { color:#6d28d9; }
.help-hero aside strong { font-size:15px; }
.help-hero aside small { font-size:12px; }
.help-search-panel label>span { font-size:15px; }
.search-input input { font-size:17px; }
.category-tabs button { font-size:14px; }
.help-results-meta { font-size:15px; }
.help-module-head { padding:30px; }
.help-module-head small { font-size:13px; }
.help-module-head h2 { font-size:29px; }
.help-module-head p { font-size:17px; line-height:1.65; }
.help-number { font-size:15px; }
.help-module-screen { margin:0; padding:22px 30px 0; border-top:1px solid #e5eaf2; background:#f8faff; }
.help-module-screen img { display:block; width:100%; max-height:680px; object-fit:contain; object-position:top center; border:1px solid #dce5f0; border-radius:16px; background:white; box-shadow:0 16px 36px rgba(44,54,96,.09); }
.help-module-screen figcaption { padding:10px 4px 2px; color:#667085; font-size:13px; }
.help-module-body { padding:30px; }
.help-module-body h3 { font-size:15px; }
.how-it-works li p { font-size:16px; line-height:1.62; }
.dependency-box span,.dependency-box li { font-size:14px; }
.related-links>span,.related-links a { font-size:12px; }
.help-cta { background:linear-gradient(110deg,#1d4ed8,#7e22ce); }
.help-cta h2 { font-size:34px; }
.help-cta p { font-size:16px; }

@media(max-width:1180px) {
  .hero { grid-template-columns:1fr 1fr; gap:38px; }
  .pricing-grid { grid-template-columns:repeat(2,1fr); }
}
@media(max-width:980px) {
  .hero { grid-template-columns:1fr; padding-top:72px; }
  .hero-copy { text-align:left; }
  .hero .eyebrow,.hero-actions,.trust-row { justify-content:flex-start; }
  .hero h1,.hero-lead { margin-inline:0; }
  .hero-demo-panel { max-width:760px; width:100%; margin-inline:auto; }
}
@media(max-width:900px) {
  .site-header { width:calc(100% - 32px); }
  .mobile-menu summary { font-size:15px; }
  .mobile-menu a { font-size:15px; }
  .gallery-thumbs { display:flex; overflow-x:auto; scroll-snap-type:x mandatory; }
  .gallery-thumbs button { flex:0 0 170px; scroll-snap-align:start; }
}
@media(max-width:620px) {
  body { font-size:17px; }
  .site-header { height:78px; }
  .brand { width:158px; }
  .hero { min-height:auto; padding:54px 16px 76px; }
  h1 { font-size:clamp(46px,13.5vw,66px); line-height:1.01; }
  .hero-lead { font-size:19px; }
  .hero-actions { align-items:stretch; }
  .hero-actions .button { width:100%; }
  .text-link { justify-content:center; min-height:46px; }
  .trust-row { display:grid; grid-template-columns:1fr; font-size:14px; }
  .hero-demo-panel { padding:10px; border-radius:22px; }
  .hero-demo-top { align-items:flex-start; flex-direction:column; padding:6px 6px 13px; font-size:13px; }
  .hero-demo-screen img { aspect-ratio:4/3; }
  .hero-credentials { grid-template-columns:1fr; }
  .hero-credentials strong { font-size:17px; }
  .signal-strip { width:calc(100% - 28px); }
  .section { width:calc(100% - 28px); padding-block:82px; }
  .section-heading h2,.workflow-copy h2,.isolation-copy h2,.demo-copy h2,.contact-copy h2,.help-panel h2,.legal-content h1 { font-size:clamp(40px,11vw,54px); }
  .section-heading>p:last-child,.split-heading>p { font-size:18px; }
  .problem-grid h3,.module-card h3,.role-card h3 { font-size:24px; }
  .problem-grid p,.module-card p,.role-card p { font-size:17px; }
  .pricing-grid { grid-template-columns:1fr; }
  .price-card { min-height:560px; }
  .screenshots-section { padding-top:88px; }
  .product-gallery { border-radius:20px; }
  .gallery-toolbar { padding:10px; }
  .gallery-toolbar button { flex:1; min-height:52px; padding:0 10px; font-size:14px; }
  .gallery-stage { padding:10px; }
  .gallery-caption { align-items:flex-start; padding:18px 16px 14px; }
  .gallery-caption strong { font-size:21px; }
  .gallery-caption p { font-size:15px; }
  .gallery-thumbs { padding:0 10px 14px; }
  .help-hero { min-height:540px; }
  .help-hero h1 { font-size:50px; }
  .help-hero>div>p:last-child { font-size:18px; }
  .help-module-head { padding:24px 18px; }
  .help-module-head h2 { font-size:24px; }
  .help-module-head p { font-size:16px; }
  .help-module-screen { padding:14px 12px 0; }
  .help-module-screen img { max-height:520px; border-radius:12px; }
  .help-module-body { padding:24px 18px; }
  .how-it-works li p { font-size:16px; }
  .related-links>span,.related-links a { font-size:12px; }
}


/* Layout and dark-section correction */
.site-header { width:min(1440px,calc(100% - 64px)); }
.hero {
  grid-template-columns:minmax(470px,.9fr) minmax(620px,1.1fr);
  padding-inline:max(32px,calc((100vw - 1440px)/2));
}
.section { width:min(1440px,calc(100% - 64px)); }
.signal-strip {
  width:min(1440px,calc(100% - 64px));
  padding-inline:24px;
}
.modules-section {
  width:100%;
  max-width:none;
  margin:0;
  padding:116px max(32px,calc((100vw - 1440px)/2));
}
.modules-section .section-heading,
.modules-section .module-grid { width:100%; max-width:1440px; margin-inline:auto; }
.split-heading { grid-template-columns:minmax(0,1.15fr) minmax(360px,.85fr); gap:64px; align-items:end; }
.split-heading>div { min-width:0; }
.split-heading>p { max-width:620px; justify-self:end; }
.module-grid { gap:22px; }
.module-card { min-width:0; }
.workflow-inner,.demo-inner,.contact-inner { grid-template-columns:minmax(0,.95fr) minmax(0,1.05fr); gap:84px; }
.help-panel { grid-template-columns:minmax(0,1.1fr) minmax(360px,.9fr); }
.pricing-section { width:min(1440px,calc(100% - 64px)); max-width:1440px; }

.workflow-section .workflow-copy h2,
.demo-section .demo-copy h2,
.contact-section .contact-copy h2 { color:#fff; }
.workflow-section .workflow-copy h2 em,
.demo-section .demo-copy h2 em,
.contact-section .contact-copy h2 em {
  background:linear-gradient(90deg,#93c5fd,#d8b4fe);
  background-clip:text;
  -webkit-background-clip:text;
}
.workflow-section .eyebrow.light,
.demo-section .eyebrow.light,
.contact-section .eyebrow.light { color:#c4b5fd; }
.workflow-section .eyebrow.light span,
.demo-section .eyebrow.light span,
.contact-section .eyebrow.light span { background:linear-gradient(90deg,#60a5fa,#d8b4fe); }
.workflow-section .workflow-copy>p:not(.eyebrow),
.demo-section .demo-copy>p:not(.eyebrow),
.contact-section .contact-copy>p:not(.eyebrow) { color:#dbeafe; }
.workflow-section .workflow-list strong { color:#fff; }
.workflow-section .workflow-list p { color:#cbd5e1; }
.workflow-section .workflow-list li>span { color:#d8b4fe; border-color:rgba(216,180,254,.5); }
.button.button-light {
  color:#312e81;
  background:#fff;
  box-shadow:0 14px 32px rgba(0,0,0,.2);
}
.button.button-light:hover { color:#1e3a8a; background:#f8fafc; }
.demo-section .credential-heading strong,
.demo-section .credential-field code { color:#fff; }
.demo-section .credential-heading small,
.demo-section .credential-field>span,
.demo-section .demo-copy>small { color:#cbd5e1; }
.contact-section .contact-promises b { color:#fff; }
.contact-section .contact-promises small { color:#cbd5e1; }

@media(min-width:1600px) {
  .problem-grid,.module-grid { gap:26px; }
  .module-card { min-height:330px; }
  .hero-demo-panel { max-width:780px; justify-self:end; }
}
@media(max-width:1180px) {
  .hero { grid-template-columns:1fr 1fr; }
  .section,.pricing-section { width:calc(100% - 48px); }
  .site-header,.signal-strip { width:calc(100% - 48px); }
  .modules-section { padding-inline:24px; }
}
@media(max-width:980px) {
  .hero { grid-template-columns:1fr; }
  .split-heading { grid-template-columns:1fr; gap:24px; }
  .split-heading>p { justify-self:start; max-width:760px; }
  .workflow-inner,.demo-inner,.contact-inner,.help-panel { grid-template-columns:1fr; }
}
@media(max-width:620px) {
  .site-header,.signal-strip,.section,.pricing-section { width:calc(100% - 28px); }
  .modules-section { width:100%; padding:82px 14px; }
  .module-grid { gap:16px; }
}

/* Requested visual refinements 2026-08-30 */
.signal-strip {
  margin-inline:auto;
}
.isolation-visual-generated {
  min-height:520px;
  overflow:hidden;
  padding:0;
  background:#f7f9ff;
}
.isolation-illustration {
  display:block;
  width:100%;
  height:100%;
  min-height:520px;
  object-fit:cover;
}
.isolation-domain-badge {
  position:absolute;
  top:28px;
  left:28px;
  padding:13px 18px;
  border:1px solid rgba(255,255,255,.72);
  border-radius:12px;
  color:#fff;
  background:linear-gradient(110deg,#2878f0,#8729ed);
  box-shadow:0 14px 34px rgba(76,68,210,.22);
  font-size:16px;
  font-weight:850;
}
.isolation-visual-generated small {
  right:auto;
  bottom:26px;
  left:28px;
  padding:10px 14px;
  border:1px solid rgba(219,228,255,.92);
  border-radius:10px;
  color:#344054;
  background:rgba(255,255,255,.9);
  box-shadow:0 8px 22px rgba(36,47,87,.1);
  font-size:12px;
  font-weight:800;
  letter-spacing:.08em;
}
.contact-promises {
  gap:0;
  margin-top:38px;
}
.contact-promises>span {
  grid-template-columns:54px minmax(180px,.75fr) minmax(240px,1.25fr);
  gap:22px;
  min-height:78px;
  padding:20px 0;
  color:#67e8f9;
  font-size:15px;
  font-weight:850;
}
.contact-promises b {
  font-size:18px;
  line-height:1.35;
}
.contact-promises small {
  font-size:15px;
  line-height:1.5;
}
@media(max-width:620px) {
  .isolation-visual-generated,
  .isolation-illustration {
    min-height:360px;
  }
  .isolation-domain-badge {
    top:18px;
    left:18px;
    padding:11px 14px;
    font-size:14px;
  }
  .isolation-visual-generated small {
    bottom:18px;
    left:18px;
    max-width:calc(100% - 36px);
    font-size:11px;
  }
  .contact-promises>span {
    grid-template-columns:42px 1fr;
    gap:8px 14px;
    min-height:0;
    padding:18px 0;
    font-size:15px;
  }
  .contact-promises b {
    font-size:17px;
  }
  .contact-promises small {
    grid-column:2;
    font-size:15px;
  }
}
/* Requested navigation and readability refinements 2026-08-31 */
.site-header {
  position:sticky;
  top:0;
  z-index:100;
  width:100%;
  margin:0;
  padding-inline:max(32px,calc((100vw - 1440px)/2));
  box-sizing:border-box;
  border-bottom:1px solid rgba(220,229,240,.88);
  background:rgba(248,250,255,.92);
  box-shadow:0 10px 30px rgba(28,39,76,.07);
  backdrop-filter:blur(18px);
  -webkit-backdrop-filter:blur(18px);
}
.signal-strip {
  width:100%;
  max-width:none;
  margin-inline:0;
  padding-inline:max(32px,calc((100vw - 1440px)/2));
  box-sizing:border-box;
}
.pricing-note {
  max-width:820px;
  font-size:17px;
  line-height:1.65;
}
.price-card .button,
.price-card .button-outline {
  color:#fff;
  border-color:transparent;
  background:linear-gradient(120deg,#3b82f6,#9333ea);
  box-shadow:0 12px 26px rgba(93,66,210,.2);
}
.price-card .button:hover,
.price-card .button-outline:hover {
  color:#fff;
}
.help-sidebar {
  top:116px;
}
.help-sidebar>strong {
  font-size:14px;
}
.help-sidebar nav a {
  padding:10px 0;
  font-size:15px;
  line-height:1.4;
}
.help-sidebar>div {
  padding:19px;
  font-size:14px;
  line-height:1.55;
}
.help-sidebar>div a {
  font-size:14px;
}
@media(max-width:900px) {
  .site-header {
    width:100%;
    padding-inline:24px;
  }
  .signal-strip {
    width:100%;
    padding-inline:24px;
  }
}
@media(max-width:620px) {
  .site-header {
    width:100%;
    padding-inline:14px;
  }
  .signal-strip {
    width:100%;
    padding-inline:14px;
  }
  .pricing-note {
    font-size:16px;
  }
}
/* Final pricing and Help typography refinement 2026-08-31 */
.price-card .button,
.price-card .button-outline {
  min-height:52px;
  font-size:16px;
  font-weight:800;
}
.help-layout {
  grid-template-columns:280px minmax(0,1fr);
  gap:64px;
}
.help-sidebar {
  gap:22px;
}
.help-sidebar>strong {
  font-size:18px;
  line-height:1.3;
}
.help-sidebar nav a {
  padding:11px 0;
  font-size:18px;
  line-height:1.45;
}
.help-sidebar>div {
  gap:11px;
  padding:24px;
  border-radius:18px;
  font-size:16px;
  line-height:1.55;
}
.help-sidebar>div a {
  font-size:17px;
}
@media(max-width:1100px) and (min-width:901px) {
  .help-layout {
    grid-template-columns:240px minmax(0,1fr);
    gap:42px;
  }
}
@media(max-width:900px) {
  .help-layout {
    grid-template-columns:1fr;
  }
}
@media(max-width:620px) {
  .price-card .button,
  .price-card .button-outline {
    font-size:17px;
  }
}
/* New HostApart branding size refinement 2026-08-31 */
.site-header {
  min-height:104px;
}
.brand {
  width:230px;
}
.brand img {
  height:82px;
  max-height:82px;
}
.footer-brand img {
  width:230px;
  height:92px;
}
@media(max-width:1100px) {
  .brand {
    width:205px;
  }
}
@media(max-width:620px) {
  .site-header {
    min-height:88px;
    height:88px;
  }
  .brand {
    width:184px;
  }
  .brand img {
    height:68px;
    max-height:68px;
  }
  .footer-brand img {
    width:205px;
    height:82px;
  }
}
/* Static HTML edition */
.static-gallery-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:24px; }
.static-shot { overflow:hidden; margin:0; border:1px solid #dce8f2; border-radius:24px; background:#fff; box-shadow:0 18px 45px rgba(26,57,96,.1); }
.static-shot.featured-shot { grid-column:1/-1; }
.static-shot img { display:block; width:100%; aspect-ratio:16/9; object-fit:cover; object-position:top center; background:#eef5ff; }
.static-shot:last-child img { aspect-ratio:16/10; object-fit:contain; }
.static-shot figcaption { display:flex; flex-direction:column; gap:6px; padding:22px 24px 25px; }
.static-shot figcaption strong { color:#173c5c; font-size:22px; }
.static-shot figcaption span { color:#60788d; font-size:17px; line-height:1.6; }
.demo-credentials { display:grid; gap:14px; }
.demo-credentials article { display:grid; gap:7px; padding:22px; border:1px solid rgba(255,255,255,.18); border-radius:18px; background:rgba(255,255,255,.08); }
.demo-credentials span,.demo-credentials small { color:#bcd5e9; font-size:16px; }
.demo-credentials strong { color:#fff; font-size:21px; overflow-wrap:anywhere; }
.help-static-intro { margin-bottom:28px; padding:24px 28px; border:1px solid #dce8f2; border-radius:20px; background:#f4f8ff; }
.help-static-intro strong { color:#173c5c; font-size:24px; }
.help-static-intro p { margin:8px 0 0; color:#60788d; font-size:17px; line-height:1.65; }
.lead-form label { font-size:15px; }
.lead-form input,.lead-form select,.lead-form textarea { min-height:52px; padding:14px 16px; font-size:16px; }
.lead-form textarea { min-height:120px; }
.consent { flex-direction:row!important; align-items:flex-start; font-size:15px!important; line-height:1.55; }
.consent input { width:20px; min-height:20px; margin-top:2px; }
.form-submit { border:0; cursor:pointer; font:inherit; }
.legal-page { padding-top:180px; padding-bottom:110px; }
.legal-page h1 { max-width:900px; margin:18px 0 14px; color:#102f4b; font-size:clamp(44px,6vw,82px); line-height:1.03; }
.legal-lead { color:#668096; font-size:18px; }
.legal-page article { max-width:920px; margin-top:56px; padding:clamp(28px,5vw,60px); border:1px solid #dce8f2; border-radius:28px; background:#fff; box-shadow:0 18px 45px rgba(26,57,96,.08); }
.legal-page article h2 { margin:34px 0 10px; color:#173c5c; font-size:28px; }
.legal-page article h2:first-child { margin-top:0; }
.legal-page article p { color:#567086; font-size:18px; line-height:1.75; }
.result-page { display:grid; min-height:74vh; place-items:center; padding:180px 24px 100px; text-align:center; }
.result-page>div { max-width:720px; padding:48px; border:1px solid #dce8f2; border-radius:28px; background:#fff; box-shadow:0 22px 60px rgba(26,57,96,.12); }
.result-page img { width:120px; height:120px; object-fit:contain; }
.result-page h1 { margin:20px 0 14px; color:#173c5c; font-size:clamp(40px,6vw,68px); }
.result-page p { margin:0 0 30px; color:#60788d; font-size:19px; line-height:1.65; }
@media(max-width:760px) { .static-gallery-grid { grid-template-columns:1fr; } .static-shot.featured-shot { grid-column:auto; } .static-shot figcaption strong { font-size:20px; } .legal-page { padding-top:130px; } .result-page>div { padding:32px 22px; } }

/* Layout corrections requested from desktop screenshots */
.help-hero {
  display:flex;
  min-height:560px;
  align-items:center;
  padding:150px max(32px,calc((100vw - 1320px)/2)) 100px;
}
.help-hero>div {
  width:100%;
  max-width:1180px;
}
.help-hero .eyebrow { margin-bottom:24px; }
.help-hero h1 {
  max-width:1180px;
  font-size:clamp(54px,5vw,76px);
  line-height:1.03;
}
.help-hero>div>p:last-child {
  max-width:860px;
  margin:30px 0 0;
  color:#526174;
  font-size:19px;
  line-height:1.7;
}
@media(min-width:981px) {
  .screenshots-section .split-heading {
    grid-template-columns:minmax(0,1.3fr) minmax(360px,.7fr);
    gap:48px;
  }
  .screenshots-section .section-heading h2 {
    max-width:860px;
    font-size:clamp(48px,4vw,64px);
    line-height:1.05;
  }
}
@media(max-width:620px) {
  .help-hero {
    min-height:auto;
    padding:130px 20px 72px;
  }
  .help-hero h1 {
    font-size:clamp(42px,12vw,52px);
    line-height:1.04;
  }
  .help-hero>div>p:last-child {
    margin-top:24px;
    font-size:17px;
  }
}

/* Compact screenshot gallery without JavaScript */
.compact-gallery {
  overflow:hidden;
  border:1px solid #dbe4ef;
  border-radius:30px;
  background:#fff;
  box-shadow:0 30px 80px rgba(49,46,129,.13);
}
.gallery-choice {
  position:absolute;
  width:1px;
  height:1px;
  opacity:0;
  pointer-events:none;
}
.compact-gallery-stage {
  padding:24px;
  background:linear-gradient(145deg,#edf5ff,#f8f1ff);
}
.compact-gallery-panel {
  position:relative;
  display:none;
  overflow:hidden;
  margin:0;
  border:1px solid #d9e2ee;
  border-radius:20px;
  background:#fff;
}
.compact-gallery-panel img {
  display:block;
  width:100%;
  max-height:720px;
  object-fit:contain;
  object-position:top center;
  background:#f8faff;
}
.compact-gallery-panel.mobile img {
  height:min(68vh,720px);
  padding:18px;
  object-fit:contain;
  background:linear-gradient(145deg,#eef5ff,#f8f1ff);
}
.compact-gallery-panel figcaption {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:24px;
  padding:20px 24px;
  border-top:1px solid #e5eaf2;
}
.compact-gallery-panel figcaption strong { color:#172554; font-size:22px; }
.compact-gallery-panel figcaption span { color:#526174; font-size:16px; line-height:1.55; text-align:right; }
.screen-kind {
  position:absolute;
  z-index:2;
  top:16px;
  left:16px;
  padding:8px 12px;
  border:1px solid rgba(124,58,237,.2);
  border-radius:999px;
  color:#5b21b6;
  background:rgba(255,255,255,.94);
  font-size:13px;
  font-weight:850;
  box-shadow:0 8px 20px rgba(30,41,59,.12);
}
.compact-gallery-thumbs {
  display:grid;
  grid-template-columns:repeat(6,minmax(0,1fr));
  gap:12px;
  padding:18px;
}
.compact-gallery-thumbs label {
  display:grid;
  grid-template-columns:64px minmax(0,1fr);
  grid-template-rows:auto auto;
  gap:3px 10px;
  align-items:center;
  min-width:0;
  padding:8px;
  border:1px solid #dce5f0;
  border-radius:13px;
  color:#526174;
  background:#fff;
  cursor:pointer;
  transition:border-color .2s,box-shadow .2s,background .2s;
}
.compact-gallery-thumbs label:hover { border-color:#8b5cf6; background:#faf7ff; }
.compact-gallery-thumbs img {
  grid-row:1/3;
  width:64px;
  height:48px;
  border-radius:8px;
  object-fit:cover;
  object-position:top;
  background:#edf3fb;
}
.compact-gallery-thumbs span { overflow:hidden; font-size:13px; font-weight:800; line-height:1.25; text-overflow:ellipsis; white-space:nowrap; }
.compact-gallery-thumbs small { color:#7c8798; font-size:11px; }
@media(max-width:1100px) {
  .compact-gallery-thumbs { grid-template-columns:repeat(3,minmax(0,1fr)); }
}
@media(max-width:620px) {
  .compact-gallery { border-radius:20px; }
  .compact-gallery-stage { padding:10px; }
  .compact-gallery-panel { border-radius:14px; }
  .compact-gallery-panel.mobile img { height:62vh; padding:10px; }
  .compact-gallery-panel figcaption { align-items:flex-start; flex-direction:column; gap:6px; padding:16px; }
  .compact-gallery-panel figcaption strong { font-size:20px; }
  .compact-gallery-panel figcaption span { font-size:15px; text-align:left; }
  .compact-gallery-thumbs { grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; padding:10px; }
  .compact-gallery-thumbs label { grid-template-columns:48px minmax(0,1fr); }
  .compact-gallery-thumbs img { width:48px; height:44px; }
  .compact-gallery-thumbs span { font-size:12px; }
  .screen-kind { top:10px; left:10px; font-size:11px; }
}
#gallery-shot-1:checked ~ .compact-gallery-stage .compact-gallery-panel:nth-child(1) { display:grid; }
#gallery-shot-1:checked ~ .compact-gallery-thumbs label:nth-child(1) { border-color:#7c3aed; color:#5b21b6; background:#f7f2ff; box-shadow:0 0 0 3px rgba(124,58,237,.12); }
#gallery-shot-2:checked ~ .compact-gallery-stage .compact-gallery-panel:nth-child(2) { display:grid; }
#gallery-shot-2:checked ~ .compact-gallery-thumbs label:nth-child(2) { border-color:#7c3aed; color:#5b21b6; background:#f7f2ff; box-shadow:0 0 0 3px rgba(124,58,237,.12); }
#gallery-shot-3:checked ~ .compact-gallery-stage .compact-gallery-panel:nth-child(3) { display:grid; }
#gallery-shot-3:checked ~ .compact-gallery-thumbs label:nth-child(3) { border-color:#7c3aed; color:#5b21b6; background:#f7f2ff; box-shadow:0 0 0 3px rgba(124,58,237,.12); }
#gallery-shot-4:checked ~ .compact-gallery-stage .compact-gallery-panel:nth-child(4) { display:grid; }
#gallery-shot-4:checked ~ .compact-gallery-thumbs label:nth-child(4) { border-color:#7c3aed; color:#5b21b6; background:#f7f2ff; box-shadow:0 0 0 3px rgba(124,58,237,.12); }
#gallery-shot-5:checked ~ .compact-gallery-stage .compact-gallery-panel:nth-child(5) { display:grid; }
#gallery-shot-5:checked ~ .compact-gallery-thumbs label:nth-child(5) { border-color:#7c3aed; color:#5b21b6; background:#f7f2ff; box-shadow:0 0 0 3px rgba(124,58,237,.12); }
#gallery-shot-6:checked ~ .compact-gallery-stage .compact-gallery-panel:nth-child(6) { display:grid; }
#gallery-shot-6:checked ~ .compact-gallery-thumbs label:nth-child(6) { border-color:#7c3aed; color:#5b21b6; background:#f7f2ff; box-shadow:0 0 0 3px rgba(124,58,237,.12); }
#gallery-shot-7:checked ~ .compact-gallery-stage .compact-gallery-panel:nth-child(7) { display:grid; }
#gallery-shot-7:checked ~ .compact-gallery-thumbs label:nth-child(7) { border-color:#7c3aed; color:#5b21b6; background:#f7f2ff; box-shadow:0 0 0 3px rgba(124,58,237,.12); }
#gallery-shot-8:checked ~ .compact-gallery-stage .compact-gallery-panel:nth-child(8) { display:grid; }
#gallery-shot-8:checked ~ .compact-gallery-thumbs label:nth-child(8) { border-color:#7c3aed; color:#5b21b6; background:#f7f2ff; box-shadow:0 0 0 3px rgba(124,58,237,.12); }
#gallery-shot-9:checked ~ .compact-gallery-stage .compact-gallery-panel:nth-child(9) { display:grid; }
#gallery-shot-9:checked ~ .compact-gallery-thumbs label:nth-child(9) { border-color:#7c3aed; color:#5b21b6; background:#f7f2ff; box-shadow:0 0 0 3px rgba(124,58,237,.12); }
#gallery-shot-10:checked ~ .compact-gallery-stage .compact-gallery-panel:nth-child(10) { display:grid; }
#gallery-shot-10:checked ~ .compact-gallery-thumbs label:nth-child(10) { border-color:#7c3aed; color:#5b21b6; background:#f7f2ff; box-shadow:0 0 0 3px rgba(124,58,237,.12); }
#gallery-shot-11:checked ~ .compact-gallery-stage .compact-gallery-panel:nth-child(11) { display:grid; }
#gallery-shot-11:checked ~ .compact-gallery-thumbs label:nth-child(11) { border-color:#7c3aed; color:#5b21b6; background:#f7f2ff; box-shadow:0 0 0 3px rgba(124,58,237,.12); }
#gallery-shot-12:checked ~ .compact-gallery-stage .compact-gallery-panel:nth-child(12) { display:grid; }
#gallery-shot-12:checked ~ .compact-gallery-thumbs label:nth-child(12) { border-color:#7c3aed; color:#5b21b6; background:#f7f2ff; box-shadow:0 0 0 3px rgba(124,58,237,.12); }


/* HostApart demo role entry and legal documents - 2026-09-05 */
.hero-demo-roles { display:grid; grid-template-columns:1fr 1fr; gap:12px; margin-top:14px; }
.demo-role-button { min-width:0; display:grid; grid-template-columns:auto minmax(0,1fr) auto; align-items:center; gap:12px; padding:16px; border:1px solid #dce5f0; border-radius:16px; color:#172554; background:linear-gradient(145deg,#eff6ff,#faf5ff); transition:transform .2s ease,border-color .2s ease,box-shadow .2s ease; }
.demo-role-button:hover { transform:translateY(-2px); border-color:#8b5cf6; box-shadow:0 12px 24px rgba(79,70,229,.13); }
.demo-role-button>span:nth-child(2) { min-width:0; }
.demo-role-button small,.demo-role-button strong { display:block; }
.demo-role-button small { margin-bottom:5px; color:#667085; font-size:12px; }
.demo-role-button strong { color:#172554; font-size:15px; line-height:1.3; }
.demo-role-button>b { color:#7c3aed; font-size:19px; }
.demo-role-icon { width:40px; height:40px; display:grid; place-items:center; flex:none; border-radius:12px; color:#fff; font-weight:850; background:linear-gradient(135deg,#2563eb,#7c3aed); }
.demo-role-icon.staff { background:linear-gradient(135deg,#7c3aed,#9333ea); }

.demo-role-grid { display:grid; grid-template-columns:1fr 1fr; gap:18px; }
.demo-role-card { min-height:245px; display:flex; flex-direction:column; align-items:flex-start; padding:28px; border:1px solid rgba(255,255,255,.22); border-radius:22px; color:#fff; background:linear-gradient(145deg,rgba(255,255,255,.14),rgba(255,255,255,.07)); box-shadow:0 20px 44px rgba(0,0,0,.13); transition:transform .2s ease,background .2s ease,border-color .2s ease; }
.demo-role-card:hover { transform:translateY(-4px); border-color:rgba(147,197,253,.75); background:rgba(255,255,255,.16); }
.demo-role-card .demo-role-number { color:#93c5fd; font-size:15px; font-weight:850; letter-spacing:.12em; }
.demo-role-card small { margin-top:34px; color:#cbd5e1; font-size:15px; line-height:1.5; }
.demo-role-card strong { margin-top:8px; color:#fff; font-size:clamp(20px,2vw,27px); line-height:1.25; }
.demo-role-card b { margin-top:auto; padding-top:24px; color:#a7f3d0; font-size:16px; }

.consent a { color:#5b35d5; text-decoration:underline; text-underline-offset:2px; }
.consent a:hover { color:#2563eb; }

.legal-page { max-width:1180px; }
.legal-page>h1 { max-width:1050px; }
.legal-page article { max-width:1050px; }
.legal-page article h3 { margin:0 0 8px; color:#173c5c; font-size:20px; line-height:1.35; }
.legal-page article p,.legal-page article li,.legal-page article td,.legal-page article th { color:#526c82; font-size:17px; line-height:1.72; }
.legal-page article strong { color:#173c5c; }
.legal-page article a { color:#2563eb; text-decoration:underline; text-underline-offset:3px; }
.legal-page article ul,.legal-page article ol { margin:12px 0 18px; padding-left:24px; }
.legal-page article li+li { margin-top:8px; }
.legal-summary,.legal-callout { max-width:1050px; margin:28px 0 0; padding:24px 28px; border:1px solid #cfe0ff; border-radius:20px; background:linear-gradient(135deg,#eff6ff,#faf5ff); }
.legal-summary strong,.legal-callout strong { display:block; color:#4338ca; font-size:18px; }
.legal-summary p,.legal-callout p { margin:8px 0 0; color:#526c82; font-size:16px; line-height:1.7; }
.legal-grid { display:grid; grid-template-columns:1fr 1fr; gap:16px; margin:18px 0 24px; }
.legal-grid section { padding:22px; border:1px solid #dce8f2; border-radius:18px; background:#f8fbff; }
.legal-grid section p { margin:0; font-size:16px; }
.legal-table-wrap { width:100%; overflow-x:auto; margin:18px 0 26px; border:1px solid #dce8f2; border-radius:18px; }
.legal-table { width:100%; min-width:720px; border-collapse:collapse; background:#fff; }
.legal-table th,.legal-table td { padding:16px 18px; border-bottom:1px solid #e4ebf2; text-align:left; vertical-align:top; }
.legal-table thead th,.legal-table tbody th { color:#173c5c; font-weight:800; background:#f2f7ff; }
.legal-table tr:last-child td,.legal-table tr:last-child th { border-bottom:0; }

@media(max-width:760px) {
  .hero-demo-roles,.demo-role-grid,.legal-grid { grid-template-columns:1fr; }
  .demo-role-card { min-height:210px; }
  .legal-page article p,.legal-page article li,.legal-page article td,.legal-page article th { font-size:16px; }
  .legal-summary,.legal-callout { padding:20px; }
}

.signup-promises{display:grid;gap:10px;margin:24px 0}.signup-promises>span{display:grid;grid-template-columns:28px 1fr;gap:4px 12px;padding:14px 0;border-top:1px solid #e2e8f0;color:#2563eb;font-weight:800}.signup-promises b{color:#173c5c;font-size:16px}.signup-promises small{grid-column:2;color:#64748b;font-size:14px;font-weight:500;line-height:1.5}.form-card>a.form-submit{display:flex;width:100%;justify-content:center;text-align:center}

.cookie-settings-link {
  display: block;
  margin: 1rem auto 0;
  border: 0;
  background: transparent;
  color: inherit;
  font: inherit;
  font-size: .82rem;
  text-decoration: underline;
  text-underline-offset: .2em;
  cursor: pointer;
  opacity: .78;
}
.cookie-settings-link:hover,
.cookie-settings-link:focus-visible { opacity: 1; }
#cc-main { --cc-font-family: Inter, Arial, sans-serif; --cc-btn-primary-bg: #2563eb; --cc-btn-primary-hover-bg: #1d4ed8; --cc-btn-primary-border-color: #2563eb; --cc-btn-secondary-bg: #f1f5f9; --cc-btn-secondary-color: #172033; --cc-toggle-on-bg: #7c3aed; --cc-modal-border-radius: 1rem; --cc-btn-border-radius: .65rem; --cc-z-index: 10000; }

/* Keep the signal content inside narrow phone columns, rather than clipping the page. */
@media(max-width:620px) {
  .signal-strip { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .signal-strip>div {
    min-width:0;
    flex-direction:column;
    gap:8px;
    padding:16px 8px;
    text-align:center;
  }
  .signal-strip strong { font-size:clamp(24px,7vw,34px); }
  .signal-strip span { min-width:0; overflow-wrap:anywhere; }
}