/* Start custom CSS *//* Zusaetzliches CSS fuer "Raetsel-Adventskalender selber machen".
   Design -> Customizer -> Zusaetzliches CSS.
   Alles haengt am Wrapper .rak-anleitung und wirkt nur auf dieser Seite.
   Erzeugt von build.py - nicht von Hand aendern. */

.rak-anleitung{
    --nacht:#152238; --nacht-2:#1e3050; --tanne:#1f4d3d;
    --gold:#c8912a; --gold-hell:#f0c86a;
    --papier:#fbf8f2; --karte:#ffffff; --linie:#e4ddcf;
    --text:#20242c; --text-leise:#5c6472;
    --serif:"Iowan Old Style","Palatino Linotype",Palatino,Georgia,serif;
    --sans:"Segoe UI",Inter,-apple-system,BlinkMacSystemFont,Helvetica,Arial,sans-serif;
  }
.rak-anleitung h1, .rak-anleitung h2, .rak-anleitung h3{font-family:var(--serif);line-height:1.22;letter-spacing:-.005em}
.rak-anleitung h2{font-size:clamp(1.5rem,3.4vw,1.95rem);margin:3.2rem 0 .7rem;color:var(--nacht);
     padding-top:1.6rem;border-top:1px solid var(--linie)}
.rak-anleitung h3{font-size:1.16rem;margin:2rem 0 .5rem;color:var(--tanne)}
.rak-anleitung p{margin:0 0 1.05rem}
.rak-anleitung a{color:#8a2f2a;text-underline-offset:3px}
.rak-anleitung strong{font-weight:650}
.rak-anleitung .antwort{background:var(--karte);border:1px solid var(--linie);border-left:4px solid var(--gold);
      border-radius:4px;padding:22px 24px;margin:2rem 0;font-size:1.06rem}
.rak-anleitung .antwort p:last-child{margin-bottom:0}
.rak-anleitung .fakten{background:var(--karte);border:1px solid var(--linie);border-radius:4px;
      padding:6px 24px;margin:1.8rem 0}
.rak-anleitung .fakten dl{display:grid;grid-template-columns:minmax(150px,34%) 1fr;gap:0;margin:0}
.rak-anleitung .fakten dt{font-weight:650;color:var(--nacht);padding:11px 0;border-bottom:1px solid var(--linie)}
.rak-anleitung .fakten dd{margin:0;padding:11px 0;border-bottom:1px solid var(--linie);color:var(--text-leise)}
.rak-anleitung .fakten dl>dt:last-of-type, .rak-anleitung .fakten dl>dd:last-of-type{border-bottom:0}
.rak-anleitung .tab-scroll{overflow-x:auto;margin:1.4rem 0 1.8rem;-webkit-overflow-scrolling:touch}
.rak-anleitung table{border-collapse:collapse;width:100%;min-width:540px;font-size:.94rem;background:var(--karte)}
.rak-anleitung caption{text-align:left;font-size:.86rem;color:var(--text-leise);padding:0 0 .6rem}
.rak-anleitung th, .rak-anleitung td{text-align:left;padding:11px 13px;border-bottom:1px solid var(--linie);vertical-align:top}
.rak-anleitung thead th{background:var(--nacht);color:#fff;font:650 .86rem/1.35 var(--sans);
      letter-spacing:.02em;border-bottom:0}
.rak-anleitung tbody tr:nth-child(even){background:#faf7f0}
.rak-anleitung td:first-child{font-weight:600;color:var(--nacht)}
.rak-anleitung ol.schritte{list-style:none;counter-reset:s;padding:0;margin:1.6rem 0}
.rak-anleitung ol.schritte>li{counter-increment:s;position:relative;padding:0 0 1.6rem 62px;margin:0}
.rak-anleitung ol.schritte>li::before{content:counter(s);position:absolute;left:0;top:2px;
      width:42px;height:42px;border-radius:50%;background:var(--nacht);color:var(--gold-hell);
      font:650 1.05rem/42px var(--sans);text-align:center}
.rak-anleitung ol.schritte h3{margin:.2rem 0 .4rem}
.rak-anleitung ol.schritte p:last-child{margin-bottom:0}
.rak-anleitung ul.ideen{padding-left:1.15rem;margin:.6rem 0 1.4rem}
.rak-anleitung ul.ideen li{margin-bottom:.62rem}
.rak-anleitung ul.ideen b{color:var(--nacht)}
.rak-anleitung .hinweis{background:#f3f6f2;border:1px solid #d8e2d5;border-radius:4px;
      padding:16px 20px;margin:1.4rem 0;font-size:.96rem}
.rak-anleitung .hinweis p:last-child{margin-bottom:0}
.rak-anleitung .hinweis b{color:var(--tanne)}
.rak-anleitung .angebot{background:linear-gradient(165deg,var(--nacht) 0%,var(--tanne) 175%);
      color:#e9edf4;border-radius:6px;padding:30px 30px 34px;margin:2.6rem 0}
.rak-anleitung .angebot h2{color:#fff;border-top:0;padding-top:0;margin-top:0}
.rak-anleitung .angebot p{color:#c9d3e2}
.rak-anleitung .angebot ul{padding-left:1.15rem;color:#c9d3e2}
.rak-anleitung .angebot li{margin-bottom:.45rem}
.rak-anleitung .angebot a.cta{display:inline-block;background:var(--gold);color:#1a1206;
      font:650 1rem/1 var(--sans);text-decoration:none;padding:15px 26px;border-radius:4px;
      margin-top:.9rem}
.rak-anleitung .preis{font:650 .88rem/1 var(--sans);color:var(--gold-hell);letter-spacing:.05em;
      text-transform:uppercase;margin-bottom:.7rem}
.rak-anleitung .faq details{border-bottom:1px solid var(--linie);background:var(--karte)}
.rak-anleitung .faq details:first-of-type{border-top:1px solid var(--linie)}
.rak-anleitung .faq summary{cursor:pointer;padding:16px 18px;font:650 1.03rem/1.4 var(--serif);
      color:var(--nacht);list-style:none}
.rak-anleitung .faq summary::-webkit-details-marker{display:none}
.rak-anleitung .faq summary::before{content:"+";color:var(--gold);font-family:var(--sans);
      font-weight:700;margin-right:12px}
.rak-anleitung .faq details[open] summary::before{content:"\2212"}
.rak-anleitung .faq .a{padding:0 18px 16px 44px}
.rak-anleitung .faq .a p:last-child{margin-bottom:0}
.rak-anleitung .erfahrung{background:#fdf9ef;border-left:4px solid var(--gold);border-radius:4px;
      padding:20px 24px;margin:1.8rem 0;font-size:1rem}
.rak-anleitung .erfahrung p:last-child{margin-bottom:0}
.rak-anleitung .erfahrung b{color:var(--nacht)}
.rak-anleitung .affil-hinweis{font-size:.84rem;color:var(--text-leise);font-style:italic;
      margin:.2rem 0 1rem}
.rak-anleitung .affil-slot{border:1px dashed #c9bfa8;border-radius:4px;background:#fdfaf3;
      padding:18px 20px;margin:1.4rem 0;font-size:.9rem;color:var(--text-leise)}
.rak-anleitung .affil-slot b{color:var(--nacht);font-style:normal}
.rak-anleitung .autor{background:var(--karte);border:1px solid var(--linie);border-radius:4px;
      padding:20px 22px;margin:2.6rem 0 0;font-size:.94rem;color:var(--text-leise)}
.rak-anleitung .autor b{color:var(--nacht)}
.rak-anleitung .autor p:last-child{margin-bottom:0}
.rak-anleitung .fakten dl{grid-template-columns:1fr}
.rak-anleitung .fakten dt{padding-bottom:0;border-bottom:0}
.rak-anleitung .fakten dd{padding-top:2px}
.rak-anleitung ol.schritte>li{padding-left:52px}
.rak-anleitung ol.schritte>li::before{width:36px;height:36px;line-height:36px;font-size:.95rem}

@media(max-width:560px){
.rak-anleitung .fakten dl{grid-template-columns:1fr}
.rak-anleitung .fakten dt{padding-bottom:0;border-bottom:0}
.rak-anleitung .fakten dd{padding-top:2px}
.rak-anleitung ol.schritte>li{padding-left:52px}
.rak-anleitung ol.schritte>li::before{width:36px;height:36px;line-height:36px;font-size:.95rem}
}/* End custom CSS */