/*
Theme Name:        MSS
Theme URI:         https://example.com/mss
Author:            BEN
Author URI:        https://example.com
Description:       A clean WordPress theme scaffold with ACF-ready layouts and blocks.
Version:           0.1.0
Requires at least: 6.4
Tested up to:      6.9
Requires PHP:      8.1
License:           GPL-2.0-or-later
License URI:       https://www.gnu.org/licenses/gpl-2.0.html
Text Domain:       mss
Tags:              custom-logo, custom-menu, featured-images, block-styles, wide-blocks
*/
:root {
  --mss-font-main: "Manrope", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

html,
body {
  font-family: var(--mss-font-main);
}

.consultred,
.consultyellow,
.consultblue {
  position: relative;
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 18px;
  margin: 28px 0 !important;
  padding: clamp(20px, 3vw, 34px) !important;
  overflow: hidden;
  border: 1px solid #d8eee6;
  border-radius: 24px;
  background:
    radial-gradient(circle at 12% 10%, rgba(var(--mss-brand-primary-rgb, 0, 168, 107), 0.13), transparent 30%),
    linear-gradient(135deg, #f4fbf8 0%, #ffffff 58%, #eaf8f2 100%);
  box-shadow: 0 22px 60px rgba(20, 50, 56, 0.1);
}

.consultred::before,
.consultyellow::before,
.consultblue::before {
  content: "";
  position: absolute;
  inset: 18px;
  pointer-events: none;
  border: 1px solid rgba(var(--mss-brand-primary-rgb, 0, 168, 107), 0.12);
  border-radius: 20px;
}

.consultred::after,
.consultyellow::after,
.consultblue::after {
  content: "";
  position: absolute;
  right: -72px;
  top: -96px;
  width: 220px;
  height: 220px;
  border-radius: 50%;
  background: rgba(var(--mss-brand-primary-rgb, 0, 168, 107), 0.09);
}

.consultred > *,
.consultyellow > *,
.consultblue > * {
  position: relative;
  z-index: 1;
  min-width: 0;
}

.consultred .vc_column_container,
.consultyellow .vc_column_container,
.consultblue .vc_column_container {
  width: auto !important;
  float: none !important;
}

.consultred .vc_column-inner,
.consultyellow .vc_column-inner,
.consultblue .vc_column-inner {
  height: 100%;
  padding: 0 !important;
}

.consultred .wpb_wrapper,
.consultyellow .wpb_wrapper,
.consultblue .wpb_wrapper {
  height: 100%;
}

.consultred .wpb_text_column,
.consultyellow .wpb_text_column,
.consultblue .wpb_text_column {
  height: 100%;
  margin: 0 !important;
  padding: 22px;
  border: 1px solid rgba(var(--mss-brand-primary-rgb, 0, 168, 107), 0.14);
  border-radius: 18px;
  background: rgba(255, 255, 255, 0.86);
  box-shadow: 0 14px 36px rgba(20, 50, 56, 0.08);
}

.consultred h3,
.consultyellow h3,
.consultblue h3 {
  margin: 0 0 16px !important;
  color: #143238 !important;
  font-family: inherit !important;
  font-size: 1.05rem !important;
  font-weight: 850 !important;
  line-height: 1.28 !important;
  text-align: left !important;
}

.consultred h3 span,
.consultyellow h3 span,
.consultblue h3 span {
  color: #143238 !important;
  font-size: inherit !important;
}

.consultred ul,
.consultyellow ul,
.consultblue ul {
  display: grid;
  gap: 10px;
  list-style: none !important;
  margin: 0 !important;
  padding: 0 !important;
}

.consultred li,
.consultyellow li,
.consultblue li {
  position: relative;
  margin: 0 !important;
  padding: 10px 12px 10px 36px;
  border-radius: 14px;
  background: #f4fbf8;
  color: #2d4a3f !important;
  font-size: 0.98rem;
  font-weight: 700;
  line-height: 1.45;
  text-align: left !important;
}

.consultred li::before,
.consultyellow li::before,
.consultblue li::before {
  content: "";
  position: absolute;
  left: 13px;
  top: 16px;
  width: 10px;
  height: 10px;
  border: 3px solid var(--mss-brand-primary, #00a86b);
  border-radius: 50%;
  background: #ffffff;
}

.consultred li span,
.consultyellow li span,
.consultblue li span,
.consultred p span,
.consultyellow p span,
.consultblue p span {
  color: #2d4a3f !important;
}

.consultred .sprprava,
.consultyellow .sprprava,
.consultblue .sprprava {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 62px;
  margin: 0 !important;
  padding: 14px 18px;
  border: 1px solid var(--mss-brand-mint, #c8f0dc);
  border-radius: 16px;
  background: var(--mss-brand-primary-light, #e8f7f0);
  color: #143238 !important;
  font-size: clamp(1.05rem, 1.8vw, 1.28rem);
  font-weight: 850;
  line-height: 1.25;
  text-align: center;
  box-shadow: none;
}

.consultred .sprprava span,
.consultyellow .sprprava span,
.consultblue .sprprava span {
  color: #143238 !important;
}

@media (max-width: 980px) {
  .consultred,
  .consultyellow,
  .consultblue {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 640px) {
  .consultred,
  .consultyellow,
  .consultblue {
    padding: 16px !important;
    border-radius: 18px;
  }

  .consultred::before,
  .consultyellow::before,
  .consultblue::before {
    inset: 10px;
    border-radius: 14px;
  }

  .consultred .wpb_text_column,
  .consultyellow .wpb_text_column,
  .consultblue .wpb_text_column {
    padding: 18px;
  }
}
   
