/* Public and candidate pages: keep content usable from small phones to desktops. */
.public-site .pubnav { flex-wrap: wrap; }
.public-site .pubnav .brand { min-width: 0; }
.public-site .pubnav .brand > div { min-width: 0; }
.public-site .pubnav .brand .logo { flex-shrink: 0; }
.public-site .pubnav .brand b { white-space: normal; }
.public-site .pubnav .brand span { overflow-wrap: anywhere; }
.public-site .pubwrap { width: 100%; }
.public-site .pubwrap :where(.grid, .split, .stack, .formgrid, .row, .between, .card, .field, form) { min-width: 0; }
.public-site .pubwrap :where(.grid, .split, .formgrid, .row, .between, .checkrow) > * { min-width: 0; max-width: 100%; }
.public-site :where(.btn, .badge, .vbadge, .step, .tag) { max-width: 100%; white-space: normal; overflow-wrap: anywhere; }
.public-site :where(.btn, .badge, .vbadge) { text-align: center; }
.public-site :where(input, select, textarea) { min-width: 0; max-width: 100%; }
.public-site input[type=file] { overflow: hidden; }
.public-site :where(img, video, canvas, iframe) { max-width: 100%; }
.public-site .tablewrap { width: 100%; max-width: 100%; }
.public-site .g2, .public-site .formgrid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.public-site .g3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.public-site .g4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.public-site .filterbar > input:not([type=hidden]) { flex: 2 1 220px; }
.public-site .filterbar > select { flex: 1 1 160px; }
.public-site .filterbar > :where(input, select) { min-width: 0; }
.public-site .public-flow { display: block; width: 100%; margin: 0 auto; padding: 12px 0 24px; }
.public-site .public-flow > .split { grid-template-columns: minmax(0, 1fr); }
.public-site .authwrap { min-height: min(720px, calc(100svh - 180px)); padding-inline: 0; }
.public-site .authpage { padding-inline: 0; }
.public-site .authstage { grid-template-columns: minmax(0, 1.08fr) minmax(0, .9fr); }
.public-site .authcard-top, .public-site .authfoot, .public-site .authproof { flex-wrap: wrap; }
.public-site .authcard .field-help { overflow-wrap: anywhere; }
.public-site .landing-hero { grid-template-columns: minmax(0, 1.04fr) minmax(0, .96fr); }
.public-site .landing-proof .proof-dot { flex-shrink: 0; }
.public-site .landing-stats .statline { flex-wrap: wrap; }
.public-site .feature-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.public-site .feature-card > div { min-width: 0; }
.public-site .preview-glow { inset-inline: 0; }
.public-site .preview-head { gap: 12px; flex-wrap: wrap; }
.public-site .status-live { flex-shrink: 0; }
.public-site .preview-row small { white-space: normal; }
.public-site .assessment-layout { grid-template-columns: minmax(0, 1fr) 180px; }
.public-site .assessment-clock { position: sticky; top: 100px; }
.public-site .opt > input { flex-shrink: 0; }
.public-site .npsrow { display: grid; grid-template-columns: repeat(auto-fit, minmax(44px, 1fr)); gap: 6px; margin-bottom: 6px; }
.public-site .npsbtn { min-height: 44px; min-width: 44px; font-size: 16px; }
.public-site #faqPanel { flex-direction: column; max-height: calc(100dvh - 108px); bottom: max(84px, calc(env(safe-area-inset-bottom) + 84px)) !important; }
.public-site #faqBody { flex: 1 1 auto; min-height: 0; overflow-wrap: anywhere; overscroll-behavior: contain; }
.public-site #faqInput { min-width: 0; }
.public-site .faq-heading { display: flex; align-items: flex-start; justify-content: space-between; gap: 10px; flex-shrink: 0; }
.public-site .faq-close { flex-shrink: 0; width: 36px; min-height: 36px; padding: 4px; }
.public-site #faqFab { bottom: max(18px, calc(env(safe-area-inset-bottom) + 18px)) !important; }
.public-site #backTop { right: 84px; bottom: max(24px, calc(env(safe-area-inset-bottom) + 24px)); }
.public-site .pubfoot { overflow-wrap: anywhere; padding-bottom: max(92px, calc(env(safe-area-inset-bottom) + 92px)); }

/* These landing surfaces originally had hard-coded dark gradients. Use the
   light palette as well so preview text and feature cards remain readable. */
html[data-theme="light"] .public-site .preview-window { background: linear-gradient(145deg, #fff, #edf2ff); border-color: var(--line-2); box-shadow: 0 24px 60px rgba(31,45,74,.16); }
html[data-theme="light"] .public-site :is(.preview-kpis > div, .preview-pipeline, .preview-row) { background: rgba(255,255,255,.85); border-color: var(--line); }
html[data-theme="light"] .public-site .pipeline-track { background: var(--line); }
html[data-theme="light"] .public-site .feature-card { background: linear-gradient(145deg, #fff, #f7f9ff); }
html[data-theme="light"] .public-site .feature-primary { background: linear-gradient(145deg, #e9efff, #fff); }
html[data-theme="light"] .public-site .flow-track { background: var(--panel); }
html[data-theme="light"] .public-site .landing-cta { background: linear-gradient(110deg, #e9efff, #f8faff); box-shadow: var(--shadow); }

@media (max-width: 1080px) {
  .public-site .g3, .public-site .g4 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 900px) {
  .public-site .landing-hero { grid-template-columns: minmax(0, 1fr); }
  .public-site .feature-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 860px) {
  .public-site .pubnav { position: static; align-items: center; gap: 6px 12px; padding: 12px max(16px, env(safe-area-inset-right)) 8px max(16px, env(safe-area-inset-left)); }
  .public-site .pubnav .links { flex-basis: 100%; margin-left: 0; justify-content: flex-start; gap: 4px 14px; }
  .public-site .pubnav .links a, .public-site .pubnav .links a.hidesm { display: inline-flex; align-items: center; min-height: 44px; }
  .public-site .pubnav .themebtn { margin-left: auto; min-width: 44px; min-height: 44px; }
  .public-site .pubnav .brand span { display: block; }
  .public-site .pubwrap { padding: 24px max(16px, env(safe-area-inset-right)) 48px max(16px, env(safe-area-inset-left)); }
  .public-site .g2, .public-site .formgrid { grid-template-columns: minmax(0, 1fr); }
  .public-site .span2 { grid-column: 1 / -1; }
  .public-site .authwrap { min-height: 0; padding: 12px 0 28px; }
  .public-site .authstage { grid-template-columns: minmax(0, 1fr); gap: 32px; }
  .public-site .authstage .authcard { order: -1; max-width: 100%; }
  .public-site .authvisual { padding: 12px 0; }
  .public-site :where(.btn, .themebtn, .slotbtn, .opt, .radiogrid label) { min-height: 44px; }
  .public-site .checkrow > form > button { min-width: 44px; min-height: 44px; }
  .public-site input:not([type=hidden]):not([type=checkbox]):not([type=radio]), .public-site select, .public-site textarea, .public-site #faqInput { font-size: 16px !important; }
  .public-site .assessment-layout { grid-template-columns: minmax(0, 1fr); }
  .public-site .assessment-clock { order: -1; top: 8px; z-index: 10; background: var(--panel); border-radius: var(--radius); padding: 8px; box-shadow: var(--shadow); }
  .public-site .assessment-clock .timerbox { position: static; padding: 6px; }
  .public-site .assessment-clock .hint { margin-top: 4px !important; }
  .public-site .faq-close { min-width: 44px; min-height: 44px; }
}

@media (max-width: 620px) {
  .public-site .feature-grid { grid-template-columns: minmax(0, 1fr); }
  .public-site .landing-stats .statline { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px 28px; width: 100%; }
  .public-site .landing-copy h1 { font-size: clamp(36px, 12vw, 58px); }
  .public-site .authvisual h1 { font-size: clamp(32px, 10vw, 46px); }
  .public-site .public-flow .pagehead > .btn { width: 100%; }
  .public-site .npsrow { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .public-site .npsbtn { aspect-ratio: auto !important; }
  .public-site .pubnav .links { gap: 4px 12px; }
  .public-site .pubnav .links a { font-size: 12px; }
}

@media (max-width: 560px) {
  .public-site .g3, .public-site .g4 { grid-template-columns: minmax(0, 1fr); }
  .public-site .filterbar > :where(input:not([type=hidden]), select) { flex-basis: 100%; width: 100%; }
  .public-site .filterbar > .btn { flex: 1 1 auto; }
  .public-site .authcard h2 { font-size: clamp(25px, 8vw, 30px); }
  .public-site .authcard .field > .between { gap: 4px 10px; }
  .public-site .ctc { font-size: clamp(23px, 7vw, 30px); }
  .public-site .offerpaper { padding: 18px; }
}

@media (max-height: 500px) and (orientation: landscape) {
  .public-site .assessment-clock { position: static; }
  .public-site #faqPanel { bottom: 12px !important; max-height: calc(100dvh - 24px); }
}

@media print {
  .public-site #faqFab, .public-site #faqPanel, .public-site #backTop { display: none !important; }
  .public-site .pubfoot { padding-bottom: 20px; }
}

/* Keep the public surface in the same quiet visual system as the workspace.
   This final block intentionally wins over legacy landing gradients above. */
.public-site,.public-site body{background:var(--bg);color:var(--ink);background-image:none}
.public-site .pubnav{background:var(--bg-2);border-bottom:1px solid var(--line);box-shadow:0 1px 0 var(--line);backdrop-filter:none;-webkit-backdrop-filter:none}
.public-site .preview-window,.public-site .feature-card,.public-site .landing-cta,.public-site .flow-track{background:var(--panel);background-image:none;border-color:var(--line);box-shadow:var(--shadow)}
.public-site .preview-glow{display:none}.public-site .feature-primary{background:var(--panel);border-color:var(--line-2)}.public-site .landing-cta{border-radius:8px}.public-site .flow-step{background:var(--panel)}
.public-site .landing-copy h1 .zap{background:none;color:var(--volt)}.public-site .preview-window:before{display:none}.public-site .preview-kpis>div,.public-site .preview-pipeline,.public-site .preview-row{background:var(--panel-2);border-color:var(--line)}
@media (max-width:720px){.public-site .pubwrap{padding-top:20px}.public-site .landing-hero{padding-top:34px}.public-site .landing-copy h1{font-size:clamp(38px,12vw,58px)}}
/* Public auth and marketing headers must keep the shared theme control visible. */
.public-site .pubnav .themebtn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:44px;
  min-height:44px;
  padding:0;
  color:var(--ink,#0d1b2a)!important;
  background:var(--panel,#fff)!important;
  border:1px solid var(--line,#d1e1ee)!important;
  border-radius:9px;
  font-size:16px!important;
  line-height:1;
  cursor:pointer;
}
.public-site .pubnav .themebtn .bi{display:inline-block!important;font-size:16px;line-height:1}
.public-site .pubnav .themebtn:hover{color:var(--volt,#176b5d)!important;border-color:var(--volt,#176b5d)!important;background:var(--panel-2,#edf1ed)!important}
html[data-theme="dark"] .public-site .pubnav .themebtn{color:#f2b34c!important;background:#142d47!important;border-color:#2b4b69!important}
html[data-theme="dark"] .public-site .pubnav .themebtn:hover{color:#0d1b2a!important;background:#f2b34c!important;border-color:#f2b34c!important}

/* Shared public footer: keep the login/auth pages as legible as the landing page. */
.public-site .landing-footer{
  margin:0;
  padding:64px clamp(24px,5vw,72px) 24px;
  background: #e3edf7a1;
  border-top:0!important;
  color:#49667e;
}
.public-site .landing-footer .footer-nav a{
  display:inline-flex;
  width:max-content;
  color:#334d64!important;
  text-decoration:none;
  text-decoration-color:#ee9f1b;
  text-decoration-thickness:2px;
  text-underline-offset:4px;
  transition:color .2s ease,transform .2s ease,text-decoration-color .2s ease;
}
.public-site .landing-footer .footer-nav a:hover,
.public-site .landing-footer .footer-nav a:focus-visible{
  color:#0d1b2a!important;
  text-decoration:underline;
  transform:translateX(3px);
}
.public-site .landing-footer .footer-nav a:focus-visible{outline:2px solid #ee9f1b;outline-offset:4px}
.public-site .landing-footer .footer-brand .brand-copy b{color:#0d1b2a}
.public-site .landing-footer .footer-brand .brand-copy small,
.public-site .landing-footer .footer-brand p,
.public-site .landing-footer .footer-bottom{color:#49667e}
.public-site .landing-footer .footer-bottom{border-top:0!important}
.public-site .landing-footer .footer-bottom i{color:#ee9f1b}
html[data-theme="dark"] .public-site .landing-footer{background:#0b1420;color:#b4c9dc}
html[data-theme="dark"] .public-site .landing-footer .footer-nav a{color:#d4e2ee!important}
html[data-theme="dark"] .public-site .landing-footer .footer-nav a:hover,
html[data-theme="dark"] .public-site .landing-footer .footer-nav a:focus-visible{color:#f2b34c!important}
html[data-theme="dark"] .public-site .landing-footer .footer-brand .brand-copy b{color:#f3f7fb}
html[data-theme="dark"] .public-site .landing-footer .footer-brand .brand-copy small,
html[data-theme="dark"] .public-site .landing-footer .footer-brand p,
html[data-theme="dark"] .public-site .landing-footer .footer-bottom{color:#9fb5c8}

/* Final narrow-device header contract. */
@media (max-width:860px){
  html.public-nav-open{overflow:hidden}
  .public-site .pubnav{flex-wrap:nowrap;min-width:0}
  .public-site .pubnav .brand{flex:1 1 0;width:0;min-width:0;padding-inline:0}
  .public-site .pubnav .brand-copy{min-width:0;overflow:hidden}
  .public-site .pubnav .brand-copy b,
  .public-site .pubnav .brand-copy small{display:block;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .public-site .public-menu-toggle,
  .public-site .pubnav .themebtn{flex:0 0 40px;width:40px;min-width:40px;height:40px;min-height:40px}
}
@media (max-width:360px){
  .public-site .pubnav{gap:6px;padding-inline:12px}
  .public-site .pubnav .brand-copy small{display:none}
  .public-site .pubnav .brand-copy b{font-size:13px}
}

@media (max-width:860px){
  /* The shared footer injects these controls after the linked stylesheets;
     !important keeps them clear of Maya and the footer on short screens. */
  .public-site .footer-bottom{padding-right:72px}
  .public-site #scrollControls{
    right:max(8px,env(safe-area-inset-right))!important;
    bottom:calc(140px + env(safe-area-inset-bottom))!important;
  }
}
@media (max-width:360px){
  .public-site #scrollControls{gap:4px}
  .public-site #scrollControls button{width:38px!important;height:38px!important;font-size:16px}
}
@media (max-width:420px){
  .public-site #faqPanel{left:10px!important;right:10px!important;width:auto!important;max-width:none!important}
}
