/* ==========================================================================
   Korero — HelpScout Docs Site Theme
   Brand tokens: Korero Green #55D8C2 / Navy #19394f / Blue #003D50
   Font: DM Sans (Sofia Pro substitute for web contexts)
   ========================================================================== */

@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700;900&display=swap');

:root {
  --korero-green: #55D8C2;
  --korero-navy: #19394f;
  --korero-blue: #003D50;
  --korero-dark-green: #214739;
  --korero-peach: #FEB293;
  --korero-pink: #FF7683;
  --korero-black: #1C211F;
  --korero-white: #FFFFFF;
  --korero-green-tint: #E8FAF7;
  --korero-bg: #F7F8F8;

  --radius-sm: 6px;
  --radius-md: 10px;
  --radius-lg: 14px;
  --transition-fast: 0.15s ease;
  --transition-med: 0.25s ease;
}

/* --------------------------------------------------------------------------
   Base
   -------------------------------------------------------------------------- */

html, body {
  font-family: 'DM Sans', -apple-system, BlinkMacSystemFont, sans-serif;
  font-weight: 400;
  color: var(--korero-black);
}

body {
  background-color: var(--korero-bg);
}

h1, .h1, h2, .h2, h3, .h3, h4, .h4, h5, .h5, h6, .h6 {
  font-family: 'DM Sans', sans-serif;
  font-weight: 700;
  color: var(--korero-navy) !important;
  letter-spacing: -0.01em;
}

a {
  transition: color var(--transition-fast);
}

/* --------------------------------------------------------------------------
   Top nav / logo
   -------------------------------------------------------------------------- */

#mainNav .navbar-inner {
  background: none;
}

.navbar-inner {
  box-shadow: none;
  border-bottom: 1px solid rgba(25, 57, 79, 0.06);
}

/* Logo — embedded inline as a data URI, no external asset dependency */
#mainNav .brand {
  width: 100%;
  background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%20189.9746%2078.4298%22%3E%3Cg%3E%3Crect%20x%3D%2258.2538%22%20y%3D%2210.0079%22%20width%3D%2213.7231%22%20height%3D%223.8201%22%20fill%3D%22%2355d8c2%22/%3E%3Cpath%20d%3D%22M115.5788%2C35.459a7.6348%2C7.6348%2C0%2C0%2C1-13.4557-3.2264h14.9442l-.0015.0064h4.8306a12.1968%2C12.1968%2C0%2C0%2C0%2C.0792-1.3683%2C12.3052%2C12.3052%2C0%2C1%2C0-1.6744%2C6.1384Zm-5.9836-12.0585a7.6181%2C7.6181%2C0%2C0%2C1%2C7.0143%2C4.587H102.581A7.618%2C7.618%2C0%2C0%2C1%2C109.5952%2C23.4005Z%22%20fill%3D%22%2319394f%22/%3E%3Cpath%20d%3D%22M65.1153%2C43.1167A12.2467%2C12.2467%2C0%2C1%2C1%2C77.4959%2C30.8708%2C12.3276%2C12.3276%2C0%2C0%2C1%2C65.1153%2C43.1167Zm0-19.7162a7.4715%2C7.4715%2C0%2C1%2C0%2C7.6049%2C7.47A7.547%2C7.547%2C0%2C0%2C0%2C65.1153%2C23.4005Z%22%20fill%3D%22%2319394f%22/%3E%3Cpath%20d%3D%22M153.84%2C43.1167a12.2467%2C12.2467%2C0%2C1%2C1%2C12.3805-12.2459A12.3275%2C12.3275%2C0%2C0%2C1%2C153.84%2C43.1167Zm0-19.7162a7.4715%2C7.4715%2C0%2C1%2C0%2C7.6049%2C7.47A7.5471%2C7.5471%2C0%2C0%2C0%2C153.84%2C23.4005Z%22%20fill%3D%22%2319394f%22/%3E%3Cpath%20d%3D%22M39.6136%2C25.4033A31.8762%2C31.8762%2C0%2C0%2C0%2C50.0715%2C10H45.04a27.0623%2C27.0623%2C0%2C0%2C1-9.5469%2C12.5392l-2.52%2C1.8118V10H28.3043V42.5653h4.6694v-16.11l2.5192%2C1.8125A27.0728%2C27.0728%2C0%2C0%2C1%2C45.6078%2C42.5232h4.9441A31.8894%2C31.8894%2C0%2C0%2C0%2C39.6136%2C25.4033Z%22%20fill%3D%22%2319394f%22/%3E%3Cpath%20d%3D%22M65.0288%2C68.43l-2.665-3.7035a20.7415%2C20.7415%2C0%2C0%2C0-16.798-8.6093H35.468A25.497%2C25.497%2C0%2C0%2C1%2C10%2C30.6488V26.3271h4.7757v4.3217A20.7157%2C20.7157%2C0%2C0%2C0%2C35.468%2C51.3413H45.5658a25.5363%2C25.5363%2C0%2C0%2C1%2C19.463%2C9.043%2C25.5372%2C25.5372%2C0%2C0%2C1%2C19.4628-9.043h70.0148a20.7158%2C20.7158%2C0%2C0%2C0%2C20.6925-20.6925V26.3271h4.7757v4.3217A25.4971%2C25.4971%2C0%2C0%2C1%2C154.5064%2C56.117H84.4916A20.7409%2C20.7409%2C0%2C0%2C0%2C67.694%2C64.7263Z%22%20fill%3D%22%2355d8c2%22/%3E%3Cpath%20d%3D%22M94.974%2C18.3193a11.22%2C11.22%2C0%2C0%2C0-7.2086%2C3.7494l.0056-3.47-4.7757-.0076-.0383%2C23.955%2C4.7756.0077.02-12.2243a7.2072%2C7.2072%2C0%2C0%2C1%2C6.4324-7.1924%2C5.4389%2C5.4389%2C0%2C0%2C1%2C.7817-.03Z%22%20fill%3D%22%2319394f%22/%3E%3Cpath%20d%3D%22M139.3157%2C18.3193a11.22%2C11.22%2C0%2C0%2C0-7.2086%2C3.7494l.0055-3.47-4.7756-.0076-.0383%2C23.955%2C4.7756.0077.02-12.2243a7.2072%2C7.2072%2C0%2C0%2C1%2C6.4324-7.1924%2C5.4389%2C5.4389%2C0%2C0%2C1%2C.7817-.03Z%22%20fill%3D%22%2319394f%22/%3E%3C/g%3E%3C/svg%3E");
  background-size: 11rem;
  background-repeat: no-repeat;
  background-position-y: 12px;
  background-position-x: center;
  height: 3.4rem;
}

#inner-page #mainNav .brand {
  background-image: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%20189.9746%2078.4298%22%3E%3Cg%3E%3Crect%20x%3D%2258.2538%22%20y%3D%2210.0079%22%20width%3D%2213.7231%22%20height%3D%223.8201%22%20fill%3D%22%2355d8c2%22/%3E%3Cpath%20d%3D%22M115.5788%2C35.459a7.6348%2C7.6348%2C0%2C0%2C1-13.4557-3.2264h14.9442l-.0015.0064h4.8306a12.1968%2C12.1968%2C0%2C0%2C0%2C.0792-1.3683%2C12.3052%2C12.3052%2C0%2C1%2C0-1.6744%2C6.1384Zm-5.9836-12.0585a7.6181%2C7.6181%2C0%2C0%2C1%2C7.0143%2C4.587H102.581A7.618%2C7.618%2C0%2C0%2C1%2C109.5952%2C23.4005Z%22%20fill%3D%22%2319394f%22/%3E%3Cpath%20d%3D%22M65.1153%2C43.1167A12.2467%2C12.2467%2C0%2C1%2C1%2C77.4959%2C30.8708%2C12.3276%2C12.3276%2C0%2C0%2C1%2C65.1153%2C43.1167Zm0-19.7162a7.4715%2C7.4715%2C0%2C1%2C0%2C7.6049%2C7.47A7.547%2C7.547%2C0%2C0%2C0%2C65.1153%2C23.4005Z%22%20fill%3D%22%2319394f%22/%3E%3Cpath%20d%3D%22M153.84%2C43.1167a12.2467%2C12.2467%2C0%2C1%2C1%2C12.3805-12.2459A12.3275%2C12.3275%2C0%2C0%2C1%2C153.84%2C43.1167Zm0-19.7162a7.4715%2C7.4715%2C0%2C1%2C0%2C7.6049%2C7.47A7.5471%2C7.5471%2C0%2C0%2C0%2C153.84%2C23.4005Z%22%20fill%3D%22%2319394f%22/%3E%3Cpath%20d%3D%22M39.6136%2C25.4033A31.8762%2C31.8762%2C0%2C0%2C0%2C50.0715%2C10H45.04a27.0623%2C27.0623%2C0%2C0%2C1-9.5469%2C12.5392l-2.52%2C1.8118V10H28.3043V42.5653h4.6694v-16.11l2.5192%2C1.8125A27.0728%2C27.0728%2C0%2C0%2C1%2C45.6078%2C42.5232h4.9441A31.8894%2C31.8894%2C0%2C0%2C0%2C39.6136%2C25.4033Z%22%20fill%3D%22%2319394f%22/%3E%3Cpath%20d%3D%22M65.0288%2C68.43l-2.665-3.7035a20.7415%2C20.7415%2C0%2C0%2C0-16.798-8.6093H35.468A25.497%2C25.497%2C0%2C0%2C1%2C10%2C30.6488V26.3271h4.7757v4.3217A20.7157%2C20.7157%2C0%2C0%2C0%2C35.468%2C51.3413H45.5658a25.5363%2C25.5363%2C0%2C0%2C1%2C19.463%2C9.043%2C25.5372%2C25.5372%2C0%2C0%2C1%2C19.4628-9.043h70.0148a20.7158%2C20.7158%2C0%2C0%2C0%2C20.6925-20.6925V26.3271h4.7757v4.3217A25.4971%2C25.4971%2C0%2C0%2C1%2C154.5064%2C56.117H84.4916A20.7409%2C20.7409%2C0%2C0%2C0%2C67.694%2C64.7263Z%22%20fill%3D%22%2355d8c2%22/%3E%3Cpath%20d%3D%22M94.974%2C18.3193a11.22%2C11.22%2C0%2C0%2C0-7.2086%2C3.7494l.0056-3.47-4.7757-.0076-.0383%2C23.955%2C4.7756.0077.02-12.2243a7.2072%2C7.2072%2C0%2C0%2C1%2C6.4324-7.1924%2C5.4389%2C5.4389%2C0%2C0%2C1%2C.7817-.03Z%22%20fill%3D%22%2319394f%22/%3E%3Cpath%20d%3D%22M139.3157%2C18.3193a11.22%2C11.22%2C0%2C0%2C0-7.2086%2C3.7494l.0055-3.47-4.7756-.0076-.0383%2C23.955%2C4.7756.0077.02-12.2243a7.2072%2C7.2072%2C0%2C0%2C1%2C6.4324-7.1924%2C5.4389%2C5.4389%2C0%2C0%2C1%2C.7817-.03Z%22%20fill%3D%22%2319394f%22/%3E%3C/g%3E%3C/svg%3E") !important;
}

.brand span {
  display: none;
}

#inner-page .navbar .nav li a {
  color: var(--korero-white);
  font-weight: 500;
}

#contact {
  display: none;
}

/* --------------------------------------------------------------------------
   Search
   -------------------------------------------------------------------------- */

#docsSearch {
  background: none;
  border-bottom: none;
}

#searchBar button {
  background-color: var(--korero-blue);
  border: 1px solid var(--korero-blue);
  border-radius: var(--radius-sm);
  width: 120px;
  font-weight: 500;
  transition: background-color var(--transition-fast), border-color var(--transition-fast);
}

#searchBar button:hover {
  background-color: var(--korero-green);
  border: 1px solid var(--korero-green);
  color: var(--korero-navy);
  text-shadow: none !important;
}

@media screen and (min-width: 769px) {
  #searchBar .search-query {
    display: block;
    width: 480px;
    border-radius: var(--radius-sm);
  }
}

@media screen and (max-width: 480px) {
  #searchBar button {
    width: 80px;
  }
}

/* --------------------------------------------------------------------------
   Category cards
   -------------------------------------------------------------------------- */

.category-list .category {
  border-radius: var(--radius-lg);
  box-shadow: rgba(25, 57, 79, 0.04) 0px 0px 0px 1px, rgba(25, 57, 79, 0.05) 0px 3px 10px 0px;
  padding: 135px 20px 40px;
  margin: 0 30px 30px 30px;
  background-color: var(--korero-green-tint);
  min-height: 345px;
  box-sizing: border-box;
  transition: box-shadow var(--transition-med), transform var(--transition-med);
}

.category-list .category:hover {
  box-shadow: rgba(25, 57, 79, 0.06) 0px 0px 0px 1px, rgba(85, 216, 194, 0.25) 0px 8px 20px 0px;
  transform: translateY(-2px);
}

.category-list .category,
.category-list .category:hover {
  background-repeat: no-repeat;
  background-position: center 36px;
  background-size: 80px 80px;
}

@media screen and (min-width: 1105px) {
  .category-list .category {
    width: calc(100%/3 - 63px);
  }
}

@media screen and (min-width: 601px) and (max-width: 1104px) {
  .category-list .category {
    width: calc(100%/2 - 62px);
  }
}

@media screen and (max-width: 600px) {
  .category-list .category {
    margin-right: 0;
    margin-left: 0;
  }
}

/* --------------------------------------------------------------------------
   Sidebar
   -------------------------------------------------------------------------- */

#sidebar .nav-list {
  font-size: 14px;
}

#sidebar h3 {
  font-size: 16px;
  font-weight: 700;
}

#sidebar .nav-list a {
  color: var(--korero-navy);
  transition: color var(--transition-fast);
}

#sidebar .nav-list a:hover {
  color: var(--korero-green);
}

#sidebar .nav-list .active a,
#sidebar .nav-list .active a:hover {
  color: var(--korero-blue);
  font-weight: 600;
  border-left: 2px solid var(--korero-green);
  padding-left: 10px;
  margin-left: -12px;
}

/* --------------------------------------------------------------------------
   Article text
   -------------------------------------------------------------------------- */

.articleFoot p {
  font-family: 'DM Sans', sans-serif;
  font-style: normal;
  color: var(--korero-black);
}

article a {
  color: var(--korero-blue);
  border-bottom: 1px solid var(--korero-green);
}

article a:hover {
  color: var(--korero-navy);
}
