/* Shared landing layout and architecture design. */
:root{font-family:Roboto,Arial,sans-serif;color:#243445;font-synthesis:none;--blue:#0170b9;--muted:#657280;--line:#dde4e8}
*{box-sizing:border-box}
body{margin:0}
button,input{font:inherit}
button,a,input{-webkit-tap-highlight-color:transparent}
button{cursor:pointer}
button:focus-visible,a:focus-visible,input:focus-visible,[tabindex]:focus-visible{outline:3px solid #2499ee;outline-offset:4px}
a{color:inherit}
.icon{display:block;width:24px;height:24px;flex:none}
[hidden]{display:none!important}
.design-canvas{background:#f7f9fa}
.canvas-content{padding:0 48px;max-width:1600px;margin:auto}
.brand-header{display:flex;align-items:center;justify-content:space-between;min-height:118px;border-bottom:1px solid #e3e9ed}
.brand-header img{display:block;width:212px;height:auto}
.brand-header>span{font-size:13px;color:#74818c}
.landing-grid{display:grid;grid-template-columns:minmax(0,1fr) 340px;gap:48px;align-items:center;padding:48px 0 54px}
.hero{min-width:0}
.eyebrow{display:flex;align-items:center;gap:9px;font-size:10px;font-weight:500;line-height:1.5;letter-spacing:.09em;text-transform:uppercase}
.eyebrow-mark{width:7px;height:7px;background:var(--blue);border-radius:1px;flex:none}
.hero h1{font-family:Montserrat,sans-serif;letter-spacing:-.045em;font-weight:600;line-height:1.12;margin:25px 0 23px}
.hero h1 em{font-style:normal;color:var(--blue)}
.hero-description{font-size:17px;line-height:1.65;color:var(--muted);margin:0;max-width:610px;text-wrap:pretty}
.hero h2{font-family:Montserrat,sans-serif;font-size:15px;font-weight:600;line-height:1.4;letter-spacing:-.025em}
.hero article p{font-size:14px;line-height:1.6;margin:0;color:var(--muted)}
.login-context{align-self:center}
.is-hidden{display:none!important}
.landing-login-form,.landing-login-form .form-group{display:flex;flex-direction:column}
.landing-login-form .form-group+.form-group{margin-top:18px}
.landing-login-form .form-group>small{margin-top:9px;color:#747e88;font-size:12px;line-height:1.5}
.landing-login-form .is-dimmed{opacity:.65}
.landing-login-form button:disabled{cursor:wait;opacity:.7}
.landing-change-email{width:100%;margin-top:10px;padding:12px;border:1px solid #dbe2e8;border-radius:11px;background:#fff;color:#0170b9;font-size:14px}
.landing-change-email:hover{background:#f1f7fb}
.notice{margin-bottom:18px;border:1px solid #cddfe9;border-radius:10px;background:#edf6fb;color:#326681;padding:12px;font-size:13px;line-height:1.5}
.notice--error{border-color:#efc8cb;background:#fff1f2;color:#9d2836}
.notice--success{border-color:#cce5d9;background:#eef8f1;color:#277345}
.demo-login{background:#fff;border:1px solid #e9eff3;padding:29px 26px;border-radius:24px;box-shadow:0 18px 55px #0170b910;display:flex;flex-direction:column}
.demo-login label{text-align:center;font-size:16px;color:#4b4f58;margin-bottom:15px}
.demo-login input{width:100%;height:51px;border:1px solid #dbe2e8;border-radius:11px;background:#fff;padding:0 14px;color:#35495a;font-size:15px}
.demo-login input::placeholder{color:#94a0aa}
.demo-login>small{margin-top:9px;color:#747e88;font-size:12px;line-height:1.5}
.demo-submit{width:100%;border:0;border-radius:11px;background:#0170b9;color:#fff;min-height:49px;font-weight:700;font-size:15px;margin-top:20px;box-shadow:0 5px 14px #0170b91a}
.demo-submit:hover{background:#0564a3}
.demo-consent{font-size:11px;color:#75818b;line-height:1.65;margin:20px 0 0}
.demo-consent a{color:#207ba9;text-decoration:none}
.demo-consent a:hover{text-decoration:underline}
.demo-feedback{font-size:12px;line-height:1.6;padding:10px 12px;color:#276385;background:#edf7fc;border-radius:8px;margin:14px 0 0}
.login-context-note{display:flex;align-items:center;justify-content:center;gap:7px;color:#8a969f;font-size:11px;margin:18px 0 0}
.login-context-note .icon{width:15px;height:15px}
.canvas-footer{display:flex;align-items:flex-start;justify-content:space-between;gap:24px;border-top:1px solid #e1e7eb;padding:25px 0 28px;font-size:12px;color:#65757e;line-height:1.6}
.canvas-footer nav{display:flex;flex-wrap:wrap;gap:10px 20px}
.canvas-footer__meta{max-width:760px}
.canvas-footer__meta p{margin:6px 0 0}
.canvas-footer__meta>a{font-weight:500}
.canvas-footer a{text-decoration:none}
.canvas-footer a:hover{text-decoration:underline}
.design-canvas--3{background:#fff;color:#304441}
.design-canvas--3 .brand-header,.design-canvas--3 .canvas-footer{border-color:#ddE3db}
.design-canvas--3 .landing-grid{grid-template-areas:"hero login";align-items:start;gap:40px;padding-top:36px;padding-bottom:39px}
.design-canvas--3 .login-context{grid-area:login;align-self:start}
@media(max-width:900px){.design-canvas--3 .landing-grid{grid-template-areas:"login" "hero"}}
.hero--architecture{grid-area:hero;padding:6px 0}
.hero--architecture .eyebrow{color:#627b74}
.hero--architecture .eyebrow-mark{background:#83a08f;border-radius:50%}
.architecture-intro{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);align-items:center;gap:0}
.architecture-copy{position:relative;z-index:1}
.hero--architecture h1{font-size:clamp(31px,3.6vw,51px);font-weight:500;letter-spacing:-.045em;line-height:1.12;margin-top:27px}
.hero--architecture h1 em{color:#0879ad}
.hero--architecture .hero-description{font-size:15px;line-height:1.7;color:#6c7c77;max-width:390px}
.architecture-art{width:calc(100% + 15px);margin-left:-7px;margin-top:15px}
.architecture-art svg{display:block;width:100%;height:auto}
.architecture-features{border-top:1px solid #d9e1d9;margin-top:29px}
.architecture-features article{display:flex;align-items:center;gap:17px;padding:17px 2px;border-bottom:1px solid #d9e1d9}
.feature-index{font-size:11px;color:#889c90;align-self:flex-start;padding-top:4px;font-family:Montserrat,sans-serif}
.architecture-features article>div{flex:1}
.architecture-features h2{font-size:14px;margin:0 0 4px;font-weight:600}
.architecture-features article p{font-size:12px;line-height:1.5;color:#728078}
.architecture-features .icon{width:21px;height:21px;margin-right:7px;color:#7e998b}
.design-canvas--3 .demo-login{border-color:#e4e9e2;box-shadow:0 18px 55px #475c4009}
@media(min-width:1500px){.landing-grid{grid-template-columns:minmax(0,1fr) 380px;gap:70px;padding-top:65px;padding-bottom:65px}
.hero--architecture .hero-description{font-size:17px}
.architecture-features article{padding:20px 2px}
.architecture-features h2{font-size:16px}
.architecture-features article p{font-size:14px}}
@media(max-width:1150px){.canvas-content{padding:0 30px}
.landing-grid{grid-template-columns:minmax(0,1fr) 310px;gap:30px}
.demo-login{padding:25px 22px}
.hero h2{font-size:13px}
.hero--architecture h1{font-size:37px}
.architecture-intro{grid-template-columns:1.4fr 1fr}
.hero--architecture .hero-description{font-size:14px}
.architecture-features h2{font-size:13px}
.architecture-features article p{font-size:11px}}
@media(max-width:900px){.canvas-content{padding:0 26px}
.brand-header{min-height:94px}
.brand-header img{width:180px}
.landing-grid,.design-canvas--3 .landing-grid{grid-template-columns:1fr;gap:32px;padding:30px 0 32px}
.login-context{width:100%;max-width:440px;margin:0 auto}
.hero h2{font-size:15px}
.hero--architecture h1{font-size:clamp(37px,6.7vw,53px)}
.architecture-intro{grid-template-columns:1.2fr 1fr}
.hero--architecture .hero-description{font-size:16px}
.architecture-features h2{font-size:15px}
.architecture-features article p{font-size:13px}
.architecture-art{width:100%;margin-left:0}
.canvas-footer{align-items:flex-start;flex-direction:column;gap:13px}}
@media(max-width:540px){.canvas-content{padding:0 22px}
.brand-header{min-height:85px}
.brand-header img{width:165px}
.brand-header>span{font-size:10px}
.landing-grid{gap:35px;padding-top:27px}
.eyebrow{font-size:8px;gap:7px;letter-spacing:.08em}
.eyebrow-mark{width:5px;height:5px}
.hero-description{font-size:15px;line-height:1.7}
.demo-login{border-radius:19px;padding:25px 22px}
.demo-login label{font-size:15px}
.demo-consent{font-size:11px}
.demo-login>small{font-size:11px}
.canvas-footer{font-size:11px;padding:22px 0 25px}
.canvas-footer nav{gap:17px}
.design-canvas--3 .landing-grid{padding-top:29px}
.architecture-intro{grid-template-columns:1fr;position:relative}
.hero--architecture h1{font-size:clamp(31px,9.7vw,47px);margin-top:22px;margin-bottom:21px}
.hero--architecture h1 br:last-child{display:none}
.hero--architecture .hero-description{font-size:14px;max-width:330px}
.architecture-art{width:265px;max-width:93%;margin:12px auto -10px}
.architecture-features{margin-top:17px}
.architecture-features article{gap:12px;padding:17px 0}
.architecture-features h2{font-size:13px;line-height:1.5}
.architecture-features article p{font-size:12px;line-height:1.55}
.architecture-features .icon{width:19px;height:19px;margin-right:0}
.feature-index{font-size:10px}
.design-canvas--3 .landing-grid{gap:29px}}
@media(prefers-reduced-motion:no-preference){button{transition:background .15s ease,color .15s ease}
.hero{animation:appear .3s ease both}
@keyframes appear{from{opacity:.45;transform:translateY(5px)}to{opacity:1;transform:none}}}
