/* Technical industry icon wall, matching the approved sample. */
.industries-section{position:relative;isolation:isolate;overflow:hidden;min-height:0;padding:clamp(48px,5.5vw,80px) clamp(24px,4.5vw,64px) clamp(48px,4.5vw,56px);background:#09131f;color:#eaf5fc}
.industries-intro{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);align-items:first baseline;gap:clamp(24px,4vw,56px);margin:0 0 32px;text-align:left}
.industries-intro>p{margin:0;max-width:48ch;font:400 15px/1.7 'Space Grotesk',sans-serif;color:#a8bfce}
@media(min-width:701px){.industries-intro>p{position:relative;top:-6px}}
@media(max-width:700px){.industries-intro{grid-template-columns:1fr;gap:18px}.industries-intro>p{max-width:54ch;font-size:14px}}
.industries-intro h2{margin:0;font-family:'Space Grotesk',sans-serif;font-size:clamp(30px,3.6vw,44px);font-weight:400;letter-spacing:-1.5px;line-height:1.15;color:#eaf5fc}
.industries-intro h2 span{color:#85dcec;font-style:normal;font-weight:400}
.industries-icon-wall{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));list-style:none;margin:0;padding:0;border-right:1px solid #25405280;border-bottom:1px solid #25405280}
.industries-icon-cell{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:18px;min-width:0;min-height:124px;padding:18px 12px;border-top:1px solid #25405280;border-left:1px solid #25405280;text-align:center;font:400 14px/1.4 'Space Grotesk',sans-serif;transition:background .18s ease}
.industries-grid-mark{position:absolute;width:9px;height:9px;z-index:1;pointer-events:none;background:linear-gradient(#6a97aa,#6a97aa) center/1px 9px no-repeat,linear-gradient(#6a97aa,#6a97aa) center/9px 1px no-repeat;transform:translate(-50%,-50%)}
.industries-grid-mark--tl{top:-.5px;left:-.5px}
.industries-grid-mark--tr{top:-.5px;left:calc(100% + .5px)}
.industries-grid-mark--bl{top:calc(100% + .5px);left:-.5px}
.industries-grid-mark--br{top:calc(100% + .5px);left:calc(100% + .5px)}
.industries-icon{display:block;flex:none;width:36px;height:36px;color:#65d8ee}
@media(hover:hover){.industries-icon-cell:hover{background:#16415b66}}
@media(max-width:1000px){.industries-icon-wall{grid-template-columns:repeat(3,minmax(0,1fr))}.industries-icon-cell{min-height:116px}}
@media(max-width:520px){.industries-intro{margin-bottom:24px}.industries-intro h2{font-size:32px;letter-spacing:-1.2px}.industries-intro h2 span{display:block}.industries-icon-wall{grid-template-columns:repeat(2,minmax(0,1fr))}.industries-icon-cell{min-height:116px;padding:16px 10px;gap:15px;font-size:13px}.industries-icon-cell:last-child{grid-column:1/-1}.industries-icon{width:32px;height:32px}}
@media(prefers-reduced-motion:reduce){.industries-icon-cell{transition:none}}

/* Fine blue pixel texture fades from the introduction toward the enquiry card. */
#contact{isolation:isolate;overflow:hidden;background:linear-gradient(100deg,#d8ebf8 0%,#e8f3fb 42%,#f7fbfe 76%,#fbfdff 100%);color:#173b53}
#contact::before,#contact::after{content:none}
#contact .contact-top,#contact .contact-layout{position:relative;z-index:1}
#contact .contact-intro h2{color:#12334b}
#contact .contact-intro h2 em{color:#087fa5}
#contact .contact-intro>p,#contact .contact-email{color:#38556a}

/* Compact spacing around the enquiry section. */
#contact{padding-top:56px;padding-bottom:56px}
#contact .contact-layout{margin-top:0}
@media(max-width:700px){#contact{padding-top:36px;padding-bottom:40px}}

/* Shorter enquiry card with comfortable field and button targets. */
#contact .contact-form{padding:16px 20px}
#contact .form-eyebrow{margin-bottom:10px}
#contact .contact-fields{row-gap:8px;margin-bottom:8px}
#contact .contact-field{margin-bottom:8px}
#contact textarea{height:88px;min-height:88px}
#contact .contact-form-actions{gap:8px}
@media(max-width:700px){#contact .contact-form{padding:16px}}

/* Keep the introduction beside the card until the site's mobile layout. */
@media(min-width:521px){
 #contact .contact-intro{justify-self:center;width:fit-content;max-width:100%}
 /* Let the title determine the block width; the description wraps inside it. */
 #contact .contact-intro>p{width:0;min-width:100%;max-width:none}
}
@media(min-width:521px) and (max-width:1199px){
 #contact .contact-layout{grid-template-columns:repeat(2,minmax(0,1fr));max-width:none;gap:24px;align-items:center}
 #contact .contact-intro h2{font-size:clamp(28px,3.8vw,44px)!important;letter-spacing:-1.3px}
 #contact .contact-intro>p{font-size:14px;line-height:1.65}
}
@media(min-width:521px) and (max-width:700px){
 #contact .contact-layout{gap:18px}
 #contact .contact-fields{grid-template-columns:1fr}
}
@media(max-width:520px){#contact .contact-layout{grid-template-columns:1fr}}

/* Shared base color for outcomes, industries, and ecosystem. */
.shell .flow-section,.shell #industries,.shell #ecosystem{background:var(--page-navy,#09131f);border-top:0;border-bottom:0}

/* Keep the consecutive dark sections close without resizing their artwork. */
.shell .flow-section{padding-bottom:20px}
.shell #ecosystem{padding-top:24px;padding-bottom:20px}
.shell #ecosystem .ecosystem-heading h2{margin-top:0}
.shell #ecosystem .ecosystem-map{margin-bottom:0}
@media(min-width:701px){
 .shell #ecosystem{padding-bottom:64px}
}