/* =========================================================
   FGMC M6.1.8 — CLEAN RESPONSIVE LAYOUT
   Goal: remove visual congestion without touching payment logic.
   ========================================================= */

:root{
  --m618-gold:#d7b56d;
  --m618-red:#b90016;
  --m618-black:#0d0f13;
}

/* -----------------------------------------
   DESKTOP NAVIGATION — quieter, more space
   ----------------------------------------- */
@media (min-width:1101px){
  #page-landing .site-nav.fgmc-v2-nav{
    padding:8px clamp(18px,2.2vw,34px)!important;
    min-height:78px!important;
    border-radius:0!important;
    background:rgba(12,13,16,.94)!important;
    backdrop-filter:blur(12px)!important;
    -webkit-backdrop-filter:blur(12px)!important;
  }

  #page-landing .nav-main-row{
    width:100%!important;
    max-width:1840px!important;
    margin:0 auto!important;
    display:flex!important;
    align-items:center!important;
    gap:12px!important;
  }

  #page-landing .nav-brand{
    min-width:250px!important;
    flex:0 0 auto!important;
    gap:10px!important;
  }

  #page-landing .nav-brand img{
    width:52px!important;
    height:52px!important;
  }

  #page-landing .logo-text{
    font-size:20px!important;
  }

  #page-landing .logo-text small{
    font-size:9px!important;
    letter-spacing:.09em!important;
  }

  #page-landing #nav-menu{
    flex:1 1 auto!important;
    min-width:0!important;
    display:flex!important;
    align-items:center!important;
    justify-content:flex-end!important;
    gap:4px!important;
  }

  #page-landing #nav-menu > a{
    padding:10px 8px!important;
    font-size:12px!important;
    line-height:1!important;
    white-space:nowrap!important;
    border-radius:10px!important;
  }

  #page-landing .nav-cta{
    flex:0 0 auto!important;
    margin-left:4px!important;
    padding:12px 18px!important;
    min-width:142px!important;
    font-size:12px!important;
    border-radius:12px!important;
  }

  /* Language remains easy to find, but should not dominate the hero. */
  .lang-toggle.floating-lang{
    top:92px!important;
    right:24px!important;
    transform:scale(.88)!important;
    transform-origin:top right!important;
    z-index:9700!important;
  }

  /* The older floating staff FAB is redundant once Admin/Staff exists in navigation. */
  .staff-login-fab{
    display:none!important;
  }
}

/* -----------------------------------------
   DESKTOP "MORE" MENU
   ----------------------------------------- */
.fgmc-more-wrap{
  position:relative;
  flex:0 0 auto;
}
.fgmc-more-button{
  border:1px solid rgba(215,181,109,.32);
  background:rgba(255,255,255,.06);
  color:#fff;
  min-height:38px;
  padding:0 12px;
  border-radius:10px;
  font:inherit;
  font-size:12px;
  font-weight:850;
  letter-spacing:.02em;
  cursor:pointer;
}
.fgmc-more-button:hover,
.fgmc-more-wrap.open .fgmc-more-button{
  border-color:rgba(215,181,109,.78);
  background:rgba(215,181,109,.13);
}
.fgmc-more-panel{
  position:absolute;
  top:calc(100% + 10px);
  right:0;
  width:min(300px,86vw);
  padding:8px;
  border:1px solid rgba(215,181,109,.28);
  border-radius:16px;
  background:rgba(13,15,19,.98);
  box-shadow:0 22px 60px rgba(0,0,0,.36);
  display:none;
  z-index:12000;
}
.fgmc-more-wrap.open .fgmc-more-panel{
  display:grid;
  gap:4px;
}
.fgmc-more-panel > a{
  display:flex!important;
  align-items:center!important;
  width:100%!important;
  min-height:44px!important;
  padding:10px 12px!important;
  border-radius:10px!important;
  color:#fff!important;
  text-decoration:none!important;
  font-size:13px!important;
  font-weight:780!important;
}
.fgmc-more-panel > a:hover{
  background:rgba(255,255,255,.08)!important;
  color:#f5d27a!important;
}
.fgmc-more-panel .fgmc-admin-nav-link{
  border:1px solid rgba(215,181,109,.26)!important;
  background:linear-gradient(135deg,rgba(99,0,15,.84),rgba(20,20,24,.94))!important;
}

/* -----------------------------------------
   HERO — more breathing room
   ----------------------------------------- */
@media (min-width:1101px){
  #page-landing .hero.fgmc-v2-hero{
    min-height:clamp(700px,82vh,820px)!important;
    padding:116px clamp(38px,5vw,96px) 74px!important;
    align-items:center!important;
  }

  #page-landing .hero-v2-grid{
    width:min(1500px,90vw)!important;
    grid-template-columns:minmax(0,1.45fr) minmax(300px,.55fr)!important;
    gap:clamp(44px,5vw,88px)!important;
    align-items:center!important;
  }

  #page-landing .hero-premium-copy{
    max-width:900px!important;
  }

  #page-landing .hero-premium-copy h1.hero-title,
  #page-landing .hero-premium-copy h1.typewriter-title,
  #page-landing .hero-typewriter-js{
    font-size:clamp(3.7rem,4.25vw,5rem)!important;
    line-height:.92!important;
    letter-spacing:-.04em!important;
    margin:14px 0 20px!important;
    gap:4px!important;
  }

  #page-landing .hero-premium-copy > p,
  #page-landing .hero-subtitle{
    max-width:760px!important;
    font-size:clamp(1rem,1.12vw,1.18rem)!important;
    line-height:1.55!important;
  }

  #page-landing .hero-side-panel{
    width:100%!important;
    max-width:370px!important;
    justify-self:end!important;
    gap:14px!important;
  }

  #page-landing .scripture-card{
    padding:25px 26px!important;
    border-radius:22px!important;
    box-shadow:0 20px 55px rgba(0,0,0,.25)!important;
  }

  #page-landing .scripture-card span{
    font-size:12px!important;
  }

  #page-landing .scripture-card p{
    margin-top:12px!important;
    font-size:clamp(1.35rem,1.45vw,1.85rem)!important;
    line-height:1.18!important;
  }

  /* The hero already has enough information; avoid a second large countdown card. */
  #page-landing .hero-side-panel .countdown-card{
    display:none!important;
  }

  /* Keep the hero CTA area simple. */
  #page-landing .hero-actions{
    gap:10px!important;
    margin-top:22px!important;
  }

  #page-landing .hero-actions .btn{
    min-height:46px!important;
    padding:12px 18px!important;
  }
}

/* -----------------------------------------
   QUICK ACTIONS — one launcher, not a rail
   ----------------------------------------- */
.quick-actions-v3{
  z-index:9300!important;
}
.quick-actions-v3.collapsed .qa-items{
  display:none!important;
  opacity:0!important;
  visibility:hidden!important;
  pointer-events:none!important;
}
.quick-actions-v3 .qa-main{
  box-shadow:0 14px 34px rgba(0,0,0,.28)!important;
}
@media (min-width:901px){
  .quick-actions-v3{
    right:22px!important;
    bottom:22px!important;
  }
  .quick-actions-v3 .qa-main{
    width:52px!important;
    height:52px!important;
    min-width:52px!important;
  }
}

/* -----------------------------------------
   RETREAT TOOLS — replace 3 large fixed bars
   ----------------------------------------- */
.fgmc-original-fixed-tool{
  display:none!important;
}

.fgmc-retreat-tools{
  position:fixed;
  left:50%;
  bottom:18px;
  transform:translateX(-50%);
  z-index:9400;
  display:flex;
  flex-direction:column;
  align-items:center;
  pointer-events:none;
}
.fgmc-retreat-tools > *{
  pointer-events:auto;
}

.fgmc-retreat-tools-toggle{
  min-height:44px;
  padding:0 16px;
  border:1px solid rgba(215,181,109,.48);
  border-radius:999px;
  background:rgba(13,15,19,.95);
  color:#fff;
  box-shadow:0 14px 38px rgba(0,0,0,.28);
  font:inherit;
  font-size:13px;
  font-weight:900;
  cursor:pointer;
}
.fgmc-retreat-tools-toggle::before{
  content:"☰";
  margin-right:8px;
  color:#f1c95f;
}
.fgmc-retreat-tools.open .fgmc-retreat-tools-toggle{
  border-color:#d7b56d;
  background:#17191d;
}

.fgmc-retreat-tools-panel{
  display:none;
  margin-bottom:9px;
  padding:8px;
  gap:7px;
  border:1px solid rgba(215,181,109,.35);
  border-radius:17px;
  background:rgba(13,15,19,.98);
  box-shadow:0 20px 60px rgba(0,0,0,.32);
}
.fgmc-retreat-tools.open .fgmc-retreat-tools-panel{
  display:flex;
}

.fgmc-retreat-tool{
  min-height:42px;
  padding:0 13px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:7px;
  border:1px solid rgba(255,255,255,.10);
  border-radius:11px;
  background:rgba(255,255,255,.06);
  color:#fff!important;
  text-decoration:none!important;
  font:inherit;
  font-size:12px;
  font-weight:850;
  white-space:nowrap;
  cursor:pointer;
}
.fgmc-retreat-tool:hover{
  border-color:rgba(215,181,109,.58);
  color:#f5d27a!important;
}
.fgmc-retreat-tool strong{
  color:#f5d27a;
}

/* Do not let the new tool drawer overlap mobile browser safe areas. */
@media (max-width:900px){
  .fgmc-retreat-tools{
    bottom:calc(14px + env(safe-area-inset-bottom));
  }
  .fgmc-retreat-tools-panel{
    max-width:calc(100vw - 28px);
    flex-direction:column;
  }
  .fgmc-retreat-tool{
    min-width:min(300px,calc(100vw - 48px));
  }
  .quick-actions-v3{
    right:12px!important;
    bottom:calc(72px + env(safe-area-inset-bottom))!important;
  }
}

/* On short desktop displays the hero must still remain usable. */
@media (min-width:1101px) and (max-height:760px){
  #page-landing .hero.fgmc-v2-hero{
    min-height:680px!important;
    padding-top:104px!important;
  }
  #page-landing .hero-premium-copy h1.hero-title,
  #page-landing .hero-premium-copy h1.typewriter-title,
  #page-landing .hero-typewriter-js{
    font-size:clamp(3.2rem,3.9vw,4.35rem)!important;
  }
  #page-landing .scripture-card{
    padding:20px 22px!important;
  }
}

/* Accessibility */
@media (prefers-reduced-motion:reduce){
  .fgmc-more-panel,
  .fgmc-retreat-tools-panel{
    transition:none!important;
  }
}