:root{
  --white:#f7f5ef;
  --black:#121211;
  --footer-height:76px;
}
*{box-sizing:border-box}
html,body{margin:0;min-height:100%;background:var(--black)}
body{font-family:Arial,Helvetica,sans-serif;color:var(--white);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
a{color:inherit;text-decoration:none}
.landing-shell{
  min-height:100svh;
  display:grid;
  grid-template-columns:1fr 1fr;
  grid-template-rows:1fr var(--footer-height);
  position:relative;
  overflow:hidden;
  background:#111;
}
.split-panel{
  grid-row:1;
  min-width:0;
  position:relative;
  overflow:hidden;
  isolation:isolate;
}
.music-panel{grid-column:1}
.fashion-panel{grid-column:2}
.panel-image{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:cover;
  z-index:-3;
}
.music-image{
  object-position:50% 46%;
  filter:saturate(.92) contrast(1.04) brightness(.86);
  transform:scale(1.012);
}
.fashion-image{
  object-position:center 45%;
  filter:saturate(.88) contrast(1.02) brightness(.92);
  transform:scale(1.012);
}
.panel-shade{
  position:absolute;
  inset:0;
  z-index:-2;
  background:linear-gradient(to bottom,rgba(8,8,7,.08) 10%,rgba(8,8,7,.04) 42%,rgba(8,8,7,.54) 100%);
}
.music-panel .panel-shade{background:linear-gradient(to bottom,rgba(9,7,5,.10) 8%,rgba(8,7,5,.05) 42%,rgba(7,6,5,.58) 100%)}
.fashion-panel .panel-shade{background:linear-gradient(to bottom,rgba(14,12,10,.04) 8%,rgba(14,12,10,.02) 48%,rgba(12,10,9,.50) 100%)}
.landing-brand{
  position:absolute;
  z-index:4;
  left:50%;
  top:31px;
  width:min(900px,88vw);
  transform:translateX(-50%);
  text-align:center;
  text-shadow:0 1px 14px rgba(0,0,0,.42);
  pointer-events:none;
}
.landing-location{
  margin:0 0 13px;
  text-transform:uppercase;
  letter-spacing:.48em;
  font-size:clamp(9px,.72vw,12px);
  font-weight:600;
}
.landing-brand h1{
  margin:0;
  font-family:Georgia,"Times New Roman",serif;
  font-size:clamp(49px,5.8vw,92px);
  font-weight:400;
  line-height:.92;
  letter-spacing:.12em;
  text-transform:uppercase;
}
.landing-identity{
  margin:17px 0 0;
  display:flex;
  justify-content:center;
  align-items:center;
  gap:22px;
  font-family:Georgia,"Times New Roman",serif;
  text-transform:uppercase;
  letter-spacing:.36em;
  font-size:clamp(11px,.93vw,16px);
}
.landing-identity b{font-weight:400;opacity:.9}
.panel-content{
  position:absolute;
  z-index:2;
  left:clamp(24px,5vw,82px);
  right:clamp(24px,5vw,82px);
  bottom:clamp(46px,8vh,92px);
  text-align:center;
  text-shadow:0 2px 12px rgba(0,0,0,.44);
}
.panel-content h2{
  margin:0;
  font-family:Georgia,"Times New Roman",serif;
  font-size:clamp(44px,4.2vw,70px);
  font-weight:400;
  line-height:1;
  letter-spacing:.03em;
  text-transform:uppercase;
}
.panel-content p{
  margin:15px 0 27px;
  font-family:Georgia,"Times New Roman",serif;
  text-transform:uppercase;
  letter-spacing:.24em;
  font-size:clamp(10px,.9vw,14px);
  line-height:1.45;
}
.enter-link{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:24px;
  min-width:180px;
  padding:16px 28px;
  border:1px solid rgba(255,255,255,.88);
  background:rgba(11,10,9,.19);
  backdrop-filter:blur(2px);
  text-transform:uppercase;
  letter-spacing:.27em;
  font-family:Georgia,"Times New Roman",serif;
  font-size:14px;
  transition:background .2s ease,color .2s ease,transform .2s ease;
}
.enter-link span{font-size:24px;line-height:.65;letter-spacing:0;transform:translateY(-1px)}
.enter-link:hover,.enter-link:focus-visible{background:rgba(247,245,239,.94);color:#171614;transform:translateY(-2px);text-shadow:none;outline:none}
.landing-footer{
  grid-column:1 / -1;
  grid-row:2;
  z-index:5;
  display:flex;
  justify-content:center;
  align-items:center;
  gap:22px;
  background:rgba(12,11,10,.96);
  border-top:1px solid rgba(255,255,255,.17);
  text-transform:uppercase;
  letter-spacing:.28em;
  font-family:Georgia,"Times New Roman",serif;
  font-size:11px;
}
.landing-footer a{opacity:.9;transition:opacity .2s ease}
.landing-footer a:hover,.landing-footer a:focus-visible{opacity:1;text-decoration:underline;text-underline-offset:5px;outline:none}
.landing-footer span{opacity:.54}

@media (max-width:800px){
  :root{--footer-height:78px}
  .landing-shell{
    min-height:auto;
    grid-template-columns:1fr;
    grid-template-rows:auto auto var(--footer-height);
    overflow:visible;
  }
  .landing-brand{
    top:24px;
    width:92vw;
  }
  .landing-location{letter-spacing:.31em;margin-bottom:9px}
  .landing-brand h1{font-size:clamp(40px,11.7vw,66px);letter-spacing:.07em}
  .landing-identity{margin-top:12px;gap:13px;letter-spacing:.25em;font-size:10px}
  .split-panel{
    grid-column:1;
    min-height:72svh;
  }
  .music-panel{grid-row:1}
  .fashion-panel{grid-row:2}
  .music-image{object-position:49% 42%}
  .fashion-image{object-position:center 42%}
  .panel-content{bottom:42px;left:22px;right:22px}
  .panel-content h2{font-size:clamp(42px,13vw,64px)}
  .panel-content p{font-size:10px;letter-spacing:.18em;margin:12px 0 22px}
  .enter-link{min-width:166px;padding:14px 22px;font-size:12px}
  .landing-footer{grid-row:3;gap:10px;font-size:9px;letter-spacing:.17em;padding:0 12px}
}

@media (max-width:520px){
  .landing-location{font-size:8px;letter-spacing:.22em}
  .landing-brand h1{font-size:clamp(36px,11vw,54px)}
  .landing-identity{font-size:9px;letter-spacing:.18em}
  .split-panel{min-height:68svh}
  .music-panel{padding-top:0}
  .panel-content{bottom:32px}
  .landing-footer{flex-wrap:wrap;align-content:center;line-height:1.6}
}

@media (prefers-reduced-motion:reduce){
  .enter-link{transition:none}
}
