/* ============================================================
   TOMÉ & MARTINS — GLOBAL BASE
   Konzept "Atlantik": warmes Papier, tiefes Atlantik-Blau,
   Terrakotta-Akzent — die Brücke zwischen Deutschland & Portugal.
   ============================================================ */

:root {
    /* Farben */
    --tm-ink: #12273A;
    --tm-ink-deep: #0C1B29;
    --tm-ink-soft: #24465F;
    --tm-paper: #F7F2E9;
    --tm-paper-deep: #EFE6D6;
    --tm-white: #FFFDF8;
    --tm-terra: #C2562F;
    --tm-terra-dark: #A03F1D;
    --tm-terra-soft: #EBCDBE;
    --tm-azul: #2F6E8E;
    --tm-text: #2B3947;
    --tm-text-soft: #5A6B7A;
    --tm-line: rgba(18, 39, 58, 0.14);

    /* Typografie */
    --tm-font-display: 'Fraunces', Georgia, serif;
    --tm-font-body: 'Public Sans', 'Segoe UI', sans-serif;

    /* Layout */
    --tm-radius: 18px;
    --tm-radius-sm: 10px;
    --tm-shadow: 0 18px 50px -18px rgba(18, 39, 58, 0.28);
    --tm-shadow-soft: 0 8px 28px -12px rgba(18, 39, 58, 0.18);
    --tm-header-h: 86px;
}

html {
    scroll-behavior: smooth;
}

body {
    margin: 0;
    background-color: var(--tm-paper);
    color: var(--tm-text);
    font-family: var(--tm-font-body);
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    overflow-x: hidden;
}

#page {
    margin: 0;
    overflow-x: hidden;
}

#general-background-color {
    background-color: var(--tm-paper);
}

::selection {
    background: var(--tm-terra);
    color: var(--tm-white);
}

h1, h2, h3, h4 {
    font-family: var(--tm-font-display);
    color: var(--tm-ink);
}

p {
    color: inherit;
    font-size: 1.05rem;
    font-family: var(--tm-font-body);
}

a {
    color: inherit;
    text-decoration: none;
}

a:hover {
    color: var(--tm-terra);
    text-decoration: none;
}

code {
    font-family: source-code-pro, Menlo, Monaco, Consolas, 'Courier New', monospace;
}

.App {
    text-align: center;
}

#ignilabs-logo {
    flex-shrink: 0;
    text-align: center;
    align-self: center;
    /* Flex-Item im Cookie-Banner würde sonst unter seine Inhaltshöhe
       gestaucht; max-content hält die Box auf Flamme + Wortmarke */
    min-height: max-content;
}

#ignilabs-logo img {
    display: block;
    height: 72px;
    width: auto;
    margin: 0 auto 6px;
}

#ignilabs-logo span {
    display: block;
    font-family: var(--tm-font-display);
    font-weight: 600;
    font-size: 0.92rem;
    letter-spacing: 0.02em;
    color: var(--tm-ink);
}