
:root{--bg:#11100f;--ink:#f4eee5;--muted:#aaa094;--line:#3a342e;--font:"Manrope",Arial,Helvetica,sans-serif}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--bg);color:var(--ink);font-family:var(--font)}
a{color:inherit}
img{display:block;width:100%}
.topbar{height:76px;display:flex;align-items:center;justify-content:space-between;padding:0 clamp(20px,4vw,68px);border-bottom:1px solid var(--line);background:rgba(17,16,15,.96);position:sticky;top:0;z-index:10;backdrop-filter:blur(10px)}
.logo img{width:150px;filter:invert(1)}
.nav{display:flex;gap:25px;font-size:10px;letter-spacing:.14em;text-transform:uppercase}
.nav a{text-decoration:none}
.nav a:hover,.text-link:hover{text-decoration:underline;text-underline-offset:5px}
.small{font-size:10px;letter-spacing:.15em;text-transform:uppercase;color:var(--muted)}
.portfolio-intro{padding:clamp(68px,10vw,150px) clamp(20px,5vw,80px) clamp(36px,5vw,70px)}
.portfolio-intro h1{font-size:clamp(58px,9vw,150px);line-height:.86;letter-spacing:-.07em;font-weight:400;margin:18px 0 24px}
.portfolio-intro p{font-size:clamp(14px,1.4vw,18px);color:#cec4b8;margin:0;max-width:550px;line-height:1.5}
.work-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1px;background:var(--line);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.work-card{display:block;text-decoration:none;background:var(--bg);overflow:hidden}
.work-card .media{height:clamp(360px,48vw,670px);overflow:hidden;background:#211e1b}
.work-card img{height:100%;object-fit:cover;object-position:var(--position,center);transition:transform .7s ease,filter .7s ease;filter:saturate(.9)}
.work-card:hover img,.work-card:focus-visible img{transform:scale(1.035);filter:saturate(1)}
.work-card .caption{display:flex;align-items:end;justify-content:space-between;gap:25px;padding:25px clamp(20px,3vw,42px) 34px}
.work-card .name{font-size:clamp(25px,2.4vw,40px);letter-spacing:-.05em;line-height:1.05;margin:8px 0 5px;font-weight:400}
.work-card .client{font-size:12px;color:var(--muted);line-height:1.4}
.work-card .arrow{font-size:26px;line-height:1}
.project-hero{min-height:min(600px,calc(100svh - 76px));display:grid;grid-template-columns:minmax(320px,38%) 1fr}
.hero-copy{display:flex;flex-direction:column;justify-content:end;padding:clamp(35px,5vw,85px)}
.hero-copy h1{font-size:clamp(55px,6.2vw,112px);letter-spacing:-.065em;font-weight:400;line-height:.88;margin:22px 0 25px;overflow-wrap:anywhere}
.hero-copy .client{font-size:13px;color:#d8cfc4;line-height:1.5}
.text-link{font-size:10px;letter-spacing:.12em;text-transform:uppercase;text-decoration:none;border-bottom:1px solid #bbb0a3;padding-bottom:7px;align-self:flex-start;margin-top:45px}
.hero-media{overflow:hidden;min-height:520px;background:#211e1b}
.hero-media img{width:100%;height:100%;object-fit:cover;object-position:var(--position,center)}
.case{padding:clamp(55px,7vw,100px) clamp(20px,5vw,80px)}
.case h2,.gallery h2{font-size:clamp(34px,4.2vw,60px);font-weight:400;letter-spacing:-.05em;margin:0 0 30px}
.case-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1px;background:var(--line);border:1px solid var(--line)}
.model-sourcing-case .case-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
.case-block{background:var(--bg);padding:clamp(25px,3vw,45px)}
.case-block h3{font-size:10px;color:var(--muted);letter-spacing:.15em;text-transform:uppercase;font-weight:400;margin:0 0 18px}
.case-block p{font-size:clamp(15px,1.4vw,19px);line-height:1.5;margin:0}
.gallery{padding:0 clamp(20px,5vw,80px) clamp(75px,9vw,130px);max-width:1190px;margin:0 auto}
.gallery-grid{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:clamp(16px,2.5vw,30px);align-items:start}
.gallery-grid figure{margin:0;overflow:hidden;background:#211e1b;position:relative;max-height:390px}
.gallery-grid figure:nth-child(4n+1){grid-column:span 7;aspect-ratio:1.45}
.gallery-grid figure:nth-child(4n+2){grid-column:span 5;aspect-ratio:1.08;margin-top:64px}
.gallery-grid figure:nth-child(4n+3){grid-column:span 5;aspect-ratio:1.12;max-height:350px}
.gallery-grid figure:nth-child(4n+4){grid-column:span 7;aspect-ratio:1.75;margin-top:42px;max-height:340px}
.gallery-grid img{width:100%;height:100%;object-fit:cover;object-position:var(--position,center);transition:transform .5s ease}
.gallery-grid figure:hover img{transform:scale(1.025)}
.gallery-grid .tall img{object-fit:contain}
.gallery-grid .light-frame{background:#f5f5f2}
.gallery-grid .website-shot img{object-fit:contain;background:#eee9e2;padding:10px}
.gallery-grid figcaption{position:absolute;bottom:0;left:0;right:0;background:linear-gradient(0deg,rgba(0,0,0,.65),transparent);padding:38px 20px 18px;font-size:10px;letter-spacing:.11em;text-transform:uppercase}
.brand-shoot-gallery .gallery-grid figure:nth-child(1){grid-column:1 / span 5;aspect-ratio:.96;max-height:420px}
.brand-shoot-gallery .gallery-grid figure:nth-child(2){grid-column:8 / span 4;aspect-ratio:.82;margin-top:55px;max-height:420px}
.brand-shoot-gallery .gallery-grid figure:nth-child(3){grid-column:2 / span 5;aspect-ratio:.96;max-height:400px}
.brand-shoot-gallery .gallery-grid figure:nth-child(4){grid-column:9 / span 4;aspect-ratio:.88;margin-top:38px;max-height:390px}
.brand-shoot-gallery .gallery-grid .light-frame{background:#211e1b}
.brand-shoot-gallery .gallery-grid img{object-fit:cover}
.brand-shoot-gallery .gallery-grid figure:nth-child(1) img{object-position:center 38%}
.brand-shoot-gallery .gallery-grid figure:nth-child(2) img{object-position:center 36%}
.brand-shoot-gallery .gallery-grid figure:nth-child(3) img{object-position:center 54%}
.brand-shoot-gallery .gallery-grid figure:nth-child(4) img{object-position:center 43%}
.project-footer{border-top:1px solid var(--line);padding:45px clamp(20px,5vw,80px);display:flex;justify-content:space-between;align-items:end;gap:20px}
.project-footer h2{font-size:clamp(32px,4vw,58px);font-weight:400;letter-spacing:-.05em;line-height:1;margin:10px 0 0}
.project-footer a{font-size:11px;letter-spacing:.12em;text-transform:uppercase;text-decoration:none;border-bottom:1px solid;padding-bottom:5px}
.footer{border-top:1px solid var(--line);padding:25px clamp(20px,5vw,80px);display:flex;justify-content:space-between;gap:12px;color:var(--muted);font-size:10px;letter-spacing:.1em;text-transform:uppercase}
@media(max-width:800px){
 .topbar{height:64px;padding:0 20px}.logo img{width:128px}.nav{gap:13px;font-size:9px}
 .portfolio-intro{padding:70px 20px 35px}
 .work-grid{grid-template-columns:1fr}.work-card .media{height:min(115vw,560px)}
 .work-card .caption{padding:20px 20px 28px}
 .project-hero{display:flex;flex-direction:column;min-height:0}.hero-media{order:-1;min-height:0;height:min(88vw,420px)}
 .hero-copy{padding:35px 20px 45px}.hero-copy h1{font-size:clamp(50px,12vw,76px)}.text-link{margin-top:28px}
 .case{padding:60px 20px}.case-grid{grid-template-columns:1fr}.case-block{padding:26px}
 .model-sourcing-case .case-grid{grid-template-columns:1fr}
 .gallery{padding:0 20px 70px}.gallery-grid{grid-template-columns:repeat(12,minmax(0,1fr));row-gap:22px;column-gap:0}
 .gallery-grid figure:nth-child(odd){grid-column:1 / span 11;aspect-ratio:1.25;max-height:340px;margin-top:0}
 .gallery-grid figure:nth-child(even){grid-column:3 / span 10;aspect-ratio:1.18;max-height:320px;margin-top:0}
 .gallery-grid .website-shot{aspect-ratio:1.4}
 .brand-shoot-gallery .gallery-grid figure:nth-child(1){grid-column:1 / span 9;aspect-ratio:.82;max-height:360px}
 .brand-shoot-gallery .gallery-grid figure:nth-child(2){grid-column:4 / span 9;aspect-ratio:.82;max-height:360px;margin-top:0}
 .brand-shoot-gallery .gallery-grid figure:nth-child(3){grid-column:1 / span 9;aspect-ratio:.88;max-height:360px}
 .brand-shoot-gallery .gallery-grid figure:nth-child(4){grid-column:3 / span 9;aspect-ratio:.88;max-height:360px;margin-top:0}
 .project-footer{padding:40px 20px;display:block}.project-footer a{display:inline-block;margin-top:28px}
 .footer{padding:22px 20px}
}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.work-card img,.gallery-grid img{transition:none}}

.case-note{max-width:650px;color:#cfc5b9;line-height:1.6;font-size:16px}
.plain-list{display:flex;flex-wrap:wrap;gap:12px}.plain-list span{border:1px solid var(--line);padding:12px 18px;font-size:12px;letter-spacing:.08em;text-transform:uppercase}
.content-social-copy{max-width:760px;margin:30px 0 0;color:#d8cfc4;font-size:clamp(15px,1.4vw,18px);line-height:1.6}
.content-social-copy p{margin:0}.content-social-copy p+p{margin-top:14px}

/* Brand Shoot opening photo */
.brand-shoot-hero{height:1080px;min-height:0;grid-template-columns:minmax(0,60%) minmax(0,40%)}
.brand-shoot-hero .hero-media{min-width:0;min-height:0;height:100%;background:#11100f}
.brand-shoot-hero .hero-media img{width:100%;height:100%;object-fit:cover;object-position:center 50%}
@media(max-width:800px){.brand-shoot-hero{height:auto}.brand-shoot-hero .hero-media{height:min(88vw,420px)}}

/* Phone framing for the two Curvletics projects. Desktop art direction stays untouched. */
@media(max-width:800px){
 .brand-shoot-hero .hero-media{height:min(88vw,370px)!important}
 .brand-shoot-hero .hero-media img{object-position:center 38%!important}
 .brand-shoot-gallery .gallery-grid figure{max-height:350px!important}
 .brand-activations-hero{height:auto!important;min-height:0!important;max-height:none!important}
 .brand-activations-hero .hero-media{height:min(94vw,385px)!important;min-height:0!important}
 .brand-activations-hero .hero-media img{height:100%!important;object-fit:cover!important;object-position:center 47%!important;transform:none!important}
 .brand-activations-gallery .gallery-grid figure{height:auto!important;min-height:0!important;margin-top:0!important}
 .brand-activations-gallery .gallery-grid figure:nth-child(1){grid-column:1 / span 10;aspect-ratio:.83!important;max-height:355px!important}
 .brand-activations-gallery .gallery-grid figure:nth-child(2){grid-column:3 / span 10;aspect-ratio:1.25!important;max-height:280px!important}
 .brand-activations-gallery .gallery-grid figure:nth-child(3){grid-column:1 / span 9;aspect-ratio:.82!important;max-height:340px!important}
 .brand-activations-gallery .gallery-grid figure:nth-child(4){grid-column:4 / span 9;aspect-ratio:.87!important;max-height:345px!important}
 .brand-activations-gallery .gallery-grid figure:nth-child(5){grid-column:1 / span 11;aspect-ratio:1.42!important;max-height:270px!important}
 .brand-activations-gallery .gallery-grid img{width:100%;height:100%;object-fit:cover!important;transform:none!important}
 .brand-activations-gallery .gallery-grid figure:nth-child(1) img{object-position:48% 48%!important}
 .brand-activations-gallery .gallery-grid figure:nth-child(2) img{object-position:center!important}
 .brand-activations-gallery .gallery-grid figure:nth-child(3) img{object-position:center 42%!important}
.brand-activations-gallery .gallery-grid figure:nth-child(4) img{object-position:center 40%!important}
}

/* Website Production: compact portraits on phones; saved desktop frames stay intact. */
@media(max-width:800px){
 .website-production-hero{height:auto!important;min-height:0!important;max-height:none!important}
 .website-production-hero .hero-media{height:min(90vw,360px)!important;min-height:0!important}
 .website-production-hero .hero-media img{height:100%!important;object-fit:cover!important;object-position:center 56%!important;transform:none!important}
 .website-production-gallery .gallery-grid figure{height:auto!important;min-height:0!important;margin-top:0!important}
 .website-production-gallery .gallery-grid figure:nth-child(1){grid-column:1 / span 10;aspect-ratio:.78!important;max-height:380px!important}
 .website-production-gallery .gallery-grid figure:nth-child(2){grid-column:4 / span 9;aspect-ratio:.8!important;max-height:350px!important}
 .website-production-gallery .gallery-grid img{width:100%;height:100%;object-fit:cover!important;transform:none!important}
 .website-production-gallery .gallery-grid figure:nth-child(1) img{object-position:center 54%!important}
.website-production-gallery .gallery-grid figure:nth-child(2) img{object-position:center 35%!important}
}

/* Influencer Campaigns: keep the full group shots and alternate portrait sizes on phones. */
@media(max-width:800px){
 .influencer-campaigns-hero .hero-media{height:min(76vw,290px)!important}
 .influencer-campaigns-hero .hero-media img{object-position:center 48%!important}
 .influencer-campaigns-gallery .gallery-grid figure{height:auto!important;min-height:0!important;margin-top:0!important}
 .influencer-campaigns-gallery .gallery-grid figure:nth-child(1){grid-column:1 / span 11;aspect-ratio:1.5!important;max-height:250px!important}
 .influencer-campaigns-gallery .gallery-grid figure:nth-child(2){grid-column:4 / span 9;aspect-ratio:.82!important;max-height:340px!important}
 .influencer-campaigns-gallery .gallery-grid figure:nth-child(3){grid-column:1 / span 11;aspect-ratio:1.5!important;max-height:250px!important}
 .influencer-campaigns-gallery .gallery-grid figure:nth-child(4){grid-column:3 / span 9;aspect-ratio:.82!important;max-height:340px!important}
 .influencer-campaigns-gallery .gallery-grid figure:nth-child(5){grid-column:2 / span 11;aspect-ratio:1.5!important;max-height:250px!important}
 .influencer-campaigns-gallery .gallery-grid img{width:100%;height:100%;object-fit:cover!important;transform:none!important}
 .influencer-campaigns-gallery .gallery-grid figure:nth-child(2) img{object-position:center 42%!important}
.influencer-campaigns-gallery .gallery-grid figure:nth-child(4) img{object-position:center 54%!important}
}

/* Compact Model Sourcing photos on phones; desktop editor choices are unchanged. */
@media(max-width:800px){
 .model-sourcing-hero .hero-media{height:min(78vw,300px)!important}
 .model-sourcing-hero .hero-media img{object-position:center!important}
 .model-sourcing-gallery .gallery-grid figure{height:auto!important;min-height:0!important;margin-top:0!important}
 .model-sourcing-gallery .gallery-grid img{width:100%;height:100%;object-fit:cover!important;transform:none!important}
 .flair-gallery .gallery-grid figure:nth-child(1){grid-column:1 / span 11;aspect-ratio:1.5!important;max-height:250px!important}
 .flair-gallery .gallery-grid figure:nth-child(2){grid-column:3 / span 10;aspect-ratio:1.5!important;max-height:235px!important}
 .flair-gallery .gallery-grid figure:nth-child(3){grid-column:1 / span 11;aspect-ratio:1.5!important;max-height:250px!important}
 .velvet-gallery .gallery-grid figure:nth-child(1){grid-column:1 / span 11;aspect-ratio:1.5!important;max-height:250px!important}
 .velvet-gallery .gallery-grid figure:nth-child(2){grid-column:4 / span 9;aspect-ratio:.82!important;max-height:340px!important}
 .velvet-gallery .gallery-grid figure:nth-child(3){grid-column:1 / span 9;aspect-ratio:.82!important;max-height:340px!important}
.velvet-gallery .gallery-grid figure:nth-child(4){grid-column:3 / span 9;aspect-ratio:.82!important;max-height:340px!important}
 .content-social-hero .hero-media{height:min(82vw,320px)}
 .content-social-hero .hero-copy h1{font-size:clamp(38px,10vw,60px);line-height:.94}
 .content-social-gallery .gallery-grid figure{max-height:330px}
 /* Keep the uploaded desktop arrangement; give portrait photos compact, staggered phone frames. */
 .content-social-gallery .gallery-grid figure{height:auto!important;min-height:0!important;margin-top:0!important}
 .content-social-gallery .gallery-grid figure:nth-child(1){grid-column:1 / span 11;aspect-ratio:1.5!important;max-height:265px!important}
 .content-social-gallery .gallery-grid figure:nth-child(2){grid-column:4 / span 9;aspect-ratio:.84!important;max-height:340px!important}
 .content-social-gallery .gallery-grid figure:nth-child(3){grid-column:1 / span 11;aspect-ratio:1.32!important;max-height:275px!important}
 .content-social-gallery .gallery-grid figure:nth-child(4){grid-column:3 / span 9;aspect-ratio:.85!important;max-height:340px!important}
 .content-social-gallery .gallery-grid img{width:100%;height:100%;object-fit:cover!important;transform:none!important}
 .content-social-gallery .gallery-grid figure:nth-child(1) img{object-position:center 42%!important}
 .content-social-gallery .gallery-grid figure:nth-child(2) img{object-position:center 48%!important}
 .content-social-gallery .gallery-grid figure:nth-child(3) img{object-position:center 50%!important}
 .content-social-gallery .gallery-grid figure:nth-child(4) img{object-position:center 54%!important}
 .content-social-hero{height:auto!important;min-height:0!important}
 .content-social-hero .hero-media{height:min(65vw,265px)!important;min-height:0!important}
 .content-social-hero .hero-media img{object-fit:cover!important;object-position:center!important;transform:none!important}
}
