/* ===========================================================
   Denzel Logistics — Redesign
   Trafigura-inspired, minimal editorial. Denzel navy + gold.
   =========================================================== */

:root{
  --navy:        #2A2A4C;
  --navy-2:      #34335C;
  --navy-3:      #45446F;
  --gold:        #C8A24E;
  --gold-2:      #DCC07E;
  --ink:         #2A2A4C;
  --grey:        #6A6A78;
  --grey-2:      #9A9AA8;
  --line:        #E5E5EA;
  --paper:       #FAFAFB;
  --paper-2:     #F2F2F6;
  --white:       #FFFFFF;

  --maxw: 1280px;
  --gutter: clamp(20px, 5vw, 64px);
  --hsans: "Archivo", system-ui, sans-serif;
  --bsans: "Inter", system-ui, sans-serif;
}

*{ box-sizing:border-box; }
html{ scroll-behavior:smooth; }
body{
  margin:0; font-family:var(--bsans); color:var(--ink); background:var(--white);
  font-size:17px; line-height:1.6; -webkit-font-smoothing:antialiased;
}
img{ display:block; max-width:100%; }
a{ color:inherit; text-decoration:none; }
h1,h2,h3,h4{ font-family:var(--hsans); font-weight:600; line-height:1.08; letter-spacing:-0.01em; margin:0; }
p{ margin:0 0 1em; }
.container{ max-width:var(--maxw); margin:0 auto; padding-inline:var(--gutter); }

.eyebrow{ font-size:12px; letter-spacing:.22em; text-transform:uppercase; font-weight:600; color:var(--gold); margin:0 0 18px; display:inline-block; }
.eyebrow.on-dark{ color:var(--gold-2); }

.btn{ display:inline-flex; align-items:center; gap:.6em; font-family:var(--hsans); font-weight:600; font-size:14px; letter-spacing:.02em; padding:15px 28px; border:1px solid var(--navy); background:var(--navy); color:var(--white); transition:.25s ease; cursor:pointer; }
.btn:hover{ background:var(--gold); border-color:var(--gold); color:var(--navy); }
.btn--ghost{ background:transparent; color:var(--navy); }
.btn--ghost:hover{ background:var(--navy); color:var(--white); border-color:var(--navy); }
.btn--gold{ background:var(--gold); border-color:var(--gold); color:var(--navy); }
.btn--gold:hover{ background:var(--navy); border-color:var(--navy); color:var(--white); }
.btn--on-dark{ border-color:rgba(255,255,255,.5); background:transparent; color:#fff; }
.btn--on-dark:hover{ background:var(--gold); border-color:var(--gold); color:var(--navy); }

.arrow-link{ display:inline-flex; align-items:center; gap:.5em; font-family:var(--hsans); font-weight:600; font-size:15px; color:var(--navy); border-bottom:2px solid var(--gold); padding-bottom:4px; transition:.2s; }
.arrow-link::after{ content:"→"; transition:transform .2s; }
.arrow-link:hover::after{ transform:translateX(5px); }
.arrow-link.on-dark{ color:#fff; }

/* HEADER (centered logo + hamburger menu — Trafigura pattern) */
.site-header{ position:fixed; inset:0 0 auto 0; z-index:100; display:grid; grid-template-columns:1fr auto 1fr; align-items:center; padding:16px var(--gutter); transition:background .3s, box-shadow .3s, padding .3s; }
.site-header.solid{ background:var(--navy); box-shadow:0 1px 0 rgba(255,255,255,.06); padding-block:12px; }

.brand{ grid-column:2; display:flex; align-items:center; justify-content:center; gap:12px; z-index:102; }
.brand img{ height:64px; width:auto; transition:height .3s; }
.site-header.solid .brand img{ height:44px; }
.brand .brand-text{ font-family:var(--hsans); font-weight:700; color:#fff; font-size:clamp(28px,3.4vw,40px); letter-spacing:.06em; line-height:1; text-align:center; transition:font-size .3s; }
.site-header.solid .brand .brand-text{ font-size:24px; }
.brand .brand-text small{ display:block; font-size:10px; letter-spacing:.28em; color:var(--gold-2); font-weight:600; margin-top:3px; }

.header-utils{ grid-column:3; display:flex; align-items:center; justify-content:flex-end; gap:12px; z-index:102; }
.region{ display:flex; align-items:center; gap:8px; border:1px solid rgba(255,255,255,.4); border-radius:30px; padding:9px 16px; color:#fff; font-size:13.5px; cursor:pointer; transition:.2s; white-space:nowrap; }
.region:hover{ border-color:var(--gold); color:var(--gold-2); }
.region .caret{ font-size:10px; opacity:.8; }
.search-btn{ width:40px; height:40px; border-radius:50%; border:1px solid rgba(255,255,255,.4); background:none; color:#fff; cursor:pointer; display:flex; align-items:center; justify-content:center; font-size:15px; transition:.2s; }
.search-btn:hover{ border-color:var(--gold); color:var(--gold-2); }
@media (max-width:680px){ .region{ display:none; } }

.nav-toggle{ grid-column:1; justify-self:start; width:48px; height:48px; border-radius:50%; background:rgba(255,255,255,.14); border:1px solid rgba(255,255,255,.38); cursor:pointer; z-index:102; display:flex; flex-direction:column; align-items:center; justify-content:center; transition:.25s; }
.nav-toggle:hover{ border-color:var(--gold); }
.nav-toggle span{ display:block; width:20px; height:2px; background:#fff; margin:2.5px 0; transition:.3s; }
.nav-toggle.open span:nth-child(1){ transform:translateY(5px) rotate(45deg); }
.nav-toggle.open span:nth-child(2){ opacity:0; }
.nav-toggle.open span:nth-child(3){ transform:translateY(-5px) rotate(-45deg); }

.nav{ position:fixed; inset:0; z-index:101; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:6px; background:var(--navy); transform:translateX(-100%); transition:transform .4s cubic-bezier(.7,0,.2,1); }
.nav a{ color:#fff; font-family:var(--hsans); font-weight:600; font-size:clamp(22px,3.2vw,34px); letter-spacing:-0.01em; padding:6px 0; transition:color .2s; }
.nav a:hover, .nav a.active{ color:var(--gold-2); }
.nav.open{ transform:none; }
.nav a.header-cta{ margin-top:24px; font-size:14px; color:var(--navy); }
.nav a.header-cta:hover{ color:#fff; }

/* HERO */
.hero{ position:relative; min-height:100svh; display:flex; flex-direction:column; justify-content:flex-end; color:#fff; overflow:hidden; }
.hero__media{ position:absolute; inset:0; z-index:0; }
.hero__media img{ width:100%; height:100%; object-fit:cover; }
.hero__media::after{ content:""; position:absolute; inset:0; background:linear-gradient(180deg, rgba(42,42,76,.20) 0%, rgba(42,42,76,0) 20%, rgba(42,42,76,0) 100%); }
.hero__inner{ position:relative; z-index:1; width:100%; padding-bottom:clamp(50px,7vh,90px); padding-top:160px; flex:1; display:flex; flex-direction:column; justify-content:flex-end; }
.hero h1{ font-size:clamp(40px, 6.4vw, 92px); font-weight:600; max-width:16ch; letter-spacing:-0.02em; line-height:1.02; }
.hero p.lede{ margin-top:26px; font-size:clamp(17px,1.4vw,21px); max-width:46ch; color:rgba(255,255,255,.85); }
.hero__actions{ margin-top:36px; display:flex; gap:14px; flex-wrap:wrap; }
.hero__ticker{ position:relative; z-index:1; background:rgba(42,42,76,.65); border-top:1px solid rgba(255,255,255,.12); backdrop-filter:blur(4px); }
.ticker-row{ display:flex; gap:0; overflow:hidden; }
.ticker-item{ flex:1; min-width:0; padding:18px var(--gutter); border-right:1px solid rgba(255,255,255,.10); display:flex; flex-direction:column; gap:2px; }
.ticker-item:last-child{ border-right:0; }
.ticker-item .t-name{ font-size:12px; letter-spacing:.12em; text-transform:uppercase; color:var(--gold-2); }
.ticker-item .t-val{ font-family:var(--hsans); font-weight:600; font-size:18px; }
.ticker-item .t-chg{ font-size:12.5px; color:#7FD19B; }
.ticker-item .t-chg.down{ color:#E78C8C; }
@media (max-width:820px){ .ticker-item:nth-child(n+4){ display:none; } }

/* SECTION SCAFFOLD */
section{ position:relative; }
.section{ padding-block:clamp(70px,9vw,130px); }
.section--paper{ background:var(--paper); }
.section--alt{ background:var(--paper-2); }
.section--navy{ background:var(--navy); color:#fff; }
.section--navy .section-head h2{ color:#fff; }
.section-head{ max-width:820px; margin-bottom:56px; }
.section-head.center{ margin-inline:auto; text-align:center; }
.section-head h2{ font-size:clamp(28px,3.6vw,48px); letter-spacing:-0.02em; }
.section-head p{ margin-top:18px; color:var(--grey); font-size:18px; }
.section--navy .section-head p{ color:rgba(255,255,255,.72); }
.split{ display:grid; grid-template-columns:1.1fr .9fr; gap:clamp(30px,5vw,80px); align-items:center; }
@media (max-width:880px){ .split{ grid-template-columns:1fr; } }

/* STATS */
.stats{ display:grid; grid-template-columns:repeat(4,1fr); gap:1px; background:var(--line); border:1px solid var(--line); }
.section--navy .stats{ background:rgba(255,255,255,.12); border-color:rgba(255,255,255,.12); }
.stat{ background:var(--paper); padding:38px 28px; }
.section--navy .stat{ background:var(--navy); }
.stat .num{ font-family:var(--hsans); font-weight:600; font-size:clamp(38px,4.4vw,60px); color:var(--navy); letter-spacing:-0.02em; line-height:1; }
.section--navy .stat .num{ color:var(--gold-2); }
.stat .num span{ color:var(--gold); }
.stat .label{ margin-top:12px; font-size:14px; letter-spacing:.04em; color:var(--grey); text-transform:uppercase; }
.section--navy .stat .label{ color:rgba(255,255,255,.7); }
@media (max-width:760px){ .stats{ grid-template-columns:repeat(2,1fr); } }

/* FEATURE CARDS */
.feature-grid{ display:grid; grid-template-columns:repeat(2,1fr); gap:clamp(20px,3vw,40px); }
@media (max-width:820px){ .feature-grid{ grid-template-columns:1fr; } }
.feature{ position:relative; overflow:hidden; min-height:440px; display:flex; align-items:flex-end; color:#fff; background:var(--navy); }
.feature img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; transition:transform .7s ease; }
.feature::after{ content:""; position:absolute; inset:0; background:linear-gradient(180deg,rgba(42,42,76,0) 30%,rgba(42,42,76,.9) 100%); }
.feature:hover img{ transform:scale(1.05); }
.feature__body{ position:relative; z-index:1; padding:34px; }
.feature__body .eyebrow{ color:var(--gold-2); }
.feature__body h3{ font-size:26px; margin-bottom:14px; }
.feature__body .arrow-link{ color:#fff; }

/* SERVICES CARDS */
.cards{ display:grid; grid-template-columns:repeat(3,1fr); gap:clamp(18px,2.2vw,30px); }
@media (max-width:980px){ .cards{ grid-template-columns:repeat(2,1fr); } }
@media (max-width:620px){ .cards{ grid-template-columns:1fr; } }
.card{ background:var(--white); border:1px solid var(--line); overflow:hidden; display:flex; flex-direction:column; transition:.3s; }
.card:hover{ box-shadow:0 24px 50px -28px rgba(42,42,76,.4); transform:translateY(-4px); }
.card .card-media{ aspect-ratio:16/10; overflow:hidden; }
.card .card-media img{ width:100%; height:100%; object-fit:cover; transition:transform .6s; }
.card:hover .card-media img{ transform:scale(1.06); }
.card .card-body{ padding:26px 24px 28px; display:flex; flex-direction:column; gap:12px; flex:1; }
.card .card-body h3{ font-size:20px; line-height:1.2; }
.card .card-body p{ color:var(--grey); font-size:15px; margin:0; }
.card .card-body .arrow-link{ margin-top:auto; font-size:14px; align-self:flex-start; }

/* SOLUTIONS */
.solutions{ display:grid; gap:0; border-top:1px solid var(--line); }
.solution{ border-bottom:1px solid var(--line); padding:40px 0; display:grid; grid-template-columns:120px 1fr 1.1fr; gap:30px; align-items:start; }
.solution .s-num{ font-family:var(--hsans); font-weight:600; font-size:40px; color:var(--gold); line-height:1; }
.solution h3{ font-size:24px; }
.solution .s-desc{ color:var(--grey); font-size:15.5px; }
.solution .tags{ display:flex; flex-wrap:wrap; gap:10px; margin-top:16px; }
.tag{ font-size:13px; letter-spacing:.02em; padding:7px 14px; border:1px solid var(--line); background:var(--paper); color:var(--navy); border-radius:2px; }
@media (max-width:880px){ .solution{ grid-template-columns:1fr; gap:14px; } .solution .s-num{ font-size:32px; } }

/* FLAGSHIP PROJECTS */
.project{ display:grid; grid-template-columns:1fr 1fr; gap:0; align-items:stretch; background:var(--navy); color:#fff; margin-bottom:30px; overflow:hidden; }
.project:nth-child(even){ direction:rtl; }
.project:nth-child(even) > *{ direction:ltr; }
.project__media{ min-height:380px; position:relative; overflow:hidden; }
.project__media img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; transition:transform .7s; }
.project:hover .project__media img{ transform:scale(1.05); }
.project__body{ padding:clamp(34px,4vw,60px); display:flex; flex-direction:column; justify-content:center; }
.project__body .value{ font-family:var(--hsans); font-weight:600; color:var(--gold-2); font-size:14px; letter-spacing:.1em; text-transform:uppercase; }
.project__body .loc{ font-size:13px; letter-spacing:.18em; text-transform:uppercase; color:rgba(255,255,255,.6); margin-top:8px; }
.project__body h3{ font-size:clamp(24px,2.6vw,34px); margin:16px 0 16px; }
.project__body p{ color:rgba(255,255,255,.75); font-size:16px; }
@media (max-width:820px){ .project, .project:nth-child(even){ grid-template-columns:1fr; direction:ltr; } }

/* NEWS */
.news-grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:clamp(16px,2vw,28px); }
@media (max-width:980px){ .news-grid{ grid-template-columns:repeat(2,1fr); } }
@media (max-width:560px){ .news-grid{ grid-template-columns:1fr; } }
.news-card{ border-top:2px solid var(--navy); padding-top:20px; display:flex; flex-direction:column; gap:12px; transition:.25s; }
.news-card:hover{ border-color:var(--gold); }
.news-card .meta{ font-size:12px; letter-spacing:.1em; text-transform:uppercase; color:var(--gold); font-weight:600; }
.news-card .meta time{ color:var(--grey-2); }
.news-card h3{ font-size:18px; line-height:1.25; }
.news-card .arrow-link{ margin-top:auto; font-size:13px; }

/* PARTNERS */
.logo-wall{ display:grid; grid-template-columns:repeat(8,1fr); gap:1px; background:var(--line); border:1px solid var(--line); }
@media (max-width:880px){ .logo-wall{ grid-template-columns:repeat(4,1fr); } }
@media (max-width:520px){ .logo-wall{ grid-template-columns:repeat(3,1fr); } }
.logo-wall .cell{ background:var(--white); aspect-ratio:3/2; display:flex; align-items:center; justify-content:center; padding:18px; }
.logo-wall .cell img{ max-height:46px; width:auto; filter:grayscale(1); opacity:.6; transition:.3s; }
.logo-wall .cell:hover img{ filter:none; opacity:1; }

/* marquee */
.marquee{ overflow:hidden; border-block:1px solid rgba(255,255,255,.14); background:var(--navy-2); }
.marquee__track{ display:flex; gap:50px; white-space:nowrap; padding:18px 0; animation:scroll 38s linear infinite; width:max-content; }
.marquee span{ font-family:var(--hsans); font-weight:600; font-size:16px; color:rgba(255,255,255,.8); letter-spacing:.02em; display:inline-flex; align-items:center; gap:50px; }
.marquee span::after{ content:"•"; color:var(--gold); }
@keyframes scroll{ to{ transform:translateX(-50%); } }

/* GLOBAL NETWORK */
.network{ display:grid; grid-template-columns:1fr 1.2fr; gap:clamp(30px,5vw,70px); align-items:center; }
@media (max-width:880px){ .network{ grid-template-columns:1fr; } }
.hubs{ display:grid; grid-template-columns:repeat(2,1fr); gap:1px; background:rgba(255,255,255,.12); border:1px solid rgba(255,255,255,.12); margin-top:30px; }
.hub{ background:var(--navy); padding:22px 22px; }
.hub h4{ font-size:15px; color:var(--gold-2); letter-spacing:.05em; }
.hub p{ font-size:13.5px; color:rgba(255,255,255,.72); margin:8px 0 0; }

/* CTA STRIP */
.cta-strip{ background:var(--gold); color:var(--navy); }
.cta-strip .container{ display:flex; align-items:center; justify-content:space-between; gap:30px; padding-block:clamp(48px,6vw,80px); flex-wrap:wrap; }
.cta-strip h2{ font-size:clamp(26px,3vw,42px); max-width:20ch; }
.cta-strip .btn{ background:var(--navy); border-color:var(--navy); color:#fff; }
.cta-strip .btn:hover{ background:#fff; color:var(--navy); border-color:#fff; }

/* CHAIRMAN */
.chair{ display:grid; grid-template-columns:.9fr 1.1fr; gap:clamp(30px,5vw,70px); align-items:center; }
@media (max-width:880px){ .chair{ grid-template-columns:1fr; } }
.chair__media{ position:relative; background:var(--navy-2); }
.chair__media img{ width:100%; object-fit:cover; aspect-ratio:4/5; }
.chair__media .badge{ position:absolute; left:-1px; bottom:24px; background:var(--gold); color:var(--navy); padding:14px 22px; font-family:var(--hsans); font-weight:600; }
.chair blockquote{ font-family:var(--hsans); font-weight:500; font-size:clamp(22px,2.4vw,30px); line-height:1.3; letter-spacing:-0.01em; margin:0 0 24px; }
.chair .sig{ font-weight:600; }
.chair .role{ color:var(--grey); font-size:15px; }

/* FOOTER */
.site-footer{ background:var(--navy); color:rgba(255,255,255,.78); padding-top:70px; }
.footer-top{ display:grid; grid-template-columns:1.4fr 1fr 1fr 1.3fr; gap:40px; padding-bottom:50px; border-bottom:1px solid rgba(255,255,255,.12); }
@media (max-width:880px){ .footer-top{ grid-template-columns:1fr 1fr; } }
@media (max-width:520px){ .footer-top{ grid-template-columns:1fr; } }
.site-footer .flogo{ font-family:var(--hsans); font-weight:700; font-size:22px; color:#fff; margin-bottom:18px; display:inline-block; }
.site-footer .flogo small{ display:block; font-size:10px; letter-spacing:.28em; color:var(--gold-2); font-weight:600; margin-top:4px; }
.site-footer h5{ font-family:var(--hsans); color:#fff; font-size:13px; letter-spacing:.16em; text-transform:uppercase; margin:0 0 18px; }
.site-footer ul{ list-style:none; margin:0; padding:0; display:grid; gap:10px; }
.site-footer ul a{ font-size:14.5px; color:rgba(255,255,255,.72); }
.site-footer ul a:hover{ color:var(--gold-2); }
.footer-contact p{ font-size:14.5px; margin:0 0 10px; }
.socials{ display:flex; gap:14px; margin-top:18px; }
.socials a{ width:38px; height:38px; border:1px solid rgba(255,255,255,.22); border-radius:50%; display:flex; align-items:center; justify-content:center; font-size:12px; transition:.25s; }
.socials a:hover{ background:var(--gold); color:var(--navy); border-color:var(--gold); }
.footer-bottom{ display:flex; justify-content:space-between; gap:20px; padding-block:24px; font-size:13px; color:rgba(255,255,255,.55); flex-wrap:wrap; }
.newsletter{ display:flex; border:1px solid rgba(255,255,255,.25); margin-top:14px; }
.newsletter input{ flex:1; min-width:0; background:transparent; border:0; padding:12px 14px; color:#fff; font-family:var(--bsans); font-size:14px; }
.newsletter input::placeholder{ color:rgba(255,255,255,.5); }
.newsletter button{ background:var(--gold); border:0; color:var(--navy); padding:0 18px; font-family:var(--hsans); font-weight:600; cursor:pointer; white-space:nowrap; }

/* PAGE HERO (inner) */
.page-hero{ position:relative; background:var(--navy); color:#fff; padding:170px var(--gutter) 70px; overflow:hidden; }
.page-hero::before{ content:""; position:absolute; right:-10%; top:-30%; width:50%; height:160%; background:radial-gradient(circle, rgba(196,154,63,.18), transparent 60%); }
.page-hero .container{ position:relative; }
.page-hero .crumbs{ font-size:13px; letter-spacing:.06em; color:rgba(255,255,255,.6); margin-bottom:18px; }
.page-hero .crumbs a:hover{ color:var(--gold-2); }
.page-hero h1{ font-size:clamp(34px,5vw,64px); max-width:18ch; }
.page-hero p{ margin-top:20px; max-width:60ch; color:rgba(255,255,255,.78); font-size:18px; }

/* prose */
.prose{ max-width:760px; }
.prose h2{ font-size:clamp(24px,3vw,36px); margin:48px 0 18px; }
.prose h3{ font-size:22px; margin:36px 0 12px; }
.prose p{ color:var(--ink); margin-bottom:18px; }
.prose ul{ margin:0 0 20px; padding-left:20px; color:var(--ink); }
.prose li{ margin-bottom:8px; }

/* value grid */
.value-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:clamp(18px,2vw,28px); }
@media (max-width:820px){ .value-grid{ grid-template-columns:1fr; } }
.value-card{ border:1px solid var(--line); padding:32px 28px; background:var(--white); }
.value-card .vc-num{ font-family:var(--hsans); color:var(--gold); font-weight:600; font-size:14px; letter-spacing:.1em; }
.value-card h3{ font-size:21px; margin:14px 0 10px; }
.value-card p{ color:var(--grey); font-size:15px; margin:0; }

/* contact grid */
.contact-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:1px; background:var(--line); border:1px solid var(--line); }
@media (max-width:820px){ .contact-grid{ grid-template-columns:1fr; } }
.office{ background:var(--white); padding:30px 28px; }
.office h3{ font-size:18px; color:var(--navy); margin-top:8px; }
.office p{ color:var(--grey); font-size:15px; margin:10px 0 0; }
.office .flag{ font-size:12px; letter-spacing:.16em; text-transform:uppercase; color:var(--gold); font-weight:600; }

/* form */
.form{ display:grid; gap:18px; max-width:620px; }
.form .row{ display:grid; grid-template-columns:1fr 1fr; gap:18px; }
@media (max-width:560px){ .form .row{ grid-template-columns:1fr; } }
.form label{ font-size:13px; letter-spacing:.04em; text-transform:uppercase; color:var(--grey); font-weight:600; display:block; margin-bottom:8px; }
.form input, .form textarea{ width:100%; border:1px solid var(--line); padding:13px 14px; font-family:var(--bsans); font-size:15px; background:var(--paper); }
.form input:focus, .form textarea:focus{ outline:none; border-color:var(--gold); }

/* reveal */
.reveal{ opacity:0; transform:translateY(24px); transition:opacity .7s ease, transform .7s ease; }
.reveal.in{ opacity:1; transform:none; }

.center{ text-align:center; }
.mt-cta{ margin-top:50px; }
.lead{ font-size:19px; color:var(--grey); max-width:60ch; }

/* ===========================================================
   TRAFIGURA-STRUCTURE COMPONENTS
   =========================================================== */

/* Minimal hero variant — centered (video background) */
.hero--min{ min-height:100svh; }
.hero__media video{ width:100%; height:100%; object-fit:cover; }
.hero--min .hero__inner{ justify-content:center; align-items:center; text-align:center; padding-top:120px; padding-bottom:120px; }
.hero--min .container{ display:flex; flex-direction:column; align-items:center; }
.hero--min h1{ font-size:clamp(38px,6.2vw,90px); max-width:20ch; margin-inline:auto; }
.hero--min .discover{ margin-top:30px; display:inline-flex; align-items:center; gap:.6em; font-family:var(--hsans); font-weight:600; font-size:15px; color:#fff; background:var(--gold); border:1px solid var(--gold); color:var(--navy); border-radius:30px; padding:15px 32px; transition:.25s; }
.hero--min .discover::after{ content:"→"; transition:transform .25s; }
.hero--min .discover:hover{ background:#fff; border-color:#fff; color:var(--navy); }
.hero--min .discover:hover::after{ transform:translateX(5px); }
/* mute play indicator */
.hero__sound{ position:absolute; right:var(--gutter); bottom:26px; z-index:2; width:44px; height:44px; border-radius:50%; border:1px solid rgba(255,255,255,.5); background:rgba(42,42,76,.3); color:#fff; cursor:pointer; display:flex; align-items:center; justify-content:center; font-size:14px; transition:.2s; }
.hero__sound:hover{ border-color:var(--gold); color:var(--gold-2); }

/* Feature banner */
.banner{ position:relative; }
.banner__img{ height:clamp(360px,52vw,560px); }
.banner__img img{ width:100%; height:100%; object-fit:cover; }
.banner__card{ background:var(--white); padding:clamp(34px,4vw,56px); max-width:560px; margin:-90px auto 0; position:relative; border-top:4px solid var(--gold); box-shadow:0 30px 60px -40px rgba(42,42,76,.5); }
.banner__card h3{ font-size:clamp(24px,2.6vw,34px); margin:8px 0 16px; }
.banner__card p{ color:var(--grey); }
@media (max-width:680px){ .banner__card{ margin-inline:var(--gutter); } }

/* News list (Trafigura-style) */
.newslist{ display:grid; grid-template-columns:300px 1fr; gap:clamp(30px,5vw,70px); align-items:start; }
@media (max-width:820px){ .newslist{ grid-template-columns:1fr; } }
.newslist__head h2{ font-size:clamp(26px,3vw,40px); }
.newslist__rows{ border-bottom:1px solid var(--line); }
.news-row{ display:grid; grid-template-columns:150px 1fr 40px; gap:24px; align-items:center; padding:26px 0; border-top:1px solid var(--line); transition:.2s; }
.news-row:hover{ padding-left:8px; }
.news-row .nr-meta{ font-size:13px; color:var(--grey); }
.news-row .nr-meta .type{ display:block; color:var(--gold); font-weight:600; text-transform:uppercase; letter-spacing:.1em; font-size:11px; margin-top:4px; }
.news-row h3{ font-size:clamp(17px,1.6vw,21px); line-height:1.25; }
.news-row .nr-arrow{ font-family:var(--hsans); color:var(--gold); font-size:22px; text-align:right; transition:transform .2s; }
.news-row:hover .nr-arrow{ transform:translateX(5px); }
@media (max-width:560px){ .news-row{ grid-template-columns:1fr; gap:8px; } .news-row .nr-arrow{ display:none; } }

/* What we do + infographic */
.wwd{ display:grid; grid-template-columns:.95fr 1.05fr; gap:clamp(30px,5vw,70px); align-items:center; }
@media (max-width:880px){ .wwd{ grid-template-columns:1fr; } }
.infographic{ width:100%; height:auto; }
.infographic .ig-label{ font-family:var(--hsans); font-weight:600; font-size:13px; fill:var(--navy); }
.infographic .ig-sub{ font-family:var(--bsans); font-size:11px; fill:var(--grey); }
.infographic .ig-node{ fill:#fff; stroke:var(--line); }
.infographic .ig-flow{ fill:none; stroke:var(--gold); stroke-width:2; stroke-dasharray:6 6; }
.infographic .ig-icon{ fill:var(--gold); }

/* 4-tab card block */
.tabs{ display:flex; flex-wrap:wrap; gap:8px; border-bottom:1px solid var(--line); margin-bottom:0; }
.tab{ background:none; border:0; border-bottom:2px solid transparent; padding:16px 20px; font-family:var(--hsans); font-weight:600; font-size:15px; color:var(--grey); cursor:pointer; transition:.2s; margin-bottom:-1px; }
.tab:hover{ color:var(--navy); }
.tab.active{ color:var(--navy); border-color:var(--gold); }
.panel{ display:none; }
.panel.active{ display:grid; grid-template-columns:1.1fr .9fr; gap:0; animation:fade .4s ease; background:var(--navy); color:#fff; }
@keyframes fade{ from{ opacity:0; transform:translateY(10px); } to{ opacity:1; transform:none; } }
.panel__media{ min-height:420px; position:relative; overflow:hidden; }
.panel__media img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
.panel__body{ padding:clamp(34px,4vw,64px); display:flex; flex-direction:column; justify-content:center; }
.panel__body .eyebrow{ color:var(--gold-2); }
.panel__body h3{ font-size:clamp(24px,2.6vw,34px); margin-bottom:16px; }
.panel__body p{ color:rgba(255,255,255,.78); }
@media (max-width:820px){ .panel.active{ grid-template-columns:1fr; } .panel__media{ min-height:260px; } }

/* People */
.people-feature{ display:grid; grid-template-columns:.85fr 1.15fr; gap:clamp(30px,5vw,60px); align-items:center; margin-top:46px; }
@media (max-width:820px){ .people-feature{ grid-template-columns:1fr; } }
.people-feature__media img{ width:100%; aspect-ratio:5/4; object-fit:cover; }
.people-feature blockquote{ font-family:var(--hsans); font-weight:500; font-size:clamp(24px,3vw,38px); line-height:1.25; letter-spacing:-0.01em; margin:0 0 22px; }
.people-feature .who{ font-weight:600; }
.people-feature .who small{ display:block; color:var(--grey); font-weight:400; font-size:15px; margin-top:4px; }
.people-thumbs{ display:flex; gap:14px; margin-top:34px; flex-wrap:wrap; }
.people-thumbs button{ background:none; border:0; padding:0; cursor:pointer; text-align:left; opacity:.55; transition:.2s; }
.people-thumbs button.active, .people-thumbs button:hover{ opacity:1; }
.people-thumbs img{ width:64px; height:64px; border-radius:50%; object-fit:cover; border:2px solid transparent; }
.people-thumbs button.active img{ border-color:var(--gold); }

/* World map network */
.map-wrap{ position:relative; }
.world-map{ width:100%; height:auto; }
.world-map .land{ fill:var(--navy-3); opacity:.18; }
.section--navy .world-map .land{ fill:#fff; opacity:.10; }
.world-map .pin{ fill:var(--gold); }
.world-map .pin-ring{ fill:none; stroke:var(--gold); stroke-width:1.5; opacity:.5; }
.world-map .arc{ fill:none; stroke:var(--gold-2); stroke-width:1.2; opacity:.5; stroke-dasharray:4 5; }
.pin-pulse{ animation:pulse 2.4s ease-out infinite; transform-origin:center; transform-box:fill-box; }
@keyframes pulse{ 0%{ r:4; opacity:.7; } 100%{ r:18; opacity:0; } }
.map-stats{ display:flex; gap:50px; flex-wrap:wrap; margin-top:30px; }
.map-stats .ms .n{ font-family:var(--hsans); font-weight:600; font-size:clamp(30px,3.6vw,46px); color:var(--gold-2); }
.map-stats .ms .l{ font-size:14px; color:rgba(255,255,255,.7); text-transform:uppercase; letter-spacing:.05em; }

/* Careers banner */
.careers-banner{ position:relative; min-height:440px; display:flex; align-items:center; color:#fff; overflow:hidden; }
.careers-banner img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
.careers-banner::after{ content:""; position:absolute; inset:0; background:linear-gradient(90deg,rgba(42,42,76,.85),rgba(42,42,76,.45)); }
.careers-banner .container{ position:relative; z-index:1; }
.careers-banner h2{ font-size:clamp(28px,3.4vw,48px); max-width:18ch; color:#fff; }
.careers-banner .actions{ margin-top:28px; display:flex; gap:14px; flex-wrap:wrap; }

/* ===========================================================
   PER-PAGE THEMES
   Default (no class) = Navy & Gold.
   =========================================================== */

/* ---- Light & minimal ---- */
body.theme-light{
  --navy:#0E2A20; --navy-2:#16352A; --navy-3:#1F4A38;
  --ink:#0C211A; --grey:#5C6A60; --grey-2:#94A097;
  --line:#E6EBE2; --paper:#FFFFFF; --paper-2:#FAFAFB;
  --gold:#1FA15F; --gold-2:#54C07F;
  background:#fff;
}
body.theme-light .section--paper{ background:#FAFAFB; }
body.theme-light .card{ box-shadow:none; }
body.theme-light .card:hover{ box-shadow:0 20px 40px -28px rgba(0,0,0,.22); }
body.theme-light .badge,
body.theme-light .chair__media .badge{ color:#fff; }

/* ---- Bold & dark ---- */
body.theme-dark{
  --navy:#02160F; --navy-2:#06231A; --navy-3:#0E3A2A;
  --ink:#EAF3EC; --grey:#9FB0A4; --grey-2:#7C8C82;
  --line:#123026; --paper:#06231A; --paper-2:#0A2C20;
  --gold:#9CE46C; --gold-2:#C6F0A0;
  background:#02160F; color:var(--ink);
}
body.theme-dark .section--paper{ background:#06231A; }
body.theme-dark .section--alt{ background:#0A2C20; }
body.theme-dark .card,
body.theme-dark .value-card,
body.theme-dark .office,
body.theme-dark .logo-wall .cell,
body.theme-dark .banner__card,
body.theme-dark .stat{ background:#0A2C20; border-color:#123026; }
body.theme-dark .card .card-body p,
body.theme-dark .value-card p,
body.theme-dark .office p,
body.theme-dark .section-head p{ color:var(--grey); }
body.theme-dark .stat .num{ color:var(--gold-2); }
body.theme-dark .contact-grid,
body.theme-dark .stats{ background:#123026; border-color:#123026; }
body.theme-dark .tag{ background:#0A2C20; color:var(--ink); border-color:#16382A; }
body.theme-dark .form input,
body.theme-dark .form textarea{ background:#0A2C20; border-color:#16382A; color:#fff; }
body.theme-dark .news-card{ border-top-color:#16382A; }
body.theme-dark .news-row{ border-color:#123026; }
body.theme-dark .newslist__rows{ border-bottom-color:#123026; }
body.theme-dark .solutions{ border-top-color:#123026; }
body.theme-dark .solution{ border-bottom-color:#123026; }
body.theme-dark .btn{ background:var(--gold); border-color:var(--gold); color:#02160F; }
body.theme-dark .btn:hover{ background:#fff; border-color:#fff; color:#02160F; }
body.theme-dark .btn--ghost{ background:transparent; color:var(--ink); border-color:var(--ink); }
body.theme-dark .btn--ghost:hover{ background:var(--gold); color:#02160F; border-color:var(--gold); }
body.theme-dark .arrow-link{ color:var(--ink); }
body.theme-dark .page-hero{ background:#02160F; }
body.theme-dark .cta-strip{ background:var(--gold); color:#02160F; }
body.theme-dark .tabs{ border-bottom-color:#123026; }
body.theme-dark .tab{ color:var(--grey); }
body.theme-dark .tab.active{ color:var(--ink); }

/* ---- Warm earth tones ---- */
body.theme-earth{
  --navy:#3A271A; --navy-2:#4A3324; --navy-3:#5E4534;
  --ink:#2E2014; --grey:#7C6A57; --grey-2:#A2917C;
  --line:#E8DDCD; --paper:#FBF4E9; --paper-2:#F3E7D5;
  --gold:#C0612C; --gold-2:#E0894E;
  background:#FBF4E9;
}
body.theme-earth .section--alt{ background:#F3E7D5; }

/* ===========================================================
   STAT BAND ("By the numbers")
   =========================================================== */
.stat-band{ background:var(--navy); color:#fff; border-radius:18px; padding:clamp(30px,4vw,48px) clamp(26px,4vw,56px); display:grid; grid-template-columns:1.1fr repeat(4,1fr); gap:clamp(20px,3vw,40px); align-items:center; }
.stat-band__title{ font-family:var(--hsans); font-weight:700; font-size:13px; letter-spacing:.16em; text-transform:uppercase; line-height:1.7; color:#fff; }
.sb-item{ text-align:center; display:flex; flex-direction:column; align-items:center; gap:10px; }
.sb-item .sb-icon{ display:flex; color:var(--gold-2); }
.sb-item .sb-num{ font-family:var(--hsans); font-weight:700; font-size:clamp(28px,3.2vw,40px); line-height:1; }
.sb-item .sb-label{ font-size:11.5px; letter-spacing:.13em; text-transform:uppercase; color:rgba(255,255,255,.82); }
@media (max-width:880px){
  .stat-band{ grid-template-columns:repeat(2,1fr); gap:32px 20px; text-align:center; }
  .stat-band__title{ grid-column:1 / -1; }
}
/* ===== POST-VIDEO: QUOTE + CAPABILITIES + SERIF STATS ===== */
.quote-band{ background:var(--navy); color:#fff; text-align:center; padding:clamp(42px,6vw,78px) var(--gutter) clamp(34px,5vw,60px); }
.quote-band p{ font-family:"Playfair Display", Georgia, serif; font-style:italic; font-weight:500; font-size:clamp(20px,2.7vw,33px); line-height:1.45; max-width:30ch; margin:0 auto; }
.quote-band em{ color:var(--gold-2); font-style:italic; }

.cap-strip{ background:var(--navy); border-top:1px solid rgba(255,255,255,.12); border-bottom:1px solid rgba(255,255,255,.12); overflow:hidden; }
.cap-strip__track{ display:flex; align-items:center; width:max-content; white-space:nowrap; animation:scroll 40s linear infinite; padding:15px 0; }
.cap-strip__track span{ font-family:var(--hsans); font-weight:600; font-size:13px; letter-spacing:.16em; text-transform:uppercase; color:rgba(255,255,255,.82); display:inline-flex; align-items:center; }
.cap-strip__track span::after{ content:"\2022"; color:var(--gold); margin:0 38px; font-size:11px; }

.stat-row{ background:var(--white); padding:clamp(54px,7vw,96px) 0; }
.stat-row__grid{ display:grid; grid-template-columns:repeat(4,1fr); }
.stat-row .sr{ padding:6px clamp(20px,2.4vw,40px); border-left:1px solid var(--line); }
.stat-row .sr:first-child{ border-left:0; }
.stat-row .sr-num{ font-family:"Playfair Display", Georgia, serif; font-weight:600; font-size:clamp(42px,4.8vw,66px); color:var(--navy); line-height:1; letter-spacing:-0.01em; display:inline-block; }
.stat-row .sr-num em{ font-style:italic; font-size:.40em; color:var(--gold); margin-left:3px; font-weight:600; }
.stat-row .sr-label{ margin-top:18px; font-size:12px; letter-spacing:.1em; text-transform:uppercase; color:var(--grey); line-height:1.55; max-width:24ch; }
.stat-row .rule{ height:2px; background:var(--gold); margin-top:34px; }
@media (max-width:820px){
  .stat-row__grid{ grid-template-columns:repeat(2,1fr); gap:36px 0; }
  .stat-row .sr{ border-left:0; }
}
@media (max-width:480px){ .stat-row__grid{ grid-template-columns:1fr; } }

/* ===== CREDO + MARQUEE + STATS (match reference design) ===== */
.credo-strip{ background:var(--navy); color:#fff; border-top:1px solid rgba(255,255,255,.1); border-bottom:1px solid rgba(255,255,255,.1); }
.credo-strip .container{ padding-block:clamp(44px,6vh,80px) clamp(34px,4vh,55px); text-align:center; }
.credo-quote{ font-family:"Fraunces", Georgia, serif; font-weight:300; font-style:italic; font-size:clamp(1.3rem,2.4vw,2.2rem); line-height:1.3; letter-spacing:-0.015em; color:#fff; max-width:920px; margin:0 auto; }
.credo-quote em{ color:var(--gold-2); font-style:italic; }

.cap-strip{ background:transparent; border:0; border-top:1px solid rgba(255,255,255,.1); padding:18px 0; overflow:hidden; }
.cap-strip__track{ display:flex; gap:60px; white-space:nowrap; width:max-content; animation:scroll 45s linear infinite; font-family:"IBM Plex Mono", monospace; font-size:12px; letter-spacing:.2em; text-transform:uppercase; color:rgba(255,255,255,.7); padding:0; }
.cap-strip__track span{ display:flex; align-items:center; gap:60px; }
.cap-strip__track span::after{ content:none; }
.cap-strip__track .dot{ display:inline-block; width:5px; height:5px; background:var(--gold); border-radius:50%; }

.stat-row{ background:var(--paper); padding:80px 0; }
.stat-row__grid{ display:grid; grid-template-columns:repeat(2,1fr); gap:0; }
@media (min-width:900px){ .stat-row__grid{ grid-template-columns:repeat(4,1fr); } }
.stat-row .sr{ position:relative; padding:30px; border-left:0; border-right:1px solid var(--line); border-bottom:1px solid var(--line); text-align:left; }
@media (min-width:900px){ .stat-row .sr{ border-bottom:none; } .stat-row .sr:last-child{ border-right:none; } }
@media (max-width:899px){ .stat-row .sr:nth-child(even){ border-right:none; } .stat-row .sr:nth-last-child(-n+2){ border-bottom:none; } }
.stat-row .sr:hover{ background:rgba(200,160,85,0.04); }
.stat-row .sr-num{ font-family:"Fraunces", Georgia, serif; font-weight:300; font-size:clamp(3rem,5vw,4.5rem); line-height:1; letter-spacing:-0.04em; color:var(--navy); margin-bottom:14px; display:flex; align-items:baseline; gap:2px; }
.stat-row .sr-num em{ font-size:.45em; color:var(--gold); font-style:italic; }
.stat-row .sr-label{ font-family:"IBM Plex Mono", monospace; font-size:11px; letter-spacing:.18em; text-transform:uppercase; color:var(--grey); line-height:1.5; max-width:none; margin-top:0; }
.stat-row .sr-bar{ position:absolute; bottom:0; left:0; height:2px; width:100%; background:var(--gold); }
.stat-row .rule{ display:none; }

/* subsidiary card icon */
.sub-icon{ color:var(--gold); margin-bottom:6px; display:flex; }
.value-card .sub-icon + h3{ margin-top:4px; }

/* subsidiaries / Denzel Group cards */
.subs-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:clamp(18px,2vw,28px); }
@media (max-width:820px){ .subs-grid{ grid-template-columns:1fr; } }
.sub-card{ background:var(--white); border:1px solid var(--line); display:flex; flex-direction:column; overflow:hidden; transition:.3s; }
.sub-card:hover{ transform:translateY(-5px); box-shadow:0 26px 54px -30px rgba(42,42,76,.45); }
.sub-card__top{ background:var(--navy); color:#fff; padding:28px 26px; display:flex; align-items:center; gap:13px; }
.sub-card__top .sub-ic{ color:var(--gold-2); display:flex; }
.sub-wordmark{ font-family:var(--hsans); font-weight:700; letter-spacing:.05em; font-size:18px; line-height:1; }
.sub-wordmark em{ font-family:"Fraunces", Georgia, serif; font-style:italic; font-weight:400; color:var(--gold-2); letter-spacing:0; font-size:1.05em; }
.sub-card__body{ padding:26px 26px 30px; display:flex; flex-direction:column; gap:16px; flex:1; }
.sub-card__body > p{ color:var(--grey); margin:0; font-size:15px; }
.sub-list{ list-style:none; margin:0; padding:0; display:grid; gap:9px; }
.sub-list li{ font-size:14px; color:var(--navy); padding-left:20px; position:relative; }
.sub-list li::before{ content:""; position:absolute; left:0; top:7px; width:7px; height:7px; background:var(--gold); border-radius:50%; }
.sub-card__body .arrow-link{ margin-top:auto; align-self:flex-start; font-size:14px; }

/* subsidiary card media + tall header (charter, no image) */
.sub-card__media{ display:block; aspect-ratio:16/9; overflow:hidden; background:var(--navy-2); }
.sub-card__media img{ width:100%; height:100%; object-fit:cover; transition:transform .6s; }
.sub-card:hover .sub-card__media img{ transform:scale(1.05); }
.sub-card__top--tall{ padding-block:34px; }

/* group page — charter media fallback panel */
.project__media.media-fallback{ display:flex; align-items:center; justify-content:center; background:linear-gradient(135deg,var(--navy),var(--navy-3)); }
.media-fallback .mf-mark{ font-family:var(--hsans); font-weight:700; letter-spacing:.06em; color:#fff; font-size:clamp(22px,3vw,34px); }
.media-fallback .mf-mark em{ font-family:"Fraunces", Georgia, serif; font-style:italic; font-weight:400; color:var(--gold-2); }

/* ===== NEWS (image-led editorial) ===== */
.news2{ display:grid; grid-template-columns:1.15fr .85fr; gap:clamp(20px,3vw,38px); align-items:stretch; }
@media (max-width:880px){ .news2{ grid-template-columns:1fr; } }
.news-feature{ display:flex; flex-direction:column; background:var(--white); border:1px solid var(--line); overflow:hidden; transition:.3s; }
.news-feature:hover{ box-shadow:0 26px 54px -30px rgba(42,42,76,.4); transform:translateY(-3px); }
.news-feature__media{ aspect-ratio:16/9; overflow:hidden; }
.news-feature__media img{ width:100%; height:100%; object-fit:cover; transition:transform .6s; }
.news-feature:hover .news-feature__media img{ transform:scale(1.05); }
.news-feature__body{ padding:30px clamp(24px,2.4vw,34px) 34px; display:flex; flex-direction:column; gap:14px; flex:1; }
.news-feature__body h3{ font-size:clamp(21px,2.3vw,30px); line-height:1.18; }
.news-feature__body p{ color:var(--grey); margin:0; font-size:15.5px; }
.news-feature__body .arrow-link{ align-self:flex-start; margin-top:auto; font-size:14px; }
.news2-col{ display:flex; flex-direction:column; gap:clamp(16px,2vw,20px); }
.news2-card{ display:grid; grid-template-columns:130px 1fr; background:var(--white); border:1px solid var(--line); overflow:hidden; transition:.25s; flex:1; }
.news2-card:hover{ box-shadow:0 18px 40px -28px rgba(42,42,76,.4); }
.news2-card__media{ overflow:hidden; background:var(--navy-2); }
.news2-card__media img{ width:100%; height:100%; object-fit:cover; transition:transform .5s; }
.news2-card:hover .news2-card__media img{ transform:scale(1.06); }
.news2-card__body{ padding:16px 18px; display:flex; flex-direction:column; gap:7px; justify-content:center; }
.news2-card__body h4{ font-size:15.5px; line-height:1.28; font-family:var(--hsans); font-weight:600; color:var(--navy); }
.n-cat{ font-family:"IBM Plex Mono", monospace; font-size:11px; letter-spacing:.12em; text-transform:uppercase; color:var(--gold); }
@media (max-width:520px){ .news2-card{ grid-template-columns:100px 1fr; } }

/* news hover-to-feature */
.news2-card{ cursor:pointer; }
.news2-card.active{ border-color:var(--gold); box-shadow:0 14px 34px -26px rgba(42,42,76,.5); }
.news2-card.active .n-cat{ color:var(--gold); }
@keyframes nffade{ from{ opacity:.25; } to{ opacity:1; } }

/* full-width newsroom: larger featured image */
.news2 .news-feature__media{ aspect-ratio:16/8.2; }
@media (min-width:1100px){ .news2{ grid-template-columns:1.25fr .75fr; } }

/* ===== CHAIRMAN'S MESSAGE ===== */
.chairman-head{ display:grid; grid-template-columns:.85fr 2.15fr; gap:clamp(24px,3vw,50px); align-items:start; margin-bottom:clamp(36px,4vw,56px); max-width:none; }
.chairman-head .eyebrow{ margin-top:8px; }
.chairman-title{ font-size:clamp(26px,3.6vw,50px); line-height:1.14; letter-spacing:-0.02em; }
.chairman-title span{ color:var(--gold); }
@media (max-width:880px){ .chairman-head{ grid-template-columns:1fr; } }

.chairman-grid{ display:grid; grid-template-columns:.8fr 1fr 1.15fr; gap:clamp(16px,2vw,26px); align-items:stretch; }
@media (max-width:980px){ .chairman-grid{ grid-template-columns:1fr; } }
.chairman-photo{ border-radius:16px; overflow:hidden; background:var(--navy); min-height:340px; }
.chairman-photo img{ width:100%; height:100%; object-fit:cover; aspect-ratio:3/4; }
.chairman-photo.noimg{ position:relative; }
.chairman-photo.noimg::after{ content:"HOAG"; position:absolute; inset:0; display:flex; align-items:center; justify-content:center; font-family:var(--hsans); font-weight:700; font-size:48px; letter-spacing:.1em; color:var(--gold-2); background:linear-gradient(135deg,var(--navy),var(--navy-3)); }
.chairman-card{ background:var(--navy); color:#fff; border-radius:16px; padding:clamp(28px,3vw,42px); display:flex; flex-direction:column; justify-content:space-between; gap:34px; position:relative; overflow:hidden; }
.chairman-card::after{ content:""; position:absolute; right:-30px; bottom:-30px; width:200px; height:200px; border-radius:50%; border:1px solid rgba(255,255,255,.10); box-shadow:0 0 0 18px rgba(255,255,255,.04), 0 0 0 40px rgba(255,255,255,.03); }
.chairman-card h3{ font-size:clamp(22px,2.4vw,28px); line-height:1.12; position:relative; z-index:1; }
.chairman-card .role{ font-size:11.5px; letter-spacing:.12em; text-transform:uppercase; color:rgba(255,255,255,.7); margin:12px 0 0; position:relative; z-index:1; }
.chairman-card .sig{ font-family:"Fraunces", Georgia, serif; font-style:italic; font-weight:500; font-size:clamp(22px,2.6vw,30px); color:var(--gold-2); position:relative; z-index:1; }
.chairman-text{ display:flex; flex-direction:column; gap:14px; }
.chairman-text p{ color:var(--grey); font-size:14.5px; margin:0; line-height:1.65; }

/* ===== Chairman story (editorial, screenshot-matched) ===== */
.chairman2{ background:var(--paper); }
.ch2-title{ font-family:"Fraunces",Georgia,serif; font-weight:340; font-size:clamp(30px,5vw,62px); line-height:1.08; letter-spacing:-0.015em; color:var(--navy); max-width:20ch; margin:0 0 clamp(28px,4vw,52px); }
.ch2-title em{ font-style:italic; color:var(--gold); }
.ch2-grid{ display:grid; grid-template-columns:0.9fr 1.1fr; gap:clamp(28px,4.5vw,72px); align-items:start; }
.ch2-photo{ margin:0; position:relative; background:#11111a; border-radius:3px; overflow:hidden; box-shadow:0 30px 60px -28px rgba(20,20,42,.5); }
.ch2-photo img{ display:block; width:100%; height:100%; object-fit:cover; aspect-ratio:4/5; }
.ch2-photo figcaption{ position:absolute; left:18px; right:18px; bottom:15px; display:flex; justify-content:space-between; gap:12px; font-family:"IBM Plex Mono",monospace; font-size:10px; letter-spacing:.16em; text-transform:uppercase; color:rgba(255,255,255,.6); padding-top:10px; border-top:1px solid rgba(255,255,255,.22); }
.ch2-body{ padding-top:4px; }
.ch2-lead{ font-family:"Fraunces",Georgia,serif; font-weight:500; font-size:clamp(19px,2.1vw,25px); line-height:1.36; color:var(--navy); margin:0 0 clamp(20px,2.4vw,30px); }
.ch2-body p{ color:var(--grey); font-size:clamp(15px,1.05vw,16.5px); line-height:1.72; margin:0 0 18px; }
.ch2-body p strong{ color:var(--navy); font-weight:600; }
.ch2-body a{ color:var(--navy); text-decoration:underline; text-underline-offset:2px; text-decoration-color:var(--gold); }
.ch2-drop::first-letter{ font-family:"Fraunces",Georgia,serif; float:left; font-size:3.4em; line-height:.76; font-weight:420; color:var(--gold); padding:6px 10px 0 0; }
.ch2-quote{ font-family:"Fraunces",Georgia,serif; font-style:italic; font-weight:380; font-size:clamp(20px,2.2vw,27px); line-height:1.34; color:var(--gold); border-left:2px solid var(--gold); padding:4px 0 4px 22px; margin:clamp(22px,3vw,34px) 0 0; }
@media (max-width:820px){
  .ch2-grid{ grid-template-columns:1fr; gap:30px; }
  .ch2-photo{ max-width:440px; }
}

/* Chairman story — full-bleed wide layout */
.chairman2 .container{ padding-left:clamp(20px,5vw,90px); padding-right:clamp(20px,5vw,90px); }
.chairman2 .ch2-title{ max-width:32ch; }
.chairman2 .ch2-grid{ grid-template-columns:1fr 1.15fr; gap:clamp(32px,5vw,90px); align-items:stretch; }
.chairman2 .ch2-photo{ min-height:100%; }
.chairman2 .ch2-photo img{ aspect-ratio:auto; min-height:560px; }
.chairman2 .ch2-body{ align-self:center; max-width:none; }
@media (max-width:820px){
  .chairman2 .ch2-grid{ grid-template-columns:1fr; }
  .chairman2 .ch2-photo{ max-width:none; }
  .chairman2 .ch2-photo img{ min-height:420px; }
}

/* Stat row — full-bleed wide */
.stat-row .container{ padding-left:clamp(20px,5vw,90px); padding-right:clamp(20px,5vw,90px); }
.stat-row .stat-row__grid{ max-width:none; }

/* ===== $765M portfolio grid ===== */
.port-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:18px; margin-top:26px; }
.port-card{ background:#fff; border:1px solid var(--line); border-radius:14px; padding:24px 22px; display:flex; flex-direction:column; gap:7px; transition:transform .25s ease, box-shadow .25s ease, border-color .25s ease; }
.port-card:hover{ transform:translateY(-4px); box-shadow:0 22px 40px -26px rgba(20,20,42,.42); border-color:var(--gold); }
.port-card.feat{ border-color:var(--gold); box-shadow:0 0 0 1px var(--gold) inset; }
.port-card .pc-top{ display:flex; align-items:baseline; justify-content:space-between; gap:10px; margin-bottom:2px; }
.pc-val{ font-family:"Fraunces",Georgia,serif; font-weight:430; font-size:31px; letter-spacing:-0.01em; color:var(--navy); }
.pc-roi{ font-family:"IBM Plex Mono",monospace; font-size:10.5px; letter-spacing:.05em; color:var(--gold); background:rgba(200,162,78,.13); padding:4px 9px; border-radius:20px; white-space:nowrap; }
.port-card .eyebrow{ margin:0; }
.port-card h3{ font-size:18.5px; line-height:1.22; color:var(--navy); margin:1px 0; }
.port-card p{ color:var(--grey); font-size:14.5px; line-height:1.6; margin:0; flex:1; }
.port-card p a{ color:var(--gold); font-weight:600; text-decoration:none; white-space:nowrap; }
.port-card p a:hover{ text-decoration:underline; }
.pc-loc{ font-family:"IBM Plex Mono",monospace; font-size:10px; letter-spacing:.04em; text-transform:uppercase; color:var(--grey-2); border-top:1px solid var(--line); padding-top:12px; margin-top:6px; }
.port-total{ display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:18px; margin-top:24px; background:var(--navy); color:#fff; border-radius:16px; padding:26px clamp(24px,3vw,36px); }
.port-total .pt-label{ display:block; font-family:"IBM Plex Mono",monospace; font-size:10.5px; letter-spacing:.14em; text-transform:uppercase; color:var(--gold-2); margin-bottom:5px; }
.port-total .pt-num{ font-family:"Fraunces",Georgia,serif; font-weight:400; font-size:clamp(30px,4vw,46px); line-height:1; }
.pt-meta{ display:flex; gap:clamp(16px,2.4vw,30px); flex-wrap:wrap; }
.pt-meta span{ font-size:13.5px; color:rgba(255,255,255,.82); }
@media (max-width:900px){ .port-grid{ grid-template-columns:repeat(2,1fr); } }
@media (max-width:600px){ .port-grid{ grid-template-columns:1fr; } }

/* ===== portfolio cards with image + click-to-detail ===== */
.port-card{ padding:0; overflow:hidden; cursor:pointer; }
.port-card .pc-img{ aspect-ratio:16/10; overflow:hidden; background:var(--navy); }
.port-card .pc-img img{ width:100%; height:100%; object-fit:cover; transition:transform .5s ease; }
.port-card:hover .pc-img img{ transform:scale(1.06); }
.port-card .pc-content{ padding:20px 22px 22px; display:flex; flex-direction:column; gap:7px; }
.port-card .pc-more{ font-family:"IBM Plex Mono",monospace; font-size:11px; letter-spacing:.05em; color:var(--gold); margin-top:4px; opacity:.85; }
.port-card:hover .pc-more{ opacity:1; }

/* modal */
.proj-modal{ position:fixed; inset:0; z-index:2000; display:none; }
.proj-modal.open{ display:block; }
.pm-backdrop{ position:absolute; inset:0; background:rgba(20,20,40,.6); backdrop-filter:blur(3px); }
.pm-dialog{ position:relative; max-width:920px; width:calc(100% - 40px); max-height:90vh; overflow:auto; margin:5vh auto 0; background:#fff; border-radius:18px; display:grid; grid-template-columns:1fr 1fr; box-shadow:0 40px 90px -30px rgba(10,10,30,.6); animation:pmIn .35s ease; }
@keyframes pmIn{ from{ opacity:0; transform:translateY(18px);} to{ opacity:1; transform:none;} }
.pm-close{ position:absolute; top:14px; right:16px; z-index:3; width:38px; height:38px; border:none; border-radius:50%; background:rgba(255,255,255,.9); color:var(--navy); font-size:24px; line-height:1; cursor:pointer; box-shadow:0 4px 14px rgba(0,0,0,.18); }
.pm-close:hover{ background:#fff; }
.pm-media{ background:var(--navy); }
.pm-media img{ width:100%; height:100%; object-fit:cover; min-height:280px; }
.pm-body{ padding:clamp(24px,3vw,40px); }
.pm-top{ display:flex; align-items:baseline; gap:14px; margin-bottom:6px; }
.pm-val{ font-family:"Fraunces",Georgia,serif; font-weight:430; font-size:38px; letter-spacing:-0.01em; color:var(--navy); }
.pm-body h3{ font-size:clamp(22px,2.4vw,30px); line-height:1.18; color:var(--navy); margin:2px 0 14px; }
.pm-points{ list-style:none; padding:0; margin:0 0 22px; display:flex; flex-direction:column; gap:11px; }
.pm-points li{ position:relative; padding-left:22px; color:var(--grey); font-size:15px; line-height:1.6; }
.pm-points li::before{ content:""; position:absolute; left:0; top:9px; width:8px; height:8px; border-radius:50%; background:var(--gold); }
.pm-meta{ border-top:1px solid var(--line); padding-top:18px; display:flex; flex-direction:column; gap:14px; }
.pm-meta > div{ display:flex; flex-direction:column; gap:2px; }
.pm-k{ font-family:"IBM Plex Mono",monospace; font-size:10.5px; letter-spacing:.12em; text-transform:uppercase; color:var(--gold); }
.pm-meta > div span:last-child{ color:var(--navy); font-size:14.5px; font-weight:500; }
@media (max-width:760px){
  .pm-dialog{ grid-template-columns:1fr; margin:4vh auto 0; }
  .pm-media img{ min-height:200px; max-height:240px; }
}

/* ===== Live markets ticker band ===== */
.ticker-band{ display:flex; align-items:stretch; background:var(--navy); color:#fff; overflow:hidden; }
.ticker-band__label{ flex:0 0 auto; display:flex; align-items:center; gap:8px; padding:0 18px; background:var(--gold); color:var(--navy); font-family:"IBM Plex Mono",monospace; font-size:11px; letter-spacing:.16em; text-transform:uppercase; font-weight:500; }
.ticker-viewport{ position:relative; flex:1; overflow:hidden; }
.ticker-viewport::after{ content:""; position:absolute; top:0; right:0; width:60px; height:100%; background:linear-gradient(90deg,rgba(42,42,76,0),var(--navy)); pointer-events:none; }
.ticker-row{ display:flex; width:max-content; animation:tickerScroll 46s linear infinite; }
.ticker-band:hover .ticker-row{ animation-play-state:paused; }
@keyframes tickerScroll{ from{ transform:translateX(0);} to{ transform:translateX(-50%);} }
.ticker-item{ display:flex; align-items:baseline; gap:9px; padding:12px 26px; border-right:1px solid rgba(255,255,255,.08); white-space:nowrap; }
.ticker-item .t-name{ font-size:12px; letter-spacing:.04em; text-transform:uppercase; color:rgba(255,255,255,.62); }
.ticker-item .t-val{ font-family:"IBM Plex Mono",monospace; font-size:13.5px; color:#fff; }
.ticker-item .t-val small{ font-size:10.5px; opacity:.55; }
.ticker-item .t-chg{ font-family:"IBM Plex Mono",monospace; font-size:12px; }
.ticker-item .t-chg.up{ color:#5FD08A; }
.ticker-item .t-chg.down{ color:#F08A8A; }

/* ===== Interactive global map ===== */
.map-wrap{ position:relative; }
.hub{ cursor:pointer; }
.hub .hub-hit{ fill:transparent; }
.hub .pin{ transition:r .2s ease, fill .2s ease; }
.hub:hover .pin, .hub:focus .pin{ fill:#fff; r:7; outline:none; }
.hub:focus{ outline:none; }
.hub.active .pin{ fill:var(--gold); r:7; }
.hub text{ transition:fill .2s ease; }
.hub:hover text, .hub.active text{ fill:#fff; font-weight:600; }
.hub-card{ position:absolute; top:14px; left:14px; min-width:230px; max-width:300px; background:rgba(255,255,255,.97); color:var(--navy); border-radius:12px; padding:16px 18px; box-shadow:0 18px 40px -18px rgba(0,0,0,.45); animation:pmIn .3s ease; }
.hub-card__country{ font-family:"IBM Plex Mono",monospace; font-size:10px; letter-spacing:.14em; text-transform:uppercase; color:var(--gold); }
.hub-card h4{ font-size:20px; margin:4px 0 6px; color:var(--navy); }
.hub-card p{ font-size:13.5px; line-height:1.5; color:var(--grey); margin:0; }
.hub-card__hint{ display:block; margin-top:10px; font-size:11px; color:var(--grey-2); font-style:italic; }
@media (max-width:640px){ .hub-card{ position:static; margin-top:16px; max-width:none; } }

/* ===== Markets & Insights platform ===== */
.mkt-statusbar{ border-bottom:1px solid var(--line); background:var(--white); }
.mkt-statusbar__bar{ display:flex; align-items:center; justify-content:space-between; padding-top:12px; padding-bottom:12px; }
.mkt-status{ display:inline-flex; align-items:center; gap:9px; font-family:"IBM Plex Mono",monospace; font-size:12px; letter-spacing:.04em; color:var(--grey); }
.mkt-status .dot{ width:8px; height:8px; border-radius:50%; background:var(--grey-2); }
.mkt-status.live .dot{ background:#28c172; box-shadow:0 0 0 4px rgba(40,193,114,.18); animation:pulseDot 1.6s ease infinite; }
.mkt-status.sample .dot{ background:var(--gold); }
.mkt-status.err .dot{ background:#e06a6a; }
@keyframes pulseDot{ 0%,100%{ box-shadow:0 0 0 3px rgba(40,193,114,.18);} 50%{ box-shadow:0 0 0 6px rgba(40,193,114,.05);} }
.mkt-cfg-toggle{ background:none; border:1px solid var(--line); border-radius:20px; padding:7px 16px; font-size:12.5px; color:var(--navy); cursor:pointer; }
.mkt-cfg-toggle:hover{ border-color:var(--gold); }
.mkt-cfg{ border-top:1px solid var(--line); background:var(--paper); padding:18px 0; }
.mkt-cfg p{ font-size:13.5px; color:var(--grey); margin:0 0 14px; }
.mkt-cfg a{ color:var(--navy); text-decoration:underline; text-decoration-color:var(--gold); }
.mkt-cfg-row{ display:flex; flex-wrap:wrap; gap:14px; align-items:flex-end; }
.mkt-cfg-row label{ display:flex; flex-direction:column; gap:5px; font-size:11px; letter-spacing:.1em; text-transform:uppercase; color:var(--grey); }
.mkt-cfg-row input{ width:280px; max-width:100%; padding:11px 13px; border:1px solid var(--line); border-radius:8px; font-size:14px; }
.mkt-cfg-row input:focus{ outline:none; border-color:var(--gold); }

.board-head{ display:flex; flex-wrap:wrap; gap:18px; align-items:flex-end; justify-content:space-between; margin-bottom:14px; }
.board-tools{ display:flex; flex-wrap:wrap; gap:10px; align-items:center; }
.board-tools input[type=search]{ padding:9px 14px; border:1px solid var(--line); border-radius:22px; font-size:13.5px; min-width:180px; }
.board-tools input[type=search]:focus{ outline:none; border-color:var(--gold); }
.chip-row{ display:flex; gap:7px; flex-wrap:wrap; }
.chip{ background:var(--paper-2); border:1px solid transparent; border-radius:20px; padding:8px 15px; font-size:12.5px; color:var(--grey); cursor:pointer; transition:all .18s ease; }
.chip:hover{ color:var(--navy); }
.chip.active{ background:var(--navy); color:#fff; }
.board-refresh{ width:38px; height:38px; border:1px solid var(--line); border-radius:50%; background:#fff; font-size:18px; color:var(--navy); cursor:pointer; line-height:1; }
.board-refresh:hover{ border-color:var(--gold); transform:rotate(90deg); transition:transform .3s ease; }
.board-updated{ font-family:"IBM Plex Mono",monospace; font-size:11.5px; color:var(--grey-2); margin:0 0 18px; }

.cmd-grid{ display:grid; grid-template-columns:repeat(auto-fill,minmax(220px,1fr)); gap:14px; }
.cmd-card{ background:#fff; border:1px solid var(--line); border-radius:14px; padding:18px 18px 16px; transition:transform .2s ease, box-shadow .2s ease, border-color .2s ease; }
.cmd-card:hover{ transform:translateY(-3px); box-shadow:0 18px 34px -24px rgba(20,20,42,.4); border-color:var(--gold); }
.cmd-card .cc-cat{ font-family:"IBM Plex Mono",monospace; font-size:9.5px; letter-spacing:.12em; text-transform:uppercase; color:var(--gold); }
.cmd-card .cc-name{ font-family:var(--hsans); font-weight:600; font-size:15.5px; color:var(--navy); margin:3px 0 10px; }
.cmd-card .cc-price{ font-family:"IBM Plex Mono",monospace; font-size:24px; color:var(--navy); letter-spacing:-0.01em; }
.cmd-card .cc-chg{ display:inline-block; margin-top:8px; font-family:"IBM Plex Mono",monospace; font-size:12.5px; padding:3px 9px; border-radius:14px; }
.cmd-card .cc-chg.up{ color:#1c9e5c; background:rgba(40,193,114,.12); }
.cmd-card .cc-chg.down{ color:#cf5151; background:rgba(224,106,106,.12); }
.cmd-card .cc-range{ margin-top:11px; height:4px; border-radius:3px; background:var(--paper-2); position:relative; overflow:hidden; }
.cmd-card .cc-range i{ position:absolute; top:0; bottom:0; width:8px; border-radius:3px; background:var(--gold); }
.cmd-empty{ color:var(--grey); font-size:14px; padding:30px 0; }

.insights-grid{ display:grid; grid-template-columns:1fr 1fr 1.2fr; gap:22px; }
.insight-col{ background:#fff; border:1px solid var(--line); border-radius:14px; padding:22px; }
.ic-title{ font-size:14px; margin:0 0 14px; color:var(--navy); font-family:var(--hsans); }
.ic-title.up{ color:#1c9e5c; } .ic-title.down{ color:#cf5151; }
.mover-list{ display:flex; flex-direction:column; gap:10px; }
.mover{ display:flex; align-items:center; justify-content:space-between; gap:10px; padding-bottom:10px; border-bottom:1px solid var(--line); }
.mover:last-child{ border-bottom:none; padding-bottom:0; }
.mover .mv-name{ font-size:14px; color:var(--navy); }
.mover .mv-px{ font-family:"IBM Plex Mono",monospace; font-size:12px; color:var(--grey); }
.mover .mv-chg{ font-family:"IBM Plex Mono",monospace; font-size:12.5px; font-weight:500; }
.mover .mv-chg.up{ color:#1c9e5c; } .mover .mv-chg.down{ color:#cf5151; }
.insight-note p{ color:var(--grey); font-size:14.5px; line-height:1.65; margin:0; }

.nx-grid{ display:grid; grid-template-columns:repeat(auto-fill,minmax(300px,1fr)); gap:20px; }
.nx-card{ display:flex; flex-direction:column; background:#fff; border:1px solid var(--line); border-radius:14px; overflow:hidden; text-decoration:none; color:inherit; transition:transform .2s ease, box-shadow .2s ease; }
.nx-card:hover{ transform:translateY(-4px); box-shadow:0 22px 40px -26px rgba(20,20,42,.42); }
.nx-card .nx-img{ aspect-ratio:16/9; background:var(--navy); overflow:hidden; }
.nx-card .nx-img img{ width:100%; height:100%; object-fit:cover; transition:transform .5s ease; }
.nx-card:hover .nx-img img{ transform:scale(1.06); }
.nx-card .nx-body{ padding:18px 20px 20px; display:flex; flex-direction:column; gap:8px; flex:1; }
.nx-card .nx-meta{ font-family:"IBM Plex Mono",monospace; font-size:10.5px; letter-spacing:.05em; text-transform:uppercase; color:var(--gold); }
.nx-card h3{ font-size:17px; line-height:1.3; color:var(--navy); margin:0; }
.nx-card p{ font-size:14px; line-height:1.55; color:var(--grey); margin:0; flex:1; }
.nx-card .nx-src{ font-size:12px; color:var(--grey-2); margin-top:2px; }
.nx-skel{ height:300px; border-radius:14px; background:linear-gradient(100deg,var(--paper-2) 30%,#fff 50%,var(--paper-2) 70%); background-size:200% 100%; animation:nxShine 1.3s linear infinite; }
@keyframes nxShine{ from{ background-position:200% 0;} to{ background-position:-200% 0;} }

@media (max-width:880px){ .insights-grid{ grid-template-columns:1fr; } }

/* ===== Commodities dashboard ===== */
.view-toggle{ display:inline-flex; border:1px solid var(--line); border-radius:22px; overflow:hidden; }
.view-toggle button{ background:#fff; border:none; padding:8px 13px; font-size:15px; color:var(--grey); cursor:pointer; line-height:1; }
.view-toggle button.active{ background:var(--navy); color:#fff; }

.kpi-row{ display:grid; grid-template-columns:repeat(5,1fr); gap:12px; margin-bottom:22px; }
.kpi{ background:#fff; border:1px solid var(--line); border-radius:12px; padding:14px 16px; }
.kpi .k-l{ font-family:"IBM Plex Mono",monospace; font-size:9.5px; letter-spacing:.12em; text-transform:uppercase; color:var(--grey-2); }
.kpi .k-v{ font-family:"Fraunces",Georgia,serif; font-weight:430; font-size:24px; color:var(--navy); margin-top:4px; }
.kpi .k-v.up{ color:#1c9e5c; } .kpi .k-v.down{ color:#cf5151; }
.kpi .k-s{ font-size:11.5px; color:var(--grey); margin-top:2px; }

.dash-feature{ display:grid; grid-template-columns:1.6fr 1fr; gap:18px; margin-bottom:26px; }
.dchart{ background:#fff; border:1px solid var(--line); border-radius:16px; padding:20px 22px; }
.dchart-head{ display:flex; justify-content:space-between; align-items:flex-start; gap:14px; }
.dchart-cat{ font-family:"IBM Plex Mono",monospace; font-size:10px; letter-spacing:.12em; text-transform:uppercase; color:var(--gold); }
.dchart-head h3{ font-size:21px; color:var(--navy); margin:3px 0 0; }
.dchart-px{ text-align:right; }
.dcp-now{ font-family:"IBM Plex Mono",monospace; font-size:22px; color:var(--navy); display:block; }
.dcp-chg{ font-family:"IBM Plex Mono",monospace; font-size:13px; }
.dcp-chg.up{ color:#1c9e5c; } .dcp-chg.down{ color:#cf5151; }
.tf-row{ display:flex; gap:6px; margin:14px 0 8px; }
.tf-row button{ background:var(--paper-2); border:none; border-radius:7px; padding:6px 12px; font-size:12px; font-family:"IBM Plex Mono",monospace; color:var(--grey); cursor:pointer; }
.tf-row button.active{ background:var(--navy); color:#fff; }
.dchart-canvas{ width:100%; height:230px; position:relative; }
.dchart-canvas svg{ width:100%; height:100%; display:block; overflow:visible; }
.dchart-canvas .ch-tip{ position:absolute; pointer-events:none; background:var(--navy); color:#fff; font-family:"IBM Plex Mono",monospace; font-size:11px; padding:5px 8px; border-radius:6px; white-space:nowrap; transform:translate(-50%,-130%); opacity:0; transition:opacity .12s; }

.dwatch{ background:#fff; border:1px solid var(--line); border-radius:16px; padding:8px 6px; display:flex; flex-direction:column; }
.dwatch-head{ font-family:"IBM Plex Mono",monospace; font-size:10px; letter-spacing:.12em; text-transform:uppercase; color:var(--grey-2); padding:10px 14px 8px; }
.dwatch-list{ overflow:auto; max-height:300px; }
.dw{ display:grid; grid-template-columns:1fr auto auto; gap:10px; align-items:center; padding:9px 14px; border-radius:9px; cursor:pointer; }
.dw:hover{ background:var(--paper-2); }
.dw.sel{ background:rgba(200,162,78,.12); }
.dw .dw-n{ font-size:13.5px; color:var(--navy); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.dw .dw-p{ font-family:"IBM Plex Mono",monospace; font-size:12px; color:var(--grey); }
.dw .dw-c{ font-family:"IBM Plex Mono",monospace; font-size:12px; }
.dw .dw-c.up{ color:#1c9e5c; } .dw .dw-c.down{ color:#cf5151; }

.cmd-card{ cursor:pointer; }
.cmd-card .cc-spark{ margin-top:10px; height:34px; }
.cmd-card .cc-spark svg{ width:100%; height:100%; display:block; }

.cmd-table-wrap{ overflow-x:auto; border:1px solid var(--line); border-radius:14px; }
.cmd-table{ width:100%; border-collapse:collapse; font-size:14px; background:#fff; }
.cmd-table th, .cmd-table td{ padding:13px 16px; text-align:left; border-bottom:1px solid var(--line); white-space:nowrap; }
.cmd-table th{ font-family:"IBM Plex Mono",monospace; font-size:10.5px; letter-spacing:.08em; text-transform:uppercase; color:var(--grey); cursor:pointer; user-select:none; background:var(--paper); }
.cmd-table th.num, .cmd-table td.num{ text-align:right; }
.cmd-table th:hover{ color:var(--navy); }
.cmd-table th.sorted::after{ content:" ▾"; color:var(--gold); }
.cmd-table th.sorted.asc::after{ content:" ▴"; }
.cmd-table tbody tr{ cursor:pointer; }
.cmd-table tbody tr:hover{ background:var(--paper-2); }
.cmd-table tbody tr.sel{ background:rgba(200,162,78,.1); }
.cmd-table .ct-name{ color:var(--navy); font-weight:500; }
.cmd-table .ct-cat{ color:var(--grey); font-size:12px; }
.cmd-table .ct-px{ font-family:"IBM Plex Mono",monospace; color:var(--navy); }
.cmd-table .ct-chg{ font-family:"IBM Plex Mono",monospace; }
.cmd-table .ct-chg.up{ color:#1c9e5c; } .cmd-table .ct-chg.down{ color:#cf5151; }
.cmd-table .ct-spark{ width:90px; height:26px; display:inline-block; vertical-align:middle; }

@media (max-width:980px){ .kpi-row{ grid-template-columns:repeat(2,1fr); } .dash-feature{ grid-template-columns:1fr; } }

/* ===== Markets & Insights — compelling hero ===== */
.page-hero--markets{ background:linear-gradient(118deg,#20203a 0%,#2A2A4C 48%,#34335C 100%); padding-bottom:84px; }
.page-hero--markets::before{ content:""; position:absolute; inset:0; right:0; top:0; width:100%; height:100%;
  background:url('svc-finance.jpg') center/cover no-repeat;
  opacity:.16; mix-blend-mode:luminosity; }
.page-hero--markets::after{ content:""; position:absolute; inset:0;
  background:radial-gradient(circle at 82% 18%, rgba(200,162,78,.22), transparent 42%),
             linear-gradient(0deg, var(--navy) 2%, rgba(42,42,76,.2) 55%, transparent 100%); }
.mh-decor{ position:absolute; inset:0; overflow:hidden; pointer-events:none; opacity:.9; }
.mh-decor svg{ position:absolute; left:0; bottom:0; width:100%; height:62%; }
.mh-grid line{ stroke:rgba(255,255,255,.06); stroke-width:1; }
.mh-area{ fill:url(#none); fill:rgba(200,162,78,.10); }
.mh-line{ fill:none; stroke:var(--gold); stroke-width:2.5; stroke-linecap:round; stroke-linejoin:round;
  filter:drop-shadow(0 0 6px rgba(200,162,78,.45));
  stroke-dasharray:2600; stroke-dashoffset:2600; animation:mhDraw 3.2s ease forwards; }
@keyframes mhDraw{ to{ stroke-dashoffset:0; } }
.page-hero--markets .container{ z-index:2; }
.page-hero--markets h1{ text-shadow:0 2px 20px rgba(0,0,0,.25); }
@media (prefers-reduced-motion:reduce){ .mh-line{ animation:none; stroke-dashoffset:0; } }

/* ===== Commodities dashboard — compelling backdrop ===== */
#dash{ position:relative; overflow:hidden;
  background:
    radial-gradient(circle at 92% -2%, rgba(200,162,78,.12), transparent 30%),
    radial-gradient(circle at 0% 102%, rgba(42,42,76,.08), transparent 38%),
    linear-gradient(180deg,#f5f5f9 0%, #fbfbfd 100%);
}
#dash::before{ content:""; position:absolute; inset:0; pointer-events:none; opacity:.55;
  background-image:linear-gradient(rgba(42,42,76,.035) 1px,transparent 1px),
                   linear-gradient(90deg,rgba(42,42,76,.035) 1px,transparent 1px);
  background-size:44px 44px;
  -webkit-mask-image:linear-gradient(180deg,#000 0%, #000 70%, transparent 100%);
  mask-image:linear-gradient(180deg,#000 0%, #000 70%, transparent 100%); }
#dash::after{ content:""; position:absolute; top:0; left:0; right:0; height:3px;
  background:linear-gradient(90deg, transparent, var(--gold), transparent); opacity:.7; }
#dash .container{ position:relative; z-index:1; }
#dash .kpi, #dash .dchart, #dash .dwatch, #dash .cmd-card, #dash .cmd-table-wrap{ box-shadow:0 10px 30px -22px rgba(20,20,42,.35); }

/* ===== News grid — clean equal-height alignment ===== */
.nx-grid{ grid-template-columns:repeat(3,1fr); gap:22px; align-items:stretch; }
.nx-card{ height:100%; }
.nx-card .nx-img{ aspect-ratio:16/9; }
.nx-card .nx-body{ padding:18px 20px 20px; gap:9px; }
.nx-card .nx-meta{ order:-1; }
.nx-card h3{ font-size:16.5px; line-height:1.32; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; min-height:2.64em; }
.nx-card p{ display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; overflow:hidden; flex:0 0 auto; min-height:3.9em; }
@media (max-width:980px){ .nx-grid{ grid-template-columns:repeat(2,1fr); } }
@media (max-width:600px){ .nx-grid{ grid-template-columns:1fr; } .nx-card p{ min-height:0; } }

/* ===== Markets hero — balanced positioning ===== */
.page-hero--markets{ display:flex; align-items:center; min-height:62vh; padding-top:150px; padding-bottom:80px; }
.page-hero--markets .container{ width:100%; }
.page-hero--markets .crumbs{ margin-bottom:14px; }
.page-hero--markets h1{ margin:0; max-width:16ch; }
.page-hero--markets p{ max-width:54ch; }
@media (max-width:640px){ .page-hero--markets{ min-height:0; padding-top:120px; padding-bottom:56px; } }

/* ===== "Denzel in brief" Trafigura-style flyout ===== */
.region[aria-expanded="true"]{ border-color:var(--gold); color:var(--gold-2); }
.region .caret{ transition:transform .25s ease; display:inline-block; }
.region[aria-expanded="true"] .caret{ transform:rotate(180deg); }

.brief-flyout{ position:fixed; left:0; right:0; top:0; width:100%; background:#fff; color:var(--navy);
  border-top:3px solid var(--gold); box-shadow:0 28px 60px -26px rgba(10,10,30,.5);
  transform:translateY(-101%); opacity:0; pointer-events:none; transition:transform .4s cubic-bezier(.4,0,.2,1), opacity .25s ease;
  z-index:90; padding-top:104px; padding-bottom:40px; }
.brief-flyout.open{ transform:translateY(0); opacity:1; pointer-events:auto; }
.site-header.solid ~ .brief-flyout, .brief-flyout.compact{ padding-top:84px; }
/* keep header dark + above the flyout while open */
.site-header:has(.region-wrap.open-marker), body.brief-open .site-header{ background:var(--navy); }
.brief-inner{ display:grid; grid-template-columns:1.5fr 1.6fr 1fr; gap:clamp(28px,4vw,64px); align-items:start; }
.bf-eyebrow{ font-family:"IBM Plex Mono",monospace; font-size:10px; letter-spacing:.16em; text-transform:uppercase; color:var(--gold); display:block; margin-bottom:10px; }
.bf-intro h4{ font-size:clamp(20px,2vw,26px); color:var(--navy); margin:0 0 12px; line-height:1.15; }
.bf-intro p{ font-size:14px; line-height:1.65; color:var(--grey); margin:0 0 18px; max-width:46ch; }
.bf-cta{ display:inline-flex; align-items:center; gap:8px; font-family:var(--hsans); font-weight:600; font-size:14.5px; color:var(--navy); border-bottom:2px solid var(--gold); padding-bottom:4px; }
.bf-cta span{ color:var(--gold); transition:transform .2s; }
.bf-cta:hover span{ transform:translateX(4px); }
.bf-figs{ display:grid; grid-template-columns:repeat(3,1fr); gap:22px 18px; }
.bf-fig span{ display:block; font-family:"Fraunces",Georgia,serif; font-weight:430; font-size:26px; color:var(--navy); line-height:1; }
.bf-fig small{ font-size:11px; color:var(--grey-2); letter-spacing:.02em; }
.bf-links{ display:flex; flex-direction:column; gap:11px; }
.bf-links a{ font-size:14px; color:var(--navy); display:inline-flex; align-items:center; gap:7px; transition:color .2s; }
.bf-links a::after{ content:"→"; color:var(--gold); font-size:12px; transition:transform .2s; }
.bf-links a:hover{ color:var(--gold); }
.bf-links a:hover::after{ transform:translateX(3px); }
.brief-backdrop{ position:fixed; inset:0; background:rgba(20,20,40,.4); opacity:0; pointer-events:none; transition:opacity .3s; z-index:80; }
.brief-backdrop.open{ opacity:1; pointer-events:auto; }
@media (max-width:900px){ .brief-inner{ grid-template-columns:1fr; gap:24px; } .bf-figs{ grid-template-columns:repeat(3,1fr); } }
@media (max-width:680px){ .region-wrap{ display:none; } .brief-flyout{ display:none; } }

/* ===== "Denzel in brief" language dropdown ===== */
.region-wrap{ position:relative; }
.brief-menu{ position:absolute; top:calc(100% + 8px); left:0; min-width:248px; background:#fff; border:1px solid var(--line); border-radius:8px; box-shadow:0 18px 44px -16px rgba(10,10,30,.4); padding:6px; opacity:0; transform:translateY(-6px); pointer-events:none; transition:opacity .18s ease, transform .18s ease; z-index:300; }
.region-wrap.open .brief-menu{ opacity:1; transform:none; pointer-events:auto; }
.bm-item{ display:block; padding:11px 14px; font-size:14px; color:var(--navy); border-radius:5px; transition:background .15s; }
.bm-item:hover{ background:var(--paper-2); }
.bm-item.active{ background:var(--paper-2); font-weight:600; }

/* ===== Denzel in brief (overview page) ===== */
.brief-hero{ background:var(--white); color:var(--navy); padding:140px var(--gutter) 20px; }
.brief-crumbs{ font-size:13px; letter-spacing:.04em; color:var(--grey-2); }
.brief-crumbs a{ color:var(--grey); } .brief-crumbs a:hover{ color:var(--gold); }
.brief-rule{ border-top:1px solid var(--line); margin:22px 0 40px; }
.brief-split{ display:grid; grid-template-columns:1.25fr 1fr; gap:clamp(30px,5vw,80px); align-items:start; }
.brief-eyebrow{ font-family:"Archivo",sans-serif; font-weight:700; font-size:12px; letter-spacing:.16em; text-transform:uppercase; color:var(--gold); display:block; margin-bottom:14px; }
.brief-hl{ font-size:clamp(30px,4.4vw,56px); line-height:1.08; letter-spacing:-0.02em; color:var(--navy); margin:0; font-weight:600; }
.brief-intro p{ color:var(--grey); font-size:16px; line-height:1.7; margin:0 0 18px; }
.brief-imgband{ height:clamp(240px,36vw,460px); background-size:cover; background-position:center; }

.circle-row{ display:grid; grid-template-columns:repeat(5,1fr); gap:26px; margin-top:42px; }
.circle-row.four{ grid-template-columns:repeat(4,1fr); max-width:1000px; margin-left:auto; margin-right:auto; }
.cr-item{ text-align:center; }
.cr-ring{ width:96px; height:96px; border-radius:50%; margin:0 auto; padding:2px; background:linear-gradient(140deg,var(--navy) 0%,var(--gold) 100%); }
.cr-ring > span{ display:flex; align-items:center; justify-content:center; width:100%; height:100%; background:#fff; border-radius:50%; }
.cr-ring svg{ width:40px; height:40px; stroke:var(--navy); fill:none; stroke-width:1.5; stroke-linecap:round; stroke-linejoin:round; }
.cr-item h4{ color:var(--gold); font-size:16px; margin:16px 0 8px; }
.cr-item p{ color:var(--grey); font-size:13.5px; line-height:1.55; max-width:24ch; margin:0 auto; }

.flow-row{ display:flex; align-items:center; justify-content:center; gap:clamp(16px,3vw,46px); margin-top:46px; flex-wrap:wrap; }
.flow-node{ text-align:center; }
.flow-circle{ width:clamp(130px,13vw,168px); height:clamp(130px,13vw,168px); border-radius:50%; padding:2px; background:linear-gradient(140deg,var(--navy),var(--gold)); }
.flow-circle > span{ display:flex; align-items:center; justify-content:center; width:100%; height:100%; background:#fff; border-radius:50%; color:var(--navy); font-family:var(--hsans); font-weight:600; font-size:clamp(14px,1.2vw,16px); line-height:1.25; padding:0 18px; text-align:center; }
.flow-arrow{ color:var(--gold); font-size:26px; }

.assets-grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:18px; margin-top:36px; }
.asset-card{ text-decoration:none; }
.asset-card img{ width:100%; aspect-ratio:4/3; object-fit:cover; border-radius:10px; display:block; }
.asset-card h4{ text-align:center; margin:16px 0 0; color:var(--navy); font-size:15.5px; }
.asset-card:hover img{ filter:brightness(1.05); }

@media (max-width:900px){
  .brief-split{ grid-template-columns:1fr; gap:24px; }
  .circle-row, .circle-row.four{ grid-template-columns:repeat(2,1fr); }
  .assets-grid{ grid-template-columns:repeat(2,1fr); }
  .flow-arrow{ transform:rotate(90deg); }
}
@media (max-width:560px){ .circle-row, .circle-row.four{ grid-template-columns:1fr; } .assets-grid{ grid-template-columns:1fr; } }

/* ===== Offices world map (Trafigura-style) ===== */
#locations .office-map{ position:relative; max-width:1040px; margin:34px auto 0; }
.omap-canvas{ position:relative; width:100%; aspect-ratio:2 / 1; }
.omap-bg{ width:100%; height:100%; object-fit:contain; display:block; filter:grayscale(1) opacity(.5); }
.omap-pin{ position:absolute; width:24px; height:24px; transform:translate(-50%,-50%); border-radius:50%; padding:0; border:none; cursor:pointer;
  background:linear-gradient(140deg,var(--navy) 0%, var(--gold) 100%);
  -webkit-mask:radial-gradient(farthest-side, transparent 55%, #000 57%);
  mask:radial-gradient(farthest-side, transparent 55%, #000 57%);
  transition:transform .2s ease; }
.omap-pin:hover, .omap-pin.active{ transform:translate(-50%,-50%) scale(1.4); }
.btn--grad{ display:inline-flex; align-items:center; justify-content:center; background:linear-gradient(120deg,var(--navy) 0%, var(--gold) 120%); border:1px solid transparent; color:#fff; border-radius:30px; padding:15px 34px; font-family:var(--hsans); font-weight:600; font-size:14px; }
.btn--grad:hover{ filter:brightness(1.08); }
#locations .hub-card{ text-align:left; }
@media (max-width:640px){ .omap-pin{ width:18px; height:18px; } #locations .hub-card{ position:static; margin:16px auto 0; } }

/* ===== Header legibility over bright hero backgrounds ===== */
.site-header::before{ content:""; position:absolute; inset:0; z-index:-1; pointer-events:none;
  background:linear-gradient(180deg, rgba(14,14,32,.60) 0%, rgba(14,14,32,.22) 55%, rgba(14,14,32,0) 100%);
  transition:opacity .3s ease; }
.site-header.solid::before{ opacity:0; }
.site-header .brand img{ filter:drop-shadow(0 1px 4px rgba(0,0,0,.45)); }
.site-header.solid .brand img{ filter:none; }
.site-header .brand-text{ text-shadow:0 1px 4px rgba(0,0,0,.45); }
.site-header .region{ background:rgba(255,255,255,.12); border-color:rgba(255,255,255,.6); text-shadow:0 1px 2px rgba(0,0,0,.3); }
.site-header.solid .region{ background:rgba(255,255,255,.04); border-color:rgba(255,255,255,.4); text-shadow:none; }
.site-header .search-btn{ background:rgba(255,255,255,.12); border-color:rgba(255,255,255,.6); }
.site-header.solid .search-btn{ background:none; border-color:rgba(255,255,255,.4); }

/* Brief page — supply chain video band */
.brief-video{ width:100%; overflow:hidden; }
.brief-video video{ width:100%; height:clamp(300px,42vw,560px); object-fit:cover; display:block; }

/* asset-card images: navy backdrop + safe cover (never a red gap) */
.asset-card img{ background:var(--navy); }

/* Chairman CEO message — justified text + signature */
.ch2-body p, .ch2-drop{ text-align:justify; text-justify:inter-word; hyphens:auto; }
.ch2-lead{ text-align:left !important; }
.ch2-sign{ font-family:"Fraunces",Georgia,serif; font-style:italic; color:var(--navy); font-size:18px; margin-top:22px; line-height:1.3; text-align:left !important; }
.ch2-sign small{ display:block; font-family:"Inter",sans-serif; font-style:normal; font-size:12.5px; letter-spacing:.02em; color:var(--grey); margin-top:4px; }

/* CEO message — YouTube-style video player */
.ch2-video{ position:relative; background:#000; }
.ch2-video video{ width:100%; height:100%; min-height:560px; object-fit:cover; display:block; background:#000; }
.ch2-video .ytplay{ position:absolute; inset:0; margin:auto; width:68px; height:48px; padding:0; border:none; background:none; cursor:pointer; }
.ch2-video .ytplay svg{ width:68px; height:48px; filter:drop-shadow(0 2px 8px rgba(0,0,0,.5)); transition:transform .2s ease; }
.ch2-video .ytplay .ytp-bg{ fill:#212121; opacity:.85; transition:fill .2s ease, opacity .2s ease; }
.ch2-video:hover .ytplay .ytp-bg{ fill:#f00; opacity:1; }
.ch2-video .ytplay:hover svg{ transform:scale(1.08); }
.ch2-video figcaption{ pointer-events:none; }
@media (max-width:820px){ .ch2-video video{ min-height:420px; } }

/* Neutral media-player play button (replaces YouTube red) */
.ch2-video .vplay{ position:absolute; inset:0; margin:auto; width:72px; height:72px; border-radius:50%; padding:0; border:none; cursor:pointer;
  background:rgba(255,255,255,.92); display:flex; align-items:center; justify-content:center;
  box-shadow:0 8px 28px -8px rgba(0,0,0,.5); transition:transform .2s ease, background .2s ease; }
.ch2-video .vplay svg{ width:30px; height:30px; fill:var(--navy); margin-left:3px; }
.ch2-video .vplay:hover{ transform:scale(1.08); background:#fff; }
.ch2-video:hover .vplay svg{ fill:var(--gold); }

/* Partnership solution sub-item chips */
.tag-row{ display:flex; flex-wrap:wrap; gap:8px; }

/* Careers — open positions empty state */
.openings-empty{ background:var(--paper); border:1px dashed var(--line); border-radius:16px; padding:clamp(32px,5vw,56px); text-align:center; }
.openings-empty h3{ font-size:clamp(20px,2.4vw,26px); color:var(--navy); margin:0 0 12px; }
.openings-empty p{ color:var(--grey); max-width:62ch; margin:0 auto 22px; line-height:1.65; }

/* ===== Company "Who we are" — premium luxury band ===== */
.who-premium{ position:relative; overflow:hidden; padding:clamp(64px,9vh,120px) var(--gutter); color:#fff;
  background:radial-gradient(circle at 82% 12%, rgba(200,162,78,.20), transparent 46%),
            radial-gradient(circle at 6% 92%, rgba(200,162,78,.08), transparent 40%),
            linear-gradient(135deg,#1d1d34 0%, #2A2A4C 52%, #353461 100%); }
.who-premium::before{ content:""; position:absolute; inset:0; pointer-events:none; opacity:.5;
  background-image:linear-gradient(rgba(255,255,255,.045) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.045) 1px,transparent 1px);
  background-size:48px 48px;
  -webkit-mask-image:radial-gradient(circle at 65% 45%, #000, transparent 78%);
  mask-image:radial-gradient(circle at 65% 45%, #000, transparent 78%); }
.who-premium::after{ content:""; position:absolute; top:0; left:0; right:0; height:1px; background:linear-gradient(90deg,transparent,rgba(200,162,78,.7),transparent); }
.who-grid{ position:relative; z-index:1; display:grid; grid-template-columns:.85fr 1.15fr; gap:clamp(30px,5vw,72px); align-items:center; }
.who-media{ position:relative; margin:0; border-radius:18px; overflow:hidden; border:1px solid rgba(200,162,78,.32); box-shadow:0 44px 90px -34px rgba(0,0,0,.7); }
.who-media img{ width:100%; height:100%; object-fit:cover; aspect-ratio:4/5; display:block; background:#11111f; }
.who-media figcaption{ position:absolute; left:18px; right:18px; bottom:16px; display:flex; justify-content:space-between; gap:12px; font-family:"IBM Plex Mono",monospace; font-size:10px; letter-spacing:.16em; text-transform:uppercase; color:rgba(255,255,255,.72); padding-top:10px; border-top:1px solid rgba(255,255,255,.25); }
.who-copy .eyebrow.on-dark{ color:var(--gold-2); }
.who-copy h2{ font-size:clamp(28px,3.6vw,48px); line-height:1.1; letter-spacing:-0.01em; margin:12px 0 20px; color:#fff; }
.who-copy .lead{ color:rgba(255,255,255,.94); font-size:clamp(17px,1.5vw,20px); line-height:1.6; margin:0 0 18px; }
.who-copy p{ color:rgba(255,255,255,.74); line-height:1.72; margin:0 0 16px; }
@media (max-width:860px){ .who-grid{ grid-template-columns:1fr; } .who-media img{ aspect-ratio:16/10; } }

/* ===== Company — interactive evolution timeline ===== */
.timeline{ margin-top:34px; }
.tl-track{ position:relative; display:flex; justify-content:space-between; max-width:760px; margin:0 auto 38px; padding:0 6px; }
.tl-line{ position:absolute; left:6px; right:6px; top:11px; height:2px; background:var(--line); }
.tl-progress{ position:absolute; left:6px; top:11px; height:2px; background:var(--gold); width:0; transition:width .4s ease; }
.tl-dot{ position:relative; z-index:1; background:none; border:none; cursor:pointer; display:flex; flex-direction:column; align-items:center; gap:12px; padding:0; }
.tl-dot::before{ content:""; width:16px; height:16px; border-radius:50%; background:#fff; border:2px solid var(--grey-2); transition:all .25s ease; }
.tl-dot:hover::before{ border-color:var(--gold); }
.tl-dot.active::before{ border-color:var(--gold); background:var(--gold); box-shadow:0 0 0 5px rgba(200,162,78,.18); }
.tl-yr{ font-family:"IBM Plex Mono",monospace; font-size:13px; color:var(--grey); transition:color .25s ease; }
.tl-dot.active .tl-yr, .tl-dot:hover .tl-yr{ color:var(--navy); font-weight:600; }
.tl-panel{ display:grid; grid-template-columns:1fr 1.1fr; gap:clamp(22px,3vw,46px); align-items:center; background:#fff; border:1px solid var(--line); border-radius:18px; overflow:hidden; box-shadow:0 24px 50px -34px rgba(20,20,42,.4); }
.tl-media{ margin:0; height:100%; overflow:hidden; background:var(--navy); }
.tl-media img{ width:100%; height:100%; min-height:300px; object-fit:cover; display:block; transition:opacity .35s ease, transform 6s ease; }
.tl-panel:hover .tl-media img{ transform:scale(1.05); }
.tl-info{ padding:clamp(24px,3vw,44px) clamp(24px,3vw,44px) clamp(24px,3vw,44px) 0; }
.tl-year{ font-family:"Fraunces",Georgia,serif; font-weight:430; font-size:clamp(34px,4vw,52px); color:var(--gold); line-height:1; }
.tl-info h3{ font-size:clamp(20px,2.2vw,28px); color:var(--navy); margin:8px 0 12px; }
.tl-info p{ color:var(--grey); line-height:1.7; margin:0; font-size:16px; }
@media (max-width:760px){ .tl-panel{ grid-template-columns:1fr; } .tl-info{ padding:24px; } .tl-media img{ min-height:220px; } }

/* interactive hover for value cards */
.value-card{ transition:transform .25s ease, box-shadow .25s ease, border-color .25s ease; }
.value-card:hover{ transform:translateY(-5px); border-color:var(--gold); box-shadow:0 22px 44px -28px rgba(20,20,42,.4); }
.value-card:hover .vc-num{ color:var(--gold-2); }

/* Centered page hero variant */
.page-hero--center .container{ text-align:center; }
.page-hero--center h1{ margin-left:auto; margin-right:auto; }
.page-hero--center p{ margin-left:auto; margin-right:auto; }

/* ===== Company hero — stylish & engaging ===== */
.company-hero{ position:relative; overflow:hidden; padding-bottom:clamp(56px,7vh,84px);
  background:radial-gradient(circle at 50% 125%, rgba(200,162,78,.22), transparent 55%),
            radial-gradient(circle at 85% 0%, rgba(200,162,78,.12), transparent 42%),
            linear-gradient(160deg,#1c1c33 0%, #2A2A4C 55%, #34335f 100%); }
.company-hero::before{ opacity:0; }
.ch-decor{ position:absolute; inset:0; pointer-events:none; display:flex; justify-content:center; }
.ch-decor svg{ width:100%; height:100%; }
.company-hero .container{ position:relative; z-index:1; }
.ch-kicker{ display:inline-flex; align-items:center; gap:13px; font-family:"IBM Plex Mono",monospace; font-size:11px; letter-spacing:.22em; text-transform:uppercase; color:var(--gold-2); margin-bottom:18px; }
.ch-kicker::before, .ch-kicker::after{ content:""; width:36px; height:1px; background:linear-gradient(90deg,transparent,var(--gold)); }
.ch-kicker::after{ background:linear-gradient(90deg,var(--gold),transparent); }
.company-hero h1{ letter-spacing:-0.01em; }
.company-hero h1 em{ font-style:normal; color:var(--gold-2); }
.ch-stats{ display:flex; justify-content:center; flex-wrap:wrap; gap:clamp(26px,5vw,68px); margin-top:clamp(34px,4vh,48px); }
.ch-stats > div{ display:flex; flex-direction:column; align-items:center; }
.ch-num{ font-family:"Fraunces",Georgia,serif; font-weight:430; font-size:clamp(30px,4vw,48px); line-height:1; color:var(--gold-2); }
.ch-num .n{ color:#fff; }
.ch-stats small{ display:block; margin-top:9px; font-size:11.5px; letter-spacing:.06em; text-transform:uppercase; color:rgba(255,255,255,.6); }

/* ===== Company hero — simple & elegant (light) override ===== */
.company-hero{ background:var(--paper) !important; color:var(--navy); padding-top:150px; padding-bottom:clamp(50px,6vh,72px); }
.company-hero::before, .company-hero::after{ display:none !important; }
.company-hero .crumbs{ color:var(--grey-2); }
.company-hero .crumbs a{ color:var(--grey); } .company-hero .crumbs a:hover{ color:var(--gold); }
.company-hero .ch-kicker{ color:var(--gold); }
.company-hero .ch-kicker::before, .company-hero .ch-kicker::after{ background:var(--line); }
.company-hero h1{ color:var(--navy); }
.company-hero h1 em{ font-family:"Fraunces",Georgia,serif; font-style:italic; font-weight:400; color:var(--gold); }
.company-hero p{ color:var(--grey); }
.company-hero .ch-rule{ display:block; width:64px; height:3px; border-radius:2px; background:var(--gold); margin:clamp(26px,3.5vh,38px) auto 0; }
.company-hero .ch-num{ color:var(--navy); }
.company-hero .ch-num .n{ color:var(--navy); }
.company-hero .ch-stats small{ color:var(--grey-2); }

/* ===== Distinct hero styles per tab ===== */

/* Services — full-bleed image hero */
.ph--image{ background:#11111f; }
.ph--image::before{ content:""; position:absolute; inset:0; opacity:1;
  background:linear-gradient(90deg, rgba(18,18,36,.88) 0%, rgba(18,18,36,.55) 55%, rgba(18,18,36,.35) 100%),
  url('proj-oil.jpg') center/cover no-repeat; }
.ph--image .container{ position:relative; }

/* Projects — editorial gold side-bar + watermark */
.ph--editorial{ background:linear-gradient(135deg,#23233f,#2A2A4C 60%,#30305a); }
.ph--editorial::before{ content:""; position:absolute; left:0; top:18%; bottom:18%; width:5px; background:linear-gradient(180deg,var(--gold),rgba(200,162,78,0)); opacity:1; }
.ph--editorial::after{ content:"01 — 08"; position:absolute; right:5%; bottom:8%; font-family:"Fraunces",Georgia,serif; font-size:clamp(60px,12vw,160px); color:rgba(200,162,78,.07); line-height:1; pointer-events:none; }
.ph--editorial .container{ position:relative; }

/* Sectors — diagonal gold accent */
.ph--diagonal{ background:linear-gradient(120deg,#262644 0%, #2A2A4C 55%, #353461 100%); }
.ph--diagonal::before{ content:""; position:absolute; inset:0; opacity:1;
  background-image:linear-gradient(rgba(255,255,255,.04) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.04) 1px,transparent 1px);
  background-size:44px 44px; -webkit-mask-image:linear-gradient(110deg,#000 30%,transparent 75%); mask-image:linear-gradient(110deg,#000 30%,transparent 75%); }
.ph--diagonal::after{ content:""; position:absolute; right:-12%; top:-20%; width:48%; height:160%; transform:skewX(-14deg);
  background:linear-gradient(120deg, transparent, rgba(200,162,78,.16)); pointer-events:none; }
.ph--diagonal .container{ position:relative; }

/* Careers — warm light hero with gold accent bar */
.ph--warm{ background:linear-gradient(180deg,#FBF6EC 0%, #FAFAFB 100%) !important; color:var(--navy); }
.ph--warm::before{ content:""; position:absolute; left:0; top:24%; bottom:24%; width:5px; background:var(--gold); opacity:1; }
.ph--warm .container{ position:relative; padding-left:clamp(0px,2vw,24px); }
.ph--warm .crumbs{ color:var(--grey-2); } .ph--warm .crumbs a{ color:var(--grey); } .ph--warm .crumbs a:hover{ color:var(--gold); }
.ph--warm h1{ color:var(--navy); } .ph--warm p{ color:var(--grey); }

/* Contact — minimal light + contact chips */
.ph--contact{ background:var(--paper) !important; color:var(--navy); text-align:center; }
.ph--contact::before{ display:none; }
.ph--contact .crumbs{ color:var(--grey-2); } .ph--contact .crumbs a{ color:var(--grey); }
.ph--contact h1{ color:var(--navy); margin-left:auto; margin-right:auto; }
.ph--contact > .container > p{ color:var(--grey); margin-left:auto; margin-right:auto; }
.ph-chips{ display:flex; flex-wrap:wrap; justify-content:center; gap:12px; margin-top:28px; }
.ph-chip{ display:inline-flex; align-items:center; gap:8px; padding:10px 18px; border:1px solid var(--line); border-radius:30px; font-size:14px; color:var(--navy); background:#fff; transition:.2s; }
.ph-chip:hover{ border-color:var(--gold); color:var(--gold); }
.ph-chip svg{ color:var(--gold); }

/* Partnership — gold ring accent, centered */
.ph--ring{ background:radial-gradient(circle at 50% 40%, #34335f, #2A2A4C 60%, #20203a); text-align:center; overflow:hidden; }
.ph--ring::before{ content:""; position:absolute; left:50%; top:50%; width:520px; height:520px; transform:translate(-50%,-50%); border-radius:50%;
  border:1px solid rgba(200,162,78,.28); box-shadow:0 0 0 40px rgba(200,162,78,.05), 0 0 0 90px rgba(200,162,78,.03); opacity:1; }
.ph--ring .container{ position:relative; }
.ph--ring h1{ margin-left:auto; margin-right:auto; }
.ph--ring > .container > p{ margin-left:auto; margin-right:auto; }

/* Services hero — robust full-width image fix */
.ph--image{ background:#11111f url('proj-oil.jpg') center/cover no-repeat; }
.ph--image::before{ background:linear-gradient(90deg, rgba(18,18,36,.90) 0%, rgba(18,18,36,.6) 55%, rgba(18,18,36,.42) 100%) !important; opacity:1 !important; }
.ph--image .container{ position:relative; z-index:1; }

/* ===== Center-align all tab hero statements ===== */
.page-hero .container{ text-align:center; }
.page-hero .container h1{ margin-left:auto; margin-right:auto; }
.page-hero .container p{ margin-left:auto; margin-right:auto; }
.ph--warm .container{ padding-left:0; }
/* balanced overlay so centered text reads anywhere over the image */
.ph--image::before{ background:linear-gradient(0deg, rgba(18,18,36,.82) 0%, rgba(18,18,36,.5) 55%, rgba(18,18,36,.62) 100%) !important; }

/* ===== Services — full-width interactive division cards ===== */
.svc-section .container{ padding-left:clamp(20px,5vw,80px); padding-right:clamp(20px,5vw,80px); }
.svc-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:22px; }
.svc-card{ position:relative; background:#fff; border:1px solid var(--line); border-radius:16px; overflow:hidden; display:flex; flex-direction:column; cursor:pointer; outline:none;
  transition:transform .28s ease, box-shadow .28s ease, border-color .28s ease; }
.svc-card:hover, .svc-card:focus-visible{ transform:translateY(-6px); box-shadow:0 30px 56px -30px rgba(20,20,42,.5); border-color:var(--gold); }
.svc-img{ position:relative; aspect-ratio:16/10; overflow:hidden; background:var(--navy); }
.svc-img img{ width:100%; height:100%; object-fit:cover; display:block; transition:transform .6s ease; }
.svc-card:hover .svc-img img, .svc-card:focus-visible .svc-img img{ transform:scale(1.08); }
.svc-ov{ position:absolute; inset:0; padding:22px clamp(18px,2vw,26px); display:flex; flex-direction:column; justify-content:center; gap:9px;
  background:linear-gradient(180deg, rgba(42,42,76,.55) 0%, rgba(18,18,38,.93) 100%); color:#fff; opacity:0; transition:opacity .3s ease; }
.svc-card:hover .svc-ov, .svc-card:focus-visible .svc-ov{ opacity:1; }
.svc-ov-h{ font-family:"IBM Plex Mono",monospace; font-size:10px; letter-spacing:.16em; text-transform:uppercase; color:var(--gold-2); }
.svc-ov ul{ list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:8px; }
.svc-ov li{ position:relative; padding-left:18px; font-size:13.5px; line-height:1.4; color:rgba(255,255,255,.92); }
.svc-ov li::before{ content:""; position:absolute; left:0; top:7px; width:7px; height:7px; border-radius:50%; background:var(--gold); }
.svc-body{ padding:20px 22px 22px; display:flex; flex-direction:column; gap:7px; flex:1; }
.svc-tag{ font-family:"IBM Plex Mono",monospace; font-size:11px; letter-spacing:.06em; color:var(--gold); }
.svc-body h3{ font-size:18.5px; line-height:1.22; color:var(--navy); margin:0; }
.svc-body p{ color:var(--grey); font-size:14.5px; line-height:1.55; margin:0; flex:1; }
.svc-more{ font-family:"IBM Plex Mono",monospace; font-size:11.5px; letter-spacing:.05em; color:var(--gold); display:inline-flex; align-items:center; gap:6px; margin-top:4px; }
.svc-more i{ display:inline-flex; width:16px; height:16px; align-items:center; justify-content:center; font-style:normal; border:1px solid var(--gold); border-radius:50%; font-size:12px; transition:transform .25s ease; }
.svc-card:hover .svc-more i{ transform:rotate(45deg); }
@media (max-width:980px){ .svc-grid{ grid-template-columns:repeat(2,1fr); } }
@media (max-width:600px){ .svc-grid{ grid-template-columns:1fr; } }

/* Services — section intro line */
.svc-intro{ text-align:center; max-width:760px; margin:0 auto clamp(30px,4vw,46px); }
.svc-intro .eyebrow{ display:inline-block; margin-bottom:14px; }
.svc-intro p{ font-family:"Fraunces",Georgia,serif; font-weight:340; font-size:clamp(21px,2.4vw,30px); line-height:1.35; color:var(--navy); margin:0; }
.svc-intro p strong{ font-weight:500; color:var(--gold); font-style:italic; }

/* Evolution timeline — full-width */
#evolution .container{ padding-left:clamp(20px,5vw,80px); padding-right:clamp(20px,5vw,80px); }
#evolution .tl-track{ max-width:none; padding:0 clamp(10px,4vw,80px); }
#evolution .tl-panel{ grid-template-columns:1.05fr 1fr; }
#evolution .tl-media img{ min-height:380px; }
@media (max-width:760px){ #evolution .tl-panel{ grid-template-columns:1fr; } #evolution .tl-media img{ min-height:240px; } }

/* Company page — full-width content across all sections */
.page-company .section > .container,
.page-company .who-premium > .container,
.page-company .cta-strip > .container{ max-width:none; padding-left:clamp(20px,5vw,80px); padding-right:clamp(20px,5vw,80px); }
.page-company .value-grid, .page-company .cards, .page-company .solutions, .page-company .stats{ max-width:none; }

/* ===== Interactive investment-process stepper ===== */
.proc{ position:relative; margin-top:30px; padding-left:8px; }
.proc-rail{ position:absolute; left:33px; top:26px; bottom:26px; width:2px; background:var(--line); }
.proc-fill{ position:absolute; left:33px; top:26px; width:2px; background:var(--gold); height:0; transition:height .4s ease; }
.proc-step{ position:relative; z-index:1; width:100%; display:grid; grid-template-columns:52px 1fr auto; align-items:start; gap:clamp(16px,2.5vw,40px); text-align:left; background:none; border:none; border-bottom:1px solid var(--line); padding:22px 8px 22px 0; cursor:pointer; transition:background .2s ease; }
.proc-step:hover{ background:rgba(200,162,78,.05); }
.proc-num{ font-family:"Fraunces",Georgia,serif; font-weight:430; font-size:24px; color:var(--grey-2); width:52px; height:52px; display:flex; align-items:center; justify-content:center; border-radius:50%; border:2px solid var(--line); background:#fff; transition:all .25s ease; }
.proc-step:hover .proc-num{ border-color:var(--gold); color:var(--gold); }
.proc-step.active .proc-num{ background:var(--gold); border-color:var(--gold); color:#fff; box-shadow:0 0 0 5px rgba(200,162,78,.16); }
.proc-main{ display:block; padding-top:12px; }
.proc-t{ display:block; font-family:var(--hsans); font-weight:600; font-size:clamp(17px,1.6vw,20px); color:var(--navy); }
.proc-d{ display:grid; grid-template-rows:0fr; transition:grid-template-rows .35s ease; }
.proc-d > span{ overflow:hidden; color:var(--grey); font-size:15.5px; line-height:1.6; }
.proc-step.active .proc-d{ grid-template-rows:1fr; }
.proc-step.active .proc-d > span{ padding-top:8px; }
.proc-ico{ align-self:center; width:24px; height:24px; position:relative; flex:0 0 auto; }
.proc-ico::before, .proc-ico::after{ content:""; position:absolute; background:var(--gold); border-radius:2px; transition:transform .3s ease, opacity .3s ease; }
.proc-ico::before{ top:11px; left:5px; width:14px; height:2px; }
.proc-ico::after{ top:5px; left:11px; width:2px; height:14px; }
.proc-step.active .proc-ico::after{ transform:rotate(90deg); opacity:0; }
@media (max-width:600px){ .proc-step{ grid-template-columns:44px 1fr auto; } .proc-num{ width:44px; height:44px; font-size:20px; } .proc-rail,.proc-fill{ left:29px; } }

/* ===== Premium full-screen menu background ===== */
.nav{
  background:
    radial-gradient(circle at 50% 18%, rgba(200,162,78,.18), transparent 45%),
    radial-gradient(circle at 85% 95%, rgba(200,162,78,.10), transparent 40%),
    radial-gradient(circle at 8% 88%, rgba(70,68,111,.5), transparent 45%),
    linear-gradient(160deg, #15152a 0%, #232342 50%, #2c2b50 100%) !important;
  overflow:hidden;
}
.nav::before{ content:""; position:absolute; inset:0; pointer-events:none; opacity:.4;
  background-image:linear-gradient(rgba(255,255,255,.04) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.04) 1px,transparent 1px);
  background-size:54px 54px;
  -webkit-mask-image:radial-gradient(circle at 50% 40%, #000, transparent 72%);
  mask-image:radial-gradient(circle at 50% 40%, #000, transparent 72%); }
.nav::after{ content:""; position:absolute; left:50%; top:46%; width:760px; height:760px; transform:translate(-50%,-50%); border-radius:50%; pointer-events:none;
  border:1px solid rgba(200,162,78,.12); box-shadow:0 0 0 70px rgba(200,162,78,.04), 0 0 0 150px rgba(200,162,78,.02); }
.nav a{ position:relative; z-index:1; }
.nav a:not(.header-cta)::after{ content:""; position:absolute; left:50%; bottom:-2px; width:0; height:2px; background:var(--gold); transform:translateX(-50%); transition:width .25s ease; }
.nav a:not(.header-cta):hover::after, .nav a.active:not(.header-cta)::after{ width:42%; }
/* refined Partner With Us button in the menu */
.nav a.header-cta{ position:relative; z-index:1; margin-top:30px; padding:14px 34px; font-size:14px; letter-spacing:.04em; border-radius:30px; background:linear-gradient(120deg,var(--gold),var(--gold-2)); color:var(--navy); box-shadow:0 14px 30px -12px rgba(200,162,78,.5); transition:transform .2s ease, box-shadow .2s ease, color .2s ease; }
.nav a.header-cta:hover{ transform:translateY(-2px); color:var(--navy); box-shadow:0 18px 36px -12px rgba(200,162,78,.6); }

/* Locations map — full-width */
#locations .container{ max-width:none; padding-left:clamp(20px,4vw,70px); padding-right:clamp(20px,4vw,70px); }
#locations .office-map{ max-width:none; }

/* ===== What we do — full-width interactive flow ===== */
.wwd2 .container{ padding-left:clamp(20px,5vw,80px); padding-right:clamp(20px,5vw,80px); }
.wwd2-head{ display:grid; grid-template-columns:1.05fr 1fr; gap:clamp(28px,4vw,64px); align-items:end; margin-bottom:clamp(36px,4vw,54px); }
.wwd2-head h2{ font-size:clamp(28px,3.6vw,46px); line-height:1.1; color:var(--navy); margin:10px 0 0; }
.wwd2-intro p{ color:var(--grey); line-height:1.7; margin:0 0 14px; }
.wwd2-intro p strong{ color:var(--navy); }
.flow4{ position:relative; display:grid; grid-template-columns:repeat(4,1fr); gap:20px; }
.flow4-line{ position:absolute; top:50px; left:12%; right:12%; height:2px; background:var(--line); }
.flow4-fill{ position:absolute; top:50px; left:12%; height:2px; background:var(--gold); width:0; transition:width .45s ease; }
.flow4-step{ position:relative; z-index:1; background:#fff; border:1px solid var(--line); border-radius:16px; padding:24px 22px 24px; text-align:left; cursor:pointer; display:flex; flex-direction:column; gap:5px; transition:transform .25s ease, box-shadow .25s ease, border-color .25s ease; }
.flow4-step:hover, .flow4-step:focus-visible{ transform:translateY(-6px); border-color:var(--gold); box-shadow:0 28px 50px -30px rgba(20,20,42,.45); outline:none; }
.flow4-ico{ width:56px; height:56px; border-radius:50%; border:2px solid var(--line); background:#fff; display:flex; align-items:center; justify-content:center; margin-bottom:10px; transition:all .25s ease; }
.flow4-ico svg{ width:26px; height:26px; stroke:var(--navy); fill:none; stroke-width:1.6; stroke-linecap:round; stroke-linejoin:round; }
.flow4-step.active .flow4-ico{ background:var(--gold); border-color:var(--gold); box-shadow:0 0 0 5px rgba(200,162,78,.16); }
.flow4-step.active .flow4-ico svg{ stroke:#fff; }
.flow4-n{ font-family:"IBM Plex Mono",monospace; font-size:11px; letter-spacing:.06em; color:var(--gold); }
.flow4-t{ font-family:var(--hsans); font-weight:600; font-size:19px; color:var(--navy); }
.flow4-s{ font-size:13px; color:var(--grey-2); }
.flow4-d{ display:grid; grid-template-rows:0fr; transition:grid-template-rows .35s ease; }
.flow4-d > span{ overflow:hidden; color:var(--grey); font-size:14px; line-height:1.6; }
.flow4-step.active .flow4-d{ grid-template-rows:1fr; }
.flow4-step.active .flow4-d > span{ padding-top:8px; }
@media (max-width:880px){ .wwd2-head{ grid-template-columns:1fr; } .flow4{ grid-template-columns:repeat(2,1fr); } .flow4-line,.flow4-fill{ display:none; } }
@media (max-width:520px){ .flow4{ grid-template-columns:1fr; } }

/* What we do — colourful stage icons */
.flow4-ico{ width:64px; height:64px; border:none !important; color:#fff; transition:transform .3s cubic-bezier(.34,1.4,.5,1), box-shadow .3s ease; }
.flow4-ico svg{ stroke:#fff !important; width:28px; height:28px; }
.flow4-step[data-i="0"] .flow4-ico{ background:linear-gradient(135deg,#16a34a,#34d399); box-shadow:0 12px 24px -10px rgba(22,163,74,.55); }
.flow4-step[data-i="1"] .flow4-ico{ background:linear-gradient(135deg,#2563eb,#60a5fa); box-shadow:0 12px 24px -10px rgba(37,99,235,.55); }
.flow4-step[data-i="2"] .flow4-ico{ background:linear-gradient(135deg,#ea7317,#fbbf4d); box-shadow:0 12px 24px -10px rgba(234,115,23,.55); }
.flow4-step[data-i="3"] .flow4-ico{ background:linear-gradient(135deg,#7c3aed,#a78bfa); box-shadow:0 12px 24px -10px rgba(124,58,237,.55); }
.flow4-step:hover .flow4-ico, .flow4-step:focus-visible .flow4-ico{ transform:translateY(-3px) scale(1.08) rotate(-4deg); }
.flow4-step.active .flow4-ico{ transform:scale(1.06); }
/* gold border accent on active card */
.flow4-step.active{ border-color:var(--gold); box-shadow:0 26px 48px -30px rgba(20,20,42,.4); }

/* What we do — no icons: colourful number badge + top accent bar instead */
.flow4-step{ padding-top:26px; }
.flow4-step::before{ content:""; position:absolute; left:0; top:0; height:4px; width:100%; border-radius:16px 16px 0 0; opacity:.9; }
.flow4-step[data-i="0"]::before{ background:linear-gradient(90deg,#16a34a,#34d399); }
.flow4-step[data-i="1"]::before{ background:linear-gradient(90deg,#2563eb,#60a5fa); }
.flow4-step[data-i="2"]::before{ background:linear-gradient(90deg,#ea7317,#fbbf4d); }
.flow4-step[data-i="3"]::before{ background:linear-gradient(90deg,#7c3aed,#a78bfa); }
.flow4-n{ display:inline-flex; align-items:center; justify-content:center; width:40px; height:40px; border-radius:50%; color:#fff; font-size:14px; font-weight:600; margin-bottom:10px; }
.flow4-step[data-i="0"] .flow4-n{ background:linear-gradient(135deg,#16a34a,#34d399); }
.flow4-step[data-i="1"] .flow4-n{ background:linear-gradient(135deg,#2563eb,#60a5fa); }
.flow4-step[data-i="2"] .flow4-n{ background:linear-gradient(135deg,#ea7317,#fbbf4d); }
.flow4-step[data-i="3"] .flow4-n{ background:linear-gradient(135deg,#7c3aed,#a78bfa); }
.flow4-line, .flow4-fill{ display:none; }

/* Chairman section — Founder & CEO kicker */
.ch2-kicker{ display:inline-flex; align-items:center; gap:10px; font-family:"IBM Plex Mono",monospace; font-size:11px; letter-spacing:.16em; text-transform:uppercase; color:var(--gold); margin-bottom:14px; }
.ch2-kicker::before{ content:""; width:30px; height:1px; background:var(--gold); }

/* ===== ESG page ===== */
.ph--esg{ background:radial-gradient(circle at 50% 122%, rgba(52,211,153,.20), transparent 55%), radial-gradient(circle at 84% 8%, rgba(200,162,78,.12), transparent 42%), linear-gradient(160deg,#16271f 0%, #1e3a30 52%, #24403a 100%); }
.ph--esg::before{ opacity:0; }
.esg-kicker{ display:inline-flex; align-items:center; gap:10px; font-family:"IBM Plex Mono",monospace; font-size:11px; letter-spacing:.18em; text-transform:uppercase; color:#7fe7c4; margin-bottom:16px; }
.ph--esg h1 em{ font-style:normal; color:#7fe7c4; }
.esg-list{ list-style:none; padding:0; margin:10px 0 0; display:flex; flex-direction:column; gap:11px; }
.esg-list li{ position:relative; padding-left:32px; color:var(--grey); line-height:1.55; font-size:15.5px; }
.esg-list li::before{ content:"\2713"; position:absolute; left:0; top:1px; width:21px; height:21px; border-radius:50%; background:rgba(52,211,153,.16); color:#1c9e5c; font-size:12px; font-weight:700; display:flex; align-items:center; justify-content:center; }
.esg-acc{ border-top:1px solid var(--line); margin-top:22px; }
.esg-acc details{ border-bottom:1px solid var(--line); }
.esg-acc summary{ list-style:none; cursor:pointer; padding:24px 6px; font-family:var(--hsans); font-weight:600; font-size:clamp(17px,1.6vw,21px); color:var(--navy); display:flex; justify-content:space-between; align-items:center; gap:20px; transition:color .2s ease; }
.esg-acc summary:hover{ color:var(--gold); }
.esg-acc summary::-webkit-details-marker{ display:none; }
.esg-acc summary::after{ content:"+"; color:var(--gold); font-size:24px; line-height:1; transition:transform .25s ease; }
.esg-acc details[open] summary::after{ transform:rotate(45deg); }
.esg-acc-body{ padding:0 6px 26px; color:var(--grey); line-height:1.72; max-width:84ch; }
.esg-acc-body p{ margin:0 0 10px; }

/* ===== ESG — Code of Conduct download block ===== */
.coc{ display:grid; grid-template-columns:1.6fr 1fr; gap:clamp(24px,3vw,46px); align-items:center; margin-top:30px; }
.coc-doc{ display:flex; gap:22px; align-items:center; background:rgba(255,255,255,.05); border:1px solid rgba(255,255,255,.14); border-radius:16px; padding:24px clamp(20px,2.5vw,30px); }
.coc-thumb{ flex:0 0 auto; width:74px; height:96px; border-radius:8px; background:linear-gradient(150deg,#fff,#eceapd 0%,#e9e9f2); display:flex; align-items:flex-end; justify-content:center; position:relative; box-shadow:0 14px 30px -14px rgba(0,0,0,.5); }
.coc-thumb{ background:linear-gradient(150deg,#ffffff,#e9e9f2); }
.coc-thumb::before{ content:""; position:absolute; top:0; right:0; border-width:0 18px 18px 0; border-style:solid; border-color:var(--gold) #2a2a4c; }
.coc-thumb span{ font-family:"IBM Plex Mono",monospace; font-size:12px; font-weight:600; color:var(--navy); margin-bottom:12px; letter-spacing:.08em; }
.coc-info h3{ color:#fff; font-size:20px; margin:0 0 8px; }
.coc-info p{ color:rgba(255,255,255,.74); font-size:14.5px; line-height:1.6; margin:0 0 16px; }
.coc-actions{ display:flex; flex-wrap:wrap; gap:12px; }
.coc-points{ list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:11px; }
.coc-points li{ position:relative; padding-left:26px; color:rgba(255,255,255,.86); font-size:14.5px; }
.coc-points li::before{ content:"\2713"; position:absolute; left:0; top:0; color:var(--gold-2); font-weight:700; }
@media (max-width:860px){ .coc{ grid-template-columns:1fr; } .coc-doc{ flex-direction:column; text-align:center; align-items:center; } }

/* ===== Email compose modal ===== */
.maillink{ color:inherit; text-decoration:underline; text-underline-offset:2px; text-decoration-color:var(--gold); cursor:pointer; }
.maillink:hover{ color:var(--gold); }
.mailmodal{ position:fixed; inset:0; z-index:2200; display:none; }
.mailmodal.open{ display:block; }
.mm-backdrop{ position:absolute; inset:0; background:rgba(20,20,40,.6); backdrop-filter:blur(3px); }
.mm-dialog{ position:relative; max-width:540px; width:calc(100% - 40px); margin:7vh auto 0; max-height:86vh; overflow:auto; background:#fff; border-radius:18px; padding:clamp(24px,3vw,40px); box-shadow:0 40px 90px -30px rgba(10,10,30,.6); animation:pmIn .3s ease; }
.mm-close{ position:absolute; top:14px; right:16px; width:36px; height:36px; border:none; border-radius:50%; background:var(--paper-2); color:var(--navy); font-size:22px; line-height:1; cursor:pointer; }
.mm-close:hover{ background:var(--line); }
.mm-eyebrow{ font-family:"IBM Plex Mono",monospace; font-size:10.5px; letter-spacing:.14em; text-transform:uppercase; color:var(--gold); }
.mm-title{ font-size:clamp(22px,2.4vw,28px); color:var(--navy); margin:6px 0 4px; }
.mm-to{ font-size:14px; color:var(--grey); margin:0 0 18px; }
.mm-to strong{ color:var(--navy); }
.mm-dialog form{ display:flex; flex-direction:column; gap:14px; }
.mm-dialog label{ display:flex; flex-direction:column; gap:6px; font-size:12px; letter-spacing:.04em; text-transform:uppercase; color:var(--grey); font-weight:500; }
.mm-row{ display:grid; grid-template-columns:1fr 1fr; gap:14px; }
.mm-dialog input, .mm-dialog textarea{ font-family:inherit; font-size:15px; color:var(--navy); padding:12px 14px; border:1px solid var(--line); border-radius:9px; background:var(--paper); }
.mm-dialog input:focus, .mm-dialog textarea:focus{ outline:none; border-color:var(--gold); background:#fff; }
.mm-send{ margin-top:4px; align-self:flex-start; }
.mm-note{ font-size:12.5px; color:var(--grey-2); margin:2px 0 0; }
@media (max-width:520px){ .mm-row{ grid-template-columns:1fr; } }

/* ===== Justify body statements site-wide ===== */
.section p, .who-copy p, .brief-intro p, .panel__body p, .esg-acc-body p,
.tl-info p, .wwd2-intro p, .insight-note p, .pm-body p{
  text-align:justify; text-justify:inter-word; -webkit-hyphens:auto; hyphens:auto;
}
/* keep centred / special text as-is (not justified) */
#locations .container p, .svc-intro p, .ph--contact .container p,
.section-head p, .credo-quote, .ch2-quote, blockquote, .esg-list li, .cmd-empty,
.cta-strip p, .careers-banner p, .ticker-item, .board-updated, .mm-note, .mm-to{
  text-align:center; text-justify:auto; hyphens:none;
}
/* lists & small UI stay left */
.esg-list li, .coc-points li, .pm-points li, .footer-contact p, .ph-chip{
  text-align:left;
}

/* ===== Site search overlay ===== */
.searchov{ position:fixed; inset:0; z-index:2500; display:none; }
.searchov.open{ display:block; }
.sov-backdrop{ position:absolute; inset:0; background:rgba(16,16,34,.72); backdrop-filter:blur(4px); }
.sov-panel{ position:relative; max-width:640px; width:calc(100% - 36px); margin:10vh auto 0; background:#fff; border-radius:16px; box-shadow:0 40px 90px -30px rgba(8,8,24,.7); overflow:hidden; animation:pmIn .28s ease; }
.sov-bar{ display:flex; align-items:center; gap:12px; padding:18px 20px; border-bottom:1px solid var(--line); color:var(--grey-2); }
.sov-bar svg{ color:var(--gold); flex:0 0 auto; }
.sov-bar input{ flex:1; border:none; outline:none; font-family:inherit; font-size:18px; color:var(--navy); background:none; }
.sov-bar input::placeholder{ color:var(--grey-2); }
.sov-close{ width:34px; height:34px; border:none; border-radius:50%; background:var(--paper-2); color:var(--navy); font-size:22px; line-height:1; cursor:pointer; }
.sov-close:hover{ background:var(--line); }
.sov-results{ max-height:60vh; overflow:auto; padding:8px; }
.sov-hint{ font-family:"IBM Plex Mono",monospace; font-size:10.5px; letter-spacing:.12em; text-transform:uppercase; color:var(--grey-2); padding:12px 14px 6px; margin:0; }
.sov-item{ display:flex; flex-direction:column; gap:3px; padding:13px 14px; border-radius:10px; text-decoration:none; }
.sov-item:hover, .sov-item:focus{ background:var(--paper-2); outline:none; }
.sov-t{ font-family:var(--hsans); font-weight:600; font-size:15.5px; color:var(--navy); }
.sov-d{ font-size:13px; color:var(--grey); }
@media (max-width:520px){ .sov-panel{ margin-top:6vh; } }

/* ===== Cookie consent banner ===== */
.cookie-bar{ position:fixed; left:50%; bottom:20px; transform:translate(-50%,140%); z-index:2400; width:calc(100% - 36px); max-width:760px;
  background:var(--navy); color:#fff; border:1px solid rgba(255,255,255,.14); border-radius:14px; box-shadow:0 24px 50px -20px rgba(0,0,0,.55);
  padding:18px 22px; display:flex; flex-wrap:wrap; align-items:center; gap:14px 22px; justify-content:space-between; transition:transform .45s cubic-bezier(.4,0,.2,1); }
.cookie-bar.show{ transform:translate(-50%,0); }
.cookie-bar p{ margin:0; font-size:14px; line-height:1.55; color:rgba(255,255,255,.82); flex:1 1 320px; text-align:left; }
.cookie-bar a{ color:var(--gold-2); text-decoration:underline; }
.cookie-actions{ display:flex; gap:10px; }
.cookie-bar .btn{ padding:11px 22px; font-size:13px; }
@media (max-width:520px){ .cookie-actions{ width:100%; } .cookie-actions .btn{ flex:1; } }

/* Service card linked to a detail page */
.svc-card.has-link .svc-more i{ border:none; width:auto; }
.svc-card.has-link:hover .svc-more i{ transform:translateX(4px); }

/* ===== Oil & gas sourcing → transportation → delivery flow ===== */
.oilflow{ display:grid; grid-template-columns:1fr auto 1fr auto 1fr; align-items:stretch; gap:8px; margin-top:36px; }
.ofx-step{ position:relative; background:#fff; border:1px solid var(--line); border-radius:16px; padding:30px 24px 26px; text-align:center; transition:transform .25s ease, box-shadow .25s ease, border-color .25s ease; }
.ofx-step:hover{ transform:translateY(-6px); border-color:var(--gold); box-shadow:0 26px 48px -30px rgba(20,20,42,.4); }
.ofx-step-no{ position:absolute; top:14px; right:18px; font-family:"IBM Plex Mono",monospace; font-size:12px; color:var(--grey-2); }
.ofx-ic{ width:74px; height:74px; border-radius:50%; margin:0 auto 16px; display:flex; align-items:center; justify-content:center; background:linear-gradient(140deg,var(--navy),var(--navy-3)); box-shadow:0 12px 26px -12px rgba(42,42,76,.6); }
.ofx-ic svg{ width:34px; height:34px; stroke:var(--gold-2); fill:none; stroke-width:1.6; stroke-linecap:round; stroke-linejoin:round; }
.ofx-step:hover .ofx-ic{ background:linear-gradient(140deg,var(--gold),var(--gold-2)); }
.ofx-step:hover .ofx-ic svg{ stroke:#fff; }
.ofx-step h3{ font-size:20px; color:var(--navy); margin:0 0 8px; }
.ofx-step p{ color:var(--grey); font-size:14.5px; line-height:1.6; margin:0; }
.ofx-link{ display:flex; align-items:center; justify-content:center; min-width:54px; }
.ofx-line{ flex:1; height:2px; background:linear-gradient(90deg,var(--gold),rgba(200,162,78,.25)); }
.ofx-arrow{ color:var(--gold); font-size:24px; margin-left:-6px; }
@media (max-width:820px){
  .oilflow{ grid-template-columns:1fr; }
  .ofx-link{ transform:rotate(90deg); min-height:34px; }
  .ofx-line{ width:40px; flex:none; }
}

/* ===== WWD3 — dark interactive "What we do" cards ===== */
.wwd3{ position:relative; overflow:hidden; color:var(--ink);
  background:linear-gradient(180deg,var(--paper) 0%,var(--paper-2) 100%); }
.wwd3 .container{ display:grid; grid-template-columns:0.9fr 2.3fr; gap:clamp(40px,5vw,80px); align-items:center; }
.wwd3-left .eyebrow{ color:var(--gold-2); letter-spacing:4px; }
.wwd3-left h2{ color:var(--navy); font-weight:800; font-size:clamp(30px,3.3vw,46px); line-height:1.1; margin:14px 0 0; }
.wwd3-rule{ width:64px; height:3px; background:var(--gold); margin:24px 0; }
.wwd3-left p{ color:var(--grey); font-size:16.5px; line-height:1.75; max-width:44ch; margin:0 0 26px; }
.wwd3-left .arrow-link.on-dark{ color:var(--navy); border-bottom-color:var(--gold); }

.wwd3-cards{ display:grid; grid-template-columns:repeat(4,1fr); gap:22px; }
.wwd-card{ position:relative; text-align:left; cursor:pointer; overflow:hidden;
  border:1px solid rgba(255,255,255,.08); border-radius:5px; min-height:600px;
  padding:44px 24px 30px; font:inherit; color:#fff;
  background:linear-gradient(180deg,#2f2f55,#23233f);
  box-shadow:0 22px 50px -30px rgba(42,42,76,.55);
  transition:border-color .3s ease, box-shadow .3s ease, transform .3s ease, background .3s ease; }
.wwd-card::before{ content:""; position:absolute; top:0; left:0; right:0; height:3px; }
.wwd-card:nth-child(1)::before{ background:linear-gradient(90deg,#2fcf92,#1f9d6b); }
.wwd-card:nth-child(2)::before{ background:linear-gradient(90deg,#3aa3ff,#2f6fe0); }
.wwd-card:nth-child(3)::before{ background:linear-gradient(90deg,#edb24a,#C8A24E); }
.wwd-card:nth-child(4)::before{ background:linear-gradient(90deg,#9a6bff,#6d3fd6); }
.wwd-num{ position:absolute; top:14px; right:22px; font-family:"Fraunces",serif; font-weight:400;
  font-size:62px; line-height:1; color:rgba(255,255,255,.11); transition:color .3s ease; }
.wwd-ic{ display:block; height:74px; margin-top:34px; }
.wwd-ic svg{ width:60px; height:60px; fill:none; stroke:#fff; stroke-width:1.3; stroke-linecap:round; stroke-linejoin:round; transition:stroke .3s ease; }
.wwd-t{ display:block; font-size:26px; font-weight:800; color:#fff; margin:54px 0 8px; transition:color .3s ease; }
.wwd-s{ display:block; color:var(--gold-2); font-size:15px; }
.wwd-uline{ display:block; width:42px; height:2px; background:var(--gold); margin:16px 0 14px; opacity:0; transition:opacity .35s ease; }
.wwd-d{ display:block; color:#aab2c4; font-size:14.5px; line-height:1.62; opacity:0; transform:translateY(8px); transition:opacity .4s ease, transform .4s ease; }

.wwd-card:hover, .wwd-card.active{ border-color:var(--gold); transform:translateY(-4px);
  background:linear-gradient(180deg,#3a3a63,#262444);
  box-shadow:0 0 0 1px rgba(200,162,78,.55), 0 26px 60px -24px rgba(200,162,78,.55); }
.wwd-card:hover .wwd-num, .wwd-card.active .wwd-num{ color:var(--gold); }
.wwd-card:hover .wwd-t, .wwd-card.active .wwd-t{ color:var(--gold-2); }
.wwd-card:hover .wwd-uline, .wwd-card.active .wwd-uline,
.wwd-card:hover .wwd-d, .wwd-card.active .wwd-d{ opacity:1; transform:none; }

@media(max-width:1024px){
  .wwd3 .container{ grid-template-columns:1fr; gap:36px; }
  .wwd3-cards{ grid-template-columns:repeat(2,1fr); }
  .wwd-card{ min-height:440px; }
}
@media(max-width:560px){
  .wwd3-cards{ grid-template-columns:1fr; }
  .wwd-card{ min-height:0; padding:36px 22px 26px; }
  .wwd-uline, .wwd-d{ opacity:1; transform:none; }
}

/* ===========================================================
   PREMIUM POLISH LAYER  (added via ui-ux-pro-max skill)
   Swiss / editorial refinement for a global enterprise brand:
   depth, signature accents, and refined micro-interactions.
   Brand-safe (navy + gold). All motion respects reduced-motion.
   =========================================================== */

/* 1 — Brand selection + custom scrollbar -------------------- */
::selection{ background:var(--gold); color:var(--navy); }
html{ scrollbar-color:var(--navy-3) var(--paper-2); }
::-webkit-scrollbar{ width:11px; height:11px; }
::-webkit-scrollbar-track{ background:var(--paper-2); }
::-webkit-scrollbar-thumb{ background:var(--navy-3); border-radius:10px; border:2px solid var(--paper-2); }
::-webkit-scrollbar-thumb:hover{ background:var(--gold); }

/* 2 — Scroll progress bar (JS-driven) ----------------------- */
.scroll-progress{ position:fixed; top:0; left:0; height:3px; width:0; z-index:200;
  background:linear-gradient(90deg, var(--gold), var(--gold-2));
  box-shadow:0 0 12px rgba(200,162,78,.6); pointer-events:none; will-change:width; }

/* 3 — Accessible keyboard focus ring ------------------------ */
a:focus-visible, button:focus-visible, input:focus-visible,
textarea:focus-visible, [tabindex]:focus-visible{
  outline:2px solid var(--gold); outline-offset:3px; border-radius:2px; }

/* 4 — Eyebrow: kinetic gold lead line ----------------------- */
.eyebrow::before{ content:""; display:inline-block; width:26px; height:2px;
  background:var(--gold); vertical-align:middle; margin-right:13px; }
.eyebrow.on-dark::before{ background:var(--gold-2); }

/* 5 — Buttons: refined lift + shadow ------------------------ */
.btn{ transition:background-color .25s ease, color .25s ease, border-color .25s ease,
  transform .25s ease, box-shadow .25s ease; }
.btn:hover{ transform:translateY(-2px); box-shadow:0 16px 30px -16px rgba(42,42,76,.55); }
.btn:active{ transform:translateY(0); box-shadow:0 8px 16px -12px rgba(42,42,76,.5); }
.btn--gold:hover{ box-shadow:0 16px 34px -16px rgba(200,162,78,.6); }

/* 6 — Cards: gold top-accent grows in on hover -------------- */
.card, .value-card, .sub-card{ position:relative; }
.card::before, .value-card::before, .sub-card::before{ content:""; position:absolute;
  top:0; left:0; height:3px; width:0; z-index:3;
  background:linear-gradient(90deg, var(--gold), var(--gold-2)); transition:width .45s ease; }
.card:hover::before, .value-card:hover::before, .sub-card:hover::before{ width:100%; }
.value-card{ transition:transform .3s ease, box-shadow .3s ease, border-color .3s ease; }
.value-card:hover{ transform:translateY(-4px); box-shadow:0 24px 50px -30px rgba(42,42,76,.4); }

/* 7 — Stat numbers: gold underline sweeps, number warms ----- */
.stat-row .sr-bar{ transform:scaleX(.18); transform-origin:left; transition:transform .55s ease; }
.stat-row .sr:hover .sr-bar{ transform:scaleX(1); }
.stat-row .sr-num{ transition:color .3s ease; }
.stat-row .sr:hover .sr-num{ color:var(--gold); }

/* 8 — Depth on dark sections: subtle aurora glow ------------ */
.section--navy, .credo-strip, .site-footer{
  background-image:
    radial-gradient(58% 80% at 88% 0%, rgba(200,162,78,.10), transparent 60%),
    radial-gradient(50% 70% at 0% 100%, rgba(69,68,111,.40), transparent 60%); }
.careers-banner::after{ background:
  radial-gradient(60% 100% at 85% 0%, rgba(200,162,78,.18), transparent 55%),
  linear-gradient(90deg, rgba(42,42,76,.85), rgba(42,42,76,.45)); }

/* 9 — Hero: cinematic vignette over the video --------------- */
.hero::after{ content:""; position:absolute; inset:0; z-index:0; pointer-events:none;
  background:radial-gradient(135% 100% at 50% 0%, transparent 56%, rgba(15,15,35,.55)); }

/* 10 — Reveal: add a soft focus-in (depth) ------------------ */
.reveal{ filter:blur(8px); transition:opacity .7s ease, transform .7s ease, filter .7s ease; }
.reveal.in{ filter:none; }

/* 11 — Mobile nav: gold glow + staggered link entrance ------ */
.nav{ background-image:radial-gradient(85% 60% at 50% 0%, rgba(200,162,78,.12), transparent 60%); }
.nav a{ opacity:0; transform:translateY(16px);
  transition:opacity .5s ease, transform .5s ease, color .2s ease; }
.nav.open a{ opacity:1; transform:none; }
.nav.open a:nth-child(1){ transition-delay:.05s } .nav.open a:nth-child(2){ transition-delay:.10s }
.nav.open a:nth-child(3){ transition-delay:.15s } .nav.open a:nth-child(4){ transition-delay:.20s }
.nav.open a:nth-child(5){ transition-delay:.25s } .nav.open a:nth-child(6){ transition-delay:.30s }
.nav.open a:nth-child(7){ transition-delay:.35s } .nav.open a:nth-child(8){ transition-delay:.40s }
.nav.open a:nth-child(9){ transition-delay:.45s } .nav.open a:nth-child(10){ transition-delay:.50s }

/* 12 — Hero primary CTA: signature sheen sweep -------------- */
.hero--min .discover{ position:relative; overflow:hidden; will-change:transform; }
.hero--min .discover::before{ content:""; position:absolute; top:0; left:-130%; width:55%; height:100%;
  background:linear-gradient(100deg, transparent, rgba(255,255,255,.55), transparent);
  transform:skewX(-18deg); transition:left .7s ease; pointer-events:none; }
.hero--min .discover:hover::before{ left:150%; }

/* 13 — News feature image: gentle zoom ---------------------- */
.news-feature__media img, .news2-card__media img{ transition:transform .6s ease; }
.news-feature:hover .news-feature__media img,
.news2-card:hover .news2-card__media img{ transform:scale(1.05); }

/* 14 — Reduced motion: honour user preference --------------- */
@media (prefers-reduced-motion: reduce){
  *, *::before, *::after{
    animation-duration:.001ms !important; animation-iteration-count:1 !important;
    transition-duration:.001ms !important; scroll-behavior:auto !important; }
  .reveal{ filter:none; opacity:1; transform:none; }
  .cap-strip__track, .marquee__track, .ticker-row, .pin-pulse{ animation:none !important; }
  .nav a{ opacity:1; transform:none; }
  .hero__content > *, .hero__scroll{ opacity:1 !important; animation:none !important; }
}

/* ===========================================================
   DRAMATIC HERO v2  (added via ui-ux-pro-max skill)
   Editorial headline + dual CTAs + scroll cue over the video.
   =========================================================== */
/* Bottom-left editorial lockup so overlay never fights the video's own text */
.hero--min .hero__inner{ justify-content:flex-end; align-items:flex-start; text-align:left;
  padding-bottom:clamp(58px,8vh,110px); padding-top:160px;
  background:linear-gradient(180deg, rgba(10,10,26,.34) 0%, transparent 24%, transparent 52%, rgba(10,10,26,.82) 100%); }
.hero--min .hero__content{ align-items:flex-start; text-align:left; }
.hero__content{ display:flex; flex-direction:column; }
.hero__kicker{ font-family:"IBM Plex Mono", monospace; font-size:clamp(10.5px,1vw,12.5px);
  letter-spacing:.30em; text-transform:uppercase; color:var(--gold-2); margin-bottom:20px;
  padding-left:38px; position:relative; }
.hero__kicker::before{ content:""; position:absolute; left:0; top:50%; width:26px; height:2px;
  background:var(--gold); transform:translateY(-50%); }
.hero__title{ font-size:clamp(34px,5.4vw,76px); line-height:1.02; letter-spacing:-0.03em;
  max-width:15ch; text-shadow:0 2px 40px rgba(0,0,0,.5); }
.hero__title em{ font-family:"Fraunces", Georgia, serif; font-style:italic; font-weight:300; color:var(--gold-2); }
.hero__lede{ margin-top:22px; margin-bottom:0; max-width:50ch; font-size:clamp(15.5px,1.4vw,19px);
  line-height:1.6; color:rgba(255,255,255,.9); text-shadow:0 1px 18px rgba(0,0,0,.45); }
.hero__actions{ margin-top:34px; display:flex; gap:14px; flex-wrap:wrap; justify-content:flex-start; }
.hero__actions .btn{ padding:16px 30px; font-size:14.5px; }

/* sheen sweep on the hero primary CTA */
.hero__actions .btn--gold{ position:relative; overflow:hidden; }
.hero__actions .btn--gold::before{ content:""; position:absolute; top:0; left:-130%; width:55%; height:100%;
  background:linear-gradient(100deg, transparent, rgba(255,255,255,.5), transparent);
  transform:skewX(-18deg); transition:left .7s ease; pointer-events:none; }
.hero__actions .btn--gold:hover::before{ left:150%; }

/* staggered entrance */
@keyframes heroUp{ from{ opacity:0; transform:translateY(26px); } to{ opacity:1; transform:none; } }
.hero__content > *{ opacity:0; animation:heroUp .9s cubic-bezier(.2,.7,.2,1) forwards; }
.hero__content > *:nth-child(1){ animation-delay:.15s } .hero__content > *:nth-child(2){ animation-delay:.30s }
.hero__content > *:nth-child(3){ animation-delay:.45s } .hero__content > *:nth-child(4){ animation-delay:.60s }

/* scroll cue */
.hero__scroll{ position:absolute; left:50%; bottom:24px; transform:translateX(-50%); z-index:2;
  display:flex; flex-direction:column; align-items:center; gap:7px; color:rgba(255,255,255,.82);
  font-family:"IBM Plex Mono", monospace; font-size:10.5px; letter-spacing:.26em; text-transform:uppercase;
  opacity:0; animation:heroUp .9s ease .9s forwards; transition:color .2s ease; }
.hero__scroll:hover{ color:var(--gold-2); }
.hero__scroll svg{ width:22px; height:22px; animation:scrollBounce 1.9s ease-in-out infinite; }
@keyframes scrollBounce{ 0%,100%{ transform:translateY(0); opacity:.7 } 50%{ transform:translateY(6px); opacity:1 } }
#markets-anchor{ display:block; height:0; overflow:hidden; }
@media (max-width:680px){ .hero__scroll span{ display:none; } }

/* Hero CTAs — one on each side, anchored to the bottom of the video */
.hero__sides{ position:absolute; left:0; right:0; bottom:clamp(80px,10vh,110px); z-index:2;
  display:flex; justify-content:space-between; align-items:flex-end; gap:16px;
  padding-inline:var(--gutter); pointer-events:none; }
.hero__sides .btn{ pointer-events:auto; }
.hero__sides .btn--gold{ position:relative; overflow:hidden; }
.hero__sides .btn--gold::before{ content:""; position:absolute; top:0; left:-130%; width:55%; height:100%;
  background:linear-gradient(100deg, transparent, rgba(255,255,255,.5), transparent);
  transform:skewX(-18deg); transition:left .7s ease; pointer-events:none; }
.hero__sides .btn--gold:hover::before{ left:150%; }
@media (max-width:560px){ .hero__sides{ flex-direction:column; align-items:center; bottom:88px; gap:12px; } }

/* ===========================================================
   PROJECTS — interactive sector filter (via ui-ux-pro-max skill)
   =========================================================== */
.port-filter{ display:flex; flex-wrap:wrap; gap:10px; margin:28px 0 6px; }
.pf-btn{ font-family:"IBM Plex Mono", monospace; font-size:12px; letter-spacing:.08em; text-transform:uppercase;
  padding:10px 18px; border:1px solid var(--line); background:#fff; color:var(--navy); border-radius:30px;
  cursor:pointer; transition:background .2s ease, color .2s ease, border-color .2s ease, transform .2s ease; }
.pf-btn:hover{ border-color:var(--gold); color:var(--gold); transform:translateY(-1px); }
.pf-btn.active{ background:var(--navy); border-color:var(--navy); color:#fff; }
.pf-btn .pf-count{ opacity:.55; margin-left:5px; }
.pf-btn.active .pf-count{ color:var(--gold-2); opacity:1; }

.port-card{ position:relative; transition:transform .25s ease, box-shadow .25s ease, border-color .25s ease, opacity .35s ease; }
.port-card.is-hidden{ display:none; }
.port-card.is-filtering{ opacity:0; transform:translateY(10px); }
.port-card::after{ content:""; position:absolute; top:0; left:0; height:4px; width:0; z-index:4;
  background:linear-gradient(90deg, var(--gold), var(--gold-2)); transition:width .45s ease; }
.port-card:hover::after{ width:100%; }

/* ===========================================================
   CONTACT — interactive office cards + validated form
   (added via ui-ux-pro-max skill)
   =========================================================== */
/* Office cards become clickable map links with hover depth */
.contact-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:18px; background:none; border:0; }
@media (max-width:880px){ .contact-grid{ grid-template-columns:repeat(2,1fr); } }
@media (max-width:560px){ .contact-grid{ grid-template-columns:1fr; } }
a.office{ position:relative; display:flex; flex-direction:column; gap:6px; color:inherit;
  border:1px solid var(--line); border-radius:14px; padding:26px 24px 22px; overflow:hidden;
  transition:transform .25s ease, box-shadow .25s ease, border-color .25s ease; }
a.office::before{ content:""; position:absolute; top:0; left:0; height:3px; width:0; z-index:2;
  background:linear-gradient(90deg, var(--gold), var(--gold-2)); transition:width .45s ease; }
a.office:hover{ transform:translateY(-4px); box-shadow:0 24px 46px -28px rgba(42,42,76,.4); border-color:var(--gold); }
a.office:hover::before{ width:100%; }
a.office p{ flex:1; }
.office-dir{ margin-top:14px; display:inline-flex; align-items:center; gap:7px;
  font-family:"IBM Plex Mono", monospace; font-size:11.5px; letter-spacing:.08em; text-transform:uppercase;
  color:var(--gold); transition:gap .2s ease; }
.office-dir::after{ content:"\2192"; transition:transform .2s ease; }
a.office:hover .office-dir{ gap:10px; }
a.office:hover .office-dir::after{ transform:translateX(4px); }

/* Validated contact form */
.cform{ display:flex; flex-direction:column; gap:18px; max-width:640px; }
.cform-row{ display:grid; grid-template-columns:1fr 1fr; gap:18px; }
@media (max-width:560px){ .cform-row{ grid-template-columns:1fr; } }
.cfield{ display:flex; flex-direction:column; }
.cfield label{ font-size:13px; letter-spacing:.03em; font-weight:600; color:var(--navy); margin-bottom:8px; }
.cfield .req{ color:var(--gold); }
.cfield .opt{ color:var(--grey-2); font-weight:400; letter-spacing:0; text-transform:none; }
.cform input, .cform select, .cform textarea{ width:100%; font-family:var(--bsans); font-size:15.5px; color:var(--ink);
  background:var(--white); border:1px solid var(--line); border-radius:10px; padding:13px 14px;
  transition:border-color .2s ease, box-shadow .2s ease; }
.cform textarea{ resize:vertical; min-height:130px; }
.cform select{ appearance:none; -webkit-appearance:none; cursor:pointer;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8' fill='none' stroke='%236A6A78' stroke-width='2'%3E%3Cpath d='M1 1l5 5 5-5'/%3E%3C/svg%3E");
  background-repeat:no-repeat; background-position:right 16px center; padding-right:40px; }
.cform input:focus, .cform select:focus, .cform textarea:focus{ outline:none; border-color:var(--gold);
  box-shadow:0 0 0 3px rgba(200,162,78,.18); }
.cform .cfield.invalid input, .cform .cfield.invalid textarea{ border-color:#C0392B; box-shadow:0 0 0 3px rgba(192,57,43,.14); }
.cfield-hint{ font-size:12.5px; color:var(--grey-2); margin-top:6px; }
.cfield-err{ font-size:12.5px; color:#C0392B; margin-top:6px; min-height:0; display:none; }
.cfield.invalid .cfield-err{ display:block; }
.cform-consent{ display:flex; align-items:flex-start; gap:11px; font-size:14px; color:var(--grey); line-height:1.5; cursor:pointer; }
.cform-consent input{ width:18px; height:18px; margin-top:2px; accent-color:var(--gold); flex:none; cursor:pointer; }
.cform-consent a{ color:var(--navy); text-decoration:underline; }
.cform-consent .req{ color:var(--gold); }
.cform.consent-invalid .cform-consent span{ color:#C0392B; }
#cf-consent-err{ margin-top:-8px; }
.cform-submit{ align-self:flex-start; margin-top:2px; }
.cform-submit[disabled]{ opacity:.6; cursor:progress; }
.cform-success{ display:flex; align-items:flex-start; gap:13px; padding:18px 20px; border-radius:12px;
  background:rgba(31,161,95,.08); border:1px solid rgba(31,161,95,.35); color:var(--navy); }
.cform-success[hidden]{ display:none; }

/* ===========================================================
   MORE INTERACTIVE CARDS — value-cards (Sectors / Company)
   (added via ui-ux-pro-max skill)
   =========================================================== */
/* All value-cards: number warms to gold + subtle wash on hover */
.value-card .vc-num{ transition:color .3s ease; }
.value-card:hover .vc-num{ color:var(--gold); }
.value-card:hover{ background:linear-gradient(180deg, rgba(200,162,78,.05), transparent 70%); }

/* Linked value-cards (Sectors -> service pages) */
a.value-card{ display:flex; flex-direction:column; color:inherit; }
a.value-card p{ flex:1; }
a.feature{ color:inherit; display:block; }
.vc-go{ margin-top:16px; display:inline-flex; align-items:center; gap:7px;
  font-family:"IBM Plex Mono", monospace; font-size:11.5px; letter-spacing:.08em; text-transform:uppercase;
  color:var(--gold); opacity:.6; transition:opacity .25s ease, gap .25s ease; }
.vc-go::after{ content:"\2192"; transition:transform .25s ease; }
a.value-card:hover .vc-go{ opacity:1; gap:10px; }
a.value-card:hover .vc-go::after{ transform:translateX(4px); }

/* Real brand logo — white-on-transparent, no chip, sized up for presence */
.brand img{ background:none; border-radius:0; padding:0; box-shadow:none;
  height:84px; filter:drop-shadow(0 2px 6px rgba(0,0,0,.35)); }
.site-header.solid .brand img{ height:58px; }
@media (max-width:680px){ .brand img{ height:64px; } .site-header.solid .brand img{ height:50px; } }
.cform-success svg{ color:#1FA15F; flex:none; margin-top:1px; }
.cform-success strong{ display:block; font-family:var(--hsans); font-size:16px; margin-bottom:3px; }
.cform-success span{ font-size:14px; color:var(--grey); }
.cform-success a{ color:var(--navy); text-decoration:underline; }