@font-face{font-family: 'Archivo';font-style: normal;font-weight: 400 900;font-stretch: 62% 125%;font-display: swap;src: url("../fonts/Archivo-normal-latin-ext.woff2") format('woff2');unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;}
@font-face{font-family: 'Archivo';font-style: normal;font-weight: 400 900;font-stretch: 62% 125%;font-display: swap;src: url("../fonts/Archivo-normal-latin.woff2") format('woff2');unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;}
@font-face{font-family: 'Caveat';font-style: normal;font-weight: 500 700;font-display: swap;src: url("../fonts/Caveat-normal-latin-ext.woff2") format('woff2');unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;}
@font-face{font-family: 'Caveat';font-style: normal;font-weight: 500 700;font-display: swap;src: url("../fonts/Caveat-normal-latin.woff2") format('woff2');unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;}
@font-face{font-family: 'Instrument Sans';font-style: italic;font-weight: 400 700;font-stretch: 100%;font-display: swap;src: url("../fonts/InstrumentSans-italic-latin-ext.woff2") format('woff2');unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;}
@font-face{font-family: 'Instrument Sans';font-style: italic;font-weight: 400 700;font-stretch: 100%;font-display: swap;src: url("../fonts/InstrumentSans-italic-latin.woff2") format('woff2');unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;}
@font-face{font-family: 'Instrument Sans';font-style: normal;font-weight: 400 700;font-stretch: 100%;font-display: swap;src: url("../fonts/InstrumentSans-normal-latin-ext.woff2") format('woff2');unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;}
@font-face{font-family: 'Instrument Sans';font-style: normal;font-weight: 400 700;font-stretch: 100%;font-display: swap;src: url("../fonts/InstrumentSans-normal-latin.woff2") format('woff2');unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;}

:root{
--hl-black:#0B0B0C;--hl-ink:#141416;--hl-graphite:#2A2A2E;--hl-stone:#6B6862;--hl-mist:#D9D4CB;--hl-sand:#EFEAE1;--hl-paper:#FBF8F3;--hl-white:#FFFFFF;
--hl-red:#E30613;--hl-orange:#F39200;--hl-yellow:#FFD500;--hl-green:#009640;--hl-cyan:#009FE3;--hl-blue:#0069B4;--hl-purple:#951B81;--hl-pink:#E6007E;
--hl-cyan-deep:#00679A;--hl-pink-deep:#B00061;--hl-green-deep:#007533;
--hl-spectrum:conic-gradient(from 200deg,var(--hl-pink),var(--hl-red),var(--hl-orange),var(--hl-yellow),var(--hl-green),var(--hl-cyan),var(--hl-blue),var(--hl-purple),var(--hl-pink));
--hl-spectrum-line:linear-gradient(90deg,var(--hl-red),var(--hl-orange),var(--hl-yellow),var(--hl-green),var(--hl-cyan),var(--hl-blue),var(--hl-purple),var(--hl-pink));
--bg:var(--hl-paper);--surface:var(--hl-white);--surface-sunk:var(--hl-sand);--surface-inverse:var(--hl-black);
--fg-1:var(--hl-ink);--fg-2:#4A4843;--fg-3:var(--hl-stone);--fg-inverse:var(--hl-paper);
--line:var(--hl-mist);--line-strong:var(--hl-ink);
--accent:var(--hl-cyan);--accent-text:var(--hl-cyan-deep);--accent-fg:var(--hl-black);
--accent-vicky:var(--hl-cyan);--accent-vicky-text:var(--hl-cyan-deep);--accent-victor:var(--hl-pink);--accent-victor-text:var(--hl-pink-deep);
--highlight:var(--hl-yellow);--focus:var(--hl-blue);
--success:var(--hl-green-deep);--danger:#C4000F;
--link:var(--hl-cyan-deep);--link-hover:var(--hl-pink-deep);
--eclipse:var(--hl-black);
}
[data-theme="dark"]{
--bg:#0E0E10;--surface:#18181B;--surface-sunk:#070708;--surface-inverse:var(--hl-paper);
--fg-1:#F4F1EA;--fg-2:#C2BEB5;--fg-3:#8F8B83;--fg-inverse:var(--hl-ink);
--line:#2E2E33;--line-strong:#F4F1EA;
--accent:var(--hl-cyan);--accent-text:#33B8F0;--accent-fg:var(--hl-black);
--accent-vicky-text:#33B8F0;--accent-victor-text:#FF4FA8;
--highlight:var(--hl-yellow);--focus:#33B8F0;
--success:#1FC263;--danger:#FF4D57;
--link:#33B8F0;--link-hover:#FF4FA8;
--eclipse:#000000;
}
:root{
--font-display:"Archivo","Helvetica Neue",Helvetica,Arial,sans-serif;
--font-body:"Instrument Sans","Helvetica Neue",Helvetica,Arial,sans-serif;
--font-hand:"Caveat","Comic Neue",cursive;
--text-xs:0.8125rem;--text-sm:0.9375rem;--text-md:1.0625rem;--text-lg:1.25rem;
--text-xl:clamp(1.5rem,1.2rem + 1.2vw,2rem); 
--text-2xl:clamp(2rem,1.4rem + 2.6vw,3.25rem); 
--text-3xl:clamp(2.75rem,1.6rem + 5vw,5.5rem); 
--text-4xl:clamp(3.5rem,1.8rem + 8vw,9rem); 
--weight-body:400;--weight-medium:560;--weight-bold:700;--weight-display:860;
--leading-tight:0.92;--leading-snug:1.15;--leading-body:1.6;
--tracking-display:-0.02em;--tracking-label:0.32em;
--type-display:var(--weight-display) var(--text-3xl)/var(--leading-tight) var(--font-display);
--type-h2:var(--weight-display) var(--text-2xl)/var(--leading-tight) var(--font-display);
--type-h3:750 var(--text-xl)/var(--leading-snug) var(--font-display);
--type-body:var(--weight-body) var(--text-md)/var(--leading-body) var(--font-body);
--type-small:var(--weight-body) var(--text-sm)/1.5 var(--font-body);
--type-label:600 var(--text-xs)/1 var(--font-body);
--type-hand:600 1.5rem/1.1 var(--font-hand);
}
:root{
--space-1:4px;--space-2:8px;--space-3:12px;--space-4:16px;--space-5:24px;--space-6:32px;--space-7:48px;--space-8:64px;--space-9:96px;--space-10:144px;
--gutter:clamp(20px,4vw,48px); 
--section-y:clamp(64px,10vw,144px); 
--content-max:1200px;--measure:62ch;
--radius-sm:6px;--radius-md:14px;--radius-lg:28px;--radius-pill:999px;--radius-round:50%;
--border-thin:1px;--border-bold:2px;
--shadow-sticker:4px 4px 0 var(--line-strong);--shadow-sticker-lg:8px 8px 0 var(--line-strong);
--shadow-soft:0 1px 2px rgb(0 0 0/.06),0 8px 24px rgb(0 0 0/.08);
--ease-out:cubic-bezier(.2,.8,.2,1); 
--ease-bounce:cubic-bezier(.34,1.56,.64,1); 
--dur-fast:140ms; 
--dur-base:240ms; 
--dur-slow:600ms; 
--bp-sm:640px;--bp-md:900px;--bp-lg:1200px;
}
@media (prefers-reduced-motion:reduce){:root{
--dur-fast:0ms; 
--dur-base:0ms; 
--dur-slow:0ms; 
}}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:76px}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
body{margin:0;background:var(--bg);color:var(--fg-1);font:var(--type-body);-webkit-font-smoothing:antialiased}
h1,h2,h3{font-family:var(--font-display);letter-spacing:var(--tracking-display);text-wrap:balance;margin:0}
p{text-wrap:pretty;margin:0}
a{color:var(--link);text-underline-offset:.18em;text-decoration-thickness:2px}a:hover{color:var(--link-hover)}
:focus-visible{outline:3px solid var(--focus);outline-offset:3px;border-radius:4px}
::selection{background:var(--hl-yellow);color:var(--hl-black)}
img{max-width:100%;display:block}
.skip{position:absolute;left:-9999px}.skip:focus{left:16px;top:16px;z-index:99;background:var(--bg);padding:8px 12px}
.wrap{max-width:var(--content-max);margin:0 auto;width:100%}
.sec{padding:var(--section-y) var(--gutter)}.sunk{background:var(--surface-sunk)}
.stack{display:grid;gap:var(--space-7)}
/* header */
.hdr{position:sticky;top:0;z-index:10;background:color-mix(in oklab,var(--bg) 88%,transparent);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-bottom:1px solid var(--line)}
.hdr .wrap{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:12px var(--gutter)}
.hdr .logo img{height:52px;width:auto}.logo .d{display:none}[data-theme=dark] .logo .l{display:none}[data-theme=dark] .logo .d{display:block}
.nav{display:flex;align-items:center;gap:var(--space-5)}
.nav ul{display:flex;gap:var(--space-5);list-style:none;margin:0;padding:0}
.nav ul a{color:var(--fg-1);text-decoration:none;font:600 var(--text-sm)/1 var(--font-body)}.nav ul a:hover{color:var(--link-hover)}
.round{width:44px;height:44px;border-radius:50%;border:1px solid var(--line);background:transparent;cursor:pointer;padding:0;display:grid;place-items:center;color:var(--fg-1);transition:border-color var(--dur-fast)}
.round:hover{border-color:var(--fg-3)}
.disc{width:16px;height:16px;border-radius:50%;border:1.5px solid var(--fg-1);background:linear-gradient(90deg,var(--fg-1) 50%,transparent 50%);transition:transform var(--dur-base) var(--ease-out)}
[data-theme=dark] .disc{transform:rotate(180deg)}
.burger{display:none;font:700 18px/1 var(--font-body)}
.mnav{display:none;list-style:none;margin:0;padding:8px var(--gutter) 20px}
.mnav a{display:block;padding:10px 0;color:var(--fg-1);text-decoration:none;font:860 var(--text-xl)/1 var(--font-display)}
.hdr.open .mnav{display:grid}
@media(max-width:640px){.nav ul{display:none}.burger{display:grid}}
/* buttons */
.btn{display:inline-flex;align-items:center;gap:10px;font:650 var(--text-md)/1 var(--font-body);border-radius:var(--radius-pill);padding:12px 22px;text-decoration:none;border:2px solid var(--line-strong);white-space:nowrap;transition:transform var(--dur-fast) var(--ease-out),box-shadow var(--dur-fast) var(--ease-out),color var(--dur-fast)}
.btn.lg{padding:16px 30px;font-size:var(--text-lg)}
.btn:hover{transform:translate(-2px,-2px);box-shadow:var(--shadow-sticker)}.btn:active{transform:translate(2px,2px);box-shadow:none}
.btn .ar{transition:transform var(--dur-fast)}.btn:hover .ar{transform:translateX(3px)}
.btn.p{background:var(--fg-1);color:var(--bg);border-color:var(--fg-1)}.btn.p:hover{color:var(--bg)}
.btn.s{background:transparent;color:var(--fg-1)}.btn.s:hover{color:var(--fg-1)}
.btn.a{background:var(--accent);color:var(--accent-fg)}.btn.a:hover{color:var(--accent-fg)}
.btn.g{border-color:transparent;background:transparent;color:var(--fg-1);text-decoration:underline;text-underline-offset:.2em;white-space:normal}.btn.g:hover{transform:none;box-shadow:none;color:var(--link-hover)}
.row{display:flex;flex-wrap:wrap;gap:12px;align-items:center}
/* mark */
.mark{position:absolute;aspect-ratio:1;background:url(../img/mark-1200.webp) center/contain no-repeat;animation:spin 90s linear infinite;pointer-events:none}
@keyframes spin{to{rotate:360deg}}
@media(prefers-reduced-motion:reduce){.mark{animation:none}}
/* hero */
.hero{position:relative;min-height:calc(100svh - 77px);display:grid;align-content:end;padding:32px var(--gutter) 72px;overflow:hidden;background:var(--bg);color:var(--fg-1)}
.hero .mark{width:120vw;right:-50vw;top:4%}
.hero .wrap{position:relative;z-index:2;display:grid;gap:28px}
.hero h1{font:860 clamp(3.4rem,1.5rem + 9vw,9.5rem)/.86 var(--font-display);letter-spacing:-.035em;font-stretch:92%}
.hero h1 span{color:var(--accent-text)}
.hero .lead{font:400 var(--text-lg)/1.5 var(--font-body);color:var(--fg-2);max-width:34ch}.hero .lead b{color:var(--fg-1);font-weight:600}
.who{display:flex;gap:18px;flex-wrap:wrap}.who span{display:inline-flex;gap:8px;align-items:center;font:600 var(--text-sm)/1 var(--font-body)}
.dot{width:12px;height:12px;border-radius:50%;display:inline-block;flex:none}
@media(min-width:720px){.hero{align-content:center}.hero .mark{width:820px;right:-42vw;top:50%;translate:0 -50%}}
@media(min-width:1200px){.hero .mark{right:-8vw}}
.hero .mark{position:fixed;z-index:1;transition:width .9s cubic-bezier(.2,.7,.2,1),right .9s cubic-bezier(.2,.7,.2,1),top .9s cubic-bezier(.2,.7,.2,1),translate .9s cubic-bezier(.2,.7,.2,1),opacity .6s}
main>section>:not(.mark),.ftr>*{position:relative;z-index:2}
.docked .hero .mark{opacity:.2}
.at-contact .hero .mark{opacity:.9;width:min(90vw,640px);right:-20vw;top:50%;translate:0 -50%}
/* section header */
.sh{display:grid;gap:var(--space-4);max-width:var(--measure)}
.sh h2{font:var(--type-h2);letter-spacing:var(--tracking-display)}
.sh p{font:400 var(--text-lg)/1.5 var(--font-body);color:var(--fg-2)}
/* people */
.duo{display:grid;gap:var(--space-8) var(--space-7)}@media(min-width:900px){.duo{grid-template-columns:1fr 1fr}}
.person{display:grid;gap:var(--space-5);align-content:start}
.ph{position:relative;width:100%;max-width:340px}
.ph .bg{position:absolute;inset:8% -4% -4% 8%;border-radius:var(--radius-lg)}
.ph img{position:relative;width:100%;height:auto;aspect-ratio:3/4;object-fit:cover;object-position:50% 20%;border-radius:var(--radius-lg);border:2px solid var(--line-strong);background:#fff}
.note{position:absolute;right:-8px;bottom:28px;font:700 1.6rem/1 var(--font-hand);transform:rotate(6deg);background:var(--bg);padding:4px 10px;border-radius:var(--radius-sm)}
.person .ph + div{margin-top:var(--space-7)}.person h3{font:860 var(--text-2xl)/.95 var(--font-display)}
.role{font:600 var(--text-lg)/1.3 var(--font-body);display:block;margin-top:var(--space-2)}
.person p{color:var(--fg-2)}
.skills{margin:0;padding:0;list-style:none;border-top:2px solid var(--line-strong)}
.skills li{display:flex;align-items:center;gap:12px;padding:12px 0;border-bottom:1px solid var(--line);font:600 var(--text-md)/1.3 var(--font-body)}
.skills .dot{width:10px;height:10px}
.links{display:flex;flex-wrap:wrap;gap:var(--space-3) var(--space-5)}
.xl{display:inline-flex;align-items:baseline;gap:8px;color:var(--fg-1);text-decoration:none;font:600 var(--text-md)/1.3 var(--font-body);border-bottom:2px solid var(--line);padding-bottom:2px;transition:color var(--dur-fast),border-color var(--dur-fast)}
.xl:hover{color:var(--link-hover);border-color:var(--link-hover)}.xl small{font-weight:400;font-size:inherit;color:var(--fg-3)}
.xl .ar{transition:transform var(--dur-fast)}.xl:hover .ar{transform:translate(2px,-2px)}
.vicky .bg,.vicky .dot{background:var(--accent-vicky)}.vicky .role,.vicky .note{color:var(--accent-vicky-text)}
.victor .bg,.victor .dot{background:var(--accent-victor)}.victor .role,.victor .note{color:var(--accent-victor-text)}
/* cards */
.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,280px),1fr));gap:var(--space-5)}
.card{display:grid;gap:var(--space-4);align-content:start;padding:var(--space-6);background:var(--surface);border:2px solid var(--line-strong);border-radius:var(--radius-lg);box-shadow:var(--shadow-sticker);transition:transform var(--dur-base) var(--ease-out),box-shadow var(--dur-base) var(--ease-out)}
.card:hover{transform:translate(-3px,-3px);box-shadow:var(--shadow-sticker-lg)}
.card .ac{width:40px;height:40px;border-radius:50%;border:2px solid var(--line-strong);transition:transform var(--dur-base) var(--ease-bounce)}.card:hover .ac{transform:scale(1.12)}
.card h3{font:var(--type-h3)}.card p{color:var(--fg-2)}
.chips{margin:0;padding:0;list-style:none;display:flex;flex-wrap:wrap;gap:8px}
.chips li{font:500 var(--text-sm)/1 var(--font-body);padding:6px 10px;border-radius:var(--radius-pill);background:var(--surface-sunk)}
.sunk .chips li{background:var(--bg)}
/* workshops */
.wshead{display:flex;flex-wrap:wrap;gap:var(--space-5);align-items:end;justify-content:space-between}
.hand{font:700 1.7rem/1 var(--font-hand);color:var(--accent-vicky-text);transform:rotate(-4deg);display:inline-block}
.info{margin:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,260px),1fr));gap:var(--space-6);border-top:2px solid var(--line-strong);padding-top:var(--space-6)}
.info div{display:grid;gap:var(--space-3);align-content:start}.info dt{font:var(--type-h3)}
.info dd{margin:0;display:flex;gap:10px;color:var(--fg-2)}.info dd::before{content:"";width:8px;height:8px;border-radius:50%;background:var(--accent-vicky);flex:none;margin-top:.65em}
/* steps */
.steps{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,190px),1fr));gap:var(--space-6)}
.steps li{display:grid;gap:var(--space-3);align-content:start}
.num{width:64px;height:64px;border-radius:50%;background:var(--eclipse);color:#F4F1EA;display:grid;place-items:center;font:860 1.5rem/1 var(--font-display);box-shadow:0 0 0 4px var(--surface-sunk),0 0 0 7px var(--c)}
.steps h3{font:var(--type-h3);margin-top:8px}.steps p{color:var(--fg-2)}
/* contact */
.contact{position:relative;overflow:hidden;background:var(--hl-black);color:#F4F1EA}
.contact .wrap{position:relative;z-index:2;display:grid;gap:var(--space-5);justify-items:start}
.contact h2{font:860 var(--text-3xl)/.9 var(--font-display);letter-spacing:-.03em;max-width:12ch}
.contact p{font:400 var(--text-lg)/1.5 var(--font-body);color:#C2BEB5;max-width:38ch}
.contact .btn{border-color:#F4F1EA}.contact .btn:hover{box-shadow:4px 4px 0 #F4F1EA}
/* footer */
.ftr{background:var(--hl-black);color:#F4F1EA}
.ftr .rule{height:6px;background:var(--hl-spectrum-line)}
.ftr .wrap{padding:var(--space-8) var(--gutter) var(--space-6);display:grid;gap:var(--space-7)}
.brand{display:flex;align-items:center;gap:var(--space-4)}.brand img{width:56px;height:56px}
.brand b{display:block;font:860 1.5rem/1 var(--font-display);letter-spacing:-.01em}.brand span{display:block;font:500 .75rem/1 var(--font-body);letter-spacing:.4em;color:var(--hl-cyan);margin-top:6px}
.ftr dl{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:var(--space-5);margin:0}
.ftr dt{font:var(--type-label);letter-spacing:.24em;text-transform:uppercase;color:var(--hl-cyan);margin-bottom:8px}
.ftr dd{margin:0;font:var(--type-small);color:#C2BEB5}.ftr dd span{display:block}
.ftr a{color:#F4F1EA;text-decoration-color:var(--hl-cyan)}.ftr a:hover{color:#FF4FA8}
.legal{border-top:1px solid #2E2E33;padding-top:var(--space-4);display:flex;justify-content:space-between;flex-wrap:wrap;gap:8px;font:var(--type-small);color:#8F8B83}

@media(max-width:640px){.hand{display:none}}