/* KHEROON — editorial page-to-page logo transition, 2026
   Self-contained, does not change existing layouts or other animations. */
.kheroon-page-veil {
  --kv-ivory: #f8f4ed;
  --kv-ink: #102d51;
  --kv-gold: #ac8040;
  --kv-gold-soft: #dec7a0;
  position: fixed;
  inset: 0;
  z-index: 2147483000;
  display: grid;
  place-items: center;
  isolation: isolate;
  overflow: hidden;
  width: 100%;
  height: 100%;
  height: 100dvh;
  background: var(--kv-ivory);
  background-image: radial-gradient(ellipse 57% 54% at 50% 49%, #fffdf8 0%, #faf7f1 49%, #eee6d9 100%);
  color: var(--kv-ink);
  pointer-events: auto;
  transform: translateZ(0);
  animation: kv-arrive 0.94s cubic-bezier(.3,.02,.28,1) both;
  -webkit-font-smoothing: antialiased;
}
.kheroon-page-veil::before,
.kheroon-page-veil::after {
  content: '';
  position: absolute;
  z-index: 0;
  inset: 23px;
  border: 1px solid rgba(172,128,64,.14);
  pointer-events: none;
}
.kheroon-page-veil::after { inset: 29px; border-color: rgba(172,128,64,.065); }
.kv-corner {
  position: absolute;
  width: 24px;
  height: 24px;
  border: 1px solid var(--kv-gold);
  opacity: .28;
}
.kv-corner--tl { top: 23px;left: 23px;border-right: 0;border-bottom: 0; }
.kv-corner--tr { top: 23px;right: 23px;border-left: 0;border-bottom: 0; }
.kv-corner--bl { bottom: 23px;left: 23px;border-top: 0;border-right: 0; }
.kv-corner--br { bottom: 23px;right: 23px;border-left: 0;border-top: 0; }
.kv-center {
  position: relative;
  z-index: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  transform: translateY(-4px);
  width: min(440px, 85vw);
}
.kv-crest {
  width: 178px;
  height: 160px;
  display: grid;
  place-items: center;
  position: relative;
}
.kv-aura {
  position: absolute;
  width: 142px;
  aspect-ratio: 1;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(234,211,170,.38) 0%, rgba(235,211,169,.13) 44%, transparent 72%);
  filter: blur(6px);
  animation: kv-breathe 2.6s ease-in-out infinite alternate;
}
.kv-circle {
  position: absolute;
  width: 133px;
  height: 133px;
  border-radius: 50%;
  border: 1px solid rgba(172,128,64,.22);
}
.kv-circle--outer {
  width: 156px;
  height: 156px;
  border-color: rgba(172,128,64,.11);
}
.kv-circle--orbit {
  border: 1px solid transparent;
  border-top-color: var(--kv-gold);
  border-right-color: rgba(172,128,64,.35);
  animation: kv-orbit 2.8s linear infinite;
}
.kv-spark { position: absolute; width: 4px;height: 4px;background: var(--kv-gold);transform: rotate(45deg);opacity:.75; }
.kv-spark--one { top: 17px;right: 25px; }
.kv-spark--two { bottom: 23px;left: 22px; width: 3px;height: 3px;opacity:.45; }
.kv-lotus {
  position: relative;
  z-index: 2;
  width: 111px;
  height: auto;
  max-height: 80px;
  object-fit: contain;
  filter: drop-shadow(0 2px 5px rgba(172,128,64,.11));
  animation: kv-mark-appear .65s cubic-bezier(.16,1,.3,1) both;
}
.kv-wordmark {
  width: min(290px, 72vw);
  height: auto;
  max-height: 54px;
  object-fit: contain;
  margin-top: 1px;
  animation: kv-word-appear .68s cubic-bezier(.16,1,.3,1) .08s both;
}
.kv-rule { width: 123px;height: 1px;margin-top: 29px;overflow:hidden;background:rgba(172,128,64,.2); }
.kv-rule::before {content:'';display:block;height:100%;width:100%;background:var(--kv-gold);transform-origin:left;animation:kv-line 1.25s cubic-bezier(.22,1,.36,1) both;}
.kv-copy {margin: 15px 0 0; font-family: Georgia, 'Times New Roman', serif;font-size: 10px;letter-spacing: .35em;text-indent: .35em;text-align:center;color: #927a56;text-transform: uppercase;opacity:0;animation:kv-caption .57s ease .23s both;}
.kv-lower {position:absolute;bottom:clamp(51px,7vh,90px);left:0;right:0;text-align:center;font-family:Arial,Helvetica,sans-serif;font-weight:400;letter-spacing:.24em;font-size:8px;color:rgba(16,45,81,.50);}
.kheroon-page-veil.is-leaving { animation: kv-cover .51s cubic-bezier(.25,.72,.2,1) both; pointer-events:all; }
.kheroon-page-veil.is-leaving .kv-lotus { animation: kv-mark-appear .52s cubic-bezier(.16,1,.3,1) .10s both; }
.kheroon-page-veil.is-leaving .kv-wordmark { animation: kv-word-appear .52s cubic-bezier(.16,1,.3,1) .15s both; }
.kheroon-page-veil.is-leaving .kv-copy { animation: kv-caption .42s ease .20s both; }
.kheroon-page-veil.is-leaving .kv-rule::before { animation: kv-line .52s ease .12s both; }
.kheroon-page-veil.is-finished {animation:none !important;opacity:0 !important;visibility:hidden !important;pointer-events:none !important;}
@keyframes kv-arrive { 0%{opacity:1;visibility:visible;clip-path:inset(0 0 0 0)} 44%{opacity:1;visibility:visible;clip-path:inset(0 0 0 0)} 100%{opacity:1;visibility:hidden;clip-path:inset(0 0 100% 0)} }
@keyframes kv-cover { from{opacity:1;visibility:visible;clip-path:inset(100% 0 0 0)} to{opacity:1;visibility:visible;clip-path:inset(0 0 0 0)} }
@keyframes kv-mark-appear {from{opacity:0;transform:translateY(13px) scale(.80);filter:blur(3px)} to{opacity:1;transform:translateY(0) scale(1);filter:drop-shadow(0 2px 5px rgba(172,128,64,.11))} }
@keyframes kv-word-appear {from{opacity:0;transform:translateY(12px);filter:blur(3px)} to{opacity:1;transform:translateY(0);filter:blur(0)} }
@keyframes kv-caption {from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:translateY(0)} }
@keyframes kv-orbit {from{transform:rotate(0deg)}to{transform:rotate(360deg)} }
@keyframes kv-breathe {from{transform:scale(.93);opacity:.65}to{transform:scale(1.09);opacity:1} }
@keyframes kv-line {from{transform:scaleX(0)}to{transform:scaleX(1)} }
@media(max-width:600px){
  .kheroon-page-veil::before {inset:14px;} .kheroon-page-veil::after{inset:20px;}
  .kv-corner--tl{top:14px;left:14px}.kv-corner--tr{top:14px;right:14px}.kv-corner--bl{bottom:14px;left:14px}.kv-corner--br{bottom:14px;right:14px}
  .kv-crest{width:162px;height:152px}.kv-lotus{width:99px}.kv-wordmark{width:min(258px,74vw)}
  .kv-copy{letter-spacing:.24em;text-indent:.24em}.kv-lower{bottom:55px}
}
@media(prefers-reduced-motion:reduce){
 .kheroon-page-veil{display:none!important;animation:none!important;visibility:hidden!important;pointer-events:none!important;}
 .kheroon-page-veil *{animation:none!important;transition:none!important;}
}