/* Homepage hero final safe adjustments - section scoped only */
.agency-hero .agency-stage{
  height:396px !important;
  margin-top:118px !important;
}
.agency-hero .agency-portrait-wrap{
  top:-52px !important;
  width:272px !important;
  height:272px !important;
}
.agency-hero .agency-orbit{
  top:-68px !important;
  width:304px !important;
  height:304px !important;
}
.agency-hero .agency-glass-panel{
  top:72px !important;
  height:auto !important;
  min-height:284px !important;
  padding:78px 38px 18px !important;
  border-radius:40px !important;
  background:linear-gradient(180deg, rgba(255,255,255,.96) 0%, rgba(255,255,255,.95) 62%, rgba(246,246,246,.93) 85%, rgba(241,241,241,.9) 100%) !important;
  box-shadow:0 22px 54px rgba(0,0,0,.04) !important;
}
.agency-hero .agency-panel-head{
  height:108px !important;
  min-height:0 !important;
  grid-template-columns:minmax(0,1fr) 310px !important;
  align-items:start !important;
}
.agency-hero .agency-metric{
  grid-template-columns:236px 210px !important;
  max-width:470px !important;
}
.agency-hero .agency-metric-left{
  padding-right:26px !important;
}
.agency-hero .agency-metric-left strong{
  font-size:58px !important;
  line-height:.92 !important;
  letter-spacing:-.07em !important;
}
.agency-hero .agency-metric-left em{
  font-size:14px !important;
  margin-top:9px !important;
}
.agency-hero .agency-metric span{
  padding-left:26px !important;
  font-size:13px !important;
  line-height:1.22 !important;
  max-width:195px !important;
}
.agency-hero .agency-platforms{
  justify-self:end !important;
  align-items:center !important;
  gap:14px !important;
  padding-right:4px !important;
  margin-top:2px !important;
}
.agency-hero .platform-social-box{
  display:flex !important;
  align-items:center !important;
  gap:14px !important;
  padding:10px 14px !important;
  background:#eef1f6 !important;
  border-radius:18px !important;
  box-shadow:inset 0 0 0 1px rgba(0,0,0,.025) !important;
}
.agency-hero .platform-social-btn{
  width:48px !important;
  height:48px !important;
  border-radius:15px !important;
  display:grid !important;
  place-items:center !important;
  flex:0 0 48px !important;
  box-shadow:0 6px 14px rgba(0,0,0,.12) !important;
}
.agency-hero .platform-social-btn svg{
  width:28px !important;
  height:28px !important;
  display:block !important;
}
.agency-hero .platform-social-btn.tiktok{background:#111 !important;}
.agency-hero .platform-social-btn.instagram{background:linear-gradient(145deg,#f7cf64 0%,#e23c77 40%,#7a3cff 100%) !important;}
.agency-hero .platform-social-btn.youtube{background:#ff2014 !important;}
.agency-hero .agency-platforms small{
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  font-size:15px !important;
  line-height:1 !important;
  color:#222 !important;
  background:#fff !important;
  border:1px solid #ddd !important;
  border-radius:999px !important;
  padding:9px 16px !important;
}
.agency-hero .agency-team-row{
  margin-top:18px !important;
  gap:16px !important;
}
.agency-hero .agency-team-card{
  height:94px !important;
  grid-template-columns:62px 1fr 54px !important;
  gap:14px !important;
  padding:0 18px !important;
  background:#fff !important;
  border:1px solid rgba(17,17,17,.03) !important;
  box-shadow:0 4px 18px rgba(0,0,0,.03) !important;
}
.agency-hero .agency-team-card.active{
  border:3px solid #111 !important;
  box-shadow:none !important;
}
.agency-hero .agency-team-avatar{
  width:56px !important;
  height:56px !important;
}
.agency-hero .agency-team-copy b{
  font-size:18px !important;
}
.agency-hero .agency-team-copy small{
  font-size:12px !important;
  margin-top:5px !important;
  line-height:1.15 !important;
}
.agency-hero .agency-team-icon{
  width:46px !important;
  height:46px !important;
}

@media(max-width:1100px){
  .agency-hero .agency-stage{height:720px !important; margin-top:94px !important;}
  .agency-hero .agency-portrait-wrap{width:236px !important; height:236px !important; top:-44px !important;}
  .agency-hero .agency-orbit{width:268px !important; height:268px !important; top:-60px !important;}
  .agency-hero .agency-glass-panel{top:70px !important; min-height:560px !important; padding:86px 22px 24px !important;}
  .agency-hero .agency-panel-head{height:auto !important; min-height:190px !important; grid-template-columns:1fr !important;}
  .agency-hero .agency-platforms{justify-self:start !important; align-items:flex-start !important; margin-top:14px !important;}
  .agency-hero .agency-team-row{grid-template-columns:1fr !important;}
}
@media(max-width:820px){
  .agency-hero .agency-stage{height:810px !important; margin-top:78px !important;}
  .agency-hero .agency-portrait-wrap{width:220px !important; height:220px !important; top:-40px !important;}
  .agency-hero .agency-orbit{width:248px !important; height:248px !important; top:-54px !important;}
  .agency-hero .agency-glass-panel{top:66px !important; min-height:640px !important; padding:84px 18px 22px !important;}
  .agency-hero .agency-metric{grid-template-columns:118px 1fr !important; max-width:100% !important;}
  .agency-hero .agency-metric-left strong{font-size:44px !important;}
  .agency-hero .agency-metric-left em{font-size:12px !important;}
  .agency-hero .agency-metric span{font-size:12px !important; padding-left:14px !important;}
  .agency-hero .platform-social-btn{width:44px !important; height:44px !important; flex-basis:44px !important;}
  .agency-hero .platform-social-btn svg{width:24px !important; height:24px !important;}
}

/* === Mobile navigation + hero overlap fix === */
@media(max-width:820px){
  .final-header .final-nav-wrap,
  .site-header .nav-wrap{position:relative!important;overflow:visible!important;}

  .final-main-nav,
  .main-nav{
    display:none!important;
  }
  .final-main-nav.open,
  .final-main-nav.is-open,
  .main-nav.open,
  .main-nav.is-open{
    display:flex!important;
    position:absolute!important;
    top:72px!important;
    left:0!important;
    right:0!important;
    z-index:9999!important;
    flex-direction:column!important;
    align-items:stretch!important;
    gap:4px!important;
    padding:14px!important;
    background:rgba(255,255,255,.98)!important;
    border:1px solid rgba(0,0,0,.06)!important;
    border-radius:22px!important;
    box-shadow:0 20px 55px rgba(0,0,0,.14)!important;
    backdrop-filter:blur(18px)!important;
  }
  .final-main-nav.open a,
  .final-main-nav.is-open a,
  .main-nav.open a,
  .main-nav.is-open a{
    width:100%!important;
    padding:12px 14px!important;
    border-radius:14px!important;
    text-align:left!important;
  }
  .menu-toggle{position:relative!important;z-index:10000!important;cursor:pointer!important;}

  .agency-hero .agency-stage{
    height:760px!important;
    margin-top:52px!important;
  }
  .agency-hero .agency-portrait-wrap{
    width:210px!important;
    height:210px!important;
    top:0!important;
    left:50%!important;
    transform:translateX(-50%)!important;
  }
  .agency-hero .agency-orbit{
    width:236px!important;
    height:236px!important;
    top:-13px!important;
    left:50%!important;
    transform:translateX(-50%)!important;
  }
  .agency-hero .agency-glass-panel{
    top:154px!important;
    min-height:570px!important;
    padding:76px 16px 18px!important;
    border-radius:30px!important;
  }
  .agency-hero .agency-panel-head{
    min-height:0!important;
    height:auto!important;
    display:block!important;
  }
  .agency-hero .agency-metric{
    display:grid!important;
    grid-template-columns:94px minmax(0,1fr)!important;
    align-items:center!important;
    max-width:100%!important;
    margin:0 auto!important;
  }
  .agency-hero .agency-metric-left{
    padding-right:14px!important;
    border-right:1px solid #d6d6d6!important;
  }
  .agency-hero .agency-metric-left strong{
    font-size:34px!important;
    line-height:.92!important;
  }
  .agency-hero .agency-metric-left em{
    font-size:11px!important;
    margin-top:6px!important;
  }
  .agency-hero .agency-metric span{
    padding-left:14px!important;
    font-size:11px!important;
    line-height:1.3!important;
    max-width:none!important;
  }
  .agency-hero .agency-platforms{
    justify-self:auto!important;
    align-items:center!important;
    margin:18px auto 0!important;
    padding-right:0!important;
  }
  .agency-hero .platform-social-box{
    gap:10px!important;
    padding:8px 10px!important;
  }
  .agency-hero .platform-social-btn{
    width:40px!important;
    height:40px!important;
    flex:0 0 40px!important;
    border-radius:13px!important;
  }
  .agency-hero .platform-social-btn svg{
    width:22px!important;
    height:22px!important;
  }
  .agency-hero .agency-platforms small{
    font-size:12px!important;
    padding:8px 13px!important;
  }
  .agency-hero .agency-team-row{
    grid-template-columns:1fr!important;
    gap:10px!important;
    margin-top:16px!important;
  }
  .agency-hero .agency-team-card{
    min-height:72px!important;
    height:72px!important;
    grid-template-columns:48px 1fr 40px!important;
    gap:10px!important;
    padding:0 12px!important;
    border-radius:20px!important;
  }
  .agency-hero .agency-team-avatar{
    width:44px!important;
    height:44px!important;
  }
  .agency-hero .agency-team-copy b{font-size:14px!important;}
  .agency-hero .agency-team-copy small{font-size:11px!important;margin-top:3px!important;}
  .agency-hero .agency-team-icon{
    width:36px!important;
    height:36px!important;
    border-radius:12px!important;
    font-size:18px!important;
  }
}

@media(max-width:620px){
  .agency-hero .agency-stage{
    height:745px!important;
    margin-top:46px!important;
  }
  .agency-hero .agency-portrait-wrap{
    width:200px!important;
    height:200px!important;
    top:0!important;
  }
  .agency-hero .agency-orbit{
    width:226px!important;
    height:226px!important;
    top:-13px!important;
  }
  .agency-hero .agency-glass-panel{
    top:150px!important;
    min-height:560px!important;
    padding:70px 14px 16px!important;
  }
}

/* 2026-10-11 mobile orbit + metric correction */
@keyframes agencyOrbitSpinMobile{
  from{transform:translateX(-50%) rotate(0deg)}
  to{transform:translateX(-50%) rotate(360deg)}
}

@media(max-width:820px){
  .agency-hero .agency-orbit{
    animation:agencyOrbitSpinMobile 7s linear infinite!important;
    transform-origin:center center!important;
    will-change:transform!important;
  }
  .agency-hero .agency-orbit:before{
    border-width:4px!important;
  }

  .agency-hero .agency-metric{
    grid-template-columns:80px minmax(0,1fr)!important;
    column-gap:0!important;
    align-items:start!important;
  }
  .agency-hero .agency-metric-left{
    padding-right:10px!important;
    min-width:0!important;
  }
  .agency-hero .agency-metric-left strong{
    font-size:28px!important;
    line-height:.95!important;
    letter-spacing:-.06em!important;
    white-space:nowrap!important;
  }
  .agency-hero .agency-metric-left em{
    font-size:10px!important;
    line-height:1.15!important;
    margin-top:5px!important;
    white-space:nowrap!important;
  }
  .agency-hero .agency-metric span{
    padding-left:10px!important;
    font-size:10px!important;
    line-height:1.28!important;
    max-width:170px!important;
  }
}

@media(max-width:620px){
  .agency-hero .agency-metric{
    grid-template-columns:76px minmax(0,1fr)!important;
  }
  .agency-hero .agency-metric-left strong{
    font-size:26px!important;
  }
  .agency-hero .agency-metric-left em{
    font-size:9.5px!important;
  }
  .agency-hero .agency-metric span{
    font-size:9.5px!important;
    line-height:1.25!important;
    max-width:160px!important;
  }
}