/* The homepage equipment showcase; intentionally scoped to this section. */
#technology-focus{
  position:relative; overflow:hidden; padding-block:72px;
  background:radial-gradient(ellipse at 95% 0%,#cbefff80,transparent 45%),#f1f6f9;
  border-block:1px solid #dce8ef;
}
#technology-focus::before{ content:""; position:absolute; inset:0; pointer-events:none; background-image:linear-gradient(#246d9510 1px,transparent 1px),linear-gradient(90deg,#246d9510 1px,transparent 1px); background-size:40px 40px; mask-image:linear-gradient(90deg,transparent,#000); }
#technology-focus > .container-xl{ position:relative; }
#technology-focus .technical-visual-heading{ align-items:flex-end; margin-bottom:32px; }
#technology-focus .technical-visual-heading > div{ max-width:730px; }
#technology-focus .section-kicker{ display:inline-flex; align-items:center; gap:10px; color:#0876b6; font-size:.7rem; letter-spacing:2px; }
#technology-focus .section-kicker::before{ content:""; width:26px; height:3px; background:#e8b900; }
#technology-focus h2{ font-size:clamp(2rem,3.8vw,3rem); line-height:1.08; max-width:620px; margin:14px 0; color:#102f47; }
#technology-focus .technical-visual-heading p{ font-size:.95rem; line-height:1.8; color:#5b7283; margin:0; }
#technology-focus .technical-visual-badge{ flex-shrink:0; display:flex; gap:10px; align-items:center; padding:12px 15px; border:1px solid #c7dce9; border-radius:8px; color:#195b83; background:#ffffffa8; font-size:.72rem; }
#technology-focus .technical-visual-badge .bi{ color:#007fbe; font-size:1.3rem; }
#technology-focus .technical-visual-grid{ grid-template-columns:repeat(4,minmax(0,1fr)); gap:18px; }
#technology-focus figure{
  position:relative; display:flex; flex-direction:column; grid-column:auto; height:100%; margin:0; padding:16px;
  border:1px solid #d3e1e9; border-radius:14px; overflow:hidden;
  background:#fff; box-shadow:0 8px 22px #19364e08;
  transition:transform .4s ease,box-shadow .4s ease,border-color .4s ease;
}
#technology-focus figure:first-child{ grid-column:span 2; background:linear-gradient(135deg,#0d3654,#082238); border-color:#1a506e; }
#technology-focus figure::after{ content:""; position:absolute; bottom:0; left:0; width:100%; height:3px; background:linear-gradient(90deg,#00a4df,#edc224); transform:scaleX(.18); transform-origin:left; transition:transform .45s ease; }
#technology-focus .focus-card-top{ display:flex; justify-content:space-between; align-items:center; gap:8px; margin-bottom:14px; color:#537386; font-size:.6rem; font-weight:800; letter-spacing:1.2px; }
#technology-focus .focus-number{ color:#237faf; border:1px solid #d4e7f0; padding:3px 7px; border-radius:4px; letter-spacing:1px; }
#technology-focus figure:first-child .focus-card-top{ color:#a9d4ea; }
#technology-focus figure:first-child .focus-number{ color:#f4ce35; border-color:#638599; }
#technology-focus .focus-image{ position:relative; display:grid; place-items:center; overflow:hidden; border-radius:8px; background:radial-gradient(ellipse,#fff 45%,#eaf2f7); border:1px solid #e2ebf1; }
#technology-focus .focus-image::after{ content:""; position:absolute; inset:0; pointer-events:none; background:linear-gradient(110deg,transparent 30%,#ffffffa0 48%,transparent 66%); transform:translateX(-150%); }
#technology-focus .focus-image img{ width:100%; height:180px; padding:14px; object-fit:contain; border:0; border-radius:0; background:transparent; mix-blend-mode:multiply; }
#technology-focus figcaption{ display:flex; flex-direction:column; gap:6px; padding:18px 2px 8px; }
#technology-focus figcaption strong{ font-size:1.1rem; line-height:1.3; color:#103853; }
#technology-focus figcaption span{ font-size:.8rem; line-height:1.6; color:#6c8190; }
#technology-focus figure:first-child figcaption strong{ color:#fff; font-size:1.3rem; }
#technology-focus figure:first-child figcaption span{ color:#afc9d9; }
@media (hover:hover){
  #technology-focus figure:hover{ transform:translateY(-7px); border-color:#39a2ce; box-shadow:0 18px 34px #173e5b1c; }
  #technology-focus figure:hover::after{ transform:scaleX(1); }
  #technology-focus figure:hover .focus-image img{ transform:scale(1.045); }
}
@media(prefers-reduced-motion:no-preference){
  #technology-focus figure{
    --image-entry-x:0px;
    --image-entry-y:-65px;
  }
  #technology-focus figure:nth-child(3n+1){
    --image-entry-x:-85px;
    --image-entry-y:0px;
  }
  #technology-focus figure:nth-child(3n){
    --image-entry-x:85px;
    --image-entry-y:0px;
  }
  .js-reveal-ready #technology-focus figure:not(.in-view){ opacity:0; }
  #technology-focus figure.in-view{
    animation:focusCardEnter 1.15s cubic-bezier(.16,1,.3,1) var(--focus-delay) backwards;
  }
  #technology-focus figure.in-view .focus-image::after{ animation:focusScan 1.8s ease calc(var(--focus-delay) + .4s) both; }
  #technology-focus figure.in-view .focus-number{ animation:focusStatus 4s ease-in-out var(--focus-delay) infinite; }
}
@keyframes focusCardEnter{
  from{ opacity:0; transform:translate3d(var(--image-entry-x),var(--image-entry-y),0) scale(.9); }
  to{ opacity:1; transform:translate3d(0,0,0) scale(1); }
}
@keyframes focusScan{ from{transform:translateX(-150%)} to{transform:translateX(150%)} }
@keyframes focusStatus{ 0%,100%{box-shadow:0 0 0 0 #168fc600} 50%{box-shadow:0 0 0 4px #168fc619} }
@media(max-width:991.98px){
  #technology-focus .technical-visual-grid{ grid-template-columns:repeat(2,minmax(0,1fr)); }
  #technology-focus .technical-visual-heading{ align-items:flex-start; }
}
@media(max-width:575.98px){
  #technology-focus{ padding-block:40px; }
  #technology-focus .technical-visual-grid{ gap:12px; }
  #technology-focus figure{ padding:10px; border-radius:10px; }
  #technology-focus .focus-card-top{ font-size:.52rem; letter-spacing:.5px; gap:4px; }
  #technology-focus .focus-number{ padding:3px 4px; }
  #technology-focus .focus-image img{ height:130px; padding:8px; }
  #technology-focus figure:first-child .focus-image img{ height:165px; }
  #technology-focus figcaption{ padding-top:12px; }
  #technology-focus figcaption strong{ font-size:.95rem; }
  #technology-focus figcaption span{ font-size:.75rem; }
  #technology-focus .technical-visual-badge{ flex-shrink:1; }
}
@media(prefers-reduced-motion:reduce){
  #technology-focus figure,#technology-focus figure::after,#technology-focus img{ transition:none; }
}

/* SAS logo palette: blue equipment accents, yellow highlights, warm flame details. */
#technology-focus{ --focus-blue:#008fd3; --focus-yellow:#f2c200; --focus-flame:#f15b2a; }
#technology-focus figure{ border-top:3px solid var(--focus-blue); }
#technology-focus figure:nth-child(3n+2){ border-top-color:var(--focus-yellow); }
#technology-focus figure:nth-child(3n){ border-top-color:var(--focus-flame); }
#technology-focus figure:first-child{ border-top-color:var(--focus-yellow); }
#technology-focus .focus-number{ color:#006caa; background:#eaf7ff; border-color:#b7def1; }
#technology-focus figure:nth-child(3n+2) .focus-number{ color:#715900; background:#fff8d6; border-color:#f1d874; }
#technology-focus figure:nth-child(3n) .focus-number{ color:#a13c1a; background:#fff0e9; border-color:#f5bea6; }
#technology-focus figure:first-child .focus-number{ color:#ffe36a; background:#254453; border-color:#8d844b; }
#technology-focus figure::after{ background:linear-gradient(90deg,var(--focus-blue),var(--focus-yellow) 70%,var(--focus-flame)); }
#technology-focus .section-kicker::before{ background:var(--focus-yellow); }
#technology-focus .technical-visual-badge{ border-left:3px solid var(--focus-yellow); }
