/* TECH MEDIA CORPORATION V5.7
   Refined responsive composition and genuine alpha-only logo in opening scene.
   Preserves V4 visuals and V5 interactive content; treats each navigation landing
   as a considered editorial frame, never as a clipped middle of the page. */
:root{--tmc-space:clamp(14px,2svh,25px);--tmc-stage:calc(100svh - var(--tmc-nav-h,88px));--tmc-grid-gap:clamp(14px,1.2vw,20px)}
/* Transparent white logo only; retain blue original in regular site header. */
.intro-logo-stage,
.intro-logo-stage img,
.intro-logo-stage img.intro-logo-white{
 background:none!important;background-color:transparent!important;
 box-shadow:none!important;border:0!important;border-radius:0!important;
 outline:0!important;padding:0!important;
}
.intro-logo-stage img.intro-logo-white{
 display:block;width:min(76vw,810px)!important;max-height:min(26svh,200px)!important;
 height:auto!important;object-fit:contain;filter:none!important;
}
.intro-logo-stage>span{margin-top:clamp(18px,2.6svh,27px)!important}
@media(max-width:700px){.intro-logo-stage img.intro-logo-white{width:min(88vw,600px)!important;max-height:170px!important}}
/* Unified horizontal rhythm and stage landing behavior. */
#about,#expertise,#approach,#performance,#experience,#divisions,#network,#contact{scroll-margin-top:var(--tmc-nav-h,88px)}
.section-shell{box-sizing:border-box}
.section-meta{gap:16px;align-items:center}
.display-heading,.capability h3,.experience-copy h3,.division-foot h3{text-wrap:balance}
/* All sections keep native vertical scrolling for content that genuinely exceeds a viewport. */
@media(min-width:1100px){
 .about,.expertise,.performance,.experience,.divisions,.network,.contact{
   box-sizing:border-box;min-height:var(--tmc-stage);
   padding-top:clamp(17px,2.5svh,28px)!important;
   padding-bottom:clamp(22px,3svh,35px)!important;
 }
 .about,.expertise,.performance,.experience,.divisions{display:flex;flex-direction:column}
 .section-meta{flex:0 0 auto;min-height:29px!important;padding-bottom:clamp(9px,1.2svh,13px)!important}
 /* About: fixed visual balance, no orphaned next-section header at the bottom. */
 .about-layout{flex:1 1 auto;min-height:0!important;width:100%;
   display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);
   column-gap:clamp(48px,5vw,86px)!important;align-items:center!important;
   padding-top:clamp(24px,4svh,40px)!important;padding-bottom:clamp(16px,2svh,24px)}
 .about-layout .display-heading{font-size:clamp(65px,min(5.65vw,9.3svh),94px)!important;line-height:.94!important;letter-spacing:-.027em}
 .about-art{display:block;width:clamp(160px,17vw,245px)!important;max-height:clamp(140px,26svh,230px)!important;
   margin:clamp(12px,1.8svh,22px) auto 0!important}
 .about-right{padding:0!important;max-width:590px}
 .about .statement{font-size:clamp(25px,min(2.28vw,3.3svh),34px)!important;line-height:1.19!important;margin:0 0 clamp(12px,1.6svh,18px)!important}
 .about .body-copy{font-size:clamp(13px,.93vw,15px)!important;line-height:1.58!important;margin-bottom:clamp(10px,1.4svh,16px)!important}
 .about .oversized-quote{font-size:clamp(38px,5.7svh,59px)!important;margin:0 0 2px!important}
 /* Expertise: six services in a controlled 3x2 grid, each with legible copy. */
 .expertise-intro{flex:0 0 auto;padding-top:clamp(15px,2.3svh,27px)!important;
   margin-bottom:clamp(13px,1.8svh,20px)!important;gap:clamp(24px,3vw,45px)}
 .expertise-intro .display-heading{font-size:clamp(54px,min(5.2vw,7.4svh),84px)!important;line-height:.89!important}
 .expertise-intro .body-copy{font-size:clamp(12px,.88vw,14px)!important;line-height:1.55!important;max-width:390px}
 .capabilities{grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:var(--tmc-grid-gap)!important;align-items:stretch}
 .capability{min-height:0!important;height:clamp(224px,calc((var(--tmc-stage) - 206px)/2),305px)!important;
   padding:clamp(13px,1.25vw,21px)!important;display:flex;flex-direction:column}
 .capability img{height:clamp(68px,8.7svh,97px)!important;margin:clamp(2px,.6svh,6px) auto clamp(5px,1svh,10px)!important;object-fit:contain}
 .capability h3{font-size:clamp(25px,min(2.2vw,3.7svh),34px)!important;line-height:1.03!important;margin:0 0 8px!important}
 .capability p{font-size:clamp(11px,.85vw,13px)!important;line-height:1.46!important;margin:0 0 10px!important}
 .capability .cap-tag{margin-top:auto!important;font-size:9px}
 /* Experience: full case image + copy visible across all three cards. */
 .experience-header{flex:0 0 auto;margin:clamp(18px,2.5svh,29px) 0 clamp(17px,2.3svh,26px)!important;align-items:end!important}
 .experience-header .display-heading{font-size:clamp(58px,min(5.7vw,8.5svh),89px)!important;line-height:.91!important}
 .experience-header .body-copy{font-size:clamp(12px,.9vw,14px)!important;line-height:1.52!important}
 .experience-grid{grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:var(--tmc-grid-gap)!important;align-items:stretch}
 .experience-grid .experience-card{display:flex!important;flex-direction:column!important;min-height:0!important;
   height:clamp(404px,calc(var(--tmc-stage) - 205px),510px)!important;overflow:hidden}
 .experience-grid .experience-card .experience-art{height:clamp(145px,19svh,191px)!important;min-height:0!important;flex:0 0 auto}
 .experience-grid .experience-card .experience-art img{padding:clamp(12px,1.4vw,23px)}
 .experience-grid .experience-card .experience-copy{flex:1;min-height:0!important;height:auto!important;
   display:flex;flex-direction:column;padding:clamp(16px,1.55vw,25px)!important;overflow:visible}
 .experience-grid .experience-card .experience-copy h3{
   font-size:clamp(27px,min(2.48vw,4.6svh),38px)!important;line-height:1.02!important;
   margin:clamp(9px,1.3svh,13px) 0 clamp(8px,1svh,11px)!important}
 .experience-grid .experience-card .experience-copy p{font-size:clamp(11px,.88vw,13px)!important;line-height:1.47!important;margin:0 0 10px!important}
 .experience-grid .experience-card .experience-link{margin-top:auto;font-size:9px;padding-top:12px}
 .experience-cta{flex:0 0 auto;margin-top:clamp(16px,2.8svh,28px)!important}
 /* Ecosystem: two specialist brand cards fully visible with complete headline. */
 .divisions>.display-heading{flex:0 0 auto;font-size:clamp(60px,min(5.4vw,8.6svh),87px)!important;
   line-height:.89!important;padding:clamp(16px,2.4svh,26px) 0 clamp(16px,2.2svh,24px)!important;margin:0}
 .divisions-grid{flex:1;min-height:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--tmc-grid-gap)!important;align-items:stretch}
 .division{min-height:0!important;height:auto!important;max-height:520px!important;
   padding:clamp(20px,1.75vw,28px)!important}
 .division-logo-stage{top:14%!important;height:35%!important;left:6%!important;right:6%!important}
 .division-foot h3{font-size:clamp(34px,min(3vw,5svh),47px)!important;line-height:.95!important}
 .division-foot>p:last-child{font-size:clamp(11px,.9vw,13px)!important;line-height:1.5!important;margin:8px 0!important}
 .division-action{font-size:9px!important;margin-top:8px!important}
 /* Performance + network: one clean section frame and calm whitespace. */
 .performance-intro{margin:clamp(19px,2.9svh,33px) 0 clamp(21px,3svh,34px)!important}
 .performance-intro .display-heading{font-size:clamp(60px,min(6vw,9svh),95px)!important}
 .metric-grid{margin-top:clamp(12px,2svh,24px)}
 .metric-card{min-height:clamp(205px,28svh,265px)!important}
 .network-grid{padding-top:clamp(18px,3svh,32px)!important;gap:clamp(40px,4.5vw,70px)!important;
   grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr)!important}
 .network .display-heading{font-size:clamp(72px,min(6.2vw,9svh),104px)!important}
 .network-visual{min-height:0!important;height:clamp(260px,43svh,400px)!important}
 .network-pills{margin-top:clamp(15px,2svh,22px)!important}
 .contact{min-height:var(--tmc-stage)}
}
@media(min-width:701px) and (max-width:1099px){
 .about,.expertise,.experience,.divisions,.performance{padding-top:18px!important;padding-bottom:35px!important}
 .about{min-height:var(--tmc-stage)}
 .about-layout{padding-top:24px!important;gap:25px!important;min-height:0!important;align-items:center!important}
 .about-layout .display-heading{font-size:clamp(54px,6.3vw,79px)!important}
 .about-art{width:clamp(125px,16vw,210px)!important;margin:20px auto 0!important}
 .experience-header,.performance-intro{margin:22px 0!important}
 .experience-header .display-heading{font-size:clamp(54px,6.2vw,79px)!important}
 .experience-grid .experience-card{min-height:0!important;display:flex!important;flex-direction:column!important;height:auto!important}
 .experience-grid .experience-card .experience-art{height:175px!important;min-height:0!important}
 .experience-grid .experience-card .experience-copy{min-height:270px!important;height:auto!important}
 .experience-grid .experience-feature{grid-column:auto!important;grid-template-columns:none!important}
 .divisions>.display-heading{font-size:clamp(56px,6.7vw,82px)!important;padding:23px 0 20px!important}
 .divisions-grid{gap:15px!important}
 .division{height:clamp(390px,53svh,460px)!important;padding:22px!important}
 .division-logo-stage{top:13%!important;height:31%!important}
 .division-foot h3{font-size:clamp(31px,3.6vw,42px)!important}
}
@media(max-width:700px){
 .section-meta{line-height:1.4}
 .about,.expertise,.experience,.divisions,.performance{padding-bottom:clamp(32px,5svh,52px)!important}
 .about .display-heading,.expertise .display-heading,.experience .display-heading,.divisions .display-heading{line-height:.92!important}
 .about-art{margin:13px auto 0!important}
 .experience-grid .experience-card{height:auto!important}
 .experience-grid .experience-card .experience-copy{height:auto!important;min-height:0!important;padding:20px!important}
 .division{height:clamp(385px,59svh,470px)!important;max-height:none!important}
 .divisions>.display-heading{padding:clamp(20px,3svh,28px) 0 22px!important}
 .network-visual{min-height:0!important}
}
@media(prefers-reduced-motion:reduce){.division,.capability,.experience-card{transition:none!important}}
/* Fit the complete 3×2 capability grid and three case-study cards
   below the fixed header at standard desktop heights. */
@media(min-width:1100px){
 .capability{height:clamp(217px,calc((var(--tmc-stage) - 256px)/2),282px)!important}
 .experience-grid .experience-card{height:clamp(390px,calc(var(--tmc-stage) - 290px),475px)!important}
 .experience-header{margin:clamp(14px,1.8svh,20px) 0 clamp(14px,1.8svh,20px)!important}
 .experience-cta{margin-top:clamp(11px,1.7svh,18px)!important}
}