
:root{--bg:#070D0C;--surface:#111C18;--ink:#F4F8F5;--muted:#A9B9B0;--accent:#71E5AB;--font-display:Arial,sans-serif;--radius:24px;--space:24px}
:where(*,*::before,*::after){box-sizing:border-box}html{background:var(--bg);color:var(--ink)}body.tecnohub{margin:0;background:var(--bg);color:var(--ink);font:16px/1.6 Arial,sans-serif}a{color:inherit;text-decoration:none}button{font:inherit}a,button{-webkit-tap-highlight-color:transparent}a:focus-visible,button:focus-visible{outline:2px solid var(--accent);outline-offset:7px}.wrap{width:min(1440px,calc(100% - 96px));margin-inline:auto}.skip{position:fixed;top:-100px;left:24px;background:var(--ink);color:var(--bg);padding:12px;z-index:1000}.skip:focus{top:12px}.site-header{height:94px;border-bottom:1px solid #a9b9b020;background:var(--bg);position:relative;z-index:10}.nav-row{height:100%;display:flex;justify-content:space-between;align-items:center;gap:32px}.brand{display:flex;gap:12px;align-items:center;font-size:12px;line-height:1.3;letter-spacing:2px;font-weight:700;white-space:nowrap}.brand-mark{font-size:36px;letter-spacing:-9px;line-height:1;color:var(--ink);padding-right:10px}.brand-mark span{color:var(--accent)}.brand-bottom{display:block;font-size:11px;letter-spacing:2.65px;margin-top:3px}nav{display:flex;gap:32px;align-items:center}nav a{font-size:13px;color:var(--muted);transition:color .2s}nav a:hover,nav a[aria-current]{color:var(--ink)}nav a:last-child{padding:10px 24px;border:1px solid #a9b9b045;border-radius:var(--radius)}.menu-toggle{display:none}.hero-stage{height:145svh;min-height:850px}.hero{position:sticky;top:0;height:calc(100svh - 0px);min-height:620px;max-height:1100px;overflow:hidden;background:var(--bg)}.hero-atmosphere{position:absolute;inset:0;background:radial-gradient(ellipse at 50% 45%,#71e5ab15,transparent 50%)}#flow-canvas{position:absolute;inset:0;width:100%;height:100%;display:block}.hero-content{position:relative;height:100%;pointer-events:none}.hero h1{margin:0;font:500 clamp(48px,5.7vw,88px)/1.05 var(--font-display);letter-spacing:-.065em}.headline-left,.headline-right{position:absolute;top:35%;transform:translateY(-50%);display:block}.headline-left{left:0}.headline-right{right:0;width:22%;}.hero-bottom{position:absolute;bottom:14%;left:0;right:0;display:flex;align-items:flex-end;justify-content:space-between;gap:32px}.hero-description p{margin:0;font-size:clamp(15px,1.35vw,19px);line-height:1.6;color:var(--muted)}.hero-actions{display:flex;gap:12px;pointer-events:auto}.button{display:flex;gap:24px;align-items:center;justify-content:center;padding:15px 25px;font-size:13px;border-radius:32px;border:1px solid #a9b9b040;transition:background .2s,transform .2s}.button:hover{transform:translateY(-3px);background:var(--surface)}.primary{background:var(--ink);color:var(--bg);border-color:var(--ink)}.primary:hover{background:var(--accent);border-color:var(--accent)}.button span{font-size:20px;line-height:1}.motion-toggle{position:absolute;bottom:24px;right:28px;background:var(--surface);color:var(--ink);border:1px solid #a9b9b040;border-radius:50%;width:42px;height:42px;cursor:pointer;z-index:3}.intro{padding-block:110px 130px;border-top:1px solid #a9b9b030}.eyebrow{font-size:11px;letter-spacing:2px;color:var(--accent);margin:0 0 28px}.intro h2{font:500 clamp(32px,4.6vw,66px)/1.1 Arial,sans-serif;letter-spacing:-.045em;margin:0 0 32px;max-width:1000px}.intro-copy{font-size:18px;color:var(--muted);max-width:600px;margin:0 0 30px}.text-link{display:inline-flex;gap:32px;border-bottom:1px solid #a9b9b060;padding-bottom:10px;font-size:14px}.site-footer{display:flex;gap:24px;justify-content:space-between;padding-block:32px;border-top:1px solid #a9b9b030;font-size:12px;color:var(--muted)}.content-page{min-height:70vh;padding-block:90px}.content-page h1{font-size:clamp(40px,6vw,80px);line-height:1.1;letter-spacing:-.04em}.page-copy{max-width:700px}.admin-bar .hero{top:32px}.no-webgl .hero-atmosphere{background:radial-gradient(circle at 50% 43%,#f4f8f5aa 0, #71e5ab33 3%,transparent 16%),repeating-radial-gradient(ellipse at 50% 43%,transparent 0 35px,#71e5ab20 36px 37px,transparent 39px 62px)}
@media(min-width:1000px){.hero{height:calc(100svh - 94px);min-height:610px}}@media(max-width:1000px){.wrap{width:calc(100% - 48px)}nav{gap:20px}.hero-actions{flex-direction:column}.hero h1{font-size:55px}.headline-right{width:26%}}
@media(max-width:720px){.wrap{width:calc(100% - 40px)}.site-header{height:78px}.brand{font-size:10px}.brand-bottom{font-size:9px}.brand-mark{font-size:30px}.menu-toggle{display:flex;gap:16px;background:none;border:0;color:var(--ink);padding:10px 0;font-size:13px}nav{display:none;position:absolute;top:78px;left:0;right:0;padding:20px;background:var(--surface);flex-direction:column;align-items:stretch;gap:0;border-bottom:1px solid #a9b9b030}nav.open{display:flex}nav a,nav a:last-child{padding:14px;border:0}.hero-stage{height:130svh;min-height:760px}.hero{height:calc(100svh - 78px);min-height:590px}.hero h1{font-size:clamp(38px,10vw,64px);letter-spacing:-.055em;text-align:center;padding-top:35px}.headline-left,.headline-right{position:static;transform:none;width:auto;display:inline}.headline-right:before{content:' '}.headline-right br{display:none}.hero-bottom{bottom:70px;flex-direction:column;align-items:center;gap:20px;text-align:center}.hero-description p{font-size:14px}.hero-description br{display:none}.hero-actions{flex-direction:row;gap:8px}.button{padding:12px 16px;gap:12px;font-size:11px}.motion-toggle{width:36px;height:36px;right:20px;bottom:18px}.intro{padding-block:70px}.intro h2 br{display:none}.intro-copy{font-size:16px}.site-footer{flex-direction:column;gap:8px}.admin-bar .hero{top:46px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important}.hero-stage{height:auto;min-height:0}.hero{position:relative}.motion-toggle{display:none}}

/* Cinematic sequence revision: scoped to the homepage. */
.page-template-page-cinematic .site-footer,.page-template-page-cinematic .hero-bottom,.page-template-page-cinematic .intro{display:none}
.page-template-page-cinematic .hero-stage{height:280svh;min-height:0}
.page-template-page-cinematic .hero{height:100svh;min-height:0;max-height:none;top:0}
.page-template-page-cinematic .hero-content{width:calc(100% - 8vw);max-width:none}
.page-template-page-cinematic .hero h1{position:relative;height:100%;padding:0;font-size:clamp(28px,4.2vw,76px);line-height:1.12;letter-spacing:-.045em;text-align:left;will-change:opacity,transform}
.page-template-page-cinematic .headline-left,.page-template-page-cinematic .headline-right{position:absolute;display:block;top:50%;transform:translateY(-50%);width:auto;max-width:28%;white-space:normal}
.page-template-page-cinematic .headline-left{left:0}.page-template-page-cinematic .headline-right{right:0;text-align:right}.page-template-page-cinematic .headline-right:before{content:none}
.page-template-page-cinematic .hero-atmosphere{background:radial-gradient(ellipse at center,#f4f8f508,transparent 55%)}
.safety-message{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;text-align:center;padding:8vw;margin:0;font:500 clamp(32px,5.5vw,84px)/1.12 Arial,sans-serif;letter-spacing:-.045em;color:var(--ink);opacity:0;pointer-events:none;will-change:transform,opacity;text-wrap:balance}
.page-template-page-cinematic .motion-toggle{opacity:0;width:1px;height:1px;overflow:hidden;padding:0;border:0;bottom:16px;right:16px}.page-template-page-cinematic .motion-toggle:focus-visible{opacity:1;width:44px;height:44px;outline:2px solid var(--accent);overflow:visible}
.page-template-page-cinematic .hero-atmosphere{pointer-events:none}
@media(max-width:720px){.page-template-page-cinematic .hero h1{font-size:clamp(22px,4.7vw,34px)}.page-template-page-cinematic .headline-left,.page-template-page-cinematic .headline-right{max-width:27%;top:50%}.page-template-page-cinematic .headline-right{text-wrap:balance}.safety-message{font-size:clamp(32px,8vw,56px)}}
@media(prefers-reduced-motion:reduce){.page-template-page-cinematic .hero-stage{height:200svh;min-height:0}.page-template-page-cinematic .hero{position:sticky;top:0}.page-template-page-cinematic .motion-toggle{display:none}}

/* Transparent 1/2-inch navigation bar; original logo without glow. */
body.tecnohub .site-header{display:block;position:sticky;top:0;z-index:50;height:48px;margin-bottom:-48px;background:transparent;border:0;box-shadow:none;backdrop-filter:none}
body.tecnohub .site-header .nav-row{height:48px;min-height:48px;justify-content:flex-start;gap:36px;width:92%;max-width:none}
body.tecnohub .site-header .brand{height:48px;padding:0;flex:0 0 auto}
.mth-company-logo{display:block;height:24px;width:auto;max-width:none;object-fit:contain;filter:none;box-shadow:none;background:transparent}
body.tecnohub .site-header nav{justify-content:flex-start;gap:28px;height:48px}
body.tecnohub .site-header nav a,body.tecnohub .site-header nav a:last-child{display:flex;align-items:center;height:48px;padding:0;border:0;border-radius:0;color:var(--ink);font-size:13px;white-space:nowrap}
body.tecnohub .site-header nav a:hover{color:var(--accent)}
body.tecnohub.admin-bar .site-header{top:32px}
@media(max-width:900px){
 body.tecnohub .site-header .nav-row{gap:24px}
 body.tecnohub .site-header .menu-toggle{display:flex;align-items:center;gap:12px;height:48px;padding:0;background:transparent;color:var(--ink);border:0}
 body.tecnohub .site-header nav{display:none;position:absolute;top:48px;left:4vw;right:auto;width:auto;height:auto;padding:8px 0;background:transparent;border:0;flex-direction:column;align-items:flex-start;gap:0}
 body.tecnohub .site-header nav.open{display:flex}
 body.tecnohub .site-header nav a,body.tecnohub .site-header nav a:last-child{height:44px}
}
@media(max-width:782px){body.tecnohub.admin-bar .site-header{top:46px}}

/* Scroll-revealed full-screen circular blend: dark centre, intermediate green, green edges. */
.page-template-page-cinematic .hero-atmosphere::after{content:"";position:absolute;inset:0;pointer-events:none;background:radial-gradient(circle farthest-corner at 50% 50%,var(--bg) 0%,var(--bg) 40%,#3C795C 70%,var(--accent) 100%);opacity:var(--safety-reveal,0);will-change:opacity}

/* Highlight the two key words in the safety statement. */
.safety-message .safety-keyword{color:var(--accent)}

/* Solutions section, matching the supplied light three-card reference. */
.mth-solutions{position:relative;background:var(--ink);color:var(--bg);padding:clamp(76px,9vw,130px) 0;min-height:100svh}
.mth-solutions h2{font:500 clamp(28px,3vw,46px)/1.18 var(--font-display);letter-spacing:-.035em;text-align:center;margin:0 auto 20px}
.mth-solutions .solutions-summary{max-width:1050px;margin:0 auto 64px;text-align:center;font-size:16px;line-height:1.65;color:var(--surface)}
.solutions-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:26px}
.solution-card{border:1px solid var(--muted);border-radius:6px;padding:36px 32px 44px;display:flex;flex-direction:column;background:var(--ink)}
.solution-card h3{margin:0 0 16px;line-height:0}
.solution-card img{display:block;width:100%;height:auto}
.solution-card p{font-size:16px;line-height:1.6;margin:0 0 24px;color:var(--surface)}
.solution-card .solution-services{font-size:12px;line-height:1.4;margin:0 0 40px}
.solution-card a{margin-top:auto;color:var(--surface);font-size:14px;text-decoration:underline;text-decoration-color:var(--accent);text-underline-offset:6px}
.solution-card a:hover{color:var(--bg);text-decoration-thickness:2px}
body.tecnohub.solutions-in-view .site-header nav a,body.tecnohub.solutions-in-view .site-header .menu-toggle{color:var(--bg)}
@media(max-width:760px){.solutions-grid{grid-template-columns:1fr}.mth-solutions .solutions-summary{margin-bottom:36px}.solution-card{padding:28px}.solution-card img{max-width:420px}.solution-card .solution-services{margin-bottom:28px}}

/* Dark solutions scene with a full-field water texture. */
.mth-solutions{background:var(--bg);color:var(--ink);isolation:isolate;overflow:hidden}
.mth-solutions>.wrap{position:relative;z-index:1}
.mth-solutions .solutions-summary,.mth-solutions .solution-card p{color:var(--muted)}
.mth-solutions .solution-card{background:color-mix(in srgb,var(--surface) 84%,transparent);border-color:color-mix(in srgb,var(--muted) 28%,transparent)}
.mth-solutions .solution-card a{color:var(--accent)}
.mth-solutions .solution-card a:hover{color:var(--ink)}
body.tecnohub.solutions-in-view .site-header nav a,body.tecnohub.solutions-in-view .site-header .menu-toggle{color:var(--ink)}
.water-droplets{position:absolute;inset:0;pointer-events:none;z-index:0;overflow:hidden}
.water-drop{position:absolute;left:var(--x);top:var(--y);width:var(--size);height:var(--size);border-radius:50%;border:1px solid color-mix(in srgb,var(--accent) 45%,transparent);box-shadow:inset 0 0 8px color-mix(in srgb,var(--ink) 10%,transparent),0 0 5px color-mix(in srgb,var(--accent) 10%,transparent);opacity:0;animation:mth-water-ripple var(--duration) var(--delay) infinite ease-out;animation-play-state:paused}
.water-drop::before{content:"";position:absolute;inset:18%;border:1px solid color-mix(in srgb,var(--ink) 26%,transparent);border-radius:50%}
.water-drop::after{content:"";position:absolute;left:50%;top:50%;width:6px;height:9px;border-radius:60% 40% 60% 40%;background:var(--ink);box-shadow:0 0 8px var(--accent);transform:translate(-50%,-50%);animation:mth-water-impact var(--duration) var(--delay) infinite ease-out;animation-play-state:paused}
.water-droplets.is-visible .water-drop,.water-droplets.is-visible .water-drop::after{animation-play-state:running}
.water-droplets.is-paused .water-drop,.water-droplets.is-paused .water-drop::after,.water-droplets.tab-hidden .water-drop,.water-droplets.tab-hidden .water-drop::after{animation-play-state:paused}
@keyframes mth-water-ripple{0%{opacity:0;transform:scale(.08)}8%{opacity:.55}65%{opacity:.12}90%,100%{opacity:0;transform:scale(1)}}
@keyframes mth-water-impact{0%{opacity:0}5%{opacity:.8}18%,100%{opacity:0}}
@media(prefers-reduced-motion:reduce){.water-drop{animation:none;opacity:.12;transform:scale(.7)}.water-drop::after{animation:none;opacity:0}}

/* Stronger water visibility across the dark solutions scene. */
.mth-solutions .water-drop{width:calc(var(--size)*2);height:calc(var(--size)*2);border:2px solid var(--accent);box-shadow:inset 0 0 12px #71e5ab26,0 0 12px #71e5ab26;animation-name:mth-water-visible;animation-play-state:running}
.mth-solutions .water-drop::before{border:1px solid var(--ink);inset:22%}
.mth-solutions .water-drop::after{width:10px;height:14px;box-shadow:0 0 16px var(--accent);animation-name:mth-water-visible-impact;animation-play-state:running}
.mth-solutions .water-droplets.is-paused .water-drop,.mth-solutions .water-droplets.is-paused .water-drop::after,.mth-solutions .water-droplets.tab-hidden .water-drop,.mth-solutions .water-droplets.tab-hidden .water-drop::after{animation-play-state:paused}
@keyframes mth-water-visible{0%{opacity:0;transform:translate(-50%,-50%) scale(.08)}10%{opacity:.8}45%{opacity:.45}85%{opacity:.12}100%{opacity:0;transform:translate(-50%,-50%) scale(1)}}
@keyframes mth-water-visible-impact{0%{opacity:0;transform:translate(-50%,-160%) scale(.7)}8%{opacity:1;transform:translate(-50%,-50%) scale(1)}25%,100%{opacity:0;transform:translate(-50%,-50%) scale(.4)}}
@media(prefers-reduced-motion:reduce){.mth-solutions .water-drop{animation:none!important;opacity:.28;transform:translate(-50%,-50%) scale(.65)}.mth-solutions .water-drop::after{animation:none!important;opacity:0}}

/* Moving green shadow and clearer cinematic surfaces. */
.safety-message>span{position:relative;isolation:isolate}
.safety-message>span::before{content:"";position:absolute;inset:-24px -5%;z-index:-1;pointer-events:none;background:linear-gradient(100deg,transparent 35%,#71e5ab66 49%,#71e5ab26 57%,transparent 70%);background-size:300% 100%;filter:blur(18px);animation:mth-safety-sweep 6s ease-in-out infinite}
@keyframes mth-safety-sweep{0%,100%{background-position:100% 50%}50%{background-position:0% 50%}}
.page-template-page-cinematic .hero-atmosphere::after{background:radial-gradient(circle farthest-corner at 50% 50%,var(--bg) 0%,var(--bg) 30%,#3C795C 58%,var(--accent) 100%)}
.mth-solutions .water-drop{border-width:2px;box-shadow:inset 0 0 20px #71e5ab40,0 0 18px #71e5ab40;animation-name:mth-water-prominent}
@keyframes mth-water-prominent{0%{opacity:0;transform:translate(-50%,-50%) scale(.08)}10%{opacity:1}45%{opacity:.65}85%{opacity:.25}100%{opacity:0;transform:translate(-50%,-50%) scale(1)}}
.mth-solutions .solution-card{position:relative;border:2px solid #71e5ab99;background:color-mix(in srgb,var(--surface) 72%,transparent)}
.mth-solutions .solution-card h3,.mth-solutions .solution-card p,.mth-solutions .solution-card a{width:100%;max-width:none;box-sizing:border-box}
.mth-solutions .solution-card h3 img{width:100%;max-width:none;height:auto;display:block}
.mth-solutions .solution-card::before,.mth-solutions .solution-card::after{content:"";position:absolute;width:30px;height:30px;pointer-events:none;border-color:var(--accent);border-style:solid;filter:drop-shadow(0 0 6px var(--accent));opacity:.3;animation:mth-corner-flash 6s ease-in-out infinite}
.mth-solutions .solution-card::before{left:-2px;top:-2px;border-width:3px 0 0 3px;border-top-left-radius:6px}
.mth-solutions .solution-card::after{right:-2px;bottom:-2px;border-width:0 3px 3px 0;border-bottom-right-radius:6px;animation-delay:3s}
.mth-solutions .solution-card:nth-child(2)::before{animation-delay:1s}.mth-solutions .solution-card:nth-child(2)::after{animation-delay:4s}
.mth-solutions .solution-card:nth-child(3)::before{animation-delay:2s}.mth-solutions .solution-card:nth-child(3)::after{animation-delay:5s}
@keyframes mth-corner-flash{0%,30%,100%{opacity:.3}12%{opacity:1;filter:drop-shadow(0 0 12px var(--accent))}}
body:has(#motion-toggle[aria-pressed="true"]) .safety-message>span::before,body:has(#motion-toggle[aria-pressed="true"]) .solution-card::before,body:has(#motion-toggle[aria-pressed="true"]) .solution-card::after{animation-play-state:paused}
@media(prefers-reduced-motion:reduce){.safety-message>span::before{animation:none;opacity:.3}.mth-solutions .solution-card::before,.mth-solutions .solution-card::after{animation:none;opacity:.6}}

/* Why Mech Man Techno Hub: five commitments on the hero background. */
.mth-why{background:var(--bg);color:var(--ink);padding:clamp(80px,9vw,140px) 0;overflow:hidden}
.mth-why .why-label{text-align:center;font-size:12px;letter-spacing:.12em;color:var(--accent);margin:0 0 28px}
.mth-why h2{margin:0 0 26px;text-align:center;font:500 clamp(30px,3.5vw,54px)/1.2 var(--font-display);letter-spacing:-.035em}
.mth-why h2>span{position:relative;display:inline-block;isolation:isolate}
.mth-why h2>span::before{content:"";position:absolute;inset:-24px -5%;z-index:-1;pointer-events:none;background:linear-gradient(100deg,transparent 35%,#71e5ab66 49%,#71e5ab26 57%,transparent 70%);background-size:300% 100%;filter:blur(18px);animation:mth-safety-sweep 6s ease-in-out infinite}
.mth-why .why-summary{max-width:1080px;margin:0 auto 72px;text-align:center;color:var(--accent);font-size:17px;line-height:1.7}
.mth-why .why-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr))}
.mth-why .why-item{padding:0 22px;display:flex;flex-direction:column;text-align:center;border-left:1px solid #71e5ab40}
.mth-why .why-item:first-child{border-left:0}
.mth-why .why-item h3{font-size:17px;line-height:1.4;font-weight:500;margin:0 0 16px;color:var(--ink)}
.mth-why .why-item p{font-size:15px;line-height:1.7;margin:0 0 32px;color:var(--muted)}
.mth-why .why-item .why-promise{color:var(--accent);font-size:13px;line-height:1.5;margin:auto 0 0;padding-top:16px}
body:has(#motion-toggle[aria-pressed="true"]) .mth-why h2>span::before{animation-play-state:paused}
@media(max-width:1050px){.mth-why .why-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:36px 0}.mth-why .why-item:nth-child(odd){border-left:0}.mth-why .why-item:last-child{grid-column:1/-1;max-width:520px;justify-self:center}.mth-why .why-summary{margin-bottom:48px}}
@media(max-width:600px){.mth-why .why-grid{grid-template-columns:1fr;gap:0}.mth-why .why-item,.mth-why .why-item:nth-child(odd){border-left:0;border-top:1px solid #71e5ab40;padding:28px 0;text-align:left}.mth-why .why-item:first-child{border-top:0}.mth-why .why-item:last-child{max-width:none;justify-self:stretch}.mth-why .why-item p{margin-bottom:12px}.mth-why .why-summary{font-size:16px}}
@media(prefers-reduced-motion:reduce){.mth-why h2>span::before{animation:none;opacity:.3}}

/* Scroll-driven process line. */
.mth-process{background:var(--bg);color:var(--ink);padding:100px 0 150px;min-height:100svh;--journey:0}
.mth-process .process-label{font-size:12px;letter-spacing:.12em;color:var(--accent);text-align:center;margin:0 0 24px}
.mth-process h2{font:500 clamp(30px,3.5vw,54px)/1.2 var(--font-display);letter-spacing:-.035em;text-align:center;margin:0 0 24px}
.mth-process .process-summary{max-width:1050px;margin:0 auto 90px;color:var(--muted);font-size:17px;line-height:1.7;text-align:center}
.process-track{position:relative;list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:32px}
.process-track::before,.process-track::after{content:"";position:absolute;left:22px;right:calc((100% - 128px)/5 - 22px);top:22px;height:2px;background:#71e5ab33}
.process-track::after{background:var(--accent);transform:scaleX(var(--journey));transform-origin:left;box-shadow:0 0 12px #71e5ab99}
.process-step{position:relative;z-index:1}
.process-node{display:flex;align-items:center;justify-content:center;width:46px;height:46px;border:1px solid var(--muted);border-radius:50%;background:var(--bg);color:var(--muted);font-size:13px;transition:color .3s,border-color .3s,box-shadow .3s,background .3s}
.process-step h3{font-size:20px;font-weight:500;margin:24px 0 14px;color:var(--ink)}
.process-step p{font-size:15px;line-height:1.75;color:var(--muted);margin:0}
.process-step.is-reached .process-node{border-color:var(--accent);color:var(--bg);background:var(--accent);box-shadow:0 0 20px #71e5ab66}
.process-step.is-current .process-node{animation:mth-process-beacon 2.8s ease-in-out infinite}
@keyframes mth-process-beacon{0%,100%{box-shadow:0 0 12px #71e5ab66}50%{box-shadow:0 0 30px #71e5ab99}}
body:has(#motion-toggle[aria-pressed="true"]) .process-node{animation-play-state:paused}
@media(max-width:800px){.mth-process{padding:80px 0 100px}.mth-process .process-summary{margin-bottom:52px}.process-track{display:flex;flex-direction:column;gap:0}.process-track::before,.process-track::after{left:22px;right:auto;top:22px;bottom:22px;height:auto;width:2px}.process-track::after{transform:scaleY(var(--journey));transform-origin:top}.process-step{padding:0 0 44px 76px;min-height:170px}.process-step:last-child{padding-bottom:0;min-height:0}.process-node{position:absolute;left:0;top:0}.process-step h3{margin:0 0 12px;padding-top:8px}.process-step p{max-width:550px}}
@media(prefers-reduced-motion:reduce){.mth-process{--journey:1!important}.process-node{animation:none!important;transition:none}.process-step .process-node{border-color:var(--accent);color:var(--accent)}}

@media(max-width:800px){.process-track::before,.process-track::after{bottom:auto;height:var(--line-height,calc(100% - 80px))}}

/* Leave enough scroll distance to illuminate the final milestone. */
.mth-process{padding-bottom:max(150px,50svh)}

/* Balanced four-line descriptions on desktop, natural wrapping on smaller screens. */
.mth-solutions .solution-card .balanced-description,.mth-why .why-item .balanced-description,.mth-process .process-step .balanced-description{text-align:justify;hyphens:none}
.copy-line{display:inline}
@media(min-width:1100px){
 .balanced-description .copy-line{display:block;white-space:nowrap;text-align:justify;text-align-last:justify}
 .balanced-description .copy-line:last-child{text-align-last:left}
 .mth-solutions .solution-card .balanced-description{font-size:clamp(11px,.88vw,15px);line-height:1.85}
 .mth-why .why-item .balanced-description,.mth-process .process-step .balanced-description{font-size:clamp(11px,.88vw,15px);line-height:1.85}
}

/* Natural justified paragraphs without forced four-line spacing. */
.mth-solutions .solution-card .balanced-description,.mth-why .why-item .balanced-description,.mth-process .process-step .balanced-description{font-size:15px;line-height:1.75;text-align:justify;text-align-last:left;white-space:normal;word-spacing:normal;letter-spacing:normal;hyphens:auto;overflow-wrap:break-word}
.balanced-description .copy-line{display:inline;white-space:normal;text-align:inherit;text-align-last:auto}

/* Places served and long-term support. */
.mth-sectors{background:var(--bg);color:var(--ink);padding:90px 0 120px}
.sectors-layout{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(40px,7vw,110px)}
.mth-sectors h2{font:500 clamp(30px,3vw,46px)/1.18 var(--font-display);letter-spacing:-.035em;margin:0 0 24px;max-width:570px}
.mth-sectors .sectors-summary{font-size:16px;line-height:1.75;color:var(--muted);margin:0 0 36px;text-align:justify}
.sectors-list{list-style:none;padding:0;margin:0}
.sector-row{position:relative;padding:28px 0;border-bottom:1px solid #71e5ab33}
.sector-row:last-child{border-bottom:0}
.sector-row::after{content:"";position:absolute;left:0;bottom:-1px;width:100%;height:1px;background:var(--accent);opacity:0;transform:scaleX(.05);transform-origin:left;transition:transform .85s ease,opacity .85s ease;box-shadow:0 0 9px #71e5ab66}
.sector-row.is-seen::after{opacity:.65;transform:scaleX(1)}
.sector-row:last-child::after{display:none}
.sector-row h3{display:flex;gap:14px;align-items:baseline;font-size:19px;line-height:1.4;font-weight:500;margin:0 0 12px}
.sector-marker{font-size:13px;color:var(--accent);flex-shrink:0}
.sector-row p{font-size:15px;line-height:1.75;color:var(--muted);margin:0;text-align:justify}
.mth-sectors .sectors-closing{border-left:2px solid var(--accent);padding:0 0 0 22px;margin:36px 0 0;color:var(--accent);font-size:16px;font-style:italic;line-height:1.8}
@media(max-width:800px){.sectors-layout{grid-template-columns:1fr;gap:64px}.mth-sectors{padding:70px 0 90px}.mth-sectors h2{max-width:none}.sector-row{padding:24px 0}}
@media(prefers-reduced-motion:reduce){.sector-row::after{transition:none;opacity:.5;transform:none}}

/* Client logos from the existing media library. */
.mth-clients{background:var(--bg);color:var(--ink);padding:90px 0 110px;overflow:hidden}
.clients-label{text-align:center;color:var(--accent);font-size:12px;letter-spacing:.12em;margin:0 0 24px}
.mth-clients h2{font:500 clamp(28px,3.2vw,48px)/1.2 var(--font-display);letter-spacing:-.035em;text-align:center;margin:0 0 22px}
.clients-summary{color:var(--muted);font-size:16px;line-height:1.7;text-align:center;margin:0 auto 52px;max-width:1000px}
.clients-window{overflow-x:auto;scrollbar-width:thin;padding:8px 0}
.clients-track{display:flex;width:max-content}
.clients-group{display:flex;gap:28px;list-style:none;padding:0 28px 0 0;margin:0;flex-shrink:0}
.client-logo{width:210px;height:122px;display:flex;align-items:center;justify-content:center;padding:16px;background:var(--ink);border-radius:6px}
.client-logo img{display:block;width:178px;height:90px;object-fit:contain;filter:grayscale(1);transition:filter .25s}
.client-logo:hover img{filter:none}
.mth-clients.is-enhanced .clients-window{overflow:hidden}
.mth-clients.is-enhanced .clients-track{animation:mth-logo-flow 60s linear infinite}
@keyframes mth-logo-flow{to{transform:translateX(-50%)}}
.mth-clients:has(.client-logo:hover) .clients-track,.mth-clients.is-paused .clients-track,body:has(#motion-toggle[aria-pressed="true"]) .clients-track{animation-play-state:paused}
.clients-pause{display:none;margin:26px auto 0;padding:8px 16px;background:transparent;color:var(--muted);border:1px solid #71e5ab66;border-radius:4px;font-size:13px;cursor:pointer}
.mth-clients.is-enhanced .clients-pause{display:block}
@media(max-width:720px){.mth-clients{padding:70px 0 90px}.client-logo{width:180px;height:110px}.client-logo img{width:148px;height:78px}.clients-group{gap:20px;padding-right:20px}}
@media(prefers-reduced-motion:reduce){.mth-clients.is-enhanced .clients-track{animation:none}.mth-clients .clients-window{overflow-x:auto}.clients-group[aria-hidden="true"]{display:none}.mth-clients.is-enhanced .clients-pause{display:none}}

/* Floating circular rings for client logos. */
.mth-clients .clients-window{padding:32px 12px}
.mth-clients .clients-group{gap:38px;padding-right:38px;align-items:center}
.mth-clients .client-logo{position:relative;flex:0 0 164px;width:164px;height:164px;padding:22px;border-radius:50%;border:2px solid var(--accent);background:var(--ink);box-shadow:0 0 18px #71e5ab26;animation:mth-logo-float 5s ease-in-out infinite}
.mth-clients .client-logo::before{content:"";position:absolute;inset:-9px;border:1px solid #71e5ab66;border-radius:50%;pointer-events:none}
.mth-clients .client-logo img{width:120px;height:86px;object-fit:contain;filter:none}
.mth-clients .client-logo:nth-child(3n+2){animation-delay:-1.7s}
.mth-clients .client-logo:nth-child(3n){animation-delay:-3.3s}
@keyframes mth-logo-float{0%,100%{transform:translateY(7px)}50%{transform:translateY(-7px)}}
.mth-clients .client-logo:hover,.mth-clients.is-paused .client-logo,body:has(#motion-toggle[aria-pressed="true"]) .client-logo{animation-play-state:paused}
@media(max-width:720px){.mth-clients .client-logo{flex-basis:132px;width:132px;height:132px;padding:18px}.mth-clients .client-logo img{width:94px;height:68px}.mth-clients .clients-group{gap:30px;padding-right:30px}}
@media(prefers-reduced-motion:reduce){.mth-clients .client-logo{animation:none;transform:none}}

/* Transparent client-logo holders: retain only the floating green rings. */
.mth-clients .client-logo{background:transparent}
.mth-clients .client-logo img{background:transparent}

/* Fine edge highlight for dark wordmarks on the transparent holders. */
.mth-clients .client-logo img[src*="client-transparent-1374"],.mth-clients .client-logo img[src*="client-transparent-1389"],.mth-clients .client-logo img[src*="client-transparent-1390"]{filter:drop-shadow(0 0 .7px #F4F8F5) drop-shadow(0 0 .7px #F4F8F5)}

/* Smaller off-white logo circles with circle-only hover pause. */
.mth-clients .client-logo{flex-basis:120px;width:120px;height:120px;padding:16px;background:var(--ink)}
.mth-clients .clients-track .client-logo img{width:88px;height:66px;filter:none}
.mth-clients .client-logo::before{inset:-7px}
.mth-clients .clients-group{gap:30px;padding-right:30px}
@media(max-width:720px){.mth-clients .client-logo{flex-basis:96px;width:96px;height:96px;padding:12px}.mth-clients .clients-track .client-logo img{width:70px;height:52px}.mth-clients .clients-group{gap:24px;padding-right:24px}}

/* Additional original Media Library logos on off-white circles. */
.mth-clients .client-logo{isolation:isolate}
.mth-clients .client-logo .media-original-logo{mix-blend-mode:multiply}
.mth-clients.is-enhanced .clients-track{animation-duration:85s}

/* Larger logos within the existing circle dimensions. */
.mth-clients .client-logo{box-sizing:border-box;padding:5px}
.mth-clients .clients-track .client-logo img{width:106px;height:82px;max-width:none;flex-shrink:0;object-fit:contain}
@media(max-width:720px){.mth-clients .client-logo{padding:4px}.mth-clients .clients-track .client-logo img{width:84px;height:66px}}

/* Leadership: portrait and statement. */
.mth-leadership{background:var(--bg);color:var(--ink);padding:90px 0 110px}
.leadership-layout{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:72px;align-items:center}
.leadership-portrait{margin:0;min-width:0}
.leadership-photo{height:410px;display:flex;align-items:flex-end;justify-content:center;position:relative;overflow:hidden}
.leadership-photo::before{content:"";position:absolute;inset:12% 8% 0;background:radial-gradient(ellipse at bottom,#71e5ab26,transparent 68%);pointer-events:none}
.leadership-photo img{position:relative;display:block;width:100%;height:100%;object-fit:contain;object-position:center bottom}
.leadership-portrait figcaption{border-top:1px solid var(--accent);padding-top:17px}
.leadership-name{display:block;font-size:15px;line-height:1.5;font-weight:500;letter-spacing:.035em}
.leadership-role{display:block;color:var(--accent);font-size:11px;line-height:1.8;letter-spacing:.05em}
.leadership-label{color:var(--accent);font-size:12px;letter-spacing:.12em;margin:0 0 24px}
.mth-leadership h2{font:500 clamp(30px,3.2vw,48px)/1.15 var(--font-display);letter-spacing:-.035em;margin:0 0 28px;max-width:520px}
.leadership-copy>p:not(.leadership-label){color:var(--muted);font-size:16px;line-height:1.85;text-align:justify;hyphens:auto;margin:0 0 20px}
.leadership-rule{height:1px;background:#71e5ab66;position:relative;overflow:hidden;margin-top:34px}
.leadership-rule::after{content:"";position:absolute;inset:0;width:35%;background:linear-gradient(90deg,transparent,var(--accent),transparent);animation:mth-leadership-line 6s ease-in-out infinite}
@keyframes mth-leadership-line{0%{transform:translateX(-110%)}100%{transform:translateX(390%)}}
body:has(#motion-toggle[aria-pressed="true"]) .leadership-rule::after{animation-play-state:paused}
@media(max-width:800px){.mth-leadership{padding:65px 0 80px}.leadership-layout{grid-template-columns:1fr;gap:48px}.leadership-portrait{max-width:450px;width:100%;margin:auto}.leadership-photo{height:360px}.mth-leadership h2{max-width:none}}
@media(prefers-reduced-motion:reduce){.leadership-rule::after{animation:none}}

/* Closing project invitation and company footer. */
.mth-project-cta{position:relative;isolation:isolate;overflow:hidden;text-align:center;padding:100px 0 110px;background:var(--bg);color:var(--ink)}
.mth-project-cta::before{content:"";position:absolute;z-index:-1;inset:-30%;background:radial-gradient(ellipse at 50% 90%,#71e5ab30,transparent 58%);animation:mth-cta-breathe 9s ease-in-out infinite alternate;pointer-events:none}
@keyframes mth-cta-breathe{from{transform:translateX(-8%);opacity:.55}to{transform:translateX(8%);opacity:1}}
.project-cta-label{font-size:12px;letter-spacing:.12em;color:var(--accent);margin:0 0 24px}
.mth-project-cta h2{font:500 clamp(34px,4.5vw,60px)/1.12 var(--font-display);letter-spacing:-.04em;margin:0 0 24px}
.project-cta-subtitle{font-size:clamp(18px,2vw,23px);line-height:1.5;color:var(--accent);margin:0 0 26px}
.project-cta-description{font-size:16px;line-height:1.8;max-width:680px;margin:0 auto 32px;color:var(--muted)}
a.mth-project-button{display:inline-flex;align-items:center;justify-content:center;gap:20px;min-height:48px;padding:13px 23px;background:var(--accent);color:var(--bg);border:1px solid var(--accent);border-radius:5px;font-size:14px;font-weight:600;text-decoration:none;transition:box-shadow .25s,transform .25s}
a.mth-project-button:hover{box-shadow:0 0 25px #71e5ab40;transform:translateY(-2px)}
.mth-main-footer{background:var(--surface);color:var(--muted);border-top:1px solid #71e5ab40;padding:60px 0 0}
.mth-footer-grid{display:grid;grid-template-columns:1.25fr .7fr 1fr 1.1fr;gap:40px;align-items:start}
.mth-main-footer h2{font-size:16px;font-weight:500;line-height:1.4;color:var(--ink);margin:0 0 19px}
.mth-main-footer p,.mth-main-footer address,.mth-main-footer li{font-size:13px;line-height:1.85}
.mth-footer-brand>img{display:block;width:112px;height:46px;object-fit:contain;object-position:left center;margin:0 0 18px}
.mth-footer-brand>p{margin:0 0 17px}
.mth-footer-brand .mth-footer-tagline{color:var(--accent)}
.mth-main-footer ul{list-style:none;margin:0;padding:0}
.mth-main-footer li{margin:0 0 7px}
.mth-main-footer a{color:inherit;text-decoration:none;overflow-wrap:anywhere}
.mth-main-footer a:hover{color:var(--accent)}
.mth-main-footer a:focus-visible,.mth-project-cta a:focus-visible{outline:2px solid var(--accent);outline-offset:5px}
.mth-main-footer address{font-style:normal}
.mth-main-footer address p{margin:15px 0 22px}
.mth-main-footer .mth-project-button{color:var(--bg);font-size:12px;min-height:42px;padding:10px 16px}
.mth-footer-map{height:170px;border:1px solid #71e5ab40;border-radius:5px;overflow:hidden;background:var(--bg)}
.mth-footer-map iframe{display:block;width:100%;height:100%;border:0}
.mth-map-link{display:inline-block;font-size:12px;margin-top:12px}
.mth-footer-bottom{display:flex;justify-content:space-between;gap:24px;align-items:center;border-top:1px solid #71e5ab26;padding:22px 0;margin-top:48px}
.mth-footer-bottom p,.mth-footer-bottom a{margin:0;font-size:12px}
body:has(#motion-toggle[aria-pressed="true"]) .mth-project-cta::before{animation-play-state:paused}
@media(max-width:1000px){.mth-footer-grid{grid-template-columns:1fr 1fr;gap:40px}}
@media(max-width:600px){.mth-project-cta{padding:75px 0 80px}.mth-footer-grid{grid-template-columns:1fr;gap:32px}.mth-footer-map{height:200px}.mth-footer-bottom{align-items:flex-start;flex-direction:column;gap:12px}.mth-main-footer{padding-top:45px}}
@media(prefers-reduced-motion:reduce){.mth-project-cta::before{animation:none}.mth-project-button{transition:none}}

/* Compact footer logo and independent footer navigation. */
.mth-main-footer .mth-footer-brand>img{width:56px;height:23px;margin-bottom:18px}
.mth-main-footer nav{display:block;position:static;inset:auto;width:auto;height:auto;min-width:0;padding:0;margin:0;background:transparent;border:0;border-radius:0}
.mth-main-footer nav h2{margin:0 0 19px;text-align:left}
.mth-main-footer nav ul{display:block;margin:0;padding:0;list-style:none}
.mth-main-footer nav li{display:block;margin:0 0 7px;padding:0}
.mth-main-footer nav a,.mth-main-footer nav a:last-child{display:inline-block;height:auto;padding:0;margin:0;border:0;border-radius:0;background:transparent;box-shadow:none;font-size:13px;line-height:1.85;white-space:normal;overflow-wrap:normal}

/* Requested footer background colours. */
.mth-main-footer{background:#4c4c4c;color:var(--ink);overflow:hidden}
.mth-main-footer .mth-footer-bottom{background:#7f7f7f;color:var(--bg);border-top:0;box-shadow:0 0 0 100vmax #7f7f7f;clip-path:inset(0 -100vmax)}
.mth-main-footer .mth-footer-bottom a:hover{color:var(--bg);text-decoration:underline}

/* Evenly distributed footer columns. */
.mth-footer-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:40px}
.mth-footer-grid>*{min-width:0}
@media(max-width:1000px){.mth-footer-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:600px){.mth-footer-grid{grid-template-columns:minmax(0,1fr);gap:32px}}

/* Centre the footer within equal outer margins, matching the reference. */
.mth-main-footer>.wrap{box-sizing:border-box;width:85%;max-width:1140px;margin-left:auto;margin-right:auto;padding-left:0;padding-right:0}
.mth-main-footer .mth-footer-grid{width:100%;grid-template-columns:repeat(4,minmax(0,1fr));column-gap:clamp(24px,3vw,40px)}
@media(max-width:1000px){.mth-main-footer>.wrap{width:calc(100% - 64px)}.mth-main-footer .mth-footer-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:600px){.mth-main-footer>.wrap{width:calc(100% - 40px)}.mth-main-footer .mth-footer-grid{grid-template-columns:minmax(0,1fr)}}

/* Centred copyright without the secondary project link. */
.mth-main-footer .mth-footer-bottom{justify-content:center;align-items:center;text-align:center}
.mth-main-footer .mth-footer-bottom p{width:100%;text-align:center}

/* Align both leadership dividers on the same shared grid boundary. */
@media(min-width:801px){
.mth-leadership .leadership-layout{grid-template-rows:minmax(410px,auto) auto;row-gap:0;align-items:stretch}
.mth-leadership .leadership-portrait{grid-column:1;grid-row:1 / span 2;display:grid;grid-template-rows:subgrid}
.mth-leadership .leadership-photo{grid-row:1;align-self:end}
.mth-leadership .leadership-portrait figcaption{grid-row:2}
.mth-leadership .leadership-copy{grid-column:2;grid-row:1;position:relative;display:flex;flex-direction:column;justify-content:center;box-sizing:border-box;padding-bottom:34px}
.mth-leadership .leadership-rule{position:absolute;left:0;right:0;bottom:-1px;height:1px;margin:0}
}

/* Header background matches the hero base. */
body.tecnohub .site-header{background:var(--bg)}
body.tecnohub .site-header nav{background:var(--bg)}
@media(max-width:760px){body.tecnohub .site-header nav{padding:8px 16px}}

/* Reduce the gap between the process and places-served sections. */
.mth-process{min-height:0;padding-bottom:48px}
.mth-sectors{padding-top:48px}
@media(max-width:800px){.mth-process{padding-bottom:32px}.mth-sectors{padding-top:32px}}

/* Audit: keep linked section headings below the sticky header. */
#solutions-title,#process-title,#leadership-title,#mth-footer-contact,#project-cta-title{scroll-margin-top:80px}
body.admin-bar #solutions-title,body.admin-bar #process-title,body.admin-bar #leadership-title,body.admin-bar #mth-footer-contact{scroll-margin-top:112px}

/* Add breathing room above the logo and menu. */
body.tecnohub .site-header{box-sizing:border-box;padding-top:10px;height:58px;margin-bottom:-58px}
@media(max-width:900px){body.tecnohub .site-header nav{top:58px}}

/* Concise single-line promises with consistent sizing. */
.mth-why .why-item .why-promise{white-space:nowrap;font-size:13px;letter-spacing:normal}
@media(min-width:1051px) and (max-width:1250px){.mth-why .why-item{padding-inline:12px}.mth-why .why-item .why-promise{font-size:clamp(11px,1vw,12.5px)}}

/* Fade ripples into the shared background instead of clipping at section edges. */
.mth-solutions{background:var(--bg);border-top:0;border-bottom:0;box-shadow:none}
.mth-solutions .water-droplets{--water-edge-fade:clamp(80px,12vw,150px);-webkit-mask-image:linear-gradient(to bottom,transparent 0%,#000 var(--water-edge-fade),#000 calc(100% - var(--water-edge-fade)),transparent 100%);mask-image:linear-gradient(to bottom,transparent 0%,#000 var(--water-edge-fade),#000 calc(100% - var(--water-edge-fade)),transparent 100%)}
