:root {
  --night:#0d2737;
  --gulf:#154b62;
  --teal:#2e7777;
  --pearl:#f7f3e9;
  --sand:#cbb79c;
  --coral:#db765f;
  --ink:#13232b;
  --muted:#617078;
  --line:rgba(19,35,43,.22);
  --display: Georgia, "Times New Roman", serif;
  --body: -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif;
}
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; background:var(--pearl); color:var(--ink); font-family:var(--body); line-height:1.65; }
img { display:block; width:100%; height:auto; }
a { color:inherit; text-underline-offset:.22em; }
a:focus-visible { outline:.2rem solid var(--pearl); outline-offset:.15rem; box-shadow:0 0 0 .5rem var(--night); }
.skip-link { position:fixed; inset-block-start:.75rem; inset-inline-start:.75rem; z-index:40; min-height:2.75rem; padding:.65rem 1rem; background:var(--pearl); color:var(--night); transform:translateY(-180%); font-weight:800; }
.skip-link:focus { transform:none; }
.site-header { min-height:4.75rem; display:flex; align-items:center; justify-content:space-between; gap:1.5rem; padding:.75rem clamp(1rem,4vw,4.5rem); position:sticky; inset-block-start:0; z-index:30; background:rgba(247,243,233,.96); border-block-end:1px solid var(--line); }
.brand { min-height:2.75rem; display:flex; align-items:center; gap:.65rem; font-family:var(--display); font-weight:700; text-decoration:none; }
.brand-mark { width:1.1rem; height:1.1rem; border:1px solid var(--gulf); border-radius:50%; box-shadow:inset 0 0 0 .25rem var(--pearl),inset 0 0 0 .35rem var(--teal); }
.brand span:last-child { padding-inline-start:.65rem; border-inline-start:1px solid var(--line); font-family:var(--body); font-size:.9rem; }
.site-header nav { display:flex; flex-wrap:wrap; justify-content:flex-end; gap:.2rem 1.1rem; }
.site-header nav a { min-height:2.75rem; display:inline-flex; align-items:center; font-size:.76rem; font-weight:800; text-decoration:none; }
.hero { min-height:calc(100svh - 4.75rem); position:relative; display:grid; align-items:end; isolation:isolate; overflow:hidden; color:var(--pearl); }
.hero > img { position:absolute; inset:0; z-index:-3; width:100%; height:100%; object-fit:cover; }
.hero::before { content:""; position:absolute; inset:0; z-index:-2; background:linear-gradient(90deg,rgba(7,24,35,.9) 0%,rgba(7,24,35,.5) 48%,rgba(7,24,35,.08) 78%); }
.hero-copy { max-width:52rem; padding:clamp(4rem,8vw,8rem) clamp(1rem,7vw,7rem); }
.eyebrow { margin:0 0 1rem; color:var(--teal); font-size:.7rem; font-weight:900; letter-spacing:.18em; text-transform:uppercase; }
.hero .eyebrow { color:#8ed0c7; }
.arabic-name { margin:0; font-size:clamp(1.2rem,2vw,1.7rem); }
h1,h2,h3,p { margin-block-start:0; }
h1,h2,h3 { font-family:var(--display); line-height:1.02; }
h1 { max-width:6.5ch; margin-block-end:1rem; font-size:clamp(4.2rem,11vw,10rem); font-weight:400; letter-spacing:-.06em; }
.hero-line { max-width:29rem; font-family:var(--display); font-size:clamp(1.35rem,2.4vw,2.1rem); }
.disclosure { max-width:38rem; color:#d8e2e3; font-size:.8rem; }
.button { min-height:2.75rem; width:max-content; display:inline-flex; align-items:center; margin-block-start:1rem; padding:.7rem 1rem; border:1px solid rgba(247,243,233,.65); color:var(--pearl); font-weight:900; text-decoration:none; }
.portfolio-return { min-block-size:2.75rem; display:inline-flex; align-items:center; inline-size:fit-content; max-inline-size:calc(100% - 2rem); margin-inline:clamp(1rem,6vw,7rem); padding-block:.7rem; padding-inline:1rem; border:1px solid var(--line); background:var(--pearl); color:var(--night); font-weight:900; text-decoration:none; }
.portfolio-return:focus-visible { outline:.2rem solid var(--night); outline-offset:.25rem; }
.portfolio-return--top { margin-block:1rem; }
.portfolio-return--bottom { margin-block:clamp(2rem,5vw,5rem); }
.tide-line { position:absolute; width:120%; height:9rem; inset-inline-start:-10%; inset-block-end:-6rem; border:1px solid rgba(247,243,233,.4); border-radius:50%; }
.section { padding:clamp(4rem,8vw,8rem) clamp(1rem,6vw,7rem); scroll-margin-top:6rem; }
.section h2 { font-size:clamp(2.6rem,6vw,6rem); font-weight:400; letter-spacing:-.04em; }
.tide { display:grid; grid-template-columns:minmax(0,1.2fr) minmax(18rem,.8fr); gap:clamp(2rem,8vw,9rem); align-items:end; }
.tide h2 { max-width:15ch; margin-block-end:0; }
.tide-copy { max-width:38rem; padding-block-start:4rem; }
.food-feature { display:grid; grid-template-columns:minmax(0,1.25fr) minmax(18rem,.75fr); align-items:center; gap:clamp(2rem,7vw,8rem); background:#d9d1c1; }
.food-feature .eyebrow { color:var(--night); }
.food-feature img { min-height:34rem; object-fit:cover; border-radius:48% 48% 0 0; }
.food-feature h2 { max-width:10ch; }
.menu { background:var(--night); color:var(--pearl); position:relative; overflow:hidden; }
.menu .eyebrow { color:#8ed0c7; }
.menu::after { content:""; position:absolute; width:26rem; aspect-ratio:1; inset-inline-end:-10rem; inset-block-start:-10rem; border:1px solid rgba(247,243,233,.2); border-radius:50%; }
.menu-heading { max-width:58rem; position:relative; z-index:1; }
.menu-heading > p:last-child { color:#c5d2d3; }
.menu-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); margin-block-start:3rem; border-block-start:1px solid rgba(247,243,233,.26); position:relative; z-index:1; }
.menu-grid article { padding:2rem; border-inline-end:1px solid rgba(247,243,233,.26); border-block-end:1px solid rgba(247,243,233,.26); }
.menu-grid article:nth-child(even) { border-inline-end:0; }
.menu-grid span { color:#8ed0c7; font-size:.7rem; font-weight:900; letter-spacing:.14em; text-transform:uppercase; }
.menu-grid h3 { margin:1.15rem 0 .7rem; font-size:clamp(1.7rem,3vw,2.8rem); font-weight:400; }
.menu-grid p { color:#c5d2d3; }
.menu-grid b { font-size:.76rem; letter-spacing:.05em; }
.majlis { display:grid; grid-template-columns:minmax(18rem,.75fr) minmax(0,1.25fr); align-items:stretch; padding:0; background:var(--gulf); color:var(--pearl); }
.majlis-copy { padding:clamp(3rem,7vw,7rem); }
.majlis-copy .eyebrow { color:#9edbd1; }
.majlis img { height:100%; min-height:43rem; object-fit:cover; }
.visit { background:var(--sand); position:relative; overflow:hidden; }
.visit .eyebrow { color:var(--night); }
.visit::before { content:""; position:absolute; width:22rem; aspect-ratio:1; inset-inline-start:-10rem; inset-block-end:-12rem; border:1px solid rgba(19,35,43,.25); border-radius:50%; }
.visit > h2 { max-width:14ch; position:relative; }
.visit-grid { display:grid; grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr); gap:clamp(2rem,8vw,9rem); margin-block-start:3rem; position:relative; }
.visit-grid dl { margin:0; }
.visit-grid dl div { padding:1rem 0; border-block-start:1px solid rgba(19,35,43,.32); }
dt { font-size:.7rem; font-weight:900; letter-spacing:.13em; text-transform:uppercase; }
dd { margin:.35rem 0 0; }
.visit-grid a { min-height:2.75rem; display:flex; align-items:center; justify-content:space-between; gap:1rem; border-block-end:1px solid rgba(19,35,43,.32); font-weight:900; text-decoration:none; }
footer { display:flex; flex-wrap:wrap; justify-content:space-between; gap:1rem; padding:1.4rem clamp(1rem,6vw,7rem); background:var(--night); color:#c5d2d3; font-size:.74rem; }
[dir="rtl"] .hero::before { background:linear-gradient(270deg,rgba(7,24,35,.9) 0%,rgba(7,24,35,.5) 48%,rgba(7,24,35,.08) 78%); }
[dir="rtl"] .portfolio-return { direction:rtl; }

@media (max-width: 48rem) {
  .site-header { position:relative; align-items:flex-start; flex-direction:column; gap:.1rem; }
  .site-header nav { justify-content:flex-start; }
  .hero { min-height:45rem; }
  .hero::before { background:linear-gradient(0deg,rgba(7,24,35,.9),rgba(7,24,35,.14)); }
  h1 { font-size:clamp(3.8rem,21vw,6.5rem); }
  .tide,.food-feature,.majlis,.visit-grid { grid-template-columns:1fr; }
  .tide-copy { padding-block-start:0; }
  .food-feature img { min-height:22rem; }
  .menu-grid { grid-template-columns:1fr; }
  .menu-grid article,.menu-grid article:nth-child(even) { border-inline-end:0; }
  .majlis img { min-height:25rem; }
  .portfolio-return { display:flex; inline-size:calc(100% - 2rem); margin-inline:1rem; justify-content:center; text-align:center; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior:auto; }
  *,*::before,*::after { animation-duration:.01ms !important; animation-iteration-count:1 !important; transition-duration:.01ms !important; }
}