/* lora-regular - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Lora';
  font-style: normal;
  font-weight: 400;
  src: url('../fonts/lora-v37-latin-regular.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* lora-italic - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Lora';
  font-style: italic;
  font-weight: 400;
  src: url('../fonts/lora-v37-latin-italic.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* lora-500 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Lora';
  font-style: normal;
  font-weight: 500;
  src: url('../fonts/lora-v37-latin-500.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* lora-500italic - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Lora';
  font-style: italic;
  font-weight: 500;
  src: url('../fonts/lora-v37-latin-500italic.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* lora-600 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Lora';
  font-style: normal;
  font-weight: 600;
  src: url('../fonts/lora-v37-latin-600.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* lora-600italic - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Lora';
  font-style: italic;
  font-weight: 600;
  src: url('../fonts/lora-v37-latin-600italic.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* lora-700 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Lora';
  font-style: normal;
  font-weight: 700;
  src: url('../fonts/lora-v37-latin-700.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* lora-700italic - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Lora';
  font-style: italic;
  font-weight: 700;
  src: url('../fonts/lora-v37-latin-700italic.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* poppins-300 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 300;
  src: url('../fonts/poppins-v24-latin-300.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* poppins-300italic - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Poppins';
  font-style: italic;
  font-weight: 300;
  src: url('../fonts/poppins-v24-latin-300italic.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* poppins-regular - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 400;
  src: url('../fonts/poppins-v24-latin-regular.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* poppins-italic - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Poppins';
  font-style: italic;
  font-weight: 400;
  src: url('../fonts/poppins-v24-latin-italic.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* poppins-500 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 500;
  src: url('../fonts/poppins-v24-latin-500.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* poppins-500italic - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Poppins';
  font-style: italic;
  font-weight: 500;
  src: url('../fonts/poppins-v24-latin-500italic.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* poppins-700 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 700;
  src: url('../fonts/poppins-v24-latin-700.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* poppins-900 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Poppins';
  font-style: normal;
  font-weight: 900;
  src: url('../fonts/poppins-v24-latin-900.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

/* poppins-900italic - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Poppins';
  font-style: italic;
  font-weight: 900;
  src: url('../fonts/poppins-v24-latin-900italic.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}


/* ============================================
   FARBEN - CSS Variablen
   ============================================ */
:root {
    --color-blue: #0056a4;
	--color-gold: #cea537;
    --color-black: #000000;
    --font-head: 'Lora', Georgia, serif;
	--font-body: 'Poppins', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
}


/* ============================================
   HEADLINE 1
   ============================================ */
.tm-page h1,
h1,
.h1 {
    font-family: var(--font-head) !important;
    font-weight: 900 !important;
    font-size: clamp(48px, 5.5vw, 96px) !important;
    line-height: 1.05 !important;
    letter-spacing: 2% !important;
    color: var(--color-gold) !important;
    margin: 0 !important;
	padding-bottom: clamp(20px, 2.2vw, 36px) !important;
}

/* ============================================
   HEADLINE 2
   ============================================ */
.tm-page h2,
h2,
.h2 {
    font-family: var(--font-head) !important;
    font-weight: 900 !important;
    font-size: clamp(32px, 4vw, 72px) !important;
    line-height: 1.05 !important;
    letter-spacing: 2% !important;
    color: var(--color-gold) !important;
    margin: 0 !important;
	padding-bottom: clamp(18px, 2.0vw, 32px) !important;
}

/* ============================================
   HEADLINE 3
   ============================================ */
.tm-page h3,
h3,
.h3 {
    font-family: var(--font-head) !important;
    font-weight: 700 !important;
    font-size: clamp(20px, 1.8vw, 32px) !important;
    line-height: 1.3 !important;
    letter-spacing: 2% !important;
    color: var(--color-gold) !important;
    margin: 0 !important;
}

/* ============================================
   EINLEITUNG 1
   ============================================ */
.intro-1 {
    font-family: var(--font-head) !important;
    font-weight: 700 !important;
    font-size: clamp(24px, 3.2vw, 38px) !important;
    line-height: 1.5 !important;
    color: var(--color-gold) !important;
    margin: 0 !important;
}

/* ============================================
   EINLEITUNG 2
   ============================================ */
.intro-2 {
    font-family: var(--font-head) !important;
    font-weight: 700 !important;
    font-size: clamp(20px, 2.8vw, 32px) !important;
    line-height: 1.45 !important;
    color: var(--color-gold) !important;
    margin: 0 !important;
}

/* ============================================
   BODY TEXT
   ============================================ */
.tm-page p,
p, .body-text {
    font-family: var(--font-body) !important;
    font-weight: 400 !important;
    font-size: clamp(16px, 1.3vw, 20px) !important;
    line-height: 1.7 !important;
    color: var(--color-gold) !important;
    margin: 0 !important;
	padding-bottom: clamp(16px, 2.2vw, 24px) !important;
}

p, ul, li, body {
    font-family: var(--font-body) !important;
    color: var(--color-gold) !important;
}


/* Auszeichnung im Text (bold) */
.tm-page p strong,
p strong,
.body-text strong, strong {
    font-weight: 600 !important;
}

/* ============================================
   BLICKFANG
   ============================================ */
.highlight {
    font-family: var(--font-head) !important;
    font-weight: 600 !important;
    font-size: clamp(34px, 5vw, 68px) !important;
    line-height: 1.1 !important;
    color: var(--color-gold) !important;
    margin: 0 !important;
}

/* ============================================
   LINK
   ============================================ */
.tm-page a,
a, .link {
    font-family: var(--font-head) !important;
    font-weight: 900 !important;
    font-size: clamp(14px, 1.8vw, 26px) !important;
    letter-spacing: 3% !important;
    color: var(--color-gold) !important;
    text-decoration: none !important;
    transition: color 0.3s ease !important;
}

.tm-page a:hover,
a:hover, .link:hover {
    color: var(--color-gold) !important;
}

.hero-logo {
  display: block;
  width: min(80vw, 600px); /* wird kleiner mit dem Viewport */
  height: auto;
  margin: 0 auto;      /* horizontal zentriert */
}

.outlined {
  color: #fff; /* Textfarbe */
  text-shadow:
    -2px -2px 0 #000,
     2px -2px 0 #000,
    -2px  2px 0 #000,
     2px  2px 0 #000; /* 1px „Rand“ in Schwarz */
}

.tm-page .uk-navbar-nav a, .tm-page .uk-navbar-dropdown a { 
	font-family: var(--font-body) !important;
    font-weight: 500 !important;
}

/* Grundzustand: keine sichtbare Linie */
.uk-navbar-dropdown .uk-nav > li > a {
    position: relative;
    text-decoration: none;
}

.uk-navbar-dropdown .uk-nav > li > a::after {
    content: "";
    position: absolute;
    left: 0;
    bottom: 0.15em;               /* Abstand zur Schrift */
    width: 100%;
    height: 2px;
    background-color: #FFD700;    /* Gold */
    transform: scaleX(0);         /* auf 0 „zusammengeschoben“ */
    transform-origin: center;     /* aus der Mitte heraus */
    transition: transform 0.25s ease;
}

/* Hover/Fokus: Linie fährt von der Mitte nach außen auf */
.uk-navbar-dropdown .uk-nav > li > a:hover::after,
.uk-navbar-dropdown .uk-nav > li > a:focus::after {
    transform: scaleX(1);         /* volle Breite, wächst aus der Mitte */
}

/* Navbar-Toggle (Hamburger) größer machen */
.uk-navbar-toggle .uk-navbar-toggle-icon {
    width: 36px;   /* Standard ist kleiner, z.B. 18–24px */
    height: 36px;
}

.uk-navbar-toggle .uk-icon svg {
    background: transparent;
}

.tm-page .uk-subnav a { 
	font-family: var(--font-body) !important;
    font-weight: 500 !important;
}


.tm-page a.btn_seaside { 
	color: #ffffff !important;
  text-shadow:
    -1px -1px 0 #000,
     1px -1px 0 #000,
    -1px  1px 0 #000,
     1px  1px 0 #000;	
}

.btn_seaside {
    background: #d4af37;              /* Gold */
    color: #ffffff;
    border-radius: 9999px;
    border: none;                     /* echte Border weg, wir machen alles über box-shadow */
    padding: 0.15em 1.4em;
    text-transform: uppercase;
    transition:
        box-shadow 0.25s ease,
        transform 0.25s ease,
        background-color 0.25s ease,
        color 0.25s ease;
}

/* Normalzustand mit Doppelrand */
.btn_seaside {
    /* Syntax: h-offset v-offset blur spread color */
    box-shadow:
        0 0 0 1px #000000,   /* äußerer 1px schwarzer Rand */
        0 0 0 5px #8b5a2b;   /* 4px brauner Rand darüber (1 + 4 = 5px spread) */
}

/* Hover: Hintergrund halbtransparent, Glow dazu, Ränder bleiben */
.btn_seaside:hover,
.btn_seaside:focus {
    transform: translateY(-1px);
    background-color: rgba(212, 175, 55, 0.5); /* Gold mit 0.5 Transparenz */

    box-shadow:
        0 0 0 1px #000000,                       /* äußerer schwarzer Rand */
        0 0 0 5px #8b5a2b,                       /* brauner Rand */
        0 0 8px rgba(212, 175, 55, 0.8),         /* Glow 1 */
        0 0 16px rgba(212, 175, 55, 0.6);        /* Glow 2 */
}

.uk-icon svg {
    width: clamp(3rem, 4vw, 4rem);   /* min, fluid, max */
    height: clamp(3rem, 4vw, 4rem);
	background-color: rgba(212, 175, 55, 0.1);
}

.btn_social {
    background-color: transparent;
    border: none;
    box-shadow: none;
}