/* EDGE Worldwide · Governance page
   Scoped to #page-transparency. Uses only existing site palette tokens. */

#page-transparency .gv-page{overflow:clip}

/* G01 · shorter opening. */
#page-transparency .gv-hero{padding-top:clamp(54px,6vw,82px);padding-bottom:clamp(54px,6vw,82px)}
/* G01 · the copy was the narrower of the two columns behind a 96px gap, so
   the divider sat well right of centre. 6fr/6fr with a tighter gap brings it
   toward the middle and gives the text more room. */
#page-transparency .gv-hero-grid{display:grid;grid-template-columns:minmax(0,6fr) minmax(340px,6fr);gap:clamp(32px,4.4vw,60px);align-items:end}
#page-transparency .gv-hero-title .kicker{margin-bottom:clamp(20px,2.4vw,30px)}
#page-transparency .gv-hero-title .h-sec{max-width:10ch;font-size:clamp(46px,6.8vw,86px);line-height:.98;letter-spacing:-.038em}
#page-transparency .gv-hero-copy{padding-left:clamp(26px,3.2vw,44px);border-left:1px solid rgba(255,255,255,.22)}
#page-transparency .gv-hero-copy .lead{max-width:40ch}
#page-transparency .gv-hero-copy .body{max-width:50ch}

#page-transparency .gv-section-intro{display:grid;grid-template-columns:minmax(0,4fr) minmax(0,8fr);gap:clamp(42px,6vw,82px);align-items:start}
#page-transparency .gv-section-intro .h-sub{max-width:12ch;margin-top:16px}
#page-transparency .gv-registration-copy{padding-left:clamp(26px,3vw,42px);border-left:1px solid var(--f-line-d)}
#page-transparency .gv-registration-panel{display:grid;grid-template-columns:minmax(0,7fr) minmax(270px,5fr);margin-top:clamp(42px,5vw,66px);border:1px solid var(--f-line-d);background:var(--f-sage)}
#page-transparency .gv-credentials{margin:0;padding:clamp(26px,3.2vw,42px);border-top:0}
#page-transparency .gv-credentials>div:first-child{padding-top:0}
#page-transparency .gv-credentials>div:last-child{padding-bottom:0;border-bottom:0}
#page-transparency .gv-register-links{margin:0;padding:clamp(26px,3.2vw,42px);border-left:1px solid var(--f-line-d);align-self:stretch}
#page-transparency .gv-register-links li:first-child{border-top:1px solid var(--f-line)}
#page-transparency .gv-register-links a{min-height:68px}

#page-transparency .gv-story-grid,
#page-transparency .gv-steward-grid{display:grid;grid-template-columns:minmax(0,4fr) minmax(0,8fr);gap:clamp(44px,7vw,96px);align-items:start}
#page-transparency .gv-story-heading,
#page-transparency .gv-steward-heading{position:sticky;top:132px}
#page-transparency .gv-story-heading .h-sub,
#page-transparency .gv-steward-heading .h-sub{max-width:12ch;margin-top:16px}
#page-transparency .gv-story-copy,
#page-transparency .gv-steward-copy{margin:0;padding-top:clamp(24px,2.8vw,36px);border-top:1px solid var(--f-line-d)}
#page-transparency .gv-story-copy .body,
#page-transparency .gv-steward-copy .body{max-width:none;margin:0;padding:0;border:0;text-wrap:pretty}
#page-transparency .gv-story-copy .body+.body,
#page-transparency .gv-steward-copy .body+.body{margin-top:20px}
#page-transparency .gv-story-copy .body:first-child{font-family:var(--disp);font-size:clamp(18px,1.55vw,23px);line-height:1.55;color:var(--f-ink2)}
#page-transparency .gv-steward-copy{border-top-color:rgba(255,255,255,.28)}
#page-transparency .gv-steward-copy .body{color:rgba(255,255,255,.78)}

#page-transparency .gv-country-grid{display:grid;grid-template-columns:minmax(0,6fr) minmax(360px,6fr);gap:clamp(46px,7vw,96px);align-items:start}
#page-transparency .gv-country-copy .h-sub{max-width:14ch;margin-top:16px}
#page-transparency .gv-country-story{margin-top:clamp(30px,3.5vw,46px);padding-top:clamp(24px,2.8vw,36px);border-top:1px solid var(--f-line-d)}
#page-transparency .gv-country-story .body:first-child{font-family:var(--disp);font-size:clamp(18px,1.5vw,22px);line-height:1.55;color:var(--f-ink2)}
#page-transparency .gv-country-media{position:sticky;top:132px;min-height:clamp(500px,52vw,680px);overflow:hidden;border:1px solid var(--f-line-d);background:var(--f-sage)}
#page-transparency .gv-country-media::after{content:"";position:absolute;left:-1px;bottom:-1px;width:34%;height:5px;background:var(--f-terra)}
#page-transparency .gv-country-media img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center;display:block}

#page-transparency .gv-contact-grid{display:grid;grid-template-columns:minmax(0,6fr) minmax(0,6fr);gap:clamp(38px,6vw,82px);align-items:end}
#page-transparency .gv-contact-grid .h-sub{max-width:18ch;margin-top:14px}
#page-transparency .gv-contact-copy{display:flex;align-items:flex-end;justify-content:space-between;gap:28px;padding-left:clamp(26px,3vw,42px);border-left:1px solid var(--f-line-d)}
#page-transparency .gv-contact-copy .body{margin:0;max-width:45ch}
#page-transparency .gv-contact-copy .btn{flex:none}

@media(hover:hover) and (pointer:fine){
  #page-transparency .gv-register-links a:hover{padding-left:8px}
  #page-transparency .gv-contact-copy .btn:hover{transform:translateY(-2px)}
}

@media(max-width:980px){
  #page-transparency .gv-hero-grid{grid-template-columns:1fr;gap:38px}
  #page-transparency .gv-hero-title .h-sec{max-width:14ch}
  #page-transparency .gv-hero-copy{max-width:700px}
  #page-transparency .gv-registration-panel{grid-template-columns:1fr}
  #page-transparency .gv-register-links{border-left:0;border-top:1px solid var(--f-line-d)}
  #page-transparency .gv-country-grid{grid-template-columns:1fr;gap:40px}
  #page-transparency .gv-country-media{position:relative;top:auto;min-height:clamp(400px,68vw,600px)}
}

@media(max-width:760px){
  #page-transparency .gv-section-intro,
  #page-transparency .gv-story-grid,
  #page-transparency .gv-steward-grid,
  #page-transparency .gv-contact-grid{grid-template-columns:1fr;gap:30px}
  #page-transparency .gv-registration-copy,
  #page-transparency .gv-contact-copy{padding:24px 0 0;border-left:0;border-top:1px solid var(--f-line-d)}
  #page-transparency .gv-story-heading,
  #page-transparency .gv-steward-heading{position:static}
  #page-transparency .gv-contact-copy{align-items:flex-start}
}

@media(max-width:560px){
  #page-transparency .gv-hero{padding-top:64px;padding-bottom:64px}
  #page-transparency .gv-hero-grid{gap:30px}
  #page-transparency .gv-hero-title .h-sec{font-size:clamp(40px,13vw,58px)}
  #page-transparency .gv-hero-copy{padding:24px 0 0;border-left:0;border-top:1px solid rgba(255,255,255,.22)}
  #page-transparency .gv-credentials,
  #page-transparency .gv-register-links{padding:24px 22px}
  #page-transparency .gv-contact-copy{display:block}
  #page-transparency .gv-contact-copy .btn{margin-top:22px}
  #page-transparency .gv-country-media{min-height:360px}
}

@media(prefers-reduced-motion:reduce){
  #page-transparency .gv-contact-copy .btn{transition:none}
  #page-transparency .gv-contact-copy .btn:hover{transform:none}
}

/* Oversight heading column carries the mark, so it no longer sticks: a sticky
   block taller than the viewport drifts out of view on short screens.
   The mark is decorative (aria-hidden, empty alt) — the section is already
   titled, so it must not be announced a second time. multiply lets the sage
   ground read through the logo's ink instead of sitting on a pale plate. */
#page-transparency .gv-oversight .gv-story-heading{position:static}
/* field.css sets .rd picture{position:absolute;inset:0} so a <picture> fills
   an already-sized frame. This wrapper is a normal flow block, so the picture
   is returned to flow here rather than pinned over the heading. Scoped to this
   section: the nav, footer and hero pictures still need the absolute rule. */
#page-transparency .gv-story-mark{position:relative;margin-top:clamp(30px,3.2vw,44px);max-width:none}
#page-transparency .gv-story-mark picture{position:static;inset:auto;display:block}
/* G03 · the mark was set to 42% opacity with multiply blending, which is
   literally a watermark treatment. Shown at full strength as supplied; size
   is what keeps it subordinate to the copy, not transparency. */
#page-transparency .gv-story-mark img{display:block;width:100%;height:auto}
@supports not (mix-blend-mode:multiply){#page-transparency .gv-story-mark img{opacity:1}}
@media(max-width:760px){#page-transparency .gv-story-mark{max-width:280px}}

/* G02 · the panel is a two-column grid with THREE children: credentials,
   register links, then the badge. The badge wrapped to row 2 column 1 and
   left the cell beside it permanently empty — the gap the client saw.
   Credentials now span both rows in the wide column; links and badge stack
   in the narrow one, so every cell is used and the badge has a deliberate
   home under the links it belongs with. */
@media(min-width:861px){
  #page-transparency .gv-registration-panel{grid-template-rows:auto 1fr}
  #page-transparency .gv-registration-panel>.gv-credentials{grid-column:1;grid-row:1 / span 2}
  #page-transparency .gv-registration-panel>.gv-register-links{grid-column:2;grid-row:1}
  #page-transparency .gv-registration-panel>.gv-acnc-slot{grid-column:2;grid-row:2;align-self:end;justify-self:start}
}
/* Tick moved up beside the section heading, so it reads as the credential for
   the whole band rather than a footnote inside the panel. */
#page-transparency .gv-acnc-inline{margin-top:18px;width:clamp(76px,7vw,104px)}
#page-transparency .gv-acnc-inline img{display:block;width:100%;height:auto}
