/* Mirror Factory homepage v4 (9 Nov 2026): the Harvey Paper direction, coded.
   Paper ground, MF Display Thin for the hero and section headings, MF Display Light for titles, Manrope for text,
   hairlines instead of boxes, four brand dots on every label, real photographs and point-cloud film in calm frames.
   Dots and photographs always sit side by side, never layered. Night is available through html[data-theme=dark]. */
@font-face{font-family:"MF Display Thin";src:url(../fonts/MirrorFactory-Display-350-Latin.woff2) format("woff2");font-display:swap}
@font-face{font-family:"MF Display Light";src:url(../fonts/MirrorFactory-Display-375-Latin.woff2) format("woff2");font-display:swap}
@font-face{font-family:"MF Display";src:url(../fonts/MirrorFactory-Display-Latin.woff2) format("woff2");font-display:swap}
@font-face{font-family:"MF Manrope";src:url(../fonts/Manrope-Variable-Latin.woff2) format("woff2");font-weight:200 800;font-display:swap}
@font-face{font-family:"MF Mono";src:url(../fonts/DMMono-Medium-Latin.woff2) format("woff2");font-weight:500;font-display:swap}
*{box-sizing:border-box}
html,body{margin:0;background:var(--v4-ground,#F7F5EF)}
.v4{--paper:#F7F5EF;--paper2:#EFECE3;--card:#FBFAF6;--ink:#121510;--fg2:rgba(18,21,16,.66);--fg3:rgba(18,21,16,.46);--line:rgba(18,21,16,.1);--line2:rgba(18,21,16,.2);
  --lm:#CEF25A;--o:#90ECE2;--li:#A6B5DD;--pc:#F5B688;--lmD:#5E7A12;--oD:#2A8C80;--liD:#6E7DB8;--pcD:#B8652C;--night:#0B0D0A;--ease:cubic-bezier(.16,1,.3,1);
  --h1:76px;--h2:44px;--h3:21px;--body:15.5px;--pad:64px;--gap:150px;
  position:relative;width:100%;max-width:1440px;margin:0 auto;background:var(--paper);color:var(--ink);font:400 var(--body)/1.6 "MF Manrope",Manrope,system-ui,sans-serif;-webkit-font-smoothing:antialiased;overflow:hidden}
.v4.alt{background:var(--paper2)}
.v4.night,html[data-theme=dark] .v4{--paper:#0E100D;--paper2:#141712;--card:#181B16;--ink:#F2EEE5;--fg2:rgba(242,238,229,.7);--fg3:rgba(242,238,229,.46);--line:rgba(242,238,229,.1);--line2:rgba(242,238,229,.22);--lmD:#CEF25A;--oD:#90ECE2;--liD:#A6B5DD;--pcD:#F5B688}
html[data-theme=dark]{--v4-ground:#0E100D}
html[data-theme=light] .v4.night{--paper:#F7F5EF;--paper2:#EFECE3;--card:#FBFAF6;--ink:#121510;--fg2:rgba(18,21,16,.66);--fg3:rgba(18,21,16,.46);--line:rgba(18,21,16,.1);--line2:rgba(18,21,16,.2);--lmD:#5E7A12;--oD:#2A8C80;--liD:#6E7DB8;--pcD:#B8652C}
.v4 .wrap{padding:var(--gap) var(--pad)}
.v4 a{color:inherit}
/* type */
.v4 .h1{margin:0;font:400 var(--h1)/1 "MF Display Thin","MF Display",sans-serif;letter-spacing:-.032em;text-wrap:balance}
.v4 .h2{margin:0;font:400 var(--h2)/1.06 "MF Display Thin","MF Display",sans-serif;letter-spacing:-.025em;text-wrap:balance;max-width:820px}
.v4 .h3{margin:0;font:400 var(--h3)/1.22 "MF Display Light","MF Display",sans-serif;letter-spacing:-.01em}
.v4 .h4{margin:0;font:500 16px/1.35 "MF Manrope",sans-serif;letter-spacing:-.01em}
.v4 p{margin:0;color:var(--fg2)}
.v4 .lede{font-size:17px;line-height:1.6;max-width:470px}
.v4 .small{font-size:13.5px;line-height:1.55;color:var(--fg3)}
.v4 .micro{font:500 12px/1.3 "MF Manrope",sans-serif;color:var(--fg3)}
.v4 .num{font:400 54px/1 "MF Display Thin",sans-serif;letter-spacing:-.04em;color:var(--ink)}
/* the label: four brand dots, then title-case words */
.v4 .lab{display:inline-flex;align-items:center;gap:10px;font:500 13px/1 "MF Manrope",sans-serif;color:var(--fg2)}
.v4 .d4{display:inline-flex;gap:3px}.v4 .d4 i{width:4px;height:4px;border-radius:50%;background:var(--lm)}
.v4 .d4 i:nth-child(2){background:var(--o)}.v4 .d4 i:nth-child(3){background:var(--li)}.v4 .d4 i:nth-child(4){background:var(--pc)}
.v4.in .d4 i,.v4 .in .d4 i{animation:d4 1.1s var(--ease) both}.v4.in .d4 i:nth-child(2){animation-delay:.08s}.v4.in .d4 i:nth-child(3){animation-delay:.16s}.v4.in .d4 i:nth-child(4){animation-delay:.24s}
@keyframes d4{0%{transform:scale(0);opacity:0}60%{transform:scale(1.5);opacity:1}100%{transform:none}}
.v4 .tag{display:inline-flex;align-items:center;gap:7px;height:24px;padding:0 10px;border-radius:999px;box-shadow:inset 0 0 0 1px var(--line2);font:500 11.5px/1 "MF Manrope",sans-serif;color:var(--fg2);white-space:nowrap}
.v4 .tag i{width:5px;height:5px;border-radius:50%;background:var(--pc)}
.v4 .rule{height:1px;background:var(--line);border:0;margin:0}
.v4 .vrule{width:1px;background:var(--line);align-self:stretch}
/* buttons: one primary per section, ink with a Green Pulse dot */
.v4 .btn{display:inline-flex;align-items:center;gap:9px;height:40px;padding:0 16px;border-radius:7px;font:500 14px/1 "MF Manrope",sans-serif;text-decoration:none;cursor:pointer;border:0;white-space:nowrap;transition:transform .25s var(--ease),box-shadow .3s,background .2s,color .2s}
.v4 .btn.p{background:var(--ink);color:var(--paper)}.v4 .btn.p i{width:6px;height:6px;border-radius:50%;background:var(--lm);box-shadow:0 0 0 3px rgba(206,242,90,.22)}
.v4 .btn.p:hover{transform:translateY(-1px);box-shadow:0 14px 30px -16px rgba(0,0,0,.6)}
.v4 .btn.gh{box-shadow:inset 0 0 0 1px var(--line2);color:var(--ink);background:transparent}.v4 .btn.gh:hover{box-shadow:inset 0 0 0 1px var(--fg3)}
.v4 .btn em,.v4 .lk em{font-style:normal;display:inline-block;transition:transform .35s var(--ease)}.v4 .btn:hover em,.v4 .lk:hover em{transform:translateX(3px)}
.v4 .lk{display:inline-flex;align-items:center;gap:6px;font:500 14px/1 "MF Manrope",sans-serif;color:var(--ink);text-decoration:none}
/* frames: photographs and film sit in calm rounded frames */
.v4 .fr{position:relative;border-radius:14px;overflow:hidden;background:var(--night);isolation:isolate}
.v4 .fr>img,.v4 .fr>video,.v4 .fr>canvas{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}
.v4 .fr.ph>img{transition:transform 1.4s var(--ease)}.v4 .hov:hover .fr.ph>img,.v4 .fr.ph:hover>img{transform:scale(1.035)}
.v4 .fr.paper{background:var(--card);box-shadow:inset 0 0 0 1px var(--line)}
.v4 .fr .cap{position:absolute;left:16px;bottom:14px;right:16px;z-index:2;display:flex;justify-content:space-between;align-items:flex-end;gap:12px;color:#F2EEE5;font:500 12px/1.3 "MF Manrope",sans-serif}
.v4 .fr .cap.dk{color:var(--fg2)}
.v4 .fr.shade::after{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(180deg,rgba(11,13,10,0) 45%,rgba(11,13,10,.78));pointer-events:none}
/* the brushed backdrop: a painterly grey-green panel made from noise, no photograph */
.v4 .brush{position:relative;border-radius:18px;overflow:hidden;background:#8E9A8C;padding:34px}
.v4 .brush::before{content:"";position:absolute;inset:-20%;background:
  radial-gradient(60% 80% at 18% 30%,rgba(236,234,224,.55),transparent 60%),radial-gradient(50% 70% at 82% 70%,rgba(60,72,62,.55),transparent 65%),
  radial-gradient(40% 60% at 60% 10%,rgba(214,222,208,.5),transparent 60%),linear-gradient(115deg,#A7B0A2,#7D8A7E 45%,#9AA597);filter:saturate(.85);transform:rotate(-4deg)}
.v4 .brush::after{content:"";position:absolute;inset:0;opacity:.55;mix-blend-mode:soft-light;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='600' height='600'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.004 .09' numOctaves='3' seed='4'/%3E%3CfeColorMatrix values='0 0 0 0 .5 0 0 0 0 .5 0 0 0 0 .5 0 0 0 1.4 -.2'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");background-size:900px 600px;transform:rotate(-8deg) scale(1.3)}
.v4 .brush>*{position:relative;z-index:1}
.v4 .grain{position:absolute;inset:0;pointer-events:none;opacity:.35;mix-blend-mode:multiply;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='300' height='300'%3E%3Cfilter id='g'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 .5 0 0 0 0 .5 0 0 0 0 .5 0 0 0 .18 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23g)'/%3E%3C/svg%3E")}
/* hover stream: a quiet line of brand dots runs along the bottom of a card on hover */
.v4 [data-stream]{position:relative}
.v4 canvas.stream{position:absolute;left:0;right:0;bottom:-1px;height:14px;width:100%;pointer-events:none;opacity:0;transition:opacity .4s}
.v4 [data-stream]:hover canvas.stream,.v4 [data-stream].on canvas.stream{opacity:1}
/* reveal: fade and rise in reading order; headings rise word by word */
.v4 [data-rv]{opacity:0;transform:translateY(16px);transition:opacity 1s var(--ease),transform 1.1s var(--ease)}
.v4.in [data-rv],.v4 .in[data-rv]{opacity:1;transform:none}
.v4 .w{display:inline-block;overflow:hidden;vertical-align:top;padding-bottom:.08em;margin-bottom:-.08em}
.v4 .w>span{display:inline-block;transform:translateY(105%);transition:transform 1.1s var(--ease)}
.v4.in .w>span{transform:none}
@media (prefers-reduced-motion:reduce){.v4 [data-rv],.v4 .w>span{opacity:1!important;transform:none!important;transition:none!important}.v4 .d4 i{animation:none!important}}
@media (max-width:760px){.v4{--h1:44px;--h2:32px;--h3:19px;--pad:22px;--gap:96px}.v4 .num{font-size:48px}}
/* automated captures (board thumbnails, exports) show the settled layout without the reveal */
.v4-static .v4 [data-rv],.v4-static .v4 .w>span{opacity:1!important;transform:none!important;transition:none!important}

/* a section that stays on Night in every theme (the dot heroes, 10 Nov 2026) */
html[data-theme] .v4.night.keep-dark{--paper:#0E100D;--paper2:#141712;--card:#181B16;--ink:#F2EEE5;--fg2:rgba(242,238,229,.7);--fg3:rgba(242,238,229,.46);--line:rgba(242,238,229,.1);--line2:rgba(242,238,229,.22);--lmD:#CEF25A;--oD:#90ECE2;--liD:#A6B5DD;--pcD:#F5B688;color-scheme:dark}