@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400&family=Instrument+Serif:ital@0;1&display=swap');
:root{color-scheme:dark;background:#101110;color:#e6e4dc;font-family:'DM Sans',Arial,sans-serif;-webkit-font-smoothing:antialiased}
*{box-sizing:border-box}body{margin:0}main{min-height:100svh;display:grid;place-items:center;padding:32px;overflow:hidden}
.identity{text-align:center;will-change:transform}
h1{font-family:'Instrument Serif',Georgia,serif;font-size:36px;font-weight:400;letter-spacing:-.8px;line-height:1.1;margin:0 0 18px}h1 em{font-weight:400}
p{font-size:11px;font-weight:400;line-height:1.9;letter-spacing:.12px;margin:0;color:#b5b6ad}p span{color:#8f9288}
@media(max-width:520px){h1{font-size:32px}p{font-size:10px}}
@media(prefers-reduced-motion:reduce){.identity{transform:none!important;will-change:auto}}

main{position:relative;isolation:isolate}.cinema{position:absolute;inset:0;width:100%;height:100%;z-index:-2;pointer-events:none}.cinema-shade{position:absolute;inset:0;z-index:-1;pointer-events:none;background:radial-gradient(ellipse at center,#10111055,transparent 55%),linear-gradient(0deg,#10111088,transparent 30%,transparent 70%,#10111088)}.identity{position:relative;text-shadow:0 2px 18px #000,0 1px 4px #000} .identity p{color:#dddcd4}.identity p span{color:#c0c2b8}
.cinema-pause{position:fixed;bottom:24px;right:28px;display:grid;place-items:center;width:32px;height:32px;border:1px solid #ffffff24;border-radius:50%;background:#10111055;color:#b5b6ad;cursor:pointer;font-size:11px;opacity:.55;transition:opacity .2s}.cinema-pause:hover,.cinema-pause:focus-visible{opacity:1}.cinema-pause[hidden]{display:none}

/* Optics belong to the camera, not to any individual frame. */
.cinema{mask-image:linear-gradient(90deg,transparent,#000 29%,#000 71%,transparent)}
.cinema-optics{position:absolute;inset:0;width:100%;height:100%;z-index:-2;pointer-events:none;opacity:.76;filter:url(#edge-optics);mask-image:linear-gradient(90deg,#000,transparent 29%,transparent 71%,#000)}
.identity{position:absolute;top:72%;left:0;width:100%;padding:0 20px}
.campaign-copy{position:absolute;top:42%;left:50%;transform:translate(-50%,-50%);width:min(80%,520px);text-align:center;font-size:11px;line-height:2;letter-spacing:.8px;color:#fff;pointer-events:none;text-shadow:0 2px 12px #000,0 1px 4px #000;opacity:0;transition:opacity .35s}
.campaign-copy span{display:inline-block;color:inherit;opacity:0;filter:blur(5px);transform:translateY(8px) scale(.96);transition:opacity .7s,filter .9s,transform .9s cubic-bezier(.2,.8,.2,1);transition-delay:0s}
.campaign-copy.is-visible{opacity:1}.campaign-copy.is-visible span{opacity:1;filter:blur(0);transform:none;transition-delay:calc(var(--i)*45ms)}
@media(max-width:520px){.campaign-copy{font-size:10px;max-width:290px;letter-spacing:.45px}.identity{top:69%}}
@media(prefers-reduced-motion:reduce){.campaign-copy,.campaign-copy span{transition:none;filter:none;transform:none}.campaign-copy{transform:translate(-50%,-50%)}}

/* A small foreground ribbon, turning on a different axis from the carousel. */
.campaign-copy{top:calc(42% + min(7vw, 7vh));perspective:650px;overflow:visible}
.campaign-copy .copy-word{transform-origin:50% 100%;transform:translate3d(24px,12px,-70px) rotateY(55deg) rotateX(-18deg);filter:blur(4px)}
.campaign-copy .copy-word b{display:inline-block;font-weight:400;transform:translateY(var(--arc)) rotate(var(--tilt)) scaleY(var(--stretch))}
.campaign-copy.is-visible .copy-word{animation:copy-orbit 1100ms cubic-bezier(.16,1,.3,1) both;animation-delay:calc(var(--i)*55ms);transform:translateZ(0);filter:none}
@keyframes copy-orbit{from{opacity:0;filter:blur(4px);transform:translate3d(24px,12px,-70px) rotateY(55deg) rotateX(-18deg)}60%{opacity:1;filter:blur(.3px)}to{opacity:1;filter:blur(0);transform:translateZ(0) rotateY(0) rotateX(0)}}
@media(prefers-reduced-motion:reduce){.campaign-copy .copy-word,.campaign-copy.is-visible .copy-word{animation:none!important;transform:none;filter:none}}
/* A separate foreground plane, with a visible gap below the projected image. */
.campaign-copy{perspective:340px;width:min(62%,430px);max-width:430px;transform:translate(calc(-50% + var(--copy-x,0px)),calc(-50% + var(--copy-y,0px))) scale(1.45);text-shadow:0 8px 28px #000c,0 1px 5px #000;z-index:2}
.campaign-copy.is-visible .copy-word{transform:translateZ(0)}
@keyframes copy-orbit{from{opacity:0;filter:blur(5px);transform:translate3d(38px,25px,-140px) rotateY(60deg) rotateX(-22deg)}60%{opacity:1;filter:blur(.3px)}to{opacity:1;filter:blur(0);transform:translateZ(0)}}
@media(max-width:520px){.campaign-copy{width:63%;font-size:10px;line-height:1.9}.identity h1{margin-bottom:12px}}
@media(prefers-reduced-motion:reduce){.campaign-copy{transform:translate(-50%,-50%) scale(1.45)}}

/* Optical softness only at the ends of the campaign lettering. */
.campaign-copy .copy-word b{filter:blur(var(--edge-blur,0px));text-shadow:calc(-1 * var(--fringe,0px)) 0 rgb(255 95 100 / var(--fringe-alpha,0)),var(--fringe,0px) 0 rgb(95 205 255 / var(--fringe-alpha,0)),0 1px 5px #0008}

/* Each chapter shares the same quiet camera and its own space. */
html{scroll-behavior:smooth}main{display:block;padding:0;overflow:clip;isolation:auto}
.hero,.films-section{position:relative;isolation:isolate;height:100svh;min-height:600px;overflow:hidden}
.hero .cinema-pause{position:absolute}
.scroll-cue{position:absolute;bottom:28px;left:50%;color:#8f9288;text-decoration:none;font-size:16px;transform:translateX(-50%);padding:12px}
h2{font-size:11px;font-weight:400;letter-spacing:.8px;color:#c0c2b8;margin:0 0 12px}
.groups-section{padding:130px 24px 150px;text-align:center}
.groups-section header{margin-bottom:72px}.groups-section header p{color:#777c73;font-size:10px}
.groups-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:25px}
.groups-list li{font-size:clamp(22px,3.3vw,38px);font-weight:400;letter-spacing:-1.4px;line-height:1.4;transition:opacity 1s,transform 1.2s,filter 1.2s}
.groups-list li b{font-weight:400;display:inline-block;filter:blur(var(--soft));text-shadow:var(--color-shift) 0 #7ad9ff35,calc(-1 * var(--color-shift)) 0 #ff797935;transform:translateY(var(--bend))}
.groups-list li.pending{opacity:0;filter:blur(7px);transform:perspective(700px) translateY(30px) rotateX(15deg)}
.films-section{min-height:650px}.films-section h2{position:absolute;top:12%;width:100%;text-align:center}
.film-label{text-transform:uppercase;position:absolute;top:76%;left:0;width:100%;text-align:center;color:#dddcd4;letter-spacing:.8px}
.film-controls{position:absolute;top:83%;width:100%;display:flex;justify-content:center;gap:20px}
.film-controls button{width:34px;height:34px;border:1px solid #ffffff24;border-radius:50%;background:transparent;color:#b5b6ad;cursor:pointer}
.film-controls button:hover,.film-controls button:focus-visible{border-color:#ffffff80;color:white}
@media(max-width:520px){.hero{min-height:520px}.groups-section{padding:100px 24px}.groups-list{gap:24px}.films-section{min-height:540px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.groups-list li.pending{opacity:1;filter:none;transform:none}.groups-list li{transition:none}}
main{place-items:normal}main>section{width:100%}

/* A restrained rhythm: a focal plane through the names, and chapter markers. */
.groups-list li:not(.pending){opacity:var(--focus,1);transform:scale(var(--depth,1));transition:filter 1.2s,opacity .35s,transform .6s}
.chapter-nav{position:fixed;right:24px;top:50%;transform:translateY(-50%);display:flex;flex-direction:column;gap:8px;z-index:5}
.chapter-nav a{width:18px;height:22px;display:grid;place-items:center}
.chapter-nav a::after{content:"";width:3px;height:3px;border-radius:50%;background:#e6e4dc50;transition:height .6s,background .6s}
.chapter-nav a[aria-current]::after{height:18px;background:#e6e4dcb0}
.chapter-nav a:focus-visible{outline:1px solid #e6e4dc;outline-offset:3px}
.film-progress{position:absolute;top:80%;left:calc(50% - 28px);width:56px;height:1px;background:#ffffff18;overflow:hidden}
.film-progress i{display:block;height:100%;background:#ffffff70;transform:scaleX(0);transform-origin:left}
::selection{background:#dcded3;color:#101110}
@media(max-width:520px){.chapter-nav{right:9px}.groups-list li{letter-spacing:-.75px}}
@media(prefers-reduced-motion:reduce){.chapter-nav a::after,.groups-list li:not(.pending){transition:none}}

.book-section{position:relative;isolation:isolate;padding:110px 0 70px;background:radial-gradient(ellipse at 50% 58%,#163c2d45,transparent 65%);text-align:center}
.book-intro{padding:0 28px 70px}.book-kicker{font-size:9px;letter-spacing:2px;color:#959e8d;margin-bottom:30px}
.book-intro h2{font-family:'Instrument Serif',Georgia,serif;font-size:clamp(38px,5.8vw,76px);line-height:1.05;letter-spacing:-1.4px;color:#e6e4dc;margin:0 0 28px;font-weight:400}.book-intro h2 em{color:#d6df9d;font-weight:400}
.book-description{font-size:12px;line-height:2;color:#a8b0a0}.book-author{font-size:9px;letter-spacing:3px;margin-top:26px;color:#7f8c7b}
.book-opening{margin:0 auto 110px;width:90%;max-width:1600px;overflow:hidden;border-radius:50% / 5%;mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent)}
.book-opening img{width:100%;height:auto;display:block}
.book-details{display:grid;grid-template-columns:1fr 1fr;gap:8vw 7vw;width:min(78%,1050px);margin:0 auto 140px;align-items:start}
.book-details figure{margin:0;overflow:hidden;transform:translateY(var(--book-drift,0px));transition:transform .5s ease-out;border-radius:3px;box-shadow:0 25px 60px #0003}
.book-details figure:nth-child(even){margin-top:80px}.book-details img{display:block;width:100%;height:auto}
.book-back{font-size:9px;letter-spacing:1.5px;color:#90998a;text-decoration:none;padding:16px;display:inline-block}.book-back:hover{color:#e6e4dc}
@media(max-width:520px){.book-section{padding-top:80px}.book-intro{padding-bottom:45px}.book-description{font-size:11px}.book-details{width:84%;gap:30px 20px;margin-bottom:85px}.book-details figure:nth-child(even){margin-top:35px}.book-opening{margin-bottom:55px;width:96%}}
@media(prefers-reduced-motion:reduce){.book-details figure{transform:none;transition:none}}

/* The book is a curved projection with a small link on a nearer plane. */
.book-projection{position:relative;perspective:700px;margin-bottom:110px}
.book-opening{position:relative;margin:0 auto;width:94%;max-width:1600px;border-radius:0;overflow:visible;mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent)}
.book-opening img{visibility:visible}.book-opening.lens-ready img{visibility:hidden}
.book-lens{position:absolute;inset:-8% 0;width:100%;height:116%;pointer-events:none}
.book-site{position:absolute;top:92%;left:50%;width:max-content;max-width:82%;color:#f0efdc;text-decoration:none;text-align:center;font-size:10px;letter-spacing:1px;line-height:2.2;transform:translate3d(calc(-50% + var(--copy-x,0px)),var(--copy-y,0px),60px) rotateX(-8deg);text-shadow:-.45px 0 #ff848440,.45px 0 #87d8ff40,0 3px 12px #000;transition:color .3s}
.book-site span{display:block;font-size:9px;letter-spacing:1.4px;color:#bac6a8}.book-site:hover{color:#e3f1a3}.book-site:focus-visible{outline:1px solid #d6df9d;outline-offset:8px}
.book-details{position:relative;display:block;width:min(84%,760px);height:clamp(330px,49vw,560px);margin:0 auto 60px;perspective:1000px}
.book-details figure,.book-details figure:nth-child(even){position:absolute;top:8%;left:50%;width:clamp(150px,28vw,315px);margin:0;border:1px solid #ffffff18;transform:translateX(calc(-50% + var(--spread))) rotate(var(--card-angle));box-shadow:0 25px 55px #0008;overflow:hidden;animation:book-float 7s ease-in-out infinite;animation-delay:var(--float-delay);transition:filter .4s;z-index:var(--card-order)}
.book-details figure:nth-child(1){--spread:-55%;--card-angle:-14deg;--float-delay:-1s;--card-order:1}
.book-details figure:nth-child(2){--spread:-18%;--card-angle:-5deg;--float-delay:-3s;--card-order:3}
.book-details figure:nth-child(3){--spread:18%;--card-angle:7deg;--float-delay:-5s;--card-order:4}
.book-details figure:nth-child(4){--spread:55%;--card-angle:17deg;--float-delay:-2s;--card-order:2}
.book-details figure:hover{z-index:5;filter:brightness(1.08)}
@keyframes book-float{0%,100%{transform:translateX(calc(-50% + var(--spread))) translateY(12px) rotate(var(--card-angle)) rotateY(-4deg)}50%{transform:translateX(calc(-50% + var(--spread))) translateY(-12px) rotate(calc(var(--card-angle) + 2deg)) rotateY(4deg)}}
@media(max-width:520px){.book-projection{margin-bottom:105px}.book-site{top:95%;font-size:9px}.book-site span{font-size:8px;letter-spacing:.6px}.book-details{height:300px;width:100%}}
@media(prefers-reduced-motion:reduce){.book-details figure{animation:none}.book-site{transform:translateX(-50%);transition:none}}

/* Opening words occupy their own foreground plane above the portfolio. */
.manifesto{min-height:62svh;display:grid;place-items:center;padding:110px 30px 80px;perspective:900px}
.manifesto-text{width:min(100%,690px);text-align:center;font-size:clamp(16px,1.8vw,22px);line-height:1.9;letter-spacing:.05px;color:#deded3;transform:rotateX(5deg) rotateZ(-.7deg);transform-style:preserve-3d}
.manifesto-text .manifesto-word{display:inline-block;color:inherit;transform-origin:50% 100%;text-shadow:-.35px 0 #fb969622,.35px 0 #9cdbff22}
.manifesto-text.is-animated .manifesto-word{animation:manifesto-arrive 1.6s cubic-bezier(.16,1,.3,1) both;animation-delay:calc(180ms + var(--word)*65ms)}
@keyframes manifesto-arrive{from{opacity:0;filter:blur(7px);transform:translate3d(22px,20px,-80px) rotateY(32deg) rotateX(-15deg)}to{opacity:1;filter:blur(0);transform:translate3d(0,var(--word-arc),0) rotate(var(--word-angle))}}
@media(max-width:520px){.manifesto{min-height:68svh;padding:80px 28px 50px}.manifesto-text{font-size:16px;line-height:1.85}}
@media(prefers-reduced-motion:reduce){.manifesto-text{transform:none}.manifesto-text.is-animated .manifesto-word{animation:none}}

.manifesto{align-content:center;gap:48px}
.manifesto .identity{position:relative;top:auto;left:auto;width:100%;padding:0;text-align:center}
.manifesto .identity h1{margin-bottom:14px}
@media(max-width:520px){.manifesto{gap:36px}}
/* Large editorial cards in the middle, illustrations at the outer edges. */
.book-details{--feature-width:min(84vw,945px);width:100%;max-width:1400px;height:calc(var(--feature-width) * 1.12 + 150px);margin:0 auto 40px;perspective:1400px}
.book-details figure:nth-child(3),.book-details figure:nth-child(4){width:var(--feature-width);left:50%;--spread:0%;box-shadow:0 35px 75px #0007}
.book-details figure:nth-child(3){top:70px;--spread:-2%;--card-angle:-5deg;--card-order:2}
.book-details figure:nth-child(4){top:calc(70px + var(--feature-width) * .48);--spread:2%;--card-angle:4deg;--card-order:3}
.book-details figure:nth-child(1){left:9%;top:10px;width:clamp(110px,19vw,255px);--spread:0%;--card-angle:-13deg;--card-order:4}
.book-details figure:nth-child(2){left:90%;top:calc(var(--feature-width) * .94);width:clamp(110px,19vw,255px);--spread:0%;--card-angle:12deg;--card-order:4}
.book-details figure:hover{z-index:6}
@media(max-width:520px){.book-details{--feature-width:84vw;height:calc(var(--feature-width) * 1.12 + 160px)}.book-details figure:nth-child(1),.book-details figure:nth-child(2){width:100px}.book-details figure:nth-child(2){top:calc(100px + var(--feature-width) * .85)}}

.manifesto-text{transform:rotateX(3deg) rotateZ(-.35deg)}
.manifesto-word{position:relative}
.manifesto-glyph{display:inline-block;font-weight:400;transform:translateY(var(--m-arc,0px)) rotate(var(--m-angle,0deg)) scaleY(var(--m-stretch,1));filter:blur(var(--m-blur,0px));text-shadow:calc(-1 * var(--m-fringe,0px)) 0 #fb969666,var(--m-fringe,0px) 0 #9cdbff66}
@media(prefers-reduced-motion:reduce){.manifesto-text{transform:none}}

/* The frosted link stays with the reader, bounded by the card composition. */
.book-projection{margin-bottom:24px}
.book-follow{position:relative;display:flow-root;padding:0 0 100px}
.book-follow .book-site{position:sticky;display:block;top:65svh;left:auto;width:max-content;max-width:85%;margin:0 auto -74px;padding:13px 24px;border:1px solid #ffffff35;border-radius:14px;background:rgba(32,49,40,.42);backdrop-filter:blur(18px) saturate(125%);-webkit-backdrop-filter:blur(18px) saturate(125%);box-shadow:inset 0 1px 0 #ffffff22,0 8px 28px #0002;transform:none;z-index:10;text-shadow:0 1px 5px #0006}
.book-follow .book-site:hover{background:rgba(48,66,52,.55)}
.book-follow .book-details{--feature-width:min(42vw,472.5px);height:calc(var(--feature-width) * 1.12 + 230px);margin-top:65px;margin-bottom:0}
.book-follow .book-details figure:nth-child(1){left:20%;width:clamp(100px,15vw,190px)}
.book-follow .book-details figure:nth-child(2){left:80%;width:clamp(100px,15vw,190px);top:calc(100px + var(--feature-width) * .85)}
@media(max-width:520px){.book-follow .book-site{padding:11px 18px;top:62svh}.book-follow .book-details{--feature-width:42vw}.book-follow .book-details figure:nth-child(1){left:14%;width:90px}.book-follow .book-details figure:nth-child(2){left:86%;width:90px}}

/* Brigite: a floating idea and the formats it becomes. */
.brigite-section{position:relative;padding:120px 0 60px;isolation:isolate;background:radial-gradient(ellipse at 60% 48%,#63233918,transparent 60%)}
.brigite-intro{text-align:center;padding:0 28px}.brigite-intro h2{margin:28px auto 22px;width:210px}.brigite-intro h2 img{display:block;width:100%;height:auto}.brigite-description{font-size:clamp(12px,1.2vw,14px);line-height:1.9;color:#c3c2b8}.brigite-flow{position:relative;width:min(100%,1100px);aspect-ratio:1000/540;margin:35px auto 5px;perspective:1100px}.brigite-wires{position:absolute;width:100%;height:100%;overflow:visible}.brigite-wires path{stroke:#ccbaa83a;stroke-width:1}.brigite-wires .attachment-wire{stroke-dasharray:3 6;opacity:.55}.brigite-signals path{stroke:#ee98a3;stroke-width:1.7;stroke-dasharray:28 430;animation:brigite-signal 9s linear infinite;filter:drop-shadow(0 0 4px #ff7788)}
.brigite-node{position:absolute;background:linear-gradient(145deg,#343330e8,#1b1c1bf0);border:1px solid #ffffff29;border-radius:10px;padding:10px;box-shadow:0 25px 65px #0006;animation:brigite-drift 7s ease-in-out infinite;--tilt:-5deg}.node-top,.node-bottom{display:flex;justify-content:space-between;align-items:center;font-size:7px;letter-spacing:1.1px;color:#c7c6bd;padding:2px 1px 9px}.node-top i{width:4px;height:4px;border-radius:50%;background:#e794a1}.node-bottom{padding:10px 0 0;font-size:6px;color:#93988d}.node-bottom b{font-size:13px;font-weight:400}.node-art{position:relative;overflow:hidden;min-height:110px;border-radius:3px;background:radial-gradient(ellipse at 85% 15%,#e5bea2 0,transparent 40%),linear-gradient(135deg,#78314f,#c56d70 55%,#e6b388);display:flex;align-items:flex-end;padding:16px;color:#fff4e5}.node-art:before{content:"";position:absolute;inset:-35% -20% 20% 30%;border:1px solid #ffe2c76b;border-radius:50%;transform:rotate(-35deg);box-shadow:0 0 0 18px #ffe6d010,0 0 0 38px #ffe6d010}.node-art span{position:relative;font-family:'Instrument Serif',Georgia,serif;font-size:clamp(12px,2.2vw,25px);line-height:1.05}.node-art em{font-weight:400}.brigite-source{left:13%;top:32%;width:24%}.output-one{left:59%;top:10%;width:17%;--tilt:5deg;animation-delay:-2s}.output-one .node-art{aspect-ratio:9/12}.output-two{left:62%;top:58%;width:25%;--tilt:-3deg;animation-delay:-4s}.output-two .node-art{min-height:75px;aspect-ratio:2.7}.brigite-output{animation:brigite-output 9s cubic-bezier(.22,1,.36,1) infinite}.output-two{animation-delay:.55s}.brigite-attachment{position:absolute;width:11%;min-height:63px;border-radius:7px;border:1px solid #ffffff20;background:#2c2c2a99;backdrop-filter:blur(12px);padding:10px;font-size:6px;letter-spacing:.7px;box-shadow:0 15px 25px #0003;animation:brigite-drift 8s ease-in-out infinite;--tilt:8deg;color:#babbb0}.brigite-attachment>span{display:block;font-size:13px;margin-bottom:7px;color:#e9b5bc}.brigite-attachment i{display:block;width:90%;height:2px;background:#c5c4b43b;margin-top:5px}.brigite-attachment i:last-child{width:60%}.attach-one{left:5%;top:15%;--tilt:-9deg;animation-delay:-1s}.attach-two{left:80%;top:2%;animation-delay:-3s}.attach-three{left:86%;top:80%;--tilt:-5deg;animation-delay:-5s}.attachment-swatch{height:25px;margin-top:7px;background:linear-gradient(135deg,#73304b,#d3987e);border-radius:2px}.brigite-footnote{text-align:center;font-size:10px;letter-spacing:.8px;margin:25px 0 85px;color:#94968e}.brigite-section .book-back{display:block;text-align:center}.brigite-section:not(.is-visible) .brigite-flow *{animation-play-state:paused}
@keyframes brigite-drift{0%,100%{transform:translateY(5px) rotate(var(--tilt)) rotateY(-5deg)}50%{transform:translateY(-7px) rotate(calc(var(--tilt) + 2deg)) rotateY(4deg)}}
@keyframes brigite-output{0%,12%{opacity:0;filter:blur(7px);transform:translate(-35px,8px) scale(.88) rotate(-5deg)}30%,82%{opacity:1;filter:blur(0);transform:translate(0,-4px) scale(1) rotate(var(--tilt))}100%{opacity:0;filter:blur(5px);transform:translate(8px,-8px) scale(.98) rotate(var(--tilt))}}
@keyframes brigite-signal{0%{stroke-dashoffset:440;opacity:0}12%{opacity:1}40%,100%{stroke-dashoffset:-440;opacity:0}}
@media(max-width:600px){.brigite-section{padding-top:85px}.brigite-intro h2{width:180px}.brigite-flow{margin-top:55px;aspect-ratio:1000/650}.node-art{min-height:65px;padding:8px}.brigite-node{padding:6px;border-radius:6px}.node-top,.node-bottom{font-size:5px;letter-spacing:.3px;padding-bottom:5px}.node-bottom{padding-top:6px}.brigite-source{width:29%;left:8%}.output-one{width:23%;left:55%}.output-two{width:30%;left:60%}.output-two .node-art{min-height:48px}.brigite-attachment{padding:5px;width:13%;min-height:45px;font-size:4px}.brigite-attachment>span{font-size:10px;margin-bottom:3px}.attach-two{left:83%}.brigite-footnote{margin:25px 0 65px}.desktop-break{display:none}}
@media(prefers-reduced-motion:reduce){.brigite-flow *{animation:none!important}.brigite-signals{display:none}.brigite-node,.brigite-attachment{transform:rotate(var(--tilt))}}

/* A personal introduction becomes a quiet, persistent contact signature. */
.manifesto .hello-title{font-size:clamp(23px,3vw,32px);letter-spacing:-.3px;margin-bottom:10px}
.manifesto .identity{transition:opacity .5s,filter .5s}.has-contact-signature .manifesto .identity{opacity:0;filter:blur(5px)}
.contact-signature{position:fixed;bottom:18px;left:50%;width:max-content;max-width:calc(100% - 100px);padding:12px 24px 13px;text-align:center;z-index:30;border:1px solid #ffffff12;border-radius:14px;background:#141714b8;backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);box-shadow:0 7px 30px #0002;opacity:0;visibility:hidden;pointer-events:none;filter:blur(6px);transform:translate(-50%,12px);transition:opacity .6s,transform .6s,filter .6s,visibility .6s}
.has-contact-signature .contact-signature{opacity:1;visibility:visible;pointer-events:auto;filter:blur(0);transform:translate(-50%,0)}
.contact-name{font-size:11px;color:#e6e4dc;line-height:1.5}.contact-name em{font-family:'Instrument Serif',Georgia,serif;font-size:15px}.contact-name span{color:#b9bcb2}.contact-links{display:flex;justify-content:center;gap:22px;margin-top:7px}.contact-links a{font-size:9px;line-height:1.6;letter-spacing:.2px;color:#a8ada2;text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:3px;text-decoration-color:#a8ada255;transition:color .2s}.contact-links a:hover{color:#f1eee3}.contact-links a:focus-visible{outline:1px solid #d6df9d;outline-offset:4px}
.brigite-section{padding-bottom:140px}
@media(max-width:600px){.contact-signature{bottom:12px;max-width:calc(100% - 32px);width:calc(100% - 32px);padding:10px 12px}.contact-name{font-size:10px}.contact-motto{display:block;font-size:9px;margin-top:3px}.contact-links{gap:14px}.contact-links a{font-size:8px}}
@media(prefers-reduced-motion:reduce){.contact-signature,.manifesto .identity{transition:none}}

/* The greeting and the dock share one moving surface. */
.manifesto .identity{visibility:hidden;transition:none}
.contact-signature,.has-contact-signature .contact-signature{bottom:auto;top:440px;transform:translate(-50%,-50%);opacity:1;visibility:visible;filter:none;transition:none;--dock:0;width:max-content;max-width:calc(100% - 80px);padding:15px 24px;background:rgba(20,23,20,calc(var(--dock) * .9));border-color:rgba(255,255,255,calc(var(--dock) * .16));box-shadow:0 7px 30px rgba(0,0,0,calc(var(--dock) * .18));backdrop-filter:blur(calc(var(--dock) * 18px));-webkit-backdrop-filter:blur(calc(var(--dock) * 18px))}
.contact-hello{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;white-space:nowrap}.contact-hello>span{font-family:'Instrument Serif',Georgia,serif;font-size:clamp(23px,3vw,32px);line-height:1.3;letter-spacing:-.3px;color:#e6e4dc}.contact-hello p{margin-top:10px;color:#dddcd4;font-size:11px}
.contact-content{opacity:0}.contact-name,.contact-name em,.contact-name span,.contact-links a{font-family:'DM Sans',Arial,sans-serif;font-size:13px;font-weight:400;line-height:1.65;letter-spacing:.05px;color:#e6e4dc}.contact-links{margin-top:9px;gap:24px}.contact-links a{text-decoration-color:#dddcd488;text-underline-offset:4px}.contact-name em{font-style:italic}
@media(max-width:600px){.contact-signature{width:calc(100% - 28px);max-width:calc(100% - 28px);padding:12px 10px}.contact-name,.contact-name em,.contact-name span,.contact-links a{font-size:12px}.contact-links{gap:8px 16px;flex-wrap:wrap}.contact-motto{margin-top:2px}.contact-hello>span{font-size:25px}}

/* Keep short connecting words with the phrase they introduce. */
.manifesto-text{text-wrap:balance}
.manifesto-phrase{display:inline-block;white-space:nowrap}

.cinema-zoom{position:fixed;inset:0;width:100vw;height:100svh;max-width:none;max-height:none;margin:0;border:0;padding:50px 4vw;background:transparent;color:#ecebe4;overflow:hidden;text-align:center}
.cinema-zoom[open]{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:24px}
.cinema-zoom::backdrop{background:#090c0bea;backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px)}
.cinema-zoom img{display:block;width:auto;height:auto;max-width:92vw;max-height:78svh;object-fit:contain;box-shadow:0 35px 100px #0008;border-radius:3px}
.cinema-zoom p{font-size:12px;letter-spacing:1px;color:#d5d6cd;max-width:90vw}
.zoom-close{position:absolute;right:26px;top:20px;width:42px;height:42px;border:1px solid #ffffff40;border-radius:50%;background:#ffffff0a;color:#fff;font:26px Arial;cursor:pointer}.zoom-close:focus-visible{outline:2px solid #e5d4ad;outline-offset:4px}
body.image-is-open{overflow:hidden}.hero:focus-visible{outline:1px solid #ffffff55;outline-offset:-8px}
@media(prefers-reduced-motion:reduce){.cinema-zoom::backdrop{backdrop-filter:none}}

.hero .cinema-optics{opacity:1}
.hero .cinema-shade{background:none}
