.ai-use {
  position: relative;
  overflow: hidden;
  color: #fff;
  background: radial-gradient(circle at 85% 10%, rgba(255,196,0,.16), transparent 31%), linear-gradient(145deg,#172530,#0a1016);
}
.ai-use:before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  opacity: .13;
  background-image: linear-gradient(rgba(255,255,255,.14) 1px,transparent 1px), linear-gradient(90deg,rgba(255,255,255,.14) 1px,transparent 1px);
  background-size: 46px 46px;
  mask-image: linear-gradient(90deg,transparent,#000);
}
.ai-use .wrap {position:relative;z-index:1}
.ai-use .ai-heading {max-width:900px;margin-bottom:46px}
.ai-use .ai-heading .eyebrow {color:#ffc400;letter-spacing:.14em}
.ai-use .ai-heading h2 {max-width:800px;color:#fff;text-wrap:balance}
.ai-use-grid {gap:18px}
.ai-use-grid article {
  position: relative;
  display: flex;
  flex-direction: column;
  min-height: 300px;
  padding: 30px;
  border: 1px solid #d9dee2;
  border-radius: 20px;
  background: #fff;
  color: #111820;
  box-shadow: 0 24px 55px rgba(0,0,0,.25);
}
.ai-use-grid article:after {content:"";position:absolute;left:30px;right:30px;bottom:0;height:5px;border-radius:5px 5px 0 0;background:#ffc400}
.ai-use-grid article>span {display:grid;width:54px;height:54px;place-items:center;border-radius:14px;background:#ffc400;color:#111820;font-size:18px;font-weight:950;box-shadow:0 10px 25px rgba(255,196,0,.25)}
.ai-use-grid h3 {margin:42px 0 14px;color:#111820;font-size:28px;line-height:1.12;letter-spacing:-.025em}
.ai-use-grid p {margin:0;color:#4c5861;font-size:16px;line-height:1.72}
@media(max-width:900px){.ai-use-grid{grid-template-columns:1fr}.ai-use-grid article{min-height:auto}}

/* Readable aluminium colour palette */
.ai-colors {color:#111820;background:#e4e9ed}
.ai-color-head {max-width:820px;margin-bottom:38px}
.ai-color-head .eyebrow {color:#47535c;letter-spacing:.14em}
.ai-color-head h2 {margin:12px 0 18px;color:#111820;font-size:clamp(36px,4.7vw,62px);line-height:1.02;letter-spacing:-.05em}
.ai-color-head p {max-width:760px;margin:0;color:#46535d;font-size:17px;line-height:1.72}
.ai-color-layout {display:grid;grid-template-columns:minmax(0,1.2fr) minmax(360px,.8fr);gap:38px;align-items:stretch}
.ai-color-layout .ai-swatches {display:grid;grid-template-columns:1fr 1fr;gap:14px;margin:0}
.ai-color-layout .ai-swatches article {display:flex;align-items:center;gap:16px;min-height:96px;padding:14px;border:1px solid #cbd2d7;border-radius:16px;background:#fff;box-shadow:0 10px 25px rgba(14,26,38,.07)}
.ai-color-layout .ai-swatches i {display:block;flex:0 0 58px;width:58px;height:58px;border:5px solid #fff;border-radius:13px;background:var(--c);box-shadow:0 0 0 1px #b9c0c5,0 7px 16px rgba(0,0,0,.17)}
.ai-color-layout .ai-swatches div,.ai-color-layout .ai-swatches b,.ai-color-layout .ai-swatches span {display:block}
.ai-color-layout .ai-swatches b {color:#111820;font-size:16px;line-height:1.25}
.ai-color-layout .ai-swatches span {margin-top:6px;color:#64717a;font-size:12px;font-weight:800;letter-spacing:.08em}
.ai-color-layout figure {position:relative;margin:0;min-height:426px;border:1px solid #cbd2d7;border-radius:22px;overflow:hidden;background:#f8f7f3;box-shadow:0 18px 44px rgba(14,26,38,.12)}
.ai-color-layout figure img {width:100%;height:426px;object-fit:contain}
.ai-color-layout figure figcaption {position:absolute;left:18px;bottom:18px;padding:10px 13px;border-radius:8px;background:#111820;color:#fff;font-size:12px;font-weight:800}
.ai-color-note {margin:22px 0 0;padding:16px 18px;border-left:5px solid #ffc400;border-radius:0 10px 10px 0;background:#fff;color:#46535d;line-height:1.55}
.ai-color-note strong {color:#111820}
@media(max-width:900px){.ai-color-layout{grid-template-columns:1fr}.ai-color-layout figure{min-height:390px}.ai-color-layout figure img{height:390px}}
@media(max-width:560px){.ai-color-layout .ai-swatches{grid-template-columns:1fr}.ai-color-layout .ai-swatches article{min-height:88px}.ai-color-layout figure,.ai-color-layout figure img{height:340px;min-height:340px}}