/* ============================================================
   HERO description panel — "glass" box.
   Figma Rectangle 37 v2 (node 1616:32389):
     • fill: brand gradient #28609a -> #0e2034, fill-opacity .5 x
       layer-opacity .7 = ~.35 effective  (translucent)
     • GLASS effect -> backdrop blur
     • 1px gradient "rim": white -> light-blue (#8ec6dd) ->
       transparent accent (#3b9dc4 @0), bright at top-left, fading out
     • radius 10
   Targets every hero-panel variant:
     .mcb-wrap-inner-heropanel  -> Products / About Us
     .ts-hero-panel             -> Solutions (BG/EN)
     .sp-panel                  -> the 7 solution areas (BG/EN); their own page
                                   CSS keeps only max-width/padding, the look
                                   is owned here so all variants stay in step
     .mcb-column-inner-citsub .column_attr -> Contacts (BG/EN)
   Loaded site-wide; only matches pages that have a hero panel.
   ============================================================ */
.mcb-wrap-inner-heropanel,
.ts-hero-panel,
.sp-panel,
.mcb-column-inner-citsub .column_attr{
  position: relative;
  background-image: linear-gradient(to left, rgba(40,96,154,.35), rgba(14,32,52,.35)) !important;
  -webkit-backdrop-filter: blur(12px) !important;
          backdrop-filter: blur(12px) !important;
  border: 0 !important;          /* rim is drawn as a masked gradient via ::before */
  border-radius: 10px;
}

/* 1px gradient glass rim (respects the radius via the padding+mask trick) */
.mcb-wrap-inner-heropanel::before,
.ts-hero-panel::before,
.sp-panel::before,
.mcb-column-inner-citsub .column_attr::before{
  content: "";
  position: absolute;
  inset: 0;
  box-sizing: border-box;   /* the padding+mask trick measures the border box */
  /* Undo Betheme's clearfix, which claims the same pseudo-element:
       .clearfix::before { content:" "; display:block; height:0; width:0;
                           overflow:hidden; visibility:hidden; }
     The Contacts panel carries .clearfix (Products does not), so there the rim
     was forced to 0x0 and disappeared while looking correct everywhere else. */
  width: auto;
  height: auto;
  overflow: visible;
  visibility: visible;
  border-radius: 10px;
  padding: 1px;
  background: linear-gradient(150deg,
              rgba(255,255,255,.75) 0%,
              rgba(142,198,221,.5) 8%,
              rgba(59,157,196,0) 70%);
  -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
  -webkit-mask-composite: xor;
          mask-composite: exclude;
  pointer-events: none;
}