/* Selected work: supplied artwork, editorial spacing and light interactions. */
.hero--photographic{background:#121212}
.hero-background{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 45%}
.hero--photographic .hero-vignette{background:linear-gradient(180deg,#09090938 0%,transparent 35%,#09090933 60%,#090909d9 100%)}
.hero--photographic h1{text-shadow:0 2px 28px #0003}
.about-grid .about-photo{align-self:stretch;min-height:0}
.about .about-photo img{position:absolute;inset:0;aspect-ratio:auto;width:100%;height:100%;object-position:50% 20%}
.project-instagram{display:inline-flex;align-items:center;gap:25px;margin-top:28px;padding:17px 24px;background:#e94d18;color:#161616;border-radius:40px;font-size:16px;font-weight:500;transition:background .2s,color .2s}
.project-instagram>span{font-size:24px}
.project-instagram:hover{background:#161616;color:#f5f1e8}
.curated-detail.fari .case-pair:not(.case-pair--portrait){grid-template-columns:.8fr 1fr}
.project-card.fari .project-image>img{object-fit:cover}
.sami{--case-bg:#0961c3;--case-fg:#f4fff9;--sami-green:#b4e875}
.client-card.sami{background:var(--case-bg);color:var(--case-fg)}
.client-card.sami .client-card-bottom{border-color:#ffffff70}
.client-card.sami .client-card-bottom>span:first-child{color:var(--sami-green)}
.client-detail.sami{background:#eef7fb}
.client-detail.sami .site-header{color:#f4fff9}
.client-detail.sami .site-header nav,.client-detail.sami .contact-nav{border-color:#ffffff80}
.client-detail.sami .site-header nav a:hover{background:#ffffff20}
.client-detail.sami .site-header .contact-nav:hover{background:var(--sami-green);color:#113b45}
.sami .client-hero h1>span{color:var(--sami-green)}
.sami .client-hero .section-top{border-color:#ffffff70}
.sami .project-story{background:#edf8ef}
.sami .client-results{background:#092e55;--case-bg:#b4e875}
.sami .client-results .metric-value{color:var(--sami-green)}
.sami .client-results .section-top,.sami .growth,.sami .campaign-note{border-color:#7094b3}
.sami .scope{background:#eef7fb}
.sami .scope li,.sami .role-line,.sami .next-project{border-color:#adc6d3}
.sami .instagram-link.text-link{background:#0961c3;border-color:#0961c3;color:#f4fff9}
.sami .instagram-link.text-link:hover{background:var(--sami-green);color:#113b45}
@media(max-width:680px){
 .hero-background{object-position:58% 50%}
 .about-grid .about-photo{aspect-ratio:1;align-self:auto}
 .curated-detail.fari .case-pair:not(.case-pair--portrait){grid-template-columns:1fr}
 .project-instagram{font-size:15px;gap:20px;padding:16px 20px}
}
.site-header .contact-nav{font-size:14px;padding:12px 18px;border:1px solid currentColor;border-radius:40px;transition:background .2s,color .2s}
.site-header .contact-nav span{margin-left:12px}
.site-header .contact-nav:hover{background:#f2f1ee;color:#161616}
.detail .site-header .contact-nav:hover{background:#161616;color:#f2f1ee}
.about .about-photo img{aspect-ratio:1;object-fit:cover;object-position:50% 28%}
.project-card.fari .project-image{background:#262722}
.project-card.fari .project-image>img{object-fit:cover}
.project-card.gamro .project-image>img{object-fit:cover;object-position:42% 50%}
.case-triptych{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin-bottom:34px;align-items:start}
.case-triptych .case-image{margin:0}
.case-triptych .case-image:nth-child(2){transition-delay:.08s}
.case-triptych .case-image:nth-child(3){transition-delay:.16s}
.client-tile{min-width:0;display:flex;flex-direction:column}
.client-tile .client-card{flex:1}
.client-social{display:flex;justify-content:space-between;align-items:center;gap:16px;margin-top:12px;padding:16px 18px;border:1px solid #8d8d86;border-radius:4px;color:#f2f1ee;font-size:14px;transition:background .2s,color .2s}
.client-social:hover{background:#f2f1ee;color:#171717}
.client-social>span:last-child{font-size:22px}
.instagram-link.text-link{display:inline-flex;align-items:center;gap:22px;font-size:16px;font-weight:500;line-height:1.4;background:#181818;color:#f2f1ee;padding:18px 24px;border:1px solid #181818;border-radius:40px;transition:background .2s,color .2s}
.instagram-link.text-link:hover{background:var(--case-bg);color:var(--case-fg)}
.instagram-link.text-link span{font-size:24px}
@media(max-width:680px){
 .site-header{height:124px;flex-wrap:wrap;align-content:center;row-gap:12px;padding-top:10px;padding-bottom:10px}
 .site-header nav{order:3;margin:0 auto}
 .site-header .contact-nav{font-size:13px;display:inline-flex;align-items:center;width:auto;height:auto;padding:9px 13px;gap:6px;margin-left:auto;max-width:calc(100% - 60px);border:1px solid currentColor}
 .site-header .contact-nav span{font-size:18px;margin:0}
 .hero-kicker{top:150px}
 .detail .detail-heading,.detail .client-hero{padding-top:170px}
 .case-triptych{grid-template-columns:1fr;gap:24px;margin-bottom:24px}
 .instagram-link.text-link{font-size:15px;padding:16px 20px;gap:16px}
}
.footer .section-top{align-items:flex-end;padding-bottom:35px}
.footer-question{font-size:clamp(30px,4.4vw,70px);line-height:1.06;letter-spacing:-.05em;text-transform:none;max-width:850px}
.footer .section-top>span{flex-shrink:0;margin-bottom:5px}
.project-card .project-image{transition:clip-path .55s cubic-bezier(.2,.7,.2,1),border-radius .55s;clip-path:inset(0 round 0)}
.project-caption h3{transition:transform .35s}
.project-card.fari .project-image{background:#262722}
.project-card.gamro .project-image{background:#171717}
.project-card.rizzo .project-image{background:#1d1d1d}
.client-card{overflow:hidden}
.hover-chip{display:none;pointer-events:none;position:absolute;left:var(--hover-x,50%);top:var(--hover-y,50%);z-index:3;width:108px;height:108px;border-radius:50%;background:#f3f1e8;color:#151515;font-size:14px;line-height:1.15;letter-spacing:-.025em;padding:25px 20px;box-shadow:0 5px 30px #0002;opacity:0;transform:translate(-50%,-50%) scale(.7);transition:opacity .22s,transform .3s cubic-bezier(.2,.7,.2,1)}
.hover-chip b{display:block;font-size:24px;font-weight:400;position:absolute;right:18px;bottom:18px}
.project-card:focus-visible .project-caption h3{transform:translateX(8px)}
@media(hover:hover) and (pointer:fine){
 .hover-chip{display:block}
 .is-hovering>.hover-chip{opacity:1;transform:translate(-50%,-50%) scale(1)}
 .project-card:hover .project-image{clip-path:inset(2.5% round 14px)}
 .project-card:hover .project-image>img{transform:scale(1.035)}
 .project-card:hover .project-caption h3{transform:translateX(10px)}
 .project-card:hover .project-open{opacity:0;transform:translate(10px,-10px)}
 .client-card:hover{transform:translateY(-6px)}
 .client-card:hover h3{transform:translateX(6px)}
 .client-card h3{transition:transform .35s}
}
.curated-detail{--case-accent:#1a1a1a}
.curated-detail.fari{--case-accent:#e24b16}
.curated-detail.gamro{--case-accent:#e22322}
.curated-detail.rizzo{--case-accent:#927448}
.curated-detail .detail-heading{padding-bottom:42px}
.case-title-dot{color:var(--case-accent)}
.case-content{max-width:2000px;margin:0 auto;padding:0 2vw}
.case-image{margin:0 0 24px;min-width:0}
.case-image img{width:100%;height:auto}
.case-image figcaption{font-size:12px;line-height:1.5;letter-spacing:.02em;color:#65645f;padding:13px 0 5px}
.case-image--light img{background:#eae6dd}
.case-hero{margin:0}
.case-overview{padding:100px 3vw 105px;display:grid;grid-template-columns:1.6fr 1fr;gap:9vw;align-items:start}
.case-overview h2{font-size:clamp(40px,4.5vw,72px);line-height:1.08;margin-top:28px;margin-bottom:32px;max-width:780px}
.case-overview p{max-width:780px;color:#5e5d58;font-size:17px;margin-top:22px}
.case-overview .case-lead{font-size:clamp(21px,2.1vw,32px);line-height:1.4;letter-spacing:-.025em;color:#20201e}
.case-overview dl{margin:0;display:grid;grid-template-columns:1fr 1fr;gap:42px 28px;padding-top:6px}
.case-overview dt{font-size:11px;letter-spacing:.065em;text-transform:uppercase;color:#79756e;margin-bottom:15px}
.case-overview dd{font-size:15px;line-height:1.55;margin:0}
.case-pair{display:grid;grid-template-columns:1fr 1fr;gap:24px;margin-bottom:24px;align-items:start}
.case-pair .case-image{margin:0}
.case-statement{padding:75px 3vw 85px;display:grid;grid-template-columns:1.3fr 1fr;gap:12vw;align-items:end}
.case-statement h2{font-size:clamp(36px,4.3vw,68px);line-height:1.07;margin-top:28px}
.case-statement>p{font-size:18px;color:#5e5d58;max-width:470px}
.case-pair--portrait{grid-template-columns:1.422fr 1fr;max-width:1200px;margin:65px auto 30px;gap:4vw}
.case-film video{width:100%;height:auto;display:block;background:#252522}
.case-note{font-size:13px;line-height:1.5;color:#77736c;padding:25px 3vw 10px}
.curated-detail .next-project{margin-top:75px}
@media(min-width:1700px){.case-overview,.case-statement{gap:150px}}
@media(max-width:1000px){.case-overview{gap:6vw;padding-top:65px;padding-bottom:70px;grid-template-columns:1.4fr 1fr}.case-overview dl{grid-template-columns:1fr;gap:25px}.case-statement{gap:6vw}}
@media(max-width:680px){
 .footer .section-top{align-items:start;gap:18px;padding-bottom:28px}
 .footer-question{font-size:34px;max-width:270px}
 .footer .section-top>span{font-size:9px;max-width:68px;flex-shrink:1;line-height:1.5;margin-top:5px}
 .case-content{padding:0 4vw}
 .curated-detail .detail-heading{padding-bottom:30px}
 .case-overview{grid-template-columns:1fr;gap:36px;padding:50px 2vw}
 .case-overview h2{font-size:43px;margin:24px 0}
 .case-overview .case-lead{font-size:23px}
 .case-overview p{font-size:16px}
 .case-overview dl{grid-template-columns:1fr 1fr;gap:28px 24px;border-top:1px solid #c6c3bc;padding-top:30px}
 .case-overview dt{font-size:10px;margin-bottom:10px}
 .case-overview dd{font-size:14px}
 .case-image,.case-pair{margin-bottom:20px}
 .case-pair{grid-template-columns:1fr;gap:24px}
 .case-image figcaption{font-size:11px;padding-top:10px}
 .case-statement{grid-template-columns:1fr;padding:42px 2vw 48px;gap:24px}
 .case-statement h2{font-size:40px;margin-top:20px}
 .case-statement>p{font-size:17px}
 .case-pair--portrait{margin-top:35px;gap:30px}
 .case-film{width:85%;justify-self:center}
 .case-note{padding:15px 2vw 0}
 .curated-detail .next-project{margin-top:45px}
}
@media(prefers-reduced-motion:reduce){
 .hover-chip{display:none}
 .project-card:hover .project-image{clip-path:none}
 .project-card:hover .project-image>img,.project-card:hover .project-caption h3,.client-card:hover,.client-card:hover h3{transform:none}
 .project-card:hover .project-open{opacity:1;transform:none}
}
