/* PHOS case: original identity shown within the portfolio's existing layout. */
:root{--phos-blue:#0a3b7e}
.phos-card-cover{background:var(--phos-blue)}
.phos-card-cover>img:first-child{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center}
.phos-card-shade{position:absolute;inset:0;background:linear-gradient(90deg,rgba(0,27,65,.68),rgba(0,27,65,.2) 75%)}
.phos-card-mark{position:relative;z-index:1;width:54%;height:auto;max-height:55%;object-fit:contain;align-self:flex-start;margin-left:8%;filter:drop-shadow(0 2px 12px rgba(0,28,65,.16))}
/* The opening follows the typographic covers used throughout the portfolio. */
.phos-page .pw-detail-bar{color:#1f2024;border-color:rgba(31,32,36,.3)}
.phos-cover{background:#efefef;color:#1f2024;align-items:center;min-height:100svh;overflow:visible}
.phos-cover .pw-case-cover-inner{display:flex;flex-direction:column;justify-content:space-between;min-height:calc(100svh - clamp(170px,20vh,260px) - 65px);gap:clamp(35px,6vh,70px)}
.phos-cover .pw-hero-meta,.phos-cover .pw-hero-foot{line-height:1.55;flex-wrap:wrap}
.phos-cover-heading{margin:auto 0;min-width:0}
.phos-cover-heading .pw-kicker{color:#626269}
.phos-cover-heading .pw-case-title{font-size:clamp(125px,24vw,360px);line-height:.96;letter-spacing:-.035em;text-align:left;margin:clamp(18px,3vw,40px) 0 20px;white-space:nowrap}
.phos-cover-heading p{font:400 clamp(17px,1.55vw,23px)/1.55 var(--f-body);max-width:560px;margin:0}
.phos-cover .pw-hero-foot{align-items:center;border-top:1px solid rgba(31,32,36,.3);padding-top:18px}
.phos-cover .pw-hero-foot a{color:inherit;text-decoration:none;border-bottom:1px solid currentColor;padding:8px 0;white-space:nowrap}
.phos-photo{margin:0;padding:clamp(22px,4vw,60px) var(--gut) clamp(55px,7vw,105px);background:#e4e4e4;scroll-margin-top:90px}
.phos-photo-stage{position:relative;overflow:hidden;isolation:isolate;aspect-ratio:3/2;background:#0a3b7e}
.phos-photo-image{width:100%;height:100%;object-fit:cover;display:block}
.phos-photo-shade{position:absolute;inset:0;background:linear-gradient(90deg,rgba(0,27,65,.86),rgba(0,27,65,.56) 43%,rgba(0,27,65,.03) 84%)}
.phos-photo-logo{position:absolute;top:8%;left:6%;transform:none;width:min(34%,520px);color:#fff}
.phos-photo-logo img{display:block;width:100%;height:auto;filter:drop-shadow(0 2px 10px rgba(0,20,45,.28))}

.phos-photo figcaption{display:flex;justify-content:space-between;gap:12px 25px;flex-wrap:wrap;padding-top:15px;font:500 11px/1.6 var(--f-body);letter-spacing:.08em;text-transform:uppercase;color:#626269}
.phos-case .cheers-chapters{margin:0 var(--gut);padding:22px 0;display:flex;flex-wrap:wrap;gap:10px 35px}
.phos-case .cheers-chapters a{display:flex;align-items:center;min-height:44px;color:inherit;font:400 13px/1.7 var(--f-body);text-underline-offset:5px}
.phos-case section[id]{scroll-margin-top:110px}
.phos-switch button:focus-visible,.phos-case .cheers-chapters a:focus-visible{outline:2px solid var(--red);outline-offset:5px}
.phos-page .pw-case-copy>div{min-width:0}
.phos-page .pw-case-copy h2,.phos-page .pw-exit h2{font-size:clamp(43px,6vw,105px);line-height:1.04;text-wrap:balance;overflow-wrap:break-word}
.phos-credit{margin-top:35px;border-top:1px solid #b8b8b8;padding-top:15px;font:500 11px/1.6 var(--f-body);letter-spacing:.1em}
.phos-brand-section,.phos-apps{padding:clamp(65px,8vw,120px) var(--gut);border-top:1px solid #b8b8b8;scroll-margin-top:110px}
.phos-section-heading{display:grid;grid-template-columns:1fr 1fr;gap:15px 7vw;margin-bottom:42px}
.phos-section-heading .pw-kicker{grid-column:1/-1}
.phos-section-heading h2{font:800 clamp(42px,5.8vw,95px)/1.02 var(--f-display);margin:0;overflow-wrap:break-word;text-wrap:balance}
.phos-section-heading p{font:400 clamp(15px,1.35vw,20px)/1.75 var(--f-body);max-width:580px;margin:0;align-self:end}
.phos-switch{display:flex;gap:8px 24px;flex-wrap:wrap;border-top:1px solid #b8b8b8;padding:13px 0}
.phos-switch button{font:500 12px/1.5 var(--f-body);color:#626269;background:none;border:0;border-bottom:2px solid transparent;padding:10px 0;min-height:44px;cursor:pointer}
.phos-switch button[aria-pressed=true]{color:#1f2024;border-color:#8e1515}
.phos-logo-stage{background:#fff;min-height:clamp(300px,42vw,560px);display:grid;place-items:center;padding:clamp(28px,6vw,85px);transition:background .35s}
.phos-logo-stage[data-surface=blue]{background:var(--phos-blue)}
.phos-logo-stage img{width:min(100%,600px);max-height:490px;height:auto;object-fit:contain}
.phos-caption{font:400 12px/1.7 var(--f-body);color:#626269;margin:13px 0 0}
.phos-colour-copy{padding-bottom:60px}
.phos-palette{display:grid;grid-template-columns:1fr 1fr;margin:0 var(--gut) clamp(48px,6vw,80px)}
.phos-swatch{min-height:clamp(220px,28vw,340px);padding:25px;display:flex;flex-direction:column;justify-content:space-between;font:500 12px/1.5 var(--f-body);letter-spacing:.1em}
.phos-swatch strong{font:800 clamp(30px,5vw,70px)/1 var(--f-display);letter-spacing:0}
.phos-swatch-blue{background:var(--phos-blue);color:#fff}.phos-swatch-white{background:#fff;color:var(--phos-blue)}
.phos-app-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(10px,2vw,26px)}
.phos-app-grid figure{min-width:0;margin:0}.phos-app-grid img{width:100%;height:auto;aspect-ratio:1/1;object-fit:contain;display:block;background:#f3f1ed}.phos-app-grid figcaption{font:400 12px/1.6 var(--f-body);color:#626269;padding-top:12px}
@media(max-width:900px){.phos-app-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.phos-app-grid figure:last-child{grid-column:1/-1;max-width:calc(50% - 10px);justify-self:center}}
@media(max-width:760px){.phos-cover{padding-top:185px;min-height:100svh}.phos-cover .pw-case-cover-inner{min-height:calc(100svh - 185px - 80px);gap:32px}.phos-cover-heading .pw-case-title{font-size:clamp(104px,27vw,180px);margin:25px 0 17px}.phos-cover-heading p{font-size:16px;max-width:30ch}.phos-photo{padding:18px var(--gut) 60px}.phos-photo-stage{aspect-ratio:4/5}.phos-photo-image{object-position:58% center}.phos-photo-shade{background:linear-gradient(180deg,rgba(0,27,65,.44),rgba(0,27,65,.14) 42%,transparent 70%)}.phos-photo-logo{top:6%;bottom:auto;left:6%;transform:none;width:58%}.phos-page .pw-case-copy h2{font-size:clamp(43px,10vw,74px)}.phos-section-heading{grid-template-columns:1fr;gap:18px}.phos-section-heading .pw-kicker{grid-column:auto}.phos-section-heading h2{font-size:clamp(42px,10vw,68px)}.phos-app-grid figcaption{font-size:12px}.phos-swatch{min-height:200px;padding:15px}.phos-swatch strong{font-size:clamp(20px,5vw,40px)}}
@media(max-width:440px){.phos-card-mark{width:54%}.phos-cover{padding-top:195px}.phos-cover .pw-case-cover-inner{min-height:calc(100svh - 195px - 80px)}.phos-cover-heading .pw-case-title{font-size:clamp(100px,27vw,145px)}.phos-cover .pw-hero-foot a{white-space:normal}.phos-palette{grid-template-columns:1fr}.phos-swatch{min-height:190px}.phos-app-grid{grid-template-columns:1fr;gap:24px}.phos-app-grid figure:last-child{grid-column:auto;max-width:none}.phos-app-grid img{aspect-ratio:1/1}}
@media(prefers-reduced-motion:reduce){.phos-logo-stage{transition:none}}


.phos-app-media{position:relative;width:100%;aspect-ratio:1/1;overflow:hidden;background:#f3f1ed}.phos-app-grid .phos-app-media>img{display:block;width:100%;height:100%;aspect-ratio:auto;object-fit:cover}

@media(max-width:760px){.phos-photo-logo{top:6%;left:6%;width:58%}}

/* The original PHOS motif follows the palette; physical product mockups are limited to tag and label concepts. */
.phos-pattern{padding:0 var(--gut) clamp(65px,8vw,120px);scroll-margin-top:110px}
.phos-pattern-intro{border-top:1px solid #b8b8b8;padding:clamp(30px,4vw,55px) 0 28px;display:grid;grid-template-columns:1fr 1fr;gap:12px 7vw}
.phos-pattern-intro .pw-kicker{grid-column:1/-1}
.phos-pattern-intro h2{font:800 clamp(42px,5.8vw,95px)/1.02 var(--f-display);margin:0;overflow-wrap:break-word}
.phos-pattern-intro p{font:400 clamp(15px,1.35vw,20px)/1.75 var(--f-body);max-width:580px;margin:0;align-self:end}
.phos-pattern-art{background-color:var(--phos-blue);background-image:url("../phos/pattern-white.svg");background-repeat:repeat;background-position:center;background-size:465px 129px;height:clamp(205px,27vw,340px)}
.phos-app-grid figure{min-width:0}
.phos-app-grid img{object-fit:cover}
.phos-app-grid .phos-white-tag>img.phos-tag-logo{position:absolute;left:32.7%;top:40.2%;width:34.7%;height:auto;aspect-ratio:1186/603;object-fit:contain;background:transparent;pointer-events:none}
@media(max-width:760px){.phos-pattern-intro{grid-template-columns:1fr;gap:17px}.phos-pattern-intro .pw-kicker{grid-column:auto}.phos-pattern-intro h2{font-size:clamp(42px,10vw,68px)}.phos-pattern-art{background-size:310px 86px;height:215px}}
@media(max-width:440px){.phos-pattern-art{height:200px}}