/* v3.4 · Three switchable themes: classic (default, original aurism.si gold-on-dark), crimson, kids.
   html[data-theme] is set by the inline head script before first paint. Loaded after site.css / community.css. */
:root,html[data-theme=classic]{--bg:#0a0806;--bg2:#120d08;--ink:#f6efe4;--mut:#b8a998;--line:rgba(245,181,68,.18);--acc:#F5B544;--acc2:#ff8a1f;--acc-ink:#1a0d02;--link:#F5B544;--dark:#F5B544;--on-dark:#1a0d02;--surf:#14100b;--surf2:#1b150e;--field:#100c08;--fline:rgba(245,181,68,.32);--grad:linear-gradient(100deg,#ffd27a,#F5B544 35%,#ff8a1f 70%,#e2461b);--btn-bg:linear-gradient(100deg,#ffd27a,#F5B544 35%,#ff8a1f 70%,#e2461b);--btn-glow:0 10px 40px -10px rgba(245,138,31,.7);--r:22px;--fd:'Syne',system-ui,sans-serif;--fb:Inter,system-ui,sans-serif;--hcase:uppercase;--hw:800;--sh:0 10px 40px -18px rgba(0,0,0,.8);color-scheme:dark}
html[data-theme=crimson]{--bg:#0b0809;--bg2:#141011;--ink:#f3ece9;--mut:#b9abaa;--line:rgba(200,22,48,.24);--acc:#c8102e;--acc2:#e0233f;--acc-ink:#fff;--link:#ff6b7d;--dark:#c8102e;--on-dark:#fff;--surf:#151112;--surf2:#1d1718;--field:#0f0c0d;--fline:rgba(220,40,64,.38);--grad:linear-gradient(100deg,#ff8a8a,#e0233f 40%,#8b0a1c);--btn-bg:linear-gradient(180deg,#d4142f,#9c0c22);--btn-glow:0 12px 40px -12px rgba(200,16,46,.75);--r:6px;--fd:'Playfair Display',Georgia,serif;--fb:Inter,system-ui,sans-serif;--hcase:none;--hw:700;--sh:0 10px 40px -18px rgba(0,0,0,.9);color-scheme:dark}
html[data-theme=kids]{--bg:#fff9f3;--bg2:#eef6ff;--ink:#2a2150;--mut:#574f7d;--line:#e6dcf5;--acc:#ff6fa8;--acc2:#ff5498;--acc-ink:#2a0717;--link:#b0246a;--dark:#6c4cf5;--on-dark:#fff;--surf:#fff;--surf2:#fdf2ff;--field:#fff;--fline:#d8cbef;--grad:linear-gradient(100deg,#ff6fa8,#ffb86b 50%,#7b5cff);--btn-bg:linear-gradient(180deg,#ff8dbb,#ff5f9f);--btn-glow:0 10px 24px -8px rgba(255,95,159,.6);--r:22px;--fd:'Baloo 2','Fredoka',system-ui,sans-serif;--fb:'Baloo 2','Fredoka',system-ui,sans-serif;--hcase:none;--hw:800;--sh:0 8px 24px -10px rgba(91,60,170,.25);color-scheme:light}
body{background:var(--bg);color:var(--ink);font-family:var(--fb);transition:background .3s,color .3s}
html[data-theme=kids] body{font-size:17px}
h1,h2,h3{font-family:var(--fd);font-weight:var(--hw);text-transform:var(--hcase)}
html[data-theme=classic] h1,html[data-theme=classic] h2{letter-spacing:-.02em}
html[data-theme=crimson] h1,html[data-theme=crimson] h2{letter-spacing:.005em;font-weight:700}
.foot h2,.h4,.foot h2{font-family:var(--fb);text-transform:uppercase}
a{color:var(--link)}
:focus-visible{outline-color:var(--acc)}
/* header */
.topbar{background:color-mix(in srgb,var(--bg) 88%,transparent);backdrop-filter:blur(10px);border-bottom-color:var(--line)}
.logo{color:var(--ink);font-family:var(--fd)}.logo b{color:var(--acc)}
html[data-theme=crimson] .logo{letter-spacing:.18em;font-weight:700}
.mainnav a{color:var(--mut)}.mainnav a:hover,.mainnav a.on,.mainnav a[aria-current]{color:var(--ink);background:var(--surf2)}
html[data-theme=classic] .mainnav a:hover{color:var(--acc)}
@media(max-width:800px){.topbar.open .mainnav{background:var(--bg)}}
.menu-t{color:var(--ink)}
/* surfaces that were hard-coded white */
.btn,.tile,.chips button,.chips a,.card,.panel,.authcard,.catnav,.bigsearch,.bigsearch select,.filters select,.tools select,.iconbtn,.iconbtn[disabled],.searchbox,.umenu .menu,.soonlist li,.pager a,.wcard{background:var(--surf);color:var(--ink);border-color:var(--line)}
.catnav{background:var(--bg)}
.thumb,.dprev,.k-audio .thumb,.dprev.k-audio{background:var(--surf2)}.fileic,.tab .n{color:var(--mut)}
.form input:not([type=checkbox]):not([type=hidden]),.form textarea,.form select,.field input,.field textarea,.field select,.searchbox input,.bigsearch input{background:var(--field);color:var(--ink);border-color:var(--fline)}
.ddesc p,.page p,.page li{color:var(--ink);opacity:.92}
.bigsearch button,.play,.pager a[aria-current],.chips a[aria-pressed=true],.chips button[aria-pressed=true]{background:var(--dark);color:var(--on-dark);border-color:var(--dark)}
.guestnote,.flash.info{background:color-mix(in srgb,var(--acc) 14%,var(--surf));border-color:color-mix(in srgb,var(--acc) 40%,transparent);color:var(--ink)}
.sec.alt,.foot{background:var(--bg2)}.foot nav a,.fcontact a{color:var(--ink)}
.tile .ic{color:var(--acc)}
/* buttons */
.btn{border-radius:999px;font-weight:600;transition:box-shadow .3s,transform .3s,background .3s}
.btn:hover{background:var(--surf2);border-color:var(--acc)}
.btn.primary,.btn.primary:hover{background:var(--btn-bg);color:var(--acc-ink);border:0;box-shadow:var(--btn-glow)}
.btn.primary:hover{transform:translateY(-1px);filter:brightness(1.06)}
html[data-theme=crimson] .btn{border-radius:3px;letter-spacing:.06em;text-transform:uppercase;font-size:14px}
html[data-theme=crimson] .btn.primary{color:#fff}
html[data-theme=kids] .btn{border-radius:999px;font-weight:700;font-size:17px;border-width:2px}
html[data-theme=kids] .btn.primary:hover{transform:translateY(-3px) scale(1.03)}
/* hero */
.hero{min-height:min(88vh,860px);display:flex;align-items:flex-end;background-color:var(--bg)}
.hero .wrap{padding:clamp(110px,14vw,170px) 0 clamp(60px,9vh,110px)}
.hero:before{background:linear-gradient(180deg,color-mix(in srgb,var(--bg) 70%,transparent) 0%,color-mix(in srgb,var(--bg) 13%,transparent) 35%,color-mix(in srgb,var(--bg) 80%,transparent) 78%,var(--bg) 100%),radial-gradient(ellipse at 30% 80%,color-mix(in srgb,var(--bg) 80%,transparent),transparent 60%)}
html[data-theme=classic] .hero h1{font-size:clamp(34px,5.6vw,92px);line-height:.92;letter-spacing:-.035em;max-width:1100px}
html[data-theme=classic] .hero p{color:#e9dccb}
html[data-theme=crimson] .hero h1{font-size:clamp(36px,5.4vw,84px);line-height:1.02;font-style:italic;max-width:1000px}
html[data-theme=crimson] .hero p{color:#e6d9d6}
/* v3.4 hero backgrounds per theme: Classic = original loop, Crimson = red stage (still + loop), Kids = pastel sky still */
.hero-media .hm{display:none;position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
html[data-theme=crimson] .hero,html[data-theme=kids] .hero{background-image:none}
html[data-theme=crimson] #hv,html[data-theme=kids] #hv{display:none}
html[data-theme=crimson] .hero-media .hm-crimson{display:block;object-position:50% 70%}
html[data-theme=kids] .hero-media .hm-kids{display:block;object-position:50% 60%}
/* the red stage is already dark: a lighter wash than the Classic video needs, so the neon stays visible; text sits on the dark floor.
   v3.4b: lighter top wash + softer edge vignette over the brightened stage; the text-side shade stays (readability) */
html[data-theme=crimson] .hero:before{background:linear-gradient(180deg,rgba(11,8,9,.3) 0%,rgba(11,8,9,0) 18%,rgba(11,8,9,0) 62%,rgba(11,8,9,.6) 88%,var(--bg) 100%),radial-gradient(ellipse at 25% 75%,rgba(11,8,9,.5),transparent 55%)}
@media(max-width:800px){html[data-theme=crimson] .hero-media .hm-crimson{object-position:86% 70%}html[data-theme=kids] .hero-media .hm-kids{object-position:6% 60%}}
html[data-theme=crimson] .hero:after{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;box-shadow:inset 0 0 140px 24px rgba(0,0,0,.75)}
/* v3.4b mobile: the desktop vignette covered most of a 390px-wide hero and hid the neon pillar; keep it thin, and centre the text shade under the copy */
@media(max-width:800px){html[data-theme=crimson] .hero:after{box-shadow:inset 0 0 50px 6px rgba(0,0,0,.6)}html[data-theme=crimson] .hero:before{background:linear-gradient(180deg,rgba(11,8,9,.3) 0%,rgba(11,8,9,0) 16%,rgba(11,8,9,0) 40%,rgba(11,8,9,.58) 56%,rgba(11,8,9,.62) 85%,var(--bg) 100%)}html[data-theme=crimson] .hero p{text-shadow:0 1px 10px rgba(0,0,0,.85)}}
html[data-theme=crimson] .hero h1:after{content:"";display:block;width:90px;height:3px;margin-top:22px;background:var(--acc)}
.btn.light{color:#fff;border-color:rgba(255,255,255,.55);background:rgba(255,255,255,.04)}
/* overlays (classic + crimson) */
.th-grain{position:fixed;inset:-50%;z-index:90;pointer-events:none;opacity:.07;background:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='160' height='160'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/></filter><rect width='100%' height='100%' filter='url(%23n)'/></svg>");animation:thgr 1s steps(6) infinite}
@keyframes thgr{0%{transform:translate(0,0)}20%{transform:translate(-4%,3%)}40%{transform:translate(3%,-5%)}60%{transform:translate(-6%,2%)}80%{transform:translate(5%,4%)}}
.th-leak{position:fixed;z-index:89;pointer-events:none;width:70vmax;height:70vmax;border-radius:50%;filter:blur(90px);mix-blend-mode:screen;opacity:.16;background:radial-gradient(circle,#ff8a1f,transparent 65%);top:-30vmax;right:-25vmax;animation:thlk 14s ease-in-out infinite alternate}
.th-leak.b{background:radial-gradient(circle,#e2461b,transparent 65%);bottom:-35vmax;left:-30vmax;top:auto;right:auto;animation-duration:19s}
@keyframes thlk{to{transform:translate(-12vw,14vh) scale(1.2);opacity:.26}}
html[data-theme=crimson] .th-grain{opacity:.1}
html[data-theme=crimson] .th-leak{background:radial-gradient(circle,#b0001c,transparent 65%);opacity:.14}
html[data-theme=crimson] .th-leak.b{background:radial-gradient(circle,#5a0010,transparent 65%)}
html[data-theme=crimson] body:after{content:"";position:fixed;inset:0;z-index:88;pointer-events:none;background:radial-gradient(ellipse at center,transparent 60%,rgba(0,0,0,.45) 100%)}
html[data-theme=kids] .th-grain,html[data-theme=kids] .th-leak{display:none}
/* kids: sky hero, clouds, characters */
.kids-sky,.kid{display:none}
html[data-theme=kids] .hero{background:none;color:var(--ink)}
/* v3.4: pastel sky picture (.hm-kids) under light drifting clouds; a soft ivory wash on the left keeps the navy copy readable */
html[data-theme=kids] .hero:before{background:linear-gradient(90deg,rgba(255,249,243,.78) 0%,rgba(255,249,243,.5) 42%,rgba(255,249,243,0) 72%),linear-gradient(0deg,rgba(255,249,243,.55),rgba(255,249,243,0) 30%)}
@media(max-width:800px){html[data-theme=kids] .hero:before{background:linear-gradient(0deg,rgba(255,249,243,.85) 0%,rgba(255,249,243,.6) 45%,rgba(255,249,243,0) 75%)}}
html[data-theme=kids] .kids-sky{display:block;position:absolute;inset:0;z-index:-2;overflow:hidden;pointer-events:none}
.cloud{position:absolute;width:220px;height:70px;border-radius:70px;background:#fff;opacity:.55;filter:drop-shadow(0 10px 14px rgba(120,100,200,.15));animation:drift 40s linear infinite}
.cloud:before,.cloud:after{content:"";position:absolute;background:#fff;border-radius:50%}
.cloud:before{width:100px;height:100px;left:30px;top:-50px}.cloud:after{width:80px;height:80px;left:110px;top:-34px}
.cloud.c1{top:16%;left:-240px}.cloud.c2{top:52%;left:-240px;transform:scale(.7);animation-duration:55s;animation-delay:-20s}.cloud.c3{top:30%;left:-240px;transform:scale(.5);animation-duration:70s;animation-delay:-45s;opacity:.45}
@keyframes drift{to{left:110%}}
html[data-theme=kids] .hero h1{font-size:clamp(34px,5vw,66px);line-height:1.08;max-width:780px;color:#2a2150}
html[data-theme=kids] .hero p{color:#3d3466;font-size:clamp(18px,1.7vw,22px)}
html[data-theme=kids] .hero .wrap{position:relative;z-index:2}
html[data-theme=kids] .hero .btn.light{color:var(--ink);border-color:#fff;background:rgba(255,255,255,.7)}
html[data-theme=kids] .kid{display:block;position:absolute;z-index:1;pointer-events:none;width:var(--w,150px);height:auto;aspect-ratio:var(--ar,auto);animation:bob var(--d,5s) ease-in-out infinite;animation-delay:var(--dl,0s)}
/* v3.3: 3D characters (<model-viewer>, loaded only in Kids); the poster <img> stays until the model has loaded */
model-viewer.kid{background:transparent;--poster-color:transparent;opacity:0;transition:opacity .6s ease;clip-path:inset(2px)} /* inset hides 1px edge bleed when the GPU renders at reduced scale */
model-viewer.kid.on{opacity:1}
model-viewer.kid::part(default-progress-bar){display:none}
html[data-theme=kids] img.kid.off{visibility:hidden}
@keyframes bob{0%,100%{transform:translateY(0) rotate(var(--rt,-3deg))}50%{transform:translateY(-16px) rotate(calc(var(--rt,-3deg) * -1))}}
html[data-theme=kids] .sec,html[data-theme=kids] .page,html[data-theme=kids] main>section{position:relative}
html[data-theme=kids] .svc img,html[data-theme=kids] .card,html[data-theme=kids] .tile,html[data-theme=kids] .panel{border-radius:22px}
html[data-theme=kids] .tile,html[data-theme=kids] .card{border-width:2px;transition:transform .35s cubic-bezier(.34,1.56,.64,1),box-shadow .3s}
html[data-theme=kids] .tile:hover,html[data-theme=kids] .card:hover{transform:translateY(-5px) rotate(-.6deg);box-shadow:var(--sh)}
html[data-theme=kids] .sechead h2{color:#5b3fd6}
html[data-theme=kids] .topbar{background:rgba(255,249,243,.9)}
@media(max-width:800px){html[data-theme=kids] .kid.hide-m{display:none}}
@media(max-width:1100px){html[data-theme=kids] .kid.side{display:none}}
/* settings button + panel */
.set-btn{display:inline-flex;align-items:center;gap:6px;background:none;border:0;color:var(--mut);font-size:15px;font-weight:500;padding:8px 12px;border-radius:6px;font-family:inherit}
.set-btn:hover{color:var(--ink);background:var(--surf2)}.set-btn svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.8}
.set-dlg{border:1px solid var(--line);border-radius:16px;padding:0;width:min(560px,94vw);background:var(--surf);color:var(--ink);box-shadow:0 30px 80px -20px rgba(0,0,0,.6);font-family:var(--fb)}
.set-dlg::backdrop{background:rgba(0,0,0,.5);backdrop-filter:blur(3px)}
.set-hd{display:flex;align-items:center;justify-content:space-between;padding:18px 22px;border-bottom:1px solid var(--line)}
.set-hd h2{font-size:20px;text-transform:none;font-family:var(--fb);font-weight:700}
.set-x{background:none;border:0;color:var(--mut);font-size:26px;line-height:1;width:36px;height:36px;border-radius:8px}.set-x:hover{background:var(--surf2);color:var(--ink)}
.set-bd{padding:18px 22px 24px}.set-bd h3{font:600 13px var(--fb);text-transform:uppercase;letter-spacing:.08em;color:var(--mut);margin:0 0 12px}
.set-opts{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;border:0;margin:0;padding:0}
@media(max-width:480px){.set-opts{grid-template-columns:1fr}}
.set-opt{position:relative;display:block;cursor:pointer;border:2px solid var(--line);border-radius:12px;overflow:hidden;background:var(--bg);transition:border-color .2s,transform .2s}
.set-opt:hover{transform:translateY(-2px)}.set-opt input{position:absolute;opacity:0}
.set-opt:has(input:checked){border-color:var(--acc);box-shadow:0 0 0 3px color-mix(in srgb,var(--acc) 30%,transparent)}
.set-opt:has(input:focus-visible){outline:2px solid var(--acc);outline-offset:2px}
.sw{display:block;height:74px;position:relative}
.sw i{position:absolute;display:block}
.sw .t{left:10px;top:12px;font-style:normal;font-size:20px;line-height:1}
.sw .d{left:10px;bottom:12px;width:56%;height:8px;border-radius:4px}
.sw .c{right:10px;bottom:10px;width:22px;height:22px;border-radius:50%}
.sw-classic{background:radial-gradient(circle at 80% 20%,rgba(255,138,31,.35),transparent 60%),#0a0806}.sw-classic .t{font-family:Syne,sans-serif;font-weight:800;color:#F5B544}.sw-classic .d{background:linear-gradient(100deg,#ffd27a,#F5B544,#ff8a1f,#e2461b)}.sw-classic .c{background:#F5B544;box-shadow:0 0 10px #F5B544}
.sw-crimson{background:radial-gradient(circle at 75% 25%,rgba(200,16,46,.45),transparent 60%),#0b0809}.sw-crimson .t{font-family:'Playfair Display',serif;font-style:italic;color:#f3ece9}.sw-crimson .d{background:#c8102e}.sw-crimson .c{background:#2a1416;border:2px solid #c8102e}
.sw-kids{background:linear-gradient(160deg,#ffd6e8,#e3d4ff 50%,#c9e8ff)}.sw-kids .t{font-family:'Baloo 2',sans-serif;font-weight:800;color:#5b3fd6}.sw-kids .d{background:#ff6fa8}.sw-kids .c{background:#ffe066;border:2px solid #fff}
.set-opt b{display:block;padding:8px 10px 2px;font-size:14px;color:var(--ink)}.set-opt small{display:block;padding:0 10px 10px;font-size:12px;color:var(--mut)}
.set-note{margin:14px 0 0;font-size:13px;color:var(--mut)}
@media(prefers-reduced-motion:reduce){.th-grain,.th-leak,.kids-sky,.cloud,.kid,html[data-theme=kids] .kid{animation:none!important}.set-opt,.btn,.tile,.card{transition:none!important}}
/* v3.4 · home "Meet the studio" block: one host picture per theme (only the active one is shown and downloaded) */
.hostgrid{display:grid;grid-template-columns:1.1fr .9fr;gap:clamp(28px,5vw,64px);align-items:center}
.hosttext h2{font-size:clamp(26px,3vw,34px)}
.hosttext p{color:var(--mut);margin:12px 0 0;max-width:560px}
.hosttext .btns{margin-top:24px}
.hostfig{margin:0;justify-self:end;width:min(100%,440px)}
.hostfig .hp{display:none;width:100%;height:auto;border-radius:var(--r);box-shadow:var(--sh)}
html[data-theme=classic] .hp-classic,html[data-theme=crimson] .hp-crimson,html[data-theme=kids] .hp-kids{display:block}
html[data-theme=crimson] .hp-crimson{border:1px solid var(--line)}
html[data-theme=kids] .hp-kids{width:auto;max-width:100%;max-height:440px;margin:0 auto;border-radius:0;box-shadow:none;filter:drop-shadow(0 14px 18px rgba(91,60,170,.22))}
html[data-theme=kids] .hostfig{background:radial-gradient(ellipse at 50% 60%,#fdf2ff,transparent 70%)}
.hostfig figcaption{font-size:13px;color:var(--mut);margin-top:10px;text-align:center}
@media(max-width:800px){.hostgrid{grid-template-columns:1fr}.hostfig{justify-self:center;width:min(100%,360px)}html[data-theme=kids] .hp-kids{max-height:340px}}
/* v3.4 · Our Work: "Coming soon" over the golden studio door (always light text on the dark picture) */
.owhero{position:relative;isolation:isolate;overflow:hidden;background:#050403;color:#f6efe4;min-height:min(70vh,640px);display:flex;align-items:center}
.owmedia{position:absolute;inset:0;z-index:-2}
.owmedia img,.owmedia video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 55%}
/* v3.4b: lighter left shade over the brightened door; a short top fade hides the render's ceiling strip */
.owhero:before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,rgba(5,4,3,.4),rgba(5,4,3,0) 40%),linear-gradient(180deg,rgba(5,4,3,.7),rgba(5,4,3,0) 14%),linear-gradient(0deg,var(--bg),rgba(5,4,3,0) 18%)}
.owtext{padding:72px 0}
.owtext h1{font-size:clamp(34px,5vw,64px);color:#fff;max-width:36%}
.owtext .lead{font-size:clamp(18px,1.8vw,22px);color:#e9dccb;margin:12px 0 0}
html[data-theme=crimson] .owtext h1{font-style:italic}
.owpage{padding-top:40px}
@media(max-width:800px){.owhero{min-height:520px;align-items:flex-start}.owtext{padding:44px 0}.owtext h1{max-width:none}.owmedia img,.owmedia video{object-position:50% 80%}}
@media(prefers-reduced-motion:reduce){#ow-v,#hv-crimson{display:none!important}}