/* Coffeehouse presentation, layered over the existing catalog components. */
:root{--ink:#39261e;--muted:#8c7565;--orange:#9d5e36;--line:#e4d5c3;--cream:#f5eedf}
body{background:#faf5eb;color:var(--ink);background-image:radial-gradient(#a7835a0a .8px,transparent .8px);background-size:5px 5px}
.site-header{padding-top:24px;padding-bottom:24px;border-color:var(--line)}
.brand{letter-spacing:1.2px;color:#4d3122}.brand-light{color:#9b7151}.brand-icon{border-radius:50%;background:#ece0cc;border-color:#deccb0;width:44px;height:44px}.brand small{font-family:Georgia,serif;font-style:italic;letter-spacing:.5px;font-size:11px;margin-top:5px;color:#9a7b60}nav{font-size:12px}nav .nav-active{color:#74452b}
.hero{grid-template-columns:1.1fr 1fr;gap:50px;padding:55px 32px 60px;min-height:570px}.hero .eyebrow{font-size:8px;letter-spacing:1.8px;color:#956745}.hero h1{font-size:clamp(33px,3.4vw,47px);font-weight:500;line-height:1.75;letter-spacing:-1.8px;margin:19px 0 20px}.highlight{color:#a96b40}.underline{border-color:#c39668;height:9px;bottom:-6px;opacity:.7}.hero-copy>p{font-size:13px;line-height:2.2;color:#8c7565;margin:0 0 26px}.button-dark{background:#4d3022;border:1px solid #4d3022;border-radius:4px;padding:15px 21px}.button-dark:hover{background:#6b4531}.hero-notes{font-size:10px;color:#9b8169;gap:19px;margin-top:25px}.hero-notes>span+span{border-left:1px solid #d7c5ad;padding-left:19px}.hero-notes i{color:#a4724f;font-size:15px}
.coffee-scene{position:relative;min-width:0;padding:26px 0 24px}.scene-caption{display:flex;justify-content:space-between;gap:10px;font-family:Georgia,serif;font-size:8px;letter-spacing:1.2px;color:#9b7d62;margin-bottom:13px}.hero-coffee{display:block;width:100%;aspect-ratio:1.07;object-fit:cover;border-radius:43% 43% 4px 4px;box-shadow:0 18px 35px #5f351916}.coffee-seal{position:absolute;left:-33px;bottom:47px;background:#fbf4e6;border:1px solid #a47c52;outline:5px solid #fbf4e6;border-radius:50%;width:93px;height:93px;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:4px;transform:rotate(-14deg);color:#865e3c}.coffee-seal span{font:7px Georgia,serif;letter-spacing:1.1px}.coffee-seal b{font:30px Georgia,serif;font-weight:400;line-height:1}.scene-note{display:flex;gap:12px;align-items:center;justify-content:flex-end;font-size:9px;color:#9b8167;margin-top:18px}.note-line{width:35px;height:1px;background:#c9a67f}
.coffee-ribbon{display:flex;align-items:center;justify-content:space-between;gap:18px;border-top:1px solid #d8c6ae;border-bottom:1px solid #d8c6ae;background:#eee3d0;padding:17px 32px;color:#927052;font-size:9px;letter-spacing:1.5px}.coffee-ribbon>span{white-space:nowrap}.coffee-ribbon>i{font-style:normal;font-size:12px;color:#b2926f}
.catalog-section{border-top:0;padding-top:55px}.section-heading .eyebrow{font-size:8px;letter-spacing:1.8px}.section-heading h2{font-size:29px;color:#513627;margin:12px 0}.count{background:#eadcc8;color:#9d7652;border-radius:50%;min-width:26px;text-align:center}.section-heading p{font-size:12px;color:#9c826d}.search{border-color:#ddcbb5;background:#fffaf2;border-radius:4px;width:260px;padding:10px 14px}.search input{font-size:12px}.search>span{color:#a38c71}.filters{margin:28px 0}.filter{border-color:#e0d0bb;border-radius:3px;color:#8b735d;padding:8px 17px;font-size:11px;background:#faf5eb}.filter.active{background:#60402d;border-color:#60402d;color:#fff8ec}
.system-card{background:#fffaf3;border-color:#e2d2bd;border-radius:5px;box-shadow:0 3px 0 #e9dbc74d}.system-card:hover{box-shadow:0 9px 25px #70442612}.card-preview{background:#e8dbc5;border-bottom:1px solid #e4d4bf}.theme-1{background:#dfc4a7}.theme-2{background:#d9d4be}.preview-label{font-size:9px;color:#9e8160}.preview-arrow{border-color:#e5d5c1;background:#fff9ed;color:#8f6843}.mini-window{background:#fffcf6;border-color:#cfb995;box-shadow:0 4px 16px #795b3226}.mini-top{color:#a78d6d;background:#f5edde;border-color:#e9ddc9}.mini-sidebar{border-color:#eee2d0}.mini-sidebar i{background:#dfcaaa}.mini-heading{color:#916948}.mini-stats i{border-color:#e7d9c4;background:linear-gradient(90deg,#eadbc5 40%,#f7f1e6 40%)}.mini-table div{border-color:#eadeca}.mini-table div:before{background:#e0d0b8}.mini-table div:after{background:#cbb28e}
.card-content{padding:22px}.card-meta{font-size:9px;gap:10px}.category{background:#eee3d2;color:#97744e;border-radius:3px;padding:5px 8px}.availability{color:#ad8661}.availability.ready{color:#77805a}.card-content h3{font-size:19px;color:#533a2a;margin:17px 0 11px}.card-description{font-size:12px;color:#98816b;line-height:2;min-height:65px}.card-footer{border-top:1px dashed #dac8af;padding-top:19px;gap:15px}.price small{color:#a18a72;font-size:9px}.price strong{font-size:25px;color:#654029}.price>span{font-size:10px;color:#a58b70}.button-coffee{border-radius:4px;background:#704a31;color:#fff8ec;border-color:#704a31;font-size:11px;padding:12px 14px}.button-coffee:hover{background:#8a5c3e}.collection-note{color:#a18a72;padding:32px 0 42px;font-size:11px}.collection-note>span{color:#a78c6b}
.how-section{background:#5a3b2a;border:0;border-radius:5px;padding:38px;color:#f6ead8;position:relative;overflow:hidden}.how-section:after{content:'☕';position:absolute;right:-10px;bottom:-55px;font-size:160px;opacity:.04;pointer-events:none}.how-intro .eyebrow{color:#d2b28a;font-size:8px;letter-spacing:1.4px}.how-intro h2{font-size:24px;line-height:1.8;font-weight:400;color:#f4e6d1}.how-intro p,.how-steps p{font-size:11px;color:#c1a78b;line-height:2}.step-number{background:transparent;border-color:#927456;color:#d8bb94;border-radius:50%;font-family:Georgia,serif;font-size:13px;width:35px;height:35px}.how-steps h3{font-size:14px;color:#ecdbc2;font-weight:400}.empty-state{border-color:#d5bea0;color:#9b8063;background:#f6eddc}.collection-note{line-height:1.9}footer{border-color:#dfcdb4;color:#a18b70;font-size:10px}.footer-brand{color:#775238;letter-spacing:1px}
@media(min-width:1000px){.system-grid:has(.system-card:only-child){grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:1000px){.hero{gap:30px;padding-top:38px;min-height:490px}.hero h1{font-size:35px;letter-spacing:-1px}.coffee-seal{width:77px;height:77px;left:-16px;bottom:45px}.coffee-seal span{font-size:6px}.coffee-seal b{font-size:25px}.coffee-ribbon{gap:12px;padding:16px 28px;flex-wrap:wrap;justify-content:center;font-size:8px}.coffee-ribbon>span:last-child,.coffee-ribbon>i:last-of-type{display:none}.how-section{padding:30px}.card-content h3{font-size:18px}}
@media(max-width:680px){.site-header{padding:20px}.brand{font-size:13px}.brand small{font-size:9px}.brand-icon{width:36px;height:36px}.hero{grid-template-columns:1fr;padding:32px 22px 26px;gap:12px;min-height:0}.hero .eyebrow{font-size:7px;letter-spacing:1.2px}.hero h1{font-size:34px;line-height:1.75;letter-spacing:-1px;margin:18px 0}.hero-copy>p{font-size:12px;line-height:2}.hero-notes{margin-top:21px;font-size:9px;gap:14px}.hero-notes>span+span{padding-left:14px}.button-dark{font-size:12px;padding:13px 18px}.coffee-scene{padding:25px 10px 15px}.scene-caption{font-size:6px;letter-spacing:.8px}.hero-coffee{aspect-ratio:1.12;max-height:350px}.coffee-seal{left:-1px;bottom:43px;width:73px;height:73px}.scene-note{font-size:8px}.coffee-ribbon{padding:14px 15px;gap:12px;font-size:7px;letter-spacing:.7px}.coffee-ribbon>span:nth-of-type(4),.coffee-ribbon>i:nth-of-type(3){display:none}.catalog-section{padding-top:35px}.section-heading h2{font-size:25px}.section-heading p{font-size:11px;line-height:2}.search{width:100%}.card-content{padding:20px}.card-content h3{font-size:19px}.card-description{min-height:0}.card-preview{padding-top:32px}.collection-note{font-size:9px;padding:26px 0}.how-section{padding:25px}.how-intro h2{font-size:23px}.how-intro h2 br,.how-intro p br{display:block}.how-steps{gap:6px}.how-steps>div{border-color:#795b42;padding:18px 0 12px 49px}.how-steps h3{font-size:14px}.step-number{top:18px}footer{gap:15px}.scene-caption span:last-child{font-size:5px}}
@media(max-width:360px){.hero h1{font-size:30px}.hero .eyebrow{letter-spacing:.7px}.brand{font-size:12px}.brand small{font-size:8px}.coffee-ribbon{gap:7px;font-size:6px}}