:root { --welcome-navy:#092c4c; --welcome-deep:#051b30; --welcome-gold:#d2a64e; --welcome-gold-light:#f5dfa9; }
* { box-sizing:border-box; }
html { min-width:320px; background:var(--welcome-deep); }
body { margin:0; color:#fff; font-family:"Manrope",sans-serif; -webkit-font-smoothing:antialiased; }
a { color:inherit; text-decoration:none; }
.welcome-page { position:relative; min-height:100svh; overflow:hidden; background:var(--welcome-deep); }
.welcome-nav { position:absolute; z-index:10; top:0; right:0; left:0; display:flex; align-items:center; justify-content:space-between; gap:2rem; max-width:1500px; margin:auto; padding:clamp(1.2rem,3vw,2.3rem) clamp(1.2rem,5vw,5rem); }
.welcome-brand { display:inline-flex; align-items:center; gap:.8rem; }
.welcome-brand img { width:58px; height:58px; border-radius:15px; object-fit:cover; box-shadow:0 10px 30px rgba(0,0,0,.25); }
.welcome-brand>span { display:grid; line-height:1; }
.welcome-brand small { color:rgba(255,255,255,.76); font-size:.65rem; font-weight:800; letter-spacing:.17em; text-transform:uppercase; }
.welcome-brand strong { margin-top:.35rem; font-family:"Playfair Display",serif; font-size:1.35rem; }
.welcome-nav-actions { display:flex; align-items:center; gap:1.5rem; }
.welcome-user,.welcome-nav-link { color:rgba(255,255,255,.8); font-size:.78rem; font-weight:700; }
.welcome-nav-link:hover { color:var(--welcome-gold-light); }
.welcome-button { display:inline-flex; align-items:center; justify-content:center; gap:.65rem; min-height:48px; padding:.8rem 1.3rem; border:1px solid transparent; border-radius:13px; font-size:.76rem; font-weight:800; letter-spacing:.035em; transition:transform .2s,background .2s,border-color .2s,box-shadow .2s; }
.welcome-button:hover { transform:translateY(-2px); }
.welcome-button:focus-visible { outline:3px solid rgba(245,223,169,.5); outline-offset:3px; }
.welcome-button span { font-size:1rem; }
.welcome-button-light { background:rgba(255,255,255,.94); color:var(--welcome-deep); box-shadow:0 10px 30px rgba(0,0,0,.14); }
.welcome-button-primary { background:var(--welcome-navy); border-color:rgba(255,255,255,.15); box-shadow:0 10px 30px rgba(0,0,0,.2); }
.welcome-button-gold { background:linear-gradient(135deg,#e0b85f,#c49336); color:#172533; box-shadow:0 14px 34px rgba(174,126,40,.26); }
.welcome-button-outline { border-color:rgba(255,255,255,.42); background:rgba(5,27,48,.2); backdrop-filter:blur(8px); }
.welcome-button-outline:hover { border-color:var(--welcome-gold-light); background:rgba(255,255,255,.1); }
.welcome-hero { position:relative; display:flex; min-height:100svh; align-items:center; padding:9rem clamp(1.2rem,7vw,7rem) 10rem; isolation:isolate; background:url("../images/auth/catholic-school-campus.png") center/cover no-repeat; }
.welcome-overlay { position:absolute; z-index:-2; inset:0; background:linear-gradient(90deg,rgba(4,24,43,.75) 0%,rgba(4,24,43,.56) 43%,rgba(4,24,43,.2) 72%,rgba(4,24,43,.36) 100%),linear-gradient(0deg,rgba(4,24,43,.75),transparent 43%); }
.welcome-glow { position:absolute; z-index:-1; top:13%; left:4%; width:540px; height:540px; border-radius:50%; background:rgba(210,166,78,.09); filter:blur(90px); }
.welcome-content { width:min(760px,62vw); margin-top:-1rem; }
.welcome-eyebrow { display:inline-flex; align-items:center; gap:.65rem; color:var(--welcome-gold-light); font-size:.72rem; font-weight:800; letter-spacing:.16em; text-transform:uppercase; }
.welcome-eyebrow span { color:var(--welcome-gold); }
.welcome-content h1 { margin:1.25rem 0 1rem; font-family:"Playfair Display",serif; font-size:clamp(3rem,6vw,6.3rem); line-height:.98; letter-spacing:-.045em; text-wrap:balance; text-shadow:0 5px 35px rgba(0,0,0,.22); }
.welcome-content h1 em { color:var(--welcome-gold-light); font-style:normal; }
.welcome-content>p { max-width:650px; margin:0; color:rgba(255,255,255,.79); font-size:clamp(.95rem,1.25vw,1.12rem); line-height:1.8; }
.welcome-actions { display:flex; align-items:center; flex-wrap:wrap; gap:.85rem; margin-top:2rem; }
.welcome-quote { position:absolute; right:clamp(1.5rem,5vw,5rem); bottom:10.5rem; width:min(360px,28vw); padding:1.5rem; border:1px solid rgba(255,255,255,.2); border-radius:20px; background:rgba(4,24,43,.5); box-shadow:0 20px 60px rgba(0,0,0,.16); backdrop-filter:blur(14px); }
.welcome-quote-mark { display:block; height:1.8rem; color:var(--welcome-gold); font:3.5rem/1 Georgia,serif; }
.welcome-quote p { margin:.35rem 0 .9rem; color:rgba(255,255,255,.9); font-family:"Playfair Display",serif; font-size:1rem; line-height:1.6; }
.welcome-quote strong { color:var(--welcome-gold-light); font-size:.65rem; letter-spacing:.12em; text-transform:uppercase; }
.welcome-pillars { position:absolute; right:0; bottom:0; left:0; display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); max-width:1500px; margin:auto; padding:0 clamp(1.2rem,5vw,5rem) 2.3rem; }
.welcome-pillars article { display:flex; align-items:center; gap:.85rem; min-height:72px; padding:.75rem clamp(.8rem,2vw,1.75rem); border-top:1px solid rgba(255,255,255,.22); border-right:1px solid rgba(255,255,255,.14); background:rgba(4,24,43,.18); backdrop-filter:blur(8px); }
.welcome-pillars article:last-child { border-right:0; }
.welcome-pillar-icon { display:grid; flex:0 0 38px; place-items:center; width:38px; height:38px; border:1px solid rgba(245,223,169,.35); border-radius:12px; color:var(--welcome-gold-light); }
.welcome-pillars article div { display:grid; gap:.2rem; }
.welcome-pillars strong { font-family:"Playfair Display",serif; font-size:1rem; }
.welcome-pillars small { color:rgba(255,255,255,.63); font-size:.67rem; }
@media(max-width:1050px) { .welcome-content{width:min(680px,72vw)} .welcome-content h1{font-size:clamp(3rem,7vw,5.2rem)} .welcome-quote{display:none} }
@media(max-width:720px) {
    .welcome-nav{padding:1rem}.welcome-brand img{width:48px;height:48px;border-radius:12px}.welcome-brand strong{font-size:1.05rem}.welcome-nav-link,.welcome-user{display:none}.welcome-nav-actions{gap:.5rem}.welcome-nav-actions .welcome-button{min-height:42px;padding:.68rem .9rem;font-size:.68rem}
    .welcome-hero{align-items:flex-start;padding:8.5rem 1.2rem 14rem;background-position:43% center}.welcome-overlay{background:linear-gradient(180deg,rgba(4,24,43,.54),rgba(4,24,43,.7) 55%,rgba(4,24,43,.84))}.welcome-content{width:100%;margin-top:clamp(1rem,7vh,5rem)}.welcome-content h1{margin-top:1rem;font-size:clamp(2.65rem,13vw,4.2rem);line-height:1.02}.welcome-content>p{font-size:.9rem;line-height:1.65}.welcome-actions{align-items:stretch;flex-direction:column;margin-top:1.5rem}.welcome-actions .welcome-button{width:100%}
    .welcome-pillars{grid-template-columns:1fr;padding:0 1.2rem 1.2rem}.welcome-pillars article{min-height:58px;border-right:0}.welcome-pillars article:not(:first-child){display:none}
}
@media(max-width:390px) { .welcome-brand small{display:none}.welcome-nav-actions .welcome-button span{display:none}.welcome-eyebrow{font-size:.62rem} }
@media(prefers-reduced-motion:reduce) { *,*::before,*::after{transition:none!important} }