@import url('https://fonts.googleapis.com/css2?family=DM+Mono:wght@400;500&family=Space+Grotesk:wght@400;500;600;700&display=swap');

:root { --ink:#100a24; --violet:#4b10d7; --violet-deep:#300096; --acid:#75f900; --pink:#f510a8; --cream:#fffcf8; --line:rgba(16,10,36,.18); }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; background:var(--cream); color:var(--ink); font-family:'Space Grotesk',Arial,sans-serif; }
a { color:inherit; text-decoration-thickness:1px; text-underline-offset:3px; }
.shell { max-width:1400px; margin:auto; padding:0 32px; }
.site-header { position:sticky; top:0; z-index:10; background:var(--violet); color:var(--acid); border-bottom:1px solid rgba(255,255,255,.2); }
.nav { min-height:70px; display:flex; align-items:center; gap:32px; justify-content:space-between; }
.brand { color:#fff; font-weight:700; font-size:1.1rem; letter-spacing:.2em; text-decoration:none; white-space:nowrap; }
.nav-links { display:flex; align-items:center; justify-content:flex-end; gap:4px; flex-wrap:wrap; }
.nav-links a { padding:10px 13px; color:var(--acid); text-decoration:none; font-weight:600; font-size:.9rem; }
.nav-links a:hover,.nav-links a.active { background:var(--acid); color:var(--violet-deep); }
.menu-button { display:none; color:var(--acid); border:1px solid var(--acid); background:transparent; padding:8px 12px; font:inherit; }
.eyebrow { font:500 .78rem 'DM Mono',monospace; letter-spacing:.08em; text-transform:uppercase; }
.display { font-size:clamp(2.7rem,6vw,6.5rem); letter-spacing:-.07em; line-height:.88; margin:0; max-width:11ch; }
.intro { padding:64px 0 38px; display:grid; grid-template-columns:minmax(250px,.7fr) minmax(340px,1.3fr); align-items:start; gap:clamp(28px,6vw,110px); }
.poster { width:min(100%,360px); aspect-ratio:.61; object-fit:cover; object-position:center; border-radius:2px; box-shadow:14px 14px 0 var(--ink); }
.intro-copy { padding-top:8px; }
.intro-copy h1 { font-size:clamp(2.15rem,4.5vw,4.75rem); letter-spacing:-.065em; line-height:.95; margin:20px 0 30px; max-width:13ch; }
.intro-copy p { font-size:1.15rem; line-height:1.38; max-width:49ch; }
.accent-line { display:block; width:180px; height:13px; margin:24px 0 14px; background:var(--acid); }
.join { margin-top:25px; padding-top:0; display:grid; grid-template-columns:90px max-content max-content max-content; gap:18px; align-items:center; }
.join .accent-line { width:90px; height:7px; margin:0; flex:0 0 90px; }
.join .socials { margin:0; }
.join .socials a { width:27px; height:27px; font-size:.56rem; }
.join .join-links { display:flex; gap:14px; }
.join h2 { font-size:1.1rem; margin:0; }
.join-links { display:grid; gap:7px; }
.join-links a { font-weight:600; color:var(--violet-deep); }
.socials { display:flex; gap:8px; margin-top:22px; }
.socials a { height:38px; width:38px; display:grid; place-items:center; border-radius:50%; background:var(--violet); color:#fff; font-size:.72rem; font-weight:700; text-decoration:none; }
.socials a:hover { color:var(--violet); background:var(--acid); }
.section-title { font-size:clamp(2.25rem,5vw,4.5rem); letter-spacing:-.065em; line-height:.9; margin:0; }
.home-actions { padding:56px 0 92px; display:grid; grid-template-columns:.65fr 1.35fr; gap:80px; }
.home-actions header { position:sticky; top:105px; height:max-content; padding:9px 42px 22px 23px; border-left:8px solid var(--acid); }
.home-actions header p { font-size:1.05rem; line-height:1.35; }
.home-actions .button { display:inline-block; margin-top:18px; }
.action-list { border-top:1px solid var(--ink); }
.action { display:grid; grid-template-columns:80px 1fr auto; gap:18px; align-items:start; padding:23px 0; border-bottom:1px solid var(--ink); text-decoration:none; }
.action:hover { background:var(--acid); margin:0 -12px; padding-left:12px; padding-right:12px; }
.action-index { color:var(--violet); font:500 .8rem 'DM Mono',monospace; }
.action h3 { margin:0; font-size:1.2rem; line-height:1.15; letter-spacing:-.03em; }
.action p { margin:8px 0 0; line-height:1.3; max-width:50ch; }
.action-date { font:500 .72rem 'DM Mono',monospace; text-align:right; max-width:16ch; }
.footer { background:var(--ink); color:#fff; padding:32px 0; }
.footer-inner { display:flex; gap:25px; justify-content:space-between; align-items:flex-end; }
.footer p { font-size:.72rem; max-width:68ch; margin:0; text-transform:uppercase; font-weight:600; }
.footer a { color:var(--acid); }
.editor-toggle { appearance:none; border:0; background:transparent; color:rgba(255,255,255,.24); padding:4px; font:700 .6rem/1 'DM Mono',monospace; cursor:pointer; letter-spacing:.04em; }
.editor-toggle:hover,.editor-toggle:focus-visible { color:var(--acid); outline:1px solid var(--acid); }
.editor-toolbar { position:fixed; z-index:100; left:50%; bottom:18px; transform:translateX(-50%); display:none; width:min(820px,calc(100vw - 28px)); padding:10px; gap:8px; align-items:center; flex-wrap:wrap; background:var(--ink); color:#fff; border:2px solid var(--acid); box-shadow:8px 8px 0 var(--violet); }
.editor-toolbar.is-open { display:flex; }
.editor-toolbar .editor-label { padding:0 6px; font:500 .7rem 'DM Mono',monospace; color:var(--acid); }
.editor-toolbar select,.editor-toolbar input,.editor-toolbar button { height:34px; font:500 .77rem 'Space Grotesk',sans-serif; border:1px solid rgba(255,255,255,.45); }
.editor-toolbar select { background:#fff; color:var(--ink); max-width:116px; }
.editor-toolbar input[type="color"] { width:35px; padding:2px; background:#fff; }
.editor-toolbar button { background:var(--violet); color:#fff; padding:0 9px; cursor:pointer; }
.editor-toolbar button:hover { color:var(--ink); background:var(--acid); }
.editor-toolbar .editor-action { background:var(--pink); color:var(--ink); font-weight:700; }
body.editor-active [data-editor-id] { outline:1px dashed rgba(75,16,215,.6); outline-offset:4px; cursor:text; }
body.editor-active img { outline:2px dashed var(--pink); outline-offset:5px; cursor:pointer; }
body.editor-active .site-header,body.editor-active .footer { position:relative; top:auto; }
.editor-hint { position:fixed; z-index:101; right:18px; bottom:92px; max-width:220px; padding:12px; background:var(--acid); color:var(--ink); box-shadow:5px 5px 0 var(--violet); font-size:.77rem; line-height:1.25; }
.page-hero { padding:84px 0 54px; background:var(--violet); color:#fff; }
.page-hero .display { max-width:10ch; }
.page-hero p { max-width:58ch; font-size:1.15rem; line-height:1.35; margin:24px 0 0; }
.projects { padding:70px 0 100px; }
.project { position:relative; display:grid; grid-template-columns:minmax(240px,.72fr) minmax(340px,1.28fr); gap:clamp(24px,6vw,96px); padding:62px 0; overflow:visible; }
.project:before { content:""; position:absolute; top:0; left:0; right:0; height:2px; background:var(--ink); }
.project:after { content:""; position:absolute; z-index:1; top:-4px; left:calc(50% - 23px); width:46px; height:10px; background:linear-gradient(90deg,var(--cream) 0 3px,var(--violet) 3px 13px,var(--cream) 13px 17px,var(--acid) 17px 27px,var(--cream) 27px 31px,var(--pink) 31px 41px,var(--cream) 41px 46px); }
.project:last-child:before { top:auto; bottom:0; }
.project:last-child:after { top:auto; bottom:-4px; }
.project-image { width:100%; aspect-ratio:595/842; object-fit:cover; transition:transform .45s ease,filter .45s ease; }
.project:hover .project-image { transform:scale(1.045) rotate(-.45deg); filter:saturate(1.14) contrast(1.04); }
.project-tag { color:var(--violet); font:500 .78rem 'DM Mono',monospace; text-transform:uppercase; }
.project h2 { font-size:clamp(2rem,4vw,4rem); letter-spacing:-.06em; line-height:.92; margin:13px 0 22px; }
.project h3 { font-size:1.25rem; line-height:1.13; margin:32px 0 12px; }
.project p,.project li { font-size:1.04rem; line-height:1.42; }
.project ul { padding-left:1.1em; }
.dates { display:grid; gap:7px; margin:25px 0 0; padding:0; list-style:none; }
.dates li { border-left:7px solid var(--pink); padding:4px 0 4px 12px; font-weight:600; }
.map-layout { min-height:600px; padding:58px 0 92px; display:grid; grid-template-columns:1fr 310px; gap:30px; }
.map-surface { position:relative; min-height:560px; overflow:hidden; background:var(--acid); border:2px solid var(--ink); background-image:linear-gradient(rgba(75,16,215,.16) 1px,transparent 1px),linear-gradient(90deg,rgba(75,16,215,.16) 1px,transparent 1px); background-size:45px 45px; }
.map-surface:before { content:'NORMANDIE'; position:absolute; right:24px; bottom:10px; color:rgba(75,16,215,.25); font-size:clamp(3rem,10vw,9rem); font-weight:700; letter-spacing:-.08em; }
.map-blurb { position:absolute; left:25px; top:25px; max-width:280px; font-size:1.05rem; line-height:1.25; }
.dot { position:absolute; width:23px; height:23px; border-radius:50%; background:var(--pink); border:3px solid var(--ink); box-shadow:4px 4px 0 var(--violet); }
.dot:after { content:attr(data-name); position:absolute; top:23px; left:10px; width:max-content; max-width:130px; color:var(--ink); font:500 .68rem 'DM Mono',monospace; }
.filters { background:var(--ink); color:#fff; padding:23px; height:max-content; }
.filters h2 { margin:0 0 20px; font-size:1.25rem; }
.filter-group { padding:18px 0; border-top:1px solid rgba(255,255,255,.35); }
.filter-group h3 { font:500 .75rem 'DM Mono',monospace; margin:0 0 10px; text-transform:uppercase; color:var(--acid); }
.filter { display:flex; gap:8px; align-items:center; font-size:.9rem; padding:5px 0; }
.filter input { accent-color:var(--pink); }
.newsletter { min-height:65vh; padding:90px 0; display:grid; grid-template-columns:1fr 1fr; gap:80px; align-items:center; }
body.newsletter-page { min-height:100vh; display:flex; flex-direction:column; }
.newsletter-page main { flex:1; width:100%; }
.workshops { padding:70px 0 100px; }
.workshop-intro { max-width:760px; margin-bottom:48px; }
.workshop-intro h2 { font-size:clamp(2rem,4vw,3.7rem); letter-spacing:-.06em; line-height:.94; margin:14px 0 18px; }
.workshop-intro p { font-size:1.1rem; line-height:1.42; }
.workshop-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:0 42px; }
.workshop-card { position:relative; min-height:280px; padding:38px 0 34px 72px; border-top:2px solid var(--ink); }
.workshop-card:before { content:attr(data-number); position:absolute; left:0; top:39px; color:var(--violet); font:500 .78rem 'DM Mono',monospace; }
.workshop-card:after { content:""; position:absolute; top:-4px; left:0; width:32px; height:8px; background:linear-gradient(90deg,var(--violet) 0 10px,var(--acid) 10px 20px,var(--pink) 20px 30px); }
.workshop-card:nth-last-child(-n+2) { border-bottom:2px solid var(--ink); }
.workshop-card h3 { font-size:clamp(1.45rem,2.6vw,2.25rem); letter-spacing:-.055em; line-height:.98; margin:10px 0 18px; }.workshop-card p { font-size:1rem; line-height:1.4; margin:0; }.workshop-card .workshop-meta { margin:17px 0 20px; color:var(--violet); font:500 .72rem 'DM Mono',monospace; text-transform:uppercase; }.workshop-card .workshop-image { display:block; width:100%; aspect-ratio:16/8; object-fit:cover; filter:saturate(.95) contrast(1.04); }.workshop-card .workshop-detail { margin-top:13px; font-size:.92rem; }
.construction { padding:78px 0 120px; min-height:58vh; }.construction-card { max-width:820px; padding:clamp(30px,7vw,90px); background:var(--acid); box-shadow:16px 16px 0 var(--violet); }.construction-card h2 { font-size:clamp(2.3rem,5vw,5rem); letter-spacing:-.07em; line-height:.88; margin:16px 0 22px; }.construction-card p { font-size:1.1rem; line-height:1.4; max-width:45ch; }
.newsletter-card { background:var(--pink); padding:clamp(26px,5vw,60px); box-shadow:14px 14px 0 var(--violet); }
.newsletter-card h1 { font-size:clamp(2.4rem,5vw,5rem); letter-spacing:-.075em; line-height:.87; margin:0 0 20px; }
.form { display:grid; gap:12px; margin-top:30px; }
.form label { font:500 .78rem 'DM Mono',monospace; text-transform:uppercase; }
.form input { font:inherit; padding:14px; border:2px solid var(--ink); background:var(--cream); }
.form button,.button { cursor:pointer; border:2px solid var(--ink); background:var(--acid); color:var(--ink); padding:14px 16px; font:700 1rem 'Space Grotesk',sans-serif; text-decoration:none; text-align:center; }
.form button:hover,.button:hover { background:var(--violet); color:#fff; }
.note { font-size:.78rem; line-height:1.3; }
@media (max-width:760px) { .shell{padding:0 27px}.nav{min-height:62px}.menu-button{display:block}.nav-links{display:none;position:absolute;top:62px;left:0;right:0;background:var(--violet);padding:12px 27px;border-top:1px solid rgba(255,255,255,.25)}.nav-links.open{display:grid}.nav-links a{padding:12px 0}.intro,.project,.newsletter{grid-template-columns:1fr}.intro{padding:42px 27px 32px}.poster{width:min(330px,82vw)}.home-actions{grid-template-columns:1fr;gap:34px;padding:50px 27px 60px}.home-actions header{position:static;padding:6px 24px 20px 17px}.action{grid-template-columns:38px 1fr}.action-date{grid-column:2;text-align:left}.page-hero{padding:54px 0 45px}.projects,.workshops{padding:45px 27px 70px}.newsletter{padding-left:27px;padding-right:27px}.project{padding:42px 0}.map-layout{grid-template-columns:1fr;padding:38px 27px 62px}.construction{padding-left:27px;padding-right:27px}.map-surface{min-height:440px}.footer-inner{display:grid;gap:14px}.join{display:flex;align-items:center;gap:12px}.join .accent-line{flex-basis:64px;width:64px}.join .join-links{width:100%}.display{font-size:3.4rem}.workshop-grid{grid-template-columns:1fr}.workshop-card{min-height:0;padding:31px 0 29px 54px}.workshop-card:before{top:32px}.workshop-card:nth-last-child(-n+2){border-bottom:0}.workshop-card:last-child{border-bottom:2px solid var(--ink)}.editor-toolbar{bottom:10px;justify-content:center}.editor-hint{bottom:176px;right:12px} }
@media (prefers-reduced-motion:reduce) { .project-image { transition:none; }.project:hover .project-image { transform:none; } }
