.portfolio-page{background:#f5f9fa}.site-header nav .active{color:var(--teal)}.portfolio-hero{padding:clamp(5rem,9vw,9rem) clamp(1.25rem,6vw,7rem) 0;display:grid;grid-template-columns:1.2fr .8fr;gap:5rem;background:#fff;overflow:hidden}.portfolio-hero h1,.browser-head h2,.portfolio-principles h2,.development-note h2,.portfolio-cta h2,.modal-copy h2{margin:0;font-family:Manrope,sans-serif;line-height:.98;letter-spacing:-.06em}.portfolio-hero h1{font-size:clamp(3.6rem,7vw,7.5rem)}.portfolio-hero h1 em{color:var(--teal);font-style:normal}.portfolio-intro{align-self:end;padding-bottom:1rem;color:#536b7e;font-size:1.12rem}.portfolio-intro a{display:inline-block;margin-top:1rem;color:var(--navy);font-weight:800}.color-spectrum{grid-column:1/-1;display:grid;grid-template-columns:repeat(4,1fr);height:13px;margin-top:4rem}.color-spectrum i:nth-child(1){background:#f4a08d}.color-spectrum i:nth-child(2){background:#a99bef}.color-spectrum i:nth-child(3){background:#f1c75b}.color-spectrum i:nth-child(4){background:#65d4c7}.color-spectrum i:nth-child(5){background:#7fb2f0}.color-spectrum i:nth-child(6){background:#6966b4}.color-spectrum i:nth-child(7){background:#ef79ad}.color-spectrum i:nth-child(8){background:#8fd071}.color-spectrum i:nth-child(9){background:#f39a4c}.color-spectrum i:nth-child(10){background:#56c0db}.portfolio-browser{padding:clamp(3.5rem,6vw,6rem) 0}.browser-head{display:flex;justify-content:space-between;align-items:end;gap:3rem;padding:0 clamp(1.25rem,6vw,7rem) 3rem}.browser-head h2{font-size:clamp(3rem,5vw,5.4rem)}.filter-row{display:flex;flex-wrap:wrap;gap:.5rem}.filter{border:1px solid #cbdade;border-radius:100px;padding:.65rem 1rem;background:transparent;color:var(--navy);font:700 .82rem DM Sans;cursor:pointer}.filter.active,.filter:hover{background:var(--navy);border-color:var(--navy);color:#fff}.rail-wrap{position:relative}.product-rail{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(285px,23vw);gap:1rem;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;padding:0 clamp(1.25rem,6vw,7rem) 1.5rem}.product-rail::-webkit-scrollbar{display:none}.portfolio-card{position:relative;display:flex;min-height:610px;flex-direction:column;scroll-snap-align:start;padding:1.3rem;border-radius:7px;transition:transform .25s,opacity .25s}.portfolio-card:hover{transform:translateY(-7px)}.portfolio-card[hidden]{display:none}.portfolio-card .count,.portfolio-card .category{position:absolute;top:1.25rem;font-size:.66rem;font-weight:800;letter-spacing:.12em}.portfolio-card .count{left:1.25rem}.portfolio-card .category{right:1.25rem}.portfolio-card img{width:200px;height:365px;object-fit:fill;margin:2.5rem auto 1rem;filter:drop-shadow(0 18px 17px rgba(8,45,85,.13))}.portfolio-card>div{margin-top:auto}.portfolio-card h3{margin:0;font:800 2rem Manrope;letter-spacing:-.04em}.portfolio-card p{min-height:2.7rem;margin:.5rem 0 1.2rem;color:#456176}.portfolio-card button{display:flex;width:100%;align-items:center;justify-content:space-between;border:0;border-top:1px solid rgba(8,45,85,.2);padding:1rem 0 0;background:none;color:var(--navy);font:800 .82rem DM Sans;cursor:pointer}.c-weight{background:#ffe0d8}.c-peptide{background:#d2f3ee}.c-mens{background:#e3ddff}.c-womens{background:#fff0c7}.c-hair{background:#dcecff}.c-sleep{background:#dddef8}.c-migraine{background:#ffe0ee}.c-nausea{background:#e2f5d7}.c-vitamin{background:#ffe2c9}.c-travel{background:#d9f3f8}.rail-arrow{position:absolute;top:46%;z-index:3;display:grid;width:48px;height:48px;place-items:center;border:0;border-radius:50%;background:var(--navy);color:#fff;font-size:1.2rem;cursor:pointer;box-shadow:0 8px 22px rgba(8,45,85,.2)}.rail-arrow.prev{left:1.3rem}.rail-arrow.next{right:1.3rem}.swipe-note{margin:1rem clamp(1.25rem,6vw,7rem) 0;color:#738795;font-size:.78rem}.portfolio-principles{padding:clamp(6rem,9vw,9rem) clamp(1.25rem,6vw,7rem);display:grid;grid-template-columns:.8fr 1.2fr;gap:6rem;background:#fff}.portfolio-principles h2{font-size:clamp(3rem,5vw,5.5rem)}.principle-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1.5rem}.principle-grid article{border-top:1px solid var(--line);padding-top:1rem}.principle-grid span{font-size:.7rem;color:var(--teal)}.principle-grid h3{margin:3rem 0 .5rem;font:800 1.2rem Manrope}.principle-grid p{color:#5d7283;font-size:.9rem}.development-note{padding:clamp(5rem,8vw,8rem) clamp(1.25rem,7vw,8rem);display:grid;grid-template-columns:1fr 1fr;gap:6rem;background:var(--navy);color:#fff}.development-note h2{font-size:clamp(3rem,5vw,5.2rem)}.development-note>p{align-self:end;color:#b9cad6;font-size:1.05rem}.portfolio-cta{text-align:center;padding:clamp(6rem,10vw,10rem) 1.25rem;background:#e8f8f6}.portfolio-cta h2{font-size:clamp(3rem,5.5vw,6rem)}.portfolio-cta>p:not(.eyebrow){max-width:700px;margin:1.5rem auto 2rem;color:#536d7f}.product-modal{position:fixed;inset:6vh 6vw;z-index:100;display:grid;grid-template-columns:.85fr 1.15fr;overflow:auto;background:#fff;box-shadow:0 30px 90px rgba(0,20,45,.35)}.product-modal[hidden],.modal-backdrop[hidden]{display:none}.modal-backdrop{position:fixed;inset:0;z-index:90;background:rgba(4,24,44,.7);backdrop-filter:blur(5px)}.modal-close{position:absolute;top:1rem;right:1rem;z-index:5;width:44px;height:44px;border:0;border-radius:50%;background:var(--navy);color:#fff;font-size:1.6rem;cursor:pointer}.modal-color{display:grid;place-items:center;background:var(--modal-color,#d2f3ee);overflow:hidden}.modal-color img{width:290px;height:540px;object-fit:fill;filter:drop-shadow(0 25px 25px rgba(8,45,85,.18))}.modal-copy{padding:clamp(3rem,7vw,7rem)}.modal-copy h2{font-size:clamp(3rem,5vw,5.2rem)}.modal-lead{font-size:1.15rem;color:#536b7d}.modal-section{border-top:1px solid var(--line);padding:1.2rem 0}.modal-section h3{font:800 1rem Manrope}.modal-section p{color:#5c7283}.modal-tags{display:flex;flex-wrap:wrap;gap:.5rem;margin:0 0 2rem}.modal-tags span{padding:.45rem .7rem;border-radius:100px;background:#edf5f6;font-size:.72rem;font-weight:700}@media(max-width:900px){.portfolio-hero,.portfolio-principles,.development-note{grid-template-columns:1fr;gap:2.5rem}.portfolio-intro{max-width:650px}.browser-head{align-items:flex-start;flex-direction:column}.product-rail{grid-auto-columns:minmax(280px,72vw)}.principle-grid{grid-template-columns:1fr}.principle-grid h3{margin:1.5rem 0 .5rem}.product-modal{grid-template-columns:1fr;inset:2vh 3vw}.modal-color{min-height:390px}.modal-color img{width:190px;height:350px}.modal-copy{padding:2rem}.rail-arrow{display:none}}@media(max-width:600px){.portfolio-hero{padding-top:4rem}.portfolio-hero h1{font-size:3.4rem}.color-spectrum{margin-top:2rem}.product-rail{grid-auto-columns:84vw}.portfolio-card{min-height:580px}.portfolio-card img{width:185px;height:340px}.filter-row{flex-wrap:nowrap;max-width:100%;overflow-x:auto}.development-note{padding-left:1.25rem;padding-right:1.25rem}.modal-color img{width:170px;height:315px}}
.product-modal{top:50%;left:50%;inset:auto;width:min(1120px,92vw);height:min(660px,88vh);grid-template-columns:36% 64%;overflow:hidden;transform:translate(-50%,-50%);border-radius:14px}.modal-color img{width:205px;height:390px}.modal-copy{display:flex;min-width:0;min-height:0;flex-direction:column;padding:2.35rem 2.7rem 2rem}.modal-header{padding-right:3rem}.modal-copy .eyebrow{margin:0 0 .6rem}.modal-copy h2{font-size:clamp(2.7rem,4.3vw,4.2rem)}.modal-lead{max-width:650px;margin:.85rem 0 1.3rem;font-size:1rem;line-height:1.5}.modal-details{display:grid;grid-template-columns:1fr 1fr;gap:1.5rem}.modal-section{padding:1rem 0 0}.modal-section h3{margin:.1rem 0 .6rem;font-size:.92rem}.modal-section p{margin:0;font-size:.82rem;line-height:1.52}.modal-footer{display:flex;align-items:center;justify-content:space-between;gap:1rem;margin-top:auto;border-top:1px solid var(--line);padding-top:1rem}.modal-tags{max-width:62%;gap:.4rem;margin:0}.modal-tags span{padding:.4rem .62rem;font-size:.67rem}.modal-footer .button{flex:0 0 auto;padding:.8rem 1rem;font-size:.76rem;white-space:nowrap}@media(max-width:900px){.product-modal{inset:auto;top:50%;left:50%;width:94vw;height:min(620px,92vh);grid-template-columns:30% 70%;transform:translate(-50%,-50%)}.modal-color{min-height:0}.modal-color img{width:155px;height:295px}.modal-copy{padding:2rem 1.8rem 1.5rem}.modal-copy h2{font-size:2.7rem}.modal-lead{font-size:.9rem}.modal-details{gap:1rem}.modal-section p{font-size:.76rem}}@media(max-width:600px){.product-modal{height:min(680px,94dvh);grid-template-columns:1fr}.modal-color{display:none}.modal-copy{padding:1.5rem 1.2rem 1.2rem}.modal-header{padding-right:2.7rem}.modal-copy h2{font-size:2.35rem}.modal-lead{margin:.65rem 0 1rem;font-size:.84rem}.modal-details{grid-template-columns:1fr;gap:.8rem}.modal-section{padding-top:.7rem}.modal-section h3{margin-bottom:.3rem}.modal-section p{font-size:.72rem;line-height:1.4}.modal-footer{align-items:flex-start;flex-direction:column;gap:.65rem;padding-top:.75rem}.modal-tags{max-width:100%}.modal-tags span{font-size:.61rem}.modal-footer .button{width:100%;text-align:center}.modal-close{top:.75rem;right:.75rem;width:38px;height:38px}}
.portfolio-card{cursor:pointer}.portfolio-card:focus-visible{outline:4px solid var(--navy);outline-offset:4px}.modal-arrow{position:absolute;top:50%;z-index:6;display:grid;width:44px;height:44px;place-items:center;transform:translateY(-50%);border:0;border-radius:50%;background:var(--navy);color:#fff;font-size:1.25rem;cursor:pointer;box-shadow:0 8px 24px rgba(8,45,85,.2)}.modal-prev{left:1rem}.modal-next{right:1rem}.modal-arrow:focus-visible,.modal-close:focus-visible{outline:3px solid #fff;outline-offset:3px}@media(max-width:600px){.modal-arrow{top:auto;bottom:.85rem;width:38px;height:38px}.modal-prev{left:auto;right:4rem}.modal-next{right:1rem}.modal-footer{padding-right:6rem}}

.portfolio-card.coming-soon{cursor:default;filter:saturate(.38) brightness(1.035);opacity:.76;overflow:hidden;transform:none}.portfolio-card.coming-soon:hover{transform:none;box-shadow:none}.portfolio-card.coming-soon img{filter:grayscale(.35) drop-shadow(0 18px 17px rgba(8,45,85,.1))}.portfolio-card.coming-soon .coming-band{position:absolute;z-index:6;right:-31%;bottom:2.55rem;display:block;width:160%;padding:.72rem 0;background:linear-gradient(90deg,rgba(8,45,85,.92),rgba(12,151,157,.92));color:#fff;text-align:center;font:800 .63rem/1.25 DM Sans,sans-serif;letter-spacing:.09em;text-transform:uppercase;transform:rotate(-8deg);box-shadow:0 8px 18px rgba(8,45,85,.2)}.portfolio-card.coming-soon>div{padding-bottom:3.3rem}.portfolio-card.coming-soon .category:after{content:none}@media(max-width:600px){.portfolio-card.coming-soon .coming-band{bottom:2.2rem;font-size:.56rem}}

.swipe-mobile{display:none}@media(max-width:700px){.swipe-note{display:flex;justify-content:center;margin:1.1rem 1.15rem 0}.swipe-desktop{display:none}.swipe-mobile{display:inline-flex;align-items:center;gap:.65rem;padding:.7rem 1rem;border:1px solid rgba(8,45,85,.14);border-radius:999px;background:#fff;color:var(--navy);font:800 .76rem/1 DM Sans,sans-serif;letter-spacing:.03em;box-shadow:0 8px 24px rgba(8,45,85,.08)}.swipe-mobile b{color:var(--teal);font-size:1.1rem;animation:swipe-nudge 1.4s ease-in-out infinite}@keyframes swipe-nudge{0%,100%{transform:translateX(0)}50%{transform:translateX(7px)}}}

.weight-chooser{position:fixed;z-index:100;top:50%;left:50%;width:min(1040px,92vw);max-height:90vh;overflow:auto;padding:clamp(2.25rem,5vw,4.5rem);background:#fff;box-shadow:0 30px 90px rgba(0,20,45,.35);transform:translate(-50%,-50%)}.weight-chooser[hidden]{display:none}.weight-chooser-close{position:absolute;top:1rem;right:1rem;width:44px;height:44px;border:0;border-radius:50%;background:var(--navy);color:#fff;font-size:1.6rem;cursor:pointer}.weight-chooser h2{margin:0 0 2rem;font:800 clamp(2.8rem,5vw,5.1rem)/.94 Manrope,sans-serif;letter-spacing:-.065em;color:var(--navy)}.weight-chooser h2 em{color:var(--teal);font-style:normal}.weight-options{display:grid;grid-template-columns:1fr 1fr;gap:1rem}.weight-option{display:grid;grid-template-columns:.6fr 1fr;gap:1rem;min-height:335px;padding:1.15rem;border:1px solid #d8e2e7;border-radius:18px;background:#f7fafb;transition:transform .25s,box-shadow .25s,border-color .25s}.weight-option:hover{transform:translateY(-5px);border-color:rgba(9,170,176,.42);box-shadow:0 18px 32px rgba(8,45,85,.12)}.weight-option.orforglipron{background:#ffe5df}.weight-option.semaglutide{background:#e8e3ff}.weight-option img{align-self:center;justify-self:center;width:auto;height:255px;object-fit:contain;filter:drop-shadow(0 16px 14px rgba(8,45,85,.15))}.weight-option div{align-self:center;padding-bottom:.6rem}.weight-option h3{margin:0;font:800 1.42rem/1.05 Manrope,sans-serif;letter-spacing:-.04em}.weight-option span{display:block;margin:.7rem 0 1.05rem;color:#527084;font-size:.85rem}.weight-option b{display:inline-flex;align-items:center;gap:.35rem;font-size:.82rem;color:var(--navy)}.weight-option b i{color:var(--teal);font-size:1.05rem;font-style:normal;transition:transform .2s ease}.weight-option:hover b i{transform:translateX(4px)}@media(max-width:700px){.weight-chooser{padding:3.35rem 1.25rem 1.25rem}.weight-chooser .eyebrow{margin-bottom:.75rem}.weight-chooser h2{margin-bottom:1.25rem;font-size:2.55rem}.weight-options{grid-template-columns:1fr;gap:.8rem}.weight-option{min-height:0;grid-template-columns:100px 1fr;padding:.9rem}.weight-option img{height:155px}.weight-option div{padding-bottom:0}.weight-option span{margin:.45rem 0 .75rem}}

/* Premium transition after the portfolio */
.weight-option-visual{display:grid;place-items:center;min-width:0}
.weight-option-visual img{max-width:100%}
.weight-option-visual{margin:0}.weight-option .weight-fact{margin:.9rem 0 1.05rem;padding-top:.8rem;border-top:1px solid rgba(16,45,75,.16);color:#35566a;font:500 .86rem/1.45 Manrope,sans-serif}@media(max-width:700px){.weight-option .weight-fact{font-size:.79rem;line-height:1.38;margin:.7rem 0 .75rem;padding-top:.6rem}}
.weight-option h3 sup{font-size:.4em;vertical-align:super;letter-spacing:0}.weight-option h3 small{display:block;margin-top:.35rem;font:700 .75em/1.14 Manrope,sans-serif;letter-spacing:-.035em;color:#196977}.swipe-note:has(.swipe-mobile){display:none}@media(max-width:700px){.swipe-note:has(.swipe-mobile){display:flex}}
.weight-visit{display:inline-flex;align-items:center;justify-content:space-between;gap:.65rem;min-height:42px;padding:.55rem .75rem .55rem .9rem;border-radius:999px;background:var(--navy);color:white;font:800 .82rem/1.2 Manrope,sans-serif;transition:transform .2s ease,background .2s ease}
.weight-visit:hover,.weight-visit:focus-visible{background:#0d4677;transform:translateY(-2px)}
.weight-visit i{font-size:1.05rem;font-style:normal;color:#7ce2dd}
.weight-details{display:block;width:max-content;margin-top:.75rem;color:var(--navy);font-size:.78rem;font-weight:700;text-decoration:underline;text-underline-offset:3px}
.weight-visit-note{margin:1rem 0 0;color:#536b7e;font-size:.82rem}
@media(max-width:700px){.weight-visit{min-height:40px;font-size:.73rem;padding:.45rem .7rem}.weight-details{font-size:.73rem}.weight-visit-note{font-size:.76rem;line-height:1.45}}
.weight-intro{display:grid;grid-template-columns:minmax(130px,.52fr) 1fr;align-items:center;gap:clamp(1.25rem,3vw,2.75rem);min-height:285px;padding:clamp(1.1rem,2.5vw,2rem);border:1px solid #d8e2e7;border-radius:18px;background:linear-gradient(135deg,#ffe5df,#f9f5f2)}.weight-intro img{justify-self:center;width:auto;height:245px;object-fit:contain;filter:drop-shadow(0 16px 14px rgba(8,45,85,.15))}.weight-intro p{max-width:510px;margin:0 0 1.3rem;color:#35566a;font:500 clamp(.98rem,1.6vw,1.12rem)/1.5 Manrope,sans-serif}.weight-intro .weight-visit{font-size:.9rem;padding:.72rem 1rem}.weight-chooser .weight-intro+.weight-visit-note{display:none}@media(max-width:700px){.weight-intro{grid-template-columns:95px 1fr;gap:1rem;min-height:0;padding:1rem;border-radius:14px}.weight-intro img{height:155px}.weight-intro p{margin-bottom:1rem;font-size:.84rem;line-height:1.45}.weight-intro .weight-visit{min-height:42px;font-size:.77rem;padding:.52rem .8rem}}
.portfolio-cta.color-transition{position:relative;isolation:isolate;overflow:hidden;background:linear-gradient(180deg,#f5f9fa 0%,#e8f8f6 36%,#dff6f2 100%)}.portfolio-cta.color-transition:before{content:"";position:absolute;z-index:-1;top:0;left:0;right:0;height:12px;background:linear-gradient(90deg,#f4a08d 0 25%,#a99bef 25% 50%,#f1c75b 50% 75%,#65d4c7 75%)}

/* On small screens, the next control sits on the visible category card. */
@media(max-width:700px){.product-rail{grid-auto-columns:80vw;padding-left:7vw;padding-right:7vw}.rail-arrow.next{display:grid;top:50%;left:calc(87vw - 24px);right:auto;width:48px;height:72px;transform:translateY(-50%);border-radius:18px;background:rgba(8,45,85,.88);font:300 3.1rem/.78 Arial,sans-serif;box-shadow:0 10px 28px rgba(8,45,85,.24)}.rail-arrow.prev{display:none}.rail-arrow.next:focus-visible{outline:3px solid #0aa9ae;outline-offset:3px}}

/* Color-led portfolio principles */
.weight-option>div{display:grid;grid-template-rows:auto 9em auto;align-content:center;align-self:stretch}.weight-option h3 .weight-brand{display:inline-block;white-space:nowrap;margin:0;color:inherit;font-size:inherit}.weight-option h3 sup{display:inline;white-space:nowrap}.weight-option .weight-visit{align-self:start;justify-self:start}@media(max-width:700px){.weight-option>div{grid-template-rows:auto auto auto}.weight-option h3{font-size:clamp(1.05rem,4.4vw,1.42rem)}}
.portfolio-principles h2 em{color:var(--teal);font-style:normal}.principle-grid{gap:1rem}.principle-grid .principle-card{position:relative;min-height:390px;overflow:hidden;border:0;border-radius:12px;padding:1.35rem;isolation:isolate}.principle-grid .principle-card.coral{background:#ffe0d8}.principle-grid .principle-card.aqua{background:#d9f3f8}.principle-grid .principle-card.mint{background:#d2f3ee}.principle-grid .principle-card:after{content:"";position:absolute;right:-38px;bottom:-55px;z-index:-1;width:210px;height:210px;border-radius:50%;background:rgba(255,255,255,.4)}.principle-grid .principle-card>span{font-size:.68rem;font-weight:800;letter-spacing:.12em;color:#087f88}.principle-grid .principle-card>div{position:relative;z-index:2;max-width:78%}.principle-grid .principle-card h3{margin:3rem 0 .5rem;font-size:1.35rem}.principle-grid .principle-card p{color:#405d72}.principle-grid .principle-card img{position:absolute;right:-20px;bottom:-35px;z-index:1;width:auto;height:245px;object-fit:contain;filter:drop-shadow(0 14px 16px rgba(8,45,85,.14))}
