/* The login does not use the application's main/sidebar spacing. */
html:has(.masa-login), body:has(.masa-login) { margin:0; padding:0; width:100%; min-height:100%; }
.masa-login { box-sizing:border-box; margin:0; width:100%; min-height:100svh; display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); align-items:center; gap:6vw; padding:5vh 6vw; background:#123d2e url('../img/login-bakery.png') center/cover no-repeat; color:#0c412f; }
.masa-login-story { align-self:stretch; padding:1.5vh 0; position:relative; }
.masa-login-horizontal { width:min(100%,390px); height:145px; object-fit:contain; object-position:left; }
.masa-login-symbols { display:flex; gap:2rem; margin:1.5vh 0; opacity:.16; }
.masa-login-symbols img { width:120px; height:100px; object-fit:contain; filter:brightness(0) invert(.9); }
.masa-login-story blockquote { color:#f4eddf; font-family:Georgia,serif; font-size:clamp(2.2rem,4.1vw,4.5rem); font-style:italic; line-height:1.06; margin:1rem 0 2rem 3vw; text-shadow:0 2px 12px #123d2e; }
.masa-login-accent { display:block; width:48px; height:5px; background:#b87e46; margin-left:3vw; }
.masa-login-card { width:100%; max-width:470px; justify-self:end; background:#faf8f4; border-radius:18px; overflow:hidden; box-shadow:0 22px 65px #0004; }
.masa-login-brand { position:relative; display:grid; place-items:center; padding:35px 32px 24px; }
.masa-login-logo-desktop { width:210px; height:200px; object-fit:contain; }
.masa-login-logo-mobile,.masa-login-wave,.masa-login-water,.masa-login-earth { display:none; }
.masa-login-form { padding:15px 38px 20px; }
.masa-login-field { margin-bottom:14px; }
.masa-login-input { display:flex; align-items:center; min-height:54px; padding:0 14px; border:1px solid #ddd9d3; border-radius:12px; background:#ffffff70; gap:12px; }
.masa-login-input:focus-within { border-color:#0c412f; box-shadow:0 0 0 3px #0c412f15; }
.masa-login-input>i { font-size:23px; color:#243b31; }
.masa-login-input input { width:100%; min-width:0; border:0; outline:none; background:transparent; color:#253d32; font-size:15px; padding:14px 0; box-shadow:none; }
.masa-login-input input::placeholder { color:#92908b; }
.masa-login-input button { border:0; background:transparent; padding:6px; color:#34413a; font-size:21px; }
.masa-login-options { display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:8px; font-size:12px; margin:5px 0 18px; color:#687168; }
.masa-login-options label { display:flex; align-items:center; gap:6px; margin:0; }
.masa-login-options input { accent-color:#0c412f; }
.masa-login-options a { color:#576d61; }
.masa-login-submit { display:flex; justify-content:center; align-items:center; position:relative; width:100%; min-height:54px; border-radius:11px; color:#fff; background:#0c412f; border:1px solid #0c412f; font-size:17px; }
.masa-login-submit:hover,.masa-login-submit:focus { color:#fff; background:#18553f; }
.masa-login-submit i { position:absolute; right:18px; font-size:23px; }
.masa-login .btn.masa-login-submit, .masa-login .btn.masa-login-submit:hover, .masa-login .btn.masa-login-submit:focus { color:#fff !important; }
.masa-login-divider { display:flex; align-items:center; gap:10px; margin:24px 0 18px; color:#85817b; font-size:13px; }
.masa-login-divider::before,.masa-login-divider::after { content:''; flex:1; height:1px; background:#dedbd6; }
.masa-login-social { display:flex; gap:10px; }
.masa-login-social button { flex:1; min-height:60px; border-color:#ddd9d3; border-radius:10px; color:#28382d; }
.masa-login-footer { min-height:145px; position:relative; display:flex; align-items:center; justify-content:flex-end; overflow:hidden; padding:30px 38px; background:radial-gradient(ellipse at 100% 140%,#e9dfd1 0 65%,transparent 65.5%); }
.masa-login-footer-earth { position:absolute; left:30px; bottom:-20px; width:75px; height:150px; object-fit:contain; opacity:.25; transform:rotate(20deg); }
.masa-login-bread,.masa-login-footer-water { display:none; }
.masa-login-footer p { position:relative; margin:0; font:italic 19px/1.2 Georgia,serif; }
.masa-login-footer p::after { content:''; display:block; width:24px; height:3px; background:#b87e46; margin-top:16px; }
.masa-login-mobile-quote { display:none; }
@media (min-width:1600px) { .masa-login-card { max-width:510px; margin-right:5vw; } }
@media (max-width:767.98px) {
 .masa-login { display:block; padding:0; min-height:100svh; background:#faf8f4; }
 .masa-login-story { display:none; }
 .masa-login-card { max-width:none; min-height:100svh; border-radius:0; box-shadow:none; display:flex; flex-direction:column; }
 .masa-login-brand { padding:35px 24px 55px; min-height:260px; background:radial-gradient(ellipse at top,#124b38,#082f23); overflow:hidden; }
 .masa-login-logo-desktop { display:none; }
 .masa-login-logo-mobile { display:block; position:relative; z-index:1; width:185px; height:185px; object-fit:contain; }
 .masa-login-wave { display:block; position:absolute; width:100%; height:42px; bottom:-1px; left:0; }
 .masa-login-water,.masa-login-earth { display:block; position:absolute; opacity:.1; filter:brightness(0) invert(1); object-fit:contain; }
 .masa-login-water { width:110px; height:100px; left:8px; top:40px; }
 .masa-login-earth { width:85px; height:165px; right:6px; top:50px; transform:rotate(-32deg); }
 .masa-login-form { padding:15px 24px 22px; width:100%; max-width:510px; margin:auto; }
 .masa-login-footer { min-height:220px; flex:1; padding:40px 24px 50px; isolation:isolate; background:linear-gradient(135deg,#f0e7da,#e9dfd1); }
 .masa-login-footer::before { content:''; position:absolute; top:-1px; left:0; width:100%; height:24px; background:#faf8f4; clip-path:ellipse(65% 85% at 38% 0); }
 .masa-login-footer-earth { right:-12px; left:auto; bottom:10px; opacity:.09; }
 .masa-login-footer-water { display:block; position:absolute; top:35px; left:26%; width:70px; height:48px; opacity:.12; }
 .masa-login-bread { display:block; position:absolute; left:-9%; bottom:-7px; width:77%; max-width:430px; height:auto; pointer-events:none; }
 .masa-login-desktop-quote { display:none; }
 .masa-login-mobile-quote { display:block; align-self:flex-start; width:38%; font-size:clamp(15px,4vw,19px)!important; }
}
@media (max-width:360px) { .masa-login-form { padding-left:16px; padding-right:16px; } .masa-login-options { font-size:11px; } }