/* Measured against the live WordPress site at 1366px wide. Values such as 132px headings,
   250px watermarks and section heights are taken from the original, not guessed. */
:root {
  --a: #090c0f; --b: #0e1317; --grey: #252525; --brown: #090707;
  --gold: #c8a96a; --tan: #c19977; --pale: #d0b98d; --cream: #ffd892;
  --sans: "Open Sans", system-ui, -apple-system, "Segoe UI", sans-serif; --serif: Forum, Georgia, serif;
}
*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; -webkit-text-size-adjust: 100%; }
body { margin: 0; background: var(--a); color: #fff; font: 400 15px/30px var(--sans); }
img { max-width: 100%; height: auto; display: block; border: 0; }
a { color: inherit; text-decoration: none; }
h1, h2, h3, h4, h5, h6, p, ul { margin: 0; padding: 0; }
ul { list-style: none; }
:focus-visible { outline: 2px solid var(--gold); outline-offset: 3px; }
.skip { position: absolute; left: -999px; top: 8px; background: var(--gold); color: #111; padding: 8px 14px; z-index: 200; }
.skip:focus { left: 8px; }
.pg-a { background: var(--a); } .pg-grey { background: var(--grey); } .pg-brown { background: var(--brown); }

/* ---------- Header ---------- */
.hdr { position: absolute; top: 0; left: 0; right: 0; z-index: 90; height: 150px; padding: 30px 0 0; transition: background .25s; }
.hdr.stuck { position: fixed; height: 100px; padding-top: 5px; background: rgba(9, 12, 15, .96); box-shadow: 0 2px 18px rgba(0, 0, 0, .45); animation: drop .3s ease; }
@keyframes drop { from { transform: translateY(-100%); } to { transform: none; } }
.hdr .row { display: flex; align-items: center; height: 90px; }
.hdr.stuck .row { height: 90px; }
.logo { align-self: flex-start; margin-top: 2px; flex: none; }
.logo img { width: 133px; height: 51px; }
.nav { display: flex; margin-left: 62px; }
.nav > li { position: relative; }
.nav a, .nav .subtoggle { display: flex; align-items: center; gap: 8px; padding: 15px 18px; font: 400 19px/19px var(--sans); color: #fff; background: none; border: 0; cursor: pointer; }
.nav a:hover, .nav .subtoggle:hover, .nav .cur > a, .nav .cur > .subtoggle { color: #ccbc8c; }
.nav .chev { width: 8px; height: 5px; flex: none; }
.dd { position: absolute; top: 100%; left: 0; width: 220px; background: #fff; opacity: 0; visibility: hidden; transform: translateY(8px); transition: .2s; box-shadow: 0 8px 24px rgba(0, 0, 0, .35); }
.has-sub:hover > .dd, .has-sub:focus-within > .dd, .has-sub.open > .dd { opacity: 1; visibility: visible; transform: none; }
.dd a { display: block; padding: 14px 20px; font: 400 15px/20px var(--sans); color: #1d1d1d; border-bottom: 1px solid #eee; }
.dd a:hover { background: var(--gold); color: #fff; }
.hdr-right { margin-left: auto; display: flex; align-items: center; gap: 12px; }
.phone { display: flex; align-items: center; gap: 12px; font: 500 17px/35px var(--sans); color: #fff; }
.phone svg { width: 25px; height: 25px; stroke: var(--tan); fill: none; stroke-width: 1.4; }
.book-btn { display: flex; align-items: center; width: 179px; height: 90px; margin-right: 73px; padding-left: 29px; background: var(--gold); border-radius: 5px; color: #fff; font: 700 14px/35px var(--sans); text-transform: uppercase; }
.book-btn span { width: 96px; text-align: center; }
.book-btn svg, .btn svg { flex: none; stroke: currentColor; fill: none; stroke-width: 1.4; }
.book-btn svg { width: 17px; height: 12px; margin-left: 14px; }
.book-btn:hover { background: #d6b978; }
.burger { display: none; width: 46px; height: 46px; margin-left: 10px; background: none; border: 1px solid rgba(255, 255, 255, .3); border-radius: 5px; color: #fff; cursor: pointer; }
.burger svg { width: 22px; height: 22px; stroke: #fff; stroke-width: 2; }

/* ---------- Buttons ---------- */
.btn { display: inline-flex; align-items: center; justify-content: center; gap: 12px; height: 55px; padding: 0 33px; border-radius: 5px; font: 700 14px/35px var(--sans); text-transform: uppercase; color: #fff; cursor: pointer; border: 0; white-space: nowrap; transition: transform .2s, background .2s; }
.btn svg { width: 7px; height: 11px; margin-top: 4px; }
.btn:hover { transform: translateY(-3px); }
.btn-dark { background: #222; border: 2px solid rgba(255, 255, 255, .1); padding: 0 33px 0 35px; }
.btn-gold { background: var(--gold); }
.btn-tan { background: var(--tan); }
.btn[disabled] { opacity: .55; cursor: wait; transform: none; }

/* ---------- Home hero ---------- */
.hero { position: relative; min-height: 891px; background: var(--b) center / cover no-repeat; padding: 276px 0 207px; isolation: isolate; overflow: hidden; }
.hero-media { position: absolute; inset: 0; z-index: -2; width: 100%; height: 100%; max-width: none; object-fit: cover; object-position: center; }
.hero::before { content: ""; position: absolute; inset: 0; z-index: -1; background: rgba(9, 12, 15, .4) url("/assets/img/overlay.png") center / cover; }
.hero-in { padding-left: 38px; }
.eyebrow { display: flex; align-items: center; gap: 25px; }
.eyebrow::before { content: ""; width: 40px; border-top: 3px solid var(--tan); }
.eyebrow h6, .eyebrow p { font: 400 18px/21.6px var(--sans); letter-spacing: -.5px; color: #fff; }
.hero h1 { margin-top: 26px; max-width: 856px; font: 400 132px/132px var(--serif); letter-spacing: -4.5px; color: #fff; }
.hero .btn { margin: 31px 0 0 115px; }
.slides { position: relative; }
.slide[hidden] { display: none; }
.hero.banner h1 { font-size: 96px; line-height: 100px; letter-spacing: -3px; }
.slide .sub-line { margin-top: 14px; font: 400 24px/34px var(--sans); color: #fff; }
.slide .when { margin-top: 4px; color: var(--pale); font-size: 18px; }
.dots { position: absolute; left: 0; right: 0; bottom: 36px; display: flex; justify-content: center; gap: 10px; z-index: 5; }
.dots button { width: 11px; height: 11px; padding: 0; border-radius: 50%; border: 1px solid #fff; background: transparent; cursor: pointer; }
.dots button[aria-current="true"] { background: #fff; }

/* ---------- Section scaffolding ---------- */
.sec { position: relative; padding: 145px 0 0; }
.sec-head { position: relative; text-align: center; padding-top: 16px; }
.wm { position: absolute; left: 0; right: 0; top: 0; z-index: 0; height: 155px; overflow: hidden; font: 400 250px/155px var(--serif); letter-spacing: -7px; text-transform: uppercase; color: rgba(255, 255, 255, .01); text-align: center; white-space: nowrap; pointer-events: none; }
.sec-head h2, .sec-head p.sub { position: relative; z-index: 1; }
.sec-head h2 { font: 400 52px/62.4px var(--serif); letter-spacing: -1.6px; text-transform: uppercase; color: var(--tan); }
.sec-head .sub { margin-top: 6px; font: 400 18px/36px var(--sans); letter-spacing: -1px; color: #fff; }
.sec-head .btn { margin-top: 20px; position: relative; z-index: 1; }
.s-a { background: var(--a); } .s-b { background: var(--b); } .s-grey { background: var(--grey); }
.s-why { background: linear-gradient(#000, var(--a)); min-height: 380px; }
.s-best { min-height: 394px; padding-bottom: 109px; }
.s-gap { height: 132px; }
.s-try { min-height: 436px; }
.s-vouch { min-height: 381px; }
.s-collab { min-height: 538px; }

.two { width: 1010px; max-width: 100%; margin: 0 auto; padding-left: 8px; display: grid; grid-template-columns: 559px 1fr; column-gap: 50px; }
.s-gal { background: var(--a); padding: 30px 0 130px; }
.s-gal .logo-big { width: 300px; height: 114px; margin: -37px auto 0; }
.s-gal .copy { margin: 21px 0 0 3px; font: 400 18px/36px var(--sans); max-width: 398px; }
.s-gal .btn { margin-top: 35px; }
.s-gal .pic { width: 559px; height: 373px; object-fit: cover; }
.s-brunch { background: var(--a); min-height: 608px; padding-bottom: 130px; }
.s-brunch .pic { width: 559px; height: 478px; object-fit: cover; }
.s-brunch h2 { margin-top: 27px; font: 400 43px/51.6px var(--serif); letter-spacing: -1.6px; text-transform: uppercase; color: var(--pale); }
.s-brunch .when { margin-top: 17px; font: 400 15px/30px var(--sans); color: #c9ab81; }
.s-brunch .copy { margin: 15px 0 0 3px; font: 400 15px/32px var(--sans); max-width: 398px; }
.s-brunch .btn { margin-top: 29px; }
.logos { display: grid; grid-template-columns: repeat(3, 1fr); width: 1320px; max-width: 100%; margin: 76px auto 0; justify-items: center; align-items: center; }
.logos img { width: 225px; height: 145px; object-fit: contain; }
.s-pair { background: var(--b); padding: 10px 0; min-height: 370px; }
.pair { width: 1095px; max-width: 100%; margin: 0 auto; display: grid; grid-template-columns: 1fr 1fr; gap: 45px; }
.pair img { width: 100%; height: 350px; object-fit: cover; }

/* offers + events, only present while the owner has something switched on */
.s-events { background: var(--b); padding: 90px 0 100px; }
.events { width: 1100px; max-width: 100%; margin: 40px auto 0; padding: 0 20px; display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 24px; }
.event { background: #151b20; border: 1px solid rgba(255, 255, 255, .08); border-radius: 5px; padding: 28px; display: flex; flex-direction: column; gap: 4px; }
.event .when { font: 400 14px/20px var(--sans); letter-spacing: .08em; text-transform: uppercase; color: var(--pale); }
.event h3 { font: 400 28px/34px var(--serif); color: var(--tan); }
.event p { color: rgba(255, 255, 255, .75); }
.event .btn { margin-top: 14px; align-self: flex-start; }

/* ---------- Footer ---------- */
.ftr { background: var(--a); min-height: 693px; padding-top: 155px; }
.ftr-grid { display: grid; grid-template-columns: 725px 1fr; padding: 0 0 0 38px; }
.ftr .flogo { width: 315px; height: 120px; margin-top: 2px; }
.ftr .about { width: 579px; max-width: 100%; margin-top: 18px; font: 400 15px/32.07px var(--sans); color: rgba(255, 255, 255, .6); }
.social { display: flex; gap: 6px; margin: 29px 0 0 15px; }
.social a { width: 36px; height: 36px; border-radius: 50%; background: var(--tan); display: grid; place-items: center; }
.social svg { width: 14px; height: 14px; fill: var(--a); }
.ftr h4 { font: 400 35px/35px var(--serif); text-transform: capitalize; margin-top: 3px; }
.info { margin-top: 20px; }
.info li { display: flex; gap: 14px; align-items: flex-start; font: 400 15px/30px var(--sans); color: rgba(255, 255, 255, .6); margin-bottom: 9px; min-width: 0; }
.info li > span, .info li > a { min-width: 0; overflow-wrap: anywhere; }
.info svg { flex: none; width: 17px; height: 17px; margin-top: 6px; stroke: var(--tan); fill: none; stroke-width: 1.5; }
.info li:first-child svg { fill: var(--tan); stroke: none; }
.hours { margin: -3px 0 0 16px; font: 400 15px/30px var(--sans); color: #656565; }
.hours b { color: #656565; font-weight: 700; }
.ftr-bottom { display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; margin: 77px 38px 0; padding-top: 22px; border-top: 1px solid rgba(255, 255, 255, .1); font: 400 15px/30px var(--sans); color: rgba(255, 255, 255, .6); }
.ftr-bottom .gold { color: var(--gold); }
.ftr-bottom a:last-child { justify-self: end; }

/* ---------- Inner pages ---------- */
.phero { position: relative; height: 300px; padding-top: 104px; background: var(--a) center / cover no-repeat; isolation: isolate; text-align: center; }
.phero::before { content: ""; position: absolute; inset: 0; z-index: -1; background: rgba(9, 12, 15, .702); }
.phero.tall { height: 350px; padding-top: 154px; }
.phero h1 { font: 400 60px/72px var(--serif); color: #fff; }
.s-about { padding-bottom: 96px; }
.s-about .wm { color: rgba(29, 29, 29, .98); }
.s-about h2 { color: var(--gold); }
.about-grid { display: grid; grid-template-columns: 300px 735px; column-gap: 140px; padding: 87px 0 130px 38px; }
.about-grid h3 { font: 400 35px/46px var(--serif); text-transform: capitalize; margin-bottom: 20px; }
.about-grid p { font: 400 15px/32px var(--sans); margin-bottom: 18px; max-width: 300px; }
.about-grid .btn { margin-top: 20px; }
.carousel { position: relative; margin-top: 50px; }
.track { display: flex; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; }
.track::-webkit-scrollbar { display: none; }
.track img { flex: 0 0 100%; width: 100%; height: 490px; object-fit: cover; scroll-snap-align: start; }
.car-dots { display: flex; justify-content: center; gap: 12px; margin-top: 20px; }
.car-dots button { width: 7px; height: 7px; padding: 0; border-radius: 50%; border: 0; background: #444; cursor: pointer; }
.car-dots button[aria-current="true"] { background: #fff; }
.car-next { position: absolute; right: 8px; top: 225px; width: 36px; height: 36px; background: none; border: 0; cursor: pointer; color: #fff; }

.menu-pg { padding: 100px 0; min-height: 925px; text-align: center; }
.menu-pg h2 { font: 400 60px/72px var(--serif); }
.menu-pg .intro { width: 1120px; max-width: 100%; margin: 14px auto 0; padding: 0 20px; font-size: 16px; }
.menu-btns { display: grid; grid-template-columns: 560px 560px; justify-content: center; margin-top: 38px; }
.menu-pics { display: grid; grid-template-columns: 525px 525px; gap: 35px; justify-content: center; margin-top: 70px; }
.menu-pics img { width: 525px; height: 350px; object-fit: cover; }

.mlist { width: 740px; max-width: 100%; margin: 0 auto; }
.mlist h2 { font: 400 52px/62.4px var(--serif); text-transform: uppercase; color: var(--pale); margin: 0 0 20px; }
.mrow { display: grid; grid-template-columns: 1fr 72px 71px; border-top: 1px solid rgba(255, 255, 255, .85); padding: 7px 0; }
.mrow.head { border-top: 0; padding: 0 0 4px; font: 700 13px/30px var(--sans); text-align: right; }
.mrow .nm { font: 700 15px/30px var(--sans); text-transform: uppercase; }
.mrow .rg { font: italic 700 13px/30px var(--sans); }
.mrow .ds { font: 400 15px/30px var(--sans); }
.mrow .pr { align-self: center; text-align: right; font: 700 15px/30px var(--sans); }
.mrow.one { grid-template-columns: 1fr auto; column-gap: 24px; }
.mrow .pr-wide { grid-column: auto; }
.mlist + .mlist, .mgap { margin-top: 56px; }
.mlist > .mrow:first-child { border-top: 0; }
.mrow.one .ds { max-width: 590px; }
.mlist:last-child { padding-bottom: 80px; }

.brunch-hero { height: 241px; background: var(--brown) center / cover no-repeat; position: relative; isolation: isolate; }
.brunch-hero::before { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(rgba(9, 12, 15, .55), rgba(9, 12, 15, 0) 70%); }
.brunch { text-align: center; padding-top: 30px; }
.brunch h2 { font: 400 52px/62.4px var(--serif); letter-spacing: -1.6px; text-transform: uppercase; color: var(--pale); padding-top: 10px; }
.brunch .days { margin-top: 22px; font: 400 24px/36px var(--serif); letter-spacing: 3.6px; color: var(--pale); }
.brunch .price { margin-top: 46px; font: italic 400 27px/40px var(--serif); color: var(--cream); }
.brunch .lead { width: 1100px; max-width: 100%; margin: 36px auto 0; padding: 0 20px; }
.brunch h4 { margin-top: 16px; font: 400 27px/40px var(--serif); color: var(--cream); }
.brunch .info-list { margin-top: 18px; font: italic 400 15px/30px var(--sans); }
.brunch .btn { margin-top: 30px; }
.brunch h3 { margin-top: 38px; font: 400 30px/40px var(--serif); color: var(--cream); }
.dishes { column-count: 2; column-gap: 40px; width: 1100px; max-width: 100%; margin: 30px auto 0; }
.dishes.one { column-count: 1; width: 1110px; }
.dishes > div { break-inside: avoid; }
.dishes h5 { font: 700 15px/30px var(--sans); }
.dishes p { font: 400 15px/30px var(--sans); }
.dishes.one > div { margin-bottom: 28px; }
.dishes.plain h5 { font-weight: 400; }
.dishes.plain > div { margin-bottom: 0; }
.gallery3 { display: grid; grid-template-columns: repeat(3, 360px); gap: 20px; justify-content: center; margin: 60px auto 0; padding-bottom: 80px; }
.gallery3 img { width: 360px; height: 560px; object-fit: cover; }

.contact { padding: 100px 0 130px; }
.contact-grid { display: grid; grid-template-columns: 553px 658px; column-gap: 0; padding-left: 116px; }
.contact h2.t { font: 400 40px/50px var(--serif); text-transform: capitalize; margin-top: 62px; }
.contact .lede { font: 400 15px/24px var(--sans); margin-top: 16px; }
.crow { display: flex; gap: 22px; margin-top: 28px; align-items: flex-start; }
.crow > div { max-width: 270px; }
.crow:first-of-type span { text-transform: capitalize; }
.crow img { width: 45px; height: 45px; margin-top: 0; }
.crow b { display: block; font: 700 16px/24px var(--sans); }
.crow span { display: block; font: 400 20px/26px var(--serif); letter-spacing: -.6px; color: #fff; }
.formcard { background: var(--pale); color: #1d1d1d; padding: 70px 75px 80px; min-height: 741px; }
.formcard h2 { font: 400 35px/45px var(--serif); color: #1d1d1d; }
.formcard .tag { font: 400 14px/22px var(--sans); color: #fff; margin-top: 8px; }
.orin-card { min-height: 0; border-radius: 12px; box-shadow: 0 18px 50px rgba(18, 22, 24, .16); }
.booking-kicker { color: #5f5a50; font: 700 11px/18px var(--sans); letter-spacing: .12em; text-transform: uppercase; }
.booking-steps { display: flex; gap: 8px; margin: 30px 0 12px; padding: 0; list-style: none; counter-reset: booking-step; }
.booking-steps li { flex: 1; color: #7b7770; font: 600 11px/15px var(--sans); }
.booking-steps li::after { content: ''; display: block; height: 3px; margin-top: 8px; background: #d8d0c1; border-radius: 99px; }
.booking-steps li.active { color: #1d1d1d; }
.booking-steps li.active::after { background: var(--gold); }
.orin-card fieldset { min-width: 0; margin: 0; padding: 0; border: 0; }
.orin-card legend { font: 600 14px/20px var(--sans); color: #1d1d1d; }
.step-next { min-width: 180px; }
.f { margin-top: 20px; }
.f label { display: block; font: 400 15px/18px "Times New Roman", Times, serif; color: #1d1d1d; }
.f input, .f textarea, .f select { width: 100%; background: transparent; border: 0; border-bottom: 1px solid #1d1d1d; border-radius: 0; padding: 14px 0 8px; font: 400 16px/24px var(--sans); color: #1d1d1d; min-height: 48px; }
.f textarea { min-height: 96px; resize: vertical; }
.f input:focus, .f textarea:focus, .f select:focus { outline: none; border-bottom-width: 2px; }
.f-row { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; }
.f.hp { position: absolute; left: -9999px; margin: 0; }
.send { margin-top: 28px; height: 62px; padding: 0 70px; background: #272f33; color: #fff; border: 0; border-radius: 0; font: 400 14px/62px var(--sans); text-transform: uppercase; cursor: pointer; }
.send:hover { background: #3a464c; }
.send[disabled] { opacity: .5; cursor: wait; }
.msg { margin-top: 18px; padding: 10px 14px; border-left: 3px solid #1d1d1d; background: rgba(255, 255, 255, .35); font: 400 14px/22px var(--sans); }
.msg.err { border-color: #8a1c13; }
.slots { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 6px; }
.slot { min-width: 66px; padding: 7px 12px; background: transparent; border: 1px solid #1d1d1d; border-radius: 3px; font: 400 14px/20px var(--sans); color: #1d1d1d; cursor: pointer; }
.slot[aria-pressed="true"] { background: #1d1d1d; color: #fff; }
.book-wrap { padding: 100px 0 130px; }
.booking-shell { display: grid; grid-template-columns: minmax(280px, 370px) minmax(0, 658px); gap: 38px; width: min(1060px, calc(100% - 48px)); margin: 0 auto; align-items: start; }
.booking-summary { position: sticky; top: 118px; background: #fff; color: #242424; border-radius: 12px; padding: 30px 30px 28px; box-shadow: 0 18px 50px rgba(18, 22, 24, .16); }
.booking-brand { display: flex; align-items: center; gap: 14px; padding-bottom: 22px; border-bottom: 1px solid #e9e4dc; }
.booking-brand img { width: 106px; height: auto; filter: invert(1); }
.booking-brand span { font: 600 11px/16px var(--sans); color: #6e6962; }
.booking-summary h2 { margin: 26px 0 18px; font: 400 31px/38px var(--serif); }
.booking-summary dl { margin: 0; }
.booking-summary dl > div { display: flex; justify-content: space-between; gap: 20px; padding: 13px 0; border-top: 1px solid #eee9e2; }
.booking-summary dt { color: #716b64; font: 600 12px/20px var(--sans); }
.booking-summary dd { margin: 0; max-width: 190px; text-align: right; font: 400 14px/20px var(--sans); }
.summary-help { margin: 24px 0 0; color: #5f5a50; font: 400 13px/20px var(--sans); }
.summary-help a { color: #2c3134; text-decoration: underline; }
.booking-nav { display: flex; justify-content: space-between; align-items: center; gap: 14px; margin-top: 28px; }
.booking-nav .send { margin-top: 0; }
.back-step { min-height: 46px; padding: 0; border: 0; background: transparent; color: #4a4a4a; font: 600 13px/20px var(--sans); text-decoration: underline; cursor: pointer; }
.back-step[disabled] { visibility: hidden; }
.done h2 { margin-bottom: 14px; }
.done .btn { margin-top: 20px; }

.pol h2 { font: 400 52px/62.4px var(--serif); letter-spacing: -1.6px; text-transform: uppercase; color: var(--gold); text-align: center; padding: 26px 0 0; }
.pol .body { width: 1100px; max-width: 100%; margin: 24px auto 0; padding: 0 20px 90px; text-align: center; font: 400 14px/26px var(--sans); }
.pol .body p { margin-bottom: 4px; }
.pol .body h3 { font: 400 30px/40px var(--serif); color: var(--gold); margin: 36px 0 14px; }
.pol .body strong { font-weight: 700; }

/* ---------- Scroll reveal ---------- */
.js .rv { opacity: 0; transform: translateY(30px); transition: opacity .8s ease, transform .8s ease; }
.js .rv.in { opacity: 1; transform: none; }
.js .hero-reveal { transition-duration: 1s; }
.js .hero-reveal.in .eyebrow { animation: float-in .65s ease both; }
.js .hero-reveal.in h1 { animation: float-in .8s .12s ease both; }
.js .hero-reveal.in .btn { animation: float-in .7s .28s ease both; }
.js .s-brunch .text.rv.in > h2 { animation: float-in .65s ease both; }
.js .s-brunch .text.rv.in > .when { animation: float-in .65s .10s ease both; }
.js .s-brunch .text.rv.in > .copy { animation: float-in .7s .20s ease both; }
.js .s-brunch .text.rv.in > .btn { animation: float-in .65s .30s ease both; }
@keyframes float-in { from { opacity: 0; transform: translateY(22px); } to { opacity: 1; transform: none; } }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } .js .rv { opacity: 1; transform: none; transition: none; } .js .hero-reveal.in .eyebrow, .js .hero-reveal.in h1, .js .hero-reveal.in .btn, .js .s-brunch .text.rv.in > *, .hdr.stuck { animation: none; } }

/* ---------- Tablet and phone ---------- */
@media (max-width: 1100px) {
  .logo img { width: 110px; height: auto; }
  .nav { display: none; position: absolute; left: 0; right: 0; top: 100%; margin: 0; flex-direction: column; background: rgba(9, 12, 15, .98); padding: 8px 24px 18px; border-bottom: 1px solid rgba(255, 255, 255, .1); max-height: 80vh; overflow: auto; }
  .nav.open { display: flex; }
  .nav a, .nav .subtoggle { padding: 13px 0; width: 100%; }
  .dd { position: static; width: 100%; background: transparent; box-shadow: none; opacity: 1; visibility: visible; transform: none; display: none; padding-left: 14px; }
  .has-sub.open > .dd { display: block; }
  .dd a { color: #fff; border: 0; padding: 10px 0; }
  .phone span { display: none; }
  .book-btn { width: auto; height: 46px; padding: 0 16px; margin-right: 0; }
  .book-btn span { width: auto; font-size: 12px; line-height: 14px; }
  .book-btn svg { display: none; }
  .burger { display: grid; place-items: center; }
  .hdr { padding-top: 14px; height: 90px; }
  .hdr .row { height: 50px; }
  .hdr > .row, .hdr .row { padding: 0 16px; }
  .logo { margin-top: 0; align-self: center; }
}
@media (max-width: 1024px) {
  .hero { min-height: 0; padding: 150px 0 90px; }
  .hero-in { padding: 0 24px; }
  .hero h1, .hero.banner h1 { font-size: clamp(44px, 12vw, 110px); line-height: 1.02; letter-spacing: -2px; margin-top: 18px; }
  .hero .btn { margin-left: 0; }
  .wm { font-size: clamp(64px, 17vw, 250px); line-height: 1; height: auto; top: 10px; letter-spacing: -3px; }
  .sec { padding-top: 90px; }
  .sec-head { padding: 0 20px; }
  .sec-head h2 { font-size: clamp(30px, 7vw, 52px); line-height: 1.2; letter-spacing: -1px; }
  .s-why, .s-best, .s-try, .s-vouch, .s-collab, .s-brunch { min-height: 0; padding-bottom: 70px; }
  .s-gap { display: none; }
  .two, .about-grid, .contact-grid, .book-wrap .contact-grid { grid-template-columns: 1fr; padding-left: 24px; padding-right: 24px; }
  .s-gal .pic, .s-brunch .pic { width: 100%; height: auto; aspect-ratio: 3 / 2; }
  .s-gal .logo-big { margin-top: 30px; }
  .s-brunch .text { padding-top: 10px; }
  .logos { grid-template-columns: 1fr; gap: 24px; }
  .pair, .menu-pics { grid-template-columns: 1fr; padding: 0 20px; }
  .menu-pics img, .pair img { width: 100%; height: auto; aspect-ratio: 3 / 2; }
  .s-pair { min-height: 0; padding: 20px 0 40px; }
  .ftr { min-height: 0; padding: 70px 0 30px; }
  .ftr-grid { grid-template-columns: minmax(0, 1fr); gap: 40px; padding: 0 24px; }
  .ftr .about { width: auto; }
  .ftr .flogo { width: 220px; height: auto; }
  .ftr-bottom { grid-template-columns: 1fr; margin: 50px 24px 0; text-align: left; gap: 0; }
  .ftr-bottom a:last-child { justify-self: start; }
  .phero, .phero.tall { height: auto; padding: 150px 20px 50px; }
  .phero h1 { font-size: clamp(36px, 9vw, 60px); line-height: 1.15; }
  .booking-shell { grid-template-columns: 1fr; width: min(658px, calc(100% - 40px)); }
  .booking-summary { position: static; }
  .about-grid { padding: 50px 0 80px; }
  .about-grid p { max-width: none; }
  .track img { height: 300px; }
  .menu-pg { padding: 60px 0; min-height: 0; }
  .menu-pg h2 { font-size: clamp(34px, 8vw, 60px); line-height: 1.15; }
  .menu-btns { grid-template-columns: 1fr; gap: 14px; justify-items: center; }
  .mlist { padding: 0 20px; }
  .mlist h2 { font-size: clamp(30px, 7vw, 52px); line-height: 1.2; }
  .mrow { grid-template-columns: 1fr 56px 56px; }
  .brunch h2 { font-size: clamp(32px, 8vw, 52px); line-height: 1.2; }
  .brunch .days { font-size: 18px; letter-spacing: 1.5px; padding: 0 16px; }
  .dishes { column-count: 1; padding: 0 24px; }
  .gallery3 { grid-template-columns: 1fr; padding: 0 20px 60px; }
  .gallery3 img { width: 100%; height: auto; aspect-ratio: 2 / 3; max-height: 560px; }
  .formcard { padding: 36px 24px 50px; min-height: 0; }
  .contact h2.t { margin-top: 0; }
  .contact { padding: 50px 0 80px; }
  .f-row { grid-template-columns: 1fr; gap: 0; }
  .pol .body { padding: 0 20px 70px; }
}

/* Phones: the original shows only the logo and a menu button, no watermarks, and tighter sections */
@media (max-width: 767px) {
  .logo img { width: 124px; }
  .book-btn { display: none; }
  .wm { display: none; }
  .hero { padding: 130px 0 70px; }
  .hero h1, .hero.banner h1 { font-size: clamp(40px, 13vw, 80px); }
  .eyebrow { gap: 14px; }
  .eyebrow::before { width: 26px; }
  .eyebrow h6, .eyebrow p { font-size: 15px; line-height: 20px; }
  .booking-shell { width: calc(100% - 32px); gap: 20px; }
  .booking-summary { padding: 22px; }
  .booking-brand { align-items: flex-start; flex-direction: column; gap: 8px; }
  .formcard { padding: 38px 24px 44px; }
  .f-row { grid-template-columns: 1fr; gap: 0; }
  .booking-nav { align-items: stretch; flex-direction: column-reverse; }
  .booking-nav .send { width: 100%; padding: 0 20px; }
  .back-step { min-height: 38px; }
  .sec { padding-top: 60px; }
  .sec-head { padding-top: 0; }
  .sec-head h2 { font-size: clamp(24px, 6.4vw, 40px); }
  .sec-head .sub { font-size: 16px; line-height: 28px; }
  .s-why, .s-best, .s-try, .s-vouch, .s-collab { padding-bottom: 50px; }
  .s-gal { padding: 24px 0 60px; }
  .s-gal .logo-big { width: 140px; height: auto; margin: 24px auto 0; }
  .s-gal .copy, .s-brunch .copy { max-width: none; }
  .s-brunch h2 { font-size: clamp(24px, 6.8vw, 43px); line-height: 1.2; margin-top: 18px; }
  .s-brunch { padding-bottom: 60px; }
  .logos img { width: 160px; height: 100px; }
  .logos { margin-top: 30px; gap: 14px; }
}
