
:root{
  --dc-teal:#08a8b5; --dc-green:#72c843; --dc-orange:#ff963b; --dc-red:#ff3344;
  --dc-ink:#172733; --dc-muted:#687983; --dc-soft:#f5f8f9; --dc-line:#e7edef;
}
body{background:#f8fbfc;color:var(--dc-ink)}
header{background:#fff;box-shadow:0 3px 20px rgba(23,39,51,.05);border:0}
.nav{min-height:78px}
.nav nav a{position:relative;padding:29px 0 25px}
.nav nav a[href*="blog"]{color:var(--dc-teal)}
.nav nav a[href*="blog"]:after{content:"";position:absolute;left:0;right:0;bottom:19px;height:2px;background:var(--dc-teal);border-radius:3px}
.contact-btn,.primary-btn{background:linear-gradient(90deg,#079ca8,#08b5b2);box-shadow:0 8px 18px rgba(8,168,181,.18)}
.hero{
  min-height:420px;padding:0;background:#eef6f7;
  position:relative;display:flex;align-items:center;overflow:hidden
}
.hero:before{
  content:"";position:absolute;inset:0;
  background:
    linear-gradient(90deg,rgba(255,255,255,.99) 0%,rgba(255,255,255,.94) 34%,rgba(255,255,255,.30) 58%,rgba(255,255,255,.02) 100%),
    url('/insights/digital-catalyst-insights-banner.png') center right/cover no-repeat;
}
.hero:after{display:none}
.hero .container{position:relative;z-index:2;padding-top:54px;padding-bottom:54px}
.hero .eyebrow{display:none}
.hero h1{max-width:520px;font-size:clamp(42px,5vw,66px);line-height:1.04;margin:0 0 20px}
.hero h1 .growth{color:var(--dc-teal)}
.hero p{max-width:440px;font-size:15px;line-height:1.7}
.hero-brand-bars{display:flex;gap:6px;margin:20px 0 22px}
.hero-brand-bars i{display:block;width:27px;height:5px;border-radius:10px}
.hero-brand-bars i:nth-child(1){background:var(--dc-teal)}
.hero-brand-bars i:nth-child(2){background:var(--dc-green)}
.hero-brand-bars i:nth-child(3){background:var(--dc-orange)}
.hero-brand-bars i:nth-child(4){background:var(--dc-red)}
.toolbar{padding:20px 0 6px;margin-top:-1px;background:#f8fbfc}
.tools{
  background:#fff;border:1px solid var(--dc-line);border-radius:20px;padding:15px;
  box-shadow:0 10px 30px rgba(23,39,51,.05)
}
.filter{background:#f2f5f6;border-color:#f2f5f6;color:#354750;padding:11px 16px}
.filter.active{background:var(--dc-teal);border-color:var(--dc-teal)}
.search{background:#fff;min-width:265px;padding:12px 18px}
.result-row{margin:13px 5px 16px}
.grid{gap:22px}
.card{border:1px solid #e5ecee;border-radius:14px;box-shadow:0 8px 24px rgba(23,39,51,.055)}
.card:hover{transform:translateY(-5px);box-shadow:0 16px 34px rgba(23,39,51,.11)}
.card-media{height:205px;background:#eef4f5}
.card-cat{top:auto;bottom:-15px;left:14px;color:#fff!important;background:var(--dc-teal);border:4px solid #fff;padding:7px 12px}
.card:nth-child(4n+2) .card-cat{background:var(--dc-green)}
.card:nth-child(4n+3) .card-cat{background:var(--dc-orange)}
.card:nth-child(4n+4) .card-cat{background:var(--dc-red)}
.card-body{padding:27px 18px 20px}
.card h2{font-size:17px;line-height:1.3;margin:8px 0 8px}
.card p{font-size:12px;line-height:1.55;margin-bottom:13px}
.read{color:var(--dc-teal);font-size:12px}
.load-wrap{padding:24px 0 65px}
.load{min-width:220px}
.cta{margin:0 auto 0;background:transparent;color:var(--dc-ink);padding:0 0 55px}
.cta-inner{
  width:min(1180px,calc(100% - 40px));padding:38px 42px;border-radius:20px;
  background:
    radial-gradient(circle at 88% 50%,rgba(8,168,181,.16),transparent 24%),
    linear-gradient(100deg,#e7fafa,#f3fbfb);
  position:relative;overflow:hidden
}
.cta-inner:after{
  content:"";position:absolute;right:55px;bottom:28px;width:160px;height:95px;
  background:linear-gradient(90deg,var(--dc-teal) 0 24%,transparent 24% 28%,var(--dc-green) 28% 52%,transparent 52% 56%,var(--dc-orange) 56% 76%,transparent 76% 80%,var(--dc-red) 80%);
  border-radius:18px;opacity:.92;clip-path:polygon(0 50%,18% 35%,38% 45%,60% 20%,80% 30%,100% 0,100% 100%,0 100%)
}
.cta h2{font-size:clamp(27px,3vw,39px);max-width:620px;position:relative;z-index:2}
.cta p{color:var(--dc-muted);max-width:650px;position:relative;z-index:2}
.cta .primary-btn{position:relative;z-index:2}
.footer{background:#fff;color:#6e7d85;border-top:1px solid var(--dc-line);padding-top:40px}
.footer h3{color:var(--dc-ink)}
.footer .brand{color:var(--dc-teal)!important}
.footer .brand span{color:var(--dc-ink)!important}
.copy{border-top:1px solid var(--dc-line)}
@media(max-width:900px){
  .hero{min-height:380px}
  .hero:before{background:linear-gradient(90deg,rgba(255,255,255,.98),rgba(255,255,255,.80)),url('/insights/digital-catalyst-insights-banner.png') center/cover no-repeat}
  .hero h1{max-width:600px}
  .cta-inner:after{opacity:.28}
}
@media(max-width:600px){
  .hero{min-height:360px}
  .hero .container{padding-top:42px;padding-bottom:42px}
  .hero h1{font-size:40px;max-width:330px}
  .hero p{max-width:330px}
  .tools{border-radius:16px;padding:11px}
  .filters{flex-wrap:nowrap;overflow-x:auto;width:100%;padding-bottom:4px;scrollbar-width:none}
  .filters::-webkit-scrollbar{display:none}
  .filter{white-space:nowrap}
  .card-media{height:215px}
  .cta-inner{width:min(100% - 26px,1180px);padding:30px 24px}
  .cta-inner:after{display:none}
}
