@font-face{font-family:'DM Serif Display';src:url('/privatier/lesen/fonts/dm-serif-display-400.woff2') format('woff2');font-weight:400;font-display:swap}
@font-face{font-family:Poppins;src:url('/assets/fonts/poppins-600.ttf') format('truetype');font-weight:600;font-display:swap}
@font-face{font-family:'Instrument Sans';src:url('/privatier/lesen/fonts/instrument-sans-400.woff2') format('woff2');font-weight:400;font-display:swap}
@font-face{font-family:'Instrument Sans';src:url('/privatier/lesen/fonts/instrument-sans-700.woff2') format('woff2');font-weight:700;font-display:swap}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;padding:28px 32px 0;background:var(--brand-champagne);color:var(--brand-text);font-family:'Instrument Sans',var(--brand-font-body);-webkit-font-smoothing:antialiased}

/* Hero: one headline, then video and signup card side by side. The grid narrows on short screens so the button stays above the fold. */
.hero{max-width:1180px;margin:0 auto 56px;text-align:center}
.eyebrow{margin:0 0 12px;color:var(--brand-gold);font-size:17px;line-height:1.4;font-weight:700}
h1{margin:0;color:var(--brand-black);font-family:Poppins,sans-serif;font-size:min(52px,3.7vw,6.4vh);font-weight:600;line-height:1.1;letter-spacing:-.035em}
h1 .headline-line{display:block;white-space:nowrap}
.hero-grid{display:grid;grid-template-columns:minmax(0,1fr) clamp(320px,30vw,380px);gap:24px;max-width:min(1180px,calc((100vh - 236px) * 16 / 9 + 404px));margin:32px auto 0}
.video-shell{align-self:center;aspect-ratio:16/9;border-radius:18px;overflow:hidden;background:#171717;box-shadow:0 18px 60px rgba(38,28,19,.12);--plyr-color-main:var(--brand-accent);--plyr-font-family:'Instrument Sans',sans-serif}
.video-shell video,.video-shell .plyr,.video-shell .plyr__video-wrapper{display:block;width:100%;height:100%;object-fit:contain}
.video-shell .plyr__control--overlaid{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);margin:0;padding:0;border:0;width:88px;height:88px;background:var(--brand-accent);display:flex;align-items:center;justify-content:center}
.video-shell .plyr__control--overlaid svg{position:absolute;left:50%;top:50%;transform:translate(-45%,-50%);margin:0;width:34px;height:34px}
.registration{display:flex;flex-direction:column;justify-content:center;padding:28px;border:1px solid rgba(147,113,84,.14);border-radius:18px;background:var(--brand-white);box-shadow:0 18px 60px rgba(38,28,19,.08);scroll-margin-top:24px}
.registration h2{margin:0;color:var(--brand-black);font:600 26px/1.15 Poppins,sans-serif;letter-spacing:-.02em;text-wrap:balance}
.registration-date{margin:14px 0 0;font-size:17px;line-height:1.4;font-weight:700}
.registration-note{margin:2px 0 0;font-size:15px;line-height:1.5;color:var(--brand-gray-600)}
#registration-form,#form-success{margin-top:20px}
#registration-form{--brand-input-radius:var(--brand-cta-radius);padding-top:20px;border-top:1px solid rgba(147,113,84,.16)}
.fields{display:grid;gap:10px;margin-bottom:12px;text-align:left}
.fields input{display:block;width:100%;min-width:0;height:52px;margin:0;padding:0 22px;border-radius:var(--brand-cta-radius);font:400 17px 'Instrument Sans',sans-serif}
.honeypot{position:absolute;left:-10000px;width:1px;height:1px;overflow:hidden}
.cta{display:flex;justify-content:center;align-items:center;gap:12px;width:100%;min-height:58px;padding:14px 22px;font:700 17px/1.3 'Instrument Sans',sans-serif;letter-spacing:.02em;text-align:center;cursor:pointer;text-decoration:none}
.cta span{font-size:22px;line-height:1}
.cta:disabled{opacity:.6;cursor:wait}
.recording-note{margin:12px 0 0;font-size:13px;line-height:1.5;color:var(--brand-gray-600)}
#form-error{margin:12px 0 0;font-size:15px;color:#a02828;line-height:1.5}
#form-success{padding:22px;border:1px solid var(--brand-green);border-radius:14px;text-align:left;background:white}
#form-success h3{margin:0 0 8px;color:var(--brand-green);font-size:22px}
#form-success p{margin:0;line-height:1.6}

.letter{max-width:860px;margin:auto;padding:52px 72px;border:1px solid rgba(147,113,84,.12);border-radius:24px;background:var(--brand-white);box-shadow:0 12px 48px rgba(68,49,29,.035);font-size:20px;line-height:1.7}.letter p{margin:0 0 24px}.letter>p:last-child{margin-bottom:0}.letter h2{font:700 22px/1.4 'Instrument Sans',sans-serif;margin:34px 0 20px}.letter ul{padding-left:25px;margin:0 0 28px}.letter li{padding-left:5px;margin-bottom:14px}footer{display:flex;justify-content:center;gap:26px;padding:28px 12px 36px}footer a{padding:8px 0;font-size:13px;color:var(--brand-gray-600);text-decoration:none}a:focus-visible,button:focus-visible,input:focus-visible{outline:3px solid var(--brand-accent);outline-offset:4px}[hidden]{display:none!important}

/* Tablet: stacked, card centered under the video. */
@media(max-width:960px){.hero-grid{grid-template-columns:1fr;max-width:720px;gap:20px}.registration{width:100%;max-width:480px;margin:0 auto}h1{font-size:min(44px,calc((100vw - 64px) / 14.8))}}

/* Phone: headline fills two lines, everything up to the button fits on one screen. */
@media(max-width:650px){body{padding:18px 16px 0}.hero{margin-bottom:32px}.eyebrow{margin-bottom:8px;font-size:15px}h1{font-size:min(30px,calc((100vw - 32px) / 14.8))}.hero-grid{gap:14px;margin-top:18px}.video-shell{border-radius:12px;box-shadow:0 10px 30px rgba(38,28,19,.1)}.registration{padding:20px 16px;border-radius:16px;box-shadow:0 10px 30px rgba(38,28,19,.06)}.registration h2{font-size:min(21px,calc((100vw - 68px) / 16.4))}.registration-date{margin-top:6px;font-size:16px}.registration-note{font-size:14px}#registration-form,#form-success{margin-top:14px}#registration-form{padding-top:14px}.fields input{height:50px;font-size:16px}.cta{min-height:54px;font-size:16px;gap:10px}.recording-note{margin-top:10px}.letter{padding:30px 23px;border-radius:18px;font-size:18px}.letter h2{font-size:20px}.video-shell .plyr__control--overlaid{width:64px;height:64px}.video-shell .plyr__control--overlaid svg{width:26px;height:26px}.plyr__volume{min-width:0;max-width:none;flex:0 0 auto}.plyr__volume input{display:none}.plyr__controls{gap:2px}.plyr__time{font-size:12px}.plyr__control{padding:7px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}

.delivery-notice{padding:8px 10px;margin:-28px -32px 20px;background:var(--brand-green);color:var(--brand-white);font-size:14px;font-weight:500;line-height:1.35;text-align:center;white-space:nowrap}@media(max-width:650px){.delivery-notice{margin:-18px -16px 20px}}@media(max-width:400px){.delivery-notice{font-size:12px}}
