/*
Theme Name: Marie Bangert
Theme URI: https://mariebangert.de
Author: Upland Media
Description: Schlankes Theme für mariebangert.de im Design der Eislaufschule Willingen. Ohne Elementor und ohne weitere Plugins.
Version: 1.0.0
Requires at least: 6.0
Requires PHP: 7.4
Text Domain: marie
*/

@font-face{font-family:'Fraunces';font-style:normal;font-weight:100 900;font-display:swap;src:url(assets/fonts/fraunces-normal.woff2) format('woff2');}
@font-face{font-family:'Fraunces';font-style:italic;font-weight:100 900;font-display:swap;src:url(assets/fonts/fraunces-italic.woff2) format('woff2');}
@font-face{font-family:'Inter';font-style:normal;font-weight:100 900;font-display:swap;src:url(assets/fonts/inter.woff2) format('woff2');}

:root{
    --bg-0:#070c13;
    --bg-1:#0d1620;
    --bg-2:#12202c;
    --ice:#8fe0ee;
    --ice-dim:#5c93a0;
    --frost:#eef5f8;
    --muted:#8a9fac;
    --ember:#ff8f66;
    --line:rgba(143,224,238,0.14);
    --font-display:'Fraunces', serif;
    --font-body:'Inter', sans-serif;
  }

  *{ margin:0; padding:0; box-sizing:border-box; }

  html{ scroll-behavior:smooth; }

  body{
    background:var(--bg-0);
    color:var(--frost);
    font-family:var(--font-body);
    font-weight:400;
    line-height:1.6;
    overflow-x:hidden;
  }

  ::selection{ background:var(--ice); color:var(--bg-0); }

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

  .wrap{
    max-width:1120px;
    margin:0 auto;
    padding:0 32px;
  }

  /* subtle ice-crystal texture */
  .noise{
    position:fixed; inset:0;
    pointer-events:none;
    z-index:1;
    opacity:0.035;
    background-image:radial-gradient(circle at 20% 30%, #fff 0.5px, transparent 0.5px),
                      radial-gradient(circle at 70% 65%, #fff 0.5px, transparent 0.5px),
                      radial-gradient(circle at 40% 80%, #fff 0.5px, transparent 0.5px);
    background-size:140px 140px, 190px 190px, 110px 110px;
  }

  /* ---------- NAV ---------- */
  header{
    position:fixed; top:0; left:0; right:0;
    z-index:50;
    backdrop-filter:blur(10px);
    background:rgba(7,12,19,0.72);
    border-bottom:1px solid var(--line);
  }
  nav{
    position:relative;
    display:flex; align-items:center; justify-content:space-between;
    padding:8px 32px;
    max-width:1120px; margin:0 auto;
  }
  .brand{
    display:flex; align-items:center; gap:10px;
  }
  .brand img{
    height:78px;
    width:auto;
    display:block;
  }
  .brand span{
    font-family:var(--font-body);
    font-size:0.62rem;
    letter-spacing:0.22em;
    color:var(--ice);
    font-weight:500;
  }
  .navlinks{ display:flex; gap:36px; font-size:0.85rem; color:var(--muted); }
  .navlinks a{ transition:color .25s; position:relative; }
  .navlinks a:hover{ color:var(--frost); }
  .navlinks a:focus-visible, a:focus-visible{ outline:1px solid var(--ice); outline-offset:4px; }
  .navcta{
    border:1px solid var(--ice-dim);
    padding:9px 18px;
    border-radius:2px;
    font-size:0.8rem;
    color:var(--ice);
    transition:all .25s;
  }
  .navcta:hover{ background:var(--ice); color:var(--bg-0); border-color:var(--ice); }
  .navlinks-cta{ display:none; }

  .menu-toggle{
    display:none;
    flex-direction:column;
    justify-content:center;
    align-items:center;
    gap:5px;
    width:38px; height:38px;
    background:none;
    border:none;
    cursor:pointer;
    z-index:70;
    flex-shrink:0;
  }
  .menu-toggle span{
    display:block;
    width:22px;
    height:1.5px;
    background:var(--frost);
    transition:transform .3s ease, opacity .3s ease;
  }
  .menu-toggle.is-open span:nth-child(1){ transform:translateY(6.5px) rotate(45deg); }
  .menu-toggle.is-open span:nth-child(2){ opacity:0; }
  .menu-toggle.is-open span:nth-child(3){ transform:translateY(-6.5px) rotate(-45deg); }

  /* ---------- HERO ---------- */
  .hero{
    position:relative;
    min-height:100vh;
    display:flex; align-items:center;
    padding-top:112px;
    overflow:hidden;
    background-image:
      linear-gradient(180deg, rgba(7,12,19,0.55) 0%, rgba(7,12,19,0.78) 55%, var(--bg-0) 100%),
      linear-gradient(90deg, rgba(7,12,19,0.96) 0%, rgba(7,12,19,0.55) 42%, rgba(7,12,19,0.25) 100%),
      url('assets/images/hero.webp');
    background-size:cover;
    background-position:center 20%;
  }
  .hero-glow{
    position:absolute;
    width:900px; height:900px;
    top:-380px; right:-320px;
    background:radial-gradient(circle, rgba(143,224,238,0.14) 0%, transparent 68%);
    z-index:0;
  }
  .hero .wrap{ position:relative; z-index:2; width:100%; }
  .eyebrow{
    font-size:0.75rem;
    letter-spacing:0.28em;
    color:var(--ice);
    text-transform:uppercase;
    margin-bottom:22px;
    display:flex; align-items:center; gap:12px;
  }
  .eyebrow::before{ content:''; width:28px; height:1px; background:var(--ice); }
  h1{
    font-family:var(--font-display);
    font-weight:400;
    font-size:clamp(2.6rem, 6.4vw, 5.2rem);
    line-height:1.04;
    letter-spacing:-0.01em;
    max-width:820px;
  }
  h1 em{
    font-style:italic;
    font-weight:300;
    color:var(--ice);
  }
  .hero-sub{
    margin-top:26px;
    max-width:520px;
    color:var(--muted);
    font-size:1.05rem;
    font-weight:300;
  }
  .hero-cta{
    margin-top:44px;
    display:flex; gap:18px; flex-wrap:wrap; align-items:center;
  }
  .btn{
    display:inline-block;
    padding:15px 30px;
    font-size:0.85rem;
    letter-spacing:0.03em;
    border-radius:2px;
    transition:all .25s ease;
  }
  .btn-primary{
    background:var(--ice);
    color:var(--bg-0);
    font-weight:600;
  }
  .btn-primary:hover{ background:var(--frost); transform:translateY(-1px); }
  .btn-ghost{
    border:1px solid var(--line);
    color:var(--frost);
  }
  .btn-ghost:hover{ border-color:var(--ice-dim); color:var(--ice); }

  /* the skate-line signature */
  .traceline{
    position:absolute;
    left:0; right:0; bottom:0;
    width:100%; height:auto;
    z-index:1;
    opacity:0.9;
  }
  .traceline path{
    fill:none;
    stroke:var(--ice);
    stroke-width:1.4;
    stroke-linecap:round;
    stroke-dasharray:2400;
    stroke-dashoffset:2400;
    animation:draw 3.4s cubic-bezier(.65,0,.35,1) 0.4s forwards;
    opacity:0.55;
  }
  @keyframes draw{ to{ stroke-dashoffset:0; } }

  .scroll-hint{
    position:absolute; bottom:36px; left:32px;
    font-size:0.7rem; letter-spacing:0.2em; color:var(--muted);
    display:flex; align-items:center; gap:10px; z-index:2;
  }
  .scroll-hint::after{
    content:''; width:1px; height:34px; background:linear-gradient(var(--ice), transparent);
    animation:pulse 2s ease-in-out infinite;
  }
  @keyframes pulse{ 0%,100%{opacity:.3;} 50%{opacity:1;} }

  .photo-credit{
    position:absolute; bottom:36px; right:32px;
    font-size:0.66rem; letter-spacing:0.05em; color:rgba(238,245,248,0.4);
    z-index:2;
  }
  @media (max-width:860px){ .photo-credit{ display:none; } }

  /* ---------- SECTION SHARED ---------- */
  section{ position:relative; padding:130px 0; z-index:2; }
  .section-head{ margin-bottom:64px; max-width:640px; }
  .section-head .eyebrow{ margin-bottom:18px; }
  h2{
    font-family:var(--font-display);
    font-weight:400;
    font-size:clamp(1.9rem, 3.4vw, 2.8rem);
    letter-spacing:-0.01em;
  }
  .section-head p{ color:var(--muted); margin-top:18px; font-weight:300; font-size:1.02rem; }

  .divider{ height:1px; background:var(--line); }

  /* ---------- ABOUT ---------- */
  .about{
    display:grid;
    grid-template-columns:0.9fr 1.1fr;
    gap:80px;
    align-items:center;
  }
  .about-figure{
    aspect-ratio:4/5;
    border-radius:2px;
    background:linear-gradient(150deg, var(--bg-2), var(--bg-1));
    border:1px solid var(--line);
    position:relative;
    overflow:hidden;
    display:flex; align-items:center; justify-content:center;
  }
  .about-figure img{
    width:100%; height:100%;
    object-fit:cover;
    object-position:top center;
    filter:grayscale(0.4) brightness(0.82) contrast(1.08) saturate(0.75);
  }
  .about-figure::before{
    content:'';
    position:absolute; inset:0;
    background:
      linear-gradient(200deg, rgba(7,12,19,0.25) 20%, rgba(7,12,19,0.72) 100%),
      linear-gradient(0deg, rgba(7,12,19,0.55) 0%, transparent 45%),
      linear-gradient(160deg, rgba(20,50,60,0.35), rgba(7,12,19,0.15));
    mix-blend-mode:normal;
    z-index:1;
  }
  .about-figure::after{
    content:'MB';
    position:absolute; bottom:24px; left:24px;
    font-family:var(--font-display);
    font-size:0.9rem;
    color:var(--ice);
    letter-spacing:0.1em;
    z-index:2;
  }
  .about-text p{ color:var(--muted); font-weight:300; margin-bottom:18px; font-size:1.02rem; }
  .about-text strong{ color:var(--frost); font-weight:500; }
  .stat-row{ display:flex; gap:48px; margin-top:38px; }
  .stat{ border-top:1px solid var(--line); padding-top:14px; }
  .stat b{ font-family:var(--font-display); font-size:1.7rem; color:var(--ice); display:block; font-weight:500; }
  .stat span{ font-size:0.78rem; color:var(--muted); letter-spacing:0.03em; }

  /* ---------- SERVICES ---------- */
  .services{
    display:grid;
    grid-template-columns:repeat(3, 1fr);
    gap:1px;
    background:var(--line);
    border:1px solid var(--line);
  }
  .service{
    background:var(--bg-0);
    padding:44px 36px;
    transition:background .3s;
  }
  .service:hover{ background:var(--bg-1); }
  .service .num{
    font-family:var(--font-display);
    font-style:italic;
    color:var(--ice-dim);
    font-size:0.95rem;
    margin-bottom:26px;
    display:block;
  }
  .service h3{
    font-family:var(--font-display);
    font-weight:500;
    font-size:1.3rem;
    margin-bottom:14px;
  }
  .service p{ color:var(--muted); font-size:0.95rem; font-weight:300; }

  /* ---------- CAMP FEATURE ---------- */
  .camp{
    background:var(--bg-1);
    border:1px solid var(--line);
    border-radius:2px;
    padding:64px;
    display:grid;
    grid-template-columns:1.2fr 1fr;
    gap:60px;
    position:relative;
    overflow:hidden;
  }
  .camp::before{
    content:'';
    position:absolute; top:0; right:0; width:340px; height:340px;
    background:radial-gradient(circle, rgba(255,143,102,0.08), transparent 70%);
  }
  .camp-dates{
    font-family:var(--font-display);
    font-size:0.95rem;
    color:var(--ember);
    letter-spacing:0.05em;
    margin-bottom:18px;
  }
  .camp h3{
    font-family:var(--font-display);
    font-weight:400;
    font-size:clamp(1.7rem, 3vw, 2.3rem);
    margin-bottom:20px;
    max-width:420px;
  }
  .camp p.lead{ color:var(--muted); font-weight:300; max-width:440px; margin-bottom:28px; }
  .camp-note{
    font-size:0.85rem;
    color:var(--ice);
    border-left:2px solid var(--ember);
    padding-left:16px;
    margin-bottom:32px;
    max-width:420px;
  }
  .camp-list{ list-style:none; }
  .camp-list li{
    display:flex; justify-content:space-between;
    padding:16px 0;
    border-bottom:1px solid var(--line);
    font-size:0.92rem;
  }
  .camp-list li:first-child{ padding-top:0; }
  .camp-list span:first-child{ color:var(--muted); font-weight:300; }
  .camp-list span:last-child{ color:var(--frost); font-family:var(--font-display); }

  /* ---------- PARTNER ---------- */
  .partner{
    display:flex; align-items:center; justify-content:space-between;
    gap:40px;
    flex-wrap:wrap;
    padding:56px 0;
    border-top:1px solid var(--line);
    border-bottom:1px solid var(--line);
  }
  .partner-text{ max-width:560px; }
  .partner-text .eyebrow{ margin-bottom:14px; }
  .partner-text h3{ font-family:var(--font-display); font-weight:400; font-size:1.6rem; margin-bottom:14px; }
  .partner-text p{ color:var(--muted); font-weight:300; font-size:0.98rem; }
  .partner-text p b{ color:var(--ice); font-weight:500; }

  /* ---------- CONTACT ---------- */
  .contact{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:80px;
  }
  .contact-item{ margin-bottom:30px; }
  .contact-item .label{ font-size:0.72rem; letter-spacing:0.2em; color:var(--ice-dim); text-transform:uppercase; margin-bottom:8px; }
  .contact-item .val{ font-family:var(--font-display); font-size:1.3rem; }
  .contact-item a.val:hover{ color:var(--ice); }
  .map-box{
    border:1px solid var(--line);
    border-radius:2px;
    overflow:hidden;
    aspect-ratio:4/3;
    filter:grayscale(1) invert(0.92) contrast(0.9);
    opacity:0.85;
  }
  .map-box iframe{ width:100%; height:100%; border:0; }
  .social-row{ display:flex; gap:14px; margin-top:36px; }
  .social-btn{
    width:42px; height:42px;
    border:1px solid var(--line);
    border-radius:50%;
    display:flex; align-items:center; justify-content:center;
    transition:all .25s;
  }
  .social-btn:hover{ border-color:var(--ice); color:var(--ice); }

  /* ---------- FOOTER ---------- */
  footer{
    padding:40px 0;
    border-top:1px solid var(--line);
    display:flex; justify-content:space-between; align-items:center;
    flex-wrap:wrap; gap:16px;
    color:var(--muted); font-size:0.8rem;
  }
  footer a:hover{ color:var(--ice); }
  .footer-links{ display:flex; gap:24px; }

  /* reveal animation */
  .reveal{ opacity:0; transform:translateY(24px); transition:opacity .7s ease, transform .7s ease; }
  .reveal.in{ opacity:1; transform:none; }

  @media (prefers-reduced-motion: reduce){
    .traceline path{ animation:none; stroke-dashoffset:0; }
    .reveal{ opacity:1; transform:none; transition:none; }
    .scroll-hint::after{ animation:none; }
  }

  @media (max-width: 860px){
    .wrap{ padding:0 22px; }
    nav{ padding:8px 22px; }
    .brand img{ height:46px; }
    .hero{ padding-top:84px; }

    .menu-toggle{ display:flex; }
    .navlinks{
      position:absolute;
      top:100%; left:0; right:0;
      display:flex;
      flex-direction:column;
      align-items:stretch;
      gap:0;
      background:rgba(7,12,19,0.98);
      backdrop-filter:blur(14px);
      border-bottom:1px solid var(--line);
      padding:6px 22px 22px;
      transform:translateY(-10px);
      opacity:0;
      pointer-events:none;
      transition:transform .3s ease, opacity .25s ease;
      max-height:calc(100vh - 70px);
      overflow-y:auto;
    }
    .navlinks.is-open{
      transform:translateY(0);
      opacity:1;
      pointer-events:auto;
    }
    .navlinks a{
      padding:16px 0;
      border-bottom:1px solid var(--line);
      font-size:1rem;
      color:var(--frost);
    }
    .navlinks a:last-of-type{ border-bottom:none; }
    .navlinks-cta{
      display:block;
      margin-top:14px;
      text-align:center;
      border:1px solid var(--ice-dim) !important;
      border-radius:2px;
      padding:13px !important;
      color:var(--ice) !important;
    }
    .navcta{ display:none; }

    h1{ font-size:clamp(2.2rem, 9vw, 3rem); }
    .hero-sub{ font-size:0.98rem; }
    .hero-cta{ flex-direction:column; align-items:stretch; }
    .hero-cta .btn{ text-align:center; }
    .scroll-hint{ left:22px; bottom:24px; }

    section{ padding:70px 0; }
    .section-head{ margin-bottom:44px; }

    .about, .camp, .contact{ grid-template-columns:1fr; }
    .about{ gap:40px; }
    .stat-row{ flex-wrap:wrap; gap:26px; }

    .services{ grid-template-columns:1fr; }
    .service{ padding:34px 26px; }

    .camp{ padding:32px 22px; gap:36px; }
    .camp-list li{ font-size:0.88rem; }

    .partner{ flex-direction:column; align-items:flex-start; padding:44px 0; }
    .partner-text h3{ font-size:1.35rem; }

    .contact{ gap:44px; }

    footer{ padding:32px 0; }
    footer > .wrap{
      flex-direction:column !important;
      align-items:flex-start !important;
      text-align:left;
      gap:20px !important;
    }
    .footer-links{ gap:18px; }
  }

  @media (max-width:480px){
    .brand span{ display:none; }
    .brand img{ height:40px; }
    .eyebrow{ font-size:0.68rem; letter-spacing:0.22em; }
    h1{ font-size:clamp(2rem, 10vw, 2.6rem); }
    .btn{ padding:14px 22px; font-size:0.82rem; }
    .stat-row{ gap:20px 32px; }
    .stat b{ font-size:1.45rem; }
    .camp-dates{ font-size:0.85rem; }
    .camp h3{ font-size:1.5rem; }
    .contact-item .val{ font-size:1.1rem; }
  }
/* ---------- ERGÄNZUNGEN für mariebangert.de ---------- */
.hero{ background-position:center 30%; }
@media (max-width:860px){
  .hero{ background-image:
    linear-gradient(180deg, rgba(7,12,19,0.12) 0%, rgba(7,12,19,0.30) 60%, rgba(7,12,19,0.85) 100%),
    linear-gradient(90deg, rgba(7,12,19,0.72) 0%, rgba(7,12,19,0.28) 45%, rgba(7,12,19,0.0) 100%),
    url('assets/images/hero-mobile.webp'); }
}
.skip-link{ position:absolute; left:-9999px; top:0; background:var(--ice); color:var(--bg-0); padding:10px 16px; z-index:100; }
.skip-link:focus{ left:16px; top:8px; }
.brand{ min-height:56px; }
.brand .brand-name{ font-family:var(--font-display); font-size:1.35rem; letter-spacing:0; color:var(--frost); font-weight:400; display:inline; }
.brand .brand-name em{ font-style:italic; font-weight:300; color:var(--ice); }

/* Unterseiten (Videos, Impressum) */
.page-head{ padding:170px 0 56px; position:relative; z-index:2; }
.page-head h1{ font-size:clamp(2.2rem, 5vw, 3.6rem); }
.page-body{ padding:0 0 110px; position:relative; z-index:2; }
.entry{ max-width:720px; }
.entry h2{ font-size:1.5rem; margin:44px 0 14px; }
.entry h3{ font-family:var(--font-display); font-weight:500; font-size:1.2rem; margin:30px 0 10px; }
.entry p, .entry li{ color:var(--muted); font-weight:300; margin-bottom:14px; }
.entry a{ color:var(--ice); border-bottom:1px solid var(--line); }
.entry a:hover{ border-bottom-color:var(--ice); }
.entry ul, .entry ol{ padding-left:22px; margin-bottom:14px; }

/* Video-Karten */
.playlists{
  display:grid; grid-template-columns:repeat(3, 1fr);
  gap:1px; background:var(--line); border:1px solid var(--line);
}
.playlist{
  background:var(--bg-0); padding:40px 34px; display:flex; flex-direction:column; gap:10px;
  transition:background .3s;
}
.playlist:hover{ background:var(--bg-1); }
.playlist .year{ font-family:var(--font-display); font-size:2rem; font-weight:400; }
.playlist .meta{ color:var(--muted); font-weight:300; font-size:0.9rem; }
.playlist .go{
  margin-top:16px; font-size:0.78rem; letter-spacing:0.2em; text-transform:uppercase; color:var(--ice);
  display:flex; align-items:center; gap:10px;
}
.playlist .go::after{ content:'\2197'; font-size:1rem; letter-spacing:0; }
.hint{ color:var(--muted); font-size:0.85rem; font-weight:300; margin-top:26px; max-width:560px; }

/* Partner im Fuß */
.footer-partners{ display:flex; align-items:center; gap:22px; flex-wrap:wrap; }
.footer-partners a{ color:var(--muted); font-size:0.8rem; letter-spacing:0.04em; }
.footer-partners a:hover{ color:var(--ice); }

/* Eislaufschule-Hinweis */
.school{
  background:var(--bg-1); border:1px solid var(--line); border-radius:2px;
  padding:56px; display:flex; justify-content:space-between; align-items:center; gap:40px; flex-wrap:wrap;
}
.school h3{ font-family:var(--font-display); font-weight:400; font-size:clamp(1.5rem,2.6vw,2rem); margin-bottom:12px; }
.school p{ color:var(--muted); font-weight:300; max-width:520px; }

@media (max-width:860px){
  .page-head{ padding:120px 0 36px; }
  .playlists{ grid-template-columns:1fr; }
  .playlist{ padding:30px 26px; }
  .school{ padding:32px 22px; }
  .brand .brand-name{ font-size:1.15rem; }
}

/* Menü am Computer rechtsbündig */
@media (min-width:861px){
  .navlinks{ margin-left:auto; margin-right:32px; }
}

/* Falls Elementor-Styles doch geladen werden: Hintergrund bleibt dunkel */
body, body[class*="elementor-kit"]{ background-color:var(--bg-0) !important; color:var(--frost); }

/* Seiten, deren Inhalt die eigene Überschrift mitbringt (z. B. alte Elementor-Inhalte) */
.page-body.no-head{ padding-top:104px; }
.entry .elementor-top-section:has(.elementor-widget-wrap:empty){ display:none; }
.entry h1{ font-family:var(--font-display); font-weight:400; font-size:clamp(2.2rem,5vw,3.6rem); margin-bottom:28px; }
.entry .elementor-section, .entry .elementor-container{ padding-left:0; padding-right:0; }
@media (max-width:860px){ .page-body.no-head{ padding-top:84px; } }
.entry .elementor-element-populated, .entry .elementor-widget-container{ padding:0 !important; margin-top:0 !important; }
.entry .elementor-top-section{ margin:0; padding:0; }
.entry .elementor-widget:not(:last-child){ margin-block-end:0; }
.entry h1:first-child, .entry h1{ margin-top:0; }

/* Einwilligungsbanner */
.consent[hidden]{ display:none; }
.consent{ position:fixed; left:0; right:0; bottom:0; z-index:90; padding:16px; }
.consent-box{
  max-width:760px; margin:0 auto; background:rgba(13,22,32,0.98); border:1px solid var(--line);
  border-radius:2px; padding:26px 28px; backdrop-filter:blur(10px); box-shadow:0 10px 40px rgba(0,0,0,0.5);
}
.consent-box h2{ font-size:1.25rem; margin-bottom:10px; }
.consent-box p{ color:var(--muted); font-weight:300; font-size:0.92rem; margin-bottom:18px; }
.consent-box p a{ color:var(--ice); border-bottom:1px solid var(--line); }
.consent-actions{ display:flex; gap:12px; flex-wrap:wrap; justify-content:flex-end; }
.consent-actions .btn{ cursor:pointer; font-family:inherit; }
.linklike{ background:none; border:0; padding:0; font:inherit; color:inherit; cursor:pointer; }
.linklike:hover{ color:var(--ice); }
@media (max-width:560px){
  .consent-box{ padding:20px 18px; }
  .consent-actions{ flex-direction:column; }
  .consent-actions .btn{ text-align:center; }
}
.consent-actions .btn{ appearance:none; -webkit-appearance:none; background:transparent; color:var(--frost); border:1px solid var(--line); }
.consent-actions .btn:hover{ border-color:var(--ice-dim); color:var(--ice); }
.consent-actions .btn-primary{ background:var(--ice); color:var(--bg-0); border-color:var(--ice); }
.consent-actions .btn-primary:hover{ background:var(--frost); color:var(--bg-0); }