:root{--brand:#3885AF;--brand-600:#3885AF;--ink:#000000;--muted:#64748B;--bg:#F5F7FB;--card:#FFFFFF;--radius:14px;--shadow:0 10px 30px rgba(2, 6, 23, .06);--bp-lg:1200px;--bp-md:980px;--bp-sm:720px;--bp-xs:480px;--space:clamp(16px, 2vw, 28px);--vh:1vh;--header-h:0px}.section-full{min-height:100vh;width:100%;scroll-snap-align:start;position:relative}.section-full{color:#fff}.hero-inner{position:relative;z-index:2;max-width:1200px;margin:0 auto;padding:clamp(40px,6vw,80px) clamp(16px,4%,60px) clamp(60px,10%,120px);display:grid;grid-template-columns:1fr 1fr;align-items:center}.hero-copy{max-width:clamp(280px,90%,520px)}.hero-lines-layer{position:absolute;inset:0;z-index:1;pointer-events:none;background-image:linear-gradient(to right,rgba(255,255,255,.08) 1px,transparent 1px),linear-gradient(to bottom,rgba(255,255,255,.05) 1px,transparent 1px);background-size:72px 72px;mask-image:radial-gradient(circle at 70% 50%,#000 0%,transparent 70%)}.hero-lines-layer::after{content:"";position:absolute;right:18%;top:0;bottom:0;width:2px;opacity:.7;filter:blur(.2px);background:linear-gradient(to bottom,transparent,#facc15,transparent);opacity:.8}.hero-bg-logo{position:absolute;inset:0;background:url("../img/Logomedelec.png") no-repeat center;background-size:min(55vw,460px);opacity:.06;filter:blur(.5px);z-index:0;pointer-events:none}.hero-corporate-section .hero-title{font-size:clamp(3rem, 5vw, 4.4rem);font-weight:800;line-height:1.05;letter-spacing:-.03em;color:#fff;margin-bottom:34px}.hero-corporate-section .hero-title span{display:block;margin-top:18px;color:#e5e7eb;font-weight:600;font-size:.65em}.hero-corporate-section .hero-subtitle{margin-top:22px;font-size:1.05rem;line-height:1.8;color:#d1d5db;max-width:520px;position:relative}.hero-corporate-section .hero-subtitle::before{content:"";display:block;width:42px;height:2px;background:#facc15;margin-bottom:14px;border-radius:2px}@media (max-width:900px){.hero-inner{grid-template-columns:1fr;padding:clamp(60px,8%,100px) clamp(16px,4%,40px) clamp(60px,8%,100px);text-align:center}.hero-copy{margin:0 auto;max-width:clamp(250px,95%,520px)}.hero-lines-layer{opacity:.35;mask-image:radial-gradient(circle at 50% 40%,#000 0%,transparent 80%)}.hero-corporate-section .hero-title{font-size:clamp(1.8rem, 7vw, 3.2rem);margin-bottom:clamp(16px,3%,24px)}}@media (min-width:1200px){.hero-lines-layer{background-size:64px 96px}}.hero-corporate-section .hero-animate-title{opacity:0;animation:heroTitleSlide 1.2s cubic-bezier(.22,1,.36,1) forwards;animation-delay:.3s;animation-play-state:paused}.hero-corporate-section .hero-animate-subtitle{opacity:0;animation:heroSubtitleFade 1s ease-out forwards;animation-delay:.8s;animation-play-state:paused}body.loader-complete .hero-animate-subtitle,body.loader-complete .hero-corporate-section .hero-animate-title{animation-play-state:running}@keyframes heroTitleSlide{from{opacity:0;transform:translateY(40px)}to{opacity:1;transform:translateY(0)}}@keyframes heroSubtitleFade{from{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.hero-video-section{position:relative;width:100%;height:100vh;min-height:927px;overflow:hidden;background:radial-gradient(circle at 20% 20%,#0b5e92 0,#064577 45%,#032542 75%,#010d1a 100%);display:flex;align-items:center;justify-content:center}.hero-content{position:relative;padding-top:40px;z-index:2;text-align:center;color:#fff;max-width:900px;padding:40px 24px}.cta-before-footer,.hero-video-section{display:flex;align-items:center;justify-content:center}.medelec-hero-content{position:absolute;text-align:center;color:#fff;z-index:10}.medelec-logo{width:160px;margin-bottom:20px;animation:fadeIn 1.8s ease forwards 1s}.medelec-title{font-size:3rem;font-weight:800;line-height:1.2;opacity:0;animation:fadeInUp 1.8s ease forwards 1.5s}@keyframes fadeIn{from{opacity:0;filter:blur(6px)}to{opacity:1;filter:blur(0)}}@keyframes fadeInUp{from{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}@media(max-width:700px){.medelec-title{font-size:clamp(1.4rem, 5vw, 2rem)}.medelec-logo{width:clamp(80px,25%,120px)}}@keyframes gridDrift{0%{background-position:0 0,0 0}100%{background-position:80px 120px,120px 80px}}.hero-lines-layer{}@keyframes heroBreath{0%{filter:brightness(1)}50%{filter:brightness(1.04)}100%{filter:brightness(1)}}.hero-video-section{}@keyframes lineFlow{0%{opacity:.3}50%{opacity:.9}100%{opacity:.3}}.hero-lines-layer::after{}@media (prefers-reduced-motion:reduce){.hero-lines-layer,.hero-video-section{animation:none!important}}.btn{display:inline-block;border-radius:999px;font-weight:700;text-decoration:none;padding:12px 20px;box-shadow:var(--shadow)}.btn-ghost{background:0 0;color:#fff;border:2px solid #fff}.btn-ghost:hover{background:rgba(255,255,255,.08)}.reveal{opacity:0;transform:translateY(10px);transition:opacity .7s ease,transform .7s ease}.reveal.show{opacity:1;transform:none}.reveal.d0{transition-delay:.05s}.reveal.d1{transition-delay:.18s}.reveal.d2{transition-delay:.32s}.img-wrapper{width:500px;height:500px;background:#e5e7eb url("../img/placeholder.svg") center/40px no-repeat}.img-wrapper img{width:100%;height:100%;object-fit:cover;display:block}.header--transparent{background:0 0;border-bottom:none}.about-block{background:#fff}.about-wrap{max-width:1200px;margin:0 auto;padding:clamp(48px,7%,96px) clamp(16px,4%,60px)}.about-grid{display:grid;grid-template-columns:1fr auto 1.2fr;align-items:center;gap:clamp(32px,5%,48px)}.about-grid::before{content:"";position:absolute;left:50%;top:20%;bottom:20%;width:2px;background:linear-gradient(to bottom,transparent,#0b5e92,transparent)}.about-quote{position:relative;align-self:stretch;padding:clamp(16px,1.8vw,22px);border-radius:12px;overflow:hidden;display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;gap:12px;border-right:0}.about-quote .quote-bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:0;filter:none}.about-quote::after{content:"";position:absolute;inset:0;z-index:0;background:rgba(0,0,0,.35)}.about-quote>:not(.quote-bg){position:relative;z-index:1}.quote-text{font-family:Georgia,"Times New Roman",serif;font-style:italic;font-size:1.05rem;font-weight:600;line-height:1.4;color:#fff;margin:0}.quote-author{font-style:normal;color:#e8eef5;margin-top:8px;font-size:.85rem;opacity:.85}.about-quote{position:relative;border-radius:18px;overflow:hidden}.about-quote::after{content:"";position:absolute;inset:0;background:linear-gradient(to bottom,rgba(0,0,0,.55),rgba(0,0,0,.25))}.about-main{padding-left:clamp(12px,2vw,24px)}.about-title{font-size:clamp(32px, 4vw, 48px);letter-spacing:-.02em;margin-bottom:18px;color:#000}.about-title::after{content:"";display:block;width:48px;height:3px;background:#0b5e92;margin-top:12px}.about-text p{margin:0 0 12px;color:#475569;line-height:1.7;max-width:70ch}.about-text strong{display:block;margin:16px 0 6px;font-size:.9rem;letter-spacing:.12em;text-transform:uppercase;color:#0b5e92}@media (max-width:992px){.about-grid{grid-template-columns:1fr}.about-main{padding-left:0}.about-quote{margin-bottom:12px}}.reveal-about .about-main,.reveal-about .about-quote{opacity:0;transition:opacity .9s ease,transform .9s cubic-bezier(.22, 1, .36, 1)}.reveal-about .about-quote{transform:translateX(-60px)}.reveal-about .about-main{transform:translateY(40px)}.reveal-about.is-visible .about-main,.reveal-about.is-visible .about-quote{opacity:1;transform:none}.reveal-about.is-visible .about-main{transition-delay:0.2s}@media (max-width:768px){.reveal-about .about-quote{transform:translateY(30px)}}.reveal{opacity:0}.reveal.from-left{transform:translateX(-40px)}.reveal.from-bottom{transform:translateY(24px)}.reveal.show{opacity:1;transform:none;transition:opacity .6s ease,transform .6s ease}.about-divider{width:2px;height:0;background:linear-gradient(to bottom,transparent,#0b5e92,transparent);align-self:center;justify-self:center;opacity:0}.about-divider.is-visible{height:60%;opacity:1;transition:height .9s ease,opacity .9s ease}@media (max-width:992px){#about .about-divider{display:none!important}#about .about-grid::after,#about .about-grid::before{content:none!important;display:none!important}#about .about-grid{grid-template-columns:1fr!important}}.services{background:#000;color:#fff;min-height:100vh;display:flex;align-items:center;justify-content:center;position:relative;z-index:1}.services .container{width:100%}.services-head-link a{display:inline-block;text-decoration:none;color:inherit}.services-head-link h2{display:inline-flex;align-items:center;gap:12px;cursor:pointer;position:relative}.services-head-link .arrow{font-size:.9em;opacity:.5;transform:translateX(0);transition:transform .25s ease,opacity .25s ease}.services-head-link h2::after{content:"";position:absolute;left:0;bottom:-8px;width:0%;height:3px;background:#facc15;transition:width .35s ease}.services-head-link a:focus-visible h2::after,.services-head-link a:hover h2::after{width:100%}.services-head-link a:focus-visible .arrow,.services-head-link a:hover .arrow{transform:translateX(6px);opacity:1}.services-head-link a:hover{transform:translateY(-1px)}.services-head{text-align:center;margin-bottom:80px}.services-head h2{font-size:clamp(36px, 5vw, 56px);font-weight:900;line-height:1.08;letter-spacing:-.01em;color:#fff;margin:0 0 12px}.services-head .accent{color:#fff}.services-head p{color:#cbd5e1;margin:6px 0 0;text-align:center}.service-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:clamp(16px,2%,22px);max-width:1280px;margin:0 auto;width:100%;padding:0 clamp(16px,4%,60px)}@media (max-width:768px){.service-grid{grid-template-columns:1fr;gap:clamp(16px,3%,24px)}}.service-card{display:block;text-decoration:none;color:inherit;background:#0a0a0a;position:relative;z-index:2;border:1px solid #334155;border-radius:16px;overflow:hidden;opacity:1!important;transform:none!important;visibility:visible!important;transition:transform .25s ease,box-shadow .25s ease,border-color .25s ease}.service-card:focus-visible,.service-card:hover{transform:translateY(0) scale(1.04);border-color:#facc15;box-shadow:0 16px 40px rgba(0,0,0,.45)}.service-image{height:clamp(150px,25vw,180px);background:#1f2937;overflow:hidden}.service-image img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .45s ease}.service-card:hover .service-image img{transform:scale(1.08)}.service-content{padding:22px}.service-content h3{margin:8px 0 10px;font-size:20px;font-weight:700}.service-content p{color:#d1d5db;margin:0;line-height:1.6}.service-card{transition:opacity .6s ease,transform .6s cubic-bezier(.22, 1, .36, 1)}.service-card.is-visible{opacity:1;transform:translateY(0)}.service-card:first-child{transition-delay:50ms}.service-card:nth-child(2){transition-delay:0.15s}.service-card:nth-child(3){transition-delay:0.25s}.service-card:nth-child(4){transition-delay:0.35s}.service-card:nth-child(5){transition-delay:0.45s}.service-card:nth-child(6){transition-delay:0.55s}@media (max-width:1200px){.service-grid{grid-template-columns:repeat(3,1fr)}}@media (max-width:992px){.service-grid{grid-template-columns:repeat(1,1fr)}}@media (max-width:768px){.services{min-height:auto;padding:80px 0}.services-head{margin-bottom:48px}.service-grid{grid-template-columns:repeat(1,1fr)}.service-image{height:160px}.service-card:hover{transform:none}.services-title-link a{padding:4px 0}}.fw-overlay{position:relative}.fw-overlay::before{content:"";position:absolute;left:-127px;top:50%;transform:translateY(-50%);width:520px;height:520px;background:url("../img/Logomedelec.png") no-repeat center/contain;opacity:.12;pointer-events:none;z-index:0}.fw-overlay::before{filter:blur(1px)}.fw-overlay>*{position:relative;z-index:1}.careers-section{position:relative;width:100%;margin-top:80px}.careers-section::before{content:"";position:absolute;top:-60px;left:0;width:100%;height:60px;background:#fff;border-bottom-left-radius:80% 100%;border-bottom-right-radius:80% 100%}.fullwidth-feature{position:relative;min-height:540px;overflow:hidden}.fw-bg{position:absolute;inset:0;background-size:cover;background-position:center;z-index:1}.fw-overlay{position:relative;z-index:2;height:100%;background:radial-gradient(circle at 20% 20%,#0b5e92 0,#064577 40%,#032542 70%,#010d1a 100%);display:flex;align-items:center}.fw-container{max-width:1200px;margin:0 auto;padding:clamp(60px,10%,120px) clamp(16px,4%,60px);width:100%;display:grid;grid-template-columns:1fr 1fr;gap:clamp(48px,8%,80px)}.fw-eyebrow{display:inline-block;margin-bottom:18px;font-size:.8rem;letter-spacing:.12em;text-transform:uppercase;color:#dbeafe;font-weight:600}.fw-left h2{font-size:3rem;line-height:1.15;color:#fff;font-weight:700}.fw-right p{font-size:1.05rem;line-height:1.7;color:#e5e7eb;margin-bottom:18px;max-width:520px}.fw-cta{display:inline-flex;align-items:center;margin-top:24px;padding:14px 28px;border-radius:999px;background:#000;color:#fff;font-weight:600;text-decoration:none;transition:transform .25s ease,box-shadow .25s ease}.fw-cta:hover{transform:translateY(-2px);box-shadow:0 12px 30px rgba(255,255,255,.4)}.career-cta{transition:all .3s ease}.career-cta:hover{background:#fff;color:#0b5e92;box-shadow:0 12px 32px rgba(0,0,0,.25)}.careers-section::after{content:none;display:none}@media (max-width:768px){.careers-section{margin-top:56px}.careers-section::before{top:-40px;height:40px}.fullwidth-feature{min-height:auto}.fw-overlay{padding:40px 0;margin-top:64px}.fw-container{grid-template-columns:1fr;gap:40px;padding:80px 20px}.fw-left h2{font-size:clamp(2rem, 6vw, 2.6rem)}.fw-right p{max-width:none}}@media (max-width:768px){.fw-overlay::before{display:none}}.news.section-full{background:#000;padding:90px 0 80px;color:#e5e7eb;min-height:unset;margin-bottom:68px}.news-inner{max-width:1200px;margin:0 auto;padding:0 24px}.actualites-head{text-align:center;margin-bottom:36px}.actualites-head a{text-decoration:none;color:inherit;display:inline-block}.actualites-head h2{font-size:clamp(36px, 5vw, 48px);font-weight:800;letter-spacing:-.03em;display:inline-flex;align-items:center;gap:12px;position:relative;cursor:pointer}.actualites-head h2::after{content:"";position:absolute;left:0;bottom:-10px;width:0%;height:3px;background:#facc15;transition:width .35s ease}.actualites-head .arrow{font-size:.9em;opacity:.45;transition:transform .25s ease,opacity .25s ease}.actualites-head a:hover h2::after{width:100%}.actualites-head a:hover .arrow{transform:translateX(6px);opacity:1}.actualites-head p{margin-top:14px;font-size:.95rem;color:#94a3b8}.news-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}.news-card{background:linear-gradient(to bottom,rgba(15,23,42,.95),rgba(2,6,23,.95));border-radius:14px;overflow:hidden;transition:transform .35s ease,box-shadow .35s ease}.news-card:hover{transform:translateY(-4px);box-shadow:0 14px 28px rgba(0,0,0,.45)}.news-media img{width:100%;height:120px;object-fit:cover;display:block}.news-body{padding:16px 18px 18px}.news-body .date{font-size:.7rem;color:#94a3b8;display:block;margin-bottom:6px}.news-body h3{font-size:.9rem;line-height:1.35;font-weight:600;margin-bottom:8px}.news-body h3 a{color:#e5e7eb;text-decoration:none}.news-body h3 a:hover{text-decoration:underline}.news-body .btn-link{font-size:.75rem;font-weight:500;color:#94a3b8;text-decoration:none;display:inline-flex;align-items:center;gap:4px}.news-body .btn-link span{font-size:.85em;transition:transform .2s ease}.news-body .btn-link:hover{color:#facc15}.news-body .btn-link:hover span{transform:translateX(3px)}@media (max-width:980px){.news-grid{grid-template-columns:repeat(2,1fr)}}@media (max-width:640px){.news.section-full{padding:90px 0 80px}.news-grid{grid-template-columns:1fr}.actualites-head h2{font-size:clamp(28px, 8vw, 34px)}}.references{background:#fff;color:#0f172a;min-height:100vh;display:flex;align-items:center;padding:0!important}.references>.container{width:100%;max-width:1400px;margin:0 auto;padding:clamp(40px,5%,80px) clamp(16px,4%,60px);display:flex;flex-direction:column;justify-content:center}.references-title-link a{display:inline-flex;align-items:center;gap:14px;font-size:clamp(2.6rem, 5vw, 3.4rem);font-weight:800;line-height:1.05;color:#0f172a;text-decoration:none;position:relative}.references-title-link a::after{content:"";position:absolute;left:0;bottom:-10px;width:0%;height:4px;background:#facc15;transition:width .35s ease}.references-title-link .arrow{font-size:.7em;opacity:.4;transition:transform .25s ease,opacity .25s ease}.references-title-link a:hover::after{width:100%}.references-title-link a:hover .arrow{transform:translateX(6px);opacity:1}@media (max-width:980px){.references-title-link a{gap:0}.references-title-link .arrow{position:absolute;left:calc(100% + 10px);top:50%;transform:translateY(-50%)}.references-title-link a:hover .arrow{transform:translate(6px,-50%)}}.references-head{max-width:60ch;position:relative;margin-top:clamp(30px,5%,60px);margin-bottom:clamp(24px,4%,40px)}.references-head::after{content:"";position:absolute;right:-32px;top:15%;width:1px;height:70%;background:linear-gradient(to bottom,transparent,rgba(15,23,42,.15),transparent)}.references .headline{font-size:clamp(2rem, 5vw, 72px);font-weight:800;letter-spacing:-.035em;line-height:1.1;color:#0f172a;margin-bottom:clamp(16px,3%,22px);margin-top:clamp(16px,3%,24px)}.references .lead{max-width:52ch;font-size:clamp(.95rem, 2vw, 16px);line-height:1.8;color:#475569;margin-bottom:clamp(12px,2%,16px)}.references .lead.small{margin-top:clamp(8px,1.5%,12px);color:#64748b;font-size:clamp(.9rem, 1.5vw, 14px)}.references-grid{display:grid;grid-template-columns:1fr 1.8fr;gap:clamp(30px,5%,88px);align-items:start}@media (max-width:768px){.references-grid{grid-template-columns:1fr;gap:clamp(24px,4%,40px)}}.references-gallery{display:grid;grid-template-columns:repeat(2,1fr);gap:clamp(24px,3%,32px)}@media (max-width:768px){.references-gallery{grid-template-columns:1fr;gap:clamp(18px,3%,24px)}}.ref-card{position:relative;border-radius:18px;overflow:hidden;aspect-ratio:16/10;box-shadow:0 10px 30px rgba(15,23,42,.1),0 30px 60px rgba(15,23,42,.15);transition:transform .45s ease,box-shadow .45s ease}.ref-card:hover{transform:translateY(-8px);box-shadow:0 20px 45px rgba(15,23,42,.18),0 50px 90px rgba(15,23,42,.22)}.ref-card img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block;transition:transform .6s ease,opacity .6s ease}.ref-card:hover img{transform:scale(1.08);opacity:.82}.ref-hover{position:absolute;inset:0;background:linear-gradient(to top,rgba(15,23,42,.65),rgba(15,23,42,.15));color:#fff;display:flex;flex-direction:column;justify-content:center;align-items:center;opacity:0;transition:opacity .4s ease}.ref-card:hover .ref-hover{opacity:1}.ref-hover .icon{margin-top:8px;font-size:22px;opacity:.9}.ref-hover{pointer-events:none}.ref-card a{pointer-events:auto}@media (max-width:980px){.references-grid{grid-template-columns:1fr;gap:clamp(30px,5%,40px)}.references-head{text-align:center;max-width:100%;margin-bottom:clamp(24px,4%,40px)}.references-head::after{display:none}.references .lead{margin:0 auto}.references-gallery{grid-template-columns:repeat(2,1fr);gap:clamp(18px,3%,24px)}}@media (max-width:640px){.references-gallery{grid-template-columns:1fr}}@media (max-width:640px){.references{padding:72px 0 64px;min-height:auto;display:block}.references-grid{grid-template-columns:1fr;gap:28px;align-items:start}.references-gallery{grid-template-columns:repeat(2,1fr);gap:16px}.ref-card{border-radius:14px;box-shadow:0 6px 18px rgba(15,23,42,.12)}.references>.container{padding-left:20px;padding-right:20px}.references .headline{font-size:clamp(28px, 9vw, 36px);text-align:center;max-width:14ch;margin-left:auto;margin-right:auto}.references .lead{text-align:center;max-width:100%}@media (max-width:640px){.references-cta{display:flex;justify-content:center;margin-top:28px}.references .references-cta a.cta-pill{padding:12px 26px;font-size:14px}}}@media (max-width:768px){section#references{padding-bottom:64px}}@font-face{font-family:HeinekenMedelec;src:url('../fonts/HEINEKEN.TTF') format('truetype');font-weight:400;font-style:normal;font-display:swap}.footer .brand-center h1{font-family:HeinekenMedelec,serif;font-size:3.4rem;font-weight:400;color:#fff;letter-spacing:.5px;text-transform:none;line-height:1}.cta-before-footer{padding:clamp(60px,10%,90px) clamp(16px,4%,60px)}.cta-container{position:center;text-align:center;max-width:clamp(300px,90%,700px);margin:0 auto}.cta-title{font-size:clamp(1.8rem, 5vw, 32px);font-weight:700;margin-bottom:clamp(8px,2%,10px);color:#000}.cta-subtitle{font-size:18px}.cta-btn{display:inline-block;background:#121212;color:#fff;padding:18px 40px;font-size:18px;border-radius:4px;text-decoration:none;transition:.3s;position:relative;z-index:50}.cta-btn:hover{background:#000}@media (max-width:768px){.cta-title{font-size:25px}}.references-gallery .ref-link{display:block;width:100%;height:100%}.cta-before-footer.section-full{position:relative;min-height:70vh;background:linear-gradient(to bottom,rgba(0,0,0,0.4),rgba(0,0,0,0.5)),url("../img/index/cta-engineering.jpg") center/cover no-repeat;display:flex;align-items:center;justify-content:center;margin-top:0}.cta-before-footer.section-full::after{content:"";position:absolute;inset:0;background:radial-gradient(ellipse at center,rgba(0,0,0,0) 20%,rgba(0,0,0,.5) 100%);pointer-events:none}.cta-container{position:relative;z-index:2;max-width:600px;padding:60px 40px;border-radius:24px;background:rgba(255,255,255,.1);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border:1px solid rgba(255,255,255,.2);box-shadow:0 30px 70px rgba(0,0,0,0.5);text-align:center;transform:translateY(0)}.cta-title{font-size:clamp(2.2rem, 5vw, 3rem);font-weight:800;line-height:1.1;letter-spacing:-0.02em;margin-bottom:16px;color:#fff}.cta-subtitle{font-size:1.1rem;opacity:0.9;margin-bottom:32px;color:#eee}.cta-btn{display:inline-block;background:#000;color:#fff;font-weight:700;letter-spacing:0.5px;padding:18px 48px;border-radius:12px;text-decoration:none;transition:all 0.3s ease;box-shadow:0 15px 35px rgba(0,0,0,0.4)}.cta-btn:hover{transform:translateY(-3px);box-shadow:0 20px 45px rgba(0,0,0,0.5);background:#111}#about{min-height:calc(100vh - 88px);display:flex;align-items:center}#about .about-wrap{width:100%}@media (max-width:900px){#about{align-items:flex-start}#about .about-wrap{padding-top:48px;padding-bottom:48px}}.reveal-cta{opacity:0;transform:translateY(32px) scale(.98);transition:opacity .7s ease,transform .7s cubic-bezier(.22, 1, .36, 1)}.reveal-cta.is-visible{opacity:1;transform:translateY(0) scale(1)}.reveal-cta .btn,.reveal-cta button{opacity:0;transform:translateY(12px);transition:opacity .45s ease,transform .45s ease;transition-delay:0.25s}.reveal-cta.is-visible .btn,.reveal-cta.is-visible button{opacity:1;transform:translateY(0)}.reveal-cta::after{content:"";position:absolute;inset:-20px;background:radial-gradient(circle,rgba(255,255,255,.08),transparent 60%);opacity:0;transition:opacity .6s ease;pointer-events:none}.reveal-cta.is-visible::after{opacity:1}

/* --- PREMIUM HERO SECTION OVERRIDES --- */

/* Inherited Capsule Header Globally from global.css */

/* Cinematic Hero Section */
.hero-corporate-section {
  position: relative;
  width: 100%;
  min-height: 100vh;
  overflow: hidden;
  background: #010a18;
  display: flex;
  align-items: center;
  padding-top: 100px;
  padding-bottom: 60px;
  z-index: 1;
}

/* Cinematic B2B radial backdrop */
.hero-bg-backdrop {
  position: absolute;
  inset: 0;
  background: radial-gradient(circle at 28% 40%, #042d4f 0%, #010a18 70%);
  z-index: 0;
}

/* Fine Technical Grid Mesh — Left Side Only, electric blue */
.hero-grid-mesh {
  position: absolute;
  inset: 0;
  z-index: 1;
  pointer-events: none;
  background-image: 
    linear-gradient(to right, rgba(14, 165, 233, 0.22) 1px, transparent 1px),
    linear-gradient(to bottom, rgba(14, 165, 233, 0.16) 1px, transparent 1px);
  background-size: 48px 48px;
  /* Subtle on left, disappears well before center */
  mask-image: linear-gradient(to right, black 0%, black 18%, rgba(0,0,0,0.3) 36%, transparent 55%);
  -webkit-mask-image: linear-gradient(to right, black 0%, black 18%, rgba(0,0,0,0.3) 36%, transparent 55%);
  opacity: 0.85;
}


/* Cinematic glowing auroras */
.hero-aurora {
  position: absolute;
  border-radius: 50%;
  filter: blur(140px);
  z-index: 1;
  pointer-events: none;
  opacity: 0.6;
}

/* Left aurora — careers palette: #0b5e92 tint, kept subtle */
.aurora-1 {
  width: 500px;
  height: 500px;
  background: radial-gradient(circle, rgba(11, 94, 146, 0.12) 0%, transparent 70%);
  top: -10%;
  left: 20%;
  animation: auroraFloat1 18s ease-in-out infinite alternate;
}

/* Right aurora — minimized so it doesn't bleed over the photo */
.aurora-2 {
  width: 600px;
  height: 600px;
  background: radial-gradient(circle, rgba(6, 69, 119, 0.05) 0%, transparent 70%);
  bottom: -15%;
  right: 15%;
  opacity: 0.2;
  animation: auroraFloat2 22s ease-in-out infinite alternate;
}

@keyframes auroraFloat1 {
  0% { transform: translate(0, 0) scale(1); }
  100% { transform: translate(40px, 30px) scale(1.1); }
}

@keyframes auroraFloat2 {
  0% { transform: translate(0, 0) scale(1); }
  100% { transform: translate(-30px, -40px) scale(1.05); }
}

/* Kinetic current flux flows overlay */
.flux-overlay {
  position: absolute;
  inset: 0;
  z-index: 2;
  pointer-events: none;
  opacity: 0.85;
}

.flux-svg {
  width: 100%;
  height: 100%;
}

.flux-path {
  stroke-dasharray: 1000;
  stroke-dashoffset: 1000;
  filter: drop-shadow(0 0 15px rgba(250, 204, 21, 0.5));
}

.flux-1 {
  animation: fluxDraw 12s linear infinite;
}

.flux-2 {
  animation: fluxDraw 9s linear infinite;
  animation-delay: 2s;
  opacity: 0.8;
}

.flux-3 {
  animation: fluxDraw 15s linear infinite;
  animation-delay: 4s;
  opacity: 0.6;
}

@keyframes fluxDraw {
  0% {
    stroke-dashoffset: 1000;
  }
  100% {
    stroke-dashoffset: -1000;
  }
}

/* Perfect Split Grid Layout */
.hero-corporate-section .hero-inner {
  display: block;
  width: 100%;
  max-width: 1400px;
  margin: 0 auto;
  padding: 0 clamp(24px, 4%, 80px);
  z-index: 3;
  position: static !important;
}

.hero-corporate-section .hero-copy {
  max-width: clamp(320px, 45vw, 620px);
  position: relative;
  z-index: 5;
  text-align: left;
}

/* High-End Eyebrow Label */
.hero-badge {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  color: #facc15;
  font-family: 'Inter', system-ui, -apple-system, sans-serif;
  font-size: 0.82rem;
  font-weight: 750;
  letter-spacing: 0.12em;
  margin-bottom: 24px;
  text-transform: uppercase;
}

/* High-Impact bold headline */
.hero-corporate-section .hero-title {
  font-family: 'Outfit', 'Inter', system-ui, -apple-system, sans-serif;
  font-size: clamp(2.6rem, 4.4vw, 4.2rem);
  font-weight: 850;
  line-height: 1.08;
  letter-spacing: -0.03em;
  color: #ffffff;
  margin-bottom: 24px;
}

.text-glow-yellow {
  color: #ffffff;
  position: relative;
  display: inline-block;
  font-weight: 900;
  text-shadow: 0 0 30px rgba(255, 255, 255, 0.4), 0 0 60px rgba(255, 255, 255, 0.15);
}

.hero-corporate-section .hero-subtitle {
  font-family: 'Inter', system-ui, -apple-system, sans-serif;
  font-size: clamp(1rem, 1.3vw, 1.15rem);
  line-height: 1.7;
  color: #94a3b8;
  margin-bottom: 36px;
  max-width: 580px;
}

/* B2B Action Buttons */
.hero-actions {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 20px;
}

.btn-premium {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  padding: 14px 32px;
  border-radius: 99px;
  font-size: 0.92rem;
  font-weight: 750;
  text-decoration: none;
  transition: all 0.35s cubic-bezier(0.16, 1, 0.3, 1);
  cursor: pointer;
  position: relative;
}

/* Yellow primary CTA with circular inline arrow */
.btn-primary-gold {
  background: linear-gradient(135deg, #facc15 0%, #eab308 100%);
  color: #010a18;
  border: none;
  box-shadow: 0 4px 15px rgba(250, 204, 21, 0.25);
  padding-right: 8px; /* Breathing room for circle arrow */
}

.btn-arrow-circle {
  width: 36px;
  height: 36px;
  border-radius: 50%;
  background: #010a18;
  color: #ffffff;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  transition: all 0.35s cubic-bezier(0.16, 1, 0.3, 1);
}

.btn-primary-gold:hover {
  transform: translateY(-3px);
  box-shadow: 0 8px 25px rgba(250, 204, 21, 0.45);
}

.btn-primary-gold:hover .btn-arrow-circle {
  transform: translateX(4px) rotate(-45deg);
  background: #003B7A;
}

.btn-outline-white {
  background: rgba(255, 255, 255, 0.02);
  color: #ffffff;
  border: 1px solid rgba(255, 255, 255, 0.15);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
}

.btn-outline-white:hover {
  background: rgba(255, 255, 255, 0.08);
  border-color: rgba(255, 255, 255, 0.35);
  transform: translateY(-3px);
  box-shadow: 0 8px 20px rgba(255, 255, 255, 0.05);
}

.btn-outline-white:hover .arrow-icon {
  transform: translateX(4px);
}

/* =========================================
   RIGHT COLUMN - 50% BLEED GRADIENT IMAGE
   ========================================= */
.hero-corporate-section .hero-visual {
  position: absolute;
  top: 0 !important;
  bottom: 0 !important;
  right: 0 !important;
  width: 70% !important;
  height: 100% !important;
  z-index: 2;
  overflow: hidden;
  display: block;
  /* Smoother, more gradual bleed from transparent to fully visible */
  -webkit-mask-image: linear-gradient(to right, transparent 0%, rgba(0,0,0,0.02) 8%, rgba(0,0,0,0.35) 22%, rgba(0,0,0,0.75) 40%, #000 65%);
  mask-image: linear-gradient(to right, transparent 0%, rgba(0,0,0,0.02) 8%, rgba(0,0,0,0.35) 22%, rgba(0,0,0,0.75) 40%, #000 65%);
}

.hero-image-wrapper {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  right: 0;
}

.hero-full-img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center 35%; /* Show upper body of workers, not just hard hats */
  transition: transform 0.8s cubic-bezier(0.16, 1, 0.3, 1);
}

.hero-corporate-section:hover .hero-full-img {
  transform: scale(1.03);
}

.hero-image-gradient {
  position: absolute;
  inset: 0;
  background: 
    linear-gradient(to right, #010a18 0%, rgba(1, 10, 24, 0.8) 8%, rgba(1, 10, 24, 0.15) 30%, transparent 60%);
  pointer-events: none;
}

/* =========================================
   BOTTOM COHESIVE MINIMIZED FEATURE BAR
   ========================================= */
.hero-corporate-section .hero-bottom-features-grid {
  position: absolute !important;
  bottom: 24px !important;
  left: 50% !important;
  transform: translateX(-50%) !important;
  width: calc(100% - 2 * clamp(24px, 4%, 80px)) !important;
  max-width: 1400px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  background: rgba(1, 10, 24, 0.25);
  backdrop-filter: blur(16px);
  -webkit-backdrop-filter: blur(16px);
  border: 1px solid rgba(255, 255, 255, 0.05);
  border-radius: 16px;
  padding: 12px 24px;
  margin-top: 0 !important;
  box-shadow: 0 15px 45px rgba(0, 0, 0, 0.35);
  z-index: 10;
}

.bottom-feature-item {
  display: flex;
  align-items: center;
  gap: 12px;
  flex: 1;
  padding: 4px 8px;
  transition: all 0.3s cubic-bezier(0.16, 1, 0.3, 1);
  cursor: pointer;
  justify-content: center;
}

.bottom-feature-icon {
  font-size: 1.05rem;
  color: #facc15;
  filter: drop-shadow(0 0 6px rgba(250, 204, 21, 0.45));
  transition: all 0.3s cubic-bezier(0.16, 1, 0.3, 1);
  display: inline-block;
}

.bottom-feature-item:hover .bottom-feature-icon {
  transform: scale(1.22) rotate(6deg);
  color: #ffffff;
  filter: drop-shadow(0 0 8px rgba(255, 255, 255, 0.6));
}

.bottom-feature-title {
  font-family: 'Outfit', 'Inter', system-ui, -apple-system, sans-serif;
  font-size: 0.88rem;
  font-weight: 700;
  color: #ffffff;
  margin: 0;
  letter-spacing: -0.01em;
}

/* Fine separator line */
.bottom-feature-separator {
  width: 1px;
  height: 24px;
  background: linear-gradient(to bottom, transparent, rgba(255, 255, 255, 0.12), transparent);
  margin: 0 12px;
  flex-shrink: 0;
}

.bottom-feature-item:hover {
  transform: translateY(-2px);
}

/* =========================================
   LEFT SIDE SUBTLE ELECTRICAL LINES
   ========================================= */
.left-electrical-overlay {
  position: absolute;
  top: 0;
  left: 0;
  width: 50%;
  height: 100%;
  z-index: 1;
  pointer-events: none;
  overflow: hidden;
  /* Smoothly fade out the lines as they approach the center/photo border */
  mask-image: linear-gradient(to right, black 72%, transparent 100%);
  -webkit-mask-image: linear-gradient(to right, black 72%, transparent 100%);
}

.left-electrical-svg {
  width: 100%;
  height: 100%;
}

.electrical-path {
  stroke-dasharray: 600;
  stroke-dashoffset: 600;
  animation: electricalFlow 8s linear infinite;
  filter: drop-shadow(0 0 6px rgba(250, 204, 21, 0.7));
}

.electrical-1 {
  animation-duration: 9s;
  animation-delay: 0s;
  opacity: 0.75 !important; /* Brighter, more visible */
}

.electrical-2 {
  animation-duration: 12s;
  animation-delay: 1.5s;
  opacity: 0.5 !important;
}

.electrical-3 {
  animation-duration: 15s;
  animation-delay: 3s;
  opacity: 0.45 !important;
}

@keyframes electricalFlow {
  0% {
    stroke-dashoffset: 600;
    opacity: 0.3;
  }
  30% {
    opacity: 1;
  }
  70% {
    opacity: 1;
  }
  100% {
    stroke-dashoffset: -600;
    opacity: 0.3;
  }
}

/* Entrance Animations System */
.hero-animate-badge {
  opacity: 0;
  transform: translateY(20px);
  animation: heroSlideUp 1s cubic-bezier(0.22, 1, 0.36, 1) forwards;
  animation-delay: 0.1s;
  animation-play-state: paused;
}

.hero-animate-title {
  opacity: 0;
  transform: translateY(30px);
  animation: heroSlideUp 1.2s cubic-bezier(0.22, 1, 0.36, 1) forwards;
  animation-delay: 0.3s;
  animation-play-state: paused;
}

.hero-animate-subtitle {
  opacity: 0;
  transform: translateY(20px);
  animation: heroSlideUp 1.2s cubic-bezier(0.22, 1, 0.36, 1) forwards;
  animation-delay: 0.5s;
  animation-play-state: paused;
}

.hero-animate-actions {
  opacity: 0;
  transform: translateY(20px);
  animation: heroSlideUp 1.2s cubic-bezier(0.22, 1, 0.36, 1) forwards;
  animation-delay: 0.7s;
  animation-play-state: paused;
}

.hero-animate-stats {
  opacity: 0;
  transform: translateY(20px);
  animation: heroSlideUp 1.2s cubic-bezier(0.22, 1, 0.36, 1) forwards;
  animation-delay: 0.9s;
  animation-play-state: paused;
}

.hero-animate-visual {
  opacity: 0;
  transform: translateX(40px);
  animation: heroSlideInRight 1.4s cubic-bezier(0.22, 1, 0.36, 1) forwards;
  animation-delay: 0.4s;
  animation-play-state: paused;
}

body.loader-complete .hero-animate-badge,
body.loader-complete .hero-animate-title,
body.loader-complete .hero-animate-subtitle,
body.loader-complete .hero-animate-actions,
body.loader-complete .hero-animate-stats,
body.loader-complete .hero-animate-visual {
  animation-play-state: running;
}

@keyframes heroSlideUp {
  to { opacity: 1; transform: translateY(0); }
}

@keyframes heroSlideInRight {
  to { opacity: 1; transform: translateX(0); }
}

/* =========================================
   RESPONSIVE — TABLET (max 1100px)
   ========================================= */
@media (max-width: 1100px) {
  .hero-corporate-section {
    padding-top: 110px;
    padding-bottom: 50px;
    min-height: 100vh;
  }

  .hero-corporate-section .hero-inner {
    display: flex !important;
    flex-direction: column;
    align-items: center;
    text-align: center;
    padding: 0 clamp(20px, 5%, 60px);
    gap: 0;
  }

  .hero-corporate-section .hero-copy {
    max-width: 640px;
    margin: 0 auto;
    z-index: 5;
  }

  .hero-badge {
    justify-content: center;
  }

  .hero-actions {
    justify-content: center;
  }

  /* Tablet: show image as a rounded card below text */
  .hero-corporate-section .hero-visual {
    position: relative !important;
    width: 90% !important;
    max-width: 560px !important;
    height: 340px !important;
    margin: 36px auto 0 !important;
    left: auto !important;
    right: auto !important;
    bottom: auto !important;
    top: auto !important;
    border-radius: 20px;
    overflow: hidden;
    /* Reset the left-to-right mask — use a subtle vignette instead */
    -webkit-mask-image: linear-gradient(to bottom, #000 60%, transparent 100%) !important;
    mask-image: linear-gradient(to bottom, #000 60%, transparent 100%) !important;
  }

  .hero-image-wrapper {
    width: 100% !important;
    height: 100% !important;
    position: relative !important;
    top: auto !important;
    right: auto !important;
  }

  .hero-image-gradient {
    background:
      linear-gradient(to bottom, transparent 40%, #010a18 100%) !important;
  }

  /* Bottom feature bar: 2-column grid */
  .hero-corporate-section .hero-bottom-features-grid {
    position: relative !important;
    bottom: auto !important;
    left: auto !important;
    transform: none !important;
    width: 100% !important;
    display: grid !important;
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 16px !important;
    padding: 20px !important;
    margin-top: 36px !important;
  }

  .bottom-feature-separator {
    display: none !important;
  }
}

/* =========================================
   RESPONSIVE — MOBILE (max 768px)
   ========================================= */
@media (max-width: 768px) {
  .hero-corporate-section {
    padding-top: 90px;
    padding-bottom: 30px;
    min-height: 100svh;
  }

  .hero-corporate-section .hero-inner {
    padding: 0 20px;
    gap: 0;
  }

  .hero-corporate-section .hero-copy {
    max-width: 100%;
  }

  .hero-corporate-section .hero-title {
    font-size: clamp(2.2rem, 8vw, 3rem) !important;
    margin-bottom: 18px;
  }

  .hero-corporate-section .hero-subtitle {
    font-size: 0.95rem !important;
    margin-bottom: 28px;
  }

  /* HIDE image on mobile — full text layout */
  .hero-corporate-section .hero-visual {
    display: none !important;
  }

  /* Hide electrical decorative lines on mobile */
  .left-electrical-overlay {
    display: none;
  }

  /* Stacked buttons, full width */
  .hero-actions {
    flex-direction: column;
    width: 100%;
    gap: 12px;
  }

  .btn-premium {
    width: 100%;
    justify-content: center;
  }

  /* Bottom feature bar: 1-column on small phones */
  .hero-corporate-section .hero-bottom-features-grid {
    position: relative !important;
    bottom: auto !important;
    left: auto !important;
    transform: none !important;
    width: 100% !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 12px !important;
    padding: 16px 20px !important;
    margin-top: 28px !important;
  }

  .bottom-feature-separator {
    display: none !important;
  }

  .bottom-feature-item {
    display: flex;
    align-items: center;
    gap: 12px;
    text-align: left;
    padding: 12px 16px;
    background: rgba(255,255,255,0.04);
    border-radius: 12px;
    border: 1px solid rgba(255,255,255,0.07);
  }
}

/* =========================================
   RESPONSIVE — SMALL PHONES (max 420px)
   ========================================= */
@media (max-width: 420px) {
  .hero-corporate-section {
    padding-top: 80px;
  }

  .hero-corporate-section .hero-title {
    font-size: clamp(1.9rem, 9vw, 2.4rem) !important;
  }

  .hero-badge {
    font-size: 0.72rem;
    letter-spacing: 0.08em;
  }
}


/* --- SERVICES HORIZONTAL ACCORDION STYLES --- */

.services {
  background: #020617; /* Slate-950 premium dark background */
  overflow: hidden;
  padding: clamp(60px, 8vw, 100px) 0;
}

.services-accordion {
  display: flex;
  width: 100%;
  height: clamp(480px, 45vw, 600px);
  gap: 16px;
  max-width: 1320px;
  margin: 0 auto;
  padding: 0 clamp(16px, 4%, 40px);
  box-sizing: border-box;
}

.accordion-panel {
  display: flex;
  flex: 1;
  height: 100%;
  position: relative;
  overflow: hidden;
  border-radius: 20px;
  border: 1px solid rgba(255, 255, 255, 0.08);
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  text-decoration: none;
  color: #ffffff;
  /* Hardware acceleration - GPU composites layout rendering */
  will-change: flex, border-color, box-shadow;
  transform: translateZ(0);
  backface-visibility: hidden;
  -webkit-backface-visibility: hidden;
  transition: flex 0.65s cubic-bezier(0.25, 1, 0.3, 1), border-color 0.4s ease, box-shadow 0.4s ease;
  cursor: pointer;
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.3);
}

.accordion-panel:hover {
  flex: 3.5;
  border-color: #facc15;
  box-shadow: 0 20px 40px rgba(0, 0, 0, 0.6), inset 0 1px 0 rgba(255, 255, 255, 0.15);
}

/* Subpixel anti-aliasing forces for smooth transitions */
.panel-sideways-label,
.panel-content,
.panel-title,
.panel-description,
.panel-cta-btn {
  transform: translateZ(0);
  backface-visibility: hidden;
  -webkit-backface-visibility: hidden;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.panel-overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(to bottom, rgba(2, 6, 23, 0.1) 0%, rgba(2, 6, 23, 0.75) 100%);
  z-index: 1;
  transition: background 0.4s ease, opacity 0.4s ease;
}

.accordion-panel:hover .panel-overlay {
  background: linear-gradient(to bottom, rgba(2, 6, 23, 0.2) 0%, rgba(2, 6, 23, 0.9) 100%);
}

/* Sideways rotated labels for collapsed state */
.panel-sideways-label {
  position: absolute;
  bottom: 48px;
  left: 50%;
  transform: translateX(-50%) rotate(180deg) translateZ(0);
  writing-mode: vertical-rl;
  text-orientation: mixed;
  white-space: nowrap;
  z-index: 2;
  display: flex;
  align-items: center;
  gap: 16px;
  pointer-events: none;
  opacity: 1;
  visibility: visible;
  transition: opacity 0.25s cubic-bezier(0.25, 1, 0.3, 1), visibility 0.25s cubic-bezier(0.25, 1, 0.3, 1);
  font-family: 'Inter', system-ui, sans-serif;
  font-size: clamp(0.95rem, 1.3vw, 1.2rem);
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.18em;
  color: rgba(255, 255, 255, 0.85);
  text-shadow: 0 2px 10px rgba(0, 0, 0, 0.5);
}

.panel-sideways-label .panel-number {
  color: #facc15;
  font-weight: 800;
  text-shadow: 0 0 12px rgba(250, 204, 21, 0.4);
}

.accordion-panel:hover .panel-sideways-label {
  opacity: 0;
  visibility: hidden;
}

/* Content block revealed on expansion - LOCKED logical width prevents text wrapping/jumping reflows */
.panel-content {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 480px; /* Fixed width prevents text layout recalculation when parent width changes */
  max-width: 480px;
  padding: clamp(24px, 3.5vw, 40px);
  box-sizing: border-box;
  z-index: 3;
  opacity: 0;
  visibility: hidden;
  transform: translateY(15px) translateZ(0);
  /* Hover-out (collapse): Hide instantly to prevent narrow-column text wrapping issues */
  transition: opacity 0.15s ease 0s, transform 0.15s ease 0s, visibility 0.15s ease 0s;
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.accordion-panel:hover .panel-content {
  opacity: 1;
  visibility: visible;
  transform: translateY(0) translateZ(0);
  /* Hover-in (expand): Slightly delayed fade-in so text displays only after panel width is wide */
  transition: opacity 0.3s cubic-bezier(0.25, 1, 0.3, 1) 0.18s, transform 0.3s cubic-bezier(0.25, 1, 0.3, 1) 0.18s, visibility 0.3s cubic-bezier(0.25, 1, 0.3, 1) 0.18s;
}

.panel-top {
  display: flex;
  align-items: baseline;
  gap: 14px;
}

.panel-num {
  font-size: 1.4rem;
  font-weight: 800;
  color: #facc15;
  text-shadow: 0 0 15px rgba(250, 204, 21, 0.3);
}

.panel-title {
  font-size: clamp(1.4rem, 2vw, 1.8rem);
  font-weight: 800;
  color: #ffffff;
  margin: 0;
  letter-spacing: -0.01em;
}

.panel-description {
  font-size: clamp(0.85rem, 1.1vw, 0.98rem);
  line-height: 1.6;
  color: #cbd5e1;
  margin: 0;
  max-width: 520px;
}

.panel-cta-btn {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  color: #facc15;
  font-weight: 700;
  font-size: 0.9rem;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  transition: color 0.3s ease, transform 0.3s ease;
  margin-top: 8px;
}

.accordion-panel:hover .panel-cta-btn {
  color: #ffffff;
}

.panel-cta-btn .btn-arrow {
  transition: transform 0.3s ease;
}

.accordion-panel:hover .panel-cta-btn:hover .btn-arrow {
  transform: translateX(6px);
}

/* --- MOBILE RESPONSIVE STACK --- */
@media (max-width: 768px) {
  .services-accordion {
    flex-direction: column;
    height: auto;
    gap: 16px;
    padding: 0 20px;
  }

  .accordion-panel {
    flex: none;
    width: 100%;
    height: 180px;
    border-radius: 16px;
  }

  .accordion-panel:hover {
    flex: none;
    transform: translateY(-2px);
    box-shadow: 0 10px 25px rgba(0, 0, 0, 0.4);
  }

  /* Keep gradient overlay visible & strong on mobile */
  .panel-overlay {
    background: linear-gradient(to top, rgba(2, 6, 23, 0.85) 0%, rgba(2, 6, 23, 0.3) 100%);
  }

  /* Hide sideways text on mobile */
  .panel-sideways-label {
    display: none !important;
  }

  /* Permanently show panel content on mobile in a compact way */
  .panel-content {
    opacity: 1 !important;
    visibility: visible !important;
    transform: none !important;
    padding: 20px !important;
    width: 100% !important;
    max-width: 100% !important;
    gap: 8px;
  }

  .panel-top {
    gap: 8px;
  }

  .panel-num {
    font-size: 1.1rem;
  }

  .panel-title {
    font-size: 1.25rem;
  }

  .panel-description {
    font-size: 0.82rem;
    line-height: 1.4;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    color: #e2e8f0;
  }

  .panel-cta-btn {
    font-size: 0.8rem;
    margin-top: 4px;
    color: #facc15 !important;
  }
}