/* Original Kairos clockwork, preserved from the supplied site. */
.original-wheel{display:block;width:100%;height:100%;overflow:visible;filter:drop-shadow(0 0 12px #b8935e20)}
.original-wheel text{font-family:var(--serif)}
.preload-gear-slow,.preload-gear-inner{transform-origin:250px 250px;transform-box:view-box;will-change:transform}
.preload-gear-slow{animation:kairos-original-turn 38s linear infinite}
.preload-gear-inner{animation:kairos-original-return 20s linear infinite}
@keyframes kairos-original-turn{to{transform:rotate(360deg)}}
@keyframes kairos-original-return{to{transform:rotate(-360deg)}}
.hero-orbit{inset:-3%;opacity:1;pointer-events:none;z-index:1}
.hero-orbit .original-wheel{filter:drop-shadow(0 6px 12px #1f3d320a)}
.hero-orbit .preload-gear-slow{animation-duration:44s}
.hero-orbit .preload-gear-inner{animation:kairos-hero-inner 28s linear infinite}
.hero-orbit .original-wheel text{display:none}
.hero-orbit .original-wheel [fill^="url"]{opacity:0}
@keyframes kairos-hero-inner{from{transform:rotate(0) scale(1.4)}to{transform:rotate(-360deg) scale(1.4)}}
.hero-main-photo{inset:16%;border:7px solid var(--paper);box-shadow:0 20px 55px #14332820;background:#162b22}
.hero-main-photo:hover>img,.hero-art:hover .hero-main-photo img{transform:none}
/* Real photographs in stacked layers: no hard cuts, no image stretch. */
[data-cinema-slideshow]{isolation:isolate;overflow:hidden;position:relative}
.hero-main-photo[data-cinema-slideshow],.hero-inset[data-cinema-slideshow]{position:absolute}
.cinema-frame{position:absolute;inset:0;opacity:0;z-index:0;transition:opacity 2.35s cubic-bezier(.4,0,.2,1);pointer-events:none}
.cinema-frame.is-current{opacity:1;z-index:2}
.cinema-frame.is-leaving{opacity:0;z-index:3}
.cinema-frame>img{width:100%;height:100%;max-width:none;object-fit:cover;object-position:50% 52%;transform:scale(1.02);transition:none!important}
.cinema-frame.is-current>img,.cinema-frame.is-leaving>img{animation:kairos-cinema-drift 12s cubic-bezier(.2,.45,.4,1) both}
.cinema-frame:nth-child(even).is-current>img,.cinema-frame:nth-child(even).is-leaving>img{animation-name:kairos-cinema-drift-back}
@keyframes kairos-cinema-drift{from{transform:scale(1.02) translate3d(.4%,.5%,0)}to{transform:scale(1.105) translate3d(-.7%,-.8%,0)}}
@keyframes kairos-cinema-drift-back{from{transform:scale(1.09) translate3d(-.5%,.6%,0)}to{transform:scale(1.025) translate3d(.6%,-.4%,0)}}
.hero-main-photo::after{content:'';position:absolute;inset:0;border-radius:inherit;z-index:4;pointer-events:none;box-shadow:inset 0 0 30px #07171025}
.hero-inset{left:-2%;bottom:0;width:27%;border-width:6px;animation:float 10s ease-in-out infinite;background:var(--green)}
.hero-inset .cinema-frame>img{object-position:center}
/* The original wordmark is optically centred inside the small seal. It never rotates. */
.hero-seal{top:1%;right:0;display:grid;place-items:center;transform:none;width:114px;height:114px;padding:18px;appearance:none;cursor:pointer;color:var(--green);box-shadow:0 7px 30px #14332808;font-family:var(--sans)}
.hero-seal:hover{background:var(--paper);border-color:var(--orange)}
.hero-seal>.seal-inner{display:flex;flex-direction:column;align-items:center;justify-content:center;width:100%;gap:9px;transform:none}
.hero-seal .seal-inner>img{width:100%;height:auto;max-width:82px;object-fit:contain}
.hero-seal .seal-inner>span{font-size:6px;line-height:1.6;letter-spacing:.12em;text-align:center;white-space:nowrap}
.hero-seal .seal-inner>i{font:normal 21px/1 var(--serif);color:var(--orange)}
.hero-photo-caption{left:27%;bottom:-12%;width:74%;gap:14px;padding-right:5px;align-items:center}
.hero-photo-caption>span{font-size:8px;letter-spacing:.12em;font-variant-numeric:tabular-nums}
.hero-photo-caption p{font-size:20px;line-height:1.2}
.hero-cinema-buttons{position:absolute;left:36%;bottom:-23%;display:flex;align-items:center;gap:12px}
.hero-cinema-buttons .icon-button{width:36px;height:36px;border:1px solid #b8935e50;border-radius:50%;background:transparent;padding:9px;color:var(--green);opacity:.85;position:static}
.hero-cinema-buttons .icon-button:hover{background:var(--paper);border-color:var(--gold);opacity:1}
.hero-cinema-buttons .icon-button svg{width:17px;height:17px}
.hero-cinema-buttons .cinema-previous>svg{transform:rotate(180deg)}
.hero-grid{padding-bottom:140px}
.hero-watermark{opacity:.025}
/* The restored entry is a deliberate opening scene, with the original wheel. */
.cinema-intro{background:radial-gradient(ellipse at 48% 40%,#2c4a38 0,#193a2c 44%,#10281f 100%);gap:16px;padding:clamp(24px,5svh,50px) 24px;justify-content:center}
.cinema-intro::before,.cinema-intro::after{content:'';position:absolute;left:0;right:0;height:clamp(12px,4svh,36px);background:#0c2219;z-index:7;pointer-events:none}
.cinema-intro::before{top:0;border-bottom:1px solid #b8935e35}
.cinema-intro::after{bottom:0;border-top:1px solid #b8935e35}
.cinema-intro .intro-grain{opacity:.2;z-index:5;pointer-events:none}
.intro-label{position:relative;z-index:6;font-size:9px;line-height:1.6;letter-spacing:.26em;color:#d2b27e;text-align:center;margin-bottom:0;animation:logo-in 1.4s .15s both}
.cinema-intro .intro-clock{position:relative;width:min(59svh,520px,85vw);height:auto;aspect-ratio:1;flex-shrink:0;margin:0;animation:clock-in 1.8s cubic-bezier(.18,.65,.3,1) both}
.cinema-intro .intro-clock>.original-wheel>text:nth-of-type(1){opacity:0}
.intro-center-brand{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:29%;z-index:3;display:grid;place-items:center;filter:drop-shadow(0 3px 18px #0004)}
.intro-center-brand>img{width:100%;height:auto}
.intro-dish{position:absolute;width:27%;aspect-ratio:1;border:3px solid #b8935e75;border-radius:50%;background:var(--deep);z-index:4;box-shadow:0 20px 50px #06150e65}
.intro-dish-one{left:-8%;top:13%;animation:kairos-dish-float 10s ease-in-out infinite}
.intro-dish-two{right:-9%;bottom:9%;width:29%;animation:kairos-dish-float 12s -4s ease-in-out infinite}
@keyframes kairos-dish-float{50%{transform:translate3d(0,-8px,0)}}
.cinema-intro .intro-tag{position:relative;z-index:6;font:italic 24px/1.35 var(--serif);color:var(--cream);text-align:center;margin:0;animation:logo-in 1.4s .35s both}
.intro-actions{position:relative;z-index:6;display:flex;align-items:center;gap:20px;margin-top:8px}
.cinema-intro .intro-skip{position:static;bottom:auto;min-height:48px;padding:10px 4px;gap:36px;font-size:11px;letter-spacing:.05em;background:transparent;border-bottom:1px solid var(--gold)}
.intro-actions .intro-motion{color:var(--gold);border:1px solid #b8935e60;border-radius:50%;width:38px;height:38px}
.intro-actions .intro-motion svg{width:18px;height:18px}
.cinema-intro.is-leaving{animation:kairos-cinema-curtain .85s cubic-bezier(.7,0,.25,1) forwards}
.cinema-intro.is-leaving .intro-clock{transform:scale(1.05);opacity:.1;transition:opacity .6s,transform .85s}
@keyframes kairos-cinema-curtain{from{clip-path:inset(0 0 0 0)}to{clip-path:inset(0 0 100% 0)}}
.cinema-reveal .hero-copy{animation:kairos-copy-enter 1.45s .2s cubic-bezier(.2,.65,.3,1) both}
.cinema-reveal .hero-art{animation:kairos-art-enter 1.8s .1s cubic-bezier(.2,.65,.3,1) both}
@keyframes kairos-copy-enter{from{opacity:0;transform:translateY(22px)}to{opacity:1;transform:translateY(0)}}
@keyframes kairos-art-enter{from{opacity:0;transform:scale(.95) translateY(14px)}to{opacity:1;transform:scale(1) translateY(0)}}
@media(max-width:1200px){.hero-seal{width:100px;height:100px;padding:17px}.hero-photo-caption{bottom:-15%;left:24%}.hero-photo-caption p{font-size:18px}.hero-cinema-buttons{bottom:-28%;left:34%}}
@media(max-width:1050px){.hero-seal{width:89px;height:89px;padding:14px}.hero-seal>.seal-inner{gap:7px}.hero-seal .seal-inner>span{font-size:5px}.hero-seal .seal-inner>i{font-size:17px}.hero-photo-caption{bottom:-21%;left:25%;width:72%}.hero-photo-caption p{font-size:19px}.hero-cinema-buttons{bottom:-37%;left:31%}.hero-grid{padding-bottom:165px}}
@media(max-width:800px){.hero-grid{padding-bottom:155px}.hero-seal{width:78px;height:78px;padding:13px;right:0;top:0}.hero-seal>.seal-inner{gap:5px}.hero-seal .seal-inner>span{font-size:4.5px}.hero-seal .seal-inner>i{font-size:15px}.hero-photo-caption{bottom:-24%;left:24%;width:74%}.hero-photo-caption p{font-size:17px}.hero-cinema-buttons{bottom:-43%;left:29%;gap:8px}.hero-cinema-buttons .icon-button{width:33px;height:33px;padding:8px}}
@media(max-width:640px){.hero-grid{padding-bottom:145px}.hero-art{width:min(345px,88%);margin-top:45px}.hero-main-photo{inset:16%;border-width:5px}.hero-inset{width:28%;left:-3%;bottom:-1%;border-width:4px}.hero-seal{width:85px;height:85px;padding:14px;right:-1%;top:0;outline-width:5px}.hero-seal>.seal-inner{gap:7px}.hero-seal .seal-inner>span{font-size:5px}.hero-seal .seal-inner>i{font-size:16px}.hero-photo-caption{left:23%;bottom:-21%;width:79%;text-align:left;display:block;padding-right:0}.hero-photo-caption>span{font-size:7px;display:block;margin-bottom:7px}.hero-photo-caption p{font-size:18px;max-width:240px}.hero-cinema-buttons{bottom:-39%;left:34%;gap:13px}.hero-cinema-buttons .icon-button{width:36px;height:36px;padding:9px}.cinema-intro{gap:18px;padding:30px 20px}.intro-label{font-size:8px;letter-spacing:.2em}.cinema-intro .intro-clock{width:min(85vw,48svh,400px);margin:0;min-width:0}.intro-dish-one{left:-4%;top:6%;width:26%}.intro-dish-two{right:-4%;bottom:4%;width:27%}.intro-dish{border-width:2px}.cinema-intro .intro-tag{font-size:22px;max-width:95%;margin:0}.cinema-intro .intro-skip{font-size:11px;gap:30px;min-height:48px}.intro-actions{margin-top:6px;gap:16px}}
@media(max-width:360px){.hero-art{width:87%}.hero-seal{width:73px;height:73px;padding:12px}.hero-seal>.seal-inner{gap:5px}.hero-seal .seal-inner>span{font-size:4.5px}.hero-seal .seal-inner>i{font-size:14px}.hero-photo-caption p{font-size:17px}.hero-cinema-buttons{bottom:-43%;left:30%;gap:11px}.hero-grid{padding-bottom:150px}.cinema-intro .intro-tag{font-size:20px}}
@media(max-height:520px) and (min-width:641px){.cinema-intro{gap:6px;padding:15px}.cinema-intro .intro-clock{width:64svh}.cinema-intro .intro-tag{font-size:18px}.intro-label{font-size:7px}.intro-actions{margin-top:0}.cinema-intro .intro-skip{min-height:36px;padding:5px;font-size:10px}}
@media(prefers-reduced-motion:reduce){.cinema-intro:not([hidden]){display:flex!important}.cinema-frame{transition:none}.cinema-frame>img{animation:none!important;transform:none!important}.hero-orbit g,.intro-clock g{animation:none!important}.hero-art .hero-inset,.intro-dish{animation:none!important}.cinema-reveal .hero-copy,.cinema-reveal .hero-art{animation:none!important}}
/* Keep the word KAIROS itself on the exact centre of its circular seal. */
.hero-seal>.seal-inner{position:relative;height:100%;display:block}
.hero-seal .seal-inner>img{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:100%;max-width:none}
.hero-seal .seal-inner>span{position:absolute;left:50%;top:calc(50% + 14px);transform:translateX(-50%);width:100%;font-size:5px;line-height:1.5;letter-spacing:.1em}
.hero-seal .seal-inner>i{display:none}
@media(max-width:1050px){.hero-seal .seal-inner>span{top:calc(50% + 11px);font-size:4.5px}}
@media(max-width:800px){.hero-seal .seal-inner>span{top:calc(50% + 9px);font-size:4px}}
@media(max-width:640px){.hero-seal .seal-inner>span{top:calc(50% + 11px);font-size:4.5px}}
@media(max-width:360px){.hero-seal .seal-inner>span{top:calc(50% + 9px);font-size:4px}}
.hero-seal>.seal-inner{position:absolute;inset:16%;width:auto;height:auto;display:block}

.cinema-intro .intro-auto-note{position:relative;z-index:6;margin:0;font:400 9px/1.6 var(--sans);letter-spacing:.04em;color:#d2b27e;text-align:center}
@media(max-width:640px){.cinema-intro .intro-auto-note{font-size:8px;max-width:90%}}
