:root{--paper:#f1efe9;--ink:#070707;--muted:#77736d;--line:rgba(7,7,7,.16);--pad:6vw}*{box-sizing:border-box;margin:0;padding:0}html{scroll-behavior:smooth}body{background:var(--paper);color:var(--ink);font-family:Arial,Helvetica,sans-serif;overflow-x:hidden}body.modal-open,body.menu-open{overflow:hidden}a{color:inherit;text-decoration:none}button,input,textarea,select{font:inherit}button{color:inherit}.nav{position:fixed;z-index:100;top:0;left:0;width:100%;padding:24px 40px;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;border-bottom:1px solid rgba(7,7,7,.08);background:rgba(241,239,233,.9);backdrop-filter:blur(16px);font-size:9px;letter-spacing:.15em;text-transform:uppercase}.logo{font-size:24px;font-weight:900;letter-spacing:-.09em}.desktop-nav{display:flex;gap:28px}.nav-meta{display:flex;gap:28px;justify-self:end;opacity:.48}.menu-toggle{display:none;border:0;background:transparent;font-size:9px;letter-spacing:.15em}.mobile-menu{position:fixed;z-index:95;inset:73px 0 0;background:var(--paper);padding:34px 20px 50px}.mobile-menu a{display:block;border-bottom:1px solid var(--line);padding:18px 0;font-size:11vw;font-weight:900;letter-spacing:-.06em;line-height:.9}.hero{min-height:100svh;display:flex;align-items:center;border-bottom:1px solid var(--line)}.hero-content{width:100%;padding:165px var(--pad) 80px}.eyebrow,.small-label,.clients-label{font-size:10px;letter-spacing:.18em;text-transform:uppercase}.eyebrow{margin-bottom:55px;opacity:.45}.hero-title{font-size:clamp(80px,15vw,235px);font-weight:900;letter-spacing:-.087em;line-height:.78}.hero-title span,.creative-statement span{display:block}.hero-bottom{display:flex;justify-content:space-between;align-items:end;margin-top:60px;font-size:13px;line-height:1.5}.text-link{font-size:10px;letter-spacing:.14em;text-transform:uppercase}.section-header{display:flex;justify-content:space-between;border-bottom:1px solid var(--line);padding:20px var(--pad);font-size:10px;letter-spacing:.15em}.work-intro{display:grid;grid-template-columns:1.35fr .65fr;gap:8vw;padding:90px var(--pad) 65px}.work-intro h2,.contact-copy h2{font-size:clamp(58px,8vw,130px);line-height:.84;letter-spacing:-.07em}.work-intro p,.contact-copy p{align-self:end;max-width:440px;font-size:14px;line-height:1.6}.work-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));border-top:1px solid var(--line)}.work-card{display:block;width:100%;border:0;border-right:1px solid var(--line);border-bottom:1px solid var(--line);background:transparent;text-align:left;cursor:pointer}.work-media{aspect-ratio:16/10;overflow:hidden;background:#111}.work-media video,.work-media img,.modal-media video,.modal-media img{width:100%;height:100%;display:block;object-fit:cover}.media-placeholder{height:100%;display:flex;flex-direction:column;justify-content:space-between;background:#151515;color:#f1efe9;padding:26px}.media-placeholder span,.media-placeholder small{font-size:9px;letter-spacing:.16em}.media-placeholder strong{font-size:11vw;letter-spacing:-.09em}.work-meta{display:flex;justify-content:space-between;gap:20px;padding:18px 22px 24px;font-size:10px;letter-spacing:.1em;text-transform:uppercase}.work-meta div{display:flex;gap:18px}.work-meta span{opacity:.52}.service{border-bottom:1px solid var(--line)}.service-trigger{width:100%;border:0;background:transparent;display:grid;grid-template-columns:70px 1fr 50px;align-items:center;padding:30px var(--pad);cursor:pointer}.service-name{font-size:clamp(42px,7vw,108px);font-weight:900;letter-spacing:-.065em;text-align:left}.number,.plus{font-size:10px}.plus{text-align:right;font-size:26px}.service-content{display:none;grid-template-columns:1.2fr .8fr;gap:8vw;padding:0 var(--pad) 60px}.service.active .service-content{display:grid}.service-copy h2{font-size:clamp(46px,6vw,95px);line-height:.88;letter-spacing:-.06em;margin:18px 0 24px}.service-copy p{max-width:440px;line-height:1.6}.capability-notes{display:grid;grid-template-columns:1fr 1fr;align-content:end}.capability-notes span{padding:12px 0;border-top:1px solid var(--line);font-size:10px;letter-spacing:.12em}.creative-section{padding:110px var(--pad) 95px;border-bottom:1px solid var(--line)}.creative-top,.creative-bottom{display:flex;justify-content:space-between;font-size:10px;letter-spacing:.13em;text-transform:uppercase}.creative-top{margin-bottom:80px}.creative-statement{font-size:clamp(72px,14vw,210px);font-weight:900;letter-spacing:-.085em;line-height:.78}.creative-bottom{margin-top:75px;align-items:end}.creative-bottom p{max-width:360px;line-height:1.5}.clients{padding:70px var(--pad)}.clients-label{margin-bottom:28px}.client-logo-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));border-top:1px solid var(--line);border-left:1px solid var(--line)}.client-logo-card{min-height:150px;display:flex;align-items:center;justify-content:center;padding:28px;border-right:1px solid var(--line);border-bottom:1px solid var(--line);overflow:hidden}.client-logo-card img{display:block;width:100%;max-width:170px;max-height:64px;object-fit:contain;filter:grayscale(1);opacity:.68;transition:.25s}.client-logo-card:hover img{filter:grayscale(0);opacity:1;transform:scale(1.025)}.client-logo-card.gopuff-card img{mix-blend-mode:multiply;max-width:155px}.contact{border-top:1px solid var(--line)}.contact-layout{display:grid;grid-template-columns:1fr 1fr;gap:8vw;padding:90px var(--pad) 100px}.contact-copy p{margin-top:35px}.contact-form{display:grid;gap:22px}.form-row{display:grid;grid-template-columns:1fr 1fr;gap:18px}.contact-form label{font-size:9px;letter-spacing:.15em}.contact-form input,.contact-form textarea,.contact-form select{width:100%;margin-top:9px;padding:14px 0;border:0;border-bottom:1px solid var(--ink);background:transparent;outline:none}.submit-button{margin-top:10px;border:1px solid var(--ink);background:var(--ink);color:var(--paper);padding:17px 20px;display:flex;justify-content:space-between;cursor:pointer}.footer{border-top:1px solid var(--line);padding:25px var(--pad);display:grid;grid-template-columns:1fr 1fr 1fr;font-size:9px;letter-spacing:.14em}.footer div:nth-child(2){text-align:center}.footer div:last-child{text-align:right}.project-modal{position:fixed;z-index:200;inset:0;background:var(--paper);overflow:auto;padding:78px 0 55px}.modal-close{position:fixed;right:28px;top:26px;z-index:210;border:0;background:transparent;font-size:10px;letter-spacing:.14em;cursor:pointer}.modal-media{width:min(1180px,100%);margin:auto;aspect-ratio:16/9;background:#111}.modal-meta{width:min(1180px,100%);margin:auto;padding:30px 0;display:grid;grid-template-columns:1fr 1fr;gap:40px}.modal-meta h2{font-size:clamp(48px,7vw,100px);line-height:.9;letter-spacing:-.065em;margin-top:10px}.modal-details{display:grid;align-content:end;gap:10px;font-size:10px;letter-spacing:.13em;text-transform:uppercase}.modal-details span{border-top:1px solid var(--line);padding-top:10px}@media(max-width:760px){:root{--pad:20px}.nav{padding:20px;grid-template-columns:1fr auto}.desktop-nav,.nav-meta{display:none}.menu-toggle{display:block}.hero-content{padding:130px var(--pad) 58px}.eyebrow{margin-bottom:70px}.hero-title{font-size:20vw;line-height:.81}.hero-bottom{display:block;margin-top:70px}.hero-bottom .text-link{display:inline-block;margin-top:36px}.work-intro{grid-template-columns:1fr;padding:70px var(--pad) 45px;gap:30px}.work-intro h2{font-size:17vw}.work-intro p{max-width:100%}.work-grid{grid-template-columns:1fr}.work-meta{padding:14px 16px 22px}.service-trigger{padding:27px var(--pad);grid-template-columns:34px 1fr 28px}.service-name{font-size:9.8vw}.service-content{grid-template-columns:1fr;gap:35px}.service.active .service-content{padding:18px var(--pad) 52px}.capability-notes{grid-template-columns:1fr}.creative-section{padding:95px var(--pad) 76px}.creative-top{margin-bottom:68px;display:block}.creative-top span:last-child{display:block;margin-top:14px}.creative-statement{font-size:18vw}.creative-bottom{display:block;margin-top:65px}.creative-bottom .text-link{display:inline-block;margin-top:35px}.clients{padding:50px var(--pad)}.client-logo-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.client-logo-card{min-height:120px;padding:24px 18px}.client-logo-card img{max-width:125px;max-height:52px}.contact-layout{grid-template-columns:1fr;gap:55px;padding:70px var(--pad) 82px}.contact-copy h2{font-size:16vw}.form-row{grid-template-columns:1fr}.footer{padding:24px var(--pad);grid-template-columns:1fr;gap:13px}.footer div:nth-child(2),.footer div:last-child{text-align:left}.project-modal{padding:72px 0 50px}.modal-close{right:20px;top:25px}.modal-media{aspect-ratio:4/5}.modal-meta{grid-template-columns:1fr;padding:24px 20px 0;gap:30px}.modal-meta h2{font-size:13vw}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition:none!important;animation:none!important}}
/* Keep portfolio playback uncropped on desktop and mobile. */
.modal-media:has(video){aspect-ratio:16/9}
.modal-media video{object-fit:contain}

/* Large portfolio films stream through their public Drive player. */
.work-media{position:relative}
.work-play{position:absolute;left:20px;bottom:20px;background:rgba(7,7,7,.8);color:#f1efe9;padding:12px 16px;font-size:10px;letter-spacing:.12em}
.modal-media:has(iframe){aspect-ratio:16/9;position:relative}
.modal-media iframe{display:block;width:100%;height:100%;border:0}
.video-fallback{display:block;text-align:right;padding:8px 12px;font-size:10px;letter-spacing:.1em;background:var(--paper);color:var(--ink)}

.work-meta div{min-width:0;flex-direction:column;gap:6px}
.work-meta strong{overflow-wrap:anywhere;line-height:1.4}
.work-meta>span{flex-shrink:0}

/* Thumbnail colors add a restrained accent beneath each film. */
.work-palette{display:flex;width:100%;height:42px;overflow:hidden}
.work-palette span{display:block;flex:1;min-width:0}
@media(max-width:760px){.work-palette{height:36px}}

/* Color capability feature: selected still and its five-color palette. */
.color-showcase{min-width:0;display:grid;align-content:start;gap:28px}
.color-still{margin:0;min-width:0}
.color-still img{display:block;width:100%;height:auto;aspect-ratio:auto;object-fit:contain;background:#0d0d0e}
.color-still figcaption{padding-top:12px;font-size:9px;letter-spacing:.13em;line-height:1.5;color:var(--muted)}

/* Real IAA product screenshot in the Web Development panel. */
.development-showcase{min-width:0;display:grid;align-content:start;gap:28px}
.development-still{margin:0;min-width:0}
.development-still img{display:block;width:100%;height:auto;border:1px solid var(--line)}
.development-still figcaption{padding-top:12px;font-size:9px;letter-spacing:.13em;line-height:1.5;color:var(--muted)}

/* Cinematic hero with warm ivory type over the supplied still. */
.hero{
  position:relative;
  isolation:isolate;
  background-color:#101719;
  background-image:linear-gradient(90deg,rgba(4,9,11,.55) 0%,rgba(4,9,11,.25) 55%,rgba(4,9,11,.08) 100%),url("./media/ctrl-hero-firelit.jpg");
  background-size:cover;
  background-position:72% center;
  background-repeat:no-repeat;
  border-bottom-color:rgba(241,239,233,.2);
}
.hero-content{position:relative;color:#f1efe9}
.hero-title{color:#f1efe9;text-shadow:0 3px 24px rgba(0,0,0,.3)}
.hero .eyebrow{opacity:.8}
.hero-bottom{text-shadow:0 1px 8px rgba(0,0,0,.75)}
.hero .text-link:focus-visible{outline:2px solid #f1efe9;outline-offset:8px}
@media(max-width:760px){
  .hero{background-position:82% center;background-image:linear-gradient(90deg,rgba(4,9,11,.62),rgba(4,9,11,.2)),url("./media/ctrl-hero-firelit.jpg")}
}

/* FINAL PREMIUM POLISH */
:root{--paper:#eeeae1;--paper-2:#f7f3ea;--ink:#0a0908;--muted:#756f65;--line:rgba(10,9,8,.19);--line-soft:rgba(10,9,8,.09);--shadow:0 26px 70px rgba(20,16,10,.08)}
body{background:linear-gradient(180deg,#f1ede4 0%,#ece7dd 100%);font-synthesis:none}
::selection{background:#171512;color:#f4efe5}
.nav{padding:22px 3vw;background:rgba(238,234,225,.86);border-bottom:1px solid var(--line-soft);backdrop-filter:blur(22px) saturate(125%);-webkit-backdrop-filter:blur(22px) saturate(125%)}
.logo{font-size:27px;letter-spacing:-.105em}.desktop-nav{gap:34px}.desktop-nav a,.nav-section-link,.nav-meta a{position:relative;transition:opacity .2s ease}.desktop-nav a:after,.nav-section-link:after,.nav-meta a:after{content:"";position:absolute;left:0;right:0;bottom:-7px;height:1px;background:currentColor;transform:scaleX(0);transform-origin:right;transition:transform .28s ease}.desktop-nav a:hover:after,.nav-section-link:hover:after,.nav-meta a:hover:after{transform:scaleX(1);transform-origin:left}.nav-meta{opacity:.62}
.hero{min-height:100svh;background-image:linear-gradient(90deg,rgba(4,7,8,.62) 0%,rgba(4,7,8,.29) 48%,rgba(4,7,8,.12) 100%),url("./media/ctrl-hero-firelit.jpg");box-shadow:inset 0 -120px 160px rgba(0,0,0,.12)}
.hero-content{padding-top:150px;padding-bottom:74px}.hero .eyebrow{font-size:9px;letter-spacing:.24em;opacity:.76}.hero-title{max-width:12ch;letter-spacing:-.092em;text-shadow:0 12px 38px rgba(0,0,0,.24)}
.hero-bottom{margin-top:72px}.hero-bottom p{font-size:12px;color:rgba(241,239,233,.86)}
.text-link{position:relative;padding-bottom:7px}.text-link:after{content:"";position:absolute;left:0;right:0;bottom:0;height:1px;background:currentColor;transform:scaleX(.28);transform-origin:left;transition:transform .3s ease}.text-link:hover:after{transform:scaleX(1)}
.section-header{padding-top:18px;padding-bottom:18px;border-color:var(--line-soft);color:#4d4943}
.work-intro{padding-top:112px;padding-bottom:82px}.work-intro h2,.contact-copy h2{letter-spacing:-.075em}.work-intro p,.contact-copy p{font-size:13px;line-height:1.72;color:#4f4a43}
.work-grid{border-top-color:var(--line)}.work-card{position:relative;background:rgba(247,243,234,.38);transition:background .25s ease}.work-card:hover{background:rgba(247,243,234,.9)}.work-media{position:relative;background:#0d0d0c}.work-media:after{content:"";position:absolute;inset:0;box-shadow:inset 0 0 0 1px rgba(255,255,255,.035);pointer-events:none}.work-media img,.work-media video{transition:transform .7s cubic-bezier(.2,.75,.2,1),filter .5s ease}.work-card:hover .work-media img,.work-card:hover .work-media video{transform:scale(1.018);filter:contrast(1.02)}
.work-play{left:18px;bottom:18px;padding:10px 13px;border:1px solid rgba(255,255,255,.35);background:rgba(9,9,8,.64);backdrop-filter:blur(10px);border-radius:999px;font-size:8px;letter-spacing:.16em}
.work-palette{height:30px;border-top:1px solid rgba(0,0,0,.14);border-bottom:1px solid rgba(0,0,0,.14)}.work-meta{padding:20px 22px 25px}.work-meta strong{font-size:11px;letter-spacing:.07em}.work-meta div span,.work-meta>span{font-size:9px;color:#6f6a61;opacity:1}
.service-trigger{transition:background .2s ease}.service-trigger:hover{background:rgba(247,243,234,.55)}.service-name{letter-spacing:-.072em}.service-content{padding-bottom:80px}.service-copy p{color:#4f4a43;line-height:1.7}.capability-notes span{padding:14px 0;color:#45413c}
.color-still img,.development-still img{box-shadow:var(--shadow);border:1px solid rgba(10,9,8,.14)}
.creative-section{padding-top:140px;padding-bottom:122px;background:#12110f;color:#eee9df;border-color:#12110f}.creative-top,.creative-bottom{color:#b8b1a6}.creative-statement{color:#f0ebe1;letter-spacing:-.09em}.creative-bottom p{color:#c8c0b5}
.clients{padding-top:84px;padding-bottom:96px}.clients-label{color:#575149}.client-logo-grid{border-color:var(--line)}.client-logo-card{min-height:170px;background:rgba(247,243,234,.38);transition:background .25s ease}.client-logo-card:hover{background:#f8f4eb}.client-logo-card img{opacity:.55;transition:filter .3s ease,opacity .3s ease,transform .35s ease}.client-logo-card:hover img{transform:scale(1.035)}
.contact-layout{padding-top:110px;padding-bottom:122px}.contact-form{gap:26px}.contact-form label{color:#4e4942}.contact-form input,.contact-form textarea,.contact-form select{padding:15px 0 13px;border-bottom-color:rgba(10,9,8,.38);transition:border-color .2s ease}.contact-form input:focus,.contact-form textarea:focus,.contact-form select:focus{border-bottom-color:#0a0908}.submit-button{margin-top:18px;padding:19px 22px;letter-spacing:.08em;font-size:10px;transition:background .25s ease,color .25s ease,transform .2s ease}.submit-button:hover{background:transparent;color:var(--ink);transform:translateY(-1px)}
.footer{padding-top:28px;padding-bottom:28px;border-top-color:var(--line);color:#5c574f}
.project-modal{background:#ece8df;padding-top:96px}.modal-close{right:34px;top:31px;padding:10px 14px;border:1px solid rgba(10,9,8,.28);border-radius:999px;background:rgba(238,234,225,.82);backdrop-filter:blur(12px);transition:background .2s ease,color .2s ease}.modal-close:hover{background:#111;color:#f3eee4}.modal-media{width:min(1240px,calc(100% - 7vw));box-shadow:0 28px 90px rgba(0,0,0,.12)}.modal-meta{width:min(1240px,calc(100% - 7vw));padding-top:42px}.modal-meta h2{letter-spacing:-.075em}.modal-details span{padding:12px 0;border-top-color:rgba(10,9,8,.22)}
.video-fallback{width:min(1240px,calc(100% - 7vw));margin:auto;padding:12px 0;background:transparent;color:#59544c}
@media(max-width:760px){.nav{padding:19px 20px}.hero-content{padding-top:126px;padding-bottom:52px}.hero-bottom{margin-top:62px}.work-intro{padding-top:74px;padding-bottom:50px}.work-palette{height:26px}.work-meta{padding:15px 16px 21px}.creative-section{padding-top:100px;padding-bottom:84px}.clients{padding-top:58px;padding-bottom:64px}.client-logo-card{min-height:126px}.contact-layout{padding-top:76px;padding-bottom:88px}.project-modal{padding-top:82px}.modal-media{width:100%;box-shadow:none}.modal-meta{width:100%;padding:28px 20px 0}.modal-close{right:18px;top:20px}.video-fallback{width:100%;padding:10px 20px}}