/* =========================================================
   BIGFOOT MEDIA FOUNDRY — ABOUT US PAGE
   PAGE-SPECIFIC STYLES
   Loads after css/styles.css
   ========================================================= */

.about-page{background:#050505;}

.about-hero{
  min-height:690px;
  display:flex;
  align-items:center;
  background:
    linear-gradient(90deg,rgba(0,0,0,.97) 0%,rgba(0,0,0,.84) 43%,rgba(0,0,0,.43) 72%,rgba(0,0,0,.22) 100%),
    url("../images/bigfoot-hero-image.png") center/cover no-repeat;
  border-bottom:9px solid var(--lime);
}

.about-hero-inner{padding-top:100px;padding-bottom:110px;}

.about-hero h1{
  max-width:1350px;
  margin:0 0 32px;
  font-size:clamp(4.6rem,6.7vw,7.2rem);
  line-height:.9;
  letter-spacing:-.05em;
  font-weight:900;
  text-transform:uppercase;
}

.about-hero h1 span{display:block;}
.about-hero h1 .white{color:#fff;}
.about-hero h1 .lime{color:var(--lime);}

.about-hero-copy{
  max-width:900px;
  margin:0;
  color:#fff;
  font-size:clamp(1.3rem,1.65vw,1.7rem);
  line-height:1.5;
}

.about-section{padding:145px 0;}

.story-section{background:#050505;color:#fff;}

.story-grid{
  display:grid;
  grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);
  gap:120px;
  align-items:start;
}

.story-heading h2,
.section-heading h2,
.service-area-grid h2{
  margin:0;
  font-size:clamp(4rem,6vw,6.3rem);
  line-height:.9;
  letter-spacing:-.045em;
  text-transform:uppercase;
}

.story-heading h2 span,
.section-heading h2 span,
.service-area-grid h2 span{color:var(--lime);}

.story-copy p{
  margin:0 0 28px;
  color:#e1e1e1;
  font-size:clamp(1.25rem,1.6vw,1.65rem);
  line-height:1.55;
}

.owners-section{background:#111;color:#fff;}

.section-heading{margin-bottom:75px;}
.section-heading.centered{text-align:center;}

.owners-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:28px;
  max-width:1200px;
  margin:0 auto;
}

.owner-card{
  min-height:470px;
  padding:46px 44px;
  background:#050505;
  border-top:6px solid var(--lime);
}

.owner-number{
  margin:0 0 25px;
  color:var(--lime);
  font-size:3.5rem;
  line-height:1;
  font-weight:900;
}

.owner-card h3{
  margin:0;
  color:#fff;
  font-size:2.1rem;
  text-transform:uppercase;
}

.owner-role{
  margin:8px 0 28px;
  color:var(--lime);
  font-weight:900;
  text-transform:uppercase;
  letter-spacing:.08em;
}

.owner-card p:not(.owner-number):not(.owner-role):not(.service-line){
  color:#d0d0d0;
  font-size:1.1rem;
  line-height:1.65;
}

.service-line{
  margin-top:32px;
  padding-top:22px;
  border-top:1px solid #292929;
  color:#fff;
  font-weight:900;
  text-transform:uppercase;
}

.about-values{
  padding:130px 0;
  background:var(--lime);
  color:#050505;
}

.values-grid{
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(0,1fr);
  gap:70px;
}

.values-grid>div:first-child h2{
  margin:0;
  font-size:clamp(3.6rem,4.8vw,5.4rem);
  line-height:.9;
  letter-spacing:-.045em;
  text-transform:uppercase;
  overflow-wrap:normal;
}
  line-height:.9;
  letter-spacing:-.045em;
  text-transform:uppercase;
}

.dark-kicker{color:#050505 !important;}

.values-list article{
  display:grid;
  grid-template-columns:minmax(55px,80px) minmax(0,1fr);
  gap:25px;
  padding:26px 0;
  border-bottom:2px solid rgba(0,0,0,.25);
}

.values-list article:first-child{padding-top:0;}

.values-list span{
  font-size:2.3rem;
  font-weight:900;
}

.values-list h3{
  margin:0 0 8px;
  font-size:1.5rem;
  text-transform:uppercase;
}

.values-list p{
  margin:0;
  font-size:1.08rem;
  line-height:1.5;
}

.service-area-section{background:#050505;color:#fff;}

.service-area-grid{
  display:grid;
  grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);
  gap:110px;
  align-items:center;
}

.service-area-copy{
  color:#e0e0e0;
  font-size:clamp(1.3rem,1.7vw,1.75rem);
  line-height:1.5;
}

.about-routes{
  margin-top:38px;
  color:#fff;
  font-size:clamp(1.5rem,2vw,2.15rem);
  line-height:1.4;
  font-weight:900;
  text-align:center;
}

.about-routes div{white-space:normal;}
.about-routes span{padding:0 10px;color:var(--lime);}

.about-cta{
  padding:130px 0;
  background:var(--lime);
  color:#050505;
}

.about-cta-inner{text-align:center;}

.about-cta h2{
  margin:0 0 28px;
  color:#050505;
  font-size:clamp(4.2rem,6.3vw,6.6rem);
  line-height:.9;
  letter-spacing:-.045em;
  text-transform:uppercase;
}

.about-cta p:not(.kicker){
  max-width:900px;
  margin:0 auto 36px;
  color:#111;
  font-size:1.4rem;
  line-height:1.5;
}

.about-dark-button{
  min-height:62px;
  padding:0 38px;
  background:#050505;
  border-color:#050505;
  color:#fff;
  font-size:1rem;
}

/* Footer */
.about-page .site-footer{background:#030303;padding:65px 0 28px;}

.about-page .footer-main{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:40px;
}

.about-page .footer-logo{width:auto;height:90px;}

.about-page .footer-contact{
  display:flex;
  gap:28px;
  color:#ddd;
  font-size:.9rem;
}

.about-page .footer-bottom{
  display:flex;
  justify-content:space-between;
  gap:40px;
  margin-top:42px;
  padding-top:22px;
  border-top:1px solid #222;
  color:#777;
  font-size:.75rem;
}

.about-page .footer-seo{max-width:650px;text-align:right;}

@media(max-width:1200px){
  .story-grid,.values-grid,.service-area-grid{grid-template-columns:1fr;gap:55px;}
  .owners-grid{grid-template-columns:1fr;}
}

@media(max-width:760px){
  .about-hero{min-height:auto;}
  .about-hero-inner{padding-top:80px;padding-bottom:85px;}
  .about-hero h1{font-size:clamp(3.2rem,12vw,5rem);}
  .about-hero h1 span{white-space:normal;}
  .about-section{padding:90px 0;}
  .about-values,.about-cta{padding:90px 0;}
  .about-routes div{white-space:normal;}
  .about-page .footer-main,.about-page .footer-bottom{
    flex-direction:column;align-items:center;text-align:center;
  }
  .about-page .footer-contact{flex-direction:column;align-items:center;}
  .about-page .footer-seo{text-align:center;}
}