:root{--bg:#0a0a0a;--fg:#f0f0ec;--muted:#969691;--line:rgba(240,240,236,.23);--light:#e9e9e4;--ink:#0a0a0a}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--bg);color:var(--fg);font-family:Manrope,Arial,sans-serif;overflow-x:hidden}body.modal-open{overflow:hidden}a{color:inherit;text-decoration:none}button{font:inherit;color:inherit}::selection{background:var(--fg);color:var(--bg)}
.noise{position:fixed;inset:0;pointer-events:none;z-index:9997;opacity:.035;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 160 160' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.95' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.8'/%3E%3C/svg%3E")}.progress{position:fixed;top:0;left:0;height:2px;width:0;background:var(--fg);z-index:9998}
.preloader{position:fixed;inset:0;z-index:10000;background:#050505;padding:26px;display:flex;flex-direction:column;justify-content:space-between;transition:transform 1s cubic-bezier(.76,0,.24,1)}.preloader.hide{transform:translateY(-102%)}.preloader-mark{font-size:clamp(52px,12vw,180px);font-weight:600;letter-spacing:-.08em}.preloader-row{padding-top:12px;border-top:1px solid var(--line);display:flex;justify-content:space-between;font:11px "DM Mono",monospace}
.cursor{position:fixed;width:68px;height:68px;border:1px solid rgba(255,255,255,.75);border-radius:50%;display:grid;place-items:center;pointer-events:none;z-index:9999;transform:translate(-50%,-50%) scale(.35);opacity:0;transition:transform .25s ease,opacity .2s ease,background .2s,color .2s;font:10px "DM Mono",monospace;mix-blend-mode:difference}.cursor.active{transform:translate(-50%,-50%) scale(1);opacity:1;background:#fff;color:#000;mix-blend-mode:normal}
.nav{position:fixed;z-index:9000;top:0;left:0;width:100%;padding:21px 26px;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;mix-blend-mode:difference;color:#fff}.brand{font-size:17px;font-weight:700;letter-spacing:-.05em}.brand sup{font:7px "DM Mono",monospace;margin-left:2px;vertical-align:top}.nav-links{display:flex;gap:28px;font:10px "DM Mono",monospace}.availability{justify-self:end;font:10px "DM Mono",monospace}.availability i{display:inline-block;width:6px;height:6px;background:#fff;border-radius:50%;margin-right:8px;animation:pulse 1.8s infinite}@keyframes pulse{50%{opacity:.25}}
.section-dark{background:#090909}.hero{height:100svh;min-height:680px;position:relative;overflow:hidden;padding:88px 26px 25px}.hero-media{position:absolute;inset:0;overflow:hidden;background:#080808}.hero-video{position:absolute;inset:-4%;width:108%;height:108%;object-fit:cover;opacity:.28;filter:saturate(.25) contrast(1.1)}.hero-fallback{position:absolute;inset:0;background:radial-gradient(circle at 78% 30%,rgba(255,255,255,.10),transparent 22%),linear-gradient(125deg,#070707 10%,#191919 48%,#070707 82%)}.hero-glow{position:absolute;border-radius:50%;filter:blur(2px);opacity:.32;will-change:transform}.glow-a{width:44vw;height:44vw;right:-8vw;top:7vh;border:1px solid rgba(255,255,255,.22);box-shadow:inset 0 0 80px rgba(255,255,255,.05)}.glow-b{width:25vw;height:25vw;right:24vw;bottom:-9vw;border:1px solid rgba(255,255,255,.12)}
.hero-kicker{position:relative;z-index:2;display:flex;justify-content:space-between;padding-top:9px;border-top:1px solid rgba(255,255,255,.3);font:10px "DM Mono",monospace}.hero-title{position:absolute;left:24px;top:50%;z-index:2;transform:translateY(-48%);margin:0;font-size:clamp(100px,18.2vw,285px);line-height:.69;letter-spacing:-.09em;font-weight:600}.title-line{display:block;overflow:hidden;padding-right:.09em}.title-line>span{display:block;transform:translateY(110%)}body.loaded .title-line>span{animation:titleIn 1.15s cubic-bezier(.76,0,.24,1) forwards}body.loaded .title-line:nth-child(2)>span{animation-delay:.08s}@keyframes titleIn{to{transform:translateY(0)}}.title-outline>span{color:transparent;-webkit-text-stroke:1.3px rgba(255,255,255,.92)}.hero-side{position:absolute;z-index:2;right:26px;top:50%;display:flex;gap:28px;transform:rotate(90deg) translateX(50%);transform-origin:right center;font:9px "DM Mono",monospace}.hero-bottom{position:absolute;z-index:2;left:26px;right:26px;bottom:24px;display:flex;justify-content:space-between;align-items:flex-end}.hero-bottom p{margin:0;max-width:330px;font-size:13px;line-height:1.5;color:#cacac5}.scroll-link{font:10px "DM Mono",monospace}.scroll-link span{display:inline-block;margin-left:9px;animation:bounce 1.5s infinite}@keyframes bounce{50%{transform:translateY(5px)}}
.section-label{border-top:1px solid var(--line);padding-top:10px;display:flex;justify-content:space-between;font:10px "DM Mono",monospace;color:#a8a8a2}
.orbit-section{height:110svh;min-height:760px;position:relative;padding:28px 26px;overflow:hidden;background:#0b0b0b}.orbit-copy{position:absolute;left:26px;top:15vh;z-index:2}.orbit-copy p{font:10px "DM Mono",monospace;margin:0 0 12px}.orbit-copy h2,.works-intro h2,.studio h2{font-size:clamp(54px,8.5vw,130px);line-height:.82;letter-spacing:-.07em;margin:0;font-weight:600}.orbit-copy em,.works-intro em,.studio em,.contact-main em{font-style:normal;color:transparent;-webkit-text-stroke:1px currentColor}.orbital-stage{position:absolute;width:min(61vw,880px);aspect-ratio:1;right:3vw;top:50%;transform:translateY(-47%);perspective:900px;cursor:grab}.orbital-stage:active{cursor:grabbing}.orbit-ring{position:absolute;inset:12%;border:1px solid rgba(255,255,255,.12);border-radius:50%;pointer-events:none}.ring-2{transform:rotateX(68deg);opacity:.8}.orbit-center{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:118px;height:118px;border-radius:50%;background:#efefe9;color:#0a0a0a;display:grid;place-content:center;text-align:center;font:9px "DM Mono",monospace;box-shadow:0 0 65px rgba(255,255,255,.12);z-index:30}.orbit-center strong{font:600 26px Manrope;letter-spacing:-.06em}.orbit-item{position:absolute;left:50%;top:50%;width:clamp(120px,14vw,215px);aspect-ratio:4/3;margin-left:calc(clamp(120px,14vw,215px) / -2);margin-top:calc(clamp(120px,14vw,215px) * -.375);overflow:hidden;border-radius:2px;border:1px solid rgba(255,255,255,.18);background:#151515;transition:filter .2s;will-change:transform,opacity}.orbit-item:hover{filter:brightness(1.25)}.orbit-item img{width:100%;height:100%;object-fit:cover;display:block}.orbit-item span{position:absolute;left:8px;bottom:7px;background:#0a0a0ad9;padding:4px 6px;font:8px "DM Mono",monospace}.orbit-note{position:absolute;right:26px;bottom:26px;font:9px "DM Mono",monospace;color:#777}
.works{background:var(--light);color:var(--ink);padding:28px 26px 120px}.works .section-label{border-color:rgba(10,10,10,.3);color:#5c5c58}.view-switch{display:flex;gap:6px}.view-btn{border:0;background:none;padding:0;cursor:pointer;font:10px "DM Mono",monospace;opacity:.35}.view-btn.active{opacity:1;text-decoration:underline;text-underline-offset:4px}.works-intro{display:grid;grid-template-columns:1.3fr .7fr;gap:7vw;margin:90px 0}.works-intro p{align-self:end;max-width:420px;line-height:1.55;font-size:14px}.works-intro code{font:11px "DM Mono",monospace;border:1px solid #aaa;padding:2px 4px}.project-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:70px 18px}.project-card{position:relative}.project-card:nth-child(even){margin-top:110px}.project-hit{position:absolute;inset:0;border:0;background:transparent;z-index:3;cursor:none}.project-media{aspect-ratio:1.36/1;overflow:hidden;background:#d4d4cf}.project-media img{width:100%;height:100%;display:block;object-fit:cover;transition:transform .9s cubic-bezier(.2,.7,.2,1);filter:grayscale(.15)}.project-card:hover .project-media img{transform:scale(1.035)}.project-info{padding-top:10px;display:grid;grid-template-columns:45px 1fr auto auto;align-items:start;gap:16px;border-top:1px solid #0a0a0a;margin-top:9px;font:9px "DM Mono",monospace}.project-info h3{margin:0;font:600 18px Manrope;letter-spacing:-.04em}.project-grid.list-view{display:block}.project-grid.list-view .project-card{margin:0;border-top:1px solid #111;padding:12px 0}.project-grid.list-view .project-media{position:absolute;right:8vw;top:50%;width:280px;aspect-ratio:1.4;transform:translateY(-50%);opacity:0;pointer-events:none;z-index:5}.project-grid.list-view .project-card:hover .project-media{opacity:1}.project-grid.list-view .project-info{border:0;margin:0;padding:0;grid-template-columns:50px 1.2fr 1fr 60px;align-items:center;min-height:62px}.project-grid.list-view .project-info h3{font-size:clamp(24px,4vw,56px)}.reveal{opacity:0;transform:translateY(50px);transition:opacity .9s ease,transform .9s cubic-bezier(.2,.7,.2,1)}.reveal.visible{opacity:1;transform:none}
.ticker{background:#0a0a0a;color:#ecece7;overflow:hidden;padding:22px 0;border-top:1px solid #292929;border-bottom:1px solid #292929}.ticker-track{display:flex;width:max-content;animation:ticker 28s linear infinite}.ticker span{font-size:clamp(34px,5vw,78px);font-weight:600;letter-spacing:-.055em;white-space:nowrap;padding-right:2vw}@keyframes ticker{to{transform:translateX(-50%)}}
.studio{padding:28px 26px 130px;background:#0a0a0a}.studio-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:7vw;margin-top:110px}.studio-body{padding-top:10px}.studio-body p{max-width:520px;color:#a6a6a0;line-height:1.6;font-size:14px}.studio-body .lead{color:#f0f0ec;font-size:clamp(20px,2.3vw,35px);line-height:1.25;letter-spacing:-.03em}.services{margin-top:90px}.services div{display:grid;grid-template-columns:50px 1fr;padding:15px 0;border-top:1px solid var(--line)}.services span{font:9px "DM Mono",monospace;color:#797974}.services strong{font-size:13px;font-weight:500}
.manifesto{padding:9vw 0;background:#e9e9e4;color:#0a0a0a;overflow:hidden}.manifesto-line{display:flex;gap:3vw;white-space:nowrap;font-size:clamp(58px,10vw,158px);font-weight:600;line-height:.86;letter-spacing:-.07em;transform:translateX(-3vw)}.manifesto-line.shift{transform:translateX(-18vw)}.outline-word{color:transparent;-webkit-text-stroke:1.2px #111}
.contact{min-height:82svh;padding:28px 26px 18px;background:#111;color:#eee;display:flex;flex-direction:column}.contact-main{flex:1;display:flex;flex-direction:column;justify-content:center;align-items:flex-start}.contact-main p{font-size:clamp(64px,11vw,170px);line-height:.8;letter-spacing:-.075em;font-weight:600;margin:60px 0}.contact-mail{font:11px "DM Mono",monospace;border-bottom:1px solid #ddd;padding-bottom:8px}.contact-mail span{margin-left:12px}.contact-footer{border-top:1px solid var(--line);padding-top:11px;display:grid;grid-template-columns:1fr 1fr 1fr auto;font:9px "DM Mono",monospace;color:#969691}
.project-modal{position:fixed;inset:0;background:#e9e9e4;color:#0a0a0a;z-index:9500;transform:translateY(102%);transition:transform .8s cubic-bezier(.76,0,.24,1);display:grid;grid-template-columns:1.35fr .65fr;padding:76px 26px 26px;gap:24px}.project-modal.open{transform:none}.modal-close{position:absolute;right:26px;top:24px;background:none;border:0;font:10px "DM Mono",monospace;cursor:pointer}.modal-media{overflow:hidden}.modal-media img{width:100%;height:100%;object-fit:cover}.modal-meta{display:flex;flex-direction:column;justify-content:flex-end;padding:0 2vw 2vw}.modal-meta span,.modal-meta p{font:10px "DM Mono",monospace}.modal-meta h2{font-size:clamp(48px,7vw,110px);line-height:.83;letter-spacing:-.07em;margin:18px 0}.modal-meta .modal-copy{margin-top:50px;line-height:1.6;max-width:380px;color:#555}
@media(max-width:900px){.cursor{display:none}.nav{grid-template-columns:1fr auto}.nav-links{display:none}.availability{font-size:8px}.hero{padding-left:18px;padding-right:18px}.hero-kicker span:nth-child(2){display:none}.hero-title{left:16px;font-size:23vw}.hero-side{display:none}.hero-bottom{left:18px;right:18px}.orbit-section{height:100svh;padding:20px 18px}.orbit-copy{left:18px;top:13vh}.orbit-copy h2{font-size:15vw}.orbital-stage{width:105vw;right:-35vw;top:62%}.works,.studio,.contact{padding-left:18px;padding-right:18px}.works-intro,.studio-grid{grid-template-columns:1fr;margin-top:70px}.works-intro p{margin-top:30px}.project-grid{grid-template-columns:1fr;gap:55px}.project-card:nth-child(even){margin-top:0}.project-info{grid-template-columns:32px 1fr;gap:8px}.project-info>span:nth-last-child(-n+2){display:none}.project-grid.list-view .project-info{grid-template-columns:34px 1fr}.project-grid.list-view .project-info>span:nth-last-child(-n+2){display:none}.project-grid.list-view .project-media{display:none}.studio-grid{gap:60px}.services{margin-top:60px}.contact-footer{grid-template-columns:1fr 1fr;gap:8px}.contact-footer span:nth-child(3){display:none}.project-modal{grid-template-columns:1fr;padding:64px 18px 18px}.modal-media{height:53vh}.modal-meta{justify-content:start}.modal-meta .modal-copy{display:none}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important}}

/* === V2: HOME = ORBIT ONLY === */
.home-orbit{
  position:relative;
  height:100svh;
  min-height:680px;
  overflow:hidden;
  background:
    radial-gradient(circle at 50% 50%,rgba(255,255,255,.035),transparent 31%),
    #090909;
}
.home-stage{
  position:absolute;
  left:50%;
  right:auto;
  top:50%;
  width:min(72vw,980px);
  transform:translate(-50%,-50%);
}
.home-hint{
  position:absolute;
  left:50%;
  bottom:26px;
  transform:translateX(-50%);
  font:9px "DM Mono",monospace;
  color:#74746f;
  letter-spacing:.04em;
  white-space:nowrap;
}
.about{
  padding:28px 26px 130px;
  background:#0a0a0a;
}
.about .studio-grid{margin-top:110px}
.about .section-label{color:#a8a8a2}
.project-card{scroll-margin-top:92px}
.project-card.orbit-target{
  animation:orbitTarget 1.25s ease;
}
@keyframes orbitTarget{
  0%,100%{filter:none}
  30%{filter:brightness(1.24)}
}
@media(max-width:900px){
  .nav-links{display:flex;gap:13px;font-size:8px}
  .availability{display:none}
  .nav{grid-template-columns:1fr auto;padding-left:18px;padding-right:18px}
  .home-stage{width:124vw}
  .home-hint{bottom:18px}
  .about{padding-left:18px;padding-right:18px}
}
@media(max-width:560px){
  .brand{font-size:14px}
  .nav-links{gap:9px;font-size:7px}
  .home-stage{width:145vw}
  .orbit-center{width:92px;height:92px}
  .orbit-center strong{font-size:21px}
}


/* =========================================================
   STUDIOQUIX V3 — MOTION SYSTEM
   Refined motion: quieter, smoother, more architectural.
   ========================================================= */

/* Preloader */
.preloader{
  overflow:hidden;
  transition:transform 1.05s cubic-bezier(.76,0,.24,1);
}
.preloader::after{
  content:"";
  position:absolute;
  left:26px;right:26px;bottom:54px;
  height:1px;
  background:rgba(255,255,255,.18);
  transform-origin:left center;
  transform:scaleX(var(--loader-progress,0));
  transition:transform .08s linear;
}
.preloader-mark{
  display:flex;
  align-items:flex-start;
  gap:.015em;
  font-size:clamp(76px,15vw,230px);
  letter-spacing:-.095em;
  line-height:.72;
}
.preloader-mark span{
  display:inline-block;
  transform:translateY(125%) rotate(3deg);
  opacity:0;
}
.preloader-mark span:first-child{
  animation:qxPreloadIn .8s cubic-bezier(.76,0,.24,1) .08s forwards;
}
.preloader-mark span:nth-child(2){
  color:transparent;
  -webkit-text-stroke:1.2px #f0f0ec;
  animation:qxPreloadIn .8s cubic-bezier(.76,0,.24,1) .15s forwards;
}
.preloader-mark sup{
  margin-left:.25em;
  font:8px "DM Mono",monospace;
  letter-spacing:0;
  opacity:.65;
}
@keyframes qxPreloadIn{
  to{transform:translateY(0) rotate(0);opacity:1}
}
.preloader.hide .preloader-mark{
  transform:translateY(-15%);
  opacity:.15;
  transition:transform .8s cubic-bezier(.76,0,.24,1),opacity .5s ease;
}

/* Navigation: subtle active state */
.nav-links a{
  position:relative;
  opacity:.58;
  transition:opacity .28s ease;
}
.nav-links a::after{
  content:"";
  position:absolute;
  left:0;right:0;bottom:-6px;height:1px;
  background:currentColor;
  transform:scaleX(0);
  transform-origin:left;
  transition:transform .35s cubic-bezier(.2,.7,.2,1);
}
.nav-links a:hover,
.nav-links a.is-active{opacity:1}
.nav-links a.is-active::after{transform:scaleX(1)}

/* QX orbital home */
.home-orbit::before{
  content:"";
  position:absolute;
  width:min(62vw,820px);
  aspect-ratio:1;
  left:50%;top:50%;
  transform:translate(-50%,-50%);
  border-radius:50%;
  background:radial-gradient(circle,rgba(255,255,255,.045),rgba(255,255,255,0) 68%);
  pointer-events:none;
}
.home-stage{
  opacity:0;
  transform:translate(-50%,-50%) scale(.93);
  filter:blur(10px);
  transition:
    opacity 1s ease .15s,
    transform 1.3s cubic-bezier(.16,1,.3,1) .1s,
    filter 1.1s ease .1s;
}
body.loaded .home-stage{
  opacity:1;
  transform:translate(-50%,-50%) scale(1);
  filter:blur(0);
}
.orbit-ring{
  transition:border-color .5s ease,opacity .5s ease;
}
.ring-1{animation:ringFloatA 18s linear infinite}
.ring-2{animation:ringFloatB 24s linear infinite}
@keyframes ringFloatA{
  to{transform:rotate(360deg)}
}
@keyframes ringFloatB{
  from{transform:rotateX(68deg) rotateZ(0)}
  to{transform:rotateX(68deg) rotateZ(-360deg)}
}
.orbit-center{
  width:112px;height:112px;
  transition:transform .45s cubic-bezier(.2,.7,.2,1),box-shadow .45s ease;
}
.orbit-center strong{
  font-size:34px;
  letter-spacing:-.095em;
  transform:translateX(-.04em);
}
.home-stage:hover .orbit-center{
  transform:translate(-50%,-50%) scale(.96);
  box-shadow:0 0 90px rgba(255,255,255,.16);
}
.orbit-item{
  box-shadow:0 16px 45px rgba(0,0,0,.3);
  transition:
    filter .35s ease,
    box-shadow .35s ease,
    border-color .35s ease;
}
.orbit-item:hover{
  filter:brightness(1.12);
  border-color:rgba(255,255,255,.52);
  box-shadow:0 25px 70px rgba(0,0,0,.46);
}
.orbit-item img{
  transition:transform .65s cubic-bezier(.2,.7,.2,1),filter .45s ease;
}
.orbit-item:hover img{
  transform:scale(1.045);
}
.orbit-item span{
  transform:translateY(6px);
  opacity:.72;
  transition:transform .35s ease,opacity .35s ease;
}
.orbit-item:hover span{
  transform:translateY(0);
  opacity:1;
}
.home-hint{
  opacity:0;
  transform:translate(-50%,12px);
  transition:opacity .7s ease 1.05s,transform .7s ease 1.05s;
}
body.loaded .home-hint{
  opacity:1;
  transform:translate(-50%,0);
}

/* Better custom cursor */
.cursor{
  width:64px;height:64px;
  transition:
    transform .25s cubic-bezier(.2,.7,.2,1),
    opacity .2s ease,
    background .22s ease,
    color .22s ease,
    width .25s ease,
    height .25s ease;
}
.cursor.active{
  width:72px;height:72px;
}
.cursor.modal-mode span{font-size:0}
.cursor.modal-mode span::after{
  content:"OPEN";
  font-size:9px;
}

/* Section entrance */
.reveal-section .section-label{
  opacity:0;
  transform:translateY(12px);
  transition:opacity .65s ease,transform .65s ease;
}
.reveal-section.is-inview .section-label{
  opacity:1;
  transform:none;
}
.reveal{
  opacity:0;
  transform:translateY(38px);
  filter:blur(5px);
  transition:
    opacity .85s ease,
    transform 1s cubic-bezier(.16,1,.3,1),
    filter .8s ease;
}
.reveal.visible{
  opacity:1;
  transform:none;
  filter:blur(0);
}
.services div{
  opacity:0;
  transform:translateX(20px);
  transition:opacity .6s ease,transform .7s cubic-bezier(.16,1,.3,1);
}
.about.is-inview .services div{opacity:1;transform:none}
.about.is-inview .services div:nth-child(1){transition-delay:.15s}
.about.is-inview .services div:nth-child(2){transition-delay:.22s}
.about.is-inview .services div:nth-child(3){transition-delay:.29s}
.about.is-inview .services div:nth-child(4){transition-delay:.36s}

/* Works: more refined hover, less generic zoom */
.project-card{
  transition:transform .55s cubic-bezier(.16,1,.3,1),filter .35s ease;
}
.project-media{
  position:relative;
}
.project-media::after{
  content:"";
  position:absolute;inset:0;
  background:linear-gradient(135deg,rgba(255,255,255,.08),transparent 35%);
  opacity:0;
  transition:opacity .45s ease;
  pointer-events:none;
}
.project-card:hover .project-media::after{opacity:1}
.project-media img{
  transform:scale(1.01);
  will-change:transform;
}
.project-card:hover .project-media img{
  transform:scale(1.045);
}
.project-info{
  transition:padding-left .45s cubic-bezier(.16,1,.3,1);
}
.project-card:hover .project-info{
  padding-left:8px;
}
.project-card.orbit-target{
  animation:orbitTargetV3 1.55s cubic-bezier(.16,1,.3,1);
}
@keyframes orbitTargetV3{
  0%{transform:translateY(14px);filter:brightness(1)}
  25%{transform:translateY(0);filter:brightness(1.12)}
  100%{filter:brightness(1)}
}

/* Grid/list switch transition */
.project-grid{
  transition:opacity .22s ease,transform .22s ease;
}
.project-grid.is-switching{
  opacity:.35;
  transform:translateY(8px);
}

/* Contact hierarchy requested by user */
.contact{
  min-height:78svh;
}
.contact-main{
  flex:1;
  justify-content:center;
  gap:52px;
}
.contact-mail{
  display:inline-block;
  border:0;
  padding:0;
  font-family:Manrope,Arial,sans-serif;
  font-size:clamp(48px,9.2vw,142px);
  line-height:.82;
  letter-spacing:-.075em;
  font-weight:600;
  max-width:100%;
  overflow-wrap:anywhere;
  opacity:0;
  transform:translateY(42px);
  clip-path:inset(0 0 100% 0);
  transition:
    opacity .85s ease,
    transform 1.05s cubic-bezier(.16,1,.3,1),
    clip-path 1s cubic-bezier(.16,1,.3,1);
}
.contact.is-inview .contact-mail{
  opacity:1;
  transform:none;
  clip-path:inset(0 0 0 0);
}
.contact-mail span{
  display:inline-block;
  margin-left:.14em;
  font-size:.22em;
  vertical-align:top;
  transform:translateY(.35em);
  transition:transform .35s ease;
}
.contact-mail:hover span{transform:translate(.18em,.12em)}
.contact-details{
  display:grid;
  grid-template-columns:1.35fr .65fr 1fr;
  gap:26px;
  padding-top:14px;
  border-top:1px solid var(--line);
  font:9px "DM Mono",monospace;
  color:#969691;
  opacity:0;
  transform:translateY(16px);
  transition:opacity .7s ease .28s,transform .8s cubic-bezier(.16,1,.3,1) .28s;
}
.contact.is-inview .contact-details{
  opacity:1;
  transform:none;
}
.contact-details p,.contact-details a{margin:0}
.contact-details a{color:#d8d6d0}
.contact-footer{
  margin-top:40px;
}

/* Modal: more cinematic */
.project-modal{
  opacity:0;
  transform:translateY(8%);
  clip-path:inset(100% 0 0 0);
  transition:
    transform .8s cubic-bezier(.76,0,.24,1),
    clip-path .85s cubic-bezier(.76,0,.24,1),
    opacity .4s ease;
}
.project-modal.open{
  opacity:1;
  transform:none;
  clip-path:inset(0 0 0 0);
}
.project-modal .modal-media img{
  transform:scale(1.08);
  transition:transform 1.2s cubic-bezier(.16,1,.3,1) .18s;
}
.project-modal.open .modal-media img{
  transform:scale(1);
}
.modal-meta{
  opacity:0;
  transform:translateY(24px);
  transition:opacity .7s ease .35s,transform .8s cubic-bezier(.16,1,.3,1) .35s;
}
.project-modal.open .modal-meta{
  opacity:1;
  transform:none;
}

/* Remove old ticker motion completely even if old markup returns later */
.ticker{display:none!important}

/* Mobile */
@media(max-width:900px){
  .ring-1,.ring-2{animation-duration:30s}
  .orbit-center{width:96px;height:96px}
  .orbit-center strong{font-size:27px}
  .contact-main{gap:36px}
  .contact-details{grid-template-columns:1fr;gap:10px}
  .contact-mail{font-size:clamp(38px,12vw,78px)}
}
@media(max-width:560px){
  .orbit-center{width:84px;height:84px}
  .orbit-center strong{font-size:24px}
}
@media(prefers-reduced-motion:reduce){
  .ring-1,.ring-2{animation:none!important}
}


/* =========================================================
   STUDIOQUIX V4 — DIRECT DRAG + SHARP QX + SPLIT ABOUT
   ========================================================= */

/* Sharp QX opening animation */
.preloader-logo-wrap{
  position:absolute;
  left:50%;top:48%;
  width:min(720px,78vw);
  transform:translate(-50%,-50%);
  display:flex;
  flex-direction:column;
  align-items:center;
}
.qx-loader-logo{
  width:100%;
  max-height:47vh;
  overflow:visible;
}
.qx-guides > *{
  fill:none;
  stroke:rgba(240,240,236,.22);
  stroke-width:.8;
  stroke-dasharray:720;
  stroke-dashoffset:720;
  animation:guideDraw 1.15s cubic-bezier(.16,1,.3,1) .05s forwards;
}
.qx-guides circle{animation-delay:.12s}
@keyframes guideDraw{to{stroke-dashoffset:0}}

.logo-fill{
  fill:#f0f0eb;
  opacity:0;
  transform-box:fill-box;
  transform-origin:center;
  transform:scale(.96);
  animation:markReveal .62s cubic-bezier(.16,1,.3,1) forwards;
}
.q-fill{animation-delay:.34s}
.q-tail{animation-delay:.43s}
.x-main{animation-delay:.52s}
.x-cross{animation-delay:.60s}
@keyframes markReveal{
  0%{opacity:0;transform:scale(.96);clip-path:inset(0 100% 0 0)}
  100%{opacity:1;transform:scale(1);clip-path:inset(0 0 0 0)}
}
.qx-trace path{
  fill:none;
  stroke:#f0f0eb;
  stroke-width:1.2;
  stroke-dasharray:800;
  stroke-dashoffset:800;
  opacity:.55;
  animation:traceDraw .95s cubic-bezier(.16,1,.3,1) .16s forwards;
}
@keyframes traceDraw{
  70%{opacity:.7}
  100%{stroke-dashoffset:0;opacity:0}
}
.preloader-wordmark{
  margin-top:18px;
  font-size:clamp(18px,2.1vw,30px);
  font-weight:600;
  letter-spacing:.42em;
  padding-left:.42em;
  opacity:0;
  transform:translateY(12px);
  animation:wordmarkIn .65s ease .74s forwards;
}
.preloader-wordmark sup{
  font:7px "DM Mono",monospace;
  vertical-align:top;
  margin-left:3px;
  letter-spacing:0;
}
@keyframes wordmarkIn{to{opacity:1;transform:none}}
.preloader.hide .preloader-logo-wrap{
  opacity:0;
  transform:translate(-50%,-52%) scale(.975);
  transition:opacity .45s ease,transform .75s cubic-bezier(.76,0,.24,1);
}

/* Direct horizontal drag */
.home-stage{
  cursor:grab;
  touch-action:none;
  user-select:none;
}
.home-stage.is-dragging{cursor:grabbing}
.home-stage.is-dragging .orbit-item{cursor:grabbing}
.home-hint{
  letter-spacing:.08em;
}

/* Split About: StudioQuix + Mehmet */
.about-dual{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:1px;
  margin-top:78px;
  background:var(--line);
  border-top:1px solid var(--line);
  border-bottom:1px solid var(--line);
}
.about-panel{
  background:#0a0a0a;
  padding:42px 4vw 54px 0;
  min-height:690px;
}
.about-panel + .about-panel{
  padding-left:4vw;
  padding-right:0;
}
.about-eyebrow,
.recognition-title{
  display:block;
  margin-bottom:42px;
  font:9px "DM Mono",monospace;
  color:#777771;
}
.studio-about h2{
  margin:0 0 40px;
  font-size:clamp(42px,5.5vw,84px);
  line-height:.88;
  letter-spacing:-.065em;
}
.studio-about h2 em{
  font-style:normal;
  color:transparent;
  -webkit-text-stroke:1px #f0f0ec;
}
.about-lead{
  max-width:550px;
  font-size:clamp(19px,2vw,29px)!important;
  line-height:1.25!important;
  letter-spacing:-.025em;
  color:#f0f0ec!important;
}
.about-panel p{
  max-width:530px;
  color:#9e9e98;
  font-size:14px;
  line-height:1.65;
}
.founder-about h3{
  margin:0 0 40px;
  font-size:clamp(36px,4.8vw,72px);
  line-height:.9;
  letter-spacing:-.06em;
  font-weight:600;
}
.compact-services{
  margin-top:58px;
}
.compact-services div{
  grid-template-columns:42px 1fr;
  padding:12px 0;
}
.recognition{
  margin-top:58px;
}
.recognition-title{
  margin-bottom:10px;
}
.recognition-row{
  display:grid;
  grid-template-columns:42px 1fr auto;
  gap:12px;
  align-items:center;
  padding:13px 0;
  border-top:1px solid var(--line);
}
.recognition-row span,
.recognition-row em{
  font:9px "DM Mono",monospace;
  color:#797974;
  font-style:normal;
}
.recognition-row strong{
  font-size:12px;
  font-weight:500;
}
.social-links{
  display:flex;
  gap:18px;
  margin-top:50px;
}
.social-links a{
  padding-bottom:6px;
  border-bottom:1px solid rgba(255,255,255,.28);
  font:10px "DM Mono",monospace;
  transition:border-color .25s ease,opacity .25s ease;
}
.social-links a:hover{
  border-color:#fff;
  opacity:.72;
}
.contact-footer a{color:inherit}

/* Contact updated email length */
.contact-mail{
  font-size:clamp(43px,8.25vw,126px);
}

@media(max-width:900px){
  .preloader-logo-wrap{width:90vw}
  .about-dual{grid-template-columns:1fr;background:transparent;border-bottom:0}
  .about-panel{
    padding:36px 0 54px!important;
    min-height:auto;
    border-bottom:1px solid var(--line);
  }
  .founder-about{padding-top:58px!important}
  .recognition-row{grid-template-columns:34px 1fr}
  .recognition-row em{grid-column:2}
  .preloader-wordmark{letter-spacing:.28em;padding-left:.28em}
}


/* V5 — clearer click / drag states */
.home-stage.is-pointer-down{cursor:grab}
.home-stage.is-dragging{cursor:grabbing}
.orbit-item{cursor:pointer}
.home-stage.is-dragging .orbit-item{cursor:grabbing}


/* =========================================================
   STUDIOQUIX V6 — PROVIDED LOGO PRELOADER + 2-AXIS ORBIT
   ========================================================= */

/* Replace drawn SVG opener with the provided logo artwork */
.preloader-logo-wrap{
  width:min(900px,82vw);
  gap:18px;
}
.preloader-logo-image{
  display:block;
  width:100%;
  max-width:860px;
  max-height:52vh;
  object-fit:contain;
  filter:brightness(1.04) contrast(1.02);
  opacity:0;
  transform:translateY(34px) scale(.96);
  clip-path:inset(0 0 100% 0);
  animation:providedLogoReveal 1.15s cubic-bezier(.16,1,.3,1) .08s forwards;
}
@keyframes providedLogoReveal{
  0%{opacity:0;transform:translateY(34px) scale(.96);clip-path:inset(0 0 100% 0)}
  55%{opacity:1}
  100%{opacity:1;transform:translateY(0) scale(1);clip-path:inset(0 0 0 0)}
}
.preloader-wordmark{
  margin-top:10px;
  animation-delay:.62s;
}
.preloader.hide .preloader-logo-image{
  opacity:0;
  transform:translateY(-16px) scale(.985);
  transition:opacity .42s ease,transform .75s cubic-bezier(.76,0,.24,1);
}

/* Orbit now floats vertically and responds in two axes */
.home-stage{
  --orbitFloat:0px;
  transform:translate(-50%,calc(-50% + var(--orbitFloat))) scale(.93);
  transition:
    opacity 1s ease .15s,
    transform 1.3s cubic-bezier(.16,1,.3,1) .1s,
    filter 1.1s ease .1s;
}
body.loaded .home-stage{
  transform:translate(-50%,calc(-50% + var(--orbitFloat))) scale(1);
}
.home-hint{
  letter-spacing:.08em;
}
.orbit-center{
  transform:translate(-50%,-50%);
}
.orbit-item{
  will-change:transform,opacity,filter;
}
.orbit-ring{
  will-change:transform;
}
.ring-1{animation-duration:22s}
.ring-2{animation-duration:30s}

@media(max-width:900px){
  .preloader-logo-wrap{width:92vw}
  .preloader-logo-image{max-height:44vh}
}


/* =========================================================
   STUDIOQUIX V7 — MONOGRAM-ONLY PRELOADER + FIXED ORBIT ORIENTATION
   ========================================================= */

/* Override V6 opener: only the center QX monogram animates */
.preloader-logo-wrap{
  width:min(430px,44vw);
  position:absolute;
  left:50%;
  top:48%;
  transform:translate(-50%,-50%);
  display:flex;
  align-items:center;
  justify-content:center;
}
.preloader-logo-image{display:none!important}
.preloader-wordmark{display:none!important}

.qx-loader-mark{
  width:100%;
  max-height:42vh;
  overflow:visible;
}
.qx-outline path{
  fill:none;
  stroke:rgba(240,240,236,.42);
  stroke-width:1.15;
  stroke-dasharray:700;
  stroke-dashoffset:700;
  opacity:.55;
  animation:qxOutlineDraw .85s cubic-bezier(.16,1,.3,1) .06s forwards;
}
@keyframes qxOutlineDraw{
  0%{stroke-dashoffset:700;opacity:.55}
  70%{opacity:.72}
  100%{stroke-dashoffset:0;opacity:0}
}
.mark-fill{
  fill:#f0f0eb;
  opacity:0;
  transform-box:fill-box;
  transform-origin:center;
  transform:translateY(12px) scale(.96);
  animation:qxFillReveal .65s cubic-bezier(.16,1,.3,1) forwards;
}
.q-fill{animation-delay:.16s}
.q-tail{animation-delay:.25s}
.x-main{animation-delay:.34s}
.x-cross{animation-delay:.42s}
@keyframes qxFillReveal{
  0%{opacity:0;transform:translateY(12px) scale(.96);clip-path:inset(0 100% 0 0)}
  100%{opacity:1;transform:translateY(0) scale(1);clip-path:inset(0 0 0 0)}
}
.preloader.hide .preloader-logo-wrap{
  opacity:0;
  transform:translate(-50%,-51%) scale(.985);
  transition:opacity .42s ease,transform .72s cubic-bezier(.76,0,.24,1);
}

/* Orbit should keep the exact rotated state */
.home-stage{
  --orbitFloat:0px;
}
body.loaded .home-stage{
  transform:translate(-50%,-50%) scale(1);
}
.home-hint{
  letter-spacing:.08em;
}
.orbit-item{
  will-change:transform,opacity,filter;
}
.ring-1{animation-duration:22s}
.ring-2{animation-duration:30s}

/* Kill V6 floating translation behavior visually */
body.loaded .home-stage,
.home-stage{
  transform:translate(-50%,-50%) scale(.93);
}
body.loaded .home-stage{
  transform:translate(-50%,-50%) scale(1);
}

@media(max-width:900px){
  .preloader-logo-wrap{width:min(300px,62vw)}
}


/* =========================================================
   STUDIOQUIX V8 — EXACT QX OPENER + PERSISTENT ORBIT
   ========================================================= */

/* Opening: ONLY the exact QX monogram from the selected logo */
.preloader{
  padding:0;
  display:grid;
  place-items:center;
}
.preloader::after{display:none!important}
.preloader-logo-wrap{
  position:relative;
  left:auto;top:auto;
  width:min(590px,55vw);
  transform:none;
  display:block;
}
.qx-exact-mark{
  display:block;
  width:100%;
  height:auto;
  opacity:0;
  transform:scale(.91);
  filter:blur(9px);
  clip-path:inset(49% 48% 49% 48%);
  animation:qxExactOpen 1.02s cubic-bezier(.16,1,.3,1) .08s forwards;
}
@keyframes qxExactOpen{
  0%{opacity:0;transform:scale(.91);filter:blur(9px);clip-path:inset(49% 48% 49% 48%)}
  42%{opacity:1;filter:blur(2px)}
  100%{opacity:1;transform:scale(1);filter:blur(0);clip-path:inset(0 0 0 0)}
}
.preloader.hide .preloader-logo-wrap{
  opacity:0;
  transform:scale(.985);
  transition:opacity .35s ease,transform .65s cubic-bezier(.76,0,.24,1);
}

/* Use the same exact QX mark in the orbital center */
.orbit-center{
  overflow:hidden;
  padding:22px;
}
.orbit-center img{
  display:block;
  width:100%;
  height:100%;
  object-fit:contain;
  filter:invert(1);
  opacity:.95;
  animation:centerMarkBreath 4.8s ease-in-out infinite;
}
@keyframes centerMarkBreath{
  0%,100%{transform:scale(.96);opacity:.88}
  50%{transform:scale(1);opacity:1}
}

/* Ring animation is visual only; it does not change project orientation */
.ring-1,.ring-2{
  animation:none!important;
}
.ring-1{animation:ringPulseV8 5.5s ease-in-out infinite!important}
.ring-2{animation:ringPulseV8B 7.5s ease-in-out infinite!important}
@keyframes ringPulseV8{
  0%,100%{opacity:.42;border-color:rgba(255,255,255,.10)}
  50%{opacity:.8;border-color:rgba(255,255,255,.18)}
}
@keyframes ringPulseV8B{
  0%,100%{opacity:.28;border-color:rgba(255,255,255,.08)}
  50%{opacity:.62;border-color:rgba(255,255,255,.15)}
}

/* The stage itself never auto-translates or recenters. */
.home-stage,
body.loaded .home-stage{
  --orbitFloat:0px;
}

@media(max-width:900px){
  .preloader-logo-wrap{width:min(420px,72vw)}
  .orbit-center{padding:18px}
}


/* =========================================================
   STUDIOQUIX V10 — ABOUT WITH FOUNDER PHOTO + MINI CV
   ========================================================= */

.about-dual{
  align-items:stretch;
}
.founder-about{
  display:flex;
  flex-direction:column;
  gap:36px;
}
.founder-top{
  display:grid;
  grid-template-columns:minmax(240px,320px) 1fr;
  gap:28px;
  align-items:start;
}
.founder-photo-wrap{
  position:relative;
  aspect-ratio:4/5;
  overflow:hidden;
  background:#111;
  border:1px solid var(--line);
}
.founder-photo{
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center center;
  filter:grayscale(.06) contrast(1.02);
}
.founder-intro .about-eyebrow{
  margin-bottom:26px;
}
.founder-intro h3{
  margin:0 0 24px;
}
.founder-intro p{
  max-width:520px;
}
.cv-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:0 26px;
  margin-top:8px;
}
.cv-block{
  padding-top:18px;
  border-top:1px solid var(--line);
}
.cv-title{
  display:block;
  margin-bottom:14px;
  font:9px "DM Mono",monospace;
  color:#777771;
}
.cv-row{
  display:grid;
  grid-template-columns:110px 1fr;
  gap:12px;
  padding:10px 0;
  border-top:1px solid rgba(255,255,255,.08);
}
.cv-row:first-of-type{
  border-top:0;
  padding-top:0;
}
.cv-row span{
  font:9px "DM Mono",monospace;
  color:#797974;
}
.cv-row strong{
  font-size:12px;
  line-height:1.55;
  font-weight:500;
}
.cv-links{
  display:flex;
  flex-wrap:wrap;
  gap:18px;
  padding-top:2px;
}
.cv-links a{
  padding-bottom:6px;
  border-bottom:1px solid rgba(255,255,255,.28);
  font:10px "DM Mono",monospace;
  transition:border-color .25s ease,opacity .25s ease;
}
.cv-links a:hover{
  border-color:#fff;
  opacity:.72;
}

/* Replace old recognition/social spacing if any */
.founder-about .recognition,
.founder-about .social-links{
  display:none;
}

@media(max-width:1180px){
  .founder-top{
    grid-template-columns:260px 1fr;
  }
}
@media(max-width:900px){
  .founder-top{
    grid-template-columns:1fr;
    gap:22px;
  }
  .founder-photo-wrap{
    max-width:420px;
  }
  .cv-grid{
    grid-template-columns:1fr;
    gap:18px;
  }
  .cv-row{
    grid-template-columns:100px 1fr;
  }
}


/* V11 — temporary portfolio import */
.project-info h3{
  max-width:26ch;
}
.project-grid .project-media img{
  object-position:center;
}
@media(max-width:900px){
  .project-info h3{max-width:none}
}


/* V12 — two-project preview */
.project-grid{
  grid-template-columns:repeat(2,minmax(0,1fr));
}
.project-grid .project-card:nth-child(even){
  margin-top:9vw;
}
@media(max-width:900px){
  .project-grid{grid-template-columns:1fr}
  .project-grid .project-card:nth-child(even){margin-top:0}
}


/* V14 — Arkitera link rows in the founder CV */
.cv-row-link{
  color:inherit;
  text-decoration:none;
  transition:padding .3s ease,background .3s ease;
}
.cv-row-link:hover{
  padding-left:8px;
  background:rgba(255,255,255,.035);
}

/* =========================================================
   V14 — boxed primary navigation + larger GRID / LIST toggle
   ========================================================= */
.nav-links{
  gap:34px;
  font-size:12px;
  letter-spacing:.06em;
  padding:13px 30px;
  border:1px solid rgba(255,255,255,.62);
  border-radius:2px;
}
.nav-links a{padding:2px 0}

.view-switch{
  gap:0;
  align-items:stretch;
  border:1px solid rgba(10,10,10,.75);
  border-radius:2px;
  overflow:hidden;
}
.view-switch > span{display:none}
.view-btn{
  font-size:12px;
  letter-spacing:.06em;
  padding:11px 22px;
  opacity:1;
  color:#0a0a0a;
  text-decoration:none;
  transition:background .25s ease,color .25s ease;
}
.view-btn + .view-btn{border-left:1px solid rgba(10,10,10,.75)}
.view-btn:not(.active):hover{background:rgba(10,10,10,.07)}
.view-btn.active{
  background:#0a0a0a;
  color:#efefe9;
  text-decoration:none;
}

@media(max-width:900px){
  .nav-links{gap:14px;font-size:9px;padding:9px 14px}
  .view-btn{font-size:10px;padding:9px 14px}
}
@media(max-width:600px){
  .nav-links{gap:10px;font-size:8px;padding:8px 10px}
}
.works{padding-top:104px}
.works .section-label{align-items:center}
@media(max-width:900px){.works{padding-top:90px}}

/* =========================================================
   V14 — PHONE FIXES (≤ 600px)
   ========================================================= */
@media(max-width:600px){
  html,body{overflow-x:hidden}
  .nav{grid-template-columns:auto 1fr;gap:10px;padding:16px 14px}
  .availability{display:none}
  .brand{font-size:14px}
  .nav-links{display:flex;justify-self:end;gap:9px;font-size:8px;letter-spacing:.02em;padding:8px 10px}
  .nav-links a::after{bottom:-4px}
  .contact-main p{font-size:clamp(26px,8.4vw,60px);line-height:.92;margin:28px 0;overflow-wrap:anywhere}
  .contact-mail{font-size:clamp(24px,8.6vw,60px)!important;overflow-wrap:anywhere}
  .contact-details{grid-template-columns:1fr;gap:6px}
  .works-intro h2,.studio h2{font-size:clamp(44px,14vw,70px)}
  .view-btn{font-size:9px;padding:8px 12px}
  .cv-grid{grid-template-columns:1fr}
}

/* V14 — phones: vertical swipes over the orbit scroll the page; horizontal swipes rotate it */
@media (pointer:coarse), (max-width:900px){
  .orbital-stage,.home-stage,.orbit-item{touch-action:pan-y}
}

/* V14 — electron orbit variant */
.electron-rings{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;z-index:1}
body.orbit-electron .orbit-ring{display:none}
body.orbit-electron .orbit-item span{opacity:0;transition:opacity .35s ease}
body.orbit-electron .orbit-item.is-front span{opacity:1}
body.orbit-electron .orbit-item{width:clamp(96px,11vw,170px);margin-left:calc(clamp(96px,11vw,170px) / -2);margin-top:calc(clamp(96px,11vw,170px) * -.375)}

/* V14 — a rule between every project in Works */
.project-grid .project-card{border-top:1px solid rgba(10,10,10,.85);padding-top:16px}
.project-grid:not(.list-view){row-gap:56px}
.project-grid.list-view .project-card{border-top:1px solid rgba(10,10,10,.85);border-bottom:0}
.project-grid.list-view .project-card:last-child{border-bottom:1px solid rgba(10,10,10,.85)}

/* V14 — larger phone number */
.contact-details a[href^="tel:"]{font-size:clamp(20px,2.4vw,34px);font-family:Manrope,Arial,sans-serif;font-weight:600;letter-spacing:-.02em;color:#efefe9}
/* V14 — contact details: plain labels, big phone on one line */
.contact-main .contact-details p{font:12px "DM Mono",monospace;line-height:1.5;letter-spacing:.04em;margin:0;color:#969691;overflow-wrap:normal}
.contact-details{grid-template-columns:1.2fr auto 1fr;align-items:center}
.contact-details a[href^="tel:"]{white-space:nowrap;font-size:clamp(26px,3vw,44px)}
@media(max-width:900px){.contact-details{grid-template-columns:1fr}.contact-main .contact-details p{font-size:11px}}
.contact-mail{font-size:clamp(30px,7.6vw,138px)!important}

/* About photo cycle */
.photo-cycle{display:block;width:100%;padding:0;cursor:pointer;font:inherit;color:inherit;-webkit-tap-highlight-color:transparent}
.photo-cycle .founder-photo{position:absolute;inset:0;opacity:0;transform:scale(1.03);transition:opacity .8s ease,transform 1.2s ease}
.photo-cycle .founder-photo.is-active{opacity:1;transform:scale(1)}
.photo-cycle .founder-photo:first-child{object-position:center 28%}
.photo-count{position:absolute;left:10px;bottom:10px;z-index:2;font:10px "DM Mono",monospace;letter-spacing:.08em;color:#efefe9;background:rgba(8,8,8,.55);padding:4px 7px;pointer-events:none}
.photo-count b{font-weight:500}
/* Swipe hint */
.swipe-hint{position:absolute;right:var(--pad,28px);bottom:22px;z-index:5;font:10px "DM Mono",monospace;letter-spacing:.12em;color:rgba(239,239,233,.62);text-decoration:none;display:flex;gap:6px;align-items:center;opacity:0;transition:opacity .7s ease 1.3s}
body.loaded .swipe-hint{opacity:1}
.swipe-hint span{display:inline-block;animation:swipeNudge 1.8s ease-in-out infinite}
@keyframes swipeNudge{0%,100%{transform:translateY(0)}50%{transform:translateY(4px)}}
@media(max-width:700px){.swipe-hint{right:16px;bottom:16px;font-size:9px}.home-hint{bottom:44px!important}}

/* About: larger name labels */
.about-eyebrow.about-name{display:block;font:600 clamp(22px,2.2vw,34px)/1.05 Manrope,Arial,sans-serif;letter-spacing:-.02em;color:#efefe9;text-transform:uppercase;margin-bottom:22px}
.about-name sup{font-size:.45em;vertical-align:super;margin-left:2px}
.about-name small{font:11px "DM Mono",monospace;letter-spacing:.08em;color:#969691;margin-left:8px;vertical-align:middle}