/* Product-specific doors, with a consistent, uncluttered sign-in surface. */
:is(#mh-access,.mh-access){display:block;min-height:100vh;padding:0;background:var(--mh-dark);--text-muted:var(--mh-muted);--slate:var(--mh-muted);--line:var(--mh-line);--navy:var(--mh-dark)}
:is(#mh-access,.mh-access):before,:is(#mh-access,.mh-access):after{display:none}
:is(#mh-access,.mh-access) .nav{display:block;height:auto;padding:0}
:is(#mh-access,.mh-access) :is(.mobile-login-header,.mobile-head,.hero-logo,.brand,.portal-top){display:none}
:is(#mh-access,.mh-access) :is(.login-shell,.shell){display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);gap:80px;align-items:center;width:100%;max-width:1200px;padding:64px 40px 80px;margin:auto;min-height:0;animation:none}
:is(#mh-access,.mh-access) :is(.hero-panel,.hero){display:block;background:transparent;border:0;box-shadow:none;padding:0;min-height:0;overflow:visible;color:#f8faf6}
:is(#mh-access,.mh-access) .hero-panel:after{display:none}
:is(#mh-access,.mh-access) :is(.hero-headline,.hero h1){font:600 clamp(40px,4.2vw,62px)/1.07 var(--head);letter-spacing:-.045em;margin:24px 0;text-shadow:none;max-width:610px}
:is(#mh-access,.mh-access) :is(.hero-headline em,.hero h1 em){color:var(--accent-on-dark);font-style:normal}
:is(#mh-access,.mh-access) :is(.hero-sub,.hero-copy){color:#bdc9c1;font-size:15px;line-height:1.8;margin-top:22px;text-shadow:none;max-width:530px}
:is(#mh-access,.mh-access) :is(.hero-eyebrow,.hero .eyebrow){color:var(--accent-on-dark);font:600 10px var(--mono);letter-spacing:.14em;text-transform:uppercase;margin:0}
:is(#mh-access,.mh-access) .hero-chips{display:flex;flex-direction:column;align-items:start;gap:0;margin-top:32px}
:is(#mh-access,.mh-access) .hero-chip{border:0;border-top:1px solid #405044;border-radius:0;background:none;padding:14px 0;width:100%;color:#c7d1c9;font-size:12px}
:is(#mh-access,.mh-access) .chip-dot{background:var(--accent-on-dark)}
:is(#mh-access,.mh-access) .signals{margin-top:36px;gap:18px;flex-direction:column}
:is(#mh-access,.mh-access) .signal{border:0;border-top:1px solid #405044;padding:16px 0;max-width:100%}
:is(#mh-access,.mh-access) .signal b{color:var(--accent-on-dark);margin-bottom:8px}
:is(#mh-access,.mh-access) .signal span{display:block;color:#bdc9c1;font-size:12px}
:is(#mh-access,.mh-access) :is(.login-card,.card){background:var(--mh-paper);border:1px solid #dae3d4;border-radius:10px;padding:38px;box-shadow:none;backdrop-filter:none;animation:none;color:var(--mh-ink);min-width:0}
:is(#mh-access,.mh-access) :is(.login-card h2,.card h2){font:600 38px/1.1 var(--head);letter-spacing:-.04em;color:var(--mh-ink);margin:0 0 12px}
:is(#mh-access,.mh-access) :is(.login-card-sub,.sub){font-size:14px;line-height:1.65;color:var(--mh-muted);margin-bottom:26px}
:is(#mh-access,.mh-access) :is(.input,.field input,.field select,.field textarea){border-radius:5px;border:1px solid #b9c6b5;background:#fff;min-height:48px;font-size:16px;color:var(--mh-ink)}
:is(#mh-access,.mh-access) .field input[type=checkbox]{min-height:0}
:is(#mh-access,.mh-access) :is(.submit,.submit-btn,#login-button,.btn-submit){background:var(--mh-dark);color:#fff;border-radius:6px;box-shadow:none;min-height:50px;font:600 14px var(--body)}
:is(#mh-access,.mh-access) :is(.google,.google-btn){background:#fff;border-radius:6px;box-shadow:none;min-height:50px;border:1px solid #bbc9b6}
:is(#mh-access,.mh-access) :is(.forgot,.forgot-link,.auth-note a,.switch-row){color:var(--brand-dark)}
:is(#mh-access,.mh-access) .pw-toggle{min-width:44px;min-height:44px}
:is(#mh-access,.mh-access) .auth-wrap{min-height:0;padding:64px 24px 80px}
:is(#mh-access,.mh-access) .auth-card{width:min(100%,540px)}
:is(#mh-access,.mh-access) .auth-card h1{font:600 42px/1.08 var(--head);letter-spacing:-.04em;color:var(--mh-ink);margin:16px 0}
:is(#mh-access,.mh-access) .auth-card>p{margin-bottom:25px;line-height:1.7}
:is(#mh-access,.mh-access) .page-wrap{padding:64px 40px 80px}
:is(#mh-access,.mh-access) .page-inner{display:grid;grid-template-columns:.85fr 1.15fr;gap:70px;max-width:1120px;align-items:start}
:is(#mh-access,.mh-access) .mh-access-intro{position:sticky;top:120px;color:#f8faf6}
:is(#mh-access,.mh-access) .page-eyebrow{font:600 10px var(--mono);letter-spacing:.14em;color:var(--accent-on-dark);margin-bottom:24px}
:is(#mh-access,.mh-access) .page-title{font:600 clamp(40px,4vw,58px)/1.08 var(--head);letter-spacing:-.045em}
:is(#mh-access,.mh-access) .page-lead{font-size:15px;line-height:1.8;color:#bdc9c1;margin-top:24px}
:is(#mh-access,.mh-access) .trust-line{margin-top:32px;font:11px var(--mono);color:#bdc9c1;gap:12px;line-height:1.8;border-top:1px solid #405044;padding-top:24px}
:is(#mh-access,.mh-access) .trust-line .dot{color:var(--accent-on-dark)}
:is(#mh-access,.mh-access) .form-card{background:var(--mh-paper);border:1px solid #dae3d4;border-radius:10px;padding:32px}
:is(#mh-access,.mh-access) .field-error{color:#b42318}
:is(#mh-access,.mh-access) .form-submit{gap:14px}
:is(#mh-access,.mh-access) .form-confirm{padding:30px 0}
:is(#mh-access,.mh-access) .confirm-title{font:600 30px/1.15 var(--head);letter-spacing:-.03em;color:var(--mh-ink);margin-bottom:18px}
:is(#mh-access,.mh-access) .confirm-body{font-size:14px;line-height:1.7;margin-bottom:18px}
:is(#mh-access,.mh-access) .confirm-demo-btn{background:var(--brand-dark);color:#fff;border-radius:6px;font-size:13px;padding-inline:20px}
:is(#mh-access,.mh-access) input:focus-visible,:is(#mh-access,.mh-access) select:focus-visible,:is(#mh-access,.mh-access) textarea:focus-visible{outline:2px solid var(--brand-dark);outline-offset:3px}
@media(max-width:900px){:is(#mh-access,.mh-access) :is(.login-shell,.shell,.page-inner){grid-template-columns:1fr;gap:32px}:is(#mh-access,.mh-access) :is(.login-shell,.shell){padding:38px 24px 48px;max-width:620px}:is(#mh-access,.mh-access) .page-wrap{padding:38px 24px 48px}:is(#mh-access,.mh-access) .mh-access-intro{position:static}:is(#mh-access,.mh-access) :is(.hero-headline,.hero h1){font-size:40px;margin-block:18px}:is(#mh-access,.mh-access) :is(.hero-chips,.signals){display:none}:is(#mh-access,.mh-access) :is(.hero-sub,.hero-copy){display:block;font-size:14px}:is(#mh-access,.mh-access) :is(.login-card,.card,.form-card){padding:28px 22px}:is(#mh-access,.mh-access) .auth-wrap{padding:40px 24px 48px}:is(#mh-access,.mh-access) .field-grid{grid-template-columns:1fr}:is(#mh-access,.mh-access) .page-title{font-size:42px}:is(#mh-access,.mh-access) .page-inner{max-width:620px}:is(#mh-access,.mh-access) .trust-line{margin-bottom:0}}
@media(prefers-reduced-motion:reduce){:is(#mh-access,.mh-access) *{animation:none!important;transition:none!important}}



/* Sign-in: the field photograph fills the screen, the headline sits on its
 * darkened left side and the form floats on the right in a white card.
 * Phones get the form alone on white, no photo.
 * To change a photo, change the one line for that page below; --login-pos
 * moves the subject into the gap between headline and card.
 * Text on the photo is held dark by the scrim; contrast.test.js skips images,
 * so tests/login-photo.test.js measures it against the real pixels, and
 * tests/login-layout.test.js holds the layout. Forms, ids and scripts untouched. */
:is(#mh-access,.mh-access).mh-login{--login-photo:url(img/login/safety-wide.webp);--login-pos:60% 50%}
:is(#mh-access,.mh-access):is(.mh-fleet-login,.mh-fleet-customer-login){--login-photo:url(img/login/fleet-wide.webp);--login-pos:40% 50%}
:is(#mh-access,.mh-access):is(.mh-login,.mh-fleet-login,.mh-fleet-customer-login){background:#0d1713}
:is(#mh-access,.mh-access):is(.mh-login,.mh-fleet-login,.mh-fleet-customer-login) :is(.nav,.footer,.portal-top,.hero-chips,.signals){display:none}
:is(#mh-access,.mh-access):is(.mh-login,.mh-fleet-login,.mh-fleet-customer-login) :is(.login-shell,.shell,.auth-wrap){position:relative;isolation:isolate;display:grid;grid-template-columns:minmax(0,1fr) 440px;grid-template-rows:auto 1fr auto;grid-template-areas:"top top" "hero form" "legal legal";column-gap:clamp(40px,6vw,110px);place-items:stretch;width:100%;max-width:none;min-height:100vh;min-height:100svh;margin:0;padding:30px clamp(28px,6vw,96px);background:#0d1713 var(--login-photo) var(--login-pos)/cover no-repeat}
:is(#mh-access,.mh-access):is(.mh-login,.mh-fleet-login,.mh-fleet-customer-login) :is(.login-shell,.shell,.auth-wrap):before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;background:linear-gradient(180deg,rgba(9,17,14,.62) 0%,rgba(9,17,14,0) 16%,rgba(9,17,14,0) 82%,rgba(9,17,14,.72) 100%),linear-gradient(90deg,rgba(9,17,14,.90) 0%,rgba(9,17,14,.72) 34%,rgba(9,17,14,.18) 62%,rgba(9,17,14,.10) 100%)}
:is(#mh-access,.mh-access):is(.mh-login,.mh-fleet-login,.mh-fleet-customer-login) :is(.login-shell,.shell,.auth-wrap):after{display:none}
:is(#mh-access,.mh-access):is(.mh-login,.mh-fleet-login,.mh-fleet-customer-login) .access-top{grid-area:top;display:flex;justify-content:space-between;align-items:center;gap:16px}
:is(#mh-access,.mh-access):is(.mh-login,.mh-fleet-login,.mh-fleet-customer-login) .access-logo img{height:26px;width:auto;display:block}
:is(#mh-access,.mh-access):is(.mh-login,.mh-fleet-login,.mh-fleet-customer-login) .access-logo .logo-dark{display:none}
:is(#mh-access,.mh-access):is(.mh-login,.mh-fleet-login,.mh-fleet-customer-login) .access-back{font-size:13px;font-weight:500;color:#eef2ef;padding:8px 14px;border-radius:999px;background:rgba(9,17,14,.78);backdrop-filter:blur(6px)}
:is(#mh-access,.mh-access):is(.mh-login,.mh-fleet-login,.mh-fleet-customer-login) .access-back:hover{color:#fff}
:is(#mh-access,.mh-access):is(.mh-login,.mh-fleet-login,.mh-fleet-customer-login) :is(.hero-panel,.hero){grid-area:hero;align-self:center;display:block;position:static;min-height:0;max-width:540px;margin:0;padding:0;background:none;border:0;border-radius:0;box-shadow:none;overflow:visible;color:#fff}
:is(#mh-access,.mh-access):is(.mh-login,.mh-fleet-login,.mh-fleet-customer-login) :is(.hero-panel,.hero):after{display:none}
:is(#mh-access,.mh-access):is(.mh-login,.mh-fleet-login,.mh-fleet-customer-login) .hero-panel>div{display:block}
:is(#mh-access,.mh-access):is(.mh-login,.mh-fleet-login,.mh-fleet-customer-login) :is(.hero-eyebrow,.hero .eyebrow){display:flex;align-items:center;gap:8px;border:0;background:none;padding:0}
:is(#mh-access,.mh-access):is(.mh-login,.mh-fleet-login,.mh-fleet-customer-login) :is(.hero-headline,.hero h1){font-size:clamp(40px,3.8vw,56px);line-height:1.06;margin:18px 0 0;max-width:540px}
:is(#mh-access,.mh-access):is(.mh-login,.mh-fleet-login,.mh-fleet-customer-login) :is(.hero-sub,.hero-copy){color:#dfe6e1;font-size:15px;line-height:1.7;margin-top:18px;max-width:470px}
:is(#mh-access,.mh-access):is(.mh-login,.mh-fleet-login,.mh-fleet-customer-login) :is(.login-card,.card,.auth-card){grid-area:form;align-self:center;width:100%;margin:16px 0;padding:36px 40px;background:#fff;border:0;border-radius:18px;box-shadow:0 40px 100px rgba(0,0,0,.45);backdrop-filter:none}
:is(#mh-access,.mh-access):is(.mh-login,.mh-fleet-login,.mh-fleet-customer-login) .card-inner{max-width:none;margin:0}
:is(#mh-access,.mh-access):is(.mh-login,.mh-fleet-login,.mh-fleet-customer-login) :is(.login-card h2,.card h2,.auth-card h1){font-size:34px}
:is(#mh-access,.mh-access):is(.mh-login,.mh-fleet-login,.mh-fleet-customer-login) .access-legal{grid-area:legal;display:flex;flex-wrap:wrap;gap:6px 18px;font-size:12px;color:#d3dcd5}
:is(#mh-access,.mh-access):is(.mh-login,.mh-fleet-login,.mh-fleet-customer-login) .access-legal a{color:#d3dcd5}
:is(#mh-access,.mh-access).mh-login .google-hint{margin-top:10px;line-height:1.6}
:is(#mh-access,.mh-access).mh-login .pilot-link-row{margin-top:18px}
:is(#mh-access,.mh-access).mh-login .product-switch{margin-top:14px}
:is(#mh-access,.mh-access).mh-fleet-customer-login .field label{font:600 12.5px/1.5 var(--body);letter-spacing:0;text-transform:none;color:var(--mh-ink)}
@media(max-width:1200px){
 :is(#mh-access,.mh-access):is(.mh-login,.mh-fleet-login,.mh-fleet-customer-login) :is(.hero-panel,.hero){visibility:hidden}
 :is(#mh-access,.mh-access):is(.mh-login,.mh-fleet-login,.mh-fleet-customer-login) :is(.login-shell,.shell,.auth-wrap):before{background:linear-gradient(180deg,rgba(9,17,14,.62) 0%,rgba(9,17,14,0) 16%,rgba(9,17,14,0) 82%,rgba(9,17,14,.72) 100%),linear-gradient(90deg,rgba(9,17,14,.35) 0%,rgba(9,17,14,.1) 100%)}
}
@media(max-width:900px){
 :is(#mh-access,.mh-access):is(.mh-login,.mh-fleet-login,.mh-fleet-customer-login){background:#fff}
 :is(#mh-access,.mh-access):is(.mh-login,.mh-fleet-login,.mh-fleet-customer-login) :is(.login-shell,.shell,.auth-wrap){grid-template-columns:minmax(0,1fr);grid-template-rows:auto auto 1fr;grid-template-areas:"top" "form" "legal";padding:22px 24px 24px;background:#fff}
 :is(#mh-access,.mh-access):is(.mh-login,.mh-fleet-login,.mh-fleet-customer-login) :is(.login-shell,.shell,.auth-wrap):before,:is(#mh-access,.mh-access):is(.mh-login,.mh-fleet-login,.mh-fleet-customer-login) :is(.hero-panel,.hero){display:none}
 :is(#mh-access,.mh-access):is(.mh-login,.mh-fleet-login,.mh-fleet-customer-login) .access-logo .logo-light{display:none}
 :is(#mh-access,.mh-access):is(.mh-login,.mh-fleet-login,.mh-fleet-customer-login) .access-logo .logo-dark{display:block}
 :is(#mh-access,.mh-access):is(.mh-login,.mh-fleet-login,.mh-fleet-customer-login) .access-back,:is(#mh-access,.mh-access):is(.mh-login,.mh-fleet-login,.mh-fleet-customer-login) .access-legal,:is(#mh-access,.mh-access):is(.mh-login,.mh-fleet-login,.mh-fleet-customer-login) .access-legal a{color:var(--mh-muted)}
 :is(#mh-access,.mh-access):is(.mh-login,.mh-fleet-login,.mh-fleet-customer-login) .access-back{padding:0;background:none;backdrop-filter:none}
 :is(#mh-access,.mh-access):is(.mh-login,.mh-fleet-login,.mh-fleet-customer-login) .access-back:hover{color:var(--mh-ink)}
 :is(#mh-access,.mh-access):is(.mh-login,.mh-fleet-login,.mh-fleet-customer-login) :is(.login-card,.card,.auth-card){align-self:start;max-width:520px;margin:0;padding:36px 0 32px;border-radius:0;box-shadow:none;background:transparent}
 :is(#mh-access,.mh-access):is(.mh-login,.mh-fleet-login,.mh-fleet-customer-login) :is(.login-card h2,.card h2,.auth-card h1){font-size:32px}
 :is(#mh-access,.mh-access):is(.mh-login,.mh-fleet-login,.mh-fleet-customer-login) .access-legal{align-self:end}
}