
:root{
  --primary:#0089FF; --deep:#0450AE; --navy:#001F8E; --ink:#13183F; --sky:#61ABFF; --lav:#ABC4FF; --cyan:#00C7FF;
  --bg:#fff; --tint:#F1F6FF; --muted:#525A7A; --line:#DDE4F0;
  --sans:"Inter",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  --serif:"Playfair Display",Georgia,"Times New Roman",serif;
}
*{box-sizing:border-box}
[hidden]{display:none!important}
html{scroll-behavior:smooth;scroll-padding-top:84px}
body{margin:0;background:var(--bg);color:var(--ink);font-family:var(--sans);font-size:17px;line-height:1.6;-webkit-font-smoothing:antialiased}
img,svg{display:block;max-width:100%}
a{color:inherit}
.in{max-width:1180px;margin:0 auto;padding:0 24px}
.eyebrow{font-size:12px;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:var(--primary);margin:0}
h1,h2{font-family:var(--serif);font-weight:400;letter-spacing:-.015em;margin:0;text-wrap:balance}
h2{font-size:clamp(32px,4.4vw,48px);line-height:1.08;margin-top:12px}
p{margin:0}
.muted{color:var(--muted)}

/* buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:48px;padding:0 26px;border-radius:999px;font:500 15px/1 var(--sans);text-decoration:none;border:1.5px solid var(--primary);background:var(--primary);color:#fff;cursor:pointer;transition:background .2s,border-color .2s,color .2s,transform .2s}
.btn:hover{background:var(--deep);border-color:var(--deep);transform:translateY(-1px)}
.btn.ghost{background:transparent;border-color:rgba(255,255,255,.7);color:#fff}
.btn.ghost:hover{background:#fff;color:var(--ink);border-color:#fff}
.btn.line{background:transparent;color:var(--ink);border-color:var(--ink)}
.btn.line:hover{background:var(--ink);color:#fff}
.btn:focus-visible,a:focus-visible,button:focus-visible{outline:3px solid var(--sky);outline-offset:3px}

/* live strip */
.live{background:var(--ink);color:#fff;font-size:17px;overflow:hidden}
.mq{overflow:hidden;-webkit-mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent);mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent)}
.mq-track{display:flex;width:max-content;animation:mq 60s linear infinite}
.live:hover .mq-track,.live:focus-within .mq-track{animation-play-state:paused}
.mq-group{display:flex;flex:none}
.mq-item{display:inline-flex;align-items:center;gap:14px;min-height:56px;padding:0 36px;white-space:nowrap;border-right:1px solid rgba(171,196,255,.18)}
@keyframes mq{to{transform:translateX(-50%)}}
.live a{color:#fff;font-weight:600;text-decoration:underline;text-decoration-color:rgba(255,255,255,.4);text-underline-offset:4px;transition:color .2s,text-decoration-color .2s}
.live a:hover{color:var(--sky);text-decoration-color:var(--sky)}
.dot{width:9px;height:9px;border-radius:50%;background:var(--sky);flex:none}
.live.on{background:var(--primary)}
.live.on .mq-item{border-color:rgba(255,255,255,.25)}
.live.on .dot{background:#fff;animation:pulse 1.4s infinite}
.live.on a:hover{color:var(--ink);text-decoration-color:var(--ink)}
@keyframes pulse{50%{opacity:.25}}
.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 (prefers-reduced-motion:reduce){.live.on .dot{animation:none}.mq-track{animation:none}.mq{-webkit-mask-image:none;mask-image:none}.mq-group[aria-hidden]{display:none}.mq-group{width:100vw;justify-content:center}.mq-group .mq-item~.mq-item{display:none}}

/* header */
.hdr{position:sticky;top:0;z-index:10;background:rgba(255,255,255,.94);backdrop-filter:blur(10px);border-bottom:1px solid var(--line)}
.hdr .in{display:flex;align-items:center;justify-content:space-between;gap:20px;min-height:76px}
.logo{color:var(--primary);width:190px}
.nav{display:flex;align-items:center;gap:28px;font-size:15px}
.nav a:not(.btn){text-decoration:none;transition:color .2s}
.nav a:not(.btn):hover{color:var(--primary)}
.nav .btn{min-height:42px;padding:0 20px;font-size:14px}
.nav .btn{white-space:nowrap}
@media (max-width:820px){.nav a.hide-s{display:none}.logo{width:150px}.nav{gap:16px}}
@media (max-width:420px){.nav .btn{padding:0 14px}}
@media (max-width:640px){.live{font-size:15px}.mq-item{min-height:48px;padding:0 24px}}

/* hero */
.hero{position:relative;min-height:min(84vh,760px);display:flex;align-items:flex-end;color:#fff;background:var(--navy) url("hero-eddie.jpg") 55% 40%/cover no-repeat}
@media (min-width:1000px){.hero{background-size:128% auto;background-position:0% 42%}}
@media (max-width:999px){.hero{background-position:56% 40%}}
.hero::before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(10,14,40,.7) 0%,rgba(10,14,40,.35) 35%,rgba(10,14,40,0) 55%),linear-gradient(180deg,rgba(19,24,63,0) 50%,rgba(19,24,63,.6) 100%)}
@media (max-width:720px){.hero::before{background:linear-gradient(180deg,rgba(19,24,63,.1) 0%,rgba(19,24,63,.55) 45%,rgba(19,24,63,.9) 100%)}}
.hero .in{position:relative;width:100%;padding-top:120px;padding-bottom:80px}
.hero h1{font-size:clamp(44px,7vw,88px);line-height:1;max-width:14ch}
.hero .lede{font-size:clamp(18px,2vw,21px);line-height:1.5;max-width:32ch;margin-top:22px;color:#E6ECFF}
.hero .cta{display:flex;flex-wrap:wrap;gap:12px;margin-top:34px}

/* sections */
.sec{padding:104px 0}
.sec.tint{background:var(--tint)}
@media (max-width:640px){.sec{padding:72px 0}.hero .in{padding-bottom:56px}}
.head{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,420px);gap:16px 48px;align-items:end;margin-bottom:48px}
@media (max-width:860px){.head{grid-template-columns:minmax(0,1fr);margin-bottom:36px}}

/* sundays */
.times{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}
@media (max-width:720px){.times{grid-template-columns:minmax(0,1fr)}}
.time{border-top:2px solid var(--ink);padding-top:22px;display:grid;gap:8px;align-content:start}
.time .t{font-family:var(--serif);font-size:clamp(56px,7vw,80px);line-height:1;color:var(--primary)}
.time .t small{font-family:var(--sans);font-size:15px;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);margin-left:6px}
.time b{font-weight:600;font-size:18px}
.where{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:24px;align-items:center;margin-top:48px;padding:28px 32px;background:#fff;border:1px solid var(--line);border-radius:20px}
.where .btns{display:flex;flex-wrap:wrap;gap:10px}
@media (max-width:820px){.where{grid-template-columns:minmax(0,1fr);padding:24px}}
.kids{margin-top:20px;display:flex;gap:12px;align-items:flex-start;font-size:15px}
.kids svg{width:22px;height:22px;flex:none;color:var(--primary);margin-top:2px}

/* program */
.agenda{background:#E9F1FF}
.evs{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));grid-auto-rows:1fr;gap:14px}
@media (max-width:1080px){.evs{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (max-width:760px){.evs{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:420px){.evs{grid-template-columns:minmax(0,1fr)}}
.ev{background:#fff;border:1px solid #D6E3FA;border-radius:18px;padding:22px 22px 24px;display:grid;grid-template-rows:auto 1fr auto;gap:10px;color:var(--ink);text-decoration:none;min-height:168px;transition:background .25s,border-color .25s,transform .25s,box-shadow .25s,opacity .25s}
.ev-d{display:flex;align-items:baseline;gap:10px}
.ev-d b{font-family:var(--serif);font-weight:400;font-size:44px;line-height:1;color:var(--primary)}
.ev-d small{font-size:12px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}
.ev-t{font-size:17px;font-weight:600;line-height:1.3}
.ev-sub{font-size:13.5px;color:var(--muted);margin-top:-4px}
.ev-go{display:inline-flex;align-items:center;gap:8px;font-size:14px;font-weight:600;color:var(--primary)}
.ev-go svg{width:16px;height:16px;transition:transform .25s}
.ev.xmas .ev-d b{color:#AF9566}
.ev.xmas{border-color:#E6DCC8}
a.ev:hover{background:var(--primary);border-color:var(--primary);transform:translateY(-3px);box-shadow:0 16px 36px -20px rgba(0,137,255,.7)}
a.ev:hover .ev-d b,a.ev:hover .ev-t,a.ev:hover .ev-go,a.ev:hover .ev-d small,a.ev:hover .ev-sub{color:#fff}
a.ev:hover .ev-go svg{transform:translateX(4px)}
a.ev:focus-visible{outline:3px solid var(--sky);outline-offset:3px}
.ev-d b,.time .t,.card .n{font-variant-numeric:lining-nums}
.ev.past{opacity:.45}
.ev.past .ev-go{display:none}

/* watch */
.watch{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:56px;align-items:center}
@media (max-width:860px){.watch{grid-template-columns:minmax(0,1fr);gap:32px}}
.screen{aspect-ratio:16/9;border-radius:20px;background:var(--ink);color:#fff;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:16px;text-decoration:none;position:relative;overflow:hidden;transition:transform .25s}
.screen:hover{transform:translateY(-3px)}
.screen .play{width:76px;height:76px;border-radius:50%;background:var(--primary);display:grid;place-items:center;transition:background .2s}
.screen:hover .play{background:var(--deep)}
.screen .play svg{width:28px;height:28px;margin-left:4px}
.screen .lbl{position:relative;font-size:14px;letter-spacing:.12em;text-transform:uppercase;color:#fff}
.screen .play{position:relative;z-index:1;box-shadow:0 12px 30px -10px rgba(0,0,0,.5)}
.mosaic{position:absolute;inset:-2px;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));grid-auto-rows:1fr;gap:2px;background:var(--ink)}
.mosaic img{width:100%;height:100%;object-fit:cover;filter:grayscale(1) contrast(1.05);mix-blend-mode:luminosity;opacity:.42;transition:opacity .4s}
.screen::after{content:"";position:absolute;inset:0;background:radial-gradient(ellipse at center,rgba(19,24,63,.55) 0%,rgba(19,24,63,.25) 55%,rgba(19,24,63,.6) 100%);mix-blend-mode:multiply;pointer-events:none}
.screen .play,.screen .lbl{z-index:2}
.screen:hover .mosaic img{opacity:.6}
.links{display:flex;flex-wrap:wrap;gap:10px;margin-top:28px}

/* steps */
.cards{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:20px}
@media (max-width:1080px){.cards{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:640px){.cards{grid-template-columns:minmax(0,1fr)}}
.card{background:#fff;border:1px solid var(--line);border-radius:20px;padding:30px;display:grid;gap:12px;align-content:start;transition:border-color .25s,transform .25s,box-shadow .25s,background .25s}
.card:hover{border-color:var(--lav);transform:translateY(-2px)}
.card .n{font-family:var(--serif);font-size:40px;line-height:1;color:var(--primary)}
.card h3{font-size:19px;font-weight:600;margin:4px 0 0}
.card p{font-size:15.5px}
a.card{text-decoration:none;color:var(--ink);grid-template-rows:auto auto 1fr auto}
a.card .go{display:inline-flex;align-items:center;gap:8px;font-size:15px;font-weight:600;color:var(--primary);margin-top:8px;transition:color .25s}
a.card .go svg{width:18px;height:18px;transition:transform .25s}
a.card:hover{background:var(--primary);border-color:var(--primary);box-shadow:0 18px 40px -20px rgba(0,137,255,.7);transform:translateY(-4px)}
a.card:hover .n,a.card:hover h3,a.card:hover .go{color:#fff}
a.card:hover .muted{color:#E3EEFF}
a.card:hover .go svg{transform:translateX(4px)}
a.card:focus-visible{outline:3px solid var(--sky);outline-offset:3px}
@media (prefers-reduced-motion:reduce){a.card,a.card:hover,a.card .go svg{transition:none;transform:none}}
.card a{font-size:15px;font-weight:500;color:var(--primary);text-underline-offset:4px;margin-top:4px}

/* give */
.give{background:var(--navy);color:#fff}
.give .eyebrow{color:var(--cyan)}
.give .muted{color:#C9D5FF}
.give-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:56px;align-items:start}
@media (max-width:860px){.give-grid{grid-template-columns:minmax(0,1fr);gap:32px}}
.pay{display:grid;gap:14px}
.method{background:rgba(255,255,255,.07);border:1px solid rgba(171,196,255,.3);border-radius:16px;padding:22px 24px;display:grid;gap:6px}
.method .k{font-size:12px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--lav)}
.iban{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:10px 16px}
.iban code{font-family:var(--sans);font-size:clamp(17px,2.2vw,21px);font-weight:500;letter-spacing:.04em;overflow-wrap:anywhere}
.copy{font:500 13px/1 var(--sans);color:#fff;background:transparent;border:1px solid rgba(255,255,255,.55);border-radius:999px;padding:10px 16px;min-height:40px;cursor:pointer;transition:background .2s,color .2s}
.copy:hover{background:#fff;color:var(--ink)}

/* contact */
.contact{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}
@media (max-width:860px){.contact{grid-template-columns:minmax(0,1fr)}}
.contact .card{gap:6px}
.contact .card h3{margin:0 0 6px;font-size:13px;letter-spacing:.14em;text-transform:uppercase;color:var(--primary)}
.contact .card a{color:var(--ink);font-weight:400;margin:0}
.contact .card a:hover{color:var(--primary)}
.contact .card:hover{background:#E6F0FF;border-color:var(--lav);transform:translateY(-2px)}

/* footer (same as the Event Design request page) */
.foot{background:var(--ink);color:#fff;padding-block:64px 28px}
.foot-grid{display:grid;grid-template-columns:minmax(0,1.3fr) repeat(3,minmax(0,1fr));gap:32px}
@media (max-width:860px){.foot-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:520px){.foot-grid{grid-template-columns:minmax(0,1fr)}}
.foot .logo{color:#fff;width:200px;display:block}
.foot .logo svg{display:block;width:100%;height:auto}
.foot h4{font-size:11.5px;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:var(--lav);margin:0 0 14px}
.foot p{margin:0;overflow-wrap:anywhere;font-size:14px;color:#D4DCF2;line-height:1.65}
.foot a{color:#fff;text-decoration:none;transition:color .2s}
.foot a:hover{color:var(--sky)}
.foot .tag{margin-top:18px;max-width:34ch}
.foot .li{display:flex;gap:10px;align-items:flex-start;margin-bottom:10px}
.foot .li p b{color:#fff;font-weight:600}
.ico.sm{flex:none;width:22px;height:22px;display:inline-grid;place-items:center;color:var(--sky)}
.ico.sm svg{width:18px;height:18px}
.foot-btn{display:inline-flex;align-items:center;min-height:40px;margin-top:14px;padding:0 18px;border:1px solid rgba(171,196,255,.45);border-radius:999px;font-size:13.5px;font-weight:500;color:#fff;transition:background .2s,border-color .2s}
.foot a.foot-btn:hover{background:var(--primary);border-color:var(--primary);color:#fff}
.foot-bottom{margin-top:48px;padding-top:20px;border-top:1px solid rgba(171,196,255,.2);display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:12px;font-size:12.5px;color:#9FAAD0}
.foot a.credit{color:#7F8BB5;font-size:11.5px}
.foot a.credit:hover{color:#C9D3EE}
.social{display:flex;gap:10px;margin-top:18px}
.social a{width:40px;height:40px;border-radius:50%;border:1px solid rgba(171,196,255,.35);display:grid;place-items:center;transition:background .2s,border-color .2s,transform .2s}
.social a:hover{background:var(--primary);border-color:var(--primary);transform:translateY(-2px);color:#fff}
.social svg{width:18px;height:18px}
