/* Omair Studio – front end */
.os-room{--os-accent:var(--omair-accent,#6D3FD9);--os-accent-light:var(--omair-accent-light,#B79CFF);--os-bg:var(--omair-bg,#0D0C14);--os-ink:var(--omair-ink,#F2F0F7);--os-mute:var(--omair-mute,#A49FB8);
	position:relative;width:100vw;max-width:100vw;margin-left:calc(50% - 50vw);margin-right:calc(50% - 50vw);
	height:100vh;height:100svh;min-height:560px;overflow:hidden;background:var(--os-bg);color:var(--os-ink);
	font-family:Manrope,system-ui,-apple-system,"Segoe UI",sans-serif;box-sizing:border-box;isolation:isolate}
.os-room *,.os-room *::before,.os-room *::after{box-sizing:border-box}
.os-room::before{content:"";position:absolute;left:0;right:0;top:0;height:46%;z-index:2;pointer-events:none;
	background:linear-gradient(180deg,rgba(13,12,20,.92) 0%,rgba(13,12,20,.55) 55%,rgba(13,12,20,0) 100%)}

/* Theme resets (Astra / Elementor style buttons and links globally) */
.os-room button{all:unset;cursor:pointer;font:inherit}
.os-room a{text-decoration:none;box-shadow:none}
.os-room h1,.os-room h3,.os-room p{margin:0;padding:0;border:0}

.os-bar{position:absolute;top:0;left:0;right:0;z-index:4;display:flex;align-items:center;justify-content:space-between;
	gap:16px;padding:18px clamp(16px,3vw,40px)}
.os-logo{font-family:Syne,Manrope,sans-serif;font-size:20px;font-weight:500;color:var(--os-ink);letter-spacing:-.01em}
.os-hl{color:var(--os-accent-light)}
.os-nav{display:flex;gap:26px}
.os-room .os-nav button{font-size:14px;color:var(--os-mute);transition:color .2s}
.os-room .os-nav button:hover,.os-room .os-nav button:focus-visible{color:var(--os-accent-light)}
.os-room .os-pill{background:var(--os-accent);color:#fff;border-radius:999px;padding:10px 20px;font-size:14px;font-weight:500;transition:transform .2s,filter .2s}
.os-room .os-pill:hover{filter:brightness(1.12);transform:translateY(-1px);color:#fff}

.os-intro{position:absolute;z-index:3;top:clamp(78px,11vh,120px);left:clamp(16px,3vw,40px);max-width:min(520px,86vw);pointer-events:none}
.os-room .os-h1{font-family:Syne,Manrope,sans-serif;font-weight:500;font-size:clamp(30px,4.4vw,60px);line-height:1.04;letter-spacing:-.02em;color:var(--os-ink)}
.os-room .os-sub{margin-top:14px;font-size:clamp(14px,1.2vw,17px);line-height:1.6;color:var(--os-mute);max-width:420px}

.os-pan{position:absolute;inset:0;z-index:1;overflow-x:auto;overflow-y:hidden;scrollbar-width:none;-webkit-overflow-scrolling:touch}
.os-pan::-webkit-scrollbar{display:none}
.os-svg{display:block;width:100%;height:100%}
.os-hint{display:none}

/* SVG paint helpers */
.os-fa{fill:var(--os-accent)}
.os-fl{fill:var(--os-accent-light)}
.os-tb{font-family:Manrope,sans-serif}
.os-td{font-family:Syne,Manrope,sans-serif}

/* Hotspots */
.os-hs{cursor:pointer;outline:none}
.os-ol{fill:none;stroke:var(--os-accent-light);stroke-width:1.5;opacity:0;transition:opacity .2s}
.os-hs:hover .os-ol,.os-hs:focus-visible .os-ol{opacity:1}
.os-dot{fill:var(--os-accent-light)}
.os-pu{fill:var(--os-accent-light);transform-box:fill-box;transform-origin:center;animation:os-pulse 1.8s ease-out infinite}
@keyframes os-pulse{0%{transform:scale(1);opacity:.9}100%{transform:scale(4);opacity:0}}
.os-ribbon{cursor:pointer}
.os-ribbon:hover rect,.os-ribbon:hover polygon{filter:brightness(1.15)}

/* Omair at work */
.os-hand-l{animation:os-tap-a .5s linear infinite}
.os-hand-r{animation:os-tap-b .5s linear infinite}
@keyframes os-tap-a{0%,50%,100%{transform:translateY(0)}25%{transform:translateY(-2px)}}
@keyframes os-tap-b{0%,50%,100%{transform:translateY(0)}75%{transform:translateY(-2px)}}
.os-head{transform-box:view-box;transform-origin:385px 222px;animation:os-nod 4s ease-in-out infinite}
@keyframes os-nod{0%,100%{transform:rotate(0)}50%{transform:rotate(1.5deg)}}
.os-type{transform-box:fill-box;transform-origin:left center;animation:os-type 3s steps(12) infinite}
@keyframes os-type{0%{transform:scaleX(0)}80%,100%{transform:scaleX(1)}}
.os-caret{animation:os-blink .8s step-end infinite}
@keyframes os-blink{50%{opacity:0}}

/* Info card */
.os-card{position:absolute;z-index:10;left:50%;top:50%;transform:translate(-50%,-46%);width:min(440px,calc(100vw - 32px));
	background:#F4F1EA;color:#16131F;border-radius:20px;padding:24px 26px;font-size:14px;line-height:1.6;
	box-shadow:0 30px 80px rgba(0,0,0,.45);opacity:0;transition:opacity .25s,transform .25s}
.os-card[hidden]{display:none}
.os-card.is-open{opacity:1;transform:translate(-50%,-50%)}
.os-room .os-x{position:absolute;right:16px;top:12px;font-size:22px;line-height:1;color:#7C7890}
.os-tag{display:inline-block;font-size:12px;color:var(--os-accent);background:color-mix(in srgb,var(--os-accent) 12%,#fff);border-radius:999px;padding:3px 11px}
.os-room .os-title{font-family:Syne,Manrope,sans-serif;font-weight:500;font-size:24px;line-height:1.2;margin:12px 0 2px;color:#16131F}
.os-meta{font-size:13px;color:#6B6780;margin-bottom:6px}
.os-meta:empty{display:none}
.os-room .os-body{color:#2A2638;margin-top:6px}
.os-chips{display:flex;flex-wrap:wrap;gap:6px;margin-top:14px}
.os-chips span{font-size:12px;border:1px solid #D9D2E6;border-radius:999px;padding:3px 10px;color:#4A4560}
.os-room .os-go{display:inline-block;margin-top:18px;background:var(--os-accent);color:#fff;border-radius:999px;padding:9px 18px;font-size:13px;font-weight:500}
.os-room .os-go:hover{color:#fff;filter:brightness(1.12)}

/* Tablet and mobile: room becomes wider than the screen and pans sideways */
@media (max-width:900px){
	.os-nav{display:none}
	.os-svg{width:calc(100svh * 1.619);min-width:100%}
	.os-hint{display:block;position:absolute;z-index:3;left:0;right:0;bottom:14px;text-align:center;font-size:12px;color:var(--os-mute);pointer-events:none;margin:0}
}

@media (prefers-reduced-motion:reduce){
	.os-pu,.os-hand-l,.os-hand-r,.os-head,.os-type,.os-caret{animation:none}
	.os-card{transition:none}
}

/* Theme overrides: Astra underlines links inside page content */
.os-room a,.os-room a:hover,.os-room a:focus{text-decoration:none!important}
.os-room .os-pill,.os-room .os-pill:hover,.os-room .os-go,.os-room .os-go:hover{color:#fff!important}
/* Logged-in admin bar takes 32px (46px on mobile) */
body.admin-bar .os-room{height:calc(100svh - 32px)}
@media (max-width:782px){body.admin-bar .os-room{height:calc(100svh - 46px)}}