/* About Us — clean static rebuild */
.fs-about{
  --ink:#121314;
  --paper:#f3f1ed;
  --paper-2:#e8e4dc;
  --sage:#2f5d4a;
  --sage-deep:#1f4336;
  --ember:#d85a2a;
  --muted:#5f5a54;
  --line:rgba(18,19,20,.1);
  font-family:Outfit,Montserrat,system-ui,sans-serif;
  color:var(--ink);
  background:var(--paper);
  overflow-x:hidden;
}
.fs-about *{box-sizing:border-box}
.fs-about img{max-width:100%;display:block}
.fs-about a{color:inherit}
.fs-about__wrap{width:min(1120px,90%);margin:0 auto}

.fs-about h1,
.fs-about h2,
.fs-about h3{
  font-family:"Barlow Condensed",Outfit,sans-serif;
  text-transform:uppercase;
  letter-spacing:.04em;
  line-height:.98;
  font-weight:800;
  margin:0;
  color:var(--ink);
}

/* Hero */
.fs-about-hero{
  position:relative;
  min-height:min(72vh,640px);
  display:grid;
  align-items:end;
  color:#fff;
  overflow:hidden;
  background:#111;
}
.fs-about-hero__media{
  position:absolute;inset:0;z-index:0;
}
.fs-about-hero__media img{
  width:100%;height:100%;object-fit:cover;
}
.fs-about-hero__shade{
  position:absolute;inset:0;z-index:1;
  background:
    linear-gradient(180deg, rgba(8,10,9,.35) 0%, rgba(8,10,9,.2) 40%, rgba(8,10,9,.82) 100%),
    linear-gradient(90deg, rgba(8,10,9,.55) 0%, transparent 55%);
}
.fs-about-hero__copy{
  position:relative;z-index:2;
  padding:clamp(4.5rem,10vw,7rem) 0 clamp(2.4rem,5vw,3.4rem);
}
.fs-about-hero__kicker{
  margin:0 0 .55rem;
  font-size:.72rem;
  font-weight:800;
  letter-spacing:.16em;
  text-transform:uppercase;
  color:#e0b36a;
}
.fs-about-hero h1{
  color:#fff;
  font-size:clamp(2.8rem,8vw,5.4rem);
  max-width:10ch;
  text-shadow:0 2px 24px rgba(0,0,0,.35);
}
.fs-about-hero__lead{
  margin:1rem 0 0;
  max-width:38ch;
  color:rgba(255,255,255,.82);
  font-size:1.05rem;
  line-height:1.6;
}

/* Story */
.fs-about-story{
  padding:clamp(3.2rem,7vw,5rem) 0;
  background:
    radial-gradient(ellipse 60% 50% at 100% 0%, rgba(47,93,74,.08), transparent 55%),
    var(--paper);
}
.fs-about-story__grid{
  display:grid;
  grid-template-columns:1.05fr .95fr;
  gap:clamp(1.6rem,4vw,3rem);
  align-items:center;
}
.fs-about-story__eyebrow{
  margin:0 0 .5rem;
  font-size:.72rem;
  font-weight:800;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:var(--ember);
}
.fs-about-story h2{
  font-size:clamp(2.2rem,5vw,3.6rem);
  max-width:12ch;
}
.fs-about-story__text{
  margin:1.1rem 0 0;
  color:var(--muted);
  font-size:1.05rem;
  line-height:1.7;
  max-width:42ch;
}
.fs-about-story__text + .fs-about-story__text{margin-top:.85rem}
.fs-about-story__figure{
  margin:0;
  position:relative;
  overflow:hidden;
  border-radius:4px;
  aspect-ratio:4/5;
  background:#1a1a1c;
  box-shadow:0 24px 50px rgba(0,0,0,.14);
}
.fs-about-story__figure img{
  width:100%;height:100%;object-fit:cover;
}
.fs-about-story__badge{
  position:absolute;
  left:1rem;bottom:1rem;
  padding:.55rem .85rem;
  background:rgba(18,19,20,.82);
  color:#fff;
  font-size:.72rem;
  font-weight:700;
  letter-spacing:.06em;
  text-transform:uppercase;
  backdrop-filter:blur(8px);
}

/* Moments strip */
.fs-about-moments{
  padding:0 0 clamp(2.8rem,6vw,4rem);
  background:var(--paper);
}
.fs-about-moments__grid{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:.65rem;
}
.fs-about-moments figure{
  margin:0;
  position:relative;
  overflow:hidden;
  border-radius:3px;
  aspect-ratio:4/5;
  background:#222;
}
.fs-about-moments img{
  width:100%;height:100%;object-fit:cover;
  transition:transform .55s ease;
}
.fs-about-moments figure:hover img{transform:scale(1.04)}
.fs-about-moments figcaption{
  position:absolute;left:0;right:0;bottom:0;
  padding:2rem .7rem .65rem;
  background:linear-gradient(transparent, rgba(0,0,0,.72));
  color:#fff;
  font-size:.72rem;
  font-weight:700;
  letter-spacing:.04em;
  text-transform:uppercase;
}

/* Team */
.fs-about-team{
  padding:clamp(3.2rem,7vw,5rem) 0;
  background:
    linear-gradient(180deg, #16181a 0%, #1c201e 100%);
  color:#fff;
}
.fs-about-team__head{
  text-align:center;
  margin-bottom:clamp(1.8rem,4vw,2.6rem);
}
.fs-about-team__eyebrow{
  margin:0 0 .45rem;
  font-size:.72rem;
  font-weight:800;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:#e0b36a;
}
.fs-about-team h2{
  color:#fff;
  font-size:clamp(2.2rem,5vw,3.4rem);
}
.fs-about-team__lead{
  margin:.75rem auto 0;
  max-width:40ch;
  color:rgba(255,255,255,.62);
  line-height:1.6;
}
.fs-about-team__grid{
  display:flex;
  flex-wrap:wrap;
  justify-content:center;
  gap:1rem;
}
.fs-about-person{
  margin:0;
  background:rgba(255,255,255,.04);
  border:1px solid rgba(255,255,255,.08);
  overflow:hidden;
  flex:1 1 200px;
  max-width:240px;
  display:flex;
  flex-direction:column;
}
.fs-about-person__photo{
  margin:0;
  aspect-ratio:1;
  overflow:hidden;
  background:#0d0f10;
  width:100%;
  flex-shrink:0;
}
.fs-about-person__photo img{
  width:100%;height:100%;object-fit:cover;object-position:center top;
}
.fs-about-person__photo--mono{
  display:grid;
  place-items:center;
  background:
    linear-gradient(145deg, #2a3832, #121816);
  font-family:"Barlow Condensed",sans-serif;
  font-size:3rem;
  font-weight:800;
  letter-spacing:.08em;
  color:rgba(255,255,255,.55);
}
.fs-about-person__body{
  padding:1rem 1.05rem 1.25rem;
  flex:1;
  display:flex;
  flex-direction:column;
}
.fs-about-person h3{
  color:#fff;
  font-size:1.35rem;
  letter-spacing:.03em;
}
.fs-about-person__role{
  margin:.35rem 0 0;
  color:#e0b36a;
  font-size:.78rem;
  font-weight:700;
  letter-spacing:.06em;
  text-transform:uppercase;
}
.fs-about-person__bio{
  margin:.55rem 0 0;
  color:rgba(255,255,255,.62);
  font-size:.92rem;
  line-height:1.5;
}

/* Collaboration */
.fs-about-collab{
  padding:clamp(2.8rem,6vw,4.2rem) 0;
  background:var(--paper-2);
}
.fs-about-collab__grid{
  display:grid;
  grid-template-columns:1fr 1.15fr;
  gap:clamp(1.4rem,4vw,2.8rem);
  align-items:center;
}
.fs-about-collab__eyebrow{
  margin:0 0 .45rem;
  font-size:.72rem;
  font-weight:800;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:var(--ember);
}
.fs-about-collab h2{
  font-size:clamp(1.8rem,4vw,2.6rem);
  max-width:16ch;
}
.fs-about-collab p{
  margin:.85rem 0 0;
  color:var(--muted);
  line-height:1.65;
  max-width:40ch;
}
.fs-about-collab__logos{
  display:grid;
  place-items:center;
}
.fs-about-collab__logos figure{
  margin:0;
  width:100%;
  background:#fff;
  border:1px solid var(--line);
  padding:clamp(1.4rem,3vw,2.2rem);
  display:grid;
  place-items:center;
  aspect-ratio:16/10;
  max-height:280px;
}
.fs-about-collab__logos img{
  width:100%;
  height:100%;
  max-height:none;
  object-fit:contain;
}

/* Help CTA */
.fs-about-help{
  padding:clamp(3rem,7vw,4.5rem) 0;
  background:
    linear-gradient(135deg, rgba(18,19,20,.82), rgba(31,67,54,.88)),
    url("/assets/uploads/2024/07/IMG_0877.jpg") center/cover no-repeat;
  color:#fff;
  text-align:center;
}
.fs-about-help h2{
  color:#fff;
  font-size:clamp(2.2rem,5.5vw,3.6rem);
}
.fs-about-help p{
  margin:.8rem auto 0;
  max-width:36ch;
  color:rgba(255,255,255,.72);
  line-height:1.6;
}
.fs-about-help__actions{
  margin-top:1.5rem;
  display:flex;
  flex-wrap:wrap;
  gap:.65rem;
  justify-content:center;
}
.fs-about-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:46px;
  padding:.7rem 1.25rem;
  border-radius:999px;
  font-size:.78rem;
  font-weight:700;
  letter-spacing:.05em;
  text-transform:uppercase;
  text-decoration:none !important;
  border:0;
  cursor:pointer;
  transition:transform .2s ease, background .2s ease;
}
.fs-about-btn:hover{transform:translateY(-1px)}
.fs-about-btn--solid{
  background:var(--ember);
  color:#fff !important;
}
.fs-about-btn--ghost{
  background:transparent;
  color:#fff !important;
  box-shadow:inset 0 0 0 1.5px rgba(255,255,255,.45);
}
.fs-about-btn--ink{
  background:transparent;
  color:var(--ink) !important;
  box-shadow:inset 0 0 0 1.5px rgba(18,19,20,.35);
}

@media (max-width:900px){
  .fs-about-story__grid,
  .fs-about-collab__grid{grid-template-columns:1fr}
  .fs-about-story__figure{aspect-ratio:16/11;max-width:560px}
  .fs-about-moments__grid{grid-template-columns:repeat(2,1fr)}
  .fs-about-person{max-width:280px}
}
@media (max-width:560px){
  .fs-about-moments__grid{grid-template-columns:1fr 1fr;gap:.45rem}
  .fs-about-hero{min-height:58vh}
  .fs-about-person{flex:1 1 calc(50% - .5rem);max-width:none}
}
