
:root{--black:#090909;--bone:#eee8dc;--cyan:#20c8e6;--muted:#aaa49a}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--black);color:var(--bone);font-family:Arial,Helvetica,sans-serif}
.nav{height:76px;padding:0 5vw;display:flex;align-items:center;justify-content:space-between;position:absolute;z-index:5;width:100%;border-bottom:1px solid rgba(255,255,255,.18)}
.brand{font-weight:900;letter-spacing:.16em}.nav a{color:white;text-decoration:none}.nav nav{display:flex;gap:28px;font-size:13px;letter-spacing:.08em}
.hero{height:100svh;min-height:680px;position:relative;display:flex;align-items:center;padding:0 8vw;overflow:hidden}.hero-image{position:absolute;inset:0;background:url('assets/pizza-hero.jpeg') center/cover no-repeat}.hero-shade{position:absolute;inset:0;background:linear-gradient(90deg,rgba(0,0,0,.88) 0%,rgba(0,0,0,.48) 48%,rgba(0,0,0,.08) 100%)}
.hero-copy{position:relative;z-index:2;max-width:650px}.eyebrow{font-size:12px;font-weight:800;letter-spacing:.22em;margin:0 0 22px}.cyan{color:var(--cyan)}h1{font-size:clamp(64px,9vw,128px);line-height:.79;letter-spacing:-.065em;margin:0 0 32px;text-transform:uppercase}h1 span{color:var(--cyan)}.hero-copy>p:not(.eyebrow){max-width:500px;font-size:18px;line-height:1.6;color:#e7e2d9}
.button{display:inline-block;margin-top:20px;padding:16px 22px;background:var(--cyan);color:#050505;text-decoration:none;font-size:12px;font-weight:900;letter-spacing:.12em;text-transform:uppercase}
.intro,.gallery,.contact{padding:110px 8vw}.intro{display:grid;grid-template-columns:1fr 1fr;gap:80px;align-items:end}.intro h2,.experience h2,.gallery h2,.contact h2{font-family:Georgia,serif;font-size:clamp(42px,6vw,78px);font-weight:400;line-height:1.02;margin:0}.lead{font-family:Georgia,serif;font-size:24px;line-height:1.5;color:#c8c1b5}
.feature-grid{display:grid;grid-template-columns:1.2fr .8fr;grid-template-rows:420px 300px;gap:12px;padding:0 8vw 120px}.feature{margin:0;overflow:hidden}.feature.tall{grid-row:span 2}.feature img,.gallery-grid img,.experience-photo img{width:100%;height:100%;object-fit:cover;display:block}.quote{background:var(--bone);color:var(--black);padding:45px;display:flex;flex-direction:column;justify-content:space-between}.quote p{font-family:Georgia,serif;font-size:34px;margin:0}.quote span{font-size:11px;font-weight:900;letter-spacing:.2em}
.experience{background:#121212;display:grid;grid-template-columns:1fr 1fr;min-height:700px}.experience-photo{min-height:600px}.experience-copy{padding:100px 8vw;display:flex;flex-direction:column;justify-content:center}.experience-copy>p:not(.eyebrow){font-size:17px;line-height:1.7;color:#c9c3b9}.small{font-size:12px!important;letter-spacing:.1em;text-transform:uppercase}.outline{background:transparent;color:var(--bone);border:1px solid var(--bone);align-self:flex-start}
.gallery-grid{margin-top:50px;display:grid;grid-template-columns:repeat(2,1fr);gap:12px}.gallery-grid img{aspect-ratio:1/1;object-fit:cover}
.contact{background:var(--cyan);color:#050505;display:grid;grid-template-columns:1.2fr .8fr;gap:80px}.contact-links{display:flex;flex-direction:column;justify-content:center}.contact-links a{color:#050505;text-decoration:none;padding:18px 0;border-bottom:1px solid rgba(0,0,0,.35);font-weight:700}
footer{padding:32px 8vw;display:flex;justify-content:space-between;color:#888;font-size:10px;letter-spacing:.16em;text-transform:uppercase}
@media(max-width:760px){.nav{height:64px}.nav nav a:not(:last-child){display:none}.nav nav{gap:0}.hero{padding:0 7vw;align-items:flex-end;padding-bottom:80px}.hero-image{background-position:58% center}.hero-shade{background:linear-gradient(0deg,rgba(0,0,0,.92),rgba(0,0,0,.1) 75%)}h1{font-size:60px}.intro,.contact{grid-template-columns:1fr;gap:28px;padding:80px 7vw}.feature-grid{grid-template-columns:1fr;grid-template-rows:480px 300px auto;padding:0 7vw 80px}.feature.tall{grid-row:auto}.quote{min-height:250px}.experience{grid-template-columns:1fr}.experience-photo{min-height:500px}.experience-copy{padding:80px 7vw}.gallery{padding:80px 7vw}.gallery-grid{grid-template-columns:1fr 1fr;gap:6px}.contact{gap:50px}footer{padding:28px 7vw;flex-direction:column;gap:10px}}
