/*
RCCG Christ Church Edmonton
Shared Site Stylesheet

This file is the visual source of truth for the direct-build website.
Reuse existing tokens/components across pages before introducing new ones.
*/

:root{
  /* Colorful Daybreak — parent-site palette */
  --navy:#3D348B;
  --navy-deep:#30286F;
  --violet:#7678ED;
  --white:#FFFFFF;
  --gold:#F7B801;
  --gold-light:#FFD94A;
  --daybreak-orange:#F18701;
  --daybreak-coral:#F35B04;
  --black:#1A1A1B;
  --slate:#636E72;
  --cyan:#00CEC9;
  /* Ministry-specific Genesis colors remain intact */
  --red:#E72F24;
  --orange:#F39221;
  --blue:#21A9E1;
  --paper:#F7F6FF;
  --serif:'Playfair Display', Georgia, serif;
  --sans:'DM Sans', Arial, sans-serif;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--white);color:var(--black);font-family:var(--sans);overflow-x:hidden}
a{text-decoration:none;color:inherit}
img{display:block;width:100%;height:100%;object-fit:cover}
button{font:inherit}
::selection{background:var(--gold);color:var(--black)}
.wrap{width:min(1440px,calc(100% - 56px));margin:auto}
.serif{font-family:var(--serif)}
.kicker{font-size:.72rem;font-weight:700;letter-spacing:.2em;text-transform:uppercase}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.9rem;padding:1rem 1.3rem;border:1px solid currentColor;font-weight:700;text-transform:uppercase;letter-spacing:.09em;font-size:.72rem;transition:.35s ease}
.btn::after{content:'↗';font-size:1rem;transition:.35s ease}
.btn:hover::after{transform:translate(4px,-4px)}
.btn-gold{background:var(--gold);border-color:var(--gold);color:#111}
.btn-light{color:white;background:transparent;border-color:rgba(255,255,255,.45)}
.btn-navy{background:var(--navy);border-color:var(--navy);color:#fff}

/* NAV */
.nav-shell{position:fixed;z-index:100;top:0;left:0;right:0;color:#fff;mix-blend-mode:normal}
.nav-shell::after{content:'';position:absolute;inset:0;background:linear-gradient(to bottom,rgba(35,29,82,.78),transparent);z-index:-1;pointer-events:none}
.nav-inner{height:92px;display:flex;align-items:center;justify-content:space-between;gap:30px;border-bottom:1px solid rgba(255,255,255,.16)}
.logo{display:flex;align-items:center;gap:12px;font-weight:700;letter-spacing:.06em}
.logo-mark{width:42px;height:42px;border:1px solid var(--gold);display:grid;place-items:center;font-family:var(--serif);font-weight:700;color:var(--gold);position:relative}
.logo-mark::after{content:'';position:absolute;width:14px;height:1px;background:var(--gold)}
.logo small{display:block;font-size:.56rem;letter-spacing:.18em;font-weight:600;opacity:.7;margin-top:2px}
.nav-links{display:flex;align-items:center;gap:2rem;font-size:.74rem;font-weight:700;text-transform:uppercase;letter-spacing:.08em}
.nav-links a{position:relative}
.nav-links a:not(.nav-cta)::after{content:'';position:absolute;left:0;right:100%;bottom:-7px;height:1px;background:var(--gold);transition:.3s ease}
.nav-links a:hover::after{right:0}
.nav-cta{padding:.75rem 1rem;border:1px solid var(--gold);color:var(--gold)}
.menu-btn{display:none;background:none;border:0;color:white;font-size:1.4rem}

/* HERO */
.hero{min-height:100svh;background:var(--navy);color:white;position:relative;overflow:hidden;isolation:isolate}
.hero-media{position:absolute;inset:-4%;z-index:-4;overflow:hidden;background:var(--navy-deep);transform:scale(1.02)}
.hero-video{width:100%;height:100%;object-fit:cover;object-position:center 44%;display:block;filter:saturate(1) brightness(1.05) contrast(1.02)}
.hero-video-toggle{position:absolute;right:34px;bottom:78px;z-index:8;width:52px;height:52px;border-radius:50%;border:1px solid rgba(255,255,255,.55);background:rgba(8,8,35,.38);backdrop-filter:blur(8px);color:#fff;display:grid;place-items:center;cursor:pointer;font-size:1rem;transition:.3s ease}
.hero-video-toggle:hover{background:var(--gold);border-color:var(--gold);color:#111;transform:scale(1.05)}
.hero::before{content:'';position:absolute;inset:0;z-index:-3;background:linear-gradient(90deg,rgba(61,52,139,.62) 0%,rgba(61,52,139,.42) 42%,rgba(61,52,139,.18) 70%,rgba(61,52,139,.08) 100%)}
.hero::after{content:'';position:absolute;inset:0;z-index:-2;background:linear-gradient(to top,rgba(48,40,111,.34),transparent 46%)}

.hero-content{min-height:100svh;padding-top:112px;padding-bottom:48px;display:flex;align-items:flex-end;justify-content:center}
.hero-main{width:100%;max-width:1120px}
.hero-title{margin:0;font-size:clamp(1.05rem,2.2vw,2.8rem);line-height:.9;letter-spacing:-.05em;font-weight:700;text-transform:uppercase}
.hero-title .line{display:block}
.hero-title .glory{font-family:inherit;font-style:normal;text-transform:uppercase;color:var(--gold-light);font-weight:700;letter-spacing:inherit;margin-left:.28em}
.hero-title .person{font-family:inherit;font-style:normal;text-transform:uppercase;color:#fff;-webkit-text-stroke:0;margin-left:.24em;font-weight:700;letter-spacing:inherit}
.scroll-note{position:absolute;right:20px;top:50%;transform:rotate(90deg) translateX(50%);transform-origin:right top;font-size:.64rem;letter-spacing:.18em;text-transform:uppercase;color:rgba(255,255,255,.6)}
.hero-split{display:grid;grid-template-columns:auto clamp(84px,8vw,118px) auto;gap:clamp(12px,1.6vw,22px);align-items:center;justify-content:center;width:100%}
.hero-copy{max-width:480px}
.hero-copy.left{text-align:right;justify-self:end}
.hero-copy.left{text-align:right;justify-self:end;max-width:none}
.hero-copy.left .hero-title .line:first-child{white-space:nowrap}
.hero-copy.right{text-align:left;justify-self:start;max-width:none}
.hero-divider{
  position:relative;
  width:clamp(84px,8vw,118px);
  height:clamp(84px,8vw,118px);
  justify-self:center;
  align-self:center;
}
.hero-divider::before,
.hero-divider::after{
  content:'';
  position:absolute;
  inset:0;
  background:url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A//www.w3.org/2000/svg%27%20viewBox%3D%270%200%20120%20180%27%3E%0A%3Cdefs%3E%0A%20%20%3ClinearGradient%20id%3D%27g%27%20x1%3D%270%27%20y1%3D%270%27%20x2%3D%271%27%20y2%3D%271%27%3E%0A%20%20%20%20%3Cstop%20offset%3D%270%27%20stop-color%3D%27%23FFD94A%27/%3E%0A%20%20%20%20%3Cstop%20offset%3D%270.55%27%20stop-color%3D%27%23F7B801%27/%3E%0A%20%20%20%20%3Cstop%20offset%3D%271%27%20stop-color%3D%27%23F18701%27/%3E%0A%20%20%3C/linearGradient%3E%0A%3C/defs%3E%0A%3Cpath%20d%3D%27M58%208c11%2017%2015%2035%2018%2055%204%2024%209%2047%2021%2068%204%207%208%2015%208%2024-12-5-20-16-28-28-12-17-19-36-24-56C48%2053%2040%2036%2028%2020c10%200%2021-1%2030-12Z%27%20fill%3D%27url%28%23g%29%27/%3E%0A%3C/svg%3E") center/contain no-repeat;
  transform-origin:center;
}
.hero-divider::before{
  transform:rotate(0deg) scaleY(-1) scale(1.02);
}
.hero-divider::after{
  transform:translateY(-12px) rotate(90deg) scale(.98);
  opacity:.96;
}

.hero-copy.right .hero-title .line:first-child{white-space:nowrap}

/* MARQUEE */
.marquee{overflow:hidden;background:linear-gradient(90deg,var(--gold) 0%,var(--daybreak-orange) 62%,var(--daybreak-coral) 100%);color:#111;border-top:1px solid rgba(0,0,0,.08);border-bottom:1px solid rgba(0,0,0,.08)}
.marquee-track{display:flex;width:max-content;animation:marquee 26s linear infinite;padding:18px 0}
.marquee-track span{font-size:1rem;text-transform:uppercase;letter-spacing:.15em;font-weight:700;white-space:nowrap}
.marquee-track span::after{content:'✦';padding:0 34px;color:var(--navy)}
@keyframes marquee{to{transform:translateX(-50%)}}

/* SUNDAY / INFO */
.sunday{background:var(--paper);padding:0}
.sunday-grid{display:grid;grid-template-columns:1.1fr .8fr .8fr 1fr;border-left:1px solid rgba(61,52,139,.14)}
.sunday-card{padding:46px 34px;min-height:220px;border-right:1px solid rgba(61,52,139,.14);display:flex;flex-direction:column;justify-content:space-between;transition:.35s ease}
.sunday-card:hover{background:#fff;box-shadow:inset 0 4px 0 var(--violet)}
.sunday-card:first-child{background:var(--navy);color:white}
.sunday-card .label{font-size:.68rem;text-transform:uppercase;letter-spacing:.18em;font-weight:700;color:var(--gold)}
.sunday-card .big{font-family:var(--serif);font-size:clamp(2rem,3vw,3.7rem);line-height:.98;letter-spacing:-.035em}
.sunday-card .small{font-size:.8rem;line-height:1.5;color:var(--slate)}
.sunday-card:first-child .small{color:rgba(255,255,255,.65)}

/* THIS IS CHURCH — white-noise scrollytelling */
.story{
  position:relative;
  overflow:clip;
  background:#f7f6f1;
  color:#17171c;
  padding:116px 0 138px;
  isolation:isolate;
}
.story::before{
  content:'';
  position:absolute;
  inset:0;
  z-index:-2;
  background:
    radial-gradient(circle at 14% 8%,rgba(247,184,1,.13),transparent 28%),
    radial-gradient(circle at 86% 44%,rgba(118,120,237,.12),transparent 34%),
    #f7f6f1;
}
.story::after{
  content:'';
  position:absolute;
  inset:0;
  z-index:-1;
  pointer-events:none;
  opacity:.11;
  background-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A//www.w3.org/2000/svg%27%20width%3D%27180%27%20height%3D%27180%27%20viewBox%3D%270%200%20180%20180%27%3E%0A%3Cfilter%20id%3D%27n%27%3E%0A%20%20%3CfeTurbulence%20type%3D%27fractalNoise%27%20baseFrequency%3D%27.8%27%20numOctaves%3D%274%27%20stitchTiles%3D%27stitch%27/%3E%0A%3C/filter%3E%0A%3Crect%20width%3D%27100%25%27%20height%3D%27100%25%27%20filter%3D%27url%28%23n%29%27%20opacity%3D%27.38%27/%3E%0A%3C/svg%3E");
  mix-blend-mode:multiply;
}
.story-ghost{
  position:absolute;
  left:0;
  right:0;
  top:8%;
  z-index:0;
  pointer-events:none;
  overflow:hidden;
  white-space:nowrap;
  font-size:clamp(9rem,22vw,25rem);
  line-height:.7;
  font-weight:800;
  letter-spacing:-.085em;
  text-transform:uppercase;
  color:rgba(61,52,139,.045);
}
.story-ghost span{
  display:inline-block;
  transform:translate3d(var(--story-ghost-x,0px),0,0);
  will-change:transform;
}
.story-intro{
  position:relative;
  z-index:3;
  display:grid;
  grid-template-columns: 1.2fr 1.08fr;
  gap:clamp(44px,7vw,110px);
  align-items:end;
  margin-bottom:105px;
}
.story-intro h2{
  margin:0;
  white-space:nowrap;
  font-size:clamp(3.8rem,4.8vw,7.6rem);
  line-height:.80;
  letter-spacing:-.065em;
  text-transform:uppercase;
  color:var(--navy);
}
.story-intro h2 span{
  display:inline;
  margin:0;
  font-family:var(--serif);
  font-style:italic;
  font-weight:600;
  text-transform:none;
  letter-spacing:-.045em;
  color:var(--gold);
  font-size:1em;
}
.story-intro-copy{
  max-width:610px;
  justify-self:end;
  padding-bottom:12px;
}
.story-intro-copy .kicker{
  color:var(--navy);
  margin-bottom:18px;
}
.story-intro-copy p{
  margin:0;
  font-size:clamp(1.08rem,1.48vw,1.32rem);
  line-height:1.72;
  color:#5d5c63;
}
.story-scrolly{
  position:relative;
  z-index:3;
  display:grid;
  grid-template-columns:minmax(0,.95fr) minmax(380px,.78fr);
  gap:clamp(48px,7vw,104px);
  align-items:start;
}
.story-stage{
  position:sticky;
  top:clamp(92px,10vh,122px);
  height:min(76vh,760px);
  min-height:560px;
  overflow:hidden;
  border-radius:28px;
  background:#e9e6df;
  box-shadow:0 30px 80px rgba(48,40,111,.12);
  isolation:isolate;
}
.story-stage::before{
  content:'';
  position:absolute;
  inset:0;
  z-index:6;
  pointer-events:none;
  background:
    linear-gradient(to top,rgba(15,12,34,.48),transparent 44%),
    linear-gradient(135deg,rgba(61,52,139,.16),transparent 48%);
}
.story-frame{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  margin:0;
  opacity:0;
  overflow:hidden;
  transform:scale(1.09) translate3d(0,30px,0);
  transition:
    opacity .78s cubic-bezier(.2,.8,.2,1),
    transform 1.1s cubic-bezier(.2,.8,.2,1);
  will-change:opacity,transform;
}
.story-frame.active{
  opacity:1;
  transform:scale(1) translate3d(0,0,0);
}
.story-frame.is-leaving{
  opacity:0;
  transform:scale(1.035) translate3d(-24px,-12px,0);
}
.story-frame img{
  position:absolute;
  inset:-4%;
  width:108%;
  height:108%;
  max-width:none;
  object-fit:cover;
  object-position:center;
  transform:translate3d(0,var(--story-image-y,0px),0) scale(1.035);
  transition:filter .7s ease;
  filter:saturate(.88) contrast(1.04);
  will-change:transform;
}
.story-frame.active img{filter:saturate(1.02) contrast(1.03)}
.story-frame-base{background:#d9d5cc}
.story-stage .story-frame:first-of-type{z-index:1}
.story-stage .story-frame:nth-of-type(2){z-index:2}
.story-stage .story-frame:nth-of-type(3){z-index:3}

.story-stage-meta{
  position:absolute;
  left:26px;
  right:26px;
  bottom:24px;
  z-index:8;
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:20px;
  color:#fff;
}
.story-stage-meta strong{
  max-width:480px;
  font-size:clamp(1.5rem,2.55vw,2.9rem);
  line-height:.95;
  letter-spacing:-.045em;
  text-transform:uppercase;
}
.story-stage-meta span{
  display:inline-flex;
  align-items:center;
  gap:8px;
  font-size:.65rem;
  font-weight:800;
  letter-spacing:.14em;
  text-transform:uppercase;
  opacity:.76;
}
.story-stage-meta span::before{
  content:'';
  width:8px;
  height:8px;
  border-radius:50%;
  background:var(--gold);
}
.story-progress{
  position:absolute;
  left:22px;
  top:22px;
  bottom:22px;
  z-index:9;
  width:2px;
  background:rgba(255,255,255,.22);
  overflow:hidden;
}
.story-progress::after{
  content:'';
  display:block;
  width:100%;
  height:calc(var(--story-progress,0) * 100%);
  background:linear-gradient(to bottom,var(--gold),var(--daybreak-orange));
  transition:height .12s linear;
}
.story-orbit{
  position:absolute;
  right:-74px;
  top:-74px;
  z-index:7;
  width:190px;
  height:190px;
  border-radius:50%;
  border:1px solid rgba(255,255,255,.26);
  transform:rotate(var(--story-orbit-rotate,0deg));
  will-change:transform;
}
.story-orbit::before,
.story-orbit::after{
  content:'';
  position:absolute;
  border-radius:50%;
}
.story-orbit::before{
  width:16px;
  height:16px;
  left:14px;
  top:50%;
  background:var(--gold);
}
.story-orbit::after{
  inset:28px;
  border:1px solid rgba(255,255,255,.18);
}
.story-steps{
  position:relative;
}
.story-step{
  min-height:82vh;
  display:flex;
  align-items:center;
  position:relative;
  opacity:.28;
  transform:translate3d(0,44px,0);
  transition:opacity .55s ease,transform .75s cubic-bezier(.2,.8,.2,1);
}
.story-step.active{
  opacity:1;
  transform:none;
}
.story-step-inner{
  width:100%;
  padding:44px 0;
  border-top:1px solid rgba(61,52,139,.16);
}
.story-step:first-child .story-step-inner{border-top:0}
.story-number{
  display:flex;
  align-items:center;
  gap:16px;
  margin-bottom:28px;
  font-size:.68rem;
  font-weight:800;
  letter-spacing:.18em;
  text-transform:uppercase;
  color:var(--navy);
}
.story-number::after{
  content:'';
  width:44px;
  height:2px;
  background:var(--gold);
  transform:scaleX(.35);
  transform-origin:left;
  transition:transform .6s cubic-bezier(.2,.8,.2,1);
}
.story-step.active .story-number::after{transform:scaleX(1)}
.story-step h3{
  margin:0 0 24px;
  font-size:clamp(3.3rem,5.6vw,6.6rem);
  line-height:.83;
  letter-spacing:-.065em;
  text-transform:uppercase;
  color:#24232b;
}
.story-step h3 .accent{
  color:var(--daybreak-orange);
}
.story-step p{
  max-width:560px;
  margin:0;
  color:#65636a;
  font-size:1.02rem;
  line-height:1.72;
}
.story-step-pulse{
  position:absolute;
  right:-14px;
  top:50%;
  width:12px;
  height:12px;
  border-radius:50%;
  background:var(--gold);
  opacity:0;
  transform:translateY(-50%) scale(.3);
  box-shadow:0 0 0 0 rgba(247,184,1,.24);
  transition:opacity .35s ease,transform .35s ease;
}
.story-step.active .story-step-pulse{
  opacity:1;
  transform:translateY(-50%) scale(1);
  animation:storyPulse 2.4s ease-out infinite;
}
@keyframes storyPulse{
  0%{box-shadow:0 0 0 0 rgba(247,184,1,.25)}
  70%{box-shadow:0 0 0 22px rgba(247,184,1,0)}
  100%{box-shadow:0 0 0 0 rgba(247,184,1,0)}
}
.story-mobile-media{display:none}
.story-closing{
  position:relative;
  z-index:3;
  display:grid;
  grid-template-columns:1.2fr .8fr;
  gap:54px;
  align-items:end;
  margin-top:42px;
  padding-top:76px;
  border-top:1px solid rgba(61,52,139,.16);
}
.story-closing strong{
  display:block;
  max-width:900px;
  font-size:clamp(2.8rem,5.1vw,5.9rem);
  line-height:.9;
  letter-spacing:-.055em;
  text-transform:uppercase;
  color:var(--navy);
}
.story-closing strong span{color:var(--daybreak-orange)}
.story-closing p{
  max-width:470px;
  justify-self:end;
  margin:0;
  color:#68666d;
  line-height:1.72;
}


/* EXPRESSIONS — restored modular mosaic on Christ Church purple stage */
.ministry-section{
  background:
    radial-gradient(circle at 12% 18%,rgba(118,120,237,.34),transparent 28%),
    radial-gradient(circle at 88% 74%,rgba(247,184,1,.12),transparent 22%),
    linear-gradient(135deg,#261f68 0%,var(--navy) 48%,#473db0 100%);
  color:#fff;
  padding:95px 0 120px;
  overflow:hidden;
}
.expression-heading{display:grid;grid-template-columns:minmax(170px,.85fr) auto minmax(290px,1.25fr);align-items:center;margin-bottom:108px}
.expression-heading-side{height:52px;background:#252526;color:#fff;display:flex;align-items:center;font-size:1.0rem;font-weight:800;letter-spacing:.04em;text-transform:uppercase;white-space:nowrap}
.expression-heading-side.left{justify-content:flex-end;padding-right:28px}
.expression-heading-side.right{justify-content:flex-start;padding-left:28px}
.expression-heading-title{font-size:clamp(5.2rem,9.1vw,10.4rem);font-weight:800;line-height:.7;letter-spacing:-.075em;text-transform:uppercase;color:#fff;padding:0 30px;white-space:nowrap}
.expression-mosaic-shell{width:100%;overflow:hidden;padding:0 0 12px}
.expression-mosaic{display:flex;width:max-content;will-change:transform;animation:expressionDrift 48s linear infinite}
.expression-group{display:flex;gap:12px;flex:0 0 auto;padding-right:12px}
@keyframes expressionDrift{from{transform:translate3d(0,0,0)}to{transform:translate3d(-50%,0,0)}}
.expression-cluster{display:grid;grid-template-columns:340px 340px;grid-template-rows:200px 200px;gap:10px;flex:0 0 auto}
.expression-cluster .expression-tile.photo{grid-row:1 / 3}
.expression-cluster.photo-right .expression-tile.photo{grid-column:2}
.expression-cluster.photo-left .expression-tile.photo{grid-column:1}
.expression-cluster.photo-right .expression-tile.name,.expression-cluster.photo-right .expression-tile.copy{grid-column:1}
.expression-cluster.photo-left .expression-tile.name,.expression-cluster.photo-left .expression-tile.copy{grid-column:2}
.expression-cluster .expression-tile.name{grid-row:1}
.expression-cluster .expression-tile.copy{grid-row:2}
.expression-tile{position:relative;border-radius:20px;overflow:hidden;background:#e7edfb;color:#26262a;isolation:isolate;transition:transform .45s cubic-bezier(.2,.8,.2,1),box-shadow .45s ease,color .4s ease,background .45s ease}
.expression-tile:hover{transform:translateY(-4px);box-shadow:0 18px 45px rgba(24,23,45,.12)}
.expression-tile.name:hover{transform:none;box-shadow:none}
.expression-tile.copy{padding:25px 24px;display:flex;flex-direction:column;justify-content:flex-start}
.expression-tile.copy .tile-label{font-size:.72rem;font-weight:800;letter-spacing:.035em;text-transform:uppercase;margin-bottom:13px}
.expression-tile.copy p{font-size:.92rem;line-height:1.48;margin:0;max-width:295px;color:#555762;transition:color .35s ease}
.expression-tile.copy .hover-arrow{
  position:absolute;
  right:18px;
  bottom:18px;
  z-index:4;
  width:54px;
  height:54px;
  border-radius:50%;
  display:grid;
  place-items:center;
  color:#fff;
  font-size:1.45rem;
  line-height:1;
  border:1px solid rgba(255,255,255,.58);
  background:rgba(255,255,255,.12);
  backdrop-filter:blur(8px);
  -webkit-backdrop-filter:blur(8px);
  box-shadow:0 10px 30px rgba(0,0,0,.16);
  opacity:0;
  transform:translate(14px,14px) rotate(-14deg) scale(.72);
  transition:opacity .28s ease,transform .45s cubic-bezier(.2,.8,.2,1),background .3s ease;
  pointer-events:none;
}
.expression-tile.copy:hover .hover-arrow{
  opacity:1;
  transform:translate(0,0) rotate(0) scale(1);
}
.expression-tile.name{display:grid;place-items:center;padding:22px;text-align:center}
.expression-tile.name strong{font-size:clamp(2rem,3vw,3.15rem);font-weight:500;letter-spacing:-.045em;line-height:.92;text-transform:uppercase}
.expression-tile.name.lighthouse strong{font-family:var(--serif);text-transform:none;font-weight:700;color:#fff}
.expression-tile.name.dc strong{font-weight:800;font-size:clamp(1.75rem,2.55vw,2.85rem);color:#fff}
.expression-tile.name.genesis strong{font-family:var(--serif);font-style:italic;text-transform:none;font-weight:800;color:#fff}
.expression-tile.photo{background:#e7edfb}
.expression-tile.photo img{width:100%;height:100%;object-fit:cover;object-position:center;filter:grayscale(1) contrast(1.05);transition:transform .65s ease,filter .45s ease}
.expression-tile.photo:hover img{transform:scale(1.045);filter:grayscale(.15) saturate(1.02) contrast(1.03)}
.expression-tile.photo .photo-kicker{position:absolute;left:18px;bottom:18px;z-index:3;display:inline-flex;align-items:center;gap:8px;padding:8px 11px;border-radius:999px;background:rgba(20,20,28,.72);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);color:#fff;font-size:.66rem;font-weight:800;letter-spacing:.12em;text-transform:uppercase;line-height:1;box-shadow:0 8px 24px rgba(0,0,0,.14)}
.expression-tile.photo .photo-kicker::before{content:'';width:7px;height:7px;border-radius:50%;background:currentColor;box-shadow:0 0 0 3px rgba(255,255,255,.12)}
.expression-tile.photo.lighthouse .photo-kicker{color:#D4AF37}
.expression-tile.photo.dc .photo-kicker{color:#00CEC9}
.expression-tile.photo.genesis .photo-kicker{color:#fff;background:linear-gradient(90deg,rgba(231,47,36,.9),rgba(243,146,33,.9) 52%,rgba(33,169,225,.9))}
.expression-tile::after{content:'';position:absolute;inset:0;z-index:-1;opacity:0;transition:opacity .45s ease}
.expression-tile.lighthouse::after{background:linear-gradient(135deg,#1A1A1B 0%,#5a4917 58%,#D4AF37 100%)}
.expression-tile.dc::after{background:linear-gradient(135deg,#1A1A1B 0%,#636E72 55%,#00CEC9 100%)}
.expression-tile.genesis::after{background:linear-gradient(135deg,#E72F24 0%,#F39221 52%,#21A9E1 100%)}
/* Keep one branded title tile per expression permanently in its hover state */
.expression-tile.name::after{opacity:1}
.expression-tile.name{color:#fff}
.expression-tile:not(.photo):hover::after{opacity:1}
.expression-tile.copy:hover,.expression-tile.name:hover{color:#fff}
.expression-tile.copy:hover p{color:rgba(255,255,255,.88)}
.expression-tile.name:hover strong{color:#fff}

/* EVENT */
.event{background:linear-gradient(180deg,var(--paper),#fff 82%);padding:120px 0}
.event-top{display:flex;align-items:end;justify-content:space-between;gap:40px;margin-bottom:38px}
.event-top h2{font-family:var(--serif);font-size:clamp(4rem,7vw,7rem);line-height:.9;margin:0;color:var(--navy);letter-spacing:-.05em}
.event-feature{display:grid;grid-template-columns:1.35fr .65fr;min-height:620px;background:#111;color:#fff;overflow:hidden}
.event-image{position:relative;min-height:620px;overflow:hidden}
.event-image img{transition:transform 1s ease}
.event-feature:hover .event-image img{transform:scale(1.04)}
.event-image::after{content:'';position:absolute;inset:0;background:linear-gradient(to top,rgba(0,0,0,.5),transparent 55%)}
.event-badge{position:absolute;left:28px;top:28px;z-index:2;background:var(--gold);color:#111;padding:12px 14px;font-size:.68rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase}
.event-copy{padding:50px 44px;display:flex;flex-direction:column;justify-content:space-between;background:var(--navy)}
.event-date{font-family:var(--serif);font-size:1.45rem;color:var(--gold)}
.event-copy h3{font-family:var(--serif);font-size:clamp(3rem,5vw,5.6rem);line-height:.87;letter-spacing:-.045em;margin:18px 0}
.event-copy p{color:rgba(255,255,255,.72);line-height:1.65}

/* MESSAGE */
.message{background:#080809;color:white;padding:120px 0;position:relative;overflow:hidden}
.message::before{content:'WORD';position:absolute;right:-.06em;bottom:-.22em;font-size:clamp(15rem,32vw,36rem);font-weight:700;color:rgba(255,255,255,.025);letter-spacing:-.09em}
.message-grid{display:grid;grid-template-columns:.92fr 1.08fr;gap:70px;align-items:center;position:relative}
.message-copy h2{font-size:clamp(4.5rem,8vw,9.4rem);line-height:.78;letter-spacing:-.07em;text-transform:uppercase;margin:14px 0 30px}
.message-copy h2 span{display:block;font-family:var(--serif);font-style:italic;text-transform:none;color:var(--gold);font-size:.62em;letter-spacing:-.045em}
.message-copy p{max-width:560px;color:rgba(255,255,255,.7);line-height:1.7}
.video{aspect-ratio:4/5;position:relative;overflow:hidden;max-height:720px}
.video::after{content:'';position:absolute;inset:0;background:linear-gradient(to top,rgba(0,0,0,.62),transparent 60%)}
.play{position:absolute;z-index:3;left:50%;top:50%;transform:translate(-50%,-50%);width:102px;height:102px;border-radius:50%;background:var(--gold);color:#111;display:grid;place-items:center;font-size:1.8rem;box-shadow:0 0 0 12px rgba(247,184,1,.16);transition:.35s ease}
.video:hover .play{transform:translate(-50%,-50%) scale(1.08)}
.video-meta{position:absolute;left:28px;right:28px;bottom:26px;z-index:4;display:flex;justify-content:space-between;gap:30px;font-size:.72rem;letter-spacing:.1em;text-transform:uppercase}

/* VISIT */
.visit{
  background:linear-gradient(
    135deg,
    var(--daybreak-coral) 0%,
    var(--daybreak-orange) 28%,
    var(--gold) 100%
  );color:#171124;padding:0;overflow:hidden}
.visit-grid{display:grid;grid-template-columns:1fr 1fr;min-height:720px; margin-bottom:50px;}
.visit-copy{padding:100px 6vw 90px max(28px,calc((100vw - 1440px)/2));display:flex;flex-direction:column;justify-content:space-between}
.visit-heading-lockup{width:max-content;max-width:100%}
.visit-copy h2{font-size:clamp(3.5rem,6vw,7.4rem);line-height:.75;letter-spacing:-.075em;text-transform:uppercase;margin:12px 0 32px}
.visit-copy h2 .visit-come{display:block;font-family:var(--sans);font-style:normal;font-size:1em;font-weight:700;text-transform:uppercase;white-space:nowrap}
.visit-copy h2 .visit-welcome{font-family:var(--serif);font-style:italic;text-transform:none;font-size:.54em;display:block;word-spacing:.1em}
.visit-first-sunday{
  margin:0 0 16px;
  padding:0;
  color:inherit;
  font-size:clamp(1.15rem,1.7vw,1.75rem);
  line-height:1;
  font-weight:800;
  letter-spacing:.055em;
  word-spacing:.18em;
  text-transform:uppercase;
  white-space:nowrap;
}
.visit-first-sunday span{display:inline}
.visit-copy p{max-width:520px;line-height:1.65;font-size:1.05rem}
.visit-links{display:grid;grid-template-columns:1fr 1fr;border-top:1px solid rgba(0,0,0,.32);margin-top:40px}
.visit-links a{padding:20px 4px;border-bottom:1px solid rgba(0,0,0,.32);font-size:.78rem;font-weight:700;text-transform:uppercase;letter-spacing:.08em;display:flex;justify-content:space-between;align-items:center}
.visit-links a span:last-child{display:inline-block;font-size:1rem;transition:transform .3s ease}
.visit-links a:hover span:last-child{transform:translate(4px,-4px)}
.visit-links a:nth-child(odd){padding-right:22px;border-right:1px solid rgba(0,0,0,.32)}
.visit-links a:nth-child(even){padding-left:22px}
.visit-plan-btn{
  margin-top:20px;
}
.visit-card-grid{
  position:relative;
  display:flex;
  align-items:stretch;
  min-height:720px;
  padding:10px 10px 10px 0;
  overflow:hidden;
}
.visit-image-card{
  position:relative;
  flex:0 0 54%;
  min-height:0;
  overflow:hidden;
  color:#fff;
  isolation:isolate;
}
.visit-image-card:first-child{
  z-index:2;
  border-radius:20px 0 0 20px;
  clip-path:polygon(0 0,100% 0,86% 100%,0 100%);
}
.visit-image-card:last-child{
  z-index:1;
  margin-left:-8%;
  border-radius:0 20px 20px 0;
  clip-path:polygon(14% 0,100% 0,100% 100%,0 100%);
}
.visit-image-card img{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:cover;
  transition:transform .75s cubic-bezier(.2,.8,.2,1),filter .5s ease;
}
.visit-image-card:hover img{
  transform:scale(1.045);
  filter:saturate(1.05);
}
.visit-card-overlay{
  position:absolute;
  inset:0;
  z-index:1;
  background:
    linear-gradient(to top,rgba(14,10,34,.72) 0%,rgba(14,10,34,.18) 58%,rgba(14,10,34,.05) 100%);
}
.visit-card-content{
  position:absolute;
  z-index:2;
  left:30px;
  right:30px;
  bottom:28px;
}
.visit-image-card:first-child .visit-card-content{
  right:20%;
}
.visit-image-card:last-child .visit-card-content{
  left:20%;
}
.visit-card-kicker{
  display:block;
  margin-bottom:12px;
  font-size:.68rem;
  font-weight:800;
  letter-spacing:.15em;
  text-transform:uppercase;
  color:var(--gold-light);
}
.visit-card-content h3{
  margin:0 0 22px;
  font-size:clamp(2.25rem,3.7vw,4.6rem);
  line-height:.86;
  letter-spacing:-.055em;
  text-transform:uppercase;
}
.visit-card-btn{
  display:inline-flex;
  align-items:center;
  gap:12px;
  padding:12px 15px;
  border:1px solid rgba(255,255,255,.62);
  background:rgba(255,255,255,.10);
  backdrop-filter:blur(8px);
  -webkit-backdrop-filter:blur(8px);
  font-size:.7rem;
  font-weight:800;
  letter-spacing:.09em;
  text-transform:uppercase;
  transition:background .3s ease,color .3s ease,border-color .3s ease;
}
.visit-card-btn b{
  font-size:1rem;
  transition:transform .3s ease;
}
.visit-image-card:hover .visit-card-btn{
  background:var(--gold);
  border-color:var(--gold);
  color:#171124;
}
.visit-image-card:hover .visit-card-btn b{
  transform:translate(3px,-3px);
}

/* FOOTER */
footer{background:var(--navy-deep);color:white;padding:72px 0 28px}
.footer-top{display:grid;grid-template-columns:1.5fr repeat(3,.6fr);gap:54px}
.footer-brand h3{font-family:var(--serif);font-size:2.2rem;margin:18px 0 8px}
.footer-brand p{color:rgba(255,255,255,.58);line-height:1.7}
footer h4{color:var(--gold);font-size:.65rem;letter-spacing:.18em;text-transform:uppercase;margin:0 0 16px}
footer a{display:block;color:rgba(255,255,255,.72);padding:5px 0;font-size:.9rem}
footer a:hover{color:white}
.footer-bottom{border-top:1px solid rgba(255,255,255,.12);margin-top:58px;padding-top:20px;display:flex;justify-content:space-between;gap:30px;color:rgba(255,255,255,.42);font-size:.73rem;text-transform:uppercase;letter-spacing:.08em}

/* reveals */
.reveal{opacity:0;transform:translateY(35px);transition:opacity .8s ease,transform .8s cubic-bezier(.2,.8,.2,1)}
.reveal.in{opacity:1;transform:none}

@media(max-width:1050px){
  .nav-links{gap:1rem}
  .sunday-grid{grid-template-columns:1fr 1fr}.sunday-card{min-height:190px}
  .story-intro,.story-closing,.message-grid{grid-template-columns:1fr}
  .story-intro-copy{justify-self:start}.story-scrolly{grid-template-columns:minmax(0,.95fr) minmax(340px,.78fr)}.story-closing p{justify-self:start}
  .expression-heading{grid-template-columns:150px auto 1fr}.expression-heading-title{font-size:clamp(4.7rem,9vw,8rem)}.expression-heading-side.right{font-size:.68rem}.expression-cluster{grid-template-columns:315px 315px}
  .event-feature{grid-template-columns:1fr}.event-copy{min-height:450px}
  .video{max-width:620px;aspect-ratio:16/10}.visit-grid{grid-template-columns:1fr}.visit-card-grid{min-height:620px;padding:10px}
  .footer-top{grid-template-columns:1.2fr 1fr 1fr}.footer-top>div:last-child{display:none}
}
@media(max-width:760px){
  .wrap{width:min(100% - 28px,1440px)}.nav-inner{height:76px}.nav-links{display:none}.menu-btn{display:block}
  .hero-content{padding-top:96px;padding-bottom:28px;min-height:93svh;align-items:flex-end}.hero-main{display:block}.hero-split{grid-template-columns:1fr;gap:12px;justify-content:stretch}.hero-divider{display:none}.hero-copy{max-width:none}.hero-copy.left,.hero-copy.right{text-align:left;justify-self:stretch}.hero-title{font-size:clamp(2rem,10vw,3.45rem);line-height:.92}.hero-title .glory,.hero-title .person{margin-left:0}.hero-copy.left .hero-title .line:first-child,.hero-copy.right .hero-title .line:first-child{white-space:normal}.scroll-note{display:none}
  .hero-video-toggle{right:16px;bottom:76px;width:46px;height:46px}.marquee-track{padding:14px 0}.marquee-track span{font-size:.76rem}
  .sunday-grid{grid-template-columns:1fr}.sunday-card{min-height:150px;padding:28px 22px}
  .story{padding:82px 0 96px}.story-intro{gap:30px;margin-bottom:62px}.story-intro h2{font-size:clamp(3.2rem,5vw,5.8rem)}
  .story-scrolly{display:block}.story-stage{display:none}.story-step{min-height:0;opacity:1;transform:none;padding:0 0 58px}.story-step-inner{padding:0;border-top:0}.story-step h3{font-size:clamp(2.9rem,13vw,4.6rem)}.story-step-pulse{display:none}.story-mobile-media{display:block;height:330px;margin-top:28px;border-radius:22px;overflow:hidden}.story-mobile-media img{width:100%;height:100%;object-fit:cover}.story-closing{grid-template-columns:1fr;gap:24px;padding-top:46px}.story-closing p{justify-self:start}.story-ghost{font-size:28vw;top:3%}
  .ministry-section{padding:70px 0 85px}.expression-heading{display:block;margin-bottom:58px}.expression-heading-side{height:38px}.expression-heading-side.left{width:105px;justify-content:center;padding:0}.expression-heading-title{font-size:clamp(3.7rem,16vw,6rem);line-height:.8;padding:.12em 14px}.expression-heading-side.right{width:100%;padding:0 14px;font-size:.61rem;overflow:hidden}.expression-group{gap:10px;padding-right:10px}.expression-cluster{grid-template-columns:285px;grid-template-rows:165px 200px 175px;gap:8px}.expression-cluster .expression-tile.photo,.expression-cluster.photo-right .expression-tile.photo,.expression-cluster.photo-left .expression-tile.photo{grid-column:1;grid-row:2}.expression-cluster.photo-right .expression-tile.name,.expression-cluster.photo-left .expression-tile.name{grid-column:1;grid-row:1}.expression-cluster.photo-right .expression-tile.copy,.expression-cluster.photo-left .expression-tile.copy{grid-column:1;grid-row:3}.expression-tile{border-radius:20px}.expression-tile.copy{padding:20px}.expression-tile.copy p{font-size:.84rem}.expression-tile.name strong{font-size:2.25rem}.expression-tile.photo .photo-kicker{left:14px;bottom:14px;font-size:.6rem;padding:7px 9px}.expression-tile.copy .hover-arrow{right:14px;bottom:14px;width:48px;height:48px;font-size:1.25rem}
  .event{padding:90px 0}.event-top{display:block}.event-top .btn{margin-top:25px}.event-image{min-height:400px}.event-copy{padding:34px 24px}
  .message{padding:90px 0}.message-grid{gap:45px}.message-copy h2{font-size:clamp(4rem,16vw,7rem)}.video{aspect-ratio:4/5}.play{width:82px;height:82px}
  .visit-copy{padding:80px 22px}.visit-copy h2{font-size:clamp(4rem,16vw,7rem)}.visit-plan-btn{margin-top:16px}
  .visit-heading-lockup{width:100%}.visit-first-sunday{font-size:clamp(1rem,4.6vw,1.35rem)}.visit-links{grid-template-columns:1fr}.visit-links a:nth-child(odd){border-right:0;padding-right:4px}.visit-links a:nth-child(even){padding-left:4px}.visit-card-grid{min-height:420px;padding:8px}.visit-image-card{flex-basis:55%}.visit-image-card:first-child{border-radius:16px 0 0 16px;clip-path:polygon(0 0,100% 0,88% 100%,0 100%)}.visit-image-card:last-child{margin-left:-10%;border-radius:0 16px 16px 0;clip-path:polygon(12% 0,100% 0,100% 100%,0 100%)}.visit-card-content{left:14px;right:14px;bottom:16px}.visit-image-card:first-child .visit-card-content{right:15%}.visit-image-card:last-child .visit-card-content{left:15%}.visit-card-btn{padding:10px 11px;font-size:.6rem;gap:7px}
  .footer-top{grid-template-columns:1fr 1fr}.footer-brand{grid-column:1/3}.footer-bottom{flex-direction:column}
}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;animation:none!important;transition:none!important}.reveal{opacity:1;transform:none}.hero-video{display:none}.hero-media{background:url('https://images.unsplash.com/photo-1507692049790-de58290a4334?auto=format&fit=crop&w=2200&q=88') center 42%/cover no-repeat}.hero-video-toggle{display:none}}