/* ==========================================================================
   Europe26 DMC — visual layer: background graphics, motion, interactions.
   Loaded after site.css. Mobile-first. Every animation is decorative and is
   switched off under prefers-reduced-motion (bottom of file).
   ========================================================================== */

:root {
  --ease-out: cubic-bezier(.16, 1, .3, 1);
  --ease-spring: cubic-bezier(.34, 1.56, .64, 1);
  --emerald-950: #06281f;
  --emerald-900: #0d3a2e;
  --emerald-700: #1e5a45;
  --emerald-gold: #c39a2b;
  --sand: #f7f2e6;
  --glass: rgba(255, 255, 255, .1);
  --glass-line: rgba(255, 255, 255, .22);
  --r-xl: 32px;
}

/* ---------- Background graphics ---------- */
.bg-contours, .bg-dots, .aurora, .umrah-tiles { position: absolute; inset: 0; pointer-events: none; z-index: 0; }
.bg-contours { background: url("../img/fx/contours-light.svg") center / cover no-repeat; opacity: .9; }
.bg-contours.is-gold { background-image: url("../img/fx/contours.svg"); opacity: .14; mix-blend-mode: screen; }
.bg-dots {
  background-image: radial-gradient(rgba(27, 42, 90, .16) 1.2px, transparent 1.3px);
  background-size: 22px 22px;
  mask-image: radial-gradient(ellipse 70% 60% at 70% 40%, #000 20%, transparent 75%);
  -webkit-mask-image: radial-gradient(ellipse 70% 60% at 70% 40%, #000 20%, transparent 75%);
}
.aurora { overflow: hidden; filter: blur(60px) saturate(1.2); opacity: .75; }
.aurora span { position: absolute; border-radius: 50%; width: 46vmax; height: 46vmax; animation: drift 22s var(--ease) infinite alternate; }
.aurora span:nth-child(1) { background: radial-gradient(circle, rgba(212, 160, 23, .55), transparent 65%); left: -12vmax; top: -18vmax; }
.aurora span:nth-child(2) { background: radial-gradient(circle, rgba(47, 69, 133, .9), transparent 65%); right: -14vmax; top: -8vmax; animation-duration: 28s; animation-delay: -6s; }
.aurora span:nth-child(3) { background: radial-gradient(circle, rgba(200, 16, 46, .38), transparent 65%); left: 30%; bottom: -26vmax; animation-duration: 32s; animation-delay: -12s; }
.aurora.is-soft { opacity: .35; }
@keyframes drift {
  0% { transform: translate3d(0, 0, 0) scale(1); }
  50% { transform: translate3d(6vmax, 4vmax, 0) scale(1.12); }
  100% { transform: translate3d(-4vmax, 7vmax, 0) scale(.94); }
}
.ghost-word {
  position: absolute; z-index: 0; left: 50%; top: 2.5rem; margin: 0; transform: translateX(-50%);
  font-family: var(--font-display); font-weight: 600; font-size: clamp(6rem, 3rem + 16vw, 18rem); line-height: .8; letter-spacing: -.04em;
  color: transparent; -webkit-text-stroke: 1.5px rgba(27, 42, 90, .08); white-space: nowrap; pointer-events: none; user-select: none;
}

/* Grain over dark panels for depth */
.hx-frame::after, .page-hero-frame::after, .section-navy.why::after, .cta-band::after, .umrah-band::after, .site-footer::after, .para-band::after {
  content: ""; position: absolute; inset: 0; pointer-events: none; z-index: 1;
  background: url("../img/fx/noise.svg"); opacity: .08; mix-blend-mode: overlay;
}

/* Flight path */
.flight { position: absolute; left: 0; width: 100%; pointer-events: none; z-index: 1; overflow: visible; }
.flight-path { fill: none; stroke: rgba(255, 255, 255, .35); stroke-width: 1.5; stroke-dasharray: 2 9; stroke-linecap: round; vector-effect: non-scaling-stroke; }
.flight-trail { fill: none; stroke: var(--gold-400); stroke-width: 2; stroke-linecap: round; vector-effect: non-scaling-stroke; stroke-dasharray: 160 2400; animation: trail 16s linear infinite; opacity: .9; }
@keyframes trail { from { stroke-dashoffset: 2560; } to { stroke-dashoffset: 0; } }
.flight-plane path { fill: var(--gold-400); }
.flight-pin { fill: var(--gold-500); stroke: rgba(255, 255, 255, .6); stroke-width: 2; vector-effect: non-scaling-stroke; animation: pin 2.4s var(--ease) infinite; transform-box: fill-box; transform-origin: center; }
.flight-pin + .flight-pin { animation-delay: 1.2s; }
@keyframes pin { 0%, 100% { opacity: 1; transform: scale(1); } 50% { opacity: .5; transform: scale(1.6); } }

/* ---------- Scroll progress + back to top ---------- */
.scroll-progress { position: fixed; top: 0; left: 0; right: 0; height: 3px; z-index: 120; pointer-events: none; }
.scroll-progress span { display: block; height: 100%; background: linear-gradient(90deg, var(--gold-500), var(--red-600)); transform-origin: 0 50%; transform: scaleX(0); }

/* ---------- Header polish ---------- */
.site-header { transition: background-color var(--t), box-shadow var(--t), backdrop-filter var(--t); }
.site-header.is-scrolled { background: rgba(251, 248, 242, .82); backdrop-filter: saturate(1.4) blur(14px); -webkit-backdrop-filter: saturate(1.4) blur(14px); }
.main-nav .nav-link { position: relative; }
.main-nav .nav-link::after {
  content: ""; position: absolute; left: .9rem; right: .9rem; bottom: .35rem; height: 2px; border-radius: 2px;
  background: var(--gold-500); transform: scaleX(0); transform-origin: right; transition: transform 350ms var(--ease-out);
}
.main-nav .nav-link:hover::after, .main-nav .nav-link.is-active::after, .main-nav [aria-expanded="true"].nav-link::after { transform: scaleX(1); transform-origin: left; }
.nav-umrah { color: var(--emerald-700) !important; }
.mega, .dropdown { transform-origin: top center; }
.has-menu.is-open .mega-inner > *, .has-menu.is-open .dropdown li { animation: rise-in 420ms var(--ease-out) backwards; }
.has-menu.is-open .mega-inner > *:nth-child(2) { animation-delay: 50ms; }
.has-menu.is-open .mega-inner > *:nth-child(3) { animation-delay: 100ms; }
@keyframes rise-in { from { opacity: 0; transform: translateY(10px); } }

/* ---------- Buttons ---------- */
.btn { position: relative; overflow: hidden; isolation: isolate; border-radius: var(--r-full); transition: background-color var(--t-fast) var(--ease), color var(--t-fast) var(--ease), border-color var(--t-fast), box-shadow var(--t) var(--ease), transform 300ms var(--ease-out); }
.btn:hover { box-shadow: 0 10px 24px -10px rgba(18, 30, 69, .45); }
.btn-shine::before {
  content: ""; position: absolute; z-index: -1; top: 0; bottom: 0; left: -60%; width: 40%;
  background: linear-gradient(100deg, transparent, rgba(255, 255, 255, .55), transparent); transform: skewX(-20deg);
  animation: shine 4.5s var(--ease) infinite;
}
@keyframes shine { 0%, 70% { left: -60%; } 100% { left: 130%; } }
.btn-glass { --btn-bg: rgba(255, 255, 255, .12); --btn-fg: var(--white); --btn-bd: rgba(255, 255, 255, .35); backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px); }
.btn-glass:hover { --btn-bg: var(--white); --btn-fg: var(--navy-900); --btn-bd: var(--white); }
.text-link { position: relative; text-decoration: none !important; }
.text-link::after { content: ""; position: absolute; left: 0; right: 1.4rem; bottom: .55rem; height: 1.5px; background: currentColor; transform: scaleX(0); transform-origin: right; transition: transform 350ms var(--ease-out); }
.text-link:hover::after { transform: scaleX(1); transform-origin: left; }
.badge { border-radius: var(--r-full); }

/* ---------- Home hero ---------- */
.hx { position: relative; padding: 0 8px; }
@media (min-width: 768px) { .hx { padding: 0 14px; } }
.hx-frame {
  position: relative; isolation: isolate; overflow: hidden; border-radius: 0 0 var(--r-xl) var(--r-xl);
  min-height: min(92svh, 880px); display: flex; flex-direction: column; justify-content: flex-end;
  background: var(--navy-950); color: var(--white); padding-top: var(--s-9);
}
@media (min-width: 768px) { .hx-frame { border-radius: var(--r-xl); margin-top: 6px; } }
.hx-slides, .hx-slide { position: absolute; inset: 0; margin: 0; }
.hx-slide { opacity: 0; transition: opacity 1.4s var(--ease); }
.hx-slide img { width: 100%; height: 100%; object-fit: cover; transform: scale(1.12); }
.hx-slide.is-active { opacity: 1; }
.hx-slide.is-active img { animation: kenburns var(--interval, 7000ms) linear forwards; }
.hx-slide:first-child { opacity: 1; }
.fx .hx-slide:first-child:not(.is-active) { opacity: 0; }
@keyframes kenburns { from { transform: scale(1.14) translate3d(1%, 1%, 0); } to { transform: scale(1.02) translate3d(-1%, -.5%, 0); } }
.hx-shade { position: absolute; inset: 0; z-index: 0; background:
  radial-gradient(ellipse 80% 60% at 20% 80%, rgba(11, 20, 48, .85), transparent 70%),
  linear-gradient(180deg, rgba(11, 20, 48, .55) 0%, rgba(11, 20, 48, .15) 35%, rgba(11, 20, 48, .75) 100%); }
.hx-contours { position: absolute; inset: -40px; z-index: 0; background: url("../img/fx/contours.svg") center / cover no-repeat; opacity: .16; mix-blend-mode: screen; transition: translate 600ms var(--ease-out); }
.hx-flight { top: 18%; height: 36%; opacity: .9; }
.hx-inner { position: relative; z-index: 2; display: grid; gap: var(--s-6); align-items: end; padding-bottom: var(--s-6); }
@media (min-width: 1024px) { .hx-inner { grid-template-columns: minmax(0, 1.5fr) minmax(0, 1fr); padding-bottom: var(--s-7); } }
.hx-kicker {
  display: inline-flex; flex-wrap: wrap; align-items: center; gap: .5rem; margin: 0 0 var(--s-5); padding: .45rem .95rem .45rem .7rem;
  border-radius: var(--r-full); background: var(--glass); border: 1px solid var(--glass-line); backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px);
  font-size: var(--fs-xs); font-weight: 650; letter-spacing: .08em; text-transform: uppercase; color: rgba(255, 255, 255, .92);
}
.hx-kicker .sep { color: var(--gold-400); }
.pulse { position: relative; width: 8px; height: 8px; border-radius: 50%; background: var(--gold-400); flex-shrink: 0; }
.pulse::after { content: ""; position: absolute; inset: -4px; border-radius: 50%; border: 2px solid var(--gold-400); animation: ping 2s var(--ease) infinite; }
@keyframes ping { from { transform: scale(.6); opacity: 1; } to { transform: scale(2.2); opacity: 0; } }
.hx h1 { color: var(--white); font-size: clamp(2.75rem, 1.4rem + 6vw, 6.25rem); font-weight: 420; line-height: .98; letter-spacing: -.035em; margin: 0 0 var(--s-5); max-width: 13ch; text-wrap: balance; }
.hx h1 em { font-style: italic; color: var(--gold-400); font-weight: 380; }
.hx .lead { color: rgba(255, 255, 255, .88); margin-bottom: var(--s-6); max-width: 54ch; }
.hx-copy > * { animation: rise-in 900ms var(--ease-out) backwards; }
.hx-copy > .hx-kicker { animation-delay: 100ms; }
.hx-copy > .lead { animation-delay: 650ms; }
.hx-copy > .btn-row { animation-delay: 800ms; }
.hx-copy > h1 { animation: none; }

.hx-route {
  display: none; position: relative; align-self: end; justify-self: end; max-width: 380px; gap: var(--s-4); align-items: center;
  padding: var(--s-4); border-radius: var(--r-lg); background: rgba(255, 255, 255, .12); border: 1px solid var(--glass-line);
  backdrop-filter: blur(16px) saturate(1.3); -webkit-backdrop-filter: blur(16px) saturate(1.3); color: var(--white); text-decoration: none;
  animation: float-y 7s ease-in-out infinite, rise-in 900ms 1s var(--ease-out) backwards; transition: background var(--t), translate 600ms var(--ease-out);
}
.hx-route:hover { background: rgba(255, 255, 255, .2); color: var(--white); }
@media (min-width: 1024px) { .hx-route { display: flex; } }
.hx-route-media { width: 84px; height: 84px; border-radius: 18px; overflow: hidden; flex-shrink: 0; }
.hx-route-media img { width: 100%; height: 100%; object-fit: cover; }
.hx-route-tag { display: inline-flex; gap: .35rem; align-items: center; font-size: var(--fs-xs); color: var(--gold-400); font-weight: 650; letter-spacing: .04em; text-transform: uppercase; }
.hx-route strong { display: block; font-family: var(--font-display); font-weight: 500; font-size: 1.1rem; line-height: 1.25; margin: .3rem 0; }
.hx-route .route { color: rgba(255, 255, 255, .8); font-size: var(--fs-xs); }
@keyframes float-y { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-10px); } }

.hx-dots { position: relative; z-index: 2; display: flex; gap: var(--s-4); padding-bottom: calc(var(--s-8) + 24px); }
.hx-dot { flex: 1; max-width: 220px; background: none; border: 0; padding: .5rem 0; color: rgba(255, 255, 255, .65); text-align: left; cursor: pointer; font: inherit; }
.hx-dot-label { display: block; font-size: var(--fs-xs); font-weight: 600; margin-bottom: .45rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; transition: color var(--t); }
.hx-dot-bar { display: block; height: 2px; background: rgba(255, 255, 255, .25); border-radius: 2px; overflow: hidden; }
.hx-dot-bar span { display: block; height: 100%; background: var(--gold-400); transform: scaleX(0); transform-origin: left; }
.hx-dot.is-active { color: var(--white); }
.hx-dot.is-active .hx-dot-bar span { animation: bar var(--interval, 7000ms) linear forwards; }
.hx-dot:hover { color: var(--white); }
@keyframes bar { to { transform: scaleX(1); } }
@media (max-width: 639px) { .hx-dot-label { display: none; } .hx-dots { gap: var(--s-2); } }

/* Trip finder (overlaps the hero bottom) */
.finder {
  position: relative; z-index: 5; margin-top: calc(var(--s-8) * -1); display: grid; gap: 2px; padding: 8px;
  background: var(--white); border-radius: var(--r-lg); box-shadow: 0 30px 60px -24px rgba(11, 20, 48, .45), 0 0 0 1px rgba(27, 42, 90, .06);
  animation: rise-in 900ms 1.1s var(--ease-out) backwards;
}
@media (min-width: 768px) { .finder { grid-template-columns: repeat(3, minmax(0, 1fr)) auto; align-items: stretch; border-radius: var(--r-full); padding: 8px 8px 8px 12px; } }
.finder-field { position: relative; display: flex; flex-direction: column; justify-content: center; padding: .55rem 1rem; border-radius: var(--r-md); transition: background var(--t); min-width: 0; }
.finder-field:hover, .finder-field:focus-within { background: var(--ivory); }
@media (min-width: 768px) {
  .finder-field { border-radius: var(--r-full); padding: .5rem 1.25rem; }
  .finder-field + .finder-field::before { content: ""; position: absolute; left: 0; top: 22%; bottom: 22%; width: 1px; background: var(--line); }
}
.finder label { display: inline-flex; align-items: center; gap: .35rem; font-size: var(--fs-xs); font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--gold-700); }
.finder select { appearance: none; -webkit-appearance: none; border: 0; background: transparent; padding: .15rem 1.4rem .15rem 0; font: inherit; font-weight: 600; color: var(--ink); cursor: pointer; min-height: 32px; width: 100%;
  background-image: linear-gradient(45deg, transparent 50%, var(--navy-800) 50%), linear-gradient(135deg, var(--navy-800) 50%, transparent 50%);
  background-position: calc(100% - 8px) 55%, calc(100% - 3px) 55%; background-size: 5px 5px; background-repeat: no-repeat; }
.finder select:focus { outline: none; }
.finder-field:focus-within { box-shadow: inset 0 0 0 2px var(--gold-500); }
.finder-submit { margin: 4px; }
@media (min-width: 768px) { .finder-submit { margin: 0; padding-inline: 1.75rem; } }

/* ---------- Kinetic marquee ---------- */
.kinetic { overflow: hidden; padding-block: clamp(2rem, 1rem + 4vw, 4rem) 0; mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent); -webkit-mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent); }
.kinetic-track { display: flex; align-items: center; gap: clamp(1rem, .5rem + 2vw, 2.5rem); width: max-content; will-change: transform; }
.kinetic-track span { font-family: var(--font-display); font-size: clamp(2.5rem, 1.6rem + 4vw, 5.5rem); font-weight: 450; letter-spacing: -.03em; line-height: 1.1; color: var(--navy-800); white-space: nowrap; transition: color var(--t); }
.kinetic-track span.is-outline { color: transparent; -webkit-text-stroke: 1.4px var(--navy-800); font-style: italic; }
.kinetic-track span:hover { color: var(--gold-500); -webkit-text-stroke-color: var(--gold-500); }
.kinetic-star { width: clamp(1.25rem, 1rem + 1vw, 2rem); height: clamp(1.25rem, 1rem + 1vw, 2rem); color: var(--gold-500); flex-shrink: 0; animation: spin 10s linear infinite; }
.fx-reduced .kinetic-track, html:not(.fx) .kinetic-track { animation: none; }

/* ---------- Intro split + collage ---------- */
.intro-split { position: relative; overflow: hidden; }
.intro-split .container { position: relative; z-index: 1; }
.collage { position: relative; min-height: 380px; max-width: 560px; margin-inline: auto; width: 100%; }
@media (min-width: 640px) { .collage { min-height: 520px; } }
.collage-a { position: absolute; left: 0; top: 0; width: 68%; aspect-ratio: 4 / 5; border-radius: 200px 200px var(--r-lg) var(--r-lg); overflow: hidden; box-shadow: var(--sh-3); }
.collage-b { position: absolute; right: 0; bottom: 0; width: 52%; aspect-ratio: 1; z-index: 2; }
.collage-b > div { width: 100%; height: 100%; border-radius: var(--r-lg); overflow: hidden; border: 6px solid var(--bg); box-shadow: var(--sh-3); }
.collage img { width: 100%; height: 100%; object-fit: cover; }
.collage-badge { position: absolute; z-index: 3; left: 52%; top: 8%; width: 116px; height: 116px; border-radius: 50%; background: var(--navy-800); color: var(--gold-400); display: grid; place-items: center; box-shadow: var(--sh-3); }
.collage-badge .icon { width: 30px; height: 30px; }
.spin-text { position: absolute; inset: 6px; width: calc(100% - 12px); height: calc(100% - 12px); animation: spin 18s linear infinite; }
.spin-text text { fill: var(--white); font: 700 10.5px var(--font-body); letter-spacing: 2.6px; }
.collage-ring { position: absolute; z-index: 0; right: 6%; top: 4%; width: 46%; aspect-ratio: 1; border-radius: 50%; border: 1.5px dashed rgba(212, 160, 23, .6); }
@keyframes spin { to { transform: rotate(360deg); } }
.counter-row { list-style: none; padding: 0; margin: var(--s-6) 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--s-4); }
.counter-row li { padding: var(--s-4) 0 0; border-top: 2px solid var(--line); position: relative; }
.counter-row li::before { content: ""; position: absolute; top: -2px; left: 0; width: 40%; height: 2px; background: var(--gold-500); }
.counter-row strong { display: block; font-family: var(--font-display); font-size: clamp(2rem, 1.4rem + 2.4vw, 3.25rem); font-weight: 450; line-height: 1; color: var(--navy-800); letter-spacing: -.02em; font-variant-numeric: tabular-nums; }
.counter-row span { display: block; margin-top: .4rem; font-size: var(--fs-xs); color: var(--muted); font-weight: 600; line-height: 1.35; }

/* ---------- Services bento ---------- */
.services-bento { position: relative; }
.bento { display: grid; gap: var(--s-4); grid-template-columns: 1fr; }
@media (min-width: 640px) { .bento { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 1024px) { .bento { grid-template-columns: repeat(4, minmax(0, 1fr)); grid-auto-rows: minmax(210px, auto); } .bento-card.is-lead { grid-column: span 2; grid-row: span 2; } }
.bento-card {
  --mx: 50%; --my: 50%; position: relative; isolation: isolate; overflow: hidden; display: flex; flex-direction: column; gap: var(--s-3);
  padding: var(--s-5); border-radius: var(--r-lg); background: var(--ivory); border: 1px solid var(--line);
  transition: transform 450ms var(--ease-out), box-shadow var(--t), border-color var(--t);
}
.bento-card::before { content: ""; position: absolute; inset: 0; z-index: -1; opacity: 0; transition: opacity var(--t); background: radial-gradient(320px circle at var(--mx) var(--my), rgba(212, 160, 23, .22), transparent 60%); }
.bento-card:hover { transform: translateY(-6px); box-shadow: var(--sh-3); border-color: rgba(212, 160, 23, .5); }
.bento-card:hover::before { opacity: 1; }
.bento-icon { width: 54px; height: 54px; border-radius: 16px; display: grid; place-items: center; background: var(--navy-800); color: var(--gold-400); transition: transform 500ms var(--ease-spring), background var(--t); }
.bento-card:hover .bento-icon { transform: rotate(-8deg) scale(1.08); background: var(--gold-500); color: var(--navy-950); }
.bento-icon .icon { width: 24px; height: 24px; }
.bento-card h3 { font-size: 1.25rem; margin: auto 0 0; padding-top: var(--s-4); }
.bento-card h3 a { color: var(--ink); text-decoration: none; }
.bento-card h3 a::after { content: ""; position: absolute; inset: 0; z-index: 2; }
.bento-card p { margin: 0; font-size: var(--fs-small); color: var(--muted); }
.bento-arrow { position: absolute; top: var(--s-5); right: var(--s-5); width: 40px; height: 40px; border-radius: 50%; display: grid; place-items: center; border: 1px solid var(--line-strong); color: var(--navy-800); transition: transform 400ms var(--ease-out), background var(--t), color var(--t), border-color var(--t); }
.bento-card:hover .bento-arrow { transform: rotate(45deg); background: var(--navy-800); color: var(--white); border-color: var(--navy-800); }
.bento-card.is-lead { background: var(--navy-900); border-color: var(--navy-800); color: var(--navy-200); min-height: 340px; }
.bento-card.is-lead::after { content: ""; position: absolute; inset: 0; z-index: -2; background: url("../img/fx/contours.svg") center / cover; opacity: .16; }
.bento-card.is-lead h3 { font-size: var(--fs-h2); line-height: 1.1; }
.bento-card.is-lead h3 a { color: var(--white); }
.bento-card.is-lead p { color: var(--navy-200); font-size: var(--fs-body); max-width: 44ch; }
.bento-card.is-lead .bento-icon { background: var(--gold-500); color: var(--navy-950); width: 64px; height: 64px; }
.bento-card.is-lead .bento-arrow { border-color: rgba(255, 255, 255, .3); color: var(--white); }
.bento-card.is-lead:hover .bento-arrow { background: var(--gold-500); color: var(--navy-950); border-color: var(--gold-500); }
.bento-flight { top: 30%; height: 40%; opacity: .7; z-index: -1; }

/* ---------- Destination rail ---------- */
.dest-rail-section { position: relative; overflow: hidden; }
.dest-rail-section .container { position: relative; z-index: 1; }
.rail-controls { display: flex; gap: var(--s-2); }
.rail-btn { width: 52px; height: 52px; border-radius: 50%; display: grid; place-items: center; background: var(--white); border: 1px solid var(--line-strong); color: var(--navy-800); cursor: pointer; transition: background var(--t), color var(--t), transform 300ms var(--ease-out), opacity var(--t); }
.rail-btn:hover:not(:disabled) { background: var(--navy-800); color: var(--white); transform: scale(1.06); }
.rail-btn:disabled { opacity: .35; cursor: default; }
.rail { display: flex; gap: 20px; overflow-x: auto; scroll-snap-type: x mandatory; scroll-behavior: smooth; scrollbar-width: none; padding: 8px var(--gutter) 24px; margin-inline: calc(var(--gutter) * -1); scroll-padding-inline: var(--gutter); cursor: grab; perspective: 1200px; }
.rail::-webkit-scrollbar { display: none; }
.rail.is-dragging { cursor: grabbing; scroll-snap-type: none; scroll-behavior: auto; }
.rail.is-dragging * { pointer-events: none; }
.rail > * { flex: 0 0 min(76vw, 300px); scroll-snap-align: start; }
@media (min-width: 1280px) { .rail { margin-right: calc((100vw - var(--container)) / -2 - var(--gutter)); padding-right: 15vw; } }
.dest-tile {
  --rx: 0deg; --ry: 0deg; position: relative; aspect-ratio: 3 / 4; border-radius: var(--r-lg); overflow: hidden; background: var(--navy-900); color: var(--white);
  transform: rotateX(var(--rx)) rotateY(var(--ry)); transform-style: preserve-3d; transition: transform 500ms var(--ease-out), box-shadow var(--t);
  box-shadow: var(--sh-2);
}
.dest-tile:hover { box-shadow: 0 30px 50px -20px rgba(11, 20, 48, .55); }
.dest-tile .media { position: absolute; inset: 0; }
.dest-tile .media img { width: 100%; height: 100%; object-fit: cover; transition: transform 900ms var(--ease-out), filter 600ms; }
.dest-tile:hover .media img { transform: scale(1.08); }
.dest-tile::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(11, 20, 48, 0) 35%, rgba(11, 20, 48, .9) 100%); transition: opacity var(--t); }
.dest-tile-num { position: absolute; z-index: 2; top: var(--s-4); left: var(--s-4); font-family: var(--font-display); font-size: .95rem; padding: .2rem .65rem; border-radius: var(--r-full); background: rgba(255, 255, 255, .16); border: 1px solid var(--glass-line); backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px); }
.dest-tile-label { position: absolute; z-index: 2; inset: auto 0 0 0; padding: var(--s-5); transform: translateZ(30px); }
.dest-tile-label p { margin: 0 0 .2rem; font-size: var(--fs-xs); font-weight: 650; letter-spacing: .1em; text-transform: uppercase; color: var(--gold-400); }
.dest-tile h3 { margin: 0; font-size: clamp(1.5rem, 1.2rem + 1vw, 2rem); line-height: 1.1; }
.dest-tile h3 a { color: var(--white); text-decoration: none; }
.dest-tile h3 a::after { content: ""; position: absolute; inset: 0; z-index: 3; }
.dest-tile-more { display: inline-flex; align-items: center; gap: .4rem; margin-top: .6rem; font-size: var(--fs-small); font-weight: 600; color: rgba(255, 255, 255, .85); }
.dest-tile-more .icon { transition: transform 350ms var(--ease-out); }
.dest-tile:hover .dest-tile-more .icon { transform: translateX(6px); }
.dest-tile.is-all { background: var(--gold-500); color: var(--navy-950); }
.dest-tile.is-all::after { background: url("../img/fx/contours-light.svg") center / cover; opacity: 1; }
.dest-tile.is-all .dest-tile-label { top: 0; display: flex; flex-direction: column; justify-content: center; align-items: flex-start; gap: var(--s-3); }
.dest-tile.is-all h3 a, .dest-tile.is-all .dest-tile-more { color: var(--navy-950); }
.rail-progress { height: 3px; border-radius: 3px; background: var(--line); overflow: hidden; max-width: 320px; }
.rail-progress span { display: block; height: 100%; background: var(--navy-800); transform-origin: left; transform: scaleX(.2); transition: transform 200ms linear; }

/* ---------- Tabs ---------- */
.tab-list { position: relative; display: flex; gap: var(--s-2); overflow-x: auto; scrollbar-width: none; padding: 6px; margin: 0 calc(var(--gutter) * -1) var(--s-6); padding-inline: var(--gutter); }
@media (min-width: 768px) { .tab-list { display: inline-flex; margin-inline: 0; padding: 6px; border-radius: var(--r-full); background: var(--white); border: 1px solid var(--line); max-width: 100%; } }
.tab-list::-webkit-scrollbar { display: none; }
.tab-list [role="tab"] {
  position: relative; z-index: 1; display: inline-flex; align-items: center; gap: .45rem; flex-shrink: 0; min-height: 44px; padding: .55rem 1.1rem;
  border: 1px solid var(--line); border-radius: var(--r-full); background: var(--white); font: inherit; font-size: var(--fs-small); font-weight: 650; color: var(--slate-700); cursor: pointer; transition: color var(--t);
}
@media (min-width: 768px) { .tab-list [role="tab"] { border-color: transparent; background: transparent; } }
.tab-list [role="tab"][aria-selected="true"] { color: var(--white); background: var(--navy-800); border-color: var(--navy-800); }
@media (min-width: 768px) { .tabs-ready .tab-list [role="tab"][aria-selected="true"] { background: transparent; border-color: transparent; } }
.tab-indicator { display: none; }
@media (min-width: 768px) { .tabs-ready .tab-indicator { display: block; position: absolute; z-index: 0; top: 6px; bottom: 6px; left: 0; border-radius: var(--r-full); background: var(--navy-800); transition: transform 450ms var(--ease-out), width 450ms var(--ease-out); } }
.tab-panel.tab-in .tour-card { animation: rise-in 600ms var(--ease-out) backwards; }
.tab-panel.tab-in .tour-card:nth-child(2) { animation-delay: 60ms; }
.tab-panel.tab-in .tour-card:nth-child(3) { animation-delay: 120ms; }
.tab-panel.tab-in .tour-card:nth-child(4) { animation-delay: 180ms; }
.tab-panel.tab-in .tour-card:nth-child(5) { animation-delay: 240ms; }
.tab-panel.tab-in .tour-card:nth-child(6) { animation-delay: 300ms; }
.tab-more { margin: var(--s-5) 0 0; text-align: center; }

/* ---------- Cards polish ---------- */
.tour-card { border-radius: var(--r-lg); transition: box-shadow 400ms var(--ease), transform 500ms var(--ease-out), border-color var(--t); }
.tour-card:hover { transform: translateY(-8px); border-color: rgba(212, 160, 23, .45); box-shadow: 0 28px 50px -24px rgba(18, 30, 69, .4); }
.tour-card .media { position: relative; overflow: hidden; }
.tour-card .media::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, transparent 55%, rgba(11, 20, 48, .35)); opacity: 0; transition: opacity var(--t); }
.tour-card:hover .media::after { opacity: 1; }
.tour-card:hover .media img { transform: scale(1.08); }
.tour-card .media img { transition: transform 900ms var(--ease-out); }
.tour-card-foot .text-link .icon-arrow { transition: transform 350ms var(--ease-out); }
.tour-card:hover .tour-card-foot .text-link .icon-arrow { transform: translateX(6px); }
.tour-card-tags .badge { backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px); background: rgba(255, 255, 255, .88); }
.blog-card, .fleet-card, .soon-card, .office-card, .quote-card { border-radius: var(--r-lg); }
.blog-card:hover { transform: translateY(-6px); box-shadow: 0 24px 44px -22px rgba(18, 30, 69, .35); }
.blog-card .media { overflow: hidden; }
.blog-card .media img { transition: transform 900ms var(--ease-out); }
.blog-card:hover .media img { transform: scale(1.07); }

.journal-grid { display: grid; gap: var(--gap); }
@media (min-width: 768px) { .journal-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 1024px) { .journal-grid { grid-template-columns: 1.4fr 1fr 1fr; } .journal-grid .blog-card.is-feature .media { aspect-ratio: 4 / 3; } .journal-grid .blog-card.is-feature h3 { font-size: 1.6rem; } }

/* ---------- Why (navy) ---------- */
.why { position: relative; overflow: hidden; isolation: isolate; }
.why .container { position: relative; z-index: 2; }
.why-grid { display: grid; gap: var(--s-7); }
@media (min-width: 1024px) { .why-grid { grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: var(--s-8); align-items: start; } .why-head { position: sticky; top: calc(var(--header-h) + 32px); } }
.why .lead { color: var(--navy-200); margin-bottom: var(--s-6); }
.why-list { list-style: none; margin: 0; padding: 0; display: grid; gap: var(--s-4); }
@media (min-width: 640px) { .why-list { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.why-list li {
  --mx: 50%; --my: 50%; position: relative; overflow: hidden; padding: var(--s-5); border-radius: var(--r-lg);
  background: rgba(255, 255, 255, .04); border: 1px solid rgba(255, 255, 255, .1); transition: border-color var(--t), background var(--t), transform 450ms var(--ease-out);
}
.why-list li::before { content: ""; position: absolute; inset: 0; opacity: 0; transition: opacity var(--t); background: radial-gradient(260px circle at var(--mx) var(--my), rgba(212, 160, 23, .18), transparent 60%); }
.why-list li:hover { border-color: rgba(212, 160, 23, .45); transform: translateY(-4px); }
.why-list li:hover::before { opacity: 1; }
.why-num { position: absolute; right: var(--s-5); top: var(--s-4); font-family: var(--font-display); font-size: 2.75rem; line-height: 1; color: transparent; -webkit-text-stroke: 1px rgba(255, 255, 255, .2); }
.why-icon { position: relative; width: 48px; height: 48px; border-radius: 14px; display: grid; place-items: center; background: rgba(212, 160, 23, .14); color: var(--gold-400); margin-bottom: var(--s-4); }
.why-list h3 { position: relative; font-size: 1.15rem; margin: 0 0 .4rem; color: var(--white); }
.why-list p { position: relative; margin: 0; font-size: var(--fs-small); color: var(--navy-200); }

/* ---------- Parallax band ---------- */
.para-band { position: relative; isolation: isolate; overflow: hidden; min-height: clamp(440px, 70vh, 640px); display: flex; align-items: center; color: var(--white); margin-inline: 8px; border-radius: var(--r-xl); }
@media (min-width: 768px) { .para-band { margin-inline: 14px; } }
.para-media { position: absolute; inset: -18% 0; z-index: -2; }
.para-media img { width: 100%; height: 100%; object-fit: cover; }
.para-band::before { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(90deg, rgba(11, 20, 48, .88) 0%, rgba(11, 20, 48, .55) 50%, rgba(11, 20, 48, .1) 100%); }
.para-inner { position: relative; z-index: 2; padding-block: var(--s-8); }
.para-inner h2 { color: var(--white); font-size: clamp(2.25rem, 1.4rem + 3.6vw, 4.25rem); line-height: 1.02; letter-spacing: -.03em; max-width: 14ch; font-weight: 420; }
.para-inner .lead { color: rgba(255, 255, 255, .88); margin-bottom: var(--s-6); }
.para-inner .eyebrow { color: var(--gold-400); }

/* ---------- How it works flow ---------- */
.flow { --p: 0; position: relative; list-style: none; margin: 0; padding: 0; display: grid; gap: var(--s-6); counter-reset: none; }
.flow::before, .flow::after { content: ""; position: absolute; left: 31px; top: 32px; bottom: 32px; width: 2px; border-radius: 2px; }
.flow::before { background: repeating-linear-gradient(180deg, var(--line-strong) 0 4px, transparent 4px 10px); }
.flow::after { background: linear-gradient(180deg, var(--gold-500), var(--red-600)); transform-origin: top; transform: scaleY(var(--p)); }
.flow li { position: relative; z-index: 1; padding-left: 92px; min-height: 64px; }
.flow-icon { position: absolute; left: 0; top: 0; width: 64px; height: 64px; border-radius: 50%; display: grid; place-items: center; background: var(--white); border: 1px solid var(--line); color: var(--navy-800); box-shadow: var(--sh-2); transition: background 400ms, color 400ms, transform 500ms var(--ease-spring); }
.flow li.in-view .flow-icon { background: var(--navy-800); color: var(--gold-400); border-color: var(--navy-800); }
.flow li:hover .flow-icon { transform: scale(1.1) rotate(-6deg); }
.flow-n { position: absolute; top: -4px; right: -4px; width: 24px; height: 24px; border-radius: 50%; display: grid; place-items: center; background: var(--gold-500); color: var(--navy-950); font-size: .75rem; font-weight: 800; }
.flow h3 { font-size: 1.25rem; margin: .35rem 0 .4rem; }
.flow p { margin: 0; color: var(--muted); font-size: var(--fs-small); max-width: 40ch; }
@media (min-width: 1024px) {
  .flow { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--s-6); }
  .flow::before, .flow::after { left: 32px; right: 32px; top: 31px; bottom: auto; width: auto; height: 2px; }
  .flow::before { background: repeating-linear-gradient(90deg, var(--line-strong) 0 4px, transparent 4px 10px); }
  .flow::after { background: linear-gradient(90deg, var(--gold-500), var(--red-600)); transform-origin: left; transform: scaleX(var(--p)); }
  .flow li { padding-left: 0; padding-top: 88px; }
}

/* ---------- Umrah band (home) ---------- */
.umrah-band { position: relative; isolation: isolate; overflow: hidden; display: grid; gap: var(--s-6); padding: clamp(2rem, 1.2rem + 4vw, 4.5rem); border-radius: var(--r-xl); color: #dbe9e1;
  background: radial-gradient(ellipse 70% 90% at 100% 0%, rgba(195, 154, 43, .28), transparent 60%), linear-gradient(135deg, var(--emerald-900), var(--emerald-950)); }
@media (min-width: 900px) { .umrah-band { grid-template-columns: 1.5fr auto; align-items: center; } }
.umrah-tiles { background: url("../img/fx/girih-tile.svg") 0 0 / 96px 96px; opacity: .5; mask-image: linear-gradient(110deg, transparent 30%, #000 85%); -webkit-mask-image: linear-gradient(110deg, transparent 30%, #000 85%); animation: tiles 60s linear infinite; }
@keyframes tiles { to { background-position: 960px 480px; } }
.umrah-band .pattern { position: absolute; right: -60px; top: -60px; width: 360px; height: 360px; color: var(--emerald-gold); opacity: .4; pointer-events: none; z-index: 0; }
.spin-slow { animation: spin 80s linear infinite; }
.umrah-band-copy, .umrah-band .btn-row { position: relative; z-index: 2; }
.umrah-band h2 { color: var(--sand); }
.umrah-band .eyebrow { color: #e3c56b; }
.umrah-band .eyebrow::before { background: var(--emerald-gold); }
.umrah-band .arabic { font-family: var(--font-arabic); font-size: clamp(1.75rem, 1.3rem + 1.6vw, 2.6rem); color: #e3c56b; line-height: 1.6; margin: 0 0 .25rem; text-align: left; }
.umrah-points { list-style: none; margin: var(--s-5) 0 0; padding: 0; display: flex; flex-wrap: wrap; gap: var(--s-2); }
.umrah-points li { display: inline-flex; gap: .45rem; align-items: center; padding: .4rem .85rem; border-radius: var(--r-full); background: rgba(255, 255, 255, .08); border: 1px solid rgba(227, 197, 107, .3); font-size: var(--fs-small); color: var(--sand); }
.umrah-points .icon { color: #e3c56b; }

/* ---------- FAQ preview ---------- */
.faq-preview { position: relative; }
@media (min-width: 1024px) { .faq-preview .split { grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); } .faq-preview-head { position: sticky; top: calc(var(--header-h) + 32px); } }
.accordion-item { border-radius: var(--r-md); transition: background var(--t), box-shadow var(--t); }
.accordion-item[open] { box-shadow: var(--sh-2); }
.accordion-item .acc-icon { transition: transform 400ms var(--ease-out), background var(--t), color var(--t); }
.accordion-item[open] .acc-icon { transform: rotate(45deg); }
.accordion-item[open] .accordion-panel { animation: rise-in 400ms var(--ease-out); }

/* ---------- CTA band ---------- */
.cta-band { --mx: 50%; --my: 50%; isolation: isolate; border-radius: var(--r-xl); background: var(--navy-950); }
.cta-band::before { content: ""; position: absolute; inset: 0; z-index: 0; background: radial-gradient(420px circle at var(--mx) var(--my), rgba(212, 160, 23, .2), transparent 60%); pointer-events: none; }
.cta-band > .cta-copy, .cta-band > .btn-row { position: relative; z-index: 2; }
.cta-band .star-arc { z-index: 1; }
.cta-flight { top: 10%; height: 80%; opacity: .55; }
.cta-band h2 { font-size: clamp(2rem, 1.3rem + 2.8vw, 3.5rem); line-height: 1.05; letter-spacing: -.025em; font-weight: 430; max-width: 18ch; }

/* ---------- Inner page hero ---------- */
.page-hero { padding: 0 8px; background: none; overflow: visible; min-height: 0; display: block; }
@media (min-width: 768px) { .page-hero { padding: 0 14px; } }
.page-hero::after { display: none; }
.page-hero-frame {
  position: relative; isolation: isolate; overflow: hidden; border-radius: 0 0 var(--r-xl) var(--r-xl); background: var(--navy-950); color: var(--navy-200);
  min-height: clamp(300px, 42vh, 480px); display: flex; align-items: flex-end; padding-block: var(--s-8) var(--s-7);
}
@media (min-width: 768px) { .page-hero-frame { border-radius: var(--r-xl); margin-top: 6px; } }
.page-hero.has-image .page-hero-frame { min-height: clamp(360px, 56vh, 600px); }
.page-hero .page-hero-media { position: absolute; inset: -12% 0; z-index: -2; }
.page-hero .page-hero-media::after { display: none; }
.page-hero .page-hero-media img { width: 100%; height: 100%; object-fit: cover; animation: hero-zoom 14s var(--ease-out) forwards; }
@keyframes hero-zoom { from { transform: scale(1.15); } to { transform: scale(1); } }
.page-hero-shade { position: absolute; inset: 0; z-index: -1; background: radial-gradient(ellipse 80% 70% at 15% 100%, rgba(11, 20, 48, .9), transparent 70%), linear-gradient(180deg, rgba(11, 20, 48, .35), rgba(11, 20, 48, .7)); }
.page-hero.is-graphic .page-hero-shade { background: linear-gradient(180deg, transparent 40%, rgba(11, 20, 48, .5)); }
.page-hero .bg-contours { z-index: 0; inset: -30px; transition: translate 600ms var(--ease-out); }
.page-hero-flight { top: 8%; height: 55%; opacity: .7; }
.page-hero-inner { position: relative; z-index: 2; }
.page-hero h1 { color: var(--white); font-size: clamp(2.4rem, 1.5rem + 4vw, 4.75rem); font-weight: 420; line-height: 1; letter-spacing: -.03em; max-width: 18ch; text-wrap: balance; margin-bottom: var(--s-4); }
.page-hero .lead { color: rgba(255, 255, 255, .86); }
.page-hero .eyebrow { color: var(--gold-400); }
.page-hero .breadcrumb { color: rgba(255, 255, 255, .7); margin-bottom: var(--s-5); }
.page-hero .breadcrumb a { color: rgba(255, 255, 255, .8); }
.page-hero .breadcrumb a:hover { color: var(--white); }
.page-hero .breadcrumb [aria-current] { color: var(--white); }
.page-hero .hero-facts li { padding: .4rem .85rem; border-radius: var(--r-full); background: rgba(255, 255, 255, .1); border: 1px solid var(--glass-line); backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px); color: var(--white); }
.page-hero .btn-outline { --btn-fg: var(--white); --btn-bd: rgba(255, 255, 255, .55); }
.page-hero .btn-outline:hover { --btn-bg: var(--white); --btn-fg: var(--navy-900); }
.page-hero .btn-primary { --btn-bg: var(--gold-500); --btn-fg: var(--navy-950); --btn-bd: var(--gold-500); }
.page-hero-inner > .eyebrow, .page-hero-inner > .lead, .page-hero-inner > .hero-facts, .page-hero-inner > .btn-row, .page-hero-inner > nav { animation: rise-in 800ms var(--ease-out) backwards; }
.page-hero-inner > .lead { animation-delay: 450ms; }
.page-hero-inner > .hero-facts, .page-hero-inner > .btn-row { animation-delay: 600ms; }

/* ---------- Footer ---------- */
.site-footer { position: relative; isolation: isolate; overflow: hidden; border-radius: var(--r-xl) var(--r-xl) 0 0; margin-top: var(--s-6); }
.site-footer > .container, .site-footer > .footer-bottom { position: relative; z-index: 2; }
.site-footer .aurora { z-index: 0; }
.footer-wordmark {
  position: relative; z-index: 1; margin: var(--s-6) 0 calc(var(--s-6) * -1); text-align: center; white-space: nowrap; overflow: hidden;
  font-family: var(--font-display); font-weight: 600; font-size: clamp(4.5rem, 1rem + 17vw, 17rem); line-height: .8; letter-spacing: -.05em;
  color: transparent; -webkit-text-stroke: 1.2px rgba(212, 160, 23, .3); user-select: none; pointer-events: none;
  background: linear-gradient(180deg, rgba(212, 160, 23, .14), transparent 80%); -webkit-background-clip: text; background-clip: text;
}
.site-footer a { transition: color var(--t); }
.footer-col li a { position: relative; }
.footer-col li a:hover { padding-left: .35rem; }
.footer-col li a { transition: color var(--t), padding 300ms var(--ease-out); }
.social-links a { transition: transform 400ms var(--ease-spring), background var(--t), color var(--t); }
.social-links a:hover { transform: translateY(-3px) rotate(-6deg); }

/* ---------- Reveal variants (fx.js adds .in-view) ---------- */
.fx-ready [data-reveal="up"], .fx-ready [data-reveal="left"], .fx-ready [data-reveal="right"], .fx-ready [data-reveal="zoom"], .fx-ready [data-reveal="fade"] {
  opacity: 0; transition: opacity 900ms var(--ease-out), transform 1000ms var(--ease-out); transition-delay: calc(var(--i, 0) * 90ms);
}
.fx-ready [data-reveal="up"] { transform: translate3d(0, 40px, 0); }
.fx-ready [data-reveal="left"] { transform: translate3d(-48px, 0, 0); }
.fx-ready [data-reveal="right"] { transform: translate3d(48px, 0, 0); }
.fx-ready [data-reveal="zoom"] { transform: scale(.94); }
.fx-ready [data-reveal].in-view { opacity: 1; transform: none; }
.fx-ready [data-reveal="clip"] { clip-path: inset(100% 0 0 0 round var(--r-lg)); transition: clip-path 1200ms var(--ease-out); }
.fx-ready [data-reveal="clip"] img { transform: scale(1.25); transition: transform 1600ms var(--ease-out); }
.fx-ready [data-reveal="clip"].in-view { clip-path: inset(0 0 0 0 round var(--r-lg)); }
.fx-ready [data-reveal="clip"].in-view img { transform: scale(1); }
.collage-a[data-reveal="clip"].in-view { clip-path: inset(0 0 0 0 round 200px 200px var(--r-lg) var(--r-lg)); }

/* Split headline words */
.is-split .w { display: inline-block; overflow: hidden; vertical-align: top; padding: .04em .02em .22em; margin: -.04em -.02em -.22em; }
.is-split .wi { display: inline-block; transform: translate3d(0, 105%, 0); transition: transform 1000ms var(--ease-out); transition-delay: calc(var(--i, 0) * 70ms + 80ms); }
.is-split.in-view .wi { transform: none; }
html:not(.fx-ready) .is-split .wi { transform: none; }

/* ---------- Umrah page theme ---------- */
.theme-umrah { --bg: var(--sand); --heading: var(--emerald-900); --accent-text: #6f5512; --link: var(--emerald-700); --focus: 0 0 0 3px var(--sand), 0 0 0 5px var(--emerald-gold); }
.theme-umrah .eyebrow::before { background: var(--emerald-gold); }
.theme-umrah .btn-primary { --btn-bg: var(--emerald-700); --btn-bd: var(--emerald-700); }
.theme-umrah .btn-primary:hover { --btn-bg: var(--emerald-900); }
.theme-umrah .btn-outline { --btn-fg: var(--emerald-700); --btn-bd: var(--emerald-700); }
.theme-umrah .btn-outline:hover { --btn-bg: var(--emerald-700); --btn-fg: #fff; }
.theme-umrah .input:focus { border-color: var(--emerald-700); box-shadow: 0 0 0 3px rgba(195, 154, 43, .35); }
.theme-umrah .form-context { background: #ddebe3; color: var(--emerald-900); }
.theme-umrah .scroll-progress span { background: linear-gradient(90deg, var(--emerald-gold), var(--emerald-700)); }
.btn-emerald { --btn-bg: var(--sand); --btn-fg: var(--emerald-900); --btn-bd: var(--sand); }
.btn-emerald:hover { --btn-bg: #fff; --btn-fg: var(--emerald-900); }

.um-section-head { text-align: center; max-width: 720px; margin: 0 auto var(--s-7); }
.um-section-head .lead { margin-inline: auto; }
.um-ornament { display: flex; align-items: center; justify-content: center; gap: var(--s-4); color: var(--emerald-gold); margin-bottom: var(--s-4); }
.um-ornament::before, .um-ornament::after { content: ""; width: 60px; border-top: 1px solid currentColor; opacity: .6; }
.um-ornament .icon { width: 22px; height: 22px; animation: spin 20s linear infinite; }

.rites { list-style: none; margin: 0; padding: 0; display: grid; gap: var(--s-4); }
@media (min-width: 640px) { .rites { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 1100px) { .rites { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
.rite { --mx: 50%; --my: 50%; position: relative; overflow: hidden; isolation: isolate; padding: var(--s-6) var(--s-5) var(--s-5); border-radius: var(--r-lg); background: #fffdf8; border: 1px solid #e7dabf; transition: transform 500ms var(--ease-out), box-shadow var(--t), border-color var(--t); }
.rite::before { content: ""; position: absolute; inset: 0; z-index: -1; opacity: 0; transition: opacity var(--t); background: radial-gradient(260px circle at var(--mx) var(--my), rgba(195, 154, 43, .2), transparent 60%); }
.rite:hover { transform: translateY(-6px); box-shadow: 0 24px 40px -24px rgba(13, 58, 46, .45); border-color: var(--emerald-gold); }
.rite:hover::before { opacity: 1; }
.rite-step { display: block; font-family: var(--font-display); font-size: 3rem; line-height: 1; color: transparent; -webkit-text-stroke: 1px var(--emerald-gold); margin-bottom: var(--s-3); }
.rite .arabic-sm { font-family: var(--font-arabic); font-size: 1.6rem; color: var(--emerald-700); line-height: 1.3; display: block; margin-bottom: .2rem; }
.rite h3 { font-size: 1.25rem; margin: 0 0 .5rem; }
.rite p { margin: 0; font-size: var(--fs-small); color: var(--slate-700); }

.cities-duo { display: grid; gap: var(--s-5); }
@media (min-width: 900px) { .cities-duo { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.city-panel { position: relative; overflow: hidden; isolation: isolate; border-radius: var(--r-xl); padding: clamp(1.75rem, 1rem + 3vw, 3rem); min-height: 380px; display: flex; flex-direction: column; justify-content: flex-end; color: #dbe9e1; background: linear-gradient(160deg, var(--emerald-700), var(--emerald-950)); }
.city-panel.is-gold { background: linear-gradient(160deg, #8a6508, #3f2d05); }
.city-panel .umrah-tiles { opacity: .4; }
.city-panel .city-ar { position: absolute; z-index: 0; top: var(--s-5); right: var(--s-5); font-family: var(--font-arabic); font-size: clamp(3.5rem, 2rem + 6vw, 7rem); line-height: 1; color: rgba(227, 197, 107, .28); }
.city-panel > * { position: relative; z-index: 1; }
.city-panel h3 { color: var(--sand); font-size: var(--fs-h2); margin: 0 0 var(--s-3); }
.city-panel p { margin: 0 0 var(--s-4); max-width: 52ch; }
.city-panel ul { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: var(--s-2); }
.city-panel li { padding: .35rem .8rem; border-radius: var(--r-full); background: rgba(255, 255, 255, .1); border: 1px solid rgba(227, 197, 107, .3); font-size: var(--fs-xs); font-weight: 600; color: var(--sand); }

.um-services { display: grid; gap: var(--s-4); }
@media (min-width: 640px) { .um-services { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 1024px) { .um-services { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.um-service { display: flex; gap: var(--s-4); align-items: flex-start; padding: var(--s-5); border-radius: var(--r-lg); background: #fffdf8; border: 1px solid #e7dabf; transition: transform 450ms var(--ease-out), border-color var(--t); }
.um-service:hover { transform: translateY(-4px); border-color: var(--emerald-gold); }
.um-service .ic { width: 48px; height: 48px; border-radius: 14px; flex-shrink: 0; display: grid; place-items: center; background: var(--emerald-900); color: #e3c56b; transition: transform 500ms var(--ease-spring); }
.um-service:hover .ic { transform: rotate(-8deg) scale(1.08); }
.um-service h3 { font-size: 1.1rem; margin: 0 0 .3rem; }
.um-service p { margin: 0; font-size: var(--fs-small); color: var(--slate-700); }

.um-tiers { display: grid; gap: var(--s-5); }
@media (min-width: 900px) { .um-tiers { grid-template-columns: repeat(3, minmax(0, 1fr)); align-items: stretch; } }
.um-tier { position: relative; display: flex; flex-direction: column; gap: var(--s-4); padding: var(--s-6); border-radius: var(--r-xl); background: #fffdf8; border: 1px solid #e7dabf; transition: transform 500ms var(--ease-out), box-shadow var(--t); }
.um-tier:hover { transform: translateY(-8px); box-shadow: 0 30px 50px -30px rgba(13, 58, 46, .5); }
.um-tier.is-featured { background: var(--emerald-900); color: #dbe9e1; border-color: var(--emerald-900); }
.um-tier.is-featured h3 { color: var(--sand); }
.um-tier .tier-tag { align-self: flex-start; padding: .25rem .7rem; border-radius: var(--r-full); font-size: var(--fs-xs); font-weight: 700; letter-spacing: .08em; text-transform: uppercase; background: #ddebe3; color: var(--emerald-900); }
.um-tier.is-featured .tier-tag { background: #e3c56b; color: var(--emerald-950); }
.um-tier h3 { font-size: 1.6rem; margin: 0; }
.um-tier > p { margin: 0; font-size: var(--fs-small); }
.um-tier ul { list-style: none; margin: 0; padding: 0; display: grid; gap: .55rem; font-size: var(--fs-small); }
.um-tier li { display: flex; gap: .55rem; align-items: flex-start; }
.um-tier li .icon { color: var(--emerald-gold); flex-shrink: 0; margin-top: .2em; width: 1.05em; height: 1.05em; }
.um-tier .btn { margin-top: auto; align-self: flex-start; }
.um-tier .price-request { color: inherit; }

.seasons { display: grid; gap: var(--s-4); }
@media (min-width: 768px) { .seasons { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.season { padding: var(--s-5); border-radius: var(--r-lg); border: 1px solid #e7dabf; background: linear-gradient(180deg, #fffdf8, var(--sand)); }
.season .icon { color: var(--emerald-gold); width: 28px; height: 28px; margin-bottom: var(--s-3); }
.season h3 { font-size: 1.15rem; margin: 0 0 .35rem; }
.season p { margin: 0; font-size: var(--fs-small); }

.um-form-wrap { position: relative; display: grid; gap: var(--s-6); }
@media (min-width: 1024px) { .um-form-wrap { grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: var(--s-8); align-items: start; } .um-form-aside { position: sticky; top: calc(var(--header-h) + 24px); } }
.um-panel { background: #fffdf8; border: 1px solid #e7dabf; border-radius: var(--r-xl); padding: clamp(1.25rem, .8rem + 2vw, 2.5rem); box-shadow: 0 30px 60px -40px rgba(13, 58, 46, .5); }
.um-note { background: #ddebe3; border-radius: var(--r-lg); padding: var(--s-5); color: var(--emerald-900); font-size: var(--fs-small); display: flex; gap: var(--s-3); }
.um-note .icon { flex-shrink: 0; color: var(--emerald-700); margin-top: .2rem; }
.theme-umrah .prose { max-width: 72ch; }
.theme-umrah .prose h2 { color: var(--emerald-900); }
.theme-umrah .accordion-item { background: #fffdf8; border-color: #e7dabf; }

/* Generic content sections used on inner pages */
.feature-grid { display: grid; gap: var(--s-4); }
@media (min-width: 640px) { .feature-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 1024px) { .feature-grid.cols-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); } .feature-grid.cols-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
.feature { --mx: 50%; --my: 50%; position: relative; overflow: hidden; isolation: isolate; padding: var(--s-5); border-radius: var(--r-lg); background: var(--white); border: 1px solid var(--line); transition: transform 450ms var(--ease-out), box-shadow var(--t), border-color var(--t); }
.feature::before { content: ""; position: absolute; inset: 0; z-index: -1; opacity: 0; transition: opacity var(--t); background: radial-gradient(240px circle at var(--mx) var(--my), rgba(212, 160, 23, .16), transparent 60%); }
.feature:hover { transform: translateY(-5px); box-shadow: var(--sh-3); border-color: rgba(212, 160, 23, .45); }
.feature:hover::before { opacity: 1; }
.feature .ic { width: 48px; height: 48px; border-radius: 14px; display: grid; place-items: center; background: var(--navy-800); color: var(--gold-400); margin-bottom: var(--s-4); transition: transform 500ms var(--ease-spring); }
.feature:hover .ic { transform: rotate(-8deg) scale(1.08); }
.feature h3 { font-size: 1.15rem; margin: 0 0 .4rem; }
.feature p { margin: 0; font-size: var(--fs-small); color: var(--muted); }
.band-navy { position: relative; isolation: isolate; overflow: hidden; background: var(--navy-900); color: var(--navy-200); border-radius: var(--r-xl); padding: clamp(2rem, 1.2rem + 4vw, 4.5rem); }
.band-navy h2, .band-navy h3 { color: var(--white); }
.band-navy .eyebrow { color: var(--gold-400); }
.band-navy > *:not(.aurora):not(.bg-contours) { position: relative; z-index: 2; }
.band-navy .feature { background: rgba(255, 255, 255, .04); border-color: rgba(255, 255, 255, .1); }
.band-navy .feature p { color: var(--navy-200); }
.band-navy .feature .ic { background: rgba(212, 160, 23, .15); }
.quote-band { text-align: center; max-width: 900px; margin: 0 auto; }
.quote-band blockquote { margin: 0; font-family: var(--font-display); font-weight: 400; font-size: clamp(1.6rem, 1.1rem + 2vw, 2.6rem); line-height: 1.25; letter-spacing: -.01em; color: var(--ink); }
.quote-band blockquote em { color: var(--gold-700); }
.quote-band .icon { width: 44px; height: 44px; color: var(--gold-500); margin: 0 auto var(--s-4); }

/* ---------- Reduced motion ---------- */
@media (prefers-reduced-motion: reduce) {
  .aurora span, .flight-trail, .flight-pin, .pulse::after, .spin-text, .kinetic-star, .spin-slow, .umrah-tiles, .um-ornament .icon, .btn-shine::before, .hx-route { animation: none !important; }
  .flight-plane { display: none; }
  .hx-slide.is-active img, .page-hero .page-hero-media img { animation: none; transform: none; }
  .hx-copy > *, .finder, .page-hero-inner > * { animation: none !important; }
  .is-split .wi { transform: none !important; }
  .fx-ready [data-reveal] { opacity: 1 !important; transform: none !important; clip-path: none !important; }
  .tour-card:hover, .bento-card:hover, .why-list li:hover, .rite:hover, .um-tier:hover, .feature:hover, .dest-tile { transform: none !important; }
}
@media (min-width: 1024px) { .bento > .bento-card:nth-child(8):last-child, .bento > .bento-card:nth-child(6):last-child { grid-column: span 2; } }
.city-panel .eyebrow { color: #e3c56b; }
.city-panel .eyebrow::before { background: #e3c56b; }
.city-panel.is-gold .eyebrow { color: var(--sand); }
.city-panel.is-gold .eyebrow::before { background: var(--sand); }

/* ---------- Shared rich sections ---------- */
.big-counters { list-style: none; margin: 0; padding: 0; display: grid; gap: var(--s-6) var(--s-5); grid-template-columns: repeat(2, minmax(0, 1fr)); }
@media (min-width: 900px) { .big-counters { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
.big-counters li { position: relative; padding-left: var(--s-5); border-left: 1px solid rgba(255, 255, 255, .15); }
.big-counters .icon { color: var(--gold-400); width: 26px; height: 26px; margin-bottom: var(--s-3); }
.big-counters strong { display: block; font-family: var(--font-display); font-weight: 420; font-size: clamp(2.6rem, 1.6rem + 3.6vw, 4.75rem); line-height: 1; letter-spacing: -.03em; color: var(--white); font-variant-numeric: tabular-nums; }
.big-counters span { display: block; margin-top: .5rem; font-size: var(--fs-small); color: var(--navy-200); }
.photo-strip { overflow: hidden; padding-block: var(--s-4) var(--s-6); mask-image: linear-gradient(90deg, transparent, #000 6%, #000 94%, transparent); -webkit-mask-image: linear-gradient(90deg, transparent, #000 6%, #000 94%, transparent); }
.photo-strip-track { display: flex; gap: 16px; width: max-content; will-change: transform; }
.photo-strip figure { margin: 0; width: clamp(200px, 22vw, 320px); aspect-ratio: 4 / 3; border-radius: var(--r-lg); overflow: hidden; flex-shrink: 0; }
.photo-strip figure:nth-child(odd) { transform: translateY(18px) rotate(-1.5deg); }
.photo-strip figure:nth-child(even) { transform: rotate(1.5deg); }
.photo-strip img { width: 100%; height: 100%; object-fit: cover; transition: transform 700ms var(--ease-out); }
.photo-strip figure:hover img { transform: scale(1.08); }
.content-split { display: grid; gap: var(--s-7); }
@media (min-width: 1024px) { .content-split { grid-template-columns: minmax(0, 1fr) 340px; gap: var(--s-8); align-items: start; } .content-split > aside { position: sticky; top: calc(var(--header-h) + 24px); } }
.glance { position: relative; overflow: hidden; isolation: isolate; background: var(--navy-900); color: var(--navy-200); border-radius: var(--r-xl); padding: var(--s-6); display: grid; gap: var(--s-4); }
.glance > *:not(.bg-contours) { position: relative; z-index: 1; }
.glance h2, .glance h3 { color: var(--white); margin: 0; font-size: var(--fs-h3); }
.glance ul { list-style: none; margin: 0; padding: 0; display: grid; gap: var(--s-3); }
.glance li { display: flex; gap: .65rem; align-items: flex-start; font-size: var(--fs-small); }
.glance li .icon { color: var(--gold-400); flex-shrink: 0; margin-top: .2em; }
.glance .btn { justify-self: start; }
.prose-lg > p:first-of-type { font-size: var(--fs-lead); color: var(--ink); }
.prose-lg > p:first-of-type::first-letter { float: left; font-family: var(--font-display); font-size: 4.2em; line-height: .8; padding: .08em .1em 0 0; color: var(--gold-700); }
@media (prefers-reduced-motion: reduce) { .photo-strip-track { transform: none !important; } .photo-strip { overflow-x: auto; } }
.page-hero.has-image { display: block; min-height: 0; background: none; padding-block: 0; color: inherit; }

/* Service detail */
.included { margin-top: var(--s-7); }
.included h2 { font-size: var(--fs-h3); margin-bottom: var(--s-5); }
.included-grid { list-style: none; margin: 0; padding: 0; display: grid; gap: var(--s-3); }
@media (min-width: 640px) { .included-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.included-grid li { --mx: 50%; --my: 50%; position: relative; overflow: hidden; isolation: isolate; display: flex; gap: var(--s-3); align-items: center; padding: var(--s-4); border-radius: var(--r-md); background: var(--ivory); border: 1px solid var(--line); font-size: var(--fs-small); font-weight: 600; color: var(--ink); transition: border-color var(--t), transform 400ms var(--ease-out); }
.included-grid li::before { content: ""; position: absolute; inset: 0; z-index: -1; opacity: 0; transition: opacity var(--t); background: radial-gradient(200px circle at var(--mx) var(--my), rgba(212, 160, 23, .2), transparent 60%); }
.included-grid li:hover { border-color: rgba(212, 160, 23, .5); transform: translateX(4px); }
.included-grid li:hover::before { opacity: 1; }
.included-grid .ic { width: 40px; height: 40px; flex-shrink: 0; border-radius: 12px; display: grid; place-items: center; background: var(--navy-800); color: var(--gold-400); }
.included-grid .ic .icon { width: 20px; height: 20px; }
.service-layout { position: relative; z-index: 1; }
.aside-card.glance { background: var(--navy-900); }
.fleet-card { --rx: 0deg; --ry: 0deg; transform: perspective(900px) rotateX(var(--rx)) rotateY(var(--ry)); transition: transform 500ms var(--ease-out), box-shadow var(--t); }
.fleet-card:hover { box-shadow: var(--sh-3); }
.fleet-card .media { overflow: hidden; }
.fleet-card .media img { transition: transform 900ms var(--ease-out); }
.fleet-card:hover .media img { transform: scale(1.07); }
.form-card { border-radius: var(--r-xl); box-shadow: 0 30px 60px -40px rgba(18, 30, 69, .45); }

.pt-0 { padding-top: 0 !important; }
.contact-split { position: relative; z-index: 1; }
.style-chips { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: var(--s-2); }
.style-chips a { display: inline-flex; align-items: center; gap: .5rem; min-height: 44px; padding: .5rem 1rem; border-radius: var(--r-full); background: var(--white); border: 1px solid var(--line); color: var(--ink); font-weight: 600; font-size: var(--fs-small); text-decoration: none; transition: background var(--t), color var(--t), border-color var(--t), transform 400ms var(--ease-spring); }
.style-chips a span { font-size: var(--fs-xs); padding: .1rem .5rem; border-radius: var(--r-full); background: var(--navy-50); color: var(--navy-800); }
.style-chips a:hover { background: var(--navy-800); color: var(--white); border-color: var(--navy-800); transform: translateY(-3px); }
.style-chips a:hover span { background: var(--gold-500); color: var(--navy-950); }
.style-chips .icon { color: var(--gold-700); }
.style-chips a:hover .icon { color: var(--gold-400); }

/* FAQs */
.faq-page { position: relative; }
.faq-layout { position: relative; z-index: 1; max-width: calc(980px + var(--gutter) * 2); }
.faq-topics ul { list-style: none; margin: 0 0 var(--s-7); padding: 0; display: grid; gap: var(--s-3); grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); }
.faq-topics a { display: flex; gap: var(--s-3); align-items: center; padding: var(--s-4); border-radius: var(--r-lg); background: var(--ivory); border: 1px solid var(--line); text-decoration: none; color: var(--ink); transition: transform 400ms var(--ease-out), border-color var(--t), box-shadow var(--t); }
.faq-topics a:hover { transform: translateY(-4px); border-color: rgba(212, 160, 23, .5); box-shadow: var(--sh-2); }
.faq-topics .ic, .faq-group-title .ic { width: 44px; height: 44px; border-radius: 12px; flex-shrink: 0; display: grid; place-items: center; background: var(--navy-800); color: var(--gold-400); }
.faq-topics strong { display: block; font-size: var(--fs-small); }
.faq-topics small { display: block; font-size: var(--fs-xs); color: var(--muted); }
.faq-group-title { display: flex; align-items: center; gap: var(--s-3); margin-bottom: var(--s-4); }
.faq-group { scroll-margin-top: calc(var(--header-h) + 24px); margin-bottom: var(--s-7) !important; }

/* Journal */
.journal-grid.is-list { grid-template-columns: 1fr; }
@media (min-width: 768px) { .journal-grid.is-list { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 1024px) {
  .journal-grid.is-list { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .journal-grid.is-list .blog-card.is-feature { grid-column: 1 / -1; flex-direction: row; }
  .journal-grid.is-list .blog-card.is-feature .media { flex: 1.3; aspect-ratio: auto; min-height: 380px; }
  .journal-grid.is-list .blog-card.is-feature .blog-card-body { flex: 1; justify-content: center; padding: var(--s-7); }
  .journal-grid.is-list .blog-card.is-feature h2 { font-size: var(--fs-h2); }
}
.blog-card h2 { font-size: 1.3rem; margin: 0; }
.blog-card h2 a { color: var(--ink); text-decoration: none; }
.blog-card h2 a::after { content: ""; position: absolute; inset: 0; }
.blog-search .input { border-radius: var(--r-full); }
.post-body { position: relative; }
.reading-progress { position: sticky; top: var(--header-h); z-index: 20; height: 3px; margin-top: calc(var(--section-y) * -1); margin-bottom: calc(var(--section-y) - 3px); }
.reading-progress span { --p: 0; display: block; height: 100%; background: linear-gradient(90deg, var(--gold-500), var(--red-600)); transform-origin: left; transform: scaleX(var(--p)); }

/* Legal */
.toc { padding: var(--s-5); border-radius: var(--r-lg); background: var(--ivory); border: 1px solid var(--line); }
.toc ol { margin: 0; padding-left: 1.2rem; display: grid; gap: .35rem; font-size: var(--fs-small); }
.toc a { color: var(--navy-800); text-decoration: none; }
.toc a:hover { color: var(--gold-700); text-decoration: underline; }
.legal-layout .prose h2 { scroll-margin-top: calc(var(--header-h) + 24px); }
.glance .text-link.on-dark { color: var(--white); min-height: 0; }
.glance .text-link.on-dark:hover { color: var(--gold-400); }

/* 404 */
.error-hero .page-hero-frame { min-height: min(80svh, 720px); align-items: center; text-align: center; }
.error-hero .error-page h1 { margin-inline: auto; }
.error-hero .lead { margin-inline: auto; }
.error-hero .error-code { display: flex; justify-content: center; align-items: center; gap: .1em; color: var(--white); font-size: clamp(6rem, 3rem + 12vw, 12rem); margin-bottom: var(--s-3); }
.error-compass { width: .8em; height: .8em; color: var(--gold-400); animation: spin 14s linear infinite; }
.error-hero .inline-form { max-width: 520px; margin-inline: auto; }
.error-hero .inline-form .input { border-radius: var(--r-full); }
.error-hero .empty-actions .btn-outline { --btn-fg: var(--white); --btn-bd: rgba(255, 255, 255, .5); }
.error-hero .empty-actions .btn-outline:hover { --btn-bg: var(--white); --btn-fg: var(--navy-900); }

/* Coming soon */
.soon-hero { isolation: isolate; border-radius: 0 0 var(--r-xl) var(--r-xl); margin: 0 8px; }
@media (min-width: 768px) { .soon-hero { border-radius: var(--r-xl); margin: 6px 14px 0; } }
.soon-inner { position: relative; z-index: 2; }
.soon-hero h1 { font-size: clamp(2.4rem, 1.5rem + 4vw, 4.5rem); line-height: 1.02; letter-spacing: -.03em; }
.soon-card { --rx: 0deg; --ry: 0deg; transform: perspective(900px) rotateX(var(--rx)) rotateY(var(--ry)); transition: transform 500ms var(--ease-out), box-shadow var(--t); border-radius: var(--r-lg); }
.soon-card:hover { box-shadow: var(--sh-3); }
.soon-card .media { overflow: hidden; }
.soon-card .media img { transition: transform 900ms var(--ease-out); }
.soon-card:hover .media img { transform: scale(1.07); }
@media (prefers-reduced-motion: reduce) { .error-compass { animation: none; } }

/* Side reveals rise instead on narrow screens (no sideways overflow); clip stray overflow. */
html { overflow-x: clip; }
@media (max-width: 1023px) { .fx-ready [data-reveal="left"], .fx-ready [data-reveal="right"] { transform: translate3d(0, 40px, 0); } }
@media (max-width: 479px) { .hx-kicker .kick-extra { display: none; } .hx-kicker { font-size: .68rem; } }