/* Founding block: two meridian lines cross at Kyiv, in the colours of the Ukrainian flag.
   Fonts and base colours match the live site; adapt class names when integrating. */
@font-face{font-family:"IZAR Machina";src:url('/assets/fonts/neue-machina-plain-regular-r39.woff2') format('woff2');font-display:swap}
@font-face{font-family:"IZAR Mori";src:url('/assets/fonts/mori-regular-r39.woff2') format('woff2');font-display:swap}
:root{--font-body:"IZAR Mori",Arial,sans-serif;--font-display:"IZAR Machina","IZAR Mori",sans-serif}

.origin{--blue:#3d8bff;--yellow:#ffd500;--paper:#efeff7;--muted:#c2bccc;
  position:relative;overflow:hidden;background:#1c1924;color:var(--paper);font-family:var(--font-body);
  padding:clamp(56px,8vw,120px) 5vw clamp(44px,6vw,84px)}
/* Meridian of Kyiv */
.origin::after{content:"";position:absolute;pointer-events:none;top:0;bottom:0;left:var(--cross-x,71%);width:2px;margin-left:-1px;background:var(--yellow);transform-origin:top;animation:origin-y 1.6s .15s cubic-bezier(.2,.7,.2,1) both}
/* Parallel of Kyiv: sits in the flow so it never strikes through the coordinates */
.origin-parallel{position:relative;height:2px;margin:clamp(26px,3.4vw,50px) -5vw}
.origin-parallel::before{content:"";position:absolute;inset:0;background:var(--blue);transform-origin:left;animation:origin-x 1.6s cubic-bezier(.2,.7,.2,1) both}
.origin-mark{position:absolute;left:var(--cross-x,71%);top:50%;width:9px;height:9px;margin:-4.5px 0 0 -4.5px;border-radius:50%;background:var(--paper);z-index:1}
.origin-mark::after{content:"";position:absolute;inset:-9px;border:1px solid var(--paper);border-radius:50%;opacity:0;animation:origin-pulse 3.6s 1.6s ease-out infinite}
.origin-label{position:relative;z-index:1;margin:0 0 clamp(24px,3vw,44px);font-size:12px;letter-spacing:.09em;text-transform:uppercase;color:var(--muted)}
.origin-coords{position:relative;z-index:1;display:block;width:max-content;max-width:100%;color:inherit;text-decoration:none;
  font-family:var(--font-display);font-weight:400;font-size:clamp(34px,7.4vw,124px);line-height:1;letter-spacing:-.045em;font-variant-numeric:tabular-nums}
.origin-coords span{display:block}
.origin-coords span+span{margin-top:.08em}
.origin-coords:hover{color:#ae8afa}
.origin-coords:focus-visible{outline:3px solid #8346df;outline-offset:5px}
.origin-place{position:relative;z-index:1;margin:0;font-size:clamp(17px,1.6vw,23px);line-height:1.35;letter-spacing:-.02em}
.origin-place time{color:var(--muted)}
@keyframes origin-x{from{transform:scaleX(0)}to{transform:scaleX(1)}}
@keyframes origin-y{from{transform:scaleY(0)}to{transform:scaleY(1)}}
@keyframes origin-pulse{0%{transform:scale(.4);opacity:.7}60%,100%{transform:scale(1.5);opacity:0}}
@media(prefers-reduced-motion:reduce){.origin-parallel::before,.origin::after,.origin-mark::after{animation:none}}
.reduced .origin-parallel::before,.reduced .origin::after,.reduced .origin-mark::after{animation:none}
@media(max-width:650px){.origin{--cross-x:84%}.origin-coords{font-size:clamp(33px,11.4vw,60px)}}