/* Google Fonts Import */
@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@100;300;600&display=swap');


:root {
  /* ============================ Fonts ============================ */
  /* Font and Font Weight */
  --primary-font: 'Montserrat', sans-serif;
  --font-weight-thin: 100;
  --font-weight-regular: 300;
  --font-weight-bold: 600;



  /* Font Size */
  --font-size-base:  1.2rem;                                   /* Basis-Schriftgröße für Fließtext */
  --font-size-small: 0.9rem;                                   /* Kleinere Schriftgröße */
  --font-size-large: 1.4rem;                                   /* Größere Schriftgröße */
  --font-size-title: 3.6rem;                                   /* Titelgröße */
  --font-size-main-heading: 2.2rem;                            /* Hauptüberschrift */

  /* Special Sizes */
  --size-hamburger-menu: 2.6rem;                               /* Größe des Hamburger Menüs */
  --font-size-nav-link: 1.2rem;                                /* Standardgröße der Navigationslinks */


  /* ============================ Colors ============================ */

  /* Background Color */
  --bg-color:  #f4f4f4;

  /* Primary Palette */
  --primary-color: rgb(236, 236, 236);                        /* Hauptfarbe der Webseite  (header after scroll, hamburger-menu transition) */
  --primary-transparent:  rgba(236, 236, 236, 0.75);          /* Transparente Version der Hauptfarbe (header before scroll, portrait-footer) */
  --primary-light:rgb(250, 250, 250);                         /* Hellere Version der Hauptfarbe (background of the website) */
  --primary-dark: rgb(160, 160, 160);                         /* Dunklere Version der Hauptfarbe (header border)*/

  /* Secondary Palette */
  --secondary-color: rgb(140, 129, 129);                       /* Sekundäre Akzentfarbe (Footer) */
  --secondary-light: rgb(160, 149, 149);                       /* Hellere Version der Sekundärfarbe */
  --secondary-extreme-light:  rgb(228, 211, 211); 
  --secondary-dark:  rgb(90, 79, 79);                          /* Dunklere Version der Sekundärfarbe */
  --secondary-transparent: rgba(160, 149, 149, 0.75);

  /* Neutral Colors */
  --white: #ffffff;
  --black: #000000;
  --gray-light: #f4f4f4;
  --gray-medium: #d3d3d3;
  --gray-dark: #7a7a7a;

  /* Text Colors */
  --text-color: #333333;                                        /* Standard-Textfarbe */
  --text-light: #666666;                                        /* Hellerer Text */
  --text-inverted: #ffffff;                                     /* Text auf dunklem Hintergrund */

  /* Button Colors */
  --button-bg: var(--secondary-light);
  --button-bg-hover: var(--secondary-dark);
  --button-text: var(--white);

  /* Special Use Cases */
  --error-color: #ff0033;                                        /* Farbe für Fehlermeldungen */
  --success-color: #28a745;                                      /* Farbe für Erfolgsmeldungen */
  --hover-color: rgb(178, 0, 0);
  --focus-color: #166121;

  /* Gradient Colors */
  --gradient-color:  linear-gradient(to right, var(--primary-color), var(--secondary-color));
  --gradient-color-alt: linear-gradient(to right, var(--secondary-color), var(--primary-color));

  /* ============================ Images ============================ */
  --gallery-interior-living-room-1: "images/gallery/villa-adria-living-room-croatia-sabunike.jpg";

}