/* ========================================================================
   WOLF ABOUT PAGE v38
   Scoped to .page-about only. Does not target or rebuild header/footer.
   Typography, weights, spacing, and colors are locked to the provided design.
   ======================================================================== */
.page-about .about-page-root,
.page-about .about-page-root *{box-sizing:border-box;}
.page-about .about-page-root{
  --about-orange:#ff6800;
  --about-white:#f7f7f7;
  --about-muted:rgba(255,255,255,.66);
  --about-soft:rgba(255,255,255,.45);
  --about-black:#020202;
  background:#020202;
  color:var(--about-white);
  overflow:hidden;
  font-family:"Montserrat", Arial, sans-serif;
  font-weight:200;
  letter-spacing:0;
}
.page-about .about-wrap{
  width:min(1280px,calc(100% - 96px));
  margin:0 auto;
  position:relative;
  z-index:3;
}
.page-about .about-highlight,
.page-about .about-title .about-highlight{color:var(--about-orange)!important;}
.page-about .about-title,
.page-about .about-story .about-title,
.page-about .about-story .about-title *:not(.about-highlight){color:#ffffff!important;}

/* Hero: uses the supplied finger/wolf background image as a real background. */
.page-about .about-hero{
  position:relative;
  min-height:auto;
  padding:0 0 54px;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:flex-start;
  text-align:center;
  background-color:#010101;
  background-repeat:no-repeat;
  background-size:min(1500px, 100%) auto;
  background-position:center top;
  isolation:isolate;
}
.page-about .about-hero::before{
  content:"";
  position:absolute;
  inset:0;
  z-index:0;
  background:
    radial-gradient(circle at 50% 28%, rgba(255,104,0,.16), transparent 23%),
    linear-gradient(180deg, rgba(0,0,0,.02) 0%, rgba(0,0,0,.03) 48%, #040404 98%);
  pointer-events:none;
}
.page-about .about-pill{
  position:absolute;
  left:34px;
  top:34px;
  z-index:3;
  display:inline-flex;
  align-items:center;
  gap:10px;
  padding:9px 17px;
  border:1px solid rgba(255,104,0,.62);
  border-radius:999px;
  color:#fff;
  font-family:"Montserrat", Arial, sans-serif;
  font-size:13px;
  font-weight:700;
  line-height:1;
  letter-spacing:1.9px;
  text-transform:uppercase;
  background:rgba(8,8,8,.72);
  box-shadow:0 0 24px rgba(255,104,0,.12), inset 0 0 18px rgba(255,104,0,.03);
}
.page-about .about-pill::before{
  content:"";
  width:8px;
  height:8px;
  border-radius:50%;
  background:var(--about-orange);
  box-shadow:0 0 12px rgba(255,104,0,.92);
}
.page-about .about-hero-content{
  max-width:680px;
  margin:0 auto;
  padding-top:clamp(230px, 26.5vw, 420px);
  position:relative;
  z-index:2;
}
.page-about .about-hero h1,
.page-about .about-hero h2{
  margin:0;
  color:#fff;
  font-family:"Montserrat", Arial, sans-serif;
  font-size:clamp(28px, 3.1vw, 46px);
  line-height:1.06;
  font-weight:700;
  letter-spacing:-1.2px;
  text-transform:none;
}
.page-about .about-hero h1 span{color:var(--about-orange)!important;}
.page-about .about-hero p{
  margin:18px auto 0;
  max-width:620px;
  color:rgba(255,255,255,.72);
  font-family:"Montserrat", Arial, sans-serif;
  font-size:14.5px;
  line-height:1.58;
  font-weight:200;
  letter-spacing:-.05px;
}
.page-about .about-divider{
  position:relative;
  width:140px;
  height:1px;
  margin:20px auto 0;
  background:linear-gradient(90deg,transparent,rgba(255,104,0,.9),transparent);
}
.page-about .about-divider::after{
  content:"";
  position:absolute;
  left:50%;
  top:50%;
  width:8px;
  height:8px;
  transform:translate(-50%,-50%) rotate(45deg);
  background:var(--about-orange);
  box-shadow:0 0 10px var(--about-orange);
  border-radius:1px;
}

/* Story section */
.page-about .about-story{
  position:relative;
  padding:56px 0 110px;
  background:linear-gradient(180deg,#090a0e 0%, #050508 52%, #030304 100%);
  isolation:isolate;
  overflow:hidden;
}
.page-about .about-story::before{
  content:"";
  position:absolute;
  inset:0;
  z-index:0;
  background-image:var(--about-story-bg);
  background-repeat:no-repeat;
  background-size:cover;
  background-position:center center;
  opacity:1;
  filter:brightness(.78) contrast(1.06);
  pointer-events:none;
}
.page-about .about-story::after{
  content:"";
  position:absolute;
  inset:0;
  z-index:1;
  background:linear-gradient(180deg,rgba(3,3,5,.18) 0%, rgba(3,3,5,.10) 38%, rgba(3,3,5,.36) 100%);
  pointer-events:none;
}
.page-about .about-story-grid{
  display:grid;
  grid-template-columns:.82fr 1.18fr;
  gap:64px;
  align-items:center;
}
.page-about .about-section-mark{
  display:block;
  width:34px;
  height:2px;
  margin:0 0 38px;
  background:var(--about-orange);
}
.page-about .about-title{
  margin:0;
  color:#fff;
  font-family:"Montserrat", Arial, sans-serif;
  font-size:clamp(42px,5vw,72px);
  line-height:1.05;
  font-weight:700;
  letter-spacing:-2.2px;
  text-transform:none;
}
.page-about .about-copy{
  margin-top:32px;
  max-width:560px;
  color:rgba(255,255,255,.74);
  font-family:"Montserrat", Arial, sans-serif;
  font-size:15px;
  line-height:1.72;
  font-weight:200;
}
.page-about .about-copy p{margin:0 0 23px;}
.page-about .about-copy strong{color:var(--about-orange);font-weight:700;}
.page-about .about-story-image{
  position:relative;
  min-height:520px;
  overflow:hidden;
  border-radius:0;
  background-repeat:no-repeat;
  background-size:cover;
  background-position:center center;
  box-shadow:0 34px 90px rgba(0,0,0,.50);
}
.page-about .about-story-image::after{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(90deg,rgba(0,0,0,.22),rgba(0,0,0,.03));
  pointer-events:none;
}
.page-about .about-signature{
  margin-top:70px;
  color:rgba(255,255,255,.18);
  font-family:"Montserrat", Arial, sans-serif;
  font-size:25px;
  font-weight:300;
  line-height:1.2;
  letter-spacing:.1px;
}

/* Team: the supplied chart/market image is a real background layer above the existing dark color. */
.page-about .about-team{
  position:relative;
  padding:48px 0 58px;
  background-color:#020202;
  background-image:linear-gradient(180deg,#020202 0%,#030303 52%,#020202 100%);
  isolation:isolate;
  overflow:hidden;
}
.page-about .about-team::before{
  content:"";
  position:absolute;
  left:0;
  right:0;
  top:0;
  width:100%;
  height:680px;
  z-index:0;
  background-image:var(--about-team-bg);
  background-repeat:no-repeat;
  background-size:cover;
  background-position:center top;
  opacity:.62;
  filter:brightness(.88) contrast(1.12);
  pointer-events:none;
}
.page-about .about-team::after{
  content:"";
  position:absolute;
  left:0;right:0;top:0;
  height:720px;
  z-index:1;
  background:linear-gradient(180deg,rgba(2,2,2,.06) 0%,rgba(2,2,2,.36) 50%,#020202 100%);
  pointer-events:none;
}
.page-about .about-team-intro{
  position:relative;
  z-index:3;
  max-width:690px;
  margin-bottom:26px;
}
.page-about .about-eyebrow{
  margin:0 0 26px;
  color:var(--about-orange);
  font-family:"Montserrat", Arial, sans-serif;
  font-size:13px;
  font-weight:700;
  line-height:1;
  letter-spacing:.8px;
  text-transform:uppercase;
}
.page-about .about-team-intro p{
  margin:18px 0 0;
  max-width:590px;
  color:rgba(255,255,255,.72);
  font-family:"Montserrat", Arial, sans-serif;
  font-size:17px;
  line-height:1.65;
  font-weight:200;
}
.page-about .about-team-grid{
  position:relative;
  z-index:3;
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:24px;
}
 .page-about .about-team-card{
  position:relative;
  min-height:430px;
  overflow:hidden;
  border-radius:18px;
  background:#0b0b0b;
  border:1px solid rgba(255,255,255,.09);
  box-shadow:0 26px 80px rgba(0,0,0,.44);
  transition:transform .32s ease, border-color .32s ease, box-shadow .32s ease;
}
.page-about .about-team-card::before{
  content:"";
  position:absolute;
  inset:0;
  background-image:var(--member-image);
  background-repeat:no-repeat;
  background-size:cover;
  background-position:center top;
  filter:brightness(.52) saturate(.92);
  transform:scale(1);
  transition:filter .32s ease, transform .32s ease;
}
.page-about .about-team-card::after{
  content:"";
  position:absolute;
  inset:0;
  background:
    linear-gradient(180deg,rgba(0,0,0,.12) 0%,rgba(0,0,0,.22) 36%,rgba(0,0,0,.70) 100%),
    radial-gradient(circle at 78% 62%,rgba(255,104,0,.16),transparent 36%);
  transition:background .32s ease;
}
.page-about .about-team-card:hover{
  transform:translateY(-8px);
  border-color:rgba(255,255,255,.18);
  box-shadow:0 34px 92px rgba(0,0,0,.58), 0 0 40px rgba(255,104,0,.08);
}
.page-about .about-team-card:hover::before{
  filter:brightness(.48) saturate(.94);
  transform:scale(1.035);
}
.page-about .about-team-card:hover::after{
  background:
    linear-gradient(180deg,rgba(0,0,0,.24) 0%,rgba(0,0,0,.34) 36%,rgba(0,0,0,.82) 100%),
    radial-gradient(circle at 76% 62%,rgba(255,104,0,.18),transparent 36%);
}
.page-about .about-team-card-content{
  position:absolute;
  left:30px;
  right:30px;
  bottom:24px;
  z-index:2;
  padding:0;
  text-align:left;
  transition:all .32s ease;
}
.page-about .about-team-card-content::before{
  content:"";
  position:absolute;
  left:50%;
  top:0;
  width:96px;
  height:96px;
  border-radius:50%;
  background-image:var(--member-image);
  background-repeat:no-repeat;
  background-size:cover;
  background-position:center top;
  border:3px solid rgba(255,255,255,.34);
  box-shadow:0 0 0 1px rgba(255,255,255,.08), 0 15px 35px rgba(0,0,0,.45);
  opacity:0;
  transform:translate(-50%,-42%) scale(.74);
  pointer-events:none;
  transition:opacity .32s ease, transform .32s ease;
}
.page-about .about-team-card:hover .about-team-card-content{
  left:40px;
  right:40px;
  bottom:20px;
  min-height:250px;
  padding:74px 34px 26px;
  border:1px solid rgba(255,255,255,.22);
  border-radius:15px;
  background:linear-gradient(180deg,rgba(36,36,36,.58),rgba(10,10,10,.72));
  backdrop-filter:blur(12px);
  -webkit-backdrop-filter:blur(12px);
  box-shadow:inset 0 0 26px rgba(255,255,255,.035), 0 22px 60px rgba(0,0,0,.45);
  text-align:center;
}
.page-about .about-team-card:hover .about-team-card-content::before{
  opacity:1;
  transform:translate(-50%,-50%) scale(1);
}
.page-about .about-card-line{
  display:block;
  width:28px;
  height:2px;
  margin:0 0 15px;
  background:var(--about-orange);
  transition:width .32s ease, margin .32s ease, opacity .32s ease;
}
.page-about .about-team-card:hover .about-card-line{
  width:100%;
  max-width:260px;
  margin:0 auto 19px;
  opacity:.78;
}
.page-about .about-team-card h3{
  margin:0;
  color:#fff;
  font-family:"Montserrat", Arial, sans-serif;
  font-size:24px;
  line-height:1.12;
  font-weight:700;
  letter-spacing:-.55px;
}
.page-about .about-team-card h4{
  margin:8px 0 14px;
  color:var(--about-orange);
  font-family:"Montserrat", Arial, sans-serif;
  font-size:15px;
  line-height:1.15;
  font-weight:700;
}
.page-about .about-team-card p{
  margin:0;
  color:rgba(255,255,255,.78);
  font-family:"Montserrat", Arial, sans-serif;
  font-size:13.5px;
  line-height:1.55;
  font-weight:200;
}
.page-about .about-linkedin{
  display:inline-flex;
  margin-top:18px;
  color:rgba(255,255,255,.62);
  font-family:"Montserrat", Arial, sans-serif;
  font-size:18px;
  font-weight:700;
  line-height:1;
  text-decoration:none;
}
.page-about .about-linkedin:hover{color:#fff;}

@media(max-width:1100px){
  .page-about .about-story-grid,
  .page-about .about-team-grid{grid-template-columns:1fr;}
  .page-about .about-story-image{min-height:420px;}
  .page-about .about-team-card{min-height:470px;}
  .page-about .about-team-card .about-team-card-content{left:34px;right:34px;bottom:24px;}
  .page-about .about-wrap{width:min(100% - 44px,1280px);}
  .page-about .about-team::before{width:100%;left:0;right:0;opacity:.48;height:560px;background-position:center top;}
}
@media(max-width:640px){
  .page-about .about-hero{min-height:auto;padding:0 0 48px;background-position:center top;}
  .page-about .about-pill{left:22px;top:22px;font-size:11px;padding:8px 13px;}
  .page-about .about-hero-content{padding-top:clamp(155px, 34vw, 215px);margin:0 auto;}
  .page-about .about-hero h1,
  .page-about .about-hero h2{font-size:clamp(23px, 6.2vw, 30px);letter-spacing:-.8px;}
  .page-about .about-hero p{font-size:13.5px;margin-top:14px;}
  .page-about .about-divider{margin-top:16px;}
  .page-about .about-story{padding:54px 0 70px;}
  .page-about .about-title{font-size:42px;}
  .page-about .about-team-card{min-height:440px;}
  .page-about .about-team-card-content{left:22px;right:22px;bottom:24px;}
}

/* ========================================================================
   ABOUT PAGE HERO: SWAPPED TO WELCOME WOLF HERO
   ======================================================================== */
.page-about .contact-welcome,
.page-about .about-welcome {
  height:calc(100vh - var(--wolf-shell-header-height,86px));
  height:calc(100svh - var(--wolf-shell-header-height,86px));
  min-height:620px;
  max-height:980px;
  position:relative;
  display:flex;
  align-items:center;
  background:#020202;
  isolation:isolate;
  overflow:hidden;
  padding:0;
}
.page-about .contact-welcome::before,
.page-about .about-welcome::before {
  content:"";
  position:absolute;
  inset:0;
  z-index:0;
  background:
    radial-gradient(circle at 26% 45%, rgba(17,19,64,.42), transparent 42%),
    linear-gradient(90deg,#030318 0%, #02020c 45%, #020202 100%);
  pointer-events:none;
}
.page-about .contact-welcome::after,
.page-about .about-welcome::after {
  content:"";
  position:absolute;
  inset:0;
  z-index:1;
  background:
    linear-gradient(90deg,rgba(0,0,0,0) 0%,rgba(0,0,0,.08) 48%,rgba(0,0,0,.72) 100%),
    linear-gradient(180deg,rgba(0,0,0,0) 0%,rgba(0,0,0,.02) 72%,#020202 100%);
  pointer-events:none;
}
.page-about .contact-welcome-shell {
  position:relative;
  z-index:2;
  width:min(1540px,calc(100% - 112px));
  height:100%;
  margin:0 auto;
  display:grid;
  grid-template-columns:minmax(520px,690px) minmax(520px,1fr);
  gap:clamp(34px,4.2vw,86px);
  align-items:center;
}
.page-about .contact-welcome-people {
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  grid-template-rows:repeat(4,auto);
  gap:clamp(13px,2.3svh,34px) clamp(16px,1.8vw,28px);
  align-items:center;
  justify-items:center;
  width:100%;
  max-width:690px;
}
.page-about .contact-welcome-person {
  margin:0;
  width:100%;
  aspect-ratio:.78;
  max-height:clamp(118px,16.2svh,184px);
  border-radius:clamp(34px,4.5vw,64px);
  overflow:hidden;
  background:#f5f2f4;
  box-shadow:0 22px 62px rgba(0,0,0,.32);
  transform:translateZ(0);
}
.page-about .contact-welcome-person img {
  width:100%;
  height:100%;
  display:block;
  object-fit:cover;
  object-position:center 8%;
}
.page-about .contact-welcome-next {
  width:100%;
  min-height:clamp(118px,16.2svh,184px);
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  justify-content:center;
  color:#fff;
  padding-left:clamp(8px,1.4vw,20px);
  transform:translateY(clamp(2px,.6svh,10px));
}
.page-about .contact-welcome-next strong {
  display:block;
  color:#fff;
  font-family:"Montserrat",Arial,sans-serif;
  font-size:clamp(34px,3.55vw,62px);
  line-height:1;
  font-weight:800;
  letter-spacing:-2px;
}
.page-about .contact-welcome-next span {
  display:block;
  margin-top:9px;
  color:rgba(255,255,255,.74);
  font-family:"Montserrat",Arial,sans-serif;
  font-size:clamp(19px,1.8vw,29px);
  line-height:1.05;
  font-weight:200;
  letter-spacing:-.7px;
}
.page-about .contact-welcome-content {
  display:flex;
  align-items:center;
  color:#fff;
  text-align:left;
  transform:translateY(clamp(-4px,.6svh,8px));
}
.page-about .contact-welcome h1,
.page-about .about-welcome h1 {
  margin:0;
  color:#ffffff !important;
  font-family:"Montserrat",Arial,sans-serif;
  font-size:clamp(76px,8.35vw,156px);
  line-height:1.05;
  font-weight:800;
  letter-spacing:clamp(-7px,-.38vw,-4px);
  text-transform:none;
}
.page-about .contact-welcome h1 span,
.page-about .about-welcome h1 span {
  display:block;
  color:#ffffff !important;
}

@media(max-width:1100px){
  .page-about .contact-welcome,
  .page-about .about-welcome {height:auto;min-height:auto;padding:82px 0 56px;}
  .page-about .contact-welcome-shell {width:min(100% - 44px,1220px);height:auto;grid-template-columns:1fr;gap:42px;}
  .page-about .contact-welcome-people {max-width:760px;margin:0 auto;gap:18px;}
  .page-about .contact-welcome-person {max-height:none;height:142px;border-radius:46px;aspect-ratio:auto;}
  .page-about .contact-welcome-next {min-height:142px;padding-left:8px;}
  .page-about .contact-welcome-content {text-align:center;justify-content:center;transform:none;}
  .page-about .contact-welcome h1,
  .page-about .about-welcome h1 {font-size:clamp(58px,13vw,110px);letter-spacing:-4px;}
}
@media(max-width:720px){
  .page-about .contact-welcome,
  .page-about .about-welcome {padding:76px 0 44px;}
  .page-about .contact-welcome-people {grid-template-columns:repeat(3,1fr);gap:15px;}
  .page-about .contact-welcome-person {height:118px;border-radius:36px;}
  .page-about .contact-welcome-next {min-height:118px;align-items:center;text-align:center;padding-left:0;}
  .page-about .contact-welcome-next strong {font-size:34px;}
  .page-about .contact-welcome-next span {font-size:20px;}
}
