/* =========================================================
   Cases — índice + páginas internas
   Depende de css/styles.css (tokens, nav, footer, btn, fab, eyebrow, reveal)
   ========================================================= */

/* nav active state */
.nav__link--active { color: var(--blue-light); border-bottom: 2px solid var(--blue); padding-bottom: 3px; }

.heading--md { font-size: clamp(38px, 4vw, 64px); }

/* category chip colors (white text reads on all) */
.cat { font-family: var(--cond); font-size: 14px; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: #fff; border-radius: 4px; padding: 7px 14px; display: inline-block; }
.cat--sm { font-size: 13px; letter-spacing: .12em; padding: 5px 12px; }
.cat--vendas      { background: #2D7DF6; }
.cat--lideranca   { background: #11315E; }
.cat--team        { background: #FF7A2F; }
.cat--atendimento { background: #0FA8C2; }
.cat--cs          { background: #1C56AC; }

.logo-box {
  display: inline-flex; align-items: center; justify-content: flex-start;
  flex-shrink: 0;
  min-width: 0;
}
.logo-box img { display: block; width: auto; height: auto; max-width: 190px; max-height: 72px; object-fit: contain; }
.logo-box--pair { gap: 10px; }
.logo-box--pair img { flex: 1 1 0; min-width: 0; }
.logo-box--pair img { max-width: 118px; max-height: 48px; }
.logo-box--light { }
.logo-box--plate {
  align-items: center;
  background: rgba(255,255,255,.94);
  border-radius: 8px;
  box-shadow: 0 14px 30px -20px rgba(0,0,0,.6);
  padding: 10px 16px;
}
.logo-box--plate img { max-width: 178px; max-height: 58px; }

/* =========================================================
   ÍNDICE — hero
   ========================================================= */
.cases-hero { position: relative; background: var(--bg-deep); padding: 200px 0 110px; overflow: hidden; }
.cases-hero__glow { position: absolute; inset: 0; background: radial-gradient(ellipse 60% 70% at 80% 10%, rgba(28,86,172,.3), rgba(5,14,29,0) 65%); }
.cases-hero__inner { position: relative; }
.cases-hero h1 { margin: 0 0 28px; max-width: 1000px; font-family: var(--cond); font-weight: 700; font-size: clamp(52px, 6vw, 100px); line-height: .94; text-transform: uppercase; color: #fff; text-wrap: balance; }
.cases-hero p { margin: 0; max-width: 640px; font-family: var(--serif); font-size: 19px; line-height: 1.65; color: var(--text-light); }

/* featured */
.cases-featured { background: var(--bg-deep); padding: 0 0 110px; }
.featured-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 28px; }
.feat-card { display: block; background: var(--navy); border: 1px solid rgba(111,168,255,.14); border-radius: 14px; overflow: hidden; text-decoration: none; transition: transform .35s ease, border-color .35s ease; }
.feat-card:hover { transform: translateY(-8px); border-color: rgba(45,125,246,.55); }
.feat-card__img { position: relative; height: 300px; background-size: cover; background-position: center; filter: saturate(.78); }
.feat-card__img .cat { position: absolute; top: 18px; left: 18px; }
.feat-card__body { padding: 36px 36px 40px; }
.feat-card__company { display: flex; align-items: center; gap: 14px; margin-bottom: 22px; min-width: 0; }
.feat-card__company span.name { font-family: var(--serif); font-size: 11px; font-weight: 600; letter-spacing: .05em; line-height: 1.15; text-transform: uppercase; color: var(--text-mute); }
.feat-card__label { margin: 0 0 6px; font-family: var(--cond); font-size: 15px; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: var(--blue-light); }
.feat-card__text { margin: 0 0 22px; font-family: var(--serif); font-size: 16px; line-height: 1.55; color: var(--text-light); }
.feat-card__link { display: inline-flex; align-items: center; gap: 10px; font-family: var(--cond); font-size: 17px; font-weight: 600; letter-spacing: .12em; text-transform: uppercase; color: var(--blue-light); }
.feat-card:hover .feat-card__link { gap: 16px; }

/* all projects + filters */
.cases-all { background: var(--light); padding: 110px 0 100px; }
.filters { display: flex; gap: 10px; flex-wrap: wrap; margin-bottom: 44px; }
.filter-chip { cursor: pointer; font-family: var(--cond); font-size: 17px; font-weight: 600; letter-spacing: .1em; text-transform: uppercase; color: var(--text-body); background: #fff; border: 1px solid var(--border); border-radius: 100px; padding: 11px 24px; transition: all .25s ease; }
.filter-chip:hover { border-color: var(--blue); color: var(--blue); }
.filter-chip.is-active { background: var(--navy); color: #fff; border-color: var(--navy); }

.case-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; }
.gcard { display: block; background: #fff; border-radius: 12px; overflow: hidden; box-shadow: 0 2px 8px rgba(10,27,51,.05); text-decoration: none; transition: transform .3s ease, box-shadow .3s ease; }
.gcard:hover { transform: translateY(-6px); box-shadow: 0 20px 44px -18px rgba(10,27,51,.16); }
.gcard__img { position: relative; height: 180px; background-size: cover; background-position: center; }
.gcard__img .cat { position: absolute; top: 14px; left: 14px; }
.gcard__body { padding: 24px 26px 28px; }
.gcard__company { display: flex; align-items: center; gap: 10px; margin-bottom: 16px; min-width: 0; }
.gcard__company .logo-box img { max-width: 176px; max-height: 72px; }
.gcard__company .logo-box--pair { gap: 8px; }
.gcard__company .logo-box--pair img { max-width: 88px; max-height: 40px; }
.gcard__company .name { flex: 1 1 auto; min-width: 0; font-family: var(--serif); font-size: 10px; font-weight: 600; letter-spacing: .035em; line-height: 1.15; text-transform: uppercase; color: var(--text-soft); }
.gcard__title { margin: 0 0 18px; font-family: var(--cond); font-size: 21px; font-weight: 600; line-height: 1.08; text-transform: uppercase; color: var(--navy); }
.gcard__link { display: inline-flex; align-items: center; gap: 8px; font-family: var(--cond); font-size: 15px; font-weight: 600; letter-spacing: .12em; text-transform: uppercase; }
.gcard:hover .gcard__link { gap: 14px; }
.gcard.is-hidden { display: none; }

/* impact (índice) */
.cases-impact { background: #fff; padding: 110px 0 100px; }

/* =========================================================
   PÁGINA INTERNA
   ========================================================= */
.case-hero { position: relative; background: var(--bg-deep); padding: 150px 0 80px; overflow: hidden; }
.case-hero__bg { position: absolute; inset: 0; background-size: cover; background-position: center; opacity: .22; filter: saturate(.5); }
.case-hero__veil { position: absolute; inset: 0; background: linear-gradient(180deg, rgba(5,14,29,.85) 0%, rgba(5,14,29,.7) 40%, #050E1D 100%); }
.case-hero__inner { position: relative; max-width: 1080px; margin: 0 auto; padding: 0 32px; }
.crumb { display: flex; align-items: center; gap: 12px; margin-bottom: 30px; font-family: var(--serif); font-size: 13px; font-weight: 600; letter-spacing: .04em; color: var(--text-soft); }
.crumb a { color: var(--blue-light); text-decoration: none; }
.crumb a:hover { color: #fff; }
.crumb .now { color: var(--text-mute); }
.case-hero__id { display: inline-flex; align-items: center; gap: 14px; margin-bottom: 28px; flex-wrap: wrap; }
.case-hero__id .company { display: flex; align-items: center; gap: 12px; min-width: 0; }
.case-hero__id .company .name { font-family: var(--serif); font-size: 13px; font-weight: 600; letter-spacing: .07em; line-height: 1.15; text-transform: uppercase; color: var(--text-mute); }
.case-title { margin: 0 0 28px; font-family: var(--cond); font-weight: 700; font-size: clamp(44px, 5.2vw, 86px); line-height: .96; text-transform: uppercase; color: #fff; text-wrap: balance; }
.case-sub { margin: 0; max-width: 720px; font-family: var(--serif); font-size: 19px; line-height: 1.65; color: var(--text-light); }

/* summary cards */
.case-summary { background: var(--bg-deep); padding: 0 0 100px; }
.case-summary__inner { max-width: 1080px; margin: 0 auto; padding: 0 32px; }
.summary-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; }
.sumcard { background: var(--navy); border: 1px solid rgba(111,168,255,.14); border-radius: 12px; padding: 32px 30px; }
.sumcard__label { margin: 0 0 14px; font-family: var(--cond); font-size: 15px; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: var(--blue-light); }
.sumcard__text { margin: 0; font-family: var(--serif); font-size: 16px; line-height: 1.6; color: var(--text-light); }
.sumcard--result { background: linear-gradient(135deg, #1C56AC, var(--blue)); border: 0; }
.sumcard--result .sumcard__label { color: rgba(255,255,255,.8); }
.sumcard__result { margin: 0; font-family: var(--cond); font-size: 30px; font-weight: 700; line-height: 1.04; text-transform: uppercase; color: #fff; }

/* story (white) */
.story { background: #fff; padding: 110px 0 100px; }
.story__inner { max-width: 880px; margin: 0 auto; padding: 0 32px; }
.story__block { margin-bottom: 64px; }
.story__block--tight { margin-bottom: 36px; }
.story__kicker { margin: 0 0 14px; font-family: var(--cond); font-size: 15px; font-weight: 700; letter-spacing: .2em; text-transform: uppercase; color: var(--blue); }
.story__h2 { margin: 0 0 22px; font-family: var(--cond); font-weight: 700; font-size: clamp(32px, 3.4vw, 50px); line-height: 1; text-transform: uppercase; color: var(--navy); }
.story__p { margin: 0 0 16px; font-family: var(--serif); font-size: 18px; line-height: 1.75; color: #2C4060; }
.story__p:last-child { margin-bottom: 0; }
.story__img { margin-bottom: 48px; border-radius: 14px; overflow: hidden; height: 380px; background-size: cover; background-position: center; }

.frentes { margin-bottom: 64px; }
.frente { display: flex; align-items: flex-start; gap: 20px; padding: 22px 0; border-top: 1px solid #E4EBF4; }
.frente:last-child { border-bottom: 1px solid #E4EBF4; }
.frente__n { font-family: var(--cond); font-size: 17px; font-weight: 700; color: var(--blue); min-width: 30px; padding-top: 2px; }
.frente p { margin: 0; font-family: var(--serif); font-size: 17px; line-height: 1.6; color: #2C4060; }
.frente strong { color: var(--navy); }

/* results */
.case-results { background: var(--light); padding: 100px 0; }
.case-results__inner { max-width: 1080px; margin: 0 auto; padding: 0 32px; }
.case-results h2 { margin: 0 0 56px; }
.results-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 24px; }
.rescard { background: #fff; border-radius: 12px; padding: 32px 30px; border-top: 3px solid var(--blue); box-shadow: 0 2px 8px rgba(10,27,51,.05); }
.rescard__title { margin: 0 0 10px; font-family: var(--cond); font-size: clamp(26px, 2.2vw, 34px); font-weight: 700; line-height: 1.02; text-transform: uppercase; color: var(--navy); }
.rescard__desc { margin: 0; font-family: var(--serif); font-size: 15.5px; line-height: 1.55; color: var(--text-body); }

/* proof (dark) */
.proof-sec { background: var(--bg-deep); padding: 110px 0; }
.proof-sec__inner { max-width: 1080px; margin: 0 auto; padding: 0 32px; }
.proof-sec__label { margin: 0 0 40px; font-family: var(--serif); font-size: 13px; font-weight: 700; letter-spacing: .34em; text-transform: uppercase; color: var(--text-soft); }
.quote-blk { padding: 36px 0; border-top: 1px solid rgba(111,168,255,.12); }
.quote-blk:first-of-type { border-top: 0; padding-top: 0; }
.quote-blk__mark { font-family: var(--cond); font-size: 72px; font-weight: 700; line-height: .5; color: var(--blue); display: block; margin-bottom: 22px; }
.quote-blk__text { margin: 0 0 24px; font-family: var(--cond); font-size: clamp(24px, 2.6vw, 38px); font-weight: 600; line-height: 1.2; text-transform: uppercase; color: #fff; text-wrap: balance; }
.quote-blk__author { display: flex; align-items: center; gap: 14px; }
.quote-blk__avatar { width: 52px; height: 52px; border-radius: 50%; background: var(--navy-2); display: flex; align-items: center; justify-content: center; font-family: var(--cond); font-size: 18px; font-weight: 700; color: var(--blue-light); }
.quote-blk__name { margin: 0; font-family: var(--serif); font-size: 16px; font-weight: 600; color: #fff; }
.quote-blk__role { margin: 2px 0 0; font-family: var(--serif); font-size: 14px; color: var(--blue-light); }
.case-gallery { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; margin-top: 40px; }
.case-gallery img { width: 100%; height: 240px; object-fit: cover; border-radius: 12px; display: block; }

/* pillars */
.case-pillars { background: #fff; padding: 100px 0; }
.case-pillars__inner { max-width: 1080px; margin: 0 auto; padding: 0 32px; }
.case-pillars h2 { margin: 0 0 48px; }
.pillars-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; }
.pcard { border: 1px solid #E4EBF4; border-radius: 12px; padding: 32px 30px; }
.pcard__bar { display: block; width: 40px; height: 3px; background: var(--blue); margin-bottom: 18px; }
.pcard h3 { margin: 0 0 10px; font-family: var(--cond); font-size: 26px; font-weight: 700; text-transform: uppercase; color: var(--navy); }
.pcard p { margin: 0; font-family: var(--serif); font-size: 15px; line-height: 1.6; color: var(--text-body); }

/* cta + related */
.case-cta { background: var(--bg-deep); padding: 100px 0 110px; }
.case-cta__inner { max-width: 1280px; margin: 0 auto; padding: 0 32px; }
.cta-box { background: linear-gradient(110deg, #11315E 0%, #1C56AC 60%, #2D7DF6 130%); border-radius: 18px; padding: 64px 56px; display: flex; align-items: center; justify-content: space-between; gap: 48px; flex-wrap: wrap; margin-bottom: 80px; }
.cta-box h2 { margin: 0; max-width: 560px; font-family: var(--cond); font-weight: 700; font-size: clamp(30px, 3.2vw, 48px); line-height: 1.04; text-transform: uppercase; color: #fff; text-wrap: balance; }
.cta-box__btns { display: flex; flex-direction: column; gap: 14px; }
.cta-box .btn { justify-content: center; }
.related-head { display: flex; align-items: baseline; justify-content: space-between; gap: 24px; margin-bottom: 32px; flex-wrap: wrap; }
.related-head h3 { margin: 0; font-family: var(--cond); font-weight: 700; font-size: clamp(28px, 3vw, 44px); text-transform: uppercase; color: #fff; }
.related-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; }
.rel-card { display: block; background: var(--navy); border: 1px solid rgba(111,168,255,.14); border-radius: 12px; overflow: hidden; text-decoration: none; transition: transform .35s ease, border-color .35s ease; }
.rel-card:hover { transform: translateY(-6px); border-color: rgba(45,125,246,.55); }
.rel-card__img { position: relative; height: 170px; background-size: cover; background-position: center; filter: saturate(.75); }
.rel-card__img .cat { position: absolute; top: 14px; left: 14px; }
.rel-card__body { padding: 26px 28px 30px; }
.rel-card__title { margin: 0 0 18px; font-family: var(--cond); font-size: 22px; font-weight: 600; line-height: 1.08; text-transform: uppercase; color: #fff; }
.rel-card__link { display: inline-flex; align-items: center; gap: 8px; font-family: var(--cond); font-size: 15px; font-weight: 600; letter-spacing: .12em; text-transform: uppercase; color: var(--blue-light); }

/* =========================================================
   Responsive
   ========================================================= */
@media (max-width: 1024px) {
  .featured-grid { grid-template-columns: 1fr; }
  .case-grid,
  .related-grid,
  .pillars-grid,
  .summary-grid { grid-template-columns: 1fr 1fr; }
  .case-gallery { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 760px) {
  .cases-hero { padding: 132px 0 72px; }
  .cases-hero h1 { font-size: clamp(42px, 13vw, 58px); line-height: .96; }
  .cases-hero p { font-size: 17px; line-height: 1.55; }
  .filter-chip { flex: 1 1 auto; justify-content: center; text-align: center; padding: 10px 14px; font-size: 15px; }
  .case-hero { padding: 112px 0 58px; }
  .case-hero__inner,
  .case-summary__inner,
  .story__inner,
  .case-results__inner,
  .proof-sec__inner,
  .case-pillars__inner,
  .case-cta__inner { padding-left: 22px; padding-right: 22px; }
  .case-hero__id { align-items: flex-start; gap: 10px; margin-bottom: 22px; }
  .case-hero__id .company { width: 100%; gap: 10px; }
  .case-hero__id .company .name { font-size: 11px; letter-spacing: .04em; overflow-wrap: anywhere; }
  .case-title { font-size: clamp(38px, 12vw, 56px); line-height: .98; }
  .case-sub { font-size: 17px; line-height: 1.55; }
  .logo-box img { max-width: 156px; max-height: 58px; }
  .logo-box--plate { padding: 9px 12px; max-width: 100%; }
  .logo-box--plate img { max-width: min(168px, calc(100vw - 72px)); max-height: 54px; }
  .gcard__body,
  .feat-card__body,
  .rel-card__body { padding: 24px 22px 28px; }
  .gcard__company { align-items: flex-start; flex-direction: column; gap: 8px; }
  .gcard__company .logo-box img { max-width: 168px; max-height: 66px; }
  .feat-card__company { align-items: flex-start; flex-direction: column; gap: 10px; }
  .case-grid,
  .related-grid,
  .pillars-grid,
  .summary-grid,
  .case-gallery { grid-template-columns: 1fr; }
  .cta-box { padding: 38px 24px; border-radius: 14px; }
  .cta-box__btns,
  .cta-box .btn { width: 100%; }
  .related-head { align-items: flex-start; }
  .story { padding: 78px 0 70px; }
  .story__img { height: 260px; }
  .frente { gap: 14px; }
  .rescard,
  .pcard,
  .sumcard { padding: 26px 22px; }
  .case-gallery img { height: 220px; }
}