/* YoPas: a clear route from finding an event to getting through the gate. */
:root{--blue:#2469ae;--dark:#173b66;--yellow:#f2d335;--paper:#f5f8fb;--ink:#17324d;--muted:#586b7b;--line:#dce6ee;--shell:min(1180px,calc(100% - 48px))}
body{font-family:"DM Sans",Arial,sans-serif;color:var(--ink);line-height:1.55}
button,input{font-family:inherit}
a:focus-visible,button:focus-visible,input:focus-visible{outline:3px solid var(--yellow);outline-offset:3px}
h1,h2,h3{letter-spacing:-.035em}

/* The small yellow edge comes from the YoPas mark. It is used once in the header. */
.site-header{top:14px;padding-inline:24px}
.header-inner{height:66px;max-width:1210px;padding:0 12px 0 20px;border:1px solid rgba(255,255,255,.7);border-radius:20px;background:rgba(255,255,255,.94);box-shadow:0 10px 34px rgba(12,49,87,.11);backdrop-filter:blur(18px)}
.brand{width:118px}
.brand img{height:auto}
.desktop-nav{gap:0;margin-left:auto;border:0;background:transparent}
.desktop-nav a{height:40px;padding-inline:13px;border-radius:11px;color:#35516a;font-size:.82rem}
.desktop-nav a.active{background:#e8f3fb;color:#145896;box-shadow:none}
.desktop-nav a:hover{background:#edf5fa}
.header-cta{border-radius:12px;background:var(--dark);font-size:.8rem}
.header-cta:hover{background:#245989}
.button{min-height:48px;padding:.7rem 1.35rem;border-radius:12px;font-size:.86rem;transition:background .2s,border-color .2s}
.button:hover{transform:none;background:#ffe44d;border-color:#ffe44d}
.button.button-whatsapp{border-color:#25D366!important;background:#25D366!important;color:#073b20!important;text-decoration:none!important}
.button.button-whatsapp:hover{border-color:#20bd59!important;background:#20bd59!important;color:#073b20!important}
.button.button-outline{background:transparent;color:var(--blue);text-decoration:none}
.button-dark:hover{background:#275b8a;border-color:#275b8a}
.support-launcher,.support-body,.support-actions .button,.event-search input,.event-filters button{font-family:"DM Sans",Arial,sans-serif}

.brand-hero{padding:128px 0 70px;background:#173b66;color:white;overflow:hidden}
.brand-home{background:#173b66}
.brand-organisers{background:#edf5f9;color:var(--ink)}
.brand-events{background:#173b66}
.brand-hero-grid{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);align-items:center;gap:clamp(35px,6vw,92px)}
.brand-hero-copy h1{max-width:570px;margin:0;font-size:clamp(2.5rem,4vw,3.8rem);font-weight:700;line-height:1.08;letter-spacing:-.045em}
.brand-hero-copy>p{max-width:480px;margin:22px 0 28px;color:#d9e8f5;font-size:1.05rem;line-height:1.58}
.brand-organisers .brand-hero-copy>p{color:#52687b}
.brand-hero-actions{display:flex;align-items:center;gap:20px;flex-wrap:wrap}
.brand-text-link{max-width:220px;color:white;font-size:.84rem;font-weight:700;line-height:1.35;text-decoration-thickness:1px;text-underline-offset:5px}
.brand-organisers .brand-text-link{color:var(--dark)}
.brand-media{position:relative;aspect-ratio:1.3;min-height:330px;overflow:hidden;border:7px solid rgba(255,255,255,.88);border-radius:24px;background:#102d49;box-shadow:0 25px 60px rgba(5,27,49,.22)}
.brand-media:after{content:"";position:absolute;right:-54px;bottom:-54px;width:95px;height:95px;transform:rotate(45deg);background:var(--yellow)}
.brand-media video{display:block;width:100%;height:100%;object-fit:cover}
.brand-organisers .brand-media{border-color:white}

.brand-paths{display:grid;grid-template-columns:1fr 1fr;gap:0;margin-top:-30px;position:relative;z-index:2;overflow:hidden;border-radius:18px;background:white;box-shadow:0 16px 45px rgba(12,49,87,.11)}
.brand-paths a{display:grid;grid-template-columns:1fr auto;gap:2px 12px;min-height:116px;padding:24px 32px;text-decoration:none;transition:background .2s}
.brand-paths a+a{border-left:1px solid var(--line)}
.brand-paths a:hover{background:#f0f7fc}
.brand-paths a span:first-child{color:var(--muted);font-size:.8rem}
.brand-paths a strong{grid-column:1;color:var(--dark);font-size:1.2rem;line-height:1.1}
.brand-paths a span:last-child{grid-column:2;grid-row:1/3;align-self:center;color:var(--blue);font-size:1.5rem}

.brand-section{padding-block:90px}
.brand-section-head{display:flex;align-items:end;justify-content:space-between;gap:20px;margin-bottom:32px}
.brand-section-head h2,.brand-how h2,.brand-etag h2,.brand-closing h2,.organiser-route h2,.brand-payment h2{max-width:650px;margin:0;color:var(--dark);font-size:clamp(2rem,3vw,3rem);font-weight:700;line-height:1.13}
.brand-section-head p,.brand-how p,.brand-etag p,.brand-closing p,.organiser-route p,.brand-payment p{margin:10px 0 0;color:var(--muted);font-size:.98rem}
.brand-section-head>a,.brand-how>a{color:var(--blue);font-size:.86rem;font-weight:700;text-underline-offset:5px;white-space:nowrap}
.home-events{background:white}
.event-grid,.home-event-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}
.home-events .event-card,.event-card,.event-results .event-card{overflow:hidden;border:1px solid var(--line);border-radius:14px;background:white;box-shadow:none}
.event-cover,.event-results .event-cover{aspect-ratio:4/3;border-radius:0!important;background:#e6eff4}
.event-cover:after{display:none}
.event-cover img{transition:transform .35s ease}
.event-card:hover .event-cover img{transform:scale(1.025)}
.event-body{grid-template-columns:44px minmax(0,1fr);gap:15px;padding:20px}
.event-body time{padding-right:11px;color:var(--blue)}
.event-body time strong{font-size:1.38rem}
.event-body h2,.event-body h3{font-size:1rem;font-weight:700}
.event-body p{font-size:.78rem}
.event-footer{margin-top:18px;font-size:.78rem}
.event-footer strong{color:var(--dark)}
.brand-empty{display:flex;align-items:center;justify-content:space-between;gap:30px;padding:35px;border:1px solid var(--line);border-radius:16px;background:#f4f8fb}
.brand-empty h2,.brand-empty h3{margin:0;color:var(--dark);font-size:1.35rem}
.brand-empty p{max-width:620px;margin:7px 0 0;color:var(--muted);font-size:.87rem}

.brand-how{display:grid;grid-template-columns:.75fr 1.25fr;gap:25px 70px;padding-block:85px;border-top:1px solid var(--line)}
.brand-how ol{display:grid;grid-template-columns:repeat(3,1fr);gap:0;align-items:start;margin:0;padding:0;list-style:none}
.brand-how li{padding:15px 18px;border-left:1px solid var(--line)}
.brand-how li b{display:block;width:29px;height:29px;margin-bottom:14px;border-radius:8px;background:#dceef9;color:var(--blue);text-align:center;font-size:.8rem;line-height:29px}
.brand-how li span{font-size:.88rem;font-weight:700}
.brand-how>a{grid-column:2}
.brand-etag{overflow:hidden;background:#eaf3f8}
.brand-etag-grid{display:grid;grid-template-columns:.82fr 1.18fr;align-items:center;gap:70px;min-height:540px}
.brand-etag p{max-width:440px;margin-bottom:25px}
.brand-etag img{align-self:end;width:100%;height:500px;object-fit:cover;object-position:center 22%;border-radius:24px 24px 0 0}
.brand-closing{display:flex;align-items:center;justify-content:space-between;gap:45px;padding-block:75px}
.brand-closing>div:last-child{display:flex;align-items:center;gap:20px;flex-wrap:wrap}
.brand-closing>div:last-child>a:not(.button){color:var(--blue);font-size:.86rem;font-weight:700;text-underline-offset:5px}

.event-catalogue.brand-section{padding-block:75px 100px;background:white}
.event-browser-head{align-items:end;margin-bottom:20px}
.event-search input{height:46px;border-radius:11px}
.event-filters{margin-bottom:28px}
.event-filters button{border-radius:10px}
.event-filters button.active{background:var(--dark)}
.event-results .event-cover{aspect-ratio:4/3}

.organiser-jobs{padding-top:95px}
.organiser-job-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:0;margin-top:44px;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.organiser-job-grid article{min-height:170px;padding:38px 25px 28px 0}
.organiser-job-grid article+article{padding-left:25px;border-left:1px solid var(--line)}
.organiser-job-grid h3{margin:0 0 8px;color:var(--dark);font-size:1.04rem}
.organiser-job-grid p{margin:0;color:var(--muted);font-size:.86rem}
.organiser-route{padding:90px 0;background:#eaf3f8}
.organiser-route-grid{display:grid;grid-template-columns:.85fr 1.15fr;gap:90px}
.organiser-route p{max-width:440px;margin-bottom:28px}
.organiser-route ol{margin:0;padding:0;list-style:none}
.organiser-route li{display:grid;grid-template-columns:36px 1fr;gap:17px;padding:18px 0;border-bottom:1px solid #cedde7}
.organiser-route li:first-child{border-top:1px solid #cedde7}
.organiser-route li b{display:grid;place-items:center;width:30px;height:30px;border-radius:8px;background:var(--yellow);font-size:.8rem}
.organiser-route li strong,.organiser-route li span{display:block}
.organiser-route li strong{font-size:.97rem}
.organiser-route li span{margin-top:4px;color:var(--muted);font-size:.83rem}

.brand-page-intro{padding:165px 0 70px;background:#eaf3f8}
.brand-page-intro h1{max-width:780px;margin:0;color:var(--dark);font-size:clamp(2.5rem,4vw,3.8rem);line-height:1.08}
.brand-page-intro p{max-width:580px;margin:18px 0 0;color:var(--muted);font-size:1.02rem}
.brand-journeys{display:grid;grid-template-columns:1fr 1fr;gap:28px;padding-block:80px}
.brand-journeys article{padding:30px 34px;border:1px solid var(--line);border-radius:16px;background:white}
.brand-journeys article:last-child{background:var(--dark);color:white}
.journey-heading{display:flex;align-items:center;justify-content:space-between;gap:15px;padding-bottom:25px;border-bottom:1px solid var(--line)}
.journey-heading span{font-weight:700}
.journey-heading a{color:var(--blue);font-size:.83rem;font-weight:700}
.brand-journeys article:last-child .journey-heading{border-color:rgba(255,255,255,.25)}
.brand-journeys article:last-child .journey-heading a{color:var(--yellow)}
.brand-journeys ol{margin:0;padding:0;list-style:none}
.brand-journeys li{display:grid;grid-template-columns:28px 1fr;gap:17px;padding:22px 0;border-bottom:1px solid var(--line)}
.brand-journeys li:last-child{border:0}
.brand-journeys article:last-child li{border-color:rgba(255,255,255,.2)}
.brand-journeys li b{color:var(--blue);font-size:.88rem}
.brand-journeys article:last-child li b{color:var(--yellow)}
.brand-journeys h2{margin:0;font-size:1.03rem;line-height:1.3}
.brand-journeys p{margin:5px 0 0;color:var(--muted);font-size:.84rem}
.brand-journeys article:last-child p{color:#c7d8e8}
.brand-payment{padding:75px 0;background:#eaf3f8}
.brand-payment-grid{display:grid;grid-template-columns:1fr 1fr;gap:80px;align-items:center}
.payment-methods{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.payment-methods span{padding:17px 18px;border-radius:10px;background:white;font-size:.89rem;font-weight:700}
.payment-methods .method-airtel{border-left:5px solid #d9222a;color:#a71a20}
.payment-methods .method-mtn{border-left:5px solid #f0cf00;color:#5f5300}
.payment-methods .method-bank{border-left:5px solid #3576a3;color:#225b80}
.payment-methods small{grid-column:1/-1;color:var(--muted);font-size:.7rem}

/* Keep the e-tag page in the same family without disguising the photo. */
.etag-intro{padding:150px 0 70px;background:#eaf3f8}
.etag-intro .intro-two{grid-template-columns:.85fr 1.15fr;gap:65px}
.etag-intro h1{font-size:clamp(2.65rem,4.3vw,4.4rem)}
.etag-intro .intro-two>img{height:520px;border-radius:18px;box-shadow:none}
.etag-story{padding-block:80px}
.story-title h2{font-size:clamp(2rem,3vw,3rem)}
.story-steps li>span{margin-bottom:18px}
.etag-demo{border-radius:18px}
.etag-benefits article{border-top:2px solid var(--yellow);background:#f4f8fb}
.simple-cta{background:#eaf3f8}
.site-footer{background:#f7fafc}

.etag-brand-hero{padding:130px 0 0;background:#eaf3f8;overflow:hidden}
.etag-brand-grid{display:grid;grid-template-columns:.87fr 1.13fr;align-items:center;gap:65px}
.etag-brand-grid>div{padding-bottom:70px}
.etag-brand-grid h1{max-width:540px;margin:0;color:var(--dark);font-size:clamp(2.5rem,4vw,3.8rem);line-height:1.08}
.etag-brand-grid p{max-width:470px;margin:20px 0 27px;color:var(--muted);font-size:1.02rem}
.etag-brand-grid img{align-self:end;width:100%;max-height:540px;object-fit:cover;object-position:center 22%;border-radius:20px 20px 0 0}
.etag-hero-link{color:var(--blue);font-size:.86rem;font-weight:700;text-underline-offset:5px}
.etag-flow ol{display:grid;grid-template-columns:repeat(3,1fr);gap:0;margin:40px 0 0;padding:0;border-top:1px solid var(--line);border-bottom:1px solid var(--line);list-style:none}
.etag-flow li{display:grid;grid-template-columns:32px 1fr;gap:15px;min-height:165px;padding:28px 25px 25px 0}
.etag-flow li+li{padding-left:25px;border-left:1px solid var(--line)}
.etag-flow li b{display:grid;place-items:center;width:28px;height:28px;border-radius:8px;background:#dceef9;color:var(--blue);font-size:.8rem}
.etag-flow h3{margin:0 0 7px;color:var(--dark);font-size:1rem}
.etag-flow p{margin:0;color:var(--muted);font-size:.84rem}
.etag-entry{padding:80px 0;background:var(--dark);color:white}
.etag-entry-grid{display:grid;grid-template-columns:.9fr 1.1fr;align-items:center;gap:85px}
.etag-entry h2{max-width:470px;margin:0;font-size:clamp(2rem,3vw,3rem);line-height:1.12}
.etag-entry p{max-width:460px;color:#ccdae7}
.etag-entry a{color:var(--yellow);font-size:.86rem;font-weight:700;text-underline-offset:5px}
.etag-check-preview{max-width:500px;padding:24px;border:1px solid rgba(255,255,255,.2);border-radius:17px;background:white;color:var(--ink)}
.etag-check-preview>span{display:block;padding-bottom:15px;border-bottom:1px solid var(--line);font-size:.83rem;font-weight:700}
.etag-check-preview>div{display:grid;grid-template-columns:47px 1fr;gap:0 16px;padding:29px 0}
.etag-check-preview b{grid-row:1/3;display:grid;place-items:center;width:44px;height:44px;border-radius:50%;background:#dcefe5;color:#20744e;font-size:1.3rem}
.etag-check-preview strong{font-size:1.13rem}
.etag-check-preview small{color:var(--muted)}
.etag-check-preview>p{margin:0;padding-top:13px;border-top:1px solid var(--line);color:#20744e;font-size:.78rem;font-weight:700}

@media(max-width:1000px){.brand-hero-grid{gap:35px}.brand-hero-copy h1{font-size:clamp(2.45rem,5vw,3.7rem)}.organiser-job-grid{grid-template-columns:repeat(2,1fr)}.organiser-job-grid article:nth-child(3){border-left:0}.organiser-job-grid article:nth-child(n+3){border-top:1px solid var(--line)}}
@media(max-width:900px){:root{--shell:min(720px,calc(100% - 32px))}.site-header{top:8px;padding-inline:14px}.header-inner{height:64px}.mobile-nav{top:72px;right:14px;left:14px;border:1px solid var(--line);border-radius:15px;box-shadow:0 12px 35px rgba(12,49,87,.15)}.brand-hero-grid{grid-template-columns:1fr;gap:34px}.brand-hero{padding-top:125px}.brand-media{aspect-ratio:1.8;min-height:0}.brand-etag-grid{grid-template-columns:1fr;gap:35px;padding-top:60px}.brand-etag img{height:460px;max-width:630px;margin:auto}.organiser-route-grid,.brand-payment-grid,.etag-entry-grid{grid-template-columns:1fr;gap:40px}.etag-brand-grid{grid-template-columns:1fr;gap:0}.etag-brand-grid>div{padding-bottom:38px}.etag-brand-grid img{max-height:460px}.brand-how{grid-template-columns:1fr;gap:25px}.brand-how>a{grid-column:1}.brand-journeys{gap:16px}}
@media(max-width:600px){:root{--shell:calc(100% - 32px)}.site-header{padding-inline:9px}.header-inner{height:58px;padding-inline:12px;border-radius:16px}.mobile-nav{top:66px;left:9px;right:9px}.brand{width:100px}.brand-hero{padding:108px 0 54px}.brand-hero-copy h1{font-size:2.65rem}.brand-hero-copy>p{font-size:.98rem}.brand-hero-actions{align-items:flex-start;flex-direction:column;gap:17px}.brand-text-link{max-width:none}.brand-media{aspect-ratio:1.1;border-width:5px;border-radius:17px}.brand-paths{grid-template-columns:1fr;margin-top:-18px}.brand-paths a{min-height:85px;padding:17px 20px}.brand-paths a+a{border-left:0;border-top:1px solid var(--line)}.brand-section{padding-block:62px}.brand-section-head{align-items:start;flex-direction:column;gap:10px}.event-grid,.home-event-grid{grid-template-columns:1fr}.brand-empty{align-items:start;flex-direction:column;padding:24px}.brand-how{padding-block:60px}.brand-how ol{grid-template-columns:1fr}.brand-how li{display:flex;align-items:center;gap:15px;padding:12px 0;border-left:0;border-bottom:1px solid var(--line)}.brand-how li b{margin:0;flex:0 0 29px}.brand-etag-grid{padding-top:60px}.brand-etag img{height:340px}.brand-closing{align-items:start;flex-direction:column;gap:24px;padding-block:62px}.organiser-job-grid{grid-template-columns:1fr}.organiser-job-grid article,.organiser-job-grid article+article{min-height:0;padding:24px 0;border-left:0;border-top:1px solid var(--line)}.organiser-job-grid article:first-child{border-top:0}.organiser-route{padding-block:65px}.brand-page-intro{padding:122px 0 55px}.brand-page-intro h1{font-size:2.65rem}.brand-journeys{grid-template-columns:1fr;padding-block:55px}.brand-journeys article{padding:24px}.brand-payment{padding-block:60px}.payment-methods{grid-template-columns:1fr}.etag-brand-hero{padding-top:110px}.etag-brand-grid h1{font-size:2.65rem}.etag-brand-grid img{max-height:380px}.etag-flow ol{grid-template-columns:1fr}.etag-flow li,.etag-flow li+li{min-height:0;padding:20px 0;border-left:0;border-top:1px solid var(--line)}.etag-flow li:first-child{border:0}.etag-entry{padding-block:60px}}
@media(prefers-reduced-motion:reduce){.brand-media video{display:none}.event-cover img{transition:none}}