/* Shared header and footer based on the About artboard. */
@media(min-width:761px){
body[data-site-chrome][data-page] .site-header{position:absolute;inset:0 0 auto;height:0;display:block;color:var(--site-header-ink,#000)}
body[data-site-chrome][data-page] .wordmark{position:absolute;left:calc(100vw * 100 / 1440);top:calc(100vw * 69 / 1440);width:calc(100vw * 113 / 1440);height:calc(100vw * 29 / 1440);min-height:0;display:block;transform:none}
body[data-site-chrome][data-page] .wordmark .brand-dot{position:absolute;inset:0 auto auto 0;width:calc(100vw * 29 / 1440);height:calc(100vw * 29 / 1440);border-radius:50%;background:currentColor;mask:none;-webkit-mask:none}
body[data-site-chrome][data-page] .wordmark>span:last-child{position:absolute;left:calc(100vw * 39 / 1440);top:calc(100vw * 8 / 1440);width:calc(100vw * 74 / 1440);height:calc(100vw * 16 / 1440);transform:none;--about-glyph:url(/assets/about-hd-20261030/logo.png)}
body[data-site-chrome][data-page] .main-nav{position:static;display:block}
body[data-site-chrome][data-page] .main-nav a{position:absolute;right:auto;display:block;margin:0;min-height:0;line-height:1;opacity:1;text-decoration:none}
body[data-site-chrome][data-page] .main-nav a:nth-child(1){left:calc(100vw * 1275 / 1440);top:calc(100vw * 60 / 1440);width:calc(100vw * 64 / 1440);height:calc(100vw * 16 / 1440);--about-glyph:url(/assets/about-hd-20261030/nav-work.png)}
body[data-site-chrome][data-page] .main-nav a:nth-child(2){left:calc(100vw * 1215 / 1440);top:calc(100vw * 77 / 1440);width:calc(100vw * 125 / 1440);height:calc(100vw * 20 / 1440);--about-glyph:url(/assets/about-hd-20261030/nav-playground.png)}
body[data-site-chrome][data-page] .main-nav a:nth-child(3){left:calc(100vw * 1275 / 1440);top:calc(100vw * 97 / 1440);width:calc(100vw * 65 / 1440);height:calc(100vw * 14 / 1440);--about-glyph:url(/assets/about-hd-20261030/nav-about.png)}
body[data-site-chrome][data-page] .wordmark>span:last-child,body[data-site-chrome][data-page] .main-nav a{color:inherit;-webkit-text-fill-color:transparent}
body[data-site-chrome][data-page] .wordmark>span:last-child::after,body[data-site-chrome][data-page] .main-nav a::after{content:"";position:absolute;inset:0;background:currentColor;-webkit-mask:var(--about-glyph) center/100% 100% no-repeat;mask:var(--about-glyph) center/100% 100% no-repeat;pointer-events:none}
}

/* Home previews use different paper colours. Masked and animated text shares the header ink. */
@media (min-width: 761px) {
  body[data-site-chrome][data-active-preview="art-direction"] .site-header { color: #fff; }
  body[data-site-chrome]:is([data-active-preview="visual-identity"], [data-active-preview="typography"]) .site-header { color: #000; }
}

@media (max-width: 760px) {
  body[data-site-chrome][data-page] .site-header {
    position: absolute;
    inset: 28px var(--gutter) auto;
    height: auto;
    display: flex;
    color: #000;
  }
  body[data-site-chrome][data-page] .site-header .wordmark {
    position: static;
    display: inline-flex;
    width: auto;
    height: auto;
    gap: 10px;
  }
  body[data-site-chrome][data-page] .wordmark .brand-dot {
    position: static;
    width: 25px;
    height: 25px;
    border-radius: 50%;
    background: currentColor;
    mask: none;
    -webkit-mask: none;
  }
  body[data-site-chrome][data-page] .wordmark > span:last-child {
    position: static;
    -webkit-text-fill-color: currentColor;
  }
  body[data-site-chrome][data-page] .main-nav {
    position: static;
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    width: auto;
    height: auto;
    font-size: 16px;
    line-height: 1.2;
  }
  body[data-site-chrome][data-page] .main-nav a:nth-child(n) {
    position: static;
    inset: auto;
    display: flex;
    width: auto;
    height: auto;
    min-height: 22px;
    -webkit-text-fill-color: currentColor;
  }
  body[data-site-chrome][data-page] .site-header a::after,
  body[data-site-chrome][data-page] .wordmark > span:last-child::after { content: none; }
}

.site-footer-standard {
  position: relative;
  color: #000;
  background: #fff;
}
.site-footer-standard .about-footer-copy { margin: 0; }
@media (min-width: 761px) {
  body[data-project="yl-accounting"], body[data-project="aptagrow-beci"],
  body[data-project="aptagrow-ai-king"] { --footer-reserved: 269; }
  body[data-project="the-good-vibes-club"] { --footer-reserved: 285; }
  body[data-page="home"] { --footer-gap: 0; }
  .site-footer-standard {
    margin-top: calc((var(--footer-gap, 82) - var(--footer-reserved, 0)) * 100vw / 1440);
    height: calc(178 * 100vw / 1440);
  }
  .site-footer-standard .about-footer-copy,
  .site-footer-standard .about-footer-links {
    position: absolute;
    left: calc(var(--x) * 100vw / 1440);
    top: calc(var(--y) * 100vw / 1440);
    width: calc(var(--w) * 100vw / 1440);
    height: calc(var(--h) * 100vw / 1440);
    -webkit-text-fill-color: transparent;
  }
  .site-footer-standard .about-footer-copy::after,
  .site-footer-standard .about-footer-links::after {
    content: "";
    position: absolute;
    inset: 0;
    background: currentColor;
    mask: var(--about-glyph) center / 100% 100% no-repeat;
    pointer-events: none;
  }
  .site-footer-standard .contact-label { border: 0; padding: 0; }
}
@media (max-width: 760px) {
  .site-footer-standard {
    padding: 32px var(--gutter) 48px;
    font-size: 15px;
    line-height: 1.5;
    letter-spacing: -.35px;
  }
  .site-footer-standard .about-footer-links {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: 28px;
  }
}