@import url('https://fonts.googleapis.com/css2?family=Barlow+Condensed:wght@500;600;700;800;900&family=DM+Sans:wght@400;500;600;700&family=Caveat:wght@600;700&display=swap');
:root{--ink:#101010;--paper:#f7f6f3;--muted:#777;--line:#d4d3d0}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--paper);color:var(--ink);font-family:'DM Sans',Arial,sans-serif}a{color:inherit;text-decoration:none}button,input,textarea,select{font:inherit}button{cursor:pointer}.header{position:sticky;top:0;z-index:30;display:flex;align-items:center;justify-content:space-between;padding:14px 5%;background:rgba(247,246,243,.94);backdrop-filter:blur(12px);border-bottom:1px solid var(--line)}.logo img{width:142px;height:55px;object-fit:contain;mix-blend-mode:multiply}nav{display:flex;gap:26px;align-items:center}nav a{font-size:11px;font-weight:800;letter-spacing:.08em}nav a:hover{text-decoration:underline;text-underline-offset:6px}.nav-cta{border:2px solid var(--ink);padding:13px 16px}.nav-cta:hover{background:var(--ink);color:white}#menu{display:none;background:none;border:0;font-size:28px}.wrap{max-width:1480px;margin:auto;padding:0 5%}.eyebrow{font-size:11px;font-weight:800;letter-spacing:.19em;text-transform:uppercase}.display{font-family:'Barlow Condensed',Impact,sans-serif;font-size:clamp(74px,12.4vw,220px);line-height:.76;letter-spacing:-.035em;font-weight:900;margin:0;text-transform:uppercase}.display.medium{font-size:clamp(65px,10vw,156px)}.display.small{font-size:clamp(58px,8vw,118px)}.script{font-family:'Caveat',cursive;font-size:clamp(27px,4vw,55px);line-height:1;transform:rotate(-4deg);display:inline-block}.lead{font-size:clamp(17px,2vw,26px);line-height:1.45;max-width:740px}.muted{color:var(--muted)}.pill{display:inline-flex;align-items:center;justify-content:center;gap:15px;background:var(--ink);color:white;padding:16px 24px;border:2px solid var(--ink);border-radius:100px;font-size:12px;font-weight:800;letter-spacing:.07em;transition:.2s}.pill:hover{background:transparent;color:var(--ink);transform:translateY(-3px)}.pill.inverse{background:white;color:var(--ink);border-color:white}.pill.inverse:hover{background:transparent;color:white}.hero{min-height:calc(100vh - 84px);padding:6vh 5% 7vh;overflow:hidden}.hero-top{display:flex;justify-content:space-between;align-items:center}.hero-title{margin:7vh 0 20px}.hero-title .second{display:block;text-align:right}.hero-sub{display:flex;justify-content:space-between;align-items:end;gap:24px;margin:25px 0}.hero-media{height:clamp(300px,46vw,650px);position:relative;overflow:hidden;background:#151515}.hero-media video,.hero-media img{width:100%;height:100%;object-fit:cover}.hero-media video{filter:saturate(.75)}.media-sticker{position:absolute;right:24px;top:24px;background:#f7f6f3;padding:14px 20px;transform:rotate(7deg);font-family:'Caveat';font-size:28px}.section{padding:110px 0;border-bottom:1px solid var(--line)}.section-head{display:flex;justify-content:space-between;align-items:end;gap:20px;margin-bottom:48px}.section-title{font:900 clamp(48px,7.6vw,118px)/.87 'Barlow Condensed',Impact,sans-serif;letter-spacing:-.02em;margin:16px 0;text-transform:uppercase}.section-head p{max-width:330px}.intro{display:grid;grid-template-columns:1.1fr .9fr;gap:60px;align-items:center}.intro img{width:100%;height:520px;object-fit:cover}.services-list{border-top:2px solid var(--ink)}.service-row{display:grid;grid-template-columns:80px 1fr 1fr 50px;gap:20px;align-items:center;border-bottom:1px solid var(--line);padding:24px 0;transition:.2s}.service-row:hover{padding-left:16px;background:#eeece7}.service-row h3{font:800 clamp(32px,5vw,75px)/.9 'Barlow Condensed';margin:0}.service-row p{font-size:14px}.service-row .arr{font-size:28px}.work-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px}.work-card{display:block}.work-img{position:relative;overflow:hidden;background:#ddd;aspect-ratio:1.24}.work-img img{width:100%;height:100%;object-fit:cover;transition:transform .55s}.work-card:hover img{transform:scale(1.06)}.work-img:after{content:'GO AHEAD. STARE. ↗';position:absolute;bottom:16px;right:16px;background:white;padding:12px 14px;font-size:11px;font-weight:800;opacity:0;transition:.25s}.work-card:hover .work-img:after{opacity:1}.work-meta{display:flex;justify-content:space-between;gap:12px;margin:12px 0 24px}.work-meta h3{font:800 32px 'Barlow Condensed';margin:0}.work-meta span{font-size:11px;letter-spacing:.1em}.dark{background:var(--ink);color:white}.dark .muted{color:#aaa}.process-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}.step{border:1px solid #777;padding:25px;min-height:240px}.step b{font:900 70px 'Barlow Condensed';display:block}.step h3{font:800 30px 'Barlow Condensed';margin:10px 0}.parent{display:grid;grid-template-columns:1.2fr .8fr;gap:40px;align-items:center}.parent img{width:100%;max-height:300px;object-fit:contain;mix-blend-mode:multiply}.cta-panel{padding:110px 5%;text-align:center}.cta-panel h2{font:900 clamp(65px,11vw,170px)/.8 'Barlow Condensed';margin:0 0 40px}.page-hero{padding:105px 0 70px;border-bottom:1px solid var(--line)}.page-hero .lead{margin-top:30px}.filter-row{display:flex;gap:10px;flex-wrap:wrap;margin:36px 0}.filter{border:1px solid var(--ink);background:transparent;border-radius:100px;padding:11px 18px;font-size:12px;font-weight:700}.filter.active,.filter:hover{background:var(--ink);color:white}.detail-hero{padding:80px 0 30px}.detail-cover{width:100%;max-height:730px;object-fit:cover}.detail-video{width:100%;max-height:760px;background:#111;margin-top:26px}.detail-grid{display:grid;grid-template-columns:1fr 1fr;gap:60px;padding:65px 0}.gallery{display:grid;grid-template-columns:repeat(3,1fr);gap:15px}.gallery img{width:100%;height:400px;object-fit:cover}.service-feature{display:grid;grid-template-columns:1fr 1fr;gap:60px;align-items:center;padding:70px 0;border-bottom:1px solid var(--line)}.service-feature:nth-child(even) img{order:-1}.service-feature img{width:100%;height:460px;object-fit:cover}.service-feature h2{font:900 clamp(52px,7vw,110px)/.86 'Barlow Condensed';margin:20px 0}.contact-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:80px;padding:70px 0}.contact-form{display:grid;gap:17px}.field{display:grid;gap:8px}.field label{font-size:11px;letter-spacing:.1em;font-weight:800}.field input,.field textarea,.field select{width:100%;padding:15px;border:1px solid #aaa;background:white;border-radius:0;color:var(--ink)}.contact-info{background:var(--ink);color:white;padding:40px}.contact-info h3{font:800 38px 'Barlow Condensed';margin:0 0 8px}.contact-info p{line-height:1.6;overflow-wrap:anywhere}.contact-info hr{border:0;border-top:1px solid #555;margin:28px 0}.footer{background:#111;color:white;padding:70px 5% 24px}.footer-top{display:flex;justify-content:space-between;align-items:end;gap:20px;padding-bottom:70px;border-bottom:1px solid #555}.footer-top h2{font:900 clamp(60px,8vw,125px)/.85 'Barlow Condensed';margin:0}.footer-top em{font-family:'Caveat';font-size:.7em}.footer-grid{display:grid;grid-template-columns:2fr 1fr 1.3fr;gap:40px;padding:50px 0}.footer-grid h3{font:900 45px 'Barlow Condensed';margin:0}.footer-grid a{display:block;margin:13px 0}.footer-grid small{color:#aaa;font-weight:800;letter-spacing:.13em}.footer-grid p{color:#aaa;font-size:13px;line-height:1.7}.footnote{display:flex;justify-content:space-between;gap:20px;border-top:1px solid #555;padding-top:20px;color:#aaa;font-size:10px;letter-spacing:.05em}#loader{position:fixed;inset:0;z-index:100;background:var(--ink);color:white;display:flex;align-items:center;justify-content:center;font:900 clamp(30px,5vw,70px) 'Barlow Condensed';text-align:center;transition:opacity .5s}#loader.hide{opacity:0;pointer-events:none}.blink{animation:blink 1s infinite}@keyframes blink{50%{opacity:0}}.tag{display:inline-block;border:1px solid #aaa;border-radius:100px;padding:7px 13px;font-size:11px;font-weight:700;margin:4px}.tiny-note{font-family:'Caveat';font-size:28px;transform:rotate(-5deg)}@media(max-width:850px){nav{display:none;position:absolute;top:83px;left:0;right:0;background:var(--paper);padding:25px 5%;flex-direction:column;align-items:stretch;border-bottom:1px solid var(--line)}nav.open{display:flex}#menu{display:block}.hero{min-height:auto}.hero-title .second{text-align:left}.hero-sub{align-items:start;flex-direction:column}.section{padding:65px 0}.intro,.parent,.contact-grid,.detail-grid,.service-feature{grid-template-columns:1fr;gap:30px}.intro img,.service-feature img{height:360px}.service-feature:nth-child(even) img{order:0}.process-grid{grid-template-columns:repeat(2,1fr)}.step{min-height:190px}.service-row{grid-template-columns:35px 1fr 30px}.service-row p{display:none}.footer-grid{grid-template-columns:1fr 1fr}.footer-grid>div:first-child{grid-column:span 2}.gallery{grid-template-columns:repeat(2,1fr)}.gallery img{height:300px}}@media(max-width:540px){.header{padding:8px 5%}.logo img{width:120px}.hero{padding-top:35px}.hero-title{margin:50px 0 25px}.display{font-size:clamp(64px,16vw,110px)}.hero-media{height:330px}.section-head{display:block}.work-grid{grid-template-columns:1fr}.process-grid{grid-template-columns:1fr 1fr}.step{padding:16px;min-height:160px}.step b{font-size:50px}.step h3{font-size:24px}.footer-top{display:block}.footer-top .pill{margin-top:30px}.footer-grid{grid-template-columns:1fr}.footer-grid>div:first-child{grid-column:span 1}.footnote{display:block}.gallery{grid-template-columns:1fr 1fr}.gallery img{height:230px}.contact-info{padding:25px}}


/* V2 — responsive fit and uncropped creative artwork */
html,body{max-width:100%;overflow-x:clip}
img,video{max-width:100%}
.wrap{width:100%;max-width:1440px;padding-inline:clamp(20px,4vw,64px)}
.header{padding-inline:clamp(20px,4vw,64px)}
.display,.display.medium,.display.small{font-size:clamp(48px,8vw,124px);line-height:1.04;letter-spacing:-.018em;overflow-wrap:normal;word-break:normal}
.hero-title{font-size:clamp(48px,7.9vw,126px);line-height:1.03;margin:45px 0 25px}
.hero-title .second{text-align:left}
.hero{min-height:auto;padding:50px clamp(20px,4vw,64px) 70px}
.hero-media{height:auto;min-height:0;display:flex;align-items:center;justify-content:center;background:#101010;overflow:visible;position:relative;padding:20px}
.hero-media video{display:block;width:auto;height:min(72vh,740px);max-width:100%;object-fit:contain;filter:none;background:#101010}
.hero-media .media-sticker{right:18px;top:18px;z-index:2}
.section{padding:clamp(55px,7vw,95px) 0}
.section-title{font-size:clamp(44px,6vw,90px);line-height:1.06;letter-spacing:-.015em;overflow-wrap:break-word}
.page-hero{padding:clamp(55px,7vw,95px) 0 55px}
.page-hero .display{max-width:100%}
.intro,.service-feature,.parent,.contact-grid,.detail-grid{min-width:0;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(24px,4vw,65px)}
.intro>*,.service-feature>*,.parent>*,.contact-grid>*,.detail-grid>*{min-width:0}
.intro img,.service-feature img,.parent img{width:100%;height:auto;max-height:none;object-fit:contain;display:block;background:#eceae5}
.service-feature{padding:60px 0;align-items:center}
.service-feature h2{font-size:clamp(42px,5.2vw,78px);line-height:1.05;overflow-wrap:break-word}
.service-feature:nth-child(even) img{order:0}
.work-img{aspect-ratio:1.35;background:#eceae5}
.work-img img,.detail-cover,.gallery img{object-fit:contain;background:#eceae5}
.detail-cover{max-height:none;height:auto;display:block}
.gallery img{height:auto;aspect-ratio:1/1}
.detail-video{display:block;width:100%;height:auto;max-height:75vh;object-fit:contain}
.contact-grid{padding-top:65px}
.contact-info{align-self:start}
.footer-top h2,.cta-panel h2{line-height:1.04}
@media(max-width:1000px){nav{gap:15px}nav a{font-size:10px}.service-feature h2{font-size:clamp(38px,5vw,65px)}}
@media(max-width:850px){.intro,.service-feature,.parent,.contact-grid,.detail-grid{grid-template-columns:minmax(0,1fr)}.intro img,.service-feature img{height:auto;max-height:600px}.hero-media video{height:min(68vh,650px)}.service-feature:nth-child(even) img{order:0}.page-hero .display{font-size:clamp(46px,10vw,85px)}}
@media(max-width:540px){.display,.display.medium,.display.small,.hero-title{font-size:clamp(43px,11vw,72px);line-height:1.06}.section-title{font-size:clamp(42px,10vw,66px)}.service-feature h2{font-size:clamp(40px,10vw,62px)}.hero{padding-top:25px}.hero-title{margin-top:28px}.hero-media{padding:12px}.hero-media video{height:min(60vh,520px)}.media-sticker{font-size:17px!important;padding:8px!important}.contact-info{padding:25px}.section{padding:50px 0}.page-hero{padding:45px 0}.script{line-height:1.25}.gallery{grid-template-columns:1fr 1fr}}

/* Final QA: safe text wrapping, contained art and no off-screen grids */
main,main section,main article,main .wrap{min-width:0}
.service-feature>div,.intro>div,.parent>div{min-width:0}
.service-feature h2,.section-title,.display,.cta-panel h2{max-width:100%;text-wrap:balance}
.service-feature img,.intro img,.gallery img,.work-img img,.detail-cover{object-fit:contain;object-position:center}
.hero-media{isolation:isolate}
.hero-media video{object-fit:contain;object-position:center;image-rendering:auto}
@media(max-width:850px){.hero-media video{max-height:650px}.page-hero .display{overflow-wrap:anywhere}}
@media(max-width:540px){.hero-media video{max-height:520px}.service-feature h2{overflow-wrap:anywhere}.work-img{aspect-ratio:auto}.work-img img{display:block;height:auto;max-height:500px}.gallery img{aspect-ratio:auto;height:auto}.page-hero .display{font-size:clamp(42px,10vw,70px)}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;transition-duration:.01ms!important;scroll-behavior:auto!important}}

/* Final revision: supplied identity video, actual Omni Arts parent logo, unnumbered editorial sections */
.parent-brand-logo{display:block;width:min(100%,390px)!important;height:auto!important;max-height:340px!important;object-fit:contain!important;justify-self:center;background:transparent!important;mix-blend-mode:normal!important}
.process-video{display:flex;align-items:center;justify-content:center;min-width:0;width:100%;background:#111;overflow:hidden;border-radius:2px;padding:14px}
.process-video video{width:auto!important;height:auto!important;max-width:100%!important;max-height:520px!important;object-fit:contain!important;display:block}
.hero-media{display:flex;align-items:center;justify-content:center;background:#111;min-height:400px}
.hero-media video{width:auto!important;height:100%!important;max-width:100%!important;max-height:100%!important;object-fit:contain!important}
.step{min-height:175px}.step h3{margin-top:0}
@media(max-width:850px){.process-video video{max-height:420px!important}.hero-media{min-height:300px}}
@media(max-width:540px){.hero-media{height:400px!important;min-height:0}.process-video video{max-height:370px!important}.parent-brand-logo{max-width:240px!important}}

/* FINAL VISUAL CORRECTIONS */
.services-list .service-row{display:grid!important;grid-template-columns:minmax(230px, .95fr) minmax(250px,1.1fr) 44px!important;align-items:center!important;column-gap:clamp(18px,3vw,55px)!important;padding:28px clamp(12px,2vw,28px)!important;min-height:130px}
.services-list .service-row h3{font-size:clamp(35px,4.1vw,67px)!important;line-height:1.02!important;overflow-wrap:normal!important;max-width:100%}
.services-list .service-row p{font-size:clamp(13px,1.25vw,17px)!important;line-height:1.45!important;margin:0!important;display:block!important;min-width:0}
.services-list .service-row .arr{justify-self:end}
.parent-brand-logo{background:transparent!important;max-width:290px!important;max-height:340px!important;width:100%!important;height:auto!important;object-fit:contain!important;justify-self:center!important}
.parent{grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr)!important;gap:clamp(24px,5vw,80px)!important}
.parent>img{background:transparent!important;mix-blend-mode:normal!important;align-self:center!important}
.hero-media{padding:0!important;min-height:0!important;height:auto!important;aspect-ratio:16/9!important;overflow:hidden!important;background:#0c0c0c!important}
.hero-media video{width:100%!important;height:100%!important;max-width:100%!important;max-height:100%!important;object-fit:contain!important}
.process-video{background:#111!important}
@media(max-width:850px){.services-list .service-row{grid-template-columns:minmax(0,1fr) minmax(0,1fr) 28px!important;gap:14px!important}.services-list .service-row h3{font-size:clamp(32px,5vw,54px)!important}.parent{grid-template-columns:1fr!important}.parent-brand-logo{max-width:240px!important}}
@media(max-width:540px){.services-list .service-row{grid-template-columns:minmax(0,1fr) 30px!important;row-gap:8px!important;padding:20px 8px!important}.services-list .service-row h3{grid-column:1!important;font-size:clamp(33px,9vw,52px)!important}.services-list .service-row p{grid-column:1!important;grid-row:2!important;font-size:13px!important}.services-list .service-row .arr{grid-column:2!important;grid-row:1/3!important}.hero-media{aspect-ratio:16/9!important;height:auto!important}.hero-media video{height:100%!important}.parent-brand-logo{max-width:200px!important}}

/* Final independent speculative portfolio labeling */
.speculative-label{font-size:clamp(15px,1.5vw,22px);font-weight:600;letter-spacing:.015em;margin:22px 0 0;line-height:1.4}
.page-hero .lead{font-weight:600}

/* THE UNBRIEF: monochrome portfolio images that reveal their true colours on interaction. */
.work-card .work-img img { filter: grayscale(100%); transition: filter .45s ease, transform .55s ease; }
@media (hover: hover) and (pointer: fine) {
  .work-card:hover .work-img img, .work-card:focus-visible .work-img img { filter: grayscale(0%); }
}
@media (hover: none), (pointer: coarse) {
  .work-card.is-colour-revealed .work-img img, .work-card:focus-visible .work-img img { filter: grayscale(0%); }
}
@media (prefers-reduced-motion: reduce) { .work-card .work-img img { transition: none; } }

/* Launch refinements: clarity, accessible forms, project narratives */
.case-summary{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:26px;margin:44px 0;padding:28px 0;border-top:1px solid #aaa;border-bottom:1px solid #aaa}.case-summary p{font-size:16px;line-height:1.55}.speculative-disclaimer{font-size:13px;line-height:1.6;opacity:.75;margin:22px 0 38px}.bot-field{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}.form-status{font-size:14px;line-height:1.5;margin-top:12px}.form-status.sent{font-weight:700}.contact-form button:disabled{opacity:.55;cursor:wait}.hero-sub .lead{max-width:660px}.work-card:focus-visible{outline:3px solid currentColor;outline-offset:5px}@media(max-width:750px){.case-summary{grid-template-columns:1fr;gap:14px}.case-summary p{margin:8px 0}}


/* FINAL FIX: grayscale ALL content images, colour on hover/focus/touch.
   Excludes logos in the navigation and footer. */
#app img {
  -webkit-filter: grayscale(1) !important;
  filter: grayscale(1) !important;
  transition: -webkit-filter .45s ease, filter .45s ease, transform .45s ease !important;
}
@media (hover: hover) and (pointer: fine) {
  #app img:hover,
  #app a:hover img,
  #app .service-feature:hover img,
  #app .intro:hover img,
  #app img:focus-visible {
    -webkit-filter: grayscale(0) !important;
    filter: grayscale(0) !important;
  }
}
#app .work-card.is-colour-revealed img,
#app img.is-colour-revealed {
  -webkit-filter: grayscale(0) !important;
  filter: grayscale(0) !important;
}
@media (prefers-reduced-motion: reduce) {
  #app img { transition: none !important; }
}