:root{--paper:#fbf9f4;--white:#fffefa;--ink:#17392d;--sage:#15513b;--sage-deep:#113c2c;--gold:#ede4ca;--line:#e5dfd1;--muted:#5c6258}
.shell{width:min(1120px,calc(100% - 64px))}.header-inner{min-height:62px}.brand{font-size:25px}.hero{grid-template-columns:1.25fr 1fr;min-height:280px;padding-block:12px 15px;gap:12px}.hero .eyebrow{text-transform:none;letter-spacing:0;color:var(--ink);font-size:12px;margin-bottom:12px}.hero h1{font-size:28px;white-space:nowrap;letter-spacing:-.6px}.hero-intro{font-size:14px;margin-bottom:20px}.hero-art{margin:0;max-width:450px}.hero-art img{width:100%;height:auto}.hero-button{border-radius:6px;font-size:12px;min-height:40px;padding:10px 18px}.steps{background:#f7f4eb;border-block:1px solid var(--line);border-radius:0;padding:15px 12px}.step-icon{width:32px;height:32px;background:transparent}.step-icon svg{width:25px;height:25px}.steps>div{font-size:12px;gap:12px}.steps>div+div{border-color:var(--line)}.category-intro{background:transparent;border:0;padding:0;gap:30px;margin-top:25px;grid-template-columns:1.2fr 1fr}.category-intro aside{border:0;padding:16px 20px;border-radius:9px;background:#edf0e4}.category-intro>div{padding:10px 0}.category-intro h3{margin-bottom:7px}.whatsapp-preview-link,.facts dd a{font-weight:600;text-decoration:underline;text-underline-offset:2px}.category-intro aside p+p{margin-top:7px}.gallery{padding-top:28px}.gallery>h2{font-size:20px}.filters{margin:14px 0 18px}.filters button{min-height:34px;padding:5px 18px}.card-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}.card{border-color:#e9e4d8;border-radius:10px;box-shadow:0 3px 12px #5b4d2a07}.media-stage,.media-stage.neutral,.od-stage{background:#050605 url("assets/bier-schaum-hintergrund.png") center bottom/100% 100% no-repeat;min-height:310px;padding:17px 12px 39px}.media-stage::before,.od-stage::before{display:none;content:none}.od-stage{overflow:hidden}.phone{position:relative;isolation:isolate;height:250px;width:auto;aspect-ratio:var(--phone-ratio,.5);border:4px solid #191b17;outline:1px solid #77796e;border-radius:17px;background:#151713;box-shadow:0 3px 3px #0004,0 9px 16px #514a3326;overflow:hidden}.phone:after{border-radius:11px}.phone-media{inset:auto;left:0;top:0;max-width:none!important;object-fit:fill!important;transform-origin:0 0;visibility:hidden;background:transparent!important}.phone-media.media-ready{visibility:visible}.video-badge{font-size:10px;line-height:1.3;background:#fffef8ed;color:#264333;padding:5px 8px;top:10px;left:10px}.play-toggle,.sound-toggle{font-size:11px;min-height:32px;padding:6px 9px}.preview-controls{bottom:8px;left:10px;right:10px}.card-content{padding:13px 14px 14px;gap:6px}.card-content h3{font-size:13px;min-height:38px}.card-content p{font-size:12px;line-height:1.5;min-height:36px;margin-bottom:3px;color:#596056}.card-bottom{flex-direction:row;align-items:center;gap:10px}.card-bottom .order{width:auto;min-width:0;min-height:38px;font-size:11px;padding:7px 10px;flex:0 1 auto;white-space:normal}.card-bottom .order svg{width:12px;height:12px}.price{font-size:15px}.static-preview{position:absolute;bottom:9px;right:10px;font-size:11px;text-decoration:underline;background:#fffef7;padding:5px 9px;border-radius:18px}.personal{background:#edf0e4;border-radius:10px;padding:22px 25px}.personal h2{font-size:20px}.detail-hero{grid-template-columns:340px minmax(0,1fr);gap:35px}.detail-hero .detail-stage{height:420px}.detail-stage .phone{height:345px;width:auto}.detail-facts{gap:28px;grid-template-columns:1.5fr 1fr}.detail-page h1{font-size:26px}.facts{overflow-wrap:anywhere}.facts>div{grid-template-columns:115px minmax(0,1fr)}.design-box{background:#f7f3e9;gap:30px;padding:24px}.design-box h2{font-size:19px}.direct-answer{background:#fffdf8;border-left:3px solid #81906d;padding:10px 12px;border-radius:0 5px 5px 0}.design-box h3{margin-top:18px}.review-stars{color:#7a5b18;letter-spacing:2px}.review{background:#f5f0e5}.maker{background:#edf0e4}.included-thanks{margin-block:20px;padding:15px 20px;background:#edf0e4;border-radius:9px}.included-thanks p{margin:4px 0 0}.photo-note{font-size:12px;margin-top:12px}.rel-thumb .phone{height:125px;width:auto;aspect-ratio:var(--phone-ratio,.5)}.od-stage .phone{height:370px;width:auto}.od-media .product-stage{min-height:550px}.od-stage .phone-media{visibility:hidden}.od-stage .phone-media.media-ready{visibility:visible}.od-body{padding:27px 24px 22px}.footer .brand{font-size:20px}
@media(min-width:1400px){.hero{min-height:295px}.hero-art{max-width:470px}.media-stage{min-height:310px}.phone{width:auto}}
@media(max-width:1000px){.shell{width:calc(100% - 40px)}.hero{grid-template-columns:1.2fr 1fr}.hero h1{font-size:25px}.card-grid{gap:15px}.card-bottom{flex-direction:column;align-items:stretch;gap:7px}.card-bottom .order{width:100%}.card-content h3{font-size:13px;min-height:52px}.detail-hero{grid-template-columns:300px minmax(0,1fr);gap:25px}.detail-page h1{font-size:24px}.detail-stage .phone{width:auto}.od-stage .phone{width:auto}}
@media(max-width:900px){.od-media .product-stage{height:300px;min-height:0}.od-stage .phone{height:235px}.detail-hero{grid-template-columns:1fr;gap:20px}.detail-hero .detail-stage{height:390px;max-width:470px}.detail-stage .phone{height:310px}.detail-facts{grid-template-columns:1fr}.category-intro{gap:20px}.hero h1{font-size:24px}}
@media(max-width:760px){.shell{width:calc(100% - 32px)}.hero{min-height:245px;grid-template-columns:1.15fr 1fr}.hero h1{font-size:23px;white-space:normal}.hero-intro{font-size:13px}.hero-art{margin:0}.category-intro{grid-template-columns:1fr;gap:10px;margin-top:19px}.category-intro aside{padding:14px 17px}.category-intro>div{padding:0}.card-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.card-content h3{font-size:12px;min-height:51px}.media-stage{min-height:284px}.phone{height:220px;width:auto}.detail-stage .phone{height:310px}.steps{padding:12px 3px}.steps>div{font-size:11px;gap:5px}.step-icon{width:30px;height:30px}.design-box{padding:20px;gap:18px}.design-box h2{font-size:18px}.card-content p{min-height:54px}.card-bottom .order{min-height:42px}.rel-thumb .phone{height:115px;width:auto}}
@media(max-width:500px){.hero{grid-template-columns:1fr 1fr;min-height:210px;padding-block:16px;gap:5px}.hero-copy{padding:0}.hero .eyebrow{font-size:11px;line-height:1.5;margin-bottom:9px}.hero h1{font-size:23px;line-height:1.15;margin-bottom:10px}.hero-intro{font-size:12px;line-height:1.5;margin-bottom:13px}.hero-art{width:100%;max-width:none;margin:0;align-self:center}.hero-button{min-height:39px;padding:8px 11px;font-size:11px;gap:7px}.hero-button svg{width:14px;height:14px}.brand{font-size:23px}.header nav{font-size:11px;gap:13px}.header-inner{min-height:58px}.card-grid{gap:11px}.media-stage{min-height:254px;padding:13px 7px 42px}.phone{height:187px;width:auto;border-width:3px;border-radius:14px}.video-badge{display:block;font-size:9px;top:7px;left:7px;padding:3px 6px}.preview-controls{left:6px;right:6px;bottom:7px;flex-wrap:wrap}.play-toggle,.sound-toggle{font-size:10px;min-height:31px;padding:5px 7px}.sound-toggle{padding-inline:6px}.card-content{padding:11px 10px}.card-content h3{min-height:67px;line-height:1.4}.card-content p{font-size:11px;min-height:66px;line-height:1.5}.card-bottom .order{font-size:10px;min-height:42px;padding-inline:5px}.card-bottom .order svg{display:none}.price{font-size:14px}.static-preview{left:5px;right:5px;bottom:7px;font-size:10px;text-align:center;padding:4px 5px}.steps>div{font-size:10px}.step-icon svg{width:23px;height:23px}.category-intro h2{font-size:18px}.gallery>h2{font-size:19px}.filters{gap:7px}.filters button{font-size:11px;padding:5px 12px}.detail-hero .detail-stage{height:370px}.detail-stage .phone{height:295px}.detail-stage .video-badge{font-size:10px;top:12px;left:12px}.detail-stage .play-toggle,.detail-stage .sound-toggle{font-size:12px}.detail-buy{gap:17px}.facts>div{grid-template-columns:100px minmax(0,1fr)}.party-guide-list{grid-template-columns:1fr}.party-guide-card{padding:14px 16px}.party-guide-card h3{font-size:14px}.rel-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.rel-thumb .phone{height:105px;width:auto}.rel-name{font-size:11px}.od-stage .phone{height:230px;width:auto}.personal{padding:19px 20px}.footer nav{gap:8px 12px}.footer .brand{font-size:19px}}
@media(max-width:350px){.shell{width:calc(100% - 24px)}.hero h1{font-size:21px}.hero .eyebrow{font-size:10px}.hero-intro{font-size:11px}.hero-button{font-size:10px;padding:8px}.header nav{font-size:10px;gap:10px}.phone{height:170px;width:auto}.media-stage{min-height:236px}.card-content{padding-inline:8px}.card-content p{min-height:82px}.card-content h3{min-height:68px}.facts>div{grid-template-columns:1fr;gap:3px}.rel-grid{grid-template-columns:1fr}.rel-thumb .phone{height:115px;width:auto}.rel-card{grid-template-columns:70px 1fr}.detail-stage .phone{height:295px}.od-stage .phone{height:230px}}
.card-content h3 a{display:block}

/* Ursprünglich freigegebene helle Kontur vor dem Bier-Schaum-Hintergrund. */
.product-stage .phone{outline:1px solid rgba(245,231,202,.85);box-shadow:0 0 0 2px rgba(246,233,205,.1),0 10px 20px rgba(0,0,0,.55)}

/* Einheitlicher Kopfbereich und Breadcrumb nach der freigegebenen Glühwein-Vorlage. */
.header .header-inner{min-height:82px;padding-block:17px;gap:24px}
.header .brand{display:inline-flex;align-items:center;gap:9px;font-size:24px;font-weight:700;letter-spacing:-.6px;white-space:nowrap}
.header .brand svg{width:23px;height:23px;color:var(--sage)}
.header nav{display:flex;align-items:center;gap:29px;font-size:12px;min-width:0}
.header nav>a:not(.header-cta){white-space:nowrap}
.header .header-cta{display:inline-flex;align-items:center;justify-content:center;gap:20px;min-height:44px;padding:11px 19px;font-size:12px;font-weight:600;white-space:nowrap;border:1px solid var(--sage);border-radius:5px;background:var(--sage);color:#fff;text-decoration:none;line-height:1.3}
.header .header-cta:hover{background:var(--sage-deep);border-color:var(--sage-deep);text-decoration:none}
.header .header-cta svg{width:20px;height:20px}
.breadcrumb{display:block}
.breadcrumb ol{display:flex;flex-wrap:wrap;gap:6px;list-style:none;margin:0;padding:0;font-size:12px;color:var(--muted)}
.breadcrumb li{min-width:0;overflow-wrap:anywhere}
.breadcrumb li+li::before{content:'›';margin-right:6px}
.breadcrumb a{text-decoration:none}
.breadcrumb a:hover{color:var(--sage);text-decoration:underline}
@media(max-width:760px){.header .header-inner{min-height:72px;padding-block:14px;gap:14px}.header nav{gap:19px}.header .header-cta{gap:7px;padding-inline:13px}}
@media(max-width:620px){.header nav>a:not(.header-cta){display:none}.header .header-inner{gap:10px}.header .header-cta svg{display:none}}
@media(max-width:360px){.header .brand{font-size:22px}.header .brand svg{width:19px;height:19px}.header .header-cta{padding-inline:9px}}
