.elementor-84237 .elementor-element.elementor-element-44b5b1c .elementor-heading-title{font-size:16px;}.elementor-84237 .elementor-element.elementor-element-44b5b1c > .elementor-widget-container{padding:5px 5px 5px 5px;background-color:#E4E4E4;border-style:solid;border-width:0px 0px 0px 9px;border-color:#1D2022;}.elementor-84237 .elementor-element.elementor-element-e6f90c1 .elementor-heading-title{font-size:16px;}.elementor-84237 .elementor-element.elementor-element-e6f90c1 > .elementor-widget-container{padding:5px 5px 5px 5px;background-color:#E4E4E4;border-style:solid;border-width:0px 0px 0px 9px;border-color:#1D2022;}.elementor-84237 .elementor-element.elementor-element-283b1da .elementor-heading-title{font-size:16px;}.elementor-84237 .elementor-element.elementor-element-283b1da > .elementor-widget-container{padding:5px 5px 5px 5px;background-color:#E4E4E4;border-style:solid;border-width:0px 0px 0px 9px;border-color:#1D2022;}.elementor-84237 .elementor-element.elementor-element-69819b3 .elementor-heading-title{font-size:16px;}.elementor-84237 .elementor-element.elementor-element-69819b3 > .elementor-widget-container{padding:5px 5px 5px 5px;background-color:#E4E4E4;border-style:solid;border-width:0px 0px 0px 9px;border-color:#1D2022;}.elementor-84237 .elementor-element.elementor-element-cae6cd6 .elementor-icon-list-icon i{transition:color 0.3s;}.elementor-84237 .elementor-element.elementor-element-cae6cd6 .elementor-icon-list-icon svg{transition:fill 0.3s;}.elementor-84237 .elementor-element.elementor-element-cae6cd6{--e-icon-list-icon-size:14px;--icon-vertical-offset:0px;}.elementor-84237 .elementor-element.elementor-element-cae6cd6 .elementor-icon-list-text{transition:color 0.3s;}@media(min-width:768px){.elementor-84237 .elementor-element.elementor-element-fb3a172{width:70%;}.elementor-84237 .elementor-element.elementor-element-49b88a6{width:29.671%;}}@media(max-width:1024px) and (min-width:768px){.elementor-84237 .elementor-element.elementor-element-fb3a172{width:60%;}.elementor-84237 .elementor-element.elementor-element-49b88a6{width:40%;}}@media(max-width:1024px){.elementor-84237 .elementor-element.elementor-element-44b5b1c .elementor-heading-title{font-size:16px;}.elementor-84237 .elementor-element.elementor-element-e6f90c1 .elementor-heading-title{font-size:16px;}.elementor-84237 .elementor-element.elementor-element-283b1da .elementor-heading-title{font-size:16px;}.elementor-84237 .elementor-element.elementor-element-69819b3 .elementor-heading-title{font-size:16px;}}@media(max-width:767px){.elementor-84237 .elementor-element.elementor-element-44b5b1c .elementor-heading-title{font-size:16px;}.elementor-84237 .elementor-element.elementor-element-e6f90c1 .elementor-heading-title{font-size:16px;}.elementor-84237 .elementor-element.elementor-element-283b1da .elementor-heading-title{font-size:16px;}.elementor-84237 .elementor-element.elementor-element-69819b3 .elementor-heading-title{font-size:16px;}}/* Start custom CSS for text-editor, class: .elementor-element-634c853 *//* ============================================================
   VENARI JAGDTECHNIK – Produktseiten Design-System
   Einzufügen in: Elementor → Site Settings → Custom CSS
   Alle Klassen tragen den Präfix "vt-" (Venari Jagdtechnik)
   Version 1.0
   ============================================================ */


/* ----------------------------------------------------------
   WRAPPER
   Begrenzt die maximale Breite des gesamten Inhaltsblocks.
   ---------------------------------------------------------- */

.vt-wrap {
  max-width: 800px;
}


/* ----------------------------------------------------------
   TRENNLINIE
   Horizontale Linie zur Gliederung von Abschnitten.
   Verwendung: <hr class="vt-divider">
   ---------------------------------------------------------- */

.vt-divider {
  border: none;
  border-top: 1px solid #e8e8e8;
  margin: 2em 0;
}


/* ----------------------------------------------------------
   SPEC-KACHELN
   Grid aus gleichmäßigen Kacheln mit Label oben und Wert unten.
   Verwendung:
     <div class="vt-specs">
       <div class="vt-spec">
         <div class="vt-spec-label">Sensor</div>
         <div class="vt-spec-value">640×512</div>
       </div>
     </div>
   ---------------------------------------------------------- */

.vt-specs {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(130px, 1fr));
  gap: 10px;
  margin: 1.5em 0 2em;
}

.vt-spec {
  background: #f5f5f3;
  border-radius: 6px;
  padding: 14px 16px;
}

.vt-spec-label {
  font-size: 13px;
  text-transform: uppercase;
  letter-spacing: .06em;
  color: #888;
  margin-bottom: 4px;
}

.vt-spec-value {
  font-size: 20px;
  font-weight: 600;
  color: #1a1a1a;
}


/* ----------------------------------------------------------
   VERGLEICHSKACHELN (z.B. "Für wen geeignet?")
   Zwei- oder mehrspaltiges Grid aus Karten mit Badge.
   Verwendung:
     <div class="vt-ir-grid">
       <div class="vt-ir-card">
         <div class="vt-ir-nm">Feldrevier</div>
         <div class="vt-ir-sub">Beschreibung...</div>
         <span class="vt-badge vt-badge-safe">Sehr gut geeignet</span>
       </div>
     </div>
   ---------------------------------------------------------- */

.vt-ir-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
  margin: 1em 0 1.5em;
}

.vt-ir-card {
  border: 1px solid #e0e0e0;
  border-radius: 8px;
  padding: 16px 18px;
  background: #fff;
}

.vt-ir-nm {
  font-size: 22px;
  font-weight: 700;
  color: #1a1a1a;
}

.vt-ir-sub {
  font-size: 15px;
  color: #555;
  margin-top: 6px;
  line-height: 1.55;
}


/* ----------------------------------------------------------
   BADGES
   Farbige Kennzeichnung innerhalb von Vergleichskacheln.
   Klassen:
     vt-badge-safe    → grün  (geeignet)
     vt-badge-power   → orange (bedingt geeignet)
     vt-badge-neutral → grau  (neutral)
   ---------------------------------------------------------- */

.vt-badge {
  display: inline-block;
  margin-top: 10px;
  font-size: 13px;
  font-weight: 600;
  padding: 3px 10px;
  border-radius: 4px;
}

.vt-badge-safe {
  background: #e6f4ee;
  color: #2a7a4f;
}

.vt-badge-power {
  background: #fff3e0;
  color: #b36200;
}

.vt-badge-neutral {
  background: #f0f0f0;
  color: #444;
}


/* ----------------------------------------------------------
   INFOBOXEN
   Farblich unterschiedene Hinweis- und Warnboxen.

   vt-tip  → blau  (Hinweis, Tipp, technische Erklärung, NEU!)
   vt-warn → orange (Warnung, Einschränkung, Praxishinweis)

   Verwendung:
     <div class="vt-tip">
       <div class="vt-tip-label">Hinweis</div>
       <p>Text...</p>
     </div>

     <div class="vt-warn">
       <div class="vt-warn-label">Achtung</div>
       <p>Text...</p>
     </div>
   ---------------------------------------------------------- */

.vt-tip,
.vt-warn {
  border-radius: 0 6px 6px 0;
  padding: 14px 18px;
  margin: 1.2em 0;
}

.vt-tip {
  border-left: 3px solid #3a7fc1;
  background: #edf4fb;
}

.vt-warn {
  border-left: 3px solid #d4860a;
  background: #fdf4e3;
}

.vt-tip-label,
.vt-warn-label {
  font-size: 13px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .07em;
  margin-bottom: 5px;
}

.vt-tip-label {
  color: #3a7fc1;
}

.vt-warn-label {
  color: #b36200;
}

.vt-tip p,
.vt-warn p {
  font-size: 15px;
  color: #444;
  margin: 0;
  line-height: 1.6;
}


/* ----------------------------------------------------------
   BEWERTUNGSBALKEN
   Horizontale Balken mit Label, Fortschrittsbalken und Score.
   Verwendung:
     <div class="vt-ratings">
       <div class="vt-rrow">
         <span class="vt-rlabel">Bildqualität</span>
         <div class="vt-rtrack">
           <div class="vt-rbar" style="width:95%"></div>
         </div>
         <span class="vt-rscore">9,5</span>
       </div>
     </div>
   ---------------------------------------------------------- */

.vt-ratings {
  margin: 1em 0 2em;
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.vt-rrow {
  display: flex;
  align-items: center;
  gap: 12px;
}

.vt-rlabel {
  font-size: 15px;
  color: #555;
  min-width: 160px;
}

.vt-rtrack {
  flex: 1;
  height: 4px;
  background: #e0e0e0;
  border-radius: 99px;
}

.vt-rbar {
  height: 4px;
  border-radius: 99px;
  background: #1a1a1a;
}

.vt-rscore {
  font-size: 15px;
  font-weight: 600;
  color: #1a1a1a;
  min-width: 34px;
  text-align: right;
}


/* ----------------------------------------------------------
   PRO / CON KACHELN
   Zwei gleichbreite Karten nebeneinander für Stärken/Schwächen.
   Verwendung:
     <div class="vt-pro-con">
       <div class="vt-pbox">
         <div class="vt-pbox-head green">Stärken</div>
         <ul>
           <li>Punkt 1</li>
         </ul>
       </div>
       <div class="vt-pbox">
         <div class="vt-pbox-head red">Schwächen</div>
         <ul>
           <li>Punkt 1</li>
         </ul>
       </div>
     </div>
   ---------------------------------------------------------- */

.vt-pro-con {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
  margin: 1.2em 0 2em;
}

.vt-pbox {
  border: 1px solid #e0e0e0;
  border-radius: 8px;
  padding: 16px 18px;
  background: #fff;
}

.vt-pbox-head {
  font-size: 14px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .06em;
  margin-bottom: 12px;
}

.vt-pbox-head.green {
  color: #2a7a4f;
}

.vt-pbox-head.red {
  color: #b93333;
}

.vt-pbox ul {
  list-style: none;
  padding: 0;
  margin: 0;
}

.vt-pbox li {
  font-size: 15px;
  color: #444;
  padding: 6px 0;
  border-bottom: 1px solid #f0f0f0;
  line-height: 1.5;
}

.vt-pbox li:last-child {
  border-bottom: none;
}


/* ----------------------------------------------------------
   CTA-BLOCK
   Grauer Kasten mit Primär- und Sekundär-Button.
   Verwendung:
     <div class="vt-cta">
       <p>Beschreibungstext</p>
       <a href="/link" class="vt-cta-btn">Primär</a>
       <a href="/link" class="vt-cta-sec">Sekundär</a>
     </div>
   ---------------------------------------------------------- */

.vt-cta {
  background: #f5f5f3;
  border-radius: 8px;
  padding: 22px 24px;
  margin: 2em 0 0;
}

.vt-cta p {
  font-size: 15px;
  color: #555;
  margin: 0 0 14px;
}

.vt-cta-btn {
  display: inline-block;
  background: #1a1a1a;
  color: #fff !important;
  border-radius: 6px;
  padding: 10px 20px;
  font-size: 14px;
  font-weight: 600;
  text-decoration: none !important;
  margin-right: 8px;
  margin-bottom: 6px;
}

.vt-cta-sec {
  display: inline-block;
  border: 1px solid #ccc;
  border-radius: 6px;
  padding: 10px 20px;
  font-size: 14px;
  font-weight: 600;
  text-decoration: none !important;
  color: #1a1a1a !important;
  margin-bottom: 6px;
}


/* ----------------------------------------------------------
   RESPONSIVE – Mobile (max. 540px)
   ---------------------------------------------------------- */

@media (max-width: 540px) {

  .vt-pro-con {
    grid-template-columns: 1fr;
  }

  .vt-ir-grid {
    grid-template-columns: 1fr;
  }

  .vt-rlabel {
    min-width: 110px;
    font-size: 13px;
  }

}/* End custom CSS */