/* GIN PORTFOLIO — TITLE SYSTEM V20 (2026-10-20)
   Reference: /portfolio/ "SELECTED WORK." (Manrope ExtraBold / black / mint punctuation).
   Loaded last after legacy styles, applies to only the first h1 of each inner page. */

:root{
 --gin-page-title-font:Manrope,Arial,sans-serif;
 --gin-page-title-size:clamp(38px,5.9vw,84px);
 --gin-page-title-tracking:-.065em;
 --gin-page-title-leading:1.07;
 --gin-page-title-accent:#00f5a0;
}

body.gin-subpage main h1.gin-page-title,
body.gin-subpage.case-page .case-intro h1.gin-page-title,
body.gin-subpage .gin-contact-hero h1.gin-page-title,
body.gin-subpage .gin-editorial .gin-article-head h1.gin-page-title,
body.gin-subpage .blog-main .blog-heading h1.gin-page-title{
  font-family:var(--gin-page-title-font)!important;
  font-size:var(--gin-page-title-size)!important;
  font-style:normal!important;
  font-weight:800!important;
  line-height:var(--gin-page-title-leading)!important;
  letter-spacing:var(--gin-page-title-tracking)!important;
  text-transform:uppercase!important;
  color:#080808!important;
  margin:28px 0 22px!important;
  max-width:1200px!important;
  text-wrap:balance;
  overflow-wrap:break-word;
  hyphens:none;
  opacity:1!important;
}
body.gin-subpage main h1.gin-page-title .mint,
body.gin-subpage main h1.gin-page-title .gin-title-accent,
body.gin-subpage .gin-contact-hero h1.gin-page-title .gin-title-accent{
  color:var(--gin-page-title-accent)!important;
  -webkit-text-fill-color:var(--gin-page-title-accent)!important;
}
/* Editorial headlines have more words than project names.
   They keep the same family, weight, contrast, rhythm and accent, with safe line lengths. */
body.gin-subpage main h1.gin-page-title.gin-page-title--long,
body.gin-subpage.case-page .case-intro h1.gin-page-title.gin-page-title--long,
body.gin-subpage .gin-editorial .gin-article-head h1.gin-page-title.gin-page-title--long,
body.gin-subpage .blog-main .blog-heading h1.gin-page-title.gin-page-title--long{
 font-size:clamp(35px,4.45vw,64px)!important;
 max-width:1140px!important;
 letter-spacing:-.057em!important;
}
body.gin-subpage.case-page .case-intro,
body.gin-subpage .blog-main .blog-heading{
  color:#080808!important;
}
body.gin-subpage.case-page .case-intro .case-lead,
body.gin-subpage .blog-main .blog-heading > p:not(.case-discipline){
  font-family:Manrope,Arial,sans-serif!important;
  font-size:clamp(14px,1.25vw,18px)!important;
  font-weight:450!important;
  line-height:1.7!important;
  color:#333!important;
  max-width:850px;
}
/* Mirror the reference's black-on-white title canvas on the Contact page. */
body.gin-subpage .gin-contact .gin-contact-hero{
  background:#fff!important;
  color:#080808!important;
  border-bottom:1px solid #dedede;
}
body.gin-subpage .gin-contact .gin-contact-micro{
  border-top-color:#a0a0a0!important;
  color:#505050!important;
}
body.gin-subpage .gin-contact .gin-contact-micro span{
  color:#505050!important;
}
body.gin-subpage .gin-contact .gin-contact-hero-grid{
  padding-top:clamp(48px,6vw,90px);
}
body.gin-subpage .gin-contact .gin-contact-hero h1.gin-page-title{
  max-width:960px!important;
}
body.gin-subpage .gin-contact .gin-contact-hero h1.gin-page-title em{
  font-family:inherit!important;
  font-style:normal!important;
  font-weight:inherit!important;
  color:#080808!important;
}
body.gin-subpage .gin-contact .gin-contact-side{
  border-top:1px solid #aaa!important;
}
body.gin-subpage .gin-contact .gin-contact-side p{
  color:#424242!important;
  font-family:Manrope,Arial,sans-serif!important;
}
body.gin-subpage .gin-contact .gin-contact-primary{
  background:#101010!important;
  color:#fff!important;
  border:1px solid #101010;
}
body.gin-subpage .gin-contact .gin-contact-primary:hover{
  background:#00f5a0!important;
  color:#080808!important;
  border-color:#00f5a0;
}
body.gin-subpage .gin-contact .gin-contact-index{
  border-top-color:#c6c6c6!important;
}
body.gin-subpage .gin-contact .gin-contact-index span,
body.gin-subpage .gin-contact .gin-contact-index p{
  color:#535353!important;
}
/* Internal Blog headings previously used a separate, very large display font. */
body.gin-subpage .v18-intro h1.gin-page-title,
body.gin-subpage .gin-editorial .gin-article-head h1.gin-page-title{
  background:none!important;
  -webkit-text-fill-color:#080808;
}
body.gin-subpage .v18-intro h1.gin-page-title .mint,
body.gin-subpage .gin-editorial .gin-article-head h1.gin-page-title .mint{
  -webkit-text-fill-color:var(--gin-page-title-accent)!important;
}
@media (max-width:740px){
 :root{--gin-page-title-size:clamp(34px,8.3vw,56px)}
 body.gin-subpage main h1.gin-page-title,
 body.gin-subpage.case-page .case-intro h1.gin-page-title,
 body.gin-subpage .gin-contact-hero h1.gin-page-title,
 body.gin-subpage .gin-editorial .gin-article-head h1.gin-page-title,
 body.gin-subpage .blog-main .blog-heading h1.gin-page-title{
   letter-spacing:-.055em!important;
   line-height:1.11!important;
   margin:24px 0 18px!important;
   overflow-wrap:anywhere;
 }
 body.gin-subpage main h1.gin-page-title.gin-page-title--long,
 body.gin-subpage.case-page .case-intro h1.gin-page-title.gin-page-title--long,
 body.gin-subpage .gin-editorial .gin-article-head h1.gin-page-title.gin-page-title--long,
 body.gin-subpage .blog-main .blog-heading h1.gin-page-title.gin-page-title--long{
   font-size:clamp(31px,7vw,49px)!important;
 }
 body.gin-subpage .gin-contact .gin-contact-hero-grid{padding-top:45px}
}
@media(prefers-reduced-motion:reduce){
  body.gin-subpage main h1.gin-page-title{transition:none!important;transform:none!important}
}