:root{
  --max-site: 1540px;
  --pad-x: clamp(38px, 5.2vw, 88px);
  --pad-y: clamp(34px, 5.2vh, 62px);
  --text-dark:#0b0f12;
  --text-light:#f5f7f8;
  --line-dark:rgba(8,14,18,.45);
  --line-light:rgba(255,255,255,.48);
}
*{box-sizing:border-box}
html,body{margin:0;min-height:100%;background:#0d1215}
body{font-family:"Arial Narrow","Roboto Condensed",Arial,Helvetica,sans-serif;color:#fff;overflow-x:hidden}
.landing{width:min(100%,var(--max-site));min-height:100svh;margin:0 auto;display:grid;grid-template-columns:1fr 1fr;background:#0d1215;box-shadow:0 0 0 1px rgba(255,255,255,.02)}
.panel{position:relative;min-width:0;min-height:100svh;overflow:hidden;isolation:isolate}
.panel__bg,.panel__shade{position:absolute;inset:0}
.panel__bg{z-index:-3;background-size:cover;background-position:center;transition:transform .8s cubic-bezier(.2,.75,.25,1),filter .55s ease}
.panel--dark .panel__bg{background-image:url('assets/bg-left.jpg');background-position:58% 47%;filter:saturate(.92) contrast(1.08) brightness(.78)}
.panel--light .panel__bg{background-image:url('assets/bg-right.jpg');background-position:58% 50%;filter:saturate(.78) contrast(.92) brightness(1.12)}
.panel--dark .panel__shade{z-index:-2;background:linear-gradient(90deg,rgba(4,8,10,.86) 0%,rgba(4,8,10,.67) 41%,rgba(4,8,10,.23) 72%,rgba(4,8,10,.08) 100%),linear-gradient(0deg,rgba(3,6,8,.22),rgba(3,6,8,.02) 55%)}
.panel--light .panel__shade{z-index:-2;background:linear-gradient(90deg,rgba(255,255,255,.97) 0%,rgba(255,255,255,.91) 38%,rgba(255,255,255,.56) 63%,rgba(255,255,255,.12) 100%)}
.panel__inner{height:100%;min-height:100svh;display:grid;grid-template-rows:auto 1fr auto;padding:var(--pad-y) var(--pad-x) 28px;position:relative}
.panel--light{color:var(--text-dark)}
.eyebrow{margin:0;font-size:clamp(11px,.78vw,14px);line-height:1.48;letter-spacing:.18em;font-weight:500;text-transform:uppercase}
.hero-block{align-self:center;max-width:min(100%,470px);transform:translateY(-1.5vh)}
.brand{display:block;width:clamp(150px,13.4vw,224px);height:auto;margin:0 0 18px;object-fit:contain;object-position:left center}
.brand--light{filter:invert(1) brightness(1.9)}
.title{font-size:clamp(38px,3.72vw,61px);line-height:.99;margin:0 0 18px;font-weight:800;letter-spacing:.075em;text-transform:uppercase}
.title--shop{font-size:clamp(30px,2.43vw,40px);line-height:1.02;letter-spacing:.075em;white-space:nowrap}
.subtitle{font-size:clamp(11px,.94vw,15px);line-height:1.5;letter-spacing:.13em;margin:0;text-transform:uppercase}
.rule{display:block;width:42px;height:1px;margin:27px 0 28px;background:currentColor;opacity:.72}
.features{list-style:none;padding:0;margin:0 0 28px;display:grid;gap:8px;font-size:clamp(11px,.89vw,14px);line-height:1.15;letter-spacing:.095em;text-transform:uppercase}
.cta{display:inline-flex;align-items:center;justify-content:center;gap:20px;min-width:232px;padding:16px 26px;border:1px solid currentColor;text-decoration:none;font-size:clamp(10px,.77vw,12px);font-weight:700;letter-spacing:.11em;text-transform:uppercase;transition:background-color .22s ease,color .22s ease,transform .22s ease,box-shadow .22s ease}
.cta--dark{color:#fff;background:rgba(0,0,0,.12)}
.cta--dark:hover,.cta--dark:focus-visible{background:#fff;color:#0b0f12;transform:translateY(-2px);box-shadow:0 10px 28px rgba(0,0,0,.18)}
.cta--light{color:#0b0f12;background:rgba(255,255,255,.16)}
.cta--light:hover,.cta--light:focus-visible{background:#0b0f12;color:#fff;transform:translateY(-2px);box-shadow:0 10px 28px rgba(0,0,0,.12)}
.cta:active{transform:translateY(0) scale(.99)}
.cta:focus-visible{outline:2px solid currentColor;outline-offset:4px}
.panel__footer{padding-top:14px;border-top:1px solid currentColor;display:flex;justify-content:space-between;gap:24px;font-size:clamp(8px,.61vw,10px);line-height:1.2;letter-spacing:.075em;text-transform:uppercase;opacity:.86;white-space:nowrap}
.panel:hover .panel__bg{transform:scale(1.018)}
.panel--dark:hover .panel__bg{filter:saturate(.98) contrast(1.09) brightness(.82)}
.panel--light:hover .panel__bg{filter:saturate(.82) contrast(.94) brightness(1.16)}
@media (max-width:1100px){
  :root{--pad-x:42px;--pad-y:34px}
  .hero-block{max-width:400px}
  .title--shop{white-space:normal}
  .panel__footer{white-space:normal;align-items:flex-end}
}
@media (max-width:760px){
  body{background:#080d10}
  .landing{display:block;width:100%}
  .panel{min-height:100svh}
  .panel__inner{min-height:100svh;padding:34px 28px 24px}
  .hero-block{align-self:center;transform:none;max-width:100%}
  .brand{width:170px;margin-bottom:16px}
  .title{font-size:44px}
  .title--shop{font-size:34px}
  .subtitle{font-size:12px}
  .features{font-size:12px}
  .cta{min-width:220px}
  .panel__footer{font-size:9px;gap:15px}
  .panel--dark .panel__bg{background-position:61% center}
  .panel--light .panel__bg{background-position:61% center}
}
@media (max-width:430px){
  .panel__inner{padding:26px 22px 20px}
  .eyebrow{font-size:10px}
  .brand{width:145px}
  .title{font-size:37px;letter-spacing:.06em}
  .title--shop{font-size:29px}
  .subtitle{font-size:10px}
  .rule{margin:22px 0}
  .features{font-size:10px;gap:7px}
  .cta{width:100%;min-width:0;padding:15px 18px}
  .panel__footer{font-size:7.5px}
}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{scroll-behavior:auto!important;transition:none!important;animation:none!important}
}