
  :root{
    --ink:#04090F;          /* inky black, blue-teal cast */
    --ink2:#071019;         /* panel ink */
    --line:rgba(45,90,110,.22);   /* hairlines */
    --white:#EDF4F6;
    --mist:#9DB7BE; --faint:#5E7E89;
    --aqua:#2FA39A; --teal:#056C89; --pale:#C3E4E9;
    --grad:linear-gradient(100deg,#071932,#023C4D 25%,#056C89 45%,#0E7E80 62%,#3FA9A0 80%,#88B4BE);
  }
  *{margin:0;padding:0;box-sizing:border-box;}
  html,body{background:var(--ink);color:var(--white);font-family:'Epilogue',sans-serif;}
  body{overflow-x:hidden;}
  ::selection{background:var(--aqua);color:var(--ink);}
  .anton{font-family:'Anton',sans-serif;}
  a{-webkit-tap-highlight-color:transparent;}

  /* ================= LOADER — sequential reveal ================= */
  #loader{position:fixed;inset:0;z-index:1000;background:var(--ink);display:flex;align-items:center;justify-content:center;
    transition:transform .8s cubic-bezier(.7,0,.2,1);}
  #loader.done{transform:translateY(-101%);}
  .loader-name{font-family:'Archivo',sans-serif;font-weight:900;font-stretch:125%;font-size:clamp(1.8rem,5.6vw,4.8rem);
    letter-spacing:-.01em;text-transform:uppercase;position:relative;color:var(--white);white-space:nowrap;}
  .loader-name.glow{animation:nameGlow 1s ease forwards;}
  @keyframes nameGlow{
    0%{text-shadow:none;}
    45%{text-shadow:0 0 18px rgba(237,244,246,.95),0 0 60px rgba(47,163,154,.9),0 0 120px rgba(47,163,154,.6);color:#fff;}
    100%{text-shadow:0 0 6px rgba(237,244,246,.35),0 0 30px rgba(47,163,154,.35);}
  }
  .lj,.lk,.ld,.lv{opacity:0;display:inline-block;}
  /* J slams in */
  .lj{animation:slam .45s cubic-bezier(.2,.9,.3,1.4) .35s forwards;}
  @keyframes slam{0%{opacity:0;transform:scale(2.4);filter:blur(8px);}70%{opacity:1;transform:scale(.96);filter:blur(0);}100%{opacity:1;transform:scale(1);}}
  /* KNIGHT unrolls out of the J */
  .lk{animation:unroll .55s cubic-bezier(.7,0,.2,1) 1.0s forwards;clip-path:inset(0 100% 0 0);transform:translateX(-.15em);}
  @keyframes unroll{0%{opacity:1;clip-path:inset(0 100% 0 0);transform:translateX(-.15em);}100%{opacity:1;clip-path:inset(0 0 0 0);transform:none;}}
  /* big DOT pops */
  .ld{animation:dotpop .4s cubic-bezier(.2,.9,.3,1.5) 1.75s forwards;}
  @keyframes dotpop{0%{opacity:0;transform:scale(0);}70%{opacity:1;transform:scale(1.5);}100%{opacity:1;transform:scale(1);}}
  /* VISION flickers on like a tube light */
  .lv{animation:flicker .9s steps(1) 2.15s forwards;}
  @keyframes flicker{
    0%{opacity:0;}8%{opacity:.9;}12%{opacity:.1;}20%{opacity:.7;}26%{opacity:.15;}
    38%{opacity:1;}44%{opacity:.3;}55%{opacity:.95;}62%{opacity:.5;}75%{opacity:1;}
    82%{opacity:.85;}100%{opacity:1;}
  }

  /* ================= HAIRLINE GRID ================= */
  .gridlines{position:fixed;inset:0;pointer-events:none;z-index:1;display:flex;justify-content:space-evenly;}
  .gridlines i{width:1px;background:var(--line);transform:scaleY(0);transform-origin:top;}
  body.loaded .gridlines i{animation:lineOn .7s forwards;}
  body.loaded .gridlines i:nth-child(1){animation-delay:1.1s;}
  body.loaded .gridlines i:nth-child(2){animation-delay:1.35s;}
  body.loaded .gridlines i:nth-child(3){animation-delay:1.2s;}
  @keyframes lineOn{0%{transform:scaleY(0);}40%{transform:scaleY(.3);}55%{transform:scaleY(.28);}100%{transform:scaleY(1);}}

  /* ================= MASTHEAD TYPE + NAV ================= */
  .masthead-ui{position:fixed;top:0;left:0;right:0;z-index:90;display:flex;align-items:flex-start;justify-content:space-between;
    padding:.45rem 1.2rem 0;pointer-events:none;}
  .masthead-ui::before{content:'';position:absolute;left:0;right:0;top:0;height:72px;background:var(--ink);
    border-bottom:1px solid var(--line);transform:translateY(-101%);transition:transform .5s cubic-bezier(.7,0,.2,1);z-index:-1;}
  body.scrolled .masthead-ui::before,body.subpage .masthead-ui::before{transform:translateY(0);}
  .mast-word{font-family:'Archivo',sans-serif;font-weight:900;font-stretch:125%;font-size:clamp(2.6rem,7.4vw,7.2rem);
    line-height:.9;letter-spacing:-.015em;text-transform:uppercase;color:rgba(237,244,246,.5);pointer-events:auto;
    text-decoration:none;display:block;position:relative;transform-origin:left top;
    transition:transform .6s cubic-bezier(.7,0,.2,1),color .35s;}
  .mast-word:hover{color:rgba(237,244,246,.85);}
  body.scrolled .mast-word,body.subpage .mast-word{color:var(--white);}
  /* gradient period — same position as a plain full stop */
  .gdot,.mast-word .jdot,.loader-name .ld,.bigfoot .fm b .fdot{
    background-image:linear-gradient(135deg,#056C89 0%,#0E7E80 30%,#2FA39A 62%,#88B4BE 100%);
    -webkit-background-clip:text;background-clip:text;color:transparent;
    font-style:normal;}
  .burger{pointer-events:auto;width:58px;height:58px;background:rgba(4,9,15,.55);border:1px solid var(--line);
    display:flex;flex-direction:column;align-items:center;justify-content:center;gap:7px;cursor:pointer;
    backdrop-filter:blur(4px);position:relative;margin-top:clamp(.5rem,1.1vw,1rem);transform-origin:left top;
    transition:border-color .2s,transform .6s cubic-bezier(.7,0,.2,1);}
  .burger.open{transition:border-color .2s,transform .5s cubic-bezier(.7,0,.2,1);}
  .burger:hover{border-color:var(--aqua);}
  .burger .blines{display:flex;flex-direction:column;gap:7px;align-items:center;
    transition:transform .5s cubic-bezier(.7,0,.2,1);}
  .burger.open .blines{transform:rotate(180deg);}
  .burger span{display:block;width:24px;height:2px;background:var(--white);
    transition:transform .45s cubic-bezier(.2,.9,.3,1.3),opacity .3s,background .3s;}
  .burger:hover span:nth-child(1){animation:lineJukeR .5s ease;}
  .burger:hover span:nth-child(2){animation:lineJukeL .5s ease;}
  @keyframes lineJukeR{0%{transform:translateX(0);}35%{transform:translateX(6px) scaleX(.7);}70%{transform:translateX(-2px);}100%{transform:none;}}
  @keyframes lineJukeL{0%{transform:translateX(0);}35%{transform:translateX(-6px) scaleX(.7);}70%{transform:translateX(2px);}100%{transform:none;}}
  .burger.open{border-color:var(--aqua);}
  .burger.open span{background:var(--aqua);}
  .burger.open span:nth-child(1){transform:translateY(4.5px) rotate(45deg);animation:none;}
  .burger.open span:nth-child(2){transform:translateY(-4.5px) rotate(-45deg);animation:none;}
  .burger::before,.burger::after,.burger b::before,.burger b::after{content:'';position:absolute;width:9px;height:9px;border:1px solid var(--faint);transition:all .35s cubic-bezier(.2,.9,.3,1.3);}
  .burger::before{top:-4px;left:-4px;border-right:0;border-bottom:0;}
  .burger::after{top:-4px;right:-4px;border-left:0;border-bottom:0;}
  .burger b::before{bottom:-4px;left:-4px;border-right:0;border-top:0;}
  .burger b::after{bottom:-4px;right:-4px;border-left:0;border-top:0;}
  .burger:hover::before{transform:translate(-3px,-3px);border-color:var(--aqua);}
  .burger:hover::after{transform:translate(3px,-3px);border-color:var(--aqua);}
  .burger:hover b::before{transform:translate(-3px,3px);border-color:var(--aqua);}
  .burger:hover b::after{transform:translate(3px,3px);border-color:var(--aqua);}
  .burger.open::before,.burger.open::after,.burger.open b::before,.burger.open b::after{border-color:var(--aqua);}

  /* ================= BOAZ BUTTONS ================= */
  .btn-box{pointer-events:auto;position:relative;display:inline-flex;align-items:center;gap:.65rem;
    font-family:'IBM Plex Mono',monospace;font-size:.72rem;letter-spacing:.14em;text-transform:uppercase;
    color:var(--white);text-decoration:none;border:1px solid var(--line);background:rgba(4,9,15,.55);
    padding:1rem 1.4rem;overflow:hidden;transition:color .3s,border-color .3s;backdrop-filter:blur(4px);cursor:pointer;}
  .btn-box .d{width:7px;height:7px;border-radius:50%;background:var(--aqua);flex-shrink:0;transition:transform .3s;position:relative;z-index:2;}
  .btn-box em{font-style:normal;position:relative;z-index:2;}
  .btn-box::after{content:'';position:absolute;inset:0;background:var(--aqua);transform:translateY(101%);transition:transform .35s cubic-bezier(.7,0,.2,1);}
  .btn-box:hover::after{transform:translateY(0);}
  .btn-box:hover{color:var(--ink);border-color:var(--aqua);}
  .btn-box:hover .d{background:var(--ink);transform:scale(1.4);}

  /* ================= HOME: VIDEO MASTHEAD ================= */
  #mast{position:fixed;inset:0;z-index:0;overflow:hidden;background:var(--ink);}
  #mastvideo{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;}
  .mast-fallback{position:absolute;inset:0;background-image:url('/assets/img/lyric.jpg');background-size:cover;background-position:center;animation:kb 24s ease-in-out infinite alternate;display:none;}
  #mast.novideo .mast-fallback{display:block;}
  @keyframes kb{from{transform:scale(1);}to{transform:scale(1.12);}}
  .gauze{position:absolute;inset:0;background:
    linear-gradient(to bottom,rgba(4,9,15,.55),rgba(4,9,15,.15) 30%,rgba(4,9,15,.2) 70%,rgba(4,9,15,.75)),
    rgba(2,60,77,.26);}
  .gauze::after{content:'';position:absolute;inset:0;opacity:.55;
    background-image:radial-gradient(rgba(4,9,15,.85) 1px,transparent 1.4px);background-size:4px 4px;}
  .mast-corner{position:fixed;bottom:1.4rem;z-index:60;}
  .mast-corner.left{left:1.4rem;}
  .mast-corner.right{right:1.4rem;}
  .call-btn{padding:1rem 1.1rem;}
  .call-btn svg{width:16px;height:16px;position:relative;z-index:2;fill:none;stroke:currentColor;stroke-width:1.6;}

  /* ================= SCROLL PANEL OVER VIDEO ================= */
  main{position:relative;z-index:5;}
  .spacer{height:100svh;pointer-events:none;}
  .panel{background:var(--ink);border-top:1px solid var(--line);position:relative;}
  .inner{max-width:1440px;margin:0 auto;padding:7rem 2rem;}

  h1.state{font-family:'Anton',sans-serif;text-transform:uppercase;line-height:1;letter-spacing:.01em;
    font-size:clamp(2.6rem,7.2vw,7rem);}
  h1.state .lit{background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent;}
  h1.state .out{color:transparent;-webkit-text-stroke:1px var(--faint);}
  .fourA{margin-top:2.6rem;max-width:640px;color:var(--mist);font-size:1.05rem;line-height:1.7;}
  .fourA b{color:var(--white);}

  .home-grid{display:grid;grid-template-columns:1.2fr 1fr;gap:4rem;align-items:end;margin-top:5rem;}
  @media(max-width:900px){.home-grid{grid-template-columns:1fr;}}
  .stagger{font-family:'Anton',sans-serif;text-transform:uppercase;line-height:1.02;font-size:clamp(2.2rem,5vw,4.6rem);}
  .stagger span{display:block;}
  .stagger span:nth-child(2){margin-left:12%;}
  .stagger span:nth-child(3){margin-left:5%;}
  .stagger span:nth-child(4){margin-left:9%;color:var(--faint);}
  .home-copy p{color:var(--mist);line-height:1.7;font-size:.98rem;}
  .home-copy p b{color:var(--aqua);font-weight:600;}
  .home-copy .btns{display:flex;gap:1rem;margin-top:1.8rem;flex-wrap:wrap;}

  .reveal{opacity:0;transform:translateY(26px);transition:opacity .8s,transform .8s;}
  .reveal.in{opacity:1;transform:none;}

  /* ================= MENU (BOAZ) ================= */
  #scrim{display:none;}
  #menu{position:fixed;inset:0;z-index:85;background:rgba(4,9,15,.96);backdrop-filter:blur(10px);
    display:flex;flex-direction:column;justify-content:center;align-items:center;padding:3rem;
    clip-path:circle(0% at 50% 6%);pointer-events:none;transition:clip-path .7s cubic-bezier(.7,0,.2,1);}
  #menu.open{clip-path:circle(150% at 50% 6%);pointer-events:auto;}
  #menu a.mlink{font-family:'Anton',sans-serif;text-transform:uppercase;text-decoration:none;
    font-size:clamp(2.6rem,7vw,5.4rem);line-height:1.22;color:var(--white);display:block;text-align:center;
    transition:color .2s,letter-spacing .3s;position:relative;
    opacity:0;transform:translateY(26px);}
  #menu.open a.mlink{animation:mlinkIn .55s cubic-bezier(.2,.8,.2,1) forwards;}
  #menu.open a.mlink:nth-of-type(1){animation-delay:.22s;}
  #menu.open a.mlink:nth-of-type(2){animation-delay:.32s;}
  #menu.open a.mlink:nth-of-type(3){animation-delay:.42s;}
  #menu.open a.mlink:nth-of-type(4){animation-delay:.52s;}
  #menu.open a.mlink:nth-of-type(5){animation-delay:.62s;}
  @keyframes mlinkIn{to{opacity:1;transform:none;}}
  #menu a.mlink:hover{color:var(--aqua);letter-spacing:.04em;}
  #menu a.mlink small{display:block;font-family:'IBM Plex Mono',monospace;font-style:normal;font-size:.6rem;
    letter-spacing:.3em;color:var(--faint);margin-top:-.1rem;}
  #menu .menu-foot{position:absolute;bottom:2rem;left:3rem;right:3rem;display:flex;justify-content:space-between;align-items:center;
    font-family:'IBM Plex Mono',monospace;font-size:.62rem;letter-spacing:.18em;color:var(--faint);text-transform:uppercase;}

  /* ================= SECTION DIVIDERS — full-width gradient lines ================= */
  .divider2{height:2px;width:100%;background:var(--grad);transform:scaleX(0);transform-origin:right center;}
  .divider2.reveal{opacity:1;filter:none;transform:scaleX(0);transition:transform 1.1s cubic-bezier(.7,0,.2,1);}
  .divider2.reveal.in{transform:scaleX(1);}
  .divider2.rev{transform-origin:left center;background:linear-gradient(260deg,#071932,#023C4D 25%,#056C89 45%,#0E7E80 62%,#3FA9A0 80%,#88B4BE);}
  .panel.alt,.section.alt{background:var(--ink2);}
  .followus.alt{background:var(--ink2);}

  /* story preview images */
  .story{padding:0 0 1.8rem;}
  .story .simg{aspect-ratio:16/10;overflow:hidden;display:block;border-bottom:1px solid var(--line);margin-bottom:1.5rem;position:relative;}
  .story .simg img{width:100%;height:100%;object-fit:cover;filter:saturate(.85);transition:transform .7s cubic-bezier(.2,.6,.2,1),filter .4s;display:block;}
  .story:hover .simg img{transform:scale(1.05);filter:saturate(1.05);}
  .story .sbody{padding:0 1.6rem;}

  /* ================= HOME LOWER PANELS (Loom mirror) ================= */
  @keyframes scrolltext{to{transform:translateX(-50%);}}
  .followus{border-top:1px solid var(--line);padding:5.5rem 0 2.4rem;position:relative;overflow:hidden;}
  .fmarquee{overflow:hidden;white-space:nowrap;}
  .fmarquee .trk{display:inline-block;animation:scrolltext 26s linear infinite;}
  .fmarquee span{font-family:'Archivo',sans-serif;font-weight:900;font-stretch:125%;font-size:clamp(2.4rem,6vw,5.2rem);
    letter-spacing:-.01em;text-transform:uppercase;color:transparent;-webkit-text-stroke:1px var(--faint);margin-right:2.4rem;}
  .fmarquee span.solid{color:var(--white);-webkit-text-stroke:0;}
  .fmarquee em{font-style:normal;color:var(--aqua);margin-right:2.4rem;font-size:1.6rem;vertical-align:.5em;}
  .social-row{display:flex;gap:1rem;justify-content:center;margin-top:3.2rem;flex-wrap:wrap;padding:0 2rem;}

  .home-sec-head{display:flex;justify-content:space-between;align-items:flex-end;gap:2rem;margin-bottom:2.6rem;flex-wrap:wrap;}
  .home-sec-head h2{font-family:'Anton',sans-serif;text-transform:uppercase;font-size:clamp(2rem,4.6vw,4rem);line-height:.98;}
  .home-sec-head .crumb{font-family:'IBM Plex Mono',monospace;font-size:.65rem;letter-spacing:.24em;color:var(--aqua);text-transform:uppercase;display:block;margin-bottom:.9rem;}

  /* get in touch */
  .git{border-top:1px solid var(--line);}
  .git-grid{display:grid;grid-template-columns:1fr 1fr;gap:4rem;align-items:start;}
  @media(max-width:900px){.git-grid{grid-template-columns:1fr;}}
  .git-grid h2{font-family:'Anton',sans-serif;text-transform:uppercase;font-size:clamp(2.4rem,5.6vw,5rem);line-height:.97;}
  .git-grid h2 span{background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent;}
  .git-grid .lede{color:var(--mist);line-height:1.7;margin-top:1.4rem;max-width:440px;}
  .f-field{margin-bottom:1.2rem;}
  .f-field label{display:block;font-family:'IBM Plex Mono',monospace;font-size:.6rem;letter-spacing:.22em;
    text-transform:uppercase;color:var(--faint);margin-bottom:.5rem;}
  .f-field input,.f-field textarea{width:100%;background:var(--ink2);border:1px solid var(--line);color:var(--white);
    font-family:'Epilogue',sans-serif;font-size:.95rem;padding:.95rem 1rem;outline:none;transition:border-color .2s;resize:vertical;}
  .f-field input:focus,.f-field textarea:focus{border-color:var(--aqua);}
  .f-two{display:grid;grid-template-columns:1fr 1fr;gap:1.2rem;}

  /* big footer */
  .bigfoot{position:relative;z-index:5;background:var(--ink2);border-top:1px solid var(--line);}
  .bigfoot .cols{max-width:1440px;margin:0 auto;padding:4.5rem 2rem 3rem;display:grid;
    grid-template-columns:1.4fr 1fr 1fr 1.4fr;gap:3rem;}
  @media(max-width:960px){.bigfoot .cols{grid-template-columns:1fr 1fr;}}
  @media(max-width:600px){.bigfoot .cols{grid-template-columns:1fr;}}
  .bigfoot .fm{display:flex;align-items:center;gap:.7rem;}
  .bigfoot .fm svg{width:34px;height:34px;}
  .bigfoot .fm b{font-family:'Archivo',sans-serif;font-weight:900;font-stretch:125%;font-size:1.05rem;letter-spacing:0;color:var(--white);}
  .bigfoot .fm b i{font-style:normal;color:var(--aqua);}
  .bigfoot .tag{margin-top:1rem;color:var(--faint);font-size:.82rem;line-height:1.6;max-width:280px;}
  .bigfoot h4{font-family:'IBM Plex Mono',monospace;font-size:.62rem;letter-spacing:.24em;color:var(--faint);
    text-transform:uppercase;margin-bottom:1.1rem;}
  .bigfoot ul{list-style:none;}
  .bigfoot ul a{display:inline-block;color:var(--mist);text-decoration:none;font-size:.88rem;padding:.28rem 0;transition:color .2s,transform .2s;}
  .bigfoot ul a:hover{color:var(--pale);transform:translateX(4px);}
  .newsletter p{color:var(--faint);font-size:.82rem;line-height:1.6;margin-bottom:1rem;}
  .newsletter .nrow{display:flex;gap:.6rem;}
  .newsletter input{flex:1;background:var(--ink);border:1px solid var(--line);color:var(--white);padding:.8rem .9rem;
    font-family:'Epilogue',sans-serif;font-size:.85rem;outline:none;transition:border-color .2s;min-width:0;}
  .newsletter input:focus{border-color:var(--aqua);}
  .bigfoot .legal{border-top:1px solid var(--line);padding:1.4rem 2rem;display:flex;justify-content:space-between;
    flex-wrap:wrap;gap:1rem;font-family:'IBM Plex Mono',monospace;font-size:.58rem;letter-spacing:.16em;
    color:var(--faint);text-transform:uppercase;max-width:1440px;margin:0 auto;}

  /* Simarro work rows */
  .film.tall{height:100svh;min-height:560px;border-top:1px solid var(--line);}
  .film .idx{position:absolute;top:6.4rem;left:2rem;font-family:'IBM Plex Mono',monospace;font-size:.7rem;
    letter-spacing:.2em;color:var(--mist);}
  .film .dur{position:absolute;top:6.4rem;right:2rem;font-family:'IBM Plex Mono',monospace;font-size:.7rem;
    letter-spacing:.2em;color:var(--mist);}

  /* ================= PAGES ================= */
  .page{display:block;min-height:100svh;position:relative;z-index:5;background:var(--ink);}
  body.scrolled .mast-corner{opacity:0;pointer-events:none;transition:opacity .3s;}
  body.subpage #mast,body.subpage .mast-corner{display:none;}
  .page-head{padding:9rem 2rem 3rem;max-width:1440px;margin:0 auto;}
  .page-head .crumb{font-family:'IBM Plex Mono',monospace;font-size:.65rem;letter-spacing:.24em;color:var(--aqua);text-transform:uppercase;}
  .page-head h2{font-family:'Anton',sans-serif;text-transform:uppercase;font-size:clamp(2.8rem,8vw,7.5rem);line-height:.96;margin-top:1rem;}
  .page-head p.lede{max-width:600px;color:var(--mist);line-height:1.7;margin-top:1.6rem;}

  /* WORK — Simarro-style full-bleed rows */
  .film{position:relative;height:40vh;min-height:280px;max-height:460px;overflow:hidden;display:block;text-decoration:none;
    border-top:1px solid var(--line);}
  .film .bg{position:absolute;inset:0;background-size:cover;background-position:center;transform:scale(1.04);
    transition:transform .9s cubic-bezier(.2,.6,.2,1),filter .5s;filter:saturate(.85) brightness(.75);}
  .film:hover .bg{transform:scale(1);filter:saturate(1) brightness(.9);}
  .film .veil{position:absolute;inset:0;background:linear-gradient(to top,rgba(4,9,15,.8),rgba(4,9,15,.1) 45%);}
  .film .ft{position:absolute;left:2rem;bottom:2rem;right:2rem;display:flex;justify-content:space-between;align-items:flex-end;gap:2rem;}
  .film .ft h3{font-family:'Anton',sans-serif;text-transform:uppercase;font-size:clamp(2rem,5.4vw,5rem);line-height:.98;color:var(--white);}
  .film .meta{font-family:'IBM Plex Mono',monospace;font-size:.68rem;letter-spacing:.16em;color:var(--mist);
    text-transform:uppercase;text-align:right;white-space:nowrap;}
  .film .meta b{display:block;color:var(--aqua);font-weight:500;}
  .film .play{position:absolute;top:50%;left:50%;z-index:6;transform:translate(-50%,-50%) scale(.94);
    border:1px solid rgba(237,244,246,.55);background:rgba(4,9,15,.35);backdrop-filter:blur(2px);
    padding:.9rem 1.6rem;display:flex;align-items:center;gap:.6rem;
    font-family:'IBM Plex Mono',monospace;font-size:.72rem;letter-spacing:.2em;text-transform:uppercase;color:var(--white);
    opacity:0;filter:blur(2.4px);
    transition:opacity .35s,transform .35s,filter .35s,border-color .3s,background .3s;}
  .film .play::before{content:'LEARN MORE';}
  .film .play::after{content:'';width:0;height:0;border-left:9px solid currentColor;border-top:6px solid transparent;border-bottom:6px solid transparent;}
  .film:hover .play{opacity:1;transform:translate(-50%,-50%) scale(1);}
  .film .play:hover{filter:blur(0);border-color:var(--aqua);background:rgba(2,60,77,.55);transform:translate(-50%,-50%) scale(1.04);}

  /* JOURNEY (oversized-type + timeline) */
  .jy-big{font-family:'Archivo',sans-serif;font-weight:900;font-stretch:125%;text-transform:uppercase;
    font-size:clamp(4rem,13.5vw,13rem);line-height:.86;letter-spacing:-.02em;color:var(--white);
    white-space:nowrap;overflow:hidden;padding:0 1.2rem;}
  .jy-big.dim{color:transparent;-webkit-text-stroke:1px var(--faint);}
  .jy-hero{position:relative;height:62vh;min-height:420px;overflow:hidden;margin:1.2rem 0;}
  .jy-hero .bg{position:absolute;inset:0;background-size:cover;background-position:center;}
  .jy-hero .veil{position:absolute;inset:0;background:linear-gradient(to top left,rgba(4,9,15,.55) 0%,rgba(4,9,15,.18) 42%,rgba(4,9,15,0) 68%);}
  .jy-hero h3{position:absolute;right:2.5rem;bottom:2.2rem;left:auto;top:auto;max-width:min(46%,540px);text-align:right;
    font-family:'Anton',sans-serif;text-transform:uppercase;font-size:clamp(1.2rem,2.6vw,2.2rem);line-height:1.12;
    letter-spacing:.02em;text-shadow:0 2px 24px rgba(4,9,15,.85);}
  @media(max-width:820px){.jy-hero h3{left:1.4rem;right:1.4rem;max-width:none;text-align:left;}}
  .jy-intro{max-width:900px;margin:0 auto;text-align:center;padding:6rem 2rem 3rem;}
  .jy-intro h3{font-family:'Anton',sans-serif;text-transform:uppercase;font-size:clamp(1.6rem,3.6vw,3rem);line-height:1.15;}
  .jy-intro h3 em{font-style:normal;background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent;}
  .jy-intro p{color:var(--mist);line-height:1.7;margin-top:1.4rem;}
  .jy-video{max-width:1240px;margin:2rem auto 0;padding:0 2rem;}
  .jy-video video{width:100%;aspect-ratio:16/9;object-fit:cover;display:block;border:1px solid var(--line);}
  .jy-video figcaption{font-family:'IBM Plex Mono',monospace;font-size:.62rem;letter-spacing:.18em;color:var(--faint);
    text-transform:uppercase;padding-top:.7rem;text-align:right;}

  .tl{position:relative;max-width:1240px;margin:4rem auto 0;padding:2rem 2rem 6rem;}
  .tl::before{content:'';position:absolute;left:50%;top:0;bottom:0;width:1px;background:var(--line);}
  .tl-entry{position:relative;display:grid;grid-template-columns:1fr 1fr;gap:4.5rem;margin-bottom:5.5rem;align-items:center;}
  .tl-year{position:absolute;left:50%;transform:translateX(-50%);top:-1.4rem;background:var(--ink);
    font-family:'Archivo',sans-serif;font-weight:900;font-stretch:125%;font-size:clamp(1.6rem,3.4vw,2.8rem);
    color:var(--aqua);padding:.2rem .9rem;z-index:2;line-height:1;}
  .tl-entry .txt h4{font-family:'Anton',sans-serif;text-transform:uppercase;font-size:clamp(1.3rem,2.6vw,2rem);margin-bottom:.8rem;line-height:1.1;}
  .tl-entry .txt p{color:var(--mist);line-height:1.7;font-size:.95rem;}
  .tl-entry .txt .tltag{font-family:'IBM Plex Mono',monospace;font-size:.6rem;letter-spacing:.22em;color:var(--aqua);
    text-transform:uppercase;display:block;margin-bottom:.7rem;}
  .tl-img{aspect-ratio:4/3;background:var(--ink2);border:1px solid var(--line);display:flex;align-items:center;justify-content:center;
    background-size:cover;background-position:center;position:relative;overflow:hidden;}
  .tl-img span{font-family:'IBM Plex Mono',monospace;font-size:.6rem;letter-spacing:.22em;color:var(--faint);text-transform:uppercase;}
  .tl-entry:nth-child(even) .txt{order:2;text-align:left;}
  .tl-entry:nth-child(even) .tl-img{order:1;}
  .tl-entry:nth-child(odd) .txt{text-align:right;}
  @media(max-width:820px){
    .tl::before{left:8px;}
    .tl-year{left:8px;transform:none;}
    .tl-entry{grid-template-columns:1fr;gap:1.4rem;padding-left:2.2rem;}
    .tl-entry:nth-child(odd) .txt{text-align:left;}
    .tl-entry:nth-child(even) .txt{order:1;}.tl-entry:nth-child(even) .tl-img{order:2;}
  }
  .jy-stats{max-width:1240px;margin:0 auto;padding:0 2rem 6rem;display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:1.2rem;}
  .jy-stat{border:1px solid var(--line);padding:2rem 1.6rem;background:var(--ink2);}
  .jy-stat b{font-family:'Archivo',sans-serif;font-weight:900;font-stretch:125%;font-size:clamp(2rem,4.4vw,3.4rem);
    display:block;line-height:1;background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent;}
  .jy-stat span{font-family:'IBM Plex Mono',monospace;font-size:.62rem;letter-spacing:.2em;color:var(--faint);text-transform:uppercase;display:block;margin-top:.8rem;}

  /* ABOUT — portrait, clients, socials */
  .ab-portrait{position:relative;}
  .ab-portrait img{width:100%;display:block;border:1px solid var(--line);filter:saturate(.92);}
  .ab-portrait figcaption{font-family:'IBM Plex Mono',monospace;font-size:.6rem;letter-spacing:.18em;color:var(--faint);
    text-transform:uppercase;padding-top:.7rem;}
  .ab-portrait::after{content:'';position:absolute;left:0;right:0;bottom:2.1rem;height:2px;background:var(--grad);
    transform:scaleX(0);transform-origin:left;transition:transform .8s cubic-bezier(.7,0,.2,1);}
  .ab-portrait.in::after{transform:scaleX(1);}

  .clients{max-width:1400px;margin:0 auto;padding:4.6rem 2rem 5rem;}
  .clients .chead{font-family:'IBM Plex Mono',monospace;font-size:.64rem;letter-spacing:.24em;color:var(--aqua);
    text-transform:uppercase;margin-bottom:2rem;display:block;}
  .cgrid{display:grid;grid-template-columns:repeat(5,1fr);border-top:1px solid var(--line);border-left:1px solid var(--line);}
  @media(max-width:1000px){.cgrid{grid-template-columns:repeat(3,1fr);}}
  @media(max-width:600px){.cgrid{grid-template-columns:repeat(2,1fr);}}
  .cgrid .clogo{border-right:1px solid var(--line);border-bottom:1px solid var(--line);
    aspect-ratio:16/9;display:flex;align-items:center;justify-content:center;position:relative;overflow:hidden;
    padding:1.1rem;transition:background .3s;}
  .cgrid .clogo:hover{background:rgba(2,60,77,.35);}
  .cgrid .clogo svg{width:auto;height:clamp(26px,3.2vw,44px);max-width:78%;
    opacity:.52;filter:saturate(.85);transition:opacity .35s,transform .35s,filter .35s;}
  .cgrid .clogo:hover svg{opacity:1;transform:scale(1.06);filter:saturate(1.1);}
  .cgrid .wordmark span{font-family:'Archivo',sans-serif;font-weight:900;font-stretch:125%;
    font-size:clamp(.8rem,1.45vw,1.3rem);letter-spacing:.01em;text-transform:uppercase;text-align:center;line-height:1.05;
    background-image:linear-gradient(135deg,#056C89 0%,#2FA39A 45%,#88B4BE 100%);
    -webkit-background-clip:text;background-clip:text;color:transparent;
    opacity:.52;transition:opacity .35s,transform .35s;display:block;}
  .cgrid .wordmark:hover span{opacity:1;transform:scale(1.04);}

  .socpanel{max-width:1400px;margin:0 auto;padding:4.6rem 2rem 5.5rem;}
  .socpanel .chead{font-family:'IBM Plex Mono',monospace;font-size:.64rem;letter-spacing:.24em;color:var(--aqua);
    text-transform:uppercase;margin-bottom:1.6rem;display:block;}
  .socrow{border-top:1px solid var(--line);}
  .socrow a{display:flex;align-items:center;justify-content:space-between;gap:2rem;padding:1.5rem .4rem;
    border-bottom:1px solid var(--line);text-decoration:none;position:relative;overflow:hidden;transition:padding-left .3s;}
  .socrow a:hover{padding-left:1.4rem;}
  .socrow a::after{content:'';position:absolute;left:0;bottom:0;height:2px;width:100%;background:var(--grad);
    transform:scaleX(0);transform-origin:left;transition:transform .5s cubic-bezier(.7,0,.2,1);}
  .socrow a:hover::after{transform:scaleX(1);}
  .socrow .sname{font-family:'Archivo',sans-serif;font-weight:900;font-stretch:125%;text-transform:uppercase;
    font-size:clamp(1.6rem,4.2vw,3.2rem);line-height:1;color:transparent;-webkit-text-stroke:1px var(--faint);transition:.3s;}
  .socrow a:hover .sname{color:var(--white);-webkit-text-stroke:0;}
  .socrow .shandle{font-family:'IBM Plex Mono',monospace;font-size:.66rem;letter-spacing:.18em;color:var(--faint);
    text-transform:uppercase;white-space:nowrap;transition:color .3s;}
  .socrow a:hover .shandle{color:var(--aqua);}

  /* CONTACT — maps + details */
  .loc-grid{max-width:1400px;margin:0 auto;padding:1rem 2rem 5rem;display:grid;grid-template-columns:1fr 1fr;gap:2.4rem;}
  @media(max-width:900px){.loc-grid{grid-template-columns:1fr;}}
  .loc{border:1px solid var(--line);background:var(--ink2);}
  .mapwrap{position:relative;aspect-ratio:16/10;overflow:hidden;border-bottom:1px solid var(--line);
    background:
      radial-gradient(circle at 50% 50%,rgba(47,163,154,.18),transparent 62%),
      repeating-linear-gradient(0deg,rgba(45,90,110,.16) 0 1px,transparent 1px 44px),
      repeating-linear-gradient(90deg,rgba(45,90,110,.16) 0 1px,transparent 1px 44px),
      var(--ink);}
  .mapwrap .fallback{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.5rem;
    font-family:'IBM Plex Mono',monospace;color:var(--faint);text-transform:uppercase;letter-spacing:.22em;font-size:.6rem;z-index:0;}
  .mapwrap .fallback b{color:var(--mist);font-size:.8rem;letter-spacing:.18em;font-weight:500;}
  .mapwrap .fallback i{width:16px;height:16px;border:1px solid var(--aqua);border-radius:50%;display:block;position:relative;margin-bottom:.4rem;}
  .mapwrap .fallback i::after{content:'';position:absolute;inset:5px;background:var(--aqua);border-radius:50%;}
  .mapwrap iframe{position:relative;z-index:1;width:100%;height:100%;border:0;display:block;
    filter:invert(1) hue-rotate(186deg) saturate(.5) brightness(.88) contrast(1.08);}
  .mapwrap::after{content:'';position:absolute;inset:0;background:rgba(2,60,77,.30);pointer-events:none;z-index:2;}
  .mapwrap .pin{position:absolute;left:1rem;top:1rem;z-index:4;font-family:'IBM Plex Mono',monospace;font-size:.6rem;
    letter-spacing:.2em;color:var(--aqua);background:rgba(4,9,15,.78);padding:.35rem .6rem;text-transform:uppercase;}
  .loc .lbody{padding:1.8rem;}
  .loc h3{font-family:'Anton',sans-serif;text-transform:uppercase;font-size:clamp(1.4rem,2.8vw,2.1rem);line-height:1.05;}
  .loc .lsub{font-family:'IBM Plex Mono',monospace;font-size:.62rem;letter-spacing:.2em;color:var(--faint);
    text-transform:uppercase;margin-top:.5rem;display:block;}
  .loc .lrows{margin-top:1.3rem;display:flex;flex-direction:column;gap:.75rem;}
  .loc .lrow{display:flex;gap:.9rem;align-items:baseline;font-family:'IBM Plex Mono',monospace;font-size:.72rem;letter-spacing:.08em;}
  .loc .lrow span{color:var(--faint);text-transform:uppercase;font-size:.6rem;letter-spacing:.2em;min-width:62px;}
  .loc .lrow a{color:var(--mist);text-decoration:none;border-bottom:1px solid var(--line);padding-bottom:2px;transition:.2s;}
  .loc .lrow a:hover{color:var(--pale);border-color:var(--aqua);}

  /* STORIES list (single-column news list) */
  .slist{max-width:1240px;margin:0 auto;padding:0 2rem 7rem;}
  .sitem{display:grid;grid-template-columns:150px 1fr 200px;gap:2.5rem;align-items:center;
    border-top:1px solid var(--line);padding:2.2rem 0;text-decoration:none;transition:background .25s;position:relative;}
  .sitem:last-child{border-bottom:1px solid var(--line);}
  .sitem::after{content:'';position:absolute;left:0;right:0;top:-1px;height:2px;background:var(--grad);
    transform:scaleX(0);transform-origin:left;transition:transform .45s cubic-bezier(.7,0,.2,1);}
  .sitem:hover::after{transform:scaleX(1);}
  .sitem .sdate{font-family:'IBM Plex Mono',monospace;font-size:.64rem;letter-spacing:.16em;color:var(--faint);text-transform:uppercase;line-height:1.9;}
  .sitem .sdate b{color:var(--aqua);font-weight:500;display:block;}
  .sitem h3{font-family:'Anton',sans-serif;text-transform:uppercase;font-size:clamp(1.4rem,3vw,2.4rem);color:var(--white);line-height:1.08;transition:color .2s;}
  .sitem:hover h3{color:var(--pale);}
  .sitem p{color:var(--faint);font-size:.88rem;line-height:1.6;margin-top:.6rem;max-width:640px;}
  .sitem .sthumb{aspect-ratio:16/10;background-size:cover;background-position:center;border:1px solid var(--line);
    filter:saturate(.85);transition:filter .3s,transform .3s;}
  .sitem:hover .sthumb{filter:saturate(1.05);transform:scale(1.02);}
  .sitem .sthumb.ph{display:flex;align-items:center;justify-content:center;background:var(--ink2);}
  .sitem .sthumb.ph::after{content:'IMAGE TO COME';font-family:'IBM Plex Mono',monospace;font-size:.55rem;letter-spacing:.2em;color:var(--faint);}
  @media(max-width:820px){.sitem{grid-template-columns:1fr;gap:1rem;}}

  /* POST (article) */
  .post-banner{height:56vh;min-height:340px;background-size:cover;background-position:center;position:relative;
    filter:saturate(.9);}
  .post-banner::after{content:'';position:absolute;inset:0;background:linear-gradient(to bottom,rgba(4,9,15,.35),rgba(4,9,15,.05) 40%,rgba(4,9,15,.9));}
  .post-head{max-width:820px;margin:-4.5rem auto 0;position:relative;z-index:2;text-align:center;padding:0 2rem;}
  .post-head .pdate{font-family:'IBM Plex Mono',monospace;font-size:.64rem;letter-spacing:.24em;color:var(--aqua);text-transform:uppercase;}
  .post-head h1{font-family:'Anton',sans-serif;text-transform:uppercase;font-size:clamp(2.2rem,5.6vw,4.6rem);line-height:1;margin:.9rem 0 1.4rem;}
  .post-share{display:flex;gap:1.6rem;justify-content:center;font-family:'IBM Plex Mono',monospace;font-size:.6rem;letter-spacing:.2em;text-transform:uppercase;}
  .post-share a{color:var(--faint);text-decoration:none;border-bottom:1px solid var(--line);padding-bottom:2px;transition:.2s;}
  .post-share a:hover{color:var(--pale);border-color:var(--aqua);}
  .post-body{max-width:680px;margin:0 auto;padding:3.5rem 2rem 4rem;}
  .post-body p{color:var(--mist);line-height:1.85;font-size:1.02rem;margin-bottom:1.6rem;}
  .post-body p b{color:var(--white);}
  .post-body .plead{font-size:1.18rem;color:var(--white);}
  .post-pull{border-left:2px solid var(--aqua);padding:.4rem 0 .4rem 1.6rem;margin:2.4rem 0;
    font-family:'Anton',sans-serif;text-transform:uppercase;font-size:1.5rem;line-height:1.25;color:var(--white);}
  .post-fig{max-width:980px;margin:1rem auto 3rem;padding:0 2rem;}
  .post-fig img{width:100%;display:block;border:1px solid var(--line);}
  .post-fig figcaption{font-family:'IBM Plex Mono',monospace;font-size:.6rem;letter-spacing:.18em;color:var(--faint);
    text-transform:uppercase;padding-top:.7rem;}
  .post-related{max-width:1240px;margin:0 auto;padding:0 2rem 6rem;}
  .post-related h4{font-family:'IBM Plex Mono',monospace;font-size:.66rem;letter-spacing:.24em;color:var(--aqua);text-transform:uppercase;margin-bottom:1.6rem;}
  .post-related .rgrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:1.4rem;}


  /* WORK v7 — slim panels, filters, hover video+meta */
  .whead{padding:8rem 2rem 1.6rem;max-width:1500px;margin:0 auto;display:flex;justify-content:space-between;align-items:flex-end;gap:2rem;flex-wrap:wrap;}
  .whead h2{font-family:'Anton',sans-serif;text-transform:uppercase;font-size:clamp(2rem,4.4vw,3.6rem);line-height:.96;margin-top:.8rem;}
  .wfilter{display:flex;gap:.6rem;flex-wrap:wrap;}
  .wfilter button{font-family:'IBM Plex Mono',monospace;font-size:.62rem;letter-spacing:.16em;text-transform:uppercase;
    color:var(--mist);background:transparent;border:1px solid var(--line);padding:.62rem .95rem;cursor:pointer;
    transition:color .2s,border-color .2s,background .2s;}
  .wfilter button:hover{border-color:var(--aqua);color:var(--pale);}
  .wfilter button.active{background:var(--aqua);border-color:var(--aqua);color:var(--ink);}
  .film.slim{height:27vh;min-height:210px;max-height:340px;border-top:1px solid var(--line);
    transition:height .5s cubic-bezier(.7,0,.2,1),min-height .5s,opacity .4s;overflow:hidden;}
  .film.slim.hide{height:0;min-height:0;opacity:0;border-top-width:0;pointer-events:none;}
  .film.slim .idx,.film.slim .dur{top:1.1rem;}
  .film.slim .ft{bottom:1.2rem;transition:opacity .3s;}
  .film.slim .ft h3{font-size:clamp(1.3rem,2.8vw,2.4rem);}
  .film.slim:hover .ft{opacity:0;}
  .film .pvid{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;
    filter:blur(9px) saturate(.85) brightness(.85);transform:scale(1.07);transition:opacity .45s;z-index:1;}
  .film .pvid.on{opacity:0;}
  .film:hover .pvid.on{opacity:1;}
  .film .pgauze{position:absolute;inset:0;z-index:2;opacity:0;transition:opacity .35s;
    background:linear-gradient(to top,rgba(4,9,15,.85),rgba(4,9,15,.2) 55%),rgba(2,60,77,.3);}
  .film .pgauze::after{content:'';position:absolute;inset:0;opacity:.5;
    background-image:radial-gradient(rgba(4,9,15,.85) 1px,transparent 1.4px);background-size:4px 4px;}
  .film:hover .pgauze{opacity:1;}
  .pmeta{position:absolute;left:2rem;bottom:1.2rem;z-index:4;display:flex;flex-direction:column;gap:.3rem;pointer-events:auto;}
  .pmeta .pline{font-family:'IBM Plex Mono',monospace;font-size:.72rem;letter-spacing:.12em;text-transform:uppercase;
    color:var(--white);opacity:0;}
  .film:hover .pmeta .pline{animation:flickOn .5s both;}
  .film:hover .pmeta .pline:nth-child(1){animation-delay:.05s;}
  .film:hover .pmeta .pline:nth-child(2){animation-delay:.16s;}
  .film:hover .pmeta .pline:nth-child(3){animation-delay:.27s;}
  .film:hover .pmeta .pline:nth-child(4){animation-delay:.38s;}
  @keyframes flickOn{0%{opacity:0;}12%{opacity:.9;}20%{opacity:.15;}32%{opacity:.75;}44%{opacity:.25;}60%{opacity:1;}74%{opacity:.6;}100%{opacity:1;}}
  .pmeta .pline b{color:var(--aqua);font-weight:500;margin-right:.5rem;}
  .pmeta .pname .v2{display:none;color:var(--pale);}
  .pmeta .pname:hover .v1{display:none;}
  .pmeta .pname:hover .v2{display:inline;}

  /* PROJECT DETAIL */
  .pj-head{max-width:1240px;margin:0 auto;padding:3.4rem 2rem 0;}
  #page-project .pj-nav{top:0;padding-top:72px;}
  .pj-head .crumb{font-family:'IBM Plex Mono',monospace;font-size:.65rem;letter-spacing:.24em;color:var(--aqua);text-transform:uppercase;}
  .pj-head h2{font-family:'Anton',sans-serif;text-transform:uppercase;font-size:clamp(2.4rem,6vw,5.4rem);line-height:.97;margin:1rem 0;}
  .pj-meta{font-family:'IBM Plex Mono',monospace;font-size:.68rem;letter-spacing:.16em;color:var(--mist);text-transform:uppercase;}
  .pj-meta b{color:var(--aqua);font-weight:500;}
  .pj-desc{max-width:760px;color:var(--mist);line-height:1.75;margin-top:1.8rem;}
  .pgrid{max-width:1400px;margin:3rem auto 0;padding:0 2rem 6rem;display:grid;grid-template-columns:repeat(3,1fr);gap:1rem;}
  @media(max-width:900px){.pgrid{grid-template-columns:repeat(2,1fr);}}
  .pgi{position:relative;aspect-ratio:3/2;overflow:hidden;border:1px solid var(--line);cursor:zoom-in;background:var(--ink2);}
  .pgi.tall{aspect-ratio:2/3;grid-row:span 2;}
  .pgi.wide{grid-column:span 2;aspect-ratio:16/8.4;}
  .pgi img{width:100%;height:100%;object-fit:cover;display:block;filter:saturate(.9);
    transition:transform .6s cubic-bezier(.2,.6,.2,1),filter .3s;}
  .pgi:hover img{transform:scale(1.04);filter:saturate(1.05);}
  .pgi .vbadge{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;z-index:2;background:rgba(4,9,15,.25);}
  .pgi .vbadge::after{content:'';width:58px;height:58px;border:1px solid rgba(237,244,246,.7);border-radius:50%;
    background:rgba(4,9,15,.4) no-repeat center/0;backdrop-filter:blur(3px);}
  .pgi .vbadge::before{content:'';position:absolute;border-left:13px solid var(--white);border-top:8px solid transparent;border-bottom:8px solid transparent;margin-left:4px;z-index:3;}
  .pgi .ptag{position:absolute;left:.8rem;bottom:.7rem;z-index:3;font-family:'IBM Plex Mono',monospace;font-size:.55rem;
    letter-spacing:.18em;color:var(--mist);text-transform:uppercase;background:rgba(4,9,15,.6);padding:.3rem .5rem;}

  /* PROJECT SUBNAV */
  .pj-nav{position:sticky;top:72px;z-index:40;background:rgba(4,9,15,.86);backdrop-filter:blur(8px);
    border-bottom:1px solid var(--line);}
  .pj-nav .in{max-width:1400px;margin:0 auto;padding:.85rem 2rem;display:flex;justify-content:space-between;align-items:center;gap:1.5rem;}
  .pj-nav a{font-family:'IBM Plex Mono',monospace;font-size:.64rem;letter-spacing:.2em;text-transform:uppercase;
    color:var(--faint);text-decoration:none;transition:color .2s;display:inline-flex;align-items:center;gap:.5rem;}
  .pj-nav a:hover{color:var(--pale);}
  .pj-nav .mid{display:flex;gap:1.4rem;flex-wrap:wrap;justify-content:center;}
  .pj-nav .mid a.cur{color:var(--aqua);}
  .pj-nav .mid a.cur::before{content:'';width:5px;height:5px;background:var(--aqua);border-radius:50%;}
  @media(max-width:820px){.pj-nav .mid{display:none;}}

  /* JOURNEY multi-media frame */
  .tl-media{position:relative;aspect-ratio:4/3;background:var(--ink2);border:1px solid var(--line);overflow:hidden;cursor:zoom-in;}
  .tl-media .slide{position:absolute;inset:0;opacity:0;transition:opacity .6s;}
  .tl-media .slide.on{opacity:1;}
  .tl-media .slide img,.tl-media .slide video{width:100%;height:100%;object-fit:cover;display:block;filter:saturate(.9);
    object-position:center 30%;}
  /* per-image framing so faces are never cropped */
  .tl-media img[src*="e2_dad_boys"]{object-fit:contain;background:var(--ink);}
  .tl-media img[src*="e2_family_spence"]{object-position:center 22%;}
  .tl-media img[src*="e2_karla_campaign"]{object-position:center 18%;}
  .tl-media img[src*="e3_prom"]{object-position:center 15%;}
  .tl-media img[src*="e3_austin85"]{object-position:center 25%;}
  .tl-media img[src*="e1_karla_jason"]{object-position:center 18%;}
  .tl-media img[src*="e5_couple"]{object-position:center 25%;}
  .tl-media img[src*="e6_kes_reading"]{object-position:center 25%;}
  .tl-media img[src*="e6_kes_baby"]{object-position:center 25%;}
  .tl-media .empty{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;
    font-family:'IBM Plex Mono',monospace;font-size:.6rem;letter-spacing:.22em;color:var(--faint);text-transform:uppercase;text-align:center;padding:1rem;}
  .tl-media .tnav{position:absolute;top:50%;transform:translateY(-50%);width:34px;height:44px;z-index:3;
    background:rgba(4,9,15,.6);border:1px solid var(--line);color:var(--white);display:flex;align-items:center;justify-content:center;
    opacity:0;transition:opacity .25s,border-color .2s;cursor:pointer;font-size:.9rem;}
  .tl-media:hover .tnav{opacity:1;}
  .tl-media .tnav:hover{border-color:var(--aqua);}
  .tl-media .tprev{left:.5rem;} .tl-media .tnext{right:.5rem;}
  .tl-media .tcount{position:absolute;right:.6rem;bottom:.5rem;z-index:3;font-family:'IBM Plex Mono',monospace;
    font-size:.55rem;letter-spacing:.18em;color:var(--mist);background:rgba(4,9,15,.7);padding:.25rem .5rem;}
  .tl-media .vflag{position:absolute;left:.6rem;bottom:.5rem;z-index:3;font-family:'IBM Plex Mono',monospace;
    font-size:.55rem;letter-spacing:.18em;color:var(--aqua);background:rgba(4,9,15,.7);padding:.25rem .5rem;}
  .tl-dots{display:flex;gap:.3rem;position:absolute;left:.6rem;top:.6rem;z-index:3;}
  .tl-dots i{width:14px;height:2px;background:rgba(157,183,190,.35);display:block;transition:background .3s;}
  .tl-dots i.on{background:var(--aqua);}

  .credits-line{font-family:'IBM Plex Mono',monospace;font-size:.62rem;letter-spacing:.16em;color:var(--faint);
    text-transform:uppercase;margin-top:1.6rem;border-top:1px solid var(--line);padding-top:1.1rem;line-height:1.9;}
  #lbox .lmedia iframe{border:1px solid var(--line);}

  .film.noimg .bg{background:
      radial-gradient(circle at 30% 40%,rgba(47,163,154,.20),transparent 60%),
      repeating-linear-gradient(90deg,rgba(45,90,110,.14) 0 1px,transparent 1px 40px),var(--ink2)!important;}
  .film.noimg::after{content:'POSTER FRAME TO COME';position:absolute;right:2rem;top:50%;transform:translateY(-50%);
    font-family:'IBM Plex Mono',monospace;font-size:.55rem;letter-spacing:.2em;color:var(--faint);z-index:3;}
  .pgi.noimg{background:
      radial-gradient(circle at 50% 40%,rgba(47,163,154,.18),transparent 65%),var(--ink2);}
  .pgi.noimg img{opacity:0;}

  /* LIGHTBOX */
  #lbox{position:fixed;inset:0;z-index:400;background:rgba(2,5,9,.94);backdrop-filter:blur(8px);
    display:none;align-items:center;justify-content:center;}
  #lbox.on{display:flex;}
  #lbox .lmedia{max-width:86vw;max-height:82vh;display:flex;align-items:center;justify-content:center;}
  #lbox .lmedia img,#lbox .lmedia video{max-width:86vw;max-height:82vh;object-fit:contain;border:1px solid var(--line);}
  #lbox .lnav{position:fixed;top:50%;transform:translateY(-50%);width:58px;height:58px;border:1px solid var(--line);
    background:rgba(7,16,25,.7);color:var(--white);display:flex;align-items:center;justify-content:center;cursor:pointer;
    font-size:1.3rem;transition:border-color .2s,background .2s;z-index:402;user-select:none;}
  #lbox .lnav:hover{border-color:var(--aqua);background:rgba(2,60,77,.5);}
  #lbox .lprev{left:1.2rem;}
  #lbox .lnext{right:1.2rem;}
  #lbox .lclose{position:fixed;top:1.2rem;right:1.2rem;width:52px;height:52px;border:1px solid var(--line);
    background:rgba(7,16,25,.7);color:var(--white);display:flex;align-items:center;justify-content:center;cursor:pointer;font-size:1.1rem;z-index:402;}
  #lbox .lclose:hover{border-color:var(--aqua);}
  #lbox .lcount{position:fixed;bottom:1.4rem;left:50%;transform:translateX(-50%);
    font-family:'IBM Plex Mono',monospace;font-size:.66rem;letter-spacing:.24em;color:var(--mist);z-index:402;}

  /* ABOUT */
  .about-wrap{max-width:1440px;margin:0 auto;padding:0 2rem 7rem;display:grid;grid-template-columns:1.3fr 1fr;gap:4rem;}
  @media(max-width:900px){.about-wrap{grid-template-columns:1fr;}}
  .about-wrap .pull{font-family:'Anton',sans-serif;text-transform:uppercase;font-size:clamp(1.9rem,4.4vw,3.8rem);line-height:1.06;}
  .about-wrap .pull em{font-style:normal;background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent;}
  .about-copy p{color:var(--mist);line-height:1.75;margin-bottom:1.2rem;font-size:.98rem;}
  .about-copy p b{color:var(--white);}
  .cred{margin-top:2rem;border-top:1px solid var(--line);padding-top:1.2rem;font-family:'IBM Plex Mono',monospace;
    font-size:.66rem;letter-spacing:.14em;color:var(--faint);line-height:2.1;text-transform:uppercase;}
  .cred b{color:var(--mist);font-weight:500;}

  /* STORIES */
  .stories{max-width:1440px;margin:0 auto;padding:0 2rem 7rem;display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:1.4rem;}
  .story{border:1px solid var(--line);padding:2rem;text-decoration:none;background:var(--ink2);
    transition:border-color .25s,transform .25s;position:relative;overflow:hidden;}
  .story::after{content:'';position:absolute;left:0;right:0;bottom:0;height:2px;background:var(--grad);transform:scaleX(0);transform-origin:left;transition:transform .4s;}
  .story:hover{border-color:rgba(47,163,154,.5);transform:translateY(-3px);}
  .story:hover::after{transform:scaleX(1);}
  .story .stamp{font-family:'IBM Plex Mono',monospace;font-size:.6rem;letter-spacing:.2em;color:var(--aqua);text-transform:uppercase;}
  .story h3{font-family:'Anton',sans-serif;text-transform:uppercase;font-size:1.6rem;margin:.9rem 0;line-height:1.12;color:var(--white);}
  .story p{color:var(--faint);font-size:.86rem;line-height:1.65;}

  /* CONTACT */
  .contact-wrap{max-width:1440px;margin:0 auto;padding:0 2rem 8rem;}
  .contact-wrap h2{font-family:'Anton',sans-serif;text-transform:uppercase;font-size:clamp(2.6rem,7.6vw,6.8rem);line-height:.97;}
  .contact-wrap h2 span{background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent;}
  .contact-lines{margin-top:3rem;display:flex;flex-wrap:wrap;gap:3rem;font-family:'IBM Plex Mono',monospace;font-size:.8rem;letter-spacing:.08em;}
  .contact-lines .lbl{display:block;color:var(--faint);font-size:.6rem;text-transform:uppercase;letter-spacing:.22em;margin-bottom:.5rem;}
  .contact-lines a{color:var(--mist);text-decoration:none;border-bottom:1px solid var(--line);padding-bottom:3px;transition:.2s;}
  .contact-lines a:hover{color:var(--pale);border-color:var(--aqua);}
  .contact-btns{margin-top:3rem;display:flex;gap:1rem;flex-wrap:wrap;}

  footer{position:relative;z-index:5;background:var(--ink);border-top:1px solid var(--line);padding:1.6rem 2rem;
    display:flex;justify-content:space-between;align-items:center;font-family:'IBM Plex Mono',monospace;
    font-size:.6rem;letter-spacing:.16em;color:var(--faint);text-transform:uppercase;flex-wrap:wrap;gap:1rem;}
  footer .fm{display:flex;align-items:center;gap:.6rem;}
  footer svg{width:20px;height:20px;opacity:.7;}

  .proto-banner{position:fixed;bottom:0;left:50%;transform:translateX(-50%);z-index:70;background:var(--aqua);color:var(--ink);
    font-family:'IBM Plex Mono',monospace;font-size:.58rem;letter-spacing:.14em;text-transform:uppercase;padding:.32rem .9rem;}

  /* ---- multi-page additions ---- */
  .nojs-hide{display:none;}
  a.plain{color:inherit;text-decoration:none;}
  .backlink{font-family:'IBM Plex Mono',monospace;font-size:.64rem;letter-spacing:.2em;color:var(--faint);text-decoration:none;}
  .backlink:hover{color:var(--pale);}
  .vimeo-wrap{position:relative;width:100%;aspect-ratio:16/9;background:var(--ink2);border:1px solid var(--line);}
  .vimeo-wrap iframe{position:absolute;inset:0;width:100%;height:100%;border:0;}
  .pj-films{max-width:1240px;margin:0 auto;padding:0 2rem 1rem;display:flex;flex-direction:column;gap:2.2rem;}
  .pj-films figcaption{font-family:'IBM Plex Mono',monospace;font-size:.62rem;letter-spacing:.18em;color:var(--faint);
    text-transform:uppercase;padding-top:.7rem;}

/* ---------- showreel lightbox ---------- */
.vbox{position:fixed;inset:0;z-index:900;display:flex;align-items:center;justify-content:center;
  background:rgba(2,5,9,.92);backdrop-filter:blur(14px);opacity:0;transition:opacity .3s ease;}
.vbox.on{opacity:1;}
.vbox .vframe{position:relative;width:min(92vw,1360px);aspect-ratio:16/9;
  transform:scale(.97);transition:transform .35s cubic-bezier(.16,1,.3,1);
  box-shadow:0 40px 120px rgba(0,0,0,.7);border:1px solid rgba(47,163,154,.28);}
.vbox.on .vframe{transform:scale(1);}
.vbox iframe{position:absolute;inset:0;width:100%;height:100%;border:0;}
.vbox .vclose{position:absolute;top:1.1rem;right:1.4rem;z-index:2;background:none;border:0;cursor:pointer;
  color:#9DB7BE;font-size:2.4rem;line-height:1;padding:.2rem .6rem;transition:color .2s;}
.vbox .vclose:hover{color:#2FA39A;}
@media(max-width:640px){.vbox .vframe{width:96vw;}.vbox .vclose{top:.4rem;right:.6rem;}}
