@font-face{font-family:OverusedGrotesk;src:url('assets/overused-grotesk/OverusedGrotesk-Light.woff2') format('woff2');font-weight:300;font-display:swap}
@font-face{font-family:OverusedGrotesk;src:url('assets/overused-grotesk/OverusedGrotesk-SemiBold.woff2') format('woff2');font-weight:600;font-display:swap}
:root{--paper:#faf5eb;--cream:#fff8e9;--peach:#f1c69a;--apricot:#e7ae72;--orange:#c7673f;--brown:#5a2a17;--ink:#473321;--line:rgba(90,42,23,.35)}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--paper);color:var(--ink);font:300 20px/1.5 OverusedGrotesk,Arial,sans-serif}body::before{content:"";position:fixed;inset:0;background:url('assets/imgFooter.avif') center/cover;opacity:.075;pointer-events:none;z-index:-1}h1,h2,p,figure,dl,dd{margin:0}img{display:block;max-width:100%}a{color:inherit;text-decoration:none}a:hover{text-decoration:underline;text-underline-offset:5px}a:focus-visible{outline:2px solid var(--orange);outline-offset:5px}.skip{position:absolute;top:-100px}.skip:focus{top:12px;left:12px;background:var(--cream);padding:12px;z-index:10}.shell{width:min(1160px,calc(100% - 12vw));margin-inline:auto}
.site-header{width:min(1310px,calc(100% - 9vw));margin:auto;min-height:98px;display:flex;align-items:flex-start;justify-content:space-between;padding-top:27px;font-size:20px;font-weight:600}.site-header nav{display:flex;gap:clamp(25px,4.2vw,65px)}.site-header nav span{cursor:default}.site-name{white-space:nowrap}
.eyebrow,.topline,.section-index,.facts dt,figcaption,.hero-foot,.footer-inner>div>span{font:600 15px/1.3 OverusedGrotesk,Arial,sans-serif;letter-spacing:.06em}.topline{display:flex;justify-content:space-between;border-top:1px solid var(--line);padding-top:18px}.hero{padding-top:105px}.hero-grid{display:grid;grid-template-columns:.9fr 1.1fr;gap:6%;align-items:center;padding-top:70px}.hero-copy{padding-bottom:45px}.hero-copy .eyebrow{color:var(--orange)}.hero h1{font:700 clamp(72px,8.5vw,128px)/.88 "Helvetica Neue",Helvetica,Arial,sans-serif;letter-spacing:-.075em;color:var(--orange);margin:34px 0 38px}.hero h1 em,.section-heading h2 em,.concept h2 em{font-style:normal;color:var(--brown)}.hero h1 .accent{font:300 .4em OverusedGrotesk,Arial,sans-serif;vertical-align:top;letter-spacing:0;margin-left:.15em;color:var(--peach)}.hero-copy>p{max-width:420px;font-size:23px;line-height:1.43}.hero-foot{display:flex;justify-content:space-between;max-width:370px;border-top:1px solid var(--line);margin-top:85px;padding-top:14px;color:var(--orange)}.hero-art{position:relative}.hero-art::before{content:"";position:absolute;width:130px;height:130px;border:1px solid var(--orange);border-radius:50%;right:-32px;top:-32px;z-index:-1}.hero-art img{width:100%;aspect-ratio:1;object-fit:cover}.hero-art figcaption{text-align:right;padding-top:16px}.facts{display:grid;grid-template-columns:repeat(4,1fr);gap:32px;border-top:1px solid var(--line);border-bottom:1px solid var(--line);margin-top:125px;padding:24px 0 28px}.facts dt{color:var(--orange);margin-bottom:12px}.facts dd{font-size:18px;line-height:1.3}
.concept{position:relative;display:grid;grid-template-columns:205px 1fr;gap:50px;padding-top:225px;padding-bottom:225px;overflow:hidden}.section-index{color:var(--orange);padding-top:17px}.concept-copy{position:relative;z-index:1;max-width:850px}.concept h2,.section-heading h2,.closing h2{font:700 clamp(47px,5.6vw,77px)/1.07 "Helvetica Neue",Helvetica,Arial,sans-serif;letter-spacing:-.055em;color:var(--orange)}.concept p{max-width:600px;margin-top:36px;font-size:24px;line-height:1.52}.yam-outline{position:absolute;width:360px;height:440px;right:-100px;bottom:80px;border:2px solid rgba(199,103,63,.2);border-radius:61% 39% 57% 43% / 58% 56% 44% 42%;transform:rotate(-31deg)}
.identity,.applications,.space{border-top:1px solid var(--line);padding-top:150px;padding-bottom:175px}.section-heading{display:grid;grid-template-columns:205px 1fr;gap:50px;margin-bottom:85px}.section-heading>div{max-width:850px}.section-heading p{max-width:620px;margin-top:30px;font-size:21px;line-height:1.5}.wordmark-panel{background:#f4d2a4;padding:100px 8% 30px}.wordmark-panel img{width:100%;height:250px;object-fit:contain}.wordmark-panel figcaption{margin-top:55px;text-align:right}.identity-detail{display:grid;grid-template-columns:1fr 1fr;gap:55px;align-items:center;margin:105px 0}.palette .eyebrow{color:var(--orange)}.swatches{display:grid;grid-template-columns:repeat(6,1fr);gap:10px;margin:35px 0}.swatches i{display:block;aspect-ratio:1;border-radius:50%}.swatches i:nth-child(1){background:#454545}.swatches i:nth-child(2){background:#fdfde9;border:1px solid #ddd}.swatches i:nth-child(3){background:#f1c69a}.swatches i:nth-child(4){background:#e7ae72}.swatches i:nth-child(5){background:#c7673f}.swatches i:nth-child(6){background:#5a2a17}.palette p{font-size:18px}.sticker-pair{display:grid;grid-template-columns:1fr 1fr;gap:15px}.sticker-pair img{width:100%;aspect-ratio:1;object-fit:contain}.sticker-pair figcaption{grid-column:1/-1;text-align:right;margin-top:8px}.labels{background:var(--cream);padding:60px 5% 25px}.labels img{width:100%;max-height:320px;object-fit:contain}.labels figcaption{text-align:center;margin-top:35px}
.application-gallery{display:grid;grid-template-columns:1.25fr 1fr 1fr;gap:20px;align-items:start}.application-gallery figure{min-width:0}.application-gallery img{width:100%;aspect-ratio:1;object-fit:cover}.application-gallery figcaption{padding-top:15px}.application-main{margin-top:75px}.application-gallery figure:last-child{margin-top:150px}.space-image img{width:100%;aspect-ratio:1.6;object-fit:cover}.space-image figcaption,.sign-image figcaption{padding-top:15px;text-align:right}.sign-image{width:65%;margin:85px 0 0 auto}.sign-image img{width:100%;aspect-ratio:1.5;object-fit:cover}.closing{display:grid;grid-template-columns:205px 1fr;gap:50px;border-top:1px solid var(--line);padding-top:140px;padding-bottom:190px}.closing>div{max-width:800px}.closing p{max-width:550px;margin-top:35px;font-size:21px;line-height:1.5}.page-footer{border-top:1px solid var(--line)}.footer-inner{min-height:240px;display:flex;align-items:center;justify-content:space-between}.footer-inner>div{display:grid;gap:17px}.footer-inner a{font:700 clamp(26px,3vw,42px)/1.2 "Helvetica Neue",Helvetica,Arial,sans-serif;color:var(--orange)}.footer-inner a span{margin-left:18px}.footer-flower{font-size:95px;color:var(--orange)}.copyright{background:#ead5b8;text-align:right;padding:22px 7vw;font-size:18px}
@media(max-width:850px){.shell{width:calc(100% - 60px)}.hero-grid{grid-template-columns:1fr 1fr;gap:25px}.hero h1{font-size:clamp(58px,9vw,80px)}.hero-copy>p{font-size:20px}.hero-foot{margin-top:50px}.facts{gap:18px}.facts dd{font-size:16px}.concept,.section-heading,.closing{grid-template-columns:150px 1fr;gap:25px}.identity,.applications,.space{padding-top:110px;padding-bottom:125px}.application-gallery{gap:12px}}
@media(max-width:620px){body{font-size:18px}.shell{width:calc(100% - 42px)}.site-header{width:calc(100% - 42px);min-height:76px;padding-top:19px;font-size:12px}.site-header nav{gap:14px}.site-header nav a:nth-child(3),.site-header nav span{display:none}.hero{padding-top:55px}.topline{font-size:11px;gap:20px}.topline span:last-child{text-align:right}.hero-grid{display:flex;flex-direction:column;align-items:stretch;gap:55px;padding-top:55px}.hero-copy{padding-bottom:0}.hero h1{font-size:clamp(69px,17vw,105px);margin:25px 0 28px}.hero-copy>p{font-size:21px}.hero-foot{margin-top:42px}.hero-art::before{width:80px;height:80px;right:-15px;top:-15px}.hero-art figcaption{font-size:11px}.facts{grid-template-columns:1fr 1fr;gap:25px 20px;margin-top:80px}.facts dd{font-size:15px}.concept{display:block;padding-top:145px;padding-bottom:145px}.section-index{display:block;padding:0;margin-bottom:28px}.concept h2,.section-heading h2,.closing h2{font-size:clamp(43px,10vw,62px)}.concept p{font-size:21px;margin-top:26px}.yam-outline{width:180px;height:230px;right:-90px;bottom:20px}.section-heading{display:block;margin-bottom:50px}.section-heading p{font-size:19px;margin-top:24px}.identity,.applications,.space{padding-top:95px;padding-bottom:110px}.wordmark-panel{padding:45px 8% 20px}.wordmark-panel img{height:130px}.wordmark-panel figcaption{margin-top:25px;font-size:10px}.identity-detail{display:block;margin:70px 0}.sticker-pair{margin-top:55px}.sticker-pair figcaption,.labels figcaption{font-size:10px}.labels{padding:30px 3% 20px}.labels img{max-height:190px}.application-gallery{grid-template-columns:1fr 1fr}.application-main{grid-column:1/-1;margin-top:0}.application-gallery figure:last-child{margin-top:0}.application-gallery figcaption{font-size:10px}.space-image img{aspect-ratio:1.15}.sign-image{width:80%;margin-top:55px}.space-image figcaption,.sign-image figcaption{font-size:10px}.closing{display:block;padding-top:100px;padding-bottom:120px}.closing p{font-size:19px}.footer-inner{min-height:180px}.footer-flower{font-size:55px}.copyright{font-size:15px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
.hero-art img,.sticker-pair img,.labels img,.application-gallery img,.space-image img,.sign-image img{height:auto}

/* Shared case-study landing layout, retaining Yami's palette. */
.site-header{font-size:18px;min-height:97px}
.hero{padding-top:0}
.hero-grid{min-height:745px;grid-template-columns:minmax(0,1fr) minmax(0,1.03fr);gap:clamp(55px,8vw,120px);align-items:center;padding:50px 0 105px}
.hero-copy{padding:0;min-width:0}
.hero-copy .eyebrow{display:flex;align-items:center;gap:14px}
.hero-star{display:inline-block;flex:none;width:15px;height:22px;background:currentColor;-webkit-mask:url('assets/imgVector2.svg') center/contain no-repeat;mask:url('assets/imgVector2.svg') center/contain no-repeat}
.hero h1{font-size:clamp(64px,5.5vw,88px);line-height:1;letter-spacing:-.065em;margin:38px 0 35px;white-space:nowrap}
.hero h1::after{content:"";display:block;width:74px;height:8px;margin-top:22px;background:var(--peach)}
.hero-copy>p{font-size:20px;line-height:1.5;max-width:490px}
.hero-art{min-width:0}.hero-art::before{content:none}
.hero-art img{aspect-ratio:4/3;object-fit:cover}
.hero-art figcaption{display:flex;align-items:center;justify-content:space-between;gap:12px;border-top:1px solid var(--line);margin-top:18px;padding-top:13px;text-align:left;color:var(--orange)}
.hero-art figcaption .hero-star{width:14px;height:20px}
.facts{margin-top:0;gap:20px;padding:28px 0 34px}
@media(max-width:850px){.hero-grid{gap:35px}.hero h1{font-size:clamp(52px,6vw,72px)}}
@media(max-width:620px){.site-header{font-size:12px;min-height:76px}.hero{padding-top:0}.hero-grid{display:block;min-height:0;padding:50px 0 90px}.hero h1{font-size:clamp(58px,14vw,76px);white-space:normal}.hero-art{margin-top:55px}.hero-art figcaption{font-size:11px}.facts{margin-top:0;gap:25px 20px}}

/* Use the supplied transparent wordmark as the project title. */
.visually-hidden{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.hero h1.hero-logo-title{width:100%;max-width:490px;margin:38px 0 35px}
.hero-logo-frame{display:block;position:relative;width:100%;aspect-ratio:3660/638;overflow:hidden}
.hero-logo-frame img{position:absolute;display:block;width:100%;height:auto;max-width:none;top:-25.55%}
@media(max-width:620px){.hero h1.hero-logo-title{margin:25px 0 28px}}

/* Center the overview strip and let the case-study content use its grid width. */
body .facts{min-height:155px;align-items:center;padding:24px 0}
body .facts>div{align-content:center}
.concept{padding-top:155px;padding-bottom:155px}
.concept-copy,.section-heading>div,.closing>div{max-width:none}
.concept p{max-width:none;font-size:20px;line-height:1.6}
.section-heading p,.closing p{max-width:none}

/* The supplied logo and product labels already have transparent backgrounds. */
.wordmark-panel{background:transparent;padding:0}
.wordmark-art{position:relative;width:100%;aspect-ratio:3660/638;overflow:hidden}
.wordmark-art img{position:absolute;width:100%;height:auto;max-width:none;top:-25.55%}
.wordmark-panel figcaption{margin-top:24px;text-align:left;font:300 17px/1.5 OverusedGrotesk,Arial,sans-serif;letter-spacing:.02em}
.labels{background:transparent;padding:0}
.labels img{width:100%;max-height:none;height:auto}
.labels figcaption{margin-top:18px;text-align:left;font:300 17px/1.5 OverusedGrotesk,Arial,sans-serif;letter-spacing:.02em}
.detail-heading{margin:0;color:var(--orange);font:700 26px/1.2 "Helvetica Neue",Helvetica,Arial,sans-serif;letter-spacing:-.03em}
.identity-detail{align-items:start}
.sticker-pair .detail-heading{grid-column:1/-1;margin-bottom:18px}
.swatches{margin:35px 0 0}
@media(max-width:620px){body .facts{min-height:0;padding:28px 0}.concept{padding-top:105px;padding-bottom:105px}.concept p{font-size:20px}.wordmark-panel figcaption,.labels figcaption{font-size:14px}.detail-heading{font-size:23px}}

/* Distribute the overview evenly and give the visual identity room to breathe. */
body .facts{text-align:center}
.identity{padding-top:175px;padding-bottom:190px}
.identity .section-heading{margin-bottom:125px}
.identity-detail{margin:155px 0}
.label-photo{margin-top:135px}
.label-photo img{display:block;width:100%;height:auto}

/* Crop only the watermark corners from the supplied interior renders. */
.render-crop{width:100%;overflow:hidden}
.render-one .render-crop{aspect-ratio:1.82}
.render-two{margin-top:105px}
.render-two .render-crop{aspect-ratio:2}
.render-crop img{display:block;width:100%;height:100%;aspect-ratio:auto;object-fit:cover;object-position:center top}
@media(max-width:850px){.identity{padding-top:120px;padding-bottom:140px}.identity .section-heading{margin-bottom:90px}.identity-detail{margin:110px 0}.label-photo{margin-top:100px}}
@media(max-width:620px){.identity{padding-top:95px;padding-bottom:110px}.identity .section-heading{margin-bottom:65px}.identity-detail{margin:85px 0}.label-photo{margin-top:75px}.render-two{margin-top:65px}}

/* Final alignment and caption placement. */
body .facts{text-align:left}
.wordmark-panel .detail-heading{margin-bottom:36px}
.label-photo{margin-top:48px}
.label-photo figcaption{margin-top:18px;text-align:left;font:300 17px/1.5 OverusedGrotesk,Arial,sans-serif;letter-spacing:.02em}
.render-two{margin-top:50px}
@media(max-width:620px){.wordmark-panel .detail-heading{margin-bottom:25px}.label-photo{margin-top:30px}.label-photo figcaption{font-size:14px}.render-two{margin-top:32px}}

/* Original high-resolution identity artwork, stacked at full section width. */
.logo-exploration{display:block;width:100%;height:auto;margin-top:75px}
.identity-detail{display:flex;flex-direction:column;align-items:stretch;gap:105px;margin:125px 0 145px}
.identity-detail .detail-heading{margin-bottom:36px}
.palette>img{display:block;width:100%;height:auto}
.sticker-pair{display:block;margin:0}
.sticker-pair .detail-heading{margin-bottom:36px}
.sticker-pair>img{display:block;width:100%;height:auto;aspect-ratio:auto;object-fit:contain}
@media(max-width:850px){.logo-exploration{margin-top:55px}.identity-detail{gap:80px;margin:95px 0 110px}}
@media(max-width:620px){.logo-exploration{margin-top:35px}.identity-detail{gap:65px;margin:75px 0 85px}.identity-detail .detail-heading,.sticker-pair .detail-heading{margin-bottom:24px}}

.wordmark-panel .logo-exploration{width:76%;margin:65px auto 0}
.wordmark-panel .logo-exploration-note{max-width:76%;margin:18px auto 0;text-align:left;font:300 17px/1.5 OverusedGrotesk,Arial,sans-serif;letter-spacing:0}
@media(max-width:620px){.wordmark-panel .logo-exploration{width:88%;margin-top:40px}.wordmark-panel .logo-exploration-note{max-width:88%;font-size:14px;margin-top:14px}}

.wordmark-panel .logo-exploration{width:62%}
.wordmark-panel .logo-exploration-note{max-width:62%}
.palette>img{width:78%;margin-inline:auto}
@media(max-width:620px){.wordmark-panel .logo-exploration{width:82%}.wordmark-panel .logo-exploration-note{max-width:82%}.palette>img{width:90%}}
