/* =========================================================================
   Germ Crazy — main stylesheet
   ====================================================================== */

:root{
  --gc-bg:#0a0710;
  --gc-bg-2:#120a18;
  --gc-panel:#170e20;
  --gc-line:rgba(255,255,255,.10);
  --gc-green:#7CE23F;
  --gc-pink:#F2A8BE;
  --gc-pink-hot:#E8558A;
  --gc-red:#D8232A;
  --gc-cyan:#5FD8F5;
  --gc-text:#EFE6F2;
  --gc-muted:#A294AE;
}

body.gc-theme{
  background:var(--gc-bg);
  color:var(--gc-text);
  overflow-x:hidden;
}

/* -------------------------------------------------------------------------
   WORDPRESS LAYOUT OVERRIDES

   WP wraps constrained groups in `:where(.is-layout-constrained) > *` rules
   that clamp children to contentSize and force auto margins. Those selectors
   have ZERO specificity but still win against plain class selectors by source
   order. Anything that must break out of the container needs !important.
   ---------------------------------------------------------------------- */

.gc-hero,
.gc-banner,
.gc-full{
  width:100vw!important;
  max-width:100vw!important;
  left:50%!important;
  margin-left:-50vw!important;
  margin-right:0!important;
  position:relative!important;
}

/* Don't let WP clamp internal children of our custom blocks.

   WP emits  :where(.is-layout-constrained) > *  { max-width: <contentSize>;
   margin-left:auto; margin-right:auto }  — zero specificity, but it still
   beats a plain class by source order. On the video player that auto-margin
   is what shunts the centred play button to one side, so every element that
   must fill its parent has to opt out explicitly. */
.gc-hero-video,
.gc-hero-scrim,
.gc-hero-fallback,
.gc-banner-bg,
.gc-player,
.gc-player > *,
.gc-facade,
.gc-facade img,
.gc-play,
.gc-card-thumb,
.gc-card-thumb > *,
.gc-card-play{
  max-width:none!important;
  margin-left:0!important;
  margin-right:0!important;
}

/* =========================================================================
   HEADER
   ====================================================================== */

.gc-header{
  position:fixed;top:0;left:0;right:0;z-index:100;
  padding:12px 0;
  background:linear-gradient(180deg,rgba(10,7,16,.90) 0%,rgba(10,7,16,0) 100%);
  transition:background .3s ease,padding .3s ease;
}
.gc-header.is-stuck{
  background:rgba(10,7,16,.94);
  backdrop-filter:blur(14px) saturate(140%);
  border-bottom:1px solid var(--gc-line);
  padding:6px 0;
}
.gc-header-inner{
  max-width:1440px;margin:0 auto;padding:0 24px;
  display:flex;align-items:center;justify-content:space-between;gap:24px;
}
.gc-brand img{
  height:72px;width:auto;
  filter:drop-shadow(0 4px 16px rgba(0,0,0,.7));
  transition:height .3s ease;
}
.gc-header.is-stuck .gc-brand img{height:52px}

/* ---- WP default menu (wp_nav_menu) ---- */
.gc-nav{display:flex;align-items:center}
.gc-nav ul{
  list-style:none;margin:0;padding:0;
  display:flex;align-items:center;gap:2px;
}
.gc-nav li{position:relative}
.gc-nav a{
  display:block;
  font-family:'Bai Jamjuree',sans-serif;
  font-size:13px;font-weight:600;
  letter-spacing:.06em;text-transform:uppercase;
  color:var(--gc-text);text-decoration:none;
  padding:10px 13px;border-radius:6px;
  transition:color .18s ease,background .18s ease;
}
.gc-nav a:hover,
.gc-nav .current-menu-item > a,
.gc-nav .current_page_item > a{
  color:var(--gc-green);
  background:rgba(124,226,63,.08);
}

/* Submenus */
.gc-nav .sub-menu{
  position:absolute;top:100%;left:0;z-index:110;
  display:block;flex-direction:column;gap:0;
  min-width:210px;padding:8px;
  background:rgba(14,9,20,.98);
  backdrop-filter:blur(14px);
  border:1px solid var(--gc-line);
  border-radius:10px;
  box-shadow:0 20px 50px rgba(0,0,0,.6);
  opacity:0;visibility:hidden;transform:translateY(6px);
  transition:opacity .2s ease,transform .2s ease,visibility .2s;
}
.gc-nav li:hover > .sub-menu,
.gc-nav li:focus-within > .sub-menu{
  opacity:1;visibility:visible;transform:translateY(0);
}
/* Transparent bridge — stops the submenu closing as the cursor crosses the gap. */
.gc-nav .menu-item-has-children::after{
  content:"";position:absolute;top:100%;left:0;
  width:100%;height:12px;
}
.gc-nav .sub-menu a{
  padding:9px 12px;font-size:12px;letter-spacing:.04em;
  white-space:nowrap;
}
.gc-nav .sub-menu .sub-menu{top:0;left:100%;margin-left:4px}

/* "Button" menu item — add the CSS class `gc-cta` in Appearance > Menus */
.gc-nav .gc-cta > a,
.gc-nav a.gc-cta{
  font-family:'Bai Jamjuree',sans-serif;font-weight:700;
  padding:11px 22px;border-radius:999px;
  background:var(--gc-green);color:#0a0710;
  transition:transform .18s ease,box-shadow .28s ease;
}
.gc-nav .gc-cta > a:hover,
.gc-nav a.gc-cta:hover{
  background:var(--gc-green);color:#0a0710;
  transform:translateY(-2px);
  box-shadow:0 8px 26px rgba(124,226,63,.35);
}

.gc-burger{
  display:none;background:none;border:0;
  color:var(--gc-text);font-size:26px;
  cursor:pointer;padding:6px 10px;line-height:1;
}

/* =========================================================================
   HERO
   ====================================================================== */

.gc-hero{
  min-height:100svh;
  display:flex;align-items:center;justify-content:center;
  overflow:hidden;
  background:#0a0710;
}
.gc-hero-video{
  position:absolute;top:50%;left:50%;
  width:100vw;height:56.25vw;              /* cover by width  */
  min-height:100svh;min-width:177.78svh;   /* cover by height */
  transform:translate(-50%,-50%);
  border:0;pointer-events:none;
  object-fit:cover;
  z-index:0;
}
.gc-hero-fallback{display:none}
.gc-hero-scrim{
  position:absolute;inset:0;z-index:1;
  background:
    radial-gradient(120% 90% at 50% 55%,
      rgba(10,7,16,0) 0%,
      rgba(10,7,16,calc(var(--gc-scrim,.55) * .9)) 62%,
      rgba(10,7,16,.92) 100%),
    linear-gradient(180deg,
      rgba(10,7,16,.70) 0%,
      rgba(10,7,16,.15) 35%,
      rgba(10,7,16,.55) 78%,
      var(--gc-bg) 100%);
}
.gc-hero-inner{
  position:relative;z-index:2;
  text-align:center;
  padding:150px 24px 120px;
  max-width:980px;
}
.gc-hero-logo{
  width:min(680px,86vw);
  margin:0 auto 26px;
  filter:drop-shadow(0 20px 60px rgba(0,0,0,.8)) drop-shadow(0 0 40px rgba(124,226,63,.20));
  animation:gcFloat 7s ease-in-out infinite;
}
@keyframes gcFloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-10px)}}

.gc-hero-tag{
  font-family:'Bai Jamjuree',sans-serif;font-weight:600;
  font-size:clamp(15px,2vw,20px);
  letter-spacing:.42em;text-transform:uppercase;
  color:var(--gc-pink);
  text-shadow:0 2px 20px rgba(0,0,0,.9);
  margin:0 0 18px;
}
.gc-hero-sub{
  font-size:clamp(16px,1.5vw,19px);
  color:#DCD2E2;
  max-width:620px;margin:0 auto 38px;
  text-shadow:0 2px 16px rgba(0,0,0,.9);
}
.gc-hero-actions{
  display:flex;gap:14px;justify-content:center;flex-wrap:wrap;
}

.gc-scroll-hint{
  position:absolute;bottom:26px;left:50%;
  transform:translateX(-50%);z-index:2;
  font-size:11px;letter-spacing:.3em;text-transform:uppercase;
  color:var(--gc-muted);
  display:flex;flex-direction:column;align-items:center;gap:8px;
}
.gc-scroll-hint span{
  width:1px;height:38px;
  background:linear-gradient(180deg,var(--gc-green),transparent);
  animation:gcPulse 2s ease-in-out infinite;
}
@keyframes gcPulse{0%,100%{opacity:.3}50%{opacity:1}}

/* =========================================================================
   BUTTONS
   ====================================================================== */

.gc-btn,
.gc-theme .wp-block-button__link{
  display:inline-block;
  font-family:'Bai Jamjuree',sans-serif;
  font-weight:700;font-size:14px;
  letter-spacing:.08em;text-transform:uppercase;
  padding:15px 32px;border-radius:999px;
  border:2px solid transparent;
  text-decoration:none;cursor:pointer;
  transition:transform .18s ease,box-shadow .28s ease,
             background .2s ease,color .2s ease,border-color .2s ease;
}
.gc-btn-primary,
.gc-theme .is-style-gc-primary .wp-block-button__link{
  background:var(--gc-green);color:#0a0710;
}
.gc-btn-primary:hover,
.gc-theme .is-style-gc-primary .wp-block-button__link:hover{
  color:#0a0710;
  transform:translateY(-2px);
  box-shadow:0 10px 34px rgba(124,226,63,.4);
}
.gc-btn-ghost,
.gc-theme .is-style-gc-ghost .wp-block-button__link{
  background:rgba(255,255,255,.06);
  border-color:rgba(255,255,255,.28);
  color:#fff;
  backdrop-filter:blur(8px);
}
.gc-btn-ghost:hover,
.gc-theme .is-style-gc-ghost .wp-block-button__link:hover{
  background:rgba(242,168,190,.16);
  border-color:var(--gc-pink);
  color:var(--gc-pink);
  transform:translateY(-2px);
}

/* =========================================================================
   SECTION FURNITURE (pattern helper classes)
   ====================================================================== */

.gc-eyebrow{
  font-family:'Bai Jamjuree',sans-serif;font-weight:600;
  font-size:12px!important;
  letter-spacing:.32em;text-transform:uppercase;
  color:var(--gc-green)!important;
  display:flex;align-items:center;gap:10px;
  margin:0 0 16px!important;
}
.gc-eyebrow::before{
  content:"";width:26px;height:2px;
  background:var(--gc-green);border-radius:2px;
  flex:0 0 auto;
}
.has-text-align-center.gc-eyebrow{justify-content:center}
.has-text-align-center.gc-eyebrow::after{
  content:"";width:26px;height:2px;
  background:var(--gc-green);border-radius:2px;
  flex:0 0 auto;
}

.gc-title{
  font-size:clamp(30px,4vw,48px)!important;
  margin:0 0 18px!important;
}
.gc-title em,
.gc-title strong{
  font-style:normal;font-weight:inherit;
  color:var(--gc-pink-hot);
}
.gc-sub{color:var(--gc-muted)!important;font-size:17px}

.gc-lead{color:var(--gc-muted);font-size:17px}
.gc-lead strong{color:var(--gc-text);font-weight:600}

/* Stat chips */
.gc-stat{
  padding:20px 18px;border-radius:12px;
  background:var(--gc-panel);
  border:1px solid var(--gc-line);
  text-align:left;
}
.gc-stat .gc-stat-num{
  font-family:'Bai Jamjuree',sans-serif;font-weight:700;
  font-size:26px;color:var(--gc-green);
  line-height:1.2;margin:0;
}
.gc-stat .gc-stat-lbl{
  font-size:12px;letter-spacing:.1em;text-transform:uppercase;
  color:var(--gc-muted);margin:0;
}

/* Pillar cards */
.gc-pillar{
  padding:34px 28px!important;
  border-radius:16px!important;
  background:var(--gc-panel)!important;
  border:1px solid var(--gc-line)!important;
  position:relative;overflow:hidden;
  transition:transform .28s ease,border-color .28s ease,box-shadow .28s ease;
}
.gc-pillar:hover{
  transform:translateY(-6px);
  border-color:rgba(124,226,63,.45)!important;
  box-shadow:0 20px 50px rgba(0,0,0,.5);
}
.gc-pillar h3{font-size:20px!important;margin:0 0 10px!important}
.gc-pillar p{color:var(--gc-muted)!important;font-size:15px;margin:0}
.gc-pillar-ico{
  width:46px;height:46px;border-radius:10px;
  display:flex;align-items:center;justify-content:center;
  margin-bottom:20px;
  background:rgba(124,226,63,.12);
  border:1px solid rgba(124,226,63,.32);
  font-size:20px;line-height:1;
}

/* Media frame */
.gc-frame img{
  border-radius:16px;
  border:1px solid var(--gc-line);
  box-shadow:0 30px 80px rgba(0,0,0,.55);
  width:100%;
}

/* =========================================================================
   GALLERY
   ====================================================================== */

.gc-gallery.wp-block-gallery{gap:16px!important}
/* Vary tile heights so a long gallery doesn't read as a rigid grid. */
.gc-gallery figure.wp-block-image:nth-child(6n+1){min-height:300px}
.gc-gallery figure.wp-block-image:nth-child(6n+4){min-height:300px}
.gc-gallery figure.wp-block-image{
  border-radius:14px;overflow:hidden;
  border:1px solid var(--gc-line);
  background:var(--gc-panel);
  position:relative;
}
.gc-gallery figure.wp-block-image img{
  width:100%;height:100%;object-fit:cover;
  transition:transform .6s cubic-bezier(.2,.8,.2,1);
}
.gc-gallery figure.wp-block-image:hover img{transform:scale(1.06)}
.gc-gallery figure.wp-block-image figcaption{
  position:absolute;left:0;right:0;bottom:0;
  margin:0;padding:26px 16px 12px;
  font-family:'Bai Jamjuree',sans-serif;font-weight:600;
  font-size:12px;letter-spacing:.14em;text-transform:uppercase;
  color:#fff;text-align:left;
  background:linear-gradient(180deg,transparent,rgba(10,7,16,.85));
}

/* =========================================================================
   BANNER
   ====================================================================== */

.gc-banner{
  padding:100px 24px!important;
  text-align:center;
  overflow:hidden;
  border-top:1px solid var(--gc-line);
  border-bottom:1px solid var(--gc-line);
}
.gc-banner > .wp-block-cover__image-background{opacity:.28!important}
.gc-banner .wp-block-cover__background{
  background:linear-gradient(180deg,rgba(10,7,16,.86),rgba(18,10,24,.94))!important;
  opacity:1!important;
}
.gc-banner h2{font-size:clamp(28px,3.4vw,42px)!important;margin:0 0 14px!important}
.gc-banner p{color:var(--gc-muted)!important;max-width:560px;margin:0 auto 30px!important}

/* =========================================================================
   FOOTER
   ====================================================================== */

.gc-footer{
  padding:70px 0 34px;
  background:var(--gc-bg);
}
.gc-footer-logo img{width:210px;margin-bottom:18px}
.gc-footer h4,
.gc-footer .gc-foot-head{
  font-family:'Bai Jamjuree',sans-serif;
  font-size:12px!important;letter-spacing:.2em;text-transform:uppercase;
  color:var(--gc-green)!important;
  margin:0 0 16px!important;
}
.gc-footer p{color:var(--gc-muted);font-size:14px}

/* Footer menu (wp_nav_menu) */
.gc-footer-menu ul{list-style:none;margin:0;padding:0}
.gc-footer-menu li{margin:0}
.gc-footer-menu a{
  display:block;
  color:var(--gc-muted);font-size:14px;text-decoration:none;
  padding:5px 0;
  transition:color .18s ease;
}
.gc-footer-menu a:hover{color:var(--gc-pink)}
.gc-footer-menu .sub-menu{display:none} /* keep footer flat */

/* Socials */
.gc-socials{display:flex;gap:10px;margin-top:20px;flex-wrap:wrap}
.gc-socials .wp-social-link,
.gc-socials a{
  width:40px;height:40px;border-radius:10px;
  display:flex;align-items:center;justify-content:center;
  background:var(--gc-panel)!important;
  border:1px solid var(--gc-line);
  color:var(--gc-muted)!important;
  transition:border-color .2s ease,transform .2s ease,background .2s ease;
}
.gc-socials .wp-social-link:hover,
.gc-socials a:hover{
  border-color:var(--gc-green);
  transform:translateY(-3px);
  background:rgba(124,226,63,.1)!important;
  color:var(--gc-green)!important;
}
.gc-socials svg{width:18px;height:18px;fill:currentColor}

.gc-footer-bar{
  border-top:1px solid var(--gc-line);
  padding-top:24px;margin-top:48px;
  font-size:13px;color:var(--gc-muted);
}
.gc-footer-bar p{margin:0;font-size:13px}

/* =========================================================================
   RESPONSIVE
   ====================================================================== */

@media(max-width:900px){
  .gc-burger{display:block}

  .gc-nav{
    display:none;
    position:absolute;top:100%;left:0;right:0;
    background:rgba(10,7,16,.98);
    backdrop-filter:blur(16px);
    border-top:1px solid var(--gc-line);
    border-bottom:1px solid var(--gc-line);
    padding:10px 16px 18px;
  }
  .gc-nav.is-open{display:block}
  .gc-nav ul{flex-direction:column;align-items:stretch;gap:0;width:100%}
  .gc-nav a{
    padding:14px 8px;
    border-bottom:1px solid rgba(255,255,255,.05);
  }
  /* Submenus inline on mobile — no hover to rely on. */
  .gc-nav .sub-menu{
    position:static;
    opacity:1;visibility:visible;transform:none;
    background:transparent;border:0;box-shadow:none;
    padding:0 0 0 16px;min-width:0;
  }
  .gc-nav .menu-item-has-children::after{display:none}
  .gc-nav .gc-cta > a,
  .gc-nav a.gc-cta{
    margin-top:12px;text-align:center;border-bottom:0;
  }

  .gc-brand img{height:48px}
  .gc-header.is-stuck .gc-brand img{height:42px}

  /* Mobile: kill the iframe/video, show the still.
     Mobile browsers throttle autoplay, so the embed is dead weight. */
  .gc-hero-video{display:none!important}
  .gc-hero-fallback{
    display:block!important;
    position:absolute;inset:0;z-index:0;
    width:100%;height:100%;object-fit:cover;
  }
  .gc-hero{min-height:88svh}
  .gc-hero-inner{padding:120px 20px 90px}
  .gc-hero-actions .gc-btn{width:100%;max-width:320px}

  .gc-banner{padding:72px 20px!important}
}

/* =========================================================================
   LIGHTBOX
   ====================================================================== */

.gc-lb{
  position:fixed;inset:0;z-index:9999;
  display:none;align-items:center;justify-content:center;
  padding:40px;
  background:rgba(6,4,10,.94);
  backdrop-filter:blur(8px);
  cursor:zoom-out;
}
.gc-lb.is-open{display:flex}
.gc-lb img{
  max-width:min(1400px,94vw);
  max-height:88vh;width:auto;
  border-radius:10px;
  box-shadow:0 40px 100px rgba(0,0,0,.7);
}
.gc-lb-cap{
  position:absolute;bottom:22px;left:0;right:0;
  text-align:center;
  font-size:12px;letter-spacing:.18em;text-transform:uppercase;
  color:var(--gc-muted);
}

/* =========================================================================
   VIDEO SHOWCASE
   ====================================================================== */

/* ---- Page head (reusable intro band) ---- */
.gc-page-head{
  position:relative;
  padding:170px 0 70px!important;
  text-align:center;
  overflow:hidden;
  border-bottom:1px solid var(--gc-line);
  background:
    radial-gradient(90% 120% at 50% 0%,rgba(124,226,63,.10),transparent 60%),
    linear-gradient(180deg,var(--gc-bg-2),var(--gc-bg));
}
.gc-page-head h1{font-size:clamp(34px,5vw,56px)!important;margin:0 0 16px!important}
.gc-page-head h1 em{font-style:normal;color:var(--gc-pink-hot)}
.gc-page-head p{color:var(--gc-muted)!important;max-width:600px;margin:0 auto!important;font-size:17px}

/* ---- Featured player ---- */
.gc-video-hero{margin:0 0 56px}
.gc-player{
  position:relative;
  aspect-ratio:16/9;
  border-radius:18px;
  overflow:hidden;
  border:1px solid var(--gc-line);
  background:#000;
  box-shadow:0 40px 100px rgba(0,0,0,.6),0 0 0 1px rgba(124,226,63,.08);
}
.gc-player iframe{width:100%;height:100%;border:0;display:block}

/* ---- Click-to-load facade ----
   The iframe is NOT rendered until the user clicks. Auto-embedding a page
   full of YouTube players pulls ~1MB of player JS each and destroys load
   time; this ships a thumbnail instead and swaps in the real player on demand. */
.gc-facade{
  position:absolute;inset:0;
  cursor:pointer;
  display:flex;align-items:center;justify-content:center;
  border:0;padding:0;background:none;
}
/* The image must NOT be a flex child — as a 100%-wide flex item it eats the
   whole row and shoves .gc-play against the right edge. Take it out of flow. */
.gc-facade img{
  position:absolute;inset:0;
  width:100%;height:100%;
  object-fit:cover;
}
.gc-facade::after{
  content:"";position:absolute;inset:0;
  background:linear-gradient(180deg,rgba(10,7,16,.25),rgba(10,7,16,.55));
  transition:background .3s ease;
}
.gc-facade:hover::after,
.gc-facade:focus-visible::after{
  background:linear-gradient(180deg,rgba(10,7,16,.10),rgba(10,7,16,.40));
}
/* Absolutely centred rather than flex-centred: WP's layout rules can add
   auto margins to flex children, which knocks the button off-centre. */
.gc-play{
  position:absolute;
  top:50%;left:50%;
  transform:translate(-50%,-50%);
  z-index:2;
  width:84px;height:84px;
  flex:0 0 auto;
  border-radius:50%;
  display:grid;place-items:center;
  background:var(--gc-green);
  box-shadow:0 12px 40px rgba(124,226,63,.45);
  transition:transform .25s cubic-bezier(.2,.8,.2,1),box-shadow .25s ease;
}
.gc-facade:hover .gc-play,
.gc-facade:focus-visible .gc-play{
  transform:translate(-50%,-50%) scale(1.10);
  box-shadow:0 16px 54px rgba(124,226,63,.6);
}
.gc-play svg{width:30px;height:30px;fill:#0a0710;margin-left:4px}

.gc-video-meta{
  display:flex;align-items:flex-start;justify-content:space-between;
  gap:24px;flex-wrap:wrap;margin-top:26px;
}
.gc-video-meta h2{font-size:clamp(22px,2.4vw,30px)!important;margin:0 0 8px!important}
.gc-video-meta p{color:var(--gc-muted)!important;max-width:640px;margin:0!important}
.gc-badge{
  flex:0 0 auto;
  font-family:'Bai Jamjuree',sans-serif;font-weight:700;
  font-size:11px;letter-spacing:.16em;text-transform:uppercase;
  padding:8px 16px;border-radius:999px;
  background:rgba(124,226,63,.12);
  border:1px solid rgba(124,226,63,.35);
  color:var(--gc-green);
}

/* ---- Filter pills ---- */
.gc-filters{
  display:flex;gap:10px;flex-wrap:wrap;
  padding:20px 0 28px;
  border-top:1px solid var(--gc-line);
}
.gc-pill{
  font-family:'Bai Jamjuree',sans-serif;font-weight:600;
  font-size:12px;letter-spacing:.1em;text-transform:uppercase;
  padding:9px 18px;border-radius:999px;
  background:var(--gc-panel);
  border:1px solid var(--gc-line);
  color:var(--gc-muted);
  cursor:pointer;
  transition:background .2s ease,border-color .2s ease,color .2s ease;
}
.gc-pill:hover{border-color:rgba(124,226,63,.4);color:var(--gc-text)}
.gc-pill.is-on{background:var(--gc-green);border-color:var(--gc-green);color:#0a0710}

/* ---- Video grid ---- */
.gc-video-grid{
  display:grid;
  grid-template-columns:repeat(var(--gc-cols,3),1fr);
  gap:26px;
}
.gc-video-card{
  border-radius:14px;
  overflow:hidden;
  background:var(--gc-panel);
  border:1px solid var(--gc-line);
  display:flex;flex-direction:column;
  transition:transform .3s cubic-bezier(.2,.8,.2,1),border-color .3s ease,box-shadow .3s ease;
}
.gc-video-card:hover{
  transform:translateY(-6px);
  border-color:rgba(124,226,63,.45);
  box-shadow:0 24px 60px rgba(0,0,0,.55);
}
.gc-video-card.is-hidden{display:none}

.gc-card-thumb{
  position:relative;
  aspect-ratio:16/9;
  overflow:hidden;
  background:#000;
  cursor:pointer;
}
.gc-card-thumb img{
  width:100%;height:100%;object-fit:cover;
  transition:transform .6s cubic-bezier(.2,.8,.2,1);
}
.gc-video-card:hover .gc-card-thumb img{transform:scale(1.07)}
.gc-card-thumb iframe{width:100%;height:100%;border:0;display:block}
.gc-card-scrim{
  position:absolute;inset:0;
  background:linear-gradient(180deg,rgba(10,7,16,.15),rgba(10,7,16,.5));
  transition:background .3s ease;
}
.gc-video-card:hover .gc-card-scrim{
  background:linear-gradient(180deg,rgba(10,7,16,.05),rgba(10,7,16,.35));
}
.gc-card-play{
  position:absolute;top:50%;left:50%;
  transform:translate(-50%,-50%);
  width:54px;height:54px;border-radius:50%;
  display:grid;place-items:center;
  background:rgba(124,226,63,.94);
  box-shadow:0 8px 26px rgba(0,0,0,.5);
  transition:transform .25s cubic-bezier(.2,.8,.2,1);
  z-index:2;
}
.gc-video-card:hover .gc-card-play{transform:translate(-50%,-50%) scale(1.12)}
.gc-card-play svg{width:20px;height:20px;fill:#0a0710;margin-left:3px}

/* Cards use .gc-card-launch (not .gc-facade) — they hand off to the big
   player rather than embedding, so they never inherit the facade rules. */

.gc-card-body{padding:20px;flex:1;display:flex;flex-direction:column}
.gc-card-tag{
  font-family:'Bai Jamjuree',sans-serif;font-weight:600;
  font-size:10px!important;letter-spacing:.16em;text-transform:uppercase;
  color:var(--gc-green)!important;margin:0 0 9px!important;
}
.gc-card-body h3{font-size:17px!important;margin:0 0 8px!important;line-height:1.3}
.gc-card-desc{
  color:var(--gc-muted)!important;font-size:14px;
  margin:0 0 14px!important;flex:1;
}
.gc-card-link{
  font-family:'Bai Jamjuree',sans-serif;font-weight:600;
  font-size:11px;letter-spacing:.12em;text-transform:uppercase;
  color:var(--gc-muted)!important;
  display:inline-flex;align-items:center;gap:6px;
  text-decoration:none;
  transition:color .2s ease,gap .2s ease;
}
.gc-video-card:hover .gc-card-link{color:var(--gc-green)!important;gap:10px}

@media(max-width:1024px){
  .gc-video-grid{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:900px){
  .gc-page-head{padding:130px 0 56px!important}
  .gc-video-grid{grid-template-columns:1fr}
  .gc-play{width:64px;height:64px}
  .gc-play svg{width:24px;height:24px}
}

/* =========================================================================
   VIDEO SHOWCASE — play-in-featured behaviour
   ====================================================================== */

/* The header is fixed, so scrollIntoView would tuck the player under it.
   scroll-margin-top pushes the scroll stop down by the header height. */
.gc-video-hero{scroll-margin-top:110px}

/* Cards no longer embed inline — they launch the big player. */
.gc-card-launch{cursor:pointer}
.gc-card-launch:focus-visible{
  outline:2px solid var(--gc-green);
  outline-offset:3px;
}

/* Currently-playing card */
.gc-video-card.is-playing{
  border-color:var(--gc-green)!important;
  box-shadow:0 0 0 1px var(--gc-green),0 20px 50px rgba(0,0,0,.5);
}
.gc-video-card.is-playing .gc-card-play{
  background:var(--gc-white);
}
.gc-video-card.is-playing .gc-card-tag::after{
  content:" · Now playing";
  color:var(--gc-muted);
}

/* Back-to-featured control */
.gc-featured-reset{
  margin-top:18px;
  font-family:'Bai Jamjuree',sans-serif;font-weight:600;
  font-size:12px;letter-spacing:.1em;text-transform:uppercase;
  padding:10px 20px;border-radius:999px;
  background:transparent;
  border:1px solid var(--gc-line);
  color:var(--gc-muted);
  cursor:pointer;
  transition:border-color .2s ease,color .2s ease,background .2s ease;
}
.gc-featured-reset:hover{
  border-color:var(--gc-green);
  color:var(--gc-green);
  background:rgba(124,226,63,.08);
}
.gc-featured-reset[hidden]{display:none}

/* Meta text can be empty on first paint — don't collapse the layout. */
.gc-featured-title:empty,
.gc-featured-desc:empty{display:none}
.gc-badge[hidden]{display:none}