/*
Theme Name: TMD 2026
Version: 1.0.0
Description: Responsive custom homepage based on the TMD Figma design.
Requires PHP: 7.4
Text Domain: tmd-2026
*/
:root{--blue:#003AE1;--green:#00c9a7;--ink:#0A1628;--scale: min(1px, calc(100vw / 1728));}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:30px}body{margin:0;color:var(--ink);font-family:Satoshi,Arial,sans-serif}h1,h2,h3,h4,p{margin:0}a{color:inherit;text-decoration:none}button{font:inherit;cursor:pointer}img{vertical-align:middle}button:focus-visible,a:focus-visible{outline:3px solid #00c9a7;outline-offset:6px}.wrap{width:calc(100% - 19.1%);max-width:1414px;margin:auto}.skip{position:fixed;top:-100px;z-index:99;background:white;padding:15px}.skip:focus{top:0}.hero{height:calc(1620 * var(--scale));min-height:970px;position:relative;overflow:hidden;color:#fff;background:linear-gradient(180deg,#0a1628 0%,#003ae1 50%,#5b6eff 100%)}.hero-grid{position:absolute;left:50%;top:0;transform:translateX(-50%) scale(calc(100vw / 1728px));transform-origin:top center;width:1415px;height:1620px;opacity:1}.nav{position:relative;top:37px;border-radius:100px;background:#ffffff1a;height:74px;display:flex;align-items:center;justify-content:space-between;padding:10px 18px 10px 24px;z-index:5}.logo{display:flex;align-items:center;gap:3px}.nav-links{display:flex;gap:59px;font-size:16px;font-weight:900;text-transform:uppercase}.pill{display:inline-flex;align-items:center;justify-content:center;border-radius:45px;background:#fff;color:#0a1628;height:61px;padding:0 48px;font-weight:900;font-size:16px;text-transform:uppercase;white-space:nowrap}.nav-cta{height:54px;padding:0 24px}.menu-toggle{display:none}.hero-copy{position:relative;z-index:2;text-align:center;padding-top:109px;max-width:850px;margin:auto}.trust{display:flex;align-items:center;justify-content:center;gap:26px;color:#8f9cff;font:14px 'Plus Jakarta Sans',sans-serif}.avatars{display:flex;padding-left:18px}.avatars img{margin-left:-18px}.eyebrow{margin-top:58px;color:#8f9cff;font:14px 'Plus Jakarta Sans',sans-serif}.hero h1{font-size:clamp(64px,5.79vw,100px);line-height:.93;font-weight:700;margin-top:34px;letter-spacing:-2px}.intro{font:22px/1.4 'Plus Jakarta Sans',sans-serif;max-width:804px;margin:43px auto 0}.discover{margin-top:40px;min-width:230px}.portfolio-tiles{position:absolute;inset:0;pointer-events:none}.tile-column{position:absolute;width:15.6%;top:31.9%;display:grid;gap:calc(13 * var(--scale))}.tile-column div{background:var(--blue);border-radius:10px;aspect-ratio:269.493/301.449}.tile-0{left:1.33%}.tile-1{left:17.65%;top:42.23%}.tile-2{left:34%;top:52.56%}.tile-3{left:50.44%;top:52.56%}.tile-4{left:66.75%;top:42.23%}.tile-5{left:83.13%}.label{display:flex;align-items:center;gap:10px;font-weight:700;font-size:24px;line-height:1}.centered{justify-content:center}.clients{padding-top:96px;overflow:hidden}.logo-row{display:flex;justify-content:center;gap:89px;width:max-content;position:relative;left:50%;transform:translateX(-50%);margin-top:64px}.logo-row div{width:220px;height:111px;border:1px solid #dfdfdf;border-radius:10px;display:grid;place-items:center;font-size:12px;font-weight:700;color:#e3e3e3}.logo-row.staggered{margin-top:52px}.about{padding-top:117px;padding-bottom:190px}.about-grid{display:grid;grid-template-columns:1fr 1.13fr;gap:80px;margin-top:107px}.roles{font-size:clamp(50px,5.21vw,90px);line-height:1.155;color:var(--green);font-weight:700;letter-spacing:-2px}.statement{font-size:clamp(25px,2.2vw,38px);line-height:1.36;font-weight:700}.statement span{color:#d3d3d3}.audiences{background:#f8f9fb;position:relative;overflow:hidden;padding:136px 0 192px}.audience-decoration{position:absolute;top:-160px;left:50%;transform:translateX(-50%);pointer-events:none}.audiences .wrap{position:relative}.section-title{font-size:clamp(52px,5.21vw,90px);font-weight:700;line-height:1.045;letter-spacing:-2px;text-align:center;max-width:859px;margin:38px auto 0}.audience-cards{display:grid;grid-template-columns:repeat(4,1fr);gap:45px;margin-top:29px}.audience-cards article{background:#003ae1;border-radius:10px;min-height:395px;display:flex;flex-direction:column;justify-content:flex-end;padding:34px}.audience-cards article:nth-child(2),.audience-cards article:nth-child(3){transform:translateY(123px)}.audience-cards h4{color:white;font-size:30px;line-height:1.04;max-width:230px;margin-bottom:22px}.audience-cards p{color:#a4bbff;font:500 14px/18px 'Plus Jakarta Sans',sans-serif}.services{padding-top:124px}.disciplines{display:flex;align-items:center;gap:27px;margin-top:94px;height:620px}.discipline{border:1px solid #d5dae2;background:#f8f9fb;border-radius:10px;flex:1;min-width:0;height:513px;padding:32px;display:flex;flex-direction:column;justify-content:flex-end;transition:flex .3s,height .3s,background .3s}.discipline.active{flex:1.6;height:620px;background:var(--blue);border-color:var(--blue);color:white}.discipline button{border:0;background:none;padding:0;text-align:left;font-size:clamp(24px,2.32vw,40px);font-weight:700;white-space:nowrap;color:inherit}.tags{display:none;flex-wrap:wrap;gap:12px;margin-top:22px}.active .tags{display:flex}.tags span{border:1px solid #fff;border-radius:100px;font-size:22px;padding:13px 25px}.results{background:var(--green);border-radius:10px;min-height:509px;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;margin-top:96px;color:white;padding:70px}.results h3{font-size:24px;font-weight:700;margin-bottom:44px}.results p{max-width:840px;font:700 36px/1.35 'Plus Jakarta Sans',sans-serif}.people{padding-top:123px;overflow:hidden}.people .section-title{max-width:none;margin-top:0}.team-rows{margin-top:62px;display:grid;gap:36px}.team-rows>div{display:flex;justify-content:center}.collaborators{padding-top:145px;padding-bottom:88px}.collaborator-grid{display:grid;grid-template-columns:750fr 508fr;gap:156px;margin-top:75px}.collaborator-grid blockquote{font-size:28px;line-height:41px;font-weight:700;margin:0}.founder{display:flex;align-items:center;gap:29px;margin-top:40px}.founder p{font-size:16px;font-weight:700;margin-top:15px}.signature{object-fit:cover}.blue{background:var(--blue);color:white;margin-top:64px}.generic{padding:100px 0}
@media(min-width:1728px){.hero-grid{transform:translateX(-50%)}.hero{height:1620px}}
@media(max-width:1300px){.hero{min-height:1100px}.hero-copy{padding-top:109px;max-width:650px}.intro{font-size:18px;max-width:610px}.tile-column{top:48%}.tile-1,.tile-4{top:60%}.tile-2,.tile-3{top:72%}.nav-links{gap:30px}.audience-cards{gap:24px}.audience-cards article{padding:24px;min-height:345px}.audience-cards h4{font-size:25px}.about-grid{gap:50px}.discipline{padding:22px}.tags span{font-size:16px;padding:12px 16px}.disciplines{gap:18px}.collaborator-grid{gap:80px}.collaborator-grid blockquote{font-size:24px;line-height:1.4}.team-rows>div{transform:scale(.75);height:86px}.team-rows{gap:28px}}
@media(max-width:800px){.wrap{width:calc(100% - 40px)}.hero{height:auto;min-height:1050px}.nav{top:20px;height:68px;padding:12px 18px}.nav-cta{font-size:11px;height:42px;padding:0 17px}.logo{transform:scale(.8);transform-origin:left center;width:90px}.menu-toggle{display:block;border:0;color:white;background:none;font-weight:700;font-size:13px}.nav-links{display:none;position:absolute;top:80px;left:0;right:0;background:#0a1628;padding:26px;border-radius:20px;flex-direction:column;font-size:15px}.nav-links.open{display:flex}.hero-copy{padding:88px 22px 0}.trust{gap:15px;font-size:11px}.avatars{transform:scale(.75);margin-right:-30px;margin-left:-24px}.eyebrow{font-size:11px;margin-top:44px}.hero h1{font-size:clamp(44px,8.8vw,70px);letter-spacing:-1px;line-height:1.02;margin-top:26px}.intro{font-size:16px;line-height:1.6;max-width:550px;margin-top:28px}.discover{margin-top:28px;height:54px;font-size:14px}.portfolio-tiles{top:610px;height:430px}.tile-column{top:0;width:29%;gap:12px}.tile-0{left:-15%}.tile-1{left:16%;top:45px}.tile-2{left:47%;top:90px}.tile-3{left:78%;top:45px}.tile-4,.tile-5{display:none}.hero-grid{opacity:.4}.clients{padding-top:64px}.label{font-size:20px}.logo-row{gap:25px;margin-top:42px}.logo-row div{width:150px;height:80px}.logo-row.staggered{margin-top:25px}.about{padding-top:75px;padding-bottom:85px}.about-grid{grid-template-columns:1fr;gap:42px;margin-top:50px}.roles{font-size:56px;letter-spacing:-1px}.statement{font-size:27px;line-height:1.4}.audiences{padding:75px 0}.section-title{font-size:48px;letter-spacing:-1px;margin-top:28px}.audience-cards{grid-template-columns:1fr 1fr;gap:20px;margin-top:50px}.audience-cards article{min-height:310px;padding:22px}.audience-cards article:nth-child(2),.audience-cards article:nth-child(3){transform:none}.audience-cards h4{font-size:25px}.services{padding-top:75px}.disciplines{margin-top:48px;height:auto;flex-direction:column;align-items:stretch;gap:15px}.discipline,.discipline.active{flex:auto;min-height:100px;height:auto;padding:28px}.discipline.active{min-height:340px;justify-content:flex-end}.discipline button{font-size:32px}.tags span{font-size:18px}.results{margin-top:60px;padding:45px 25px;min-height:400px}.results h3{font-size:20px;line-height:1.3;margin-bottom:28px}.results p{font-size:26px}.people{padding-top:75px}.people .section-title{padding:0 20px}.team-rows{margin-top:42px;gap:16px}.team-rows>div{transform:scale(.4);height:46px}.collaborators{padding-top:75px;padding-bottom:60px}.collaborator-grid{grid-template-columns:1fr;gap:48px;margin-top:45px}.collaborator-grid blockquote{font-size:25px}.founder{gap:22px}.blue{margin-top:45px;height:54px;font-size:14px}}
@media(max-width:450px){.hero{min-height:1000px}.hero-copy{padding-top:70px}.portfolio-tiles{top:630px}.section-title{font-size:40px}.audience-cards{grid-template-columns:1fr}.audience-cards article{min-height:300px}.audience-cards h4{max-width:250px;font-size:30px}.roles{font-size:50px}.statement{font-size:24px}.nav-cta{padding:0 12px}.founder>img{transform:scale(.8);margin-left:-10px;margin-right:-10px}.signature{max-width:180px;height:auto}.discipline button{font-size:29px}}
@media(max-width:0px){html{scroll-behavior:auto}.discipline{transition:none}}
/* Preview layout refinements */
.team-rows>div{width:100%;transform-origin:center center}.team-rows img{flex-shrink:0}
@media(min-width:801px) and (max-width:1300px){.hero{min-height:1350px}.tile-column{top:42%}.tile-1,.tile-4{top:53%}.tile-2,.tile-3{top:64%}}
@media(max-width:800px){.team-rows>div{height:46px;transform:scale(.4)}}

.team-rows{grid-template-columns:minmax(0,1fr)}.team-rows>div{min-width:0;align-items:center}

/* Frosted navigation */
.nav{background:linear-gradient(-65deg,rgba(228,212,233,.4),rgba(255,255,255,.4));-webkit-backdrop-filter:blur(15px);backdrop-filter:blur(15px)}

/* Reference-style service accordion: equal height, horizontal expansion. */
@media(min-width:801px){
  .disciplines{height:513px;align-items:stretch}
  .discipline,.discipline.active{height:100%;flex:1 1 0;overflow:hidden;transition:flex-grow .55s cubic-bezier(.22,1,.36,1),background-color .45s ease,border-color .45s ease,color .45s ease}
  .discipline.active{flex-grow:1.35}
  .discipline button{white-space:normal;line-height:1.1;min-height:2.2em;display:flex;align-items:flex-end;order:2}
  .discipline .tags{display:flex;order:1;margin:0 0 32px;gap:10px}
  .discipline .tags span{font-size:16px;line-height:1.25;padding:10px 14px;border-color:currentColor;transition:border-color .45s ease}
}
@media(max-width:0px){.discipline,.discipline.active,.discipline .tags span{transition:none}}

/* Text enters upward through individual line masks, inspired by NOHO. */
.tmd-reveal-pending{visibility:hidden}
.tmd-line-mask{display:block;overflow:clip;padding-block:.15em;margin-block:-.15em}
.tmd-line-text{display:block;transform:translateY(115%);opacity:0;transition:transform .95s cubic-bezier(.16,1,.3,1),opacity .55s ease;transition-delay:var(--tmd-line-delay,0ms)}
.tmd-in-view .tmd-line-text{transform:translateY(0);opacity:1}
.tmd-block-reveal{opacity:0;transform:translateY(16px);transition:opacity .7s ease,transform .8s cubic-bezier(.16,1,.3,1)}
.tmd-block-reveal.tmd-in-view{opacity:1;transform:translateY(0)}
.hero .intro .tmd-line-text{transition-delay:calc(180ms + var(--tmd-line-delay,0ms))}
.hero .discover{transition-delay:0ms}
.audience-cards article:nth-child(2) .tmd-block-reveal{transition-delay:80ms}
.audience-cards article:nth-child(3) .tmd-block-reveal{transition-delay:160ms}
.audience-cards article:nth-child(4) .tmd-block-reveal{transition-delay:240ms}

.statement>.tmd-line-mask,.statement>.tmd-line-mask>.tmd-line-text{color:inherit}
.tmd-line-reveal{display:grid;grid-template-columns:minmax(0,1fr)}
.tmd-line-text{white-space:nowrap}

/* Hypen's 400ms ease; expanded size and pill reveal follow the TMD reference. */
.disciplines{--service-gap:27px;--service-pad:32px;gap:var(--service-gap);height:620px;align-items:center}
.disciplines .discipline{position:relative;flex:0 0 calc((100% - 3 * var(--service-gap))/4);height:513px;min-height:0;padding:var(--service-pad);overflow:hidden;transition:flex-basis .4s ease,height .4s ease,background-color .4s ease,border-color .4s ease,color .4s ease}
.disciplines.has-active .discipline{flex-basis:calc((100% - 3 * var(--service-gap))/4.6)}
.disciplines.has-active .discipline.active{flex-basis:calc((100% - 3 * var(--service-gap))*1.6/4.6);height:620px}
.disciplines .discipline button{position:absolute;left:var(--service-pad);right:var(--service-pad);bottom:var(--service-pad);display:block;min-height:0;white-space:normal;line-height:1.1;transform:translateY(0);transition:transform .4s ease,color .4s ease}
.disciplines .discipline.active button{transform:translateY(calc(-1 * (var(--pill-height,180px) + 28px)))}
.disciplines .discipline .tags{position:absolute;left:var(--service-pad);bottom:var(--service-pad);display:flex;width:var(--pill-width);max-width:none;gap:12px;margin:0;pointer-events:none}
.disciplines .discipline .tags span{font-size:clamp(16px,1.27vw,22px);line-height:1.2;padding:12px 20px;border-color:currentColor;opacity:0;transform:translateY(14px);transition:opacity .18s ease,transform .18s ease;transition-delay:0ms}
.disciplines .discipline.active .tags span{opacity:1;transform:translateY(0);transition-duration:.4s;transition-delay:var(--pill-delay,120ms)}
@media(min-width:801px) and (max-width:1300px){.disciplines{--service-gap:18px;--service-pad:22px}.disciplines .discipline .tags span{padding:10px 14px}}
@media(max-width:800px){
  .disciplines{--service-gap:15px;--service-pad:28px;height:auto;align-items:stretch}
  .disciplines .discipline,.disciplines.has-active .discipline{flex:0 0 auto;height:100px;min-height:100px}
  .disciplines.has-active .discipline.active{flex:0 0 auto;height:380px;min-height:380px}
  .disciplines .discipline .tags span{font-size:18px;padding:12px 16px}
}

/* Exact service content may need a second line inside a pill. */
.disciplines .discipline .tags span{max-width:100%;white-space:normal}
.disciplines.has-active .discipline.active{height:var(--service-active-height,620px)}
@media(max-width:800px){.disciplines.has-active .discipline.active{height:var(--service-active-height,380px)}}

/* Gradual hero tiles: individual fades with a gentle upward drift. */
.tile-column>div{animation:tmd-tile-load 1.5s cubic-bezier(.16,1,.3,1) both;animation-delay:calc(.7s + var(--tile-order,0)*.19s)}
.tile-0>div:first-child{--tile-order:0}.tile-5>div:first-child{--tile-order:1}
.tile-1>div:first-child{--tile-order:2}.tile-4>div:first-child{--tile-order:3}
.tile-2>div:first-child{--tile-order:4}.tile-3>div:first-child{--tile-order:5}
.tile-0>div:last-child{--tile-order:6}.tile-5>div:last-child{--tile-order:7}
.tile-1>div:last-child{--tile-order:8}.tile-4>div:last-child{--tile-order:9}
.tile-2>div:last-child{--tile-order:10}.tile-3>div:last-child{--tile-order:11}
@keyframes tmd-tile-load{from{opacity:0;transform:translateY(42px)}to{opacity:1;transform:translateY(0)}}

/* Team gallery: replace circular placeholders with colorful portrait cards. */
.team-gallery{display:flex;align-items:flex-end;gap:24px;overflow-x:auto;overflow-y:hidden;padding:115px max(20px,calc((100vw - 1414px)/2)) 24px;margin-top:35px;min-height:620px;scroll-snap-type:x proximity;scrollbar-width:none}
.team-gallery::-webkit-scrollbar{display:none}
.team-card{position:relative;flex:0 0 clamp(230px,18vw,320px);height:390px;border:0;border-radius:0;padding:0;background:var(--team-color);overflow:hidden;scroll-snap-align:center;transition:flex-basis .5s ease,height .5s ease;cursor:pointer}
.team-card:hover,.team-card:focus-visible,.team-card.is-active{flex-basis:clamp(290px,23.4vw,416px);height:507px}
.team-card img{width:100%;height:100%;object-fit:cover;object-position:center;display:block}
.team-hover-cue{position:absolute;left:50%;top:50%;display:grid;place-items:center;width:140px;height:140px;border-radius:50%;background:white;color:#0A1628;font-size:24px;transform:translate(-50%,-50%) scale(.7);opacity:0;transition:opacity .35s ease,transform .5s ease;pointer-events:none}
.team-card:hover .team-hover-cue,.team-card:focus-visible .team-hover-cue,.team-card.is-active .team-hover-cue{opacity:1;transform:translate(-50%,-50%) scale(1)}
@media(max-width:800px){.team-gallery{gap:16px;margin-top:20px;padding-top:70px;min-height:480px}.team-card{flex-basis:230px;height:320px}.team-card:hover,.team-card:focus-visible,.team-card.is-active{flex-basis:275px;height:390px}.team-hover-cue{width:100px;height:100px;font-size:20px}}

/* Frosted navigation contracts on downward scroll and opens on upward scroll. */
html{scroll-padding-top:115px}
.hero{padding-top:74px}
.nav{position:fixed;left:50%;top:24px;transform:translateX(-50%);z-index:1000;width:calc(100% - 19.1%);transition:width .45s ease,top .45s ease,background-color .45s ease,box-shadow .45s ease}
.nav-links{flex:1;justify-content:center;max-width:650px;white-space:nowrap;overflow:hidden;opacity:1;transition:opacity .2s ease,max-width .45s ease,transform .45s ease,visibility .2s}
.nav.is-away{background:linear-gradient(-65deg,rgba(26,38,63,.84),rgba(10,22,40,.78));box-shadow:0 8px 30px #0a16281a}
.nav.is-compact{width:380px;top:18px}
.nav.is-compact .nav-links{max-width:0;opacity:0;visibility:hidden;transform:translateY(-6px);pointer-events:none}
.menu-toggle{transition:opacity .2s ease,width .45s ease}
.nav.is-compact .menu-toggle{width:0;padding:0;opacity:0;visibility:hidden;overflow:hidden;pointer-events:none}
.admin-bar .nav{top:56px}
@media(max-width:800px){.hero{padding-top:68px}.nav{width:calc(100% - 40px);top:20px}.nav.is-compact{width:300px;top:14px}.nav-links{max-width:none;white-space:normal;overflow:visible}.nav.is-compact .nav-links{display:none}.admin-bar .nav{top:60px}}

/* One seamless, automatically scrolling client-logo row. */
.logo-marquee{overflow:hidden;margin-top:64px;width:100%}
.logo-track{display:flex;width:max-content;animation:tmd-logo-scroll 40s linear infinite;will-change:transform}
.logo-set{display:flex;flex:none;gap:89px;padding-right:89px}
.client-logo{flex:none;width:220px;height:111px;border:1px solid #dfdfdf;border-radius:10px;display:grid;place-items:center;font-size:12px;font-weight:700;color:#e3e3e3}
@keyframes tmd-logo-scroll{from{transform:translateX(0)}to{transform:translateX(-50%)}}
@media(max-width:800px){.logo-marquee{margin-top:42px}.logo-set{gap:25px;padding-right:25px}.client-logo{width:150px;height:80px}.logo-track{animation-duration:32s}}

.statement.scroll-fill .scroll-fill-word{display:inline-block;color:transparent;background:linear-gradient(to right,#2c2c2c var(--word-fill,0%),#d4d4d4 var(--word-fill,0%));background-clip:text;-webkit-background-clip:text;-webkit-text-fill-color:transparent}

/* The original tile shape and staggered entrance frame each film. */
.tile-column>div{overflow:hidden}.hero-video{display:block;width:100%;height:100%;object-fit:cover;border-radius:inherit}

.role-flip-line{display:block;perspective:700px}
.role-flip-word{display:inline-block;transform-origin:50% 50%;backface-visibility:hidden;animation:tmd-role-flip 3s cubic-bezier(.45,0,.2,1) infinite;animation-delay:var(--flip-delay);animation-play-state:paused}
.roles-flipping .role-flip-word{animation-play-state:running}
@keyframes tmd-role-flip{0%{transform:rotateX(0)}16.666%{transform:rotateX(180deg)}33.333%,100%{transform:rotateX(360deg)}}
@media(max-width:0px){.role-flip-word{animation:none}}

.avatars{padding-left:0;gap:0}.client-avatar{display:block;flex:none;width:54px;height:54px;border:2px solid #fff;border-radius:50%;overflow:hidden;background:#d9d9d9;margin-left:-10px}.client-avatar:first-child{margin-left:0}.client-avatar svg{display:block;width:100%;height:100%}@media(max-width:600px){.trust{gap:12px}.client-avatar{width:42px;height:42px;margin-left:-9px}.trust>span{font-size:12px}}
.audience-cards article{translate:0 var(--card-drift,0px);will-change:translate;transition:translate .18s ease-out}
@media(max-width:0px){.audience-cards article{translate:none;will-change:auto;transition:none}}

.team-card{border-radius:5pt;overflow:hidden}

/* Match both editorial paragraphs with slightly tighter leading. */
.about .statement,.collaborators .statement{line-height:calc(1.36em - 2px)}
/* Draw the hero grid from the top down on each page load. */
.hero-grid>img{animation:tmd-grid-fall 2.8s cubic-bezier(.25,.1,.25,1) .15s both}
@keyframes tmd-grid-fall{from{clip-path:inset(0 0 100% 0)}to{clip-path:inset(0 0 0 0)}}
@media(max-width:0px){.hero-grid>img{animation:none}}
/* Original grey artwork blends into the brand blue as the section passes. */
.audience-decoration::after{content:"";position:absolute;inset:0;background:#003ae1;mask:url('assets/imgGroup2.svg') center/100% 100% no-repeat;-webkit-mask:url('assets/imgGroup2.svg') center/100% 100% no-repeat;opacity:var(--line-blue,0);pointer-events:none}
.team-gallery{width:100%;max-width:none;padding-left:0;padding-right:0;scroll-snap-type:none;overscroll-behavior-x:contain;touch-action:pan-x pan-y}
/* Scroll reveals solid blue from top to bottom, leaving grey below the edge. */
.audience-decoration::after{opacity:1;clip-path:inset(0 0 calc((1 - var(--line-blue,0))*100%) 0)}
/* Blend the hero into the white client section without fading the films. */
.hero{background:linear-gradient(180deg,#0a1628 0%,#003ae1 50%,#5b6eff 78%,#a6b0ff 89%,#e4e8ff 96%,#fff 100%)}
.hero-grid{mask-image:linear-gradient(to bottom,#000 78%,transparent 100%);-webkit-mask-image:linear-gradient(to bottom,#000 78%,transparent 100%)}

.roles{min-height:1.36em}.role-typeword{display:inline-block;white-space:nowrap}
/* Dark frosted glass over the hero on initial load. */
.nav:not(.is-away){background:linear-gradient(115deg,rgba(18,30,52,.66),rgba(33,40,65,.54));backdrop-filter:blur(20px) saturate(135%);-webkit-backdrop-filter:blur(20px) saturate(135%);border:1px solid rgba(255,255,255,.12);box-shadow:0 8px 28px rgba(0,0,0,.12)}

.portfolio-tiles{transform:translateY(120px)}
/* Bring the hero's trust row, eyebrow, and headline closer together. */
.hero .eyebrow{margin-top:30px}.hero h1{margin-top:22px}
@media(max-width:800px){.hero .eyebrow{margin-top:24px}.hero h1{margin-top:18px}}

.founder-photo{width:108px;height:108px;flex:0 0 108px;border-radius:50%;object-fit:cover;object-position:center 34%;border:3px solid #fff}
/* Seven portraits across desktop, with a tighter section rhythm. */
@media(min-width:801px){.team-gallery{gap:16px;margin-top:22px;padding-top:48px;padding-bottom:12px;min-height:0}.team-card{flex-basis:calc((100vw - 112px)/7.35);height:calc((100vw - 112px)/7.35 * 1.32)}.team-card:hover,.team-card:focus-visible,.team-card.is-active{flex-basis:calc((100vw - 112px)/7.35 * 1.22);height:calc((100vw - 112px)/7.35 * 1.52)}.people+.collaborators{padding-top:48px}}
@media(max-width:800px){.team-gallery{margin-top:16px;padding-top:35px;padding-bottom:8px;min-height:0}.team-card{flex-basis:180px;height:240px}.team-card:hover,.team-card:focus-visible,.team-card.is-active{flex-basis:210px;height:275px}.people+.collaborators{padding-top:36px}}
/* A longer, softer exit into white, including the grid strokes. */
.hero{background:linear-gradient(180deg,#0a1628 0%,#003ae1 42%,#5269f7 62%,#8898fb 75%,#bac4fd 86%,#e4e9ff 95%,#fff 100%)}
.hero-grid{mask-image:linear-gradient(to bottom,#000 58%,rgba(0,0,0,.8) 72%,rgba(0,0,0,.3) 88%,transparent 100%);-webkit-mask-image:linear-gradient(to bottom,#000 58%,rgba(0,0,0,.8) 72%,rgba(0,0,0,.3) 88%,transparent 100%)}
.hero-grid::after{content:"";position:absolute;inset:0;background:linear-gradient(to bottom,transparent 50%,rgba(255,255,255,.35) 65%,rgba(255,255,255,.85) 82%,#fff 94%);mask:url('assets/imgGroup3257.svg') center/100% 100% no-repeat;-webkit-mask:url('assets/imgGroup3257.svg') center/100% 100% no-repeat;animation:tmd-grid-fall 2.8s cubic-bezier(.25,.1,.25,1) .15s both;pointer-events:none}

.audience-cards article{translate:none;will-change:auto;transition:none}
.audience-cards.drop-ready article{opacity:0;translate:0 -60px}
.audience-cards.drop-visible article{animation:tmd-card-drop .9s cubic-bezier(.22,.61,.36,1) both}
.audience-cards.drop-visible article:nth-child(2){animation-delay:.18s}
.audience-cards.drop-visible article:nth-child(3){animation-delay:.36s}
.audience-cards.drop-visible article:nth-child(4){animation-delay:.54s}
@keyframes tmd-card-drop{from{opacity:0;translate:0 -60px}to{opacity:1;translate:0 0}}

.role-scroll-word{display:table;color:transparent;background:linear-gradient(to right,#00c9a7 var(--role-fill,0%),#d4d4d4 var(--role-fill,0%));background-clip:text;-webkit-background-clip:text;-webkit-text-fill-color:transparent}
/* Reserve the expanded card height so hover never shifts following content. */
@media(min-width:801px){.team-gallery{height:calc((100vw - 112px)/7.35 * 1.52 + 60px);min-height:calc((100vw - 112px)/7.35 * 1.52 + 60px)}}
@media(max-width:800px){.team-gallery{height:318px;min-height:318px}}
/* Add ten pixels between neighboring films in both directions. */
.tile-column{width:calc(15.6% - 10px);translate:5px 0;gap:calc(13 * var(--scale) + 10px)}
@media(max-width:800px){.tile-column{width:calc(29% - 10px);gap:22px}}
.logo-set{gap:60px;padding-right:60px}
@media(max-width:800px){.logo-set{gap:20px;padding-right:20px}}
/* Extra breathing room below the team gallery. */
.people+.collaborators{padding-top:118px}
@media(max-width:800px){.people+.collaborators{padding-top:106px}}
.discipline-emoji{position:fixed;z-index:9999;font-size:38px;line-height:1;pointer-events:none;user-select:none;filter:drop-shadow(0 3px 5px rgba(0,0,0,.12))}

/* Brand colors distinguish each discipline in both resting and expanded states. */
.disciplines .discipline:nth-child(1){--discipline-color:#003ae1;--discipline-ink:#fff}
.disciplines .discipline:nth-child(2){--discipline-color:#00c9a7;--discipline-ink:#0a1628}
.disciplines .discipline:nth-child(3){--discipline-color:#ff5c35;--discipline-ink:#0a1628}
.disciplines .discipline:nth-child(4){--discipline-color:#0a1628;--discipline-ink:#fff}
.disciplines .discipline,.disciplines .discipline.active{background:var(--discipline-color);border-color:var(--discipline-color);color:var(--discipline-ink)}

/* Individually framed transparent team portraits. */
.team-portrait{display:block;width:100%;height:100%;pointer-events:none}
.team-hover-cue{z-index:2}

/* Reference-style upward label roll and brand-color hover feedback. */
.button-roll{position:relative;display:block;overflow:hidden;line-height:1.15}
.button-roll-line{display:block;transition:transform .36s cubic-bezier(.22,.61,.36,1);will-change:transform}
.button-roll-copy{position:absolute;inset:0;transform:translateY(110%)}
:is(.pill,.menu-toggle,.discipline button):is(:hover,:focus-visible) .button-roll-line,.team-card:is(:hover,:focus-visible) .button-roll-line{transform:translateY(-110%)}
:is(.pill,.menu-toggle,.discipline button):is(:hover,:focus-visible) .button-roll-copy,.team-card:is(:hover,:focus-visible) .button-roll-copy{transform:translateY(0)}
.pill,.menu-toggle{scale:1;transition:scale .08s ease-in}
.pill:is(:hover,:focus-visible),.menu-toggle:is(:hover,:focus-visible){scale:.96}


.disciplines .discipline:nth-child(1):hover{background:#0a1628;border-color:#0a1628}
.disciplines .discipline:nth-child(2):hover{background:#19dfbd;border-color:#19dfbd}
.disciplines .discipline:nth-child(3):hover{background:#ff7959;border-color:#ff7959}
.disciplines .discipline:nth-child(4):hover{background:#003ae1;border-color:#003ae1}
.team-card:is(:hover,:focus-visible) .team-hover-cue{background:#0a1628;color:#fff}

/* Match the button label roll on navigation links. */
.nav-links a:is(:hover,:focus-visible) .button-roll-line{transform:translateY(-110%)}
.nav-links a:is(:hover,:focus-visible) .button-roll-copy{transform:translateY(0)}

.results{background:#f3f4f6;color:#0A1628}

/* Hero CTA outline hover retains its rolling label without changing layout. */


/* Preserve opaque white logo backgrounds while displaying monochrome artwork. */
.client-logo img{filter:grayscale(1)!important;mix-blend-mode:multiply}

/* Compensate for whitespace within the McKinsey artwork. */
.client-logo img[alt="McKinsey & Company"]{width:90%!important;height:90%!important}
.client-logo{position:relative}
.client-logo img[alt="McKinsey & Company"]{position:absolute;left:50%;top:50%;width:70%!important;height:125%!important;transform:translate(-50%,-49%)!important}

/* Center the visible Harvard Business Review artwork within its padded image. */
.client-logo img[alt="Harvard Business Review"]{transform:translateY(-10%)!important}

.client-logo img[alt="Sandals Resorts"]{transform:scale(.9)!important}

/* Keep rolling labels clipped during Safari transform compositing. */
.pill,.menu-toggle{overflow:hidden}
.button-roll{height:1.2em;line-height:1.2;overflow:hidden;clip-path:inset(0);isolation:isolate}
.button-roll-line{line-height:inherit;will-change:auto}
.button-roll-copy{top:0;right:0;bottom:auto;left:0}
.results p{color:var(--blue)}

.results .results-cta{margin-top:36px;background:var(--blue);color:#fff}

.results h3{display:none}
/* Audience card hover, independent of the staggered entrance positioning. */
.audience-cards article{scale:1;transition:scale .3s ease,background-color .3s ease;transform-origin:center}
@media(hover:hover){.audience-cards article:hover{scale:1.1;background:#2c2c2c;z-index:2}}

/* Caption space is reserved so hovered labels do not shift the page. */
.team-gallery{padding-bottom:100px}
.team-card{overflow:visible}
.team-card>.team-portrait{border-radius:inherit;overflow:hidden}
.team-caption{position:absolute;top:calc(100% + 14px);left:0;width:100%;display:block;text-align:center;color:#0A1628;opacity:0;translate:0 -5px;transition:opacity .2s ease,translate .2s ease;pointer-events:none}
.team-caption-name{display:block;font-size:16pt;line-height:1.2;font-weight:700}
.team-caption-title{display:block;margin-top:4px;font-size:14pt;line-height:1.25;font-style:italic;font-weight:400}
.team-card:is(:hover,:focus-visible,.is-active) .team-caption{opacity:1;translate:0 0}
@media(min-width:801px){.team-gallery{height:calc((100vw - 112px)/7.35 * 1.52 + 148px);min-height:calc((100vw - 112px)/7.35 * 1.52 + 148px)}}
@media(max-width:800px){.team-gallery{height:410px;min-height:410px}}

.pill .button-roll-line,.menu-toggle .button-roll-line{transition:transform .16s ease-in}

.team-card:is(:hover,:focus-visible,.is-active) .team-caption{pointer-events:auto}
.team-caption::before{content:"";position:absolute;left:0;right:0;top:-14px;height:14px}
/* Keep caption clearance while tightening the next section. */
.people+.collaborators{padding-top:24px}
@media(max-width:800px){.people+.collaborators{padding-top:20px}}
/* Immediate shrink on entry; quick ease-out return. */
.pill,.menu-toggle{transition:scale 100ms ease-out 0s}
.pill:is(:hover,:focus-visible),.menu-toggle:is(:hover,:focus-visible){transition:scale 50ms ease-in 0s}

.client-logo img[alt="Study Hotels"]{filter:grayscale(1) brightness(.8) contrast(100)!important}
@media(min-width:801px){.disciplines{height:520px}.disciplines .discipline{height:410px}}

/* Floating TMD contact panel. */
.tmd-contact{position:fixed;right:24px;bottom:24px;z-index:1000;font-family:Satoshi,Arial,sans-serif;color:#0a1628}
.tmd-contact-toggle{width:64px;height:64px;border:1px solid #ffffff55;border-radius:50%;background:#003AE1;color:white;display:grid;place-items:center;margin-left:auto;box-shadow:0 6px 24px #00164d33;transition:scale 100ms ease-out}
.tmd-contact-toggle:hover{scale:1.07;transition:scale 80ms ease-in}
.tmd-contact-toggle svg{width:27px;height:27px}.tmd-contact-toggle .contact-x{display:none}.tmd-contact.is-open .contact-chat{display:none}.tmd-contact.is-open .contact-x{display:block}
.tmd-contact-panel{position:absolute;right:0;bottom:80px;width:min(480px,calc(100vw - 32px));max-height:calc(100dvh - 120px);overflow:auto;padding:32px;background:#fff;border:1px solid #003AE122;border-radius:20px;box-shadow:0 16px 70px #0a162833;opacity:0;visibility:hidden;transform:translateY(12px) scale(.97);transform-origin:bottom right;transition:opacity 120ms ease-out,transform 120ms ease-out,visibility 120ms}
.tmd-contact.is-open .tmd-contact-panel{opacity:1;visibility:visible;transform:translateY(0) scale(1);transition-timing-function:ease-in}
.tmd-contact-panel h2{font-size:32px;line-height:1.1;color:#003AE1;letter-spacing:-1px}.tmd-contact-panel>p{font-size:15px;line-height:1.5;margin:12px 0 22px;color:#596172}
.tmd-contact-form{display:grid;gap:17px}.tmd-contact-form label{display:grid;gap:5px;font-size:14px}.tmd-contact-form input:not([type=checkbox]),.tmd-contact-form textarea{width:100%;border:0;border-bottom:1px solid #cdd2db;border-radius:0;padding:7px 0;background:transparent;font:inherit;color:#0a1628;outline:none}.tmd-contact-form textarea{min-height:65px;resize:vertical}.tmd-contact-form input:focus,.tmd-contact-form textarea:focus{border-color:#003AE1;box-shadow:0 1px #003AE1}.tmd-contact-form .contact-consent{display:flex;align-items:flex-start;gap:9px;font-size:12px;line-height:1.4}.contact-consent input{accent-color:#003AE1;margin-top:2px}.contact-consent a{text-decoration:underline}.tmd-contact-form button{border:0;border-radius:40px;background:#003AE1;color:#fff;padding:13px 24px;font-weight:700;justify-self:end;transition:scale 80ms ease-in}.tmd-contact-form button:hover{scale:.96}.tmd-contact-form button:disabled{opacity:.6;cursor:wait}.contact-status{font-size:14px;line-height:1.4}.tmd-contact-form .contact-trap{position:absolute;left:-9999px;visibility:hidden}
@media(max-width:600px){.tmd-contact{right:16px;bottom:16px}.tmd-contact-toggle{width:56px;height:56px}.tmd-contact-panel{bottom:70px;padding:24px;max-height:calc(100dvh - 105px)}}
@media(prefers-reduced-motion:reduce){.tmd-contact *{transition:none!important}}
.tmd-contact-form{gap:11px}.tmd-contact-form input:not([type=checkbox]),.tmd-contact-form textarea{padding:3px 0}.tmd-contact-form textarea{min-height:48px}.tmd-contact-panel>p{margin-bottom:16px}
/* Slightly quieter team captions. */
.team-caption-name{font-size:14pt}
.team-caption-title{font-size:12pt}
.mission-word{display:inline-block;transition:opacity 140ms ease,translate 140ms ease;opacity:1;translate:0 0}.mission-word.is-changing{opacity:0;translate:0 7px}
/* Larger, clearly labelled contact launcher. */
.tmd-contact-toggle{width:104px;height:104px;font-size:16px;font-weight:700;line-height:1.15;text-align:center}
.tmd-contact-panel{bottom:120px;max-height:calc(100dvh - 160px)}
@media(max-width:600px){.tmd-contact-toggle{width:86px;height:86px;font-size:14px}.tmd-contact-panel{bottom:100px;max-height:calc(100dvh - 135px)}}
.tmd-contact-form button[type=submit]{scale:1;transition:scale 100ms ease-out 0s}
.tmd-contact-form button[type=submit]:is(:hover,:focus-visible){scale:.96;transition:scale 50ms ease-in 0s}
.tmd-contact-form button[type=submit]{transition:scale 100ms ease-out 0s!important}
.tmd-contact-form button[type=submit]:is(:hover,:focus-visible){transition:scale 50ms ease-in 0s!important}
.tmd-contact-form .button-roll-line{transition:transform 160ms ease-in!important}
.tmd-contact-form label{font-weight:700}
.tmd-contact-form input,.tmd-contact-form textarea{font-weight:400!important}
/* Remove the introductory label and its gap above the agency overview. */
.about>.label{display:none}
.about .about-grid{margin-top:0}
.tmd-copyright{padding:24px 140px 24px 24px;text-align:center;font-size:11pt;line-height:1.5;color:#0A1628;background:#fff}
@media(max-width:600px){.tmd-copyright{padding:24px 110px 24px 20px;text-align:left}}
/* Keep field geometry stable; indicate focus with an inset underline. */
.tmd-contact-form input:not([type=checkbox]),.tmd-contact-form textarea{font-size:16px;line-height:24px;transform:none;transition:none!important;border-bottom:1px solid #cdd2db;box-shadow:none}
.tmd-contact-form input:not([type=checkbox]){height:31px}
.tmd-contact-form input:not([type=checkbox]):focus,.tmd-contact-form textarea:focus{border-bottom:1px solid #003AE1;box-shadow:inset 0 -2px 0 #003AE1;transform:none;outline:none}
.tmd-contact-toggle{transition:scale 180ms ease-out!important}
.tmd-contact-toggle:is(:hover,:focus-visible){scale:1.07;transition:scale 140ms ease-in!important}
.tmd-contact-form button[type=submit]{margin-top:12px}
/* Give the clipped text-fill background room for descenders and edge glyphs. */
.role-scroll-word{padding:0 .04em .12em; margin-left:-.04em;margin-bottom:-.12em;line-height:1.25;overflow:visible}
.tmd-contact-panel>p{margin-top:6px}
/* Reserve the longest word's width so the centered line never shifts. */
.mission-word{width:5.3em;text-align:left;white-space:nowrap}
.tmd-copyright{padding:24px 20px;text-align:center;font-size:10pt;font-weight:700}
/* Explicit label blocks prevent browser autofill controls from reflowing grid text. */
.tmd-contact-form label{display:block;line-height:21px}
.tmd-contact-form .contact-field-label{display:block;height:21px;line-height:21px;font-size:14px;font-weight:700;position:static;transform:none!important;translate:none!important;transition:none!important}
.tmd-contact-form label>input,.tmd-contact-form label>textarea{display:block;margin:5px 0 0;position:static;scale:1!important;translate:none!important}
/* Keep the complete desktop form visible to avoid focus-induced panel scrolling. */
.tmd-contact-panel{padding:24px}
.tmd-contact-form{gap:8px}
.tmd-contact-form label>input{height:25px;line-height:18px;margin-top:0}
.tmd-contact-form label>textarea{height:44px;min-height:44px;margin-top:0;line-height:20px}
.tmd-contact-form .contact-status:empty{display:none}
.tmd-contact-form button[type=submit]{height:48px}
.hero h1 .tmd-line-text:has(.mission-word){position:relative;left:.2em}
.tmd-copyright{font-size:9pt}

/* Continue testimonial background through closing invitation. */
.tmd-final-cta{background:#f6f7fa!important}

/* Align decorative quotation marks with each client name. */
.tmd-quote-card .tmd-quote-mark{display:none!important}
.tmd-quote-card .tmd-quote-credit{position:relative;width:100%;box-sizing:border-box;padding-right:42px}
.tmd-quote-card .tmd-quote-credit::after{content:"“";position:absolute;right:0;top:18px;color:#003AE1;font-family:Satoshi,Arial,sans-serif;font-size:70px;font-weight:700;line-height:.8;pointer-events:none}

/* Square blue lightbox close control with a crisp white X. */
.tmd-quote-dialog .tmd-quote-dialog-close{width:44px;height:44px;border:0;border-radius:0;background:#003AE1;color:transparent;font-size:0;padding:0;display:block}
.tmd-quote-dialog-close::before,.tmd-quote-dialog-close::after{content:"";position:absolute;left:50%;top:50%;width:25px;height:3px;background:#fff;transform:translate(-50%,-50%) rotate(45deg)}
.tmd-quote-dialog-close::after{transform:translate(-50%,-50%) rotate(-45deg)}

/* Keep long client names clear of the decorative quote. */
.tmd-quote-card .tmd-quote-name{max-width:20ch;white-space:normal;overflow-wrap:normal;text-wrap:balance}

/* Compensate for internal whitespace in these square logo assets. */
.clients img[alt="McKinsey & Company"],.clients img[alt="St. Martin's Press"]{transform:scale(2.05)!important;transform-origin:center}

.clients img[alt="McKinsey & Company"]{transform:translate(-45%,-45%) scale(2.05)!important}

/* Center the HBR artwork without the legacy upward offset. */
.clients img[alt="Harvard Business Review"]{transform:none!important;align-self:center;justify-self:center}

/* Contain the relocated animated logo in the results frame. */
.results{position:relative;overflow:hidden;isolation:isolate}
.results>.audience-decoration{z-index:-1;top:50%;left:50%;width:150%;transform:translate(-50%,-50%);opacity:.32;will-change:translate}
.results>.audience-decoration img{display:block;width:100%;height:auto;max-width:none}
.results>p,.results>.results-cta{position:relative;z-index:1}

/* Relocate logo outline to the results frame with scroll-driven parallax. */
.audiences>.audience-decoration{display:none}
.results{view-timeline-name:--results-logo;view-timeline-axis:block}
.results::before,.results::after{content:"";position:absolute;pointer-events:none;z-index:-1;width:150%;height:180%;left:-25%;top:-40%;background:url("https://targetmktng.com/wp-content/themes/tmd-2026/assets/imgGroup2.svg") center/100% 100% no-repeat;opacity:.42}
.results::after{background:#003ae1;mask:url("https://targetmktng.com/wp-content/themes/tmd-2026/assets/imgGroup2.svg") center/100% 100% no-repeat;-webkit-mask:url("https://targetmktng.com/wp-content/themes/tmd-2026/assets/imgGroup2.svg") center/100% 100% no-repeat;clip-path:inset(0 0 45% 0)}
@supports(animation-timeline:view()){.results::before{animation:results-logo-parallax linear both;animation-timeline:--results-logo;animation-range:entry 0% exit 100%}.results::after{animation:results-logo-draw linear both;animation-timeline:--results-logo;animation-range:entry 0% exit 100%}}
@keyframes results-logo-parallax{from{transform:translateY(-50px)}to{transform:translateY(50px)}}
@keyframes results-logo-draw{from{transform:translateY(-50px);clip-path:inset(0 0 100% 0)}to{transform:translateY(50px);clip-path:inset(0 0 0 0)}}
@media(prefers-reduced-motion:reduce){.results::before,.results::after{animation:none!important}}

/* Full-width sector cards stack inside the Who We Serve section. */
.audiences{overflow:visible}
.tmd-sector-stack{position:relative;display:block;margin-top:88px;padding-bottom:100px}
.tmd-sector-card{position:sticky;top:calc(145px + var(--card-index)*18px);z-index:calc(2 + var(--card-index));display:grid;grid-template-columns:1fr 1.12fr;gap:56px;align-items:center;background:#003AE1;color:#fff;border-radius:16px;padding:48px;min-height:530px;margin-bottom:100px;box-shadow:0 -8px 24px rgba(10,22,40,.08)}
.tmd-sector-card:nth-child(2){background:#0634bd}.tmd-sector-card:nth-child(3){background:#0b38bf}.tmd-sector-card:nth-child(4){background:#003AE1}
.tmd-sector-copy h4{font:700 clamp(38px,4vw,64px)/1.08 Satoshi,Arial,sans-serif;letter-spacing:-1px;margin:0 0 44px}
.tmd-sector-copy p{font:400 clamp(18px,1.65vw,26px)/1.4 Satoshi,Arial,sans-serif;color:#fff;margin:0}
.tmd-sector-media{width:100%;height:430px;background:#fff;border-radius:12px}
.audiences .audience-through-line{margin-top:20px}
@media(max-width:800px){.tmd-sector-stack{margin-top:48px;padding-bottom:60px}.tmd-sector-card{top:calc(105px + var(--card-index)*10px);grid-template-columns:1fr;gap:24px;padding:28px;min-height:0;margin-bottom:64px}.tmd-sector-copy h4{font-size:36px;margin-bottom:18px}.tmd-sector-copy p{font-size:18px}.tmd-sector-media{height:220px}}
@media(prefers-reduced-motion:reduce){.tmd-sector-card{position:relative;top:auto}}

/* Balance visible wordmark widths while compensating for asset whitespace. */
.clients img[alt="BCG"]{transform:scale(1.8)!important}
.clients img[alt="Deloitte"]{transform:scale(1.35)!important}
.clients img[alt="Faena"]{transform:scale(.85)!important}

/* Preserve the logo outline aspect ratio inside the results frame. */
.results::before{background-size:cover}
.results::after{mask-size:cover;-webkit-mask-size:cover}

/* Hero poster images render with frames before video initialization. */
.portfolio-tiles .tile-0 > div:nth-child(1){background:#003AE1 url("https://targetmktng.com/wp-content/uploads/2026/10/hero-03.jpg") center/cover no-repeat}
.portfolio-tiles .tile-0 > div:nth-child(2){background:#003AE1 url("https://targetmktng.com/wp-content/uploads/2026/10/hero-01.jpg") center/cover no-repeat}
.portfolio-tiles .tile-1 > div:nth-child(1){background:#003AE1 url("https://targetmktng.com/wp-content/uploads/2026/10/hero-05.jpg") center/cover no-repeat}
.portfolio-tiles .tile-1 > div:nth-child(2){background:#003AE1 url("https://targetmktng.com/wp-content/uploads/2026/10/hero-06.jpg") center/cover no-repeat}
.portfolio-tiles .tile-2 > div:nth-child(1){background:#003AE1 url("https://targetmktng.com/wp-content/uploads/2026/10/hero-02.jpg") center/cover no-repeat}
.portfolio-tiles .tile-2 > div:nth-child(2){background:#003AE1 url("https://targetmktng.com/wp-content/uploads/2026/10/hero-07.jpg") center/cover no-repeat}
.portfolio-tiles .tile-3 > div:nth-child(1){background:#003AE1 url("https://targetmktng.com/wp-content/uploads/2026/10/hero-04.jpg") center/cover no-repeat}
.portfolio-tiles .tile-3 > div:nth-child(2){background:#003AE1 url("https://targetmktng.com/wp-content/uploads/2026/10/hero-08.jpg") center/cover no-repeat}
.portfolio-tiles .tile-4 > div:nth-child(1){background:#003AE1 url("https://targetmktng.com/wp-content/uploads/2026/10/hero-09.jpg") center/cover no-repeat}
.portfolio-tiles .tile-4 > div:nth-child(2){background:#003AE1 url("https://targetmktng.com/wp-content/uploads/2026/10/hero-03.jpg") center/cover no-repeat}
.portfolio-tiles .tile-5 > div:nth-child(1){background:#003AE1 url("https://targetmktng.com/wp-content/uploads/2026/10/hero-10.jpg") center/cover no-repeat}
.portfolio-tiles .tile-5 > div:nth-child(2){background:#003AE1 url("https://targetmktng.com/wp-content/uploads/2026/10/hero-05.jpg") center/cover no-repeat}

/* Narrower scroll stack; covered cards ease into smaller layers. */
.tmd-sector-stack{width:92%;max-width:1240px;margin-left:auto;margin-right:auto;timeline-scope:--sector-two,--sector-three,--sector-four}
.tmd-sector-card{transform-origin:50% 0;top:calc(145px + var(--card-index)*28px)}
.tmd-sector-card:nth-child(2){view-timeline-name:--sector-two;view-timeline-axis:block}
.tmd-sector-card:nth-child(3){view-timeline-name:--sector-three;view-timeline-axis:block}
.tmd-sector-card:nth-child(4){view-timeline-name:--sector-four;view-timeline-axis:block}
@supports(animation-timeline:view()){.tmd-sector-card:nth-child(1){animation:sector-shrink-one cubic-bezier(.22,.61,.36,1) both;animation-timeline:--sector-two;animation-range:entry 0% entry 100%}.tmd-sector-card:nth-child(2){animation:sector-shrink-two cubic-bezier(.22,.61,.36,1) both;animation-timeline:--sector-three;animation-range:entry 0% entry 100%}.tmd-sector-card:nth-child(3){animation:sector-shrink-three cubic-bezier(.22,.61,.36,1) both;animation-timeline:--sector-four;animation-range:entry 0% entry 100%}}
@keyframes sector-shrink-one{from{transform:scale(1)}to{transform:scale(.86)}}
@keyframes sector-shrink-two{from{transform:scale(1)}to{transform:scale(.91)}}
@keyframes sector-shrink-three{from{transform:scale(1)}to{transform:scale(.955)}}
@media(max-width:800px){.tmd-sector-stack{width:100%}.tmd-sector-card{top:calc(115px + var(--card-index)*14px)}}
@media(prefers-reduced-motion:reduce){.tmd-sector-card{animation:none!important;transform:none!important}}

/* Tighten the closing gap after the final stacked card. */
.tmd-sector-stack{padding-bottom:24px}
.tmd-sector-card:last-child{margin-bottom:0}
.audiences .audience-through-line{margin-top:24px}

/* Bring the closing invitation closer to the testimonials. */
.tmd-testimonials{padding-bottom:40px!important}
.tmd-final-cta{padding-top:56px!important}
@media(max-width:600px){.tmd-testimonials{padding-bottom:28px!important}.tmd-final-cta{padding-top:40px!important}}

/* Prevent Ken’s old orange portrait backing showing at the edge. */
.team-card[aria-label="Meet Ken"]{background:transparent!important}
.team-card[aria-label="Meet Ken"] .team-portrait{background:transparent!important}

/* Show more of the logo outline while preserving its proportions. */
.results::before,.results::after{width:110%;height:140%;left:-5%;top:-20%}
.results::before{background-size:contain}
.results::after{mask-size:contain;-webkit-mask-size:contain}

/* Enlarge the proportional outline behind the book-launch copy. */
.results::before,.results::after{width:125%;height:175%;left:-12.5%;top:-37.5%}

/* Fill the results frame with a proportional background logo. */
.results::before,.results::after{width:140%;height:200%;left:-20%;top:-50%}
.results::before{background-size:cover}
.results::after{mask-size:cover;-webkit-mask-size:cover}