/* ============================================================
   Home — extracted from Home/style.css, scoped under .page-home
   Generic selectors (.container, .hero, h2, img, .btn ...) are prefixed
   so they never leak into the nav, footer, or other theme pages.
   ============================================================ */
.page-home {
  --red:     var(--brand-red);
  --red-dark: var(--brand-red-dark);
  --ink:     var(--brand-ink);
  --muted:   var(--brand-muted);
  --line:    var(--brand-line);
  --paper:   var(--brand-paper);
  --soft:    var(--brand-soft);
  --blue:    var(--brand-blue);
  --shadow:  0 18px 45px rgba(16, 24, 40, .12)
}
.page-home,
.page-home * {
  box-sizing: border-box
}
.page-home {
  font-family: "Open Sans", sans-serif;
  color: var(--ink);
  background: #fff;
  line-height: 1.65
}
.page-home a {
  color: inherit;
  text-decoration: none
}
.page-home img {
  display: block;
  max-width: 100%
}
.page-home .container {
  width: min(1240px, calc(100% - 36px));
  margin: 0 auto
}
.page-home .hero {
  position: relative;
  min-height: clamp(640px, 86svh, 780px);
  overflow: hidden;
  background: var(--brand-dark-1);
  color: #fff
}
.page-home .hero::before {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg, rgba(0, 0, 0, .68) 0%, rgba(0, 0, 0, .44) 44%, rgba(0, 0, 0, .10) 100%), var(--hero-bg, url(images/11.webp))center center/cover no-repeat;
  transform: scale(1.02)
}
.page-home .hero .container {
  position: relative;
  z-index: 2;
  min-height: clamp(640px, 86svh, 780px);
  display: flex;
  align-items: center;
  padding: 88px 0 144px
}
@supports (height:100dvh) {
.page-home .hero,
.page-home .hero .container {
    min-height: clamp(640px, 86dvh, 780px)
  }
}
.page-home .hero-content {
  max-width: 880px
}
.page-home .eyebrow {
  display: inline-flex;
  align-items: center;
  min-height: 30px;
  padding: 0 12px;
  background: rgba(0, 86, 160, .9);
  color: #fff;
  font: 700 13px"Cabin", sans-serif;
  letter-spacing: 0;
  text-transform: uppercase
}
.page-home .hero h1 {
  margin: 22px 0 22px;
  font: 700 clamp(38px, 5vw, 72px)/1.08"Cabin", sans-serif;
  max-width: 850px
}
.page-home .hero .lead {
  max-width: 790px;
  margin: 0 0 30px;
  font-size: clamp(16px, 1.35vw, 19px);
  line-height: 1.9
}
.page-home .support-strip {
  padding: 0 0 clamp(72px, 8vw, 112px);
  background: #fff
}
.page-home .support-points {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 18px
}
.page-home .support-point {
  position: relative;
  min-height: 160px;
  padding: 26px 24px;
  border: 1px solid #e7e9ee;
  background: #fff;
  color: #475467;
  font-size: 15px;
  line-height: 1.75;
  box-shadow: 0 12px 28px rgba(16, 24, 40, .07)
}
.page-home .support-point::before {
  content: "";
  display: block;
  width: 42px;
  height: 4px;
  margin-bottom: 18px;
  background: var(--red)
}
.page-home .support-point strong {
  display: block;
  margin-bottom: 8px;
  color: var(--brand-dark-1);
  font: 700 21px/1.3"Cabin", sans-serif
}
.page-home .btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 48px;
  padding: 0 22px;
  border: 0;
  border-radius: 3px;
  font: 700 14px"Cabin", sans-serif;
  cursor: pointer;
  appearance: none;
  -webkit-appearance: none;
  transition: transform .2s ease, background .2s ease, border-color .2s ease
}
.page-home .btn:hover {
  transform: translateY(-1px)
}
.page-home .btn-red:hover {
  background: var(--red-dark)
}
.page-home .btn-offset-10 {
  margin-top: 10px
}
.page-home .quick-wrap {
  position: relative;
  z-index: 5;
  margin-top: -86px;
  color: #fff
}
.page-home .quick-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  background: var(--brand-dark-3);
  box-shadow: var(--shadow)
}
.page-home .quick-item {
  min-height: 178px;
  padding: 28px 24px;
  border-right: 1px solid rgba(255, 255, 255, .14);
  transition: background .2s ease, transform .2s ease
}
.page-home .quick-item:last-child {
  border-right: 0
}
.page-home .quick-item:hover {
  background: var(--red);
  transform: translateY(-3px)
}
.page-home .quick-item img {
  width: 42px;
  height: 42px;
  object-fit: contain;
  margin-bottom: 18px
}
.page-home .quick-item strong {
  display: block;
  margin-bottom: 8px;
  font: 700 21px"Cabin", sans-serif
}
.page-home .quick-item span {
  display: block;
  font-size: 14px
}
.page-home .section {
  padding: clamp(72px, 8vw, 112px)0
}
.page-home .section-kicker {
  margin-bottom: 8px;
  color: var(--red);
  font: 700 15px"Cabin", sans-serif;
  text-transform: uppercase
}
.page-home h2 {
  margin: 0 0 18px;
  font: 700 clamp(30px, 3vw, 46px)/1.2 "Cabin", sans-serif;
  color: var(--brand-dark-1);
}
.page-home .section p {
  color: var(--muted);
  font-size: 16px
}
.page-home .line-pack {
  display: flex;
  gap: 8px;
  margin: 22px 0
}
.page-home .line-pack span {
  display: block;
  height: 4px;
  background: var(--red)
}
.page-home .line-pack span:nth-child(1) {
  width: 60px
}
.page-home .line-pack span:nth-child(2) {
  width: 26px;
  opacity: .7
}
.page-home .line-pack span:nth-child(3) {
  width: 14px;
  opacity: .45
}
.page-home .line-pack span:nth-child(4) {
  width: 8px;
  opacity: .3
}
.page-home .numbers {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  margin-top: 34px;
  background: var(--brand-dark-1);
  color: #fff
}
.page-home .number {
  display: grid;
  grid-template-rows: 116px auto;
  align-content: start;
  min-height: 218px;
  padding: 26px 18px 24px;
  border-right: 1px solid rgba(255, 255, 255, .16)
}
.page-home .number:last-child {
  border-right: 0
}
.page-home .number strong {
  display: flex;
  align-items: flex-start;
  min-height: 116px;
  padding-bottom: 18px;
  border-bottom: 1px solid rgba(255, 255, 255, .18);
  font: 700 clamp(22px, 2vw, 30px)/1.12"Cabin", sans-serif;
  letter-spacing: -.02em
}
.page-home .number span {
  display: block;
  padding-top: 18px;
  color: rgba(255, 255, 255, .78);
  font-size: 13px;
  line-height: 1.62
}
.page-home .image-frame {
  position: relative;
  padding: 0 0 28px 28px
}
.page-home .image-frame::before {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  width: 80%;
  height: 60%;
  background: var(--red)
}
.page-home .image-frame img {
  position: relative;
  z-index: 2;
  width: 100%;
  height: 800px;
  object-fit: cover;
  box-shadow: var(--shadow)
}
.page-home .section-head {
  max-width: 860px;
  margin: 0 auto 42px;
  text-align: center
}
.page-home .product-title-desktop-break span {
  display: inline
}
@media (min-width:981px) {
.page-home .product-title-desktop-break span {
    display: block
  }
}
.page-home .products {
  background: var(--soft)
}
.page-home .product-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 22px
}
.page-home .product-card {
  display: flex;
  flex-direction: column;
  min-height: 100%;
  background: #fff;
  border: 1px solid #e7e9ee;
  box-shadow: 0 10px 26px rgba(16, 24, 40, .06);
  transition: transform .2s ease, box-shadow .2s ease
}
.page-home .product-card:hover {
  transform: translateY(-5px);
  box-shadow: var(--shadow)
}
.page-home .product-card img {
  width: 100%;
  aspect-ratio: 1/1;
  object-fit: cover
}
.page-home .product-body {
  display: flex;
  flex: 1;
  flex-direction: column;
  padding: 24px 22px
}
.page-home .product-body h3 {
  margin: 0 0 12px;
  color: var(--brand-dark-1);
  font: 700 23px/1.25"Cabin", sans-serif
}
.page-home .product-body p {
  margin: 0 0 16px;
  font-size: 14px;
  line-height: 1.8
}
.page-home .bullets {
  margin: 0 0 20px;
  padding: 0;
  list-style: none
}
.page-home .bullets li {
  position: relative;
  margin: 0 0 7px;
  padding-left: 18px;
  color: #475467;
  font-size: 13px;
  line-height: 1.65
}
.page-home .bullets li::before {
  content: "";
  position: absolute;
  top: .72em;
  left: 1px;
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--red)
}
.page-home .more {
  margin-top: auto;
  font: 700 14px"Cabin", sans-serif
}
.page-home .process {
  background: var(--brand-dark-2);
  color: #fff
}
.page-home .process h2 {
  color: #fff;
}
.page-home .process-left {
  padding-right: 48px;
  border-right: 3px solid var(--red)
}
.page-home .steps {
  display: grid;
  gap: 22px;
  padding: 0;
  list-style: none
}
.page-home .steps li {
  display: grid;
  grid-template-columns: 58px 1fr;
  gap: 22px;
  padding-bottom: 24px;
  border-bottom: 1px solid rgba(255, 255, 255, .12)
}
.page-home .steps li:last-child {
  padding-bottom: 0;
  border-bottom: 0
}
.page-home .step-no {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 52px;
  height: 52px;
  border: 1px solid rgba(255, 255, 255, .22);
  background: rgba(255, 255, 255, .08);
  color: #fff;
  font: 700 15px"Cabin", sans-serif
}
.page-home .steps h3 {
  margin: 0 0 8px;
  font: 700 23px/1.3"Cabin", sans-serif
}
.page-home .steps p {
  margin: 0;
  font-size: 15px
}
@media (max-width:1180px) {
.page-home .product-grid,
.page-home .support-points {
    grid-template-columns: repeat(2, minmax(0, 1fr))
  }
}
@media (max-width:980px) {
.page-home .hero,
.page-home .hero .container {
    min-height: clamp(640px, 90svh, 780px)
  }
@supports (height:100dvh) {
.page-home .hero,
.page-home .hero .container {
      min-height: clamp(640px, 90dvh, 780px)
    }
}
.page-home .hero::before {
    background-position: 56%center
  }
.page-home .intro-grid,
.page-home .process-grid,
.page-home .support-points {
    grid-template-columns: 1fr
  }
.page-home .quick-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr))
  }
.page-home .process-left {
    padding-right: 0;
    padding-bottom: 28px;
    border-right: 0;
    border-bottom: 3px solid var(--red)
  }
}
@media (max-width:640px) {
.page-home .container {
    width: min(100% - 28px, 1240px)
  }
.page-home .hero,
.page-home .hero .container {
    min-height: clamp(620px, 100svh, 820px)
  }
@supports (height:100dvh) {
.page-home .hero,
.page-home .hero .container {
      min-height: clamp(620px, 100dvh, 820px)
    }
}
.page-home .hero::before {
    background: linear-gradient(180deg, rgba(0, 0, 0, .66) 0%, rgba(0, 0, 0, .46) 52%, rgba(0, 0, 0, .22) 100%), var(--hero-bg, url(images/11.webp))58%center/cover no-repeat;
    transform: none
  }
.page-home .hero .container {
    align-items: center;
    padding: clamp(44px, 7svh, 64px)0 clamp(104px, 15svh, 128px)
  }
@supports (height:100dvh) {
.page-home .hero .container {
      padding-top: clamp(44px, 7dvh, 64px);
      padding-bottom: clamp(104px, 15dvh, 128px)
    }
}
.page-home .hero h1 {
    font-size: clamp(32px, 8.8vw, 40px)
  }
.page-home .hero .lead {
    font-size: 15px;
    line-height: 1.75
  }
.page-home .support-point {
    min-height: auto;
    padding: 22px 20px
  }
.page-home .quick-grid,
.page-home .product-grid,
.page-home .numbers {
    grid-template-columns: 1fr
  }
.page-home .quick-wrap {
    margin-top: -52px
  }
.page-home .quick-item {
    min-height: auto;
    border-right: 0;
    border-bottom: 1px solid rgba(255, 255, 255, .14)
  }
.page-home .number {
    grid-template-rows: auto auto;
    min-height: auto;
    border-right: 0;
    border-bottom: 1px solid rgba(255, 255, 255, .16)
  }
.page-home .number strong {
    min-height: auto;
    padding-bottom: 14px
  }
.page-home .number span {
    padding-top: 14px
  }
.page-home .number:last-child {
    border-bottom: 0
  }
.page-home .steps li {
    grid-template-columns: 48px 1fr;
    gap: 16px
  }
.page-home .step-no {
    width: 42px;
    height: 42px
  }
.page-home .btn {
    width: 100%
  }
}
@media (max-width:480px) {
.page-home .hero,
.page-home .hero .container {
    min-height: clamp(590px, 100svh, 780px)
  }
@supports (height:100dvh) {
.page-home .hero,
.page-home .hero .container {
      min-height: clamp(590px, 100dvh, 780px)
    }
}
.page-home .hero .container {
    padding-top: clamp(38px, 6svh, 54px);
    padding-bottom: clamp(92px, 14svh, 118px)
  }
@supports (height:100dvh) {
.page-home .hero .container {
      padding-top: clamp(38px, 6dvh, 54px);
      padding-bottom: clamp(92px, 14dvh, 118px)
    }
}
.page-home .hero::before {
    background-position: 61%center
  }
.page-home .hero h1 {
    font-size: clamp(29px, 8.2vw, 35px)
  }
.page-home .hero .lead {
    margin-bottom: 22px;
    font-size: 14px;
    line-height: 1.68
  }
}
@media (max-width:380px) {
.page-home .hero,
.page-home .hero .container {
    min-height: clamp(560px, 100svh, 730px)
  }
@supports (height:100dvh) {
.page-home .hero,
.page-home .hero .container {
      min-height: clamp(560px, 100dvh, 730px)
    }
}
.page-home .hero::before {
    background-position: 64%center
  }
.page-home .hero .container {
    padding-top: 34px;
    padding-bottom: 88px
  }
.page-home .hero h1 {
    font-size: clamp(27px, 8.4vw, 32px)
  }
}
@media (max-width:900px) and (orientation:landscape) {
.page-home .hero,
.page-home .hero .container {
    min-height: auto
  }
.page-home .hero .container {
    padding-top: 46px;
    padding-bottom: 110px
  }
.page-home .hero::before {
    background-position: center center
  }
}
.page-home .intro-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.05fr) minmax(340px, .95fr);
  align-items: center;
  gap: clamp(42px, 6vw, 78px);
}
.page-home .intro-grid > div:first-child {
  grid-column: 1;
  grid-row: 1;
  align-self: center;
}
.page-home .intro-grid > .image-frame {
  grid-column: 2;
  grid-row: 1;
  align-self: center;
  justify-self: stretch;
  width: 100%;
  margin: 0;
}
.page-home .process-grid {
  display: grid;
  grid-template-columns: .9fr 1.1fr;
  align-items: start;
  gap: clamp(36px, 5vw, 74px);
}
.page-home .process-grid > .process-left {
  grid-column: 1;
  grid-row: 1;
  align-self: start;
  margin: 0;
}
.page-home .process-grid > .steps {
  grid-column: 2;
  grid-row: 1;
  align-self: start;
  margin: 0;
}
.page-home .hero .lead {
  color: rgba(255, 255, 255, .88);
}
.page-home .process p {
  color: #d0d5dd;
}
@media (max-width:980px) {
.page-home .intro-grid,
.page-home .process-grid {
    grid-template-columns: 1fr;
  }
.page-home .intro-grid > div:first-child,
.page-home .intro-grid > .image-frame,
.page-home .process-grid > .process-left,
.page-home .process-grid > .steps {
    grid-column: 1;
  }
.page-home .intro-grid > div:first-child,
.page-home .process-grid > .process-left {
    grid-row: 1;
  }
.page-home .intro-grid > .image-frame,
.page-home .process-grid > .steps {
    grid-row: 2;
  }
  .page-home .image-frame img {
    height: auto;
    aspect-ratio: 4/3;
  }
}
.page-home .certificates {
  padding: clamp(72px, 8vw, 112px) 0;
  background: #fff;
  overflow: hidden;
}
.page-home .certificates .section-head {
  max-width: 860px;
  margin: 0 auto 42px;
  text-align: center;
}
.page-home .certificates .section-head h2 {
  color: var(--brand-dark-1);
}
.page-home .certificates .section-head p {
  color: var(--muted);
  font-size: 16px;
  line-height: 1.65;
}
.page-home .certificates .section-head a {
  color: #3498db;
}
.page-home .cert-carousel-wrap {
  width: 100%;
  max-width: 1520px;
  margin: 0 auto;
  padding: 0 60px;
}
.page-home .cert-carousel {
  padding: 0 0 40px;
  height: 580px;
  overflow: visible;
}
.page-home .cert-carousel .swiper-wrapper,
.page-home .cert-carousel .swiper-slide {
  height: 100%;
}
.page-home .cert-card {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  height: 100%;
  padding: 0;
  background: transparent;
  transition: transform .5s ease, opacity .5s ease;
}
.page-home .cert-carousel .swiper-slide-active {
  z-index: 10 !important;
}
.page-home .cert-carousel .swiper-slide-active .cert-card {
  transform: scale(1);
  opacity: 1;
}
.page-home .cert-carousel .swiper-slide-active .cert-card span {
  font-size: 15px;
}
.page-home .cert-carousel .swiper-slide:not(.swiper-slide-active) .cert-card {
  opacity: .35;
  pointer-events: none;
}
.page-home .cert-carousel .swiper-slide:not(.swiper-slide-active):not(.swiper-slide-prev):not(.swiper-slide-next) .cert-card {
  transform: scale(0.6);
}
.page-home .cert-carousel .swiper-slide-prev .cert-card,
.page-home .cert-carousel .swiper-slide-next .cert-card {
  transform: scale(0.82);
  opacity: .65;
}
.page-home .cert-card img {
  width: 375px;
  max-width: 85vw;
  height: 500px;
  object-fit: cover;
  border-radius: 8px;
  box-shadow: 0 8px 32px rgba(0,0,0,.18);
}
.page-home .cert-card span {
  margin-top: 12px;
  font: 700 14px "Cabin", sans-serif;
  color: var(--brand-dark-1);
  text-align: center;
  white-space: nowrap;
}
.page-home .cert-carousel .swiper-pagination {
  position: relative;
  bottom: 0;
  margin-top: 16px;
}
.page-home .cert-carousel .swiper-pagination-bullet-active {
  background: var(--brand-dark-3);
}
.page-home .cert-carousel--compact .swiper-slide .cert-card {
  opacity: 1 !important;
  transform: none !important;
  pointer-events: auto !important;
}
.page-home .cert-carousel--compact .swiper-slide-active .cert-card span {
  font-size: 14px;
}
.page-home .cert-carousel .swiper-button-prev,
.page-home .cert-carousel .swiper-button-next {
  color: var(--brand-dark-3);
}
.page-home .cert-carousel .swiper-button-prev::after,
.page-home .cert-carousel .swiper-button-next::after {
  font-size: 20px;
}
@media (max-width: 1200px) {
.page-home .cert-carousel-wrap { padding: 0 48px; }
.page-home .cert-carousel { height: 520px; padding-bottom: 36px; }
.page-home .cert-card img { width: 300px; height: 400px; }
}
@media (max-width: 900px) {
.page-home .cert-carousel-wrap { padding: 0 40px; }
.page-home .cert-carousel { height: 500px; padding-bottom: 32px; }
.page-home .cert-card img { width: 260px; height: 347px; }
}
@media (max-width: 640px) {
.page-home .cert-carousel-wrap { padding: 0 32px; }
.page-home .cert-carousel { height: 440px; padding-bottom: 28px; }
.page-home .cert-card img { width: 240px; height: 320px; }
}
@media (max-width: 480px) {
.page-home .cert-carousel-wrap { padding: 0 24px; }
.page-home .cert-carousel { height: 400px; padding-bottom: 24px; }
.page-home .cert-card img { width: 220px; height: 293px; }
}

/* ---- Blog Section ---- */
.page-home .home-blog-head {
	margin-bottom: 40px;
}
.page-home .home-blog-grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 24px;
}
.page-home .home-blog-card {
	background: #fff;
	border: 1px solid var(--brand-line);
	border-radius: 12px;
	overflow: hidden;
	transition: box-shadow 0.2s ease;
}
.page-home .home-blog-card:hover {
	box-shadow: 0 4px 16px rgba(0, 0, 0, 0.08);
}
.page-home .home-blog-card-img {
	display: block;
	overflow: hidden;
}
.page-home .home-blog-card-img img {
	width: 100%;
	display: block;
	transition: transform 0.35s ease;
}
.page-home .home-blog-card:hover .home-blog-card-img img {
	transform: scale(1.04);
}
.page-home .home-blog-img-placeholder {
	width: 100%;
	aspect-ratio: 1/1;
	background: var(--brand-soft);
}
.page-home .home-blog-card-body {
	padding: 20px 20px 24px;
}
.page-home .home-blog-card-title {
	font-size: 18px;
	font-weight: 700;
	line-height: 1.4;
	margin: 0 0 8px;
}
.page-home .home-blog-card-title a {
	color: var(--brand-ink);
	text-decoration: none;
}
.page-home .home-blog-card-title a:hover {
	color: var(--brand-red);
}
.page-home .home-blog-card-meta {
	font-size: 13px;
	color: var(--brand-muted);
	margin-bottom: 10px;
}
.page-home .home-blog-card-cat {
	color: var(--brand-red);
	font-weight: 600;
}
.page-home .home-blog-card-divider {
	margin: 0 6px;
	color: var(--brand-line);
}
.page-home .home-blog-card-date {
	color: var(--brand-muted);
}
.page-home .home-blog-card-excerpt {
	font-size: 14px;
	line-height: 1.6;
	color: var(--brand-text);
	margin: 0;
	display: -webkit-box;
	-webkit-line-clamp: 3;
	-webkit-box-orient: vertical;
	overflow: hidden;
}
.page-home .home-blog-footer {
	text-align: center;
	margin-top: 40px;
}
.page-home .home-blog-footer .btn {
	display: inline-flex;
	align-items: center;
	gap: 6px;
}
.page-home .home-blog-footer .btn span {
	transition: transform 0.15s ease;
}
.page-home .home-blog-footer .btn:hover span {
	transform: translateX(4px);
}
.page-home .home-blog-empty {
	text-align: center;
	color: var(--brand-muted);
	font-size: 16px;
	padding: 40px 0;
}

@media (max-width: 989px) {
	.page-home .home-blog-grid {
		grid-template-columns: repeat(2, 1fr);
	}
}
@media (max-width: 640px) {
	.page-home .home-blog-grid {
		grid-template-columns: 1fr;
	}
	.page-home .home-blog-card-body {
		padding: 16px 16px 20px;
	}
}


/**
 * Display the product breadcrumb above the image and summary columns.
 */
function yowexa_product_breadcrumb_above_content() {
	if ( ! is_product() ) {
		return;
	}

	echo '<div class="yowexa-product-breadcrumb">';
	woocommerce_breadcrumb();
	echo '</div>';
}
add_action( 'woocommerce_before_single_product', 'yowexa_product_breadcrumb_above_content', 5 );