:root{
  --black:#050505;
  --ink:#101010;
  --white:#f5f4ef;
  --grey:#a7a7a3;
  --line:rgba(255,255,255,.15);
  --orange:#ff5a00;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;background:var(--black);color:var(--white);
  font-family:Inter,Arial,sans-serif;overflow-x:hidden
}
a{color:inherit;text-decoration:none}
img{display:block;width:100%}
.noise{
  position:fixed;inset:0;z-index:100;pointer-events:none;opacity:.055;
  background-image:radial-gradient(rgba(255,255,255,.9) .45px,transparent .45px);
  background-size:4px 4px;mix-blend-mode:screen
}
.topbar{
  position:fixed;z-index:30;left:0;right:0;top:0;
  display:flex;align-items:center;justify-content:space-between;
  padding:22px 34px;
  background:linear-gradient(to bottom,rgba(5,5,5,.88),rgba(5,5,5,0));
}
.brand{
  display:flex;align-items:center;gap:10px;font-weight:800;font-size:12px;
  letter-spacing:.16em
}
.brand-dot{width:9px;height:9px;border-radius:50%;background:var(--orange);box-shadow:0 0 18px rgba(255,90,0,.75)}
nav{display:flex;gap:26px}
nav a{font-size:11px;text-transform:uppercase;letter-spacing:.16em;color:#d3d3ce}
nav a:hover{color:var(--orange)}
.hero{
  height:min(100vh,980px);min-height:680px;position:relative;isolation:isolate;overflow:hidden
}
.hero-image{
  position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center 48%;z-index:-3;
  filter:contrast(1.04)
}
.hero-shade{
  position:absolute;inset:0;z-index:-2;
  background:
    linear-gradient(90deg,rgba(0,0,0,.88) 0%,rgba(0,0,0,.50) 35%,rgba(0,0,0,.05) 62%,rgba(0,0,0,.22) 100%),
    linear-gradient(0deg,rgba(0,0,0,.72) 0%,transparent 35%)
}
.hero-copy{
  height:100%;display:flex;flex-direction:column;justify-content:center;
  padding:110px 7vw 70px;max-width:790px
}
.micro,.section-label{
  color:var(--orange);font-size:10px;font-weight:800;letter-spacing:.23em;text-transform:uppercase
}
.hero h1{
  font-family:"Permanent Marker",sans-serif;
  font-size:clamp(5.5rem,11.5vw,10.7rem);line-height:.78;letter-spacing:-.06em;
  margin:28px 0 28px;text-shadow:0 8px 35px rgba(0,0,0,.45)
}
.hero h1 span{-webkit-text-stroke:2px var(--white);color:transparent}
.hero p{max-width:570px;color:#d7d7d2;line-height:1.7;font-size:14px;margin:0 0 33px}
.cta{
  align-self:flex-start;display:inline-flex;gap:20px;align-items:center;border-bottom:1px solid rgba(255,255,255,.55);
  font-size:11px;letter-spacing:.16em;font-weight:700;padding-bottom:8px
}
.cta span{color:var(--orange);font-size:18px}
.hero-index{
  position:absolute;right:34px;bottom:28px;font-size:10px;letter-spacing:.18em;color:#ddd
}
.statement,.world,.contact{padding:110px 7vw}
.statement{background:var(--white);color:var(--ink)}
.statement .section-label{margin-bottom:38px}
.statement-grid{
  display:grid;grid-template-columns:minmax(0,1.15fr) minmax(280px,.85fr);gap:8vw;align-items:end
}
.statement h2,.split-copy h2,.world h2,.contact h2{
  margin:0;font-size:clamp(3rem,6.4vw,7rem);line-height:.92;letter-spacing:-.06em;font-weight:800
}
.statement-copy{max-width:520px}
.statement-copy p{color:#4f4f4b;line-height:1.9;font-size:14px;margin:0 0 18px}
.split-feature{
  display:grid;grid-template-columns:1fr .62fr 1fr;min-height:820px;border-top:1px solid var(--line);border-bottom:1px solid var(--line)
}
.panel{margin:0;overflow:hidden;min-height:820px}
.panel img{height:100%;object-fit:cover}
.split-copy{
  padding:70px 44px;display:flex;flex-direction:column;justify-content:center;background:#080808
}
.split-copy h2{margin:28px 0 28px}
.split-copy p{color:var(--grey);line-height:1.8;font-size:14px}
.accent-line{width:54px;height:4px;background:var(--orange);margin-top:30px}
.world{padding-bottom:120px}
.world-head{
  display:flex;align-items:end;justify-content:space-between;gap:60px;margin-bottom:54px
}
.world h2{text-align:right}
.world h2 span{color:var(--orange)}
.mosaic{
  display:grid;grid-template-columns:1.35fr .65fr;grid-template-rows:auto auto;gap:16px
}
.mosaic figure{margin:0;overflow:hidden;background:#111}
.mosaic-main{grid-row:1 / span 2}
.mosaic-main img{height:100%;object-fit:cover}
.mosaic-side{min-height:430px}
.mosaic-side img{height:100%;object-fit:cover}
.mosaic-side.dark img{object-position:center}
.quote{
  padding:120px 7vw 135px;background:var(--white);color:var(--ink);text-align:center
}
.quote-mark{font-family:Georgia,serif;color:var(--orange);font-size:80px;line-height:.5}
.quote p{
  margin:32px auto 40px;max-width:1000px;font-size:clamp(2.3rem,5vw,5.2rem);font-weight:800;line-height:1.03;letter-spacing:-.045em
}
.quote-rule{height:1px;background:#bbb;max-width:480px;margin:auto}
.final-image{
  position:relative;height:48vw;min-height:360px;max-height:700px;overflow:hidden
}
.final-image img{width:100%;height:100%;object-fit:cover}
.final-image:after{
  content:"";position:absolute;inset:0;background:linear-gradient(0deg,rgba(0,0,0,.74),transparent 55%)
}
.final-overlay{position:absolute;z-index:2;left:7vw;bottom:55px}
.final-overlay h2{
  margin:12px 0 0;font-family:"Permanent Marker",sans-serif;
  font-size:clamp(3.5rem,8vw,8rem);letter-spacing:-.05em
}
.contact{
  display:grid;grid-template-columns:1fr .8fr;gap:70px;align-items:end;border-top:1px solid var(--line)
}
.contact .section-label{margin-bottom:28px}
.contact-right{display:flex;flex-direction:column;gap:20px;align-items:flex-start;padding-bottom:10px}
.contact-right a{font-size:18px;border-bottom:1px solid #777;padding-bottom:6px}
.contact-right a:hover{color:var(--orange)}
.contact-right span{color:var(--grey);font-size:12px;letter-spacing:.12em}
footer{
  padding:26px 34px 34px;border-top:1px solid var(--line);display:flex;justify-content:space-between;gap:24px;
  color:#777;font-size:10px;letter-spacing:.15em
}
@media(max-width:950px){
  .split-feature{grid-template-columns:1fr 1fr}
  .split-copy{grid-column:1/-1;grid-row:1;padding:80px 7vw}
  .panel{min-height:650px}
  .statement-grid,.contact{grid-template-columns:1fr;gap:52px}
  .world-head{display:block}
  .world h2{text-align:left;margin-top:24px}
}
@media(max-width:650px){
  .topbar{padding:18px 18px}
  nav{gap:14px} nav a:nth-child(2){display:none}
  .hero{min-height:720px}
  .hero-copy{padding:110px 20px 58px;justify-content:flex-end}
  .hero h1{font-size:clamp(4.6rem,24vw,7rem)}
  .hero-shade{
    background:linear-gradient(0deg,rgba(0,0,0,.92) 0%,rgba(0,0,0,.28) 70%,rgba(0,0,0,.22) 100%)
  }
  .statement,.world,.contact,.quote{padding-left:20px;padding-right:20px}
  .split-feature{grid-template-columns:1fr}
  .split-copy{grid-column:1;grid-row:auto;padding:70px 20px}
  .panel{min-height:520px}
  .mosaic{grid-template-columns:1fr}
  .mosaic-main{grid-row:auto}
  .mosaic-side{min-height:520px}
  .final-image{height:70vh}
  footer{padding-left:20px;padding-right:20px;flex-direction:column}
}