/* V7: actual local font loading */
@font-face{
  font-family:'Inter';
  src:url('../assets/fonts/inter-variable.woff2') format('woff2');
  font-style:normal;
  font-weight:100 900;
  font-display:swap;
}
@font-face{
  font-family:'Archivo Black';
  src:url('../assets/fonts/archivo-black-400.woff2') format('woff2');
  font-style:normal;
  font-weight:400;
  font-display:swap;
}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:#fafaf8;color:#111;font-family:Arial,sans-serif}a{color:inherit;text-decoration:none}
#header{height:80px;position:fixed;z-index:20;top:0;left:0;right:0;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;padding:0 3vw;background:rgba(250,250,248,.76);backdrop-filter:blur(24px);-webkit-backdrop-filter:blur(24px);font-size:13px;letter-spacing:.08em}
#header nav{justify-self:end;display:flex;gap:30px}
#header nav a{font-weight:400;opacity:.68;transition:opacity .25s ease,font-weight .25s ease,transform .25s ease}
#header nav a:hover{opacity:1;font-weight:700;transform:translateY(-1px)}
#navName{font-size:18px;opacity:0;transition:opacity .18s ease}#header.docked #navName{opacity:1}
.hero{min-height:420px;padding:175px 20px 42px;text-align:center}.hero h1{margin:0;font-size:28px;letter-spacing:-.03em}.hero p{margin:25px 0 0;font-size:clamp(34px,4vw,64px);letter-spacing:-.05em}
#work{padding:0 3vw 80px;scroll-margin-top:90px}#work h2{text-align:center;font-size:13px;letter-spacing:.18em;margin:0 0 28px}
#grid{display:grid;grid-template-columns:repeat(12,1fr);grid-auto-rows:105px;gap:12px}.card{position:relative;overflow:hidden;border-radius:12px;background:var(--c);grid-column:span 3;grid-row:span 3;transition:filter .5s ease}
.card:before{content:"";position:absolute;inset:0;background:#000;opacity:0;transition:.4s}.card.active:before{opacity:.3}#grid.hovering .card:not(.active){filter:grayscale(1) brightness(.72)}
.info{position:absolute;z-index:2;left:25px;bottom:24px;color:white;opacity:0;transform:translateY(18px);transition:.4s}.active .info{opacity:1;transform:none}.title{font-size:26px;font-weight:800}.meta{font-size:13px;margin-top:7px}
.card:nth-child(1){grid-column:span 3;grid-row:span 5}
.card:nth-child(2){grid-column:span 5;grid-row:span 4}
.card:nth-child(3){grid-column:span 3;grid-row:span 2}
.card:nth-child(4){grid-column:span 1;grid-row:span 2}
.card:nth-child(5){grid-column:4/span 4;grid-row:span 3}
.card:nth-child(6){grid-column:8/span 3;grid-row:span 3}
.card:nth-child(7){grid-column:11/span 2;grid-row:span 3}
.card:nth-child(8){grid-column:1/span 3;grid-row:span 2}
.card:nth-child(9){grid-column:4/span 3;grid-row:span 2}
.card:nth-child(10){grid-column:7/span 4;grid-row:span 2}
.card:nth-child(11){grid-column:11/span 2;grid-row:span 2}
.later{min-height:60vh;border-top:1px solid #ddd;display:grid;place-items:center;color:#777;font-size:12px;letter-spacing:.15em}.dark{background:#171717;color:white}
@media(max-width:700px){#header{height:68px;grid-template-columns:auto 1fr;font-size:10px;padding:0 15px}#navName{display:none}#header nav{gap:13px}.hero{min-height:380px;padding-top:145px}.hero p{font-size:35px}#work{padding-left:10px;padding-right:10px}#grid{grid-template-columns:1fr 1fr;grid-auto-rows:130px;gap:8px}.card,.card:nth-child(n){grid-column:span 1;grid-row:span 2}.card:nth-child(even){grid-row:span 1}.info{opacity:1;transform:none;left:14px;bottom:14px}.card:before{opacity:.18}.title{font-size:17px}.meta{font-size:10px}}
@media(prefers-reduced-motion:reduce){*{transition:none!important}}
.card .title{font-size:clamp(14px,1.7vw,26px);overflow-wrap:anywhere}
.card .meta{font-size:clamp(9px,.85vw,13px);line-height:1.25}
.card:nth-child(4) .info,.card:nth-child(7) .info,.card:nth-child(11) .info{left:10px;right:8px;bottom:12px}
.card:nth-child(4) .title,.card:nth-child(7) .title,.card:nth-child(11) .title{font-size:clamp(11px,1.05vw,16px)}
.card:nth-child(4) .meta,.card:nth-child(7) .meta,.card:nth-child(11) .meta{font-size:9px}

.card.reveal{opacity:0;transform:translateY(26px)}
.card.reveal.in-view{opacity:1;transform:translateY(0);transition:opacity .7s cubic-bezier(.22,1,.36,1),transform .75s cubic-bezier(.22,1,.36,1),filter .5s ease}
.hero h1{will-change:transform,opacity}
@media(prefers-reduced-motion:reduce){.card.reveal{opacity:1!important;transform:none!important}}

/* ABOUT V3 */
.about-section{
  background:#fafaf8;
  color:#111;
  padding:clamp(90px,10vw,150px) clamp(24px,4vw,72px) clamp(110px,12vw,180px);
  scroll-margin-top:80px;
  overflow:hidden;
}
.about-layout{
  max-width:1500px;
  margin:0 auto;
  display:grid;
  grid-template-columns:minmax(0,1.12fr) minmax(320px,.72fr);
  gap:clamp(60px,8vw,140px);
  align-items:start;
}
.about-text{padding-top:8px}
.about-title{
  margin:0 0 clamp(80px,10vw,150px);
  font-size:clamp(3.2rem,6.3vw,7.2rem);
  line-height:.86;
  letter-spacing:-.055em;
  font-weight:850;
  opacity:0;
  transform:translateY(34px);
  will-change:opacity,transform;
}
.about-copy{
  width:min(100%,720px);
  margin-left:auto;
  font-size:clamp(1rem,1.18vw,1.25rem);
  line-height:1.48;
  font-weight:520;
  opacity:0;
  transform:translateY(30px);
  will-change:opacity,transform;
}
.about-copy p{margin:0 0 1.5em}
.about-copy p:last-child{margin-bottom:0}
.about-image{
  position:sticky;
  top:110px;
  transform-origin:center top;
  will-change:transform;
}
.about-image img{
  display:block;
  width:100%;
  height:auto;
  border-radius:22px;
}
@media(max-width:800px){
  .about-section{padding:80px 20px 100px}
  .about-layout{grid-template-columns:1fr;gap:48px}
  .about-title{margin-bottom:55px;font-size:clamp(3rem,14vw,5rem)}
  .about-copy{margin-left:0}
  .about-image{position:relative;top:auto;grid-row:2}
}
@media(prefers-reduced-motion:reduce){
  .about-title,.about-copy{opacity:1!important;transform:none!important}
  .about-image{transform:none!important}
}

/* CONTACT / FOOTER V4 */
.contact-section{
  background:#fafaf8;
  color:#111;
  padding:clamp(90px,10vw,150px) clamp(24px,3.2vw,58px) clamp(34px,4vw,60px);
  scroll-margin-top:80px;
  overflow:hidden;
}
.contact-shell{max-width:1700px;margin:0 auto}
.contact-hit{
  font-size:clamp(5rem,13.5vw,14rem);
  font-weight:900;
  line-height:.78;
  letter-spacing:-.065em;
  color:transparent;
  -webkit-text-stroke:clamp(1.5px,.16vw,3px) #111;
  text-stroke:clamp(1.5px,.16vw,3px) #111;
  white-space:nowrap;
  opacity:0;
  transform:translateY(34px);
  will-change:opacity,transform;
}
.contact-name{
  margin-top:clamp(100px,13vw,210px);
  text-align:right;
  font-size:clamp(4rem,9vw,9.5rem);
  font-weight:900;
  line-height:.82;
  letter-spacing:-.06em;
  opacity:0;
  transform:translateY(28px);
  will-change:opacity,transform;
}
.contact-rule{height:1px;background:rgba(17,17,17,.28);margin:clamp(35px,4vw,55px) 0 clamp(34px,4vw,55px)}
.contact-footer{
  display:grid;
  grid-template-columns:1.15fr 1.3fr 1fr 1fr;
  gap:clamp(28px,5vw,90px);
  align-items:start;
  font-size:clamp(.9rem,1.05vw,1.08rem);
  line-height:1.45;
  font-weight:650;
}
.contact-footer p{margin:0}.contact-footer a{color:inherit;text-decoration:none;transition:opacity .2s ease}.contact-footer a:hover{opacity:.48}
.contact-socials{display:flex;flex-direction:column;align-items:flex-start}
.contact-legal{text-align:right}.contact-legal span{opacity:.45}
@media(max-width:760px){
  .contact-section{padding:85px 20px 36px}
  .contact-hit{font-size:clamp(4rem,20vw,7rem);white-space:normal;line-height:.82}
  .contact-name{margin-top:100px;font-size:clamp(3.6rem,18vw,6rem)}
  .contact-footer{grid-template-columns:1fr;gap:28px}
  .contact-legal{text-align:left}
}
@media(prefers-reduced-motion:reduce){
  .contact-hit,.contact-name{opacity:1!important;transform:none!important}
}

/* V5 TYPOGRAPHY / SCALE — matched to v29 reference */
#header{font-size:.85rem;font-weight:400;letter-spacing:.04em}
#header nav{gap:1.6rem}
#header nav a{opacity:.65;font-weight:400;transform:none!important;transition:opacity .3s ease}
#header nav a:hover{opacity:1;font-weight:400;transform:none!important}
#navName,.hero h1{
  font-family:'Archivo Black',Arial,sans-serif;
  font-weight:400;
  letter-spacing:-.005em;
}
.hero h1{font-size:1rem}
#navName{font-size:1rem}
#work h2{
  font-size:.85rem;
  font-weight:400;
  letter-spacing:.04em;
}
.about-section{padding-top:clamp(80px,8vw,120px)}
.about-title{
  font-family:Arial,sans-serif;
  font-weight:800;
  font-size:clamp(1.8rem,3.6vw,3.2rem);
  letter-spacing:-.01em;
  line-height:.9;
  margin-bottom:clamp(70px,8vw,120px);
}
.about-copy{
  font-weight:400;
  line-height:1.5;
  font-size:clamp(.9rem,1vw,1.05rem);
}
.contact-section{
  padding-top:clamp(58px,6vw,90px);
  padding-bottom:clamp(28px,3vw,44px);
}
.contact-hit{
  font-family:'Archivo Black',Arial,sans-serif;
  font-weight:400;
  letter-spacing:.01em;
  font-size:clamp(2.2rem,4.6vw,4rem);
  line-height:.9;
  -webkit-text-stroke:.75px #111;
  text-stroke:.75px #111;
}
.contact-name{
  margin-top:clamp(60px,7vw,105px);
  font-size:clamp(2rem,6.8vw,5.5rem);
  font-weight:800;
  letter-spacing:-.02em;
  line-height:.86;
}
.contact-rule{margin:1.6rem 0}
.contact-footer{
  gap:2rem;
  font-weight:600;
  font-size:.85rem;
  line-height:1.5;
}
@media(max-width:760px){
  #header{font-size:.72rem}
  .about-title{font-size:clamp(1.8rem,10vw,3rem)}
  .contact-hit{font-size:clamp(2.2rem,10vw,3.6rem)}
  .contact-name{font-size:clamp(2rem,12vw,4rem);margin-top:60px}
}

/* V6 — match v29 headline/wordmark weight */
.about-title{
  font-family:'Inter',Arial,sans-serif!important;
  font-weight:800!important;
  font-variation-settings:"wght" 800;
}
.contact-name{
  font-family:'Inter',Arial,sans-serif!important;
  font-weight:800!important;
  font-variation-settings:"wght" 800;
}

/* V7 headline typography — actual Inter ExtraBold */
.about-title{
  font-family:'Inter',sans-serif!important;
  font-weight:800!important;
  font-variation-settings:"wght" 800!important;
  letter-spacing:-.01em!important;
}
.contact-name{
  font-family:'Inter',sans-serif!important;
  font-weight:800!important;
  font-variation-settings:"wght" 800!important;
  letter-spacing:-.02em!important;
}

/* V8 animation / spacing polish */
.about-section{padding-bottom:clamp(70px,7vw,105px)!important}
.contact-section{padding-top:clamp(34px,3.5vw,55px)!important}
.contact-hit{text-align:center!important}

/* V9 mobile project behavior */
@media(max-width:700px){
  #grid{
    grid-template-columns:1fr!important;
    grid-auto-rows:auto!important;
    gap:10px!important;
  }
  #grid .card,
  #grid .card:nth-child(n){
    grid-column:1!important;
    grid-row:auto!important;
    width:100%;
    aspect-ratio:16/10;
    min-height:0;
  }
  #grid .card::before{opacity:0}
  #grid .card .info{
    left:18px;
    right:18px;
    bottom:18px;
    opacity:0!important;
    transform:translateY(14px)!important;
    transition:opacity .34s ease,transform .42s cubic-bezier(.22,1,.36,1)!important;
  }
  #grid .card.mobile-active::before{opacity:.32}
  #grid .card.mobile-active .info{
    opacity:1!important;
    transform:translateY(0)!important;
  }
  #grid .card .title{font-size:clamp(1.35rem,6vw,2rem)}
  #grid .card .meta{font-size:.78rem}
}

/* V10 — seven-tile editorial desktop grid */
@media(min-width:701px){
  #grid{
    grid-template-columns:repeat(12,minmax(0,1fr));
    grid-template-rows:repeat(8,92px);
    grid-auto-rows:92px;
    gap:12px;
  }
  #grid .card:nth-child(n){
    min-width:0;
  }

  /* Large portrait anchor */
  #grid .card:nth-child(1){
    grid-column:1 / span 3;
    grid-row:1 / span 5;
  }
  /* Main hero tile */
  #grid .card:nth-child(2){
    grid-column:4 / span 6;
    grid-row:1 / span 4;
  }
  /* Tall right tile */
  #grid .card:nth-child(3){
    grid-column:10 / span 3;
    grid-row:1 / span 4;
  }
  /* Lower-left wide */
  #grid .card:nth-child(4){
    grid-column:1 / span 3;
    grid-row:6 / span 3;
  }
  /* Center-left */
  #grid .card:nth-child(5){
    grid-column:4 / span 3;
    grid-row:5 / span 4;
  }
  /* Lower center-right wide */
  #grid .card:nth-child(6){
    grid-column:7 / span 3;
    grid-row:5 / span 4;
  }
  /* Lower-right */
  #grid .card:nth-child(7){
    grid-column:10 / span 3;
    grid-row:5 / span 4;
  }
}

/* V12 — About copy placement + static contact */
.about-copy-wrap{
  width:58%;
  margin-left:auto;
  margin-top:clamp(58px,6vw,92px);
}
.about-copy-wrap .about-copy{
  width:100%!important;
  margin-left:0!important;
  margin-top:34px!important;
}
.about-fade-label{
  font-size:.88rem;
  font-weight:600;
  line-height:1.2;
  margin-bottom:20px;
}
.about-copy-rule{
  width:100%;
  height:1px;
  background:rgba(17,17,17,.28);
}
.contact-hit,.contact-name{
  opacity:1!important;
  transform:none!important;
}
@media(max-width:760px){
  .about-copy-wrap{width:100%;margin-top:48px}
  .about-copy-wrap .about-copy{margin-top:26px!important}
}

/* V13 — About proportions + unified Inter 800 display type */
.hero h1,
.hero p{
  font-family:'Inter',Arial,sans-serif!important;
  font-weight:800!important;
  font-variation-settings:"wght" 800!important;
  letter-spacing:-.05em!important;
}
.contact-name{
  font-family:'Inter',Arial,sans-serif!important;
  font-weight:800!important;
  font-variation-settings:"wght" 800!important;
}

/* Desktop About: wider/shorter portrait and copy aligned to image bottom */
@media(min-width:761px){
  .about-layout{
    grid-template-columns:minmax(0,1.18fr) minmax(440px,.82fr)!important;
    align-items:stretch!important;
  }
  .about-text{
    display:flex!important;
    flex-direction:column!important;
    min-height:0!important;
  }
  .about-copy-wrap{
    margin-top:auto!important;
    padding-top:clamp(52px,5vw,80px);
  }
  .about-image{
    align-self:start!important;
    width:100%!important;
    height:min(68vh,680px)!important;
    min-height:500px;
    overflow:hidden;
    border-radius:24px;
  }
  .about-image img{
    width:100%!important;
    height:100%!important;
    object-fit:cover!important;
    object-position:center 24%!important;
    display:block;
  }
}
@media(min-width:761px) and (max-height:780px){
  .about-image{
    height:64vh!important;
    min-height:430px;
  }
}

/* V14 — typography: Inter only */
html,body,button,input,textarea,select,
#header,#header *,main,main *,footer,footer *{
  font-family:'Inter',Arial,sans-serif!important;
}
.hero h1,.hero p,.about-title,.contact-name{
  font-weight:800!important;
  font-variation-settings:"wght" 800!important;
}
#navName{
  font-family:'Inter',Arial,sans-serif!important;
  font-weight:800!important;
  font-variation-settings:"wght" 800!important;
  letter-spacing:-.05em!important;
}
#header nav a,#header>span,#work h2{
  font-weight:400!important;
}
.about-copy,.about-fade-label,.contact-footer{
  font-family:'Inter',Arial,sans-serif!important;
}

/* V14 — About desktop geometry taken from v32 reference */
@media(min-width:761px){
  .about-section{
    height:100vh!important;
    min-height:700px;
    padding:3rem!important;
    overflow:hidden;
  }
  .about-layout{
    height:100%!important;
    display:grid!important;
    grid-template-columns:1.35fr 1fr!important;
    gap:2.5rem!important;
    align-items:stretch!important;
  }
  .about-text{
    height:100%!important;
    min-height:0!important;
    display:flex!important;
    flex-direction:column!important;
    justify-content:space-between!important;
  }
  .about-title{
    margin:0!important;
  }
  .about-copy-wrap{
    width:58%!important;
    margin:0 0 0 auto!important;
    padding:0!important;
  }
  .about-copy-wrap .about-copy{
    width:100%!important;
    margin:34px 0 0!important;
    line-height:1.5!important;
  }
  .about-image{
    width:100%!important;
    height:100%!important;
    min-height:0!important;
    align-self:stretch!important;
    overflow:hidden!important;
    border-radius:20px!important;
  }
  .about-image img{
    width:100%!important;
    height:100%!important;
    display:block!important;
    object-fit:cover!important;
    object-position:center!important;
  }
}

/* V15 — About alignment + contact interaction */

/* Contact wordmark remains Inter 800 */
.contact-name{
  font-family:'Inter',Arial,sans-serif!important;
  font-weight:800!important;
  font-variation-settings:"wght" 800!important;
}

/* HIT ME UP returns to the earlier Archivo Black display face */
.contact-hit{
  font-family:'Archivo Black',Arial,sans-serif!important;
  font-weight:400!important;
  font-variation-settings:normal!important;
  display:block;
  width:max-content;
  max-width:100%;
  margin-left:auto;
  margin-right:auto;
  color:transparent!important;
  -webkit-text-stroke:.75px #111;
  text-stroke:.75px #111;
  text-decoration:none;
  cursor:pointer;
  transition:color .38s ease,-webkit-text-stroke-color .38s ease,text-stroke-color .38s ease!important;
}
.contact-hit:hover,
.contact-hit:focus-visible{
  color:#111!important;
  -webkit-text-stroke-color:#111;
  text-stroke-color:#111;
}

/* Requested emphasis inside About copy */
.about-copy strong{
  font-weight:800!important;
}

/* Desktop: full-width label/rule aligned with ABOUT MARCO,
   while copy remains right-indented. */
@media(min-width:761px){
  .about-copy-wrap{
    width:100%!important;
    margin:0!important;
    padding:0 0 8px!important; /* tiny lift so copy bottom visually aligns */
    display:grid;
    grid-template-columns:42% 58%;
  }
  .about-fade-label{
    grid-column:1 / -1;
    margin-left:0!important;
  }
  .about-copy-rule{
    grid-column:1 / -1;
    width:100%!important;
  }
  .about-copy-wrap .about-copy{
    grid-column:2;
    width:100%!important;
    margin:30px 0 0!important;
  }
}

/* V17 */
.about-title,.contact-name{text-transform:none!important}
#grid .card{text-decoration:none;color:inherit}
#grid .card.linked{cursor:pointer}

/* V18 — final type/project refinements */
.about-title,
.contact-name{
  letter-spacing:-.05em!important;
}
.contact-hit{
  letter-spacing:-.025em!important;
}

/* Keep mixed-case project titles exactly as entered */
#grid .card .title{
  text-transform:none!important;
}

/* Restore full readable title size on the two smaller cards */
@media(min-width:701px){
  #grid .card:nth-child(4) .title,
  #grid .card:nth-child(7) .title{
    font-size:clamp(1.15rem,1.65vw,1.75rem)!important;
    line-height:1.05!important;
  }
}
@media(max-width:700px){
  #grid .card:nth-child(4) .title,
  #grid .card:nth-child(7) .title{
    font-size:clamp(1.35rem,6vw,2rem)!important;
  }
}

/* V19 — project 4 + 7 metadata matches the other cards */
#grid .card:nth-child(4) .meta,
#grid .card:nth-child(7) .meta{
  font-size:inherit!important;
  line-height:inherit!important;
}
@media(min-width:701px){
  #grid .card:nth-child(4) .meta,
  #grid .card:nth-child(7) .meta{
    font-size:.78rem!important;
    line-height:1.35!important;
  }
}

/* V20 — discreet footer language switch */
.language-switch{
  display:inline-flex;
  align-items:center;
  gap:.28em;
  white-space:nowrap;
}
.language-switch button{
  appearance:none;
  border:0;
  padding:0;
  margin:0;
  background:none;
  color:inherit;
  font:inherit;
  letter-spacing:inherit;
  cursor:pointer;
  opacity:.42;
  transition:opacity .25s ease;
}
.language-switch button:hover,
.language-switch button:focus-visible{opacity:.78}
.language-switch button.active{opacity:1}
.language-switch-row{margin-top:.8rem}

/* V21 — project artwork */
#grid .card{
  position:relative;
  overflow:hidden;
  background:var(--c);
}
#grid .card .project-image{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
  z-index:0;
  transition:filter .45s ease,transform .55s cubic-bezier(.22,1,.36,1);
}
#grid .card::before{z-index:1}
#grid .card .info{z-index:2}

/* Hand-tuned crops for the desktop mosaic */
@media(min-width:701px){
  #grid .card:nth-child(1) .project-image{object-position:50% 58%}
  #grid .card:nth-child(2) .project-image{object-position:50% 43%}
  #grid .card:nth-child(3) .project-image{object-position:50% 55%}
  #grid .card:nth-child(4) .project-image{object-position:50% 50%}
  #grid .card:nth-child(5) .project-image{object-position:57% 50%}
  #grid .card:nth-child(6) .project-image{object-position:50% 47%}
  #grid .card:nth-child(7) .project-image{object-position:50% 50%}
}
/* Mobile cards are uniform landscape: favor each artwork's key subject/logo */
@media(max-width:700px){
  #grid .card:nth-child(1) .project-image{object-position:50% 67%}
  #grid .card:nth-child(2) .project-image{object-position:50% 42%}
  #grid .card:nth-child(3) .project-image{object-position:50% 64%}
  #grid .card:nth-child(4) .project-image{object-position:50% 50%}
  #grid .card:nth-child(5) .project-image{object-position:54% 50%}
  #grid .card:nth-child(6) .project-image{object-position:50% 45%}
  #grid .card:nth-child(7) .project-image{object-position:50% 48%}
}
/* Existing hover dimming applies visually to artwork too */
@media(min-width:701px){
  #grid:hover .card:not(:hover) .project-image{filter:grayscale(1) brightness(.72)}
}

/* V22 — final project image positioning */
@media(max-width:700px){
  /* So Happy It Hurts: artwork sits lower inside the mobile tile */
  #grid .card:nth-child(1) .project-image{object-position:50% 58%!important}
}
@media(min-width:701px){
  /* Jokah & Tutty: shift artwork clearly left */
  #grid .card:nth-child(5) .project-image{object-position:72% 50%!important}
  /* Kennt Jeder!: shift artwork slightly right */
  #grid .card:nth-child(7) .project-image{object-position:42% 50%!important}
}

/* V23 — two requested crop nudges */
@media(max-width:700px){
  #grid .card:nth-child(1) .project-image{object-position:50% 52%!important}
}
@media(min-width:701px){
  #grid .card:nth-child(5) .project-image{object-position:80% 50%!important}
}

/* V24 */
.about-fade-label,.about-copy-rule{opacity:0;transform:translateY(8px);will-change:opacity,transform}
@media(max-width:700px){
  #grid .card:nth-child(4) .meta,
  #grid .card:nth-child(7) .meta{font-size:.78rem!important;line-height:1.35!important}
}