@font-face{font-family:Poppins;src:url('/assets/poppins.woff2') format('woff2');font-weight:400;font-display:swap}
:root{--ink:#171719;--muted:#66666c;--paper:#fafafb;--pink:#b72d65;--soft:#f6e6ee;--line:#dfdfe3;--radius:22px;--space:clamp(24px,14vw,240px);--content:1120px;--section:clamp(70px,10vw,130px)}
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:0}body{margin:0;background:var(--paper);color:var(--ink);font-family:Poppins,Arial,sans-serif;font-size:16px;line-height:1.7}a{color:inherit}img{max-width:100%}button{font:inherit;color:inherit;cursor:pointer}a,button{-webkit-tap-highlight-color:transparent}a:focus-visible,button:focus-visible,[tabindex]:focus-visible{outline:3px solid var(--pink);outline-offset:6px}h1,h2,h3,p{margin-top:0}h1,h2,h3{font-family:Arial,Helvetica,sans-serif;font-weight:600;letter-spacing:-.04em;line-height:1.1}h2{font-size:clamp(2rem,3.3vw,3rem);margin-bottom:24px}h3{font-size:1.7rem;margin-bottom:16px}p{color:var(--muted);margin-bottom:24px}.display{font-family:Arial,Helvetica,sans-serif;font-weight:600;line-height:1.15}
header{position:sticky;top:0;z-index:100;padding:16px 0;background:rgba(250,250,251,.95);border-bottom:1px solid var(--line);backdrop-filter:blur(16px)}.nav{width:min(calc(100% - 2 * var(--space)),var(--content));margin:auto;display:flex;align-items:center;justify-content:space-between;gap:28px;position:relative;min-height:54px}.brand{font-family:Arial,Helvetica,sans-serif;font-size:18px;font-weight:600;letter-spacing:-.04em;text-decoration:none;white-space:nowrap}.brand span{color:var(--ink)}.brand::before{content:'✳';color:var(--pink);font-size:30px;vertical-align:middle;margin-right:12px}.nav-links{display:flex;gap:28px;align-items:center}.nav-links a{font-size:14px;text-decoration:none;white-space:nowrap}.nav-links a:hover{color:var(--pink)}.nav-links a:last-child{padding:0;background:transparent;color:var(--ink)}.menu-toggle{display:none;width:48px;height:48px;border:1px solid var(--line);border-radius:50%;background:white;font-size:0;position:relative}.menu-toggle::before,.menu-toggle::after{content:'';position:absolute;width:19px;height:2px;background:var(--ink);left:14px;top:18px;transition:transform .2s}.menu-toggle::after{top:26px}.menu-toggle[aria-expanded=true]::before{transform:translateY(4px) rotate(45deg)}.menu-toggle[aria-expanded=true]::after{transform:translateY(-4px) rotate(-45deg)}.skip{position:fixed;top:-100px;left:20px;background:white;padding:12px;z-index:200}.skip:focus{top:12px}
.wrap{width:min(calc(100% - 2 * var(--space)),var(--content));margin:auto;padding:0}.hero{padding:clamp(24px,4svh,48px) 0}.hero-layout{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);gap:clamp(32px,5vw,70px);align-items:center;min-height:calc(100svh - 87px - clamp(48px,8svh,96px))}.hero-content{max-width:650px;min-width:0}.hero-title-group{position:relative}.eyebrow{font-size:14px;letter-spacing:.14em;color:var(--pink);margin-bottom:24px}.hero h1{font-size:clamp(3.5rem,min(7vw,11svh),6.8rem);font-weight:500;line-height:1.03;letter-spacing:-.06em;margin-bottom:32px}.hero h1 span{font-family:Arial,Helvetica,sans-serif;font-style:normal;font-weight:600;letter-spacing:-.05em;color:var(--pink)}.hero-intro{font-size:18px;line-height:1.7;max-width:560px;margin-bottom:30px}.button{display:inline-flex;justify-content:center;align-items:center;padding:14px 25px;border:1px solid var(--ink);border-radius:999px;background:var(--ink);color:white;text-decoration:none;font-size:14px;font-weight:500;line-height:1.4;min-height:48px;transition:background .2s,border-color .2s}.button:hover{background:var(--pink);border-color:var(--pink)}.button.pink{background:var(--ink);color:white}.hero .button{margin-bottom:32px}.tags{display:flex;flex-wrap:wrap;gap:8px}.tag{font-size:14px;border:1px solid var(--line);border-radius:999px;padding:6px 12px;background:transparent;color:var(--muted)}
.hero-portrait{width:100%;height:clamp(260px,58svh,510px);max-width:480px;justify-self:end;border-radius:180px 180px 30px 30px;background:var(--soft)}

.ticker{overflow:hidden;border-block:1px solid var(--line);padding:16px 0;font-size:13px;letter-spacing:.1em;color:var(--muted)}.ticker-track{display:flex;width:max-content;animation:ticker-scroll 40s linear infinite}.ticker-group,.ticker-item{display:flex;align-items:center;flex:none;white-space:nowrap}.ticker-star{padding:0 40px;color:var(--pink);font-size:19px}.ticker:hover .ticker-track{animation-play-state:paused}@keyframes ticker-scroll{to{transform:translateX(-50%)}}
.panel{padding:var(--section) 0;border:0;background:transparent;box-shadow:none;margin:0;scroll-margin-top:calc(var(--header-height,87px) + 24px - var(--section));border-bottom:1px solid var(--line)}.badge{display:block;font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);margin-bottom:24px;font-family:Poppins,Arial,sans-serif;font-weight:400;line-height:1.4}.about-grid{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,1fr);gap:100px;align-items:center}.about-copy p{max-width:700px}.about-copy p:last-child{margin-bottom:0}.about-graphic{border-left:1px solid var(--line);padding-left:50px}.about-star{display:block;font-size:80px;line-height:1;color:var(--pink);margin-bottom:35px}.about-graphic .display{font-size:24px;margin-bottom:20px}.about-graphic p{font-size:16px;max-width:290px;margin:0}.section-heading{text-align:left;max-width:770px}.section-heading p{max-width:650px}.filters{display:flex;flex-wrap:wrap;gap:10px;margin:32px 0 16px}.filter{background:transparent;border:1px solid var(--line);border-radius:999px;font-size:14px;padding:10px 17px;line-height:1.4;min-height:42px}.filter[aria-pressed=true]{background:var(--ink);border-color:var(--ink);color:white}.filter:hover{border-color:var(--pink)}.result-count{font-size:14px;margin:0 0 32px;color:var(--muted)}
.project-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:44px 26px;align-items:start}.project{display:block;text-decoration:none;min-width:0}.project[hidden]{display:none}.project-media{display:flex;position:relative;aspect-ratio:1.42;overflow:hidden;border-radius:var(--radius);background:#eeeef1;align-items:center;justify-content:center;flex-direction:column;padding:clamp(16px,2vw,28px);gap:18px}.project-media img{display:block;width:100%;height:100%;object-fit:contain;transition:transform .45s}.project:hover .project-media img{transform:scale(1.035)}.project-coeur-dhonneur .project-media{background:#f4e4eb}.project-yearbook .project-media{background:#161416}.project-sport-data .project-media{background:#efeeea}.project-caribana .project-media{background:#1b1721;color:#f3bdd2}.project-take-seat-event .project-media{background:#f0e8ec;color:#372531}.cover-name{font-family:Georgia,serif;font-size:clamp(2rem,3vw,3.5rem);font-style:italic;line-height:1.05;max-width:90%;text-align:center;letter-spacing:-.04em}.cover-discipline{display:none;font-size:13px;text-align:center;max-width:90%;opacity:.75}.project-card-info{display:block;padding:20px 0 0}.project-label{display:block;font-size:24px;font-family:Arial,Helvetica,sans-serif;font-weight:500;letter-spacing:-.03em;line-height:1.25}.project-meta{display:block;color:var(--muted);font-size:14px;margin-top:8px}.project:hover .project-label{color:var(--pink)}
.skills{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 40px}.skill{border-top:1px solid var(--line);padding:32px 0;min-width:0}.skill-number{font-size:12px;letter-spacing:.08em;color:var(--pink);display:block;margin-bottom:20px}.skill h3{text-transform:none;font-size:23px;font-weight:500}.skill p{margin-bottom:0}.skill-tools{display:flex;flex-wrap:wrap;gap:7px;margin-top:20px}.skill-tools span{font-size:13px;color:var(--muted);padding:5px 10px;border:1px solid var(--line);border-radius:999px}.contact-panel{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);gap:60px;align-items:center}.contact-panel h2{font-family:Georgia,serif;font-style:italic;font-weight:400;font-size:clamp(2.8rem,5vw,4.7rem)}.contact-panel p{max-width:600px;margin-bottom:0}.contact-actions{display:flex;gap:14px;justify-content:flex-end;flex-wrap:wrap}.contact-actions .button:last-child{background:transparent;color:var(--ink);border-color:var(--line)}.contact-actions .button:last-child:hover{border-color:var(--pink);color:var(--pink)}footer{padding:40px 0;background:transparent}footer .footer-inner{display:flex;justify-content:space-between;align-items:center;gap:30px;width:min(calc(100% - 2 * var(--space)),var(--content));margin:auto}footer p,footer a{font-size:13px}.footer-name{font-size:18px;letter-spacing:-.03em;margin-bottom:7px}footer p{margin:0}.footer-links{display:flex;gap:20px;flex-wrap:wrap}.footer-links a{text-underline-offset:5px}
.detail-panel{padding-top:38px;border-bottom:0}.detail-heading{padding:40px 0 0}.detail-heading .badge{margin-bottom:18px}.detail-title{font-size:clamp(3.2rem,6.5vw,6.5rem);margin:0 0 40px;line-height:1.04;overflow-wrap:anywhere;font-weight:500}.project-metadata{margin:0 0 70px;display:grid;grid-template-columns:.7fr 1fr 1.8fr;gap:24px;border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:24px 0}.metadata-item{min-width:0}.metadata-item dt{font-size:12px;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);margin-bottom:8px}.metadata-item dd{margin:0;font-size:16px;line-height:1.6;overflow-wrap:anywhere}.project-navigation{display:flex;justify-content:space-between;gap:24px}.project-nav-button{display:flex;flex-direction:column;gap:4px;text-decoration:none;max-width:48%;min-width:0;border:1px solid var(--line);padding:13px 20px;border-radius:14px;background:transparent;transition:border-color .2s,background .2s}.project-nav-button:hover{border-color:var(--pink);background:var(--soft)}.nav-direction{font-size:12px;color:var(--muted)}.nav-project{font-size:17px;line-height:1.3;font-weight:500;overflow-wrap:anywhere}.navigation-top .project-nav-button{color:var(--pink);flex-direction:row;align-items:center;gap:12px;border:0;border-radius:0;padding:10px 0;min-height:44px}.navigation-top .project-nav-button:hover{background:transparent;color:var(--pink)}.nav-arrow{font-size:22px;line-height:1}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.navigation-top .nav-project{font-size:14px}.navigation-bottom{padding-top:40px;margin-top:80px;border-top:1px solid var(--line)}.navigation-bottom .project-nav-button{width:auto;max-width:48%;padding:12px 20px;border-radius:18px;background:transparent;border-color:var(--pink);color:var(--pink)}.navigation-bottom .nav-direction{color:var(--pink)}.navigation-bottom .project-nav-button:hover{background:var(--soft);border-color:var(--pink)}.navigation-bottom .project-nav-button:last-child{text-align:right}
.editorial-layout,.hug-presentation{display:grid;gap:65px}.editorial-row,.hug-introduction{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);gap:60px;align-items:start}.editorial-row-reverse,.hug-role{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.15fr);gap:60px;align-items:start}.editorial-text,.hug-text{min-width:0}.editorial-text h2,.hug-text h2,.detail-copy section h2{font-size:clamp(1.9rem,3vw,2.6rem);font-weight:500;margin-bottom:22px;line-height:1.17}.editorial-text p,.hug-text p{font-size:16px;line-height:1.85;max-width:980px}.editorial-text p:last-child,.hug-text p:last-child{margin-bottom:0}.hug-problem{display:grid;gap:36px}.hug-visual,.editorial-image{margin:0;min-width:0}.hug-visual a,.editorial-image a{display:block;overflow:hidden;border-radius:var(--radius);border:1px solid #e9e9ed}.hug-visual img,.editorial-image img{width:100%;height:auto;display:block;transition:transform .35s}.gallery-link:hover img{transform:scale(1.015)}.hug-role-images,.editorial-image-stack{display:grid;gap:22px}.hug-site-link{text-align:right}.sport-image-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}.reserved-media{aspect-ratio:16/9;display:flex;align-items:center;justify-content:center;overflow:hidden;border:1px solid var(--line);border-radius:var(--radius);background:#f0f0f3;min-width:0}.reserved-media span{font-size:14px;color:#737379;text-align:center;padding:20px}.reserved-media.portrait-media{aspect-ratio:9/16;width:min(100%,300px);justify-self:center}.reserved-media img,.reserved-media video{width:100%;height:100%;object-fit:contain;display:block}.video-examples{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:30px}.video-examples .portrait-media{width:min(100%,260px)}.editorial-results{padding:40px;border-radius:var(--radius);background:var(--soft)}.festival-results{padding-left:20px;line-height:2;color:var(--muted);margin:24px 0}.festival-results strong{color:var(--ink)}.results-credit{font-size:14px}.editorial-link{font-size:14px;color:var(--pink);text-underline-offset:5px}
.detail-grid{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,1fr);gap:60px;align-items:start}.detail-copy{display:grid;gap:36px}.detail-copy section{padding-bottom:30px;border-bottom:1px solid var(--line)}.detail-copy p:last-child{margin:0}.detail-copy li{color:var(--muted);margin-bottom:8px}.project-cover{position:static;padding:24px;background:#efedf2;border-radius:var(--radius);text-align:center}.project-cover img{width:100%;display:block;max-height:460px;object-fit:contain;margin-bottom:24px}.project-cover .display{font-size:24px}.project-cover p{font-size:14px;margin:16px 0 0}.project-gallery{margin-top:70px;padding-top:40px;border-top:1px solid var(--line)}.gallery-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px}.gallery-card{margin:0;min-width:0}.gallery-card img{width:100%;height:340px;object-fit:contain;display:block;background:#f0f0f2;border-radius:var(--radius)}.gallery-card figcaption{font-size:14px;color:var(--muted);padding-top:12px}.gallery-hint{font-size:14px}
.image-viewer{border:0;border-radius:20px;width:min(1120px,94vw);max-height:94vh;padding:24px;background:white;color:var(--ink)}.image-viewer::backdrop{background:#171719dd}.viewer-toolbar,.viewer-nav{display:flex;justify-content:space-between;align-items:center;gap:15px}.viewer-toolbar{margin-bottom:18px}.viewer-toolbar button,.viewer-nav button{border:1px solid var(--line);border-radius:999px;padding:10px 16px;background:white;font-size:14px}.viewer-toolbar .viewer-close{background:var(--ink);color:white;border-color:var(--ink)}.image-viewer img{width:100%;height:62vh;object-fit:contain;display:block}.viewer-caption,.viewer-count{font-size:14px}.viewer-caption{margin:14px 0}.viewer-open{overflow:hidden}
.story-carousel{width:min(100%,330px);justify-self:center;min-width:0}.story-progress{display:flex;gap:6px;margin-bottom:8px}.story-dot{flex:1;border:0;background:none;padding:0;min-height:28px;position:relative}.story-dot::after{content:'';position:absolute;top:12px;left:0;right:0;height:3px;background:#ded7dc;border-radius:3px}.story-dot[aria-current=true]::after{background:var(--pink)}.story-track{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;border-radius:20px;overscroll-behavior-x:contain}.story-track::-webkit-scrollbar{display:none}.story-slide{flex:0 0 100%;min-width:0;scroll-snap-align:start;scroll-snap-stop:always}.story-slide .portrait-media{width:100%}.story-controls{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-top:14px}.story-controls button{border:1px solid var(--line);border-radius:999px;background:white;font-size:14px;padding:9px 13px}.story-controls button:disabled{opacity:.4;cursor:default}.story-position,.story-hint{font-size:14px}.story-hint{text-align:center;margin:14px 0 0}.project-social-links{display:flex;justify-content:center;gap:32px;flex-wrap:wrap}.social-link{display:flex;flex-direction:column;align-items:center;gap:8px;text-decoration:none;font-size:14px}.social-symbol{display:grid;place-items:center;width:56px;height:56px;border-radius:50%;background:var(--ink);color:white;font-size:23px;font-weight:600}.social-link:hover .social-symbol{background:var(--pink)}.social-pending .social-symbol{opacity:.4}.social-pending small{font-size:12px;color:var(--muted)}
@media(max-width:1000px){:root{--space:clamp(24px,6vw,60px)}.project-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.nav-links{gap:18px}.brand{font-size:16px}.hero-layout{gap:40px}.hero h1{font-size:clamp(3.6rem,7.8vw,5.4rem)}.hero-intro{font-size:16px}.about-grid{gap:45px}.about-graphic{padding-left:30px}.contact-panel{gap:40px}.editorial-row,.hug-introduction,.hug-role,.editorial-row-reverse,.detail-grid{gap:35px}}
@media(max-width:760px){:root{--space:24px}header{padding:12px 0}.nav{min-height:48px}.menu-toggle{display:block;flex-shrink:0}.nav-links{display:none;position:absolute;top:65px;left:0;right:0;background:white;padding:26px;border:1px solid var(--line);border-radius:20px;box-shadow:0 16px 40px #17171912;flex-direction:column;align-items:stretch;gap:24px}.nav-links.is-open{display:flex}.nav-links a{font-size:17px}.nav-links a:last-child{text-align:left}.hero{padding:24px 0 48px}.hero-layout{grid-template-columns:minmax(0,1fr);gap:32px;min-height:0}.hero-content{max-width:none;min-height:calc(100svh - 73px - 48px);display:flex;flex-direction:column;justify-content:center;align-items:flex-start}.hero h1{font-size:clamp(3.7rem,13vw,5.7rem);margin-bottom:26px}.hero-intro{font-size:17px;max-width:600px}.hero-portrait{height:420px;max-width:470px;justify-self:center}.hero .tags{gap:8px}.panel{scroll-margin-top:calc(var(--header-height,73px) + 24px - var(--section))}.about-grid{grid-template-columns:minmax(0,1fr);gap:40px}.about-graphic{border:0;border-top:1px solid var(--line);padding:28px 0 0;display:grid;grid-template-columns:65px 1fr;column-gap:20px}.about-star{font-size:55px;grid-row:1/3;margin:0}.about-graphic .display{font-size:20px;margin-bottom:12px}.about-graphic p{max-width:none}.project-grid{grid-template-columns:minmax(0,1fr);gap:36px}.project-media{aspect-ratio:1.35;padding:24px}.project-label{font-size:23px}.cover-name{font-size:clamp(2.6rem,10vw,4.6rem)}.cover-discipline{font-size:14px}.project-card-info{padding:17px 2px 0}.contact-panel{grid-template-columns:minmax(0,1fr);gap:30px}.contact-actions{justify-content:flex-start}.skills{grid-template-columns:minmax(0,1fr)}footer .footer-inner{align-items:flex-start;flex-direction:column;gap:24px}.detail-title{font-size:clamp(2.8rem,10vw,4.8rem);margin-bottom:32px}.detail-heading{padding-top:35px}.detail-heading .badge{margin-bottom:16px}.project-metadata{grid-template-columns:minmax(0,1fr);gap:0;padding:0;margin-bottom:45px}.metadata-item{display:grid;grid-template-columns:110px minmax(0,1fr);gap:15px;border-bottom:1px solid var(--line);padding:16px 0;align-items:start}.metadata-item:last-child{border:0}.metadata-item dt{margin:0;font-size:12px;padding-top:3px}.metadata-item dd{font-size:15px}.editorial-layout,.hug-presentation{gap:42px}.editorial-row,.editorial-row-reverse,.hug-introduction,.hug-role,.detail-grid{grid-template-columns:minmax(0,1fr);gap:28px}.editorial-row-reverse .editorial-text,.hug-role .hug-text{grid-row:1}.editorial-text h2,.hug-text h2,.detail-copy section h2{font-size:1.9rem}.editorial-text p,.hug-text p{line-height:1.8}.sport-image-grid{grid-template-columns:minmax(0,1fr);gap:18px}.video-examples{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:15px;gap:18px}.video-examples .portrait-media{flex:0 0 73%;scroll-snap-align:center;max-width:260px}.editorial-results{padding:28px 22px}.hug-site-link{text-align:left}.hug-site-link .button{width:100%}.project-cover{position:static}.gallery-grid{grid-template-columns:minmax(0,1fr);gap:24px}.gallery-card img{height:auto;max-height:430px}.project-navigation{gap:12px}.navigation-top .project-nav-button{padding:9px 0;width:auto;gap:8px}.navigation-top .project-nav-button:last-child{text-align:right;justify-content:flex-end}.navigation-top .nav-direction{font-size:12px}.navigation-top .nav-project{font-size:13px}.navigation-bottom{margin-top:55px;padding-top:28px}.navigation-bottom .project-nav-button{padding:11px 14px}.nav-project{font-size:15px}.image-viewer{padding:18px}.image-viewer img{height:55vh}.viewer-toolbar .display{font-size:14px}.viewer-toolbar button,.viewer-nav button{font-size:13px;padding:10px 12px}.project-gallery{margin-top:45px}.story-carousel{width:min(100%,330px)}.social-link{font-size:14px}}
@media(max-width:390px){:root{--space:20px}.brand{font-size:14px}.brand::before{font-size:25px;margin-right:8px}.hero h1{font-size:3.6rem}.hero-portrait{height:360px}.hero-intro{font-size:16px}.filter{padding:9px 13px}.contact-actions{flex-direction:column;align-items:stretch}.metadata-item{grid-template-columns:95px minmax(0,1fr)}.detail-title{font-size:2.8rem}.project-meta{font-size:13px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{animation:none!important;transition:none!important}}

@media(min-width:761px) and (max-height:650px){.hero h1{font-size:clamp(3rem,9svh,4.5rem);margin-bottom:20px}.hero .eyebrow{margin-bottom:14px}.hero-intro{font-size:16px;margin-bottom:20px}.hero .button{margin-bottom:20px}.hero-portrait{height:68svh;max-height:400px}}
@media(max-width:760px) and (max-height:700px){.hero h1{font-size:clamp(3rem,12vw,4.5rem);margin-bottom:18px}.hero .eyebrow{margin-bottom:14px}.hero-intro{font-size:16px;margin-bottom:20px}.hero .button{margin-bottom:20px}.hero .tag{font-size:12px;padding:5px 9px}}

/* First-screen composition and project discovery. */
.hero-layout{grid-template-rows:minmax(0,1fr) auto;gap:24px clamp(32px,5vw,70px)}
.hero-content{grid-column:1;grid-row:1}
.hero-portrait{grid-column:2;grid-row:1;height:clamp(240px,50svh,440px)}
.hero .ticker{grid-column:1/-1;grid-row:2;width:100%;margin-top:8px}
.project{border-radius:var(--radius);transition:background .2s,box-shadow .2s}
.project:hover,.project:focus-visible{background:transparent;box-shadow:none}

.project-media{transition:background .2s,color .2s}
.project-viewport{position:relative;isolation:isolate}
.project-scroll{max-height:clamp(360px,62svh,680px);overflow-y:auto;overscroll-behavior-y:auto;scrollbar-width:thin;scrollbar-color:#d6a7bb transparent;padding:10px 12px 12px 10px;margin:-10px -12px -12px -10px}
.project-viewport::after{content:'';position:absolute;z-index:2;bottom:0;left:0;right:0;height:70px;pointer-events:none;background:linear-gradient(transparent,var(--paper));backdrop-filter:blur(2px);mask-image:linear-gradient(transparent,black);opacity:0;transition:opacity .25s}
.project-viewport.has-more::after{opacity:1;animation:discovery-fade 3s ease-in-out infinite}
@keyframes discovery-fade{50%{opacity:.6}}
@media(max-width:760px){.hero-layout{grid-template-rows:auto;gap:24px}.hero-content{min-height:calc(100svh - var(--header-height,73px) - 48px - 65px - 24px)}.hero .ticker{grid-column:1;grid-row:2;margin-top:0}.hero-portrait{grid-column:1;grid-row:3;height:360px;margin-top:24px}.project-scroll{max-height:72svh}.project-viewport::after{height:55px}}
@media(prefers-reduced-motion:reduce){.project-viewport.has-more::after{animation:none}}

/* Interactive states and compact viewport-wide sections. */
body{overflow-x:clip}
.hero .ticker{width:100vw;max-width:none;margin-left:calc((100% - 100vw)/2)}
.nav-links a[aria-current=location]{color:var(--pink)}
.nav-links a{transition:color .2s}
.filters{gap:8px 24px;margin:18px 0 12px}
.filter{border:0;border-radius:0;padding:7px 0;background:transparent;position:relative;transition:color .2s,transform .15s}
.filter::after{content:'';position:absolute;left:0;right:0;bottom:3px;height:2px;background:var(--pink);transform:scaleX(0);transform-origin:left;transition:transform .2s}
.filter[aria-pressed=true]{color:var(--pink);background:transparent;border:0}
.filter:hover{color:var(--pink)}
.filter:hover::after,.filter[aria-pressed=true]::after{transform:scaleX(1)}
.filter:active{transform:translateY(2px)}
.button.pink,.navigation-bottom .project-nav-button{background:var(--pink);border-color:var(--pink);color:white;transition:background .2s,transform .15s,box-shadow .2s}
.button.pink:hover,.navigation-bottom .project-nav-button:hover{background:#952150;border-color:#952150;transform:translateY(-2px);box-shadow:0 5px 15px #b72d6520}
.button.pink:active,.navigation-bottom .project-nav-button:active{transform:translateY(1px) scale(.97);box-shadow:none}
.navigation-bottom .project-nav-item{max-width:48%;display:flex;flex-direction:column;align-items:flex-start;gap:10px}
.navigation-bottom .project-nav-item:last-child{align-items:flex-end;text-align:right}
.navigation-bottom .project-nav-button{max-width:100%;width:auto;padding:12px 20px;border-radius:999px}
.navigation-bottom .nav-direction{color:var(--muted)}
.project-media>img,.project-media>.cover-name{transition:filter .3s,transform .3s}
.project-open{position:absolute;z-index:1;display:flex;align-items:center;gap:14px;padding:10px 12px 10px 18px;border:1px solid #ffffff77;border-radius:999px;background:#17171966;color:white;font-size:13px;backdrop-filter:blur(12px);opacity:0;transform:translateY(8px);transition:opacity .25s,transform .25s}
.project-open span{display:grid;place-items:center;background:white;color:var(--ink);width:30px;height:30px;border-radius:50%;font-size:20px}
.project:hover .project-media>img,.project:hover .project-media>.cover-name,.project:focus-visible .project-media>img,.project:focus-visible .project-media>.cover-name{filter:blur(5px);transform:scale(1.03)}
.project:hover .project-open,.project:focus-visible .project-open{opacity:1;transform:translateY(0)}
.project:active .project-open{transform:scale(.96)}
#projects{height:calc(100svh - var(--header-height,87px));min-height:480px;padding:24px 0;display:flex;flex-direction:column;scroll-margin-top:var(--header-height,87px)}
#projects .badge{margin-bottom:12px}
#projects h2{margin-bottom:16px}
#projects .section-heading p{margin-bottom:0}
#projects .result-count{margin-bottom:14px}
.project-viewport{display:grid;grid-template-columns:minmax(0,1fr) 14px;gap:16px;flex:1;min-height:0}
.project-scroll{max-height:none;height:100%;min-height:0;margin:0;padding:8px 0;scrollbar-width:none}
.project-scroll::-webkit-scrollbar{display:none}
.project-viewport::after{right:30px}
.project-scrollbar{position:relative;border-radius:999px;background:#f0e2e8;border:1px solid #e8d0db;cursor:pointer;touch-action:none;height:100%;min-height:0}
.scrollbar-thumb{position:absolute;top:0;left:2px;right:2px;min-height:30px;border-radius:999px;background:var(--pink);pointer-events:none}
.project-scrollbar[aria-disabled=true]{opacity:.4;cursor:default}
@media(max-width:760px){#projects{min-height:540px}.filters{gap:4px 20px;margin-top:12px}.filter{font-size:13px}.project-viewport{gap:12px;grid-template-columns:minmax(0,1fr) 12px}.project-viewport::after{right:24px}.project-open{font-size:12px}.navigation-bottom .project-nav-button{padding:11px 15px}.nav-project{font-size:14px}}
@media(hover:none){.project-open{opacity:1;transform:none;background:#171719bb;bottom:14px;font-size:12px;padding:7px 9px 7px 13px}.project-open span{width:24px;height:24px}}

/* Scroll cues reflect the remaining projects in each direction. */
.project-scrollbar[hidden]{display:none}
.scrollbar-thumb{left:3px;right:3px;min-height:0}
.project-viewport::before{content:'';position:absolute;z-index:2;top:0;left:0;right:30px;height:60px;pointer-events:none;background:linear-gradient(var(--paper),transparent);backdrop-filter:blur(2px);mask-image:linear-gradient(black,transparent);opacity:0;transition:opacity .25s}
.project-viewport.has-before::before{opacity:1}
@media(max-width:760px){.project-viewport::before{right:24px;height:50px}.scrollbar-thumb{left:2px;right:2px}}

/* About occupies its own screen; discovery fades blend with the page. */
#about{min-height:calc(100svh - var(--header-height,87px));padding:48px 0;display:flex;align-items:center;scroll-margin-top:var(--header-height,87px)}
#about .about-grid{width:100%}
.hero-name{color:inherit;text-decoration:none;transition:color .2s}
.hero-name:hover{color:#952150}
.hero-name:active{color:#7b1940}
.contact-actions .button.linkedin-button{background:#0077B5;border-color:#0077B5;color:white;transition:background .2s,transform .15s,box-shadow .2s}
.contact-actions .button.linkedin-button:hover{background:#005f91;border-color:#005f91;color:white;transform:translateY(-2px);box-shadow:0 5px 15px #0077b520}
.contact-actions .button.linkedin-button:active{transform:translateY(1px) scale(.97);box-shadow:none}
.project-viewport::before,.project-viewport::after{backdrop-filter:none;-webkit-backdrop-filter:none;mask-image:none;-webkit-mask-image:none;animation:none}
.project-viewport::before{background:linear-gradient(to bottom,rgba(250,250,251,1) 0%,rgba(250,250,251,.88) 20%,rgba(250,250,251,0) 100%)}
.project-viewport::after{background:linear-gradient(to top,rgba(250,250,251,1) 0%,rgba(250,250,251,.88) 20%,rgba(250,250,251,0) 100%)}
.project-viewport.has-more::after{animation:none}
@media(max-width:760px){#about{padding:40px 0}}
/* Project browsing follows the page; filters stay within reach. */
#projects{height:auto;min-height:0;padding:48px 0;display:block;overflow:visible}
.filters{position:sticky;top:var(--header-height,87px);z-index:90;background:var(--paper);padding:14px 0 12px;margin:18px 0 12px;border-bottom:1px solid var(--line)}
.project-grid{overflow:visible}
.show-more-wrap{text-align:center;margin-top:38px}
.show-more[hidden]{display:none}
.back-to-top{position:fixed;right:24px;bottom:24px;z-index:95;display:grid;place-items:center;width:52px;height:52px;border:0;border-radius:50%;background:var(--pink);color:white;box-shadow:0 5px 20px #17171920;font-size:28px;transition:background .2s,transform .15s}
.back-to-top[hidden]{display:none}
.back-to-top:hover{background:#952150;transform:translateY(-3px)}
.back-to-top:active{transform:translateY(1px) scale(.94)}
.back-to-top-tooltip{position:absolute;bottom:calc(100% + 12px);right:0;white-space:nowrap;background:var(--ink);color:white;font-size:12px;padding:6px 12px;border-radius:8px;opacity:0;transform:translateY(5px);pointer-events:none;transition:opacity .2s,transform .2s}
.back-to-top:hover .back-to-top-tooltip,.back-to-top:focus-visible .back-to-top-tooltip{opacity:1;transform:translateY(0)}
.viewer-stage{position:relative;padding:0 54px}
.viewer-stage img{width:100%;height:min(62svh,660px);object-fit:contain}
.viewer-stage button{position:absolute;top:50%;transform:translateY(-50%);display:grid;place-items:center;width:44px;height:44px;border:0;border-radius:50%;background:var(--soft);color:var(--pink);font-size:26px;padding:0;transition:background .2s,scale .15s}
.viewer-stage .viewer-prev{left:0}
.viewer-stage .viewer-next{right:0}
.viewer-stage button:hover{background:#ebcbd9}
.viewer-stage button:active{scale:.92}
.viewer-toolbar .viewer-close{display:grid;place-items:center;width:44px;height:44px;padding:0;border:0;border-radius:50%;background:var(--pink);color:white;font-size:30px;line-height:1;flex-shrink:0;transition:background .2s,transform .15s}
.viewer-toolbar .viewer-close:hover{background:#952150}
.viewer-toolbar .viewer-close:active{transform:scale(.92)}
.viewer-toolbar .viewer-close:focus-visible{outline:2px solid #d998b4;outline-offset:2px}
.viewer-nav{justify-content:center}
@media(max-width:760px){#projects{min-height:0;padding:40px 0}.filters{gap:4px 18px;padding:10px 0}.back-to-top{width:46px;height:46px;right:16px;bottom:16px}.viewer-stage{padding:0 34px}.viewer-stage img{height:55svh}.viewer-stage button{width:30px;height:40px;font-size:23px;background:transparent}.viewer-toolbar .viewer-close{width:40px;height:40px;font-size:28px}}
@media(prefers-reduced-motion:reduce){.back-to-top,.viewer-stage button,.viewer-toolbar .viewer-close{transition:none}}
.etoile-print-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px;align-items:start}
.etoile-print-grid .editorial-image img{height:340px;object-fit:contain;background:#f0ece9}
.etoile-publication-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px;align-items:start}
.etoile-publication-grid .editorial-image img{aspect-ratio:4/5;object-fit:contain}
.project-contributors{font-size:14px;margin:0;padding-top:24px;border-top:1px solid var(--line)}
.project-etoile-blanche .project-media{background:#f0ece9}
.project-take-seat-event .project-media{background:#0f513a}
@media(max-width:760px){.etoile-print-grid{grid-template-columns:1fr;gap:20px}.etoile-print-grid .editorial-image img{height:auto}.etoile-publication-grid{grid-template-columns:1fr;gap:20px;max-width:440px;margin:auto}.project-contributors{font-size:13px}}
/* Circular stories and minimal video controls. */
.story-carousel{width:min(calc(100% - 48px),330px)}
.story-stage{position:relative}
.story-stage>button{position:absolute;z-index:3;top:50%;transform:translateY(-50%);display:grid;place-items:center;width:36px;height:36px;border:0;border-radius:50%;background:var(--ink);color:white;font-size:28px;line-height:1;padding:0;transition:background .2s,scale .15s}
.story-stage>.story-previous{left:-24px}
.story-stage>.story-next{right:-24px}
.story-stage>button:hover{background:var(--pink)}
.story-stage>button:active{scale:.92}
.story-stage>button[hidden]{display:none}
.story-hint{margin:0 0 10px;color:var(--pink);font-size:13px;text-align:center}
.story-position{display:block;text-align:center;margin-top:14px}
.video-player{position:relative;width:100%;height:100%}
.video-player video{width:100%;height:100%;object-fit:contain}
.video-controls{position:absolute;z-index:2;top:10px;right:10px;display:flex;gap:8px}
.video-controls button{display:grid;place-items:center;width:38px;height:38px;padding:0;border:0;border-radius:50%;background:#171719d9;color:white;transition:background .2s,transform .15s}
.video-controls button:hover{background:var(--pink)}
.video-controls button:active{transform:scale(.92)}
.charte-crop a{position:relative;aspect-ratio:1213/1050;overflow:hidden}
.charte-crop img{position:absolute;top:0;left:0;width:100%;height:auto}
.etoile-print-grid .editorial-image img{object-fit:cover;object-position:center}
@media(max-width:760px){.story-carousel{width:min(calc(100% - 48px),330px)}.etoile-print-grid .editorial-image img{height:280px;object-fit:cover}}
/* Clear skills, full-frame media and restrained motion. */
.skills-accordion{margin-top:38px;border-top:1px solid var(--line)}
.skill-detail{border-bottom:1px solid var(--line)}
.skill-detail summary{list-style:none;cursor:pointer;display:grid;grid-template-columns:64px minmax(0,1fr) 28px;gap:24px;align-items:start;padding:26px 0;font-family:Arial,Helvetica,sans-serif;font-size:24px;line-height:1.3;letter-spacing:-.02em}
.skill-detail summary::-webkit-details-marker{display:none}
.skill-detail summary:focus-visible{outline:2px solid var(--pink);outline-offset:5px}
.skill-index{color:var(--pink);font-size:18px;padding-top:4px}
.skill-detail small{display:block;font-family:Poppins,Arial,sans-serif;font-size:12px;color:var(--muted);letter-spacing:0;margin-top:9px}
.skill-toggle{font-size:28px;line-height:1;transition:transform .2s}
.skill-detail[open] .skill-toggle{transform:rotate(45deg);color:var(--pink)}
.skill-detail-body{padding:0 52px 32px 88px;max-width:800px}
.skill-detail-body p{margin-bottom:16px}
.skill-detail-body ul{color:var(--muted);padding-left:18px;line-height:1.9;margin:0}
.skill-detail summary:hover{color:var(--pink)}
.video-player video,.reserved-media video{object-fit:cover}
.story-stage>button{background:white;border:1px solid var(--ink);color:var(--ink)}
.story-stage>button:hover{background:var(--soft);color:var(--ink)}
.video-controls button:disabled{background:#dedede;color:#878787;cursor:default;transform:none}
.viewer-stage button{background:var(--ink);color:white}
.viewer-stage button:hover{background:#333}
.viewer-toolbar .viewer-close:focus-visible{outline:0;box-shadow:0 0 0 3px #f6e6ee}
.viewer-toolbar .display{text-align:center;flex:1;padding-left:44px}
.viewer-caption{text-align:center}
.gallery-link{position:relative}
.gallery-link::before{content:'';position:absolute;z-index:1;inset:0;background:#171719;opacity:0;transition:opacity .25s;pointer-events:none}
.gallery-link::after{content:attr(data-caption);position:absolute;z-index:2;left:16px;right:16px;top:50%;transform:translateY(calc(-50% + 8px));color:white;text-align:center;font-size:14px;line-height:1.5;text-shadow:0 1px 5px #000;opacity:0;transition:opacity .25s,transform .25s;pointer-events:none}
.gallery-link:hover::before,.gallery-link:focus-visible::before{opacity:.45}
.gallery-link:hover::after,.gallery-link:focus-visible::after{opacity:1;transform:translateY(-50%)}
.hug-site-link{text-align:left}
.hug-site-link .editorial-link{font-size:15px;color:var(--pink);text-decoration:underline;text-underline-offset:5px}
.ronny-photo-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}
.ronny-photo-grid img{width:100%;aspect-ratio:4/5;object-fit:cover}
.yearbook-banner img{width:100%;max-height:420px;object-fit:contain;background:transparent}
.project .project-media{padding:0;background:transparent}
.project .project-media img{width:100%;height:100%;object-fit:cover}
.hero h1 span{font-family:Georgia,'Times New Roman',serif;font-style:italic;font-weight:400}
.hero-title-group{padding-top:28px;overflow:visible}
.hero-name{display:inline-block;line-height:1.2;clip-path:inset(-.2em 100% -.3em -.2em);animation:name-write 1.2s steps(9,end) .3s forwards}
.hero .eyebrow{position:absolute;left:-8px;top:0;z-index:1;font-size:clamp(24px,2.4vw,34px);font-weight:500;letter-spacing:.04em;line-height:1.1;margin:0;background:none;border:0;transform:rotate(-10deg);transform-origin:left center;animation:hello-arrival 1.1s cubic-bezier(.2,.8,.3,1.2) both}
@keyframes name-write{to{clip-path:inset(-.2em -.2em -.3em -.2em)}}
@keyframes hello-arrival{0%{opacity:0;transform:translateY(-20px) rotate(-24deg) scale(.5)}45%{opacity:1;transform:translateY(5px) rotate(-3deg) scale(1.18)}65%{transform:translateY(-3px) rotate(-15deg) scale(.95)}82%{transform:translateY(1px) rotate(-7deg) scale(1.04)}100%{opacity:1;transform:translateY(0) rotate(-10deg) scale(1)}}
.ticker:hover .ticker-track{animation-play-state:running}
.scroll-reveal{opacity:0;transform:translateY(22px);transition:opacity .65s ease,transform .65s ease}
.scroll-reveal.is-revealed{opacity:1;transform:translateY(0)}
@media(max-width:760px){.skill-detail summary{grid-template-columns:30px minmax(0,1fr) 20px;gap:14px;font-size:20px;padding:22px 0}.skill-detail-body{padding:0 0 26px 44px}.skill-index{font-size:15px}.ronny-photo-grid{gap:12px}.gallery-link::after{font-size:12px}.viewer-stage button{background:var(--ink);color:white}.hero h1{font-size:clamp(3.4rem,12.5vw,5.5rem)}}
@media(prefers-reduced-motion:reduce){.hero-name{clip-path:none}.scroll-reveal{opacity:1;transform:none}.hero .eyebrow{opacity:1;transform:none}}
/* Expanded skills and the two mobile interface projects. */
#skills{position:relative}
.skills-heading{position:sticky;top:var(--header-height,87px);z-index:5;max-width:none;background:var(--paper);padding:18px 0 20px;margin-bottom:0;border-bottom:1px solid var(--line);opacity:1;transform:none;transition:none}
.skills-heading .badge{margin-bottom:10px}.skills-heading h2{margin-bottom:0}
.skills-accordion{margin-top:0;border-top:0}
.skill-detail-body{max-width:none}
.skill-tag-group{margin-top:25px}.skill-tag-group h3{font-family:Poppins,Arial,sans-serif;font-size:12px;font-weight:400;letter-spacing:.02em;color:var(--muted);line-height:1.5;margin-bottom:10px}
.skill-detail-body .skill-tags{display:flex;flex-wrap:wrap;gap:7px;list-style:none;padding:0;line-height:1.5}
.skill-tags li{max-width:100%;overflow-wrap:anywhere;font-size:12px;padding:6px 11px;border:1px solid var(--line);border-radius:999px;color:var(--ink)}
.skill-tag-group.qualities .skill-tags li{background:var(--soft);border-color:transparent}
.skill-tag-group.tools .skill-tags li{background:var(--ink);color:white;border-color:var(--ink)}
.mobile-mockup-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:30px;align-items:start}
.mobile-mockup-grid .editorial-image{width:100%;max-width:300px;justify-self:center}
.mobile-mockup-grid img{width:100%;height:auto;display:block}
.mobile-mockup-grid.mockups-2{grid-template-columns:repeat(2,minmax(0,1fr));width:min(100%,650px);justify-self:center}
.mobile-mockup-grid.mockups-1{grid-template-columns:1fr;width:min(100%,300px);justify-self:center}
.hug-mockup-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px;align-items:start}
.hug-mockup-grid .hug-visual:last-child{grid-column:1/-1}
@media(max-width:760px){.hero-title-group{padding-top:30px}.hero .eyebrow{font-size:26px;left:-4px}.skills-heading{padding:16px 0}.skills-heading h2{font-size:clamp(1.7rem,6.3vw,2.3rem)}.skill-tags li{font-size:11px}.mobile-mockup-grid{grid-template-columns:1fr;gap:24px}.mobile-mockup-grid.mockups-2{grid-template-columns:1fr}.mobile-mockup-grid .editorial-image{max-width:320px}.hug-mockup-grid{grid-template-columns:1fr}.hug-mockup-grid .hug-visual:last-child{grid-column:auto}}
@media(prefers-reduced-motion:reduce){.hero-name{clip-path:none}.hero .eyebrow{animation:none;opacity:1;transform:rotate(-10deg)}}
/* Review: compact phone layouts and natural image proportions. */
.hero-portrait-mobile{display:none}
.navigation-bottom{margin-top:85px;padding-bottom:20px}
@media(max-width:760px){
 .hero-portrait{display:none}
 .hero-title-group{width:100%}
 .hero-portrait-mobile{display:block;position:absolute;top:0;right:0;width:clamp(66px,20vw,86px);height:clamp(72px,22vw,94px);border-radius:60px 60px 8px 8px;background:var(--soft)}
 .hero h1{font-size:clamp(2.8rem,11vw,3.7rem)}
 .hero .eyebrow{font-size:24px}
 .project-grid{gap:16px}
 .project{display:grid;grid-template-columns:minmax(86px,34%) minmax(0,1fr);gap:16px;align-items:center;padding:10px;border:1px solid var(--line);border-radius:24px;background:var(--paper);min-height:136px}
 .project .project-media{aspect-ratio:1/1.12;width:100%;height:auto;border-radius:18px;overflow:hidden;min-width:0}
 .project-card-info{padding:0;min-width:0}
 .project-label{font-size:clamp(18px,5.2vw,23px);line-height:1.2;letter-spacing:-.03em;display:block;margin-bottom:9px}
 .project-meta{font-size:12px;line-height:1.5;display:block}
 .project-open{display:none}
 .mobile-mockup-grid,.mobile-mockup-grid.mockups-2{display:flex;width:100%;max-width:none;gap:18px;overflow-x:auto;scroll-snap-type:x mandatory;scroll-padding-inline:0;padding-bottom:14px;justify-self:stretch;scrollbar-width:thin;scrollbar-color:var(--pink) var(--soft)}
 .mobile-mockup-grid .editorial-image{flex:0 0 min(72vw,240px);width:min(72vw,240px);max-width:none;scroll-snap-align:start}
 .mobile-mockup-grid .editorial-image img{width:100%;height:auto}
 .image-viewer{width:calc(100vw - 24px);max-width:620px;max-height:calc(100dvh - 24px);padding:18px 14px;overflow-y:auto}
 .viewer-stage{display:block;position:relative;padding:0;touch-action:pan-y}
 .viewer-stage button{display:none}
 .image-viewer .viewer-stage img{display:block;width:100%;height:auto;max-height:65dvh;object-fit:contain;margin:auto}
 .image-viewer.viewer-landscape .viewer-stage img{height:auto;max-height:60dvh;object-fit:contain}
 .viewer-caption{margin-top:18px}
 .navigation-bottom{margin-top:85px;padding-top:36px;padding-bottom:22px}
}
/* Concise competency domains: qualities and technical skills share pink tags. */
.skills-intro{max-width:760px;margin:26px 0 30px}
.skill-tag-group.qualities .skill-tags li,.skill-tag-group.technical .skill-tags li{background:var(--soft);border:1px solid #ebc4d5;color:#8c204c}
/* Review: stable interactions, compact spacing and consistent galleries. */
#skills{overflow-anchor:none;padding-bottom:0;border-bottom:0}
#contact{padding-top:64px}
.editorial-results{background:transparent;padding:0;border-radius:0}
.detail-panel{padding-bottom:28px}
.navigation-bottom{margin-top:38px;padding-bottom:0}
.project-contributors{margin-bottom:0}
.viewer-dots{display:flex;justify-content:center;flex-wrap:wrap;gap:10px;padding:8px 0}
.viewer-dot{padding:0;width:10px;height:10px;min-width:10px;min-height:10px;border:1px solid var(--pink);background:transparent;border-radius:50%;position:relative}
.viewer-dot::before{content:'';position:absolute;inset:-7px}
.viewer-dot[aria-current=true]{background:var(--pink)}
.viewer-dot:focus-visible{outline-offset:8px}
.viewer-cropped .viewer-stage img{width:auto;height:min(62svh,660px);aspect-ratio:1213/1050;max-width:100%;object-fit:cover;object-position:top;margin:auto}
@media(max-width:760px){
 .nav-links{padding:12px;gap:6px}
 .nav-links a{padding:13px 16px;border-radius:12px}
 .nav-links a:last-child{padding:13px 16px}
 .nav-links a:active,.nav-links a[aria-current=location]{background:var(--pink);color:white}
 .mobile-mockup-grid,.mobile-mockup-grid.mockups-2{align-items:flex-start;overflow-y:hidden;scrollbar-width:none;padding-bottom:0;overscroll-behavior-x:contain}
 .mobile-mockup-grid::-webkit-scrollbar{display:none}
 .mobile-mockup-grid .editorial-image{align-self:flex-start;transform:none;opacity:1;transition:none}
 .mobile-mockup-grid .editorial-image a{aspect-ratio:9/19.5;display:block}
 .naturaquest-presentation .mobile-mockup-grid .editorial-image a{aspect-ratio:9/16}
 .mobile-mockup-grid .editorial-image img{height:100%;width:100%;object-fit:contain}
 .etoile-print-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
 .etoile-print-grid .editorial-image img{height:auto;aspect-ratio:1;object-fit:cover}
 .etoile-publication-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;max-width:none;margin:0}
 .etoile-publication-grid .editorial-image img{aspect-ratio:4/5;object-fit:contain}
 .viewer-cropped .viewer-stage img{width:100%;height:calc((100vw - 52px)*1050/1213);max-height:65dvh;object-fit:cover;object-position:top}
 #contact{padding-top:44px}
 .navigation-bottom{margin-top:44px;padding-top:28px;padding-bottom:0}
}
/* User-supplied vector icons inherit each control's foreground colour. */
.svg-icon{display:inline-block;flex-shrink:0;width:22px;height:22px;background-color:currentColor;-webkit-mask:var(--icon) center/contain no-repeat;mask:var(--icon) center/contain no-repeat;vertical-align:middle}
.icon-story-left{--icon:url('/assets/icons/story-left.svg')}.icon-story-right{--icon:url('/assets/icons/story-right.svg')}
.icon-arrow-left{--icon:url('/assets/icons/arrow-left.svg')}.icon-arrow-right{--icon:url('/assets/icons/arrow-right.svg')}
.icon-instagram{--icon:url('/assets/icons/instagram.svg')}.icon-tiktok{--icon:url('/assets/icons/tiktok.svg')}.icon-linkedin{--icon:url('/assets/icons/linkedin.svg')}
.story-stage>button .svg-icon{width:17px;height:17px}
.viewer-stage button .svg-icon{width:23px;height:23px}
.nav-arrow{display:inline-flex;align-items:center}.nav-arrow .svg-icon{width:23px;height:23px}
.project-open .svg-icon{display:inline-block;width:19px;height:19px;border-radius:0;background-color:currentColor}
.linkedin-button{gap:9px}.linkedin-button .svg-icon{width:23px;height:23px}
.footer-links .footer-social{display:inline-flex;gap:5px;align-items:center}.footer-social .svg-icon{width:20px;height:20px}
.social-link>.svg-icon{width:24px;height:24px}
/* Transparent monochrome portrait over the existing pink backdrop. */
.hero-portrait,.hero-portrait-mobile{overflow:hidden}
.hero-portrait img,.hero-portrait-mobile img{display:block;width:100%;height:100%;object-fit:contain;object-position:center bottom;filter:grayscale(1)}
/* Contact, ordered skills and photographic composition. */
.brand::before,.about-star{display:none}
.icon-mail{--icon:url('/assets/icons/mail.svg')}.icon-facebook{--icon:url('/assets/icons/facebook.svg')}
.icon-arrow-up{--icon:url('/assets/icons/arrow-right.svg');transform:rotate(-90deg)}
.back-to-top>.svg-icon{width:26px;height:26px}
.show-more[aria-expanded=true]{background:transparent;color:var(--pink);border-color:var(--pink)}
.show-more[aria-expanded=true]:hover{background:var(--soft)}
.social-icon-circle{display:grid;place-items:center;width:54px;height:54px;border:1px solid var(--line);border-radius:50%;background:transparent;color:var(--ink);transition:transform .25s ease,background .2s,color .2s,border-color .2s}
.social-icon-circle .svg-icon{width:25px;height:25px}
.social-link:hover .social-icon-circle,.social-link:focus-visible .social-icon-circle{transform:translateY(-4px) rotate(-7deg);background:var(--soft);border-color:var(--pink);color:var(--pink)}
.social-link:active .social-icon-circle{transform:scale(.9);background:var(--pink);border-color:var(--pink);color:white}
.social-pending{opacity:.55}
.skills-ticker{padding:20px 0;color:var(--ink);background:var(--soft)}
.skills-ticker .ticker-track{animation-duration:48s}
.ticker-skill{display:inline-flex;align-items:center;gap:12px;padding:0 30px;font-size:13px;letter-spacing:.015em;text-transform:none;white-space:nowrap}
.ticker-skill svg{width:30px;height:30px;flex-shrink:0;color:var(--pink)}
.hero-portrait{position:relative;align-self:end;background:transparent;overflow:visible;height:clamp(280px,52svh,470px);isolation:isolate}
.hero-portrait::before{content:'';position:absolute;inset:16% 0 0;background:var(--soft);border-radius:180px 180px 30px 30px;z-index:-1}
.hero-portrait img{position:absolute;bottom:0;left:0;width:100%;height:100%;object-fit:contain;object-position:center bottom;border-radius:0 0 30px 30px}
.about-photo{margin:0;border:0;padding:0;display:block;max-width:330px;justify-self:end}
.about-photo img{display:block;width:100%;aspect-ratio:3/4;object-fit:cover;object-position:center 60%;border-radius:var(--radius)}
.about-photo figcaption{color:var(--muted);font-size:14px;line-height:1.7;margin-top:18px}
.contact-trigger{gap:10px}
.footer-links .footer-social{color:var(--pink)}
.contact-dialog{width:min(480px,calc(100vw - 32px));padding:40px 30px 26px;border:1px solid var(--line);border-radius:24px;background:var(--paper);color:var(--ink);max-height:calc(100dvh - 32px);overflow:auto}
.contact-dialog::backdrop{background:#17171988;backdrop-filter:blur(5px)}
.contact-close{position:absolute;top:12px;right:12px;display:grid;place-items:center;width:36px;height:36px;border:0;border-radius:50%;background:var(--soft);color:var(--pink);font-size:28px;line-height:1}
.contact-dialog-icon{width:34px;height:34px;color:var(--pink);margin-bottom:18px}
.contact-dialog h2{font-size:32px;margin-bottom:14px}.contact-dialog p{font-size:14px}
.contact-dialog input{width:100%;padding:14px 10px;border:1px solid #e7b9cd;border-radius:12px;background:var(--soft);font:inherit;font-size:clamp(13px,3.8vw,17px);text-align:center;color:var(--pink)}
.contact-dialog-actions{display:flex;flex-wrap:wrap;align-items:center;gap:18px;margin-top:22px}
.contact-dialog .copy-status{min-height:22px;margin:16px 0 0;color:var(--pink);font-size:12px}
@media(max-width:760px){.hero-portrait{display:none}.about-photo{display:block;border:0;padding:0;max-width:330px;width:100%;justify-self:center}.about-photo img{grid-row:auto}.ticker-skill{padding:0 22px;font-size:12px}.ticker-skill svg{width:25px;height:25px}.contact-dialog{padding:36px 22px 20px}}
@media(prefers-reduced-motion:reduce){.social-icon-circle{transition:none}.social-link:hover .social-icon-circle,.social-link:focus-visible .social-icon-circle{transform:none}}
.footer-links .footer-social{background:var(--pink);color:white;border-radius:999px;padding:8px 14px;text-decoration:none;transition:background .2s,transform .2s}
.footer-links .footer-social:hover{background:#952150;transform:translateY(-2px)}
@media(min-width:761px){.hero-content{align-self:end}}

/* October review: aligned portraits, a compact travel image and a CV-style timeline. */
@media(min-width:761px){
 .hero-portrait{align-self:stretch;height:auto;margin-top:28px;min-height:320px;max-width:none}
 .hero-portrait img{height:108%;object-fit:cover;object-position:center bottom}
}
.about-photo{width:100%;max-width:360px;align-self:center}
.about-photo img{height:250px;aspect-ratio:auto;object-fit:cover;object-position:50% 52%}
.about-photo figcaption{margin-top:20px;text-align:left}
.career-timeline{display:grid;grid-template-columns:1.2fr 1fr;gap:60px;margin-top:65px;padding:38px;border-radius:22px;background:var(--ink);color:white}
.career-timeline h3{font-family:Poppins,Arial,sans-serif;font-size:12px;font-weight:500;text-transform:uppercase;letter-spacing:.12em;margin:0 0 28px;color:#e2dce0}
.career-timeline ol{list-style:none;margin:0;padding:0 0 0 20px;border-left:1px solid #ffffff35}
.career-timeline li{position:relative;padding:0 0 26px}
.career-timeline li:last-child{padding-bottom:0}
.career-timeline li::before{content:'';position:absolute;left:-25px;top:6px;width:9px;height:9px;border-radius:50%;background:#f38fb9;box-shadow:0 0 0 4px #f38fb918}
.career-timeline h4{font-size:16px;line-height:1.5;margin:0 0 4px;font-weight:500}
.career-timeline p{font-size:12px;line-height:1.8;color:#d4cfd3;margin:8px 0 0}
.career-timeline .timeline-place{color:#f4a5c7;margin:0;font-size:12px}
.footer-links .footer-social[href*="linkedin.com"]{background:#0a66c2;color:white}
.footer-links .footer-social[href*="linkedin.com"]:hover{background:#084e96}
.contact-dialog{text-align:center}
.contact-dialog-actions{flex-direction:column;justify-content:center;align-items:center}
#contact-dialog-title:focus{outline:none}

@media(max-width:760px){
 .hero-title-group{min-height:165px;padding-top:34px}
 .hero-portrait-mobile{top:0;right:0;width:clamp(96px,29vw,125px);height:160px;border-radius:80px 80px 12px 12px}
 .hero-portrait-mobile img{height:108%;max-width:none;object-fit:cover;object-position:center bottom;position:absolute;bottom:0}
 .hero h1{font-size:clamp(2rem,10vw,3.2rem);position:relative;z-index:1;width:max-content;max-width:calc(100% - clamp(96px,29vw,125px) - 8px)}
 .hero h1 span{white-space:nowrap}
 .about-photo{max-width:360px}
 .about-photo img{height:250px}
 .career-timeline{grid-template-columns:1fr;gap:38px;padding:28px 24px;margin-top:40px}
 .image-viewer{height:min(82dvh,720px);max-height:calc(100dvh - 24px);overflow:hidden}
 .image-viewer[open]{display:grid;grid-template-rows:48px minmax(0,1fr) 66px 40px;gap:10px}
 .image-viewer .viewer-toolbar{margin:0;min-height:0}
 .image-viewer .viewer-stage{height:100%;min-height:0;overflow:hidden}
 .image-viewer .viewer-stage img,.image-viewer.viewer-landscape .viewer-stage img{width:100%;height:100%;max-height:none;object-fit:contain}
 .image-viewer.viewer-cropped .viewer-stage img{width:100%;height:100%;max-height:none;aspect-ratio:auto;object-fit:cover;object-position:top}
 .image-viewer .viewer-caption{height:66px;margin:0;overflow-y:auto;display:grid;place-items:center;line-height:1.5;font-size:13px;text-align:center}
 .image-viewer .viewer-nav{height:40px;margin:0;justify-content:center}
 .image-viewer .viewer-dots{padding:0}
}

.viewer-image-frame{display:contents}
@media(max-width:760px){
 .image-viewer .viewer-stage{display:flex;align-items:center;justify-content:center}
 .viewer-image-frame{display:block;width:100%;height:100%;min-height:0;overflow:hidden}
 .viewer-cropped .viewer-image-frame{height:auto;max-height:100%;aspect-ratio:1213/1050;border-radius:0}
}

/* October 20: presentation above the CV timeline, within the same visual system. */
#about{display:block;min-height:0;padding:var(--section) 0}
#about .about-grid{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,1fr);gap:clamp(35px,6vw,90px);align-items:center}
.career-timeline{width:100%;margin-top:65px;padding:44px 0 0;border-top:1px solid var(--line);border-radius:0;background:transparent;color:var(--ink);grid-template-columns:minmax(0,1.25fr) minmax(0,1fr);gap:60px}
.career-timeline h3{color:var(--muted);margin-bottom:28px}
.career-timeline ol{border-color:var(--line)}
.career-timeline h4{color:var(--ink)}
.career-timeline p{color:var(--muted);font-size:13px}
.career-timeline .timeline-place{color:var(--pink);font-size:13px}
.career-timeline li::before{background:var(--pink);box-shadow:0 0 0 4px var(--soft)}
.timeline-item-heading{display:flex;flex-direction:column;gap:6px;margin-bottom:6px}
.timeline-date{color:var(--pink);font-size:11px;line-height:1.5}
.career-timeline .timeline-volunteer-title{margin-top:36px}
#skills{display:block;overflow:visible;padding-bottom:var(--section)}
.skills-heading{position:sticky;top:var(--header-height,87px);visibility:visible}
.contact-dialog{padding:76px 30px 30px}
.contact-dialog>p:not(.copy-status){margin-bottom:32px}
.contact-dialog input{background:#efeff1;border:1px solid #dfdfe3;color:var(--ink);margin:0 0 8px}
.contact-dialog-actions{margin-top:28px;gap:22px}
@media(max-width:760px){
 #about .about-grid{grid-template-columns:minmax(0,1fr);gap:35px}
 .career-timeline{grid-template-columns:minmax(0,1fr);gap:36px;padding:32px 0 0;margin-top:40px}
 .contact-dialog{padding:72px 22px 24px}
 .filters{gap:8px 20px;flex-wrap:wrap}
 .filter{font-size:12px;white-space:normal;text-align:left}
}
/* The final section has its own viewport so the preceding sticky heading can fully leave. */
#contact{min-height:calc(100svh - var(--header-height,87px));scroll-margin-top:var(--header-height,87px)}
.filters{flex-wrap:wrap;gap:8px 24px;overflow:visible}

/* Align the photograph with the title, and the quote with the final paragraph. */
@media(min-width:761px){
 #about .about-grid{align-items:stretch}
 #about .about-photo{display:flex;flex-direction:column;align-self:stretch;max-width:none;width:100%;min-height:320px}
 #about .about-photo img{flex:1 1 0;min-height:0;height:0;width:100%;object-fit:cover;object-position:50% 52%}
 #about .about-photo figcaption{flex:none;margin:20px 0 0}
}
