@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Manrope:wght@400;500;600;700;800&display=swap');
:root{color-scheme:dark;--bg:#101015;--panel:#1b1b23;--ink:#f6f5fa;--muted:#b0aebb;--line:#36343f;--accent:#b7a4ff;--button-ink:#181025;--soft:#17171e}
:root[data-theme=light]{color-scheme:light;--bg:#f7f8fc;--panel:#fff;--ink:#20212d;--muted:#5c5b6b;--line:#dadce8;--accent:#6542c9;--button-ink:#fff;--soft:#eeeff6}
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:30px}body{margin:0;background:var(--bg);color:var(--ink);font:16px/1.6 'DM Sans',Arial,sans-serif}a{color:inherit;text-decoration:none}button{font:inherit;cursor:pointer}a:focus-visible,button:focus-visible{outline:3px solid var(--accent);outline-offset:5px}header,main,footer{max-width:1520px;margin:auto}header{padding:26px 6%;display:flex;align-items:center;gap:30px;border-bottom:1px solid var(--line)}.wordmark{font:800 30px 'Manrope',Arial,sans-serif;letter-spacing:-1.5px}.wordmark span{font:12px Arial;vertical-align:top;color:var(--accent);margin-left:5px}nav{margin-left:auto;display:flex;flex-wrap:wrap;align-items:center;gap:28px;font-size:14px}nav a{min-height:44px;display:inline-flex;align-items:center}.nav-contact{border-bottom:1px solid var(--accent)}.theme-toggle{border:1px solid var(--line);color:var(--ink);background:var(--panel);border-radius:30px;min-height:44px;padding:9px 17px;font-size:14px;white-space:nowrap}.hero{padding:64px 6% 60px;display:grid;grid-template-columns:1.35fr 1fr;align-items:end;gap:50px}.eyebrow{color:var(--muted);font-size:12px;letter-spacing:2px;font-weight:600}h1,h2,h3,p{margin:0}h1{font:600 clamp(56px,7.1vw,104px)/1.02 'Manrope',sans-serif;letter-spacing:-.055em;margin:24px 0}em{color:var(--accent);font-style:normal}.hero-title{font-size:22px;line-height:1.45}.hero-bottom{padding-bottom:5px}.hero-bottom>p{color:var(--muted);font-size:18px;max-width:380px;margin-bottom:25px}.button{display:inline-flex;align-items:center;justify-content:center;min-height:48px;background:var(--accent);color:var(--button-ink);padding:13px 24px;border-radius:8px;font-weight:600}.hero-index{display:flex;flex-wrap:wrap;gap:15px;margin-top:40px;font-size:12px;color:var(--muted)}.hero-index span+span{border-left:1px solid var(--line);padding-left:15px}.numbers{display:none}.work{padding:55px 6% 65px;background:var(--soft)}.section-heading{display:flex;justify-content:space-between;align-items:end;gap:30px;margin-bottom:32px}h2{font:500 clamp(32px,3.6vw,52px)/1.15 'Manrope',sans-serif;letter-spacing:-.035em;margin-top:15px;overflow-wrap:anywhere}.section-heading p{max-width:340px;color:var(--muted)}.filters{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:32px}.filters button{border:1px solid var(--line);background:var(--panel);color:var(--muted);min-height:44px;padding:9px 17px;border-radius:7px;font-size:14px}.filters button.active{background:var(--ink);color:var(--bg);border-color:var(--ink)}.filters span{margin-left:8px;font-size:12px;opacity:.7}.project-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:30px 22px}.project{min-width:0}.logo-panel{height:250px;display:flex;align-items:center;justify-content:center;border:1px solid var(--line);border-radius:12px;background:var(--panel);padding:30px;position:relative;overflow:hidden}.logo-panel.has-logo{background:#090909;border-color:#292929}.logo-panel img{width:100%;height:100%;object-fit:contain;transition:transform .35s}.project:hover .logo-panel img{transform:scale(1.045)}.brand-fallback{text-align:center;font:600 clamp(24px,2.5vw,36px)/1.2 'Manrope',sans-serif;color:var(--ink);letter-spacing:-1px;overflow-wrap:anywhere}.logo-status{position:absolute;bottom:14px;left:18px;font-size:12px;color:var(--muted)}.project-top{display:flex;gap:14px;align-items:start;justify-content:space-between;margin-top:18px}.project h3{font:600 18px/1.4 'Manrope',sans-serif;overflow-wrap:anywhere}.platform{font-size:12px;color:var(--accent);white-space:nowrap;padding-top:4px}.project p{font-size:14px;color:var(--muted);margin-top:4px}.project:nth-child(3n+2) .logo-panel:not(.has-logo){background:var(--bg)}.result-count{margin-top:24px;color:var(--muted);font-size:14px}.websites{padding:65px 6%}.website-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:25px}.site-art{height:310px;display:flex;flex-direction:column;justify-content:space-between;padding:30px;border-radius:12px;overflow:hidden}.gold .site-art{background:#242016;color:#dbbd78}.blue .site-art{background:#bccef1;color:#1a3268}.site-art strong{font:500 70px/1 'Manrope',sans-serif;letter-spacing:-3px}.gold .site-art strong{font-family:Georgia,serif}.site-domain,.site-caption{font-size:12px;letter-spacing:2px}.site-info{padding:20px 0;display:flex;justify-content:space-between;align-items:center;gap:20px;border-bottom:1px solid var(--line)}.site-info h3{font-size:22px}.site-info p{font-size:14px;color:var(--muted)}.visit{font-size:14px;border-bottom:1px solid var(--accent);white-space:nowrap}.about{margin:0 6%;padding:55px 0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:60px;border-top:1px solid var(--line)}.about-copy p{font-size:18px;color:var(--muted);margin-bottom:20px}.capabilities{display:flex;flex-wrap:wrap;gap:8px}.capabilities span{padding:7px 12px;background:var(--soft);border-radius:7px;font-size:14px}.contact{margin:20px 6% 55px;padding:40px;border:1px solid var(--line);background:var(--panel);border-radius:12px}.contact p{margin-top:20px;color:var(--muted)}.contact-links{display:flex;flex-wrap:wrap;gap:18px 24px;margin-top:25px}.contact-links a{display:inline-flex;align-items:center;min-height:44px;border-bottom:1px solid var(--accent);overflow-wrap:anywhere;min-width:0;color:var(--ink)}footer{padding:0 6% 32px;display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:18px}footer>span,footer>a:last-child{font-size:14px;color:var(--muted)}footer>a:last-child{min-height:44px;display:inline-flex;align-items:center}[hidden]{display:none!important}
.intro-loader{position:fixed;inset:0;z-index:1000;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:28px;padding:24px;background:var(--bg);opacity:1;visibility:visible;transition:opacity .45s,visibility .45s;pointer-events:none}.intro-loader.is-finished{opacity:0;visibility:hidden}.intro-loading{overflow:hidden}.loader-circle{position:relative;width:min(240px,70vw);aspect-ratio:1;display:grid;place-items:center}.loader-ring{position:absolute;inset:0;border:2px solid var(--line);border-top:3px solid var(--accent);border-right-color:var(--accent);border-radius:50%;animation:loader-spin 1.2s linear infinite}.loader-name{text-align:center;font:500 clamp(24px,6vw,32px)/1.35 'Manrope',sans-serif;letter-spacing:-1px}.loader-name strong{color:var(--accent)}.loader-label{font-size:12px;letter-spacing:2px;text-align:center;color:var(--muted)}@keyframes loader-spin{to{transform:rotate(360deg)}}
@media(max-width:1000px){header{gap:20px}nav{gap:18px}.hero{gap:30px}.project-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.logo-panel{height:280px}.brand-fallback{font-size:32px}}
@media(max-width:700px){header{padding:18px 5%;flex-wrap:wrap;justify-content:space-between}nav{order:3;margin:0;width:100%;justify-content:space-between;gap:12px}.theme-toggle{margin-left:auto}.hero{padding:38px 5%;grid-template-columns:1fr;gap:26px}h1{font-size:clamp(54px,13vw,86px)}.hero-title{font-size:20px}.hero-bottom>p{max-width:100%;font-size:16px}.hero-index{margin-top:24px}.work,.websites{padding:40px 5%}.section-heading{flex-direction:column;align-items:start;gap:18px}.section-heading p{max-width:100%}.logo-panel{height:220px;padding:25px}.brand-fallback{font-size:26px}.project-grid{gap:25px 15px}.project-top{flex-direction:column;gap:3px}.platform{padding:0}.website-grid,.about{grid-template-columns:1fr}.about{margin:0 5%;gap:25px;padding:40px 0}.contact{margin:15px 5% 40px;padding:25px}.contact h2{font-size:clamp(28px,6vw,42px)}.contact-links{flex-direction:column;align-items:flex-start;gap:12px}.site-info{flex-wrap:wrap}.site-art{height:280px}footer{padding:0 5% 25px}footer>span:nth-child(2){display:none}}
@media(max-width:440px){.project-grid{grid-template-columns:1fr}.logo-panel{height:265px}.project-top{flex-direction:row}.brand-fallback{font-size:32px}.site-art strong{font-size:60px}.filters{gap:8px}.filters button{padding:9px 12px}.contact-links a{font-size:15px}.hero-index{gap:10px}.hero-index span+span{padding-left:10px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{animation:none!important;transition:none!important}}
.website-preview{border:1px solid var(--line);border-radius:12px;overflow:hidden;background:var(--panel)}.browser-bar{height:38px;padding:0 16px;display:flex;align-items:center;gap:18px;color:var(--muted);font-size:12px}.browser-bar>span:first-child{letter-spacing:3px;font-size:9px}.website-preview>img{display:block;width:100%;height:auto;aspect-ratio:1270/714;object-fit:cover;object-position:top;transition:filter .2s}.website-card:hover .website-preview>img{filter:brightness(1.08)}.apps{padding:10px 6% 65px}.app-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:25px}.app-card{border:1px solid var(--line);border-radius:12px;overflow:hidden;background:var(--panel);min-width:0}.app-name-panel{height:260px;background:var(--soft);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:20px;padding:30px}.app-name-panel>strong{font:600 clamp(36px,5vw,64px)/1.1 'Manrope',sans-serif;letter-spacing:-2px;color:var(--accent)}.spades-panel{background:#171326}.spades-panel img{width:180px;height:180px;object-fit:contain}.app-copy{padding:25px}.app-copy h3{font-size:24px}.app-copy p{color:var(--muted);margin:12px 0 20px}.project-type{font-size:14px;color:var(--accent)}@media(max-width:1000px){header{flex-wrap:wrap}nav{gap:16px}.theme-toggle{margin-left:auto}}@media(max-width:700px){.apps{padding:10px 5% 40px}.app-grid{grid-template-columns:1fr}nav{justify-content:flex-start;gap:8px 22px}.app-name-panel{height:230px}} 
.theme-toggle{width:44px;height:44px;padding:10px;display:inline-flex;align-items:center;justify-content:center;border-radius:50%;flex-shrink:0}.theme-toggle svg{width:22px;height:22px;display:block}
.profile-link{display:inline-flex;align-items:center;min-height:44px;color:var(--accent);font-size:14px;text-decoration:underline;text-underline-offset:4px}
.logo-panel.has-logo img.b22-logo{width:250px;height:250px;max-width:none;clip-path:circle(38% at 50% 50%);border-radius:0}
@media(min-width:1001px){.project-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:28px 18px}.logo-panel{height:225px;padding:24px}.project-top{flex-wrap:wrap;gap:4px 12px}}
.profile-logo-link{display:block}.profile-logo-link:focus-visible{outline:3px solid var(--accent);outline-offset:5px;border-radius:12px}

/* Compact client gallery: give the artwork more room inside smaller cards. */
.project-grid{gap:22px 16px}.logo-panel{height:170px;padding:7px;border-radius:10px}.logo-panel img{display:block;max-width:100%;max-height:100%;object-fit:contain}.project-top{margin-top:12px;gap:4px 10px}.project h3{font-size:16px}.project p{font-size:12px;line-height:1.5}.platform{font-size:10px}.logo-panel.has-logo img.b22-logo{width:205px;height:205px;max-width:none;max-height:none;flex-shrink:0}.brand-fallback{font-size:24px}.logo-status{font-size:10px;bottom:10px;left:12px}@media(min-width:1001px){.project-grid{gap:22px 16px}.logo-panel{height:165px;padding:6px}}@media(max-width:700px){.logo-panel{height:155px;padding:6px}.logo-panel.has-logo img.b22-logo{width:185px;height:185px}.project-grid{gap:20px 12px}}@media(max-width:440px){.logo-panel{height:180px;padding:7px}.logo-panel.has-logo img.b22-logo{width:220px;height:220px}}

.contact-links a{gap:10px}.contact-icon{width:21px;height:21px;flex:0 0 21px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;color:var(--accent)}.contact-icon .icon-solid{fill:currentColor;stroke:none}.contact-links a span{min-width:0;overflow-wrap:anywhere}

/* Square client logo boxes at every breakpoint. */
.logo-panel{height:auto;aspect-ratio:1 / 1}.logo-panel img{width:100%;height:100%;min-height:0}.logo-panel.has-logo img.b22-logo{width:128%;height:auto;aspect-ratio:1 / 1;max-width:none;max-height:none;flex-shrink:0}

.logo-panel.has-logo img.gold-palace-logo{transform:scale(1.3)}.project:hover .logo-panel img.gold-palace-logo{transform:scale(1.35)}

/* Motion stays subtle and content remains visible without JavaScript. */
.motion-ready .reveal{opacity:0;transform:translateY(22px);transition:opacity .65s ease,transform .65s cubic-bezier(.2,.7,.2,1);transition-delay:var(--reveal-delay,0ms)}
.motion-ready .reveal.is-visible{opacity:1;transform:translateY(0)}
.button{transition:transform .2s,box-shadow .2s}.button:hover{transform:translateY(-3px);box-shadow:0 8px 25px color-mix(in srgb,var(--accent) 22%,transparent)}
.logo-panel{transition:border-color .25s,box-shadow .25s}.project:hover .logo-panel{border-color:var(--accent);box-shadow:0 8px 24px #00000020}
.website-preview,.app-card{transition:transform .25s,border-color .25s}.website-card:hover .website-preview,.app-card:hover{transform:translateY(-4px);border-color:var(--accent)}
.contact-icon{transition:transform .2s}.contact-links a:hover .contact-icon{transform:translateY(-2px)}
.filters button{transition:background .2s,color .2s,border-color .2s}.filters button:hover{border-color:var(--accent)}
@media(prefers-reduced-motion:reduce){.motion-ready .reveal{opacity:1;transform:none}.button:hover,.website-card:hover .website-preview,.app-card:hover,.contact-links a:hover .contact-icon{transform:none}}

.marketing-animation{width:min(100%,400px);margin:0 0 22px;color:var(--accent)}.marketing-animation svg{display:block;width:100%;height:auto;overflow:visible}.marketing-animation path{fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}.marketing-animation circle{fill:var(--panel);stroke:currentColor;stroke-width:1.5}.marketing-animation .megaphone-body{fill:var(--panel);stroke-width:2.5}.marketing-animation .campaign-halo{fill:none;stroke:var(--line);stroke-dasharray:3 7;transform-origin:84px 85px;animation:campaign-orbit 28s linear infinite}.campaign-lines path{stroke:var(--line);stroke-dasharray:5 7;animation:campaign-flow 3s linear infinite}.campaign-megaphone{animation:campaign-float 4s ease-in-out infinite}.campaign-signal{animation:campaign-pulse 2s ease-in-out infinite}.audience-dot{animation:campaign-glow 3s ease-in-out infinite}.audience-two{animation-delay:1s}.audience-three{animation-delay:2s}.marketing-animation .growth-line{stroke-dasharray:100;stroke-dashoffset:100;animation:campaign-growth 4s ease-in-out infinite}.marketing-animation text{fill:var(--muted);font:9px 'DM Sans',Arial,sans-serif;letter-spacing:1.3px}@keyframes campaign-orbit{to{transform:rotate(360deg)}}@keyframes campaign-flow{to{stroke-dashoffset:-48}}@keyframes campaign-float{50%{transform:translateY(-5px)}}@keyframes campaign-pulse{50%{opacity:.25}}@keyframes campaign-glow{50%{opacity:.5}}@keyframes campaign-growth{0%{stroke-dashoffset:100}45%,85%{stroke-dashoffset:0}100%{stroke-dashoffset:100}}@media(max-width:700px){.marketing-animation{width:min(100%,340px);margin-bottom:18px}}@media(prefers-reduced-motion:reduce){.marketing-animation .growth-line{stroke-dashoffset:0}}

.hero{position:relative;isolation:isolate;background-image:linear-gradient(90deg,rgba(16,16,21,.93),rgba(16,16,21,.73)),url('images/marketing-hero.png');background-size:cover;background-position:center;color:#f6f5fa}.hero .eyebrow,.hero .hero-bottom>p,.hero .hero-index{color:#d0cbdc}.hero em,.hero .marketing-animation{color:#b7a4ff}.hero .button{background:#b7a4ff;color:#181025}.hero .marketing-animation{--panel:#17171e;--line:#777080;--muted:#d0cbdc}.hero .hero-index span+span{border-color:#777080}:root[data-theme=light] .hero{background-image:linear-gradient(90deg,rgba(16,16,21,.88),rgba(16,16,21,.66)),url('images/marketing-hero.png')}@media(max-width:700px){.hero{background-position:65% center;background-image:linear-gradient(rgba(16,16,21,.86),rgba(16,16,21,.82)),url('images/marketing-hero.png')}}

.advertising-platforms{margin-top:24px;max-width:540px}.platforms-label{display:block;font-size:11px;letter-spacing:1.5px;text-transform:uppercase;color:#d0cbdc;margin-bottom:8px}.advertising-platforms p{font:600 clamp(15px,1.5vw,20px)/1.7 "Manrope",Arial,sans-serif}.advertising-platforms p span{color:#b7a4ff;margin:0 6px}@media(max-width:700px){.advertising-platforms{margin-top:18px}.advertising-platforms p span{margin:0 3px}}

/* Smaller brand cards while keeping four desktop columns. */
.project-grid{max-width:960px;margin-inline:auto;gap:20px 16px}.project h3{font-size:15px}.project-top{margin-top:10px}.logo-panel{padding:5px}.project p{font-size:12px}@media(min-width:1001px){.project-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:20px 16px}}@media(min-width:441px) and (max-width:1000px){.project-grid{max-width:600px}}@media(max-width:440px){.project-grid{max-width:260px;width:100%;margin-inline:auto}.project-top{flex-wrap:wrap}}

/* Fit the brand grid to the section, with five desktop columns. */
.project-grid{width:100%;max-width:none;margin-inline:0;gap:20px 14px}@media(min-width:1001px){.project-grid{grid-template-columns:repeat(5,minmax(0,1fr));gap:20px 14px}}@media(min-width:701px) and (max-width:1000px){.project-grid{grid-template-columns:repeat(3,minmax(0,1fr));max-width:none}}@media(min-width:441px) and (max-width:700px){.project-grid{grid-template-columns:repeat(2,minmax(0,1fr));max-width:none}}@media(max-width:440px){.project-grid{grid-template-columns:repeat(2,minmax(0,1fr));max-width:none;gap:18px 10px}.project-top{flex-direction:column;gap:3px}.project h3{font-size:13px}.project p{font-size:11px}.platform{font-size:9px}.logo-status{font-size:9px}.brand-fallback{font-size:18px}}

.trickster-identity{display:flex;align-items:center;gap:14px;margin:0 0 22px}.trickster-identity img{width:64px;height:64px;flex-shrink:0;filter:drop-shadow(0 0 12px #b7a4ff30)}.trickster-label{display:block;font-size:10px;letter-spacing:2px;color:#d0cbdc;margin-bottom:3px}.trickster-identity p{font:700 clamp(17px,2vw,26px)/1.3 'Manrope',Arial,sans-serif;color:#b7a4ff}@media(max-width:440px){.trickster-identity{gap:10px}.trickster-identity img{width:52px;height:52px}}

.candle-welcome{overflow:hidden}.candle-intro{position:fixed;inset:0;z-index:1100;background:#0c0b12;color:#f6f5fa;display:grid;place-items:center;padding:24px;overflow:auto;transition:opacity .6s,visibility .6s}.candle-intro.is-leaving{opacity:0;visibility:hidden;pointer-events:none}.candle-stage{text-align:center;width:min(100%,620px)}.candle-brand{display:block;font:700 14px 'Manrope',sans-serif;letter-spacing:6px;color:#b7a4ff;margin-bottom:30px}.candle-button{position:relative;display:block;width:190px;height:250px;margin:0 auto 22px;border:0;background:none;cursor:pointer}.candle-wax{position:absolute;left:62px;bottom:25px;width:66px;height:125px;border-radius:7px 7px 5px 5px;background:linear-gradient(90deg,#8b8499,#e3dcec 45%,#a79daf);box-shadow:inset -9px 0 18px #0003,0 8px 35px #0006}.candle-wax:before{content:'';position:absolute;top:-5px;left:0;width:66px;height:12px;border-radius:50%;background:#d5cada}.candle-wick{position:absolute;left:93px;bottom:151px;width:4px;height:14px;background:#514657;border-radius:3px;z-index:2}.candle-base{position:absolute;left:43px;bottom:16px;width:104px;height:13px;border-radius:50%;background:linear-gradient(#6d607d,#302737);box-shadow:0 7px 15px #0008}.candle-flame{position:absolute;left:80px;bottom:165px;width:30px;height:52px;border-radius:50% 50% 45% 45%;background:radial-gradient(ellipse at 50% 80%,#fff7ca 0 25%,#ffc858 45%,#f18a27 70%,transparent 75%);opacity:0;transform:scale(.2);transform-origin:center bottom;z-index:3;transition:opacity .5s,transform .6s}.candle-glow{position:absolute;inset:-20px -60px;background:radial-gradient(ellipse at 50% 34%,#ffc55b38,transparent 60%);opacity:0;transition:opacity 1s;pointer-events:none}.is-lit .candle-flame{opacity:1;transform:scale(1);animation:candle-flicker 2s ease-in-out infinite}.is-lit .candle-glow{opacity:1}.is-lit .candle-wax{box-shadow:inset -9px 0 18px #0003,0 -10px 50px #f6bb4830}.candle-hint{font-size:14px;color:#aaa3b8}.candle-message h2{font-size:clamp(28px,5vw,44px);margin:0 0 26px}.candle-message em{color:#ffd382}.candle-message{animation:candle-message-in .7s ease both}.candle-enter{border:0;background:#b7a4ff;color:#181025;min-width:140px}.candle-status{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}@keyframes candle-flicker{0%,100%{transform:rotate(-2deg) scale(1)}50%{transform:rotate(2deg) scale(.94,1.04)}}@keyframes candle-message-in{from{opacity:0;transform:translateY(15px)}to{opacity:1;transform:translateY(0)}}@media(prefers-reduced-motion:reduce){.candle-intro,.candle-flame,.candle-glow{transition:none}}

/* Sculpted wax and warm moving candlelight. */
.candle-brand{font:800 30px 'Manrope',Arial,sans-serif;letter-spacing:-1.5px;color:#f6f5fa;margin-bottom:38px}.candle-brand span{font:12px Arial;vertical-align:top;color:#b7a4ff;margin-left:5px}
.candle-button{outline:none!important;border:0;box-shadow:none;-webkit-tap-highlight-color:transparent;height:280px;perspective:600px}.candle-button:focus-visible .candle-base{box-shadow:0 0 14px #b7a4ff80}
.candle-wax{left:57px;bottom:27px;width:76px;height:145px;border-radius:8px 8px 12px 12px;background:linear-gradient(90deg,#665a61 0%,#a99a99 12%,#e7d9c8 35%,#f9edd9 49%,#d4c4b2 73%,#8d7c79 100%);box-shadow:inset 4px 0 8px #fff2,inset -9px 0 14px #34282d66,0 13px 23px #0008;transform:rotateX(2deg)}
.candle-wax:before{top:-8px;width:76px;height:19px;background:radial-gradient(ellipse at 50% 50%,#7b655a 0 8%,#bba994 12% 29%,#eadcc8 36% 65%,#fff1dc 75%);box-shadow:inset 0 2px 4px #ffffff40;border:1px solid #cbbba8}
.candle-wax:after{content:'';position:absolute;top:2px;left:11px;width:8px;height:36px;background:linear-gradient(#f6e8d3,#dfcebb);border-radius:0 0 9px 9px;box-shadow:18px -4px 0 -1px #eadac4,36px -8px 0 -2px #d6c3ae;opacity:.9}
.candle-wick{left:93px;bottom:172px;height:16px;background:linear-gradient(90deg,#21191a,#6a5040,#21191a);transform:rotate(-7deg)}
.candle-base{left:38px;bottom:16px;width:114px;height:18px;background:linear-gradient(#9c8798,#493847 45%,#1e1620);box-shadow:0 10px 18px #0009}
.candle-flame{left:80px;bottom:188px;width:30px;height:58px;background:radial-gradient(ellipse at 50% 88%,#6277fc 0 9%,#fffbd9 15% 32%,#ffdf7b 43%,#ffb039 60%,#f47b1820 75%,transparent 80%);border-radius:60% 40% 45% 45%;filter:drop-shadow(0 0 7px #ffca65) drop-shadow(0 0 18px #ffb13e80)}
.candle-flame:after{content:'';position:absolute;left:10px;bottom:9px;width:10px;height:28px;border-radius:60% 50% 50% 50%;background:linear-gradient(#fff8df,#fff2ba);filter:blur(1px)}
.candle-glow{inset:-65px -100px;background:radial-gradient(ellipse at 50% 31%,#ffcc653b 0%,#e9962615 30%,transparent 65%)}
.is-lit .candle-flame{animation:real-flame 1.7s ease-in-out infinite alternate}.is-lit .candle-glow{animation:warm-light 2.3s ease-in-out infinite}.is-lit .candle-wax{box-shadow:inset 4px 0 8px #fff3,inset -9px 0 14px #34282d66,0 -20px 55px #ffcb6230,0 13px 23px #0008}
@keyframes real-flame{0%{transform:rotate(-4deg) scale(.96,1.03)}25%{transform:rotate(2deg) scale(1.04,.95)}55%{transform:rotate(-2deg) scale(.93,1.08)}80%{transform:rotate(4deg) scale(1.02,.98)}100%{transform:rotate(-1deg) scale(.97,1.04)}}@keyframes warm-light{0%,100%{opacity:.8;transform:translateX(-3px) scale(.98)}50%{opacity:1;transform:translateX(4px) scale(1.04)}}

.candle-brand,.candle-brand span{-webkit-user-select:none;user-select:none}


.candle-message h2,.candle-message h2 em{-webkit-user-select:none;user-select:none}

/* Rounded category selectors with compact count badges. */
.filters{gap:10px;margin-bottom:28px}.filters button{display:inline-flex;align-items:center;justify-content:center;gap:10px;border-radius:999px;padding:8px 16px;min-height:44px;border:1px solid var(--line);background:var(--bg);color:var(--muted);transition:background .2s,color .2s,border-color .2s,box-shadow .2s}.filters button span{display:inline-grid;place-items:center;margin:0;min-width:24px;height:24px;padding:0 6px;border-radius:50%;background:var(--panel);color:var(--ink);font-size:11px;opacity:1}.filters button.active{background:var(--accent);color:var(--button-ink);border-color:var(--accent);box-shadow:0 4px 16px color-mix(in srgb,var(--accent) 18%,transparent)}.filters button.active span{background:var(--button-ink);color:var(--accent)}.filters button:hover{border-color:var(--accent)}@media(max-width:440px){.filters{gap:8px}.filters button{padding:7px 12px;font-size:12px;gap:7px}.filters button span{min-width:22px;height:22px}}
/* Option 1: ivory pillar candle on a brass plate. */
.candle-wax{left:51px;bottom:30px;width:88px;height:147px;border-radius:10px 10px 12px 12px;background:linear-gradient(90deg,#a6957e 0%,#d8c9af 14%,#f2e7d1 37%,#fff5df 52%,#e9dcc1 76%,#bbaa8c 100%);box-shadow:inset 5px 0 9px #fff3,inset -8px 0 13px #806c4840,0 12px 22px #0008}.candle-wax:before{width:88px;height:21px;top:-9px;border-color:#dbccb0;background:radial-gradient(ellipse at 50% 50%,#796347 0 7%,#bfab86 12% 23%,#ede0c3 36% 62%,#fff3d7 80%);box-shadow:inset 0 2px 5px #fff7}.candle-wax:after{left:12px;top:2px;width:10px;height:43px;background:linear-gradient(#fff1d3,#e7d6b6);border-radius:2px 2px 10px 10px;box-shadow:20px -9px 0 -1px #f3e5c8,44px -14px 0 -2px #e9dab8,57px -23px 0 -3px #dcc9a5}.candle-wick{bottom:177px}.candle-flame{bottom:193px}.candle-base{left:26px;bottom:17px;width:138px;height:21px;border:1px solid #c3a262;border-radius:50%;background:radial-gradient(ellipse at 50% 32%,#c9ab6a 0%,#8b6c34 42%,#edce86 68%,#6b4f25 86%);box-shadow:inset 0 -4px 5px #49311180,0 10px 17px #0009}.is-lit .candle-wax{box-shadow:inset 5px 0 9px #fff5,inset -8px 0 13px #806c4840,0 -15px 50px #ffd47e28,0 12px 22px #0008}.is-lit .candle-base{box-shadow:inset 0 -4px 5px #49311180,0 0 22px #ffcb5d15,0 10px 17px #0009}

/* Glass globe lamp, option 3. */
.lamp-globe{position:absolute;left:28px;top:22px;width:134px;height:145px;border-radius:50% 50% 46% 46%;background:radial-gradient(ellipse at 27% 25%,#ffffff21 0%,#ffffff05 32%,#747b8b13 65%,#d4e0f026 94%);border:1px solid #c4d0df60;box-shadow:inset 5px 4px 15px #ffffff14,inset -6px -8px 15px #0005;overflow:hidden;z-index:2;transition:background .6s,box-shadow .6s}.lamp-globe:before{content:'';position:absolute;left:16px;top:17px;width:20px;height:52px;border-radius:50%;background:linear-gradient(#ffffff50,#ffffff05);transform:rotate(28deg);filter:blur(1px)}.lamp-globe:after{content:'';position:absolute;right:14px;top:33px;width:5px;height:47px;border-radius:50%;background:#ffffff21;transform:rotate(-18deg)}.lamp-filament{position:absolute;width:80px;height:112px;left:26px;bottom:0;overflow:visible;fill:none;stroke-linecap:round;stroke-linejoin:round}.lamp-support{stroke:#78808d;stroke-width:1.5}.lamp-coil{stroke:#9c8564;stroke-width:2;transition:stroke .5s,filter .5s}.lamp-neck{position:absolute;left:74px;top:158px;width:42px;height:31px;background:repeating-linear-gradient(0deg,#55515b 0 3px,#27252d 3px 6px);border-radius:4px 4px 8px 8px;z-index:1}.lamp-base{position:absolute;left:48px;top:184px;width:94px;height:63px;border-radius:12px 12px 15px 15px;background:linear-gradient(90deg,#101015,#35353c 35%,#26262d 60%,#101015);box-shadow:inset 0 2px 2px #ffffff26,0 12px 18px #0009;border-bottom:4px solid #08080b}.lamp-base:before{content:'';position:absolute;left:0;top:-7px;width:94px;height:16px;border-radius:50%;background:radial-gradient(ellipse,#45454c,#17171c 70%);border:1px solid #46464f}.lamp-glow{position:absolute;inset:-55px -85px;background:radial-gradient(ellipse at 50% 37%,#ffd88c40, #ffba4912 38%,transparent 67%);opacity:0;pointer-events:none;transition:opacity .8s}.is-lit .lamp-glow{opacity:1;animation:lamp-radiance 4s ease-in-out infinite}.is-lit .lamp-globe{background:radial-gradient(ellipse at 50% 61%,#ffd48035,#ffc45e0c 48%,#ffffff0b 70%);box-shadow:inset 5px 4px 15px #ffffff20,inset -6px -8px 15px #ffd47816,0 0 32px #ffc56524}.is-lit .lamp-coil{stroke:#fff0ba;filter:drop-shadow(0 0 3px #ffebaa) drop-shadow(0 0 8px #ffb13e)}.is-lit .lamp-base{box-shadow:inset 0 2px 2px #ffe4ab55,0 12px 18px #0009}.candle-button:focus-visible .lamp-base{outline:2px solid #b7a4ff;outline-offset:4px}@keyframes lamp-radiance{0%,100%{opacity:.86}50%{opacity:1}}

/* Bare globe bulb without a display stand. */
.lamp-neck{left:75px;top:158px;width:40px;height:40px;background:repeating-linear-gradient(0deg,#8d8990 0 2px,#47434c 2px 5px,#c3bec6 5px 6px);border-radius:3px 3px 10px 10px;box-shadow:inset 5px 0 7px #ffffff25,inset -5px 0 7px #0005}.lamp-neck:after{content:'';position:absolute;bottom:-5px;left:12px;width:16px;height:6px;background:#27232b;border-radius:0 0 5px 5px}.candle-button:focus-visible .lamp-globe{border-color:#b7a4ff}.candle-button{height:230px}

:root{--bg:#0c0c10;--panel:#17171e;--soft:#121218}.hero{background-image:linear-gradient(90deg,rgba(9,9,14,.96),rgba(9,9,14,.82)),url('images/marketing-hero.png')}.real-bulb{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;user-select:none;-webkit-user-select:none;transition:filter .7s}.candle-button{width:200px;height:270px}.real-filament-light{position:absolute;left:43%;top:39%;width:14%;height:3px;border-radius:50%;background:#fff2bd;box-shadow:0 0 5px 2px #ffecac,0 0 15px 6px #ffbb5860;opacity:0;filter:blur(.7px);transition:opacity .6s;pointer-events:none}.is-lit .real-filament-light{opacity:1}.is-lit .real-bulb{filter:drop-shadow(0 0 15px #ffc95b24) brightness(1.1)}.candle-button:focus-visible .real-bulb{filter:drop-shadow(0 0 5px #b7a4ff80)}@media(max-width:700px){.hero{background-image:linear-gradient(rgba(9,9,14,.91),rgba(9,9,14,.88)),url('images/marketing-hero.png')}}

.candle-intro{background:#000}.candle-button{width:240px;height:350px;margin-bottom:18px}.reference-lamp{display:block;width:100%;height:100%;object-fit:contain;pointer-events:none;background:#000}.candle-button:focus-visible{outline:1px solid #b7a4ff80!important;outline-offset:5px;border-radius:12px}@media(max-height:650px){.candle-button{width:185px;height:265px}.candle-brand{margin-bottom:15px}.candle-message h2{margin-bottom:18px}}
/* Rotate the reference lamp and remove the enclosing outline. */
.reference-lamp{transform:rotate(180deg)}.candle-button,.candle-button:focus-visible{border:0;outline:none!important;box-shadow:none}.candle-button:focus-visible .reference-lamp{filter:brightness(1.12)}

.candle-stage{transform:translateY(-28px)}.reference-lamp-glow{position:absolute;inset:-30px -55px;pointer-events:none;opacity:0;background:radial-gradient(ellipse at 50% 40%,#ffce6745 0%,#ffa94320 30%,transparent 65%);filter:blur(18px);transition:opacity .65s;z-index:0}.reference-lamp{position:relative;z-index:1;mix-blend-mode:screen}.is-lit .reference-lamp-glow{opacity:1;animation:reference-glow 3s ease-in-out infinite}.is-lit .reference-lamp{filter:drop-shadow(0 0 14px #ffcb6440)}@keyframes reference-glow{0%,100%{opacity:.75;transform:scale(.98)}50%{opacity:1;transform:scale(1.06)}}@media(max-height:650px){.candle-stage{transform:translateY(-12px)}}@media(prefers-reduced-motion:reduce){.reference-lamp-glow{transition:none}}
/* Larger opening lamp, scaled down for shorter screens. */
.candle-button{width:290px;height:410px;margin-bottom:12px}@media(max-height:750px){.candle-button{width:250px;height:350px}.candle-brand{margin-bottom:20px}}@media(max-height:650px){.candle-button{width:210px;height:295px}.candle-brand{margin-bottom:12px}}@media(max-width:380px){.candle-button{max-width:100%}}
/* Larger lamp positioned higher without pushing the entry controls down. */
.candle-button{width:340px;height:450px;margin-top:-22px;margin-bottom:-8px}.reference-lamp{transform:translateY(-18px) rotate(180deg) scale(1.12)}.reference-lamp-glow{transform:translateY(-18px)}@media(max-height:750px){.candle-button{width:290px;height:375px;margin-top:-18px;margin-bottom:-8px}}@media(max-height:650px){.candle-button{width:235px;height:305px;margin-top:-12px;margin-bottom:-5px}.reference-lamp{transform:translateY(-12px) rotate(180deg) scale(1.08)}}@media(max-width:380px){.candle-button{width:min(290px,100%)}}
/* Keep the wordmark visible above the enlarged lamp. */
.candle-intro{display:flex;align-items:center;justify-content:center;padding:28px 24px}.candle-stage{transform:none;flex-shrink:0;position:relative}.candle-brand{position:relative;z-index:4;margin-bottom:24px}.candle-button{margin-top:0;margin-bottom:8px;height:390px}.reference-lamp{transform:translateY(-8px) rotate(180deg) scale(1.1)}@media(max-height:750px){.candle-button{height:320px;margin-top:0;margin-bottom:8px}.candle-brand{margin-bottom:18px}}@media(max-height:650px){.candle-intro{justify-content:flex-start;flex-direction:column}.candle-button{height:260px;margin-top:0;margin-bottom:8px}.candle-brand{margin-bottom:14px}.reference-lamp{transform:rotate(180deg) scale(1.08)}}
.welcome-copyright{margin-top:26px;font-size:11px;line-height:1.5;color:#918b9d;letter-spacing:.2px}@media(max-height:650px){.welcome-copyright{margin-top:18px}}

.reference-lamp,.is-lit .reference-lamp{animation:none!important}.reference-lamp-glow,.is-lit .reference-lamp-glow{animation:none!important;transform:none}.is-lit .reference-lamp-glow{opacity:1}
/* Compact mobile category pills. */
@media(max-width:700px){.filters{gap:6px;margin-bottom:20px}.filters button{min-height:36px;padding:5px 10px;font-size:11px;line-height:1.3;gap:5px}.filters button span{min-width:18px;height:18px;padding:0 4px;font-size:9px}.filters button:focus-visible{outline-offset:2px}}

.logo-panel.has-logo img.round-brand-logo{clip-path:circle(48.5% at 50% 50%)}

.language-toggle{min-width:44px;min-height:44px;padding:8px 12px;border:1px solid var(--line);border-radius:22px;background:var(--panel);color:var(--ink);font-size:13px;flex-shrink:0}html[dir=rtl] body{font-family:Tahoma,Arial,sans-serif}html[dir=rtl] h1,html[dir=rtl] h2,html[dir=rtl] h3{font-family:Tahoma,Arial,sans-serif;letter-spacing:0}html[dir=rtl] nav{margin-left:0;margin-right:auto}html[dir=rtl] .hero-index span+span{border-left:0;border-right:1px solid var(--line);padding-left:0;padding-right:15px}.contact-links a[href^="tel:"],.contact-links a[href^="mailto:"]{direction:ltr}@media(max-width:700px){header{gap:12px}.language-toggle{margin-left:auto}.theme-toggle{margin-left:0}html[dir=rtl] .language-toggle{margin-left:0;margin-right:auto}html[dir=rtl] nav{margin-right:0}}

/* Keep SVG coordinates stable in RTL and align the artwork with Arabic copy. */
.marketing-animation svg{direction:ltr}.marketing-animation text{unicode-bidi:plaintext}html[dir=rtl] .marketing-animation{margin-inline-start:0;margin-inline-end:auto;direction:ltr}html[dir=rtl] .marketing-animation text{font-family:Tahoma,Arial,sans-serif;font-size:12px;letter-spacing:0}html[dir=rtl] .hero-intro,html[dir=rtl] .hero-bottom{text-align:right}html[dir=rtl] .hero-bottom>p{margin-inline-start:0;margin-inline-end:auto}html[dir=rtl] .trickster-identity{justify-content:flex-start}html[dir=rtl] .wordmark{direction:ltr;unicode-bidi:isolate}html[dir=rtl] .project h3,html[dir=rtl] .site-info h3,html[dir=rtl] .app-copy h3{direction:ltr;unicode-bidi:isolate;text-align:right}html[dir=rtl] .eyebrow,html[dir=rtl] .platforms-label{letter-spacing:0}html[dir=rtl] .hero-title{line-height:1.8}html[dir=rtl] .section-heading p,html[dir=rtl] .about-copy p{line-height:1.9}html[dir=rtl] .candle-message h2{text-align:center}html[dir=rtl] .browser-bar{direction:ltr}html[dir=rtl] .hero-index{gap:15px}
