/* ── OBJECTIVITY ── */
@font-face {
  font-family: 'Objectivity';
  src: url('fonts/Objectivity-Thin.otf') format('opentype');
  font-weight: 100;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Objectivity';
  src: url('fonts/Objectivity-ThinSlanted.otf') format('opentype');
  font-weight: 100;
  font-style: italic;
  font-display: swap;
}
@font-face {
  font-family: 'Objectivity';
  src: url('fonts/Objectivity-Light.otf') format('opentype');
  font-weight: 300;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Objectivity';
  src: url('fonts/Objectivity-LightSlanted.otf') format('opentype');
  font-weight: 300;
  font-style: italic;
  font-display: swap;
}
@font-face {
  font-family: 'Objectivity';
  src: url('fonts/Objectivity-Regular.otf') format('opentype');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Objectivity';
  src: url('fonts/Objectivity-RegularSlanted.otf') format('opentype');
  font-weight: 400;
  font-style: italic;
  font-display: swap;
}
@font-face {
  font-family: 'Objectivity';
  src: url('fonts/Objectivity-Medium.otf') format('opentype');
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Objectivity';
  src: url('fonts/Objectivity-MediumSlanted.otf') format('opentype');
  font-weight: 500;
  font-style: italic;
  font-display: swap;
}
@font-face {
  font-family: 'Objectivity';
  src: url('fonts/Objectivity-Bold.otf') format('opentype');
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Objectivity';
  src: url('fonts/Objectivity-BoldSlanted.otf') format('opentype');
  font-weight: 700;
  font-style: italic;
  font-display: swap;
}
@font-face {
  font-family: 'Objectivity';
  src: url('fonts/Objectivity-ExtraBold.otf') format('opentype');
  font-weight: 800;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Objectivity';
  src: url('fonts/Objectivity-ExtraBoldSlanted.otf') format('opentype');
  font-weight: 800;
  font-style: italic;
  font-display: swap;
}
@font-face {
  font-family: 'Objectivity';
  src: url('fonts/Objectivity-Black.otf') format('opentype');
  font-weight: 900;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Objectivity';
  src: url('fonts/Objectivity-BlackSlanted.otf') format('opentype');
  font-weight: 900;
  font-style: italic;
  font-display: swap;
}
@font-face {
  font-family: 'Objectivity';
  src: url('fonts/Objectivity-Super.otf') format('opentype');
  font-weight: 950;
  font-style: normal;
  font-display: swap;
}

/* ── FELGINE ── */
@font-face {
  font-family: 'Felgine';
  src: url('fonts/Felgine-Regular.otf') format('opentype');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Felgine';
  src: url('fonts/Felgine-Italic.otf') format('opentype');
  font-weight: 400;
  font-style: italic;
  font-display: swap;
}


/* ===== TOKENS ===== */
/* @font-face {
  font-family: 'NeueHaasDisplay';
  src: url('fonts/NeueHaasDisplayXXThin.ttf') format('truetype');
  font-weight: 100;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'NeueHaasDisplay';
  src: url('fonts/NeueHaasDisplayXXThinItalic.ttf') format('truetype');
  font-weight: 100;
  font-style: italic;
  font-display: swap;
}
@font-face {
  font-family: 'NeueHaasDisplay';
  src: url('fonts/NeueHaasDisplayXThin.ttf') format('truetype');
  font-weight: 200;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'NeueHaasDisplay';
  src: url('fonts/NeueHaasDisplayXThinItalic.ttf') format('truetype');
  font-weight: 200;
  font-style: italic;
  font-display: swap;
}
@font-face {
  font-family: 'NeueHaasDisplay';
  src: url('fonts/NeueHaasDisplayThin.ttf') format('truetype');
  font-weight: 300;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'NeueHaasDisplay';
  src: url('fonts/NeueHaasDisplayThinItalic.ttf') format('truetype');
  font-weight: 300;
  font-style: italic;
  font-display: swap;
}
@font-face {
  font-family: 'NeueHaasDisplay';
  src: url('fonts/NeueHaasDisplayRoman.ttf') format('truetype');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'NeueHaasDisplay';
  src: url('fonts/NeueHaasDisplayRomanItalic.ttf') format('truetype');
  font-weight: 400;
  font-style: italic;
  font-display: swap;
}
@font-face {
  font-family: 'NeueHaasDisplay';
  src: url('fonts/NeueHaasDisplayMediu.ttf') format('truetype');
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'NeueHaasDisplay';
  src: url('fonts/NeueHaasDisplayMediumItalic.ttf') format('truetype');
  font-weight: 500;
  font-style: italic;
  font-display: swap;
}
@font-face {
  font-family: 'NeueHaasDisplay';
  src: url('fonts/NeueHaasDisplayBold.ttf') format('truetype');
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'NeueHaasDisplay';
  src: url('fonts/NeueHaasDisplayBoldItalic.ttf') format('truetype');
  font-weight: 700;
  font-style: italic;
  font-display: swap;
}
@font-face {
  font-family: 'NeueHaasDisplay';
  src: url('fonts/NeueHaasDisplayBlack.ttf') format('truetype');
  font-weight: 900;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'NeueHaasDisplay';
  src: url('fonts/NeueHaasDisplayBlackItalic.ttf') format('truetype');
  font-weight: 900;
  font-style: italic;
  font-display: swap;
}
@font-face {
  font-family: 'Antyna';
  src: url('fonts/Antyna.otf') format('opentype');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
} */
/* @font-face {
  font-family: 'Monument Extended';
  src: url('fonts/MonumentExtended-Ultrabold.otf') format('opentype');
  font-weight: 800;
  font-display: swap;
} */

:root{
  --bg: #010000;
  --bg-panel: #161618;
  --bg-panel-2: #1C1C1F;
  --coral: #f98603 ;
  --coral-dim: #633500;
  --text: #F2F0ED;
  --text-dim: #8A8A8E;
  --line: rgba(242,240,237,0.08);

--display: 'Objectivity', sans-serif;
--body: 'Objectivity', sans-serif;
--serif: 'Felgine', serif;

  /* --display: 'Monument Extended', sans-serif;
  /* --display: 'Archivo', sans-serif; */
   /*--body: 'Inter', sans-serif; */
  --mono: 'JetBrains Mono', monospace;
  /* --serif: 'Playfair Display', serif; */
  --script: 'Felgine', serif;

  --container: 1240px;
  --ease: cubic-bezier(.16,.84,.44,1);
  --ease-soft: cubic-bezier(.22,1,.36,1);
  --script: 'Felgine', serif;
}

*{ margin:0; padding:0; box-sizing:border-box; }

html{ scroll-behavior:smooth; }

body{
  background:var(--bg);
  color:var(--text);
  font-family:var(--body);
  font-weight:400;
  line-height:1.5;
  overflow-x:hidden;
  cursor:none;
}

a{ color:inherit; text-decoration:none; }
img{ max-width:100%; display:block; }
button{ font-family:inherit; cursor:none; }

::selection{ background:var(--coral); color:#0D0D0F; }

.eyebrow{
  font-family:var(--mono);
  font-size:12px;
  letter-spacing:0.12em;
  text-transform:uppercase;
  color:var(--coral);
  margin-bottom:16px;
}

@media (hover:none){
  body, button, a{ cursor:auto; }
}

/* ===== GRAIN ===== */
.grain{
  position:fixed; inset:0; pointer-events:none; z-index:9998;
  opacity:0.04; mix-blend-mode:overlay;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}

/* ===== CUSTOM CURSOR ===== */
.cursor-dot, .cursor-ring{
  position:fixed; top:0; left:0; pointer-events:none; z-index:9999;
  border-radius:50%;
  transform:translate(-50%,-50%);
  will-change:transform;
}
.cursor-dot{
  width:6px; height:6px; background:var(--coral);
  transition:opacity .2s;
}
.cursor-ring{
  width:36px; height:36px; border:1px solid rgba(249,134,3,0.5);
  transition:width .25s var(--ease), height .25s var(--ease), border-color .25s, opacity .2s;
}
.cursor-ring.is-link{ width:64px; height:64px; border-color:var(--coral); background:rgba(249,134,3,0.08); }
.cursor-ring.is-view{ width:90px; height:90px; border-color:var(--coral); background:rgba(249,134,3,0.1); }
@media (hover:none){ .cursor-dot,.cursor-ring{ display:none; } }

/* ===== NAV ===== */
.nav{
  position:fixed; top:0; left:0; right:0; z-index:1000;
  display:flex; align-items:center; justify-content:space-between;
  padding:28px clamp(20px,5vw,64px);
  transition:background .3s, padding .3s, border-color .3s;
  border-bottom:1px solid transparent;
}
.nav.is-scrolled{
  background:rgba(13,13,15,0.85);
  backdrop-filter:blur(12px);
  padding-top:18px; padding-bottom:18px;
  border-bottom:1px solid var(--line);
}
.nav__logo{
  font-family:var(--display); font-weight:800; font-size:18px;
  letter-spacing:0.02em;
}
.nav__logo span{ color:var(--coral); }
.nav__links{ display:flex; gap:40px; }
.nav__links a{
  font-size:14px; color:var(--text-dim); position:relative;
  transition:color .25s;
}
.nav__links a:hover{ color:var(--text); }
.nav__links a::after{
  content:''; position:absolute; left:0; bottom:-4px; width:0; height:1px;
  background:var(--coral); transition:width .25s var(--ease);
}
.nav__links a:hover::after{ width:100%; }
.nav__cta{
  font-size:13px; font-weight:600; padding:11px 22px;
  border:1px solid var(--line); border-radius:100px;
  transition:border-color .25s, background .25s;
}
.nav__cta:hover{ border-color:var(--coral); background:rgba(249,134,3,0.08); }
.nav__burger{ display:none; }

.mobile-menu{ display:none; }

@media (max-width: 860px){
  .nav__links, .nav__cta{ display:none; }
  .nav__burger{
    display:flex; flex-direction:column; gap:5px; background:none; border:none; padding:6px;
  }
  .nav__burger span{ width:22px; height:2px; background:var(--text); transition:transform .25s, opacity .25s; }
  .mobile-menu{
    display:flex;
    position:fixed; inset:0; z-index:999; background:var(--bg);
    flex-direction:column; align-items:center; justify-content:center; gap:32px;
    transform:translateY(-100%); transition:transform .4s var(--ease);
  }
  .mobile-menu.is-open{ transform:translateY(0); }
  .mobile-menu a{ font-family:var(--display); font-size:32px; font-weight:700; }
}

/* ===== HERO ===== */
.hero{
  position: relative;
  overflow: hidden;
  min-height: 100svh;
  display: flex;
  flex-direction: column;
  padding: 140px clamp(20px,5vw,72px) 48px;
}
#gridCanvas{
  position:absolute; inset:0; width:100%; height:100%;
  opacity:0.35; z-index:0;
}

/* kicker */
.hero__kicker{
  position:relative; z-index:4;
  display:flex; align-items:center; gap:12px;
  font-family:var(--mono); font-size:11px; letter-spacing:0.14em; text-transform:uppercase;
  color:var(--text-dim);
}
.hero__kicker span:first-child{ color:var(--coral); }
.hero__kicker-dot{ color:var(--line); }

/* stage: name + photo overlap zone */
.hero__stage{
  position:relative;
  flex:1;
  display:flex;
  align-items:flex-end;
  margin-top:28px;
}

.hero__namewrap{
  position:relative; z-index:3;
  width:100%;
}

 .hero__title{
  font-family:var(--display); font-weight:900;
  font-size:clamp(48px, 9vw, 130px);
  line-height:0.92; letter-spacing:-0.03em;
  color:var(--text);
  margin:0;
}
.hero__line{ display:block; overflow:visible; }
.hero__clip{
  display:inline-block;
  transform:translateY(110%);
  opacity:0;
  transition:transform 1.1s var(--ease-soft), opacity .8s ease;
}
.hero__clip.is-visible{ transform:translateY(0); opacity:1; }
.hero__line--2 .hero__clip{ transition-delay:.12s; }

.hero__role{
  font-family:var(--script); font-style:normal; font-weight:400;
  font-size:clamp(16px, 1.7vw, 22px);
  color:var(--text-dim);
  margin-top:20px;
  max-width:min(580px, 48vw);
  line-height:1.55;
  text-wrap:balance;
  overflow-wrap:break-word;
  opacity:0; transform:translateY(16px);
  transition:opacity .9s var(--ease-soft), transform .9s var(--ease-soft);
  transition-delay:.5s;
}
/* .hero__role{
  font-family:var(--script); font-style:normal; font-weight:400;
  font-size:clamp(16px, 1.7vw, 22px);
  color:var(--text-dim);
  margin-top:20px;
  max-width:480px;
  opacity:0; transform:translateY(16px);
  transition:opacity .9s var(--ease-soft), transform .9s var(--ease-soft);
  transition-delay:.5s;
} */
.hero__role.is-visible{ opacity:1; transform:translateY(0); }

/* photo: overlaps the name on the right, behind the second line */
/* .hero__photo{
  position:absolute;
  right:clamp(-20px, 2vw, 40px);
  bottom:-4%;
  width:min(34vw, 380px);
  height:100%;
  z-index:2;
  pointer-events:none;
  opacity:0;
  transform:translateY(28px) scale(0.97);
  transition:opacity 1.2s var(--ease-soft), transform 1.2s var(--ease-soft);
  transition-delay:.3s;
  will-change:transform;
} */

.hero__photo{
  position:absolute;
  right: 0;
  bottom: 0;
  width: min(42vw, 480px);
  height: 115%;
  z-index:2;
  pointer-events:none;
  opacity:0;
  transform:translateY(28px) scale(0.97);
  transition:opacity 1.2s var(--ease-soft), transform 1.2s var(--ease-soft);
  transition-delay:.3s;
  will-change:transform;
}
.hero__photo.is-visible{ opacity:1; transform:translateY(0) scale(1); }
.hero__glow{
  display: none;
}
/* .hero__glow{
  position:absolute;
  top:8%; left:50%; transform:translateX(-50%);
  width:150%; aspect-ratio:1/1;
  background:radial-gradient(circle, rgba(249,134,3,0.42) 0%, rgba(249,134,3,0.15) 38%, transparent 70%);
  filter:blur(28px);
  z-index:-1;
} */

.hero__photo img{
  position:relative;
  width:100%; height:100%;
  object-fit:contain;
  object-position:center top;
  }
/* .hero__photo img{
  position:relative;
  width:100%; height:100%;
  object-fit:contain;
  object-position:center bottom;
  filter:contrast(1.12) saturate(0.92);
  -webkit-mask-image:linear-gradient(to bottom, black 88%, transparent 100%);
  mask-image:linear-gradient(to bottom, black 88%, transparent 100%);
} */

.hero__footer{
  position:relative; z-index:4;
  display:flex; align-items:flex-end; justify-content:space-between;
  gap:24px; flex-wrap:wrap;
  margin-top:auto;
  padding-top:32px;
}
.hero__contact{
  display:flex; flex-direction:column; gap:6px;
  font-family:var(--mono); font-size:12px; color:var(--text-dim);
}
.hero__year{ color:var(--text); margin-bottom:6px; font-size:12px; }
.hero__contact a{ transition:color .25s; width:fit-content; }
.hero__contact a:hover{ color:var(--coral); }

.hero__social{
  display:flex; align-items:center; gap:10px;
  font-size:13px; color:var(--text-dim);
}
.hero__social a{ transition:color .25s; }
.hero__social a:hover{ color:var(--coral); }
.hero__social span{ color:var(--line); }

.btn{
  display:inline-flex; align-items:center; justify-content:center;
  font-size:14px; font-weight:600; padding:16px 32px; border-radius:100px;
  transition:transform .3s var(--ease), background .3s, color .3s, border-color .3s;
}
.btn--solid{
  background:var(--coral); color:#0D0D0F;
  position:relative; overflow:hidden; isolation:isolate;
}
.btn--solid::before{
  content:'';
  position:absolute;
  width:180px; height:180px;
  background:radial-gradient(circle, rgba(255,255,255,0.55) 0%, rgba(255,255,255,0.15) 40%, transparent 70%);
  border-radius:50%;
  left:var(--gx, 50%); top:var(--gy, 50%);
  transform:translate(-50%, -50%);
  pointer-events:none;
  opacity:0;
  transition:opacity 0.25s ease;
  z-index:1;
}
.btn--solid:hover::before{ opacity:1; }
.hero__ctas .btn--solid:hover {
  background: #f98603;
  box-shadow: 0 0 36px rgba(249,134,3,0.45);
  transform: translateY(-2px);
}
.btn--ghost{ border:1px solid var(--line); }
.btn--ghost:hover{ border-color:var(--coral); transform:translateY(-3px); }

.hero__scroll{
  position:absolute; bottom:28px; left:clamp(20px,5vw,72px); z-index:4;
  display:flex; align-items:center; gap:12px;
}
.hero__scroll span{ font-family:var(--mono); font-size:11px; letter-spacing:0.1em; color:var(--text-dim); text-transform:uppercase; }
.scroll-line{ width:1px; height:32px; background:var(--line); position:relative; overflow:hidden; }
.scroll-line i{
  position:absolute; top:-32px; left:0; width:100%; height:32px; background:var(--coral);
  animation:scrollDown 2s ease-in-out infinite;
}
@keyframes scrollDown{
  0%{ transform:translateY(0); } 100%{ transform:translateY(64px); }
}

@media (prefers-reduced-motion: reduce){
  .hero__clip{ transform:none; opacity:1; }
  .hero__role, .hero__photo{ opacity:1; transform:none; }
}

@media (max-width:900px){
  .hero{ padding-top:120px; padding-bottom:40px; }
  .hero__stage{ flex-direction:column-reverse; align-items:center; }
  .hero__photo{
    position:relative; right:auto; bottom:auto;
    width:62%; height:280px; margin:0 0 8px;
  }
  .hero__namewrap{ text-align:center; }
  .hero__title{ font-size:clamp(40px,15vw,80px); }
  .hero__role{ margin-left:auto; margin-right:auto; }
  .hero__footer{ flex-direction:column; align-items:flex-start; gap:24px; }
  .hero__scroll{ display:none; }
}

/* ===== MARQUEE ===== */
.marquee{
  border-top:1px solid var(--line); border-bottom:1px solid var(--line);
  overflow:hidden; padding:22px 0; background:var(--bg-panel);
}
.marquee__track{
  display:flex; gap:24px; white-space:nowrap; width:max-content;
  animation:marquee 28s linear infinite;
  font-family:var(--mono); font-size:14px; color:var(--text-dim);
}
.marquee__track span:nth-child(odd){ color:var(--coral); }
@keyframes marquee{
  from{ transform:translateX(0); } to{ transform:translateX(-50%); }
}

/* ===== SECTION HEAD ===== */
.section-head{ max-width:700px; margin:0 auto 64px; padding:0 clamp(20px,5vw,64px); text-align:left; }
.section-head h2{
  font-family:var(--display); font-weight:800; font-size:clamp(32px,4.5vw,52px);
  letter-spacing:-0.01em; line-height:1.08;
}

/* ===== EXPLORE THE STUDIO — editorial entry section ===== */
.explore{
  position:relative;
  padding:140px 0 140px;
  overflow:hidden;
}

.explore__stage{
  position:relative;
  isolation:isolate;
  padding-top:clamp(60px, 9vw, 140px);
}

/* huge ghost background typography — own space, cards overlap its lower edge */
.explore__bg-type{
  position:absolute;
  left:0; right:0;
  top:0;
  height:clamp(180px, 20vw, 340px);
  z-index:0;
  display:flex; flex-direction:column; align-items:center; justify-content:center;
  gap:0; pointer-events:none;
  user-select:none;
  overflow:hidden;
}
.explore__bg-type span{
  display:block;
  font-family:var(--display); font-weight:900;
  font-size:clamp(70px, 11.5vw, 200px);
  line-height:0.84; letter-spacing:-0.02em;
  color:transparent;
  -webkit-text-stroke:1.5px var(--line);
  white-space:nowrap;
}
.explore__bg-type span:nth-child(2){
  -webkit-text-stroke:1.5px rgba(249,134,3,0.22);
  margin-top:-0.12em;
  font-size:0.7em;
}

.explore__head{
  position:relative; z-index:2;
  padding:0 clamp(20px,5vw,64px);
  margin-bottom:64px;
}
.explore__head h2{
  font-family:var(--serif); font-style:italic; font-weight:500;
  font-size:clamp(36px,5.5vw,68px);
  letter-spacing:-0.01em; color:var(--text);
}

.explore__cards{
  position:relative; z-index:2;
  display:flex; gap:0;
  padding:0 clamp(20px,5vw,64px);
  margin-top:clamp(-40px, -2vw, -10px);
}

.explore-card{
  position:relative;
  flex:1 1 0;
  display:flex; flex-direction:column;
  background:none; border:none; cursor:pointer; text-align:left;
  padding:0 18px;
  border-left:1px solid var(--line);
  min-width:0;
  transition:flex .55s var(--ease);
}
.explore__cards .explore-card:last-child{ border-right:1px solid var(--line); }

.explore-card__num{
  display:block;
  font-family:var(--mono); font-size:13px; color:var(--coral);
  letter-spacing:0.1em; margin-bottom:18px;
}

.explore-card__media{
  position:relative;
  width:100%; aspect-ratio:3/4.4;
  overflow:hidden; border-radius:4px;
  background:var(--bg-panel);
  margin-bottom:22px;
}
.explore-card__media::before{
  content:''; position:absolute; inset:0; z-index:2;
  background:linear-gradient(180deg, transparent 40%, rgba(13,13,15,0.85) 100%);
}
.explore-card__media::after{
  content:''; position:absolute; inset:0; z-index:3;
  background:var(--bg);
  transform:scaleY(0.94); transform-origin:top;
  opacity:0.55;
  transition:transform .7s var(--ease-soft), opacity .6s ease;
}
.explore-card:hover .explore-card__media::after{ transform:scaleY(0); opacity:0; }
.explore-card__media img{
  width:100%; height:100%; object-fit:cover;
  filter:saturate(0.7) brightness(0.6);
  transform:scale(1.08);
  transition:transform 1s var(--ease-soft), filter .6s ease;
}
.explore-card:hover .explore-card__media img{
  transform:scale(1);
  filter:saturate(1) brightness(0.95);
}

.explore-card__info{ position:relative; }
.explore-card__title{
  font-family:var(--display); font-weight:800;
  font-size:clamp(19px,1.7vw,24px);
  letter-spacing:-0.01em; color:var(--text);
  margin-bottom:6px;
  transition:color .3s;
}
.explore-card:hover .explore-card__title{ color:var(--coral); }
.explore-card__sub{
  font-family:var(--mono); font-size:11.5px; color:var(--text-dim);
  letter-spacing:0.04em;
}

.explore-card__arrow{
  position:absolute; top:0; right:18px; z-index:4;
  width:38px; height:38px; border-radius:50%;
  display:flex; align-items:center; justify-content:center;
  background:rgba(13,13,15,0.55); backdrop-filter:blur(6px);
  border:1px solid var(--line);
  color:var(--text); font-size:15px;
  opacity:0; transform:translateY(-8px) rotate(-15deg);
  transition:opacity .3s ease, transform .35s var(--ease), border-color .3s, color .3s;
}
.explore-card:hover .explore-card__arrow{
  opacity:1; transform:translateY(0) rotate(0deg);
  border-color:var(--coral); color:var(--coral);
}

@media (hover:hover){
  .explore__cards:has(.explore-card:hover) .explore-card{ flex:0.85 1 0; }
  .explore__cards:has(.explore-card:hover) .explore-card:hover{ flex:1.3 1 0; }
}

@media (max-width:980px){
  .explore__cards{ flex-direction:column; gap:48px; }
  .explore-card{ border-left:none !important; border-right:none !important; padding:0; }
  .explore-card__media{ aspect-ratio:16/10; }
  .explore__bg-type span{ font-size:clamp(54px,18vw,120px); }
  .explore__head{ margin-bottom:56px; }
}

/* back link (used on category + case study pages) */
.work__back{
  display:inline-flex; align-items:center; gap:10px;
  background:none; border:none; cursor:pointer; text-decoration:none;
  font-family:var(--mono); font-size:13px; letter-spacing:0.05em; text-transform:uppercase;
  color:var(--text-dim); transition:color .25s;
}
.work__back:hover{ color:var(--coral); }
.work__back-arrow{ display:inline-block; transition:transform .25s var(--ease); }
.work__back:hover .work__back-arrow{ transform:translateX(-4px); }

/* ===== CATEGORY PAGE: HERO ===== */
.cat-hero{
  position:relative; min-height:62vh;
  display:flex; flex-direction:column; justify-content:flex-end;
  padding:120px clamp(20px,5vw,64px) 64px;
  overflow:hidden;
}
.cat-hero__bg{
  position:absolute; inset:0; z-index:0;
}
.cat-hero__bg img{
  width:100%; height:100%; object-fit:cover;
  filter:saturate(0.85) brightness(0.5);
}
.cat-hero__bg::after{
  content:''; position:absolute; inset:0;
  background:linear-gradient(0deg, var(--bg) 0%, rgba(13,13,15,0.55) 55%, rgba(13,13,15,0.25) 100%);
}
.cat-hero__top{ position:relative; z-index:2; margin-bottom:auto; padding-top:8px; }
.cat-hero__content{ position:relative; z-index:2; max-width:780px; }
.cat-hero__num{
  font-family:var(--mono); font-size:13px; color:var(--coral); letter-spacing:0.12em;
  display:block; margin-bottom:16px;
}
.cat-hero__title{
  font-family:var(--display); font-weight:900; font-size:clamp(44px,8vw,110px);
  letter-spacing:-0.02em; line-height:0.95; margin-bottom:8px;
}
.cat-hero__title em{
  font-family:'Caveat', cursive; font-weight:700; font-style:normal; color:var(--coral);
  font-size:0.55em; margin-left:14px;
}
.cat-hero__tagline{ color:var(--text-dim); font-size:clamp(15px,1.6vw,18px); max-width:540px; margin-top:18px; }

/* ===== CATEGORY PAGE: INTRO ===== */
.cat-intro{
  padding:80px clamp(20px,5vw,64px); border-bottom:1px solid var(--line);
}
.cat-intro__text{
  font-family:var(--serif); font-style:italic; font-weight:500;
  font-size:clamp(20px,2.6vw,30px); line-height:1.5; color:var(--text);
  max-width:920px;
}

/* ===== CATEGORY PAGE: PROJECT GRID ===== */
.cat-grid{ padding:80px clamp(20px,5vw,64px) 100px; }
.cat-grid__label{
  font-family:var(--mono); font-size:12px; letter-spacing:0.12em; text-transform:uppercase;
  color:var(--coral); margin-bottom:40px;
}
.work__gallery-grid, .cat-grid__grid{
  display:grid; grid-template-columns:repeat(2, 1fr); gap:32px;
}
.gallery-card{
  cursor:pointer; display:block; text-decoration:none; color:inherit;
}
.gallery-card__media{
  position:relative; aspect-ratio:4/3; overflow:hidden; border-radius:6px;
  background:var(--bg-panel); margin-bottom:18px;
}
.gallery-card__media img{
  width:100%; height:100%; object-fit:cover;
  transform:scale(1.04);
  transition:transform .8s var(--ease-soft), filter .5s;
  filter:saturate(0.9) brightness(0.92);
}
.gallery-card:hover .gallery-card__media img{ transform:scale(1.12); filter:saturate(1.05) brightness(1); }
.gallery-card__viewlabel{
  position:absolute; bottom:18px; left:18px; z-index:2;
  display:flex; align-items:center; gap:8px;
  font-family:var(--mono); font-size:11px; letter-spacing:0.08em; text-transform:uppercase;
  color:var(--text); background:rgba(13,13,15,0.6); backdrop-filter:blur(6px);
  padding:8px 14px; border-radius:100px;
  opacity:0; transform:translateY(8px);
  transition:opacity .35s var(--ease), transform .35s var(--ease);
}
.gallery-card:hover .gallery-card__viewlabel{ opacity:1; transform:translateY(0); }
.gallery-card__meta{
  display:flex; align-items:baseline; justify-content:space-between; gap:12px;
}
.gallery-card__name{
  font-family:var(--display); font-weight:700; font-size:20px;
  transition:color .25s;
}
.gallery-card:hover .gallery-card__name{ color:var(--coral); }
.gallery-card__year{ font-family:var(--mono); font-size:12px; color:var(--text-dim); }
.gallery-card__blurb{ color:var(--text-dim); font-size:13.5px; margin-top:6px; max-width:90%; }

@media (max-width:760px){
  .work__gallery-grid, .cat-grid__grid{ grid-template-columns:1fr; gap:40px; }
}

/* ===== CASE STUDY PAGE ===== */
.case__hero{
  position:relative; margin:0 clamp(20px,5vw,64px) 56px;
  aspect-ratio:16/8; border-radius:8px; overflow:hidden;
  background:var(--bg-panel);
}
.case__hero img{ width:100%; height:100%; object-fit:cover; }
.case__hero-overlay{
  position:absolute; inset:0;
  background:linear-gradient(0deg, rgba(13,13,15,0.92) 0%, rgba(13,13,15,0.1) 55%, transparent 100%);
}
.case__hero-info{
  position:absolute; left:clamp(20px,3vw,48px); bottom:32px; z-index:2;
}
.case__category{
  font-family:var(--mono); font-size:12px; color:var(--coral); letter-spacing:0.1em; text-transform:uppercase;
  display:block; margin-bottom:10px;
}
.case__title{
  font-family:var(--display); font-weight:900; font-size:clamp(28px,5vw,56px);
  letter-spacing:-0.02em; margin-bottom:8px;
}
.case__year{ font-family:var(--mono); font-size:13px; color:var(--text-dim); }

.case__top{
  display:flex; align-items:center; justify-content:space-between; gap:24px;
  padding:0 clamp(20px,5vw,64px); margin-bottom:32px;
}
.case__breadcrumb{
  font-family:var(--mono); font-size:12px; color:var(--text-dim); letter-spacing:0.05em;
}
.case__breadcrumb a{ color:var(--text-dim); text-decoration:none; transition:color .25s; }
.case__breadcrumb a:hover{ color:var(--coral); }

.case__body{
  display:grid; grid-template-columns:1.6fr 1fr; gap:64px;
  padding:0 clamp(20px,5vw,64px); margin-bottom:64px;
}
.case__label{
  font-family:var(--mono); font-size:12px; letter-spacing:0.12em; text-transform:uppercase;
  color:var(--coral); margin-bottom:18px;
}
.case__text{ color:var(--text-dim); font-size:16px; line-height:1.75; }
.case__tools-list{ display:flex; flex-wrap:wrap; gap:10px; }
.case__tools-list span{
  font-family:var(--mono); font-size:12px; color:var(--text);
  border:1px solid var(--line); padding:8px 14px; border-radius:100px;
}

.case__gallery{
  display:grid; grid-template-columns:repeat(2,1fr); gap:20px;
  padding:0 clamp(20px,5vw,64px); margin-bottom:64px;
}
.case__gallery img{
  width:100%; display:block; border-radius:6px;
  background:var(--bg-panel);
}
.case__gallery .span-2{ grid-column:span 2; }

.case__result{
  max-width:700px; margin:0 0 90px;
  padding:0 clamp(20px,5vw,64px);
}

/* next project banner */
.case__next{
  display:block; text-decoration:none; color:inherit;
  position:relative; border-top:1px solid var(--line);
  padding:64px clamp(20px,5vw,64px); overflow:hidden;
}
.case__next-bg{
  position:absolute; inset:0; opacity:0;
  transition:opacity .5s var(--ease);
}
.case__next-bg img{ width:100%; height:100%; object-fit:cover; filter:brightness(0.35) saturate(0.8); }
.case__next:hover .case__next-bg{ opacity:1; }
.case__next-inner{ position:relative; z-index:2; }
.case__next-label{
  font-family:var(--mono); font-size:12px; letter-spacing:0.12em; text-transform:uppercase;
  color:var(--coral); display:block; margin-bottom:16px;
}
.case__next-title{
  font-family:var(--display); font-weight:900; font-size:clamp(32px,6vw,72px);
  letter-spacing:-0.02em; display:flex; align-items:center; gap:24px;
}
.case__next-arrow{ transition:transform .35s var(--ease); }
.case__next:hover .case__next-arrow{ transform:translateX(12px); }

.case__related{ padding:56px clamp(20px,5vw,64px) 0; border-top:1px solid var(--line); }
.case__related-grid{
  display:grid; grid-template-columns:repeat(3,1fr); gap:24px; margin-top:24px;
}
.related-card{ cursor:pointer; text-decoration:none; color:inherit; display:block; }
.related-card__media{
  aspect-ratio:4/3; border-radius:6px; overflow:hidden; margin-bottom:12px;
  background:var(--bg-panel);
}
.related-card__media img{
  width:100%; height:100%; object-fit:cover;
  transition:transform .6s var(--ease);
}
.related-card:hover .related-card__media img{ transform:scale(1.08); }
.related-card__name{ font-family:var(--display); font-weight:700; font-size:15px; }

@media (max-width:860px){
  .case__body{ grid-template-columns:1fr; gap:32px; }
  .case__gallery{ grid-template-columns:1fr; }
  .case__gallery .span-2{ grid-column:span 1; }
  .case__related-grid{ grid-template-columns:1fr 1fr; }
}
@media (max-width:640px){
  .case__top{
    flex-direction:column; align-items:flex-start; gap:10px;
  }
  .case__breadcrumb{
    white-space:normal; word-break:break-word; line-height:1.6;
  }
}
@media (max-width:560px){
  .case__related-grid{ grid-template-columns:1fr; }
  .case__next-title{ font-size:clamp(26px,9vw,40px); gap:14px; }
}

@media (max-width:700px){
  .cat-hero{ min-height:52vh; padding:100px clamp(20px,5vw,64px) 48px; }
  .cat-hero__title{ font-size:clamp(36px,11vw,64px); }
  .cat-hero__title em{ display:block; margin-left:0; margin-top:6px; }
  .cat-intro{ padding:56px clamp(20px,5vw,64px); }
  .cat-grid{ padding:56px clamp(20px,5vw,64px) 72px; }
}

/* ===== SERVICES ===== */
.services{ padding:100px 0 140px; border-top:1px solid var(--line); }
.services__grid{
  display:grid; grid-template-columns:repeat(4,1fr); gap:1px;
  background:var(--line);
  margin:0 clamp(20px,5vw,64px); border:1px solid var(--line);
}
.service{
  background:var(--bg); padding:40px 28px; transition:background .3s;
}
.service:hover{ background:var(--bg-panel); }
.service__num{
  font-family:var(--mono); font-size:13px; color:var(--coral); display:block; margin-bottom:28px;
}
.service h3{
  font-family:var(--display); font-weight:700; font-size:20px; margin-bottom:14px; line-height:1.2;
}
.service p{ font-size:14px; color:var(--text-dim); line-height:1.6; }

@media (max-width:860px){
  .services__grid{ grid-template-columns:1fr 1fr; }
}
@media (max-width:560px){
  .services__grid{ grid-template-columns:1fr; }
}

/* ===== ABOUT + SKILLS ===== */
.about{ padding:140px 0; }
.about .section-head{ margin-bottom:64px; }
.about .section-head h2{
  font-family:var(--display); font-weight:800; font-size:clamp(30px,4vw,46px);
  line-height:1.12; letter-spacing:-0.01em;
}

.about__inner{
  display:grid; grid-template-columns:0.85fr 1.15fr; gap:72px;
  padding:0 clamp(20px,5vw,64px);
  align-items:start;
}

.about__visual{
  position:relative;
  aspect-ratio:3/4;
  border-radius:6px;
  overflow:hidden;
  background:var(--bg-panel);
}
.about__visual-glow{
  position:absolute; top:-10%; left:50%; transform:translateX(-50%);
  width:120%; aspect-ratio:1/1;
  background:radial-gradient(circle, rgba(249,134,3,0.3) 0%, transparent 65%);
  filter:blur(30px);
  z-index:1;
}
.about__visual img{
  position:relative; z-index:2;
  width:100%; height:100%;
  object-fit:cover; object-position:center 15%;
  filter:grayscale(0.3) contrast(1.05);
}

.about__content{ display:flex; flex-direction:column; }
.about__body{ color:var(--text-dim); font-size:16px; line-height:1.7; max-width:560px; margin-bottom:18px; }

.about__stats{
  display:grid; grid-template-columns:1fr 1fr; gap:1px;
  background:var(--line); border:1px solid var(--line);
  margin:32px 0 48px;
}
.stat{ background:var(--bg); padding:28px 22px; }
.stat__num{
  display:block; font-family:var(--display); font-weight:900; font-size:36px; color:var(--coral); line-height:1;
  margin-bottom:8px;
}
.stat__label{ font-size:12.5px; color:var(--text-dim); }

.about__skills-label{
  font-family:var(--mono); font-size:12px; letter-spacing:0.12em; text-transform:uppercase;
  color:var(--coral); margin-bottom:28px;
}

.skills__grid{
  display:flex; flex-wrap:wrap; gap:36px;
}
.skill-ring{
  position:relative;
  width:80px;
  display:flex; flex-direction:column; align-items:center; gap:10px;
}
.skill-ring__svg{ width:80px; height:80px; transform:rotate(-90deg); }
.skill-ring__track{
  fill:none; stroke:var(--line); stroke-width:4;
}
.skill-ring__fill{
  fill:none; stroke:var(--coral); stroke-width:4; stroke-linecap:round;
  stroke-dasharray:213.6; stroke-dashoffset:213.6;
  transition:stroke-dashoffset 1.4s var(--ease-soft);
}
.skill-ring__icon{
  position:absolute; top:26px; left:50%; transform:translateX(-50%);
  font-family:var(--display); font-weight:800; font-size:15px; color:var(--text);
}
.skill-ring__pct{ display:none; }
.skill-ring__label{
  font-size:12px; color:var(--text-dim); text-align:center;
}

@media (max-width:900px){
  .about__inner{ grid-template-columns:1fr; gap:40px; }
  .about__visual{ max-width:340px; aspect-ratio:4/5; }
  .skills__grid{ justify-content:flex-start; }
}

/* ===== EXPERIENCE & EDUCATION — vertical timeline ===== */
.timeline{
  padding:140px 0 160px;
  border-top:1px solid var(--line);
}
.timeline .section-head{
  max-width:760px; margin:0 auto 96px; padding:0 clamp(20px,5vw,64px);
}
.timeline .section-head h2{
  font-family:var(--display); 
  font-weight:800;
  font-size:clamp(28px,3.6vw,44px); line-height:1.3; letter-spacing:-0.01em;
  color:var(--text);
}

.timeline__rail{
  position:relative;
  max-width:880px; margin:0 auto;
  padding:0 clamp(20px,5vw,64px);
  --rail-x: clamp(20px,5vw,64px);
}

/* glowing vertical line */
.timeline__line{
  position:absolute;
  left:var(--rail-x);
  top:14px; bottom:14px;
  width:2px;
  background:var(--line);
  border-radius:2px;
}
.timeline__line-fill{
  position:absolute; left:0; top:0; width:100%;
  height:0%;
  background:linear-gradient(180deg, var(--coral) 0%, var(--coral-dim) 85%);
  border-radius:2px;
  box-shadow:0 0 16px 2px rgba(249,134,3,0.55), 0 0 40px 6px rgba(249,134,3,0.18);
  transition:height .15s linear;
}

.timeline__items{
  display:flex; flex-direction:column; gap:64px;
}

.timeline-item{
  position:relative;
  padding-left:calc(var(--rail-x) + 36px);
}

.timeline-item__dot{
  position:absolute;
  left:calc(var(--rail-x) - 6px);
  top:14px;
  width:14px; height:14px; border-radius:50%;
  background:var(--bg);
  border:2px solid var(--line);
  transition:border-color .4s var(--ease), background .4s var(--ease), box-shadow .4s var(--ease);
}

.timeline-item.is-active .timeline-item__dot{
  border-color:var(--coral);
  background:var(--coral);
  box-shadow:0 0 0 5px rgba(249,134,3,0.16), 0 0 18px 2px rgba(249,134,3,0.5);
}

.timeline-item__card{
  background:var(--bg-panel);
  border:1px solid var(--line);
  border-radius:10px;
  padding:32px clamp(22px,3vw,36px);
  transition:border-color .35s var(--ease), transform .35s var(--ease), box-shadow .35s var(--ease);
}
.timeline-item__card:hover{
  border-color:rgba(249,134,3,0.35);
  transform:translateY(-4px);
  box-shadow:0 16px 40px -16px rgba(0,0,0,0.5);
}

.timeline-item__date{
  display:inline-block;
  font-family:var(--mono); font-size:12px; letter-spacing:0.08em; text-transform:uppercase;
  color:var(--coral);
  margin-bottom:14px;
}
.timeline-item__role{
  font-family:var(--display); font-weight:800; font-size:clamp(19px,2.2vw,24px);
  letter-spacing:-0.01em; color:var(--text); margin-bottom:6px;
}
.timeline-item__org{
  font-size:14px; color:var(--text-dim); margin-bottom:22px;
}

.timeline-item__list{
  list-style:none; display:flex; flex-direction:column; gap:9px;
  margin-bottom:22px;
}
.timeline-item__list li{
  position:relative; padding-left:18px;
  font-size:14.5px; color:var(--text-dim); line-height:1.5;
}
.timeline-item__list li::before{
  content:''; position:absolute; left:0; top:8px;
  width:5px; height:5px; border-radius:50%;
  background:var(--coral);
}

.timeline-item__tools{
  display:flex; flex-wrap:wrap; gap:8px;
  padding-top:18px; border-top:1px solid var(--line);
}
.timeline-item__tools span{
  font-family:var(--mono); font-size:11px; color:var(--text);
  border:1px solid var(--line); padding:6px 12px; border-radius:100px;
}


/* ── TIMELINE HIGHLIGHTS ─────────────────────────────── */
.timeline-item__highlights {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 16px;
  padding-top: 16px;
  border-top: 1px solid var(--line);
}
.timeline-item__highlights span {
  font-family: var(--mono);
  font-size: 10px;
  letter-spacing: 0.08em;
  color: var(--coral);
  background: rgba(249,134,3, 0.08);
  border: 1px solid rgba(249,134,3, 0.25);
  border-radius: 100px;
  padding: 4px 12px;
  transition: background 0.22s, border-color 0.22s;
}
.timeline-item__highlights span:hover {
  background: rgba(249,134,3, 0.15);
  border-color: var(--coral);
}

@media (max-width:700px){
  .timeline__line{ left:8px; }
  .timeline-item{ padding-left:32px; }
  .timeline-item__dot{ left:1px; }
  .timeline .section-head{ margin-bottom:64px; }
  .timeline__items{ gap:48px; }
}

/* ===== SIGNATURE QUOTE ===== */
.quote{
  padding:160px clamp(20px,5vw,64px);
  text-align:center;
  max-width:900px; margin:0 auto;
  border-top:1px solid var(--line);
}
.quote__mark{
  font-family:var(--serif); font-style:italic; font-size:64px; color:var(--coral);
  line-height:1; margin-bottom:8px; opacity:0.7;
}
.quote__text{
    font-family:var(--script); font-style:normal; font-weight:400;
  font-size:clamp(26px, 4.2vw, 48px);
  line-height:1.3; letter-spacing:-0.01em;
  color:var(--text);
  margin-bottom:36px;
}
.quote__author{
  font-family:var(--script);
  font-size:clamp(26px, 3vw, 36px);
  color:var(--coral);
}

/* ===== CONTACT ===== */
.contact{
  padding:120px clamp(20px,5vw,64px) 140px;
  text-align:center; border-top:1px solid var(--line);
  display:flex; flex-direction:column; align-items:center;
}
.contact h2{
  font-family:var(--display); font-weight:900; font-size:clamp(40px,7vw,84px);
  line-height:1.02; letter-spacing:-0.02em; margin-bottom:24px;
}
.contact__sub{ color:var(--text-dim); font-size:18px; margin-bottom:40px; }
.contact__email{
  font-family:var(--display); font-weight:700; font-size:clamp(20px,3vw,30px);
  color:var(--coral); padding-bottom:8px; border-bottom:1px solid rgba(249,134,3,0.3);
  margin-bottom:56px; transition:border-color .25s;
}
.contact__email:hover{ border-color:var(--coral); }
.contact__links{ display:flex; gap:32px; flex-wrap:wrap; justify-content:center; }
.contact__links a{
  font-size:14px; color:var(--text-dim); position:relative; transition:color .25s;
}
.contact__links a:hover{ color:var(--text); }
.contact__links a::after{
  content:''; position:absolute; left:0; bottom:-4px; width:0; height:1px; background:var(--coral);
  transition:width .25s var(--ease);
}
.contact__links a:hover::after{ width:100%; }
/* ── LOGO IMAGE ─────────────────────────────────────── */
.nav__logo-img {
  height: 52px;
  width: auto;
  display: block;
  filter: none;
  transition: opacity 0.25s ease;
}
.nav__logo:hover .nav__logo-img {
  opacity: 0.75;
}
.v2-footer__logo .nav__logo-img {
  height: 40px;
}
/* ===== FOOTER ===== */
.footer{
  display:flex; align-items:center; justify-content:space-between;
  padding:28px clamp(20px,5vw,64px); border-top:1px solid var(--line);
  font-size:13px; color:var(--text-dim);
}
.footer .dot{ color:var(--coral); }

/* ===== REVEAL ANIMATION ===== */
[data-reveal]{
  opacity:0; transform:translateY(28px);
  transition:opacity .8s var(--ease), transform .8s var(--ease);
}
[data-reveal].is-visible{ opacity:1; transform:translateY(0); }

@media (prefers-reduced-motion: reduce){
  *{ animation-duration:0.001ms !important; transition-duration:0.001ms !important; }
  html{ scroll-behavior:auto; }
  [data-reveal]{ opacity:1; transform:none; }
}

/* ── HILLS HERO — centered layout ───────────────────── */
.hero__photo  { display: none !important; }
#gridCanvas   { display: none !important; }

.hero__stage  { align-items: center; justify-content: center; }
.hero__namewrap { text-align: center; display:flex; flex-direction:column; align-items:center; }
.hero__role   { text-align: center; margin-left:auto; margin-right:auto; }
.hero__ctas   { justify-content: center; }
.hero__kicker { justify-content: center; }
/* ══════════════════════════════════════════════════════
   ORGNZM SERVICES SECTION
   Left desc · Center giant names · Right image
══════════════════════════════════════════════════════ */
.orgnzm-services {
  padding: 100px 0 120px;
  border-top: 1px solid var(--line);
  overflow: hidden;
}

/* header row */
.orgnzm__header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0 clamp(24px, 5vw, 72px);
  margin-bottom: 60px;
}
.orgnzm__header-tag {
  font-family: var(--mono);
  font-size: 11px;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--text-dim);
}

/* body — 3 columns */
.orgnzm__body {
  display: grid;
  grid-template-columns: 200px 1fr 280px;
  align-items: center;
  padding: 0 clamp(24px, 5vw, 72px);
  gap: 0;
}

/* ── LEFT DESC ── */
.orgnzm__desc-col {
  align-self: center;
  position: relative;
  height: 120px;
}
.orgnzm__desc {
  position: absolute;
  top: 0; left: 0;
  opacity: 0;
  transform: translateY(8px);
  transition: opacity 0.4s ease, transform 0.4s cubic-bezier(0.22,1,0.36,1);
  pointer-events: none;
}
.orgnzm__desc.is-active {
  opacity: 1;
  transform: translateY(0);
  pointer-events: auto;
}
.orgnzm__desc p {
  font-family: var(--mono);
  font-size: 11.5px;
  line-height: 1.8;
  color: var(--text-dim);
  letter-spacing: 0.04em;
}

/* ── CENTER LIST ── */
.orgnzm__list {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  padding: 0 24px;
}

.orgnzm__item {
  background: none;
  border: none;
  padding: 8px 0;
  cursor: pointer;
  text-align: left;
  width: 100%;
  position: relative;
}

.orgnzm__item-title {
  display: block;
  font-family: var(--display);
  font-weight: 900;
  font-size: clamp(44px, 6.8vw, 108px);
  line-height: 1.0;
  letter-spacing: -0.03em;
  color: var(--text);
  opacity: 0.12;
  transform: translateX(0);
  transition:
    opacity    0.45s cubic-bezier(0.22, 1, 0.36, 1),
    transform  0.5s  cubic-bezier(0.22, 1, 0.36, 1),
    color      0.3s;
  will-change: opacity, transform;
}

/* wavy entrance */
.orgnzm__item.wavy-in .orgnzm__item-title {
  opacity: 0;
  transform: translateY(70%) skewY(6deg);
  transition:
    opacity   0.7s cubic-bezier(0.22, 1, 0.36, 1),
    transform 0.7s cubic-bezier(0.22, 1, 0.36, 1),
    color     0.3s;
}
.orgnzm__item.wavy-visible .orgnzm__item-title {
  transform: translateY(0) skewY(0);
}
.orgnzm__item:nth-child(1) .orgnzm__item-title { transition-delay: 0s; }
.orgnzm__item:nth-child(2) .orgnzm__item-title { transition-delay: 0.07s; }
.orgnzm__item:nth-child(3) .orgnzm__item-title { transition-delay: 0.14s; }
.orgnzm__item:nth-child(4) .orgnzm__item-title { transition-delay: 0.21s; }

/* active */
.orgnzm__item.is-active .orgnzm__item-title {
  opacity: 1;
  color: var(--text);
  transform: translateX(32px);
}

/* hover any */
.orgnzm__item:hover:not(.is-active) .orgnzm__item-title {
  opacity: 0.4;
  transform: translateX(16px);
}

/* ── RIGHT IMAGE ── */
.orgnzm__img-col {
  display: flex;
  justify-content: flex-end;
  align-items: center;
}
.orgnzm__img-frame {
  width: 100%;
  max-width: 260px;
  aspect-ratio: 3/4;
  border-radius: 10px;
  overflow: hidden;
  background: var(--bg-panel);
  box-shadow: 0 20px 56px rgba(0,0,0,0.55);
}
.orgnzm__img-frame img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: opacity 0.3s ease, transform 0.5s cubic-bezier(0.22,1,0.36,1);
}
.orgnzm__img-frame img.is-switching {
  opacity: 0;
  transform: scale(1.06);
}

/* ── MOBILE ── */
@media (max-width: 900px) {
  .orgnzm__body {
    grid-template-columns: 1fr;
    gap: 40px;
  }
  .orgnzm__desc-col { display: none; }
  .orgnzm__img-col  { display: none; }
  .orgnzm__list     { padding: 0; }
  .orgnzm__item-title {
    font-size: clamp(36px, 11vw, 64px);
  }
}
@media (max-width: 560px) {
  .orgnzm__item-title { font-size: clamp(30px, 12vw, 48px); }
  .orgnzm-services { padding: 72px 0 80px; }
}

/* ============================================================
   CURSOR ENHANCEMENT — Feature 1
   Appended. Does not modify existing cursor rules.
   To revert: delete everything below this comment.
   ============================================================ */

/* Override ring size/border for premium feel.
   These override the rules in style.css lines 316-321
   and v2.css lines 647-679. Appended last = wins cascade. */

.cursor-ring {
  width: 38px;
  height: 38px;
  border: 1px solid rgba(249, 134, 3, 0.45);
  /* Remove CSS transition entirely — JS spring handles movement.
     CSS transition on width/height kept for state changes only. */
  transition:
    width       0.45s cubic-bezier(0.16, 0.84, 0.44, 1),
    height      0.45s cubic-bezier(0.16, 0.84, 0.44, 1),
    border-color 0.3s ease,
    background   0.3s ease,
    opacity      0.25s ease;
}

/* DEFAULT — ring only, no fill */
.cursor-ring {
  background: transparent;
}

/* LINK state — tighter ring, coral border */
.cursor-ring.is-link {
  width: 52px;
  height: 52px;
  border-color: var(--coral);
  background: rgba(249, 134, 3, 0.06);
}

/* BUTTON state — solid feel, slightly larger */
.cursor-ring.is-button {
  width: 60px;
  height: 60px;
  border-color: var(--coral);
  border-width: 1.5px;
  background: rgba(249, 134, 3, 0.09);
}

/* VIEW state — large open ring */
.cursor-ring.is-view {
  width: 72px;
  height: 72px;
  border-color: var(--coral);
  border-width: 1px;
  background: rgba(249, 134, 3, 0.05);
}

/* CLOSE state — X indicator via ring shrink */
.cursor-ring.is-close {
  width: 44px;
  height: 44px;
  border-color: rgba(255, 255, 255, 0.6);
  border-width: 1px;
  background: rgba(255, 255, 255, 0.04);
}

/* CLICK — subtle scale down, not aggressive */
.cursor-ring.is-click {
  /* Handled entirely by JS transform — no CSS override needed */
}

/* Dot stays sharp — no changes to size */
.cursor-dot {
  width: 5px;
  height: 5px;
  background: var(--coral);
  transition: opacity 0.2s ease, transform 0.15s ease;
}

/* Dot scales down on click */
.cursor-dot.is-click {
  transform: translate(-50%, -50%) scale(0.5);
}

/* ============================================================
   PREMIUM MOTION SYSTEM — Feature 2 CSS
   Supporting styles only. Appended. Isolated.
   To revert: delete everything below this comment.
   ============================================================ */

/* About portrait — clip-path needs overflow visible on parent */
.about__visual {
  overflow: visible;
  /* clip-path set by GSAP — initial state defined there */
}

/* Skill ring labels — initial state set by GSAP */
.skill-ring__label {
  will-change: opacity, transform;
}

/* About body paragraphs — initial state set by GSAP */
.about__body {
  will-change: opacity, transform;
}

/* Process steps — will-change for GPU compositing */
.process__step {
  will-change: opacity, transform;
}

/* Quote elements — will-change */
.quote__mark,
.quote__text,
.quote__author {
  will-change: opacity, transform;
}

/* Contact elements */
.contact__email,
.contact__links a {
  will-change: opacity, transform;
}

/* Section head position:relative already set via JS for services line */

/* Orgnzm image — smooth transform for parallax */
#orgnzmImg {
  will-change: transform;
  transition: opacity 0.3s ease; /* keep existing swap fade */
}

/* About portrait image — smooth parallax */
.about__visual img {
  will-change: transform;
}

/* ============================================================
   BUG FIX — About image safety net
   Ensures image is never permanently hidden by clip-path.
   ============================================================ */
.about__visual {
  clip-path: none !important;
  -webkit-clip-path: none !important;
}

/* ============================================================
   INVERTED CURSOR — Feature 3
   White circle with mix-blend-mode:difference.
   Inverts colors of everything underneath it.
   Appended. To revert: delete from this comment to end of file.
   ============================================================ */

/* Hide the existing dot and ring — inverted cursor replaces them */
.cursor-dot,
.cursor-ring {
  display: none !important;
}

/* The inverted cursor circle */
.cursor-inverted {
  position: fixed;
  top: 0;
  left: 0;
  width: 48px;
  height: 48px;
  background: #ffffff;
  border-radius: 50%;
  pointer-events: none;
  z-index: 99999;
  mix-blend-mode: difference;
  opacity: 0;
  will-change: transform;
  /* No CSS transition — JS lerp handles smoothness */
}

/* Expanded state on link/view hover */
.cursor-inverted.is-expanded {
  width: 80px;
  height: 80px;
  /* Size change handled via JS lerp for smoothness */
}

/* Hide native cursor everywhere */
*, *::before, *::after {
  cursor: none !important;
}
