/**
Theme Name: Astra Child
Author: Brainstorm Force
Author URI: http://wpastra.com/about/
Description: Optimiertes Child Theme Stylesheet mit aktivem Custom Cursor, Formular-Styling und Farbanpassungen
Version: 1.0.3
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: astra-child
Template: astra
Last updated: 2025-07-11
*/

/* -------------------------------
   A ROBOTO SCHRIFTARTEN
-------------------------------- */
@font-face {
  font-family: 'Roboto';
  src: url('https://renateniebler.de/wp-content/uploads/Roboto-Regular.woff2') format('woff2');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Roboto';
  src: url('https://renateniebler.de/wp-content/uploads/Roboto-Light.woff2') format('woff2');
  font-weight: 300;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Roboto';
  src: url('https://renateniebler.de/wp-content/uploads/Roboto-SemiBold.woff2') format('woff2');
  font-weight: 600;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Roboto';
  src: url('https://renateniebler.de/wp-content/uploads/Roboto-Bold.woff2') format('woff2');
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Roboto';
  src: url('https://renateniebler.de/wp-content/uploads/Roboto-ExtraBold.woff2') format('woff2');
  font-weight: 800;
  font-style: normal;
  font-display: swap;
}

/* -------------------------------
   A2 IVY PRESTO – Custom Font
-------------------------------- */
@font-face {
  font-family: 'Ivy Presto';
  src: url('https://renateniebler.de/wp-content/uploads/fonnts.com-Ivy-Presto-Display-Thin.woff2') format('woff2');
  font-weight: 100;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'Ivy Presto';
  src: url('https://renateniebler.de/wp-content/uploads/fonnts.com-Ivy-Presto-Headline-Light.woff2') format('woff2');
  font-weight: 300;
  font-style: normal;
  font-display: swap;
}

/* -------------------------------
   GLOBAL BODY SETTINGS
-------------------------------- */
body {
  font-family: 'Roboto', sans-serif;
  cursor: default !important;
}

/* Editorial Link – Linie nur bis Pfeil + stärkerer Kontrast */
.ivy-link {
  font-family: 'Ivy Presto', serif !important;
  color: #222222;

  /* Größe wie Referenz (ggf. 30–36 testen) */
  font-size: 34px;
  line-height: 1.05;
  letter-spacing: -0.02em;

  /* NUR so breit wie Inhalt */
  display: inline-flex;
  align-items: baseline;
  gap: 10px;
  width: max-content;
  position: relative;

  /* wichtig gegen Elementor/Theme: nicht auf 100% strecken */
  max-width: none;
}

/* "Click" etwas präsenter */
.ivy-link .roman {
  font-weight: 400;          /* etwas stärker */
  font-style: normal;
}

/* italic Teil eleganter & sichtbar anders */
.ivy-link em {
  font-weight: 300;
  font-style: italic;
  opacity: 0.75;            /* stärkerer Unterschied */
}

/* Linie: exakt Breite des Inhalts */
.ivy-link::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: -8px;
  width: 100%;
  height: 1px;
  background: #222222;

  /* Animation ohne Layout-Shift */
  transform: scaleX(0);
  transform-origin: left;
  transition: transform 0.3s ease;
}

.ivy-link:hover::after {
  transform: scaleX(1);
}

/* Nur der Pfeil bewegt sich */
.ivy-link .arrow {
  display: inline-block;
  transition: transform 0.25s ease;
  will-change: transform;
}

.ivy-link:hover .arrow {
  transform: translateX(8px);
}

/* -------------------------------
   B WPFORMS STYLING
-------------------------------- */
.wpforms-form input,
.wpforms-form textarea,
.wpforms-form select {
  background-color: #eaf2ff !important;
  border: 1px solid #000 !important;
  box-shadow: none !important;
  border-radius: 8px !important;
  padding: 12px !important;
  font-size: 16px !important;
  color: #020101 !important;
  width: 100% !important;
  box-sizing: border-box;
}

.wpforms-submit {
  background-color: #3b82f6 !important;
  color: #fff !important;
  border: none !important;
  padding: 12px 30px !important;
  font-size: 16px !important;
  border-radius: 25px !important;
  transition: background 0.3s ease;
}

.wpforms-submit:hover {
  background-color: #2563eb !important;
}

.wpforms-error {
  color: #fff !important;
  background-color: #e3342f !important;
  padding: 8px 12px !important;
  border-radius: 4px !important;
}

.wpforms-confirmation-container-full {
  background-color: #eaf2ff !important;
  color: #000 !important;
  padding: 1rem 1.5rem;
  border-radius: 10px;
  border: 1px solid #000 !important;
}

/* -------------------------------
   C CUSTOM CURSOR – Punkt im Kreis
-------------------------------- */
a,
button,
input,
textarea,
select {
  cursor: pointer !important;
}

.cursor-dot {
  width: 8px;
  height: 8px;
  background: black;
  border-radius: 50%;
  position: fixed;
  top: 0;
  left: 0;
  pointer-events: none;
  z-index: 10001;
  transform: translate(-50%, -50%);
}

.cursor-outline {
  width: 32px;
  height: 32px;
  border: 2px solid black;
  border-radius: 50%;
  position: fixed;
  top: 0;
  left: 0;
  pointer-events: none;
  z-index: 10000;
  transform: translate(-50%, -50%);
  transition: all 0.15s ease;
}

a:hover ~ .custom-cursor .cursor-outline,
button:hover ~ .custom-cursor .cursor-outline,
.elementor-button:hover ~ .custom-cursor .cursor-outline {
  border-color: red;
}

.custom-cursor {
  pointer-events: none;
  position: fixed;
  top: 0;
  left: 0;
  z-index: 9999;
}

/* -------------------------------
   D Menü Dropdown Styling
-------------------------------- */
.ast-header-break-point .main-header-menu .sub-menu li a {
  background-color: #fdf1ba !important;
  color: #111 !important;
}

.ast-header-break-point .main-header-menu .sub-menu li a:hover {
  background-color: #f8e58a !important;
}

/* -------------------------------
   H Sangoma – Header Hintergrundfarbe
-------------------------------- */
.page-id-706 .elementor-location-header {
  background-color: #fdf1ba !important;
}

.page-id-1247 footer,
.page-id-1247 footer * {
  background-color: transparent !important;
  box-shadow: none !important;
  color: #000 !important;
}