@import url('https://fonts.googleapis.com/css2?family=Roboto:wght@300;400;500;700;900&display=swap');

:root{--navy:#07132a;--navy-2:#101b3d;--ink:#13213a;--muted:#6c7487;--line:rgba(255,255,255,.18);--surface:#fff;--soft:#f5f6fb;--cyan:#22d3ee;--blue:#2554d9;--purple:#7c3aed;--pink:#e3398f;--orange:#ffad22;--green:#0dbb7f;--shadow:0 22px 70px rgba(9,19,44,.18)}
*{box-sizing:border-box} html{scroll-behavior:smooth} body{margin:0;font-family:'Roboto', sans-serif;color:var(--ink);background:var(--soft);line-height:1.6;overflow-x:hidden} a{color:inherit;text-decoration:none} img{max-width:100%;display:block}.container{width:min(1180px,calc(100% - 40px));margin-inline:auto}.icon{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.85;stroke-linecap:round;stroke-linejoin:round}
.header-stack{position:absolute;top:0;left:0;right:0;z-index:30;color:#fff}.topbar{height:38px;background:linear-gradient(90deg,#050817,#141332 62%,#050817);font-size:.88rem}.topbar-inner{height:100%;display:flex;align-items:center;justify-content:space-between;gap:16px}.topbar-left,.topbar-right{display:flex;align-items:center;gap:14px}.top-contact{display:inline-flex;align-items:center;gap:8px;color:rgba(255,255,255,.86);font-weight:700}.top-contact .icon{width:16px;height:16px}.socials{display:flex;align-items:center;gap:8px}.social-link{width:28px;height:28px;border:1px solid rgba(255,255,255,.22);border-radius:999px;display:grid;place-items:center;background:rgba(255,255,255,.06);transition:transform .25s ease,background .25s ease,color .25s ease}.social-link:hover{transform:translateY(-3px);background:rgba(35,211,238,.2);color:#fff}.social-link .icon{width:15px;height:15px}.language-switch{display:flex;gap:5px;align-items:center}.lang-btn{border:1px solid rgba(255,255,255,.22);background:rgba(255,255,255,.08);color:#fff;border-radius:999px;padding:5px 10px;font-weight:900;font-size:.76rem;cursor:pointer;transition:.25s ease}.lang-btn:hover,.lang-btn.active{background:linear-gradient(135deg,var(--cyan),var(--blue));border-color:transparent;transform:translateY(-2px)}
.navbar{padding:16px 0}.nav-shell{min-height:64px;border:1px solid rgba(255,255,255,.22);border-radius:999px;background:rgba(10,16,38,.34);box-shadow:0 16px 50px rgba(0,0,0,.22);backdrop-filter:blur(18px);display:flex;align-items:center;justify-content:space-between;gap:24px;padding:7px 11px 7px 18px}.brand{display:flex;align-items:center;gap:12px;min-width:108px}.brand img{width:96px;height:auto;filter:drop-shadow(0 8px 18px rgba(0,0,0,.28))}.nav-links{display:flex;align-items:center;justify-content:center;gap:26px;font-size:.94rem;font-weight:900}.nav-link{position:relative;color:rgba(255,255,255,.92);transition:transform .25s ease,color .25s ease}.nav-link:hover{transform:translateY(-3px);color:#fff}.nav-link::after{content:"";position:absolute;left:0;right:0;bottom:-8px;height:2px;background:linear-gradient(90deg,var(--cyan),var(--pink));transform:scaleX(0);transform-origin:left;transition:.25s ease}.nav-link:hover::after,.nav-link.active::after{transform:scaleX(1)}.nav-actions{display:flex;align-items:center;gap:10px}.nav-cta{display:inline-flex;align-items:center;justify-content:center;border-radius:999px;padding:13px 20px;font-weight:900;color:#fff;background:linear-gradient(135deg,var(--cyan),var(--blue));box-shadow:0 10px 26px rgba(37,84,217,.35);transition:transform .25s ease,box-shadow .25s ease}.nav-cta:hover{transform:translateY(-3px);box-shadow:0 16px 36px rgba(37,84,217,.44)}.mobile-toggle{display:none;border:0;background:rgba(255,255,255,.14);color:#fff;border-radius:0;width:42px;height:42px;font-size:24px;cursor:pointer}
.hero,.page-hero{position:relative;display:flex;align-items:center;overflow:hidden;background:#07132a;color:#fff}.hero{min-height:740px}.page-hero{min-height:410px}.hero::before,.page-hero::before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 18% 25%,rgba(35,211,238,.35),transparent 28%),radial-gradient(circle at 82% 18%,rgba(227,57,143,.42),transparent 30%),linear-gradient(135deg,rgba(4,8,23,.84),rgba(8,18,46,.89) 54%,rgba(12,12,44,.86)),linear-gradient(135deg,#0d1430,#08152d 55%,#191239)}.hero::after,.page-hero::after{content:"";position:absolute;inset:0;background-image:linear-gradient(rgba(255,255,255,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.035) 1px,transparent 1px);background-size:46px 46px;mask-image:linear-gradient(to bottom,rgba(0,0,0,.9),transparent 88%)}.hero-inner{position:relative;z-index:2;padding-top:118px;display:grid;grid-template-columns:1.05fr .95fr;align-items:center;gap:60px}.eyebrow{display:inline-flex;align-items:center;gap:9px;color:#98fbff;font-weight:900;text-transform:uppercase;letter-spacing:.14em;font-size:.78rem}.eyebrow::before{content:"";width:9px;height:9px;border-radius:99px;background:linear-gradient(135deg,var(--cyan),var(--pink));box-shadow:0 0 24px var(--cyan)}.hero-title{font-family:'Roboto', sans-serif;font-weight:900;line-height:1.02;letter-spacing:-.045em;font-size:clamp(2.35rem,4.15vw,4.45rem);margin:18px 0 18px;text-shadow:0 14px 40px rgba(0,0,0,.38)}.hero-copy{font-size:1.08rem;color:rgba(255,255,255,.82);max-width:660px;margin:0 0 28px}.hero-actions{display:flex;align-items:center;gap:14px;flex-wrap:wrap}.btn{display:inline-flex;align-items:center;justify-content:center;text-align:center;gap:10px;border:0;border-radius:999px;padding:14px 22px;font-weight:900;cursor:pointer;transition:transform .25s ease,box-shadow .25s ease,background .25s ease}.btn:hover{transform:translateY(-3px)}.btn-primary{color:#fff;background:linear-gradient(135deg,var(--cyan),var(--blue));box-shadow:0 12px 28px rgba(37,84,217,.38)}.btn-ghost{color:#fff;border:1px solid rgba(255,255,255,.28);background:rgba(255,255,255,.08);backdrop-filter:blur(10px)}.hero-visual{position:relative;min-height:500px}.hero-ribbon{position:absolute;inset:auto 18px 70px auto;width:310px;height:500px;transform:skewX(-15deg) rotate(7deg);background:linear-gradient(180deg,rgba(227,57,143,.78),rgba(37,84,217,.55));border-radius:0;filter:blur(.2px);opacity:.85}.hero-ribbon::after{content:"";position:absolute;inset:18px;background:linear-gradient(180deg,rgba(255,255,255,.22),transparent);border-radius:0}.glass-panel{position:absolute;border:1px solid rgba(255,255,255,.12);background:linear-gradient(180deg,rgba(255,255,255,.13),rgba(255,255,255,.04));backdrop-filter:blur(20px);box-shadow:0 24px 70px rgba(0,0,0,.28)}.glass-one{width:250px;height:170px;right:22px;top:80px}.glass-two{width:310px;height:210px;left:80px;bottom:60px}.page-hero .container{position:relative;z-index:2;padding-top:136px;text-align:center}.page-title{font-family:'Roboto', sans-serif;font-size:clamp(3rem,6vw,5.8rem);font-weight:900;line-height:1;letter-spacing:-.045em;margin:0 0 14px}.page-subtitle{max-width:780px;margin:0 auto;color:rgba(255,255,255,.78);font-size:1.18rem}.section{padding:90px 0}.section.white{background:#fff}.section.dark{background:linear-gradient(180deg,#07132a,#0d1734);color:#fff}.section-title{text-align:center;margin:0 auto 46px;max-width:860px}.section-title .kicker{display:inline-flex;color:#39d9ef;text-transform:uppercase;font-weight:900;font-size:.8rem;letter-spacing:.16em;margin-bottom:12px}.section-title h2{font-family:'Roboto', sans-serif;font-size:clamp(2.1rem,4vw,4rem);font-weight:900;line-height:1.06;letter-spacing:-.035em;margin:0 0 12px}.section-title p{color:var(--muted);font-size:1.1rem;margin:0}.dark .section-title p{color:rgba(255,255,255,.72)}.pillar-strip{position:relative;z-index:4;margin-top:-72px}.pillars-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}.pillar-card{background:#fff;border-radius:0;padding:30px;border:1px solid rgba(11,28,64,.08);box-shadow:var(--shadow);transition:transform .35s ease,box-shadow .35s ease;text-align:center}.pillar-card:hover{transform:translateY(-10px);box-shadow:0 34px 80px rgba(9,19,44,.22)}.icon-bubble{width:66px;height:66px;border-radius:0;display:grid;place-items:center;color:#fff;background:linear-gradient(135deg,var(--cyan),var(--purple) 58%,var(--pink));box-shadow:0 12px 30px rgba(124,58,237,.28);margin:0 auto 22px}.icon-bubble .icon{width:32px;height:32px}.pillar-card h3{font-family:'Roboto', sans-serif;font-size:1.36rem;font-weight:900;margin:0 0 10px;text-align:center}.pillar-card p{margin:0;color:var(--muted)}.split{display:grid;grid-template-columns:.85fr 1.15fr;gap:54px;align-items:center}.intro-stat{background:linear-gradient(135deg,var(--navy),#182c62);color:#fff;border-radius:0;padding:42px;box-shadow:var(--shadow);position:relative;overflow:hidden}.intro-stat::after{content:"";position:absolute;right:-50px;top:-70px;width:220px;height:220px;background:linear-gradient(135deg,var(--cyan),var(--pink));border-radius:50%;opacity:.3;filter:blur(5px)}.intro-stat h3{font-family:'Roboto', sans-serif;font-size:2.25rem;font-weight:900;line-height:1.05;margin:0}.intro-copy{font-size:1.24rem;color:#24324c;text-align:justify}.intro-copy p{margin:0}.compact-cta{padding-top:20px}.cta-ribbon{position:relative;margin:0 auto;max-width:980px;border-radius:0;padding:36px 40px;background:linear-gradient(135deg,#07132a,#16275b);color:#fff;display:grid;grid-template-columns:1fr auto;align-items:center;gap:28px;box-shadow:0 26px 70px rgba(9,19,44,.24);overflow:hidden}.cta-ribbon::after{content:"";position:absolute;right:-90px;top:-100px;width:260px;height:260px;background:linear-gradient(135deg,var(--cyan),var(--pink));border-radius:50%;opacity:.25}.cta-ribbon h3{font-family:'Roboto', sans-serif;font-size:1.8rem;font-weight:900;margin:0 0 10px;text-align:left}.cta-ribbon p{margin:0;color:rgba(255,255,255,.84);font-size:1.28rem;text-align:center;font-weight:700}.cta-ribbon > *{position:relative;z-index:1}.tab-section{position:relative;background:linear-gradient(135deg,#151a54,#1f3d85 52%,#8f227e);color:#fff;overflow:hidden}.tab-section::before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 10% 10%,rgba(35,211,238,.25),transparent 30%),radial-gradient(circle at 90% 80%,rgba(255,173,34,.2),transparent 28%)}.tab-section .container{position:relative;z-index:2}.tab-shell{margin-top:36px;background:#fff;border-radius:0;padding:0;box-shadow:0 26px 80px rgba(0,0,0,.22);overflow:hidden}.tab-list{display:grid;grid-template-columns:repeat(3,1fr);background:linear-gradient(90deg,#f7f8ff,#fff);border-bottom:1px solid rgba(11,28,64,.08)}.tab-button{border:0;background:transparent;padding:24px 16px;font-family:'Roboto', sans-serif;font-weight:900;color:#2a3550;cursor:pointer;font-size:1rem;transition:.25s ease}.tab-button:hover{background:rgba(37,84,217,.08)}.tab-button.active{color:#fff;background:linear-gradient(135deg,var(--cyan),var(--blue))}.tab-panel{display:none;padding:38px;color:#13213a}.tab-panel.active{display:block}.reason-grid,.industry-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}.reason-card,.industry-card{border:1px solid rgba(10,25,56,.08);background:#fff;border-radius:0;padding:24px;box-shadow:0 16px 38px rgba(9,19,44,.08);transition:transform .28s ease,box-shadow .28s ease}.reason-card:hover,.industry-card:hover{transform:translateY(-7px);box-shadow:0 26px 55px rgba(9,19,44,.14)}.reason-card h3,.industry-card h3{font-family:'Roboto', sans-serif;font-weight:900;margin:14px 0 8px}.reason-card p,.industry-card p{color:var(--muted);margin:0}.reason-card>.icon,.industry-card>.icon{width:34px;height:34px;color:var(--blue)}.work-steps{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}.step-card{position:relative;border-radius:0;padding:30px 22px;border:1px solid rgba(10,25,56,.08);background:linear-gradient(180deg,#fff,#f8faff);box-shadow:0 16px 38px rgba(9,19,44,.08);min-height:230px}.step-number{font-family:'Roboto', sans-serif;font-weight:900;font-size:3rem;line-height:1;color:transparent;background:linear-gradient(135deg,var(--cyan),var(--pink));-webkit-background-clip:text;background-clip:text}.step-card p{margin:18px 0 0;color:#40506c}.service-hero-card{margin-top:-70px;position:relative;z-index:4;background:#fff;border-radius:0;box-shadow:var(--shadow);padding:46px;display:grid;grid-template-columns:.8fr 1.2fr;gap:34px;align-items:center}.service-hero-card h2{font-family:'Roboto', sans-serif;font-size:2.4rem;font-weight:900;line-height:1.05;margin:0}.service-hero-card p{color:var(--muted);margin:0;font-size:1.28rem;font-family:'Roboto', sans-serif}.service-bands{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;margin-top:58px}.service-bands-wide{grid-template-columns:repeat(4,1fr)}.service-chip{min-height:178px;position:relative;border-radius:0;padding:28px 20px;text-align:center;background:#fff;border:1px solid rgba(10,25,56,.08);box-shadow:0 18px 45px rgba(9,19,44,.08);overflow:hidden;transition:transform .32s ease,box-shadow .32s ease,color .32s ease}.service-chip::before{content:"";position:absolute;inset:0;background:linear-gradient(135deg,var(--cyan),var(--blue) 58%,var(--pink));opacity:0;transition:.32s ease}.service-chip:hover{transform:translateY(-10px);box-shadow:0 30px 68px rgba(37,84,217,.22);color:#fff}.service-chip:hover::before{opacity:1}.service-chip>*{position:relative;z-index:1}.service-chip h3{font-family:'Roboto', sans-serif;font-size:1rem;font-weight:900;line-height:1.28;margin:16px 0 0}.chip-icon{width:64px;height:64px;border-radius:0;margin:0 auto;display:grid;place-items:center;color:#fff;background:linear-gradient(135deg,var(--cyan),var(--purple),var(--pink));transition:.32s ease}.service-chip:hover .chip-icon{background:rgba(255,255,255,.18)}.chip-icon .icon{width:32px;height:32px}.cyber-wrap{padding:92px 0;background:linear-gradient(180deg,#07132a,#111d44);color:#fff}.cyber-heading{margin-top:0;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.15);color:#fff}.cyber-heading p{color:rgba(255,255,255,.78)}.cyber-wrap .service-chip{background:rgba(255,255,255,.06);border-color:rgba(255,255,255,.12);box-shadow:none;color:#fff}.cyber-wrap .service-chip h3{color:#fff}.about-grid{display:grid;grid-template-columns:1fr 1fr;gap:38px;align-items:stretch}.text-card{background:#fff;border-radius:0;padding:34px 36px;box-shadow:var(--shadow);border:1px solid rgba(10,25,56,.08)}.text-card h2{font-family:'Roboto', sans-serif;font-size:2.3rem;font-weight:900;line-height:1.08;margin:0 0 18px}.text-card p{color:#42506b;text-align:justify;margin-left:2pt;margin-right:2pt}.values-title{font-size:clamp(2.8rem,5vw,5rem)!important}.values-orbit{margin-top:44px;background:linear-gradient(135deg,#07132a,#122257);color:#fff;border-radius:0;padding:48px;position:relative;overflow:hidden;box-shadow:var(--shadow)}.values-orbit::before{content:"";position:absolute;inset:auto -90px -90px auto;width:300px;height:300px;border-radius:50%;background:linear-gradient(135deg,var(--cyan),var(--pink));opacity:.16}.value-wheel{display:grid;grid-template-columns:repeat(6,1fr);gap:16px;position:relative;z-index:1}.value-item{display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;min-height:145px;border-radius:0;border:1px solid rgba(255,255,255,.13);background:rgba(255,255,255,.08);transition:transform .35s ease,background .35s ease}.value-item:hover{transform:translateY(-8px);background:rgba(255,255,255,.14)}.value-item .icon-bubble{margin:0 0 12px;width:50px;height:50px}.value-item .icon{width:24px;height:24px}.profile-card{display:grid;grid-template-columns:330px 1fr;gap:0;background:#fff;border-radius:0;overflow:hidden;box-shadow:var(--shadow);border:1px solid rgba(10,25,56,.08)}.profile-side{background:linear-gradient(180deg,#013b30,#05221d);color:#fff;padding:0 28px 32px;text-align:center}.profile-photo{margin:0 -28px 24px;height:390px;overflow:hidden}.profile-photo img{width:100%;height:100%;object-fit:cover;object-position:center 20%}.profile-side h3{margin:10px 0 6px;font-size:1.35rem;color:#9ff3ff}.profile-side p{margin:0 0 8px;color:rgba(255,255,255,.82);font-size:.95rem}.profile-side .languages{color:#ff9acc;font-weight:900;margin-top:14px}.profile-body{padding:42px}.profile-body h2{font-family:'Roboto', sans-serif;font-size:2.7rem;font-weight:900;line-height:1;margin:0 0 10px;color:#182c62}.profile-body .role{font-weight:900;color:#e3398f;margin-bottom:22px}.profile-body p{text-align:justify;color:#43516d}.resource-hero{display:grid;grid-template-columns:1fr 1fr;gap:26px;align-items:stretch}.feature-article{min-height:410px;border-radius:0;padding:42px;color:#fff;background:linear-gradient(135deg,rgba(7,19,42,.88),rgba(37,84,217,.62)),radial-gradient(circle at 80% 20%,rgba(227,57,143,.36),transparent 28%),#111d44;display:flex;flex-direction:column;justify-content:end;box-shadow:var(--shadow)}.blog-image-card{background-image:url('blog-card.png');background-size:cover;background-position:center}.resource-list{display:grid;grid-template-columns:1fr;gap:18px}.resource-card{background:#fff;border-radius:0;padding:28px;box-shadow:0 16px 42px rgba(9,19,44,.08);display:grid;grid-template-columns:70px 1fr;gap:20px;align-items:center;transition:transform .28s ease}.resource-card:hover{transform:translateY(-7px)}.resource-card h3{font-family:'Roboto', sans-serif;font-weight:900;margin:0 0 6px}.resource-card p{margin:0;color:var(--muted)}.contact-card{position:relative;margin-top:-60px;z-index:5;background:#fff;border-radius:0;overflow:hidden;box-shadow:var(--shadow);display:grid;grid-template-columns:.85fr 1.15fr}.contact-info{background:#f3f5ff;padding:44px}.contact-info h2,.contact-form h2{font-family:'Roboto', sans-serif;font-size:2rem;font-weight:900;line-height:1.08;margin:0 0 12px}.contact-info p{color:var(--muted)}.contact-method{display:grid;grid-template-columns:48px 1fr;gap:14px;align-items:center;margin:20px 0}.contact-method .mini-icon{width:48px;height:48px;border-radius:0;display:grid;place-items:center;background:linear-gradient(135deg,var(--cyan),var(--blue));color:#fff}.contact-method .icon{width:24px;height:24px}.contact-form{padding:44px}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}.form-field{display:flex;flex-direction:column;gap:6px}.form-field.full{grid-column:1/-1}.form-field label{font-weight:900;font-size:.9rem;color:#2a3550}.form-field input,.form-field textarea{border:1px solid rgba(10,25,56,.12);border-radius:0;background:#f7f8fd;padding:15px 16px;font:inherit;outline:none;transition:border .25s ease,box-shadow .25s ease}.form-field input:focus,.form-field textarea:focus{border-color:var(--blue);box-shadow:0 0 0 4px rgba(37,84,217,.12)}textarea{min-height:142px;resize:vertical}.form-submit{margin-top:18px;width:100%}.map-panel{margin-top:70px;border-radius:0;min-height:320px;overflow:hidden;position:relative;background:#dce8f5;box-shadow:var(--shadow)}.map-panel::before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(7,19,42,.04) 1px,transparent 1px),linear-gradient(rgba(7,19,42,.04) 1px,transparent 1px),radial-gradient(circle at 42% 48%,rgba(227,57,143,.55),transparent 2%),linear-gradient(135deg,#d8e9f2,#eef6fb);background-size:64px 64px,64px 64px,100% 100%,100% 100%}.map-panel::after{content:"";position:absolute;inset:0;background:linear-gradient(30deg,transparent 40%,rgba(37,84,217,.16) 41%,rgba(37,84,217,.16) 44%,transparent 45%),linear-gradient(-20deg,transparent 45%,rgba(13,187,127,.16) 46%,rgba(13,187,127,.16) 49%,transparent 50%)}.map-label{position:absolute;left:32px;top:32px;background:#fff;border-radius:0;padding:22px;box-shadow:0 16px 42px rgba(9,19,44,.14);max-width:360px}.site-footer{background:#050913;color:#fff;padding:58px 0 24px}.footer-grid{display:grid;grid-template-columns:1.1fr .7fr 1fr;gap:48px}.footer-logo{width:118px;margin-bottom:18px}.site-footer h3{font-family:'Roboto', sans-serif;font-weight:900}.site-footer p,.site-footer a{color:rgba(255,255,255,.72)}.site-footer a:hover{color:#fff}.footer-copy,.footer-list a,.footer-contact,.footer-bottom{font-family:'Roboto', sans-serif}.footer-list{display:grid;gap:10px}.footer-contact{display:grid;grid-template-columns:32px 1fr;gap:12px;align-items:start;margin:12px 0}.footer-contact p{margin:0}.footer-mini-icon{display:grid;place-items:center;color:#5be7ff}.footer-mini-icon .icon{width:20px;height:20px}.footer-bottom{margin-top:42px;padding-top:24px;border-top:1px solid rgba(255,255,255,.12);display:flex;justify-content:space-between;gap:20px;color:rgba(255,255,255,.55);font-size:.9rem}.reveal{opacity:0;transform:translateY(24px);transition:opacity .7s ease,transform .7s ease}.reveal.visible{opacity:1;transform:none}
@media (max-width:1020px){.hero-inner{grid-template-columns:1fr}.hero-visual{display:none}.pillars-grid,.reason-grid{grid-template-columns:1fr}.split,.service-hero-card,.about-grid,.profile-card,.contact-card,.resource-hero{grid-template-columns:1fr}.work-steps{grid-template-columns:repeat(2,1fr)}.service-bands,.service-bands-wide{grid-template-columns:repeat(2,1fr)}.value-wheel{grid-template-columns:repeat(3,1fr)}.profile-side{padding-top:0}.profile-photo{height:520px}.cta-ribbon{grid-template-columns:1fr;text-align:center}.cta-ribbon h3{text-align:center}}
@media (max-width:840px){.topbar{height:auto;padding:10px 0}.topbar-inner{flex-direction:column}.navbar{padding:12px 0}.nav-shell{border-radius:0;align-items:flex-start;flex-wrap:wrap}.mobile-toggle{display:grid;place-items:center}.nav-links{display:none;flex-direction:column;width:100%;align-items:flex-start;padding:12px 6px 4px}.nav-links.open{display:flex}.nav-actions{margin-left:auto}.brand img{width:82px}.hero,.page-hero{min-height:700px}.hero-inner{padding-top:220px}.hero-title{font-size:clamp(2.35rem,10vw,4rem)}.page-title{font-size:3rem}.pillars-grid{gap:16px}.section{padding:70px 0}.tab-list{grid-template-columns:1fr}.work-steps,.service-bands,.service-bands-wide,.form-grid,.footer-grid{grid-template-columns:1fr}.value-wheel{grid-template-columns:1fr 1fr}.profile-photo{height:420px}.footer-bottom{flex-direction:column}}
@media (max-width:560px){.container{width:min(100% - 28px,1180px)}.nav-cta{padding:11px 14px;font-size:.88rem}.hero-actions .btn{width:100%}.pillar-card,.text-card,.tab-panel,.service-hero-card,.contact-info,.contact-form{padding:26px}.service-bands,.service-bands-wide{grid-template-columns:1fr}.value-wheel{grid-template-columns:1fr}.page-hero .container{padding-top:180px}.hero{min-height:780px}.topbar-left{font-size:.8rem}.resource-card{grid-template-columns:1fr}.resource-card .icon-bubble{margin-inline:0}}

/* Adjustments from adjustments (1).docx: lighter grayscale hero/page diaporama and non-overlapping home cards */
@keyframes heroDiaporama {
  0%, 46% { background-image: url('hero-slide-panama.png'); }
  50%, 96% { background-image: url('hero-slide-yamileth.jpg'); }
  100% { background-image: url('hero-slide-panama.png'); }
}

.hero,
.page-hero {
  isolation: isolate;
  background: #07132a;
}

.hero::before,
.page-hero::before {
  content: "";
  position: absolute;
  inset: 0;
  background-image: url('hero-slide-panama.png');
  background-size: cover;
  background-position: center;
  filter: grayscale(100%) brightness(1.14) contrast(.95);
  opacity: .78;
  animation: heroDiaporama 10s steps(1, end) infinite;
  transform: scale(1.03);
  z-index: 0;
}

.hero::after,
.page-hero::after {
  content: "";
  position: absolute;
  inset: 0;
  background:
    radial-gradient(circle at 18% 22%, rgba(34,211,238,.20), transparent 33%),
    radial-gradient(circle at 84% 16%, rgba(227,57,143,.22), transparent 34%),
    linear-gradient(120deg, rgba(5,10,24,.44), rgba(7,19,42,.34) 52%, rgba(10,11,36,.45));
  background-size: auto;
  mask-image: none;
  z-index: 1;
}

.hero .container,
.page-hero .container,
.hero-inner {
  position: relative;
  z-index: 2;
}

.hero-inner {
  grid-template-columns: minmax(0, 850px);
  justify-content: center;
  text-align: center;
  gap: 0;
  padding-top: 148px;
  padding-bottom: 72px;
}

.hero-copy {
  margin-left: auto;
  margin-right: auto;
}

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

.hero-visual.hero-abstract {
  display: none;
}

/* Move the three white cards down so they no longer overlap the landing hero. */
.pillar-strip {
  margin-top: 0 !important;
  padding: 76px 0 36px;
  background: #fff;
}

.pillars-grid {
  align-items: stretch;
}

.pillar-card {
  height: 100%;
}

.page-hero .container {
  padding-top: 148px;
  padding-bottom: 72px;
}

.page-title,
.page-subtitle {
  text-shadow: 0 12px 34px rgba(0,0,0,.42);
}

@media (max-width: 800px) {
  .hero-inner {
    padding-top: 132px;
    padding-bottom: 56px;
  }
  .pillar-strip {
    padding-top: 56px;
  }
}


/* Robust background layers for the two-photo diaporama on every page header. */
.hero::before,
.hero::after,
.page-hero::before,
.page-hero::after {
  display: none !important;
}
.hero-bg,
.hero-overlay {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  pointer-events: none;
}
.hero-bg {
  background-image: url('hero-slide-panama.png');
  background-size: cover;
  background-position: center;
  opacity: .92;
  filter: grayscale(100%) brightness(1.20) contrast(.94);
  animation: heroDiaporama 10s steps(1, end) infinite;
  transform: scale(1.025);
  z-index: 0;
}
.hero-overlay {
  background:
    radial-gradient(circle at 18% 22%, rgba(34,211,238,.20), transparent 33%),
    radial-gradient(circle at 84% 16%, rgba(227,57,143,.22), transparent 34%),
    linear-gradient(120deg, rgba(5,10,24,.44), rgba(7,19,42,.34) 52%, rgba(10,11,36,.45));
  z-index: 1;
}
.hero > .container,
.page-hero > .container,
.hero-inner {
  position: relative;
  z-index: 2;
}

/* Keep landing copy visible even if reveal JS has not executed yet. */
.hero .hero-copy-block.reveal { opacity: 1; transform: none; }

/* Adjustments from adjustments (2).docx: use the two provided photos as a light grayscale 5s-per-photo diaporama on every header, with a corrected wide Yamileth slide. */
@keyframes heroDiaporama {
  0%, 49.999% { background-image: url('hero-slide-panama.png'); }
  50%, 99.999% { background-image: url('hero-slide-yamileth.jpg'); }
  100% { background-image: url('hero-slide-panama.png'); }
}
.hero,
.page-hero {
  isolation: isolate;
  background: #07132a;
}
.hero::before,
.hero::after,
.page-hero::before,
.page-hero::after {
  display: none !important;
}
.hero-bg,
.hero-overlay {
  position: absolute;
  inset: 0;
  pointer-events: none;
}
.hero-bg {
  background-image: url('hero-slide-panama.png');
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center center;
  opacity: .96;
  filter: grayscale(100%) brightness(1.26) contrast(.92);
  animation: heroDiaporama 10s steps(1, end) infinite;
  transform: scale(1.018);
  z-index: 0;
}
.hero-overlay {
  background:
    radial-gradient(circle at 18% 22%, rgba(34,211,238,.15), transparent 33%),
    radial-gradient(circle at 84% 16%, rgba(227,57,143,.15), transparent 34%),
    linear-gradient(120deg, rgba(5,10,24,.40), rgba(7,19,42,.28) 52%, rgba(10,11,36,.35));
  z-index: 1;
}
.hero > .container,
.page-hero > .container,
.hero-inner {
  position: relative;
  z-index: 2;
}
.hero-inner {
  grid-template-columns: minmax(0, 850px);
  justify-content: center;
  text-align: center;
  gap: 0;
  padding-top: 148px;
  padding-bottom: 72px;
}
.hero-copy,
.hero-actions,
.hero .eyebrow {
  margin-left: auto;
  margin-right: auto;
  justify-content: center;
}
.hero-visual.hero-abstract {
  display: none;
}
.page-hero .container {
  padding-top: 148px;
  padding-bottom: 72px;
}
@media (max-width: 800px) {
  .hero-inner {
    padding-top: 132px;
    padding-bottom: 56px;
  }
  .hero-bg {
    background-position: center center;
  }
}

/* Adjustments from adjustments (2).docx: use the two requested photos on every page header and rescale the portrait slide. */
@keyframes heroDiaporama {
  0%, 46% {
    background-image: url('hero-slide-panama.png');
    background-size: cover;
    background-position: center center;
  }
  50%, 96% {
    background-image: url('hero-slide-yamileth-wide.jpg');
    background-size: cover;
    background-position: center center;
  }
  100% {
    background-image: url('hero-slide-panama.png');
    background-size: cover;
    background-position: center center;
  }
}
.hero-diaporama { display: none !important; }
.hero-bg {
  background-image: url('hero-slide-panama.png');
  background-size: cover;
  background-position: center center;
  opacity: .94;
  filter: grayscale(100%) brightness(1.24) contrast(.92);
  animation: heroDiaporama 10s steps(1, end) infinite;
  transform: scale(1.012);
  transform-origin: center center;
}
.hero-overlay {
  background:
    radial-gradient(circle at 18% 22%, rgba(34,211,238,.16), transparent 34%),
    radial-gradient(circle at 84% 16%, rgba(227,57,143,.18), transparent 36%),
    linear-gradient(120deg, rgba(5,10,24,.40), rgba(7,19,42,.30) 52%, rgba(10,11,36,.38));
}
.hero, .page-hero { position: relative; overflow: hidden; }
.hero > .hero-bg, .hero > .hero-overlay, .page-hero > .hero-bg, .page-hero > .hero-overlay {
  position: absolute;
  inset: 0;
  pointer-events: none;
}
.hero > .hero-bg, .page-hero > .hero-bg { z-index: 0; }
.hero > .hero-overlay, .page-hero > .hero-overlay { z-index: 1; }
.hero > .container, .page-hero > .container, .hero-inner { position: relative; z-index: 2; }
@media (max-width: 720px) {
  .hero-bg { filter: grayscale(100%) brightness(1.22) contrast(.93); }
  .hero-overlay { background: linear-gradient(120deg, rgba(5,10,24,.52), rgba(7,19,42,.36)); }
}

/* Adjustments from adjustments (2).docx: fixed and rescaled the second slideshow photo. */
@keyframes heroDiaporama {
  0%, 49.999% { background-image: url('hero-slide-panama.png'); }
  50%, 99.999% { background-image: url('hero-slide-yamileth.jpg'); }
  100% { background-image: url('hero-slide-panama.png'); }
}

.hero-bg {
  background-image: url('hero-slide-panama.png');
  background-size: cover;
  background-position: center center;
  background-repeat: no-repeat;
  opacity: .95;
  filter: grayscale(100%) brightness(1.24) contrast(.92);
  animation: heroDiaporama 10s steps(1, end) infinite;
  transform: scale(1.015);
}

.hero-overlay {
  background:
    radial-gradient(circle at 18% 22%, rgba(34,211,238,.16), transparent 34%),
    radial-gradient(circle at 84% 16%, rgba(227,57,143,.18), transparent 35%),
    linear-gradient(120deg, rgba(5,10,24,.32), rgba(7,19,42,.22) 52%, rgba(10,11,36,.30));
}

.hero,
.page-hero {
  background: #e7eaef;
}

/* Final diaporama fix: use the corrected wide Yamileth background generated from the attached portrait. */
@keyframes heroDiaporamaFinal {
  0%, 49.999% {
    background-image: url('hero-slide-panama.png');
    background-position: center center;
    background-size: cover;
  }
  50%, 99.999% {
    background-image: url('hero-slide-yamileth-wide.jpg');
    background-position: center center;
    background-size: cover;
  }
  100% {
    background-image: url('hero-slide-panama.png');
    background-position: center center;
    background-size: cover;
  }
}

.hero,
.page-hero {
  position: relative;
  overflow: hidden;
  background: #07132a;
  isolation: isolate;
}

.hero::before,
.page-hero::before {
  content: "" !important;
  display: block !important;
  position: absolute;
  inset: 0;
  z-index: 0;
  background-image: url('hero-slide-panama.png');
  background-position: center center;
  background-size: cover;
  background-repeat: no-repeat;
  opacity: .96;
  filter: grayscale(100%) brightness(1.28) contrast(.94);
  animation: heroDiaporamaFinal 10s steps(1, end) infinite;
  transform: scale(1.01);
  transform-origin: center center;
}

.hero::after,
.page-hero::after {
  content: "" !important;
  display: block !important;
  position: absolute;
  inset: 0;
  z-index: 1;
  background:
    radial-gradient(circle at 18% 22%, rgba(34,211,238,.12), transparent 34%),
    radial-gradient(circle at 84% 16%, rgba(227,57,143,.13), transparent 35%),
    linear-gradient(120deg, rgba(5,10,24,.34), rgba(7,19,42,.22) 52%, rgba(10,11,36,.30));
  background-size: auto;
  mask-image: none;
  pointer-events: none;
}

.hero-bg,
.hero-overlay,
.hero-diaporama {
  display: none !important;
}

.hero > .container,
.page-hero > .container,
.hero-inner {
  position: relative;
  z-index: 2;
}

@media (max-width: 720px) {
  .hero::before,
  .page-hero::before {
    filter: grayscale(100%) brightness(1.25) contrast(.94);
    transform: scale(1.015);
  }
  .hero::after,
  .page-hero::after {
    background: linear-gradient(120deg, rgba(5,10,24,.48), rgba(7,19,42,.34));
  }
}

/* Portrait diaporama fix: use a properly rescaled wide version of Yamileth's portrait. */
@keyframes heroDiaporamaFixed {
  0%, 49.999% { background-image: url('hero-slide-panama.png'); }
  50%, 99.999% { background-image: url('hero-slide-yamileth-wide.jpg'); }
  100% { background-image: url('hero-slide-panama.png'); }
}
.hero::before,
.page-hero::before {
  content: "" !important;
  display: block !important;
  position: absolute !important;
  inset: 0 !important;
  background-image: url('hero-slide-panama.png');
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center center;
  opacity: .96;
  filter: grayscale(100%) brightness(1.25) contrast(.92);
  animation: heroDiaporamaFixed 10s steps(1, end) infinite;
  transform: scale(1.012);
  transform-origin: center center;
  z-index: 0 !important;
  pointer-events: none;
}
.hero::after,
.page-hero::after {
  content: "" !important;
  display: block !important;
  position: absolute !important;
  inset: 0 !important;
  background:
    radial-gradient(circle at 18% 22%, rgba(34,211,238,.14), transparent 34%),
    radial-gradient(circle at 84% 16%, rgba(227,57,143,.16), transparent 35%),
    linear-gradient(120deg, rgba(5,10,24,.34), rgba(7,19,42,.24) 52%, rgba(10,11,36,.32));
  mask-image: none !important;
  z-index: 1 !important;
  pointer-events: none;
}
.hero-bg,
.hero-overlay {
  display: none !important;
}
.hero > .container,
.page-hero > .container,
.hero-inner {
  position: relative;
  z-index: 2;
}

/* Final fix: use the newly rebuilt panoramic Yamileth slide so the second diaporama photo scales correctly on wide hero/page headers. */
@keyframes heroDiaporama {
  0%, 49.999% {
    background-image: url('hero-slide-panama.png');
    background-size: cover;
    background-position: center center;
  }
  50%, 99.999% {
    background-image: url('hero-slide-yamileth-wide.jpg');
    background-size: cover;
    background-position: center center;
  }
  100% {
    background-image: url('hero-slide-panama.png');
    background-size: cover;
    background-position: center center;
  }
}
.hero-bg {
  background-image: url('hero-slide-panama.png');
  background-size: cover;
  background-position: center center;
  animation: heroDiaporama 10s steps(1, end) infinite;
}

/* FINAL USER CORRECTION - second diaporama photo
   Use the exact portrait photo supplied by the client, centered and unmodified.
   The first Panama image still covers the hero; the second portrait uses contain/auto height,
   so it is never stretched, cropped, or converted into a fake panoramic image. */
@keyframes heroDiaporamaExactPortrait {
  0%, 49.999% {
    background-image: url('hero-slide-panama.png');
    background-size: cover;
    background-position: center center;
    background-color: #07132a;
  }
  50%, 99.999% {
    background-image: url('hero-slide-yamileth-original.jpeg');
    background-size: contain;
    background-position: center center;
    background-color: #e9ecef;
  }
  100% {
    background-image: url('hero-slide-panama.png');
    background-size: cover;
    background-position: center center;
    background-color: #07132a;
  }
}

.hero,
.page-hero {
  background: #e9ecef !important;
}

.hero::before,
.page-hero::before {
  content: "" !important;
  display: block !important;
  position: absolute !important;
  inset: 0 !important;
  z-index: 0 !important;
  pointer-events: none !important;
  background-image: url('hero-slide-panama.png');
  background-repeat: no-repeat !important;
  background-position: center center;
  background-size: cover;
  background-color: #e9ecef;
  opacity: .98 !important;
  filter: grayscale(100%) brightness(1.18) contrast(.96) !important;
  transform: none !important;
  transform-origin: center center !important;
  animation: heroDiaporamaExactPortrait 10s steps(1, end) infinite !important;
}

.hero::after,
.page-hero::after {
  content: "" !important;
  display: block !important;
  position: absolute !important;
  inset: 0 !important;
  z-index: 1 !important;
  pointer-events: none !important;
  background:
    radial-gradient(circle at 18% 22%, rgba(34,211,238,.10), transparent 34%),
    radial-gradient(circle at 84% 16%, rgba(227,57,143,.12), transparent 35%),
    linear-gradient(120deg, rgba(5,10,24,.26), rgba(7,19,42,.16) 52%, rgba(10,11,36,.24)) !important;
  mask-image: none !important;
}

.hero-bg,
.hero-overlay,
.hero-diaporama {
  display: none !important;
}

@media (max-width: 720px) {
  .hero::before,
  .page-hero::before {
    filter: grayscale(100%) brightness(1.20) contrast(.96) !important;
  }
  .hero::after,
  .page-hero::after {
    background: linear-gradient(120deg, rgba(5,10,24,.36), rgba(7,19,42,.20)) !important;
  }
}

/* Final diaporama correction requested by user: use the original Yamileth portrait as-is, centered, without creating a wide/blurred composite. */
.hero::before,
.page-hero::before {
  display: none !important;
  animation: none !important;
  background: none !important;
}

.hero-bg,
.page-hero .hero-bg {
  display: block !important;
  position: absolute !important;
  inset: 0 !important;
  z-index: 0 !important;
  overflow: hidden !important;
  background: #0b1323 !important;
  pointer-events: none !important;
}

.hero-bg::before,
.hero-bg::after {
  content: "";
  position: absolute;
  inset: 0;
  background-repeat: no-repeat;
  background-position: center center;
  pointer-events: none;
}

.hero-bg::before {
  background-image: url('hero-slide-panama.png');
  background-size: cover;
  filter: grayscale(100%) brightness(1.18) contrast(.95);
  opacity: 1;
  animation: ecSlidePanama 10s steps(1, end) infinite;
}

.hero-bg::after {
  background-image: url('hero-slide-yamileth-original.jpeg');
  background-size: contain;
  background-color: #0b1323;
  filter: grayscale(100%) brightness(1.12) contrast(.96);
  opacity: 0;
  animation: ecSlideYamilethOriginal 10s steps(1, end) infinite;
}

@keyframes ecSlidePanama {
  0%, 49.999% { opacity: 1; }
  50%, 100% { opacity: 0; }
}

@keyframes ecSlideYamilethOriginal {
  0%, 49.999% { opacity: 0; }
  50%, 99.999% { opacity: 1; }
  100% { opacity: 0; }
}

@media (max-width: 720px) {
  .hero-bg::after {
    background-size: auto 100%;
    background-position: center center;
  }
}

/* TRUE FINAL FIX - Yamileth diaporama slide
   Use the exact portrait supplied by the client, centered and unmodified.
   The portrait is NOT stretched, cropped into a panorama, or blurred. */
.hero::before,
.hero::after,
.page-hero::before,
.page-hero::after {
  content: none !important;
  display: none !important;
  animation: none !important;
}
.hero > .hero-bg,
.page-hero > .hero-bg {
  display: block !important;
  position: absolute !important;
  inset: 0 !important;
  z-index: 0 !important;
  overflow: hidden !important;
  background: #eef2f5 !important;
  opacity: 1 !important;
  filter: grayscale(100%) brightness(1.14) contrast(.96) !important;
  transform: none !important;
  animation: none !important;
  pointer-events: none !important;
}
.hero > .hero-bg::after,
.page-hero > .hero-bg::after,
.hero > .hero-bg::before,
.page-hero > .hero-bg::before {
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;
  background-repeat: no-repeat !important;
  pointer-events: none !important;
}
/* First photo: Panama skyline / boats, still covering the header elegantly. */
.hero > .hero-bg::after,
.page-hero > .hero-bg::after {
  z-index: 1 !important;
  background-image: url('hero-slide-panama.png') !important;
  background-size: cover !important;
  background-position: center center !important;
  opacity: 1;
  animation: finalPanamaSlide 10s ease-in-out infinite !important;
}
/* Second photo: exact Yamileth portrait, centered and contained without distortion. */
.hero > .hero-bg::before,
.page-hero > .hero-bg::before {
  z-index: 2 !important;
  background-color: #eef2f5 !important;
  background-image: url('hero-slide-yamileth-original.jpg') !important;
  background-size: contain !important;
  background-position: center center !important;
  opacity: 0;
  animation: finalYamilethSlide 10s ease-in-out infinite !important;
}
.hero > .hero-overlay,
.page-hero > .hero-overlay {
  display: block !important;
  position: absolute !important;
  inset: 0 !important;
  z-index: 1 !important;
  pointer-events: none !important;
  background:
    radial-gradient(circle at 16% 22%, rgba(34,211,238,.09), transparent 34%),
    radial-gradient(circle at 84% 16%, rgba(227,57,143,.11), transparent 35%),
    linear-gradient(120deg, rgba(5,10,24,.22), rgba(7,19,42,.14) 52%, rgba(10,11,36,.20)) !important;
}
.hero > .container,
.page-hero > .container,
.hero-inner {
  position: relative !important;
  z-index: 2 !important;
}
@keyframes finalPanamaSlide {
  0%, 43% { opacity: 1; }
  49%, 94% { opacity: 0; }
  100% { opacity: 1; }
}
@keyframes finalYamilethSlide {
  0%, 43% { opacity: 0; }
  49%, 94% { opacity: 1; }
  100% { opacity: 0; }
}
@media (max-width: 720px) {
  .hero > .hero-bg::before,
  .page-hero > .hero-bg::before {
    background-size: contain !important;
    background-position: center center !important;
  }
  .hero > .hero-overlay,
  .page-hero > .hero-overlay {
    background: linear-gradient(120deg, rgba(5,10,24,.30), rgba(7,19,42,.20)) !important;
  }
}

/* User-requested correction after visual review: keep the second diaporama photo as the exact original portrait, centered and not image-edited by CSS. */
.hero > .hero-bg,
.page-hero > .hero-bg {
  filter: none !important;
}
.hero > .hero-bg::after,
.page-hero > .hero-bg::after {
  filter: grayscale(100%) brightness(1.18) contrast(.95) !important;
}
.hero > .hero-bg::before,
.page-hero > .hero-bg::before {
  background-image: url('hero-slide-yamileth-original.jpg') !important;
  background-size: contain !important;
  background-position: center center !important;
  filter: none !important;
}

/* SCREEN-FIT DIAPORAMA CORRECTION - 2026-06-19
   The second slide now uses the exact Yamileth portrait supplied by the client,
   scaled like the first Panama slide: no stretching, no artificial panorama, no blur composite.
   Because the source photo is portrait and the website header is wide, cover scaling fills the screen
   and crops only the excess vertical area while keeping the subject centered. */
.hero > .hero-bg::before,
.page-hero > .hero-bg::before {
  background-image: url('hero-slide-yamileth-original.jpg') !important;
  background-size: cover !important;
  background-position: center 30% !important;
  background-repeat: no-repeat !important;
  background-color: #eef2f5 !important;
  filter: grayscale(100%) brightness(1.16) contrast(.98) !important;
  transform: none !important;
}

.hero > .hero-bg::after,
.page-hero > .hero-bg::after {
  background-size: cover !important;
  background-position: center center !important;
}

@media (min-width: 1180px) {
  .hero > .hero-bg::before {
    background-position: center 29% !important;
  }
  .page-hero > .hero-bg::before {
    background-position: center 31% !important;
  }
}

@media (max-width: 720px) {
  .hero > .hero-bg::before,
  .page-hero > .hero-bg::before {
    background-size: cover !important;
    background-position: center 28% !important;
  }
}

/* SCREEN-FIT DIAPORAMA CORRECTION - 2026-06-19
   The second slide uses the exact Yamileth portrait supplied by the client,
   scaled like the first Panama slide: no stretching, no artificial panorama, no blur composite.
   The source photo is portrait and the website header is wide, so cover scaling fills the screen
   and crops only the excess vertical area while keeping the subject centered. */
.hero > .hero-bg::before,
.page-hero > .hero-bg::before {
  background-image: url('hero-slide-yamileth-original.jpg') !important;
  background-size: cover !important;
  background-position: center 30% !important;
  background-repeat: no-repeat !important;
  background-color: #eef2f5 !important;
  filter: grayscale(100%) brightness(1.16) contrast(.98) !important;
  transform: none !important;
}

.hero > .hero-bg::after,
.page-hero > .hero-bg::after {
  background-size: cover !important;
  background-position: center center !important;
}

@media (min-width: 1180px) {
  .hero > .hero-bg::before {
    background-position: center 29% !important;
  }
  .page-hero > .hero-bg::before {
    background-position: center 31% !important;
  }
}

@media (max-width: 720px) {
  .hero > .hero-bg::before,
  .page-hero > .hero-bg::before {
    background-size: cover !important;
    background-position: center 28% !important;
  }
}

/* User request: rescale the second diaporama image to match the screen like the first slide.
   The Yamileth slide is now a wide, screen-fit asset built from the supplied portrait without distortion. */
@keyframes heroDiaporamaScreenFit {
  0%, 49.999% {
    background-image: url('hero-slide-panama.png');
    background-size: cover;
    background-position: center center;
  }
  50%, 99.999% {
    background-image: url('hero-slide-yamileth-screen.jpg');
    background-size: cover;
    background-position: center center;
  }
  100% {
    background-image: url('hero-slide-panama.png');
    background-size: cover;
    background-position: center center;
  }
}
.hero::before,
.page-hero::before {
  background-image: url('hero-slide-panama.png') !important;
  background-size: cover !important;
  background-position: center center !important;
  background-repeat: no-repeat !important;
  animation: heroDiaporamaScreenFit 10s steps(1, end) infinite !important;
  filter: grayscale(100%) brightness(1.18) contrast(.96) !important;
}


/* Client correction: make Yamileth's second diaporama photo fill the hero/page headers like the Panama skyline slide.
   The source portrait is centered and proportionally rescaled inside a wide hero asset, avoiding distortion and side gaps. */
.hero > .hero-bg::before,
.page-hero > .hero-bg::before {
  background-image: url('hero-slide-yamileth-screen.jpg') !important;
  background-size: cover !important;
  background-position: center center !important;
  background-color: #eef2f5 !important;
  filter: grayscale(100%) brightness(1.16) contrast(.96) !important;
}
.hero > .hero-bg::after,
.page-hero > .hero-bg::after {
  background-image: url('hero-slide-panama.png') !important;
  background-size: cover !important;
  background-position: center center !important;
  filter: grayscale(100%) brightness(1.20) contrast(.94) !important;
}
.hero > .hero-bg,
.page-hero > .hero-bg {
  background: #07132a !important;
}
.hero > .hero-overlay,
.page-hero > .hero-overlay {
  background:
    radial-gradient(circle at 16% 22%, rgba(34,211,238,.08), transparent 34%),
    radial-gradient(circle at 84% 16%, rgba(227,57,143,.10), transparent 35%),
    linear-gradient(120deg, rgba(5,10,24,.20), rgba(7,19,42,.13) 52%, rgba(10,11,36,.18)) !important;
}
@media (max-width: 720px) {
  .hero > .hero-bg::before,
  .page-hero > .hero-bg::before {
    background-size: cover !important;
    background-position: center center !important;
  }
}

/* FINAL SCREEN-FIT OVERRIDE - Yamileth diaporama slide */
@keyframes heroDiaporamaScreenFitFinal {
  0%, 49.999% {
    background-image: url('hero-slide-panama.png');
    background-size: cover;
    background-position: center center;
  }
  50%, 99.999% {
    background-image: url('hero-slide-yamileth-screen.jpg');
    background-size: cover;
    background-position: center center;
  }
  100% {
    background-image: url('hero-slide-panama.png');
    background-size: cover;
    background-position: center center;
  }
}
.hero::before,
.page-hero::before {
  background-image: url('hero-slide-panama.png') !important;
  background-size: cover !important;
  background-position: center center !important;
  background-repeat: no-repeat !important;
  animation: heroDiaporamaScreenFitFinal 10s steps(1, end) infinite !important;
  filter: grayscale(100%) brightness(1.18) contrast(.96) !important;
  transform: none !important;
}

/* SUBJECT-CENTER TUNING - use a cover crop that fills the screen and keeps Yamileth centered. */
.hero > .hero-bg::before,
.page-hero > .hero-bg::before {
  background-size: cover !important;
  background-position: center 25% !important;
}
@media (min-width: 1180px) {
  .hero > .hero-bg::before,
  .page-hero > .hero-bg::before {
    background-position: center 25% !important;
  }
}
@media (max-width: 720px) {
  .hero > .hero-bg::before,
  .page-hero > .hero-bg::before {
    background-position: center 25% !important;
  }
}

/* FINAL CLIENT-REQUESTED SCREEN-FIT: second diaporama photo fills the same wide header area as the Panama slide. */
.hero > .hero-bg::before,
.page-hero > .hero-bg::before {
  background-image: url('hero-slide-yamileth-screen.jpg') !important;
  background-size: cover !important;
  background-position: center center !important;
  background-repeat: no-repeat !important;
  filter: grayscale(100%) brightness(1.16) contrast(.96) !important;
}
@media (max-width: 720px) {
  .hero > .hero-bg::before,
  .page-hero > .hero-bg::before {
    background-size: cover !important;
    background-position: center center !important;
  }
}

/* 2026-06-19 client-requested face-centered crop for second diaporama slide.
   Built directly from the supplied portrait: no blurred side fill, no artificial composite, no stretching.
   The crop is wide-screen and centered around Yamileth's face so it fills the header like the Panama slide. */
.hero > .hero-bg::before,
.page-hero > .hero-bg::before {
  background-image: url('hero-slide-yamileth-facefit.jpg') !important;
  background-size: cover !important;
  background-position: center center !important;
  background-repeat: no-repeat !important;
  filter: grayscale(100%) brightness(1.16) contrast(.96) !important;
}


/* FINAL FACE-CENTERED DIAPORAMA CROP - 2026-06-19 */
.hero > .hero-bg::before,
.page-hero > .hero-bg::before {
  background-image: url('hero-slide-yamileth-facecenter.jpg') !important;
  background-size: cover !important;
  background-position: center center !important;
  background-repeat: no-repeat !important;
  background-color: #07132a !important;
  filter: grayscale(100%) brightness(1.17) contrast(.97) !important;
  transform: none !important;
}
.hero > .hero-bg::after,
.page-hero > .hero-bg::after {
  background-image: url('hero-slide-panama.png') !important;
  background-size: cover !important;
  background-position: center center !important;
  background-repeat: no-repeat !important;
  filter: grayscale(100%) brightness(1.20) contrast(.94) !important;
}
@media (max-width: 720px) {
  .hero > .hero-bg::before,
  .page-hero > .hero-bg::before {
    background-image: url('hero-slide-yamileth-facecenter.jpg') !important;
    background-size: cover !important;
    background-position: center center !important;
  }
}

/* RECURSOS BLOG CARD TEXT-FIT FIX ONLY - 2026-06-19
   Keep the Recursos page Blog graphic text inside the blue card without changing global typography. */
.blog-image-card {
  background-image: url('blog-card-fit.png') !important;
  background-size: cover !important;
  background-position: center center !important;
  background-repeat: no-repeat !important;
  background-color: #172368 !important;
  overflow: hidden !important;
}
@media (max-width: 1020px) {
  .blog-image-card {
    min-height: clamp(340px, 58vw, 520px) !important;
  }
}
@media (max-width: 560px) {
  .blog-image-card {
    min-height: 340px !important;
  }
}

/* Server-side contact form status */
.hp-field{position:absolute!important;left:-10000px!important;top:auto!important;width:1px!important;height:1px!important;overflow:hidden!important;opacity:0!important;pointer-events:none!important}
.form-status{display:none;margin:0 0 18px;padding:14px 16px;border-radius:0;font-weight:800;line-height:1.4}
.form-status.is-visible{display:block}
.form-status.success{background:rgba(13,187,127,.12);border:1px solid rgba(13,187,127,.28);color:#075b43}
.form-status.error{background:rgba(227,57,143,.10);border:1px solid rgba(227,57,143,.28);color:#8d1854}
.form-submit:disabled{opacity:.7;cursor:wait;transform:none}

/* === b - Página web 5 adjustments: Roboto everywhere, SEO copy, service/about/contact refinements === */
html, body, body *, body *::before, body *::after {
  font-family:'Roboto', sans-serif;
}
.hero-title {
  font-size: clamp(2.25rem, 4vw, 4.2rem);
  letter-spacing: -0.035em;
  max-width: 980px;
  margin-left: auto;
  margin-right: auto;
}
.hero-copy {
  max-width: 900px;
  font-size: clamp(1rem, 1.35vw, 1.22rem);
}
.intro-stat {
  background-image:
    linear-gradient(135deg, rgba(6, 18, 42, .82), rgba(19, 39, 91, .68)),
    url('data-dashboard-bg.jpg') !important;
  background-size: cover !important;
  background-position: center !important;
  min-height: 360px;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
}
.intro-stat::after {
  opacity: .18;
}
.intro-copy p + p {
  margin-top: 1.15rem;
}
.about-grid.vision-only {
  grid-template-columns: 1fr !important;
  max-width: 1040px;
}
.text-card.vision-wide p {
  font-size: 1.05rem;
  text-align: justify;
}
.text-card.vision-wide p + p {
  margin-top: 1rem;
}
.profile-kicker {
  color: var(--cyan);
  text-transform: uppercase;
  font-weight: 900;
  letter-spacing: .12em;
  font-size: .82rem;
  margin-bottom: .7rem;
}
.profile-body h2 {
  margin-top: 0;
}
.profile-body p {
  text-align: justify;
}
.profile-side .side-role {
  color: var(--pink);
  font-weight: 900;
  line-height: 1.35;
}
.cta-ribbon {
  text-align: center;
}
.cta-ribbon h3,
.cta-ribbon p {
  text-align: center !important;
}
.cta-ribbon .btn {
  justify-self: center;
}
.service-bands-wide {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}
.service-chip h3 {
  text-align: center;
}
.contact-info p[data-i18n="contact.get.copy"] {
  font-size: 1.02rem;
  line-height: 1.75;
}
@media (max-width: 1020px) {
  .service-bands-wide { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 620px) {
  .service-bands-wide { grid-template-columns: 1fr; }
  .hero-title { font-size: clamp(2rem, 10vw, 3.2rem); }
}


/* === b - Pagina web 6 resource/news/normative updates === */
.b6-feature {
  background-image: linear-gradient(135deg, rgba(4, 9, 22, .66), rgba(21, 35, 89, .45)), url('recursos-perspectiva-bg.png') !important;
  background-size: cover !important;
  background-position: center center !important;
  min-height: 520px;
  justify-content: flex-end;
}
.feature-overlay-copy {
  position: relative;
  z-index: 1;
  background: linear-gradient(180deg, rgba(4,10,28,.08), rgba(4,10,28,.58));
  margin: -42px;
  padding: 42px;
}
.feature-overlay-copy h2 {
  margin: 14px 0 0;
  font-size: clamp(2.2rem, 4vw, 4.1rem);
  line-height: 1.02;
  font-weight: 900;
  letter-spacing: -.04em;
}
.resource-section { padding-top: 40px; }
.text-link {
  display: inline-flex;
  margin-top: 12px;
  color: var(--blue);
  font-weight: 900;
  text-decoration: none;
}
.text-link:hover { color: var(--pink); }
.ec-carousel {
  position: relative;
}
.carousel-track {
  display: grid;
  grid-auto-flow: column;
  grid-auto-columns: minmax(300px, 360px);
  gap: 22px;
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  scroll-behavior: smooth;
  padding: 10px 6px 26px;
  scrollbar-width: thin;
}
.article-track { grid-auto-columns: minmax(320px, 410px); }
.pdf-track { grid-auto-columns: minmax(280px, 340px); }
.carousel-btn {
  position: absolute;
  top: 50%;
  z-index: 5;
  transform: translateY(-50%);
  width: 46px;
  height: 46px;
  border-radius: 50%;
  border: 1px solid rgba(9, 19, 44, .12);
  background: #fff;
  box-shadow: 0 18px 40px rgba(9,19,44,.14);
  color: var(--navy);
  font-size: 2rem;
  line-height: 1;
  cursor: pointer;
  display: grid;
  place-items: center;
}
.carousel-btn:hover { background: linear-gradient(135deg, var(--cyan), var(--blue)); color: #fff; }
.carousel-btn.prev { left: -18px; }
.carousel-btn.next { right: -18px; }
.article-card, .pdf-card {
  scroll-snap-align: start;
  background: #fff;
  border: 1px solid rgba(10,25,56,.08);
  border-radius: 0;
  overflow: hidden;
  box-shadow: 0 18px 45px rgba(9,19,44,.09);
  transition: transform .32s ease, box-shadow .32s ease;
}
.article-card:hover, .pdf-card:hover { transform: translateY(-8px); box-shadow: 0 30px 68px rgba(9,19,44,.16); }
.article-card-image { display: block; height: 330px; background: #eef2fb; overflow: hidden; }
.article-card-image img { width: 100%; height: 100%; object-fit: cover; object-position: center; display: block; transition: transform .45s ease; }
.article-card:hover .article-card-image img { transform: scale(1.04); }
.article-card-body { padding: 24px; }
.article-tag, .article-kicker {
  display: inline-flex;
  color: var(--cyan);
  text-transform: uppercase;
  letter-spacing: .14em;
  font-size: .75rem;
  font-weight: 900;
  margin-bottom: 12px;
}
.article-card h3 { margin: 0 0 12px; font-size: 1.24rem; line-height: 1.22; font-weight: 900; }
.article-card h3 a { color: var(--navy); text-decoration: none; }
.article-card h3 a:hover { color: var(--blue); }
.article-card-meta { color: var(--muted); font-size: .9rem; line-height: 1.45; }
.pdf-card { min-height: 300px; padding: 28px; display: flex; flex-direction: column; justify-content: space-between; align-items: flex-start; }
.pdf-icon { width: 66px; height: 66px; border-radius: 0; display: grid; place-items: center; color: #fff; background: linear-gradient(135deg, var(--cyan), var(--purple), var(--pink)); box-shadow: 0 14px 30px rgba(124,58,237,.25); }
.pdf-icon .icon { width: 34px; height: 34px; }
.pdf-card h3 { font-size: 1.15rem; line-height: 1.25; margin: 20px 0; font-weight: 900; color: var(--navy); }
.small-btn { padding: 12px 18px; font-size: .92rem; }
.article-section { padding-top: 80px; }
.article-shell { max-width: 1020px; }
.article-hero .container { max-width: 980px; }
.article-page-title { font-size: clamp(2.4rem, 5vw, 4.6rem); line-height: 1.05; }
.news-article { background: #fff; border: 1px solid rgba(10,25,56,.08); box-shadow: var(--shadow); padding: clamp(28px, 5vw, 62px); }
.news-article h1 { font-size: clamp(2rem, 4vw, 3.8rem); line-height: 1.08; margin: 0 0 16px; font-weight: 900; color: var(--navy); letter-spacing: -.035em; }
.article-meta { display: flex; flex-wrap: wrap; gap: 10px 26px; color: var(--muted); font-weight: 800; border-top: 1px solid rgba(10,25,56,.08); border-bottom: 1px solid rgba(10,25,56,.08); padding: 16px 0; margin: 16px 0 28px; }
.article-feature { margin: 0 0 34px; border-radius: 0; overflow: hidden; background: #f5f7fb; box-shadow: 0 18px 42px rgba(9,19,44,.10); }
.article-feature img { display: block; width: 100%; max-height: 760px; object-fit: contain; background: #f5f7fb; }
.article-content { font-size: 1.08rem; line-height: 1.82; color: #263651; }
.article-content p { margin: 0 0 1.15rem; text-align: justify; }
.article-content h2 { font-size: 1.45rem; line-height: 1.28; margin: 2.2rem 0 1rem; color: var(--navy); font-weight: 900; }
.article-list { margin: .2rem 0 1.3rem 1.3rem; padding-left: 1.1rem; }
.article-list li { margin: .45rem 0; }
.article-back { display: flex; flex-wrap: wrap; gap: 14px; margin-top: 34px; padding-top: 28px; border-top: 1px solid rgba(10,25,56,.08); }
.dark-text { color: var(--navy) !important; border-color: rgba(10,25,56,.2) !important; }
.normative-section { background: linear-gradient(180deg, #fff 0%, #f8faff 100%); }
@media (max-width: 1020px) {
  .b6-feature { min-height: 430px; }
  .carousel-btn { display: none; }
  .carousel-track { grid-auto-columns: minmax(285px, 82vw); }
}
@media (max-width: 560px) {
  .feature-overlay-copy { margin: -28px; padding: 30px; }
  .article-card-image { height: 280px; }
  .news-article { padding: 24px; }
  .article-content { font-size: 1rem; }
}