:root {
  --exp-bg: #090909;
  --exp-paper: #ebe9e3;
  --exp-ink: #101010;
  --exp-accent: #d9ff43;
  --exp-muted: #a4a29d;
  --exp-ease: cubic-bezier(.2,.72,.18,1);
}

html { scroll-padding-top: 76px; }
body { background: var(--exp-bg); }

.site-header {
  position: fixed;
  z-index: 100;
  min-height: 72px;
  padding: 0 clamp(20px, 3.6vw, 58px);
  border-bottom: 1px solid rgba(255,255,255,.1);
  background: rgba(9,9,9,.55);
  backdrop-filter: blur(18px) saturate(120%);
  transition: transform .5s var(--exp-ease), background .35s ease;
}

.site-header.is-scrolled { background: rgba(9,9,9,.84); }
.site-header.is-hidden { transform: translateY(-100%); }
.brand { width: 40px; height: 40px; }
.brand-mark { font-size: .7rem; letter-spacing: .04em; }
.nav { gap: clamp(20px, 3.5vw, 52px); }
.nav a { font-size: .68rem; letter-spacing: .16em; }
.language-switch { font-size: .66rem; letter-spacing: .15em; }

.profile-section,
.works-section { display: none !important; }

.experience-hero {
  position: relative;
  display: flex;
  min-height: 100svh;
  overflow: hidden;
  flex-direction: column;
  justify-content: space-between;
  padding: clamp(112px, 13vh, 150px) clamp(22px, 4.5vw, 74px) 34px;
  isolation: isolate;
}

.hero-atmosphere { position: absolute; inset: 0; z-index: -2; overflow: hidden; }
.hero-grid {
  position: absolute; inset: 0;
  background-image: linear-gradient(rgba(255,255,255,.045) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.045) 1px, transparent 1px);
  background-size: 8.33vw 8.33vw;
  mask-image: linear-gradient(to bottom, #000, transparent 78%);
}
.hero-orb { position: absolute; width: 48vw; aspect-ratio: 1; border-radius: 50%; filter: blur(90px); opacity: .16; }
.hero-orb--one { left: -15%; top: 18%; background: #ce5c39; animation: drift 16s ease-in-out infinite alternate; }
.hero-orb--two { right: -20%; top: -18%; background: #5758aa; animation: drift 20s ease-in-out -5s infinite alternate-reverse; }
@keyframes drift { to { transform: translate3d(10vw, 8vh, 0) scale(1.14); } }

.hero-meta,
.hero-foot { display: flex; justify-content: space-between; gap: 20px; color: #8e8e8a; font-size: clamp(.58rem,.72vw,.72rem); letter-spacing: .16em; text-transform: uppercase; }
.hero-copy { position: relative; z-index: 2; margin: auto 0; }
.hero-kicker { margin: 0 0 clamp(18px,3vh,34px); color: var(--exp-accent); font-size: .68rem; letter-spacing: .26em; }
.hero-copy h1 { position: relative; z-index: 2; margin: 0; font-size: clamp(3.5rem,8.15vw,9.2rem); font-weight: 560; line-height: .84; letter-spacing: -.072em; text-transform: uppercase; }
.hero-line { display: block; overflow: hidden; }
.hero-line i { display: block; font-style: normal; transform: translateY(110%); animation: heroLine 1.1s var(--exp-ease) forwards; }
.hero-line:nth-child(2) i { animation-delay: .12s; }
.hero-line:nth-child(3) i { animation-delay: .24s; }
.hero-line--indent { padding-left: 11vw; color: #9d9b96; }
@keyframes heroLine { to { transform: translateY(0); } }

.hero-intro { display: flex; width: min(440px,36vw); margin: clamp(28px,4vh,48px) 0 0 auto; align-items: center; gap: 32px; }
.hero-intro p { margin: 0; color: #a8a7a3; font-size: clamp(.78rem,1vw,.95rem); line-height: 1.75; }
.round-link { display: grid; width: 50px; height: 50px; flex: 0 0 auto; place-items: center; border: 1px solid #575757; border-radius: 50%; transition: .4s var(--exp-ease); }
.round-link:hover { border-color: var(--exp-accent); background: var(--exp-accent); color: #000; transform: rotate(-45deg); }

.hero-collage { position: absolute; inset: 0; z-index: 1; pointer-events: none; }
.hero-tile { position: absolute; overflow: hidden; border-radius: 3px; box-shadow: 0 30px 70px rgba(0,0,0,.45); opacity: 0; animation: tileIn 1.2s .45s var(--exp-ease) forwards; }
.hero-tile img { width: 100%; height: 100%; object-fit: cover; filter: saturate(.65) brightness(.74); }
.hero-tile--a { width: 13vw; aspect-ratio: .78; top: 21%; right: 8%; transform: rotate(4deg); }
.hero-tile--b { width: 10vw; aspect-ratio: .72; bottom: 15%; left: 3%; transform: rotate(-5deg); animation-delay: .62s; }
.hero-tile--c { width: 9vw; aspect-ratio: .8; top: 16%; left: 48%; transform: rotate(3deg); animation-delay: .78s; }
@keyframes tileIn { from { opacity:0; translate: 0 55px; scale:.9; } to { opacity:.72; translate:0; scale:1; } }

.manifesto { padding: clamp(110px,17vw,250px) clamp(24px,7vw,110px); background: var(--exp-paper); color: var(--exp-ink); }
.section-label { display: flex; margin: 0; align-items: center; gap: 18px; font-size: .65rem; letter-spacing: .22em; text-transform: uppercase; }
.section-label span { display:grid; width:30px; height:30px; place-items:center; border:1px solid currentColor; border-radius:50%; letter-spacing:0; }
.manifesto-copy { max-width: 1220px; margin: clamp(70px,9vw,145px) 0; font-size: clamp(2.1rem,5vw,6.2rem); line-height: 1.08; letter-spacing: -.055em; }
.manifesto-copy p { margin: 0; }
.manifesto-copy p:first-child { color: #aaa8a2; }
.manifesto-copy strong { font-weight: 520; text-decoration: underline; text-decoration-thickness: .05em; text-underline-offset: .14em; }
.manifesto-tags { display: flex; flex-wrap: wrap; gap: 10px; }
.manifesto-tags span { padding: 10px 15px; border: 1px solid #aaa8a2; border-radius: 999px; font-size: .6rem; letter-spacing: .13em; }

.featured-cases { padding: clamp(100px,12vw,190px) clamp(22px,5vw,80px); }
.cases-header { display: grid; grid-template-columns: .6fr 1.4fr .7fr; gap: 30px; align-items: end; margin-bottom: clamp(80px,10vw,150px); }
.cases-header h2 { margin: 0; font-size: clamp(4rem,9vw,10rem); line-height: .78; letter-spacing: -.07em; font-weight: 530; }
.cases-intro { max-width: 280px; margin: 0 0 6px; color: #8f8e8b; font-size: .8rem; line-height: 1.75; }

.feature-case { display: grid; grid-template-columns: minmax(0,1.55fr) minmax(290px,.7fr); gap: clamp(32px,6vw,100px); align-items: center; margin: 0 0 clamp(140px,18vw,280px); cursor: pointer; }
.feature-case--benchmark { grid-template-columns: minmax(290px,.7fr) minmax(0,1.55fr); }
.feature-media { position: relative; overflow: hidden; min-height: min(66vw,780px); background:#161616; }
.feature-case--benchmark .feature-media { min-height:min(58vw,700px); }
.feature-media img,.feature-media video { width:100%; height:100%; position:absolute; inset:0; object-fit:cover; transition: transform 1.2s var(--exp-ease), filter .8s ease; }
.feature-case--award .feature-media img { object-position: center; }
.feature-case:hover .feature-media img,.feature-case:hover .feature-media video { transform:scale(1.035); filter:saturate(1.08); }
.case-index,.case-action { position:absolute; z-index:2; top:20px; left:20px; padding:8px 11px; border-radius:999px; background:rgba(8,8,8,.68); backdrop-filter:blur(8px); font-size:.58rem; letter-spacing:.13em; }
.case-action { top:auto; right:20px; bottom:20px; left:auto; background:var(--exp-paper); color:#111; transform:translateY(16px); opacity:0; transition:.45s var(--exp-ease); }
.feature-case:hover .case-action { transform:none; opacity:1; }
.feature-copy>div { display:flex; justify-content:space-between; padding-bottom:16px; border-bottom:1px solid #353535; color:#777; font-size:.58rem; letter-spacing:.15em; }
.feature-copy h3 { margin:40px 0 24px; font-size:clamp(2.6rem,5vw,6rem); line-height:.88; letter-spacing:-.055em; font-weight:560; transition:transform .55s var(--exp-ease); }
.feature-case:hover .feature-copy h3 { transform:translateY(-8px); }
.feature-copy h3 em { color:#777; font-weight:380; }
.feature-copy p { color:#aaa; font-size:clamp(.82rem,1vw,1rem); line-height:1.7; }
.feature-copy ul { display:flex; flex-wrap:wrap; gap:8px; margin:32px 0 0; padding:0; list-style:none; }
.feature-copy li { padding:8px 12px; border:1px solid #3d3d3d; border-radius:999px; color:#999; font-size:.58rem; letter-spacing:.1em; text-transform:uppercase; }

.brand-rail { height: 300vh; background: #d6d2c8; color:#111; }
.rail-sticky { position:sticky; top:0; height:100vh; overflow:hidden; padding:clamp(90px,10vh,120px) 0 32px clamp(22px,5vw,80px); }
.rail-heading { position:absolute; z-index:2; top:clamp(92px,12vh,130px); left:clamp(22px,5vw,80px); width:min(35vw,460px); }
.rail-heading h2 { margin:40px 0 24px; font-size:clamp(3rem,6.4vw,7rem); line-height:.82; letter-spacing:-.065em; font-weight:560; }
.rail-heading>p:last-child { max-width:260px; color:#666; font-size:.75rem; }
.rail-track { display:flex; width:max-content; height:100%; align-items:flex-end; gap:24px; padding-left:min(43vw,600px); will-change:transform; }
.rail-card { position:relative; width:min(49vw,700px); height:73vh; overflow:hidden; flex:0 0 auto; background:#111; color:#fff; cursor:pointer; }
.rail-media { position:absolute; inset:0; overflow:hidden; }
.rail-media::after { position:absolute; inset:0; background:linear-gradient(180deg,transparent 45%,rgba(0,0,0,.8)); content:""; }
.rail-media img { width:100%; height:100%; object-fit:cover; transition:transform 1s var(--exp-ease); }
.rail-card:hover .rail-media img { transform:scale(1.045); }
.rail-card-copy { position:absolute; z-index:2; inset:auto 28px 28px; }
.rail-card-copy span { color:#b8b7b2; font-size:.58rem; letter-spacing:.15em; }
.rail-card-copy h3 { margin:12px 0 2px; font-size:clamp(3rem,6vw,6.5rem); line-height:.9; letter-spacing:-.055em; }
.rail-card-copy p { margin:0; color:#aaa; font-size:.72rem; }
.rail-card-copy b { position:absolute; right:0; bottom:2px; font-size:.58rem; letter-spacing:.12em; }
.rail-card--statement { display:grid; width:min(42vw,580px); place-items:center; background:var(--exp-accent); color:#111; cursor:default; }
.rail-card--statement p { font-size:clamp(2.4rem,4.6vw,5rem); line-height:.92; letter-spacing:-.05em; }
.rail-progress { position:absolute; right:5vw; bottom:24px; left:5vw; height:1px; background:rgba(0,0,0,.18); }
.rail-progress i { display:block; width:0; height:100%; background:#111; }

.project-detail-section { position:relative; padding-top:clamp(110px,11vw,160px); background:#080808; }
.project-detail-section:not([hidden]) { animation:detailIn .8s var(--exp-ease) both; }
@keyframes detailIn { from{opacity:0;transform:translateY(35px)} }
.project-detail-section::before { position:absolute; top:32px; left:50%; width:44px; height:1px; background:#777; content:""; transform:translateX(-50%); }
.case-back-button { position:sticky; z-index:8; top:92px; margin:0 0 30px; padding:10px 14px; border:1px solid #444; border-radius:999px; background:rgba(8,8,8,.78); backdrop-filter:blur(12px); color:#bbb; font-size:.6rem; letter-spacing:.14em; cursor:pointer; transition:.3s ease; }
.case-back-button:hover { border-color:var(--exp-accent); color:var(--exp-accent); }

.reveal { opacity:0; transform:translateY(42px); transition:opacity .9s var(--exp-ease),transform .9s var(--exp-ease); }
.reveal.is-visible { opacity:1; transform:none; }
.image-reveal { clip-path:inset(0 0 100% 0); transition:clip-path 1.15s var(--exp-ease); }
.image-reveal.is-visible { clip-path:inset(0); }

@media (max-width: 900px) {
  .hero-collage { opacity:.6; }
  .hero-tile--a { width:22vw; right:3%; }
  .hero-tile--b { width:17vw; }
  .hero-tile--c { display:none; }
  .cases-header { grid-template-columns:1fr; }
  .cases-header h2 { order:2; }
  .cases-intro { order:3; }
  .feature-case,.feature-case--benchmark { grid-template-columns:1fr; gap:34px; }
  .feature-case--benchmark .feature-copy { order:2; }
  .feature-media,.feature-case--benchmark .feature-media { min-height:68vw; }
  .rail-heading { width:38vw; }
  .rail-track { padding-left:43vw; }
  .rail-card { width:68vw; }
}

@media (max-width: 640px) {
  .site-header { min-height:92px; }
  .nav { gap:22px; }
  .experience-hero { min-height:100svh; padding-top:132px; }
  .hero-meta span:nth-child(2) { display:none; }
  .hero-copy h1 { font-size:clamp(3.1rem,15vw,5.1rem); line-height:.86; }
  .hero-line--indent { padding-left:0; }
  .hero-line:nth-child(3) i { font-size:.62em; white-space:nowrap; }
  .hero-intro { width:80%; margin-left:0; }
  .hero-foot span:nth-child(2) { display:none; }
  .hero-tile--a { width:34vw; top:23%; opacity:.3; }
  .hero-tile--b { width:28vw; bottom:12%; }
  .manifesto { padding-inline:22px; }
  .manifesto-copy { margin:65px 0; font-size:2.35rem; }
  .featured-cases { padding-inline:18px; }
  .cases-header h2 { font-size:4.4rem; }
  .feature-case { margin-bottom:130px; }
  .feature-media,.feature-case--benchmark .feature-media { min-height:108vw; }
  .feature-copy h3 { font-size:3.15rem; }
  .brand-rail { height:auto; }
  .rail-sticky { position:relative; height:auto; padding:100px 18px; overflow:hidden; }
  .rail-heading { position:relative; top:auto; left:auto; width:auto; margin-bottom:60px; }
  .rail-heading h2 { font-size:4rem; }
  .rail-track { width:100%; height:auto; padding:0; flex-direction:column; gap:18px; transform:none !important; }
  .rail-card { width:100%; height:120vw; }
  .rail-card--statement { height:85vw; }
  .rail-progress { display:none; }
  .case-action { opacity:1; transform:none; }
}

@media (prefers-reduced-motion: reduce) {
  *,*::before,*::after { scroll-behavior:auto!important; animation-duration:.01ms!important; animation-iteration-count:1!important; transition-duration:.01ms!important; }
  .reveal { opacity:1; transform:none; }
  .image-reveal { clip-path:none; }
}

/* Simplified continuous case-study layout */
.experience-hero,
.manifesto,
.featured-cases,
.brand-rail,
.works-section,
.project-detail-section,
.gallery-lightbox {
  display: none !important;
}

body {
  background: #f3f2ed;
  color: #141414;
}

.profile-section {
  display: block !important;
  min-height: 0;
  padding: 72px 0 0;
  background: #f5f5f3;
}

.about-screen-image {
  width: 100%;
  height: auto;
  max-height: none;
  object-fit: contain;
}

.simple-cases {
  background: #f3f2ed;
  color: #151515;
}

.simple-cases-header {
  display: grid;
  grid-template-columns: .55fr 1.1fr .7fr;
  gap: clamp(24px, 5vw, 80px);
  align-items: end;
  padding: clamp(90px, 10vw, 150px) clamp(22px, 5vw, 80px);
  border-top: 1px solid #d5d3cd;
}

.simple-cases-header > div {
  display: flex;
  gap: 16px;
  color: #73716c;
  font-size: .68rem;
  letter-spacing: .16em;
}

.simple-cases-header h2 {
  margin: 0;
  font-size: clamp(2.8rem, 5.6vw, 6.4rem);
  font-weight: 520;
  line-height: .95;
  letter-spacing: -.055em;
}

.simple-cases-header > p {
  max-width: 330px;
  margin: 0;
  color: #75736e;
  font-size: .86rem;
  line-height: 1.8;
}

.simple-case {
  padding: clamp(90px, 11vw, 170px) clamp(22px, 5vw, 80px);
  border-top: 1px solid #d5d3cd;
  background: #f3f2ed;
}

.simple-case:nth-of-type(even) { background: #e9e7e0; }

.simple-case-heading {
  display: grid;
  grid-template-columns: .55fr 1.1fr .7fr;
  gap: clamp(24px, 5vw, 80px);
  align-items: end;
  margin-bottom: clamp(38px, 5vw, 72px);
}

.simple-case-heading > div {
  display: flex;
  justify-content: space-between;
  gap: 16px;
  padding-bottom: 10px;
  border-bottom: 1px solid #a9a69e;
  color: #74716b;
  font-size: .62rem;
  letter-spacing: .14em;
}

.simple-case-heading h3 {
  margin: 0;
  font-size: clamp(2.6rem, 5.4vw, 6.2rem);
  font-weight: 540;
  line-height: .9;
  letter-spacing: -.055em;
}

.simple-case-heading h3 em {
  display: block;
  margin-top: 9px;
  color: #87847d;
  font-size: .5em;
  font-weight: 400;
  letter-spacing: -.025em;
}

.simple-case-heading > p {
  max-width: 330px;
  margin: 0 0 7px;
  color: #66645f;
  font-size: .82rem;
  line-height: 1.75;
}

.simple-case-hero {
  position: relative;
  width: 100%;
  aspect-ratio: 16 / 9;
  margin: 0;
  overflow: hidden;
  border-radius: 3px;
  background: #d9d7d0;
}

.simple-case-hero video {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform .9s var(--exp-ease);
}

.simple-case-hero:hover video { transform: scale(1.018); }

.simple-case-hero figcaption {
  position: absolute;
  right: 18px;
  bottom: 18px;
  left: 18px;
  display: flex;
  justify-content: space-between;
  padding: 12px 14px;
  border-radius: 2px;
  background: rgba(246, 245, 240, .86);
  color: #171717;
  font-size: .6rem;
  letter-spacing: .15em;
  backdrop-filter: blur(12px);
  transition: transform .4s var(--exp-ease), background .3s ease;
}

.simple-case-hero:hover figcaption {
  transform: translateY(-5px);
  background: rgba(246, 245, 240, .96);
}

.simple-case-detail { margin-top: clamp(28px, 4vw, 54px); }

.simple-detail-meta {
  display: flex;
  justify-content: space-between;
  gap: 30px;
  align-items: flex-end;
  margin-bottom: 22px;
}

.simple-detail-meta > p {
  max-width: 620px;
  margin: 0;
  color: #67645f;
  font-size: .82rem;
  line-height: 1.75;
}

.simple-detail-meta--controls { justify-content: flex-end; }

.motion-case .simple-case-heading > p span {
  display: block;
  margin-bottom: 7px;
  color: #171717;
  font-size: .62rem;
  font-weight: 700;
  letter-spacing: .14em;
  text-transform: uppercase;
}

.strip-controls { display: flex; gap: 8px; }
.strip-controls button {
  display: grid;
  width: 44px;
  height: 44px;
  place-items: center;
  border: 1px solid #aaa79f;
  border-radius: 50%;
  background: transparent;
  color: #161616;
  cursor: pointer;
  transition: transform .3s var(--exp-ease), background .3s ease, color .3s ease;
}
.strip-controls button:hover {
  background: #181818;
  color: #fff;
  transform: translateX(3px);
}
.strip-controls button:first-child:hover { transform: translateX(-3px); }

.simple-strip {
  display: grid;
  grid-auto-flow: column;
  grid-auto-columns: min(68vw, 880px);
  gap: clamp(12px, 1.8vw, 26px);
  overflow-x: auto;
  padding-bottom: 16px;
  scroll-snap-type: x mandatory;
  scroll-behavior: smooth;
  scrollbar-width: thin;
  scrollbar-color: #777 transparent;
  cursor: grab;
}

.simple-strip.is-dragging { cursor: grabbing; scroll-snap-type: none; }
.simple-strip figure {
  position: relative;
  aspect-ratio: 16 / 10;
  margin: 0;
  overflow: hidden;
  scroll-snap-align: start;
  background: #d6d4ce;
}
.simple-strip img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform .75s var(--exp-ease), filter .5s ease;
}
.simple-strip figure:hover img { transform: scale(1.025); filter: saturate(1.06); }

.contact-section {
  background: #eceae4;
  color: #151515;
  border-top-color: #cfcdc6;
}
.contact-copy p,
.contact-list span { color: #6f6d67; }
.contact-list a { color: #151515; }
.resume-button { border-color: #77736c; color: #151515; }
.resume-button:hover { background: #151515; color: #fff; }
.footer { background: #151515; color: #aaa; }

@media (max-width: 760px) {
  .profile-section { padding-top: 92px; }
  .simple-cases-header,
  .simple-case-heading { grid-template-columns: 1fr; gap: 24px; }
  .simple-cases-header { padding-block: 72px; }
  .simple-cases-header h2 { font-size: 3.25rem; }
  .simple-case { padding: 78px 18px; }
  .simple-case-heading h3 { font-size: 3.2rem; }
  .simple-case-heading h3 em { font-size: .52em; }
  .simple-case-hero { aspect-ratio: 4 / 3; }
  .simple-case-hero figcaption { right: 10px; bottom: 10px; left: 10px; }
  .simple-detail-meta { align-items: center; }
  .simple-detail-meta > p { max-width: 70%; font-size: .75rem; }
  .simple-strip { grid-auto-columns: 86vw; }
}

/* Motion layout: standard showcase + separate original-ratio group */
.motion-case-hero {
  width: 100%;
  aspect-ratio: 16 / 9;
  margin-inline: 0;
}

.motion-strip--standard {
  display: grid;
  grid-auto-columns: min(76vw, 980px);
  align-items: stretch;
}

.motion-strip--standard figure {
  width: auto;
  height: clamp(430px, 58vw, 760px);
  aspect-ratio: auto;
}

.motion-strip--special {
  display: flex;
  align-items: flex-start;
}

.motion-special-group {
  margin-top: clamp(70px, 9vw, 130px);
  padding-top: clamp(38px, 5vw, 70px);
  border-top: 1px solid #aaa79f;
}

@media (max-width: 760px) {
  .motion-case-hero { width: 100%; aspect-ratio: 4 / 3; }
  .motion-strip--standard { grid-auto-columns: 90vw; }
  .motion-strip--standard figure { width: auto; height: min(70vh, 560px); }
}

/* Compact full-width navigation */
.site-header,
.site-header.is-scrolled,
.site-header.is-hidden {
  inset: 0 0 auto;
  grid-template-columns: 46px minmax(0, 1fr);
  width: 100%;
  min-height: 58px;
  padding: 0 clamp(18px, 3vw, 46px);
  box-sizing: border-box;
}

.site-header .brand {
  width: 34px;
  height: 34px;
}

.site-header .brand-mark {
  width: 34px;
  height: 34px;
  font-size: .62rem;
}

.site-header .nav {
  grid-column: 2;
  grid-row: 1;
  justify-content: flex-start;
  gap: clamp(30px, 5vw, 76px);
  padding-left: clamp(18px, 3vw, 48px);
  overflow: visible;
}

.site-header .nav a {
  padding: 21px 0 19px;
  font-size: .64rem;
}

.site-header .nav a::after {
  bottom: 13px;
}

@media (max-width: 640px) {
  .site-header,
  .site-header.is-scrolled,
  .site-header.is-hidden {
    grid-template-columns: 38px minmax(0, 1fr);
    min-height: 54px;
    padding: 0 14px;
  }

  .site-header .brand,
  .site-header .brand-mark {
    width: 30px;
    height: 30px;
  }

  .site-header .nav {
    gap: clamp(16px, 5vw, 28px);
    padding-left: 12px;
  }

  .site-header .nav a {
    padding: 19px 0 17px;
    font-size: .58rem;
    letter-spacing: .12em;
  }

  .site-header .nav a::after {
    bottom: 11px;
  }
}

/* Final polish: complete media, persistent navigation and portrait contact */
.site-header,
.site-header.is-scrolled,
.site-header.is-hidden {
  transform: none !important;
  background: rgba(12, 12, 12, .62);
  backdrop-filter: blur(22px) saturate(125%);
  -webkit-backdrop-filter: blur(22px) saturate(125%);
}

.simple-cases-header { display: none; }

.simple-case:first-of-type { border-top: 0; }

.simple-strip {
  grid-auto-columns: min(76vw, 980px);
  align-items: stretch;
}

.simple-strip figure {
  display: grid;
  height: clamp(430px, 58vw, 760px);
  aspect-ratio: auto;
  place-items: center;
  overflow: hidden;
  background: #e4e2dc;
  transition: transform .45s var(--exp-ease), box-shadow .45s ease;
}

.simple-strip img,
.simple-strip video {
  width: 100%;
  height: 100%;
  object-fit: contain;
  background: #e4e2dc;
  transform: none !important;
  filter: none !important;
}

.simple-strip figure:hover {
  transform: translateY(-5px);
  box-shadow: 0 16px 36px rgba(34, 32, 28, .1);
}

.motion-description {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 18px;
  max-width: 920px;
  margin: 0 0 clamp(34px, 5vw, 66px) auto;
  padding-top: 22px;
  border-top: 1px solid #aaa79f;
}

.motion-description p {
  margin: 0;
  color: #65625c;
  font-size: .82rem;
  line-height: 1.75;
}

.motion-description span {
  display: block;
  margin-bottom: 7px;
  color: #171717;
  font-size: .62rem;
  font-weight: 700;
  letter-spacing: .14em;
  text-transform: uppercase;
}

.motion-case-hero figcaption {
  top: 18px;
  bottom: auto;
}

.motion-case-hero {
  width: min(100%, 640px);
  aspect-ratio: 1446 / 2560;
  margin-inline: auto;
  background: #181818;
}

.motion-case-hero video {
  object-fit: contain;
  background: #181818;
}

.motion-strip {
  display: flex;
  align-items: flex-start;
}

.motion-strip figure {
  position: relative;
  width: auto;
  height: clamp(480px, 58vw, 720px);
  aspect-ratio: var(--media-ratio);
  flex: 0 0 auto;
  padding: 42px 18px 18px;
  background: #1b1b1b;
}

.motion-strip video {
  background: #1b1b1b;
}

.motion-strip figcaption {
  position: absolute;
  top: 13px;
  left: 18px;
  z-index: 2;
  color: rgba(255,255,255,.78);
  font-size: .6rem;
  letter-spacing: .13em;
  pointer-events: none;
}

.contact-section {
  position: relative;
  grid-template-columns: minmax(360px, .9fr) minmax(420px, 1.1fr);
  grid-template-areas:
    "portrait copy"
    "portrait resume";
  gap: 28px clamp(50px, 8vw, 130px);
  min-height: min(860px, 92vh);
  padding: clamp(70px, 7vw, 110px) clamp(24px, 5vw, 76px);
  align-items: center;
}

.contact-section .section-number {
  position: absolute;
  top: clamp(42px, 5vw, 76px);
  left: clamp(24px, 5vw, 76px);
  z-index: 2;
  color: rgba(255,255,255,.88);
}

.contact-portrait {
  position: relative;
  grid-area: portrait;
  height: min(680px, 72vh);
  overflow: hidden;
  background: #1a1b1c;
  isolation: isolate;
}

.contact-portrait img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: 50% 34%;
  filter: saturate(.86) contrast(1.04);
}

.portrait-grid {
  position: absolute;
  inset: 0;
  z-index: 2;
  background:
    linear-gradient(90deg, transparent 33%, rgba(243,242,237,.92) 33%, rgba(243,242,237,.92) calc(33% + 5px), transparent calc(33% + 5px), transparent 68%, rgba(243,242,237,.92) 68%, rgba(243,242,237,.92) calc(68% + 5px), transparent calc(68% + 5px)),
    linear-gradient(transparent 28%, rgba(243,242,237,.92) 28%, rgba(243,242,237,.92) calc(28% + 5px), transparent calc(28% + 5px), transparent 64%, rgba(243,242,237,.92) 64%, rgba(243,242,237,.92) calc(64% + 5px), transparent calc(64% + 5px));
  pointer-events: none;
}

.contact-portrait::after {
  position: absolute;
  z-index: 1;
  right: 0;
  bottom: 0;
  width: 32%;
  height: 35%;
  background: rgba(226, 30, 58, .48);
  mix-blend-mode: screen;
  content: "";
}

.contact-portrait p {
  position: absolute;
  z-index: 3;
  right: 22px;
  bottom: 20px;
  margin: 0;
  color: #fff;
  font-size: clamp(1.25rem, 2.2vw, 2.2rem);
  font-weight: 760;
  line-height: .92;
  letter-spacing: -.035em;
  text-align: right;
}

.contact-portrait--graphic { background: transparent; }
.contact-portrait--graphic::after { display: none; }
.contact-portrait--graphic img {
  object-fit: contain;
  object-position: center;
  background: transparent;
  filter: none;
}

.contact-copy { grid-area: copy; align-self: end; }
.contact-copy h2 { font-size: clamp(2.6rem, 5.4vw, 6.2rem); letter-spacing: -.055em; }
.resume-button { grid-area: resume; align-self: start; justify-self: start; }

@media (max-width: 900px) {
  .contact-section {
    grid-template-columns: minmax(260px, .85fr) minmax(330px, 1.15fr);
    gap: 24px 36px;
  }
}

@media (max-width: 760px) {
  .simple-case:first-of-type { padding-top: 74px; }
  .simple-strip { grid-auto-columns: 90vw; }
  .simple-strip figure { height: min(70vh, 560px); }

  .contact-section {
    grid-template-columns: 1fr;
    grid-template-areas:
      "portrait"
      "copy"
      "resume";
    min-height: 0;
    gap: 36px;
    padding: 72px 18px;
  }
  .contact-section .section-number { top: 88px; left: 34px; }
  .contact-portrait { height: 116vw; max-height: 620px; }
  .contact-copy { align-self: auto; }
  .contact-copy h2 { font-size: clamp(2.7rem, 13vw, 4.5rem); }
  .motion-description { grid-template-columns: 1fr; margin-left: 0; }
  .motion-case-hero figcaption { top: 10px; }
  .motion-case-hero { width: min(100%, 430px); }
  .motion-strip figure {
    width: auto;
    height: min(70vh, 560px);
    padding: 38px 10px 10px;
  }
}

/* Final motion grouping overrides */
.motion-case-hero {
  width: 100%;
  aspect-ratio: 16 / 9;
  margin-inline: 0;
}

.motion-strip--standard {
  display: grid;
  grid-auto-columns: min(76vw, 980px);
  align-items: stretch;
}

.motion-strip--standard figure {
  width: auto;
  height: clamp(430px, 58vw, 760px);
  aspect-ratio: auto;
}

.motion-strip--special {
  display: flex;
  align-items: flex-start;
}

.motion-special-group {
  margin-top: clamp(70px, 9vw, 130px);
  padding-top: clamp(38px, 5vw, 70px);
  border-top: 1px solid #aaa79f;
}

@media (max-width: 760px) {
  .motion-case-hero { width: 100%; aspect-ratio: 4 / 3; }
  .motion-strip--standard { grid-auto-columns: 90vw; }
  .motion-strip--standard figure { width: auto; height: min(70vh, 560px); }
}