
:root{
  --navy:#102a34;
  --deep:#07171d;
  --paper:#f5f0e5;
  --off:#fbf8f2;
  --copper:#b97145;
  --glass:#a8c4bd;
  --ink:#1f2b2e;
  --muted:#697576;
  --line:rgba(31,43,46,.18);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--paper);color:var(--ink);font-family:"DM Sans",sans-serif;overflow-x:hidden}
img{display:block;width:100%;height:100%;object-fit:cover}
a{text-decoration:none;color:inherit}
button{font:inherit}
.site-header{
  height:74px;background:var(--deep);color:white;padding:0 3vw;
  display:grid;grid-template-columns:1fr .7fr 1fr;align-items:center;position:relative;z-index:50
}
.logo img{width:200px;height:auto}
.header-meta{font:400 .5rem "Space Mono",monospace;letter-spacing:.14em;color:#78909a;text-align:center}
.nav{justify-self:end;display:flex;gap:1.5rem;font:400 .55rem "Space Mono",monospace;text-transform:uppercase;letter-spacing:.1em}
.menu-btn{display:none;border:0;background:none}
.menu-btn span{display:block;width:28px;height:1px;background:#fff;margin:7px 0}

.hero{height:calc(100vh - 74px);min-height:760px;position:relative;color:white;background:var(--deep)}
.hero-bg{position:absolute;inset:0;margin:0}
.hero-shade{position:absolute;inset:0;background:linear-gradient(90deg,rgba(7,23,29,.8),rgba(7,23,29,.18) 55%,rgba(7,23,29,.45))}
.hero-copy{position:absolute;right:6vw;top:50%;transform:translateY(-50%);width:min(680px,52vw);z-index:2;text-align:right}
.eyebrow{font:400 .52rem "Space Mono",monospace;letter-spacing:.17em;text-transform:uppercase}
.eyebrow.dark{color:#697a7d}.eyebrow.light{color:#9ab0b7}
.hero h1,.intro h2,.catch h2,.menu h2,.feature-food h2,.ritual h2,.zeus-note h2,.coast h2,.culture h2,.visit h2{
  font:600 clamp(4rem,6.7vw,7.6rem)/.88 "Fraunces",serif;letter-spacing:-.05em;margin:1rem 0
}
.hero-copy p{margin-left:auto;max-width:560px;line-height:1.8;color:#d1d9da}
.hero-slip{position:absolute;left:5vw;bottom:4vw;width:260px;background:var(--paper);color:var(--ink);padding:1.6rem;z-index:3}
.hero-slip>span,.hero-slip small{font:400 .48rem "Space Mono",monospace;letter-spacing:.12em}
.hero-slip strong{display:block;font:600 1.4rem/1.5 "Fraunces",serif;margin:1rem 0}
.hero-side{position:absolute;left:2vw;top:20%;writing-mode:vertical-rl;rotate:180deg;z-index:2}
.hero-side span{font:700 1rem "Space Mono",monospace;letter-spacing:.18em}
.hero-side small{font:.45rem "Space Mono",monospace;color:#8da1a6;letter-spacing:.12em}

.intro{padding:10vw 7vw;background:var(--off);display:grid;grid-template-columns:.2fr 1.1fr .65fr;gap:5vw}
.intro-index{width:38px;height:38px;border:1px solid;border-radius:50%;display:grid;place-items:center;font:.52rem "Space Mono",monospace}
.intro h2{font-size:clamp(3.6rem,5vw,5.8rem)}
.intro-copy{align-self:end}.intro-copy p{line-height:1.85;color:var(--muted)}

.catch{display:grid;grid-template-columns:1.2fr .8fr;background:var(--navy);color:white;min-height:700px}
.catch-photo{min-height:700px}
.catch-copy{padding:7vw 6vw;display:flex;flex-direction:column;justify-content:center}
.catch h2{font-size:clamp(4rem,5.4vw,6.2rem)}
.catch-copy p{line-height:1.85;color:#afc0c4}

.menu{padding:9vw 6vw;background:var(--paper)}
.menu-title{display:grid;grid-template-columns:.35fr 1fr;align-items:end;border-bottom:1px solid var(--ink);padding-bottom:2rem}
.menu-title h2{margin:0;font-size:clamp(4rem,6vw,6.8rem)}
.menu-grid{display:grid;grid-template-columns:repeat(5,1fr);border-bottom:1px solid var(--ink)}
.menu-grid article{min-height:330px;padding:2rem;border-right:1px solid var(--line);display:flex;flex-direction:column}
.menu-grid article:last-child{border-right:0}
.menu-grid span{font:.5rem "Space Mono",monospace;color:#7a8888}
.menu-grid h3{font:600 1.45rem "Fraunces",serif;margin:auto 0 .7rem}
.menu-grid p{font-size:.72rem;line-height:1.65;color:var(--muted)}

.feature-food{display:grid;grid-template-columns:.8fr 1.2fr;background:var(--copper);color:white;min-height:720px}
.feature-copy{padding:7vw 6vw;display:flex;flex-direction:column;justify-content:center}
.feature-food h2{font-size:clamp(4rem,5.5vw,6.3rem)}
.feature-copy p{line-height:1.85;color:#f0d8ca}
.feature-food figure{margin:0;min-height:720px}

.ritual{padding:9vw 6vw;background:var(--off)}
.ritual-head{display:grid;grid-template-columns:.35fr 1fr;align-items:end;margin-bottom:4vw}
.ritual h2{font-size:clamp(4rem,6vw,6.8rem);margin:0}
.ritual-steps{display:grid;grid-template-columns:repeat(4,1fr);gap:1vw}
.ritual-steps article{background:var(--paper);min-height:280px;padding:2rem;display:flex;flex-direction:column}
.ritual-steps b{font:400 .52rem "Space Mono",monospace}
.ritual-steps span{font:700 1.5rem "Space Mono",monospace;margin:auto 0 .7rem}
.ritual-steps p{font-size:.72rem;color:var(--muted)}

.zeus-note{padding:9vw 6vw;background:var(--glass);display:grid;grid-template-columns:.8fr 1.2fr;gap:5vw;align-items:center}
.zeus-note figure{margin:0;height:570px}
.zeus-note h2{font-size:clamp(3.7rem,5vw,5.7rem)}
.zeus-copy p{line-height:1.85;color:#4f5f61}

.coast{display:grid;grid-template-columns:1.3fr .7fr;background:var(--deep);color:white;min-height:700px}
.coast-photo{min-height:700px}
.coast-copy{padding:7vw 5vw;display:flex;flex-direction:column;justify-content:center}
.coast-copy>span{font:.5rem "Space Mono",monospace;color:#7f969e}
.coast h2{font-size:clamp(3.7rem,5vw,5.7rem)}
.coast p{line-height:1.85;color:#aebdc1}

.culture{padding:10vw 8vw;background:var(--paper);display:grid;grid-template-columns:.3fr 1.2fr;gap:6vw}
.culture-code{font:400 2rem "Space Mono",monospace;color:#b0b6b3}
.culture h2{font-size:clamp(3.6rem,5vw,5.7rem)}
.culture-copy p{max-width:820px;line-height:1.85;color:var(--muted)}

.visit{min-height:720px;position:relative;background:var(--navy)}
.visit figure{margin:0;height:720px;width:76%}
.visit-card{position:absolute;right:5vw;top:50%;transform:translateY(-50%);background:var(--off);width:min(430px,40vw);padding:3.5rem}
.visit-card>span{font:.5rem "Space Mono",monospace;color:#6f7d7d}
.visit h2{font-size:clamp(3.8rem,5vw,5.7rem)}
.visit-card p{line-height:1.7;color:var(--muted)}
.visit-line{height:1px;background:var(--line);margin:1.5rem 0}
.visit-card small{display:block;font:.48rem "Space Mono",monospace;color:#748182}
.visit-card strong{display:block;margin:.5rem 0 1.5rem}
.visit-card a{font:.5rem "Space Mono",monospace;border-bottom:1px solid;padding-bottom:.4rem}

footer{padding:5vw 6vw 2.5vw;background:#051117;color:white;display:grid;grid-template-columns:1fr 1fr auto;gap:5vw}
.footer-logo img{width:210px;height:auto}
.footer-copy{font-size:.68rem;color:#7f9399;align-self:center}
.footer-nav{display:flex;gap:1rem;font:.52rem "Space Mono",monospace;text-transform:uppercase}
.footer-bottom{grid-column:1/-1;border-top:1px solid #21323a;margin-top:3rem;padding-top:1.4rem;font:.48rem "Space Mono",monospace;color:#596f75}
.mobile-menu{display:none}

@media(max-width:980px){
  .site-header{grid-template-columns:1fr auto}.header-meta,.nav{display:none}.menu-btn{display:block}
  .hero-copy{width:65vw}
  .intro{grid-template-columns:.2fr 1fr}.intro-copy{grid-column:2}
  .menu-grid{grid-template-columns:1fr 1fr}.menu-grid article:nth-child(5){grid-column:1/-1}
  .ritual-steps{grid-template-columns:1fr 1fr}
  .mobile-menu{display:flex;position:fixed;inset:74px 0 0;background:var(--deep);color:white;z-index:40;flex-direction:column;padding:8vw;transform:translateX(100%);transition:.35s}
  .mobile-menu.open{transform:none}
  .mobile-menu a{font:600 2.8rem/1.5 "Fraunces",serif;border-bottom:1px solid #32454d}
}

@media(max-width:680px){
  .site-header{height:68px;padding:0 5vw}.logo img{width:180px}.mobile-menu{inset:68px 0 0}
  .hero{height:900px}.hero-copy{left:7vw;right:7vw;top:36%;width:auto;text-align:left}.hero-copy p{margin-left:0}.hero h1{font-size:4.6rem}.hero-slip{left:7vw;right:7vw;bottom:5vw;width:auto}.hero-side{display:none}
  .intro{grid-template-columns:1fr;padding:18vw 7vw}.intro-copy{grid-column:auto}
  .catch{grid-template-columns:1fr}.catch-photo{min-height:520px}.catch-copy{padding:18vw 7vw}
  .menu{padding:18vw 6vw}.menu-title{grid-template-columns:1fr}.menu-grid{grid-template-columns:1fr}.menu-grid article,.menu-grid article:nth-child(5){grid-column:auto;min-height:220px;border-right:0;border-bottom:1px solid var(--line)}
  .feature-food{grid-template-columns:1fr}.feature-copy{padding:18vw 7vw}.feature-food figure{min-height:520px}
  .ritual{padding:18vw 6vw}.ritual-head{grid-template-columns:1fr}.ritual-steps{grid-template-columns:1fr}
  .zeus-note{grid-template-columns:1fr;padding:18vw 7vw}.zeus-note figure{height:500px}
  .coast{grid-template-columns:1fr}.coast-photo{min-height:520px}.coast-copy{padding:18vw 7vw}
  .culture{grid-template-columns:1fr;padding:18vw 7vw}
  .visit{min-height:820px}.visit figure{width:100%;height:520px}.visit-card{left:7vw;right:7vw;top:auto;bottom:5vw;transform:none;width:auto}
  footer{grid-template-columns:1fr;padding:14vw 6vw 6vw}.footer-nav{flex-direction:column}.footer-bottom{grid-column:1}
}
