@font-face {
  font-family: "Instrument Serif";
  src: url("/fonts/instrument-serif.woff2") format("woff2");
  font-style: normal;
  font-weight: 400;
  font-display: swap;
}
@font-face {
  font-family: "Instrument Serif";
  src: url("/fonts/instrument-serif-italic.woff2") format("woff2");
  font-style: italic;
  font-weight: 400;
  font-display: swap;
}
@font-face {
  font-family: Inter;
  src: url("/fonts/inter.woff2") format("woff2");
  font-style: normal;
  font-weight: 400 700;
  font-display: swap;
}

:root {
  --font-ui: Inter, system-ui, sans-serif;
  --font-editorial: "Instrument Serif", var(--font-ui);
  --font-arabic: "Noto Sans Arabic", "Segoe UI", Tahoma, sans-serif;
  --type-hero: clamp(2.75rem, 1.73rem + 4.18vw, 5rem);
  --type-page: clamp(2.5rem, 1.71rem + 3.25vw, 4.25rem);
  --type-section: clamp(2.25rem, 1.68rem + 2.33vw, 3.5rem);
  --type-editorial: clamp(1.875rem, 1.65rem + .93vw, 2.375rem);
  --type-card: clamp(1.4375rem, 1.35rem + .35vw, 1.625rem);
  --type-body: clamp(1rem, .94rem + .23vw, 1.125rem);
  --type-control: clamp(1rem, .97rem + .12vw, 1.0625rem);
  --type-price: clamp(1.625rem, 1.51rem + .47vw, 1.875rem);
  --ink: #171717;
  --muted: #666;
  --paper: #fff;
  --white: #fff;
  --line: #e5e5e5;
  --sand: #f8f8f7;
  --sand-strong: #c5ad8c;
  --glass: #fff;
  --radius: 12px;
  --shadow: 0 2px 12px #1717170d;
}

body, body.operations {
  font-family: var(--font-ui);
  line-height: 1.6;
  background: var(--paper);
  color: var(--ink);
}
:lang(ar), :lang(ar) :is(h1,h2,h3,button,input,select,textarea) {
  font-family: var(--font-arabic);
}
:where(h1,h2,h3) { overflow-wrap: anywhere; }

body:not(.operations) h1,
.storefront #homePlanner .transfer-lead h1,
.storefront .stage-title h1,
body:not(.operations) h2,
.storefront .section-intro h2,
.storefront .transfer-section-intro h2,
.storefront .feature-banner h2,
.storefront .family-strip-heading h3 {
  font-family: var(--font-editorial);
  font-weight: 400;
  font-synthesis: none;
  line-height: 1.08;
  letter-spacing: 0;
}
body:not(.operations) h1,
.storefront #homePlanner .transfer-lead h1,
.storefront .stage-title h1 { font-size: var(--type-page); }

body:not(.operations) h2,
.storefront .section-intro h2,
.storefront .transfer-section-intro h2,
.storefront .feature-banner h2 { font-size: var(--type-section); }
.storefront .family-strip-heading h3 { font-size: var(--type-editorial); }

.storefront :is(.experience-card,.card,.sharm-attraction-card) h3 {
  font: 600 var(--type-card)/1.18 var(--font-ui);
  letter-spacing: -.02em;
}
.storefront :is(.result-card,.journey-checkout,#plannerTransfer) h2 {
  font: 600 clamp(1.25rem, 1.1rem + .5vw, 1.6rem)/1.2 var(--font-ui);
  letter-spacing: -.02em;
}
.storefront :is(.section-intro,.transfer-section-intro,.feature-banner,.transfer-lead,.attraction-detail-top,.sharm-attraction-copy,.card,.experience-card) p {
  font-size: var(--type-body);
  line-height: 1.6;
}
.storefront .site-header nav a { font-size: .9375rem; font-weight: 500; }
.storefront :is(button:not(.icon-button,.scene-button),.button,.book-link) {
  font-size: var(--type-control);
  font-weight: 600;
}
.storefront :is(input:not([type=checkbox],[type=radio]),select,textarea),
body.operations :is(input,select,textarea),
.storefront :is(#journey-search,#sightseeing-search) :is(input:not([type=checkbox],[type=radio]),select) {
  font-size: var(--type-control);
  font-weight: 400;
  min-width: 0;
}
.storefront :is(.result-card > strong,.price-total dd,.journey-total strong,.line-total strong) {
  font: 700 var(--type-price)/1.12 var(--font-ui);
  font-variant-numeric: tabular-nums;
  overflow-wrap: anywhere;
}
.storefront :is(.eyebrow,.kicker), .operations .eyebrow {
  letter-spacing: .05em;
  font-weight: 600;
}
.storefront :is(.experience-card,.sharm-attraction-card,.result-card,.feature-banner,.experience-feature) {
  border-radius: var(--radius);
}
.storefront .transfer-lead h1 span { color: inherit; }
.storefront :is(.section-intro,.transfer-section-intro) h2 { text-wrap: balance; }

@media (max-width: 560px) {
  .storefront .site-header nav { flex-wrap: wrap; row-gap: 3px; }
  .storefront .site-header nav a { padding-inline: 6px; }
}

/* Editorial headings across public pages; operational interfaces keep Inter. */
body.storefront:not(.operations) :is(main, #publicView) :is(h1, h2),
body.storefront .editorial-heading {
  font-family: var(--font-editorial);
  font-weight: 400;
  font-synthesis: none;
  letter-spacing: 0;
  line-height: 1.08;
}
body.storefront:not(.operations) :is(.result-card, .journey-checkout, #plannerTransfer, .planner-heading, .tour-booking) :is(h1,h2,h3) {
  font-family: var(--font-ui);
  font-weight: 600;
  line-height: 1.2;
}