/* ==========================================================================
   industries.css — page-specific CSS for industries.html
   --------------------------------------------------------------------------
   Extracted from an inline <style> block on 2026-07-28. These rules style
   layout that exists only on this page, so they do not belong in the shared
   sheets — but they do not belong in the HTML either: as a file they are
   cacheable, diffable, and reviewable.

   Load order on this page:
       tokens.css -> licorp.css -> lic-system.css -> industries.css
   Last, so page-specific layout can adjust a shared component.
   ========================================================================== */

body{background:var(--bg)}
  footer{background:var(--bg)}
  .cta-final{position:relative;z-index:9}
  .section.ind-hero{padding-bottom:clamp(18px,3vw,40px) !important}
  .section.ind-hero h1{color:var(--ink)}
  .section.ind-hero .lead{color:var(--muted)}

  /* Industries tile grid (2026-07-20) */
  .ind-grid-sec{padding:0 clamp(20px,5vw,64px) clamp(64px,9vw,120px);background:transparent}
  .ind-grid{max-width:var(--maxw);margin:0 auto;display:grid;grid-template-columns:repeat(3,1fr);gap:22px;background:transparent;border:0}
  .ind-tile{position:relative;display:flex;flex-direction:column;justify-content:flex-end;min-height:320px;overflow:hidden;isolation:isolate;background:transparent;color:#fff;text-decoration:none;animation:float 7s ease-in-out infinite;will-change:transform}
  .ind-tile .ind-bg{position:absolute;inset:0;z-index:-2;background-size:cover;background-position:center;transition:transform .5s ease}
  .ind-tile::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(to top,rgba(13,20,48,.90) 8%,rgba(13,20,48,.40) 46%,rgba(13,20,48,.04))}
  .ind-tile:hover,.ind-tile:focus-visible{outline:none}
  .ind-tile:hover .ind-bg,.ind-tile:focus-visible .ind-bg{transform:scale(1.1)}
  .ind-body{padding:20px 20px 22px}
  .ind-tile h3{font-size:clamp(22px,1.6vw,26px);line-height:1.16;margin:0 0 10px;color:#fff}
  .ind-tag{display:block;font-size:14px;line-height:1.5;color:#c4d2ea;margin:0 0 14px}
  .ind-explore{display:inline-block;font-size:12.5px;font-weight:600;color:#fff;font-family:'JetBrains Mono',ui-monospace,monospace;letter-spacing:.04em;transition:color .2s;text-underline-offset:3px}
  .ind-explore .arw{display:inline-block;margin-left:5px;transition:transform .3s}
  .ind-tile:hover .ind-explore,.ind-tile:focus-visible .ind-explore{color:var(--a-teal);text-decoration:underline}
  .ind-tile:hover .ind-explore .arw,.ind-tile:focus-visible .ind-explore .arw{transform:translateX(5px)}
  @media(max-width:1024px){.ind-grid{grid-template-columns:repeat(2,1fr)}}
  @media(max-width:640px){.ind-grid{grid-template-columns:1fr}.ind-tile{min-height:260px}}

  /* Industries tiles: gentle floating wave (like homepage bento) */
  @keyframes float{0%,100%{transform:translateY(0)}50%{transform:translateY(-10px)}}
  .ind-grid .ind-tile:nth-child(1){animation-delay:0s}
  .ind-grid .ind-tile:nth-child(2){animation-delay:-.9s}
  .ind-grid .ind-tile:nth-child(3){animation-delay:-1.8s}
  .ind-grid .ind-tile:nth-child(4){animation-delay:-2.7s}
  .ind-grid .ind-tile:nth-child(5){animation-delay:-3.5s}
  .ind-grid .ind-tile:nth-child(6){animation-delay:-4.4s}
  .ind-grid .ind-tile:nth-child(7){animation-delay:-5.3s}
  .ind-grid .ind-tile:nth-child(8){animation-delay:-6.1s}
  @media(prefers-reduced-motion:reduce){.ind-tile{animation:none}}