/* Shared industry template, used by every page under the Industries menu.
   Hero, introduction and closing come from pcb-concept.css, the applications list and feature from capability.css.
   This file adds the requirements grid, where each card links to the capability that meets it, and sets the section rhythm:
   introduction white, applications mist, requirements white, feature mist, closing green. */

/* Feature on mist so it separates from the white requirements grid; the image frame turns white to stay visible. */
.industry-page .cap-feature{background:var(--mist)}
.industry-page .cap-feature-image{background:#fff}
.industry-page .cap-feature-list>div{border-top-color:#cfdcd2}

.industry-page .ind-demands{position:relative;isolation:isolate;background:#fff;padding-block:84px 90px}
.industry-page .ind-demand-grid{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid #c4d2bd;border-left:1px solid var(--line)}
.industry-page .ind-demand-grid li{border-right:1px solid var(--line);border-bottom:1px solid var(--line)}
.industry-page .ind-demand-grid a{position:relative;display:flex;flex-direction:column;height:100%;min-height:280px;padding:30px 30px 26px;color:inherit;text-decoration:none;transition:background .25s}
/* Signal line that draws in along the top edge on hover. */
.industry-page .ind-demand-grid a::before{content:'';position:absolute;left:0;top:-1px;height:2px;width:100%;background:linear-gradient(90deg,var(--green),#2fb569 60%,rgba(47,181,105,0));transform:scaleX(0);transform-origin:left;transition:transform .35s}
.industry-page .ind-demand-grid a:hover,.industry-page .ind-demand-grid a:focus-visible{background:var(--mist)}
.industry-page .ind-demand-grid a:hover::before,.industry-page .ind-demand-grid a:focus-visible::before{transform:scaleX(1)}
.industry-page .ind-demand-label{display:flex;align-items:center;gap:12px;font:500 11px/1.4 var(--mono);letter-spacing:.14em;text-transform:uppercase;color:var(--green)}
.industry-page .ind-demand-label b{font-weight:500;color:var(--muted)}
.industry-page .ind-demand-grid h3{font-size:clamp(23px,1.9vw,29px);line-height:1.2;letter-spacing:-.03em;margin:46px 0 14px}
.industry-page .ind-demand-grid p{margin:0;color:var(--muted);font-size:15px;line-height:1.7;max-width:330px}
.industry-page .ind-demand-link{margin-top:auto;padding-top:28px;font-size:13px;font-weight:500;color:var(--ink)}
.industry-page .ind-demand-link span{display:inline-block;color:var(--green);transition:transform .25s}
.industry-page .ind-demand-grid a:hover .ind-demand-link span{transform:translate(2px,-2px)}

@media(max-width:1000px){
  .industry-page .ind-demand-grid{grid-template-columns:repeat(2,1fr)}
  .industry-page .ind-demand-grid a{min-height:250px}
}
@media(max-width:700px){
  .industry-page .ind-demands{padding-block:52px 56px}
  .industry-page .ind-demand-grid{grid-template-columns:1fr}
  .industry-page .ind-demand-grid a{min-height:0;padding:24px 20px 22px}
  .industry-page .ind-demand-grid h3{font-size:25px;margin-top:22px}
  .industry-page .ind-demand-grid p{font-size:16px}
  .industry-page .ind-demand-link{padding-top:18px}
}
@media(prefers-reduced-motion:reduce){.industry-page .ind-demand-grid a,.industry-page .ind-demand-grid a::before,.industry-page .ind-demand-link span{transition:none}}