/* Piepsi & Freunde – Bilderbuch-Stil */
@font-face{font-family:"Fraunces";src:url("fonts/fraunces.woff2") format("woff2");font-weight:100 900;font-display:swap}
@font-face{font-family:"Fredoka";src:url("fonts/fredoka.woff2") format("woff2");font-weight:300 700;font-display:swap}
@font-face{font-family:"Nunito";src:url("fonts/nunito.woff2") format("woff2");font-weight:200 1000;font-display:swap}

:root{
  --papier-farbe:#F8F0E0; --papier-2:#F1E5CE; --karte:#FDF8EE;
  --tinte:#3B2A20; --tinte-2:#6E5646;
  --beere:#B94A3F; --beere-dunkel:#9E3C33;
  --taube:#4F729C; --salbei:#6F8F5A; --honig:#D9A441; --honig-hell:#F2D594;
  --abend:#22345A; --abend-2:#1B2948;
  --radius:18px;
  --schatten:0 14px 30px -18px rgba(59,42,32,.55), 0 2px 6px -2px rgba(59,42,32,.12);
  --max:1120px;
  --riss:url("data:image/svg+xml,%3Csvg xmlns=%27http://www.w3.org/2000/svg%27 viewBox=%270 0 1440 24%27 preserveAspectRatio=%27none%27%3E%3Cpath d=%27M0 24 L0.0 7.2 L5.5 7.6 L11.1 8.6 L16.6 7.2 L22.2 5.0 L27.7 3.6 L33.2 5.8 L38.8 4.0 L44.3 6.7 L49.8 5.3 L55.4 6.3 L60.9 8.5 L66.5 6.5 L72.0 7.8 L77.5 5.8 L83.1 5.7 L88.6 5.0 L94.2 3.9 L99.7 5.3 L105.2 5.1 L110.8 4.2 L116.3 6.6 L121.8 5.2 L127.4 6.2 L132.9 5.4 L138.5 6.9 L144.0 8.5 L149.5 6.2 L155.1 5.3 L160.6 6.1 L166.2 6.9 L171.7 8.6 L177.2 8.5 L182.8 11.4 L188.3 10.5 L193.8 8.7 L199.4 10.2 L204.9 9.4 L210.5 10.1 L216.0 7.5 L221.5 5.1 L227.1 5.6 L232.6 4.0 L238.2 5.9 L243.7 4.6 L249.2 6.2 L254.8 7.4 L260.3 5.2 L265.8 6.0 L271.4 5.7 L276.9 4.6 L282.5 4.8 L288.0 4.5 L293.5 4.6 L299.1 5.0 L304.6 7.3 L310.2 7.1 L315.7 6.2 L321.2 10.0 L326.8 11.7 L332.3 10.0 L337.8 9.0 L343.4 5.5 L348.9 4.6 L354.5 3.6 L360.0 3.8 L365.5 4.4 L371.1 5.9 L376.6 4.2 L382.2 4.3 L387.7 3.7 L393.2 7.7 L398.8 6.1 L404.3 3.6 L409.8 4.1 L415.4 5.2 L420.9 6.2 L426.5 3.9 L432.0 3.7 L437.5 6.7 L443.1 7.3 L448.6 5.3 L454.2 5.6 L459.7 5.8 L465.2 4.0 L470.8 7.6 L476.3 8.5 L481.8 9.6 L487.4 7.8 L492.9 5.8 L498.5 4.5 L504.0 5.4 L509.5 6.6 L515.1 10.0 L520.6 10.1 L526.2 8.5 L531.7 7.1 L537.2 9.7 L542.8 9.9 L548.3 11.5 L553.8 9.3 L559.4 11.4 L564.9 11.6 L570.5 11.2 L576.0 10.5 L581.5 11.3 L587.1 12.5 L592.6 11.1 L598.2 9.5 L603.7 13.1 L609.2 11.7 L614.8 13.2 L620.3 12.3 L625.8 9.1 L631.4 13.0 L636.9 14.0 L642.5 13.5 L648.0 12.3 L653.5 11.5 L659.1 11.3 L664.6 9.8 L670.2 9.7 L675.7 7.8 L681.2 9.5 L686.8 9.2 L692.3 8.0 L697.8 6.6 L703.4 6.8 L708.9 6.6 L714.5 4.7 L720.0 5.9 L725.5 5.1 L731.1 6.1 L736.6 5.0 L742.2 4.1 L747.7 6.0 L753.2 7.0 L758.8 7.8 L764.3 8.4 L769.8 9.0 L775.4 8.4 L780.9 9.5 L786.5 10.1 L792.0 10.1 L797.5 12.4 L803.1 11.4 L808.6 10.8 L814.2 8.4 L819.7 7.9 L825.2 9.7 L830.8 7.8 L836.3 6.7 L841.8 10.8 L847.4 9.6 L852.9 7.7 L858.5 10.8 L864.0 8.2 L869.5 8.0 L875.1 6.7 L880.6 6.7 L886.2 8.2 L891.7 5.8 L897.2 6.9 L902.8 6.5 L908.3 7.7 L913.8 4.1 L919.4 5.6 L924.9 3.7 L930.5 6.0 L936.0 5.4 L941.5 6.1 L947.1 5.7 L952.6 3.5 L958.2 5.4 L963.7 6.1 L969.2 6.3 L974.8 5.9 L980.3 5.9 L985.8 4.3 L991.4 6.3 L996.9 3.7 L1002.5 4.1 L1008.0 3.8 L1013.5 3.9 L1019.1 4.2 L1024.6 5.3 L1030.2 4.9 L1035.7 3.8 L1041.2 3.3 L1046.8 5.9 L1052.3 4.7 L1057.8 5.4 L1063.4 7.8 L1068.9 8.9 L1074.5 7.5 L1080.0 9.7 L1085.5 8.6 L1091.1 8.9 L1096.6 7.6 L1102.2 5.1 L1107.7 5.5 L1113.2 3.8 L1118.8 5.8 L1124.3 6.9 L1129.8 4.7 L1135.4 4.7 L1140.9 4.6 L1146.5 6.2 L1152.0 6.9 L1157.5 7.1 L1163.1 4.5 L1168.6 4.4 L1174.2 4.8 L1179.7 4.8 L1185.2 4.1 L1190.8 4.5 L1196.3 3.4 L1201.8 4.0 L1207.4 5.2 L1212.9 6.7 L1218.5 8.3 L1224.0 6.1 L1229.5 7.6 L1235.1 10.1 L1240.6 8.7 L1246.2 9.7 L1251.7 11.3 L1257.2 8.9 L1262.8 9.9 L1268.3 11.1 L1273.8 11.7 L1279.4 11.8 L1284.9 8.7 L1290.5 8.2 L1296.0 7.9 L1301.5 7.5 L1307.1 8.2 L1312.6 6.2 L1318.2 9.6 L1323.7 9.0 L1329.2 8.3 L1334.8 9.8 L1340.3 8.1 L1345.8 8.9 L1351.4 12.2 L1356.9 10.4 L1362.5 11.2 L1368.0 12.1 L1373.5 11.1 L1379.1 10.1 L1384.6 11.3 L1390.2 10.7 L1395.7 9.6 L1401.2 11.6 L1406.8 11.2 L1412.3 11.8 L1417.8 10.6 L1423.4 12.3 L1428.9 14.5 L1434.5 11.1 L1440.0 13.9 L1440 24 Z%27 fill=%27white%27/%3E%3C/svg%3E");
  --hero-maske:url("data:image/svg+xml,%3Csvg xmlns=%27http://www.w3.org/2000/svg%27 viewBox=%270 0 100 100%27 preserveAspectRatio=%27none%27%3E%3Cpolygon points=%272.49,0.00 100.00,0.00 100.00,96.96 99.17,96.51 98.33,95.80 97.50,96.69 96.67,97.80 95.83,96.84 95.00,97.95 94.17,97.68 93.33,96.90 92.50,96.66 91.67,97.18 90.83,97.19 90.00,97.28 89.17,98.54 88.33,97.57 87.50,97.73 86.67,97.97 85.83,98.59 85.00,98.63 84.17,98.13 83.33,97.89 82.50,97.85 81.67,98.13 80.83,96.96 80.00,96.78 79.17,96.98 78.33,97.59 77.50,96.21 76.67,96.04 75.83,96.31 75.00,95.86 74.17,96.34 73.33,96.92 72.50,96.36 71.67,97.10 70.83,97.29 70.00,97.47 69.17,97.12 68.33,97.30 67.50,96.79 66.67,97.38 65.83,96.53 65.00,97.49 64.17,97.65 63.33,98.41 62.50,98.79 61.67,97.37 60.83,96.65 60.00,97.84 59.17,98.18 58.33,98.27 57.50,98.26 56.67,97.88 55.83,98.46 55.00,97.73 54.17,96.98 53.33,97.04 52.50,96.83 51.67,96.20 50.83,96.33 50.00,96.05 49.17,96.90 48.33,95.71 47.50,96.05 46.67,95.76 45.83,95.91 45.00,95.30 44.17,95.75 43.33,95.25 42.50,95.08 41.67,96.31 40.83,95.19 40.00,95.56 39.17,95.63 38.33,95.54 37.50,95.61 36.67,94.80 35.83,95.23 35.00,95.86 34.17,95.31 33.33,95.18 32.50,94.93 31.67,95.69 30.83,95.16 30.00,96.18 29.17,94.76 28.33,96.41 27.50,95.35 26.67,96.39 25.83,97.29 25.00,97.29 24.17,97.81 23.33,98.36 22.50,97.97 21.67,97.77 20.83,97.78 20.00,97.03 19.17,98.12 18.33,97.02 17.50,96.83 16.67,97.46 15.83,98.10 15.00,98.02 14.17,98.21 13.33,98.18 12.50,97.85 11.67,97.30 10.83,96.85 10.00,97.88 9.17,97.14 8.33,97.01 7.50,96.79 6.67,96.16 5.83,95.73 5.00,95.99 4.17,97.14 3.33,96.34 2.50,96.71 1.67,97.15 0.83,98.68 0.00,98.68 2.49,100.00 2.72,99.17 2.05,98.33 1.56,97.50 1.77,96.67 2.49,95.83 3.14,95.00 2.98,94.17 2.20,93.33 2.00,92.50 1.77,91.67 1.39,90.83 1.82,90.00 1.74,89.17 1.61,88.33 2.65,87.50 2.77,86.67 2.70,85.83 3.49,85.00 3.18,84.17 2.57,83.33 2.77,82.50 2.59,81.67 1.70,80.83 1.65,80.00 2.16,79.17 2.51,78.33 2.76,77.50 2.98,76.67 2.81,75.83 3.45,75.00 3.92,74.17 3.14,73.33 3.65,72.50 3.80,71.67 3.90,70.83 3.77,70.00 3.80,69.17 3.88,68.33 3.27,67.50 3.56,66.67 2.96,65.83 4.14,65.00 3.33,64.17 2.91,63.33 2.71,62.50 2.54,61.67 3.18,60.83 3.07,60.00 3.06,59.17 2.75,58.33 2.16,57.50 2.60,56.67 3.04,55.83 3.12,55.00 2.87,54.17 2.92,53.33 3.83,52.50 3.56,51.67 3.59,50.83 3.86,50.00 3.54,49.17 4.22,48.33 4.29,47.50 3.75,46.67 3.19,45.83 3.68,45.00 4.17,44.17 4.21,43.33 3.97,42.50 3.61,41.67 3.40,40.83 3.04,40.00 2.54,39.17 3.09,38.33 2.07,37.50 2.55,36.67 2.10,35.83 2.03,35.00 2.18,34.17 2.91,33.33 3.23,32.50 2.70,31.67 3.67,30.83 2.84,30.00 3.41,29.17 2.94,28.33 3.73,27.50 2.62,26.67 2.76,25.83 2.79,25.00 3.62,24.17 3.16,23.33 3.81,22.50 3.74,21.67 3.86,20.83 3.78,20.00 3.10,19.17 2.97,18.33 3.63,17.50 2.71,16.67 2.87,15.83 1.63,15.00 1.43,14.17 2.35,13.33 2.73,12.50 2.68,11.67 2.82,10.83 2.33,10.00 2.84,9.17 2.64,8.33 1.95,7.50 1.99,6.67 2.34,5.83 2.99,5.00 3.35,4.17 3.40,3.33 2.89,2.50 3.12,1.67 2.26,0.83 2.45,0.00%27 fill=%27white%27/%3E%3C/svg%3E");
  --hero-maske-m:url("data:image/svg+xml,%3Csvg xmlns=%27http://www.w3.org/2000/svg%27 viewBox=%270 0 100 100%27 preserveAspectRatio=%27none%27%3E%3Cpolygon points=%270.00,0.00 100.00,0.00 100.00,97.31 98.89,97.27 97.78,97.03 96.67,98.35 95.56,97.01 94.44,97.20 93.33,97.95 92.22,98.30 91.11,99.18 90.00,97.98 88.89,98.06 87.78,97.17 86.67,97.49 85.56,97.72 84.44,97.08 83.33,96.19 82.22,96.21 81.11,97.01 80.00,97.51 78.89,97.01 77.78,96.54 76.67,96.86 75.56,97.99 74.44,97.98 73.33,97.23 72.22,97.47 71.11,98.20 70.00,99.24 68.89,99.01 67.78,97.97 66.67,97.40 65.56,97.90 64.44,98.44 63.33,97.11 62.22,97.12 61.11,96.71 60.00,96.10 58.89,95.92 57.78,95.63 56.67,96.13 55.56,96.17 54.44,95.28 53.33,95.83 52.22,96.58 51.11,95.84 50.00,95.84 48.89,95.60 47.78,95.94 46.67,96.95 45.56,96.75 44.44,95.71 43.33,95.38 42.22,95.99 41.11,95.73 40.00,95.97 38.89,96.02 37.78,96.07 36.67,96.03 35.56,95.88 34.44,96.11 33.33,96.36 32.22,96.06 31.11,96.02 30.00,96.39 28.89,95.57 27.78,95.16 26.67,95.96 25.56,96.37 24.44,96.05 23.33,96.33 22.22,96.88 21.11,96.64 20.00,96.90 18.89,97.27 17.78,97.14 16.67,98.32 15.56,98.02 14.44,98.62 13.33,98.86 12.22,98.82 11.11,99.36 10.00,99.16 8.89,99.23 7.78,98.98 6.67,98.61 5.56,98.51 4.44,98.17 3.33,96.61 2.22,97.01 1.11,95.88 0.00,95.16%27 fill=%27white%27/%3E%3C/svg%3E");
  --papier:url("data:image/svg+xml,%3Csvg xmlns=%27http://www.w3.org/2000/svg%27 width=%27220%27 height=%27220%27%3E%3Cfilter id=%27n%27%3E%3CfeTurbulence type=%27fractalNoise%27 baseFrequency=%27.85%27 numOctaves=%273%27 stitchTiles=%27stitch%27/%3E%3CfeColorMatrix values=%270 0 0 0 .42 0 0 0 0 .32 0 0 0 0 .2 0 0 0 .09 0%27/%3E%3C/filter%3E%3Crect width=%27100%25%27 height=%27100%25%27 filter=%27url%28%23n%29%27/%3E%3C/svg%3E");
}
*{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
body{margin:0;color:var(--tinte);font-family:"Nunito",system-ui,sans-serif;font-size:18px;line-height:1.6;
  background-color:var(--papier-farbe);
  background-image:var(--papier),radial-gradient(1200px 600px at 10% 0%,rgba(255,255,255,.55),transparent 70%),radial-gradient(900px 700px at 100% 40%,rgba(226,196,150,.25),transparent 70%)}
img{max-width:100%;height:auto;display:block}
a{color:var(--taube)}
h1,h2,h3{font-family:"Fraunces",Georgia,serif;font-weight:650;font-variation-settings:"SOFT" 100;line-height:1.12;margin:0 0 .4em;color:var(--tinte);letter-spacing:-.01em;overflow-wrap:break-word;hyphens:auto}
h1{font-size:clamp(2.1rem,5.6vw,3.7rem)}
h2{font-size:clamp(1.8rem,4.4vw,2.6rem)}
h3{font-size:1.32rem;font-weight:600}
p{margin:0 0 1em}
.wrap{max-width:var(--max);margin:0 auto;padding:0 20px;position:relative}
.nw{white-space:nowrap}
.skip{position:absolute;left:-999px;top:8px;background:#fff;padding:8px 14px;border-radius:8px;z-index:100}
.skip:focus{left:8px}
:focus-visible{outline:3px solid var(--honig);outline-offset:3px}
section[id],article[id]{scroll-margin-top:76px}
.season-alm .w,.season-winter .s{display:none!important}

/* Doodles */
.doodle{position:absolute;pointer-events:none;color:#A88A6A;opacity:.75;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.doodle.gold{color:var(--honig);opacity:.9}
.doodle.hell{color:#E9DCC0;opacity:.45}
@media (max-width:860px){.doodle.desk{display:none}}

/* Kopf */
.kopf{position:sticky;top:0;z-index:50;background:rgba(248,240,224,.92);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);border-bottom:1px solid rgba(59,42,32,.08)}
.kopf .wrap{display:flex;align-items:center;justify-content:space-between;height:66px}
.logo{display:flex;align-items:center;gap:8px;text-decoration:none;font-family:"Fredoka",sans-serif;font-weight:600;font-size:1.65rem;line-height:1;white-space:nowrap}
.logo .p{color:var(--beere)} .logo .f{color:var(--abend)}
.logo svg{width:38px;height:24px;flex:none}
.nav{display:flex;gap:4px}
.nav a{font-family:"Fraunces",Georgia,serif;font-variation-settings:"SOFT" 100;font-weight:500;color:var(--tinte);text-decoration:none;padding:8px 14px;border-radius:999px;font-size:1.04rem}
.nav a:hover{background:rgba(59,42,32,.06)}
.menu-btn{display:none;background:none;border:0;padding:10px;margin-right:-10px;cursor:pointer;color:var(--tinte)}
.menu-btn svg{width:28px;height:28px}
@media (max-width:860px){
  .menu-btn{display:block}
  .nav{display:none;position:absolute;top:66px;left:0;right:0;flex-direction:column;gap:0;background:var(--papier-farbe);border-bottom:1px solid rgba(59,42,32,.1);padding:8px 12px 16px;box-shadow:var(--schatten)}
  .nav.offen{display:flex}
  .nav a{padding:14px 12px;font-size:1.15rem;border-radius:12px}
}

/* Buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:52px;padding:12px 26px;border-radius:999px;font-family:"Fraunces",Georgia,serif;font-variation-settings:"SOFT" 100;font-weight:600;font-size:1.1rem;text-decoration:none;border:1.5px solid transparent;cursor:pointer;transition:transform .15s ease,background-color .15s ease}
.btn svg{width:20px;height:20px;flex:none}
.btn:active{transform:scale(.98)}
.btn-rot{background:var(--beere);color:#fff}.btn-rot:hover{background:var(--beere-dunkel)}
.btn-blau{background:var(--taube);color:#fff}.btn-blau:hover{background:#41628a}
.btn-honig{background:var(--honig);color:var(--tinte)}.btn-honig:hover{background:#cb963a}
.btn-linie{background:transparent;color:var(--tinte);border-color:var(--tinte)}.btn-linie:hover{background:rgba(59,42,32,.06)}
.dunkel .btn-linie{color:#F8F0E0;border-color:rgba(248,240,224,.8)}.dunkel .btn-linie:hover{background:rgba(255,255,255,.08)}
.btn-klein{min-height:46px;padding:10px 20px;font-size:1rem}
.btn-bald{background:var(--papier-2);color:var(--tinte-2);cursor:default}
.dunkel .btn-bald{background:var(--honig-hell);color:var(--tinte)}

/* Hero */
.hero{position:relative}
.hero .bild{position:relative}
.hero .bild img{width:100%;aspect-ratio:4/3;object-fit:cover;object-position:46% 50%;-webkit-mask:var(--hero-maske-m) center/100% 100% no-repeat;mask:var(--hero-maske-m) center/100% 100% no-repeat}
.hero .neu-pille{position:absolute;left:16px;bottom:22px;display:inline-flex;align-items:center;gap:8px;background:var(--honig-hell);color:var(--tinte);font-family:"Fraunces",Georgia,serif;font-variation-settings:"SOFT" 100;font-weight:600;padding:8px 16px;border-radius:999px;text-decoration:none;box-shadow:var(--schatten);font-size:1rem;z-index:2}
.hero .text{display:none}
.hero .kicker{font-family:"Fraunces",Georgia,serif;font-variation-settings:"SOFT" 100;font-style:normal;font-weight:600;color:#B9842A;font-size:1.5rem;margin-bottom:.15em}
.hero h1 .r{color:var(--beere)}
.nur-winter{display:none}
.season-winter .nur-winter{display:block}
.season-alm .hero-winter,.season-winter .hero-alm{display:none}
@media (min-width:861px){
  .hero{min-height:600px;display:flex;align-items:center;overflow:hidden}
  .hero .bild{position:absolute;top:0;bottom:0;right:0;width:min(56%,calc(100% - 470px));max-width:1000px}
  .hero .bild img{height:100%;aspect-ratio:auto;object-position:50% 40%;-webkit-mask-image:var(--hero-maske);mask-image:var(--hero-maske)}
  .hero .neu-pille{display:none}
  .hero .text{display:block;position:relative;z-index:2;max-width:var(--max);margin:0 auto;padding:60px 20px 80px;width:100%}
  .hero .text > div{max-width:440px}
  .hero h1.zweizeilig{font-size:clamp(2rem,2.75vw,2.6rem)}
  .hero h1.zweizeilig span{display:block;white-space:nowrap}
  .hero h1{font-size:clamp(2.4rem,3.7vw,3.4rem)}
  .hero .sub{font-size:1.2rem;color:var(--tinte-2);margin-bottom:28px}
  .hero .knoepfe{display:flex;gap:12px;flex-wrap:wrap}
  .hero .knoepfe .btn{padding:12px 22px}
}
.schnee{position:absolute;inset:0;pointer-events:none;overflow:hidden;-webkit-mask-image:var(--hero-maske);mask-image:var(--hero-maske)}
.schnee i{position:absolute;top:-10px;width:6px;height:6px;border-radius:50%;background:#fff;opacity:.8;animation:fall linear infinite}
@keyframes fall{to{transform:translate3d(30px,110vh,0)}}
@media (max-width:860px){.schnee{-webkit-mask-image:var(--hero-maske-m);mask-image:var(--hero-maske-m)}}
@media (prefers-reduced-motion:reduce){.schnee{display:none}}

/* Titel mit Zweigen */
.titel{display:inline-flex;align-items:center;gap:14px}
.titel svg{width:34px;height:34px;flex:none;color:var(--beere);opacity:.8;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.titel svg.r{transform:scaleX(-1)}
@media (max-width:520px){.titel svg{display:none}}
.herzchen{display:block;margin:-4px auto 14px;width:44px;color:var(--beere)}

/* Begrüßung + Bildkarten */
.hallo{padding:20px 0 56px;text-align:center;position:relative}
.hallo p.intro{color:var(--tinte-2);margin-bottom:26px}
.karten{display:grid;gap:12px;max-width:480px;margin:0 auto;text-align:left}
.karte{display:flex;align-items:center;gap:14px;padding:8px 14px 8px 8px;background:var(--karte);border:1px solid rgba(59,42,32,.1);border-radius:14px;box-shadow:var(--schatten);text-decoration:none;color:var(--tinte);transition:transform .2s ease,box-shadow .2s ease}
.karte img{width:76px;height:76px;object-fit:cover;border-radius:10px;flex:none;border:3px solid #fff;box-shadow:0 1px 3px rgba(59,42,32,.18)}
.karte .label{display:flex;align-items:center;gap:10px;font-family:"Fraunces",Georgia,serif;font-variation-settings:"SOFT" 100;font-weight:600;font-size:1.2rem;flex:1}
.karte .label svg{width:22px;height:22px;flex:none}
.karte .pfeil{width:20px;height:20px;color:var(--tinte-2);flex:none}
@media (max-width:860px){.karte .label{font-size:1.1rem}.karte .label svg{display:none}}
.k-rot .label{color:var(--beere)} .k-blau .label{color:var(--taube)} .k-gruen .label{color:var(--salbei)}
@media (min-width:861px){
  .karten{grid-template-columns:repeat(3,1fr);gap:28px;max-width:900px}
  .karte{flex-direction:column;align-items:stretch;padding:10px 10px 16px;gap:12px;border-radius:6px}
  .karte img{width:100%;height:auto;aspect-ratio:4/3;border-radius:3px;border:0;box-shadow:none}
  .karte .label{justify-content:center;font-size:1.22rem}
  .karte .pfeil{display:none}
  .karte:nth-child(1){transform:rotate(-1.4deg)} .karte:nth-child(2){transform:rotate(.8deg)} .karte:nth-child(3){transform:rotate(-.6deg)}
}
@media (hover:hover){.karte:hover{transform:translateY(-4px) rotate(0)!important;box-shadow:0 22px 40px -20px rgba(59,42,32,.6)}}

/* Abschnitte */
.abschnitt{padding:72px 0;position:relative}
.abschnitt .einleitung{max-width:640px;color:var(--tinte-2);margin-bottom:32px}
.mitte{text-align:center}.mitte .einleitung{margin-left:auto;margin-right:auto}
.riss{position:relative}
.riss::before,.riss::after{content:"";position:absolute;left:0;right:0;height:22px;background:var(--bg);-webkit-mask:var(--riss) center/100% 100% no-repeat;mask:var(--riss) center/100% 100% no-repeat;pointer-events:none}
.riss::before{top:-21px}
.riss::after{bottom:-21px;transform:scaleY(-1) scaleX(-1)}
.riss-nur-oben::after{display:none}
.getoent{--bg:var(--papier-2);background:var(--bg)}

/* Advent */
.dunkel{--bg:var(--abend);background-color:var(--abend);background-image:var(--papier),radial-gradient(600px 400px at 85% 20%,rgba(242,213,148,.14),transparent 70%);color:#E8E0D0}
.dunkel h2{color:#FBF4E6}
.advent .raster{display:grid;grid-template-columns:minmax(0,1fr);gap:40px;align-items:center}
.foto{position:relative;background:#FBF6EC;padding:12px 12px 14px;border-radius:3px;box-shadow:0 24px 40px -18px rgba(0,0,0,.6);transform:rotate(-2deg);max-width:440px;margin:0 auto}
.foto img{width:100%;border-radius:2px}
.foto::before{content:"";position:absolute;top:-14px;left:50%;width:110px;height:30px;margin-left:-55px;background:rgba(232,214,170,.82);transform:rotate(-4deg);box-shadow:0 1px 2px rgba(0,0,0,.15)}
.badge{display:inline-block;background:var(--honig-hell);color:var(--tinte);font-family:"Fraunces",Georgia,serif;font-variation-settings:"SOFT" 100;font-weight:600;border-radius:999px;padding:3px 14px;margin-bottom:12px;font-size:.98rem}
.merkmale{list-style:none;padding:0;margin:22px 0 28px;display:grid;gap:14px}
.merkmale li{display:flex;gap:14px;align-items:center}
.merkmale .ic{flex:none;width:44px;height:44px;border-radius:50%;display:grid;place-items:center;color:#FBF4E6;border:1.5px solid rgba(248,240,224,.35)}
.merkmale .ic svg{width:22px;height:22px}
.merkmale strong{display:block;font-family:"Fraunces",Georgia,serif;font-variation-settings:"SOFT" 100;font-weight:600;color:#FBF4E6;font-size:1.06rem}
.merkmale span{font-size:.96rem;opacity:.82}
.ic-1{background:rgba(185,74,63,.55)} .ic-2{background:rgba(79,114,156,.6)} .ic-3{background:rgba(217,164,65,.55)}
.knoepfe-zeile{display:flex;flex-wrap:wrap;gap:12px}
@media (min-width:861px){.advent .raster{grid-template-columns:minmax(0,5fr) minmax(0,6fr);gap:64px}}

/* Bücher */
.buecher{display:grid;gap:32px}
.buch{background:var(--karte);border:1px solid rgba(59,42,32,.1);border-radius:8px;padding:12px;box-shadow:var(--schatten);display:flex;flex-direction:column}
.buch img{width:100%;aspect-ratio:1;object-fit:cover;border-radius:3px}
.buch .inhalt{padding:20px 10px 12px;display:flex;flex-direction:column;flex:1}
.buch .band{font-family:"Fraunces",Georgia,serif;font-variation-settings:"SOFT" 100;font-style:italic;font-weight:500;color:var(--beere);font-size:1rem}
.buch h3{margin:.15em 0 .5em;font-size:1.45rem}
.buch p{font-size:1rem;color:var(--tinte-2)}
.tags{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 16px;padding:0;list-style:none}
.tags li{border:1px solid rgba(59,42,32,.18);border-radius:999px;padding:3px 12px;font-size:.86rem;font-weight:600;color:var(--tinte-2)}
.fakten{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin:0 0 16px;padding:12px 0;border-top:1px dashed rgba(59,42,32,.22);border-bottom:1px dashed rgba(59,42,32,.22)}
.fakten div{text-align:center}
.fakten dt{font-size:.76rem;text-transform:uppercase;letter-spacing:.07em;color:var(--tinte-2)}
.fakten dd{margin:0;font-weight:700;font-size:.97rem}
.buch .preis{font-family:"Fraunces",Georgia,serif;font-variation-settings:"SOFT" 100;font-weight:650;font-size:1.7rem;color:var(--tinte);margin:0 0 14px}
.buch .aktionen{margin-top:auto;display:flex;flex-wrap:wrap;gap:10px}
@media (min-width:700px){.buecher{grid-template-columns:repeat(2,1fr);max-width:940px;margin:0 auto}.buch:nth-child(1){transform:rotate(-.6deg)}.buch:nth-child(2){transform:rotate(.6deg)}}
.hinweis-klein{font-size:.92rem;color:var(--tinte-2);margin-top:32px}

/* Blick ins Buch */
.tabs{display:inline-flex;flex-wrap:wrap;justify-content:center;gap:6px;background:var(--papier-2);padding:5px;border-radius:999px;margin-bottom:30px}
.tabs button{font:inherit;font-family:"Fraunces",Georgia,serif;font-variation-settings:"SOFT" 100;font-weight:600;font-size:1rem;border:0;background:transparent;color:var(--tinte-2);padding:10px 18px;border-radius:999px;cursor:pointer;min-height:44px}
.tabs button[aria-selected=true]{background:var(--tinte);color:#FBF4E6}
@media (max-width:420px){.tabs button{padding:10px 14px;font-size:.98rem}}
.karussell{position:relative}
.spur{display:flex;gap:18px;overflow-x:auto;scroll-snap-type:x mandatory;scroll-padding:0 20px;padding:10px 20px 22px;margin:0 -20px;scrollbar-width:none;-webkit-overflow-scrolling:touch}
.spur::-webkit-scrollbar{display:none}
.seite{flex:0 0 82%;max-width:420px;margin:0;scroll-snap-align:start;background:var(--karte);border:1px solid rgba(59,42,32,.1);border-radius:6px;padding:10px;box-shadow:var(--schatten)}
.seite img{width:100%;aspect-ratio:1;object-fit:cover;border-radius:2px}
.seite figcaption{padding:14px 8px 6px;display:flex;flex-direction:column;gap:8px}
.seite figcaption:has(blockquote){min-height:116px}
.seite blockquote{margin:0;font-family:"Fraunces",Georgia,serif;font-variation-settings:"SOFT" 100;font-weight:450;font-size:1.1rem;line-height:1.45;color:var(--tinte)}
.seite .szene{font-family:"Fraunces",Georgia,serif;font-variation-settings:"SOFT" 100;font-weight:600;font-size:1.15rem}
.seite-ende{display:flex;background:var(--papier-2);border-style:dashed}
.ende-inhalt{display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:10px;padding:14px 12px 18px;width:100%}
.ende-inhalt img{width:72%;aspect-ratio:4/3;object-fit:cover;border-radius:4px;border:5px solid #fff;box-shadow:var(--schatten);transform:rotate(-2deg);margin-bottom:8px}
.ende-titel{font-family:"Fraunces",Georgia,serif;font-variation-settings:"SOFT" 100;font-weight:650;font-size:1.35rem;margin:0}
.ende-inhalt p{margin:0;color:var(--tinte-2);font-size:1rem}
.ende-inhalt .btn{margin-top:8px}
.pfeil-btn{display:none}
@media (min-width:861px){
  .seite{flex-basis:calc((100% - 36px)/3)}
  .pfeil-btn{display:grid;place-items:center;position:absolute;top:38%;width:52px;height:52px;border-radius:50%;border:1px solid rgba(59,42,32,.15);background:var(--karte);color:var(--tinte);box-shadow:var(--schatten);cursor:pointer}
  .pfeil-btn svg{width:24px;height:24px}
  .zurueck-btn{left:-26px}.weiter-btn{right:-26px}
}

/* Medien */
.medien{display:grid;gap:30px}
.medium{background:var(--karte);border:1px solid rgba(59,42,32,.1);border-radius:8px;padding:12px;box-shadow:var(--schatten)}
.medium video,.medium > img{width:100%;height:auto;aspect-ratio:1;object-fit:cover;background:#000;display:block;border-radius:3px}
.medium .inhalt{padding:18px 8px 6px}
.medium audio{width:100%;margin-top:6px}
.ki-hinweis{font-size:.88rem;color:var(--tinte-2);margin-top:22px;font-style:italic}
@media (min-width:861px){.medien{grid-template-columns:repeat(2,1fr)}}

/* Figuren */
.figuren{display:grid;grid-template-columns:repeat(2,1fr);gap:30px 18px}
.figur{text-align:center}
.figur img{width:100%;max-width:170px;aspect-ratio:1;object-fit:cover;border-radius:50%;margin:0 auto 12px;border:6px solid #FDF8EE;box-shadow:var(--schatten);transition:transform .3s ease}
.figur:nth-child(odd) img{transform:rotate(-2deg)} .figur:nth-child(even) img{transform:rotate(2deg)}
.figur h3{margin-bottom:.15em;font-size:1.3rem}
.figur p{font-size:.95rem;color:var(--tinte-2);margin:0}
@media (min-width:700px){.figuren{grid-template-columns:repeat(3,1fr);gap:44px 28px}}
@media (hover:hover){.figur:hover img{transform:scale(1.04) rotate(-3deg)}}

/* Autor */
.autor{display:grid;gap:36px;align-items:center}
@media (min-width:861px){.autor{grid-template-columns:5fr 6fr;gap:64px}}

/* Fuß */
.fuss{--bg:var(--abend);background:var(--abend);color:#CFC6B6;padding:44px 0 52px;font-size:.98rem;margin-top:22px}
.fuss .wrap{display:flex;flex-wrap:wrap;gap:20px;justify-content:space-between;align-items:center}
.fuss a{color:#FBF4E6;text-decoration:none}
.fuss a:hover{text-decoration:underline}
.fuss .links{display:flex;flex-wrap:wrap;gap:6px 20px}
.fuss .logo{font-size:1.4rem}.fuss .logo .f{color:#FBF4E6}

/* Rechtsseiten */
.recht{padding:48px 0 72px}
.recht .wrap{max-width:760px}
.recht h1{font-size:clamp(1.9rem,5vw,2.6rem)}
.recht h2{font-size:1.35rem;margin-top:1.6em}
.platzhalter{background:#F6DD97;border-radius:4px;padding:0 4px}
.zurueck{display:inline-block;margin-bottom:24px;font-weight:700}

/* Animationen */
.buch,.medium,.seite{transition:transform .25s ease,box-shadow .25s ease}
@media (hover:hover){
  .buch:hover,.medium:hover,.js .buch.reveal.sichtbar:hover,.js .medium.reveal.sichtbar:hover{transform:translateY(-4px) rotate(0);box-shadow:0 24px 44px -20px rgba(59,42,32,.6)}
}
.js .reveal{opacity:0;translate:0 18px;transition:opacity .6s ease,translate .6s ease}
.js .reveal.sichtbar{opacity:1;translate:0 0}
@media (prefers-reduced-motion:reduce){
  .js .reveal{opacity:1;translate:none;transition:none}
  .buch,.medium,.seite,.figur img,.karte{transition:none}
}

/* Band 3 / Weihnachten */
.nur-nikolaus{display:none}
.season-winter.nikolaus .nur-nikolaus{display:block}
.auch-neu{margin-top:56px;padding-top:40px;border-top:1px dashed rgba(248,240,224,.3);display:grid;grid-template-columns:minmax(0,1fr);gap:24px;align-items:center}
.auch-neu h3{color:#FBF4E6;font-size:1.5rem}
.foto-klein{max-width:260px;padding:8px 8px 10px;transform:rotate(2deg)}
.foto-klein::before{width:70px;margin-left:-35px;height:22px;top:-10px}
@media (min-width:861px){.auch-neu{grid-template-columns:260px minmax(0,1fr);gap:48px;max-width:860px;margin-left:auto;margin-right:auto}}
@media (min-width:1000px){.buecher.drei{grid-template-columns:repeat(3,1fr);max-width:none}}
@media (min-width:1000px){.medien-3{grid-template-columns:repeat(3,1fr)}}
.medium .band{font-family:"Fraunces",Georgia,serif;font-variation-settings:"SOFT" 100;font-style:italic;color:var(--beere);font-size:.98rem}
.medium h3{font-size:1.2rem;margin:.1em 0 0}
.gaeste-titel{margin:64px 0 28px;font-size:1.6rem}
.fuss a[href^="mailto"]{color:#E9DCC0}
@media (min-width:1000px){.buecher.drei .fakten dd{font-size:.86rem;white-space:nowrap}.buecher.drei .fakten dt{font-size:.7rem}.buecher.drei .buch h3{font-size:1.3rem}}

/* Trailer-Player */
.player{position:relative;border-radius:3px;overflow:hidden;background:#000;aspect-ratio:1}
.player video{width:100%;height:100%;display:block;object-fit:cover}
.play-gross{position:absolute;inset:0;border:0;background:transparent;cursor:pointer;display:grid;place-items:center;padding:0;-webkit-tap-highlight-color:transparent}
.play-gross span{width:92px;height:92px;border-radius:50%;display:grid;place-items:center;background:rgba(253,248,238,.94);color:var(--beere);box-shadow:0 10px 30px -8px rgba(0,0,0,.45);transition:opacity .25s ease,transform .2s ease}
.play-gross svg{width:44px;height:44px;grid-area:1/1}
.play-gross .i-play{margin-left:5px}
.play-gross .i-pause,.play-gross .i-neu{display:none}
.player.spielt .play-gross .i-play{display:none}
.player.spielt .play-gross .i-pause{display:block}
.player.ende .play-gross .i-play{display:none}
.player.ende .play-gross .i-neu{display:block}
.player.spielt .play-gross span{opacity:0}
.player.spielt.aktiv .play-gross span,.player.spielt .play-gross:focus-visible span{opacity:.9}
@media (hover:hover){.play-gross:hover span{transform:scale(1.06)}}
.fortschritt{position:absolute;left:0;right:0;bottom:0;height:5px;background:rgba(253,248,238,.35)}
.fortschritt i{display:block;height:100%;width:0;background:var(--beere);transition:width .25s linear}
@media (prefers-reduced-motion:reduce){.play-gross span,.fortschritt i{transition:none}}
.tabs{flex-wrap:nowrap}
@media (max-width:420px){.tabs button{padding:9px 12px;font-size:.95rem}}
.skip-btn{position:absolute;top:50%;width:56px;height:56px;margin-top:-28px;border:0;border-radius:50%;display:grid;place-items:center;padding:0;cursor:pointer;background:rgba(253,248,238,.82);color:var(--tinte);box-shadow:0 8px 22px -8px rgba(0,0,0,.45);transition:opacity .25s ease,transform .2s ease;z-index:2;-webkit-tap-highlight-color:transparent}
.skip-btn svg{width:32px;height:32px}
.skip-zurueck{left:calc(50% - 46px - 18px - 56px)}
.skip-vor{left:calc(50% + 46px + 18px)}
.player:not(.spielt):not(.ende):not(.pausiert) .skip-btn{opacity:0;pointer-events:none}
.player.spielt .skip-btn{opacity:0}
.player.spielt.aktiv .skip-btn{opacity:.95}
.player.pausiert .skip-btn{opacity:.95;pointer-events:auto}
@media (hover:hover){.skip-btn:hover{transform:scale(1.07)}}
@media (max-width:380px){.skip-btn{width:48px;height:48px;margin-top:-24px}.skip-btn svg{width:28px;height:28px}.skip-zurueck{left:calc(50% - 46px - 12px - 48px)}.skip-vor{left:calc(50% + 46px + 12px)}}

/* Hero Weihnachten mit Cover */
.hero-foto .bild img{aspect-ratio:1;object-position:50% 50%}
.hero-titel{font-size:clamp(2.2rem,3.6vw,3.3rem)}
@media (min-width:861px){
  .hero-foto{min-height:640px}
  .hero-foto .bild{position:absolute;top:0;bottom:0;right:0;left:auto;width:min(56%,calc(100% - 480px));max-width:none;display:flex;align-items:center;justify-content:center;padding:40px 4% 40px 0}
  .hero-foto .foto-hero{position:relative;background:#FBF6EC;padding:14px 14px 18px;border-radius:3px;box-shadow:0 26px 50px -22px rgba(59,42,32,.6);transform:rotate(1.6deg);width:min(100%,540px)}
  .hero-foto .foto-hero::before{content:"";position:absolute;top:-16px;left:50%;width:130px;height:34px;margin-left:-65px;background:rgba(232,214,170,.85);transform:rotate(-3deg);box-shadow:0 1px 2px rgba(0,0,0,.15);z-index:1}
  .hero-foto .foto-hero img{width:100%;height:auto;aspect-ratio:1;-webkit-mask:none;mask:none;border-radius:2px}
  .hero-foto .text > div{max-width:440px}
}
.seite-cover figcaption{gap:2px}
.seite-cover .band{font-family:"Fraunces",Georgia,serif;font-variation-settings:"SOFT" 100;font-style:italic;color:var(--beere);font-size:.98rem}
.unterschrift{margin:1.4em 0 1.2em}
.unterschrift img{display:block;width:min(300px,80%);height:auto;filter:brightness(.55) sepia(.4)}
.unterschrift-ort{display:block;margin-top:.3em;font-size:.9rem;color:var(--tinte-2)}
.hinweis-autor{font-size:.92rem;color:var(--tinte-2)}
@media (max-width:860px){.unterschrift{text-align:center}.unterschrift img{margin:0 auto}}

/* Kontaktformular */
.kontakt{display:grid;gap:32px;align-items:start}
@media (min-width:861px){.kontakt{grid-template-columns:5fr 6fr;gap:64px}}
.kontakt-text p{color:var(--tinte-2)}
.kontakt-form{background:var(--karte);border-radius:var(--radius);box-shadow:var(--schatten);padding:28px 24px;display:grid;gap:16px}
@media (min-width:600px){.kontakt-form{padding:32px}}
.kontakt-form .feld{display:grid;gap:6px}
.kontakt-form label{font-weight:700;font-size:.95rem}
.kontakt-form input,.kontakt-form select,.kontakt-form textarea{font:inherit;font-size:1rem;color:var(--tinte);background:#fff;border:1.5px solid #E2D3B8;border-radius:12px;padding:12px 14px;width:100%;min-height:48px}
.kontakt-form textarea{resize:vertical;min-height:130px}
.kontakt-form input:focus,.kontakt-form select:focus,.kontakt-form textarea:focus{outline:none;border-color:var(--taube);box-shadow:0 0 0 3px rgba(79,114,156,.18)}
.kontakt-form .btn{justify-self:start}
.kontakt-form .btn:disabled{opacity:.6;cursor:wait}
.feld-falle{position:absolute!important;left:-9999px;width:1px;height:1px;overflow:hidden}
.kf-hinweis{font-size:.85rem;color:var(--tinte-2);margin:0}
.kf-status{margin:0;font-weight:700;min-height:1.2em}
.kf-status.ok{color:var(--salbei)}
.kf-status.fehler{color:var(--beere)}
.player.laedt::after{content:"";position:absolute;left:50%;top:50%;width:44px;height:44px;margin:-22px 0 0 -22px;border-radius:50%;border:4px solid rgba(255,255,255,.35);border-top-color:#fff;animation:dreh .8s linear infinite;z-index:5;pointer-events:none}
@keyframes dreh{to{transform:rotate(360deg)}}