/* A shared shape language drawn from the Blue View identity. */
:root{--curve-panel:36px;--curve-card:26px;--curve-image:16px}
.project,.about-project{border-radius:var(--curve-card);overflow:hidden}
.project .art img{border-radius:var(--curve-image)}
.hero,.case-hero,.about-hero{border-radius:0 0 44px 44px}
.intro,.capabilities,.contact,.case-overview,.case-process,.case-deliverables,.case-gallery,.case-film,.case-next,.status-band,.approach,.career,.personal-work,.education,.resume-download{border-radius:var(--curve-panel)}
.process-step,.process-step:nth-of-type(even),.case-cover,.portrait,.resume-snapshot,.resume-review{border-radius:var(--curve-card)}
.portrait{overflow:hidden}
.case-gallery figure,.process-step figure,.evidence-shot,.case-hero>.evidence-shot{border-radius:var(--curve-card)}
.case-cover img,.case-gallery img,.process-step img,.evidence-shot img,.player-frame,.case-film video{border-radius:var(--curve-image)}
.expand-image{border-radius:var(--curve-image)}
.button,.filters button,.case-nav a,.about-sections a,.image-viewer button{border-radius:999px}
.image-viewer{border-radius:24px}.image-viewer-stage img{border-radius:12px}
.image-viewer-bar{border-radius:23px 23px 0 0}
header nav a{border-radius:999px;padding:7px 12px;transition:background .18s}header nav a:hover{background:#ffffff12}
/* Small, repeated hexagonal markers; the animated identity stays unframed. */
.intro>.eyebrow,.section-heading>.eyebrow,.capabilities>div>.eyebrow,.contact>.eyebrow,.case-section-head>.label,.case-gallery>.label,.case-next .label{display:flex;align-items:center;gap:12px}
.intro>.eyebrow:before,.section-heading>.eyebrow:before,.capabilities>div>.eyebrow:before,.contact>.eyebrow:before,.case-section-head>.label:before,.case-gallery>.label:before,.case-next .label:before{content:"";display:block;flex:0 0 18px;width:18px;height:18px;background:currentColor;mask:url('brand-shape.svg') center/contain no-repeat;-webkit-mask:url('brand-shape.svg') center/contain no-repeat}
.round-link span,.project-meta>span,.contact-link span{position:relative;isolation:isolate;display:grid;place-items:center;flex:0 0 54px;width:54px;height:54px;border:0;border-radius:0;color:var(--ink,#061f3e);font-size:27px}
.round-link span:before,.project-meta>span:before,.contact-link span:before{content:"";position:absolute;inset:0;z-index:-1;background:var(--cyan);mask:url('brand-shape.svg') center/contain no-repeat;-webkit-mask:url('brand-shape.svg') center/contain no-repeat}
.cyan .project-meta>span:before,.gold .project-meta>span:before,.contact-link span:before{background:var(--navy)}
.cyan .project-meta>span,.gold .project-meta>span,.contact-link span{color:var(--cream)}
.services summary span{display:grid;place-items:center;flex:0 0 32px;width:32px;height:32px;background:url('brand-shape.svg') center/contain no-repeat;color:var(--ink);font-weight:bold}
section.intro,.contact{background-image:url('brand-shape-outline.svg');background-repeat:no-repeat;background-position:110% 50%;background-size:360px}
.case-next{background-image:url('brand-shape-outline.svg');background-repeat:no-repeat;background-position:95% center;background-size:190px}
.services details{border-radius:18px;padding-left:12px;padding-right:12px}
@media(max-width:750px){:root{--curve-panel:24px;--curve-card:20px;--curve-image:12px}.hero,.case-hero,.about-hero{border-radius:0 0 30px 30px}header nav{gap:6px!important}header nav a{padding:7px 8px}.project-meta>span{width:44px;height:44px;flex-basis:44px}section.intro,.contact{background-size:210px;background-position:150% 100%}.case-next{background-position:130% 50%;background-size:160px}}
@media(prefers-reduced-motion:reduce){header nav a{transition:none}}

/* Smooth Sailor: transparent presentation with an artwork-preserving silhouette mask. */
img[src*="sailor-black"],img[src*="sailor-pink"],img[src*="sailor-olive"]{-webkit-mask:url('sailor-outline.svg') center/contain no-repeat;mask:url('sailor-outline.svg') center/contain no-repeat;background:transparent!important;border-radius:0}
.project:has(a[href*="smooth-sailor"]) .art,.case-page.smooth-sailor .case-cover,.case-page.smooth-sailor .process-step figure,.case-page.smooth-sailor .case-gallery figure{background:transparent;color:inherit}

/* Transparent apparel presentation; source artwork remains unchanged. */
img[src*="pv-shirt"]{-webkit-mask:url("pv-shirt-outline.svg") center/contain no-repeat;mask:url("pv-shirt-outline.svg") center/contain no-repeat;background:transparent!important;border-radius:0}
figure:has(img[src*="pv-shirt"]),.case-cover:has(img[src*="pv-shirt"]){background:transparent;color:inherit}
img[src*="pv-hat"]{-webkit-mask:url("pv-hat-outline.svg") center/contain no-repeat;mask:url("pv-hat-outline.svg") center/contain no-repeat;background:transparent!important;border-radius:0}
figure:has(img[src*="pv-hat"]),.case-cover:has(img[src*="pv-hat"]){background:transparent;color:inherit}
img[src*="pv-black"]{-webkit-mask:url("pv-black-outline.svg") center/contain no-repeat;mask:url("pv-black-outline.svg") center/contain no-repeat;background:transparent!important;border-radius:0}
figure:has(img[src*="pv-black"]),.case-cover:has(img[src*="pv-black"]){background:transparent;color:inherit}
img[src*="2026-1-"]{-webkit-mask:url("poker-2026-outline.svg") center/contain no-repeat;mask:url("poker-2026-outline.svg") center/contain no-repeat;background:transparent!important;border-radius:0}
figure:has(img[src*="2026-1-"]),.case-cover:has(img[src*="2026-1-"]){background:transparent;color:inherit}

/* Next-project photo inside the signature rounded hexagon. */
.case-next{background-image:none;display:grid;grid-template-columns:minmax(0,1fr) 200px;align-items:center;gap:20px 40px}
.case-next>.next-project-preview{display:block;position:relative;width:200px;height:200px;grid-column:2;grid-row:1/3;white-space:normal}
.next-project-photo{display:block;width:100%;height:100%;background:var(--navy,#023373);mask:url('brand-shape.svg') center/contain no-repeat;-webkit-mask:url('brand-shape.svg') center/contain no-repeat}
.next-project-photo img{display:block;width:100%;height:100%;object-fit:cover;transition:transform .2s}
.next-project-photo img[src*="pv-shirt"],.next-project-photo img[src*="sailor-"]{object-fit:contain}
.next-project-arrow{position:absolute;bottom:0;right:4px;display:grid;place-items:center;width:42px;height:42px;background:var(--navy,#023373);color:#fff4db;border:2px solid currentColor;border-radius:50%;font-size:26px}
.next-project-preview:hover .next-project-photo img{transform:scale(1.04)}
.case-next>.back-to-work{grid-column:1;justify-self:start}
@media(max-width:650px){.case-next{grid-template-columns:minmax(0,1fr) 140px;gap:20px}.case-next>div{grid-column:1/-1}.case-next>.next-project-preview{width:140px;height:140px;grid-row:2;grid-column:2}.case-next>.back-to-work{grid-row:2;white-space:normal}}
@media(prefers-reduced-motion:reduce){.next-project-photo img{transition:none}}

/* Font-independent arrows with consistent breathing room in every icon. */
.icon-arrow{display:block;width:50%;height:50%;flex:none;overflow:visible}
.round-link span,.project-meta>span,.contact-link span,.next-project-arrow{line-height:1;align-items:center;justify-items:center}
.next-project-arrow .icon-arrow{width:22px;height:22px}

main>section.intro{background-image:url('brand-shape-soft.svg');background-size:460px;background-position:108% 55%}
@media(max-width:600px){main>section.intro{background-size:300px;background-position:135% 100%}}

/* Interior panels follow the homepage spacing and quiet brand watermark. */
.case-page main>section:not(.case-hero),.about-page main>section:not(.about-hero){margin:32px 16px}
.case-page .case-overview,.case-page .case-next,.about-page .approach,.about-page .resume-download{background-image:url('brand-shape-soft.svg');background-repeat:no-repeat;background-size:460px;background-position:108% 55%}
.about-page .contact{background-image:url('brand-shape-soft.svg')}
.case-page .process-step+.process-step{margin-top:40px}
.case-page .case-gallery>div,.about-page .about-projects{gap:40px}
.about-page .about-project h3 .icon-arrow,.about-page .button .icon-arrow{display:inline-block;width:1em;height:1em;vertical-align:-.1em}
@media(max-width:750px){.case-page main>section:not(.case-hero),.about-page main>section:not(.about-hero){margin:24px 10px}.case-page .case-overview,.case-page .case-next,.about-page .approach,.about-page .resume-download{background-size:300px;background-position:135% 100%}.case-page .process-step+.process-step{margin-top:30px}.case-page .case-gallery>div,.about-page .about-projects{gap:30px}}
@media(max-width:380px){.about-page .education h2{font-size:32px}}
