#industries{padding-top:80px!important}
@media(max-width:760px){#industries{padding-top:56px!important}}
.industry-intro{display:grid;grid-template-columns:minmax(0,.27fr) minmax(0,.73fr);gap:54px;align-items:center;margin-bottom:38px}
.industry-intro-copy{min-width:0}.industry-intro-copy h2{font-size:clamp(30px,3.3vw,46px)!important;margin-bottom:24px!important}.industry-intro-copy p{font-size:18px!important;max-width:650px!important}
.industry-scenes{position:relative;width:100%;max-width:320px;margin:0;outline-offset:8px}
.industry-scenes svg{display:block;width:100%;height:auto;overflow:visible}
.industry-scenes .front{fill:url(#is-front);stroke:#bcad94;stroke-width:.8}.industry-scenes .side{fill:url(#is-side)}.industry-scenes .top,.industry-scenes .paper{fill:#fffdf5;stroke:#d6cab5;stroke-width:.8}.industry-scenes .steel{fill:#b5a98f}.industry-scenes .dark{fill:#514d43}.industry-scenes .accent{fill:url(#is-cyan)}.industry-scenes .ink{fill:#796e5b}.industry-scenes .fine{stroke:#ad9e85;stroke-width:1.2;fill:none;stroke-linecap:round;stroke-linejoin:round}
.industry-scene{opacity:0;transition:opacity .24s ease;pointer-events:none}.industry-scene.is-current{opacity:1;transition-delay:.2s}
.industry-scene-captions{position:relative;height:30px;margin-top:8px;text-align:center;font:500 14px/1.5 var(--font-body);color:var(--ink2)}.industry-scene-caption{position:absolute;inset:0;opacity:0;transition:opacity .24s}.industry-scene-caption.is-current{opacity:1;transition-delay:.2s}
@media(max-width:900px){.industry-intro{gap:30px}.industry-intro-copy p{font-size:16px!important}.industry-intro-copy h2{font-size:34px!important}}
@media(max-width:620px){.industry-intro{grid-template-columns:1fr;gap:30px;margin-bottom:28px}.industry-intro-copy{grid-row:1}.industry-intro-copy h2{font-size:32px!important}.industry-scenes{max-width:270px}.industry-scene-captions{margin-top:0}.industry-intro-copy p{font-size:16px!important}}
@media(prefers-reduced-motion:reduce){.industry-scene,.industry-scene-caption{transition:none}}

/* Each featured scene completes a small job, then holds the finished result. */
.industry-scenes{--industry-story:5.2s}
.industry-scenes .is-animated .assembly-body{animation:assembly-body var(--industry-story) both}
.industry-scenes .is-animated .assembly-rotor{animation:assembly-rotor var(--industry-story) both}
.industry-scenes .is-animated .assembly-face{animation:assembly-face var(--industry-story) both}
.industry-scenes .is-animated .assembly-cap{animation:assembly-cap var(--industry-story) both}
.industry-scenes .is-animated .assembly-fasteners{animation:assembly-fasten var(--industry-story) both}
@keyframes assembly-body{0%,8%{opacity:0;transform:translateY(-32px)}25%,100%{opacity:1;transform:translateY(0)}}
@keyframes assembly-rotor{0%,23%{opacity:0;transform:translateX(-42px)}43%,100%{opacity:1;transform:translateX(0)}}
@keyframes assembly-face{0%,39%{opacity:0;transform:translateX(36px)}59%,100%{opacity:1;transform:translateX(0)}}
@keyframes assembly-cap{0%,55%{opacity:0;transform:translateY(-30px)}74%,100%{opacity:1;transform:translateY(0)}}
@keyframes assembly-fasten{0%,62%{opacity:0}76%,100%{opacity:1}}
.brochure-cover{opacity:1}.brochure-underlay,.brochure-trim,.brochure-crease{opacity:0}.brochure-flap{transform-origin:185px 149px;transform:scaleX(-1)}
.brochure-job{transform-origin:80px 219px;transform:scale(1.15)}
.industry-scenes .is-animated .brochure-job{animation:brochure-present var(--industry-story) both}
.industry-scenes .is-animated .brochure-underlay{animation:brochure-underlay var(--industry-story) both}
.industry-scenes .is-animated .brochure-ink{animation:brochure-print var(--industry-story) both}
.industry-scenes .is-animated .brochure-flap{animation:brochure-fold var(--industry-story) both}
.industry-scenes .is-animated .brochure-cover{animation:brochure-cover var(--industry-story) both}
.industry-scenes .is-animated .brochure-trim{animation:brochure-trim var(--industry-story) both}
.industry-scenes .is-animated .brochure-cut{animation:brochure-cut var(--industry-story) both}
.industry-scenes .is-animated .brochure-crease{animation:brochure-crease var(--industry-story) both}
@keyframes brochure-print{0%,8%{opacity:0}26%,100%{opacity:1}}
@keyframes brochure-trim{0%,24%{opacity:0}30%,41%{opacity:1}49%,100%{opacity:0}}
@keyframes brochure-cut{0%,30%{transform:translateY(0)}44%,100%{transform:translateY(154px)}}
@keyframes brochure-underlay{0%,46%{opacity:1}48%,100%{opacity:0}}
@keyframes brochure-crease{0%,38%{opacity:0}44%,60%{opacity:.5}70%,100%{opacity:0}}
@keyframes brochure-fold{0%,48%{transform:scaleX(1)}72%,100%{transform:scaleX(-1)}}
@keyframes brochure-cover{0%,67%{opacity:0}73%,100%{opacity:1}}
@keyframes brochure-present{0%,70%{transform:scale(1)}84%,100%{transform:scale(1.15)}}
@media(prefers-reduced-motion:reduce){.industry-scenes [class^="assembly-"],.industry-scenes [class^="brochure-"]{animation:none!important}}

/* The remaining industries use the same arrival, assembly and final-hold rhythm. */
.industry-scenes .is-animated .stage-one{animation:story-one var(--industry-story) both}
.industry-scenes .is-animated .stage-two{animation:story-two var(--industry-story) both}
.industry-scenes .is-animated .stage-three{animation:story-three var(--industry-story) both}
.industry-scenes .is-animated .stage-four{animation:story-four var(--industry-story) both}
@keyframes story-one{0%,5%{opacity:0;transform:translateY(-20px)}25%,100%{opacity:1;transform:translateY(0)}}
@keyframes story-two{0%,22%{opacity:0;transform:translateY(-23px)}43%,100%{opacity:1;transform:translateY(0)}}
@keyframes story-three{0%,39%{opacity:0;transform:translateY(-24px)}60%,100%{opacity:1;transform:translateY(0)}}
@keyframes story-four{0%,57%{opacity:0;transform:translateY(-18px)}78%,100%{opacity:1;transform:translateY(0)}}
.industry-scenes .is-animated .pack-one,.industry-scenes .is-animated .proposal-one{animation:pack-one var(--industry-story) both}
.industry-scenes .is-animated .pack-two,.industry-scenes .is-animated .proposal-two{animation:pack-two var(--industry-story) both}
.industry-scenes .is-animated .pack-three,.industry-scenes .is-animated .proposal-three{animation:pack-three var(--industry-story) both}
.industry-scenes .is-animated .pack-lid{animation:pack-close var(--industry-story) both}
.industry-scenes .is-animated .proposal-cover{animation:proposal-close var(--industry-story) both}
@keyframes pack-one{0%,4%{opacity:0;transform:translate(-14px,-42px)}26%,100%{opacity:1;transform:translate(0,0)}}
@keyframes pack-two{0%,19%{opacity:0;transform:translateY(-48px)}41%,100%{opacity:1;transform:translateY(0)}}
@keyframes pack-three{0%,34%{opacity:0;transform:translate(15px,-40px)}56%,100%{opacity:1;transform:translate(0,0)}}
@keyframes pack-close{0%,58%{opacity:0;transform:translateY(-20px)}76%,100%{opacity:1;transform:translateY(0)}}
@keyframes proposal-close{0%,58%{opacity:0;transform:translateY(16px)}76%,100%{opacity:1;transform:translateY(0)}}
.delivery-door{transform-origin:73px 124px}.delivery-wheel{transform-box:fill-box;transform-origin:center}
.industry-scenes .is-animated .delivery-one{animation:load-one var(--industry-story) both}
.industry-scenes .is-animated .delivery-two{animation:load-two var(--industry-story) both}
.industry-scenes .is-animated .delivery-door{animation:delivery-close var(--industry-story) both}
.industry-scenes .is-animated .delivery-vehicle{animation:delivery-move var(--industry-story) both}
.industry-scenes .is-animated .delivery-wheel{animation:delivery-wheel var(--industry-story) both}
@keyframes load-one{0%,6%{opacity:0;transform:translateX(-26px)}29%,100%{opacity:1;transform:translateX(0)}}
@keyframes load-two{0%,27%{opacity:0;transform:translateX(-45px)}50%,100%{opacity:1;transform:translateX(0)}}
@keyframes delivery-close{0%,52%{transform:scaleY(0)}73%,100%{transform:scaleY(1)}}
@keyframes delivery-move{0%,74%{transform:translateX(0)}88%,100%{transform:translateX(16px)}}
@keyframes delivery-wheel{0%,74%{transform:rotate(0)}88%,100%{transform:rotate(48deg)}}
.crop-row{transform-box:fill-box;transform-origin:center bottom}
.industry-scenes .is-animated .field-rows{animation:field-rows var(--industry-story) both}
.industry-scenes .is-animated .crop-one{animation:crop-one var(--industry-story) both}
.industry-scenes .is-animated .crop-two{animation:crop-two var(--industry-story) both}
.industry-scenes .is-animated .harvest-crate{animation:harvest-crate var(--industry-story) both}
.industry-scenes .is-animated .harvest-produce{animation:harvest-produce var(--industry-story) both}
@keyframes field-rows{0%{opacity:0}21%,100%{opacity:1}}
@keyframes crop-one{0%,18%{opacity:0;transform:scaleY(.05)}44%,100%{opacity:1;transform:scaleY(1)}}
@keyframes crop-two{0%,32%{opacity:0;transform:scaleY(.05)}58%,100%{opacity:1;transform:scaleY(1)}}
@keyframes harvest-crate{0%,53%{opacity:0;transform:translateX(18px)}73%,100%{opacity:1;transform:translateX(0)}}
@keyframes harvest-produce{0%,74%{opacity:0;transform:translateY(-12px)}85%,100%{opacity:1;transform:translateY(0)}}
/* A floor plan becomes a furnished room, rather than another building. */
.room-plan{opacity:0}
.industry-scenes .is-animated .room-plan{animation:room-plan var(--industry-story) both}
.industry-scenes .is-animated .room-shell{animation:room-shell var(--industry-story) both}
.industry-scenes .is-animated .room-rug{animation:room-rug var(--industry-story) both}
.industry-scenes .is-animated .room-sofa{animation:room-sofa var(--industry-story) both}
.industry-scenes .is-animated .room-table{animation:room-table var(--industry-story) both}
@keyframes room-plan{0%,20%{opacity:1}42%,100%{opacity:0}}
@keyframes room-shell{0%,18%{opacity:0;transform:translateY(-14px)}42%,100%{opacity:1;transform:translateY(0)}}
@keyframes room-rug{0%,37%{opacity:0}54%,100%{opacity:1}}
@keyframes room-sofa{0%,44%{opacity:0;transform:translateY(-12px)}66%,100%{opacity:1;transform:translateY(0)}}
@keyframes room-table{0%,61%{opacity:0;transform:translateY(-10px)}80%,100%{opacity:1;transform:translateY(0)}}
@media(prefers-reduced-motion:reduce){.industry-scenes .is-animated *{animation:none!important}.room-plan{opacity:0}}

/* Retain the finished pose through the fade; pausing never resets a scene. */
.industry-scenes:not(.is-playing) .is-animated *{animation-play-state:paused}
.industry-scenes .is-animated *{animation-timing-function:cubic-bezier(.25,.1,.25,1)}

@keyframes finish-label{0%,76%{opacity:0;transform:translateY(3px)}86%,100%{opacity:1;transform:translateY(0)}}
.industry-ground{fill:#b7aa94;opacity:.1}
.brochure-ground{transform:scaleX(.575);transform-origin:0 232px}
.industry-scenes .is-animated .brochure-ground{animation:brochure-ground var(--industry-story) both}
@keyframes brochure-ground{0%,48%{transform:scaleX(1)}72%,100%{transform:scaleX(.575)}}

.industry-guidance{margin-top:18px;font:500 13.5px/1.5 var(--font-body);color:var(--ink3)}

#industries .tv-think-logo{margin-right:calc(.04em - 2px)}

/* Seven focused sectors, one clear operation per scene. */
.industry-scenes .is-animated .sector-step{animation:sector-settle var(--industry-story) both}
.industry-scenes .is-animated .sector-step-2{animation-name:sector-second}
.industry-scenes .is-animated .sector-step-3{animation-name:sector-third}
.industry-scenes .is-animated .sector-step-4{animation-name:sector-fourth}
@keyframes sector-settle{0%,4%{opacity:0;transform:translateY(-12px)}23%,100%{opacity:1;transform:none}}
@keyframes sector-second{0%,21%{opacity:0;transform:translateY(-10px)}42%,100%{opacity:1;transform:none}}
@keyframes sector-third{0%,39%{opacity:0;transform:translateY(-9px)}61%,100%{opacity:1;transform:none}}
@keyframes sector-fourth{0%,59%{opacity:0;transform:translateY(-5px)}78%,100%{opacity:1;transform:none}}
.sector-shutter{transform:none}
.industry-scenes .is-animated .sector-shutter{animation:sector-shutter var(--industry-story) both}
@keyframes sector-shutter{0%,18%{transform:translateY(-120px)}76%,100%{transform:translateY(0)}}
.sector-coating-mask{transform-origin:0 0}.sector-coating-tool{opacity:0}
.industry-scenes .is-animated .sector-coating-mask{animation:sector-coat var(--industry-story) both}
.industry-scenes .is-animated .sector-coating-tool{animation:sector-coat-tool var(--industry-story) both}
@keyframes sector-coat{0%,22%{transform:scaleX(0)}74%,100%{transform:scaleX(1)}}
@keyframes sector-coat-tool{0%{opacity:0}15%,78%{opacity:1}88%,100%{opacity:0}}
.industry-scenes .is-animated .sector-coating-tool{animation:sector-coat-travel var(--industry-story) both,sector-coat-tool var(--industry-story) both}
@keyframes sector-coat-travel{0%,22%{transform:translateX(0)}74%,100%{transform:translateX(151px)}}
.industry-scene-captions{height:42px;font-size:13px}
@media(prefers-reduced-motion:reduce){.industry-scenes .is-animated *{animation:none!important}.sector-coating-tool{display:none}}
