/* ============================================================
   CREMA — the specialty roaster
   Scoped to body.d-crema. 1rem = 10px.
   ============================================================ */
body.d-crema{
  --cr-green:#16301f;--cr-green2:#1f4029;--cr-gold:#b8995a;--cr-gold2:#d8bf8a;--cr-cream:#f7f2e9;--cr-paper:#fbf8f2;--cr-ink:#1b2419;--cr-soft:#4c5347;--cr-mute:#6d7367;--cr-line:#e6ddcc;
  --bg-primary:var(--cr-paper);--bg-secondary:var(--cr-cream);--bg-card:#fff;--bg-inset:#f2ecdf;
  --fg-primary:var(--cr-ink);--fg-soft:var(--cr-soft);--fg-muted:var(--cr-mute);--border-color:var(--cr-line);--border-strong:#d6c9ae;
  background:var(--cr-paper);color:var(--cr-ink);font-family:'Work Sans',system-ui,sans-serif
}
body.d-crema h1,body.d-crema h2,body.d-crema h3{font-family:'Gilda Display',Georgia,serif;font-weight:400;letter-spacing:-.01em;line-height:1.05}
body.d-crema em{font-style:italic;color:var(--cr-gold)}
.cr-kick{font-size:1.2rem;font-weight:600;letter-spacing:.26em;text-transform:uppercase;color:var(--cr-gold);margin-bottom:1.6rem}
.cr-kick-l{color:var(--cr-gold2)}

body.d-crema .bx-nav{background:rgba(251,248,242,.85)}
body.d-crema .bx-brand-mark{border-radius:8px;background:var(--cr-green)}
body.d-crema .bx-brand-mark img{background:transparent}
body.d-crema .bx-brand-txt b{font-family:'Gilda Display',serif;font-weight:400;font-size:2rem}
body.d-crema .bx-nav-links a{font-weight:500;font-size:1.2rem;letter-spacing:.12em;text-transform:uppercase;color:var(--cr-soft)}
body.d-crema .bx-nav-links a::after{background:var(--cr-gold);height:1px}
body.d-crema .bx-nav-cta{background:var(--cr-green);border-radius:2px;letter-spacing:.08em;text-transform:uppercase;font-size:1.1rem}

/* hero */
.cr-hero{position:relative;overflow:hidden;padding:calc(var(--nav-h) + 6rem) 3rem 9rem;background:radial-gradient(800px 600px at 78% 45%,#efe4cd,transparent 65%),var(--cr-paper)}
.cr-bean{position:absolute;width:38px;height:54px;border-radius:50%;background:linear-gradient(135deg,#6b4226,#3b2314);box-shadow:inset -4px -6px 10px rgba(0,0,0,.35);will-change:transform;opacity:.9}
.cr-bean::after{content:'';position:absolute;left:50%;top:10%;bottom:10%;width:5px;margin-left:-2.5px;border-radius:50%;background:#2a170c;transform:rotate(8deg)}
.cr-bean-0{left:6%;top:22%;transform:rotate(-20deg)}.cr-bean-1{left:44%;top:12%;width:26px;height:38px}.cr-bean-2{right:6%;top:18%;width:32px;height:46px}
.cr-bean-3{right:40%;bottom:12%;width:30px;height:42px}.cr-bean-4{left:32%;bottom:20%;width:22px;height:32px;opacity:.6}.cr-bean-5{right:14%;bottom:18%;width:44px;height:62px}
.cr-hero-in{position:relative;z-index:1;max-width:var(--max-w);margin:0 auto;display:grid;grid-template-columns:1.05fr .95fr;gap:5rem;align-items:center}
.cr-logo{width:64px;height:64px;border-radius:14px;background:var(--cr-green);padding:10px;margin-bottom:2.6rem}
.cr-hero h1{font-size:clamp(4.8rem,7vw,8.6rem);color:var(--cr-green)}
.cr-lede{font-size:1.75rem;line-height:1.7;color:var(--cr-soft);margin-top:2.4rem;max-width:48ch}
.cr-actions{display:flex;flex-wrap:wrap;gap:1.2rem;margin-top:3.6rem}
.cr-btn{display:inline-flex;align-items:center;gap:1rem;padding:1.6rem 2.8rem;border-radius:2px;font-size:1.3rem;font-weight:600;letter-spacing:.14em;text-transform:uppercase;transition:background .25s,color .25s,transform .25s var(--ease)}
.cr-btn-main{background:var(--cr-green);color:var(--cr-gold2)}
.cr-btn-main:hover{background:var(--cr-green2);transform:translateY(-2px)}
.cr-btn-line{border:1px solid var(--cr-green);color:var(--cr-green)}
.cr-btn-line:hover{background:var(--cr-green);color:#fff}
.cr-btn-gold{background:var(--cr-gold);color:var(--cr-green)}
.cr-btn-gold:hover{background:var(--cr-gold2)}
.cr-stage{position:relative;display:flex;justify-content:center}
.cr-halo{position:absolute;left:50%;top:50%;width:460px;height:460px;margin:-230px 0 0 -230px;border-radius:50%;border:1px solid rgba(184,153,90,.35);box-shadow:0 0 0 40px rgba(184,153,90,.06),0 0 0 90px rgba(184,153,90,.04)}
.cr-pack{position:relative;width:min(440px,100%);aspect-ratio:1;object-fit:cover;border-radius:24px;box-shadow:0 50px 90px rgba(22,48,31,.28);transition:transform .3s var(--ease)}
.cr-tag{position:absolute;right:0;bottom:8%;background:#fff;padding:1.4rem 2rem;border-left:3px solid var(--cr-gold);box-shadow:0 20px 40px rgba(22,48,31,.14);display:flex;flex-direction:column}
.cr-tag small{font-size:1.05rem;letter-spacing:.16em;text-transform:uppercase;color:var(--cr-mute)}
.cr-tag b{font-family:'Gilda Display',serif;font-weight:400;font-size:2.2rem;color:var(--cr-green)}

.cr-std{display:grid;grid-template-columns:repeat(4,1fr);background:var(--cr-green);color:#e9e4d6}
.cr-std>div{padding:4rem 3.2rem;border-left:1px solid rgba(216,191,138,.18)}
.cr-std>div:first-child{border-left:0}
.cr-std i{font-size:2rem;color:var(--cr-gold2);margin-bottom:2rem;display:block}
.cr-std h3{font-size:2.3rem;color:#fff}
.cr-std p{font-size:1.4rem;line-height:1.6;color:rgba(233,228,214,.72);margin-top:.8rem}

/* sections */
.cr-sec{padding:10rem 3rem 0}
.cr-sec-tight{padding-top:5rem}
.cr-sec>*{max-width:var(--max-w);margin-left:auto;margin-right:auto}
.cr-head{text-align:center;margin-bottom:5rem;max-width:720px!important}
.cr-head>p:not(.cr-kick){font-size:1.6rem;color:var(--cr-soft);margin-top:1.4rem}
.cr-sec h2{font-size:clamp(3.8rem,5.4vw,6.4rem);color:var(--cr-green)}

.cr-shelf{display:grid;grid-template-columns:repeat(3,1fr);gap:2.4rem}
.cr-prod{background:#fff;border:1px solid var(--cr-line);display:flex;flex-direction:column;transition:transform .35s var(--ease),box-shadow .35s}
.cr-prod:hover{transform:translateY(-6px);box-shadow:0 30px 60px rgba(22,48,31,.12)}
.cr-prod-img{display:block;aspect-ratio:1;overflow:hidden;background:var(--cr-cream)}
.cr-prod-img img{width:100%;height:100%;object-fit:cover;transition:transform 1s var(--ease)}
.cr-prod:hover .cr-prod-img img{transform:scale(1.05)}
.cr-prod-body{padding:2.6rem;display:flex;flex-direction:column;flex:1}
.cr-prod-body small{font-size:1.1rem;letter-spacing:.16em;text-transform:uppercase;color:var(--cr-gold)}
.cr-prod-body h3{font-size:2.6rem;color:var(--cr-green);margin:.6rem 0}
.cr-prod-body p{font-size:1.45rem;line-height:1.6;color:var(--cr-soft);flex:1}
.cr-prod-foot{display:flex;justify-content:space-between;align-items:center;margin-top:2rem;padding-top:1.6rem;border-top:1px solid var(--cr-line)}
.cr-prod-foot b{font-family:'Gilda Display',serif;font-weight:400;font-size:2rem}
.cr-prod-foot a{margin-left:auto;font-size:1.2rem;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--cr-green);display:inline-flex;gap:.6rem;align-items:center}
.cr-prod-foot a:hover{color:var(--cr-gold)}

.cr-lines{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:1.6rem}
.cr-line{display:flex;gap:1.6rem;align-items:flex-start;padding:2.6rem;background:var(--cr-cream);border:1px solid var(--cr-line)}
.cr-line i{font-size:2.2rem;color:var(--cr-gold)}
.cr-line h3{font-size:2.2rem;color:var(--cr-green)}
.cr-line p{font-size:1.4rem;color:var(--cr-soft);margin-top:.4rem}

.cr-story{max-width:980px!important;text-align:center}
.cr-story-cols{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:3rem;margin-top:4rem;text-align:left}
.cr-story-cols p{font-size:1.6rem;line-height:1.8;color:var(--cr-soft)}
.cr-story-cols p:first-child::first-letter{font-family:'Gilda Display',serif;float:left;font-size:4em;line-height:.8;padding:.4rem 1rem 0 0;color:var(--cr-gold)}

.cr-cafe{position:relative;overflow:hidden;margin:10rem 2rem 0;background:var(--cr-green);color:#fff;isolation:isolate}
.cr-cafe-bg{position:absolute;inset:-30% -10%;z-index:-1;background:radial-gradient(500px 300px at 20% 30%,rgba(184,153,90,.3),transparent 60%),radial-gradient(600px 400px at 85% 80%,rgba(216,191,138,.18),transparent 60%);will-change:transform}
.cr-cafe-in{max-width:880px;margin:0 auto;padding:9rem 3rem;text-align:center}
.cr-cafe h2{font-size:clamp(3.6rem,5vw,5.8rem);color:#fff}
.cr-cafe-in>p:not(.cr-kick){font-size:1.7rem;color:rgba(255,255,255,.75);margin:2rem 0 3.4rem}

.cr-gal{display:grid;grid-template-columns:repeat(3,1fr);gap:1.4rem}
.cr-gal-item{padding:0;aspect-ratio:1;overflow:hidden;cursor:zoom-in}
.cr-gal-item img{width:100%;height:100%;object-fit:cover}
.cr-rev{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:1.6rem}
.cr-rev figure{background:#fff;border:1px solid var(--cr-line);padding:3rem}
.cr-rev blockquote{font-family:'Gilda Display',serif;font-size:2rem;line-height:1.45}
body.d-crema .hours-card{max-width:none}

.cr-contact{display:grid;grid-template-columns:1fr 1fr;gap:5rem;padding:5rem;background:var(--cr-cream);border:1px solid var(--cr-line)}
.cr-contact h2{margin-bottom:3rem}
.cr-social{display:flex;gap:1rem;margin-top:2rem}
body.d-crema .ci{border-radius:2px}
body.d-crema .ci-ico{background:var(--cr-green);color:var(--cr-gold2)}
body.d-crema .contact-form{border-radius:2px;border:0;box-shadow:0 24px 60px rgba(22,48,31,.08)}
body.d-crema .contact-form h3{font-family:'Gilda Display',serif;font-weight:400;font-size:2.8rem;margin-bottom:1.6rem;color:var(--cr-green)}
body.d-crema .cf-field input,body.d-crema .cf-field textarea{border-radius:2px;background:var(--cr-paper)}
body.d-crema .btn-onbiz{background:var(--cr-green);color:var(--cr-gold2);border-radius:2px}
.cr-map{margin-top:3rem}
body.d-crema .biz-map{border-radius:2px}
.cr-share{max-width:var(--max-w);margin:4rem auto 0;padding:0 3rem}
body.d-crema .bx-foot{background:var(--cr-green);color:#e9e4d6;border-top:0;margin-top:6rem}
body.d-crema .bx-foot p,body.d-crema .bx-foot li,body.d-crema .bx-foot a{color:rgba(233,228,214,.72)}
body.d-crema .bx-foot-col h2{color:var(--cr-gold2)}
body.d-crema .bx-foot .bx-brand-txt b{color:#fff}
body.d-crema .bx-foot .btn{border-radius:2px}
body.d-crema .bx-foot .btn-onbiz{background:var(--cr-gold);color:var(--cr-green)}
body.d-crema .bx-foot .btn-outline{border-color:rgba(233,228,214,.35);color:#fff}
body.d-crema .bx-foot-bottom{border-top-color:rgba(233,228,214,.12)}
.cr-hero-in>*,.cr-contact>*{min-width:0}

@media (max-width:980px){
  .cr-hero-in,.cr-contact{grid-template-columns:1fr}
  .cr-std{grid-template-columns:1fr 1fr}
  .cr-std>div:nth-child(3){border-left:0}
  .cr-shelf{grid-template-columns:1fr 1fr}
  .cr-halo{width:360px;height:360px;margin:-180px 0 0 -180px}
  .cr-contact{padding:3rem}
}
@media (max-width:640px){
  .cr-hero{padding:calc(var(--nav-h) + 3rem) 1.6rem 6rem}
  .cr-std{grid-template-columns:1fr}
  .cr-std>div{border-left:0;border-top:1px solid rgba(216,191,138,.18);padding:3rem 2rem}
  .cr-sec{padding:7rem 1.6rem 0}
  .cr-shelf,.cr-gal{grid-template-columns:1fr}
  .cr-halo{width:280px;height:280px;margin:-140px 0 0 -140px}
  .cr-tag{right:.6rem;bottom:1rem}
  .cr-cafe{margin:7rem 0 0}
  .cr-cafe-in{padding:6rem 2rem}
  .cr-contact{padding:2rem}
  .cr-share{padding:0 1.6rem}
}