/* Home (Figma D01 641:2 · T01 · M01 643:2) */
.hero { position: relative; overflow: hidden; height: 400px; }
.hero-mark { position: absolute; z-index: 1; top: 36px; left: 0; right: 0; text-align: center; }
.hero-globe { position: absolute; left: 50%; top: 48px; width: 893px; max-width: none; transform: translateX(-50%); }
@media (min-width: 768px) { .hero { height: 720px; } .hero-mark { top: 56px; font-size: 72px; } .hero-globe { width: 1480px; top: 40px; } }
@media (min-width: 1200px) { .hero { height: 680px; } .hero-mark { top: 56px; } .hero-globe { width: 1440px; top: 50px; } }

.statement { display: grid; justify-items: center; gap: 24px; text-align: center; padding-bottom: 48px; }
.statement p { max-width: 760px; }
@media (min-width: 768px) and (max-width: 1199px) { .statement p { max-width: 480px; } }
@media (min-width: 768px) { .statement { gap: 32px; padding-bottom: 72px; } }
@media (max-width: 767px) { .statement .btn { width: 100%; } }

.stats-wrap { padding-bottom: var(--section); }
.stats { grid-template-columns: repeat(2, 1fr); }
@media (min-width: 1200px) { .stats { grid-template-columns: repeat(4, 1fr); } }
.stats .t-text { font-size: 13px; }
@media (min-width: 768px) { .stats .t-text { font-size: 15px; } }

.wide-photo { height: 460px; }
.wide-photo figcaption { left: var(--margin); bottom: 24px; }
@media (min-width: 768px) { .wide-photo { height: 440px; } }
@media (min-width: 1200px) { .wide-photo { height: 640px; } .wide-photo figcaption { bottom: 32px; } }

/* services: stacked rows on mobile, cell grid from tablet */
.svc-grid .txt { display: grid; gap: 2px; }
@media (max-width: 767px) {
  .svc-grid { border: 0; display: block; }
  .svc-grid > .svc { display: grid; grid-template-columns: 40px 1fr auto; align-items: center; gap: 16px; min-height: 0; padding: 16px 0; border: 0; border-bottom: 1px solid var(--line); }
  .svc-grid > .svc:first-child { border-top: 1px solid var(--line); }
  .svc-grid .ico { order: -1; padding: 0; }
  .svc-grid .ico svg { width: 40px; height: 40px; }
  .svc-grid .tag { order: 2; align-self: center; font-size: 0; }
  .svc-grid .tag::after { content: attr(data-n); font-size: 11px; }
  .svc-grid .desc { font-size: 13px; }
}

/* markets */
.markets { display: grid; gap: 40px; }
.mk-intro { display: grid; gap: 24px; align-content: start; }
.mk-photo { aspect-ratio: 440 / 300; }
@media (min-width: 1200px) { .markets { grid-template-columns: 440px 1fr; gap: 80px; } }
@media (max-width: 767px) {
  .markets-band { background: var(--k50); border-block: 1px solid var(--line); }
  .markets { gap: 24px; }
  .mk-table .city, .mk-table thead, .mk-table .arrow, .mk-table .m-off { display: none; }
  .mk-table td:nth-child(3) { width: 100%; }
  .table-scroll { overflow: visible; }
}

/* team */
.team-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 20px 14px; }
@media (min-width: 1200px) { .team-grid { grid-template-columns: repeat(4, 1fr); gap: 24px; } }
@media (max-width: 767px) { .team-grid .t-text { font-size: 13px; } }

/* chart */
.chart { display: grid; justify-items: center; gap: 24px; text-align: center; }
.legend { display: flex; gap: 12px 32px; flex-wrap: wrap; justify-content: center; }
.legend li { display: inline-flex; align-items: center; gap: 10px; }
.legend .ln { width: 24px; border-top: 1.5px solid var(--g700); }
.legend .ln--dash { border-top-style: dashed; }
.chart-scroll { width: 100%; overflow-x: auto; margin-top: 8px; }
.chart-scroll img { width: 100%; min-width: 720px; height: auto; }

/* gallery */
.gl-p { max-width: 440px; }
.gallery { display: grid; gap: 24px; }
.gallery figure { display: grid; gap: 12px; }
.gallery .photo { aspect-ratio: 4 / 3; }
@media (min-width: 768px) { .gallery { grid-template-columns: 1fr 1fr; } .gallery figure:first-child { grid-column: 1 / -1; } .gallery .photo { aspect-ratio: auto; height: 340px; } .gallery figure:first-child .photo { height: 380px; } }
@media (min-width: 1200px) { .gallery { grid-template-columns: 2fr 1fr 1fr; } .gallery figure:first-child { grid-column: auto; } .gallery .photo, .gallery figure:first-child .photo { height: 420px; } }
@media (max-width: 767px) { .gallery { grid-template-columns: 1fr 1fr; } .gallery figure:first-child { grid-column: 1 / -1; } }

/* CTA band */
.cta { display: grid; }
.cta-text { display: grid; gap: 20px; align-content: center; justify-items: start; padding: 48px var(--margin); }
.cta .steps { width: 100%; }
.cta .steps li { padding-block: 16px; border-bottom: 1px solid var(--g900); }
.cta .steps li:first-child { border-top: 1px solid var(--g900); }
.cta-photo { min-height: 260px; order: -1; }
@media (max-width: 767px) { .cta .btn { width: 100%; } }
@media (min-width: 1200px) {
  .cta { grid-template-columns: 1fr 640px; }
  .cta-text { padding: 96px 80px; gap: 24px; }
  .cta-photo { order: 0; min-height: 560px; }
}
@media (min-width: 768px) and (max-width: 1199px) { .cta-photo { min-height: 440px; order: 0; } .cta-text { padding: 80px var(--margin); } }

/* reports rows on mobile: meta line on top, title below (M01) */
@media (max-width: 767px) {
  .docs .doc { display: grid; grid-template-columns: 1fr auto; gap: 6px 12px; padding-block: 16px; }
  .docs .doc .date { grid-column: 1; grid-row: 1; font-size: 11px; }
  .docs .doc .meta { grid-column: 1; grid-row: 1; margin-left: 88px; font-size: 11px; color: var(--g700); }
  .docs .doc .meta::before { content: "· "; }
  .docs .doc .title { grid-column: 1; grid-row: 2; }
  .docs .doc .icon { grid-column: 2; grid-row: 1 / 3; align-self: center; }
}

@media (min-width: 768px) and (max-width: 1199px) { .svc-grid > .svc { min-height: 260px; } }

/* ---------- phase 3: motion, states, responsive polish ---------- */
/* hero: wordmark first, then the globe (its arcs draw inside the SVG) */
.hero-globe { animation: globe-in 1.1s var(--ease) .15s both; }
@keyframes globe-in { from { opacity: 0; } }
@media (max-width: 767px) { .hero-mark { font-size: min(40px, 11.6vw); } }
/* wide screens: continue the globe's dashed grid past its 1440px artboard */
@media (min-width: 1441px) {
  .hero-globe { width: 1440px; }
  .hero::before, .hero::after { content: ""; position: absolute; top: 0; bottom: 0; width: calc(50% - 720px); background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='40' height='40'%3E%3Cpath d='M0 .5H40M.5 0V40' stroke='%23EBEBEB' stroke-dasharray='3 3' fill='none'/%3E%3C/svg%3E"); background-size: 40px 40px; animation: globe-in 1.1s var(--ease) .15s both; }
  .hero::before { left: 0; background-position: right 0 top 10px; }
  .hero::after { right: 0; background-position: left 0 top 10px; }
}

/* stats: keep the money figure on one line on the narrowest phones */
.stats .t-num { white-space: nowrap; }
@media (max-width: 379px) { .stats .t-num { font-size: 26px; } }

/* service cells and document rows: inner focus ring (cells share borders) */
.svc:focus-visible, .doc:focus-visible { outline-offset: -2px; background: var(--g50); }
.svc .tag { transition: color .2s; }
.svc:hover .tag, .svc:focus-visible .tag { color: var(--g900); }
.doc .title { transition: color .2s; }
.doc:hover .title, .doc:focus-visible .title { color: var(--g700); }

/* markets table: whole row is a link to markets.html */
.mk-table tr.is-link { position: relative; }
.mk-table .row-link { outline: none; }
.mk-table .row-link::after { content: ""; position: absolute; inset: 0; }
.mk-table tr.is-link:has(.row-link:focus-visible) { outline: 2px solid var(--g700); outline-offset: -2px; background: var(--g50); }
.mk-table tr.is-link:hover .row-link { color: var(--g700); }
.mk-table tr.is-link:has(.row-link:focus-visible) .arrow .icon { transform: translateX(4px); color: var(--g700); }
/* tablet: keep the markets photo from growing past ~480px tall */
@media (min-width: 768px) and (max-width: 1199px) { .mk-photo { max-height: 480px; width: 100%; } }

/* team: equal columns (long role names no longer widen one column); 4-up from 960 */
.team-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
@media (min-width: 960px) { .team-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 24px; } }

/* chart: inline SVG, draws in; no forced min-width from tablet up */
.chart-scroll svg { width: 100%; height: auto; }
@media (min-width: 768px) { .chart-scroll svg { min-width: 0; } }
.draw [data-fade] { opacity: 0; transition: opacity .8s ease; transition-delay: var(--d, .3s); }
.draw.is-in [data-fade] { opacity: 1; }

/* gallery figures: caption turns dark green on hover with the image zoom */
.gallery figcaption { transition: color .2s; }
.gallery figure:hover figcaption { color: var(--g900); }

/* CTA steps rows slide their number in on hover */
.cta .steps li { transition: padding-left .3s var(--ease), color .2s; }
.cta .steps li:hover { padding-left: 6px; color: var(--g300); }
@media (min-width: 1200px) { .cta-photo { max-height: 720px; } }

@media (prefers-reduced-motion: reduce) {
  .hero-globe { animation: none; }
  .draw [data-fade] { opacity: 1 !important; transition: none !important; }
  .cta .steps li { transition: none; }
}
/* very narrow phones (<360): one person per row, portrait beside the name, so long roles never overflow */
@media (max-width: 359px) {
  .team-grid { grid-template-columns: minmax(0, 1fr); gap: 16px; }
  .team-grid .team { grid-template-columns: 96px minmax(0, 1fr); align-items: center; gap: 16px; }
}
