/* Approved Selected v0.2 lettering, scoped to welcome only. */
@font-face{font-family:BHSelected;src:url('assets/fonts/BibHuntersSelected-Thin.woff2') format('woff2');font-style:normal;font-weight:100;font-display:swap}
@font-face{font-family:BHSelected;src:url('assets/fonts/BibHuntersSelected-Bold.woff2') format('woff2');font-style:normal;font-weight:700;font-display:swap}
body[data-page=welcome]{background:#fff}
body[data-page=welcome] .app{background:#fff}
body[data-page=welcome] main{padding:0 24px 30px;min-height:0}
body[data-page=welcome] #header{height:70px;padding:12px 24px}
body[data-page=welcome] .welcome{container-type:inline-size}
body[data-page=welcome] .welcome-hero-original{margin:0 -24px}
/* Retain the approved sports crop and diagonal mask, not its embedded old text. */
body[data-page=welcome] .welcome h1{font-family:BHSelected,sans-serif;font-weight:100;font-synthesis:none;color:#095861;font-size:17.5cqw;line-height:1.05;letter-spacing:-1.3px;margin-top:calc(-36cqw);position:relative;z-index:2}
.welcome-title-line{display:block;white-space:nowrap}
body[data-page=welcome] .welcome h1 strong{font-weight:700}
body[data-page=welcome] .welcome-copy{font-family:BHSelected,sans-serif;font-weight:100;font-synthesis:none;font-size:max(24px,7cqw);line-height:1.45;letter-spacing:-.25px;color:#092636;margin:25px 0 0;white-space:normal}
body[data-page=welcome] .welcome-copy>span{display:block}
body[data-page=welcome] .welcome-copy em{font-style:normal;font-weight:700;color:#087d83}
body[data-page=welcome] .welcome-actions{margin-top:30px}
body[data-page=welcome] .welcome .primary,body[data-page=welcome] .welcome .secondary{font-family:BHSelected,sans-serif;font-weight:700;font-synthesis:none;font-size:20px;line-height:1.3;border-radius:12px;min-height:50px;padding:14px 10px;color:#095861}
body[data-page=welcome] .welcome .primary{background:#c6ed47}
body[data-page=welcome] .welcome .primary:hover{background:#b9df37}
body[data-page=welcome] .welcome .secondary{background:white;border:1px solid #087780;margin:10px 0 0}
body[data-page=welcome] .welcome .secondary:hover{background:#eefaf7}
body[data-page=welcome] .welcome footer{font-size:13px;margin:20px 0 0;line-height:1.6}
@media(max-width:374px){body[data-page=welcome] main{padding-left:20px;padding-right:20px}body[data-page=welcome] #header{padding-left:20px;padding-right:20px}body[data-page=welcome] .language-select{padding:6px}body[data-page=welcome] .welcome-hero-original{margin-left:-20px;margin-right:-20px}}

/* App-like welcome: everything fits on one screen without scrolling. The photo gives way first:
   it keeps its proportions and is trimmed from the top (the title sits on the white area at its bottom).
   On shorter screens the lower part gets compact so the photo keeps as much as possible. */
body[data-page=welcome] .welcome{display:flex;flex-direction:column;height:100%;box-sizing:border-box}
body[data-page=welcome] .welcome>*{flex:none}
body[data-page=welcome] .welcome-hero-original{flex:0 1 auto;min-height:96px;overflow:hidden;display:flex;flex-direction:column;justify-content:flex-end}
body[data-page=welcome] .welcome-hero-original .approved-art{flex:none}
body[data-page=welcome] .welcome-actions{margin-top:auto;padding-top:14px}
@media (max-height:820px){
 body[data-page=welcome] .welcome-copy{margin-top:10px;font-size:max(18px,5.4cqw);line-height:1.3}
 body[data-page=welcome] .welcome-actions{display:grid;grid-template-columns:1fr 1fr;gap:10px;padding-top:12px}
 body[data-page=welcome] .welcome .primary,body[data-page=welcome] .welcome .secondary{margin:0;min-height:46px;font-size:17px;padding:10px 8px}
 body[data-page=welcome] .welcome footer{grid-column:1/-1;margin-top:4px;text-align:center}
}

body[data-page=welcome] .welcome footer{display:flex;flex-direction:column;align-items:center;gap:6px;margin-top:8px;font-size:13px;color:var(--muted)}
body[data-page=welcome] .signin-cta{width:100%;min-height:48px;border:2px solid var(--teal);border-radius:14px;background:#fff;color:var(--teal);font:700 17px 'DM Sans',sans-serif;cursor:pointer}
body[data-page=welcome] .signin-cta:active{background:var(--mint)}
