/* =========================================================================
   Stand in the GAP — EMERGE
   Dark, editorial theme built from the Generation Jesus mark: charcoal
   ground, warm gold accent, serif display type paired with a clean sans.
   Bootstrap 5 handles all interactive mechanics; this file is visual only.
   ========================================================================= */

:root{
  /* Bright, warm page tones (page bg slightly tinted; cards pop bright white) */
  --ink:        #FFF3E3;
  --ink-2:      #FFE7C9;
  --surface:    #FFFFFF;
  --surface-2:  #FFF8EE;
  --line:       #F0DAB8;
  --line-soft:  #F6E9CE;

  --paper:      #FFFFFF;
  --paper-2:    #FFF3E3;

  --text:       #271D12;
  --text-mute:  #7A6A55;
  --text-faint: #AB9880;
  --text-ink:   #271D12;
  --text-ink-mute:#7A6A55;

  /* Vibrant coral-orange accent, plus two extra hues for gradients/energy */
  --gold:       #FF6A3D;
  --gold-light: #FF9466;
  --gold-dark:  #D94E22;
  --violet:     #7B4FE0;
  --pink:       #FF3D77;

  --radius-sm: 3px;
  --radius-md: 10px;
  --radius-lg: 22px;
}

*{ box-sizing:border-box; }

html{ scroll-behavior:smooth; }

body{
  background: var(--ink);
  color: var(--text);
  font-family: 'Poppins', -apple-system, sans-serif;
  font-size: .98rem;
  line-height: 1.7;
  -webkit-font-smoothing: antialiased;
}

.navbar-toggler-icon {
    display: inline-block;
    width: 1.5em;
    height: 1.5em;
    vertical-align: middle;
    background-image: var(--bs-navbar-toggler-icon-bg);
    background-repeat: no-repeat;
    background-position: center;
    background-size: 100%;
    background-color: black;
}

#danger {
    z-index: 999999;
    position: fixed;
    width: 100%;
}

h1,h2,h3,h4,.display-font{
  font-family: 'Playfair Display', Georgia, serif;
  font-weight: 700;
  letter-spacing: -.01em;
  color: var(--text);
}
.section-light h1, .section-light h2, .section-light h3, .section-light h4{ color: var(--text-ink); }

.eyebrow{
  font-family:'Poppins',sans-serif;
  font-size:.74rem;
  letter-spacing:.22em;
  text-transform:uppercase;
  color: var(--gold);
  font-weight:600;
  display:inline-flex;
  align-items:center;
  gap:.6rem;
}
.eyebrow::before{ content:''; width:26px; height:1px; background: var(--gold); display:inline-block; }

.script-tag{
  font-family:'Playfair Display', serif;
  font-style: italic;
  font-weight: 500;
  color: var(--text-mute);
}

a{ color: var(--gold-light); text-decoration:none; }
a:hover{ color: var(--gold); }

::selection{ background: var(--gold); color: #14181A; }

/* ---------------------------------------------------------------------- */
/* Sections / helpers                                                     */
/* ---------------------------------------------------------------------- */
.section{ padding: 5.5rem 0; }
.section-sm{ padding: 3.5rem 0; }
.section-light{ background: var(--paper); color: var(--text-ink); }
.section-surface{ background: var(--surface); }
.text-mute{ color: var(--text-mute) !important; }
.text-faint{ color: var(--text-faint) !important; }
.section-light .text-mute{ color: var(--text-ink-mute) !important; }
.gold{ color: var(--gold) !important; }
.divider-gold{ width:56px; height:2px; background: var(--gold); border:0; opacity:1; }
.divider-gold.center{ margin-left:auto; margin-right:auto; }

/* ---------------------------------------------------------------------- */
/* Navbar                                                                  */
/* ---------------------------------------------------------------------- */
.navbar-gap{
  background: rgba(255,252,246,.88);
  backdrop-filter: blur(8px);
  padding: .85rem 0;
  border-bottom: 1px solid rgba(39,29,18,.07);
  box-shadow: 0 1px 16px rgba(217,78,34,.05);
}
.navbar-gap .navbar-brand{
  display:flex; align-items:center; gap:.7rem;
  color: var(--text);
}
.navbar-gap .navbar-brand img{
  width:42px; height:42px; border-radius:50%;
  object-fit:cover;
}
.navbar-gap .brand-word{
  font-family:'Playfair Display',serif;
  font-weight:700;
  font-size:1.02rem;
  line-height:1.05;
  letter-spacing:.03em;
}
.navbar-gap .brand-sub{
  font-family:'Playfair Display',serif;
  font-style:italic;
  font-size:.66rem;
  color: var(--text-mute);
  letter-spacing:.02em;
}
.navbar-gap .nav-link{
  color: var(--text-mute);
  font-size:.86rem;
  font-weight:500;
  letter-spacing:.02em;
  margin: 0 .6rem;
  padding: .5rem 0 !important;
  border-bottom: 2px solid transparent;
}
.navbar-gap .nav-link:hover,
.navbar-gap .nav-link.active{
  color: var(--text);
  border-bottom-color: var(--gold);
}
.btn-gold{
  background: var(--gold);
  border-color: var(--gold);
  color: #191510;
  font-weight:600;
  font-size:.86rem;
  letter-spacing:.02em;
  border-radius: 999px;
  padding: .6rem 1.5rem;
}
.btn-gold:hover{ background: var(--gold-light); border-color: var(--gold-light); color:#191510; }
.btn-outline-gold{
  border:1px solid var(--gold);
  color: var(--gold-light);
  border-radius:999px;
  font-weight:600;
  font-size:.86rem;
  padding: .58rem 1.5rem;
  background:transparent;
}
.btn-outline-gold:hover{ background: var(--gold); color:#191510; }
/* On-photo variant — used over the hero image/video where the background
   is still a dark-ish gradient even in the bright theme. */
.btn-line{
  border:1px solid rgba(255,255,255,.5);
  color:#fff;
  border-radius:999px;
  font-weight:500;
  font-size:.86rem;
  padding:.58rem 1.5rem;
  background:rgba(255,255,255,.08);
}
.btn-line:hover{ border-color:#fff; background:rgba(255,255,255,.18); color:#fff; }

/* ---------------------------------------------------------------------- */
/* Hero / video banner                                                     */
/* ---------------------------------------------------------------------- */
.hero{
  position:relative;
  min-height: 92vh;
  display:flex;
  align-items:center;
  overflow:hidden;
  background: linear-gradient(135deg, var(--gold) 0%, var(--pink) 50%, var(--violet) 100%);
}
.hero video{
  position:absolute; inset:0;
  width:100%; height:100%;
  object-fit:cover;
  opacity:.6;
}
.hero::after{
  content:'';
  position:absolute; inset:0;
  background:
    linear-gradient(180deg, rgba(255,106,61,.30) 0%, rgba(123,79,224,.50) 45%, rgba(24,14,20,.82) 100%);
}
.hero h1, .hero-lede{ text-shadow: 0 2px 24px rgba(0,0,0,.25); }
.hero-content{ position:relative; z-index:2; }
.hero-mark{
  width:64px; height:64px;
  border-radius:50%;
  margin: 0 auto 1.5rem;
  border: 1px solid rgba(255,255,255,.25);
  padding: 3px;
}
.hero-mark img{ width:100%; height:100%; border-radius:50%; object-fit:cover; }
.hero h1{
  font-size: clamp(2.6rem, 6vw, 5rem);
  line-height: 1.02;
  color:#fff;
}
.hero .theme-word{ color: var(--gold); }
.hero-lede{
  max-width: 620px;
  margin: 1.2rem auto 0;
  color: rgba(255,255,255,.78);
  font-size:1.05rem;
}
.scroll-cue{
  position:absolute; bottom:1.75rem; left:50%; transform:translateX(-50%);
  z-index:2; color: rgba(255,255,255,.6); font-size:1.4rem;
  animation: bob 2.2s ease-in-out infinite;
}
@keyframes bob{ 0%,100%{ transform:translate(-50%,0); } 50%{ transform:translate(-50%,8px); } }

/* ---------------------------------------------------------------------- */
/* Countdown                                                               */
/* ---------------------------------------------------------------------- */
.countdown-strip{
  background: var(--surface);
  border-top:1px solid var(--line);
  border-bottom:1px solid var(--line);
}
.cd-box{
  text-align:center;
  padding: 1rem .5rem;
  border-right: 1px solid var(--line);
}
.cd-box:last-child{ border-right:0; }
.cd-num{
  font-family:'Playfair Display',serif;
  font-weight:700;
  font-size: clamp(1.8rem, 4vw, 2.8rem);
  color: var(--gold);
  line-height:1;
  font-variant-numeric: tabular-nums;
}
.cd-label{
  font-size:.68rem;
  letter-spacing:.16em;
  text-transform:uppercase;
  color: var(--text-mute);
  margin-top:.35rem;
}

/* ---------------------------------------------------------------------- */
/* Cards                                                                   */
/* ---------------------------------------------------------------------- */
.card-dark{
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: var(--radius-md);
  box-shadow: 0 4px 22px rgba(217,78,34,.06);
  padding:20px;
}
.card-dark .card-body{ padding: 1.6rem; }

.event-card{
  background: var(--surface);
  border:1px solid var(--line);
  border-radius: var(--radius-md);
  overflow:hidden;
  height:100%;
  box-shadow: 0 4px 22px rgba(217,78,34,.07);
  transition: transform .25s ease, border-color .25s ease, box-shadow .25s ease;
}
.event-card:hover{ transform: translateY(-4px); border-color: var(--gold); box-shadow: 0 14px 30px rgba(217,78,34,.16); }
.event-card .event-img{
  height: 210px;
  width:100%;
  object-fit:cover;
}
.event-card .event-body{ padding: 1.4rem; }
.event-date-badge{
  position:relative;
  margin-top:-46px;
  margin-left:1.1rem;
  width:64px;
  background: linear-gradient(155deg, var(--gold) 0%, var(--pink) 100%);
  border: none;
  border-radius: var(--radius-sm);
  text-align:center;
  padding:.4rem 0;
  z-index:2;
  box-shadow: 0 6px 16px rgba(217,78,34,.28);
}
.event-date-badge .dnum{ font-family:'Playfair Display',serif; font-weight:700; font-size:1.3rem; color:#fff; line-height:1; }
.event-date-badge .dmon{ font-size:.62rem; letter-spacing:.12em; text-transform:uppercase; color: rgba(255,255,255,.9); }
.event-meta{ font-size:.82rem; color: var(--text-mute); display:flex; align-items:center; gap:.4rem; }

/* EMERGE letter cards */
.emerge-card{
  background: var(--surface);
  border:1px solid var(--line);
  border-radius: var(--radius-md);
  padding: 1.6rem 1.4rem;
  height:100%;
}
.emerge-letter{
  font-family:'Playfair Display',serif;
  font-weight:700;
  font-size:2.4rem;
  color: var(--gold);
  line-height:1;
  margin-bottom:.6rem;
}

/* Pillars / call icons */
.pillar{
  text-align:center;
  padding: 1.5rem 1rem;
}
.pillar-icon{
  width:64px; height:64px;
  border:1px solid var(--gold);
  border-radius:50%;
  display:flex; align-items:center; justify-content:center;
  margin: 0 auto 1rem;
  color: var(--gold);
  font-size:1.4rem;
}

/* Stat row */
.stat{
  text-align:center;
}
.stat .num{ font-family:'Playfair Display',serif; font-weight:700; font-size:2.2rem; color: var(--gold); }
.stat .lbl{ font-size:.78rem; letter-spacing:.1em; text-transform:uppercase; color: var(--text-mute); }

/* ---------------------------------------------------------------------- */
/* Timeline (event detail schedule)                                       */
/* ---------------------------------------------------------------------- */
.timeline{ position:relative; padding-left: 2.1rem; border-left: 1px solid var(--line); }
.timeline-item{ position:relative; padding-bottom: 1.8rem; }
.timeline-item:last-child{ padding-bottom:0; }
.timeline-item::before{
  content:'';
  position:absolute; left:-2.35rem; top:.25rem;
  width:10px; height:10px; border-radius:50%;
  background: var(--gold);
  border: 3px solid var(--ink);
  box-shadow: 0 0 0 1px var(--gold);
}
.timeline-time{ font-size:.78rem; letter-spacing:.08em; text-transform:uppercase; color: var(--gold); }

/* ---------------------------------------------------------------------- */
/* Forms (on dark background)                                             */
/* ---------------------------------------------------------------------- */
.form-label{ font-size:.82rem; color: var(--text-mute); margin-bottom:.4rem; }
.form-control, .form-select{
  background: var(--surface-2);
  border: 1px solid var(--line);
  color: var(--text);
  padding: .7rem .9rem;
  border-radius: var(--radius-sm);
}
.form-control::placeholder{ color: var(--text-faint); }
.form-control:focus, .form-select:focus{
  background: var(--surface-2);
  border-color: var(--gold);
  color: var(--text);
  box-shadow: 0 0 0 3px rgba(201,162,75,.18);
}
.form-select option{ background: var(--surface-2); color: var(--text); }

/* ---------------------------------------------------------------------- */
/* Breadcrumb hero (interior pages)                                       */
/* ---------------------------------------------------------------------- */
.page-hero{

  padding: 8.5rem 0 3.5rem;
  background:
    radial-gradient(ellipse at top right, rgba(255,106,61,.16), transparent 55%),
    radial-gradient(ellipse at bottom left, rgba(123,79,224,.10), transparent 50%),
    var(--ink-2);
  border-bottom:1px solid var(--line);
  text-align:center;
}
.page-hero .eyebrow{ justify-content:center; }
.page-hero .eyebrow::before{ display:none; }
.breadcrumb-gap{
  font-size:.8rem;
  color: var(--text-mute);
}
.breadcrumb-gap a{ color: var(--text-mute); }
.breadcrumb-gap a:hover{ color: var(--gold); }

/* ---------------------------------------------------------------------- */
/* Vibrant CTA band                                                        */
/* ---------------------------------------------------------------------- */
.cta-band{
  background: linear-gradient(120deg, var(--gold) 0%, var(--pink) 55%, var(--violet) 100%);
  color:#fff;
}
.cta-band h2, .cta-band h3, .cta-band p{ color:#fff; }
.cta-band .eyebrow{ color: rgba(255,255,255,.9); }
.cta-band .eyebrow::before{ background: rgba(255,255,255,.65); }
.cta-band .text-mute{ color: rgba(255,255,255,.85) !important; }
.cta-band .btn-gold{ background:#fff; border-color:#fff; color: var(--gold-dark); }
.cta-band .btn-gold:hover{ background: rgba(255,255,255,.9); border-color: rgba(255,255,255,.9); }

/* ---------------------------------------------------------------------- */
/* Footer                                                                  */
/* ---------------------------------------------------------------------- */
.footer{
  background: var(--ink-2);
  border-top: 1px solid var(--line);
  padding: 3.5rem 0 1.5rem;
}
.footer .brand-word{ color: var(--text); font-family:'Playfair Display',serif; font-weight:700; }
.footer h6{
  font-size:.76rem;
  letter-spacing:.14em;
  text-transform:uppercase;
  color: var(--text-mute);
  margin-bottom:1.1rem;
}
.footer a.footer-link{
  color: var(--text-mute);
  display:block;
  font-size:.88rem;
  margin-bottom:.55rem;
}
.footer a.footer-link:hover{ color: var(--gold); }
.social-ring{
  width:38px; height:38px;
  border:1px solid var(--line);
  border-radius:50%;
  display:inline-flex; align-items:center; justify-content:center;
  color: var(--text-mute);
  margin-right:.5rem;
}
.social-ring:hover{ border-color: var(--gold); color: var(--gold); }
.footer-bottom{
  border-top:1px solid var(--line);
  margin-top: 2.5rem;
  padding-top: 1.5rem;
  font-size:.8rem;
  color: var(--text-faint);
}

/* ---------------------------------------------------------------------- */
/* Misc                                                                    */
/* ---------------------------------------------------------------------- */
.ratio-cover img, .ratio-cover video{ object-fit:cover; }
.tag-pill{
  display:inline-block;
  border:1px solid var(--gold);
  color: var(--gold-light);
  font-size:.72rem;
  letter-spacing:.08em;
  text-transform:uppercase;
  padding:.3rem .8rem;
  border-radius:999px;
}
.map-frame{
  border:1px solid var(--line);
  border-radius: var(--radius-md);
  overflow:hidden;
  box-shadow: 0 4px 22px rgba(217,78,34,.06);
  filter: grayscale(.1) saturate(1.15) contrast(.97);
}

@media (max-width: 767.98px){
  .cd-box{ border-right:0; border-bottom:1px solid var(--line); }
  .cd-box:last-child{ border-bottom:0; }
}