/*
 Theme Name:   Flatsome Child — Zelvia
 Theme URI:    https://zelvia.rs
 Description:  Zelvia.rs child theme for Flatsome
 Author:       Zelvia.rs
 Template:     flatsome
 Version:      4.3.21
 Text Domain:  flatsome-child
*/

/* ==========================================================================
   Zelvia Brand Colors & Global Overrides
   ========================================================================== */

:root {
  --zelvia-green: #62a531;
  --zelvia-dark-green: #1c5900;
  --zelvia-forest: #294415;
  --zelvia-olive: #6b8a4a;
  --zelvia-terracotta: #c46a3a;
  --zelvia-terracotta-deep: #a8562e;
  --zelvia-bg-warm: #f5f0e8;
  --zelvia-bg-alt: #e8e0d0;
  --zelvia-border: #e0d8c8;
  --zelvia-text: #555555;
  --zelvia-white: #ffffff;
}

body {
  color: var(--zelvia-text);
  line-height: 1.7;
  background: #faf7f2;
}

h1, h2, h3, h4, h5, h6 {
  color: var(--zelvia-dark-green);
  line-height: 1.3;
  font-weight: 700 !important;
}

a { color: var(--zelvia-green); }
a:hover { color: var(--zelvia-dark-green); }

#top-bar { display: none !important; }

/* ==========================================================================
   Flatsome Container — wider default
   ========================================================================== */

.row-main {
  max-width: 1400px !important;
}

/* ==========================================================================
   FULL-BLEED SECTIONS — break out of .row-main container
   Background-colored sections must stretch edge-to-edge.
   ========================================================================== */

.zelvia-hero,
.zelvia-trust-bar,
.zelvia-family,
.zelvia-products,
.zelvia-doctor,
.zelvia-blog,
.zelvia-badges,
.zelvia-newsletter {
  width: 100vw !important;
  position: relative !important;
  left: 50% !important;
  right: 50% !important;
  margin-left: -50vw !important;
  margin-right: -50vw !important;
  max-width: none !important;
}

/* Content inside full-bleed sections stays centered at 1200px */
.zelvia-hero .section-content,
.zelvia-trust-bar .section-content,
.zelvia-family .section-content,
.zelvia-products .section-content,
.zelvia-doctor .section-content,
.zelvia-blog .section-content,
.zelvia-badges .section-content,
.zelvia-newsletter .section-content,
.zelvia-benefits .section-content,
.zelvia-brand-story .section-content,
.zelvia-testimonials .section-content {
  max-width: 1200px !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

/* ==========================================================================
   CTA Buttons — Terracotta
   ========================================================================== */

.button.primary,
button.primary,
.checkout-button,
.single_add_to_cart_button,
input[type="submit"].primary {
  background-color: var(--zelvia-terracotta) !important;
  border-color: var(--zelvia-terracotta) !important;
  color: #fff !important;
  border-radius: 8px !important;
  font-weight: 600 !important;
  transition: background 0.3s, transform 0.2s !important;
}

.button.primary:hover,
button.primary:hover,
.single_add_to_cart_button:hover {
  background-color: #a8562e !important;
  border-color: #a8562e !important;
  transform: translateY(-2px) !important;
}

.button.secondary,
button.secondary,
.button.outline {
  border-radius: 8px !important;
  font-weight: 600 !important;
  transition: background 0.3s, transform 0.2s, color 0.3s !important;
}

.button.outline:hover {
  transform: translateY(-2px) !important;
}

/* ==========================================================================
   Photo Placeholder (until real photos are added)
   ========================================================================== */

.zelvia-photo-placeholder {
  background: linear-gradient(135deg, #e8e0d0 0%, #d4c9b5 100%);
  display: flex;
  align-items: center;
  justify-content: center;
  color: #a89b86;
  font-size: 14px;
  font-weight: 500;
  width: 100%;
  border-radius: 14px 14px 0 0;
}

.zelvia-photo-placeholder[style*="border-radius:14px"] {
  border-radius: 14px !important;
}

/* ==========================================================================
   SHARED CARD STYLES — gap + rounded corners + hover + equal heights
   ========================================================================== */

/* Equal-height rows via flexbox */
.zelvia-cat-row,
.zelvia-family-grid,
.zelvia-benefits-grid,
.zelvia-badges-grid,
.zelvia-testimonials .row {
  display: flex !important;
  flex-wrap: wrap !important;
}

.zelvia-cat-row > .col,
.zelvia-family-grid > .col,
.zelvia-benefits-grid > .col,
.zelvia-badges-grid > .col,
.zelvia-testimonials .row > .col {
  padding-left: 14px !important;
  padding-right: 14px !important;
  padding-bottom: 28px !important;
  display: flex !important;
}

/* Cards stretch to full height of their column */
.zelvia-cat-col .col-inner,
.zelvia-family-card .col-inner,
.zelvia-benefit-col .col-inner,
.zelvia-testimonial-col .col-inner,
.zelvia-badges-grid .col .col-inner {
  border: 1px solid var(--zelvia-border);
  border-radius: 14px !important;
  overflow: hidden;
  background: #fff;
  transition: transform 0.3s, box-shadow 0.3s;
  display: flex !important;
  flex-direction: column !important;
  flex: 1 !important;
  width: 100% !important;
}

.zelvia-cat-col .col-inner:hover,
.zelvia-family-card .col-inner:hover,
.zelvia-benefit-col .col-inner:hover,
.zelvia-testimonial-col .col-inner:hover {
  transform: translateY(-4px);
  box-shadow: 0 12px 32px rgba(0,0,0,0.08);
}

/* ==========================================================================
   HERO CATEGORIES SECTION
   ========================================================================== */

.zelvia-hero {
  background: linear-gradient(135deg, #f5f0e8 0%, #e8e0d0 100%) !important;
}

.zelvia-hero h1 {
  font-size: 40px !important;
  line-height: 1.25 !important;
}

.zelvia-cat-body {
  padding: 24px !important;
  text-align: left !important;
  flex: 1 !important;
  display: flex !important;
  flex-direction: column !important;
}

.zelvia-cat-body p {
  flex: 1 !important;
}

.zelvia-cat-body h3 {
  font-size: 22px;
  margin-bottom: 12px;
}

.zelvia-cat-body p {
  font-size: 14px;
  line-height: 1.7;
  color: #666;
  margin-bottom: 20px;
}

.zelvia-cat-btn {
  margin-left: 24px !important;
  margin-bottom: 24px !important;
}

/* ==========================================================================
   TRUST BAR
   ========================================================================== */

.zelvia-trust-bar {
  background: var(--zelvia-forest) !important;
  padding: 20px 0 !important;
}

.zelvia-trust-item {
  color: #fff;
  font-size: 14px;
  line-height: 1.4;
}

.zelvia-trust-icon {
  font-size: 24px;
  display: block;
  margin-bottom: 8px;
}

/* ==========================================================================
   FAMILY SECTION
   ========================================================================== */

.zelvia-family {
  background: var(--zelvia-bg-warm) !important;
}

.zelvia-family-card-body {
  padding: 16px 24px 24px !important;
}

/* ==========================================================================
   PRODUCTS SECTION
   ========================================================================== */

.zelvia-products {
  background: var(--zelvia-bg-warm) !important;
}

.zelvia-products .products .button.product_type_simple,
.zelvia-products .products .button.add_to_cart_button {
  background-color: var(--zelvia-terracotta) !important;
  border-color: var(--zelvia-terracotta) !important;
  color: #fff !important;
  border-radius: 8px !important;
  width: 100%;
  text-align: center;
}

.zelvia-products .products .button:hover {
  background-color: #a8562e !important;
  border-color: #a8562e !important;
}

/* ==========================================================================
   BENEFITS SECTION
   ========================================================================== */

/* Benefit card content stretches to fill equal-height card */
.zelvia-benefit-col .col-inner > div,
.zelvia-benefit-col .col-inner > .text {
  flex: 1;
}

.zelvia-icon-circle {
  width: 64px;
  height: 64px;
  background: var(--zelvia-green);
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0 auto 20px;
  font-size: 28px;
  color: #fff;
}

.zelvia-icon-circle-sm {
  width: 56px;
  height: 56px;
  font-size: 24px;
  margin: 0 auto 16px;
}

/* ==========================================================================
   DOCTOR SECTION
   ========================================================================== */

.zelvia-doctor {
  background: var(--zelvia-bg-warm) !important;
}

.zelvia-subtitle {
  font-size: 17px;
  color: var(--zelvia-green);
  font-weight: 600;
  margin-bottom: 20px;
}

.zelvia-quote {
  background: var(--zelvia-bg-warm);
  border-left: 4px solid var(--zelvia-green);
  padding: 24px 28px;
  border-radius: 0 14px 14px 0;
  margin: 24px 0;
  font-style: italic;
  font-size: 15px;
  line-height: 1.7;
  color: #444;
}

.zelvia-quote-author {
  display: block;
  margin-top: 12px;
  font-style: normal;
  font-weight: 600;
  color: var(--zelvia-dark-green);
}

.zelvia-doctor-cats {
  list-style: none;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px;
  margin: 16px 0 24px;
  padding: 0;
}

.zelvia-doctor-cats li {
  font-size: 14px;
  line-height: 1.6;
  padding: 4px 0;
}

.zelvia-doctor-cats li::before {
  content: "\2713";
  color: var(--zelvia-green);
  font-weight: 700;
  margin-right: 10px;
}

.zelvia-verification {
  border-top: 1px solid var(--zelvia-border);
  padding-top: 20px;
  margin-top: 20px;
}

.zelvia-verification h4 {
  font-size: 15px;
  margin-bottom: 10px;
}

.zelvia-verification ul {
  list-style: none;
  padding: 0;
}

.zelvia-verification ul li {
  font-size: 13px;
  margin-bottom: 4px;
}

.zelvia-verification a {
  color: var(--zelvia-green);
  text-decoration: underline;
}

/* ==========================================================================
   BRAND STORY
   ========================================================================== */

.zelvia-brand-story-content {
  max-width: 800px !important;
  margin: 0 auto !important;
}

.zelvia-quote-terracotta {
  background: #fff;
  border-left: 4px solid var(--zelvia-terracotta);
  padding: 28px 32px;
  border-radius: 0 14px 14px 0;
  margin: 32px auto;
  max-width: 800px;
  font-style: italic;
  font-size: 17px;
  line-height: 1.7;
  color: #444;
  text-align: left;
}

/* ==========================================================================
   BLOG SECTION
   ========================================================================== */

.zelvia-blog {
  background: var(--zelvia-bg-warm) !important;
}

/* ==========================================================================
   TESTIMONIALS
   ========================================================================== */

.zelvia-avatar {
  width: 80px;
  height: 80px;
  border-radius: 50%;
  background-color: var(--zelvia-bg-alt);
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  margin: 0 auto 16px;
}

.zelvia-stars {
  color: #f5a623;
  font-size: 18px;
  margin-bottom: 12px;
}

.zelvia-testimonial-col .col-inner {
  border-radius: 14px !important;
  border: 1px solid var(--zelvia-border);
}

/* Testimonial columns — gap */
.zelvia-testimonials .row > .col {
  padding-left: 14px !important;
  padding-right: 14px !important;
}

/* ==========================================================================
   TRUST BADGES
   ========================================================================== */

.zelvia-badges {
  background: var(--zelvia-bg-alt) !important;
}

/* Remove white background from badge heading row */
.zelvia-badges .row .col-inner {
  background: transparent !important;
}

/* Badge card borders + rounded corners */
.zelvia-badges .zelvia-badges-grid .col .col-inner {
  border: 1px solid var(--zelvia-border) !important;
  border-radius: 14px !important;
  overflow: hidden;
  background: #fff !important;
}

/* ==========================================================================
   NEWSLETTER
   ========================================================================== */

.zelvia-newsletter {
  background: linear-gradient(135deg, #294415 0%, #3a6120 100%) !important;
}

.zelvia-newsletter .section-content {
  max-width: 800px !important;
  margin-left: auto !important;
  margin-right: auto !important;
  text-align: center !important;
  float: none !important;
}

.zelvia-newsletter .row {
  justify-content: center !important;
}

.zelvia-newsletter .row > .col {
  max-width: 100% !important;
  flex-basis: 100% !important;
  text-align: center !important;
}

/* Center copyright bar text */
.absolute-footer {
  text-align: center !important;
}

.absolute-footer .container {
  display: flex !important;
  justify-content: center !important;
}

.absolute-footer .footer-primary {
  text-align: center !important;
  width: 100% !important;
}

/* Hide payment icons in footer */
.absolute-footer .payment-icons {
  display: none !important;
}

.zelvia-newsletter-form {
  display: flex !important;
  gap: 0 !important;
  margin: 0 auto 16px !important;
  width: -moz-fit-content;
  width: fit-content;
  max-width: 100%;
  justify-content: center;
  align-items: stretch;
}

.zelvia-newsletter-form input {
  flex: 0 0 auto !important;
  width: 420px !important;
  max-width: 100%;
  padding: 0 20px !important;
  height: 52px !important;
  border: none !important;
  border-radius: 8px 0 0 8px !important;
  font-size: 15px !important;
  outline: none;
  margin: 0 !important;
  box-sizing: border-box;
}

.zelvia-nl-btn {
  display: inline-block !important;
  background: var(--zelvia-terracotta) !important;
  color: #fff !important;
  padding: 0 36px !important;
  height: 52px !important;
  line-height: 52px !important;
  border-radius: 0 8px 8px 0 !important;
  font-size: 16px !important;
  font-weight: 600 !important;
  border: none !important;
  cursor: pointer;
  transition: background 0.3s, transform 0.2s;
  white-space: nowrap;
  margin: 0 !important;
  min-width: 0 !important;
  flex: 0 0 auto !important;
  box-sizing: border-box;
}

.zelvia-nl-btn:hover {
  background: #a8562e;
  transform: translateY(-2px);
}

.zelvia-newsletter-note {
  font-size: 13px;
  opacity: 0.7;
  color: #fff;
  text-align: center;
}

.zelvia-nl-consent {
  max-width: 576px;
  margin: 18px auto 20px;
  color: #fff;
  font-size: 15px;
  display: flex;
  justify-content: center;
}

.zelvia-nl-consent label {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  cursor: pointer;
  line-height: 1.5;
  text-align: left;
}

.zelvia-nl-consent input[type="checkbox"] {
  margin: 0;
  flex-shrink: 0;
  cursor: pointer;
  width: 20px;
  height: 20px;
  accent-color: var(--zelvia-terracotta, #c06838);
}

@media (max-width: 768px) {
  .zelvia-nl-consent {
    font-size: 14px;
    padding: 0 8px;
  }
  .zelvia-nl-consent input[type="checkbox"] {
    width: 22px;
    height: 22px;
  }
}

.zelvia-nl-consent a {
  color: #fff;
  text-decoration: underline;
}

.zelvia-nl-consent a:hover {
  opacity: 0.8;
}

.zelvia-nl-consent-error {
  animation: zelvia-nl-shake 0.4s;
}

.zelvia-nl-consent-error label {
  color: #ff9999;
}

@keyframes zelvia-nl-shake {
  0%, 100% { transform: translateX(0); }
  25% { transform: translateX(-5px); }
  75% { transform: translateX(5px); }
}

/* ==========================================================================
   PRODUCT CARD BUTTONS (WooCommerce)
   ========================================================================== */

.products .button.product_type_simple,
.products .button.add_to_cart_button {
  background-color: var(--zelvia-terracotta) !important;
  border-color: var(--zelvia-terracotta) !important;
  color: #fff !important;
  border-radius: 8px !important;
}

.products .button.product_type_simple:hover,
.products .button.add_to_cart_button:hover {
  background-color: #a8562e !important;
  border-color: #a8562e !important;
}

/* ==========================================================================
   RESPONSIVE — TABLET (max-width: 1024px)
   ========================================================================== */

@media (max-width: 1024px) {
  .zelvia-hero h1 {
    font-size: 34px !important;
  }

  .zelvia-doctor-cats {
    grid-template-columns: 1fr;
  }
}

/* ==========================================================================
   RESPONSIVE — MOBILE (max-width: 768px)
   ========================================================================== */

@media (max-width: 768px) {
  .zelvia-hero h1 {
    font-size: 28px !important;
    margin-bottom: 28px !important;
  }

  .zelvia-newsletter-form {
    flex-direction: column !important;
    gap: 12px !important;
    width: 100% !important;
  }

  .zelvia-newsletter-form input {
    width: 100% !important;
    max-width: none !important;
    height: 56px !important;
    padding: 16px 20px !important;
    border-radius: 8px !important;
    font-size: 16px !important;
    box-sizing: border-box;
  }

  .zelvia-nl-btn {
    border-radius: 8px !important;
    width: 100% !important;
    height: 56px !important;
    line-height: 56px !important;
    text-align: center;
  }

  .zelvia-doctor-cats {
    grid-template-columns: 1fr;
  }

  .zelvia-family-card img {
    height: 520px !important;
  }
}

/* ==========================================================================
   RESPONSIVE — SMALL MOBILE (max-width: 480px)
   ========================================================================== */

@media (max-width: 480px) {
  .zelvia-hero h1 {
    font-size: 24px !important;
    margin-bottom: 20px !important;
  }
}

/* ==========================================================================
   FOOTER
   ========================================================================== */

.footer-wrapper,
.footer-wrapper .footer-widgets,
.footer-widgets.footer.footer-1,
.footer-widgets.footer.footer-2,
.footer-wrapper .footer-widgets.footer {
  background: var(--zelvia-forest) !important;
  color: #ccc !important;
}

.footer-wrapper .widget-title {
  color: #fff !important;
  font-size: 16px !important;
  margin-bottom: 16px;
}

.footer-wrapper a {
  color: #ccc !important;
  transition: color 0.2s;
}

.footer-wrapper a:hover {
  color: var(--zelvia-green) !important;
}

/* Force Flatsome footer to single column so our grid takes full width */
.footer-widgets .row {
  max-width: 100% !important;
}

.footer-widgets .row > .col {
  max-width: 100% !important;
  flex-basis: 100% !important;
  width: 100% !important;
}

/* Footer 4-column grid */
.zelvia-footer-grid {
  display: grid;
  grid-template-columns: 1.8fr 1fr 1fr 1.2fr;
  gap: 60px;
  max-width: 1400px;
  margin: 0 auto;
  padding: 60px 40px 40px;
}

.zelvia-footer-grid img {
  filter: none !important;
  opacity: 0.9;
}

.zelvia-footer-grid h4 {
  color: #fff !important;
  font-size: 16px !important;
  margin-bottom: 20px !important;
}

.zelvia-footer-grid p {
  color: #ccc;
  font-size: 14px;
  line-height: 1.7;
  margin-bottom: 8px;
}

.zelvia-footer-grid ul {
  list-style: none;
  padding: 0;
  margin: 0;
}

.zelvia-footer-grid ul li {
  margin-bottom: 10px;
}

.zelvia-footer-grid ul li a {
  color: #ccc !important;
  text-decoration: none;
  font-size: 14px;
  transition: color 0.2s;
}

.zelvia-footer-grid ul li a:hover {
  color: var(--zelvia-green) !important;
}

@media (max-width: 768px) {
  .zelvia-footer-grid {
    grid-template-columns: 1fr;
    gap: 32px;
    padding: 40px 20px 24px;
  }
}

.absolute-footer {
  background: #1a3310 !important;
  color: #999 !important;
  font-size: 13px;
}

.absolute-footer a {
  color: #aaa !important;
}

.absolute-footer a:hover {
  color: var(--zelvia-green) !important;
}

/* ==========================================================================
   ZELVIA PRODUCT PAGE — DESKTOP
   ========================================================================== */

/* Page background — warm beige like homepage */
.single-product {
  background: #faf7f2 !important;
}

/* Override Flatsome container max-width on product pages */
.single-product .container {
  max-width: 1400px !important;
}

/* Hero zone — two column layout */
.zelvia-product-hero {
  display: flex;
  gap: 32px;
  padding: 0 40px 36px;
  max-width: 1400px;
  margin: 0 auto;
}

.zelvia-product-hero__image {
  flex: 1;
  min-width: 0;
}

.zelvia-product-hero__image img.zelvia-product-img {
  border-radius: 14px;
  width: 100%;
  height: auto;
  object-fit: cover;
}

.zelvia-product-hero__info {
  flex: 1;
  min-width: 0;
  padding: 8px 0;
  display: flex;
  flex-direction: column;
}

/* Category badge */
.zelvia-category-badge {
  display: inline-block;
  width: fit-content;
  background: var(--zelvia-green);
  color: #fff;
  font-size: 11px;
  font-weight: 600;
  padding: 3px 10px;
  border-radius: 12px;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  margin-bottom: 12px;
}

/* Product title */
.zelvia-product-title {
  font-size: 24px !important;
  color: var(--zelvia-dark-green) !important;
  font-weight: 700 !important;
  line-height: 1.3 !important;
  margin-bottom: 14px !important;
}

/* Intro text — preserve original formatting */
.zelvia-product-intro {
  font-size: 14px;
  line-height: 1.7;
  color: var(--zelvia-text);
  margin-bottom: 16px;
}

.zelvia-product-intro h1 {
  display: none; /* H1 is already rendered above via the_title() */
}

.zelvia-product-intro p {
  margin-bottom: 12px;
}

/* Key benefits box */
.zelvia-key-benefits {
  background: var(--zelvia-bg-warm);
  border-radius: 10px;
  padding: 14px 18px;
  margin-bottom: 18px;
}

.zelvia-benefit-item {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 13px;
  color: var(--zelvia-text);
  margin-bottom: 6px;
}

.zelvia-benefit-item:last-child {
  margin-bottom: 0;
}

.zelvia-benefit-check {
  color: var(--zelvia-green);
  font-weight: 700;
}

/* Price */
.zelvia-product-price {
  font-size: 28px;
  font-weight: 700;
  color: var(--zelvia-dark-green);
  margin-bottom: 14px;
}

.zelvia-product-price .woocommerce-Price-currencySymbol {
  font-size: 16px;
  font-weight: 400;
}

/* Add to cart wrapper */
.zelvia-add-to-cart-wrap {
  margin-bottom: 18px;
}

.zelvia-add-to-cart-wrap .cart {
  display: flex !important;
  align-items: center;
  justify-content: center;
  gap: 12px;
}

.zelvia-add-to-cart-wrap .quantity {
  display: flex;
  align-items: center;
  border: 1px solid var(--zelvia-border);
  border-radius: 8px;
  overflow: hidden;
}

.zelvia-add-to-cart-wrap .quantity input[type="number"] {
  width: 48px;
  text-align: center;
  border: none;
  font-size: 15px;
  font-weight: 600;
  -moz-appearance: textfield;
  padding: 8px 0;
}

.zelvia-add-to-cart-wrap .quantity input::-webkit-outer-spin-button,
.zelvia-add-to-cart-wrap .quantity input::-webkit-inner-spin-button {
  -webkit-appearance: none;
}

.zelvia-add-to-cart-wrap .single_add_to_cart_button {
  flex: 1;
  padding: 14px 36px !important;
}

/* Trust signals — product page only (scoped to avoid overriding homepage trust bar) */
.zelvia-trust-signals {
  display: flex;
  justify-content: space-evenly;
  padding: 20px 0 0;
  margin-top: auto;
  border-top: 1px solid var(--zelvia-border);
}

.zelvia-trust-signals .zelvia-trust-item {
  display: flex;
  align-items: center;
  gap: 14px;
  font-size: 15px;
  color: var(--zelvia-text);
}

.zelvia-trust-signals .zelvia-trust-item strong {
  color: var(--zelvia-dark-green);
}

.zelvia-trust-signals .zelvia-trust-icon {
  width: 50px;
  height: 50px;
  background: var(--zelvia-bg-warm);
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 22px;
  flex-shrink: 0;
}

/* Sticky section navigation */
.zelvia-section-nav {
  border-top: 2px solid var(--zelvia-border);
  background: #faf7f2;
  position: sticky;
  top: 0;
  z-index: 100;
}

.zelvia-section-nav__inner {
  display: flex;
  gap: 24px;
  padding: 14px 40px;
  max-width: 1400px;
  margin: 0 auto;
}

.zelvia-section-nav__link {
  font-size: 14px;
  font-weight: 500;
  color: #888;
  text-decoration: none;
  padding-bottom: 4px;
  border-bottom: 2px solid transparent;
  transition: color 0.2s, border-color 0.2s;
  white-space: nowrap;
}

.zelvia-section-nav__link:hover {
  color: var(--zelvia-dark-green);
}

.zelvia-section-nav__link--active {
  color: var(--zelvia-green) !important;
  font-weight: 600;
  border-bottom-color: var(--zelvia-green);
}

/* Content sections */
.zelvia-product-content {
  max-width: 1400px;
  margin: 0 auto;
  padding: 32px 40px;
}

.zelvia-product-section {
  margin-bottom: 28px;
  padding-bottom: 28px;
  border-bottom: 1px solid var(--zelvia-border);
}

.zelvia-product-section:last-child {
  border-bottom: none;
  margin-bottom: 0;
  padding-bottom: 0;
}

.zelvia-product-content h2 {
  font-size: 22px !important;
  color: var(--zelvia-dark-green) !important;
  font-weight: 700 !important;
  margin-bottom: 14px !important;
}

.zelvia-product-content p {
  font-size: 14px;
  line-height: 1.7;
  color: var(--zelvia-text);
}

/* Sastav — ingredient grid */
.zelvia-product-content ul {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
  list-style: none !important;
  padding: 0 !important;
}

.zelvia-product-content ul li {
  padding: 10px 14px;
  background: var(--zelvia-bg-warm);
  border-radius: 6px;
  font-size: 14px;
  line-height: 1.6;
  color: var(--zelvia-text);
}

.zelvia-product-content ul li p {
  margin: 0;
  padding: 0;
}

/* Handle nested lists (Google Docs / WP editor double-wrapping) */
.zelvia-product-content ul li > ul {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
  list-style: none !important;
  margin: 0 !important;
  padding: 0 !important;
  background: none !important;
}

.zelvia-product-content ul li > ul > li {
  background: var(--zelvia-bg-warm);
  border-radius: 6px;
  padding: 10px 14px;
  font-size: 14px;
  line-height: 1.6;
  margin: 0 !important;
}

/* Remove card styling from outer li that wraps an inner ul */
.zelvia-product-content ul li:has(> ul) {
  background: none !important;
  padding: 0 !important;
  border-radius: 0 !important;
}

/* Mobile: inner grid also single column */
@media (max-width: 768px) {
  .zelvia-product-content ul li > ul {
    grid-template-columns: 1fr;
  }
}

/* FAQ — card style for H3 + P pairs */
.zelvia-product-content h3 {
  font-weight: 700 !important;
  font-size: 15px !important;
  color: var(--zelvia-dark-green) !important;
  border: 1px solid var(--zelvia-border);
  border-bottom: none;
  border-radius: 10px 10px 0 0;
  padding: 14px 18px 0 !important;
  margin-top: 10px !important;
  margin-bottom: 0 !important;
}

.zelvia-product-content h3:first-of-type {
  margin-top: 0 !important;
}

.zelvia-product-content h3 + p {
  border: 1px solid var(--zelvia-border);
  border-top: none;
  border-radius: 0 0 10px 10px;
  padding: 8px 18px 14px !important;
  margin-top: 0 !important;
  font-size: 13px;
  line-height: 1.6;
  color: var(--zelvia-text);
}

/* Related products — targets Flatsome's actual markup:
   .zelvia-related-products > .related.related-products-wrapper > h3 + .row.row-slider > .product-small.col */
.zelvia-related-products {
  background: var(--zelvia-bg-warm);
  border-top: 2px solid var(--zelvia-border);
  padding: 40px 0;
}

.zelvia-related-products .related-products-wrapper {
  max-width: 1400px;
  margin: 0 auto;
  padding: 0 16px; /* side padding === grid gap for equal visual spacing */
}

.zelvia-related-products .product-section-title,
.zelvia-related-products .product-section-title-related {
  text-align: center !important;
  font-size: 22px !important;
  margin-bottom: 24px !important;
  border: none !important;
  padding: 0 !important;
  width: 100% !important;
  max-width: none !important;
}

/* Force a clean 4-column grid; override Flatsome's Flickity slider layout.
   minmax(0, 1fr) allows cells to shrink below their content's intrinsic min-width
   (prevents horizontal overflow when product images/text want more space).
   max-width: none required — Flatsome's .row-small bakes in max-width: 1065px
   which clamps the grid and collapses 1fr to fixed 254px columns. */
.zelvia-related-products .row,
.zelvia-related-products .row.row-slider,
.zelvia-related-products .row.large-columns-4,
.zelvia-related-products .row.row-small {
  display: grid !important;
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: 16px !important;
  margin: 0 !important;
  width: 100% !important;
  max-width: none !important;
  transform: none !important;
}

.zelvia-related-products .row > .product-small.col {
  width: auto !important;
  max-width: none !important;
  min-width: 0 !important;
  flex: none !important;
  padding: 0 !important;
  margin: 0 !important;
  position: static !important;
  transform: none !important;
  left: auto !important;
  background: #fcfaf6; /* warm off-white, harmonizes with cream section */
  border: none;
  border-radius: 14px;
  overflow: hidden;
  box-sizing: border-box;
  box-shadow: 0 2px 10px rgba(51, 77, 41, 0.06), 0 1px 2px rgba(51, 77, 41, 0.04);
}

.zelvia-related-products .row > .product-small.col .col-inner {
  padding: 0 !important;
  width: 100% !important;
}

/* Give the image breathing room from the card's top and side edges */
.zelvia-related-products .row > .product-small.col .box-image {
  padding: 18px 18px 8px !important;
  background: transparent !important;
}

.zelvia-related-products .row > .product-small.col .box-image img {
  border-radius: 8px !important;
  height: 200px !important;
  width: 100% !important;
  object-fit: contain !important;
  background: transparent;
}

/* More generous vertical padding + spacing between kicker, title, price */
.zelvia-related-products .row > .product-small.col .box-text {
  padding: 6px 18px 20px !important;
}

.zelvia-related-products .row > .product-small.col .box-text > *,
.zelvia-related-products .row > .product-small.col .box-text-products > * {
  margin-top: 8px !important;
  margin-bottom: 0 !important;
}
.zelvia-related-products .row > .product-small.col .box-text > *:first-child,
.zelvia-related-products .row > .product-small.col .box-text-products > *:first-child {
  margin-top: 0 !important;
}

.zelvia-related-products .row > .product-small.col .product-title,
.zelvia-related-products .row > .product-small.col .woocommerce-loop-product__title {
  font-size: 13px !important;
  font-weight: 600 !important;
  line-height: 1.45 !important;
  color: var(--zelvia-dark-green) !important;
}

.zelvia-related-products .row > .product-small.col .price {
  font-size: 15px !important;
  font-weight: 700 !important;
  color: var(--zelvia-dark-green) !important;
}

/* Neutralize Flickity if it initializes */
.zelvia-related-products .flickity-viewport,
.zelvia-related-products .flickity-slider {
  transform: none !important;
  position: static !important;
  height: auto !important;
  width: auto !important;
}
.zelvia-related-products .flickity-page-dots,
.zelvia-related-products .flickity-prev-next-button {
  display: none !important;
}

/* Hide default Flatsome product page elements that may leak through */
.product-info .product_meta,
.product-info .product_title,
.woocommerce-tabs,
.related.products:not(.zelvia-related-products .related.products) {
  display: none !important;
}

/* Breadcrumbs styling */
.woocommerce-breadcrumb {
  font-size: 12px !important;
  color: #888 !important;
  padding: 12px 40px !important;
  max-width: 1400px;
  margin: 0 auto !important;
}

.woocommerce-breadcrumb a {
  color: var(--zelvia-green) !important;
}

/* Hide Flatsome default product layout wrappers if they interfere */
.product-container .product-main {
  display: none !important;
}

.product-container .product-sidebar {
  float: none !important;
  width: 100% !important;
}

/* ==========================================================================
   ZELVIA PRODUCT PAGE — MOBILE (< 768px)
   ========================================================================== */

@media (max-width: 768px) {
  /* Hero zone — single column */
  .zelvia-product-hero {
    flex-direction: column;
    gap: 0;
    padding: 0 16px 0;
  }

  .zelvia-product-hero__image img.zelvia-product-img {
    border-radius: 14px;
    height: 300px;
    object-fit: cover;
  }

  .zelvia-product-hero__info {
    padding: 16px 0 0;
  }

  .zelvia-product-title {
    font-size: 19px !important;
  }

  .zelvia-product-intro {
    font-size: 13px;
  }

  .zelvia-product-price {
    font-size: 24px;
    text-align: center;
  }

  /* Full-width add to cart button */
  .zelvia-add-to-cart-wrap .cart {
    flex-direction: column;
  }

  .zelvia-add-to-cart-wrap .single_add_to_cart_button {
    width: 100%;
  }

  /* Trust signals stacked — product page only */
  .zelvia-trust-signals {
    flex-direction: column;
    gap: 20px;
    align-items: center;
    padding: 20px 4px;
  }

  .zelvia-trust-signals .zelvia-trust-item {
    flex: none;
    font-size: 16px;
    width: 270px;
  }

  .zelvia-trust-signals .zelvia-trust-icon {
    width: 52px;
    height: 52px;
    font-size: 24px;
  }

  /* Section nav — horizontal scroll */
  .zelvia-section-nav__inner {
    padding: 12px 16px;
    gap: 16px;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
  }

  .zelvia-section-nav__link {
    font-size: 12px;
    flex-shrink: 0;
  }

  /* Content sections */
  .zelvia-product-content {
    padding: 20px 16px;
  }

  .zelvia-product-content h2 {
    font-size: 18px !important;
  }

  .zelvia-product-content p {
    font-size: 13px;
  }

  /* Sastav — single column on mobile */
  .zelvia-product-content ul {
    grid-template-columns: 1fr;
  }

  /* Related products — 2 columns on mobile */
  .zelvia-related-products .row,
  .zelvia-related-products .row.row-slider,
  .zelvia-related-products .row.large-columns-4 {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 12px !important;
  }

  .zelvia-related-products .related-products-wrapper {
    padding: 0 16px !important;
  }

  /* Force every descendant to border-box + min-width:0 so grid cells shrink properly */
  .zelvia-related-products .row > .product-small.col,
  .zelvia-related-products .row > .product-small.col * {
    min-width: 0 !important;
    box-sizing: border-box !important;
    max-width: 100% !important;
  }

  .zelvia-related-products .row > .product-small.col .box-image,
  .zelvia-related-products .row > .product-small.col .box-text,
  .zelvia-related-products .row > .product-small.col .col-inner,
  .zelvia-related-products .row > .product-small.col .box-image img {
    width: 100% !important;
  }

  .zelvia-related-products .row > .product-small.col .box-image img {
    height: 140px !important;
    object-fit: contain !important;
  }

  .zelvia-related-products {
    padding: 24px 0;
  }

  /* Breadcrumbs */
  .woocommerce-breadcrumb {
    padding: 8px 16px !important;
    font-size: 11px !important;
  }

  /* Sticky bottom bar space */
  .single-product {
    padding-bottom: 70px;
  }
}

/* ==========================================================================
   MOBILE STICKY BOTTOM BAR
   ========================================================================== */

.zelvia-mobile-sticky-bar {
  display: none;
  position: fixed;
  bottom: 0;
  left: 0;
  right: 0;
  background: #fff;
  border-top: 1px solid var(--zelvia-border);
  padding: 10px 16px;
  align-items: center;
  justify-content: space-between;
  box-shadow: 0 -2px 8px rgba(0,0,0,0.06);
  z-index: 999;
}

/* iOS Safari URL-bar-collapse gap fallback: when the bottom URL bar collapses
   on scroll, layout viewport may not update in lockstep, leaving a transparent
   gap between the fixed bar and the visible bottom. This pseudo-element extends
   the bar's white background below its bottom edge so the gap is visually
   masked regardless of viewport math quirks. */
.zelvia-mobile-sticky-bar::after {
  content: '';
  position: absolute;
  top: 100%;
  left: 0;
  right: 0;
  height: 200px;
  background: #fff;
  pointer-events: none;
}

/* Flatsome sticky-jump: replace 0.6s slide-down animation with a fast fade so
   the original (still partially visible) and cloned (sliding in) headers don't
   double-render their logos for ~0.6s on mobile scroll. */
.sticky-jump .stuck:not(.ux-no-animation) {
  animation-name: stuckFadeIn !important;
  animation-duration: 0.15s !important;
}

/* Defensive single-logo guarantee in stuck state: regardless of Flatsome's
   internal sticky-class logic (which can mis-fire on iOS Safari), only the
   regular .header-logo renders inside .header-wrapper.stuck. */
.header-wrapper.stuck .header-logo {
  display: block !important;
}
.header-wrapper.stuck .header-logo-sticky,
.header-wrapper.stuck .header-logo-dark {
  display: none !important;
}

.zelvia-mobile-sticky-bar__name {
  font-size: 11px;
  color: #888;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 180px;
}

.zelvia-mobile-sticky-bar__price {
  font-size: 18px;
  font-weight: 700;
  color: var(--zelvia-dark-green);
}

.zelvia-mobile-sticky-bar__btn {
  background: var(--zelvia-terracotta);
  color: #fff;
  border: none;
  padding: 12px 24px;
  border-radius: 8px;
  font-size: 14px;
  font-weight: 600;
  cursor: pointer;
  white-space: nowrap;
}

.zelvia-mobile-sticky-bar__btn:hover {
  background: #a8562e;
}

/* Only show on mobile */
@media (min-width: 769px) {
  .zelvia-mobile-sticky-bar {
    display: none !important;
  }
}

/* Narrow viewport (≤400px CSS) — Redmi 15C 720x1600 ≈ 360 CSS px, iPhone SE 375 px.
   Fixes button cut-off on the right edge by trimming horizontal padding,
   shortening name max-width, and using a slightly smaller button. */
@media (max-width: 400px) {
  .zelvia-mobile-sticky-bar {
    padding: 10px 12px;
  }
  .zelvia-mobile-sticky-bar__name {
    max-width: 130px;
  }
  .zelvia-mobile-sticky-bar__btn {
    padding: 10px 16px;
    font-size: 13px;
  }
}

/* ==========================================================================
   FLATSOME CONFLICT OVERRIDES
   ========================================================================== */

/* Hide empty Flatsome product row (gallery + info columns) since we use our own hero */
.single-product .product-container .row.content-row {
  display: none !important;
}

/* Collapse empty Flatsome product wrappers that create gaps */
.single-product .product-container {
  padding-top: 0 !important;
  margin-top: 0 !important;
}

.single-product .product-main > .row:first-child {
  display: none !important;
}

.single-product .product-container .product-gallery,
.single-product .product-container .product-info:not(:has(.zelvia-product-content)) {
  display: none !important;
  height: 0 !important;
  padding: 0 !important;
  margin: 0 !important;
  overflow: hidden !important;
}

/* Ensure hero zone breaks out of any Flatsome container */
.zelvia-product-hero {
  max-width: 1400px;
  margin: 0 auto;
}

/* Remove Flatsome social sharing icons on product page */
.product-info .social-icons,
.product_meta {
  display: none !important;
}

/* Ensure content sections and nav are full width */
.single-product .zelvia-section-nav,
.single-product .zelvia-product-content,
.single-product .zelvia-related-products {
  width: 100%;
}

/* ============================================================
   HEADER — Logo + Brand Name
   ============================================================ */
.logo a {
  display: flex !important;
  align-items: center;
  gap: 8px;
}
.logo a::after {
  content: "Zelvia";
  font-size: 22px;
  font-weight: 700;
  color: #1c5900;
  letter-spacing: 0.5px;
  white-space: nowrap;
  text-transform: none;
}

/* Mobile: show brand name text next to logo, properly centered.
   Flatsome's .medium-logo-center uses flex-left/flex-right with flex:1 1 0
   and .logo with default width + text-align:center. Our .logo a override
   (display:flex) breaks that centering. Fix: make anchor inline-flex so it
   can be centered via text-align, and zero out Flatsome's img margin:auto
   which collides with flex layout. */
@media (max-width: 849px) {
  .medium-logo-center #logo {
    text-align: center;
  }
  .logo a {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    gap: 6px;
  }
  .logo a img {
    margin: 0 !important;
  }
  .logo a::after {
    font-size: 24px;
    letter-spacing: 0.3px;
  }
}

/* ============================================================
   O NAMA PAGE (v3.3.0)
   ============================================================ */

/* --- Hero --- */
.onama-hero {
  background: linear-gradient(135deg, #f5f0e8 0%, #e8e0d0 100%);
  padding: 64px 0 0;
  text-align: center;
}
.onama-hero h1 {
  font-size: 42px;
  color: #1c5900;
  margin-bottom: 20px;
  max-width: 800px;
  margin-left: auto;
  margin-right: auto;
  line-height: 1.3;
}
.onama-hero .onama-subheadline {
  font-size: 18px;
  color: #666;
  max-width: 680px;
  margin: 0 auto 48px;
  font-style: italic;
  line-height: 1.7;
}
.onama-hero-photo {
  max-width: 900px;
  width: 100%;
  margin: 0 auto;
  border-radius: 14px 14px 0 0;
  overflow: hidden;
  background: linear-gradient(135deg, #e8e0d0 0%, #d4c9b5 100%);
  color: #a89b86;
  font-size: 14px;
}
.onama-hero-photo:not(:has(.onama-hero-img)) {
  height: 420px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  gap: 8px;
}
.onama-hero-photo .placeholder-icon { font-size: 48px; opacity: 0.6; }
.onama-hero-photo .onama-hero-img {
  width: 100%;
  height: auto;
  display: block;
  border-radius: inherit;
}

/* --- Shared section padding --- */
.onama-section { padding: 80px 0; }
.onama-container { max-width: 1200px; margin: 0 auto; padding: 0 24px; }

/* --- Brand Story --- */
.onama-brand-story { background: #fff; }
.onama-brand-story-inner {
  max-width: 800px;
  margin: 0 auto;
}
.onama-brand-story-inner h2 {
  font-size: 36px;
  color: #1c5900;
  margin-bottom: 28px;
  text-align: center;
  line-height: 1.3;
}
.onama-brand-story-inner p {
  font-size: 16px;
  line-height: 1.8;
  margin-bottom: 20px;
  color: #555;
}
.onama-brand-story-cta {
  text-align: center;
  margin-top: 36px;
}

/* --- Family Section --- */
.onama-family { background: #f5f0e8; }
.onama-family-intro {
  max-width: 800px;
  margin: 0 auto 56px;
  text-align: center;
}
.onama-family-intro h2 {
  font-size: 36px;
  color: #1c5900;
  margin-bottom: 16px;
  line-height: 1.3;
}
.onama-family-intro p { font-size: 17px; color: #666; line-height: 1.7; }

/* Zigzag bios */
.onama-bio {
  display: flex;
  gap: 48px;
  align-items: center;
  margin-bottom: 64px;
}
.onama-bio:last-child { margin-bottom: 0; }
.onama-bio.reversed { flex-direction: row-reverse; }
.onama-bio-photo {
  flex: 0 0 380px;
  height: 440px;
  border-radius: 14px;
  overflow: hidden;
  background: linear-gradient(135deg, #e8e0d0 0%, #d4c9b5 100%);
  display: flex;
  align-items: center;
  justify-content: center;
  color: #a89b86;
  font-size: 14px;
  flex-direction: column;
  gap: 8px;
}
.onama-bio-photo .placeholder-icon { font-size: 48px; opacity: 0.6; }
.onama-bio-content { flex: 1; }
.onama-bio-content h3 {
  font-size: 26px;
  color: #1c5900;
  margin-bottom: 4px;
  line-height: 1.3;
}
.onama-bio-content .onama-role {
  font-size: 15px;
  color: #6b8a4a;
  font-weight: 600;
  margin-bottom: 20px;
  text-transform: uppercase;
  letter-spacing: 0.5px;
}
.onama-bio-content p {
  font-size: 15px;
  line-height: 1.8;
  margin-bottom: 16px;
  color: #555;
}
.onama-bio-content p:last-child { margin-bottom: 0; }

/* --- Values --- */
.onama-values { background: #fff; }
.onama-values h2 {
  font-size: 36px;
  color: #1c5900;
  text-align: center;
  margin-bottom: 48px;
  line-height: 1.3;
}
.onama-values-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 28px;
}
.onama-value-card {
  background: #f5f0e8;
  border: 1px solid #e0d8c8;
  border-radius: 14px;
  padding: 32px;
  transition: transform 0.3s, box-shadow 0.3s;
}
.onama-value-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 12px 32px rgba(0,0,0,0.08);
}
.onama-value-icon {
  width: 56px; height: 56px;
  background: #62a531;
  border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  font-size: 26px;
  margin-bottom: 20px;
  color: #fff;
}
.onama-value-card h3 {
  font-size: 19px;
  color: #1c5900;
  margin-bottom: 12px;
  line-height: 1.3;
}
.onama-value-card p {
  font-size: 15px;
  line-height: 1.7;
  color: #666;
}

/* --- Doctor Section (Dark) --- */
.onama-doctor {
  background: #294415;
  color: #fff;
}
.onama-doctor h2 {
  font-size: 36px;
  color: #fff;
  text-align: center;
  margin-bottom: 48px;
  line-height: 1.3;
}
.onama-doctor-layout {
  display: flex;
  gap: 48px;
  align-items: flex-start;
}
.onama-doctor-photo {
  flex: 0 0 320px;
  height: 400px;
  border-radius: 14px;
  overflow: hidden;
  background: linear-gradient(135deg, #3d6625 0%, #294415 100%);
  display: flex; align-items: center; justify-content: center;
  color: rgba(255,255,255,0.5);
  font-size: 14px;
  flex-direction: column;
  gap: 8px;
}
.onama-doctor-photo .placeholder-icon { font-size: 48px; opacity: 0.6; }
.onama-doctor-content { flex: 1; }
.onama-doctor-content h3 {
  font-size: 24px;
  color: #fff;
  margin-bottom: 4px;
  line-height: 1.3;
}
.onama-doctor-content .onama-doctor-subtitle {
  font-size: 15px;
  color: rgba(255,255,255,0.7);
  font-weight: 600;
  margin-bottom: 20px;
}
.onama-doctor-content > p {
  font-size: 15px;
  line-height: 1.8;
  color: rgba(255,255,255,0.9);
  margin-bottom: 16px;
}
.onama-doctor-quote {
  background: rgba(255,255,255,0.1);
  border-left: 4px solid #62a531;
  padding: 24px 28px;
  border-radius: 0 14px 14px 0;
  margin: 24px 0;
  font-style: italic;
  font-size: 16px;
  line-height: 1.7;
  color: rgba(255,255,255,0.95);
}
.onama-doctor-quote .author {
  display: block;
  margin-top: 12px;
  font-style: normal;
  font-weight: 600;
  color: #fff;
}
.onama-doctor-categories { margin: 24px 0; }
.onama-doctor-categories h4 {
  font-size: 16px;
  color: #fff;
  margin-bottom: 12px;
}
.onama-doctor-categories ul {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 10px;
  list-style: none;
  padding: 0;
  margin: 0;
}
.onama-doctor-categories li {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  font-size: 14px;
  line-height: 1.5;
  color: rgba(255,255,255,0.9);
}
.onama-doctor-categories li .check {
  color: #62a531;
  font-weight: 700;
  flex-shrink: 0;
}
.onama-doctor-verification {
  border-top: 1px solid rgba(255,255,255,0.15);
  padding-top: 20px;
  margin-top: 24px;
}
.onama-doctor-verification h4 {
  font-size: 15px;
  color: #fff;
  margin-bottom: 10px;
}
.onama-doctor-verification ul {
  list-style: none;
  padding: 0;
  margin: 0;
}
.onama-doctor-verification ul li {
  font-size: 13px;
  margin-bottom: 6px;
  color: rgba(255,255,255,0.8);
}
.onama-doctor-verification a {
  color: #62a531;
  text-decoration: underline;
  word-break: break-all;
}

/* --- Product Selection --- */
.onama-selection { background: #f5f0e8; }
.onama-selection-inner {
  max-width: 800px;
  margin: 0 auto;
}
.onama-selection-inner h2 {
  font-size: 36px;
  color: #1c5900;
  text-align: center;
  margin-bottom: 24px;
  line-height: 1.3;
}
.onama-selection-inner > p {
  font-size: 16px;
  line-height: 1.8;
  margin-bottom: 20px;
  text-align: center;
  color: #555;
}
.onama-selection-list {
  list-style: none;
  margin: 28px 0;
  padding: 0;
}
.onama-selection-list li {
  position: relative;
  font-size: 16px;
  line-height: 1.7;
  margin-bottom: 16px;
  padding: 16px 20px 16px 56px;
  background: #fff;
  border-radius: 10px;
  border: 1px solid #e0d8c8;
  color: #555;
}
.onama-check-circle {
  width: 28px; height: 28px;
  background: #62a531;
  border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  color: #fff; font-size: 14px; font-weight: 700;
  position: absolute;
  left: 16px;
  top: 16px;
}
.onama-selection-bottom {
  text-align: center;
  font-size: 17px;
  line-height: 1.7;
  margin-top: 28px;
  color: #555;
}

/* --- Sombor --- */
.onama-sombor { background: #fff; }
.onama-sombor-inner {
  max-width: 800px;
  margin: 0 auto;
}
.onama-sombor-inner h2 {
  font-size: 36px;
  color: #1c5900;
  text-align: center;
  margin-bottom: 28px;
  line-height: 1.3;
}
.onama-sombor-inner > p {
  font-size: 16px;
  line-height: 1.8;
  margin-bottom: 20px;
  color: #555;
}
.onama-sombor-quote {
  background: #f5f0e8;
  border-left: 4px solid #c46a3a;
  padding: 28px 32px;
  border-radius: 0 14px 14px 0;
  margin: 32px 0;
  font-style: italic;
  font-size: 17px;
  line-height: 1.7;
  color: #444;
}
.onama-sombor-quote .author {
  display: block;
  margin-top: 12px;
  font-style: normal;
  font-weight: 600;
  color: #1c5900;
}

/* --- Testimonials --- */
.onama-testimonials { background: #f5f0e8; }
.onama-testimonials h2 {
  font-size: 36px;
  color: #1c5900;
  text-align: center;
  margin-bottom: 48px;
  line-height: 1.3;
}
.onama-testimonials-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 28px;
}
.onama-testimonial-card {
  background: #fff;
  border: 1px solid #e0d8c8;
  border-radius: 14px;
  padding: 32px;
  text-align: center;
  transition: transform 0.3s, box-shadow 0.3s;
}
.onama-testimonial-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 12px 32px rgba(0,0,0,0.08);
}
.onama-testimonial-card .stars { color: #f5a623; font-size: 18px; margin-bottom: 16px; }
.onama-testimonial-card p { font-size: 14px; font-style: italic; color: #666; margin-bottom: 16px; line-height: 1.6; }
.onama-testimonial-card .name { font-weight: 600; color: #333; font-size: 14px; }
.onama-testimonial-note { margin-top: 28px; font-size: 14px; color: #999; font-style: italic; text-align: center; }

/* --- Trust Badges --- */
.onama-badges { background: #fff; }
.onama-badges h2 {
  font-size: 36px;
  color: #1c5900;
  text-align: center;
  margin-bottom: 48px;
  line-height: 1.3;
}
.onama-badges-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
}
.onama-badge-item {
  text-align: center;
  padding: 28px 20px;
  background: #f5f0e8;
  border: 1px solid #e0d8c8;
  border-radius: 14px;
  transition: transform 0.3s;
}
.onama-badge-item:hover { transform: translateY(-3px); }
.onama-badge-icon {
  width: 56px; height: 56px;
  background: #62a531;
  border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  margin: 0 auto 16px;
  font-size: 24px;
  color: #fff;
}
.onama-badge-item h4 {
  font-size: 15px;
  color: #1c5900;
  margin-bottom: 6px;
}
.onama-badge-item p { font-size: 13px; color: #888; line-height: 1.5; }

/* --- Final CTA --- */
.onama-final-cta {
  background: linear-gradient(135deg, #e8e0d0 0%, #f5f0e8 100%);
  text-align: center;
}
.onama-final-cta p {
  font-size: 17px;
  color: #666;
  margin-bottom: 28px;
}
.onama-cta-buttons {
  display: flex;
  gap: 16px;
  justify-content: center;
  flex-wrap: wrap;
}

/* --- O Nama scroll reveal --- */
.onama-reveal {
  opacity: 0;
  transform: translateY(30px);
  transition: opacity 0.7s ease, transform 0.7s ease;
}
.onama-reveal.active {
  opacity: 1;
  transform: translateY(0);
}

/* --- O Nama Responsive --- */
@media (max-width: 1024px) {
  .onama-hero h1 { font-size: 36px; }
  .onama-bio { gap: 32px; }
  .onama-bio-photo { flex: 0 0 320px; height: 380px; }
  .onama-doctor-layout { gap: 32px; }
  .onama-doctor-photo { flex: 0 0 260px; height: 340px; }
}

@media (max-width: 768px) {
  .onama-section { padding: 56px 0; }
  .onama-hero { padding: 44px 0 0; }
  .onama-hero h1 { font-size: 30px; }
  .onama-hero .onama-subheadline { font-size: 16px; }
  .onama-hero-photo:not(:has(.onama-hero-img)) { height: 280px; }

  .onama-brand-story-inner h2,
  .onama-family-intro h2,
  .onama-values h2,
  .onama-doctor h2,
  .onama-selection-inner h2,
  .onama-sombor-inner h2,
  .onama-testimonials h2,
  .onama-badges h2 { font-size: 28px; }

  .onama-bio,
  .onama-bio.reversed {
    flex-direction: column;
    gap: 0;
    align-items: stretch;
  }
  .onama-bio-content {
    display: contents;
  }
  .onama-bio-content h3 { order: 1; margin-bottom: 4px; }
  .onama-bio-content .onama-role { order: 2; margin-bottom: 16px; }
  .onama-bio-photo {
    order: 3;
    flex: none;
    width: 100%;
    height: 320px;
    margin-bottom: 20px;
  }
  .onama-bio:nth-child(2) .onama-bio-photo,
  .onama-bio:nth-child(3) .onama-bio-photo,
  .onama-bio:nth-child(5) .onama-bio-photo {
    height: 480px !important;
  }
  .onama-bio-content p { order: 4; margin-bottom: 12px; }
  .onama-bio-content p:last-child { margin-bottom: 0; }

  .onama-values-grid { grid-template-columns: 1fr; }

  .onama-doctor-layout {
    flex-direction: column;
    gap: 24px;
  }
  .onama-doctor-photo {
    flex: none;
    width: 100%;
    height: 440px;
  }
  .onama-doctor-photo img { object-position: center 15% !important; }
  .onama-doctor-categories ul { grid-template-columns: 1fr; }

  .onama-selection-list li {
    padding: 14px 16px 14px 50px;
    font-size: 15px;
  }
  .onama-check-circle {
    width: 24px; height: 24px;
    font-size: 12px;
    left: 14px;
    top: 14px;
  }

  .onama-testimonials-grid { grid-template-columns: 1fr; }
  .onama-badges-grid { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 480px) {
  .onama-container { padding: 0 16px; }
  .onama-section { padding: 44px 0; }
  .onama-hero h1 { font-size: 26px; }
  .onama-hero-photo:not(:has(.onama-hero-img)) { height: 220px; }
  .onama-bio-photo { height: 280px; }
  .onama-bio:nth-child(2) .onama-bio-photo,
  .onama-bio:nth-child(3) .onama-bio-photo,
  .onama-bio:nth-child(5) .onama-bio-photo { height: 480px !important; }
  .onama-bio-content h3 { font-size: 22px; }
  .onama-doctor-photo { height: 440px; }
  .onama-badges-grid { grid-template-columns: 1fr; }
  .onama-selection-list li {
    padding: 12px 14px 12px 46px;
    font-size: 14px;
  }
  .onama-check-circle {
    width: 22px; height: 22px;
    font-size: 11px;
    left: 12px;
    top: 12px;
  }
  .zelvia-btn { padding: 12px 28px; font-size: 15px; }
  .onama-cta-buttons { flex-direction: column; align-items: center; }
}
/* ===== LEGAL PAGES ===== */
.zelvia-legal-page {
  max-width: 800px;
  margin: 0 auto;
  padding: 20px 30px 60px;
  line-height: 1.75;
  color: var(--zelvia-text);
}
.zelvia-legal-page h1 {
  font-size: 28px;
  margin-bottom: 8px;
  color: var(--zelvia-dark-green);
}
.zelvia-legal-page h2 {
  font-size: 21px;
  margin-top: 35px;
  margin-bottom: 12px;
  color: var(--zelvia-dark-green);
}
.zelvia-legal-page h3 {
  font-size: 18px;
  margin-top: 25px;
  margin-bottom: 10px;
}
.zelvia-legal-page p { margin-bottom: 14px; }
.zelvia-legal-page ul { margin: 10px 0 14px 20px; }
.zelvia-legal-page li { margin-bottom: 6px; }
.zelvia-legal-page table {
  width: 100%;
  border-collapse: collapse;
  margin: 20px 0;
  font-size: 15px;
}
.zelvia-legal-page th,
.zelvia-legal-page td {
  border: 1px solid var(--zelvia-border);
  padding: 10px 14px;
  text-align: left;
}
.zelvia-legal-page th {
  background: var(--zelvia-bg-warm);
  font-weight: 600;
}
.zelvia-legal-page a.button {
  display: inline-block;
  background: var(--zelvia-terracotta);
  color: #fff;
  padding: 12px 24px;
  border-radius: 8px;
  text-decoration: none;
  font-weight: 600;
  margin: 10px 0;
}
.zelvia-legal-page a.button:hover { opacity: 0.9; }
@media (max-width: 768px) {
  .zelvia-legal-page { padding: 15px 18px 40px; }
  .zelvia-legal-page h1 { font-size: 24px; }
  .zelvia-legal-page table { font-size: 13px; }
  .zelvia-legal-page th,
  .zelvia-legal-page td { padding: 8px 10px; }
}

/* ============================================================
   CONTACT PAGE — /kontakt/
   ============================================================ */

/* Hero */
.zelvia-contact-hero {
  background: linear-gradient(135deg, var(--zelvia-bg-warm) 0%, var(--zelvia-bg-alt) 100%);
  padding: 60px 0 50px;
  width: 100vw;
  margin-left: -50vw;
  left: 50%;
  position: relative;
}
.zelvia-contact-hero__inner {
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 24px;
}
.zelvia-contact-hero h1 {
  font-size: 40px;
  font-weight: 400;
  color: var(--zelvia-dark-green);
  margin-bottom: 16px;
  line-height: 1.25;
}
.zelvia-contact-intro {
  font-size: 17px;
  color: var(--zelvia-text);
  max-width: 720px;
  line-height: 1.8;
}

/* Main: Form + Info side-by-side */
.zelvia-contact-main {
  display: flex;
  gap: 32px;
  align-items: flex-start;
  max-width: 1200px;
  margin: 0 auto;
  padding: 60px 24px;
}
.zelvia-contact-main__left {
  flex: 3;
  min-width: 0;
}
.zelvia-contact-main__right {
  flex: 2;
  min-width: 0;
}

/* Contact Form Card */
.zelvia-contact-form-card {
  background: #fff;
  border: 1px solid var(--zelvia-border);
  border-radius: 14px;
  padding: 32px;
}
.zelvia-contact-form-card h2 {
  font-size: 22px;
  font-weight: 600;
  color: var(--zelvia-dark-green);
  margin-bottom: 24px;
}

/* Form layout */
.zelvia-form-row {
  display: flex;
  gap: 16px;
  margin-bottom: 16px;
}
.zelvia-form-group {
  flex: 1;
  margin-bottom: 16px;
}
.zelvia-form-row .zelvia-form-group {
  margin-bottom: 0;
}
.zelvia-form-group label {
  display: block;
  font-size: 14px;
  font-weight: 600;
  color: var(--zelvia-dark-green);
  margin-bottom: 6px;
}
.zelvia-form-group label .optional {
  font-weight: 400;
  color: #999;
  font-size: 13px;
}

/* CF7 input overrides */
.zelvia-contact-form-card .wpcf7 input[type="text"],
.zelvia-contact-form-card .wpcf7 input[type="email"],
.zelvia-contact-form-card .wpcf7 input[type="tel"],
.zelvia-contact-form-card .wpcf7 select,
.zelvia-contact-form-card .wpcf7 textarea {
  width: 100%;
  padding: 12px 16px !important;
  border: 1px solid var(--zelvia-border);
  border-radius: 8px;
  font-size: 15px;
  font-family: inherit;
  color: var(--zelvia-text);
  background: #fff;
  transition: border-color 0.2s, box-shadow 0.2s;
  outline: none;
  box-sizing: border-box;
  line-height: 1.5;
  height: auto;
}
.zelvia-contact-form-card .wpcf7 input:focus,
.zelvia-contact-form-card .wpcf7 select:focus,
.zelvia-contact-form-card .wpcf7 textarea:focus {
  border-color: var(--zelvia-green);
  box-shadow: 0 0 0 3px rgba(98, 165, 49, 0.15);
}
.zelvia-contact-form-card .wpcf7 textarea {
  min-height: 140px;
  resize: vertical;
}
.zelvia-contact-form-card .wpcf7 select {
  appearance: none;
  -webkit-appearance: none;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath fill='%23555' d='M6 8L1 3h10z'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 14px center;
  padding-right: 36px;
  cursor: pointer;
}
/* Remove Flatsome default select wrapper styling */
.zelvia-contact-form-card .wpcf7-form-control-wrap select {
  border: 1px solid var(--zelvia-border) !important;
  box-shadow: none !important;
  outline: none !important;
  height: auto !important;
  line-height: 1.5 !important;
}
.zelvia-contact-form-card .wpcf7 p { margin-bottom: 0; }
.zelvia-contact-form-card .wpcf7-form-control-wrap {
  display: block;
}

/* Checkbox */
.zelvia-checkbox-group {
  margin: 20px 0 24px;
}
.zelvia-checkbox-group label {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  cursor: pointer;
}
.zelvia-checkbox-group input[type="checkbox"] {
  width: 18px;
  height: 18px;
  margin-top: 2px;
  accent-color: var(--zelvia-green);
  cursor: pointer;
  flex-shrink: 0;
}
.zelvia-checkbox-group .wpcf7-list-item-label {
  font-size: 13px;
  color: #777;
  line-height: 1.5;
}
.zelvia-checkbox-group a {
  color: var(--zelvia-green);
  text-decoration: underline;
}

/* Submit button */
.zelvia-contact-form-card .wpcf7-submit {
  background: var(--zelvia-terracotta);
  color: white;
  border: none;
  padding: 14px 40px;
  font-size: 16px;
  font-weight: 600;
  border-radius: 8px;
  cursor: pointer;
  transition: background 0.3s, transform 0.2s;
  font-family: inherit;
  text-transform: uppercase;
  letter-spacing: 0.5px;
}
.zelvia-contact-form-card .wpcf7-submit:hover {
  background: #a8562e;
  transform: translateY(-2px);
}

/* CF7 response message */
.zelvia-contact-form-card .wpcf7-response-output {
  border-radius: 8px;
  padding: 12px 16px;
  margin-top: 16px;
  font-size: 14px;
}

/* Contact Info Cards */
.zelvia-contact-info-cards {
  display: flex;
  flex-direction: column;
  gap: 16px;
}
.zelvia-contact-info-card {
  background: #fff;
  border: 1px solid var(--zelvia-border);
  border-radius: 14px;
  padding: 24px;
  transition: transform 0.3s, box-shadow 0.3s;
}
.zelvia-contact-info-card:hover {
  transform: translateY(-3px);
  box-shadow: 0 8px 24px rgba(0,0,0,0.06);
}
.zelvia-contact-info-card__header {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 12px;
}
.zelvia-contact-info-card__icon {
  width: 44px;
  height: 44px;
  background: var(--zelvia-bg-warm);
  border-radius: 10px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 20px;
  flex-shrink: 0;
}
.zelvia-contact-info-card__header h3 {
  font-size: 18px;
  font-weight: 600;
  color: var(--zelvia-dark-green);
}
.zelvia-contact-info-card .value {
  font-size: 17px;
  font-weight: 600;
  color: var(--zelvia-dark-green);
  margin-bottom: 6px;
}
.zelvia-contact-info-card .value a {
  color: var(--zelvia-dark-green);
  text-decoration: none;
}
.zelvia-contact-info-card .value a:hover {
  text-decoration: underline;
}
.zelvia-contact-info-card .detail {
  font-size: 14px;
  color: var(--zelvia-text);
  line-height: 1.6;
}
.zelvia-contact-info-card .note {
  font-size: 13px;
  font-style: italic;
  color: #999;
  margin-top: 10px;
}

/* Hours list */
.zelvia-contact-hours {
  list-style: none;
  margin-top: 8px;
  padding: 0;
}
.zelvia-contact-hours li {
  font-size: 14px;
  color: var(--zelvia-text);
  padding: 3px 0;
  display: flex;
  justify-content: space-between;
}
.zelvia-contact-hours li strong {
  color: var(--zelvia-dark-green);
}

/* Business Data Section */
.zelvia-contact-business {
  background: var(--zelvia-bg-warm);
  padding: 60px 0;
  width: 100vw;
  margin-left: -50vw;
  left: 50%;
  position: relative;
}
.zelvia-contact-business__inner {
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 24px;
}
.zelvia-contact-business h2 {
  font-size: 24px;
  font-weight: 600;
  color: var(--zelvia-dark-green);
  margin-bottom: 24px;
}
.zelvia-contact-business__subtitle {
  font-size: 15px;
  color: var(--zelvia-text);
  margin-bottom: 20px;
}
.zelvia-business-table {
  width: 100%;
  background: #fff;
  border-radius: 14px;
  overflow: hidden;
  border: 1px solid var(--zelvia-border);
  border-collapse: separate;
  border-spacing: 0;
}
.zelvia-business-table tr:not(:last-child) {
  border-bottom: 1px solid var(--zelvia-border);
}
.zelvia-business-table td {
  padding: 14px 20px;
  font-size: 15px;
}
.zelvia-business-table td:first-child {
  font-weight: 600;
  color: var(--zelvia-dark-green);
  width: 35%;
  background: rgba(245, 240, 232, 0.4);
}
.zelvia-business-table td:last-child {
  color: var(--zelvia-text);
}

/* Help / FAQ Section */
.zelvia-contact-help {
  max-width: 1200px;
  margin: 0 auto;
  padding: 60px 24px;
}
.zelvia-contact-help h2 {
  font-size: 24px;
  font-weight: 600;
  color: var(--zelvia-dark-green);
  margin-bottom: 24px;
}
.zelvia-help-cards {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 20px;
}
.zelvia-help-card {
  background: #fff;
  border: 1px solid var(--zelvia-border);
  border-radius: 14px;
  padding: 24px;
  transition: transform 0.3s, box-shadow 0.3s;
}
.zelvia-help-card:hover {
  transform: translateY(-3px);
  box-shadow: 0 8px 24px rgba(0,0,0,0.06);
}
.zelvia-help-card h3 {
  font-size: 16px;
  font-weight: 600;
  color: var(--zelvia-dark-green);
  margin-bottom: 10px;
}
.zelvia-help-card p {
  font-size: 14px;
  color: var(--zelvia-text);
  line-height: 1.7;
}
.zelvia-help-card a {
  color: var(--zelvia-green);
  text-decoration: underline;
}

/* Footer Note */
.zelvia-contact-footer-note {
  text-align: center;
  padding: 20px 0 40px;
  font-size: 13px;
  color: #aaa;
}

/* Responsive */
@media (max-width: 768px) {
  .zelvia-contact-hero { padding: 40px 0 30px; }
  .zelvia-contact-hero h1 { font-size: 28px; }
  .zelvia-contact-intro { font-size: 15px; }
  .zelvia-contact-main {
    flex-direction: column;
    gap: 24px;
    padding: 40px 16px;
  }
  .zelvia-contact-form-card { padding: 24px 20px; }
  .zelvia-form-row { flex-direction: column; gap: 0; }
  .zelvia-form-row .zelvia-form-group { margin-bottom: 16px; }
  .zelvia-contact-business { padding: 40px 0; }
  .zelvia-business-table td:first-child { width: 40%; }
  .zelvia-contact-help { padding: 40px 16px; }
  .zelvia-help-cards { grid-template-columns: 1fr; gap: 14px; }
  .zelvia-contact-hero__inner,
  .zelvia-contact-business__inner { padding: 0 16px; }
}

/* ==========================================================================
   Complianz Cookie Banner — Zelvia Brand Styling
   ========================================================================== */

/* Banner container — cream background, warm border, soft shadow */
.cmplz-cookiebanner {
  background: var(--zelvia-bg-warm) !important;
  border: 1px solid var(--zelvia-border) !important;
  border-radius: 12px !important;
  box-shadow: 0 10px 40px rgba(41, 68, 21, 0.15) !important;
  font-family: inherit !important;
  color: var(--zelvia-text) !important;
  padding: 24px !important;
  max-width: 440px !important;
}

/* Accent bar on top */
.cmplz-cookiebanner::before {
  content: "";
  display: block;
  height: 4px;
  background: linear-gradient(90deg, var(--zelvia-green) 0%, var(--zelvia-terracotta) 100%);
  border-radius: 12px 12px 0 0;
  margin: -24px -24px 20px -24px;
}

/* Header — dark green, bold */
.cmplz-cookiebanner .cmplz-header .cmplz-title,
.cmplz-cookiebanner .cmplz-title {
  color: var(--zelvia-dark-green) !important;
  font-weight: 700 !important;
  font-size: 18px !important;
  margin-bottom: 10px !important;
  letter-spacing: -0.2px !important;
}

/* Close (X) icon */
.cmplz-cookiebanner .cmplz-close {
  color: var(--zelvia-text) !important;
  opacity: 0.6 !important;
  transition: opacity 0.2s !important;
}
.cmplz-cookiebanner .cmplz-close:hover {
  opacity: 1 !important;
  color: var(--zelvia-dark-green) !important;
}

/* Body message */
.cmplz-cookiebanner .cmplz-message {
  color: var(--zelvia-text) !important;
  font-size: 14px !important;
  line-height: 1.6 !important;
  margin-bottom: 16px !important;
}

/* Links inside the banner */
.cmplz-cookiebanner a,
.cmplz-cookiebanner .cmplz-link {
  color: var(--zelvia-green) !important;
  text-decoration: underline !important;
  text-underline-offset: 2px !important;
}
.cmplz-cookiebanner a:hover {
  color: var(--zelvia-dark-green) !important;
}

/* Button base — shared styles */
.cmplz-cookiebanner .cmplz-btn {
  border-radius: 8px !important;
  font-weight: 600 !important;
  font-size: 14px !important;
  padding: 11px 18px !important;
  transition: all 0.25s ease !important;
  letter-spacing: 0.2px !important;
  border: 2px solid transparent !important;
  cursor: pointer !important;
}

/* ACCEPT button — terracotta/orange (primary CTA) */
.cmplz-cookiebanner .cmplz-btn.cmplz-accept,
.cmplz-cookiebanner .cmplz-btn.cmplz-accept-all,
.cmplz-cookiebanner .cmplz-btn.cmplz-accept-marketing {
  background: var(--zelvia-terracotta) !important;
  border-color: var(--zelvia-terracotta) !important;
  color: #fff !important;
  box-shadow: 0 2px 6px rgba(196, 106, 58, 0.25) !important;
}
.cmplz-cookiebanner .cmplz-btn.cmplz-accept:hover,
.cmplz-cookiebanner .cmplz-btn.cmplz-accept-all:hover,
.cmplz-cookiebanner .cmplz-btn.cmplz-accept-marketing:hover {
  background: #a8562e !important;
  border-color: #a8562e !important;
  transform: translateY(-1px) !important;
  box-shadow: 0 4px 10px rgba(196, 106, 58, 0.35) !important;
}

/* DENY button — white with dark green outline */
.cmplz-cookiebanner .cmplz-btn.cmplz-deny {
  background: #fff !important;
  border-color: var(--zelvia-dark-green) !important;
  color: var(--zelvia-dark-green) !important;
}
.cmplz-cookiebanner .cmplz-btn.cmplz-deny:hover {
  background: var(--zelvia-dark-green) !important;
  color: #fff !important;
  transform: translateY(-1px) !important;
}

/* PREFERENCES / SAVE buttons — green outline (tertiary) */
.cmplz-cookiebanner .cmplz-btn.cmplz-view-preferences,
.cmplz-cookiebanner .cmplz-btn.cmplz-save-preferences {
  background: transparent !important;
  border-color: var(--zelvia-green) !important;
  color: var(--zelvia-green) !important;
}
.cmplz-cookiebanner .cmplz-btn.cmplz-view-preferences:hover,
.cmplz-cookiebanner .cmplz-btn.cmplz-save-preferences:hover {
  background: var(--zelvia-green) !important;
  color: #fff !important;
}

/* Button row — spacing */
.cmplz-cookiebanner .cmplz-buttons {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 8px !important;
  margin-top: 8px !important;
}

/* Category section — preferences panel */
.cmplz-cookiebanner .cmplz-categories {
  background: #fff !important;
  border-radius: 8px !important;
  border: 1px solid var(--zelvia-border) !important;
  padding: 12px !important;
  margin-top: 12px !important;
}

.cmplz-cookiebanner .cmplz-category {
  border-bottom: 1px solid var(--zelvia-border) !important;
  padding: 10px 0 !important;
}
.cmplz-cookiebanner .cmplz-category:last-child {
  border-bottom: none !important;
}

/* Category title — dark green */
.cmplz-cookiebanner .cmplz-category .cmplz-category-title,
.cmplz-cookiebanner .cmplz-category-title {
  color: var(--zelvia-dark-green) !important;
  font-weight: 600 !important;
  font-size: 14px !important;
}

/* Category description */
.cmplz-cookiebanner .cmplz-description,
.cmplz-cookiebanner .cmplz-category .cmplz-description {
  color: var(--zelvia-text) !important;
  font-size: 13px !important;
  line-height: 1.5 !important;
  margin-top: 6px !important;
}

/* Toggle switch — green when active */
.cmplz-cookiebanner input[type="checkbox"].cmplz-consent-checkbox:checked + .cmplz-label .cmplz-slider,
.cmplz-cookiebanner .cmplz-banner-checkbox input[type="checkbox"]:checked + label::before,
.cmplz-cookiebanner .cmplz-category input[type="checkbox"]:checked + label {
  background: var(--zelvia-green) !important;
  border-color: var(--zelvia-green) !important;
}

.cmplz-cookiebanner input[type="checkbox"] {
  accent-color: var(--zelvia-green) !important;
}

/* "Always active" label for functional cookies */
.cmplz-cookiebanner .cmplz-always-active {
  color: var(--zelvia-olive) !important;
  font-weight: 600 !important;
  font-size: 12px !important;
  font-style: italic !important;
}

/* Divider lines */
.cmplz-cookiebanner .cmplz-divider,
.cmplz-cookiebanner .cmplz-divider-header {
  border-color: var(--zelvia-border) !important;
}

/* Footer links (Privacy / Cookie policy) */
.cmplz-cookiebanner .cmplz-footer,
.cmplz-cookiebanner .cmplz-links {
  border-top: 1px solid var(--zelvia-border) !important;
  padding-top: 12px !important;
  margin-top: 12px !important;
  font-size: 12px !important;
}

/* Floating "Upravljanje pristankom" (Manage consent) button */
.cmplz-manage-consent,
.cmplz-manage-consent-container .cmplz-manage-consent {
  background: var(--zelvia-dark-green) !important;
  color: #fff !important;
  border: none !important;
  border-radius: 8px !important;
  padding: 10px 14px !important;
  font-weight: 600 !important;
  font-size: 13px !important;
  box-shadow: 0 4px 14px rgba(41, 68, 21, 0.25) !important;
  transition: all 0.25s ease !important;
}
.cmplz-manage-consent:hover {
  background: var(--zelvia-forest) !important;
  transform: translateY(-1px) !important;
  box-shadow: 0 6px 18px rgba(41, 68, 21, 0.35) !important;
}

/* Mobile responsive */
@media (max-width: 600px) {
  .cmplz-cookiebanner {
    max-width: calc(100vw - 20px) !important;
    padding: 18px !important;
  }
  .cmplz-cookiebanner::before {
    margin: -18px -18px 16px -18px;
  }
  /* Header: single-line centered title, close X absolutely positioned */
  .cmplz-cookiebanner .cmplz-header {
    position: relative !important;
    display: block !important;
    padding: 0 28px !important;
    text-align: center !important;
    margin-bottom: 12px !important;
  }
  .cmplz-cookiebanner .cmplz-header .cmplz-title,
  .cmplz-cookiebanner .cmplz-title {
    font-size: 16px !important;
    text-align: center !important;
    white-space: nowrap !important;
    margin: 0 !important;
    padding: 0 !important;
    width: 100% !important;
  }
  .cmplz-cookiebanner .cmplz-close {
    position: absolute !important;
    right: 0 !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
    margin: 0 !important;
  }
  .cmplz-cookiebanner .cmplz-buttons {
    flex-direction: column !important;
  }
  .cmplz-cookiebanner .cmplz-btn {
    width: 100% !important;
    text-align: center !important;
  }
}

/* ==========================================================================
   Product page — "Back to previous" link
   ========================================================================== */
.zelvia-back-wrap {
  padding: 14px 15px 0;
}
/* Desktop fallback: align with hero image's left edge (hero has padding: 0 40px).
   JS fine-tunes padding-left dynamically via getBoundingClientRect. */
@media (min-width: 850px) {
  .zelvia-back-wrap {
    padding-left: 40px;
    padding-right: 40px;
  }
}
.zelvia-back-link {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 4px 0;
  font-size: 14px;
  font-weight: 500;
  color: var(--zelvia-dark-green, #1c5900);
  text-decoration: none;
  transition: color 0.15s ease;
}
.zelvia-back-link:hover,
.zelvia-back-link:focus {
  color: var(--zelvia-terracotta, #c46a3a);
  text-decoration: underline;
}
.zelvia-back-arrow {
  font-size: 16px;
  line-height: 1;
  transition: transform 0.15s ease;
}
.zelvia-back-link:hover .zelvia-back-arrow {
  transform: translateX(-2px);
}

/* ==========================================================================
   Trust Box - „Zašto nam verovati?" (C1 variant, reusable on blog posts)
   Rendered by [zelvia_trust_box] shortcode in mu-plugins/zelvia-shortcodes.php
   ========================================================================== */

.zelvia-trust-box {
  display: flex;
  background: var(--zelvia-bg-warm);
  border-radius: 10px;
  overflow: hidden;
  margin: 28px 0;
  box-shadow: 0 2px 6px rgba(41, 68, 21, 0.05);
  font-family: system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
}

.zelvia-trust-box .ztb-stripe {
  flex: 0 0 5px;
  background: linear-gradient(180deg, var(--zelvia-terracotta) 0%, var(--zelvia-terracotta-deep) 100%);
}

.zelvia-trust-box .ztb-body {
  padding: 20px 20px 18px;
  flex: 1;
  min-width: 0;
}

.zelvia-trust-box .ztb-eyebrow {
  font-size: 9.5px;
  font-weight: 700;
  letter-spacing: 1.8px;
  color: var(--zelvia-terracotta-deep);
  text-transform: uppercase;
  margin-bottom: 6px;
}

.zelvia-trust-box .ztb-title {
  margin: 0 0 12px;
  color: var(--zelvia-dark-green);
  font-family: Georgia, "Times New Roman", serif;
  font-size: 20px;
  font-weight: 700;
  letter-spacing: -0.3px;
  line-height: 1.25;
}

.zelvia-trust-box .ztb-authors {
  display: flex;
  flex-direction: column;
  gap: 12px;
  margin-bottom: 14px;
  padding-bottom: 12px;
  border-bottom: 1px solid var(--zelvia-border);
}

.zelvia-trust-box .ztb-author {
  display: flex;
  align-items: flex-start;
  gap: 10px;
}

.zelvia-trust-box .ztb-avatar {
  width: 40px;
  height: 40px;
  border-radius: 50%;
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: Georgia, serif;
  font-weight: 700;
  font-size: 14px;
  color: #fff;
}

.zelvia-trust-box .ztb-avatar.ztb-vv { background: var(--zelvia-dark-green); }
.zelvia-trust-box .ztb-avatar.ztb-bo { background: var(--zelvia-terracotta); }

.zelvia-trust-box .ztb-avatar img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  border-radius: 50%;
}

.zelvia-trust-box .ztb-author-meta { line-height: 1.35; min-width: 0; }

.zelvia-trust-box .ztb-role {
  font-size: 9.5px;
  font-weight: 700;
  letter-spacing: 1.1px;
  text-transform: uppercase;
  color: var(--zelvia-terracotta-deep);
  margin-bottom: 2px;
}

.zelvia-trust-box .ztb-name {
  font-size: 14px;
  font-weight: 700;
  color: var(--zelvia-forest);
}

.zelvia-trust-box .ztb-sub {
  font-size: 11.5px;
  color: #888;
  line-height: 1.4;
}

.zelvia-trust-box .ztb-paragraph {
  color: var(--zelvia-text);
  font-family: Georgia, "Times New Roman", serif;
  font-size: 14.5px;
  line-height: 1.6;
  margin: 0 0 12px;
}

.zelvia-trust-box .ztb-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-top: 10px;
  padding-top: 10px;
  border-top: 1px solid var(--zelvia-border);
}

.zelvia-trust-box .ztb-chip {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 4px 10px;
  background: var(--zelvia-white);
  border: 1px solid var(--zelvia-border);
  border-radius: 4px;
  font-size: 11px;
  font-weight: 600;
  color: var(--zelvia-forest);
}

.zelvia-trust-box .ztb-chip::before {
  content: "✓";
  color: var(--zelvia-terracotta);
  font-weight: 700;
}

@media (min-width: 560px) {
  .zelvia-trust-box .ztb-body { padding: 24px 26px 22px; }
  .zelvia-trust-box .ztb-title { font-size: 24px; }
  .zelvia-trust-box .ztb-authors { flex-direction: row; gap: 20px; }
  .zelvia-trust-box .ztb-author { flex: 1; }
  .zelvia-trust-box .ztb-avatar { width: 48px; height: 48px; font-size: 16px; }
  .zelvia-trust-box .ztb-role { font-size: 10.5px; letter-spacing: 1.4px; }
  .zelvia-trust-box .ztb-name { font-size: 15px; }
  .zelvia-trust-box .ztb-sub { font-size: 12.5px; }
  .zelvia-trust-box .ztb-paragraph { font-size: 15.5px; line-height: 1.7; }
  .zelvia-trust-box .ztb-chips { gap: 8px; padding-top: 14px; margin-top: 14px; }
  .zelvia-trust-box .ztb-chip { padding: 5px 13px; font-size: 12.5px; letter-spacing: 0.3px; }
}

/* ==========================================================================
   Product Box — [zelvia_product_box]
   Rendered by zelvia-shortcodes.php; V3 "editorial outlined" design.
   Desktop ≥821px: horizontal, 165×165 image left. Tablet 561–820px: 140×140.
   Mobile ≤560px: stacked, image full-bleed top, CTA stacked below price.
   ========================================================================== */

.zelvia-product-box {
  display: flex;
  align-items: center;
  gap: 22px;
  padding: 16px;
  background: var(--zelvia-bg-warm);
  border: 1.5px solid var(--zelvia-border);
  border-radius: 8px;
  box-shadow: none;
  overflow: hidden;
  margin: 28px 0;
  font-family: system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
}

.zelvia-product-box .zpb-img {
  width: 165px;
  height: 165px;
  border-radius: 6px;
  flex-shrink: 0;
  object-fit: cover;
  display: block;
}

.zelvia-product-box .zpb-img-placeholder {
  width: 165px;
  height: 165px;
  border-radius: 6px;
  flex-shrink: 0;
  background: #f4f0e6;
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  padding: 12px;
  font-family: Georgia, "Times New Roman", serif;
  color: var(--zelvia-dark-green);
  font-size: 14px;
  font-weight: 700;
  line-height: 1.25;
}

.zelvia-product-box .zpb-content {
  flex: 1;
  min-width: 0;
}

.zelvia-product-box .zpb-eyebrow {
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 1.8px;
  color: var(--zelvia-terracotta-deep);
  text-transform: uppercase;
  margin-bottom: 6px;
}

.zelvia-product-box .zpb-family {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  background: rgba(28, 89, 0, 0.08);
  color: var(--zelvia-dark-green);
  font-size: 11px;
  font-weight: 600;
  padding: 4px 10px;
  border-radius: 20px;
  margin-bottom: 8px;
}

.zelvia-product-box .zpb-name {
  display: block;
  margin: 0 0 10px;
  font-family: Georgia, "Times New Roman", serif;
  color: var(--zelvia-dark-green);
  font-size: 21px;
  font-weight: 700;
  line-height: 1.25;
}

.zelvia-product-box .zpb-pitch {
  margin: 0 0 14px;
  font-family: Georgia, "Times New Roman", serif;
  color: #3a3a3a;
  font-size: 14.5px;
  line-height: 1.6;
}

.zelvia-product-box .zpb-bullets {
  list-style: none;
  padding: 0;
  margin: 0 0 14px;
  display: flex;
  flex-direction: column;
  gap: 5px;
}

.zelvia-product-box .zpb-bullets li {
  font-size: 12.5px;
  color: var(--zelvia-forest);
  padding-left: 20px;
  position: relative;
  line-height: 1.45;
}

.zelvia-product-box .zpb-bullets li::before {
  content: "✓";
  position: absolute;
  left: 0;
  color: var(--zelvia-green);
  font-weight: 700;
}

.zelvia-product-box .zpb-cta-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding-top: 12px;
  border-top: 1px solid var(--zelvia-border);
}

.zelvia-product-box .zpb-price {
  font-family: Georgia, "Times New Roman", serif;
  color: var(--zelvia-dark-green);
  font-size: 20px;
  font-weight: 700;
  line-height: 1.2;
}

.zelvia-product-box .zpb-price-label {
  display: block;
  font-family: system-ui, -apple-system, sans-serif;
  font-size: 10.5px;
  font-weight: 400;
  letter-spacing: 0.8px;
  text-transform: uppercase;
  color: #888;
  margin-bottom: 2px;
}

.zelvia-product-box .zpb-cta {
  background: var(--zelvia-terracotta);
  color: #fff;
  font-weight: 700;
  font-size: 13px;
  letter-spacing: 0.8px;
  text-transform: uppercase;
  padding: 12px 22px;
  border-radius: 6px;
  text-decoration: none;
  box-shadow: 0 3px 8px rgba(196, 106, 58, 0.22);
  white-space: nowrap;
  transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.zelvia-product-box .zpb-cta:hover,
.zelvia-product-box .zpb-cta:focus {
  transform: translateY(-1px);
  box-shadow: 0 5px 12px rgba(196, 106, 58, 0.3);
  color: #fff;
}

@media (prefers-reduced-motion: reduce) {
  .zelvia-product-box .zpb-cta { transition: none; }
  .zelvia-product-box .zpb-cta:hover,
  .zelvia-product-box .zpb-cta:focus { transform: none; }
}

/* Tablet: 561–820px — slight tightening of horizontal layout */
@media (max-width: 820px) and (min-width: 561px) {
  .zelvia-product-box { padding: 14px; gap: 18px; }
  .zelvia-product-box .zpb-img,
  .zelvia-product-box .zpb-img-placeholder { width: 140px; height: 140px; }
  .zelvia-product-box .zpb-name { font-size: 20px; }
  .zelvia-product-box .zpb-pitch { font-size: 14px; }
}

/* Mobile: ≤560px — stack vertically, image full-bleed on top, CTA stacked below price */
@media (max-width: 560px) {
  .zelvia-product-box {
    flex-direction: column;
    align-items: stretch;
    padding: 0;
    gap: 0;
  }
  .zelvia-product-box .zpb-img,
  .zelvia-product-box .zpb-img-placeholder {
    width: 100%;
    height: auto;
    aspect-ratio: 1 / 1;
    border-radius: 0;
  }
  .zelvia-product-box .zpb-content {
    padding: 18px 20px 20px;
  }
  .zelvia-product-box .zpb-name {
    font-size: 19px;
    margin-bottom: 8px;
  }
  .zelvia-product-box .zpb-pitch {
    font-size: 14px;
    margin-bottom: 12px;
  }
  .zelvia-product-box .zpb-bullets li { font-size: 12px; }
  .zelvia-product-box .zpb-cta-row {
    padding-top: 12px;
    flex-direction: column;
    align-items: stretch;
    gap: 12px;
  }
  .zelvia-product-box .zpb-price { font-size: 19px; }
  .zelvia-product-box .zpb-cta {
    font-size: 12.5px;
    padding: 13px 18px;
    letter-spacing: 0.6px;
    text-align: center;
  }
}

/* ============================================================
   Blog post: Gutenberg wp:table cell padding
   Default Flatsome table styling leaves first column flush against
   the table border. Add consistent padding on all cells so leftmost
   column has the same indent as the rest.
   ============================================================ */
.single-post .entry-content .wp-block-table table th,
.single-post .entry-content .wp-block-table table td,
.entry-content .wp-block-table table th,
.entry-content .wp-block-table table td {
  padding: 12px 16px;
  vertical-align: top;
}
.single-post .entry-content .wp-block-table table th {
  font-weight: 700;
}
@media (max-width: 549px) {
  .single-post .entry-content .wp-block-table table th,
  .single-post .entry-content .wp-block-table table td {
    padding: 10px 12px;
  }
}