:root{--ink:#14343b;--muted:#52686e;--teal:#006b60;--lime:#dbedac;--paper:#f6f7f2;--line:#d9e3df;--white:#fff;--danger:#9b3030;--shadow:0 18px 60px #14343b0c;font-family:Inter,ui-sans-serif,-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;color:var(--ink);background:var(--paper);font-size:16px}*{box-sizing:border-box}body{margin:0}a{color:inherit;text-underline-offset:4px}button,input,select,textarea{font:inherit}button,a.btn{cursor:pointer}button,.btn{border:1px solid var(--ink);background:var(--ink);color:white;border-radius:8px;padding:12px 18px;font-weight:600;text-decoration:none;display:inline-flex;align-items:center;justify-content:center;gap:8px;line-height:1.3}button:hover,.btn:hover{background:#28515b}button.secondary,.btn.secondary{background:transparent;color:var(--ink);border-color:var(--line)}button.secondary:hover,.btn.secondary:hover{background:#e6eeea}button.danger{background:white;color:var(--danger);border-color:#d4a8a8}button:disabled{opacity:.5;cursor:wait}a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,canvas:focus-visible{outline:3px solid #ca9d25;outline-offset:3px}h1,h2,h3,p{margin-top:0}h1{font-size:clamp(2.5rem,5.5vw,4.7rem);line-height:1.06;letter-spacing:-.055em;font-weight:650}h2{font-size:clamp(1.8rem,3vw,2.5rem);letter-spacing:-.035em;line-height:1.15}h3{font-size:1.15rem}p{line-height:1.7;color:var(--muted)}small,.small{font-size:.82rem;color:var(--muted)}header{display:flex;align-items:center;justify-content:space-between;gap:24px;padding:24px max(5vw,24px);border-bottom:1px solid var(--line);background:var(--paper)}.logo{font-size:1.4rem;font-weight:750;letter-spacing:-.05em;text-decoration:none;display:flex;align-items:center;gap:10px}.mark{background:var(--teal);color:var(--lime);border-radius:9px;padding:5px 8px;letter-spacing:0}.logo small{display:block;font-size:.58rem;letter-spacing:.14em;margin-top:3px}.topnav{display:flex;align-items:center;gap:24px;font-size:.9rem}.topnav a{text-decoration:none}.topnav a[aria-current=page]{color:var(--teal);text-decoration:underline}.container{max-width:1220px;margin:auto;padding:64px 28px}.hero{display:grid;grid-template-columns:1.05fr 1fr;gap:70px;align-items:center;min-height:650px}.eyebrow{font-size:.75rem;text-transform:uppercase;letter-spacing:.14em;color:var(--teal);font-weight:750;margin-bottom:24px}.lead{font-size:1.12rem;max-width:540px}.actions{display:flex;flex-wrap:wrap;gap:12px;margin:26px 0}.trust{display:flex;gap:20px;flex-wrap:wrap;font-size:.8rem;color:var(--muted);margin-top:32px}.trust span:before{content:'✓ ';color:var(--teal);font-weight:700}.preview{background:#e0eae3;border-radius:20px;padding:30px 22px;transform:rotate(-1deg);box-shadow:var(--shadow)}.preview-inner{background:white;border-radius:10px;padding:24px;border:1px solid var(--line)}.preview-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:30px}.preview-row{display:flex;justify-content:space-between;padding:15px 0;border-top:1px solid var(--line);font-size:.85rem}.preview-sign{background:var(--paper);border:1px dashed #91b8ac;margin:20px 0;padding:26px;text-align:center;color:var(--teal);font:italic 1.7rem Georgia,serif}.strip{background:var(--ink);color:white;padding:24px;text-align:center;font-size:.85rem}.section-top{max-width:630px;margin-bottom:36px}.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}.grid.two{grid-template-columns:repeat(2,1fr)}.card{padding:28px;background:white;border:1px solid var(--line);border-radius:12px;box-shadow:var(--shadow)}.card .num{font-size:.8rem;color:var(--teal);display:block;margin-bottom:28px}.card p:last-child{margin-bottom:0}.band{background:#e5ede7;border-radius:16px;padding:48px;display:flex;justify-content:space-between;align-items:center;gap:30px}.band h2{max-width:550px}.pill{display:inline-block;border:1px solid #b9d6ca;border-radius:30px;padding:5px 10px;background:#eaf4ee;color:#21634b;font-size:.72rem;white-space:nowrap}.pill.pending{background:#fff7df;border-color:#ead9a4;color:#725313}.pill.declined,.pill.cancelled{background:#fbeceb;border-color:#edcac6;color:#8b3731}.pill.expired{background:#edf0f2;color:#56616b;border-color:#d5dbe0}.pill.processing{background:#fff7df;border-color:#ead9a4;color:#725313}.pill.processing_error{background:#fbeceb;border-color:#edcac6;color:#8b3731}.pilot{background:#fff4d9;color:#664900;padding:12px 24px;text-align:center;font-size:.8rem;line-height:1.5}.page-title{max-width:800px}.page-title h1{font-size:clamp(2.3rem,5vw,3.7rem)}footer{padding:36px max(5vw,24px);border-top:1px solid var(--line);display:flex;justify-content:space-between;gap:30px;font-size:.8rem}footer nav{display:flex;gap:20px;flex-wrap:wrap}.skip{position:absolute;left:16px;top:-60px;z-index:20;background:white;padding:12px}.skip:focus{top:16px}label{display:block;font-size:.85rem;font-weight:600;margin:16px 0 7px}input,select,textarea{display:block;width:100%;padding:12px;border:1px solid #afc3bd;border-radius:7px;background:white;color:var(--ink)}input[type=checkbox]{display:inline-block;width:auto;vertical-align:middle;margin-right:8px}textarea{min-height:120px}.fields{display:grid;grid-template-columns:1fr 1fr;gap:0 16px}.error{background:#ffebeb;border:1px solid #e9b6b6;color:#8d2525;border-radius:8px;padding:14px;margin:16px 0}.success{background:#e6f2e9;padding:16px;border-radius:8px;color:#245c3a}.muted{color:var(--muted)}.shell{display:grid;grid-template-columns:230px minmax(0,1fr);min-height:100vh}.sidebar{padding:28px 20px;background:var(--ink);color:#eaf2ed;display:flex;flex-direction:column;gap:24px}.sidebar .mark{background:#32615e}.sidebar nav{display:flex;flex-direction:column;gap:6px}.sidebar nav button{justify-content:flex-start;background:transparent;color:#eaf2ed;border:0;font-weight:450}.sidebar nav button.active{background:#ffffff15;border-left:3px solid var(--lime);border-radius:0 6px 6px 0}.sidebar p{color:#b5c8c8;font-size:.78rem}.workspace{padding:32px 40px;min-width:0}.workspace h1{font-size:2rem;letter-spacing:-.035em}.workspace-top{display:flex;justify-content:space-between;gap:20px;align-items:flex-start;margin-bottom:28px}.metrics{display:grid;grid-template-columns:repeat(5,1fr);gap:16px;margin:24px 0}.metric{padding:22px;background:white;border:1px solid var(--line);border-radius:10px}.metric strong{display:block;font-size:2rem;margin-top:10px}.toolbar{display:flex;gap:12px;align-items:center;flex-wrap:wrap;margin:24px 0}.toolbar input{max-width:300px}.toolbar select{max-width:180px}.table-wrap{overflow-x:auto;background:white;border:1px solid var(--line);border-radius:10px}table{border-collapse:collapse;width:100%;font-size:.85rem}th{text-align:left;color:var(--muted);font-size:.7rem;letter-spacing:.06em;text-transform:uppercase;background:#f0f5f1}td,th{padding:16px;border-bottom:1px solid var(--line);white-space:nowrap}td button{font-size:.75rem;padding:7px 10px}.empty{text-align:center;padding:60px 24px}.empty h3{margin-top:16px}.empty p{max-width:440px;margin:0 auto 20px}.row-actions{display:flex;gap:8px}.panel{background:white;padding:28px;border:1px solid var(--line);border-radius:12px}.panel.narrow{max-width:540px;margin:35px auto}.subnav{display:flex;gap:10px;flex-wrap:wrap;margin:24px 0}.subnav a{padding:10px 14px;border:1px solid var(--line);border-radius:6px;text-decoration:none}.subnav .active{background:var(--ink);color:white}.note{border-left:3px solid var(--teal);padding:12px 18px;background:#e9f0ec;font-size:.86rem;line-height:1.6;margin:20px 0}.dialog-backdrop{position:fixed;inset:0;background:#0c252aaa;z-index:50;display:grid;place-items:center;padding:20px}.dialog{background:var(--paper);padding:32px;max-width:720px;width:100%;max-height:90vh;overflow:auto;border-radius:14px;box-shadow:var(--shadow)}.dialog-head{display:flex;justify-content:space-between;gap:20px;align-items:start}.dialog-head button{padding:5px 12px}.signature{width:100%;height:160px;background:white;border:1px solid #94afa6;border-radius:8px;touch-action:none}.receipt{max-width:800px;margin:auto;background:white;padding:40px;border:1px solid var(--line)}.receipt dl{display:grid;grid-template-columns:150px 1fr;gap:16px}.receipt dd{margin:0}.signature-image{max-width:100%;height:140px;object-fit:contain}.progress{display:flex;gap:8px;flex-wrap:wrap;font-size:.8rem;margin-bottom:28px}.progress span{padding:8px 12px;border-radius:30px;background:#e7efeb}.progress span.current{background:var(--ink);color:white}#notice{position:fixed;bottom:24px;right:24px;background:var(--ink);color:white;padding:14px 22px;border-radius:8px;max-width:420px;z-index:100}#notice:empty{display:none}.loading{padding:60px;text-align:center}.mobile-menu{display:none}.list li{margin:14px 0;color:var(--muted);line-height:1.6}.price{font-size:2rem;font-weight:700;display:block;margin:24px 0}.login-wrap{min-height:75vh;display:grid;place-items:center;padding:24px}.login-wrap .panel{width:100%;max-width:440px}.accent{color:var(--teal)}.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0)}@media(max-width:900px){.hero{grid-template-columns:1fr;gap:36px;min-height:0}.hero h1{max-width:650px}.grid{grid-template-columns:1fr 1fr}.topnav{gap:14px;flex-wrap:wrap;justify-content:flex-end}.shell{grid-template-columns:180px 1fr}.workspace{padding:24px}.metrics{grid-template-columns:1fr 1fr}.band{display:block}.preview{max-width:600px}}@media(max-width:620px){header{align-items:flex-start;padding:18px;flex-wrap:wrap}.topnav{width:100%;justify-content:flex-start;font-size:.82rem;gap:16px}.topnav .btn{padding:8px 12px}.container{padding:40px 20px}.hero h1{font-size:2.8rem}.grid,.grid.two,.fields{grid-template-columns:1fr}.preview{padding:16px}.band{padding:28px}.shell{display:block}.sidebar{padding:18px;gap:18px}.sidebar nav{flex-direction:row;overflow:auto}.sidebar nav button{white-space:nowrap;padding:10px}.sidebar p{display:none}.workspace{padding:24px 16px}.workspace-top{flex-wrap:wrap}.metric{padding:16px}.metric strong{font-size:1.6rem}.receipt{padding:24px}.receipt dl{grid-template-columns:1fr;gap:6px}.receipt dd{margin-bottom:16px}footer{flex-direction:column}.dialog{padding:22px}.actions .btn,.actions button{flex-grow:1}.trust{gap:12px}h1{overflow-wrap:anywhere}}@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;animation:none!important}}@media print{header,footer,.sidebar,.pilot,.actions,.toolbar,#notice,.dialog-head button{display:none!important}.shell{display:block}.workspace,.container{padding:0}.receipt{border:0;max-width:none}body{background:white}.receipt h1{font-size:24pt}.dialog-backdrop{position:static;background:none}.dialog{max-height:none;overflow:visible;max-width:none;box-shadow:none}}

.table-wrap{position:relative}
@media print{body:has(.dialog-backdrop) #app{display:none!important}}
.queue-pagination{display:flex;align-items:center;justify-content:space-between;gap:16px;margin:16px 0;color:var(--muted);font-size:.85rem}.queue-pagination>div{display:flex;align-items:center;gap:12px}.queue-pagination button{padding:8px 12px}
@media(max-width:620px){.queue-pagination{align-items:flex-start;flex-direction:column}.queue-pagination>div{width:100%;justify-content:space-between}}
.patient-template-fields{margin:20px 0;padding:20px}.patient-template-fields h3{margin-bottom:10px}.patient-template-fields .tablet-extra-field-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px 18px}.patient-answer-field{min-width:0}.patient-answer-field small{display:block;line-height:1.5;margin-top:6px}.patient-answer-field[hidden],.patient-answer-field[data-notification-other][hidden],#assignor-draw-wrap[hidden]{display:none!important}.patient-answer-field[data-assignor-field][hidden]{display:none!important}.service-rows-field{grid-column:1/-1;border:1px solid var(--line);border-radius:8px;padding:16px;min-width:0}.service-row-fields{display:grid;grid-template-columns:minmax(150px,.8fr) minmax(200px,1.2fr) minmax(200px,1.2fr);gap:12px;align-items:end;padding:14px 0;border-top:1px solid var(--line)}.service-row-fields strong{grid-column:1/-1;color:var(--teal)}.service-row-fields label{margin:0;font-size:.8rem}.service-row-fields input{margin-top:6px}@media(max-width:620px){.patient-template-fields .tablet-extra-field-grid{grid-template-columns:1fr}.service-row-fields{grid-template-columns:1fr}.service-row-fields strong{grid-column:auto}}
.assignment-choice{margin:20px 0;padding:16px;border:1px solid var(--line);border-radius:8px;min-width:0}.assignment-choice legend{padding:0 6px;font-weight:700}.assignment-choice label{display:flex;align-items:flex-start;gap:10px;line-height:1.5;margin:10px 0;max-width:100%}.assignment-choice input{flex:0 0 auto;margin-top:5px}

.provisioning-package-list{display:grid;gap:16px;margin:20px 0}.provisioning-package{min-width:0;padding:20px;background:var(--white);border:1px solid var(--line);border-radius:12px;box-shadow:var(--shadow)}.provisioning-package-head{display:flex;justify-content:space-between;align-items:flex-start;gap:16px}.provisioning-package-head h3{margin:0 0 8px}.provisioning-package-meta{margin:0 0 8px;color:var(--muted);font-size:.82rem;line-height:1.5}.provisioning-package-meta code{overflow-wrap:anywhere}.provisioning-package-id{display:block;max-width:100%;overflow-wrap:anywhere;font-size:.78rem}.provisioning-package-hash{overflow-wrap:anywhere;margin:12px 0}.provisioning-package-stages{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin:18px 0 0}.provisioning-stage{min-width:0;padding:14px;background:#f5f8f5;border:1px solid var(--line);border-radius:9px}.provisioning-stage h4{margin:0 0 7px;color:var(--muted);font-size:.72rem;letter-spacing:.07em;text-transform:uppercase}.provisioning-stage p{margin:0 0 8px;font-size:.88rem;line-height:1.5;overflow-wrap:anywhere}.provisioning-stage .small{display:block;line-height:1.5;overflow-wrap:anywhere}.provisioning-stage button,.provisioning-package-actions button{max-width:100%;white-space:normal;text-align:center}.provisioning-package-actions{display:flex;flex-wrap:wrap;gap:8px}@media(max-width:900px){.provisioning-package-stages{grid-template-columns:1fr}}
.provisioning-stage p{display:flex;align-items:center;gap:8px;flex-wrap:wrap}.provisioning-status{display:inline-flex;align-items:center;min-height:25px;padding:4px 10px;border:1px solid #d7e0dc;border-radius:999px;background:#f1f4f2;color:#4f6260;font-size:.73rem;font-weight:750;letter-spacing:.015em;white-space:nowrap}.provisioning-status.ready{border-color:#afd5c1;background:#e9f5ee;color:#216447}.provisioning-status.working{border-color:#e8d396;background:#fff7df;color:#735713}.provisioning-status.failed{border-color:#e8c1bd;background:#fff0ee;color:#8b3630}.provisioning-stage-label{color:var(--muted);font-size:.78rem;text-transform:capitalize}.provisioning-stage .btn{margin-top:8px;padding:9px 12px;font-size:.8rem}
@media(max-width:620px){.provisioning-package{padding:16px}.provisioning-package-head{display:block}.provisioning-package-actions{margin-top:12px}.provisioning-package-hash{font-size:.78rem}.provisioning-stage{padding:12px}}
.product-surface-links{display:grid;gap:8px}.product-surface-links a{color:#eaf2ed;font-size:.8rem;text-decoration:none}.product-surface-links a:hover{text-decoration:underline;text-underline-offset:3px}.product-surface-links a:focus-visible{outline-color:var(--lime)}
.sidebar>#logout{color:#eaf2ed;border-color:#72878a}.sidebar>#logout:hover{color:var(--ink)}
.skip-link{position:fixed;z-index:1000;top:12px;left:12px;transform:translateY(-180%);padding:12px 16px;border-radius:8px;background:var(--ink);color:#fff;font-weight:700;text-decoration:none;box-shadow:0 0 0 2px #fff}.skip-link:focus{transform:translateY(0)}:where(a,button,input,select,textarea,[tabindex]):focus-visible{outline:3px solid #00584f;outline-offset:3px;box-shadow:0 0 0 2px #fff}

.enquiries-table{width:100%;min-width:0;table-layout:fixed}
.enquiries-table th,.enquiries-table td{white-space:normal;overflow-wrap:anywhere;vertical-align:top}
.enquiries-table th:nth-child(1){width:14%}
.enquiries-table th:nth-child(2){width:24%}
.enquiries-table th:nth-child(3){width:16%}
.enquiries-table th:nth-child(4){width:16%}
.enquiries-table th:nth-child(5){width:30%}
.enquiries-table .row-actions{display:grid;grid-template-columns:1fr;gap:6px}
.enquiries-table .row-actions button{width:100%;max-width:100%;white-space:normal;text-align:center;padding:7px 8px;line-height:1.3}
@media(max-width:620px){.enquiries-table{min-width:760px}.enquiries-table th:last-child,.enquiries-table td:last-child{position:sticky;right:0;z-index:1;background:white;box-shadow:-5px 0 8px #14343b0c}.enquiries-table th:last-child{background:#f0f5f1}}
.local-service-stage{grid-column:1/-1}.local-service-stage .btn{display:inline-flex;margin:4px 8px 0 0}
.metrics button.metric{display:flex;flex-direction:column;align-items:flex-start;justify-content:center;width:100%;min-width:0;min-height:100%;color:var(--ink);text-align:left;line-height:1.4}.metrics button.metric:hover{background:#f5f8f5;border-color:var(--teal)}.platform-activity-list{display:grid;gap:12px;list-style:none;margin:0 0 18px;padding:0}.platform-activity-list li{min-width:0;padding:12px 14px;background:#f5f8f5;border:1px solid var(--line);border-radius:8px}.platform-activity-list li strong,.platform-activity-list li span{display:block;overflow-wrap:anywhere}.platform-activity-list li span{margin-top:4px;color:var(--muted);font-size:.88rem;line-height:1.5}
.spam-trap{position:absolute!important;left:-10000px;top:auto;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0);clip-path:inset(50%);white-space:nowrap}
.funnel-stages{display:grid;grid-template-columns:repeat(auto-fit,minmax(130px,1fr));gap:10px;margin:16px 0}.funnel-stage{display:flex;min-width:0;min-height:82px;flex-direction:column;justify-content:center;gap:4px;padding:12px;background:#f5f8f5;border:1px solid var(--line);border-radius:8px}.funnel-stage strong{font-size:1.6rem;color:var(--teal);font-variant-numeric:tabular-nums}.funnel-stage span{font-size:.78rem;line-height:1.35;color:var(--muted);overflow-wrap:anywhere}

@media(forced-colors:active){
 :where(a,button,input,select,textarea,[tabindex]):focus-visible{outline:3px solid Highlight;outline-offset:3px;box-shadow:none}
 button,.btn{color:ButtonText;background:ButtonFace;border-color:ButtonText}
 button.secondary,.btn.secondary{color:ButtonText;border-color:ButtonText}
 .pill,.note,.card,.panel,.dialog,.funnel-stage{border-color:CanvasText}
}

/* Clinic launch pages and hardware choices. */
.hardware-hero{padding:16px;border-radius:28px;background:#edf3ed}.hardware-hero img{display:block;width:100%;height:auto}.hardware-caption{display:block;text-align:center;padding:14px;font-size:.85rem;color:#425c55}.compatibility-tags{display:flex;flex-wrap:wrap;gap:12px;margin:24px 0}.compatibility-tags span{padding:12px 18px;border:1px solid #cbd9d0;border-radius:999px;background:#fff;font-weight:600;color:#245c5c}.hardware-grid img{width:100%;height:auto;border-radius:14px;margin-bottom:18px}.hardware-price{display:block;color:#245c5c;font-size:1.35rem;margin:10px 0}.topnav{flex-wrap:wrap;justify-content:flex-end;gap:12px 16px}.enquiry-website{position:absolute!important;left:-10000px;width:1px;height:1px;overflow:hidden}#hosted-clinic-form .fields{grid-template-columns:repeat(2,minmax(0,1fr))}#hosted-clinic-form input[type=color]{height:44px;width:100%}.clinic-settings-summary{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}@media(max-width:700px){#hosted-clinic-form .fields,.clinic-settings-summary{grid-template-columns:1fr}.topnav{justify-content:flex-start;gap:10px}.hardware-grid{grid-template-columns:1fr}}

/* ClinicSign by ITGALAXY — V3 Flagship Branded Australian HealthTech Design System */


:root {
  --ink: #0A2540;
  --body-ink: #1E293B;
  --muted: #475569;
  --subtle: #64748B;
  --teal: #0F3D3E;
  --teal-dark: #082226;
  --emerald: #0D9488;
  --emerald-hover: #0F766E;
  --emerald-light: #CCFBF1;
  --lime: #BEF264;
  --amber: #F59E0B;
  --paper: #F8FAFC;
  --surface-tint: #F0FDFA;
  --line: #E2E8F0;
  --line-strong: #CBD5E1;
  --white: #FFFFFF;
  --danger: #B91C1C;
  --shadow-sm: 0 2px 8px -1px rgba(10, 37, 64, 0.05), 0 1px 3px 0 rgba(10, 37, 64, 0.04);
  --shadow: 0 12px 32px -4px rgba(15, 61, 62, 0.08), 0 4px 12px -2px rgba(10, 37, 64, 0.04);
  --shadow-lg: 0 24px 48px -12px rgba(10, 37, 64, 0.18);
  --radius-lg: 20px;
  --radius-md: 14px;
  font-family: 'Inter', ui-sans-serif, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  color: var(--body-ink);
  background: var(--white);
  font-size: 16px;
  scroll-behavior: smooth;
}

* { box-sizing: border-box; }

body {
  margin: 0;
  background: var(--white);
  color: var(--body-ink);
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
  overflow-x: hidden;
}

h1, h2, h3, h4, .logo {
  font-family: 'Plus Jakarta Sans', 'Inter', ui-sans-serif, -apple-system, sans-serif;
  color: var(--ink);
  margin-top: 0;
}

h1 {
  font-size: clamp(2.25rem, 4.1vw, 3.45rem);
  line-height: 1.1;
  letter-spacing: -0.032em;
  font-weight: 800;
  margin-bottom: 18px;
}

h2 {
  font-size: clamp(1.65rem, 2.8vw, 2.35rem);
  line-height: 1.18;
  letter-spacing: -0.024em;
  font-weight: 700;
  margin-bottom: 14px;
}

h3 {
  font-size: 1.22rem;
  line-height: 1.32;
  letter-spacing: -0.015em;
  font-weight: 700;
  margin-bottom: 10px;
}

p, li, dd, td, label, input, select, textarea, button {
  font-size: 1rem;
  line-height: 1.65;
}

a {
  color: var(--emerald);
  text-decoration: none;
  font-weight: 600;
  transition: color 0.15s ease;
}

a:hover { color: var(--emerald-hover); }

.skip, .skip-link {
  position: absolute;
  left: -9999px;
  top: 8px;
  background: var(--ink);
  color: var(--white);
  padding: 10px 16px;
  border-radius: 8px;
  z-index: 999;
}
.skip:focus, .skip-link:focus { left: 12px; }

/* ==========================================================================
   NEW CUSTOM VECTOR LOGO & MEGA-MENU HEADER
   ========================================================================== */
header.cs-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 12px clamp(18px, 4vw, 48px);
  border-bottom: 1px solid var(--line);
  background: rgba(255, 255, 255, 0.95);
  backdrop-filter: blur(16px);
  -webkit-backdrop-filter: blur(16px);
  position: sticky;
  top: 0;
  z-index: 120;
  box-shadow: 0 2px 10px rgba(10, 37, 64, 0.04);
}

.logo {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  text-decoration: none;
  font-weight: 800;
  font-size: 1.32rem;
  color: var(--ink);
  letter-spacing: -0.025em;
  flex-shrink: 0;
  transition: transform 0.18s ease;
}

.logo:hover {
  transform: translateY(-1px);
}

.mark-wrap {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 42px;
  height: 42px;
  border-radius: 13px;
  box-shadow: 0 6px 16px rgba(13, 148, 136, 0.28);
  transition: box-shadow 0.2s ease, transform 0.2s ease;
}

.logo:hover .mark-wrap {
  box-shadow: 0 8px 22px rgba(13, 148, 136, 0.38);
  transform: scale(1.03);
}

.logo-text {
  line-height: 1.05;
}

.logo-accent {
  font-style: normal;
  background: linear-gradient(135deg, #0D9488 0%, #10B981 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  color: var(--emerald);
}

.logo small {
  display: block;
  font-size: 0.62rem;
  letter-spacing: 0.16em;
  color: var(--emerald);
  font-weight: 800;
  margin-top: 3px;
}

.cs-mega-nav {
  display: flex;
  align-items: center;
  gap: 4px;
}

.nav-item { position: relative; }

.nav-trigger {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 9px 14px;
  border-radius: 10px;
  border: none;
  background: transparent;
  color: var(--body-ink);
  font-family: inherit;
  font-size: 0.93rem;
  font-weight: 600;
  cursor: pointer;
  transition: all 0.16s ease;
}

.nav-trigger:hover, .nav-item:hover .nav-trigger, .nav-item.open .nav-trigger {
  background: var(--surface-tint);
  color: var(--teal);
}

.nav-trigger .caret {
  font-size: 0.72rem;
  opacity: 0.7;
  transition: transform 0.2s ease;
}

.nav-item:hover .nav-trigger .caret, .nav-item.open .nav-trigger .caret {
  transform: rotate(180deg);
  color: var(--emerald);
}

.mega-dropdown {
  position: absolute;
  top: calc(100% + 8px);
  left: 0;
  min-width: 340px;
  background: var(--white);
  border: 1px solid var(--line);
  border-radius: 16px;
  padding: 12px;
  box-shadow: var(--shadow-lg);
  opacity: 0;
  visibility: hidden;
  transform: translateY(8px);
  transition: all 0.18s cubic-bezier(0.16, 1, 0.3, 1);
  z-index: 200;
}

.mega-dropdown::before {
  content: "";
  position: absolute;
  top: -12px;
  left: 0;
  right: 0;
  height: 12px;
}

.mega-dropdown.wide {
  min-width: 540px;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
}

.nav-item:hover .mega-dropdown,
.nav-item:focus-within .mega-dropdown,
.nav-item.open .mega-dropdown {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
}

.sub-link {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  padding: 11px 12px;
  border-radius: 12px;
  text-decoration: none;
  color: var(--ink);
  transition: background 0.15s ease, transform 0.15s ease;
}

.sub-link:hover {
  background: var(--surface-tint);
  transform: translateX(2px);
}

.sub-icon {
  width: 36px;
  height: 36px;
  border-radius: 10px;
  background: #F0FDFA;
  border: 1px solid #CCFBF1;
  color: var(--emerald);
  display: grid;
  place-items: center;
  font-size: 1.05rem;
  flex-shrink: 0;
  margin-top: 2px;
}

.sub-link strong {
  display: block;
  font-size: 0.92rem;
  font-weight: 700;
  color: var(--ink);
  line-height: 1.3;
}

.sub-link small {
  display: block;
  font-size: 0.8rem;
  font-weight: 400;
  color: var(--muted);
  line-height: 1.4;
  margin-top: 2px;
}

.mega-footer {
  grid-column: 1 / -1;
  margin-top: 6px;
  padding: 10px 14px;
  background: var(--paper);
  border-radius: 10px;
  border-top: 1px solid var(--line);
  display: flex;
  align-items: center;
  justify-content: space-between;
  font-size: 0.82rem;
  color: var(--muted);
}

.header-ctas {
  display: flex;
  align-items: center;
  gap: 10px;
}

.mobile-menu-btn {
  display: none;
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: 10px;
  padding: 8px 12px;
  font-weight: 700;
  color: var(--ink);
  cursor: pointer;
}

/* ==========================================================================
   BUTTONS & BADGES
   ========================================================================== */
.btn, button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  border: 1px solid transparent;
  border-radius: 10px;
  padding: 11px 20px;
  background: var(--emerald);
  color: var(--white) !important;
  font-family: 'Plus Jakarta Sans', 'Inter', sans-serif;
  font-weight: 700;
  font-size: 0.94rem;
  line-height: 1.25;
  cursor: pointer;
  text-decoration: none;
  box-shadow: 0 4px 12px rgba(13, 148, 136, 0.22);
  transition: all 0.18s ease;
}

.btn:hover, button:hover:not(:disabled) {
  background: var(--emerald-hover);
  transform: translateY(-1px);
  box-shadow: 0 6px 16px rgba(13, 148, 136, 0.3);
}

.btn.secondary, button.secondary {
  background: var(--white);
  color: var(--ink) !important;
  border: 1px solid var(--line-strong);
  box-shadow: var(--shadow-sm);
}

.btn.secondary:hover, button.secondary:hover:not(:disabled) {
  background: var(--paper);
  border-color: var(--emerald);
  color: var(--teal) !important;
}

.btn.ghost {
  background: rgba(255, 255, 255, 0.12);
  color: var(--white) !important;
  border: 1px solid rgba(255, 255, 255, 0.25);
  box-shadow: none;
}

.btn.ghost:hover {
  background: rgba(255, 255, 255, 0.22);
}

.btn.sm {
  padding: 8px 14px;
  font-size: 0.85rem;
  border-radius: 9px;
}

/* ==========================================================================
   CONTAINERS & SECTIONS
   ========================================================================== */
.container {
  width: min(1220px, calc(100% - 40px));
  margin: 0 auto;
  padding: clamp(36px, 5vw, 68px) 0;
}

.eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  text-transform: uppercase;
  letter-spacing: 0.11em;
  font-size: 0.76rem;
  font-weight: 800;
  color: var(--emerald);
  background: var(--surface-tint);
  border: 1px solid #CCFBF1;
  padding: 5px 12px;
  border-radius: 999px;
  margin-bottom: 14px;
}

.accent {
  color: var(--emerald);
  background: linear-gradient(120deg, rgba(190, 242, 100, 0.35) 0%, rgba(13, 148, 136, 0.14) 100%);
  padding: 0 6px;
  border-radius: 8px;
}

.lead {
  font-size: clamp(1.06rem, 1.35vw, 1.2rem);
  line-height: 1.65;
  color: var(--muted);
  max-width: 64ch;
  margin-bottom: 24px;
}

/* ==========================================================================
   HERO INTERACTIVE 4-SLIDE CAROUSEL (WITH BRANDED CLINICSIGN IMAGERY)
   ========================================================================== */
.hero-carousel-wrap {
  background:
    radial-gradient(circle at 12% 15%, rgba(13, 148, 136, 0.10), transparent 38%),
    radial-gradient(circle at 88% 20%, rgba(190, 242, 100, 0.16), transparent 36%),
    linear-gradient(180deg, #F8FAFC 0%, #FFFFFF 100%);
  border-bottom: 1px solid var(--line);
  padding: clamp(24px, 3.5vw, 48px) 0 clamp(32px, 4vw, 56px);
}

.carousel-container {
  width: min(1220px, calc(100% - 40px));
  margin: 0 auto;
}

.carousel-top-tabs {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-bottom: 24px;
}

.carousel-tab {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 9px 16px;
  border-radius: 999px;
  border: 1px solid var(--line-strong);
  background: var(--white);
  color: var(--muted) !important;
  font-size: 0.85rem;
  font-weight: 700;
  cursor: pointer;
  box-shadow: var(--shadow-sm);
  transition: all 0.2s ease;
}

.carousel-tab.active {
  background: var(--teal);
  color: var(--white) !important;
  border-color: var(--teal);
  box-shadow: 0 6px 18px rgba(15, 61, 62, 0.22);
}

.carousel-tab .step-dot {
  width: 22px;
  height: 22px;
  border-radius: 50%;
  background: rgba(13, 148, 136, 0.14);
  color: var(--emerald);
  display: grid;
  place-items: center;
  font-size: 0.74rem;
  font-weight: 800;
}

.carousel-tab.active .step-dot {
  background: var(--lime);
  color: var(--teal);
}

.carousel-stage {
  position: relative;
  min-height: 450px;
}

.hero-slide {
  display: none;
  grid-template-columns: 1.02fr 0.98fr;
  gap: clamp(28px, 4vw, 48px);
  align-items: center;
  animation: slideFadeIn 0.45s cubic-bezier(0.16, 1, 0.3, 1);
}

.hero-slide.active { display: grid; }

@keyframes slideFadeIn {
  from { opacity: 0; transform: translateY(10px); }
  to { opacity: 1; transform: translateY(0); }
}

.slide-visual-card {
  position: relative;
  border-radius: 22px;
  overflow: hidden;
  border: 2px solid #99F6E4;
  background: var(--ink);
  box-shadow: var(--shadow-lg);
}

.slide-visual-card img {
  width: 100%;
  height: 400px;
  object-fit: cover;
  display: block;
  transition: transform 0.6s ease;
}

.slide-visual-card:hover img { transform: scale(1.03); }

.slide-overlay-badge {
  position: absolute;
  top: 16px;
  left: 16px;
  background: rgba(10, 37, 64, 0.88);
  backdrop-filter: blur(10px);
  color: var(--white);
  padding: 8px 14px;
  border-radius: 999px;
  font-size: 0.78rem;
  font-weight: 700;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  border: 1px solid rgba(190, 242, 100, 0.35);
}

.pulse-dot {
  width: 9px;
  height: 9px;
  border-radius: 50%;
  background: var(--lime);
  box-shadow: 0 0 0 4px rgba(190, 242, 100, 0.3);
}

.slide-caption-bar {
  position: absolute;
  bottom: 14px;
  left: 14px;
  right: 14px;
  background: rgba(255, 255, 255, 0.96);
  backdrop-filter: blur(12px);
  padding: 13px 18px;
  border-radius: 14px;
  border: 1px solid var(--line);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  box-shadow: var(--shadow);
}

.slide-caption-bar strong {
  display: block;
  font-size: 0.92rem;
  color: var(--ink);
}

.slide-caption-bar span {
  font-size: 0.8rem;
  color: var(--muted);
}

.carousel-controls-bar {
  margin-top: 24px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding-top: 16px;
  border-top: 1px solid var(--line);
}

.carousel-progress-track {
  flex: 1;
  max-width: 320px;
  height: 6px;
  background: var(--line);
  border-radius: 999px;
  overflow: hidden;
}

.carousel-progress-fill {
  height: 100%;
  width: 25%;
  background: linear-gradient(90deg, var(--teal), var(--emerald));
  border-radius: 999px;
  transition: width 0.35s ease;
}

.carousel-nav-btns {
  display: flex;
  align-items: center;
  gap: 8px;
}

.carousel-icon-btn {
  width: 38px;
  height: 38px;
  border-radius: 10px;
  border: 1px solid var(--line-strong);
  background: var(--white);
  color: var(--ink) !important;
  padding: 0;
  font-size: 0.95rem;
  box-shadow: var(--shadow-sm);
}

/* ==========================================================================
   KPI METRICS BAR
   ========================================================================== */
.kpi-ribbon {
  background: var(--teal);
  color: var(--white);
  padding: 22px clamp(18px, 4vw, 48px);
}

.kpi-ribbon-inner {
  width: min(1220px, calc(100% - 40px));
  margin: 0 auto;
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 20px;
}

.kpi-box {
  border-left: 3px solid var(--lime);
  padding-left: 14px;
}

.kpi-box strong {
  display: block;
  font-family: 'Plus Jakarta Sans', sans-serif;
  font-size: 1.55rem;
  font-weight: 800;
  color: var(--lime);
  line-height: 1.15;
}

.kpi-box span {
  font-size: 0.85rem;
  color: rgba(255, 255, 255, 0.86);
}

/* ==========================================================================
   INTERACTIVE SIMULATOR (LIVE RECEPTION TABLET & SIGNATURE PAD)
   ========================================================================== */
.simulator-shell {
  background: linear-gradient(145deg, #0A2540 0%, #0F3D3E 100%);
  border-radius: 24px;
  padding: clamp(24px, 3.5vw, 40px);
  color: var(--white);
  box-shadow: var(--shadow-lg);
  display: grid;
  grid-template-columns: 0.9fr 1.1fr;
  gap: 32px;
  align-items: center;
}

.simulator-shell h2, .simulator-shell h3 { color: var(--white); }

.tablet-bezel {
  border: 8px solid #334155;
  border-radius: 24px;
  padding: 20px;
  background: var(--white);
  color: var(--body-ink);
  box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.45);
}

.tablet-statusbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding-bottom: 12px;
  margin-bottom: 14px;
  border-bottom: 1px solid var(--line);
  font-size: 0.8rem;
  font-weight: 700;
  color: var(--ink);
}

.lang-pills { display: inline-flex; gap: 6px; }

.lang-pill {
  padding: 4px 10px;
  border-radius: 999px;
  border: 1px solid var(--line-strong);
  background: var(--paper);
  color: var(--ink) !important;
  font-size: 0.76rem;
  font-weight: 700;
  cursor: pointer;
}

.lang-pill.active {
  background: var(--emerald);
  color: var(--white) !important;
  border-color: var(--emerald);
}

.sim-agreement-box {
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: 12px;
  padding: 12px 14px;
  margin-bottom: 12px;
  font-size: 0.86rem;
}

.sim-canvas-wrap {
  border: 2px dashed var(--emerald);
  border-radius: 12px;
  background: #FCFDFE;
  padding: 8px;
  text-align: center;
  margin-bottom: 12px;
}

.sim-canvas-wrap canvas {
  width: 100%;
  height: 120px;
  display: block;
  cursor: crosshair;
  touch-action: none;
}

/* ==========================================================================
   INTERACTIVE PMS EXPLORER & 2026 READINESS SCORECARD
   ========================================================================== */
.pms-pill-grid {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-bottom: 20px;
}

.pms-pill {
  padding: 10px 18px;
  border-radius: 999px;
  border: 1px solid var(--line-strong);
  background: var(--white);
  color: var(--ink) !important;
  font-weight: 700;
  font-size: 0.9rem;
  cursor: pointer;
  box-shadow: var(--shadow-sm);
  transition: all 0.16s ease;
}

.pms-pill.active, .pms-pill:hover {
  background: var(--teal);
  color: var(--lime) !important;
  border-color: var(--teal);
}

.scorecard-item {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 12px 16px;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: var(--white);
  margin-bottom: 10px;
  cursor: pointer;
  transition: border-color 0.15s ease, background 0.15s ease;
}

.scorecard-item:hover {
  border-color: var(--emerald);
  background: var(--surface-tint);
}

.scorecard-item input[type="checkbox"] {
  width: 20px;
  height: 20px;
  accent-color: var(--emerald);
  margin: 0;
  cursor: pointer;
}

/* ==========================================================================
   INTERACTIVE ROI & TIME-SAVED CALCULATOR
   ========================================================================== */
.calc-grid {
  display: grid;
  grid-template-columns: 1.05fr 0.95fr;
  gap: 28px;
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: 22px;
  padding: clamp(24px, 3.5vw, 38px);
  box-shadow: var(--shadow);
}

.range-group { margin-bottom: 20px; }

.range-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 8px;
  font-weight: 700;
  color: var(--ink);
}

.range-val-badge {
  background: var(--surface-tint);
  color: var(--teal);
  border: 1px solid #99F6E4;
  padding: 3px 12px;
  border-radius: 999px;
  font-family: 'JetBrains Mono', monospace;
  font-size: 0.9rem;
}

input[type="range"].cs-slider {
  width: 100%;
  accent-color: var(--emerald);
  height: 8px;
  cursor: pointer;
}

.calc-results-card {
  background: linear-gradient(145deg, var(--teal) 0%, #0A2540 100%);
  color: var(--white);
  border-radius: 18px;
  padding: 26px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}

.calc-stat-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 14px;
  margin: 16px 0;
}

.calc-stat-box {
  background: rgba(255, 255, 255, 0.08);
  border: 1px solid rgba(255, 255, 255, 0.14);
  border-radius: 12px;
  padding: 14px;
}

.calc-stat-box strong {
  display: block;
  font-size: 1.65rem;
  color: var(--lime);
  font-family: 'Plus Jakarta Sans', sans-serif;
}

.calc-stat-box span {
  font-size: 0.8rem;
  color: rgba(255, 255, 255, 0.82);
}

/* ==========================================================================
   INTERACTIVE WORKFLOW TABS & HARDWARE FILTER
   ========================================================================== */
.filter-pills {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-bottom: 24px;
}

.filter-pill {
  padding: 9px 18px;
  border-radius: 999px;
  border: 1px solid var(--line-strong);
  background: var(--white);
  color: var(--body-ink) !important;
  font-size: 0.88rem;
  font-weight: 700;
  cursor: pointer;
  box-shadow: var(--shadow-sm);
}

.filter-pill.active {
  background: var(--emerald);
  color: var(--white) !important;
  border-color: var(--emerald);
}

.grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap: 22px;
}

.grid.two {
  grid-template-columns: repeat(auto-fit, minmax(360px, 1fr));
}

.card, .panel {
  background: var(--white);
  border: 1px solid var(--line);
  border-radius: 18px;
  padding: 26px;
  box-shadow: var(--shadow);
  transition: transform 0.2s ease, box-shadow 0.2s ease, border-color 0.2s ease;
}

.card:hover {
  transform: translateY(-3px);
  box-shadow: var(--shadow-lg);
  border-color: #99F6E4;
}

.hardware-card-badge {
  display: inline-block;
  padding: 4px 10px;
  border-radius: 999px;
  font-size: 0.74rem;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  background: var(--surface-tint);
  color: var(--emerald);
  border: 1px solid #CCFBF1;
  margin-bottom: 10px;
}

.hardware-price {
  display: inline-block;
  margin: 6px 0 12px;
  padding: 6px 14px;
  border-radius: 999px;
  background: var(--teal);
  color: var(--lime);
  font-family: 'JetBrains Mono', monospace;
  font-size: 1rem;
  font-weight: 700;
}

/* ==========================================================================
   INTERACTIVE FAQ ACCORDION
   ========================================================================== */
.faq-accordion { display: grid; gap: 12px; }

.faq-item {
  border: 1px solid var(--line);
  border-radius: 14px;
  background: var(--white);
  overflow: hidden;
  box-shadow: var(--shadow-sm);
}

.faq-question {
  width: 100%;
  text-align: left;
  background: var(--white);
  color: var(--ink) !important;
  padding: 18px 22px;
  border: none;
  border-radius: 0;
  box-shadow: none;
  display: flex;
  align-items: center;
  justify-content: space-between;
  font-size: 1.03rem;
  font-weight: 700;
}

.faq-question:hover {
  background: var(--paper) !important;
  transform: none !important;
}

.faq-answer {
  padding: 14px 22px 18px;
  color: var(--muted);
  border-top: 1px solid var(--line);
}

/* ==========================================================================
   FORMS, TABLES & FOOTER
   ========================================================================== */
input:not([type="checkbox"]):not([type="radio"]):not([type="range"]), select, textarea {
  width: 100%;
  padding: 11px 14px;
  border: 1px solid var(--line-strong);
  border-radius: 10px;
  background: var(--white);
  color: var(--ink);
  margin: 6px 0 16px;
}

input:focus, select:focus, textarea:focus {
  outline: none;
  border-color: var(--emerald);
  box-shadow: 0 0 0 3px rgba(13, 148, 136, 0.16);
}

.compatibility-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin: 18px 0;
}

.compatibility-tags span {
  padding: 9px 16px;
  border-radius: 999px;
  border: 1px solid var(--line-strong);
  background: var(--white);
  color: var(--ink);
  font-weight: 700;
  font-size: 0.9rem;
  box-shadow: var(--shadow-sm);
}

.band {
  background: linear-gradient(135deg, var(--teal) 0%, #0A2540 100%);
  color: var(--white);
  border-radius: 22px;
  padding: clamp(28px, 4vw, 44px);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  flex-wrap: wrap;
  box-shadow: var(--shadow-lg);
}

.band h2, .band p { color: var(--white); }

footer.cs-footer {
  background: var(--ink);
  color: rgba(255, 255, 255, 0.78);
  padding: 52px clamp(18px, 4vw, 48px) 36px;
  margin-top: 64px;
}

.footer-grid {
  width: min(1220px, calc(100% - 40px));
  margin: 0 auto;
  display: grid;
  grid-template-columns: 1.4fr 1fr 1fr 1fr;
  gap: 32px;
}

.footer-col h4 {
  color: var(--white);
  font-size: 0.92rem;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  margin-bottom: 14px;
}

.footer-col a {
  display: block;
  color: rgba(255, 255, 255, 0.75);
  padding: 5px 0;
  font-weight: 500;
  font-size: 0.9rem;
}

.footer-col a:hover { color: var(--lime); }

.footer-bottom {
  width: min(1220px, calc(100% - 40px));
  margin: 32px auto 0;
  padding-top: 22px;
  border-top: 1px solid rgba(255, 255, 255, 0.12);
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 12px;
  font-size: 0.84rem;
}

.pill {
  display: inline-flex;
  align-items: center;
  padding: 4px 11px;
  border-radius: 999px;
  font-size: 0.76rem;
  font-weight: 700;
  background: #F1F5F9;
  color: #334155;
}
.pill.completed, .pill.active, .pill.verified { background: #CCFBF1; color: #0F766E; }
.pill.pending, .pill.processing { background: #FEF3C7; color: #B45309; }
.pill.declined, .pill.error { background: #FEE2E2; color: #B91C1C; }

.note {
  padding: 14px 18px;
  border-radius: 12px;
  background: var(--surface-tint);
  border-left: 4px solid var(--emerald);
  color: var(--ink);
  margin: 14px 0;
}

.enquiry-website {
  position: absolute !important;
  left: -9999px !important;
  width: 1px !important;
  height: 1px !important;
  overflow: hidden !important;
}

@media (max-width: 980px) {
  .hero-slide, .simulator-shell, .calc-grid, .footer-grid, .kpi-ribbon-inner {
    grid-template-columns: 1fr;
  }
  .cs-mega-nav {
    display: none;
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    background: var(--white);
    flex-direction: column;
    align-items: stretch;
    padding: 16px;
    border-bottom: 1px solid var(--line);
    box-shadow: var(--shadow-lg);
  }
  .cs-mega-nav.mobile-open { display: flex; }
  .mega-dropdown, .mega-dropdown.wide {
    position: static;
    min-width: 100%;
    grid-template-columns: 1fr;
    opacity: 1;
    visibility: visible;
    transform: none;
    box-shadow: none;
    border: none;
    padding: 6px 0 6px 12px;
    display: none;
  }
  .nav-item.open .mega-dropdown { display: grid; }
  .mobile-menu-btn { display: inline-flex; }
}

.logo img{object-fit:contain}.sidebar .logo-text{font-size:22px}.sidebar nav button{width:100%;text-align:left}.hardware-grid{grid-template-columns:repeat(auto-fit,minmax(240px,1fr))}.hero-slide[aria-hidden="true"]{visibility:hidden}@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;animation:none!important;transition:none!important}}

.cs-header .nav-trigger{color:var(--ink);background:transparent;box-shadow:none;border:0}.cs-header .nav-trigger:hover{color:var(--emerald);background:var(--surface-tint)}

.cs-header .nav-trigger{color:var(--ink)!important;background:transparent!important}.cs-header .nav-trigger:hover{color:var(--emerald)!important;background:var(--surface-tint)!important}

/* Responsive repair: keep navigation and evaluation workflows usable on phones. */
.mobile-auth-links{display:none}
.cs-header .mobile-menu-btn{color:var(--ink)!important;background:var(--white)!important;min-height:44px;box-shadow:none;white-space:nowrap}
.hero-slide>*,.simulator-shell>*,.calc-grid>*,.wf-panel>*,.footer-grid>*{min-width:0}
[hidden]{display:none!important}
@media(max-width:980px){
 .cs-header{position:sticky;top:0;z-index:1000;flex-wrap:nowrap;gap:12px;padding:12px 16px}
 .cs-header .logo{flex:1;min-width:0;gap:8px;font-size:21px;white-space:nowrap}
 .cs-header .mark-wrap,.cs-header .cs-logo-img{width:38px!important;height:38px!important;flex:none}
 .cs-header .header-ctas{display:none}
 .cs-header .mobile-menu-btn{display:inline-flex;flex:none;padding:10px 12px}
 .cs-header .cs-mega-nav{top:100%;max-height:calc(100dvh - 74px);overflow-y:auto;overscroll-behavior:contain;padding:12px 16px;gap:4px;min-width:0}
 .cs-header .cs-mega-nav.mobile-open{display:flex}
 .cs-header .nav-trigger{width:100%;min-height:48px;text-align:left;justify-content:space-between;white-space:normal;border-radius:8px}
 .cs-header .mega-dropdown,.cs-header .mega-dropdown.wide{width:100%;min-width:0;max-width:100%;padding:8px 0}
 .cs-header .sub-link{min-width:0;padding:12px 8px;gap:10px}
 .cs-header .sub-link div{min-width:0}
 .cs-header .mega-footer{flex-direction:column;align-items:flex-start;gap:8px}
 .mobile-auth-links{display:grid;grid-template-columns:1fr 1fr;gap:8px;padding:12px 0 4px;border-top:1px solid var(--line)}
 .mobile-auth-links a:last-child{grid-column:1/-1}
 .mobile-auth-links .btn{font-size:14px;min-height:44px;white-space:normal}
}
@media(max-width:640px){
 html{font-size:16px}body{margin:0}main,.container,.hero-carousel-wrap{min-width:0;max-width:100%}
 .container{padding:36px 16px}
 .hero-carousel-wrap{padding:20px 16px 24px}
 .carousel-top-tabs{flex-wrap:nowrap;overflow-x:auto;gap:8px;margin:0 0 22px;padding:0 0 8px;scroll-snap-type:x proximity;-webkit-overflow-scrolling:touch}
 .carousel-tab{flex:0 0 auto;max-width:260px;min-height:44px;padding:10px 12px;white-space:nowrap;font-size:12px;scroll-snap-align:start}
 .carousel-stage{min-height:0}
 .hero-slide.active{display:grid;grid-template-columns:minmax(0,1fr);gap:24px}
 .hero-slide h1{font-size:clamp(29px,8.2vw,38px);line-height:1.14;letter-spacing:-.035em;margin:16px 0}
 .hero-slide .eyebrow{font-size:10px;letter-spacing:.1em;line-height:1.6;max-width:100%;overflow-wrap:anywhere}
 .hero-slide p,.lead{font-size:16px;line-height:1.65}
 .hero-slide .actions{display:flex;flex-direction:column;align-items:stretch;gap:10px}
 .hero-slide .actions .btn{width:100%;min-height:46px;white-space:normal;text-align:center}
 .slide-visual-card img{height:auto;aspect-ratio:4/3;object-fit:cover}
 .slide-overlay-badge{position:static;border-radius:0;font-size:11px;padding:10px 12px}
 .slide-bottom-strip{position:static;padding:14px;gap:10px;flex-wrap:wrap}
 .slide-bottom-strip .btn{min-height:44px}
 .carousel-controls{gap:12px;margin-top:20px;flex-wrap:wrap}
 .kpi-ribbon-inner{display:grid;grid-template-columns:1fr 1fr;gap:20px;padding:24px 16px}
 .kpi-ribbon-inner>*{min-width:0}
 h2{font-size:28px;line-height:1.2}h3{overflow-wrap:anywhere}
 .grid,.grid.two,.grid.three,.fields,.simulator-shell,.calc-grid,.footer-grid,.workflow-grid{grid-template-columns:minmax(0,1fr);gap:20px}
 .workflow-tabs,.pms-selector{display:flex;flex-wrap:nowrap;overflow-x:auto;gap:8px;padding-bottom:8px;max-width:100%}
 .workflow-tabs button,.pms-selector button{flex:none;max-width:260px;white-space:normal;min-height:44px}
 .simulator-device,.sim-agreement-box,.pms-detail-card,.calc-panel,.calc-results,.card,.panel{min-width:0;max-width:100%;overflow-wrap:anywhere}
 .simulator-device{padding:16px}.simulator-device canvas{width:100%;max-width:100%;height:130px;touch-action:none}
 input,select,textarea{font-size:16px;min-width:0;max-width:100%}
 input[type=range]{width:100%}.simulator-device input,.simulator-device select{width:100%;min-height:44px}
 .pms-detail-card{padding:20px}.wf-panel{padding:20px!important}.wf-panel img{max-width:100%;height:auto}
 .cs-footer{padding:36px 16px}.footer-bottom{flex-direction:column;align-items:flex-start;gap:12px}
 .cs-footer a{overflow-wrap:anywhere}.dialog{width:100%;padding:20px}.login-wrap{padding:24px 16px}
}

@media(max-width:640px){.calc-stat-grid{grid-template-columns:minmax(0,1fr)}.calc-results-card{min-width:0;padding:20px}.calc-stat-box{min-width:0}.calc-stat-box strong{font-size:1.4rem;overflow-wrap:anywhere}}

/* Readable platform identity on every background. */
.logo{flex-shrink:0}.logo .mark-wrap{width:64px!important;height:64px!important;flex:none}.logo .cs-logo-img{width:64px!important;height:64px!important}.logo .logo-text{font-size:29px;line-height:1.1;color:#14343b}.logo .logo-accent{color:#087f72}.sidebar>.logo{background:#fff;border-radius:12px;padding:12px 8px;gap:7px}.sidebar>.logo .mark-wrap,.sidebar>.logo .cs-logo-img{width:48px!important;height:48px!important}.sidebar>.logo .logo-text{font-size:23px;color:#14343b}.sidebar{width:auto;min-width:0}.sidebar nav button{min-height:44px}.hardware-grid img{max-width:100%;object-fit:contain}
@media(max-width:980px){.cs-header .logo .mark-wrap,.cs-header .logo .cs-logo-img{width:52px!important;height:52px!important}.cs-header .logo .logo-text{font-size:27px}}

/* Content illustrations must respect their grid cell at desktop widths too. */
main img,.container img{max-width:100%;height:auto}.grid>*{min-width:0}

/* Keep destructive actions readable despite the shared primary-button rule. */
button.danger,.btn.danger{color:#9b3030!important;-webkit-text-fill-color:#9b3030;background:#fff;border:1px solid #c57f7f}
button.danger:hover:not(:disabled),.btn.danger:hover{color:#7b2020!important;background:#fff0f0;border-color:#9b3030}
.row-actions{flex-wrap:wrap}.row-actions button{min-height:44px}
.logo .logo-text{color:#0B3840!important}.logo .logo-accent{color:#1AA37A!important;-webkit-text-fill-color:#1AA37A!important;background:none}
.cs-footer .logo{background:#fff;padding:12px;border-radius:12px;display:inline-flex}.cs-footer .logo .mark-wrap{background:transparent;box-shadow:none}