.portfolio-experience{--portfolio-ink:#193c48;--portfolio-ice:#edf6f8;background:#fbfdfd;color:var(--portfolio-ink)}
.portfolio-experience .site-header{background:rgba(251,253,253,.88);backdrop-filter:blur(20px)}
.portfolio-experience .brand{width:230px;height:58px;padding:6px 15px;border:1px solid rgba(185,214,222,.9);border-radius:16px;background:linear-gradient(135deg,rgba(255,255,255,.98),rgba(235,247,249,.9));box-shadow:0 5px 18px rgba(35,83,92,.1)}
.portfolio-experience .brand img{filter:none;opacity:1}
.portfolio-experience .portfolio-hero{position:relative;display:block;min-height:410px;padding:150px 8vw 65px;background:radial-gradient(ellipse at 18% 20%,#fff 0,transparent 47%),linear-gradient(125deg,#fafdfe,#e8f2f5 64%,#f9fcfd);border-bottom:1px solid #dce9ee;overflow:hidden}
.portfolio-experience .page-hero > .portfolio-hero-image{position:absolute;inset:0;overflow:hidden;opacity:.22;mix-blend-mode:multiply}
.portfolio-experience .portfolio-hero-image:after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(238,248,250,.54) 0%,rgba(238,248,250,.74) 55%,rgba(238,248,250,.91) 100%)}
.portfolio-experience .portfolio-hero-image img{width:100%;height:100%;object-fit:cover;object-position:center 37%;filter:saturate(.72) contrast(.9) blur(.2px)}
.portfolio-experience .portfolio-hero-copy{position:relative;z-index:1;flex:0 1 760px;width:100%;max-width:760px!important;min-width:0;align-self:center}
.portfolio-experience .portfolio-hero h1{font-size:clamp(3rem,6vw,5.4rem);line-height:1.12;letter-spacing:-.045em;font-weight:300;margin:24px 0}
.portfolio-experience .portfolio-hero h1 em{color:#3e6571;font-style:normal;font-weight:300}
.portfolio-scroll{position:absolute;left:8vw;bottom:55px;font-size:14px;border-bottom:1px solid #7d9ba6;padding-bottom:10px}
.portfolio-experience .results-library{max-width:1450px;padding:60px 6vw 80px;margin:auto;scroll-margin-top:100px}
.portfolio-experience .result-filters{justify-content:flex-start;gap:12px;border-bottom:1px solid #dce8ec;padding-bottom:26px;margin-bottom:40px}
.portfolio-experience .result-filters button{border-radius:100px;padding:13px 26px;min-height:48px;font-size:16px;background:transparent;border:1px solid #cadde4;color:#294c58}
.portfolio-experience .result-filters button.active{background:#234956;color:white;border-color:#234956}
.portfolio-experience .results-grid{gap:32px;grid-template-columns:repeat(3,minmax(0,1fr))}
.portfolio-experience .result-card{border-radius:3px;background:#fff;border:1px solid #e0eaee;padding:12px;box-shadow:0 14px 45px #2c5c6b08;transition:transform .35s ease,box-shadow .35s ease}
.portfolio-experience .result-card:hover{transform:translateY(-5px);box-shadow:0 20px 50px #2c5c6b15}
.portfolio-experience .result-card img{width:100%;height:auto;aspect-ratio:1/1;object-fit:contain;background:#f1f6f8;border-radius:1px}
.portfolio-experience .result-card>span{padding:20px 4px 12px}
.portfolio-experience .result-card b{font-weight:400;font-size:18px}
.portfolio-experience .result-card small{font-size:14px}
.portfolio-experience .results-grid.is-filtering .result-card:not([hidden]){animation:album-card-in .58s cubic-bezier(.22,.8,.28,1) both;animation-delay:calc(var(--album-index) * 38ms)}
@keyframes album-card-in{from{opacity:0;transform:translateY(10px) scale(.985)}to{opacity:1;transform:translateY(0) scale(1)}}
.portfolio-doctor{display:grid;grid-template-columns:minmax(200px,330px) minmax(280px,700px);justify-content:center;align-items:center;gap:7vw;padding:70px 8vw;background:linear-gradient(135deg,#edf5f7,#fff)}
.portfolio-doctor>img{width:100%;height:360px;object-fit:contain;object-position:bottom}
.portfolio-doctor-copy{padding-top:8px}.portfolio-doctor-copy .eyebrow{margin-bottom:12px}.portfolio-doctor h2{font-size:clamp(1.8rem,3vw,2.8rem);font-weight:300;margin:0 0 16px}
.portfolio-doctor p{font-size:18px;line-height:1.8;max-width:700px;margin-bottom:0}.portfolio-doctor a{display:inline-block;margin-top:20px;padding-bottom:8px;border-bottom:1px solid #b3cad4}
.portfolio-experience .final-cta{background:#e9f3f6;color:#193c48}.portfolio-experience .final-cta h2{font-size:clamp(2.5rem,5vw,4rem)}
.intro-playing{overflow:hidden}.brand-intro{max-width:none;max-height:none;width:100%;height:100%;position:fixed;inset:0;margin:0;padding:0;border:0;background:radial-gradient(ellipse at 35% 28%,#fff 15%,#edf6f9 65%,#dcecf1);color:#294c58;opacity:1;transition:opacity .5s ease}
.brand-intro[open]{display:grid;place-items:center}.brand-intro::backdrop{background:#edf6f9}.brand-intro.leaving{opacity:0;pointer-events:none}
.intro-signature{position:relative;text-align:center;width:min(70vw,380px);overflow:hidden;animation:signature-reveal 1.2s ease both}
.intro-signature img{width:100%;max-height:200px;object-fit:contain}.intro-signature p{font-size:13px;letter-spacing:.12em;margin:14px 0 4px;direction:ltr}.intro-signature small{display:block;font-size:11px;letter-spacing:.16em;direction:ltr}
.intro-light{position:absolute;inset:-30%;background:linear-gradient(110deg,transparent 38%,#fff9 48%,transparent 58%);transform:translateX(-110%);animation:signature-light 1.7s .25s ease forwards;pointer-events:none}
.brand-intro>button{position:absolute;bottom:max(40px,env(safe-area-inset-bottom));left:50%;transform:translateX(-50%);background:transparent;border:0;border-bottom:1px solid #a9c2cd;color:#365d6c;font:inherit;font-size:14px;padding:12px 16px;cursor:pointer}
@keyframes signature-reveal{from{opacity:0;transform:translateY(12px);filter:blur(7px)}to{opacity:1;transform:translateY(0);filter:blur(0)}}
@keyframes signature-light{to{transform:translateX(110%)}}
@media(max-width:850px){.portfolio-experience .results-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}.portfolio-doctor{gap:30px}.portfolio-doctor>img{height:290px}.portfolio-experience .brand{width:205px}}
@media(max-width:560px){.portfolio-experience .portfolio-hero{padding:125px 7vw 50px;min-height:370px}.portfolio-scroll{display:none}.portfolio-experience .results-library{padding:35px 5vw 55px}.portfolio-experience .result-filters{gap:7px;flex-wrap:wrap}.portfolio-experience .result-filters button{padding:10px 17px}.portfolio-experience .results-grid{grid-template-columns:1fr;gap:25px}.portfolio-experience .result-card{padding:10px}.portfolio-doctor{grid-template-columns:1fr;padding:40px 7vw;gap:15px}.portfolio-doctor>img{height:250px}.portfolio-doctor p{font-size:16px}.portfolio-experience .portfolio-hero h1{font-size:clamp(2.7rem,11vw,3.3rem)}.portfolio-experience .brand{width:174px;height:50px;padding:5px 9px;border-radius:13px}}
@media(prefers-reduced-motion:reduce){.brand-intro,.intro-signature,.intro-light,.portfolio-experience .result-card{animation:none;transition:none}.portfolio-experience .result-card:hover{transform:none}}
