@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Space+Grotesk:wght@400;500;600;700&display=swap');
:root{--paper:#f5f5f1;--ink:#171919;--muted:#616462;--line:#cfd1ca;--acid:#d8f348;--blue:#2648ce;--display:'Space Grotesk',Arial,sans-serif}
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:24px}body{margin:0;background:var(--paper);color:var(--ink);font:16px/1.6 'DM Sans',Arial,sans-serif}button,input{font:inherit}button{cursor:pointer}button,a,input,summary{-webkit-tap-highlight-color:transparent}button{color:inherit}a{color:inherit;text-decoration:none}button:focus-visible,a:focus-visible,summary:focus-visible,input:focus-visible{outline:3px solid var(--blue);outline-offset:4px}h1,h2,h3,p{margin:0}h1,h2,h3{font-family:var(--display);font-weight:500}img{max-width:100%}.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}.skip{position:fixed;left:15px;top:-100px;z-index:100;background:var(--acid);padding:12px}.skip:focus{top:15px}.reading-progress{position:fixed;top:0;left:0;width:100%;height:4px;background:var(--blue);z-index:90;transform:scaleX(0);transform-origin:left;pointer-events:none}
header{margin:0 4%;min-height:105px;display:flex;align-items:center;gap:25px;border-bottom:1px solid var(--ink)}.wordmark{font-family:var(--display);font-size:58px;line-height:1;font-weight:700;letter-spacing:-6px}.wordmark span{color:var(--blue);margin-left:6px}.identity{font-size:15px;font-weight:600;line-height:1.5}.identity span{display:block;font-weight:400;font-size:12px;color:var(--muted)}nav{display:flex;align-items:center;margin-left:auto;gap:30px;font-size:14px}nav a{border-bottom:1px solid transparent}nav a:hover{border-color:currentColor}nav sup{font-size:10px;margin-left:4px}.nav-cta{font-size:14px;margin-left:22px;padding:10px 15px;border:1px solid var(--ink);border-radius:2px}.nav-cta:hover{background:var(--ink);color:var(--paper)}
.hero{margin:0 4%;padding-top:25px}.hero-stage{width:100%;height:clamp(350px,47vw,650px);background:#e4e4e1;position:relative;overflow:hidden}.hero-project{position:absolute;inset:0;border:0;padding:0;width:100%;height:100%;background:transparent}.hero-project img{display:block;width:100%;height:100%;object-fit:cover;object-position:center}.hero-project:after{content:'Voir le projet ↗';position:absolute;bottom:24px;right:24px;background:var(--acid);color:#202615;border-radius:50%;width:105px;height:105px;display:grid;place-content:center;font-size:13px;transform:rotate(-10deg);transition:transform .25s}.hero-project:hover:after{transform:rotate(0)}.hero-segments{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px;margin-top:10px}.hero-segments button{position:relative;border:0;background:#dcded7;height:29px;text-align:left;padding:0 8px;font-size:11px;overflow:hidden}.hero-segments button:before{content:'';position:absolute;inset:0;background:var(--ink);transform:scaleX(0);transform-origin:left}.hero-segments button span{position:relative;z-index:1}.hero-segments button[aria-pressed=true]{background:var(--acid)}.is-playing .hero-segments button[aria-pressed=true]:before{background:#b7d52f;animation:hero-time 5s linear both}@keyframes hero-time{to{transform:scaleX(1)}}.hero-bar{display:flex;justify-content:space-between;align-items:center;gap:28px;padding:20px 0 24px;border-bottom:1px solid var(--ink)}.hero-caption{display:flex;flex-direction:column;gap:4px;min-width:0}#hero-project-name{font-family:var(--display);font-size:25px;line-height:1.25}#hero-project-category{color:var(--muted);font-size:14px}.hero-controls{display:flex;align-items:center;gap:12px;flex-shrink:0;font-size:13px}.hero-controls button,.gallery-controls button{width:42px;height:42px;border:1px solid var(--line);background:transparent;border-radius:50%}.hero-controls button:hover,.gallery-controls button:hover{background:var(--acid);color:var(--ink)}#hero-pause{width:auto;min-width:78px;border-radius:0;padding:0 12px}#hero-counter{min-width:48px;text-align:center}
.eyebrow{font-size:12px;font-weight:500;letter-spacing:1.5px;margin-bottom:26px;line-height:1.5}.projects{margin:0 4%;padding:90px 0}.section-head{display:flex;justify-content:space-between;align-items:flex-end;gap:30px}.section-head h2{font-size:clamp(50px,7.5vw,108px);line-height:.99;letter-spacing:-5px}.section-head h2 span{color:var(--muted)}.section-head>p{font-size:16px;color:var(--muted);margin-bottom:7px;line-height:1.7}.project-tools{display:flex;justify-content:space-between;align-items:end;gap:22px;margin:42px 0 20px}.search-field{display:flex;flex-direction:column;gap:6px;width:min(440px,65%);font-size:12px;color:var(--muted)}.search-field input{border:0;border-bottom:1px solid var(--ink);padding:10px 0;background:none;color:var(--ink);width:100%;font-size:16px;border-radius:0}.view-switch{display:flex;border:1px solid var(--ink);padding:3px;gap:3px}.view-switch button{background:transparent;border:0;padding:8px 18px;font-size:14px}.view-switch button[aria-pressed=true]{background:var(--ink);color:var(--paper)}.filters{display:flex;flex-wrap:wrap;gap:7px}.filters button{font-size:13px;line-height:1.4;border:1px solid var(--line);border-radius:0;background:transparent;padding:9px 12px;display:flex;gap:10px;align-items:center}.filters button.active{background:var(--acid);border-color:var(--acid);color:#202615}.filters button:hover{border-color:var(--ink)}.filters button span{font-size:11px;opacity:.65}.result-count{font-size:12px;color:var(--muted);margin:18px 0 30px}.project-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:55px 30px}.project,.project-button,.project-cover,.project-meta,.project-meta>div{min-width:0;max-width:100%}.project:nth-child(even){padding-top:65px}.project-button{display:block;width:100%;text-align:left;background:none;padding:0;border:0}.project-cover{width:100%;height:330px;min-height:0;aspect-ratio:auto;background:var(--card-bg);color:var(--card-fg);padding:25px;display:flex;flex-direction:column;justify-content:space-between;gap:18px;position:relative;overflow:hidden;transition:transform .3s;border-radius:3px}.cover-top{display:flex;align-items:start;justify-content:space-between;gap:16px;font-size:12px;letter-spacing:.7px;line-height:1.4}.project-number{font-family:var(--display);font-size:38px;line-height:1;opacity:.55;flex-shrink:0;letter-spacing:-2px}.cover-title{font-family:var(--display);font-size:clamp(34px,4.2vw,64px);line-height:1.07;letter-spacing:-2px;overflow-wrap:anywhere;max-width:100%;transition:transform .3s}.cover-title-long{font-size:clamp(31px,3.7vw,54px)}.cover-bottom{display:flex;justify-content:space-between;align-items:center;gap:15px;font-size:14px}.open-project{width:40px;height:40px;border:1px solid currentColor;border-radius:50%;display:grid;place-items:center;font-size:24px;flex-shrink:0;transition:transform .3s}.project-button:hover .project-cover{transform:translateY(-5px)}.project-button:hover .open-project{transform:rotate(45deg)}.project-meta{display:flex;justify-content:space-between;gap:20px;margin-top:18px}.project-meta h3{font-size:20px;line-height:1.35;margin-bottom:7px;overflow-wrap:anywhere}.project-meta p{font-size:14px;line-height:1.55;color:var(--muted);max-width:410px}.project-meta>span{font-size:12px;white-space:nowrap;padding-top:5px;color:var(--muted)}.project-grid.list-view{display:block}.list-view .project{padding:0;border-top:1px solid var(--line)}.list-view .project:last-child{border-bottom:1px solid var(--line)}.list-view .project-button{display:grid;grid-template-columns:180px minmax(0,1fr);gap:26px;padding:20px 0;align-items:center}.list-view .project-cover{height:105px;padding:12px;gap:5px}.list-view .cover-title{font-size:20px;letter-spacing:-.6px}.list-view .cover-top{display:none}.list-view .cover-bottom{font-size:10px;line-height:1.3}.list-view .open-project{width:25px;height:25px;font-size:16px}.list-view .project-meta{margin:0}.list-view .project-meta h3{font-size:25px}.empty-state{grid-column:1/-1;padding:55px 25px;border:1px solid var(--line)}.empty-state p{margin:12px 0}.empty-state button{border:0;border-bottom:1px solid;background:none;padding:5px 0}
.expertises{padding:80px 4%;background:var(--ink);color:var(--paper);display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.4fr);gap:70px}.expertises h2,.about h2,.testimonials h2,.pricing h2{font-size:clamp(42px,5.2vw,78px);line-height:1.02;letter-spacing:-3px}.expertises .eyebrow{color:var(--acid)}.section-intro{margin-top:28px;max-width:350px;color:#b9bdb5;line-height:1.75}.expertise-list details{padding:23px 0;border-bottom:1px solid #454943}.expertise-list details:first-child{border-top:1px solid #454943}.expertise-list summary{display:flex;align-items:start;list-style:none;cursor:pointer;gap:17px;line-height:1.35;font-family:var(--display);font-size:23px}.expertise-list summary::-webkit-details-marker{display:none}.num{font-family:'DM Sans',Arial,sans-serif;font-size:12px;color:#a3a99f;padding-top:6px}.plus{margin-left:auto;flex-shrink:0;font-size:23px;color:var(--acid)}.plus:after{content:'+'}.expertise-list details[open] .plus:after{content:'−'}.expertise-list p{margin:18px 0 0 33px;color:#c6cac2;line-height:1.75}.expertise-list p.service-tags{font-size:13px;color:var(--acid);margin-top:15px}.about{padding:90px 4%}.about-content{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.4fr);gap:70px}.about-content h2{font-size:clamp(64px,10vw,145px);letter-spacing:-6px}.about-content p{margin-bottom:20px;color:var(--muted);max-width:620px}.about-content .about-lead{font-size:25px;font-family:var(--display);color:var(--ink);line-height:1.4}.stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:30px;padding-top:35px;margin-top:42px;border-top:1px solid var(--ink)}.stats strong{font-family:var(--display);font-size:clamp(42px,6vw,88px);font-weight:400;letter-spacing:-4px;line-height:1.1;display:block}.stats span{font-size:14px;color:var(--muted);display:block;margin-top:12px;max-width:230px}.testimonials{padding:75px 4%;border-top:1px solid var(--line)}.quotes{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:55px;margin-top:38px}.quotes details{border-top:1px solid var(--line);padding:22px 0}.quotes summary{font-family:var(--display);font-size:20px;cursor:pointer;line-height:1.4}.quotes summary span{display:block;color:var(--muted);font-family:'DM Sans',Arial,sans-serif;font-size:13px;margin:8px 0 0 22px}.quotes blockquote{margin:20px 0 0;font-size:16px;line-height:1.75;color:var(--muted)}.pricing{padding:80px 4%;background:#e7e9e1}.offer-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:0;margin-top:45px;border:1px solid #b9bdb1}.offer{padding:25px 20px;display:flex;flex-direction:column;border-right:1px solid #b9bdb1;min-width:0}.offer:last-child{border-right:0}.offer h3{font-size:20px}.offer-price{font-family:var(--display);font-size:28px;letter-spacing:-1.1px;margin:18px 0;line-height:1.2}.offer>p:not(.offer-price){font-size:14px;color:#5b6056;line-height:1.7}.offer ul{padding-left:18px;font-size:14px;line-height:1.8;margin:20px 0 30px}.offer a{margin-top:auto;border-top:1px solid #b9bdb1;padding-top:15px;font-size:14px}.offer a:hover{text-decoration:underline}.contact{padding:80px 4% 60px;background:var(--acid);color:#202615}.contact h2{font-size:clamp(48px,8.8vw,128px);line-height:.99;letter-spacing:-5px;position:relative}.contact h2>span{display:inline-block;margin-left:20px;transition:transform .3s}.contact:hover h2>span{transform:translate(6px,-6px)}.contact-bottom{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:50px;margin-top:45px;border-top:1px solid #a1b72e;padding-top:30px}.contact-bottom p{line-height:1.75;font-size:16px}.contact-email{font-size:clamp(16px,2vw,25px);line-height:1.5;border-bottom:1px solid;overflow-wrap:anywhere}.copy-email{display:block;border:0;background:none;padding:10px 0;text-decoration:underline;text-underline-offset:4px;font-size:13px}.contact-bottom>div>p{font-size:13px;margin-top:22px}#copy-status{font-size:13px}footer{background:var(--ink);color:var(--paper);display:flex;justify-content:space-between;align-items:center;gap:25px;padding:30px 4%;font-size:13px}.footer-name{font-family:var(--display);font-size:18px}.social-links{display:flex;gap:25px}footer a:hover{color:var(--acid)}
dialog{width:min(960px,calc(100% - 28px));max-width:100%;max-height:92dvh;border:0;padding:0;background:var(--paper);color:var(--ink);border-radius:3px;overscroll-behavior:contain}dialog::backdrop{background:#0b100ede;backdrop-filter:blur(7px)}.close{position:sticky;float:right;top:15px;margin:15px 15px -55px 0;width:42px;height:42px;background:var(--paper);color:var(--ink);border:1px solid #ccc;border-radius:50%;z-index:5}.dialog-hero{padding:48px 36px 35px}.dialog-hero .eyebrow{padding-right:40px;margin-bottom:20px}.dialog-hero h2{font-size:clamp(32px,5vw,58px);letter-spacing:-2px;line-height:1.08;overflow-wrap:anywhere}.case-summary{font-size:20px;line-height:1.5;margin-top:20px;max-width:680px}.case-client{font-size:13px;margin-top:20px;opacity:.8}.gallery{padding:25px 25px 0;min-width:0}.gallery-stage{position:relative;height:clamp(220px,48vw,480px);max-height:58dvh;min-height:0;background:#e7e8e3;overflow:hidden;touch-action:pan-y}.gallery-stage img{width:100%;height:100%;object-fit:cover;display:block}.gallery-stage.show-whole img{object-fit:contain}.fit-image{position:absolute;bottom:12px;right:12px;background:var(--paper);border:1px solid var(--line);padding:7px 12px;font-size:12px;border-radius:20px}.gallery-controls{display:flex;align-items:center;gap:15px;padding:15px 0}.gallery-controls span{font-size:14px;min-width:42px;text-align:center}.gallery-controls a{margin-left:auto;font-size:13px;text-decoration:underline;text-underline-offset:4px}.gallery-thumbs{display:flex;gap:10px;overflow-x:auto;padding:4px 2px 12px;position:relative}.gallery-thumbs button{padding:2px;background:#e7e8e3;border:2px solid transparent;border-radius:2px;flex:0 0 95px}.gallery-thumbs button[aria-pressed=true]{border-color:var(--blue)}.gallery-thumbs img{width:100%;height:65px;object-fit:cover;display:block}.dialog-body{padding:35px}.dialog-body section{display:grid;grid-template-columns:160px minmax(0,1fr);gap:25px;padding:24px 0;border-top:1px solid var(--line)}.dialog-body h3{font-size:16px}.dialog-body p,.dialog-body li{color:var(--muted);line-height:1.75}.dialog-body ul{margin:0;padding-left:20px}.case-contact{display:block;background:var(--ink);color:var(--paper);padding:17px 20px;margin-top:22px;font-size:15px}.case-navigation{display:flex;justify-content:space-between;gap:20px;padding:20px 35px;border-top:1px solid var(--line)}.case-navigation button{background:none;border:0;padding:8px 0;font-size:14px}
@media(min-width:1600px){header,.hero,.projects{max-width:1472px;margin-left:auto;margin-right:auto}}
@media(max-width:1050px){.identity span{display:none}nav{gap:20px}.nav-cta{margin-left:0}.project-cover{height:290px}.offer-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.offer:nth-child(2){border-right:0}.offer:nth-child(-n+2){border-bottom:1px solid #b9bdb1}.expertises,.about-content{gap:40px}.expertise-list summary{font-size:20px}}
@media(max-width:760px){.identity{display:none}.nav-cta{display:none}header{min-height:85px}.wordmark{font-size:49px}.section-head h2{letter-spacing:-3px}.expertises,.about-content{grid-template-columns:minmax(0,1fr)}.expertises{gap:35px}.project-cover{height:270px}.project:nth-child(even){padding-top:30px}.hero-bar{align-items:flex-start}.hero-controls{gap:7px}.hero-caption{max-width:52%}.contact-bottom{gap:30px}.contact h2{letter-spacing:-3px}.about-content h2{font-size:85px;letter-spacing:-4px}.stats strong{letter-spacing:-2px}}
@media(max-width:600px){
header{margin:0 5%;gap:12px}nav{gap:15px;font-size:13px}.hero{margin:0 5%;padding-top:18px}.hero-stage{height:auto;aspect-ratio:1.15}.hero-project:after{width:76px;height:76px;font-size:10px;right:15px;bottom:15px}.hero-bar{flex-direction:column;gap:18px}.hero-caption{max-width:100%}#hero-project-name{font-size:22px}#hero-project-category{font-size:13px}.hero-controls{width:100%;gap:12px}#hero-pause{margin-left:auto}.hero-segments{gap:4px}.hero-segments button{height:26px;font-size:10px;padding:0 5px}.projects{margin:0 5%;padding:55px 0}.eyebrow{font-size:11px;margin-bottom:20px}.section-head{display:block}.section-head h2{font-size:53px;letter-spacing:-2.5px}.section-head>p{font-size:14px;margin-top:22px}.project-tools{gap:13px;margin-top:30px;align-items:end}.search-field{width:auto;min-width:0;flex:1}.search-field input{font-size:16px}.search-field input::placeholder{font-size:13px}.view-switch button{padding:8px 11px;font-size:12px}.filters{flex-wrap:nowrap;overflow-x:auto;padding:3px 1px 12px;scrollbar-width:thin}.filters button{white-space:nowrap;flex-shrink:0;font-size:13px}.result-count{margin:9px 0 22px}.project-grid{grid-template-columns:minmax(0,1fr);gap:32px}.project:nth-child(even){padding-top:0}.project-cover{width:100%;height:265px;min-height:0;aspect-ratio:auto;padding:21px;gap:18px}.cover-title{font-size:clamp(1.9rem,8.5vw,2.8rem);letter-spacing:-1.1px}.cover-title-long{font-size:clamp(1.75rem,7.7vw,2.5rem)}.cover-top{font-size:11px}.project-number{font-size:32px}.cover-bottom{font-size:13px}.project-meta{gap:12px}.project-meta h3{font-size:18px}.project-meta p{font-size:14px}.project-meta>span{font-size:11px;max-width:75px;white-space:normal;text-align:right}.list-view .project-button{grid-template-columns:92px minmax(0,1fr);gap:15px}.list-view .project-cover{height:90px;padding:9px}.list-view .cover-title{font-size:15px;letter-spacing:-.5px}.list-view .cover-bottom{display:none}.list-view .project-meta{display:block}.list-view .project-meta h3{font-size:18px}.list-view .project-meta p{font-size:12px}.list-view .project-meta>span{display:block;margin-top:3px;text-align:left}.expertises,.about,.testimonials,.pricing{padding:50px 5%}.expertises h2,.testimonials h2,.pricing h2{font-size:46px;letter-spacing:-2px}.expertise-list summary{font-size:18px;gap:12px}.expertise-list summary>span:nth-child(2){min-width:0;overflow-wrap:anywhere}.expertise-list p{margin-left:0}.section-intro{font-size:16px}.about-content{gap:25px}.about-content .about-lead{font-size:23px}.stats{gap:15px;margin-top:30px;padding-top:25px}.stats strong{font-size:37px}.stats span{font-size:12px;line-height:1.5}.quotes{grid-template-columns:minmax(0,1fr);margin-top:25px}.quotes summary{font-size:19px}.offer-grid{grid-template-columns:minmax(0,1fr);margin-top:30px}.offer{border-right:0;border-bottom:1px solid #b9bdb1;padding:24px}.offer:last-child{border-bottom:0}.offer h3{font-size:21px}.offer-price{font-size:30px}.contact{padding:50px 5%}.contact h2{font-size:clamp(40px,10.5vw,62px);letter-spacing:-2.4px}.contact h2>span{margin-left:10px}.contact-bottom{grid-template-columns:minmax(0,1fr);gap:28px;margin-top:28px;padding-top:25px}.contact-bottom p{font-size:15px}.contact-bottom br{display:none}.contact-email{font-size:17px}.contact-bottom>div>p{margin-top:17px}footer{padding:26px 5%;gap:20px;flex-wrap:wrap;font-size:12px}.social-links{gap:20px}.footer-name{font-size:17px}.dialog-hero{padding:50px 22px 26px}.dialog-hero h2{font-size:34px;letter-spacing:-1.2px}.case-summary{font-size:18px}.gallery{padding:16px 14px 0}.gallery-stage{height:58vw;max-height:50dvh}.gallery-controls{gap:9px}.gallery-controls a{font-size:12px}.fit-image{font-size:11px}.dialog-body{padding:25px 22px}.dialog-body section{grid-template-columns:minmax(0,1fr);gap:12px}.case-navigation{padding:15px 22px;gap:15px}.case-navigation button{font-size:12px}.case-contact{font-size:14px}.hero-stage{touch-action:pan-y}
}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{transition:none!important;animation:none!important}.project-button:hover .project-cover{transform:none}}

.load-more-wrap{display:flex;justify-content:center;margin-top:38px}#load-more{border:1px solid var(--ink);background:var(--acid);padding:14px 28px;min-height:48px;font-size:16px;display:flex;align-items:center;gap:35px}#load-more:hover{background:var(--ink);color:var(--paper)}#load-more[hidden]{display:none}#load-more span{font-size:23px;line-height:1}

@media(max-width:600px){.hero-segments{grid-template-columns:repeat(3,minmax(0,1fr))}}

.stats strong{white-space:nowrap}@media(max-width:600px){.stats strong{font-size:clamp(1.55rem,7.5vw,2.3rem);letter-spacing:-1.5px}.stats{gap:12px}}

/* Selected work: artwork and context remain independently readable. */
.hero-layout{display:grid;grid-template-columns:minmax(0,1.85fr) minmax(280px,1fr);background:var(--ink);color:var(--paper);min-width:0}
.hero-stage{height:clamp(420px,43vw,650px);min-height:0;aspect-ratio:auto;background:#e4e4e1;touch-action:pan-y}
.hero-project:after{display:none}.hero-project img{object-position:center;transition:transform .65s cubic-bezier(.2,.7,.3,1)}.hero-whole .hero-project img{object-fit:contain}
.hero-context{padding:clamp(24px,3vw,48px);display:flex;flex-direction:column;justify-content:space-between;gap:30px;min-width:0;border-top:4px solid var(--hero-tint,var(--acid));transition:border-color .4s}
.hero-context-top{display:flex;justify-content:space-between;gap:15px;font-size:10px;letter-spacing:1px;line-height:1.5;color:#bfc2bb}.hero-context-top #hero-counter{min-width:42px;white-space:nowrap;letter-spacing:0}
#hero-overlay-tag{font-size:12px;color:#bfc2bb;margin-bottom:18px}#hero-overlay-title{font:500 clamp(32px,3.7vw,60px)/1.04 var(--display);letter-spacing:-1.8px;overflow-wrap:anywhere;text-wrap:balance}
#hero-overlay-description{font-size:15px;line-height:1.7;color:#d4d7d0;margin-top:25px;max-width:380px;text-wrap:pretty}
.hero-open{background:none;border:0;border-top:1px solid #656961;padding:18px 0 0;display:flex;align-items:center;justify-content:space-between;gap:20px;color:var(--paper);text-align:left;font-size:14px}.hero-open span{font-size:30px;line-height:1;transition:transform .25s}.hero-open:hover span{transform:translate(4px,-4px)}
.hero-hint{position:absolute;bottom:20px;left:20px;background:var(--ink);color:var(--paper);padding:10px 16px;font-size:13px;opacity:0;transform:translateY(8px);transition:opacity .25s,transform .25s;pointer-events:none}.hero-project:hover .hero-hint,.hero-project:focus-visible .hero-hint{opacity:1;transform:none}
.hero-fit{position:absolute;top:16px;right:16px;z-index:2;background:var(--paper);color:var(--ink);padding:9px 13px;font-size:12px;border:1px solid var(--line);border-radius:20px;min-height:40px}
.hero-navigation{display:flex;align-items:center;gap:30px;border-bottom:1px solid var(--ink);padding:18px 0}.hero-segments{flex:1;min-width:0;margin:0;gap:20px}.hero-segments button{height:60px;border-top:1px solid var(--line);background:transparent;padding:12px 0;display:flex;gap:14px;align-items:center;font-size:13px;line-height:1.3}.hero-segments button:before{inset:auto 0 0;height:2px;background:var(--ink)}.hero-segments button[aria-pressed=true]{background:transparent;border-top-color:var(--ink)}.hero-segments button[aria-pressed=false]{color:var(--muted)}.is-playing .hero-segments button[aria-pressed=true]:before{background:var(--ink)}.hero-segments button span:first-child{font-size:10px;color:var(--muted)}.hero-segments button:hover{color:var(--ink)}
@media(hover:hover) and (prefers-reduced-motion:no-preference){.hero-project:hover img{transform:scale(1.025)}.hero-whole .hero-project:hover img{transform:none}}
@media(max-width:950px){.hero-layout{grid-template-columns:minmax(0,1.4fr) minmax(260px,1fr)}.hero-context{padding:24px}.hero-navigation{gap:20px}.hero-segments{gap:12px}.hero-segments button{font-size:12px;gap:8px}}
@media(max-width:700px){.hero-layout{grid-template-columns:minmax(0,1fr)}.hero-stage{height:auto;aspect-ratio:4/3;max-height:none}.hero-context{padding:22px;gap:24px}.hero-context-top{font-size:9px}.hero-copy{min-height:194px}#hero-overlay-tag{margin-bottom:12px;font-size:11px}#hero-overlay-title{font-size:clamp(30px,8vw,42px);letter-spacing:-1px}#hero-overlay-description{font-size:14px;line-height:1.6;margin-top:16px;max-width:none}.hero-open{padding-top:14px}.hero-navigation{flex-wrap:wrap;gap:14px;padding:14px 0}.hero-segments{flex-basis:100%;gap:14px}.hero-segments button{height:55px;align-items:flex-start;flex-direction:column;gap:3px;font-size:12px;padding:6px 0}.hero-controls{width:100%;gap:12px}#hero-pause{margin-left:auto}.hero-fit{top:12px;right:12px}.hero-hint{display:none}}