/* ============================================================
   GenCom Cinematic v2 — Apple-grade polish
   1) Frosted-glass header once the page scrolls
   2) Image "zoom-settle" initial state (JS animates to rest)
   3) Cinematic pacing: extra breathing room on large screens
   Loads AFTER gencom-2026-skin.css.
   ============================================================ */

/* ---------- 1. Frosted-glass header (html.gc-scrolled set by JS) ---------- */
@supports ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
  html.gc-scrolled .site-header .main-bar,
  html.gc-scrolled .site-header .main-bar > .container,
  html.gc-scrolled .site-header .header-nav{
    background:rgba(255,255,255,.74) !important;
    background-image:none !important;
  }
  html.gc-scrolled .site-header .main-bar{
    -webkit-backdrop-filter:saturate(180%) blur(18px);
    backdrop-filter:saturate(180%) blur(18px);
    box-shadow:0 1px 0 rgba(22,32,43,.06), 0 12px 34px -20px rgba(22,32,43,.28);
    transition:background .35s ease, box-shadow .35s ease;
  }
}

/* ---------- 2. Image zoom-settle ---------- */
[data-cine="imgsettle"]{
  overflow:hidden;
  display:block;
}
[data-cine="imgsettle"] > img{
  transform:scale(1.10);
  will-change:transform;
}
/* fallback when JS/GSAP missing or reduced motion */
.no-cine [data-cine="imgsettle"] > img{ transform:none }
@media (prefers-reduced-motion: reduce){
  [data-cine="imgsettle"] > img{ transform:none !important }
}

/* ---------- 3. Cinematic pacing (large screens only) ---------- */
@media (min-width:1200px){
  .section-full.content-inner{ padding-top:clamp(80px,10vh,120px); padding-bottom:clamp(80px,10vh,120px); }
  .section-full.content-inner-2{ padding-top:clamp(70px,9vh,105px); padding-bottom:clamp(70px,9vh,105px); }
  .section-head{ margin-bottom:44px; }
}

/* ---------- 4. Wider headline presence on desktop ---------- */
@media (min-width:1200px){
  h2.title{ letter-spacing:-0.02em; }
}

/* ---------- 5. Lenis html hooks (recommended by the library) ---------- */
html.lenis, html.lenis body{ height:auto; }
.lenis.lenis-smooth{ scroll-behavior:auto !important; }
.lenis.lenis-smooth [data-lenis-prevent]{ overscroll-behavior:contain; }
.lenis.lenis-stopped{ overflow:hidden; }
