/**
 * OcMono theme — combined stylesheet.
 * Do not split into multiple CSS files; edit this file only.
 */

/* Site-wide typeface */
html,
body {
  font-family: "Montserrat", sans-serif !important;
}

body,
p,
a,
h1, h2, h3, h4, h5, h6,
li,
span,
div,
button,
input,
textarea,
select,
label,
td,
th,
.btn,
.form-control,
.nav-link,
.dropdown-item,
.breadcrumb,
.section-header,
.section-title,
.oc-interior-hero__title,
.oc-interior-hero__subtitle {
  font-family: "Montserrat", sans-serif !important;
}

/* Color preview / palette */

body {
  color: #3b3b3b;
  background: #fff;
}

#page,
#main-wrapper,
#main,
.region-primary-menu .menu-item a.is-active,
.region-primary-menu .menu-item--active-trail a {
  background: #fff;
}

/* Interior pages — keep content area white */
body:not(.path-frontpage) #main,
body.not-front #main,
body.not-front .blog-details,
body.not-front .blog-listing {
  background: #fff;
}

.tabs ul.primary li a.is-active {
  background-color: #fff;
}

.tabs ul.primary li.is-active a {
  background-color: #fff;
  border-bottom-color: #fff;
}

#navbar-top {
  background-color: #055a8e;
}

#navbar-main {
  background-color: #1d84c3;
}

a,
.link {
  color: #0071b3;
}

a:hover,
a:focus,
.link:hover,
.link:focus {
  color: #018fe2;
}
.nav-item .dropdown-item a.active {
  color: white;
}
.nav-link {
  color: rgb(231, 231, 231);
}
.nav-link:hover,
.nav-link:focus {
  color: rgb(231, 231, 231);
}
a:active,
.link:active {
  color: #23aeff;
}

.page-item.active .page-link {
  background-color: #0071b3;
  border-color: #0071b3;
}

.page-link,
.page-link:hover {
  color: #0071b3;
}

.sidebar .block {
  background-color: #f6f6f2;
  border-color: #f9f9f9;
}

.btn-primary {
  background-color: var(--oc-btn-solid-bg, #0e1d34);
  border-color: var(--oc-btn-solid-bg, #0e1d34);
}

.btn-primary:hover,
.btn-primary:focus {
  background-color: var(--oc-btn-solid-hover, #16213e);
  border-color: var(--oc-btn-solid-hover, #16213e);
}

.site-footer {
  background: #292929;
}

.region-header,
.region-header a,
.region-header li a.is-active,
.region-header .site-branding__text,
.region-header .site-branding,
.region-header .site-branding__text a,
.region-header .site-branding a,
.region-secondary-menu .menu-item a,
.region-secondary-menu .menu-item a.is-active {
  color: #fffeff;
}


/* ---------- Color Form ----------- */

[dir="rtl"] .color-form .color-palette {
  margin-left: 0;
  margin-right: 20px;
}

[dir="rtl"] .color-form .form-item label {
  float: right;
}

[dir="rtl"] .color-form .color-palette .lock {
  right: -20px;
  left: 0;
}

/**
 * OcMono theme overrides.
 */

:root {
  --brand-primary: #1fa2ff;
  --brand-accent: #1fa2ff;
  --brand-dark: #16213E;
  --brand-navy: #13316E;
  --brand-teal: #1fa2ff;
  --brand-hover: #0d8ae6;
  --brand-on-dark: #ffffff;
  /* Cart click / catch accent */
  --brand-cart: #802151;
  --brand-cart-glow: rgba(128, 33, 81, 0.55);
  --oc-btn-radius: 4px;
  --oc-btn-outline-color: #a7a7a7;
  --oc-btn-outline-hover: #1977cc;
  --oc-btn-solid-bg: #0e1d34;
  --oc-btn-solid-hover: #16213e;
  --oc-btn-solid-text: #fff;
}

/* Icon-only buttons - keep existing shapes (cart, qty, close, etc.). */
.header-cart,
.header-cart--nav,
.header-cart-toggle,
.oc-cart-drawer-toggle,
.shop-product-card__purchase .button--add-to-cart,
.shop-product-card__purchase .oc-add-to-cart-submit,
.shop-product-card__cart-btn,
.shop-product-card__purchase .pro-btn,
.commerce-product--ocmono .commerce-product__buy-row .button--add-to-cart,
.commerce-product--ocmono .commerce-product__buy-row .oc-add-to-cart-submit,
.commerce-product--ocmono .commerce-product__buy-row .form-submit,
.catalog-qty-stepper__btn,
.oc-wishlist-btn--icon,
.oc-search-modal__close,
.oc-cart-drawer__close,
.oc-appointment-modal__close {
  border-radius: unset;
}

/* Solid / primary buttons - header navy. */
.btn-primary:not(.header-cart):not(.header-cart--nav):not(.shop-product-card__cart-btn):not(.pro-btn):not(.button--add-to-cart):not(.oc-add-to-cart-submit),
.button--primary:not(.shop-product-card__cart-btn):not(.pro-btn):not(.button--add-to-cart):not(.oc-add-to-cart-submit),
.webform-button--submit,
.webform-actions input[type="submit"],
.form-submit:not(.button--add-to-cart):not(.oc-add-to-cart-submit):not(.shop-product-card__cart-btn):not(.pro-btn):not(.oc-cart-remove-btn):not(.delete-order-item),
.oc-search-modal__submit,
.oc-checkout-btn:not(.oc-checkout-btn--secondary),
.oc-cart-page__checkout,
.oc-cart-page-form [id^="edit-checkout"],
.commerce-product--ocmono .commerce-product__buy-row .button--add-to-cart,
.commerce-product--ocmono .commerce-product__buy-row .oc-add-to-cart-submit,
.commerce-product--ocmono .commerce-product__buy-row .form-submit,
a.btn-primary:not(.header-cart):not(.header-cart--nav) {
  border-radius: var(--oc-btn-radius) !important;
  background-color: var(--oc-btn-solid-bg) !important;
  border: 2px solid var(--oc-btn-solid-bg) !important;
  color: var(--oc-btn-solid-text) !important;
  font-weight: 700;
}

.btn-primary:not(.header-cart):not(.header-cart--nav):not(.shop-product-card__cart-btn):not(.pro-btn):not(.button--add-to-cart):not(.oc-add-to-cart-submit):hover,
.btn-primary:not(.header-cart):not(.header-cart--nav):not(.shop-product-card__cart-btn):not(.pro-btn):not(.button--add-to-cart):not(.oc-add-to-cart-submit):focus,
.button--primary:not(.shop-product-card__cart-btn):not(.pro-btn):not(.button--add-to-cart):not(.oc-add-to-cart-submit):hover,
.webform-button--submit:hover,
.webform-actions input[type="submit"]:hover,
.form-submit:not(.button--add-to-cart):not(.oc-add-to-cart-submit):not(.shop-product-card__cart-btn):not(.pro-btn):not(.oc-cart-remove-btn):not(.delete-order-item):hover,
.oc-search-modal__submit:hover,
.oc-checkout-btn:not(.oc-checkout-btn--secondary):hover,
.oc-cart-page__checkout:hover,
.oc-cart-page-form [id^="edit-checkout"]:hover,
.commerce-product--ocmono .commerce-product__buy-row .button--add-to-cart:hover,
.commerce-product--ocmono .commerce-product__buy-row .oc-add-to-cart-submit:hover,
.commerce-product--ocmono .commerce-product__buy-row .form-submit:hover,
a.btn-primary:not(.header-cart):not(.header-cart--nav):hover {
  background-color: var(--oc-btn-solid-hover) !important;
  border-color: var(--oc-btn-solid-hover) !important;
  color: var(--oc-btn-solid-text) !important;
}

/* Outline / secondary buttons - srv-link style. */
.btn-outline-primary,
.btn-outline-secondary,
.btn-outline,
.btn.btn-outline-primary,
.btn.btn-outline-secondary,
a.btn.btn-outline-primary,
a.btn.btn-outline-secondary,
.button--secondary,
.btn-secondary,
.srv-link a,
.appointment-forms .button-primary,
.oc-checkout-btn--secondary,
.oc-cart-drawer__continue,
.oc-cart-page__update,
.oc-cart-page-form #edit-submit,
.shop-facets__reset,
.oc-info-page__cta .btn-outline-primary {
  display: inline-block;
  color: var(--oc-btn-outline-color) !important;
  background: transparent !important;
  font-size: 12px !important;
  text-transform: uppercase;
  padding: 8px 12px !important;
  border: 2px solid var(--oc-btn-outline-color) !important;
  border-radius: var(--oc-btn-radius) !important;
  font-weight: 700 !important;
  text-decoration: none;
  line-height: 1.25;
}

.btn-outline-primary:hover,
.btn-outline-secondary:hover,
.btn-outline:hover,
.btn.btn-outline-primary:hover,
.btn.btn-outline-secondary:hover,
a.btn.btn-outline-primary:hover,
a.btn.btn-outline-secondary:hover,
.button--secondary:hover,
.btn-secondary:hover,
.srv-link:hover a,
.appointment-forms .button-primary:hover,
.oc-checkout-btn--secondary:hover,
.oc-cart-drawer__continue:hover,
.oc-cart-page__update:hover,
.oc-cart-page-form #edit-submit:hover,
.shop-facets__reset:hover,
.oc-info-page__cta .btn-outline-primary:hover {
  color: var(--oc-btn-outline-hover) !important;
  border-color: var(--oc-btn-outline-hover) !important;
  background: transparent !important;
}

body {
  font-family: "Montserrat", sans-serif;
  color: #444;
}

h1, h2, h3, h4, h5, .section-title {
  font-family: "Montserrat", sans-serif;
  color: var(--brand-dark);
}

/* .section-title {
  border-left: 5px solid var(--brand-primary);
  padding-left: 20px;
  font-weight: 800;
  margin-bottom: 1.5rem;
} */

.topbar {
  background: var(--brand-dark);
  color: #fff;
  font-size: 14px;
}

.topbar a {
  color: #fff;
  text-decoration: none;
}

.navbar-logo {
  max-height: 90px;
}

.btn-primary {
  background-color: var(--oc-btn-solid-bg);
  border-color: var(--oc-btn-solid-bg);
}

.btn-primary:hover {
  background-color: var(--oc-btn-solid-hover);
  border-color: var(--oc-btn-solid-hover);
}

.btn-outline-primary {
  color: var(--oc-btn-outline-color);
  border-color: var(--oc-btn-outline-color);
}

.hero-section {
  position: relative;
  min-height: 85vh;
  display: flex;
  align-items: center;
  overflow: hidden;
}

.hero-video-wrap {
  position: absolute;
  inset: 0;
  z-index: 0;
}

.hero-video {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.hero-overlay {
  position: absolute;
  inset: 0;
  background: rgba(14, 29, 52, 0.65);
}

.hero-content {
  position: relative;
  z-index: 2;
  padding: 120px 0 80px;
}

.hero-title {
  font-size: clamp(2rem, 5vw, 3.5rem);
  font-weight: 800;
  line-height: 1.2;
}

.hero-stats h3 {
  color: var(--brand-accent);
  font-size: 2.5rem;
  font-weight: 800;
}

.stat-item p {
  color: #fff;
  margin: 0;
}

.testimonial-card {
  max-width: 800px;
  margin: 0 auto;
}

.testimonial-card .quote {
  font-size: 1.1rem;
  font-style: italic;
}

.testimonial-card h3 {
  color: var(--brand-primary);
  font-size: 1.25rem;
  margin-top: 1rem;
}

.footer-links a {
  color: #6c757d;
  text-decoration: none;
  line-height: 2;
}

.footer-links a:hover {
  color: var(--brand-primary);
}

#contact a {
  color: var(--brand-accent);
}

.front-clinic .views-view-grid .views-row {
  margin-bottom: 1.5rem;
}

.front-clinic .views-field-title a {
  color: var(--brand-dark);
  font-weight: 700;
  text-decoration: none;
  border-left: 5px solid var(--brand-primary);
  padding-left: 15px;
  display: block;
}

.oc-page-title {
  padding: 130px 0 30px;
  background: rgba(14, 29, 52, 0.6);
  color: #fff;
}

/* .award-img-1{
    background: url("https://drmishras.com/img/Inspiring Technologist of India C- Dr Sunil Mishra.png") center center;
    background-size: cover;
} */

.award-img-1 .img-fluid {
    width: 100%;
}
.col-lg-4.content.box-2 {
    padding: 0;
  }
.award-img-2 .img-fluid {
    width: 100%;
}

.col-lg-4.box-3.aos-init.aos-animate {
    padding-left: 0;
}


.region-sidebar-second {
    margin-bottom: 20px;
    padding: 20px;
    background: #fff;
    /* box-shadow: 0 3px 20px -2px rgba(108, 117, 125, 0.15); */
    transition: all 0.3s ease-in-out;
    border-radius: 10px;
    border: 1px solid #f1eff1;
    border-radius: 5px;
}

.region-sidebar-second h2.block-title {
    border-left: 5px solid #D79797;
    padding-left: 30px;
    margin-bottom: 0px;
    font-weight: 800;
    line-height: 2.6;
    font-size: 14px;
    color: #333;
}

.region-sidebar-second .views-field-title a {
    border-left: 5px solid #f8f8f8 !important;
    position: relative !important;
    padding-left: 30px !important;
    margin-bottom: 20px !important;
    font-weight: 400 !important;
    line-height: 2.6 !important;
    font-size: 12px !important;
    color: #333 !important;
    font-family: "Montserrat", sans-serif !important;
}


.oc-page-title {
    padding: 130px 0 30px 0;
    margin-bottom: 30px;
    /* background: rgba(0, 0, 0, 0.4); */
    color: #FFF;
    background: rgba(14, 29, 52, 0.6);
    background-size: cover; */
    /* margin-top: 75px; */
}

.oc-page-header {
    font-family: "Montserrat", sans-serif;
    /* border-left: 10px solid #3FBBC0;
    padding-left: 30px; */
    margin-top: 20px;
    /* margin-bottom: 0.5rem; */
    font-weight: 800;
    /* line-height: 2.6; */
    font-size: 24px;
    color: white;
    /* text-transform: uppercase; */
    /* text-align: center; */
}

.btn {
    font-size: 14px;
}


/* Product cards - typography and spacing */
.shop-product-card h3,
.shop-product-card__title,
.shop-product-card__title.title {
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  font-size: 15px !important;
  font-weight: 600 !important;
  line-height: 1.4 !important;
  color: #111 !important;
  background: transparent !important;
}

.shop-product-card__title a {
  color: #111 !important;
  text-decoration: none !important;
  font-weight: 600 !important;
}

.shop-product-card__title a:hover {
  color: var(--brand-primary) !important;
}

.shop-product-card__brand,
.shop-product-card__brand a,
.shop-product-card__brand .field__item {
  text-transform: uppercase !important;
  letter-spacing: 0.04em;
  font-size: 12px !important;
  font-weight: 600 !important;
  color: #707070 !important;
  margin: 0 !important;
  padding: 0 !important;
  line-height: 1.45 !important;
}

.shop-product-card__short {
  margin: 0 !important;
  padding: 0 !important;
  font-size: 12px !important;
  font-weight: 400 !important;
  line-height: 1.45 !important;
  color: #707070 !important;
  min-height: 0 !important;
  display: -webkit-box !important;
  -webkit-line-clamp: 2 !important;
  -webkit-box-orient: vertical !important;
  overflow: hidden !important;
}

.shop-product-card__benefits {
  display: -webkit-box !important;
  -webkit-line-clamp: 2 !important;
  -webkit-box-orient: vertical !important;
  overflow: hidden !important;
  margin: 0 !important;
  padding: 0 !important;
  list-style: none !important;
  min-height: 0 !important;
  color: #707070 !important;
  font-size: 12px !important;
  font-weight: 400 !important;
  line-height: 1.45 !important;
}

.shop-product-card__benefit {
    display: inline !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
    color: inherit !important;
    font-size: inherit !important;
    font-weight: inherit !important;
    line-height: inherit !important;
    letter-spacing: 0;
    white-space: normal !important;
}

.shop-product-card__benefit:not(:last-child)::after {
    content: "\00a0| ";
    color: #a0a8b4;
}


/* Shop sidebar titles — keep Open Sans; reset article H4 box styles */
.shop-catalog__sidebar-heading.title,
.shop-facets__heading.title,
.sidbar-widget .title {
    font-family: "Montserrat", sans-serif;
    font-size: 18px;
    font-weight: 700;
    line-height: 1.3;
    background: transparent;
    padding: 0 0 20px;
}


.shop-catalog ul,
.shop-catalog__list,
.shop-category-nav__list {
  margin-left: 0;
  margin-bottom: 0;
}


.appointment-forms {
    max-width: 500px;
    margin-left: auto;
    margin-right: auto;
    padding: 40px 30px !important;
    position: relative;
    overflow: hidden;
    background: #fff;
    box-shadow: 0 3px 20px -2px rgba(108, 117, 125, 0.15);
    transition: all 0.3s ease-in-out;
    border-radius: 10px;
    margin-bottom: 40px;
}

/* Book appointment - Calendly (live site embed) */
.oc-book-appointment {
  max-width: 56rem;
  margin: 0 auto 3rem;
  padding: 0 0 1rem;
}

.oc-book-appointment__intro {
  margin: 0 0 1.5rem;
  text-align: center;
  color: #5a6a7e;
  font-size: 1.05rem;
  line-height: 1.55;
}

.oc-book-appointment__embed {
  background: #fff;
  border: 1px solid #e8edf5;
  border-radius: 16px;
  overflow: hidden;
  box-shadow: 0 10px 28px rgba(14, 29, 52, 0.06);
}

.oc-book-appointment__embed .calendly-inline-widget,
.oc-book-appointment__iframe {
  display: block;
  width: 100%;
  min-width: 320px;
  height: 700px;
  border: 0;
}

body.path-book-appointment .book-appointment-icon,
body.path-webform-book-appointment .book-appointment-icon {
  display: none !important;
}

.appointment-forms .form-control {
    display: block;
    width: 100%;
    height: 40px;
    padding: 0.375rem 0.75rem;
    border-radius: 4px;
    box-shadow: none;
    font-size: 14px;
    font-weight: 400;
    line-height: 1.5;
    color: #495057;
    background-color: #fff;
    background-clip: padding-box;
    border: 1px solid #ced4da;
    border-radius: 0.25rem;
    transition: border-color .15s ease-in-out, box-shadow .15s ease-in-out;
    margin-bottom: 20px;
}


.appointment-forms .button-primary {
    padding: 10px 32px;
    transition: color 0.25s ease, border-color 0.25s ease;
}


/*--------------------------------------------------------------
# Front Clinic
--------------------------------------------------------------*/

#front-clinic {
    padding: 80px 0 80px;
}

.front-clinic {
    background: #fff;
    padding: 0 10px;
}

.front-clinic a {
    color: #2C4964;
}

.front-clinic .icon-box {
    width: 100% !important;
    padding: 10px;
    box-shadow: 0 3px 20px -2px rgba(108, 117, 125, 0.15);
    transition: all 0.3s ease-in-out;
    border-radius: 10px;
    margin-bottom: 20PX;
    border-radius: 5PX;
}

.front-clinic .icon-box .pic {
    width: 100%;
    background-color: #fff;
}

.front-clinic .icon-box h1 {
    border-left: 5px solid;
    border-color: #1fa2ff;
    padding: 10px 0 10px 30px;
    font-size: 18px;
    font-weight: bold;
}

.front-clinic .icon-box h1 a {
    color: #263D4D;
}


.front-clinic .icon-box h4 {
    border-left: 5px solid;
    border-color: #FFF6F6;
    padding: 10px 0 10px 10px;
    font-size: 14px;
    font-weight: 200;
    color: #787878;
}

.front-clinic .icon-box p {
    font-size: 14px;
    padding: 0px;

}


.treatments-link h2 {
    font-weight: 600;
    margin-top: 35px;
    margin-bottom: 15px;
    font-size: 20px;
    color: var(--color-secondary);
    padding: 0 40px;
}

.front .treatments-link section {
    padding: 0 0 !important;
}

.treatments-link .view-content {
    padding: 20px 40px;
    list-style: none;
    color: #6c757d;
    text-align: left;
    line-height: 20px;
}

.treatments-link .views-field-title {
    padding: 10px 0;
    display: flex;
    align-items: center;
    color: #6c757d;
}

.treatments-link .views-field-title a {
    color: #6c757d;
}

.treatments-link .views-field-title a:hover {
    color: #333;
}



.treatments-link .views-field-title::before {
    content: "\f26e";
    display: inline-block;
    font-family: bootstrap-icons !important;
    font-style: normal;
    font-weight: normal !important;
    font-variant: normal;
    text-transform: none;
    line-height: 1;
    vertical-align: -.125em;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    color: #059652;
    font-size: 24px;
    padding-right: 3px;
}


/* Service detail page — clean white interior (see services section below) */


.navbar-logo {
    padding: 0 !important;
    height: 90px;
    margin-top: 10px;
}

.navber .navbar-logo a {
    padding: 0 !important;
}

@media (min-width: 1280px) {

    .navbar .navbar-logo a,
    .navbar .navbar-logo a:focus {
        padding: 0 !important;
    }
}

body.path-frontpage {
  padding-top: 0 !important;
}

body.path-frontpage.toolbar-fixed {
  padding-top: 39px !important;
}

/* Header cart / utility icons */
.header-actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 0.35rem;
}

.oc-header-search {
  display: inline-flex;
  align-items: center;
  background: rgba(255, 255, 255, 0.12);
  border: 1px solid rgba(255, 255, 255, 0.28);
  border-radius: 999px;
  overflow: hidden;
  max-width: 200px;
  transition: max-width 0.25s ease, background 0.2s ease;
}

.oc-header-search input[type="search"] {
  width: 100%;
  min-width: 0;
  border: 0;
  background: transparent;
  color: #fff;
  padding: 0.35rem 0.65rem 0.35rem 0.85rem;
  font-size: 0.85rem;
  outline: none;
}

.oc-header-search input[type="search"]::placeholder {
  color: rgba(255, 255, 255, 0.7);
}

.oc-header-search button {
  border: 0;
  background: transparent;
  color: #fff;
  padding: 0.35rem 0.7rem;
  line-height: 1;
  cursor: pointer;
}

.oc-header-search button:hover {
  color: #f0c040;
}

/* Icon-first search: collapsed until focus/hover */
.oc-header-search--icon {
  max-width: 40px;
  background: transparent;
  border-color: transparent;
}

.oc-header-search--icon input[type="search"] {
  width: 0;
  padding: 0;
  opacity: 0;
  pointer-events: none;
}

.oc-header-search--icon:focus-within,
.oc-header-search--icon:hover {
  max-width: 200px;
  background: rgba(255, 255, 255, 0.12);
  border-color: rgba(255, 255, 255, 0.28);
}

.oc-header-search--icon:focus-within input[type="search"],
.oc-header-search--icon:hover input[type="search"] {
  width: 100%;
  padding: 0.35rem 0.65rem 0.35rem 0.85rem;
  opacity: 1;
  pointer-events: auto;
}

.oc-header-search--icon button {
  padding: 0.45rem 0.7rem;
  font-size: 1.15rem;
}

.hide-on-desktop .oc-header-search {
  max-width: 140px;
}

.hide-on-desktop .oc-header-search input[type="search"] {
  padding-left: 0.55rem;
  font-size: 0.8rem;
}

@media (max-width: 575px) {
  .hide-on-desktop .oc-header-search {
    display: none;
  }
}

.header-util-link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  margin: 0;
  padding: 0;
  border: 0 !important;
  background: transparent !important;
  background-color: transparent !important;
  color: #fff !important;
  font-size: 1.2rem;
  line-height: 1;
  text-decoration: none;
  border-radius: 50%;
  cursor: pointer;
  appearance: none;
  -webkit-appearance: none;
  box-shadow: none !important;
  transition: color 0.2s ease, background 0.2s ease;
}

.header-util-link i,
.header-util-link .bi {
  color: inherit !important;
  line-height: 1;
  opacity: 1;
}

button.header-util-link,
.oc-site-header button.header-util-link,
.hide-on-desktop button.header-util-link,
.header-actions button.header-util-link,
.oc-search-modal-toggle.header-util-link {
  background: transparent !important;
  background-color: transparent !important;
  border: 0 !important;
  color: #fff !important;
  box-shadow: none !important;
}

.header-util-link:hover,
.header-util-link:focus,
button.header-util-link:hover,
button.header-util-link:focus {
  color: #f0c040 !important;
  background: rgba(255, 255, 255, 0.14) !important;
  background-color: rgba(255, 255, 255, 0.14) !important;
  text-decoration: none;
  outline: none;
  box-shadow: none !important;
}

.hide-on-desktop .header-util-link {
  width: 36px;
  height: 36px;
  color: #fff !important;
}

.oc-whatsapp-float {
  position: fixed;
  right: 1rem;
  bottom: 1rem;
  /* Stay behind cart drawer / overlays (cart uses z-index 2000+). */
  z-index: 1050;
  width: 3.25rem;
  height: 3.25rem;
  border-radius: 999px;
  background: #25d366;
  color: #fff;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 1.65rem;
  text-decoration: none;
  box-shadow: 0 8px 20px rgba(14, 29, 52, 0.18);
}

@media (max-width: 1279px) {
  .oc-whatsapp-float,
  .book-appointment-icon {
    display: none !important;
  }
}

.oc-whatsapp-float:hover,
.oc-whatsapp-float:focus {
  color: #fff;
  background: #1ebe57;
  text-decoration: none;
}

body.oc-cart-drawer-open .oc-whatsapp-float {
  z-index: 1500;
  pointer-events: none;
  opacity: 0.35;
}

.book-appointment-icon {
  bottom: 5.25rem;
}

.header-cart {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 40px;
  width: 40px;
  height: 40px;
  padding: 0;
  border: 0;
  background: transparent;
  color: #fff;
  text-decoration: none;
  font-size: 1.2rem;
  line-height: 1;
  cursor: pointer;
  border-radius: 50%;
  overflow: visible;
  transition: color 0.2s ease, background 0.2s ease;
  transform-origin: center center;
}

.header-cart:hover,
.header-cart:focus {
  color: #f0c040;
  background: rgba(255, 255, 255, 0.08);
  text-decoration: none;
}

.header-cart-count {
  position: absolute;
  top: -2px;
  right: -2px;
  box-sizing: border-box;
  min-width: 18px;
  width: auto;
  height: 18px;
  padding: 0 5px;
  border-radius: 999px;
  background: #e31e24;
  color: #fff;
  font-size: 11px;
  font-weight: 700;
  line-height: 18px;
  text-align: center;
  pointer-events: none;
  transform: scale(1);
  transform-origin: center center;
  opacity: 1;
  transition: opacity 0.18s ease, transform 0.18s ease;
}

.header-cart-count.is-empty {
  opacity: 0;
  transform: scale(0);
}

.header-cart-count.is-pop {
  animation: oc-badge-pop 0.45s cubic-bezier(0.34, 1.56, 0.64, 1);
}

.header-cart.is-cart-pulse,
.header-cart--nav.is-cart-pulse {
  animation: oc-cart-bounce 0.72s cubic-bezier(0.34, 1.45, 0.64, 1);
}

.header-cart.is-cart-await,
.header-cart--nav.is-cart-await,
.header-cart.is-cart-flash,
.header-cart--nav.is-cart-flash {
  color: var(--brand-cart);
}

.header-cart.is-cart-flash,
.header-cart--nav.is-cart-flash {
  transition: color 0.2s ease;
}

.header-cart.is-cart-flash i,
.header-cart--nav.is-cart-flash i {
  filter: drop-shadow(0 0 6px var(--brand-cart-glow));
}

.oc-site-header .header-cart--nav.is-cart-flash,
.oc-site-header .header-cart--nav.is-cart-flash:hover,
.oc-site-header .header-cart--nav.is-cart-flash:focus {
  color: var(--brand-cart);
}

.header-cart.is-cart-flash:hover,
.header-cart.is-cart-flash:focus {
  color: var(--brand-cart);
}

.header-cart.is-cart-await::before,
.header-cart--nav.is-cart-await::before {
  content: "";
  position: absolute;
  inset: -6px;
  border-radius: 50%;
  border: 2px solid rgba(128, 33, 81, 0.55);
  pointer-events: none;
  animation: oc-cart-await-ring 0.9s ease-out infinite;
}

.header-cart.is-cart-await i,
.header-cart--nav.is-cart-await i {
  filter: drop-shadow(0 0 8px var(--brand-cart-glow));
  animation: oc-cart-await-wiggle 0.7s ease-in-out infinite;
}

.oc-cart-catch-ripple {
  position: absolute;
  inset: -8px;
  border-radius: 50%;
  border: 2px solid rgba(128, 33, 81, 0.95);
  box-shadow: 0 0 0 0 rgba(128, 33, 81, 0.35);
  opacity: 0;
  pointer-events: none;
  transform: scale(0.55);
}

.oc-cart-catch-ripple.is-active {
  animation: oc-cart-ripple 0.75s cubic-bezier(0.16, 0.84, 0.44, 1) forwards;
}

/* Hide Drupal AJAX throbber on add-to-cart (custom fly animation instead). */
.commerce-order-item-add-to-cart-form .ajax-progress,
.commerce-order-item-add-to-cart-form .ajax-progress-throbber,
.shop-product-card .ajax-progress,
.shop-product-card .ajax-progress-throbber,
.oc-add-to-cart-submit + .ajax-progress,
.button--add-to-cart + .ajax-progress,
.header-cart + .ajax-progress,
.header-cart--nav + .ajax-progress,
.header-actions .ajax-progress,
.oc-site-header .ajax-progress {
  display: none !important;
}

.hide-on-desktop .header-cart {
  flex-basis: 36px;
  width: 36px;
  height: 36px;
}

.site-nav .header-cart--nav {
  vertical-align: middle;
}

.hide-on-mobile .top-bar .header-cart {
  margin-right: 0.25rem;
}

#awards,
#awards-achievements,
#recent-awards,
#contact {
  padding: 0 !important;
}

/* Full-width three-column bands (awards, contact) */
.awards--fullwidth,
.contact--fullwidth {
  width: 100%;
  max-width: 100%;
  padding: 0 !important;
  margin: 0;
  overflow: hidden;
}

.awards--fullwidth .awards__inner,
.contact--fullwidth .contact__inner {
  width: 100%;
  max-width: 100%;
  padding: 0;
  margin: 0;
}

.awards--fullwidth .row,
.contact--fullwidth .row {
  margin: 0;
  --bs-gutter-x: 0;
  --bs-gutter-y: 0;
}

.awards--fullwidth [class*="col-"],
.contact--fullwidth [class*="col-"] {
  padding: 0;
}

.awards--fullwidth .content.box-1,
.awards--fullwidth .content.box-2 {
  padding: 0;
}

.contact--fullwidth .content.box-1 {
  padding: 0;
}

.contact--fullwidth .content.box-2 {
  padding: 50px;
}

.awards--fullwidth .box-1,
.awards--fullwidth .box-2,
.awards--fullwidth .box-3,
.contact--fullwidth .box-1,
.contact--fullwidth .box-2,
.contact--fullwidth .box-3 {
  min-height: 500px;
}

.contact--fullwidth .box-3 iframe {
  display: block;
  width: 100%;
  height: 100%;
  min-height: 500px;
  border: 0;
}

.awards--fullwidth .box-1 .section-header,
.contact--fullwidth .box-1 .section-header {
  padding: 50px 50px 30px;
}

.awards--fullwidth .box-1 .section-header h2,
.contact--fullwidth .box-1 .section-header h2 {
  border-bottom-color: #1fa2ff !important;
}

.awards--fullwidth .content.box-2 {
  display: flex;
  align-items: center;
}

.awards--fullwidth .content.box-2 ul {
  width: 100%;
  padding: 30px 40px;
  margin: 0;
}

.awards--fullwidth .content.box-2 ul li {
  margin-top: 18px;
}

.awards--fullwidth .content.box-2 ul li:first-child {
  margin-top: 0;
}

.awards--fullwidth .content.box-2 ul i {
  color: #1fa2ff;
}

/* Certificate 2Ã-2 grid (right column) */
.awards-certificates {
  height: 100%;
  min-height: 500px;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 28px 24px;
  background: #eeeeee;
}

.awards-certificates .row {
  width: 100%;
  margin: 0;
}

.awards-certificates img {
  width: 100%;
  height: auto;
  display: block;
  background: #fff;
  border: 4px solid #222;
  padding: 6px;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.12);
}

@media (max-width: 991px) {
  .awards--fullwidth .box-1,
  .awards--fullwidth .box-2,
  .awards--fullwidth .box-3,
  .awards-certificates,
  .contact--fullwidth .box-1,
  .contact--fullwidth .box-2,
  .contact--fullwidth .box-3 {
    min-height: auto;
  }

  .awards--fullwidth .box-1 .section-header,
  .contact--fullwidth .box-1 .section-header {
    padding: 36px 28px 24px;
  }

  .awards--fullwidth .content.box-2 ul {
    padding: 28px 24px 36px;
  }

  .contact--fullwidth .content.box-2 {
    padding: 36px 28px;
  }

  .contact--fullwidth .box-3 iframe {
    min-height: 360px;
  }
}

/* Front page uses custom template — suppress base-theme sidebar layout classes */
body.path-frontpage.layout-one-sidebar,
body.path-frontpage.layout-sidebar-first {
  /* Full-width front layout; no sidebars rendered */
}

body.path-frontpage .region-sidebar-first,
body.path-frontpage .region-sidebar-second {
  display: none !important;
}

/* Interior pages — hide base-theme sidebar regions and search block */
body:not(.path-frontpage) .region-sidebar-first,
body:not(.path-frontpage) .region-sidebar-second,
body:not(.path-frontpage) .block-search,
body:not(.path-frontpage) .search-block-form,
body:not(.path-frontpage) .block-search-form-block {
  display: none !important;
}

/* ===== Interior pages — header, hero, breadcrumbs ===== */
:root {
  --oc-header-offset-active: 118px;
}

body:not(.path-frontpage).navbar-is-fixed-top {
  padding-top: var(--oc-header-offset-active) !important;
  transition: padding-top 0.25s ease;
}

@media (max-width: 1279px) {
  body:not(.path-frontpage).navbar-is-fixed-top,
  body.path-frontpage.navbar-is-fixed-top {
    padding-top: 64px !important;
  }

  /* Clearance for fixed app bar lives on the dark mobile footer
     so no white gap shows between footer and app bar. */
  body {
    padding-bottom: 0 !important;
  }

  #footer-mobile.footer {
    padding-bottom: calc(1.5rem + 72px + env(safe-area-inset-bottom, 0px));
  }
}

/* Mobile app-style fixed bottom bar */
.oc-app-bar {
  position: fixed;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 1040;
  display: flex;
  align-items: center;
  justify-content: space-around;
  gap: 0;
  min-height: 62px;
  padding: 6px 4px calc(6px + env(safe-area-inset-bottom, 0px));
  background: linear-gradient(180deg, #10233f 0%, #0a1628 100%);
  backdrop-filter: blur(16px);
  -webkit-backdrop-filter: blur(16px);
  border-top: 1px solid rgba(255, 255, 255, 0.07);
  box-shadow: 0 -10px 32px rgba(0, 0, 0, 0.28);
}

.oc-app-bar__item {
  position: relative;
  flex: 1 1 0;
  display: inline-flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 3px;
  min-width: 0;
  margin: 0;
  padding: 2px 2px 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  color: #fff;
  font-size: 10px;
  font-weight: 600;
  line-height: 1.1;
  text-decoration: none;
  text-align: center;
  cursor: pointer;
  appearance: none;
  -webkit-appearance: none;
  transition: color 0.2s ease;
}

.oc-app-bar__item::before {
  content: "";
  position: absolute;
  top: 0;
  left: 50%;
  width: 22px;
  height: 2px;
  border-radius: 999px;
  background: #1fa2ff;
  transform: translateX(-50%) scaleX(0);
  transition: transform 0.2s ease;
}

.oc-app-bar__icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 36px;
  height: 36px;
  border-radius: 10px;
  background: transparent;
  transition: background 0.2s ease;
}

.oc-app-bar__item i {
  font-size: 1.15rem;
  line-height: 1;
  color: rgba(255, 255, 255, 0.9);
  transition: color 0.2s ease;
}

.oc-app-bar__label {
  display: block;
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  color: rgba(255, 255, 255, 0.82);
  font-size: 10px;
  font-weight: 600;
  letter-spacing: 0.01em;
  transition: color 0.2s ease;
}

.oc-app-bar__item:hover,
.oc-app-bar__item:focus {
  color: #fff;
  text-decoration: none;
  outline: none;
}

.oc-app-bar__item:hover .oc-app-bar__icon,
.oc-app-bar__item:focus .oc-app-bar__icon {
  background: rgba(255, 255, 255, 0.08);
}

.oc-app-bar__item:hover i,
.oc-app-bar__item:focus i,
.oc-app-bar__item:hover .oc-app-bar__label,
.oc-app-bar__item:focus .oc-app-bar__label {
  color: #fff;
}

.oc-app-bar__item.is-active::before {
  transform: translateX(-50%) scaleX(1);
}

.oc-app-bar__item.is-active .oc-app-bar__icon {
  background: rgba(31, 162, 255, 0.18);
}

.oc-app-bar__item.is-active i,
.oc-app-bar__item.is-active .oc-app-bar__label {
  color: #fff;
}

.oc-app-bar__badge {
  position: absolute;
  top: 0;
  right: calc(50% - 18px);
  min-width: 16px;
  height: 16px;
  padding: 0 4px;
  border-radius: 999px;
  background: #e11d48;
  color: #fff;
  font-size: 9px;
  font-weight: 700;
  line-height: 16px;
  text-align: center;
}

.oc-app-bar__badge.is-empty {
  display: none;
}

#footer-mobile.footer {
  background: linear-gradient(180deg, #10233f 0%, #0a1628 100%);
  color: rgba(255, 255, 255, 0.86);
  padding: 2rem 0 1.5rem;
  margin-bottom: 0;
  border-top: 1px solid rgba(255, 255, 255, 0.06);
}

#footer-mobile .footer__inner {
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
}

#footer-mobile .footer-mobile__logo {
  display: inline-block;
  line-height: 0;
  margin-bottom: 0.85rem;
}

#footer-mobile .footer-mobile__logo img {
  max-height: 58px;
  width: auto;
}

#footer-mobile .footer-mobile__tagline {
  margin: 0 0 1rem;
  max-width: 22rem;
  color: rgba(255, 255, 255, 0.72);
  font-size: 0.92rem;
  line-height: 1.55;
}

#footer-mobile .footer-mobile__social.social-links a {
  border-color: rgba(255, 255, 255, 0.28);
  color: rgba(255, 255, 255, 0.9);
}

#footer-mobile .footer-mobile__social.social-links a:hover,
#footer-mobile .footer-mobile__social.social-links a:focus {
  color: #fff;
  border-color: #1fa2ff;
  background: rgba(31, 162, 255, 0.14);
}

#footer-mobile .footer-mobile__contact h4 {
  margin: 0 0 0.65rem;
  color: #fff;
  font-size: 1rem;
  font-weight: 700;
}

#footer-mobile .footer-mobile__contact p {
  margin: 0;
  color: rgba(255, 255, 255, 0.78);
  font-size: 0.92rem;
  line-height: 1.65;
}

#footer-mobile .footer-mobile__contact a {
  color: rgba(255, 255, 255, 0.88);
  text-decoration: none;
}

#footer-mobile .footer-mobile__contact a:hover,
#footer-mobile .footer-mobile__contact a:focus {
  color: #1fa2ff;
}

#footer-mobile .footer-mobile__legal {
  display: flex;
  flex-wrap: wrap;
  gap: 0.35rem 1rem;
  margin: 0;
  padding: 0;
  list-style: none;
}

#footer-mobile .footer-mobile__legal a {
  color: rgba(255, 255, 255, 0.72);
  font-size: 0.88rem;
  text-decoration: none;
}

#footer-mobile .footer-mobile__legal a:hover,
#footer-mobile .footer-mobile__legal a:focus {
  color: #1fa2ff;
}

#footer-mobile .footer__copyright {
  margin-top: 0;
  padding-top: 1rem;
  border-top: 1px solid rgba(255, 255, 255, 0.1);
  color: rgba(255, 255, 255, 0.62);
  font-size: 0.82rem;
}

#footer-mobile .footer__copyright strong {
  color: rgba(255, 255, 255, 0.9);
}


/* Fixed site header — OcMono two-tier layout, previous dark navy bg */
.oc-site-header,
.oc-site-header.navbar-fixed-top,
#navbar.oc-site-header {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  width: 100%;
  z-index: 1030;
  float: none !important;
  clear: both;
  background: #0e1d34 !important;
  background-color: rgba(14, 29, 52, 1) !important;
  transition: box-shadow 0.25s ease;
}

.oc-site-header--compact {
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.25);
}

.oc-site-header__inner {
  width: 100%;
  max-width: 1600px;
  margin: 0 auto;
  padding: 0 24px;
}

.oc-site-header__top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  min-height: 36px;
  padding: 6px 0;
  background: transparent;
  border-bottom: 1px solid #20324d;
  overflow: hidden;
  max-height: 52px;
  opacity: 1;
  transition: max-height 0.25s ease, opacity 0.2s ease, padding 0.25s ease, border-color 0.25s ease;
}

.oc-site-header--compact .oc-site-header__top {
  max-height: 0;
  min-height: 0;
  opacity: 0;
  padding-top: 0;
  padding-bottom: 0;
  border-bottom-color: transparent;
  pointer-events: none;
}

.oc-site-header__main {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  padding: 10px 0 14px;
  transition: padding 0.25s ease;
}

.oc-site-header--compact .oc-site-header__main {
  padding-top: 8px;
  padding-bottom: 10px;
}

.oc-site-header .navbar-logo {
  flex: 0 0 auto;
  height: auto;
  margin: 0;
  padding: 0 !important;
}

.oc-site-header .navbar-logo a {
  display: block;
  padding: 0 !important;
  line-height: 0;
}

.oc-site-header .navbar-logo img {
  display: block;
  max-height: 64px;
  width: auto;
  height: auto;
  transition: max-height 0.25s ease;
}

.oc-site-header--compact .navbar-logo img {
  max-height: 52px;
}

.oc-site-header .top-navbar-text {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 4px 22px;
  margin: 0;
  float: none;
  color: #c8d0db;
  font-size: 13px;
}

.oc-site-header .top-navbar-text .tnt {
  float: none;
  width: auto;
  padding: 0;
  white-space: nowrap;
}

.oc-site-header .top-navbar-text .tnt i {
  margin-right: 6px;
  color: #c8d0db;
}

.oc-site-header .top-navbar-text a {
  color: inherit;
  text-decoration: none;
}

.oc-site-header .top-navbar-text a:hover {
  color: #fff;
}

.oc-site-header__top-right {
  display: flex;
  align-items: center;
  gap: 14px;
}

.oc-site-header__social {
  display: flex;
  align-items: center;
  gap: 2px;
}

.oc-site-header__social .icons {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 28px;
  height: 28px;
  color: #c8d0db;
  font-size: 14px;
  text-decoration: none;
  line-height: 0;
  transition: color 0.2s ease;
}

.oc-site-header__social .icons:hover,
.oc-site-header__social .icons:focus {
  color: #f0c040;
}

.oc-site-header .social-icons,
.oc-site-header .oc-site-header__utilities,
.oc-site-header .oc-site-header__utils {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 0.15rem;
  width: auto;
  height: auto;
  position: static;
  flex: 0 0 auto;
}

.oc-site-header .social-icons .icons {
  float: none;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 4px !important;
  line-height: 0;
}

.oc-site-header .site-nav.navbar {
  flex: 1 1 auto;
  display: flex;
  justify-content: center;
  float: none !important;
  width: auto;
  min-width: 0;
  margin: 0;
  padding: 0;
  max-width: none;
}

.oc-site-header .site-nav ul {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: 0;
  width: auto;
  margin: 0;
  padding: 0;
  list-style: none;
}

.oc-site-header .site-nav li {
  position: relative;
}

.oc-site-header .site-nav a,
.oc-site-header .site-nav a:focus,
.oc-site-header .site-nav a.active,
.oc-site-header .site-nav .active,
.oc-site-header .site-nav .active:focus {
  display: inline-flex;
  align-items: center;
  padding: 10px 14px;
  font-size: 14px;
  font-weight: 600;
  text-transform: capitalize;
  letter-spacing: 0.01em;
  color: #fff !important;
  white-space: nowrap;
  text-decoration: none;
  transition: color 0.2s ease;
}

.oc-site-header .site-nav a i {
  font-size: 11px;
  margin-left: 4px;
  opacity: 0.75;
}

.oc-site-header .site-nav > ul > li > a:hover,
.oc-site-header .site-nav > ul > li > a:focus,
.oc-site-header .site-nav > ul > li:hover > a {
  color: #fff !important;
  opacity: 0.85;
}

.oc-site-header .site-nav li.dropdown:not(.dropdown--mega) > ul {
  display: block;
  position: absolute;
  top: 100%;
  left: 50%;
  transform: translateX(-50%);
  margin: 0;
  padding: 8px 0;
  z-index: 120;
  min-width: 220px;
  list-style: none;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  background: #0e1d34;
  border: 1px solid #20324d;
  box-shadow: 0 12px 28px rgba(0, 0, 0, 0.35);
  border-radius: 4px;
  transition: opacity 0.2s ease, visibility 0.2s ease;
}

.oc-site-header .site-nav li.dropdown:not(.dropdown--mega):hover > ul,
.oc-site-header .site-nav li.dropdown:not(.dropdown--mega):focus-within > ul {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
}

.oc-site-header .site-nav li.dropdown > ul a {
  text-transform: none;
  font-weight: 500;
  font-size: 13px;
  letter-spacing: 0;
  color: #e8edf5 !important;
  justify-content: flex-start;
  width: 100%;
}

.oc-site-header .site-nav li.dropdown > ul a:hover,
.oc-site-header .site-nav li.dropdown > ul a:focus,
.oc-site-header .site-nav li.dropdown > ul li:hover > a {
  color: #fff !important;
  background: rgba(255, 255, 255, 0.06);
}

/* Products full-width mega menu */
.oc-site-header__main {
  position: relative;
}

.oc-site-header .site-nav li.dropdown--mega {
  position: static;
}

.oc-site-header .site-nav li.dropdown--mega > .oc-mega-menu {
  position: absolute;
  left: 0;
  right: 0;
  top: calc(100% - 2px);
  z-index: 120;
  display: block;
  width: 100%;
  min-width: 0;
  padding: 0;
  margin: 0;
  background: #fff;
  border: 1px solid #e8edf5;
  border-top: 2px solid #1fa2ff;
  box-shadow: 0 18px 40px rgba(14, 29, 52, 0.16);
  border-radius: 0 0 6px 6px;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transform: translateY(8px);
  transition: opacity 0.2s ease, transform 0.2s ease, visibility 0.2s ease;
}

.oc-site-header .site-nav li.dropdown--mega:hover > .oc-mega-menu,
.oc-site-header .site-nav li.dropdown--mega:focus-within > .oc-mega-menu {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
  transform: translateY(0);
}

.oc-mega-menu__inner {
  padding: 1.35rem 1.25rem 1.1rem;
}

.oc-mega-menu__grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
  gap: 0.85rem 0.75rem;
}

.oc-mega-menu__card {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 0.65rem;
  padding: 0.75rem;
  border: 1px solid #e8edf5;
  border-radius: 6px;
  background: #fff;
  text-decoration: none !important;
  color: #0e1d34 !important;
  transition: background 0.2s ease, border-color 0.2s ease, transform 0.2s ease, box-shadow 0.2s ease;
  width: auto !important;
  white-space: normal !important;
  text-transform: none !important;
  font-weight: 500 !important;
  font-size: 13px !important;
  letter-spacing: 0 !important;
}

.oc-mega-menu__card:hover,
.oc-mega-menu__card:focus {
  background: #faf6f8;
  border-color: #1fa2ff;
  color: #0e1d34 !important;
  transform: translateY(-2px);
  box-shadow: 0 8px 18px rgba(14, 29, 52, 0.08);
}

.oc-mega-menu__card--all {
  background: #faf6f8;
  border-color: #e5d0db;
}

.oc-mega-menu__card--all:hover,
.oc-mega-menu__card--all:focus {
  background: #f3e8ef;
  border-color: #1fa2ff;
}

.oc-mega-menu__thumb {
  position: relative;
  display: block;
  flex: 0 0 auto;
  width: 100%;
  max-width: 7.5rem;
  aspect-ratio: 1 / 1;
  height: auto;
  margin: 0 auto;
  border-radius: 6px;
  overflow: hidden;
  background: #f0f3f8;
}

.oc-mega-menu__thumb img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  max-width: none;
  object-fit: cover;
  object-position: center center;
  display: block;
}

.oc-mega-menu__thumb--icon,
.oc-mega-menu__thumb:not(:has(img)) {
  display: flex;
  align-items: center;
  justify-content: center;
  color: #1fa2ff;
  font-size: 1.75rem;
}

.oc-mega-menu__thumb--icon img {
  position: absolute;
}

.oc-mega-menu__meta {
  display: flex;
  flex-direction: column;
  gap: 0.15rem;
  text-align: center;
}

.oc-mega-menu__label {
  display: block;
  font-weight: 700;
  font-size: 0.92rem;
  color: #0e1d34;
  line-height: 1.3;
}

.oc-mega-menu__card:hover .oc-mega-menu__label,
.oc-mega-menu__card:focus .oc-mega-menu__label {
  color: #1fa2ff;
}

.oc-mega-menu__count {
  display: block;
  font-size: 0.75rem;
  color: #667085;
  font-weight: 500;
}

.oc-mega-menu__footer {
  display: flex;
  flex-wrap: wrap;
  gap: 0.35rem 1.25rem;
  margin-top: 1.1rem;
  padding-top: 0.95rem;
  border-top: 1px solid #e8edf5;
}

.oc-mega-menu__footer a {
  padding: 0 !important;
  font-size: 0.82rem !important;
  font-weight: 600 !important;
  text-transform: none !important;
  color: #5a6a7e !important;
  width: auto !important;
}

.oc-mega-menu__footer a:hover,
.oc-mega-menu__footer a:focus {
  color: #1fa2ff !important;
  background: transparent !important;
}

/* Beat header nav white-link rule inside white mega panel */
.oc-site-header .site-nav .oc-mega-menu a.oc-mega-menu__card,
.oc-site-header .site-nav .oc-mega-menu a.oc-mega-menu__card:focus,
.oc-site-header .site-nav .oc-mega-menu a.oc-mega-menu__card:hover,
.oc-site-header .site-nav .oc-mega-menu a.oc-mega-menu__card:active {
  display: flex !important;
  color: #0e1d34 !important;
  white-space: normal !important;
  text-transform: none !important;
  padding: 0.75rem !important;
  font-weight: 500 !important;
  opacity: 1 !important;
}

.oc-site-header .site-nav .oc-mega-menu a.oc-mega-menu__card:hover .oc-mega-menu__label,
.oc-site-header .site-nav .oc-mega-menu a.oc-mega-menu__card:focus .oc-mega-menu__label {
  color: #1fa2ff !important;
}

.oc-site-header .site-nav .oc-mega-menu .oc-mega-menu__footer a,
.oc-site-header .site-nav .oc-mega-menu .oc-mega-menu__footer a:focus,
.oc-site-header .site-nav .oc-mega-menu .oc-mega-menu__footer a:hover {
  color: #5a6a7e !important;
  padding: 0 !important;
  white-space: nowrap !important;
  opacity: 1 !important;
}

.oc-site-header .site-nav .oc-mega-menu .oc-mega-menu__footer a:hover,
.oc-site-header .site-nav .oc-mega-menu .oc-mega-menu__footer a:focus {
  color: #1fa2ff !important;
}

@media (min-width: 1100px) {
  .oc-mega-menu__grid--products {
    grid-template-columns: repeat(6, minmax(0, 1fr));
  }

  .oc-mega-menu__grid--services {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
}

@media (max-width: 1099px) and (min-width: 992px) {
  .oc-mega-menu__grid--products,
  .oc-mega-menu__grid--services {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

.hide-on-desktop .header-nav ul.menu.nav li a {
  text-transform: none;
  font-weight: 500;
  letter-spacing: 0;
}

/* Mobile top bar — burger + logo + actions */
.oc-mobile-header.hide-on-desktop {
  min-height: 64px;
  padding: 0;
  border-bottom: 0;
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.18);
}

.oc-mobile-header .oc-mobile-header__bar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  min-height: 64px;
  padding: 8px 12px;
  box-sizing: border-box;
}

.oc-mobile-header .nav-bar-menu {
  position: relative;
  flex: 0 0 auto;
  width: 44px;
  height: 44px;
  margin: 0;
  padding: 0;
}

.oc-mobile-header .burger {
  position: relative !important;
  top: auto !important;
  left: auto !important;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 44px !important;
  height: 44px !important;
  margin: 0 !important;
  padding: 0;
  border-radius: 8px;
  background: transparent !important;
  overflow: visible !important;
  z-index: 2;
}

.oc-mobile-header .burger:after {
  display: none;
}

.oc-mobile-header .burger span,
.oc-mobile-header .burger span:before,
.oc-mobile-header .burger span:after {
  left: 50% !important;
  width: 20px !important;
  height: 2px !important;
  margin-left: -10px;
  background: rgba(255, 255, 255, 0.92) !important;
  border-radius: 2px;
}

.oc-mobile-header .burger span {
  top: 50% !important;
  margin-top: -1px;
}

.oc-mobile-header .burger span:before {
  top: -6px !important;
}

.oc-mobile-header .burger span:after {
  top: 6px !important;
}

.oc-mobile-header .burger-check:checked + .burger {
  /* Drawer has its own close control; keep header icon from sitting under the panel. */
  visibility: hidden;
  pointer-events: none;
}

.oc-mobile-header .burger-check:checked + .burger span:before {
  top: 0 !important;
}

.oc-mobile-header .burger-check:checked + .burger span:after {
  top: 0 !important;
}

.oc-mobile-header .header-nav {
  float: none !important;
  height: 0 !important;
  width: 0 !important;
  position: static !important;
  overflow: visible !important;
}

.oc-mobile-header .oc-mobile-nav-backdrop {
  display: block;
  position: fixed;
  inset: 0;
  z-index: 1055;
  margin: 0;
  padding: 0;
  border: 0;
  cursor: pointer;
  background: linear-gradient(
    145deg,
    rgba(14, 29, 52, 0.78) 0%,
    rgba(20, 40, 70, 0.62) 45%,
    rgba(31, 162, 255, 0.28) 100%
  );
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transition: opacity 0.25s ease, visibility 0.25s ease;
}

.oc-mobile-header .burger-check:checked ~ .oc-mobile-nav-backdrop {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
}

.oc-mobile-header .header-nav ul.oc-mobile-nav {
  position: fixed !important;
  top: 0 !important;
  left: 0 !important;
  right: auto !important;
  bottom: 0 !important;
  width: min(86vw, 320px) !important;
  height: 100% !important;
  height: 100dvh !important;
  max-height: none !important;
  margin: 0 !important;
  margin-left: 0 !important;
  padding: 0 0 calc(72px + env(safe-area-inset-bottom, 0px)) !important;
  z-index: 1060;
  overflow-x: hidden;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  overscroll-behavior: contain;
  box-sizing: border-box;
  transform: translate3d(-105%, 0, 0);
  -webkit-transform: translate3d(-105%, 0, 0);
  transition: transform 0.28s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

.oc-mobile-header .burger-check:checked ~ .header-nav ul.oc-mobile-nav {
  transform: translate3d(0, 0, 0);
  -webkit-transform: translate3d(0, 0, 0);
}

.oc-mobile-header .oc-navbar-brand {
  flex: 1 1 auto;
  min-width: 0;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  padding: 0 4px;
}

.oc-mobile-header .oc-navbar-brand a {
  display: inline-flex;
  align-items: center;
  line-height: 0;
  max-width: 100%;
}

.oc-mobile-header .oc-navbar-brand img {
  display: block;
  height: 46px !important;
  width: auto;
  max-width: min(220px, 52vw);
  margin: 0 !important;
  object-fit: contain;
}

.oc-mobile-header .header-actions {
  flex: 0 0 auto;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 2px;
  margin: 0 !important;
  padding: 0;
}

.oc-mobile-header .header-util-link,
.oc-mobile-header .header-cart {
  width: 40px !important;
  height: 40px !important;
  min-width: 40px;
  flex: 0 0 40px;
  margin: 0;
  border: 0 !important;
  border-radius: 8px;
  background: transparent !important;
  color: #fff !important;
}

.oc-mobile-header .header-util-link i,
.oc-mobile-header .header-util-link .bi,
.oc-mobile-header .header-cart i,
.oc-mobile-header .header-cart .bi {
  color: #fff !important;
}

.oc-mobile-header .burger span,
.oc-mobile-header .burger span:before,
.oc-mobile-header .burger span:after {
  background: #fff !important;
}

.oc-mobile-header .header-cart {
  position: relative;
}

@media (max-width: 380px) {
  .oc-mobile-header .oc-mobile-header__bar {
    padding: 6px 8px;
    gap: 4px;
  }

  .oc-mobile-header .oc-navbar-brand img {
    height: 40px !important;
    max-width: min(180px, 48vw);
  }

  .oc-mobile-header .header-util-link,
  .oc-mobile-header .header-cart {
    width: 36px !important;
    height: 36px !important;
    min-width: 36px;
    flex-basis: 36px;
  }
}

/* Mobile drawer menu - grouped sections */
.hide-on-desktop .header-nav ul.oc-mobile-nav {
  width: min(86vw, 320px);
  margin-left: 0;
  padding: 0 0 calc(72px + env(safe-area-inset-bottom, 0px));
  background: linear-gradient(180deg, #ffffff 0%, #f7f9fc 55%, #eef4fb 100%);
  box-sizing: border-box;
  box-shadow: 8px 0 28px rgba(14, 29, 52, 0.18);
  border-right: 1px solid rgba(14, 29, 52, 0.06);
}

.hide-on-desktop .header-nav ul.oc-mobile-nav > li {
  float: none !important;
  width: 100%;
  box-sizing: border-box;
}

.hide-on-desktop .header-nav ul.oc-mobile-nav .oc-mobile-nav__toolbar {
  position: sticky;
  top: 0;
  z-index: 2;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin: 0 !important;
  padding: 12px 12px 12px 18px !important;
  background: #fff;
  border-bottom: 1px solid #eef2f7;
  box-shadow: 0 1px 0 rgba(14, 29, 52, 0.04);
}

.hide-on-desktop .header-nav ul.oc-mobile-nav .oc-mobile-nav__toolbar-title {
  font-size: 15px;
  font-weight: 700;
  color: #0e1d34;
  letter-spacing: 0.01em;
}

.hide-on-desktop .header-nav ul.oc-mobile-nav .oc-mobile-nav__close {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  margin: 0;
  border-radius: 10px;
  background: #f1f5fa;
  color: #0e1d34;
  cursor: pointer;
  flex: 0 0 40px;
  line-height: 1;
}

.hide-on-desktop .header-nav ul.oc-mobile-nav .oc-mobile-nav__close i {
  font-size: 18px;
  line-height: 1;
}

.hide-on-desktop .header-nav ul.oc-mobile-nav .oc-mobile-nav__close:hover,
.hide-on-desktop .header-nav ul.oc-mobile-nav .oc-mobile-nav__close:focus {
  background: #e8eef6;
  color: #1fa2ff;
}

.hide-on-desktop .header-nav ul.oc-mobile-nav > li > a,
.hide-on-desktop .header-nav ul.oc-mobile-nav .oc-mobile-nav__sub a {
  float: none !important;
  width: 100% !important;
  display: block;
  box-sizing: border-box;
  overflow: visible !important;
  margin: 0 !important;
  padding: 7px 16px 7px 18px !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  line-height: 1.35 !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
  color: #17244a;
}

.hide-on-desktop .header-nav ul.oc-mobile-nav > .oc-mobile-nav__item > a {
  padding: 8px 16px 8px 18px !important;
  font-size: 13.5px !important;
  font-weight: 600 !important;
  color: #0e1d34;
}

.hide-on-desktop .header-nav ul.oc-mobile-nav .oc-mobile-nav__group {
  margin-top: 6px;
  padding-top: 8px;
  border-top: 1px solid #eef2f7;
}

.hide-on-desktop .header-nav ul.oc-mobile-nav .oc-mobile-nav__group:first-of-type {
  margin-top: 4px;
}

.hide-on-desktop .header-nav ul.oc-mobile-nav .oc-mobile-nav__label {
  display: block;
  padding: 2px 16px 4px 18px;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.07em;
  text-transform: uppercase;
  color: #8a94a6;
}

.hide-on-desktop .header-nav ul.oc-mobile-nav .oc-mobile-nav__sub {
  list-style: none;
  margin: 0;
  padding: 0;
  position: static !important;
  float: none !important;
  width: 100% !important;
  height: auto !important;
  overflow: visible !important;
  transform: none !important;
  box-shadow: none !important;
  background: transparent !important;
  top: auto !important;
}

.hide-on-desktop .header-nav ul.oc-mobile-nav .oc-mobile-nav__sub li {
  float: none !important;
  width: 100%;
}

.hide-on-desktop .header-nav ul.oc-mobile-nav .oc-mobile-nav__sub a {
  padding: 6px 16px 6px 30px !important;
  font-size: 12.5px !important;
  font-weight: 500 !important;
  color: #4a5568;
}

.hide-on-desktop .header-nav ul.oc-mobile-nav .oc-mobile-nav__sub a:hover,
.hide-on-desktop .header-nav ul.oc-mobile-nav .oc-mobile-nav__sub a:focus,
.hide-on-desktop .header-nav ul.oc-mobile-nav > .oc-mobile-nav__item > a:hover,
.hide-on-desktop .header-nav ul.oc-mobile-nav > .oc-mobile-nav__item > a:focus {
  color: #1fa2ff !important;
  background: #f7faff;
}

.hide-on-desktop .header-nav ul.oc-mobile-nav .oc-mobile-nav__cta {
  margin-top: 10px;
  padding: 10px 14px 0;
  border-top: 1px solid #eef2f7;
}

.hide-on-desktop .header-nav ul.oc-mobile-nav .oc-mobile-nav__cta a {
  display: block;
  width: 100% !important;
  float: none !important;
  padding: 10px 14px !important;
  border-radius: 8px;
  background: #0e1d34;
  color: #fff !important;
  font-size: 13px !important;
  font-weight: 700 !important;
  text-align: center;
  text-transform: none !important;
}

.hide-on-desktop .header-nav ul.oc-mobile-nav .oc-mobile-nav__cta a:hover,
.hide-on-desktop .header-nav ul.oc-mobile-nav .oc-mobile-nav__cta a:focus {
  background: #1fa2ff;
  color: #fff !important;
}


.oc-site-header .site-nav .get-a-quote,
.oc-site-header .site-nav .get-a-quote:focus {
  display: inline-flex;
  align-items: center;
  margin-left: 8px;
  padding: 8px 22px;
  border-radius: var(--oc-btn-radius);
  background: rgba(255, 255, 255, 0.18);
  color: #fff !important;
  font-size: 13px;
  white-space: nowrap;
}

.oc-site-header .site-nav .get-a-quote:hover,
.oc-site-header .site-nav .get-a-quote:focus:hover {
  background: #841b4b;
  color: #fff !important;
}

@media (min-width: 1280px) and (max-width: 1500px) {
  .oc-site-header__inner {
    padding: 0 20px;
  }

  .oc-site-header .site-nav a,
  .oc-site-header .site-nav a:focus {
    padding: 8px 10px;
    font-size: 13px;
  }

  .oc-site-header .site-nav .get-a-quote,
  .oc-site-header .site-nav .get-a-quote:focus {
    padding: 8px 16px;
    font-size: 12px;
  }
}

@media (min-width: 1280px) {
  .oc-site-header .header-actions {
    justify-content: flex-end;
  }
}

body:not(.path-frontpage) .container-fluid,
body:not(.path-frontpage) .navbar .container-fluid {
  min-width: 0 !important;
}

/* Hero + breadcrumb bar — OcMono (previous interior design) */
nav.breadcrumbs.oc-interior-hero,
section.breadcrumbs.oc-interior-hero {
  clear: both;
  display: block;
  width: 100%;
  float: none;
  overflow: visible;
  margin: 0;
  padding: 36px 0 28px;
  background-color: #f6f6f6 !important;
  text-align: center;
}

nav.breadcrumbs.oc-interior-hero .oc-interior-hero__section-title,
section.breadcrumbs.oc-interior-hero .oc-interior-hero__section-title {
  padding-bottom: 12px;
}

nav.breadcrumbs.oc-interior-hero .oc-interior-hero__title,
section.breadcrumbs.oc-interior-hero .oc-interior-hero__title {
  position: relative;
  display: block;
  margin: 0;
  padding-bottom: 0.75rem;
  font-family: "Montserrat", sans-serif !important;
  font-size: 30px;
  font-weight: 700;
  line-height: 1.2;
  color: #111111 !important;
  text-transform: capitalize;
  text-align: center;
  border: 0;
  letter-spacing: normal;
  word-break: normal;
  white-space: normal;
}

nav.breadcrumbs.oc-interior-hero .oc-interior-hero__title::after,
section.breadcrumbs.oc-interior-hero .oc-interior-hero__title::after {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  margin: 0 auto;
  width: 60px;
  height: 2px;
  background: var(--brand-primary);
}

nav.breadcrumbs.oc-interior-hero .oc-interior-hero__subtitle,
section.breadcrumbs.oc-interior-hero .oc-interior-hero__subtitle {
  margin: 0.75rem 0 0;
  font-size: 0.95rem;
  font-weight: 500;
  color: #666;
  text-align: center;
  max-width: none;
}

nav.breadcrumbs.oc-interior-hero ol.oc-interior-hero__crumbs,
nav.breadcrumbs.oc-interior-hero ol.breadcrumb.oc-interior-hero__crumbs {
  display: flex !important;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  list-style: none;
  margin: 0 !important;
  padding: 0 !important;
  font-size: 16px;
  font-weight: 400;
  line-height: 1;
  text-transform: capitalize;
  color: #111111;
  background: transparent !important;
  background-color: transparent !important;
  border-radius: 0;
}

nav.breadcrumbs.oc-interior-hero ol.oc-interior-hero__crumbs .breadcrumb-item,
nav.breadcrumbs.oc-interior-hero ol.oc-interior-hero__crumbs li {
  text-transform: capitalize;
  line-height: 1;
  padding: 0 !important;
  float: none;
}

nav.breadcrumbs.oc-interior-hero ol.oc-interior-hero__crumbs .breadcrumb-item a,
nav.breadcrumbs.oc-interior-hero ol.oc-interior-hero__crumbs li a {
  display: inline-block;
  position: relative;
  color: #111111 !important;
  text-decoration: none;
  line-height: 1;
  transition: color 0.2s ease;
}

nav.breadcrumbs.oc-interior-hero ol.oc-interior-hero__crumbs .breadcrumb-item a:hover,
nav.breadcrumbs.oc-interior-hero ol.oc-interior-hero__crumbs li a:hover {
  color: var(--brand-primary) !important;
  text-decoration: none;
}

nav.breadcrumbs.oc-interior-hero ol.oc-interior-hero__crumbs .breadcrumb-item + .breadcrumb-item,
nav.breadcrumbs.oc-interior-hero ol.oc-interior-hero__crumbs li + li {
  padding-left: 0 !important;
}

nav.breadcrumbs.oc-interior-hero ol.oc-interior-hero__crumbs .breadcrumb-item + .breadcrumb-item::before,
nav.breadcrumbs.oc-interior-hero ol.oc-interior-hero__crumbs li + li::before {
  content: "\203A" !important;
  float: none;
  display: inline-block;
  color: #707070 !important;
  margin: 0 10px !important;
  padding: 0 !important;
  position: relative;
  top: 1px;
  font-size: 18px;
  font-weight: 400;
  line-height: 1;
}

nav.breadcrumbs.oc-interior-hero ol.oc-interior-hero__crumbs .breadcrumb-item.active,
nav.breadcrumbs.oc-interior-hero ol.oc-interior-hero__crumbs .breadcrumb-item.is-active,
nav.breadcrumbs.oc-interior-hero ol.oc-interior-hero__crumbs li.is-active,
nav.breadcrumbs.oc-interior-hero ol.oc-interior-hero__crumbs li.active {
  color: var(--brand-primary) !important;
}

.oc-blog-article-page nav.breadcrumbs.oc-interior-hero ol.oc-interior-hero__crumbs .breadcrumb-item.active,
.oc-blog-article-page nav.breadcrumbs.oc-interior-hero ol.oc-interior-hero__crumbs .breadcrumb-item.is-active,
.oc-blog-article-page nav.breadcrumbs.oc-interior-hero ol.oc-interior-hero__crumbs li.is-active,
.oc-blog-article-page nav.breadcrumbs.oc-interior-hero ol.oc-interior-hero__crumbs li.active {
  color: #6c757d !important;
  font-weight: 500;
}

@media screen and (max-width: 1200px) {
  nav.breadcrumbs.oc-interior-hero,
  section.breadcrumbs.oc-interior-hero {
    padding: 28px 0 22px;
  }
}

@media screen and (max-width: 767px) {
  nav.breadcrumbs.oc-interior-hero,
  section.breadcrumbs.oc-interior-hero {
    padding: 20px 0 16px;
  }

  nav.breadcrumbs.oc-interior-hero .oc-interior-hero__title,
  section.breadcrumbs.oc-interior-hero .oc-interior-hero__title {
    font-size: 20px;
  }
}

@media (max-width: 1279px) {
  nav.breadcrumbs.oc-interior-hero ol.oc-interior-hero__crumbs,
  nav.breadcrumbs.oc-interior-hero ol.breadcrumb.oc-interior-hero__crumbs,
  section.breadcrumbs.oc-interior-hero ol.oc-interior-hero__crumbs,
  .region-breadcrumb .breadcrumb,
  nav.breadcrumb:not(.oc-interior-hero) {
    display: none !important;
  }
}


body:not(.path-frontpage) .node__content,
body:not(.path-frontpage) .view-services-listing,
body:not(.path-frontpage) .view-shop {
  margin-top: 0;
}

body:not(.path-frontpage) #main > .container {
  padding-top: 40px;
  padding-bottom: 60px;
}

/* Commerce product page */
.commerce-product__layout {
  margin-top: 10px;
}

.commerce-product__title-inline {
  position: absolute !important;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

.commerce-product__body {
  margin-bottom: 1.25rem;
}

.commerce-product__brand {
  margin-bottom: 1rem;
  font-weight: 600;
  color: #1fa2ff;
}

.commerce-product__purchase .form-actions {
  margin-top: 1rem;
}

.shop-catalog__item {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  height: 100%;
}

.shop-catalog__item > .shop-product-card,
.shop-catalog__item > article {
  width: 100%;
}

.shop-catalog .views-row,
.view-shop .views-row {
  margin-bottom: 0;
}

.shop-catalog .views-field-title a,
.view-shop .views-field-title a {
  color: #2c4964;
  font-weight: 700;
  text-decoration: none;
}

.shop-catalog .views-field-title a:hover,
.view-shop .views-field-title a:hover {
  color: #1fa2ff;
}

/* Shop catalog layout — category sidebar + product grid */
.shop-catalog__layout {
  margin-top: 0;
}

.shop-catalog__sidebar-title {
  font-size: 1.1rem;
  font-weight: 700;
  color: #2c4964;
  margin-bottom: 1rem;
}

.testimonials-slider .testimonials-item .content span {
  color: #e2e2e2;
}

/* OcMono Google Reviews */
.testimonials-area {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  background-color: #e8f4fb;
}

.testimonials-area::before {
  z-index: 0;
}

.testimonials-area::after {
  z-index: 1;
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.9) 0%, rgba(232, 244, 251, 0.95) 100%);
  opacity: 1;
}

.testimonials-area .container {
  position: relative;
  z-index: 2;
}

.testimonials-area.google-reviews-section {
  padding: 3.5rem 0 2.75rem;
}

.testimonials-area .google-reviews-header {
  margin-bottom: 1.75rem;
  padding: 0 !important;
  text-align: center;
}

.testimonials-area .google-reviews-header h2 {
  display: block !important;
  margin: 0 auto !important;
  padding: 0 !important;
  border-bottom: none !important;
  font-size: clamp(1.65rem, 2.5vw, 2.15rem) !important;
  line-height: 1.2 !important;
  letter-spacing: 0.06em !important;
  color: #16213e;
}

.testimonials-area .google-reviews-header h2::after {
  content: "";
  display: block;
  width: 3.5rem;
  height: 4px;
  margin: 0.65rem auto 0;
  background: #1fa2ff;
  border-radius: 2px;
}

.testimonials-area .google-reviews-header__lead {
  max-width: 34rem;
  margin: 0.85rem auto 0;
  color: #5a6578;
  font-size: 0.98rem;
  line-height: 1.5;
  font-weight: 400;
}

.testimonials-img {
  box-shadow: 0 22px 55px rgba(22, 33, 62, 0.22);
  border-radius: 12px;
  overflow: hidden;
}

.testimonials-img img {
  display: block;
  width: 100%;
  height: auto;
}

.testimonials-slider-area {
  position: relative;
}

.testimonials-slider {
  box-shadow: 0 24px 60px rgba(0, 47, 121, 0.32);
}

.google-reviews-link-wrap {
  position: relative;
  z-index: 2;
  margin-top: 1.25rem !important;
}

.google-reviews-link {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  color: #1fa2ff;
  font-weight: 600;
  text-decoration: none;
  padding: 0.5rem 1rem;
  border-radius: var(--oc-btn-radius);
  background: rgba(255, 255, 255, 0.9);
  box-shadow: 0 4px 14px rgba(22, 33, 62, 0.1);
  transition: color 0.2s ease, box-shadow 0.2s ease, transform 0.2s ease;
}

.google-reviews-link:hover {
  color: #2c4964;
  text-decoration: none;
  box-shadow: 0 6px 18px rgba(22, 33, 62, 0.14);
  transform: translateY(-1px);
}

/* Dark review card panel */
.testimonials-slider .carousel {
  position: relative;
  z-index: 2;
}

.testimonials-slider .testimonials-item {
  text-align: center;
}

.testimonials-slider .testimonials-item > .bi-quote {
  color: #1fa2ff;
  font-size: 42px;
  line-height: 1;
  display: block;
  margin-bottom: 0.75rem;
}

.testimonials-slider .testimonials-item p {
  font-size: 17px;
  color: #fff;
  margin-bottom: 1.25rem;
  line-height: 1.65;
  min-height: 108px;
  padding: 0 0.5rem;
}

.testimonials-slider .testimonials-item .content {
  position: relative;
  z-index: 2;
}

.testimonials-slider .review-meta {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.4rem;
  margin-bottom: 0.85rem;
}

.testimonials-slider .testimonials-item .g-review img,
.testimonials-slider .testimonials-item .content img {
  width: 72px;
  max-width: 72px;
  height: auto;
  margin: 0;
  display: block;
}

.testimonials-slider .review-stars {
  color: #fbbc04;
  font-size: 0.8rem;
  line-height: 1;
  letter-spacing: 0.02em;
}

.testimonials-slider .review-stars i {
  font-size: 0.8rem !important;
  margin: 0 0.04rem;
}

.testimonials-slider .testimonials-item .content h3 {
  font-size: 17px;
  font-weight: 700;
  color: #fff;
  margin-bottom: 0.2rem;
}

.testimonials-slider .testimonials-item .content span {
  color: #c8d9f0;
  font-size: 14px;
}

.testimonials-slider .carousel-control-prev,
.testimonials-slider .carousel-control-next {
  width: 10%;
  opacity: 0.95;
  z-index: 3;
}

.testimonials-slider .carousel-control-prev-icon,
.testimonials-slider .carousel-control-next-icon {
  width: 2rem;
  height: 2rem;
  filter: brightness(0) invert(1);
  background-size: 100% 100%;
}

@media (max-width: 1279px) {
  .testimonials-area.google-reviews-section {
    padding: 2rem 0 1.75rem;
  }

  .testimonials-area .google-reviews-header {
    margin-bottom: 1.25rem;
  }

  .testimonials-area .google-reviews-header__lead {
    font-size: 0.92rem;
    padding: 0 0.5rem;
  }

  .testimonials-slider {
    margin-left: 0 !important;
    margin-right: 0 !important;
    margin-top: 0;
  }

  .testimonials-slider .testimonials-item p {
    min-height: auto;
    font-size: 0.98rem;
    padding: 0 0.25rem;
  }

  .testimonials-slider .carousel-control-prev,
  .testimonials-slider .carousel-control-next {
    width: 2.75rem;
  }
}

.shop-catalog__filters {
  margin-bottom: 0;
  padding-bottom: 0;
  border-bottom: 0;
}

.shop-facets {
  margin: 0;
}

.shop-facets__group {
  border: 0;
  margin: 0;
  padding: 0;
  min-width: 0;
}

.shop-catalog__list {
  list-style: none;
  margin: 0;
  padding: 0;
}

.shop-category-term__description {
  margin-bottom: 1.5rem;
  color: #555;
}

.shop-catalog__empty {
  padding: 2rem;
  text-align: center;
  color: #666;
}

/* Hide duplicate in-content H1 when hero is shown */
body:not(.path-frontpage) #main > .block-page-title-block,
body:not(.path-frontpage) .block-system-breadcrumb-block {
  display: none !important;
}

/* OcMono front page service grids */
section.services .views-element-container,
section.services .view-services {
  width: 100%;
}

section.services .view-content.row {
  --bs-gutter-x: 0;
  margin: 0;
}

section.services .views-view-grid .views-row {
  display: flex;
  flex-wrap: wrap;
  margin: 0 -10px;
}

section.services .views-view-grid .views-col {
  width: 33.333% !important;
  padding: 0 10px;
  flex: 0 0 33.333%;
  max-width: 33.333%;
}

@media (max-width: 991px) {
  section.services .views-view-grid,
  .front-clinic .views-view-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
    margin: 0;
  }

  section.services .views-view-grid .views-row,
  .front-clinic .views-view-grid .views-row {
    display: contents;
    margin: 0;
  }

  section.services .views-view-grid .views-col,
  .front-clinic .views-view-grid .views-col {
    width: auto !important;
    flex: none !important;
    max-width: none !important;
    padding: 0;
    margin: 0;
    min-width: 0;
  }
}

@media (max-width: 575px) {
  section.services .views-view-grid,
  .front-clinic .views-view-grid {
    gap: 10px;
  }
}

.hide-on-desktop .header-actions .header-cart {
  color: #fff;
}

/* Hide default commerce cart block; header uses custom cart icon. */
.block-commerce-cart,
.commerce-cart-block {
  display: none !important;
}

/* Cart drawer — critical: stay off-page until opened (prevents layout break on front page). */
.oc-cart-drawer:not(.is-open) {
  display: none !important;
}

/* Search modal — critical: stay hidden until icon opens it. */
.oc-search-modal {
  position: fixed !important;
  inset: 0;
  z-index: 1100;
  display: none !important;
}

.oc-search-modal.is-open {
  display: block !important;
}

#hero-video {
  width: 100%;
  object-fit: cover;
}

#hero-video-mobile {
  width: 100%;
  object-fit: cover;
}

/* Hero video scoped to hero section only (prevents bleed on scroll) */
.hero-shell {
  position: relative;
  overflow: hidden;
  min-height: 100vh;
  background: #16213e;
}

.hero-shell__video {
  pointer-events: none;
}

.hide-on-desktop .mobile-bg {
  position: relative;
  overflow: hidden;
  background: #16213e;
}

.hide-on-desktop .mobile-video-block {
  position: relative;
  width: 100%;
  height: 50vh;
  min-height: 280px;
  overflow: hidden;
}

.hide-on-desktop .mobile-content-block,
.hide-on-desktop .mobile-counter-block-out {
  position: relative;
  z-index: 1;
}

/* Floating Book Appointment button — bottom left */
.book-appointment-icon {
  position: fixed;
  bottom: 20px;
  left: 20px;
  z-index: 999;
}

.book-appointment-icon img {
  width: 160px;
  max-width: min(160px, 40vw);
  height: auto;
}
/* Homepage beauty shop showcase */
.front section.oc-home-shop,
section.oc-home-shop {
  padding: 1.75rem 0 2.5rem !important;
  background: linear-gradient(180deg, #fff 0%, #faf7f9 100%);
  overflow: visible;
}

.oc-home-shop .section-header {
  margin-bottom: 0.85rem;
  padding: 0.35rem 0 0.65rem !important;
  text-align: center;
}

.oc-home-shop .section-header h2 {
  margin: 0 0 0.35rem !important;
  padding: 0 0 0.55rem !important;
  font-size: clamp(1.65rem, 2.5vw, 2.15rem) !important;
  line-height: 1.2 !important;
  letter-spacing: 0.06em !important;
}

.oc-home-shop .section-header p {
  max-width: 36rem;
  margin: 0.55rem auto 0;
  color: #5a6578;
  font-size: 0.98rem;
  line-height: 1.5;
}

.oc-home-shop__categories {
  margin: 0 0 0.85rem;
}

.oc-home-shop__categories-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  margin-bottom: 0.55rem;
}

.oc-home-shop__categories-label {
  margin: 0;
  font-size: 0.8rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: #5a6578;
}

.oc-home-shop__categories-nav {
  display: flex;
  gap: 0.4rem;
}

.oc-home-shop__categories-nav[hidden] {
  display: none;
}

.oc-home-shop__categories-btn,
.oc-home-shop__arrow {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 2.35rem;
  height: 2.35rem;
  padding: 0;
  border: 1px solid #d0deec;
  border-radius: 999px;
  background: #fff;
  color: #13316e;
  line-height: 1;
  cursor: pointer;
  box-shadow: 0 4px 14px rgba(19, 49, 110, 0.08);
  transition: background 0.2s ease, border-color 0.2s ease, color 0.2s ease, box-shadow 0.2s ease, transform 0.2s ease;
}

.oc-home-shop__arrow svg {
  display: block;
}

.oc-home-shop__categories-btn:hover,
.oc-home-shop__categories-btn:focus-visible,
.oc-home-shop__arrow:hover,
.oc-home-shop__arrow:focus-visible {
  background: #1fa2ff;
  border-color: #1fa2ff;
  color: #fff;
  outline: none;
  box-shadow: 0 8px 18px rgba(31, 162, 255, 0.28);
}

.oc-home-shop__categories-btn:disabled,
.oc-home-shop__arrow:disabled {
  opacity: 0.35;
  cursor: default;
  pointer-events: none;
  box-shadow: none;
}

.oc-home-shop__categories-track {
  display: flex;
  gap: 0.65rem;
  overflow-x: auto;
  overscroll-behavior-x: contain;
  scroll-snap-type: x mandatory;
  scroll-behavior: smooth;
  padding: 0.1rem 0.1rem 0.25rem;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
}

.oc-home-shop__categories-track::-webkit-scrollbar {
  display: none;
}

.oc-home-shop__category {
  flex: 0 0 auto;
  scroll-snap-align: start;
  display: inline-flex;
  align-items: center;
  gap: 0.45rem;
  max-width: 100%;
  padding: 0.65rem 1rem;
  border: 1px solid #d7e3ef;
  border-radius: 999px;
  background: #fff;
  color: #16213e;
  font-size: 0.92rem;
  font-weight: 600;
  line-height: 1.2;
  text-decoration: none;
  white-space: nowrap;
  box-shadow: 0 4px 14px rgba(19, 49, 110, 0.05);
  transition: background 0.2s ease, border-color 0.2s ease, color 0.2s ease, box-shadow 0.2s ease;
}

.oc-home-shop__category:hover,
.oc-home-shop__category:focus-visible,
.oc-home-shop__category.is-active {
  background: #1fa2ff;
  border-color: #1fa2ff;
  color: #fff;
  box-shadow: 0 8px 18px rgba(31, 162, 255, 0.28);
  outline: none;
}

.oc-home-shop__category-name {
  overflow: hidden;
  text-overflow: ellipsis;
}

.oc-home-shop__category-count {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 1.35rem;
  height: 1.35rem;
  padding: 0 0.35rem;
  border-radius: 999px;
  background: rgba(19, 49, 110, 0.08);
  color: inherit;
  font-size: 0.72rem;
  font-weight: 700;
}

.oc-home-shop__category:hover .oc-home-shop__category-count,
.oc-home-shop__category:focus-visible .oc-home-shop__category-count,
.oc-home-shop__category.is-active .oc-home-shop__category-count {
  background: rgba(255, 255, 255, 0.22);
}

.oc-home-shop__products {
  position: relative;
  margin-bottom: 1.15rem;
  padding: 0.15rem 0;
}

.oc-home-shop__products-nav {
  position: absolute;
  inset: 0;
  z-index: 3;
  display: flex;
  align-items: center;
  justify-content: space-between;
  pointer-events: none;
  padding: 0 0.15rem;
}

.oc-home-shop__products-nav[hidden] {
  display: none !important;
}

.oc-home-shop__products-nav:not([hidden]) {
  display: flex !important;
}

.oc-home-shop__products-nav .oc-home-shop__arrow {
  pointer-events: auto;
  width: 2.65rem;
  height: 2.65rem;
  background: rgba(255, 255, 255, 0.96);
  border-color: #cfe0f0;
  box-shadow: 0 8px 22px rgba(14, 29, 52, 0.12);
}

.oc-home-shop__products-nav .oc-home-shop__arrow:hover,
.oc-home-shop__products-nav .oc-home-shop__arrow:focus-visible {
  transform: scale(1.05);
}

.oc-home-shop__filter-empty {
  margin: 0.75rem 0 0;
  color: #667085;
  text-align: center;
}

.oc-home-shop .shop-catalog__list,
.oc-home-shop .oc-home-shop__grid .shop-catalog__list,
.oc-home-shop ul.shop-catalog__list {
  display: flex;
  flex-wrap: nowrap;
  gap: 1.1rem;
  list-style: none;
  margin: 0;
  padding: 0.25rem 0.15rem 0.35rem;
  overflow-x: auto;
  overscroll-behavior-x: contain;
  scroll-snap-type: x mandatory;
  scroll-behavior: smooth;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
}

.oc-home-shop .shop-catalog__list::-webkit-scrollbar {
  display: none;
  height: 0;
}

.oc-home-shop .shop-catalog__item {
  flex: 0 0 min(260px, 78vw);
  max-width: min(260px, 78vw);
  scroll-snap-align: start;
  list-style: none;
  display: flex !important;
  flex-direction: column;
  align-self: stretch;
  height: auto !important;
}

.oc-home-shop .shop-catalog__item.is-cat-hidden {
  display: none !important;
}

.oc-home-shop .shop-catalog__item > .shop-product-card,
.oc-home-shop .shop-catalog__item > article,
.oc-home-shop .shop-product-card {
  display: flex;
  flex-direction: column;
  flex: 1 1 auto;
  width: 100%;
  height: 100% !important;
  min-height: 100%;
}

.oc-home-shop .shop-product-card__inner,
.oc-home-shop .shop-product-card .card-body {
  display: flex !important;
  flex-direction: column;
  flex: 1 1 auto;
  height: 100%;
  min-height: 100%;
}

.oc-home-shop .shop-product-card__body {
  display: flex;
  flex-direction: column;
  flex: 1 1 auto;
  min-height: 0;
  padding: 12px 14px 14px;
  gap: 8px;
}

.oc-home-shop .shop-product-card__title {
  min-height: 0;
}

.oc-home-shop .shop-product-card__short {
  flex: 0 0 auto;
  margin: 0;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  max-height: calc(1.4em * 2);
  min-height: 0;
}

.oc-home-shop .shop-product-card__benefits {
  flex: 0 0 auto;
  margin: 0;
  display: -webkit-box !important;
  -webkit-line-clamp: 2 !important;
  -webkit-box-orient: vertical !important;
  overflow: hidden !important;
  list-style: none;
  padding: 0;
  max-height: calc(1.4em * 2);
}

.oc-home-shop .shop-product-card__buy {
  margin-top: auto;
  padding-top: 6px;
}

.oc-home-shop button.oc-home-shop__category {
  cursor: pointer;
  font: inherit;
}

@media (max-width: 991px) {
  .oc-home-shop .shop-catalog__item {
    flex-basis: min(220px, 72vw);
    max-width: min(220px, 72vw);
  }
}

.oc-home-shop__cta {
  display: flex;
  flex-wrap: wrap;
  gap: 0.65rem 1.1rem;
  justify-content: center;
  align-items: center;
  margin-top: 0.25rem;
}

.oc-home-shop__secondary {
  font-weight: 600;
  color: #1fa2ff;
  text-decoration: none;
}

.oc-home-shop__secondary:hover {
  text-decoration: underline;
}

body.navbar-is-fixed-top,
body.admin-menu.navbar-is-fixed-top {
    padding-top: 52px !important;
}

body {
    padding: 0;
    overflow-x: hidden;
}

.navbar {

    border: none;
}

.navbar-fixed-top {
    background-color: rgba(14, 29, 52, 1) !important;
}

.navbar .container-fluid {
    padding: 0 65px !important;
    min-width: 1200px;
}

.container-fluid {
    padding: 0 65px !important;
    min-width: 1200px;
}

.container-fuild.aos-init.aos-animate {
    padding: 0 65px !important;
    min-width: 1440px;
}



@media (max-width: 1279px) {
    #slideshow_container {
        position: absolute;
        z-index: -999;
        /* margin-top: 60px; */
        min-height: 110px;
    }
}

@media (min-width: 1280px) {

    #slideshow_container {
        position: absolute;
        z-index: -999;
    }
}

.oc-flot-left {
    position: absolute;
    margin-left: 60px;
    margin-top: 10px;
}

.oc-flot-social-right {
    /* position: absolute; */
    margin-right: 20px;
    margin-top: 5px;
}

.navbar .btn {
    background: none repeat scroll 0 0 #e1e1e1;
    border: 0 none;
    border-radius: 0;
    float: right;
    height: 52px;
    line-height: 52px;
    padding: 0 15px;
}

.logo {
    display: block;
    line-height: 52px;
    /* position: absolute; */
    z-index: 3;
    /* max-width: 240px; */
}


@media (min-width: 1280px) {
    .logo {
        margin-top: 5px;
    }

}

#header .logo {
    display: block;
    line-height: 52px;
    position: absolute;
    z-index: 3;
    max-width: 240px;
}

.logo img {
    height: 99px;
}

.header {
    position: relative;
}

#block-system-user-menu {
    background: none repeat scroll 0 0 rgba(0, 0, 0, 0.25);
    position: absolute;
    right: 0;
    top: 52px;
}

#block-system-user-menu .menu a {
    color: white;
}

#block-system-user-menu .menu a {
    background: transparent;
    text-decoration: underline;
}

.views-row h2 a {
    color: black;
}

@media(max-width: 769px) {

    #block-system-user-menu {
        top: 0;
    }

}

.navbar #main-nav li a {
    line-height: 52px;
    height: 52px;
    padding: 0 15px;
}

.navbar #main-nav li a a {
    display: none;
}

.navbar #main-nav li a:hover,
.navbar #main-nav li:hover a {
    background: #ccc;
}

.navbar #main-nav li:hover li a {
    background: #fff;
}

.navbar #main-nav li:hover li a:hover {
    background: #999;
}

.navbar #main-nav .dropdown-menu {
    display: none;
}

.navbar #main-nav .open .dropdown-menu {
    display: block;
}

.block-commerce-cart .dropdown-menu {
    left: auto;
    right: 0px;
    top: 52px;
    padding: 10px;
}

.front .main-container {
    padding: 60px 0;
}

.not-front .main-container {
    padding: 0 0 100px;
}

.more-link {
    text-align: center;
}

#luxe-login {
    float: left;
    width: 45%;
}

#luxe-login-register {
    float: right;
    width: 45%;
}

footer.footer {
    /* background: black;  */
    margin: 0;
}

@media(max-width: 769px) {

    .block-commerce-cart .btn {
        position: absolute;
        right: 0px;
        bottom: auto;
        top: -52px;
    }

    .navbar-default .navbar-toggle {
        position: absolute;
        right: 100px;
    }

    #main-nav {
        padding: 0;
    }

    #main-nav ul {
        margin: 0;
    }

    .block-commerce-cart .dropdown-menu {
        top: 0;
    }

    #luxe-login {
        float: left;
        width: 100%;
    }

    #luxe-login-register {
        float: left;
        width: 100%;
    }

}

.page-articulos .view-vista-de-articulos .views-row {
    margin: 0 0 15px;
    padding: 0 0 15px;
    border-bottom: 1px solid #ccc;
}

#block-menu-menu-menu-footer {
    margin: 0 0 25px;
}

#block-menu-menu-menu-footer .menu {
    text-align: center;
}

#block-menu-menu-menu-footer .menu li {
    display: inline;
}

#block-menu-menu-menu-footer .menu li a {
    color: white;
    display: inline-block;
}

#block-menu-menu-menu-footer .menu li a:hover {
    background: transparent;
    text-decoration: underline;
}

#block-block-1 {
    text-align: center;
    color: white;
}

#block-block-1 a {
    color: white;
}

#block-devel-execute-php {
    clear: both;
}

.block-facetapi input[type=checkbox] {
    margin-right: 5px;
}

/* SLIDER */
#layerslider h2 {
    background: rgba(0, 0, 0, .5);
    border-radius: 0;
    font-size: 24px;
}

#layerslider div.ls-l {
    color: white;
    font-size: 24px;
    left: 120px;
    top: 200px;
    white-space: nowrap;
}

#layerslider a.ls-l {
    background: none repeat scroll 0 0 rgba(0, 0, 0, 0.25);
    color: white;
    display: inline-block;
    left: 120px;
    padding: 5px;
    top: 254px;
    white-space: nowrap;
}

#commerce-addressbook-billing-default .views-row {
    background: rgba(0, 0, 0, .15);
    padding: 15px;
}

.page-user-addressbook .addressfield-container-inline .name-block {
    font-weight: 700;
    font-size: 20px;
    border-bottom: 1px solid #ccc;
    margin-bottom: 10px;
    overflow: hidden;
}

.page-user-addressbook #commerce-addressbook-billing-list td .views-field address {
    border: 1px solid #ccc;
    padding: 10px;
}


/*--------------------------------------
 Sets the actionable area for the burger
 including a label for usability
--------------------------------------*/
.burger,
.burger:after,
.burger *,
.burger *:before,
.burger *:after,
.header-nav *,
.header-nav *:before,
.header-nav *:after {
    -webkit-transition: all 0.3s;
    transition: all 0.3s;
}

.burger {
    cursor: pointer;
    height: 60px;
    margin-bottom: 0;
    width: 60px;
    z-index: 9001;
    left: 0;
    overflow: hidden;
    position: fixed;
    top: 0;
}

.burger:after {
    bottom: 7px;
    color: #FFFFFF;
    font-size: 13px;
    font-weight: 300;
    left: 0;
    position: absolute;
    text-align: center;
    width: 100%;
}


/*--------------------------------------
 Creates the look of the burger icon
 using the inner span and pseudo-elements
--------------------------------------*/

.burger span,
.burger span:before,
.burger span:after {
    background: rgba(255, 255, 255, 0.3);
    height: 4px;
    left: 15px;
    position: absolute;
    top: 28px;
    -webkit-transition: all 0.3s;
    transition: all 0.3s;
    width: 30px;
}


/* Reset the left and create the pseudo-element */

.burger span:before,
.burger span:after {
    content: '';
    left: 0;
}


/* Top bar position */

.burger span:before {
    top: -10px;
}


/* Bottom bar position */

.burger span:after {
    top: 10px;
}


/* Get rid of more on action (IE9 or higher) */

.burger-check:checked+.burger:after {
    content: '';
}


/* Get rid of the middle bar on action (IE9 or higher) */

.burger-check:checked+.burger span {
    height: 0;
    width: 0;
}


/* Moves the top and bottom bars to the middle on action (IE9 or higher) */

.burger-check:checked+.burger span:before,
.burger-check:checked+.burger span:after {
    top: 6px;
}


/* Rotates the top bar on action with full browser support (IE9 or higher) */

.burger-check:checked+.burger span:before {
    -webkit-transform: rotate(225deg);
    -ms-transform: rotate(225deg);
    transform: rotate(225deg);
}


/* Rotates the bottom bar on action with full browser support (IE9 or higher) */

.burger-check:checked+.burger span:after {
    -webkit-transform: rotate(-225deg);
    -ms-transform: rotate(225deg);
    transform: rotate(-225deg);
}

#mobile-nav:focus+.burger,
.burger:focus,
.burger:hover {
    background: rgba(0, 136, 204, 0.9);
}

.burger-check:checked+.burger {}

.burger-check:checked+.burger:after {
    bottom: 18px;
    font-size: 20px;
    padding-left: 30px;
}

#mobile-nav {
    left: -9999px;
    position: fixed;
    top: 0;
}

.header-nav ul li a:active,
.header-nav ul li a:focus,
.header-nav ul li a:hover,
#mobile-nav:focus+.burger,
.burger:focus,
.burger:hover {
    background: rgba(0, 0, 0, 0.1);
    outline: none;
}

.fixed-nav {
    background: #08c;
    height: 60px;
    position: fixed;
    width: 100%;
    z-index: 9000;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.3);
}

.header-nav {
    float: left;
    height: 60px;
    position: relative;
    width: 100%;
}

.header-nav ul {
    background: #FFF;
    height: calc(100vh - 60px);
    list-style: none;
    margin: 0;
    overflow-y: auto;
    padding: 10px 0 0 0;
    position: absolute;
    -webkit-transform: translateX(-110%);
    transform: translateX(-110%);
    -webkit-transition-timing-function: cubic-bezier(0.250, 0.460, 0.450, 0.940);
    -moz-transition-timing-function: cubic-bezier(0.250, 0.460, 0.450, 0.940);
    -o-transition-timing-function: cubic-bezier(0.250, 0.460, 0.450, 0.940);
    transition-timing-function: cubic-bezier(0.250, 0.460, 0.450, 0.940);
    width: 280px;
    box-shadow: 3px 3px 5px rgba(0, 0, 0, 0.075);
    top: 100%;
    z-index: 3;
    margin-left: -15px;
}

.burger-check:checked~.header-nav ul {
    -webkit-transform: translateX(0);
    transform: translateX(0);
}

.header-nav ul li {
    float: left;
    position: relative;
    width: 100%;
}

.header-nav ul li a {
    color: rgba(0, 0, 0, 0.79);
    display: block;
    float: left;
    font-size: 14px;
    font-weight: 400;
    letter-spacing: 0.75px;
    line-height: 24px;
    margin-left: 0px;
    overflow: hidden;
    padding: 8px 10px 8px 40px;
    position: relative;
    text-decoration: none;
    width: 100%;
}

.header-nav-main-tab {
    font-weight: 700 !important;
}

.header-nav-tab {
    padding-left: 20px !important;
}

#edit-actions-submit {
    background-color: #82BF4F !important;
    color: #fff !important;
    text-transform: uppercase;
}

/* AI Powered  */

.AI-Powered-img{
    width: 100% !important;
    border-radius: 20px;
    
}

.service-item_1{
    padding-top: 0px;
}

.section-header_1{
    padding-top: 0px !important;
    padding-bottom: 0px !important;
}

.why-us_1{
    padding: 40px 0px !important;
}

/*--------------------------------------------------------------
# OcMono
--------------------------------------------------------------*/
@import url("https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,100;0,300;0,400;0,500;0,600;0,800;0,900;1,200;1,400;1,500;1,600;1,800;1,900&display=swap");
@import url("https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,900&display=swap");

/* Fonts */
:root {
  --font-default: "Montserrat", system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", "Liberation Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
  --font-primary: "Montserrat", sans-serif;
  --font-secondary: "Montserrat", sans-serif;
}

/* Colors */
:root {
  --color-default: #0a0d13;
  --color-primary: #1fa2ff;
  --color-secondary: #0e1d34;
}

/* Smooth scroll behavior */
:root {
  scroll-behavior: smooth;
}

@media (max-width: 1279px) {
  .hide-on-mobile {
    display: none !important;
  }
}

@media (min-width: 1280px) {
  .hide-on-desktop {
    display: none !important;
  }
}

.equal {
  display: flex;
  display: -webkit-flex;
  flex-wrap: wrap;
}

/*--------------------------------------------------------------
# General
--------------------------------------------------------------*/
body {
  font-size: 16px !important;
  line-height: 1.8 !important;
  font-family: "Montserrat", sans-serif !important;
  color: #303138 !important;
  font-weight: 400;
}

p {
  font-size: 16px;
  line-height: 1.8;
  font-family: "Montserrat", sans-serif;
  color: #303138;
  font-weight: 400;
}

a {
  display: inline-block;
  -webkit-transition: all 0.5s;
  transition: all 0.5s;
  text-decoration: none !important;
}

a:hover,
a:focus {
  text-decoration: none;
}

button {
  margin: 0;
  padding: 0;
  outline: 0;
}

button:focus {
  outline: 0;
  border: 0;
}

h1,
h2,
h3,
h4,
h5,
h6 {
  font-weight: 600;
  color: #16213E;
  font-family: "Montserrat", sans-serif;
  line-height: 1.4;
}

h3 {
  font-size: 22px;
}

img {
  max-width: 100%;
}


/*--------------------------------------------------------------
# Sections & Section Header
--------------------------------------------------------------*/
section {
  padding: 80px 0;
  overflow: hidden;
}

.front section {
  padding: 80px 0;
  overflow: hidden;
}



.not-front section {
  padding: 0;
  overflow: hidden;
}

.section-header {
  text-align: left;
  padding: 70px 0 30px 0;
  position: relative;
}

@media (max-width: 1279px) {
  .section-header {
    padding: 0 0 30px 0;
  }

  .front section {
    padding: 30px 0;
    overflow: hidden;
  }

  .services {
    padding: 30px 0 !important;
    background: #fff;
  }

}

.section-header h2 {
  border-color: #1fa2ff !important;
  display: inline-block !important;
  margin-top: 0 !important;
  font-family: 'Montserrat', sans-serif !important;
  font-weight: 700 !important;
  letter-spacing: 2px !important;
  border-bottom: 6px solid #000;
  /* border-bottom-color: rgb(0, 0, 0); */
  padding: 0 0 15px 0;
  font-size: 40px;
  line-height: 45px;
  text-transform: uppercase;
  color: #16213e;

}

/* .section-header h2:after {
  content: "";
  position: absolute;
  display: block;
  width: 50px;
  height: 3px;
  background: #EB6097;
  left: 0;
  right: 0;
  bottom: 0;
  margin: auto;
} */

.section-header span {
  position: absolute;
  top: 46px;
  color: rgba(14, 29, 52, 0.06);
  left: 0;
  right: 0;
  z-index: 1;
  font-weight: 700;
  font-size: 56px;
  /* text-transform: uppercase; */
  line-height: 0;
  font-family: "Montserrat", sans-serif;
}

.section-header p {
  margin-bottom: 0;
  position: relative;
  z-index: 2;
}

@media (max-width: 640px) {
  .section-header h2 {
    font-size: 28px;
    margin-bottom: 15px;
  }

  .section-header span {
    font-size: 38px;
  }
}

/*--------------------------------------------------------------
# Breadcrumbs
--------------------------------------------------------------*/
.breadcrumbs .page-header {
  padding: 140px 0 80px 0;
  position: relative;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}

.breadcrumbs .page-header:before {
  content: "";
  background-color: rgba(14, 29, 52, 0.8);
  position: absolute;
  inset: 0;
}

.breadcrumbs .page-header h2 {
  font-size: 56px;
  font-weight: 500;
  color: #fff;
  font-family: var(--font-secondary);
}

.breadcrumbs .page-header p {
  color: rgba(255, 255, 255, 0.8);
}

.breadcrumbs nav {
  background-color: #f3f6fc;
  padding: 20px 0;
}

.breadcrumbs nav ol {
  display: flex;
  flex-wrap: wrap;
  list-style: none;
  margin: 0;
  padding: 0;
  font-size: 16px;
  font-weight: 600;
  color: var(--color-secondary);
}

.breadcrumbs nav ol a {
  color: var(--color-primary);
  transition: 0.3s;
}

.breadcrumbs nav ol a:hover {
  text-decoration: underline;
}

.breadcrumbs nav ol li+li {
  padding-left: 10px;
}

.breadcrumbs nav ol li+li::before {
  display: inline-block;
  padding-right: 10px;
  color: #4278cc;
  content: "/";
}

/*--------------------------------------------------------------
# Scroll top button
--------------------------------------------------------------*/
.scroll-top {
  position: fixed;
  visibility: hidden;
  opacity: 0;
  right: 15px;
  bottom: 15px;
  z-index: 99999;
  background: var(--color-primary);
  width: 40px;
  height: 40px;
  border-radius: 4px;
  transition: all 0.4s;
}

.scroll-top i {
  font-size: 24px;
  color: #fff;
  line-height: 0;
}

.scroll-top:hover {
  background: rgba(13, 66, 255, 0.8);
  color: #fff;
}

.scroll-top.active {
  visibility: visible;
  opacity: 1;
}

/*--------------------------------------------------------------
# Disable aos animation delay on mobile devices
--------------------------------------------------------------*/
@media screen and (max-width: 768px) {
  [data-aos-delay] {
    transition-delay: 0 !important;
  }
}

/*--------------------------------------------------------------
# Header
--------------------------------------------------------------*/
.header {
  transition: all 0.5s;
  z-index: 997;
  padding: 10px 0;
  background: rgba(0, 0, 0, 0.8);
  color: #fff;
  /* box-shadow: 0px 2px 20px rgba(14, 29, 52, 0.1); */
  min-height: 60px;
}


.not-front .header {
  transition: all 0.5s;
  z-index: 997;
  padding: 10px 0;
  background: rgba(0, 0, 0, 0.8);
  color: #fff;
  /* box-shadow: 0px 2px 20px rgba(14, 29, 52, 0.1); */
}

.not-front .header .navbar a,
.not-front .header .navbar a:focus {
  color: #fff;
}

.header.sticked .navbar a,
.header.sticked .navbar a:focus {
  color: #fff;
}

.header.sticked {
  background: var(--color-secondary);
  padding: 5px 0;
  /* box-shadow: 0px 2px 20px rgba(14, 29, 52, 0.1); */
}

/* .header .logo {
  margin-top: 15px;
} */

.header .logo img {
  /* max-height: 40px; */
  margin-right: 6px;
}

.header .logo h1 {
  font-size: 30px;
  margin: 0;
  font-weight: 700;
  color: #fff;
  font-family: var(--font-primary);
}

@media (max-width: 1279px) {

  .not-front .header .navbar a,
  .not-front .header .navbar a:focus {
    color: #fff;
  }

  .header.sticked .navbar a,
  .header.sticked .navbar a:focus {
    color: #fff;
  }

  .oc-page-title {
    margin-top: 60px;
    padding: 30px 20px;
    margin-bottom: 10px;
    color: white;
    background-size: auto;
    background-size: cover; */
    min-height: 110px;
  }

  .oc-page-header {
    font-family: "Montserrat", sans-serif;
    margin-top: 10px;
    margin-bottom: 0.5rem;
    font-weight: 800;
    line-height: 1.6;
    font-size: 16px;
    color: #fff;
    text-transform: uppercase;
    text-align: center;
  }

  .not-front .main-container {
    padding: 0 15px 100px;
    margin-top: ;
  }
}


/*--------------------------------------------------------------
# Desktop Navigation
--------------------------------------------------------------*/
@media (min-width: 1280px) {
  .navbar {
    padding: 0 0 10px 0;
    /* max-width: 950px; */
    float: right;
  }

  .navbar ul {
    margin: 0;
    padding: 0;
    display: flex;
    list-style: none;
    align-items: center;
  }

  .navbar li {
    position: relative;
  }

  .navbar a,
  .navbar a:focus {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 10px 0 10px 30px;
    font-family: var(--font-primary);
    font-size: 15px;
    text-transform: uppercase;
    color: #fff !important;
    font-weight: 600;
    white-space: nowrap;
    transition: 0.3s;
  }

  .navbar a i,
  .navbar a:focus i {
    font-size: 12px;
    line-height: 0;
    margin-left: 5px;
  }

  .navbar a:hover,
  .navbar .active,
  .navbar .active:focus,
  .navbar li:hover>a {
    color: #fff !important;
  }

  .navbar .get-a-quote,
  .navbar .get-a-quote:focus {
    display: inline-block;
    background: rgba(255, 255, 255, 0.2);
    padding: 6px 30px 8px 30px;
    border-radius: var(--oc-btn-radius);
    transition: all ease-in-out 0.4s;
    margin-left: 30px;
    color: #fff !important;
  }

  .navbar .get-a-quote:hover,
  .navbar .get-a-quote:focus:hover {
    color: #fff !important;
    background: #841b4b;
  }

  .navbar .dropdown ul {
    display: block;
    position: absolute;
    left: 14px;
    top: calc(100% + 30px);
    margin: 0;
    padding: 10px 0;
    z-index: 99;
    opacity: 0;
    visibility: hidden;
    background: #0E1D34;
    box-shadow: 0px 0px 30px rgba(127, 137, 161, 0.25);
    transition: 0.3s;
    border-radius: 4px;
  }

  .navbar .dropdown ul li {
    min-width: 200px;
  }

  .navbar .dropdown ul a {
    padding: 10px 20px;
    font-size: 13px;
    text-transform: uppercase;
    font-weight: 600;
    color: var(--color-secondary);
  }

  .navbar .dropdown ul a i {
    font-size: 12px;
  }

  .navbar .dropdown ul a:hover,
  .navbar .dropdown ul .active:hover,
  .navbar .dropdown ul li:hover>a {
    color: var(--color-primary);
  }

  .navbar .dropdown:hover>ul {
    opacity: 1;
    top: 100%;
    visibility: visible;
  }

  .navbar .dropdown .dropdown ul {
    top: 0;
    left: calc(100% - 30px);
    visibility: hidden;
  }

  .navbar .dropdown .dropdown:hover>ul {
    opacity: 1;
    top: 0;
    left: 100%;
    visibility: visible;
  }


}

@media (min-width: 1280px) and (max-width: 1366px) {
  .navbar .dropdown .dropdown ul {
    left: -90%;
  }

  .navbar .dropdown .dropdown:hover>ul {
    left: -100%;
  }
}

@media (min-width: 1280px) {

  .mobile-nav-show,
  .mobile-nav-hide {
    display: none;
  }

  .oc-navbar-brand img {
    margin-top: 0;
  }
}



@media (max-width: 1280px) {
  .oc-navbar-brand img {
    margin-top: 0;
  }

  .oc-flot-right {
    float: right;
    background-color: #002F79;
  }
}

.mobile-bg {
  /* background-color: #16213E;
  position: relative;
  background-image: url(https://drmishras.com/img/baa-mobile-bg.png);
  background-size: cover;
  background-position: center center;
  background-repeat: no-repeat; */
}

.mobile-video-block {
  width: ;
}

.mobile-content-block {
  padding: 100px 20px 20px;
  /* position: relative;
  background-image: url(https://drmishras.com/img/baa-mobile-bg.png);
  background-size: cover;
  background-position: center center;
  background-repeat: no-repeat; */
}

.mobile-content-block h2 {
  color: #fff;
}

.mobile-content-block p {
  color: #fff;
}

.mobile-counter-block-out {
  background-color: #002F79;
  width: 100%;
}

.mobile-counter-block {
  /* padding-bottom: 20px; */
  background-color: #002F79;
  padding-top: 20px;
  width: 340px;
  margin-left: auto;
  margin-right: auto;
}

.mobile-counter-block .col-xs-4 {
  padding-left: 0 !important;
  padding-right: 0 !important;
}

.mobile-counter-block .stats-item {
  width: 90px;
  padding: 5px;
  margin-left: auto;
  margin-right: auto;
  margin-bottom: 20px;
  border-radius: 10px;
}

.mobile-counter-block .stats-item h2 {
  color: #fff;
}

.mobile-counter-block .stats-item p {
  font-weight: 400;
  color: #fff;
  font-size: 12px;
  /* border-top: 2px solid #1fa2ff !important; */
}

.mobile-counter-block .col-xs-6 {
  padding-left: 0;
  padding-right: 0;
}

.counter-box-1 {
  width: 90px;
  margin-left: auto;
  margin-right: auto;
  margin-left: -10px;
}

.counter-box-2 {
  width: 90px;
  margin-left: auto;
  margin-right: auto;
}

.counter-box-3 {
  width: 90px;
  margin-left: auto;
  margin-right: auto;
}

.mobile-counter-block .counter-count {
  width: 50%;
  margin-left: auto;
  margin-right: auto;
  font-size: 18px;
  font-weight: 700;
  text-align: right !important;
  color: #fff;
}


.mobile-counter-block .counter-sign {
  width: 50%;
  margin-left: auto;
  margin-right: auto;
  font-size: 18px;
  font-weight: 700;
  text-align: left;
  color: #fff;
}



/*--------------------------------------------------------------
# Hero Section
--------------------------------------------------------------*/
#hero-video {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  min-width: 100%;
  min-height: 100%;
  object-fit: cover;
  z-index: 0;
}

#hero-video-mobile {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  min-height: 100%;
  object-fit: cover;
  z-index: 0;
}

/* #hero-video:before {
  content: '';
  position: absolute;
  background: rgba(0, 0, 0, 0.85);
  border-radius: 5px;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  height: 140vh;
}

#hero-video::before{
  background: rgba(0, 0, 0, 0.5);
} */


#hero {
  width: 100%;
  height: 100vh;
  min-height: 800px;
  position: relative;
  z-index: 1;
  /* background: linear-gradient(to bottom, #68acb8 25%, #969696 100%); */
  /* background: url("../img/hero-bg.jpg") top center;
  background-size: cover; */
  /* margin-bottom: -200px; */
  /* margin-top: -90vh; */
  /* background: rgba(14, 29, 52, 0.5); */
  color: #fff;
  text-align: left;

}

#hero .stats-item .col-xs-6 {
  padding-left: 0;
  padding-right: 0;
}

#hero .counter-sign {
  text-align: left;
  font-size: 36px;
  font-weight: 700;
  padding-left: 10px;
}

#hero .counter-count {
  text-align: right !important;
}

#hero .container {
  position: relative;
  margin-top: 14vh;
}


.hero h2 {
  margin-bottom: 20px;
  padding: 0;
  font-size: 48px;
  font-weight: 600;
  color: #fff;
  text-shadow: 0px 2px 5px rgba(14, 29, 52, 0.5);
  font-family: "Montserrat", sans-serif;
}

.hero h4 {
  margin-bottom: 20px;
  padding: 0;
  font-size: 22px;
  font-weight: 400;
  color: #fff;
  text-shadow: 0px 2px 5px rgba(14, 29, 52, 0.5);
  text-transform: uppercase;
  font-family: "Montserrat", sans-serif;
}

.hero h4 span {
  font-weight: 700;
  padding: 0 10px;
  color: #1fa2ff;

}

.hero p {
  font-size: 18px;
}

@media (max-width: 575px) {
  .hero h2 {
    font-size: 30px;
  }
}

.hero p {
  font-size: 18px;
  font-weight: 400;
  margin-bottom: 40px;
  color: #fff;
  text-shadow: 0px 2px 5px rgba(14, 29, 52, 0.5);
}


.hero form .btn-primary {
  background-color: var(--color-primary);
  padding: 15px 30px;
}

.hero form .btn-primary:hover {
  background-color: #841b4b;
}

.hero .stats-item {
  padding: 30px;
  width: 100%;
}

.hero .stats-item h4 {
  font-size: 62px;
  display: block;
  font-weight: 700;
  margin-bottom: 15px;
  padding-bottom: 15px;
  position: relative;
}


.hero .stats-item span {
  font-size: 36px;
  display: block;
  font-weight: 700;
  margin-bottom: 15px;
  padding-bottom: 15px;
  position: relative;
}

/* .hero .stats-item:after {
  content: "+";
  position: absolute;
  display: block;
  width: 20px;
  height: 3px;
  background: var(--color-primary);
  left: 0;
  right: 0;
  bottom: 0;
  margin: auto;
} */

/* .hero .stats-item p:before {
  content: "";
  position: absolute;
  display: block;
  width: 20px;
  height: 3px;
  background: var(--color-primary);
  left: 0;
  right: 0;
  bottom: 0;
  margin: auto;
} */

.hero .stats-item p {
  padding: 0;
  margin: 0;
  font-family: var(--font-primary);
  font-size: 20px;
  font-weight: 600;
}

@media (min-width: 1024px) {
  #hero {
    background-attachment: fixed;
  }
}

@media (max-width: 992px) {
  #hero {
    margin-bottom: 0;
    height: 100vh;
  }

  #hero .container {
    padding-bottom: 63px;
  }

  #hero h1 {
    font-size: 28px;
    line-height: 36px;
  }

  #hero h2 {
    font-size: 18px;
    line-height: 24px;
    margin-bottom: 30px;
  }
}

@media (max-height: 600px) {
  #hero {
    height: 110vh;
  }
}

.blue-bg {
  background-color: rgba(14, 29, 52, 1);
}

#hero-mobile {
  width: 100%;

  min-height: 800px;
  /* background: linear-gradient(to bottom, #68acb8 25%, #969696 100%); */
  /* background: url("../img/hero-bg.jpg") top center;
  background-size: cover; */
  /* margin-bottom: -200px; */
  /* margin-top: -90vh; */
  /* background: rgba(14, 29, 52, 0.5); */
  color: #fff;
  text-align: center;
  background-color: rgba(14, 29, 52, 0.5);

}

#hero-mobile .container {
  position: relative;
  margin-top: 20vh;
}


.hero-mobile h2 {
  margin-bottom: 20px;
  padding: 0;
  font-size: 48px;
  font-weight: 400;
  color: #fff;
  text-shadow: 0px 2px 5px rgba(14, 29, 52, 0.5);
  font-family: "Montserrat", sans-serif;
}

.hero-mobile h4 {
  margin-bottom: 20px;
  padding: 0;
  font-size: 22px;
  font-weight: 400;
  color: #fff;
  text-shadow: 0px 2px 5px rgba(14, 29, 52, 0.5);
  text-transform: uppercase;
  font-family: "Montserrat", sans-serif;
}

.hero-mobile h4 span {
  font-weight: 700;
  padding: 0 10px;
  color: #1fa2ff;

}

.hero-mobile p {
  font-size: 18px;
}

@media (max-width: 575px) {
  .hero-mobile h2 {
    font-size: 30px;
  }
}

.hero-mobile p {
  font-size: 18px;
  font-weight: 400;
  margin-bottom: 40px;
  color: #fff;
  text-shadow: 0px 2px 5px rgba(14, 29, 52, 0.5);
}


.hero-mobile form .btn-primary {
  background-color: var(--color-primary);
  padding: 15px 30px;
}

.hero-mobile form .btn-primary:hover {
  background-color: #841b4b;
}

.hero-mobile .stats-item {
  padding: 30px;
  width: 100%;
}

.hero-mobile .stats-item h4 {
  font-size: 62px;
  display: block;
  font-weight: 700;
  margin-bottom: 15px;
  padding-bottom: 15px;
  position: relative;
}


.hero-mobile .stats-item span {
  font-size: 32px;
  display: block;
  font-weight: 700;
  margin-bottom: 15px;
  padding-bottom: 15px;
  position: relative;
}

/* .hero .stats-item:after {
  content: "+";
  position: absolute;
  display: block;
  width: 20px;
  height: 3px;
  background: var(--color-primary);
  left: 0;
  right: 0;
  bottom: 0;
  margin: auto;
} */

.hero-mobile .stats-item span:after {
  content: "";
  position: absolute;
  display: block;
  width: 20px;
  height: 3px;
  background: var(--color-primary);
  left: 0;
  right: 0;
  bottom: 0;
  margin: auto;
}

.hero-mobile .stats-item p {
  padding: 0;
  margin: 0;
  font-family: var(--font-primary);
  font-size: 15px;
  font-weight: 600;
}

@media (min-width: 1024px) {
  #hero-mobile {
    background-attachment: fixed;
  }
}

@media (max-width: 992px) {
  #hero-mobile {
    margin-bottom: 0;
    height: auto;
  }

  #hero-mobile .container {
    padding-bottom: 63px;
  }

  #hero-mobile h1 {
    font-size: 28px;
    line-height: 36px;
  }

  #hero-mobile h2 {
    font-size: 18px;
    line-height: 24px;
    margin-bottom: 30px;
  }
}

@media (max-height: 600px) {
  #hero-mobile {
    height: 110vh;
  }
}


/*--------------------------------------------------------------
# Stats Counter Section
--------------------------------------------------------------*/
.stats-counter .stats-item {
  padding: 30px;
  width: 100%;
}

.stats-counter .stats-item span {
  font-size: 48px;
  display: block;
  color: var(--color-secondary);
  font-weight: 700;
  margin-bottom: 20px;
  padding-bottom: 20px;
  position: relative;
}

.stats-counter .stats-item span:after {
  content: "";
  position: absolute;
  display: block;
  width: 25px;
  height: 3px;
  background: var(--color-primary);
  left: 0;
  right: 0;
  bottom: 0;
  margin: auto;
}

.stats-counter .stats-item p {
  padding: 0;
  margin: 0;
  font-family: var(--font-primary);
  font-size: 15px;
  font-weight: 500;
  color: var(--color-secondary);
}


/*--------------------------------------------------------------
# Why Us
--------------------------------------------------------------*/
/* .why-us {
  background: linear-gradient( transparent 20vh, #fff 20vh);
} */

.why-us {
  background: #F9F9F9;
}

.why-us .content {
  padding: 30px;
  background: rgba(19, 49, 110, 0.8);
  border-radius: 6px 6px 0 0;
  color: #fff;
  /* margin-bottom: 20px; */
  border-bottom: 5px solid #1fa2ff;
}

.why-us .col-xl-3 {
  padding-left: 0;
  padding-right: 0;
}


.why-us .content h3 {
  font-weight: 700;
  font-size: 34px;
  margin-bottom: 30px;
  color: #fff;
}

.why-us .content p {
  margin-bottom: 30px;
  color: #fff;
}

.why-us .content .more-btn {
  display: inline-block;
  background: rgba(255, 255, 255, 0.2);
  padding: 6px 30px 8px 30px;
  color: #fff;
  border-radius: var(--oc-btn-radius);
  transition: all ease-in-out 0.4s;
}

.why-us .content .more-btn i {
  font-size: 14px;
}

.why-us .content .more-btn:hover {
  color: #1977cc;
  background: #fff;
}

.why-us .icon-boxes {
  padding-left: calc(var(--bs-gutter-x) * .5);
  padding-right: calc(var(--bs-gutter-x) * .5);
  width: 100%;
  padding: 5px 35px;
}

.why-us .icon-boxes .align-items-stretch {
  padding: 1px;
  /* border-radius: 10px; */
}

.why-us .icon-boxes .icon-box {
  text-align: left;
  /* border-radius: 4px; */
  background: rgba(19, 49, 110, 0.5);
  padding: 120px 30px 10px 30px;
  width: 100%;
  /* border-radius: 10px; */
}


.why-us .icon-boxes .box-1 {
  position: relative;
  background-image: url(https://drmishras.com/img/hair-transplant-sec.jpg);
  background-size: cover;
  background-position: center center;
  background-repeat: no-repeat;
  width: 100%;
  /* border-radius: 10px; */
}

/* .why-us .icon-boxes .icon-box .box-1:before{
  background: rgba(0, 0, 0, 0.5);
} */

.why-us .icon-boxes .box-2 {
  position: relative;
  background-image: url(https://drmishras.com/img/fueadvance-sec.jpg);
  background-size: cover;
  background-position: center center;
  background-repeat: no-repeat;
  width: 100%;
  /* border-radius: 10px; */
}

.why-us .icon-boxes .box-3 {
  position: relative;
  background-image: url(https://drmishras.com/img/FueEnhance.jpg);
  background-size: cover;
  background-position: center center;
  background-repeat: no-repeat;
  width: 100%;
  /* border-radius: 10px; */
}

.why-us .icon-boxes .box-4 {
  position: relative;
  background-image: url(https://drmishras.com/img/bodyhair-sec.jpg);
  background-size: cover;
  background-position: center center;
  background-repeat: no-repeat;
  width: 100%;
  /* border-radius: 10px; */
}


.why-us-shape {
  position: absolute;
  top: 0;
  left: 5%;
  overflow: hidden;
}

.why-us-shape img {
  max-width: 100%;
  height: 100%;
}


.why-us .icon-boxes .icon-box i {
  font-size: 40px;
  color: #fff;
  margin-bottom: 30px;
}

.why-us .icon-boxes .icon-box h4 {
  font-size: 20px;
  font-weight: 700;
  margin: 0 0 30px 0;
  color: #fff;
  /* padding-bottom: 20px;
  border-bottom: 4px solid rgba(255, 255, 255, 0.1); */
}

.why-us .icon-boxes .icon-box p {
  font-size: 15px;
  color: #fff;
}


/*--------------------------------------------------------------
# Our Services Section
--------------------------------------------------------------*/

@media (max-width: 1279px) {
  .services {
    padding: 30px 0 !important;
    background: #fff;
  }

  .section-header {
    padding: 0px;
  }
}

@media (min-width: 1280px) {
  .services {
    padding: 0 !important;
    background: #fff;
  }
}

.services .service-item {
  background: #F9F9F9;
  height: 100%;
  border-radius: 10px;
  margin-bottom: 20px;
}

.services .service-item img {
  border-radius: 10px 10px 0 0;
}


.services .service-item .pic {
  overflow: hidden;
  width: 100%;
  /*border-radius: 5px;*/
}

.services .service-item .pic img {
  transition: ease-in-out 0.3s;
}

.services .service-item:hover img {
  transform: scale(1.1);
}

.services .service-item .img-icon {
  z-index: 2;
  position: absolute;
  width: 70px
}

.services .service-item .icon {
  width: 48px;
  height: 48px;
  position: relative;
  margin-bottom: 50px;
}

.services .service-item .icon i {
  color: var(--color-default);
  font-size: 56px;
  transition: ease-in-out 0.3s;
  z-index: 2;
  position: relative;
}

.services .service-item .icon:before {
  position: absolute;
  content: "";
  height: 100%;
  width: 100%;
  background: #eeeeee;
  border-radius: 50px;
  z-index: 1;
  top: 10px;
  right: -20px;
  transition: 0.3s;
}

.services .service-item h3 {
  color: var(--color-default);
  font-weight: 500;
  margin: 0 20px 20px 20px;
  padding-bottom: 8px;
  font-size: 16px;
  position: relative;
  display: inline-block;
  border-bottom: 4px solid #eeeeee;
  transition: 0.3s;
  padding: 20px 0;
}

.services .service-item h3 a {
  color: var(--color-default);
  /* font-weight: 500;
  margin: 0 0 20px 0;
  padding-bottom: 8px;
  font-size: 16px;
  position: relative;
  display: inline-block;
  border-bottom: 4px solid #eeeeee;
  transition: 0.3s; */
}

.services h3 {
  margin-top: 0;
}

.services .service-item {
  margin-bottom: 20px;
}

.services .service-item p {
  line-height: 24px;
  font-size: 14px;
  margin-bottom: 0;
}

.srv-h3 {
  color: #16213e;
  font-weight: 700;
  margin: 30px 0 20px 0;
  padding-bottom: 8px;
  font-size: 22px;
  position: relative;
  display: inline-block;
  border-bottom: 4px solid #eeeeee;
  transition: 0.3s;
}

.srv-h3 a {
  color: #16213e;
}

.srv-link a {
  color: var(--oc-btn-outline-color);
  font-size: 12px;
  text-transform: uppercase;
  padding: 8px 12px;
  border: 2px solid var(--oc-btn-outline-color);
  border-radius: var(--oc-btn-radius);
  font-weight: 700;
  text-decoration: none;
}

.srv-link:hover a {
  color: var(--oc-btn-outline-hover);
  border-color: var(--oc-btn-outline-hover);
}

.services .service-item:hover .icon:before {
  background: #E7F6FE;
}

.services .service-item:hover h3 {
  border-color: var(--color-primary);
}

#block-views-cosmetology-block,
#block-views-trichology-block,
#block-views-hair-transplant-block {
  padding: 0;
}


/*--------------------------------------------------------------
# Call To Action Section
--------------------------------------------------------------*/
.call-to-action {
  /* background: linear-gradient(to bottom, #68acb8 25%, #969696 100%); */
  /* background: url("https://drmishras.com/img/bg-1.jpg") center center;
  background-size: cover; */
  background-color: #fff;
  padding: 100px 0;
}



@media (min-width: 1365px) {
  .call-to-action {
    background-attachment: fixed;
  }
}

.call-to-action .cta-box {
  position: relative;
  background-image: url(https://drmishras.com/img/baa-bg.png);
  background-size: cover;
  background-position: center center;
  background-repeat: no-repeat;
  border-radius: 10px;
}

.call-to-action .cta-box::before {
  content: '';
  position: absolute;
  border-radius: 10px;
  top: 0;
  left: 0;
  right: 0;
  width: 100%;
  height: 100%;
  background-image: -webkit-gradient(linear, left top, right top, from(#002F79), to(#002f7954));
  background-image: linear-gradient(to right, #002F79, #002f7954);
}



@media (max-width: 1279px) {

  .call-to-action .cta-100 {
    padding-top: 10px;
    padding-bottom: 10px;
  }

  .cta-content {
    position: relative;
    z-index: 1;
    padding: 20px;
  }
}

@media (min-width: 1280px) {
  .call-to-action .cta-100 {
    padding-top: 100px;
    padding-bottom: 100px;
  }

  .cta-content {
    position: relative;
    z-index: 1;
    margin-left: 90px;
  }
}

.cta-shape {
  position: absolute;
  top: 0;
  left: 5%;
  overflow: hidden;
}

.cta-shape img {
  max-width: 100%;
  height: 100%;
}

@media (max-width: 1279px) {
  .call-to-action h2 {
    font-size: 30px;
    color: #fff;
    font-weight: 600;
    margin-bottom: 25px;
    line-height: 1.2;
  }

  .call-to-action p {
    color: #fff;
    margin-bottom: 20px;
    font-size: 16px;
    font-weight: 500;
  }
}

@media (min-width: 1280px) {
  .call-to-action h2 {
    font-size: 40px;
    color: #fff;
    font-weight: 600;
    margin-bottom: 25px;
    line-height: 1.2;
  }

  .call-to-action p {
    color: #fff;
    margin-bottom: 20px;
    font-size: 20px;
    font-weight: 500;
  }
}

.call-to-action .cta-btn {
  font-family: var(--font-primary);
  font-weight: 500;
  font-size: 16px;
  letter-spacing: 1px;
  display: inline-block;
  padding: 12px 40px;
  border-radius: 5px;
  transition: 0.5s;
  margin: 10px;
  border: 2px solid #fff;
  color: #fff;
}

.call-to-action .cta-btn:hover {
  background: var(--color-primary);
  border: 2px solid var(--color-primary);
}

/*--------------------------------------------------------------
# About Us Section
--------------------------------------------------------------*/
.about {
  background: #F9F9F9;
}

.about .content h3 {
  font-weight: 700;
  font-size: 32px;
  font-family: var(--font-secondary);
  color: #001f8d;
}

.about .content h4 {
  font-weight: 300;
  font-size: 22px;
  font-family: var(--font-secondary);
  color: #16213E;
}

.about .content ul {
  list-style: none;
  padding: 0;
}

.about .content ul li {
  display: flex;
  align-items: flex-start;
  margin-top: 40px;
}

.about .content ul i {
  flex-shrink: 0;
  font-size: 48px;
  color: var(--color-primary);
  margin-right: 20px;
  line-height: 0;
}

.about .content ul h5 {
  font-size: 18px;
  font-weight: 700;
  color: #19335c;
}

.about .content ul p {
  font-size: 15px;
}

.about .content p:last-child {
  margin-bottom: 0;
}

/* ==========================================================================
 * Info pages - About / Training / Contact (shared + page-specific)
 * ========================================================================== */

.path-about-us #content-inner.container,
.path-training #content-inner.container {
  max-width: 1140px;
}

/* Contact: full-bleed sections (map) - body class and :has() fallbacks. */
.path-contact-us #main > #content-inner.container,
.path-contact-us #content-inner.container,
.oc-page-contact #main > #content-inner.container,
.oc-page-contact #content-inner.container,
#content-inner.container:has(.node--contact-us) {
  max-width: 100%;
  width: 100%;
  padding: 0 !important;
  margin: 0;
}

.path-contact-us #main > #content-inner.container > .highlighted,
.path-contact-us #main > #content-inner.container > .help,
.oc-page-contact #main > #content-inner.container > .highlighted,
.oc-page-contact #main > #content-inner.container > .help,
#content-inner.container:has(.node--contact-us) > .highlighted,
#content-inner.container:has(.node--contact-us) > .help {
  max-width: 1140px;
  margin: 0 auto;
  padding: 0.75rem 15px 0;
}

.path-contact-us .ocmono-address > .container,
.path-contact-us .ocmono-map > .container,
.path-contact-us .ocmono-contact-form > .container,
.oc-page-contact .ocmono-address > .container,
.oc-page-contact .ocmono-map > .container,
.oc-page-contact .ocmono-contact-form > .container,
#content-inner.container:has(.node--contact-us) .ocmono-address > .container,
#content-inner.container:has(.node--contact-us) .ocmono-map > .container,
#content-inner.container:has(.node--contact-us) .ocmono-contact-form > .container {
  max-width: 1140px;
  margin-left: auto;
  margin-right: auto;
  padding-left: 15px;
  padding-right: 15px;
}

.oc-info-page__cta {
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem;
  margin-top: 1.75rem;
}

.oc-info-page__cta--center {
  justify-content: center;
  margin-top: 2.5rem;
}

.oc-info-page__cta .btn {
  border-radius: var(--oc-btn-radius);
  padding: 0.65rem 1.5rem;
  font-weight: 700;
}

.oc-info-page__cta .btn-primary {
  background: var(--oc-btn-solid-bg);
  border-color: var(--oc-btn-solid-bg);
}

.oc-info-page__cta .btn-primary:hover {
  background: var(--oc-btn-solid-hover);
  border-color: var(--oc-btn-solid-hover);
}

.ocmono-sec-title {
  text-align: center;
  margin: 0 0 2.25rem;
}

.ocmono-sec-title h2 {
  font-size: clamp(1.55rem, 2.8vw, 2.05rem);
  font-weight: 700;
  color: #16213E;
  margin: 0 0 0.55rem;
}

.ocmono-sec-title p {
  margin: 0 auto;
  max-width: 36rem;
  color: #6c757d;
  font-size: 1rem;
  line-height: 1.65;
}

.ocmono-sec-title__line {
  display: block;
  width: 70px;
  height: 3px;
  margin: 1rem auto 0;
  background: var(--brand-primary, #1fa2ff);
  border-radius: 2px;
}

/* --- About --- */
.oc-about-page {
  padding: 0.5rem 0 3rem;
  background: #fff;
}

.oc-about-page__eyebrow {
  display: inline-block;
  margin: 0 0 0.75rem;
  padding: 0.28rem 0.7rem;
  font-size: 0.75rem;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: #13316E;
  background: rgba(31, 162, 255, 0.12);
  border-radius: 999px;
}

.oc-about-page__lead {
  font-size: clamp(1.35rem, 2.4vw, 1.75rem);
  font-weight: 700;
  line-height: 1.35;
  color: #16213E;
  margin: 0 0 0.85rem;
}

.oc-about-page__fellowship {
  font-size: 1.05rem;
  line-height: 1.6;
  color: #13316E;
  margin: 0 0 1.15rem;
  padding-left: 0.9rem;
  border-left: 3px solid #1fa2ff;
}

.oc-about-page__content p {
  font-size: 1rem;
  line-height: 1.7;
  color: #555;
  margin: 0 0 1rem;
}

.oc-about-page__badges {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  list-style: none;
  margin: 1.25rem 0 0;
  padding: 0;
}

.oc-about-page__badges li {
  padding: 0.4rem 0.8rem;
  font-size: 0.82rem;
  font-weight: 600;
  color: #16213E;
  background: #f0f5fb;
  border: 1px solid #e0e8f2;
  border-radius: 999px;
}

.oc-about-page__media {
  position: relative;
  border-radius: 14px;
  overflow: hidden;
  background: #eef3f9;
  box-shadow: 0 18px 48px rgba(22, 33, 62, 0.12);
}

.oc-about-page__media::after {
  content: "";
  position: absolute;
  inset: auto 0 0 0;
  height: 28%;
  background: linear-gradient(to top, rgba(22, 33, 62, 0.28), transparent);
  pointer-events: none;
}

.oc-about-page__photo {
  display: block;
  width: 100%;
  height: auto;
  object-fit: cover;
}

@media (max-width: 991.98px) {
  .oc-about-page__media {
    max-width: 420px;
    margin: 0 auto;
  }
}

/* --- Training --- */
.oc-training-page {
  padding: 0.5rem 0 3rem;
  background: #fff;
}

.oc-training-card {
  height: 100%;
  padding: 1.5rem 1.35rem 1.4rem;
  background: #f7f9fc;
  border: 1px solid #e8edf5;
  border-radius: 12px;
  transition: transform 0.22s ease, box-shadow 0.22s ease, border-color 0.22s ease;
}

.oc-training-card:hover {
  transform: translateY(-4px);
  border-color: rgba(31, 162, 255, 0.4);
  box-shadow: 0 16px 36px rgba(22, 33, 62, 0.08);
  background: #fff;
}

.oc-training-card__icon {
  width: 46px;
  height: 46px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 0.9rem;
  border-radius: 10px;
  background: rgba(31, 162, 255, 0.12);
  color: #1fa2ff;
  font-size: 1.25rem;
}

.oc-training-card__title {
  font-size: 1.05rem;
  font-weight: 700;
  color: #16213E;
  margin: 0 0 0.75rem;
  line-height: 1.35;
}

.oc-training-card__list {
  list-style: none;
  margin: 0;
  padding: 0;
}

.oc-training-card__list li {
  position: relative;
  padding: 0.28rem 0 0.28rem 1rem;
  font-size: 0.9rem;
  line-height: 1.45;
  color: #555;
}

.oc-training-card__list li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0.7rem;
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: #1fa2ff;
}

/* --- Contact (OcMono) --- */
.oc-contact-page {
  overflow-x: hidden;
}

.ocmono-address {
  padding: 2rem 0 1.5rem;
  background: #fff;
}

.ocmono-address__grid {
  --bs-gutter-x: 1.25rem;
  --bs-gutter-y: 1.25rem;
}

.ocmono-address__grid > [class*="col-"] {
  display: flex;
}

.ocmono-address__card {
  display: flex;
  flex-direction: column;
  width: 100%;
  height: 100%;
  min-height: 100%;
  padding: 1.85rem 1.6rem 1.7rem;
  background: #f7f9fc;
  border: 1px solid #e8edf5;
  border-radius: 14px;
  transition: box-shadow 0.25s ease, border-color 0.25s ease, transform 0.25s ease, background 0.25s ease;
}

.ocmono-address__card:hover {
  border-color: rgba(31, 162, 255, 0.45);
  box-shadow: 0 14px 36px rgba(22, 33, 62, 0.08);
  transform: translateY(-3px);
  background: #fff;
}

.ocmono-address__icon {
  width: 48px;
  height: 48px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 0.95rem;
  border-radius: 12px;
  background: var(--brand-primary, #1fa2ff);
  color: #fff;
  font-size: 1.25rem;
  flex: 0 0 auto;
}

.ocmono-address__card h3 {
  font-size: 1.12rem;
  font-weight: 700;
  color: var(--brand-dark, #16213E);
  margin: 0 0 0.85rem;
}

.ocmono-address__list {
  list-style: none;
  margin: 0;
  padding: 0;
  flex: 1 1 auto;
}

.ocmono-address__list li {
  margin: 0 0 0.7rem;
  color: #555;
  font-size: 0.95rem;
  line-height: 1.55;
}

.ocmono-address__list li:last-child {
  margin-bottom: 0;
}

.ocmono-address__list a {
  color: var(--brand-dark, #16213E);
  text-decoration: none;
  font-weight: 600;
}

.ocmono-address__list a:hover {
  color: var(--brand-primary, #1fa2ff);
}

.ocmono-map {
  width: 100%;
  line-height: 0;
  background: #fff;
  padding: 0;
  margin: 60px 0;
}

.ocmono-map__frame {
  width: 100%;
  overflow: hidden;
  background: #e8edf5;
  border: 1px solid #e8edf5;
  border-radius: 14px;
  box-shadow: 0 10px 32px rgba(14, 29, 52, 0.06);
}

.ocmono-map iframe {
  display: block;
  width: 100%;
  height: 380px;
  border: 0;
  vertical-align: top;
}

.ocmono-contact-form {
  padding: 2.5rem 0 3.25rem;
  background: #fff;
  margin: 0;
}

.ocmono-contact-form .ocmono-sec-title {
  margin-bottom: 1.75rem;
}

.ocmono-contact-form__inner {
  background: #fff;
  border: 1px solid #e8edf5;
  border-radius: 14px;
  padding: 2rem 1.75rem 1.75rem;
  box-shadow: 0 12px 40px rgba(22, 33, 62, 0.06);
}

.ocmono-contact-form__inner form {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0 1.1rem;
  align-items: start;
}

.ocmono-contact-form__inner .form-item,
.ocmono-contact-form__inner .js-form-item {
  margin-bottom: 1.05rem;
}

.ocmono-contact-form__inner .form-item-name,
.ocmono-contact-form__inner .form-item-email,
.ocmono-contact-form__inner .form-item-phone,
.ocmono-contact-form__inner .form-item-subject,
.ocmono-contact-form__inner .form-item-message,
.ocmono-contact-form__inner .form-actions,
.ocmono-contact-form__inner .captcha,
.ocmono-contact-form__inner .webform-confirmation {
  grid-column: 1 / -1;
}

@media (min-width: 768px) {
  .ocmono-contact-form__inner .form-item-name,
  .ocmono-contact-form__inner .form-item-email {
    grid-column: span 1;
  }

  .ocmono-contact-form__inner .form-item-phone,
  .ocmono-contact-form__inner .form-item-subject {
    grid-column: 1 / -1;
  }
}

.ocmono-contact-form__inner label {
  display: block;
  margin-bottom: 0.4rem;
  font-weight: 600;
  color: var(--brand-dark, #16213E);
  font-size: 0.9rem;
}

.ocmono-contact-form__inner input.form-control,
.ocmono-contact-form__inner input[type="text"],
.ocmono-contact-form__inner input[type="email"],
.ocmono-contact-form__inner input[type="tel"],
.ocmono-contact-form__inner textarea.form-control,
.ocmono-contact-form__inner textarea {
  width: 100%;
  min-height: 2.85rem;
  border: 1px solid #d9e1ec;
  border-radius: 8px;
  padding: 0.75rem 0.95rem;
  background: #fff;
  color: var(--brand-dark, #16213E);
  box-shadow: none;
  transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

.ocmono-contact-form__inner textarea.form-control,
.ocmono-contact-form__inner textarea {
  min-height: 8rem;
  resize: vertical;
}

.ocmono-contact-form__inner input:focus,
.ocmono-contact-form__inner textarea:focus {
  border-color: var(--brand-primary, #1fa2ff);
  outline: 0;
  box-shadow: 0 0 0 3px rgba(31, 162, 255, 0.18);
}

.ocmono-contact-form__inner .form-actions {
  text-align: center;
  margin-top: 0.35rem;
  margin-bottom: 0;
}

.ocmono-contact-form__inner .button,
.ocmono-contact-form__inner .webform-button--submit,
.ocmono-contact-form__inner input[type="submit"],
.ocmono-contact-form__inner .btn-primary {
  background: var(--oc-btn-solid-bg, #0e1d34) !important;
  border-color: var(--oc-btn-solid-bg, #0e1d34) !important;
  color: #fff !important;
  border-radius: var(--oc-btn-radius) !important;
  padding: 0.75rem 1.9rem !important;
  font-weight: 700 !important;
  min-width: 180px;
  min-height: 2.85rem;
}

.ocmono-contact-form__inner .button:hover,
.ocmono-contact-form__inner .webform-button--submit:hover,
.ocmono-contact-form__inner input[type="submit"]:hover,
.ocmono-contact-form__inner .btn-primary:hover {
  background: var(--oc-btn-solid-hover, #16213e) !important;
  border-color: var(--oc-btn-solid-hover, #16213e) !important;
}

.oc-contact-page__cta {
  margin-top: 1.75rem;
  padding: 1.35rem 1.5rem;
  text-align: center;
  background: #fff;
  border: 1px solid #e8edf5;
  border-radius: 14px;
  box-shadow: 0 8px 28px rgba(22, 33, 62, 0.05);
}

.oc-contact-page__cta p {
  margin: 0 0 0.85rem;
  color: #5a6a7e;
  font-size: 0.98rem;
}

.oc-contact-page__cta .btn {
  border-radius: var(--oc-btn-radius);
  padding: 0.7rem 1.5rem;
  font-weight: 700;
  background: var(--brand-dark, #16213E);
  border-color: var(--brand-dark, #16213E);
}

.oc-contact-page__cta .btn:hover {
  background: #0e1d34;
  border-color: #0e1d34;
}

@media (max-width: 767.98px) {
  .ocmono-address {
    padding: 1.35rem 0 1rem;
  }

  .ocmono-map {
    margin: 60px 0;
  }

  .ocmono-map iframe {
    height: 260px;
  }

  .ocmono-contact-form {
    padding: 2rem 0 2.5rem;
  }

  .ocmono-contact-form__inner {
    padding: 1.35rem 1.1rem;
  }

  .ocmono-contact-form__inner form {
    grid-template-columns: 1fr;
  }

  .oc-info-page__cta {
    flex-direction: column;
  }

  .oc-info-page__cta .btn {
    width: 100%;
    text-align: center;
  }

  .oc-contact-page__cta {
    padding: 1.15rem 1.1rem;
  }
}

/* Legacy about--page (homepage still uses .about) */
.about--page {
  background: #fff;
  padding-top: 1.5rem !important;
  padding-bottom: 2.5rem !important;
}

.about .play-btn {
  width: 94px;
  height: 94px;
  background: radial-gradient(var(--color-primary) 50%, rgba(13, 66, 255, 0.4) 52%);
  border-radius: 50%;
  display: block;
  position: absolute;
  left: calc(50% - 47px);
  top: calc(50% - 47px);
  overflow: hidden;
}

.about .play-btn:before {
  content: "";
  position: absolute;
  width: 120px;
  height: 120px;
  -webkit-animation-delay: 0s;
  animation-delay: 0s;
  -webkit-animation: pulsate-btn 2s;
  animation: pulsate-btn 2s;
  -webkit-animation-direction: forwards;
  animation-direction: forwards;
  -webkit-animation-iteration-count: infinite;
  animation-iteration-count: infinite;
  -webkit-animation-timing-function: steps;
  animation-timing-function: steps;
  opacity: 1;
  border-radius: 50%;
  border: 5px solid rgba(13, 66, 255, 0.7);
  top: -15%;
  left: -15%;
  background: rgba(198, 16, 0, 0);
}

.about .play-btn:after {
  content: "";
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translateX(-40%) translateY(-50%);
  width: 0;
  height: 0;
  border-top: 10px solid transparent;
  border-bottom: 10px solid transparent;
  border-left: 15px solid #fff;
  z-index: 100;
  transition: all 400ms cubic-bezier(0.55, 0.055, 0.675, 0.19);
}

.about .play-btn:hover:before {
  content: "";
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translateX(-40%) translateY(-50%);
  width: 0;
  height: 0;
  border: none;
  border-top: 10px solid transparent;
  border-bottom: 10px solid transparent;
  border-left: 15px solid #fff;
  z-index: 200;
  -webkit-animation: none;
  animation: none;
  border-radius: 0;
}

.about .play-btn:hover:after {
  border-left: 15px solid var(--color-primary);
  transform: scale(20);
}

@-webkit-keyframes pulsate-btn {
  0% {
    transform: scale(0.6, 0.6);
    opacity: 1;
  }

  100% {
    transform: scale(1, 1);
    opacity: 0;
  }
}

@keyframes pulsate-btn {
  0% {
    transform: scale(0.6, 0.6);
    opacity: 1;
  }

  100% {
    transform: scale(1, 1);
    opacity: 0;
  }
}





/*--------------------------------------------------------------
# Awards Section
--------------------------------------------------------------*/
.awards {
  background: #fff;
}

.awards .certificate-slider {
  padding: 45px 0;
}

.awards .certificate-slider .flexslider {
  margin: 0;
  background: transparent;
  border: 0;
  position: relative;
  zoom: 1;
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  border-radius: 4px;
  -webkit-box-shadow: ''0 1px 4px rgba(0, 0, 0, 0.2);
  -moz-box-shadow: ''0 1px 4px rgba(0, 0, 0, 0.2);
  -o-box-shadow: ''0 1px 4px rgba(0, 0, 0, 0.2);
  box-shadow: ''0 1px 4px rgba(0, 0, 0, 0.2);
}

#block-views-certificates-block {
  padding: 0 !important;
}

#awards,
#awards-achievements,
#recent-awards,
#contact {
  padding: 0 !important;
}

.awards .content {
  padding: 50px;
}

@media (max-width: 1279px) {

  .awards .box-1,
  .awards .box-2,
  .awards .box-3 {
    height: auto;
  }
}

@media (min-width: 1280px) {

  .awards .box-1,
  .awards .box-2,
  .awards .box-3 {
    height: 500px;
  }
}

.awards .box-1 {
  background: #16213E;
}

.awards .box-1 .section-header h2 {
  color: #fff;
}

.awards .box-1 .section-header p {
  color: #fff;
}

.awards .box-2 {
  background: #13316E;
}

.awards .box-3 {
  background: #eeeeee;
}

.awards .content h3 {
  font-weight: 700;
  font-size: 32px;
  font-family: var(--font-secondary);
  color: #001f8d;
}

.awards .content ul {
  list-style: none;
  padding: 0;
}

.awards .content ul li {
  display: flex;
  align-items: flex-start;
  margin-top: 20px;
}

.awards .content ul i {
  flex-shrink: 0;
  font-size: 48px;
  color: var(--color-primary);
  margin-right: 20px;
  line-height: 0;
}

.awards .content ul h5 {
  font-size: 18px;
  font-weight: 700;
  color: #19335c;
}

.awards .content ul p {
  font-size: 15px;
  color: #fff;
}

.awards .content p:last-child {
  margin-bottom: 0;
}

.awards .play-btn {
  width: 94px;
  height: 94px;
  background: radial-gradient(var(--color-primary) 50%, rgba(13, 66, 255, 0.4) 52%);
  border-radius: 50%;
  display: block;
  position: absolute;
  left: calc(50% - 47px);
  top: calc(50% - 47px);
  overflow: hidden;
}

.awards .play-btn:before {
  content: "";
  position: absolute;
  width: 120px;
  height: 120px;
  -webkit-animation-delay: 0s;
  animation-delay: 0s;
  -webkit-animation: pulsate-btn 2s;
  animation: pulsate-btn 2s;
  -webkit-animation-direction: forwards;
  animation-direction: forwards;
  -webkit-animation-iteration-count: infinite;
  animation-iteration-count: infinite;
  -webkit-animation-timing-function: steps;
  animation-timing-function: steps;
  opacity: 1;
  border-radius: 50%;
  border: 5px solid rgba(13, 66, 255, 0.7);
  top: -15%;
  left: -15%;
  background: rgba(198, 16, 0, 0);
}

.awards .play-btn:after {
  content: "";
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translateX(-40%) translateY(-50%);
  width: 0;
  height: 0;
  border-top: 10px solid transparent;
  border-bottom: 10px solid transparent;
  border-left: 15px solid #fff;
  z-index: 100;
  transition: all 400ms cubic-bezier(0.55, 0.055, 0.675, 0.19);
}

.awards .play-btn:hover:before {
  content: "";
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translateX(-40%) translateY(-50%);
  width: 0;
  height: 0;
  border: none;
  border-top: 10px solid transparent;
  border-bottom: 10px solid transparent;
  border-left: 15px solid #fff;
  z-index: 200;
  -webkit-animation: none;
  animation: none;
  border-radius: 0;
}

.awards .play-btn:hover:after {
  border-left: 15px solid var(--color-primary);
  transform: scale(20);
}

@-webkit-keyframes pulsate-btn {
  0% {
    transform: scale(0.6, 0.6);
    opacity: 1;
  }

  100% {
    transform: scale(1, 1);
    opacity: 0;
  }
}

@keyframes pulsate-btn {
  0% {
    transform: scale(0.6, 0.6);
    opacity: 1;
  }

  100% {
    transform: scale(1, 1);
    opacity: 0;
  }
}

/*--------------------------------------------------------------
# Before After Section
--------------------------------------------------------------*/
.before-after {
  background: #fff;
}

.before-after .btn {
  font-family: var(--font-primary);
  font-weight: 500;
  font-size: 16px;
  letter-spacing: 1px;
  display: inline-block;
  padding: 12px 40px;
  border-radius: var(--oc-btn-radius);
  transition: 0.5s;
  margin-top: 20px;
  border: 2px solid #13316E;
  color: #13316E;
  background-color: #fff
}

.before-after .btn:hover {
  background: #fff;
  border: 2px solid #13316E;
}

.before-after .before-after-item {
  overflow: hidden;
  border-right: 3px solid #13316E;
  border-bottom: 3px solid #13316E;
}

.before-after .before-after-item img {
  transition: all ease-in-out 0.4s;
}

.before-after .before-after-item:hover img {
  transform: scale(1.1);
}

.before-after .col-xs-12,
.before-after .col-sm-6,
.before-after .col-md-4,
.before-after .col-lg-3 {
  padding-left: 0 !important;
  padding-right: 0 !important;
}

#block-views-before-after-block {
  padding: 0;
}


/*--------------------------------------------------------------
# Contact Section
--------------------------------------------------------------*/
.contact {
  background: #fff;
  padding-top: 0 !important;
}

.contact .section-header {
  text-align: left;
  padding: 30px 0 30px 0;
  position: relative;
}

.pb-0 {
  padding-bottom: 0 !important;
}

@media (max-width: 1279px) {

  .contact .box-1,
  .contact .box-2,
  .contact .box-3 {
    height: auto;
  }
}

@media (min-width: 1280px) {

  .contact .box-1,
  .contact .box-2,
  .contact .box-3 {
    height: 500px;
  }
}

.contact .content {
  padding: 50px;
}

.contact .box-1 {
  background: #16213E;
}

.contact .box-1 .section-header h2 {
  color: #fff;
}

.contact .box-1 .section-header p {
  color: #fff;
}

.contact .box-2 {
  background: #13316E;
}

.contact .box-3 {
  background: #eeeeee;
  padding: 0;
}

.contact .content h3 {
  font-weight: 700;
  font-size: 32px;
  font-family: var(--font-secondary);
  color: #001f8d;
}

.contact .info-item+.info-item {
  margin-top: 40px;
}

.contact .info-item i {
  font-size: 20px;
  background: var(--color-primary);
  color: #fff;
  width: 44px;
  height: 44px;
  display: flex;
  justify-content: center;
  align-items: center;
  border-radius: 4px;
  transition: all 0.3s ease-in-out;
  margin-right: 15px;
  position: absolute;
}

.contact .info-item h4 {
  padding: 0;
  font-size: 20px;
  font-weight: 600;
  margin-bottom: 5px;
  color: #fff;
  margin-left: 70px;
}

.contact .info-item p {
  padding: 0;
  margin-bottom: 0;
  font-size: 14px;
  color: #fff;
  margin-left: 70px;
}


.address,
.email,
.phone,
.time {
  margin-bottom: 20px;
}

.contact .php-email-form {
  width: 100%;
  background: #fff;
}

.contact .php-email-form .form-group {
  padding-bottom: 8px;
}

.contact .php-email-form .error-message {
  display: none;
  color: #fff;
  background: #df1529;
  text-align: left;
  padding: 15px;
  font-weight: 600;
}

.contact .php-email-form .error-message br+br {
  margin-top: 25px;
}

.contact .php-email-form .sent-message {
  display: none;
  color: #fff;
  background: #059652;
  text-align: center;
  padding: 15px;
  font-weight: 600;
}

.contact .php-email-form .loading {
  display: none;
  background: #fff;
  text-align: center;
  padding: 15px;
}

.contact .php-email-form .loading:before {
  content: "";
  display: inline-block;
  border-radius: 50%;
  width: 24px;
  height: 24px;
  margin: 0 10px -6px 0;
  border: 3px solid #059652;
  border-top-color: #fff;
  -webkit-animation: animate-loading 1s linear infinite;
  animation: animate-loading 1s linear infinite;
}

.contact .php-email-form input,
.contact .php-email-form textarea {
  border-radius: 4px;
  box-shadow: none;
  font-size: 14px;
}

.contact .php-email-form input {
  height: 44px;
}

.contact .php-email-form textarea {
  padding: 10px 12px;
}

.contact .php-email-form button[type=submit] {
  background: var(--color-primary);
  border: 0;
  padding: 10px 35px;
  color: #fff;
  transition: 0.4s;
  border-radius: 5px;
}

.contact .php-email-form button[type=submit]:hover {
  background: rgba(13, 66, 255, 0.8);
}

@keyframes animate-loading {
  0% {
    transform: rotate(0deg);
  }

  100% {
    transform: rotate(360deg);
  }
}

/*--------------------------------------------------------------
# Testimonials Section
--------------------------------------------------------------*/
.testimonials {
  background: #fff;
}


#block-views-front-testimonials-block {
  padding: 0;
}

.testimonials .testimonial-wrap {
  padding-left: 10px;
}

.testimonials .testimonial-item {
  box-sizing: content-box;
  padding: 30px;
  margin: 30px 10px;
  box-shadow: 0px 0 15px rgba(0, 0, 0, 0.1);
  position: relative;
  background: #fff;
  border-radius: 10px;
}

.testimonials .testimonial-item .testimonial-img {
  width: 90px;
  border-radius: 50px;
  margin-right: 15px;
}

.testimonials .testimonial-item h3 {
  font-size: 18px;
  font-weight: bold;
  margin: 10px 0 5px 0;
  color: #000;
}

.testimonials .testimonial-item h4 {
  font-size: 14px;
  color: #999;
  margin: 0;
}

.testimonials .testimonial-item .stars {
  margin: 10px 0;
}

.testimonials .testimonial-item .stars i {
  color: #ffc107;
  margin: 0 1px;
}

.testimonials .testimonial-item .quote-icon-left,
.testimonials .testimonial-item .quote-icon-right {
  color: #009d8b;
  font-size: 26px;
  line-height: 0;
}

.testimonials .testimonial-item .quote-icon-left {
  display: inline-block;
  left: -5px;
  position: relative;
}

.testimonials .testimonial-item .quote-icon-right {
  display: inline-block;
  right: -5px;
  position: relative;
  top: 10px;
  transform: scale(-1, -1);
}

.testimonials .testimonial-item p {
  font-style: italic;
  margin: 15px auto 15px auto;
}

.testimonials .swiper-pagination {
  margin-top: 20px;
  position: relative;
}

.testimonials .swiper-pagination .swiper-pagination-bullet {
  width: 12px;
  height: 12px;
  background-color: rgba(0, 0, 0, 0.2);
  opacity: 1;
}

.testimonials .swiper-pagination .swiper-pagination-bullet-active {
  background-color: var(--color-primary);
}

@media (max-width: 767px) {
  .testimonials .testimonial-wrap {
    padding-left: 0;
  }

  .testimonials .testimonial-item {
    padding: 30px;
    margin: 15px;
  }

  .testimonials .testimonial-item .testimonial-img {
    position: static;
    left: auto;
  }
}


/*=================================
Testimonials Area 
====================================*/
.testimonials-area {
  position: relative;
  /* border-top: 1px solid #c1c1c1;
  border-bottom: 1px solid #c1c1c1; */
  padding: 0;

}



.testimonials-area .section-header p {
  color: #fff;
}

.testimonials-area::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  width: 100%;
  height: 100%;
  -webkit-filter: blur(5px);
  filter: blur(5px);
  background-image: url(https://drmishras.com/img/testimonials-bg.jpg);
  background-size: cover;
  background-position: center center;
  background-repeat: no-repeat;
}

.testimonials-area::after {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  width: 100%;
  height: 100%;
  background-color: #1FA2FF;
  opacity: 0.1;
}

.flex-direction-nav a {
  height: 80px;
}

.testimonials-img {
  position: relative;
  z-index: 1;
  border-radius: 10px;
}

.testimonials-img img {
  border-radius: 10px;
}

.testimonials-slider-area {
  position: relative;
  z-index: 9;
}

.testimonials-slider-area .owl-nav {
  margin-top: 0;
}

.testimonials-slider-area .owl-nav .owl-prev {
  position: absolute;
  top: -70px;
  left: 145px;
  font-size: 18px !important;
  width: 45px;
  height: 45px;
  border-radius: 0;
  line-height: 45px;
  background-color: #1FA2FF !important;
  color: #ffffff !important;
}

.testimonials-slider-area .owl-nav .owl-prev:hover {
  background-color: #ffffff !important;
  color: #1FA2FF !important;
}

.testimonials-slider-area .owl-nav .owl-next {
  position: absolute;
  top: -70px;
  left: 200px;
  font-size: 18px !important;
  width: 45px;
  height: 45px;
  line-height: 45px;
  border-radius: 0;
  background-color: #1FA2FF !important;
  color: #ffffff !important;
}

.testimonials-slider-area .owl-nav .owl-next:hover {
  background-color: #ffffff !important;
  color: #1FA2FF !important;
}



@media (max-width: 1279px) {
  .testimonials-slider {
    margin-bottom: 35px;
    background-color: #002F79;
    padding: 30px 20px;
    margin-top: 20px;
    position: relative;
    border-radius: 10px;
  }

  .testimonials-area .google-reviews-header {
    margin-top: 0;
  }

  .testimonials-slider::before {
    content: "\F6B0";
    position: absolute;
    color: #18499547;
    left: 0;
    right: 0;
    top: 115px;
    font-family: bootstrap-icons;
    font-size: 12rem;
    line-height: 0.6;
    text-align: center;
    pointer-events: none;
  }
}

@media (min-width: 1280px) {
  .testimonials-slider {
    margin-bottom: 35px;
    background-color: #002F79;
    padding: 60px 40px;
    margin-left: -150px;
    margin-right: 150px;
    margin-top: 70px;
    position: relative;
    border-radius: 10px;
  }

  .testimonials-slider::before {
    content: "\F6B0";
    position: absolute;
    color: #18499547;
    left: 0;
    right: 0;
    top: 115px;
    font-family: bootstrap-icons;
    font-size: 505px;
    /* -webkit-transform: rotate(95deg);
    transform: rotate(80deg); */
    line-height: 0.6;
    text-align: center;
  }
}



.testimonials-slider .flexslider {
  margin: 0 0 60px;
  background: transparent;
  border: 0px;
  position: relative;
  zoom: 1;
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  border-radius: 4px;
  -webkit-box-shadow: ''0 1px 4px rgba(0, 0, 0, 0.2);
  -moz-box-shadow: ''0 1px 4px rgba(0, 0, 0, 0.2);
  -o-box-shadow: ''0 1px 4px rgba(0, 0, 0, 0.2);
  box-shadow: ''0 1px 4px rgba(0, 0, 0, 0.2);
}

.testimonials-slider .testimonials-item {
  text-align: center;
  position: relative;
  z-index: 1;
}

.testimonials-slider .testimonials-item i {
  color: #1FA2FF;
  font-size: 45px;
  text-align: center;
}

.testimonials-slider .testimonials-item > .bi-quote {
  display: block;
  line-height: 1;
  margin-bottom: 0.75rem;
}

.testimonials-slider .testimonials-item p {
  font-size: 18px;
  color: #ffffff;
  margin-bottom: 30px;
}

.testimonials-slider .testimonials-item .content img {
  /* border-radius: 50%; */
  margin-bottom: 15px;
  width: 90px;
  margin-left: auto;
  margin-right: auto;
}

.testimonials-slider .testimonials-item .content h3 {
  font-size: 16px;
  color: #ffffff;
  margin-bottom: 0;
}

.testimonials-slider .testimonials-item .content span {
  font-size: 14px;
  color: #E2E2E2;
}

.testimonials-slider-two {
  margin-bottom: 120px;
  background-color: #002F79;
  padding: 70px 40px;
  position: relative;
}

.testimonials-slider-two .owl-nav {
  margin-top: 0;
}

.testimonials-slider-two .owl-nav .owl-prev {
  position: absolute;
  bottom: -90px;
  left: 45%;
  font-size: 18px !important;
  width: 45px;
  height: 45px;
  border-radius: 0;
  line-height: 45px;
  background-color: #1FA2FF !important;
  color: #ffffff !important;
}

.testimonials-slider-two .owl-nav .owl-prev:hover {
  background-color: #ffffff !important;
  color: #1FA2FF !important;
}

.testimonials-slider-two .owl-nav .owl-next {
  position: absolute;
  bottom: -90px;
  right: 45%;
  font-size: 18px !important;
  width: 45px;
  height: 45px;
  line-height: 45px;
  border-radius: 0;
  background-color: #1FA2FF !important;
  color: #ffffff !important;
}

.testimonials-slider-two .owl-nav .owl-next:hover {
  background-color: #ffffff !important;
  color: #1FA2FF !important;
}

.testimonials-slider-two::before {
  content: "\f10a";
  position: absolute;
  color: #18499547;
  left: 0;
  right: 0;
  top: 195px;
  font-family: Flaticon;
  font-size: 505px;
  -webkit-transform: rotate(95deg);
  transform: rotate(80deg);
  line-height: 1.4;
}

.testimonials-slider-two .testimonials-card {
  text-align: center;
  position: relative;
  z-index: 1;
}

.testimonials-slider-two .testimonials-card i {
  color: #1FA2FF;
  font-size: 45px;
  text-align: center;
}

.testimonials-slider-two .testimonials-card p {
  font-size: 20px;
  color: #ffffff;
  margin-bottom: 30px;
  max-width: 800px;
  margin-left: auto;
  margin-right: auto;
}

.testimonials-slider-two .testimonials-card .content img {
  /* border-radius: 50%; */
  margin-bottom: 15px;
  width: 80px;
  margin-left: auto;
  margin-right: auto;
}

.testimonials-slider-two .testimonials-card .content h3 {
  font-size: 16px;
  color: #ffffff;
  margin-bottom: 0;
}

.testimonials-slider-two .testimonials-card .content span {
  font-size: 14px;
  color: #E2E2E2;
}

/*--------------------------------------------------------------
# Blog Section
--------------------------------------------------------------*/
.blog {
  background: #fff;
}

#block-views-blog-block-1 {
  padding: 0;
}

.blog {
  /* padding: 0 30px; */
}

.blog .icon-box {
  margin-bottom: 20px;
  padding: 20px;
  background: #fff;
  transition: all 0.3s ease-in-out;
  border-radius: 5px;
  border: 1px solid #f1eff1;
  box-shadow: none;
}

.blog .icon-box .pic img {
  border-radius: 5px;
}

.blog .icon-box .member-info h4 {
  font-weight: 700 !important;
  margin-bottom: 15px !important;
  font-size: 18px !important;
  background: #fff !important;
  padding: 0 !important;
  margin-top: 25px;
}

.blog .icon-box .member-info h4 a {
  color: #7D1F50;
}

.blog .icon-box .member-info p {
  margin-top: 0;
  margin-bottom: 1rem;
  margin-left: 0 !important;
}

.blog .icon-box .member-tags a {
  background-color: #D6BDD2;
  color: #fff;
  padding: 3px 8px;
  border-radius: 3px;
}

@media (max-width: 1279px) {
  .blog .icon-box {
    margin-bottom: 10px;
    padding: 0;
    background: #fff;
    box-shadow: none;
    transition: all 0.3s ease-in-out;
    border-radius: 5px;
    border: 1px solid #f1eff1;
  }

  .blog .icon-box .pic img {
    border-radius: 5px 5px 0 0;
  }

  .blog .icon-box .member-info h4 {
    font-weight: 700 !important;
    margin-bottom: 15px !important;
    font-size: 18px !important;
    background: #fff !important;
    padding: 0 !important;
    margin-top: 25px;
    padding: 0 20px !important;
  }

  .blog .icon-box .member-info h4 a {
    color: #7D1F50;
  }

  .blog .icon-box .member-info p {
    margin-top: 0;
    margin-bottom: 1rem;
    margin-left: 0 !important;
    padding: 0 20px;
  }

  .blog .icon-box .member-tags a {
    background-color: #D6BDD2;
    color: #fff;
    padding: 3px 8px;
    border-radius: 3px;
  }
}

/*--------------------------------------------------------------
# Footer
--------------------------------------------------------------*/
.footer {
  font-size: 15px;
  background-color: #F2F2F5;
  padding: 46px 0 22px;
  color: #17244A;
  border-top: none;
}

.footer__inner {
  width: 100%;
  max-width: 1600px;
  margin: 0 auto;
  padding: 0 24px;
}

.footer__grid {
  display: grid;
  grid-template-columns: minmax(200px, 1.45fr) minmax(115px, 0.75fr) minmax(125px, 0.85fr) minmax(135px, 0.95fr) minmax(100px, 0.65fr) minmax(210px, 1.25fr);
  gap: 2rem 1.5rem;
  align-items: start;
}

.footer__copyright {
  text-align: center;
  margin-top: 1.75rem;
  padding-top: 0.9rem;
  border-top: 1px solid rgba(23, 36, 74, 0.08);
  font-size: 14px;
}

@media (min-width: 1280px) and (max-width: 1500px) {
  .footer__inner {
    padding: 0 20px;
  }

  .footer__grid {
    gap: 1.5rem 1.15rem;
    grid-template-columns: minmax(185px, 1.4fr) minmax(108px, 0.72fr) minmax(118px, 0.82fr) minmax(128px, 0.92fr) minmax(95px, 0.62fr) minmax(195px, 1.2fr);
  }
}

.footer .row.gy-4 {
  --bs-gutter-y: 1.1rem;
}

.footer .footer-info .logo {
  line-height: 0;
  margin-bottom: 25px;
}

.footer .footer-info .logo img {
  max-height: 70px;
  margin-right: 6px;
}

.footer .footer-info .logo span {
  font-size: 30px;
  font-weight: 700;
  letter-spacing: 1px;
  color: #fff;
  font-family: var(--font-primary);
}

.footer .footer-info p {
  font-size: 15px;
  font-family: var(--font-primary);
  line-height: 1.65;
  max-width: 300px;
}


.footer .social-links a {
  display: flex;
  float: left;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  border-radius: 50%;
  border: 1px solid #17244A;
  font-size: 16px;
  color: #17244A;
  margin-right: 10px;
  transition: 0.3s;
}

.footer .social-links a:hover {
  color: rgba(13, 66, 255, 0.8);
  border-color: rgba(13, 66, 255, 0.8);
}

.footer h4 {
  font-size: 17px;
  font-weight: 700;
  position: relative;
  padding-bottom: 10px;
  margin-bottom: 4px;
  color: #17244A;
}

.footer .footer-links {
  margin-bottom: 0;
}

.footer .footer-links ul {
  list-style: none;
  padding: 0;
  margin: 0;
}

.footer .footer-links ul i {
  padding-right: 2px;
  color: rgba(13, 66, 255, 0.8);
  font-size: 12px;
  line-height: 0;
}

.footer .footer-links ul li {
  padding: 6px 0;
  display: flex;
  align-items: center;
}

.footer .footer-links ul li:first-child {
  padding-top: 0;
}

.footer .footer-links ul a {
  color: #17244A;
  font-size: 15px;
  transition: 0.3s;
  display: inline-block;
  line-height: 1.45;
  white-space: normal;
}

.footer .footer-links ul a:hover {
  color: rgba(13, 66, 255, 0.8);
}

.footer .footer-contact p {
  font-size: 15px;
  line-height: 1.7;
  margin-bottom: 0;
}

.footer .copyright,
.footer .footer__copyright {
  text-align: center;
  margin-top: 1rem;
  padding-top: 0.9rem;
  border-top: 1px solid rgba(23, 36, 74, 0.08);
  font-size: 14px;
}

.footer .credits {
  padding-top: 4px;
  text-align: center;
  font-size: 14px;
}

.footer .credits a {
  color: #17244A;
}



.service-card {
  text-align: center;
  margin-bottom: 30px;
  position: relative;
  /* -webkit-box-shadow: 0 0 15px rgba(0, 0, 0, 0.3);
          box-shadow: 0 0 15px rgba(0, 0, 0, 0.3); */
  /* padding: 1px; */
  border: 1px solid #F2F2F5;
  border-radius: 10px;
}

.service-card::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 0;
  background-color: #16213E;
  -webkit-transition: 0.7s;
  transition: 0.7s;
  opacity: 0;
}

.service-card:hover::before {
  height: 100%;
  opacity: 0.8;
}

.service-card:hover .service-content {
  top: 36%;
  -webkit-transform: translateY(-31%);
  transform: translateY(-31%);
}

.service-card:hover .service-content::before {
  display: none;
}

.service-card:hover .service-content .service-icon {
  background-color: #ffffff;
  color: #16213E;
  margin-bottom: 20px;
}

.service-card:hover .service-content h3 {
  margin-bottom: 10px;
  color: #ffffff;
}

.service-card:hover .service-content h3 a {
  color: #ffffff;
}

.service-card:hover .service-content .content {
  display: block;
}

.service-card:hover .service-content .content p {
  color: #ffffff;
}

.service-card:hover .service-shape-1 {
  -webkit-transform: scale(1);
  transform: scale(1);
}

.service-card:hover .service-shape-2 {
  -webkit-transform: scale(1);
  transform: scale(1);
}

.service-card a {
  display: block;
}

.service-card .service-content {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  padding: 10px 20px;
  background-color: transparent;
  z-index: 1;
  height: auto;
  -webkit-transition: 0.9s;
  transition: 0.9s;
  overflow: hidden;
}

.service-card .service-content::before {
  content: '';
  position: absolute;
  bottom: -60px;
  z-index: -1;
  left: 0;
  right: 0;
  width: 100%;
  height: 100%;
  background-color: #F2F2F5;
}

.service-card .service-content .service-icon {
  font-size: 35px;
  width: 75px;
  height: 75px;
  color: #ffffff;
  background-color: #1FA2FF;
  line-height: 75px;
  margin-left: auto;
  margin-right: auto;
  margin-bottom: 16px;
  border-radius: 50px;
  text-align: center;
  position: relative;
}

.service-card .service-content h3 {
  margin-bottom: 15px;
  font-size: 22px;
  padding-top: 30px;
}

.service-card .service-content h3 a {
  color: #16213E;
}

.service-card .service-content .content {
  margin-top: 10px;
  margin-bottom: 10px;
  display: none;
}

.service-card .service-content .content p {
  color: #ffffff;
  margin-bottom: 0;
}

.service-card .service-shape-1 {
  position: absolute;
  top: 0;
  left: 0;
  -webkit-transform: scale(0);
  transform: scale(0);
  -webkit-transition: 0.7s;
  transition: 0.7s;
}

.service-card .service-shape-2 {
  position: absolute;
  bottom: 0;
  right: 0;
  -webkit-transform: scale(0);
  transform: scale(0);
  -webkit-transition: 0.7s;
  transition: 0.7s;
}




.views-bootstrap-accordion-plugin-style h4 {
  padding: 0;
}

.panel-default>.panel-heading {
  color: #333333;
  background-color: #F2F2F5;
  border-color: transparent;
}

.panel-group .panel {
  margin-bottom: 0;
  border-radius: 4px;
}

.panel {
  border: 1px solid #F2F2F5;
  border-top-width: 1px;
  border-right-width: 1px;
  border-bottom-width: 1px;
  border-left-width: 1px;
  border-width: 0 1px 4px 1px;
}

.views-bootstrap-accordion-plugin-style h4 {
  font-family: "Montserrat", sans-serif;
  font-size: 16px;
  line-height: 22px;
  background: #F2F2F5;
  padding: 10px 10px 10px 10px;
}


/*--------------------------------------------------------------
# Services-Box
--------------------------------------------------------------*/
.services-box {
  background: #fff;
  /* box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px; */
  /* border: 1px solid #dddd; */
  /*border-radius: 5px;*/
  margin-bottom: 30px
}


.services-box a {
  color: #2C4964;
}

.services-box .member {
  position: relative;
  padding: 10px;
  /*box-shadow: 0px 2px 12px rgba(44, 73, 100, 0.08);*/
  /* min-height: 355px; */
}

.services-box .member .pic {
  overflow: hidden;
  width: 100%;
  /*border-radius: 5px;*/
}

.services-box .member .pic img {
  transition: ease-in-out 0.3s;
}

.services-box .member:hover img {
  transform: scale(1.1);
}

.services-box .member .member-info {
  padding-left: 30px;
}

.services-box .member h4 {
  font-weight: 700;
  margin-bottom: 5px;
  font-size: 20px;
  color: #2c4964;
  margin-top: 20px;
}

.services-box .member span {
  display: block;
  font-size: 15px;
  padding-bottom: 10px;
  position: relative;
  font-weight: 500;
}

.services-box .member span::after {
  content: "";
  position: absolute;
  display: block;
  width: 50px;
  height: 3px;
  background: #b2c8dd;
  bottom: 0;
  left: 0;
}

.services-box .member p {
  margin: 10px 0 0 0;
  font-size: 14px;
}

.services-box .member .social {
  margin-top: 12px;
  display: flex;
  align-items: center;
  justify-content: flex-start;
}

.services-box .member .social a {
  transition: ease-in-out 0.3s;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 50px;
  width: 32px;
  height: 32px;
  background: #a0bcd5;
}

.services-box .member .social a i {
  color: #fff;
  font-size: 16px;
  margin: 0 2px;
}

.services-box .member .social a:hover {
  background: #1977cc;
}

.services-box .member .social a+a {
  margin-left: 8px;
}



/*--------------------------------------------------------------
# Front News
--------------------------------------------------------------*/
.front-news {
  background: transparent;
  border-radius: 0;
  margin-bottom: 30px;
}

.front-news a {
  color: #2C4964;
}

.front-news .member {
  position: relative;
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.front-news .member .pic {
  overflow: hidden;
  width: 100%;
  border-radius: 10px;
  background: #f0f3f8;
  line-height: 0;
}

.front-news .member .pic img {
  transition: ease-in-out 0.3s;
  transform: scale(1.1);
  width: 100%;
  height: auto;
  display: block;
}

.front-news .member:hover img {
  transform: scale(1.3);
}

.front-news .member .member-info {
  padding-left: 30px;
}

.front-news .member h4 {
  font-weight: 700;
  margin: 0;
  font-size: 20px;
  color: #2c4964;
  padding: 18px 20px;
  background: #F9F9F9;
  border-radius: 10px;
}

.front-news .member:hover h4 a {
  color: #16213E;
}

.front-news .member span {
  display: block;
  font-size: 15px;
  padding-bottom: 10px;
  position: relative;
  font-weight: 500;
}

.front-news .member span::after {
  content: "";
  position: absolute;
  display: block;
  width: 50px;
  height: 3px;
  background: #b2c8dd;
  bottom: 0;
  left: 0;
}

.front-news .member:hover span::after {
  content: "";
  position: absolute;
  display: block;
  width: 100px;
  height: 3px;
  background: #1977cc;
  bottom: 0;
  left: 0;
}

.front-news .member p {
  margin: 10px 0 0 0;
  font-size: 14px;
}

.front-news .member .social {
  margin-top: 12px;
  display: flex;
  align-items: center;
  justify-content: flex-start;
}

.front-news .member .social a {
  transition: ease-in-out 0.3s;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 50px;
  width: 32px;
  height: 32px;
  background: #a0bcd5;
}

.front-news .member .social a i {
  color: #fff;
  font-size: 16px;
  margin: 0 2px;
}

.front-news .member .social a:hover {
  background: #1977cc;
}

.front-news .member .social a+a {
  margin-left: 8px;
}



.whatsapp-icon {
  position: fixed;
  bottom: 20px;
  right: 20px;
  z-index: 999999;
}

.whatsapp-icon img {
  height: 60px;
}

.book-appointment-icon {
  position: fixed;
  bottom: 20px;
  left: 20px;
  z-index: 999999;
}

.book-appointment-icon img {
  width: 160px;
}


.top-bar {
  /* background-color: #002F79; */
  height: 33px;
  border-bottom: 1px solid #20324D;
}

.top-navbar-text {
  color: #F2F2F5;
  font-size: 12px;
  margin-top: 5px;
}

.top-navbar-text .tnt {
  padding-right: 20px;
  width: 150px;
  float: left;
}


.social-icons {
  width: 175px;
  height: 25px;
  position: absolute;
  display: contents;
}

.social-icons .icons {
  float: right;
  padding: 8px 5px !important;
}

.social-icons .icons .text {
  border-radius: 50px;
  font-size: 10;

}

body.navbar-is-fixed-top,
body.admin-menu.navbar-is-fixed-top {
    padding-top: 52px !important;
}

body {
    padding: 0;
    overflow-x: hidden;
}

.navbar {

    border: none;
}

.navbar-fixed-top {
    background-color: rgba(14, 29, 52, 1) !important;
}

.navbar .container-fluid {
    padding: 0 65px !important;
    min-width: 1200px;
}

.container-fluid {
    padding: 0 65px !important;
    min-width: 1200px;
}

.container-fuild.aos-init.aos-animate {
    padding: 0 65px !important;
    min-width: 1440px;
}



@media (max-width: 1279px) {
    #slideshow_container {
        position: absolute;
        z-index: -999;
        /* margin-top: 60px; */
        min-height: 110px;
    }
}

@media (min-width: 1280px) {

    #slideshow_container {
        position: absolute;
        z-index: -999;
    }
}

.oc-flot-left {
    position: absolute;
    margin-left: 60px;
    margin-top: 10px;
}

.oc-flot-social-right {
    /* position: absolute; */
    margin-right: 20px;
    margin-top: 5px;
}

.navbar .btn {
    background: none repeat scroll 0 0 #e1e1e1;
    border: 0 none;
    border-radius: 0;
    float: right;
    height: 52px;
    line-height: 52px;
    padding: 0 15px;
}

.logo {
    display: block;
    line-height: 52px;
    /* position: absolute; */
    z-index: 3;
    /* max-width: 240px; */
}


@media (min-width: 1280px) {
    .logo {
        margin-top: 5px;
    }

}

#header .logo {
    display: block;
    line-height: 52px;
    position: absolute;
    z-index: 3;
    max-width: 240px;
}

.logo img {
    height: 99px;
}

.header {
    position: relative;
}

#block-system-user-menu {
    background: none repeat scroll 0 0 rgba(0, 0, 0, 0.25);
    position: absolute;
    right: 0;
    top: 52px;
}

#block-system-user-menu .menu a {
    color: white;
}

#block-system-user-menu .menu a {
    background: transparent;
    text-decoration: underline;
}

.views-row h2 a {
    color: black;
}

@media(max-width: 769px) {

    #block-system-user-menu {
        top: 0;
    }

}

.navbar #main-nav li a {
    line-height: 52px;
    height: 52px;
    padding: 0 15px;
}

.navbar #main-nav li a a {
    display: none;
}

.navbar #main-nav li a:hover,
.navbar #main-nav li:hover a {
    background: #ccc;
}

.navbar #main-nav li:hover li a {
    background: #fff;
}

.navbar #main-nav li:hover li a:hover {
    background: #999;
}

.navbar #main-nav .dropdown-menu {
    display: none;
}

.navbar #main-nav .open .dropdown-menu {
    display: block;
}

.block-commerce-cart .dropdown-menu {
    left: auto;
    right: 0px;
    top: 52px;
    padding: 10px;
}

.front .main-container {
    padding: 60px 0;
}

.not-front .main-container {
    padding: 0 0 100px;
}

.more-link {
    text-align: center;
}

#luxe-login {
    float: left;
    width: 45%;
}

#luxe-login-register {
    float: right;
    width: 45%;
}

footer.footer {
    /* background: black;  */
    margin: 0;
}

@media(max-width: 769px) {

    .block-commerce-cart .btn {
        position: absolute;
        right: 0px;
        bottom: auto;
        top: -52px;
    }

    .navbar-default .navbar-toggle {
        position: absolute;
        right: 100px;
    }

    #main-nav {
        padding: 0;
    }

    #main-nav ul {
        margin: 0;
    }

    .block-commerce-cart .dropdown-menu {
        top: 0;
    }

    #luxe-login {
        float: left;
        width: 100%;
    }

    #luxe-login-register {
        float: left;
        width: 100%;
    }

}

.page-articulos .view-vista-de-articulos .views-row {
    margin: 0 0 15px;
    padding: 0 0 15px;
    border-bottom: 1px solid #ccc;
}

#block-menu-menu-menu-footer {
    margin: 0 0 25px;
}

#block-menu-menu-menu-footer .menu {
    text-align: center;
}

#block-menu-menu-menu-footer .menu li {
    display: inline;
}

#block-menu-menu-menu-footer .menu li a {
    color: white;
    display: inline-block;
}

#block-menu-menu-menu-footer .menu li a:hover {
    background: transparent;
    text-decoration: underline;
}

#block-block-1 {
    text-align: center;
    color: white;
}

#block-block-1 a {
    color: white;
}

#block-devel-execute-php {
    clear: both;
}

.block-facetapi input[type=checkbox] {
    margin-right: 5px;
}

/* SLIDER */
#layerslider h2 {
    background: rgba(0, 0, 0, .5);
    border-radius: 0;
    font-size: 24px;
}

#layerslider div.ls-l {
    color: white;
    font-size: 24px;
    left: 120px;
    top: 200px;
    white-space: nowrap;
}

#layerslider a.ls-l {
    background: none repeat scroll 0 0 rgba(0, 0, 0, 0.25);
    color: white;
    display: inline-block;
    left: 120px;
    padding: 5px;
    top: 254px;
    white-space: nowrap;
}

#commerce-addressbook-billing-default .views-row {
    background: rgba(0, 0, 0, .15);
    padding: 15px;
}

.page-user-addressbook .addressfield-container-inline .name-block {
    font-weight: 700;
    font-size: 20px;
    border-bottom: 1px solid #ccc;
    margin-bottom: 10px;
    overflow: hidden;
}

.page-user-addressbook #commerce-addressbook-billing-list td .views-field address {
    border: 1px solid #ccc;
    padding: 10px;
}


/*--------------------------------------
 Sets the actionable area for the burger
 including a label for usability
--------------------------------------*/
.burger,
.burger:after,
.burger *,
.burger *:before,
.burger *:after,
.header-nav *,
.header-nav *:before,
.header-nav *:after {
    -webkit-transition: all 0.3s;
    transition: all 0.3s;
}

.burger {
    cursor: pointer;
    height: 60px;
    margin-bottom: 0;
    width: 60px;
    z-index: 9001;
    left: 0;
    overflow: hidden;
    position: fixed;
    top: 0;
}

.burger:after {
    bottom: 7px;
    color: #FFFFFF;
    font-size: 13px;
    font-weight: 300;
    left: 0;
    position: absolute;
    text-align: center;
    width: 100%;
}


/*--------------------------------------
 Creates the look of the burger icon
 using the inner span and pseudo-elements
--------------------------------------*/

.burger span,
.burger span:before,
.burger span:after {
    background: rgba(255, 255, 255, 0.3);
    height: 4px;
    left: 15px;
    position: absolute;
    top: 28px;
    -webkit-transition: all 0.3s;
    transition: all 0.3s;
    width: 30px;
}


/* Reset the left and create the pseudo-element */

.burger span:before,
.burger span:after {
    content: '';
    left: 0;
}


/* Top bar position */

.burger span:before {
    top: -10px;
}


/* Bottom bar position */

.burger span:after {
    top: 10px;
}


/* Get rid of more on action (IE9 or higher) */

.burger-check:checked+.burger:after {
    content: '';
}


/* Get rid of the middle bar on action (IE9 or higher) */

.burger-check:checked+.burger span {
    height: 0;
    width: 0;
}


/* Moves the top and bottom bars to the middle on action (IE9 or higher) */

.burger-check:checked+.burger span:before,
.burger-check:checked+.burger span:after {
    top: 6px;
}


/* Rotates the top bar on action with full browser support (IE9 or higher) */

.burger-check:checked+.burger span:before {
    -webkit-transform: rotate(225deg);
    -ms-transform: rotate(225deg);
    transform: rotate(225deg);
}


/* Rotates the bottom bar on action with full browser support (IE9 or higher) */

.burger-check:checked+.burger span:after {
    -webkit-transform: rotate(-225deg);
    -ms-transform: rotate(225deg);
    transform: rotate(-225deg);
}

#mobile-nav:focus+.burger,
.burger:focus,
.burger:hover {
    background: rgba(0, 136, 204, 0.9);
}

.burger-check:checked+.burger {}

.burger-check:checked+.burger:after {
    bottom: 18px;
    font-size: 20px;
    padding-left: 30px;
}

#mobile-nav {
    left: -9999px;
    position: fixed;
    top: 0;
}

.header-nav ul li a:active,
.header-nav ul li a:focus,
.header-nav ul li a:hover,
#mobile-nav:focus+.burger,
.burger:focus,
.burger:hover {
    background: rgba(0, 0, 0, 0.1);
    outline: none;
}

.fixed-nav {
    background: #08c;
    height: 60px;
    position: fixed;
    width: 100%;
    z-index: 9000;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.3);
}

.header-nav {
    float: left;
    height: 60px;
    position: relative;
    width: 100%;
}

.header-nav ul {
    background: #FFF;
    height: calc(100vh - 60px);
    list-style: none;
    margin: 0;
    overflow-y: auto;
    padding: 10px 0 0 0;
    position: absolute;
    -webkit-transform: translateX(-110%);
    transform: translateX(-110%);
    -webkit-transition-timing-function: cubic-bezier(0.250, 0.460, 0.450, 0.940);
    -moz-transition-timing-function: cubic-bezier(0.250, 0.460, 0.450, 0.940);
    -o-transition-timing-function: cubic-bezier(0.250, 0.460, 0.450, 0.940);
    transition-timing-function: cubic-bezier(0.250, 0.460, 0.450, 0.940);
    width: 280px;
    box-shadow: 3px 3px 5px rgba(0, 0, 0, 0.075);
    top: 100%;
    z-index: 3;
    margin-left: -15px;
}

.burger-check:checked~.header-nav ul {
    -webkit-transform: translateX(0);
    transform: translateX(0);
}

.header-nav ul li {
    float: left;
    position: relative;
    width: 100%;
}

.header-nav ul li a {
    color: rgba(0, 0, 0, 0.79);
    display: block;
    float: left;
    font-size: 14px;
    font-weight: 400;
    letter-spacing: 0.75px;
    line-height: 24px;
    margin-left: 0px;
    overflow: hidden;
    padding: 8px 10px 8px 40px;
    position: relative;
    text-decoration: none;
    width: 100%;
}

.header-nav-main-tab {
    font-weight: 700 !important;
}

.header-nav-tab {
    padding-left: 20px !important;
}

#edit-actions-submit {
    background-color: #82BF4F !important;
    color: #fff !important;
    text-transform: uppercase;
}

/* AI Powered  */

.AI-Powered-img{
    width: 100% !important;
    border-radius: 20px;
    
}

.service-item_1{
    padding-top: 0px;
}

.section-header_1{
    padding-top: 0px !important;
    padding-bottom: 0px !important;
}

.why-us_1{
    padding: 40px 0px !important;
}

/* Hero stats counters */
.hero-stats {
    margin-top: 0.5rem;
}

.hero-stat {
    text-align: center;
    height: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-start;
}

.hero-stat-value {
    display: inline-flex;
    align-items: baseline;
    justify-content: center;
    gap: 0;
    line-height: 1;
    margin-bottom: 0.75rem;
    white-space: nowrap;
}

.hero-stat-number,
.hero-stat-suffix {
    font-family: "Montserrat", sans-serif;
    font-weight: 700;
    color: #fff;
    text-shadow: 0 2px 5px rgba(14, 29, 52, 0.5);
}

#hero .hero-stat-number,
#hero .hero-stat-suffix {
    font-size: 2.25rem;
}

#hero .hero-stat-label {
    margin: 0;
    padding: 0;
    font-family: "Montserrat", sans-serif;
    font-size: 1.05rem;
    font-weight: 600;
    line-height: 1.35;
    color: #fff;
    text-shadow: 0 2px 5px rgba(14, 29, 52, 0.5);
    max-width: 11rem;
}

.hero-stats--mobile {
    width: 100%;
    max-width: 420px;
    margin: 0 auto;
}

.mobile-counter-block {
    width: 100%;
    max-width: 420px;
    padding: 1.25rem 0.75rem 1.5rem;
}

.mobile-counter-block .hero-stat-number,
.mobile-counter-block .hero-stat-suffix {
    font-size: 1.35rem;
}

.mobile-counter-block .hero-stat-label {
    font-size: 0.72rem;
    font-weight: 500;
    line-height: 1.3;
    max-width: 6.5rem;
}

.mobile-counter-block .hero-stat-value {
    margin-bottom: 0.5rem;
}

@media (min-width: 992px) {
    #hero .hero-stat-number,
    #hero .hero-stat-suffix {
        font-size: 2.5rem;
    }

    #hero .hero-stat-label {
        font-size: 1.125rem;
        max-width: 12rem;
    }
}

/**
 * Full-screen OcMono search modal.
 */

.oc-search-modal {
  position: fixed;
  inset: 0;
  z-index: 1100;
  display: none !important;
}

.oc-search-modal.is-open {
  display: block !important;
}

.oc-search-modal__backdrop {
  position: absolute;
  inset: 0;
  border: 0;
  padding: 0;
  margin: 0;
  background: rgba(10, 14, 24, 0.88);
  cursor: pointer;
}

.oc-search-modal__panel {
  position: relative;
  z-index: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: flex-start;
  width: 100%;
  height: 100%;
  padding: 18vh 1.5rem 2rem;
  pointer-events: none;
}

.oc-search-modal__panel > * {
  pointer-events: auto;
}

.oc-search-modal__close {
  position: absolute;
  top: 1.25rem;
  right: 1.5rem;
  z-index: 2;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 48px;
  height: 48px;
  border: 0;
  background: transparent;
  color: #fff;
  font-size: 2.75rem;
  font-weight: 200;
  line-height: 1;
  cursor: pointer;
  transition: opacity 0.2s ease, transform 0.2s ease;
}

.oc-search-modal__close:hover,
.oc-search-modal__close:focus {
  opacity: 0.7;
  transform: rotate(90deg);
}

.oc-search-modal__form {
  display: flex;
  align-items: stretch;
  width: min(860px, 100%);
  box-shadow: 0 18px 50px rgba(0, 0, 0, 0.35);
}

.oc-search-modal__input {
  flex: 1 1 auto;
  min-width: 0;
  border: 0;
  outline: none;
  background: #fff;
  color: #222;
  font-size: 1rem;
  line-height: 1.4;
  padding: 1.05rem 1.25rem;
}

.oc-search-modal__input::placeholder {
  color: #b0b0b0;
}

.oc-search-modal__submit {
  flex: 0 0 auto;
  font-size: 0.85rem;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  padding: 1.05rem 1.75rem;
  white-space: nowrap;
  cursor: pointer;
  transition: background-color 0.2s ease, border-color 0.2s ease;
}

.oc-search-modal__keywords {
  width: min(860px, 100%);
  margin-top: 2.5rem;
  text-align: center;
}

.oc-search-modal__keywords-title {
  margin: 0 0 1.25rem;
  color: #fff;
  font-size: 0.8rem;
  font-weight: 600;
  letter-spacing: 0.14em;
  text-transform: uppercase;
}

.oc-search-modal__tags {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: 0.65rem;
  list-style: none;
  margin: 0;
  padding: 0;
}

.oc-search-modal__tags li {
  margin: 0;
}

.oc-search-modal__tag {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 38px;
  padding: 0.4rem 1.1rem;
  border: 1px solid rgba(255, 255, 255, 0.85);
  background: transparent;
  color: #fff;
  font-size: 0.92rem;
  font-weight: 500;
  line-height: 1.2;
  text-decoration: none;
  transition: background 0.2s ease, color 0.2s ease, border-color 0.2s ease;
}

.oc-search-modal__tag:hover,
.oc-search-modal__tag:focus,
.oc-search-modal__tag.is-active {
  background: #fff;
  border-color: #fff;
  color: #0e1d34;
  text-decoration: none;
}

.oc-search-modal__empty {
  width: 100%;
  color: rgba(255, 255, 255, 0.7);
  font-size: 0.9rem;
}

body.oc-search-modal-open {
  overflow: hidden;
}

/* Book appointment modal */
.oc-appointment-modal {
  position: fixed;
  inset: 0;
  z-index: 10050;
  display: none;
  align-items: center;
  justify-content: center;
  padding: 1.25rem;
}

.oc-appointment-modal.is-open {
  display: flex;
}

.oc-appointment-modal__backdrop {
  position: absolute;
  inset: 0;
  border: 0;
  background: rgba(14, 29, 52, 0.62);
  cursor: pointer;
}

.oc-appointment-modal__panel {
  position: relative;
  z-index: 1;
  display: flex;
  flex-direction: column;
  width: min(920px, 100%);
  max-height: min(92vh, 900px);
  background: #fff;
  border-radius: 16px;
  box-shadow: 0 24px 64px rgba(14, 29, 52, 0.22);
  overflow: hidden;
}

.oc-appointment-modal__header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 1rem;
  padding: 1.25rem 1.35rem 1rem;
  border-bottom: 1px solid #e8edf5;
  background: #fff;
}

.oc-appointment-modal__heading h2 {
  margin: 0 0 0.35rem;
  font-size: 1.35rem;
  font-weight: 700;
  color: var(--brand-dark, #16213E);
}

.oc-appointment-modal__intro {
  margin: 0;
  color: #5a6a7e;
  font-size: 0.95rem;
  line-height: 1.5;
}

.oc-appointment-modal__close {
  flex: 0 0 auto;
  width: 2.25rem;
  height: 2.25rem;
  border: 0;
  border-radius: 999px;
  background: #f3f6fb;
  color: #16213E;
  font-size: 1.5rem;
  line-height: 1;
  cursor: pointer;
}

.oc-appointment-modal__close:hover,
.oc-appointment-modal__close:focus {
  background: #e8edf5;
}

.oc-appointment-modal__body {
  flex: 1 1 auto;
  min-height: 0;
  overflow: auto;
  background: #fff;
}

.oc-appointment-modal__embed {
  min-height: 620px;
  height: min(72vh, 700px);
}

.oc-appointment-modal__embed .calendly-inline-widget,
.oc-appointment-modal__embed iframe {
  width: 100% !important;
  min-width: 0 !important;
  height: 100% !important;
  min-height: 620px;
}

body.oc-appointment-modal-open {
  overflow: hidden;
}

body.oc-appointment-modal-open .book-appointment-icon,
body.oc-appointment-modal-open .oc-whatsapp-float {
  z-index: 1;
}

body.path-book-appointment .oc-book-appointment-page,
body.path-webform-book-appointment .oc-book-appointment-page {
  min-height: 0;
  padding: 0;
}

@media (max-width: 767px) {
  .oc-search-modal__panel {
    padding-top: 22vh;
  }

  .oc-search-modal__form {
    flex-direction: column;
  }

  .oc-search-modal__submit {
    width: 100%;
    padding: 0.95rem 1.25rem;
  }

  .oc-search-modal__close {
    top: 0.75rem;
    right: 0.75rem;
    font-size: 2.4rem;
  }

  .oc-search-modal__keywords {
    margin-top: 1.75rem;
  }

  .oc-appointment-modal {
    padding: 0.75rem;
  }

  .oc-appointment-modal__panel {
    max-height: 94vh;
  }

  .oc-appointment-modal__header {
    padding: 1rem 1rem 0.85rem;
  }

  .oc-appointment-modal__embed,
  .oc-appointment-modal__embed .calendly-inline-widget,
  .oc-appointment-modal__embed iframe {
    min-height: 520px;
    height: min(70vh, 620px);
  }
}

.oc-toast-stack {
  position: fixed;
  right: 20px;
  bottom: 20px;
  z-index: 3000;
  display: flex;
  flex-direction: column;
  gap: 10px;
  width: min(360px, calc(100vw - 40px));
  pointer-events: none;
}

.oc-toast {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  padding: 14px 16px;
  border-radius: 10px;
  background: #fff;
  box-shadow: 0 8px 28px rgba(0, 0, 0, 0.16);
  border-left: 4px solid #1fa2ff;
  opacity: 0;
  transform: translateY(12px);
  transition: opacity 0.22s ease, transform 0.22s ease;
  pointer-events: auto;
}

.oc-toast.is-visible {
  opacity: 1;
  transform: translateY(0);
}

.oc-toast__icon {
  flex: 0 0 auto;
  font-size: 1.15rem;
  line-height: 1.35;
}

.oc-toast__text {
  flex: 1 1 auto;
  font-size: 0.925rem;
  line-height: 1.4;
  color: #0e1d34;
}

.oc-toast__close {
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 24px;
  height: 24px;
  padding: 0;
  border: 0;
  background: transparent;
  color: #666;
  cursor: pointer;
  line-height: 1;
}

.oc-toast__close:hover {
  color: #0e1d34;
}

.oc-toast--success {
  border-left-color: #198754;
}

.oc-toast--success .oc-toast__icon {
  color: #198754;
}

.oc-toast--error {
  border-left-color: #dc3545;
}

.oc-page-checkout .oc-toast--error {
  display: none !important;
}

.oc-toast--warning {
  border-left-color: #ffc107;
}

.oc-toast--warning .oc-toast__icon {
  color: #b8860b;
}

/* Hide default Drupal status message bars — toasts replace them. */
[data-drupal-messages],
[data-drupal-messages-fallback],
.block-system-messages-block,
.region-highlighted .block-system-messages-block,
.messages-list,
.messages,
.oc-page-checkout [data-drupal-messages],
.oc-page-checkout [data-drupal-messages-fallback],
.oc-page-checkout .block-system-messages-block,
.oc-page-checkout .messages-list,
.oc-page-checkout .messages {
  display: none !important;
}

@media (max-width: 575px) {
  .oc-toast-stack {
    right: 12px;
    bottom: 12px;
    width: calc(100vw - 24px);
  }
}

.oc-cart-drawer {
  position: fixed !important;
  inset: 0;
  z-index: 2000;
  pointer-events: none;
  visibility: hidden;
  display: none;
}

.oc-cart-drawer.is-open {
  display: block;
  pointer-events: auto;
  visibility: visible;
}

.oc-cart-drawer__overlay {
  position: absolute;
  inset: 0;
  border: 0;
  padding: 0;
  margin: 0;
  background: rgba(10, 20, 40, 0.55);
  opacity: 0;
  transition: opacity 0.25s ease;
  cursor: pointer;
}

.oc-cart-drawer.is-open .oc-cart-drawer__overlay {
  opacity: 1;
}

.oc-cart-drawer__panel {
  position: fixed;
  top: 0;
  right: 0;
  width: min(420px, 100vw);
  max-width: 420px;
  height: 100%;
  height: 100dvh;
  display: flex;
  flex-direction: column;
  background: #fff;
  box-shadow: -8px 0 32px rgba(0, 0, 0, 0.18);
  transform: translateX(100%);
  transition: transform 0.28s ease;
  z-index: 2001;
}

.oc-cart-drawer.is-open .oc-cart-drawer__panel {
  transform: translateX(0);
}

body.oc-cart-drawer-open {
  overflow: hidden;
}

.oc-cart-drawer__header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 18px 20px;
  border-bottom: 1px solid #e8edf5;
}

.oc-cart-drawer__header h2 {
  margin: 0;
  font-size: 1.25rem;
  font-weight: 700;
  color: #0e1d34;
}

.oc-cart-drawer__close {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 36px;
  height: 36px;
  border: 0;
  border-radius: 50%;
  background: #f3f6fc;
  color: #0e1d34;
  cursor: pointer;
}

.oc-cart-drawer__body {
  flex: 1 1 auto;
  overflow-y: auto;
  padding: 16px 20px;
}

.oc-cart-drawer__loading,
.oc-cart-drawer__empty {
  padding: 2.5rem 0.5rem 2rem;
  text-align: center;
  color: #667085;
}

.oc-cart-drawer__empty {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  min-height: 16rem;
  gap: 0.65rem;
}

.oc-cart-drawer__empty-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 4.25rem;
  height: 4.25rem;
  margin-bottom: 0.35rem;
  border-radius: 50%;
  background: #f6eef3;
  color: #1fa2ff;
  font-size: 1.75rem;
}

.oc-cart-drawer__empty-title {
  margin: 0;
  font-size: 1.15rem;
  font-weight: 700;
  color: #0e1d34;
}

.oc-cart-drawer__empty-text {
  margin: 0 0 0.5rem;
  max-width: 16rem;
  font-size: 0.9rem;
  line-height: 1.45;
  color: #667085;
}

.oc-cart-drawer__empty-cta {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 11rem;
  padding: 0.7rem 1.25rem;
  font-weight: 700;
  text-decoration: none;
}

.oc-cart-drawer.is-empty .oc-cart-drawer__footer,
.oc-cart-drawer__footer[hidden] {
  display: none !important;
}

.oc-cart-drawer__list {
  list-style: none;
  margin: 0;
  padding: 0;
}

.oc-cart-drawer__item {
  display: flex;
  gap: 14px;
  padding: 16px 0;
  border-bottom: 1px solid #eef2f8;
  transition: opacity 0.2s ease;
}

.oc-cart-drawer__item.is-updating {
  opacity: 0.55;
  pointer-events: none;
}

.oc-cart-drawer__body.is-updating {
  pointer-events: none;
}

.oc-cart-drawer__item:last-child {
  border-bottom: 0;
}

.oc-cart-drawer__item-image {
  flex: 0 0 72px;
  display: block;
  line-height: 0;
}

.oc-cart-drawer__item-image--placeholder {
  width: 72px;
  height: 72px;
  border-radius: 8px;
  background: linear-gradient(135deg, #eef2f8 0%, #dce4ef 100%);
  border: 1px solid #e8edf5;
}

.oc-cart-drawer__item-image img {
  width: 72px;
  height: 72px;
  object-fit: cover;
  border-radius: 8px;
  background: #f3f6fc;
  border: 1px solid #e8edf5;
}

.oc-cart-drawer__item-content {
  flex: 1 1 auto;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 0.65rem;
}

.oc-cart-drawer__item-top {
  display: flex;
  align-items: flex-start;
  gap: 0.5rem;
}

.oc-cart-drawer__item-body {
  flex: 1 1 auto;
  min-width: 0;
}

.oc-cart-drawer__item-title {
  display: block;
  font-weight: 700;
  color: #0e1d34;
  text-decoration: none;
  line-height: 1.35;
  margin-bottom: 0.15rem;
}

.oc-cart-drawer__item-title:hover {
  color: #1fa2ff;
}

.oc-cart-drawer__item-brand {
  display: block;
  color: #1fa2ff;
  font-size: 0.68rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  margin-bottom: 0.15rem;
}

.oc-cart-drawer__item-meta {
  display: block;
  font-size: 0.78rem;
  color: #667085;
  line-height: 1.35;
}

.oc-cart-drawer__remove {
  flex-shrink: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 2rem;
  height: 2rem;
  padding: 0;
  border: 1px solid #f0d4df;
  border-radius: 8px;
  background: #fff5f8;
  color: #1fa2ff;
  font-size: 0.95rem;
  line-height: 1;
  cursor: pointer;
  transition: background 0.2s ease, color 0.2s ease, border-color 0.2s ease;
}

.oc-cart-drawer__remove:hover {
  background: #1fa2ff;
  border-color: #1fa2ff;
  color: #fff;
}

.oc-cart-drawer__item-footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
}

.oc-cart-drawer__qty {
  flex-shrink: 0;
}

.oc-cart-drawer__item-prices {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 0.1rem;
  margin-left: auto;
}

.oc-cart-drawer__item-unit {
  font-size: 0.75rem;
  color: #667085;
}

.oc-cart-drawer__subtotal strong {
  font-size: 1.125rem;
  text-align: right;
  min-width: 6rem;
  font-variant-numeric: tabular-nums;
}

.oc-cart-drawer__footer {
  padding: 16px 20px 20px;
  border-top: 1px solid #e8edf5;
  background: #fafbfd;
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.oc-cart-drawer__actions {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
}

.oc-cart-drawer__continue {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0.5rem 1rem;
  font-weight: 700;
  text-decoration: none;
  font-size: 0.9rem;
  cursor: pointer;
}

.oc-cart-drawer__subtotal {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 12px;
  font-size: 1rem;
  color: #0e1d34;
}

/* Nav cart button - icon only, badge on top-right (fixed box, no layout jump) */
.oc-site-header .header-cart--nav {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 40px;
  width: 40px;
  height: 40px;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  color: #fff;
  cursor: pointer;
  position: relative;
  line-height: 1;
  font-size: 1.35rem;
  overflow: visible;
  transform-origin: center center;
}

.oc-site-header .header-cart--nav:hover,
.oc-site-header .header-cart--nav:focus {
  background: transparent;
  color: #f0c040;
}

.oc-site-header .header-cart--nav .header-cart-count {
  position: absolute;
  top: -2px;
  right: -2px;
  box-sizing: border-box;
  min-width: 18px;
  height: 18px;
  padding: 0 5px;
  border-radius: 999px;
  background: #e31e24;
  color: #fff;
  font-size: 11px;
  font-weight: 700;
  line-height: 18px;
  text-align: center;
  pointer-events: none;
}

.oc-site-header .header-cart--nav .header-cart-count[hidden] {
  display: block !important;
  opacity: 0;
  transform: scale(0);
}

.oc-site-header__utils.header-actions {
  flex: 0 0 auto;
  min-width: 7.25rem;
  gap: 0.25rem;
}

.header-cart-toggle {
  background: transparent;
  border: 0;
  cursor: pointer;
}

.button--add-to-cart,
.oc-add-to-cart-submit {
  position: relative;
  overflow: hidden;
  transition: background-color 0.25s ease, border-color 0.25s ease, color 0.25s ease, transform 0.2s ease, box-shadow 0.25s ease;
}

.button--add-to-cart.is-adding,
.oc-add-to-cart-submit.is-adding {
  transform: scale(0.94);
  box-shadow: 0 0 0 3px rgba(128, 33, 81, 0.28);
  pointer-events: none;
}

.button--add-to-cart.is-added,
.oc-add-to-cart-submit.is-added {
  background-color: #198754 !important;
  border-color: #198754 !important;
  color: #fff !important;
  animation: oc-btn-success 0.55s cubic-bezier(0.34, 1.45, 0.64, 1);
  box-shadow: 0 8px 20px rgba(25, 135, 84, 0.28);
}

.button--add-to-cart.is-added:hover,
.oc-add-to-cart-submit.is-added:hover {
  background-color: #157347 !important;
  border-color: #157347 !important;
}

/* Flying product thumbnail → cart icon */
.oc-cart-flyer {
  position: fixed;
  z-index: 10050;
  border-radius: 50%;
  overflow: hidden;
  pointer-events: none;
  border: 2px solid #fff;
  box-shadow:
    0 14px 32px rgba(22, 33, 62, 0.38),
    0 0 0 4px rgba(128, 33, 81, 0.22);
  background: #fff;
  will-change: transform, opacity;
  opacity: 1;
  transform: translate3d(0, 0, 0) scale(1);
}

.oc-cart-flyer img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.oc-cart-flyer--dot {
  border-radius: 50%;
  background: radial-gradient(circle at 30% 30%, #b84a7d, #802151 55%, #5a1739);
  border-color: #f3d5e4;
  box-shadow: 0 10px 22px rgba(128, 33, 81, 0.45);
}

.oc-cart-flyer.is-flying {
  animation: oc-cart-fly-fallback 0.86s cubic-bezier(0.2, 0.7, 0.2, 1) forwards;
}

@keyframes oc-cart-fly-fallback {
  0% {
    opacity: 1;
    transform: translate3d(0, 0, 0) scale(1) rotate(0deg);
  }
  48% {
    opacity: 1;
    transform: translate3d(var(--oc-fly-mx, 40%), var(--oc-fly-my, -80px), 0) scale(0.9) rotate(-12deg);
  }
  100% {
    opacity: 0.2;
    transform: translate3d(var(--oc-fly-x, 0), var(--oc-fly-y, 0), 0) scale(0.16) rotate(18deg);
  }
}

@keyframes oc-cart-bounce {
  0% {
    transform: scale(1, 1) rotate(0deg);
  }
  18% {
    transform: scale(1.22, 0.82) rotate(-6deg);
  }
  38% {
    transform: scale(0.86, 1.2) rotate(8deg);
  }
  58% {
    transform: scale(1.12, 0.92) rotate(-5deg);
  }
  78% {
    transform: scale(0.96, 1.05) rotate(3deg);
  }
  100% {
    transform: scale(1, 1) rotate(0deg);
  }
}

@keyframes oc-cart-await-wiggle {
  0%,
  100% {
    transform: rotate(0deg) scale(1);
  }
  35% {
    transform: rotate(-9deg) scale(1.06);
  }
  70% {
    transform: rotate(8deg) scale(1.04);
  }
}

@keyframes oc-cart-await-ring {
  0% {
    opacity: 0.85;
    transform: scale(0.72);
  }
  100% {
    opacity: 0;
    transform: scale(1.35);
  }
}

@keyframes oc-cart-ripple {
  0% {
    opacity: 0.95;
    transform: scale(0.55);
    box-shadow: 0 0 0 0 rgba(128, 33, 81, 0.4);
  }
  70% {
    opacity: 0.35;
    transform: scale(1.45);
    box-shadow: 0 0 0 10px rgba(128, 33, 81, 0);
  }
  100% {
    opacity: 0;
    transform: scale(1.7);
    box-shadow: 0 0 0 0 rgba(128, 33, 81, 0);
  }
}

@keyframes oc-badge-pop {
  0% {
    transform: scale(0.2);
  }
  55% {
    transform: scale(1.4);
  }
  78% {
    transform: scale(0.92);
  }
  100% {
    transform: scale(1);
  }
}

@keyframes oc-btn-success {
  0% {
    transform: scale(1);
  }
  35% {
    transform: scale(1.06);
  }
  60% {
    transform: scale(0.97);
  }
  100% {
    transform: scale(1);
  }
}

@media (prefers-reduced-motion: reduce) {
  .oc-cart-flyer,
  .header-cart.is-cart-pulse,
  .header-cart--nav.is-cart-pulse,
  .header-cart.is-cart-await i,
  .header-cart--nav.is-cart-await i,
  .header-cart.is-cart-await::before,
  .header-cart--nav.is-cart-await::before,
  .header-cart-count.is-pop,
  .oc-cart-catch-ripple.is-active,
  .button--add-to-cart.is-added,
  .oc-add-to-cart-submit.is-added {
    animation: none !important;
    transition: none !important;
  }
}

.oc-free-ship {
  margin: 0 0 0.85rem;
  padding: 0.7rem 0.8rem;
  background: #f7faf8;
  border: 1px solid #d7e8dc;
  border-radius: 10px;
}

.oc-free-ship.is-qualified {
  background: #eef8f1;
  border-color: #b7dfc4;
}

.oc-free-ship__message {
  margin: 0 0 0.45rem;
  font-size: 0.85rem;
  font-weight: 600;
  color: #1f4d33;
  line-height: 1.35;
}

.oc-free-ship__track {
  height: 6px;
  background: #dce8e0;
  border-radius: 999px;
  overflow: hidden;
}

.oc-free-ship__fill {
  display: block;
  height: 100%;
  background: #2f8f57;
  border-radius: 999px;
  transition: width 0.25s ease;
}

.oc-free-ship.is-qualified .oc-free-ship__fill {
  background: #1f7a45;
}

/* OcMono shop catalog - left sidebar + product grid */

:root {
  --ocmono-accent: var(--brand-primary);
  --ocmono-dark: #111111;
  --ocmono-muted: #707070;
  --ocmono-border: #ebebeb;
  --ocmono-bg: #f6f6f6;
}

/* ---------- Product card ---------- */
.shop-product-card {
  display: block;
  height: 100%;
  padding: 0;
  overflow: hidden;
  background: #fff;
  border: 1px solid var(--ocmono-border);
  border-radius: 0;
  box-shadow: none;
  transition: border-color 0.2s ease;
}

.shop-product-card:hover {
  box-shadow: none;
  transform: none;
  border-color: #d0d0d0;
}

.shop-product-card__inner,
.shop-product-card .card-body {
  padding: 0 !important;
  height: 100%;
  display: flex;
  flex-direction: column;
}

.shop-product-card__media {
  position: relative;
  width: 100%;
  aspect-ratio: 1 / 1;
  overflow: hidden;
  background: #fff;
  border-bottom: 1px solid var(--ocmono-border);
}

.shop-product-card__badge {
  position: absolute;
  z-index: 4;
  top: 10px;
  padding: 5px 8px;
  font-size: 12px;
  font-weight: 500;
  line-height: 1;
  text-transform: capitalize;
  color: #fff;
  border-radius: 0;
}

.shop-product-card__badge.top-left {
  left: 10px;
  right: auto;
}

.shop-product-card__badge.top-right {
  right: 10px;
  left: auto;
}

.shop-product-card__badge--danger {
  background: var(--ocmono-accent);
}

.shop-product-card__badge--warning {
  background: #10a341;
}

.shop-product-card__badge--offer {
  background: var(--ocmono-accent, #c45c26);
  color: #fff;
  text-transform: uppercase;
  letter-spacing: 0.02em;
}

.shop-product-card__price {
  font-size: 14px;
  font-weight: 400;
  color: #666;
  line-height: 1.4;
  display: inline-flex;
  align-items: baseline;
  gap: 0.4rem;
  flex-wrap: wrap;
}

.shop-product-card__compare-price {
  text-decoration: line-through;
  color: #999;
  font-weight: 400;
}

.shop-product-card__sale-price {
  color: #222;
  font-weight: 600;
}

.shop-product-card__image-link {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
  padding: 0;
  margin: 0;
  box-sizing: border-box;
  line-height: 0;
}

.shop-product-card__image {
  display: block;
  width: 100%;
  height: 100%;
  margin: 0;
  object-fit: contain;
  object-position: center;
  transition: transform 0.45s ease;
  will-change: transform;
}

.shop-product-card__hover-actions {
  position: absolute;
  inset: 0;
  z-index: 3;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.75rem;
  background: rgba(255, 255, 255, 0.55);
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transition: opacity 0.3s ease, visibility 0.3s ease;
}

.shop-product-card:hover .shop-product-card__hover-actions,
.shop-product-card:focus-within .shop-product-card__hover-actions {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
}

.shop-product-card:hover .shop-product-card__image,
.shop-product-card:focus-within .shop-product-card__image {
  transform: scale(1.08);
}

.shop-product-card__hover-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 44px;
  height: 44px;
  padding: 0;
  border: 1px solid #e5e5e5;
  border-radius: 50%;
  background: #fff;
  color: #111;
  text-decoration: none;
  cursor: pointer;
  box-shadow: 0 4px 14px rgba(0, 0, 0, 0.08);
  transition: background-color 0.25s ease, border-color 0.25s ease, color 0.25s ease, transform 0.25s ease;
}

.shop-product-card__hover-btn i {
  font-size: 1.1rem;
  line-height: 1;
}

.shop-product-card__hover-btn:hover,
.shop-product-card__hover-btn:focus {
  background: var(--ocmono-accent);
  border-color: var(--ocmono-accent);
  color: #fff;
  transform: translateY(-1px);
}

.shop-product-card__image-placeholder {
  display: block;
  width: 100%;
  height: 100%;
  background: linear-gradient(135deg, #f6f6f6 0%, #ebebeb 100%);
}

.shop-product-card__body {
  display: flex;
  flex: 1 1 auto;
  flex-direction: column;
  padding: 12px 14px 14px;
  gap: 8px;
  min-height: 0;
}

.shop-product-card__title {
  margin: 0 !important;
  padding: 0 !important;
  font-size: 15px;
  font-weight: 600;
  line-height: 1.4;
  min-height: 0;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.shop-product-card__title a {
  color: var(--ocmono-dark);
  text-decoration: none;
  font-weight: 600;
}

.shop-product-card__title a:hover {
  color: var(--ocmono-accent);
}

.shop-product-card__brand {
  margin: 0;
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0.04em;
  line-height: 1.3;
  color: var(--ocmono-muted);
  text-transform: uppercase;
}

.shop-product-card__short {
  margin: 0;
  padding: 0;
  font-size: 12px;
  font-weight: 400;
  line-height: 1.45;
  color: #707070;
  min-height: 0;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.shop-product-card__benefits {
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  margin: 0;
  padding: 0;
  list-style: none;
  min-height: 0;
  color: #707070;
  font-size: 12px;
  font-weight: 400;
  line-height: 1.45;
}

.shop-product-card__benefit {
  display: inline;
  margin: 0;
  padding: 0;
  border: 0;
  background: transparent;
  color: inherit;
  font-size: inherit;
  font-weight: inherit;
  line-height: inherit;
  white-space: normal;
}

.shop-product-card__benefit:not(:last-child)::after {
  content: "\00a0| ";
  color: #a0a8b4;
}

.shop-product-card__brand .field,
.shop-product-card__brand .field__item,
.shop-product-card__brand a {
  margin: 0;
  padding: 0;
  color: inherit;
  text-decoration: none;
  text-transform: uppercase;
  font-weight: inherit;
  font-size: inherit;
  letter-spacing: inherit;
  line-height: inherit;
}

.shop-product-card__attributes {
  margin: 0;
}

.shop-product-card__attributes-list {
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.shop-product-card__attribute {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 0;
  margin: 0;
  padding: 3px 8px;
  border: 1px solid #e2e2e2;
  background: #fff;
  color: #444;
  font-size: 11px;
  font-weight: 600;
  line-height: 1.3;
}

.shop-product-card__buy {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 0.5rem;
  margin-top: auto;
  padding-top: 10px;
  width: 100%;
}

.shop-product-card__buy--has-attributes {
  display: grid;
  grid-template-columns: 1fr auto;
  grid-template-areas:
    "attrs attrs"
    "price cart";
  align-items: center;
  column-gap: 0.5rem;
  row-gap: 8px;
}

.shop-product-card__buy--has-attributes .shop-product-card__price {
  grid-area: price;
}

.shop-product-card__buy--has-attributes .shop-product-card__purchase {
  display: contents;
  margin: 0;
}

.shop-product-card__buy--has-attributes .shop-product-card__purchase form {
  display: contents;
}

.shop-product-card__purchase {
  display: flex;
  align-items: center;
  margin: 0 0 0 auto;
  min-height: 0;
  padding: 0;
}

.shop-product-card__purchase form {
  display: flex;
  align-items: center;
  margin: 0;
}

.shop-product-card__purchase .field,
.shop-product-card__purchase .field__item,
.shop-product-card__purchase .js-form-wrapper,
.shop-product-card__purchase .form-actions {
  margin: 0 !important;
  padding: 0 !important;
}

/* Keep quantity hidden on grid; show size/attribute selector. */
.shop-product-card__purchase .field--name-quantity {
  display: none !important;
}

.shop-product-card__purchase .field--name-purchased-entity,
.shop-product-card__purchase #edit-purchased-entity-wrapper,
.shop-product-card__purchase .attribute-widgets {
  grid-area: attrs;
  display: block !important;
  width: 100%;
}

.shop-product-card__buy:not(.shop-product-card__buy--has-attributes) .field--name-purchased-entity,
.shop-product-card__buy:not(.shop-product-card__buy--has-attributes) #edit-purchased-entity-wrapper,
.shop-product-card__buy:not(.shop-product-card__buy--has-attributes) .attribute-widgets {
  display: none !important;
}

.shop-product-card__purchase .field--name-purchased-entity > label,
.shop-product-card__purchase .attribute-widgets label,
.shop-product-card__purchase .form-item-purchased-entity label {
  display: block;
  margin: 0 0 4px;
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.03em;
  text-transform: uppercase;
  color: var(--ocmono-muted);
  line-height: 1.2;
}

.shop-product-card__purchase .attribute-widgets .form-item,
.shop-product-card__purchase .field--name-purchased-entity .form-item {
  margin: 0 !important;
}

.shop-product-card__purchase select,
.shop-product-card__purchase .form-select {
  display: block;
  width: 100%;
  max-width: 100%;
  height: 34px;
  padding: 4px 28px 4px 10px;
  border: 1px solid var(--ocmono-border);
  border-radius: 0;
  background-color: #fff;
  color: var(--ocmono-dark);
  font-size: 12px;
  line-height: 1.3;
  appearance: none;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath fill='%23707070' d='M1 1l5 5 5-5'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 10px center;
  background-size: 10px;
}

.shop-product-card__purchase .form-actions {
  grid-area: cart;
  display: flex !important;
  align-items: center;
  justify-content: flex-end;
}

.shop-product-card__sold-out {
  grid-area: cart;
  display: inline-block;
  margin: 0;
  padding: 0;
  min-height: 0;
  border: 0;
  background: transparent;
  color: #9a3d4a;
  font-size: 12px;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.02em;
}

.shop-product-card__attributes {
  margin: 2px 0 0;
  padding: 0;
  font-size: 12px;
  font-weight: 500;
  line-height: 1.35;
  color: var(--ocmono-muted);
}

.shop-product-card__attributes-list {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.shop-product-card__attribute {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 2.5rem;
  margin: 0;
  padding: 4px 10px;
  border: 1px solid #e2e2e2;
  background: #fff;
  color: #222;
  font-size: 12px;
  font-weight: 600;
  line-height: 1.2;
  letter-spacing: 0.01em;
}

/* OcMono circular cart button */
.shop-product-card__purchase .button--add-to-cart,
.shop-product-card__purchase .oc-add-to-cart-submit,
.shop-product-card__cart-btn,
.shop-product-card__purchase .pro-btn {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  width: 40px !important;
  min-width: 40px !important;
  max-width: 40px !important;
  height: 40px !important;
  min-height: 40px !important;
  padding: 0 !important;
  margin: 0 !important;
  border: 0 !important;
  border-radius: 50% !important;
  background: #f6f6f6 !important;
  color: transparent !important;
  font-size: 0 !important;
  line-height: 0 !important;
  text-indent: -9999px;
  overflow: hidden;
  cursor: pointer;
  box-shadow: none !important;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23111111' stroke-width='2'%3E%3Cpath d='M6 6h15l-1.5 9h-12z'/%3E%3Cpath d='M6 6L5 3H2'/%3E%3Ccircle cx='9' cy='20' r='1'/%3E%3Ccircle cx='18' cy='20' r='1'/%3E%3C/svg%3E") !important;
  background-repeat: no-repeat !important;
  background-position: center !important;
  background-size: 18px !important;
  transition: background-color 0.25s ease;
}

.shop-product-card__purchase .button--add-to-cart:hover,
.shop-product-card__purchase .oc-add-to-cart-submit:hover,
.shop-product-card__cart-btn:hover,
.shop-product-card__purchase .pro-btn:hover {
  background-color: var(--ocmono-accent) !important;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23ffffff' stroke-width='2'%3E%3Cpath d='M6 6h15l-1.5 9h-12z'/%3E%3Cpath d='M6 6L5 3H2'/%3E%3Ccircle cx='9' cy='20' r='1'/%3E%3Ccircle cx='18' cy='20' r='1'/%3E%3C/svg%3E") !important;
}

/* ---------- Layout / sidebar ---------- */
.shop-catalog--ocmono {
  padding-top: 0;
}

.shop-catalog__layout.row {
  --bs-gutter-x: 24px;
  --bs-gutter-y: 0;
  margin-left: calc(var(--bs-gutter-x) * -0.5);
  margin-right: calc(var(--bs-gutter-x) * -0.5);
}

.shop-catalog__layout.row > [class*="col-"] {
  padding-left: calc(var(--bs-gutter-x) * 0.5);
  padding-right: calc(var(--bs-gutter-x) * 0.5);
}

.shop-catalog--ocmono .shop-catalog__sidebar {
  padding-right: calc(var(--bs-gutter-x) * 0.5);
}

@media (min-width: 992px) {
  .shop-catalog__layout.row > .shop-catalog__sidebar {
    flex: 0 0 240px;
    width: 240px;
    max-width: 240px;
  }

  .shop-catalog__layout.row > .shop-catalog__main {
    flex: 1 1 0;
    width: auto;
    max-width: none;
  }
}

.shop-sidebar-panel {
  position: sticky;
  top: 6.5rem;
  background: transparent;
  border: 0;
  border-radius: 0;
  box-shadow: none;
  overflow: visible;
}

/* Powered by AI Doc Hair badge */
.oc-ai-doc-badge {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.4rem;
  margin: 0 0 1rem;
  width: 100%;
  overflow: visible;
}

.oc-ai-doc-badge__link {
  display: block;
  width: 100%;
  max-width: 180px;
  margin: 0 auto;
  line-height: 0;
  border-radius: 50%;
  overflow: visible;
  transition: transform 0.2s ease, filter 0.2s ease;
}

.oc-ai-doc-badge__link:hover,
.oc-ai-doc-badge__link:focus-visible {
  transform: scale(1.02);
  filter: drop-shadow(0 6px 14px rgba(0, 0, 0, 0.16));
  outline: none;
}

.oc-ai-doc-badge__img {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 1 / 1;
  max-width: 100%;
  border-radius: 50%;
  object-fit: contain;
  background: transparent;
}

.oc-ai-doc-badge__caption {
  margin: 0;
  font-size: 0.72rem;
  font-weight: 600;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: #6b7280;
  text-align: center;
}

.oc-ai-doc-badge--sidebar {
  padding: 0.85rem 0.65rem 1rem;
  margin: 0 0 0.85rem;
  border-bottom: 0;
  border-radius: 12px;
  background: #f3f4f6;
}

.oc-ai-doc-badge--sidebar .oc-ai-doc-badge__link {
  max-width: 168px;
}

.oc-ai-doc-badge--product {
  align-items: flex-start;
  flex-direction: row;
  gap: 0.85rem;
  margin: 0 0 1.35rem;
  padding: 0.7rem 0.9rem;
  background: #f8f6f7;
  border-radius: 0;
  border-left: 3px solid #1fa2ff;
}

.oc-ai-doc-badge--product .oc-ai-doc-badge__link {
  margin: 0;
  max-width: 72px;
  flex: 0 0 72px;
}

.oc-ai-doc-badge--product .oc-ai-doc-badge__copy {
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 0.15rem;
  min-width: 0;
}

.oc-ai-doc-badge--product .oc-ai-doc-badge__caption {
  text-align: left;
  color: #374151;
  font-size: 0.8rem;
  letter-spacing: 0.02em;
  text-transform: none;
  font-weight: 600;
}

.oc-ai-doc-badge--product .oc-ai-doc-badge__hint {
  margin: 0;
  font-size: 0.78rem;
  line-height: 1.4;
  color: #6b7280;
}

@media (max-width: 991.98px) {
  .oc-ai-doc-badge--sidebar .oc-ai-doc-badge__link {
    max-width: 148px;
  }
}

.shop-catalog__categories.sidbar-widget,
.shop-catalog__filters.search-filter,
.shop-facets.sidbar-widget {
  padding: 12px 0 0;
}

.shop-catalog__sidebar-heading.title,
.shop-facets__heading.title,
.sidbar-widget .title {
  position: relative;
  display: block;
  margin: 0 0 14px;
  padding: 0 0 14px;
  font-size: 17px;
  font-weight: 700;
  color: var(--ocmono-dark);
  text-transform: capitalize;
  letter-spacing: 0;
  border-bottom: 1px solid var(--ocmono-border);
}

.shop-catalog__sidebar-heading.title::before,
.shop-facets__heading.title::before,
.sidbar-widget .title::before {
  content: "";
  position: absolute;
  left: 0;
  bottom: -1px;
  width: 60px;
  height: 2px;
  background: var(--ocmono-accent);
}

.shop-facets__title.sub-title,
.sidbar-widget .sub-title {
  margin: 0 0 12px;
  padding: 8px 0 0;
  font-size: 16px;
  font-weight: 600;
  color: var(--ocmono-dark);
  text-transform: capitalize;
}

.shop-facets--ocmono .shop-facets__group {
  margin: 0;
  padding: 0;
  border: 0;
}

.shop-facets--brand-only .shop-facets__group--brand {
  margin: 0;
  padding: 0;
}

.shop-facets__reset-wrap {
  margin-top: 16px;
  padding-top: 14px;
  border-top: 1px solid var(--ocmono-border);
}

.shop-facets__reset {
  display: block;
  width: 100%;
  padding: 10px 16px;
  font-size: 12px;
  font-weight: 700;
  line-height: 1.3;
  text-align: center;
  text-decoration: none !important;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  cursor: pointer;
  transition: color 0.2s ease, border-color 0.2s ease, background-color 0.2s ease;
}

/* Category nav — OcMono blog-ctry style */
.shop-category-nav__list {
  display: block;
  margin: 0;
  padding: 0;
  list-style: none;
}

.shop-category-nav__item {
  margin: 0;
  list-style: none;
}

.shop-category-nav__item a,
.shop-category-nav__item span {
  position: relative;
  display: block;
  padding: 0;
  font-size: 14px;
  font-weight: 400;
  line-height: 26px;
  color: #565656;
  text-decoration: none;
  text-transform: capitalize;
  background: transparent;
  border: 0;
  border-radius: 0;
}

.shop-category-nav__item a:hover,
.shop-category-nav__item a.is-active {
  color: var(--ocmono-accent);
  background: transparent;
  border: 0;
}

/* OcMono custom checkboxes — scroll when list is long */
.shop-facets__options--list {
  max-height: 220px;
  overflow-x: hidden;
  overflow-y: auto;
  padding: 0 4px 0 0;
  scrollbar-width: thin;
  scrollbar-color: #c8c8d8 transparent;
}

.shop-facets__options--list::-webkit-scrollbar {
  width: 4px;
}

.shop-facets__options--list::-webkit-scrollbar-track {
  background: transparent;
}

.shop-facets__options--list::-webkit-scrollbar-thumb {
  background: #c8c8d8;
  border-radius: 4px;
}

.shop-facets__options--list .form-checkboxes,
.shop-facets__options--list .checkbox,
.shop-facets__options--list .shop-facets__checkboxes {
  display: block;
  margin: 0;
  padding: 0;
}

.shop-facets__options--list .form-item,
.shop-facets__options--list .js-form-item,
.shop-facets__options--list .form-check,
.shop-facets__options--list .js-form-type-checkbox {
  display: block;
  position: relative;
  margin: 0 0 10px !important;
  padding: 0 !important;
  padding-left: 0 !important;
  min-height: 0 !important;
  border-radius: 0;
  background: transparent !important;
}

.shop-facets__options--list fieldset.shop-facets__checkboxes,
.shop-facets__options--list .fieldset-wrapper,
.shop-facets__options--list .checkbox {
  margin: 0 !important;
  padding: 0 !important;
  border: 0;
  min-width: 0;
}

.shop-facets__options--list .form-item:last-child,
.shop-facets__options--list .js-form-item:last-child,
.shop-facets__options--list .form-check:last-child,
.shop-facets__options--list .js-form-type-checkbox:last-child {
  margin-bottom: 0 !important;
}

.shop-facets__options--list input[type="checkbox"],
.shop-facets__options--list .form-check-input {
  position: absolute !important;
  opacity: 0 !important;
  width: 1px !important;
  height: 1px !important;
  margin: 0 !important;
  pointer-events: none;
}

.shop-facets__options--list .form-check-label,
.shop-facets__options--list label.option {
  position: relative;
  display: block;
  margin: 0;
  padding: 3px 0 3px 30px;
  font-size: 14px;
  font-weight: 400;
  line-height: 22px;
  color: #565656;
  text-transform: capitalize;
  cursor: pointer;
  user-select: none;
}

.shop-facets__options--list .form-check-label::before,
.shop-facets__options--list label.option::before {
  content: "";
  display: block;
  width: 15px;
  height: 15px;
  border: 1px solid var(--ocmono-border);
  border-radius: 3px;
  background: #fff;
  position: absolute;
  left: 0;
  top: 5px;
  opacity: 1;
}

.shop-facets__options--list .form-check-label:hover,
.shop-facets__options--list label.option:hover {
  color: var(--ocmono-accent);
}

.shop-facets__options--list .form-check-label:hover::before,
.shop-facets__options--list label.option:hover::before {
  border-color: var(--ocmono-accent);
}

.shop-facets__options--list input[type="checkbox"]:checked + .form-check-label,
.shop-facets__options--list input[type="checkbox"]:checked + label.option {
  color: var(--ocmono-accent);
  font-weight: 400;
}

.shop-facets__options--list input[type="checkbox"]:checked + .form-check-label::before,
.shop-facets__options--list input[type="checkbox"]:checked + label.option::before {
  width: 10px;
  height: 15px;
  top: -1px;
  left: 5px;
  border-radius: 0;
  border-color: var(--ocmono-accent);
  border-top-color: transparent;
  border-left-color: transparent;
  transform: rotate(45deg);
  background: transparent;
}

/* Toolbar */
.shop-catalog__toolbar.grid-nav-wraper,
.grid-nav-wraper.bg-lighten2 {
  display: block;
  margin-bottom: 30px;
  padding: 12px 20px;
  background-color: var(--ocmono-bg) !important;
  border: 0;
  border-radius: 0;
}

.shop-catalog__toolbar--ocmono .shop-catalog__toolbar-inner {
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  justify-content: space-between;
  gap: 12px 16px;
  width: 100%;
}

.shop-catalog__toolbar--ocmono .shop-catalog__toolbar-top {
  display: flex;
  flex: 1 1 auto;
  align-items: center;
  justify-content: flex-start;
  gap: 12px 16px;
  min-width: 0;
}

.shop-catalog__toolbar--ocmono .shop-catalog__toolbar-sort {
  display: inline-flex;
  flex: 0 1 auto;
  align-items: center;
  justify-content: flex-end;
  gap: 0.65rem;
  margin: 0;
  width: auto;
  max-width: 100%;
}

.shop-catalog__filters-toggle {
  display: none;
}

.shop-catalog__toolbar .row {
  margin: 0;
  align-items: center;
}

.shop-grid-nav .nav-pills {
  gap: 0.35rem;
  flex-wrap: wrap;
  margin: 0;
  padding: 0;
}

.shop-grid-nav .nav-item,
.shop-grid-nav .nav-pills > li {
  margin: 0;
  list-style: none;
}

.shop-grid-nav .nav-link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 2rem;
  min-height: 2rem;
  padding: 0.25rem 0.4rem;
  color: #111;
  background: transparent;
  border: 0;
  border-radius: 0;
  line-height: 1;
  cursor: pointer;
}

.shop-grid-nav .nav-link i {
  font-size: 1.15rem;
  line-height: 1;
}

.shop-grid-nav .nav-link.active,
.shop-grid-nav .nav-link:hover,
.shop-grid-nav .nav-link:focus {
  color: var(--ocmono-accent);
  background: transparent;
  box-shadow: none;
}

.shop-catalog__result-count.total-products {
  display: inline-block;
  margin: 0;
  padding: 0;
  font-size: 14px;
  font-weight: 500;
  line-height: 1.3;
  color: #5a6b82;
  text-transform: none;
  vertical-align: middle;
}

.shop-catalog__sort.shop-grid-button {
  display: inline-flex;
  align-items: center;
  justify-content: flex-end;
  flex-wrap: nowrap;
  gap: 0.65rem;
  margin: 0;
  width: auto;
  max-width: 100%;
}

.shop-catalog__sort .sort-by,
.shop-grid-button .sort-by {
  flex: 0 0 auto;
  margin: 0;
  font-size: 14px;
  font-weight: 500;
  color: var(--ocmono-dark);
  white-space: nowrap;
}

.shop-catalog__sort .form-select,
.shop-catalog__sort .custom-select,
.shop-grid-button .form-select {
  flex: 0 1 240px;
  max-width: 260px;
  min-height: 36px;
  height: 36px;
  padding: 0.25rem 2rem 0.25rem 0.75rem;
  font-size: 14px;
  color: #212529;
  background-color: #fff;
  border: 1px solid #ced4da;
  border-radius: 0.25rem;
}

/* Product grid - 3 cols full width; 4 cols when catalog has sidebar */
.shop-catalog__list {
  display: grid !important;
  grid-template-columns: repeat(1, minmax(0, 1fr));
  column-gap: 24px;
  row-gap: 24px;
  list-style: none !important;
  margin: 0 !important;
  padding: 0 !important;
  align-items: stretch;
}

@media (min-width: 576px) {
  .shop-catalog__list {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (min-width: 992px) {
  .shop-catalog__list {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    column-gap: 1.25rem;
    row-gap: 1.25rem;
  }

  .shop-catalog__layout .shop-catalog__main .shop-catalog__list {
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  }
}

/* Homepage Products - horizontal slider (overrides catalog grid !important). */
.oc-home-shop .shop-catalog__list,
.oc-home-shop ul.shop-catalog__list,
.oc-home-shop .shop-catalog--home .shop-catalog__list,
.shop-catalog--home .shop-catalog__list {
  display: flex !important;
  flex-wrap: nowrap !important;
  grid-template-columns: none !important;
  gap: 1.1rem;
  column-gap: 1.1rem;
  row-gap: 0;
  align-items: stretch;
  list-style: none !important;
  margin: 0 !important;
  padding: 0.35rem 2.85rem 0.5rem !important;
  overflow-x: auto !important;
  overflow-y: hidden;
  overscroll-behavior-x: contain;
  scroll-snap-type: x mandatory;
  scroll-behavior: smooth;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none !important;
}

.oc-home-shop .shop-catalog__list::-webkit-scrollbar,
.shop-catalog--home .shop-catalog__list::-webkit-scrollbar {
  display: none !important;
  height: 0 !important;
  width: 0 !important;
}

.oc-home-shop .shop-catalog__item,
.shop-catalog--home .shop-catalog__item {
  flex: 0 0 min(260px, 78vw) !important;
  width: min(260px, 78vw) !important;
  max-width: min(260px, 78vw) !important;
  scroll-snap-align: start;
  list-style: none;
  display: flex !important;
  flex-direction: column;
  align-self: stretch;
  height: auto !important;
}

.oc-home-shop .shop-catalog__item.is-cat-hidden,
.shop-catalog--home .shop-catalog__item.is-cat-hidden {
  display: none !important;
}

.oc-home-shop .shop-catalog__item > .shop-product-card,
.oc-home-shop .shop-catalog__item > article,
.shop-catalog--home .shop-catalog__item > .shop-product-card,
.shop-catalog--home .shop-catalog__item > article {
  flex: 1 1 auto;
  width: 100%;
  height: 100% !important;
}

@media (max-width: 991.98px) {
  .oc-home-shop .shop-catalog__item,
  .shop-catalog--home .shop-catalog__item {
    flex-basis: min(220px, 72vw) !important;
    width: min(220px, 72vw) !important;
    max-width: min(220px, 72vw) !important;
  }
}

/* List view - horizontal rows (image left, details right) */
.shop-catalog__content.grid-view-list .shop-catalog__list {
  display: grid !important;
  grid-template-columns: 1fr !important;
  column-gap: 1.25rem;
  row-gap: 1.25rem;
}

@media (min-width: 992px) {
  .shop-catalog__content.grid-view-list .shop-catalog__list {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }

  .shop-catalog__content.grid-view-list .shop-product-card__media {
    flex: 0 0 150px;
    width: 150px;
    max-width: 150px;
  }

  .shop-catalog__content.grid-view-list .shop-product-card__body {
    padding: 0.85rem 1rem;
  }
}

.shop-catalog__content.grid-view-list .shop-catalog__item {
  width: 100%;
}

.shop-catalog__content.grid-view-list .shop-product-card {
  padding: 0;
  height: auto;
  border: 1px solid #ececec;
  background: #fff;
}

.shop-catalog__content.grid-view-list .shop-product-card:hover {
  border-color: #d8dee8;
}

.shop-catalog__content.grid-view-list .shop-product-card__inner,
.shop-catalog__content.grid-view-list .shop-product-card .card-body {
  display: flex;
  flex-direction: row !important;
  align-items: stretch;
  gap: 0;
  text-align: left;
  height: auto;
  min-height: 0;
  padding: 0 !important;
}

.shop-catalog__content.grid-view-list .shop-product-card__media {
  flex: 0 0 220px;
  width: 220px;
  height: 220px;
  max-width: 220px;
  max-height: 220px;
  margin: 0;
  aspect-ratio: 1 / 1;
  align-self: center;
  overflow: hidden;
  border-bottom: 0;
  border-right: 1px solid #ececec;
  background: #f5f5f5;
}

.shop-catalog__content.grid-view-list .shop-product-card__image-link {
  display: block;
  width: 100%;
  height: 100%;
}

.shop-catalog__content.grid-view-list .shop-product-card__image {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}

.shop-catalog__content.grid-view-list .shop-product-card__body {
  flex: 1 1 auto;
  display: flex;
  flex-direction: column;
  justify-content: center;
  min-width: 0;
  padding: 1rem 1.25rem;
  gap: 8px;
}

.shop-catalog__content.grid-view-list .shop-product-card__buy {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  margin-top: auto;
  padding-top: 10px;
  gap: 0.5rem;
}

.shop-catalog__content.grid-view-list .shop-product-card__purchase {
  margin-left: auto;
}

@media screen and (max-width: 767px) {
  .shop-catalog__content.grid-view-list .shop-product-card__inner,
  .shop-catalog__content.grid-view-list .shop-product-card .card-body {
    flex-direction: column;
  }

  .shop-catalog__content.grid-view-list .shop-product-card__media {
    flex: none;
    width: 100%;
    max-width: none;
    border-right: 0;
    border-bottom: 1px solid #ececec;
  }

  .shop-catalog__content.grid-view-list .shop-product-card__body {
    padding: 12px 14px 14px;
  }
}

.shop-catalog__item {
  list-style: none !important;
  margin: 0 !important;
  padding: 0 !important;
  display: flex;
  min-width: 0;
  height: auto;
  align-self: stretch;
}

.shop-catalog__item > .shop-product-card,
.shop-catalog__item > article {
  width: 100%;
  height: 100%;
  display: flex;
  flex-direction: column;
}

/* Keep homepage slider cards at fixed slide width (min-width:0 above would shrink them). */
.oc-home-shop .shop-catalog__item,
.shop-catalog--home .shop-catalog__item {
  min-width: min(260px, 78vw) !important;
}

@media (max-width: 991.98px) {
  .oc-home-shop .shop-catalog__item,
  .shop-catalog--home .shop-catalog__item {
    min-width: min(220px, 72vw) !important;
  }
}

.shop-catalog--ocmono .pager {
  margin-top: 40px;
  justify-content: center;
}

.shop-catalog--ocmono .pagination .page-link {
  border-radius: 0;
  color: var(--ocmono-dark);
  border-color: var(--ocmono-border);
  min-width: 2.5rem;
  text-align: center;
}

.shop-catalog--ocmono .pagination .page-item.active .page-link {
  background: var(--ocmono-accent);
  border-color: var(--ocmono-accent);
}

.shop-catalog__empty {
  padding: 2rem;
  text-align: center;
  color: var(--ocmono-muted);
}

.shop-category-term__description {
  margin-bottom: 1.5rem;
  color: #555;
}

@media screen and (max-width: 991px) {
  .shop-catalog__toolbar.grid-nav-wraper {
    padding: 10px 15px;
  }

  .shop-product-card__title {
    font-size: 14px;
  }

  .shop-sidebar-panel {
    position: static;
  }

  .shop-catalog--ocmono .shop-catalog__sidebar {
    margin-bottom: 1.5rem;
  }
}

/* Mobile / tablet shop catalog: filters drawer + compact inline toolbar */
@media (max-width: 1279px) {
  .shop-catalog__toolbar--ocmono.grid-nav-wraper {
    margin-bottom: 0;
    padding: 0;
    background: #fff !important;
    border-bottom: 1px solid #e8edf5;
  }

  .shop-catalog__toolbar--ocmono .shop-catalog__toolbar-inner {
    flex-direction: row;
    flex-wrap: nowrap;
    align-items: center;
    justify-content: space-between;
    gap: 8px 10px;
    padding: 10px 12px;
  }

  .shop-catalog__toolbar--ocmono .shop-catalog__toolbar-top {
    display: flex;
    flex: 1 1 auto;
    align-items: center;
    gap: 8px;
    width: auto;
    min-width: 0;
    margin-bottom: 0;
  }

  .shop-catalog__toolbar--ocmono .shop-catalog__filters-toggle {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.35rem;
    min-height: 36px;
    padding: 0 12px;
    border: 1px solid #d7dee8;
    border-radius: 8px;
    background: #fff;
    color: #0e1d34;
    font-size: 13px;
    font-weight: 600;
    line-height: 1;
    cursor: pointer;
    flex: 0 0 auto;
  }

  .shop-catalog__toolbar--ocmono .shop-catalog__result-count {
    margin: 0;
    font-size: 12px;
    font-weight: 500;
    color: #6b7a90;
    text-align: left;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }

  .shop-catalog__toolbar--ocmono .shop-catalog__toolbar-sort {
    display: inline-flex;
    flex: 0 1 190px;
    align-items: center;
    gap: 0;
    width: auto;
    min-width: 0;
  }

  .shop-catalog__toolbar--ocmono .shop-catalog__toolbar-sort .sort-by {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
  }

  .shop-catalog__toolbar--ocmono .shop-catalog__toolbar-sort .form-select {
    flex: 1 1 auto;
    width: 100%;
    min-width: 0;
    max-width: 190px;
    min-height: 36px;
    height: 36px;
    padding: 0 2rem 0 0.65rem;
    font-size: 12px;
    border: 1px solid #d7dee8;
    border-radius: 8px;
    background-color: #fff;
  }

  .shop-catalog--ocmono .shop-catalog__view-toggle .nav-item:not(.shop-catalog__filters-toggle-item) {
    display: none !important;
  }

  .shop-catalog__filters-toggle-item {
    display: list-item !important;
    margin-right: 0.35rem;
  }

  .shop-catalog__filters-toggle i {
    font-size: 14px;
    color: #1fa2ff;
  }

  .shop-catalog__filters-toggle:hover,
  .shop-catalog__filters-toggle:focus,
  .shop-catalog__filters-toggle[aria-expanded="true"] {
    border-color: #1fa2ff;
    background: #f3f9ff;
  }

  .shop-catalog__filters-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    position: sticky;
    top: 0;
    z-index: 2;
    margin: 0;
    padding: 14px 16px;
    background: #fff;
    border-bottom: 1px solid #eef2f7;
  }

  .shop-catalog__filters-title {
    font-size: 16px;
    font-weight: 700;
    color: #0e1d34;
  }

  .shop-catalog__filters-close {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    margin: 0;
    border: 0;
    border-radius: 10px;
    background: #f1f5fa;
    color: #0e1d34;
    cursor: pointer;
  }

  .shop-catalog__filters-close:hover,
  .shop-catalog__filters-close:focus {
    background: #e8eef6;
    color: #1fa2ff;
  }

  .shop-catalog__filters-backdrop {
    display: block;
    position: fixed;
    inset: 0;
    z-index: 1058;
    margin: 0;
    padding: 0;
    border: 0;
    background: rgba(14, 29, 52, 0.55);
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transition: opacity 0.25s ease, visibility 0.25s ease;
  }

  .shop-catalog__filters-backdrop.is-open {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
  }

  .shop-catalog__layout > .shop-catalog__sidebar,
  .shop-catalog--ocmono .shop-catalog__sidebar {
    position: fixed !important;
    top: 0;
    left: 0;
    bottom: 0;
    width: min(88vw, 320px) !important;
    max-width: min(88vw, 320px) !important;
    margin: 0 !important;
    padding: 0 !important;
    z-index: 1062;
    background: #fff;
    box-shadow: 8px 0 28px rgba(14, 29, 52, 0.18);
    transform: translate3d(-105%, 0, 0);
    transition: transform 0.28s cubic-bezier(0.25, 0.46, 0.45, 0.94);
    overflow: hidden;
  }

  .shop-catalog__sidebar.is-open {
    transform: translate3d(0, 0, 0);
  }

  .shop-catalog__filters-sheet {
    display: flex;
    flex-direction: column;
    height: 100%;
    max-height: 100dvh;
    overflow: hidden;
    background: #fff;
  }

  .shop-catalog__sidebar .shop-sidebar-panel {
    position: static;
    flex: 1 1 auto;
    overflow-x: hidden;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
    overscroll-behavior: contain;
    padding: 4px 16px calc(88px + env(safe-area-inset-bottom, 0px));
  }

  body.oc-shop-filters-open {
    overflow: hidden;
  }

  .shop-catalog--ocmono .shop-catalog__content.grid-view .shop-catalog__list,
  .shop-catalog--ocmono .shop-catalog__content.grid-view-list .shop-catalog__list {
    display: grid !important;
    grid-template-columns: 1fr !important;
    column-gap: 0;
    row-gap: 0;
  }

  .shop-catalog--ocmono .shop-catalog__content.grid-view .shop-catalog__item,
  .shop-catalog--ocmono .shop-catalog__content.grid-view-list .shop-catalog__item {
    border-bottom: 1px solid #e8edf5;
  }

  .shop-catalog--ocmono .shop-catalog__content.grid-view .shop-catalog__item:last-child,
  .shop-catalog--ocmono .shop-catalog__content.grid-view-list .shop-catalog__item:last-child {
    border-bottom: 0;
  }

  .shop-catalog--ocmono .shop-catalog__content.grid-view .shop-product-card,
  .shop-catalog--ocmono .shop-catalog__content.grid-view-list .shop-product-card {
    padding: 12px 0;
    height: auto;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
  }

  .shop-catalog--ocmono .shop-catalog__content.grid-view .shop-product-card:hover,
  .shop-catalog--ocmono .shop-catalog__content.grid-view-list .shop-product-card:hover {
    border-color: transparent;
    box-shadow: none;
  }

  .shop-catalog--ocmono .shop-catalog__content.grid-view .shop-product-card__inner,
  .shop-catalog--ocmono .shop-catalog__content.grid-view .shop-product-card .card-body,
  .shop-catalog--ocmono .shop-catalog__content.grid-view-list .shop-product-card__inner,
  .shop-catalog--ocmono .shop-catalog__content.grid-view-list .shop-product-card .card-body {
    display: flex;
    flex-direction: row !important;
    align-items: center;
    gap: 0;
    text-align: left;
    height: auto;
    min-height: 0;
    padding: 0 !important;
  }

  .shop-catalog--ocmono .shop-catalog__content.grid-view .shop-product-card__media,
  .shop-catalog--ocmono .shop-catalog__content.grid-view-list .shop-product-card__media {
    flex: 0 0 120px;
    width: 120px;
    height: 120px;
    max-width: 120px;
    max-height: 120px;
    margin: 0;
    aspect-ratio: 1 / 1;
    align-self: center;
    overflow: hidden;
    border: 0;
    border-bottom: 0;
    border-right: 0;
    border-radius: 8px;
    background: #f5f5f5;
  }

  .shop-catalog--ocmono .shop-catalog__content.grid-view .shop-product-card__image-link,
  .shop-catalog--ocmono .shop-catalog__content.grid-view-list .shop-product-card__image-link {
    display: block;
    width: 100%;
    height: 100%;
  }

  .shop-catalog--ocmono .shop-catalog__content.grid-view .shop-product-card__image,
  .shop-catalog--ocmono .shop-catalog__content.grid-view-list .shop-product-card__image {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
  }

  .shop-catalog--ocmono .shop-catalog__content.grid-view .shop-product-card__body,
  .shop-catalog--ocmono .shop-catalog__content.grid-view-list .shop-product-card__body {
    flex: 1 1 auto;
    display: flex;
    flex-direction: column;
    justify-content: center;
    min-width: 0;
    padding: 0.75rem 0.9rem !important;
    gap: 6px;
  }

  .shop-catalog--ocmono .shop-catalog__content.grid-view .shop-product-card__buy,
  .shop-catalog--ocmono .shop-catalog__content.grid-view-list .shop-product-card__buy {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    margin-top: auto;
    padding-top: 6px;
    gap: 0.4rem;
  }
}

@media (min-width: 1280px) {
  .shop-catalog__toolbar--ocmono .shop-catalog__toolbar-top {
    justify-content: flex-start;
    gap: 16px;
  }

  .shop-catalog__toolbar--ocmono .shop-catalog__result-count {
    margin-right: 0.5rem;
  }

  .shop-catalog__toolbar--ocmono .shop-catalog__toolbar-sort {
    flex: 0 0 auto;
  }

  .shop-catalog__toolbar--ocmono .shop-catalog__toolbar-sort .form-select {
    flex: 0 1 220px;
    width: 220px;
  }

  .shop-catalog__filters-toggle-item,
  .shop-catalog__filters-head,
  .shop-catalog__filters-backdrop {
    display: none !important;
  }
}

@media (max-width: 480px) {
  .shop-catalog__toolbar--ocmono .shop-catalog__filters-toggle span {
    display: none;
  }

  .shop-catalog__toolbar--ocmono .shop-catalog__filters-toggle {
    min-width: 36px;
    padding: 0;
  }

  .shop-catalog__toolbar--ocmono .shop-catalog__toolbar-sort {
    flex: 1 1 120px;
    max-width: 160px;
  }

  .shop-catalog__toolbar--ocmono .shop-catalog__toolbar-sort .form-select {
    max-width: 100%;
  }
}

@media (max-width: 420px) {
  .shop-catalog--ocmono .shop-catalog__content.grid-view .shop-product-card__media,
  .shop-catalog--ocmono .shop-catalog__content.grid-view-list .shop-product-card__media {
    flex: 0 0 100px;
    width: 100px;
    height: 100px;
    max-width: 100px;
    max-height: 100px;
  }

  .shop-catalog--ocmono .shop-catalog__content.grid-view .shop-product-card__body,
  .shop-catalog--ocmono .shop-catalog__content.grid-view-list .shop-product-card__body {
    padding: 0.65rem 0.75rem !important;
  }
}


/* OcMono product gallery */

.path-product #main > .container,
body.path-product #content-inner.container,
.page-node-type-commerce-product #main > .container {
  padding-top: 2.5rem;
  padding-bottom: 4rem;
}

.commerce-product-gallery {
  position: relative;
}

.commerce-product-gallery--ocmono {
  display: flex;
  align-items: flex-start;
  gap: 12px;
}

.commerce-product-gallery--ocmono .commerce-product-gallery__thumbs-bar {
  flex: 0 0 84px;
  width: 84px;
  margin: 0;
  order: -1;
  max-height: 560px;
  overflow-x: hidden;
  overflow-y: auto;
  overscroll-behavior: contain;
  scrollbar-width: thin;
  scrollbar-color: #cfcfcf transparent;
}

.commerce-product-gallery--ocmono .commerce-product-gallery__thumbs-bar::-webkit-scrollbar {
  width: 4px;
}

.commerce-product-gallery--ocmono .commerce-product-gallery__thumbs-bar::-webkit-scrollbar-thumb {
  background: #cfcfcf;
  border-radius: 4px;
}

.commerce-product-gallery--ocmono .commerce-product-gallery__thumbs {
  display: flex;
  flex-direction: column;
  gap: 10px;
  list-style: none;
  margin: 0;
  padding: 0;
  width: 100%;
  height: auto;
}

.commerce-product-gallery--ocmono .commerce-product-gallery__thumb-item {
  flex: 0 0 auto;
  width: 100%;
  margin: 0;
}

.commerce-product-gallery--ocmono .commerce-product-gallery__thumb-btn {
  display: block;
  width: 100%;
  aspect-ratio: 1 / 1;
  height: auto;
  min-height: 0;
  padding: 0;
  border: 1px solid #ececec;
  background: #fff;
  overflow: hidden;
  cursor: pointer;
  opacity: 0.55;
  transition: opacity 0.3s ease, border-color 0.3s ease;
}

.commerce-product-gallery--ocmono .commerce-product-gallery__thumb-btn.is-active,
.commerce-product-gallery--ocmono .commerce-product-gallery__thumb-btn:hover {
  opacity: 1;
  border-color: #222;
}

.commerce-product-gallery--ocmono .commerce-product-gallery__thumb-btn img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.commerce-product-gallery--ocmono .commerce-product-gallery__thumbs-nav {
  display: none !important;
}

.commerce-product-gallery--ocmono .commerce-product-gallery__slider {
  position: relative;
  flex: 1 1 auto;
  min-width: 0;
  width: 100%;
  background: #fafafa;
  border: 0;
  border-radius: 0;
  overflow: hidden;
  margin-bottom: 0;
}

.commerce-product-gallery--ocmono .commerce-product-gallery__viewport {
  position: relative;
  width: 100%;
  aspect-ratio: 1 / 1;
  max-height: 560px;
  cursor: zoom-in;
  overflow: hidden;
  background: #f5f5f5;
}

.commerce-product-gallery__track {
  position: relative;
  width: 100%;
  height: 100%;
}

.commerce-product-gallery__slide {
  position: absolute;
  inset: 0;
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.35s ease;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0;
}

.commerce-product-gallery__slide.is-active {
  opacity: 1;
  visibility: visible;
}

.commerce-product-gallery__slide-img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.commerce-product-gallery__nav {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  z-index: 2;
  width: 42px;
  height: 42px;
  border: 0;
  border-radius: 0;
  background: #fff;
  color: #222;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.08);
  opacity: 0;
  transition: opacity 0.25s ease, background 0.25s ease, color 0.25s ease;
}

.commerce-product-gallery--ocmono .commerce-product-gallery__slider:hover .commerce-product-gallery__nav {
  opacity: 1;
}

.commerce-product-gallery__nav:hover {
  background: #222;
  color: #fff;
}

.commerce-product-gallery__nav--prev {
  left: 14px;
}

.commerce-product-gallery__nav--next {
  right: 14px;
}

.commerce-product-gallery__zoom-btn {
  position: absolute;
  top: 16px;
  right: 16px;
  z-index: 2;
  width: 46px;
  height: 46px;
  border: 0;
  border-radius: 0;
  background: #fff;
  color: #222;
  font-size: 1rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.08);
  transition: background 0.25s ease, color 0.25s ease;
}

.commerce-product-gallery__zoom-btn:hover {
  background: #222;
  color: #fff;
}

.commerce-product-gallery__counter {
  display: none;
}

.commerce-product-gallery__lightbox {
  position: fixed;
  inset: 0;
  z-index: 1050;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 1.5rem;
}

.commerce-product-gallery__lightbox[hidden] {
  display: none !important;
}

.commerce-product-gallery__lightbox.is-open {
  display: flex;
}

.commerce-product-gallery__lightbox-backdrop {
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, 0.85);
}

.commerce-product-gallery__lightbox-content {
  position: relative;
  z-index: 1;
  max-width: min(92vw, 1100px);
  max-height: 90vh;
}

.commerce-product-gallery__lightbox-img {
  display: block;
  max-width: 100%;
  max-height: 80vh;
  margin: 0 auto;
  object-fit: contain;
  cursor: zoom-in;
}

.commerce-product-gallery__lightbox-close {
  position: absolute;
  top: -2.5rem;
  right: 0;
  border: 0;
  background: transparent;
  color: #fff;
  font-size: 2rem;
  line-height: 1;
  cursor: pointer;
}

.commerce-product-gallery__lightbox-nav {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 44px;
  height: 44px;
  border: 0;
  border-radius: 50%;
  background: #fff;
  color: #222;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 1.2rem;
  cursor: pointer;
  box-shadow: 0 2px 12px rgba(0, 0, 0, 0.2);
}

.commerce-product-gallery__lightbox-nav--prev {
  left: 0;
}

.commerce-product-gallery__lightbox-nav--next {
  right: 0;
}

.commerce-product-gallery__lightbox-hint {
  text-align: center;
  color: rgba(255, 255, 255, 0.75);
  font-size: 0.85rem;
  margin-top: 0.75rem;
}

body.oc-product-lightbox-open {
  overflow: hidden;
}

@media (max-width: 991px) {
  .commerce-product-gallery--ocmono .commerce-product-gallery__viewport {
    max-height: none;
  }

  .commerce-product-gallery--ocmono .commerce-product-gallery__thumbs-bar {
    max-height: none;
  }
}

/* Mobile: full-width main image first, thumbnails underneath */
@media (max-width: 1279px) {
  .path-product #main > .container,
  body.path-product #content-inner.container,
  .page-node-type-commerce-product #main > .container {
    /* Match Bootstrap container side gutter so top gap equals left/right */
    padding-top: calc(var(--bs-gutter-x, 1.5rem) * 0.5);
  }

  .commerce-product--ocmono .commerce-product__layout {
    --bs-gutter-x: 0;
    margin-left: 0;
    margin-right: 0;
  }

  .commerce-product--ocmono .commerce-product__media,
  .commerce-product--ocmono .image-column {
    width: 100%;
    max-width: 100%;
    padding-left: 0 !important;
    padding-right: 0 !important;
    margin-bottom: 1rem;
  }

  .commerce-product--ocmono .commerce-product__summary,
  .commerce-product--ocmono .product-info {
    padding-left: 1rem;
    padding-right: 1rem;
  }

  .commerce-product-gallery--ocmono {
    flex-direction: column;
    align-items: stretch;
    gap: 12px;
    width: 100%;
  }

  .commerce-product-gallery--ocmono .commerce-product-gallery__slider {
    order: 0;
    flex: 0 0 auto;
    width: 100%;
    min-width: 0;
    min-height: 0;
  }

  .commerce-product-gallery--ocmono .commerce-product-gallery__viewport {
    width: 100%;
    max-height: none;
    aspect-ratio: 1 / 1;
    min-height: 280px;
  }

  .commerce-product-gallery--ocmono .commerce-product-gallery__thumbs-bar {
    order: 1;
    flex: 0 0 auto;
    width: 100%;
    max-width: 100%;
    max-height: none;
    align-self: stretch;
    overflow-x: auto;
    overflow-y: hidden;
    -webkit-overflow-scrolling: touch;
    padding: 0 12px;
    box-sizing: border-box;
  }

  .commerce-product-gallery--ocmono .commerce-product-gallery__thumbs {
    flex-direction: row;
    height: auto;
    width: max-content;
    min-width: 100%;
    gap: 10px;
  }

  .commerce-product-gallery--ocmono .commerce-product-gallery__thumb-item {
    flex: 0 0 72px;
    width: 72px;
  }

  .commerce-product-gallery--ocmono .commerce-product-gallery__thumb-btn {
    width: 72px;
    aspect-ratio: 1 / 1;
    height: auto;
    min-height: 0;
  }

  .commerce-product-gallery--ocmono .commerce-product-gallery__nav {
    opacity: 1;
  }
}

/* ===== Product summary + purchase ===== */
.commerce-product--ocmono {
  padding: 0 0 1rem;
}

.commerce-product--ocmono .commerce-product__layout {
  margin: 0;
}

.commerce-product--ocmono .product-info,
.commerce-product--ocmono .commerce-product__summary-inner {
  padding: 0;
  max-width: 34rem;
}

@media (min-width: 992px) {
  .commerce-product--ocmono .commerce-product__summary {
    display: flex;
    align-items: flex-start;
  }

  .commerce-product--ocmono .product-info,
  .commerce-product--ocmono .commerce-product__summary-inner {
    padding-left: 0.5rem;
    padding-top: 0.25rem;
  }
}

.commerce-product--ocmono .commerce-product__badge {
  display: inline-block;
  margin: 0 0.4rem 0.85rem 0;
  font-size: 0.68rem;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  padding: 0.28rem 0.55rem;
  line-height: 1;
}

.commerce-product__badge--new {
  background: #222;
  color: #fff;
}

.commerce-product__badge--offer {
  background: #1fa2ff;
  color: #fff;
}

.commerce-product--ocmono .commerce-product__title {
  display: block;
  font-size: clamp(1.35rem, 1.1rem + 0.7vw, 1.75rem);
  line-height: 1.28;
  font-weight: 600;
  color: #1a1a1a;
  margin: 0 0 0.85rem;
}

.commerce-product--ocmono .customer-review,
.commerce-product--ocmono .commerce-product__rating-row {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 0.55rem 0.75rem;
  margin: 0 0 1rem;
}

.commerce-product--ocmono .rating-box,
.commerce-product--ocmono .commerce-product__stars {
  display: inline-flex;
  gap: 0.12rem;
  list-style: none;
  margin: 0;
  padding: 0;
  color: #f0a500;
  font-size: 0.92rem;
  line-height: 1;
}

.commerce-product--ocmono .reviews a,
.commerce-product--ocmono .commerce-product__review-count {
  font-size: 0.9rem;
  color: #888;
  text-decoration: none;
}

.commerce-product--ocmono .reviews a:hover {
  color: #1fa2ff;
}

.commerce-product--ocmono .item-price,
.commerce-product--ocmono .commerce-product__price-row {
  display: flex;
  align-items: baseline;
  flex-wrap: wrap;
  gap: 0.55rem;
  margin: 0 0 1.15rem;
}

.commerce-product--ocmono .commerce-product__price {
  font-size: 1.25rem;
  font-weight: 600;
  color: #1a1a1a;
  letter-spacing: 0.01em;
}

.commerce-product--ocmono .commerce-product__compare-price {
  font-size: 0.95rem;
  color: #999;
  text-decoration: line-through;
}

.commerce-product--ocmono .commerce-product__excerpt {
  margin: 0 0 1.25rem;
}

.commerce-product--ocmono .commerce-product__excerpt p {
  margin: 0;
  color: #666;
  line-height: 1.75;
  font-size: 0.94rem;
}

.commerce-product--ocmono .commerce-product__stock {
  margin: 0 0 0.75rem;
  font-size: 0.88rem;
  font-weight: 600;
}

.commerce-product__stock--in { color: #2f6b3a; }
.commerce-product__stock--low { color: #9a5b12; }
.commerce-product__stock--out,
.commerce-product__stock--unavailable { color: #9a3d4a; }

.commerce-product--ocmono .commerce-product__shipping-note {
  margin: 0 0 1.35rem;
  font-size: 0.86rem;
  line-height: 1.55;
  color: #666;
  padding: 0.7rem 0.9rem;
  background: #f8f6f7;
  border-left: 3px solid #1fa2ff;
}

.commerce-product--ocmono .commerce-product__shipping-note a {
  color: #1fa2ff;
  font-weight: 600;
  text-decoration: none;
}

.commerce-product--ocmono .commerce-product__shipping-note a:hover {
  text-decoration: underline;
}

/* Purchase row: qty + ATC + wishlist */
.commerce-product--ocmono .commerce-product__purchase {
  position: relative;
  margin: 0 0 1.75rem;
  padding: 0;
  border: 0;
}

.commerce-product--ocmono .commerce-product__buy-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.65rem;
}

.commerce-product--ocmono .commerce-product__buy-row .field--name-variations,
.commerce-product--ocmono .commerce-product__buy-row .field__items,
.commerce-product--ocmono .commerce-product__buy-row .field__item,
.commerce-product--ocmono .commerce-product__buy-row div[id^="commerce-product-add-to-cart-form"] {
  width: auto;
  max-width: 100%;
  margin: 0;
}

.commerce-product--ocmono .commerce-product__buy-row .commerce-order-item-add-to-cart-form,
.commerce-product--ocmono .commerce-product__buy-row form {
  display: inline-flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.65rem;
  width: auto;
  max-width: 100%;
  margin: 0;
}

.commerce-product--ocmono .commerce-product__buy-row .field--name-purchased-entity {
  flex: 1 1 100%;
  width: 100%;
}

.commerce-product--ocmono .commerce-product__buy-row .mb-3,
.commerce-product--ocmono .commerce-product__buy-row .form-item,
.commerce-product--ocmono .commerce-product__buy-row .js-form-item,
.commerce-product--ocmono .commerce-product__buy-row .form-wrapper,
.commerce-product--ocmono .commerce-product__buy-row .js-form-wrapper {
  margin-bottom: 0 !important;
}

.commerce-product--ocmono .commerce-product__buy-row .attribute-widgets:empty {
  display: none;
}

.commerce-product--ocmono .commerce-product__buy-row .field--name-purchased-entity:has(.attribute-widgets:empty):not(:has(select)):not(:has(input[type="radio"])):not(:has(input[type="checkbox"])) {
  display: none;
}

.commerce-product--ocmono .commerce-product__buy-row .field--name-quantity,
.commerce-product--ocmono .commerce-product__buy-row .form-item-quantity,
.commerce-product--ocmono .commerce-product__buy-row .field--name-quantity .form-item {
  margin: 0 !important;
  padding: 0;
  width: auto;
}

.commerce-product--ocmono .commerce-product__buy-row .form-actions {
  margin: 0 !important;
  padding: 0;
  display: inline-flex;
  align-items: center;
}

/* Quantity +/- stepper */
.catalog-qty-stepper {
  display: inline-flex;
  align-items: stretch;
  height: 2.125rem;
  border: 1px solid #d0d7e2;
  border-radius: 6px;
  overflow: hidden;
  background: #fff;
  vertical-align: middle;
}

.catalog-qty-stepper__btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 1.85rem;
  min-width: 1.85rem;
  padding: 0;
  border: 0;
  background: #f8f9fb;
  color: #0e1d34;
  font-size: 0.95rem;
  line-height: 1;
  cursor: pointer;
  transition: background-color 0.15s ease, color 0.15s ease;
}

.catalog-qty-stepper__btn:hover,
.catalog-qty-stepper__btn:focus {
  background: #1fa2ff;
  color: #fff;
}

.catalog-qty-stepper__input {
  width: 2.1rem;
  min-width: 2.1rem;
  padding: 0.2rem 0.15rem;
  border: 0;
  border-left: 1px solid #d0d7e2;
  border-right: 1px solid #d0d7e2;
  border-radius: 0;
  text-align: center;
  font-weight: 700;
  font-size: 0.8125rem;
  line-height: 1.2;
  -moz-appearance: textfield;
}

.catalog-qty-stepper__input::-webkit-outer-spin-button,
.catalog-qty-stepper__input::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

.commerce-product--ocmono .catalog-qty-stepper {
  height: 3.25rem;
  border-color: #e5e5e5;
}

.commerce-product--ocmono .catalog-qty-stepper__btn {
  width: 2.4rem;
  min-width: 2.4rem;
  font-size: 1.05rem;
  font-weight: 600;
  background: #fff;
  color: #777;
}

.commerce-product--ocmono .catalog-qty-stepper__btn:hover,
.commerce-product--ocmono .catalog-qty-stepper__btn:focus {
  background: #222;
  color: #fff;
}

.commerce-product--ocmono .commerce-product__buy-row .catalog-qty-stepper input[type="number"],
.commerce-product--ocmono .commerce-product__buy-row .catalog-qty-stepper .form-number,
.commerce-product--ocmono .commerce-product__buy-row .catalog-qty-stepper .form-control {
  width: 2.75rem;
  min-width: 2.75rem;
  height: 100%;
  margin: 0;
  padding: 0;
  border: 0;
  border-left: 1px solid #e5e5e5;
  border-right: 1px solid #e5e5e5;
  border-radius: 0;
  box-shadow: none;
  background: #fff;
  text-align: center;
  font-size: 0.95rem;
  font-weight: 600;
  color: #222;
  line-height: 1;
}

.commerce-product--ocmono .commerce-product__buy-row .button--add-to-cart,
.commerce-product--ocmono .commerce-product__buy-row .oc-add-to-cart-submit,
.commerce-product--ocmono .commerce-product__buy-row .form-submit {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 168px;
  height: 3.25rem;
  min-height: 3.25rem;
  margin: 0;
  padding: 0 1.75rem;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  font-size: 0.82rem;
  font-weight: 700;
  line-height: 1;
}

.commerce-product--ocmono .commerce-product__wishlist-inline {
  display: inline-flex;
  align-items: center;
  margin: 0;
}

.commerce-product--ocmono .oc-wishlist-btn--icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 3.25rem;
  height: 3.25rem;
  border: 1px solid #e5e5e5;
  color: #222;
  text-decoration: none;
  font-size: 1.1rem;
  background: #fff;
  transition: background 0.25s ease, color 0.25s ease, border-color 0.25s ease;
}

.commerce-product--ocmono .oc-wishlist-btn--icon:hover,
.commerce-product--ocmono .oc-wishlist-btn--icon.oc-wishlist-btn--active {
  background: #1fa2ff;
  border-color: #1fa2ff;
  color: #fff;
}

.commerce-product--ocmono .commerce-product__sizes {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.55rem 0.75rem;
  margin: 0 0 1.15rem;
}

.commerce-product--ocmono .commerce-product__sizes-label {
  color: #666;
  font-size: 0.9rem;
  font-weight: 500;
}

.commerce-product--ocmono .commerce-product__sizes-list {
  display: flex;
  flex-wrap: wrap;
  gap: 0.4rem;
  margin: 0;
  padding: 0;
  list-style: none;
}

.commerce-product--ocmono .commerce-product__size {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 2.75rem;
  padding: 0.35rem 0.7rem;
  border: 1px solid #ddd;
  background: #fff;
  color: #222;
  font-size: 0.85rem;
  font-weight: 600;
  line-height: 1.2;
  cursor: pointer;
  user-select: none;
  transition: border-color 0.2s ease, color 0.2s ease, background-color 0.2s ease;
}

.commerce-product--ocmono .commerce-product__size.is-active {
  border-color: #1fa2ff;
  background: #1fa2ff;
  color: #fff;
}

.commerce-product--ocmono .other-links {
  margin: 0 0 1.35rem;
  padding-top: 0.15rem;
}

.commerce-product--ocmono .other-links ul {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: 0.4rem;
}

.commerce-product--ocmono .other-links li {
  font-size: 0.88rem;
  line-height: 1.45;
  color: #555;
  margin: 0;
}

.commerce-product--ocmono .other-links a {
  color: #888;
  text-decoration: none;
}

.commerce-product--ocmono .other-links a:hover {
  color: #1fa2ff;
}

.commerce-product--ocmono .share-option {
  list-style: none;
  margin: 0;
  padding: 0.15rem 0 0;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.35rem 0.85rem;
}

.commerce-product--ocmono .share-option h5 {
  margin: 0 0.35rem 0 0;
  font-size: 0.95rem;
  font-weight: 600;
  color: #222;
}

.commerce-product--ocmono .commerce-product__share-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 2rem;
  height: 2rem;
  border: 0;
  background: transparent;
  color: #444;
  font-size: 1.05rem;
  text-decoration: none;
  padding: 0;
  cursor: pointer;
}

.commerce-product--ocmono .commerce-product__share-btn:hover {
  color: #1fa2ff;
}

/* Tabs */
.commerce-product--ocmono .product-discription,
.commerce-product--ocmono .commerce-product__tabs {
  margin-top: 3.25rem;
  padding-top: 0.25rem;
}

.commerce-product--ocmono .ocmono-product-tabs .tabs-box {
  max-width: 760px;
  margin: 0 auto;
}

.ocmono-product-tabs__nav {
  list-style: none;
  margin: 0 0 1.75rem;
  padding: 0 0 0.15rem;
  display: flex;
  flex-wrap: wrap;
  gap: 1.5rem 2rem;
  border: 0;
  border-bottom: 1px solid #ececec;
}

.ocmono-product-tabs__nav .nav-item {
  margin: 0;
}

.ocmono-product-tabs__nav .tab-btn,
.ocmono-product-tabs__nav .nav-link {
  position: relative;
  display: inline-block;
  border: 0 !important;
  border-radius: 0;
  background: transparent !important;
  padding: 0 0 0.85rem;
  margin: 0 0 -1px;
  font-size: 1rem;
  font-weight: 500;
  color: #888;
  text-transform: none;
  letter-spacing: 0;
  box-shadow: none !important;
}

.ocmono-product-tabs__nav .tab-btn::before,
.ocmono-product-tabs__nav .nav-link::before {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100%;
  height: 2px;
  background: #222;
  transform: scaleX(0);
  transition: transform 0.3s ease, background 0.2s ease;
}

.ocmono-product-tabs__nav .tab-btn:hover,
.ocmono-product-tabs__nav .nav-link:hover {
  color: #444;
}

.ocmono-product-tabs__nav .tab-btn.active,
.ocmono-product-tabs__nav .nav-link.active {
  color: #1a1a1a;
  font-weight: 600;
}

.ocmono-product-tabs__nav .tab-btn.active::before,
.ocmono-product-tabs__nav .nav-link.active::before {
  transform: scaleX(1);
  background: #1fa2ff;
}

.ocmono-product-tabs__content {
  padding: 0.5rem 0 0;
}

.commerce-product__tab-panel {
  max-width: 760px;
  margin: 0 auto;
}

.commerce-product__description-body {
  color: #555;
  line-height: 1.8;
  font-size: 0.95rem;
}

.commerce-product__description-body > *:first-child {
  margin-top: 0;
}

.commerce-product__description-body > *:last-child {
  margin-bottom: 0;
}

.commerce-product__description-body p {
  margin: 0 0 1.1rem;
}

.commerce-product__description-body h2,
.commerce-product__description-body h3,
.commerce-product__description-body h4,
.commerce-product__description-body h5,
.commerce-product__description-body h6 {
  margin: 1.6rem 0 0.7rem;
  color: #1a1a1a;
  font-weight: 600;
  line-height: 1.35;
}

.commerce-product__description-body h5 {
  font-size: 1rem;
}

.commerce-product__description-body .oc-product-section-title {
  margin: 1.75rem 0 0.85rem;
  padding-bottom: 0.45rem;
  border-bottom: 1px solid #ececec;
  color: #1a1a1a;
  font-size: 1.05rem;
  font-weight: 600;
  line-height: 1.35;
}

.commerce-product__description-body .oc-product-section-title:first-child {
  margin-top: 0;
}

.commerce-product__description-body .oc-product-desc-list {
  margin: 0 0 1.25rem !important;
  padding: 0.35rem 0 0.15rem !important;
  list-style: none !important;
}

.commerce-product__description-body .oc-product-desc-list > li {
  position: relative;
  margin: 0 0 0.55rem !important;
  padding-left: 1.2rem !important;
  color: #555;
  line-height: 1.6;
}

.commerce-product__description-body .oc-product-desc-list > li::before {
  content: "" !important;
  position: absolute !important;
  left: 0 !important;
  top: 0.55em !important;
  width: 6px !important;
  height: 6px !important;
  border-radius: 50%;
  background: #1fa2ff !important;
}

.commerce-product__description-body strong {
  color: #222;
  font-weight: 600;
}

.commerce-product__description-body ul,
.commerce-product__description-body ol {
  margin: 0 0 1.25rem;
  padding: 0;
  list-style: none;
}

.commerce-product__description-body ul > li,
.commerce-product__description-body ol > li {
  position: relative;
  margin: 0 0 0.7rem;
  padding-left: 1.35rem;
  color: #555;
  line-height: 1.65;
}

.commerce-product__description-body ul > li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0.55em;
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: #1fa2ff;
}

/* Don't apply generic bullets to special lists */
.commerce-product__description-body .oc-product-benefit-list > li,
.commerce-product__description-body .oc-product-steps > li {
  padding-left: 0;
}

.commerce-product__description-body .oc-product-benefit-list > li::before,
.commerce-product__description-body .oc-product-steps > li::before {
  content: none;
  display: none;
}

/* Benefits — single clean checklist panel */
.commerce-product__description-body .oc-product-benefit-list {
  display: flex;
  flex-direction: column;
  gap: 0;
  margin: 0 !important;
  padding: 0 !important;
  list-style: none !important;
  border: 1px solid #ebebeb;
  background: #fff;
}

.commerce-product__description-body .oc-product-benefit-list > li {
  position: relative;
  display: flex;
  align-items: flex-start;
  gap: 0.85rem;
  margin: 0 !important;
  padding: 1rem 1.15rem 1rem 1.15rem !important;
  border: 0 !important;
  border-bottom: 1px solid #f0f0f0 !important;
  background: #fff !important;
  color: #333 !important;
  line-height: 1.55 !important;
  font-size: 0.95rem;
}

.commerce-product__description-body .oc-product-benefit-list > li:last-child {
  border-bottom: 0 !important;
}

.commerce-product__description-body .oc-product-benefit-list > li::before {
  content: "" !important;
  display: block !important;
  position: static !important;
  flex: 0 0 1.25rem;
  width: 1.25rem !important;
  height: 1.25rem !important;
  margin: 0.1rem 0 0 !important;
  top: auto !important;
  left: auto !important;
  border-radius: 50%;
  background: #1fa2ff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath fill='%23fff' d='M6.2 11.1 3.1 8l1.1-1.1 2 2 4.6-4.6L12 5.4z'/%3E%3C/svg%3E") center / 0.7rem no-repeat !important;
}

/* How to use */
.oc-product-howto__intro {
  margin-bottom: 1.15rem;
  padding: 1rem 1.15rem;
  background: #f8f8f8;
  border-left: 3px solid #1fa2ff;
  color: #333;
  line-height: 1.65;
}

.oc-product-howto__intro p {
  margin: 0 0 0.45rem;
}

.oc-product-howto__intro p:last-child {
  margin-bottom: 0;
}

.commerce-product__description-body .oc-product-steps {
  counter-reset: oc-step;
  display: flex;
  flex-direction: column;
  gap: 0;
  margin: 0 !important;
  padding: 0 !important;
  list-style: none !important;
  border: 1px solid #ebebeb;
  background: #fff;
}

.commerce-product__description-body .oc-product-steps > li {
  counter-increment: oc-step;
  position: relative;
  display: flex;
  align-items: flex-start;
  gap: 0.9rem;
  margin: 0 !important;
  padding: 1.05rem 1.15rem !important;
  border: 0 !important;
  border-bottom: 1px solid #f0f0f0 !important;
  background: #fff !important;
  color: #444 !important;
  line-height: 1.6 !important;
}

.commerce-product__description-body .oc-product-steps > li:last-child {
  border-bottom: 0 !important;
}

.commerce-product__description-body .oc-product-steps > li::before {
  content: counter(oc-step) !important;
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  position: static !important;
  flex: 0 0 1.7rem;
  width: 1.7rem !important;
  height: 1.7rem !important;
  margin: 0.05rem 0 0 !important;
  top: auto !important;
  left: auto !important;
  border-radius: 50%;
  background: #222 !important;
  color: #fff !important;
  font-size: 0.75rem !important;
  font-weight: 700;
  line-height: 1 !important;
  text-align: center;
  padding: 0 !important;
}

/* FAQs — accordion */
.oc-product-faq-list {
  display: flex;
  flex-direction: column;
  gap: 0;
  border-top: 1px solid #e8e8e8;
}

.oc-product-faq {
  border-bottom: 1px solid #e8e8e8;
  background: #fff;
}

.oc-product-faq__trigger {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 1rem;
  width: 100%;
  margin: 0;
  padding: 1.15rem 0.15rem 1.15rem 0;
  border: 0;
  background: transparent;
  text-align: left;
  cursor: pointer;
  color: inherit;
}

.oc-product-faq__trigger:hover .oc-product-faq__q,
.oc-product-faq__trigger:focus-visible .oc-product-faq__q {
  color: #1fa2ff;
}

.oc-product-faq__trigger:focus-visible {
  outline: 2px solid #1fa2ff;
  outline-offset: 2px;
}

.oc-product-faq__q {
  flex: 1 1 auto;
  margin: 0;
  color: #1a1a1a;
  font-size: 1rem;
  font-weight: 600;
  line-height: 1.45;
  transition: color 0.2s ease;
}

.oc-product-faq__icon {
  position: relative;
  flex: 0 0 auto;
  width: 1.65rem;
  height: 1.65rem;
  margin-top: 0.05rem;
  border: 1px solid #dcdcdc;
  background: #fafafa;
  transition: background 0.2s ease, border-color 0.2s ease;
}

.oc-product-faq__icon::before,
.oc-product-faq__icon::after {
  content: "";
  position: absolute;
  left: 50%;
  top: 50%;
  background: #222;
  transition: transform 0.25s ease, background 0.2s ease;
}

.oc-product-faq__icon::before {
  width: 10px;
  height: 1.5px;
  transform: translate(-50%, -50%);
}

.oc-product-faq__icon::after {
  width: 1.5px;
  height: 10px;
  transform: translate(-50%, -50%);
}

.oc-product-faq.is-open .oc-product-faq__icon {
  background: #1fa2ff;
  border-color: #1fa2ff;
}

.oc-product-faq.is-open .oc-product-faq__icon::before,
.oc-product-faq.is-open .oc-product-faq__icon::after {
  background: #fff;
}

.oc-product-faq.is-open .oc-product-faq__icon::after {
  transform: translate(-50%, -50%) rotate(90deg);
  opacity: 0;
}

.oc-product-faq.is-open .oc-product-faq__q {
  color: #1fa2ff;
}

.oc-product-faq__panel {
  padding: 0 2.2rem 1.2rem 0;
}

.oc-product-faq__panel[hidden] {
  display: none !important;
}

.oc-product-faq__a {
  color: #4a4a4a;
  font-size: 0.94rem;
  line-height: 1.75;
  padding-top: 0.15rem;
  border-top: 0;
}

.oc-product-faq__a strong {
  color: #222;
  font-weight: 600;
}

.oc-product-faq__a p {
  margin: 0 0 0.65rem;
}

.oc-product-faq__a p:last-child {
  margin-bottom: 0;
}

.commerce-product__faqs-body p {
  margin-bottom: 0.85rem;
}

.commerce-product__faqs-body strong {
  color: #222;
  font-weight: 600;
}

/* Specs */
.commerce-product__tab-panel--specs {
  max-width: 40rem;
}

.commerce-product__spec-list {
  display: grid;
  gap: 0;
  margin: 0;
  border: 1px solid #ececec;
}

.commerce-product__spec-item {
  display: grid;
  grid-template-columns: 160px 1fr;
  gap: 1rem;
  margin: 0;
  padding: 0.95rem 1.15rem;
  border-bottom: 1px solid #f0f0f0;
}

.commerce-product__spec-item:last-child {
  border-bottom: 0;
}

.commerce-product__spec-item--wide {
  grid-template-columns: 1fr;
}

.commerce-product__spec-item:nth-child(odd) {
  background: #fafafa;
}

.commerce-product__spec-item dt {
  margin: 0;
  font-size: 0.78rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: #222;
}

.commerce-product__spec-item dd {
  margin: 0;
  color: #555;
  line-height: 1.6;
}

.commerce-product__spec-item dd a {
  color: #1fa2ff;
  font-weight: 600;
  text-decoration: none;
}

/* Reviews inside tabs */
.commerce-product__tab-panel--reviews {
  max-width: 44rem;
}

.commerce-product__tab-panel--reviews .oc-product-reviews__item {
  padding: 1.15rem 1.2rem;
  border: 1px solid #ececec;
  background: #fff;
  margin-bottom: 0.85rem;
}

.commerce-product__tab-panel--reviews .oc-product-reviews__form-wrap {
  margin-top: 1.5rem;
  padding: 1.25rem 1.35rem;
  border: 1px solid #ececec;
  background: #fafafa;
}

.commerce-product__related,
.commerce-product__recent {
  margin-top: 3.75rem;
  padding-top: 0.5rem;
}

.commerce-product__related-header {
  text-align: center;
  margin-bottom: 2rem;
}

.commerce-product__related-header h2 {
  margin: 0 0 0.45rem;
  font-size: clamp(1.4rem, 1.2rem + 0.6vw, 1.75rem);
  font-weight: 600;
  color: #1a1a1a;
}

.commerce-product__related-lead {
  margin: 0 auto;
  max-width: 32rem;
  color: #888;
  font-size: 0.92rem;
  line-height: 1.55;
}

/* Related products - equal-height grid */
.oc-product-grid,
.oc-recently-viewed,
.view-related-products .views-view-grid,
.shop-related .views-view-grid {
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 1.25rem;
  float: none !important;
  width: 100% !important;
  margin: 0 !important;
  list-style: none;
  padding: 0;
}

.view-related-products .views-view-grid::before,
.view-related-products .views-view-grid::after,
.shop-related .views-view-grid::before,
.shop-related .views-view-grid::after {
  display: none !important;
  content: none !important;
}

.view-related-products .views-view-grid .views-row,
.view-related-products .views-view-grid .shop-related__item,
.shop-related .views-view-grid .views-row,
.shop-related .views-view-grid .shop-related__item {
  display: contents !important;
  float: none !important;
  width: auto !important;
  margin: 0 !important;
  clear: none !important;
}

.view-related-products .views-view-grid .views-col,
.shop-related .views-view-grid .views-col {
  display: flex !important;
  float: none !important;
  width: auto !important;
  max-width: none !important;
  padding: 0 !important;
  margin: 0 !important;
  min-width: 0;
}

.view-related-products .views-view-grid .views-col > .views-field,
.shop-related .views-view-grid .views-col > .views-field,
.view-related-products .shop-product-card,
.shop-related .shop-product-card,
.commerce-product__recent .shop-product-card {
  display: flex;
  flex-direction: column;
  width: 100%;
  height: 100%;
  margin: 0;
}

.view-related-products .shop-product-card__inner,
.shop-related .shop-product-card__inner,
.commerce-product__recent .shop-product-card__inner {
  height: 100%;
}

.oc-recently-viewed__item {
  list-style: none;
  margin: 0;
  padding: 0;
  min-width: 0;
  display: flex;
}

.commerce-product__related .view-related-products > h3 {
  display: none;
}

/* Product page grids - minimal card with purchase options */
.commerce-product__related .shop-product-card,
.commerce-product__recent .shop-product-card {
  padding: 0;
  height: 100%;
  border: 1px solid var(--ocmono-border);
  background: #fff;
}

.shop-catalog__content.grid-view .shop-product-card {
  padding: 0;
  height: 100%;
  background: #fff;
  border: 1px solid var(--ocmono-border);
}

.commerce-product__related .shop-product-card:hover,
.commerce-product__recent .shop-product-card:hover {
  border-color: #d0d0d0;
}

.shop-catalog__content.grid-view .shop-product-card:hover {
  border-color: #d0d0d0;
}

.commerce-product__related .shop-product-card__inner,
.commerce-product__related .shop-product-card .card-body,
.commerce-product__recent .shop-product-card__inner,
.commerce-product__recent .shop-product-card .card-body,
.shop-catalog__content.grid-view .shop-product-card__inner,
.shop-catalog__content.grid-view .shop-product-card .card-body {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 0;
  text-align: left;
  height: 100%;
  padding: 0 !important;
}

.commerce-product__related .shop-product-card__media,
.commerce-product__recent .shop-product-card__media,
.shop-catalog__content.grid-view .shop-product-card__media {
  flex: none;
  width: 100%;
  max-width: none;
  margin: 0;
  aspect-ratio: 1 / 1;
  border-bottom: 0;
  background: #f5f5f5;
}

.commerce-product__related .shop-product-card__image,
.commerce-product__recent .shop-product-card__image,
.shop-catalog__content.grid-view .shop-product-card__image {
  object-fit: cover;
}

.commerce-product__related .shop-product-card__body,
.commerce-product__recent .shop-product-card__body,
.shop-catalog__content.grid-view .shop-product-card__body {
  flex: 1 1 auto;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  padding: 12px 14px 14px;
  gap: 8px;
}

.commerce-product__related .shop-product-card__buy,
.commerce-product__recent .shop-product-card__buy,
.shop-catalog__content.grid-view .shop-product-card__buy {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  margin-top: auto;
  padding-top: 10px;
  gap: 0.5rem;
}

.commerce-product__related .shop-product-card__purchase,
.commerce-product__recent .shop-product-card__purchase,
.shop-catalog__content.grid-view .shop-product-card__purchase {
  margin-left: auto;
}

@media (max-width: 1279px) {
  .commerce-product__related .oc-product-grid,
  .commerce-product__related .view-related-products .views-view-grid,
  .commerce-product__related .shop-related .views-view-grid,
  .commerce-product__recent .oc-recently-viewed {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 0;
    column-gap: 0;
    row-gap: 0;
  }

  .commerce-product__related .view-related-products .views-view-grid .views-col,
  .commerce-product__recent .oc-recently-viewed__item {
    border-bottom: 1px solid #e8edf5;
  }

  .commerce-product__related .view-related-products .views-view-grid .views-col:last-child,
  .commerce-product__recent .oc-recently-viewed__item:last-child {
    border-bottom: 0;
  }

  .commerce-product__related .shop-product-card,
  .commerce-product__recent .shop-product-card {
    padding: 12px 0;
    height: auto;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
  }

  .commerce-product__related .shop-product-card:hover,
  .commerce-product__recent .shop-product-card:hover {
    border-color: transparent;
    box-shadow: none;
  }

  .commerce-product__related .shop-product-card__inner,
  .commerce-product__related .shop-product-card .card-body,
  .commerce-product__recent .shop-product-card__inner,
  .commerce-product__recent .shop-product-card .card-body {
    display: flex;
    flex-direction: row !important;
    align-items: center;
    gap: 0;
    text-align: left;
    height: auto;
    min-height: 0;
    padding: 0 !important;
  }

  .commerce-product__related .shop-product-card__media,
  .commerce-product__recent .shop-product-card__media {
    flex: 0 0 120px;
    width: 120px;
    height: 120px;
    max-width: 120px;
    max-height: 120px;
    margin: 0;
    aspect-ratio: 1 / 1;
    align-self: center;
    overflow: hidden;
    border: 0;
    border-radius: 8px;
    background: #f5f5f5;
  }

  .commerce-product__related .shop-product-card__image-link,
  .commerce-product__recent .shop-product-card__image-link {
    display: block;
    width: 100%;
    height: 100%;
  }

  .commerce-product__related .shop-product-card__image,
  .commerce-product__recent .shop-product-card__image {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
  }

  .commerce-product__related .shop-product-card__body,
  .commerce-product__recent .shop-product-card__body {
    flex: 1 1 auto;
    display: flex;
    flex-direction: column;
    justify-content: center;
    min-width: 0;
    padding: 0.75rem 0.9rem !important;
    gap: 6px;
  }

  .commerce-product__related .shop-product-card__benefits,
  .commerce-product__related .shop-product-card__short,
  .commerce-product__recent .shop-product-card__benefits,
  .commerce-product__recent .shop-product-card__short {
    display: none;
  }

  .commerce-product__related .shop-product-card__buy,
  .commerce-product__recent .shop-product-card__buy {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    margin-top: auto;
    padding-top: 6px;
    gap: 0.4rem;
  }

  .commerce-product__related .shop-product-card__purchase,
  .commerce-product__recent .shop-product-card__purchase {
    margin-left: auto;
  }
}

@media (max-width: 420px) {
  .commerce-product__related .shop-product-card__media,
  .commerce-product__recent .shop-product-card__media {
    flex: 0 0 100px;
    width: 100px;
    height: 100px;
    max-width: 100px;
    max-height: 100px;
  }

  .commerce-product__related .shop-product-card__body,
  .commerce-product__recent .shop-product-card__body {
    padding: 0.65rem 0.75rem !important;
  }
}

@media (max-width: 991px) {
  .commerce-product--ocmono .product-info,
  .commerce-product--ocmono .commerce-product__summary-inner {
    max-width: none;
    padding-top: 0.5rem;
  }
}

@media (max-width: 575px) {
  .path-product #main > .container,
  body.path-product #content-inner.container {
    padding-top: calc(var(--bs-gutter-x, 1.5rem) * 0.5);
    padding-bottom: 2.5rem;
  }

  .commerce-product--ocmono .commerce-product__buy-row .button--add-to-cart,
  .commerce-product--ocmono .commerce-product__buy-row .oc-add-to-cart-submit,
  .commerce-product--ocmono .commerce-product__buy-row .form-submit {
    flex: 1 1 auto;
    min-width: 0;
  }

  .commerce-product__spec-item {
    grid-template-columns: 1fr;
    gap: 0.25rem;
  }
}

.oc-product-reviews {
  padding: 0.5rem 0 1rem;
}

.oc-product-reviews__list {
  list-style: none;
  margin: 0 0 2rem;
  padding: 0;
}

.oc-product-reviews__item {
  padding: 1rem 0;
  border-bottom: 1px solid #e8edf5;
}

.oc-product-reviews__item:last-child {
  border-bottom: 0;
}

.oc-product-reviews__meta {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem 1rem;
  align-items: baseline;
  margin-bottom: 0.35rem;
}

.oc-product-reviews__author {
  color: #0e1d34;
}

.oc-product-reviews__date {
  color: #778396;
  font-size: 0.85rem;
}

.oc-product-reviews__stars {
  color: #c4a35a;
  margin-bottom: 0.35rem;
}

.oc-product-reviews__subject {
  margin: 0 0 0.35rem;
  font-size: 1.05rem;
  color: #0e1d34;
}

.oc-product-reviews__body {
  color: #445066;
  line-height: 1.55;
}

.oc-product-reviews__empty {
  color: #667085;
  margin-bottom: 1.5rem;
}

.oc-product-reviews__form-wrap {
  margin-top: 1.5rem;
  padding: 1.25rem;
  background: #f8fafc;
  border: 1px solid #e8edf5;
  border-radius: 12px;
}

.oc-product-reviews__form-title {
  margin: 0 0 1rem;
  font-size: 1.15rem;
  color: #0e1d34;
}

.oc-product-reviews__login a {
  font-weight: 600;
  color: #1fa2ff;
}

.oc-product-review-form .form-item {
  margin-bottom: 0.9rem;
}

.oc-product-review-form .button--primary,
.oc-product-review-form .form-submit {
  margin-top: 0.35rem;
}


/* OcMono services listing + detail */

.service-details,
.services-listing,
.service-page {
  background: #fff;
}

.service-details {
  padding: 2.5rem 0 3.5rem;
}

/* OcMono service listing / related / homepage grid */

.front-clinic .views-view-grid .views-row,
section.services .views-view-grid .views-row,
.view-related-treatments .views-view-grid .views-row,
.services-listing .views-view-grid .views-row,
.services-related .views-view-grid .views-row {
  display: flex;
  flex-wrap: wrap;
  margin: 0 -10px;
}

.front-clinic .views-view-grid .views-col,
section.services .views-view-grid .views-col,
.view-related-treatments .views-view-grid .views-col,
.services-listing .views-view-grid .views-col,
.services-related .views-view-grid .views-col {
  padding: 0 10px 20px;
  flex: 0 0 33.333%;
  max-width: 33.333%;
}

section.services .front-news,
.front-clinic .front-news,
.view-related-treatments .front-news,
.services-listing .front-news,
.services-related .front-news {
  height: 100%;
  margin-bottom: 0;
  overflow: visible;
  background: transparent;
}

section.services .front-news .icon-box,
.front-clinic .front-news .icon-box,
.view-related-treatments .front-news .icon-box,
.services-listing .front-news .icon-box,
.services-related .front-news .icon-box {
  width: 100% !important;
  padding: 0 !important;
  margin: 0 !important;
  box-shadow: none !important;
  border-radius: 0 !important;
  border-left: none !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 12px !important;
}

section.services .front-news .pic,
.front-clinic .front-news .pic,
.view-related-treatments .front-news .pic,
.services-listing .front-news .pic,
.services-related .front-news .pic {
  border-radius: 10px !important;
  overflow: hidden;
  margin: 0 !important;
}

section.services .front-news .icon-box h4,
.front-clinic .front-news .icon-box h4,
.view-related-treatments .front-news .icon-box h4,
.services-listing .front-news .icon-box h4,
.services-related .front-news .icon-box h4 {
  border-left: none !important;
  font-weight: 700 !important;
  font-size: 20px !important;
  line-height: 1.35 !important;
  color: #2c4964 !important;
  margin: 0 !important;
  padding: 18px 20px !important;
  background: #F9F9F9 !important;
  border-radius: 10px !important;
}

section.services .front-news .icon-box h4 a,
.front-clinic .front-news .icon-box h4 a,
.view-related-treatments .front-news .icon-box h4 a,
.services-listing .front-news .icon-box h4 a,
.services-related .front-news .icon-box h4 a {
  color: #2c4964 !important;
  text-decoration: none;
  font-weight: 700 !important;
  font-family: "Montserrat", sans-serif !important;
}

section.services .front-news .icon-box h4 a:hover,
.front-clinic .front-news .icon-box h4 a:hover,
.view-related-treatments .front-news .icon-box h4 a:hover,
.services-listing .front-news .icon-box h4 a:hover,
.services-related .front-news .icon-box h4 a:hover {
  color: #1fa2ff !important;
}

section.services .front-news .pic img,
.front-clinic .front-news .pic img,
.view-related-treatments .front-news .pic img,
.services-listing .front-news .pic img,
.services-related .front-news .pic img {
  width: 100%;
  height: auto;
  display: block;
}

.services-listing__header {
  margin-bottom: 1.25rem;
}

.services-listing__pager {
  margin-top: 0.5rem;
}

.services-intro {
  max-width: 42rem;
  margin: 0 0 1.75rem;
  color: #6c757d;
  font-size: 1rem;
  line-height: 1.65;
}

/* ---- Detail page ---- */

.service-page__inner {
  max-width: 960px;
  margin: 0 auto;
}

.service-page__intro {
  margin: 0 0 2.5rem;
}

.service-page__intro--split {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 2rem;
  align-items: stretch;
  background: #f9f9f9;
  border-radius: 12px;
  overflow: hidden;
}

.service-page__intro-text {
  padding: clamp(1.5rem, 3vw, 2.5rem);
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.service-page__intro-text h2,
.service-page__intro-text h3,
.service-page__intro-text h4 {
  font-family: "Montserrat", sans-serif !important;
  font-size: 1.15rem;
  font-weight: 700;
  color: #1fa2ff;
  margin: 0 0 0.75rem;
  line-height: 1.4;
}

.service-page__intro-text h3:not(:first-child),
.service-page__intro-text h4:not(:first-child) {
  margin-top: 1.35rem;
}

.service-page__intro-text p {
  margin: 0 0 0.85rem;
  color: #4a5568;
  font-size: 1rem;
  line-height: 1.7;
}

.service-page__intro-text p:last-child {
  margin-bottom: 0;
}

.service-page__intro-media {
  margin: 0;
  background: #eee;
  min-height: 260px;
}

.service-page__intro-media .field,
.service-page__intro-media .field__item,
.service-page__intro-media a {
  display: block;
  margin: 0;
  height: 100%;
}

.service-page__intro-media img {
  display: block;
  width: 100%;
  height: 100%;
  min-height: 260px;
  object-fit: cover;
}

.service-page__intro:not(.service-page__intro--split) .service-page__intro-media {
  border-radius: 12px;
  overflow: hidden;
}

.service-page__intro:not(.service-page__intro--split) .service-page__intro-media img {
  min-height: 0;
  height: auto;
}

.service-page__body {
  margin: 0 0 3rem;
  color: #444;
  font-size: 1.05rem;
  line-height: 1.75;
}

.service-page__body h2,
.service-page__body h3,
.service-page__body h4 {
  font-family: "Montserrat", sans-serif !important;
  color: #1fa2ff;
  font-weight: 700;
  line-height: 1.35;
}

.service-page__body h2,
.service-page__body h3 {
  font-size: 1.35rem;
  margin: 2rem 0 0.85rem;
}

.service-page__body h3:first-child,
.service-page__body h2:first-child {
  margin-top: 0;
}

.service-page__body h4 {
  font-size: 1.1rem;
  margin: 1.5rem 0 0.65rem;
}

.service-page__body p {
  margin: 0 0 1rem;
  color: #4a5568;
}

.service-page__body ul,
.service-page__body ol {
  margin: 0.5rem 0 1.25rem;
  padding-left: 1.35rem;
  color: #4a5568;
}

.service-page__body li {
  margin-bottom: 0.4rem;
}

.service-page__body li::marker {
  color: #1fa2ff;
}

.service-page__body img {
  max-width: 100%;
  height: auto;
  border-radius: 8px;
}

.service-page__related {
  margin-top: 0.5rem;
  padding-top: 1rem;
  border-top: 1px solid #eee;
}

.service-page__related-header.section-header {
  text-align: left;
  padding: 40px 0 24px;
  margin-bottom: 0.5rem;
}

.service-page__related-header.section-header h2 {
  margin-bottom: 0.5rem;
}

.service-page__related-header.section-header p {
  max-width: 36rem;
  color: #5a6578;
}

@media (max-width: 991px) {
  .front-clinic .views-view-grid,
  section.services .views-view-grid,
  .view-related-treatments .views-view-grid,
  .services-listing .views-view-grid,
  .services-related .views-view-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px 10px;
    margin: 0;
    width: 100%;
  }

  .front-clinic .views-view-grid .views-row,
  section.services .views-view-grid .views-row,
  .view-related-treatments .views-view-grid .views-row,
  .services-listing .views-view-grid .views-row,
  .services-related .views-view-grid .views-row {
    display: contents;
    margin: 0;
  }

  .front-clinic .views-view-grid .views-col,
  section.services .views-view-grid .views-col,
  .view-related-treatments .views-view-grid .views-col,
  .services-listing .views-view-grid .views-col,
  .services-related .views-view-grid .views-col {
    width: auto !important;
    flex: none !important;
    max-width: none !important;
    padding: 0;
    margin: 0;
    min-width: 0;
    display: flex;
  }

  .front-clinic .views-view-grid .views-col > .views-field,
  section.services .views-view-grid .views-col > .views-field,
  .view-related-treatments .views-view-grid .views-col > .views-field,
  .services-listing .views-view-grid .views-col > .views-field,
  .services-related .views-view-grid .views-col > .views-field,
  .front-clinic .views-view-grid .front-news,
  section.services .views-view-grid .front-news,
  .view-related-treatments .views-view-grid .front-news,
  .services-listing .views-view-grid .front-news,
  .services-related .views-view-grid .front-news {
    width: 100%;
    height: 100%;
  }

  section.services .front-news .icon-box,
  .front-clinic .front-news .icon-box,
  .view-related-treatments .front-news .icon-box,
  .services-listing .front-news .icon-box,
  .services-related .front-news .icon-box {
    height: 100%;
    gap: 8px !important;
  }

  section.services .front-news .pic,
  .front-clinic .front-news .pic,
  .view-related-treatments .front-news .pic,
  .services-listing .front-news .pic,
  .services-related .front-news .pic {
    aspect-ratio: 4 / 3;
    border-radius: 8px !important;
  }

  section.services .front-news .pic .field-content,
  .front-clinic .front-news .pic .field-content,
  .view-related-treatments .front-news .pic .field-content,
  .services-listing .front-news .pic .field-content,
  .services-related .front-news .pic .field-content,
  section.services .front-news .pic a,
  .front-clinic .front-news .pic a,
  .view-related-treatments .front-news .pic a,
  .services-listing .front-news .pic a,
  .services-related .front-news .pic a {
    display: block;
    height: 100%;
  }

  section.services .front-news .pic img,
  .front-clinic .front-news .pic img,
  .view-related-treatments .front-news .pic img,
  .services-listing .front-news .pic img,
  .services-related .front-news .pic img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
  }

  section.services .front-news .icon-box h4,
  .front-clinic .front-news .icon-box h4,
  .view-related-treatments .front-news .icon-box h4,
  .services-listing .front-news .icon-box h4,
  .services-related .front-news .icon-box h4 {
    flex: 1 1 auto;
    display: flex;
    align-items: flex-start;
    font-size: 13px !important;
    line-height: 1.3 !important;
    padding: 10px 12px !important;
    min-height: 3.6em;
  }

  .service-page__intro--split {
    grid-template-columns: 1fr;
  }

  .service-page__intro-media {
    order: -1;
    min-height: 220px;
  }

  .service-page__intro-media img {
    min-height: 220px;
  }
}

@media (max-width: 767px) {
  .front-clinic .views-view-grid,
  section.services .views-view-grid,
  .view-related-treatments .views-view-grid,
  .services-listing .views-view-grid,
  .services-related .views-view-grid {
    gap: 10px 8px;
  }

  .service-details {
    padding: 1.5rem 0 2.5rem;
  }

  section.services .front-news .icon-box h4,
  .front-clinic .front-news .icon-box h4,
  .view-related-treatments .front-news .icon-box h4,
  .services-listing .front-news .icon-box h4,
  .services-related .front-news .icon-box h4 {
    font-size: 12.5px !important;
    padding: 9px 10px !important;
  }
}

.path-cart #main > .container {
  max-width: 1100px;
}

.path-cart .cart.cart-form {
  background: #fff;
  border: 1px solid #e8edf5;
  border-radius: 14px;
  box-shadow: 0 10px 32px rgba(14, 29, 52, 0.06);
  padding: 1.25rem 1.35rem 1.5rem;
}

.oc-cart-table-wrap {
  margin-bottom: 0;
}

.oc-cart-list {
  display: flex;
  flex-direction: column;
  gap: 0;
  width: 100%;
}

.oc-cart-list__head {
  display: grid;
  grid-template-columns: minmax(220px, 1.6fr) 0.75fr 0.7fr 0.45fr 0.75fr;
  gap: 0.75rem;
  align-items: center;
  padding: 0.85rem 0.9rem;
  background: #f8fafc;
  border-bottom: 1px solid #e8edf5;
  color: #0e1d34;
  font-size: 0.78rem;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

.oc-cart-list__head-cell.views-field-unit-price__number,
.oc-cart-list__head-cell.views-field-total-price__number,
.oc-cart-list__head-cell.views-field-remove-button {
  text-align: center;
}

.oc-cart-list__head-cell.views-field-total-price__number {
  text-align: right;
}

.oc-cart-list__body {
  display: flex;
  flex-direction: column;
}

.oc-cart-list__item {
  display: grid;
  grid-template-columns: minmax(220px, 1.6fr) 0.75fr 0.7fr 0.45fr 0.75fr;
  gap: 0.75rem;
  align-items: center;
  padding: 1rem 0.9rem;
  border-bottom: 1px solid #eef2f7;
}

.oc-cart-list__item-footer {
  display: contents;
}

.oc-cart-list__prices {
  display: contents;
}

.oc-cart-list__item:last-child {
  border-bottom: 0;
}

.oc-cart-list__product {
  grid-column: 1;
}

.oc-cart-list__unit-price {
  grid-column: 2;
}

.oc-cart-list__qty {
  grid-column: 3;
}

.oc-cart-list__remove {
  grid-column: 4;
}

.oc-cart-list__line-total {
  grid-column: 5;
}

.oc-cart-list__remove {
  display: flex;
  align-items: center;
  justify-content: center;
}

.oc-cart-list__qty .form-item {
  margin: 0;
}

.oc-cart-list__unit-price-value,
.oc-cart-list__line-total-value {
  display: block;
}

.oc-cart-list__cell.views-field-unit-price__number,
.oc-cart-list__cell.views-field-total-price__number {
  font-weight: 700;
  color: #0e1d34;
  white-space: nowrap;
  text-align: right;
  font-variant-numeric: tabular-nums;
}

.oc-cart-table {
  margin: 0;
  width: 100%;
}

.oc-cart-table thead th {
  background: #f8fafc;
  border-bottom: 1px solid #e8edf5;
  color: #0e1d34;
  font-size: 0.78rem;
  font-weight: 700;
  letter-spacing: 0.06em;
  padding: 0.85rem 0.9rem;
  text-transform: uppercase;
  white-space: nowrap;
}

.oc-cart-table tbody td {
  border-bottom: 1px solid #eef2f7;
  padding: 1rem 0.9rem;
  vertical-align: middle;
}

.oc-cart-table__row:last-child td {
  border-bottom: 0;
}

.oc-cart-table .views-field-purchased-entity {
  min-width: 280px;
}

.oc-cart-table .views-field-unit-price__number,
.oc-cart-table .views-field-total-price__number {
  font-weight: 700;
  color: #0e1d34;
  white-space: nowrap;
  text-align: right;
}

.oc-cart-table thead th.views-field-unit-price__number,
.oc-cart-table thead th.views-field-total-price__number {
  text-align: right;
}

.oc-cart-table tbody td.views-field-unit-price__number,
.oc-cart-table tbody td.views-field-total-price__number {
  text-align: right;
}

.oc-cart-table .views-field-unit-price__number .field,
.oc-cart-table .views-field-total-price__number .field,
.oc-cart-table .views-field-unit-price__number .commerce-price,
.oc-cart-table .views-field-total-price__number .commerce-price {
  display: inline-block;
  text-align: right;
  font-variant-numeric: tabular-nums;
}

.oc-cart-table .views-field-edit-quantity {
  width: 130px;
}

.oc-cart-table .views-field-remove-button {
  width: 64px;
  text-align: center;
}

/* Cart line item */
.oc-cart-item {
  display: flex;
  align-items: center;
  gap: 0.85rem;
}

.oc-cart-item__image {
  flex-shrink: 0;
  display: block;
  width: 72px;
  height: 72px;
  border-radius: 10px;
  overflow: hidden;
  background: #f3f6fc;
  border: 1px solid #e8edf5;
}

.oc-cart-item__image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.oc-cart-item__details {
  display: flex;
  flex-direction: column;
  gap: 0.2rem;
  min-width: 0;
}

.oc-cart-item__title {
  color: #0e1d34;
  font-size: 0.95rem;
  font-weight: 600;
  line-height: 1.3;
  text-decoration: none;
}

.oc-cart-item__title:hover {
  color: #1fa2ff;
}

.oc-cart-item__brand {
  color: #1fa2ff;
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

.oc-cart-item__meta-line {
  display: flex;
  flex-wrap: wrap;
  gap: 0.25rem 0.35rem;
  font-size: 0.8125rem;
  line-height: 1.35;
}

.oc-cart-item__meta-label {
  color: #667085;
  font-weight: 600;
}

.oc-cart-item__meta-value {
  color: #3d4f66;
  font-weight: 500;
}

.oc-cart-item__image--placeholder {
  background: linear-gradient(135deg, #eef2f8 0%, #dce4ef 100%);
}

/* Quantity stepper */
.oc-cart-qty-stepper {
  margin: 0 auto;
}

.oc-cart-page-form .form-item {
  margin: 0;
}

/* Remove button */
.path-cart .views-field-remove-button .delete-order-item,
.path-cart .views-field-remove-button .oc-cart-remove-btn,
.oc-cart-remove-btn,
.delete-order-item.oc-cart-remove-btn,
.path-cart .delete-order-item {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 1.75rem !important;
  height: 1.75rem !important;
  min-width: 1.75rem !important;
  min-height: 1.75rem !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 6px !important;
  background: #fff5f8 !important;
  background-color: #fff5f8 !important;
  color: #1fa2ff !important;
  font-size: 0.82rem !important;
  line-height: 1 !important;
  text-transform: none !important;
  letter-spacing: 0 !important;
  cursor: pointer;
  box-shadow: none !important;
  transition: background 0.2s ease, color 0.2s ease;
}

.path-cart .views-field-remove-button .delete-order-item:hover,
.path-cart .views-field-remove-button .delete-order-item:focus,
.path-cart .views-field-remove-button .oc-cart-remove-btn:hover,
.oc-cart-remove-btn:hover,
.delete-order-item.oc-cart-remove-btn:hover,
.path-cart .delete-order-item:hover {
  background: #ffe8ef !important;
  background-color: #ffe8ef !important;
  color: #e11d48 !important;
}

/* Footer totals */
.oc-cart-page__footer {
  margin-top: 1.25rem;
  padding-top: 1.25rem;
  border-top: 1px solid #eef2f7;
  display: flex;
  justify-content: flex-end;
}

.oc-cart-summary {
  min-width: min(100%, 340px);
  background: #f8fafc;
  border: 1px solid #e8edf5;
  border-radius: 12px;
  padding: 1rem 1.15rem;
}

.oc-cart-summary__row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  padding: 0.35rem 0;
  font-size: 0.9rem;
}

.oc-cart-summary__row--total {
  margin-top: 0.45rem;
  padding-top: 0.75rem;
  border-top: 1px solid #dde4ee;
  font-size: 1.05rem;
  font-weight: 800;
}

.oc-cart-summary__label {
  color: #4a5568;
}

.oc-cart-summary__value {
  color: #0e1d34;
  font-weight: 700;
  min-width: 6.5rem;
  text-align: right;
  font-variant-numeric: tabular-nums;
}

.oc-cart-summary__row--total .oc-cart-summary__value {
  color: #1fa2ff;
}

.path-cart .order-total-line {
  display: flex;
  justify-content: space-between;
  gap: 1rem;
}

.path-cart .order-total-line-value {
  min-width: 6.5rem;
  text-align: right;
  font-variant-numeric: tabular-nums;
}

/* Form actions */
.oc-cart-page-form .form-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem;
  margin-top: 1.25rem;
  padding-top: 0;
}

.oc-cart-page__update,
.oc-cart-page-form #edit-submit {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.45rem;
  min-height: 2.75rem;
  padding: 0.55rem 1.25rem;
  font-weight: 700;
  cursor: pointer;
}

.oc-cart-page__checkout,
.oc-cart-page-form [id^="edit-checkout"] {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.45rem;
  min-height: 2.75rem;
  padding: 0.55rem 1.35rem;
  font-weight: 700;
  cursor: pointer;
}

@media (max-width: 1279px) {
  .path-cart .cart.cart-form {
    padding: 0.5rem 0 1rem;
    border: 0;
    border-radius: 0;
    box-shadow: none;
    background: transparent;
  }

  .oc-cart-list__head {
    display: none;
  }

  .oc-cart-list__item {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    grid-template-areas:
      "product remove"
      "footer footer";
    gap: 0.45rem 0.65rem;
    align-items: start;
    padding: 0.9rem 0;
    border-bottom: 1px solid #eef2f7;
  }

  .oc-cart-list__item:last-child {
    border-bottom: 0;
  }

  .oc-cart-list__product {
    grid-area: product;
    grid-column: auto;
    min-width: 0;
    align-self: start;
  }

  .oc-cart-list__remove {
    grid-area: remove;
    grid-column: auto;
    display: flex;
    align-items: flex-start;
    justify-content: center;
    justify-self: end;
    align-self: start;
    padding: 0;
    margin: 0;
    border: 0;
  }

  .oc-cart-list__item-footer {
    grid-area: footer;
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 0.75rem;
    width: 100%;
    padding-top: 0.35rem;
  }

  .oc-cart-list__qty {
    grid-column: auto;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    flex: 0 0 auto;
    padding: 0;
    margin: 0;
    border: 0;
  }

  .oc-cart-list__qty label,
  .oc-cart-list__qty .form-item__label {
    display: none;
  }

  .oc-cart-list__prices {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    justify-content: flex-end;
    gap: 0.2rem;
    margin-left: auto;
  }

  .oc-cart-list__unit-price {
    grid-column: auto;
    padding: 0;
    border: 0;
    text-align: right;
  }

  .oc-cart-list__unit-price-value {
    font-size: 0.88rem;
    font-weight: 400;
    color: #667085;
    white-space: nowrap;
  }

  .oc-cart-list__line-total {
    grid-column: auto;
    padding: 0;
    border: 0;
    text-align: right;
  }

  .oc-cart-list__line-total-value {
    font-size: 1.05rem;
    font-weight: 700;
    color: #0e1d34;
    white-space: nowrap;
  }

  .path-cart .oc-cart-item {
    align-items: flex-start;
    gap: 0.75rem;
  }

  .path-cart .oc-cart-item__image {
    width: 80px;
    height: 80px;
    border-radius: 8px;
  }

  .path-cart .oc-cart-item__details {
    padding-top: 0;
  }

  .path-cart .oc-cart-item__title {
    font-size: 0.86rem;
    font-weight: 700;
    line-height: 1.3;
    margin: 0;
    color: #0e1d34;
    text-transform: uppercase;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
  }

  .path-cart .oc-cart-item__brand {
    font-size: 0.78rem;
    font-weight: 600;
    text-transform: none;
    letter-spacing: 0;
    margin-top: 0.15rem;
  }

  .path-cart .oc-cart-item__meta-line {
    font-size: 0.76rem;
    margin-top: 0.1rem;
  }

  .path-cart .oc-cart-item__meta-label {
    color: #94a3b8;
    font-weight: 500;
  }

  .path-cart .oc-cart-item__meta-value {
    color: #94a3b8;
    font-weight: 400;
  }

  .oc-cart-page__footer {
    justify-content: stretch;
  }

  .oc-cart-summary {
    width: 100%;
  }

  .oc-cart-page-form .form-actions {
    flex-direction: column;
  }

  .oc-cart-page-form .form-actions .button,
  .oc-cart-page-form .form-actions input[type="submit"] {
    width: 100%;
  }
}

/* Empty cart recovery */
.oc-cart-empty {
  max-width: 560px;
  margin: 2.5rem auto 3.5rem;
  padding: 2rem 1.5rem;
  text-align: center;
}

.oc-cart-empty__title {
  margin: 0 0 0.65rem;
  font-size: clamp(1.6rem, 3vw, 2rem);
  color: #0e1d34;
}

.oc-cart-empty__lead {
  margin: 0 0 1.5rem;
  color: #5a6578;
  line-height: 1.55;
}

.oc-cart-empty__actions {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem 1.25rem;
  justify-content: center;
  align-items: center;
}

.oc-cart-empty__actions a {
  color: #1fa2ff;
  font-weight: 600;
  text-decoration: none;
}

.oc-cart-empty__actions a:hover {
  text-decoration: underline;
}

.oc-cart-empty__actions .btn {
  text-decoration: none;
}

.oc-free-ship--cart-page {
  margin: 0 0 1.1rem;
  padding: 0.85rem 1rem;
  background: #f7faf8;
  border: 1px solid #d7e8dc;
  border-radius: 12px;
}

.oc-free-ship--cart-page.is-qualified {
  background: #eef8f1;
  border-color: #b7dfc4;
}

.oc-free-ship--cart-page .oc-free-ship__message {
  margin: 0 0 0.5rem;
  font-size: 0.95rem;
  font-weight: 600;
  color: #1f4d33;
}

.oc-free-ship--cart-page .oc-free-ship__track {
  height: 8px;
  background: #dce8e0;
  border-radius: 999px;
  overflow: hidden;
}

.oc-free-ship--cart-page .oc-free-ship__fill {
  display: block;
  height: 100%;
  background: #2f8f57;
  border-radius: 999px;
}

.oc-cart-coupon-hint {
  margin: 0 0 1rem;
  padding: 0.65rem 0.85rem;
  background: #faf7f9;
  border: 1px solid #eedfea;
  color: #5a3a4d;
  font-size: 0.9rem;
}

body[class*="path-checkout"],
body.oc-page-checkout {
  --oc-checkout-border: #e8edf5;
  --oc-checkout-accent: #1fa2ff;
  --oc-checkout-text: #0e1d34;
  --oc-checkout-muted: #667085;
}

body.oc-page-checkout #main > .container,
body[class*="path-checkout"] #main > .container {
  max-width: 1100px;
}

/* Bootstrap table overrides in order summary */
body[class*="path-checkout"] .view-commerce-checkout-order-summary .table,
body[class*="path-checkout"] .layout-region-checkout-secondary .table {
  --bs-table-bg: transparent;
  --bs-table-striped-bg: transparent;
  --bs-table-hover-bg: transparent;
  --bs-table-accent-bg: transparent;
  border: 0;
  margin-bottom: 0;
}

body[class*="path-checkout"] .view-commerce-checkout-order-summary .table > :not(caption) > * > *,
body[class*="path-checkout"] .layout-region-checkout-secondary .table > :not(caption) > * > * {
  background-color: transparent !important;
  box-shadow: none !important;
  border-bottom: 1px solid #eef2f7;
  padding: 0.65rem 0;
}

body[class*="path-checkout"] .view-commerce-checkout-order-summary .table tbody tr:last-child > *,
body[class*="path-checkout"] .layout-region-checkout-secondary .table tbody tr:last-child > * {
  border-bottom: 0;
}

/* Checkout panes — card styling for main column only */
body[class*="path-checkout"] .layout-region-checkout-main fieldset.checkout-pane,
body[class*="path-checkout"] .layout-region-checkout-main .checkout-pane:not(.checkout-pane-login),
body[class*="path-checkout"] .layout-region-checkout-main .oc-checkout-pane-card {
  background: #fff;
  border: 1px solid var(--oc-checkout-border);
  border-radius: 14px;
  box-shadow: 0 10px 32px rgba(14, 29, 52, 0.06);
  padding: 1.25rem 1.35rem 1.4rem;
  margin-bottom: 1rem;
}

body[class*="path-checkout"] .layout-region-checkout-main fieldset.checkout-pane > legend,
body[class*="path-checkout"] .layout-region-checkout-main .checkout-pane:not(.checkout-pane-login) > legend {
  /* Title styles unified with Order summary below. */
}

body[class*="path-checkout"] .layout-region-checkout-main input[type="text"],
body[class*="path-checkout"] .layout-region-checkout-main input[type="email"],
body[class*="path-checkout"] .layout-region-checkout-main input[type="tel"],
body[class*="path-checkout"] .layout-region-checkout-main input[type="password"],
body[class*="path-checkout"] .layout-region-checkout-main select,
body[class*="path-checkout"] .layout-region-checkout-main textarea {
  width: 100%;
  min-height: 2.75rem;
  padding: 0.55rem 0.85rem;
  border: 1px solid #d8dee8;
  border-radius: 8px;
  background: #fff;
  color: var(--oc-checkout-text);
  font-size: 0.95rem;
  transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

body[class*="path-checkout"] .layout-region-checkout-main input:focus,
body[class*="path-checkout"] .layout-region-checkout-main select:focus,
body[class*="path-checkout"] .layout-region-checkout-main textarea:focus {
  border-color: var(--oc-checkout-accent);
  box-shadow: 0 0 0 3px rgba(128, 33, 81, 0.12);
  outline: 0;
}

body[class*="path-checkout"] .layout-region-checkout-main .form-item {
  margin-bottom: 0.85rem;
}

body[class*="path-checkout"] .layout-region-checkout-main .form-item label,
body[class*="path-checkout"] .layout-region-checkout-main .form-item__label {
  display: block;
  margin-bottom: 0.35rem;
  color: #344054;
  font-size: 0.86rem;
  font-weight: 600;
}

/* Payment method cards */
body[class*="path-checkout"] .checkout-pane-payment-information .form-radios,
body[class*="path-checkout"] .oc-checkout-payment-methods .form-radios {
  display: flex;
  flex-direction: column;
  gap: 0.55rem;
}

body[class*="path-checkout"] .checkout-pane-payment-information .form-radios > .form-item,
body[class*="path-checkout"] .oc-checkout-payment-methods .form-radios > .form-item,
body[class*="path-checkout"] .oc-checkout-payment-methods > .form-item {
  margin: 0;
  padding: 0.8rem 0.95rem;
  border: 1px solid #d8dee8;
  border-radius: 10px;
  background: #fff;
  transition: border-color 0.15s ease, box-shadow 0.15s ease, background 0.15s ease;
}

body[class*="path-checkout"] .checkout-pane-payment-information .form-radios > .form-item.is-selected,
body[class*="path-checkout"] .oc-checkout-payment-methods .form-item.is-selected {
  border-color: var(--oc-checkout-accent);
  background: #fff8fb;
  box-shadow: 0 0 0 3px rgba(128, 33, 81, 0.08);
}

body[class*="path-checkout"] .checkout-pane-payment-information .form-radios > .form-item label,
body[class*="path-checkout"] .oc-checkout-payment-methods .form-item label {
  display: flex;
  align-items: center;
  gap: 0.65rem;
  margin: 0;
  cursor: pointer;
  font-weight: 600;
  color: var(--oc-checkout-text);
}

body[class*="path-checkout"] .checkout-pane-payment-information input[type="radio"],
body[class*="path-checkout"] .oc-checkout-payment-methods input[type="radio"] {
  width: 1.05rem;
  height: 1.05rem;
  margin: 0;
  accent-color: var(--oc-checkout-accent);
  flex-shrink: 0;
}

/* Sidebar summary — styled card, original 35% column position unchanged */
body[class*="path-checkout"] .layout-region-checkout-secondary {
  background: #fff;
  border: 1px solid var(--oc-checkout-border);
  border-radius: 14px;
  box-shadow: 0 10px 32px rgba(14, 29, 52, 0.06);
  padding: 1.15rem 1.25rem 1.25rem;
}

body[class*="path-checkout"] .layout-region-checkout-secondary .oc-checkout-pane__title,
body[class*="path-checkout"] .layout-region-checkout-secondary .oc-checkout-summary__title {
  margin: 0 0 1rem;
}

/* Unified checkout section titles (main panes + sidebar) - match Order summary */
.oc-checkout-pane__title,
body[class*="path-checkout"] .layout-region-checkout-main .checkout-pane:not(.checkout-pane-login) > legend,
body[class*="path-checkout"] .layout-region-checkout-main .oc-checkout-pane-card > legend,
.oc-checkout-form .layout-region-checkout-main .checkout-pane:not(.checkout-pane-login) > legend,
.oc-checkout-form .layout-region-checkout-main .oc-checkout-pane-card > legend,
.oc-checkout-card > legend {
  /* Break default fieldset legend-on-border layout (Order summary uses a real heading). */
  float: left;
  width: 100%;
  box-sizing: border-box;
  display: block;
  position: static;
  color: var(--oc-checkout-text, #0e1d34);
  font-size: 1.02rem;
  font-weight: 700;
  line-height: 1.3;
  margin: 0 0 1rem;
  padding: 0;
  border: 0;
  background: transparent;
}

body[class*="path-checkout"] .layout-region-checkout-main .checkout-pane:not(.checkout-pane-login) > legend .fieldset-legend,
body[class*="path-checkout"] .layout-region-checkout-main .oc-checkout-pane-card > legend .fieldset-legend,
.oc-checkout-form .layout-region-checkout-main .checkout-pane:not(.checkout-pane-login) > legend .fieldset-legend,
.oc-checkout-form .layout-region-checkout-main .oc-checkout-pane-card > legend .fieldset-legend,
.oc-checkout-card > legend .fieldset-legend {
  float: none;
  display: inline;
  padding: 0;
  margin: 0;
  border: 0;
  font: inherit;
  color: inherit;
  vertical-align: middle;
}

/* Keep pane body below floated legend titles */
body[class*="path-checkout"] .layout-region-checkout-main .checkout-pane:not(.checkout-pane-login)::after,
body[class*="path-checkout"] .layout-region-checkout-main .oc-checkout-pane-card::after,
.oc-checkout-form .layout-region-checkout-main .checkout-pane:not(.checkout-pane-login)::after,
.oc-checkout-form .layout-region-checkout-main .oc-checkout-pane-card::after,
.oc-checkout-card::after {
  content: "";
  display: table;
  clear: both;
}

.oc-checkout-pane__title::before,
.oc-checkout-pane--contact-information > legend::before,
.oc-checkout-pane--shipping-information > legend::before,
.oc-checkout-pane--payment-information > legend::before,
.oc-checkout-pane--billing-information > legend::before,
.oc-checkout-pane--customer-comments > legend::before,
.oc-checkout-card--login > legend::before,
.oc-checkout-card--guest > legend::before {
  display: inline-block;
  margin-right: 0.55rem;
  vertical-align: -0.05em;
  font-family: bootstrap-icons !important;
  font-style: normal;
  font-weight: 400 !important;
  font-size: 1.05rem;
  color: #1fa2ff;
  line-height: 1;
  speak: never;
}

.oc-checkout-pane__title--summary {
  float: none;
  display: flex;
  align-items: center;
  gap: 0.55rem;
  margin: 0 0 1rem;
}

.oc-checkout-pane__title--summary::before {
  content: "\f242";
  display: inline-block;
  margin-right: 0;
  color: #1fa2ff;
  font-family: bootstrap-icons !important;
  font-size: 1.05rem;
  line-height: 1;
}

.oc-checkout-pane__title--coupon::before {
  content: "\f3f7";
}

.oc-checkout-pane--contact-information > legend::before {
  content: "\f32f";
}

.oc-checkout-pane--shipping-information > legend::before {
  content: "\f5e0"; /* bi-truck */
}

.oc-checkout-pane--payment-information > legend::before {
  content: "\f2dc";
}

.oc-checkout-pane--billing-information > legend::before {
  content: "\f3e8";
}

.oc-checkout-pane--customer-comments > legend::before {
  content: "\f24b";
}

.oc-checkout-card--login > legend::before {
  content: "\f4da";
}

.oc-checkout-card--guest > legend::before {
  content: "\f471";
}

/* Sidebar panes sit inside the single outer card — no nested cards */
body[class*="path-checkout"] .layout-region-checkout-secondary .checkout-pane,
body[class*="path-checkout"] .layout-region-checkout-secondary .oc-checkout-pane-card,
body[class*="path-checkout"] .layout-region-checkout-secondary .oc-checkout-summary-wrap {
  background: transparent;
  border: 0;
  border-radius: 0;
  box-shadow: none;
  padding: 0;
  margin: 0;
}

/* Primary buttons on checkout */
body[class*="path-checkout"] .oc-checkout-btn,
body[class*="path-checkout"] .layout-region-checkout-footer input[type="submit"],
body[class*="path-checkout"] .oc-checkout-coupon-form input[type="submit"] {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 2.75rem;
  padding: 0.55rem 1.35rem;
  border: 0;
  border-radius: 8px;
  background: var(--oc-checkout-accent);
  color: #fff;
  font-weight: 700;
  cursor: pointer;
}

body[class*="path-checkout"] .oc-checkout-btn:hover,
body[class*="path-checkout"] .layout-region-checkout-footer input[type="submit"]:hover,
body[class*="path-checkout"] .oc-checkout-coupon-form input[type="submit"]:hover {
  background: #651a41;
  color: #fff;
}

/* Keep Review / Place order below both columns and clickable (float layout). */
.oc-checkout-form.layout-checkout-form {
  display: flow-root;
}

.oc-checkout-form .layout-region-checkout-footer {
  clear: both;
  float: none !important;
  width: 100% !important;
  max-width: 65%;
  padding-right: 2em;
  padding-top: 0.5rem;
  position: relative;
  z-index: 2;
}

@media (max-width: 779px) {
  .oc-checkout-form .layout-region-checkout-footer {
    max-width: none;
    padding-right: 0;
  }
}

/* Do not override Commerce checkout column layout (65% main / 35% sidebar floats). */
.oc-checkout-progress {
  display: flex;
  flex-wrap: wrap;
  gap: 0.65rem 1rem;
  list-style: none;
  margin: 0 0 1.35rem;
  padding: 0;
  counter-reset: oc-checkout-progress;
}

.oc-checkout-progress__step {
  display: inline-flex;
  align-items: center;
  gap: 0.45rem;
  color: #667085;
  font-size: 0.88rem;
  font-weight: 600;
}

.oc-checkout-progress__step::before {
  counter-increment: oc-checkout-progress;
  content: counter(oc-checkout-progress);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 1.65rem;
  height: 1.65rem;
  border-radius: 50%;
  border: 1px solid #d8dee8;
  background: #fff;
  color: #667085;
  font-size: 0.78rem;
  font-weight: 700;
}

.oc-checkout-progress__step--current {
  color: #0e1d34;
}

.oc-checkout-progress__step--current::before {
  border-color: #1fa2ff;
  background: #1fa2ff;
  color: #fff;
}

.oc-checkout-progress__step--previous {
  color: #0e1d34;
}

.oc-checkout-progress__step--previous::before {
  border-color: #1fa2ff;
  color: #1fa2ff;
}

/* Login pane - equal-height side-by-side cards */
.oc-checkout-login.checkout-pane-login,
#edit-login.checkout-pane-login {
  display: grid;
  gap: 1.25rem;
  overflow: visible;
}

.oc-checkout-login .form-wrapper__returning-customer,
.oc-checkout-login .form-wrapper__guest-checkout {
  box-sizing: border-box;
  width: 100%;
  padding: 0;
  margin: 0;
  display: flex;
  min-width: 0;
}

@media (min-width: 780px) {
  .oc-checkout-login.checkout-pane-login,
  #edit-login.checkout-pane-login {
    grid-template-columns: 1fr 1fr;
    align-items: stretch;
  }

  .oc-checkout-login .form-wrapper__returning-customer,
  .oc-checkout-login .form-wrapper__guest-checkout {
    float: none;
    width: auto;
    height: 100%;
  }
}

/* Login / guest cards - consistent inner padding (Bootstrap fieldset reboot zeros padding). */
fieldset.oc-checkout-card,
.oc-checkout-card {
  display: flex;
  flex-direction: column;
  width: 100%;
  height: 100%;
  min-height: 100%;
  box-sizing: border-box;
  background: #fff;
  border: 1px solid #e8edf5;
  border-radius: 14px;
  box-shadow: 0 10px 32px rgba(14, 29, 52, 0.06);
  padding: 1.75rem 1.75rem 1.85rem !important;
  margin: 0;
  min-inline-size: 0;
}

.oc-checkout-card > legend,
.oc-checkout-card > .fieldset-legend {
  flex: 0 0 auto;
  width: calc(100% - 0.01px);
  margin: 0 0 1.15rem;
  padding: 0;
}

.oc-checkout-card .form-item {
  margin-bottom: 1rem;
}

.oc-checkout-card .form-item:last-of-type {
  margin-bottom: 0.35rem;
}

.oc-checkout-card label,
.oc-checkout-card .form-item__label {
  display: block;
  margin-bottom: 0.4rem;
  color: #344054;
  font-size: 0.86rem;
  font-weight: 600;
}

.oc-checkout-card input[type="text"],
.oc-checkout-card input[type="password"],
.oc-checkout-card input[type="email"],
.oc-checkout-card input[type="tel"],
.oc-checkout-card select,
.oc-checkout-card textarea {
  width: 100%;
  min-height: 2.85rem;
  padding: 0.7rem 0.95rem;
  border: 1px solid #d8dee8;
  border-radius: 8px;
  background: #fff;
  color: #0e1d34;
  font-size: 0.95rem;
  line-height: 1.4;
  box-sizing: border-box;
  transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

.oc-checkout-form .layout-region-checkout-main input[type="text"],
.oc-checkout-form .layout-region-checkout-main input[type="email"],
.oc-checkout-form .layout-region-checkout-main input[type="tel"],
.oc-checkout-form .layout-region-checkout-main input[type="password"],
.oc-checkout-form .layout-region-checkout-main select,
.oc-checkout-form .layout-region-checkout-main textarea {
  width: 100%;
  min-height: 2.75rem;
  padding: 0.55rem 0.85rem;
  border: 1px solid #d8dee8;
  border-radius: 8px;
  background: #fff;
  color: #0e1d34;
  font-size: 0.95rem;
  transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

.oc-checkout-card input:focus,
.oc-checkout-form .layout-region-checkout-main input:focus,
.oc-checkout-form .layout-region-checkout-main select:focus,
.oc-checkout-form .layout-region-checkout-main textarea:focus {
  border-color: #1fa2ff;
  box-shadow: 0 0 0 3px rgba(31, 162, 255, 0.18);
  outline: 0;
}

/* Checkout field validation: red highlight + hover message */
.oc-checkout-form .oc-field-error,
.oc-page-checkout .oc-field-error {
  position: relative;
}

.oc-checkout-form .oc-field-error__control,
.oc-checkout-form input.oc-field-error__control,
.oc-checkout-form select.oc-field-error__control,
.oc-checkout-form textarea.oc-field-error__control,
.oc-checkout-form .oc-field-error input,
.oc-checkout-form .oc-field-error select,
.oc-checkout-form .oc-field-error textarea,
.oc-checkout-form input.error,
.oc-checkout-form select.error,
.oc-checkout-form textarea.error {
  border-color: #d64545 !important;
  background: #fff7f7 !important;
  box-shadow: 0 0 0 3px rgba(214, 69, 69, 0.18) !important;
}

.oc-checkout-form .oc-field-error__control:focus,
.oc-checkout-form .oc-field-error input:focus,
.oc-checkout-form input.error:focus {
  border-color: #d64545 !important;
  box-shadow: 0 0 0 3px rgba(214, 69, 69, 0.28) !important;
}

.oc-checkout-form .oc-field-error__sr {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  white-space: nowrap !important;
  border: 0 !important;
}

.oc-checkout-form .oc-field-error__tip {
  position: absolute;
  left: 0;
  bottom: calc(100% + 8px);
  z-index: 30;
  max-width: min(280px, 90vw);
  padding: 0.45rem 0.65rem;
  border-radius: 6px;
  background: #7a1f1f;
  color: #fff;
  font-size: 0.78rem;
  font-weight: 500;
  line-height: 1.35;
  opacity: 0;
  visibility: hidden;
  transform: translateY(4px);
  pointer-events: none;
  transition: opacity 0.15s ease, transform 0.15s ease, visibility 0.15s ease;
  box-shadow: 0 8px 20px rgba(0, 0, 0, 0.18);
}

.oc-checkout-form .oc-field-error__tip::after {
  content: '';
  position: absolute;
  top: 100%;
  left: 1rem;
  border: 6px solid transparent;
  border-top-color: #7a1f1f;
}

.oc-checkout-form .oc-field-error:hover .oc-field-error__tip,
.oc-checkout-form .oc-field-error:focus-within .oc-field-error__tip {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
}

.oc-checkout-card__intro {
  margin: 0;
  color: #667085;
  font-size: 0.95rem;
  line-height: 1.55;
}

.oc-checkout-card__body {
  flex: 1 1 auto;
  margin: 0;
  padding: 0;
}

.oc-checkout-card__footer {
  margin-top: auto;
  padding-top: 1.35rem;
}

.oc-checkout-login-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 0.85rem 1rem;
  margin-top: auto;
  padding-top: 1.35rem;
}

.oc-checkout-card--guest .form-actions,
.oc-checkout-card--guest > .form-submit,
.oc-checkout-card--guest .oc-checkout-btn {
  margin-top: 0;
}

.oc-checkout-card--guest .form-actions {
  margin: 0;
  padding: 0;
  width: 100%;
}

.oc-checkout-card--guest .oc-checkout-card__footer .oc-checkout-btn,
.oc-checkout-card--guest .oc-checkout-card__footer input[type="submit"],
.oc-checkout-card--guest .oc-checkout-btn,
.oc-checkout-card--guest input.oc-checkout-btn,
.oc-checkout-card--guest input[type="submit"] {
  width: 100%;
  max-width: 100%;
  box-sizing: border-box;
}

.oc-checkout-card--login .oc-checkout-btn,
.oc-checkout-login-actions .oc-checkout-btn {
  min-width: 7.5rem;
}

@media (max-width: 767px) {
  fieldset.oc-checkout-card,
  .oc-checkout-card {
    padding: 1.35rem 1.25rem 1.45rem !important;
  }
}

.oc-checkout-forgot {
  color: #1fa2ff;
  font-size: 0.88rem;
  font-weight: 600;
  text-decoration: none;
}

.oc-checkout-forgot:hover {
  color: #651a41;
  text-decoration: underline;
}

/* Buttons */
.oc-checkout-btn,
.oc-checkout-form .button--primary,
.oc-checkout-form input.button[type="submit"],
.oc-checkout-form .form-actions input[type="submit"] {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.45rem;
  min-height: 2.75rem;
  padding: 0.55rem 1.35rem;
  text-decoration: none;
  cursor: pointer;
}

.oc-checkout-btn--secondary,
.oc-checkout-form .form-actions input[type="submit"].button--secondary {
  min-height: 2.75rem;
  padding: 0.55rem 1.35rem;
}

.oc-checkout-card--guest .oc-checkout-btn {
  width: 100%;
}

/* Checkout panes (contact, billing, etc.) — main column only */
.oc-checkout-form .layout-region-checkout-main .checkout-pane:not(.checkout-pane-login),
.oc-checkout-form .layout-region-checkout-main .oc-checkout-pane-card {
  background: #fff;
  border: 1px solid #e8edf5;
  border-radius: 14px;
  box-shadow: 0 10px 32px rgba(14, 29, 52, 0.06);
  padding: 1.25rem 1.35rem 1.4rem;
  margin-bottom: 1rem;
}

.oc-checkout-form .layout-region-checkout-main .checkout-pane:not(.checkout-pane-login) > .fieldset-legend,
.oc-checkout-form .layout-region-checkout-main .checkout-pane:not(.checkout-pane-login) > legend,
.oc-checkout-form .layout-region-checkout-main .oc-checkout-pane-card > .fieldset-legend,
.oc-checkout-form .layout-region-checkout-main .oc-checkout-pane-card > legend {
  /* Title styles unified in .oc-checkout-pane__title block above. */
}

.oc-checkout-form .layout-region-checkout-main .form-item {
  margin-bottom: 0.85rem;
}

.oc-checkout-form .layout-region-checkout-main .form-item label,
.oc-checkout-form .layout-region-checkout-main .form-item__label {
  display: block;
  margin-bottom: 0.35rem;
  color: #344054;
  font-size: 0.86rem;
  font-weight: 600;
}

/* Payment method cards */
.oc-checkout-payment-methods .form-radios {
  display: flex;
  flex-direction: column;
  gap: 0.55rem;
}

.oc-checkout-payment-methods > .form-item,
.oc-checkout-payment-methods .form-radios > .form-item {
  margin: 0;
  padding: 0.8rem 0.95rem;
  border: 1px solid #d8dee8;
  border-radius: 10px;
  background: #fff;
  transition: border-color 0.15s ease, box-shadow 0.15s ease, background 0.15s ease;
}

.oc-checkout-payment-methods .form-item.is-selected {
  border-color: #1fa2ff;
  background: #fff8fb;
  box-shadow: 0 0 0 3px rgba(128, 33, 81, 0.08);
}

.oc-checkout-payment-methods .form-item label {
  display: flex;
  align-items: center;
  gap: 0.65rem;
  margin: 0;
  cursor: pointer;
  font-weight: 600;
  color: #0e1d34;
}

.oc-checkout-payment-methods input[type="radio"] {
  width: 1.05rem;
  height: 1.05rem;
  margin: 0;
  accent-color: #1fa2ff;
  flex-shrink: 0;
}

/* Billing address layout */
.oc-checkout-form .address-container-inline,
.oc-checkout-form .field--name-address .fieldset-wrapper {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0 1rem;
}

.oc-checkout-form .address-container-inline > .form-item,
.oc-checkout-form .field--name-address .fieldset-wrapper > .form-item {
  margin-bottom: 0.85rem;
}

.oc-checkout-form .form-item-address-line1,
.oc-checkout-form .form-item-address-line2,
.oc-checkout-form .field--name-address .form-item:first-child {
  grid-column: 1 / -1;
}

@media (max-width: 575px) {
  .oc-checkout-form .address-container-inline,
  .oc-checkout-form .field--name-address .fieldset-wrapper {
    grid-template-columns: 1fr;
  }
}

/* Order summary sidebar items */
.layout-region-checkout-secondary .checkout-pane-order-summary,
.layout-region-checkout-secondary .oc-checkout-summary-wrap {
  margin: 0;
  padding: 0;
}

/* Order summary table */
.oc-checkout-summary-table-wrap {
  margin-bottom: 0.85rem;
  border: 1px solid #eef2f7;
  border-radius: 10px;
  overflow: hidden;
  background: #fff;
}

.layout-region-checkout-secondary .oc-checkout-summary__items {
  width: 100%;
  border-collapse: collapse;
  margin: 0;
}

.layout-region-checkout-secondary .oc-checkout-summary__th {
  padding: 0.65rem 0.75rem;
  background: #f8fafc;
  border-bottom: 1px solid #e8edf5;
  color: #667085;
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  text-align: left;
}

.layout-region-checkout-secondary .oc-checkout-summary__th--qty {
  width: 3.25rem;
  text-align: center;
}

.layout-region-checkout-secondary .oc-checkout-summary__th--total {
  width: 6.5rem;
  text-align: right;
}

.layout-region-checkout-secondary .oc-checkout-summary__items td {
  padding: 0.75rem;
  border-bottom: 1px solid #eef2f7;
  vertical-align: middle;
  font-size: 0.88rem;
  color: #344054;
  background: transparent !important;
}

.layout-region-checkout-secondary .oc-checkout-summary__row:last-child td {
  border-bottom: 0;
}

.layout-region-checkout-secondary .oc-checkout-summary__cell--product {
  min-width: 0;
}

.layout-region-checkout-secondary .oc-checkout-summary__cell--qty,
.layout-region-checkout-secondary .views-field-quantity {
  width: 3.25rem;
  text-align: center;
  color: #0e1d34;
  font-weight: 700;
  font-size: 0.82rem;
  white-space: nowrap;
  vertical-align: middle;
}

.layout-region-checkout-secondary .oc-checkout-summary__cell--total,
.layout-region-checkout-secondary .views-field-total-price__number {
  width: 6.5rem;
  text-align: right;
  font-weight: 700;
  color: #0e1d34;
  white-space: nowrap;
  font-variant-numeric: tabular-nums;
  vertical-align: middle;
}

.layout-region-checkout-secondary .views-field-purchased-entity {
  min-width: 0;
}

/* Hide default entity field labels in summary */
.layout-region-checkout-secondary .field__label,
.layout-region-checkout-secondary .field--name-list-price,
.layout-region-checkout-secondary .field--name-price {
  display: none !important;
}

/* Compact summary line item */
.oc-cart-item--summary {
  align-items: center;
  gap: 0.7rem;
}

.oc-cart-item--summary .oc-cart-item__image {
  width: 52px;
  height: 52px;
  border-radius: 8px;
  flex-shrink: 0;
}

.oc-cart-item--summary .oc-cart-item__title {
  font-size: 0.86rem;
  line-height: 1.35;
  font-weight: 600;
}

.oc-cart-item--summary .oc-cart-item__brand {
  font-size: 0.66rem;
  margin-top: 0.1rem;
}

.oc-cart-item__meta-value--muted {
  color: #667085;
  font-size: 0.76rem;
  display: block;
  margin-top: 0.1rem;
}

/* Order totals in sidebar */
.oc-checkout-summary__totals .oc-cart-summary,
.layout-region-checkout-secondary .oc-cart-summary {
  min-width: 0;
  margin-top: 0.35rem;
  padding: 0.85rem 0.95rem;
  background: #f8fafc;
  border: 1px solid #e8edf5;
  border-radius: 10px;
}

.oc-checkout-summary__totals .order-total-line,
.layout-region-checkout-secondary .order-total-line {
  display: flex;
  justify-content: space-between;
  gap: 1rem;
  padding: 0.35rem 0;
  font-size: 0.9rem;
}

.oc-checkout-summary__totals .order-total-line-value,
.layout-region-checkout-secondary .order-total-line-value {
  min-width: 6rem;
  text-align: right;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
}

.oc-checkout-summary__totals .order-total-line__total,
.layout-region-checkout-secondary .order-total-line__total {
  margin-top: 0.35rem;
  padding-top: 0.65rem;
  border-top: 1px solid #dde4ee;
  font-size: 1.02rem;
  font-weight: 800;
}

.oc-checkout-summary__totals .order-total-line__total .order-total-line-value,
.layout-region-checkout-secondary .order-total-line__total .order-total-line-value {
  color: #1fa2ff;
}

/* Coupon redemption — divider only, no second card */
.layout-region-checkout-secondary .checkout-pane-coupon-redemption,
.layout-region-checkout-secondary .oc-checkout-pane--coupon-redemption {
  margin-top: 1rem;
  padding-top: 1rem;
  border-top: 1px solid #eef2f7;
}

.layout-region-checkout-secondary .oc-checkout-pane__title--coupon {
  margin-bottom: 0.75rem;
}

.oc-checkout-coupon-form__fields,
.oc-checkout-coupon-form {
  display: flex;
  flex-direction: column;
  gap: 0.65rem;
}

.oc-checkout-coupon-form .form-item-code,
.oc-checkout-coupon-form__fields .form-item-code {
  margin: 0;
}

.oc-checkout-coupon-form .form-item-code label {
  margin-bottom: 0.35rem;
  color: #344054;
  font-size: 0.86rem;
  font-weight: 600;
}

.oc-checkout-coupon-form .form-actions,
.oc-checkout-coupon-form__fields .form-actions {
  margin: 0;
}

.oc-checkout-coupon-form .oc-checkout-btn,
.oc-checkout-coupon-form input[type="submit"] {
  width: 100%;
}

.oc-checkout-coupon-applied {
  margin-bottom: 0.75rem;
  padding: 0.65rem 0.75rem;
  border-radius: 8px;
  background: #f0faf4;
  border: 1px solid #cce8d4;
}

.oc-checkout-coupon-applied__text {
  margin: 0 0 0.5rem;
  font-size: 0.86rem;
  color: #1e4620;
}

.oc-checkout-coupon-applied__heading {
  margin: 0 0 0.45rem;
  font-size: 0.86rem;
  font-weight: 700;
  color: #1e4620;
}

.oc-checkout-coupon-applied__list {
  margin: 0;
  padding: 0;
  list-style: none;
}

.oc-checkout-coupon-applied__list li {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
  font-size: 0.86rem;
}

.oc-checkout-summary {
  background: transparent;
  border: 0;
  border-radius: 0;
  box-shadow: none;
  padding: 0;
}

.oc-checkout-summary__title {
  margin: 0 0 1rem;
  color: #0e1d34;
  font-size: 1.02rem;
  font-weight: 700;
}

.oc-checkout-summary__items {
  width: 100%;
  border-collapse: collapse;
  margin-bottom: 0.85rem;
}

.oc-checkout-summary__items td {
  padding: 0.55rem 0;
  border-bottom: 1px solid #eef2f7;
  vertical-align: top;
  font-size: 0.88rem;
  color: #344054;
}

.oc-checkout-summary__items tr:last-child td {
  border-bottom: 0;
}

.oc-checkout-summary__qty {
  width: 2.5rem;
  padding-right: 0.35rem;
  color: #667085;
  white-space: nowrap;
}

.oc-checkout-summary__price {
  text-align: right;
  font-weight: 700;
  color: #0e1d34;
  white-space: nowrap;
  font-variant-numeric: tabular-nums;
}

.oc-checkout-summary .order-total-line {
  display: flex;
  justify-content: space-between;
  gap: 1rem;
  padding: 0.35rem 0;
}

.oc-checkout-summary .order-total-line-value {
  min-width: 6rem;
  text-align: right;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
}

.oc-checkout-summary .order-total-line__total .order-total-line-value {
  color: #1fa2ff;
  font-size: 1.05rem;
}

/* Footer actions */
.oc-checkout-form .layout-region-checkout-footer .form-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem;
  margin-top: 0.25rem;
}

@media (max-width: 767px) {
  .oc-checkout-login-actions {
    flex-direction: column;
    align-items: stretch;
  }

  .oc-checkout-login-actions .oc-checkout-btn {
    width: 100%;
  }

  .oc-checkout-forgot {
    text-align: center;
  }

  .oc-checkout-form .layout-region-checkout-footer .form-actions {
    flex-direction: column;
  }

  .oc-checkout-form .layout-region-checkout-footer .form-actions .button,
  .oc-checkout-form .layout-region-checkout-footer .form-actions input[type="submit"] {
    width: 100%;
  }
}

/* Thank-you / completion - hide chrome & clutter */
body.oc-checkout-complete-page .book-appointment-icon,
body.oc-checkout-complete-page .block-commerce-checkout-progress,
body.oc-checkout-complete-page .checkout-progress,
body.oc-checkout-complete-page .layout-region-checkout-secondary,
body.oc-checkout-complete-page .oc-checkout-trust,
body.oc-checkout-complete-page .oc-checkout-register,
body.oc-checkout-complete-page .commerce-checkout-completion-register,
body.oc-page-checkout .book-appointment-icon {
  display: none !important;
}

body.oc-checkout-complete-page #main > .container {
  max-width: 42rem;
}

body.oc-checkout-complete-page .layout-checkout-form {
  display: block;
}

body.oc-checkout-complete-page .checkout-pane,
body.oc-checkout-complete-page .oc-checkout-pane-card {
  border: 0;
  box-shadow: none;
  background: transparent;
  padding: 0;
  margin: 0;
}

body.oc-checkout-complete-page .checkout-pane > legend,
body.oc-checkout-complete-page .checkout-pane::after {
  display: none !important;
}

/* Thank-you / completion */
.oc-checkout-complete {
  max-width: 40rem;
  margin: 1.75rem auto 3.5rem;
  padding: 2.5rem 2rem 2.25rem;
  background: #fff;
  border: 1px solid var(--oc-checkout-border, #e8edf5);
  border-radius: 16px;
  text-align: center;
}

.oc-checkout-complete__eyebrow {
  margin: 0 0 0.75rem;
  color: #1fa2ff;
  font-size: 0.8rem;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}

.oc-checkout-complete__title {
  margin: 0 0 0.65rem;
  color: #0e1d34;
  font-size: 1.85rem;
  font-weight: 700;
  line-height: 1.25;
}

.oc-checkout-complete__order {
  margin: 0 0 1.75rem;
  color: #5a6a7e;
}

.oc-checkout-complete__message {
  color: #334155;
  margin-bottom: 1.5rem;
}

.oc-checkout-complete__payment-instructions {
  text-align: left;
  margin: 0 0 1.75rem;
  padding: 1.35rem 1.5rem;
  background: #f8fafc;
  border-radius: 12px;
}

.oc-checkout-complete__awaiting {
  margin: 0 0 1.75rem;
  padding: 1.15rem 1.35rem;
  border-radius: 12px;
  background: #eef7ff;
  border: 1px solid #cfe8ff;
  color: #13316e;
  font-size: 0.95rem;
  line-height: 1.55;
  text-align: left;
}

.oc-checkout-complete__proof {
  text-align: left;
  margin: 0 0 2rem;
  padding: 1.6rem 1.65rem 1.75rem;
  background: linear-gradient(180deg, #fff8e8 0%, #fffdf7 100%);
  border: 2px solid #f0b429;
  border-radius: 16px;
  box-shadow: 0 10px 28px rgba(240, 180, 41, 0.2);
}

.oc-checkout-complete__proof-badge {
  display: inline-block;
  margin: 0 0 0.85rem;
  padding: 0.3rem 0.75rem;
  border-radius: 999px;
  background: #f0b429;
  color: #1a1305;
  font-size: 0.72rem;
  font-weight: 800;
  letter-spacing: 0.05em;
  text-transform: uppercase;
}

.oc-checkout-complete__proof h2 {
  margin: 0 0 0.55rem;
  padding: 0;
  font-size: 1.25rem;
  font-weight: 800;
  color: #0e1d34;
  line-height: 1.3;
}

.oc-checkout-complete__proof-lead {
  margin: 0 0 1.35rem;
  color: #4a3b12;
  font-size: 0.95rem;
  line-height: 1.55;
  font-weight: 600;
}

.oc-checkout-complete__proof-link {
  margin: 0;
}

.oc-checkout-complete__proof-link .btn {
  font-weight: 700;
}

@media (max-width: 575.98px) {
  .oc-checkout-complete {
    margin: 1rem 0 2.5rem;
    padding: 1.75rem 1.15rem 1.65rem;
  }

  .oc-checkout-complete__awaiting {
    padding: 1rem 1.1rem;
  }

  .oc-checkout-complete__proof {
    padding: 1.25rem 1.15rem 1.35rem;
  }
}

/* UPI QR payment block */
.oc-upi-pay {
  margin: 1rem 0 0;
  padding: 1.35rem 1.4rem 1.45rem;
  background: #f7fbff;
  border: 1px solid #cfe6f8;
  border-radius: 14px;
  text-align: center;
}

.oc-upi-method-label {
  margin: 0 0 0.75rem;
  color: #0e1d34;
  font-size: 0.95rem;
}

/* UPI-only checkout: never show the single payment-method radio list. */
body.oc-page-checkout .checkout-pane-payment-information .form-radios,
body.oc-page-checkout .oc-checkout-pane--payment-information .form-radios,
body[class*="path-checkout"] .checkout-pane-payment-information > .form-item-payment-information-payment-method,
body[class*="path-checkout"] .oc-checkout-pane--payment-information .form-item-payment-information-payment-method,
body[class*="path-checkout"] .oc-checkout-payment-methods {
  display: none !important;
}

.oc-free-shipping-note {
  margin: 0 0 1rem;
  padding: 0.65rem 0.85rem;
  border-radius: 8px;
  background: #f0f9ff;
  border: 1px solid #cfe6f8;
  color: #0e1d34;
  font-size: 0.92rem;
  font-weight: 600;
}

/* Keep shipping method / recalculate in the DOM (for Commerce packing) but hide UI. */
.oc-checkout-shipping--auto .form-item-shipping-information-shipments-0-shipping-method,
.oc-checkout-shipping--auto [data-drupal-selector*="shipping-method"],
.oc-checkout-shipping--auto .oc-checkout-shipping-recalculate,
.oc-checkout-shipping--auto input[name*="[recalculate_shipping]"],
.oc-checkout-shipping--auto .button[name*="recalculate_shipping"] {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  white-space: nowrap !important;
  border: 0 !important;
}

.oc-upi-pay__badge {
  display: inline-block;
  margin: 0 0 0.85rem;
  padding: 0.35rem 0.75rem;
  border-radius: 999px;
  background: #1fa2ff;
  color: #fff;
  font-size: 0.78rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}

/* Inside thank-you proof card: keep a light padded QR panel (not flush). */
.oc-checkout-complete__payment-instructions .oc-upi-pay,
.oc-checkout-complete__proof .oc-upi-pay,
.oc-upi-proof-form .oc-upi-pay {
  margin: 0 0 1.35rem;
  padding: 1.35rem 1.25rem 1.4rem;
  background: #f7fbff;
  border: 1px solid #cfe6f8;
  border-radius: 14px;
}

.oc-checkout-complete__payment-instructions .oc-upi-pay__badge,
.oc-checkout-complete__proof .oc-upi-pay__badge,
.oc-upi-proof-form .oc-upi-pay__badge {
  display: none;
}

.oc-upi-pay__lead {
  margin: 0 0 1.1rem;
  padding: 0;
  color: #334155;
  font-size: 0.95rem;
  line-height: 1.55;
  text-align: left;
}

.oc-upi-pay__amount {
  margin: 0 0 0.65rem;
  color: #0e1d34;
  font-size: 1.05rem;
}

.oc-upi-pay__qr-wrap {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin: 0.35rem auto 1rem;
  padding: 1rem;
  background: #fff;
  border: 1px solid #e8edf5;
  border-radius: 16px;
  box-shadow: 0 8px 24px rgba(14, 29, 52, 0.06);
}

.oc-upi-pay__qr {
  display: block;
  width: min(260px, 70vw);
  height: auto;
}

.oc-upi-pay__name {
  margin: 0 0 0.35rem;
  color: #0e1d34;
  font-size: 1.05rem;
  font-weight: 700;
}

.oc-upi-pay__id {
  margin: 0;
  color: #13316e;
  font-size: 0.98rem;
}

.oc-upi-proof-form .form-item {
  margin-bottom: 1.15rem;
}

.oc-upi-proof-form .form-actions {
  margin-top: 0.35rem;
  padding-top: 0.25rem;
}

.oc-upi-pay__hint {
  margin: 0;
  color: #667085;
  font-size: 0.88rem;
  line-height: 1.5;
  text-align: left;
}

.oc-upi-pay__next-step {
  margin: 1rem 0 0;
  padding: 0.9rem 1rem;
  text-align: left;
  border-radius: 10px;
  background: linear-gradient(180deg, #fff8e8 0%, #fff3d6 100%);
  border: 2px solid #f0b429;
  box-shadow: 0 6px 18px rgba(240, 180, 41, 0.18);
}

.oc-upi-pay__next-step-label {
  display: inline-block;
  margin: 0 0 0.4rem;
  padding: 0.2rem 0.55rem;
  border-radius: 999px;
  background: #f0b429;
  color: #1a1305;
  font-size: 0.72rem;
  font-weight: 800;
  letter-spacing: 0.05em;
  text-transform: uppercase;
}

.oc-upi-pay__next-step-text {
  margin: 0;
  color: #1a1305;
  font-size: 0.95rem;
  font-weight: 600;
  line-height: 1.5;
}

.oc-upi-pay__next-step-text strong {
  color: #0e1d34;
  text-decoration: underline;
  text-decoration-thickness: 2px;
  text-underline-offset: 2px;
}

.oc-checkout-complete__payment-instructions .oc-upi-pay__next-step {
  display: none;
}

/* Review step - clean summaries */
.oc-checkout-form--review .layout-region-checkout-main .checkout-pane,
.oc-checkout-form--review .layout-region-checkout-main .oc-checkout-pane-card {
  margin-bottom: 1rem;
}

.oc-checkout-form--review .checkout-review-edit-link {
  margin-left: 0.45rem;
  font-size: 0.86rem;
  font-weight: 600;
}

.oc-checkout-form--review .checkout-review-edit-link a {
  color: #1fa2ff;
  text-decoration: none;
}

.oc-checkout-form--review .checkout-review-edit-link a:hover {
  text-decoration: underline;
}

.oc-checkout-review-note {
  margin: 0.85rem 0 0;
  padding: 0.65rem 0.85rem;
  border-radius: 8px;
  background: #f0f9ff;
  border: 1px solid #cfe6f8;
  color: #0e1d34;
  font-size: 0.9rem;
  font-weight: 600;
}

.oc-checkout-review-payment__method {
  margin: 0 0 0.85rem;
  color: #0e1d34;
  font-size: 1rem;
}

.oc-upi-pay__next-step--review {
  margin-top: 0;
}

.oc-checkout-legal-wrap {
  margin: 1rem 0 0.75rem;
  padding: 1rem 1.15rem 1rem 1.15rem;
  border-radius: 10px;
  background: #f8fafc;
  border: 1px solid #e8edf5;
  text-align: left;
  overflow: visible;
}

.oc-checkout-legal-wrap .form-item,
.oc-checkout-legal-wrap .js-form-type-checkbox,
.oc-checkout-legal-wrap .form-check {
  display: flex !important;
  align-items: flex-start;
  gap: 0.75rem;
  margin: 0 !important;
  padding: 0 !important;
  min-height: 0;
}

.oc-checkout-legal-wrap input[type="checkbox"],
.oc-checkout-legal-wrap .form-check-input,
.oc-checkout-legal-wrap .oc-checkout-legal {
  position: static !important;
  float: none !important;
  flex: 0 0 auto;
  width: 1.15rem !important;
  height: 1.15rem !important;
  margin: 0.2rem 0 0 !important;
  padding: 0 !important;
  transform: none !important;
  accent-color: #1fa2ff;
}

.oc-checkout-legal-wrap label,
.oc-checkout-legal-wrap .form-check-label,
.oc-checkout-legal-wrap .option {
  position: static !important;
  display: block;
  flex: 1 1 auto;
  margin: 0 !important;
  padding: 0 !important;
  color: #334155;
  font-size: 0.95rem;
  font-weight: 500;
  line-height: 1.5;
}

.oc-checkout-legal-wrap a {
  color: #1fa2ff;
  font-weight: 600;
  text-decoration: none;
}

.oc-checkout-legal-wrap a:hover {
  text-decoration: underline;
}

/* Hide leftover shipping-method labels if a shipment formatter still prints them. */
.oc-checkout-form--review .field--name-shipping-method,
.oc-checkout-form--review .commerce-shipment--checkout .field--name-shipping-method {
  display: none !important;
}

.oc-checkout-complete__actions {
  list-style: none;
  margin: 0.25rem 0 0;
  padding: 0.35rem 0 0;
  display: flex;
  flex-wrap: wrap;
  gap: 0.85rem 1.1rem;
  justify-content: center;
  align-items: center;
}

.oc-checkout-complete__actions a:not(.btn) {
  color: #1fa2ff;
  font-weight: 600;
  text-decoration: none;
}

.oc-checkout-complete__actions a:not(.btn):hover {
  text-decoration: underline;
}

.oc-checkout-register {
  margin: 2rem auto 0;
  max-width: 32rem;
  padding: 1.5rem 1.35rem 1.65rem;
  border: 1px solid #ececec;
  background: #fff;
  text-align: left;
}

.oc-checkout-register__text h2 {
  margin: 0 0 0.45rem;
  color: #1a1a1a;
  font-size: 1.25rem;
  font-weight: 700;
  line-height: 1.3;
}

.oc-checkout-register__text p {
  margin: 0 0 1.15rem;
  color: #666;
  font-size: 0.95rem;
  line-height: 1.55;
}

.oc-checkout-register__form .form-item {
  margin-bottom: 1rem;
}

.oc-checkout-register__form label {
  font-weight: 600;
  color: #333;
}

.oc-checkout-register__form .description {
  color: #777;
  font-size: 0.85rem;
}

.oc-checkout-register__form .button,
.oc-checkout-register__form .form-submit {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 2.75rem;
  padding: 0.65rem 1.25rem;
  font-weight: 700;
  cursor: pointer;
}

.oc-checkout-trust {
  margin-top: 1.25rem;
  padding-top: 1rem;
  border-top: 1px solid #eef2f7;
  background: transparent;
}

.oc-checkout-trust__title {
  margin: 0 0 0.75rem;
  font-size: 0.98rem;
  font-weight: 700;
  color: #0e1d34;
}

.oc-checkout-trust__list {
  list-style: none;
  margin: 0;
  padding: 0;
}

.oc-checkout-trust__list > li {
  position: relative;
  display: block;
  margin: 0;
  padding: 0.35rem 0 0.35rem 1.1rem;
  color: #475569;
  font-size: 0.95rem;
  line-height: 1.5;
  border: 0;
  background: transparent;
}

.oc-checkout-trust__list > li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0.72rem;
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background: #1fa2ff;
}

.path-track-order #main > .container,
.path-user .oc-user-orders {
  max-width: 920px;
}

.oc-track-order,
.oc-user-orders,
.oc-order-detail {
  background: #fff;
  border: 1px solid #e8edf5;
  border-radius: 14px;
  box-shadow: 0 10px 32px rgba(14, 29, 52, 0.06);
  padding: 1.5rem 1.5rem 1.75rem;
  margin: 1.5rem 0 2.5rem;
}

.oc-track-order__title,
.oc-user-orders__title,
.oc-track-order__result-title {
  color: #0e1d34;
  font-size: 1.65rem;
  font-weight: 700;
  margin: 0 0 0.75rem;
}

.oc-track-order__intro {
  color: #5a6a7e;
  margin: 0 0 1.25rem;
}

.oc-track-order-form .form-item {
  margin-bottom: 1rem;
}

.oc-track-order-form label {
  font-weight: 600;
  color: #0e1d34;
}

.oc-track-order-form input[type="text"],
.oc-track-order-form input[type="email"] {
  border: 1px solid #d5dee8;
  border-radius: 8px;
  padding: 0.65rem 0.85rem;
  width: 100%;
  max-width: 420px;
}

.oc-track-order__submit,
.oc-track-order-form .button--primary {
  font-weight: 700;
  padding: 0.7rem 1.25rem;
}

.oc-track-order__result {
  border-top: 1px solid #e8edf5;
  margin-top: 1.75rem;
  padding-top: 1.5rem;
}

.oc-track-order__meta {
  list-style: none;
  margin: 0 0 1.25rem;
  padding: 0;
  display: grid;
  gap: 0.35rem;
  color: #334155;
}

.oc-user-orders__header {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  justify-content: space-between;
  gap: 0.75rem;
  margin-bottom: 1.25rem;
}

.oc-user-orders__track-link a {
  color: #0e1d34;
  font-weight: 600;
  text-decoration: underline;
}

.oc-user-orders__table-wrap table {
  width: 100%;
  margin: 0;
}

.oc-user-orders__table-wrap th {
  background: #f8fafc;
  border-bottom: 1px solid #e8edf5;
  color: #0e1d34;
  font-size: 0.78rem;
  font-weight: 700;
  letter-spacing: 0.06em;
  padding: 0.85rem 0.9rem;
  text-transform: uppercase;
}

.oc-user-orders__table-wrap td {
  border-bottom: 1px solid #eef2f7;
  padding: 0.9rem;
  vertical-align: middle;
}

.oc-user-orders__empty {
  color: #5a6a7e;
  padding: 1rem 0;
}

.oc-order-shipments {
  background: #f8fafc;
  border: 1px solid #e8edf5;
  border-radius: 10px;
  margin-bottom: 1.25rem;
  padding: 1rem 1.15rem;
}

.oc-order-shipments__title {
  font-size: 1rem;
  font-weight: 700;
  margin: 0 0 0.75rem;
  color: #0e1d34;
}

.oc-order-shipments__list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: 0.85rem;
}

.oc-order-shipments__row {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  gap: 0.5rem;
}

.oc-order-shipments__label {
  font-weight: 600;
  color: #0e1d34;
}

.oc-order-shipments__state {
  background: #e8edf5;
  border-radius: 999px;
  color: #334155;
  font-size: 0.78rem;
  font-weight: 600;
  padding: 0.2rem 0.65rem;
}

.oc-order-shipments__method,
.oc-order-shipments__tracking {
  color: #5a6a7e;
  font-size: 0.92rem;
  margin-top: 0.25rem;
}

.oc-order-shipments__tracking code {
  background: #fff;
  border: 1px solid #d5dee8;
  border-radius: 4px;
  padding: 0.1rem 0.4rem;
}

.oc-order-detail__customer,
.oc-order-detail__info {
  margin-top: 1rem;
}

.oc-order-detail .field__label {
  font-weight: 700;
  color: #0e1d34;
  margin-bottom: 0.35rem;
}

.oc-order-invoices {
  margin-bottom: 1.25rem;
  padding-bottom: 1rem;
  border-bottom: 1px solid #e8edf5;
}

.oc-order-invoices__title {
  font-size: 1.1rem;
  font-weight: 700;
  margin: 0 0 0.65rem;
  color: #0e1d34;
}

.oc-order-invoices__list {
  list-style: none;
  margin: 0;
  padding: 0;
}

.oc-order-invoices__download {
  display: inline-block;
  font-weight: 600;
  color: #1fa2ff;
  text-decoration: none;
}

.oc-order-invoices__download:hover {
  text-decoration: underline;
}

.oc-order-buy-again {
  margin-bottom: 1.25rem;
  padding-bottom: 1rem;
  border-bottom: 1px solid #e8edf5;
}

.oc-order-buy-again__title {
  font-size: 1.1rem;
  font-weight: 700;
  margin: 0 0 0.65rem;
  color: #0e1d34;
}

.oc-order-buy-again__list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem 1rem;
}

.oc-order-buy-again__list a {
  font-weight: 600;
  color: #1fa2ff;
  text-decoration: none;
}

.oc-order-buy-again__list a:hover {
  text-decoration: underline;
}

.oc-order-receipt-link {
  margin: 0 0 1rem;
}

.oc-order-receipt-link a {
  font-weight: 600;
  color: #1fa2ff;
  text-decoration: none;
}

.oc-order-receipt-link a:hover {
  text-decoration: underline;
}

.oc-wishlist {
  max-width: 42rem;
  margin: 0 auto 3rem;
  padding: 1.5rem 1rem 2rem;
}

.oc-wishlist__title {
  font-size: 1.75rem;
  margin-bottom: 1rem;
}

.oc-wishlist__empty {
  color: #555;
  margin-bottom: 1.25rem;
}

.oc-wishlist__list {
  list-style: none;
  margin: 0;
  padding: 0;
  border-top: 1px solid #e8e4df;
}

.oc-wishlist__item {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  padding: 0.9rem 0;
  border-bottom: 1px solid #e8e4df;
}

.oc-wishlist__link {
  color: inherit;
  font-weight: 600;
  text-decoration: none;
}

.oc-wishlist__link:hover {
  text-decoration: underline;
}

.oc-wishlist__remove {
  flex-shrink: 0;
  font-size: 0.875rem;
  color: #8a4b4b;
  text-decoration: none;
}

.oc-wishlist__remove:hover {
  text-decoration: underline;
}

.commerce-product__wishlist {
  margin-top: 0.85rem;
}

.oc-wishlist-btn {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  font-size: 0.9rem;
  color: #5a4a42;
  text-decoration: none;
  border-bottom: 1px solid transparent;
}

.oc-wishlist-btn:hover {
  border-bottom-color: currentColor;
}

.oc-wishlist-btn--active {
  color: #9a3d4a;
  font-weight: 600;
}

.oc-returns,
.path-return-request #main > .container {
  max-width: 36rem;
}

.oc-returns-form .form-item {
  margin-bottom: 1rem;
}

.oc-returns-form label {
  font-weight: 600;
}

.oc-returns-form input[type="text"],
.oc-returns-form input[type="email"],
.oc-returns-form select,
.oc-returns-form textarea {
  width: 100%;
  max-width: 100%;
}

.oc-returns__intro {
  color: #555;
  margin-bottom: 1.25rem;
}

.oc-returns__submit,
.oc-returns-form .button--primary {
  margin-top: 0.5rem;
}

/* OcMono my account */

.oc-account-hub {
  max-width: 72rem;
  margin: 0 auto 3rem;
  padding: 1.5rem 1rem 2.5rem;
}

.oc-account-hub__title {
  margin: 0 0 1.25rem;
  padding-bottom: 1rem;
  border-bottom: 1px solid #ebebeb;
  font-size: clamp(1.6rem, 2.5vw, 1.9rem);
  font-weight: 700;
  color: #0e1d34;
}

.oc-account-hub__layout {
  display: grid;
  grid-template-columns: minmax(12rem, 15rem) minmax(0, 1fr);
  gap: 1.5rem;
  align-items: start;
}

.oc-account-hub__nav {
  display: flex;
  flex-direction: column;
  background: #fff;
}

.oc-account-hub__nav-link {
  display: flex;
  align-items: center;
  gap: 0.35rem;
  border: 1px solid #ebebeb;
  border-bottom: 0;
  padding: 0.9rem 1rem;
  color: #111;
  font-weight: 600;
  font-size: 0.92rem;
  letter-spacing: 0.02em;
  text-transform: uppercase;
  text-decoration: none;
  line-height: 1.4;
  background: #fff;
  transition: background 0.2s ease, color 0.2s ease;
}

.oc-account-hub__nav-link:last-child {
  border-bottom: 1px solid #ebebeb;
}

.oc-account-hub__nav-link i {
  width: 1.4rem;
  font-size: 0.95rem;
  text-align: center;
}

.oc-account-hub__nav-link:hover,
.oc-account-hub__nav-link.is-active {
  background-color: #1fa2ff;
  color: #fff;
  border-color: #1fa2ff;
}

.oc-account-hub__panel {
  background: #fff;
  border: 1px solid #ebebeb;
  padding: 1.75rem 1.5rem;
  font-size: 0.95rem;
  color: #444;
}

.oc-account-hub__panel[hidden] {
  display: none !important;
}

.oc-account-hub__panel h2 {
  margin: 0 0 1rem;
  padding-bottom: 1rem;
  border-bottom: 1px solid #ebebeb;
  font-size: 1.55rem;
  font-weight: 700;
  color: #0e1d34;
}

.oc-account-hub__welcome {
  margin-bottom: 0.85rem;
  line-height: 1.6;
}

.oc-account-hub__welcome a {
  color: #1fa2ff;
  font-weight: 600;
}

.oc-account-hub__welcome a:hover {
  text-decoration: underline;
}

.oc-account-hub__welcome strong {
  font-weight: 700;
  color: #0e1d34;
}

.oc-account-hub__quick {
  list-style: none;
  margin: 1.25rem 0 0;
  padding: 0;
  display: grid;
  gap: 0.5rem;
}

.oc-account-hub__quick a {
  color: #1fa2ff;
  font-weight: 600;
  text-decoration: none;
}

.oc-account-hub__quick a:hover {
  text-decoration: underline;
}

.oc-account-hub__table-wrap {
  overflow-x: auto;
  margin-top: 0.5rem;
}

.oc-account-hub__table {
  width: 100%;
  border-collapse: collapse;
  min-width: 36rem;
}

.oc-account-hub__table th,
.oc-account-hub__table td {
  padding: 0.85rem 0.65rem;
  border-bottom: 1px solid #ebebeb;
  text-align: left;
  vertical-align: top;
}

.oc-account-hub__table th {
  font-size: 0.8rem;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: #667085;
  font-weight: 700;
}

.oc-account-hub__table td a {
  color: #1fa2ff;
  font-weight: 600;
  text-decoration: none;
}

.oc-account-hub__table td a:hover {
  text-decoration: underline;
}

.oc-account-hub__order-name {
  display: block;
  color: #0e1d34;
  font-weight: 600;
}

.oc-account-hub__order-no {
  display: block;
  margin-top: 0.15rem;
  font-size: 0.82rem;
  color: #667085;
}

.oc-account-hub__more {
  margin-top: 1rem;
}

.oc-account-hub__more a {
  color: #1fa2ff;
  font-weight: 600;
}

.oc-account-hub__addresses {
  display: grid;
  gap: 1.25rem;
}

.oc-account-hub__address h3 {
  margin: 0 0 0.5rem;
  font-size: 1.05rem;
  color: #0e1d34;
  border: 0;
  padding: 0;
}

.oc-account-hub__badge {
  display: inline-block;
  margin-left: 0.35rem;
  padding: 0.1rem 0.45rem;
  border-radius: 2px;
  background: #f3e8ef;
  color: #1fa2ff;
  font-size: 0.7rem;
  font-weight: 700;
  text-transform: uppercase;
  vertical-align: middle;
}

.oc-account-hub__address-body p {
  margin: 0 0 0.15rem;
}

.oc-account-hub__phone {
  margin-top: 0.5rem;
}

.oc-account-hub__edit-btn {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  margin-top: 0.5rem;
  color: #1fa2ff;
  font-weight: 700;
  text-decoration: none;
}

.oc-account-hub__edit-btn:hover {
  text-decoration: underline;
}

.oc-account-hub__payments {
  margin: 0 0 1rem;
  padding-left: 1.1rem;
}

.oc-account-hub__form .form-item {
  margin-bottom: 1rem;
}

.oc-account-hub__form label {
  font-weight: 600;
  color: #0e1d34;
}

.oc-account-hub__form .button,
.oc-account-hub__form .form-submit {
  font-weight: 700;
  padding: 0.65rem 1.25rem;
}

@media (max-width: 767px) {
  .oc-account-hub__layout {
    grid-template-columns: 1fr;
  }

  .oc-account-hub__nav {
    flex-direction: row;
    flex-wrap: wrap;
  }

  .oc-account-hub__nav-link {
    flex: 1 1 auto;
    border-bottom: 1px solid #ebebeb;
    font-size: 0.78rem;
    padding: 0.7rem 0.65rem;
  }

  .oc-account-hub__panel {
    padding: 1.25rem 1rem;
  }
}

/* Blog listing + OcMono article detail
 */

:root {
  --blog-ink: #222;
  --blog-muted: #848484;
  --blog-line: #e6e6e6;
  --blog-accent: var(--brand-primary, #1fa2ff);
}

.blog-details {
  padding: 2.5rem 0 4rem;
  background: #fff;
}

.oc-blog-article-page nav.breadcrumbs.oc-interior-hero,
.oc-blog-article-page section.breadcrumbs.oc-interior-hero {
  padding: 28px 0 22px;
}

.blog-article__media {
  margin: 0 0 2rem;
  background: #fff;
}

.blog-article__media .container {
  max-width: 960px;
}

.blog-article__media .blog-article__image {
  margin: 0;
  border-radius: 0;
  overflow: hidden;
  box-shadow: none;
}

.blog-article__media .blog-article__image img,
.blog-article__media .image-box img {
  display: block;
  width: 100%;
  height: auto;
  max-height: 480px;
  object-fit: cover;
}

.oc-blog-article-page #content-inner.container {
  max-width: 960px;
}

.blog-layout {
  align-items: flex-start;
}

.blog-layout__main {
  margin-bottom: 2.5rem;
}

.blog-layout__sidebar {
  margin-bottom: 2.5rem;
}

/* —— Detail: featured image + content —— */

.blog-details-content .blog-article__image,
.blog-details-content .image-box {
  position: relative;
  display: block;
  margin: 0;
}

.blog-details-content .blog-article__image img,
.blog-details-content .image-box img {
  display: block;
  width: 100%;
  height: auto;
}

.blog-details-content > .blog-article__inner {
  position: relative;
  display: block;
  padding: 0;
  max-width: 760px;
  margin: 0 auto;
}

.blog-article__meta,
.blog-details-content .post-info {
  list-style: none;
  margin: 0 0 1.5rem;
  padding: 0;
}

.blog-article__meta li,
.blog-details-content .post-info li {
  position: relative;
  display: inline-block;
  font-size: 15px;
  line-height: 26px;
  color: var(--blog-ink);
  margin-right: 17px;
  padding-right: 0;
}

.blog-article__meta li:last-child,
.blog-details-content .post-info li:last-child {
  margin-right: 0;
}

.blog-article__meta li:not(:last-child)::after,
.blog-details-content .post-info li:not(:last-child)::after {
  position: absolute;
  content: "";
  background: var(--blog-muted);
  width: 1px;
  height: 13px;
  top: 6px;
  right: -11px;
}

.blog-article__body,
.blog-details-content .text {
  position: relative;
  margin-bottom: 2.5rem;
  font-size: 1.05rem;
  line-height: 1.75;
  color: #444;
}

.blog-article__body p {
  font-weight: 400;
  margin-bottom: 1.5rem;
}

.blog-article__body p:last-child,
.blog-details-content .text p:last-child {
  margin-bottom: 0;
}

.blog-article__body h2,
.blog-article__body h3,
.blog-article__body h4 {
  position: relative;
  display: block;
  font-family: "Montserrat", sans-serif;
  font-size: 1.5rem;
  line-height: 1.35;
  font-weight: 600;
  color: var(--blog-ink);
  padding-top: 1.5rem;
  margin: 0 0 1.25rem;
}

.blog-article__body ul,
.blog-article__body ol {
  padding-left: 1.25rem;
  margin-bottom: 1.5rem;
}

.blog-article__body img {
  max-width: 100%;
  height: auto;
}

/* —— Tags + social —— */

.blog-article__share,
.blog-details-content .post-share-option {
  position: relative;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  gap: 2rem;
  padding-bottom: 2.5rem;
  margin-bottom: 2.5rem;
  border-bottom: 1px solid var(--blog-line);
}

.blog-article__share h4,
.blog-details-content .post-share-option h4 {
  display: block;
  font-size: 1.15rem;
  line-height: 1.3;
  font-weight: 600;
  color: var(--blog-ink);
  margin: 0 0 1rem;
}

.blog-article__tags .tags-list,
.blog-article__social .social-links {
  list-style: none;
  margin: 0;
  padding: 0;
}

.blog-article__tags .tags-list li,
.blog-details-content .tags-box li {
  display: inline-block;
  margin: 0 7px 8px 0;
}

.blog-article__tags .tags-list a,
.blog-details-content .tags-box li a {
  display: inline-block;
  font-size: 14px;
  line-height: 26px;
  color: var(--blog-ink);
  padding: 6px 20px;
  text-align: center;
  border: 1px solid var(--blog-line);
  text-decoration: none;
  transition: background 0.25s ease, color 0.25s ease, border-color 0.25s ease;
}

.blog-article__tags .tags-list a:hover,
.blog-article__tags .tags-list a:focus {
  color: #fff;
  background: var(--blog-accent);
  border-color: var(--blog-accent);
}

.blog-article__social .social-links li {
  display: inline-block;
  margin-right: 7px;
}

.blog-article__social .social-links a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  font-size: 15px;
  color: var(--blog-muted);
  border: 1px solid var(--blog-line);
  text-decoration: none;
  transition: background 0.25s ease, color 0.25s ease, border-color 0.25s ease;
}

.blog-article__social .social-links a:hover,
.blog-article__social .social-links a:focus {
  color: #fff;
  background: var(--blog-accent);
  border-color: var(--blog-accent);
}

/* —— Comments (Drupal + OcMono spacing) —— */

.blog-article__comments .comment-form,
.blog-article__comments .comment {
  margin-bottom: 1.5rem;
}

.blog-article__comments h2,
.blog-article__comments .title,
.blog-details-content .group-title h3 {
  font-size: 1.5rem;
  line-height: 1.3;
  font-weight: 600;
  color: var(--blog-ink);
  margin: 0 0 1.25rem;
  padding: 0;
}

.blog-article__comments article.comment {
  position: relative;
  padding: 0 0 1.75rem 0;
  margin-bottom: 1.5rem;
  border-bottom: 1px solid var(--blog-line);
}

.blog-article__comments .indented {
  margin-left: 2.5rem;
}

.blog-article__comments .comment__meta,
.blog-article__comments .comment-submitted {
  font-size: 0.95rem;
  color: var(--blog-muted);
  margin-bottom: 0.75rem;
}

.blog-article__comments .form-actions .button,
.blog-article__comments .form-actions .btn {
  background: var(--blog-accent);
  border-color: var(--blog-accent);
  color: #fff;
  padding: 0.65rem 1.5rem;
  font-weight: 600;
}

/* Previous / next post navigation */
.blog-article__post-nav {
  margin: 0 0 1rem;
  padding: 2rem 0 0;
}

.blog-article__post-nav-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1.5rem 2rem;
  align-items: stretch;
}

.blog-post-nav__placeholder {
  display: block;
}

.blog-post-nav__item {
  display: flex;
  align-items: center;
  gap: 1rem;
  min-width: 0;
  padding: 1rem;
  text-decoration: none;
  color: inherit;
  border: 1px solid #e8edf5;
  background: #fff;
  transition: border-color 0.25s ease, box-shadow 0.25s ease, transform 0.25s ease;
}

.blog-post-nav__item:hover,
.blog-post-nav__item:focus {
  border-color: var(--blog-accent);
  box-shadow: 0 12px 28px rgba(14, 29, 52, 0.08);
  transform: translateY(-2px);
}

.blog-post-nav__item--next {
  flex-direction: row-reverse;
  text-align: right;
  margin-left: auto;
}

.blog-post-nav__thumb {
  flex: 0 0 100px;
  width: 100px;
  height: 80px;
  margin: 0;
  overflow: hidden;
  background: #f3f5f8;
}

.blog-post-nav__thumb img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.35s ease;
}

.blog-post-nav__item:hover .blog-post-nav__thumb img,
.blog-post-nav__item:focus .blog-post-nav__thumb img {
  transform: scale(1.05);
}

.blog-post-nav__content {
  display: flex;
  flex-direction: column;
  gap: 0.35rem;
  min-width: 0;
}

.blog-post-nav__label {
  display: block;
  font-size: 0.78rem;
  font-weight: 600;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--blog-muted);
}

.blog-post-nav__title {
  display: block;
  font-family: "Montserrat", sans-serif;
  font-size: 1rem;
  font-weight: 600;
  line-height: 1.4;
  color: var(--blog-ink);
}

.blog-post-nav__item:hover .blog-post-nav__title,
.blog-post-nav__item:focus .blog-post-nav__title {
  color: var(--blog-accent);
}

@media (max-width: 767px) {
  .blog-article__post-nav-grid {
    grid-template-columns: 1fr;
    gap: 1rem;
  }

  .blog-post-nav__item--next {
    flex-direction: row;
    text-align: left;
    margin-left: 0;
  }

  .blog-post-nav__placeholder {
    display: none;
  }

  .blog-post-nav__thumb {
    flex-basis: 84px;
    width: 84px;
    height: 68px;
  }

  .blog-post-nav__title {
    font-size: 0.95rem;
  }
}

/* Popular posts - same grid cards as blog listing */
.blog-article__popular {
  margin-top: 3.5rem;
  padding-top: 2.5rem;
  border-top: 1px solid var(--blog-line);
}

.blog-article__popular.blog-listing {
  padding: 2.5rem 0 0;
  background: transparent;
}

.blog-article__popular .ocmono-sec-title {
  margin-bottom: 2rem;
}

.blog-article__popular .news-block {
  margin-bottom: 1.75rem;
}

.blog-article__popular .news-block-one .inner-box {
  position: relative;
  display: block;
  background: #fff;
  height: 100%;
  transition: box-shadow 0.45s ease;
}

.blog-article__popular .news-block-one .inner-box:hover {
  box-shadow: 0 20px 30px rgba(0, 0, 0, 0.05);
}

.blog-article__popular .news-block-one .image-box {
  position: relative;
  display: block;
  margin: 0;
  overflow: hidden;
}

.blog-article__popular .news-block-one .image-box a {
  display: block;
}

.blog-article__popular .news-block-one .image-box img {
  display: block;
  width: 100%;
  height: 240px;
  object-fit: cover;
  transition: opacity 0.45s ease, transform 0.45s ease;
}

.blog-article__popular .news-block-one .inner-box:hover .image-box img {
  opacity: 0.25;
  transform: scale(1.05);
}

.blog-article__popular .news-block-one .lower-content {
  position: relative;
  padding: 1.4rem 1.75rem 1.5rem;
  border: 1px solid #e1e5eb;
  border-top: none;
  transition: border-color 0.45s ease;
}

.blog-article__popular .news-block-one .inner-box:hover .lower-content {
  border-color: #fff;
}

.blog-article__popular .news-block-one .post-date {
  position: relative;
  display: block;
  font-size: 15px;
  color: var(--blog-ink);
  padding-left: 25px;
  margin-bottom: 0.65rem;
}

.blog-article__popular .news-block-one .post-date::before {
  position: absolute;
  content: "";
  background: var(--blog-ink);
  width: 15px;
  height: 2px;
  left: 0;
  top: 12px;
}

.blog-article__popular .news-block-one h3 {
  font-family: "Montserrat", sans-serif;
  font-size: 1.35rem;
  font-weight: 600;
  color: var(--blog-ink);
  line-height: 1.3;
  margin: 0 0 0.4rem;
}

.blog-article__popular .news-block-one h3 a {
  color: var(--blog-ink);
  text-decoration: none;
  transition: color 0.25s ease;
}

.blog-article__popular .news-block-one h3 a:hover,
.blog-article__popular .news-block-one h3 a:focus {
  color: var(--blog-accent);
}

.blog-article__popular .news-block-one .post-info {
  list-style: none;
  margin: 0 0 1rem;
  padding: 0;
}

.blog-article__popular .news-block-one .post-info li {
  position: relative;
  display: inline-block;
  font-size: 15px;
  color: var(--blog-muted);
  margin-right: 18px;
}

.blog-article__popular .news-block-one .post-info li:last-child {
  margin-right: 0;
}

.blog-article__popular .news-block-one .blog-teaser {
  color: #555;
  font-size: 0.95rem;
  line-height: 1.55;
  margin-bottom: 0.85rem;
}

.blog-article__popular .news-block-one .blog-teaser p {
  margin: 0;
}

.blog-article__popular .news-block-one .link a {
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  font-size: 15px;
  line-height: 26px;
  color: var(--blog-ink);
  font-weight: 500;
  text-decoration: none;
  transition: color 0.25s ease;
}

.blog-article__popular .news-block-one .link a i {
  font-size: 1rem;
  transition: transform 0.35s ease;
}

.blog-article__popular .news-block-one .link a:hover,
.blog-article__popular .news-block-one .link a:focus {
  color: var(--blog-accent);
}

.blog-article__popular .news-block-one .link a:hover i,
.blog-article__popular .news-block-one .link a:focus i {
  transform: translateX(4px);
}

@media (max-width: 767px) {
  .blog-article__popular .news-block-one .image-box img {
    height: 200px;
  }

  .blog-article__popular .news-block-one h3 {
    font-size: 1.15rem;
  }

  .blog-article__popular .news-block-one .lower-content {
    padding: 1.15rem 1.25rem 1.25rem;
  }
}

/* —— Sidebar widgets —— */

.blog-sidebar {
  position: relative;
}

@media (min-width: 992px) {
  .blog-sidebar {
    margin-left: 1.5rem;
  }
}

.blog-sidebar .sidebar-widget {
  position: relative;
  margin-bottom: 2.75rem;
}

.blog-sidebar .widget-title {
  margin-bottom: 1.25rem;
}

.blog-sidebar .widget-title h3 {
  font-family: "Montserrat", sans-serif;
  font-size: 1.35rem;
  line-height: 1.35;
  font-weight: 600;
  color: var(--blog-ink);
  margin: 0;
}

.blog-sidebar .search-form .form-group {
  position: relative;
  margin: 0;
}

.blog-sidebar .search-form input[type="search"] {
  display: block;
  width: 100%;
  height: 55px;
  border: 1px solid #e5e5e5;
  font-size: 15px;
  color: var(--blog-muted);
  padding: 10px 50px 10px 20px;
  background: #fff;
  outline: none;
  transition: border-color 0.25s ease;
}

.blog-sidebar .search-form input[type="search"]:focus {
  border-color: var(--blog-accent);
  color: var(--blog-ink);
}

.blog-sidebar .search-form button {
  position: absolute;
  top: 0;
  right: 0;
  width: 50px;
  height: 55px;
  border: 0;
  background: transparent;
  color: var(--blog-ink);
  font-size: 16px;
  cursor: pointer;
  transition: color 0.25s ease;
}

.blog-sidebar .search-form button:hover,
.blog-sidebar .search-form button:focus {
  color: var(--blog-accent);
}

.blog-sidebar .categories-list,
.blog-sidebar .archives-list {
  list-style: none;
  margin: 0;
  padding: 0;
}

.blog-sidebar .categories-list li,
.blog-sidebar .archives-list li {
  display: block;
  font-size: 14px;
  margin-bottom: 15px;
}

.blog-sidebar .categories-list li:last-child,
.blog-sidebar .archives-list li:last-child {
  margin-bottom: 0;
}

.blog-sidebar .categories-list a,
.blog-sidebar .archives-list a {
  position: relative;
  display: inline-block;
  color: var(--blog-ink);
  padding-left: 20px;
  text-decoration: none;
  line-height: 26px;
  transition: color 0.25s ease;
}

.blog-sidebar .categories-list a::before,
.blog-sidebar .archives-list a::before {
  position: absolute;
  content: "";
  border: 2px solid #d5d5d5;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  left: 0;
  top: 9px;
  transition: border-color 0.25s ease, background 0.25s ease;
}

.blog-sidebar .categories-list a:hover,
.blog-sidebar .archives-list a:hover,
.blog-sidebar .categories-list a:focus,
.blog-sidebar .archives-list a:focus {
  color: var(--blog-accent);
}

.blog-sidebar .categories-list a:hover::before,
.blog-sidebar .archives-list a:hover::before,
.blog-sidebar .categories-list a:focus::before,
.blog-sidebar .archives-list a:focus::before {
  border-color: var(--blog-accent);
  background: var(--blog-accent);
}

.blog-sidebar .post-widget .post {
  position: relative;
  display: block;
  padding: 10px 0 0 110px;
  min-height: 90px;
  margin-bottom: 1.75rem;
}

.blog-sidebar .post-widget .post:last-child {
  margin-bottom: 0;
}

.blog-sidebar .post-widget .post-thumb {
  position: absolute;
  left: 0;
  top: 0;
  width: 90px;
  height: 90px;
  margin: 0;
  overflow: hidden;
}

.blog-sidebar .post-widget .post-thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: opacity 0.4s ease;
}

.blog-sidebar .post-widget .post:hover .post-thumb img {
  opacity: 0.35;
}

.blog-sidebar .post-widget h4 {
  font-family: "Montserrat", sans-serif;
  font-size: 1.05rem;
  line-height: 1.35;
  font-weight: 600;
  color: var(--blog-ink);
  margin: 0 0 0.2rem;
}

.blog-sidebar .post-widget h4 a {
  color: var(--blog-ink);
  text-decoration: none;
  transition: color 0.25s ease;
}

.blog-sidebar .post-widget h4 a:hover,
.blog-sidebar .post-widget h4 a:focus {
  color: var(--blog-accent);
}

.blog-sidebar .post-widget .post-date {
  position: relative;
  display: block;
  font-size: 14px;
  line-height: 24px;
  color: var(--blog-ink);
  padding-left: 25px;
}

.blog-sidebar .post-widget .post-date::before {
  position: absolute;
  content: "";
  background: var(--blog-ink);
  width: 15px;
  height: 2px;
  left: 0;
  top: 12px;
}

/* —— Listing: OcMono news grid —— */

.blog-listing,
.blog-standard {
  padding: 3.5rem 0 2rem;
  background: #fff;
}

.blog-listing .blog-layout__main {
  width: 100%;
  max-width: none;
}

.blog-listing .news-block {
  margin-bottom: 1.75rem;
}

.blog-listing .news-block-one .inner-box {
  position: relative;
  display: block;
  background: #fff;
  height: 100%;
  transition: box-shadow 0.45s ease;
}

.blog-listing .news-block-one .inner-box:hover {
  box-shadow: 0 20px 30px rgba(0, 0, 0, 0.05);
}

.blog-listing .news-block-one .image-box {
  position: relative;
  display: block;
  margin: 0;
  overflow: hidden;
}

.blog-listing .news-block-one .image-box a {
  display: block;
}

.blog-listing .news-block-one .image-box img {
  display: block;
  width: 100%;
  height: 240px;
  object-fit: cover;
  transition: opacity 0.45s ease, transform 0.45s ease;
}

.blog-listing .news-block-one .inner-box:hover .image-box img {
  opacity: 0.25;
  transform: scale(1.05);
}

.blog-listing .news-block-one .lower-content {
  position: relative;
  padding: 1.4rem 1.75rem 1.5rem;
  border: 1px solid #e1e5eb;
  border-top: none;
  transition: border-color 0.45s ease;
}

.blog-listing .news-block-one .inner-box:hover .lower-content {
  border-color: #fff;
}

.blog-listing .news-block-one .post-date {
  position: relative;
  display: block;
  font-size: 15px;
  color: var(--blog-ink);
  padding-left: 25px;
  margin-bottom: 0.65rem;
}

.blog-listing .news-block-one .post-date::before {
  position: absolute;
  content: "";
  background: var(--blog-ink);
  width: 15px;
  height: 2px;
  left: 0;
  top: 12px;
}

.blog-listing .news-block-one h3 {
  font-family: "Montserrat", sans-serif;
  font-size: 1.35rem;
  font-weight: 600;
  color: var(--blog-ink);
  line-height: 1.3;
  margin: 0 0 0.4rem;
}

.blog-listing .news-block-one h3 a {
  color: var(--blog-ink);
  text-decoration: none;
  transition: color 0.25s ease;
}

.blog-listing .news-block-one h3 a:hover,
.blog-listing .news-block-one h3 a:focus {
  color: var(--blog-accent);
}

.blog-listing .news-block-one .post-info {
  list-style: none;
  margin: 0 0 1rem;
  padding: 0;
}

.blog-listing .news-block-one .post-info li {
  position: relative;
  display: inline-block;
  font-size: 15px;
  color: var(--blog-muted);
  margin-right: 18px;
}

.blog-listing .news-block-one .post-info li:last-child {
  margin-right: 0;
}

.blog-listing .news-block-one .post-info li:not(:last-child)::after {
  position: absolute;
  content: "";
  background: var(--blog-muted);
  width: 1px;
  height: 13px;
  top: 6px;
  right: -11px;
}

.blog-listing .news-block-one .blog-teaser {
  color: #555;
  font-size: 0.95rem;
  line-height: 1.55;
  margin-bottom: 0.85rem;
}

.blog-listing .news-block-one .blog-teaser p {
  margin: 0 0 0.5rem;
}

.blog-listing .news-block-one .blog-teaser p:last-child,
.blog-listing .news-block-one .blog-teaser *:last-child {
  margin-bottom: 0;
}

.blog-listing .news-block-one .blog-teaser h4,
.blog-listing .news-block-one .blog-teaser h5,
.blog-listing .news-block-one .blog-teaser ol,
.blog-listing .news-block-one .blog-teaser ul {
  display: none;
}

.blog-listing .news-block-one .link a {
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  font-size: 15px;
  line-height: 26px;
  color: var(--blog-ink);
  font-weight: 500;
  text-decoration: none;
  transition: color 0.25s ease;
}

.blog-listing .news-block-one .link a i {
  font-size: 1rem;
  transition: transform 0.35s ease;
  transform: translateX(0);
}

.blog-listing .news-block-one .link a:hover,
.blog-listing .news-block-one .link a:focus {
  color: var(--blog-accent);
}

.blog-listing .news-block-one .link a:hover i,
.blog-listing .news-block-one .link a:focus i {
  transform: translateX(4px);
}

.blog-listing__pager {
  margin-top: 1.5rem;
  padding-top: 0.5rem;
}

.blog-listing__pager .pager,
.blog-listing__pager ul.pagination {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 0.5rem;
  list-style: none;
  margin: 0;
  padding: 0;
}

.blog-listing__pager .pager__item a,
.blog-listing__pager .pager__item span,
.blog-listing__pager .page-link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 42px;
  height: 42px;
  padding: 0 0.75rem;
  border: 1px solid #e1e5eb;
  color: var(--blog-ink);
  text-decoration: none;
  font-weight: 500;
  transition: background 0.25s ease, color 0.25s ease, border-color 0.25s ease;
}

.blog-listing__pager .pager__item a:hover,
.blog-listing__pager .pager__item a:focus,
.blog-listing__pager .page-link:hover,
.blog-listing__pager .page-link:focus {
  background: var(--blog-accent);
  border-color: var(--blog-accent);
  color: #fff;
}

.blog-listing__pager .pager__item.is-active a,
.blog-listing__pager .pager__item.is-active span,
.blog-listing__pager .page-item.active .page-link {
  background: var(--blog-accent);
  border-color: var(--blog-accent);
  color: #fff;
}

@media (max-width: 991px) {
  .blog-details {
    padding: 2rem 0 3rem;
  }

  .blog-listing,
  .blog-standard {
    padding: 2rem 0 1.5rem;
  }

  .blog-details-content > .blog-article__inner {
    padding-top: 0;
  }

  .blog-sidebar {
    margin-left: 0;
  }
}

@media (max-width: 767px) {
  .blog-article__share,
  .blog-details-content .post-share-option {
    flex-direction: column;
    gap: 1.5rem;
  }

  .blog-sidebar .post-widget .post {
    padding-left: 100px;
  }

  .blog-sidebar .post-widget .post-thumb {
    width: 80px;
    height: 80px;
  }

  .blog-listing .news-block-one .image-box img {
    height: 200px;
  }

  .blog-listing .news-block-one .lower-content {
    padding: 1.15rem 1.25rem 1.35rem;
  }

  .blog-listing .news-block-one h3 {
    font-size: 1.2rem;
  }
}

.oc-legal {
  max-width: 42rem;
  margin: 0 auto 3rem;
  padding: 1.5rem 1rem 2rem;
}

.oc-legal__title {
  margin: 0 0 1.25rem;
  font-size: 1.75rem;
  color: #0e1d34;
}

.oc-legal__section {
  margin-bottom: 1.35rem;
}

.oc-legal__heading {
  margin: 0 0 0.4rem;
  font-size: 1.1rem;
  color: #0e1d34;
}

.oc-legal__body {
  margin: 0;
  color: #445066;
  line-height: 1.55;
}

.oc-faq-page {
  max-width: 900px;
  margin: 0 auto 3rem;
  padding: 0 1rem 2rem;
}

.oc-faq-page__cta {
  margin: 2rem 0 0;
  text-align: center;
}

.oc-faq-page__empty {
  margin: 0;
  color: #666;
}

.oc-faq-index {
  max-width: 900px;
  margin: 0 auto 3rem;
  padding: 0 1rem 2rem;
}

.oc-faq-index__grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1.25rem;
}

.oc-faq-index__card {
  display: block;
  padding: 1.35rem 1.4rem;
  border: 1px solid var(--ocmono-border, #ebebeb);
  background: #fff;
  color: inherit;
  text-decoration: none;
  transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

.oc-faq-index__card:hover {
  border-color: #1fa2ff;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.06);
  color: inherit;
}

.oc-faq-index__title {
  margin: 0 0 0.45rem;
  font-size: 1.15rem;
  font-weight: 600;
  color: #17244A;
}

.oc-faq-index__desc {
  margin: 0 0 0.85rem;
  color: #666;
  line-height: 1.6;
}

.oc-faq-index__link {
  font-weight: 600;
  color: #1fa2ff;
}

@media (max-width: 767px) {
  .oc-faq-index__grid {
    grid-template-columns: 1fr;
  }
}

.oc-faq-page__hotels {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 1.25rem 1rem;
  margin: 0;
}

.oc-faq-page__hotel-col {
  display: flex;
  flex-direction: column;
  margin: 0;
  min-width: 0;
}

.oc-faq-page__hotel-title {
  margin: 0 0 0.75rem;
  min-height: 2.75em;
  font-size: 1.05rem;
  font-weight: 600;
  line-height: 1.35;
  color: #17244A;
}

.oc-faq-page__hotel-map {
  flex: 1 1 auto;
  overflow: hidden;
  border: 1px solid #e8edf5;
  border-radius: 8px;
  background: #f5f7fa;
}

.oc-faq-page__hotel-map iframe {
  display: block;
  width: 100%;
  height: 250px;
  border: 0;
}

@media (max-width: 991px) {
  .oc-faq-page__hotels {
    grid-template-columns: 1fr;
  }

  .oc-faq-page__hotel-title {
    min-height: 0;
  }
}

.oc-checkout-legal {
  margin: 0;
}

.oc-checkout-form .form-item-oc-legal-agree {
  margin-top: 1rem;
  padding: 1rem 1.15rem;
  background: #f8fafc;
  border: 1px solid #e8edf5;
  border-radius: 10px;
  overflow: visible;
}

.oc-checkout-form .form-item-oc-legal-agree,
.oc-checkout-form .form-item-oc-legal-agree.form-check {
  display: flex !important;
  align-items: flex-start;
  gap: 0.75rem;
}

.oc-checkout-form .form-item-oc-legal-agree input[type="checkbox"],
.oc-checkout-form .form-item-oc-legal-agree .form-check-input {
  position: static !important;
  float: none !important;
  flex: 0 0 auto;
  width: 1.15rem !important;
  height: 1.15rem !important;
  margin: 0.2rem 0 0 !important;
  transform: none !important;
}

.oc-checkout-form .form-item-oc-legal-agree label,
.oc-checkout-form .form-item-oc-legal-agree .form-check-label {
  position: static !important;
  flex: 1 1 auto;
  margin: 0 !important;
  padding: 0 !important;
  line-height: 1.5;
}

.oc-packing-slip {
  max-width: 800px;
  margin: 1.5rem auto 3rem;
  padding: 1.5rem;
  background: #fff;
  color: #0e1d34;
}

.oc-packing-slip__header {
  display: flex;
  justify-content: space-between;
  gap: 1.5rem;
  flex-wrap: wrap;
  margin-bottom: 1.25rem;
  padding-bottom: 1rem;
  border-bottom: 2px solid #0e1d34;
}

.oc-packing-slip__store {
  margin: 0 0 0.25rem;
  font-weight: 700;
  color: #1fa2ff;
}

.oc-packing-slip__title {
  margin: 0;
  font-size: 1.75rem;
}

.oc-packing-slip__meta p {
  margin: 0 0 0.25rem;
}

.oc-packing-slip__print {
  margin-bottom: 1.25rem;
}

.oc-packing-slip__section {
  margin-bottom: 1.5rem;
}

.oc-packing-slip__section h2 {
  margin: 0 0 0.5rem;
  font-size: 1.05rem;
}

.oc-packing-slip__notes {
  padding: 0.85rem 1rem;
  background: #fff8eb;
  border: 1px solid #f0e0b8;
}

.oc-packing-slip__table {
  width: 100%;
  border-collapse: collapse;
}

.oc-packing-slip__table th,
.oc-packing-slip__table td {
  border: 1px solid #dbe3ef;
  padding: 0.55rem 0.65rem;
  text-align: left;
  vertical-align: top;
}

.oc-packing-slip__table th {
  background: #f8fafc;
}

.oc-packing-slip__check {
  width: 4rem;
  text-align: center;
  font-size: 1.2rem;
}

@media print {
  .oc-packing-slip__print,
  .toolbar,
  .gin-secondary-toolbar,
  #toolbar-administration,
  .region-breadcrumb,
  .block-local-tasks-block,
  .messages {
    display: none !important;
  }

  .oc-packing-slip {
    margin: 0;
    padding: 0;
    max-width: none;
  }
}

.oc-shop-status {
  max-width: 860px;
}

.oc-shop-status__summary {
  margin: 0 0 1rem;
  font-size: 1.05rem;
  font-weight: 600;
}

.oc-shop-status__shortcuts {
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem 1.25rem;
  list-style: none;
  margin: 0 0 1.25rem;
  padding: 0;
}

.oc-shop-status__list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: 0.85rem;
}

.oc-shop-status__item {
  padding: 1rem 1.1rem;
  border: 1px solid #dbe3ef;
  border-radius: 10px;
  background: #fff;
}

.oc-shop-status__item.is-ready {
  border-color: #b7dfc4;
  background: #f7fbf8;
}

.oc-shop-status__item.is-attention {
  border-color: #f0d4a8;
  background: #fffaf2;
}

.oc-shop-status__head {
  display: flex;
  justify-content: space-between;
  gap: 1rem;
  align-items: center;
  margin-bottom: 0.35rem;
}

.oc-shop-status__badge {
  font-size: 0.8rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.03em;
}

.oc-shop-status__item.is-ready .oc-shop-status__badge {
  color: #1f7a45;
}

.oc-shop-status__item.is-attention .oc-shop-status__badge {
  color: #9a5b00;
}

.oc-shop-status__detail {
  margin: 0 0 0.5rem;
  color: #475569;
}

.oc-shop-status__link {
  font-weight: 600;
  text-decoration: none;
}

/* -------------------------------------------------------------------------- */
/* User auth pages - login / password reset                                   */
/* -------------------------------------------------------------------------- */

body.page-user-login #main,
body.page-user-password #main,
body.page-user-register #main {
  background: #f7f9fc;
}

.oc-account-login__intro {
  margin: 0 0 1.25rem;
  color: #5a6b82;
  font-size: 0.98rem;
  line-height: 1.5;
  text-align: center;
}

body.page-user-login #content-inner,
body.page-user-password #content-inner,
body.page-user-register #content-inner {
  max-width: 480px;
  margin: 0 auto;
  padding-top: 2rem;
  padding-bottom: 3rem;
}

body.page-user-login #content-inner > .tabs,
body.page-user-password #content-inner > .tabs,
body.page-user-register #content-inner > .tabs {
  margin: 0;
  background: #fff;
  border: 1px solid #e8edf5;
  border-bottom: 0;
  border-radius: 14px 14px 0 0;
  padding: 0.85rem 1.5rem 0;
  overflow: hidden;
}

body.page-user-login #content-inner > .tabs .nav-tabs,
body.page-user-password #content-inner > .tabs .nav-tabs,
body.page-user-register #content-inner > .tabs .nav-tabs {
  display: flex;
  flex-wrap: wrap;
  gap: 0.35rem 1.25rem;
  border-bottom: 1px solid #e8edf5;
  margin: 0;
  padding: 0;
}

body.page-user-login #content-inner > .tabs .nav-item,
body.page-user-password #content-inner > .tabs .nav-item,
body.page-user-register #content-inner > .tabs .nav-item {
  margin: 0;
}

body.page-user-login #content-inner > .tabs .nav-link,
body.page-user-password #content-inner > .tabs .nav-link,
body.page-user-register #content-inner > .tabs .nav-link {
  display: inline-block;
  padding: 0.55rem 0.15rem 0.85rem;
  border: 0;
  border-bottom: 2px solid transparent;
  border-radius: 0;
  background: transparent;
  color: #6b7a90;
  font-size: 0.95rem;
  font-weight: 600;
  text-decoration: none;
  margin-bottom: -1px;
}

body.page-user-login #content-inner > .tabs .nav-link:hover,
body.page-user-password #content-inner > .tabs .nav-link:hover,
body.page-user-register #content-inner > .tabs .nav-link:hover {
  color: #0e1d34;
}

body.page-user-login #content-inner > .tabs .nav-link.active,
body.page-user-password #content-inner > .tabs .nav-link.active,
body.page-user-register #content-inner > .tabs .nav-link.active,
body.page-user-login #content-inner > .tabs .nav-item.active .nav-link,
body.page-user-password #content-inner > .tabs .nav-item.active .nav-link,
body.page-user-register #content-inner > .tabs .nav-item.active .nav-link {
  color: #0e1d34;
  border-bottom-color: #1fa2ff;
  background: transparent;
}

body.page-user-login #block-ocmono-content,
body.page-user-password #block-ocmono-content,
body.page-user-register #block-ocmono-content {
  background: #fff;
  border: 1px solid #e8edf5;
  border-top: 0;
  border-radius: 0 0 14px 14px;
  box-shadow: 0 10px 32px rgba(14, 29, 52, 0.06);
  padding: 1.5rem 1.5rem 1.75rem;
  margin: 0 0 1rem;
}

/* When tabs are absent (e.g. some register flows), still show a full card. */
body.page-user-login #content-inner:not(:has(> .tabs)) #block-ocmono-content,
body.page-user-password #content-inner:not(:has(> .tabs)) #block-ocmono-content,
body.page-user-register #content-inner:not(:has(> .tabs)) #block-ocmono-content {
  border-top: 1px solid #e8edf5;
  border-radius: 14px;
}

.oc-auth-form .form-item,
.oc-auth-form .js-form-item,
body.page-user-login .user-login-form .form-item,
body.page-user-login .user-login-form .js-form-item,
body.page-user-password .user-pass .form-item,
body.page-user-password .user-pass .js-form-item,
body.page-user-register .user-register-form .form-item,
body.page-user-register .user-register-form .js-form-item {
  margin-bottom: 1.1rem;
}

.oc-auth-form label,
body.page-user-login .user-login-form label,
body.page-user-password .user-pass label,
body.page-user-register .user-register-form label {
  display: block;
  margin-bottom: 0.4rem;
  color: #344054;
  font-size: 0.9rem;
  font-weight: 600;
}

.oc-auth-form .description,
body.page-user-login .user-login-form .description,
body.page-user-password .user-pass .description,
body.page-user-register .user-register-form .description {
  margin-top: 0.35rem;
  color: #5a6a7e;
  font-size: 0.86rem;
  line-height: 1.45;
}

.oc-auth-form input.form-control,
.oc-auth-form input[type="text"],
.oc-auth-form input[type="email"],
.oc-auth-form input[type="password"],
body.page-user-login .user-login-form input.form-control,
body.page-user-login .user-login-form input[type="text"],
body.page-user-login .user-login-form input[type="password"],
body.page-user-password .user-pass input.form-control,
body.page-user-password .user-pass input[type="text"],
body.page-user-password .user-pass input[type="email"],
body.page-user-register .user-register-form input.form-control,
body.page-user-register .user-register-form input[type="text"],
body.page-user-register .user-register-form input[type="email"],
body.page-user-register .user-register-form input[type="password"] {
  width: 100%;
  min-height: 2.85rem;
  padding: 0.7rem 0.95rem;
  border: 1px solid #d8dee8;
  border-radius: 8px;
  background: #fff;
  color: #0e1d34;
  font-size: 0.95rem;
  line-height: 1.4;
  box-sizing: border-box;
  box-shadow: none;
  transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

.oc-auth-form input.form-control:focus,
.oc-auth-form input[type="text"]:focus,
.oc-auth-form input[type="email"]:focus,
.oc-auth-form input[type="password"]:focus,
body.page-user-login .user-login-form input:focus,
body.page-user-password .user-pass input:focus,
body.page-user-register .user-register-form input:focus {
  border-color: #1fa2ff;
  outline: 0;
  box-shadow: 0 0 0 3px rgba(31, 162, 255, 0.18);
}

/* Keep autofill from turning fields yellow. */
.oc-auth-form input.form-control:-webkit-autofill,
.oc-auth-form input.form-control:-webkit-autofill:hover,
.oc-auth-form input.form-control:-webkit-autofill:focus,
.oc-auth-form input[type="text"]:-webkit-autofill,
.oc-auth-form input[type="email"]:-webkit-autofill,
.oc-auth-form input[type="password"]:-webkit-autofill,
body.page-user-login .user-login-form input:-webkit-autofill,
body.page-user-password .user-pass input:-webkit-autofill,
body.page-user-register .user-register-form input:-webkit-autofill {
  -webkit-text-fill-color: #0e1d34;
  -webkit-box-shadow: 0 0 0 1000px #fff inset;
  box-shadow: 0 0 0 1000px #fff inset;
  transition: background-color 99999s ease-out 0s;
}

.oc-auth-form .form-actions,
body.page-user-login .user-login-form .form-actions,
body.page-user-password .user-pass .form-actions,
body.page-user-register .user-register-form .form-actions {
  margin-top: 0.35rem;
  margin-bottom: 0;
}

.oc-auth-form .oc-auth-form__submit,
.oc-auth-form .button,
.oc-auth-form .form-submit,
.oc-auth-form .btn-primary,
body.page-user-login .user-login-form .button,
body.page-user-login .user-login-form .btn-primary,
body.page-user-password .user-pass .button,
body.page-user-password .user-pass .btn-primary,
body.page-user-register .user-register-form .button,
body.page-user-register .user-register-form .btn-primary {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  min-height: 2.85rem;
  padding: 0.7rem 1.35rem;
  background: var(--oc-btn-solid-bg) !important;
  border: 2px solid var(--oc-btn-solid-bg) !important;
  border-radius: var(--oc-btn-radius);
  color: #fff !important;
  font-size: 0.98rem;
  font-weight: 700;
  text-decoration: none;
  cursor: pointer;
  box-shadow: none;
}

.oc-auth-form .oc-auth-form__submit:hover,
.oc-auth-form .button:hover,
.oc-auth-form .form-submit:hover,
.oc-auth-form .btn-primary:hover,
body.page-user-login .user-login-form .button:hover,
body.page-user-login .user-login-form .btn-primary:hover,
body.page-user-password .user-pass .button:hover,
body.page-user-password .user-pass .btn-primary:hover,
body.page-user-register .user-register-form .button:hover,
body.page-user-register .user-register-form .btn-primary:hover {
  background: var(--oc-btn-solid-hover) !important;
  border-color: var(--oc-btn-solid-hover) !important;
  color: #fff !important;
}

@media (max-width: 575.98px) {
  body.page-user-login #content-inner,
  body.page-user-password #content-inner,
  body.page-user-register #content-inner {
    padding-top: 1.25rem;
    padding-bottom: 2rem;
  }

  body.page-user-login #content-inner > .tabs,
  body.page-user-password #content-inner > .tabs,
  body.page-user-register #content-inner > .tabs {
    padding: 0.7rem 1.1rem 0;
  }

  body.page-user-login #block-ocmono-content,
  body.page-user-password #block-ocmono-content,
  body.page-user-register #block-ocmono-content {
    padding: 1.25rem 1.1rem 1.4rem;
  }
}