/* Partnership page */

/* ---------- Hero ---------- */
@keyframes gsScan {
  0% { transform: translateY(-10vh); opacity: 0; }
  10% { opacity: 1; }
  90% { opacity: 1; }
  100% { transform: translateY(100vh); opacity: 0; }
}
.hero {
  position: relative; height: 92vh; min-height: 680px; overflow: hidden;
  color: #fff; background: var(--gs-black); display: flex; align-items: center;
  --sx: 50%; --sy: 50%;
}
.hero__bg, .hero__scrim, .hero__spot, .hero__glow { position: absolute; inset: 0; }
.hero__bg, .hero__spot { background: url(../img/p40.webp) center 50% / cover; }
.hero__scrim { background: linear-gradient(90deg, rgba(13,22,40,.95) 0%, rgba(13,22,40,.7) 50%, rgba(13,22,40,.2) 100%); }

/* Spotlight: an unscrimmed copy of the photo, revealed in a soft circle around the cursor. */
.hero__spot, .hero__glow { pointer-events: none; opacity: 0; transition: opacity 500ms; display: none; }
.hero__spot {
  -webkit-mask-image: radial-gradient(circle 300px at var(--sx) var(--sy), #000 0%, rgba(0,0,0,.6) 45%, transparent 75%);
          mask-image: radial-gradient(circle 300px at var(--sx) var(--sy), #000 0%, rgba(0,0,0,.6) 45%, transparent 75%);
}
.hero__glow {
  background: radial-gradient(circle 360px at var(--sx) var(--sy), rgba(201,151,28,.18), rgba(181,84,28,.08) 50%, transparent 75%);
  mix-blend-mode: screen;
}
.hero[data-effect="spotlight"] .hero__spot,
.hero[data-effect="spotlight"] .hero__glow { display: block; }
.hero.is-lit .hero__spot, .hero.is-lit .hero__glow { opacity: 1; }

/* Scan line: a green-to-gold "EV scan" sweeping down the hero. */
.hero__scan {
  display: none; position: absolute; left: 0; right: 0; top: 0; height: 2px; pointer-events: none;
  background: linear-gradient(90deg, transparent, rgba(63,182,139,.9) 30%, rgba(201,151,28,.9) 70%, transparent);
  box-shadow: 0 0 30px 6px rgba(63,182,139,.45);
  animation: gsScan 4.8s cubic-bezier(.65,0,.35,1) infinite;
}
.hero[data-effect="scan"] .hero__scan { display: block; }
@media (prefers-reduced-motion: reduce) { .hero[data-effect="scan"] .hero__scan { display: none; } }

.hero__content { position: relative; width: 100%; padding-top: 76px; }
.hero__title {
  margin: 28px 0 0; max-width: 1000px;
  font: 800 clamp(44px,6.4vw,96px)/.98 var(--font-display); font-stretch: 125%;
  letter-spacing: -.025em; text-transform: uppercase;
}
.hero__title .outline { color: transparent; -webkit-text-stroke: 1.5px #fff; }
.hero__lead { margin: 32px 0 40px; max-width: 580px; font: 400 20px/1.55 var(--font-body); color: rgba(255,255,255,.78); }

/* ---------- The Program ---------- */
.program { background: #fff; }
.program__grid {
  display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 460px), 1fr));
  gap: clamp(40px,6vw,96px); align-items: start;
}
.program__left { display: flex; flex-direction: column; gap: 48px; }
.workforce { background: var(--gs-navy-700); color: #fff; border-radius: var(--radius-md); padding: 40px; }
.workforce__eyebrow { font: 600 12px/1 var(--font-body); letter-spacing: .24em; color: var(--gs-gold-400); margin-bottom: 28px; }
.workforce__stats { display: flex; align-items: flex-end; gap: 24px; flex-wrap: wrap; }
.workforce__stats .stat:first-child { min-width: 140px; }
.workforce__stats .stat:last-child { min-width: 180px; }
.workforce__arrow { font: 300 48px/1 var(--font-display); color: var(--gs-copper-400); padding-bottom: 40px; }
.workforce__track { margin-top: 32px; position: relative; height: 6px; border-radius: 2px; background: rgba(255,255,255,.1); overflow: hidden; }
.workforce__fill {
  position: absolute; left: 0; top: 0; bottom: 0; width: 0;
  background: linear-gradient(90deg, var(--accent), var(--gs-gold-400));
  box-shadow: 0 0 16px rgba(201,151,28,.6);
}
.workforce__marker { position: absolute; left: 60%; top: -4px; bottom: -4px; width: 1px; background: rgba(255,255,255,.5); }
.workforce__scale {
  display: flex; justify-content: space-between; margin-top: 10px;
  font: 500 11px/1 var(--font-mono); letter-spacing: .12em; color: rgba(255,255,255,.55);
}
.workforce__scale span:nth-child(2) { margin-left: 50%; }

.program__list { display: flex; flex-direction: column; }
.program__item {
  display: grid; grid-template-columns: 56px 1fr; gap: 16px; padding: 32px 0;
  border-top: 1px solid var(--gs-ink-200); align-items: start;
}
.program__item .icon { font-size: 22px; color: var(--accent); }
.program__item p {
  margin: 0; font: 500 clamp(18px,1.6vw,22px)/1.45 var(--font-display); font-stretch: 112%;
  color: var(--text-strong); text-wrap: pretty;
}

/* ---------- What We Bring ---------- */
.dark-section { background: var(--gs-black); color: #fff; }
.bring__head { margin-bottom: 64px; }
.bring__grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 320px), 1fr)); gap: 20px; }
.bring-card {
  position: relative; height: 100%; border-radius: var(--radius-md); overflow: hidden;
  background: var(--gs-ink-800); border: 1px solid rgba(255,255,255,.08);
  display: flex; flex-direction: column;
  transform: perspective(1000px);
  transition: transform 250ms var(--ease-out), box-shadow 250ms, border-color 300ms;
  --gx: 50%; --gy: 50%;
}
.bring-card.is-tilting {
  border-color: rgba(201,151,28,.5);
  box-shadow: 0 40px 80px -30px rgba(0,0,0,.8), 0 0 0 1px rgba(201,151,28,.35);
}
.bring-card__glare {
  position: absolute; inset: 0; z-index: 2; pointer-events: none; opacity: 0; transition: opacity 300ms;
  background: radial-gradient(circle at var(--gx) var(--gy), rgba(255,255,255,.22), rgba(201,151,28,.08) 35%, transparent 60%);
}
.bring-card.is-tilting .bring-card__glare { opacity: 1; }
.bring-card__img { aspect-ratio: 16 / 10; background: center / cover; }
.bring-card__body { padding: 32px; display: flex; flex-direction: column; gap: 16px; }
.bring-card__num { font: 500 13px/1 var(--font-mono); color: var(--gs-gold-400); }
.bring-card__title { margin: 0; font: 600 20px/1.4 var(--font-display); font-stretch: 112%; text-wrap: pretty; }

/* ---------- The Right Partner (auto-cycling panels) ---------- */
.reasons__head {
  display: flex; flex-wrap: wrap; justify-content: space-between; align-items: flex-end;
  gap: 32px; margin-bottom: 56px;
}
.reasons__dots { display: flex; gap: 8px; }
.reasons__dot {
  width: 16px; height: 3px; border: 0; padding: 0; cursor: pointer; background: rgba(255,255,255,.3);
  transition: all 600ms var(--ease-out);
}
.reasons__dot.is-active { width: 40px; background: var(--accent); }
/* Enlarge the hit area without changing the 3px visual. */
.reasons__dot { position: relative; }
.reasons__dot::before { content: ""; position: absolute; inset: -10px -2px; }

.acc { display: flex; flex-direction: row; gap: 12px; height: 560px; }
.acc__panel {
  position: relative; flex: 1 1 0; min-width: 0; min-height: 0; border-radius: var(--radius-md); overflow: hidden;
  cursor: pointer; background: var(--gs-ink-900);
  transition: flex 800ms var(--ease-out), min-height 800ms var(--ease-out);
}
.acc__panel.is-active { flex: 3.4 1 0; }
.acc__panel:focus-visible { outline: 2px solid var(--focus-ring); outline-offset: 2px; }
.acc__img {
  position: absolute; inset: 0; background: center / cover;
  transform: scale(1.12); filter: grayscale(.6);
  transition: transform 1600ms var(--ease-out), filter 800ms;
}
.acc__shade { position: absolute; inset: 0; background: linear-gradient(180deg, rgba(10,11,13,.25) 0%, rgba(10,11,13,.35) 40%, rgba(10,11,13,.94) 100%); }
.acc__dim { position: absolute; inset: 0; background: rgba(10,11,13,.55); opacity: 1; transition: opacity 800ms; }
.acc__prog {
  position: absolute; left: 0; top: 0; height: 3px; width: 0; background: var(--accent);
  box-shadow: 0 0 16px rgba(181,84,28,.8); transition: width 300ms;
}
.acc__inner {
  position: relative; height: 100%; min-height: inherit; box-sizing: border-box; padding: 32px;
  display: flex; flex-direction: column; justify-content: space-between; gap: 24px;
}
.acc__top { display: flex; justify-content: space-between; align-items: flex-start; gap: 16px; }
.acc__num {
  font: 800 clamp(48px,5vw,80px)/1 var(--font-display); font-stretch: 125%; letter-spacing: -.03em;
  color: transparent; -webkit-text-stroke: 1.5px rgba(255,255,255,.7); transition: color 500ms;
}
.acc__ring {
  width: 44px; height: 44px; flex-shrink: 0; border-radius: 999px; border: 1px solid rgba(255,255,255,.3);
  opacity: 0; background: transparent; display: flex; align-items: center; justify-content: center;
  color: #fff; font-size: 14px; transition: all 600ms var(--ease-out);
}
.acc__vert {
  position: absolute; left: 32px; bottom: 32px; writing-mode: vertical-rl; transform: rotate(180deg);
  font: 700 13px/1 var(--font-body); letter-spacing: .2em; text-transform: uppercase;
  color: rgba(255,255,255,.85); white-space: nowrap; max-height: calc(100% - 160px); overflow: hidden;
}
.acc__content { display: flex; flex-direction: column; gap: 14px; min-width: 0; opacity: 0; transition: opacity 500ms 0ms; }
.acc__cap { font: 500 11px/1.4 var(--font-mono); letter-spacing: .16em; text-transform: uppercase; color: var(--gs-gold-400); }
.acc__title {
  margin: 0; font: 800 clamp(20px,2vw,30px)/1.1 var(--font-display); font-stretch: 125%;
  text-transform: uppercase; letter-spacing: -.01em; max-width: 440px;
}
.acc__reveal { display: grid; grid-template-rows: 0fr; transition: grid-template-rows 700ms var(--ease-out); }
.acc__reveal > div { overflow: hidden; }
.acc__rule { height: 2px; width: 48px; background: var(--accent); margin: 4px 0 16px; }
.acc__body {
  margin: 0; font: 400 16px/1.6 var(--font-body); color: rgba(255,255,255,.82); max-width: 420px;
  opacity: 0; transform: translateY(12px);
  transition: opacity 600ms 150ms, transform 700ms var(--ease-out) 150ms;
}

.acc__panel.is-active .acc__img { transform: scale(1); filter: grayscale(0); }
.acc__panel.is-active .acc__dim { opacity: 0; }
.acc__panel.is-active .acc__prog { width: 100%; transition: width 5000ms linear; }
.acc.is-paused .acc__panel.is-active .acc__prog { transition: width 300ms; }
.acc__panel.is-active .acc__num { color: var(--gs-copper-400); -webkit-text-stroke: 0; }
.acc__panel.is-active .acc__ring { opacity: 1; background: var(--accent); transform: rotate(-45deg); }
.acc__panel.is-active .acc__vert { display: none; }
.acc__panel.is-active .acc__content { opacity: 1; min-width: 240px; transition-delay: 350ms; }
.acc__panel.is-active .acc__reveal { grid-template-rows: 1fr; }
.acc__panel.is-active .acc__body { opacity: 1; transform: none; }

/* Narrower than 1100px: panels stack and the open one grows taller. */
@media (max-width: 1099.98px) {
  .acc { flex-direction: column; height: auto; }
  .acc__panel, .acc__panel.is-active { flex: 0 0 auto; min-height: 220px; }
  .acc__panel.is-active { min-height: 400px; }
  .acc__vert { display: none; }
  .acc__ring, .acc__content { opacity: 1; }
}

/* ---------- Contact ---------- */
.contact { scroll-margin-top: 76px; background: var(--gs-navy-700); color: #fff; }
.contact__grid {
  display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 440px), 1fr));
  gap: clamp(48px,7vw,112px); align-items: start;
}
.contact__left { display: flex; flex-direction: column; gap: 40px; }
.md-card { display: flex; gap: 20px; align-items: center; padding: 24px; border: 1px solid rgba(255,255,255,.16); border-radius: var(--radius-md); }
.md-card__photo { width: 64px; height: 64px; border-radius: 999px; background: var(--gs-navy-600) url(../img/p13.webp) center 20% / cover; flex-shrink: 0; }
.md-card__name { font: 700 18px/1.2 var(--font-display); font-stretch: 112%; }
.md-card__role { font: 400 14px/1.5 var(--font-body); color: rgba(255,255,255,.64); }
.contact__details { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 28px; }
.contact__details > div { display: flex; flex-direction: column; gap: 8px; }
.contact__primary { font: 500 16px/1.6 var(--font-body); color: #fff; }
.contact__secondary { font: 400 14px/1.6 var(--font-body); color: rgba(255,255,255,.64); }
.contact__address { font: 400 14px/1.6 var(--font-body); color: rgba(255,255,255,.8); }
a.contact__primary:hover, a.contact__secondary:hover { color: var(--gs-gold-400); }

.enquiry { background: var(--gs-navy-800); border: 1px solid rgba(255,255,255,.1); border-radius: var(--radius-md); padding: clamp(28px,4vw,48px); }
.enquiry__form { display: flex; flex-direction: column; gap: 28px; margin: 0; }
.enquiry__title { margin: 0; font: 700 22px/1.2 var(--font-display); font-stretch: 112%; }
.enquiry__fields { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 28px; }
.enquiry__foot { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 16px; margin-top: 8px; }
.enquiry__note { font: 400 12px/1.5 var(--font-body); color: rgba(255,255,255,.5); }
.enquiry__error { margin: 0; font: 400 14px/1.5 var(--font-body); color: var(--gs-copper-300); }
.enquiry__error a { color: #fff; text-decoration: underline; }
.enquiry__hp { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.enquiry__done { min-height: 420px; display: flex; flex-direction: column; justify-content: center; gap: 20px; }
.enquiry__done .icon { font-size: 40px; color: var(--gs-gold-400); width: auto; text-align: left; }
.enquiry__done h3 { margin: 0; font: 700 28px/1.2 var(--font-display); font-stretch: 112%; }
.enquiry__done p { margin: 0; font: 400 16px/1.6 var(--font-body); color: rgba(255,255,255,.7); }
[hidden] { display: none !important; }