@font-face {
  font-family: 'Roboto';
  font-style: italic;
  font-weight: 100;
  font-stretch: normal;
  font-display: swap;
  src: url(assets/roboto-0.ttf) format('truetype');
}
@font-face {
  font-family: 'Roboto';
  font-style: italic;
  font-weight: 200;
  font-stretch: normal;
  font-display: swap;
  src: url(assets/roboto-1.ttf) format('truetype');
}
@font-face {
  font-family: 'Roboto';
  font-style: italic;
  font-weight: 300;
  font-stretch: normal;
  font-display: swap;
  src: url(assets/roboto-2.ttf) format('truetype');
}
@font-face {
  font-family: 'Roboto';
  font-style: italic;
  font-weight: 400;
  font-stretch: normal;
  font-display: swap;
  src: url(assets/roboto-3.ttf) format('truetype');
}
@font-face {
  font-family: 'Roboto';
  font-style: italic;
  font-weight: 500;
  font-stretch: normal;
  font-display: swap;
  src: url(assets/roboto-4.ttf) format('truetype');
}
@font-face {
  font-family: 'Roboto';
  font-style: italic;
  font-weight: 600;
  font-stretch: normal;
  font-display: swap;
  src: url(assets/roboto-5.ttf) format('truetype');
}
@font-face {
  font-family: 'Roboto';
  font-style: italic;
  font-weight: 700;
  font-stretch: normal;
  font-display: swap;
  src: url(assets/roboto-6.ttf) format('truetype');
}
@font-face {
  font-family: 'Roboto';
  font-style: italic;
  font-weight: 800;
  font-stretch: normal;
  font-display: swap;
  src: url(assets/roboto-7.ttf) format('truetype');
}
@font-face {
  font-family: 'Roboto';
  font-style: italic;
  font-weight: 900;
  font-stretch: normal;
  font-display: swap;
  src: url(assets/roboto-8.ttf) format('truetype');
}
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 100;
  font-stretch: normal;
  font-display: swap;
  src: url(assets/roboto-9.ttf) format('truetype');
}
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 200;
  font-stretch: normal;
  font-display: swap;
  src: url(assets/roboto-10.ttf) format('truetype');
}
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 300;
  font-stretch: normal;
  font-display: swap;
  src: url(assets/roboto-11.ttf) format('truetype');
}
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 400;
  font-stretch: normal;
  font-display: swap;
  src: url(assets/roboto-12.ttf) format('truetype');
}
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 500;
  font-stretch: normal;
  font-display: swap;
  src: url(assets/roboto-13.ttf) format('truetype');
}
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 600;
  font-stretch: normal;
  font-display: swap;
  src: url(assets/roboto-14.ttf) format('truetype');
}
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 700;
  font-stretch: normal;
  font-display: swap;
  src: url(assets/roboto-15.ttf) format('truetype');
}
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 800;
  font-stretch: normal;
  font-display: swap;
  src: url(assets/roboto-16.ttf) format('truetype');
}
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 900;
  font-stretch: normal;
  font-display: swap;
  src: url(assets/roboto-17.ttf) format('truetype');
}

:root{--ink:#190d0b;--paper:#fcfaf8;--muted:#898482;--line:#ded9d5}*{box-sizing:border-box}body{margin:0;background:var(--paper);color:var(--ink);font-family:Roboto,Arial,sans-serif}a{color:inherit;text-decoration:none}button{font:inherit}header{height:110px;display:flex;align-items:center;justify-content:space-between;padding:0 5vw;border-bottom:1px solid var(--line)}.wordmark{font-size:27px;font-weight:900;letter-spacing:-3px}.wordmark span{font-size:10px;vertical-align:top;letter-spacing:0}nav{display:flex;gap:56px;font-size:19px}nav a{color:var(--muted)}nav a.active,nav a:hover{color:var(--ink)}.location,.eyebrow{font-size:11px;letter-spacing:1.5px}.hero{padding:75px 7vw 55px;min-height:calc(100vh - 165px)}.intro{display:flex;align-items:center;gap:5vw}.intro h1{font-size:clamp(45px,7.6vw,120px);letter-spacing:-.07em;line-height:1;margin:0;font-weight:900}.intro img{width:150px;height:100px;object-fit:cover;transform:none}.hero-role{font-size:clamp(48px,8.9vw,140px);font-weight:900;letter-spacing:-.065em;line-height:.98;font-style:italic;margin:65px 0 45px}.hero-role span{display:block}.hero-role span:nth-child(2){text-align:right}.hero-role span:nth-child(3){text-align:center}.hero-bottom{display:flex;justify-content:space-between;align-items:end;gap:25px}.hero-bottom p{max-width:410px;font-size:17px;line-height:1.5;margin:0}.text-link{border-bottom:1px solid;padding-bottom:8px;white-space:nowrap}.work{padding:55px 8vw 80px;min-height:75vh}.section-top{display:flex;justify-content:space-between;margin-bottom:30px}.work-list{display:flex;flex-direction:column;align-items:start}.work-link{font-size:clamp(45px,7.4vw,108px);font-weight:800;letter-spacing:-.06em;line-height:1.02;position:relative;transition:color .15s}.work-list:has(.work-link:hover) .work-link{color:var(--muted)}.work-list .work-link:hover{color:var(--ink)}.work-link span{display:inline-block;font-size:15px;font-weight:400;letter-spacing:0;vertical-align:middle;margin-left:25px;opacity:0;transform:translateX(-10px);transition:.2s}.work-link:hover span,.work-link:focus-visible span{opacity:1;transform:none}.case{max-width:1050px;margin:auto;padding:45px 45px 80px}.case-toolbar{display:flex;justify-content:space-between;font-size:13px;color:var(--muted);margin-bottom:38px}.case h1{font-size:clamp(55px,8vw,100px);letter-spacing:-.065em;line-height:1;margin:0}.case-heading{display:flex;justify-content:space-between;align-items:start;gap:25px}.status{border:1px solid var(--line);border-radius:30px;padding:9px 14px;font-size:12px;white-space:nowrap}.lead{font-size:clamp(22px,3vw,32px);line-height:1.24;max-width:760px;margin:27px 0}.meta{display:flex;gap:55px;border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:20px 0;margin:30px 0 40px;font-size:13px}.meta label{display:block;color:var(--muted);margin-bottom:8px}.copy{max-width:680px;font-size:19px;line-height:1.5;margin:45px 0}.copy h2{font-size:13px;text-transform:uppercase;letter-spacing:1px;margin-bottom:16px}.gallery{display:grid;grid-template-columns:1fr 1fr;gap:18px}.gallery img{display:block;width:100%;height:auto}.gallery .wide{grid-column:1/-1}.media-slot{min-height:310px;background:#eeeae6;padding:35px;display:flex;flex-direction:column;justify-content:space-between;grid-column:1/-1}.media-slot .mark{font-size:55px}.media-slot p{color:#756f6a;max-width:410px;line-height:1.5}.draft{font-size:12px;color:var(--muted);margin-top:20px}.case-next{display:flex;justify-content:space-between;border-top:1px solid var(--line);padding-top:30px;margin-top:70px;font-size:23px}.contact{padding:85px 8vw;min-height:70vh}.contact h1{font-size:clamp(60px,10vw,150px);line-height:.95;letter-spacing:-.07em;margin:0 0 45px}.contact p{font-size:22px;max-width:650px;line-height:1.5}.contact .pending{font-size:14px;color:var(--muted);margin-top:40px}footer{display:flex;justify-content:space-between;border-top:1px solid var(--line);padding:25px 5vw;font-size:12px;color:var(--muted)}a:focus-visible{outline:2px solid var(--ink);outline-offset:5px}@media(max-width:700px){header{height:85px;padding:0 6vw}.location{display:none}nav{gap:22px;font-size:15px}.hero{padding:55px 6vw;min-height:auto}.intro{gap:20px}.intro img{width:82px;height:68px}.intro h1{font-size:10vw}.hero-role{font-size:12vw;margin:65px 0}.hero-role span:nth-child(2){text-align:left;margin-left:4vw}.hero-bottom{align-items:start;flex-direction:column}.hero-bottom p{font-size:15px}.work{padding:40px 6vw 65px}.work-link{font-size:11.4vw;line-height:1.12}.work-link span{display:none}.case{padding:30px 6vw 60px}.case-toolbar{margin-bottom:30px}.case-heading{flex-direction:column;gap:16px}.case h1{font-size:16vw}.lead{font-size:25px}.meta{gap:20px;justify-content:space-between;font-size:11px}.gallery{gap:10px}.copy{font-size:17px}.media-slot{min-height:230px;padding:25px}.case-next{font-size:17px}.contact{padding:60px 6vw}.contact h1{font-size:17vw}.contact p{font-size:19px}}
@media(prefers-reduced-motion:reduce){*{transition:none!important}}

header{position:relative;justify-content:center}header .location{position:absolute;right:5vw}

/* Reference layout: Roboto ExtraBold, natural tracking, staggered lines. */
.hero{padding:90px 3.5vw 65px}.intro{gap:4.5vw}.intro h1{font-size:min(8.5vw,120px);font-weight:800;letter-spacing:0;line-height:.91;white-space:nowrap}.intro img{width:15vw;max-width:212px;height:auto;aspect-ratio:1.55;object-fit:cover;flex-shrink:0}.hero-role{font-size:min(8.5vw,120px);font-weight:800;letter-spacing:0;line-height:.91;margin:110px 0 100px;display:flex;flex-direction:column;gap:30px}.hero-role span:nth-child(2){text-align:left;margin-left:32%}.hero-role span:nth-child(3){text-align:left;margin-left:12%}.hero-bottom{padding:0 0 0 0}.work-list:has(.work-link:hover) .work-link:hover,.work-list:has(.work-link:focus-visible) .work-link:focus-visible{color:var(--ink)}.work-list:has(.work-link:focus-visible) .work-link:not(:focus-visible){color:var(--muted)}.case-tags{display:flex;gap:8px;flex-wrap:wrap;justify-content:flex-end}.case-heading{align-items:center}.case .lead{margin-bottom:50px}.contact-links{display:flex;gap:35px;margin-top:45px;font-size:21px}.contact-links span{border-bottom:1px solid var(--line);padding-bottom:10px;color:var(--muted)}
@media(max-width:900px) and (min-width:701px){header .location{display:none}.hero{padding-top:75px}.hero-role{margin-top:90px;gap:24px}}
@media(max-width:700px){.hero{padding:55px 6vw}.intro h1{font-size:8.5vw}.intro{gap:4vw}.intro img{width:18vw}.hero-role{font-size:10.4vw;margin:75px 0 65px;gap:22px}.hero-role span:nth-child(2){margin-left:12%}.hero-role span:nth-child(3){margin-left:5%}.case-tags{justify-content:flex-start}.case-heading{align-items:start}.contact-links{gap:23px;font-size:18px;flex-wrap:wrap}}

@media(min-width:1280px){.intro h1,.hero-role{font-size:120px}}
.case-copy{margin:48px 0;font-size:19px;line-height:1.55;max-width:780px}.case-copy h2{font-size:17px;letter-spacing:0;line-height:1.35;margin:0 0 18px}.case-copy p{margin:0 0 20px}.case-copy ul{padding-left:22px}.case-copy li{margin:8px 0}.case-gallery{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px;margin:35px 0 55px;align-items:start}.case-gallery figure{margin:0;min-width:0}.case-gallery figure.wide,.case-gallery.cols-1 figure{grid-column:1/-1}.case-gallery img{display:block;width:100%;height:auto;background:#eeeae6}.case-gallery.cols-1{grid-template-columns:1fr}.inline-link{text-decoration:underline;text-underline-offset:5px}.subcase-link{display:block;padding:35px 0;margin:60px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}.subcase-link span{font-size:11px;letter-spacing:1.5px}.subcase-link strong{display:block;font-size:clamp(32px,5vw,60px);letter-spacing:-.03em;margin-top:20px}.subcase-link p{font-size:18px;line-height:1.4}.metrics{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:40px 35px;margin:50px 0 65px}.metrics strong{display:block;font-size:clamp(46px,6vw,80px);font-weight:800;line-height:1.1;letter-spacing:-.03em}.metrics span{display:block;font-size:16px;line-height:1.45;max-width:310px;margin-top:12px;color:#6e6865}.case-copy .metrics strong{font-size:70px}.table-wrap{overflow-x:auto}table{border-collapse:collapse;width:100%;font-size:16px;line-height:1.5}th,td{text-align:left;border:1px solid var(--line);padding:18px;vertical-align:top}thead{background:#f0ece8}.video-embed{position:relative;aspect-ratio:16/9;margin:25px 0 15px;background:#eeeae6}.video-embed iframe{width:100%;height:100%;border:0}.instagram-embed{max-width:480px;margin:25px 0 15px;background:#eeeae6}.instagram-embed iframe{width:100%;height:730px;border:0}.media-fallback{display:inline-block;margin:10px 0 30px;font-size:16px}.case-heading h1{overflow-wrap:anywhere}.case-tags{flex-shrink:0;max-width:270px}
@media(max-width:700px){.case-copy{font-size:17px;margin:35px 0}.case-copy h2{font-size:16px}.case-gallery{gap:12px;margin:25px 0 40px}.metrics{gap:30px 20px}.metrics strong{font-size:45px}.metrics span{font-size:14px}.case-copy .metrics strong{font-size:55px}th,td{padding:12px;font-size:14px}.case-tags{max-width:100%}.instagram-embed iframe{height:650px}}

.status-launched{background:#AAFF00;border-color:#AAFF00;color:var(--ink)}

.about-page{padding:45px 6vw 90px;min-height:75vh}.about-back{font-size:13px;color:var(--muted)}.about-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:6vw;align-items:start;margin-top:60px}.about-grid>img{width:100%;height:auto;display:block}.about-grid h1{font-size:clamp(38px,5vw,72px);line-height:1.05;letter-spacing:-.035em;margin:20px 0}.about-role{font-size:21px}.about-grid p{font-size:18px;line-height:1.6;max-width:540px}.about-grid .text-link{display:inline-block;margin-top:20px}@media(max-width:700px){.about-grid{grid-template-columns:1fr;gap:35px;margin-top:35px}.about-page{padding:30px 6vw 65px}.about-grid h1{font-size:44px}}

header{z-index:20;background:var(--paper)}.hero .home-draggable,footer .home-draggable{position:relative;cursor:grab;touch-action:none;user-select:none;-webkit-user-select:none;will-change:transform}.home-draggable.is-dragging{cursor:grabbing;z-index:10}.hero .intro h1,.hero-role>span{width:fit-content}.home-draggable:focus-visible{outline:1px dashed var(--muted);outline-offset:8px}.hero-role>span{max-width:100%}.reset-layout{display:block;margin-top:40px;border:0;border-bottom:1px solid var(--muted);padding:8px 0;background:transparent;color:var(--muted);font-size:13px;cursor:pointer}.reset-layout[hidden]{display:none}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}

.play-panel{position:fixed;right:28px;bottom:25px;z-index:40;font-family:Roboto,Arial,sans-serif}.play-caption{font-size:13px;line-height:1.45;margin:0 8px 12px;text-align:right;color:#756e69}.play-tools{display:flex;align-items:center;gap:4px;padding:6px;background:var(--paper);border:1px solid #d8d1ca;border-radius:999px;box-shadow:0 4px 22px #190d0b0b}.play-tools button{border:0;border-radius:999px;background:transparent;color:var(--ink);padding:10px 15px;cursor:pointer;font-size:14px;white-space:nowrap}.play-tools button span{font-size:18px;margin-right:4px}.play-tools button[aria-pressed="true"]{background:#AAFF00}.play-tools button:hover{background:#eee9e3}.play-tools button[aria-pressed="true"]:hover{background:#9fed00}.play-tools button:focus-visible{outline:2px solid var(--ink);outline-offset:2px}.intro{position:relative}.photo-drag-hint{position:absolute;font-size:14px;font-style:italic;white-space:nowrap;color:#756e69;pointer-events:none;line-height:1.4}.photo-drag-hint>span{font-size:24px;vertical-align:middle;margin-right:3px}.photo-drag-hint[hidden],.play-caption[hidden]{display:none}.doodle-canvas{position:fixed;inset:0;width:100vw;height:100vh;pointer-events:none;z-index:15}.doodle-canvas.drawing{pointer-events:auto;touch-action:none;cursor:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24'%3E%3Cpath d='m4 20 2-6L17 3l4 4L10 18z' fill='%23AAFF00' stroke='%23190d0b' stroke-width='1.5'/%3E%3Cpath d='m4 20 5-1-4-4z' fill='%23190d0b'/%3E%3C/svg%3E") 4 20,crosshair}.hero{padding-bottom:115px}@media(max-width:700px){.play-panel{right:12px;bottom:14px}.play-tools button{padding:9px 13px;font-size:13px}.play-caption{font-size:12px}.photo-drag-hint{font-size:11px;white-space:normal;width:105px}.photo-drag-hint>span{font-size:19px}}

.hero-word{display:inline-block;white-space:nowrap}.hero .hero-role>span{overflow:visible}.hero .hero-bottom .hero-word{border:0}
.hero .hero-role .hero-word{display:inline-block;margin:0;text-align:inherit}

.hero-bottom{justify-content:flex-end}

.play-panel{left:28px;right:auto}.play-caption{position:fixed;top:125px;left:50%;transform:translateX(-50%);z-index:40;background:#AAFF00;color:var(--ink);border-radius:999px;padding:12px 22px;margin:0;text-align:center;font-size:14px;box-shadow:0 4px 20px #190d0b0b;pointer-events:none;animation:drag-tip-popup 4s ease both}.play-caption[hidden]{display:none}@keyframes drag-tip-popup{0%{opacity:0;transform:translate(-50%,-8px)}8%,75%{opacity:1;transform:translate(-50%,0)}100%{opacity:0;transform:translate(-50%,-5px)}}@media(max-width:700px){.play-panel{left:12px;right:auto}.play-caption{top:100px;padding:10px 18px;font-size:13px}}@media(prefers-reduced-motion:reduce){.play-caption{animation:none}}

.about-brands{margin:30px 0}.about-brands h2{font-size:12px;font-weight:400;letter-spacing:1px;margin:0 0 14px;color:var(--muted)}.about-brands ul{display:flex;flex-wrap:wrap;gap:9px;list-style:none;padding:0;margin:0}.about-brands li{background:#AAFF00;color:var(--ink);font-size:16px;padding:9px 14px;border-radius:999px;line-height:1.2}

.contact-final{padding:70px 6vw 90px}.contact-final h1{font-size:clamp(42px,6.2vw,94px);line-height:1.04;letter-spacing:-.045em;margin:0 0 38px}.contact-final .contact-intro p{font-size:20px;max-width:850px;line-height:1.5;margin:0 0 10px}.contact-grid{display:grid;grid-template-columns:1.3fr 1fr 1fr;gap:36px;margin-top:65px}.contact-grid h2{font-size:14px;font-weight:400;color:var(--muted);margin:0 0 20px}.contact-primary,.social-links a{font-size:clamp(16px,1.55vw,24px);line-height:1.5;text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:7px;overflow-wrap:anywhere}.social-links{display:flex;flex-direction:column;align-items:start;gap:18px}.contact-grid a:hover{background:#AAFF00}.contact-grid .messengers{font-size:14px;color:var(--muted);line-height:1.6;margin:18px 0 0}.messengers span{margin:0 5px}@media(max-width:900px){.contact-grid{grid-template-columns:1fr 1fr;gap:40px}.contact-primary,.social-links a{font-size:19px}}@media(max-width:600px){.contact-final{padding:50px 6vw 65px}.contact-final h1{font-size:11vw}.contact-final .contact-intro p{font-size:17px}.contact-grid{grid-template-columns:1fr;margin-top:45px;gap:35px}.contact-grid h2{margin-bottom:12px}.social-links{flex-direction:row;gap:28px}.contact-primary{font-size:18px}}

.contact-grid .contact-button{display:inline-flex;align-items:center;gap:10px;padding:13px 22px;border:1px solid var(--ink);border-radius:999px;text-decoration:none;line-height:1.2;font-size:19px;transition:background .15s,border-color .15s}.contact-grid .contact-button:hover,.contact-grid .contact-button:focus-visible{background:#AAFF00;border-color:#AAFF00}header nav a{border-radius:4px;box-shadow:none;transition:background .15s,color .15s}header nav a:hover,header nav a:focus-visible{color:var(--ink);background:#AAFF00;box-shadow:6px 0 #AAFF00,-6px 0 #AAFF00}
/* Shared interaction color for every site link and button. */
a:hover,a:focus-visible,button:hover,button:focus-visible{background-color:#AAFF00!important;color:var(--ink)!important}

.status-unreleased{background:#00DFFF;border-color:#00DFFF;color:var(--ink)}.status-concept{background:#FF5CCF;border-color:#FF5CCF;color:var(--ink)}

header{height:80px}nav{gap:38px;font-size:17px}.hero .hero-role>span{position:relative}.hero .play-caption{position:absolute;top:-37px;left:0;transform:none;z-index:12;padding:8px 15px;font-size:13px;line-height:1.2;white-space:nowrap;opacity:0;animation:none}.hero .play-caption.hint-visible{animation:word-hint 4s ease both}@keyframes word-hint{0%{opacity:0}10%,75%{opacity:1}100%{opacity:0}}.play-tools button span{font-family:Roboto,Arial,sans-serif;font-variant-emoji:text}a,button{font-variant-emoji:text}@media(max-width:900px){header .location{display:none}}@media(max-width:700px){header{height:64px;padding:0 5vw}nav{gap:20px;font-size:15px}.hero .play-caption{top:-30px;font-size:11px;padding:6px 12px}}@media(prefers-reduced-motion:reduce){.hero .play-caption.hint-visible{animation:none;opacity:1}}

.play-tools button:disabled{opacity:.45;cursor:default}.play-tools button:disabled:hover{background:transparent!important}.share-doodle-dialog{border:1px solid var(--line);border-radius:18px;background:var(--paper);color:var(--ink);padding:32px;width:min(560px,calc(100vw - 28px));max-height:90vh;overflow:auto}.share-doodle-dialog::backdrop{background:#190d0b66}.share-doodle-dialog h2{font-size:32px;letter-spacing:-.03em;margin:0 0 20px}.share-doodle-dialog p{font-size:16px;line-height:1.5}.share-doodle-dialog .share-detail{font-size:13px;color:#756e69}.dialog-close{position:absolute;right:17px;top:13px;border:0;background:none;font-size:27px;cursor:pointer}.doodle-preview,.doodle-card img{background-color:#282322;border-radius:8px}.doodle-preview img{display:block;width:100%;height:200px;object-fit:contain}.share-actions{display:flex;justify-content:space-between;gap:12px;margin-top:24px}.share-actions button,.gallery-more{border:1px solid var(--line);background:transparent;border-radius:999px;padding:12px 18px;cursor:pointer;font-size:14px}.share-actions [data-confirm]{background:#AAFF00;border-color:#AAFF00}.share-feedback{min-height:24px}.doodle-gallery-page{padding:60px 6vw 90px;min-height:75vh}.doodle-gallery-page h1{font-size:clamp(38px,6vw,80px);letter-spacing:-.04em;line-height:1.05}.gallery-notice{font-size:16px;color:var(--muted)}.doodle-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:25px;margin:35px 0}.doodle-card{min-width:0}.doodle-card img{display:block;width:100%;height:220px;object-fit:contain}.doodle-card p{font-size:12px;color:var(--muted)}.doodle-card a{font-size:13px}footer{gap:20px;flex-wrap:wrap}@media(max-width:700px){.play-panel{max-width:calc(100vw - 24px)}.play-tools{gap:0;padding:4px}.play-tools button{font-size:11px;padding:9px 9px}.play-tools button span{font-size:15px;margin-right:2px}.doodle-grid{grid-template-columns:1fr 1fr}.share-doodle-dialog{padding:25px}.share-actions{flex-wrap:wrap}.doodle-card img{height:160px}}

.about-photo-column>img{width:100%;height:auto;display:block}.about-photo-column .about-brands{margin:28px 0 0}

@media(prefers-reduced-motion:no-preference){.case-gallery figure.image-focus-ready{position:relative;z-index:0}.case-gallery figure.image-focus-ready img{transform:scale(.955);opacity:.76;transition:transform .55s cubic-bezier(.2,.65,.3,1),opacity .55s ease;transform-origin:center}.case-gallery figure.image-in-focus{z-index:1}.case-gallery figure.image-in-focus img{transform:scale(1.015);opacity:1}}

.case .case-copy h2{background:#AAFF00;color:var(--ink);width:fit-content;max-width:100%;padding:5px 10px;border-radius:3px;line-height:1.35}@media(prefers-reduced-motion:no-preference){.case .copy-reveal{opacity:0;transform:translateY(16px);transition:opacity .6s ease,transform .6s cubic-bezier(.2,.65,.3,1)}.case .copy-reveal.copy-visible{opacity:1;transform:translateY(0)}}

.about-page-links{display:flex;align-items:center;justify-content:space-between;gap:20px}.about-brands li{position:relative;transform:translateY(0) rotate(0);box-shadow:0 0 0 #190d0b00;transition:transform .25s ease,box-shadow .25s ease;cursor:default}.about-brands li:nth-child(even){--tag-tilt:3deg}.about-brands li:nth-child(odd){--tag-tilt:-3deg}@media(hover:hover) and (prefers-reduced-motion:no-preference){.about-brands li:hover{transform:translateY(-6px) rotate(var(--tag-tilt)) scale(1.06);box-shadow:0 9px 17px #190d0b20;z-index:2}}@media(prefers-reduced-motion:reduce){.about-brands li{transition:none}}
.about-brands li{background:rgba(170,255,0,.22);color:#777366;transition:transform .25s ease,box-shadow .25s ease,background-color .25s ease,color .25s ease}.about-brands li:hover{background:#AAFF00;color:var(--ink)}.about-grid>div:last-child>p{border-radius:4px;transition:background-color .25s ease,box-shadow .25s ease,transform .25s ease}@media(hover:hover){.about-grid>div:last-child>p:hover{background:rgba(170,255,0,.24);box-shadow:8px 0 rgba(170,255,0,.24),-8px 0 rgba(170,255,0,.24);transform:translateX(4px)}}@media(prefers-reduced-motion:reduce){.about-brands li,.about-grid>div:last-child>p{transition:none}.about-grid>div:last-child>p:hover{transform:none}}
.work-list .work-link:hover,.work-list .work-link:focus-visible{background-color:#AAFF00!important;color:var(--ink)!important}.work-list .work-link{transition:color .2s ease,transform .25s ease}.case .case-copy p,.case .case-copy li,.case .lead{transition:transform .25s ease}@media(hover:hover) and (prefers-reduced-motion:no-preference){.work-list .work-link:hover{transform:translateX(5px)}.case .case-copy p:hover,.case .case-copy li:hover,.case .lead:hover{transform:translateX(3px)}}@media(prefers-reduced-motion:reduce){.work-list .work-link,.case .case-copy p,.case .case-copy li,.case .lead{transition:none}}

/* AI-ish: a horizontal, three-chapter story. */
.ai-intro{max-width:790px}.ai-story{margin:65px 0 75px}.ai-story-nav{display:flex;justify-content:space-between;align-items:center;margin-bottom:22px;gap:20px}.ai-story-nav>div{display:flex;gap:10px}.ai-story-nav button{border:1px solid var(--ink);background:transparent;border-radius:50%;width:44px;height:44px;font-size:23px;cursor:pointer}.ai-story-nav button:disabled{opacity:.25;cursor:default;background:transparent!important}.ai-story-track{display:flex;gap:28px;overflow-x:auto;scroll-snap-type:x mandatory;overscroll-behavior-x:contain;padding:0 0 22px;scrollbar-color:var(--ink) #e7e3df;scrollbar-width:thin;position:relative}.ai-chapter{flex:0 0 92%;scroll-snap-align:start;display:grid;grid-template-columns:100px 1fr;gap:30px;padding:38px;background:#f0ede9;border-radius:3px;align-content:start;min-width:0}.ai-chapter-number{font-size:76px;font-weight:800;line-height:1;color:#bcb5af;letter-spacing:-.06em}.ai-chapter h2{font-size:clamp(25px,3vw,39px);line-height:1.12;letter-spacing:-.025em;margin:0 0 28px;max-width:530px}.ai-chapter p{font-size:18px;line-height:1.6;max-width:620px;margin:0 0 20px}.ai-chapter p:last-child{margin-bottom:0}.ai-outro{max-width:790px}.ai-story-track:focus-visible{outline:2px solid var(--ink);outline-offset:5px}@media(max-width:700px){.ai-story{margin:40px 0 50px}.ai-chapter{flex-basis:94%;grid-template-columns:1fr;gap:22px;padding:25px}.ai-chapter-number{font-size:54px}.ai-chapter h2{font-size:28px;margin-bottom:20px}.ai-chapter p{font-size:16px}.ai-story-track{gap:16px}.ai-story-nav .eyebrow{font-size:11px}}@media(hover:hover) and (prefers-reduced-motion:no-preference){.ai-chapter p{transition:transform .25s}.ai-chapter p:hover{transform:translateX(3px)}}

.ai-chapter{background:rgba(170,255,0,.13);align-self:stretch}.ai-chapter-number{color:rgba(71,104,0,.38)}.ai-story-track{align-items:stretch}.case .ai-intro h2,.case .ai-outro h2{background:transparent;padding:0;border-radius:0;font-size:clamp(28px,4vw,46px);font-weight:800;line-height:1.12;letter-spacing:-.03em;margin-bottom:25px}.ai-chapter h2{min-height:2.24em}.case .ai-outro .ai-statement{font-size:clamp(25px,3.5vw,38px);line-height:1.2;font-weight:700;letter-spacing:-.02em;margin:28px 0}.ai-outro>p:last-child{max-width:680px}@media(max-width:700px){.ai-chapter h2{min-height:3.36em}.case .ai-outro .ai-statement{font-size:27px}}

/* The creative-direction statement gets its own bright, tactile note. */
.case .ai-outro .ai-statement{position:relative;isolation:isolate;background:#AAFF00;color:var(--ink);padding:30px 36px 34px;margin:38px 0 46px;max-width:720px;font-size:clamp(28px,3.7vw,43px);font-weight:800;line-height:1.13;letter-spacing:-.025em;transform:rotate(-1.2deg);border-radius:3px 3px 24px 3px;box-shadow:5px 7px 0 rgba(25,13,11,.12)}.case .ai-outro .ai-statement::after{content:'';position:absolute;right:0;bottom:0;width:23px;height:23px;background:linear-gradient(135deg,rgba(25,13,11,.18) 49%,var(--paper) 51%);border-radius:3px 0 0 0;pointer-events:none}@media(hover:hover) and (prefers-reduced-motion:no-preference){.case .ai-outro .ai-statement:hover{transform:rotate(0deg) translateY(-3px)}}@media(max-width:700px){.case .ai-outro .ai-statement{padding:25px 25px 30px;font-size:28px;margin:32px 0 38px}}@media(prefers-reduced-motion:reduce){.case .ai-outro .ai-statement{transform:none}}

/* Home-style typography for the closing AI statement. */
.case .ai-outro{max-width:none}.case .ai-outro .ai-statement{background:transparent;color:var(--ink);padding:0;margin:40px 0 48px;max-width:none;font-family:Roboto,Arial,sans-serif;font-size:min(8.5vw,120px);font-style:italic;font-weight:800;line-height:.91;letter-spacing:0;text-transform:uppercase;transform:none;border-radius:0;box-shadow:none;overflow-wrap:normal}.case .ai-outro .ai-statement::after{display:none}.case .ai-outro>p:not(.ai-statement){max-width:680px}.case .ai-outro .ai-statement:hover{transform:none}@media(max-width:700px){.case .ai-outro .ai-statement{font-size:10.4vw;line-height:.95;margin:30px 0 36px}}
.ai-story-nav{justify-content:flex-end}
.about-photo-column>.text-link{display:inline-block;margin-top:24px}

.hero .hero-word.drag-hint-target{position:relative}.hero .drag-hint-target>.play-caption{top:50%;left:50%;transform:translate(-50%,-50%) rotate(-5deg);background:#e3f5bf;color:#69764f;box-shadow:none;font-weight:400;font-style:normal;letter-spacing:0;text-transform:none;padding:8px 15px;font-size:13px;line-height:1.2}@media(max-width:700px){.hero .drag-hint-target>.play-caption{top:50%;padding:6px 12px;font-size:11px}}
.promova-first-gallery figcaption{font-size:16px;line-height:1.5;color:var(--ink);max-width:760px;margin:18px 0 12px}.promova-first-gallery figure{margin-bottom:22px}

/* Spot campaign: four connected ways to give an hour back. */
.case .spot-big-line{font-size:clamp(38px,6vw,76px);font-style:italic;font-weight:800;line-height:1;letter-spacing:-.03em;margin:28px 0}.spot-chapters{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin:55px 0 75px}.spot-chapters button{display:flex;flex-direction:column;align-items:flex-start;gap:22px;text-align:left;padding:24px 20px;border:0;border-radius:3px;background:rgba(170,255,0,.15);color:var(--ink);font-family:inherit;cursor:pointer;min-width:0}.spot-chapters button>span:first-child{font-size:12px;line-height:1.4}.spot-chapters button strong{font-size:23px;line-height:1.15;font-weight:700}.spot-chapters button>span:last-child{font-size:24px;margin-top:auto}.spot-section{scroll-margin-top:105px}.spot-media-placeholder{background:rgba(170,255,0,.12);border:1px dashed #9ba87c;min-height:310px;padding:36px;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:24px;margin:35px 0 70px}.spot-media-placeholder strong{font-size:clamp(35px,6vw,72px);font-weight:800;font-style:italic;line-height:1.05}.spot-media-placeholder>span:last-child{font-size:13px;color:#6d7461}.spot-reference{min-height:220px}.spot-quotes{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin:30px 0}.spot-quotes blockquote{margin:0;padding:30px;background:rgba(170,255,0,.14);font-size:clamp(23px,3vw,33px);line-height:1.17;font-weight:700;letter-spacing:-.02em}.spot-recap-title{font-size:clamp(45px,7vw,85px);font-style:italic;line-height:1;margin:30px 0}.spot-recap-examples{display:grid;gap:0;margin:35px 0 55px}.spot-recap-examples p{padding:25px 0;border-top:1px solid var(--line);display:grid;grid-template-columns:1fr 1.5fr;gap:25px;margin:0}.spot-recap-examples span{font-size:14px}.spot-recap-examples strong{font-size:clamp(25px,3.4vw,42px);line-height:1.1;font-weight:800;letter-spacing:-.025em}@media(max-width:800px){.spot-chapters{grid-template-columns:1fr 1fr}.spot-chapters button{min-height:165px}.spot-chapters button strong{font-size:22px}}@media(max-width:500px){.spot-chapters{gap:10px;margin:35px 0 50px}.spot-chapters button{padding:20px 15px}.spot-quotes{grid-template-columns:1fr}.spot-media-placeholder{padding:25px;min-height:230px}.spot-recap-examples p{grid-template-columns:1fr;gap:12px}.spot-section{scroll-margin-top:85px}}
.spot-launch-gallery{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px;margin:35px 0 70px;align-items:start}.spot-launch-gallery figure.wide,.spot-launch-gallery figure:last-child{grid-column:1/-1}.spot-launch-gallery img{width:100%;height:auto;display:block}@media(max-width:600px){.spot-launch-gallery{grid-template-columns:1fr;gap:20px}.spot-launch-gallery figure{grid-column:1/-1}}

/* A loose editorial moodboard for One Hour Off. */
.spot-experience-board{position:relative;aspect-ratio:1.2;background:#fff;border-radius:10px;margin:45px 0 85px;overflow:hidden;isolation:isolate}.spot-board-title{position:absolute;left:35%;top:36%;width:28%;z-index:4;text-align:center;background:#fff;padding:22px 5px}.spot-board-title>span,.spot-board-title small{display:block;font-size:9px;letter-spacing:.08em;line-height:1.4}.spot-board-title strong{display:block;font-size:clamp(28px,4.2vw,55px);line-height:.94;letter-spacing:-.04em;margin:13px 0}.spot-board-title small{letter-spacing:0;font-size:11px}.spot-board-photo{position:absolute;margin:0;background:#fff;transition:transform .3s ease;z-index:1}.spot-board-photo img{display:block;width:100%;height:auto}.spot-board-photo figcaption{background:#fff;font-size:8px;line-height:1.3;padding:5px 3px;text-transform:uppercase;letter-spacing:.02em}.spot-board-photo-1{left:2%;top:2%;width:21%;z-index:2}.spot-board-photo-2{left:25%;top:-4%;width:19%}.spot-board-photo-3{left:47%;top:3%;width:28%}.spot-board-photo-4{right:-2%;top:16%;width:23%;z-index:3}.spot-board-photo-5{left:4%;top:42%;width:23%;z-index:3}.spot-board-photo-6{left:27%;top:64%;width:19%;z-index:3}.spot-board-photo-7{left:48%;top:66%;width:23%;z-index:2}.spot-board-photo-8{right:0;top:59%;width:23%;z-index:3}.spot-board-photo-9{left:26%;top:18%;width:17%;z-index:1}@media(hover:hover) and (prefers-reduced-motion:no-preference){.spot-board-photo:hover{z-index:6;transform:translateY(-5px) scale(1.025)}}@media(max-width:600px){.spot-experience-board{aspect-ratio:.73;overflow:hidden;margin:30px 0 55px}.spot-board-title{left:32%;top:36%;width:37%;padding:15px 3px}.spot-board-title strong{font-size:30px}.spot-board-title>span{font-size:7px}.spot-board-title small{font-size:9px}.spot-board-photo figcaption{font-size:6px;padding:4px 2px}.spot-board-photo-1{width:30%;left:0;top:0}.spot-board-photo-2{width:28%;left:34%;top:-3%}.spot-board-photo-3{width:36%;left:64%;top:0}.spot-board-photo-4{width:30%;right:-1%;top:24%}.spot-board-photo-5{width:30%;left:0;top:36%}.spot-board-photo-6{width:29%;left:22%;top:68%}.spot-board-photo-7{width:28%;left:52%;top:69%}.spot-board-photo-8{width:31%;right:-7%;top:65%}.spot-board-photo-9{width:25%;left:36%;top:14%}}
.spot-board-title strong{font-size:clamp(25px,3.2vw,43px);font-style:italic;letter-spacing:-.04em}@media(max-width:600px){.spot-board-title strong{font-size:25px}}

/* Compact overlapping campaign previews. */
.spot-chapter-deck{display:flex;align-items:center;justify-content:center;gap:0;padding:26px 20px 30px;margin:30px 0 45px;perspective:1200px}.spot-chapter-deck button{position:relative;flex:0 0 25%;height:210px;min-height:0;display:block;padding:0;overflow:hidden;border:1px solid rgba(25,13,11,.15);border-radius:3px;background:#e7f6c9;box-shadow:0 8px 20px #190d0b12;transform:rotate(var(--deck-tilt)) rotateY(-14deg);transition:transform .35s ease,box-shadow .35s ease;isolation:isolate;margin-left:-18px}.spot-chapter-deck button:first-child{margin-left:0;--deck-tilt:-8deg;z-index:1}.spot-chapter-deck button:nth-child(2){--deck-tilt:-3deg;z-index:2}.spot-chapter-deck button:nth-child(3){--deck-tilt:4deg;z-index:3;background:#AAFF00}.spot-chapter-deck button:nth-child(4){--deck-tilt:9deg;z-index:4;background:#190d0b;color:var(--paper)}.spot-chapter-deck .spot-deck-label{position:relative;z-index:3;display:flex;justify-content:space-between;gap:5px;background:var(--paper);color:var(--ink);font-size:9px;line-height:1.2;padding:11px 10px;min-height:34px}.spot-chapter-deck button>img{position:absolute;inset:34px 0 0;width:100%;height:calc(100% - 34px);object-fit:cover;filter:brightness(.72)}.spot-chapter-deck button>strong{position:absolute;left:14px;bottom:15px;right:10px;margin:0;font-size:24px;line-height:1;font-weight:800;letter-spacing:-.03em;color:inherit;z-index:2}.spot-chapter-deck button:nth-child(-n+2)>strong{color:white;font-style:italic;font-size:31px}.spot-chapter-deck .spot-deck-type{display:block;padding:18px 14px 0;font-size:25px;font-weight:800;line-height:1;letter-spacing:-.035em}.spot-chapter-deck button:nth-child(3)>strong{font-size:13px;font-weight:400;letter-spacing:0}.spot-chapter-deck button:nth-child(4)>strong{font-size:24px;color:#AAFF00}.spot-chapter-deck button:nth-child(4):hover .spot-deck-type{color:var(--ink)}.spot-chapter-deck button:nth-child(4):hover>strong{color:var(--ink)}.spot-chapter-deck button:focus-visible{z-index:8;outline:2px solid var(--ink);outline-offset:4px;transform:translateY(-12px) rotate(0)}@media(hover:hover) and (prefers-reduced-motion:no-preference){.spot-chapter-deck button:hover{z-index:8;transform:translateY(-16px) rotate(0) rotateY(0);box-shadow:0 16px 30px #190d0b23}}@media(max-width:800px){.spot-chapter-deck button{height:185px;min-height:0;flex-basis:27%;margin-left:-15px}.spot-chapter-deck .spot-deck-label{font-size:8px;padding:9px 7px}.spot-chapter-deck button:nth-child(-n+2)>strong{font-size:25px}.spot-chapter-deck .spot-deck-type{font-size:21px;padding:16px 10px 0}.spot-chapter-deck button>strong{left:10px;bottom:12px}}@media(max-width:500px){.spot-chapter-deck{justify-content:flex-start;overflow-x:auto;overflow-y:hidden;padding:25px 12px 30px;margin:20px 0 30px;scrollbar-width:thin}.spot-chapter-deck button{flex-basis:145px;height:185px;margin-left:-14px;transform:rotate(var(--deck-tilt));flex-shrink:0}.spot-chapter-deck .spot-deck-label{font-size:8px}.spot-chapter-deck .spot-deck-type{font-size:23px}}@media(prefers-reduced-motion:reduce){.spot-chapter-deck button{transition:none}.spot-chapter-deck button:focus-visible{transform:none}}
.spot-chapter-deck .spot-deck-label{position:absolute;top:0;left:0;right:0;align-items:center}.spot-chapter-deck .spot-deck-type{position:absolute;top:34px;left:0;right:0}.spot-chapter-deck .spot-deck-label>span{font-size:11px}

.spot-chapter-deck .spot-deck-label{background:#AAFF00;font-size:12px;font-weight:700;min-height:48px;padding:10px 12px;line-height:1.2}.spot-chapter-deck button>img{top:48px;height:calc(100% - 48px)}.spot-chapter-deck .spot-deck-type{top:48px}.spot-chapter-deck .spot-deck-phone{position:absolute;top:48px;left:0;right:0;bottom:0;overflow:hidden;background:#ffe400}.spot-deck-phone img{position:absolute;width:330%;max-width:none;height:auto;left:-19%;top:-7%}.spot-recap-visual{margin:28px 0 35px}.spot-recap-visual img{display:block;width:100%;height:auto}.spot-chapter-deck button:nth-child(4){background:#ffe400}@media(max-width:800px){.spot-chapter-deck .spot-deck-label{font-size:10px;padding:9px 8px;min-height:45px}.spot-chapter-deck button>img{top:45px;height:calc(100% - 45px)}.spot-chapter-deck .spot-deck-type,.spot-chapter-deck .spot-deck-phone{top:45px}}
.spot-deck-phone img{height:110%;width:auto;max-width:none;left:50%;top:-5%;transform:translateX(-20%);clip-path:inset(0 66% 0 0)}
.spot-chapter-deck button[data-spot-target="spot-social"],.spot-chapter-deck button[data-spot-target="spot-social"] .spot-deck-label{background:#fff;color:var(--ink)}

/* Home occupies one viewport; tools have their own space below the copy. */
body.is-home{height:100dvh;overflow:hidden;display:grid;grid-template-rows:80px minmax(0,1fr) 48px}body.is-home>header{height:80px}body.is-home>#app{min-height:0}body.is-home>footer{height:48px;padding:12px 3.5vw;align-items:center;flex-wrap:nowrap}body.is-home .hero{height:100%;min-height:0;padding:clamp(15px,3dvh,32px) 3.5vw 12px;display:grid;grid-template-rows:auto minmax(0,1fr) auto auto;gap:12px;overflow:hidden}body.is-home .intro h1,body.is-home .hero-role{font-size:min(8.5vw,12dvh,120px)}body.is-home .intro img{width:min(16.5vw,20.9dvh,233.2px);max-height:19.8dvh;object-fit:contain}body.is-home .hero-role{margin:0;gap:0;justify-content:space-evenly;min-height:0}body.is-home .hero-role>span{flex:none}body.is-home .hero-bottom{display:flex;flex-direction:row;justify-content:flex-end;align-items:center;font-size:16px}body.is-home .play-panel{position:relative;left:auto;right:auto;bottom:auto;justify-self:start;max-width:100%;grid-row:4}body.is-home .play-tools{max-width:100%}body.is-home .doodle-canvas{height:100dvh}body.is-home .hero .home-draggable{touch-action:none;-webkit-touch-callout:none}body.is-home footer .home-draggable{touch-action:none}@media(max-width:700px){body.is-home{grid-template-rows:64px minmax(0,1fr) 42px}body.is-home>header{height:64px}body.is-home>footer{height:42px;padding:10px 5vw;font-size:10px;gap:12px}body.is-home .hero{padding:20px 5vw 10px;gap:12px}body.is-home .intro h1{font-size:min(8.4vw,10dvh)}body.is-home .hero-role{font-size:min(10vw,12dvh)}body.is-home .intro img{width:19.8vw}body.is-home .hero-bottom{font-size:14px}body.is-home .play-tools button{font-size:11px;padding:9px 8px}.play-tools button span{font-size:14px}body.is-home .play-tools{padding:4px;gap:0}}@media(max-height:500px){body.is-home{grid-template-rows:50px minmax(0,1fr) 32px}body.is-home>header{height:50px}body.is-home>footer{height:32px;padding:6px 3.5vw}body.is-home .hero{padding-top:8px;gap:6px}body.is-home .intro h1,body.is-home .hero-role{font-size:min(7vw,11dvh)}body.is-home .play-tools button{padding:5px 10px;font-size:11px}body.is-home .hero-bottom{font-size:12px}.hero-role span:nth-child(2){margin-left:25%}}
@media(hover:none){.about-brands li.touch-react{background:#AAFF00;color:var(--ink);z-index:3}.about-grid>div:last-child>p.touch-react{background:rgba(170,255,0,.24);box-shadow:6px 0 rgba(170,255,0,.24),-6px 0 rgba(170,255,0,.24)}.work-link.touch-react{background:#AAFF00;color:var(--ink)}.spot-chapter-deck button.touch-react{z-index:9}}@media(hover:none) and (prefers-reduced-motion:no-preference){.about-brands li.touch-react{transform:translateY(-6px) rotate(var(--tag-tilt)) scale(1.06);box-shadow:0 9px 17px #190d0b20}.about-grid>div:last-child>p.touch-react,.case-copy p.touch-react,.case-copy li.touch-react{transform:translateX(4px)}.spot-chapter-deck button.touch-react{transform:translateY(-12px) rotate(0)}.spot-board-photo.touch-react{z-index:6;transform:translateY(-5px) scale(1.025)}.work-link.touch-react{transform:translateX(5px)}}

/* Balance the desktop hero toward the right. */
@media(min-width:701px){
body.is-home .hero-role>span:nth-child(1){margin-left:5%}
body.is-home .hero-role>span:nth-child(2){margin-left:37%}
body.is-home .hero-role>span:nth-child(3){margin-left:17%}
body.is-home .intro img{width:min(22vw,27.5dvh,310.2px);max-width:310.2px;max-height:26.4dvh}
}

@media(min-width:701px){
body.is-home .hero-role>span:nth-child(1){margin-left:15%}
body.is-home .hero-role>span:nth-child(2){margin-left:min(47%,calc(100% - 7em))}
body.is-home .hero-role>span:nth-child(3){margin-left:min(27%,calc(100% - 6.3em))}
body.is-home .intro{margin-left:5%;gap:3vw}
body.is-home .intro h1{font-size:min(7.3vw,12dvh,120px)}
body.is-home .intro img{width:min(19.8vw,27.5dvh,310.2px)}
}

.reface-selected-work{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:30px}.reface-selected-work h3{font-size:20px;margin:18px 0}.reface-selected-work a{display:flex;justify-content:space-between;gap:12px;padding:14px 0;border-bottom:1px solid var(--line);font-size:17px}.reface-selected-work a:hover{background:#AAFF00}@media(max-width:700px){.reface-selected-work{grid-template-columns:1fr;gap:16px}}

.reface-work{margin:40px 0 60px}.reface-work>h2{font-size:18px;font-weight:500;background:#AAFF00;padding:5px 10px;width:fit-content;border-radius:3px}.reface-work>h3{font-size:24px;margin:34px 0 18px}.reface-embed-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px;align-items:start}.reface-embed{margin:0;min-width:0}.reface-embed iframe{display:block;width:100%;height:680px;border:1px solid var(--line);border-radius:8px;background:white}.reface-embed figcaption{padding:12px 0;font-size:15px}.reface-embed figcaption a{border-bottom:1px solid var(--line);padding-bottom:3px}.reface-results{padding:28px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}.reface-results strong{color:var(--ink);background:#AAFF00;padding:0 8px}.reface-approach-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:26px;margin-top:30px}.reface-approach-grid>div{border-top:1px solid var(--line);padding-top:20px}.reface-approach-grid h3{font-size:26px;line-height:1.12;margin:17px 0}.reface-approach-grid p{font-size:17px;line-height:1.5}.reface-approach-grid .eyebrow{font-size:10px}@media(max-width:700px){.reface-embed-grid,.reface-approach-grid{grid-template-columns:1fr}.reface-embed iframe{height:650px}.reface-embed-grid{gap:24px}.reface-approach-grid{gap:18px}}

.ai-toolkit{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:30px;margin:40px 0 55px}.ai-toolkit>div{border-top:1px solid var(--line);padding-top:22px}.ai-toolkit h2{font-size:27px;line-height:1.15;letter-spacing:-.025em;margin:0 0 18px}.ai-toolkit p{font-size:18px;line-height:1.55;margin:0}.case .ai-outro-compact .ai-statement{font-size:clamp(30px,4.5vw,56px);line-height:1.08;text-transform:none;margin:32px 0 24px}.case .ai-outro-compact>p:not(.ai-statement){max-width:760px}@media(max-width:700px){.ai-toolkit{grid-template-columns:1fr;gap:26px;margin:32px 0 40px}.ai-toolkit h2{font-size:25px}.ai-toolkit p{font-size:17px}}

/* Visible scroll feedback for touch screens; no hover required. */
@media(max-width:900px),(hover:none){
.work-link.mobile-scroll-active{background:#AAFF00!important;color:var(--ink)!important}
.about-grid>div:last-child>p.mobile-scroll-active,.case-copy>p.mobile-scroll-active,.case-copy li.mobile-scroll-active{background:rgba(170,255,0,.17);box-shadow:4px 0 rgba(170,255,0,.17),-4px 0 rgba(170,255,0,.17);border-radius:2px}
.ai-toolkit>div.mobile-scroll-active,.reface-approach-grid>div.mobile-scroll-active{border-top-color:#76ad00;background:rgba(170,255,0,.1)}
.contact-grid :is(a,[data-show-number],.contact-number).mobile-scroll-active{background:#AAFF00;color:var(--ink)}
.case .case-gallery figure.image-focus-ready img{opacity:1;transform:none}
.case-gallery figure.mobile-scroll-active,.spot-launch-gallery figure.mobile-scroll-active,.reface-embed.mobile-scroll-active{outline:2px solid #AAFF00;outline-offset:4px}
.about-photo-column>img.mobile-scroll-active{outline:2px solid #AAFF00;outline-offset:4px}
}
@media(prefers-reduced-motion:no-preference){
@media(max-width:900px),(hover:none){
.mobile-scroll-item{transition:background-color .35s ease,box-shadow .35s ease,outline-color .35s ease,transform .45s ease}
.work-link.mobile-scroll-active{transform:translateX(4px)}
.case-gallery figure.mobile-scroll-item img,.spot-launch-gallery figure.mobile-scroll-item img{transform:scale(.98);transition:transform .5s ease}
.case .case-gallery figure.mobile-scroll-active img,.spot-launch-gallery figure.mobile-scroll-active img{transform:scale(1)}
}
}

.contact-grid button.contact-button{background:transparent;color:var(--ink);cursor:pointer;font-family:inherit}.contact-grid button.contact-button:hover,.contact-grid button.contact-button:focus-visible{background:#AAFF00}.contact-grid button.contact-button[hidden]{display:none}.contact-grid .contact-number{width:fit-content;font-size:clamp(19px,2vw,27px);font-weight:500;margin:0;line-height:1.6;user-select:text}.contact-grid .contact-number[hidden]{display:none}

/* Let the image in scroll focus stand out from its neighbours. */
@media(max-width:900px),(hover:none){
#app:has(figure.mobile-scroll-active) figure.mobile-scroll-item:not(.mobile-scroll-active){opacity:.45}
#app figure.mobile-scroll-item.mobile-scroll-active{opacity:1}
}
@media(prefers-reduced-motion:no-preference){
@media(max-width:900px),(hover:none){
#app figure.mobile-scroll-item{transition:opacity .4s ease,outline-color .35s ease,transform .45s ease}
}
}

/* Touch browsers can retain :hover after a tap. Scroll focus is authoritative. */
@media(max-width:900px),(hover:none){
.work-list .work-link:not(.mobile-scroll-active),
.work-list .work-link:not(.mobile-scroll-active):hover,
.work-list .work-link:not(.mobile-scroll-active):focus-visible,
.work-list .work-link:not(.mobile-scroll-active).touch-react{
 background:transparent!important;color:var(--muted)!important;transform:none;
}
.work-list .work-link.mobile-scroll-active,
.work-list .work-link.mobile-scroll-active:hover,
.work-list .work-link.mobile-scroll-active:focus-visible{
 background:#AAFF00!important;color:var(--ink)!important;
}
}

/* About profile */
.about-page { max-width: 1440px; margin-inline: auto; }
.about-grid strong { background: linear-gradient(transparent 63%, #AAFF0066 63%); }
.about-story { width: min(100%, 710px); margin: clamp(55px, 9vw, 125px) auto 0; }
.about-chapter { border-top: 1px solid var(--line); padding: clamp(26px, 4vw, 54px) 0; }
.about-chapter .eyebrow { text-transform: uppercase; font-weight: 500; margin: 0 0 20px; }
.about-chapter p { font-size: clamp(18px, 2vw, 23px); line-height: 1.65; margin: 0 0 1em; }
.about-chapter p:last-child { margin-bottom: 0; }
.about-chapter mark { color: inherit; background: linear-gradient(transparent 58%, #AAFF0066 58%); font-weight: 700; }
.about-story > .text-link { display: inline-block; }
@media (max-width:900px), (hover:none) {
 .about-chapter > p.mobile-scroll-active { background: #AAFF002b; box-shadow: 4px 0 #AAFF002b, -4px 0 #AAFF002b; border-radius: 2px; }
}

.meme-entry {
 border: 1px solid currentColor; border-radius: 99px; padding: 9px 14px;
 font-size: 14px; white-space: nowrap; text-decoration: none;
}
.meme-entry:hover, .meme-entry:focus-visible { background: #AAFF00; color: #190d0b; }
.is-meme-library { --paper: #10100f; --ink: #f6f3ea; --muted: #b6b3a8; --line: #3c3b35; }
.is-meme-library > header, .is-meme-library > footer { background: var(--paper); color: var(--ink); }
.meme-library { max-width: 1250px; margin: auto; padding: 28px 6vw 70px; }
.meme-back { color: var(--ink); font-size: 14px; text-decoration: underline; text-underline-offset: 5px; }
.meme-intro {
 height: auto; display: grid; justify-content: center; justify-items: center;
 border: 0; padding: clamp(35px, 6vw, 70px) 0 26px; text-align: center;
}
.meme-cassette { width: 95px; margin-bottom: 20px; stroke: #AAFF00; stroke-width: 2; fill: none; }
.meme-intro .eyebrow, .meme-help { color: #AAFF00; }
.meme-intro h1 { font-size: clamp(48px, 9vw, 112px); line-height: .94; letter-spacing: -.065em; margin: 14px 0 22px; }
.meme-intro p { max-width: 540px; margin: 0 0 12px; line-height: 1.5; }
.meme-intro .meme-quote { font-size: clamp(19px, 3vw, 27px); font-weight: 700; }
.meme-help { font-size: 13px; margin: 14px 0 0; }
.meme-board { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 36px 28px; padding: 40px 12px 34px; isolation: isolate; }
.meme-card { position: relative; border: 0; padding: 0; background: none; text-align: left; cursor: grab; touch-action: none; user-select: none; }
.meme-card:nth-child(3n+1) { --tilt: -4deg; --card-color: #e9d9fe; }
.meme-card:nth-child(3n+2) { --tilt: 3deg; --card-color: #AAFF00; }
.meme-card:nth-child(3n) { --tilt: -2deg; --card-color: #ffcda8; }
.meme-card:nth-child(even) .meme-art { margin-top: 19px; }
.meme-art { display: grid; align-content: space-between; gap: 16px; min-height: 210px; padding: clamp(14px,2vw,26px); background: var(--card-color,#e9d9fe); color: #190d0b; transform: rotate(var(--tilt,0deg)); }
.meme-art small { font-family: monospace; letter-spacing: .07em; }
.meme-art strong { font-size: clamp(20px,3vw,35px); line-height: 1.05; letter-spacing: -.025em; }
.meme-art > span { font-size: 15px; line-height: 1.4; }
.meme-card.meme-dragging { cursor: grabbing; z-index: 2; }
.meme-card:focus-visible { outline: 2px solid #AAFF00; outline-offset: 10px; z-index: 2; }
.meme-zoom { width: min(90vw,560px); border: 1px solid #65645c; padding: 18px; background: #171715; color: #fff; }
.meme-zoom::backdrop { background: #000c; }
.meme-zoom form { display: flex; justify-content: flex-end; margin: 0 0 12px; }
.meme-close { border: 1px solid currentColor; background: transparent; color: inherit; border-radius: 50%; width: 42px; height: 42px; cursor: pointer; }
.meme-zoom .meme-art { min-height: 270px; }
.meme-zoom .meme-art strong { font-size: clamp(28px,6vw,58px); }
@media (max-width:700px) {
 .meme-board { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 20px 14px; padding-inline: 8px; }
 .meme-art { min-height: 190px; gap: 12px; }
 .meme-art > span { font-size: 13px; }
}
