/* ==========================================================================
   Cafano — specialty coffee roastery theme (mobile-first, RTL)
   Palette: espresso · roast · crema · cream · copper · sage
   Display: Lalezar (fa) + Playfair Display (latin), Body: Vazirmatn
   ========================================================================== */
@font-face{font-family:'Lalezar';src:url("../fonts/Lalezar.d29aca20adbd.woff2") format('woff2');font-weight:400;font-display:swap}
@font-face{font-family:'Playfair';src:url("../fonts/Playfair-400.8a53e5ecdbff.woff2") format('woff2');font-weight:400;font-display:swap}
@font-face{font-family:'Playfair';src:url("../fonts/Playfair-700.9401d0214a93.woff2") format('woff2');font-weight:700;font-display:swap}

:root{
  --cf-espresso:#1b110c; --cf-roast:#3b2214; --cf-mocha:#6e4325; --cf-crema:#c8a27a; --cf-crema-2:#e4caa6;
  --cf-cream:#f5ecdf; --cf-paper:#fbf7f1; --cf-copper:#b8642e; --cf-copper-2:#9c5023; --cf-sage:#6f8f6b;
  --cf-ink:#21150f; --cf-text:#4a3a30; --cf-muted:#7d6b5f; --cf-line:#e8dccb;
  --cf-display:'Lalezar','Vazirmatn',serif; --cf-latin:'Playfair',Georgia,serif;
  --cf-r:22px; --cf-r-lg:34px; --cf-ease:cubic-bezier(.22,.8,.18,1);
  --cf-sh:0 18px 40px -18px rgba(59,34,20,.35);
  /* re-map the base shop tokens so every inner page (cart, checkout, account) inherits the palette */
  --c-primary:#3b2214; --c-primary-600:#2c190f; --c-primary-700:#1b110c; --c-primary-500:#6e4325;
  --c-primary-100:#efe2d0; --c-primary-50:#f8f1e7; --c-accent:#b8642e; --c-accent-600:#9c5023; --c-accent-50:#fbeee3;
  --c-ink:var(--cf-ink); --c-text:var(--cf-text); --c-muted:var(--cf-muted); --c-line:var(--cf-line); --c-line-soft:#f1e8db;
  --c-bg:var(--cf-paper); --c-surface:#fff;
  --sh-3:0 14px 34px rgba(59,34,20,.18);
  --bs-primary:#3b2214; --bs-primary-rgb:59,34,20; --bs-link-color:#9c5023; --bs-link-color-rgb:156,80,35; --bs-link-hover-color:#3b2214;
  --header-h:64px;
}
html,body.cf{overflow-x:clip}
body.cf{background:var(--cf-paper);color:var(--cf-text);font-size:.95rem}
.cf h1,.cf h2,.cf h3{color:var(--cf-ink)}
.cf :focus-visible{outline:3px solid rgba(184,100,46,.55)}
.cf .btn-primary{--bs-btn-bg:var(--cf-roast);--bs-btn-border-color:var(--cf-roast);--bs-btn-hover-bg:var(--cf-espresso);--bs-btn-hover-border-color:var(--cf-espresso);--bs-btn-active-bg:var(--cf-espresso);--bs-btn-disabled-bg:#8d7a6d;--bs-btn-disabled-border-color:#8d7a6d;border-radius:999px}
.cf .btn-outline-primary{--bs-btn-color:var(--cf-roast);--bs-btn-border-color:var(--cf-roast);--bs-btn-hover-bg:var(--cf-roast);--bs-btn-hover-border-color:var(--cf-roast);border-radius:999px}
.cf .card-surface{border-radius:var(--cf-r);border:1px solid var(--cf-line);box-shadow:none}
.cf-grain{position:fixed;inset:0;pointer-events:none;z-index:2000;opacity:.05;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='3'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")}

/* ---------- typography helpers ---------- */
.cf-kicker{display:inline-flex;align-items:center;gap:.4rem;font-size:.78rem;font-weight:700;letter-spacing:.02em;color:var(--cf-copper);text-transform:uppercase}
.cf-kicker::before{content:"";width:22px;height:2px;background:currentColor;border-radius:2px}
.cf-kicker--light{color:var(--cf-crema-2)}
.cf-h1,.cf-h2,.cf-head h2,.cf .cf-pagehero h1{font-family:var(--cf-display);font-weight:400;letter-spacing:0;line-height:1.25}
.cf-h2{font-size:1.45rem;display:flex;align-items:center;gap:.6rem;margin-bottom:1rem}
.cf-h2>span{display:inline-grid;place-items:center;width:34px;height:34px;border-radius:50%;background:var(--cf-roast);color:var(--cf-cream);font-family:'Vazirmatn';font-size:.95rem;font-weight:800}
.cf-head{margin-bottom:1.4rem;max-width:640px}
.cf-head h2{font-size:clamp(1.6rem,4.8vw,2.6rem);margin:.35rem 0}
.cf-head p{color:var(--cf-muted);margin:0}
.cf-head--row{display:flex;align-items:flex-end;justify-content:space-between;gap:1rem;max-width:none}
.cf-link{color:var(--cf-roast);font-weight:700;white-space:nowrap;border-bottom:2px solid var(--cf-crema);padding-bottom:2px}
.cf-link:hover{color:var(--cf-copper)}
.cf-sec{padding:clamp(2.4rem,7vw,5.5rem) 0 0}

/* ---------- buttons ---------- */
.cf-btn{display:inline-flex;align-items:center;justify-content:center;gap:.55rem;padding:.85rem 1.6rem;border-radius:999px;font-weight:800;border:0;cursor:pointer;transition:transform .35s var(--cf-ease),box-shadow .35s var(--cf-ease),background .25s;will-change:transform}
.cf-btn:hover{transform:translateY(-2px)}
.cf-btn--cream{background:var(--cf-crema-2);color:var(--cf-espresso);box-shadow:0 10px 30px -10px rgba(228,202,166,.7)}
.cf-btn--cream:hover{background:#f0d9b7;color:var(--cf-espresso)}
.cf-btn--ghost{background:transparent;color:var(--cf-cream);box-shadow:inset 0 0 0 1.5px rgba(245,236,223,.5)}
.cf-btn--ghost:hover{color:#fff;box-shadow:inset 0 0 0 1.5px #fff}
.cf-btn--dark{background:var(--cf-espresso);color:var(--cf-cream)}
.cf-btn--dark:hover{background:var(--cf-roast);color:#fff}
.cf-pill{display:inline-flex;align-items:center;gap:.35rem;padding:.45rem 1rem;border-radius:999px;border:1.5px solid var(--cf-line);background:#fff;color:var(--cf-roast);font-weight:700;font-size:.85rem}
.cf-pill:hover{border-color:var(--cf-roast);color:var(--cf-roast)}
.cf-pill--danger{color:#a3271f}
.cf-icon{display:inline-grid;place-items:center;width:42px;height:42px;border-radius:50%;border:0;background:transparent;color:var(--cf-cream);font-size:1.3rem;position:relative;transition:background .2s}
.cf-icon:hover{background:rgba(245,236,223,.12);color:#fff}

/* ---------- ribbon + header ---------- */
.cf-ribbon{display:flex;justify-content:center;gap:1.6rem;background:var(--cf-copper);color:#fff4e8;font-size:.78rem;font-weight:600;padding:.38rem .75rem;text-align:center}
.cf-ribbon i{margin-left:.3rem}
.cf-header{position:sticky;top:0;z-index:1030;background:rgba(27,17,12,.92);backdrop-filter:saturate(1.4) blur(14px);-webkit-backdrop-filter:saturate(1.4) blur(14px);border-bottom:1px solid rgba(200,162,122,.16);box-shadow:none!important;transition:background .3s}
.cf-header.is-scrolled{background:rgba(27,17,12,.98)}
.cf-header__bar{display:flex;align-items:center;gap:.6rem;min-height:var(--header-h);padding-inline:1rem}
.cf-logo{display:inline-flex;align-items:center;gap:.55rem;color:var(--cf-cream)!important}
.cf-logo__name{font-family:var(--cf-display);font-size:1.65rem;line-height:1;color:var(--cf-cream)}
.cf-logo__tag{font-size:.72rem;color:var(--cf-crema);border-inline-start:1px solid rgba(200,162,122,.35);padding-inline-start:.55rem}
.cf-nav{gap:.3rem;margin-inline-start:1.5rem;align-items:center}
.cf-nav__link{color:#e9dccb;font-weight:600;padding:.5rem .85rem;border-radius:999px;font-size:.92rem;position:relative}
.cf-nav__link:hover{color:#fff;background:rgba(245,236,223,.08)}
.cf-nav__link--hot{color:var(--cf-crema-2)}
.cf-nav__link--hot::after{content:"";position:absolute;top:.45rem;inset-inline-end:.35rem;width:6px;height:6px;border-radius:50%;background:var(--cf-copper);box-shadow:0 0 0 4px rgba(184,100,46,.25)}
.cf-nav__drop{position:relative}
.cf-nav__panel{position:absolute;top:calc(100% + 10px);inset-inline-start:0;min-width:240px;background:var(--cf-cream);border-radius:18px;padding:.5rem;box-shadow:var(--cf-sh);opacity:0;visibility:hidden;transform:translateY(8px);transition:.3s var(--cf-ease)}
.cf-nav__drop:hover .cf-nav__panel,.cf-nav__drop:focus-within .cf-nav__panel{opacity:1;visibility:visible;transform:none}
.cf-nav__panel a{display:flex;align-items:center;gap:.6rem;padding:.6rem .8rem;border-radius:12px;color:var(--cf-roast);font-weight:600}
.cf-nav__panel a:hover{background:#fff}
.cf-nav__panel a.all{color:var(--cf-copper);justify-content:space-between}
.cf-header__actions{display:flex;align-items:center;gap:.3rem;margin-inline-start:auto}
.cf-search{position:relative;display:flex;align-items:center;background:rgba(245,236,223,.08);border:1px solid rgba(200,162,122,.22);border-radius:999px;height:42px;padding-inline:.9rem;width:42px;overflow:visible;transition:width .45s var(--cf-ease),background .3s}
.cf-search>i{color:var(--cf-crema);flex:none}
.cf-search .search__input{background:transparent;border:0;color:var(--cf-cream);width:100%;padding:0 .5rem;outline:0;font-size:.9rem;min-width:0}
.cf-search .search__input::placeholder{color:rgba(233,220,203,.55)}
.cf-search:focus-within,.cf-search:hover{width:min(300px,52vw);background:rgba(245,236,223,.14)}
@media (min-width:992px){.cf-search{width:230px}}
.cf-search .search-suggest{top:calc(100% + 8px);inset-inline:0;border-radius:16px}
.cf-header .cart-btn__badge{background:var(--cf-copper);color:#fff}
.cf-menu{border-radius:16px;border:0;box-shadow:var(--cf-sh);padding:.4rem}
.cf-menu .dropdown-item{border-radius:10px;padding:.55rem .8rem}
.cf-drawer{background:var(--cf-espresso)!important;color:var(--cf-cream);--bs-offcanvas-bg:var(--cf-espresso)}
.cf-drawer__big{display:flex;flex-direction:column;margin:.5rem 0 1.5rem}
.cf-drawer__big a{font-family:var(--cf-display);font-size:1.9rem;color:var(--cf-cream);padding:.15rem 0;transition:color .2s,transform .3s var(--cf-ease)}
.cf-drawer__big a:hover{color:var(--cf-crema);transform:translateX(-6px)}
.cf-drawer .mobile-menu__title{color:var(--cf-crema)}
.cf-drawer__cats{display:flex;flex-wrap:wrap;gap:.45rem;margin-bottom:1.5rem}
.cf-drawer__cats a{padding:.4rem .85rem;border-radius:999px;border:1px solid rgba(200,162,122,.3);color:#e9dccb;font-size:.85rem}
.cf-drawer__cats a i{margin-left:.3rem}
.cf-drawer__foot a{display:flex;gap:.6rem;align-items:center;color:#cbb8a3;padding:.45rem 0}

/* ---------- hero ---------- */
.cf-hero{position:relative;overflow:hidden;background:radial-gradient(120% 90% at 20% 10%,#4a2b19 0%,#24150d 50%,#140c08 100%);color:var(--cf-cream);padding:2.6rem 0 4.5rem;isolation:isolate;min-height:min(92vh,820px);display:flex;align-items:center}
.cf-hero__bg{position:absolute;inset:-10% -5%;z-index:-1;background:
  radial-gradient(40% 35% at 75% 55%,rgba(200,162,122,.22),transparent 70%),
  radial-gradient(30% 25% at 15% 85%,rgba(184,100,46,.25),transparent 70%)}
.cf-hero__grid{display:grid;gap:2rem;align-items:center;padding-inline:1.1rem}
@media (min-width:992px){.cf-hero__grid{grid-template-columns:1.05fr .95fr}}
.cf .cf-hero__title{font-family:var(--cf-display);font-weight:400;font-size:clamp(2.7rem,11vw,5.6rem);line-height:1.12;color:var(--cf-cream);margin:.8rem 0 1rem}
.cf-hero__title em{font-style:normal;color:var(--cf-crema);position:relative;white-space:nowrap}
.cf-hero__title em::after{content:"";position:absolute;inset-inline:0;bottom:.08em;height:.12em;background:var(--cf-copper);border-radius:4px;transform-origin:right;animation:cfUnderline 1.4s .9s var(--cf-ease) both}
@keyframes cfUnderline{from{transform:scaleX(0)}to{transform:scaleX(1)}}
.cf-hero__lead{color:#d8c6b2;max-width:34rem;font-size:1.02rem;line-height:2}
.cf-hero__cta{display:flex;flex-wrap:wrap;gap:.7rem;margin:1.6rem 0 2rem}
.cf-hero__facts{display:flex;gap:1.8rem;list-style:none;padding:0;margin:0}
.cf-hero__facts b{display:block;font-family:var(--cf-latin);font-size:1.7rem;color:var(--cf-cream);line-height:1.1}
.cf-hero__facts span{font-size:.78rem;color:#bfa992}
.cf-hero__stage{position:relative;display:grid;place-items:center;order:-1}
@media (min-width:992px){.cf-hero__stage{order:0}}
.cf-cup{width:min(78vw,420px);height:auto;filter:drop-shadow(0 40px 50px rgba(0,0,0,.45))}
.cf-pour{stroke-dasharray:240;stroke-dashoffset:240;animation:cfPour 2.6s .3s var(--cf-ease) forwards}
@keyframes cfPour{0%{stroke-dashoffset:240;opacity:1}55%{stroke-dashoffset:0;opacity:1}100%{stroke-dashoffset:-240;opacity:0}}
.cf-crema{transform-origin:200px 243px;animation:cfFill 2.2s 1s var(--cf-ease) both}
@keyframes cfFill{from{transform:scale(.2);opacity:.4}to{transform:none;opacity:1}}
.cf-latte{transform-origin:200px 243px;animation:cfSwirl 9s 3s linear infinite}
@keyframes cfSwirl{to{transform:rotate(360deg)}}
.cf-steam path{stroke-dasharray:6 200;animation:cfSteam 3.6s ease-in-out infinite;opacity:0}
.cf-steam .s2{animation-delay:1.1s}.cf-steam .s3{animation-delay:2.2s}
@keyframes cfSteam{0%{transform:translateY(20px);opacity:0;stroke-dasharray:10 200}30%{opacity:.6}100%{transform:translateY(-50px);opacity:0;stroke-dasharray:160 200}}
.cf-hero__tag{position:relative;margin-top:-2rem;bottom:4%;inset-inline-start:2%;display:flex;flex-direction:column;background:rgba(245,236,223,.1);border:1px solid rgba(245,236,223,.2);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);padding:.75rem 1rem;border-radius:18px;color:var(--cf-cream);max-width:240px}
.cf-hero__tag small{color:var(--cf-crema);font-size:.72rem}.cf-hero__tag b{font-size:.95rem}.cf-hero__tag span{font-size:.75rem;color:#cdb9a3}
.cf-hero__beans{position:absolute;inset:0;z-index:-1;pointer-events:none}
.cf-bean{position:absolute;width:26px;height:36px;border-radius:50%;background:linear-gradient(135deg,#7b4a28,#2c170c);box-shadow:inset -3px -3px 6px rgba(0,0,0,.4);opacity:.75}
.cf-bean::after{content:"";position:absolute;inset:12% 46%;border-radius:40%;background:rgba(0,0,0,.55);transform:rotate(8deg)}
.cf-bean--1{top:12%;left:8%;transform:rotate(25deg)}.cf-bean--2{top:70%;left:4%;transform:rotate(-30deg) scale(.8)}
.cf-bean--3{top:20%;left:46%;transform:rotate(60deg) scale(.6);opacity:.4}.cf-bean--4{top:84%;left:38%;transform:rotate(10deg) scale(1.1)}
.cf-bean--5{top:8%;right:6%;transform:rotate(-50deg) scale(.9)}.cf-bean--6{top:58%;right:3%;transform:rotate(80deg) scale(1.2)}
.cf-bean--7{top:40%;left:25%;transform:rotate(-15deg) scale(.5);opacity:.35}.cf-bean--8{top:90%;right:24%;transform:rotate(40deg) scale(.7)}
.cf-bean--9{top:35%;right:40%;transform:rotate(-70deg) scale(.45);opacity:.3}
.cf-hero__scroll{position:absolute;bottom:1.2rem;left:50%;width:24px;height:38px;border:2px solid rgba(245,236,223,.4);border-radius:14px;transform:translateX(-50%)}
.cf-hero__scroll span{position:absolute;top:7px;left:50%;width:4px;height:8px;margin-left:-2px;border-radius:2px;background:var(--cf-crema);animation:cfScroll 1.8s infinite}
@keyframes cfScroll{0%{opacity:0;transform:translateY(0)}40%{opacity:1}100%{opacity:0;transform:translateY(12px)}}

/* ---------- marquee ---------- */
.cf-marquee{background:var(--cf-crema-2);color:var(--cf-roast);overflow:hidden;padding:.9rem 0;transform:rotate(-1.2deg);margin:-1.2rem -2% 0;width:104%;position:relative;z-index:2}
.cf-marquee__track{display:flex;gap:0;width:max-content;animation:cfMarquee var(--cf-mq-dur,40s) linear infinite;will-change:transform;transform:translate3d(0,0,0);backface-visibility:hidden;contain:layout paint;font-family:var(--cf-display);font-size:1.35rem;white-space:nowrap}
.cf-marquee__track i{font-style:normal;color:var(--cf-copper)}
.cf-marquee__group{display:flex;flex:0 0 auto;align-items:center;gap:1.4rem;padding-inline-end:1.4rem;text-shadow:none}
.cf-marquee:hover .cf-marquee__track{animation-play-state:paused}
/* RTL: groups flow right-to-left; moving the track +x by exactly one group (50%) wraps seamlessly */
@keyframes cfMarquee{from{transform:translate3d(0,0,0)}to{transform:translate3d(50%,0,0)}}
[dir=ltr] .cf-marquee__track{animation-direction:reverse}

/* ---------- roast spectrum ---------- */
.cf-spectrum{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:.5rem;list-style:none;padding:0;margin:0}
.cf-spectrum__item{display:flex;flex-direction:column;align-items:center;gap:.35rem;padding:1.1rem .3rem 1rem;border-radius:var(--cf-r);text-align:center;color:#fff;transition:transform .45s var(--cf-ease),box-shadow .45s;height:100%}
.cf-spectrum__item b{font-size:.78rem;line-height:1.4}.cf-spectrum__item small{font-size:.7rem;opacity:.75}
.cf-spectrum__item:hover{transform:translateY(-6px);box-shadow:var(--cf-sh);color:#fff}
.cf-spectrum__item--1{background:#b98a5e}.cf-spectrum__item--2{background:#9a6a40}.cf-spectrum__item--3{background:#7a4c2a}
.cf-spectrum__item--4{background:#55321b}.cf-spectrum__item--5{background:#2b170d}
.cf-spectrum__bean{width:30px;height:42px;border-radius:50%;background:rgba(0,0,0,.25);position:relative;box-shadow:inset 2px 2px 0 rgba(255,255,255,.15)}
.cf-spectrum__bean::after{content:"";position:absolute;inset:12% 46%;background:rgba(0,0,0,.35);border-radius:40%}
@media (min-width:768px){.cf-spectrum{gap:1rem}.cf-spectrum__item{padding:1.8rem .8rem}.cf-spectrum__item b{font-size:.95rem}.cf-spectrum__bean{width:44px;height:60px}}

/* ---------- product card ---------- */
.cf-card{position:relative;background:#fff;border-radius:var(--cf-r);overflow:hidden;border:1px solid var(--cf-line);display:flex;flex-direction:column;height:100%;transition:transform .5s var(--cf-ease),box-shadow .5s var(--cf-ease);transform-style:preserve-3d;box-shadow:none}
.cf-card:hover{box-shadow:var(--cf-sh)}
.cf-card__media{position:relative;display:block;aspect-ratio:1/1.05;background:radial-gradient(80% 70% at 50% 40%,#f6ead9,#ead8bf);overflow:hidden}
.cf-card__media .pcard__img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .9s var(--cf-ease),opacity .5s}
.cf-card:hover .cf-card__media .pcard__img:not(.pcard__img--hover){transform:scale(1.07) rotate(-1deg)}
.cf-card .pcard__img--hover{opacity:0}.cf-card:hover .pcard__img--hover{opacity:1}
.cf-card__off{position:absolute;top:.7rem;inset-inline-start:.7rem;z-index:2;background:var(--cf-copper)!important;color:#fff;border-radius:999px;padding:.2rem .6rem;font-size:.75rem}
.cf-card__origin{position:absolute;bottom:.7rem;inset-inline-start:.7rem;z-index:2;background:rgba(27,17,12,.78);color:var(--cf-cream);font-size:.72rem;padding:.25rem .6rem;border-radius:999px;backdrop-filter:blur(6px)}
.cf-card__origin i{margin-left:.2rem}
.cf-card .pcard__heart{position:absolute;top:.6rem;inset-inline-end:.6rem;z-index:3}
.cf-card .heart-btn{background:rgba(255,255,255,.9);border-radius:50%;width:36px;height:36px}
.cf-card__body{padding:.85rem .9rem 1rem;display:flex;flex-direction:column;gap:.4rem;flex:1}
.cf-card__title{font-size:.95rem;font-weight:800;line-height:1.6;margin:0}
.cf-card__title a{color:var(--cf-ink)}
.cf-card__desc{font-size:.8rem;color:var(--cf-muted);margin:0}
.cf-card__foot{display:flex;align-items:flex-end;justify-content:space-between;gap:.5rem;margin-top:auto}
.cf-card .pcard__price del{font-size:.75rem;color:#a8988b}
.cf-card .pcard__final b{font-size:1.05rem;color:var(--cf-roast);font-weight:900}
.cf-card .pcard__final small{font-size:.7rem;color:var(--cf-muted);margin-inline-start:.2rem}
.cf-card .pcard__final .from{margin-inline-end:.25rem;margin-inline-start:0}
.cf-card .pcard__quick{position:static;opacity:1;transform:none}
.cf-add{width:42px;height:42px;border-radius:50%;border:0;background:var(--cf-roast);color:var(--cf-cream);display:grid;place-items:center;font-size:1.1rem;transition:transform .4s var(--cf-ease),background .25s}
.cf-add:hover{background:var(--cf-copper);transform:rotate(90deg) scale(1.06)}
.cf-roast{display:flex;align-items:center;gap:3px}
.cf-roast i{width:14px;height:6px;border-radius:3px;background:#eadccb}
.cf-roast i.on{background:var(--cf-mocha)}
.cf-roast small{font-size:.7rem;color:var(--cf-muted);margin-inline-start:.35rem}
.cf-notes{display:flex;flex-wrap:wrap;gap:.3rem;list-style:none;padding:0;margin:0}
.cf-notes li{font-size:.7rem;padding:.12rem .55rem;border-radius:999px;background:var(--cf-cream);color:var(--cf-mocha)}
.cf-notes--lg li{font-size:.85rem;padding:.3rem .85rem;background:#fff;border:1px solid var(--cf-line)}
.pcard--soldout .cf-card__media img{filter:grayscale(.7);opacity:.6}

/* rails & grids */
.cf-rail{display:grid;grid-auto-flow:column;grid-auto-columns:min(72%,260px);gap:.9rem;overflow-x:auto;scroll-snap-type:x mandatory;padding:.3rem 1rem 1.2rem;margin-inline:-1rem;scrollbar-width:none}
.cf-rail::-webkit-scrollbar{display:none}
.cf-rail__item{scroll-snap-align:start}
@media (min-width:992px){.cf-rail{grid-auto-columns:calc((100% - 3*1.2rem)/4.3);gap:1.2rem}}
.cf-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.75rem}
@media (min-width:768px){.cf-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:1.1rem}}
@media (min-width:1200px){.cf-grid{grid-template-columns:repeat(4,minmax(0,1fr))}}
@media (min-width:768px){.cf-grid--3{grid-template-columns:repeat(3,minmax(0,1fr))}}
.cf-grid--2{grid-template-columns:repeat(2,minmax(0,1fr))!important}

/* ---------- origin band ---------- */
.cf-origin{position:relative;margin-top:clamp(2.5rem,7vw,5.5rem);background:var(--cf-sage);color:#f3f1e7;overflow:hidden;padding:clamp(3rem,8vw,6rem) 0}
.cf-origin__layer{position:absolute;inset:-20% -10%;background:repeating-radial-gradient(circle at 80% 30%,rgba(255,255,255,.06) 0 2px,transparent 2px 40px)}
.cf-origin__inner{position:relative;display:grid;gap:2rem;padding-inline:1.1rem}
@media (min-width:992px){.cf-origin__inner{grid-template-columns:1fr 1fr;align-items:center}}
.cf .cf-origin h2{font-family:var(--cf-display);font-weight:400;font-size:clamp(2rem,6vw,3.4rem);color:#fff}
.cf-origin p{color:#e3e8dc;max-width:32rem}
.cf-origin__list{display:flex;flex-wrap:wrap;gap:.6rem;list-style:none;margin:0;padding:0}
.cf-origin__list a{display:inline-block;padding:.6rem 1.15rem;border-radius:999px;border:1.5px solid rgba(255,255,255,.4);color:#fff;font-weight:700;transition:.3s var(--cf-ease)}
.cf-origin__list a:hover{background:#fff;color:var(--cf-sage)}

/* ---------- subscription teaser ---------- */
.cf-subteaser__box{display:grid;gap:1.6rem;background:var(--cf-crema-2);border-radius:var(--cf-r-lg);padding:clamp(1.5rem,5vw,3.5rem);position:relative;overflow:hidden}
.cf-subteaser__box::after{content:"";position:absolute;width:340px;height:340px;border-radius:50%;border:40px solid rgba(59,34,20,.07);top:-120px;left:-100px}
@media (min-width:992px){.cf-subteaser__box{grid-template-columns:1.2fr 1fr;align-items:center}}
.cf .cf-subteaser h2{font-family:var(--cf-display);font-weight:400;font-size:clamp(1.8rem,5vw,3rem)}
.cf-subteaser__plans{list-style:none;padding:0;margin:0;display:grid;gap:.6rem;position:relative;z-index:1}
.cf-subteaser__plans li{display:grid;grid-template-columns:1fr auto;grid-template-areas:"n o" "e o";background:#fff8ef;border-radius:18px;padding:.9rem 1.1rem;transition:transform .4s var(--cf-ease)}
.cf-subteaser__plans li:hover{transform:translateX(-6px)}
.cf-subteaser__plans li.is-hot{background:var(--cf-espresso);color:var(--cf-cream)}
.cf-subteaser__plans b{grid-area:n}.cf-subteaser__plans span{grid-area:e;font-size:.8rem;opacity:.75}
.cf-subteaser__plans em{grid-area:o;align-self:center;font-style:normal;font-weight:900;color:var(--cf-copper);font-size:1.05rem}
.cf-subteaser__plans li.is-hot em{color:var(--cf-crema-2)}

/* ---------- quiz CTA ---------- */
.cf-quizcta__inner{display:grid;gap:1.5rem;align-items:center;background:var(--cf-espresso);color:var(--cf-cream);border-radius:var(--cf-r-lg);padding:clamp(1.6rem,5vw,3.2rem);margin-inline:1rem}
@media (min-width:768px){.cf-quizcta__inner{grid-template-columns:220px 1fr;margin-inline:auto}}
.cf .cf-quizcta h2{color:var(--cf-cream);font-family:var(--cf-display);font-weight:400;font-size:clamp(1.7rem,5vw,2.6rem)}
.cf-quizcta p{color:#cdb9a3}
.cf-quizcta__cups{display:flex;gap:.6rem;justify-content:center;align-items:flex-end;height:120px}
.cf-quizcta__cups span{width:54px;border-radius:6px 6px 22px 22px;background:var(--cf-crema);animation:cfBob 3s ease-in-out infinite}
.cf-quizcta__cups span:nth-child(1){height:60px;background:#b98a5e}.cf-quizcta__cups span:nth-child(2){height:90px;animation-delay:.3s;background:#7a4c2a}.cf-quizcta__cups span:nth-child(3){height:72px;animation-delay:.6s;background:#3b2214;box-shadow:inset 0 0 0 2px #6e4325}
@keyframes cfBob{50%{transform:translateY(-8px)}}

/* ---------- brew cards ---------- */
.cf-brews{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.75rem}
@media (min-width:768px){.cf-brews{grid-template-columns:repeat(3,minmax(0,1fr));gap:1.1rem}}
.cf-brew{display:flex;flex-direction:column;gap:.3rem;padding:1.2rem;border-radius:var(--cf-r);background:#fff;border:1px solid var(--cf-line);color:var(--cf-text);transition:transform .5s var(--cf-ease),background .3s,color .3s;height:100%}
.cf-brew:hover{transform:translateY(-6px);background:var(--cf-roast);color:var(--cf-cream)}
.cf-brew:hover b{color:#fff}.cf-brew:hover small{color:#d8c6b2}
.cf-brew__icon{width:52px;height:52px;border-radius:16px;display:grid;place-items:center;background:var(--cf-cream);color:var(--cf-roast);font-size:1.5rem;margin-bottom:.5rem;transition:transform .5s var(--cf-ease)}
.cf-brew:hover .cf-brew__icon{transform:rotate(-12deg)}
.cf-brew b{font-size:1.05rem;color:var(--cf-ink)}.cf-brew small{color:var(--cf-muted);font-size:.8rem}
.cf-brew__meta{display:flex;flex-wrap:wrap;gap:.35rem;margin-top:auto;padding-top:.6rem}
.cf-brew__meta span{font-size:.72rem;padding:.15rem .55rem;border-radius:999px;background:rgba(200,162,122,.2)}
.cf-brew__meta i{margin-left:.2rem}
.cf-brew__diff{display:flex;gap:3px;margin-top:.5rem}.cf-brew__diff i{width:18px;height:5px;border-radius:3px;background:var(--cf-line)}.cf-brew__diff i.on{background:var(--cf-copper)}

/* ---------- posts / promise ---------- */
.cf-posts{display:grid;gap:1rem}
@media (min-width:768px){.cf-posts{grid-template-columns:repeat(2,1fr)}}
@media (min-width:1200px){.cf-posts{grid-template-columns:repeat(4,1fr)}}
.cf .post-card{border-radius:var(--cf-r);border:1px solid var(--cf-line);overflow:hidden;background:#fff}
.cf-promise{padding-bottom:3rem}
.cf-promise__list{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(2,1fr);gap:.75rem}
@media (min-width:992px){.cf-promise__list{grid-template-columns:repeat(4,1fr)}}
.cf-promise__list li{display:flex;flex-direction:column;gap:.2rem;padding:1.2rem;border-radius:var(--cf-r);background:var(--cf-cream)}
.cf-promise__list i{font-size:1.6rem;color:var(--cf-copper)}
.cf-promise__list b{color:var(--cf-ink)}.cf-promise__list span{font-size:.8rem;color:var(--cf-muted)}

/* ---------- footer ---------- */
.cf-footer{background:var(--cf-espresso)!important;color:#cbb8a3;margin-top:4rem;position:relative;border:0}
.cf-footer__wave{position:absolute;top:-79px;inset-inline:0;height:80px;line-height:0}
.cf-footer__wave svg{width:100%;height:100%;fill:var(--cf-espresso)}
.cf-footer .footer-main{background:transparent;border:0}
.cf-footer .footer-title{color:var(--cf-cream)}
.cf-footer .footer-links a,.cf-footer .footer-contact a{color:#cbb8a3}
.cf-footer .footer-links a:hover{color:var(--cf-crema-2)}
.cf-footer .footer-about{color:#a89380}
.cf-footer .footer-bottom{background:#120b07;color:#8f7b69;border:0}
.cf-footer .footer-social a{background:rgba(245,236,223,.08);color:var(--cf-cream)}
.cf-footer__big{font-family:var(--cf-display);font-size:clamp(4rem,22vw,15rem);line-height:.9;color:rgba(200,162,122,.08);text-align:center;margin:-1rem 0 1rem;user-select:none}
.cf-news{background:var(--cf-roast)!important;border-radius:var(--cf-r-lg)!important;color:var(--cf-cream);transform:translateY(-1.5rem);border:0!important}
.cf-news h2{color:var(--cf-cream)!important;font-family:var(--cf-display);font-weight:400;font-size:1.8rem}
.cf-news p{color:#d8c6b2}
.cf-news .newsletter__form button{background:var(--cf-crema-2)!important;color:var(--cf-espresso)!important}
.cf-logo--footer .cf-logo__name{font-size:2rem}

/* ---------- mobile dock ---------- */
.cf-dock{background:rgba(27,17,12,.94)!important;backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border:0!important;border-radius:22px 22px 0 0;padding-bottom:env(safe-area-inset-bottom)}
.cf-dock .bottom-nav__item{color:#bfa992}
.cf-dock .bottom-nav__item.active{color:var(--cf-crema-2)}
.cf-dock .bottom-nav__item--hot i{background:var(--cf-copper);color:#fff;border-radius:50%;width:44px;height:44px;display:grid;place-items:center;margin-top:-22px;box-shadow:0 8px 20px -6px rgba(184,100,46,.8)}

/* ---------- page heroes (subscribe, quiz, brew) ---------- */
.cf-pagehero{background:linear-gradient(160deg,#2c190f,#140c08);color:var(--cf-cream);padding:clamp(2.4rem,7vw,4.5rem) 0 clamp(3rem,8vw,5rem);position:relative;overflow:hidden}
.cf-pagehero::after{content:"";position:absolute;width:420px;height:420px;border-radius:50%;background:radial-gradient(circle,rgba(200,162,122,.25),transparent 65%);top:-140px;left:-120px}
.cf-pagehero>div{position:relative;z-index:1;padding-inline:1.1rem}
.cf .cf-pagehero h1{color:var(--cf-cream);font-size:clamp(2.2rem,8vw,4rem);margin:.6rem 0}
.cf-pagehero p{color:#d8c6b2;max-width:38rem}
.cf-pagehero--sub{background:linear-gradient(160deg,#6e4325,#2c190f)}
.cf-pagehero--quiz{background:linear-gradient(160deg,#55704f,#26331f)}
.cf-back{color:var(--cf-crema);font-size:.85rem;display:inline-block;margin-bottom:.8rem}
.cf-subhero{display:grid;gap:2rem}
@media (min-width:992px){.cf-subhero{grid-template-columns:1.3fr 1fr;align-items:end}}
.cf-subhero__how{list-style:none;padding:0;margin:0;display:grid;gap:.6rem}
.cf-subhero__how li{display:flex;gap:.8rem;align-items:center;background:rgba(245,236,223,.08);border:1px solid rgba(245,236,223,.15);border-radius:16px;padding:.75rem 1rem}
.cf-subhero__how b{display:grid;place-items:center;width:34px;height:34px;border-radius:50%;background:var(--cf-crema-2);color:var(--cf-espresso)}

/* ---------- subscribe form ---------- */
.cf-subform{display:grid;gap:2rem;margin-top:-2.5rem;position:relative;z-index:2}
@media (min-width:992px){.cf-subform{grid-template-columns:1fr 320px;align-items:start}.cf-subform__step{grid-column:1}.cf-subsum{grid-column:2;grid-row:1/span 3;position:sticky;top:calc(var(--header-h) + 1.5rem)}}
.cf-subform__step{background:#fff;border:1px solid var(--cf-line);border-radius:var(--cf-r-lg);padding:clamp(1.1rem,3vw,2rem)}
.cf-plans{display:grid;gap:.75rem}
@media (min-width:768px){.cf-plans{grid-template-columns:repeat(3,1fr)}}
.cf-plan input,.cf-subcoffee input,.cf-quiz__opt input,.cf-chipsel input,.cf-roastpick input{position:absolute;opacity:0;pointer-events:none}
.cf-plan__box{position:relative;display:flex;flex-direction:column;gap:.25rem;padding:1.2rem;border-radius:20px;border:2px solid var(--cf-line);cursor:pointer;height:100%;transition:.3s var(--cf-ease)}
.cf-plan__box b{font-size:1.15rem;color:var(--cf-ink)}
.cf-plan__every{font-size:.82rem;color:var(--cf-muted)}
.cf-plan__off{font-family:var(--cf-display);font-size:1.7rem;color:var(--cf-copper);line-height:1.3}
.cf-plan__box small{color:var(--cf-muted)}.cf-plan__ship{color:var(--cf-sage)!important;font-weight:700}
.cf-plan__flag{position:absolute;top:-.7rem;inset-inline-end:1rem;background:var(--cf-copper);color:#fff;font-style:normal;font-size:.7rem;font-weight:800;padding:.15rem .6rem;border-radius:999px}
.cf-plan input:checked+.cf-plan__box{border-color:var(--cf-roast);background:var(--cf-cream);box-shadow:var(--cf-sh)}
.cf-plan input:focus-visible+.cf-plan__box,.cf-subcoffee input:focus-visible+.cf-subcoffee__box,.cf-quiz__opt input:focus-visible+span{outline:3px solid rgba(184,100,46,.55)}
.cf-subcoffees{display:grid;gap:.6rem}
@media (min-width:768px){.cf-subcoffees{grid-template-columns:repeat(2,1fr)}}
.cf-subcoffee__box{display:flex;gap:.8rem;align-items:center;padding:.6rem;border-radius:18px;border:2px solid var(--cf-line);cursor:pointer;transition:.25s}
.cf-subcoffee__box img{width:64px;height:64px;border-radius:14px;object-fit:cover}
.cf-subcoffee__box b{display:block;color:var(--cf-ink);font-size:.92rem}.cf-subcoffee__box small{color:var(--cf-muted);font-size:.78rem}
.cf-subcoffee input:checked+.cf-subcoffee__box{border-color:var(--cf-roast);background:var(--cf-cream)}
.cf-select{border-radius:14px;border:1.5px solid var(--cf-line);padding:.7rem .9rem}
.cf-subsum{background:var(--cf-espresso);color:var(--cf-cream);border-radius:var(--cf-r-lg);padding:1.5rem;display:grid;gap:1rem}
.cf-subsum small{display:block;color:#bfa992;font-size:.78rem}.cf-subsum b{font-size:1.25rem;color:#fff}
.cf-subsum__save b{color:var(--cf-crema-2)}
@media (max-width:991.98px){.cf-subsum{position:sticky;bottom:calc(72px + env(safe-area-inset-bottom));z-index:5;grid-template-columns:1fr 1fr;gap:.5rem;padding:1rem}.cf-subsum .cf-btn{grid-column:1/-1}.cf-subsum__save{display:none}}

/* ---------- my subscriptions ---------- */
.cf-mysub{display:grid;gap:.6rem;background:#fff;border:1px solid var(--cf-line);border-radius:var(--cf-r);padding:1rem 1.2rem;margin-bottom:.8rem}
@media (min-width:992px){.cf-mysub{grid-template-columns:2fr auto 1.2fr 2fr;align-items:center}}
.cf-mysub__main b{display:block;color:var(--cf-ink)}.cf-mysub__main small,.cf-mysub__next small{color:var(--cf-muted);font-size:.8rem;display:block}
.cf-mysub__status{justify-self:start;font-size:.78rem;font-weight:800;padding:.2rem .7rem;border-radius:999px;background:var(--cf-cream);color:var(--cf-mocha)}
.cf-mysub--active .cf-mysub__status{background:#e4eddf;color:#3f5e3b}
.cf-mysub--canceled{opacity:.6}
.cf-mysub__actions{display:flex;flex-wrap:wrap;gap:.4rem;justify-content:flex-end}

/* ---------- quiz ---------- */
.cf-quiz{margin-top:-2.5rem;position:relative;z-index:2;padding-bottom:2rem}
.cf-quiz__form{display:grid;gap:1rem}
.cf-quiz__q{background:#fff;border:1px solid var(--cf-line);border-radius:var(--cf-r-lg);padding:1.3rem}
.cf-quiz__q legend{font-weight:800;color:var(--cf-ink);font-size:1.05rem;display:flex;gap:.6rem;align-items:center;margin-bottom:.9rem;float:none}
.cf-quiz__q legend span{display:grid;place-items:center;width:30px;height:30px;border-radius:50%;background:var(--cf-sage);color:#fff;font-size:.85rem}
.cf-quiz__opts{display:grid;grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:.5rem}
.cf-quiz__opt span{display:flex;align-items:center;gap:.5rem;padding:.8rem 1rem;border-radius:16px;border:2px solid var(--cf-line);cursor:pointer;font-weight:600;transition:.25s var(--cf-ease);height:100%}
.cf-quiz__opt span i{font-size:1.2rem;color:var(--cf-copper)}
.cf-quiz__opt input:checked+span{border-color:var(--cf-sage);background:#eef3ea;transform:scale(1.02)}
.cf-quiz__submit{justify-self:center;margin-top:.5rem}
.cf-quiz__results{margin-top:3rem}

/* ---------- brew detail ---------- */
.cf-brewstats{list-style:none;padding:0;margin:-4.5rem 0 0;display:grid;grid-template-columns:repeat(2,1fr);gap:.7rem;position:relative;z-index:2}
@media (min-width:768px){.cf-brewstats{grid-template-columns:repeat(4,1fr)}}
.cf-brewstats li{background:#fff;border:1px solid var(--cf-line);border-radius:var(--cf-r);padding:1rem;display:flex;flex-direction:column}
.cf-brewstats i{font-size:1.4rem;color:var(--cf-copper)}.cf-brewstats small{color:var(--cf-muted)}.cf-brewstats b{color:var(--cf-ink)}
.cf-steps{list-style:none;padding:0;margin:0;counter-reset:s}
.cf-steps li{display:flex;gap:1rem;padding:1rem 0;border-bottom:1px dashed var(--cf-line)}
.cf-steps li span{flex:none;display:grid;place-items:center;width:40px;height:40px;border-radius:50%;background:var(--cf-roast);color:var(--cf-cream);font-weight:800}
.cf-steps li p{margin:0;padding-top:.45rem}
.cf-brewothers{display:flex;flex-wrap:wrap;gap:.5rem;margin-top:2rem}
.cf-brewothers a{padding:.5rem 1rem;border-radius:999px;background:var(--cf-cream);color:var(--cf-roast);font-weight:700}
.cf-brewothers i{margin-left:.3rem}

/* ---------- listing ---------- */
.cf-listhero{background:var(--cf-espresso);color:var(--cf-cream);padding:1.6rem 0 2.6rem;margin-bottom:-1.4rem;overflow:hidden}
.cf-listhero .container-xxl{padding-inline:1.1rem}
.cf .cf-listhero__title{font-family:var(--cf-display);font-size:clamp(2rem,7vw,3.6rem);color:var(--cf-cream);line-height:1.2}
.page-list .list-head,.page-list .sort-bar{border-radius:18px;background:#fff}
.page-list .list-head__title{font-size:1.05rem}
.page-list .product-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.75rem}
@media (min-width:768px){.page-list .product-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:1rem}}
.page-list .product-grid.is-list{grid-template-columns:1fr}
.page-list .product-grid.is-list .cf-card{flex-direction:row}
.page-list .product-grid.is-list .cf-card__media{width:38%;flex:none;aspect-ratio:auto}
.page-list .filters,.page-list .filters-canvas .offcanvas-body{border-radius:var(--cf-r)}
.page-list .filter-group summary{font-weight:800;color:var(--cf-ink)}
.page-list .sort-bar__item.active{background:var(--cf-roast);color:var(--cf-cream)}
.page-list .btn-filter-toggle{border-radius:999px;background:var(--cf-roast);color:var(--cf-cream);border:0}
.cf-roastpick{display:grid;grid-template-columns:repeat(5,1fr);gap:.3rem}
.cf-roastpick__opt span{display:flex;align-items:flex-end;justify-content:center;height:58px;border-radius:12px;color:#fff;font-size:.6rem;text-align:center;padding:.3rem .15rem;cursor:pointer;line-height:1.3;border:2px solid transparent;transition:.2s}
.cf-roastpick__opt--1 span{background:#b98a5e}.cf-roastpick__opt--2 span{background:#9a6a40}.cf-roastpick__opt--3 span{background:#7a4c2a}.cf-roastpick__opt--4 span{background:#55321b}.cf-roastpick__opt--5 span{background:#2b170d}
.cf-roastpick input:checked+span{border-color:var(--cf-copper);box-shadow:0 0 0 2px #fff inset;transform:translateY(-3px)}
.cf-chipsel{display:flex;flex-wrap:wrap;gap:.35rem}
.cf-chipsel span{display:inline-flex;gap:.3rem;align-items:center;padding:.35rem .75rem;border-radius:999px;border:1.5px solid var(--cf-line);font-size:.8rem;cursor:pointer}
.cf-chipsel input:checked+span{background:var(--cf-roast);border-color:var(--cf-roast);color:var(--cf-cream)}
.cf .filter-chip{background:var(--cf-cream);color:var(--cf-roast);border-radius:999px}

/* ---------- product page ---------- */
.cf-pdp{display:grid;gap:1.4rem;margin-top:.5rem}
@media (min-width:992px){.cf-pdp{grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);grid-template-areas:"g i" "g b";column-gap:2.6rem;align-items:start}
  .cf-pdp__gallery{grid-area:g;position:sticky;top:calc(var(--header-h) + 1rem)}.cf-pdp__info{grid-area:i}.cf-pdp__buy{grid-area:b}}
.cf-gallery{display:flex;flex-direction:column;gap:.7rem}
.cf-gallery__stage{position:relative;border-radius:var(--cf-r-lg);overflow:hidden;aspect-ratio:1/1;display:grid;place-items:center;
  background:radial-gradient(70% 60% at 50% 45%,#f6ead9,color-mix(in srgb,#b98a5e calc(var(--roast,3)*14%),#ead8bf))}
.cf-gallery__stage img{width:100%;height:100%;object-fit:cover;position:relative;z-index:1}
.cf-gallery__halo{position:absolute;width:70%;aspect-ratio:1;border-radius:50%;background:radial-gradient(circle,rgba(255,255,255,.6),transparent 70%);z-index:0;animation:cfHalo 6s ease-in-out infinite}
@keyframes cfHalo{50%{transform:scale(1.12)}}
.cf-gallery__thumbs{display:flex;gap:.5rem;overflow-x:auto;flex-direction:row!important}
.cf-gallery__thumbs .gallery__thumb{width:68px;height:68px;border-radius:16px;overflow:hidden;border:2px solid transparent;flex:none;padding:0;background:var(--cf-cream)}
.cf-gallery__thumbs .gallery__thumb.active{border-color:var(--cf-roast)}
.cf-pdp__titlebar{display:flex;justify-content:space-between;gap:1rem;align-items:flex-start}
.cf-pdp__title{font-family:var(--cf-display);font-weight:400;font-size:clamp(1.9rem,6vw,3rem);line-height:1.25;margin:.3rem 0 .2rem}
.cf-pdp__en{font-family:var(--cf-latin);font-style:italic;color:var(--cf-muted);font-size:1.05rem}
.cf-pdp__meta{display:flex;flex-wrap:wrap;gap:.4rem 1.2rem;font-size:.85rem;color:var(--cf-muted);margin:.8rem 0}
.cf-pdp__lead{font-size:1rem;line-height:2;color:var(--cf-text)}
.cf-profile{display:grid;gap:1.1rem;padding:1.3rem;border-radius:var(--cf-r-lg);background:var(--cf-cream);margin-top:1rem}
.cf-profile__label{display:flex;justify-content:space-between;font-size:.85rem;margin-bottom:.45rem}.cf-profile__label b{color:var(--cf-roast)}
.cf-roastbar{position:relative;height:12px;border-radius:999px;background:linear-gradient(90deg,#c39667,#9a6a40,#6e4325,#43260f,#1e0f07)}
[dir="rtl"] .cf-roastbar{background:linear-gradient(-90deg,#c39667,#9a6a40,#6e4325,#43260f,#1e0f07)}
.cf-roastbar i{position:absolute;top:50%;width:22px;height:22px;margin-top:-11px;border-radius:50%;background:#fff;border:4px solid var(--cf-copper);box-shadow:0 4px 10px rgba(0,0,0,.25);transition:inset-inline-start 1.2s var(--cf-ease)}
.cf-roastbar__ends{display:flex;justify-content:space-between;font-size:.72rem;color:var(--cf-muted);margin-top:.3rem}
.cf-flavor{list-style:none;padding:0;margin:0;display:grid;gap:.5rem}
.cf-flavor li{display:grid;grid-template-columns:62px 1fr 40px;align-items:center;gap:.6rem;font-size:.82rem}
.cf-flavor b{font-size:.75rem;color:var(--cf-muted);text-align:left}
.cf-flavor__track{height:8px;border-radius:999px;background:#fff;overflow:hidden}
.cf-flavor__track i{display:block;height:100%;width:calc(var(--v)*20%);background:linear-gradient(90deg,var(--cf-crema),var(--cf-mocha));border-radius:inherit;transform-origin:right;transition:transform 1.2s var(--cf-ease)}
.cf-facts{display:grid;grid-template-columns:repeat(2,1fr);gap:.6rem;margin:0}
.cf-facts div{background:#fff;border-radius:14px;padding:.55rem .75rem}
.cf-facts dt{font-size:.7rem;color:var(--cf-muted);font-weight:500}.cf-facts dd{margin:0;font-weight:800;color:var(--cf-ink);font-size:.88rem}
.cf-profile__brews{display:flex;flex-wrap:wrap;gap:.4rem;align-items:center;font-size:.85rem}
.cf-profile__brews a{padding:.3rem .8rem;border-radius:999px;background:var(--cf-roast);color:var(--cf-cream);font-size:.8rem}
.cf-profile__brews a i{margin-left:.25rem}
.cf-buybox{background:#fff;border:1px solid var(--cf-line);border-radius:var(--cf-r-lg);padding:1.3rem}
.cf-buybox .vpicker .vopt,.cf-buybox .vchip{border-radius:14px}
.cf-buybox .buybox__final b{font-size:1.7rem;color:var(--cf-roast)}
.cf-subcta{display:flex;align-items:center;gap:.8rem;margin-top:.8rem;padding:1rem 1.1rem;border-radius:20px;background:var(--cf-espresso);color:var(--cf-cream);transition:transform .4s var(--cf-ease)}
.cf-subcta:hover{transform:translateY(-3px);color:#fff}
.cf-subcta>i:first-child{font-size:1.6rem;color:var(--cf-crema-2)}
.cf-subcta b{display:block}.cf-subcta small{color:#bfa992}
.cf-subcta div{flex:1}
.cf-assure{list-style:none;padding:0;margin:1rem 0 0;display:grid;gap:.4rem;font-size:.82rem;color:var(--cf-muted)}
.cf-assure i{color:var(--cf-copper);margin-left:.4rem}
.cf .mobile-buybar{background:var(--cf-espresso);color:var(--cf-cream);border-radius:20px 20px 0 0}
.cf .mobile-buybar .mobile-buybar__price b{color:#fff}.cf .mobile-buybar small{color:#bfa992}
.cf .mobile-buybar .btn-primary{background:var(--cf-crema-2);color:var(--cf-espresso);border:0}
.cf .tabs-card{margin-top:2.5rem}
.cf .pdp-tabs .nav-link.active{color:var(--cf-roast);border-color:var(--cf-copper)}

/* ---------- motion: reveal (JS adds .is-in); static when reduced / no-js ---------- */
.js [data-reveal]{opacity:0;transform:translateY(34px);transition:opacity 1s var(--cf-ease),transform 1s var(--cf-ease)}
.js [data-reveal].is-in{opacity:1;transform:none}
.js [data-stagger]>*{opacity:0;transform:translateY(28px) scale(.98);transition:opacity .8s var(--cf-ease),transform .8s var(--cf-ease);transition-delay:calc(var(--i,0)*70ms)}
.js [data-stagger].is-in>*{opacity:1;transform:none}
.js [data-hero-in]{opacity:0;transform:translateY(24px)}
.js .cf-motion-ready [data-hero-in],.cf-motion-ready [data-hero-in]{opacity:1;transform:none;transition:opacity 1.1s var(--cf-ease),transform 1.1s var(--cf-ease)}
.cf-word{display:inline-block;opacity:0;transform:translateY(.6em) rotate(4deg);transition:opacity .9s var(--cf-ease),transform .9s var(--cf-ease)}
.cf-motion-ready .cf-word{opacity:1;transform:none}
/* page transition (View Transitions API, progressive) */
@view-transition{navigation:auto}
::view-transition-old(root){animation:cfVtOut .35s var(--cf-ease) both}
::view-transition-new(root){animation:cfVtIn .5s var(--cf-ease) both}
@keyframes cfVtOut{to{opacity:0;transform:translateY(-12px)}}
@keyframes cfVtIn{from{opacity:0;transform:translateY(16px)}}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important;scroll-behavior:auto!important}
  .js [data-reveal],.js [data-stagger]>*,.js [data-hero-in],.cf-word{opacity:1!important;transform:none!important}
  .cf-marquee__track{animation:none}
  .cf-pour{display:none}.cf-steam path{opacity:.35;stroke-dasharray:none}
  ::view-transition-old(root),::view-transition-new(root){animation:none}
}
@media (max-width:575.98px){.cf-hero{min-height:auto;padding-top:1.4rem}.cf-hero__facts{gap:1.2rem}.cf-marquee__track{font-size:1.1rem}}

@media (min-width:768px){.cf-hero__tag{position:absolute;margin:0}}
.cf .offcanvas{max-width:min(400px,92vw)}
.cf .buybox__now{color:var(--cf-roast);border-color:var(--cf-line);background:transparent}
.cf .buybox__now:hover{background:var(--cf-cream);color:var(--cf-roast);border-color:var(--cf-roast)}
/* panel-managed blocks */
.cf-campaigns .hero{border-radius:var(--cf-r-lg);overflow:hidden}
.cf-offers{display:grid;gap:1.2rem;background:var(--cf-copper);border-radius:var(--cf-r-lg);padding:clamp(1.2rem,4vw,2.4rem);color:#fff}
@media (min-width:992px){.cf-offers{grid-template-columns:260px 1fr;align-items:center}}
.cf-offers h2{font-family:var(--cf-display);font-weight:400;color:#fff!important;font-size:2.2rem}
.cf-countdown .countdown__box{background:rgba(0,0,0,.18);color:#fff;border-radius:12px}
.cf-offers .cf-rail{margin:0;padding-inline:0}
.cf-banners{display:grid;gap:.8rem}
@media (min-width:768px){.cf-banners{grid-template-columns:repeat(3,1fr)}.cf-banner--wide{grid-column:1/-1}}
.cf-banner{position:relative;border-radius:var(--cf-r);overflow:hidden;display:block}
.cf-banner img{width:100%;height:100%;object-fit:cover;transition:transform .9s var(--cf-ease)}
.cf-banner:hover img{transform:scale(1.05)}
.cf-banner span{position:absolute;inset:auto 0 0 0;padding:1rem;background:linear-gradient(transparent,rgba(27,17,12,.8));color:#fff;display:flex;flex-direction:column}
.cf-roasters{list-style:none;padding:0;margin:0;display:flex;flex-wrap:wrap;gap:.6rem}
.cf-roasters a{display:grid;place-items:center;min-width:140px;height:64px;padding:.4rem 1rem;border-radius:18px;background:#fff;border:1px solid var(--cf-line);color:var(--cf-roast);font-weight:800}
.cf-roasters img{max-height:44px;width:auto}
.cf-card__low{font-size:.72rem;color:var(--cf-copper);font-weight:700}
/* off-screen drawers must not widen the mobile layout viewport */
.cf .offcanvas:not(.show):not(.showing):not(.hiding){display:none}
@media (max-width:991.98px){.cf .offcanvas-lg:not(.show):not(.showing):not(.hiding){display:none}}

/* ===================== 1.1.0 — performance + footer fixes ===================== */
/* page canvas: the area under the footer / behind the dock is espresso, never white */
html{background:#120b07}
body.cf{padding-bottom:0!important;min-height:100vh;min-height:100dvh}
.cf-footer .footer-bottom{background:#120b07}
@media (max-width:991.98px){
  .cf-footer .footer-bottom{padding-bottom:calc(1rem + 76px + env(safe-area-inset-bottom))!important}
  .cf-dock{padding-bottom:max(.35rem,env(safe-area-inset-bottom))}
}
/* drawers: transform/opacity only, own compositor layer, no blur on mobile */
.cf .offcanvas{will-change:transform;contain:layout paint style;backface-visibility:hidden;transform:translate3d(0,0,0);
  transition:transform .26s cubic-bezier(.2,.8,.2,1),visibility 0s linear .26s!important}
.cf .offcanvas.showing,.cf .offcanvas.show:not(.hiding){transition:transform .26s cubic-bezier(.2,.8,.2,1)!important}
.cf .offcanvas.offcanvas-start:not(.show):not(.showing),.cf .offcanvas.offcanvas-start.hiding{transform:translate3d(100%,0,0)}
.cf .offcanvas.offcanvas-end:not(.show):not(.showing),.cf .offcanvas.offcanvas-end.hiding{transform:translate3d(-100%,0,0)}
.cf .offcanvas-backdrop{backdrop-filter:none!important;-webkit-backdrop-filter:none!important;will-change:opacity;transition:opacity .2s linear}
.cf .offcanvas-backdrop.show{opacity:.55}
.cf .offcanvas-body{overscroll-behavior:contain;-webkit-overflow-scrolling:touch}
/* while a drawer is open, pause every decorative animation */
body.cf-drawer-open .cf-marquee__track,body.cf-drawer-open .cf-steam,body.cf-drawer-open .cf-steam *,body.cf-drawer-open [class*="cf-pour"],
body.cf-drawer-open .cf-bean{animation-play-state:paused!important}
/* the film-grain overlay is a full-screen fixed layer: desktop only, promoted */
.cf-grain{will-change:transform;transform:translateZ(0)}
@media (max-width:991.98px),(pointer:coarse){
  .cf-grain{display:none}
  .cf-header,.cf-dock,.cf-hero__tag,.cf-card__origin{backdrop-filter:none!important;-webkit-backdrop-filter:none!important}
  .cf-header{background:rgba(27,17,12,.985)}
  .cf-dock{background:#1b110c!important}
}
body.cf-drawer-open .cf-grain{display:none}

/* ======================= 1.1.0 — polish, academy, gear, AI ======================= */
.cf-btn--copper{background:linear-gradient(135deg,var(--cf-copper),var(--cf-copper-2))!important;color:#fff!important;border-color:transparent!important;box-shadow:0 10px 22px -12px rgba(184,100,46,.8)}
.cf-btn--copper:hover{filter:brightness(1.06)}
.cf-btn--sm{padding:.45rem .95rem!important;font-size:.85rem!important;min-height:38px}
.cf-btn{transition:transform .18s var(--cf-ease),box-shadow .18s,filter .18s}
.cf-btn:active{transform:scale(.97)}
.cf-note{background:#fbf2e6;border:1px dashed var(--cf-crema);border-radius:14px;padding:.7rem .9rem;color:var(--cf-text);font-size:.88rem}
.p-num{font-variant-numeric:tabular-nums;color:var(--cf-ink);font-size:1.05rem}
.p-num small{font-size:.72rem;color:var(--cf-muted);font-weight:500}
.cf h1{letter-spacing:-.01em;text-wrap:balance}
.cf p{text-wrap:pretty}

/* academy nav + hero variants */
.cf-pagehero--lab{background:radial-gradient(120% 90% at 85% 0%,#4a2a17 0%,#1b110c 60%)!important}
.cf-pagehero--gear{background:radial-gradient(120% 90% at 10% 0%,#2f3a2c 0%,#1b110c 65%)!important}
.cf-academy-nav{display:flex;gap:.4rem;overflow-x:auto;scrollbar-width:none;margin-top:1.1rem;padding-bottom:.2rem;-webkit-overflow-scrolling:touch}
.cf-academy-nav::-webkit-scrollbar{display:none}
.cf-academy-nav a{flex:0 0 auto;padding:.45rem .9rem;border-radius:999px;border:1px solid rgba(255,255,255,.18);color:#f5ecdf;font-size:.85rem;white-space:nowrap}
.cf-academy-nav a.is-on,.cf-academy-nav a:hover{background:var(--cf-cream);color:var(--cf-espresso)}

.cf-pains{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:.8rem;margin-bottom:1.5rem}
.cf-pain{display:flex;flex-direction:column;gap:.25rem;background:#fff;border:1px solid var(--cf-line);border-radius:var(--cf-r);padding:1rem}
.cf-pain i{font-size:1.4rem;color:var(--cf-copper)} .cf-pain b{color:var(--cf-ink)} .cf-pain span{font-size:.85rem;color:var(--cf-muted)}
.cf-extract{display:grid;gap:1rem;padding:1.25rem;margin-bottom:1.5rem}
@media(min-width:992px){.cf-extract{grid-template-columns:1fr 1.3fr;align-items:center;padding:2rem}}
.cf-extract__bar{display:grid;grid-template-columns:1fr 1.2fr 1fr;border-radius:18px;overflow:hidden;text-align:center;font-weight:800;font-size:.85rem}
.cf-extract__bar span{padding:1.1rem .4rem;display:flex;flex-direction:column;gap:.15rem}
.cf-extract__bar small{font-weight:500;opacity:.8}
.cf-extract__bar .u{background:#f2e3a6;color:#5b4a10}.cf-extract__bar .i{background:#c98a52;color:#fff}.cf-extract__bar .o{background:#3b2214;color:#f5ecdf}
.cf-science{display:grid;gap:1rem}
@media(min-width:992px){.cf-science{grid-template-columns:1fr 1fr}}
.cf-science__item{display:flex;gap:1rem;background:#fff;border:1px solid var(--cf-line);border-radius:var(--cf-r);padding:1.2rem}
.cf-science__item h2{font-size:1.15rem;margin:0 0 .3rem}
.cf-science__item .lead{font-size:.95rem;color:var(--cf-text)}
.cf-science__item ul{margin:0;padding-inline-start:1.1rem;font-size:.88rem;color:var(--cf-muted)}
.cf-science__item li{margin-bottom:.25rem}
.cf-science__icon{flex:0 0 48px;height:48px;border-radius:16px;display:grid;place-items:center;background:var(--cf-cream);color:var(--cf-copper);font-size:1.35rem}
.cf-cta-ai,.cf-promise{display:flex;align-items:center;gap:1rem;padding:1.1rem 1.25rem;margin-top:1.5rem;background:linear-gradient(135deg,#fff,#fbf2e6)!important;flex-wrap:wrap}
.cf-cta-ai>i,.cf-promise>i{font-size:1.8rem;color:var(--cf-copper)}
.cf-cta-ai>div,.cf-promise>div{flex:1 1 220px;display:flex;flex-direction:column}
.cf-cta-ai span,.cf-promise span{font-size:.88rem;color:var(--cf-muted)}

/* troubleshoot */
.cf-tshoot__tabs{display:grid;grid-template-columns:repeat(2,1fr);gap:.5rem;margin-bottom:1rem}
@media(min-width:768px){.cf-tshoot__tabs{grid-template-columns:repeat(4,1fr)}}
.cf-tshoot__tab{display:flex;align-items:center;justify-content:center;gap:.4rem;padding:.85rem;border-radius:18px;border:1px solid var(--cf-line);background:#fff;font-weight:800;color:var(--cf-roast);transition:background .2s,color .2s,transform .2s}
.cf-tshoot__tab i{font-size:1.2rem}
.cf-tshoot__tab.is-on{background:var(--cf-roast);color:var(--cf-cream);transform:translateY(-2px)}
.cf-tshoot__pane{padding:1.3rem}
.cf-steps{counter-reset:s;list-style:none;padding:0;margin:1rem 0}
.cf-steps li{counter-increment:s;position:relative;padding:.55rem 2.6rem .55rem 0;border-bottom:1px dashed var(--cf-line)}
.cf-steps li::before{content:counter(s);position:absolute;inset-inline-start:0;top:.45rem;width:1.9rem;height:1.9rem;border-radius:50%;display:grid;place-items:center;background:var(--cf-cream);color:var(--cf-copper);font-weight:800;font-size:.85rem}

/* tables */
.cf-table-wrap{border:1px solid var(--cf-line);border-radius:var(--cf-r);background:#fff}
.cf-table{width:100%;border-collapse:collapse;font-size:.88rem;min-width:560px}
.cf-table th{background:var(--cf-cream);color:var(--cf-roast);font-weight:800;padding:.75rem .8rem;text-align:start;white-space:nowrap;position:sticky;top:0}
.cf-table td{padding:.7rem .8rem;border-top:1px solid #f1e8db;vertical-align:top}
.cf-table tbody tr:hover{background:#fdf8f1}
.cf-table td:first-child{font-weight:700;color:var(--cf-ink)}
.cf-dots{display:inline-block;padding:.1rem .5rem;border-radius:999px;background:var(--cf-cream);font-weight:700}
.cf-dots.r4,.cf-dots.r5{background:var(--cf-roast);color:#fff}

/* freshness */
.cf-curve{padding:1rem}.cf-curve svg{width:100%;height:auto}
.cf-rest{list-style:none;padding:0;margin:0}
.cf-rest li{display:flex;justify-content:space-between;gap:1rem;padding:.65rem 0;border-bottom:1px solid var(--cf-line)}
.cf-rest span{color:var(--cf-copper);font-weight:800}

/* equipment */
.cf-gearnav{display:flex;gap:.45rem;overflow-x:auto;scrollbar-width:none;padding-bottom:.4rem;margin-bottom:.6rem}
.cf-gearnav::-webkit-scrollbar{display:none}
.cf-gearnav a{flex:0 0 auto;display:flex;align-items:center;gap:.35rem;padding:.55rem 1rem;border-radius:999px;background:#fff;border:1px solid var(--cf-line);color:var(--cf-roast);font-weight:700;font-size:.88rem}
.cf-gearnav a small{background:var(--cf-cream);border-radius:999px;padding:0 .45rem;font-size:.72rem}
.cf-gearnav a.is-on{background:var(--cf-roast);color:var(--cf-cream);border-color:var(--cf-roast)}
.cf-gearnav a.is-on small{background:rgba(255,255,255,.18)}
.cf-levels{display:flex;gap:.4rem;flex-wrap:wrap;margin-bottom:1.2rem}
.cf-levels a{font-size:.8rem;padding:.25rem .7rem;border-radius:999px;color:var(--cf-muted);border:1px dashed var(--cf-line)}
.cf-levels a.is-on{color:var(--cf-copper);border-color:var(--cf-copper)}
.cf-gear,.cf-bundle{display:flex;flex-direction:column;height:100%;overflow:hidden;transition:transform .25s var(--cf-ease),box-shadow .25s}
@media(hover:hover){.cf-gear:hover,.cf-bundle:hover{transform:translateY(-4px);box-shadow:var(--cf-sh)}}
.cf-gear__img,.cf-bundle__img{position:relative;display:grid;place-items:center;aspect-ratio:4/3;background:linear-gradient(160deg,#f7efe4,#efe2d0)}
.cf-gear__img img,.cf-bundle__img img{width:100%;height:100%;object-fit:cover}
.cf-gear__img>i{font-size:3rem;color:var(--cf-crema)}
.cf-gear__kind{position:absolute;inset-block-start:.7rem;inset-inline-start:.7rem;background:rgba(27,17,12,.82);color:#f5ecdf;font-size:.72rem;padding:.25rem .6rem;border-radius:999px}
.cf-gear__body,.cf-bundle__body{padding:1rem;display:flex;flex-direction:column;gap:.5rem;flex:1}
.cf-gear__body h3,.cf-bundle__body h3{font-size:1.02rem;margin:0}
.cf-gear__body h3 a,.cf-bundle__body h3 a{color:inherit}
.cf-gear__specs{display:grid;grid-template-columns:1fr 1fr;gap:.35rem;margin:0}
.cf-gear__specs div{background:#faf5ee;border-radius:12px;padding:.4rem .55rem}
.cf-gear__specs dt{font-size:.7rem;color:var(--cf-muted);font-weight:500}
.cf-gear__specs dd{margin:0;font-size:.82rem;font-weight:700;color:var(--cf-ink)}
.cf-gear__compat,.cf-gear__tip{font-size:.8rem;margin:0;color:var(--cf-text)}
.cf-gear__tip{background:#f3f6ef;border-radius:12px;padding:.45rem .6rem;color:#41553e}
.cf-gear__tip i,.cf-gear__compat i{margin-inline-end:.25rem;color:var(--cf-sage)}
.cf-gear__foot{margin-top:auto;display:flex;align-items:center;justify-content:space-between;gap:.5rem;padding-top:.5rem}
.cf-bundle__save{position:absolute;inset-block-end:.7rem;inset-inline-end:.7rem;background:var(--cf-sage);color:#fff;font-size:.75rem;font-weight:800;padding:.3rem .7rem;border-radius:999px}
.cf-bundle__body ul,.cf-bundle__list{list-style:none;padding:0;margin:0;font-size:.85rem}
.cf-bundle__body li{padding:.15rem 0}.cf-bundle__body li i{color:var(--cf-sage)}
.cf-gearbox{margin-top:1rem;padding:1rem;border:1px solid var(--cf-line);border-radius:var(--cf-r);background:#fff;display:flex;flex-direction:column;gap:.6rem}
.cf-gearbox__head{display:flex;justify-content:space-between;align-items:center}
.cf-compat{display:flex;flex-wrap:wrap;gap:.35rem;align-items:center;font-size:.82rem}
.cf-compat a{padding:.25rem .65rem;border-radius:999px;background:var(--cf-cream);color:var(--cf-roast);font-weight:700}
.cf-bundle__save-inline{color:var(--cf-sage);font-size:.85rem}

/* product AI Q&A */
.cf-aiask{display:flex;flex-wrap:wrap;align-items:center;gap:.5rem;padding:.7rem;border-radius:18px;background:linear-gradient(135deg,#fbf2e6,#fff);border:1px solid var(--cf-crema-2);margin-bottom:1.2rem}
.cf-aiask>i{color:var(--cf-copper);font-size:1.2rem}
.cf-aiask input{flex:1 1 200px;border:0;background:transparent;outline:0;min-height:40px;font-size:.92rem}
.cf-aiask__out{flex:1 0 100%;font-size:.9rem;line-height:1.9}
.cf-aiask__out:empty{display:none}

/* blend lab */
.cf-lab__loading{display:flex;align-items:center;gap:.8rem;padding:2rem;color:var(--cf-muted)}
.cf-lab__flask{width:46px;height:46px;border-radius:50%;display:grid;place-items:center;background:var(--cf-cream);color:var(--cf-copper);animation:cfPulse 1.2s ease-in-out infinite}
@keyframes cfPulse{50%{transform:scale(1.12);box-shadow:0 0 0 10px rgba(184,100,46,.12)}}

/* ---------- AI widget ---------- */
.cfai{position:fixed;z-index:1040;inset-inline-start:1rem;bottom:calc(1rem + env(safe-area-inset-bottom))}
@media(max-width:991.98px){.cfai{bottom:calc(84px + env(safe-area-inset-bottom));inset-inline-start:.75rem}}
.cfai__fab{display:flex;align-items:center;gap:.5rem;border:0;border-radius:999px;padding:.4rem .9rem .4rem .45rem;background:var(--cf-espresso);color:var(--cf-cream);font-weight:800;box-shadow:0 14px 30px -12px rgba(27,17,12,.7);transform:translateZ(0);transition:transform .2s var(--cf-ease)}
.cfai__fab:active{transform:scale(.95)}
.cfai__fab-orb{width:38px;height:38px;border-radius:50%;display:grid;place-items:center;background:conic-gradient(from 200deg,var(--cf-copper),var(--cf-crema),var(--cf-copper));color:#fff;font-size:1.05rem}
@media(max-width:575.98px){.cfai__fab-txt{display:none}.cfai__fab{padding:.35rem}}
body.cf-drawer-open .cfai{visibility:hidden}
.cfai__panel{position:absolute;inset-inline-start:0;bottom:calc(100% + .7rem);width:min(390px,calc(100vw - 1.5rem));height:min(600px,calc(100dvh - 170px));display:flex;flex-direction:column;background:var(--cf-paper);border-radius:26px;border:1px solid var(--cf-line);box-shadow:0 30px 70px -20px rgba(27,17,12,.55);overflow:hidden;opacity:0;transform:translate3d(0,14px,0) scale(.98);transform-origin:bottom left;transition:opacity .22s ease,transform .24s var(--cf-ease);will-change:transform,opacity}
.cfai.is-open .cfai__panel{opacity:1;transform:none}
@media(max-width:575.98px){
  .cfai__panel{position:fixed;inset:auto 0 0 0;width:100%;height:min(86dvh,680px);border-radius:26px 26px 0 0;padding-bottom:env(safe-area-inset-bottom);transform:translate3d(0,100%,0);opacity:1}
  body.cfai-open{overflow:hidden}
}
.cfai__head{display:flex;align-items:center;gap:.6rem;padding:.8rem .9rem;background:var(--cf-espresso);color:var(--cf-cream)}
.cfai__head div{flex:1;display:flex;flex-direction:column;line-height:1.3}
.cfai__head small{font-size:.72rem;opacity:.7}
.cfai__avatar{width:38px;height:38px;border-radius:14px;display:grid;place-items:center;background:var(--cf-copper);color:#fff}
.cfai__icon{width:36px;height:36px;border:0;border-radius:12px;background:rgba(255,255,255,.08);color:inherit}
.cfai__log{flex:1;overflow-y:auto;overscroll-behavior:contain;padding:1rem .9rem;display:flex;flex-direction:column;gap:.6rem}
.cfai__msg{max-width:88%;padding:.6rem .85rem;border-radius:18px;font-size:.9rem;line-height:1.85;animation:cfaiIn .22s var(--cf-ease)}
@keyframes cfaiIn{from{opacity:0;transform:translateY(6px)}}
.cfai__msg--bot{align-self:flex-start;background:#fff;border:1px solid var(--cf-line);border-start-start-radius:6px;color:var(--cf-ink)}
.cfai__msg--me{align-self:flex-end;background:var(--cf-roast);color:var(--cf-cream);border-start-end-radius:6px}
.cfai__msg--sys{align-self:center;font-size:.8rem;background:#eef3ea;color:#41553e;padding:.35rem .8rem}
.cfai__msg.is-offline{border-style:dashed}
.cfai__typing{display:flex;gap:.25rem}
.cfai__typing span{width:7px;height:7px;border-radius:50%;background:var(--cf-crema);animation:cfaiDot 1s infinite}
.cfai__typing span:nth-child(2){animation-delay:.15s}.cfai__typing span:nth-child(3){animation-delay:.3s}
@keyframes cfaiDot{50%{transform:translateY(-4px);opacity:.5}}
.cfai__chips{display:flex;gap:.4rem;overflow-x:auto;scrollbar-width:none;padding:.2rem .9rem .5rem}
.cfai__chips::-webkit-scrollbar{display:none}
.cfai__chips button{flex:0 0 auto;border:1px solid var(--cf-line);background:#fff;border-radius:999px;padding:.35rem .75rem;font-size:.8rem;color:var(--cf-roast)}
.cfai__form{display:flex;gap:.4rem;padding:.6rem .7rem;border-top:1px solid var(--cf-line);background:#fff}
.cfai__form input{flex:1;border:0;outline:0;font-size:16px;background:transparent;min-height:44px}
.cfai__send{width:44px;height:44px;border:0;border-radius:50%;background:var(--cf-copper);color:#fff}
.cfai-blend{align-self:stretch;background:#fff;border:1px solid var(--cf-crema-2);border-radius:20px;padding:.9rem;box-shadow:0 12px 26px -18px rgba(59,34,20,.5);animation:cfaiIn .25s var(--cf-ease)}
.cf-lab__result .cfai-blend{padding:1.3rem}
.cfai-blend__head{display:flex;align-items:center;gap:.45rem;font-size:1.02rem;color:var(--cf-ink);margin-bottom:.5rem}
.cfai-blend__head i{color:var(--cf-copper)}
.cfai-blend__comps{list-style:none;padding:0;margin:0 0 .5rem;display:flex;flex-direction:column;gap:.35rem}
.cfai-blend__comps li{position:relative;padding:.45rem .6rem;border-radius:12px;background:#faf5ee;font-size:.85rem;overflow:hidden;isolation:isolate}
.cfai-blend__comps small{color:var(--cf-muted);margin-inline-start:.35rem}
.cfai-blend__bar{position:absolute;inset-block:0;inset-inline-start:0;width:var(--w);background:linear-gradient(90deg,rgba(184,100,46,.18),rgba(200,162,122,.25));z-index:-1}
.cfai-blend__meta{display:flex;flex-wrap:wrap;gap:.35rem;font-size:.78rem}
.cfai-blend__meta span{background:var(--cf-cream);border-radius:999px;padding:.2rem .6rem}
.cfai-blend__notes,.cfai-blend__caf,.cfai-blend__why{font-size:.84rem;margin:.45rem 0 0}
.cfai-blend__why{color:var(--cf-muted);line-height:1.9}
.cfai-blend__foot{display:flex;justify-content:space-between;align-items:center;gap:.5rem;margin-top:.7rem;flex-wrap:wrap}
@media(prefers-reduced-motion:reduce){.cfai__panel,.cfai__msg,.cfai-blend{transition:none;animation:none}}

/* ===== 1.2.0 — dark espresso mobile drawer (WCAG AA) ===== */
.cf .cf-drawer,.cf .cf-drawer .offcanvas-header,.cf .cf-drawer .offcanvas-body{background:#1b110c!important;color:#f5ecdf}
.cf .cf-drawer{--bs-offcanvas-bg:#1b110c;--bs-offcanvas-color:#f5ecdf;box-shadow:0 0 50px rgba(0,0,0,.55)}
.cf .cf-drawer .offcanvas-header{border-bottom:1px solid rgba(245,236,223,.16)}
.cf .cf-drawer .cf-logo__name{color:#f5ecdf}
.cf .cf-drawer .btn-close{filter:invert(1) grayscale(1) brightness(2);opacity:.9}
.cf .cf-drawer__big a{color:#f5ecdf;font-size:1.55rem;line-height:1.5;border-bottom:1px solid rgba(245,236,223,.1);padding:.35rem 0}
.cf .cf-drawer__big a:hover,.cf .cf-drawer__big a:focus-visible,.cf .cf-drawer__big a[aria-current="page"]{color:#f0a46e}
.cf .cf-drawer__big a[aria-current="page"]{box-shadow:inset -3px 0 0 #f0a46e;padding-inline-start:.6rem}
.cf .cf-drawer .mobile-menu__title{color:#d9b48c;letter-spacing:.02em}
.cf .cf-drawer__cats a{color:#efe3d3;border-color:rgba(240,164,110,.45);background:rgba(245,236,223,.04)}
.cf .cf-drawer__cats a i,.cf .cf-drawer__foot a i{color:#f0a46e}
.cf .cf-drawer__cats a:hover{background:#f0a46e;color:#1b110c;border-color:#f0a46e}
.cf .cf-drawer__cats a:hover i{color:#1b110c}
.cf .cf-drawer__foot{border-top:1px solid rgba(245,236,223,.16);padding-top:.6rem}
.cf .cf-drawer__foot a{color:#d8c7b4}
.cf .cf-drawer__foot a:hover{color:#f0a46e}
.cf .cf-drawer :focus-visible{outline:2px solid #f0a46e;outline-offset:2px}

/* ===== 1.2.0 — refined AI launcher: small orb docked above the bottom nav / buy bar, collapsible ===== */
.cfai{--cfai-b:calc(1.1rem + env(safe-area-inset-bottom))}
@media(max-width:991.98px){
  .cfai{--cfai-b:calc(62px + .7rem + env(safe-area-inset-bottom))}
  body:has(.mobile-buybar) .cfai,body.has-buybar .cfai{--cfai-b:calc(62px + 70px + .6rem + env(safe-area-inset-bottom))}
}
.cfai{bottom:var(--cfai-b)!important;inset-inline-start:auto!important;inset-inline-end:.8rem!important;transition:bottom .25s var(--cf-ease)}
.cfai__dock{position:relative;display:flex;align-items:center;gap:.25rem}
.cfai__fab{padding:.25rem!important;gap:.45rem;background:rgba(27,17,12,.92)!important;border:1px solid rgba(200,162,122,.35)!important;box-shadow:0 10px 24px -12px rgba(27,17,12,.75)!important}
.cfai__fab-orb{width:40px!important;height:40px!important;font-size:.95rem!important;position:relative}
.cfai__fab-orb::after{content:"";position:absolute;inset:-3px;border-radius:50%;border:1.5px solid rgba(240,164,110,.55);animation:cfaiRing 2.8s ease-out 3;pointer-events:none}
@keyframes cfaiRing{0%{transform:scale(.9);opacity:.9}100%{transform:scale(1.45);opacity:0}}
.cfai__fab-txt{font-size:.82rem;padding-inline-end:.55rem;max-width:9rem;overflow:hidden;white-space:nowrap;transition:max-width .3s var(--cf-ease),padding .3s}
@media(max-width:991.98px){.cfai__fab-txt{max-width:0;padding:0}.cfai__fab-txt{display:inline-block!important}}
@media(hover:hover){.cfai__fab:hover .cfai__fab-txt{max-width:9rem;padding-inline-end:.55rem}}
.cfai__min{width:22px;height:22px;border-radius:50%;border:0;background:rgba(27,17,12,.6);color:#f5ecdf;font-size:.65rem;display:grid;place-items:center;opacity:.75}
.cfai__tab{display:none;position:fixed;inset-inline-end:0;bottom:var(--cfai-b);width:22px;height:44px;border:0;border-radius:0 14px 14px 0;background:rgba(27,17,12,.88);color:#f0a46e;font-size:.8rem;box-shadow:0 6px 16px -8px rgba(0,0,0,.6)}
[dir=rtl] .cfai__tab{border-radius:0 14px 14px 0}
.cfai.is-min .cfai__dock{transform:translate3d(-130%,0,0);opacity:0;pointer-events:none}
[dir=rtl] .cfai.is-min .cfai__dock{transform:translate3d(-130%,0,0)}
.cfai__dock{transition:transform .3s var(--cf-ease),opacity .25s}
.cfai.is-min .cfai__tab{display:grid;place-items:center;animation:cfaiIn .3s var(--cf-ease)}
.cfai.is-open .cfai__min{display:none}
@media(prefers-reduced-motion:reduce){.cfai__fab-orb::after{animation:none}.cfai__dock{transition:none}}

.cfai__dock{flex-direction:row-reverse}
.cfai__panel{inset-inline-start:auto!important;inset-inline-end:0;transform-origin:bottom left}
@media(max-width:575.98px){.cfai__panel{inset:auto 0 0 0!important}}

/* 1.2 installments badge/calculator */
.cf-bnpl{margin:.6rem 0;border:1px dashed rgba(184,115,51,.55);border-radius:12px;padding:.55rem .8rem;background:rgba(184,115,51,.07);font-size:.9rem}
.cf-bnpl summary{cursor:pointer;list-style:none;color:var(--cf-roast,#2b1a12)}
.cf-bnpl summary i{color:var(--cf-copper,#b87333)}
.cf-bnpl__calc{width:100%;margin:.5rem 0;font-size:.85rem}.cf-bnpl__calc th{font-weight:600;padding:.2rem 0}.cf-bnpl__calc td{text-align:left}
.cf-bnpl small{color:#6b5a4e}

/* 1.2 assistant history pane */
.cfai__panel{position:relative}
.cfai__hist{position:absolute;inset:3.6rem 0 0 0;z-index:3;background:#1b110c;color:#f5ecdf;display:flex;flex-direction:column;padding:.8rem;overflow:auto;border-radius:0 0 18px 18px}
.cfai__hist[hidden]{display:none}
.cfai__hhead{display:flex;flex-direction:column;gap:.2rem;margin-bottom:.6rem}.cfai__hhead small{color:#d9c8b4;font-size:.75rem}
.cfai__hlist{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:.35rem;flex:1}
.cfai__hitem{display:flex;align-items:stretch;border:1px solid rgba(245,236,223,.14);border-radius:12px;overflow:hidden}
.cfai__hitem.is-current{border-color:#d08a4e;background:rgba(208,138,78,.12)}
.cfai__hopen{flex:1;background:none;border:0;color:inherit;text-align:start;padding:.55rem .7rem;display:flex;justify-content:space-between;gap:.5rem;min-width:0}
.cfai__hopen b{font-weight:600;font-size:.88rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.cfai__hopen small{color:#d9c8b4;flex:none}
.cfai__hdel{background:none;border:0;color:#e9a77a;padding:0 .7rem}
.cfai__hempty{color:#d9c8b4;font-size:.85rem;padding:.6rem 0}
.cfai__hclear{margin-top:.8rem;background:none;border:1px solid rgba(233,167,122,.5);color:#f0b48a;border-radius:10px;padding:.5rem}

/* ==========================================================================
   1.3 — fixed blends banner, blend builder, finder cards, 'your coffee'
   ========================================================================== */
.cf-input{display:block;width:100%;min-height:44px;padding:.55rem .8rem;border:1.5px solid var(--cf-line);border-radius:14px;background:#fff;color:var(--cf-ink);font:inherit;font-size:16px;line-height:1.4;appearance:auto}
.cf-input:focus{border-color:var(--cf-copper);outline:0;box-shadow:0 0 0 3px rgba(184,100,46,.18)}
textarea.cf-input{min-height:88px;resize:vertical}
.cb-lbl{display:grid;gap:.35rem;font-weight:600;color:var(--cf-ink);margin:0 0 .8rem;font-size:.9rem}
/* banner */
.bb{padding:2.2rem 0 1.6rem;background:linear-gradient(180deg,var(--cf-espresso) 0,var(--cf-roast) 100%);color:var(--cf-cream)}
.bb__head h2{color:var(--cf-cream);font-family:var(--cf-display);font-size:clamp(1.6rem,6vw,2.4rem);margin:.2rem 0}
.bb__head p{color:var(--cf-crema-2);margin:0 0 1rem}.bb__head a{color:#fff;text-decoration:underline}
.bb__rail{display:grid;grid-auto-flow:column;grid-auto-columns:78%;gap:.9rem;overflow-x:auto;scroll-snap-type:x mandatory;padding:.2rem .1rem 1rem;scrollbar-width:thin;overscroll-behavior-x:contain}
.bb__card{scroll-snap-align:start;background:linear-gradient(160deg,var(--bb) 0,#1b110c 140%);border-radius:var(--cf-r);padding:1rem;display:flex;flex-direction:column;gap:.45rem;box-shadow:0 18px 40px -20px rgba(0,0,0,.7);min-width:0}
.bb__top{display:flex;justify-content:space-between;align-items:center}.bb__top i{font-size:2rem;color:var(--cf-crema-2)}.bb__top img{border-radius:14px;object-fit:cover}
.bb__ratio{background:rgba(255,255,255,.14);border-radius:99px;padding:.15rem .6rem;font-size:.75rem;direction:rtl}
.bb__card h3{color:#fff;font-family:var(--cf-display);font-size:1.5rem;margin:0}
.bb__tag{margin:0;color:var(--cf-crema-2);font-size:.88rem}
.bb__meters{margin:.2rem 0;display:grid;gap:.3rem}.bb__meters div{display:grid;grid-template-columns:4.2rem 1fr;align-items:center;gap:.5rem}
.bb__meters dt{font-weight:400;font-size:.78rem;color:var(--cf-crema-2)}.bb__meters dd{margin:0;height:6px;border-radius:9px;background:rgba(255,255,255,.15);overflow:hidden}
.bb__meters dd span{display:block;height:100%;width:calc(var(--v) * 20%);background:var(--cf-crema);border-radius:9px}
.bb__serve{font-size:.8rem;margin:0;color:var(--cf-cream);opacity:.9}
.bb__foot{margin-top:auto;display:flex;justify-content:space-between;align-items:end;gap:.5rem;flex-wrap:wrap}
.bb__price{display:flex;flex-direction:column;line-height:1.2}.bb__price b{font-size:1.15rem;color:#fff}.bb__price small{font-size:.7rem;color:var(--cf-crema-2)}
.bb__btn{background:var(--cf-crema-2);color:var(--cf-espresso);border-radius:99px;padding:.5rem .9rem;font-weight:700;font-size:.82rem;text-decoration:none;min-height:40px;display:inline-flex;align-items:center}
.bb__more{text-align:center;margin:.6rem 0 0}.bb .cf-btn--dark{background:var(--cf-crema-2);color:var(--cf-espresso)}
@media (min-width:768px){.bb__rail{grid-auto-flow:row;grid-template-columns:repeat(3,1fr);overflow:visible}}
@media (min-width:1200px){.bb__rail{grid-template-columns:repeat(6,1fr)}.bb__card h3{font-size:1.3rem}}
/* builder */
.cb-page{padding:1.2rem 0 2.5rem}.cb-note{text-align:center;margin-top:1rem;color:var(--cf-muted)}
.cb-card{background:#fff;border:1px solid var(--cf-line);border-radius:var(--cf-r);padding:1rem;box-shadow:var(--cf-sh);max-width:760px;margin:0 auto}
.cb{display:block}
.cb-ratio{display:grid;grid-template-columns:1fr 1fr;gap:.6rem;align-items:center;margin-bottom:.8rem}
.cb-ratio label{display:flex;align-items:center;gap:.35rem;font-weight:700}.cb-ratio label .cf-input{width:5.2rem;text-align:center;direction:ltr}
.cb-range{grid-column:1/-1;grid-row:2;width:100%;accent-color:var(--cf-copper);height:32px}
.cb-sp{border:1px dashed var(--cf-line);border-radius:16px;padding:.7rem;margin-bottom:.7rem;background:var(--cf-paper)}
.cb-sp--robusta{border-color:#d8b99a}
.cb-sp__head{display:flex;justify-content:space-between;align-items:baseline;gap:.5rem;flex-wrap:wrap;margin-bottom:.5rem}
.cb-sp__head small{color:var(--cf-muted)}.cb-sp__head .ok{color:var(--cf-sage);font-weight:700}.cb-sp__head .bad{color:#b3261e;font-weight:700}
.cb-row{display:grid;grid-template-columns:minmax(0,1fr) 5.4rem 2.4rem;gap:.4rem;margin-bottom:.4rem;align-items:center}
.cb-pct{display:flex;align-items:center;gap:.2rem}.cb-pct .cf-input{text-align:center;direction:ltr;padding:.5rem .3rem}
.cb-x{width:40px;height:40px;border-radius:12px;border:1px solid var(--cf-line);background:#fff;font-size:1.3rem;line-height:1;color:var(--cf-muted)}
.cb-add{border:0;background:none;color:var(--cf-copper-2);font-weight:700;padding:.4rem 0;min-height:40px}
.cb-form{display:flex;gap:.5rem;flex-wrap:wrap;margin:.4rem 0 .8rem;border:0;padding:0}.cb-form legend{font-size:.9rem;font-weight:600;margin-bottom:.35rem;color:var(--cf-ink)}
.cb-chip{position:relative}.cb-chip input{position:absolute;opacity:0}
.cb-chip span{display:inline-flex;align-items:center;min-height:42px;padding:.45rem 1rem;border:1.5px solid var(--cf-line);border-radius:99px;background:#fff;cursor:pointer}
.cb-chip input:checked+span{border-color:var(--cf-roast);background:var(--cf-roast);color:#fff}.cb-chip input:focus-visible+span{outline:3px solid rgba(184,100,46,.55)}
.cb-weight{display:grid;grid-template-columns:1fr auto;gap:.5rem;align-items:end}.cb-weight .cf-input{direction:ltr;text-align:center}
.cb-quick{display:flex;gap:.35rem;margin-bottom:.8rem}.cb-quick button{min-width:52px;min-height:42px;border-radius:12px;border:1.5px solid var(--cf-line);background:#fff;font-weight:700;direction:ltr}
.cb-quick button.on{border-color:var(--cf-copper);color:var(--cf-copper-2)}
.cb-fixed{display:flex;justify-content:space-between;align-items:center;gap:.6rem;flex-wrap:wrap;background:var(--cf-cream);border-radius:16px;padding:.7rem;margin-bottom:.8rem}
.cb-fixed .cf-btn--ghost{color:var(--cf-roast);box-shadow:inset 0 0 0 1.5px var(--cf-roast);padding:.45rem .9rem;font-size:.85rem}
.cb-price{display:flex;flex-wrap:wrap;gap:.4rem .9rem;align-items:baseline;background:var(--cf-espresso);color:var(--cf-crema-2);border-radius:16px;padding:.7rem .9rem;margin:.2rem 0 .6rem;font-size:.85rem}
.cb-price b{color:#fff}.cb-price strong{flex-basis:100%;font-weight:400;color:var(--cf-cream)}.cb-price strong b{font-size:1.3rem}
.cb-err{margin:0 0 .6rem;padding:.5rem 1.4rem;background:#fdecea;color:#8c1d18;border-radius:12px;font-size:.85rem}
.cb-actions{display:grid;grid-template-columns:1fr;gap:.5rem}.cb-actions .cf-btn{justify-content:center;min-height:48px}.cb-actions .cf-btn[disabled]{opacity:.5}
@media (min-width:480px){.cb-actions{grid-template-columns:1fr 1fr}}
.cb-msg{margin:.5rem 0 0;font-size:.88rem}.cb-msg.ok{color:var(--cf-sage)}.cb-msg.bad{color:#b3261e}
/* finder */
.fd-notes{margin-top:.3rem}.fd-count{display:block;text-align:left;color:var(--cf-muted);direction:ltr}
.fd-status{margin:.6rem 0 0;color:var(--cf-muted);text-align:center}
.fd-results{padding:1.5rem 0}.fd-choices{color:var(--cf-muted);font-size:.88rem}
.fd-grid{display:grid;gap:1rem}@media (min-width:992px){.fd-grid{grid-template-columns:repeat(3,1fr);align-items:start}}
.fd-card{background:#fff;border:1px solid var(--cf-line);border-radius:var(--cf-r);padding:1rem;box-shadow:var(--cf-sh);min-width:0}
.fd-card--custom{border:2px solid var(--cf-copper)}
.fd-badge{display:inline-block;font-size:.72rem;background:var(--cf-cream);color:var(--cf-roast);border-radius:99px;padding:.15rem .6rem}
.fd-card--custom .fd-badge{background:var(--cf-copper);color:#fff}
.fd-card h3{font-family:var(--cf-display);margin:.4rem 0 .3rem;font-size:1.35rem}
.fd-why{background:var(--cf-paper);border-radius:12px;padding:.6rem .7rem;font-size:.9rem;line-height:1.8;margin:0 0 .5rem}
.fd-meta{font-size:.8rem;color:var(--cf-muted);margin:0 0 .6rem}
.fd-card .cb-card,.fd-builder{box-shadow:none;border:0;padding:0}
.fd-foot{text-align:center;margin-top:1rem}
/* your coffee */
.mc{max-width:860px}.mc__head p{color:var(--cf-muted);margin:.2rem 0 1rem}.mc__legacy{font-size:.85rem}
.mc__new{background:#fff;border:2px dashed var(--cf-crema);border-radius:var(--cf-r);margin-bottom:1.2rem}
.mc__new summary,.mc__add summary{display:flex;align-items:center;gap:.8rem;padding:1rem;cursor:pointer;list-style:none;flex-wrap:wrap}
.mc__new summary::-webkit-details-marker,.mc__add summary::-webkit-details-marker{display:none}
.mc__new summary small{color:var(--cf-muted);flex-basis:100%;margin-inline-start:4.4rem;margin-top:-.6rem}
.mc__plus{width:3.6rem;height:3.6rem;border-radius:50%;background:var(--cf-roast);color:#fff;font-size:2.4rem;line-height:3.4rem;text-align:center;flex:none;box-shadow:0 10px 24px -10px rgba(59,34,20,.8)}
.mc__plus--sm{width:2.2rem;height:2.2rem;font-size:1.5rem;line-height:2.1rem}
.mc__form{padding:0 1rem 1rem}.mc__cad{display:flex;align-items:center;gap:.4rem}.mc__cad .cf-input{width:7rem;direction:ltr;text-align:center}
.mc__warn{color:#8c1d18}
.mc__sub{background:#fff;border:1px solid var(--cf-line);border-radius:var(--cf-r);padding:1rem;margin-bottom:1.2rem;box-shadow:var(--cf-sh)}
.mc__sub--paused{opacity:.75}
.mc__subhead{display:flex;justify-content:space-between;gap:.8rem;flex-wrap:wrap}
.mc__subhead h2{font-family:var(--cf-display);font-size:1.4rem;margin:0}.mc__subhead small{color:var(--cf-muted)}
.mc__next{display:flex;flex-direction:column;align-items:flex-end;text-align:left}.mc__next b{color:var(--cf-roast)}
.mc__ask{display:flex;flex-wrap:wrap;gap:.6rem;align-items:center;background:var(--cf-paper);border-radius:16px;padding:.8rem;margin:.8rem 0}
.mc__ask.is-due{background:#fff4e5;border:1.5px solid #f0b46a}.mc__ask p{flex-basis:100%;margin:0;font-weight:700}
.mc__postpone{display:flex;align-items:center;gap:.4rem;flex-wrap:wrap}.mc__postpone label{display:flex;align-items:center;gap:.4rem}
.mc__postpone .cf-input{width:4.6rem;direction:ltr;text-align:center}
.mc__h3{font-size:1rem;margin:1rem 0 .4rem}
.mc__items{list-style:none;margin:0;padding:0;display:grid;gap:.5rem}
.mc__item{display:grid;grid-template-columns:minmax(0,1fr) auto auto auto;gap:.4rem;align-items:center;border:1px solid var(--cf-line);border-radius:14px;padding:.55rem .6rem}
.mc__item.is-done{opacity:.55}.mc__label{min-width:0}.mc__label b{display:block;font-size:.88rem;overflow-wrap:anywhere}.mc__label small{color:var(--cf-muted);font-size:.76rem}
.mc__row .cf-input{min-height:40px;padding:.3rem .5rem;font-size:14px}.mc__qty{width:3.6rem;text-align:center;direction:ltr}
@media (max-width:520px){.mc__item{grid-template-columns:1fr auto auto}.mc__label{grid-column:1/-1}}
.mc__empty{color:var(--cf-muted);padding:.6rem}
.mc__total{margin:.6rem 0;text-align:left}.mc__total b{font-size:1.15rem;color:var(--cf-roast)}
.mc__add,.mc__settings{border-top:1px solid var(--cf-line);margin-top:.6rem}.mc__settings summary{padding:.8rem 0;cursor:pointer;font-weight:700}
.mc__addform{padding:.2rem 0 1rem}.mc__modes{display:flex;gap:.4rem;flex-wrap:wrap;margin-bottom:.8rem}
.mc__addform .cb-card{box-shadow:none;border:1px dashed var(--cf-line);padding:.8rem;margin-bottom:.8rem}
.mc__check{display:flex;gap:.5rem;align-items:center;margin-bottom:.8rem;font-size:.88rem}
.mc__danger{display:flex;gap:.5rem;flex-wrap:wrap;padding-bottom:.6rem}
.mc__ok{color:var(--cf-sage);font-weight:700}
.mc-promo{margin-top:1rem}.mc-promo__card{display:flex;gap:.9rem;align-items:center;background:#fff;border:2px dashed var(--cf-crema);border-radius:var(--cf-r);padding:1rem;color:inherit;text-decoration:none}
.mc-promo__card small{display:block;color:var(--cf-muted)}
/* coffee listing (1.3): denser 2-up cards on phones */
@media (max-width:575.98px){
  .page-products .cf-grid,.cf-listing .cf-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:.6rem}
  .cf-card .pcard__title{font-size:.88rem;line-height:1.5;min-height:2.6em}
  .cf-card .cf-notes li:nth-child(n+3){display:none}
  .cf-card__body{padding:.6rem}
}
.cf-card__unit{display:block;font-size:.7rem;color:var(--cf-muted)}
/* 1.3 pages use Latin digits */
.bb,.cb,.cb-card,.fd-results,.cf-quiz,.mc,.mc-promo,.cf-input{font-feature-settings:normal}