/* Device frames use untouched screenshots from verified synthetic app journeys. */
.auth:has(.auth-panel){max-width:1120px;display:grid;grid-template-columns:minmax(0,1.2fr) minmax(300px,1fr);gap:1.25rem 3rem;padding:2rem;margin:2vh auto;align-items:start}
.auth:has(.auth-panel)>.brand{grid-column:1/-1;background:transparent;border:0;padding:0;border-radius:0}
.auth:has(.auth-panel)>.brand .official-brand-profile{width:120px;margin:0}
.auth-intro{min-width:0;padding-top:1.3rem}
.auth-eyebrow{font-size:.875rem;font-weight:650;color:var(--brand-muted);margin:0 0 .75rem}
.auth-intro h1{font-size:clamp(1.65rem,3vw,2.5rem);line-height:1.2;max-width:18ch;margin-bottom:1rem}
.auth-intro>p:not(.auth-eyebrow){max-width:44ch;color:var(--brand-muted);margin-bottom:2rem}
.auth-panel{min-width:0;background:white;border:1px solid var(--brand-border);border-radius:14px;padding:1.5rem}
.auth-panel nav{margin:0 0 1.25rem}
.auth-panel nav button{flex:1}
.auth-panel .card{padding:0;border:0;box-shadow:none;margin-bottom:1rem}
.auth-panel #resetRequest{width:100%}
.device-preview{margin:0;max-width:560px}
.device-pair{position:relative;width:100%;aspect-ratio:1.52;margin-bottom:1rem}
.laptop-device{position:absolute;left:0;top:8%;width:87%}
.laptop-screen{aspect-ratio:1.6;background:var(--brand-forest);border:8px solid #203c35;border-radius:13px 13px 3px 3px;overflow:hidden}
.laptop-screen img,.phone-screen img{display:block;width:100%;height:100%;object-fit:cover;object-position:top}
.laptop-base{position:relative;height:14px;background:linear-gradient(#dbe5dc,#b6c8bc);border-radius:2px 2px 30px 30px;width:107%;margin-left:-3.5%}
.laptop-base::before{content:'';position:absolute;top:0;left:42%;width:16%;height:5px;border-radius:0 0 5px 5px;background:#8fa298}
.phone-device{position:absolute;right:0;bottom:0;width:25%;padding:6px;background:#203c35;border-radius:21px;box-shadow:0 8px 18px #09372d26}
.phone-screen{aspect-ratio:9/19;border-radius:15px;overflow:hidden;background:var(--brand-canvas)}
.phone-camera{position:absolute;top:7px;left:36%;width:28%;height:6px;background:#203c35;border-radius:0 0 5px 5px;z-index:1}
.device-preview figcaption{font-size:.8125rem;line-height:1.5;color:var(--brand-muted);max-width:48ch}
@media(max-width:800px){
 .auth:has(.auth-panel){max-width:520px;grid-template-columns:minmax(0,1fr);gap:1.25rem;padding:1rem;margin:0 auto}
 .auth:has(.auth-panel)>.brand{grid-column:1;order:0}
 .auth:has(.auth-panel)>.brand .official-brand-profile{width:100px;margin:auto}
 .auth-panel{order:1;padding:1.25rem}
 .auth-intro{order:2;padding-top:.5rem}
 .auth-intro h1{font-size:1.65rem;max-width:22ch}
 .auth-intro>p:not(.auth-eyebrow){margin-bottom:1.25rem}
 .laptop-screen{border-width:5px;border-radius:9px 9px 2px 2px}
 .phone-device{padding:4px;border-radius:14px}
 .phone-screen{border-radius:10px}
 .phone-camera{top:4px;height:4px}
}


@media(max-width:800px){.auth-intro>p:not(.auth-eyebrow){margin-bottom:.5rem}.device-preview{margin-top:.5rem}}

/* Remove the mockup frame's internal top gap as well as the figure margin. */
@media(max-width:800px){.auth-intro>p:not(.auth-eyebrow){margin-bottom:0}.device-preview{margin-top:0}.laptop-device{top:0}}

.auth-panel .signup-terms-check{display:grid;grid-template-columns:auto minmax(0,1fr);align-items:start;column-gap:.5rem;cursor:pointer}
.auth-panel .signup-terms-check input[type="checkbox"]{width:1rem;height:1rem;margin:.15em 0 0;padding:0}

.auth-panel .signup-privacy{margin-left:1.5rem}

/* Carry the marketing palette into account access. */
.auth-panel #auth{background:#f8faf5;border-color:#dbe5db}
.auth-panel #auth input:not([type="checkbox"]){background:#fff}

.auth-panel{border-top:3px solid var(--brand-gold)}

/* Keep the single combined sign-in illustration within its responsive grid cell. */
.auth-intro .device-preview{width:100%;max-width:560px;min-width:0;box-sizing:border-box;overflow:hidden}
.auth-intro .device-preview>img{display:block;width:100%;max-width:100%;min-width:0;height:auto;object-fit:contain}
@media(max-width:800px){.auth-intro .device-preview{max-width:100%}}