/* 22 October 2026 — deliberate motion and an immersive geographic experience. */
:root { --motion-ease: cubic-bezier(.2,.75,.25,1); }
.hero-title, .hero-title span:nth-child(2) { animation: none; }
.hero-title span { display: block; animation: headline-rise .85s var(--motion-ease) both; }
.hero-title span:nth-child(2) { animation: headline-rise .85s .12s var(--motion-ease) both; }
.hero-copy-bottom { animation: content-rise .7s .24s var(--motion-ease) both; }
.cinema-hero .hero-media img { animation: landscape-settle 16s cubic-bezier(.16,.45,.35,1) both; }
.page-hero h1 { animation: headline-rise .75s var(--motion-ease) both; }
.page-hero .lead { animation: content-rise .65s .1s var(--motion-ease) both; }
.reveal { transition: opacity .65s var(--motion-ease), transform .8s var(--motion-ease); transition-delay: var(--reveal-delay,0ms); }
.reveal.is-pending { opacity: 0; transform: translateY(20px); }
.reveal.is-visible, .reveal:focus-within { opacity: 1; transform: none; }
.food-category, .award-proof, .team-profile { transition: background-color .35s, border-color .35s; }
.button .arrow, .text-link .arrow { transition: transform .28s var(--motion-ease); }
.button:hover .arrow, .text-link:hover .arrow { transform: translate(3px,-3px); }
.angus-editorial img, .development-sg > img { transition: transform 1.1s var(--motion-ease); }
.angus-editorial:hover img, .development-sg:hover > img { transform: scale(1.025); }
@keyframes headline-rise { from { opacity: 0; transform: translateY(22px); } to { opacity: 1; transform: translateY(0); } }
@keyframes content-rise { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } }
@keyframes landscape-settle { from { transform: scale(1.055); } to { transform: scale(1.015); } }
@keyframes region-arrive { from { opacity: 0; transform: translateY(9px); } to { opacity: 1; transform: none; } }

.global-journey.world-experience {
  display: block; padding: 0; margin: 0; color: var(--paper); background: rgb(8 25 30);
  box-shadow: none; clip-path: none; position: relative; overflow: hidden;
  scroll-margin-block-start: 1rem;
}
.world-stage { position: relative; min-block-size: 40rem; max-inline-size: 100rem; margin-inline: auto; isolation: isolate; }
.world-stage::before { content: ''; position: absolute; inset: 0; z-index: -2; background: radial-gradient(ellipse at 73% 47%,rgb(29 61 60 / .54),transparent 56%),linear-gradient(120deg,rgb(16 47 40 / .55),transparent 62%); }
.world-visual { position: absolute; inset: 0; z-index: -1; cursor: grab; }
.world-visual.is-dragging { cursor: grabbing; }
.world-visual canvas { position: absolute; inset: 0; display: block; inline-size: 100%; block-size: 100%; }
.world-visual [data-globe-routes] { pointer-events: none; }
.world-visual canvas[hidden] { display: none; }
.world-visual [data-globe-atlas] { display: none; }
.world-poster { position: absolute; left: var(--globe-x,69.5%); top: var(--globe-y,49%); inline-size: calc(var(--globe-radius,320px) * 2.22); max-inline-size: none; block-size: auto; transform: translate(-50%,-50%); transition: opacity .5s; }
.world-experience[data-ready=true] .world-poster { opacity: 0; pointer-events: none; }
.world-heading { position: absolute; top: 3.5rem; left: var(--gutter); inline-size: 31%; max-inline-size: 26rem; pointer-events: none; }
.world-heading .eyebrow { color: var(--gold); font-size: .7rem; }
.world-experience .world-heading h2 { font-size: clamp(2.8rem,4.4vw,4.5rem); line-height: 1.04; color: var(--paper); margin-block: 1.4rem; }
.world-heading > p { color: rgb(220 231 220 / .7); font-size: .95rem; line-height: 1.65; }
.world-region-card { position: absolute; bottom: 5.6rem; left: var(--gutter); inline-size: 31%; max-inline-size: 24rem; }
.world-region[hidden] { display: none; }
.world-region:not([hidden]) { animation: region-arrive .6s var(--motion-ease) both; }
.world-region-name { display: block; color: var(--gold); font-size: .75rem; letter-spacing: .13em; text-transform: uppercase; margin-block-end: .65rem; }
.world-region > .eyebrow { display: block; font-size: .63rem; letter-spacing: .05em; color: rgb(221 230 218 / .62); margin-block-end: 1rem; }
.world-experience .world-region h3 { color: var(--paper); font-size: clamp(1.7rem,2.3vw,2.6rem); line-height: 1.12; max-inline-size: 18ch; }
.world-region > p { font-size: .875rem; color: rgb(220 231 220 / .78); line-height: 1.7; margin-block: 1.2rem; max-inline-size: 38ch; }
.world-region .text-link { color: var(--paper); font-size: .8rem; margin-block-start: .2rem; }
.world-region .text-link .arrow { margin-inline-start: 1rem; color: var(--gold); }
.world-focus { position: absolute; top: 3.6rem; right: var(--gutter); display: flex; gap: .7rem; flex-direction: column; align-items: end; font-size: .6rem; letter-spacing: .14em; text-transform: uppercase; color: rgb(221 231 219 / .55); pointer-events: none; }
.world-focus > span:last-child { color: var(--gold); font-size: .7rem; letter-spacing: .05em; }
.world-tour { position: absolute; inset-inline: var(--gutter); bottom: 1.9rem; display: flex; align-items: center; justify-content: space-between; }
.world-tour-note { font-size: .65rem; color: rgb(220 231 220 / .5); letter-spacing: .06em; }
.world-tour button { display: inline-flex; gap: .7rem; align-items: center; min-block-size: 2.8rem; border: 1px solid rgb(224 231 215 / .25); color: var(--paper); background: rgb(10 31 33 / .7); padding: .6rem 1.2rem; border-radius: 99px; font-size: .75rem; transition: background .2s,border-color .2s; }
.world-tour button:hover { border-color: var(--gold); background: rgb(31 58 54); }
.world-tour button:disabled { cursor: default; opacity: .6; }
.world-tour button > span:first-child { color: var(--gold); }
.world-controls { border-block-start: 1px solid rgb(224 231 215 / .15); padding-block: 0 1.5rem; }
.world-controls .globe-stage-controls { display: grid; grid-template-columns: repeat(4,1fr); gap: 2rem; }
.world-controls .globe-stage-controls button { position: relative; display: flex; gap: .8rem; align-items: center; justify-content: start; min-block-size: 5rem; padding: 1.2rem 0; border: 0; border-radius: 0; background: transparent; color: rgb(224 232 219 / .58); font-size: .9rem; text-align: start; }
.world-controls .globe-stage-controls button[aria-pressed=true] { background: transparent; color: var(--paper); }
.world-controls .globe-stage-controls button:hover { color: var(--paper); }
.world-controls .world-tab-number { color: var(--gold); font-size: .65rem; }
.world-tab-track { position: absolute; bottom: 0; inset-inline: 0; block-size: 2px; background: rgb(224 231 215 / .13); }
.world-tab-track::after { content: ''; display: block; inline-size: 0; block-size: 100%; background: var(--gold); }
.world-controls button[aria-pressed=true] .world-tab-track::after { inline-size: calc(var(--tour-progress,0) * 100%); }
.world-experience[data-playing=false] .world-controls button[aria-pressed=true] .world-tab-track::after { inline-size: 100%; }
.world-controls .globe-disclaimer { max-inline-size: 100%; margin-block-start: 1.3rem; color: rgb(219 230 216 / .5); font-size: .65rem; line-height: 1.6; }
.world-experience :focus-visible { outline-color: var(--gold); }

.team-directory { padding-block-start: 0; }
.team-profile-grid { display: grid; grid-template-columns: 1fr 1fr; border-block-start: 1px solid var(--hairline); }
.team-profile { position: relative; display: grid; grid-template-columns: 2rem 1fr; gap: 1.8rem; align-items: center; min-block-size: 14rem; padding: 2.5rem 2rem; border-block-end: 1px solid var(--hairline); overflow: hidden; }
.team-profile:nth-child(odd) { border-inline-end: 1px solid var(--hairline); padding-inline-start: 0; }
.team-profile:nth-child(even) { padding-inline-start: 3rem; }
.team-profile-number { font-size: .75rem; color: var(--secondary); align-self: start; padding-block-start: .6rem; }
.team-profile-name { position: relative; z-index: 1; }
.team-profile h2 { font-size: clamp(1.8rem,2.8vw,2.8rem); font-weight: 500; max-inline-size: 14ch; }
.team-profile .team-role { font-size: .8125rem; margin-block-start: 1rem; }
.team-profile-initials { position: absolute; right: 1.3rem; bottom: -.6rem; color: rgb(25 64 45 / .04); font-size: 8.3rem; line-height: 1; letter-spacing: -.09em; font-weight: 600; pointer-events: none; }

@media (max-width: 1100px) and (min-width: 901px) {
  .world-stage { min-block-size: 40rem; }
  .world-region-card { inline-size: 32%; }
  .world-heading { inline-size: 34%; }
  .world-experience .world-heading h2 { font-size: 3.25rem; }
}
@media (max-width: 900px) {
  .world-stage { display: flex; flex-direction: column; min-block-size: 0; padding-block-start: 3rem; }
  .world-heading { position: static; inline-size: auto; max-inline-size: none; margin-inline: var(--gutter); order: 0; }
  .world-experience .world-heading h2 { font-size: clamp(2.8rem,6vw,4rem); margin-block: 1rem; }
  .world-heading > p { font-size: .9rem; }
  .world-visual { position: relative; inset: auto; inline-size: 100%; block-size: min(65vw,30rem); min-block-size: 22rem; margin-block: -1rem 0; order: 1; z-index: 0; }
  .world-focus { top: auto; right: var(--gutter); bottom: auto; margin-block-start: 1rem; position: static; order: 2; margin-inline: var(--gutter); flex-direction: row; justify-content: space-between; align-items: baseline; }
  .world-region-card { position: static; inline-size: auto; max-inline-size: none; margin: 2rem var(--gutter) 1.5rem; order: 3; min-block-size: 15rem; }
  .world-experience .world-region h3 { font-size: 2.2rem; max-inline-size: 22ch; }
  .world-region > p { max-inline-size: 56ch; font-size: .9rem; }
  .world-tour { position: static; order: 4; margin: 0 var(--gutter) 1.8rem; }
  .world-controls .globe-stage-controls { gap: 1rem; }
  .world-controls .globe-stage-controls button { gap: .6rem; font-size: .75rem; }
  .team-profile { min-block-size: 13rem; padding-inline: 1.2rem; gap: 1rem; }
  .team-profile:nth-child(even) { padding-inline-start: 2rem; }
}
@media (max-width: 600px) {
  .world-experience { scroll-margin-block-start: 1rem; }
  .world-experience .world-heading h2 { font-size: 3rem; }
  .world-visual { margin-block: -.3rem 0; block-size: 24rem; min-block-size: 0; }
  .world-focus { font-size: .5rem; letter-spacing: .08em; margin-block-start: 0; }
  .world-focus > span:last-child { font-size: .6rem; }
  .world-region-card { min-block-size: 17rem; margin-block-start: 1.8rem; }
  .world-experience .world-region h3 { font-size: 2rem; }
  .world-region > .eyebrow { max-inline-size: 38ch; font-size: .6rem; }
  .world-tour-note { max-inline-size: 13ch; font-size: .6rem; }
  .world-tour button { font-size: .7rem; }
  .world-controls .globe-stage-controls { grid-template-columns: 1fr 1fr; gap: 0 1.5rem; }
  .world-controls .globe-stage-controls button { min-block-size: 4rem; font-size: .8rem; }
  .world-controls .globe-disclaimer { font-size: .6rem; }
  .team-profile-grid { grid-template-columns: 1fr; }
  .team-profile:nth-child(n) { border-inline-end: 0; padding: 2rem 0; min-block-size: 11rem; grid-template-columns: 1.5rem 1fr; gap: 1rem; }
  .team-profile h2 { font-size: 2.1rem; }
  .team-profile-initials { font-size: 7rem; right: .5rem; }
}
@media (prefers-reduced-motion: reduce) {
  .world-region:not([hidden]) { animation: none; }
}
@media (forced-colors: active) {
  .world-experience { background: Canvas; color: CanvasText; }
  .world-heading h2,.world-region h3,.world-region p,.world-region-name { color: CanvasText !important; }
  .world-visual { opacity: .5; }
}
@media print {
  .world-experience { background: white; color: black; overflow: visible; }
  .world-stage { min-block-size: 0; }
  .world-visual,.world-focus,.world-tour,.world-controls .globe-stage-controls { display: none; }
  .world-heading,.world-region-card { position: static; inline-size: auto; max-inline-size: none; }
  .world-region[hidden] { display: block; }
  .world-region { break-inside: avoid; margin-block: 2rem; }
  .world-experience .world-region h3,.world-experience .world-heading h2,.world-region p { color: black; }
}

.geographic-market-map { background: transparent; }
.geographic-market-map .map-land { fill: rgb(156 175 153 / .3); stroke: rgb(243 239 230 / .75); stroke-width: .5; }
.geographic-market-map .map-point { fill: var(--forest); stroke: var(--paper); stroke-width: 2.5; }
.geographic-market-map .map-origin { fill: var(--green); stroke: var(--paper); stroke-width: 3; }
.geographic-market-map .map-text { fill: var(--forest); font-size: 11px; }
.geographic-market-map .map-text.origin { fill: var(--forest); }