/* October homepage helpers */

/* Pro tema: .x-root{display:flex} varsayılanı row — footer kardeş olursa sağa kayar */
.x-root {
  flex-direction: column;
  width: 100%;
}

.x-root>.x-site {
  width: 100%;
  max-width: 100%;
  min-width: 0;
}

.x-colophon {
  width: 100%;
  clear: both;
  display: block;
}

/* Teklif formu flash */
.oxy-quote-flash.is-ok {
  background: #e8f8f0;
  color: #0a5c36;
  border: 1px solid #b7e4cb;
  border-radius: 12px;
  padding: 14px 16px;
  margin-bottom: 18px;
  font-family: "Red Hat Display", sans-serif;
  font-size: 15px;
  line-height: 1.45;
}

[data-validate-error]:not(.oc-visible) {
  display: none;
}

.oxy-quote-flash.is-error.oc-visible,
[data-validate-error].oc-visible {
  background: #fdecea;
  color: #842029;
  border: 1px solid #f5c2c7;
  border-radius: 12px;
  padding: 14px 16px;
  margin-bottom: 18px;
  font-family: "Red Hat Display", sans-serif;
  font-size: 15px;
  line-height: 1.45;
}

.oxy-field-error.oc-visible {
  display: block;
  margin-top: 0.35rem;
  font-size: 0.85rem;
  line-height: 1.35;
  color: #b42318;
}

.iletisim-form label.text-field.oxy-field-invalid > .flabel,
.iletisim-form .form-gdpr.oxy-field-invalid .wpcf7-list-item-label,
.oxy-quote-form label.text-field.oxy-field-invalid > .flabel,
.oxy-quote-form .form-gdpr.oxy-field-invalid .wpcf7-list-item-label {
  color: #b42318 !important;
}

.oxy-quote-page .oxy-quote-wrap {
  max-width: 720px;
}

/* Floating labels — floated state stays inside field, not over row above */
.oxy-quote-form label.text-field:has(.wpcf7-form-control-wrap > .text-base:focus) > .flabel,
.oxy-quote-form label.text-field:has(.wpcf7-form-control-wrap > .text-base:not(:placeholder-shown)) > .flabel,
.oxy-quote-form label.text-field:has(.wpcf7-form-control-wrap > textarea.text-base:focus) > .flabel,
.oxy-quote-form label.text-field:has(.wpcf7-form-control-wrap > textarea.text-base:not(:placeholder-shown)) > .flabel,
.oxy-quote-form label.text-field:has(.wpcf7-form-control-wrap > input.text-base:-webkit-autofill) > .flabel,
.oxy-contact-form label.text-field:has(.wpcf7-form-control-wrap > .text-base:focus) > .flabel,
.oxy-contact-form label.text-field:has(.wpcf7-form-control-wrap > .text-base:not(:placeholder-shown)) > .flabel,
.oxy-contact-form label.text-field:has(.wpcf7-form-control-wrap > textarea.text-base:focus) > .flabel,
.oxy-contact-form label.text-field:has(.wpcf7-form-control-wrap > textarea.text-base:not(:placeholder-shown)) > .flabel,
.oxy-contact-form label.text-field:has(.wpcf7-form-control-wrap > input.text-base:-webkit-autofill) > .flabel {
  top: 8px !important;
}

/* Form feedback toast — centered overlay, no page scroll */
form[data-request-validate] .oxy-quote-flash-slot {
  margin: 0;
  padding: 0;
  min-height: 0;
  border: 0;
}

form[data-request-validate] .oxy-quote-flash-slot > [id$="-flash-body"],
form[data-request-validate] .oxy-quote-flash-slot > [data-validate-error] {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

.oxy-form-toast-root {
  position: fixed;
  inset: 0;
  z-index: 10050;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 24px;
  pointer-events: none;
}

.oxy-form-toast-root:not([hidden]) {
  pointer-events: auto;
}

.oxy-form-toast-root::before {
  content: "";
  position: absolute;
  inset: 0;
  background: rgb(2 19 41 / 0.45);
}

.oxy-form-toast {
  position: relative;
  z-index: 1;
  width: min(440px, 100%);
  padding: 18px 44px 18px 20px;
  border-radius: 12px;
  font-family: "Red Hat Display", sans-serif;
  font-size: 15px;
  line-height: 1.45;
  box-shadow: 0 12px 40px rgb(2 19 41 / 0.18);
}

.oxy-form-toast.is-ok {
  background: #e8f8f0;
  color: #0a5c36;
  border: 1px solid #b7e4cb;
}

.oxy-form-toast.is-error {
  background: #fdecea;
  color: #842029;
  border: 1px solid #f5c2c7;
}

.oxy-form-toast__msg {
  margin: 0;
}

.oxy-form-toast__close {
  position: absolute;
  top: 10px;
  right: 10px;
  width: 28px;
  height: 28px;
  padding: 0;
  border: 0;
  border-radius: 999px;
  background: transparent;
  color: inherit;
  font-size: 22px;
  line-height: 1;
  cursor: pointer;
  opacity: 0.7;
}

.oxy-form-toast__close:hover {
  opacity: 1;
}

/* Canlı form: son satır (KVKK + Gönder) max-height ile kesilmesin */
.iletisim-form .form-flex:has(.career-btn),
.iletisim-form .form-flex:has(.form-gdpr) {
  max-height: none !important;
  align-items: center !important;
}

/* Smart Slider görünürlük/sırası → static-fix.css (çakışma yaratma) */

/* Dinamik Builder slider (siteSlider component) */
.october-dynamic-slider .site-slider {
  position: relative;
  min-height: 100vh;
  background: #021226;
  color: #fff;
  overflow: hidden;
}

.october-dynamic-slider .hero-slides {
  position: relative;
  min-height: 100vh;
}

.october-dynamic-slider .hero-slide {
  position: absolute;
  inset: 0;
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.6s ease;
}

.october-dynamic-slider .hero-slide.is-active {
  opacity: 1;
  visibility: visible;
  position: relative;
}

.october-dynamic-slider .hero-media {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.october-dynamic-slider .hero-overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(to bottom, rgba(38, 64, 105, .35), rgba(2, 18, 38, .55));
}

.october-dynamic-slider .hero-content {
  position: relative;
  z-index: 2;
  min-height: 100vh;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  padding: 0 5vw 18vh;
  max-width: 1180px;
  margin: 0 auto;
}

.october-dynamic-slider .hero-content h2 {
  margin: 0;
  font-size: clamp(2rem, 4vw, 3.2rem);
  line-height: 1.15;
}

.october-dynamic-slider .hero-content p {
  max-width: 42ch;
  margin-top: 1rem;
}

.october-dynamic-slider .btn-primary {
  display: inline-flex;
  margin-top: 1.25rem;
  padding: .75rem 1.2rem;
  border-radius: 999px;
  background: #00b3e3;
  color: #fff;
  text-decoration: none;
  font-weight: 600;
}

.october-dynamic-slider .hero-dots {
  position: absolute;
  left: 50%;
  bottom: 1.5rem;
  transform: translateX(-50%);
  display: flex;
  gap: .5rem;
  z-index: 5;
}

.october-dynamic-slider .hero-dots button {
  width: 10px;
  height: 10px;
  border-radius: 50%;
  border: 0;
  background: rgba(255, 255, 255, .35);
  cursor: pointer;
}

.october-dynamic-slider .hero-dots button.is-active {
  background: #00b3e3;
}

/* —— Tanıtım filmi trigger + popup ——
   Not: opacity:0 !important + @keyframes birlikte çalışmaz;
   görünürlük JS sınıfı (oxy-promo-ready) ile açılır. */
#n2-ss-2 .n2-ss-static-slide {
  position: absolute !important;
  inset: 0 !important;
  z-index: 80 !important;
  pointer-events: none !important;
  min-height: calc(100vh - 40px) !important;
  width: 100% !important;
}

#n2-ss-2 .n2-ss-static-slide>.n2-ss-layer,
#n2-ss-2 .n2-ss-static-slide .n2-ss-section-main-content {
  position: relative !important;
  min-height: calc(100vh - 40px) !important;
  height: 100% !important;
  width: 100% !important;
}

#n2-ss-2 .slide-bttm2.oxy-promo-entrance {
  display: block !important;
  position: absolute !important;
  right: 20px !important;
  bottom: 20px !important;
  left: auto !important;
  top: auto !important;
  width: 360px !important;
  height: 155px !important;
  z-index: 90 !important;
  opacity: 0 !important;
  visibility: hidden !important;
  transform: translate3d(0, -48px, 0);
  filter: blur(8px);
  pointer-events: none !important;
  transition:
    opacity 0.5s ease,
    transform 0.5s ease,
    filter 0.5s ease,
    visibility 0.5s;
}

#n2-ss-2 .slide-bttm2.oxy-promo-entrance.oxy-promo-ready {
  opacity: 1 !important;
  visibility: visible !important;
  transform: translate3d(0, 0, 0) !important;
  filter: blur(0) !important;
  pointer-events: auto !important;
}

#n2-ss-2 #slide_popup,
#n2-ss-2 [data-oxy-promo-open] {
  pointer-events: auto !important;
  cursor: pointer !important;
  z-index: 90 !important;
  position: relative;
}

#n2-ss-2 #slide_popup *,
#n2-ss-2 [data-oxy-promo-open] * {
  pointer-events: none !important;
}

#n2-ss-2 .oxy-promo-thumb>.x-bg>.x-bg-layer-lower-image {
  background-image: var(--oxy-promo-thumb, url(../uploads/2025/08/thumbnail.jpg)) !important;
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
}

#n2-ss-2 #slide_popup .x-anchor-content {
  position: relative;
  width: 100%;
  height: 100%;
  min-height: 40px;
}

#n2-ss-2 #slide_popup .oxy-promo-plus {
  display: none;
  position: absolute;
  inset: 0;
  align-items: center;
  justify-content: center;
  font-size: 28px;
  font-weight: 300;
  line-height: 1;
  color: #fff;
  text-shadow: 0 1px 8px rgba(0, 0, 0, 0.45);
}

#n2-ss-2 #slide_popup:hover .oxy-promo-play,
#n2-ss-2 #slide_popup:focus-visible .oxy-promo-play {
  opacity: 0;
}

#n2-ss-2 #slide_popup:hover .oxy-promo-plus,
#n2-ss-2 #slide_popup:focus-visible .oxy-promo-plus {
  display: flex;
}

.oxy-promo-modal {
  position: fixed;
  inset: 0;
  z-index: 1000000;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 24px;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transition: opacity 0.28s ease, visibility 0.28s ease;
}

.oxy-promo-modal.is-open {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
}

.oxy-promo-modal[hidden] {
  display: none !important;
}

.oxy-promo-modal.is-open[hidden] {
  display: flex !important;
}

.oxy-promo-modal__bg {
  position: absolute;
  inset: 0;
  background: rgba(2, 19, 41, 0.78);
  cursor: pointer;
}

.oxy-promo-modal__panel {
  position: relative;
  z-index: 1;
  width: min(960px, 92vw);
  transform: scale(0.96);
  transition: transform 0.28s ease;
}

.oxy-promo-modal.is-open .oxy-promo-modal__panel {
  transform: scale(1);
}

.oxy-promo-modal__close {
  position: absolute;
  top: -42px;
  right: 0;
  width: 36px;
  height: 36px;
  border: 0;
  border-radius: 10px;
  background: #021329;
  color: #fff;
  font-size: 24px;
  line-height: 1;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  z-index: 2;
}

.oxy-promo-modal__close:hover {
  color: #00b3e3;
}

.oxy-promo-modal__frame {
  overflow: hidden;
  border-radius: 24px;
  background: #000;
  box-shadow: 0 24px 80px rgba(0, 0, 0, 0.45);
}

.oxy-promo-modal__video {
  display: block;
  width: 100%;
  height: auto;
  max-height: 80vh;
  background: #000;
}

html.oxy-promo-open,
html.oxy-promo-open body {
  overflow: hidden;
}

@media (max-width: 991px) {
  .oxy-promo-modal__close {
    top: -40px;
    right: 4px;
  }

  .oxy-promo-modal__frame {
    border-radius: 16px;
  }
}

/* —— Ana sayfa header: açık logo ——
   İç sayfa karşılığı (koyu menü + dark logo) chrome-interior.css içindedir. */
body.home .oxy-logo-dark {
  display: none !important;
}

body.home .oxy-logo-light {
  display: inline-block !important;
}

/* Product CSS .x-div{position:relative;width:auto} ezmesin — Çözümler 30+ rozeti */
#transparent-menu .x-div.m1o-w,
#transparent-menu .cozumler_menu~.x-div.m1o-w,
body.product-detail #transparent-menu .x-div.m1o-w,
body.urun #transparent-menu .x-div.m1o-w {
  position: absolute !important;
  top: -5px !important;
  right: -15px !important;
  width: 23px !important;
  height: 12px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex-direction: column !important;
  border-radius: 99px !important;
  background-color: #00b3e3 !important;
  z-index: 2;
}

#transparent-menu .x-div.m1o-w .x-text-content-text-primary,
body.product-detail #transparent-menu .x-div.m1o-w .x-text-content-text-primary {
  font-size: 8px !important;
  font-weight: 600 !important;
  color: #fff !important;
  line-height: 1 !important;
}

#transparent-menu .x-div.m1o-s.m1o-t.m1o-u,
body.product-detail #transparent-menu .x-div.e60-e15 {
  position: relative !important;
}

/* Ürün detay: orijinal Cornerstone HTML (body_html) site.css ile stil alır */
.oxy-product-detail,
.product-detail .x-main {
  background: #fff;
}


/* —— Ürün detay sayfa —— */
.oxy-product-detail {
  background: #fff;
  color: #021329;
}

.oxy-product-hero {
  position: relative;
  min-height: 78vh;
  overflow: hidden;
  color: #fff;
}

.oxy-product-hero .x-bg {
  position: absolute;
  inset: 0;
  z-index: 0;
}

.oxy-product-hero-video {
  width: 100%;
  height: 100%;
  object-fit: cover;
  position: absolute;
  inset: 0;
}

.oxy-product-hero .x-bg-layer-upper-color {
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg, rgba(2, 19, 41, .72), rgba(2, 19, 41, .35) 55%, rgba(2, 19, 41, .55));
}

.oxy-product-hero .product_line {
  position: absolute;
  right: 8%;
  bottom: -8%;
  opacity: .35;
  z-index: 1;
  pointer-events: none;
}

.oxy-product-hero-row {
  position: relative;
  z-index: 2;
  padding: 140px 24px 60px;
}

.oxy-product-hero-row .x-row-inner {
  display: grid;
  grid-template-columns: 1fr 1.1fr 1fr;
  gap: 24px;
  align-items: center;
}

.oxy-product-hero-left .x-text-content-text-subheadline {
  display: block;
  opacity: .8;
  font-size: 14px;
  letter-spacing: .04em;
}

.oxy-product-hero-left .x-text-content-text-primary {
  display: block;
  font-size: clamp(2rem, 4vw, 3.4rem);
  font-weight: 700;
  line-height: 1.05;
}

.oxy-product-spec {
  display: grid;
  gap: 14px;
  margin-top: 28px;
}

.oxy-product-spec-item {
  display: flex;
  gap: 12px;
  align-items: flex-start;
}

.oxy-product-spec-item strong,
.oxy-product-spec-item span {
  display: block;
}

.oxy-product-spec-item span {
  opacity: .85;
  font-weight: 400;
}

.oxy-product-gallery {
  position: relative;
  min-height: 320px;
}

.oxy-product-gallery-slide {
  display: none;
}

.oxy-product-gallery-slide.is-active {
  display: block;
}

.oxy-product-gallery-slide img {
  width: 100%;
  max-width: 480px;
  margin: 0 auto;
  display: block;
  filter: drop-shadow(0 24px 48px rgba(0, 0, 0, .35));
}

.oxy-product-hero-eyebrow {
  font-size: 1rem;
  margin: 0 0 8px;
  font-weight: 500;
}

.oxy-product-hero-title {
  font-size: clamp(1.8rem, 3vw, 2.6rem);
  line-height: 1.15;
  margin: 0 0 18px;
}

.oxy-product-capacity-band {
  font-size: 1.35rem;
  font-weight: 600;
  margin-bottom: 20px;
}

.oxy-product-breadcrumb-sec,
.oxy-product-intro-sec,
.oxy-product-advantages,
.oxy-product-capacity,
.oxy-product-related,
.oxy-product-cta-form {
  padding: 48px 24px;
}

.oxy-product-breadcrumb {
  opacity: .65;
  font-size: 14px;
  margin-bottom: 18px;
}

.oxy-product-intro-eyebrow {
  font-size: 1rem;
  margin: 0 0 8px;
}

.oxy-product-intro-title,
.oxy-product-block-heading {
  font-size: clamp(1.6rem, 3vw, 2.2rem);
  line-height: 1.2;
  margin: 0 0 16px;
}

.oxy-product-intro-grid {
  display: grid;
  grid-template-columns: .9fr 1.4fr;
  gap: 40px;
  align-items: start;
}

.oxy-product-intro-text {
  font-size: 1.05rem;
  line-height: 1.65;
  margin-bottom: 24px;
}

.oxy-product-block-title {
  margin: 28px 0 14px;
  font-size: 1.15rem;
}

.oxy-product-usage-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px 24px;
}

.oxy-product-usage-item,
.oxy-product-diff-list li {
  display: flex;
  gap: 10px;
  align-items: flex-start;
}

.oxy-product-usage-item strong,
.oxy-product-usage-item span {
  display: block;
}

.oxy-product-diff-list {
  list-style: none;
  padding: 0;
  margin: 0;
  display: grid;
  gap: 12px;
}

.oxy-product-cta-row {
  display: flex;
  flex-wrap: wrap;
  gap: 16px;
  align-items: center;
  margin-top: 28px;
}

.oxy-product-models-btn {
  display: inline-flex;
  align-items: center;
  padding: 12px 18px;
  border-radius: 999px;
  background: #021329;
  color: #fff !important;
  text-decoration: none;
  font-weight: 600;
}

.oxy-product-certs {
  overflow: hidden;
  mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent);
}

.oxy-product-certs-track {
  display: flex;
  gap: 28px;
  width: max-content;
  animation: oxy-certs-marquee 28s linear infinite;
}

.oxy-product-cert img {
  opacity: .85;
  filter: grayscale(1);
}

@keyframes oxy-certs-marquee {
  from {
    transform: translateX(0);
  }

  to {
    transform: translateX(-50%);
  }
}

.oxy-product-advantages-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 28px;
  margin-top: 24px;
}

.oxy-product-advantage h3 {
  margin: 12px 0 8px;
  font-size: 1.1rem;
}

.oxy-product-advantage p {
  margin: 0;
  opacity: .8;
  line-height: 1.5;
}

.oxy-product-capacity-body .x-row-inner {
  display: grid;
  grid-template-columns: .85fr 1.35fr;
  gap: 28px;
  align-items: start;
}

.oxy-product-capacity-video video {
  width: 100%;
  border-radius: 16px;
  display: block;
}

.oxy-product-capacity-html .x-acc-header {
  cursor: pointer;
  padding: 14px 0;
  border-bottom: 1px solid rgba(2, 19, 41, .12);
  font-weight: 600;
}

.oxy-product-capacity-html .x-acc-content {
  padding: 12px 0 20px;
}

.oxy-product-related-sub {
  font-size: 1.15rem;
  font-weight: 500;
  max-width: 42ch;
  margin-bottom: 28px;
}

.oxy-product-related-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 18px;
}

.oxy-product-related-card {
  display: block;
  text-decoration: none;
  color: inherit;
  border: 1px solid rgba(2, 19, 41, .08);
  border-radius: 16px;
  overflow: hidden;
  background: #f7f9fc;
  transition: transform .2s ease, box-shadow .2s ease;
}

.oxy-product-related-card:hover {
  transform: translateY(-3px);
  box-shadow: 0 12px 28px rgba(2, 19, 41, .1);
}

.oxy-product-related-card img {
  width: 100%;
  aspect-ratio: 1;
  object-fit: contain;
  background: #eef3f8;
}

.oxy-product-related-meta {
  padding: 12px 14px 16px;
  display: grid;
  gap: 4px;
}

.oxy-product-related-meta .vol {
  font-size: 12px;
  opacity: .65;
}

.oxy-product-related-meta .ttl {
  font-size: 14px;
}

.oxy-product-cta-form {
  background: #021329;
  color: #fff;
}

.oxy-product-cta-form a {
  color: #00b3e3;
}

@media (max-width: 991px) {

  .oxy-product-hero-row .x-row-inner,
  .oxy-product-intro-grid,
  .oxy-product-capacity-body .x-row-inner,
  .oxy-product-advantages-grid,
  .oxy-product-related-grid,
  .oxy-product-usage-grid {
    grid-template-columns: 1fr;
  }

  .oxy-product-hero {
    min-height: auto;
  }

  .oxy-product-hero-row {
    padding-top: 110px;
  }
}

/* Ana dışı megamenü görünürlüğü / interval carousel → chrome-interior.css */

/* Header sağ: EN solda, CTA sağda — aynı hizada yan yana (2. görsel) */
.x-masthead .e60-e21 {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: flex-end;
  column-gap: 10px;
  row-gap: 0;
}

.x-masthead .e60-e21 .button-fixed {
  position: relative;
  inset: auto;
}

.x-masthead .e60-e21 .m1o-1a,
.x-masthead .e60-e21 .locale-switcher {
  margin-right: 0 !important;
  flex-shrink: 0;
}

/* Home ürün modelleri kartı — shape01 sol dikiş (beyaz 1px çizgi) */
.x-main a.x-slide .m9b-k{
  overflow:visible;
}
.x-main a.x-slide .m9b-k::before{
  left:-31px;
  bottom:-2px;
  width:33px;
  height:33px;
  background-image:url(/themes/oxyvitalsystems/assets/uploads/2025/07/shape01_bottom_right.svg);
  background-repeat:no-repeat;
  background-position:center center;
  background-size:contain;
  z-index:3;
}

/* site.css: 'Red Hat Display' ailesinde 500 yok → weight:500 istekleri 600'a sentezlenir (canlıdan ~%10 büyük görünür).
   Medium.woff2 zaten red-hat-display için tanımlı; canonical aile adına ekle. */
@font-face{font-family:'Red Hat Display';src:url(../uploads/2025/08/RedHatDisplay-Medium.woff2) format('woff2');font-weight:500;font-style:normal;font-display:swap}

/* Home perf: FA font-display block → swap (ikonlar aynı; FCP bloke olmaz) */
@font-face{font-family:'FontAwesome';font-style:normal;font-weight:900;font-display:swap;src:url(../fonts/fa-solid-900.woff2) format('woff2')}
@font-face{font-family:'FontAwesomePro';font-style:normal;font-weight:900;font-display:swap;src:url(../fonts/fa-solid-900.woff2) format('woff2')}
@font-face{font-family:'FontAwesome SharpSolid';font-style:normal;font-weight:900;font-display:swap;src:url(../fonts/fa-sharp-solid-900.woff2) format('woff2')}
@font-face{font-family:"Font Awesome 5 Free";font-style:normal;font-weight:900;font-display:swap;src:url(../fonts/fa-solid-900.woff2) format('woff2')}
@font-face{font-family:"Font Awesome Sharp Solid";font-style:normal;font-weight:900;font-display:swap;src:url(../fonts/fa-sharp-solid-900.woff2) format('woff2')}