/* Shared presentation layer for all Kaskad service and catalogue pages. */
:root{
  --kaskad-ink:#101820;
  --kaskad-muted:#637180;
  --kaskad-teal:#1f9f8c;
  --kaskad-line:#dce5e8;
  --kaskad-soft:#f4f8f8;
  --kaskad-shadow:0 18px 48px rgba(16,24,32,.10);
}

.page-hero{
  padding:40px max(5%,calc((100% - 1200px)/2)) 48px!important;
  background:
    radial-gradient(circle at 88% 18%,rgba(31,159,140,.13),transparent 30%),
    linear-gradient(145deg,#f8fbfb 0%,#eef5f5 100%)!important;
  border-bottom:1px solid var(--kaskad-line)!important;
}
.page-hero .breadcrumb{
  max-width:1200px!important;
  margin:0 auto 26px!important;
  color:var(--kaskad-muted)!important;
}
.page-hero-inner{
  width:100%!important;
  max-width:1200px!important;
  margin:0 auto!important;
  display:grid!important;
  grid-template-columns:minmax(0,1fr) minmax(350px,440px)!important;
  gap:clamp(34px,5vw,72px)!important;
  align-items:center!important;
}
.page-hero h1{
  max-width:780px!important;
  margin:0 0 16px!important;
  color:var(--kaskad-ink)!important;
  font-size:clamp(30px,3.15vw,48px)!important;
  line-height:1.08!important;
  letter-spacing:-.025em!important;
}
.page-hero p,.page-hero .hero-desc{
  max-width:760px!important;
  color:var(--kaskad-muted)!important;
  font-size:clamp(16px,1.25vw,19px)!important;
  line-height:1.65!important;
}
.page-hero-visual{
  width:100%!important;
  height:300px!important;
  border:1px solid rgba(16,24,32,.08)!important;
  border-radius:22px!important;
  overflow:hidden!important;
  background:#fff!important;
  box-shadow:var(--kaskad-shadow)!important;
}
.page-hero-visual img{
  display:block!important;
  width:100%!important;
  height:100%!important;
  object-fit:cover!important;
}
.page-hero-visual.product img{
  object-fit:contain!important;
  padding:22px!important;
  background:linear-gradient(145deg,#fff,#f3f7f8)!important;
}
.hero-features,.page-hero .chips{
  display:flex!important;
  flex-wrap:wrap!important;
  gap:9px!important;
  margin-top:23px!important;
}
.feat-chip,.page-hero .chip{
  border:1px solid rgba(31,159,140,.24)!important;
  border-radius:999px!important;
  background:rgba(255,255,255,.78)!important;
  color:#27635b!important;
  padding:8px 13px!important;
  font-size:13px!important;
  font-weight:700!important;
}
.series-card,.type-card,.real-work-card,.service-card,.product-card{
  border:1px solid var(--kaskad-line)!important;
  border-radius:18px!important;
  background:#fff!important;
  box-shadow:0 8px 25px rgba(16,24,32,.055)!important;
  overflow:hidden!important;
}
.real-work-card img{
  width:100%!important;
  aspect-ratio:4/3!important;
  object-fit:cover!important;
}
.btn-teal,.btn-ghost,.series-link,.m-cta{
  border-radius:10px!important;
  font-weight:700!important;
}

@media(max-width:900px){
  .page-hero{padding:32px 5% 38px!important}
  .page-hero-inner{grid-template-columns:1fr!important;gap:28px!important}
  .page-hero-visual{height:clamp(240px,58vw,380px)!important}
}
@media(max-width:560px){
  .page-hero{padding:26px 20px 32px!important}
  .page-hero .breadcrumb{margin-bottom:18px!important}
  .page-hero h1{font-size:30px!important}
  .page-hero-visual{height:230px!important;border-radius:16px!important}
  .page-hero-visual.product img{padding:14px!important}
  .feat-chip,.page-hero .chip{font-size:12px!important;padding:7px 10px!important}
}