/* Font files and SVGs are the unchanged assets already installed in GGAP. */
@font-face{font-family:'GGAP Hero Bebas';src:url('ggap/font/BebasNeue-Regular.ttf') format('truetype');font-style:normal;font-weight:400;font-display:swap}
@font-face{font-family:'GGAP Hero Poppins';src:url('ggap/font/Poppins-Regular.ttf') format('truetype');font-style:normal;font-weight:400;font-display:swap}
@font-face{font-family:'GGAP Hero Poppins';src:url('ggap/font/Poppins-Medium.ttf') format('truetype');font-style:normal;font-weight:500;font-display:swap}
@font-face{font-family:'GGAP Hero Poppins';src:url('ggap/font/Poppins-SemiBold.ttf') format('truetype');font-style:normal;font-weight:600;font-display:swap}

#ggap-home-hero { width:100%; }
#ggap-home-hero .ggap-page { --gg-white:#fff; --gg-ink:#202124; --gg-gold:#e7a72e; --gg-gold-text:var(--gg-gold); --gg-line:rgba(231,167,46,.28); font-family:'GGAP Hero Poppins',Arial,sans-serif; color:var(--gg-ink); background:var(--gg-white); width:100%; margin:0 auto; box-sizing:border-box; }
#ggap-home-hero .ggap-page * { box-sizing:border-box; }
#ggap-home-hero .ggap-hero { padding:44px 36px 42px; display:grid; grid-template-columns:minmax(0,.95fr) minmax(0,1.05fr); gap:25px; align-items:center; }
#ggap-home-hero .ggap-copy h1 { font-family:'GGAP Hero Bebas','Arial Narrow',Impact,sans-serif; font-size:clamp(32px,4.2vw,46px); font-weight:400; line-height:1.04; letter-spacing:-.015em; text-transform:uppercase; margin:0 0 22px; color:var(--gg-ink); }
#ggap-home-hero .ggap-copy h1 span { color:var(--gg-gold-text); }
#ggap-home-hero .ggap-copy p { font-size:14px; line-height:1.75; font-weight:400; margin:0; max-width:430px; color:#474747; }
#ggap-home-hero .ggap-orbit-region { container-type:inline-size; width:100%; max-width:500px; margin:0 auto; }
#ggap-home-hero .ggap-orbit { position:relative; width:100%; aspect-ratio:1; }
#ggap-home-hero .ggap-lines { position:absolute; inset:0; width:100%; height:100%; overflow:visible; }
#ggap-home-hero .ggap-spokes { stroke:var(--gg-line); stroke-width:1.25; }
#ggap-home-hero .ggap-track { fill:none; stroke:var(--gg-line); stroke-width:2; }
#ggap-home-hero .ggap-progress { fill:none; stroke:var(--gg-gold); stroke-width:2.4; stroke-linecap:round; stroke-dasharray:100; stroke-dashoffset:100; }
#ggap-home-hero .ggap-traveller { fill:var(--gg-gold); opacity:0; }
#ggap-home-hero .ggap-hub { position:absolute; left:50%; top:52.1739%; transform:translate(-50%,-50%); width:27%; aspect-ratio:1; border-radius:50%; background:white; border:1px solid #e9e5dc; display:flex; align-items:center; justify-content:center; box-shadow:0 6px 24px rgba(72,58,30,.07); transition:border-color .18s ease; }
#ggap-home-hero .ggap-hub img { width:83%; height:auto; position:relative; z-index:1; }
#ggap-home-hero .ggap-hub.is-current { border-color:var(--gg-gold); border-width:2px; }
#ggap-home-hero .ggap-phase { position:absolute; left:var(--x); top:var(--y); transform:translate(-50%,-50%); width:28%; min-width:128px; min-height:128px; aspect-ratio:1.05; filter:drop-shadow(0 4px 7px rgba(49,42,27,.08)); }
#ggap-home-hero .ggap-phase::before { content:''; position:absolute; inset:0; background:#e9e5dc; clip-path:polygon(13% 0,87% 0,100% 13%,100% 87%,87% 100%,13% 100%,0 87%,0 13%); transition:background .18s ease; }
#ggap-home-hero .ggap-phase-face { position:absolute; inset:1px; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:10px; background:var(--gg-white); clip-path:polygon(13% 0,87% 0,100% 13%,100% 87%,87% 100%,13% 100%,0 87%,0 13%); padding:15px 5px 8px; }
#ggap-home-hero .ggap-phase-face img { width:40%; height:42%; object-fit:contain; display:block; }
#ggap-home-hero .ggap-phase-face span { display:block; flex:0 0 auto; min-width:0; max-width:100%; white-space:normal; text-align:center; font-size:11px; line-height:1.4; font-weight:500; color:var(--gg-ink); }
#ggap-home-hero .ggap-phase b { position:absolute; left:50%; top:0; transform:translate(-50%,-50%); z-index:2; width:26px; height:25px; display:grid; place-items:center; background:var(--gg-gold); color:#332600; clip-path:polygon(25% 0,75% 0,100% 50%,75% 100%,25% 100%,0 50%); font:600 13px/1 'GGAP Hero Poppins',Arial,sans-serif; }
#ggap-home-hero .ggap-phase.is-current::before { background:var(--gg-gold); }
#ggap-home-hero .ggap-phase.is-current .ggap-phase-face { inset:2px; }
#ggap-home-hero .ggap-mobile-legend { display:none; }
@container (max-width:400px) {
  #ggap-home-hero .ggap-phase { width:24%; min-width:0; min-height:0; aspect-ratio:1; }
  #ggap-home-hero .ggap-phase-face { padding:12px 5px 7px; }
  #ggap-home-hero .ggap-phase-face img { width:65%; height:76%; }
  #ggap-home-hero .ggap-phase-face span { display:none; }
  #ggap-home-hero .ggap-phase b { width:24px; height:23px; font-size:12px; }
  #ggap-home-hero .ggap-mobile-legend { list-style:none; display:grid; gap:10px; padding:8px 2px 0; margin:0; font:400 12px/1.5 'GGAP Hero Poppins',Arial,sans-serif; }
  #ggap-home-hero .ggap-mobile-legend li { display:flex; align-items:center; gap:9px; }
  #ggap-home-hero .ggap-mobile-legend li span { display:grid; place-items:center; flex:0 0 22px; width:22px; height:22px; background:var(--gg-gold); color:var(--gg-ink); border-radius:50%; font-weight:600; }
}
@media(max-width:700px) {
  #ggap-home-hero .ggap-hero { display:flex; flex-direction:column; padding:30px 24px; gap:24px; }
  #ggap-home-hero .ggap-copy h1 { font-size:39px; }
  #ggap-home-hero .ggap-copy p { max-width:none; }
  #ggap-home-hero .ggap-orbit-region { max-width:460px; }
}
@media(max-width:480px) {
  #ggap-home-hero .ggap-hero { padding:28px 18px; }
  #ggap-home-hero .ggap-copy h1 { font-size:35px; }
  #ggap-home-hero .ggap-copy p { font-size:14px; line-height:1.65; }
}
@media(prefers-reduced-motion:reduce) {
  #ggap-home-hero .ggap-phase::before { transition:none; }
  #ggap-home-hero .ggap-hub { transition:none; }
}
/* The original logo above the diagram is cropped with the replaced intro. */
#ggap-home-hero + .homepage-desktop .publication-logo-mask{display:none}
/* A usable final frame is the default, including when JavaScript is unavailable. */
#ggap-home-hero:not([data-playback]) .ggap-progress{stroke-dashoffset:0}
#ggap-home-hero:not([data-playback]) .ggap-hub{border:2px solid var(--gg-gold)}

/* Follow the unchanged content grid below the hero.
   The desktop document uses 1252 content units, scaled by
   min(1760px, stage width - 96px) / 1560. */
@media(min-width:1201px){
 #ggap-home-hero .ggap-hero{
  width:min(calc((100% - 96px) * 0.802564102564),1412.512820513px);
  margin-inline:auto;
  padding-inline:0;
 }
}
@media(min-width:701px) and (max-width:1200px){
 #ggap-home-hero .ggap-hero{padding-inline:clamp(22px,6%,60px)}
}
@media(max-width:700px){
 #ggap-home-hero .ggap-hero{padding-inline:20px}
}