/* 
Reset CSS 
*/

/* 1. Use a more-intuitive box-sizing model */
*,
*::before,
*::after {
  box-sizing: border-box;
}



/* 3. Enable keyword animations */
@media (prefers-reduced-motion: no-preference) {
  html {
    interpolate-size: allow-keywords;
  }
}

body {
  /* 5. Improve text rendering */
  -webkit-font-smoothing: antialiased;
}

/* 6. Improve media defaults */
img,
picture,
video,
canvas,
svg {
  display: block;
  max-width: 100%;
}

/* 7. Inherit fonts for form controls */
input,
button,
textarea,
select {
  font: inherit;
}

/* 8. Avoid text overflows */
p,
h1,
h2,
h3,
h4,
h5,
h6 {
  overflow-wrap: break-word;
}

/* 9. Improve line wrapping */
p {
  text-wrap: pretty;
}

/* h1,
h2,
h3,
h4,
h5,
h6 {
  text-wrap: balance;
} */

body.gspb-bodyfront.admin-bar #gspb_row-id-gsbp-1fd08c7 {
  top: 0;
}

@media (min-width: 768px) {
  body.gspb-bodyfront.admin-bar #gspb_row-id-gsbp-1fd08c7 {
    top: var(--wp-admin--admin-bar--height);
  }
}





.container {
  --container-gap: 90px;
  --global-padding-inline: 10px;
  max-width: 100%;
  padding-inline: var(--global-padding-inline);
}


@media (min-width: 768px) {

  .container {
    --global-padding-inline: 22px;
    padding-inline: var(--global-padding-inline);
  }

}

.full-container {
  margin-inline: calc(-1 * var(--global-padding-inline)) !important;
}

@media (max-width: 768px) {
  .m-full-container {
    width: 100vw !important;
    margin-inline: calc(-1 * var(--global-padding-inline)) !important;
  }

  .m-dark-bg {
    background-image: linear-gradient(0deg, rgb(0, 0, 0) 0%, rgb(0, 0, 0) 84%, rgba(255, 255, 255, 0) 100%);
  }

  .m-blury-bg {
    background-image: linear-gradient(0deg, #F9F7F0 0%, #F9F7EF 50%, #f9f7f000 100%);
    backdrop-filter: blur(5px);
    -webkit-backdrop-filter: blur(5px);

  }

  .mask img {
    -webkit-mask-image: linear-gradient(to bottom, black 0%, black 55%, transparent 100%);
    mask-image: linear-gradient(to bottom, black 0%, black 55%, transparent 100%);
  }


  .m-blury-bg::after {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
    opacity: 0.1;
    background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.8' numOctaves='4'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
  }

}

/* set no margin by default or use dynamic margin via variables */
.dme h1,
.dme h2,
.dme h3,
.dme h4,
.dme h5,
.dme h6,
.dme p {
  --margin-block-top: 0;
  --margin-block-bottom: 0;
  margin-top: var(--margin-block-top);
  margin-bottom: var(--margin-block-bottom);
}



.stack>*+* {
  margin-top: var(--wp--preset--spacing--md, 1.5rem);
}

.container>*+* {
  margin-top: var(--container-gap);
}

.container.no-gap,
.no-gap {
  --container-gap: 0;
}

.container.s-gap,
.s-gap {
  --container-gap: 20px;
}

.wrap {
  width: 85%;
  margin-inline: auto;
}

.wrap1 {
  width: 80%;
  margin-inline: auto;
}

.wrap2 {
  width: 70%;
  margin-inline: auto;
}

.wrap3 {
  width: 50%;
  margin-inline: auto;
}

.is-style-arrow-list {
  list-style-type: none;
  margin: 5px;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 18px;
}

.is-style-arrow-list li {
  font-size: var(--wp--preset--font-size--body-5);
}

.is-style-arrow-list li {
  color: #5F5F5F;
  position: relative;
  padding-right: 20px;
}

.is-style-arrow-list li::after {
  content: "›";
  position: absolute;
  right: 0;
  top: 50%;
  transform: translateY(-50%);
  font-size: 14px;
}

@media (max-width: 991.98px) {

  .wrap,
  .wrap1,
  .wrap2,
  .wrap3 {
    width: 100%;
  }
}

.wrap-marg {
  margin-top: 90px;
  margin-bottom: 90px;
}



input.hero {
  padding: 16px 20px;
  background-color: var(--wp--preset--color--surface-2);
  font-family: Inter Tight;
  font-weight: 500;
  font-size: 16px;
  line-height: 130%;
}

input.hero::placeholder {
  font-family: Inter Tight;
  font-weight: 500;
  font-size: 16px;
  line-height: 130%;
  color: var(--wp--preset--color--black);
}

.brb {
  border-radius: var(--wp--preset--border-radius--base);
}

.brlg {
  border-radius: var(--wp--preset--border-radius--lg);
}

/* 
  NAVIGATION STYLING START
*/

.menu-list,
.menu-list ul {
  list-style: none;
  margin: 0;
  padding: 0;
}

.menu-list {
  display: flex;
  align-items: center;
  gap: 30px;
}


.menu-list>li {
  position: relative;
}


.menu-list>li>a {
  display: block;
  padding: 15px 0;
  text-decoration: none;
  color: inherit;
}


.menu-list.has_child {
  position: absolute;
  top: 100%;
  left: 0;
  display: none;
  min-width: 260px;
  background: var(--wp--preset--color--surface-1);
  /* Increased width for 2 columns */
  border-radius: var(--wp--preset--border-radius--lg);
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.1);
  padding: 20px 24px;
  z-index: 9999;
}

/* SHOW SUBMENU */
.has_submenu:hover>.has_child {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
}

/* SUBMENU LINKS */
.menu-list.has_child>li>a {
  display: block;
  color: black;
  font-size: 14px;
  text-decoration: none;
  transition: color 0.2s ease;
  padding: 0;
}

/* HOVER STATES */
.menu-list>li>a:hover {
  color: #B05A36;
  background: transparent;
}

/* Submenu item hover */
.menu-list.has_child>li>a:hover {
  color: black;
  background: transparent;
}


/* DROPDOWN ICON */
.menu-list>.has_submenu>a {
  display: flex;
  align-items: center;
  gap: 10px;
}

.menu-list>.has_submenu>a::after {
  content: '';
  width: 8px;
  height: 8px;
  border-right: 2px solid currentColor;
  border-bottom: 2px solid currentColor;
  transform: rotate(45deg);
  margin-top: -4px;
  transition: transform 0.3s ease;
}

.has_submenu:hover>a::after {
  transform: rotate(-135deg);
  margin-top: 4px;
}

.mlink {
  display: none;
}

.navbar .gspb_meta_value {
  width: 100%;
}

@media (max-width: 576px) {

  .menu-list {
    flex-direction: column;
    align-items: flex-start;
    gap: 20px;

  }

  .menu-list>li>a {
    padding: 0 0 20px 0;
  }

  .menu-list>.has_submenu>a::after {
    width: 15px;
    height: 15px;
  }

  .menu-list:not(.has_child) {
    padding-top: 20px;
    border-top: 1px solid var(--wp--preset--color--border-1);
    border-bottom: 1px solid var(--wp--preset--color--border-1);
  }

  .menu-list:not(.has_child)>li:not(:last-child) {
    border-bottom: 1px solid var(--wp--preset--color--border-1);
  }

  .menu-list.has_child {
    position: static;
    display: none;
    background: transparent;
    padding-left: 0;
    border-radius: unset;
    box-shadow: none;
  }

  .menu-list>.has_submenu.open>.menu-list.has_child {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px;
    padding-top: 0;
    /* Optional: Ensure no unexpected gaps overrides margin */
  }

  .menu-list.has_child>li {
    width: 100%;
    /* Ensure they fill the grid cell */
  }

  .menu-list.has_child>li>a {
    font-family: var(--wp--preset--font-family--body-font);
    text-align: left;
    font-weight: 500;
    font-size: 14px;
    padding: 5px 0 5px 0;
    color: var(--wp--preset--color--gray-10);
  }



  /* Specific color for open parent item */
  /* This requires JS to toggle 'open' class usually, but if we target specific active state: */
  .has_submenu.open>a {
    color: inherit;
  }

  .has_submenu:hover>.has_child {
    display: none;
  }

  .mlink {
    display: block;
  }

  /* Full width list items on mobile */
  .menu-list>li {
    width: 100%;
  }


  /* Push dropdown icon to far right */
  .menu-list>.has_submenu>a {
    justify-content: space-between;
  }
}

/* 
  NAVIGATION STYLING END
*/


.is-style-heading-large {
  font-weight: 400;
  font-size: 60px;
  letter-spacing: -1%;
}

.is-style-surface-7 {
  font-size: var(--wp--preset--font-size--body-7);
  line-height: 130%;
  letter-spacing: 1.2px;
  text-transform: uppercase;
}


.is-style-surface-6 {
  font-weight: 500;
  font-size: 14px;
  line-height: 130%;
}

.is-style-surface-5 {
  font-weight: 500;
  font-size: 16px;
  line-height: 130%;
}

.is-style-surface-3 {
  font-weight: 400;
  font-size: 24px;
  line-height: 120%;
}

.is-style-surface-4 {
  font-weight: 400;
  font-size: 14px;
  line-height: 140%;
}

.is-style-sub-base {
  font-weight: 600;
  font-size: 14px;
  line-height: 120%;
  letter-spacing: 1.4px;
  text-transform: uppercase;
  margin-top: var(--wp--preset--spacing--sm);
  margin-bottom: var(--wp--preset--spacing--sm);
}

.gs_button {
  background-color: transparent;
  border-radius: 8px;
  border-color: var(--wp--preset--color--black);
  border-width: 1.2px;
  border-style: solid;
  color: var(--wp--preset--color--black);
  font-family: inherit;
  font-size: var(--wp--preset--font-size--body-7);
  font-style: inherit;
  font-weight: 500;
  letter-spacing: 0.1em;
  line-height: inherit;
  text-decoration: none;
  padding: 13px 36px;

  text-transform: uppercase;
}

.gs_button_secondary,
.wp-block-button__link.is-style-dark-btn,
.is-style-dark-btn>.wp-block-button__link {

  background-color: var(--wp--preset--color--black);
  color: var(--wp--preset--color--white);
  font-weight: 500;
  font-size: 13px;
  line-height: 120%;
  letter-spacing: 10%;

}

.wp-element-button.is-style-sm-btn,
.is-style-sm-btn>.wp-element-button {
  padding: 8px 16px;
}


.wp-element-button.is-style-inherit-btn,
.wp-block-button__link.is-style-inherit-btn,
.is-style-inherit-btn>.wp-block-button__link {
  background-color: inherit;
  color: inherit;
  border-color: inherit;
}

.is-italic span {
  display: block;
  word-break: break-all;
  font-style: italic;
}

.is-italic-nobreak span {
  font-style: italic;
}

.mbox img {
  border-radius: var(--wp--preset--border-radius--base);
}




/* ---------------------------------------
   MAIN WRAPPER
--------------------------------------- */
.clinic-procedure-tabs {
  background: #f7f4ec;
  padding: 24px;
  border-radius: 4px;
  font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

/* ---------------------------------------
   TABS HEADER
--------------------------------------- */
.procedure-tabs-header {
  display: flex;
  gap: 28px;
  border-bottom: 1px solid #dcd8cf;
  margin-bottom: 20px;
}

.procedure-tab-btn {
  background: none;
  border: none;
  padding: 12px 0;
  font-size: 15px;
  font-weight: 500;
  cursor: pointer;
  color: #6b6b6b;
  position: relative;
}

.procedure-tab-btn.active {
  color: #000;
}

.procedure-tab-btn.active::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: -1px;
  width: 100%;
  height: 2px;
  background: #000;
}

/* ---------------------------------------
   CONTENT AREA
--------------------------------------- */
.procedure-tabs-content {
  background: #efece4;
  padding: 18px 22px;
  border-radius: 4px;
}

/* ---------------------------------------
   PANELS (IMPORTANT PART)
--------------------------------------- */
.procedure-tab-panel {
  display: none;
}


.procedure-tab-panel.active {
  display: block;
}

/* ---------------------------------------
   LIST STYLING
--------------------------------------- */
.procedure-tab-panel ul {
  list-style: none;
  padding: 0;
  margin: 0;
}

.procedure-tab-panel li {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 14px 0;
  border-bottom: 1px solid rgba(0, 0, 0, 0.08);
}

.procedure-tab-panel li:last-child {
  border-bottom: none;
}

.procedure-tab-panel li span:first-child {
  font-weight: 500;
  color: #000;
}

.procedure-tab-panel li span:last-child {
  color: #d46a4a;
  font-weight: 500;
  white-space: nowrap;
}

.wrap img,
.wrap1 img,
.wrap2 img,
.wrap3 img {
  border-radius: var(--wp--preset--border-radius--base);
}

/* 
preset style of searchandfilter 
*/
.search-filter-input-group {
  display: flex;
  gap: 10px;
  flex-direction: column;
}

.search-filter-field--id-145 #search-filter-input-checkbox-0 {
  display: flex;
  gap: 20px;
  flex-direction: row;
}



.fc {
  font-size: var(--wp--preset--font-size--body-6);
}

.fc #search-filter-input-button-group-0 {
  display: flex;
  justify-content: center;
  gap: 6px;

  border-bottom-width: 1px;
  border-bottom-style: solid;
  border-bottom-color: var(--wp--preset--color--border-2, #53504833);
}

@media (max-width: 768px) {
  .search-filter-input-button-group {
    display: flex;
    flex-wrap: wrap;
  }
}


.fc {
  --search-filter-input-selected-color: black;
  --search-filter-input-selected-background-color: transparent;
  --search-filter-input-background-color: transparent;
  --search-filter-scale-font-size: 14px;
  --search-filter-scale-line-height: 130%;
  row-gap: 8px;
  column-gap: 8px;
}

.fc button {
  color: black;
}

/* .fc .search-filter-input-button {
  margin-right: 0;
  border: unset;
  padding: 10px;
} 
  
.fc .search-filter-input-button {
  margin-right: 0;
  border: unset;
  padding: 10px;
}

.search-filter-field__popup--id-122,
.search-filter-input-checkbox__control svg,
.search-filter-icon__svg,
.search-filter-icon svg {
  display: none !important;
}

*/

.fc #search-filter-input-button-group-0 button {
  margin-right: 0;
  border: unset;
  padding: 10px;
}

#search-filter-input-button-group-1 {
  gap: 6px;
  display: flex;
  flex-wrap: wrap;

}

#search-filter-input-button-group-1 button[data-option-value^="field_1/"] {
  display: none;
}

#search-filter-input-button-group-1 button {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  gap: 8px;
  text-transform: uppercase;
  font-size: var(--wp--preset--font-size--body-7);
  font-weight: 500;
  padding: 10px;
  border-radius: 4px;
  background-color: #eceae4 !important;
  border: unset !important;
}

#search-filter-input-button-group-1 svg {
  width: 13px;
  height: 13px;
}

.filter-accordion .search-filter-input-checkbox svg {
  display: none !important;
}

.fc {
  color: var(--wp--preset--color--black);
}

.fc .search-filter-input-button--is-selected {
  border-bottom: 2px solid black !important;
  border-radius: 0;
  font-weight: 600;
}

.fc .search-filter-input-button:focus,
.fc .search-filter-input-button:active {
  box-shadow: none;
}

.fc button {
  background: transparent !important;
  cursor: pointer !important;
}



.search-filter-input-checkbox__input {
  position: absolute;
  opacity: 0;
  pointer-events: none;
}

.search-filter-input-checkbox__control {
  width: 18px;
  height: 18px;
  border: 1px solid #1C1B1A;
  border-radius: 50%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin-right: 8px;
  box-sizing: border-box;
  cursor: pointer;
}

.search-filter-input-checkbox__input:checked+.search-filter-input-checkbox__container .search-filter-input-checkbox__control {
  background-color: #1C1B1A;
  border-color: #1C1B1A;
}

.search-filter-input-checkbox__input:checked+.search-filter-input-checkbox__container .search-filter-input-checkbox__control::after {
  content: "✓";
  color: #fff;
  font-size: 12px;
  line-height: 1;
}


.search-filter-input-checkbox__container {
  display: flex;
  align-items: center;
  cursor: pointer;
}

.search-filter-component-range-slider__range-input-bar {
  position: relative;
  height: 2px;
  background: #e5e5e5;
  border-radius: 2px;
}

.search-filter-component-range-slider__range-input-progress {
  position: absolute;
  height: 2px;
  background: #111;
  left: var(--low);
  right: calc(100% - var(--high));
  border-radius: 2px;
}

.search-filter-component-range-slider__range-input {
  -webkit-appearance: none;
  appearance: none;
  background: none;
  pointer-events: none;
  position: absolute;
  inset: 0;
}

.search-filter-component-range-slider__range-input::-webkit-slider-thumb {
  -webkit-appearance: none;
  appearance: none;
  pointer-events: auto;
  width: 12px;
  height: 12px;
  background: #111;
  border-radius: 50%;
  cursor: pointer;
}

.search-filter-component-range-slider__range-input::-webkit-slider-runnable-track {
  background: transparent;
}

.search-filter-component-range-slider__range-input::-moz-range-track {
  background: transparent;
}

.search-filter-component-range-slider__range-text {
  display: flex;
  justify-content: space-between;
  margin-top: 30px;
}

.search-filter-component-range-slider--is-input-inline {
  padding: 15px 0;
}

.search-filter-style--control-reset {
  width: 50%;
}

.search-filter-style--control-reset button {
  width: 100%;
  background-color: transparent;
  border-radius: 8px;
  border-color: var(--wp--preset--color--black);
  border-width: 1.2px;
  border-style: solid;
  color: var(--wp--preset--color--black);
  font-family: inherit;
  font-size: var(--wp--preset--font-size--body-7);
  font-style: inherit;
  font-weight: 500;
  letter-spacing: 0.1em;
  line-height: inherit;
  text-decoration: none;
  padding: 13px 36px;
  text-transform: uppercase;
}

.search-filter-style--control-submit {
  width: 50%;
}

.search-filter-style--control-submit button {

  width: 100%;
  background-color: var(--wp--preset--color--black) !important;
  color: var(--wp--preset--color--white) !important;
  border-radius: 8px;
  border-color: var(--wp--preset--color--black);
  border-width: 1.2px;
  border-style: solid;
  color: var(--wp--preset--color--black);
  font-family: inherit;
  font-size: var(--wp--preset--font-size--body-7);
  font-style: inherit;
  font-weight: 500;
  letter-spacing: 0.1em;
  line-height: inherit;
  text-decoration: none;
  padding: 13px 36px;
  text-transform: uppercase;
}


.bookmark.is-active {
  fill: white;
}

.bookmark#bookmark-doctor.is-active {
  fill: black;
}

.stars {
  --rating: attr(data-rating number);
  font-size: 20px;
  color: #ddd;
  position: relative;
  display: inline-block;
}

.stars::before {
  content: "★★★★★";
}

.stars::after {
  content: "★★★★★";
  color: rgb(0, 0, 0);
  position: absolute;
  left: 0;
  top: 0;
  width: calc(var(--rating) / 5 * 100%);
  overflow: hidden;
  white-space: nowrap;
}


.is-hero.is-page {
  margin-top: -85px;
  padding-top: 85px;
}

header {
  fill: var(--wp--preset--color--black);
  stroke: var(--wp--preset--color--black);
  color: var(--wp--preset--color--black);
  background-color: var(--wp--preset--color--surface-1);
  transition: background 0.3s ease;
}

.guide-template-default header,
.page-template-page-hero header {
  fill: var(--wp--preset--color--white);
  stroke: var(--wp--preset--color--white);
  color: var(--wp--preset--color--white);
  background-color: transparent;

}

.guide-template-default header.scrolled,
.page-template-page-hero header.scrolled {
  fill: var(--wp--preset--color--black);
  stroke: var(--wp--preset--color--black);
  color: var(--wp--preset--color--black);
  background-color: var(--wp--preset--color--surface-1);
}

header.scrolled {
  box-shadow: 0 1px 10px rgba(0, 0, 0, 0.1);
}

.guide-template-default .is-hero,
.page-template-page-hero .is-hero {
  color: white;
  border-radius: 0 0 20px 20px;
}

.page-template-page-hero .is-hero {
  height: 100vh;
  position: relative;
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center;
}

/* overlay */
.page-template-page-hero .is-hero::before {
  content: "";
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, 0.2);
  /* overlay color */
  z-index: 1;
}

/* content above overlay */
.page-template-page-hero .is-hero>* {
  position: relative;
  z-index: 2;
}

.guide-template-default header .kora-logo,
.page-template-page-hero header .kora-logo,
.guide-template-default header .wp-block-button__link,
.page-template-page-hero header .wp-block-button__link {
  filter: invert(1);
}

.guide-template-default header.scrolled .kora-logo,
.page-template-page-hero header.scrolled .kora-logo,
.guide-template-default header.scrolled .wp-block-button__link,
.page-template-page-hero header.scrolled .wp-block-button__link {
  filter: unset;
}

.page-template-page-hero .is-hero {
  display: flex;
  justify-content: center;
  flex-direction: row;
  align-items: end;
}

.page-template-page-hero .is-hero h2 {
  text-align: center;
  color: white;
}

.left-arrow,
.right-arrow {
  text-align: center;
  font-size: 20px;
  border-top-left-radius: 10px;
  border-top-right-radius: 10px;
  border-bottom-right-radius: 10px;
  border-bottom-left-radius: 10px;
  width: 36px;
  height: 36px;
  line-height: 36px;
  display: flex;
  justify-content: center;
  align-items: center;
}

.left-arrow::after,
.swiper-button-prev:after,
.swiper-rtl .swiper-button-next:after {
  content: '←' !important;
}


.right-arrow::after,
.swiper-button-next:after,
.swiper-rtl .swiper-button-prev:after {
  content: '→' !important;
}

.gs-dynamicpanel-close {
  background-color: transparent !important;
  color: black !important;
}


/* Style TOC */

.gs-autolist {
  border: none !important;
  margin: 0 !important;
}

.gs-autolist-title {
  display: flex;
}

.toc-toggle {
  display: block;
}

.gs-autolist-item.active .gs-autolist-title::before {
  content: "";
  position: relative;
  left: 0px;
  top: 8px;
  width: 8px;
  height: 8px;
  background-color: #B05A36;
  border-radius: 50%;
}

.gs-autolist-item.active .gs-scrollto {
  margin-left: 10px;
  color: black !important;
}

.gs-autolist-item {
  padding: 3px 0px !important;
}

/* Mobile styles */
@media (max-width: 768px) {

  .gs-autolist-item.active .gs-scrollto {
    margin-left: 0;
  }

  .gs-autolist-item.active .gs-autolist-title::before {
    display: none;
  }

  .toc-toggle {
    display: flex;
    cursor: pointer;
    background: #ffffff;
    display: flex;
    align-items: center;
    justify-content: space-between;
  }

  .toc-wrapper {
    padding: 5px;
    background-color: white;
  }

  /* Arrow (chevron) */
  .toc-arrow {
    width: 8px;
    height: 8px;
    border-right: 2px solid #374151;
    border-bottom: 2px solid #374151;
    transform: rotate(45deg);
    transition: transform 0.3s ease;
    margin: 0 5px;
  }

  /* Rotate arrow when open */
  .toc-wrapper.active .toc-arrow {
    transform: rotate(-135deg);
  }

  .toc-wrapper .gs-toc {
    display: none;
  }

  .toc-wrapper.active .gs-toc {
    display: block;
  }


}



.grid3 {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 20px;
}

.grid5 {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 20px;
}

@media (max-width: 991.98px) {

  .grid3,
  .grid5 {
    grid-template-columns: 1fr;
  }
}

.bar {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
}


.bar h5 span {
  margin-left: 6px;
  color: var(--wp--preset--color--brown);
}


.loop {
  padding-bottom: 20px;
}

.bar a {
  font-weight: 500;
}

.bar a::after {
  content: "";
  display: inline-block;
  width: 10px;
  height: 10px;
  margin-left: 8px;
  background-image: url("data:image/svg+xml,%3Csvg width='7' height='12' viewBox='0 0 7 12' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M0.530273 10.5303L5.53027 5.53033L0.530273 0.530334' stroke='%231C1B1A' stroke-width='1.5'/%3E%3C/svg%3E");
  background-size: contain;
  background-repeat: no-repeat;
  vertical-align: middle;
}

/* input stylings */

input,
select {
  padding: 14px 16px;
  font-size: 15px;
  font-family: inherit;
  border: none;
  border-radius: 10px;
  outline: none;
  box-sizing: border-box;
}

input.s2,
textarea.s2,
select.s2 {
  background-color: var(--wp--preset--color--surface-2);
  color: var(--wp--preset--color--black);
}

input.s2::placeholder,
textarea.s2::placeholder,
select.s2 {
  color: var(--wp--preset--color--gray-500);
}

input.magic {
  line-height: var(--wp--custom--line-height--lg);
  font-weight: 500;
  font-size: 16px;
}


/* Placeholder styling */
input::placeholder {
  color: #9a9a9a;
  font-size: 14px;
}

.svg-star-rating {
  display: inline-flex;
  gap: 6px;
  cursor: pointer;
}

.svg-star-rating span {
  width: 20px;
  height: 20px;
  display: inline-block;

  background-repeat: no-repeat;
  background-size: contain;

  /* default = gray */
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 17 16'%3E%3Cpath fill='%23D9D9D9' d='M8.33333 0L10.9083 5.21667L16.6667 6.05833L12.5 10.1167L13.4833 15.85L8.33333 13.1417L3.18333 15.85L4.16667 10.1167L0 6.05833L5.75833 5.21667L8.33333 0Z'/%3E%3C/svg%3E");
}

/* active + hover = black */
.svg-star-rating span.active,
.svg-star-rating span.hover {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 17 16'%3E%3Cpath fill='%23000' d='M8.33333 0L10.9083 5.21667L16.6667 6.05833L12.5 10.1167L13.4833 15.85L8.33333 13.1417L3.18333 15.85L4.16667 10.1167L0 6.05833L5.75833 5.21667L8.33333 0Z'/%3E%3C/svg%3E");
}


.wp-block-post-author-name {
  font-weight: 500;
}