/* ===== Samuel Falade — portfolio site ===== */
:root{
  --ink:#1a1a1e;
  --soft:#54545e;
  --faint:#8a8a93;
  --line:#e4e1d8;
  --paper:#fbfaf7;
  --panel:#f3f1ea;
  --card:#ffffff;
  --accent:#ff694a;
  --accent-deep:#cf4b30;
  --indigo:#262a52;
  --green:#1f7a5a;
  --radius:14px;
  --maxw:1120px;
  --shadow:0 10px 30px rgba(26,26,30,.08);
}
*{box-sizing:border-box;margin:0;padding:0;}
html{scroll-behavior:smooth;}
body{
  font-family:"Archivo",system-ui,-apple-system,"Segoe UI",sans-serif;
  color:var(--ink);background:var(--paper);line-height:1.62;
  -webkit-font-smoothing:antialiased;
}
h1,h2,h3,h4{font-family:"Fraunces",Georgia,serif;font-weight:500;line-height:1.1;letter-spacing:-0.01em;}
img{max-width:100%;display:block;}
a{color:inherit;text-decoration:none;}
.wrap{max-width:var(--maxw);margin:0 auto;padding:0 28px;}

/* ---- nav ---- */
nav.site{position:sticky;top:0;z-index:50;background:rgba(251,250,247,.85);backdrop-filter:blur(12px);border-bottom:1px solid var(--line);}
nav.site .wrap{display:flex;align-items:center;justify-content:space-between;height:66px;}
.brand{font-family:"Fraunces",serif;font-size:1.18rem;font-weight:600;letter-spacing:-.02em;}
.brand span{color:var(--accent);}
.navlinks{display:flex;gap:28px;align-items:center;font-size:.93rem;}
.navlinks a{color:var(--soft);transition:color .15s;position:relative;}
.navlinks a:hover,.navlinks a.active{color:var(--ink);}
.navlinks a.active::after{content:"";position:absolute;left:0;right:0;bottom:-22px;height:2px;background:var(--accent);}
.navlinks a.btn{color:#fff;background:var(--ink);padding:9px 18px;border-radius:8px;}
.navlinks a.btn:hover{background:var(--accent-deep);}
.menu-toggle{display:none;background:none;border:none;font-size:1.5rem;cursor:pointer;color:var(--ink);}
@media(max-width:760px){
  .navlinks{display:none;position:absolute;top:66px;left:0;right:0;flex-direction:column;background:var(--paper);border-bottom:1px solid var(--line);padding:18px 28px;gap:18px;}
  .navlinks.open{display:flex;}
  .navlinks a.active::after{display:none;}
  .menu-toggle{display:block;}
}

/* ---- hero ---- */
.hero{padding:96px 0 72px;border-bottom:1px solid var(--line);}
.eyebrow{font-size:.8rem;letter-spacing:.16em;text-transform:uppercase;color:var(--accent-deep);font-weight:600;margin-bottom:22px;}
.hero h1{font-size:clamp(2.6rem,6.2vw,4.6rem);max-width:16ch;}
.hero h1 em{font-style:italic;color:var(--accent);}
.hero .lede{font-size:1.24rem;color:var(--soft);max-width:60ch;margin-top:28px;}
.cta-row{display:flex;gap:14px;flex-wrap:wrap;margin-top:36px;}
.btn-lg{display:inline-block;padding:14px 26px;border-radius:10px;font-size:.97rem;font-weight:500;transition:transform .12s,box-shadow .2s,border-color .2s;}
.btn-lg.primary{background:var(--ink);color:var(--paper);}
.btn-lg.primary:hover{transform:translateY(-2px);box-shadow:var(--shadow);}
.btn-lg.ghost{border:1px solid var(--line);color:var(--ink);}
.btn-lg.ghost:hover{border-color:var(--ink);}

/* ---- sections ---- */
section{padding:78px 0;border-bottom:1px solid var(--line);}
.sec-label{font-size:.8rem;letter-spacing:.16em;text-transform:uppercase;color:var(--faint);font-weight:600;margin-bottom:14px;}
section h2{font-size:clamp(1.9rem,3.8vw,2.7rem);max-width:20ch;}
.sec-intro{font-size:1.13rem;color:var(--soft);max-width:64ch;margin-top:18px;}

/* ---- pillars ---- */
.pillars{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;margin-top:46px;}
@media(max-width:760px){.pillars{grid-template-columns:1fr;}}
.pillar{background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);padding:28px;}
.pillar .n{font-family:"Fraunces",serif;font-size:1.7rem;color:var(--accent);}
.pillar h3{font-size:1.2rem;margin:12px 0 8px;}
.pillar p{font-size:.98rem;color:var(--soft);}

/* ---- work grid ---- */
.grid{display:grid;grid-template-columns:repeat(2,1fr);gap:26px;margin-top:46px;}
@media(max-width:760px){.grid{grid-template-columns:1fr;}}
.proj-card{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;transition:transform .15s,box-shadow .2s;display:flex;flex-direction:column;}
.proj-card:hover{transform:translateY(-4px);box-shadow:var(--shadow);}
.proj-card .ph{aspect-ratio:16/10;display:flex;align-items:center;justify-content:center;color:#fff;font-family:"Fraunces",serif;font-size:1.5rem;text-align:center;padding:18px;position:relative;}
.proj-card .ph small{position:absolute;bottom:10px;left:0;right:0;font-family:"Archivo",sans-serif;font-size:.68rem;letter-spacing:.05em;opacity:.7;text-transform:uppercase;font-weight:500;}
.proj-card .body{padding:24px;display:flex;flex-direction:column;flex:1;}
.proj-card .kicker{font-size:.78rem;letter-spacing:.08em;text-transform:uppercase;color:var(--accent-deep);font-weight:600;margin-bottom:7px;}
.proj-card h3{font-size:1.32rem;margin-bottom:9px;}
.proj-card p{font-size:.97rem;color:var(--soft);margin-bottom:14px;flex:1;}
.chips{display:flex;flex-wrap:wrap;gap:7px;}
.chip{font-size:.76rem;padding:4px 11px;border-radius:6px;background:var(--panel);border:1px solid var(--line);color:var(--soft);}

/* gradient placeholders */
.g-coral{background:linear-gradient(135deg,#ff694a,#cf4b30);}
.g-indigo{background:linear-gradient(135deg,#262a52,#4b4f8a);}
.g-green{background:linear-gradient(135deg,#1f7a5a,#2fae7e);}
.g-violet{background:linear-gradient(135deg,#7a5cc7,#5a3fa0);}
.g-amber{background:linear-gradient(135deg,#e0913a,#c96a1e);}
.g-slate{background:linear-gradient(135deg,#3a4a5a,#5c7186);}
.g-rose{background:linear-gradient(135deg,#c0476a,#933455);}
.g-teal{background:linear-gradient(135deg,#1f6e7a,#2f9aae);}

/* ---- about ---- */
.about-grid{display:grid;grid-template-columns:1.5fr 1fr;gap:52px;align-items:start;margin-top:40px;}
@media(max-width:760px){.about-grid{grid-template-columns:1fr;gap:30px;}}
.about-grid p{font-size:1.1rem;margin-bottom:20px;}
.side-card{background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);padding:26px;margin-bottom:22px;}
.side-card h4{font-size:1.05rem;margin-bottom:14px;}
.side-card .row{padding:11px 0;border-bottom:1px solid var(--line);font-size:.93rem;}
.side-card .row:last-child{border-bottom:none;padding-bottom:0;}
.side-card .row b{display:block;font-weight:600;}
.side-card .row span{color:var(--faint);font-size:.85rem;}
.taglist{display:flex;flex-wrap:wrap;gap:8px;}
.portrait{width:100%;border-radius:var(--radius);margin-bottom:22px;display:block;box-shadow:var(--shadow);}

/* ---- contact / cta band ---- */
.band{background:var(--indigo);color:#fff;border-radius:20px;padding:54px 48px;margin:60px auto;max-width:var(--maxw);}
.band h2{color:#fff;max-width:18ch;}
.band p{color:#c9cbe4;font-size:1.12rem;margin-top:16px;max-width:54ch;}
.band .links{display:flex;gap:26px;flex-wrap:wrap;margin-top:28px;font-size:1.05rem;}
.band .links a{color:#fff;font-weight:500;border-bottom:1px solid var(--accent);padding-bottom:2px;}
.band .links a:hover{border-color:#fff;}
@media(max-width:600px){.band{padding:38px 26px;border-radius:14px;}}

/* ---- gallery ---- */
.masonry{columns:3;column-gap:20px;margin-top:40px;}
@media(max-width:900px){.masonry{columns:2;}}
@media(max-width:560px){.masonry{columns:1;}}
.tile{break-inside:avoid;margin-bottom:20px;border-radius:12px;overflow:hidden;border:1px solid var(--line);}
.tile .ph{display:flex;align-items:flex-end;color:#fff;padding:16px;font-weight:500;font-size:.95rem;}
.tile .ph.tall{min-height:300px;}
.tile .ph.mid{min-height:220px;}
.tile .ph.short{min-height:160px;}
.tile .cap{padding:13px 16px;background:var(--card);font-size:.9rem;}
.tile .cap b{display:block;font-family:"Fraunces",serif;font-size:1.05rem;font-weight:500;}
.tile .cap span{color:var(--faint);font-size:.82rem;}

/* ---- footer ---- */
footer.site{padding:40px 0;text-align:center;color:var(--faint);font-size:.88rem;}
footer.site a{color:var(--soft);}
footer.site .fl{display:flex;gap:20px;justify-content:center;margin-bottom:12px;}

/* placeholder note banner (remove after adding images) */
.imgnote{background:#fff4d6;border:1px dashed #d8b54a;color:#7a5a06;border-radius:10px;padding:12px 18px;font-size:.9rem;margin-top:30px;}
.imgnote code{background:#fbeec0;padding:1px 6px;border-radius:4px;}

/* ============================================================
   v2 — cinematic redesign (shared, benefits every page)
   ============================================================ */
:root{ --noir:#0c0c12; --noir-2:#15151f; --mint:#46d39a; }

/* ---- glass nav: shrink on scroll + over-hero (dark) mode ---- */
nav.site{transition:background .3s,box-shadow .3s,border-color .3s;}
nav.site .wrap{transition:height .28s cubic-bezier(.2,.7,.2,1);}
nav.site.scrolled{box-shadow:0 8px 28px rgba(12,12,18,.10);background:rgba(251,250,247,.92);}
nav.site.scrolled .wrap{height:54px;}
nav.site.over-hero{position:fixed;top:0;left:0;right:0;background:transparent;border-bottom-color:transparent;}
nav.site.over-hero .brand{color:#fff;}
nav.site.over-hero .navlinks a{color:rgba(255,255,255,.78);}
nav.site.over-hero .navlinks a:hover,nav.site.over-hero .navlinks a.active{color:#fff;}
nav.site.over-hero .navlinks a.active::after{background:var(--accent);}
nav.site.over-hero .navlinks a.btn{background:rgba(255,255,255,.14);color:#fff;backdrop-filter:blur(6px);}
nav.site.over-hero .navlinks a.btn:hover{background:#fff;color:var(--ink);}
nav.site.over-hero .menu-toggle{color:#fff;}
nav.site.over-hero.scrolled{background:rgba(251,250,247,.92);border-bottom-color:var(--line);}
nav.site.over-hero.scrolled .brand{color:var(--ink);}
nav.site.over-hero.scrolled .navlinks a{color:var(--soft);}
nav.site.over-hero.scrolled .navlinks a:hover,nav.site.over-hero.scrolled .navlinks a.active{color:var(--ink);}
nav.site.over-hero.scrolled .navlinks a.btn{background:var(--ink);color:#fff;}
nav.site.over-hero.scrolled .menu-toggle{color:var(--ink);}

/* ---- cinematic hero ---- */
.hero-cine{position:relative;overflow:hidden;background:var(--noir);color:#fff;padding:172px 0 112px;isolation:isolate;}
.hero-cine .wrap{position:relative;z-index:3;}
.hero-cine .glow{position:absolute;inset:-25% -12%;z-index:1;pointer-events:none;}
.hero-cine .glow::before,.hero-cine .glow::after{content:"";position:absolute;border-radius:50%;filter:blur(86px);}
.hero-cine .glow::before{width:62vw;height:62vw;left:-8%;top:-22%;background:radial-gradient(circle,rgba(255,105,74,.72),transparent 60%);opacity:.6;animation:glowA 15s ease-in-out infinite alternate;}
.hero-cine .glow::after{width:56vw;height:56vw;right:-10%;bottom:-26%;background:radial-gradient(circle,rgba(60,68,150,.9),transparent 62%);opacity:.65;animation:glowB 19s ease-in-out infinite alternate;}
@keyframes glowA{from{transform:translate(0,0) scale(1);}to{transform:translate(9%,7%) scale(1.2);}}
@keyframes glowB{from{transform:translate(0,0) scale(1);}to{transform:translate(-7%,-9%) scale(1.24);}}
.hero-cine .grain{position:absolute;inset:0;z-index:2;pointer-events:none;opacity:.085;mix-blend-mode:overlay;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
  background-size:180px;animation:grain 7s steps(7) infinite;}
@keyframes grain{0%{transform:translate(0,0);}20%{transform:translate(-4%,3%);}40%{transform:translate(3%,-4%);}60%{transform:translate(-3%,-2%);}80%{transform:translate(4%,3%);}100%{transform:translate(0,0);}}
.hero-cine .eyebrow{color:var(--accent);}
.avail{display:inline-flex;align-items:center;gap:9px;font-size:.82rem;letter-spacing:.03em;color:rgba(255,255,255,.86);background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.15);padding:8px 16px;border-radius:8px;backdrop-filter:blur(6px);}
.avail .dot{width:9px;height:9px;border-radius:50%;background:var(--mint);animation:pulse 2.2s infinite;}
@keyframes pulse{0%{box-shadow:0 0 0 0 rgba(70,211,154,.55);}70%{box-shadow:0 0 0 11px rgba(70,211,154,0);}100%{box-shadow:0 0 0 0 rgba(70,211,154,0);}}
.hero-cine h1{font-size:clamp(3rem,9vw,7rem);line-height:.97;margin-top:24px;letter-spacing:-.025em;max-width:15ch;}
.hero-cine h1 .it{font-style:italic;color:var(--accent);}
.hero-cine h1 .out{color:transparent;-webkit-text-stroke:1.6px rgba(255,255,255,.82);}
.hero-cine .lede{color:rgba(255,255,255,.72);font-size:1.24rem;max-width:56ch;margin-top:30px;}
.hero-cine .cta-row{margin-top:38px;}
.hero-cine .btn-lg.primary{background:var(--accent);color:#16161c;}
.hero-cine .btn-lg.primary:hover{background:#fff;color:var(--ink);}
.hero-cine .btn-lg.ghost{border-color:rgba(255,255,255,.32);color:#fff;}
.hero-cine .btn-lg.ghost:hover{border-color:#fff;background:rgba(255,255,255,.08);}
@media(max-width:760px){.hero-cine{padding:132px 0 78px;}}

/* ---- stats band (dark, count-up) ---- */
.stats-band{background:var(--noir);color:#fff;border:none;padding:24px 0 78px;}
.stats-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:26px;}
@media(max-width:760px){.stats-grid{grid-template-columns:repeat(2,1fr);gap:22px 18px;}}
.stat{border-top:2px solid rgba(255,255,255,.16);padding-top:18px;}
.stat .stat-num{font-family:"Fraunces",serif;font-weight:500;font-size:clamp(2.4rem,4.6vw,3.7rem);line-height:1;color:#fff;}
.stat .stat-label{color:rgba(255,255,255,.58);font-size:.92rem;margin-top:11px;max-width:26ch;}

/* ---- infinite marquee ---- */
.marquee{background:var(--accent);color:#16161c;overflow:hidden;white-space:nowrap;border:none;padding:0;}
.marquee .track{display:inline-flex;align-items:center;animation:scrollX 30s linear infinite;will-change:transform;}
.marquee:hover .track{animation-play-state:paused;}
.marquee .item{font-family:"Fraunces",serif;font-style:italic;font-size:1.5rem;padding:18px 0;display:inline-flex;align-items:center;}
.marquee .item::after{content:"\002A";font-style:normal;margin:0 38px;opacity:.55;font-size:1rem;transform:translateY(-2px);}
@keyframes scrollX{from{transform:translateX(0);}to{transform:translateX(-50%);}}

/* ---- scroll reveal ----
   The hidden state is armed by site.js (html.rv), so no-JS visitors, crawlers,
   and print see everything. Anything on screen at load gets .in before arming
   and never animates. */
.rv .reveal{transition:opacity .7s cubic-bezier(.22,1,.36,1),transform .7s cubic-bezier(.22,1,.36,1);}
.rv .reveal:not(.in){opacity:0;transform:translateY(24px);}
.reveal.in{opacity:1;transform:none;}
@media print{.reveal{opacity:1!important;transform:none!important;}}

/* ---- richer hovers ---- */
.proj-card{transition:transform .2s,box-shadow .28s,border-color .2s;}
.proj-card:hover{transform:translateY(-6px);box-shadow:0 20px 44px rgba(12,12,18,.13);border-color:#d8d2c4;}
.proj-card .ph{transition:transform .45s cubic-bezier(.2,.7,.2,1);}
.proj-card:hover .ph{transform:scale(1.045);}
.proj-card .ph img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;}
.proj-card .ph.has-img{padding:0;background:#0c0c12;}
.proj-card .ph.has-embed{padding:0;background:#000;}
.proj-card .ph.has-embed iframe{position:absolute;inset:0;width:100%;height:100%;border:0;}
.proj-card:hover .ph.has-embed{transform:none;}
.credits{font-size:.76rem;line-height:1.5;color:var(--faint);margin-top:12px;}
.card-link{display:inline-block;margin-top:14px;color:var(--accent-deep);font-weight:600;font-size:.92rem;}
.card-link:hover{text-decoration:underline;}
button.card-link{background:none;border:0;padding:0;cursor:pointer;font-family:inherit;text-align:left;}
button.card-link::after{content:" \2922";font-weight:700;}

/* ---- in-page embed overlay (lightbox) ---- */
.modal{position:fixed;inset:0;z-index:200;display:none;align-items:center;justify-content:center;padding:24px;}
.modal.open{display:flex;}
.modal-backdrop{position:absolute;inset:0;background:rgba(12,12,18,.80);backdrop-filter:blur(7px);animation:mFade .2s ease;}
.modal-panel{position:relative;z-index:1;display:flex;flex-direction:column;width:min(1040px,95vw);height:min(840px,90vh);background:var(--noir);border-radius:16px;overflow:hidden;box-shadow:0 36px 90px rgba(0,0,0,.55);animation:mPop .24s cubic-bezier(.2,.7,.2,1);}
.modal-head{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:12px 16px;color:#fff;border-bottom:1px solid rgba(255,255,255,.1);flex:none;}
.modal-head .mt{font-family:"Fraunces",serif;font-size:1rem;font-weight:500;}
.modal-head .actions{display:flex;align-items:center;gap:14px;}
.modal-head .newtab{color:rgba(255,255,255,.6);font-size:.82rem;}
.modal-head .newtab:hover{color:#fff;}
.modal-close{width:34px;height:34px;border:0;border-radius:50%;background:rgba(255,255,255,.1);color:#fff;font-size:1.3rem;line-height:1;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:background .15s;}
.modal-close:hover{background:var(--accent);color:#16161c;}
.modal-body{flex:1;position:relative;background:#1d1d27;}
.modal-body iframe{position:absolute;inset:0;width:100%;height:100%;border:0;}
.modal-body video{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;background:#000;}
.modal-body img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;background:#000;}
.modal.video .modal-panel{width:min(1000px,95vw);height:min(720px,90vh);}
.modal.video.vportrait .modal-panel{width:min(430px,94vw);height:min(900px,92vh);}
.modal.image .modal-panel{width:min(1200px,96vw);height:min(880px,94vh);}
.modal-arrow{position:absolute;top:50%;transform:translateY(-50%);z-index:3;display:none;width:46px;height:46px;border:0;border-radius:50%;background:rgba(255,255,255,.14);color:#fff;font-size:1.9rem;line-height:1;cursor:pointer;align-items:center;justify-content:center;transition:background .15s,color .15s;}
.modal-arrow:hover{background:var(--accent);color:#16161c;}
.modal-arrow.prev{left:14px;}
.modal-arrow.next{right:14px;}
.modal.gallery .modal-arrow{display:flex;}

/* ---- creative gallery grid (masonry) ---- */
.gallery-grid{columns:3;column-gap:14px;margin-top:36px;}
@media(max-width:900px){.gallery-grid{columns:2;}}
@media(max-width:560px){.gallery-grid{columns:1;}}
.gthumb{break-inside:avoid;display:block;width:100%;margin:0 0 14px;padding:0;border:0;background:none;cursor:pointer;border-radius:10px;overflow:hidden;position:relative;}
.gthumb img{width:100%;display:block;transition:transform .45s cubic-bezier(.2,.7,.2,1);}
.gthumb:hover img{transform:scale(1.05);}
.gthumb::after{content:"";position:absolute;inset:0;background:linear-gradient(transparent 55%,rgba(12,12,18,.34));opacity:0;transition:opacity .2s;}
.gthumb:hover::after{opacity:1;}
.gallery-grid.paintings{columns:2;}
@media(max-width:560px){.gallery-grid.paintings{columns:1;}}
.gallery-grid.duo{columns:auto;display:grid;grid-template-columns:1fr 1fr;gap:16px;align-items:start;}
.gallery-grid.duo .gthumb{margin:0;}
@media(max-width:560px){.gallery-grid.duo{grid-template-columns:1fr;}}

/* ---- scroll-triggered timelapse stage ---- */
.timelapse-stage{position:relative;width:100%;min-height:88vh;margin:30px 0;background:#fff;display:flex;align-items:center;justify-content:center;overflow:hidden;}
.timelapse-stage video{width:100%;height:88vh;object-fit:contain;background:#fff;display:block;}
.tl-cap{position:absolute;bottom:22px;left:24px;font-size:.82rem;letter-spacing:.04em;color:var(--faint);text-transform:uppercase;font-weight:500;}
.tl-sound{position:absolute;bottom:18px;right:24px;padding:12px 18px;border-radius:8px;border:0;background:rgba(12,12,18,.62);color:#fff;font-family:ui-monospace,"SF Mono",Menlo,Consolas,monospace;font-size:.78rem;letter-spacing:.03em;line-height:1;cursor:pointer;backdrop-filter:blur(5px);display:flex;align-items:center;justify-content:center;transition:background .15s,transform .15s;}
.tl-sound:hover{background:var(--accent);transform:scale(1.06);}
@media(max-width:600px){.timelapse-stage,.timelapse-stage video{min-height:60vh;height:60vh;}}
@keyframes mFade{from{opacity:0}to{opacity:1}}
@keyframes mPop{from{opacity:0;transform:translateY(16px) scale(.98)}to{opacity:1;transform:none}}
@media(prefers-reduced-motion:reduce){.modal-backdrop,.modal-panel{animation:none;}}
.btn-lg{position:relative;overflow:hidden;}
.btn-lg::after{content:"";position:absolute;top:0;left:-130%;width:55%;height:100%;background:linear-gradient(110deg,transparent,rgba(255,255,255,.38),transparent);transform:skewX(-20deg);transition:left .55s ease;}
.btn-lg:hover::after{left:150%;}
.btn-lg.ghost::after{background:linear-gradient(110deg,transparent,rgba(255,105,74,.25),transparent);}

/* ---- repo cards (Open source) ---- */
.repo-head{display:flex;align-items:center;gap:9px;padding:18px 24px 0;font-size:.8rem;color:var(--faint);font-weight:500;}
.lang-dot{width:12px;height:12px;border-radius:50%;flex:none;box-shadow:0 0 0 3px rgba(0,0,0,.04);}
.repo-head .gh{margin-left:auto;display:inline-flex;align-items:center;gap:5px;}
.repo-card .body{padding-top:14px;}
.repo-card h3{display:flex;align-items:center;gap:8px;}
.chip.live{background:rgba(31,122,90,.12);border-color:rgba(31,122,90,.32);color:#1f7a5a;font-weight:600;}
.chip.star{background:rgba(207,75,48,.10);border-color:rgba(207,75,48,.30);color:var(--accent-deep);font-weight:600;}

/* ---- dark multi-column footer ---- */
footer.site-footer{background:var(--noir);color:rgba(255,255,255,.7);padding:66px 0 30px;}
footer.site-footer .foot-grid{display:grid;grid-template-columns:1.7fr 1fr 1fr 1.2fr;gap:38px;}
@media(max-width:760px){footer.site-footer .foot-grid{grid-template-columns:1fr 1fr;gap:30px;}}
@media(max-width:480px){footer.site-footer .foot-grid{grid-template-columns:1fr;}}
footer.site-footer .brand{color:#fff;font-size:1.3rem;}
footer.site-footer .foot-brand p{margin-top:10px;max-width:32ch;color:rgba(255,255,255,.55);font-size:.95rem;}
footer.site-footer .foot-avail{display:inline-flex;align-items:center;gap:8px;margin-top:16px;font-size:.85rem;color:var(--mint);}
footer.site-footer .foot-avail .dot{width:8px;height:8px;border-radius:50%;background:var(--mint);animation:pulse 2.2s infinite;}
footer.site-footer h5{font-family:"Archivo",sans-serif;font-size:.76rem;letter-spacing:.13em;text-transform:uppercase;color:rgba(255,255,255,.42);margin-bottom:14px;font-weight:600;}
footer.site-footer .foot-col a,footer.site-footer .foot-col p{display:block;color:rgba(255,255,255,.72);font-size:.93rem;margin-bottom:10px;transition:color .15s;}
footer.site-footer .foot-col a:hover{color:var(--accent);}
footer.site-footer .foot-base{margin-top:48px;padding-top:22px;border-top:1px solid rgba(255,255,255,.1);display:flex;justify-content:space-between;gap:14px;flex-wrap:wrap;font-size:.84rem;color:rgba(255,255,255,.42);}

/* ============================================================
   v3 — immersive layer (constellation, tilt, spotlight, parallax)
   ============================================================ */
.hero-cine canvas.constellation{position:absolute;inset:0;z-index:2;pointer-events:none;}
.hero-cine .glow{transition:transform .35s cubic-bezier(.2,.7,.2,1);will-change:transform;}
.hero-cine .wrap{transition:transform .45s cubic-bezier(.2,.7,.2,1);will-change:transform;}
.tiltable{transition:transform .18s ease,box-shadow .28s,border-color .2s;will-change:transform;}
.proj-card,.pillar{position:relative;}
.proj-card::before,.pillar::before{content:"";position:absolute;inset:0;z-index:1;border-radius:inherit;pointer-events:none;opacity:0;transition:opacity .3s;background:radial-gradient(360px circle at var(--mx,50%) var(--my,50%),rgba(255,105,74,.13),transparent 65%);}
.proj-card:hover::before,.pillar:hover::before{opacity:1;}
.hero-cine .btn-lg,.band .links a{transition:transform .22s cubic-bezier(.2,.7,.2,1),box-shadow .2s,border-color .2s,background .2s;will-change:transform;}
.motion-chip{position:fixed;right:16px;bottom:16px;z-index:120;padding:10px 18px;border:1px solid rgba(255,105,74,.5);border-radius:10px;background:rgba(12,12,18,.82);color:var(--accent);cursor:pointer;font-family:"Archivo",sans-serif;font-size:.8rem;font-weight:500;letter-spacing:.04em;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);box-shadow:0 6px 22px rgba(12,12,18,.35);}
.motion-chip:active{transform:scale(.96);}
@media(prefers-reduced-motion:reduce){.motion-chip{display:none;}}

/* ============================================================
   v4 — de-AI pass: Archivo body, featured cards, bleed photo,
   mono annotations
   ============================================================ */
.note-mono{font-family:ui-monospace,"SF Mono",Menlo,Consolas,monospace;font-size:.74rem;letter-spacing:.03em;color:var(--faint);}
.hero-cine .hero-note{margin-top:28px;color:rgba(255,255,255,.38);}
.sec-head-row{display:flex;align-items:baseline;gap:18px;flex-wrap:wrap;}
.sec-head-row .note-mono{transform:rotate(-1.4deg);transform-origin:left bottom;}
@media(min-width:761px){
  .grid .proj-card.featured{grid-column:1/-1;flex-direction:row;}
  .grid .proj-card.featured .ph{width:52%;aspect-ratio:auto;min-height:360px;flex:none;}
  .grid .proj-card.featured .body{width:48%;padding:34px;}
  .grid .proj-card.featured h3{font-size:1.7rem;}
}
.photo-bleed{position:relative;margin:36px 0 6px;}
.photo-bleed .gthumb{border-radius:0;margin:0;display:block;width:100%;}
.photo-bleed img{width:100%;max-height:72vh;object-fit:cover;}
.photo-bleed .bleed-cap{position:absolute;left:24px;bottom:16px;color:rgba(255,255,255,.85);text-shadow:0 1px 8px rgba(0,0,0,.6);pointer-events:none;}

/* ============================================================
   v5 — scroll choreography: hero recede, image settle, statement
   ============================================================ */
.hero-scroll{position:relative;z-index:3;will-change:transform,opacity;}
.rv .proj-card.featured .ph img{transform:scale(1.05);transition:transform 1.2s cubic-bezier(.22,1,.36,1);}
.proj-card.featured.reveal.in .ph img{transform:scale(1);}
.photo-bleed{overflow:hidden;}
.rv .photo-bleed img{transform:scale(1.05);transition:transform 1.2s cubic-bezier(.22,1,.36,1);}
.photo-bleed.reveal.in img{transform:scale(1);}
.statement{border-top:none;padding:34px 0 10px;}
.statement .big-say{font-family:"Fraunces",serif;font-weight:500;font-size:clamp(2.4rem,5.6vw,4.4rem);line-height:1.1;letter-spacing:-.015em;margin:0;max-width:22ch;}
.statement .big-say em{color:var(--accent-deep);}

/* ---- reduced motion ---- */
@media(prefers-reduced-motion:reduce){
  .hero-cine .glow::before,.hero-cine .glow::after,.hero-cine .grain,.marquee .track,.avail .dot,footer.site-footer .foot-avail .dot{animation:none!important;}
  .reveal{opacity:1!important;transform:none!important;transition:none!important;}
  .rv .proj-card.featured .ph img,.rv .photo-bleed img{transform:none!important;transition:none!important;}
  html{scroll-behavior:auto;}
}

/* ---- print: hide chrome globally (resume PDF) ---- */
@media print{nav.site,footer.site-footer,.marquee,.stats-band{display:none!important;}}