[hidden]{display:none!important}
/* Layout: dark gallery of frosted acrylic slabs floating over a slow ink-flow canvas; the BUK spectrum (yellow → pink) runs through everything */
:root{
  --ink:#fbf7fb; --ink-2:#f3eef6;
  --fg:#2b2236; --muted:#6b6178; --faint:#968ca3;
  --glass:rgba(255,255,255,0.85); --glass-hi:rgba(255,255,255,0.95); --edge:rgba(255,255,255,0.95);
  --line:rgba(88,62,120,.12);
  --y:#ffd76e; --o:#ffb88a; --r:#ff9f98; --dr:#f7a3c4; --m:#d7a8f2; --p:#9fd2f6; --mint:#a8e6cf;
  --spectrum:linear-gradient(90deg,var(--y),var(--o),var(--r),var(--dr),var(--m),var(--p));
  --spectrum-ink:linear-gradient(90deg,#f0a20f,#f0703c,#e8557a,#b65fd8,#4b9fe0);
  --shadow:0 18px 50px -22px rgba(110,70,150,.35);
  --display:"Bricolage Grotesque",ui-sans-serif,system-ui,sans-serif;
  --body:"Instrument Sans",ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif;
  --mono:"JetBrains Mono",ui-monospace,SFMono-Regular,Menlo,monospace;
  --r-lg:28px; --r-md:18px;
  --panel:rgba(255,255,255,.8); --on-fg:#fff; --grain-blend:multiply;
  --w10:rgba(255,255,255,0.1);--w12:rgba(255,255,255,0.12);--w15:rgba(255,255,255,0.15);--w20:rgba(255,255,255,0.2);--w25:rgba(255,255,255,0.25);--w30:rgba(255,255,255,0.3);--w35:rgba(255,255,255,0.35);--w40:rgba(255,255,255,0.4);--w45:rgba(255,255,255,0.45);--w51:rgba(255,255,255,0.51);--w53:rgba(255,255,255,0.53);--w55:rgba(255,255,255,0.55);--w57:rgba(255,255,255,0.57);--w65:rgba(255,255,255,0.65);--w70:rgba(255,255,255,0.7);--w72:rgba(255,255,255,0.72);--w80:rgba(255,255,255,0.8);--w90:rgba(255,255,255,0.9);--sh28:rgba(110,70,150,0.28);--sh32:rgba(110,70,150,0.32);
  color-scheme:light;
}
:root[data-mode="dark"]{
  --ink:#0c0a12; --ink-2:#15121d;
  --fg:#f4f1f7; --muted:#d6d1df; --faint:#aea7bb;
  --glass:rgba(255,255,255,.055); --glass-hi:rgba(255,255,255,.11); --edge:rgba(255,255,255,.14);
  --line:rgba(255,255,255,.12);
  --y:#f2c230; --o:#e8812e; --r:#e2493b; --dr:#b02a44; --m:#cc3f93; --p:#eba0c8; --mint:#3fbf8f;
  --spectrum-ink:linear-gradient(90deg,#f2c230,#e8812e,#e2493b,#cc3f93,#eba0c8);
  --shadow:0 20px 50px -20px rgba(0,0,0,.6);
  --panel:rgba(22,18,30,.82); --on-fg:#140f0a; --grain-blend:overlay;
  --w10:rgba(255,255,255,0.02);--w12:rgba(255,255,255,0.025);--w15:rgba(255,255,255,0.03);--w20:rgba(255,255,255,0.04);--w25:rgba(255,255,255,0.05);--w30:rgba(255,255,255,0.06);--w35:rgba(255,255,255,0.08);--w40:rgba(255,255,255,0.08);--w45:rgba(255,255,255,0.09);--w51:rgba(255,255,255,0.1);--w53:rgba(255,255,255,0.11);--w55:rgba(255,255,255,0.11);--w57:rgba(255,255,255,0.16);--w65:rgba(255,255,255,0.3);--w70:rgba(255,255,255,0.08);--w72:rgba(255,255,255,0.144);--w80:rgba(255,255,255,0.45);--w90:rgba(255,255,255,0.12);--sh28:rgba(0,0,0,0.67);--sh32:rgba(0,0,0,0.77);
  color-scheme:dark;
}
html{transition:background-color .5s}
body{transition:background-color .5s,color .5s}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{background:var(--ink);color:var(--fg);font-family:var(--body);font-size:16px;line-height:1.6;overflow-x:hidden;-webkit-font-smoothing:antialiased}
body::before{content:"";position:fixed;inset:0 0 auto;height:env(safe-area-inset-top,0px);z-index:60;background:var(--ink)}
a{color:inherit}
:focus-visible{outline:2px solid #e8557a;outline-offset:3px;border-radius:6px}

#flow{position:fixed;inset:0;width:100%;height:100%;z-index:0;pointer-events:none}
.grain{position:fixed;inset:0;z-index:1;pointer-events:none;opacity:.05;mix-blend-mode:var(--grain-blend);
  background-image: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='.85' numOctaves='3' stitchTiles='stitch'/></filter><rect width='100%' height='100%' filter='url(%23n)'/></svg>")}
main,header,footer{position:relative;z-index:2}

.wrap{max-width:1180px;margin:0 auto;padding-left:max(20px,env(safe-area-inset-left,0px));padding-right:max(20px,env(safe-area-inset-right,0px))}

.glass{background:var(--glass);border:1px solid var(--edge);backdrop-filter:blur(22px) saturate(160%);-webkit-backdrop-filter:blur(22px) saturate(160%);
  box-shadow:inset 0 1px 0 var(--w90),0 1px 0 rgba(88,62,120,.06),var(--shadow)}

/* nav */
header{position:sticky;top:env(safe-area-inset-top,0px);z-index:50;padding-block:14px}
.nav{display:flex;align-items:center;justify-content:space-between;gap:16px;border-radius:999px;padding:10px 12px 10px 20px}
.logo{display:flex;align-items:baseline;gap:6px;text-decoration:none;font-family:"Times New Roman",Georgia,serif;letter-spacing:.02em}
.logo small{font-size:12px;color:var(--muted)}
.logo b{font-size:22px;font-weight:700}
.logo sup{font-size:10px;color:var(--muted)}
.nav ul{display:flex;gap:4px;list-style:none;margin:0;padding:0}
.nav ul a{display:block;padding:8px 14px;border-radius:999px;text-decoration:none;font-size:14px;color:var(--muted);transition:color .2s,background .2s}
.nav ul a:hover{color:var(--fg);background:var(--glass-hi)}
.btn{display:inline-flex;align-items:center;gap:8px;padding:10px 18px;border-radius:999px;font-weight:600;font-size:14px;text-decoration:none;color:#2b2236;
  background:var(--spectrum);background-size:200% 100%;transition:background-position .6s ease,transform .2s}
.btn:hover{background-position:100% 0;transform:translateY(-1px)}

/* hero */
.hero{position:relative;padding-block:clamp(56px,10vw,120px) clamp(80px,12vw,150px)}
.eyebrow{font-family:var(--mono);font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);display:flex;align-items:center;gap:10px}
.eyebrow::before{content:"";width:28px;height:2px;background:var(--spectrum);border-radius:2px}
.hero h1{font-family:var(--display);font-weight:700;font-size:clamp(52px,10.5vw,148px);line-height:.9;letter-spacing:-.045em;margin:22px 0 0;text-wrap:balance;max-width:11ch}
.hero h1 .sp{background:var(--spectrum-ink);-webkit-background-clip:text;background-clip:text;color:transparent;background-size:200% 100%;animation:shift 9s ease-in-out infinite alternate}
@keyframes shift{to{background-position:100% 0}}
.hero p.lede{max-width:46ch;font-size:clamp(17px,1.6vw,20px);color:var(--muted);margin:28px 0 0}
.hero .ctas{display:flex;flex-wrap:wrap;gap:12px;margin-top:34px}
.btn.ghost{background:var(--glass);color:var(--fg);border:1px solid var(--edge);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px)}
.btn.ghost:hover{background:var(--glass-hi)}

.stage{position:absolute;inset:0;pointer-events:none;overflow:hidden}
.slab{position:absolute;border-radius:var(--r-lg);will-change:transform}
.slab .face{position:absolute;inset:0;border-radius:inherit;background:linear-gradient(140deg,var(--w51),var(--w15) 55%);
  border:1px solid var(--w55);backdrop-filter:blur(14px) saturate(170%);-webkit-backdrop-filter:blur(14px) saturate(170%);
  box-shadow:inset 0 1px 0 var(--w65),inset 0 -20px 40px -20px var(--tint,transparent),0 30px 80px -30px var(--sh28)}
.slab .face::after{content:"";position:absolute;inset:0;border-radius:inherit;background:linear-gradient(115deg,transparent 35%,var(--w57) 48%,transparent 60%);
  background-size:250% 100%;animation:glint 7s ease-in-out infinite}
@keyframes glint{0%,60%{background-position:120% 0}100%{background-position:-40% 0}}
.s1{width:clamp(180px,24vw,320px);aspect-ratio:3/4;right:6%;top:12%;--tint:rgba(242,194,48,.45)}
.s2{width:clamp(130px,16vw,210px);aspect-ratio:1;right:26%;top:52%;--tint:rgba(204,63,147,.5);border-radius:50%}
.s2 .face{border-radius:50%}
.s3{width:clamp(110px,12vw,170px);aspect-ratio:5/3;right:2%;top:66%;--tint:rgba(226,73,59,.5)}
.s4{width:70px;aspect-ratio:1;right:36%;top:14%;--tint:rgba(235,160,200,.6);border-radius:20px}
.s1 .tag{position:absolute;left:14px;top:14px;z-index:2;font-family:var(--mono);font-size:10px;letter-spacing:.12em;color:var(--fg);text-transform:uppercase;
  padding:5px 9px;border-radius:999px;background:var(--panel);border:1px solid var(--edge);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);max-width:calc(100% - 28px);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.s4{width:clamp(90px,8vw,120px)}
.slab{transform-origin:center}
.slab .hpic{position:absolute;inset:0;border-radius:inherit;overflow:hidden;background:var(--ink-2)}
.slab .hpic img{width:100%;height:100%;object-fit:cover;display:block;opacity:0;transform:scale(1.12);transition:opacity 1.2s ease,transform 2.4s cubic-bezier(.2,.85,.15,1)}
.slab .hpic img.in{opacity:1;transform:scale(1)}
.slab.has-img .face{backdrop-filter:none;-webkit-backdrop-filter:none;background:linear-gradient(140deg,var(--w40),transparent 42%,transparent 70%,color-mix(in srgb,var(--ink) 25%,transparent));
  box-shadow:inset 0 1px 0 var(--w57),inset 0 0 0 1px var(--w30),0 30px 70px -28px var(--sh35)}

/* marquee */
.ticker{border-block:1px solid var(--line);background:var(--w12);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);overflow:hidden;padding-block:18px}
.ticker .row{display:flex;gap:48px;width:max-content;animation:tick 38s linear infinite;font-family:var(--display);font-size:clamp(22px,3vw,34px);font-weight:500;letter-spacing:-.02em;white-space:nowrap}
.ticker .row span{display:flex;align-items:center;gap:48px;color:var(--muted)}
.ticker .row span::after{content:"";width:10px;height:10px;border-radius:50%;background:var(--c)}
@keyframes tick{to{transform:translateX(-50%)}}

/* about */
section{padding-block:clamp(72px,10vw,130px)}
.about{display:grid;grid-template-columns:1.1fr .9fr;gap:clamp(28px,5vw,72px);align-items:center}
.about > *{min-width:0}
h2{font-family:var(--display);font-weight:650;font-size:clamp(36px,5.2vw,68px);line-height:1;letter-spacing:-.035em;margin:18px 0 0;text-wrap:balance}
.about p{color:var(--muted);font-size:18px;max-width:52ch}
.quote{border-radius:var(--r-lg);padding:clamp(26px,4vw,44px);position:relative;overflow:hidden}
.quote::before{content:"";position:absolute;inset:auto -30% -60% auto;width:320px;height:320px;border-radius:50%;background:radial-gradient(var(--y),transparent 70%);opacity:.35;filter:blur(20px)}
.quote blockquote{margin:0;font-family:var(--display);font-size:clamp(24px,2.8vw,34px);line-height:1.15;letter-spacing:-.02em;position:relative}
.quote cite{display:block;margin-top:22px;font-style:normal;font-family:var(--mono);font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);position:relative}
.facts{display:flex;flex-wrap:wrap;gap:10px;margin-top:28px}
.chip{font-family:var(--mono);font-size:12px;padding:8px 14px;border-radius:999px;border:1px solid var(--edge);background:var(--glass);color:var(--fg)}

/* services deck: sideways glass tabs that open up */
.head{display:flex;justify-content:space-between;align-items:end;gap:24px;flex-wrap:wrap;margin-bottom:28px}
.head p{color:var(--muted);max-width:40ch;margin:0}
.filters{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:26px}
.filters button{font:500 13px var(--body);color:var(--muted);background:var(--glass);border:1px solid var(--edge);border-radius:999px;padding:8px 16px;cursor:pointer;
  backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);transition:color .2s,background .2s,border-color .2s}
.filters button:hover{color:var(--fg)}
.filters button[aria-pressed="true"]{color:var(--on-fg);background:var(--fg);border-color:var(--fg)}
.deck-wrap{position:relative}
.deck{display:flex;gap:12px;height:660px;overflow-x:auto;overflow-y:hidden;scroll-behavior:smooth;scrollbar-width:none;cursor:grab;
  padding-block:10px 24px;padding-left:max(20px,calc((100vw - 1140px)/2),env(safe-area-inset-left,0px));padding-right:max(20px,env(safe-area-inset-right,0px))}
.deck::-webkit-scrollbar{display:none}
.deck.drag{cursor:grabbing;scroll-behavior:auto}
.tab{--w:96px;flex:0 0 var(--w);position:relative;border-radius:var(--r-lg);overflow:hidden;isolation:isolate;
  transition:flex-basis .75s cubic-bezier(.2,.85,.15,1),border-color .3s,opacity .4s}
.tab.open{--w:min(640px,84vw)}
.tab::before{content:"";position:absolute;inset:0;z-index:-1;transition:opacity .6s;
  background:radial-gradient(120% 80% at 0% 100%,color-mix(in srgb,var(--c) 55%,transparent),transparent 60%),linear-gradient(180deg,color-mix(in srgb,var(--c) 14%,transparent),transparent 60%);opacity:.55}
.tab.open::before{opacity:1}
.tab:hover{border-color:color-mix(in srgb,var(--c) 55%,white 10%)}
.tab .hit{position:absolute;inset:0;width:100%;background:none;border:0;color:inherit;cursor:pointer;text-align:left;padding:22px 0;display:flex;flex-direction:column;align-items:center;justify-content:space-between;font:inherit}
.tab.open .hit{pointer-events:none;opacity:0}
.tab .num{font-family:var(--mono);font-size:11px;letter-spacing:.1em;color:var(--muted)}
.tab .vt{writing-mode:vertical-rl;transform:rotate(180deg);font-family:var(--display);font-weight:600;font-size:22px;letter-spacing:-.02em;white-space:nowrap}
.tab .dot{width:14px;height:14px;border-radius:50%;background:var(--c);box-shadow:0 0 18px var(--c)}
.tab .new{position:absolute;top:44px;left:50%;transform:translateX(-50%);font:500 9px var(--mono);letter-spacing:.12em;padding:3px 6px;border-radius:6px;background:var(--c);color:#2b2236}
.body{position:absolute;inset:0;padding:30px 32px;display:flex;flex-direction:column;gap:16px;width:min(640px,84vw);opacity:0;transform:translateX(24px);pointer-events:none;
  transition:opacity .35s,transform .6s cubic-bezier(.2,.85,.15,1)}
.tab.open .body{opacity:1;transform:none;pointer-events:auto;transition-delay:.18s}
.body .top{display:flex;justify-content:space-between;align-items:center;gap:12px}
.body .orb{width:64px;height:64px;border-radius:20px;display:grid;place-items:center;background:linear-gradient(145deg,color-mix(in srgb,var(--c) 85%,white 10%),color-mix(in srgb,var(--c) 35%,transparent));box-shadow:inset 0 1px 0 var(--w80),0 14px 30px -10px var(--c)}
.body .orb svg{width:32px;height:32px;stroke:var(--fg);fill:none;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.body .meta{font-family:var(--mono);font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);text-align:right}
.body h3{font-family:var(--display);font-size:clamp(32px,4vw,48px);font-weight:700;letter-spacing:-.035em;line-height:.98;margin:8px 0 0;text-wrap:balance}
.body .say{font-family:var(--display);font-size:20px;color:color-mix(in srgb,var(--c) 45%,var(--fg));margin:0}
.body p{margin:0;color:var(--muted);max-width:48ch}
.body ul{list-style:none;margin:4px 0 0;padding:0;display:flex;flex-wrap:wrap;gap:8px}
.body li{font:500 12px var(--mono);padding:7px 12px;border-radius:999px;border:1px solid var(--edge);background:var(--w25)}
.body .acts{margin-top:auto;display:flex;gap:10px;flex-wrap:wrap}
.body .acts .btn{background:var(--c)}
.tab .bg{position:absolute;inset:-12px;z-index:-2;background:var(--img) center/cover no-repeat;filter:blur(5px) saturate(120%);opacity:.32;transform:scale(1.05);transition:opacity .6s,transform 1.2s cubic-bezier(.2,.85,.15,1)}
.tab:hover .bg{opacity:.5;transform:scale(1.12)}
.tab.open .bg{opacity:.12}
.pic{position:relative;flex:0 0 auto;height:clamp(180px,26vw,250px);border-radius:20px;overflow:hidden;border:1px solid var(--w57);
  box-shadow:inset 0 1px 0 var(--w65),0 24px 50px -24px var(--sh32)}
.pic img{width:100%;height:100%;object-fit:cover;display:block;transform:scale(1.08);transition:transform 1.4s cubic-bezier(.2,.85,.15,1)}
.tab.open .pic img{transform:scale(1)}
.pic::after{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(115deg,transparent 30%,var(--w57) 46%,transparent 58%),linear-gradient(180deg,transparent 55%,var(--w35));
  background-size:260% 100%,100% 100%;background-position:130% 0,0 0;transition:background-position 1.4s ease .3s}
.tab.open .pic::after{background-position:-40% 0,0 0}
.pic .top{position:absolute;inset:14px 14px auto 14px;z-index:1}
.pic .meta{background:var(--panel);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border:1px solid var(--edge);border-radius:12px;padding:6px 10px;color:var(--fg)}
.pic.ph{display:grid;place-items:center;background:
  repeating-linear-gradient(135deg,var(--w20) 0 12px,transparent 12px 24px),
  radial-gradient(90% 90% at 20% 10%,color-mix(in srgb,var(--c) 55%,transparent),transparent 70%),var(--ink-2)}
.pic.ph .slot{display:grid;justify-items:center;gap:8px;text-align:center;border:1.5px dashed rgba(88,62,120,.35);border-radius:14px;padding:18px 22px;margin-top:30px}
.pic.ph .slot svg{width:44px;height:44px;stroke:var(--fg);fill:none;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round;opacity:.9}
.pic.ph .slot b{font-family:var(--display);font-size:17px;font-weight:600}
.pic.ph .slot small{font:500 11px var(--mono);letter-spacing:.1em;color:var(--muted)}
.body .orb{width:52px;height:52px;border-radius:16px}
.body .orb svg{width:26px;height:26px}
.body h3{margin-top:2px}
.body{gap:12px;padding:22px 24px 26px}
.deck-nav{display:flex;justify-content:space-between;align-items:center;gap:16px;margin-top:6px}
.count{font-family:var(--mono);font-size:12px;letter-spacing:.1em;color:var(--muted);font-variant-numeric:tabular-nums}
/* arrows: bright brand-gradient buttons with a soft glow so they read as "tap me" */
.arrow{position:relative;width:54px;height:54px;border-radius:50%;border:0;margin-left:10px;cursor:pointer;
  display:inline-grid;place-items:center;font:700 22px/1 var(--sans,inherit);color:#1a1020;
  background:linear-gradient(135deg,var(--y),var(--o) 45%,var(--dr));
  box-shadow:0 0 0 2px rgba(255,255,255,.18),0 8px 22px -6px var(--o),0 0 26px -4px var(--dr);
  transition:transform .25s cubic-bezier(.2,.9,.2,1.3),box-shadow .25s,filter .25s,opacity .25s}
.arrow::after{content:"";position:absolute;inset:-6px;border-radius:50%;border:2px solid var(--o);opacity:0;pointer-events:none}
.arrow:hover{transform:translateY(-2px) scale(1.08);filter:saturate(1.2) brightness(1.06);
  box-shadow:0 0 0 2px rgba(255,255,255,.3),0 12px 28px -6px var(--o),0 0 40px -2px var(--dr)}
.arrow:active{transform:scale(.94)}
.arrow:focus-visible{outline:3px solid var(--fg);outline-offset:3px}
.arrow[disabled],.arrow.end{opacity:.35;filter:grayscale(.6);box-shadow:none;cursor:default;transform:none}
:root[data-mode="dark"] .arrow{color:#140c18}
/* the forward arrow gently pulses and nudges until it has been used */
.arrow.hint{animation:arrNudge 2.4s ease-in-out infinite}
.arrow.hint::after{animation:arrRing 2.4s ease-out infinite}
@keyframes arrNudge{0%,60%,100%{transform:translateX(0)}70%{transform:translateX(5px)}80%{transform:translateX(0)}88%{transform:translateX(3px)}}
@keyframes arrRing{0%{opacity:.7;transform:scale(.9)}70%,100%{opacity:0;transform:scale(1.35)}}

@media (max-width:700px){
  .deck{flex-direction:column;height:auto;overflow:visible;cursor:auto;padding-left:max(16px,env(safe-area-inset-left,0px));padding-right:max(16px,env(safe-area-inset-right,0px))}
  .tab,.tab.open{flex:0 0 auto}
  .tab .hit{position:relative;flex-direction:row;padding:18px 20px;gap:14px;justify-content:flex-start}
  .tab .vt{writing-mode:horizontal-tb;transform:none;font-size:20px;flex:1}
  .tab .new{position:static;transform:none}
  .tab.open .hit{display:none}
  .body{position:relative;width:auto;padding:24px 20px;display:none}
  .tab.open .body{display:flex}
  .pic{height:230px}
  .pic.ph .slot{margin-top:64px;padding:12px 16px}
  .pic .meta{font-size:10px}
  .deck-nav{display:none}
}

/* gallery: category albums + viewer with thumbnails */
.albums-wrap{position:relative}
.albums{display:flex;gap:20px;overflow-x:auto;scroll-snap-type:x mandatory;scroll-behavior:smooth;scrollbar-width:none;padding:18px 4px 22px;margin:0 -4px;
  -webkit-mask-image:linear-gradient(90deg,#000 calc(100% - 60px),transparent);mask-image:linear-gradient(90deg,#000 calc(100% - 60px),transparent)}
.albums::-webkit-scrollbar{display:none}
.albums-nav{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-top:4px}
.albums-nav .count{font:500 12px var(--mono);letter-spacing:.1em;color:var(--muted)}
.album{--c:var(--y);flex:0 0 clamp(210px,23vw,270px);scroll-snap-align:start;display:grid;gap:12px;padding:0;border:0;background:none;color:inherit;font:inherit;text-align:left;cursor:pointer}
.album .stack{position:relative;aspect-ratio:4/3;max-width:100%}
.album .stack::after{content:"";position:absolute;inset:18% 8% -8%;z-index:-1;border-radius:50%;background:var(--c);filter:blur(28px);opacity:0;transition:opacity .5s}
.album:hover .stack::after,.album:focus-visible .stack::after{opacity:.55}
.album .layer{position:absolute;inset:0;border-radius:20px;overflow:hidden;border:1px solid var(--edge);background:var(--ink-2);box-shadow:var(--shadow);
  transition:transform .6s cubic-bezier(.2,.85,.15,1)}
.album .layer img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}
.album .l1 img{opacity:0;transform:scale(1.08);transition:opacity 1.2s ease,transform 6s ease}
.album .l1 img.on{opacity:1;transform:scale(1)}
.album .l1::after{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(115deg,transparent 35%,rgba(255,255,255,.28) 48%,transparent 60%);background-size:260% 100%;background-position:130% 0;transition:background-position 1.1s ease}
.album:hover .l1::after{background-position:-40% 0}
.album .l3{transform:rotate(-7deg) translate(-6px,4px) scale(.94);opacity:.75}
.album .l2{transform:rotate(5deg) translate(6px,2px) scale(.96);opacity:.88}
.album:hover .l3,.album:focus-visible .l3{transform:rotate(-13deg) translate(-22px,4px) scale(.93)}
.album:hover .l2,.album:focus-visible .l2{transform:rotate(10deg) translate(22px,-2px) scale(.95)}
.album:hover .l1,.album:focus-visible .l1{transform:translateY(-8px) scale(1.03)}
.album .ph{background:repeating-linear-gradient(135deg,var(--w12) 0 10px,transparent 10px 20px),radial-gradient(90% 90% at 20% 10%,color-mix(in srgb,var(--c) 60%,transparent),transparent 70%),var(--ink-2);display:grid;place-items:center}
.album .ph svg{width:30px;height:30px;stroke:var(--fg);fill:none;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round;opacity:.6}
.album .count{position:absolute;right:10px;bottom:10px;z-index:3;font:500 11px var(--mono);letter-spacing:.06em;padding:4px 9px;border-radius:999px;background:var(--panel);border:1px solid var(--edge);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}
.album .meta{display:flex;align-items:center;gap:8px;min-width:0}
.album .meta i{width:9px;height:9px;border-radius:50%;background:var(--c);flex:0 0 auto;box-shadow:0 0 0 3px color-mix(in srgb,var(--c) 25%,transparent)}
.album .meta b{font:600 16px/1.2 var(--display);letter-spacing:-.01em}
.album .meta small{margin-left:auto;font:500 10px var(--mono);letter-spacing:.1em;color:var(--faint);text-transform:uppercase}
.album.ig .l1{border:2px solid transparent;background:linear-gradient(var(--ink-2),var(--ink-2)) padding-box,linear-gradient(135deg,#feda75,#fa7e1e,#d62976,#962fbf,#4f5bd5) border-box}
.album.ig .meta i{background:conic-gradient(#feda75,#fa7e1e,#d62976,#962fbf,#4f5bd5,#feda75)}
.lb{position:fixed;inset:0;z-index:90;display:grid;place-items:center;padding:max(16px,env(safe-area-inset-top,0px)) max(16px,env(safe-area-inset-right,0px)) max(16px,env(safe-area-inset-bottom,0px)) max(16px,env(safe-area-inset-left,0px));
  background:color-mix(in srgb,var(--ink) 55%,transparent);backdrop-filter:blur(18px) saturate(140%);-webkit-backdrop-filter:blur(18px) saturate(140%);transition:opacity .3s}
.lb.shut{opacity:0;pointer-events:none}
.lb .amb{position:absolute;inset:-10%;background:var(--amb,none) center/cover;filter:blur(70px) saturate(140%);opacity:.55;transition:background-image .6s;pointer-events:none}
.lb .frame{position:relative;width:min(1040px,100%);max-height:calc(100vh - 32px);overflow:auto;border-radius:28px;display:grid;grid-template-columns:1.5fr 1fr;grid-template-areas:"tabs tabs" "shot info" "prog prog" "thumbs thumbs";transform:scale(.96);transition:transform .45s cubic-bezier(.2,.85,.15,1)}
.lb:not(.shut) .frame{transform:none}
.lb .frame > *{min-width:0}
.lb-tabs{grid-area:tabs;display:flex;gap:6px;padding:14px 64px 12px 16px;overflow-x:auto;scrollbar-width:none;border-bottom:1px solid var(--line)}
.lb-tabs::-webkit-scrollbar{display:none}
.lb-tabs button{flex:0 0 auto;font:500 13px var(--body);color:var(--muted);background:none;border:1px solid transparent;border-radius:999px;padding:7px 12px;cursor:pointer;display:inline-flex;gap:7px;align-items:center}
.lb-tabs button i{font:500 10px var(--mono);font-style:normal;opacity:.7}
.lb-tabs button[aria-selected="true"]{color:var(--fg);background:var(--glass-hi);border-color:var(--edge)}
.lb-tabs button::before{content:"";width:8px;height:8px;border-radius:50%;background:var(--tc)}
.lb .shot{grid-area:shot;position:relative;aspect-ratio:3/2;background:var(--ink-2);overflow:hidden}
.lb .shot img{position:relative;width:100%;height:100%;object-fit:contain;display:block;animation:slidein .6s cubic-bezier(.2,.85,.15,1)}
.lb .shot img.bgimg{position:absolute;inset:0;object-fit:cover;filter:blur(26px) saturate(130%);transform:scale(1.2);opacity:.75;animation:none}
.lb .shot.back img{animation-name:slideback}
@keyframes slidein{from{opacity:0;transform:translateX(40px) scale(1.03)}}
@keyframes slideback{from{opacity:0;transform:translateX(-40px) scale(1.03)}}
.lb .prog{grid-area:prog;height:3px;background:var(--line)}
.lb .prog span{display:block;height:100%;width:0;background:var(--c)}
.lb.playing .prog span{animation:prog var(--dur,4s) linear forwards}
@keyframes prog{to{width:100%}}
.lb .play{font:500 13px var(--body);color:var(--fg);background:var(--glass-hi);border:1px solid var(--edge);border-radius:999px;padding:9px 14px;cursor:pointer}
.lb .play[aria-pressed="true"]{background:var(--fg);color:var(--on-fg)}
.lb .iglink{justify-self:start;align-self:flex-start}
.lb .shot .slot{position:absolute;inset:24px;border:1.5px dashed var(--line);border-radius:18px;display:grid;place-items:center;align-content:center;gap:8px;color:var(--muted);font:500 12px var(--mono);letter-spacing:.1em;text-align:center}
.lb .shot .slot svg{width:48px;height:48px;stroke:var(--fg);fill:none;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round;opacity:.7}
.lb .info{grid-area:info;padding:24px 28px;display:flex;flex-direction:column;gap:12px}
.lb .info .k{font:500 11px var(--mono);letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}
.lb .info h3{font:700 clamp(24px,3vw,34px)/1.04 var(--display);letter-spacing:-.03em;margin:0;text-wrap:balance}
.lb .info p{margin:0;color:var(--muted)}
.lb .ctl{margin-top:auto;display:flex;gap:8px;align-items:center}
.lb .ctl .count{margin-right:auto}
.thumbs{grid-area:thumbs;display:flex;gap:8px;padding:12px 16px 16px;overflow-x:auto;border-top:1px solid var(--line);scroll-behavior:smooth}
.thumbs button{flex:0 0 auto;width:92px;aspect-ratio:3/2;border-radius:10px;overflow:hidden;padding:0;border:2px solid transparent;background:var(--ink-2);cursor:pointer;opacity:.6;transition:opacity .2s,border-color .2s,transform .2s}
.thumbs button:hover{opacity:1}
.thumbs button[aria-current="true"]{opacity:1;border-color:var(--c);transform:translateY(-2px)}
.thumbs img{width:100%;height:100%;object-fit:cover;display:block}
.thumbs .tph{width:100%;height:100%;display:grid;place-items:center;font:500 9px var(--mono);letter-spacing:.08em;color:var(--muted);background:repeating-linear-gradient(135deg,var(--w12) 0 6px,transparent 6px 12px)}
.lb .x{position:absolute;top:calc(14px + env(safe-area-inset-top,0px));right:calc(14px + env(safe-area-inset-right,0px));z-index:2;width:46px;height:46px;border-radius:50%;border:1px solid var(--edge);background:var(--glass-hi);color:var(--fg);font-size:22px;cursor:pointer}
@media (max-width:920px){.lb .frame{grid-template-columns:1fr;grid-template-areas:"tabs" "shot" "prog" "info" "thumbs"}.lb .info{padding:18px 20px}}
@media (max-width:520px){.album{flex-basis:72vw}.thumbs button{width:72px}.albums-nav .arrow{display:none}}

/* team */
.team{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.member{border-radius:var(--r-lg);padding:18px;display:flex;flex-direction:column;gap:10px;min-width:0}
.member .ph{aspect-ratio:4/5;border-radius:18px;position:relative;overflow:hidden;display:grid;place-items:center;
  background:radial-gradient(80% 70% at 30% 20%,color-mix(in srgb,var(--c) 60%,transparent),transparent 70%),linear-gradient(160deg,var(--w40),var(--w10));border:1px solid var(--edge)}
.member .ph span{font-family:var(--display);font-size:56px;font-weight:700;letter-spacing:-.04em;opacity:.9}
.member h3{font-family:var(--display);font-size:22px;font-weight:650;letter-spacing:-.02em;margin:4px 0 0}
.member p{margin:0;color:var(--muted);font-size:14px}
.member .ph.has-img{background:none}
.member .ph img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .8s cubic-bezier(.2,.85,.15,1)}
.member:hover .ph img{transform:scale(1.05)}
.member.add .ph{border-style:dashed}
.member.add .ph span{font-size:40px;opacity:.5}

/* contact form */
form.cf{display:grid;gap:14px;align-content:start}
.cf .row2{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.cf label{display:grid;gap:6px;font:500 11px var(--mono);letter-spacing:.12em;text-transform:uppercase;color:var(--faint);min-width:0}
.cf input,.cf select,.cf textarea{font:16px var(--body);color:var(--fg);background:var(--w30);border:1px solid var(--edge);border-radius:14px;padding:12px 14px;width:100%;
  backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);transition:border-color .2s,background .2s}
.cf select option{background:var(--ink-2)}
.cf input:focus,.cf select:focus,.cf textarea:focus{outline:none;border-color:#e8557a;background:var(--w45)}
.cf textarea{min-height:120px;resize:vertical}
.cf .note{font-size:13px;color:var(--muted);margin:0}
.cf .ok{color:var(--fg)}
.cf .err{color:#d6405f}
:root[data-mode="dark"] .cf .err{color:#ff8fa3}
.cf-step{display:grid;gap:14px;animation:stepin .45s cubic-bezier(.2,.85,.15,1)}
@keyframes stepin{from{opacity:0;transform:translateY(10px)}}
.cf-row{display:flex;gap:12px;align-items:center;flex-wrap:wrap}
.cf-row .btn{border:0;cursor:pointer}
.cf-row .btn[disabled]{opacity:.6;cursor:progress}
.hp{position:absolute!important;left:-9999px;width:1px;height:1px;overflow:hidden}
.code-head{display:grid;gap:6px}
.code-head h3{margin:0;font:700 26px/1.1 var(--display);letter-spacing:-.02em}
.code-boxes{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:8px;max-width:380px}
.code-boxes input{text-align:center;font:600 24px var(--mono)!important;padding:12px 0!important;border-radius:14px}
.code-boxes.shake{animation:shake .4s}
@keyframes shake{20%,60%{transform:translateX(-6px)}40%,80%{transform:translateX(6px)}}
.linkbtn{background:none;border:0;padding:6px 2px;font:500 14px var(--body);color:var(--muted);text-decoration:underline;text-underline-offset:3px;cursor:pointer}
.linkbtn:hover{color:var(--fg)}
.linkbtn[disabled]{opacity:.5;cursor:default;text-decoration:none}
.cf-done{justify-items:start}
.cf-done h3{margin:0;font:700 30px/1.05 var(--display);letter-spacing:-.03em}
.tick{width:64px;height:64px;border-radius:50%;display:grid;place-items:center;background:var(--spectrum);box-shadow:0 12px 30px -10px #e8557a}
.tick svg{width:30px;height:30px;fill:none;stroke:#2b2236;stroke-width:2.6;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:24;stroke-dashoffset:24;animation:draw .6s .2s ease forwards}
@keyframes draw{to{stroke-dashoffset:0}}
.demo-note{font:500 11px var(--mono);letter-spacing:.06em;color:var(--muted);border:1px dashed var(--line);border-radius:12px;padding:8px 10px}
@media (max-width:520px){.code-boxes{gap:6px}.code-boxes input{font-size:20px!important}}
.reach{display:flex;flex-wrap:wrap;gap:24px 36px;margin-top:30px}
.reach div{min-width:0}
.reach dt{font:500 11px var(--mono);letter-spacing:.14em;text-transform:uppercase;color:var(--faint)}
.reach dd{margin:4px 0 0;font-size:17px;display:flex;gap:10px;align-items:center;flex-wrap:wrap;overflow-wrap:anywhere}

/* web chat */
.chat-fab{position:fixed;z-index:70;right:calc(20px + env(safe-area-inset-right,0px));bottom:calc(20px + env(safe-area-inset-bottom,0px));
  display:flex;align-items:center;gap:10px;padding:10px 18px 10px 10px;border-radius:999px;cursor:pointer;border:0;color:#fff;font:600 15px var(--body);
  background:linear-gradient(135deg,#25d366,#128c7e);box-shadow:0 14px 30px -12px #128c7e,inset 0 1px 0 rgba(255,255,255,.35);transition:transform .25s,box-shadow .25s}
.chat-fab:hover{transform:translateY(-2px);box-shadow:0 18px 36px -12px #128c7e,inset 0 1px 0 rgba(255,255,255,.35)}
.chat-fab .pulse{width:36px;height:36px;border-radius:50%;background:rgba(255,255,255,.18);display:grid;place-items:center;position:relative}
.chat-fab .pulse svg{width:24px;height:24px;fill:#fff}
.chat-fab .pulse::after{content:"";position:absolute;inset:-3px;border-radius:50%;border:2px solid #fff;animation:ping 2.4s ease-out infinite}
.chat-fab[aria-expanded="true"] .pulse::after{animation:none;opacity:0}
@keyframes ping{0%{transform:scale(.9);opacity:.8}100%{transform:scale(1.6);opacity:0}}
.chat{position:fixed;z-index:71;right:calc(20px + env(safe-area-inset-right,0px));bottom:calc(86px + env(safe-area-inset-bottom,0px));width:min(370px,calc(100vw - 32px));
  max-height:min(600px,calc(100vh - 140px));border-radius:26px;display:flex;flex-direction:column;overflow:hidden;
  background:var(--panel);transform-origin:bottom right;transition:transform .45s cubic-bezier(.2,.85,.15,1),opacity .3s}
.chat.shut{transform:scale(.6) translateY(30px);opacity:0;pointer-events:none}
.chat .ch{display:flex;align-items:center;gap:12px;padding:14px 16px;border-bottom:1px solid var(--line);background:linear-gradient(135deg,rgba(37,211,102,.16),transparent)}
.chat .ch .av{width:38px;height:38px;border-radius:12px;background:var(--spectrum);display:grid;place-items:center;font:700 13px "Times New Roman",serif;color:#2b2236}
.chat .ch b{display:block;font-size:15px}
.chat .ch small{color:var(--muted);font-size:12px;display:flex;align-items:center;gap:6px}
.chat .ch small::before{content:"";width:7px;height:7px;border-radius:50%;background:#25d366}
.chat .ch button{margin-left:auto;background:none;border:0;color:var(--muted);font-size:22px;cursor:pointer;line-height:1}
.wa-body{flex:1;overflow-y:auto;padding:16px 16px 6px;display:grid;gap:12px;align-content:start;overscroll-behavior:contain}
.m{max-width:88%;padding:10px 14px;border-radius:18px;font-size:14.5px;line-height:1.45}
.m.bot{background:var(--w40);border:1px solid var(--edge);border-bottom-left-radius:6px}
.starters{list-style:none;margin:0;padding:0;display:grid;gap:8px;justify-items:end}
.starters li{opacity:0;transform:translateY(-8px) scale(.96);transition:opacity .35s,transform .45s cubic-bezier(.2,.85,.15,1)}
.chat:not(.shut) .starters li{opacity:1;transform:none}
.starters a{display:flex;align-items:center;gap:10px;max-width:300px;padding:10px 14px;border-radius:18px;border-bottom-right-radius:6px;text-decoration:none;
  color:var(--fg);font-size:14.5px;line-height:1.35;background:color-mix(in srgb,#25d366 14%,var(--panel));border:1px solid color-mix(in srgb,#25d366 35%,var(--edge));transition:background .2s,transform .2s}
.starters a:hover,.starters a:focus-visible{background:color-mix(in srgb,#25d366 26%,var(--panel));transform:translateX(-3px)}
.starters a b{font-weight:600}
.starters a i{font-style:normal;color:#128c7e;font-size:13px;margin-left:auto}
:root[data-mode="dark"] .starters a i{color:#25d366}
.wa-foot{margin:0;padding:0 16px 14px;font-size:12px;color:var(--muted);text-align:center}
.wa-btn{display:flex;align-items:center;gap:12px;margin:8px 16px 8px;padding:10px 14px;border-radius:16px;text-decoration:none;color:#fff;background:linear-gradient(135deg,#25d366,#128c7e);box-shadow:0 10px 24px -12px #128c7e;transition:transform .2s,box-shadow .2s}
.wa-btn:hover{transform:translateY(-1px);box-shadow:0 14px 28px -12px #128c7e}
.wa-btn svg{width:26px;height:26px;fill:#fff;flex:0 0 auto}
.wa-btn span{display:grid;gap:1px;line-height:1.2}
.wa-btn b{font:600 14px var(--body)}
.wa-btn small{font:500 11px var(--mono);letter-spacing:.04em;opacity:.9}
.wa-btn i{margin-left:auto;font-style:normal;opacity:.85}
.wa-link{display:inline-flex;align-items:center;gap:8px;text-decoration:none;color:var(--fg)}
.wa-link svg{width:20px;height:20px;fill:#25d366}
.wa-link:hover span{text-decoration:underline;text-underline-offset:3px}
@media (max-width:920px){.team{grid-template-columns:repeat(2,1fr)}}
@media (max-width:520px){.cf .row2{grid-template-columns:1fr}}

section[id],.tab{scroll-margin-top:96px}
/* dynamic nav */
.nav{transition:box-shadow .6s,border-color .6s,background .6s}
.nav.tinted{border-color:color-mix(in srgb,var(--navc) 55%,var(--edge));box-shadow:inset 0 1px 0 var(--w90),0 0 0 4px color-mix(in srgb,var(--navc) 18%,transparent),var(--shadow)}
.nav ul a{position:relative;display:flex;align-items:center;gap:6px}
.nav ul a.on{color:var(--fg);background:var(--glass-hi)}
.nav ul a .cur{display:inline-flex;align-items:center;gap:6px;max-width:0;overflow:hidden;white-space:nowrap;opacity:0;transition:max-width .6s cubic-bezier(.2,.85,.15,1),opacity .3s}
.nav ul a .cur::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--navc);flex:0 0 auto}
.nav ul a .cur.show{max-width:220px;opacity:1}
.nav ul a .cur em{font-style:normal;font-weight:600;color:var(--fg)}
@media (max-width:1180px){.nav ul a .cur.show{max-width:130px}.nav ul a .cur em{overflow:hidden;text-overflow:ellipsis}}

/* laser nav dropdown */
.nav li.has-drop{position:relative}
.nav .laser-btn{display:flex;align-items:center;gap:7px;padding:8px 14px;border-radius:999px;border:0;background:none;font:500 14px var(--body);color:var(--fg);cursor:pointer}
.nav .laser-btn::before{content:"";width:8px;height:8px;border-radius:50%;background:#e8557a;box-shadow:0 0 0 3px rgba(232,85,122,.18),0 0 12px #e8557a}
.nav .laser-btn:hover,.nav .laser-btn[aria-expanded="true"]{background:var(--glass-hi)}
.drop{position:absolute;top:calc(100% + 10px);left:50%;width:min(440px,calc(100vw - 32px));transform:translateX(-50%) translateY(-6px);border-radius:24px;padding:22px;
  display:grid;gap:14px;opacity:0;pointer-events:none;transition:opacity .25s,transform .35s cubic-bezier(.2,.85,.15,1);background:var(--panel)}
.drop.show{opacity:1;pointer-events:auto;transform:translateX(-50%) translateY(0)}
.drop .beam{height:4px;border-radius:4px;background:linear-gradient(90deg,transparent,#e8557a,#ffb88a,transparent);background-size:200% 100%;animation:shift 2.8s linear infinite alternate}
.drop h4{font-family:var(--display);font-size:24px;font-weight:700;letter-spacing:-.03em;margin:0;line-height:1.05}
.drop p{margin:0;color:var(--muted);font-size:14.5px}
.drop .cols{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.drop .cols div{border-radius:16px;padding:12px 14px;background:var(--w70);border:1px solid var(--line)}
.drop .cols b{display:block;font:500 11px var(--mono);letter-spacing:.12em;text-transform:uppercase;color:var(--faint);margin-bottom:4px}
.drop .cols span{font-size:14px}
.drop .btn{justify-self:start}
@media (max-width:920px){
  .nav ul{display:flex}
  .nav ul li:not(.has-drop){display:none}
}
@media (max-width:420px){.nav .btn{display:none}.drop .cols{grid-template-columns:1fr}}

/* services mega menu */
header .wrap{position:relative}
.drop{width:min(860px,calc(100vw - 32px));grid-template-columns:300px 1fr;gap:22px;align-items:start;max-height:calc(100vh - 120px);overflow:auto}
.drop .feat{display:grid;gap:12px;padding:18px;border-radius:20px;background:color-mix(in srgb,var(--mint) 28%,var(--panel));border:1px solid var(--line)}
.drop .feat .cols{grid-template-columns:1fr}
.drop .tagnew{font:500 10px var(--mono);letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}
.svc-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px 22px;padding-top:4px}
.svc-grp h5{margin:0 0 6px;font:500 10px var(--mono);letter-spacing:.14em;text-transform:uppercase;color:var(--faint)}
.svc-grp a{display:flex;align-items:center;gap:10px;padding:7px 10px;margin:0 -10px;border-radius:12px;text-decoration:none;font-size:14.5px;color:var(--fg);transition:background .2s}
.svc-grp a:hover,.svc-grp a:focus-visible{background:var(--glass-hi)}
.svc-grp a i{width:9px;height:9px;border-radius:50%;background:var(--c);flex:0 0 auto;box-shadow:0 0 0 3px color-mix(in srgb,var(--c) 25%,transparent)}
.svc-grp a em{margin-left:auto;font:500 9px var(--mono);letter-spacing:.1em;font-style:normal;padding:2px 6px;border-radius:6px;background:var(--c);color:#2b2236}
.svc-grp a.cur{background:var(--glass-hi);font-weight:600}
@media (max-width:920px){
  .drop{grid-template-columns:1fr;max-height:calc(100vh - 110px);overscroll-behavior:contain;background:color-mix(in srgb,var(--ink) 94%,transparent)}
  .drop .feat .cols{grid-template-columns:1fr 1fr}
}
@media (max-width:480px){.svc-list{grid-template-columns:1fr}.drop .feat .cols{grid-template-columns:1fr}}

/* upload portal button + modal */
.up-btn{display:flex;align-items:center;gap:7px;padding:8px 14px;border-radius:999px;border:1px solid var(--edge);background:var(--glass-hi);font:600 14px var(--body);color:var(--fg);cursor:pointer;transition:background .2s,border-color .2s}
.up-btn:hover{border-color:#e8557a}
.up-btn.ghost-up{background:none}
.nav ul a,.up-btn{white-space:nowrap}
.nav ul{gap:2px}
@media (max-width:1440px){.nav ul a{padding:8px 10px}.logo .wm small{display:none}.mode .lbl{display:none}}
.up-li + .up-li{margin-left:-2px}
.up-btn svg,.up-ico svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.up-modal{z-index:95}
.up-card{position:relative;width:min(860px,100%);max-height:calc(100vh - 40px);overflow:auto;border-radius:28px;padding:clamp(20px,3vw,32px);background:var(--panel);display:grid;gap:22px;transform:scale(.96);transition:transform .45s cubic-bezier(.2,.85,.15,1)}
.up-modal:not(.shut) .up-card{transform:none}
.up-head{display:flex;gap:14px;align-items:center}
.up-head h3{margin:4px 0 0;font:700 clamp(24px,3vw,32px)/1.05 var(--display);letter-spacing:-.03em}
.up-ico{width:52px;height:52px;border-radius:16px;display:grid;place-items:center;background:var(--spectrum);color:#2b2236;flex:0 0 auto}
.up-ico svg{width:24px;height:24px}
.up-cols{display:grid;grid-template-columns:1fr 1.2fr;gap:20px}
.up-col{min-width:0;display:grid;gap:12px;align-content:start;padding:18px;border-radius:20px;border:1px solid var(--line);background:var(--w20)}
.up-col h4{margin:0;font:650 18px var(--display);letter-spacing:-.01em}
.up-col p{margin:0;color:var(--muted);font-size:14.5px}
.up-col .btn{justify-self:start;border:0;cursor:pointer}
.up-col .linkbtn{justify-self:start;padding:0}
.up-url{font:500 12px var(--mono)!important;letter-spacing:.06em}
.up-s{display:grid;gap:12px}
@media (max-width:1300px){.up-btn span{display:none}.up-btn{padding:9px}}
@media (max-width:920px){.nav .up-li{display:list-item!important}}
@media (max-width:700px){.up-cols{grid-template-columns:1fr}}
@media (max-width:460px){.nav .up-li{display:none!important}}

/* artwork guide inside the upload panel */
.up-tabs{display:flex;gap:6px;padding:4px;border-radius:999px;background:var(--w20);border:1px solid var(--line);justify-self:start;flex-wrap:wrap}
.up-tabs button{display:inline-flex;align-items:center;gap:8px;padding:8px 14px;border-radius:999px;border:0;background:none;font:600 14px var(--body);color:var(--muted);cursor:pointer}
.up-tabs button i{font:600 11px var(--mono);font-style:normal;width:20px;height:20px;border-radius:50%;display:grid;place-items:center;border:1px solid var(--line)}
.up-tabs button[aria-selected="true"]{background:var(--fg);color:var(--on-fg)}
.up-tabs button[aria-selected="true"] i{border-color:transparent;background:var(--spectrum);color:#2b2236}
.up-guide{display:grid;gap:16px}
.up-lede{margin:0;color:var(--muted)}
.up-lede a{color:var(--fg);font-weight:600}
.g-steps{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;counter-reset:g}
.g-steps li{counter-increment:g;display:grid;gap:4px;padding:14px 14px 14px 52px;position:relative;border-radius:16px;background:var(--w20);border:1px solid var(--line);font-size:13.5px;color:var(--muted)}
.g-steps li::before{content:counter(g);position:absolute;left:12px;top:12px;width:30px;height:30px;border-radius:9px;display:grid;place-items:center;font:700 16px var(--display);background:var(--fg);color:var(--on-fg)}
.g-steps b{color:var(--fg);font:650 15px var(--display)}
.g-steps em{display:block;margin-top:4px;font-style:normal;font-weight:600;color:#c43a3a}
:root[data-mode="dark"] .g-steps em{color:#ff8f8f}
.g-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.g-box{min-width:0;padding:16px;border-radius:18px;background:var(--w20);border:1px solid var(--line);display:grid;gap:8px;align-content:start;font-size:13.5px;color:var(--muted)}
.g-box h4{margin:0;font:650 17px var(--display);color:var(--fg);display:flex;align-items:center;gap:8px}
.g-box p{margin:0}
.g-box b{color:var(--fg)}
.g-chips{display:flex;flex-wrap:wrap;gap:6px}
.g-chips span{font:600 11px var(--mono);letter-spacing:.06em;padding:5px 9px;border-radius:8px;background:var(--fg);color:var(--on-fg)}
.g-chips .pref{background:none;color:var(--fg);border:1.5px solid var(--fg)}
.g-list{margin:0;padding:0 0 0 16px;display:grid;gap:5px}
.g-list li::marker{color:#e8557a}
.g-rgb{grid-row:span 2;background:linear-gradient(160deg,color-mix(in srgb,var(--p) 30%,transparent),color-mix(in srgb,var(--m) 22%,transparent) 50%,color-mix(in srgb,var(--y) 25%,transparent)),var(--w20)}
.g-rgb-top{display:grid;grid-template-columns:120px 1fr;gap:12px;align-items:center}
.g-rgb-top img{width:120px;height:auto;filter:drop-shadow(0 8px 14px rgba(0,0,0,.18))}
:root[data-mode="dark"] .g-rgb-top img{background:rgba(255,255,255,.88);border-radius:14px;padding:6px}
@media (max-width:420px){.g-rgb-top{grid-template-columns:90px 1fr}.g-rgb-top img{width:90px}}
.g-new{font:700 10px var(--mono);letter-spacing:.08em;padding:3px 7px;border-radius:999px;background:var(--fg);color:var(--on-fg)}
.g-charges table{width:100%;border-collapse:collapse;font-variant-numeric:tabular-nums}
.g-charges td{padding:6px 0;border-top:1px solid var(--line);color:var(--fg)}
.g-charges td:last-child{text-align:right;font-weight:600}
.g-foot{--pad:clamp(20px,3vw,32px);position:sticky;bottom:calc(-1 * var(--pad));z-index:2;margin:0 calc(-1 * var(--pad)) calc(-1 * var(--pad));padding:14px var(--pad) calc(14px + 4px);display:flex;gap:14px;align-items:center;justify-content:space-between;flex-wrap:wrap;background:color-mix(in srgb,var(--ink) 94%,transparent);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border-top:1px solid var(--line);border-radius:0 0 28px 28px}
.g-ack{display:flex;gap:10px;align-items:center;font:500 14px var(--body);color:var(--fg);cursor:pointer}
.g-ack input{width:18px;height:18px;accent-color:#e8557a}
.g-foot .btn{border:0;cursor:pointer}
.g-foot .btn.ghost{color:var(--fg)}
@media (max-width:760px){.g-steps,.g-grid{grid-template-columns:1fr}.g-rgb{grid-row:auto}}

.f-seo{display:grid;grid-template-columns:1.4fr 1fr .8fr;gap:28px;margin-bottom:28px;font-size:13.5px;color:var(--muted)}
.f-seo > *{min-width:0}
.f-seo p{margin:0;max-width:60ch}
.f-h{font:650 14px var(--display);color:var(--fg);margin:0 0 8px;letter-spacing:0}
.f-svc{list-style:none;margin:0;padding:0;columns:2;column-gap:18px}
.f-svc li{break-inside:avoid;padding:2px 0}
.f-svc a{color:var(--muted);text-decoration:none}
.f-svc a:hover{color:var(--fg);text-decoration:underline}
.socials{display:flex;gap:8px;margin-top:12px;flex-wrap:wrap}
.socials .so{display:inline-flex;align-items:center;gap:8px;height:36px;min-width:36px;padding:0 9px;border-radius:999px;border:1px solid var(--edge);background:var(--glass-hi);color:var(--fg);text-decoration:none;font:600 13px var(--body);transition:transform .2s,background .2s,color .2s}
.socials .so svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.socials .so:hover{transform:translateY(-2px)}
.socials .so-instagram:hover{color:#fff;border-color:transparent;background:linear-gradient(45deg,#feda75,#fa7e1e,#d62976,#962fbf,#4f5bd5)}
.socials.big{margin-top:22px}
.socials.big .so{height:42px;padding:0 16px 0 12px}
.f-adr{font-style:normal;line-height:1.6}
@media (max-width:820px){.f-seo{grid-template-columns:1fr}}

/* mobile menu */
.burger{display:none;width:42px;height:42px;border-radius:50%;border:1px solid var(--edge);background:var(--glass-hi);cursor:pointer;place-items:center;padding:0}
.burger span{display:block;width:18px;height:2px;border-radius:2px;background:var(--fg);position:relative;transition:background .3s}
.burger span::before,.burger span::after{content:"";position:absolute;left:0;width:18px;height:2px;border-radius:2px;background:var(--fg);transition:transform .35s cubic-bezier(.2,.85,.15,1)}
.burger span::before{top:-6px}.burger span::after{top:6px}
.burger[aria-expanded="true"] span{background:transparent}
.burger[aria-expanded="true"] span::before{transform:translateY(6px) rotate(45deg)}
.burger[aria-expanded="true"] span::after{transform:translateY(-6px) rotate(-45deg)}
.msheet{position:fixed;z-index:49;left:max(16px,env(safe-area-inset-left,0px));right:max(16px,env(safe-area-inset-right,0px));top:calc(88px + env(safe-area-inset-top,0px));
  border-radius:26px;padding:12px;display:grid;gap:4px;background:var(--panel);transform:translateY(-10px);opacity:0;pointer-events:none;transition:opacity .25s,transform .4s cubic-bezier(.2,.85,.15,1)}
.msheet.show{opacity:1;transform:none;pointer-events:auto}
.msheet a{display:flex;justify-content:space-between;align-items:center;padding:14px 16px;border-radius:16px;text-decoration:none;font:600 20px var(--display);letter-spacing:-.02em}
.msheet a small{font:500 11px var(--mono);letter-spacing:.12em;color:var(--faint)}
.msheet a:active,.msheet a:hover{background:var(--glass-hi)}
.msheet .call{margin-top:6px;padding:14px 16px;border-top:1px solid var(--line);font-size:14px;color:var(--muted);display:flex;justify-content:space-between;gap:10px;flex-wrap:wrap}
.msheet .call b{color:var(--fg)}
@media (max-width:920px){
  .burger{display:grid}
  .drop{position:fixed;z-index:55;left:max(16px,env(safe-area-inset-left,0px));right:max(16px,env(safe-area-inset-right,0px));top:calc(88px + env(safe-area-inset-top,0px));width:auto;transform:translateY(-6px)}
  .drop.show{transform:none}
  .nav{gap:8px}
  .nav ul{margin-left:auto}
}
@media (min-width:921px){.msheet{display:none}}
@media (max-width:600px){.s1 .tag{display:none}.stage{opacity:.32}}

/* contact */
.contact{border-radius:36px;padding:clamp(32px,6vw,72px);display:grid;grid-template-columns:1fr 1fr;gap:clamp(28px,5vw,56px);position:relative;overflow:hidden}
.contact > *{min-width:0}
.contact::before{content:"";position:absolute;inset:-40% -10% auto auto;width:520px;height:520px;border-radius:50%;background:conic-gradient(from 0deg,var(--y),var(--o),var(--r),var(--m),var(--p),var(--y));filter:blur(70px);opacity:.28;animation:spin 24s linear infinite}
@keyframes spin{to{transform:rotate(1turn)}}
.contact > *{position:relative}
.contact p{color:var(--muted);max-width:44ch;font-size:18px}
.dl{display:grid;gap:18px;align-content:start}
.dl div{border-top:1px solid var(--line);padding-top:14px}
.dl dt{font-family:var(--mono);font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--faint)}
.dl dd{margin:6px 0 0;font-size:17px;display:flex;align-items:center;gap:10px;flex-wrap:wrap;overflow-wrap:anywhere}
.copy{font:500 12px var(--mono);color:var(--fg);background:var(--glass-hi);border:1px solid var(--edge);border-radius:999px;padding:5px 11px;cursor:pointer}
.copy:hover{background:var(--w53)}

footer{padding-block:40px 56px;color:var(--faint);font-size:13px}
footer .wrap{display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap}
.bar{height:4px;background:var(--spectrum);border-radius:4px;margin-bottom:28px;opacity:.8}

/* reveal: visible at rest, small lift in */
.rv{transform:translateY(0);transition:transform 1s cubic-bezier(.2,.8,.2,1)}
.js .rv.pre{transform:translateY(36px)}

@media (max-width:920px){
  .about,.contact{grid-template-columns:1fr}
  }
@media (max-width:600px){
  .s1{right:-18%;top:4%;opacity:.7}.s2{right:-10%;top:58%;opacity:.6}.s3,.s4{display:none}
  .hero h1{font-size:clamp(46px,15vw,76px)}
}
@media (prefers-reduced-motion:reduce){.arrow.hint,.arrow.hint::after{animation:none}
  *,*::before,*::after{animation:none!important;transition:none!important}
  html{scroll-behavior:auto}
}

/* logo + theme switch */
.logo{align-items:center;gap:10px}
.logo img{width:40px;height:40px;border-radius:10px;display:block;box-shadow:0 6px 16px -6px var(--sh35),inset 0 0 0 1px var(--w30)}
.logo .wm{font:600 15px var(--display);letter-spacing:-.01em;color:var(--fg);white-space:nowrap}
.logo .wm small{font:500 12px var(--body);color:var(--muted)}
.mode{display:inline-flex;align-items:center;gap:10px;border:0;background:none;cursor:pointer;font:500 13px var(--body);color:var(--muted);padding:4px}
.mode .track{position:relative;width:64px;height:34px;border-radius:999px;background:var(--spectrum);box-shadow:inset 0 1px 3px rgba(0,0,0,.18),inset 0 0 0 1px var(--w30);transition:background .5s}
:root[data-mode="dark"] .mode .track{background:linear-gradient(90deg,#2a2238,#3c2a4d)}
.mode .knob{position:absolute;top:3px;left:3px;width:28px;height:28px;border-radius:50%;display:grid;place-items:center;
  background:rgba(255,255,255,.9);box-shadow:0 4px 12px rgba(0,0,0,.2),inset 0 1px 0 #fff;transition:transform .5s cubic-bezier(.2,.85,.15,1),background .5s}
:root[data-mode="dark"] .mode .knob{transform:translateX(30px);background:#f4f1f7}
.mode svg{width:16px;height:16px;fill:none;stroke:#2b2236;stroke-width:2;stroke-linecap:round;position:absolute;transition:opacity .3s,transform .5s}
.mode .moon{opacity:0;transform:rotate(-60deg)}
:root[data-mode="dark"] .mode .sun{opacity:0;transform:rotate(60deg)}
:root[data-mode="dark"] .mode .moon{opacity:1;transform:none}
@media (max-width:1180px){.logo .wm small{display:none}.mode .lbl{display:none}}
@media (max-width:1040px) and (min-width:921px){.logo .wm{display:none}}
@media (max-width:520px){.mode .lbl{display:none}.logo .wm{display:none}}

/* image protection: no dragging, selecting or long-press saving of photos */
img{-webkit-user-drag:none;user-drag:none;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none}

/* careers */
.vac-head{display:flex;align-items:center;gap:14px;flex-wrap:wrap;margin:0 0 16px}
.vac-title{margin:0;font-size:clamp(30px,5vw,52px);letter-spacing:.14em;text-transform:uppercase;line-height:1}
.vac-dot{width:14px;height:14px;border-radius:50%;background:var(--faint);flex:0 0 auto}
.vac-count{font-family:var(--mono);font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);padding:8px 14px;border-radius:999px;border:1px solid var(--edge);background:var(--glass)}
.vac-head.live .vac-dot{background:#2bd67b;box-shadow:0 0 0 0 rgba(43,214,123,.7);animation:vacPing 1.6s ease-out infinite}
.vac-head.live .vac-title{background:linear-gradient(90deg,var(--fg) 0%,var(--fg) 35%,var(--y) 45%,var(--o) 50%,var(--fg) 60%,var(--fg) 100%);background-size:300% 100%;-webkit-background-clip:text;background-clip:text;color:transparent;animation:vacShine 3.2s linear infinite,vacBlink 1.6s ease-in-out infinite}
.vac-head.live .vac-count{color:var(--fg);border-color:rgba(43,214,123,.5)}
@keyframes vacPing{0%{box-shadow:0 0 0 0 rgba(43,214,123,.7)}80%,100%{box-shadow:0 0 0 14px rgba(43,214,123,0)}}
@keyframes vacShine{0%{background-position:100% 0}100%{background-position:-50% 0}}
@keyframes vacBlink{0%,100%{opacity:1}50%{opacity:.55}}
.roles{display:grid;gap:16px}
.job{border-radius:var(--r-lg);display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.3fr);gap:28px;padding:22px;align-items:start}
.job-ad{position:relative;border-radius:18px;overflow:hidden;aspect-ratio:1;background:#0c0a12;position:sticky;top:100px}
.job-slides img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity .7s;cursor:pointer}
.job-slides img.on{opacity:1}
.job-dots{position:absolute;left:0;right:0;bottom:12px;display:flex;justify-content:center;gap:8px}
.job-dots button{width:9px;height:9px;padding:0;border-radius:50%;border:0;background:rgba(255,255,255,.4);cursor:pointer;transition:width .3s,background .3s}
.job-dots button[aria-current]{width:26px;border-radius:9px;background:#fff}
.job-main{min-width:0;padding:6px 4px}
.job-title{margin:10px 0 0;font-family:Georgia,"Times New Roman",serif;font-weight:400;font-size:clamp(30px,3.6vw,46px);line-height:1.05}
.job-sub{margin:6px 0 16px;color:var(--muted);font-size:18px}
.job-meta{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:18px}
.job-meta span{display:inline-flex;align-items:center;gap:8px;font-size:13px;padding:8px 12px;border-radius:12px;border:1px solid var(--edge);background:var(--glass)}
.job-meta svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.job-lead{color:var(--muted);line-height:1.65;margin:0 0 18px}
.job-main h4{margin:0 0 10px;font-size:16px}
.job-list{list-style:none;margin:0 0 18px;padding:0;display:grid;gap:10px}
.job-list li{display:flex;gap:12px;align-items:flex-start;line-height:1.5}
.job-list svg{flex:0 0 auto;width:22px;height:22px;padding:3px;border-radius:6px;background:linear-gradient(135deg,var(--mint),var(--p));fill:none;stroke:#10202a;stroke-width:3;stroke-linecap:round;stroke-linejoin:round;margin-top:1px}
.job-note{border-left:3px solid var(--o);padding:10px 14px;border-radius:0 12px 12px 0;background:var(--glass);color:var(--muted);line-height:1.6;margin:0 0 16px}
.job-note b{color:var(--fg)}
.job-apply{color:var(--muted);margin:0 0 16px;line-height:1.6}
.job-acts{display:flex;flex-wrap:wrap;gap:10px}
.more{margin-top:16px;border-radius:var(--r-lg);padding:24px 26px;display:flex;justify-content:space-between;align-items:center;gap:20px;flex-wrap:wrap}
.more h3{margin:0 0 8px;font-size:22px}.more p{margin:0;color:var(--muted);line-height:1.6;max-width:62ch}
@media (max-width:860px){.job{grid-template-columns:1fr;padding:16px;gap:18px}.job-ad{position:relative;top:0}}
@media (prefers-reduced-motion:reduce){.vac-head.live .vac-dot,.vac-head.live .vac-title{animation:none;color:var(--fg);background:none}}

.f-privacy{margin:14px 0 0;font-size:12px;color:var(--faint)}.f-privacy a{color:var(--muted)}
