/* Decahydron v4: the live site's look (Divi build, measured 2026-09-25, see v4_live/DESIGN.md)
   rebuilt as plain CSS. Oxanium headings, Satoshi body, Poppins nav/buttons, warm neutrals + charcoal. */
@font-face { font-family: "Satoshi"; src: url("../fonts/Satoshi-Light.otf") format("opentype"); font-weight: 300 500; font-display: swap; }
@font-face { font-family: "Satoshi"; src: url("../fonts/Satoshi-Bold.otf") format("opentype"); font-weight: 700; font-display: swap; }

:root {
  --sand: #DFD8CB;
  --grey: #EAEAEA;
  --charcoal: #3E3E42;
  --footer: #2B2B2B;
  --rose: #D8BEB8;
  --text: #3D3535;
  --ghost: #C9C9C9;
  --white: #FFFFFF;
  --radius: 18px;
  --card-radius: 44px;
  --wrap: 1296px;
  --gutter: clamp(20px, 5vw, 72px);
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; background: var(--grey); color: var(--text); font: 300 19px/1.55 Satoshi, "Segoe UI", system-ui, sans-serif; -webkit-font-smoothing: antialiased; }
body.home { background: var(--sand); }
img, video { max-width: 100%; display: block; }
a { color: inherit; }
a:focus-visible, button:focus-visible, input:focus-visible, textarea:focus-visible { outline: 2px solid var(--charcoal); outline-offset: 3px; }
h1, h2, h3 { font-family: Oxanium, "Segoe UI", sans-serif; font-weight: 700; color: var(--charcoal); margin: 0; letter-spacing: -0.01em; text-wrap: balance; }
h2 { font-size: clamp(30px, 3.6vw, 52px); line-height: 0.98; letter-spacing: -1px; }
h3 { font-size: 21px; line-height: 1.15; }
p { margin: 0 0 18px; }
p:last-child { margin-bottom: 0; }
.wrap { max-width: var(--wrap); margin: 0 auto; padding-inline: var(--gutter); }

/* header */
.site-header { position: sticky; top: 0; z-index: 50; background: var(--charcoal); transition: box-shadow .3s; }
.site-header.scrolled { box-shadow: 0 0 7px rgba(0,0,0,.18); }
.site-header .bar { display: flex; align-items: center; justify-content: space-between; gap: 24px; height: 78px; max-width: 1600px; margin: 0 auto; padding-inline: 30px; transition: height .3s; }
.site-header.scrolled .bar { height: 58px; }
.site-header .logo img { height: 26px; width: auto; }
.nav { display: flex; gap: 24px; font: 400 14px/1 Poppins, sans-serif; text-transform: uppercase; }
.nav a { color: var(--grey); text-decoration: none; padding: 6px 0; border-bottom: 1px solid transparent; }
.nav a:hover, .nav a[aria-current="page"] { border-bottom-color: var(--grey); }
.menu-btn { display: none; background: none; border: 0; color: var(--grey); font: 400 14px Poppins, sans-serif; text-transform: uppercase; cursor: pointer; padding: 8px 0; }

/* hero (home) */
.hero { position: relative; min-height: min(100vh, 900px); display: grid; place-items: center; text-align: center; overflow: hidden; background: #6b6259; }
.hero video, .hero .poster { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.hero .hero-loop-el { opacity: 0; will-change: opacity; }
.hero .hero-loop-el.is-active { opacity: 1; }
.hero .hero-loop-el.is-fading { transition: opacity 1.1s linear; }
.hero::after { content: ""; position: absolute; inset: 0; background: rgba(0,0,0,.28); }
.hero .inner { position: relative; z-index: 1; padding: 140px 20px 200px; display: grid; justify-items: center; gap: 22px; }
.hero .inner img { width: min(1210px, 88vw); }
.hero h1 { color: var(--grey); font-size: clamp(34px, 4.6vw, 66px); line-height: 1.02; letter-spacing: -1px; }

/* the rounded content card that laps over the hero */
.card-top { position: relative; z-index: 2; margin-top: -120px; background: var(--sand); border-radius: var(--card-radius) var(--card-radius) 0 0; padding-top: 110px; }

/* banner (inner pages) */
.banner { position: relative; min-height: 520px; display: grid; place-items: center; text-align: center; overflow: hidden; background: #555 center / cover no-repeat; }
.banner::before { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(0,0,0,.22), rgba(0,0,0,.44)); }
.banner video { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.banner .inner { position: relative; z-index: 1; padding: 120px 20px; display: grid; gap: 14px; justify-items: center; }
.banner h1 { color: var(--grey); font-size: clamp(38px, 5vw, 71px); line-height: 1; letter-spacing: -1px; }
.banner .sub { font-family: Oxanium, sans-serif; font-weight: 700; color: var(--grey); font-size: clamp(20px, 2vw, 28px); }
.page-body { position: relative; z-index: 2; margin-top: -60px; background: var(--grey); border-radius: var(--card-radius) var(--card-radius) 0 0; padding-top: 90px; }
body.home .page-body { background: var(--sand); }

/* intro row: big statement + paragraph */
.intro { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(30px, 5vw, 80px); align-items: start; padding-bottom: 60px; }
.intro .statement { font-family: Oxanium, sans-serif; font-weight: 700; font-size: clamp(30px, 3.8vw, 56px); line-height: 1.02; letter-spacing: -1px; color: var(--charcoal); }
.intro .statement .reveal span { color: var(--ghost); transition: color .25s; }
.intro .statement .reveal span.on { color: var(--charcoal); }
.intro p { font-size: 19px; }
.intro .lede { font-weight: 500; }

/* alternating 50/50 rows */
.row { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(30px, 5vw, 80px); align-items: center; padding-block: 70px; }
.row.flip > .media { order: 2; }
.row .copy { display: grid; gap: 18px; align-content: start; }
.row .copy h2 { margin-bottom: 6px; }
.media { position: relative; }
.media img, .media video { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; border-radius: var(--radius); }
.media.tall img, .media.tall video { aspect-ratio: 4 / 5; }
.media.wide img, .media.wide video { aspect-ratio: 16 / 9; }
.media figcaption, .caption { margin-top: 10px; font-size: 14px; line-height: 1.45; color: #6b6464; }
.tag { display: inline-block; font: 500 11px/1 Poppins, sans-serif; text-transform: uppercase; letter-spacing: .08em; color: #6b6464; border: 1px solid #b9b2a7; border-radius: 20px; padding: 4px 9px; margin-right: 6px; vertical-align: 1px; }
.more { display: inline-flex; align-items: center; gap: 8px; font: 700 17px Satoshi, sans-serif; color: var(--charcoal); text-decoration: none; margin-top: 6px; }
.more::after { content: "\2192"; transition: transform .2s; }
.more:hover::after { transform: translateX(4px); }
.chev { display: block; width: 26px; height: 26px; margin-top: 18px; color: var(--charcoal); }
.qa { display: grid; gap: 14px; }
.qa + .qa { margin-top: 30px; }
.steps { counter-reset: s; display: grid; gap: 16px; margin: 6px 0 0; padding: 0; list-style: none; }
.steps li { display: grid; grid-template-columns: 42px 1fr; gap: 14px; }
.steps li::before { counter-increment: s; content: counter(s); font: 700 20px/42px Oxanium, sans-serif; text-align: center; width: 42px; height: 42px; border-radius: 50%; background: var(--charcoal); color: var(--grey); }
.steps b { display: block; font-weight: 700; color: var(--charcoal); }
.points { display: grid; gap: 14px; margin: 4px 0 0; }
.points div b { display: block; font-weight: 700; color: var(--charcoal); }

/* advantage grid */
.adv { padding-block: 60px 90px; }
.adv-grid { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 30px; margin-top: 44px; }
.adv-grid svg { width: 38px; height: 38px; margin-bottom: 14px; color: var(--charcoal); }
.adv-grid h3 { margin-bottom: 8px; }
.adv-grid p { font-size: 16px; line-height: 1.45; }

/* projects */
.projects { padding-block: 60px 90px; }
.proj-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 26px; margin-top: 44px; }
.proj { display: grid; gap: 14px; text-decoration: none; color: inherit; }
.proj .ph { position: relative; overflow: hidden; border-radius: var(--radius); }
.proj .ph img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; transition: transform .6s; }
.proj:hover .ph img { transform: scale(1.04); }
.proj .ph .where { position: absolute; left: 14px; top: 14px; font: 400 12px/1 Poppins, sans-serif; text-transform: uppercase; letter-spacing: .06em; color: var(--charcoal); background: rgba(234,234,234,.92); border-radius: 20px; padding: 7px 12px; }
.proj h3 { font-size: 24px; }
.proj p { font-size: 16.5px; line-height: 1.5; }

/* project page sections */
.project { padding-block: 80px 40px; scroll-margin-top: 80px; }
.project + .project { border-top: 1px solid #cfc8bb; }
.project .head { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(30px, 5vw, 80px); align-items: end; margin-bottom: 40px; }
.project .kicker { font: 400 13px/1 Poppins, sans-serif; text-transform: uppercase; letter-spacing: .1em; color: #6b6464; margin-bottom: 14px; }
.facts { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1px; background: #cfc8bb; border: 1px solid #cfc8bb; border-radius: 14px; overflow: hidden; margin-block: 36px; }
.facts div { background: var(--grey); padding: 20px 18px; }
body.home .facts div { background: var(--sand); }
.facts .n { font: 700 30px/1 Oxanium, sans-serif; color: var(--charcoal); letter-spacing: -.5px; }
.facts .l { font-size: 14.5px; line-height: 1.4; margin-top: 8px; color: #5d5656; }
.gallery { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; margin-top: 30px; }
.gallery figure { margin: 0; }
.gallery img, .gallery video { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; border-radius: 14px; }
.film { margin-top: 10px; }
.film video { width: 100%; aspect-ratio: 16 / 9; object-fit: cover; border-radius: var(--radius); background: #333; }
.eu { display: flex; align-items: center; gap: 16px; padding: 18px 20px; border: 1px solid #cfc8bb; border-radius: 14px; background: var(--white); max-width: 520px; }
.eu .flag { width: 66px; height: 44px; flex: none; background: #003399; border-radius: 3px; display: grid; place-items: center; }
.eu b { display: block; font-weight: 700; color: var(--charcoal); }
.eu span { font-size: 15px; }

/* process diagrams */
.diagram { padding-block: 40px 80px; }
.diagram .panel { background: var(--white); border-radius: var(--radius); padding: clamp(18px, 3vw, 36px); }
.diagram svg { width: 100%; height: auto; display: block; }
.diagram .legend { display: flex; flex-wrap: wrap; gap: 20px; margin-top: 16px; font-size: 14.5px; color: #5d5656; }
.diagram .legend i { display: inline-block; width: 14px; height: 14px; border-radius: 50%; margin-right: 7px; vertical-align: -2px; }

/* partners band */
.partners-band { background: var(--charcoal); color: var(--grey); padding-block: 80px 70px; text-align: center; overflow: hidden; }
.partners-band h2 { color: var(--grey); }
.partners-band p { max-width: 70ch; margin: 18px auto 0; }
.marquee { margin-top: 46px; overflow: hidden; -webkit-mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent); mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent); }
.marquee .track { display: flex; gap: 70px; width: max-content; animation: slide 42s linear infinite; align-items: center; }
.marquee:hover .track { animation-play-state: paused; }
.marquee img { height: 54px; width: auto; max-width: 190px; object-fit: contain; }
.marquee .word { font: 700 24px/1 Oxanium, sans-serif; white-space: nowrap; color: var(--grey); letter-spacing: .01em; }
.marquee .word small { display: block; font: 400 11px Poppins, sans-serif; letter-spacing: .08em; text-transform: uppercase; margin-top: 5px; opacity: .8; }
@keyframes slide { to { transform: translateX(-50%); } }

/* partner categories */
.cats { display: grid; grid-template-columns: 1fr 1fr; gap: 40px 80px; padding-block: 40px 90px; }
.cats .qa h2 { font-size: clamp(26px, 2.6vw, 38px); }

/* news */
.news { padding-block: 70px 90px; background: var(--grey); }
.news-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 30px; margin-top: 40px; }
.news-card { display: grid; gap: 12px; align-content: start; text-decoration: none; }
.news-card img { width: 100%; aspect-ratio: 383 / 239; object-fit: cover; border-radius: 10px; }
.news-card h3 { font: 500 21px/1.2 "Big Shoulders Display", Oxanium, sans-serif; color: #333; }
.news-card .date { font-size: 14px; color: #6b6464; }
.news-card .rm { font: 700 14px Satoshi, sans-serif; text-transform: uppercase; letter-spacing: .04em; color: var(--charcoal); }
.post { display: grid; grid-template-columns: 0.9fr 1.1fr; gap: clamp(30px, 5vw, 70px); align-items: start; padding-block: 30px 80px; }
.post h1 { font-size: clamp(30px, 3.4vw, 50px); line-height: 1.02; letter-spacing: -1px; padding-top: 60px; margin-bottom: 30px; }
.post img { border-radius: var(--radius); position: sticky; top: 100px; }
.post blockquote { margin: 0 0 18px; padding-left: 18px; border-left: 3px solid var(--rose); }
.post h3 { margin: 26px 0 12px; }
.post ul { padding-left: 22px; margin: 0 0 18px; }
.prevnext { display: flex; justify-content: space-between; padding-bottom: 60px; font: 700 15px Satoshi, sans-serif; text-transform: uppercase; }
.prevnext a { text-decoration: none; color: var(--charcoal); }

/* team */
.team { display: grid; grid-template-columns: 1fr 1fr; gap: 50px 70px; margin-top: 44px; }
.person { display: grid; grid-template-columns: 180px 1fr; gap: 24px; align-items: start; }
.person img { width: 180px; height: 180px; object-fit: cover; border-radius: 50%; }
.person .role { font-weight: 700; color: var(--charcoal); margin: 6px 0 10px; }
.person p { font-size: 16.5px; line-height: 1.5; }

/* rose CTA / offices */
.cta { background: var(--rose); padding-block: 90px; text-align: center; }
.cta p { max-width: 60ch; margin: 18px auto 30px; }
.pill { display: inline-block; font: 300 16px/1 Poppins, sans-serif; text-transform: uppercase; letter-spacing: .02em; padding: 16px 28px; border-radius: 50px; border: 2px solid var(--charcoal); background: var(--charcoal); color: var(--grey); text-decoration: none; cursor: pointer; transition: background .2s, color .2s; }
.pill:hover { background: transparent; color: var(--charcoal); }
.pill.light { background: var(--grey); color: var(--charcoal); border-color: var(--grey); }
.pill.light:hover { background: transparent; color: var(--grey); }
.offices { background: var(--rose); padding-block: 80px; }
.offices .grid { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 40px; margin-top: 30px; }
.offices b { display: block; font-weight: 700; color: var(--charcoal); margin-bottom: 6px; }

/* contact */
.contact { display: grid; grid-template-columns: 1.1fr 0.9fr; gap: clamp(30px, 5vw, 80px); padding-block: 20px 90px; }
.form { display: grid; gap: 14px; margin-top: 26px; }
.form input, .form textarea { font: 400 14px Montserrat, sans-serif; text-transform: none; padding: 16px; border: 1px solid var(--charcoal); background: transparent; color: var(--text); border-radius: 0; width: 100%; }
.form textarea { min-height: 150px; resize: vertical; }
.form label { font-size: 13px; text-transform: uppercase; letter-spacing: .04em; }
.form .consent { display: flex; gap: 10px; align-items: flex-start; font-size: 13px; text-transform: uppercase; }
.form .consent input { width: auto; margin-top: 3px; }
.form .note { font-size: 14px; color: #6b6464; }
.enq h3 { font: 700 17px Satoshi, sans-serif; text-transform: uppercase; margin-bottom: 8px; }
.enq + .enq { margin-top: 34px; }
.enq a { font-weight: 700; color: var(--charcoal); }

/* footer */
.site-footer { background: var(--footer); color: var(--grey); border-radius: 30px 30px 0 0; margin-top: -30px; position: relative; z-index: 3; }
.site-footer .inner { max-width: 1152px; margin: 0 auto; padding: 60px var(--gutter) 26px; display: grid; grid-template-columns: 1.2fr 1fr; gap: 40px; }
.site-footer h2 { color: var(--grey); font-size: 26px; line-height: 1.15; letter-spacing: 0; margin-bottom: 20px; }
.site-footer p, .site-footer a { font-size: 17px; line-height: 1.45; }
.site-footer a { text-decoration: none; }
.site-footer a:hover { text-decoration: underline; }
.site-footer .right { display: grid; gap: 16px; justify-items: end; text-align: right; align-content: start; }
.site-footer .li { width: 44px; height: 44px; border-radius: 50%; background: var(--grey); color: var(--footer); display: grid; place-items: center; }
.site-footer .li svg { width: 20px; height: 20px; }
.site-footer .logo { width: 233px; margin-top: 10px; }
.site-footer .legal { grid-column: 1 / -1; border-top: 1px solid #444; padding-top: 18px; display: flex; justify-content: space-between; flex-wrap: wrap; gap: 12px; font-size: 14px; color: #bdbdbd; }


/* before / after rock cubes */
.cubes { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; }
.cubes figure { margin: 0; }
.cubes img { width: 100%; aspect-ratio: 16 / 9; object-fit: cover; border-radius: var(--radius); }
.cubes figcaption { margin-top: 10px; font-size: 15.5px; line-height: 1.45; }
.cubes figcaption b { display: block; font: 700 20px Oxanium, sans-serif; color: var(--charcoal); margin-bottom: 2px; }
.diagram .film { margin: 22px 0 0; }
@media (max-width: 860px) { .cubes { grid-template-columns: minmax(0, 1fr); } }

@media (max-width: 1400px) {
  .nav { display: none; position: absolute; top: 100%; left: 0; right: 0; background: var(--charcoal); flex-direction: column; gap: 0; padding: 10px 30px 20px; }
  .nav.open { display: flex; }
  .nav a { padding: 12px 0; border-bottom: 1px solid #555; }
  .menu-btn { display: block; }
  .adv-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 860px) {
  body { font-size: 18px; }
  .intro, .row, .project .head, .cats, .contact, .post, .team { grid-template-columns: minmax(0, 1fr); }
  .row.flip > .media { order: 0; }
  .proj-grid, .news-grid, .gallery { grid-template-columns: minmax(0, 1fr); }
  .adv-grid, .facts { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .offices .grid { grid-template-columns: minmax(0, 1fr); }
  .site-footer .inner { grid-template-columns: minmax(0, 1fr); }
  .site-footer .right { justify-items: start; text-align: left; }
  .post img { position: static; }
  .post h1 { padding-top: 30px; }
  .card-top { margin-top: -60px; padding-top: 70px; }
}
@media (max-width: 520px) {
  .site-header .logo img { height: 20px; }
  .adv-grid, .facts { grid-template-columns: minmax(0, 1fr); }
  .person { grid-template-columns: minmax(0, 1fr); }
  .hero .inner { padding: 110px 20px 150px; }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  .marquee .track { animation: none; flex-wrap: wrap; justify-content: center; width: auto; }
  .hero video, .banner video, video[data-loop] { display: none; }
  .anim * { animation: none !important; }
}

.rxscroll { overflow-x: auto; }
.rxscroll svg { width: 100%; min-width: 720px; height: auto; display: block; }
/* reactor flow chart (from the JIMCO deck, slide 12) */
.rxflow { display: grid; gap: 22px; font-family: 'Segoe UI', Satoshi, system-ui, sans-serif; }
.rxrow { display: flex; align-items: center; gap: 14px; flex-wrap: wrap; }
.rxrow.top .rxgap { flex: 1; }
.rxrow.bottom, .rxflow .result { justify-content: center; margin-inline: auto; }
.rxb { border-radius: 12px; border: 1.5px solid; padding: 14px 20px; display: grid; gap: 4px; text-align: center; min-width: 200px; }
.rxb b { font-size: 19px; font-weight: 700; }
.rxb span { font-size: 15.5px; line-height: 1.4; }
.rxb em { font-size: 14.5px; font-style: normal; color: #8a8a8a; margin-top: 4px; }
.rxb.big { flex: 1; min-width: 240px; gap: 12px; padding: 20px; }
.rxb.grey { background: #F1EEE8; border-color: #9A958C; color: #555; }
.rxb.grey b { color: #444; }
.rxb.teal { background: #E3F4EE; border-color: #2E7D66; color: #1F6B53; }
.rxb.teal b { color: #185A48; }
.rxb.teal.big span { color: #444; }
.rxb.rose { background: #FBEAE5; border-color: #B5533C; color: #A2412B; }
.rxb.rose b { color: #7E2E1E; }
.rxb.sand { background: #FBEEDC; border-color: #A2702F; color: #444; }
.rxb.sand b { color: #6B4410; }
.rxb.green { background: #EAF4DE; border-color: #6E9A3A; color: #3F7A1E; }
.rxb.green b { color: #2F5A12; }
.rxb.violet { background: #EEEDFB; border-color: #6C5FC7; color: #5B4FB8; max-width: 720px; }
.rxb.violet b { color: #3F3495; }
.rxreactor { background: #E6F0FA; border: 1.5px solid #3C78B5; border-radius: 22px; padding: 22px 26px 28px; }
.rxtitle { text-align: center; font-weight: 700; font-size: 21px; color: #1F4E86; margin-bottom: 18px; }
.rxzones { display: flex; align-items: stretch; gap: 14px; }
.rxarrow.h { width: 44px; height: 2px; background: #2E7D66; position: relative; flex: none; align-self: center; }
.rxarrow.h::after { content: ""; position: absolute; right: -2px; top: -5px; border: 6px solid transparent; border-left: 9px solid #2E7D66; border-right: 0; }
.rxarrow.brown { background: #A2702F; } .rxarrow.brown::after { border-left-color: #A2702F; }
.rxarrow.green { background: #6E9A3A; } .rxarrow.green::after { border-left-color: #6E9A3A; }
@media (max-width: 860px) {
  .rxrow, .rxzones { flex-direction: column; align-items: stretch; }
  .rxrow.top .rxgap { display: none; }
  .rxarrow.h { width: 2px; height: 26px; }
  .rxarrow.h::after { right: auto; left: -5px; top: auto; bottom: -2px; border: 6px solid transparent; border-top: 9px solid currentColor; border-bottom: 0; }
  .rxarrow.h { color: #2E7D66; } .rxarrow.brown { color: #A2702F; } .rxarrow.green { color: #6E9A3A; }
  .rxb { min-width: 0; }
}

.paper { margin-top: 18px; padding: 22px 24px; background: #fff; border-radius: 14px; border-left: 4px solid #3E3E42; display: grid; gap: 8px; }
.paper .journal { font: 500 12px Poppins, sans-serif; text-transform: uppercase; letter-spacing: .08em; color: #6b6464; }
.paper .ptitle { font: 700 22px/1.2 Oxanium, sans-serif; color: #3E3E42; }
.paper .authors { font-size: 16px; }
.paper a { font-weight: 700; color: #3E3E42; word-break: break-all; }
.realcubes { margin: 0; }
.realcubes img { width: 100%; border-radius: 18px; }
.realcubes figcaption { margin-top: 10px; font-size: 15.5px; }
.nav { gap: 20px; }
.site-header .bar { max-width: none; padding-inline: 22px; }
.dd-btn { font: inherit; text-transform: inherit; letter-spacing: inherit; color: var(--grey); background: none; border: 0; padding: 6px 0; cursor: pointer; border-bottom: 1px solid transparent; }
.dd-btn::after { content: ""; display: inline-block; width: 6px; height: 6px; border-right: 1.5px solid currentColor; border-bottom: 1.5px solid currentColor; transform: rotate(45deg); margin: 0 0 4px 9px; }
.dd.on > .dd-btn { border-bottom-color: var(--grey); }
@media (min-width: 1401px) {
  .site-header .logo { flex-shrink: 0; margin-right: 24px; }
  .site-header .bar { position: relative; }
  .nav { position: absolute; inset: 0; align-items: center; justify-content: center; gap: 30px; pointer-events: none; }
  .nav > * { pointer-events: auto; }
  .site-header .logo { position: relative; z-index: 1; }
  .nav a, .dd-btn { white-space: nowrap; font-size: 15px; letter-spacing: .02em; }
  .nav .nav-side { position: absolute; right: 22px; top: 50%; transform: translateY(-50%); display: flex; gap: 30px; }
  .nav .nav-side a { opacity: .85; font-size: 14px; }
  .dd { position: relative; }
  .dd-menu { display: none; position: absolute; top: 100%; left: -20px; min-width: 230px; background: #0E1A2B; padding: 10px 20px 14px; flex-direction: column; box-shadow: 0 14px 30px rgba(0,0,0,.28); border-radius: 0 0 10px 10px; }
  .dd-menu::before { content: ""; position: absolute; left: 0; right: 0; top: -22px; height: 22px; }
  .dd:hover .dd-menu, .dd:focus-within .dd-menu { display: flex; }
  .dd-menu a { padding: 11px 0; border-bottom: 1px solid rgba(255,255,255,.08); font-size: 14.5px; }
  .dd-menu a:last-child { border-bottom: 0; }
  .dd-menu { top: calc(100% + 20px); }
  .site-header.scrolled .dd-menu { top: calc(100% + 10px); }
  .site-header.scrolled .dd-menu::before { top: -12px; height: 12px; }
}
@media (max-width: 1400px) {
  .nav .nav-side, .dd, .dd-menu { display: contents; }
  .dd-btn { display: none; }
  .nav { max-height: calc(100vh - 78px); max-height: calc(100dvh - 78px); overflow-y: auto; overscroll-behavior: contain; }
  .nav a { padding: 10px 0; }
  .nav .nav-side a { opacity: .85; }
}

/* ===== v5 commercial theme: Archivo titles, white + ink navy, one copper accent ===== */
:root { --sand: #EDF1F5; --grey: #E6EBF1; --charcoal: #0E1A2B; --footer: #0A1320; --rose: #E9EDF3; --text: #2B3440; --ghost: #C3CAD4; --accent: #C8702A; }
body, body.home { background: #EDF1F5; font-family: Archivo, 'Segoe UI', system-ui, sans-serif; font-weight: 400; color: #1F2A37; }
p, li, td, .intro p, .row .copy p { font-weight: 400; }
.intro .lede { font-weight: 500; }
.more, .news-card .rm, .person .role, .points div b, .steps b { font-family: Archivo, sans-serif; font-weight: 700; }
h1, h2, h3, .intro .statement, .banner .sub, .facts .n, .steps li::before, .paper .ptitle, .cubes figcaption b { font-family: Archivo, "Segoe UI", sans-serif; letter-spacing: -0.02em; }
h2 { font-weight: 800; }
.hero h1, .banner h1 { font-weight: 800; letter-spacing: -0.03em; }
.site-header { background: #0E1A2B; }
.partners-band { background: #0E1A2B; }
.cta, .offices { background: #E9EDF3; }
.page-body, body.home .page-body, .card-top { background: #EDF1F5; }
.facts div, body.home .facts div { background: #FFFFFF; }
.news { background: #E6EBF1; }
.diagram .panel, .offer, .kpis div { background: #FFFFFF; }
.accent { color: var(--accent); }
.kpis { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1px; background: #D9DFE7; border: 1px solid #D9DFE7; border-radius: 14px; overflow: hidden; margin-top: 40px; }
.kpis div { background: #fff; padding: 24px 22px; }
.kpis .n { font: 800 34px/1 Archivo, sans-serif; color: #0E1A2B; letter-spacing: -0.02em; }
.kpis .n small { font-size: 18px; font-weight: 700; color: var(--accent); }
.kpis .l { margin-top: 10px; font-size: 15px; line-height: 1.45; color: #4A5563; }
.offers { display: grid; grid-template-columns: 1fr 1fr; gap: 26px; margin-top: 40px; }
.offer { border: 1px solid #D9DFE7; border-radius: 18px; overflow: hidden; background: #fff; display: grid; grid-template-rows: auto 1fr; }
.offer img { width: 100%; aspect-ratio: 16 / 9; object-fit: cover; }
.offer .in { padding: 26px 28px 30px; display: grid; gap: 14px; align-content: start; }
.offer .who { font: 600 12.5px Poppins, sans-serif; text-transform: uppercase; letter-spacing: .1em; color: var(--accent); }
.offer h3 { font-size: 28px; font-weight: 800; }
.offer ul { margin: 0; padding: 0; list-style: none; display: grid; gap: 10px; }
.offer li { padding-left: 22px; position: relative; font-size: 16.5px; line-height: 1.5; }
.offer li::before { content: ""; position: absolute; left: 0; top: .6em; width: 10px; height: 2px; background: var(--accent); }
.offer li b { color: #0E1A2B; }
.pipeline { width: 100%; border-collapse: collapse; margin-top: 36px; font-size: 16px; }
.pipeline th { text-align: left; font: 600 12.5px Poppins, sans-serif; text-transform: uppercase; letter-spacing: .08em; color: #6B7684; padding: 0 16px 12px 0; border-bottom: 2px solid #0E1A2B; }
.pipeline td { padding: 18px 16px 18px 0; border-bottom: 1px solid #D9DFE7; vertical-align: top; line-height: 1.45; }
.pipeline td b { color: #0E1A2B; font-family: Archivo, sans-serif; font-size: 18px; }
.pipeline .stage { display: inline-block; font: 600 12px Poppins, sans-serif; text-transform: uppercase; letter-spacing: .06em; padding: 5px 10px; border-radius: 20px; background: #FBEBDD; color: #9A4F12; white-space: nowrap; }
.tablewrap { overflow-x: auto; }
.compare { width: 100%; border-collapse: collapse; margin-top: 30px; font-size: 16px; }
.compare th, .compare td { text-align: left; padding: 14px 16px 14px 0; border-bottom: 1px solid #D9DFE7; vertical-align: top; }
.compare th { font: 600 12.5px Poppins, sans-serif; text-transform: uppercase; letter-spacing: .08em; color: #6B7684; border-bottom: 2px solid #0E1A2B; }
.compare td:nth-child(2) { color: #0E1A2B; font-weight: 700; }
.commercial { padding-block: 70px 30px; }
.commercial .lead2 { font-size: 20px; max-width: 64ch; margin-top: 18px; }
@media (max-width: 860px) { .offers { grid-template-columns: minmax(0, 1fr); } .kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 520px) { .kpis { grid-template-columns: minmax(0, 1fr); } }
.person { grid-template-columns: 200px 1fr; }
.person img { width: 200px; height: 250px; border-radius: 16px; object-fit: cover; }
@media (max-width: 520px) { .person img { width: 100%; max-width: 320px; height: auto; aspect-ratio: 4 / 5; } }
.eu img, .media .eu img { aspect-ratio: auto !important; object-fit: contain !important; border-radius: 0 !important; width: 100%; max-width: 420px; height: auto; }
.eu { background: #fff; }

.dhi { margin-block: 56px 10px; background: #fff; border: 1px solid #D9DFE7; border-radius: 18px; padding: 30px 32px; display: grid; grid-template-columns: minmax(260px, 0.8fr) 1.2fr; gap: 36px; align-items: center; }
.dhi .kick { font: 600 12.5px Poppins, sans-serif; text-transform: uppercase; letter-spacing: .1em; color: #C8702A; }
.dhi h3 { font-size: 22px; margin-top: 10px; }
.dhi .val { font: 800 64px/1 Archivo, sans-serif; color: #0E1A2B; letter-spacing: -0.03em; margin-top: 18px; font-variant-numeric: tabular-nums; }
.dhi .val small { font-size: 22px; font-weight: 700; color: #4A5563; margin-left: 6px; letter-spacing: 0; }
.dhi .chg { margin-top: 10px; font-weight: 700; font-size: 16px; font-variant-numeric: tabular-nums; }
.dhi .chg.up { color: #1E7D4F; } .dhi .chg.down { color: #B3261E; }
.dhi .meta { margin-top: 14px; font-size: 14.5px; color: #5B6573; line-height: 1.5; }
.dhi .range { display: flex; gap: 22px; margin-top: 14px; font-size: 14.5px; color: #5B6573; font-variant-numeric: tabular-nums; }
.dhi .range b { color: #0E1A2B; }
.dhi svg { width: 100%; height: auto; display: block; }
.dhi .note { grid-column: 1 / -1; border-top: 1px solid #E3E8EE; padding-top: 16px; font-size: 14px; color: #5B6573; line-height: 1.55; }
.dhi .note b { color: #0E1A2B; }
@media (max-width: 860px) { .dhi { grid-template-columns: minmax(0, 1fr); padding: 24px 20px; } .dhi .val { font-size: 52px; } }

.hook { padding-block: 70px 30px; }
.hook .qs { display: grid; grid-template-columns: 1fr 1fr; gap: 22px; margin-top: 30px; }
.hook .q { background: #fff; border: 1px solid #D9DFE7; border-radius: 16px; padding: 26px 28px; }
.hook .q b { display: block; font: 800 24px/1.2 Archivo, sans-serif; color: #0E1A2B; margin-bottom: 10px; }
.calc { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; margin-top: 28px; }
.calc div { background: #fff; border: 1px solid #D9DFE7; border-radius: 14px; padding: 22px 22px 24px; }
.calc .k { font: 600 12px Poppins, sans-serif; text-transform: uppercase; letter-spacing: .1em; color: #C8702A; }
.calc .f { font: 800 26px/1.15 Archivo, sans-serif; color: #0E1A2B; margin-top: 10px; }
.calc p { font-size: 15.5px; margin-top: 10px; }
.formula { margin-top: 22px; padding: 18px 22px; border-left: 4px solid #C8702A; background: #fff; border-radius: 0 12px 12px 0; font: 700 19px Archivo, sans-serif; color: #0E1A2B; }
.curve { background: #fff; border: 1px solid #D9DFE7; border-radius: 18px; padding: 24px 22px 18px; }
.curve svg { width: 100%; height: auto; display: block; }
.curve .legend { display: flex; flex-wrap: wrap; gap: 18px; margin: 10px 6px 0; font-size: 14.5px; color: #4A5563; }
.curve .legend i { display: inline-block; width: 26px; height: 0; border-top: 3px solid; vertical-align: 4px; margin-right: 8px; }
.refs { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; margin-top: 24px; }
.ref { background: #fff; border: 1px solid #D9DFE7; border-radius: 16px; padding: 24px 26px; display: grid; gap: 8px; align-content: start; }
.ref .src { font: 600 12px Poppins, sans-serif; text-transform: uppercase; letter-spacing: .1em; color: #6B7684; }
.ref b { font: 800 20px/1.25 Archivo, sans-serif; color: #0E1A2B; }
.ref .num { font: 800 34px/1 Archivo, sans-serif; color: #C8702A; margin-top: 4px; }
.ref a { font-weight: 700; color: #0E1A2B; word-break: break-word; }
@media (max-width: 860px) { .hook .qs, .calc, .refs { grid-template-columns: minmax(0, 1fr); } }

.news-rail { position: relative; margin-top: 40px; }
.news-rail .track { display: grid; grid-auto-flow: column; grid-auto-columns: calc((100% - 60px) / 3); gap: 30px; overflow-x: auto; scroll-snap-type: x mandatory; scroll-behavior: smooth; scrollbar-width: none; padding-bottom: 4px; }
.news-rail .track::-webkit-scrollbar { display: none; }
.news-rail .news-card { scroll-snap-align: start; }
.news-rail .arr { position: absolute; top: 88px; width: 46px; height: 46px; border-radius: 50%; border: 0; background: #0E1A2B; color: #fff; font-size: 22px; line-height: 46px; cursor: pointer; box-shadow: 0 6px 18px rgba(14,26,43,.25); z-index: 2; }
.news-rail .arr:disabled { opacity: .25; cursor: default; }
.news-rail .prev { left: -22px; } .news-rail .next { right: -22px; }
@media (max-width: 860px) { .news-rail .track { grid-auto-columns: 82%; } .news-rail .prev { left: -8px; } .news-rail .next { right: -8px; } }

.rc-lead { font-size: 20px; max-width: 64ch; }
.flags { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; margin-top: 30px; }
.flag { background: #fff; border: 1px solid #D9DFE7; border-left: 4px solid #B3261E; border-radius: 12px; padding: 20px 22px; }
.flag b { display: block; color: #0E1A2B; font-size: 17px; margin-bottom: 6px; }
.flag p { font-size: 15.5px; }
.step { display: grid; grid-template-columns: 90px 1fr; gap: 28px; padding-block: 56px; border-top: 1px solid #D9DFE7; }
.step .num { font: 800 64px/1 Archivo, sans-serif; color: #C8702A; }
.step .kick { font: 600 12.5px Poppins, sans-serif; letter-spacing: .1em; text-transform: uppercase; color: #6B7684; }
.step h2 { margin-top: 8px; }
.rc-fig { margin: 26px 0 0; } .rc-fig img { width: 100%; border-radius: 14px; aspect-ratio: 16/9; object-fit: cover; } .rc-fig figcaption { margin-top: 8px; font-size: 14px; color: #5B6573; }
.rc-pair { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; margin-top: 26px; } .rc-pair img { width: 100%; border-radius: 14px; aspect-ratio: 3/2; object-fit: cover; } .rc-pair figure { margin: 0; } .rc-pair figcaption { margin-top: 8px; font-size: 14px; color: #5B6573; }
@media (max-width: 860px) { .rc-pair { grid-template-columns: minmax(0,1fr); } }
.step .txt { margin-top: 18px; max-width: 70ch; display: grid; gap: 14px; }
.tells { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; margin-top: 24px; }
.tells div { background: #fff; border: 1px solid #D9DFE7; border-radius: 12px; padding: 20px 22px; }
.tells h3 { font-size: 16px; text-transform: uppercase; letter-spacing: .06em; margin-bottom: 10px; }
.tells .yes h3 { color: #1E7D4F; } .tells .no h3 { color: #B3261E; }
.tells ul { margin: 0; padding-left: 20px; display: grid; gap: 8px; font-size: 15.5px; }
.verdict { margin-top: 18px; padding: 16px 20px; border-radius: 12px; background: #0E1A2B; color: #E6EBF1; font-size: 16px; }
.verdict b { color: #F2A36B; }
.three { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; margin-top: 24px; }
.three div { background: #fff; border: 1px solid #D9DFE7; border-top: 4px solid #C8702A; border-radius: 12px; padding: 22px; }
.three .q { font: 800 20px/1.2 Archivo, sans-serif; color: #0E1A2B; }
.three p { font-size: 15.5px; margin-top: 10px; }
.ask { counter-reset: a; display: grid; gap: 12px; margin-top: 24px; padding: 0; list-style: none; }
.ask li { background: #fff; border: 1px solid #D9DFE7; border-radius: 12px; padding: 16px 20px 16px 64px; position: relative; font-size: 16.5px; }
.ask li::before { counter-increment: a; content: counter(a); position: absolute; left: 18px; top: 14px; width: 30px; height: 30px; border-radius: 50%; background: #0E1A2B; color: #fff; font: 700 15px/30px Archivo, sans-serif; text-align: center; }
.ask li b { color: #0E1A2B; }
@media (max-width: 860px) { .flags, .tells, .three { grid-template-columns: minmax(0, 1fr); } .step { grid-template-columns: minmax(0, 1fr); gap: 8px; } .step .num { font-size: 44px; } }

.dci .tiles { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; grid-column: 1 / -1; }
.dci .tile { background: #F4F6F9; border-radius: 12px; padding: 18px 20px; }
.dci .tile .k { font: 600 12px Poppins, sans-serif; text-transform: uppercase; letter-spacing: .08em; color: #6B7684; }
.dci .tile .v { font: 800 30px/1.1 Archivo, sans-serif; color: #0E1A2B; margin-top: 8px; font-variant-numeric: tabular-nums; }
.dci .tile .v small { font-size: 15px; color: #4A5563; font-weight: 700; margin-left: 4px; }
.gapchart { background: #fff; border: 1px solid #D9DFE7; border-radius: 18px; padding: 24px 22px 18px; }
.gapchart svg { width: 100%; height: auto; display: block; }
.gapchart .legend { display: flex; flex-wrap: wrap; gap: 18px; margin: 12px 6px 0; font-size: 14.5px; color: #4A5563; }
.gapchart .legend i { display: inline-block; width: 26px; height: 0; border-top: 3px solid; vertical-align: 4px; margin-right: 8px; }
.gapfacts { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; margin-top: 22px; }
.gapfacts div { background: #fff; border: 1px solid #D9DFE7; border-radius: 14px; padding: 20px 22px; }
.gapfacts .n { font: 800 34px/1 Archivo, sans-serif; color: #0E1A2B; }
.gapfacts .l { margin-top: 10px; font-size: 15px; color: #4A5563; }
@media (max-width: 860px) { .dci .tiles, .gapfacts { grid-template-columns: minmax(0, 1fr); } }

.ic-why { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; margin-top: 10px; }
.ic-why > div { background: #fff; border: 1px solid #D9DFE7; border-radius: 16px; padding: 24px 24px 22px; display: grid; gap: 10px; align-content: start; }
.ic-why .n { font: 800 38px/1 Archivo, sans-serif; color: #0E1A2B; letter-spacing: -0.02em; font-variant-numeric: tabular-nums; }
.ic-why .k { font: 600 12px Poppins, sans-serif; text-transform: uppercase; letter-spacing: .08em; color: #C8702A; }
.ic-why p { font-size: 16px; color: #4A5563; margin: 0; }
.ic-why a { font-weight: 700; color: #0E1A2B; }
.ic-assets { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; }
.ic-asset { background: #fff; border-radius: 18px; overflow: hidden; display: grid; grid-template-rows: auto 1fr; border: 1px solid #D9DFE7; }
.ic-asset img { width: 100%; aspect-ratio: 16 / 10; object-fit: cover; display: block; }
.ic-asset .b { padding: 22px 24px 24px; display: grid; gap: 10px; align-content: start; }
.ic-asset .stage { justify-self: start; font: 600 11.5px Poppins, sans-serif; text-transform: uppercase; letter-spacing: .1em; padding: 5px 10px; border-radius: 999px; background: #0E1A2B; color: #fff; }
.ic-asset h3 { margin: 0; font-size: 24px; }
.ic-asset .where { font-size: 14px; color: #6B7684; }
.ic-asset p { font-size: 16px; margin: 0; }
.ic-lines { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; }
.ic-lines > div { background: #0E1A2B; color: #E9EDF3; border-radius: 18px; padding: 30px 30px 28px; display: grid; gap: 12px; align-content: start; }
.ic-lines h3 { color: #fff; margin: 0; font-size: 26px; }
.ic-lines .who { font: 600 12px Poppins, sans-serif; text-transform: uppercase; letter-spacing: .1em; color: #F0A86A; }
.ic-lines p { margin: 0; color: rgba(233,237,243,.88); font-size: 16.5px; }
.ic-lines a { color: #fff; font-weight: 700; }
.ic-risk { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px 40px; }
.ic-risk div { border-top: 2px solid #0E1A2B; padding-top: 14px; }
.ic-risk b { display: block; font: 700 19px Archivo, sans-serif; color: #0E1A2B; margin-bottom: 6px; }
.ic-risk p { margin: 0; font-size: 16px; }
.ic-time { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 0; border-top: 2px solid #0E1A2B; }
.ic-time li { padding: 16px 18px 0 0; position: relative; }
.ic-time li::before { content: ""; position: absolute; top: -8px; left: 0; width: 14px; height: 14px; border-radius: 50%; background: #0E1A2B; }
.ic-time li.next::before { background: #EDF1F5; border: 2px solid #C8702A; }
.ic-time .d { font: 700 14px Poppins, sans-serif; text-transform: uppercase; letter-spacing: .06em; color: #C8702A; }
.ic-time p { margin: 6px 0 0; font-size: 15.5px; }
.ic-h { font: 800 34px/1.15 Archivo, sans-serif; color: #0E1A2B; margin: 0 0 22px; letter-spacing: -0.02em; }
.ic-sec { padding-block: 56px 0; }
@media (max-width: 1000px) { .ic-time { grid-template-columns: minmax(0, 1fr); border-top: 0; border-left: 2px solid #0E1A2B; } .ic-time li { padding: 0 0 22px 22px; } .ic-time li::before { top: 2px; left: -8px; } }
@media (max-width: 860px) { .ic-why, .ic-assets, .ic-lines, .ic-risk { grid-template-columns: minmax(0, 1fr); } }

.inj-intro { padding-block: 70px 10px; }
.inj-chem { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; margin: 18px 0 10px; counter-reset: s; }
.inj-chem div { background: #F4F6F9; border-radius: 14px; padding: 18px 20px; }
.inj-chem div::before { counter-increment: s; content: counter(s); display: inline-grid; place-items: center; width: 30px; height: 30px; border-radius: 50%; background: #C8702A; color: #fff; font: 700 15px Archivo, sans-serif; margin-bottom: 10px; }
.inj-chem b { display: block; font: 700 18px/1.25 Archivo, sans-serif; color: #0E1A2B; }
.inj-chem sub, .inj-chem sup { font-size: 70%; line-height: 0; }
.inj-chem code { display: block; margin: 8px 0 6px; font: 500 14px/1.4 Inter, sans-serif; color: #0E1A2B; white-space: normal; }
.inj-chem span { font-size: 14.5px; color: #4A5563; }
.inj-routes { display: grid; grid-template-columns: 1fr 1fr; gap: 26px; margin-top: 18px; }
.inj-route { background: #fff; border: 1px solid #D9DFE7; border-radius: 18px; padding: 24px 24px 20px; }
.inj-route h3 { font: 800 24px/1.15 Archivo, sans-serif; color: #0E1A2B; display: flex; gap: 12px; align-items: baseline; }
.inj-route h3 i { font-style: normal; font: 800 15px Archivo, sans-serif; color: #fff; background: #C8702A; border-radius: 6px; padding: 2px 9px; }
.inj-route.b h3 i { background: #5B6573; }
.inj-route .pic { position: relative; margin: 16px 0 10px; }
.inj-route .pic img { width: 100%; height: auto; display: block; }
.inj-route .pic b { position: absolute; transform: translate(-50%, -50%); width: 26px; height: 26px; border-radius: 50%; display: grid; place-items: center; background: #0E1A2B; color: #fff; font: 700 13px Inter, sans-serif; box-shadow: 0 0 0 3px #fff; }
.inj-route ol { margin: 0; padding-left: 22px; display: grid; gap: 6px; font-size: 15.5px; color: #2B3440; }
.inj-route ol li::marker { font-weight: 700; color: #0E1A2B; }
.inj-stats { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; margin: 10px 0 0; }
.inj-stats > div { background: #fff; border: 1px solid #D9DFE7; border-radius: 14px; padding: 22px 22px; }
.inj-stats .n { font: 800 38px/1 Archivo, sans-serif; color: #C8702A; letter-spacing: -.02em; }
.inj-stats .l { margin-top: 10px; font-size: 15px; color: #4A5563; }
.inj-chart { background: #fff; border: 1px solid #D9DFE7; border-radius: 18px; padding: 24px 22px 18px; margin-top: 22px; }
.inj-chart .ch { font: 700 17px/1.3 Archivo, sans-serif; color: #0E1A2B; margin: 0 6px 14px; }
.inj-h3 { font: 800 22px/1.2 Archivo, sans-serif; color: #0E1A2B; margin: 46px 0 0; }
.inj-chart svg { width: 100%; height: auto; display: block; }
.inj-chart .legend { display: flex; flex-wrap: wrap; gap: 8px 22px; margin: 12px 6px 0; font-size: 14.5px; color: #4A5563; }
.inj-chart .legend i { display: inline-block; width: 26px; height: 0; border-top: 3.5px solid; vertical-align: 4px; margin-right: 8px; }
.inj-chart .legend i.sq { width: 14px; height: 14px; border: 0; border-radius: 3px; vertical-align: -2px; }
.inj-chart .legend i.dot { width: 12px; height: 12px; border: 0; border-radius: 50%; vertical-align: -1px; }
.inj-why { display: grid; grid-template-columns: 1fr 1fr 2.1fr; gap: 18px; align-items: end; }
.inj-why figure { margin: 0; }
.inj-why figcaption { font-size: 14px; color: #6B7684; margin-top: 6px; text-align: center; }
.inj-sec { padding-block: 70px 10px; }
.inj-head { display: grid; grid-template-columns: minmax(0, 1fr); gap: 16px; }
.inj-head > p { margin: 0 !important; font-size: 19px; color: #2B3440; }
@media (min-width: 961px) { .inj-head { grid-template-columns: 1fr 1fr; gap: clamp(30px, 5vw, 80px); align-items: start; } }
.inj-chart .chp { margin: -4px 6px 18px; font-size: 16.5px; color: #2B3440; max-width: 90ch; }
.inj-sec h2 { font: 800 clamp(28px, 3vw, 42px)/1.08 Archivo, sans-serif; color: #0E1A2B; max-width: 26ch; }
.inj-sec > .wrap > p, .inj-sec .lead { font-size: 19px; max-width: 70ch; margin-top: 16px; color: #2B3440; }
.inj-fit { display: grid; grid-template-columns: 1fr 1fr; gap: 22px; margin-top: 28px; }
.inj-fit div { border-radius: 16px; padding: 26px 28px; background: #fff; border: 1px solid #D9DFE7; }
.inj-fit div.us { border: 2px solid #C8702A; }
.inj-fit b { display: block; font: 800 22px/1.2 Archivo, sans-serif; color: #0E1A2B; margin-bottom: 10px; }
.inj-fit ul { margin: 0; padding-left: 20px; display: grid; gap: 8px; font-size: 16px; color: #2B3440; }
.inj-sec > .wrap > p.inj-method { font-size: 14.5px; line-height: 1.6; color: #6B7684; margin-top: 26px; max-width: none; }
@media (max-width: 960px) { .inj-chem, .inj-stats { grid-template-columns: 1fr 1fr; } .inj-routes, .inj-fit { grid-template-columns: minmax(0, 1fr); } .inj-why { grid-template-columns: 1fr 1fr; } .inj-why figure.wide { grid-column: 1 / -1; } }
@media (max-width: 560px) { .inj-chem, .inj-stats, .inj-why { grid-template-columns: minmax(0, 1fr); } .inj-chart { overflow-x: auto; } .inj-chart > svg { min-width: 620px; } }