:root{
  --bg:#050505;
  --panel:#0b0b0d;
  --text:#f5f5f2;
  --muted:#999;
  --pink:#ff2bc2;
  --purple:#8d3cff;
  --cyan:#20e7ff;
  --line:#26262a;
}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  background:var(--bg);
  color:var(--text);
  font-family:Arial, Helvetica, sans-serif;
  overflow-x:hidden;
}

body::selection{background:var(--pink);color:#000}

.noise{
  position:fixed;
  inset:0;
  pointer-events:none;
  opacity:.06;
  z-index:99;
  background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.7'/%3E%3C/svg%3E");
}

.cursor-glow{
  position:fixed;
  width:280px;
  height:280px;
  border-radius:50%;
  pointer-events:none;
  transform:translate(-50%,-50%);
  background:radial-gradient(circle,rgba(255,43,194,.16),rgba(32,231,255,.05) 40%,transparent 72%);
  filter:blur(4px);
  z-index:2;
}

.site-header{
  position:fixed;
  top:0;
  left:0;
  width:100%;
  padding:22px 32px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  z-index:20;
  mix-blend-mode:difference;
}

.brand{
  color:white;
  text-decoration:none;
  font-weight:900;
  letter-spacing:-.04em;
  font-size:1.45rem;
}
.brand span{font-weight:400;letter-spacing:.12em;font-size:.7rem;margin-left:6px}

nav{display:flex;gap:26px}
nav a{
  color:white;
  text-decoration:none;
  font-size:.72rem;
  letter-spacing:.16em;
  position:relative;
}
nav a::after{
  content:"";
  position:absolute;
  left:0;right:100%;bottom:-5px;
  height:1px;background:white;
  transition:.25s ease;
}
nav a:hover::after{right:0}

.hero{
  min-height:100svh;
  position:relative;
  display:flex;
  align-items:flex-end;
  padding:120px 7vw 8vh;
  overflow:hidden;
}

.hero-video{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:cover;
  opacity:.42;
  filter:saturate(1.15) contrast(1.15);
  transform:scale(1.06);
}

.hero-overlay{
  position:absolute;
  inset:0;
  background:
    linear-gradient(90deg,rgba(5,5,5,.95) 0%,rgba(5,5,5,.58) 45%,rgba(5,5,5,.18) 100%),
    linear-gradient(0deg,rgba(5,5,5,.9) 0%,transparent 50%);
}

.hero-content{position:relative;z-index:3;max-width:1050px}
.eyebrow,.section-label,.section-head>p{
  font-size:.7rem;
  letter-spacing:.22em;
  color:#cfcfcf;
  margin:0 0 20px;
}

h1{
  margin:0;
  font-size:clamp(4rem,10vw,9.6rem);
  line-height:.78;
  letter-spacing:-.075em;
  text-transform:uppercase;
}
h1 .line{display:block}
.outline{
  color:transparent;
  -webkit-text-stroke:1.5px rgba(255,255,255,.8);
}

.glitch{
  position:relative;
  display:inline-block;
  text-shadow:2px 0 var(--pink),-2px 0 var(--cyan);
}

.glitch::before,.glitch::after{
  content:attr(data-text);
  position:absolute;
  inset:0;
  pointer-events:none;
  opacity:0;
}
.glitch:hover::before{
  opacity:.7;
  color:var(--pink);
  transform:translate(5px,-2px);
  clip-path:inset(0 0 55% 0);
}
.glitch:hover::after{
  opacity:.7;
  color:var(--cyan);
  transform:translate(-5px,2px);
  clip-path:inset(55% 0 0 0);
}

.intro{
  max-width:650px;
  color:#c6c6c6;
  font-size:clamp(1rem,1.5vw,1.35rem);
  line-height:1.5;
  margin:34px 0;
}

.cta{
  display:inline-flex;
  gap:18px;
  color:white;
  text-decoration:none;
  font-size:.82rem;
  letter-spacing:.15em;
  border-bottom:1px solid #fff;
  padding:0 0 9px;
}
.cta span{transition:transform .2s}
.cta:hover span{transform:translateY(5px)}

.hero-tag{
  position:absolute;
  right:28px;
  bottom:34px;
  z-index:3;
  transform:rotate(90deg) translateY(-100%);
  transform-origin:right bottom;
  font-size:.62rem;
  letter-spacing:.22em;
  color:#bcbcbc;
}

.section{
  padding:110px 7vw;
  border-top:1px solid var(--line);
}

.section-head{
  display:flex;
  justify-content:space-between;
  gap:40px;
  align-items:flex-start;
  margin-bottom:65px;
}

.section-head h2,.contact h2{
  font-size:clamp(2.6rem,6vw,6.2rem);
  line-height:.92;
  letter-spacing:-.055em;
  margin:0;
  max-width:900px;
}

.project-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:24px;
}
.project.featured{grid-column:1/-1}

.project{
  border:1px solid var(--line);
  background:var(--panel);
  overflow:hidden;
  transition:transform .3s ease,border-color .3s ease;
}
.project:hover{
  transform:translateY(-6px);
  border-color:#505057;
}

.project-visual{
  height:360px;
  position:relative;
  overflow:hidden;
}
.featured .project-visual{height:520px}

.project-visual::after{
  content:"";
  position:absolute;inset:0;
  background:linear-gradient(135deg,transparent 20%,rgba(255,255,255,.05),transparent 70%);
  transform:translateX(-100%);
  transition:transform .7s ease;
}
.project:hover .project-visual::after{transform:translateX(100%)}

.urban{
  background:
    radial-gradient(circle at 72% 42%,rgba(32,231,255,.85),transparent 15%),
    radial-gradient(circle at 25% 60%,rgba(255,43,194,.9),transparent 20%),
    linear-gradient(135deg,#111,#18102b 45%,#091f22);
}
.luupe{
  background:
    repeating-linear-gradient(90deg,transparent 0 28px,rgba(255,255,255,.035) 28px 29px),
    linear-gradient(135deg,#101010,#27102a 48%,#111);
}
.lab{
  background:
    radial-gradient(circle at center,rgba(141,60,255,.75),transparent 24%),
    linear-gradient(45deg,#071012,#170918);
}

.project-info{padding:26px}
.project-info span{
  font-size:.62rem;
  letter-spacing:.18em;
  color:#8e8e93;
}
.project-info h3{
  font-size:2.2rem;
  margin:10px 0 8px;
  letter-spacing:-.045em;
}
.project-info p{
  max-width:640px;
  color:#aaa;
  margin:0;
  line-height:1.5;
}

.split-section{
  display:grid;
  grid-template-columns:1fr 2fr;
  gap:70px;
}
.big-copy p{
  font-size:clamp(2rem,4.2vw,4.8rem);
  line-height:1.02;
  letter-spacing:-.05em;
  margin:0;
}
.big-copy .muted{
  margin-top:46px;
  color:#777;
  font-size:clamp(1.25rem,2vw,2rem);
  line-height:1.2;
}

.contact{min-height:70vh;display:flex;flex-direction:column;justify-content:center}
.contact h2 span{
  background:linear-gradient(90deg,var(--pink),var(--purple),var(--cyan));
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent;
}
.contact-link{
  margin-top:46px;
  width:max-content;
  color:white;
  font-size:clamp(1.25rem,2vw,2rem);
  text-decoration:none;
  border-bottom:1px solid #555;
  padding-bottom:6px;
}
.tiny-note{color:#666;font-size:.72rem;margin-top:12px}

footer{
  border-top:1px solid var(--line);
  padding:28px 7vw;
  display:flex;
  justify-content:space-between;
  font-size:.63rem;
  letter-spacing:.15em;
  color:#777;
}

@media (max-width:760px){
  .site-header{padding:18px 18px}
  nav{gap:14px}
  nav a{font-size:.58rem}
  .hero{padding:110px 20px 46px}
  .hero-tag{display:none}
  .section{padding:80px 20px}
  .section-head{display:block}
  .section-head h2{margin-top:24px}
  .project-grid{grid-template-columns:1fr}
  .project.featured{grid-column:auto}
  .project-visual,.featured .project-visual{height:300px}
  .split-section{grid-template-columns:1fr;gap:25px}
  footer{padding:26px 20px;gap:20px;flex-direction:column}
}

@media (prefers-reduced-motion:reduce){
  *{scroll-behavior:auto!important;transition:none!important}
}


/* v1.1: mobile menu only */
.luupe-mobile-menu-btn{
  display:none;
  border:1px solid rgba(255,255,255,.45);
  background:rgba(5,5,5,.5);
  color:#fff;
  padding:9px 11px;
  font-size:.62rem;
  letter-spacing:.12em;
  cursor:pointer;
}
.luupe-mobile-drawer{
  position:fixed;
  inset:0;
  z-index:250;
  background:rgba(4,4,5,.985);
  transform:translateX(100%);
  transition:transform .28s ease;
  display:flex;
  flex-direction:column;
  justify-content:center;
  padding:28px;
}
.luupe-mobile-drawer.open{transform:translateX(0)}
.luupe-drawer-close{
  position:absolute;
  top:18px;
  right:20px;
  border:0;
  background:none;
  color:#fff;
  font-size:2.5rem;
  cursor:pointer;
}
.luupe-drawer-links{
  display:flex;
  flex-direction:column;
  gap:18px;
}
.luupe-drawer-links a{
  color:#fff;
  text-decoration:none;
  font-size:clamp(3.2rem,16vw,6.2rem);
  font-weight:900;
  line-height:.82;
  letter-spacing:-.06em;
}
.luupe-drawer-links a:nth-child(1){text-shadow:3px 0 var(--pink),-3px 0 var(--cyan)}
.luupe-drawer-links a:nth-child(2){color:transparent;-webkit-text-stroke:1.5px #fff}
.luupe-drawer-links a:nth-child(3){
  background:linear-gradient(90deg,var(--pink),var(--purple),var(--cyan));
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent;
}
.luupe-drawer-credit{
  margin-top:42px;
  color:#686868;
  font-size:.62rem;
  letter-spacing:.18em;
}
body.luupe-menu-open{overflow:hidden}
@media(max-width:760px){
  .site-header nav{display:none}
  .luupe-mobile-menu-btn{display:block}
}


/* ===== v1.2 approved content + mobile fit ===== */
.work-cta-wrap{
  margin-top:42px;
  display:flex;
  justify-content:flex-end;
}
.work-cta{font-size:.78rem}
.contact-pending{
  cursor:default;
  color:#d7d7d7;
  border-bottom-color:#444;
  line-height:1.35;
}
@media(max-width:760px){
  /* Keep all hero words inside narrow phone screens. */
  h1{
    font-size:clamp(3.15rem,16vw,5.4rem);
    letter-spacing:-.065em;
    max-width:100%;
  }
  h1 .line{
    width:100%;
    white-space:nowrap;
  }
  h1 .outline{
    font-size:.91em;
    letter-spacing:-.075em;
  }

  /* Extra protection for other large text. */
  .section-head h2,.contact h2{
    font-size:clamp(2.55rem,12.5vw,4.6rem);
    overflow-wrap:anywhere;
  }
  .big-copy p{
    font-size:clamp(1.9rem,9vw,3.5rem);
  }

  .work-cta-wrap{
    justify-content:flex-start;
    margin-top:34px;
  }
  .contact-link{
    width:auto;
    max-width:100%;
    font-size:clamp(1.05rem,5vw,1.45rem);
    overflow-wrap:anywhere;
  }

  footer{
    align-items:flex-start;
  }
}


/* ===== v1.3 completion pass ===== */
.skip-link{
  position:fixed;
  left:12px;
  top:12px;
  z-index:500;
  transform:translateY(-160%);
  background:#fff;
  color:#000;
  padding:10px 12px;
  text-decoration:none;
  font-size:.7rem;
  font-weight:800;
  letter-spacing:.08em;
}
.skip-link:focus{transform:translateY(0)}

.capabilities{
  border-top:1px solid rgba(255,255,255,.12);
  border-bottom:1px solid rgba(255,255,255,.12);
  padding:22px 4vw;
  display:grid;
  grid-template-columns:minmax(130px,.5fr) 2fr;
  gap:24px;
  align-items:start;
}
.capabilities-label{
  margin:0;
  color:#777;
  font-size:.66rem;
  letter-spacing:.18em;
}
.capability-list{
  display:flex;
  flex-wrap:wrap;
  gap:9px;
}
.capability-list span{
  border:1px solid rgba(255,255,255,.18);
  padding:8px 10px;
  font-size:.67rem;
  letter-spacing:.09em;
  line-height:1;
}

.footer-domain{
  color:inherit;
  text-decoration:none;
}
.footer-domain:hover,
.footer-domain:focus{
  color:#fff;
}

a:focus-visible,
button:focus-visible{
  outline:2px solid currentColor;
  outline-offset:4px;
}

@media(max-width:760px){
  .capabilities{
    grid-template-columns:1fr;
    padding:20px 20px;
    gap:14px;
  }
  .capability-list{
    gap:7px;
  }
  .capability-list span{
    font-size:.62rem;
    padding:7px 8px;
  }

  /* Narrow-screen safety for the main statement and project titles. */
  .project-info h3{
    overflow-wrap:anywhere;
  }
}

@media(max-width:380px){
  h1{
    font-size:clamp(2.85rem,15.2vw,4.7rem);
    letter-spacing:-.075em;
  }
  h1 .outline{
    font-size:.88em;
  }
}

/* Respect device accessibility settings without changing the normal experience. */
@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto !important}
  *,*::before,*::after{
    animation-duration:.01ms !important;
    animation-iteration-count:1 !important;
    transition-duration:.01ms !important;
  }
  .hero-video{display:none}
  .cursor-glow{display:none}
}


/* ===== v1.5 Urban Jungle real case-study visuals ===== */
.project-visual.urban-real{
  background:#090909;
}
.uj-hero-image{
  width:100%;
  height:100%;
  display:block;
  object-fit:cover;
  object-position:center;
  transform:scale(1.01);
  transition:transform .8s ease;
}
.project.featured:hover .uj-hero-image{
  transform:scale(1.045);
}
.uj-hero-shade{
  position:absolute;
  inset:0;
  z-index:1;
  background:
    linear-gradient(90deg,rgba(3,3,5,.78) 0%,rgba(3,3,5,.32) 42%,rgba(3,3,5,.08) 72%),
    linear-gradient(0deg,rgba(3,3,5,.55) 0%,transparent 48%);
  pointer-events:none;
}
.uj-project-logo{
  position:absolute;
  z-index:2;
  left:clamp(20px,4vw,52px);
  bottom:clamp(22px,4vw,50px);
  width:min(46%,420px);
  max-height:44%;
  object-fit:contain;
  object-position:left bottom;
  filter:drop-shadow(0 8px 24px rgba(0,0,0,.55));
}
.urban-real::after{
  z-index:3;
}

.uj-showcase{
  margin-top:28px;
  padding-top:22px;
  border-top:1px solid rgba(255,255,255,.12);
}
.uj-showcase-head{
  display:flex;
  justify-content:space-between;
  gap:18px;
  margin-bottom:12px;
  color:#777;
  font-size:.58rem;
  letter-spacing:.16em;
}
.uj-visual-grid{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:10px;
}
.uj-visual-grid figure{
  margin:0;
  min-width:0;
  aspect-ratio:1/1;
  overflow:hidden;
  background:#080808;
  border:1px solid rgba(255,255,255,.1);
}
.uj-visual-grid img{
  display:block;
  width:100%;
  height:100%;
  object-fit:cover;
  transition:transform .5s ease,filter .5s ease;
}
.uj-visual-grid figure:hover img{
  transform:scale(1.055);
}

@media(max-width:760px){
  .uj-project-logo{
    width:min(66%,300px);
    left:18px;
    bottom:18px;
  }
  .uj-hero-shade{
    background:
      linear-gradient(90deg,rgba(3,3,5,.68),rgba(3,3,5,.12)),
      linear-gradient(0deg,rgba(3,3,5,.58),transparent 55%);
  }
  .uj-showcase-head{
    flex-direction:column;
    gap:4px;
  }
  .uj-visual-grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:8px;
  }
}

@media(prefers-reduced-motion:reduce){
  .uj-hero-image,
  .uj-visual-grid img{
    transition:none !important;
    transform:none !important;
  }
}


/* ===== v1.6 hero fixes ===== */

/* WITHOUT now glitches automatically, not only on mouse hover. */
.glitch{
  position:relative;
  isolation:isolate;
  animation:luupe-glitch-base 4.8s steps(1,end) infinite;
}
.glitch::before,
.glitch::after{
  opacity:0;
  display:block;
}
.glitch::before{
  animation:luupe-glitch-pink 4.8s steps(1,end) infinite;
}
.glitch::after{
  animation:luupe-glitch-cyan 4.8s steps(1,end) infinite;
}

@keyframes luupe-glitch-base{
  0%,78%,82%,86%,100%{transform:translate(0)}
  79%{transform:translate(-1px,0)}
  80%{transform:translate(2px,0)}
  81%{transform:translate(0)}
  83%{transform:translate(1px,-1px)}
  84%{transform:translate(-1px,1px)}
  85%{transform:translate(0)}
}
@keyframes luupe-glitch-pink{
  0%,77%,82%,86%,100%{
    opacity:0;
    transform:translate(0);
    clip-path:inset(0 0 100% 0);
  }
  78%{
    opacity:.78;
    color:var(--pink);
    transform:translate(5px,-2px);
    clip-path:inset(4% 0 60% 0);
  }
  79%{
    opacity:.62;
    color:var(--pink);
    transform:translate(-3px,1px);
    clip-path:inset(45% 0 25% 0);
  }
  80%{opacity:0}
  83%{
    opacity:.7;
    color:var(--pink);
    transform:translate(4px,0);
    clip-path:inset(66% 0 8% 0);
  }
  84%,85%{opacity:0}
}
@keyframes luupe-glitch-cyan{
  0%,77%,82%,86%,100%{
    opacity:0;
    transform:translate(0);
    clip-path:inset(100% 0 0 0);
  }
  78%{
    opacity:.72;
    color:var(--cyan);
    transform:translate(-5px,2px);
    clip-path:inset(58% 0 4% 0);
  }
  79%{opacity:0}
  80%{
    opacity:.68;
    color:var(--cyan);
    transform:translate(3px,-1px);
    clip-path:inset(22% 0 48% 0);
  }
  81%,83%{opacity:0}
  84%{
    opacity:.74;
    color:var(--cyan);
    transform:translate(-4px,1px);
    clip-path:inset(12% 0 68% 0);
  }
  85%{opacity:0}
}

/* Keep the original hover hit as an extra desktop reaction. */
.glitch:hover::before{
  animation:none;
  opacity:.7;
  color:var(--pink);
  transform:translate(5px,-2px);
  clip-path:inset(0 0 55% 0);
}
.glitch:hover::after{
  animation:none;
  opacity:.7;
  color:var(--cyan);
  transform:translate(-5px,2px);
  clip-path:inset(55% 0 0 0);
}

/* Reduced motion: keep WITHOUT readable and static. */
@media(prefers-reduced-motion:reduce){
  .glitch,
  .glitch::before,
  .glitch::after{
    animation:none !important;
  }
}


/* ===== v1.8 — real LUUPE artist visuals ===== */
.project-visual.luupe-real{
  background:#070707;
}
.luupe-feature-image{
  display:block;
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center;
  transform:scale(1.01);
  transition:transform .8s ease;
}
.luupe-project:hover .luupe-feature-image{
  transform:scale(1.045);
}
.luupe-showcase{
  margin-top:28px;
  padding-top:22px;
  border-top:1px solid rgba(255,255,255,.12);
}
.luupe-showcase-head{
  display:flex;
  justify-content:space-between;
  gap:18px;
  margin-bottom:12px;
  color:#777;
  font-size:.58rem;
  letter-spacing:.16em;
}
.luupe-visual-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:10px;
}
.luupe-visual-grid figure{
  margin:0;
  min-width:0;
  overflow:hidden;
  background:#080808;
  border:1px solid rgba(255,255,255,.1);
}
.luupe-visual-grid img{
  display:block;
  width:100%;
  aspect-ratio:1/1;
  object-fit:cover;
  transition:transform .5s ease;
}
.luupe-visual-grid figure:hover img{
  transform:scale(1.055);
}
.luupe-logo-tile img{
  object-fit:contain;
  padding:9%;
  background:linear-gradient(90deg,#111 0%,#777 50%,#eee 100%);
}
.luupe-visual-grid figcaption{
  padding:9px 10px 10px;
  color:#8a8a8a;
  font-size:.55rem;
  letter-spacing:.11em;
  line-height:1.25;
}

@media(max-width:760px){
  .luupe-showcase-head{
    flex-direction:column;
    gap:4px;
  }
  .luupe-visual-grid{
    grid-template-columns:1fr;
    gap:8px;
  }
  .luupe-visual-grid img{
    aspect-ratio:4/3;
  }
}

@media(prefers-reduced-motion:reduce){
  .luupe-feature-image,
  .luupe-visual-grid img{
    transition:none !important;
    transform:none !important;
  }
}


/* ===== v1.9 LUUPE wordmark cleanup ===== */
.luupe-wordmark-heading{
  margin:0;
  line-height:1;
}
.luupe-wordmark-heading img{
  display:block;
  width:min(320px,70%);
  height:auto;
  object-fit:contain;
  filter:drop-shadow(0 6px 18px rgba(0,0,0,.4));
}
.luupe-visual-grid{
  grid-template-columns:repeat(2,minmax(0,1fr));
}
@media(max-width:760px){
  .luupe-wordmark-heading img{
    width:min(260px,78%);
  }
  .luupe-visual-grid{
    grid-template-columns:1fr;
  }
}


/* ===== v1.10 — balanced LUUPE project card ===== */

/* Hide/remove visual influence from the old v1.8/v1.9 gallery styles by
   replacing the card itself with a compact two-panel visual. */
.luupe-dual-visual{
  display:grid;
  grid-template-columns:1fr 1fr;
  background:#060606;
  position:relative;
}

.luupe-art-panel,
.luupe-wordmark-panel{
  min-width:0;
  min-height:0;
  position:relative;
}

.luupe-art-panel{
  display:flex;
  align-items:center;
  justify-content:center;
  background:#050505;
  border-right:1px solid rgba(255,255,255,.10);
}

.luupe-art-panel img{
  width:100%;
  height:100%;
  object-fit:contain;
  object-position:center;
  display:block;
}

.luupe-wordmark-panel{
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:18px;
  padding:28px;
  background:
    radial-gradient(circle at 50% 45%,rgba(255,255,255,.055),transparent 45%),
    #080808;
}

.luupe-wordmark-panel img{
  display:block;
  width:min(92%,420px);
  height:auto;
  object-fit:contain;
  filter:drop-shadow(0 8px 20px rgba(0,0,0,.45));
}

.luupe-wordmark-panel span{
  color:#777;
  font-size:.58rem;
  letter-spacing:.18em;
}

.luupe-text-title{
  font-size:2.2rem;
  margin:10px 0 8px;
  letter-spacing:-.045em;
}

/* Keep the LUUPE and LUUPE LAB cards visually balanced. */
.luupe-project .project-info{
  min-height:148px;
}

@media(max-width:760px){
  .luupe-dual-visual{
    grid-template-columns:1fr 1fr;
  }

  .luupe-wordmark-panel{
    padding:14px;
    gap:11px;
  }

  .luupe-wordmark-panel img{
    width:96%;
  }

  .luupe-wordmark-panel span{
    font-size:.48rem;
    letter-spacing:.12em;
    text-align:center;
  }

  .luupe-project .project-info{
    min-height:0;
  }
}

@media(max-width:380px){
  .luupe-wordmark-panel{
    padding:10px;
  }

  .luupe-wordmark-panel span{
    font-size:.44rem;
  }
}


/* ===== v1.11 Urban Jungle motion tile ===== */
.uj-motion-tile{
  position:relative;
}
.uj-motion-tile video{
  display:block;
  width:100%;
  height:100%;
  object-fit:cover;
}
.uj-motion-tile::after{
  content:"MOTION";
  position:absolute;
  left:8px;
  bottom:8px;
  z-index:2;
  padding:5px 7px;
  background:rgba(0,0,0,.72);
  color:#fff;
  font-size:.48rem;
  letter-spacing:.14em;
  pointer-events:none;
}


/* ===== v1.12 LUUPE LAB motion ===== */
.project-visual.luupe-lab-video{
  background:#050505;
  overflow:hidden;
}
.luupe-lab-video video{
  display:block;
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center;
}
@media(max-width:760px){
  .luupe-lab-video video{
    object-fit:cover;
    object-position:center;
  }
}