:root{--red:#c81e2b;--red-dark:#b51520;--ink:#17191d;--muted:#62666d;--line:#e5e6e8;--paper:#f7f7f5;--white:#fff;--radius:18px;--hero-gutter:24px;--hero-radius:28px;--font-size-xs:12px;--font-size-sm:13.5px;--font-size-base:15px;--font-size-md:16.5px;--font-size-lg:18px;--font-size-xl:24px;--font-size-2xl:32px;--font-size-3xl:44px;--radius-sm:8px;--radius-md:12px;--radius-lg:16px;--radius-xl:20px;--radius-full:999px}*{box-sizing:border-box}html{scroll-behavior:smooth}html,body{margin:0;padding:0}body{background:var(--paper);color:var(--ink);font-family:Arial,Helvetica,sans-serif;line-height:1.5;overflow-x:hidden}a{color:inherit;text-decoration:none}button,input{font:inherit}.skip-link{position:absolute;left:10px;top:-50px;background:var(--ink);color:#fff;padding:10px;z-index:100}.skip-link:focus{top:10px}.nav{height:68px;position:sticky;top:0;z-index:20;display:flex;align-items:center;gap:30px;padding:0 max(20px,calc((100vw - 1240px)/2));background:#fffffff2;border-bottom:1px solid var(--line);backdrop-filter:blur(10px)}.logo{display:flex;width:138px;flex:0 0 138px;align-items:center}.logo img{display:block;width:100%;height:auto;max-height:46px;object-fit:contain}.nav-links{display:flex;align-items:center;gap:25px;flex:1;font-size:14px;font-weight:700}.nav-links>a:hover,.nav-links button:hover{color:var(--red)}.nav-dropdown>button,.nav-links>a[href="#projects"]{font-family:Arial,Helvetica,sans-serif;font-size:14px;font-weight:800;letter-spacing:-.2px}.nav-links button{border:0;background:transparent;cursor:pointer;font-weight:700;color:inherit;padding:23px 0}.nav-dropdown{position:relative}.nav-arrow{display:inline-block;width:7px;height:7px;border-right:1.5px solid currentColor;border-bottom:1.5px solid currentColor;transform:rotate(45deg) translateY(-2px);margin-left:7px}.nav-submenu{position:absolute;top:58px;left:-15px;width:220px;padding:8px;background:#fff;border:1px solid var(--line);border-radius:12px;box-shadow:0 14px 35px #17191d18;opacity:0;visibility:hidden;transform:translateY(-6px);transition:.18s}.nav-dropdown:hover .nav-submenu,.nav-dropdown:focus-within .nav-submenu,.nav-dropdown.is-open .nav-submenu{opacity:1;visibility:visible;transform:none}.nav-submenu a{display:block;padding:10px 12px;border-radius:8px;font-size:13px}.nav-submenu a:hover,.nav-submenu a:focus-visible{background:#fff1ef;color:var(--red)}.red-btn,.outline-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:12px 20px;border:1px solid var(--red);border-radius:12px;font-weight:700;cursor:pointer;transition:.2s}.red-btn{background:var(--red);color:#fff}.red-btn:hover{background:var(--red-dark);border-color:var(--red-dark)}.outline-btn{background:#fff;color:var(--red)}.outline-btn:hover{background:#fff1ef}.menu{display:none;border:0;background:transparent;padding:9px}.menu span{display:block;width:22px;height:2px;background:var(--ink);margin:4px}.hero{max-width:none;min-height:620px;margin:auto;padding:110px max(20px,calc((100vw - 1200px)/2));display:flex;align-items:center;position:relative;overflow:hidden;background:var(--ink)}.hero-copy{position:relative;z-index:1;max-width:620px;color:#fff}/* hero h1 overridden by role-hero */.hero-copy-text{max-width:510px;color:#e2e3e5;font-size:18px;line-height:1.6;margin:0 0 28px}.hero-actions{display:flex;gap:12px;flex-wrap:wrap}.hero-note{color:#d1d3d6;font-size:12px;margin:23px 0 0}.hero-media{position:absolute;inset:0;height:auto;overflow:hidden;background:#252525}.hero-media video{display:block;width:100%;height:100%;object-fit:cover}.hero-media:after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,#17191dcc 0%,#17191d99 44%,#17191d55 100%),linear-gradient(180deg,#17191d44,#17191d99)}.hero-media-label{position:absolute;z-index:1;bottom:25px;right:max(20px,calc((100vw - 1200px)/2));color:#fff}.hero-media-label strong,.hero-media-label span{display:block}.hero-media-label span{color:#ddd;font-size:13px;margin-top:3px}.proof{display:grid;grid-template-columns:repeat(4,1fr);max-width:1240px;margin:auto;padding:21px 20px;border-top:1px solid var(--line);border-bottom:1px solid var(--line);gap:20px}.proof div{display:flex;flex-direction:column}.proof strong{font-size:17px}.proof span{font-size:12px;color:var(--muted)}.section{max-width:1240px;margin:auto;padding:92px 20px}.section-heading{max-width:700px;margin-bottom:36px}.section h2{font-size:clamp(30px,4vw,48px);letter-spacing:-2px;line-height:1.05;margin:0 0 12px}.section-heading>div>p:last-child,.body-copy{color:var(--muted);margin:0;max-width:650px}.program-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}.program-card{padding:26px 22px 23px;border:1px solid var(--line);border-radius:var(--radius);background:#fff;min-height:355px;display:flex;flex-direction:column}.program-icon{width:42px;height:42px;display:grid;place-items:center;border-radius:11px;font-size:22px;margin-bottom:25px;background:#fff0ee;color:var(--red)}.accent-gold .program-icon{background:#fff7df;color:#a56e00}.accent-purple .program-icon{background:#f1efff;color:#6554b8}.accent-blue .program-icon{background:#eaf7fb;color:#18758e}.card-kicker{color:var(--muted);font-size:11px;text-transform:uppercase;letter-spacing:1px;margin:0 0 8px}.program-card h3{font-size:23px;letter-spacing:-.8px;margin:0 0 10px}.program-card>p:not(.card-kicker){color:var(--muted);font-size:14px;margin:0 0 17px}.program-card ul{padding:0;margin:auto 0 20px;list-style:none;color:var(--muted);font-size:12px}.program-card li{display:inline-block;margin-right:9px}.program-card li:before{content:"•";color:var(--red);margin-right:4px}.program-card>a,.text-link{color:var(--red);font-size:13px;font-weight:800}.split-section{display:grid;grid-template-columns:1fr 1fr;gap:100px;align-items:start;background:#fff;max-width:none;padding-left:max(20px,calc((100vw - 1200px)/2));padding-right:max(20px,calc((100vw - 1200px)/2))}.split-section h2{max-width:530px}.body-copy{line-height:1.7;margin:22px 0 28px}.project-list{border-top:1px solid var(--line)}.project-list div{display:grid;grid-template-columns:45px 1fr;gap:8px;padding:18px 0;border-bottom:1px solid var(--line)}.project-list span{color:var(--red);font-size:12px}.project-list strong{font-size:16px}.project-list small{grid-column:2;color:var(--muted);font-size:12px}.dark-section{max-width:none;background:var(--ink);color:#fff;padding-left:max(20px,calc((100vw - 1200px)/2));padding-right:max(20px,calc((100vw - 1200px)/2))}.dark-section .section-heading>div>p:last-child{color:#b7bac0}.journey{display:grid;grid-template-columns:repeat(5,1fr);gap:1px;background:#ffffff26}.journey div{min-height:150px;padding:20px;background:var(--ink);display:flex;flex-direction:column}.journey b{color:#ff958b;font-size:12px}.journey strong{font-size:19px;margin-top:auto}.journey span{color:#b7bac0;font-size:12px}.resource-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}.resource-grid a{padding:24px;border:1px solid var(--line);background:#fff;border-radius:14px}.resource-grid span{color:var(--red);font-size:12px}.resource-grid strong,.resource-grid small{display:block}.resource-grid strong{font-size:18px;margin:24px 0 8px}.resource-grid small{color:var(--muted);font-size:13px}.cta{max-width:1200px;margin:0 auto 92px;padding:40px 48px;border-radius:20px;background:var(--red);color:#fff;display:flex;justify-content:space-between;align-items:center;gap:20px}.cta .eyebrow{color:#ffd4d0}.cta h2{font-size:32px;letter-spacing:-1px;margin:0 0 8px}.cta p:last-child{color:#ffdedb;margin:0}.cta .outline-btn{border-color:#fff}.footer-top{max-width:1240px;margin:auto;display:grid;grid-template-columns:2fr repeat(3,1fr);gap:40px;padding:65px 20px 45px}footer{background:var(--ink);color:#fff}.footer-brand{max-width:280px}.footer-brand .logo{margin-bottom:16px}.footer-brand p,.footer-col a{color:#a6a8ad;font-size:13px}.footer-col h4{font-size:13px;margin:0 0 17px}.footer-col a{display:block;margin-bottom:10px}.footer-bottom{max-width:1240px;margin:auto;border-top:1px solid #34363a;padding:18px 20px 25px;color:#86898e;font-size:11px;display:flex;justify-content:space-between}.course-page{background:linear-gradient(135deg,#fff 0%,#fff8f6 55%,var(--paper) 100%)}.course-page .nav{position:relative}.course-hero{max-width:1160px;margin:auto;padding:90px 20px 80px;display:grid;grid-template-columns:1fr .8fr;gap:70px;align-items:center}.course-hero h1{font-size:clamp(44px,6vw,75px);line-height:1;letter-spacing:-4px;margin:0 0 20px}.course-hero h1 span{color:var(--red)}.course-hero-copy>p:not(.eyebrow){color:var(--muted);font-size:18px;line-height:1.6;max-width:560px}.course-back{display:inline-block;color:var(--red);font-weight:700;margin-top:16px}.course-page-art{min-height:350px;border-radius:25px;padding:32px;display:flex;align-items:flex-end;box-shadow:0 20px 50px #17191d14}.course-page-art.marketing{background:#f7b7ae}.course-page-art.data{background:#b7d9e7}.course-page-art.cyber{background:#c7c2f2}.course-page-art.ai{background:#f4d592}.course-page-art strong{font-size:clamp(30px,4vw,52px);line-height:1;letter-spacing:-2px}.course-details{background:#fff;padding:70px 20px}.course-details-inner{max-width:1160px;margin:auto;display:grid;grid-template-columns:repeat(3,1fr);gap:16px}.course-detail-card{padding:25px;border:1px solid var(--line);border-radius:15px}.course-detail-card h2{font-size:18px;margin:0 0 9px}.course-detail-card p{color:var(--muted);font-size:14px;margin:0}.course-page footer{margin-top:0}@media(max-width:900px){.nav{gap:18px}.nav-links{gap:15px;font-size:12px}.nav-cta{padding:10px 13px;font-size:12px}.hero{gap:35px}.program-grid{grid-template-columns:repeat(2,1fr)}.journey{grid-template-columns:repeat(3,1fr)}.journey div:nth-child(n+4){grid-column:span 1}.split-section{gap:45px}}@media(max-width:650px){.nav{height:62px;padding:0 18px;justify-content:space-between}.nav-links,.nav-cta{display:none}.menu{display:block}.nav.mobile-open{display:block;height:auto;padding-bottom:15px}.nav.mobile-open .logo{margin:14px 0}.nav.mobile-open .nav-links{display:block}.nav.mobile-open .nav-links>a,.nav.mobile-open .nav-links button{display:block;width:100%;text-align:left;padding:11px 0}.nav.mobile-open .nav-submenu{position:static;display:none;box-shadow:none;border:0;padding:3px 0 3px 12px;opacity:1;visibility:visible;transform:none;width:auto}.nav.mobile-open .nav-dropdown.is-open .nav-submenu{display:block}.nav.mobile-open .nav-dropdown{border-top:1px solid var(--line)}.hero{display:block;padding:58px 20px 55px}.hero h1{font-size:49px;letter-spacing:-2.5px}.hero-copy-text{font-size:16px}.hero-media{height:300px;margin-top:43px}.proof{grid-template-columns:repeat(2,1fr);padding:20px;gap:17px}.section{padding:64px 20px}.section-heading{margin-bottom:25px}.section h2{font-size:32px}.program-grid{grid-template-columns:1fr}.program-card{min-height:0}.split-section{display:block}.project-list{margin-top:40px}.journey{grid-template-columns:1fr 1fr}.journey div{min-height:125px}.resource-grid{grid-template-columns:1fr}.cta{display:block;margin:0 20px 64px;padding:30px 25px}.cta .outline-btn{margin-top:22px}.footer-top{grid-template-columns:1fr 1fr;padding:50px 20px 35px;gap:28px}.footer-brand{grid-column:1/-1}.footer-bottom{display:block;line-height:1.8}.footer-bottom span{display:block}.course-hero{display:block;padding:60px 20px}.course-page-art{min-height:270px;margin-top:40px}.course-details-inner{grid-template-columns:1fr}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;transition:none!important;animation:none!important}}
:focus-visible{outline:3px solid #ff8c80;outline-offset:3px}.hero-suggestions{display:flex;flex-wrap:wrap;gap:8px;margin-top:25px}.hero-suggestions a{padding:7px 11px;border:1px solid var(--line);border-radius:999px;background:#fff;color:#4b4e54;font-size:11px;font-weight:700}.hero-suggestions a:hover{border-color:var(--red);color:var(--red)}

.career-paths{background:#f0efec;padding:96px max(20px,calc((100vw - 1240px)/2));overflow:hidden}
.career-paths-heading{display:flex;justify-content:space-between;align-items:flex-end;gap:30px;margin-bottom:34px}
.career-paths-heading h2{font-size:clamp(32px,4vw,52px);letter-spacing:-2px;line-height:1.02;margin:0 0 12px}
.career-paths-heading>div>p:last-child{color:var(--muted);margin:0}
.career-controls{display:flex;gap:9px;flex:0 0 auto}
.career-control{border:1px solid #c8c7c3;background:transparent;color:var(--ink);padding:11px 15px;border-radius:8px;cursor:pointer;font-weight:700;transition:all .2s ease}
.career-control:hover{border-color:var(--red);color:var(--red);background:#fff}
.career-carousel{width:100%;position:relative}
.career-viewport{overflow:hidden;margin:0 -12px;padding:16px 12px 32px;touch-action:pan-y;box-sizing:border-box}
.career-track{display:flex;gap:22px;width:max-content;will-change:transform;cursor:grab;user-select:none}
.career-track.is-dragging{cursor:grabbing;transition:none!important}
.career-card{flex:0 0 auto;box-sizing:border-box;background:#fff;border:1px solid #d7d9dd;border-radius:18px;overflow:hidden;box-shadow:0 8px 24px rgba(23,25,29,.08);transition:transform .35s ease,box-shadow .35s ease,border-color .35s ease}
.career-card:hover{transform:translateY(-3px);box-shadow:0 12px 28px rgba(23,25,29,.12)}
.career-card.is-active{border-color:var(--red);transform:translateY(-5px);box-shadow:0 16px 36px rgba(23,25,29,.15)}
.career-card-visual{position:relative;overflow:hidden;background:var(--red);isolation:isolate;aspect-ratio:1.25 / 1;width:100%}
.career-card-visual img{display:block;width:100%;height:100%;object-fit:cover;object-position:top center;background:var(--red)}
.career-number,.career-stamp{display:none}
.career-card-body{min-height:165px;padding:22px 21px 20px;border-top:0}
.career-card-body .card-kicker{margin-bottom:8px}
.career-card-body h3{font-family:Georgia,"Times New Roman",serif;font-size:25px;line-height:1.05;letter-spacing:-1px;margin:0 0 14px}
.career-card-body a{display:inline-block;color:var(--red);font-size:12px;font-weight:800}
.career-salary{font-size:11px;color:var(--muted);margin:0 0 16px}
.career-salary span{color:#777;font-style:italic}
.career-footer{display:flex;justify-content:space-between;align-items:center;margin-top:6px}
.career-dots{display:flex;gap:7px}
.career-dot{width:8px;height:8px;padding:0;border:1px solid #999;border-radius:50%;background:transparent;cursor:pointer;transition:transform .2s ease,background-color .2s ease,border-color .2s ease}
.career-dot.is-active{background:var(--red);border-color:var(--red);transform:scale(1.25)}
.career-status{color:var(--muted);font-size:11px}
/* Refined card borders */
.program-card{border:1px solid #d7d9dd;border-radius:16px;box-shadow:0 8px 24px rgba(23,25,29,.04);transition:border-color .2s ease,box-shadow .2s ease,transform .2s ease}
.program-card:hover{border-color:var(--red);box-shadow:0 14px 30px rgba(23,25,29,.09);transform:translateY(-3px)}
.course-shell{max-width:1200px;margin:auto}.breadcrumbs{display:flex;gap:9px;align-items:center;padding:22px 20px 0;color:var(--muted);font-size:12px}.breadcrumbs a{color:var(--red);font-weight:700}.course-hero-system{max-width:none;margin:0;padding:74px 20px 78px;grid-template-columns:1.1fr .9fr;gap:70px}.course-hero-system .course-hero-copy{max-width:680px}.course-hero-system h1{max-width:720px}.course-hero-system h1 span{color:var(--red)}.course-hero-panel{min-height:380px;padding:32px;display:flex;flex-direction:column;justify-content:space-between;border-radius:22px;background:var(--ink);color:#fff;box-shadow:0 18px 44px #17191d1c}.course-hero-panel span{color:#ff9b91;font-size:12px;font-weight:800;letter-spacing:1.5px}.course-hero-panel strong{font-size:clamp(42px,6vw,72px);line-height:.95;letter-spacing:-4px}.course-meta{display:flex;flex-wrap:wrap;gap:9px;margin:28px 0}.course-meta span{display:flex;flex-direction:column;gap:3px;padding:11px 13px;border:1px solid var(--line);border-radius:10px;background:#fff;font-size:11px;color:var(--muted)}.course-meta b{color:var(--ink);font-size:10px;text-transform:uppercase;letter-spacing:.8px}.course-actions{display:flex;gap:10px;flex-wrap:wrap}.course-section{padding:82px 20px;border-top:1px solid var(--line)}.course-section h2{max-width:630px;font-size:clamp(30px,4vw,48px);letter-spacing:-2px;line-height:1.05;margin:0 0 16px}.course-overview,.course-skill-grid{display:grid;grid-template-columns:1fr 1.2fr;gap:80px;align-items:start}.course-overview>p,.course-two-col>div>p:not(.eyebrow),.course-skill-grid>div>p:not(.eyebrow){max-width:620px;color:var(--muted);font-size:18px;line-height:1.65;margin:0}.course-two-col{display:grid;grid-template-columns:1fr 1fr;gap:90px;background:#fff;max-width:none;padding-left:max(20px,calc((100vw - 1200px)/2));padding-right:max(20px,calc((100vw - 1200px)/2))}.course-outcomes ul{margin:0;padding:0;list-style:none;border-top:1px solid var(--line)}.course-outcomes li{padding:14px 0;border-bottom:1px solid var(--line);font-weight:700}.course-outcomes li:before{content:"✓";color:var(--red);margin-right:10px}.course-skill-grid{background:#f0efec;max-width:none;padding-left:max(20px,calc((100vw - 1200px)/2));padding-right:max(20px,calc((100vw - 1200px)/2))}.course-skill-grid>div>p{margin:0 0 20px;color:var(--muted);line-height:1.7}.tools-label{font-size:12px!important;text-transform:uppercase;letter-spacing:1px;font-weight:800;color:var(--red)!important;margin-bottom:7px!important}.course-skill-grid strong{font-size:18px;line-height:1.5}.curriculum-section{max-width:none;padding-left:max(20px,calc((100vw - 1200px)/2));padding-right:max(20px,calc((100vw - 1200px)/2))}.course-modules{max-width:900px;border-top:1px solid var(--line)}.course-module{border-bottom:1px solid var(--line)}.course-module summary{display:flex;gap:22px;align-items:center;padding:22px 38px 22px 0;cursor:pointer;list-style:none;position:relative}.course-module summary::-webkit-details-marker{display:none}.course-module summary:after{content:"+";position:absolute;right:5px;color:var(--red);font-size:22px}.course-module[open] summary:after{content:"−"}.course-module summary span{color:var(--red);font-size:11px;font-weight:800;letter-spacing:1px}.course-module summary strong{font-size:18px}.course-module>div{padding:0 0 22px 66px;color:var(--muted)}.course-module p{margin:0 0 7px}.course-module small{font-size:12px}.projects-section{display:grid;grid-template-columns:1fr 1fr;gap:90px;background:var(--ink);color:#fff;max-width:none;padding-left:max(20px,calc((100vw - 1200px)/2));padding-right:max(20px,calc((100vw - 1200px)/2))}.projects-section .eyebrow{color:#ff9b91}.projects-section p:not(.eyebrow){color:#b7bac0;max-width:560px;line-height:1.7}.course-project-list{border-top:1px solid #ffffff30}.course-project-list div{display:grid;grid-template-columns:40px 1fr;gap:12px;padding:21px 0;border-bottom:1px solid #ffffff30}.course-project-list span{color:#ff9b91;font-size:12px}.course-project-list strong{font-size:17px}.methodology-section{max-width:none;padding-left:max(20px,calc((100vw - 1200px)/2));padding-right:max(20px,calc((100vw - 1200px)/2))}.career-tags{display:flex;flex-wrap:wrap;gap:9px}.career-tags span{padding:9px 12px;border:1px solid var(--line);border-radius:999px;color:var(--red);font-size:12px;font-weight:700;background:#fff}.related-section{display:grid;grid-template-columns:1fr 1fr;gap:70px}.related-links{display:flex;flex-direction:column;border-top:1px solid var(--line)}.related-links a{padding:16px 0;border-bottom:1px solid var(--line);color:var(--red);font-weight:800}.related-links a span{float:right}.course-lead-cta{margin:0 20px 80px;padding:36px 42px;border-radius:18px;background:var(--red);color:#fff;display:flex;align-items:center;justify-content:space-between;gap:20px}.course-lead-cta .eyebrow{color:#ffd4d0}.course-lead-cta h2{margin:0;font-size:clamp(26px,4vw,40px);letter-spacing:-1px}.course-lead-cta .outline-btn{border-color:#fff}
@media(max-width:900px){.course-hero-system{grid-template-columns:1fr;gap:35px}.course-hero-panel{min-height:260px}.course-overview,.course-two-col,.course-skill-grid,.projects-section,.related-section{grid-template-columns:1fr;gap:35px}.course-shell{width:100%}}
@media(max-width:650px){.breadcrumbs{padding-top:16px;font-size:11px;overflow:hidden;white-space:nowrap}.course-hero-system{padding-top:52px;padding-bottom:55px}.course-hero-system h1{font-size:clamp(40px,12vw,60px);letter-spacing:-3px}.course-meta{display:grid;grid-template-columns:1fr 1fr}.course-section{padding-top:58px;padding-bottom:58px}.course-module summary{gap:12px;align-items:flex-start;flex-direction:column}.course-module>div{padding-left:0}.course-lead-cta{margin-bottom:55px;padding:28px 24px;display:block}.course-lead-cta .outline-btn{margin-top:22px}.course-page .nav-links{display:none}}
.category-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}.category-card{display:flex;min-height:205px;flex-direction:column;padding:22px;border:1px solid var(--line);border-radius:16px;background:#fff;transition:transform .2s ease,border-color .2s ease,box-shadow .2s ease}.category-card:hover{transform:translateY(-4px);border-color:var(--red);box-shadow:0 12px 26px #17191d12}.category-icon{display:grid;width:40px;height:40px;place-items:center;margin-bottom:24px;border-radius:11px;background:#fff0ee;color:var(--red);font-weight:800}.category-card strong{font-size:17px}.category-card>span:not(.category-icon){color:var(--muted);font-size:12px;line-height:1.5;margin-top:7px}.category-card b{margin-top:auto;color:var(--red);font-size:12px}.methodology-section{background:#fff;max-width:none;padding-left:max(20px,calc((100vw - 1200px)/2));padding-right:max(20px,calc((100vw - 1200px)/2))}.methodology-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:1px;background:var(--line)}.methodology-grid div{min-height:150px;padding:20px;background:#fff;display:flex;flex-direction:column}.methodology-grid b{color:var(--red);font-size:12px}.methodology-grid strong{font-size:21px;margin-top:auto}.methodology-grid span{color:var(--muted);font-size:12px}.faq-list{max-width:850px;border-top:1px solid var(--line)}.faq-list details{border-bottom:1px solid var(--line)}.faq-list summary{padding:20px 34px 20px 0;cursor:pointer;font-size:17px;font-weight:700;list-style:none;position:relative}.faq-list summary::-webkit-details-marker{display:none}.faq-list summary:after{content:"+";position:absolute;right:4px;color:var(--red);font-size:22px;font-weight:400}.faq-list details[open] summary:after{content:"−"}.faq-list details p{max-width:700px;margin:-5px 0 20px;color:var(--muted);font-size:14px}
.modal-open{overflow:hidden}.lead-modal{position:fixed;inset:0;z-index:99995;display:grid;place-items:center;padding:16px;visibility:hidden;opacity:0;transition:opacity .2s ease,visibility .2s ease}.lead-modal.is-open{visibility:visible;opacity:1}.lead-modal-backdrop{position:absolute;inset:0;background:#17191db3;backdrop-filter:blur(4px)}.lead-modal-dialog{position:relative;width:min(100%,380px);max-height:calc(100vh - 40px);overflow:auto;padding:22px 24px;border-radius:18px;background:#fff;box-shadow:0 20px 60px rgba(0,0,0,.28);border:1px solid rgba(255,255,255,.2)}.lead-modal-dialog .eyebrow{font-size:10px;margin-bottom:4px}.lead-modal-dialog h2{margin:0 0 6px;font-size:clamp(20px,3vw,24px);line-height:1.15;letter-spacing:-0.5px}.lead-modal-intro{margin:0 0 14px;color:var(--muted);font-size:12.5px;line-height:1.45}.lead-modal-close{position:absolute;top:12px;right:12px;width:30px;height:30px;border:0;border-radius:50%;background:#f2f3f5;color:var(--ink);font-size:20px;line-height:1;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:background .2s,color .2s}.lead-modal-close:hover{background:#e4e6ea;color:var(--red)}.lead-form{display:grid;gap:7px}.lead-form label{font-size:11px;font-weight:700;color:#333}.lead-form input{width:100%;padding:9px 11px;border:1px solid #d4d6db;border-radius:8px;background:#fff;font-size:13px;transition:border-color .2s}.lead-form input:focus{outline:none;border-color:var(--red);box-shadow:0 0 0 3px rgba(213,43,30,.15)}.lead-form .red-btn{margin-top:6px;padding:10px 16px;font-size:13px;border-radius:9px}.lead-modal-later{border:0;background:transparent;color:var(--muted);font-size:11.5px;cursor:pointer;padding:4px 0}.lead-form-status{min-height:18px;margin:2px 0 0;color:var(--muted);font-size:11.5px;text-align:center}.lead-form-status.is-success{display:block;color:#065f46;background:#d1fae5;border:1px solid #a7f3d0;padding:10px 12px;border-radius:8px;font-size:12.5px;font-weight:600;line-height:1.45;margin-top:8px;text-align:center}.lead-form-status.is-error{display:block;color:#991b1b;background:#fee2e2;border:1px solid #fca5a5;padding:8px 12px;border-radius:8px;font-size:12px;font-weight:600;margin-top:8px;text-align:center}
@media(max-width:900px){.category-grid{grid-template-columns:repeat(2,1fr)}.methodology-grid{grid-template-columns:repeat(3,1fr)}}
@media(max-width:650px){.category-grid{grid-template-columns:1fr}.methodology-grid{grid-template-columns:1fr 1fr}.nav-links{gap:16px}.nav-links>a:nth-last-child(-n+3){display:none}.hero{min-height:680px;padding-top:95px;padding-bottom:95px}.hero-media-label{display:none}.lead-modal-dialog{padding:20px 18px}.lead-modal-dialog .eyebrow{padding-right:26px}}


/* ==================================================
   EDNEX ACADEMY HERO & FLOATING NAVIGATION REDESIGN
   Premium Cinematic Hero — Matching Visual Reference (upGrad Style)
   ================================================== */
.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

/* ── Announcement Topbar ("Free Career Counselling") ── */
.topbar {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  height: 38px;
  background: #17191d;
  color: #f3f4f6;
  font-size: 13px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 16px;
  padding: 0 16px;
  z-index: 110;
  box-sizing: border-box;
  transition: transform 0.28s cubic-bezier(0.16, 1, 0.3, 1), opacity 0.24s ease;
  will-change: transform, opacity;
}
.topbar.is-hidden {
  transform: translateY(-100%);
  opacity: 0;
  pointer-events: none;
}
.topbar-text {
  color: #d1d5db;
  font-weight: 500;
  line-height: 1;
}
.topbar-highlight {
  color: #ffffff;
  font-weight: 800;
}
.topbar-cta {
  color: #ff5260;
  font-weight: 700;
  text-decoration: underline;
  text-underline-offset: 3px;
  white-space: nowrap;
  font-size: 12.5px;
  transition: color 0.15s ease;
}
.topbar-cta:hover {
  color: #ffffff;
}

/* ── Floating Premium Header — Docks to top: 0 on scroll ── */
.floating-header {
  position: fixed;
  top: 38px;
  left: 50%;
  width: min(1240px, calc(100% - 32px));
  transform: translateX(-50%);
  padding: 0 24px !important;
  height: 64px !important;
  box-sizing: border-box !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 20px !important;
  border: 1px solid rgba(0, 0, 0, 0.08) !important;
  border-radius: 999px !important;
  background: #ffffff !important;
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.08), 0 1px 3px rgba(0, 0, 0, 0.04) !important;
  z-index: 100 !important;
  margin: 0 !important;
  transition: top 0.28s cubic-bezier(0.16, 1, 0.3, 1), box-shadow 0.24s ease, border-radius 0.24s ease !important;
}
.floating-header.is-scrolled {
  top: 0 !important;
  border-top: none !important;
  box-shadow: 0 8px 30px rgba(0, 0, 0, 0.12), 0 2px 6px rgba(0, 0, 0, 0.05) !important;
}

/* Compact, Refined Typographic Logo — Strictly on ONE Horizontal Line, lowercase, equal font size */
.floating-header .logo,
.ednex-brand-logo {
  display: inline-flex !important;
  flex-direction: row !important;
  align-items: center !important;
  align-self: center !important;
  justify-content: flex-start !important;
  gap: 6px !important;
  height: auto !important;
  flex: 0 0 auto !important;
  width: auto !important;
  margin: 0 12px 0 0 !important;
  padding: 0 !important;
  text-decoration: none !important;
  line-height: 1 !important;
  white-space: nowrap !important;
}
.ednex-brand-logo .brand-text {
  font-family: 'Plus Jakarta Sans', Arial, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif !important;
  font-size: 22px !important;
  font-weight: 850 !important;
  letter-spacing: -0.5px !important;
  color: var(--red, #c81e2b) !important;
  line-height: 1 !important;
  margin: 0 !important;
  padding: 0 !important;
  display: inline-block !important;
  white-space: nowrap !important;
  text-transform: lowercase !important;
}
.ednex-brand-logo .brand-sub {
  font-family: 'Plus Jakarta Sans', Arial, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif !important;
  font-size: 22px !important;
  font-weight: 850 !important;
  letter-spacing: -0.4px !important;
  color: var(--red, #c81e2b) !important;
  text-transform: lowercase !important;
  margin: 0 !important;
  padding: 0 !important;
  line-height: 1 !important;
  display: inline-block !important;
  white-space: nowrap !important;
}

/* Navigation items like upGrad — unified horizontal center line */
.floating-header .nav-links {
  display: flex !important;
  align-items: center !important;
  gap: 20px !important;
  height: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  font-size: 13.5px !important;
  font-weight: 600 !important;
  color: #17191d !important;
}
.floating-header .nav-dropdown {
  display: inline-flex !important;
  align-items: center !important;
  height: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
}
.floating-header .nav-links > a,
.floating-header .nav-dropdown > button {
  color: #17191d !important;
  font-size: 13.5px !important;
  font-weight: 600 !important;
  font-family: 'Plus Jakarta Sans', Arial, -apple-system, BlinkMacSystemFont, sans-serif !important;
  letter-spacing: -0.1px !important;
  transition: color 0.15s ease !important;
  height: 64px !important;
  line-height: 64px !important;
  padding: 0 4px !important;
  margin: 0 !important;
  display: inline-flex !important;
  align-items: center !important;
  cursor: pointer !important;
  border: 0 !important;
  background: transparent !important;
  white-space: nowrap !important;
}
.floating-header .nav-links > a:hover,
.floating-header .nav-dropdown > button:hover {
  color: var(--red, #c81e2b) !important;
}

/* Subtle caret arrow for dropdowns */
.floating-header .nav-arrow {
  display: inline-block;
  width: 5px;
  height: 5px;
  border-right: 1.5px solid currentColor;
  border-bottom: 1.5px solid currentColor;
  transform: rotate(45deg) translateY(-2px);
  margin-left: 6px;
  opacity: 0.75;
}

/* Solid Red Pill CTA Button with Automatic Continuous Shining Effect */
.floating-header .nav-cta,
.nav-cta,
.red-btn.nav-cta {
  position: relative !important;
  overflow: hidden !important;
  isolation: isolate !important;
  -webkit-mask-image: -webkit-radial-gradient(white, black) !important;
  height: 40px !important;
  padding: 0 22px !important;
  font-size: 13.5px !important;
  font-weight: 700 !important;
  letter-spacing: -0.1px !important;
  border-radius: 999px !important;
  background: var(--red, #c81e2b) !important;
  color: #ffffff !important;
  border: none !important;
  box-shadow: 0 4px 14px rgba(248, 40, 54, 0.42), 0 0 0 0 rgba(248, 40, 54, 0.45) !important;
  white-space: nowrap !important;
  flex-shrink: 0 !important;
  text-decoration: none !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  transition: background 0.2s ease, transform 0.2s ease, box-shadow 0.2s ease !important;
  animation: navBtnPulseGlow 2.4s ease-in-out infinite !important;
}

/* Automatic breathing aura around the button */
@keyframes navBtnPulseGlow {
  0%, 100% {
    box-shadow: 0 4px 14px rgba(248, 40, 54, 0.4), 0 0 0 0 rgba(248, 40, 54, 0.5);
  }
  50% {
    box-shadow: 0 6px 22px rgba(248, 40, 54, 0.65), 0 0 0 6px rgba(248, 40, 54, 0);
  }
}

.floating-header .nav-cta:hover,
.nav-cta:hover,
.red-btn.nav-cta:hover {
  background: #d51924 !important;
  transform: translateY(-1.5px) !important;
  box-shadow: 0 6px 24px rgba(248, 40, 54, 0.65) !important;
}

.floating-header .nav-cta:active,
.nav-cta:active,
.red-btn.nav-cta:active {
  transform: translateY(0) scale(0.98) !important;
}

/* Automatic Continuous Sweeping Light Beam across button surface (No hover/click required) */
.floating-header .nav-cta::after,
.nav-cta::after,
.red-btn.nav-cta::after {
  content: "" !important;
  position: absolute !important;
  top: -60% !important;
  bottom: -60% !important;
  left: -80% !important;
  width: 60% !important;
  background: linear-gradient(
    105deg,
    rgba(255, 255, 255, 0) 0%,
    rgba(255, 255, 255, 0.2) 25%,
    rgba(255, 255, 255, 0.85) 50%,
    rgba(255, 255, 255, 0.95) 52%,
    rgba(255, 255, 255, 0.85) 54%,
    rgba(255, 255, 255, 0.2) 75%,
    rgba(255, 255, 255, 0) 100%
  ) !important;
  transform: rotate(25deg) !important;
  pointer-events: none !important;
  z-index: 5 !important;
  animation: autoNavShine 2.4s cubic-bezier(0.4, 0, 0.2, 1) infinite !important;
}

@keyframes autoNavShine {
  0% {
    left: -80%;
    opacity: 0;
  }
  8% {
    opacity: 1;
  }
  45% {
    left: 140%;
    opacity: 1;
  }
  50%, 100% {
    left: 140%;
    opacity: 0;
  }
}

.floating-header .nav-cta:hover::after,
.nav-cta:hover::after,
.red-btn.nav-cta:hover::after {
  animation: autoNavShineHover 1.4s cubic-bezier(0.4, 0, 0.2, 1) infinite !important;
}

@keyframes autoNavShineHover {
  0% {
    left: -80%;
    opacity: 0;
  }
  12% {
    opacity: 1;
  }
  55% {
    left: 140%;
    opacity: 1;
  }
  60%, 100% {
    left: 140%;
    opacity: 0;
  }
}

@media (prefers-reduced-motion: reduce) {
  .floating-header .nav-cta,
  .nav-cta,
  .red-btn.nav-cta {
    animation: none !important;
  }
  .floating-header .nav-cta::after,
  .nav-cta::after,
  .red-btn.nav-cta::after {
    animation: none !important;
    display: none !important;
  }
}

/* ── Hero Section — upGrad-style Hero Composition ── */
.role-hero {
  position: relative;
  width: 100%;
  min-height: max(660px, min(86svh, 750px));
  height: auto;
  margin: 0 0 28px 0;
  padding: 0;
  border-radius: 0 0 var(--hero-radius, 28px) var(--hero-radius, 28px);
  overflow: visible;
  background: #0d0f12;
  isolation: isolate;
}

/* Hero Background Video & Seamless Fallback */
.role-hero .hero-media,
.role-hero .hero-overlay {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  border-radius: 0 0 var(--hero-radius, 28px) var(--hero-radius, 28px);
  overflow: hidden;
}
.role-hero .hero-media {
  background: #0d0f12 url('hero-poster.webp') center 40% / cover no-repeat;
  z-index: 1;
  pointer-events: none;
  margin: 0;
}
/* Disable legacy dark overlay on hero-media */
.role-hero .hero-media:after,
.role-hero .hero-media::after {
  display: none !important;
  content: none !important;
}
.role-hero .hero-media video,
#hero-bg-video {
  position: absolute;
  inset: 0;
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  object-position: center 40% !important;
  transform: none !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  filter: brightness(1.02) contrast(1.02) !important;
  opacity: 1 !important;
  z-index: 1;
}

@media (max-width: 1024px) {
  .role-hero .hero-media video,
  #hero-bg-video {
    object-position: center 40% !important;
    transform: none !important;
  }
}

@media (max-width: 650px) {
  .role-hero .hero-media {
    background-position: 36% 38% !important;
  }
  .role-hero .hero-media video,
  #hero-bg-video {
    object-position: 36% 38% !important;
    transform: none !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  .role-hero .hero-media {
    background: #0d0f12 url('hero-poster.webp') center 42% / cover no-repeat;
  }
  .role-hero .hero-media video,
  #hero-bg-video {
    display: none !important;
    opacity: 0 !important;
    transition: none !important;
  }
}

/* Subtle Hero Video Toggle (Pause / Play Control) */
.hero-video-toggle {
  position: absolute;
  bottom: 20px;
  left: 24px;
  width: 34px;
  height: 34px;
  border-radius: 50%;
  background: rgba(13, 15, 18, 0.55);
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
  border: 1px solid rgba(255, 255, 255, 0.22);
  color: #ffffff;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  z-index: 5;
  transition: transform 0.15s ease, background 0.15s ease, border-color 0.15s ease;
  padding: 0;
  outline: none;
}
.hero-video-toggle:hover {
  background: rgba(13, 15, 18, 0.85);
  border-color: rgba(255, 255, 255, 0.45);
  transform: scale(1.06);
}
.hero-video-toggle:focus-visible {
  outline: 2px solid var(--red, #c81e2b);
  outline-offset: 2px;
}
@media (max-width: 650px) {
  .hero-video-toggle {
    bottom: 16px;
    left: 14px;
    width: 30px;
    height: 30px;
  }
}

/* Light, Natural Video Clarity (No Dark Veil) */
.hero-overlay {
  position: absolute;
  inset: 0;
  z-index: 2;
  background: linear-gradient(
    180deg,
    rgba(0, 0, 0, 0.35) 0%,
    rgba(0, 0, 0, 0.08) 20%,
    rgba(0, 0, 0, 0.0) 45%,
    rgba(0, 0, 0, 0.0) 70%,
    rgba(0, 0, 0, 0.35) 100%
  );
  pointer-events: none;
}

/* ── Hero Container & Copy ── */
.hero-container {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  z-index: 3;
  pointer-events: none;
  display: flex;
  flex-direction: column;
  overflow: visible;
}
.hero-copy {
  position: relative;
  width: 100%;
  flex: 1;
  display: flex;
  flex-direction: column;
  max-width: 1200px;
  margin: 0 auto;
  padding: clamp(96px, 13vh, 126px) 16px clamp(24px, 4vh, 36px);
  box-sizing: border-box;
  overflow: visible;
}

/* ═══════════════════════════════════════════════════
   TOP ANCHOR: HEADLINE BLOCK (Upper-Center Positioning)
   ═══════════════════════════════════════════════════ */
.hero-headline-block {
  position: static;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: flex-start;
  text-align: center;
  pointer-events: none;
  z-index: 4;
  padding: 24px 0;
  box-sizing: border-box;
}

.hero-title {
  width: 100%;
  max-width: 100%;
  margin: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 0;
  text-align: center;
}

/* Line 1: Static prefix "Get job-ready as" (Bold White Sans-Serif) */
.hero-title-prefix {
  display: block !important;
  width: 100% !important;
  text-align: center !important;
  font-family: 'Plus Jakarta Sans', Arial, -apple-system, BlinkMacSystemFont, sans-serif !important;
  font-style: normal !important;
  font-weight: 800 !important;
  color: #ffffff !important;
  font-size: clamp(32px, 4.2vw, 54px) !important;
  line-height: 1.12 !important;
  letter-spacing: -0.025em !important;
  text-shadow: 0 2px 14px rgba(0, 0, 0, 0.55), 0 1px 3px rgba(0, 0, 0, 0.70) !important;
  white-space: nowrap !important;
}

/* Line 2: Rotator frame & stacked rotator words (Bold Red Sans-Serif) */
.role-rotator-frame {
  display: block;
  position: relative;
  width: 100%;
  max-width: 100%;
  margin: 2px 0 0 0;
  padding: 0;
  text-align: center;
}

.role-rotator {
  position: relative;
  display: block;
  width: 100%;
  height: 1.25em;
  min-height: 1.25em;
  font-family: 'Plus Jakarta Sans', Arial, -apple-system, BlinkMacSystemFont, sans-serif !important;
  font-style: normal !important;
  font-weight: 800 !important;
  color: var(--red, #c81e2b) !important;
  font-size: clamp(32px, 4.2vw, 54px) !important;
  line-height: 1.12;
  letter-spacing: -0.025em;
  text-align: center;
}

.role-rotator-word {
  position: absolute !important;
  inset-inline: 0 !important;
  top: 0 !important;
  width: 100% !important;
  transition: opacity 0.35s ease, transform 0.35s ease;
  will-change: transform, opacity;
  opacity: 0;
  visibility: hidden;
  transform: translateY(4px);
  text-align: center;
  white-space: nowrap;
  pointer-events: none;
  font-family: 'Plus Jakarta Sans', Arial, -apple-system, BlinkMacSystemFont, sans-serif !important;
  font-style: normal !important;
  font-weight: 800 !important;
  color: var(--red, #c81e2b) !important;
  text-shadow: 0 2px 14px rgba(0, 0, 0, 0.45), 0 1px 3px rgba(0, 0, 0, 0.60) !important;
}

.role-rotator-word.is-active {
  opacity: 1 !important;
  visibility: visible !important;
  transform: translateY(0) !important;
}

/* Supporting sublines below headline: Refined Dark Translucent Capsule */
.hero-subline {
  margin-top: 14px;
  display: inline-flex;
  flex-direction: column;
  align-items: center;
  gap: 3px;
  text-align: center;
  background: rgba(18, 20, 26, 0.86);
  border: 1px solid rgba(255, 255, 255, 0.12);
  border-radius: 20px;
  padding: 10px 28px;
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.25);
  max-width: 620px;
}
.hero-subline-main {
  margin: 0;
  font-size: clamp(12.5px, 1.15vw, 14.5px);
  line-height: 1.45;
  font-weight: 500;
  color: #ffffff;
  text-shadow: none;
}
.hero-subline-emphasis {
  margin: 0;
  font-size: clamp(12.5px, 1.15vw, 14.5px);
  line-height: 1.45;
  font-weight: 500;
  color: #f1f5f9;
  text-shadow: none;
}
.highlight-lead {
  color: var(--red, #c81e2b);
  font-weight: 700;
}

/* ═══════════════════════════════════════════════════
   BOTTOM ANCHOR: SEARCH BAR + ROLE CHIPS GROUP
   ═══════════════════════════════════════════════════ */
.hero-bottom-group {
  position: relative;
  margin-top: auto;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 16px;
  padding: 0;
  pointer-events: auto;
  z-index: 40;
  box-sizing: border-box;
  width: 100%;
}

/* Reference Proportioned Search Bar: ~590px wide x 60px high on desktop */
.role-discovery {
  position: relative;
  width: 100%;
  max-width: 590px;
  margin: 0 auto;
  z-index: 80;
}

.role-search-box {
  position: relative;
  display: flex;
  align-items: center;
  width: 100%;
}

.role-search-icon {
  position: absolute;
  left: 20px;
  color: var(--red, #F21F2B);
  pointer-events: none;
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 2;
}
.role-search-icon svg {
  width: 20px;
  height: 20px;
}

.role-search {
  width: 100%;
  height: 60px;
  padding: 0 58px 0 54px;
  border: 1.5px solid rgba(255, 255, 255, 0.95);
  border-radius: 999px;
  background: #ffffff;
  color: var(--ink, #111827);
  font-family: 'Plus Jakarta Sans', Arial, sans-serif;
  font-size: 15px;
  font-weight: 500;
  box-shadow: 0 4px 22px rgba(0, 0, 0, 0.12), 0 1px 4px rgba(0, 0, 0, 0.05);
  outline: none;
  transition: box-shadow 0.22s ease, border-color 0.22s ease, background 0.22s ease;
  box-sizing: border-box;
}
.role-search::placeholder {
  color: #64748b;
  font-weight: 400;
}
.role-search:focus {
  border-color: var(--red, #F21F2B);
  background: #ffffff;
  box-shadow:
    0 0 0 3px rgba(242, 31, 43, 0.22),
    0 10px 28px rgba(0, 0, 0, 0.16);
}

.role-search-btn {
  position: absolute;
  right: 9px;
  top: 50%;
  transform: translateY(-50%);
  width: 42px;
  height: 42px;
  border: 0;
  border-radius: 50%;
  background: var(--red, #F21F2B);
  color: #ffffff;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  box-shadow: 0 2px 10px rgba(242, 31, 43, 0.40);
  transition: background 0.18s, transform 0.18s, box-shadow 0.18s;
  z-index: 2;
  padding: 0;
}
.role-search-btn svg {
  width: 18px;
  height: 18px;
}
.role-search-btn:hover,
.role-search-btn:focus-visible {
  background: #d51924;
  transform: translateY(-50%) scale(1.05);
  box-shadow: 0 4px 14px rgba(242, 31, 43, 0.55);
}

/* Options dropdown */
.role-options {
  position: absolute;
  top: calc(100% + 8px);
  bottom: auto;
  left: 0;
  right: 0;
  background: #ffffff;
  border: 1px solid rgba(0, 0, 0, 0.08);
  border-radius: 18px;
  box-shadow: 0 20px 48px rgba(0, 0, 0, 0.28), 0 4px 14px rgba(0, 0, 0, 0.10);
  padding: 8px;
  z-index: 1000;
  opacity: 0;
  visibility: hidden;
  transform: translateY(-6px);
  transition: opacity 0.2s cubic-bezier(0.16, 1, 0.3, 1),
              transform 0.2s cubic-bezier(0.16, 1, 0.3, 1),
              visibility 0.2s;
  max-height: min(280px, calc(100vh - 200px));
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
}
.role-options.is-open {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
}
.role-option {
  display: flex;
  justify-content: space-between;
  align-items: center;
  width: 100%;
  padding: 10px 14px;
  border: 0;
  border-radius: 10px;
  background: transparent;
  color: var(--ink, #111827);
  cursor: pointer;
  font-size: 13.5px;
  font-weight: 600;
  text-align: left;
  text-decoration: none;
  transition: background 0.15s ease, color 0.15s ease;
  box-sizing: border-box;
}
.role-option-title {
  color: inherit;
}
.role-option-program {
  font-size: 11.5px;
  font-weight: 500;
  color: var(--muted, #64748b);
  opacity: 0.85;
}
.role-option:hover,
.role-option:focus-visible,
.role-option.is-active-option {
  background: #fff1ef;
  color: var(--red, #c81e2b);
  outline: none;
}
.role-option:hover .role-option-program,
.role-option:focus-visible .role-option-program,
.role-option.is-active-option .role-option-program {
  color: var(--red, #c81e2b);
  opacity: 1;
}

.role-no-results {
  padding: 16px 14px;
  text-align: center;
  color: #4b5563;
  font-size: 13.5px;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 8px;
}
.role-no-results strong {
  color: var(--ink, #111827);
  word-break: break-all;
}
.role-no-results-btn {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  background: #fff1ef;
  color: var(--red, #c81e2b);
  border: 1px solid #ffd5da;
  border-radius: 999px;
  padding: 6px 14px;
  font-size: 12.5px;
  font-weight: 700;
  cursor: pointer;
  transition: background 0.18s, color 0.18s;
  outline: none;
}
.role-no-results-btn:hover {
  background: var(--red, #c81e2b);
  color: #ffffff;
}

/* Role Chips: Centered Horizontal Row under Search */
.role-chips-section {
  position: relative;
  z-index: 10;
  width: 100%;
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 8px;
  box-sizing: border-box;
}

.role-chips-marquee {
  width: 100%;
  display: block;
}

.role-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  align-items: center;
  justify-content: center;
  padding: 2px 0;
  width: 100%;
  box-sizing: border-box;
}

/* Hide cloned duplicate chips on desktop and large screens (>768px) */
.role-chip--clone {
  display: none !important;
}

.role-chip {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  height: 40px;
  padding: 0 18px;
  border: 1.5px solid var(--red, #c81e2b);
  border-radius: 999px;
  background: #ffffff;
  color: #17191d;
  font-family: 'Plus Jakarta Sans', Arial, -apple-system, sans-serif;
  font-size: 13.5px;
  font-weight: 600;
  cursor: pointer;
  text-decoration: none;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.06);
  transition: background-color 0.18s ease, border-color 0.18s ease, color 0.18s ease, box-shadow 0.18s ease, transform 0.15s ease;
  outline: none;
  white-space: nowrap;
  flex-shrink: 0;
  box-sizing: border-box;
  -webkit-tap-highlight-color: transparent;
}

.role-chip-icon {
  display: flex;
  align-items: center;
  justify-content: center;
  width: auto;
  height: auto;
  background: transparent;
  color: var(--red, #c81e2b);
  flex-shrink: 0;
  transition: color 0.18s ease;
}
.role-chip-icon svg {
  width: 15px;
  height: 15px;
}

.role-chip:hover {
  background: #fff8f8;
  border-color: var(--red, #c81e2b);
  color: var(--red, #c81e2b);
  box-shadow: 0 4px 14px rgba(248, 40, 54, 0.22);
  transform: translateY(-2px);
}

.role-chip:active {
  transform: translateY(0) scale(0.97);
}

.role-chip:focus-visible {
  outline: 2.5px solid var(--red, #c81e2b);
  outline-offset: 2px;
  background: #fff8f8;
  color: var(--red, #c81e2b);
}

.role-chip.is-selected {
  background: var(--red, #c81e2b);
  color: #ffffff;
  border-color: var(--red, #c81e2b);
  box-shadow: 0 3px 10px rgba(248, 40, 54, 0.28);
}
.role-chip.is-selected .role-chip-icon {
  background: transparent;
  color: #ffffff;
}

/* ==================================================
   EXACT STATIC SHOWCASE: TOOLS, CERTIFICATIONS & HIRING GRIDS
   ================================================== */
.platform-transition-section {
  background: #ffffff;
  border-top: 1px solid rgba(0, 0, 0, 0.05);
  border-bottom: 1px solid var(--line, #e2e8f0);
  padding: 70px 0 76px;
  position: relative;
  z-index: 5;
  overflow: hidden;
}

.platform-transition-inner {
  max-width: 1400px;
  margin: 0 auto;
  padding: 0 24px;
  box-sizing: border-box;
  width: 100%;
}

/* Individual Stacked Showcase Block */
.static-showcase-block {
  margin-bottom: 64px;
}
.static-showcase-block:last-child {
  margin-bottom: 0;
}

/* Header Area */
.static-showcase-header {
  text-align: center;
  max-width: 860px;
  margin: 0 auto 26px;
  padding: 0 16px;
  box-sizing: border-box;
}

/* Pale-pink pill-shaped section label */
.static-showcase-pill {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: #FDF2F4;
  border: 1px solid #FCD9DE;
  color: #E51E2B;
  font-family: 'Plus Jakarta Sans', Arial, sans-serif;
  font-size: 11.5px;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: 1.4px;
  padding: 5px 16px;
  border-radius: 999px;
  margin-bottom: 14px;
}

/* Main Heading */
.static-showcase-heading {
  font-family: 'Plus Jakarta Sans', Arial, sans-serif;
  font-size: clamp(24px, 2.7vw, 34px);
  font-weight: 800;
  line-height: 1.28;
  letter-spacing: -0.02em;
  color: #17191D;
  margin: 0 0 10px;
}

.text-highlight-red {
  color: #E51E2B !important;
}

/* Supporting Subtitle */
.static-showcase-subline {
  font-family: 'Plus Jakarta Sans', Arial, sans-serif;
  font-size: clamp(14px, 1.2vw, 15.5px);
  line-height: 1.55;
  color: #5E6573;
  margin: 0 auto;
  max-width: 680px;
}

/* Large Rounded Outer Card Container with Pale-Pink Border */
.static-showcase-card {
  background: #ffffff;
  border: 1.5px solid #FCE5E8;
  border-radius: 20px;
  padding: 26px 30px;
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.02);
  box-sizing: border-box;
}

/* ── 1. Tools Grid (4 columns by 3 rows on desktop) ── */
.static-tools-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 16px 20px;
}

.static-tool-tile {
  background: #ffffff;
  border: 1px solid #edeef2;
  border-radius: 12px;
  padding: 12px 18px;
  display: flex;
  align-items: center;
  gap: 14px;
  min-height: 58px;
  box-sizing: border-box;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.03);
  transition: transform 0.2s cubic-bezier(0.16, 1, 0.3, 1),
              border-color 0.2s ease,
              box-shadow 0.2s cubic-bezier(0.16, 1, 0.3, 1);
}

.static-tool-tile:hover {
  transform: translateY(-2px);
  border-color: #ffd5da;
  box-shadow: 0 6px 18px rgba(239, 51, 64, 0.08);
}

.static-tool-tile img,
.static-tool-tile svg {
  flex-shrink: 0;
  display: block;
  width: 28px;
  height: 28px;
  object-fit: contain;
}

.static-tool-name {
  font-family: 'Plus Jakarta Sans', Arial, -apple-system, sans-serif;
  font-size: 15px;
  font-weight: 700;
  color: #17191d;
  white-space: nowrap;
}

/* ── 2. Certifications Grid (3 columns on desktop) ── */
#certifications-section {
  background: #ffffff;
}

#certifications-section .static-showcase-card {
  background: #ffffff;
  border: 1.5px solid #ffd5da;
  border-radius: 24px;
  padding: 24px;
  box-shadow: 0 4px 20px rgba(239, 51, 64, 0.03), 0 1px 3px rgba(0, 0, 0, 0.02);
  width: 100%;
  box-sizing: border-box;
  overflow: visible;
}

.static-certs-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 16px 18px;
  width: 100%;
  box-sizing: border-box;
}

.static-cert-tile {
  background: #ffffff;
  border: 1.5px solid #ffb8c0;
  border-radius: 18px;
  padding: 0 20px;
  height: 64px;
  min-height: 64px;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  width: 100%;
  box-sizing: border-box;
  box-shadow: 0 2px 8px rgba(239, 51, 64, 0.04), 0 1px 2px rgba(0, 0, 0, 0.02);
  cursor: default;
  transition: transform 0.2s cubic-bezier(0.16, 1, 0.3, 1), border-color 0.2s cubic-bezier(0.16, 1, 0.3, 1), box-shadow 0.2s cubic-bezier(0.16, 1, 0.3, 1);
  position: relative;
  text-decoration: none;
  outline: none;
}

.static-cert-tile:hover {
  transform: translateY(-2px);
  border-color: #ef3340;
  box-shadow: 0 8px 22px rgba(239, 51, 64, 0.14), 0 2px 6px rgba(239, 51, 64, 0.06);
}

.static-cert-tile:focus-visible {
  outline: 2.5px solid #ef3340;
  outline-offset: 2px;
  border-color: #ef3340;
}

.cert-logo-wrap {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 38px;
  height: 38px;
  flex-shrink: 0;
}

.cert-logo-img {
  max-width: 36px;
  max-height: 26px;
  width: auto;
  height: auto;
  object-fit: contain;
  display: block;
}

.cert-divider {
  display: block;
  width: 1px;
  height: 26px;
  background: #ffd5da;
  flex-shrink: 0;
  margin: 0 16px 0 14px;
}

.static-cert-name {
  font-family: 'Plus Jakarta Sans', Arial, -apple-system, sans-serif;
  font-size: 14px;
  font-weight: 700;
  color: #17191d;
  line-height: 1.3;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  letter-spacing: -0.1px;
}

@media (prefers-reduced-motion: reduce) {
  .static-cert-tile {
    transition: none;
  }
  .static-cert-tile:hover {
    transform: none;
  }
}

/* ── 3. Hiring Companies Grid (9 columns by 5 rows on desktop) ── */
.static-companies-grid {
  display: grid;
  grid-template-columns: repeat(9, 1fr);
  gap: 12px 14px;
}

.static-company-tile {
  background: #ffffff;
  border: 1.2px solid #F8E4E7;
  border-radius: 12px;
  padding: 8px 12px;
  display: flex;
  align-items: center;
  justify-content: center;
  height: 52px;
  box-sizing: border-box;
  box-shadow: 0 1px 4px rgba(0, 0, 0, 0.02);
  transition: transform 0.2s ease, border-color 0.2s ease, box-shadow 0.2s ease;
}

.static-company-tile:hover {
  transform: translateY(-2px);
  border-color: #F4A7B2;
  box-shadow: 0 6px 16px rgba(229, 30, 43, 0.08);
}

.static-company-tile img,
.static-company-tile svg {
  max-width: 90%;
  max-height: 28px;
  width: auto;
  height: auto;
  display: block;
  object-fit: contain;
}

/* ── Responsive Behavior ── */

/* Laptop (1024px to 1199px) */
@media (max-width: 1199px) and (min-width: 1024px) {
  .static-tools-grid {
    grid-template-columns: repeat(4, 1fr);
  }
  .static-certs-grid {
    grid-template-columns: repeat(2, 1fr);
  }
  .static-companies-grid {
    grid-template-columns: repeat(6, 1fr);
  }
}

/* Tablet (768px to 1023px) */
@media (max-width: 1023px) and (min-width: 768px) {
  .platform-transition-section {
    padding: 50px 0 56px;
  }
  .static-showcase-block {
    margin-bottom: 50px;
  }
  .static-showcase-card {
    padding: 20px 20px;
    border-radius: 18px;
  }
  .static-tools-grid {
    grid-template-columns: repeat(3, 1fr);
    gap: 12px;
  }
  .static-certs-grid {
    grid-template-columns: repeat(2, 1fr);
    gap: 14px;
  }
  .static-companies-grid {
    grid-template-columns: repeat(5, 1fr);
    gap: 10px;
  }
}

/* Mobile (320px to 767px) */
@media (max-width: 767px) {
  .platform-transition-section {
    padding: 38px 0 44px;
  }
  .platform-transition-inner {
    padding: 0 16px;
  }
  .static-showcase-block {
    margin-bottom: 38px;
  }
  .static-showcase-pill {
    font-size: 10.5px;
    letter-spacing: 1.1px;
    padding: 4px 12px;
    margin-bottom: 10px;
  }
  .static-showcase-heading {
    font-size: 21px;
    margin-bottom: 8px;
  }
  .static-showcase-subline {
    font-size: 13.5px;
    margin-bottom: 0;
  }
  .static-showcase-header {
    margin-bottom: 18px;
  }
  .static-showcase-card {
    padding: 14px 12px;
    border-radius: 16px;
  }
  .static-tools-grid {
    grid-template-columns: repeat(2, 1fr);
    gap: 8px;
  }
  .static-tool-tile {
    min-height: 48px;
    padding: 8px 10px;
    gap: 8px;
    border-radius: 10px;
  }
  .static-tool-tile img,
  .static-tool-tile svg {
    width: 22px;
    height: 22px;
  }
  .static-tool-name {
    font-size: 12.5px;
  }

  #certifications-section .static-showcase-card {
    padding: 14px 12px;
    border-radius: 18px;
  }
  .static-certs-grid {
    grid-template-columns: 1fr;
    gap: 10px;
  }
  .static-cert-tile {
    height: auto;
    min-height: 54px;
    padding: 10px 14px;
    border-radius: 14px;
  }
  .static-cert-name {
    white-space: normal;
    font-size: 13.5px;
  }

  .static-companies-grid {
    grid-template-columns: repeat(3, 1fr);
    gap: 8px;
  }
  .static-company-tile {
    height: 44px;
    padding: 6px 8px;
    border-radius: 10px;
  }
  .static-company-tile img,
  .static-company-tile svg {
    max-height: 20px;
  }
}

/* Very Small Mobile (<= 374px) */
@media (max-width: 374px) {
  .static-tools-grid {
    grid-template-columns: repeat(2, 1fr);
    gap: 6px;
  }
  .static-tool-tile {
    padding: 6px 8px;
    gap: 6px;
  }
  .static-tool-name {
    font-size: 11.5px;
  }
  .static-certs-grid {
    grid-template-columns: 1fr;
    gap: 8px;
  }
  .static-cert-name {
    font-size: 12.5px;
  }
  .static-companies-grid {
    grid-template-columns: repeat(2, 1fr);
    gap: 6px;
  }
}

/* ═══════════════════════════════════════════════════
   MODERNIZED LEARN - PRACTICE - BUILD - GROW STRIP
   ═══════════════════════════════════════════════════ */
.proof-strip-v2 {
  background: #fffafa;
  border-top: 1px solid rgba(248, 40, 54, 0.1);
  border-bottom: 1px solid var(--line);
  padding: 32px 20px;
  position: relative;
  z-index: 4;
}
.proof-strip-inner {
  max-width: 1200px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 24px;
}
.proof-step {
  display: flex;
  align-items: flex-start;
  gap: 14px;
  padding: 12px 14px;
  background: #ffffff;
  border: 1px solid rgba(248, 40, 54, 0.08);
  border-radius: 14px;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.02);
  transition: transform 0.2s ease, border-color 0.2s ease;
}
.proof-step:hover {
  transform: translateY(-2px);
  border-color: rgba(248, 40, 54, 0.25);
  box-shadow: 0 4px 12px rgba(248, 40, 54, 0.06);
}
.proof-step-icon {
  width: 40px;
  height: 40px;
  border-radius: 10px;
  background: rgba(248, 40, 54, 0.08);
  color: var(--red);
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}
.proof-step-content {
  flex: 1;
}
.proof-step-title {
  display: block;
  font-size: 15px;
  font-weight: 800;
  color: var(--ink);
  margin-bottom: 3px;
  letter-spacing: -0.2px;
}
.proof-step-desc {
  margin: 0;
  font-size: 12.5px;
  line-height: 1.45;
  color: var(--muted);
}

/* ═══════════════════════════════
   RESPONSIVE — Compact Desktop Header (961px - 1180px)
   ═══════════════════════════════ */
@media (min-width: 961px) and (max-width: 1180px) {
  .floating-header {
    padding: 0 16px !important;
    gap: 12px !important;
  }
  .floating-header .nav-links {
    gap: 10px !important;
  }
  .floating-header .nav-links > a,
  .floating-header .nav-dropdown > button {
    font-size: 13px !important;
    padding: 0 2px !important;
  }
  .floating-header .nav-cta {
    padding: 9px 14px !important;
    font-size: 13px !important;
  }
}

/* ═══════════════════════════════
   RESPONSIVE — Tablet & Mobile Floating Header & Navigation Drawer (≤960px)
   ═══════════════════════════════ */
@media (max-width: 960px) {
  :root {
    --hero-gutter: 16px;
    --hero-radius: 24px;
  }
  .topbar {
    height: 36px;
    font-size: 12px;
    padding: 0 12px;
    gap: 10px;
  }
  .floating-header {
    top: 36px;
    width: calc(100% - 24px);
    border-radius: 999px !important;
    padding: 0 14px !important;
    height: 54px !important;
  }
  .floating-header.is-scrolled {
    top: 0 !important;
  }
  .floating-header .logo,
  .ednex-brand-logo {
    display: inline-flex !important;
    flex-direction: row !important;
    align-items: center !important;
    align-self: center !important;
    gap: 5px !important;
    white-space: nowrap !important;
    height: auto !important;
  }
  .ednex-brand-logo .brand-text {
    font-size: 19px !important;
    font-weight: 900 !important;
    white-space: nowrap !important;
  }
  .ednex-brand-logo .brand-sub {
    font-size: 19px !important;
    font-weight: 900 !important;
    white-space: nowrap !important;
  }
  .floating-header .header-logo-img,
  .floating-header .logo img {
    height: 26px;
  }
  .floating-header .nav-links,
  .floating-header .nav-cta {
    display: none !important;
  }
  .floating-header .menu {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    width: 38px;
    height: 38px;
    padding: 0;
    border: none;
    background: transparent;
    cursor: pointer;
    border-radius: 8px;
    position: relative;
    transition: background 0.18s ease;
  }
  .floating-header .menu:hover,
  .floating-header .menu:focus-visible {
    background: #f1f5f9;
  }
  .floating-header .menu span {
    display: block;
    width: 20px;
    height: 2px;
    background: #17191d;
    margin: 2.5px 0;
    border-radius: 2px;
    transition: transform 0.22s ease, opacity 0.22s ease;
  }
  .floating-header.mobile-open .menu span {
    position: absolute;
    top: 50%;
    left: 50%;
    margin: 0 !important;
  }
  .floating-header.mobile-open .menu span:nth-child(1) {
    transform: translate(-50%, -50%) rotate(45deg);
  }
  .floating-header.mobile-open .menu span:nth-child(2) {
    opacity: 0;
  }
  .floating-header.mobile-open .menu span:nth-child(3) {
    transform: translate(-50%, -50%) rotate(-45deg);
  }

  /* ── Mobile/Tablet Open Navigation Drawer ── */
  .floating-header.mobile-open {
    position: fixed !important;
    top: max(8px, env(safe-area-inset-top, 8px)) !important;
    left: 50% !important;
    transform: translateX(-50%) !important;
    width: calc(100% - 20px) !important;
    max-width: 520px !important;
    height: auto !important;
    max-height: calc(100dvh - 16px) !important;
    max-height: calc(100vh - 16px) !important;
    display: grid !important;
    grid-template-columns: 1fr auto !important;
    grid-template-rows: auto minmax(0, 1fr) auto !important;
    grid-template-areas:
      "logo menu"
      "nav  nav"
      "cta  cta" !important;
    align-items: center !important;
    padding: 12px 18px 16px !important;
    border-radius: 22px !important;
    box-shadow: 0 20px 48px rgba(0, 0, 0, 0.22), 0 4px 12px rgba(0, 0, 0, 0.08) !important;
    z-index: 100000 !important;
    background: #ffffff !important;
    box-sizing: border-box !important;
    overflow: hidden !important;
    animation: mobileMenuFadeIn 0.22s cubic-bezier(0.16, 1, 0.3, 1) forwards;
  }

  @keyframes mobileMenuFadeIn {
    from {
      opacity: 0.85;
      transform: translateX(-50%) translateY(-6px);
    }
    to {
      opacity: 1;
      transform: translateX(-50%) translateY(0);
    }
  }

  /* Keep Logo anchored top-left and Menu button anchored top-right */
  .floating-header.mobile-open .logo,
  .floating-header.mobile-open .ednex-brand-logo {
    grid-area: logo;
    flex: 0 0 auto !important;
    align-self: center !important;
    margin: 0 !important;
    padding: 2px 0 !important;
  }
  .floating-header.mobile-open .menu {
    grid-area: menu;
    flex: 0 0 auto !important;
    align-self: center !important;
    margin: 0 0 0 auto !important;
  }

  /* Navigation Links Panel: Independently Scrollable */
  .floating-header.mobile-open .nav-links {
    grid-area: nav;
    display: flex !important;
    flex-direction: column !important;
    align-items: stretch !important;
    width: 100% !important;
    min-height: 0 !important;
    overflow-y: auto !important;
    overflow-x: hidden !important;
    -webkit-overflow-scrolling: touch !important;
    overscroll-behavior: contain !important;
    touch-action: pan-y !important;
    padding: 10px 4px 12px !important;
    margin: 8px 0 0 !important;
    border-top: 1px solid #f1f5f9;
    border-bottom: 1px solid #f1f5f9;
    gap: 3px !important;
    box-sizing: border-box !important;
    scrollbar-width: thin;
    scrollbar-color: #cbd5e1 transparent;
  }
  .floating-header.mobile-open .nav-links::-webkit-scrollbar {
    width: 4px;
  }
  .floating-header.mobile-open .nav-links::-webkit-scrollbar-thumb {
    background: #cbd5e1;
    border-radius: 4px;
  }

  .floating-header.mobile-open .nav-links > a,
  .floating-header.mobile-open .nav-dropdown > button {
    width: 100% !important;
    box-sizing: border-box !important;
    height: auto !important;
    line-height: 1.4 !important;
    padding: 11px 14px !important;
    font-size: 14.5px !important;
    font-weight: 600 !important;
    color: #1e293b !important;
    border-radius: 10px;
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    text-align: left !important;
    background: transparent;
    border: none;
    cursor: pointer;
    user-select: none;
    -webkit-tap-highlight-color: transparent;
    transition: background 0.15s ease, color 0.15s ease;
  }
  .floating-header.mobile-open .nav-links > a:hover,
  .floating-header.mobile-open .nav-dropdown > button:hover,
  .floating-header.mobile-open .nav-links > a:focus-visible,
  .floating-header.mobile-open .nav-dropdown > button:focus-visible {
    background: #fff1ef !important;
    color: var(--red, #c81e2b) !important;
  }

  /* Dropdown inside Mobile Menu (Accordion Trigger) */
  .floating-header.mobile-open .nav-dropdown {
    width: 100% !important;
    height: auto !important;
    display: flex !important;
    flex-direction: column !important;
    position: static !important;
  }
  .floating-header.mobile-open .nav-dropdown > button {
    font-weight: 700 !important;
  }
  .floating-header.mobile-open .nav-dropdown.is-open > button {
    background: #fff1ef !important;
    color: var(--red, #c81e2b) !important;
  }

  /* Rotating arrow indicator for Programs accordion */
  .floating-header.mobile-open .nav-arrow {
    display: inline-block !important;
    width: 8px !important;
    height: 8px !important;
    border-right: 2px solid currentColor !important;
    border-bottom: 2px solid currentColor !important;
    transform: rotate(45deg) !important;
    margin-left: 8px !important;
    transform-origin: 50% 50% !important;
    transition: transform 0.25s cubic-bezier(0.16, 1, 0.3, 1) !important;
    pointer-events: none !important;
    flex-shrink: 0 !important;
  }
  .floating-header.mobile-open .nav-dropdown.is-open .nav-arrow,
  .floating-header.mobile-open .nav-dropdown > button[aria-expanded="true"] .nav-arrow {
    transform: rotate(-135deg) translateY(-2px) !important;
  }

  /* Submenu Inside Accordion */
  .floating-header.mobile-open .nav-dropdown .nav-submenu,
  .floating-header.mobile-open .nav-dropdown .nav-submenu.nav-dropdown-2col {
    display: none !important;
    position: static !important;
    opacity: 1 !important;
    visibility: visible !important;
    transform: none !important;
    box-shadow: none !important;
    border: 1px solid #e2e8f0 !important;
    background: #f8fafc !important;
    border-radius: 12px !important;
    padding: 8px 6px !important;
    margin: 6px 0 10px !important;
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
  }
  .floating-header.mobile-open .nav-dropdown.is-open .nav-submenu,
  .floating-header.mobile-open .nav-dropdown.is-open .nav-submenu.nav-dropdown-2col {
    display: flex !important;
    flex-direction: column !important;
    gap: 3px !important;
    animation: accordionSubmenuIn 0.2s cubic-bezier(0.16, 1, 0.3, 1) forwards;
  }

  @keyframes accordionSubmenuIn {
    from {
      opacity: 0;
      transform: translateY(-4px);
    }
    to {
      opacity: 1;
      transform: translateY(0);
    }
  }

  .floating-header.mobile-open .nav-dropdown-col {
    display: flex !important;
    flex-direction: column !important;
    width: 100% !important;
    gap: 2px !important;
  }

  .floating-header.mobile-open .nav-dropdown-divider {
    display: block !important;
    height: 1px !important;
    width: 100% !important;
    background: #e2e8f0 !important;
    margin: 6px 0 !important;
  }

  .floating-header.mobile-open .nav-dropdown-col a {
    display: flex !important;
    align-items: center !important;
    padding: 9px 12px !important;
    font-size: 13.5px !important;
    font-weight: 600 !important;
    color: #475569 !important;
    border-radius: 8px !important;
    line-height: 1.35 !important;
    text-decoration: none !important;
    white-space: normal !important;
    transition: background 0.15s ease, color 0.15s ease !important;
  }
  .floating-header.mobile-open .nav-dropdown-col a:hover,
  .floating-header.mobile-open .nav-dropdown-col a:active {
    background: #ffffff !important;
    color: var(--red, #c81e2b) !important;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04);
  }

  /* Prominent Pay Now CTA Button inside Mobile Menu */
  .floating-header.mobile-open .nav-link-paynow {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 9px !important;
    width: 100% !important;
    box-sizing: border-box !important;
    padding: 13px 18px !important;
    background: var(--red, #ef3340) !important;
    color: #ffffff !important;
    font-size: 14.5px !important;
    font-weight: 800 !important;
    border-radius: 12px !important;
    margin: 12px 0 6px !important;
    text-align: center !important;
    text-decoration: none !important;
    box-shadow: 0 4px 14px rgba(239, 51, 64, 0.32) !important;
    transition: background 0.15s ease, transform 0.15s ease, box-shadow 0.15s ease !important;
    order: 99 !important;
  }
  .floating-header.mobile-open .nav-link-paynow:hover,
  .floating-header.mobile-open .nav-link-paynow:active {
    background: var(--red-dark, #b51520) !important;
    color: #ffffff !important;
    transform: translateY(-1px);
    box-shadow: 0 6px 18px rgba(239, 51, 64, 0.42) !important;
  }
  .floating-header.mobile-open .nav-link-paynow-dot {
    display: none !important;
  }
  .floating-header.mobile-open .nav-link-paynow::before {
    content: '' !important;
    display: inline-block !important;
    width: 17px !important;
    height: 17px !important;
    background-color: currentColor !important;
    -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect width='20' height='14' x='2' y='5' rx='2'/%3E%3Cline x1='2' x2='22' y1='10' y2='10'/%3E%3C/svg%3E") no-repeat center / contain !important;
    mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect width='20' height='14' x='2' y='5' rx='2'/%3E%3Cline x1='2' x2='22' y1='10' y2='10'/%3E%3C/svg%3E") no-repeat center / contain !important;
    flex-shrink: 0 !important;
  }

  /* Talk to an Expert inside Mobile Menu */
  .floating-header.mobile-open .nav-cta {
    grid-area: cta;
    width: 100% !important;
    display: inline-flex !important;
    height: 44px !important;
    justify-content: center !important;
    align-items: center !important;
    margin-top: 10px !important;
    border-radius: 999px !important;
    font-size: 14px !important;
    font-weight: 700 !important;
    box-sizing: border-box !important;
  }

  .role-hero {
    min-height: max(600px, min(80svh, 660px));
  }
  .hero-copy {
    padding-top: clamp(114px, 14vh, 130px);
  }
  .hero-bottom-group {
    gap: 16px;
  }
  .role-chips {
    justify-content: center;
    gap: 7px;
  }
}

/* ═══════════════════════════════
   RESPONSIVE — Mobile Role Slider (≤768px)
   ═══════════════════════════════ */
@media (max-width: 768px) {
  .role-chips-section {
    width: 100%;
    max-width: 100%;
    padding: 0;
    overflow: hidden;
    box-sizing: border-box;
  }

  .role-chips-marquee {
    width: 100%;
    max-width: 100%;
    overflow-x: auto;
    overflow-y: hidden;
    scrollbar-width: none;
    -ms-overflow-style: none;
    -webkit-overflow-scrolling: touch;
    touch-action: pan-x;
    cursor: grab;
    user-select: none;
    box-sizing: border-box;
    padding: 4px 0 10px;
    -webkit-mask-image: none !important;
    mask-image: none !important;
  }

  .role-chips-marquee:active {
    cursor: grabbing;
  }

  .role-chips-marquee::-webkit-scrollbar {
    display: none;
  }

  .role-chips {
    display: flex;
    flex-wrap: nowrap;
    align-items: center;
    justify-content: flex-start;
    width: max-content;
    gap: 10px;
    padding: 0 70px 0 16px;
    box-sizing: border-box;
  }

  .role-chip {
    flex-shrink: 0;
    white-space: nowrap;
    height: 38px;
    padding: 0 16px;
    font-size: 12.5px;
    font-weight: 600;
    gap: 7px;
    border: 1.5px solid var(--red, #c81e2b);
  }

  .role-chip-icon {
    width: auto;
    height: auto;
    background: transparent;
    color: var(--red, #c81e2b);
  }

  .role-chip-icon svg {
    width: 13.5px;
    height: 13.5px;
  }

  /* Duplicate cloned chips display on mobile for seamless infinite marquee loop */
  .role-chip--clone {
    display: inline-flex !important;
  }
}

/* ═══════════════════════════════
   RESPONSIVE — Mobile (≤650px)
   ═══════════════════════════════ */
@media (max-width: 650px) {
  :root {
    --hero-gutter: 0px;
    --hero-radius: 16px;
  }
  .topbar {
    height: 36px;
    font-size: 11.5px;
    padding: 0 12px;
    gap: 8px;
    display: flex;
    align-items: center;
    justify-content: space-between;
  }
  .topbar-text {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }
  .topbar-extra {
    display: none !important;
  }
  .topbar-highlight {
    color: #ffffff;
    font-weight: 800;
  }
  .topbar-cta {
    font-size: 11.5px;
    white-space: nowrap;
    flex-shrink: 0;
  }
  .floating-header {
    top: 44px !important;
    height: 52px !important;
    width: calc(100% - 20px) !important;
    padding: 0 16px !important;
    border-radius: 999px !important;
  }
  .floating-header.is-scrolled {
    top: 8px !important;
  }
  .ednex-brand-logo .brand-text,
  .ednex-brand-logo .brand-sub {
    font-size: 19px !important;
  }
  .floating-header .menu {
    width: 36px !important;
    height: 36px !important;
  }

  /* Mobile Hero: vertically balanced, readable upper-middle positioning */
  .role-hero {
    min-height: max(580px, 92svh);
    height: auto;
    margin: 0 0 20px 0;
    border-radius: 0 0 24px 24px;
    position: relative;
  }
  .hero-copy {
    padding: clamp(105px, 15vh, 120px) 14px clamp(60px, 9vh, 75px) !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: space-between !important;
    align-items: center !important;
    min-height: inherit;
    box-sizing: border-box;
  }
  .hero-headline-block {
    padding: 0 !important;
    width: 100%;
    max-width: 440px;
    text-align: center;
    margin: 0 auto;
  }
  .hero-title {
    margin: 0 0 10px !important;
    text-align: center;
  }
  .hero-title-prefix {
    font-size: clamp(22px, 6vw, 28px) !important;
    white-space: normal !important;
    display: block;
    line-height: 1.18;
    text-align: center;
  }
  .role-rotator-frame {
    display: block;
    margin-top: 4px;
  }
  .role-rotator {
    font-size: clamp(20px, 5.2vw, 26px) !important;
    height: auto;
    min-height: 2.2em;
    display: flex;
    justify-content: center;
  }
  .role-rotator-word {
    white-space: normal;
    line-height: 1.2;
    text-align: center;
  }
  .hero-subline {
    margin: 12px auto 0 !important;
    padding: 8px 14px !important;
    border-radius: 14px !important;
    max-width: 320px !important;
    width: auto !important;
    background: rgba(13, 15, 18, 0.52) !important;
    backdrop-filter: blur(8px) !important;
    -webkit-backdrop-filter: blur(8px) !important;
    border: 1px solid rgba(255, 255, 255, 0.15) !important;
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.2) !important;
    box-sizing: border-box !important;
  }
  .hero-subline-main,
  .hero-subline-emphasis {
    font-size: 11.5px !important;
    line-height: 1.35 !important;
    text-align: center !important;
  }

  /* Mobile Search Bar: full width with comfortable touch target */
  .hero-bottom-group {
    padding: 0;
    gap: 12px;
    width: 100%;
    max-width: 440px;
    margin: 0 auto;
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
    align-items: center;
  }
  .role-discovery {
    max-width: 100%;
    width: 100%;
    padding: 0 12px;
    box-sizing: border-box;
  }
  .role-search-box {
    width: 100%;
  }
  .role-search {
    height: 48px;
    font-size: 13.5px;
    padding: 0 46px 0 42px;
  }
  .role-search-icon {
    left: 14px;
    color: var(--red, #c81e2b);
  }
  .role-search-icon svg {
    width: 17px;
    height: 17px;
  }
  .role-search-btn {
    right: 6px;
    width: 36px;
    height: 36px;
    background: var(--red, #c81e2b);
  }
  .role-search-btn svg {
    width: 15px;
    height: 15px;
  }

  .proof-strip-v2 {
    padding: 24px 14px;
  }
  .proof-strip-inner {
    grid-template-columns: repeat(2, 1fr);
    gap: 12px;
  }
  .proof-step {
    padding: 10px;
    gap: 10px;
  }
  .proof-step-icon {
    width: 34px;
    height: 34px;
  }
  .proof-step-icon svg {
    width: 18px;
    height: 18px;
  }
  .proof-step-title {
    font-size: 13.5px;
  }
  .proof-step-desc {
    font-size: 11px;
    line-height: 1.35;
  }
}

/* ═══════════════════════════════
   RESPONSIVE — Ultra Mobile (≤360px)
   ═══════════════════════════════ */
@media (max-width: 360px) {
  :root {
    --hero-gutter: 6px;
    --hero-radius: 14px;
  }
  .ednex-brand-logo .brand-text {
    font-size: 17.5px !important;
    font-weight: 900 !important;
  }
  .ednex-brand-logo .brand-sub {
    font-size: 17.5px !important;
    font-weight: 900 !important;
  }
  .hero-copy {
    padding: 95px 10px clamp(55px, 8vh, 65px) !important;
  }
  .hero-headline-block {
    padding: 0;
  }
  .hero-title-prefix {
    font-size: 19px !important;
    white-space: normal !important;
  }
  .role-rotator {
    font-size: 17px !important;
    height: auto;
    min-height: 2.4em;
  }
  .hero-subline {
    margin-top: 8px;
    padding: 6px 10px;
    border-radius: 12px;
    max-width: 280px;
    width: 100%;
    box-sizing: border-box;
  }
  .hero-subline-main,
  .hero-subline-emphasis {
    font-size: 10.5px;
    line-height: 1.3;
  }
  .role-discovery {
    max-width: 100%;
    padding: 0 8px;
    box-sizing: border-box;
  }
  .role-search {
    height: 42px;
    font-size: 12px;
    padding: 0 34px 0 32px;
  }
  .role-chips {
    gap: 8px;
    padding: 0 14px;
  }
  .role-chip {
    font-size: 12px;
    padding: 0 13px;
    height: 36px;
    gap: 6px;
  }
  .role-chip-icon svg {
    width: 12px;
    height: 12px;
  }
}

/* ── Reduced Motion ── */
@media (prefers-reduced-motion: reduce) {
  .role-rotator-word,
  .role-rotator,
  .role-discovery,
  .role-chip,
  .role-search,
  .role-search-btn,
  .marquee-track,
  .partner-badge {
    transition: none !important;
    animation: none !important;
    transform: none !important;
  }
}

.career-card-visual img { background: var(--red); }




/* ═══════════════════════════════════════════════════════
   PROGRAMS SECTION V2 — Reference Design (Oct 2026)
   Real photos · Simple Icons badges · Red checkmarks
   ═══════════════════════════════════════════════════════ */

/* Override .section layout for programs */
.programs-section {
  max-width: none;
  margin-left: 0;
  margin-right: 0;
  padding: 72px max(20px, calc((100vw - 1200px) / 2));
  background: #f8f7f4;
}

/* ── Section Header ── */
.programs-section-header {
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
  gap: 32px;
  margin-bottom: 36px;
  max-width: 1200px;
  margin-left: auto;
  margin-right: auto;
}

.programs-header-left {
  flex: 1;
  min-width: 0;
}

/* Eyebrow — red bar + uppercase label */
.programs-eyebrow {
  display: flex;
  align-items: center;
  gap: 9px;
  font-size: 11px !important;
  font-weight: 800 !important;
  letter-spacing: 1.5px !important;
  text-transform: uppercase !important;
  color: var(--red) !important;
  margin: 0 0 14px !important;
}
.programs-eyebrow::before {
  content: '';
  display: inline-block;
  width: 20px;
  height: 2px;
  background: var(--red);
  border-radius: 1px;
  flex-shrink: 0;
}

/* Section heading — large, bold, accent span */
.programs-title {
  font-size: clamp(28px, 3.2vw, 44px);
  font-weight: 800;
  letter-spacing: -1.5px;
  line-height: 1.1;
  color: var(--ink);
  margin: 0 0 14px;
}
.programs-title-accent {
  color: var(--red);
}
.programs-subtitle {
  font-size: 15px;
  color: var(--muted);
  margin: 0;
  line-height: 1.5;
}

/* ── Header Aside: callout badge + nav controls ── */
.programs-header-aside {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 14px;
  flex-shrink: 0;
}

/* Callout badge */
.programs-callout-badge {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  background: #fff0ee;
  border: 1px solid #ffd4cc;
  border-radius: 999px;
  padding: 10px 20px 10px 14px;
  font-size: 13px;
  line-height: 1.35;
  color: var(--ink);
  white-space: nowrap;
}
.programs-callout-icon {
  color: var(--red);
  display: flex;
  align-items: center;
  flex-shrink: 0;
}
.programs-callout-badge strong {
  font-weight: 800;
}

/* Nav arrow buttons */
.programs-nav-controls {
  display: flex;
  gap: 8px;
}
.programs-nav-btn {
  width: 38px;
  height: 38px;
  border-radius: 50%;
  border: 1.5px solid #d0d2d8;
  background: #ffffff;
  color: var(--ink);
  font-size: 17px;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: border-color 0.18s ease, color 0.18s ease, background 0.18s ease, box-shadow 0.18s ease;
  line-height: 1;
  padding: 0;
}
.programs-nav-btn:hover,
.programs-nav-btn:focus-visible {
  border-color: var(--red);
  color: var(--red);
  outline: none;
  box-shadow: 0 0 0 3px rgba(213, 43, 30, 0.15);
}
.programs-nav-btn--primary {
  background: var(--red);
  border-color: var(--red);
  color: #ffffff;
}
.programs-nav-btn--primary:hover,
.programs-nav-btn--primary:focus-visible {
  background: var(--red-dark);
  border-color: var(--red-dark);
  color: #ffffff;
}

/* ── Programs Grid V2 ── */
.programs-grid-v2 {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 18px;
  max-width: 1200px;
  margin: 0 auto;
}

/* ── Card V2 — white, rounded, soft shadow ── */
.program-card-v2 {
  padding: 0;
  min-height: 0;
  border: 1px solid #e8eaed;
  border-radius: 18px;
  background: #ffffff;
  box-shadow: 0 2px 8px rgba(23, 25, 29, 0.05), 0 1px 2px rgba(23, 25, 29, 0.04);
  overflow: hidden;
  display: flex;
  flex-direction: column;
  transition: transform 0.22s ease, box-shadow 0.22s ease, border-color 0.22s ease;
}
.program-card-v2:hover {
  transform: translateY(-5px);
  box-shadow: 0 16px 40px rgba(23, 25, 29, 0.12), 0 4px 12px rgba(23, 25, 29, 0.06);
  border-color: #d0d2d6;
}

/* ── Photographic Banner ── */
.program-card-image-wrap picture {
  display: block;
  width: 100%;
  height: 100%;
}
.program-card-image-wrap {
  position: relative;
  width: 100%;
  height: 180px;
  overflow: hidden;
  background: #c4c8cf;
  flex-shrink: 0;
}
.program-card-image {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center center;
  transition: transform 0.38s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}
.program-card-image--ai {
  object-position: center 56% !important;
}
.program-card-image--marketing {
  object-position: center center !important;
}
.program-card-image--data {
  object-position: center center !important;
}
.program-card-image--cyber {
  object-position: center center !important;
}
.program-card-v2:hover .program-card-image {
  transform: scale(1.05);
}

/* ── Card Body ── */
.program-card.program-card-v2 .program-card-body {
  padding: 18px 20px 20px;
  display: flex;
  flex-direction: column;
  flex: 1;
}

/* Category kicker */
.program-card-kicker {
  font-size: 10.5px;
  font-weight: 700;
  letter-spacing: 1px;
  text-transform: uppercase;
  color: var(--muted);
  margin: 0 0 7px;
}

/* Program title — override .program-card h3 specificity */
.program-card.program-card-v2 h3.program-card-title {
  font-size: 20px;
  font-weight: 800;
  letter-spacing: -0.4px;
  line-height: 1.2;
  color: var(--ink);
  margin: 0 0 10px;
  font-family: inherit;
}

/* Description — override .program-card > p selector */
.program-card.program-card-v2 p.program-card-desc {
  font-size: 13px;
  color: var(--muted);
  line-height: 1.55;
  margin: 0 0 14px;
}

/* ── Benefits list with red filled checkmarks ── */
.program-card.program-card-v2 .program-benefits {
  list-style: none;
  padding: 0;
  margin: 0 0 14px;
  display: flex;
  flex-direction: column;
  gap: 7px;
}
.program-card.program-card-v2 .program-benefits li {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 12.5px;
  font-weight: 600;
  color: var(--ink);
  line-height: 1.3;
  margin-right: 0;
}
.program-card.program-card-v2 .program-benefits li::before {
  content: '';
  display: inline-flex;
  width: 18px;
  height: 18px;
  min-width: 18px;
  border-radius: 50%;
  background-color: var(--red);
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='7' viewBox='0 0 10 7'%3E%3Cpath d='M1 3.5l2.5 2.5L9 1' stroke='%23ffffff' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round' fill='none'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: center;
  margin-right: 0;
}

/* ── Tool Badges ── */
.program-tools {
  display: flex;
  flex-wrap: wrap;
  gap: 5px;
  margin: auto 0 14px;
}
.program-tool-badge {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 4px 9px 4px 7px;
  background: #f4f5f7;
  border: 1px solid #e2e4e8;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 600;
  color: #374151;
  white-space: nowrap;
  vertical-align: middle;
  line-height: 1;
}
.program-tool-badge img,
.program-tool-badge svg {
  display: block;
  width: 15px;
  height: 15px;
  object-fit: contain;
  flex-shrink: 0;
}

/* ── "Explore program →" link ── */
.program-explore-link {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  font-size: 13.5px;
  font-weight: 800;
  color: var(--red);
  text-decoration: none;
  padding: 8px 16px;
  border: 1.5px solid var(--red);
  border-radius: 999px;
  background: transparent;
  transition: background 0.18s ease, color 0.18s ease, gap 0.18s ease, box-shadow 0.18s ease;
  box-sizing: border-box;
  white-space: nowrap;
}
.program-explore-link:hover {
  background: var(--red);
  color: #ffffff;
  gap: 9px;
  box-shadow: 0 4px 12px rgba(200, 30, 43, 0.22);
}
.program-explore-link:focus-visible {
  outline: 2px solid var(--red);
  outline-offset: 2px;
  border-radius: 999px;
}

.program-card-actions {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 10px;
  margin-top: auto;
  padding-top: 12px;
  flex-wrap: wrap;
}

/* ── Responsive — Tablet (≤1024px): 2 columns ── */
@media (max-width: 1024px) {
  .programs-grid-v2 {
    grid-template-columns: repeat(2, 1fr);
    gap: 16px;
  }
  .programs-section-header {
    flex-direction: column;
    align-items: flex-start;
    gap: 20px;
    margin-bottom: 28px;
  }
  .programs-header-aside {
    flex-direction: row;
    align-items: center;
    width: 100%;
    justify-content: space-between;
  }
}

/* ── Responsive — Tablet/Mobile (≤960px) ── */
@media (max-width: 960px) {
  .programs-section {
    padding: 56px max(16px, calc((100vw - 960px) / 2));
  }
  .program-card-image-wrap {
    height: 180px;
  }
}

/* ── Responsive — Mobile (≤650px): 1 column ── */
@media (max-width: 650px) {
  .programs-section {
    padding: 48px 16px;
  }
  .programs-grid-v2 {
    grid-template-columns: 1fr;
    gap: 14px;
  }
  .programs-callout-badge {
    display: none;
  }
  .programs-header-aside {
    justify-content: flex-start;
  }
  .program-card-image-wrap {
    height: 200px;
  }
  .program-card.program-card-v2 h3.program-card-title {
    font-size: 19px;
  }
}

/* ── Responsive — Ultra Mobile (≤360px) ── */
@media (max-width: 360px) {
  .programs-section {
    padding: 40px 12px;
  }
  .program-card-image-wrap {
    height: 180px;
  }
  .program-tool-badge {
    font-size: 10.5px;
    padding: 3px 7px 3px 6px;
  }
}

/* ==================================================
   EDNEX ACADEMY — CAREER PATH SECTION (REDESIGN)
   Matching Reference Design: 4-Column Pastel Families
   with Individual White Role Cards & Real Tool Badges
   ================================================== */
.career-section {
  background: #fbfaf8;
  padding: 84px max(20px, calc((100vw - 1240px) / 2)) 96px;
  position: relative;
  border-top: 1px solid rgba(0, 0, 0, 0.05);
}

.career-section-container {
  width: 100%;
  max-width: 1240px;
  margin: 0 auto;
}

.career-section-header {
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
  gap: 24px;
  margin-bottom: 38px;
}

.career-header-copy {
  max-width: 720px;
}

.career-eyebrow-wrap {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 8px;
}

.career-eyebrow-dash {
  display: inline-block;
  width: 22px;
  height: 2px;
  background-color: var(--red);
  border-radius: 2px;
  opacity: 0.85;
}

.footer-col h4,
.footer-col h3 {
  font-size: 13px;
  font-weight: 700;
  margin: 0 0 17px;
  color: #ffffff;
}

.career-eyebrow-text {
  font-family: 'Plus Jakarta Sans', Arial, sans-serif;
  font-size: 12.5px;
  font-weight: 800;
  letter-spacing: 1.2px;
  text-transform: uppercase;
  color: var(--red);
}

.career-title {
  font-family: 'Plus Jakarta Sans', Arial, sans-serif;
  font-size: clamp(30px, 3.6vw, 46px);
  font-weight: 800;
  letter-spacing: -1.4px;
  line-height: 1.1;
  color: #111827;
  margin: 6px 0 12px;
}

.career-title .highlight-red {
  color: var(--red);
}

.career-subtitle {
  font-family: 'Plus Jakarta Sans', Arial, sans-serif;
  font-size: clamp(14px, 1.25vw, 16px);
  color: var(--muted);
  line-height: 1.55;
  margin: 0;
  max-width: 640px;
}

.career-header-action {
  flex-shrink: 0;
}

.career-view-all-pill {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 11px 22px;
  border: 1.5px solid #dcdfe4;
  border-radius: 999px;
  background: #ffffff;
  color: #111827;
  font-family: 'Plus Jakarta Sans', Arial, sans-serif;
  font-size: 13.5px;
  font-weight: 700;
  text-decoration: none;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.04);
  transition: all 0.22s ease;
}

.career-view-all-pill:hover {
  border-color: var(--red);
  color: var(--red);
  transform: translateY(-2px);
  box-shadow: 0 6px 18px rgba(213, 43, 30, 0.12);
}

.career-view-all-pill .career-pill-arrow {
  color: var(--red);
  font-size: 16px;
  line-height: 1;
  transition: transform 0.2s ease;
}

.career-view-all-pill:hover .career-pill-arrow {
  transform: translateX(4px);
}

/* ── 4-Column Layout ── */
.career-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 18px;
  align-items: stretch;
}

.career-family-col {
  border-radius: 20px;
  padding: 18px 16px 20px;
  display: flex;
  flex-direction: column;
  transition: transform 0.25s ease, box-shadow 0.25s ease;
}

.career-family-col:hover {
  box-shadow: 0 12px 30px rgba(15, 23, 42, 0.06);
}

/* ── Column Tint Themes ── */
.career-col-blue {
  background: #eff6ff;
  border: 1px solid #dbeafe;
}

.career-col-red,
.career-col-pink {
  background: #fff0f2;
  border: 1px solid #ffe2e5;
}

.career-col-purple {
  background: #f5f3ff;
  border: 1px solid #ede9fe;
}

.career-col-green {
  background: #f0fdf4;
  border: 1px solid #dcfce7;
}

.career-col-blue .career-family-icon {
  color: #1d4ed8;
}

.career-col-red .career-family-icon,
.career-col-pink .career-family-icon {
  color: var(--red);
}

.career-col-purple .career-family-icon {
  color: #6d28d9;
}

.career-col-green .career-family-icon {
  color: #15803d;
}

/* ── Column Header ── */
.career-family-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  margin-bottom: 14px;
  padding: 2px 4px 0;
}

.career-family-title-wrap {
  display: flex;
  align-items: center;
  gap: 10px;
}

.career-family-icon {
  width: 32px;
  height: 32px;
  border-radius: 9px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: #ffffff;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.05);
}

.career-family-title {
  font-family: 'Plus Jakarta Sans', Arial, sans-serif;
  font-size: 15px;
  font-weight: 700;
  color: #0f172a;
  margin: 0;
  letter-spacing: -0.2px;
}

.career-family-link {
  width: 32px;
  height: 32px;
  border-radius: 50%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: #ffffff;
  color: var(--ink);
  font-size: 16px;
  font-weight: 700;
  text-decoration: none;
  border: 1px solid rgba(0, 0, 0, 0.08);
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.06);
  transition: all 0.2s ease;
}

.career-family-link:hover,
.career-family-link:focus-visible {
  background: var(--red);
  border-color: var(--red);
  color: #ffffff;
  transform: translateX(2px) scale(1.05);
  box-shadow: 0 4px 12px rgba(248, 40, 54, 0.35);
  outline: none;
}

/* ── Roles Container ── */
.career-roles-list {
  display: flex;
  flex-direction: column;
  gap: 14px;
  flex-grow: 1;
}

/* ── Role Card ── */
.career-role-card {
  background: #ffffff;
  border-radius: 14px;
  border: 1px solid rgba(0, 0, 0, 0.06);
  padding: 16px;
  display: flex;
  flex-direction: column;
  height: 100%;
  min-height: 190px;
  text-decoration: none;
  color: inherit;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.03);
  transition: transform 0.22s ease, box-shadow 0.22s ease, border-color 0.22s ease;
  position: relative;
}

.career-role-card:hover {
  transform: translateY(-3px);
  border-color: rgba(213, 43, 30, 0.35);
  box-shadow: 0 10px 24px rgba(15, 23, 42, 0.08);
}

.career-role-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 12px;
}

.career-role-icon {
  width: 38px;
  height: 38px;
  border-radius: 10px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.role-icon-blue {
  background: #dbeafe;
  color: #1d4ed8;
}

.role-icon-pink {
  background: #ffe4e6;
  color: #e11d48;
}

.role-icon-purple {
  background: #ede9fe;
  color: #7c3aed;
}

.role-icon-green {
  background: #dcfce7;
  color: #16a34a;
}

.career-role-chevron {
  width: 26px;
  height: 26px;
  border-radius: 50%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: #fff1ef;
  color: var(--red);
  font-size: 16px;
  font-weight: 700;
  line-height: 1;
  transition: transform 0.2s ease, background-color 0.2s ease, color 0.2s ease;
}

.career-role-card:hover .career-role-chevron {
  transform: translateX(3px);
  background: var(--red);
  color: #ffffff;
}

.career-role-name {
  font-family: 'Plus Jakarta Sans', Arial, sans-serif;
  font-size: 16.5px;
  font-weight: 700;
  color: #0f172a;
  margin: 0 0 6px;
  line-height: 1.25;
  letter-spacing: -0.3px;
}

.career-role-desc {
  font-family: 'Plus Jakarta Sans', Arial, sans-serif;
  font-size: 12.8px;
  color: #64748b;
  line-height: 1.45;
  margin: 0 0 14px;
  flex-grow: 1;
}

/* ── Tool Badges ── */
.career-tools-row {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  align-items: center;
  margin-top: auto;
}

.career-tool-pill {
  display: inline-flex;
  align-items: center;
  gap: 5.5px;
  padding: 4px 8px;
  border-radius: 6px;
  background: #f8fafc;
  border: 1px solid #e2e8f0;
  font-family: 'Plus Jakarta Sans', Arial, sans-serif;
  font-size: 11px;
  font-weight: 600;
  color: #334155;
  line-height: 1.2;
}

.career-tool-pill svg {
  width: 14px;
  height: 14px;
  flex-shrink: 0;
  display: block;
}

/* ── Responsive Breakpoints ── */
@media (max-width: 1120px) {
  .career-grid {
    grid-template-columns: repeat(2, 1fr);
    gap: 16px;
  }
  .career-section-header {
    gap: 20px;
  }
}

@media (max-width: 768px) {
  .career-section {
    padding: 60px 16px 72px;
  }
  .career-section-header {
    flex-direction: column;
    align-items: flex-start;
    gap: 18px;
    margin-bottom: 28px;
  }
  .career-header-action {
    width: 100%;
  }
  .career-view-all-pill {
    width: 100%;
    justify-content: center;
  }
}

@media (max-width: 640px) {
  .career-grid {
    grid-template-columns: 1fr;
    gap: 14px;
  }
  .career-title {
    font-size: 28px;
    letter-spacing: -0.8px;
  }
}

@media (max-width: 360px) {
  .career-section {
    padding: 48px 12px 60px;
  }
  .career-family-col {
    padding: 14px 12px;
  }
  .career-role-card {
    padding: 13px 12px;
  }
  .career-tool-pill {
    font-size: 10px;
    padding: 3px 6px;
  }
}

/* ==================================================
   SECTION ONE: PROJECT SHOWCASE (BUILD PROOF OF WORK)
   Wide 2-Column Composition with 3D Illustration &
   Polished Horizontal Project Cards
   ================================================== */
.showcase-section {
  background: #ffffff;
  padding: 88px max(20px, calc((100vw - 1280px) / 2)) 92px;
  position: relative;
  border-top: 1px solid rgba(0, 0, 0, 0.05);
}

.showcase-container {
  width: 100%;
  max-width: 1280px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: minmax(340px, 1.05fr) minmax(160px, 220px) minmax(460px, 1.45fr);
  gap: 20px;
  align-items: center;
}

/* ── Left Column: Copy & Benefits ── */
.showcase-left-col {
  display: flex;
  flex-direction: column;
}

.showcase-eyebrow-wrap {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 10px;
}

.showcase-eyebrow-dash {
  display: inline-block;
  width: 24px;
  height: 2px;
  background-color: var(--red);
  border-radius: 2px;
}

.showcase-eyebrow-text {
  font-family: 'Plus Jakarta Sans', Arial, sans-serif;
  font-size: 11.5px;
  font-weight: 800;
  letter-spacing: 1.5px;
  text-transform: uppercase;
  color: var(--red);
}

.showcase-heading {
  font-family: 'Plus Jakarta Sans', Arial, sans-serif;
  font-size: clamp(32px, 3.8vw, 48px);
  font-weight: 800;
  letter-spacing: -1.5px;
  line-height: 1.1;
  color: #111827;
  margin: 6px 0 16px;
}

.showcase-heading .highlight-red {
  color: var(--red);
}

.showcase-lead {
  font-family: 'Plus Jakarta Sans', Arial, sans-serif;
  font-size: clamp(14px, 1.25vw, 15.5px);
  color: var(--muted);
  line-height: 1.6;
  margin: 0 0 28px;
  max-width: 520px;
}

/* ── 4 Compact Benefit Items (2x2 Grid) ── */
.showcase-benefits-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 12px;
  margin-bottom: 32px;
  max-width: 460px;
}

.showcase-benefit-item {
  display: flex;
  align-items: center;
  gap: 11px;
  padding: 10px 14px;
  background: #fff5f5;
  border: 1px solid #ffe4e4;
  border-radius: 12px;
  transition: transform 0.2s ease, border-color 0.2s ease;
}

.showcase-benefit-item:hover {
  transform: translateY(-2px);
  border-color: rgba(213, 43, 30, 0.4);
}

.showcase-benefit-icon {
  width: 34px;
  height: 34px;
  border-radius: 9px;
  background: #ffe3e1;
  color: var(--red);
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}

.showcase-benefit-text {
  display: flex;
  flex-direction: column;
}

.showcase-benefit-text strong {
  font-family: 'Plus Jakarta Sans', Arial, sans-serif;
  font-size: 13px;
  font-weight: 800;
  color: #111827;
  line-height: 1.2;
}

.showcase-benefit-text span {
  font-family: 'Plus Jakarta Sans', Arial, sans-serif;
  font-size: 11.5px;
  font-weight: 600;
  color: #475569;
  line-height: 1.2;
}

.showcase-cta-wrap {
  margin-top: 4px;
}

.showcase-cta-btn {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding: 14px 28px;
  background: var(--red);
  color: #ffffff;
  font-family: 'Plus Jakarta Sans', Arial, sans-serif;
  font-size: 14.5px;
  font-weight: 700;
  border-radius: 12px;
  text-decoration: none;
  box-shadow: 0 4px 14px rgba(213, 43, 30, 0.25);
  transition: all 0.22s ease;
}

.showcase-cta-btn:hover {
  background: var(--red-dark);
  color: #ffffff;
  transform: translateY(-2px);
  box-shadow: 0 8px 24px rgba(213, 43, 30, 0.35);
}

.showcase-cta-btn .showcase-btn-arrow {
  font-size: 16px;
  line-height: 1;
  transition: transform 0.2s ease;
}

.showcase-cta-btn:hover .showcase-btn-arrow {
  transform: translateX(4px);
}

/* ── Center 3D Illustration ── */
.showcase-center-visual {
  display: flex;
  align-items: center;
  justify-content: center;
  pointer-events: none;
  user-select: none;
}

.showcase-center-visual img {
  width: 100%;
  max-width: 210px;
  height: auto;
  object-fit: contain;
  display: block;
  filter: drop-shadow(0 12px 28px rgba(0, 0, 0, 0.08));
  animation: showcaseFloat 5s ease-in-out infinite alternate;
}

@keyframes showcaseFloat {
  0% { transform: translateY(0); }
  100% { transform: translateY(-8px); }
}

@media (prefers-reduced-motion: reduce) {
  .showcase-center-visual img {
    animation: none;
  }
}

/* ── Right Column: 4 Project Cards ── */
.showcase-right-col {
  display: flex;
  flex-direction: column;
  gap: 14px;
}

.showcase-project-card {
  background: #ffffff;
  border: 1px solid rgba(226, 232, 240, 0.85);
  border-radius: 20px;
  padding: 16px 20px 16px 18px;
  box-shadow: 0 4px 20px rgba(15, 23, 42, 0.04);
  display: flex;
  align-items: center;
  gap: 18px;
  text-decoration: none;
  color: inherit;
  transition: transform 0.22s ease, box-shadow 0.22s ease, border-color 0.22s ease;
}

.showcase-project-card:hover {
  transform: translateY(-3px);
  border-color: rgba(235, 40, 50, 0.35);
  box-shadow: 0 12px 32px rgba(15, 23, 42, 0.09);
}

.showcase-card-num-wrap {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 4px;
  width: 32px;
  flex-shrink: 0;
}

.showcase-card-num {
  font-family: 'Plus Jakarta Sans', Arial, sans-serif;
  font-size: 17px;
  font-weight: 800;
  color: var(--red, #c81e2b);
  line-height: 1;
}

.showcase-card-num-icon {
  color: var(--red, #c81e2b);
  display: flex;
  align-items: center;
  justify-content: center;
}

.showcase-card-thumb {
  width: 154px;
  height: 86px;
  border-radius: 14px;
  overflow: hidden;
  flex-shrink: 0;
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.08);
  background: #f1f5f9;
}

.showcase-card-thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transition: transform 0.3s ease;
}

.showcase-project-card:hover .showcase-card-thumb img {
  transform: scale(1.05);
}

.showcase-card-body {
  flex: 1;
  min-width: 0;
}

.showcase-card-title {
  font-family: 'Plus Jakarta Sans', Arial, sans-serif;
  font-size: 17.5px;
  font-weight: 800;
  color: #0b132b;
  margin: 0 0 4px;
  letter-spacing: -0.2px;
  line-height: 1.25;
}

.showcase-card-desc {
  font-family: 'Plus Jakarta Sans', Arial, sans-serif;
  font-size: 13px;
  color: #596780;
  line-height: 1.45;
  margin: 0 0 8px;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.showcase-card-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

.showcase-tag {
  font-family: 'Plus Jakarta Sans', Arial, sans-serif;
  font-size: 11.5px;
  font-weight: 600;
  color: #3b5065;
  background: #edf3f8;
  border: 1px solid rgba(203, 213, 225, 0.6);
  padding: 3px 9px;
  border-radius: 7px;
  line-height: 1.3;
}

.showcase-card-action {
  flex-shrink: 0;
}

.showcase-circle-arrow {
  width: 34px;
  height: 34px;
  border-radius: 50%;
  background: #fff0ee;
  color: var(--red, #c81e2b);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 20px;
  font-weight: 700;
  line-height: 1;
  transition: transform 0.2s ease, background-color 0.2s ease, color 0.2s ease;
}

.showcase-project-card:hover .showcase-circle-arrow {
  transform: translateX(3px);
  background: var(--red, #c81e2b);
  color: #ffffff;
}

/* ==================================================
   SECTION TWO: LEARNING METHODOLOGY (5 CONNECTED STAGES)
   Dark Charcoal Theme with Ambient Red Glow,
   Connected Curved Track, and 3D Visual Cards
   ================================================== */
.methodology-v2-section {
  background: #0f1013;
  color: #ffffff;
  padding: 96px max(20px, calc((100vw - 1280px) / 2)) 108px;
  position: relative;
  overflow: hidden;
}

.sr-anchor {
  position: absolute;
  top: -80px;
  left: 0;
  width: 1px;
  height: 1px;
  opacity: 0;
  pointer-events: none;
}

.methodology-v2-glow {
  position: absolute;
  top: -120px;
  left: 50%;
  transform: translateX(-50%);
  width: 860px;
  height: 400px;
  background: radial-gradient(ellipse at center, rgba(213, 43, 30, 0.22) 0%, rgba(213, 43, 30, 0) 70%);
  pointer-events: none;
  z-index: 1;
}

.methodology-v2-container {
  width: 100%;
  max-width: 1280px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: 330px 1fr;
  gap: 46px;
  align-items: center;
  position: relative;
  z-index: 2;
}

/* ── Left Column ── */
.methodology-v2-header {
  display: flex;
  flex-direction: column;
}

.methodology-v2-eyebrow-wrap {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 10px;
}

.methodology-v2-eyebrow-dash {
  display: inline-block;
  width: 24px;
  height: 2px;
  background-color: #ff6b76;
  border-radius: 2px;
}

.methodology-v2-eyebrow-text {
  font-family: 'Plus Jakarta Sans', Arial, sans-serif;
  font-size: 11.5px;
  font-weight: 800;
  letter-spacing: 1.5px;
  text-transform: uppercase;
  color: #ff6b76;
}

.methodology-v2-heading {
  font-family: 'Plus Jakarta Sans', Arial, sans-serif;
  font-size: clamp(32px, 3.8vw, 46px);
  font-weight: 800;
  letter-spacing: -1.3px;
  line-height: 1.1;
  color: #ffffff;
  margin: 6px 0 16px;
}

.methodology-v2-heading .highlight-red {
  color: var(--red);
}

.methodology-v2-desc {
  font-family: 'Plus Jakarta Sans', Arial, sans-serif;
  font-size: clamp(13.5px, 1.2vw, 15px);
  color: #94a3b8;
  line-height: 1.6;
  margin: 0 0 28px;
}

.methodology-v2-btn {
  display: inline-flex;
  align-items: center;
  gap: 9px;
  padding: 13px 26px;
  background: var(--red);
  color: #ffffff;
  font-family: 'Plus Jakarta Sans', Arial, sans-serif;
  font-size: 14px;
  font-weight: 700;
  border-radius: 12px;
  text-decoration: none;
  box-shadow: 0 4px 18px rgba(213, 43, 30, 0.35);
  transition: all 0.22s ease;
  width: fit-content;
}

.methodology-v2-btn:hover {
  background: var(--red-dark);
  color: #ffffff;
  transform: translateY(-2px);
  box-shadow: 0 8px 24px rgba(213, 43, 30, 0.45);
}

.methodology-v2-btn .methodology-v2-btn-arrow {
  font-size: 16px;
  line-height: 1;
  transition: transform 0.2s ease;
}

.methodology-v2-btn:hover .methodology-v2-btn-arrow {
  transform: translateX(4px);
}

/* ── Right Column: 5 Connected Cards ── */
.methodology-v2-stages-wrap {
  position: relative;
  width: 100%;
}

.methodology-v2-track-line {
  position: absolute;
  top: 14px;
  transform: translateY(-50%);
  left: 0;
  right: 0;
  width: 100%;
  height: 2px;
  z-index: 1;
  pointer-events: none;
}

.methodology-v2-track-line svg {
  width: 100%;
  height: 100%;
  display: block;
}

.methodology-v2-grid {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 12px;
  position: relative;
  z-index: 2;
}

.methodology-v2-card {
  display: flex;
  flex-direction: column;
  align-items: center;
}

.methodology-v2-node {
  width: 28px;
  height: 28px;
  border-radius: 50%;
  background: #181114;
  border: 1.5px solid var(--red);
  color: #ffffff;
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 0 12px rgba(213, 43, 30, 0.5);
  margin-bottom: 12px;
  position: relative;
  z-index: 3;
}

.methodology-node-num {
  font-family: 'Plus Jakarta Sans', Arial, sans-serif;
  font-size: 11px;
  font-weight: 800;
  color: #ffffff;
  line-height: 1;
}

.methodology-v2-card-inner {
  width: 100%;
  background: rgba(255, 255, 255, 0.035);
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 18px;
  padding: 16px 12px 18px;
  text-align: center;
  display: flex;
  flex-direction: column;
  align-items: center;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.35);
  transition: transform 0.25s ease, border-color 0.25s ease, box-shadow 0.25s ease, background 0.25s ease;
  min-height: 220px;
}

.methodology-v2-card:hover .methodology-v2-card-inner {
  transform: translateY(-5px);
  border-color: rgba(213, 43, 30, 0.45);
  box-shadow: 0 16px 36px rgba(213, 43, 30, 0.2);
  background: rgba(255, 255, 255, 0.055);
}

.methodology-v2-art {
  height: 80px;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 10px;
}

.methodology-v2-art img {
  max-height: 76px;
  width: auto;
  object-fit: contain;
  display: block;
  filter: drop-shadow(0 6px 14px rgba(0, 0, 0, 0.45));
}

.methodology-v2-card-title {
  font-family: 'Plus Jakarta Sans', Arial, sans-serif;
  font-size: 15px;
  font-weight: 800;
  color: #ffffff;
  margin: 0 0 6px;
  letter-spacing: -0.2px;
}

.methodology-v2-card-desc {
  font-family: 'Plus Jakarta Sans', Arial, sans-serif;
  font-size: 13px;
  color: #94a3b8;
  line-height: 1.5;
  margin: 0;
}

/* ── Responsive Breakpoints ── */
@media (max-width: 1220px) {
  .showcase-container {
    grid-template-columns: 1fr minmax(420px, 1.3fr);
    gap: 28px;
  }
  .showcase-center-visual {
    display: none;
  }
  .methodology-v2-container {
    grid-template-columns: 1fr;
    gap: 36px;
  }
  .methodology-v2-header {
    max-width: 640px;
  }
}

@media (max-width: 980px) {
  .showcase-container {
    grid-template-columns: 1fr;
    gap: 32px;
  }
  .showcase-lead {
    max-width: 100%;
  }
  .showcase-benefits-grid {
    max-width: 100%;
  }
  .methodology-v2-grid {
    grid-template-columns: repeat(3, 1fr);
    gap: 14px;
  }
  .methodology-v2-card:nth-child(4),
  .methodology-v2-card:nth-child(5) {
    grid-column: span 1;
  }
  .methodology-v2-track-line {
    display: none;
  }
}

@media (max-width: 680px) {
  .showcase-section {
    padding: 60px 16px 68px;
  }
  .showcase-benefits-grid {
    grid-template-columns: 1fr;
    gap: 10px;
  }
  .showcase-project-card {
    padding: 12px 14px;
    gap: 12px;
    border-radius: 16px;
  }
  .showcase-card-num-wrap {
    width: 24px;
    gap: 2px;
  }
  .showcase-card-num {
    font-size: 14px;
  }
  .showcase-card-thumb {
    width: 104px;
    height: 60px;
    border-radius: 10px;
  }
  .showcase-card-title {
    font-size: 15px;
  }
  .showcase-card-desc {
    font-size: 11.5px;
    -webkit-line-clamp: 2;
  }
  .showcase-tag {
    font-size: 10px;
    padding: 2px 7px;
  }
  .showcase-circle-arrow {
    width: 30px;
    height: 30px;
    font-size: 17px;
  }
  .showcase-cta-btn {
    width: 100%;
    justify-content: center;
  }

  .methodology-v2-section {
    padding: 64px 16px 72px;
  }
  .methodology-v2-grid {
    grid-template-columns: 1fr;
    gap: 16px;
  }
  .methodology-v2-card-inner {
    min-height: auto;
    padding: 20px 16px;
  }
  .methodology-v2-btn {
    width: 100%;
    justify-content: center;
  }
}

@media (max-width: 380px) {
  .showcase-project-card {
    flex-wrap: wrap;
  }
  .showcase-card-thumb {
    width: 100%;
    height: 100px;
  }
  .showcase-card-action {
    display: none;
  }
}

/* ==================================================
   SECTION ONE: WORKSHOPS & BOOTCAMPS REDESIGN
   3 Large Horizontal Cards in 1 Row on Desktop
   ================================================== */
.workshops-section {
  background: #fbfaf8;
  padding: 88px max(20px, calc((100vw - 1280px) / 2)) 96px;
  position: relative;
  border-top: 1px solid rgba(0, 0, 0, 0.05);
}

.workshops-container {
  width: 100%;
  max-width: 1280px;
  margin: 0 auto;
}

.workshops-header {
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
  gap: 24px;
  margin-bottom: 36px;
}

.workshops-header-copy {
  max-width: 680px;
}

.workshops-eyebrow-wrap {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 10px;
}

.workshops-eyebrow-dash {
  display: inline-block;
  width: 24px;
  height: 2px;
  background-color: var(--red);
  border-radius: 2px;
}

.workshops-eyebrow-text {
  font-family: 'Plus Jakarta Sans', Arial, sans-serif;
  font-size: 11.5px;
  font-weight: 800;
  letter-spacing: 1.5px;
  text-transform: uppercase;
  color: var(--red);
}

.workshops-heading {
  font-family: 'Plus Jakarta Sans', Arial, sans-serif;
  font-size: clamp(25px, 3.6vw, 44px);
  font-weight: 800;
  letter-spacing: -1.3px;
  line-height: 1.15;
  color: #111827;
  margin: 6px 0 12px;
}

.workshops-heading .highlight-red {
  color: var(--red);
}

.workshops-subtitle {
  font-family: 'Plus Jakarta Sans', Arial, sans-serif;
  font-size: clamp(14px, 1.25vw, 15.5px);
  color: var(--muted);
  line-height: 1.55;
  margin: 0;
  max-width: 600px;
}

.workshops-header-action {
  flex-shrink: 0;
}

.workshops-view-all-pill {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 11px 22px;
  border: 1.5px solid #dcdfe4;
  border-radius: 999px;
  background: #ffffff;
  color: #111827;
  font-family: 'Plus Jakarta Sans', Arial, sans-serif;
  font-size: 13.5px;
  font-weight: 700;
  text-decoration: none;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.04);
  transition: all 0.22s ease;
}

.workshops-view-all-pill:hover {
  border-color: var(--red);
  color: var(--red);
  transform: translateY(-2px);
  box-shadow: 0 6px 18px rgba(213, 43, 30, 0.12);
}

.workshops-view-all-pill .pill-arrow {
  color: var(--red);
  font-size: 16px;
  line-height: 1;
  transition: transform 0.2s ease;
}

.workshops-view-all-pill:hover .pill-arrow {
  transform: translateX(4px);
}

/* ── Workshop Cards 3-Column Grid ── */
.workshops-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 20px;
  align-items: stretch;
}

.workshop-card {
  background: #ffffff;
  border: 1px solid #e9edf2;
  border-radius: 20px;
  padding: 24px 18px 22px 22px;
  box-sizing: border-box;
  box-shadow: 0 4px 18px rgba(0, 0, 0, 0.04);
  display: flex;
  justify-content: space-between;
  gap: 12px;
  position: relative;
  overflow: hidden;
  transition: transform 0.25s ease, box-shadow 0.25s ease, border-color 0.25s ease;
}

.workshop-card:hover {
  transform: translateY(-4px);
  border-color: rgba(213, 43, 30, 0.35);
  box-shadow: 0 12px 32px rgba(15, 23, 42, 0.08);
}

.workshop-card-content {
  flex: 1 1 60%;
  display: flex;
  flex-direction: column;
  min-width: 0;
  z-index: 2;
}

.workshop-badge {
  align-self: flex-start;
  padding: 3px 8px;
  border-radius: 6px;
  background: #fff1ef;
  color: var(--red);
  font-family: 'Plus Jakarta Sans', Arial, sans-serif;
  font-size: 10px;
  font-weight: 800;
  letter-spacing: 0.8px;
  text-transform: uppercase;
  margin-bottom: 12px;
}

.workshop-card-title {
  font-family: 'Plus Jakarta Sans', Arial, sans-serif;
  font-size: 17.5px;
  font-weight: 800;
  color: #0f172a;
  margin: 0 0 6px;
  letter-spacing: -0.3px;
  line-height: 1.25;
}

.workshop-card-desc {
  font-family: 'Plus Jakarta Sans', Arial, sans-serif;
  font-size: 12px;
  color: #64748b;
  line-height: 1.45;
  margin: 0 0 16px;
}

.workshop-benefits-list {
  display: flex;
  flex-direction: column;
  gap: 8px;
  margin: 0 0 20px;
  padding: 0;
  list-style: none;
}

.workshop-benefit-item {
  display: flex;
  align-items: center;
  gap: 8px;
  font-family: 'Plus Jakarta Sans', Arial, sans-serif;
  font-size: 11.8px;
  font-weight: 600;
  color: #334155;
  line-height: 1.3;
}

.workshop-benefit-icon {
  width: 16px;
  height: 16px;
  color: var(--red);
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}

.workshop-card-link {
  margin-top: auto;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  color: var(--red);
  font-family: 'Plus Jakarta Sans', Arial, sans-serif;
  font-size: 13px;
  font-weight: 800;
  text-decoration: none;
  transition: gap 0.2s ease, color 0.2s ease;
}

.workshop-card-link:hover {
  gap: 9px;
  color: var(--red-dark);
}

.workshop-card-link .link-arrow {
  font-size: 15px;
  line-height: 1;
}

.workshop-card-visual {
  flex: 0 0 40%;
  max-width: 135px;
  display: flex;
  align-items: flex-end;
  justify-content: flex-end;
  align-self: stretch;
  overflow: hidden;
  user-select: none;
  pointer-events: none;
}

.workshop-card-visual img {
  width: 100%;
  height: auto;
  max-height: 220px;
  object-fit: contain;
  object-position: bottom right;
  display: block;
}

/* ==================================================
   SECTION TWO: FREQUENTLY ASKED QUESTIONS REDESIGN
   Two-Column Layout with Clean Accordion & Dot Texture
   ================================================== */
.faq-v2-section {
  background: #ffffff;
  padding: 92px max(20px, calc((100vw - 1280px) / 2)) 100px;
  position: relative;
  border-top: 1px solid rgba(0, 0, 0, 0.05);
}

.faq-v2-container {
  width: 100%;
  max-width: 1280px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: 420px 1fr;
  gap: 56px;
  align-items: start;
}

.faq-v2-left {
  display: flex;
  flex-direction: column;
  position: relative;
}

.faq-v2-eyebrow-wrap {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 10px;
}

.faq-v2-eyebrow-dash {
  display: inline-block;
  width: 24px;
  height: 2px;
  background-color: var(--red);
  border-radius: 2px;
}

.faq-v2-eyebrow-text {
  font-family: 'Plus Jakarta Sans', Arial, sans-serif;
  font-size: 11.5px;
  font-weight: 800;
  letter-spacing: 1.5px;
  text-transform: uppercase;
  color: var(--red);
}

.faq-v2-heading {
  font-family: 'Plus Jakarta Sans', Arial, sans-serif;
  font-size: clamp(28px, 3.8vw, 44px);
  font-weight: 800;
  letter-spacing: -1.2px;
  line-height: 1.15;
  color: #0b132b;
  margin: 6px 0 16px;
}

.faq-v2-heading .highlight-red {
  color: var(--red);
}

.faq-v2-desc {
  font-family: 'Plus Jakarta Sans', Arial, sans-serif;
  font-size: clamp(14px, 1.25vw, 15.5px);
  color: #64748b;
  line-height: 1.6;
  margin: 0 0 28px;
  max-width: 390px;
}

.faq-v2-illustration-wrap {
  width: 100%;
  max-width: 340px;
  display: flex;
  align-items: center;
  justify-content: flex-start;
}

.faq-v2-illustration {
  width: 100%;
  height: auto;
  display: block;
  overflow: visible;
}

/* ── FAQ Accordion Cards ── */
.faq-v2-accordion {
  display: flex;
  flex-direction: column;
  gap: 14px;
}

.faq-v2-item {
  background: #ffffff;
  border: 1px solid #e5e7eb;
  border-radius: 20px;
  overflow: hidden;
  box-shadow: 0 2px 8px rgba(15, 23, 42, 0.03);
  transition: background-color 0.25s ease, border-color 0.25s ease, box-shadow 0.25s ease, transform 0.2s ease;
}

.faq-v2-item:hover:not(.is-open) {
  border-color: #cbd5e1;
  box-shadow: 0 6px 18px rgba(15, 23, 42, 0.06);
}

.faq-v2-item.is-open {
  background: #FFF8F8;
  border-color: rgba(242, 40, 54, 0.35);
  box-shadow: 0 8px 24px rgba(242, 40, 54, 0.08);
}

.faq-v2-trigger {
  width: 100%;
  display: flex;
  align-items: center;
  gap: 16px;
  padding: 20px 24px;
  background: none;
  border: none;
  cursor: pointer;
  text-align: left;
  font-family: 'Plus Jakarta Sans', Arial, sans-serif;
  font-size: 16.5px;
  font-weight: 700;
  color: #0f172a;
  transition: color 0.2s ease;
}

.faq-v2-trigger:focus-visible {
  outline: 2px solid var(--red);
  outline-offset: 2px;
  border-radius: 18px;
}

.faq-v2-num {
  width: 36px;
  height: 36px;
  border-radius: 50%;
  background: #FFF0F1;
  color: var(--red);
  font-family: 'Plus Jakarta Sans', Arial, sans-serif;
  font-size: 13px;
  font-weight: 800;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  transition: background-color 0.25s ease, color 0.25s ease, transform 0.2s ease;
}

.faq-v2-item.is-open .faq-v2-num {
  background: var(--red);
  color: #ffffff;
}

.faq-v2-question {
  flex: 1;
  padding-right: 12px;
  font-family: 'Plus Jakarta Sans', Arial, sans-serif;
  font-size: 16.5px;
  font-weight: 700;
  color: #0f172a;
  line-height: 1.35;
  transition: color 0.2s ease;
}

.faq-v2-trigger:hover .faq-v2-question {
  color: var(--red);
}

.faq-v2-item.is-open .faq-v2-question {
  color: #0f172a;
}

.faq-v2-icon {
  width: 32px;
  height: 32px;
  border-radius: 50%;
  background: #FFF0F1;
  color: var(--red);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  transition: background-color 0.25s ease, color 0.25s ease, transform 0.25s ease;
}

.faq-v2-item.is-open .faq-v2-icon {
  background: rgba(242, 40, 54, 0.12);
  color: var(--red);
}

.faq-v2-icon svg {
  width: 14px;
  height: 14px;
  display: block;
}

.faq-v2-icon-v {
  transform-origin: center;
  transition: opacity 0.22s ease, transform 0.22s ease;
}

.faq-v2-item.is-open .faq-v2-icon-v {
  opacity: 0;
  transform: scaleY(0);
}

.faq-v2-answer {
  max-height: 0;
  overflow: hidden;
  opacity: 0;
  padding: 0 24px 0 76px;
  transition: max-height 0.35s cubic-bezier(0.4, 0, 0.2, 1), opacity 0.25s ease, padding 0.35s ease;
}

.faq-v2-item.is-open .faq-v2-answer {
  max-height: 280px;
  opacity: 1;
  padding: 0 24px 22px 76px;
}

.faq-v2-answer p {
  font-family: 'Plus Jakarta Sans', Arial, sans-serif;
  font-size: 14.5px;
  color: #4b5563;
  line-height: 1.65;
  margin: 0;
}

@media (prefers-reduced-motion: reduce) {
  .faq-v2-item,
  .faq-v2-answer,
  .faq-v2-icon,
  .faq-v2-icon-v,
  .faq-v2-num {
    transition: none !important;
  }
}

/* ==================================================
   SECTION THREE: FINAL CALL-TO-ACTION BANNER
   Full-width Red Container with 3D Bullseye Target
   ================================================== */
.cta-v2-section {
  background: #ffffff;
  padding: 0 max(20px, calc((100vw - 1280px) / 2)) 80px;
}

.cta-v2-banner {
  width: 100%;
  max-width: 1280px;
  margin: 0 auto;
  padding: 48px 56px;
  box-sizing: border-box;
  border-radius: 24px;
  background: linear-gradient(135deg, #e01e2b 0%, #d52b1e 55%, #ba1e14 100%);
  color: #ffffff;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 32px;
  position: relative;
  overflow: hidden;
  box-shadow: 0 16px 40px rgba(213, 43, 30, 0.28);
}

.cta-v2-content {
  max-width: 520px;
  position: relative;
  z-index: 2;
}

.cta-v2-eyebrow-wrap {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 8px;
}

.cta-v2-eyebrow-dash {
  display: inline-block;
  width: 24px;
  height: 2px;
  background-color: #ffffff;
  border-radius: 2px;
  opacity: 0.85;
}

.cta-v2-eyebrow-text {
  font-family: 'Plus Jakarta Sans', Arial, sans-serif;
  font-size: 11.5px;
  font-weight: 800;
  letter-spacing: 1.6px;
  text-transform: uppercase;
  color: #ffffff;
}

.cta-v2-heading {
  font-family: 'Plus Jakarta Sans', Arial, sans-serif;
  font-size: clamp(24px, 3.4vw, 42px);
  font-weight: 800;
  letter-spacing: -1.2px;
  line-height: 1.15;
  color: #ffffff;
  margin: 6px 0 12px;
}

.cta-v2-desc {
  font-family: 'Plus Jakarta Sans', Arial, sans-serif;
  font-size: clamp(14px, 1.25vw, 15.5px);
  color: rgba(255, 255, 255, 0.92);
  line-height: 1.55;
  margin: 0;
}

.cta-v2-visual {
  position: relative;
  z-index: 1;
  max-width: 250px;
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  pointer-events: none;
  user-select: none;
}

.cta-v2-visual img {
  width: 100%;
  max-width: 240px;
  height: auto;
  object-fit: contain;
  display: block;
  filter: drop-shadow(0 12px 28px rgba(0, 0, 0, 0.25));
  animation: ctaTargetFloat 4.5s ease-in-out infinite alternate;
}

@keyframes ctaTargetFloat {
  0% { transform: translateY(0); }
  100% { transform: translateY(-6px); }
}

@media (prefers-reduced-motion: reduce) {
  .cta-v2-visual img {
    animation: none;
  }
}

.cta-v2-action {
  position: relative;
  z-index: 2;
  flex-shrink: 0;
}

.cta-v2-btn {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 13px 28px;
  box-sizing: border-box;
  border-radius: 999px;
  background: #ffffff;
  color: #111827;
  font-family: 'Plus Jakarta Sans', Arial, sans-serif;
  font-size: 14.5px;
  font-weight: 700;
  text-decoration: none;
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.12);
  transition: all 0.22s ease;
}

.cta-v2-btn:hover {
  background: #fff3f2;
  color: var(--red);
  transform: translateY(-2px);
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.18);
}

.cta-v2-btn .btn-arrow {
  color: var(--red);
  font-size: 16px;
  line-height: 1;
  transition: transform 0.2s ease;
}

.cta-v2-btn:hover .btn-arrow {
  transform: translateX(4px);
}

/* ── Responsive Breakpoints ── */
@media (max-width: 1140px) {
  .workshops-grid {
    grid-template-columns: repeat(2, 1fr);
  }
  .workshops-grid .workshop-card:nth-child(3) {
    grid-column: span 2;
  }
  .faq-v2-container {
    grid-template-columns: 1fr;
    gap: 36px;
  }
  .faq-v2-desc {
    max-width: 100%;
  }
  .faq-v2-illustration-wrap {
    max-width: 280px;
    margin-bottom: 8px;
  }
  .cta-v2-banner {
    padding: 40px 36px;
  }
}

@media (max-width: 860px) {
  .workshops-header {
    flex-direction: column;
    align-items: flex-start;
    gap: 16px;
    margin-bottom: 28px;
  }
  .workshops-header-action {
    width: 100%;
  }
  .workshops-view-all-pill {
    width: 100%;
    justify-content: center;
  }
  .cta-v2-banner {
    flex-direction: column;
    align-items: flex-start;
    gap: 24px;
    padding: 36px 28px;
  }
  .cta-v2-visual {
    display: none;
  }
  .cta-v2-action {
    width: 100%;
  }
  .cta-v2-btn {
    width: 100%;
    justify-content: center;
  }
}

@media (max-width: 680px) {
  .workshops-section {
    padding: 60px 16px 68px;
  }
  .workshops-grid {
    grid-template-columns: 1fr;
    gap: 16px;
  }
  .workshops-grid .workshop-card:nth-child(3) {
    grid-column: span 1;
  }
  .workshop-card {
    padding: 20px 16px;
  }
  .workshop-card-visual {
    max-width: 110px;
  }
  .faq-v2-section {
    padding: 60px 16px 68px;
  }
  .faq-v2-trigger {
    padding: 16px 18px;
    gap: 12px;
  }
  .faq-v2-num {
    width: 30px;
    height: 30px;
    font-size: 12px;
  }
  .faq-v2-question {
    font-size: 15px;
  }
  .faq-v2-icon {
    width: 28px;
    height: 28px;
  }
  .faq-v2-answer {
    padding: 0 18px 0 18px;
  }
  .faq-v2-item.is-open .faq-v2-answer {
    padding: 0 18px 18px 18px;
  }
  .faq-v2-illustration-wrap {
    max-width: 220px;
  }
  .cta-v2-section {
    padding: 0 16px 60px;
  }
  .cta-v2-banner {
    border-radius: 20px;
    padding: 30px 20px;
  }
}

@media (max-width: 380px) {
  .workshop-card {
    flex-direction: column;
  }
  .workshop-card-visual {
    max-width: 100%;
    height: 140px;
    justify-content: center;
  }
  .workshop-card-visual img {
    max-height: 140px;
  }
}

/* ── Dedicated Thank You Modal ── */
.ednex-thankyou-modal {
  position: fixed;
  inset: 0;
  z-index: 99999;
  display: none;
  align-items: center;
  justify-content: center;
  padding: 20px;
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.25s ease, visibility 0.25s ease;
  box-sizing: border-box;
}
.ednex-thankyou-modal.is-active {
  opacity: 1;
  visibility: visible;
}
.ednex-thankyou-backdrop {
  position: absolute;
  inset: 0;
  background: rgba(15, 23, 42, 0.75);
  backdrop-filter: blur(4px);
  -webkit-backdrop-filter: blur(4px);
}
.ednex-thankyou-dialog {
  position: relative;
  z-index: 1;
  background: #FFFFFF;
  border-radius: 20px;
  padding: 38px 32px 32px;
  max-width: 480px;
  width: 100%;
  text-align: center;
  box-shadow: 0 25px 60px rgba(0, 0, 0, 0.25);
  border: 1px solid rgba(242, 31, 43, 0.15);
  transform: scale(0.92) translateY(12px);
  transition: transform 0.28s cubic-bezier(0.16, 1, 0.3, 1);
  box-sizing: border-box;
}
.ednex-thankyou-modal.is-active .ednex-thankyou-dialog {
  transform: scale(1) translateY(0);
}
.ednex-thankyou-close {
  position: absolute;
  top: 14px;
  right: 14px;
  width: 36px;
  height: 36px;
  border: none;
  background: #F3F4F6;
  border-radius: 50%;
  font-size: 22px;
  line-height: 1;
  color: #4B5563;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: background 0.15s ease, color 0.15s ease, transform 0.15s ease;
  padding: 0;
}
.ednex-thankyou-close:hover {
  background: #E5E7EB;
  color: #111827;
  transform: rotate(90deg);
}
.ednex-thankyou-icon {
  width: 68px;
  height: 68px;
  border-radius: 50%;
  background: #FFF1F1;
  color: #F21F2B;
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0 auto 20px;
  box-shadow: 0 0 0 8px rgba(242, 31, 43, 0.08);
}
.ednex-thankyou-icon svg {
  width: 34px;
  height: 34px;
  display: block;
}
.ednex-thankyou-title {
  font-size: 22px;
  font-weight: 800;
  color: #111827;
  margin: 0 0 12px;
  line-height: 1.3;
  letter-spacing: -0.3px;
}
.ednex-thankyou-desc {
  font-size: 15px;
  line-height: 1.55;
  color: #4B5563;
  margin: 0 0 28px;
}
.ednex-thankyou-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 13px 36px;
  background: #F21F2B;
  color: #ffffff;
  font-size: 15px;
  font-weight: 700;
  border: none;
  border-radius: 999px;
  cursor: pointer;
  transition: background 0.15s ease, transform 0.15s ease, box-shadow 0.15s ease;
  box-shadow: 0 4px 14px rgba(242, 31, 43, 0.3);
  font-family: inherit;
}
.ednex-thankyou-btn:hover {
  background: #d51924;
  transform: translateY(-1px);
  box-shadow: 0 6px 18px rgba(242, 31, 43, 0.4);
}
@media (max-width: 480px) {
  .ednex-thankyou-dialog {
    padding: 32px 20px 24px;
    border-radius: 16px;
  }
  .ednex-thankyou-title {
    font-size: 19px;
  }
  .ednex-thankyou-desc {
    font-size: 14px;
    margin-bottom: 22px;
  }
  .ednex-thankyou-btn {
    width: 100%;
  }
}

/* ── Course Benefits (Key Course Info Strip) ── */
.course-info-strip-section {
  padding: 24px 24px 16px;
  background: #ffffff;
  width: 100%;
  box-sizing: border-box;
  overflow: hidden;
}

.course-info-strip-wrap {
  max-width: 1240px;
  margin: 0 auto;
  width: 100%;
  box-sizing: border-box;
}

.course-info-strip {
  background: #FFF8F8;
  border: 1px solid #FFE4E4;
  border-radius: 20px;
  padding: 18px 28px;
  width: 100%;
  box-sizing: border-box;
  display: block;
}

.info-strip-group {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 16px;
  width: 100%;
  align-items: center;
  box-sizing: border-box;
}

.info-strip-group--duplicate {
  display: none !important;
}

.info-strip-col {
  display: flex;
  align-items: center;
  gap: 12px;
  position: relative;
  min-width: 0;
}

.info-strip-col:not(:last-child)::after {
  content: "";
  position: absolute;
  right: -8px;
  top: 15%;
  height: 70%;
  width: 1px;
  background: #F3D2D2;
}

.info-strip-icon {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 38px;
  height: 38px;
  border-radius: 10px;
  background: #ffffff;
  color: var(--red, #F21F2B);
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.04);
  flex-shrink: 0;
}

.info-strip-icon svg {
  width: 20px;
  height: 20px;
}

.info-strip-meta {
  min-width: 0;
}

.info-strip-meta strong {
  display: block;
  font-family: 'Plus Jakarta Sans', Arial, sans-serif;
  font-size: 14.5px;
  font-weight: 800;
  color: #17191D;
  line-height: 1.25;
  white-space: nowrap;
}

.info-strip-meta span {
  display: block;
  font-family: 'Plus Jakarta Sans', Arial, sans-serif;
  font-size: 11.5px;
  color: #6B7280;
  line-height: 1.35;
  margin-top: 2px;
  white-space: nowrap;
}

/* ── Benefits Desktop Refinement (1024px–1160px) ── */
@media (min-width: 1024px) and (max-width: 1160px) {
  .course-info-strip {
    padding: 16px 20px;
  }
  .info-strip-group {
    gap: 10px;
  }
  .info-strip-col {
    gap: 8px;
  }
  .info-strip-icon {
    width: 34px;
    height: 34px;
  }
  .info-strip-icon svg {
    width: 18px;
    height: 18px;
  }
  .info-strip-meta strong {
    font-size: 13.5px;
  }
  .info-strip-meta span {
    font-size: 10.5px;
  }
}

/* ── Benefits Tablet (768px–1023px): Stationary Responsive Grid ── */
@media (min-width: 768px) and (max-width: 1023px) {
  .course-info-strip {
    padding: 22px 24px;
    border-radius: 18px;
  }
  .info-strip-group {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 20px 24px;
  }
  .info-strip-col {
    flex: 0 1 calc(33.333% - 16px);
    min-width: 195px;
  }
  .info-strip-col:not(:last-child)::after {
    display: none !important;
  }
  .info-strip-meta strong {
    font-size: 14px;
  }
  .info-strip-meta span {
    font-size: 11.5px;
  }
}

/* ── Benefits Mobile (320px–767px): Slow, Continuous Loop Slider (30–40s) ── */
@media (max-width: 767px) {
  .course-info-strip-section {
    padding: 12px 0 14px;
  }
  .course-info-strip-wrap {
    overflow: hidden;
    position: relative;
    -webkit-mask-image: linear-gradient(to right, transparent, black 16px, black calc(100% - 16px), transparent);
    mask-image: linear-gradient(to right, transparent, black 16px, black calc(100% - 16px), transparent);
  }
  .course-info-strip {
    background: transparent;
    border: none;
    border-radius: 0;
    padding: 4px 16px;
    width: max-content;
    display: flex;
    align-items: center;
    animation: benefitsMarqueeScroll 35s linear infinite;
    will-change: transform;
  }
  .course-info-strip:hover,
  .course-info-strip:focus-within,
  .course-info-strip.is-paused {
    animation-play-state: paused;
  }
  .info-strip-group {
    display: flex;
    align-items: center;
    gap: 12px;
    width: auto;
    flex-shrink: 0;
    padding-right: 12px;
  }
  .info-strip-group--duplicate {
    display: flex !important;
    align-items: center;
    gap: 12px;
    width: auto;
    flex-shrink: 0;
    padding-right: 12px;
  }
  .info-strip-col {
    background: #FFF8F8;
    border: 1px solid #FFE4E4;
    border-radius: 16px;
    padding: 11px 16px;
    display: inline-flex;
    align-items: center;
    gap: 12px;
    flex-shrink: 0;
    box-shadow: 0 2px 8px rgba(242, 31, 43, 0.04);
    min-width: 205px;
    box-sizing: border-box;
  }
  .info-strip-col:not(:last-child)::after {
    display: none !important;
  }
  .info-strip-icon {
    width: 34px;
    height: 34px;
  }
  .info-strip-icon svg {
    width: 18px;
    height: 18px;
  }
  .info-strip-meta strong {
    font-size: 13.5px;
  }
  .info-strip-meta span {
    font-size: 11px;
  }
}

@keyframes benefitsMarqueeScroll {
  0% { transform: translateX(0); }
  100% { transform: translateX(-50%); }
}

@media (prefers-reduced-motion: reduce) {
  .course-info-strip {
    animation: none !important;
  }
  .course-info-strip-wrap {
    overflow-x: auto;
    scrollbar-width: thin;
    -webkit-overflow-scrolling: touch;
    mask-image: none !important;
    -webkit-mask-image: none !important;
  }
  .info-strip-group--duplicate {
    display: none !important;
  }
}

/* ==================================================
   EDNEX ACADEMY — CAREER PATHWAYS SECTION
   Clean Flat Automatic Career Poster Slider
   Inspired by tigerdekho.com style (No 3D, No Arrows)
   ================================================== */
.career-pathways-section {
  background: #fbfaf8;
  padding: 80px max(20px, calc((100vw - 1240px) / 2)) 88px;
  position: relative;
  border-top: 1px solid rgba(0, 0, 0, 0.06);
  border-bottom: 1px solid rgba(0, 0, 0, 0.06);
  width: 100%;
  box-sizing: border-box;
  overflow: hidden;
}

.career-pathways-container {
  width: 100%;
  max-width: 1240px;
  margin: 0 auto;
}

.career-pathways-header {
  max-width: 800px;
  margin: 0 auto 36px;
  text-align: center;
  display: flex;
  flex-direction: column;
  align-items: center;
}

.career-pathways-pill {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  font-family: 'Plus Jakarta Sans', Arial, sans-serif;
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 1.5px;
  text-transform: uppercase;
  color: var(--red, #c81e2b);
  background: rgba(200, 30, 43, 0.08);
  border: 1px solid rgba(200, 30, 43, 0.22);
  padding: 6px 14px;
  border-radius: 999px;
  margin-bottom: 14px;
}

.career-pathways-title {
  font-family: 'Plus Jakarta Sans', Arial, sans-serif;
  font-size: clamp(28px, 3.6vw, 42px);
  font-weight: 800;
  letter-spacing: -1.2px;
  line-height: 1.2;
  color: #111827;
  margin: 0 0 14px;
  text-align: center;
}

.career-pathways-title .highlight-red {
  color: var(--red, #c81e2b);
}

/* Typewriter Effect Container & Cursor */
.career-typewriter-wrap {
  display: inline-flex;
  align-items: baseline;
  justify-content: flex-start;
  position: relative;
  white-space: nowrap;
  vertical-align: baseline;
}

.career-typewriter-text {
  display: inline-block;
  min-width: 0;
  color: var(--red, #c81e2b);
}

.career-typewriter-cursor {
  display: inline-block;
  color: var(--red, #c81e2b);
  font-weight: 300;
  margin-left: 2px;
  animation: careerCursorBlink 0.9s infinite;
  user-select: none;
}

@keyframes careerCursorBlink {
  0%, 45% { opacity: 1; }
  50%, 95% { opacity: 0; }
  100% { opacity: 1; }
}

@media (prefers-reduced-motion: reduce) {
  .career-typewriter-cursor {
    display: none !important;
  }
}

.career-pathways-subtitle {
  font-family: 'Plus Jakarta Sans', Arial, sans-serif;
  font-size: clamp(14px, 1.35vw, 16px);
  line-height: 1.6;
  color: #4b5563;
  margin: 0 auto;
  max-width: 680px;
  text-align: center;
}

/* ==================================================
   FLAT HORIZONTAL CAREER SLIDER (NO 3D, NO ARROWS)
   ================================================== */
.career-flat-carousel {
  position: relative;
  width: 100%;
  max-width: 1200px;
  margin: 0 auto;
  overflow: hidden;
  padding: 10px 0;
  box-sizing: border-box;
}

.career-flat-viewport {
  width: 100%;
  overflow: hidden;
  position: relative;
  padding: 12px 0 20px;
  outline: none;
}

.career-flat-track {
  display: flex;
  position: relative;
  gap: 20px;
  align-items: center;
  transition: transform 0.55s cubic-bezier(0.25, 1, 0.5, 1);
  will-change: transform;
}

/* ── Individual Flat Slide ── */
.career-flat-slide {
  flex: 0 0 auto;
  width: 380px;
  max-width: 86vw;
  transition: opacity 0.5s ease, filter 0.5s ease, transform 0.5s ease;
  opacity: 0.5;
  filter: brightness(0.92);
  cursor: pointer;
  user-select: none;
}

.career-flat-slide.is-active {
  opacity: 1;
  filter: none;
  cursor: default;
  transform: none;
}

.career-flat-slide:hover:not(.is-active) {
  opacity: 0.75;
  filter: brightness(0.96);
}

.career-flat-card {
  display: block;
  width: 100%;
  text-decoration: none;
  border-radius: 22px;
  overflow: hidden;
  box-shadow: 0 12px 32px rgba(0, 0, 0, 0.08), 0 2px 6px rgba(0, 0, 0, 0.04);
  border: 1px solid rgba(0, 0, 0, 0.06);
  background: #ffffff;
  transition: box-shadow 0.35s ease, transform 0.35s ease;
  will-change: transform;
}

.career-flat-slide.is-active .career-flat-card {
  box-shadow: 0 20px 48px rgba(0, 0, 0, 0.14), 0 4px 12px rgba(0, 0, 0, 0.06);
}

.career-flat-card:focus-visible {
  outline: 3px solid #ff8c80;
  outline-offset: 4px;
}

.career-flat-poster-wrap {
  width: 100%;
  aspect-ratio: 4 / 5;
  overflow: hidden;
  position: relative;
  background: #f3f4f6;
  border-radius: 22px;
}

.career-flat-poster-img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transition: transform 0.4s ease;
}

.career-flat-slide.is-active:hover .career-flat-poster-img {
  transform: scale(1.02);
}

/* ── Pagination Dots (Active: #0f172a, Inactive: #cbd5e1) ── */
.career-flat-dots {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  margin-top: 26px;
}

.career-flat-dot {
  position: relative;
  min-width: 28px;
  min-height: 28px;
  background: transparent;
  border: none;
  padding: 0;
  cursor: pointer;
  outline: none;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  touch-action: manipulation;
}

.career-flat-dot::before {
  content: "";
  display: block;
  width: 9px;
  height: 9px;
  border-radius: 50%;
  background: #cbd5e1;
  transition: transform 0.35s cubic-bezier(0.16, 1, 0.3, 1), background-color 0.35s ease;
}

.career-flat-dot:hover::before {
  background: #94a3b8;
}

.career-flat-dot.is-active::before {
  background: #0f172a;
  transform: scaleX(2.6);
  border-radius: 4px;
}

.career-flat-dot:focus-visible::before {
  box-shadow: 0 0 0 2px #fff, 0 0 0 4px #ff8c80;
}

/* ── Responsive ── */
@media (max-width: 1023px) {
  .career-flat-slide {
    width: 340px;
  }
  .career-flat-track {
    gap: 16px;
  }
}

@media (max-width: 640px) {
  .career-pathways-section {
    padding: 52px 16px 60px;
  }
  .career-pathways-header {
    margin-bottom: 24px;
  }
  .career-flat-slide {
    width: min(320px, 86vw);
  }
  .career-flat-track {
    gap: 12px;
  }
}

@media (max-width: 380px) {
  .career-flat-slide {
    width: 280px;
  }
}


/* ── Placement Support Section Styles ── */
.placement-features-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 20px;
  margin-top: 32px;
}
.placement-feature-card {
  position: relative;
  background: #ffffff;
  border: 1px solid #e8eaed;
  border-radius: 18px;
  padding: 24px 20px;
  box-shadow: 0 2px 8px rgba(23, 25, 29, 0.05), 0 1px 2px rgba(23, 25, 29, 0.04);
  display: flex;
  flex-direction: column;
  transition: transform 0.22s ease, box-shadow 0.22s ease, border-color 0.22s ease;
  outline: none;
  cursor: default;
}
.placement-feature-card:hover {
  transform: translateY(-5px);
  box-shadow: 0 16px 40px rgba(23, 25, 29, 0.12), 0 4px 12px rgba(23, 25, 29, 0.06);
  border-color: #d0d2d6;
}
.placement-feature-card:focus-visible {
  transform: translateY(-5px);
  box-shadow: 0 16px 40px rgba(23, 25, 29, 0.12), 0 4px 12px rgba(23, 25, 29, 0.06);
  border-color: var(--red, #c81e2b);
  outline: 2px solid var(--red, #c81e2b);
  outline-offset: 2px;
}
.placement-feature-icon {
  width: 42px;
  height: 42px;
  border-radius: 12px;
  background: #fff0f1;
  color: var(--red, #c81e2b);
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 16px;
  flex-shrink: 0;
  transition: transform 0.22s ease, background-color 0.22s ease, color 0.22s ease;
}
.placement-feature-card:hover .placement-feature-icon,
.placement-feature-card:focus-visible .placement-feature-icon {
  transform: scale(1.06);
  background: var(--red, #c81e2b);
  color: #ffffff;
}
.placement-feature-icon svg {
  width: 22px;
  height: 22px;
  display: block;
}
.placement-feature-card h4 {
  font-size: 16px;
  font-weight: 800;
  margin: 0 0 8px;
  color: #111827;
}
.placement-feature-card p {
  font-size: 13px;
  color: #6B7280;
  line-height: 1.45;
  margin: 0;
}
@media (max-width: 960px) {
  .placement-features-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}
@media (max-width: 650px) {
  .placement-features-grid {
    grid-template-columns: 1fr;
  }
  .placement-feature-card:hover {
    transform: none;
    box-shadow: 0 2px 8px rgba(23, 25, 29, 0.05), 0 1px 2px rgba(23, 25, 29, 0.04);
    border-color: #e8eaed;
  }
  .placement-feature-card:hover .placement-feature-icon {
    transform: none;
    background: #fff0f1;
    color: var(--red, #c81e2b);
  }
}
@media (prefers-reduced-motion: reduce) {
  .placement-feature-card,
  .placement-feature-card:hover,
  .placement-feature-icon,
  .placement-feature-card:hover .placement-feature-icon {
    transform: none !important;
    transition: none !important;
  }
}

/* Cookie Consent Banner styles removed */

/* ═══════════════════════════════════════════════════════════════
   EDNEX ACADEMY — COMPACT CHATBOT & WHATSAPP FLOATING WIDGETS
   Refined Launcher Sizes (50px desktop / 44px mobile)
   Compact Chat Window (340px width, max 70vh desktop / mobile-fit)
   ═══════════════════════════════════════════════════════════════ */
.ednex-floating-widgets {
  position: fixed;
  bottom: max(20px, env(safe-area-inset-bottom, 20px));
  right: max(20px, env(safe-area-inset-right, 20px));
  z-index: 99990;
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  pointer-events: none;
  font-family: 'Plus Jakarta Sans', Arial, -apple-system, sans-serif;
}

.ednex-launchers-stack {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 11px;
  pointer-events: auto;
}

/* Base Launcher Button (Desktop: ~50px) */
.ednex-launcher {
  position: relative;
  width: 50px;
  height: 50px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  border: none;
  cursor: pointer;
  box-shadow: 0 4px 14px rgba(0, 0, 0, 0.16), 0 1px 3px rgba(0, 0, 0, 0.08);
  transition: transform 0.2s cubic-bezier(0.16, 1, 0.3, 1), box-shadow 0.2s cubic-bezier(0.16, 1, 0.3, 1);
  text-decoration: none;
  color: #ffffff;
  padding: 0;
  outline: none;
  -webkit-tap-highlight-color: transparent;
}

.ednex-launcher:hover {
  transform: translateY(-2px) scale(1.03);
}

.ednex-launcher:focus-visible {
  outline: 2.5px solid #17191d;
  outline-offset: 3px;
}

/* WhatsApp Launcher (Green) */
.ednex-launcher-wa {
  background: linear-gradient(135deg, #25D366 0%, #1eb956 100%);
}

.ednex-launcher-wa:hover {
  box-shadow: 0 6px 20px rgba(37, 211, 102, 0.42), 0 2px 6px rgba(0, 0, 0, 0.1);
}

/* Robot Launcher Media (No circular container, fully transparent floating robot) */
.ednex-launcher-robot-pic {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
  border-radius: 0;
  overflow: visible;
  pointer-events: none;
}

.ednex-launcher-robot-img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  border-radius: 0;
  display: block;
  pointer-events: none;
  transform: none;
  filter: drop-shadow(0 4px 10px rgba(0, 0, 0, 0.22)) drop-shadow(0 1px 3px rgba(0, 0, 0, 0.12));
  transition: transform 0.25s cubic-bezier(0.16, 1, 0.3, 1), filter 0.25s cubic-bezier(0.16, 1, 0.3, 1);
}

/* Chatbot Launcher (Animated Robot Floating Directly Without Container/Circle) */
.ednex-launcher-chat {
  width: 62px;
  height: 62px;
  background: transparent !important;
  border: none !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  overflow: visible !important;
  padding: 0;
  margin: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
}

.ednex-launcher-chat:hover {
  transform: translateY(-3px) scale(1.06);
  box-shadow: none !important;
}

.ednex-launcher-chat:hover .ednex-launcher-robot-img {
  filter: drop-shadow(0 8px 16px rgba(239, 51, 64, 0.38)) drop-shadow(0 2px 5px rgba(0, 0, 0, 0.18));
}

.ednex-launcher-chat:focus-visible {
  outline: 2px dashed #ef3340;
  outline-offset: 4px;
  border-radius: 8px;
}

.ednex-launcher-chat .ednex-icon-close {
  display: none;
}

/* When Chat Window is Open -> Switch to Neat Red Circular Close Button */
.ednex-floating-widgets.is-open .ednex-launcher-chat {
  width: 48px;
  height: 48px;
  background: linear-gradient(135deg, #ef3340 0%, #d82330 100%) !important;
  border: none !important;
  border-radius: 50% !important;
  box-shadow: 0 4px 14px rgba(239, 51, 64, 0.4), 0 2px 6px rgba(0, 0, 0, 0.12) !important;
  margin-right: 4px;
}

.ednex-floating-widgets.is-open .ednex-launcher-chat:hover {
  transform: translateY(-2px) scale(1.04);
  box-shadow: 0 6px 18px rgba(239, 51, 64, 0.5), 0 3px 8px rgba(0, 0, 0, 0.15) !important;
}

.ednex-floating-widgets.is-open .ednex-launcher-chat .ednex-launcher-robot-pic {
  display: none;
}

.ednex-floating-widgets.is-open .ednex-launcher-chat .ednex-icon-close {
  display: block;
  color: #ffffff;
}

/* Desktop Hover Tooltip */
.ednex-launcher-tooltip {
  position: absolute;
  right: calc(100% + 10px);
  top: 50%;
  transform: translateY(-50%) translateX(4px);
  background: #17191d;
  color: #ffffff;
  font-size: 11.5px;
  font-weight: 600;
  padding: 5px 10px;
  border-radius: 6px;
  white-space: nowrap;
  pointer-events: none;
  opacity: 0;
  transition: opacity 0.2s ease, transform 0.2s ease;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
}

.ednex-launcher-tooltip::after {
  content: '';
  position: absolute;
  top: 50%;
  right: -4px;
  transform: translateY(-50%);
  border-width: 4px 0 4px 4px;
  border-style: solid;
  border-color: transparent transparent transparent #17191d;
}

@media (hover: hover) and (pointer: fine) {
  .ednex-launcher:hover .ednex-launcher-tooltip,
  .ednex-launcher:focus-visible .ednex-launcher-tooltip {
    opacity: 1;
    transform: translateY(-50%) translateX(0);
  }
}

/* ── Modern Chatbot Window ── */
.ednex-chat-window {
  pointer-events: auto;
  position: fixed !important;
  top: auto !important;
  right: 20px !important;
  right: max(20px, env(safe-area-inset-right, 20px)) !important;
  bottom: 136px !important;
  width: 380px;
  max-width: calc(100vw - 40px);
  height: 540px;
  max-height: calc(100vh - 156px);
  min-height: 360px;
  background: #ffffff;
  border: 1px solid rgba(0, 0, 0, 0.08);
  border-radius: 22px;
  box-shadow: 0 20px 50px rgba(0, 0, 0, 0.16), 0 2px 10px rgba(0, 0, 0, 0.05);
  display: flex;
  flex-direction: column;
  overflow: hidden;
  opacity: 0;
  transform: translateY(16px) scale(0.96);
  pointer-events: none;
  visibility: hidden;
  transition: opacity 0.25s cubic-bezier(0.16, 1, 0.3, 1),
              transform 0.25s cubic-bezier(0.16, 1, 0.3, 1),
              visibility 0.25s cubic-bezier(0.16, 1, 0.3, 1);
  z-index: 99990;
}

.ednex-floating-widgets.is-open .ednex-chat-window {
  opacity: 1;
  transform: translateY(0) scale(1);
  pointer-events: auto;
  visibility: visible;
}

/* Chat Header */
.ednex-chat-header {
  background: linear-gradient(135deg, #ef3340 0%, #d82330 100%);
  border-bottom: 1px solid rgba(0, 0, 0, 0.06);
  padding: 9px 12px;
  display: flex;
  align-items: center;
  gap: 10px;
  position: relative;
  flex: 0 0 auto;
  box-sizing: border-box;
}

.ednex-chat-avatar {
  width: 44px;
  height: 44px;
  min-width: 44px;
  border-radius: 50%;
  background: #ffffff;
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.12), 0 0 0 1px rgba(255, 255, 255, 0.3);
  padding: 3px;
  box-sizing: border-box;
  flex-shrink: 0;
  overflow: hidden;
}

.ednex-chat-avatar-img {
  width: 90%;
  height: auto;
  max-height: 24px;
  object-fit: contain;
  display: block;
}

.ednex-chat-info {
  flex: 1;
  min-width: 0;
}

.ednex-chat-title {
  font-size: 13.5px;
  font-weight: 700;
  color: #ffffff;
  line-height: 1.2;
  letter-spacing: -0.2px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.ednex-chat-status {
  font-size: 11px;
  color: rgba(255, 255, 255, 0.9);
  display: flex;
  align-items: center;
  gap: 5px;
  margin-top: 2px;
}

.ednex-status-dot {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: #10b981;
  display: inline-block;
  box-shadow: 0 0 0 2px rgba(255, 255, 255, 0.4);
}

.ednex-chat-header-actions {
  display: flex;
  align-items: center;
  gap: 6px;
  flex-shrink: 0;
}

.ednex-chat-action-btn {
  width: 28px;
  height: 28px;
  border-radius: 50%;
  border: none;
  background: rgba(255, 255, 255, 0.2);
  color: #ffffff;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transition: background 0.15s, transform 0.15s;
  flex-shrink: 0;
  padding: 0;
}

.ednex-chat-action-btn:hover {
  background: rgba(255, 255, 255, 0.35);
  transform: scale(1.06);
}

.ednex-chat-action-btn:active {
  transform: scale(0.95);
}

/* Chat Body */
.ednex-chat-body {
  flex: 1 1 auto;
  min-height: 0;
  padding: 10px 12px;
  overflow-y: auto;
  overscroll-behavior: contain;
  -webkit-overflow-scrolling: touch;
  display: flex;
  flex-direction: column;
  gap: 8px;
  background: #fafbfc;
}

/* Bot Welcome Row */
.ednex-bot-welcome-row {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  margin-bottom: 1px;
}

.ednex-bot-face-avatar {
  width: 34px;
  height: 34px;
  min-width: 34px;
  border-radius: 50%;
  overflow: hidden;
  background: #ffebee;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  margin-top: 1px;
  box-shadow: 0 1px 4px rgba(239, 51, 64, 0.15);
}

.ednex-bot-face-avatar img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.ednex-welcome-bubble {
  background: #ffffff;
  border: 1px solid #f1f3f7;
  border-radius: 14px;
  padding: 8px 11px;
  font-size: 11.5px;
  line-height: 1.4;
  color: #1f2937;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.03);
}

.ednex-welcome-bubble p {
  margin: 0 0 4px;
}

.ednex-welcome-bubble p:last-child {
  margin-bottom: 0;
}

.ednex-highlight-brand {
  color: #ef3340;
  font-weight: 700;
}

/* 4 Modern Program Cards Grid */
.ednex-chat-prog-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 8px;
  margin: 2px 0 2px;
}

.ednex-prog-card {
  cursor: pointer;
  border-radius: 13px;
  padding: 8px 5px 8px 9px;
  display: flex;
  align-items: stretch;
  justify-content: space-between;
  position: relative;
  overflow: hidden;
  transition: transform 0.15s ease, box-shadow 0.15s ease;
}

.ednex-prog-card:hover {
  transform: translateY(-2px);
  box-shadow: 0 6px 14px rgba(0, 0, 0, 0.05);
}

.ednex-prog-card--dm {
  background: linear-gradient(135deg, #fff7f7 0%, #ffedf0 100%);
  border: 1px solid #ffccd2;
}

.ednex-prog-card--da {
  background: linear-gradient(135deg, #f7faff 0%, #edf4ff 100%);
  border: 1px solid #d8e6fc;
}

.ednex-prog-card--cs {
  background: linear-gradient(135deg, #f5fcf8 0%, #eaf8f2 100%);
  border: 1px solid #c9eedc;
}

.ednex-prog-card--fs {
  background: linear-gradient(135deg, #faf7ff 0%, #f1ecff 100%);
  border: 1px solid #e4d8fb;
}

.ednex-prog-content {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  flex: 1;
  min-width: 0;
  z-index: 2;
}

.ednex-prog-icon-badge {
  width: 22px;
  height: 22px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 4px;
  flex-shrink: 0;
}

.ednex-badge--dm { background: #ffe5e8; color: #ef3340; }
.ednex-badge--da { background: #e1edfe; color: #2563eb; }
.ednex-badge--cs { background: #d8f5e5; color: #059669; }
.ednex-badge--fs { background: #eee5fc; color: #7c3aed; }

.ednex-prog-name {
  font-size: 11px;
  font-weight: 800;
  color: #0f172a;
  line-height: 1.25;
  margin: 0 0 2px;
  letter-spacing: -0.2px;
}

.ednex-prog-desc {
  font-size: 8.8px;
  color: #64748b;
  line-height: 1.3;
  margin: 0 0 5px;
}

.ednex-prog-cta {
  display: inline-flex;
  align-items: center;
  gap: 3px;
  align-self: flex-start;
  padding: 3px 8px;
  border-radius: 999px;
  font-size: 9px;
  font-weight: 700;
  text-decoration: none;
  background: #ffeeef;
  color: #ef3340;
  border: 1px solid rgba(239, 51, 64, 0.15);
  transition: background 0.15s, color 0.15s, transform 0.15s;
}

.ednex-prog-cta--solid {
  background: #ef3340;
  color: #ffffff;
  border-color: #ef3340;
}

.ednex-prog-cta:hover {
  background: #ef3340;
  color: #ffffff;
  border-color: #ef3340;
  transform: scale(1.03);
}

.ednex-cta-arrow {
  font-size: 10px;
  line-height: 1;
}

.ednex-prog-visual {
  width: 60px;
  height: 60px;
  flex-shrink: 0;
  align-self: center;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-left: 2px;
  z-index: 1;
}

.ednex-prog-visual img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  display: block;
}

/* Advisor & WhatsApp Prominent Action Row */
.ednex-chat-action-row {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 8px;
  margin-top: 4px;
}

.ednex-chat-action-pill {
  border-radius: 12px;
  padding: 8px 10px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  font-size: 11.5px;
  font-weight: 700;
  font-family: inherit;
  cursor: pointer;
  text-decoration: none;
  border: none;
  transition: transform 0.15s ease, box-shadow 0.15s ease;
}

.ednex-chat-action-pill:hover {
  transform: translateY(-1px);
}

.ednex-pill-left {
  display: flex;
  align-items: center;
  gap: 6px;
}

.ednex-pill-chevron {
  font-size: 15px;
  line-height: 1;
  font-weight: 700;
}

.ednex-pill--advisor {
  background: linear-gradient(135deg, #ef3340 0%, #d82330 100%);
  color: #ffffff;
  box-shadow: 0 4px 10px rgba(239, 51, 64, 0.22);
}

.ednex-pill--advisor:hover {
  box-shadow: 0 6px 14px rgba(239, 51, 64, 0.32);
}

.ednex-pill--advisor .ednex-pill-chevron {
  color: #ffffff;
}

.ednex-pill--wa {
  background: #eefcf3;
  border: 1px solid #a7f3d0;
  color: #15803d;
  box-shadow: 0 2px 6px rgba(16, 185, 129, 0.08);
}

.ednex-pill--wa:hover {
  background: #e2f9ea;
  box-shadow: 0 4px 10px rgba(16, 185, 129, 0.16);
}

.ednex-pill--wa .ednex-pill-chevron {
  color: #16a34a;
}

/* Chat Messages */
.ednex-chat-msg {
  display: flex;
  flex-direction: column;
  max-width: 88%;
  animation: ednexMsgIn 0.2s ease-out;
}

@keyframes ednexMsgIn {
  from { opacity: 0; transform: translateY(6px); }
  to { opacity: 1; transform: translateY(0); }
}

.ednex-msg-bot {
  align-self: flex-start;
}

.ednex-msg-user {
  align-self: flex-end;
}

.ednex-msg-bubble {
  padding: 9px 12px;
  border-radius: 14px;
  font-size: 12.5px;
  line-height: 1.45;
}

.ednex-msg-bot .ednex-msg-bubble {
  background: #ffffff;
  color: #17191d;
  border: 1px solid #e2e8f0;
  border-top-left-radius: 4px;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.02);
}

.ednex-msg-user .ednex-msg-bubble {
  background: #ef3340;
  color: #ffffff;
  border-top-right-radius: 4px;
}

.ednex-msg-bubble p {
  margin: 0 0 6px;
}

.ednex-msg-bubble p:last-child {
  margin-bottom: 0;
}

.ednex-msg-bubble ul {
  margin: 4px 0 6px 16px;
  padding: 0;
}

.ednex-msg-bubble li {
  margin-bottom: 3px;
}

.ednex-msg-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-top: 8px;
}

.ednex-action-btn {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  background: #f8fafc;
  border: 1px solid #cbd5e1;
  border-radius: 8px;
  padding: 6px 10px;
  font-size: 11.5px;
  font-weight: 600;
  color: #0f172a;
  text-decoration: none;
  cursor: pointer;
  transition: all 0.15s ease;
  font-family: inherit;
}

.ednex-action-btn:hover {
  background: #ef3340;
  border-color: #ef3340;
  color: #ffffff;
}

.ednex-action-btn-wa {
  color: #166534;
  border-color: #bbf7d0;
  background: #f0fdf4;
}

.ednex-action-btn-wa:hover {
  background: #25D366;
  border-color: #25D366;
  color: #ffffff;
}

/* Typing Indicator */
.ednex-typing {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 8px 12px;
  background: #ffffff;
  border: 1px solid #e2e8f0;
  border-radius: 14px;
  border-top-left-radius: 4px;
  width: fit-content;
}

.ednex-typing span {
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background: #94a3b8;
  animation: ednexTyping 1.2s infinite ease-in-out;
}

.ednex-typing span:nth-child(2) {
  animation-delay: 0.2s;
}

.ednex-typing span:nth-child(3) {
  animation-delay: 0.4s;
}

@keyframes ednexTyping {
  0%, 80%, 100% { transform: scale(0.6); opacity: 0.4; }
  40% { transform: scale(1.1); opacity: 1; }
}

/* Quick Replies */
.ednex-quick-replies {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-top: 4px;
}

.ednex-quick-chip {
  background: #ffffff;
  color: #ef3340;
  border: 1.2px solid #ffd5da;
  border-radius: 100px;
  padding: 5px 10px;
  font-size: 11.5px;
  font-weight: 600;
  cursor: pointer;
  transition: all 0.15s ease;
  font-family: inherit;
  outline: none;
}

.ednex-quick-chip:hover {
  background: #ef3340;
  color: #ffffff;
  border-color: #ef3340;
}

/* Chat Footer & Input */
.ednex-chat-footer {
  padding: 8px 12px;
  background: #ffffff;
  border-top: 1px solid #f1f3f7;
  display: flex;
  align-items: center;
  gap: 8px;
  flex-shrink: 0;
}

.ednex-chat-input-pill {
  flex: 1;
  display: flex;
  align-items: center;
  gap: 6px;
  background: #ffffff;
  border: 1.2px solid #e2e8f0;
  border-radius: 999px;
  padding: 3px 10px;
  transition: border-color 0.15s ease;
}

.ednex-chat-input-pill:focus-within {
  border-color: #ef3340;
}

.ednex-chat-input-addon {
  color: #94a3b8;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}

.ednex-chat-input-pill .ednex-chat-input {
  flex: 1;
  border: none;
  background: transparent;
  padding: 5px 2px;
  font-size: 12px;
  color: #0f172a;
  outline: none;
  font-family: inherit;
}

.ednex-chat-send {
  width: 32px;
  height: 32px;
  border-radius: 50%;
  background: #ef3340;
  border: none;
  color: #ffffff;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  flex-shrink: 0;
  transition: background 0.15s, transform 0.15s;
  padding: 0;
}

.ednex-chat-send:hover {
  background: #d82330;
  transform: scale(1.05);
}

/* ── Mobile Viewports (< 768px) ── */
@media (max-width: 767px) {
  .ednex-floating-widgets {
    bottom: max(14px, env(safe-area-inset-bottom, 14px));
    right: max(14px, env(safe-area-inset-right, 14px));
  }
  .ednex-launcher {
    width: 46px;
    height: 46px;
  }
  .ednex-launcher-chat {
    width: 54px;
    height: 54px;
  }
  .ednex-floating-widgets.is-open .ednex-launcher-chat {
    width: 44px;
    height: 44px;
  }
  .ednex-launcher-wa svg {
    width: 24px;
    height: 24px;
  }
  .ednex-launcher-chat svg {
    width: 20px;
    height: 20px;
  }
  .ednex-chat-window {
    left: 12px;
    right: 12px;
    margin: 0 auto;
    width: calc(100vw - 24px);
    max-width: 380px;
    bottom: max(12px, env(safe-area-inset-bottom, 12px));
    top: auto;
    height: min(530px, calc(100dvh - 24px - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 12px)));
    max-height: calc(100dvh - 24px - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 12px));
    min-height: 320px;
    border-radius: 18px;
  }
  /* On mobile, when the chatbot is open, hide the launcher buttons to prevent overlapping */
  .ednex-floating-widgets.is-open .ednex-launchers-stack {
    display: none;
  }
  .ednex-chat-header {
    padding: 8px 12px;
    gap: 10px;
  }
  .ednex-chat-avatar {
    width: 40px;
    height: 40px;
    min-width: 40px;
    padding: 3px;
  }
  .ednex-chat-avatar-img {
    max-height: 22px;
  }
  .ednex-chat-title {
    font-size: 13px;
  }
}

/* Short height viewports on desktop/tablets */
@media (max-height: 700px) and (min-width: 768px) {
  .ednex-chat-window {
    bottom: 120px !important;
    height: calc(100vh - 136px) !important;
    max-height: calc(100vh - 136px) !important;
  }
}

/* ── Small Mobile Viewports (< 440px) ── */
@media (max-width: 440px) {
  .ednex-chat-prog-grid {
    grid-template-columns: 1fr;
    gap: 7px;
  }
  .ednex-prog-card {
    padding: 8px 10px;
  }
  .ednex-prog-name {
    font-size: 11.5px;
  }
  .ednex-prog-desc {
    font-size: 9.5px;
  }
  .ednex-prog-visual {
    width: 68px;
    height: 68px;
  }
  .ednex-chat-action-row {
    grid-template-columns: 1fr;
    gap: 6px;
  }
}

/* Motion Preferences */
@media (prefers-reduced-motion: reduce) {
  .ednex-launcher,
  .ednex-chat-window,
  .ednex-chat-msg,
  .ednex-quick-chip,
  .ednex-chat-send {
    transition: none !important;
    animation: none !important;
  }
  .ednex-launcher:hover {
    transform: none !important;
  }
}

/* ═══════════════════════════════════════════════════════════════
   EDNEX ACADEMY — PREMIUM TWO-COLUMN ENQUIRY POPUP (Reference Redesign)
   Left: Promotional Banner (~40%) | Right: Exact Enquiry Form (~60%)
   ═══════════════════════════════════════════════════════════════ */
.lead-modal {
  position: fixed;
  inset: 0;
  z-index: 99995;
  display: flex !important;
  align-items: center;
  justify-content: center;
  padding: 20px;
  visibility: hidden;
  opacity: 0;
  transition: opacity 0.25s cubic-bezier(0.16, 1, 0.3, 1), visibility 0.25s cubic-bezier(0.16, 1, 0.3, 1);
  box-sizing: border-box;
}

.lead-modal.is-open {
  visibility: visible;
  opacity: 1;
}

.lead-modal-backdrop {
  position: absolute;
  inset: 0;
  background: rgba(15, 23, 42, 0.72) !important;
  backdrop-filter: blur(8px) !important;
  -webkit-backdrop-filter: blur(8px) !important;
  cursor: pointer;
}

.lead-modal-dialog {
  position: relative;
  z-index: 2;
  display: flex !important;
  flex-direction: row !important;
  align-items: stretch !important;
  width: min(94vw, 860px) !important;
  max-width: 860px !important;
  max-height: min(92vh, 670px) !important;
  background: #ffffff !important;
  border-radius: 24px !important;
  box-shadow: 0 25px 80px rgba(0, 0, 0, 0.35), 0 0 0 1px rgba(255, 255, 255, 0.2) !important;
  overflow: hidden !important;
  padding: 0 !important;
  border: none !important;
  box-sizing: border-box !important;
}

/* Left Promotional Banner Column (~40-42%) */
.lead-modal-promo {
  flex: 0 0 42% !important;
  width: 42% !important;
  max-width: 42% !important;
  min-width: 0 !important;
  box-sizing: border-box !important;
  background: #ffffff !important;
  position: relative !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  overflow: hidden !important;
  border-right: 1px solid #fee2e2 !important;
}

.lead-modal-promo picture {
  width: 100% !important;
  height: 100% !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-width: 0 !important;
  box-sizing: border-box !important;
}

.lead-promo-img {
  width: 100% !important;
  height: 100% !important;
  object-fit: contain !important;
  object-position: center center !important;
  display: block !important;
  box-sizing: border-box !important;
}

/* Right Form Column (~58%) */
.lead-modal-body {
  flex: 0 0 58% !important;
  width: 58% !important;
  max-width: 58% !important;
  min-width: 0 !important;
  box-sizing: border-box !important;
  background: #ffffff !important;
  padding: 26px 30px 22px !important;
  overflow-y: auto !important;
  -webkit-overflow-scrolling: touch;
  display: flex !important;
  flex-direction: column !important;
}

/* Eyebrow & Titles */
.lead-modal-body .eyebrow {
  display: inline-block;
  font-size: 11px !important;
  font-weight: 800 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.8px !important;
  color: var(--red, #c81e2b) !important;
  background: #fff1ef !important;
  border: 1px solid #ffd5da !important;
  padding: 3px 10px !important;
  border-radius: 999px !important;
  margin-bottom: 8px !important;
  align-self: flex-start;
}

.lead-modal-body h2 {
  font-size: clamp(20px, 2.2vw, 24px) !important;
  font-weight: 800 !important;
  letter-spacing: -0.6px !important;
  line-height: 1.2 !important;
  color: #111827 !important;
  margin: 0 0 6px !important;
}

.lead-modal-body .lead-modal-intro {
  font-size: 13px !important;
  line-height: 1.45 !important;
  color: #4b5563 !important;
  margin: 0 0 16px !important;
}

/* Close (X) button */
.lead-modal-close {
  position: absolute !important;
  top: 14px !important;
  right: 14px !important;
  z-index: 10 !important;
  width: 32px !important;
  height: 32px !important;
  border-radius: 50% !important;
  background: #f3f4f6 !important;
  color: #4b5563 !important;
  font-size: 20px !important;
  line-height: 1 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  border: none !important;
  cursor: pointer !important;
  transition: background 0.2s, color 0.2s, transform 0.15s !important;
}

.lead-modal-close:hover {
  background: #fee2e2 !important;
  color: var(--red, #c81e2b) !important;
  transform: rotate(90deg);
}

/* Form & Fields */
.lead-modal-body .lead-form {
  display: grid !important;
  gap: 10px !important;
  width: 100% !important;
}

.lead-modal-body .lead-field-group {
  display: flex !important;
  flex-direction: column !important;
  gap: 4px !important;
  text-align: left !important;
}

.lead-modal-body .lead-field-group label {
  font-size: 12px !important;
  font-weight: 700 !important;
  color: #1f2937 !important;
  display: flex !important;
  align-items: center !important;
  gap: 3px !important;
}

.lead-modal-body .lead-field-group .required-star {
  color: var(--red, #c81e2b) !important;
  font-weight: 800 !important;
}

.lead-modal-body .lead-form input,
.lead-modal-body .lead-form select {
  width: 100% !important;
  height: 42px !important;
  padding: 8px 12px !important;
  border: 1.5px solid #e5e7eb !important;
  border-radius: 10px !important;
  background: #f9fafb !important;
  font-size: 13.5px !important;
  font-family: inherit !important;
  color: #111827 !important;
  box-sizing: border-box !important;
  outline: none !important;
  transition: border-color 0.2s ease, box-shadow 0.2s ease, background 0.2s ease !important;
}

.lead-modal-body .lead-form input:focus,
.lead-modal-body .lead-form select:focus {
  border-color: var(--red, #c81e2b) !important;
  background: #ffffff !important;
  box-shadow: 0 0 0 3px rgba(200, 30, 43, 0.14) !important;
}

.lead-modal-body .lead-form select {
  background-color: #f9fafb !important;
  background-image: url("data:image/svg+xml;charset=UTF-8,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23c81e2b' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3e%3cpolyline points='6 9 12 15 18 9'%3e%3c/polyline%3e%3c/svg%3e") !important;
  background-repeat: no-repeat !important;
  background-position: right 12px center !important;
  background-size: 15px 15px !important;
  -webkit-appearance: none !important;
  -moz-appearance: none !important;
  appearance: none !important;
  cursor: pointer !important;
  padding-right: 36px !important;
}

/* Prominent Red Pill CTA */
.lead-modal-body .lead-submit-btn {
  margin-top: 4px !important;
  height: 44px !important;
  width: 100% !important;
  padding: 10px 20px !important;
  font-size: 14.5px !important;
  font-weight: 700 !important;
  border-radius: 999px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 8px !important;
  cursor: pointer !important;
  background: var(--red, #c81e2b) !important;
  color: #ffffff !important;
  border: none !important;
  transition: background 0.2s ease, transform 0.15s ease, box-shadow 0.2s ease !important;
  box-shadow: 0 4px 14px rgba(200, 30, 43, 0.35) !important;
}

.lead-modal-body .lead-submit-btn:hover {
  background: #b51520 !important;
  transform: translateY(-1px) !important;
  box-shadow: 0 6px 18px rgba(200, 30, 43, 0.45) !important;
}

.lead-modal-body .lead-modal-later {
  border: 0 !important;
  background: transparent !important;
  color: #6b7280 !important;
  font-size: 12px !important;
  cursor: pointer !important;
  padding: 4px 0 !important;
  margin: 0 auto !important;
  display: block !important;
  text-decoration: underline !important;
  text-underline-offset: 3px !important;
  transition: color 0.18s !important;
}

.lead-modal-body .lead-modal-later:hover {
  color: #111827 !important;
}

.lead-form-status {
  min-height: 18px;
  margin: 2px 0 0;
  color: var(--muted);
  font-size: 11.5px;
  text-align: center;
}

.lead-form-status.is-success {
  display: block;
  color: #065f46;
  background: #d1fae5;
  border: 1px solid #a7f3d0;
  padding: 10px 12px;
  border-radius: 8px;
  font-size: 12.5px;
  font-weight: 600;
  line-height: 1.45;
  margin-top: 8px;
  text-align: center;
}

.lead-form-status.is-error {
  display: block;
  color: #991b1b;
  background: #fee2e2;
  border: 1px solid #fca5a5;
  padding: 8px 12px;
  border-radius: 8px;
  font-size: 12px;
  font-weight: 600;
  margin-top: 8px;
  text-align: center;
}

/* ═══════════════════════════════════════════════════════════════
   RESPONSIVE — Tablet & Mobile (<768px)
   ═══════════════════════════════════════════════════════════════ */
@media (max-width: 768px) {
  .lead-modal {
    padding: 12px !important;
    padding: max(12px, env(safe-area-inset-top, 12px)) max(12px, env(safe-area-inset-right, 12px)) max(12px, env(safe-area-inset-bottom, 12px)) max(12px, env(safe-area-inset-left, 12px)) !important;
  }
  .lead-modal-dialog {
    flex-direction: column !important;
    width: min(calc(100vw - 24px), 430px) !important;
    max-width: 430px !important;
    max-height: calc(100vh - 24px) !important;
    max-height: calc(100dvh - 24px) !important;
    overflow-y: auto !important;
    -webkit-overflow-scrolling: touch !important;
    overscroll-behavior: contain !important;
    border-radius: 20px !important;
  }
  .lead-modal-promo {
    flex: 0 0 auto !important;
    width: 100% !important;
    max-width: 100% !important;
    height: clamp(140px, 20vh, 170px) !important;
    min-height: 140px !important;
    max-height: 175px !important;
    border-right: none !important;
    border-bottom: 1px solid #fee2e2 !important;
    overflow: hidden !important;
    background: #ffffff !important;
  }
  .lead-modal-promo picture {
    width: 100% !important;
    height: 100% !important;
    display: block !important;
  }
  .lead-modal-promo .lead-promo-img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    object-position: center 2% !important;
    display: block !important;
  }
  .lead-modal-close {
    position: absolute !important;
    top: 10px !important;
    right: 10px !important;
    z-index: 25 !important;
    background: rgba(255, 255, 255, 0.95) !important;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.2) !important;
  }
  .lead-modal-body {
    flex: 1 1 auto !important;
    width: 100% !important;
    max-width: 100% !important;
    padding: 16px 18px 20px !important;
    overflow-y: visible !important;
  }
  .lead-modal-body h2 {
    font-size: 19px !important;
    line-height: 1.25 !important;
    margin: 0 0 4px !important;
  }
  .lead-modal-body .lead-modal-intro {
    font-size: 12px !important;
    line-height: 1.4 !important;
    margin-bottom: 10px !important;
  }
  .lead-modal-body .lead-form {
    gap: 8px !important;
  }
  .lead-modal-body .lead-field-group {
    gap: 3px !important;
  }
  .lead-modal-body .lead-field-group label {
    font-size: 11.5px !important;
  }
  .lead-modal-body .lead-form input,
  .lead-modal-body .lead-form select {
    height: 40px !important;
    font-size: 13px !important;
    padding: 7px 11px !important;
  }
  .lead-modal-body .lead-submit-btn {
    height: 42px !important;
    font-size: 13.5px !important;
    margin-top: 2px !important;
  }
  .lead-modal-body .lead-modal-later {
    font-size: 11.5px !important;
    padding: 3px 0 !important;
  }
}

@media (max-width: 380px) {
  .lead-modal {
    padding: 8px !important;
  }
  .lead-modal-dialog {
    width: calc(100vw - 16px) !important;
  }
  .lead-modal-promo {
    height: 135px !important;
    min-height: 135px !important;
  }
  .lead-modal-body {
    padding: 14px 14px 18px !important;
  }
}




/* ═══════════════════════════════════════════════════════════════════════
   PART C — CROSS-DEVICE LAYOUT CONSISTENCY (October 2026 Audit)
   Target breakpoints: 320px · 375px · 390px · 430px · 768px · 1024px · 1440px
   ═══════════════════════════════════════════════════════════════════════ */

/* ── Global: prevent horizontal overflow on all viewports ── */
html, body {
  overflow-x: hidden;
  max-width: 100%;
}

/* ── Section containers: safe horizontal padding on all widths ── */
.section, .programs-section, .career-section,
.platform-transition-section, .proof-strip-v2,
.split-section, .dark-section, .cta {
  box-sizing: border-box;
}

/* ── Prevent any fixed-width element from causing horizontal scroll ── */
img, video, iframe, table {
  max-width: 100%;
}

/* ── PART D — SHARED STYLE TOKENS ──────────────────────────────────── */
/* All pill-rounded interactive buttons share consistent base properties */
.red-btn, .outline-btn, .program-explore-link, .lead-submit-btn {
  box-sizing: border-box;
  -webkit-tap-highlight-color: transparent;
  touch-action: manipulation;
}

/* ── Touch target minimum size (44×44px) for all interactive elements ── */
.role-chip, .programs-nav-btn, .career-control,
.hero-video-toggle, .ednex-launcher {
  -webkit-tap-highlight-color: transparent;
  touch-action: manipulation;
}

/* ── Consistent focus ring token across interactive elements ── */
.program-explore-link:focus-visible,
.red-btn:focus-visible,
.outline-btn:focus-visible {
  outline: 2px solid var(--red);
  outline-offset: 3px;
  border-radius: inherit;
}

/* ═══════════════════════════════════════════════════════════════════════
   TABLET LAYOUT FIXES (768px – 1024px)
   ═══════════════════════════════════════════════════════════════════════ */
@media (max-width: 1024px) and (min-width: 768px) {
  /* Programs grid: 2 columns at tablet — already at ≤1024px, confirm spacing */
  .programs-grid-v2 {
    grid-template-columns: repeat(2, 1fr);
    gap: 16px;
  }
  /* Career paths: prevent oversized gap on tablet */
  .career-paths-heading {
    flex-direction: column;
    align-items: flex-start;
    gap: 16px;
  }
  /* Proof strip: 2 columns on tablet */
  .proof-strip-inner {
    grid-template-columns: repeat(2, 1fr);
    gap: 16px;
  }
  /* Section padding: comfortable on tablet */
  .section {
    padding: 72px 24px;
  }
  /* Split section: reduce gap on tablet */
  .split-section {
    gap: 48px;
  }
  /* Journey / milestones: 3 columns on tablet */
  .journey {
    grid-template-columns: repeat(3, 1fr);
  }
}

/* ═══════════════════════════════════════════════════════════════════════
   MOBILE LAYOUT FIXES (320px – 767px)
   ═══════════════════════════════════════════════════════════════════════ */
@media (max-width: 767px) {
  /* Ensure body has no side overflow */
  body {
    overflow-x: hidden;
  }

  /* Section padding: tighter on phone */
  .section {
    padding: 52px 16px;
  }
  .section h2 {
    font-size: clamp(24px, 7vw, 32px);
    letter-spacing: -1.2px;
  }

  /* Resource grid: single column */
  .resource-grid {
    grid-template-columns: 1fr;
    gap: 12px;
  }

  /* Career paths: single column on phone */
  .career-paths-heading {
    flex-direction: column;
    align-items: flex-start;
    gap: 14px;
    margin-bottom: 20px;
  }
  .career-controls {
    align-self: flex-start;
  }

  /* Proof bar: 2 columns */
  .proof {
    grid-template-columns: repeat(2, 1fr);
    gap: 14px;
  }

  /* CTA banner: full-width on mobile */
  .cta {
    flex-direction: column;
    align-items: flex-start;
    margin: 0 16px 52px;
    padding: 28px 24px;
  }
  .cta .outline-btn {
    margin-top: 18px;
    width: 100%;
    justify-content: center;
  }

  /* Footer: readable single-column layout */
  .footer-top {
    grid-template-columns: 1fr 1fr;
    gap: 24px;
    padding: 44px 16px 28px;
  }
  .footer-brand {
    grid-column: 1 / -1;
  }

  /* Journey / milestones: 2 columns on phone */
  .journey {
    grid-template-columns: 1fr 1fr;
  }
  .journey div {
    min-height: 110px;
    padding: 16px;
  }
  .journey strong {
    font-size: 16px;
  }

  /* Program cards: correct actions layout in single column */
  .program-card-actions {
    padding-top: 10px;
  }
  .program-explore-link {
    font-size: 13px;
    padding: 7px 14px;
  }
}

/* ═══════════════════════════════════════════════════════════════════════
   SMALL PHONE FIXES (≤430px)
   ═══════════════════════════════════════════════════════════════════════ */
@media (max-width: 430px) {
  /* Section spacing tighter */
  .section {
    padding: 44px 14px;
  }

  /* CTA: full bleed, no side margin */
  .cta {
    margin: 0 0 44px;
    border-radius: 0;
  }

  /* Footer columns: stack to single column */
  .footer-top {
    grid-template-columns: 1fr;
  }

  /* Journey: stack to single column */
  .journey {
    grid-template-columns: 1fr;
  }
  .journey div {
    min-height: 90px;
  }
}

/* ═══════════════════════════════════════════════════════════════════════
   EXTRA-SMALL PHONE FIXES (≤375px)
   ═══════════════════════════════════════════════════════════════════════ */
@media (max-width: 375px) {
  /* Section spacing: minimal on very small screens */
  .section {
    padding: 38px 12px;
  }
  /* Program card: slightly tighter body */
  .program-card.program-card-v2 .program-card-body {
    padding: 14px 14px 16px;
  }
  /* Lead form: tighter on 320px */
  .lead-form input,
  .lead-form select {
    height: 42px !important;
    font-size: 13px !important;
  }
  /* CTA block */
  .cta h2 {
    font-size: 24px;
  }
}

/* ═══════════════════════════════════════════════════════════════════════
   LARGE DESKTOP FIXES (≥1440px)
   ═══════════════════════════════════════════════════════════════════════ */
@media (min-width: 1440px) {
  /* Widen section max-width slightly to use extra space */
  .proof-strip-inner {
    max-width: 1280px;
  }
  .programs-section-header,
  .programs-grid-v2 {
    max-width: 1260px;
  }
}

/* ── END PART C & D LAYOUT AUDIT ── */

/* ═══════════════════════════════════════════════════════════════════════
   PART C — CROSS-DEVICE LAYOUT CONSISTENCY (October 2026 Audit)
   Target breakpoints: 320px · 375px · 390px · 430px · 768px · 1024px · 1440px
   ═══════════════════════════════════════════════════════════════════════ */

/* ── Global: prevent horizontal overflow on all viewports ── */
html, body {
  overflow-x: hidden;
  max-width: 100%;
}

/* ── Section containers: safe horizontal padding on all widths ── */
.section, .programs-section, .career-section,
.platform-transition-section, .proof-strip-v2,
.split-section, .dark-section, .cta {
  box-sizing: border-box;
}

/* ── Prevent any fixed-width element from causing horizontal scroll ── */
img, video, iframe, table {
  max-width: 100%;
}

/* ── PART D — SHARED STYLE TOKENS ──────────────────────────────────── */
/* All pill-rounded interactive buttons share consistent base properties */
.red-btn, .outline-btn, .program-explore-link, .lead-submit-btn {
  box-sizing: border-box;
  -webkit-tap-highlight-color: transparent;
  touch-action: manipulation;
}

/* ── Touch target minimum size (44×44px) for all interactive elements ── */
.role-chip, .programs-nav-btn, .career-control,
.hero-video-toggle, .ednex-launcher {
  -webkit-tap-highlight-color: transparent;
  touch-action: manipulation;
}

/* ── Consistent focus ring token across interactive elements ── */
.program-explore-link:focus-visible,
.red-btn:focus-visible,
.outline-btn:focus-visible {
  outline: 2px solid var(--red);
  outline-offset: 3px;
  border-radius: inherit;
}

/* ═══════════════════════════════════════════════════════════════════════
   TABLET LAYOUT FIXES (768px – 1024px)
   ═══════════════════════════════════════════════════════════════════════ */
@media (max-width: 1024px) and (min-width: 768px) {
  /* Programs grid: 2 columns at tablet — already at ≤1024px, confirm spacing */
  .programs-grid-v2 {
    grid-template-columns: repeat(2, 1fr);
    gap: 16px;
  }
  /* Career paths: prevent oversized gap on tablet */
  .career-paths-heading {
    flex-direction: column;
    align-items: flex-start;
    gap: 16px;
  }
  /* Proof strip: 2 columns on tablet */
  .proof-strip-inner {
    grid-template-columns: repeat(2, 1fr);
    gap: 16px;
  }
  /* Section padding: comfortable on tablet */
  .section {
    padding: 72px 24px;
  }
  /* Split section: reduce gap on tablet */
  .split-section {
    gap: 48px;
  }
  /* Journey / milestones: 3 columns on tablet */
  .journey {
    grid-template-columns: repeat(3, 1fr);
  }
}

/* ═══════════════════════════════════════════════════════════════════════
   MOBILE LAYOUT FIXES (320px – 767px)
   ═══════════════════════════════════════════════════════════════════════ */
@media (max-width: 767px) {
  /* Ensure body has no side overflow */
  body {
    overflow-x: hidden;
  }

  /* Section padding: tighter on phone */
  .section {
    padding: 52px 16px;
  }
  .section h2 {
    font-size: clamp(24px, 7vw, 32px);
    letter-spacing: -1.2px;
  }

  /* Resource grid: single column */
  .resource-grid {
    grid-template-columns: 1fr;
    gap: 12px;
  }

  /* Career paths: single column on phone */
  .career-paths-heading {
    flex-direction: column;
    align-items: flex-start;
    gap: 14px;
    margin-bottom: 20px;
  }
  .career-controls {
    align-self: flex-start;
  }

  /* Proof bar: 2 columns */
  .proof {
    grid-template-columns: repeat(2, 1fr);
    gap: 14px;
  }

  /* CTA banner: full-width on mobile */
  .cta {
    flex-direction: column;
    align-items: flex-start;
    margin: 0 16px 52px;
    padding: 28px 24px;
  }
  .cta .outline-btn {
    margin-top: 18px;
    width: 100%;
    justify-content: center;
  }

  /* Footer: readable single-column layout */
  .footer-top {
    grid-template-columns: 1fr 1fr;
    gap: 24px;
    padding: 44px 16px 28px;
  }
  .footer-brand {
    grid-column: 1 / -1;
  }

  /* Journey / milestones: 2 columns on phone */
  .journey {
    grid-template-columns: 1fr 1fr;
  }
  .journey div {
    min-height: 110px;
    padding: 16px;
  }
  .journey strong {
    font-size: 16px;
  }

  /* Program cards: correct actions layout in single column */
  .program-card-actions {
    padding-top: 10px;
  }
  .program-explore-link {
    font-size: 13px;
    padding: 7px 14px;
  }
}

/* ═══════════════════════════════════════════════════════════════════════
   SMALL PHONE FIXES (≤430px)
   ═══════════════════════════════════════════════════════════════════════ */
@media (max-width: 430px) {
  /* Section spacing tighter */
  .section {
    padding: 44px 14px;
  }

  /* CTA: full bleed, no side margin */
  .cta {
    margin: 0 0 44px;
    border-radius: 0;
  }

  /* Footer columns: stack to single column */
  .footer-top {
    grid-template-columns: 1fr;
  }

  /* Journey: stack to single column */
  .journey {
    grid-template-columns: 1fr;
  }
  .journey div {
    min-height: 90px;
  }
}

/* ═══════════════════════════════════════════════════════════════════════
   EXTRA-SMALL PHONE FIXES (≤375px)
   ═══════════════════════════════════════════════════════════════════════ */
@media (max-width: 375px) {
  /* Section spacing: minimal on very small screens */
  .section {
    padding: 38px 12px;
  }
  /* Program card: slightly tighter body */
  .program-card.program-card-v2 .program-card-body {
    padding: 14px 14px 16px;
  }
  /* Lead form: tighter on 320px */
  .lead-form input,
  .lead-form select {
    height: 42px !important;
    font-size: 13px !important;
  }
  /* CTA block */
  .cta h2 {
    font-size: 24px;
  }
}

/* ═══════════════════════════════════════════════════════════════════════
   LARGE DESKTOP FIXES (≥1440px)
   ═══════════════════════════════════════════════════════════════════════ */
@media (min-width: 1440px) {
  /* Widen section max-width slightly to use extra space */
  .proof-strip-inner {
    max-width: 1280px;
  }
  .programs-section-header,
  .programs-grid-v2 {
    max-width: 1260px;
  }
}

/* ── END PART C & D LAYOUT AUDIT ── */

/* --- Pay Now Nav Item --- */
.nav-link-paynow {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  color: var(--red, #c81e2b) !important;
  font-weight: 800 !important;
  position: relative;
  transition: color 0.2s ease, transform 0.15s ease;
}
.nav-link-paynow:hover {
  color: var(--red-dark, #b51520) !important;
  transform: translateY(-1px);
}
.nav-link-paynow-dot {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--red, #c81e2b);
  display: inline-block;
  box-shadow: 0 0 0 2px rgba(200, 30, 43, 0.2);
}

/* ═══════════════════════════════════════════════════════════════════════
   LIGHTWEIGHT 2-COLUMN PROGRAMS DROPDOWN (12 VISIBLE ITEMS)
   ═══════════════════════════════════════════════════════════════════════ */
.nav-dropdown {
  position: relative;
}

.floating-header .nav-dropdown .nav-submenu.nav-dropdown-2col {
  width: 450px;
  max-width: min(92vw, 480px);
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: stretch;
  gap: 0;
  padding: 8px 10px;
  background: #ffffff;
  border: 1px solid var(--line, #e5e6e8);
  border-radius: 12px;
  box-shadow: 0 16px 36px rgba(23, 25, 29, 0.1);
  box-sizing: border-box;
}

.floating-header .nav-dropdown-col {
  display: flex;
  flex-direction: column;
  gap: 2px;
}

.floating-header .nav-dropdown-divider {
  width: 1px;
  background: var(--line, #e5e6e8);
  margin: 4px 8px;
}

.floating-header .nav-dropdown-col a {
  display: block;
  padding: 9px 12px !important;
  border-radius: 8px;
  font-size: 13.5px !important;
  font-weight: 600 !important;
  color: #17191d !important;
  line-height: 1.35 !important;
  white-space: nowrap;
  transition: background 0.15s ease, color 0.15s ease !important;
}

.floating-header .nav-dropdown-col a:hover,
.floating-header .nav-dropdown-col a:focus-visible {
  background: #fff1ef !important;
  color: var(--red, #c81e2b) !important;
}

/* Mobile Responsive */
@media (max-width: 900px) {
  .floating-header.mobile-open .nav-dropdown .nav-submenu.nav-dropdown-2col {
    width: 100% !important;
    max-width: 100% !important;
    grid-template-columns: 1fr;
    gap: 6px;
    padding: 6px !important;
    background: #f8fafc !important;
    border: none !important;
    box-shadow: none !important;
  }
  .floating-header.mobile-open .nav-dropdown-divider {
    height: 1px;
    width: 100%;
    margin: 4px 0;
    background: #e2e8f0;
  }
}

/* ═══════════════════════════════════════════════════════════════════════
   FOOTER BRANDING & ATTRIBUTION
   ═══════════════════════════════════════════════════════════════════════ */
.footer-brand .logo {
  display: block;
  width: auto;
  max-width: 175px;
  margin-bottom: 16px;
}

.footer-brand .footer-logo-img {
  display: block;
  width: 100%;
  max-width: 175px;
  height: auto;
  object-fit: contain;
  background: transparent !important;
}

.footer-attribution-wrap {
  display: flex;
  flex-direction: column;
  gap: 3px;
  align-items: flex-start;
  text-align: left;
}

.footer-company-attribution {
  font-family: inherit;
  font-size: 13px;
  font-weight: 600;
  line-height: 1.4;
  letter-spacing: -0.1px;
}

.footer-company-attribution .brand-ednex {
  color: var(--red, #c81e2b);
  font-weight: 700;
}

.footer-company-attribution .parent-company {
  color: #d1d5db;
  font-weight: 500;
}

.footer-bottom {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 20px;
}

@media (max-width: 768px) {
  .footer-bottom {
    flex-direction: column;
    gap: 12px;
  }
}

/* ═══════════════════════════════════════════════════════════════════════
   BODY LOCK & CHATBOT PROTECTION WHEN MOBILE MENU IS OPEN
   ═══════════════════════════════════════════════════════════════════════ */
body.mobile-menu-active {
  overflow: hidden !important;
  touch-action: none !important;
  overscroll-behavior: none !important;
}

body.mobile-menu-active .ednex-floating-widgets {
  opacity: 0 !important;
  pointer-events: none !important;
  visibility: hidden !important;
  transition: opacity 0.2s ease, visibility 0.2s ease !important;
}