/* espresso-apparaat.info — shared stylesheet
   Source: _design/assets/style.css (ChatGPT design, 2026-09-15), taken over as is.
   Changes for BCM: .demo banner removed; .prose and .disclosure added at the end.
   No framework, no external fonts. */
:root{--paper:#f7f4ed;--white:#fffefa;--ink:#30291f;--muted:#726c62;--line:#ddd8cc;--accent:#af4929;--sage:#e6eadf;--green:#365344;--radius:18px}
*{box-sizing:border-box}
body{margin:0;background:var(--paper);color:var(--ink);font:16px/1.6 system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}
a{color:inherit;text-decoration:none}
a:hover{color:var(--accent)}
button,input,select{font:inherit}
button,a,input,select{touch-action:manipulation}
button{cursor:pointer}
button:disabled{cursor:default;opacity:.5}
button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible{outline:3px solid var(--accent);outline-offset:4px}
h1,h2,h3,p{margin:0}
h1,h2,.serif{font-family:Georgia,"Times New Roman",serif;font-weight:400;line-height:1.06;letter-spacing:-.045em}
h1{font-size:clamp(42px,5.8vw,78px)}
h2{font-size:clamp(32px,3.6vw,46px)}
h3{font-size:21px;line-height:1.3;letter-spacing:-.025em}
.wrap{max-width:1220px;margin:auto;padding:0 36px}
.header{border-bottom:1px solid var(--line)}
.nav{min-height:94px;display:flex;align-items:center;justify-content:space-between;gap:25px}
.brand{display:flex;align-items:center;gap:11px;font-weight:750;line-height:1.15;font-size:18px;letter-spacing:-.04em}
.brand small{display:block;font-size:11px;font-weight:450;letter-spacing:.1em;margin-top:6px}
.brand svg{width:39px;height:39px}
.navlinks{display:flex;align-items:center;gap:27px;font-size:14px;font-weight:600}
.navlinks [aria-current=page]{color:var(--accent)}
.menu{display:none;border:1px solid var(--line);background:transparent;border-radius:9px;padding:9px 14px}
.btn{display:inline-flex;justify-content:center;align-items:center;gap:16px;padding:13px 22px;border:1px solid var(--ink);background:var(--ink);color:white;border-radius:7px;font-size:14px;font-weight:650;line-height:1.5}
.btn:hover{background:var(--accent);border-color:var(--accent);color:white}
.btn.light{background:transparent;color:var(--ink);border-color:var(--line)}
.btn.light:hover{border-color:var(--ink)}
.btn.orange{background:var(--accent);border-color:var(--accent)}
.eyebrow{display:block;color:var(--accent);text-transform:uppercase;letter-spacing:.13em;font-size:11px;font-weight:750;margin-bottom:19px}
.hero{display:grid;grid-template-columns:1.02fr 1fr;gap:52px;align-items:center;padding-top:58px;padding-bottom:52px}
.hero p{color:var(--muted);max-width:440px;margin:25px 0;font-size:17px}
.hero em{font-weight:400;color:var(--accent)}
.actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:26px}
.hero-art{background:#e9e3d6;border-radius:140px 140px 14px 14px;position:relative;min-height:465px;display:flex;align-items:center;justify-content:center;overflow:hidden}
.hero-art:before{content:'';position:absolute;width:290px;height:290px;background:#d6dacb;border-radius:50%;top:48px}
.hero-art img{width:88%;position:relative;z-index:1}
.art-label{position:absolute;bottom:21px;left:25px;font-size:11px;letter-spacing:.08em;color:#5b5b4d;z-index:2}
.float-note{position:absolute;right:20px;bottom:58px;background:var(--white);padding:14px 22px;box-shadow:0 6px 20px #30291f0c;border-radius:10px;z-index:2;transform:rotate(-4deg);font-size:12px}
.float-note strong{display:block;font:33px Georgia;color:var(--accent)}
.micro{font-size:12px;color:var(--muted)}
.trust{display:flex;justify-content:space-between;border-block:1px solid var(--line);padding:18px 0;font-size:12px;gap:16px;color:var(--muted)}
.trust span:before{content:'✓';color:var(--green);margin-right:9px}
.section{padding:56px 0}
.sectionhead{display:flex;justify-content:space-between;align-items:end;gap:24px;margin-bottom:28px}
.text-link{font-weight:650;font-size:14px;text-decoration:underline;text-underline-offset:5px}
.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.card{background:var(--white);border:1px solid var(--line);border-radius:var(--radius);overflow:hidden}
.card-body{padding:23px}
.product-art{height:220px;display:flex;align-items:center;justify-content:center;background:#eceee5;position:relative}
.product-art img{height:94%;width:90%;object-fit:contain}
.card:nth-child(2n) .product-art{background:#eee5d9}
.card:nth-child(3n) .product-art{background:#e5e8e7}
.badge{display:inline-block;background:#ffffffdc;padding:4px 10px;border-radius:5px;font-size:10px;font-weight:650;letter-spacing:.02em}
.product-art .badge{position:absolute;top:15px;left:15px}
.card .category{font-size:11px;text-transform:uppercase;letter-spacing:.12em;color:var(--muted);margin-bottom:8px}
.card p{color:var(--muted);font-size:14px;margin-top:9px}
.price-row{display:flex;align-items:end;justify-content:space-between;border-top:1px solid var(--line);margin-top:23px;padding-top:17px}
.price-row strong{font:28px Georgia}
.price-row small{font-size:11px;color:var(--muted);display:block}
.percup{text-align:right;color:var(--accent);font-weight:700;font-variant-numeric:tabular-nums}
.card-bottom{display:flex;justify-content:space-between;align-items:center;padding-top:18px;font-size:12px}
.card-bottom label{display:flex;gap:7px;align-items:center}
input[type=checkbox]{accent-color:var(--green);width:17px;height:17px}
.band{background:var(--green);color:var(--paper);padding:35px 42px;border-radius:var(--radius);display:grid;grid-template-columns:1fr 1fr;gap:40px;align-items:center}
.band .eyebrow{color:#d8c097}
.band p{color:#dbe0d7;margin-top:16px}
.band .btn{background:var(--paper);color:var(--green);border:0}
.big-number{font:58px Georgia;letter-spacing:-.04em}
.mini-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:24px;margin-top:30px}
.mini-grid article{border-top:1px solid var(--line);padding-top:18px}
.step{font-family:Georgia;font-size:27px;color:var(--accent);margin-bottom:12px}
.mini-grid h3{font-size:16px}
.mini-grid p{font-size:13px;color:var(--muted);margin-top:10px}
.footer{padding:35px 0;border-top:1px solid var(--line);margin-top:35px;font-size:12px;color:var(--muted)}
.footer-inner{display:flex;justify-content:space-between;gap:30px}
.footer p{max-width:610px}
.footer a{text-decoration:underline}
.crumb{padding-top:25px;font-size:12px;color:var(--muted)}
.pagehead{padding:36px 0}
.pagehead h1{font-size:56px;max-width:850px}
.pagehead p{max-width:670px;color:var(--muted);margin-top:18px}
.filterbar{display:flex;flex-wrap:wrap;gap:18px;align-items:end;background:#eeebe3;border-radius:12px;padding:20px;margin-bottom:24px}
.field{display:flex;flex-direction:column;gap:7px;font-size:12px;font-weight:600;flex:1;min-width:135px}
.field input:not([type=range]),.field select{width:100%;background:var(--white);border:1px solid #b8b2a5;padding:10px 12px;border-radius:6px;color:var(--ink)}
.field input[type=range]{accent-color:var(--accent);width:100%}
.filter-result{font-size:13px;color:var(--muted);margin-bottom:20px}
.comparebar{position:sticky;bottom:16px;background:var(--ink);color:white;padding:15px 22px;border-radius:12px;display:flex;justify-content:space-between;align-items:center;gap:15px;box-shadow:0 5px 20px #0002;margin-top:30px;z-index:3}
.comparebar .btn{background:var(--paper);color:var(--ink)}
.split{display:grid;grid-template-columns:1fr 1fr;gap:40px}
.detail-art{background:var(--sage);border-radius:20px;display:flex;align-items:center;justify-content:center;min-height:400px}
.detail-art img{width:90%}
.lead{color:var(--muted);margin:18px 0}
.stats{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin:24px 0}
.stats div{border-top:1px solid var(--line);padding-top:14px}
.stats strong{display:block;font:29px Georgia}
.stats small{font-size:11px;color:var(--muted)}
.panel{padding:28px;border:1px solid var(--line);background:var(--white);border-radius:var(--radius)}
.panel h3{margin-bottom:16px}
.panel p{color:var(--muted);font-size:14px;margin-top:12px}
.panel.sage{background:var(--sage)}
.checklist{list-style:none;padding:0;margin:15px 0;font-size:14px}
.checklist li{padding:10px 0;border-bottom:1px solid var(--line)}
.checklist li:before{content:'↳';color:var(--accent);margin-right:10px}
.source{font-size:12px;background:#eeebe3;padding:17px 20px;border-radius:8px;margin:22px 0;color:var(--muted)}
.calculator{display:grid;grid-template-columns:1fr 1fr;gap:35px}
.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:17px}
.result{background:var(--green);color:white;padding:32px;border-radius:16px}
.result small{color:#d0daca}
.result p{margin-top:18px;font-size:14px}
.result-line{display:flex;justify-content:space-between;border-bottom:1px solid #ffffff35;padding:11px 0;font-size:14px;gap:15px}
.meter{height:9px;background:#ffffff25;border-radius:9px;overflow:hidden;margin-top:9px}
.meter span{display:block;height:100%;background:#e6bb91}
.tablewrap{overflow-x:auto;border:1px solid var(--line);border-radius:14px;background:var(--white)}
table{border-collapse:collapse;width:100%;font-size:14px;min-width:650px}
th,td{text-align:left;padding:18px 23px;border-bottom:1px solid var(--line);vertical-align:top}
th{font-weight:650;background:#efeee7}
td:first-child{color:var(--muted);width:25%}
td img{height:125px;width:100%;object-fit:contain}
.unknown{color:#8d542d;background:#f3e6d6;border-radius:5px;padding:3px 7px;font-size:11px;display:inline-block}
details{border-top:1px solid var(--line);padding:18px 0}
summary{cursor:pointer;font-weight:650}
details p{margin-top:12px;color:var(--muted);font-size:14px}
.fit-result{background:var(--sage);padding:15px;border-radius:8px;margin-top:20px;font-size:14px}
.skip{position:absolute;left:-1000px}
.skip:focus{left:10px;top:10px;background:white;padding:15px;z-index:9}
.empty{padding:40px 20px;border:1px dashed var(--line);text-align:center;grid-column:1/-1}
.num{font-variant-numeric:tabular-nums}
 [hidden]{display:none!important}

/* --- BCM additions ------------------------------------------------------ */
/* Body text from modContent_Pages ({{PAGE_BODY}}): privacy, 404, colophon. */
.prose{max-width:760px;padding:10px 0 40px}
.prose h2{font-size:clamp(26px,3vw,34px);margin:38px 0 14px}
.prose h3{margin:26px 0 10px}
.prose p,.prose ul,.prose ol{color:var(--ink);margin:0 0 16px}
.prose ul,.prose ol{padding-left:22px}
.prose li{margin-bottom:6px}
.prose a{text-decoration:underline;text-underline-offset:4px}
.prose table{min-width:0;margin:0 0 20px}
/* The publisher injects {{DISCLOSURE_DISCLAIMER_HTML}} with Tailwind classes that this
   site does not load; this block keeps it readable. */
.disclosure-slot > div{padding:24px 0;border-top:1px solid var(--line);font-size:12px;color:var(--muted);text-align:center}
.disclosure-slot > div > div > *{margin:8px auto;max-width:760px}

@media(max-width:900px){.wrap{padding:0 23px}
.hero{gap:25px}
.hero-art{min-height:390px}
.navlinks{gap:17px}
.grid{gap:14px}
.card-body{padding:17px}
.mini-grid{grid-template-columns:repeat(3,1fr)}
.band{padding:28px}
.product-art{height:185px}
}
@media(max-width:680px){.wrap{padding:0 20px}
.nav{min-height:76px;flex-wrap:wrap;gap:0}
.menu{display:block}
.navlinks{display:none;width:100%;flex-direction:column;align-items:stretch;padding:20px 0;gap:0}
.navlinks.open{display:flex}
.navlinks a{padding:12px}
.hero{grid-template-columns:1fr;padding-top:34px;gap:32px}
.hero h1{max-width:360px}
.hero-art{min-height:350px;max-width:440px;width:100%;margin:auto}
.hero-art img{max-height:340px}
.hero p{font-size:16px}
.trust{flex-wrap:wrap;gap:10px 20px}
.trust span{font-size:11px}
.grid{grid-template-columns:1fr}
.product-art{height:245px}
.section{padding:36px 0}
.sectionhead{align-items:start;flex-direction:column;gap:18px}
.mini-grid{grid-template-columns:1fr 1fr;gap:22px}
.band,.split,.calculator{grid-template-columns:1fr;gap:26px}
.pagehead h1{font-size:43px}
.footer-inner{flex-direction:column;gap:20px}
.detail-art{min-height:300px}
.comparebar{font-size:12px;padding:12px}
.comparebar .btn{padding:10px 13px}
.panel{padding:22px}
.form-grid{gap:13px}
.big-number{font-size:49px}
.float-note{bottom:47px}
.filterbar{gap:12px}
.filterbar .field{min-width:120px}
}
@media(prefers-reduced-motion:no-preference){.btn{transition:background .15s,color .15s}
}