:root {
  --v31-bg: #f5f7fb;
  --v31-surface: #ffffff;
  --v31-surface-alt: #f8fbff;
  --v31-ink: #1f2a44;
  --v31-muted: #61728a;
  --v31-line: #dfe6ef;
  --v31-blue: #1f6feb;
  --v31-orange: #f26b4a;
  --v31-footer: #2b2f3a;
  --v31-shadow: 0 22px 52px rgba(31, 42, 68, 0.08);
  --v31-shadow-soft: 0 16px 36px rgba(31, 42, 68, 0.07);
  --v31-hero-bg:
    radial-gradient(circle at top left, rgba(31, 111, 235, 0.08), transparent 32%),
    radial-gradient(circle at bottom right, rgba(160, 64, 224, 0.08), transparent 36%),
    linear-gradient(135deg, #f2f6ff, #fff7ef);
}

body[class*="layout-"] {
  color: var(--v31-ink);
  overflow-x: hidden;
}

body.layout-hero-split,
body.layout-hero-demo,
body.layout-tool-guide,
body.layout-api-overview,
body.layout-static-content,
body.layout-pricing,
body.layout-hybrid {
  background: var(--v31-bg) !important;
}

body[class*="layout-"] h1,
body[class*="layout-"] h2,
body[class*="layout-"] h3,
body[class*="layout-"] h4,
body[class*="layout-"] h5,
body[class*="layout-"] h6 {
  color: var(--v31-ink);
}

body[class*="layout-"] p,
body[class*="layout-"] .card-text,
body[class*="layout-"] .card-subtitle,
body[class*="layout-"] .container-main-h2,
body[class*="layout-"] .lead,
body[class*="layout-"] .section-text li,
body[class*="layout-"] .section-text small,
body[class*="layout-"] .section-news article > span,
body[class*="layout-"] .center-block > span {
  color: var(--v31-muted);
}

body[class*="layout-"] .grey-span {
  color: var(--v31-muted) !important;
}

body[class*="layout-"] .bg-faded {
  background-color: transparent !important;
}

body[class*="layout-"] .section-footer.bg-inverse {
  background: var(--v31-footer) !important;
  color: #eef2f8 !important;
  border-top: 1px solid rgba(255, 255, 255, 0.07);
}

body[class*="layout-"] .section-footer.bg-inverse .nav-link,
body[class*="layout-"] .section-footer.bg-inverse small,
body[class*="layout-"] .section-footer.bg-inverse .media-body,
body[class*="layout-"] .section-footer.bg-inverse .nav-inline > li a,
body[class*="layout-"] .section-footer.bg-inverse span {
  color: rgba(255, 255, 255, 0.78) !important;
}

body[class*="layout-"] .section-footer.bg-inverse b,
body[class*="layout-"] .section-footer.bg-inverse .icon-caret-up {
  color: #ffffff !important;
}

body[class*="layout-"] .section-footer.bg-inverse .nav-link:hover,
body[class*="layout-"] .section-footer.bg-inverse .nav-link:focus,
body[class*="layout-"] .section-footer.bg-inverse .nav-inline > li a:hover,
body[class*="layout-"] .section-footer.bg-inverse .nav-inline > li a:focus {
  color: #ffffff !important;
}

body[class*="layout-"] .section-news,
body[class*="layout-"] .section-features,
body[class*="layout-"] .section-caption,
body[class*="layout-"] .section-text,
body[class*="layout-"] .section-intro,
body[class*="layout-"] .section-demo:not(.v3-demo),
body[class*="layout-"] .section-pricing {
  background-image: none !important;
  background-repeat: no-repeat !important;
}

body.layout-tool-guide .section-demo.v3-demo,
body.layout-hybrid .section-demo.v3-demo,
body.layout-static-content .section-demo.v3-demo,
body.layout-pricing .section-demo.v3-demo,
body.layout-api-overview .section-demo.v3-demo,
body.layout-hero-demo .section-demo.v3-demo,
body.layout-hero-split .section-demo.v3-demo {
  background: linear-gradient(180deg, rgba(242, 246, 255, 0.78), rgba(255, 247, 239, 0.42)) !important;
  background-repeat: no-repeat !important;
  box-shadow: inset 0 1px 0 rgba(223, 230, 239, 0.9), inset 0 -1px 0 rgba(223, 230, 239, 0.62);
}

body[class*="layout-"] .section-news figure img,
body[class*="layout-"] .section-features figure img,
body[class*="layout-"] .section-caption img.img-fluid,
body[class*="layout-"] .section-text img.img-fluid,
body[class*="layout-"] .right-header img,
body[class*="layout-"] header[role="banner"] > .container > img,
body[class*="layout-"] header[role="banner"] video {
  border: 1px solid rgba(223, 230, 239, 0.95);
  border-radius: 24px;
  background: #ffffff;
  box-shadow: var(--v31-shadow-soft);
}

body.layout-hero-split header[role="banner"],
body.layout-hero-demo header[role="banner"],
body.layout-tool-guide header[role="banner"],
body.layout-api-overview header[role="banner"],
body.layout-hybrid header[role="banner"] {
  padding-top: 94px;
}

body.layout-hero-split header[role="banner"] > .container,
body.layout-hero-demo header[role="banner"] > .container,
body.layout-tool-guide header[role="banner"] > .container,
body.layout-api-overview header[role="banner"] > .container,
body.layout-hybrid header[role="banner"] > .container {
  position: relative;
  overflow: hidden;
  padding: 34px 30px !important;
  border: 1px solid rgba(223, 230, 239, 0.95);
  border-radius: 30px;
  background: var(--v31-hero-bg);
  background-repeat: no-repeat;
  box-shadow: var(--v31-shadow);
}

body.layout-hero-split .container-main,
body.layout-hero-demo .container-main {
  display: grid;
  grid-template-columns: minmax(0, 1.02fr) minmax(320px, 0.98fr);
  gap: 28px;
  align-items: center;
  min-height: 0;
  margin-top: 0;
  margin-bottom: 0;
  max-width: none;
}

body.layout-hero-split .left-header,
body.layout-hero-split .right-header,
body.layout-hero-demo .left-header,
body.layout-hero-demo .right-header {
  float: none;
  width: auto;
  margin: 0;
  min-width: 0;
}

body.layout-hero-split .left-header .display-3,
body.layout-hero-demo .left-header .display-3 {
  margin-top: 0;
}

body.layout-hero-split .container-main-h2,
body.layout-hero-demo .container-main-h2 {
  margin-left: 0;
  margin-right: 0;
}

body.layout-tool-guide header[role="banner"] > .container,
body.layout-hybrid header[role="banner"] > .container {
  text-align: center;
}

body.layout-hybrid .container-main {
  min-height: 0;
  margin-top: 0;
  margin-bottom: 0;
}

body.layout-tool-guide .section-intro > .container,
body.layout-tool-guide .section-text > .container,
body.layout-tool-guide .section-caption > .container,
body.layout-hybrid .section-intro > .container,
body.layout-hybrid .section-text > .container,
body.layout-hybrid .section-caption > .container,
body.layout-static-content .section-text > .container,
body.layout-static-content .section-features > .container,
body.layout-static-content .section-news > .container,
body.layout-pricing .section-pricing > .container,
body.layout-api-overview .section-news > .container,
body.layout-api-overview .section-features > .container,
body.layout-hero-demo .section-news > .container,
body.layout-hero-split .section-news > .container {
  padding: 34px 30px;
}

body.layout-tool-guide .section-features .card,
body.layout-tool-guide .section-intro .card,
body.layout-hybrid .section-features .card,
body.layout-hero-demo .section-features .card,
body.layout-hero-split .section-features .card,
body.layout-api-overview .section-features .card,
body.layout-static-content .section-features .card {
  height: 100%;
  border: 1px solid rgba(223, 230, 239, 0.92) !important;
  border-radius: 24px !important;
  background: var(--v31-surface) !important;
  box-shadow: var(--v31-shadow-soft) !important;
}

body.layout-tool-guide .section-features .card-block,
body.layout-hybrid .section-features .card-block,
body.layout-hero-demo .section-features .card-block,
body.layout-hero-split .section-features .card-block,
body.layout-api-overview .section-features .card-block,
body.layout-static-content .section-features .card-block,
body.layout-pricing .card-block {
  padding: 28px 24px !important;
}

body.layout-tool-guide .section-demo:not(.v3-demo),
body.layout-hero-demo .section-demo:not(.v3-demo) {
  background: transparent !important;
  box-shadow: none !important;
}

body.layout-tool-guide .section-demo:not(.v3-demo) > div,
body.layout-hero-demo .section-demo:not(.v3-demo) > div {
  padding: 28px 24px 12px;
}

body.layout-api-overview .section-news article,
body.layout-hero-demo .section-news article,
body.layout-hero-split .section-news article {
  max-width: 560px;
}

body.layout-api-overview .section-news .row,
body.layout-hero-demo .section-news .row,
body.layout-hero-split .section-news .row,
body.layout-hybrid .section-news .row {
  margin-left: -18px;
  margin-right: -18px;
}

body.layout-api-overview .section-news .row > [class*="col-"],
body.layout-hero-demo .section-news .row > [class*="col-"],
body.layout-hero-split .section-news .row > [class*="col-"],
body.layout-hybrid .section-news .row > [class*="col-"] {
  padding-left: 18px !important;
  padding-right: 18px !important;
}

body.layout-api-overview .section-news .center-block,
body.layout-hero-demo .section-news .center-block,
body.layout-hero-split .section-news .center-block,
body.layout-hybrid .section-news .center-block {
  margin-left: 0;
  margin-right: 0;
}

body.layout-pricing .comparison,
body.layout-pricing table {
  background: var(--v31-surface);
  border-radius: 24px;
  overflow: hidden;
  box-shadow: var(--v31-shadow-soft);
}

body.layout-pricing .section-pricing > .container {
  padding-top: 42px;
}

body.layout-static-content header[role="banner"],
body.layout-static-content .section-text {
  padding-top: 88px;
}

body.layout-static-content .section-text > .container {
  max-width: 980px;
}

body.layout-hybrid.page-create-linkedin-post header[role="banner"] > .container {
  max-width: 860px;
}

body.layout-hybrid.page-graphic-design-tool header[role="banner"] > .container,
body.layout-hybrid.page-social-media-graphics header[role="banner"] > .container {
  max-width: 1080px;
}

body.layout-hybrid.page-graphic-design-tool .section-intro > .container,
body.layout-hybrid.page-social-media-graphics .section-intro > .container {
  padding: 34px 30px;
}

body.layout-home-v3 .section-footer.bg-inverse {
  background: var(--v31-footer) !important;
}

@media (max-width: 1000px) {
  body.layout-hero-split .container-main,
  body.layout-hero-demo .container-main {
    grid-template-columns: 1fr;
  }

  body.layout-hero-split header[role="banner"] > .container,
  body.layout-hero-demo header[role="banner"] > .container,
  body.layout-tool-guide header[role="banner"] > .container,
  body.layout-api-overview header[role="banner"] > .container,
  body.layout-hybrid header[role="banner"] > .container {
    padding: 28px 22px;
    border-radius: 22px;
  }

  body.layout-tool-guide .section-intro > .container,
  body.layout-tool-guide .section-text > .container,
  body.layout-tool-guide .section-caption > .container,
  body.layout-hybrid .section-intro > .container,
  body.layout-hybrid .section-text > .container,
  body.layout-hybrid .section-caption > .container,
  body.layout-static-content .section-text > .container,
  body.layout-static-content .section-features > .container,
  body.layout-static-content .section-news > .container,
  body.layout-pricing .section-pricing > .container,
  body.layout-api-overview .section-news > .container,
  body.layout-api-overview .section-features > .container,
  body.layout-hero-demo .section-news > .container,
  body.layout-hero-split .section-news > .container {
    padding: 28px 22px;
  }

  body.layout-api-overview .section-news .row,
  body.layout-hero-demo .section-news .row,
  body.layout-hero-split .section-news .row,
  body.layout-hybrid .section-news .row {
    margin-left: -12px;
    margin-right: -12px;
  }

  body.layout-api-overview .section-news .row > [class*="col-"],
  body.layout-hero-demo .section-news .row > [class*="col-"],
  body.layout-hero-split .section-news .row > [class*="col-"],
  body.layout-hybrid .section-news .row > [class*="col-"] {
    padding-left: 12px !important;
    padding-right: 12px !important;
  }

  body.layout-hero-split header[role="banner"],
  body.layout-hero-demo header[role="banner"],
  body.layout-tool-guide header[role="banner"],
  body.layout-api-overview header[role="banner"],
  body.layout-hybrid header[role="banner"],
  body.layout-static-content .section-text,
  body.layout-pricing .section-pricing {
    padding-top: 78px;
  }
}

@media (max-width: 700px) {
  body[class*="layout-"] .section-news figure img,
  body[class*="layout-"] .section-features figure img,
  body[class*="layout-"] .section-caption img.img-fluid,
  body[class*="layout-"] .section-text img.img-fluid,
  body[class*="layout-"] .right-header img,
  body[class*="layout-"] header[role="banner"] > .container > img,
  body[class*="layout-"] header[role="banner"] video {
    border-radius: 18px;
  }

  body.layout-tool-guide .section-features .card-block,
  body.layout-hybrid .section-features .card-block,
  body.layout-hero-demo .section-features .card-block,
  body.layout-hero-split .section-features .card-block,
  body.layout-api-overview .section-features .card-block,
  body.layout-static-content .section-features .card-block,
  body.layout-pricing .card-block {
    padding: 24px 20px !important;
  }
}
