/* ============================================================
   The Grit Institute — Redesign layer (loaded after Webflow CSS)
   Cleaner · calmer · faster. Overrides defaults only; fully reversible.
   Brand: dark-teal #1E4D7A · teal #53717e · orange #dc4d2f
   ============================================================ */

:root{
  --gi-teal-dark:#1E4D7A;
  --gi-teal:#53717e;
  --gi-orange:#dc4d2f;
  --gi-orange-light:#fa7151;
  --gi-off-white:#f6f6f6;
  --gi-ease:cubic-bezier(.22,.61,.36,1);
}

/* --- Instant paint: never gate content on the JS reveal --- */
.page-wrapper{opacity:1 !important;}

/* smoother in-page scrolling */
html{scroll-behavior:smooth;}

/* ============================================================
   NAVIGATION — frosted, minimal, confident
   ============================================================ */
.navigation{
  background-color:rgba(30,77,122,.45) !important;
  -webkit-backdrop-filter:saturate(140%) blur(14px);
  backdrop-filter:saturate(140%) blur(14px);
  border-bottom:1px solid rgba(255,255,255,.06);
  padding-left:2.5rem !important;padding-right:2.5rem !important;
  transition:background-color .4s var(--gi-ease),border-color .4s var(--gi-ease),box-shadow .4s var(--gi-ease);
}
.navigation.is-scrolled{
  background-color:rgba(30,77,122,.94) !important;
  border-bottom-color:rgba(255,255,255,.10);
  box-shadow:0 10px 30px -12px rgba(0,0,0,.45);
}
.navbar{background:transparent !important;}
.nav_bg{display:none !important;}            /* remove the heavy dark overlay block */

/* logo */
.top-nav_logo{transition:opacity .3s var(--gi-ease);}
.nav_brand:hover .top-nav_logo{opacity:.82;}

/* item rhythm */
.nav-menu_list-centered{gap:.25rem;}
.nav-menu_list-item{display:flex;align-items:center;}

/* links + dropdown toggles */
.nav_link,
.nav-dropdown-toggle{
  position:relative;
  font-family:var(--_typeface---body-text-dm-sans,'DM Sans',sans-serif);
  font-size:.92rem;font-weight:500;letter-spacing:.01em;
  color:rgba(255,255,255,.86) !important;
  padding:.55rem .85rem !important;border-radius:8px;
  transition:color .25s var(--gi-ease);
  cursor:pointer;
}
.nav_link:hover,.nav-dropdown-toggle:hover,
.nav_link.w--current{color:#fff !important;}

/* animated underline */
.nav_link::after,
.nav-dropdown-toggle::after{
  content:"";position:absolute;left:.85rem;right:.85rem;bottom:.34rem;height:1.5px;
  background:var(--gi-orange-light);transform:scaleX(0);transform-origin:left;
  transition:transform .3s var(--gi-ease);border-radius:2px;
}
.nav_link:hover::after,
.nav_link.w--current::after,
.nav-dropdown:hover .nav-dropdown-toggle::after,
.nav-dropdown-toggle.gi-active::after{transform:scaleX(1);}

/* chevron */
.nav-dropdown{display:flex;align-items:center;}
.nav-dropdown-toggle{display:flex;align-items:center;gap:.4rem;}
.dropdown-icon{font-size:.55rem !important;opacity:.7;margin:0 !important;
  transition:transform .3s var(--gi-ease);}
.nav-dropdown:hover .dropdown-icon{transform:rotate(180deg);}

/* desktop: hover-to-open, soft fade */
@media screen and (min-width:992px){
  .nav-dropdown .dropdown-navigation.w-dropdown-list{
    display:block !important;position:absolute;top:100%;left:50%;
    transform:translate(-50%,8px);min-width:232px;margin-top:.4rem;
    background:#fff;border-radius:14px;padding:.5rem;
    box-shadow:0 24px 48px -16px rgba(30,77,122,.28),0 2px 8px rgba(30,77,122,.08);
    border:1px solid rgba(30,77,122,.06);
    opacity:0;visibility:hidden;pointer-events:none;
    transition:opacity .26s var(--gi-ease),transform .26s var(--gi-ease),visibility .26s;
  }
  .nav-dropdown:hover .dropdown-navigation.w-dropdown-list{
    opacity:1;visibility:visible;pointer-events:auto;transform:translate(-50%,0);
  }
}

/* dropdown links */
.dropdown_links{
  display:block;font-family:var(--_typeface---body-text-dm-sans,'DM Sans',sans-serif);
  font-size:.9rem;font-weight:500;color:var(--gi-teal-dark) !important;
  padding:.6rem .85rem !important;border-radius:9px;white-space:nowrap;
  transition:background-color .2s var(--gi-ease),color .2s var(--gi-ease),padding-left .2s var(--gi-ease);
}
.dropdown_links:hover{background:var(--gi-off-white);color:var(--gi-orange) !important;padding-left:1.05rem !important;}
.dropdown_links.w--current{background:var(--gi-off-white);color:var(--gi-orange) !important;}

/* CTA pill */
.button.is-nav_btn{
  background:var(--gi-orange) !important;color:#fff !important;
  border-radius:999px !important;padding:.62rem 1.25rem !important;
  font-family:var(--_typeface---body-text-dm-sans,'DM Sans',sans-serif);
  font-size:.9rem;font-weight:600;letter-spacing:.01em;
  box-shadow:0 8px 22px -10px rgba(220,77,47,.7);
  transition:transform .25s var(--gi-ease),box-shadow .25s var(--gi-ease),background-color .25s var(--gi-ease);
}
.button.is-nav_btn:hover{
  background:var(--gi-orange-light) !important;transform:translateY(-1px);
  box-shadow:0 12px 28px -10px rgba(220,77,47,.8);
}
.button.is-nav_btn .button-icon{transition:transform .25s var(--gi-ease);}
.button.is-nav_btn:hover .button-icon{transform:translateX(3px);}

/* keyboard focus polish */
a:focus-visible,button:focus-visible,[tabindex]:focus-visible{
  outline:2px solid var(--gi-orange-light);outline-offset:3px;border-radius:4px;
}

/* ============================================================
   SPACING & FIT FIXES
   ============================================================ */
/* "Buy The Book" eyebrow was overlapping the giant THE GRIT FACTOR title
   (the container had margin-bottom:-3.6rem pulling them together) */
.buy-title{margin-bottom:-.5rem !important;}
.buy-heading-style{margin-bottom:.2em !important;}
/* never let long words/headings overflow horizontally on small screens */
h1,h2,h3,.heading-style-h1,.buy-main-title{overflow-wrap:break-word;}
@media (max-width:767px){
  .buy-main-title{font-size:clamp(3rem,17vw,8rem) !important;}
}

/* ============================================================
   GLOBAL PREMIUM MICRO-INTERACTIONS (hover-based; no IX2 conflict)
   ============================================================ */
.button{transition:transform .25s var(--gi-ease),box-shadow .25s var(--gi-ease),
  background-color .25s var(--gi-ease),color .25s var(--gi-ease),filter .25s var(--gi-ease) !important;}
.button:not(.is-nav_btn):hover{transform:translateY(-2px);filter:saturate(1.05);}
.button .button-icon{transition:transform .25s var(--gi-ease);}
.button:hover .button-icon{transform:translateX(4px);}

/* ============================================================
   FLOATING "BOOK SHANNON" CTA (injected by redesign.js) — drives bookings
   ============================================================ */
.gi-float-cta{
  position:fixed;right:1.5rem;bottom:1.5rem;z-index:980;
  display:inline-flex;align-items:center;gap:.5rem;
  font-family:var(--_typeface---body-text-dm-sans,'DM Sans',sans-serif);font-size:.92rem;font-weight:600;
  color:#fff;background:var(--gi-orange);text-decoration:none;
  padding:.85rem 1.35rem;border-radius:999px;
  box-shadow:0 14px 34px -10px rgba(220,77,47,.75);
  transform:translateY(140%);opacity:0;pointer-events:none;
  transition:transform .5s var(--gi-ease),opacity .5s var(--gi-ease),background-color .25s var(--gi-ease);
}
.gi-float-cta.show{transform:translateY(0);opacity:1;pointer-events:auto;}
.gi-float-cta:hover{background:var(--gi-orange-light);transform:translateY(-3px);}
.gi-float-cta svg{width:1.05em;height:1.05em;transition:transform .25s var(--gi-ease);}
.gi-float-cta:hover svg{transform:translateX(4px);}
.gi-float-cta::before{content:"";position:absolute;inset:0;border-radius:999px;
  box-shadow:0 0 0 0 rgba(220,77,47,.55);animation:gi-pulse 2.6s var(--gi-ease) infinite;}
@keyframes gi-pulse{0%{box-shadow:0 0 0 0 rgba(220,77,47,.5);}70%{box-shadow:0 0 0 14px rgba(220,77,47,0);}100%{box-shadow:0 0 0 0 rgba(220,77,47,0);}}
@media (max-width:560px){.gi-float-cta{right:1rem;bottom:1rem;padding:.7rem 1.1rem;font-size:.85rem;}}
@media (prefers-reduced-motion:reduce){.gi-float-cta::before{animation:none;}}

/* ============================================================
   CINEMATIC HERO — slow Ken-Burns zoom + smooth crossfade
   (paired with slower Splide pacing: 6.5s interval, 1.5s fade)
   ============================================================ */
.hero-slider .splide__slide{overflow:hidden;}
.hero-slider .slider-image{
  will-change:transform;transform-origin:center;transform:scale(1.02);
  transition:transform 8s cubic-bezier(.22,.61,.36,1);
}
.hero-slider .splide__slide.is-active .slider-image{transform:scale(1.12);}
.hero-slider .splide__slide.is-active:nth-child(even) .slider-image{transform:scale(1.12) translate(-1.5%, -1%);}
@media (prefers-reduced-motion:reduce){
  .hero-slider .slider-image,
  .hero-slider .splide__slide.is-active .slider-image{transform:none;transition:none;}
}

/* ============================================================
   HERO SCROLL CUE (injected by redesign.js on the homepage)
   ============================================================ */
.gi-scroll-cue{
  position:absolute;left:50%;bottom:2rem;transform:translateX(-50%);z-index:5;
  display:flex;flex-direction:column;align-items:center;gap:.5rem;
  background:none;border:0;cursor:pointer;color:rgba(255,255,255,.82);
  font-family:'DM Sans',sans-serif;font-size:.66rem;letter-spacing:.28em;text-transform:uppercase;
  transition:color .3s var(--gi-ease),opacity .4s var(--gi-ease);
}
.gi-scroll-cue:hover{color:#fff;}
.gi-scroll-cue .mouse{width:24px;height:38px;border:1.6px solid rgba(255,255,255,.6);border-radius:14px;position:relative;}
.gi-scroll-cue .mouse::after{content:"";position:absolute;left:50%;top:7px;width:3px;height:7px;border-radius:3px;
  background:var(--gi-orange-light);transform:translateX(-50%);animation:gi-scroll 1.8s var(--gi-ease) infinite;}
@keyframes gi-scroll{0%{opacity:0;transform:translate(-50%,0);}30%{opacity:1;}100%{opacity:0;transform:translate(-50%,12px);}}
@media (prefers-reduced-motion:reduce){.gi-scroll-cue .mouse::after{animation:none;}}
@media (max-width:767px){.gi-scroll-cue{display:none;}}

/* ============================================================
   SCROLL-REVEAL SYSTEM (site-wide; powers the homepage motion upgrade)
   ============================================================ */
.reveal{opacity:0;transform:translateY(28px);
  transition:opacity .85s var(--gi-ease),transform .85s var(--gi-ease);will-change:opacity,transform;}
.reveal.in{opacity:1;transform:none;}
.reveal-stagger>*{opacity:0;transform:translateY(22px);
  transition:opacity .7s var(--gi-ease),transform .7s var(--gi-ease);}
.reveal-stagger.in>*{opacity:1;transform:none;}
.reveal-stagger.in>*:nth-child(2){transition-delay:.07s;}
.reveal-stagger.in>*:nth-child(3){transition-delay:.14s;}
.reveal-stagger.in>*:nth-child(4){transition-delay:.21s;}
.reveal-stagger.in>*:nth-child(5){transition-delay:.28s;}
.reveal-stagger.in>*:nth-child(6){transition-delay:.35s;}
@media (prefers-reduced-motion:reduce){
  .reveal,.reveal-stagger>*{opacity:1!important;transform:none!important;transition:none!important;}
}

/* ============================================================
   LAKE-BLUE RECOLOR — override Webflow's brand variable site-wide
   ============================================================ */
:root{
  --_colors---swatches-brand--dark-teal:#1E4D7A !important;  /* was #013135 teal -> lake blue */
}

/* ============================================================
   REMOVE the "Made in Webflow" badge (bottom-right)
   ============================================================ */
.w-webflow-badge{display:none !important;}

/* ============================================================
   HERO IMAGE FIT — show her head (was object-position 70% 50%,
   centering on the torso and clipping the head)
   ============================================================ */
.hero-slider .slider-image,.slider-image{object-position:50% 24% !important;}

/* ============================================================
   COMPASS MOTIF — slow-rotating accent (injected by redesign.js)
   ============================================================ */
.gi-compass{position:absolute;pointer-events:none;z-index:0;display:block;
  animation:gi-rotate 120s linear infinite;}
.gi-compass svg{display:block;width:100%;height:100%;}
@keyframes gi-rotate{to{transform:rotate(360deg);}}
.gi-compass--footer{width:min(34vw,380px);aspect-ratio:1;right:2%;top:50%;
  transform-origin:center;margin-top:-19vw;opacity:.07;color:#fff;}
.gi-compass--section{width:min(38vw,420px);aspect-ratio:1;right:-5%;bottom:-12%;opacity:.09;color:var(--gi-orange-light);}
@media (prefers-reduced-motion:reduce){.gi-compass{animation:none;}}
@media (max-width:767px){.gi-compass--footer{opacity:.05;}}

/* slightly slower, silkier Ken-Burns on the hero (smoother "helicopter" cover) */
.hero-slider .slider-image{transition:transform 10s cubic-bezier(.22,.61,.36,1) !important;}

/* ============================================================
   HOME: smaller YouTube videos (were 47.5rem wide) + a little breathing room
   ============================================================ */
.videos-slider-wrapper{max-width:34rem !important;margin-top:2rem !important;}

/* shorten the bottom area a little */
.footer-padding{padding-top:2rem !important;padding-bottom:1.4rem !important;}

/* ============================================================
   "WOW" LAYER — extra cinematic motion (composes with Webflow IX2)
   ============================================================ */

/* Hero: continuous, dramatic Ken-Burns drift+zoom on the active slide */
@keyframes gi-kenburns{
  0%{transform:scale(1.04) translate(0,0);}
  100%{transform:scale(1.17) translate(-2%,-2%);}
}
.hero-slider .splide__slide.is-active .slider-image{
  animation:gi-kenburns 9s cubic-bezier(.22,.61,.36,1) forwards !important;
}
@media (prefers-reduced-motion:reduce){
  .hero-slider .splide__slide.is-active .slider-image{animation:none !important;}
}

/* Primary CTA: light "shine" sweep on hover */
.button.is-nav_btn,.button.is-icon{position:relative;overflow:hidden;}
.button.is-nav_btn::after,.button.is-icon::after{
  content:"";position:absolute;top:0;left:-75%;width:45%;height:100%;pointer-events:none;
  background:linear-gradient(120deg,transparent,rgba(255,255,255,.38),transparent);
  transform:skewX(-20deg);transition:left .65s var(--gi-ease);
}
.button.is-nav_btn:hover::after,.button.is-icon:hover::after{left:130%;}

/* Cards / CMS items: gentle lift + shadow on hover */
.w-dyn-item,[class*="card"]{transition:transform .35s var(--gi-ease),box-shadow .35s var(--gi-ease);}
.w-dyn-item:hover{transform:translateY(-5px);box-shadow:0 26px 50px -26px rgba(30,77,122,.35);}


/* ============================================================
   FIXES round 2 (video size, blue consistency, CTA height, hero)
   ============================================================ */

/* YouTube videos: force ~35% smaller (max specificity to beat any cascade) */
html body .videos-slider-wrapper{
  width:30rem !important;max-width:30rem !important;
  margin-left:auto !important;margin-right:auto !important;
}

/* CONSISTENT BLUE: harmonize the medium "teal" (#53717e slate, used on the
   footer + review/section backgrounds) to a lake-blue of the same hue as the
   dark lake blue, so every blue on the site matches */
:root{ --_colors---swatches-brand--teal:#356b88 !important; }

/* Compact the newsletter / final CTA band (was 9.06rem / 7.75rem padding) */
.cta-padding{padding-top:4rem !important;padding-bottom:3.5rem !important;}

/* HERO: cooler, silkier cinematic Ken-Burns (overrides the earlier 9s version) */
@keyframes gi-kenburns{
  0%{transform:scale(1.05) translate(0,0);}
  100%{transform:scale(1.19) translate(-2.4%,-2.6%);}
}
.hero-slider .splide__slide.is-active .slider-image{
  animation:gi-kenburns 14s cubic-bezier(.16,.5,.28,1) forwards !important;
}

/* Book image was in a square container with object-fit:cover -> cropped the
   top/bottom of the portrait cover. Show the whole book. */
.home-book-image-wrapper{object-fit:contain !important;}

/* ============================================================
   "HELICOPTER" BOOK — fly into the page on scroll, then a smooth gentle twist
   (the book cover depicts the Apache; replaces Webflow's cutty side-to-side)
   ============================================================ */
.book-link-home{perspective:1200px;}
.home-book-image-wrapper.gi-book-fly{opacity:0;will-change:transform,opacity;transform-origin:center;}
.home-book-image-wrapper.gi-book-fly.in{
  animation:gi-book-in 1.5s cubic-bezier(.2,.7,.25,1) forwards,
            gi-book-twist 8s ease-in-out 1.5s infinite;
}
@keyframes gi-book-in{
  0%{opacity:0;transform:translateY(52px) translateZ(-220px) rotateY(-30deg) scale(.9);}
  55%{opacity:1;}
  72%{transform:translateY(0) translateZ(0) rotateY(11deg) scale(1.035);}
  100%{opacity:1;transform:translateY(0) translateZ(0) rotateY(0deg) scale(1);}
}
@keyframes gi-book-twist{
  0%{transform:rotateY(0deg);}25%{transform:rotateY(-6deg);}
  75%{transform:rotateY(6deg);}100%{transform:rotateY(0deg);}
}
@media (prefers-reduced-motion:reduce){
  .home-book-image-wrapper.gi-book-fly,.home-book-image-wrapper.gi-book-fly.in{
    animation:none !important;opacity:1 !important;transform:none !important;}
}

/* Footer compass: tuck into the bottom-right corner so it stops crowding the footer nav */
.gi-compass--footer{
  width:min(22vw,260px);right:-3%;bottom:-8%;top:auto;margin:0;opacity:.05;
}

/* ============================================================
   Book "helicopter": continuous orbital float (never stops at the extremes)
   ============================================================ */
@keyframes gi-book-float{
  0%,100%{transform:rotateY(0deg) translateY(0);}
  20%{transform:rotateY(-6deg) translateY(-3px);}
  50%{transform:rotateY(0deg) translateY(-7px);}
  80%{transform:rotateY(6deg) translateY(-3px);}
}
.home-book-image-wrapper.gi-book-fly.in{
  animation:gi-book-in 1.5s cubic-bezier(.2,.7,.25,1) forwards,
            gi-book-float 11s linear 1.5s infinite;
}

/* ============================================================
   FOOTER: smaller + remove the Navigation column (made it too long)
   ============================================================ */
.footer-item_grid-item:first-child{display:none !important;}   /* the Navigation list */
.footer-padding{padding-top:1.6rem !important;padding-bottom:1rem !important;}
.footer_flex{gap:2rem !important;}
.footer-bottom_flex{padding-top:1rem !important;margin-top:1rem !important;}

/* Anchor links shouldn't land under the fixed nav */
html{scroll-padding-top:6rem;}

/* ============================================================
   ACCESSIBILITY: skip link + global reduced-motion support
   ============================================================ */
.gi-skip{position:fixed;top:-100px;left:1rem;z-index:1001;background:var(--gi-orange);color:#fff;
  padding:.7rem 1.1rem;border-radius:0 0 10px 10px;text-decoration:none;font-weight:600;font-size:.9rem;
  transition:top .2s var(--gi-ease);}
.gi-skip:focus{top:0;}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{
    animation-duration:.01ms !important;animation-iteration-count:1 !important;
    transition-duration:.01ms !important;scroll-behavior:auto !important;
  }
}

/* ============================================================
   Book/Apache: fly IN like a helicopter banking into frame, then settle
   (overrides the earlier depth-only entrance). main-wrapper overflow:hidden
   clips the off-screen approach, so no horizontal scrollbar.
   ============================================================ */
@keyframes gi-book-in{
  0%{opacity:0;transform:translateX(48vw) translateY(-26px) rotateY(-42deg) rotateZ(7deg) scale(.82);}
  35%{opacity:1;}
  72%{transform:translateX(0) translateY(-9px) rotateY(12deg) rotateZ(-2deg) scale(1.045);}
  100%{opacity:1;transform:translateX(0) translateY(0) rotateY(0deg) rotateZ(0deg) scale(1);}
}
.home-book-image-wrapper.gi-book-fly.in{
  animation:gi-book-in 1.9s cubic-bezier(.2,.72,.22,1) forwards,
            gi-book-float 11s linear 1.9s infinite;
}

/* ============================================================
   APACHE HELICOPTER (.animated-image): flies in (approach + rise), settles,
   then hovers with a gentle bob. Replaces Webflow's side-to-side twist.
   ============================================================ */
@keyframes gi-heli-in{
  0%{opacity:0;transform:translateY(90px) scale(.76);}
  60%{opacity:1;}
  100%{opacity:1;transform:translateY(0) scale(1);}
}
@keyframes gi-heli-hover{
  0%,100%{transform:translateY(0) rotate(0deg);}
  50%{transform:translateY(-11px) rotate(-.6deg);}
}
.animated-image.gi-heli-fly{opacity:0;will-change:transform,opacity;}
.animated-image.gi-heli-fly.in{
  animation:gi-heli-in 1.7s cubic-bezier(.2,.7,.25,1) forwards,
            gi-heli-hover 4.5s ease-in-out 1.7s infinite;
}
@media (prefers-reduced-motion:reduce){
  .animated-image.gi-heli-fly,.animated-image.gi-heli-fly.in{
    animation:none !important;opacity:1 !important;transform:none !important;}
}

/* Apache: make the fly-in + hover slightly more apparent (overrides above) */
@keyframes gi-heli-in{
  0%{opacity:0;transform:translateY(150px) scale(.62);}
  55%{opacity:1;}
  100%{opacity:1;transform:translateY(0) scale(1);}
}
@keyframes gi-heli-hover{
  0%,100%{transform:translateY(0) rotate(0deg);}
  50%{transform:translateY(-18px) rotate(-1deg);}
}
.animated-image.gi-heli-fly.in{
  animation:gi-heli-in 1.9s cubic-bezier(.2,.72,.22,1) forwards,
            gi-heli-hover 4s ease-in-out 1.9s infinite;
}

/* Apache: hover bob only once it has "landed" (JS toggles .gi-landed after the
   scroll-linked fly-in completes). The scroll-linked transform is set inline by JS. */
.animated-image.gi-heli-fly.gi-landed{
  animation:gi-heli-hover 4s ease-in-out infinite;
}

/* ============================================================
   A11Y: keyboard-operable dropdowns + screen-reader-only utility
   ============================================================ */
@media screen and (min-width:992px){
  .nav-dropdown:focus-within .dropdown-navigation.w-dropdown-list{
    opacity:1;visibility:visible;pointer-events:auto;transform:translate(-50%,0);
  }
}
.nav-dropdown-toggle:focus-visible{outline:2px solid var(--gi-orange-light);outline-offset:3px;border-radius:8px;}
.gi-sr-only{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;
  clip:rect(0,0,0,0);white-space:nowrap;border:0;}

/* ============================================================
   GLITCH FIXES
   ============================================================ */
/* 1) disable the auto-opening newsletter popup */
.popup_section{display:none !important;}

/* 2) header was occasionally "stuck" mid-screen: a transformed ancestor turns
   position:fixed into position:absolute. Forbid transforms on the wrapper. */
.page-wrapper{transform:none !important;}

/* 3) Book ("buy the grit factor") must always be visible — no JS-gated reveal.
   Keep only the gentle continuous float.
   3b) It was invisible in the buy section: with left auto/width 23rem/right -2.5rem
   on an absolutely-positioned img, Chrome resolves max-width:100% (global img reset)
   against 0 here and clips width to 0 (height is unaffected). Drop max-width so the
   explicit width wins. */
.home-book-image-wrapper.gi-book-fly{
  max-width:none !important;
  opacity:1 !important;
  animation:gi-book-float 11s linear infinite !important;
}

/* 4) Dropdowns closed when moving the cursor down across the gap. Bridge it so
   hovering Speaking lets you slide straight down onto the items and click. */
@media screen and (min-width:992px){
  .nav-dropdown .dropdown-navigation.w-dropdown-list{margin-top:0 !important;}
  .nav-dropdown:hover::after{
    content:"";position:absolute;left:50%;transform:translateX(-50%);
    top:100%;width:270px;height:1.6rem;
  }
}

/* 5) "Check Availability" (contact) page: a distinct, premium background */
.contact_section{
  background:radial-gradient(120% 90% at 82% 0%, #e8f0f3 0%, #f3f6f7 45%, #eef3f5 100%) !important;
}

/* Speaking page: the teaching reel was full-width. Constrain it to a tidy size. */
.huffman-video-wrapper{max-width:760px !important;margin-left:auto !important;margin-right:auto !important;}

/* ============================================================
   FIXES round 3 — top nav banner (Sept 2026)
   1) Hero text slid up under the fixed nav on shorter screens
      (laptop/tablet windows under ~780px tall). The hero was locked to
      100vh with 22rem of top padding, so the headline was pushed
      upward behind the banner. Now the hero grows when it needs to
      and always keeps its text below the nav.
   2) Nav links and CTA were .9rem (~14px) — bumped for legibility.
   ============================================================ */
@media screen and (min-width:768px){
  .section.hero_section{height:auto !important;min-height:100vh;min-height:100svh;}
  .hero-main-wrapper{
    height:auto !important;min-height:100vh;min-height:100svh;
    padding-top:clamp(9rem, calc(100svh - 41rem), 22.125rem) !important;
  }
}
.nav_link,
.nav-dropdown-toggle{font-size:max(1.0625rem,17px) !important;letter-spacing:.005em;}
.button.is-nav_btn{font-size:max(1rem,16px) !important;}
.dropdown_links{font-size:max(1rem,16px) !important;}

/* ---- Oct 2026 review: squarer, quieter buttons (no pills); no looping pulse ---- */
.button,.w-button,.contact-submit-btn,.sk-btn,.gi-float-cta,.gi-float-cta::before,.button.is-nav_btn{border-radius:4px !important;}
.gi-float-cta::before{animation:none !important;box-shadow:none !important;}
.button-icon{border-radius:3px;}
/* hero: one strong action; the free download becomes a quiet text link */
.hero_grid-item .button.is-icon-outline{background:transparent !important;border:0 !important;box-shadow:none !important;padding-left:0 !important;padding-right:0 !important;text-transform:none !important;letter-spacing:0 !important;text-decoration:underline;text-underline-offset:5px;text-decoration-thickness:1px;justify-content:flex-start;width:auto !important;}
.hero_grid-item .button.is-icon-outline:hover{text-decoration-thickness:2px;}

/* Home hero: photo fades into lake blue (matches ads and course pages) */
.hero-main-wrapper{background-image:linear-gradient(90deg,rgba(30,77,122,.97) 0%,rgba(30,77,122,.9) 28%,rgba(30,77,122,.5) 50%,rgba(30,77,122,0) 72%),linear-gradient(0deg,rgba(30,77,122,.55) 0%,rgba(30,77,122,0) 30%) !important}
@media (max-width:767px){
  .hero-main-wrapper{background-image:linear-gradient(180deg,rgba(30,77,122,.25) 0%,rgba(30,77,122,.55) 35%,rgba(30,77,122,.92) 62%,#1E4D7A 100%) !important}
}
/* newsletter: show typed email and consent text as written (Webflow base capitalized them) */
form[data-gi-form] input,form[data-gi-form] input::placeholder,form[data-gi-form] label,form[data-gi-form] .w-form-label,form[data-gi-form] span{text-transform:none !important}
/* Phones: hero photo/video sits at the top and fades into lake blue; text below (Oct 2026) */
@media (max-width:767px){
  .section.hero_section{background:#1E4D7A !important}
  .hero-slider-wrapper{height:480px !important;bottom:auto !important;top:0 !important}
  .hero-slider-wrapper .splide,.hero-slider-wrapper .splide__track,.hero-slider-wrapper .splide__list,.hero-slider-wrapper .splide__slide{height:480px !important}
  .hero-slider-wrapper .slider-image,.hero-slider-wrapper video{min-width:0 !important;max-width:100% !important;height:480px !important;width:100% !important;object-fit:cover !important;object-position:68% 18% !important}
  .hero-slider-wrapper .video-mask{height:480px !important;width:100% !important;overflow:hidden !important}
  .hero-main-wrapper{padding-top:330px !important;background-image:linear-gradient(180deg,rgba(30,77,122,0) 0px,rgba(30,77,122,.15) 200px,rgba(30,77,122,.85) 380px,#1E4D7A 480px,#1E4D7A 100%) !important}
  .hero-image{display:none !important}
}
/* "THE GRIT FACTOR" book title: solid lake blue instead of photo-filled letters (pale patches made letters disappear) */
.buy-main-title{background:none !important;-webkit-background-clip:border-box !important;background-clip:border-box !important;-webkit-text-fill-color:#1E4D7A !important;color:#1E4D7A !important;font-size:clamp(3rem,13vw,12.4375rem) !important;letter-spacing:-.04em !important}
.button-group .gi-org-link{align-self:center;margin-left:1rem;font-weight:500;text-decoration:underline;text-underline-offset:4px;color:inherit}
/* About hero: smaller photo that fades into lake blue (Oct 2026) */
.section.about-hero_section{height:auto !important;min-height:0 !important;background-color:#1E4D7A !important;background-repeat:no-repeat !important}
.about-hero-main-wrapper{height:auto !important;min-height:0 !important;padding-bottom:2rem !important;background:none !important}
.about-hero_section .about-hero-title *{color:#fff}
@media (min-width:768px){
  .section.about-hero_section{background-image:linear-gradient(90deg,#1E4D7A 0%,#1E4D7A 40%,rgba(30,77,122,.7) 52%,rgba(30,77,122,0) 66%),linear-gradient(0deg,#1E4D7A 0%,rgba(30,77,122,0) 22%),url("assets/cdn.prod.website-files.com/692709e75138a09dc8a4f247/69417c18274b62574c609311_about%20hero%20bg.webp") !important;background-size:auto,auto,auto 100% !important;background-position:0 0,0 0,right -260px center !important}
  .about-hero-main-wrapper{padding-top:9rem !important}
}
@media (max-width:767px){
  .section.about-hero_section{background-image:linear-gradient(180deg,rgba(30,77,122,0) 0px,rgba(30,77,122,0) 250px,rgba(30,77,122,.9) 370px,#1E4D7A 404px),url("assets/cdn.prod.website-files.com/692709e75138a09dc8a4f247/69417c18274b62574c609311_about%20hero%20bg.webp") !important;background-size:auto,auto 340px !important;background-position:0 0,54% 64px !important}
  .about-hero-main-wrapper{padding-top:260px !important}
  .about-hero_section .hero-image{display:none !important}
}
/* Type: ALL CAPS only for short labels. Sentences styled as eyebrows read in sentence case (Oct 2026) */
.gi-sentence{text-transform:none !important;letter-spacing:0 !important;font-weight:500 !important;line-height:1.5 !important}
/* Speaking: speaker reel is clear and full-width; videos play inline (Oct 2026) */
#reel{scroll-margin-top:110px}
.gi-reel-eyebrow{font-family:'DM Sans',sans-serif;font-size:.8rem;font-weight:600;letter-spacing:.18em;text-transform:uppercase;color:#dc4d2f;margin:0 0 .75rem}
.huffman-main-wrapper{display:flex !important;flex-direction:column !important;gap:2rem !important}
.huffman-video-wrapper{width:100% !important;max-width:1000px !important;margin:0 auto !important;opacity:1 !important;transform:none !important}
.huffman-video-wrapper .w-video{position:relative !important;width:100% !important;padding-top:56.25% !important;height:0 !important;border-radius:6px;overflow:hidden;box-shadow:0 18px 50px rgba(17,45,74,.28);background:#112D4A}
.huffman-video-wrapper .gi-yt{position:absolute !important;inset:0 !important;width:100% !important;height:100% !important;border:0 !important}
/* Speaking hero: smaller photo on the right, fading into lake blue */
@media (min-width:768px){
  .section.speaking-hero_section{background-color:#1E4D7A !important;background-image:linear-gradient(90deg,#1E4D7A 0%,#1E4D7A 40%,rgba(30,77,122,.7) 52%,rgba(30,77,122,0) 66%),linear-gradient(0deg,#1E4D7A 0%,rgba(30,77,122,0) 22%),url("assets/cdn.prod.website-files.com/692709e75138a09dc8a4f247/69426d06b6ad13103ab5ff36_speaking.webp") !important;background-size:auto,auto,auto 100% !important;background-position:0 0,0 0,right -120px center !important;background-repeat:no-repeat !important}
}
@media (max-width:767px){
  .section.speaking-hero_section{height:auto !important;min-height:0 !important;background-color:#1E4D7A !important;background-image:linear-gradient(180deg,rgba(30,77,122,0) 0px,rgba(30,77,122,0) 250px,rgba(30,77,122,.9) 370px,#1E4D7A 404px),url("assets/cdn.prod.website-files.com/692709e75138a09dc8a4f247/69426d06b6ad13103ab5ff36_speaking.webp") !important;background-size:auto,auto 340px !important;background-position:0 0,62% 64px !important;background-repeat:no-repeat !important}
  .speaking-hero_section .hero-image{display:none !important}
}
.section.speaking-hero_section{height:auto !important;min-height:0 !important}
/* Contact: lake blue with faint topographic lines; form on a cream card; portrait for trust (Oct 2026) */
.contact_section .factor-image{display:none !important}
.section.contact_section{background-color:#1E4D7A !important;background-image:url("assets/topo-lines.svg"),linear-gradient(160deg,#245a8c 0%,#1E4D7A 45%,#173f66 100%) !important;background-size:1600px auto,cover !important;background-position:center top,0 0 !important;background-repeat:no-repeat,no-repeat !important;position:relative}
.section.contact_section::before{content:"";position:absolute;inset:0;background:url("assets/topo-lines.svg") center top/1600px auto no-repeat;opacity:0;pointer-events:none}
.section.contact_section{background-blend-mode:soft-light,normal}
.contact_section .contact_grid-item:last-child,.contact_section form.contact-form,.contact_section .w-form{border-radius:8px}
.contact_section .w-form{background:#FBF7F1 !important;padding:2rem 2rem 1.75rem !important;box-shadow:0 24px 60px rgba(10,30,50,.35) !important}
.contact_section .w-form label,.contact_section .w-form .field-label,.contact_section .w-form .w-checkbox-label,.contact_section .w-form .checkbox-label,.contact_section .w-form p,.contact_section .w-form span{color:#1C1410 !important}
.contact_section .w-form .field-style,.contact_section .w-form input[type=text],.contact_section .w-form input[type=email],.contact_section .w-form textarea,.contact_section .w-form select{background-color:#fff !important;color:#1C1410 !important;border:1px solid rgba(30,77,122,.25) !important;border-radius:4px !important}
.contact_section .w-form .field-style::placeholder,.contact_section .w-form textarea::placeholder{color:#7A6D62 !important}
.contact_section .w-form .field-style:focus{border-color:#1E4D7A !important;box-shadow:0 0 0 3px rgba(30,77,122,.15) !important;outline:none}
.contact_section .w-form select.field-style{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%231E4D7A' stroke-width='1.6' fill='none'/%3E%3C/svg%3E") !important;background-repeat:no-repeat !important;background-position:right 14px center !important}
.contact_section .w-form-done{background:#FBF7F1 !important;color:#1C1410 !important}
.gi-contact-portrait{display:flex;align-items:center;gap:1rem;margin:2rem 0 1.75rem;padding:0}
.gi-contact-portrait img{width:96px;height:96px;border-radius:50%;object-fit:cover;object-position:50% 20%;border:3px solid rgba(251,247,241,.85);box-shadow:0 8px 24px rgba(0,0,0,.25)}
.gi-contact-portrait figcaption{display:flex;flex-direction:column;gap:.2rem;color:#fff;font-family:'DM Sans',sans-serif;font-size:.95rem;line-height:1.35}
.gi-contact-portrait figcaption strong{font-family:Geist,sans-serif;font-size:1.05rem;font-weight:600}
.gi-contact-portrait figcaption span{color:rgba(255,255,255,.78)}
@media (max-width:767px){.contact_section .w-form{padding:1.5rem 1.25rem !important}}
.gi-contact-portrait figcaption{text-align:left !important;align-items:flex-start}
/* Nav: clean, aligned chevrons on dropdowns (Oct 2026) */
.nav-dropdown-toggle{display:inline-flex !important;align-items:center !important;gap:.4rem !important;padding-right:12px !important}
.nav-dropdown-toggle .dropdown-icon{position:static !important;inset:auto !important;margin:0 !important;width:7px !important;height:7px !important;font-size:0 !important;border-right:1.6px solid currentColor;border-bottom:1.6px solid currentColor;transform:translateY(-2px) rotate(45deg);transition:transform .2s ease;opacity:.85}
.nav-dropdown-toggle .dropdown-icon::before{content:none !important}
.nav-dropdown:hover .dropdown-icon,.nav-dropdown-toggle.w--open .dropdown-icon{transform:translateY(1px) rotate(-135deg)}
/* only the page you're on is underlined */
.nav_link.w--current:not(.gi-current)::after,.nav_link.w--current:not(.gi-current)::before{display:none !important}
/* Any remaining plaster-texture sections (e.g. 404): same lake-blue topographic background */
.factor-image{display:none !important}
section:has(.factor-image){background-color:#1E4D7A !important;background-image:url("assets/topo-lines.svg"),linear-gradient(160deg,#245a8c 0%,#1E4D7A 45%,#173f66 100%) !important;background-size:1600px auto,cover !important;background-position:center top,0 0 !important;background-repeat:no-repeat !important;background-blend-mode:soft-light,normal}
/* Podcast: "All episodes" links replace the non-working season filter */
.gi-pod-links{display:flex;flex-wrap:wrap;align-items:center;gap:.6rem;font-family:'DM Sans',sans-serif;font-size:.95rem;color:#fff}
.gi-pod-links span{opacity:.85}
.gi-pod-links a{display:inline-block;padding:.45rem .9rem;border:1px solid rgba(255,255,255,.55);border-radius:4px;color:#fff;text-decoration:none;font-weight:600}
.gi-pod-links a:hover{background:#fff;color:#1E4D7A}
/* Podcast player bar stays tucked away until an episode is played */
.section.podcast-player{transform:translateY(110%);transition:transform .35s ease}
body.gi-player-on .section.podcast-player{transform:none}
