/* Approved visual direction, 2026-10-07. Content remains source-based. */
:root{--ink:#072c59;--muted:#46648a}
.site-header{background:#f8fcfff2;border-bottom-color:transparent}
.hero{height:800px;overflow-x:clip;overflow-y:visible;z-index:2;background:radial-gradient(ellipse at 75% 45%,#e4f2ff,transparent 53%),linear-gradient(135deg,#f8fcff,#f2f9ff 65%,#d9edff);color:var(--ink)}
.hero-light-field{position:absolute;inset:0;overflow:hidden;pointer-events:none}
.hero-light-field:before,.hero-light-field:after{content:"";position:absolute;display:block;z-index:0;pointer-events:none;left:-18%;bottom:-50px;width:136%;height:400px;border:2px solid #fff;border-radius:50%;transform:rotate(-10deg);box-shadow:0 -5px 16px #fff,0 -27px 55px #c3e3ff80,inset 0 15px 30px #ffffff85}
.hero-light-field:after{bottom:8px;left:-6%;width:104%;height:190px;transform:rotate(7deg);opacity:.65;box-shadow:0 -6px 18px #fff}
.hero-inner{width:min(1310px,calc(100% - 110px));z-index:1}
.hero-copy{max-width:57%;padding-bottom:30px}
.hero h1{font-size:78px;letter-spacing:-.045em;line-height:1.15}
.hero h1>span{font-size:45px;color:var(--ink);margin-top:10px;letter-spacing:-.04em}
.hero-tags{font-size:29px;letter-spacing:.04em;margin:23px 0 34px}
.hero .button{min-height:65px;padding:14px 30px;font-size:20px}
.hero .outline-light{border-color:#2676b5;background:#ffffff60;color:#09477f}
.hero-arch{position:absolute;right:26px;top:6px;width:530px;height:795px;border-radius:150px 150px 0 0;background:linear-gradient(125deg,#a7d1ff,#72b2ff 29%,#d5edff 54%,#69a9f6);box-shadow:inset 4px 0 8px #fff7,inset -14px 5px 28px #498fee40;transform:perspective(1300px) rotateY(-12deg);mask-image:linear-gradient(#000 85%,transparent);pointer-events:none}
.hero-arch:before{content:"";position:absolute;inset:87px 89px -4px;border-radius:80px 80px 0 0;background:linear-gradient(120deg,#fbfdff,#eff8ff 65%,#d5eaff);box-shadow:inset 7px 1px 8px #3f8dda30}
.hero-arch:after{content:"";position:absolute;top:3%;bottom:0;left:18%;width:2px;transform:rotate(-16deg);background:linear-gradient(transparent,#fff9,transparent)}
.hero-visual{top:18px;right:-42px;bottom:auto;width:680px;z-index:2;pointer-events:none}
.hero-visual video{width:100%;height:auto;mask-image:linear-gradient(#000 85%,transparent 99%)}
.hero-bottom{bottom:37px;z-index:4}
.hero-footnote{font-size:17px;color:#285785;text-shadow:none}
.motion-toggle{color:#2b6093;background:#f4faffc9;border-color:#80b9e2}
.meet{height:270px;position:relative;z-index:1;background:linear-gradient(110deg,#fff,#f6fbff);overflow:hidden}
.meet-grid{width:min(1310px,calc(100% - 110px));display:flex;align-items:center;justify-content:flex-start}
.meet-copy{padding:25px 0;width:58%}
.meet-copy h2{font-size:49px;position:relative}
.meet-copy h2:after,.categories h2:after,.offer h2:after,.faq h2:after{content:"";display:block;width:55px;height:5px;margin-top:12px;background:linear-gradient(90deg,#006fe6,#2fc0ff);border-radius:5px}
.meet-copy p{font-size:23px;margin:15px 0 9px;line-height:1.55}
.meet-copy p br{display:none}
.meet-copy .button{border:0;background:none;box-shadow:none;padding:4px 0;min-height:34px;font-size:15px;gap:10px}
.explore{height:725px;padding:54px 0;position:relative;z-index:3;background:radial-gradient(ellipse at 50% 68%,#073263,transparent 34%),repeating-linear-gradient(132deg,transparent 0 155px,#0d366420 156px 158px,transparent 159px 340px),linear-gradient(105deg,#06172f,#042044 52%,#06192f)}
.explore>.container{width:min(1320px,calc(100% - 92px))}
.explore .section-head{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;left:0;top:0}
.explore-grid{grid-template-columns:1fr .83fr 1fr;grid-template-rows:1fr 1fr;gap:27px 24px}
.feature-card{border-radius:24px;border-color:#6ab5ff;box-shadow:inset 0 0 29px #448ce755,0 0 10px #6bbcff55;background:linear-gradient(130deg,#16375c,#04182f 55%,#143a68);padding:30px 20px}
.feature-card>svg{width:90px;height:90px;margin-bottom:17px;padding:16px;border:0;border-radius:0;background:none;color:#1c88ff;filter:drop-shadow(0 0 7px #1686ff60);stroke-width:1.9}
.feature-card h3{font-size:31px;margin-bottom:10px}
.feature-card p{font-size:21px}
.explore-emblem{padding-top:0;align-items:center;overflow:visible}
.emblem-badge{width:100%;max-width:335px;animation:brand-float 6s ease-in-out infinite;filter:drop-shadow(0 0 12px #137bfc33)}
.approved-logo{position:relative;width:100%;display:block}
.approved-logo img{width:100%}
.approved-logo .logo-white{filter:brightness(0) invert(1)}
.approved-logo .logo-colour{position:absolute;inset:0;clip-path:polygon(0 0,48% 0,48% 40%,44% 74%,44% 100%,0 100%)}
.emblem-floor{width:100%;max-width:320px;height:3px;bottom:31%;border:0;border-radius:50%;background:linear-gradient(90deg,transparent,#0065d2,#fff,#1477e1,transparent);box-shadow:0 0 18px 5px #128bff99;transform:none}
.emblem-floor:before{inset:-5px 25%;background:radial-gradient(ellipse,#eaffff 0,#7acaefaa 25%,transparent 70%);border:0}
.emblem-floor:after,.emblem-light{display:none}
.categories{padding:45px 0 28px}
.categories>.container{width:min(1320px,calc(100% - 92px))}
.categories .section-head{display:flex;align-items:center;justify-content:space-between;gap:20px;text-align:left}
.categories .section-head h2{font-size:49px}
.categories .section-head p{font-size:21px;margin:0}
.category-track{gap:15px;padding:30px 15px 10px}
.category-option{flex:1;transition:flex .3s}
.category-option.active{flex:1.3}
.category-image{background-image:url("assets/category-approved.png");transform:scale(.89);border:6px solid #eafaff;outline:2px solid #27a7ed;box-shadow:0 0 0 8px #a7ddff44,0 5px 15px #226bd244}
.art-live{background-position:0 0}.art-slots{background-position:100% 0}.art-sports{background-position:0 100%}.art-chess{background-position:100% 100%}
.category-image>span{display:none}
.category-option.active .category-image{transform:scale(1)}
.category-option strong,.category-option.active strong{visibility:visible;margin-top:13px;font-size:25px}
.category-controls{top:54%;left:-24px;right:-24px}
.category-controls button{width:44px;height:44px;background:#d5eafa;border-color:#c1e1f5;color:#8dbbd9}
.category-description .button{font-size:13px;min-height:34px}
.offer{height:410px;background:linear-gradient(105deg,#ddebfa,#f6fbff 48%,#e0efff)}
.offer-inner{width:min(1320px,calc(100% - 110px));grid-template-columns:45% 55%}
.offer-copy h2{font-size:49px}
.offer-copy>p{font-size:23px}
.offer-restriction{font-size:13px}
.gift-art img{object-fit:cover;object-position:57% center;mask-image:linear-gradient(90deg,transparent,#000 15%,#000 94%,transparent)}
.faq{padding:32px 0 41px;min-height:365px}
.faq>.container{width:min(1320px,calc(100% - 110px))}
.faq h2{font-size:43px;margin-bottom:20px}
.faq h2:after{height:4px;width:49px;margin-top:10px}
.faq-list summary{min-height:63px;background:#f0f8ff80}
.site-footer{padding:34px 0 27px}
.site-footer>.container{width:min(1320px,calc(100% - 92px))}
@media(max-width:1150px) and (min-width:781px){
 .hero{height:660px}.hero-inner,.meet-grid{width:calc(100% - 64px)}.hero-copy{max-width:56%}.hero h1{font-size:61px}.hero h1>span{font-size:35px}.hero-tags{font-size:23px;gap:11px}.hero-tags span+span:before{margin-right:11px}.hero .button{min-height:53px;font-size:15px;padding:12px 23px;gap:14px}
 .hero-visual{width:550px;right:-64px;top:17px}.hero-arch{width:420px;height:630px;right:3px;border-radius:105px 105px 0 0}.hero-arch:before{inset:65px 65px -4px;border-radius:50px 50px 0 0}
 .hero-bottom{bottom:28px}.hero-footnote{font-size:14px}.meet{height:240px}.meet-copy{width:59%;padding:22px 0}.meet-copy h2{font-size:39px}.meet-copy p{font-size:18px}
 .explore{height:580px;padding:42px 0}.explore>.container{width:calc(100% - 60px)}.explore-grid{gap:23px 20px}.feature-card{padding:23px 12px;border-radius:18px}.feature-card>svg{width:65px;height:65px;padding:9px;margin-bottom:12px}.feature-card h3{font-size:25px}.feature-card p{font-size:16px}.emblem-floor{bottom:30%}
 .categories h2,.categories .section-head h2{font-size:40px}.categories .section-head p{font-size:15px}.category-option strong{font-size:20px}.categories>.container{width:calc(100% - 64px)}.category-image{border-width:4px}
 .offer{height:340px}.offer-copy h2{font-size:40px}.offer-copy>p{font-size:18px}.offer-inner,.faq>.container{width:calc(100% - 70px)}.faq h2{font-size:37px}
}
@media(max-width:780px){
 .hero{height:auto;min-height:0;overflow:hidden;background:radial-gradient(ellipse at 80% 60%,#d8eeff,transparent 65%),linear-gradient(#fbfdff,#e6f4ff)}
 .hero-inner{width:calc(100% - 36px);padding-top:38px}
 .hero-copy{max-width:100%;padding:0;text-align:left}
 .hero h1{font-size:49px}.hero h1>span{font-size:clamp(22px,5.3vw,34px);line-height:1.3;margin-top:8px}
 .hero-tags{font-size:19px;gap:8px;letter-spacing:.02em;margin:20px 0 23px}.hero-tags span+span:before{margin-right:8px}
 .hero .button{min-height:47px;padding:11px 20px;font-size:14px}
 .hero-arch{top:260px;right:0;width:265px;height:520px;border-radius:74px 74px 0 0;opacity:.75}
 .hero-arch:before{inset:47px 42px -5px;border-radius:40px 40px 0 0}
 .hero-visual{position:relative;top:auto;right:auto;bottom:auto;width:365px;max-width:100%;height:auto;overflow:visible;margin:8px auto 45px}
 .hero-visual video{mask-image:linear-gradient(#000 88%,transparent)}
 .hero-bottom{bottom:15px;width:calc(100% - 36px);align-items:center}
 .hero-footnote{font-size:10px}.motion-toggle{font-size:10px;min-height:36px}
 .hero-light-field:before{height:160px;bottom:0;width:150%;left:-25%;transform:rotate(-12deg)}
 .hero-light-field:after{height:100px;bottom:5px;width:130%;left:-10%;transform:rotate(7deg)}
 .meet{height:auto;min-height:0;padding:26px 0 27px}
 .meet-grid{width:calc(100% - 40px);display:block}
 .meet-copy{width:100%;padding:0;text-align:left}
 .meet-copy h2{font-size:31px}.meet-copy h2:after{width:35px;height:3px;margin-top:8px}
 .meet-copy p{font-size:17px;margin:13px 0 6px;line-height:1.7}
 .meet-copy .button{font-size:13px;min-height:34px}
 .explore{height:auto;padding:27px 0 30px}
 .explore>.container{width:calc(100% - 32px)}
 .explore-grid{grid-template-columns:1fr 1fr;grid-template-rows:1fr 116px 1fr;gap:10px 13px}
 .explore-emblem{grid-column:1/3;grid-row:2;padding:0}
 .emblem-badge{scale:1;max-width:192px;transform-origin:center}
 .emblem-floor{max-width:205px;bottom:10%;height:2px}
 .feature-card{padding:18px 8px;min-height:165px;border-radius:13px}
 .feature-card:nth-child(1){grid-column:1;grid-row:1}.feature-card:nth-child(2){grid-column:2;grid-row:1}.feature-card:nth-child(4){grid-column:1;grid-row:3}.feature-card:nth-child(5){grid-column:2;grid-row:3}
 .feature-card>svg{width:54px;height:54px;padding:4px;margin-bottom:10px}
 .feature-card h3{font-size:20px;margin-bottom:6px}.feature-card p{font-size:12px}
 .categories{padding:27px 0 22px}.categories>.container{width:calc(100% - 32px)}
 .categories .section-head{display:block}.categories .section-head h2{font-size:31px}
 .categories h2:after{width:34px;height:3px;margin-top:8px}
 .categories .section-head p{font-size:12px;margin-top:9px}
 .category-track{gap:17px;padding:24px 8px 8px;margin-right:-16px;align-items:center}
 .category-option,.category-option.active{flex:0 0 155px;min-width:155px}
 .category-image{border-width:3px;outline-width:1px;transform:scale(.87)}
 .category-option strong,.category-option.active strong{font-size:17px;margin-top:7px}
 .category-controls{top:55%;left:-8px;right:-8px}
 .category-description .button{min-height:44px;font-size:12px}
 .offer{height:auto}.offer-inner{width:calc(100% - 40px);grid-template-columns:1fr;grid-template-rows:auto auto}
 .offer-copy{padding:27px 0 0}.offer-copy h2{font-size:33px}.offer h2:after{width:37px;height:3px;margin-top:8px}
 .offer-copy>p{font-size:18px}.offer-restriction{font-size:12px}
 .gift-art{height:230px;margin-top:0}.gift-art img{object-fit:cover;object-position:60% 55%;mask-image:linear-gradient(90deg,transparent,#000 10%,#000 95%,transparent)}
 .faq{padding:25px 0 28px;min-height:0}.faq>.container{width:calc(100% - 32px)}.faq h2{font-size:30px;margin-bottom:17px}
 .faq h2:after{width:36px;height:3px;margin-top:8px}.faq-list summary{min-height:55px}
 .site-footer{padding:24px 0}.site-footer>.container{width:calc(100% - 36px)}
}
@media(max-width:360px){
 .hero h1{font-size:42px}.hero h1>span{font-size:24px}.hero-tags{font-size:17px;gap:7px}.hero-tags span+span:before{margin-right:7px}.hero .button{padding:10px 16px;font-size:12px}
 .hero-visual{width:310px;margin-bottom:47px}.hero-arch{top:258px;right:-7px;width:250px;height:420px}
 .feature-card h3{font-size:18px}.feature-card p{font-size:11px}
 .category-option,.category-option.active{flex-basis:143px;min-width:143px}
}
@media(prefers-reduced-motion:reduce){.category-option{transition:none}}