@charset "UTF-8";

/* =========================================================
   Shared site-nav + page resets for donkwkm-themed pages.
   Loaded whenever any [donkwkm_*] shortcode is present.
   Targets `body.donkwkm-page` (added by body_class filter).
   ========================================================= */

/* --- Hide WP template parts on donkwkm pages ---
   The FSE header template-part block is removed entirely in PHP
   (see donkwkm render_block filter), so no `header.wp-block-template-part`
   rule is needed here. These rules hide the page title + featured image
   that WP still emits above the shortcode output. */
body.donkwkm-page .wp-block-post-title { display: none; }
body.donkwkm-page .entry-header { display: none; }
body.donkwkm-page .wp-block-post-featured-image { display: none; }

/* --- Page background + content reset ---
   twentytwentyfive wraps post content in multiple layers of
   has-global-padding / is-layout-constrained which center the
   shortcode output in a narrow column, and applies the side
   gutters through CSS custom properties --wp--style--root--padding-*.
   Zero those variables so nothing downstream adds horizontal space,
   then strip every wrapper's padding/margin/max-width directly. */
body.donkwkm-page {
  background: #07091a;
  --wp--style--root--padding-top: 0;
  --wp--style--root--padding-right: 0;
  --wp--style--root--padding-bottom: 0;
  --wp--style--root--padding-left: 0;
}
body.donkwkm-page .wp-site-blocks { background: #07091a; min-height: 100vh; }
body.donkwkm-page .wp-site-blocks,
body.donkwkm-page main,
body.donkwkm-page main.wp-block-group,
body.donkwkm-page .entry-content,
body.donkwkm-page .wp-block-post-content,
body.donkwkm-page .wp-site-blocks > .wp-block-group,
body.donkwkm-page .has-global-padding {
  padding: 0 !important;
  margin: 0 !important;
  max-width: none !important;
  width: 100% !important;
}
/* is-layout-constrained forces every direct child (that isn't
   .alignfull) to max-width var(--wp--style--global--content-size).
   Our shortcode output sits inside .entry-content which carries
   that layout class, so without this override the hero gets pinned
   to ~620px in the middle of the screen.
   Exclude .tk-nav and .tk-sns: they are position:fixed and a
   forced width:100% + right offset breaks their placement. */
body.donkwkm-page .is-layout-constrained > *:not(.tk-nav):not(.tk-sns),
body.donkwkm-page .entry-content > *:not(.tk-nav):not(.tk-sns),
body.donkwkm-page .wp-block-post-content > *:not(.tk-nav):not(.tk-sns) {
  max-width: none !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
  width: 100% !important;
}
body.donkwkm-page,
body.donkwkm-page .wp-site-blocks,
body.donkwkm-page main,
body.donkwkm-page .entry-content,
body.donkwkm-page .wp-block-post-content { overflow: visible !important; }

/* --- Top fade strip behind the fixed nav --- */
body.donkwkm-page::before {
  content: "";
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  height: 44px;
  background: linear-gradient(to bottom, #07091a 0%, #07091a 65%, rgba(7,9,26,0.7) 92%, transparent 100%);
  z-index: 150;
  pointer-events: none;
}

/* --- Custom top nav (tk-nav) ---
   z-index must beat any sticky page element (e.g. schedule timeline
   sits at 9999), so the mobile menu overlay covers everything. */
.tk-nav {
  position: fixed;
  top: -8px;
  left: 0;
  right: 0;
  z-index: 10000;
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 10px 56px 10px 64px;
  background: linear-gradient(to bottom, #07091a 0%, #07091a 70%, rgba(7,9,26,0.85) 100%);
}
.tk-nav-logo {
  font-size: 0.82em;
  letter-spacing: 0.28em;
  color: #fff;
  text-decoration: none;
  text-transform: uppercase;
  font-family: 'Helvetica Neue', Arial, sans-serif;
  white-space: nowrap;
}
.tk-nav-links {
  display: flex;
  gap: 32px;
  list-style: none;
  margin: 0;
  padding: 0;
}
.tk-nav-links a {
  font-size: 0.64em;
  letter-spacing: 0.2em;
  color: #aaa;
  text-decoration: none;
  text-transform: uppercase;
  font-family: 'Helvetica Neue', Arial, sans-serif;
  transition: color 0.2s;
}
.tk-nav-links a:hover { color: #fff; }
.tk-nav-toggle {
  display: none;
  flex-direction: column;
  justify-content: center;
  gap: 5px;
  cursor: pointer;
  background: none;
  border: none;
  padding: 8px;
  width: 36px;
  height: 36px;
}
.tk-nav-toggle span {
  display: block;
  width: 22px;
  height: 2px;
  background: #fff;
  border-radius: 2px;
  transition: all 0.3s;
}
@media (max-width: 768px) {
  .tk-nav { padding: 8px 28px 8px 32px; }
  .tk-nav-links {
    display: none;
    position: fixed;
    inset: 0;
    background: rgba(7,9,26,0.97);
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 36px;
  }
  .tk-nav-links.open { display: flex; }
  .tk-nav-links a { font-size: 0.9em; letter-spacing: 0.25em; color: #ccc; }
  .tk-nav-toggle { display: flex; }
}
