/* ---------- tokens ---------- */
:root{
  --ink:        #0b0b0c;
  --ink-2:      #161618;
  --paper:      #f1ede4;
  --paper-dim:  #b8b3a6;
  --blood:      #c8202f;
  --blood-dim:  #7a1319;
  --brass:      #b6924f;
  --line:       rgba(241,237,228,0.14);

  --display: 'Anton', sans-serif;
  --body: 'Space Grotesk', sans-serif;
  --mono: 'JetBrains Mono', monospace;

  --wrap: 1180px;
}

*{ box-sizing:border-box; margin:0; padding:0; }

html{ scroll-behavior:smooth; }

body{
  background:var(--ink);
  color:var(--paper);
  font-family:var(--body);
  font-weight:400;
  line-height:1.5;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}

img{ display:block; max-width:100%; }

a{ color:inherit; text-decoration:none; }

section{ position:relative; scroll-margin-top:calc(var(--promo-h) + 70px); }

::selection{ background:var(--blood); color:var(--paper); }

/* ---------- grain overlay ---------- */
.grain{
  position:fixed; inset:0;
  pointer-events:none;
  z-index:200;
  opacity:0.05;
  mix-blend-mode:overlay;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}

/* ---------- promo bar ---------- */
:root{ --promo-h:40px; }
.promo-bar{
  position:fixed; top:0; left:0; right:0;
  z-index:110;
  height:var(--promo-h);
  display:flex; align-items:center;
  background:linear-gradient(90deg, var(--ink-2), #1d1d20);
  border-bottom:1px solid var(--line);
}
.promo-bar__inner{
  width:100%;
  display:flex; align-items:center; justify-content:center; gap:10px;
  padding:0 16px;
  overflow:hidden;
  white-space:nowrap;
}
.promo-bar__tag{
  font-family:var(--mono);
  font-size:10px;
  letter-spacing:0.1em;
  text-transform:uppercase;
  color:var(--ink);
  background:var(--brass);
  padding:3px 8px;
  border-radius:2px;
  flex:0 0 auto;
}
.promo-bar__text{
  font-family:var(--body);
  font-size:12.5px;
  color:var(--paper-dim);
  text-overflow:ellipsis;
  overflow:hidden;
}
.promo-bar__text strong{ color:var(--paper); font-weight:600; }
.promo-bar__arrow{
  color:var(--blood);
  font-size:13px;
  flex:0 0 auto;
}
.promo-bar:hover .promo-bar__text strong{ color:var(--brass); }

@media (max-width:760px){
  .promo-bar__tag{ display:none; }
  .promo-bar__text{ font-size:11.5px; }
}
@media (max-width:480px){
  :root{ --promo-h:52px; }
  .promo-bar{ height:auto; min-height:var(--promo-h); padding:6px 0; }
  .promo-bar__inner{
    white-space:normal;
    text-align:center;
    line-height:1.35;
  }
  .promo-bar__text{ font-size:10.5px; }
  .promo-bar__arrow{ display:none; }
}

/* ---------- nav ---------- */
.nav{
  position:fixed; top:var(--promo-h); left:0; right:0;
  z-index:100;
  display:flex; align-items:center; justify-content:space-between;
  padding:22px clamp(20px,5vw,64px);
  mix-blend-mode:difference;
}
.nav__mark{
  font-family:var(--display);
  font-size:22px;
  letter-spacing:0.02em;
  color:var(--paper);
}
.nav .dot{ color:var(--blood); }
.nav__links{ display:flex; gap:clamp(16px,3vw,36px); align-items:center; }
.nav__links a{
  font-family:var(--mono);
  font-size:12px;
  letter-spacing:0.08em;
  text-transform:uppercase;
  color:var(--paper);
  opacity:0.85;
  transition:opacity .2s;
}
.nav__links a:hover{ opacity:1; }
.nav__ig{ color:var(--paper) !important; opacity:1 !important; border:1px solid currentColor; padding:8px 14px; border-radius:999px; }

@media (max-width:640px){
  .nav__links a:not(.nav__ig){ display:none; }
}

/* ---------- hero ---------- */
.hero{
  position:relative;
  min-height:100svh;
  display:flex;
  align-items:flex-end;
  overflow:hidden;
}
.hero__img{ position:absolute; inset:0; }
.hero__img img{
  width:100%; height:100%; object-fit:cover;
  object-position:32% center;
  filter:grayscale(85%) contrast(1.15) brightness(0.62);
  transform:scale(1.02);
}
.hero__scrim{
  position:absolute; inset:0;
  background:
    linear-gradient(0deg, rgba(11,11,12,0.97) 0%, rgba(11,11,12,0.55) 42%, rgba(11,11,12,0.25) 65%, rgba(11,11,12,0.65) 100%),
    linear-gradient(90deg, rgba(11,11,12,0.55) 0%, rgba(11,11,12,0.05) 45%, rgba(11,11,12,0.55) 100%);
}
.hero__content{
  position:relative;
  z-index:2;
  padding:0 clamp(20px,5vw,64px) clamp(56px,8vw,96px);
  max-width:820px;
}
.eyebrow{
  font-family:var(--mono);
  font-size:12px;
  letter-spacing:0.22em;
  text-transform:uppercase;
  color:var(--brass);
  margin-bottom:18px;
}
.hero__title{
  font-family:var(--display);
  font-size:clamp(56px,11vw,132px);
  line-height:0.86;
  letter-spacing:0.005em;
  text-transform:uppercase;
  color:var(--paper);
}
.hero__title span{ color:var(--blood); }
.hero__sub{
  margin-top:26px;
  max-width:480px;
  font-size:clamp(15px,1.6vw,18px);
  color:var(--paper-dim);
}
.hero__cta{
  margin-top:38px;
  display:flex; gap:16px; flex-wrap:wrap;
}

.btn{
  font-family:var(--mono);
  font-size:13px;
  letter-spacing:0.06em;
  text-transform:uppercase;
  padding:16px 28px;
  border-radius:2px;
  display:inline-block;
  transition:transform .25s ease, background .25s ease, color .25s ease, border-color .25s ease;
}
.btn--fill{
  background:var(--blood);
  color:var(--paper);
  border:1px solid var(--blood);
}
.btn--fill:hover{ background:var(--paper); color:var(--ink); border-color:var(--paper); transform:translateY(-2px); }
.btn--ghost{
  border:1px solid var(--line);
  color:var(--paper);
}
.btn--ghost:hover{ border-color:var(--paper); transform:translateY(-2px); }

.hero__stamp{
  position:absolute;
  right:clamp(20px,5vw,64px);
  top:clamp(90px,12vh,140px);
  width:120px; height:120px;
  color:var(--paper-dim);
  z-index:2;
  animation:spin 26s linear infinite;
  opacity:0.8;
}
.hero__stamp svg{ width:100%; height:100%; }
.hero__stamp text{
  font-family:var(--mono);
  font-size:9.4px;
  letter-spacing:2px;
  fill:var(--paper-dim);
}
@keyframes spin{ to{ transform:rotate(360deg); } }
@media (max-width:760px){ .hero__stamp{ display:none; } }

/* ---------- marquee ---------- */
.marquee{
  border-top:1px solid var(--line);
  border-bottom:1px solid var(--line);
  background:var(--ink-2);
  overflow:hidden;
  padding:16px 0;
}
.marquee__track{
  display:flex;
  gap:28px;
  white-space:nowrap;
  width:max-content;
  animation:scroll 32s linear infinite;
  font-family:var(--mono);
  font-size:13px;
  letter-spacing:0.12em;
  text-transform:uppercase;
  color:var(--paper-dim);
}
.marquee__track span:nth-child(2n){ color:var(--blood); }
@keyframes scroll{ from{ transform:translateX(0); } to{ transform:translateX(-50%); } }

/* ---------- work / gallery ---------- */
.work{
  padding:clamp(80px,10vw,140px) clamp(20px,5vw,64px);
  max-width:var(--wrap);
  margin:0 auto;
}
.work__head{
  display:flex;
  justify-content:space-between;
  align-items:flex-end;
  gap:24px;
  flex-wrap:wrap;
  margin-bottom:44px;
  border-bottom:1px solid var(--line);
  padding-bottom:28px;
}
.work__head h2{
  font-family:var(--display);
  font-size:clamp(34px,5vw,56px);
  text-transform:uppercase;
  line-height:0.95;
}
.work__head p{
  color:var(--paper-dim);
  max-width:320px;
  font-size:14px;
}

.gallery{
  display:grid;
  grid-template-columns:repeat(4, 1fr);
  gap:14px;
}
.gallery__item{
  position:relative;
  overflow:hidden;
  border-radius:2px;
  grid-column:span 2;
  aspect-ratio:4/5;
  background:var(--ink-2);
}
.gallery__item.span-2{ grid-column:span 2; }
.gallery__item img{
  width:100%; height:100%; object-fit:cover;
  filter:grayscale(30%) contrast(1.08);
  transition:transform .6s cubic-bezier(.2,.7,.2,1), filter .6s ease;
}
.gallery__item:hover img{ transform:scale(1.06); filter:grayscale(0%) contrast(1.08); }
.gallery__item figcaption{
  position:absolute; left:0; right:0; bottom:0;
  padding:14px 16px;
  font-family:var(--mono);
  font-size:11px;
  letter-spacing:0.08em;
  text-transform:uppercase;
  color:var(--paper);
  background:linear-gradient(0deg, rgba(0,0,0,0.75), transparent);
}

@media (max-width:820px){
  .gallery{ grid-template-columns:repeat(2,1fr); }
  .gallery__item, .gallery__item.span-2{ grid-column:span 1; aspect-ratio:4/5; }
  .gallery__item:first-child{ grid-column:span 2; aspect-ratio:16/10; }
}

.work__more{ margin-top:40px; }

/* ---------- reel ---------- */
.reel{
  border-top:1px solid var(--line);
  padding:clamp(70px,9vw,120px) 0 clamp(70px,9vw,120px);
  max-width:100%;
  overflow:hidden;
}
.reel .work__head{
  max-width:var(--wrap);
  margin:0 auto 36px;
  padding:0 clamp(20px,5vw,64px);
}
.reel__track{
  display:flex;
  gap:14px;
  overflow-x:auto;
  padding:4px clamp(20px,5vw,64px) 18px;
  scroll-snap-type:x proximity;
  scrollbar-width:thin;
  scrollbar-color:var(--blood-dim) transparent;
}
.reel__track::-webkit-scrollbar{ height:6px; }
.reel__track::-webkit-scrollbar-thumb{ background:var(--blood-dim); border-radius:4px; }

.reel__item{
  position:relative;
  flex:0 0 auto;
  width:200px;
  aspect-ratio:9/16;
  border-radius:2px;
  overflow:hidden;
  background:var(--ink-2);
  scroll-snap-align:start;
  cursor:pointer;
  border:1px solid var(--line);
}
.reel__item video{
  width:100%; height:100%; object-fit:cover;
  filter:grayscale(20%) contrast(1.05);
  transition:filter .3s ease, transform .4s ease;
}
.reel__item::after{
  content:"▶";
  position:absolute;
  bottom:12px; right:12px;
  width:30px; height:30px;
  display:flex; align-items:center; justify-content:center;
  font-size:10px;
  color:var(--ink);
  background:var(--paper);
  border-radius:50%;
  opacity:0.92;
  transition:opacity .2s, transform .2s;
}
.reel__item:hover video{ filter:grayscale(0%) contrast(1.05); transform:scale(1.03); }
.reel__item.is-playing::after{ content:"❚❚"; font-size:9px; }
.reel__item.is-playing{ border-color:var(--blood); }

.reel__hint{
  padding:0 clamp(20px,5vw,64px);
  font-family:var(--mono);
  font-size:11px;
  letter-spacing:0.06em;
  text-transform:uppercase;
  color:var(--paper-dim);
  opacity:0.7;
}

@media (max-width:640px){
  .reel__item{ width:150px; }
}

/* ---------- about ---------- */
.about{
  border-top:1px solid var(--line);
  padding:clamp(70px,9vw,120px) clamp(20px,5vw,64px);
  max-width:var(--wrap);
  margin:0 auto;
  display:grid;
  grid-template-columns:120px 1fr;
  gap:24px;
}
.about__num{
  font-family:var(--mono);
  font-size:14px;
  color:var(--blood);
  letter-spacing:0.1em;
}
.about__body h2{
  font-family:var(--display);
  font-size:clamp(30px,4.4vw,50px);
  text-transform:uppercase;
  line-height:1.02;
  margin-bottom:26px;
}
.about__body p{
  color:var(--paper-dim);
  max-width:600px;
  font-size:16px;
  margin-bottom:16px;
}
@media (max-width:640px){
  .about{ grid-template-columns:1fr; }
}

/* ---------- reviews ---------- */
.reviews{
  border-top:1px solid var(--line);
  background:var(--ink-2);
  padding:clamp(70px,9vw,120px) clamp(20px,5vw,64px);
}
.reviews__inner{ max-width:var(--wrap); margin:0 auto; }
.reviews__title{
  font-family:var(--display);
  font-size:clamp(34px,5.5vw,58px);
  text-transform:uppercase;
  line-height:0.98;
  margin:14px 0 20px;
}
.reviews__title span{ color:var(--brass); }
.reviews__sub{
  color:var(--paper-dim);
  max-width:520px;
  font-size:15px;
  margin-bottom:48px;
}

.reviews__steps{
  display:grid;
  grid-template-columns:repeat(3, 1fr);
  gap:18px;
}
.reviews__step{
  border:1px solid var(--line);
  padding:28px 26px;
  display:flex;
  flex-direction:column;
  gap:10px;
  min-height:220px;
}
.reviews__num{
  font-family:var(--mono);
  font-size:13px;
  color:var(--blood);
  letter-spacing:0.1em;
}
.reviews__step h3{
  font-family:var(--display);
  font-size:21px;
  text-transform:uppercase;
  letter-spacing:0.01em;
}
.reviews__step p{
  font-size:14px;
  color:var(--paper-dim);
  flex:1;
}
.reviews__btns{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  margin-top:4px;
}
.btn--sm{
  padding:10px 16px;
  font-size:11.5px;
}
.reviews__note{
  margin-top:34px;
  font-family:var(--mono);
  font-size:11.5px;
  letter-spacing:0.04em;
  color:var(--paper-dim);
  opacity:0.75;
}

@media (max-width:820px){
  .reviews__steps{ grid-template-columns:1fr; }
  .reviews__step{ min-height:0; }
}

/* ---------- booking ---------- */
.book{
  background:var(--paper);
  color:var(--ink);
  padding:clamp(80px,10vw,140px) clamp(20px,5vw,64px);
}
.book__inner{ max-width:var(--wrap); margin:0 auto; }
.eyebrow--light{ color:var(--blood); }
.book h2{
  font-family:var(--display);
  font-size:clamp(38px,6vw,68px);
  text-transform:uppercase;
  line-height:0.95;
  margin-bottom:18px;
}
.book__sub{
  max-width:480px;
  color:#4a463d;
  font-size:15px;
  margin-bottom:48px;
}

/* contact chips */
.contact-row{
  display:flex;
  flex-wrap:wrap;
  gap:12px;
  margin-bottom:44px;
}
.contact-chip{
  display:flex;
  flex-direction:column;
  gap:2px;
  padding:12px 18px;
  border:1px solid rgba(11,11,12,0.15);
  border-radius:2px;
  transition:border-color .2s, background .2s, transform .2s;
}
.contact-chip:hover{ border-color:var(--ink); background:rgba(11,11,12,0.03); transform:translateY(-1px); }
.contact-chip__label{
  font-family:var(--mono);
  font-size:10px;
  letter-spacing:0.1em;
  text-transform:uppercase;
  color:var(--blood);
}
.contact-chip__value{
  font-family:var(--body);
  font-size:14px;
  font-weight:600;
  color:var(--ink);
}

/* booking layout: form + deposit card */
.book__layout{
  display:grid;
  grid-template-columns:1.4fr 1fr;
  gap:18px;
  align-items:start;
}
.book__form-card{
  border:1px solid rgba(11,11,12,0.15);
  padding:32px;
  background:rgba(255,255,255,0.4);
}
.book__form-title{
  font-family:var(--display);
  font-size:24px;
  text-transform:uppercase;
  margin-bottom:8px;
}
.book__form-sub{
  font-size:13.5px;
  color:#4a463d;
  margin-bottom:26px;
  max-width:520px;
}
.book__deposit{
  align-self:start;
  min-height:0;
  height:auto;
  justify-content:flex-start;
  padding:32px;
  gap:10px;
  display:flex;
  flex-direction:column;
}
.book__deposit .book__label{ position:static; margin-bottom:4px; }
.book__deposit h3{ font-size:22px; }

.field{ margin-bottom:18px; }
.field-row{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:14px;
  margin-bottom:0;
}
.field-row .field{ margin-bottom:0; }
.lbl{
  display:block;
  font-family:var(--mono);
  font-size:11px;
  letter-spacing:0.08em;
  text-transform:uppercase;
  color:var(--ink);
  font-weight:600;
  margin-bottom:6px;
}
input[type=text], .book textarea{
  width:100%;
  padding:12px 14px;
  font-family:var(--body);
  font-size:14.5px;
  color:var(--ink);
  background:#fff;
  border:1px solid rgba(11,11,12,0.18);
  border-radius:2px;
}
input[type=text]:focus, .book textarea:focus{
  outline:none;
  border-color:var(--blood);
  box-shadow:0 0 0 3px rgba(200,32,47,0.12);
}
.book textarea{ min-height:110px; resize:vertical; font-family:var(--body); }
.hint{ font-size:11.5px; color:#7a7566; margin:0 0 18px; }
.hint--top{ margin-top:-8px; }

.book__submit{ margin-top:6px; }

.picked{
  display:none;
  margin:0 0 18px;
  padding:10px 14px;
  border-radius:2px;
  background:rgba(200,32,47,0.06);
  border:1px solid rgba(200,32,47,0.25);
  color:var(--ink);
  font-size:13px;
}
.thanks{
  display:none;
  background:rgba(20,120,90,0.08);
  border:1px solid #1a7a5e;
  border-radius:2px;
  padding:24px;
  text-align:center;
  color:#0e4d3a;
  font-size:15px;
  font-weight:600;
}

@media (max-width:820px){
  .book__layout{ grid-template-columns:1fr; }
  .field-row{ grid-template-columns:1fr; gap:18px; }
}

.book__grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:18px;
}
.book__card{
  border:1px solid rgba(11,11,12,0.15);
  padding:32px;
  position:relative;
  min-height:190px;
  display:flex;
  flex-direction:column;
  justify-content:flex-end;
  transition:border-color .25s, background .25s;
}
a.book__card:hover{
  border-color:var(--ink);
  background:rgba(11,11,12,0.03);
}
.book__label{
  position:absolute; top:24px; left:32px;
  font-family:var(--mono);
  font-size:11px;
  letter-spacing:0.1em;
  text-transform:uppercase;
  color:var(--blood);
}
.book__card h3{
  font-family:var(--display);
  font-size:26px;
  text-transform:uppercase;
  margin-bottom:6px;
}
.book__card p{ font-family:var(--mono); font-size:14px; color:#4a463d; }
.cashtag{ font-size:20px !important; color:var(--ink) !important; font-weight:600; }
.book__hint{
  font-family:var(--body) !important;
  font-size:12.5px !important;
  color:#7a7566 !important;
  margin-top:6px;
}
.book__arrow{
  position:absolute; bottom:28px; right:28px;
  font-size:20px;
}

.book__note{
  margin-top:28px;
  font-size:12.5px;
  color:#7a7566;
  max-width:520px;
}

@media (max-width:640px){
  .book__grid{ grid-template-columns:1fr; }
}

/* ---------- footer ---------- */
.footer{
  padding:44px clamp(20px,5vw,64px) 60px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  flex-wrap:wrap;
  gap:20px;
  border-top:1px solid var(--line);
}
.footer__mark{
  font-family:var(--display);
  font-size:20px;
}
.footer__links{ display:flex; gap:24px; }
.footer__links a{
  font-family:var(--mono);
  font-size:12px;
  letter-spacing:0.08em;
  text-transform:uppercase;
  color:var(--paper-dim);
}
.footer__links a:hover{ color:var(--paper); }
.footer__fine{
  width:100%;
  font-family:var(--mono);
  font-size:11px;
  color:var(--paper-dim);
  opacity:0.6;
}

@media (prefers-reduced-motion: reduce){
  .marquee__track, .hero__stamp{ animation:none; }
}
