@import url('/premium.css');
@import url('/responsive-fix.css');
@import url('/interaction-fix.css');
@import url('/site-pages.css');
@import url('/photo-asset-fix.css');
@import url('/consistency.css');
@import url('/ux-cleanup.css');
@import url('/launch-polish.css?v=20260830-7');

/* GitHub / repository affordances */
.repo-nav-link{
  display:inline-flex!important;align-items:center;gap:7px
}
.repo-nav-link .repo-icon{width:15px;height:15px;flex:0 0 auto}
.repo-icon{
  fill:none;stroke:currentColor;stroke-width:1.65;stroke-linecap:round;stroke-linejoin:round
}

/* Header GitHub link: official mark only on desktop; mark + GitHub label on compact navigation. */
.header .navlinks .nav-github{
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  width:34px;
  min-width:34px;
  height:34px;
  min-height:34px;
  padding:0!important;
  flex:0 0 34px;
  gap:0!important;
  font-size:0!important;
  line-height:1!important;
  border-radius:50%;
  background:none!important;
  overflow:visible!important;
}
.header .navlinks .nav-github::before{
  content:"";
  display:block;
  width:20px;
  height:20px;
  flex:0 0 20px;
  background:url('/github-mark.svg') center/contain no-repeat;
}
.header .navlinks .nav-github::after{
  content:"GitHub";
  display:none;
}
.header .navlinks .nav-github:hover{background-color:rgba(36,91,73,.06)!important}

.repo-section{
  border-top:1px solid var(--line);
  padding:22px 0 54px;
}
.repo-card{
  display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:22px;
  min-height:150px;padding:24px 26px;border:1px solid var(--line);
  border-radius:16px;background:rgba(250,250,247,.68);
  transition:border-color .22s ease,background .22s ease,transform .22s ease
}
.repo-card:hover{
  border-color:#b9bbb3;background:#f8f8f4;transform:translateY(-1px)
}
.repo-card-icon{
  width:48px;height:48px;border:1px solid #bfc2bc;border-radius:50%;
  display:grid;place-items:center;color:#60645f;background:#f2f3f0
}
.repo-card-icon .repo-icon{width:22px;height:22px}
.repo-card-copy h2{
  margin:7px 0 5px;font-size:clamp(23px,2.5vw,34px);
  line-height:1.05;letter-spacing:-.04em;font-weight:400
}
.repo-card-copy p{margin:0;color:#74776f;font-size:12px}
.repo-card-meta{
  display:flex;align-items:center;gap:18px;color:#797c75;font-size:9px;
  white-space:nowrap
}
.repo-arrow{display:none!important}

.contact-repo-row{
  margin-top:10px;padding:13px 0;border-bottom:1px solid var(--line);
  display:grid;grid-template-columns:55px 1fr;gap:10px;align-items:center
}
.contact-repo-row>span{font-size:9px;color:#93968e}
.contact-repo-row strong{
  display:flex;align-items:center;gap:7px;font-size:12px;font-weight:400;min-width:0
}
.contact-repo-row strong .repo-icon{width:14px;height:14px;flex:0 0 auto}
.contact-repo-row:hover strong,.contact-email-row:hover strong{color:var(--green)}

/* FAQ: calm editorial desktop composition; natural document scrolling everywhere. */
.faq-reference-right>.faq{
  scrollbar-width:none!important;
  -ms-overflow-style:none!important;
}
.faq-reference-right>.faq::-webkit-scrollbar{display:none!important;width:0!important;height:0!important}

@media(min-width:981px){
  .faq-section{
    padding-top:112px!important;
    padding-bottom:112px!important;
  }
  .faq-reference-layout{
    display:grid!important;
    grid-template-columns:minmax(300px,.72fr) minmax(0,1.28fr)!important;
    gap:clamp(64px,7vw,112px)!important;
    align-items:start!important;
  }
  .faq-reference-left{
    display:flex!important;
    flex-direction:column!important;
    min-width:0!important;
    position:sticky!important;
    top:118px!important;
    align-self:start!important;
  }
  .faq-reference-left>.kicker{
    margin:0 0 14px!important;
  }
  .faq-reference-left>.section-title{
    margin:0!important;
    max-width:430px!important;
    font-size:clamp(46px,4.7vw,68px)!important;
    line-height:.98!important;
  }
  .faq-reference-photo{
    width:100%!important;
    max-width:430px!important;
    height:auto!important;
    min-height:0!important;
    max-height:none!important;
    margin:38px 0 0!important;
    aspect-ratio:16/10!important;
    flex:0 0 auto!important;
    align-self:start!important;
    overflow:hidden!important;
    border-radius:18px!important;
    box-sizing:border-box!important;
  }
  .faq-reference-photo img{
    display:block!important;
    width:100%!important;
    height:100%!important;
    min-height:0!important;
    object-fit:cover!important;
    object-position:center!important;
  }
  .faq-reference-right{
    width:100%!important;
    height:auto!important;
    min-height:0!important;
    margin:6px 0 0!important;
    align-self:start!important;
    overflow:visible!important;
  }
  .faq-reference-right>.faq{
    width:100%!important;
    height:auto!important;
    min-height:0!important;
    margin:0!important;
    padding:0!important;
    overflow:visible!important;
    overscroll-behavior:auto!important;
  }
  .faq-reference-right .faq details{
    border-bottom-color:#c7c9c3!important;
  }
  .faq-reference-right .faq summary{
    min-height:84px!important;
    padding:24px 0!important;
    gap:30px!important;
    font-size:16px!important;
    line-height:1.42!important;
    letter-spacing:-.012em!important;
    transition:color .22s ease!important;
  }
  .faq-reference-right .faq details p{
    max-width:720px!important;
    padding:0 54px 28px 0!important;
    font-size:13.5px!important;
    line-height:1.78!important;
  }
  .faq-reference-right .faq details[open]>summary{
    color:#30332f!important;
  }
  .faq-reference-right .faq details:not([open])>summary:hover{
    color:#252824!important;
  }
  .faq-reference-right .faq .faq-plus{
    width:24px!important;
    height:24px!important;
    font-size:22px!important;
  }
}

@media(min-width:981px) and (max-width:1180px){
  .faq-reference-layout{
    grid-template-columns:minmax(270px,.8fr) minmax(0,1.2fr)!important;
    gap:clamp(46px,5.5vw,66px)!important;
  }
  .faq-reference-left{
    top:104px!important;
  }
  .faq-reference-left>.section-title{
    font-size:clamp(44px,5vw,58px)!important;
  }
  .faq-reference-photo{
    margin-top:30px!important;
  }
}

/* Privacy panel: its top edge never changes when disclosure rows grow. */
body .consent-backdrop:not([hidden]){
  align-items:start!important;
  justify-items:center!important;
  overflow-y:auto!important;
  overscroll-behavior:contain!important;
  padding:clamp(18px,5vh,48px) 20px!important;
}
body .consent-panel{
  margin:0 auto!important;
  max-height:calc(100dvh - clamp(36px,10vh,96px))!important;
  overflow-y:auto!important;
  overflow-x:hidden!important;
  overflow-anchor:none!important;
  scroll-behavior:auto!important;
}
body .consent-panel,
body .consent-list,
body .consent-row,
body .consent-row-main,
body .consent-detail,
body .consent-actions{overflow-anchor:none!important}
body .consent-detail{
  display:block!important;
  max-height:0!important;
  overflow:hidden!important;
  opacity:0!important;
  padding-top:0!important;
  padding-bottom:0!important;
  transition:max-height .36s cubic-bezier(.2,.72,.2,1),opacity .25s ease,padding-bottom .36s cubic-bezier(.2,.72,.2,1)!important;
}
body .consent-row.open .consent-detail{
  max-height:180px!important;
  opacity:1!important;
  padding-bottom:12px!important;
}
body .consent-info{
  transition:transform .34s cubic-bezier(.2,.72,.2,1)!important;
}

/* Never let navigation state disable normal document scrolling or trackpad gestures. */
html{
  overflow-y:auto!important;
  overscroll-behavior-y:auto!important;
  scrollbar-gutter:stable;
}
body:not(.consent-open),
body.nav-open:not(.consent-open){
  overflow-y:visible!important;
  overscroll-behavior-y:auto!important;
  touch-action:auto!important;
}

@media(max-width:980px){
  html,
  body:not(.consent-open),
  body.nav-open:not(.consent-open){
    overflow-y:auto!important;
    overscroll-behavior-y:auto!important;
    touch-action:pan-y pinch-zoom!important;
    -webkit-overflow-scrolling:touch;
  }
  body .header .navlinks .nav-github{
    display:flex!important;
    align-items:center!important;
    justify-content:flex-start!important;
    width:100%!important;
    min-width:0!important;
    min-height:46px!important;
    height:46px!important;
    flex:0 0 auto!important;
    gap:10px!important;
    padding:0 8px!important;
    border-radius:0!important;
    background:none!important;
    overflow:visible!important;
    font-size:0!important;
    line-height:1!important;
  }
  body .header .navlinks .nav-github::before{
    display:block!important;
    width:21px!important;
    height:21px!important;
    flex:0 0 21px!important;
    background:url('/github-mark.svg') center/contain no-repeat!important;
  }
  body .header .navlinks .nav-github::after{
    content:"GitHub"!important;
    display:block!important;
    flex:0 0 auto!important;
    margin:0!important;
    padding:0!important;
    position:static!important;
    transform:none!important;
    font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Helvetica,Arial,sans-serif!important;
    font-size:15px!important;
    font-weight:600!important;
    line-height:1.2!important;
    letter-spacing:-.01em!important;
    white-space:nowrap!important;
  }
  .faq-section,
  .faq-reference-layout,
  .faq-reference-right,
  .faq-reference-right>.faq{
    touch-action:pan-y!important;
    overscroll-behavior:auto!important;
  }
  .faq-reference-layout{display:grid!important;grid-template-columns:1fr!important}
  .faq-reference-left{display:flex!important;flex-direction:column!important;min-height:0!important}
  .faq-reference-photo{
    width:100%!important;
    height:auto!important;
    margin-top:24px!important;
    aspect-ratio:16/10!important;
    overflow:hidden!important;
  }
  .faq-reference-photo img{display:block!important;width:100%!important;height:100%!important;object-fit:cover!important}
  .faq-reference-right{
    width:100%!important;
    height:auto!important;
    min-height:0!important;
    margin-top:30px!important;
    overflow:visible!important;
  }
  .faq-reference-right>.faq{
    width:100%!important;
    height:auto!important;
    min-height:0!important;
    margin:0!important;
    overflow:visible!important;
    overscroll-behavior:auto!important;
    touch-action:pan-y!important;
    padding-right:0!important;
    overflow-anchor:none!important;
    interpolate-size:allow-keywords;
  }
  .faq-reference-right details,
  .faq-reference-right summary,
  .faq-reference-right details p{overflow-anchor:none!important}
  .faq-plus{
    transition:transform .38s cubic-bezier(.2,.72,.2,1),color .28s ease!important;
    will-change:auto!important;
  }
  .faq details[open]>p{
    animation:faqAnswerInStable .34s cubic-bezier(.2,.72,.2,1) both!important;
  }
  @keyframes faqAnswerInStable{
    from{opacity:0;transform:translateY(-3px)}
    to{opacity:1;transform:none}
  }
  @supports selector(details::details-content){
    .faq details::details-content{
      block-size:0;
      overflow:clip;
      opacity:0;
      transition:block-size .42s cubic-bezier(.2,.72,.2,1),opacity .28s ease,content-visibility .42s allow-discrete;
    }
    .faq details[open]::details-content{
      block-size:auto;
      opacity:1;
    }
  }
}

@media(max-width:900px){
  .repo-card{grid-template-columns:auto 1fr}
  .repo-card-meta{grid-column:2;justify-content:space-between}
}
@media(max-width:700px){
  body .consent-backdrop:not([hidden]){
    padding:10px!important;
  }
  body .consent-panel{
    width:100%!important;
    max-height:calc(100dvh - 20px)!important;
  }
  .repo-section{padding:16px 0 34px}
  .repo-card{grid-template-columns:1fr;gap:14px;padding:20px;min-height:0}
  .repo-card-icon{width:42px;height:42px}
  .repo-card-meta{grid-column:auto;white-space:normal;align-items:flex-end}
  .repo-card-copy h2{font-size:27px}
}

@media(prefers-reduced-motion:reduce){
  .faq details::details-content,
  .faq-plus,
  .faq details[open]>p,
  .consent-detail,
  .consent-info{transition:none!important;animation:none!important}
}

/* Hero phrase cycle: mirrors the reference's clipped vertical word rotation while keeping ZeroRun claims precise. */
.hero-word-clip{
  display:inline-block!important;
  overflow:hidden!important;
  vertical-align:bottom!important;
  width:5.65em!important;
  max-width:100%!important;
}
.hero-word-clip .hero-moving-word{
  position:relative!important;
  display:inline-block!important;
  width:100%!important;
  color:transparent!important;
  opacity:1!important;
  transform:none!important;
  transition:none!important;
  white-space:nowrap!important;
}
.hero-word-clip .hero-moving-word::after{
  content:"didn’t change.";
  position:absolute;
  inset:0 auto auto 0;
  display:block;
  color:#848781;
  white-space:nowrap;
  will-change:transform,opacity;
  animation:zeroRunHeroPhrase 8.4s cubic-bezier(.16,1,.3,1) infinite;
}
@keyframes zeroRunHeroPhrase{
  0%,28%{content:"didn’t change.";opacity:1;transform:translateY(0)}
  31%{content:"didn’t change.";opacity:0;transform:translateY(-.82em)}
  31.01%{content:"already passed.";opacity:0;transform:translateY(.82em)}
  34%,61%{content:"already passed.";opacity:1;transform:translateY(0)}
  64%{content:"already passed.";opacity:0;transform:translateY(-.82em)}
  64.01%{content:"matches exactly.";opacity:0;transform:translateY(.82em)}
  67%,94%{content:"matches exactly.";opacity:1;transform:translateY(0)}
  97%{content:"matches exactly.";opacity:0;transform:translateY(-.82em)}
  97.01%{content:"didn’t change.";opacity:0;transform:translateY(.82em)}
  100%{content:"didn’t change.";opacity:1;transform:translateY(0)}
}

@media(prefers-reduced-motion:reduce){
  .hero-word-clip{width:auto!important;overflow:visible!important}
  .hero-word-clip .hero-moving-word{color:#848781!important;white-space:normal!important}
  .hero-word-clip .hero-moving-word::after{display:none!important;animation:none!important}
}

/* Unified premium page-hero scale. Keeps secondary pages restrained and consistent with the homepage. */
.info-hero h1{
  font-size:clamp(48px,6vw,78px)!important;
  line-height:.96!important;
  letter-spacing:-.045em!important;
  max-width:780px!important;
}
.contact-hero h1{
  font-size:clamp(44px,5.5vw,72px)!important;
  line-height:1!important;
  letter-spacing:-.045em!important;
  max-width:760px!important;
}
.evidence-hero h1{
  font-size:clamp(48px,5.8vw,76px)!important;
  line-height:.97!important;
  letter-spacing:-.045em!important;
  max-width:720px!important;
}
@media(max-width:700px){
  .info-hero h1{font-size:clamp(44px,13vw,60px)!important;line-height:.98!important}
  .contact-hero h1{font-size:clamp(40px,12vw,56px)!important;line-height:1.01!important}
  .evidence-hero h1{font-size:clamp(44px,13vw,60px)!important;line-height:.99!important}
}
