/* ===================== INDUSTRIES (index + sector pages) ===================== */

/* shared heading row */
.ihead { display: flex; flex-wrap: wrap; align-items: end; justify-content: space-between; gap: 20px 48px; margin-bottom: clamp(36px, 4.5vw, 64px); }
.ihead h2 { max-width: 16ch; }
.ihead > p { max-width: 40ch; color: var(--muted); font-size: 1.05rem; }
.ihead--dark h2 { color: #fff; }
.ihead--dark h2 em { color: var(--gold); }
.ihead--dark > p { color: var(--on-dark-2); }

/* what is at stake */
.istk { padding-block: clamp(55px, 6.2vw, 93px); background: var(--white); }
.istk__h { max-width: 14ch; }
.istk__list { list-style: none; margin: clamp(40px, 5vw, 72px) 0 0; padding: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); border-top: 1px solid var(--ink); }
.istk__list li { padding: 28px 32px 0 0; display: grid; gap: 14px; align-content: start; }
.istk__list li + li { padding-left: 32px; border-left: 1px solid var(--line); }
.istk__n { font: 600 clamp(3rem, 2rem + 3vw, 5rem)/.9 var(--sans); letter-spacing: -.05em; color: var(--gold); }
.istk__list h3 { font-size: clamp(1.3rem, 1.1rem + .6vw, 1.7rem); letter-spacing: -.03em; }
.istk__list p { color: var(--muted); max-width: 34ch; }
@media (max-width: 860px) { .istk__list { grid-template-columns: 1fr; } .istk__list li + li { padding-left: 0; border-left: 0; border-top: 1px solid var(--line); } .istk__list li { padding-bottom: 28px; } }

/* risks (night band) */
.irk { padding-block: var(--sec); background: var(--night); color: var(--on-dark-2); position: relative; overflow: hidden; }
.irk::before { content: ""; position: absolute; inset: 0; background: radial-gradient(55% 60% at 100% 0%, rgba(91,155,255,.12), transparent 70%); pointer-events: none; }
.irk.ai::before { background: radial-gradient(55% 60% at 100% 0%, rgba(139,92,246,.16), transparent 70%); }
.irk__grid { position: relative; display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: clamp(32px, 6vw, 96px); align-items: start; }
.irk h2 { color: #fff; max-width: 13ch; }
.irk h2 em { color: var(--gold); }
.irk.ai h2 em, .irk.ai .kick { color: #C4B1FD; }
.irk .kick { color: var(--gold); }
.irk__pic { margin: clamp(32px, 4vw, 48px) 0 0; aspect-ratio: 4/3; overflow: hidden; border-radius: 0; }
.irk__pic img { width: 100%; height: 100%; object-fit: cover; filter: saturate(.85); }
.irk__list { list-style: none; margin: 0; padding: 0; border-top: 1px solid var(--line-dark); }
.irk__list li { display: grid; grid-template-columns: 56px minmax(0, 1fr); column-gap: 20px; row-gap: 8px; padding: clamp(24px, 3vw, 36px) 0; border-bottom: 1px solid var(--line-dark); }
.irk__list .mono { grid-row: span 2; color: var(--gold); font-size: .8rem; padding-top: 6px; }
.irk.ai .irk__list .mono { color: #C4B1FD; }
.irk__list h3 { color: #fff; font-size: clamp(1.35rem, 1.1rem + .8vw, 1.9rem); letter-spacing: -.03em; }
.irk__list p { color: var(--on-dark-2); }
@media (max-width: 960px) { .irk__grid { grid-template-columns: 1fr; } .irk__pic { aspect-ratio: 16/9; } }

/* regulation */
.ireg { padding-block: var(--sec); background: var(--paper); }
.ireg__list { list-style: none; margin: 0; padding: 0; border-top: 1px solid var(--line-2); }
.ireg__list li { display: grid; grid-template-columns: minmax(0, 4fr) minmax(0, 2fr) minmax(0, 6fr); gap: 12px clamp(20px, 3vw, 48px); padding: 26px 0; border-bottom: 1px solid var(--line-2); align-items: baseline; }
.ireg__list h3 { font-size: 1.12rem; }
.ireg__j { font: 600 .7rem/1.3 var(--sans); letter-spacing: .12em; text-transform: uppercase; color: var(--gold-ink); }
.ireg__list p { color: var(--body); font-size: .98rem; }
@media (max-width: 860px) { .ireg__list li { grid-template-columns: 1fr; gap: 8px; } }

/* response */
.iresp { padding-block: var(--sec); background: var(--white); }
.iresp__grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 1px; background: var(--line); border: 1px solid var(--line); }
.iresp__c { position: relative; display: flex; flex-direction: column; gap: 14px; min-height: 260px; padding: clamp(24px, 2.6vw, 36px); background: var(--white); color: inherit; text-decoration: none; transition: background .35s var(--ease), color .35s; }
.iresp__c .mono { color: var(--gold-ink); font-size: .78rem; }
.iresp__c strong { font: 600 clamp(1.3rem, 1.1rem + .5vw, 1.6rem)/1.15 var(--sans); letter-spacing: -.03em; color: var(--ink); transition: color .35s; }
.iresp__c > span:not(.mono):not(.iresp__go) { color: var(--muted); transition: color .35s; }
.iresp__go { margin-top: auto; display: inline-flex; align-items: center; gap: 10px; font: 600 .92rem/1 var(--sans); color: var(--ink); transition: color .35s; }
.iresp__go svg { width: 16px; height: 16px; color: var(--gold-ink); transition: transform .3s var(--ease); }
.iresp__c:hover { background: var(--navy); }
.iresp__c:hover strong, .iresp__c:hover .iresp__go { color: #fff; }
.iresp__c:hover > span:not(.mono):not(.iresp__go) { color: var(--on-dark-2); }
.iresp__c:hover .mono, .iresp__c:hover .iresp__go svg { color: var(--gold); }
.iresp__c:hover .iresp__go svg { transform: translateX(4px); }

/* representative scenario: photo band with card */
.iscn { position: relative; isolation: isolate; overflow: hidden; padding-block: clamp(60px, 7.4vw, 112px); background: var(--ink-0); }
.iscn__bg { position: absolute; inset: 0; z-index: -1; }
.iscn__bg img { width: 100%; height: 100%; object-fit: cover; }
.iscn__bg::after { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, rgba(0,0,0,.55), rgba(0,0,0,.1)); }
.iscn__card { max-width: 640px; background: var(--white); padding: clamp(28px, 4vw, 56px); border-radius: 0; box-shadow: 0 40px 80px -40px rgba(0,0,0,.6); display: grid; gap: 18px; }
.iscn__card h2 { font-size: clamp(1.7rem, 1.2rem + 1.6vw, 2.6rem); line-height: 1.1; }
.iscn__card p { color: var(--body); }

/* FAQ */
.ifaq { padding-block: var(--sec); background: var(--white); }
.ifaq__grid { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: clamp(32px, 6vw, 96px); align-items: start; }
.ifaq h2 { max-width: 12ch; }
@media (max-width: 960px) { .ifaq__grid { grid-template-columns: 1fr; } }

/* related + other industries */
.irel { padding-block: 0 var(--sec); background: var(--white); }
.irel__grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 12px; }
.irel__grid a { display: grid; grid-template-columns: 1fr auto; gap: 10px 16px; align-items: end; padding: 24px; border: 1px solid var(--line); border-radius: 0; text-decoration: none; color: inherit; background: var(--paper); transition: border-color .25s, background .25s; }
.irel__grid a > span { grid-column: 1 / -1; font: 600 .7rem/1.2 var(--sans); letter-spacing: .12em; text-transform: uppercase; color: var(--gold-ink); }
.irel__grid strong { font-size: 1.1rem; letter-spacing: -.02em; }
.irel__grid svg { width: 18px; height: 18px; color: var(--gold-ink); transition: transform .3s var(--ease); }
.irel__grid a:hover { border-color: var(--ink); background: var(--white); }
.irel__grid a:hover svg { transform: translateX(4px); }
.irel__next { margin-top: clamp(48px, 6vw, 88px); padding-top: clamp(32px, 4vw, 48px); border-top: 1px solid var(--ink); display: grid; grid-template-columns: minmax(0, 6fr) minmax(0, 6fr); gap: 32px; align-items: start; }
.irel__next > a { display: grid; grid-template-columns: 1fr auto; align-items: end; gap: 6px 20px; text-decoration: none; color: var(--ink); }
.irel__next > a .kick { grid-column: 1 / -1; margin: 0; }
.irel__next > a strong { font: 600 clamp(1.8rem, 1.2rem + 2vw, 3rem)/1.05 var(--sans); letter-spacing: -.04em; transition: color .25s; }
.irel__next > a svg { width: 28px; height: 28px; color: var(--gold-ink); transition: transform .3s var(--ease); }
.irel__next > a:hover strong { color: var(--gold-ink); }
.irel__next > a:hover svg { transform: translateX(6px); }
.irel__next ul { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 8px; justify-content: flex-end; }
.irel__next ul a { display: inline-block; padding: 8px 14px; border: 1px solid var(--line-2); border-radius: 0; font-size: .86rem; text-decoration: none; color: var(--body); transition: border-color .2s, color .2s; }
.irel__next ul a:hover { border-color: var(--ink); color: var(--ink); }
@media (max-width: 860px) { .irel__next { grid-template-columns: 1fr; } .irel__next ul { justify-content: flex-start; } }

/* ---------- index ---------- */
.iidx { padding-block: var(--sec); background: var(--white); }
.iidx__grid { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; }
.iidx__grid li:nth-child(-n+2), .iidx__grid li:nth-child(n+7) { grid-column: span 2; }
.iidx__c { position: relative; display: block; height: clamp(380px, 46vh, 480px); overflow: hidden; border-radius: 0; color: #fff; text-decoration: none; background: var(--navy); }
.iidx__c img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; transition: transform 1.2s var(--ease); }
.iidx__c::after { content: ""; position: absolute; inset: 0; background: linear-gradient(0deg, rgba(0,0,0,.92) 0%, rgba(0,0,0,.45) 50%, rgba(0,0,0,.12) 100%); transition: background .5s; }
.iidx__b { position: absolute; z-index: 1; left: 0; right: 0; bottom: 0; padding: clamp(22px, 2.4vw, 32px); display: grid; gap: 10px; }
.iidx__b .mono { color: var(--gold); font-size: .78rem; }
.iidx__b strong { font: 600 clamp(1.3rem, 1rem + .9vw, 1.9rem)/1.1 var(--sans); letter-spacing: -.03em; color: #fff; }
.iidx__c--lg .iidx__b strong { font-size: clamp(1.7rem, 1.2rem + 1.4vw, 2.6rem); }
.iidx__t { color: rgba(237,241,247,.82); font-size: .95rem; max-width: 40ch; display: grid; grid-template-rows: 0fr; opacity: 0; transition: opacity .4s, grid-template-rows .5s var(--ease); }
.iidx__go { display: inline-flex; align-items: center; gap: 10px; font: 600 .92rem/1 var(--sans); padding-top: 12px; border-top: 1px solid rgba(255,255,255,.3); transition: border-color .4s; }
.iidx__go svg { width: 16px; height: 16px; color: var(--gold); transition: transform .3s var(--ease); }
.iidx__c:hover img, .iidx__c:focus-visible img { transform: scale(1.05); }
.iidx__c:hover .iidx__go { border-color: var(--gold); }
.iidx__c:hover .iidx__go svg { transform: translateX(4px); }
.iidx__c--lg .iidx__t, .iidx__c:hover .iidx__t, .iidx__c:focus-visible .iidx__t { opacity: 1; }
@media (hover: none) { .iidx__t { opacity: 1; } }
@media (max-width: 1080px) { .iidx__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 640px) { .iidx__grid { grid-template-columns: 1fr; } .iidx__grid li:nth-child(n) { grid-column: auto; } .iidx__c { height: 360px; } .iidx__t { opacity: 1; } }

.ithm { padding-block: var(--sec); background: var(--night); color: var(--on-dark-2); }
.ithm__list { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); border-top: 1px solid var(--line-dark); }
.ithm__list li { padding: 28px 28px 0 0; display: grid; gap: 14px; align-content: start; }
.ithm__list li + li { padding-left: 28px; border-left: 1px solid var(--line-dark); }
.ithm__n { font: 600 clamp(2.6rem, 1.8rem + 2.4vw, 4rem)/.9 var(--sans); letter-spacing: -.05em; color: var(--gold); }
.ithm__list h3 { color: #fff; font-size: clamp(1.2rem, 1.05rem + .5vw, 1.5rem); letter-spacing: -.025em; }
.ithm__list p { font-size: .96rem; }
@media (max-width: 1080px) { .ithm__list { grid-template-columns: 1fr 1fr; } .ithm__list li:nth-child(3) { border-left: 0; padding-left: 0; } .ithm__list li { padding-bottom: 28px; } }
@media (max-width: 640px) { .ithm__list { grid-template-columns: 1fr; } .ithm__list li + li { border-left: 0; padding-left: 0; border-top: 1px solid var(--line-dark); } }

.imap { padding-block: var(--sec); background: var(--paper); }
.tbl--matrix td { text-align: center; }
.tbl--matrix thead th:not(:first-child) { text-align: center; }
.tbl--matrix tbody th a { color: var(--ink); text-decoration: none; }
.tbl--matrix tbody th a:hover { color: var(--gold-ink); text-decoration: underline; }
.tbl-wrap { position: relative; }

/* ===================== SECTOR COLOURS (2026-10-24) =====================
   Each sector page sets --ind (deep ground) and --ind-ac (accent) through its
   ind-<slug> body class. The hero plate, the risks band and the accents follow. */
.ind-banking-financial-services     { --ind: #0E2340; --ind-ac: #5B9BFF; }
.ind-fintech-payments               { --ind: #123C8C; --ind-ac: #9EC3FF; }
.ind-technology-saas                { --ind: #2B2770; --ind-ac: #B9B3FF; }
.ind-cloud-ai                       { --ind: #0B4950; --ind-ac: #79E2E0; }
.ind-healthcare-life-sciences       { --ind: #123E52; --ind-ac: #8FD9E8; }
.ind-government-public-sector       { --ind: #1B2A55; --ind-ac: #A9C4FF; }
.ind-retail-ecommerce               { --ind: #1E3D6B; --ind-ac: #9FD0FF; }
.ind-critical-infrastructure-energy { --ind: #0F3B3A; --ind-ac: #8EE3C9; }

body[class*="ind-"] .phx { --pl-bg: var(--ind); --pl-ac: var(--ind-ac); --pl-mut: rgba(255,255,255,.84); }
body[class*="ind-"] .phx__kicker { background: var(--ind-ac); color: #000; }
body[class*="ind-"] .irk { background: color-mix(in srgb, var(--ind) 62%, #000); }
body[class*="ind-"] .irk::before { background: radial-gradient(55% 60% at 100% 0%, color-mix(in srgb, var(--ind-ac) 22%, transparent), transparent 70%); }
body[class*="ind-"] .irk h2 em, body[class*="ind-"] .irk .kick, body[class*="ind-"] .irk__list .mono { color: var(--ind-ac); }
body[class*="ind-"] .istk__n { color: var(--ind); }
body[class*="ind-"] .istk__list { border-top-color: var(--ind); }
body[class*="ind-"] .ireg__j, body[class*="ind-"] .iresp__c .mono { color: var(--ind); }
body[class*="ind-"] .iresp__c:hover { background: var(--ind); }
body[class*="ind-"] .iresp__c:hover .mono, body[class*="ind-"] .iresp__c:hover .iresp__go svg { color: var(--ind-ac); }
body[class*="ind-"] .iscn__card { border-top: 4px solid var(--ind); }
body[class*="ind-"] .iscn__bg::after { background: linear-gradient(90deg, color-mix(in srgb, var(--ind) 70%, transparent), rgba(0,0,0,.08)); }
body[class*="ind-"] .irel__next { border-top-color: var(--ind); }
