/*
 * Brigitte.de Header/Footer Template Styles
 * Based on the actual Brigitte.de design system
 */

/* ========================================
   CSS Variables (matching Brigitte.de)
   ======================================== */
:root {
  /* Colors */
  --color-max-dark: #03080e;
  --color-max-dark-alpha-0_7: rgba(3, 8, 14, 0.7);
  --color-neutral-dark: #333747;
  --color-neutral-dim: #6c717d;
  --color-neutral-medium: #808694;
  --color-neutral-bright: #b0b5bf;
  --color-neutral-light: #f2f2f2;
  --color-max-light: #fff;
  --color-highlight: #d8115f;
  --color-highlight-up: #f294a4;
  --color-page-background: #fef8f6;
  --color-petrol-basic: #008a83;
  --color-petrol-light: #d3e7d6;
  --color-violet-light: #e6dee7;
  --color-pink-basic: #d8115f;
  --color-pink-light: #f8c9d1;

  /* Spacing */
  --space-1: 8px;
  --space-0_5: calc(var(--space-1) * 0.5);
  --space-1_5: calc(var(--space-1) * 1.5);
  --space-2: calc(var(--space-1) * 2);
  --space-2_5: calc(var(--space-1) * 2.5);
  --space-3: calc(var(--space-1) * 3);
  --space-4: calc(var(--space-1) * 4);
  --space-5: calc(var(--space-1) * 5);
  --space-6: calc(var(--space-1) * 6);

  /* Layout */
  --base-content-max-width: 1280px;
  --page-section-padding-base: var(--space-3);

  /* Typography */
  --font-family: "Outfit", sans-serif;

  /* Header specific */
  --header-logo-width: 144px;
  --header-logo-height: 40px;
  --header-min-height: 102px;
  --header-background: var(--color-page-background);

  /* Borders */
  --line-extralight: 1px solid var(--color-neutral-light);
  --line-light: 1px solid var(--color-petrol-light);

  /* Opacity */
  --opacity-active-s: 0.8;
}

/* ========================================
   Reset & Base Styles
   ======================================== */
*,
*::before,
*::after {
  box-sizing: border-box;
}

html {
  line-height: 1.15;
  -webkit-text-size-adjust: 100%;
}

body {
  margin: 0;
  font-family: var(--font-family);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizelegibility;
  background-color: var(--color-page-background);
  color: var(--color-neutral-dark);
}

h1,
h2,
h3,
h4,
h5,
h6,
p {
  margin: 0;
}

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

ul {
  list-style: none;
  margin: 0;
  padding: 0;
}

button {
  font-family: inherit;
  font-size: inherit;
  line-height: inherit;
  margin: 0;
  padding: 0;
  border: none;
  background: none;
  cursor: pointer;
}

/* ========================================
   Page Layout
   ======================================== */
.page {
  --page-background: var(--color-page-background);
  background: var(--page-background);
}

.page__content {
  margin: 0 auto;
  background-color: var(--color-page-background);
  position: relative;
}

.page__section {
  background-color: var(--color-page-background);
  padding: var(--page-section-padding-base);
}

.page__section--header {
  padding: var(--space-2) var(--page-section-padding-base) 0;
}

/* ========================================
   Header
   ======================================== */
.header {
  background: var(--header-background);
  min-height: var(--header-min-height);
  position: relative;
}

.header__inner {
  display: grid;
  grid-template-columns: var(--header-logo-width) 1fr min-content;
  grid-template-rows: auto;
  gap: var(--space-1) var(--space-3);
  margin: 0 auto;
  position: static;
  max-width: var(--base-content-max-width);
}

.header__skip-link {
  clip-path: inset(50%);
  height: 1px;
  overflow: hidden;
  position: absolute;
  width: 1px;
  z-index: 1;
}

.header__skip-link:focus-visible {
  background-color: var(--color-max-light);
  clip-path: none;
  height: auto;
  left: calc(var(--header-logo-width) + 56px);
  margin: 0;
  overflow: visible;
  padding: var(--space-1) var(--space-2);
  top: var(--space-1_5);
  width: auto;
}

/* Logo */
.header__logo {
  background: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='184' height='52' fill='none'%3E%3Cpath fill='%23000' d='M53.485 13c-3.3 0-5.731 2.996-7.676 6.199v-5.682L34 14.102v1.102c3.786.172 4.064.827 4.064 6.027v11.606c0 5.2-.243 5.923-4.064 6.095V40h17.61v-1.068c-4.968-.172-5.245-.895-5.245-6.095V21.369c.764-1.275 2.223-3.616 3.021-3.616.626 0 1.112.964 1.112.964.972 1.17 2.431 1.894 4.202 1.894 1.668 0 3.3-1.343 3.3-3.616C58 14.446 56.16 13 53.485 13m18.523 19.697V13L60 13.597v1.123c3.687.176 3.958.843 3.958 6.145v11.832c0 5.302-.237 6.039-3.958 6.215V40h16v-1.088c-3.687-.176-3.992-.913-3.992-6.215'/%3E%3Cpath fill='%23000' d='M94.096 34.868h-8.348c-1.252 0-2.957-.07-2.957-1.71 0-.768.592-1.85 1.287-2.687 1.252.314 2.609.489 4.035.489 6.817 0 11.235-3.734 11.235-8.968 0-2.268-.765-4.047-2.261-5.338 3.652-.524 5.913-2.617 5.913-5.34C103 9.187 102.165 8 100.391 8c-1.878 0-2.991 1.745-2.678 4.187.348 1.99.487 2.373-.035 2.582-1.182.733-5.148-1.85-9.774-1.85-6.504 0-11.06 3.56-11.06 8.829 0 3.733 2.086 6.63 5.495 8.13-2.365 1.535-4.904 3.908-4.904 6.63 0 1.953 1.182 3.803 4.66 4.466-4.451.593-7.095 2.652-7.095 5.269C75 49.802 79.313 52 86.409 52c9.982 0 16.556-5.025 16.556-10.747.07-2.373-.869-6.385-8.87-6.385ZM87.939 14.56c2.435 0 3.652 2.442 3.652 7.537s-1.078 7.188-3.27 7.188c-2.538 0-3.721-2.478-3.721-7.781.035-4.92 1.113-6.944 3.34-6.944Zm.313 35.765c-3.965 0-6.435-2.268-6.435-4.85 0-2.373 1.705-4.222 6.61-4.222h2.851c2.365 0 5.148.07 5.148 2.966-.035 3.698-3.86 6.106-8.174 6.106m28.756-17.628V13L105 13.597v1.123c3.687.176 3.958.843 3.958 6.145v11.832c0 5.302-.237 6.039-3.958 6.215V40h16v-1.088c-3.687-.176-3.992-.913-3.992-6.215m23.402 3.017c-1.459 1.113-2.952 1.774-4.479 1.774-1.702 0-2.605-.591-2.605-3.443V15.703h7.014v-1.931h-7.014V4h-2.604c-.59 7.58-3.055 9.633-9.722 10.12v1.46h4.063v18.57c0 4.833 2.43 6.85 6.84 6.85 3.715 0 6.736-1.773 9.097-4.66z'/%3E%3Cpath fill='%23000' d='M159.423 35.714c-1.426 1.113-2.886 1.774-4.381 1.774-1.663 0-2.546-.591-2.546-3.443V15.703h6.859V13.68h-6.859V4h-2.547c-.577 7.58-3.429 9.285-9.949 9.772v1.93h4.414V34.15c0 4.834 2.377 6.851 6.69 6.851 3.633 0 6.587-1.773 8.896-4.66zm23.886-4.588c-1.761 2.416-4.04 4.454-7.873 4.454-5.18 0-8.115-4.178-8.288-10.634h16.334c.069-.415.104-.932.104-1.588 0-1.347-.346-3.108-.933-4.42-1.692-3.763-5.214-5.938-9.98-5.938C165.387 13 160 18.87 160 27.57c0 8.148 5.007 13.43 12.086 13.43 6.561 0 10.153-4.626 11.914-9.46zM172.224 14.83c2.521 0 3.799 2.244 3.799 5.11 0 2.45-.932 3.28-3.695 3.28h-5.18c.311-6.526 2.556-8.39 5.076-8.39M112 10c2.746 0 5-2.218 5-5 0-2.746-2.218-5-5-5-2.746 0-5 2.218-5 5s2.218 5 5 5m-45 0c2.746 0 5-2.218 5-5 0-2.746-2.218-5-5-5-2.746 0-5 2.218-5 5 .035 2.782 2.254 5 5 5M23.278 21.515c4.895-1.527 8.319-4.232 8.319-8.914C31.596 7.191 27.248 4 17.56 4H0v1.075c4.827.174 5.306.902 5.306 6.139v21.572c0 5.237-.48 5.965-5.306 6.139V40h18.69C28.517 40 33 36.15 33 30.462c0-5.271-3.937-8.046-9.722-8.947M16.295 5.838c4.724 0 6.572 2.705 6.572 7.249 0 5.063-2.499 7.422-6.572 7.422H13.59V7.434c0-.798.343-1.596 2.705-1.596m.24 32.324c-1.404 0-2.945-.035-2.945-.035V23.873c0-.624.548-1.56 2.705-1.526 4.279-.035 7.907 1.838 7.907 8.15 0 4.82-2.122 7.665-7.668 7.665Z'/%3E%3C/svg%3E")
    no-repeat center;
  background-size: contain;
  display: block;
  grid-area: 1 / 1 / 2 / 2;
  height: var(--header-logo-height);
  width: var(--header-logo-width);
  margin: 0;
}

.header__logo:active {
  opacity: var(--opacity-active-s);
}

/* Header Meta (Login button) */
.header__meta {
  align-self: center;
  justify-self: end;
  grid-area: 1 / 2 / 2 / 3;
}

.header__meta-items {
  align-items: center;
  display: flex;
  justify-content: flex-end;
}

.header__meta-item {
  display: inline-flex;
  align-items: center;
}

.header__meta-link {
  background-position: 50%;
  background-repeat: no-repeat;
  background-size: 24px 24px;
  cursor: pointer;
  height: 40px;
  width: 40px;
  display: block;
}

.header__meta-icon--login {
  background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' fill='none'%3E%3Cpath fill='%2303080e' fill-rule='evenodd' d='M12 11a5 5 0 1 0 0-10 5 5 0 0 0 0 10m9 11v-5.563A13.45 13.45 0 0 0 12 13a13.45 13.45 0 0 0-9 3.438V22z' clip-rule='evenodd'/%3E%3C/svg%3E");
}

/* Header Content (Menu button) */
.header__content {
  align-items: center;
  display: flex;
  grid-area: 1 / 3 / 2 / -1;
  justify-self: end;
}

.header__button {
  cursor: pointer;
}

.header__button--burger {
  background: transparent
    url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='40' height='24' fill='none'%3E%3Cpath fill='%2303080E' d='M0 0h40v3H0zm0 7h40v3H0zm1 15h.779v-5.605l2.64 4.469 2.63-4.48V22h.78v-7H7.11l-2.69 4.413L1.727 15H1zm12.5 0h4.057v-.663h-3.268v-2.734h3.005v-.757h-3.005v-2.323h3.197V15H13.5zm9.5 0h.79v-5.836L28.098 22h.637v-7h-.789v5.632L23.687 15H23zm14.402-7.729c.263 0 .505-.22.505-.525a.517.517 0 0 0-.505-.526.517.517 0 0 0-.506.526c0 .305.242.525.506.525m-2.084 0c.263 0 .505-.22.505-.525a.517.517 0 0 0-.505-.526.517.517 0 0 0-.506.526c0 .305.242.525.506.525m-1.599 5.257c0 1.777 1.123 2.692 2.64 2.692S39 21.305 39 19.528V15h-.79v4.444c0 1.346-.727 2.019-1.85 2.019s-1.852-.673-1.852-2.019V15h-.789z'/%3E%3C/svg%3E")
    center/contain no-repeat;
  height: 24px;
  width: 40px;
  margin: 0;
}

.header__button:active,
.header__logo:active {
  opacity: var(--opacity-active-s);
}

.header__button--burger:focus-visible {
  outline-offset: var(--space-1);
}

/* ========================================
   Slide Navigation
   ======================================== */
.slide-navigation {
  align-items: stretch;
  background: transparent;
  border-bottom: var(--line-extralight);
  border-top: var(--line-extralight);
  display: grid;
  grid-area: 2 / 1 / 3 / -1;
  margin: 0 calc(var(--page-section-padding-base) * -1);
  position: relative;
}

.slide-navigation__items {
  display: flex;
  gap: 0 var(--space-2);
  margin: 0;
  overflow-x: auto;
  overflow-y: hidden;
  -webkit-overflow-scrolling: touch;
  padding: var(--space-1) var(--page-section-padding-base);
  scrollbar-width: none;
  white-space: nowrap;
  mask-image: linear-gradient(
    to right,
    transparent 0,
    var(--color-page-background) var(--page-section-padding-base)
      calc(100% - var(--page-section-padding-base)),
    transparent 100%
  );
  -webkit-mask-image: linear-gradient(
    to right,
    transparent 0,
    var(--color-page-background) var(--page-section-padding-base)
      calc(100% - var(--page-section-padding-base)),
    transparent 100%
  );
}

.slide-navigation__items::-webkit-scrollbar {
  display: none;
}

.slide-navigation__item-link {
  font: 300 12px/20px var(--font-family);
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--color-max-dark);
  text-decoration: none;
}

.slide-navigation__item-link:active {
  opacity: var(--opacity-active-s);
}

.slide-navigation__item-link:hover {
  color: var(--color-petrol-basic);
}

/* ========================================
   Main Content Area
   ======================================== */
.page__main {
  min-height: 400px;
  max-width: var(--base-content-max-width);
  margin: 0 auto;
  padding: var(--space-6) var(--page-section-padding-base);
}

.content-placeholder {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 300px;
  background-color: var(--color-max-light);
  border: 2px dashed var(--color-neutral-bright);
  border-radius: 8px;
  font: 300 16px/24px var(--font-family);
  color: var(--color-neutral-dim);
}

/* ========================================
   Footer
   ======================================== */
.footer {
  background-color: var(--color-page-background);
  padding: var(--page-section-padding-base);
}

.footer__inner {
  max-width: var(--base-content-max-width);
  margin: 0 auto;
}

.footer__top {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: var(--space-4);
}

.footer__logo {
  background: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='184' height='52' fill='none'%3E%3Cpath fill='%23000' d='M53.485 13c-3.3 0-5.731 2.996-7.676 6.199v-5.682L34 14.102v1.102c3.786.172 4.064.827 4.064 6.027v11.606c0 5.2-.243 5.923-4.064 6.095V40h17.61v-1.068c-4.968-.172-5.245-.895-5.245-6.095V21.369c.764-1.275 2.223-3.616 3.021-3.616.626 0 1.112.964 1.112.964.972 1.17 2.431 1.894 4.202 1.894 1.668 0 3.3-1.343 3.3-3.616C58 14.446 56.16 13 53.485 13m18.523 19.697V13L60 13.597v1.123c3.687.176 3.958.843 3.958 6.145v11.832c0 5.302-.237 6.039-3.958 6.215V40h16v-1.088c-3.687-.176-3.992-.913-3.992-6.215'/%3E%3Cpath fill='%23000' d='M94.096 34.868h-8.348c-1.252 0-2.957-.07-2.957-1.71 0-.768.592-1.85 1.287-2.687 1.252.314 2.609.489 4.035.489 6.817 0 11.235-3.734 11.235-8.968 0-2.268-.765-4.047-2.261-5.338 3.652-.524 5.913-2.617 5.913-5.34C103 9.187 102.165 8 100.391 8c-1.878 0-2.991 1.745-2.678 4.187.348 1.99.487 2.373-.035 2.582-1.182.733-5.148-1.85-9.774-1.85-6.504 0-11.06 3.56-11.06 8.829 0 3.733 2.086 6.63 5.495 8.13-2.365 1.535-4.904 3.908-4.904 6.63 0 1.953 1.182 3.803 4.66 4.466-4.451.593-7.095 2.652-7.095 5.269C75 49.802 79.313 52 86.409 52c9.982 0 16.556-5.025 16.556-10.747.07-2.373-.869-6.385-8.87-6.385ZM87.939 14.56c2.435 0 3.652 2.442 3.652 7.537s-1.078 7.188-3.27 7.188c-2.538 0-3.721-2.478-3.721-7.781.035-4.92 1.113-6.944 3.34-6.944Zm.313 35.765c-3.965 0-6.435-2.268-6.435-4.85 0-2.373 1.705-4.222 6.61-4.222h2.851c2.365 0 5.148.07 5.148 2.966-.035 3.698-3.86 6.106-8.174 6.106m28.756-17.628V13L105 13.597v1.123c3.687.176 3.958.843 3.958 6.145v11.832c0 5.302-.237 6.039-3.958 6.215V40h16v-1.088c-3.687-.176-3.992-.913-3.992-6.215m23.402 3.017c-1.459 1.113-2.952 1.774-4.479 1.774-1.702 0-2.605-.591-2.605-3.443V15.703h7.014v-1.931h-7.014V4h-2.604c-.59 7.58-3.055 9.633-9.722 10.12v1.46h4.063v18.57c0 4.833 2.43 6.85 6.84 6.85 3.715 0 6.736-1.773 9.097-4.66z'/%3E%3Cpath fill='%23000' d='M159.423 35.714c-1.426 1.113-2.886 1.774-4.381 1.774-1.663 0-2.546-.591-2.546-3.443V15.703h6.859V13.68h-6.859V4h-2.547c-.577 7.58-3.429 9.285-9.949 9.772v1.93h4.414V34.15c0 4.834 2.377 6.851 6.69 6.851 3.633 0 6.587-1.773 8.896-4.66zm23.886-4.588c-1.761 2.416-4.04 4.454-7.873 4.454-5.18 0-8.115-4.178-8.288-10.634h16.334c.069-.415.104-.932.104-1.588 0-1.347-.346-3.108-.933-4.42-1.692-3.763-5.214-5.938-9.98-5.938C165.387 13 160 18.87 160 27.57c0 8.148 5.007 13.43 12.086 13.43 6.561 0 10.153-4.626 11.914-9.46zM172.224 14.83c2.521 0 3.799 2.244 3.799 5.11 0 2.45-.932 3.28-3.695 3.28h-5.18c.311-6.526 2.556-8.39 5.076-8.39M112 10c2.746 0 5-2.218 5-5 0-2.746-2.218-5-5-5-2.746 0-5 2.218-5 5s2.218 5 5 5m-45 0c2.746 0 5-2.218 5-5 0-2.746-2.218-5-5-5-2.746 0-5 2.218-5 5 .035 2.782 2.254 5 5 5M23.278 21.515c4.895-1.527 8.319-4.232 8.319-8.914C31.596 7.191 27.248 4 17.56 4H0v1.075c4.827.174 5.306.902 5.306 6.139v21.572c0 5.237-.48 5.965-5.306 6.139V40h18.69C28.517 40 33 36.15 33 30.462c0-5.271-3.937-8.046-9.722-8.947M16.295 5.838c4.724 0 6.572 2.705 6.572 7.249 0 5.063-2.499 7.422-6.572 7.422H13.59V7.434c0-.798.343-1.596 2.705-1.596m.24 32.324c-1.404 0-2.945-.035-2.945-.035V23.873c0-.624.548-1.56 2.705-1.526 4.279-.035 7.907 1.838 7.907 8.15 0 4.82-2.122 7.665-7.668 7.665Z'/%3E%3C/svg%3E")
    no-repeat center;
  background-size: contain;
  display: block;
  height: 35px;
  width: 120px;
}

.footer__to-top {
  font: 600 12px/16px var(--font-family);
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--color-max-dark);
  text-decoration: none;
  display: flex;
  align-items: center;
  gap: var(--space-1);
}

.footer__to-top::after {
  content: "";
  display: inline-block;
  width: 16px;
  height: 16px;
  background: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='none'%3E%3Cpath stroke='%2303080e' stroke-width='1.5' d='M3 10l5-5 5 5'/%3E%3C/svg%3E")
    no-repeat center;
  background-size: contain;
}

.footer__to-top:hover {
  color: var(--color-petrol-basic);
}

.footer__nav {
  margin-bottom: var(--space-3);
}

.footer__nav-list {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-1) var(--space-3);
}

.footer__nav-item {
  display: inline;
}

.footer__nav-link {
  font: 300 15px/20px var(--font-family);
  color: var(--color-max-dark);
  text-decoration: none;
}

.footer__nav-link:hover {
  color: var(--color-petrol-basic);
}

.footer__copyright {
  font: 300 12px/16px var(--font-family);
  color: var(--color-neutral-dim);
}

/* ========================================
   Responsive Styles
   ======================================== */
@media (min-width: 641px) {
  .header {
    max-width: var(--base-content-max-width);
    margin: 0 auto;
  }
}

@media (min-width: 1001px) {
  .slide-navigation__items {
    gap: 0 var(--space-3);
  }

  .slide-navigation__item-link {
    font-size: 12px;
  }
}

/* ========================================
   Dark Mode Support (matching Brigitte.de)
   ======================================== */
@media (prefers-color-scheme: dark) {
  :root {
    --color-max-dark: #dad9d9;
    --color-neutral-dark: #b5b3b3;
    --color-neutral-dim: #b7b7bd;
    --color-neutral-medium: #b5b7c0;
    --color-neutral-bright: #52555e;
    --color-neutral-light: #2f3040;
    --color-max-light: #232222;
    --color-page-background: #03080e;
    --color-highlight: #f782b3;
    --color-highlight-up: #eea1bc;
    --color-petrol-light: #023a38;
  }

  .header__logo,
  .footer__logo {
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='184' height='52' fill='none'%3E%3Cpath fill='%23dad9d9' d='M53.485 13c-3.3 0-5.731 2.996-7.676 6.199v-5.682L34 14.102v1.102c3.786.172 4.064.827 4.064 6.027v11.606c0 5.2-.243 5.923-4.064 6.095V40h17.61v-1.068c-4.968-.172-5.245-.895-5.245-6.095V21.369c.764-1.275 2.223-3.616 3.021-3.616.626 0 1.112.964 1.112.964.972 1.17 2.431 1.894 4.202 1.894 1.668 0 3.3-1.343 3.3-3.616C58 14.446 56.16 13 53.485 13m18.523 19.697V13L60 13.597v1.123c3.687.176 3.958.843 3.958 6.145v11.832c0 5.302-.237 6.039-3.958 6.215V40h16v-1.088c-3.687-.176-3.992-.913-3.992-6.215'/%3E%3Cpath fill='%23dad9d9' d='M94.096 34.868h-8.348c-1.252 0-2.957-.07-2.957-1.71 0-.768.592-1.85 1.287-2.687 1.252.314 2.609.489 4.035.489 6.817 0 11.235-3.734 11.235-8.968 0-2.268-.765-4.047-2.261-5.338 3.652-.524 5.913-2.617 5.913-5.34C103 9.187 102.165 8 100.391 8c-1.878 0-2.991 1.745-2.678 4.187.348 1.99.487 2.373-.035 2.582-1.182.733-5.148-1.85-9.774-1.85-6.504 0-11.06 3.56-11.06 8.829 0 3.733 2.086 6.63 5.495 8.13-2.365 1.535-4.904 3.908-4.904 6.63 0 1.953 1.182 3.803 4.66 4.466-4.451.593-7.095 2.652-7.095 5.269C75 49.802 79.313 52 86.409 52c9.982 0 16.556-5.025 16.556-10.747.07-2.373-.869-6.385-8.87-6.385ZM87.939 14.56c2.435 0 3.652 2.442 3.652 7.537s-1.078 7.188-3.27 7.188c-2.538 0-3.721-2.478-3.721-7.781.035-4.92 1.113-6.944 3.34-6.944Zm.313 35.765c-3.965 0-6.435-2.268-6.435-4.85 0-2.373 1.705-4.222 6.61-4.222h2.851c2.365 0 5.148.07 5.148 2.966-.035 3.698-3.86 6.106-8.174 6.106m28.756-17.628V13L105 13.597v1.123c3.687.176 3.958.843 3.958 6.145v11.832c0 5.302-.237 6.039-3.958 6.215V40h16v-1.088c-3.687-.176-3.992-.913-3.992-6.215m23.402 3.017c-1.459 1.113-2.952 1.774-4.479 1.774-1.702 0-2.605-.591-2.605-3.443V15.703h7.014v-1.931h-7.014V4h-2.604c-.59 7.58-3.055 9.633-9.722 10.12v1.46h4.063v18.57c0 4.833 2.43 6.85 6.84 6.85 3.715 0 6.736-1.773 9.097-4.66z'/%3E%3Cpath fill='%23dad9d9' d='M159.423 35.714c-1.426 1.113-2.886 1.774-4.381 1.774-1.663 0-2.546-.591-2.546-3.443V15.703h6.859V13.68h-6.859V4h-2.547c-.577 7.58-3.429 9.285-9.949 9.772v1.93h4.414V34.15c0 4.834 2.377 6.851 6.69 6.851 3.633 0 6.587-1.773 8.896-4.66zm23.886-4.588c-1.761 2.416-4.04 4.454-7.873 4.454-5.18 0-8.115-4.178-8.288-10.634h16.334c.069-.415.104-.932.104-1.588 0-1.347-.346-3.108-.933-4.42-1.692-3.763-5.214-5.938-9.98-5.938C165.387 13 160 18.87 160 27.57c0 8.148 5.007 13.43 12.086 13.43 6.561 0 10.153-4.626 11.914-9.46zM172.224 14.83c2.521 0 3.799 2.244 3.799 5.11 0 2.45-.932 3.28-3.695 3.28h-5.18c.311-6.526 2.556-8.39 5.076-8.39M112 10c2.746 0 5-2.218 5-5 0-2.746-2.218-5-5-5-2.746 0-5 2.218-5 5s2.218 5 5 5m-45 0c2.746 0 5-2.218 5-5 0-2.746-2.218-5-5-5-2.746 0-5 2.218-5 5 .035 2.782 2.254 5 5 5M23.278 21.515c4.895-1.527 8.319-4.232 8.319-8.914C31.596 7.191 27.248 4 17.56 4H0v1.075c4.827.174 5.306.902 5.306 6.139v21.572c0 5.237-.48 5.965-5.306 6.139V40h18.69C28.517 40 33 36.15 33 30.462c0-5.271-3.937-8.046-9.722-8.947M16.295 5.838c4.724 0 6.572 2.705 6.572 7.249 0 5.063-2.499 7.422-6.572 7.422H13.59V7.434c0-.798.343-1.596 2.705-1.596m.24 32.324c-1.404 0-2.945-.035-2.945-.035V23.873c0-.624.548-1.56 2.705-1.526 4.279-.035 7.907 1.838 7.907 8.15 0 4.82-2.122 7.665-7.668 7.665Z'/%3E%3C/svg%3E");
  }

  .header__button--burger {
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='40' height='24' fill='none'%3E%3Cpath fill='%23dad9d9' d='M0 0h40v3H0zm0 7h40v3H0zm1 15h.779v-5.605l2.64 4.469 2.63-4.48V22h.78v-7H7.11l-2.69 4.413L1.727 15H1zm12.5 0h4.057v-.663h-3.268v-2.734h3.005v-.757h-3.005v-2.323h3.197V15H13.5zm9.5 0h.79v-5.836L28.098 22h.637v-7h-.789v5.632L23.687 15H23zm14.402-7.729c.263 0 .505-.22.505-.525a.517.517 0 0 0-.505-.526.517.517 0 0 0-.506.526c0 .305.242.525.506.525m-2.084 0c.263 0 .505-.22.505-.525a.517.517 0 0 0-.505-.526.517.517 0 0 0-.506.526c0 .305.242.525.506.525m-1.599 5.257c0 1.777 1.123 2.692 2.64 2.692S39 21.305 39 19.528V15h-.79v4.444c0 1.346-.727 2.019-1.85 2.019s-1.852-.673-1.852-2.019V15h-.789z'/%3E%3C/svg%3E");
  }

  .header__meta-icon--login {
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' fill='none'%3E%3Cpath fill='%23dad9d9' fill-rule='evenodd' d='M12 11a5 5 0 1 0 0-10 5 5 0 0 0 0 10m9 11v-5.563A13.45 13.45 0 0 0 12 13a13.45 13.45 0 0 0-9 3.438V22z' clip-rule='evenodd'/%3E%3C/svg%3E");
  }

  .footer__to-top::after {
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='none'%3E%3Cpath stroke='%23dad9d9' stroke-width='1.5' d='M3 10l5-5 5 5'/%3E%3C/svg%3E");
  }
}

/* ========================================
   Flash Message (Global)
   ======================================== */
.flash-message {
  position: fixed;
  top: 24px;
  right: 24px;
  z-index: 1000;
  background: #333;
  color: white;
  padding: 14px 48px 14px 24px;
  border-radius: 8px;
  font-size: 0.95rem;
  font-weight: 500;
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.25);
  animation: flashSlideIn 0.3s ease-out;
  display: flex;
  align-items: center;
  gap: 16px;
}

.flash-message button {
  position: absolute;
  right: 12px;
  top: 50%;
  transform: translateY(-50%);
  background: transparent;
  border: none;
  color: rgba(255, 255, 255, 0.7);
  font-size: 18px;
  cursor: pointer;
  padding: 4px 8px;
  line-height: 1;
  transition: color 0.2s ease;
}

.flash-message button:hover {
  color: white;
}

.flash-message[data-type="success"] {
  background: #2e7d32;
}

.flash-message[data-type="error"] {
  background: #c62828;
}

.flash-message[data-type="info"] {
  background: #1565c0;
}

@keyframes flashSlideIn {
  from {
    opacity: 0;
    transform: translateX(20px);
  }
  to {
    opacity: 1;
    transform: translateX(0);
  }
}

/* ========================================
   Header Auth Icons (Profile/Logout)
   ======================================== */
#headerLoginIcon.hidden {
  display: none;
}

.header__auth-icons {
  display: none;
  align-items: center;
  gap: 16px;
}

.header__auth-icons.active {
  display: flex;
}

.header__auth-icon {
  width: 24px;
  height: 24px;
  cursor: pointer;
  opacity: 0.8;
  transition: opacity 0.2s ease;
}

.header__auth-icon:hover {
  opacity: 1;
}

.header__auth-icon--profile {
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' fill='none' stroke='%23d8115f' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 21v-2a4 4 0 0 0-4-4H8a4 4 0 0 0-4 4v2'/%3E%3Ccircle cx='12' cy='7' r='4'/%3E%3C/svg%3E")
    center/contain no-repeat;
}

.header__auth-icon--logout {
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' fill='none' stroke='%23333' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M9 21H5a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h4'/%3E%3Cpolyline points='16,17 21,12 16,7'/%3E%3Cline x1='21' y1='12' x2='9' y2='12'/%3E%3C/svg%3E")
    center/contain no-repeat;
}
