:root{--ink:#192232;--muted:#64748b;--blue:#287dcc;--green:#2eb454;--orange:#ffad26;--red:#f13555;--purple:#8b28a4;--line:#e8edf3}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;font:15px/1.65 Inter,system-ui,Arial,sans-serif;color:var(--ink);background:#fff}a{text-decoration:none;color:inherit}button,input,select,textarea{font:inherit}button{cursor:pointer}.wrap{width:min(1190px,calc(100% - 36px));margin:auto}.rainbow{height:6px;background:linear-gradient(90deg,#2eb454 0 20%,#ffad26 20% 40%,#f13555 40% 60%,#8b28a4 60% 80%,#287dcc 80%)}.site-nav{position:sticky;top:0;z-index:30;background:#fffffff2;border-bottom:1px solid var(--line);backdrop-filter:blur(18px)}.nav-inner{min-height:84px;display:flex;align-items:center;justify-content:space-between;gap:22px}.identity{display:flex;align-items:center;gap:11px}.identity img{width:59px;height:59px;object-fit:contain;border-radius:13px;background:#fff;box-shadow:0 5px 20px #11203c12}.identity b{font-size:19px;line-height:1.1;display:block;letter-spacing:-.6px}.identity small{color:#6b778a;letter-spacing:1.4px;font-size:9px;display:block;margin-top:4px}.nav-menu{display:flex;gap:22px;align-items:center;flex-wrap:wrap}.nav-menu a{font-size:12px;font-weight:750;color:#3c4d62}.nav-menu a:hover,.nav-menu a.current{color:#2678d4}.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;border-radius:12px;border:1px solid transparent;padding:12px 18px;font-weight:800;font-size:13px;background:#287dcc;color:#fff;transition:.2s;white-space:nowrap}.btn:hover{transform:translateY(-2px);box-shadow:0 10px 22px #1e65b333}.btn.white{background:#fff;border-color:#dce5ef;color:#22466d}.menu-toggle{display:none;border:1px solid #dee5ed;background:white;padding:7px 12px;border-radius:10px}.page-hero{padding:76px 0 58px;background:radial-gradient(circle at 88% 12%,#e3f0ff,transparent 32%),radial-gradient(circle at 10% 95%,#e9faf0,transparent 30%),#f8fafc}.eyebrow{font-size:11px;letter-spacing:2px;font-weight:850;text-transform:uppercase;color:#287dcc}.page-hero h1{font-size:clamp(36px,5vw,60px);line-height:1.09;letter-spacing:-2px;margin:12px 0}.gradient{background:linear-gradient(100deg,#2eb454,#ecae2f,#ef3f55,#8b28a4,#287dcc);color:transparent;background-clip:text}.page-hero p{max-width:780px;color:var(--muted);font-size:16px}.section{padding:75px 0}.section-title{font-size:clamp(28px,3.4vw,38px);letter-spacing:-1px;margin:0 0 12px}.section-description{color:var(--muted);margin:0 0 30px}.courses-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}.course-card{display:flex;flex-direction:column;background:#fff;border:1px solid #e4eaf2;border-radius:22px;overflow:hidden;box-shadow:0 12px 28px #192c4810;transition:.2s}.course-card:hover{transform:translateY(-4px);box-shadow:0 18px 35px #192c4820}.course-img{height:168px;object-fit:cover;width:100%;background:#eaf1f8}.course-content{padding:20px;display:flex;flex-direction:column;flex:1}.category{font-size:10px;text-transform:uppercase;letter-spacing:1px;font-weight:850;color:#fff;border-radius:20px;padding:5px 10px;display:inline-block;align-self:flex-start;background:var(--accent)}.course-card h3{font-size:17px;line-height:1.35;margin:13px 0;min-height:64px}.course-card p{font-size:12px;color:var(--muted);margin:0;flex:1}.course-time{font-size:12px;font-weight:800;margin-top:15px;color:#34465d}.actions{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:20px}
.actions button{position:relative;isolation:isolate;overflow:hidden;border-radius:16px;font-size:13px;font-weight:900;letter-spacing:.1px;padding:14px 16px;min-height:48px;cursor:pointer;transition:transform .22s ease,box-shadow .22s ease,border-color .22s ease,background .22s ease,color .22s ease;box-shadow:0 10px 22px rgba(17,24,39,.07)}
.actions button::before{content:"";position:absolute;inset:1px;border-radius:15px;background:linear-gradient(180deg,rgba(255,255,255,.34),rgba(255,255,255,0));pointer-events:none;z-index:-1}
.actions button::after{content:"";position:absolute;top:-20%;bottom:-20%;left:-120%;width:58%;transform:skewX(-24deg);background:linear-gradient(90deg,transparent,rgba(255,255,255,.42),transparent);transition:left .65s ease;pointer-events:none}
.actions button:hover::after{left:150%}
.actions button:hover{transform:translateY(-3px);box-shadow:0 16px 30px rgba(17,24,39,.12)}
.actions button:active{transform:translateY(-1px) scale(.99)}
.actions button:focus-visible{outline:2px solid rgba(38,132,217,.55);outline-offset:3px}
.actions .ask{background:linear-gradient(110deg,#2c7fe6 0%,#4968e8 34%,#8b28a4 68%,#d3347d 100%);background-size:180% 180%;color:#fff;border:0;box-shadow:0 14px 26px rgba(94,70,201,.28);animation:buttonGlow 5.4s ease-in-out infinite}
.actions .ask:hover{box-shadow:0 18px 34px rgba(94,70,201,.36)}
.actions button:not(.ask){background:linear-gradient(180deg,#ffffff 0%,#f7fbff 100%);border:1px solid #d8e5f3;color:#215b99;box-shadow:0 10px 22px rgba(38,132,217,.08)}
.actions button:not(.ask):hover{border-color:#bcd3eb;background:linear-gradient(180deg,#ffffff 0%,#eef6ff 100%);color:#174a82}
.actions button:not(.ask)::before{background:linear-gradient(180deg,rgba(255,255,255,.85),rgba(255,255,255,.18))}
@keyframes buttonGlow{0%,100%{background-position:0% 50%}50%{background-position:100% 50%}}
.filters{display:flex;gap:8px;flex-wrap:wrap;margin:0 0 28px}.filters button{border:1px solid #dfe6ee;background:#fff;border-radius:100px;padding:8px 14px;color:#405268;font-size:12px;font-weight:750}.filters button.active{background:#253951;color:#fff;border-color:#253951}.course-card[hidden]{display:none}.modal{display:none;position:fixed;inset:0;z-index:100;background:#101b2dba;padding:18px;align-items:center;justify-content:center}.modal.show{display:flex}.dialog{width:min(620px,100%);max-height:90vh;overflow:auto;border-radius:22px;background:#fff;padding:27px;position:relative}.dialog h2{font-size:25px;line-height:1.24;margin:0 36px 10px 0}.close{position:absolute;right:18px;top:15px;background:#edf3f9;border:0;border-radius:50%;font-size:23px;width:36px;height:36px}.dialog p{color:var(--muted)}.modules{padding-left:20px}.modules li{padding:5px 0}.details-img{width:100%;height:190px;object-fit:cover;border-radius:13px;margin-bottom:14px}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}.field{display:flex;flex-direction:column;gap:6px;font-size:12px;font-weight:750}.field.full{grid-column:1/-1}.field input,.field select,.field textarea{border:1px solid #dbe2eb;border-radius:10px;padding:12px;width:100%;background:#fff}.form-note{font-size:12px;color:var(--muted);margin-top:12px}.contact-grid{display:grid;grid-template-columns:1fr 1fr;gap:22px}.contact-card{padding:27px;border:1px solid var(--line);border-radius:22px;box-shadow:0 14px 26px #172c4910}.contact-card h3{margin-top:0;font-size:22px}.contact-card p{color:#526177}.contact-card a{color:#2272b6;font-weight:750}.map{width:100%;height:310px;border:0;border-radius:16px;background:#e8edf2;margin-top:15px}.split{display:grid;grid-template-columns:1fr 1fr;gap:24px}.foot{padding:45px 0 20px;background:#142133;color:#cbd5e1;margin-top:35px}.foot .wrap{display:flex;justify-content:space-between;gap:30px;flex-wrap:wrap}.foot a{color:#deebfc}.foot small{color:#9caac1}.info-banner{padding:18px 22px;border-radius:18px;background:#f1f7ff;border:1px solid #dcebf9;color:#3d5670;margin-top:30px}.note{font-size:12px;color:#6b7789}.hide{display:none!important}@media(max-width:1000px){.courses-grid{grid-template-columns:repeat(2,1fr)}.nav-menu{gap:12px}.identity b{font-size:16px}.actions{gap:10px}.actions button{padding:13px 14px}}@media(max-width:750px){.nav-inner{min-height:72px}.menu-toggle{display:block}.nav-menu{display:none;position:absolute;top:100%;left:10px;right:10px;padding:15px;border:1px solid var(--line);border-radius:15px;background:#fff;box-shadow:0 12px 25px #20344b22;flex-direction:column;align-items:stretch}.nav-menu.open{display:flex}.courses-grid,.contact-grid,.split,.form-grid{grid-template-columns:1fr}.field.full{grid-column:auto}.page-hero{padding:52px 0}.section{padding:55px 0}}@media(max-width:500px){.courses-grid{grid-template-columns:1fr}.identity b{font-size:14px}.identity small{font-size:8px}.identity img{width:49px;height:49px}.dialog{padding:19px}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;animation:none!important;transition:none!important}}


.ra-nav-five{gap:11px!important}.ra-nav-five a{font-size:11px!important}@media(max-width:1150px){.nav-inner{flex-wrap:wrap;padding:12px 0}.ra-nav-five{width:100%;justify-content:center}.ra-nav-five a{font-size:12px!important}}
.course-meta{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:16px}
.course-meta .course-time,.course-meta .course-fee{min-width:0;margin:0;padding:11px 12px;border-radius:14px;border:1px solid #e1eaf4;background:linear-gradient(180deg,#ffffff,#f4f8ff);display:flex;flex-direction:column;gap:5px;box-shadow:0 5px 12px #19324f09}
.course-meta .course-fee{background:linear-gradient(135deg,#f4effe,#f5faff);border-color:#e6ddf6}
.course-meta span{font-size:10px;letter-spacing:.2px;color:#64748b;font-weight:750}
.course-meta strong{font-size:14px;line-height:1.25;color:#233751;font-weight:900;white-space:nowrap}
.course-meta .course-fee strong{color:#7934a0}
@media(max-width:410px){.course-meta{gap:7px}.course-meta .course-time,.course-meta .course-fee{padding:9px}.course-meta strong{font-size:12px}}


/* Shared five-page premium motion system */
:root{--ra-ink:#172338;--ra-blue:#287dcc;--ra-green:#28b86b;--ra-purple:#8235b7;--ra-yellow:#f5ae2d}
html{scroll-padding-top:100px}body{overflow-x:hidden}
.rainbow,.top-ribbon,.mini{background-size:250% 100%!important;animation:raStripe 10s linear infinite}
@keyframes raStripe{0%{background-position:0 0}100%{background-position:250% 0}}
@keyframes raRise{0%{opacity:0;transform:translate3d(0,26px,0)}100%{opacity:1;transform:translate3d(0,0,0)}}
@keyframes raFloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-11px)}}
@keyframes raGlow{0%,100%{opacity:.55;transform:scale(1)}50%{opacity:.9;transform:scale(1.11)}}
@keyframes raShift{0%,100%{background-position:0 50%}50%{background-position:100% 50%}}
@keyframes raSweep{0%{transform:translateX(-200%) skewX(-22deg)}100%{transform:translateX(380%) skewX(-22deg)}}
.ra-reveal{opacity:0;transform:translateY(25px);transition:opacity .8s ease,transform .8s ease;transition-delay:var(--ra-delay,0ms)}
.ra-reveal.ra-visible{opacity:1;transform:none}
.ra-banner{position:relative;overflow:hidden;isolation:isolate;background:radial-gradient(circle at 90% 20%,#eaf2ff,transparent 35%),radial-gradient(circle at 10% 88%,#e4fbf0,transparent 31%),linear-gradient(145deg,#fff,#f6f9ff);padding:104px 0 94px}
.ra-banner::before,.ra-banner::after{content:"";position:absolute;z-index:-1;width:400px;height:400px;border-radius:100%;background:radial-gradient(circle,rgba(52,133,225,.13),transparent 68%);animation:raGlow 10s ease-in-out infinite}
.ra-banner::before{right:-140px;top:-100px}.ra-banner::after{left:-150px;bottom:-180px;background:radial-gradient(circle,rgba(43,179,106,.13),transparent 68%);animation-delay:-5s}
.ra-banner-grid{display:grid;grid-template-columns:1fr .92fr;gap:66px;align-items:center;position:relative;z-index:2}
.ra-overline{display:inline-flex;align-items:center;gap:9px;border:1px solid #e3eaf4;border-radius:30px;padding:9px 14px;background:#ffffffc9;box-shadow:0 8px 22px #19365a0d;text-transform:uppercase;font-size:11px;font-weight:850;letter-spacing:1.6px;color:#426082}
.ra-overline:before{content:"";width:9px;height:9px;border-radius:100%;background:#2eb454;box-shadow:0 0 0 6px #2eb45416}
.ra-banner h1{font-size:clamp(41px,5.4vw,70px);line-height:1.075;letter-spacing:-2.7px;margin:19px 0 17px;color:#172338}
.ra-rainbow-text{background:linear-gradient(100deg,#1faf72,#f2ae2b,#e83c66,#8637b8,#287dcc);background-size:250% 250%;color:transparent;background-clip:text;-webkit-background-clip:text;animation:raShift 9s ease-in-out infinite}
.ra-banner p{color:#62758d;font-size:15px;line-height:1.9;max-width:650px}
.ra-action-row{display:flex;flex-wrap:wrap;gap:11px;margin-top:26px}
.ra-primary{position:relative;overflow:hidden;background:linear-gradient(120deg,#287dcc,#7844b6);border:0;color:white;border-radius:12px;padding:13px 20px;font-weight:800;text-decoration:none;display:inline-flex;align-items:center;justify-content:center;gap:9px;box-shadow:0 14px 25px #297bcd2c;transition:transform .25s,box-shadow .25s}
.ra-primary:hover{transform:translateY(-4px);box-shadow:0 20px 35px #287dcc45}
.ra-secondary{display:inline-flex;align-items:center;justify-content:center;border:1px solid #dae3ef;background:#fff;padding:13px 20px;border-radius:12px;font-weight:800;color:#244061;text-decoration:none;transition:.2s}.ra-secondary:hover{transform:translateY(-3px);border-color:#8abbe9}
.ra-visual{position:relative;background:linear-gradient(155deg,#fff,#f5f8fd);border:1px solid #e8eef4;border-radius:34px;padding:26px;box-shadow:0 30px 70px #1b365827;min-height:370px;animation:raFloat 9s ease-in-out infinite}
.ra-visual::before{content:"";position:absolute;inset:-8px;border-radius:42px;border:1px solid #d9eaf846;pointer-events:none}
.ra-visual h3{margin:0 0 15px;font-size:19px}.ra-visual-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.ra-tile{padding:20px;border-radius:20px;background:white;border:1px solid #e6edf4;box-shadow:0 10px 26px #18375b0c;min-height:112px;transition:.25s}
.ra-tile:hover{transform:translateY(-6px);box-shadow:0 20px 35px #18375b1b}
.ra-tile b{display:block;font-size:15px;margin:7px 0;color:#1a2d47}.ra-tile span{color:#61758c;font-size:12px}.ra-emoji{display:inline-grid;place-items:center;width:38px;height:38px;border-radius:11px;background:#ebf4ff;font-size:20px}
.ra-section{padding:86px 0}.ra-alt{background:#f8fafd}.ra-section-head{max-width:730px;margin:0 auto 38px;text-align:center}.ra-section-head h2{font-size:clamp(30px,3.5vw,45px);line-height:1.17;letter-spacing:-1.5px;margin:12px 0}.ra-section-head p{font-size:14px;color:#65758a;line-height:1.8}
.ra-service-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.ra-service{position:relative;overflow:hidden;padding:27px 24px;border-radius:22px;background:#fff;border:1px solid #e8edf3;box-shadow:0 12px 35px #17283f0a;transition:transform .3s,box-shadow .3s;min-height:215px}
.ra-service:before{content:"";position:absolute;top:0;left:0;right:0;height:4px;background:var(--accent,#277dcc)}
.ra-service:hover{transform:translateY(-8px);box-shadow:0 26px 48px #17283f1b}.ra-service .ra-emoji{background:#f1f6fc}
.ra-service h3{font-size:18px;color:#243249;margin:15px 0 9px}.ra-service p{color:#63748a;font-size:13px;line-height:1.75;margin:0}
.ra-process{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}.ra-step{padding:23px;border-radius:21px;border:1px solid #e4eaf2;background:#fff}.ra-step small{font-size:24px;font-weight:900;color:#287dcc}.ra-step h3{font-size:17px;margin:10px 0}.ra-step p{font-size:13px;color:#61758c;line-height:1.7;margin:0}
.ra-cta{padding:72px 0;background:linear-gradient(110deg,#17243a,#243f66);color:#fff}.ra-cta .wrap{display:flex;align-items:center;justify-content:space-between;gap:25px}.ra-cta h2{font-size:clamp(27px,3vw,39px);margin:0 0 8px}.ra-cta p{color:#cbd8e8;margin:0}
/* Animations for existing Training Academy / Contact */
.course-card,.course-card-home,.contact-card,.card,.mini-card{transition:transform .3s ease,box-shadow .3s ease!important}
.course-card:hover,.course-card-home:hover,.contact-card:hover,.card:hover{transform:translateY(-6px)!important;box-shadow:0 25px 52px #20395020!important}
.site-nav .nav-menu a,.navlinks button,header .links a{transition:color .2s,transform .2s}.site-nav .nav-menu a:hover,header .links a:hover{transform:translateY(-2px)}
.ra-nav-five{display:flex;gap:19px;align-items:center;justify-content:center;flex-wrap:wrap}.ra-nav-five a{font-weight:750;font-size:12px;color:#3d5068;white-space:nowrap;text-decoration:none;transition:color .2s,transform .2s}.ra-nav-five a:hover{color:#287dcc;transform:translateY(-2px)}.ra-nav-five .current{color:#287dcc}
.ra-nav-five .ra-nav-cta{color:#fff;background:#287dcc;border-radius:999px;padding:12px 16px}.ra-nav-five .ra-nav-cta:hover{color:#fff;background:#185da6}
@media(max-width:1050px){.ra-banner-grid{grid-template-columns:1fr;gap:44px}.ra-service-grid{grid-template-columns:repeat(2,1fr)}.ra-process{grid-template-columns:repeat(2,1fr)}.ra-nav-five{gap:11px}}
@media(max-width:740px){.ra-banner{padding:66px 0}.ra-visual{min-height:auto;animation:none}.ra-service-grid{grid-template-columns:1fr}.ra-process{grid-template-columns:1fr}.ra-cta .wrap{align-items:flex-start;flex-direction:column}.ra-nav-five{gap:12px;justify-content:flex-start;padding:15px 0}.ra-nav-five a{font-size:12px}.ra-banner h1{letter-spacing:-1.7px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;scroll-behavior:auto!important;transition-duration:.01ms!important}.ra-reveal{opacity:1;transform:none}}

/* Training Academy hero: animated training lab visual (from desing/Rainbow_Automation_Training.html) */
.training-hero-grid{display:grid;grid-template-columns:1fr .92fr;gap:56px;align-items:center}
.training-copy{min-width:0}
.training-visual{position:relative;background:linear-gradient(145deg,#ffffff,#f5f9ff);border:1px solid #e2ebf4;border-radius:42px;padding:20px;min-height:420px;box-shadow:0 30px 70px rgba(27,54,88,.12);overflow:hidden;isolation:isolate}
.training-visual::before{content:"";position:absolute;right:-70px;top:-70px;width:240px;height:240px;border-radius:50%;background:radial-gradient(circle,rgba(40,125,204,.12),transparent 68%);animation:trGlow 8s ease-in-out infinite}
.training-visual::after{content:"";position:absolute;left:-80px;bottom:-80px;width:230px;height:230px;border-radius:50%;background:radial-gradient(circle,rgba(46,180,84,.11),transparent 70%);animation:trGlow 8s ease-in-out infinite reverse}
.tr-head{display:flex;justify-content:flex-start;align-items:center;gap:12px;margin-bottom:14px;position:relative;z-index:2}
.tr-pill,.tr-pill-alt{display:inline-flex;align-items:center;gap:8px;padding:9px 14px;border-radius:999px;border:1px solid #e3eaf4;background:rgba(255,255,255,.9);font-size:11px;font-weight:900;letter-spacing:.4px;color:#46617f;box-shadow:0 8px 20px rgba(17,24,39,.05)}
.tr-pill::before{content:"";width:9px;height:9px;border-radius:50%;background:#2eb454;box-shadow:0 0 0 6px rgba(46,180,84,.12)}
.tr-pill-alt{background:linear-gradient(135deg,#eef7ff,#f7f0ff);color:#546a86}
.tr-stage{position:relative;height:270px;border-radius:30px;border:1px solid #e0eaf3;background:linear-gradient(180deg,#f3f8ff 0%,#f8fbff 55%,#eef5fb 100%);overflow:hidden;box-shadow:inset 0 1px 0 rgba(255,255,255,.9)}
.tr-stage::before{content:"";position:absolute;inset:0;background-image:linear-gradient(rgba(40,125,204,.08) 1px,transparent 1px),linear-gradient(90deg,rgba(40,125,204,.08) 1px,transparent 1px);background-size:24px 24px;mask-image:linear-gradient(180deg,rgba(0,0,0,.55),transparent 90%)}
.tr-floor{position:absolute;left:20px;right:20px;bottom:22px;height:14px;border-radius:999px;background:linear-gradient(180deg,#d3e0eb,#b6c8d9)}
.tr-hmi,.tr-vfd,.tr-cloud{position:absolute;background:rgba(255,255,255,.92);border:1px solid #e0e9f2;border-radius:20px;box-shadow:0 14px 30px rgba(27,54,88,.08);padding:12px;z-index:2}
.tr-hmi{left:16px;top:16px;width:150px}.tr-vfd{right:16px;top:18px;width:122px}.tr-cloud{right:18px;bottom:18px;width:128px}
.tr-mini-title{display:block;font-size:10px;font-weight:900;letter-spacing:1px;text-transform:uppercase;color:#60778f;margin-bottom:10px}
.tr-screen{height:52px;border-radius:14px;background:linear-gradient(180deg,#112a45,#173f66);position:relative;overflow:hidden}.tr-screen::before{content:"";position:absolute;inset:0;background-image:linear-gradient(rgba(255,255,255,.07) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.07) 1px,transparent 1px);background-size:15px 15px}.tr-screen svg{position:absolute;inset:8px}.tr-screen polyline{fill:none;stroke:#6bc6ff;stroke-width:3;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:84;stroke-dashoffset:84;animation:trLine 4s linear infinite}
.tr-hmi-tags{display:flex;gap:6px;flex-wrap:wrap;margin-top:9px}.tr-hmi-tags i,.tr-cloud-tags i{font-style:normal;display:inline-flex;align-items:center;justify-content:center;padding:4px 8px;border-radius:999px;background:#eef4fb;border:1px solid #d9e5f1;font-size:9px;font-weight:800;color:#64788e}
.tr-vfd-display{height:60px;border-radius:14px;background:linear-gradient(180deg,#132842,#1f4b7a);display:grid;place-items:center;color:#8fe3a9;font-size:24px;font-weight:900;letter-spacing:.3px;box-shadow:inset 0 0 0 1px rgba(255,255,255,.08)}
.tr-vfd-note{margin-top:8px;font-size:11px;font-weight:800;color:#60778f;text-align:center}
.tr-cloud-tags{display:flex;gap:6px;flex-wrap:wrap}.tr-cloud-note{margin-top:8px;font-size:11px;color:#64778c;line-height:1.45}
.tr-robot{position:absolute;left:180px;top:58px;width:180px;height:140px;z-index:2}.tr-arm-base{position:absolute;left:30px;bottom:12px;width:78px;height:18px;border-radius:999px;background:linear-gradient(180deg,#2f84df,#19589e);box-shadow:0 12px 24px rgba(40,125,204,.2)}
.tr-joint{position:absolute;border-radius:50%;background:radial-gradient(circle at 35% 35%,#ffffff,#d5e2ef 55%,#96aec5 100%);border:3px solid #8da8c2;box-shadow:0 8px 18px rgba(27,54,88,.12)}
.tr-j1{left:58px;bottom:24px;width:28px;height:28px}.tr-j2{left:92px;bottom:66px;width:26px;height:26px}.tr-j3{left:132px;bottom:88px;width:24px;height:24px}.tr-link1,.tr-link2,.tr-link3{position:absolute;height:14px;border-radius:999px;background:linear-gradient(180deg,#7cbcff,#2f84df);transform-origin:12px 50%;box-shadow:inset 0 -5px 8px rgba(0,0,0,.1)}
.tr-link1{left:70px;bottom:54px;width:62px;transform:rotate(-48deg);animation:trLink1 3.8s ease-in-out infinite}
.tr-link2{left:104px;bottom:84px;width:54px;transform:rotate(18deg);animation:trLink2 3.8s ease-in-out infinite}
.tr-link3{left:145px;bottom:86px;width:42px;transform:rotate(-26deg);animation:trLink3 3.8s ease-in-out infinite}
.tr-gripper{position:absolute;left:175px;bottom:78px;width:18px;height:28px;border-radius:10px;background:linear-gradient(180deg,#eaf1f8,#d2e0ee);border:1px solid #c7d7e5;transform:rotate(16deg);animation:trGrip 3.8s ease-in-out infinite}
.tr-gripper::before,.tr-gripper::after{content:"";position:absolute;bottom:-10px;width:4px;height:12px;border-radius:3px;background:#8aa2b9}.tr-gripper::before{left:3px;transform:rotate(12deg)}.tr-gripper::after{right:3px;transform:rotate(-12deg)}
.tr-cube{position:absolute;left:196px;bottom:54px;width:30px;height:30px;border-radius:8px;background:linear-gradient(145deg,#4fd6a6,#27b992);box-shadow:0 12px 18px rgba(39,185,146,.18);animation:trCube 3.8s ease-in-out infinite}
.tr-monitor{position:absolute;left:250px;bottom:20px;width:86px;height:58px;border-radius:16px;background:#fff;border:1px solid #dfe9f3;box-shadow:0 12px 22px rgba(27,54,88,.08);padding:9px;z-index:2}.tr-monitor-screen{height:30px;border-radius:10px;background:linear-gradient(180deg,#112a45,#173f66);position:relative;overflow:hidden}.tr-monitor-screen::before{content:"";position:absolute;left:10px;right:10px;bottom:7px;height:3px;border-radius:999px;background:linear-gradient(90deg,#28b86b,#6bc6ff,#f5ae2d)}.tr-monitor-screen::after{content:"";position:absolute;left:12px;top:8px;width:40px;height:14px;border-left:3px solid #6bc6ff;border-bottom:3px solid #6bc6ff;transform:skewX(-28deg)}
.tr-monitor-label{display:flex;justify-content:center;gap:6px;margin-top:8px}.tr-monitor-label span{width:8px;height:8px;border-radius:50%}.tr-monitor-label span:nth-child(1){background:#28b86b}.tr-monitor-label span:nth-child(2){background:#f5ae2d}.tr-monitor-label span:nth-child(3){background:#ef4a63}
.tr-cnc{position:absolute;left:18px;bottom:18px;width:124px;height:74px;border-radius:18px;background:rgba(255,255,255,.95);border:1px solid #dde7f1;box-shadow:0 12px 22px rgba(27,54,88,.06);padding:12px;z-index:2}.tr-cnc .wheel{position:absolute;right:12px;top:22px;width:26px;height:26px;border-radius:50%;background:radial-gradient(circle at 35% 35%,#ffffff,#dbe6ef 42%,#95abc0 72%,#6d8398 100%);border:2px solid #b7c9d8;animation:trSpin 1.2s linear infinite}.tr-cnc .wheel::before,.tr-cnc .wheel::after{content:"";position:absolute;left:50%;top:50%;width:3px;height:10px;margin-left:-1.5px;margin-top:-5px;border-radius:999px;background:#69839c}.tr-cnc .wheel::after{transform:rotate(90deg)}
.tr-cnc .rail{position:absolute;left:12px;right:44px;bottom:16px;height:10px;border-radius:999px;background:linear-gradient(180deg,#d0dde8,#b0c1d2)}.tr-cnc .head{position:absolute;left:48px;top:24px;width:24px;height:22px;border-radius:8px;background:linear-gradient(180deg,#2f84df,#19589e);animation:trHead 3.2s ease-in-out infinite}
.tr-course-strip{display:grid;grid-template-columns:repeat(6,1fr);gap:10px;margin-top:14px;position:relative;z-index:2}.tr-course-chip{display:flex;align-items:center;justify-content:center;min-height:58px;padding:10px;border-radius:16px;background:#fff;border:1px solid #e2eaf3;box-shadow:0 10px 24px rgba(27,54,88,.05);text-align:center;font-size:11px;font-weight:900;color:#26405d;line-height:1.3}
.tr-course-chip small{display:block;font-size:9px;font-weight:800;color:#6c7f94;margin-top:2px}
@keyframes trGlow{0%,100%{transform:scale(1);opacity:.7}50%{transform:scale(1.08);opacity:1}}
@keyframes trLine{0%{stroke-dashoffset:84}45%,100%{stroke-dashoffset:0}}
@keyframes trSpin{to{transform:rotate(360deg)}}
@keyframes trLink1{0%,100%{transform:rotate(-48deg)}50%{transform:rotate(-34deg)}}
@keyframes trLink2{0%,100%{transform:rotate(18deg)}50%{transform:rotate(6deg)}}
@keyframes trLink3{0%,100%{transform:rotate(-26deg)}50%{transform:rotate(-8deg)}}
@keyframes trGrip{0%,100%{transform:rotate(16deg) translateY(0)}50%{transform:rotate(4deg) translateY(-10px)}}
@keyframes trCube{0%,100%{transform:translate(0,0)}50%{transform:translate(6px,-14px)}}
@keyframes trHead{0%,100%{transform:translateX(0)}50%{transform:translateX(22px)}}
@media(max-width:980px){.training-hero-grid{grid-template-columns:1fr;gap:28px}.training-visual{min-height:auto}.tr-course-strip{grid-template-columns:repeat(3,1fr)}}
@media(max-width:620px){.training-visual{padding:16px;border-radius:28px}.tr-stage{height:300px}.tr-hmi{left:12px;top:12px;transform:scale(.92);transform-origin:left top}.tr-vfd{right:12px;top:14px;transform:scale(.92);transform-origin:right top}.tr-cloud{right:12px;bottom:12px;transform:scale(.92);transform-origin:right bottom}.tr-robot{left:126px;top:90px;transform:scale(.86);transform-origin:left top}.tr-monitor{left:184px;bottom:22px;transform:scale(.9);transform-origin:left bottom}.tr-cnc{left:12px;bottom:12px;transform:scale(.92);transform-origin:left bottom}.tr-course-strip{grid-template-columns:repeat(2,1fr)}}
