:root {
  --oz-ink:#090a0d;
  --oz-paper:#eef0ef;
  --oz-copy:#50565c;
  --oz-cyan:#47c8d3;
  --oz-orange:#ef6b43;
  --oz-line:rgba(255,255,255,.18);
}

.oitzmann-case {
  overflow-x:hidden;
  background:var(--oz-ink);
  color:#fff;
}

.oitzmann-case .button,
.oitzmann-case .menu-toggle {
  border-color:#fff;
  background:#fff;
  color:var(--oz-ink);
}

.oitzmann-case .menu-toggle span { background:var(--oz-ink); }
.oitzmann-case .button:hover { border-color:var(--oz-cyan); background:var(--oz-cyan); }

.oz-shell { width:min(1540px,calc(100% - 96px)); margin-inline:auto; }
.oz-section { padding:clamp(104px,9vw,174px) 0; }
.oz-eyebrow { margin:0; font-size:10px; font-weight:700; letter-spacing:.16em; line-height:1.3; text-transform:uppercase; }

.oz-heading-grid {
  display:grid;
  grid-template-columns:.5fr 2fr 1fr;
  gap:4vw;
  align-items:start;
}

.oz-heading-grid h2 {
  margin:0;
  font:400 clamp(62px,6.2vw,118px)/.9 "Lebowski GB Preview","Helvetica Neue",Arial,sans-serif;
  letter-spacing:-.052em;
}

.oz-copy { max-width:570px; color:rgba(255,255,255,.68); }
.oz-copy p { margin:0; font-size:clamp(17px,1.08vw,21px); line-height:1.52; }
.oz-copy p+p { margin-top:1em; }

.oz-hero {
  position:relative;
  min-height:calc(100svh - var(--header-h));
  overflow:hidden;
  isolation:isolate;
  background:#0c0e12;
}

.oz-hero__image {
  position:absolute;
  z-index:-2;
  inset:0;
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center;
}

.oz-hero__shade {
  position:absolute;
  z-index:-1;
  inset:0;
  background:linear-gradient(90deg,rgba(4,5,7,.86),rgba(4,5,7,.26) 47%,rgba(4,5,7,.24)),linear-gradient(0deg,rgba(4,5,7,.72),transparent 54%);
}

.oz-hero__meta {
  position:absolute;
  top:28px;
  right:var(--gutter);
  left:var(--gutter);
  display:flex;
  justify-content:space-between;
  color:rgba(255,255,255,.55);
  font-size:9px;
  letter-spacing:.16em;
  text-transform:uppercase;
}

.oz-hero__copy {
  position:absolute;
  z-index:2;
  bottom:9vh;
  left:var(--gutter);
  width:min(48vw,800px);
}

.oz-logo { display:block; width:min(32vw,510px); height:auto; margin-bottom:42px; }

.oz-hero h1 {
  margin:0 0 28px;
  font:400 clamp(78px,8vw,150px)/.83 "Lebowski GB Preview","Helvetica Neue",Arial,sans-serif;
  letter-spacing:-.055em;
}

.oz-hero__copy p {
  width:min(550px,90%);
  margin:0;
  color:rgba(255,255,255,.76);
  font-size:clamp(17px,1.12vw,22px);
  line-height:1.48;
}

.oz-hero__scroll {
  position:absolute;
  right:var(--gutter);
  bottom:24px;
  color:rgba(255,255,255,.58);
  font-size:9px;
  letter-spacing:.14em;
  text-decoration:none;
  text-transform:uppercase;
}

.oz-brief { background:var(--oz-paper); color:#15191d; }

.oz-brief__grid {
  display:grid;
  grid-template-columns:1.2fr .8fr .8fr;
  gap:clamp(36px,5vw,92px);
  align-items:start;
}

.oz-brief__grid>.oz-eyebrow { grid-column:1/-1; color:#737a7f; }

.oz-brief h2 {
  margin:0;
  max-width:620px;
  font:400 clamp(44px,4vw,76px)/.98 "Lebowski GB Preview","Helvetica Neue",Arial,sans-serif;
  letter-spacing:-.042em;
}

.oz-brief .oz-copy { color:var(--oz-copy); }
.oz-brief .oz-copy p { font-size:clamp(16px,1vw,20px); }

.oz-wordmark {
  display:grid;
  min-height:clamp(290px,27vw,480px);
  margin-top:clamp(96px,10vw,178px);
  place-items:center;
  border-top:1px solid rgba(21,25,29,.18);
  border-bottom:1px solid rgba(21,25,29,.18);
}

.oz-wordmark img { display:block; width:min(54vw,760px); height:auto; filter:invert(1); }

.oz-website { background:#0b0c10; }
.oz-website .oz-copy { color:rgba(255,255,255,.63); }

.oz-site-link {
  display:inline-flex;
  align-items:center;
  gap:16px;
  margin-top:34px;
  padding:14px 18px;
  border:1px solid rgba(255,255,255,.36);
  border-radius:999px;
  color:#fff;
  font-size:14px;
  text-decoration:none;
  transition:background-color .25s ease,color .25s ease;
}

.oz-site-link:hover { background:#fff; color:#101216; }

.oz-live-site {
  overflow:hidden;
  margin-top:clamp(74px,8vw,132px);
  border:1px solid rgba(255,255,255,.2);
  border-radius:22px;
  background:#15181d;
  box-shadow:0 36px 110px rgba(0,0,0,.46);
}

.oz-browser-bar {
  display:grid;
  grid-template-columns:auto 1fr auto;
  align-items:center;
  min-height:56px;
  padding:0 18px;
  border-bottom:1px solid rgba(255,255,255,.12);
  background:#15181d;
}

.oz-browser-dots { display:flex; gap:7px; }
.oz-browser-dots i { width:8px; height:8px; border-radius:50%; background:#626b72; }
.oz-browser-dots i:nth-child(2) { opacity:.72; }
.oz-browser-dots i:nth-child(3) { opacity:.5; }

.oz-browser-tabs {
  display:flex;
  justify-content:center;
  gap:6px;
  padding:8px 24px;
  overflow-x:auto;
  scrollbar-width:none;
}

.oz-browser-tabs::-webkit-scrollbar { display:none; }

.oz-browser-tabs button {
  flex:0 0 auto;
  padding:7px 12px;
  border:0;
  border-radius:999px;
  color:rgba(255,255,255,.55);
  background:transparent;
  font:500 11px/1.2 "Helvetica Neue",Arial,sans-serif;
  cursor:pointer;
  transition:color .2s ease,background-color .2s ease;
}

.oz-browser-tabs button:hover { color:#fff; }
.oz-browser-tabs button.is-active { color:#101216; background:#e2e5e7; }
.oz-browser-open { color:#fff; font-size:16px; text-decoration:none; }

.oz-live-site__viewport {
  position:relative;
  height:clamp(620px,54vw,870px);
  overflow:hidden;
  background:#090a0d;
}

.oz-live-site__fallback {
  position:absolute;
  inset:0;
  display:grid;
  place-items:center;
  overflow:hidden;
  background:#090a0d;
}

.oz-live-site__fallback::after { content:""; position:absolute; inset:0; background:rgba(9,10,13,.48); }

.oz-live-site__fallback img { width:100%; height:100%; object-fit:cover; opacity:.72; }

.oz-live-site__fallback span {
  position:absolute;
  z-index:1;
  padding:11px 14px;
  border:1px solid rgba(255,255,255,.28);
  border-radius:999px;
  color:#fff;
  background:rgba(9,10,13,.62);
  font-size:11px;
  letter-spacing:.08em;
  text-transform:uppercase;
}

.oz-live-site iframe {
  position:relative;
  z-index:2;
  display:block;
  width:100%;
  height:100%;
  border:0;
  opacity:0;
  background:#e2e5e7;
  transition:opacity .35s ease;
}

.oz-live-site.is-loaded iframe { opacity:1; }

.oz-live-note {
  margin-top:16px;
  color:rgba(255,255,255,.44);
  font-size:10px;
  letter-spacing:.1em;
  text-transform:uppercase;
}

.oz-songs {
  position:relative;
  background:radial-gradient(circle at 50% 18%,#222832 0,transparent 34%),#090a0d;
}

.oz-songs::before {
  content:"";
  position:absolute;
  inset:0;
  opacity:.18;
  background-image:radial-gradient(circle,rgba(255,255,255,.85) 0 1px,transparent 1.35px);
  background-size:38px 38px;
  pointer-events:none;
}

.oz-songs>* { position:relative; }

.oz-song-grid {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:1px;
  width:min(1760px,calc(100% - 48px));
  margin:clamp(76px,8vw,136px) auto 0;
  background:rgba(255,255,255,.18);
}

.oz-song-card { min-width:0; background:#111; color:#fff; }

.oz-song-card__header {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:24px;
  padding:18px 22px;
  border-bottom:1px solid currentColor;
  color:inherit;
  font-size:9px;
  letter-spacing:.13em;
  text-transform:uppercase;
}

.oz-song-card__header a { color:inherit; opacity:.62; text-decoration:none; transition:opacity .2s ease; }
.oz-song-card__header a:hover { opacity:1; }

.oz-song-card__motion {
  display:grid;
  min-height:clamp(470px,36vw,640px);
  place-items:center;
  overflow:hidden;
}

.oz-song-card__copy { padding:30px 22px 34px; border-top:1px solid currentColor; }

.oz-song-card__copy h3 {
  margin:0 0 14px;
  font:400 clamp(50px,4.6vw,82px)/.9 "Lebowski GB Preview","Helvetica Neue",Arial,sans-serif;
  letter-spacing:-.045em;
}

.oz-song-card__copy p { max-width:580px; margin:0; color:currentColor; opacity:.65; font-size:15px; line-height:1.5; }

.oz-song-card--twined { color:#5a6065; background:#e2e5e7; }
.oz-song-card--mysli { background-color:#17191f; background-image:radial-gradient(circle,rgba(255,255,255,.17) 0 1px,transparent 1.3px); background-size:30px 30px; }
.oz-song-card--stranger { color:#d3d7d9; background-color:#4e595f; background-image:radial-gradient(circle,rgba(255,255,255,.13) 0 1px,transparent 1.3px); background-size:30px 30px; }
.oz-song-card--fly { background:#17141b; }

.oz-motion { position:relative; width:min(72%,430px); aspect-ratio:1; }
.oz-motion img { display:block; pointer-events:none; user-select:none; }

.oz-motion--twined img { position:absolute; height:auto; animation-play-state:paused!important; }
.oz-motion--twined img:nth-child(1) { z-index:5; top:25%; left:12.5%; width:69%; animation:oz-rot1 6s infinite linear; }
.oz-motion--twined img:nth-child(2) { z-index:4; top:19.25%; left:7.25%; width:79.25%; animation:oz-rot2 6s infinite linear; }
.oz-motion--twined img:nth-child(3) { z-index:4; top:26.5%; left:3%; width:77.5%; animation:oz-rot3 6s infinite linear; }
.oz-motion--twined img:nth-child(4) { z-index:2; top:7%; left:-2.5%; width:99.75%; animation:oz-rot4 6s infinite linear; }
.oz-motion--twined img:nth-child(5) { z-index:1; top:15%; left:0; width:97.5%; animation:oz-rot5 8s infinite linear; }
.oz-motion--twined img:nth-child(6) { z-index:6; bottom:-12.5%; left:-7.5%; width:82.75%; animation:oz-rot 12s infinite linear; }

.oz-motion--mysli img { position:absolute; inset:0; width:100%; height:auto; animation-play-state:paused!important; }
.oz-motion--mysli img:nth-child(odd) { animation:oz-turn-right 25s infinite linear; }
.oz-motion--mysli img:nth-child(even) { animation:oz-turn-left 25s infinite linear; }
.oz-motion--mysli img:nth-child(10),
.oz-motion--mysli img:nth-child(11),
.oz-motion--mysli img:nth-child(12) { animation-duration:29s; }
.oz-motion--mysli img:nth-child(13) { animation:oz-turn-left 29s infinite linear; }

.oz-motion--stranger { overflow:hidden; border-radius:50%; }

.oz-motion--stranger::after {
  content:"";
  position:absolute;
  inset:0;
  border:1px solid rgba(255,255,255,.1);
  border-radius:inherit;
}

.oz-motion--stranger i {
  position:absolute;
  top:-70%;
  left:var(--x);
  width:1px;
  height:var(--len);
  background:rgba(235,239,241,.74);
  transform:rotate(26deg);
  transform-origin:50% 100%;
  animation:oz-rain-fall var(--d) var(--delay) infinite linear;
  animation-play-state:paused;
}

.oz-motion--fly img { position:absolute; height:auto; max-width:100%; animation-play-state:paused!important; }
.oz-motion--fly img:nth-child(1) { z-index:5; top:10%; right:0; width:49.75%; animation:oz-float 20s infinite linear; }
.oz-motion--fly img:nth-child(2) { z-index:5; top:50%; left:50%; width:100%; transform:translate(-50%,-50%); }
.oz-motion--fly img:nth-child(3) { z-index:2; top:50%; left:50%; width:100%; transform:translate(-50%,-50%); animation:oz-fly-orbit 30s infinite linear; }
.oz-motion--fly img:nth-child(4) { z-index:1; top:50%; left:50%; width:100%; transform:translate(-50%,-50%); }

.oz-song-card.is-playing .oz-motion img,
.oz-song-card.is-playing .oz-motion i { animation-play-state:running!important; }

@keyframes oz-rot { to { transform:rotate(360deg); } }
@keyframes oz-rot1 { from { transform:rotate(0) translate(-5px); } to { transform:rotate(360deg) translate(-5px); } }
@keyframes oz-rot2 { from { transform:rotate(0) translate(5px); } to { transform:rotate(-360deg) translate(5px); } }
@keyframes oz-rot3 { from { transform:rotate(0) translate(-15px); } to { transform:rotate(360deg) translate(-15px); } }
@keyframes oz-rot4 { from { transform:rotate(0) translate(15px); } to { transform:rotate(-360deg) translate(15px); } }
@keyframes oz-rot5 { from { transform:rotate(0) translate(8px); } to { transform:rotate(360deg) translate(8px); } }
@keyframes oz-turn-right { to { transform:rotate(360deg); } }
@keyframes oz-turn-left { to { transform:rotate(-360deg); } }
@keyframes oz-rain-fall { from { translate:0 -30%; } to { translate:-210% 520%; } }
@keyframes oz-float { 0%,100% { transform:translate(0,0); } 25% { transform:translate(-14%,-16%); } 75% { transform:translate(5%,24%); } }
@keyframes oz-fly-orbit { from { transform:translate(-50%,-50%) rotate(0); } to { transform:translate(-50%,-50%) rotate(360deg); } }

.oz-system { background:#e4e7e8; color:#182026; }
.oz-system .oz-copy { color:rgba(24,32,38,.66); }

.oz-application-grid {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:2px;
  margin-top:clamp(76px,8vw,136px);
}

.oz-application-grid figure { margin:0; min-width:0; background:#0d0f13; }
.oz-application-grid__wide { grid-column:1/-1; }
.oz-application-grid img { display:block; width:100%; height:auto; }

.oz-application-grid figcaption {
  padding:11px 12px 14px;
  color:rgba(255,255,255,.52);
  background:#0d0f13;
  font-size:9px;
  letter-spacing:.13em;
  text-transform:uppercase;
}

.oz-result {
  display:grid;
  grid-template-columns:.5fr 2fr 1fr;
  gap:4vw;
  align-items:start;
  margin-top:clamp(88px,9vw,148px);
  padding-top:30px;
  border-top:1px solid rgba(24,32,38,.25);
}

.oz-result>p:nth-child(2) {
  max-width:940px;
  margin:0;
  font:400 clamp(44px,4.3vw,82px)/.96 "Lebowski GB Preview","Helvetica Neue",Arial,sans-serif;
  letter-spacing:-.045em;
}

.oz-result ul { margin:0; padding:0; border-top:1px solid rgba(24,32,38,.25); list-style:none; }
.oz-result li { padding:14px 0; border-bottom:1px solid rgba(24,32,38,.25); color:rgba(24,32,38,.72); font-size:14px; }

.oz-contact { background:#0d0e12; }
.oz-contact .gradient-text { --text-gradient:linear-gradient(105deg,#fff 0%,#6ed3db 48%,#ef6b43 100%); }
.oz-contact .contact__main .oz-eyebrow { margin-bottom:40px; color:rgba(255,255,255,.64); }

.js [data-reveal] { opacity:0; transform:translateY(24px); transition:opacity .72s ease,transform .72s ease; }
.js [data-reveal].is-visible { opacity:1; transform:none; }

@media (max-width:1100px) {
  .oz-song-card__motion { min-height:470px; }
  .oz-motion { width:min(76%,380px); }
}

@media (max-width:900px) {
  .oz-shell { width:calc(100% - 40px); }
  .oz-section { padding:88px 0; }
  .oz-heading-grid,
  .oz-brief__grid,
  .oz-result { grid-template-columns:1fr; gap:24px; }
  .oz-heading-grid h2 { font-size:clamp(54px,15.5vw,84px); }
  .oz-brief__grid>.oz-eyebrow { grid-column:auto; }
  .oz-brief h2 { font-size:clamp(48px,12vw,70px); }
  .oz-brief__second { margin-top:4px; }
  .oz-wordmark { min-height:260px; margin-top:80px; }
  .oz-wordmark img { width:min(76vw,620px); }
  .oz-hero { min-height:760px; }
  .oz-hero__image { object-position:62% center; }
  .oz-hero__shade { background:linear-gradient(0deg,rgba(4,5,7,.94) 0 20%,rgba(4,5,7,.08) 72%),linear-gradient(90deg,rgba(4,5,7,.3),transparent); }
  .oz-hero__meta { top:22px; right:20px; left:20px; }
  .oz-hero__meta span:last-child { display:none; }
  .oz-hero__copy { right:20px; bottom:46px; left:20px; width:calc(100% - 40px); }
  .oz-logo { width:min(62vw,390px); margin-bottom:24px; }
  .oz-hero h1 { max-width:100%; margin-bottom:20px; font-size:clamp(52px,14vw,78px); }
  .oz-hero__copy p { width:100%; max-width:510px; font-size:15px; }
  .oz-hero__scroll { display:none; }
  .oz-live-site { width:calc(100% - 24px); border-radius:14px; }
  .oz-browser-bar { padding:0 12px; }
  .oz-browser-tabs { justify-content:flex-start; padding-inline:12px; }
  .oz-live-site__viewport { height:640px; }
  .oz-live-note { width:calc(100% - 24px); }
  .oz-song-grid { grid-template-columns:1fr; width:calc(100% - 24px); margin-top:60px; }
  .oz-song-card__motion { min-height:clamp(390px,90vw,560px); }
  .oz-motion { width:min(76vw,420px); }
  .oz-song-card__copy h3 { font-size:clamp(54px,14vw,78px); }
  .oz-application-grid { width:calc(100% - 24px); grid-template-columns:1fr; gap:2px; margin-top:60px; }
  .oz-application-grid__wide { grid-column:auto; }
  .oz-result { margin-top:72px; }
}

@media (max-width:560px) {
  .oz-hero { min-height:calc(100svh - var(--header-h)); }
  .oz-browser-dots { display:none; }
  .oz-browser-bar { grid-template-columns:1fr; }
  .oz-browser-tabs { padding-inline:0; }
  .oz-browser-open { display:none; }
  .oz-live-site__viewport { height:590px; }
  .oz-song-card__header { align-items:flex-start; flex-direction:column; gap:8px; }
  .oz-song-card__motion { min-height:360px; }
  .oz-motion { width:min(82vw,360px); }
  .oz-song-card__copy { padding:25px 18px 30px; }
}

@media (prefers-reduced-motion:reduce) {
  .js [data-reveal] { opacity:1; transform:none; transition:none; }
  .oz-motion img,
  .oz-motion i { animation-play-state:paused!important; }
}
