@font-face { font-family: "Bellefair"; src: url("assets/fonts/bellefair.ttf") format("truetype"); font-display: swap; }
@font-face { font-family: "Cardo"; src: url("assets/fonts/cardo.ttf") format("truetype"); font-display: swap; }
@font-face { font-family: "Cormorant"; src: url("assets/fonts/cormorant.ttf") format("truetype"); font-display: swap; }
@font-face { font-family: "Cormorant Infant"; src: url("assets/fonts/cormorant-infant.ttf") format("truetype"); font-display: swap; }
@font-face { font-family: "DM Serif Display"; src: url("assets/fonts/dm-serif-display.ttf") format("truetype"); font-display: swap; }
@font-face { font-family: "EB Garamond"; src: url("assets/fonts/eb-garamond.ttf") format("truetype"); font-display: swap; }
@font-face { font-family: "GFS Neohellenic"; src: url("assets/fonts/gfs-neohellenic.ttf") format("truetype"); font-display: swap; }
@font-face { font-family: "Libre Baskerville"; src: url("assets/fonts/libre-baskerville.ttf") format("truetype"); font-display: swap; }
@font-face { font-family: "Lora"; src: url("assets/fonts/lora.ttf") format("truetype"); font-display: swap; }
@font-face { font-family: "Monsieur La Doulaise"; src: url("assets/fonts/monsieur-la-doulaise.ttf") format("truetype"); font-display: swap; }
@font-face { font-family: "Mrs Saint Delafield"; src: url("assets/fonts/mrs-saint-delafield.ttf") format("truetype"); font-display: swap; }
@font-face { font-family: "Niconne"; src: url("assets/fonts/niconne.ttf") format("truetype"); font-display: swap; }
@font-face { font-family: "Noto Serif Display"; src: url("assets/fonts/noto-serif-display.ttf") format("truetype"); font-display: swap; }
@font-face { font-family: "Old Standard TT"; src: url("assets/fonts/old-standard-tt.ttf") format("truetype"); font-display: swap; }
@font-face { font-family: "Rouge Script"; src: url("assets/fonts/rouge-script.ttf") format("truetype"); font-display: swap; }
@font-face { font-family: "Sacramento"; src: url("assets/fonts/sacramento.ttf") format("truetype"); font-display: swap; }
@font-face { font-family: "Spectral"; src: url("assets/fonts/spectral.ttf") format("truetype"); font-display: swap; }
@font-face { font-family: "Tangerine"; src: url("assets/fonts/tangerine.ttf") format("truetype"); font-display: swap; }
@font-face { font-family: "Cormorant Garamond"; src: url("assets/fonts/cormorantgaramond.ttf") format("truetype"); font-display: swap; }
@font-face { font-family: "Bodoni Moda"; src: url("assets/fonts/bodonimoda.ttf") format("truetype"); font-display: swap; }
@font-face { font-family: "Italiana"; src: url("assets/fonts/italiana.ttf") format("truetype"); font-display: swap; }
@font-face { font-family: "GFS Didot"; src: url("assets/fonts/gfsdidot.ttf") format("truetype"); font-display: swap; }
@font-face { font-family: "Marcellus"; src: url("assets/fonts/marcellus.ttf") format("truetype"); font-display: swap; }
@font-face { font-family: "Forum"; src: url("assets/fonts/forum.ttf") format("truetype"); font-display: swap; }
@font-face { font-family: "Prata"; src: url("assets/fonts/prata.ttf") format("truetype"); font-display: swap; }
@font-face { font-family: "Playfair Display"; src: url("assets/fonts/playfairdisplay.ttf") format("truetype"); font-display: swap; }
@font-face { font-family: "Allura"; src: url("assets/fonts/allura.ttf") format("truetype"); font-display: swap; }
@font-face { font-family: "Alex Brush"; src: url("assets/fonts/alexbrush.ttf") format("truetype"); font-display: swap; }
@font-face { font-family: "Great Vibes"; src: url("assets/fonts/greatvibes.ttf") format("truetype"); font-display: swap; }
@font-face { font-family: "Pinyon Script"; src: url("assets/fonts/pinyonscript.ttf") format("truetype"); font-display: swap; }
@font-face { font-family: "Parisienne"; src: url("assets/fonts/parisienne.ttf") format("truetype"); font-display: swap; }
@font-face { font-family: "Italianno"; src: url("assets/fonts/italianno.ttf") format("truetype"); font-display: swap; }
@font-face { font-family: "Petit Formal Script"; src: url("assets/fonts/petitformalscript.ttf") format("truetype"); font-display: swap; }
@font-face {
  font-family: "Hepta Display";
  src: url("assets/fonts/hepta-display.ttf") format("truetype");
  font-display: swap;
}
@font-face {
  font-family: "Cinzel Brand";
  src: url("assets/fonts/cinzel-black.ttf") format("truetype");
  font-display: swap;
}
@font-face {
  font-family: "Minion Brand";
  src: url("assets/fonts/minion-pro.otf") format("opentype");
  font-display: swap;
}
:root {
  --black: #090806;
  --bone: #eee8dd;
  --warm: #bba47d;
  --line: rgba(238,232,221,.23);
  --display: "Hepta Display", Georgia, serif;
}
* { box-sizing: border-box; }
html { background: var(--black); }
body { margin: 0; color: var(--bone); font-family: Arial, Helvetica, sans-serif; }
body::after {
  content: "";
  position: fixed;
  inset: 0;
  background-image: repeating-linear-gradient(93deg,transparent 0 3px,rgba(255,255,255,.18) 3px 4px),repeating-linear-gradient(7deg,transparent 0 5px,rgba(255,255,255,.12) 5px 6px);
  opacity: .035;
  pointer-events: none;
  z-index: 5;
}
::selection { background: var(--warm); color: var(--black); }
p { margin: 0; }
.page {
  min-height: 100svh;
  display: grid;
  grid-template-rows: auto 1fr auto;
  padding: max(30px,env(safe-area-inset-top)) clamp(24px,5vw,96px) max(26px,env(safe-area-inset-bottom));
  background: radial-gradient(ellipse at 77% 46%,rgba(187,164,125,.095),transparent 54%),var(--black);
  isolation: isolate;
}
.brand-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  position: relative;
  z-index: 2;
}
.logo { display: block; width: clamp(110px,10vw,154px); height: auto; }
.location,.eyebrow,.art-caption,.footer-mark {
  text-transform: uppercase;
  font-size: .75rem;
  line-height: 1.7;
  font-weight: 400;
  letter-spacing: .2em;
}
.location { color: var(--warm); text-align: right; }
.hero {
  display: grid;
  grid-template-columns: 1.2fr 1fr;
  align-items: center;
  gap: clamp(30px,5vw,80px);
  width: 100%;
  max-width: 1550px;
  margin: auto;
  padding: 56px 0;
}
.hero-copy { position: relative; z-index: 2; }
.eyebrow { display: flex; align-items: center; gap: 16px; margin-bottom: 32px; color: var(--warm); }
.eyebrow > span { width: 30px; height: 1px; background: var(--warm); }
h1 {
  font-family: var(--display);
  font-weight: 400;
  font-size: clamp(64px,8.1vw,140px);
  line-height: 1.05;
  letter-spacing: -.045em;
  margin: 0 0 30px;
}
h1 > span { display: block; }
.soon { color: var(--warm); }
.period { color: var(--bone); }
.intro { font-size: 1rem; line-height: 1.65; color: rgba(238,232,221,.8); min-height: 3.3em; max-width: 100%; }
.intro span { display: block; font-family: "Minion Brand", Georgia, serif; }
.signature-line { margin-top: 40px; width: 80px; height: 1px; background: var(--line); }
.brand-art {
  height: clamp(360px,63svh,720px);
  width: 100%;
  position: relative;
}
.seven-outline,.seven-photo {
  position: absolute;
  inset: 0;
  mask: url("assets/seven.png") center / contain no-repeat;
  -webkit-mask: url("assets/seven.png") center / contain no-repeat;
}
.seven-outline { background: linear-gradient(155deg,#c9b476,#7b6642); transform: translate(10px,8px); opacity: .28; }
.seven-photo {
  background: linear-gradient(180deg,rgba(9,8,6,.12),rgba(9,8,6,.02) 65%,rgba(9,8,6,.25)),url("assets/bifteki.jpg") center / auto 100% no-repeat;
  filter: saturate(.75) brightness(.9);
}
.art-caption { position: absolute; bottom: -30px; right: 0; left: 0; text-align: center; color: var(--warm); }
.brand-footer {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 20px;
  padding-top: 22px;
}
.contact-details { width: min(100%,1150px); display: grid; grid-template-columns: 1.2fr .8fr 1.8fr 1fr; gap: 24px; padding: 12px 0 8px; text-align: center; font-size: .875rem; line-height: 1.7; }
.contact-details address { font-style: normal; }
.contact-label { display: block; margin-bottom: 8px; color: var(--warm); font-size: .75rem; text-transform: uppercase; letter-spacing: .16em; }
.contact-details a { color: var(--bone); text-decoration: none; transition: color 180ms ease; }
.contact-details a:hover { color: var(--warm); }
.contact-details a:focus-visible { outline: 1px solid var(--warm); outline-offset: 5px; }
@media (max-width: 600px) { .contact-details { grid-template-columns: 1fr; gap: 24px; padding-top: 8px; } }
.brand-footer p { font-family: var(--display); font-size: 1.1rem; line-height: 1.4; }
.footer-mark { color: var(--warm); }
@media (prefers-reduced-motion: no-preference) {
  .type-ready .intro span { animation: brand-type 23.4s steps(1, end) infinite; }
  @keyframes brand-type {
    0.00000000% { font-family: "Minion Brand", Georgia, serif; }
    2.77777778% { font-family: "EB Garamond", Georgia, serif; }
    5.55555556% { font-family: "Allura", Georgia, serif; }
    8.33333333% { font-family: "Tangerine", Georgia, serif; }
    11.11111111% { font-family: "Cormorant Garamond", Georgia, serif; }
    13.88888889% { font-family: "Libre Baskerville", Georgia, serif; }
    16.66666667% { font-family: "Cinzel Brand", Georgia, serif; }
    19.44444444% { font-family: "DM Serif Display", Georgia, serif; }
    22.22222222% { font-family: "Alex Brush", Georgia, serif; }
    25.00000000% { font-family: "Niconne", Georgia, serif; }
    27.77777778% { font-family: "Bodoni Moda", Georgia, serif; }
    30.55555556% { font-family: "Lora", Georgia, serif; }
    33.33333333% { font-family: "Italiana", Georgia, serif; }
    36.11111111% { font-family: "Cormorant Infant", Georgia, serif; }
    38.88888889% { font-family: "Great Vibes", Georgia, serif; }
    41.66666667% { font-family: "Rouge Script", Georgia, serif; }
    44.44444444% { font-family: "GFS Didot", Georgia, serif; }
    47.22222222% { font-family: "Noto Serif Display", Georgia, serif; }
    50.00000000% { font-family: "Marcellus", Georgia, serif; }
    52.77777778% { font-family: "Cardo", Georgia, serif; }
    55.55555556% { font-family: "Pinyon Script", Georgia, serif; }
    58.33333333% { font-family: "Mrs Saint Delafield", Georgia, serif; }
    61.11111111% { font-family: "Forum", Georgia, serif; }
    63.88888889% { font-family: "Old Standard TT", Georgia, serif; }
    66.66666667% { font-family: "Prata", Georgia, serif; }
    69.44444444% { font-family: "Spectral", Georgia, serif; }
    72.22222222% { font-family: "Parisienne", Georgia, serif; }
    75.00000000% { font-family: "Sacramento", Georgia, serif; }
    77.77777778% { font-family: "Playfair Display", Georgia, serif; }
    80.55555556% { font-family: "Bellefair", Georgia, serif; }
    83.33333333% { font-family: "Hepta Display", Georgia, serif; }
    86.11111111% { font-family: "GFS Neohellenic", Georgia, serif; }
    88.88888889% { font-family: "Italianno", Georgia, serif; }
    91.66666667% { font-family: "Monsieur La Doulaise", Georgia, serif; }
    94.44444444% { font-family: "Petit Formal Script", Georgia, serif; }
    97.22222222% { font-family: "Cormorant", Georgia, serif; }
    100% { font-family: "Minion Brand", Georgia, serif; }
  }
  .brand-header,.hero-copy,.brand-footer { animation: arrive 1.2s cubic-bezier(.16,1,.3,1) both; }
  .hero-copy { animation-delay: .12s; }
  .brand-footer { animation-delay: .28s; }
  .brand-art { animation: reveal 1.8s ease both; }
  @keyframes arrive { from { opacity: 0; transform: translateY(14px); } to { opacity: 1; transform: translateY(0); } }
  @keyframes reveal { from { opacity: 0; transform: translateY(16px); } to { opacity: 1; transform: translateY(0); } }
}
@media (max-width: 760px) {
  .page { padding-top: max(24px,env(safe-area-inset-top)); }
  .brand-header { align-items: flex-start; }
  .location { max-width: 180px; font-size: .75rem; letter-spacing: .12em; }
  .hero { grid-template-columns: 1fr; gap: 0; position: relative; min-height: 510px; padding: 70px 0 80px; }
  .hero-copy { align-self: center; }
  h1 { font-size: clamp(52px,13vw,94px); }
  .brand-art { position: absolute; width: min(65%,350px); height: 92%; right: -4px; bottom: 0; opacity: .28; z-index: 0; }
  .seven-photo { filter: saturate(.65) brightness(.65); }
  .art-caption { display: none; }
  .eyebrow { margin-bottom: 28px; }
  .brand-footer p { font-size: 1rem; }
  .footer-mark { letter-spacing: .1em; }
  @media (prefers-reduced-motion: no-preference) {
    .brand-art { animation-name: reveal-mobile; }
    @keyframes reveal-mobile { from { opacity: 0; transform: translateY(16px); } to { opacity: .28; transform: translateY(0); } }
  }
}
@media (max-width: 380px) {
  .brand-header { flex-direction: column; gap: 14px; }
  .location { max-width: none; text-align: left; }
  .hero { min-height: 420px; padding: 50px 0; }
  .eyebrow { letter-spacing: .12em; }
}
@media (max-height: 600px) and (min-width: 761px) {
  .hero { padding: 44px 0 60px; }
  .brand-art { height: 360px; }
  h1 { font-size: clamp(64px,7.5vw,100px); }
}

.restaurant-status { max-width: 32em; margin: 0 0 10px; font-size: .9rem; line-height: 1.7; color: var(--bone); }
.opening-hours p { font-family: Arial, Helvetica, sans-serif; font-size: .875rem; line-height: 1.7; }
@media (min-width: 601px) and (max-width: 900px) { .contact-details { grid-template-columns: 1fr 1fr; } }
