/* Scoped to this local intro. All content pages remain unchanged. */
@font-face {
  font-family: 'Changa Intro ExtraLight';
  font-style: normal;
  font-weight: 200;
  font-display: swap;
  src: url('/corporate/release-969f2b73ad17/fonts/changa-extralight.ttf') format('truetype');
}
[data-profile-preview] svg[data-intro-photo-ready] > g[mask="url(#sindibad-world-scroll-exterior)"] > rect {
  fill: url(#preview-intro-photograph);
}
#preview-intro-photograph image { filter: brightness(.9025); }
[data-profile-preview] { --profile-safe-bottom: env(safe-area-inset-bottom, 0px); }

/* Block native image callouts before and after the intro enhancement mounts.
   These rules end with the intro; content links and form fields are untouched. */
[data-edition="editorial"] main:not([data-profile-intro-ended]),
[data-edition="editorial"] main:not([data-profile-intro-ended]) * {
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  user-select: none;
}
[data-edition="editorial"] main:not([data-profile-intro-ended]) :is(img, svg, image) {
  pointer-events: none;
}
[data-profile-touch-surface] {
  position: absolute;
  z-index: 1;
  inset: 0;
  background: transparent;
  pointer-events: auto;
}
[data-profile-intro-ended] [data-profile-touch-surface] {
  display: none;
  pointer-events: none;
}

/* The original phrase is removed in this preview, including its layout space. */
[data-edition="editorial"] main > div > p > span {
  display: none;
}

[data-profile-arrow-anchor] {
  width: 8.125em;
  height: 3.05836em;
}

[data-edition="editorial"] main > div > p > button[aria-label="Explore the Sindibad profile"],
[data-edition="editorial"] main > div > p > button[aria-label="Explore the Sindibad profile"]:hover,
[data-edition="editorial"] main > div > p > button[aria-label="Explore the Sindibad profile"]:active {
  color: #fff;
  top: calc(100% + .1rem);
  translate: 0 var(--profile-arrow-lift, 0px);
  /* Layout correction is immediate. The arrow's own SVG bounce is unchanged;
     an inherited transition-all must not interpolate measured coordinates. */
  transition-property: color, background-color, border-color, box-shadow, opacity, transform;
  opacity: 0;
  visibility: hidden;
}

[data-profile-branding] {
  position: absolute;
  z-index: 2;
  left: 50%;
  width: max-content;
  max-width: calc(100% - 32px);
  transform: translateX(-50%);
  color: #fff;
  text-align: center;
  pointer-events: none;
  font-family: Changa, 'Noto Kufi Arabic', Tahoma, Arial, sans-serif;
}
[data-edition="editorial"] main [data-preview-intro-logo] {
  display: block;
  width: var(--profile-logo-width);
  height: auto;
  margin-inline: auto;
  aspect-ratio: 619 / 233;
  overflow: hidden;
  pointer-events: none;
}

[data-profile-title] {
  width: max-content;
  margin: var(--profile-gap) auto 0;
  color: #fff;
  font-size: calc(clamp(16px, 1.7vw, 22px) - 4px);
  font-family: 'Changa Intro ExtraLight', Changa, sans-serif;
  font-weight: 200;
  font-synthesis: none;
  line-height: var(--profile-title-height);
  letter-spacing: var(--profile-title-tracking, .2em);
  direction: ltr;
  white-space: nowrap;
  clip-path: inset(0 100% 0 0);
}
[data-profile-measure] {
  position: absolute;
  visibility: hidden;
  pointer-events: none;
  display: block;
  width: max-content;
  white-space: nowrap;
  font-size: clamp(16px, 1.7vw, 22px);
  font-style: normal;
  direction: ltr;
}
[data-profile-measure="original"] {
  font-family: Changa, 'Noto Kufi Arabic', Tahoma, Arial, sans-serif;
  font-weight: 400;
  letter-spacing: .015em;
}
[data-profile-measure="thin"] {
  font-size: calc(clamp(16px, 1.7vw, 22px) - 4px);
  font-family: 'Changa Intro ExtraLight', Changa, sans-serif;
  font-weight: 200;
  font-synthesis: none;
  letter-spacing: 0;
}

/* Background → logo sheen → writing → arrow → language choice. The arrow SVG
   retains its independent 2-second invitation motion. */
[data-profile-ready] [data-logo-base] { animation: profile-logo-rest 12s ease-in-out 12.12s infinite; }
[data-profile-ready] [data-logo-sheen] { animation: profile-sheen 12s ease-in-out 12.12s infinite; }
[data-profile-ready] [data-profile-title] { animation: profile-writing 1.15s steps(15, end) 1.7s both; }
[data-profile-ready] [data-profile-arrow-anchor] > button[aria-label] { animation: profile-appear .45s ease 2.95s both; }
[data-edition="editorial"] main[data-profile-entry-state]:not([data-profile-entry-state="intro"]) [data-profile-arrow-anchor] > button[aria-label] {
  animation: none;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
}
[data-profile-languages] {
  position: absolute;
  z-index: 3;
  left: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: var(--profile-language-gap, 21px);
  transform: translateX(-50%);
  translate: 0 var(--profile-language-lift, 0px);
  transition: translate .32s cubic-bezier(.22, 1, .36, 1);
  pointer-events: auto;
}
[data-profile-languages][hidden], [data-profile-language-notice][hidden] { display: none; }
/* Fail closed before intro geometry is available, including direct links and
   reloads on any content page. Keep layout measurable, unlike display:none.
   The corner logo is outside these selectors and remains untouched. */
main[data-profile-preview]:not([data-profile-elements-visible]) [data-profile-branding],
main[data-profile-preview]:not([data-profile-elements-visible]) [data-profile-languages],
main[data-profile-preview]:not([data-profile-elements-visible]) [data-profile-language-notice],
main[data-profile-preview]:not([data-profile-elements-visible]) [data-profile-arrow-anchor] > button[aria-label] {
  opacity: 0 !important;
  visibility: hidden !important;
  pointer-events: none !important;
}
button[data-profile-language] {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 44px;
  height: 44px;
  padding: 0;
  border: 0;
  border-radius: 50%;
  color: #fff;
  background: transparent;
  font-family: Changa, 'Noto Kufi Arabic', sans-serif;
  font-size: 20px;
  font-weight: 500;
  line-height: 1;
  cursor: pointer;
  touch-action: manipulation;
  animation: profile-language-appear .4s ease both;
}
button[data-profile-language] svg { display: block; flex: none; pointer-events: none; }
button[data-profile-language] circle {
  r: var(--profile-circle-radius, 20px);
  transition: r .32s cubic-bezier(.22, 1, .36, 1);
}
[data-language-glyph] {
  font-family: Changa, 'Noto Kufi Arabic', sans-serif;
  font-size: 20px;
  font-weight: 500;
  letter-spacing: 0;
  text-anchor: start;
  dominant-baseline: alphabetic;
}
button[data-profile-language="en"] { --language-start: 12px; }
button[data-profile-language="ar"] { --language-start: -12px; }
button[data-profile-language]:hover { transform: scale(1.05); }
button[data-profile-language]:focus-visible { outline: 1px solid #fff; outline-offset: 5px; }
[data-profile-language-notice] {
  position: absolute;
  z-index: 3;
  left: 50%;
  width: min(320px, calc(100% - 32px));
  transform: translateX(-50%);
  margin: 0;
  color: #fff;
  font: 12px/1.6 Changa, sans-serif;
  text-align: center;
  animation: profile-notice-appear .32s ease both;
}
@keyframes profile-notice-appear {
  from { opacity: 0; translate: 0 4px; }
  to { opacity: 1; translate: 0 0; }
}
[data-profile-preview][data-paused="true"] [data-logo-base],
[data-profile-preview][data-paused="true"] [data-logo-sheen],
[data-profile-preview][data-paused="true"] [data-profile-title],
[data-profile-preview][data-paused="true"] [data-profile-arrow-anchor] > button[aria-label] { animation-play-state: paused; }
[data-profile-intro-ended] [data-logo-base],
[data-profile-intro-ended] [data-logo-sheen] { animation-play-state: paused; }
@keyframes profile-logo-rest {
  0%, 14%, 100% { opacity: 1; }
  3%, 9% { opacity: .88; }
}
@keyframes profile-sheen {
  0% { opacity: 0; clip-path: polygon(-30% 0, -8% 0, -20% 100%, -42% 100%); }
  2% { opacity: 1; }
  12% { opacity: 1; clip-path: polygon(120% 0, 142% 0, 130% 100%, 108% 100%); }
  13%, 100% { opacity: 0; clip-path: polygon(120% 0, 142% 0, 130% 100%, 108% 100%); }
}
@keyframes profile-language-appear {
  from { opacity: 0; translate: var(--language-start) 0; }
  to { opacity: 1; translate: 0 0; }
}
@keyframes profile-writing {
  0% { clip-path: inset(0 100% 0 0); }
  99.99% { clip-path: inset(0 0 0 0); }
  /* Remove the clipping layer after writing. Do not leave the final E on a
     fractional WebKit text/compositor boundary. Typography stays unchanged. */
  100% { clip-path: none; }
}
@keyframes profile-appear {
  from { opacity: 0; visibility: hidden; }
  to { opacity: 1; visibility: visible; }
}
@media (prefers-reduced-motion: reduce) {
  [data-profile-languages], button[data-profile-language] circle { transition: none; }
  [data-profile-language-notice] { animation: none; }
  [data-profile-ready] [data-logo-base],
  [data-profile-ready] button[data-profile-language],
  [data-profile-ready][data-profile-entry-state="intro"] [data-profile-arrow-anchor] > button[aria-label] { animation: none; opacity: 1; visibility: visible; }
  [data-profile-ready] [data-profile-title] { animation: none; clip-path: none; }
  [data-profile-ready] [data-logo-sheen] { animation: none; opacity: 0; }
}
