/* ==========================================================================
   Observability & Audit hero — kicker + big title + subtitle + two buttons,
   text-only. Cool #f4f7fd band, blue primary (#0036FA -> #4E87FC).
   ========================================================================== */
.pg-ob-hero { background-color:#f4f7fd; padding:112px 0 120px; overflow:hidden; }
.pg-ob-hero__inner { max-width:1280px; margin:0 auto; padding:0 80px; }

.pg-ob-hero__kicker {
  font-family:"Cabin",sans-serif; font-weight:600; font-size:14px; line-height:16px;
  letter-spacing:0.08em; text-transform:uppercase;
  background:linear-gradient(90deg,#0036fa,#4e87fc); -webkit-background-clip:text; background-clip:text; color:transparent;
}
.pg-ob-hero__title {
  font-family:"Cabin",sans-serif; font-weight:700; font-size:60px; line-height:1.06;
  letter-spacing:-0.01em; color:#12140f; margin-top:22px;
}
.pg-ob-hero__subtitle {
  font-family:"Cabin",sans-serif; font-weight:400; font-size:18px; line-height:29px;
  color:#4d4d4d; max-width:640px; margin-top:22px;
}

.pg-ob-hero__actions { display:flex; flex-wrap:wrap; gap:14px; margin-top:34px; }
.pg-ob-hero__btn {
  display:inline-flex; align-items:center; justify-content:center; padding:14px 26px; border-radius:10px;
  font-family:"Cabin",sans-serif; font-weight:600; font-size:15px; line-height:1; text-decoration:none;
  transition:transform 0.3s ease, box-shadow 0.3s ease, border-color 0.3s ease, color 0.3s ease;
}
.pg-ob-hero__btn--solid { color:#fff; background-image:linear-gradient(90deg,#0036fa,#4e87fc); box-shadow:0 10px 24px rgba(0,54,250,0.24); }
.pg-ob-hero__btn--solid:hover { transform:translateY(-1px); box-shadow:0 16px 30px rgba(0,54,250,0.3); }
.pg-ob-hero__btn--outline { color:#12140f; background-color:#fff; border:1px solid #cfd6e6; }
.pg-ob-hero__btn--outline:hover { border-color:#0036fa; color:#0036fa; }

.pg-ob-hero__copy { opacity:0; transform:translateY(16px); transition:opacity 0.6s ease, transform 0.6s ease; }
.pg-ob-hero__copy.is-in { opacity:1; transform:none; }
@media (prefers-reduced-motion: reduce) { .pg-ob-hero__copy { opacity:1; transform:none; transition:none; } }

@media (max-width:1040px) {
  .pg-ob-hero { padding:84px 0 90px; }
  .pg-ob-hero__inner { padding:0 24px; }
  .pg-ob-hero__title { font-size:42px; }
}
@media (max-width:600px) {
  .pg-ob-hero__title { font-size:34px; }
  .pg-ob-hero__subtitle { font-size:16px; line-height:27px; }
}