/*
Theme Name: KTF Stars Theme
Description: v1.0.4.8.2 — seamless preload + refined project-star bodies + floaty project content. — Work snap warp refined; project/detail pages get matching motion.
Version: 1.0.4.8.2
Requires at least: 6.2
Tested up to: 6.6
Text Domain: ktf-stars
*/
:root{
  --ktf-black:#000;
  /* Brand fuchsia */
  --ktf-pink:#ff00b1;
  /* Exact brand palette */
  --ktf-cyan:#00ffe0;
  --ktf-green:#00ff67;
  --ktf-yellow:#f9ff00;

  /* RGB helpers (Safari-safe neon) */
  --ktf-pink-rgb: 255 0 177;
  --ktf-cyan-rgb: 0 255 224;
  --ktf-green-rgb: 0 255 103;
  --ktf-yellow-rgb: 249 255 0;
  --ktf-glow-rgb: var(--ktf-pink-rgb);
  --ktf-cursor-img:url("");
  --ktf-cursor-size:28px;
  --ktf-x:-9999px; --ktf-y:-9999px; --ktf-scale:1;
  --ktf-glow: var(--ktf-pink);

  /* Responsive star sizing knobs */
  --ktf-work-star-size: clamp(300px, 62vw, 1100px);
  --ktf-project-star-size: clamp(200px, 27vw, 420px);
  --ktf-glow-r1: 10px;
  --ktf-glow-r2: 20px;
  --ktf-glow-a1: .50;
  --ktf-glow-a2: .40;
}
*{box-sizing:border-box}
html,body{height:100%}
/* =========================================================
   TOUCH / POINTER CONSISTENCY (cross-device safe)
   - Prevent tap highlight flashes on iOS
   - Improve responsiveness of interactive elements
========================================================= */
a, button, [role="button"]{ -webkit-tap-highlight-color: transparent; }
.ktf-nav, .ktf-mini-star, .ktf-home-star, .ktf-corner-star, .ktf-project-star, #ktf-nav-hints button{ touch-action: manipulation; }


html, body { background:#000 !important; }
body{ margin:0; background:#000; color:#fff;font-family:system-ui,-apple-system,Segoe UI,Roboto,Inter,Arial,sans-serif;line-height:1.4 }
/* Links: keep cyan text, but underline should be WHITE (hover/click/focus) */
a{
  color:var(--ktf-cyan);
  text-decoration-line: underline;
  text-decoration-thickness: 2px;
  text-underline-offset: .22em;
  text-decoration-color: rgba(255,255,255,0);
}
body.ktf-hover-ready a:hover{
  text-decoration-color: rgba(255,255,255,.92);
}
a:focus-visible,
a:active{
  text-decoration-color: rgba(255,255,255,.92);
}
img{max-width:100%; height:auto; display:block}
#page,#content,.site,.site-content,.wp-site-blocks,.container,.wrap,.entry-content,.landing,.work-snap,.site-wrap,.site-main{
  background:transparent !important; position:relative; z-index:2;
}
.site-wrap{min-height:100%; display:flex; flex-direction:column}
.site-main{flex:1}
#ktf-sky{position:fixed !important; inset:0; z-index:0 !important; pointer-events:none; overflow:hidden; background:#000 !important;}
#ktf-sky canvas{position:absolute; inset:0; width:100%; height:100%; display:block}
.landing-center{min-height:100vh; display:grid; place-items:center; padding:0}
.ktf-swap{
  position:relative;
  transform-style:preserve-3d;
  width:min(90vw,1200px);
  aspect-ratio:2048/512;
  /* Ensure the homepage logo/swap block centers even if the surrounding block layout is left-biased */
  margin-left:auto;
  margin-right:auto;
  display:block;
}
.ktf-swap figure{ position:absolute; inset:0; margin:0 }
/* Both states occupy the exact same box. No translateY here (prevents x/y-axis drift when swapping). */
.ktf-swap figure:first-child{ opacity:1; transform:translate3d(var(--ktf-logo-offset-x,0px),var(--ktf-logo-offset-y,0px),0) scale(var(--hover-zoom,1)); transition:opacity .18s ease, transform .18s ease; }
.ktf-swap figure:last-child{ opacity:0; transform:translate3d(var(--ktf-enter-offset-x,0px),var(--ktf-enter-offset-y,0px),0) scale(var(--hover-zoom,1)); transition:opacity .18s ease, transform .18s ease; }

/* Ensure both images share identical sizing + positioning in the swap box */
.ktf-swap figure img{
  width:100%;
  height:100%;
  object-fit:contain;
  object-position:center;
}

/* Home hover swap (supports pixel hit testing via .is-hover) */
body.home.ktf-home-ready.ktf-hover-ready .ktf-swap:not(.ktf-hitbox-on):hover figure:first-child,
body.front-page.ktf-home-ready.ktf-hover-ready .ktf-swap:not(.ktf-hitbox-on):hover figure:first-child,
body.home.ktf-home-ready.ktf-hover-ready .ktf-swap.is-hover figure:first-child,
body.front-page.ktf-home-ready.ktf-hover-ready .ktf-swap.is-hover figure:first-child{
  opacity:0; transform:translate3d(var(--ktf-logo-offset-x,0px),var(--ktf-logo-offset-y,0px),0) scale(var(--hover-zoom,1));
}
body.home.ktf-home-ready.ktf-hover-ready .ktf-swap:not(.ktf-hitbox-on):hover figure:last-child,
body.front-page.ktf-home-ready.ktf-hover-ready .ktf-swap:not(.ktf-hitbox-on):hover figure:last-child,
body.home.ktf-home-ready.ktf-hover-ready .ktf-swap.is-hover figure:last-child,
body.front-page.ktf-home-ready.ktf-hover-ready .ktf-swap.is-hover figure:last-child{
  opacity:1; transform:translate3d(var(--ktf-enter-offset-x,0px),var(--ktf-enter-offset-y,0px),0) scale(var(--hover-zoom,1));
}
.ktf-swap:active figure img{ --hover-zoom:.98; }

/* Home logo: theatrical load-in + float (triggered via body.ktf-home-ready) */
body.home .ktf-swap, body.front-page .ktf-swap{
  opacity:0;
  transform: translate3d(0,0,0) scale(.06);
  filter: none;
  transform-origin:center;
  -webkit-tap-highlight-color: transparent;
}
body.home.ktf-home-ready .ktf-swap, body.front-page.ktf-home-ready .ktf-swap{
  animation: ktfHomeFadeIn 1200ms cubic-bezier(.18,1.08,.2,1) both, ktfHomeFloat 6.0s ease-in-out infinite;
  animation-delay: 60ms, 1.15s;
  opacity:1;
  filter: none;
}
body.home.ktf-home-ready.ktf-hover-ready .ktf-swap.is-hover,
body.home.ktf-home-ready.ktf-hover-ready .ktf-swap:hover,
body.front-page.ktf-home-ready.ktf-hover-ready .ktf-swap.is-hover,
body.front-page.ktf-home-ready.ktf-hover-ready .ktf-swap:hover{
  animation-duration: 3.9s;
}
@keyframes ktfHomeFloat{
  0%,100%{ transform: translate3d(0,0,0) scale(1) rotate(0deg); }
  50%{ transform: translate3d(0,-2.35vh,0) scale(1.04) rotate(-0.22deg); }
}

/* Theatrical home load-in */
@keyframes ktfHomeFadeIn{
  0%{ opacity:0; transform: translate3d(0,0,0) scale(.06); }
  12%{ opacity:1; }
  100%{ opacity:1; transform: translate3d(0,0,0) scale(1); }
}

@keyframes ktfHomeCornerIn{
  0%{
    opacity:0;
    transform: translate3d(var(--ktf-from-center-x, var(--ktf-corner-in-x,0)),
                           var(--ktf-from-center-y, var(--ktf-corner-in-y,0)),
                           0)
               scale(.06)
               rotate(var(--ktf-corner-in-rot,-18deg));
  }
  12%{ opacity:1; }
  100%{
    opacity:.75;
    transform: translate3d(0,0,0) scale(1) rotate(0deg);
  }
}

@keyframes ktfHomeHomeStarIn{
  0%{ opacity:0; transform: translate3d(0,0,0) scale(.65) rotate(10deg); filter: blur(8px); }
  70%{ opacity:.9; transform: translate3d(0,0,0) scale(1.10) rotate(-2deg); filter: blur(0); }
  100%{ opacity:.75; transform: translate3d(0,0,0) scale(1) rotate(0deg); filter: blur(0); }
}

/* Shared pop-in used across work pages + home swap images */
@keyframes ktfPopInSafe{
  0%{ opacity:0; filter: blur(12px); }
  70%{ opacity:1; filter: blur(0); }
  100%{ opacity:1; filter: blur(0); }
}


/* === Work hub depth: allow translateZ warp-in (set by work-warp-in.js) === */
html.ktf-work-depth .work-snap-block{
  perspective: 1200px;
  transform-style: preserve-3d;
}
html.ktf-work-depth .work-card-block{
  transform-style: preserve-3d;
}

/* === Work category stars: warp-in from the starfield (wrapper-only, keeps neon/glow on the image) === */
.work-snap-block .work-card-block figure.ktf-wrapped .ktf-work-star-warp{
  display:inline-block;
  transform-origin:center;
  will-change: transform, opacity;
  opacity:1;
  transform: translate3d(0,0,0) scale(1);
}

.work-card-block .wp-block-image{
  transform-origin:center;
  will-change: transform, opacity;
}
@keyframes ktfWarpFromDepth{
  0%{ opacity:0; transform: translate3d(0,0,0) scale(.08); }
  12%{ opacity:1; }
  100%{ opacity:1; transform: translate3d(0,0,0) scale(1); }
}


.ktf-swap figure img{ will-change: transform, filter; }

/* ENTER jolt + bright glow (triggers on hover/tap) */
body.ktf-hover-ready .ktf-swap.is-hover figure:last-child img,
body.ktf-hover-ready .ktf-swap:not(.ktf-hitbox-on):hover figure:last-child img{
  animation: ktfEnterJolt 560ms cubic-bezier(.22,1.18,.25,1) both;
  /* Fuchsia ENTER impact glow */
  filter: drop-shadow(0 0 6px rgba(255,0,177,.38))
          drop-shadow(0 0 14px rgba(255,0,177,.24))
          drop-shadow(0 0 26px rgba(255,0,177,.14));
}
@keyframes ktfEnterJolt{
  /* No translate (keeps ENTER! on the same x/y axis as KENTHEFRUIT). */
  /* Keep scale at 1 so swap stays the exact same size; use rotation + glow for impact. */
  0%{ transform: scale(1) rotate(0deg); }
  22%{ transform: scale(1) rotate(-1.0deg); }
  46%{ transform: scale(1) rotate(0.85deg); }
  72%{ transform: scale(1) rotate(-0.55deg); }
  100%{ transform: scale(1) rotate(0deg); }
}
.work-snap-block{ height:100vh; overflow-y:auto; scroll-snap-type:y mandatory; scroll-behavior:smooth; overscroll-behavior-y:contain; }
.work-card-block{ min-height:100vh; display:grid; place-items:center; gap:16px; padding:24px; }
.work-card-block .wp-block-image{ filter:drop-shadow(0 0 6px rgba(0,0,0,.35)); }
.work-card-block .wp-block-image.snap-bounce{ animation: ktfSnapWrap 360ms cubic-bezier(.22,.85,.23,1); }
@keyframes ktfSnapWrap{ 0%{ transform: translateY(-6px) scale(1.01); } 55%{ transform: translateY(0) scale(1.028); } 100%{transform: translateY(0) scale(1.000); } }
.work-card-block .wp-block-image img,
.work-card-block img.work-star,
.work-card-block figure img{
  width: var(--ktf-work-star-size);
  max-width:none;
}

/* Fallback (before work-warp-in.js wraps the image) */
.work-card-block figure:not(.ktf-wrapped) img{
  will-change: transform, filter;
  transition: transform .18s ease;
  animation: ktf-floatPulse 6.25s ease-in-out infinite;
}

/* Wrapped: transform handled by .ktf-work-star-float; keep image filter snappy */
.work-card-block figure.ktf-wrapped img{
  will-change: filter;
  transition: filter .18s ease;
}

body.ktf-hover-ready .work-card-block.ktf-hit img,
body.ktf-hover-ready .work-card-block a.ktf-hit img,
body.ktf-hover-ready .work-card-block a:focus-visible img{ --hover-zoom:1.06; }
.work-card-block a:active img,
.work-card-block .wp-block-image:active img{ --hover-zoom:.98; }
.slug-fashion, .category-fashion, body.category-fashion, body.term-fashion, [data-cat="fashion"]{ --ktf-glow: var(--ktf-pink); --ktf-glow-rgb: var(--ktf-pink-rgb); }
.slug-styling, .category-styling, body.category-styling, body.term-styling, [data-cat="styling"]{ --ktf-glow: var(--ktf-green); --ktf-glow-rgb: var(--ktf-green-rgb); }
.slug-graphic, .category-graphic, body.category-graphic, body.term-graphic, [data-cat="graphic"], .slug-creative, .category-creative, body.category-creative, body.term-creative, [data-cat="creative"]{ --ktf-glow: var(--ktf-cyan); --ktf-glow-rgb: var(--ktf-cyan-rgb); }
.slug-corporate, .category-corporate, body.category-corporate, body.term-corporate, [data-cat="corporate"]{ --ktf-glow: var(--ktf-yellow); --ktf-glow-rgb: var(--ktf-yellow-rgb); }
.work-card-block img[src*="/STAR-PINK"], .work-card-block figure img[src*="/STAR-PINK"]{ --ktf-glow: var(--ktf-pink); --ktf-glow-rgb: var(--ktf-pink-rgb); }
.work-card-block img[src*="/STAR-GREEN"], .work-card-block figure img[src*="/STAR-GREEN"]{ --ktf-glow: var(--ktf-green); --ktf-glow-rgb: var(--ktf-green-rgb); }
.work-card-block img[src*="/STAR-CYAN"], .work-card-block figure img[src*="/STAR-CYAN"]{ --ktf-glow: var(--ktf-cyan); --ktf-glow-rgb: var(--ktf-cyan-rgb); }
.work-card-block img[src*="/STAR-YELLOW"], .work-card-block figure img[src*="/STAR-YELLOW"]{ --ktf-glow: var(--ktf-yellow); --ktf-glow-rgb: var(--ktf-yellow-rgb); }
.work-card-block img.work-star,
.work-card-block figure img[src*="/STAR-"],
.work-card-block figure img[alt*="Fashion"],
.work-card-block figure img[alt*="Styling"],
.work-card-block figure img[alt*="Graphic"],
.work-card-block figure img[alt*="Corporate"]{
  isolation:isolate;
  animation: ktf-floatPulse 6.25s ease-in-out infinite, ktfNeonPulse 2.6s ease-in-out infinite;
  filter:
    drop-shadow(0 0 var(--ktf-glow-r1) rgb(var(--ktf-glow-rgb) / var(--ktf-glow-a1)))
    drop-shadow(0 0 var(--ktf-glow-r2) rgb(var(--ktf-glow-rgb) / var(--ktf-glow-a2)));
}
@keyframes ktfNeonPulse{
  0%{
    filter: drop-shadow(0 0 calc(var(--ktf-glow-r1) - 2px) rgb(var(--ktf-glow-rgb) / var(--ktf-glow-a1)))
            drop-shadow(0 0 calc(var(--ktf-glow-r2) - 4px) rgb(var(--ktf-glow-rgb) / var(--ktf-glow-a2)));
  }
  50%{
    filter: drop-shadow(0 0 calc(var(--ktf-glow-r1) + 4px) rgb(var(--ktf-glow-rgb) / var(--ktf-glow-a1)))
            drop-shadow(0 0 calc(var(--ktf-glow-r2) + 6px) rgb(var(--ktf-glow-rgb) / var(--ktf-glow-a2)));
  }
  100%{
    filter: drop-shadow(0 0 calc(var(--ktf-glow-r1) - 2px) rgb(var(--ktf-glow-rgb) / var(--ktf-glow-a1)))
            drop-shadow(0 0 calc(var(--ktf-glow-r2) - 4px) rgb(var(--ktf-glow-rgb) / var(--ktf-glow-a2)));
  }
}
@media (pointer:fine){
  html, body, a, button, [role="button"], [onclick], img, canvas, .site *{ cursor:none !important; }
  input, textarea, select, [contenteditable="true"] { cursor:text !important; }
  .ktf-cursor{
    position:fixed; left:0; top:0; width:var(--ktf-cursor-size); height:var(--ktf-cursor-size);
    transform:translate3d(var(--ktf-x), var(--ktf-y), 0) scale(var(--ktf-scale)); transform-origin:center center;
    background-image:var(--ktf-cursor-img); background-size:contain; background-repeat:no-repeat; background-position:center;
    pointer-events:none; z-index:2147483647; will-change: transform;
    filter:drop-shadow(0 0 2px var(--ktf-pink)) drop-shadow(0 0 6px var(--ktf-pink)) drop-shadow(0 0 14px var(--ktf-pink));
  }
  .ktf-cursor.is-link{ filter:drop-shadow(0 0 3px var(--ktf-pink)) drop-shadow(0 0 10px var(--ktf-pink)) drop-shadow(0 0 22px var(--ktf-pink)); }
  .ktf-cursor.is-down{ transform:translate3d(var(--ktf-x), var(--ktf-y), 0) scale(0.9); }
}
.ktf-nav{
  width: clamp(64px, 4.6vw, 96px);
  height: clamp(64px, 4.6vw, 96px);
  display:grid;
  place-items:center;
  position:relative;
  color:#fff;
  text-decoration:none;
  pointer-events:auto;
  padding:0;
  background: transparent;
  border: none;
  border-radius: 0;
  box-shadow: none;
  transition: transform 220ms ease, filter 220ms ease;
  -webkit-tap-highlight-color: transparent;
}
body.ktf-hover-ready .ktf-nav:hover{
  transform: translateY(-2px) scale(1.10);
}
.ktf-nav svg{
  width: clamp(34px, 2.6vw, 52px);
  height: clamp(34px, 2.6vw, 52px);
  display:block;
  filter: drop-shadow(0 0 8px rgba(255,255,255,.65))
          drop-shadow(0 0 18px rgba(255,0,177,.22));
  opacity: .92;
  transition: filter 220ms ease, opacity 220ms ease;
}
body.ktf-hover-ready .ktf-nav:hover svg{
  opacity:1;
  filter: drop-shadow(0 0 10px rgba(255,255,255,.85))
          drop-shadow(0 0 24px rgba(255,0,177,.34))
          drop-shadow(0 0 34px rgba(0,255,224,.16));
}
.ktf-back-wrap{ position:fixed; top:16px; left:16px; z-index:2147483000; }
.home .ktf-back-wrap, .front-page .ktf-back-wrap{ display:none !important; }
#ktf-nav-hints{ position:fixed; left:50%; transform:translateX(-50%); bottom: calc(16px + env(safe-area-inset-bottom, 0px)); z-index:2147483000; display:flex; gap:12px; align-items:center; }
.ktf-nav.dir-left svg{ transform:rotate(0deg); }
.ktf-nav.dir-up   svg{ transform:rotate(-90deg); }
.ktf-nav.dir-down svg{ transform:rotate(90deg); }
.ktf-nav .nav-x{ display:inline-grid; }
.ktf-nav .nav-y{ display:inline-grid; }
.ktf-back-wrap .nav-x{ animation: navWiggleX 1.8s ease-in-out infinite; }
@keyframes navWiggleX{ 0%,100%{ transform:translateX(0); } 50%{ transform:translateX(-3px); } }
#ktf-hint-down{ order:1; }
#ktf-hint-up{ order:2; opacity:0; pointer-events:none; }
#ktf-hint-down .nav-y{ animation: navBobDown 2.0s ease-in-out infinite; }
#ktf-hint-up   .nav-y{ animation: navBobUp   2.0s ease-in-out infinite; }
@keyframes navBobDown{ 0%,100%{ transform:translateY(0); } 50%{ transform:translateY(5px); } }
@keyframes navBobUp{ 0%,100%{ transform:translateY(0); } 50%{ transform:translateY(-5px); } }
@media (prefers-reduced-motion:reduce){
  html:not(.ktf-motion-force) .work-card-block .wp-block-image img,
  html:not(.ktf-motion-force) .work-card-block img.work-star,
  html:not(.ktf-motion-force) .work-card-block figure img{ animation:none }
  html:not(.ktf-motion-force) .ktf-nav .nav-x, html:not(.ktf-motion-force) .ktf-nav .nav-y{ animation:none }
  html:not(.ktf-motion-force) .ktf-swap.figure{ transition:none }
}


/* NOTE: Navigation is normal link navigation (no JS page-transition fades).
   Keep motion inside components (stars, glows, galleries) to avoid white flashes. */

/* =====================================================================
   KTF In-View Motion (scroll/appear based)
   - Adds subtle pop-in when an element enters the viewport
   - NEVER hides above-fold content (JS marks in-view items immediately)
   - Disabled if prefers-reduced-motion
===================================================================== */

.ktf-io-ready .ktf-io-item[data-ktf-io="0"]{
  opacity:0;
  transform: translate3d(0,16px,0) scale(.982);
  filter: brightness(.95) saturate(.98);
}
.ktf-io-item{
  will-change: transform, opacity, filter;
  transition:
    opacity 520ms cubic-bezier(.22,.85,.23,1),
    transform 520ms cubic-bezier(.22,.85,.23,1),
    filter 520ms cubic-bezier(.22,.85,.23,1);
}
.ktf-io-item.ktf-inview{
  opacity:1;
  transform:none;
  filter:none;
}

/* Stagger utility (JS can set --ktf-io-delay on each element) */
.ktf-io-item{ transition-delay: var(--ktf-io-delay, 0ms); }

@media (prefers-reduced-motion:reduce){
  html:not(.ktf-motion-force) .ktf-io-item{ transition:none !important; transform:none !important; filter:none !important; opacity:1 !important; }
  html:not(.ktf-motion-force) .ktf-io-ready .ktf-io-item[data-ktf-io="0"]{ opacity:1 !important; }
}

/* Editor safety: keep Gutenberg/Kadence editing predictable */
body.wp-admin .ktf-io-item,
body.block-editor-page .editor-styles-wrapper .ktf-io-item{
  transition:none !important;
  transform:none !important;
  filter:none !important;
  opacity:1 !important;
}

/* === Home is static (no scroll) for pure logo view === */
body.home, body.front-page{ height:100dvh; overflow:hidden; overscroll-behavior:none; }
body.home #page, body.front-page #page,
body.home #content, body.front-page #content,
body.home .site, body.front-page .site{ height:100%; }
.landing-center{ height:100dvh; min-height:100dvh; }

/* === Shared pop-in (safe: never fades to 0; avoids 'load then disappear') */
/* Apply to home logo swap */
.home .ktf-swap img{ animation: ktfPopInSafe 720ms cubic-bezier(.22,.85,.23,1) 80ms both; }
/* Apply to category stars (entrance handled by work-warp-in.js) */
.work-snap-block .work-card-block figure:not(.ktf-wrapped) img,
.work-snap-block .work-card-block img.work-star{
  animation: ktf-floatPulse 6.25s ease-in-out infinite, ktfNeonPulse 2.6s ease-in-out infinite;
}

.work-snap-block .work-card-block figure.ktf-wrapped .ktf-work-star-warp{
  display:inline-block;
  transform-origin:center;
  will-change: transform, opacity;
}
.work-snap-block .work-card-block figure.ktf-wrapped .ktf-work-star-float{
  display:inline-block;
  transform-origin:center;
  will-change: transform;
  transition: transform .18s ease;
  animation: ktf-floatPulse 6.25s ease-in-out infinite;
}
.work-snap-block .work-card-block figure.ktf-wrapped img{
  animation: ktfNeonPulse 2.6s ease-in-out infinite;
  will-change: filter;
}


/* === Stronger idle float */
@keyframes ktf-floatPulse{
  0%,100%{ transform: translateY(0)    scale(calc(1 * var(--hover-zoom,1))); }
  50%    { transform: translateY(-3.25vh) scale(calc(1.085 * var(--hover-zoom,1))); }
}

/* === Hover punch-up (pixel-accurate via .ktf-hit) */
body.ktf-hover-ready .work-card-block.ktf-hit,
body.ktf-hover-ready .work-card-block a.ktf-hit,
body.ktf-hover-ready .work-card-block a:focus-visible,
body.ktf-hover-ready .ktf-swap.is-hover,
body.ktf-hover-ready .ktf-swap:hover{
  --hover-zoom: 1.08;
  --ktf-glow-r1: 12px;
  --ktf-glow-r2: 26px;
}

/* === Image-based Tap/Click indicator using provided assets (all devices) === */
#ktf-tap-indicator{
  position:fixed; left:50%; bottom:28px; transform:translateX(-50%);
  z-index:2147483000; display:grid; place-items:center; pointer-events:none; opacity:.98;
}
#ktf-tap-indicator .tap-pointer{
  width:24px; height:auto; display:block;
  filter: drop-shadow(0 0 10px rgba(255,255,255,.65)) drop-shadow(0 0 18px rgba(255,255,255,.45)) drop-shadow(0 0 28px rgba(255,255,255,.25));
}
#ktf-tap-indicator .tap-pointer.click{
  position:absolute; bottom:0; left:50%; transform:translateX(-50%); opacity:0;
}
@keyframes ktfTapBaseCycle{ 0%,45%,100%{ transform:translateY(0) scale(1); } 50%{ transform:translateY(1px) scale(.96); } }
@keyframes ktfTapClickCycle{ 0%,45%,100%{ opacity:0; transform:translate(-50%,0) scale(1); } 50%{ opacity:1; transform:translate(-50%,1px) scale(.96); } }
#ktf-tap-indicator .tap-pointer.base { animation: ktfTapBaseCycle 1200ms ease-in-out infinite; }
#ktf-tap-indicator .tap-pointer.click{ animation: ktfTapClickCycle 1200ms ease-in-out infinite; }
body.ktf-hide-indicator #ktf-tap-indicator{ opacity:0; visibility:hidden; transform:translate(-50%,8px) scale(.98);
  transition: opacity .25s ease, transform .25s ease, visibility 0s linear .25s; }

/* Images & galleries: noticeable hover polish */
.entry-content img,
.wp-block-image img,
.wp-block-gallery img{
  will-change: transform, filter;
  transition: transform .18s ease, filter .22s ease;
}

body.ktf-hover-ready .entry-content a:hover img,
body.ktf-hover-ready .wp-block-gallery figure:hover img{
  transform: translate3d(0,-3px,0) scale(1.05);
  filter: brightness(1.08) saturate(1.08) drop-shadow(0 0 22px rgba(255,255,255,.14));
}

/* Labels under stars: tiny float (doesn't affect layout) */
@keyframes ktfProjectLabelFloat{
  0%,100%{ transform: translate(-50%,0) translate(var(--ktf-label-dx), var(--ktf-label-dy)); }
  50%{ transform: translate(-50%,-3px) translate(var(--ktf-label-dx), var(--ktf-label-dy)); }
}

/* Buttons / links: a bit more bounce on hover */
.entry-content a,
.wp-block-button__link{ transition: transform .16s ease, filter .18s ease; }
body.ktf-hover-ready .wp-block-button__link:hover{
  transform: translateY(-4px) scale(1.06) rotate(-0.22deg);
  filter: drop-shadow(0 0 22px rgba(255,255,255,.30));
}

body.ktf-hover-ready .entry-content :is(h1,h2,h3,h4,h5,h6):hover{
  transform: translate3d(0,-4px,0) rotate(-0.85deg);
  filter: drop-shadow(0 0 26px rgba(255,255,255,.18));
}

/* Reduce motion */
@media (prefers-reduced-motion:reduce){
  html:not(.ktf-motion-force) .ktf-project-star-label{ animation:none !important; }
  html:not(.ktf-motion-force) .home .ktf-swap{ animation:none !important; }
}



/* === KTF v5.1: snap-stop + emphasis animation === */
:root{ --ktf-ease: cubic-bezier(.22,1,.36,1); }
.work-scroll, .work-container, body.work { overscroll-behavior: contain; }
[data-ktf-block], .work-card-block, section[data-ktf], section.work, .wp-block-group[data-ktf] {
  scroll-snap-stop: always;
}
.ktf-current {
  transform: scale(1.02);
  transition: transform 280ms var(--ktf-ease);
}
@media (prefers-reduced-motion: reduce){
  html:not(.ktf-motion-force) .ktf-current{ transform:none !important; transition:none !important; }
}



/* === Motion tuning: softer & floatier feel === */
:root{ --ktf-ease: cubic-bezier(.22,1,.36,1); --ktf-ease-soft: cubic-bezier(.16,.84,.44,1); }

body.ktf-project-select-locked{
  overflow:hidden;
}

/* Title wrapper */
.ktf-project-select-title{
  position:relative;
  z-index:3;
  padding:3vh 4vw 0.75vh;
  text-align:center;
}

/* Title PNGs — smaller, higher, neon vacancy glow */
.ktf-project-select-page img[src*="FASHION-TITLE"],
.ktf-project-select-page img[src*="STYLING-TITLE"],
.ktf-project-select-page img[src*="GRAPHIC-TITLE"],
.ktf-project-select-page img[src*="CREATIVE-TITLE"],
.ktf-project-select-page img[src*="CORPORATE-TITLE"]{
  display:block;
  margin:0 auto;
  max-width:min(58vw, 720px);
  transform-origin:center;
  animation: ktfNeonOnOff 5s ease-in-out infinite;
}

/* Color‑matched, tighter neon glow */
.ktf-project-select-page.slug-fashion img[src*="FASHION-TITLE"]{
  filter:
    drop-shadow(0 0 2px rgba(0,0,0,.9))
    drop-shadow(0 0 4px var(--ktf-pink))
    drop-shadow(0 0 9px var(--ktf-pink))
    drop-shadow(0 0 14px rgba(255,255,255,.7));
}
.ktf-project-select-page.slug-styling img[src*="STYLING-TITLE"]{
  filter:
    drop-shadow(0 0 2px rgba(0,0,0,.9))
    drop-shadow(0 0 4px var(--ktf-green))
    drop-shadow(0 0 9px var(--ktf-green))
    drop-shadow(0 0 14px rgba(255,255,255,.7));
}
.ktf-project-select-page.slug-graphic img[src*="GRAPHIC-TITLE"],
.ktf-project-select-page.slug-creative img[src*="CREATIVE-TITLE"]{
  filter:
    drop-shadow(0 0 2px rgba(0,0,0,.9))
    drop-shadow(0 0 4px var(--ktf-cyan))
    drop-shadow(0 0 9px var(--ktf-cyan))
    drop-shadow(0 0 14px rgba(255,255,255,.7));
}
.ktf-project-select-page.slug-corporate img[src*="CORPORATE-TITLE"]{
  filter:
    drop-shadow(0 0 2px rgba(0,0,0,.9))
    drop-shadow(0 0 4px var(--ktf-yellow))
    drop-shadow(0 0 9px var(--ktf-yellow))
    drop-shadow(0 0 14px rgba(255,255,255,.7));
}

/* Neon sign flicker on/off + subtle breathing */
@keyframes ktfNeonOnOff{
  0%  { opacity:0.20; transform:translate3d(0,6px,0) scale(0.995) rotate(0deg); }
  3%  { opacity:1; }
  6%  { opacity:0.35; }
  8%  { opacity:1; }
  10% { opacity:0.15; }
  13% { opacity:1; }
  30% { opacity:1;   transform:translate3d(0,-4px,0) scale(1.012) rotate(-0.25deg); }
  55% { opacity:.96; transform:translate3d(0,-10px,0) scale(1.035) rotate(0.22deg); }
  80% { opacity:1;   transform:translate3d(0,-7px,0) scale(1.045) rotate(-0.18deg); }
  100%{ opacity:1;   transform:translate3d(0,-5px,0) scale(1.020) rotate(0deg); }
}

/* Floating stars container (full scene) */
.ktf-project-select-stars{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  pointer-events:none; /* stars re‑enable for themselves */
}

/* Individual project star wrappers */
.ktf-project-star{
  --ktf-star-glow: var(--ktf-pink);
  --ktf-star-glow-rgb: var(--ktf-pink-rgb);

  position:fixed;
  top:0;
  left:0;
  z-index:2;
  display:flex;
  align-items:center;
  justify-content:center;
  width: var(--ktf-project-star-size);
  aspect-ratio:1/1;
  pointer-events:auto;
  cursor:pointer;

  /* Performance + mobile polish */
  will-change:transform;
  transform:translate3d(0,0,0);
  touch-action:manipulation;
  -webkit-tap-highlight-color:transparent;
}

@media (max-width: 720px){
  :root{ --ktf-project-star-size: clamp(180px, 51vw, 330px); }
}

@media (max-width: 520px){
  /* Phones (e.g., iPhone 16): make project stars ~30% smaller */
  :root{ --ktf-project-star-size: clamp(126px, 36vw, 232px); }
}

/* Medium-desktop sizing (e.g., 14" laptops): reduce star scale ~25% */
@media (min-width: 1180px) and (max-width: 1600px){
  :root{
    --ktf-work-star-size: clamp(240px, 46vw, 900px);
    --ktf-project-star-size: clamp(150px, 20vw, 315px);
  }
}



/* Inner wrapper (JS injects) so icon can twirl/pulse without affecting positioning or label layout */
.ktf-project-star-inner{
  width:100%;
  height:100%;
  display:block;
  position:relative;
  transform-origin:center;
  will-change: transform, filter;
  animation: ktfStarInnerFloat var(--ktf-inner-dur, 6.2s) ease-in-out infinite;
}
@keyframes ktfStarInnerFloat{
  0%,100%{ transform: translate3d(0,0,0) rotate(0deg) scale(1); }
  50%{ transform: translate3d(0,-8px,0) rotate(-2.4deg) scale(1.04); }
}
body.ktf-hover-ready .ktf-project-star.ktf-hit .ktf-project-star-inner,
.ktf-project-star:focus-within .ktf-project-star-inner{
  animation-duration: calc(var(--ktf-inner-dur, 6.2s) * 0.70);
}



/* Star images: same neon language as titles */
.ktf-project-star img{
  width:100%;
  height:100%;
  object-fit:contain;
  filter:
    drop-shadow(0 0 2px rgba(0,0,0,.9))
    drop-shadow(0 0 4px var(--ktf-star-glow))
    drop-shadow(0 0 9px var(--ktf-star-glow));
  transition:
    transform .16s ease,
    filter .16s ease;
}

/* Color‑sync star glows to page slug */
.ktf-project-select-page.slug-fashion  .ktf-project-star{ --ktf-star-glow:var(--ktf-pink); --ktf-star-glow-rgb: var(--ktf-pink-rgb); }
.ktf-project-select-page.slug-styling  .ktf-project-star{ --ktf-star-glow:var(--ktf-green); --ktf-star-glow-rgb: var(--ktf-green-rgb); }
.ktf-project-select-page.slug-graphic  .ktf-project-star,
.ktf-project-select-page.slug-creative .ktf-project-star{ --ktf-star-glow:var(--ktf-cyan); --ktf-star-glow-rgb: var(--ktf-cyan-rgb); }
.ktf-project-select-page.slug-corporate .ktf-project-star{ --ktf-star-glow:var(--ktf-yellow); --ktf-star-glow-rgb: var(--ktf-yellow-rgb); }

body.ktf-hover-ready .ktf-project-star.ktf-hit img,
.ktf-project-star:focus-within img{
  transform:scale(1.08) rotate(3deg);
  /* Never remove glow on hover — only intensify. */
  filter:
    drop-shadow(0 0 3px rgba(0,0,0,1))
    drop-shadow(0 0 5px var(--ktf-star-glow))
    drop-shadow(0 0 12px var(--ktf-star-glow))
    drop-shadow(0 0 18px var(--ktf-star-glow))
    drop-shadow(0 0 10px rgba(255,255,255,.22));
}

/* Star labels: readable, lightweight, moves with the star (no pill) */
.ktf-project-star-label{
  position:absolute;
  left:50%;
  top:100%;
  margin-top:10px;
  padding:0;
  border:none;
  background:transparent;
  border-radius:0;

  font-size:12.5px;
  letter-spacing:.12em;
  text-transform:uppercase;
  line-height:1.12;
  text-align:center;

  color:rgba(255,255,255,.92);
  text-shadow:
    0 0 4px rgba(0,0,0,.95),
    0 0 10px rgb(var(--ktf-star-glow-rgb) / 0.55),
    0 0 18px rgb(var(--ktf-star-glow-rgb) / 0.35);

  transform:translate3d(-50%,0,0);
  opacity:1;

  pointer-events:auto;
  cursor:pointer;
  max-width:min(420px, 82vw);
  white-space:normal;

  animation: ktfProjectLabelFloat var(--ktf-label-dur, 6.2s) ease-in-out infinite;
}

@media (max-width: 720px){
  .ktf-project-star-label{
    font-size:11.25px;
    letter-spacing:.10em;
    max-width:min(300px, 78vw);
  }
}

.ktf-project-gallery{
  margin-top:32px;
}
.ktf-project-gallery .wp-block-gallery{
  display:flex;
  gap:16px;
  overflow-x:auto;
  scroll-behavior: smooth;
  scroll-snap-type:x mandatory;
  padding-bottom:8px;
}
.ktf-project-gallery .wp-block-image{
  transform-origin: center center;
  flex:0 0 78%;
  scroll-snap-align:center;
}
.ktf-project-gallery .wp-block-image img{
  width:100%;
  height:auto;
  display:block;
  border-radius:16px;
}


html.ktf-prehide body.ktf-project-page .entry-content :is(h1,h2,h3,.wp-block-heading),
html.ktf-prehide body.ktf-project-page .entry-content p{
  animation: none !important;
}
/* =====================================================================
   Project/detail pages — match the "alive" feel of the rest of the site
===================================================================== */

/* Media drift (very subtle) */
body.ktf-project-page .ktf-project-media{
  --ktf-drift-dur: 11s;
  --ktf-drift-delay: 0s;
  --ktf-drift-amp: 6px;
  animation: ktfProjectMediaDrift var(--ktf-drift-dur) ease-in-out infinite;
  animation-delay: var(--ktf-drift-delay);
  will-change: transform;
}

@keyframes ktfProjectMediaDrift{
  0%,100%{ transform: translate3d(0,0,0); }
  50%{ transform: translate3d(0,var(--ktf-drift-amp),0); }
}

/* Hover lift + glow (gated) */
body.ktf-project-page .wp-block-image,
body.ktf-project-page .wp-block-gallery figure{
  transition: transform 280ms cubic-bezier(.22,.85,.23,1), filter 280ms cubic-bezier(.22,.85,.23,1);
  transform-origin:center;
}

body.ktf-hover-ready.ktf-project-page .wp-block-image:hover,
body.ktf-hover-ready.ktf-project-page .wp-block-gallery figure:hover{
  transform: translate3d(0,-4px,0) scale(1.01);
  filter:
    drop-shadow(0 0 1px rgba(255,255,255,.22))
    drop-shadow(0 0 10px rgba(255,0,177,.25));
}

/* Project/detail pages — unified hover language (gated) */
body.ktf-project-page .entry-content a:not(.wp-block-button__link){
  transition: color .18s ease, text-shadow .22s ease, filter .22s ease;
  text-underline-offset:.18em;
  text-decoration-thickness: from-font;
}
body.ktf-hover-ready.ktf-project-page .entry-content a:not(.wp-block-button__link):hover{
  text-shadow:
    0 0 8px rgba(255,0,177,.35),
    0 0 14px rgba(0,255,224,.18);
}

body.ktf-project-page .entry-content .wp-block-button__link{
  transition: transform .22s ease, filter .22s ease;
}
body.ktf-hover-ready.ktf-project-page .entry-content .wp-block-button__link:hover,
body.ktf-hover-ready.ktf-project-page .entry-content .wp-block-button__link:focus-visible{
  transform: translate3d(0,-3px,0) scale(1.01);
  filter:
    drop-shadow(0 0 1px rgba(255,255,255,.22))
    drop-shadow(0 0 10px rgba(255,0,177,.22));
}

body.ktf-project-page .entry-content .wp-block-cover,
body.ktf-project-page .entry-content .wp-block-media-text{
  transition: transform .26s ease, filter .26s ease;
  will-change: transform, filter;
}
body.ktf-hover-ready.ktf-project-page .entry-content .wp-block-cover:hover,
body.ktf-hover-ready.ktf-project-page .entry-content .wp-block-media-text:hover{
  transform: translate3d(0,-3px,0) scale(1.003);
  filter: drop-shadow(0 0 12px rgba(255,255,255,.10));
}



/* Ambient "space" breathing for type (no layout movement) */
body.ktf-project-page .entry-content :is(h1,h2,h3,.wp-block-heading){
  animation: ktfTypeBreath 8.8s ease-in-out infinite;
  will-change: filter;
}
body.ktf-project-page .entry-content p{
  animation: ktfBodyBreath 12.5s ease-in-out infinite;
  will-change: filter;
}

@keyframes ktfTypeBreath{
  0%,100%{ filter: drop-shadow(0 0 0 rgba(255,0,177,0)); }
  50%{ filter: drop-shadow(0 0 10px rgba(255,0,177,.16)) drop-shadow(0 0 12px rgba(0,255,224,.10)); }
}
@keyframes ktfBodyBreath{
  0%,100%{ filter: none; }
  50%{ filter: drop-shadow(0 0 8px rgba(255,255,255,.08)); }
}

/* Fallback if WAAPI isn't available (rare) */
body.ktf-project-page .ktf-project-warp{
  animation: ktfProjectWarpFallback 760ms cubic-bezier(.22,.85,.23,1) both;
}
@keyframes ktfProjectWarpFallback{
  0%{ opacity:0; transform: translate3d(0,10px,0) scale(.92); filter: brightness(.92) saturate(1.08) blur(2px); }
  100%{ opacity:1; transform:none; filter:none; }
}

@media (prefers-reduced-motion:reduce){
  html:not(.ktf-motion-force) body.ktf-project-page .ktf-project-media{
    animation:none !important;
  }
  html:not(.ktf-motion-force) body.ktf-project-page .ktf-project-warp{
    animation:none !important;
  }
}

/* Nav dock — unify glow, keep soft hover */

/* === KTF Universal Neon Pulse utilities ======================= */

.ktf-neon-pulse{
  --ktf-neon-main: #ff00a8;
  --ktf-neon-soft: rgba(255, 0, 168, 0.45);
  --ktf-neon-strong: rgba(255, 0, 168, 0.75);

  position: relative;
  display: inline-block;
  transform-origin: center center;
  animation: ktfNeonUniversalPulse 1.4s ease-in-out infinite alternate;
  filter:
    drop-shadow(0 0 1px   var(--ktf-neon-main))
    drop-shadow(0 0 3px   var(--ktf-neon-main))
    drop-shadow(0 0 7px   var(--ktf-neon-soft));
}

body.ktf-hover-ready .ktf-neon-pulse:hover,
.ktf-neon-pulse:focus{
  animation-duration: 1s;
  transform: scale(1.02);
  filter:
    drop-shadow(0 0 1.5px var(--ktf-neon-main))
    drop-shadow(0 0 4px   var(--ktf-neon-main))
    drop-shadow(0 0 10px  var(--ktf-neon-strong));
}

@keyframes ktfNeonUniversalPulse{
  0%{
    opacity:0.8;
    filter:
      drop-shadow(0 0 0.5px var(--ktf-neon-main))
      drop-shadow(0 0 2px   var(--ktf-neon-main))
      drop-shadow(0 0 5px   var(--ktf-neon-soft));
  }
  55%{
    opacity:1;
    filter:
      drop-shadow(0 0 1.5px var(--ktf-neon-main))
      drop-shadow(0 0 4px   var(--ktf-neon-main))
      drop-shadow(0 0 10px  var(--ktf-neon-strong));
  }
  100%{
    opacity:0.85;
    filter:
      drop-shadow(0 0 1px   var(--ktf-neon-main))
      drop-shadow(0 0 3px   var(--ktf-neon-main))
      drop-shadow(0 0 7px   var(--ktf-neon-soft));
  }
}

/* Color variants – swap hexes if palette shifts */
.ktf-neon-pulse--pink{
  --ktf-neon-main: var(--ktf-pink);
  --ktf-neon-soft: rgba(255, 0, 177, 0.45);
  --ktf-neon-strong: rgba(255, 0, 177, 0.75);
}
.ktf-neon-pulse--cyan{
  --ktf-neon-main: var(--ktf-cyan);
  --ktf-neon-soft: rgba(0, 255, 224, 0.45);
  --ktf-neon-strong: rgba(0, 255, 224, 0.75);
}
.ktf-neon-pulse--green{
  --ktf-neon-main: var(--ktf-green);
  --ktf-neon-soft: rgba(0, 255, 103, 0.45);
  --ktf-neon-strong: rgba(0, 255, 103, 0.75);
}
.ktf-neon-pulse--yellow{
  --ktf-neon-main: var(--ktf-yellow);
  --ktf-neon-soft: rgba(249, 255, 0, 0.45);
  --ktf-neon-strong: rgba(249, 255, 0, 0.75);
}




/* ========================================================================== */
/* Corner navigation stars (Home: About + Contact) + subpage Home star         */
/* ========================================================================== */

#ktf-corner-stars{
  position:fixed;
  inset:0;
  pointer-events:none;
  z-index:2147483000;
}

.ktf-corner-star{
  position:fixed;
  top:calc(14px + env(safe-area-inset-top));
  width:clamp(70px, 6.0vw, 104px);
  pointer-events:auto;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:flex-start;
  gap:6px;
  opacity:.75;
  transition: opacity .18s ease, transform .18s ease;
  transform:translate3d(0,0,0);
  animation: ktfCornerWrapFloat 7.4s ease-in-out infinite;
}

.ktf-corner-star--about{ left:calc(14px + env(safe-area-inset-left)); --ktf-corner-in-x:-26px; --ktf-corner-in-y:-22px; --ktf-corner-in-rot:-18deg; }
.ktf-corner-star--contact{ right:calc(14px + env(safe-area-inset-right)); --ktf-corner-in-x:26px; --ktf-corner-in-y:-22px; --ktf-corner-in-rot:18deg; }

/* Corner stars: phase offsets so they don't move in sync */
.ktf-corner-star--about{ left:calc(14px + env(safe-area-inset-left)); --ktf-corner-in-x:-26px; --ktf-corner-in-y:-22px; --ktf-corner-in-rot:-18deg; }
.ktf-corner-star--contact{ right:calc(14px + env(safe-area-inset-right)); --ktf-corner-in-x:26px; --ktf-corner-in-y:-22px; --ktf-corner-in-rot:18deg; }

.ktf-mini-star__icon{
  width:100%;
  aspect-ratio:1/1;
  display:block;
}
.ktf-mini-star__icon img{
  width:100%;
  height:100%;
  object-fit:contain;
  display:block;
  filter:
    drop-shadow(0 0 1px rgba(255,255,255,.78))
    drop-shadow(0 0 8px rgba(255,255,255,.36))
    drop-shadow(0 0 16px rgba(255,255,255,.18));
  animation: ktfCornerStarFloat 6.6s ease-in-out infinite;
  transition: transform .16s ease, filter .16s ease;
}

.ktf-mini-star__label{
  display:inline-block;
  padding:0;
  background:transparent;
  border:none;
  border-radius:0;

  font-size:9.75px;
  letter-spacing:.14em;
  text-transform:uppercase;
  line-height:1.15;
  color:#fff;
  opacity:.72;

  text-shadow:
    0 0 3px rgba(0,0,0,.92),
    0 0 12px rgba(255,255,255,.18),
    0 0 24px rgba(255,255,255,.10);

  box-shadow:none;
  backdrop-filter:none;
  pointer-events:none;
  will-change: transform, opacity;
  animation: ktfMiniLabelFloat 6.8s ease-in-out infinite;
}


/* Project-star label float (preserves centering: includes -50% X offset) */
@keyframes ktfProjectLabelFloat{
  0%,100%{ transform: translate3d(-50%,0,0) translate(var(--ktf-label-dx, 0px), var(--ktf-label-dy, 0px)); }
  50%{ transform: translate3d(-50%,-4px,0) translate(var(--ktf-label-dx, 0px), var(--ktf-label-dy, 0px)); }
}

@keyframes ktfMiniLabelFloat{
  0%,100%{ transform: translate3d(0,0,0); }
  50%{ transform: translate3d(0,-4px,0); }
}

@keyframes ktfCornerWrapFloat{
  0%,100%{ transform:translate3d(0,0,0); }
  50%{ transform:translate3d(0,-7px,0); }
}

body.ktf-hover-ready .ktf-corner-star:hover .ktf-mini-star__icon img,
.ktf-corner-star:focus-visible .ktf-mini-star__icon img,
body.ktf-hover-ready .ktf-home-star:hover .ktf-mini-star__icon img,
.ktf-home-star:focus-visible .ktf-mini-star__icon img{
  transform:translate3d(0,-1px,0) scale(1.08) rotate(2deg);
  filter:
    drop-shadow(0 0 3px rgba(255,255,255,.96))
    drop-shadow(0 0 16px rgba(255,255,255,.60))
    drop-shadow(0 0 28px rgba(255,255,255,.32));
}



body.ktf-hover-ready .ktf-corner-star:hover, .ktf-corner-star:focus-visible,
body.ktf-hover-ready .ktf-home-star:hover, .ktf-home-star:focus-visible,
.ktf-corner-star:active,
.ktf-home-star:active{
  opacity:1;
}


body.ktf-hover-ready .ktf-corner-star:hover .ktf-mini-star__label,
.ktf-corner-star:focus-visible .ktf-mini-star__label,
body.ktf-hover-ready .ktf-home-star:hover .ktf-mini-star__label,
.ktf-home-star:focus-visible .ktf-mini-star__label{
  text-shadow:
    0 0 3px rgba(0,0,0,.95),
    0 0 12px rgba(255,255,255,.26),
    0 0 22px rgba(255,255,255,.18);

  opacity:1;
  background:transparent;
  transform:translate3d(0,-1px,0);
}

@keyframes ktfCornerStarFloat{
  0%,100%{ transform:translate3d(0,0,0) scale(1) rotate(0deg); }
  50%{ transform:translate3d(0,-5px,0) scale(1.03) rotate(-1.6deg); }
}

.ktf-home-star{
  position:fixed;
  top:calc(16px + env(safe-area-inset-top));
  right:calc(16px + env(safe-area-inset-right));
  width:clamp(60px, 5.0vw, 88px);
  z-index:2147483000;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:flex-start;
  gap:6px;
  opacity:.75;
  transition: opacity .18s ease, transform .18s ease;
  pointer-events:auto;
  border:none;
  background:transparent;
  animation: ktfCornerWrapFloat 7.2s ease-in-out infinite;
  animation-delay:-2.2s;
  -webkit-tap-highlight-color:transparent;
}

.ktf-home-star .ktf-mini-star__icon img{ animation-duration: 6.2s; }




/* Home: corner stars fade-in */
body.home:not(.ktf-home-ready) .ktf-corner-star,
body.front-page:not(.ktf-home-ready) .ktf-corner-star{
  opacity:0;
  transform: translate3d(var(--ktf-corner-in-x,0), var(--ktf-corner-in-y,0),0) scale(.12) rotate(var(--ktf-corner-in-rot,-120deg));
  filter: blur(12px);
}

body.home:not(.ktf-home-ready) .ktf-home-star,
body.front-page:not(.ktf-home-ready) .ktf-home-star{
  opacity:0;
  transform:translate3d(0,-10px,0) scale(.68) rotate(-10deg);
}

body.home.ktf-home-ready .ktf-corner-star,
body.front-page.ktf-home-ready .ktf-corner-star{
  animation: ktfHomeCornerIn 780ms cubic-bezier(.22,1.06,.24,1) both, ktfCornerWrapFloat 7.2s ease-in-out infinite;
  animation-delay: .32s, -2.2s;
}
body.home.ktf-home-ready .ktf-corner-star:nth-child(2),
body.front-page.ktf-home-ready .ktf-corner-star:nth-child(2){ animation-delay: .44s, -4.6s; }
body.home.ktf-home-ready .ktf-corner-star:nth-child(3),
body.front-page.ktf-home-ready .ktf-corner-star:nth-child(3){ animation-delay: .56s, -1.4s; }

body.home.ktf-home-ready .ktf-home-star,
body.front-page.ktf-home-ready .ktf-home-star{
  animation: ktfHomeHomeStarIn 820ms cubic-bezier(.22,1.06,.24,1) both, ktfCornerWrapFloat 7.2s ease-in-out infinite;
  animation-delay: .46s, -2.2s;
}
@media (max-width:600px){
  .ktf-corner-star{ width:72px; top:calc(12px + env(safe-area-inset-top)); }
  .ktf-home-star{ width:64px; top:calc(14px + env(safe-area-inset-top)); right:calc(14px + env(safe-area-inset-right)); }
  .ktf-mini-star__label{ font-size:9.75px; letter-spacing:.14em; padding:0; }
}

/* ========================================================================== */
/* Gutenberg alignment fixes (center alignment should always work)             */
/* ========================================================================== */

.wp-block-image.aligncenter,
.wp-block-image.is-style-center,
.entry-content .wp-block-image.aligncenter{
  text-align:center;
}

/* If another plugin/theme style forces blocks full-width, the 'center' alignment can look like it does nothing.
   Table display shrink-wraps the figure so margin:auto can actually center it. */
figure.aligncenter,
.wp-block-image.aligncenter,
.entry-content figure.aligncenter,
.entry-content .wp-block-image.aligncenter{
  display: table !important;
  float: none !important;
  width: auto !important;
  max-width: 100%;
  margin-left: auto !important;
  margin-right: auto !important;
}

/* Editor mirror */
body.block-editor-page .editor-styles-wrapper figure.aligncenter,
body.block-editor-page .editor-styles-wrapper .wp-block-image.aligncenter{
  display: table !important;
  float: none !important;
  width: auto !important;
  max-width: 100%;
  margin-left: auto !important;
  margin-right: auto !important;
}

.wp-block-image.aligncenter img,
.entry-content .wp-block-image.aligncenter img{
  margin-left:auto !important;
  margin-right:auto !important;
}

.aligncenter{
  margin-left:auto !important;
  margin-right:auto !important;
}

.wp-block-buttons.is-content-justification-center{
  justify-content:center;
}

/* Some blocks (Kadence + core) apply center via text-align classes; make images/buttons honor that. */
.has-text-align-center img{
  margin-left:auto !important;
  margin-right:auto !important;
}

/* Buttons: ensure the container actually centers its children when 'center' is chosen in the editor. */
.wp-block-buttons.aligncenter,
.wp-block-buttons.is-content-justification-center{
  display:flex;
  justify-content:center !important;
}

/* In the editor, core wraps blocks in extra divs; flex-centering is the most reliable. */
body.block-editor-page .editor-styles-wrapper .wp-block-image.aligncenter{
  display:flex !important;
  justify-content:center !important;
}

/* Editor (Gutenberg) wrapper hardening: keep alignment controls working */
body.block-editor-page .editor-styles-wrapper .wp-block-buttons.is-content-justification-center,
body.block-editor-page .editor-styles-wrapper .is-layout-flex.is-content-justification-center{
  justify-content:center !important;
}
body.block-editor-page .editor-styles-wrapper .is-layout-flex.is-content-justification-right{ justify-content:flex-end !important; }
body.block-editor-page .editor-styles-wrapper .is-layout-flex.is-content-justification-left{ justify-content:flex-start !important; }
body.block-editor-page .editor-styles-wrapper .aligncenter{
  margin-left:auto !important;
  margin-right:auto !important;
}


/* Flex layout justification helpers (Gutenberg) */
.is-layout-flex.is-content-justification-center{ justify-content:center !important; }
.is-layout-flex.is-content-justification-right{ justify-content:flex-end !important; }
.is-layout-flex.is-content-justification-left{ justify-content:flex-start !important; }
.has-text-align-center{ text-align:center !important; }

/* Harden generic block centering so editor alignment controls never feel "stuck left" */
.entry-content .wp-block.aligncenter{ margin-left:auto !important; margin-right:auto !important; }

/* Ensure centering works inside layout wrappers */
.entry-content .wp-block-group.aligncenter,
.entry-content .wp-block-columns.aligncenter{
  margin-left:auto !important;
  margin-right:auto !important;
  text-align:center !important;
}
.entry-content .wp-block-group.aligncenter > *,
.entry-content .wp-block-columns.aligncenter > *{
  margin-left:auto !important;
  margin-right:auto !important;
}

.entry-content .wp-block.has-text-align-center{ text-align:center !important; }