/* Connected Operations: static content is the default; motion is optional. */
.isl-operations { background: var(--tint); color: var(--ink); padding-block: clamp(56px, 7vw, 100px); }
.isl-operations__heading { max-width: 800px; margin-bottom: 40px; }
.isl-operations__heading h2 { font-size: clamp(29px, 3.2vw, 46px); line-height: 1.13; letter-spacing: -.03em; margin-bottom: 20px; }
.isl-operations__intro { max-width: 65ch; color: var(--muted); font-size: 18px; line-height: 1.65; }
.isl-operations__grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; position: relative; isolation: isolate; }
.isl-operations__connector { position: absolute; z-index: -1; top: 160px; left: 8%; right: 8%; height: 2px; background: var(--blue); opacity: .22; pointer-events: none; transform-origin: left; }
.isl-operations__card { display: flex; flex-direction: column; min-width: 0; position: relative; padding: clamp(22px, 2.4vw, 34px); border: 1px solid var(--line); border-radius: var(--radius); background: var(--white); color: var(--ink); box-shadow: 0 8px 24px #004b8305; transition: transform 180ms var(--ease-out), box-shadow 180ms var(--ease-out); }
.isl-operations__number { color: var(--blue); font-size: 13px; font-weight: 650; letter-spacing: .08em; }
.isl-operations__art { display: grid; place-items: center; aspect-ratio: 1.65; margin-block: 12px 24px; color: var(--blue); background: var(--tint); border-radius: 16px; }
.isl-operations__art > svg { display: block; width: 100%; height: auto; }
.isl-operations__card h3 { font-size: clamp(25px, 2.3vw, 32px); line-height: 1.15; letter-spacing: -.03em; margin: 0 0 12px; color: var(--blue); }
.isl-operations__description { font-size: 16px; line-height: 1.5; margin: 0 0 24px; color: var(--muted); }
.isl-operations__capabilities { list-style: none; padding: 24px 0; margin: auto 0 0; border-top: 1px solid var(--line); display: grid; gap: 12px; }
.isl-operations__capabilities li { display: flex; align-items: center; gap: 12px; font-size: 14px; font-weight: 550; line-height: 1.5; overflow-wrap: anywhere; }
.isl-operations__icon { display: inline-flex; flex: 0 0 22px; color: var(--blue); }
.isl-operations__icon svg { width: 22px; height: 22px; }
.isl-operations__link { display: flex; justify-content: space-between; align-items: center; gap: 12px; padding-top: 16px; border-top: 1px solid var(--line); color: var(--blue); font-size: 14px; font-weight: 650; }
.isl-operations__link > span { font-size: 22px; }
.isl-operations__card:focus-visible { outline: 3px solid var(--blue); outline-offset: 5px; box-shadow: 0 8px 24px #004b831a; }
@media (hover: hover) and (pointer: fine) {
  .isl-operations__card:hover { transform: translateY(-3px); box-shadow: 0 12px 28px #004b8312; }
}
/* Match the previous process-story + locations spacing without touching it. */
.home .isl-operations + .locations { padding-top: 48px; }
@media (max-width: 1024px) {
  .isl-operations__grid { grid-template-columns: 1fr; }
  .isl-operations__connector { display: none; }
  .isl-operations__art { aspect-ratio: 2.3; }
  .isl-operations__art > svg { width: min(100%, 360px); }
}
@media (max-width: 700px) {
  .home .isl-operations + .locations { padding-top: 32px; }
  .isl-operations__heading { margin-bottom: 28px; }
  .isl-operations__intro { font-size: 17px; }
  .isl-operations__art { aspect-ratio: 1.65; }
}
@media (prefers-reduced-motion: no-preference) {
  .isl-operations.is-entering .isl-operations__heading { animation: isl-operations-enter 420ms var(--ease-out) backwards; }
  .isl-operations.is-entering .isl-operations__card { animation: isl-operations-enter 420ms var(--ease-out) backwards; }
  .isl-operations.is-entering .isl-operations__card:nth-of-type(2) { animation-delay: 60ms; }
  .isl-operations.is-entering .isl-operations__card:nth-of-type(3) { animation-delay: 120ms; }
  .isl-operations.is-entering .isl-operations__connector { animation: isl-operations-connect 300ms var(--ease-in-out) backwards; }
  .isl-operations__card.is-playing .isl-operations__scan { animation: isl-operations-scan 900ms var(--ease-in-out); }
  .isl-operations__card.is-playing .isl-operations__check { animation: isl-operations-confirm 900ms var(--ease-out); }
  .isl-operations__card.is-playing .isl-operations__component-left { animation: isl-operations-join-left 900ms var(--ease-out); }
  .isl-operations__card.is-playing .isl-operations__component-right { animation: isl-operations-join-right 900ms var(--ease-out); }
  .isl-operations__card.is-playing .isl-operations__lock { transform-origin: 215px 102px; animation: isl-operations-lock 900ms var(--ease-out); }
  .isl-operations__card.is-playing .isl-operations__pallet { animation: isl-operations-supply 900ms var(--ease-in-out); }
  .isl-operations.is-entering .isl-operations__card.is-playing .isl-operations__art g { animation-delay: 360ms; animation-fill-mode: backwards; }
}
@keyframes isl-operations-enter { from { opacity: 0; transform: translateY(16px); } to { opacity: 1; transform: none; } }
@keyframes isl-operations-connect { from { transform: scaleX(0); } to { transform: scaleX(1); } }
@keyframes isl-operations-scan { 0% { transform: translateY(-38px); opacity: 0; } 20% { opacity: 1; } 80% { transform: translateY(44px); opacity: 1; } 100% { transform: none; opacity: 1; } }
@keyframes isl-operations-confirm { 0%, 65% { opacity: 0; } 100% { opacity: 1; } }
@keyframes isl-operations-join-left { 0% { transform: translateX(-28px); } 70%, 100% { transform: none; } }
@keyframes isl-operations-join-right { 0% { transform: translateX(28px); } 70%, 100% { transform: none; } }
@keyframes isl-operations-lock { 0%, 65% { transform: rotate(-90deg); } 100% { transform: none; } }
@keyframes isl-operations-supply { from { transform: translateX(-142px); } to { transform: none; } }
@media (prefers-reduced-motion: reduce) {
  .isl-operations__card { transition: none; }
  .isl-operations__card:hover { transform: none; }
  .isl-operations *, .isl-operations *::before, .isl-operations *::after { animation: none !important; }
}