/*
 * MARYOU — cinematic studio direction
 * Inspired by the rhythm and editorial confidence of anfalova.art,
 * while preserving Maryou's own content, copper palette and identity.
 */
:root{color-scheme:dark;--paper:#090909;--ink:#f4f2ee;--muted:#9f9b96;--line:#ffffff18;--sand:#151515;--accent:#d28548;--deep:#050505;--panel:#111;--copper:#d28548;--copper-bright:#ffc27f;--header-height:92px;--studio-gap:clamp(32px,4vw,64px);--studio-pad:clamp(64px,7vw,112px);--radius-pill:999px;--radius-control:14px;--radius-media:20px;--radius-card:26px;--radius-panel:34px;--control-height:50px;--control-pad:20px}
html[data-theme="dark"]{background:#090909;scrollbar-color:#d28548 #0a0a0a}
html[data-theme="dark"] body{background:#090909!important;color:var(--ink)!important;background-image:none!important}
html[data-theme="dark"] .metal-atmosphere{display:none!important}
html[data-theme="dark"] body::selection{background:#d28548;color:#090909}
html[data-theme="dark"] .ui-icon{display:inline-block;width:1.05em;height:1.05em;flex:0 0 auto;background:currentColor;vertical-align:-.12em;mask-repeat:no-repeat;mask-position:center;mask-size:contain;-webkit-mask-repeat:no-repeat;-webkit-mask-position:center;-webkit-mask-size:contain}
html[data-theme="dark"] .ui-icon-arrow-up-right{mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M7 17 17 7M8 7h9v9'/%3E%3C/svg%3E");-webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M7 17 17 7M8 7h9v9'/%3E%3C/svg%3E")}
html[data-theme="dark"] .ui-icon-arrow-right{mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12h14M13 6l6 6-6 6'/%3E%3C/svg%3E");-webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12h14M13 6l6 6-6 6'/%3E%3C/svg%3E")}
html[data-theme="dark"] .ui-icon-arrow-left{mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M19 12H5M11 6l-6 6 6 6'/%3E%3C/svg%3E");-webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M19 12H5M11 6l-6 6 6 6'/%3E%3C/svg%3E")}
html[data-theme="dark"] .ui-icon-arrow-up{mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 19V5M6 11l6-6 6 6'/%3E%3C/svg%3E");-webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 19V5M6 11l6-6 6 6'/%3E%3C/svg%3E")}
html[data-theme="dark"] .ui-icon-arrow-down{mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 5v14M6 13l6 6 6-6'/%3E%3C/svg%3E");-webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 5v14M6 13l6 6 6-6'/%3E%3C/svg%3E")}
html[data-theme="dark"] .ui-icon-arrow-down-left{mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M17 7 7 17M16 17H7V8'/%3E%3C/svg%3E");-webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M17 7 7 17M16 17H7V8'/%3E%3C/svg%3E")}
html[data-theme="dark"] .ui-icon-rotate{mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 7v5h-5M19 12a7 7 0 1 1-2-5'/%3E%3C/svg%3E");-webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 7v5h-5M19 12a7 7 0 1 1-2-5'/%3E%3C/svg%3E")}
html[data-theme="dark"] .ui-icon-focus{mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.7' stroke-linecap='round'%3E%3Ccircle cx='12' cy='12' r='4'/%3E%3Cpath d='M12 2v4M12 18v4M2 12h4M18 12h4'/%3E%3C/svg%3E");-webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.7' stroke-linecap='round'%3E%3Ccircle cx='12' cy='12' r='4'/%3E%3Cpath d='M12 2v4M12 18v4M2 12h4M18 12h4'/%3E%3C/svg%3E")}
html[data-theme="dark"] .ui-icon-close{mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round'%3E%3Cpath d='M6 6l12 12M18 6 6 18'/%3E%3C/svg%3E");-webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round'%3E%3Cpath d='M6 6l12 12M18 6 6 18'/%3E%3C/svg%3E")}
html[data-theme="dark"] :is(.button,.text-link,.inline-link,.back-link,.nav-contact,.journey-open,.project-reel-link,.skill-project,.dialog-bottom a,footer a){display:inline-flex;align-items:center;gap:10px}
html[data-theme="dark"] :is(.button,.nav-contact,.model-toolbar button) .ui-icon{width:16px;height:16px}
html[data-theme="dark"] :is(.text-link,.inline-link,.back-link,footer a) .ui-icon{width:14px;height:14px}
html[data-theme="dark"] :is(.card-arrow,.next-project>span:last-child) .ui-icon{width:20px;height:20px}
html[data-theme="dark"] :is(.journey-open,.skill-project,.project-reel-link) .ui-icon{margin-left:auto}
html[data-theme="dark"] .wrap{width:min(1480px,calc(100% - 64px))}
html[data-theme="dark"] h1,html[data-theme="dark"] h2,html[data-theme="dark"] h3,html[data-theme="dark"] h4{color:#f5f3ef;font-weight:600}
html[data-theme="dark"] .muted,html[data-theme="dark"] .section-intro{color:#8f8b86!important}
html[data-theme="dark"] .eyebrow{color:#d28a50!important}
html[data-theme="dark"] .eyebrow>span{background:#d28a50}

/* Floating studio navigation. */
html[data-theme="dark"] .header,html[data-theme="dark"] .header.scrolled,html[data-theme="dark"] .header.reel-header,html[data-theme="dark"] .project-page .header{background:transparent!important;box-shadow:none!important;backdrop-filter:none!important;color:#fff!important}
html[data-theme="dark"] .header{isolation:isolate}
html[data-theme="dark"] .header::before{content:"";position:absolute;z-index:-1;inset:0 0 auto;height:145px;pointer-events:none;opacity:0;background:linear-gradient(180deg,#090909d9 0%,#0909098c 42%,transparent 100%);backdrop-filter:blur(0);-webkit-backdrop-filter:blur(0);mask-image:linear-gradient(180deg,#000 0%,#000 42%,transparent 100%);-webkit-mask-image:linear-gradient(180deg,#000 0%,#000 42%,transparent 100%);transition:opacity .35s ease,backdrop-filter .35s ease}
html[data-theme="dark"] .header.scrolled::before,html[data-theme="dark"] .header.reel-header::before{opacity:1;backdrop-filter:blur(18px) saturate(125%);-webkit-backdrop-filter:blur(18px) saturate(125%)}
html[data-theme="dark"] .header-inner{min-height:92px;border:0!important}
html[data-theme="dark"] .brand-logo{width:170px;filter:invert(1)!important}
html[data-theme="dark"] .header nav{gap:5px;margin-left:auto;padding:5px;background:#111111e8;border:1px solid #ffffff14;border-radius:999px;box-shadow:0 12px 40px #0006;backdrop-filter:blur(18px)}
html[data-theme="dark"] .header nav a{padding:12px 18px;border-radius:999px;color:#d8d5d0;transition:background .25s,color .25s;white-space:nowrap;flex-shrink:0}
html[data-theme="dark"] .header nav a:hover{background:#252321;color:#fff;opacity:1}
html[data-theme="dark"] .header .nav-contact{border:0!important;background:#d28548!important;color:#080808!important;min-width:max-content}
html[data-theme="dark"] .menu-toggle{background:#111111e8!important;border-color:#ffffff1f!important;border-radius:999px!important;color:#fff!important}
html[data-theme="dark"] .menu-toggle:hover{background:#d28548!important;border-color:#d28548!important;color:#090909!important;transform:translateY(-2px)}
html[data-theme="dark"] .menu-toggle .menu-icon{transition:width .25s ease,transform .25s ease}
html[data-theme="dark"] .menu-toggle:hover .menu-icon{width:25px;transform:translateX(2px)}

/* Full-height editorial menu. */
html[data-theme="dark"]:has(body.menu-open){overflow:hidden}
html[data-theme="dark"] body.menu-open{overflow:hidden;overscroll-behavior:none}
html[data-theme="dark"] .mobile-dialog{isolation:isolate;width:min(560px,100%);padding:clamp(22px,4vh,46px) clamp(28px,4.5vw,58px);overflow:hidden;background:radial-gradient(circle at 100% 0,#d285481f,transparent 32%),linear-gradient(155deg,#151311,#080808 62%)!important;border:0!important;border-left:1px solid #d2854847!important;color:#f5f2ed!important;box-shadow:-35px 0 120px #000b;scrollbar-width:none}
html[data-theme="dark"] .mobile-dialog::-webkit-scrollbar{display:none}
html[data-theme="dark"] .mobile-dialog::before{content:"";position:absolute;z-index:-1;right:-190px;bottom:-210px;width:460px;height:460px;border:1px solid #d2854838;border-radius:50%;box-shadow:0 0 0 48px #d2854807,0 0 0 96px #ffffff05;pointer-events:none}
html[data-theme="dark"] .mobile-dialog::backdrop{background:#000b;backdrop-filter:blur(12px) saturate(.75);-webkit-backdrop-filter:blur(12px) saturate(.75)}
html[data-theme="dark"] .mobile-dialog[open]{animation:studio-menu-in .42s cubic-bezier(.2,.75,.2,1)}
html[data-theme="dark"] .mobile-dialog .dialog-top{min-height:74px;padding:0 0 25px;border-color:#ffffff20}
html[data-theme="dark"] .mobile-dialog .wordmark{display:flex;align-items:center}
html[data-theme="dark"] .mobile-dialog .brand-logo{width:165px;filter:invert(1)!important}
html[data-theme="dark"] .mobile-dialog .menu-close{width:52px;height:52px;padding:0;border:1px solid #d2854866;border-radius:50%!important;background:#ffffff05;color:#fff;font-size:26px;transition:transform .3s,background .25s,color .25s}
html[data-theme="dark"] .mobile-dialog .menu-close:hover{transform:rotate(90deg);background:#d28548;color:#090909}
html[data-theme="dark"] .mobile-dialog nav{counter-reset:studio-menu;display:flex;flex:1;flex-direction:column;justify-content:center;min-height:0;margin:clamp(16px,3.5vh,40px) 0}
html[data-theme="dark"] .mobile-dialog nav a{counter-increment:studio-menu;display:grid;grid-template-columns:42px minmax(0,1fr) auto;align-items:center;min-height:clamp(58px,9vh,78px);padding:clamp(10px,1.8vh,17px) 0;border-color:#ffffff1b;color:#f2efea;font-size:clamp(28px,5vw,42px);font-weight:500;line-height:1;letter-spacing:-.045em;transition:padding .25s,color .25s,border-color .25s}
html[data-theme="dark"] .mobile-dialog nav a::before{content:"0" counter(studio-menu);color:#8b827a;font:9px/1 monospace;letter-spacing:1px}
html[data-theme="dark"] .mobile-dialog nav a::after{content:"";width:20px;height:20px;background:#d28548;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M7 17 17 7M8 7h9v9'/%3E%3C/svg%3E") center/contain no-repeat;-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M7 17 17 7M8 7h9v9'/%3E%3C/svg%3E") center/contain no-repeat;transition:transform .25s}
html[data-theme="dark"] .mobile-dialog nav a:hover{padding-left:10px;border-color:#d285486b;color:#d99a67}
html[data-theme="dark"] .mobile-dialog nav a:hover::after{transform:translate(4px,-4px)}
html[data-theme="dark"] .mobile-dialog nav .nav-contact{background:transparent!important;color:#f2efea!important}
html[data-theme="dark"] .mobile-dialog nav .nav-contact span{display:none}
html[data-theme="dark"] .mobile-dialog .dialog-bottom{display:grid;grid-template-columns:1fr auto;gap:12px 28px;margin-top:auto;padding-top:25px;border-top:1px solid #ffffff1b}
html[data-theme="dark"] .mobile-dialog .dialog-bottom .eyebrow{grid-column:1/-1;color:#8f8780!important}
html[data-theme="dark"] .mobile-dialog .dialog-bottom a{display:inline-flex;align-items:center;min-height:44px;color:#c8c2bb;font-size:12px}
html[data-theme="dark"] .mobile-dialog .dialog-bottom a:hover{color:#d99a67}
@keyframes studio-menu-in{from{opacity:0;transform:translateX(42px)}to{opacity:1;transform:none}}

/* Monumental opening scene. */
html[data-theme="dark"] .hero{min-height:100svh;background:radial-gradient(circle at 82% 22%,#d2854824,transparent 24%),linear-gradient(145deg,#050505,#0b0a09 62%,#11100f)!important;color:#fff}
html[data-theme="dark"] .hero::before{right:-5vw;top:4%;width:min(55vw,820px);height:82%;border-color:#ffffff1f;box-shadow:inset 25px -8px 55px #ffffff08,-2px 2px 16px #d285482f;opacity:.9}
html[data-theme="dark"] .hero::after{right:-10vw;bottom:-22%;width:min(76vw,1100px);height:58%;border-top-color:#d2854875}
html[data-theme="dark"] .hero-content{grid-template-columns:minmax(0,1fr) 250px;min-height:calc(100svh - 92px);padding-block:70px 110px}
html[data-theme="dark"] .hero-copy{max-width:1050px}
html[data-theme="dark"] .hero h1{margin:20px 0 34px;font-family:'Montserrat Alternates',Arial,sans-serif;font-size:clamp(86px,11.5vw,176px);font-weight:400;line-height:.76;letter-spacing:-.075em;text-transform:none}
html[data-theme="dark"] .hero h1 em{display:block;margin-left:.55em;color:#d28548;font-family:inherit;font-style:normal;font-weight:700}
html[data-theme="dark"] .hero .intro{max-width:680px;color:#aaa6a1;font-size:clamp(17px,1.35vw,22px)}
html[data-theme="dark"] .hero-actions{gap:10px;margin-top:38px}
html[data-theme="dark"] .hero .button,html[data-theme="dark"] .recruiter-trigger{min-height:54px;border-radius:999px!important}
html[data-theme="dark"] .hero .button.light{background:#f4f1eb;color:#090909}
html[data-theme="dark"] .recruiter-trigger{background:#151310;border-color:#ffffff22;color:#fff}
html[data-theme="dark"] .text-link{margin-left:12px;color:#d9d5cf;border-color:#d28548}
html[data-theme="dark"] .portrait{max-width:210px}
html[data-theme="dark"] .portrait img{width:138px;height:138px;border-color:#d2854875;filter:grayscale(.25)}
html[data-theme="dark"] .scroll-cue{bottom:28px;display:grid;grid-template-columns:54px auto 88px;align-items:center;gap:17px;min-height:54px;padding:0;border:0;border-radius:0;background:transparent;box-shadow:none;backdrop-filter:none;-webkit-backdrop-filter:none;color:#d8d3cc;font-size:9px;letter-spacing:2.1px;transition:transform .3s,color .3s}
html[data-theme="dark"] .scroll-cue>span{position:relative;width:52px;height:52px;border:1px solid #d2854873;border-radius:50%;background:#09090970;color:#e2a46f;font-size:0;overflow:visible;box-shadow:inset 0 0 0 6px #d2854805,0 0 0 1px #000;transition:background .3s,border-color .3s,transform .3s}
html[data-theme="dark"] .scroll-cue>span::before{content:"";position:absolute;left:50%;top:13px;width:1px;height:20px;background:linear-gradient(transparent,#d28548);transform:translateX(-50%)}
html[data-theme="dark"] .scroll-cue>span::after{content:"";position:absolute;left:16px;top:22px;width:18px;height:18px;background:currentColor;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 5v14M6 13l6 6 6-6'/%3E%3C/svg%3E") center/contain no-repeat;-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 5v14M6 13l6 6 6-6'/%3E%3C/svg%3E") center/contain no-repeat;animation:studio-scroll-arrow 1.7s cubic-bezier(.45,0,.25,1) infinite}
html[data-theme="dark"] .scroll-cue::after{content:"";width:88px;height:1px;background:linear-gradient(90deg,#d28548 0 28%,#ffffff1c 28% 100%);transform-origin:left;animation:studio-scroll-line 2.4s ease-in-out infinite}
html[data-theme="dark"] .scroll-cue:hover{transform:translateX(5px);color:#fff}
html[data-theme="dark"] .scroll-cue:hover>span{background:#d28548;color:#090909;border-color:#e9a872;transform:rotate(-4deg)}
@keyframes studio-scroll-arrow{0%,100%{transform:translateY(-2px);opacity:.55}45%{transform:translateY(3px);opacity:1}}
@keyframes studio-scroll-line{0%,100%{transform:scaleX(.28);opacity:.4}50%{transform:scaleX(1);opacity:1}}
html[data-theme="dark"] .hero+.wrap,html[data-theme="dark"] main>.wrap{padding-block:clamp(34px,4vw,64px) clamp(72px,8vw,128px)}
html[data-theme="dark"] .expertise{position:relative;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));margin:0 0 var(--studio-gap);padding:0;background:#0d0d0d;border:1px solid #ffffff14;border-radius:24px;color:#c5c0ba;overflow:hidden;box-shadow:0 20px 65px #0005;transform:none!important}
html[data-theme="dark"] .expertise::before{content:"";position:absolute;z-index:3;inset:0;width:auto;height:auto;padding:1px;border-radius:inherit;background:conic-gradient(from var(--expertise-angle),transparent 0 70%,#d2854860 80%,#ffc27f 87%,#d28548 91%,transparent 100%);mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);mask-composite:exclude;-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;animation:expertise-border 6s linear infinite;pointer-events:none}
html[data-theme="dark"] .expertise::after{content:"";position:absolute;left:50%;top:calc(100% + 1px);width:1px;height:var(--studio-gap);background:linear-gradient(#d285486b,transparent)}
html[data-theme="dark"] .expertise span{position:relative;display:grid;grid-template-columns:42px minmax(0,1fr) auto;align-items:center;gap:14px;min-height:88px;padding:18px 22px;border-right:1px solid #ffffff10;font-size:10px;letter-spacing:1.7px;text-align:left;transition:background .35s,color .35s,transform .35s}
html[data-theme="dark"] .expertise span:last-child{border-right:0}
html[data-theme="dark"] .expertise span::before{content:"";display:block;width:40px;height:40px;margin:0!important;border:1px solid #d285484d;border-radius:12px;background-color:#d9a06f;opacity:.82;mask-position:center;mask-repeat:no-repeat;mask-size:20px;-webkit-mask-position:center;-webkit-mask-repeat:no-repeat;-webkit-mask-size:20px;transition:background-color .3s,border-color .3s,transform .35s}
html[data-theme="dark"] .expertise span::after{color:#6f6963;font:8px/1 monospace;letter-spacing:0}
html[data-theme="dark"] .expertise span:nth-child(1)::before{mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.7'%3E%3Cpath d='m12 3 8 4.5v9L12 21l-8-4.5v-9L12 3Z'/%3E%3Cpath d='m4.5 7.8 7.5 4.3 7.5-4.3M12 12v8.5'/%3E%3C/svg%3E");-webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.7'%3E%3Cpath d='m12 3 8 4.5v9L12 21l-8-4.5v-9L12 3Z'/%3E%3Cpath d='m4.5 7.8 7.5 4.3 7.5-4.3M12 12v8.5'/%3E%3C/svg%3E")}.expertise span:nth-child(1)::after{content:"01"}
html[data-theme="dark"] .expertise span:nth-child(2)::before{mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.7'%3E%3Cpath d='M4 15h16M6 15v5h12v-5M8 12V5h8v7M11 5V2h2v3'/%3E%3Cpath d='M8 9h8'/%3E%3C/svg%3E");-webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.7'%3E%3Cpath d='M4 15h16M6 15v5h12v-5M8 12V5h8v7M11 5V2h2v3'/%3E%3Cpath d='M8 9h8'/%3E%3C/svg%3E")}.expertise span:nth-child(2)::after{content:"02"}
html[data-theme="dark"] .expertise span:nth-child(3)::before{mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.7'%3E%3Cpath d='M12 21V8M8 12c-3.2 0-5-2-5-5 3 0 5 1.8 5 5ZM16 9c3.2 0 5-2 5-5-3 0-5 1.8-5 5ZM8 17c-2.5 0-4-1.5-4-4 2.5 0 4 1.5 4 4Z'/%3E%3C/svg%3E");-webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.7'%3E%3Cpath d='M12 21V8M8 12c-3.2 0-5-2-5-5 3 0 5 1.8 5 5ZM16 9c3.2 0 5-2 5-5-3 0-5 1.8-5 5ZM8 17c-2.5 0-4-1.5-4-4 2.5 0 4 1.5 4 4Z'/%3E%3C/svg%3E")}.expertise span:nth-child(3)::after{content:"03"}
html[data-theme="dark"] .expertise span:nth-child(4)::before{mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.7'%3E%3Cpath d='m8 7-5 5 5 5M16 7l5 5-5 5M14 4l-4 16'/%3E%3C/svg%3E");-webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.7'%3E%3Cpath d='m8 7-5 5 5 5M16 7l5 5-5 5M14 4l-4 16'/%3E%3C/svg%3E")}.expertise span:nth-child(4)::after{content:"04"}
@property --expertise-angle{syntax:"<angle>";inherits:false;initial-value:0deg}
@keyframes expertise-border{to{--expertise-angle:360deg}}
@media(max-width:800px){
  html[data-theme="dark"] .expertise{grid-template-columns:repeat(2,minmax(0,1fr));gap:0;padding:0;border-radius:22px}
  html[data-theme="dark"] .expertise span{grid-template-columns:34px minmax(0,1fr);gap:12px;min-height:96px;padding:20px 34px 20px 17px;border-right:1px solid #ffffff10;border-bottom:1px solid #ffffff10;font-size:9px;line-height:1.35;letter-spacing:1.45px;text-align:left}
  html[data-theme="dark"] .expertise span:nth-child(2n){border-right:0}
  html[data-theme="dark"] .expertise span:nth-last-child(-n+2){border-bottom:0}
  html[data-theme="dark"] .expertise span::before{width:32px;height:32px;mask-size:18px;-webkit-mask-size:18px}
  html[data-theme="dark"] .expertise span::after{position:absolute;right:12px;top:13px;font-size:7px}
  html[data-theme="dark"] .expertise span:active{background:#d2854818;color:#fff;transform:scale(.985)}
}
@media(max-width:380px){
  html[data-theme="dark"] .expertise{grid-template-columns:1fr}
  html[data-theme="dark"] .expertise span,html[data-theme="dark"] .expertise span:nth-child(2n){min-height:76px;border-right:0;border-bottom:1px solid #ffffff10}
  html[data-theme="dark"] .expertise span:last-child{border-bottom:0}
}

/* Shared editorial panels. */
html[data-theme="dark"] .section{position:relative;margin-top:0;padding:var(--studio-pad);border:1px solid #ffffff12!important;border-radius:36px;background:#111!important;overflow:hidden;color:#f4f2ee}
html[data-theme="dark"] .hero+.wrap>.section,html[data-theme="dark"] main>.wrap>.section{margin-bottom:var(--studio-gap)}
html[data-theme="dark"] .section+.section{margin-top:0}
html[data-theme="dark"] .section::before{content:'';position:absolute;inset:0;pointer-events:none;background:radial-gradient(circle at 85% 4%,#d2854813,transparent 25%);z-index:0}
html[data-theme="dark"] .section>*{position:relative;z-index:1}
html[data-theme="dark"] .section-heading{margin-bottom:64px;padding-bottom:32px;border-bottom:1px solid #ffffff14}
html[data-theme="dark"] .section-heading h2{max-width:900px;font-size:clamp(48px,5.4vw,84px);font-weight:600;line-height:.96;letter-spacing:-.055em;text-wrap:balance;overflow-wrap:break-word}
html[data-theme="dark"] .section-intro{max-width:430px;font-size:16px}
html[data-theme="dark"] .section-heading>div{min-width:0}
html[data-theme="dark"] .section-heading+*{margin-top:0}

/* Journey as a compact studio dashboard. */
html[data-theme="dark"] .journey-editorial{min-height:100svh;background:#111!important;box-shadow:none!important}
html[data-theme="dark"] .journey-editorial::before{display:none!important;content:none!important}
html[data-theme="dark"] .journey-editorial::after{content:'JOURNEY / 01';position:absolute;right:32px;top:26px;color:#d2854875;font:9px/1 monospace;letter-spacing:1.5px}
html[data-theme="dark"] .journey-editorial .journey-columns{display:grid;grid-template-columns:1.08fr .92fr;gap:32px}
html[data-theme="dark"] .journey-editorial .column-title{display:flex;justify-content:space-between;align-items:flex-end;margin:0 0 14px;padding:0 0 15px;border-bottom:1px solid #ffffff1a;color:#fff;font-size:clamp(26px,2.2vw,38px)}
html[data-theme="dark"] .journey-editorial .column-title>span{color:#d28548;font:10px/1 monospace}
html[data-theme="dark"] .journey-editorial .timeline{display:grid;gap:12px;margin:0;padding:0;border:0}
html[data-theme="dark"] .journey-editorial .journey-columns>div:first-child .timeline{grid-template-columns:repeat(2,minmax(0,1fr))}
html[data-theme="dark"] .journey-editorial .timeline::before{display:none}
html[data-theme="dark"] .journey-editorial .timeline li,html[data-theme="dark"] .journey-editorial .timeline li.is-current{position:relative;display:block;min-height:210px;margin:0;padding:20px 20px 62px;opacity:1;transform:none;background:#090909;border:1px solid #ffffff14;border-radius:22px;color:#fff;transition:transform .35s,border-color .35s,background .35s}
html[data-theme="dark"] .journey-editorial .timeline li,html[data-theme="dark"] .journey-editorial .timeline li.is-current{isolation:isolate;overflow:hidden;background:#090909!important;background-image:none!important;box-shadow:none!important;backdrop-filter:none!important;-webkit-backdrop-filter:none!important}
html[data-theme="dark"] .journey-editorial .timeline li:hover{transform:translateY(-5px);border-color:#d2854869;background:#0e0c0b}
html[data-theme="dark"] .journey-editorial .timeline li::before,html[data-theme="dark"] .journey-editorial .timeline li::after{display:none}
html[data-theme="dark"] .journey-editorial .timeline-date{min-height:30px;margin:0 20px 12px 0;color:#8f8a85!important;font:8px/1.45 monospace!important;letter-spacing:1px;text-transform:uppercase}
html[data-theme="dark"] .journey-editorial .timeline-date>span{display:inline-block;margin:6px 0 0 7px;padding:5px 7px;border:1px solid #d285484c;background:#d285480c;color:#d8a274}
html[data-theme="dark"] .journey-editorial .timeline-brand{display:grid;grid-template-columns:58px minmax(0,1fr);align-items:center;gap:13px;margin:0 0 10px}
html[data-theme="dark"] .journey-editorial .timeline-logo{display:grid;width:58px;height:49px;place-items:center;padding:7px;background:#f1eee8;border:0;border-radius:13px}
html[data-theme="dark"] .journey-editorial .timeline-logo img{max-width:100%;max-height:100%;filter:grayscale(1) contrast(1.3) brightness(.5);opacity:.86;mix-blend-mode:multiply}
html[data-theme="dark"] .journey-editorial .timeline-logo img[alt="Logo Stellantis"]{filter:none;opacity:1;mix-blend-mode:normal;transform:scale(1.13)}
html[data-theme="dark"] .journey-editorial .timeline-brand h4{font-size:clamp(17px,1.3vw,22px);font-weight:600}
html[data-theme="dark"] .journey-editorial .timeline p{color:#aaa5a0!important;font-size:12px;line-height:1.5}
html[data-theme="dark"] .journey-editorial .timeline .timeline-place{color:#e3dfd9!important}
html[data-theme="dark"] .journey-editorial .tags{display:none}
html[data-theme="dark"] .journey-open{position:absolute;left:20px;right:20px;bottom:14px;display:flex;align-items:center;justify-content:space-between;min-height:36px;padding:7px 0;background:transparent;border:0;border-top:1px solid #ffffff16;color:#d39a6d;font-size:9px;letter-spacing:1px;text-transform:uppercase}
html[data-theme="dark"] .journey-open:hover{color:#ffc27f;border-color:#d28548}
html[data-theme="dark"] .journey-editorial .journey-columns>div:last-child .timeline li{min-height:195px}
html[data-theme="dark"] .journey-editorial .cv-card{min-height:92px;margin-top:12px;padding:20px 24px;background:#d28548!important;border:0!important;border-radius:22px;color:#090909!important}
html[data-theme="dark"] .journey-editorial .cv-card span,html[data-theme="dark"] .journey-editorial .cv-card strong{color:#090909!important}
html[data-theme="dark"] .journey-editorial .cv-card strong{font-size:23px}
html[data-theme="dark"] .journey-editorial .cv-card{position:relative;isolation:isolate;overflow:hidden;transition:transform .35s cubic-bezier(.2,.75,.2,1),box-shadow .35s,background-color .35s}
html[data-theme="dark"] .journey-editorial .cv-card::before{content:"";position:absolute;z-index:-1;inset:0;background:linear-gradient(105deg,transparent 28%,#ffffff30 47%,transparent 66%);transform:translateX(-125%);transition:transform .8s cubic-bezier(.2,.7,.2,1);pointer-events:none}
html[data-theme="dark"] .journey-editorial .cv-card>span:last-child{display:grid;width:46px;height:46px;place-items:center;border:1px solid #09090945;border-radius:50%;font-size:0;transition:transform .35s,background-color .35s}
html[data-theme="dark"] .journey-editorial .cv-card>span:last-child .ui-icon{width:18px;height:18px}
html[data-theme="dark"] .journey-editorial .cv-card:hover{transform:translateY(-5px);background:#df9254!important;box-shadow:0 22px 50px #0006}
html[data-theme="dark"] .journey-editorial .cv-card:hover::before{transform:translateX(125%)}
html[data-theme="dark"] .journey-editorial .cv-card:hover>span:last-child{transform:translate(3px,-3px);background:#090909;color:#f1a86d}

/* Dark detail drawer. */
html[data-theme="dark"] .journey-dialog{inset:0 0 0 auto;width:min(540px,100%);height:100dvh;max-width:none;max-height:none;margin:0;padding:0;border:0;background:transparent;color:#f4f2ee}
html[data-theme="dark"] .journey-dialog::backdrop{background:#000b;backdrop-filter:blur(6px)}
html[data-theme="dark"] .journey-dialog-shell{display:flex;min-height:100%;flex-direction:column;padding:clamp(36px,6vw,72px);background:#111;box-shadow:-25px 0 80px #000;animation:studio-drawer .38s cubic-bezier(.2,.75,.2,1) both}
html[data-theme="dark"] .journey-dialog-close{align-self:flex-end;margin-bottom:50px;padding:10px;background:transparent;border:0;color:#aaa;font-size:10px;text-transform:uppercase;letter-spacing:1px}
html[data-theme="dark"] .journey-dialog-date{margin:28px 0 20px;color:#a09b95;font:10px/1.5 monospace;text-transform:uppercase}
html[data-theme="dark"] .journey-dialog-brand{display:grid;grid-template-columns:88px 1fr;align-items:center;gap:20px;padding:22px 0;border-block:1px solid #ffffff18}
html[data-theme="dark"] .journey-dialog-logo{display:grid;width:88px;height:70px;place-items:center;padding:10px;background:#f1eee8;border-radius:18px}
html[data-theme="dark"] .journey-dialog-logo img{max-width:100%;max-height:100%;filter:grayscale(1) contrast(1.25) brightness(.5);mix-blend-mode:multiply}
html[data-theme="dark"] .journey-dialog-logo img[alt="Logo Stellantis"]{filter:none;mix-blend-mode:normal}
html[data-theme="dark"] .journey-dialog-place{color:#aaa;font-size:11px}
html[data-theme="dark"] .journey-dialog h2{font-size:clamp(36px,5vw,58px);letter-spacing:-.05em}
html[data-theme="dark"] .journey-dialog-summary{margin:30px 0;color:#b8b3ad;font-size:17px;line-height:1.7}
html[data-theme="dark"] .journey-dialog-tags{display:flex;flex-wrap:wrap;gap:8px}
html[data-theme="dark"] .journey-dialog-tags span{padding:8px 10px;border:1px solid #d2854855;color:#dba77c;font-size:9px;text-transform:uppercase}
html[data-theme="dark"] .journey-dialog-link{width:100%;margin-top:auto;border-radius:999px!important;background:#d28548!important;color:#090909!important}
@keyframes studio-drawer{from{opacity:0;transform:translateX(70px)}to{opacity:1;transform:none}}

/* Services / expertise cards. */
html[data-theme="dark"] .skills-workshop .skills-grid{gap:18px;background:transparent;border:0}
html[data-theme="dark"] .skills-workshop .skill-stage{min-height:520px;background:#090909;border:1px solid #ffffff12;border-radius:28px;overflow:hidden}
html[data-theme="dark"] .skills-workshop .skill-stage:hover{background:#0e0d0c;box-shadow:0 30px 80px #0009}
html[data-theme="dark"] .skill-visual{border:0;background:radial-gradient(circle at 50% 35%,#322318,#090909 68%)}
html[data-theme="dark"] .skill-copy{padding:28px}
html[data-theme="dark"] .skill-project{border-color:#ffffff16}

/* Horizontal projects gallery, echoing the reference's latest-work strip. */
html[data-theme="dark"] #projets{overflow:visible}
html[data-theme="dark"] #projets .section-heading{position:sticky;left:0}
html[data-theme="dark"] .filters button{border-radius:999px;color:#aaa}
html[data-theme="dark"] .filters button[aria-pressed="true"]{background:#d28548;border-color:#d28548;color:#090909}
html[data-theme="dark"] .project-grid{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(390px,42vw);grid-template-columns:none;gap:18px;margin-inline:calc(clamp(68px,7vw,110px)*-1);padding:0 clamp(68px,7vw,110px) 22px;overflow-x:auto;overscroll-behavior-inline:contain;scroll-snap-type:inline mandatory;scrollbar-color:#d28548 #171717;scrollbar-width:thin}
html[data-theme="dark"] .project-card{scroll-snap-align:start}
html[data-theme="dark"] .project-card>a{height:100%;background:#090909;border:1px solid #ffffff13;border-radius:28px;overflow:hidden}
html[data-theme="dark"] .project-image{aspect-ratio:1.45;background:radial-gradient(circle at 50% 42%,#312318,#080808 68%);border-radius:0}
html[data-theme="dark"] .project-caption{min-height:190px;padding:26px;border:0}
html[data-theme="dark"] .project-caption h3{font-size:clamp(24px,2.5vw,38px);letter-spacing:-.04em}
html[data-theme="dark"] .project-caption>div>p:first-child{color:#d9a173!important;font-weight:500!important}
html[data-theme="dark"] .project-caption .project-summary{color:#b6b0a9!important;font-weight:400!important;line-height:1.65}
html[data-theme="dark"] .project-card a:hover{transform:translateY(-5px);box-shadow:0 30px 90px #000b}

/* Projects panel: tighter editorial header and predictable filter rhythm. */
html[data-theme="dark"] #projets{--projects-pad:clamp(48px,5vw,78px);padding:clamp(52px,5vw,78px) var(--projects-pad) clamp(58px,6vw,88px)}
html[data-theme="dark"] #projets .section-heading{display:grid;grid-template-columns:minmax(370px,.9fr) minmax(520px,1.1fr);align-items:end;gap:clamp(38px,6vw,96px);margin-bottom:42px;padding-bottom:30px}
html[data-theme="dark"] #projets .section-heading h2{max-width:650px;font-size:clamp(52px,5vw,76px);line-height:.96}
html[data-theme="dark"] #projets .section-heading .eyebrow{margin-bottom:22px}
html[data-theme="dark"] #projets .filters{display:grid;grid-template-columns:repeat(3,max-content);justify-content:end;align-content:end;gap:8px;max-width:none;width:100%}
html[data-theme="dark"] #projets .filters button{min-width:122px;min-height:46px;padding-inline:18px}
html[data-theme="dark"] #projets .project-grid{margin-inline:calc(var(--projects-pad)*-1);padding-inline:var(--projects-pad);scroll-padding-inline:var(--projects-pad)}
html[data-theme="dark"] #projets .project-card{scroll-snap-align:start;scroll-snap-stop:always;scroll-margin-inline-start:var(--projects-pad)}
@media(max-width:1200px){
  html[data-theme="dark"] #projets .section-heading{grid-template-columns:minmax(310px,.8fr) minmax(460px,1.2fr);gap:34px}
  html[data-theme="dark"] #projets .filters{grid-template-columns:repeat(2,minmax(145px,1fr))}
  html[data-theme="dark"] #projets .filters button{width:100%;min-width:0}
}
@media(max-width:900px){
  html[data-theme="dark"] #projets{--projects-pad:clamp(22px,5vw,42px);padding-top:46px}
  html[data-theme="dark"] #projets .section-heading{display:flex;align-items:stretch;gap:28px;margin-bottom:34px;padding-bottom:28px}
  html[data-theme="dark"] #projets .filters{grid-template-columns:repeat(3,minmax(0,1fr));justify-content:stretch}
}
@media(max-width:600px){
  html[data-theme="dark"] #projets .section-heading h2{font-size:clamp(42px,13vw,62px)}
  html[data-theme="dark"] #projets .filters{grid-template-columns:repeat(2,minmax(0,1fr));gap:6px}
  html[data-theme="dark"] #projets .filters button{min-height:44px;padding-inline:10px;font-size:10px}
}
html[data-theme="dark"] .card-arrow{border-color:#d285485f;color:#dba77c}

/* Cinematic selected-project scroll remains the main showpiece. */
html[data-theme="dark"] .project-reel,html[data-theme="dark"] .project-reel-sticky{background:#050505;color:#fff}
html[data-theme="dark"] .project-reel{margin-top:var(--studio-gap);margin-bottom:var(--studio-gap)}
html[data-theme="dark"] .project-reel-sticky::before{background:radial-gradient(circle at calc(18% + var(--reel-progress)*64%) 48%,#d2854833 0,transparent 38%),linear-gradient(135deg,#111,#040404)}
html[data-theme="dark"] .project-reel-sticky{height:100dvh;min-height:0!important}
html[data-theme="dark"] .project-reel-item h2{font-size:clamp(56px,6.5vw,104px);font-weight:600;line-height:.92;letter-spacing:-.065em;overflow-wrap:break-word}
html[data-theme="dark"] .project-reel-item p{color:#d49a6c}
html[data-theme="dark"] .project-reel-link{right:max(48px,calc((100vw - 1280px)/2));bottom:clamp(34px,7vh,76px);width:min(360px,calc(100vw - 96px));max-width:calc(100vw - 96px);border-color:#ffffff24}

/* Contact as a bold closing scene. */
html[data-theme="dark"] .contact-studio{margin-top:0!important;padding:clamp(70px,8vw,125px)!important;background:#111!important;border:1px solid #ffffff12!important;border-radius:38px!important}
html[data-theme="dark"] .contact-studio .contact-intro h2{font-size:clamp(58px,7vw,110px)!important;font-weight:600;line-height:.9;letter-spacing:-.065em;color:#fff!important;overflow-wrap:break-word}
html[data-theme="dark"] .contact-studio .contact-intro h2 em{color:#d28548!important}
html[data-theme="dark"] .contact-panel{background:#090909!important;border:1px solid #ffffff15!important;border-radius:28px!important}
html[data-theme="dark"] .contact-form input,html[data-theme="dark"] .contact-form textarea,html[data-theme="dark"] .contact-form select{background:#111!important;border-color:#ffffff1d!important;color:#fff!important}
html[data-theme="dark"] .contact-send{border-radius:999px!important;background:#d28548!important;color:#090909!important}

/* Project pages: large case-study editorial layout. */
html[data-theme="dark"] .project-page{background:#090909!important}
html[data-theme="dark"] .project-page .project-intro{padding-top:150px;padding-bottom:clamp(72px,8vw,128px)}
html[data-theme="dark"] .project-page .project-intro{background-image:none!important}
html[data-theme="dark"] .project-intro h1{max-width:1200px;font-size:clamp(68px,10vw,148px);font-weight:600;line-height:.82;letter-spacing:-.075em}
html[data-theme="dark"] .project-lead{max-width:850px;color:#aaa!important;font-size:clamp(18px,1.6vw,25px)}
html[data-theme="dark"] .project-meta{border-color:#ffffff1a}
html[data-theme="dark"] .project-cover,html[data-theme="dark"] .model-stage{background:#111!important;border:1px solid #ffffff13!important;border-radius:32px!important;overflow:hidden}
html[data-theme="dark"] .model-stage model-viewer{background:radial-gradient(circle at 50% 45%,#25201c,#0b0b0b 70%)!important}
html[data-theme="dark"] .model-toolbar{background:#0d0d0d!important}
html[data-theme="dark"] .model-toolbar button{border-radius:999px;border-color:#d2854848;color:#e1b18b}
html[data-theme="dark"] .case-layout{gap:clamp(42px,6vw,88px);padding-block:clamp(64px,7vw,112px)}
html[data-theme="dark"] .case-sidebar{padding:28px!important;background:#111!important;border:1px solid #ffffff13!important;border-radius:26px!important}
html[data-theme="dark"] .case-article h2{font-size:clamp(38px,4vw,66px);letter-spacing:-.05em}
html[data-theme="dark"] .case-article p,html[data-theme="dark"] .case-article li{color:#aaa!important;font-size:16px}
html[data-theme="dark"] .next-project{padding:42px;background:#111;border:1px solid #ffffff13!important;border-radius:28px}
html[data-theme="dark"] footer{border-color:#ffffff15;color:#aaa}

/* Unified component hierarchy: primary, secondary and utility controls. */
html[data-theme="dark"] :is(.button,.contact-send,.recruiter-trigger,.journey-open,.project-reel-link,.model-toolbar button,.filters button,.menu-toggle,.journey-dialog-close,.wood-project-nav a){position:relative;isolation:isolate;min-height:var(--control-height);padding:0 var(--control-pad);border-radius:var(--radius-pill)!important;overflow:hidden;transition:transform .28s cubic-bezier(.2,.75,.2,1),background-color .25s,border-color .25s,color .25s,box-shadow .3s}
html[data-theme="dark"] :is(.button,.contact-send,.recruiter-trigger,.journey-open,.project-reel-link,.model-toolbar button,.filters button,.menu-toggle,.journey-dialog-close,.wood-project-nav a)::before{content:"";position:absolute;z-index:-1;inset:0;background:linear-gradient(110deg,transparent 25%,#ffffff26 48%,transparent 70%);transform:translateX(-130%);transition:transform .65s cubic-bezier(.2,.75,.2,1);pointer-events:none}
html[data-theme="dark"] :is(.button,.contact-send,.recruiter-trigger,.journey-open,.project-reel-link,.model-toolbar button,.filters button,.menu-toggle,.journey-dialog-close,.wood-project-nav a):hover::before{transform:translateX(130%)}
html[data-theme="dark"] :is(.button,.contact-send,.recruiter-trigger,.journey-open,.project-reel-link,.model-toolbar button,.filters button,.menu-toggle,.journey-dialog-close,.wood-project-nav a):hover{transform:translateY(-2px)}
html[data-theme="dark"] :is(.button,.contact-send,.recruiter-trigger,.journey-open,.project-reel-link,.model-toolbar button,.filters button,.menu-toggle,.journey-dialog-close,.wood-project-nav a):active{transform:translateY(0) scale(.985);transition-duration:.08s}
html[data-theme="dark"] :is(.button,.contact-send,.recruiter-trigger,.journey-open,.project-reel-link,.model-toolbar button,.filters button,.menu-toggle,.journey-dialog-close,.wood-project-nav a) .ui-icon{transition:transform .28s cubic-bezier(.2,.75,.2,1)}
html[data-theme="dark"] :is(.button,.contact-send,.recruiter-trigger,.journey-open,.project-reel-link,.model-toolbar button,.filters button,.menu-toggle,.journey-dialog-close,.wood-project-nav a):hover .ui-icon-arrow-up-right{transform:translate(3px,-3px)}
html[data-theme="dark"] :is(.button,.contact-send,.recruiter-trigger,.journey-open,.project-reel-link,.model-toolbar button,.filters button,.menu-toggle,.journey-dialog-close,.wood-project-nav a):hover .ui-icon-arrow-right{transform:translateX(3px)}
html[data-theme="dark"] :is(.button,.contact-send,.recruiter-trigger,.journey-open,.project-reel-link,.model-toolbar button,.filters button,.menu-toggle,.journey-dialog-close,.wood-project-nav a):hover .ui-icon-arrow-left{transform:translateX(-3px)}

/* Primary calls to action: solid copper or light. */
html[data-theme="dark"] :is(.nav-contact,.contact-send,.button.light){border:1px solid transparent!important;box-shadow:0 10px 28px #0004}
html[data-theme="dark"] :is(.nav-contact,.contact-send):hover{background:#e09a5d!important;box-shadow:0 14px 34px #d2854826}
html[data-theme="dark"] .button.light:hover{background:#fff!important;box-shadow:0 14px 34px #ffffff14}

/* Secondary actions: dark glass with a copper edge. */
html[data-theme="dark"] :is(.button.dark,.recruiter-trigger,.journey-open,.project-reel-link){background:#151310!important;border:1px solid #d2854848!important;color:#f2ede7!important}
html[data-theme="dark"] :is(.button.dark,.recruiter-trigger,.journey-open,.project-reel-link):hover{background:#211812!important;border-color:#d28548a6!important;box-shadow:0 12px 32px #0007}
html[data-theme="dark"] .recruiter-trigger:hover{color:#f5f1eb!important}
html[data-theme="dark"] .recruiter-trigger:hover b{color:#e3a16c!important}

/* Utility and filter controls remain quieter. */
html[data-theme="dark"] :is(.model-toolbar button,.filters button,.journey-dialog-close){background:#ffffff05!important;border:1px solid #ffffff1c!important;color:#d7d1ca!important}
html[data-theme="dark"] :is(.model-toolbar button,.filters button,.journey-dialog-close):hover{background:#ffffff0c!important;border-color:#d285486e!important;color:#fff!important}
html[data-theme="dark"] .filters button[aria-pressed="true"]{background:#d28548!important;border-color:#d28548!important;color:#090909!important}

/* Shared corner language across containers. */
html[data-theme="dark"] :is(.section,.contact-studio){border-radius:var(--radius-panel)!important}
html[data-theme="dark"] :is(.project-card>a,.skill-stage,.timeline li,.case-sidebar,.next-project,.cv-card,.species-card,.map-info,.contact-panel){border-radius:var(--radius-card)!important}
html[data-theme="dark"] :is(.project-image,.skill-visual,.project-cover,.model-stage,.interactive-section,.legacy-map,.tree-map,.species-photo){border-radius:var(--radius-media)!important}
html[data-theme="dark"] :is(input:not([type="radio"]):not([type="checkbox"]):not([type="hidden"]),textarea,select,.project-options label>span){border-radius:var(--radius-control)!important}
html[data-theme="dark"] :is(input:not([type="radio"]):not([type="checkbox"]):not([type="hidden"]),select){min-height:var(--control-height);padding:12px 16px!important}
html[data-theme="dark"] textarea{padding:16px!important}
html[data-theme="dark"] :is(.tags span,.project-tech span,.project-reel-tech li,.contact-availability){border-radius:var(--radius-pill)!important}
html[data-theme="dark"] .card-arrow{width:44px;height:44px;border-radius:50%!important;transition:transform .28s,background .25s,color .25s,border-color .25s}
html[data-theme="dark"] .project-card a:hover .card-arrow{transform:translateY(-2px);background:#d28548!important;color:#090909!important;border-color:#d28548!important}
html[data-theme="dark"] .next-project>span:last-child{display:grid;width:52px;height:52px;place-items:center;border:1px solid #d285484d;border-radius:50%;color:#dca577;transition:transform .28s,background .25s,color .25s}
html[data-theme="dark"] .next-project:hover>span:last-child{transform:translate(3px,-3px);background:#d28548;color:#090909}
html[data-theme="dark"] .model-stage:fullscreen{border-radius:0!important}

/* Journey cards share one baseline, one button position and transparent logos. */
html[data-theme="dark"] .journey-editorial .journey-columns>div{display:flex;min-width:0;flex-direction:column}
html[data-theme="dark"] .journey-editorial .timeline{flex:1;grid-auto-rows:minmax(0,1fr)}
html[data-theme="dark"] .journey-editorial .journey-columns>div:first-child .timeline{grid-template-rows:repeat(2,minmax(0,1fr))}
html[data-theme="dark"] .journey-editorial .journey-columns>div:last-child .timeline{grid-template-rows:repeat(2,minmax(0,1fr))}
html[data-theme="dark"] .journey-editorial .timeline li,html[data-theme="dark"] .journey-editorial .timeline li.is-current{display:flex;min-height:230px;flex-direction:column;padding:22px!important}
html[data-theme="dark"] .journey-editorial .journey-open{position:static;inset:auto;width:max-content;max-width:100%;min-height:44px;margin-top:auto;padding:0 18px;align-self:flex-start}
html[data-theme="dark"] .journey-editorial .timeline-logo{width:64px;height:48px;padding:0;background:transparent!important;border:0!important;border-radius:0!important;clip-path:none!important;overflow:visible}
html[data-theme="dark"] .journey-editorial .timeline-logo img,html[data-theme="dark"] .journey-editorial .timeline-logo img[alt="Logo Stellantis"]{max-width:100%;max-height:100%;filter:grayscale(1) brightness(0) invert(1)!important;opacity:.82;mix-blend-mode:normal!important;transform:none}
html[data-theme="dark"] .journey-editorial .timeline li:hover .timeline-logo img{filter:grayscale(1) brightness(0) invert(1)!important;opacity:1;transform:translateY(-1px)}
html[data-theme="dark"] .journey-dialog-logo{padding:0;background:transparent!important;border-radius:0!important}
html[data-theme="dark"] .journey-dialog-logo img,html[data-theme="dark"] .journey-dialog-logo img[alt="Logo Stellantis"]{filter:grayscale(1) brightness(0) invert(1)!important;opacity:.86;mix-blend-mode:normal!important}

/* The site's scrollbar becomes a restrained copper rail. */
html[data-theme="dark"]::-webkit-scrollbar{width:12px;height:12px}
html[data-theme="dark"]::-webkit-scrollbar-track{background:#090909}
html[data-theme="dark"]::-webkit-scrollbar-thumb{background:#d28548;border:3px solid #090909;border-radius:999px}
html[data-theme="dark"] .project-grid{scrollbar-width:none;-ms-overflow-style:none}
html[data-theme="dark"] .project-grid::-webkit-scrollbar{display:none;width:0;height:0}

/* Wide but shallow laptop screens need a denser cinematic composition. */
@media(min-width:801px) and (max-height:760px){
  html[data-theme="dark"] .hero-content{padding-block:40px 76px}
  html[data-theme="dark"] .hero h1{font-size:clamp(74px,9.2vw,132px);margin-block:14px 24px}
  html[data-theme="dark"] .project-reel-sticky{height:100svh;min-height:0;padding-top:82px;padding-bottom:30px}
  html[data-theme="dark"] .project-reel-visuals{top:18%;height:62%}
  html[data-theme="dark"] .project-reel-copy{top:23%;min-height:250px}
  html[data-theme="dark"] .project-reel-item h2{font-size:clamp(48px,5.4vw,78px)}
  html[data-theme="dark"] .project-reel-item p{margin-bottom:12px}
  html[data-theme="dark"] .project-reel-summary{margin-top:16px;line-height:1.55}
  html[data-theme="dark"] .project-reel-tech{margin-top:13px}
  html[data-theme="dark"] .project-reel-link{bottom:7%}
  html[data-theme="dark"] .project-reel-track{bottom:5%}
}

@media(max-width:1080px){
  html[data-theme="dark"] .section{padding:60px 42px}
  html[data-theme="dark"] .journey-editorial .journey-columns{grid-template-columns:1fr}
  html[data-theme="dark"] .journey-editorial .journey-columns>div:first-child .timeline{grid-template-columns:repeat(2,1fr)}
  html[data-theme="dark"] .project-grid{margin-inline:-42px;padding-inline:42px;grid-auto-columns:minmax(350px,64vw)}
  html[data-theme="dark"] .project-reel-link{right:5vw;width:min(340px,42vw);max-width:90vw}
}
@media(max-width:800px){
  :root{--header-height:74px;--studio-gap:24px;--studio-pad:48px 22px}
  html[data-theme="dark"] .wrap{width:calc(100% - 32px)}
  html[data-theme="dark"] .header-inner{min-height:74px}
  html[data-theme="dark"] .brand-logo{width:130px}
  html[data-theme="dark"] .header.enhanced #navigation{display:none}
  html[data-theme="dark"] .hero-content{grid-template-columns:1fr;padding-block:58px 90px}
  html[data-theme="dark"] .hero h1{font-size:clamp(65px,19vw,112px);letter-spacing:-.07em}
  html[data-theme="dark"] .hero h1 em{margin-left:.14em}
  html[data-theme="dark"] .portrait{max-width:none}
  html[data-theme="dark"] .hero+.wrap,html[data-theme="dark"] main>.wrap{padding-block:24px 72px}
  html[data-theme="dark"] .expertise{margin-bottom:var(--studio-gap)}
  html[data-theme="dark"] .section{margin-top:0;padding:var(--studio-pad);border-radius:26px}
  html[data-theme="dark"] .section+.section{margin-top:0}
  html[data-theme="dark"] .section-heading{margin-bottom:38px}
  html[data-theme="dark"] .section-heading h2{font-size:clamp(40px,12vw,66px)}
  html[data-theme="dark"] .journey-editorial .journey-columns>div:first-child .timeline{grid-template-columns:1fr}
  html[data-theme="dark"] .project-grid{grid-auto-columns:86vw;margin-inline:-22px;padding-inline:22px}
  html[data-theme="dark"] .contact-studio{padding:55px 22px!important;border-radius:26px!important}
  html[data-theme="dark"] .contact-studio .contact-intro h2{font-size:clamp(52px,15vw,78px)!important}
  html[data-theme="dark"] .project-intro h1{font-size:clamp(55px,16vw,88px)}
  html[data-theme="dark"] .project-cover,html[data-theme="dark"] .model-stage{border-radius:22px!important}
  html[data-theme="dark"] .case-layout{gap:30px}
}
@media(max-width:520px){
  html[data-theme="dark"] .scroll-cue{grid-template-columns:42px auto;gap:12px;min-height:48px;bottom:18px;padding-right:18px}
  html[data-theme="dark"] .scroll-cue>span{width:42px;height:42px}
  html[data-theme="dark"] .scroll-cue::after{display:none}
  html[data-theme="dark"] .mobile-dialog{padding:18px 22px}
  html[data-theme="dark"] .mobile-dialog .brand-logo{width:138px}
  html[data-theme="dark"] .mobile-dialog .menu-close{width:48px;height:48px}
  html[data-theme="dark"] .mobile-dialog nav{margin-block:clamp(12px,3vh,24px)}
  html[data-theme="dark"] .mobile-dialog nav a{grid-template-columns:34px minmax(0,1fr) auto;min-height:clamp(54px,8.5vh,68px);padding-block:10px;font-size:clamp(26px,9vw,38px)}
  html[data-theme="dark"] .mobile-dialog .dialog-bottom{grid-template-columns:1fr}
  html[data-theme="dark"] .mobile-dialog .dialog-bottom .eyebrow{grid-column:auto}
  html[data-theme="dark"] .hero-actions{align-items:stretch;flex-direction:column}
  html[data-theme="dark"] .hero .button,html[data-theme="dark"] .recruiter-trigger{width:100%}
  html[data-theme="dark"] .text-link{width:max-content;margin-left:0}
  html[data-theme="dark"] .expertise{grid-template-columns:1fr 1fr;padding:18px 12px}
  html[data-theme="dark"] .journey-editorial .timeline li{min-height:210px}
  html[data-theme="dark"] .journey-dialog-shell{padding:28px 24px}
  html[data-theme="dark"] .journey-dialog-brand{grid-template-columns:68px 1fr}
  html[data-theme="dark"] .journey-dialog-logo{width:68px;height:58px}
}
@media(max-height:620px){
  html[data-theme="dark"] .mobile-dialog{padding-block:14px}
  html[data-theme="dark"] .mobile-dialog .dialog-top{min-height:58px;padding-bottom:12px}
  html[data-theme="dark"] .mobile-dialog .brand-logo{width:132px}
  html[data-theme="dark"] .mobile-dialog .menu-close{width:44px;height:44px}
  html[data-theme="dark"] .mobile-dialog nav{margin-block:8px}
  html[data-theme="dark"] .mobile-dialog nav a{min-height:48px;padding-block:7px;font-size:clamp(24px,4.5vw,34px)}
  html[data-theme="dark"] .mobile-dialog .dialog-bottom{gap:5px 20px;padding-top:10px}
  html[data-theme="dark"] .mobile-dialog .dialog-bottom a{min-height:32px}
}
@media(prefers-reduced-motion:reduce){
  html[data-theme="dark"] .project-card>a,html[data-theme="dark"] .journey-editorial .timeline li,html[data-theme="dark"] .journey-dialog-shell,html[data-theme="dark"] .mobile-dialog[open]{transition:none!important;animation:none!important;transform:none!important}
  html[data-theme="dark"] .scroll-cue>span::after,html[data-theme="dark"] .scroll-cue::after{animation:none!important}
  html[data-theme="dark"] :is(.button,.contact-send,.recruiter-trigger,.journey-open,.project-reel-link,.model-toolbar button,.filters button,.menu-toggle,.journey-dialog-close,.wood-project-nav a)::before{display:none}
}

/* Responsive case-study hero: protect the title and the 3D viewer before mobile. */
@media(max-width:1350px) and (min-width:1200px){
  html[data-theme="dark"] .project-intro-model{grid-template-columns:minmax(250px,.34fr) minmax(0,.66fr);column-gap:clamp(24px,3vw,44px)}
  html[data-theme="dark"] .project-intro-model>h1{font-size:clamp(56px,6.4vw,86px);line-height:.88;letter-spacing:-.065em;overflow-wrap:normal}
  html[data-theme="dark"] .project-intro-model>.project-lead{font-size:clamp(15px,1.45vw,19px);line-height:1.55}
  html[data-theme="dark"] .project-intro-model>.project-meta{gap:12px;margin-top:20px}
  html[data-theme="dark"] .project-intro-model .model-stage model-viewer{height:clamp(390px,50svh,500px)}
}
@media(max-width:1199px){
  html[data-theme="dark"] .project-intro-model{display:block;min-height:0;padding-top:82px;padding-bottom:70px}
  html[data-theme="dark"] .project-intro-model>.back-link{margin-bottom:24px}
  html[data-theme="dark"] .project-intro-model>.eyebrow{margin-top:0}
  html[data-theme="dark"] .project-intro-model>h1{max-width:760px;margin:14px 0 28px;font-size:clamp(52px,10vw,82px);line-height:.88;letter-spacing:-.06em}
  html[data-theme="dark"] .project-intro-model>.model-primary{width:100%;margin:0 0 30px}
  html[data-theme="dark"] .project-intro-model>.project-lead{max-width:720px;font-size:17px;line-height:1.65}
  html[data-theme="dark"] .project-intro-model>.project-meta{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;margin-top:28px}
  html[data-theme="dark"] .project-intro-model>.project-meta>div:last-child{grid-column:auto}
  html[data-theme="dark"] .project-intro-model .model-stage model-viewer{height:clamp(380px,54svh,520px)}
}
@media(max-width:620px){
  html[data-theme="dark"] .project-intro-model{padding-top:74px;padding-bottom:54px}
  html[data-theme="dark"] .project-intro-model>h1{font-size:clamp(46px,15vw,68px);margin-bottom:22px}
  html[data-theme="dark"] .project-intro-model>.project-meta{grid-template-columns:1fr;gap:15px}
  html[data-theme="dark"] .project-intro-model .model-stage{border-radius:22px!important}
  html[data-theme="dark"] .project-intro-model .model-stage model-viewer{height:380px}
}

/* The project CTA belongs to the editorial copy, directly below it. */
html[data-theme="dark"] .project-reel-copy>.project-reel-link{position:absolute;left:0;right:auto;top:calc(100% + 20px);bottom:auto;width:100%;max-width:none;margin:0}
@media(min-width:801px) and (max-height:760px){html[data-theme="dark"] .project-reel-copy>.project-reel-link{top:calc(100% + 14px)}}

/* Journey actions use the same restrained text-link language as Savoir-faire. */
html[data-theme="dark"] .journey-editorial .journey-open{position:static;inset:auto;display:flex;width:100%;max-width:none;min-height:40px;margin-top:auto;padding:13px 0 0!important;justify-content:space-between;align-items:center;align-self:stretch;border:0!important;border-top:1px solid #ffffff18!important;border-radius:0!important;background:transparent!important;box-shadow:none!important;color:#c9a17f!important;font-size:9px;letter-spacing:1px;text-transform:uppercase;overflow:visible}
html[data-theme="dark"] .journey-editorial .journey-open::before{display:none!important}
html[data-theme="dark"] .journey-editorial .journey-open:hover{transform:none;background:transparent!important;border-top-color:#d285486b!important;color:#f0b886!important;box-shadow:none!important}
html[data-theme="dark"] .journey-editorial .journey-open b{font-size:15px;font-weight:400;transition:transform .25s}
html[data-theme="dark"] .journey-editorial .journey-open:hover b{transform:translate(3px,-3px)}
html[data-theme="dark"] .journey-editorial .journey-open{width:38px;min-height:38px;margin-top:auto;margin-left:auto;padding:0!important;align-self:flex-end;justify-content:center;border:1px solid #d2854847!important;border-radius:50%!important}
html[data-theme="dark"] .journey-editorial .journey-open>span{display:none!important}
html[data-theme="dark"] .journey-editorial .journey-open b{display:grid;place-items:center;width:100%;height:100%;margin:0}
html[data-theme="dark"] .journey-editorial .journey-open b .ui-icon{display:block;width:15px;height:15px;margin:0!important;transform:none}
html[data-theme="dark"] .journey-editorial .journey-open:hover{border-color:#d28548a0!important;background:#d2854810!important}