@font-face{font-family:ZuliaPoppins;src:url('/brand/fonts/Poppins-Regular.ttf') format('truetype');font-weight:400;font-display:swap}
@font-face{font-family:ZuliaPoppins;src:url('/brand/fonts/Poppins-SemiBold.ttf') format('truetype');font-weight:600;font-display:swap}
@font-face{font-family:ZuliaPoppins;src:url('/brand/fonts/Poppins-Bold.ttf') format('truetype');font-weight:700;font-display:swap}

.welcome-page{position:relative;isolation:isolate;min-height:100svh;overflow-x:hidden;margin:0;background:linear-gradient(148deg,#078ef4 0%,#0758db 38%,#086ce3 70%,#36aaff 100%);color:#fff;font-family:ZuliaPoppins,Poppins,system-ui,sans-serif}
.welcome-page:before{position:absolute;z-index:-2;inset:0;content:"";pointer-events:none;background:radial-gradient(ellipse at 6% 18%,#20c5ffb3,transparent 34%),radial-gradient(ellipse at 91% 43%,#137effa6,transparent 39%),linear-gradient(138deg,transparent 10%,#b9efff18 10.2%,transparent 26%,transparent 70%,#b9efff20 70.2%,transparent 82%)}
.welcome-page:after{position:absolute;z-index:-1;right:0;bottom:0;left:0;height:clamp(170px,27vh,300px);content:"";pointer-events:none;background:linear-gradient(0deg,#45baffaa 0%,#3baeff76 48%,#4bbaff12 100%),url('/brand/zuliago-cover-church.png') center bottom/cover no-repeat;opacity:.98}
.welcome-header{position:relative;z-index:5;display:flex;justify-content:flex-end;align-items:center;max-width:1180px;height:60px;margin:0 auto;padding:12px 26px 0;background:transparent!important;border:0!important}
.welcome-menu{position:relative;z-index:20}
.welcome-menu summary{display:grid;place-items:center;list-style:none;width:44px;height:44px;border:1px solid #ffffff55;border-radius:13px;background:#062a6e70;cursor:pointer;font-size:23px}
.welcome-menu summary::-webkit-details-marker{display:none}
.welcome-menu nav{position:absolute;top:51px;right:0;width:250px;padding:11px;border:1px solid #2a8bea;border-radius:15px;background:#061d4a;box-shadow:0 14px 35px #001a4a66}
.welcome-menu a{display:block;padding:12px;border-radius:9px;color:#eaf7ff;font-size:13px;text-decoration:none}
.welcome-menu a:hover{background:#0b3a83}
.welcome{width:min(100% - 32px,720px);margin:0 auto;padding:0 12px 32px;text-align:center}
.welcome-hero{margin:0 auto 23px}
.welcome-brand{display:flex;align-items:center;justify-content:center;width:235px;height:168px;margin:0 auto 5px}
.welcome-brand img{width:100%;height:100%;object-fit:contain;filter:grayscale(1) brightness(0) invert(1) drop-shadow(0 2px 12px #0061da90)}
.welcome h1{margin:0 0 7px;color:#fff;font-size:clamp(28px,5vw,42px);font-weight:700;letter-spacing:-.04em;line-height:1.12;text-shadow:0 2px 12px #00256b55}
.welcome-copy{margin:0;color:#edf8ff;font-size:clamp(14px,2.3vw,18px)}
.city-selector{display:flex;align-items:center;gap:9px;width:fit-content;min-width:280px;max-width:100%;margin:21px auto 0;padding:9px 16px;border:1px solid #fff;border-radius:30px;background:#f4fbfff2;color:#123d88;box-shadow:0 8px 18px #003a9b35}
.city-selector svg{width:22px;height:22px;flex:none;color:#075bd8}
.city-selector select{width:100%;min-width:0;border:0;outline:0;background:transparent;color:#143d7c;font:600 14px ZuliaPoppins,system-ui,sans-serif}
.city-selector option{color:#123d7c;background:#fff}
.portal-choices{display:grid;gap:15px;max-width:620px;margin:24px auto 0}
.welcome-page .portal-choice{display:flex;align-items:center;gap:18px;width:100%;min-height:102px;padding:14px 18px;border:1px solid #fff;border-radius:22px;background:linear-gradient(130deg,#fff,#e8f7fff5);box-shadow:0 10px 22px #00489c35;color:#12356e;text-align:left;transition:transform .18s,box-shadow .18s}
.welcome-page .portal-choice:hover{transform:translateY(-2px);box-shadow:0 14px 27px #00398450}
.welcome-page .customer-choice{border:2px solid #d9f8ff;background:linear-gradient(115deg,#0878ff,#0754d8 64%,#073da8);color:#fff;box-shadow:0 10px 24px #003cba55}
.portal-choice strong{display:block;font-size:clamp(19px,3vw,25px);font-weight:700;letter-spacing:-.025em;line-height:1.15}
.portal-choice small{display:block;max-width:370px;margin-top:4px;color:#234578;font-size:clamp(11px,1.7vw,15px);font-weight:400;line-height:1.4}
.customer-choice small{color:#effaff}
.choice-icon{display:flex;flex:none;align-items:center;justify-content:center;width:66px;height:66px;border-radius:19px;background:#e3f1ff;color:#075bd8}
.customer-choice .choice-icon{background:#ffffff1f;color:#fff}
.choice-icon svg{width:39px;height:39px}
.choice-arrow{display:flex;flex:none;align-items:center;justify-content:center;width:46px;height:46px;margin-left:auto;border-radius:50%;background:#d9eaff;color:#0c3d91}
.customer-choice .choice-arrow{background:#ffffff20;color:#fff}
.choice-arrow svg{width:25px;height:25px}
.welcome-explore{position:relative;z-index:1;display:inline-flex;align-items:center;gap:8px;margin:18px 0 0;color:#073878!important;font-size:12px;font-weight:600;text-underline-offset:4px}
.welcome-explore svg{width:16px;height:16px}
.welcome-note{position:relative;z-index:1;margin:12px 0 0;color:#073878;font-size:10px;font-weight:600}
.welcome-page .zg-footer{display:none}
.welcome-page button:focus-visible,.welcome-page a:focus-visible,.welcome-page summary:focus-visible,.welcome-page select:focus-visible{outline:3px solid #fff;outline-offset:4px}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}

@media(min-width:1000px){
 .welcome-header{height:66px}
 .welcome{padding-bottom:50px}
 .welcome-brand{width:220px;height:158px}
 .portal-choices{max-width:680px}
}
@media(max-width:560px){
 .welcome-header{height:50px;padding:7px 16px 0}
 .welcome-menu summary{width:40px;height:40px}
 .welcome{width:100%;padding:0 16px 27px}
 .welcome-brand{width:205px;height:145px;margin-bottom:1px}
 .welcome h1{font-size:clamp(27px,7.5vw,34px)}
 .city-selector{min-width:0;width:min(100%,310px);margin-top:16px;padding:8px 13px}
 .city-selector select{font-size:13px}
 .portal-choices{gap:12px;margin-top:21px}
 .welcome-page .portal-choice{min-height:91px;padding:12px 13px;gap:13px;border-radius:19px}
 .choice-icon{width:56px;height:56px;border-radius:16px}
 .choice-icon svg{width:32px;height:32px}
 .choice-arrow{width:39px;height:39px}
 .portal-choice strong{font-size:20px}
 .portal-choice small{font-size:11px}
 .welcome-explore{margin-top:15px}
}
@media(max-width:370px){
 .welcome-page .portal-choice{gap:9px;padding:10px}
 .choice-icon{width:48px;height:48px}
 .choice-icon svg{width:28px;height:28px}
 .portal-choice strong{font-size:18px}
}
@media(prefers-reduced-motion:reduce){.portal-choice{transition:none!important;transform:none!important}}
