
:root{--ocean:#0B5ED7;--teal:#12B3B6;--powder:#BFE6FF;--navy:#0A2A43;--sand:#F3E6C8;--sun:#F7C948;--white:#fff;--bg:#F7FBFF;--text:var(--navy);--muted:rgba(10,42,67,.72);--shadow:0 12px 30px rgba(10,42,67,.12);--radius:18px;--container:1100px}
*{box-sizing:border-box}html{scroll-behavior:smooth}
body{margin:0;font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;background:radial-gradient(1200px 600px at 20% 0%, rgba(18,179,182,.14), transparent 55%),radial-gradient(900px 500px at 80% 10%, rgba(11,94,215,.14), transparent 60%),var(--bg);color:var(--text)}
img{max-width:100%;height:auto}a{color:inherit}.screen-reader-text{position:absolute;left:-9999px}
.skip-link:focus{left:12px;top:12px;background:#fff;padding:10px 12px;border-radius:10px;z-index:9999}

/* --- Sea-inspired loader (full-site) --- */
.mp-site-loader{position:fixed;inset:0;z-index:99999;display:grid;place-items:center;background:radial-gradient(900px 460px at 30% 20%, rgba(18,179,182,.18), transparent 60%),radial-gradient(900px 520px at 70% 10%, rgba(11,94,215,.22), transparent 62%),rgba(247,251,255,.96);backdrop-filter:blur(10px);transition:opacity .55s ease, transform .55s ease}
.mp-site-loader.is-hidden{opacity:0;transform:translateY(-6px)}
.mp-loader-inner{position:relative;width:min(340px,76vw);height:140px;border-radius:24px;overflow:hidden;border:1px solid rgba(10,42,67,.10);box-shadow:0 18px 40px rgba(10,42,67,.14);background:linear-gradient(180deg, rgba(191,230,255,.75), rgba(243,230,200,.35))}
.mp-loader-wave{position:absolute;left:-15%;right:-15%;height:70%;bottom:-12%;background:radial-gradient(circle at 20% 40%, rgba(255,255,255,.7), rgba(255,255,255,0) 55%),linear-gradient(135deg, rgba(11,94,215,.55), rgba(18,179,182,.55));opacity:.95;border-radius:44% 56% 52% 48%/52% 46% 54% 48%;animation:mpWave 1.7s ease-in-out infinite}
.mp-loader-wave--2{height:62%;bottom:-18%;opacity:.70;animation-duration:2.2s;filter:saturate(1.1)}
.mp-loader-bubble{position:absolute;bottom:14%;width:14px;height:14px;border-radius:999px;background:rgba(255,255,255,.85);border:1px solid rgba(10,42,67,.10);box-shadow:0 10px 20px rgba(10,42,67,.10);animation:mpBubble 1.3s ease-in-out infinite}
.mp-loader-bubble--1{left:18%;animation-duration:1.25s}
.mp-loader-bubble--2{left:52%;width:10px;height:10px;animation-duration:1.6s;opacity:.85}
.mp-loader-bubble--3{left:74%;width:18px;height:18px;animation-duration:1.85s;opacity:.8}
@keyframes mpWave{0%,100%{transform:translateX(0) translateY(0) rotate(0)}50%{transform:translateX(10%) translateY(-3%) rotate(2deg)}}
@keyframes mpBubble{0%,100%{transform:translateY(0);opacity:.85}50%{transform:translateY(-14px);opacity:1}}
.container{max-width:var(--container);margin:0 auto;padding:0 18px}
.section{padding:46px 0}.section-header{margin-bottom:18px}
.section-title{font-size:clamp(1.3rem,2.6vw,2rem);margin:0 0 8px}.section-subtitle{margin:0;color:var(--muted)}
.site-header{position:sticky;top:0;z-index:50;background:rgba(247,251,255,.84);backdrop-filter:blur(14px);border-bottom:1px solid rgba(10,42,67,.08)}
.header-inner{display:flex;align-items:center;justify-content:space-between;padding:14px 0}
.brand{display:flex;gap:12px;align-items:center}
.site-logo img{width:52px;height:52px;border-radius:16px;box-shadow:var(--shadow)}
.site-title{margin:0;font-weight:800;letter-spacing:.2px}.site-title a{text-decoration:none}
.site-description{margin:2px 0 0;color:var(--muted);font-size:.92rem}
.nav-toggle{display:none;background:linear-gradient(135deg, rgba(11,94,215,.14), rgba(18,179,182,.10));border:1px solid rgba(10,42,67,.10);border-radius:14px;padding:10px 12px;box-shadow:0 10px 20px rgba(10,42,67,.08)}
.nav-toggle-lines{display:block;width:22px;height:2px;background:var(--navy);position:relative;border-radius:99px}
.nav-toggle-lines:before,.nav-toggle-lines:after{content:"";position:absolute;left:0;width:22px;height:2px;background:var(--navy);border-radius:99px}
.nav-toggle-lines:before{top:-7px}.nav-toggle-lines:after{top:7px}
.site-nav{border-top:1px solid rgba(10,42,67,.06)}
.site-nav ul{list-style:none;margin:0;padding:0;display:flex;gap:10px;flex-wrap:wrap}
.site-nav a{display:inline-flex;align-items:center;text-decoration:none;padding:10px 12px;border-radius:14px;color:var(--navy);transition:transform .22s ease, background .22s ease, box-shadow .22s ease}
.site-nav a:hover{background:linear-gradient(135deg, rgba(11,94,215,.16), rgba(18,179,182,.12));box-shadow:0 12px 20px rgba(10,42,67,.10);transform:translateY(-1px)}
.hero{position:relative;padding:54px 0 18px;background:radial-gradient(800px 420px at 20% 0%, rgba(247,201,72,.22), transparent 62%),radial-gradient(900px 480px at 80% 0%, rgba(18,179,182,.18), transparent 62%),linear-gradient(180deg, rgba(11,94,215,.12), rgba(247,251,255,0));overflow:hidden}
.hero-inner{display:grid;grid-template-columns:1.1fr .9fr;gap:22px;align-items:center}
.hero-badge{display:inline-flex;align-items:center;background:rgba(255,255,255,.75);border:1px solid rgba(10,42,67,.10);padding:8px 12px;border-radius:999px;box-shadow:0 14px 30px rgba(10,42,67,.10);width:fit-content}
.hero-title{margin:14px 0 10px;font-size:clamp(2rem,4vw,3rem);line-height:1.06;letter-spacing:-.4px}
.hero-subtitle{margin:0 0 18px;color:var(--muted);font-size:1.05rem}
.hero-actions{display:flex;gap:12px;flex-wrap:wrap}

/* Homepage hero carousel (replaces the old hero headline text block) */
.mp-hero-carousel{margin:0 0 18px}
.mp-hero-carousel__viewport{position:relative;min-height:1020px;border-radius:var(--radius);overflow:hidden;border:1px solid rgba(10,42,67,.10);box-shadow:var(--shadow);background:rgba(255,255,255,.74)}
.mp-hero-carousel__slide{position:absolute;inset:0;display:grid;grid-template-rows:1fr auto;gap:10px;padding:16px;text-decoration:none;opacity:0;transform:translateY(6px);transition:opacity .45s ease, transform .45s ease}
.mp-hero-carousel__slide.is-active{opacity:1;transform:translateY(0);pointer-events:auto}
.mp-hero-carousel__image{border-radius:16px;background-size:cover;background-position:center;box-shadow:0 12px 28px rgba(10,42,67,.16)}
.mp-hero-carousel__image{height:660px}

/* Keep it tall but usable on smaller screens */
@media (max-width: 768px){
	.mp-hero-carousel__viewport{min-height:720px}
	.mp-hero-carousel__image{height:480px}
}
.mp-hero-carousel__image--empty{background:linear-gradient(135deg, rgba(11,94,215,.10), rgba(18,179,182,.10))}
.mp-hero-carousel__title{font-weight:900;letter-spacing:-.2px;font-size:1.05rem;line-height:1.2}
.mp-hero-carousel__slide:hover .mp-hero-carousel__title{text-decoration:underline}

/* Carousel navigation buttons */
.mp-hero-carousel__btn{position:absolute;top:50%;transform:translateY(-50%);width:44px;height:44px;border-radius:999px;border:1px solid rgba(10,42,67,.18);background:rgba(255,255,255,.38);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);box-shadow:0 10px 20px rgba(10,42,67,.14);display:inline-flex;align-items:center;justify-content:center;cursor:pointer;transition:transform .18s ease, background .18s ease, box-shadow .18s ease;z-index:3}
.mp-hero-carousel__btn span{font-size:1.6rem;line-height:1;color:var(--navy)}
.mp-hero-carousel__btn:hover{background:rgba(255,255,255,.58);box-shadow:0 14px 26px rgba(10,42,67,.18);transform:translateY(-50%) scale(1.04)}
.mp-hero-carousel__btn--prev{left:12px}
.mp-hero-carousel__btn--next{right:12px}
.btn{display:inline-flex;align-items:center;justify-content:center;padding:12px 14px;border-radius:16px;text-decoration:none;font-weight:700;border:1px solid rgba(10,42,67,.10);transition:transform .22s ease, box-shadow .22s ease}
.btn-primary{background:linear-gradient(135deg, var(--ocean), var(--teal));color:var(--white);box-shadow:0 18px 30px rgba(11,94,215,.22)}
.btn-primary:hover{transform:translateY(-2px);box-shadow:0 20px 36px rgba(11,94,215,.28)}
.btn-ghost{background:rgba(255,255,255,.70)}
.btn-ghost:hover{transform:translateY(-2px);box-shadow:0 16px 28px rgba(10,42,67,.12)}
.hero-cards{display:grid;gap:12px}.stat h3{margin:0 0 6px}.stat p{margin:0}
.card{background:rgba(255,255,255,.74);border:1px solid rgba(10,42,67,.10);border-radius:var(--radius);box-shadow:var(--shadow);padding:16px}
.card-title{margin:0 0 10px}.muted{color:var(--muted)}
.grid{display:grid;gap:14px}
.cards{grid-template-columns:repeat(3,minmax(0,1fr))}
.quick-links{grid-template-columns:repeat(4,minmax(0,1fr))}
.link-card{position:relative;overflow:hidden;transform:translateY(0);transition:transform .22s ease}
.link-card .icon{font-size:1.6rem}
.link-card:after{content:"";position:absolute;inset:-2px;background:radial-gradient(380px 120px at 30% 10%, rgba(247,201,72,.18), transparent 60%),radial-gradient(380px 120px at 80% 30%, rgba(18,179,182,.16), transparent 60%);opacity:.8;pointer-events:none}
.link-card:hover{transform:translateY(-2px)}
.link-card h3{margin:10px 0 6px}
.layout{display:grid;grid-template-columns:1fr;gap:18px}
.layout--full{grid-template-columns:1fr}
.main-column{min-width:0}.site-sidebar{min-width:0}
.site-sidebar{display:none}
.sidebar-inner{display:grid;gap:14px}
.sidebar-nav-card ul{display:grid;gap:8px}
.sidebar-nav-card a{padding:10px 12px;border-radius:14px;background:rgba(11,94,215,.08);text-decoration:none;display:block}
.sidebar-nav-card a:hover{background:rgba(18,179,182,.12)}
.mp-no-sidebar .layout{grid-template-columns:1fr}
.post-card{padding:0;overflow:hidden}
.post-card-link{text-decoration:none;display:block}
.post-card-thumb{aspect-ratio:16/9;overflow:hidden}
.cover{width:100%;height:100%;object-fit:cover;display:block}
.post-card-body{padding:14px 16px 16px}
.post-card-title{margin:6px 0 8px}
.post-card-meta{margin:0;color:rgba(10,42,67,.65);font-size:.9rem}
.post-card-cta{display:inline-flex;margin-top:10px;font-weight:800;color:var(--ocean)}
.article{padding:0;overflow:hidden}
.article-header{padding:18px 18px 10px}
.article-title{margin:0 0 8px;font-size:clamp(1.6rem,2.6vw,2.2rem)}
.meta{display:flex;gap:10px;align-items:center;color:rgba(10,42,67,.65);font-size:.92rem}
.article-thumb{margin:0}
.article-content{padding:0 18px 18px}
.article-footer{padding:0 18px 18px}
.content :where(h2,h3){margin-top:1.4em}.content :where(p,li){line-height:1.7}
.content a{color:var(--ocean);text-decoration:underline;text-decoration-thickness:2px}
.upcoming-events{padding:56px 0;background:linear-gradient(180deg, rgba(18,179,182,.10), rgba(247,251,255,0)),radial-gradient(800px 460px at 10% 0%, rgba(11,94,215,.10), transparent 60%);border-top:1px solid rgba(10,42,67,.08)}
.events-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
.event-card{padding:0;overflow:hidden}.event-body{padding:14px 16px 16px}
.event-date{margin:0;color:rgba(10,42,67,.65);font-weight:700;font-size:.92rem}
.event-title{margin:8px 0 8px}
.site-footer{position:relative;overflow:hidden;background:rgba(10,42,67,.95);color:#EAF5FF}
.footer-inner{padding:46px 0}
.footer-nav a{color:#EAF5FF;text-decoration:none;opacity:.95}
.footer-nav a:hover{opacity:1;text-decoration:underline}
.footer-nav ul{list-style:none;margin:18px 0 0;padding:0;display:flex;gap:12px;flex-wrap:wrap}
.site-credit{margin:18px 0 0;opacity:.85}
.hero-waves,.wave-footer{position:absolute;left:0;right:0;height:120px;bottom:-2px;pointer-events:none}
.wave-footer{top:-2px;bottom:auto;height:90px;opacity:.65}
.wave{position:absolute;left:-20%;width:140%;height:120px;bottom:0;background-repeat:repeat-x;background-size:800px 120px;filter:drop-shadow(0 20px 30px rgba(10,42,67,.16));animation:mpWave 16s linear infinite;opacity:.65}
.wave--1{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='800' height='120' viewBox='0 0 800 120'%3E%3Cpath fill='%230B5ED7' fill-opacity='.22' d='M0 60c120 0 120-40 240-40s120 40 240 40 120-40 240-40 120 40 240 40v60H0z'/%3E%3C/svg%3E")}
.wave--2{animation-duration:22s;bottom:8px;opacity:.55;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='800' height='120' viewBox='0 0 800 120'%3E%3Cpath fill='%2312B3B6' fill-opacity='.20' d='M0 68c140 0 100-44 240-44s110 44 240 44 110-44 240-44 110 44 240 44v60H0z'/%3E%3C/svg%3E")}
.wave--3{animation-duration:28s;bottom:14px;opacity:.35;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='800' height='120' viewBox='0 0 800 120'%3E%3Cpath fill='%23F7C948' fill-opacity='.14' d='M0 76c160 0 90-34 240-34s100 34 240 34 100-34 240-34 100 34 240 34v60H0z'/%3E%3C/svg%3E")}
@keyframes mpWave{0%{transform:translateX(0)}100%{transform:translateX(-30%)}}
.reveal{opacity:0;transform:translateY(10px);transition:opacity .6s ease, transform .6s ease}
.reveal.is-visible{opacity:1;transform:translateY(0)}
.pagination{margin-top:18px}
.page-numbers a,.page-numbers span{padding:10px 12px;border-radius:14px;background:rgba(255,255,255,.70);border:1px solid rgba(10,42,67,.10);text-decoration:none;display:inline-block;margin-right:8px}
.page-numbers .current{background:linear-gradient(135deg, rgba(11,94,215,.18), rgba(18,179,182,.12));font-weight:800}
@media (max-width:980px){
.hero-inner{grid-template-columns:1fr;gap:14px}
.cards{grid-template-columns:repeat(2,minmax(0,1fr))}
.quick-links{grid-template-columns:repeat(2,minmax(0,1fr))}
.events-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
.layout{grid-template-columns:1fr}
.nav-toggle{display:inline-flex}
.site-nav{display:none}
.site-nav.is-open{display:block}
.site-nav ul{flex-direction:column}
}
@media (max-width:560px){
.cards,.quick-links,.events-grid{grid-template-columns:1fr}
.card{border-radius:16px}
}


.post-card-thumb-placeholder{
	width:100%;
	height:100%;
	background:linear-gradient(135deg, rgba(11,94,215,.12), rgba(18,179,182,.18));
}


.link-card-icon{
	width:46px;
	height:46px;
	border-radius:18px;
	display:flex;
	align-items:center;
	justify-content:center;
	font-size:1.4rem;
	background:linear-gradient(135deg, rgba(11,94,215,.10), rgba(18,179,182,.18));
	margin-right:12px;
	flex-shrink:0;
}


.link-card-body{
	display:flex;
	flex-direction:column;
}


.link-card{
	display:flex;
	align-items:center;
	gap:10px;
}

/* Fixed-height event cards (consistent layout across pages) */
.event-card{height:360px;display:flex;flex-direction:column}
.event-card-link{text-decoration:none;display:flex;flex-direction:column;height:100%;color:inherit}
.event-thumb{aspect-ratio:16/9;overflow:hidden}
.event-body{display:flex;flex-direction:column;gap:8px;flex:1}
.event-title{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.event-body .muted{display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;margin:0;color:rgba(10,42,67,.75)}
@media(max-width:980px){.events-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.event-card{height:340px}}
@media(max-width:640px){.events-grid{grid-template-columns:1fr}.event-card{height:auto}}

/* Comments block on pages */
.comments-card{padding:16px}
.comments-card .comment-reply-title,.comments-card .comments-title{margin-top:0}




/* FORCE TALL (NEAR-SQUARE) HERO CAROUSEL */

/* Make the carousel's visible area roughly as tall as it is wide */
.mp-hero-carousel__viewport{
  aspect-ratio: 1 / 1;
  height: auto !important;
  min-height: 850px;
}

/* Ensure the background-image span actually respects height */
.mp-hero-carousel__image{
  display:block;
  width:100%;
  height:100% !important;
}

/* Keep slides filling the viewport */
.mp-hero-carousel__slide{
  height:100% !important;
}

/* Mobile: still tall, but slightly less than square */
@media (max-width: 768px){
  .mp-hero-carousel__viewport{
    aspect-ratio: 4 / 5;
    min-height: 600px;
  }
}



/* HERO CAROUSEL SIZE (YouTube-like 16:9) */
.mp-hero-carousel,
.mp-hero-carousel__viewport {
    width: 100%;
    aspect-ratio: 16 / 9;
    height: auto !important;
    min-height: 320px;
    max-height: 720px;
    overflow: hidden;
}

.mp-hero-carousel__slide {
    height: 100% !important;
}

.mp-hero-carousel__image {
    display: block;
    width: 100%;
    height: 100% !important;
    object-fit: cover;
}

/* Mobile: slightly taller than 16:9 so it doesn't feel too short */
@media (max-width: 768px) {
    .mp-hero-carousel,
    .mp-hero-carousel__viewport {
        aspect-ratio: 4 / 3;
        min-height: 280px;
        max-height: 520px;
    }
}

