/* ==================================================================
   tower-casino.de.com site override
   Loaded last, after base.css, style.css and theme4.css.

   Purpose: give this German site a shell that reads differently from
   towercasino.to, towercasino.live, towercasino.app, towercasino.bet
   and towercasino.games, while reusing the same tested renderers.

   1. Navigation column on the right, narrower than the sibling sites.
   2. Wide sans headings in sentence case, generous word spacing so
      long German compounds do not look cramped.
   3. Section headings carry a small square marker and a hairline
      rule, instead of a number chip or a plain underline.
   4. Olive surface, lime accent, terracotta call to action.
   ================================================================== */

:root {
  --font-display: 'Segoe UI', 'Noto Sans', 'DejaVu Sans', system-ui, -apple-system, sans-serif;
  --font-body: 'Segoe UI', 'Noto Sans', 'DejaVu Sans', system-ui, -apple-system, sans-serif;
}

/* ---- 1. Right-hand navigation column ---------------------------- */
@media (min-width: 1025px) {
  .wi-shell {
    grid-template-columns: 1fr 264px;
    grid-template-areas: "main sidebar";
  }
  .wi-sidebar {
    border-right: 0;
    border-left: 1px solid var(--color-border, #3a4429);
  }
  /* .wi-main is capped for a readable measure; with the navigation on
     the right, centre the column in its track so no dead band forms. */
  .wi-main {
    min-width: 0;
    margin-inline: auto;
  }
}

/* ---- 2. Headings: sentence case, wide, unhyphenated ------------- */
h1, h2, h3, h4,
.hero h1,
.page-hero h1,
.wi-hero__title,
.wi-page-header h1,
.content-section h2,
.content-section h3,
.wi-seo__heading,
.wi-games-tabs__title,
.wi-deal-card__title,
.wi-offer-feed__title,
.wi-payments__title,
.wi-faq__title,
.wi-faq-item__question,
.wi-cta-banner__title,
.wi-banking__title,
.section-title,
.seo-content h2,
.seo-content h3,
.faq-accordion__question {
  font-family: var(--font-display);
  text-transform: none;
  letter-spacing: 0;
  word-spacing: 0.04em;
  font-weight: 600;
  hyphens: none;
}

h1, .wi-page-header h1 { line-height: 1.15; }
h2 { line-height: 1.24; }

/* German runs long: never break a compound mid-word in body copy. */
.wi-main p,
.wi-main li,
.wi-main td,
.wi-main th {
  hyphens: none;
  overflow-wrap: break-word;
}

/* Eyebrow labels stay small and letterspaced in the same face. */
.wi-page-header__eyebrow,
.wi-hero__eyebrow,
.wi-footer__col-label,
.wi-sidebar__nav-label {
  font-family: var(--font-body);
  text-transform: uppercase;
  letter-spacing: 1.2px;
}

/* ---- 3. Square marker and hairline on section headings ---------
   The shared sheets wrap content-section headings inside .container,
   so the child selector has to name that wrapper to win.            */
.wi-main .content-section .container > h2,
.wi-main .seo-content h2 {
  padding-bottom: 10px;
  border-bottom: 1px solid var(--color-border, #3a4429);
  /* Establish a block formatting context so the heading box, and with it the
     hairline rule, stops beside a floated illustration instead of running
     behind it. */
  overflow: hidden;
}

.wi-main .content-section .container > h2::before,
.wi-main .seo-content h2::before {
  content: "";
  display: inline-block;
  width: 10px;
  height: 10px;
  margin-right: 14px;
  vertical-align: 0.08em;
  background: var(--color-accent, #b9cf58);
  border-radius: 2px;
}

/* The centred mid-page call to action takes neither marker nor rule. */
.wi-main .content-section.cta-banner .container > h2 {
  border-bottom: 0;
}
.wi-main .content-section.cta-banner .container > h2::before {
  content: none;
}

/* ---- 4. Supplied illustrations: soft olive halo ----------------- */
.section-illus--transparent {
  background:
    radial-gradient(118% 88% at 50% 14%, rgba(185, 207, 88, 0.09) 0%, rgba(185, 207, 88, 0) 66%);
  border-radius: 14px;
  filter: drop-shadow(0 14px 26px rgba(8, 11, 5, 0.55));
}

/* ---- 5. Hero recolour ------------------------------------------
   theme4.css hardcodes a navy gradient and a gold eyebrow, which
   fight the olive palette. Restate both. */
.wi-hero::before {
  background: linear-gradient(
    90deg,
    rgba(14, 17, 9, 0.93) 0%,
    rgba(33, 39, 24, 0.60) 54%,
    rgba(33, 39, 24, 0.12) 100%
  );
}

.wi-hero__eyebrow {
  color: var(--color-accent, #b9cf58);
  border-color: rgba(185, 207, 88, 0.40);
  background: rgba(185, 207, 88, 0.07);
}

/* ---- 6. Sticky bottom bar -------------------------------------- */
.sticky-cta {
  background: rgba(14, 17, 9, 0.95);
  border-top: 1px solid var(--color-border-2, #5a6a3c);
}

.sticky-cta__bonus {
  text-transform: none;
  letter-spacing: 0;
}

/* ---- 7. Accent details ----------------------------------------- */
.wi-sidebar__cta a {
  color: var(--color-cta-text, #1b0c06);
}

.wi-pay {
  border-radius: 6px;
}

blockquote,
.wi-infobox {
  border-left: 3px solid var(--color-accent, #b9cf58);
}