/* Coffee Lovers — Phase 14 Visual Review / Premium Minimal */
:root{--cl-ink:#211b17;--cl-paper:#f6f2ec;--cl-paper2:#fffdfa;--cl-line:#d9cfc5;--cl-coffee:#4b3024;--cl-green:#263f39;--cl-gold:#9b7546}
body{background:var(--cl-paper)!important;color:var(--cl-ink)!important}
.cl-legacy-header,.drawer.cl-legacy-header{display:none!important}
.cl-global-header{background:rgba(255,253,250,.94)!important;backdrop-filter:blur(18px);border-bottom:1px solid rgba(75,48,36,.12)!important}
main{overflow:hidden}
.hero{min-height:620px!important;display:grid!important;grid-template-columns:minmax(0,.92fr) minmax(420px,1.08fr)!important;align-items:center!important;gap:clamp(32px,6vw,90px)!important;padding:72px max(6vw,28px)!important;background:var(--cl-paper)!important;color:var(--cl-ink)!important;border-bottom:1px solid var(--cl-line)!important}
.hero>div{max-width:650px}.hero .ey{color:var(--cl-gold)!important;font-size:12px!important;letter-spacing:.18em!important}.hero h1{font-size:clamp(42px,5.2vw,72px)!important;line-height:1.2!important;letter-spacing:-.035em!important;margin:15px 0 22px!important;color:var(--cl-ink)!important}.hero p{font-size:15px!important;line-height:2!important;color:#6e625a!important;max-width:540px!important}
.hero-image{margin:0!important;position:relative!important}.hero-image:before{content:"";position:absolute;inset:22px -22px -22px 22px;border:1px solid #cdbdad;border-radius:26px;z-index:0}.hero-image img{position:relative;z-index:1;width:100%!important;height:500px!important;object-fit:cover!important;border-radius:26px!important;box-shadow:0 30px 70px rgba(55,36,24,.12)!important}
.campaign{padding:34px max(6vw,28px)!important;background:var(--cl-paper2)!important}.slider{border:1px solid var(--cl-line)!important;border-radius:22px!important;overflow:hidden!important;box-shadow:none!important}.slide{min-height:310px!important;padding:42px clamp(28px,5vw,68px)!important}.slide h2{font-size:clamp(25px,3vw,38px)!important;line-height:1.35!important;margin:10px 0!important}.slide p{max-width:620px!important;line-height:1.9!important}.slide .big{font-size:clamp(44px,8vw,100px)!important;opacity:.12!important}.badge{font-size:10px!important;letter-spacing:.1em!important}.btn{border-radius:999px!important;padding:11px 19px!important;font-size:11px!important;box-shadow:none!important}
.section{padding:58px max(6vw,28px)!important;border-bottom:1px solid var(--cl-line)!important}.section h2{font-size:clamp(26px,3.2vw,40px)!important;line-height:1.35!important}.section .lead{font-size:14px!important;line-height:2!important;color:#71665e!important}
.origin{gap:48px!important}.origin-photo img{border-radius:20px!important;box-shadow:none!important}.rows{border-top:1px solid var(--cl-line)!important}.row{padding:20px 0!important;border-bottom:1px solid var(--cl-line)!important}.row b{font-size:14px!important}.row span{font-size:12px!important;line-height:1.9!important;color:#74685f!important}
.process-videos{margin-top:46px!important}.process-grid{gap:12px!important}.process-card{border:1px solid var(--cl-line)!important;border-radius:16px!important;box-shadow:none!important;padding:20px!important}.process-card p{font-size:11px!important;line-height:1.9!important}.process-no{font-size:11px!important;color:var(--cl-gold)!important}.video-trigger{border-radius:999px!important}
.market-grid{gap:12px!important}.market-quote-card{border:1px solid rgba(255,255,255,.14)!important;border-radius:18px!important;background:rgba(255,255,255,.045)!important;box-shadow:none!important}.quote-price strong{font-size:clamp(34px,5vw,56px)!important}.market-bottom{opacity:.7!important;font-size:10px!important}
.shop{min-height:260px!important;border-radius:24px!important;padding:40px!important;background:var(--cl-green)!important}.shop h2{color:#fff!important}.shop p{color:#d8e0dc!important}
.academy{background:var(--cl-paper2)!important}

@media (max-width:900px){.hero{grid-template-columns:1fr!important;min-height:auto!important;padding-top:44px!important}.hero>div{text-align:right!important}.hero-image img{height:min(70vw,480px)!important}.hero-image:before{inset:12px -12px -12px 12px}.campaign{padding:18px 14px!important}.section{padding:42px 18px!important}.slide{min-height:300px!important;padding:30px 22px!important}.slide .big{display:none!important}.origin{grid-template-columns:1fr!important}.process-grid{grid-template-columns:1fr!important}.shop{padding:28px!important}}
@media (max-width:520px){.hero{padding:34px 18px 44px!important;gap:28px!important}.hero h1{font-size:34px!important}.hero p{font-size:13px!important}.hero-image img{height:360px!important}.campaign{padding:12px!important}.slider{border-radius:16px!important}.slide{min-height:275px!important;padding:26px 18px!important}.section{padding:36px 16px!important}.section h2{font-size:24px!important}.market-grid{grid-template-columns:1fr!important}.shop{min-height:220px!important;border-radius:18px!important}}

/* Phase 15 — Header + Hero approval pass */
@media (min-width:901px){
 .cl-global-header{min-height:76px!important}
 .cl-global-inner{min-height:76px!important;max-width:1400px!important;padding-left:34px!important;padding-right:34px!important}
 .cl-global-brand{min-width:205px!important;gap:12px!important}
 .cl-company-header-logo{width:48px!important;height:48px!important;object-fit:contain!important}
 .cl-global-brand-copy b{font-size:13px!important;letter-spacing:.12em!important}
 .cl-global-brand-copy small{font-size:7px!important;letter-spacing:.13em!important}
 .cl-global-nav{gap:8px!important}
 .cl-global-link,.cl-global-trigger{font-size:12px!important;padding:12px 9px!important}
 .cl-global-cta{min-height:42px!important;padding:0 18px!important;font-size:11px!important;border-radius:13px!important}
 .cl-header-utilities{min-height:42px!important}
 .hero{min-height:535px!important;grid-template-columns:minmax(0,1fr) minmax(0,1.12fr)!important;gap:54px!important;padding:48px max(5.5vw,46px)!important}
 .hero>div{max-width:610px!important}
 .hero h1{font-size:clamp(40px,4.25vw,61px)!important;line-height:1.22!important;margin:12px 0 17px!important}
 .hero p{font-size:14px!important;line-height:1.9!important}
 .hero-image img{height:425px!important;border-radius:22px!important}
 .hero-image:before{inset:15px -15px -15px 15px!important;border-radius:22px!important}
}
@media (min-width:1280px){
 .hero{padding-left:max(5.5vw,70px)!important;padding-right:max(5.5vw,70px)!important}
}
@media (max-width:900px){
 .cl-global-header{min-height:68px!important}
 .hero{padding-top:30px!important}
}

/* Phase 16 — Header + Hero composition lock candidate */
@media (min-width:901px){
 .cl-global-header{min-height:82px!important}
 .cl-global-inner{min-height:82px!important;max-width:1460px!important;padding-inline:38px!important}
 .cl-global-brand{min-width:235px!important}
 .cl-company-header-logo{width:54px!important;height:54px!important}
 .cl-global-brand-copy b{font-size:14px!important}
 .cl-global-brand-copy small{font-size:7.5px!important}
 .cl-global-nav{gap:12px!important}
 .cl-global-link,.cl-global-trigger{font-size:12.5px!important;font-weight:700!important;padding:13px 10px!important}
 .cl-global-cta{min-height:44px!important;padding-inline:20px!important;font-size:11.5px!important}
 .hero{min-height:510px!important;grid-template-columns:minmax(0,1.18fr) minmax(390px,.82fr)!important;gap:28px!important;padding:42px max(5vw,48px)!important;position:relative!important}
 .hero>div{max-width:560px!important;justify-self:start!important;position:relative!important;z-index:2!important;margin-right:-18px!important}
 .hero h1{font-size:clamp(40px,4vw,58px)!important;line-height:1.2!important;margin:11px 0 16px!important}
 .hero p{font-size:14px!important;max-width:500px!important}
 .hero-image{justify-self:stretch!important}
 .hero-image img{height:420px!important;width:100%!important;object-fit:cover!important;object-position:center!important;border-radius:20px!important}
 .hero-image:before{inset:12px -12px -12px 12px!important;border-radius:20px!important}
}
@media (min-width:1250px){
 .hero{grid-template-columns:minmax(620px,1.22fr) minmax(440px,.78fr)!important;gap:18px!important}
 .hero>div{margin-right:-34px!important;padding-right:18px!important}
}
@media (max-width:900px){
 .cl-global-brand-copy{display:flex!important}
 .hero>div{order:1!important}
 .hero-image{order:2!important}
}

/* Phase 17 — Campaign polish + Origin redesign */
.campaign{padding-top:28px!important;padding-bottom:32px!important}
.slider{border-radius:20px!important}
.slide{min-height:286px!important;padding:36px clamp(28px,4.5vw,62px)!important}
.slide>div:first-child{max-width:680px!important}
.slide h2{font-size:clamp(25px,2.7vw,36px)!important;line-height:1.4!important}
.slide p{font-size:12px!important;line-height:2!important;max-width:600px!important}
.slide .big{font-family:Georgia,serif!important;letter-spacing:-.03em!important;opacity:.1!important}
.dots{bottom:17px!important}.dot{width:6px!important;height:6px!important}.dot.active{width:18px!important;border-radius:99px!important}
.arrows{bottom:14px!important;left:16px!important}.arrows button{width:31px!important;height:31px!important;border-radius:50%!important}

/* Origin becomes an editorial story, not an admin table */
#origin{background:#fbf9f5!important;padding-top:66px!important;padding-bottom:66px!important}
.origin.origin-with-image{display:grid!important;grid-template-columns:minmax(340px,.8fr) minmax(0,1.2fr)!important;gap:70px!important;align-items:start!important}
.origin-copy{position:sticky!important;top:112px!important}
.origin-copy .ey{display:inline-block!important;margin-bottom:10px!important;color:#8b6841!important;font-size:10px!important;letter-spacing:.16em!important}
.origin-copy h2{max-width:500px!important;margin:0 0 14px!important;font-size:clamp(30px,3.4vw,46px)!important;line-height:1.45!important;letter-spacing:-.025em!important}
.origin-copy .lead{margin:0 0 25px!important;font-size:13px!important;color:#75685f!important}
.origin-photo{margin:0!important;position:relative!important}
.origin-photo:after{content:"UGANDA · ORIGIN";position:absolute;bottom:14px;left:14px;padding:7px 10px;border-radius:999px;background:rgba(22,20,18,.7);backdrop-filter:blur(8px);color:#fff;font-size:8px;letter-spacing:.12em}
.origin-photo img{display:block!important;width:100%!important;aspect-ratio:4/3!important;object-fit:cover!important;border-radius:18px!important;border:1px solid #d9cfc5!important}
.origin .rows{border:0!important;display:grid!important;gap:0!important;counter-reset:originStep}
.origin .row{counter-increment:originStep;display:grid!important;grid-template-columns:62px 155px 1fr!important;gap:20px!important;align-items:start!important;padding:26px 0!important;border-top:1px solid #d8cec4!important;border-bottom:0!important}
.origin .row:last-child{border-bottom:1px solid #d8cec4!important}
.origin .row:before{content:"0" counter(originStep);font-family:Georgia,serif;font-size:26px;color:#aa8b68;line-height:1}
.origin .row b{font-size:14px!important;color:#2b241f!important;line-height:1.8!important}
.origin .row span{font-size:12px!important;color:#6f645c!important;line-height:2.05!important}
.process-videos{margin-top:58px!important;padding-top:38px!important;border-top:1px solid #d8cec4!important}
.compact-head{display:flex!important;justify-content:space-between!important;align-items:end!important;gap:30px!important;margin-bottom:22px!important}
.compact-head h2{margin:5px 0 0!important;font-size:26px!important}
.compact-head>p{max-width:440px!important;margin:0!important;font-size:10px!important;line-height:1.9!important;color:#83766c!important}
.process-grid{grid-template-columns:repeat(3,1fr)!important;gap:12px!important}
.process-card{min-height:180px!important;background:#fff!important;padding:20px!important;display:flex!important;flex-direction:column!important}
.process-card h3{margin:10px 0 5px!important;font-size:14px!important}
.process-card p{margin:0 0 18px!important;flex:1!important;color:#766a61!important}
.video-trigger{align-self:flex-start!important;border:1px solid #d1c5bb!important;background:transparent!important;color:#46362d!important;padding:8px 13px!important;font-size:9px!important}
@media (max-width:900px){
 #origin{padding-top:45px!important;padding-bottom:45px!important}
 .origin.origin-with-image{grid-template-columns:1fr!important;gap:34px!important}
 .origin-copy{position:static!important}
 .origin .row{grid-template-columns:45px 125px 1fr!important;gap:12px!important}
 .compact-head{display:block!important}.compact-head>p{margin-top:10px!important}
}
@media (max-width:620px){
 .campaign{padding:12px!important}
 .slide{min-height:260px!important}
 .origin .row{grid-template-columns:40px 1fr!important}
 .origin .row span{grid-column:2!important}
 .process-grid{grid-template-columns:1fr!important}
}

/* Phase 18 — Origin rebuilt from scratch: cinematic proof, not a table */
.origin-cinematic{padding:64px max(5.5vw,46px) 54px;background:#f6f2ec;color:#211b17;border-bottom:1px solid #d9cfc5}
.origin-visual{height:min(64vw,610px);min-height:480px;position:relative;overflow:hidden;border-radius:24px;background:#1f1a17}
.origin-visual>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center 43%;transform:scale(1.005)}
.origin-visual-shade{position:absolute;inset:0;background:linear-gradient(90deg,rgba(19,16,14,.18) 0%,rgba(19,16,14,.12) 35%,rgba(19,16,14,.66) 100%),linear-gradient(0deg,rgba(19,16,14,.48),transparent 55%)}
.origin-kicker{position:absolute;top:28px;right:30px;color:#f4eadd;font-size:9px;letter-spacing:.18em;border:1px solid rgba(255,255,255,.35);border-radius:999px;padding:8px 11px}
.origin-visual-copy{position:absolute;right:clamp(28px,5vw,72px);bottom:clamp(30px,5vw,64px);width:min(620px,52%);color:white;text-align:right}
.origin-visual-copy>span{font-size:9px;letter-spacing:.16em;color:#e4c9a9}
.origin-visual-copy h2{font-size:clamp(34px,4.2vw,62px);line-height:1.28;margin:12px 0 14px;letter-spacing:-.035em;color:#fff}
.origin-visual-copy p{max-width:560px;font-size:13px;line-height:2;color:#eee6dd;margin:0}
.origin-stamp{position:absolute;left:28px;bottom:28px;width:94px;height:94px;border:1px solid rgba(255,255,255,.45);border-radius:50%;display:flex;flex-direction:column;align-items:center;justify-content:center;color:#fff;transform:rotate(-8deg)}
.origin-stamp b{font:700 13px Georgia,serif;letter-spacing:.12em}.origin-stamp small{font-size:6px;letter-spacing:.16em;margin-top:4px}
.origin-proof{display:grid;grid-template-columns:.8fr 1.2fr;gap:70px;padding:50px 4px 42px;border-bottom:1px solid #d9cfc5}
.origin-proof-intro{max-width:420px}.origin-proof-intro .ey{color:#92704b;font-size:9px;letter-spacing:.16em}.origin-proof-intro h3{font-size:clamp(25px,2.5vw,36px);line-height:1.5;margin:9px 0 12px}.origin-proof-intro p{font-size:12px;line-height:2;color:#756960;margin:0}
.origin-proof-steps{display:grid;grid-template-columns:repeat(3,1fr);gap:0;border-top:1px solid #cfc3b7}
.origin-proof-steps article{padding:22px 20px 18px;border-left:1px solid #cfc3b7;min-height:145px}.origin-proof-steps article:last-child{border-left:0}
.origin-proof-steps article>span{display:block;font:400 20px Georgia,serif;color:#aa8762;margin-bottom:28px}.origin-proof-steps b{font-size:13px}.origin-proof-steps p{font-size:10.5px;line-height:1.9;color:#786c63;margin:7px 0 0}
.origin-quality-strip{display:grid;grid-template-columns:.75fr 1.25fr;gap:70px;align-items:center;padding-top:38px}
.origin-quality-strip h3{font-size:20px;margin:6px 0 0}.origin-quality-strip .ey{font-size:9px;color:#92704b;letter-spacing:.15em}
.origin-quality-actions{display:grid;grid-template-columns:repeat(3,1fr);border:1px solid #cfc3b7;border-radius:14px;overflow:hidden;background:#fbf9f5}
.origin-quality-actions .video-trigger{border:0!important;border-left:1px solid #d6ccc2!important;border-radius:0!important;background:transparent!important;color:#302720!important;padding:17px 15px!important;font-size:10px!important;text-align:right;display:flex;align-items:center;gap:8px;justify-content:flex-start}
.origin-quality-actions .video-trigger:last-child{border-left:0!important}.origin-quality-actions .video-trigger span{font-family:Georgia,serif;color:#a17c56}.origin-quality-actions .video-trigger i{margin-right:auto;font-style:normal;opacity:.5}
.origin-quality-actions .video-trigger:hover{background:#eee6dc!important}
@media (max-width:900px){
 .origin-cinematic{padding:38px 18px}.origin-visual{height:600px;min-height:0}.origin-visual-copy{width:auto;left:28px;right:28px}.origin-proof{grid-template-columns:1fr;gap:30px}.origin-quality-strip{grid-template-columns:1fr;gap:20px}
}
@media (max-width:620px){
 .origin-cinematic{padding:28px 12px}.origin-visual{height:540px;border-radius:18px}.origin-visual-copy{left:20px;right:20px;bottom:24px}.origin-visual-copy h2{font-size:32px}.origin-visual-copy p{font-size:11px}.origin-stamp{display:none}.origin-kicker{right:18px;top:18px}
 .origin-proof{padding:34px 2px}.origin-proof-steps{grid-template-columns:1fr}.origin-proof-steps article{display:grid;grid-template-columns:42px 1fr;min-height:0;border-left:0;border-bottom:1px solid #cfc3b7;padding:18px 4px}.origin-proof-steps article>span{margin:0}.origin-quality-actions{grid-template-columns:1fr}.origin-quality-actions .video-trigger{border-left:0!important;border-bottom:1px solid #d6ccc2!important}.origin-quality-actions .video-trigger:last-child{border-bottom:0!important}
}

/* Phase 19 — Coffee market as editorial trading graphic */
.market-editorial{background:#191612;color:#f8f4ed;padding:58px max(5.5vw,46px) 34px;overflow:hidden;position:relative}
.market-editorial:before{content:"";position:absolute;inset:0;pointer-events:none;background:radial-gradient(circle at 50% 35%,rgba(171,127,78,.11),transparent 38%)}
.market-editorial-head{position:relative;display:flex;justify-content:space-between;align-items:end;gap:40px;padding-bottom:28px;border-bottom:1px solid rgba(255,255,255,.14)}
.market-overline{font-size:8px;letter-spacing:.2em;color:#cba979}.market-editorial-head h2{font-size:clamp(30px,3.5vw,48px);margin:7px 0 0;line-height:1.25}
.market-head-meta{text-align:left;display:grid;grid-template-columns:auto auto;gap:4px 14px;align-items:center;font-size:9px;color:#91877c}.market-head-meta b{color:#ddd2c5}.market-head-meta a{grid-column:1/3;color:#d6b78f;text-decoration:none;margin-top:8px;font-size:10px}
.market-stage{position:relative;display:grid;grid-template-columns:1fr 1fr;min-height:405px;border-bottom:1px solid rgba(255,255,255,.14)}
.market-instrument{position:relative;overflow:hidden;padding:34px 34px 25px;min-width:0}.market-instrument:first-child{border-left:1px solid rgba(255,255,255,.14)}
.market-word{position:absolute;left:20px;bottom:54px;font:700 clamp(62px,8vw,126px)/.8 Georgia,serif;letter-spacing:-.055em;color:rgba(255,255,255,.032);white-space:nowrap;transform:rotate(-2deg);user-select:none}
.market-instrument-top{position:relative;z-index:2;display:flex;justify-content:space-between;align-items:start}.market-instrument-top div{display:flex;flex-direction:column;gap:5px}.market-instrument-top span{font-size:8px;letter-spacing:.18em;color:#b79b7a}.market-instrument-top b{font-size:12px;color:#f0e8de}
.market-change{font-style:normal;font:700 10px/1 monospace;padding:8px 10px;border:1px solid currentColor;border-radius:999px}.market-change.up,.market-contracts .up{color:#89b49d}.market-change.down,.market-contracts .down{color:#d48f86}
.market-number{position:relative;z-index:2;display:flex;align-items:flex-end;gap:12px;direction:ltr;margin:24px 0 0}.market-number strong{font:500 clamp(55px,6vw,92px)/.9 Georgia,serif;letter-spacing:-.055em}.market-number span{font-size:10px;color:#b4a99d;margin-bottom:8px;letter-spacing:.08em}
.market-line{position:absolute;z-index:1;left:0;right:0;top:154px;width:100%;height:145px;overflow:visible}.market-line .grid{fill:none;stroke:rgba(255,255,255,.055);stroke-width:1}.market-line .trend{fill:none;stroke:#c29a68;stroke-width:2;vector-effect:non-scaling-stroke;filter:drop-shadow(0 0 5px rgba(194,154,104,.18))}
.robusta .market-line .trend{stroke:#9f8972}
.market-contracts{position:absolute;z-index:2;bottom:25px;right:34px;left:34px;display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid rgba(255,255,255,.14);padding-top:14px;direction:ltr}.market-contracts>span{display:grid;gap:3px}.market-contracts small{font-size:7px;letter-spacing:.1em;color:#81786f}.market-contracts b{font:500 12px monospace;color:#e8ded3}.market-contracts i{font:700 7px monospace;font-style:normal}
.market-center-mark{position:absolute;z-index:4;left:50%;top:51%;transform:translate(-50%,-50%) rotate(-7deg);width:88px;height:88px;border:1px solid rgba(213,180,138,.45);border-radius:50%;background:#191612;box-shadow:0 0 0 8px rgba(25,22,18,.7);display:flex;flex-direction:column;align-items:center;justify-content:center;pointer-events:none}.market-center-mark span{font-size:6px;letter-spacing:.16em;color:#ad9271}.market-center-mark b{font:700 11px Georgia,serif;letter-spacing:.1em;margin:3px 0}.market-center-mark small{font-size:5px;color:#8c8176}
.market-editorial-foot{position:relative;display:flex;justify-content:space-between;align-items:center;padding-top:18px;color:#756d65;font-size:8px}.market-editorial-foot p{margin:0}.market-editorial-foot>div{letter-spacing:.11em;font-family:monospace}.market-editorial-foot b{color:#aa8a66;margin:0 5px}.live-dot{display:inline-block;width:5px;height:5px;border-radius:50%;background:#9bb29f;margin-left:6px;box-shadow:0 0 0 3px rgba(155,178,159,.08)}
@media (max-width:900px){
 .market-editorial{padding:42px 18px 28px}.market-stage{grid-template-columns:1fr}.market-instrument{min-height:360px}.market-instrument:first-child{border-left:0;border-bottom:1px solid rgba(255,255,255,.14)}.market-center-mark{display:none}.market-editorial-head{align-items:start}.market-editorial-foot{gap:20px}
}
@media (max-width:620px){
 .market-editorial-head{display:block}.market-head-meta{text-align:right;margin-top:18px;grid-template-columns:auto auto}.market-number strong{font-size:58px}.market-instrument{padding:28px 18px 22px}.market-contracts{right:18px;left:18px}.market-editorial-foot{display:block}.market-editorial-foot>div{margin-top:12px}.market-word{font-size:64px}
}

/* Phase 20 — Dedicated mobile market composition */
@media (max-width:620px){
  .market-editorial{
    padding:34px 14px 24px!important;
  }
  .market-editorial-head{
    padding-bottom:22px!important;
    border-bottom:1px solid rgba(255,255,255,.12)!important;
  }
  .market-editorial-head h2{
    font-size:30px!important;
    line-height:1.35!important;
  }
  .market-overline{
    font-size:7px!important;
    letter-spacing:.16em!important;
  }
  .market-head-meta{
    margin-top:16px!important;
    display:flex!important;
    flex-wrap:wrap!important;
    gap:7px 12px!important;
    align-items:center!important;
    font-size:8px!important;
  }
  .market-head-meta a{
    width:100%!important;
    margin-top:5px!important;
  }

  .market-stage{
    display:block!important;
    min-height:0!important;
    border-bottom:0!important;
  }
  .market-instrument{
    min-height:365px!important;
    padding:26px 6px 22px!important;
    border-bottom:1px solid rgba(255,255,255,.14)!important;
  }
  .market-instrument:first-child{
    border-left:0!important;
  }
  .market-instrument-top{
    align-items:center!important;
  }
  .market-instrument-top b{
    font-size:11px!important;
  }
  .market-change{
    font-size:9px!important;
    padding:7px 8px!important;
  }
  .market-number{
    margin-top:20px!important;
    gap:8px!important;
  }
  .market-number strong{
    font-size:66px!important;
    letter-spacing:-.06em!important;
  }
  .market-number span{
    font-size:8px!important;
    margin-bottom:7px!important;
  }
  .market-line{
    top:130px!important;
    height:126px!important;
  }
  .market-word{
    left:0!important;
    bottom:58px!important;
    font-size:66px!important;
    opacity:.9!important;
  }
  .market-contracts{
    right:6px!important;
    left:6px!important;
    bottom:20px!important;
    grid-template-columns:repeat(3,minmax(0,1fr))!important;
    gap:8px!important;
    padding-top:12px!important;
  }
  .market-contracts b{
    font-size:11px!important;
  }
  .market-contracts small{
    font-size:6px!important;
  }
  .market-contracts i{
    font-size:6px!important;
  }
  .market-center-mark{
    display:none!important;
  }
  .market-editorial-foot{
    padding-top:16px!important;
    font-size:7px!important;
    line-height:1.8!important;
  }
  .market-editorial-foot>div{
    margin-top:10px!important;
    font-size:6px!important;
    white-space:normal!important;
  }
}

/* Phase 21 — Mobile market compact polish */
@media (max-width:620px){
 .market-editorial{padding:27px 14px 19px!important}
 .market-editorial-head{padding-bottom:17px!important}
 .market-editorial-head h2{font-size:27px!important}
 .market-head-meta{margin-top:11px!important}
 .market-instrument{min-height:292px!important;padding:20px 6px 16px!important}
 .market-number{margin-top:13px!important}
 .market-number strong{font-size:56px!important}
 .market-line{top:105px!important;height:100px!important}
 .market-word{font-size:57px!important;bottom:47px!important}
 .market-contracts{bottom:14px!important;padding-top:9px!important}
 .market-contracts b{font-size:10px!important}
 .market-contracts small{font-size:5.5px!important}
 .market-instrument-top b{font-size:10px!important}
 .market-change{font-size:8px!important;padding:6px 7px!important}
 .market-editorial-foot{padding-top:12px!important}
}

/* Phase 22 — Shop universe + Takta College visual chapter */
.shop-universe{padding:68px max(5.5vw,46px) 72px;background:#f4f0e9;color:#211b17}
.shop-universe-head{display:flex;justify-content:space-between;align-items:end;gap:50px;margin-bottom:28px}
.shop-universe-head>div{max-width:720px}.shop-universe-head .ey{font-size:9px;letter-spacing:.16em;color:#826346}
.shop-universe-head h2{font-size:clamp(31px,3.2vw,47px);line-height:1.38;margin:8px 0 10px}
.shop-universe-head p{margin:0;max-width:620px;font-size:12px;line-height:2;color:#74685f}
.shop-all-link{flex:0 0 auto;text-decoration:none;color:#2b241e;border-bottom:1px solid #9d8f81;padding:8px 0;font-size:11px}.shop-all-link span{margin-right:8px}
.shop-universe-grid{display:grid;grid-template-columns:1.45fr .72fr .72fr;gap:14px;min-height:470px}
.shop-feature{position:relative;overflow:hidden;border-radius:20px;text-decoration:none;color:#fff;background:#231d19;isolation:isolate;min-height:470px}
.shop-feature>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .6s ease}
.shop-feature:hover>img{transform:scale(1.025)}.shop-feature-shade{position:absolute;inset:0;background:linear-gradient(180deg,rgba(15,13,12,.05),rgba(15,13,12,.78));z-index:1}
.shop-feature-copy{position:absolute;z-index:2;right:26px;left:26px;bottom:25px}.shop-feature-copy>span{font-size:7px;letter-spacing:.15em;color:#dfc8aa}.shop-feature-copy h3{font-size:27px;margin:7px 0 6px}.shop-feature-copy p{font-size:10.5px;line-height:1.9;color:#e5ddd3;margin:0 0 15px;max-width:380px}.shop-feature-copy b{font-size:9px;font-weight:600}
.shop-feature-side{background:#29463e}.shop-feature-side.powder{background:linear-gradient(145deg,#8b542f,#b67b43 55%,#d29a58);color:#fff}
.shop-feature-side.powder .shop-feature-copy p{color:#f8eadb}.shop-feature-art{position:absolute;left:-10px;top:45px;font:700 58px/.82 Georgia,serif;letter-spacing:-.05em;color:rgba(255,255,255,.13);transform:rotate(-5deg)}
.shop-feature-side.signature img{object-fit:cover;filter:saturate(.86)}
.academy-story{display:grid;grid-template-columns:1.08fr .92fr;min-height:590px;background:#181410;color:#f5eee6}
.academy-story-media{position:relative;overflow:hidden;min-height:590px}.academy-story-media>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;filter:saturate(.82) contrast(1.02)}
.academy-story-shade{position:absolute;inset:0;background:linear-gradient(90deg,rgba(24,20,16,.03),rgba(24,20,16,.08)),linear-gradient(0deg,rgba(24,20,16,.62),transparent 55%)}
.academy-story-badge{position:absolute;left:28px;bottom:28px;width:108px;height:108px;border-radius:50%;border:1px solid rgba(255,255,255,.45);background:rgba(22,18,14,.24);backdrop-filter:blur(7px);display:flex;flex-direction:column;align-items:center;justify-content:center}.academy-story-badge span{font-size:7px;letter-spacing:.17em;color:#d9b98f}.academy-story-badge b{font:700 15px Georgia,serif;letter-spacing:.08em;margin:4px 0}.academy-story-badge small{font-size:5px;letter-spacing:.1em;color:#c9bdae}
.academy-story-copy{padding:64px clamp(36px,5vw,76px);display:flex;flex-direction:column;justify-content:center}
.academy-mark-row{display:flex;align-items:center;gap:13px}.academy-mark-row img{width:48px;height:48px;border-radius:50%;object-fit:cover;border:1px solid #6a5846}.academy-mark-row .ey{font-size:9px;letter-spacing:.17em;color:#c59c6c}
.academy-story-copy h2{font-size:clamp(32px,3.5vw,52px);line-height:1.45;margin:19px 0 14px;max-width:580px}.academy-story-copy>p{font-size:12px;line-height:2;color:#bfb2a5;max-width:570px;margin:0 0 28px}
.academy-course-links{border-top:1px solid rgba(255,255,255,.14);border-bottom:1px solid rgba(255,255,255,.14)}
.academy-course-links a{display:grid;grid-template-columns:38px 100px 1fr;align-items:center;gap:15px;padding:15px 0;border-bottom:1px solid rgba(255,255,255,.1);text-decoration:none;color:#fff}.academy-course-links a:last-child{border-bottom:0}.academy-course-links span{font:400 13px Georgia,serif;color:#a98560}.academy-course-links b{font:600 13px Georgia,serif}.academy-course-links small{font-size:9px;color:#8f857a}
.academy-main-link{align-self:flex-start;margin-top:26px;color:#f3e6d8;text-decoration:none;border-bottom:1px solid #7f6850;padding:8px 0;font-size:10px}.academy-main-link span{margin-right:8px}
@media (max-width:900px){
 .shop-universe{padding:46px 18px}.shop-universe-grid{grid-template-columns:1fr 1fr}.shop-feature-main{grid-column:1/3;min-height:420px}.shop-feature-side{min-height:340px}
 .academy-story{grid-template-columns:1fr}.academy-story-media{min-height:480px}.academy-story-copy{padding:48px 26px}
}
@media (max-width:620px){
 .shop-universe{padding:36px 14px 40px}.shop-universe-head{display:block}.shop-universe-head h2{font-size:29px}.shop-all-link{display:inline-block;margin-top:18px}.shop-universe-grid{grid-template-columns:1fr;gap:10px}.shop-feature-main{grid-column:auto;min-height:360px}.shop-feature-side{min-height:250px}.shop-feature-copy{right:20px;left:20px;bottom:20px}.shop-feature-copy h3{font-size:24px}.shop-feature-art{font-size:48px}
 .academy-story-media{min-height:360px}.academy-story-copy{padding:38px 20px 44px}.academy-story-copy h2{font-size:30px}.academy-course-links a{grid-template-columns:30px 78px 1fr;gap:10px}.academy-mark-row img{width:42px;height:42px}.academy-story-badge{width:88px;height:88px;left:18px;bottom:18px}
}

/* Phase 23 — Real 3D roast bean field for Coffee Mixes */
.shop-bean-world{
  background:
    radial-gradient(circle at 38% 36%,rgba(184,125,69,.20),transparent 24%),
    radial-gradient(circle at 65% 64%,rgba(108,61,31,.28),transparent 28%),
    linear-gradient(145deg,#2a1b13,#120e0b 72%)!important;
}
.shop-bean-world:before{
  content:"";
  position:absolute;inset:0;z-index:0;
  background-image:linear-gradient(rgba(255,255,255,.025) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.025) 1px,transparent 1px);
  background-size:46px 46px;
  mask-image:linear-gradient(to bottom,rgba(0,0,0,.7),transparent 80%);
}
.shop-bean-field{position:absolute;inset:0;z-index:1;overflow:hidden;perspective:900px}
.shop-bean{position:absolute;width:145px;height:145px;--bean-rot:0deg;transform:rotate(var(--bean-rot));filter:drop-shadow(0 13px 9px rgba(0,0,0,.43));pointer-events:none}
.shop-bean::part(default-progress-bar){display:none}
.shop-bean-glow{position:absolute;z-index:1;inset:0;background:linear-gradient(180deg,transparent 42%,rgba(13,9,7,.18) 64%,rgba(13,9,7,.82) 100%);pointer-events:none}
.shop-bean-world .shop-feature-copy{z-index:4;max-width:470px}
.shop-bean-world .shop-feature-copy h3{font-size:34px}
.shop-bean-world .shop-feature-copy p{font-size:11px;max-width:430px}
.shop-roast-scale{position:absolute;z-index:4;top:24px;right:25px;display:flex;align-items:center;gap:7px;direction:ltr;font:700 6px/1 Arial,sans-serif;letter-spacing:.13em;color:rgba(255,255,255,.62)}
.shop-roast-scale i{display:block;width:28px;height:1px;background:rgba(255,255,255,.2)}
.shop-bean-1{left:4%;top:4%;--bean-rot:-21deg}.shop-bean-2{left:20%;top:-5%;--bean-rot:18deg}.shop-bean-3{left:39%;top:5%;--bean-rot:-6deg}.shop-bean-4{left:60%;top:-8%;--bean-rot:28deg}.shop-bean-5{left:79%;top:6%;--bean-rot:-18deg}
.shop-bean-6{left:9%;top:28%;--bean-rot:31deg}.shop-bean-7{left:29%;top:23%;--bean-rot:-27deg}.shop-bean-8{left:49%;top:29%;--bean-rot:12deg}.shop-bean-9{left:70%;top:24%;--bean-rot:-14deg}.shop-bean-10{left:87%;top:31%;--bean-rot:25deg}
.shop-bean-11{left:-2%;top:52%;--bean-rot:17deg}.shop-bean-12{left:18%;top:49%;--bean-rot:-8deg}.shop-bean-13{left:39%;top:51%;--bean-rot:29deg}.shop-bean-14{left:59%;top:47%;--bean-rot:-25deg}.shop-bean-15{left:80%;top:53%;--bean-rot:10deg}
.shop-bean-16{left:7%;top:70%;--bean-rot:-30deg}.shop-bean-17{left:34%;top:68%;--bean-rot:20deg}.shop-bean-18{left:68%;top:70%;--bean-rot:-12deg}
.shop-bean[data-roast="light"]{filter:brightness(1.18) saturate(.78) sepia(.14) drop-shadow(0 13px 9px rgba(0,0,0,.38))}
.shop-bean[data-roast="medium"]{filter:brightness(.91) saturate(.9) sepia(.12) drop-shadow(0 13px 9px rgba(0,0,0,.43))}
.shop-bean[data-roast="dark"]{filter:brightness(.63) saturate(.72) sepia(.08) contrast(1.08) drop-shadow(0 13px 9px rgba(0,0,0,.48))}
@media (min-width:901px){
 .shop-bean-world:hover .shop-bean-field{transform:scale(1.015);transition:transform .55s ease}
}
@media (max-width:620px){
 .shop-bean{width:112px;height:112px}
 .shop-bean-5,.shop-bean-10,.shop-bean-15,.shop-bean-18{display:none}
 .shop-roast-scale{top:18px;right:18px}
 .shop-bean-world .shop-feature-copy h3{font-size:28px}
}

/* Phase 24 — Five-bean composition: 3 medium-dark + 2 dark */
.shop-bean-world{min-height:470px!important}
.shop-bean-world .shop-bean-field{overflow:hidden!important}
.shop-bean-world .shop-bean{
  width:190px!important;height:190px!important;
  position:absolute!important;
  opacity:1!important;
  visibility:visible!important;
  z-index:2!important;
  pointer-events:none!important;
}
.shop-bean-world .bean-1{left:5%!important;top:4%!important;--bean-rot:-18deg}
.shop-bean-world .bean-2{left:35%!important;top:8%!important;--bean-rot:14deg}
.shop-bean-world .bean-3{left:66%!important;top:2%!important;--bean-rot:-10deg}
.shop-bean-world .bean-4{left:18%!important;top:39%!important;--bean-rot:22deg}
.shop-bean-world .bean-5{left:55%!important;top:41%!important;--bean-rot:-24deg}
.shop-bean-world .shop-bean[data-roast="medium-dark"]{
  filter:brightness(.78) saturate(.88) sepia(.10) contrast(1.06) drop-shadow(0 16px 12px rgba(0,0,0,.48))!important
}
.shop-bean-world .shop-bean[data-roast="dark"]{
  filter:brightness(.55) saturate(.72) sepia(.06) contrast(1.12) drop-shadow(0 17px 13px rgba(0,0,0,.55))!important
}
.shop-bean-world .shop-feature-copy{
  max-width:520px!important;
  background:linear-gradient(90deg,rgba(16,11,8,.82),rgba(16,11,8,.22),transparent)!important;
  padding:18px 18px 17px!important;
  margin-right:-18px!important;
  border-radius:14px!important;
}
.shop-bean-world .shop-roast-scale{display:none!important}
@media (max-width:620px){
 .shop-bean-world{min-height:380px!important}
 .shop-bean-world .shop-bean{width:135px!important;height:135px!important}
 .shop-bean-world .bean-1{left:1%!important;top:5%!important}
 .shop-bean-world .bean-2{left:34%!important;top:8%!important}
 .shop-bean-world .bean-3{left:67%!important;top:4%!important}
 .shop-bean-world .bean-4{left:12%!important;top:39%!important}
 .shop-bean-world .bean-5{left:55%!important;top:41%!important}
 .shop-bean-world .shop-feature-copy{right:18px!important;left:18px!important;bottom:15px!important;margin-right:0!important;padding:14px!important}
}

/* Phase 25 — Light bean canvas + 11 bean composition */
.shop-bean-world{
  background:
    radial-gradient(circle at 22% 22%,rgba(255,255,255,.86),transparent 26%),
    radial-gradient(circle at 76% 68%,rgba(210,184,150,.26),transparent 31%),
    linear-gradient(145deg,#eadfce 0%,#dfcfba 52%,#d8c5ad 100%)!important;
  color:#261a13!important;
  border:1px solid rgba(104,74,49,.14)!important;
}
.shop-bean-world:before{
  background-image:
    linear-gradient(rgba(77,54,36,.035) 1px,transparent 1px),
    linear-gradient(90deg,rgba(77,54,36,.035) 1px,transparent 1px)!important;
  mask-image:linear-gradient(to bottom,rgba(0,0,0,.9),rgba(0,0,0,.25))!important;
}
.shop-bean-world .shop-bean-glow{
  background:
    linear-gradient(180deg,rgba(255,255,255,.08),transparent 46%),
    linear-gradient(0deg,rgba(235,222,204,.93) 0%,rgba(235,222,204,.52) 20%,transparent 49%)!important;
}
.shop-bean-world .shop-feature-copy{
  color:#24170f!important;
  background:linear-gradient(90deg,rgba(239,226,207,.96),rgba(239,226,207,.86) 62%,rgba(239,226,207,.1))!important;
  box-shadow:0 12px 28px rgba(88,61,39,.08)!important;
}
.shop-bean-world .shop-feature-copy>span{color:#7b5134!important}
.shop-bean-world .shop-feature-copy p{color:#5c4738!important}
.shop-bean-world .shop-feature-copy b{color:#2c1d14!important}
.shop-bean-world .shop-bean{
  width:150px!important;height:150px!important;
  opacity:1!important;visibility:visible!important;
  filter:drop-shadow(0 16px 11px rgba(72,47,30,.23))!important;
}
.shop-bean-world .shop-bean[data-roast="medium-dark"]{
  filter:brightness(.88) saturate(.92) sepia(.08) contrast(1.05) drop-shadow(0 16px 11px rgba(72,47,30,.22))!important
}
.shop-bean-world .shop-bean[data-roast="dark"]{
  filter:brightness(.64) saturate(.76) sepia(.04) contrast(1.11) drop-shadow(0 17px 12px rgba(58,36,23,.28))!important
}
.shop-bean-world .bean-1{left:2%!important;top:4%!important;--bean-rot:-17deg}
.shop-bean-world .bean-2{left:18%!important;top:-2%!important;--bean-rot:13deg}
.shop-bean-world .bean-3{left:36%!important;top:5%!important;--bean-rot:-8deg}
.shop-bean-world .bean-4{left:55%!important;top:-3%!important;--bean-rot:22deg}
.shop-bean-world .bean-5{left:76%!important;top:5%!important;--bean-rot:-14deg}
.shop-bean-world .bean-6{left:7%!important;top:30%!important;--bean-rot:25deg}
.shop-bean-world .bean-7{left:26%!important;top:27%!important;--bean-rot:-22deg}
.shop-bean-world .bean-8{left:48%!important;top:29%!important;--bean-rot:9deg}
.shop-bean-world .bean-9{left:69%!important;top:27%!important;--bean-rot:-13deg}
.shop-bean-world .bean-10{left:15%!important;top:53%!important;--bean-rot:18deg}
.shop-bean-world .bean-11{left:58%!important;top:52%!important;--bean-rot:-19deg}
@media (max-width:620px){
 .shop-bean-world{min-height:390px!important}
 .shop-bean-world .shop-bean{width:112px!important;height:112px!important}
 .shop-bean-world .bean-1{left:-2%!important;top:3%!important}
 .shop-bean-world .bean-2{left:25%!important;top:-2%!important}
 .shop-bean-world .bean-3{left:53%!important;top:3%!important}
 .shop-bean-world .bean-4{left:79%!important;top:-3%!important}
 .shop-bean-world .bean-5{left:8%!important;top:26%!important}
 .shop-bean-world .bean-6{left:38%!important;top:24%!important}
 .shop-bean-world .bean-7{left:68%!important;top:26%!important}
 .shop-bean-world .bean-8{left:-1%!important;top:48%!important}
 .shop-bean-world .bean-9{left:28%!important;top:48%!important}
 .shop-bean-world .bean-10{left:58%!important;top:47%!important}
 .shop-bean-world .bean-11{left:82%!important;top:49%!important}
 .shop-bean-world .shop-feature-copy{
   background:linear-gradient(90deg,rgba(239,226,207,.97),rgba(239,226,207,.9))!important
 }
}

/* Phase 27 — 22 beans + 3x Phase26 speed */
.shop-bean-world .bean-1{left:1%!important;top:1%!important;--bean-rot:-17deg}
.shop-bean-world .bean-2{left:14%!important;top:-3%!important;--bean-rot:12deg}
.shop-bean-world .bean-3{left:28%!important;top:3%!important;--bean-rot:-9deg}
.shop-bean-world .bean-4{left:42%!important;top:-4%!important;--bean-rot:22deg}
.shop-bean-world .bean-5{left:57%!important;top:2%!important;--bean-rot:-14deg}
.shop-bean-world .bean-6{left:72%!important;top:-2%!important;--bean-rot:17deg}
.shop-bean-world .bean-7{left:86%!important;top:4%!important;--bean-rot:-7deg}
.shop-bean-world .bean-8{left:5%!important;top:22%!important;--bean-rot:24deg}
.shop-bean-world .bean-9{left:19%!important;top:18%!important;--bean-rot:-20deg}
.shop-bean-world .bean-10{left:34%!important;top:24%!important;--bean-rot:10deg}
.shop-bean-world .bean-11{left:49%!important;top:18%!important;--bean-rot:-15deg}
.shop-bean-world .bean-12{left:64%!important;top:23%!important;--bean-rot:19deg}
.shop-bean-world .bean-13{left:79%!important;top:19%!important;--bean-rot:-11deg}
.shop-bean-world .bean-14{left:90%!important;top:25%!important;--bean-rot:23deg}
.shop-bean-world .bean-15{left:-2%!important;top:43%!important;--bean-rot:-12deg}
.shop-bean-world .bean-16{left:12%!important;top:39%!important;--bean-rot:18deg}
.shop-bean-world .bean-17{left:27%!important;top:45%!important;--bean-rot:-24deg}
.shop-bean-world .bean-18{left:43%!important;top:40%!important;--bean-rot:9deg}
.shop-bean-world .bean-19{left:59%!important;top:44%!important;--bean-rot:-17deg}
.shop-bean-world .bean-20{left:74%!important;top:39%!important;--bean-rot:21deg}
.shop-bean-world .bean-21{left:88%!important;top:45%!important;--bean-rot:-8deg}
.shop-bean-world .bean-22{left:35%!important;top:58%!important;--bean-rot:16deg}
.shop-bean-world .shop-bean{width:128px!important;height:128px!important}
@media (max-width:620px){
 .shop-bean-world .shop-bean{width:88px!important;height:88px!important}
 .shop-bean-world .bean-1{left:-2%!important;top:1%!important}.shop-bean-world .bean-2{left:18%!important;top:-2%!important}.shop-bean-world .bean-3{left:39%!important;top:2%!important}.shop-bean-world .bean-4{left:61%!important;top:-2%!important}.shop-bean-world .bean-5{left:81%!important;top:2%!important}
 .shop-bean-world .bean-6{left:7%!important;top:18%!important}.shop-bean-world .bean-7{left:28%!important;top:15%!important}.shop-bean-world .bean-8{left:50%!important;top:19%!important}.shop-bean-world .bean-9{left:72%!important;top:15%!important}.shop-bean-world .bean-10{left:89%!important;top:20%!important}
 .shop-bean-world .bean-11{left:-3%!important;top:35%!important}.shop-bean-world .bean-12{left:18%!important;top:32%!important}.shop-bean-world .bean-13{left:40%!important;top:36%!important}.shop-bean-world .bean-14{left:62%!important;top:32%!important}.shop-bean-world .bean-15{left:82%!important;top:36%!important}
 .shop-bean-world .bean-16{left:7%!important;top:51%!important}.shop-bean-world .bean-17{left:29%!important;top:49%!important}.shop-bean-world .bean-18{left:51%!important;top:52%!important}.shop-bean-world .bean-19{left:73%!important;top:49%!important}.shop-bean-world .bean-20{left:89%!important;top:53%!important}
 .shop-bean-world .bean-21{left:20%!important;top:64%!important}.shop-bean-world .bean-22{left:61%!important;top:64%!important}
}

/* Phase 28 — Falling 3D coffee beans */
.shop-bean-world{
  overflow:hidden!important;
  background:
    radial-gradient(circle at 50% 6%,rgba(255,255,255,.98),rgba(255,255,255,.62) 20%,transparent 42%),
    linear-gradient(180deg,#f4eadb 0%,#e8d8c3 100%)!important;
}
.shop-bean-rain{
  position:absolute!important;
  inset:0!important;
  overflow:hidden!important;
  z-index:1!important;
  pointer-events:none!important;
}
.shop-bean-rain .shop-bean{
  position:absolute!important;
  top:-180px!important;
  left:var(--x,50%)!important;
  width:var(--size,118px)!important;
  height:var(--size,118px)!important;
  opacity:0!important;
  transform:translate3d(-50%,0,0) rotate(var(--tilt,0deg))!important;
  animation:
    clBeanFall var(--fall,4.8s) cubic-bezier(.18,.72,.28,1) var(--delay,0s) infinite,
    clBeanSway var(--sway,2.4s) ease-in-out var(--delay,0s) infinite alternate!important;
  will-change:transform,opacity!important;
}
@keyframes clBeanFall{
  0%{top:-180px;opacity:0}
  7%{opacity:1}
  82%{opacity:1}
  100%{top:calc(100% + 120px);opacity:0}
}
@keyframes clBeanSway{
  from{margin-left:-18px}
  to{margin-left:18px}
}
.shop-bean-world .shop-feature-copy{
  z-index:5!important;
  background:linear-gradient(90deg,rgba(247,237,223,.97),rgba(247,237,223,.86) 70%,rgba(247,237,223,.15))!important;
  backdrop-filter:blur(2px)!important;
}
.shop-bean-world .shop-bean-glow{
  z-index:3!important;
  background:linear-gradient(0deg,rgba(232,216,195,.92) 0%,rgba(232,216,195,.24) 26%,transparent 52%)!important;
}

/* Individual rain lanes */
.shop-bean-world .bean-1{--x:7%;--size:112px;--fall:4.2s;--delay:-.3s;--tilt:-18deg;--sway:2.0s}
.shop-bean-world .bean-2{--x:15%;--size:134px;--fall:5.0s;--delay:-2.1s;--tilt:13deg;--sway:2.8s}
.shop-bean-world .bean-3{--x:24%;--size:104px;--fall:4.5s;--delay:-1.1s;--tilt:-9deg;--sway:2.1s}
.shop-bean-world .bean-4{--x:32%;--size:126px;--fall:5.4s;--delay:-3.0s;--tilt:22deg;--sway:2.7s}
.shop-bean-world .bean-5{--x:40%;--size:116px;--fall:4.7s;--delay:-.8s;--tilt:-14deg;--sway:2.3s}
.shop-bean-world .bean-6{--x:48%;--size:138px;--fall:5.2s;--delay:-2.7s;--tilt:17deg;--sway:2.9s}
.shop-bean-world .bean-7{--x:56%;--size:101px;--fall:4.3s;--delay:-1.7s;--tilt:-7deg;--sway:2.0s}
.shop-bean-world .bean-8{--x:64%;--size:121px;--fall:5.1s;--delay:-3.6s;--tilt:24deg;--sway:2.6s}
.shop-bean-world .bean-9{--x:72%;--size:109px;--fall:4.6s;--delay:-.5s;--tilt:-20deg;--sway:2.2s}
.shop-bean-world .bean-10{--x:80%;--size:132px;--fall:5.5s;--delay:-2.4s;--tilt:10deg;--sway:3.0s}
.shop-bean-world .bean-11{--x:90%;--size:105px;--fall:4.4s;--delay:-1.4s;--tilt:-15deg;--sway:2.1s}

.shop-bean-world .bean-12{--x:11%;--size:98px;--fall:5.7s;--delay:-4.1s;--tilt:18deg;--sway:3.1s}
.shop-bean-world .bean-13{--x:20%;--size:118px;--fall:4.9s;--delay:-3.2s;--tilt:-11deg;--sway:2.5s}
.shop-bean-world .bean-14{--x:29%;--size:108px;--fall:5.3s;--delay:-4.7s;--tilt:7deg;--sway:2.8s}
.shop-bean-world .bean-15{--x:37%;--size:129px;--fall:4.8s;--delay:-2.0s;--tilt:-23deg;--sway:2.4s}
.shop-bean-world .bean-16{--x:45%;--size:103px;--fall:5.6s;--delay:-4.4s;--tilt:16deg;--sway:3.0s}
.shop-bean-world .bean-17{--x:53%;--size:120px;--fall:4.2s;--delay:-3.8s;--tilt:-8deg;--sway:2.2s}
.shop-bean-world .bean-18{--x:61%;--size:136px;--fall:5.0s;--delay:-1.9s;--tilt:21deg;--sway:2.9s}
.shop-bean-world .bean-19{--x:69%;--size:100px;--fall:4.7s;--delay:-4.9s;--tilt:-17deg;--sway:2.3s}
.shop-bean-world .bean-20{--x:77%;--size:124px;--fall:5.4s;--delay:-3.5s;--tilt:12deg;--sway:2.7s}
.shop-bean-world .bean-21{--x:85%;--size:111px;--fall:4.5s;--delay:-2.8s;--tilt:-6deg;--sway:2.1s}
.shop-bean-world .bean-22{--x:95%;--size:130px;--fall:5.8s;--delay:-4.3s;--tilt:19deg;--sway:3.1s}

@media (max-width:620px){
 .shop-bean-rain .shop-bean{width:var(--msize,82px)!important;height:var(--msize,82px)!important}
 .shop-bean-world .bean-1,.shop-bean-world .bean-6,.shop-bean-world .bean-11,.shop-bean-world .bean-16,.shop-bean-world .bean-21{--msize:72px}
 .shop-bean-world .bean-2,.shop-bean-world .bean-7,.shop-bean-world .bean-12,.shop-bean-world .bean-17,.shop-bean-world .bean-22{--msize:92px}
 .shop-bean-world .shop-feature-copy{background:rgba(247,237,223,.93)!important}
}
@media (prefers-reduced-motion:reduce){
 .shop-bean-rain .shop-bean{animation:none!important;top:18%!important;opacity:1!important}
}

/* Phase 29 — Stable falling system: wrapper falls, model-viewer only renders/rotates */
.shop-bean-rain .shop-bean{
  position:relative!important;
  inset:auto!important;
  left:auto!important;top:auto!important;
  display:block!important;
  width:100%!important;height:100%!important;
  opacity:1!important;visibility:visible!important;
  transform:none!important;
  animation:none!important;
  margin:0!important;
  filter:none!important;
}
.shop-bean-rain .bean-drop{
  position:absolute;
  z-index:2;
  left:var(--x);
  top:-150px;
  width:var(--size);
  height:var(--size);
  opacity:1;
  transform:translateX(-50%) rotate(var(--tilt));
  animation:beanDropStable var(--duration) linear var(--delay) infinite;
  will-change:top,transform;
}
.shop-bean-rain .bean-drop:nth-child(even) .shop-bean{filter:brightness(.66) saturate(.78) contrast(1.08)!important}
.shop-bean-rain .bean-drop:nth-child(odd) .shop-bean{filter:brightness(.90) saturate(.92) contrast(1.04)!important}
@keyframes beanDropStable{
  0%{top:-150px;transform:translateX(-50%) translateX(-10px) rotate(var(--tilt))}
  25%{transform:translateX(-50%) translateX(10px) rotate(calc(var(--tilt) + 5deg))}
  50%{transform:translateX(-50%) translateX(-8px) rotate(calc(var(--tilt) - 4deg))}
  75%{transform:translateX(-50%) translateX(9px) rotate(calc(var(--tilt) + 3deg))}
  100%{top:calc(100% + 35px);transform:translateX(-50%) translateX(-5px) rotate(calc(var(--tilt) + 9deg))}
}
.bean-drop-1{--x:5%;--size:104px;--duration:4.7s;--delay:-.4s;--tilt:-18deg}
.bean-drop-2{--x:13%;--size:126px;--duration:5.4s;--delay:-3.8s;--tilt:12deg}
.bean-drop-3{--x:21%;--size:94px;--duration:4.3s;--delay:-2.0s;--tilt:-8deg}
.bean-drop-4{--x:29%;--size:116px;--duration:5.1s;--delay:-1.2s;--tilt:20deg}
.bean-drop-5{--x:37%;--size:100px;--duration:4.6s;--delay:-4.0s;--tilt:-14deg}
.bean-drop-6{--x:45%;--size:130px;--duration:5.6s;--delay:-2.8s;--tilt:16deg}
.bean-drop-7{--x:53%;--size:92px;--duration:4.2s;--delay:-1.0s;--tilt:-6deg}
.bean-drop-8{--x:61%;--size:118px;--duration:5.0s;--delay:-4.5s;--tilt:22deg}
.bean-drop-9{--x:69%;--size:98px;--duration:4.5s;--delay:-2.4s;--tilt:-19deg}
.bean-drop-10{--x:77%;--size:124px;--duration:5.3s;--delay:-.8s;--tilt:9deg}
.bean-drop-11{--x:86%;--size:96px;--duration:4.4s;--delay:-3.3s;--tilt:-13deg}
.bean-drop-12{--x:94%;--size:120px;--duration:5.5s;--delay:-1.8s;--tilt:17deg}
.bean-drop-13{--x:9%;--size:88px;--duration:5.8s;--delay:-5.1s;--tilt:-10deg}
.bean-drop-14{--x:18%;--size:110px;--duration:4.9s;--delay:-3.1s;--tilt:7deg}
.bean-drop-15{--x:26%;--size:96px;--duration:5.2s;--delay:-4.7s;--tilt:-21deg}
.bean-drop-16{--x:34%;--size:122px;--duration:4.8s;--delay:-2.5s;--tilt:15deg}
.bean-drop-17{--x:50%;--size:106px;--duration:5.7s;--delay:-5.0s;--tilt:-7deg}
.bean-drop-18{--x:58%;--size:128px;--duration:4.6s;--delay:-3.6s;--tilt:20deg}
.bean-drop-19{--x:66%;--size:90px;--duration:5.0s;--delay:-1.5s;--tilt:-16deg}
.bean-drop-20{--x:74%;--size:114px;--duration:5.4s;--delay:-4.2s;--tilt:11deg}
.bean-drop-21{--x:82%;--size:102px;--duration:4.3s;--delay:-2.2s;--tilt:-5deg}
.bean-drop-22{--x:90%;--size:126px;--duration:5.6s;--delay:-5.3s;--tilt:18deg}
@media (max-width:620px){
 .shop-bean-rain .bean-drop{width:calc(var(--size) * .72);height:calc(var(--size) * .72)}
}
@media (prefers-reduced-motion:reduce){
 .shop-bean-rain .bean-drop{animation:beanDropStable var(--duration) linear var(--delay) infinite!important}
}

/* Phase 30 — Cinematic packaging carousel, 3-second cadence */
.shop-pack-cinema{
  min-height:470px!important;
  background:#17120f!important;
  overflow:hidden!important;
  border:1px solid rgba(107,75,49,.14)!important;
}
.shop-pack-stage{position:absolute;inset:0;overflow:hidden;background:
 radial-gradient(circle at 62% 42%,rgba(171,118,72,.22),transparent 34%),
 linear-gradient(145deg,#211711,#0f0b09 75%);}
.shop-pack-shot{position:absolute;inset:0;margin:0;opacity:0;transform:scale(1.08) translateX(18px);transition:opacity 1.05s ease,transform 1.8s cubic-bezier(.2,.7,.2,1);z-index:1}
.shop-pack-shot img{width:100%;height:100%;object-fit:cover;object-position:center;filter:saturate(.9) contrast(1.03) brightness(.88)}
.shop-pack-shot.is-active{opacity:1;transform:scale(1) translateX(0);z-index:2}
.shop-pack-shot.is-exiting{opacity:0;transform:scale(.97) translateX(-18px);z-index:2}
.shop-pack-light{position:absolute;inset:-25%;z-index:3;pointer-events:none;background:linear-gradient(115deg,transparent 38%,rgba(255,234,201,.12) 47%,rgba(255,255,255,.22) 50%,rgba(255,234,201,.09) 53%,transparent 62%);transform:translateX(-55%);animation:shopPackLightSweep 6s ease-in-out infinite}
@keyframes shopPackLightSweep{0%,25%{transform:translateX(-55%)}55%,100%{transform:translateX(55%)}}
.shop-pack-grain{position:absolute;inset:0;z-index:4;pointer-events:none;opacity:.18;background-image:radial-gradient(rgba(255,255,255,.18) .45px,transparent .45px);background-size:4px 4px;mix-blend-mode:soft-light}
.shop-pack-cinema:after{content:"";position:absolute;inset:0;z-index:4;background:linear-gradient(180deg,rgba(12,9,7,.02),rgba(12,9,7,.12) 45%,rgba(12,9,7,.72) 100%);pointer-events:none}
.shop-pack-cinema .shop-feature-copy{z-index:6;color:#fff;background:linear-gradient(90deg,rgba(18,12,9,.76),rgba(18,12,9,.24),transparent)!important;padding:16px 18px!important;margin-right:-18px!important;border-radius:14px!important}
.shop-pack-cinema .shop-feature-copy>span{color:#d5b184!important}
.shop-pack-cinema .shop-feature-copy p{color:#e3d8cb!important}
.shop-pack-cinema .shop-feature-copy b{color:#fff!important}
.shop-pack-index{position:absolute;z-index:6;top:24px;left:24px;display:flex;align-items:center;gap:8px;direction:ltr;color:#f1dfca;font:700 7px/1 Arial,sans-serif;letter-spacing:.13em}
.shop-pack-index i{width:36px;height:1px;background:rgba(241,223,202,.45)}
@media (max-width:620px){
 .shop-pack-cinema{min-height:380px!important}
 .shop-pack-shot img{object-fit:cover;object-position:center}
 .shop-pack-cinema .shop-feature-copy{right:18px!important;left:18px!important;bottom:16px!important;margin-right:0!important;padding:14px!important}
 .shop-pack-index{top:18px;left:18px}
}
@media (prefers-reduced-motion:reduce){
 .shop-pack-shot{transition:none!important}
 .shop-pack-light{animation:none!important}
}

/* Phase 31 — Smaller package framing + checkerboard transition */
.shop-pack-stage{background:linear-gradient(145deg,#efe4d5,#dbc5aa)!important}
.shop-pack-shot{
  inset:20px 24px 78px!important;
  border-radius:16px!important;
  overflow:hidden!important;
  background:#f2e8dc!important;
  opacity:0!important;
  transform:none!important;
  transition:none!important;
  z-index:1!important;
}
.shop-pack-shot img{
  width:100%!important;height:100%!important;
  object-fit:contain!important;
  object-position:center!important;
  transform:scale(.82)!important;
  filter:saturate(.94) contrast(1.02) brightness(.98)!important;
}
.shop-pack-shot.is-active{opacity:1!important;z-index:2!important}
.shop-pack-shot.is-exiting{opacity:1!important;z-index:3!important}
.shop-pack-shot.is-entering{opacity:1!important;z-index:4!important}

/* 8x6 checkerboard mask */
.shop-pack-shot.is-entering{
  -webkit-mask-image:
    linear-gradient(#000 0 0);
  mask-image:linear-gradient(#000 0 0);
  animation:clCheckerReveal .82s steps(1,end) both!important;
}
@keyframes clCheckerReveal{
  0%{clip-path:polygon(0 0,0 0,0 0)}
  12.5%{clip-path:polygon(0 0,25% 0,25% 16.66%,0 16.66%)}
  25%{clip-path:polygon(0 0,50% 0,50% 33.33%,0 33.33%)}
  37.5%{clip-path:polygon(0 0,75% 0,75% 50%,0 50%)}
  50%{clip-path:polygon(0 0,100% 0,100% 50%,0 50%)}
  62.5%{clip-path:polygon(0 0,100% 0,100% 66.66%,0 66.66%)}
  75%{clip-path:polygon(0 0,100% 0,100% 83.33%,0 83.33%)}
  100%{clip-path:polygon(0 0,100% 0,100% 100%,0 100%)}
}
.shop-pack-checker{
 position:absolute;inset:20px 24px 78px;z-index:5;pointer-events:none;
 display:grid;grid-template-columns:repeat(8,1fr);grid-template-rows:repeat(6,1fr);
 border-radius:16px;overflow:hidden;
}
.shop-pack-checker i{background:#f1e5d6;opacity:0;transform:scale(.15)}
.shop-pack-checker.run i{animation:clTile .58s ease both}
@keyframes clTile{
 0%{opacity:.96;transform:scale(1)}
 48%{opacity:.96;transform:scale(1)}
 100%{opacity:0;transform:scale(.08)}
}
@media (max-width:620px){
 .shop-pack-shot{inset:16px 16px 92px!important}
 .shop-pack-shot img{transform:scale(.76)!important}
 .shop-pack-checker{inset:16px 16px 92px}
}

/* Phase 32 — Cinematic multicolor backgrounds */
.shop-pack-cinema{
  background:#e8dccd!important;
}
.shop-pack-stage{
  --c1:#efe4d5;
  --c2:#d4b99c;
  --c3:#8a5a3c;
  background:
    radial-gradient(circle at 24% 18%,rgba(255,255,255,.78),transparent 30%),
    radial-gradient(circle at 76% 76%,color-mix(in srgb,var(--c3) 34%,transparent),transparent 38%),
    linear-gradient(135deg,var(--c1),var(--c2))!important;
  transition:background 900ms ease!important;
}
.shop-pack-stage[data-theme="0"]{--c1:#f2dfd8;--c2:#d79b87;--c3:#8f3e4b}
.shop-pack-stage[data-theme="1"]{--c1:#e8dfcf;--c2:#c7aa72;--c3:#5e4b78}
.shop-pack-stage[data-theme="2"]{--c1:#f0d7c0;--c2:#c96943;--c3:#8f3028}
.shop-pack-stage[data-theme="3"]{--c1:#d9d7ca;--c2:#89907c;--c3:#313830}
.shop-pack-stage[data-theme="4"]{--c1:#d7e4da;--c2:#8ab0a0;--c3:#d47b3f}
.shop-pack-stage[data-theme="5"]{--c1:#d4d1cc;--c2:#73716f;--c3:#252525}
.shop-pack-stage[data-theme="6"]{--c1:#ead9db;--c2:#a45e68;--c3:#661f2e}
.shop-pack-stage[data-theme="7"]{--c1:#eee1cd;--c2:#c39b6f;--c3:#6d4e35}

.shop-pack-shot{
  inset:24px 34px 92px!important;
  background:transparent!important;
  border-radius:18px!important;
  box-shadow:none!important;
}
.shop-pack-shot:before{
  content:"";
  position:absolute;
  inset:8%;
  border-radius:24px;
  background:rgba(255,255,255,.16);
  box-shadow:0 22px 55px rgba(78,51,31,.10);
  backdrop-filter:blur(2px);
  z-index:-1;
}
.shop-pack-shot img{
  transform:scale(.74)!important;
  filter:saturate(.98) contrast(1.04) brightness(1.02) drop-shadow(0 24px 24px rgba(52,34,23,.22))!important;
}

.shop-pack-light{
  opacity:.72!important;
  mix-blend-mode:screen!important;
}
.shop-pack-grain{opacity:.10!important}
.shop-pack-cinema:after{
  background:
    linear-gradient(180deg,rgba(255,255,255,.02),rgba(20,14,10,.03) 52%,rgba(20,14,10,.25) 100%)!important;
}

/* Cleaner checker effect */
.shop-pack-checker{
  inset:24px 34px 92px!important;
  border-radius:18px!important;
  gap:2px!important;
}
.shop-pack-checker i{
  background:color-mix(in srgb,var(--c3) 62%,white 38%)!important;
  border-radius:2px!important;
  opacity:0;
  transform:scale(.2);
}
.shop-pack-checker.run i{animation:clTile32 .64s cubic-bezier(.2,.75,.25,1) both!important}
@keyframes clTile32{
  0%{opacity:.86;transform:scale(1)}
  42%{opacity:.82;transform:scale(1)}
  100%{opacity:0;transform:scale(.12)}
}

.shop-pack-cinema .shop-feature-copy{
  background:linear-gradient(90deg,rgba(255,249,242,.92),rgba(255,249,242,.70) 72%,rgba(255,249,242,.10))!important;
  color:#251a14!important;
  box-shadow:0 12px 30px rgba(70,45,28,.08)!important;
}
.shop-pack-cinema .shop-feature-copy>span{color:#7d5338!important}
.shop-pack-cinema .shop-feature-copy p{color:#5b4639!important}
.shop-pack-cinema .shop-feature-copy b{color:#271a13!important}
.shop-pack-index{color:#5f4434!important}
.shop-pack-index i{background:rgba(95,68,52,.35)!important}

@media (max-width:620px){
 .shop-pack-shot{inset:18px 20px 106px!important}
 .shop-pack-shot img{transform:scale(.68)!important}
 .shop-pack-checker{inset:18px 20px 106px!important}
 .shop-pack-cinema .shop-feature-copy{
   background:rgba(255,249,242,.91)!important;
 }
}

/* Phase 33 — Package-first cinematic composition */
.shop-pack-cinema{min-height:470px!important}
.shop-pack-stage{
  background:
    radial-gradient(circle at 56% 40%,rgba(255,255,255,.58),transparent 27%),
    radial-gradient(circle at 78% 78%,color-mix(in srgb,var(--c3) 42%,transparent),transparent 42%),
    linear-gradient(132deg,var(--c1) 0%,var(--c2) 58%,color-mix(in srgb,var(--c3) 28%,var(--c2)) 100%)!important;
}
.shop-pack-shot{
  inset:12px 18px 58px!important;
  border-radius:20px!important;
  overflow:visible!important;
}
.shop-pack-shot:before{display:none!important}
.shop-pack-shot img{
  width:100%!important;
  height:100%!important;
  object-fit:contain!important;
  object-position:56% 44%!important;
  transform:scale(.94)!important;
  filter:saturate(1.02) contrast(1.06) brightness(1.04) drop-shadow(0 30px 28px rgba(48,31,20,.26))!important;
}
.shop-pack-cinema .shop-feature-copy{
  right:24px!important;
  left:auto!important;
  bottom:18px!important;
  width:min(47%,430px)!important;
  max-width:430px!important;
  margin:0!important;
  padding:13px 15px 12px!important;
  border-radius:12px!important;
  background:rgba(255,249,241,.76)!important;
  backdrop-filter:blur(10px)!important;
  -webkit-backdrop-filter:blur(10px)!important;
  box-shadow:0 12px 32px rgba(61,39,24,.10)!important;
  border:1px solid rgba(255,255,255,.34)!important;
}
.shop-pack-cinema .shop-feature-copy h3{font-size:22px!important;margin:5px 0 5px!important}
.shop-pack-cinema .shop-feature-copy p{font-size:9px!important;line-height:1.8!important;margin:0 0 7px!important}
.shop-pack-cinema .shop-feature-copy b{font-size:8px!important}
.shop-pack-cinema .shop-feature-copy>span{font-size:6px!important}
.shop-pack-index{top:18px!important;left:20px!important;z-index:8!important}
.shop-pack-light{
  background:linear-gradient(112deg,transparent 36%,rgba(255,245,224,.10) 45%,rgba(255,255,255,.32) 50%,rgba(255,245,224,.08) 55%,transparent 64%)!important;
}
.shop-pack-cinema:after{
  background:
    linear-gradient(90deg,rgba(255,255,255,.06),transparent 35%),
    linear-gradient(180deg,transparent 58%,rgba(34,21,13,.16) 100%)!important;
}
.shop-pack-checker{
  inset:12px 18px 58px!important;
  border-radius:20px!important;
}
@media (max-width:620px){
 .shop-pack-cinema{min-height:390px!important}
 .shop-pack-shot{inset:10px 10px 82px!important}
 .shop-pack-shot img{
   transform:scale(.90)!important;
   object-position:center 39%!important;
 }
 .shop-pack-cinema .shop-feature-copy{
   right:14px!important;left:14px!important;bottom:13px!important;
   width:auto!important;max-width:none!important;
   padding:11px 12px!important;
   background:rgba(255,249,241,.82)!important;
 }
 .shop-pack-cinema .shop-feature-copy h3{font-size:19px!important}
 .shop-pack-checker{inset:10px 10px 82px!important}
}

/* Phase 34 — Split composition: product right / copy left */
@media (min-width:901px){
 .shop-pack-cinema{min-height:470px!important}
 .shop-pack-stage{inset:0!important}

 /* product visual occupies the right half, almost edge-to-edge */
 .shop-pack-shot{
   top:12px!important;
   right:12px!important;
   bottom:12px!important;
   left:50%!important;
   border-radius:18px!important;
   overflow:hidden!important;
 }
 .shop-pack-shot img{
   width:100%!important;height:100%!important;
   object-fit:contain!important;
   object-position:center!important;
   transform:scale(1.08)!important;
   filter:saturate(1.03) contrast(1.07) brightness(1.04) drop-shadow(0 28px 26px rgba(48,31,20,.24))!important;
 }

 /* checker effect follows only the product half */
 .shop-pack-checker{
   top:12px!important;
   right:12px!important;
   bottom:12px!important;
   left:50%!important;
   border-radius:18px!important;
 }

 /* text becomes the left half instead of a floating small card */
 .shop-pack-cinema .shop-feature-copy{
   top:12px!important;
   right:auto!important;
   bottom:12px!important;
   left:12px!important;
   width:calc(50% - 24px)!important;
   max-width:none!important;
   margin:0!important;
   padding:34px 34px 30px!important;
   border-radius:18px!important;
   display:flex!important;
   flex-direction:column!important;
   justify-content:center!important;
   align-items:flex-start!important;
   text-align:right!important;
   background:linear-gradient(145deg,rgba(255,249,241,.91),rgba(255,244,231,.76))!important;
   backdrop-filter:blur(12px)!important;
   -webkit-backdrop-filter:blur(12px)!important;
   border:1px solid rgba(255,255,255,.38)!important;
   box-shadow:0 18px 42px rgba(67,42,26,.09)!important;
 }
 .shop-pack-cinema .shop-feature-copy>span{
   font-size:7px!important;letter-spacing:.13em!important;margin-bottom:12px!important
 }
 .shop-pack-cinema .shop-feature-copy h3{
   font-size:34px!important;line-height:1.25!important;margin:0 0 12px!important
 }
 .shop-pack-cinema .shop-feature-copy p{
   font-size:11px!important;line-height:2!important;max-width:330px!important;margin:0 0 20px!important
 }
 .shop-pack-cinema .shop-feature-copy b{
   font-size:9px!important;margin-top:4px!important
 }
 .shop-pack-index{
   top:26px!important;left:30px!important;z-index:8!important
 }
}
@media (max-width:620px){
 .shop-pack-cinema{min-height:400px!important}
 .shop-pack-shot{
   top:10px!important;right:10px!important;bottom:150px!important;left:10px!important;
   border-radius:16px!important
 }
 .shop-pack-shot img{transform:scale(.93)!important}
 .shop-pack-checker{
   top:10px!important;right:10px!important;bottom:150px!important;left:10px!important
 }
 .shop-pack-cinema .shop-feature-copy{
   top:auto!important;right:10px!important;bottom:10px!important;left:10px!important;
   width:auto!important;max-width:none!important;height:132px!important;
   padding:16px 18px!important;border-radius:16px!important;
   display:flex!important;flex-direction:column!important;justify-content:center!important
 }
 .shop-pack-cinema .shop-feature-copy h3{font-size:22px!important;margin:3px 0 5px!important}
 .shop-pack-cinema .shop-feature-copy p{font-size:8px!important;line-height:1.7!important;margin-bottom:7px!important}
}

/* Phase 35 — Swap split sides: package left / copy right */
@media (min-width:901px){
 .shop-pack-shot{
   left:12px!important;
   right:50%!important;
 }
 .shop-pack-checker{
   left:12px!important;
   right:50%!important;
 }
 .shop-pack-cinema .shop-feature-copy{
   left:auto!important;
   right:12px!important;
   width:calc(50% - 24px)!important;
 }
 .shop-pack-index{
   left:auto!important;
   right:30px!important;
 }
}

/* Phase 36 — Powder Lab / Ingredient Motion */
.shop-feature-side.powder{
 position:relative!important;overflow:hidden!important;
 min-height:470px!important;padding:0!important;
 background:#c88745!important;color:#fff!important;
 isolation:isolate;
}
.powder-lab{position:absolute;inset:0;overflow:hidden;z-index:1;transition:background 900ms ease}
.powder-lab[data-current="karak"]{background:radial-gradient(circle at 70% 28%,#f1c97f 0,transparent 30%),linear-gradient(145deg,#d5944c,#a95f2d)}
.powder-lab[data-current="masala"]{background:radial-gradient(circle at 72% 30%,#d6a06e 0,transparent 30%),linear-gradient(145deg,#a95f38,#6f3528)}
.powder-lab[data-current="chocolate"]{background:radial-gradient(circle at 70% 28%,#9c6848 0,transparent 30%),linear-gradient(145deg,#70422e,#301d19)}
.powder-atmosphere{position:absolute;inset:-25%;background:radial-gradient(circle,rgba(255,245,218,.22),transparent 45%);animation:powderGlow 7s ease-in-out infinite alternate}
@keyframes powderGlow{to{transform:translate3d(-7%,5%,0) scale(1.12)}}
.powder-scene{position:absolute;inset:0;opacity:0;transform:scale(1.025);transition:opacity .75s ease,transform 1.2s ease;pointer-events:none}
.powder-scene.is-active{opacity:1;transform:scale(1)}
.powder-ghost{position:absolute;left:-7px;top:52px;font:900 62px/.8 Georgia,serif;letter-spacing:-.06em;color:rgba(255,244,220,.16);transform:rotate(-5deg)}
.powder-scene-label{position:absolute;right:20px;top:24px;display:flex;flex-direction:column;align-items:flex-end;gap:4px;direction:ltr;color:#fff}
.powder-scene-label small{font:700 5px/1 Arial,sans-serif;letter-spacing:.15em;opacity:.72}
.powder-scene-label b{font:900 13px/1 Arial,sans-serif;letter-spacing:.04em}
.powder-orbit{position:absolute;inset:0}
.ingredient{position:absolute;display:block;filter:drop-shadow(0 12px 10px rgba(55,27,14,.22));animation:ingredientFloat 4.8s ease-in-out infinite alternate}
@keyframes ingredientFloat{to{transform:translateY(-13px) rotate(10deg)}}
/* abstract ingredient forms — CSS only, no stock imagery */
.cardamom{width:18px;height:28px;border-radius:60% 45% 60% 45%;background:linear-gradient(90deg,#657244,#9ca264 50%,#59613c)}
.cardamom:after{content:"";position:absolute;left:8px;top:3px;width:1px;height:21px;background:rgba(245,232,176,.48)}
.saffron{width:2px;height:38px;border-radius:99px;background:#9d2630;box-shadow:4px 5px #b53232,8px -2px #7d2028;transform:rotate(28deg)}
.cinnamon{width:13px;height:72px;border-radius:9px;background:linear-gradient(90deg,#6d321f,#b15f37 45%,#743722);transform:rotate(38deg)}
.cinnamon:after{content:"";position:absolute;inset:3px;border:1px solid rgba(244,186,120,.35);border-radius:8px}
.spice{width:11px;height:11px;border-radius:50%;background:#4b2a1f;box-shadow:inset 2px 2px rgba(255,255,255,.08)}
.cocoa{width:25px;height:18px;border-radius:55% 45% 50% 45%;background:linear-gradient(145deg,#321b16,#6c3c28);box-shadow:inset -3px -3px 5px rgba(0,0,0,.25)}
.cocoa:after{content:"";position:absolute;left:11px;top:2px;width:2px;height:14px;background:#b07850;border-radius:3px}
.c1{left:20%;top:34%;animation-delay:-.7s}.c2{left:67%;top:51%;animation-delay:-2.1s}
.s1{left:40%;top:28%}.s2{left:54%;top:50%;animation-delay:-1.4s}.s3{left:78%;top:33%;animation-delay:-2.6s}
.ci1{left:24%;top:30%}.ci2{left:66%;top:42%;animation-delay:-1.8s}
.sp1{left:49%;top:27%}.sp2{left:40%;top:60%;animation-delay:-1.2s}.sp3{left:79%;top:66%;animation-delay:-2.5s}
.co1{left:22%;top:32%}.co2{left:53%;top:26%;animation-delay:-1.1s}.co3{left:71%;top:52%;animation-delay:-2.2s}.co4{left:39%;top:62%;animation-delay:-3.1s}
.powder-dust{position:absolute;width:210px;height:210px;border-radius:50%;opacity:.17;filter:blur(1px);background-image:radial-gradient(circle,rgba(255,242,214,.9) 0 1px,transparent 1.4px);background-size:10px 10px;animation:dustDrift 9s linear infinite}
.powder-dust-a{right:-50px;top:70px}.powder-dust-b{left:-80px;bottom:-60px;animation-direction:reverse}
@keyframes dustDrift{to{transform:rotate(22deg) translateY(-24px)}}
.powder-progress{position:absolute;left:20px;bottom:20px;display:flex;gap:5px;z-index:4}
.powder-progress i{width:16px;height:2px;background:rgba(255,255,255,.28);transition:width .35s ease,background .35s ease}
.powder-progress i.is-active{width:34px;background:#fff}
.powder-card-copy{position:absolute;z-index:5;right:18px;left:18px;bottom:18px;padding:16px 16px 14px;border-top:1px solid rgba(255,255,255,.34);color:#fff;text-align:right;background:linear-gradient(180deg,transparent,rgba(55,25,13,.24))}
.powder-card-copy span{font:700 6px/1 Arial,sans-serif;letter-spacing:.15em;opacity:.72}
.powder-card-copy h3{font-size:20px!important;margin:7px 0 5px!important;color:#fff!important}
.powder-card-copy p{font-size:8px!important;line-height:1.8!important;margin:0 0 8px!important;color:rgba(255,255,255,.78)!important}
.powder-card-copy b{font-size:8px!important;color:#fff!important}
@media (max-width:620px){
 .shop-feature-side.powder{min-height:340px!important}
 .powder-ghost{font-size:54px;top:44px}
 .powder-scene-label{right:16px;top:18px}
 .powder-card-copy{right:14px;left:14px;bottom:14px}
}

/* Phase 37 — Premium powder product cinema */
.shop-feature-side.powder{
  position:relative!important;
  overflow:hidden!important;
  min-height:470px!important;
  background:#ece3d7!important;
  color:#241b16!important;
  border:1px solid rgba(89,61,43,.13)!important;
}
.powder-cinema{
  position:absolute;inset:0;
  background:
    radial-gradient(circle at 50% 32%,rgba(255,255,255,.88),transparent 34%),
    linear-gradient(155deg,#f0e5d5,#cfa978);
  transition:background .9s ease;
  overflow:hidden;
}
.powder-cinema[data-theme="karak"]{
  background:radial-gradient(circle at 52% 30%,rgba(255,250,225,.95),transparent 31%),linear-gradient(155deg,#f2dfad,#c99449 68%,#9c612c)
}
.powder-cinema[data-theme="masala"]{
  background:radial-gradient(circle at 52% 30%,rgba(255,240,220,.90),transparent 32%),linear-gradient(155deg,#e6c0a0,#a56545 66%,#70402f)
}
.powder-cinema[data-theme="chocolate"]{
  background:radial-gradient(circle at 52% 30%,rgba(235,213,198,.72),transparent 30%),linear-gradient(155deg,#b78669,#6f4433 63%,#38231d)
}
.powder-product{
  position:absolute;inset:22px 20px 118px;
  margin:0;opacity:0;
  display:flex;align-items:center;justify-content:center;
  transform:translateY(12px) scale(.96);
  transition:opacity .72s ease,transform 1.15s cubic-bezier(.2,.75,.25,1);
}
.powder-product.is-active{opacity:1;transform:translateY(0) scale(1)}
.powder-product img{
  width:86%;height:86%;
  object-fit:contain;
  object-position:center;
  border-radius:14px;
  filter:drop-shadow(0 26px 24px rgba(60,35,20,.22));
}
.powder-cinema-light{
  position:absolute;inset:-25%;
  background:linear-gradient(116deg,transparent 40%,rgba(255,255,255,.28) 49%,transparent 58%);
  transform:translateX(-48%);
  animation:powderLightSweep 7s ease-in-out infinite;
  pointer-events:none;
}
@keyframes powderLightSweep{0%,22%{transform:translateX(-48%)}55%,100%{transform:translateX(48%)}}
.powder-cinema-vignette{position:absolute;inset:0;background:linear-gradient(180deg,transparent 48%,rgba(44,25,15,.14) 76%,rgba(44,25,15,.30) 100%);pointer-events:none}
.powder-cinema-index{
  position:absolute;top:20px;left:20px;z-index:4;
  display:flex;align-items:center;gap:7px;direction:ltr;
  font:700 6px/1 Arial,sans-serif;letter-spacing:.14em;color:rgba(54,38,29,.72)
}
.powder-cinema[data-theme="chocolate"] .powder-cinema-index{color:rgba(255,244,232,.72)}
.powder-cinema-index i{width:30px;height:1px;background:currentColor;opacity:.45}
.powder-editorial-copy{
  position:absolute;z-index:5;right:15px;left:15px;bottom:14px;
  padding:14px 14px 12px;
  border-radius:14px;
  background:rgba(255,249,241,.84);
  backdrop-filter:blur(10px);
  -webkit-backdrop-filter:blur(10px);
  border:1px solid rgba(255,255,255,.42);
  box-shadow:0 12px 30px rgba(63,39,22,.09);
  color:#241b16;
}
.powder-editorial-copy span{font:700 5.5px/1 Arial,sans-serif;letter-spacing:.13em;color:#80624d}
.powder-editorial-copy h3{font-size:20px!important;margin:6px 0 5px!important;color:#241b16!important}
.powder-editorial-copy p{font-size:8px!important;line-height:1.8!important;margin:0 0 7px!important;color:#655246!important}
.powder-editorial-copy b{font-size:8px!important;color:#2d211a!important}
@media (max-width:620px){
 .shop-feature-side.powder{min-height:340px!important}
 .powder-product{inset:14px 12px 112px}
 .powder-product img{width:90%;height:90%}
 .powder-editorial-copy{right:12px;left:12px;bottom:12px}
 .powder-cinema-index{top:15px;left:15px}
}

/* Phase 38 — Powder card as a full-bleed café editorial visual */
.shop-feature-side.powder{
  position:relative!important;
  overflow:hidden!important;
  min-height:470px!important;
  padding:0!important;
  background:#21150f!important;
  color:#fff!important;
  border:1px solid rgba(83,53,35,.16)!important;
}
.powder-cafe-visual{position:absolute;inset:0;overflow:hidden}
.powder-cafe-visual>img{
  position:absolute;inset:0;
  width:100%;height:100%;
  object-fit:cover;
  object-position:58% center;
  transform:scale(1.02);
  filter:saturate(.92) contrast(1.04) brightness(.86);
}
.powder-cafe-shade{
  position:absolute;inset:0;
  background:
    linear-gradient(180deg,rgba(18,11,8,.04) 0%,rgba(18,11,8,.12) 42%,rgba(18,11,8,.78) 100%),
    linear-gradient(90deg,rgba(18,11,8,.18),transparent 58%);
}
.powder-cafe-word{
  position:absolute;left:18px;top:22px;
  font:900 27px/1 Arial,sans-serif;
  letter-spacing:.06em;
  color:rgba(255,241,216,.78);
  text-shadow:0 3px 16px rgba(0,0,0,.28);
}
.powder-cafe-copy{
  position:absolute;z-index:3;
  right:18px;left:18px;bottom:18px;
  color:#fff;text-align:right;
}
.powder-cafe-copy span{
  display:block;
  font:700 6px/1 Arial,sans-serif;
  letter-spacing:.16em;
  color:#dcb98e;
  margin-bottom:7px;
}
.powder-cafe-copy h3{
  font-size:23px!important;
  line-height:1.35!important;
  margin:0 0 6px!important;
  color:#fff!important;
}
.powder-cafe-copy p{
  font-size:8.5px!important;
  line-height:1.9!important;
  margin:0 0 10px!important;
  color:rgba(255,255,255,.82)!important;
}
.powder-cafe-copy b{
  font-size:8px!important;
  color:#fff!important;
}
@media (max-width:620px){
  .shop-feature-side.powder{min-height:330px!important}
  .powder-cafe-visual>img{object-position:60% center}
  .powder-cafe-word{left:14px;top:16px;font-size:23px}
  .powder-cafe-copy{right:14px;left:14px;bottom:14px}
  .powder-cafe-copy h3{font-size:20px!important}
}

/* Phase 39 — Served drinks slider; fixed Persian copy */
.shop-feature-side.powder{position:relative!important;overflow:hidden!important;padding:0!important;min-height:470px!important;background:#241711!important}
.powder-served-slider{position:absolute;inset:0;overflow:hidden}
.powder-served-slide{position:absolute;inset:0;margin:0;opacity:0;transform:scale(1.035);transition:opacity .9s ease,transform 3.6s ease}
.powder-served-slide.is-active{opacity:1;transform:scale(1)}
.powder-served-slide img{width:100%;height:100%;object-fit:cover;object-position:center}
.powder-served-shade{position:absolute;inset:0;background:linear-gradient(180deg,rgba(18,10,6,.04) 25%,rgba(18,10,6,.18) 55%,rgba(18,10,6,.78) 100%);z-index:2;pointer-events:none}
.powder-served-copy{position:absolute;z-index:4;right:18px;left:18px;bottom:20px;text-align:right;color:#fff}
.powder-served-copy span{display:block;font:700 6px/1 Arial,sans-serif;letter-spacing:.15em;color:#dcb98e;margin-bottom:7px}
.powder-served-copy h3{font-size:22px!important;margin:0 0 5px!important;color:#fff!important}
.powder-served-copy p{font-size:8px!important;line-height:1.8!important;margin:0 0 8px!important;color:rgba(255,255,255,.82)!important}
.powder-served-copy b{font-size:8px!important;color:#fff!important}
.powder-served-dots{position:absolute;z-index:5;left:18px;bottom:20px;display:flex;gap:5px}
.powder-served-dots i{width:14px;height:2px;background:rgba(255,255,255,.35);transition:.35s ease}
.powder-served-dots i.is-active{width:30px;background:#fff}
@media (max-width:620px){
 .shop-feature-side.powder{min-height:330px!important}
 .powder-served-copy{right:14px;left:14px;bottom:15px}
 .powder-served-dots{left:14px;bottom:15px}
}

/* Phase 40 — Takta College editorial */
.academy-editorial{padding:68px max(5vw,48px) 50px;background:#f2eee7;color:#1d1a17;border-top:1px solid rgba(35,28,22,.08)}
.academy-editorial-head{display:grid;grid-template-columns:1.05fr .95fr;gap:68px;align-items:end;max-width:1380px;margin:0 auto 32px}
.academy-editorial-head .ey{display:block;font:700 8px/1 Arial,sans-serif;letter-spacing:.16em;color:#7b674f;margin-bottom:14px}
.academy-editorial-head h2{margin:0;font-size:clamp(34px,4vw,56px);line-height:1.25;letter-spacing:-.035em}
.academy-editorial-intro{max-width:500px;justify-self:end}.academy-editorial-intro p{margin:0 0 16px;font-size:12px;line-height:2;color:#625b53}.academy-editorial-intro a{color:#1d1a17;font-size:10px;font-weight:800;text-decoration:none}
.academy-paths{max-width:1380px;margin:auto;display:grid;grid-template-columns:repeat(3,1fr);border:1px solid rgba(40,31,24,.12);border-radius:20px;overflow:hidden}
.academy-path{position:relative;overflow:hidden;min-height:350px;padding:26px;color:#fff;text-decoration:none;isolation:isolate;display:flex;align-items:flex-end}.academy-path+.academy-path{border-right:1px solid rgba(255,255,255,.14)}
.academy-path:before{content:"";position:absolute;inset:0;z-index:-3;transition:transform .7s ease}.academy-path.barista:before{background:radial-gradient(circle at 68% 24%,rgba(221,176,113,.34),transparent 25%),linear-gradient(150deg,#6f4c32,#2c2019 72%)}.academy-path.roastery:before{background:radial-gradient(circle at 72% 22%,rgba(196,126,77,.30),transparent 27%),linear-gradient(150deg,#764334,#34201b 72%)}.academy-path.bakery:before{background:radial-gradient(circle at 70% 24%,rgba(245,207,148,.38),transparent 27%),linear-gradient(150deg,#b7834f,#664329 74%)}
.academy-path:after{content:"";position:absolute;inset:0;z-index:-2;background:linear-gradient(180deg,transparent 34%,rgba(15,10,7,.16) 62%,rgba(15,10,7,.76) 100%),repeating-linear-gradient(90deg,rgba(255,255,255,.018) 0 1px,transparent 1px 42px)}.academy-path:hover:before{transform:scale(1.045)}
.academy-path-no{position:absolute;top:22px;right:24px;font:700 8px/1 Arial,sans-serif;letter-spacing:.12em;opacity:.7}.academy-path-word{position:absolute;top:58px;left:-8px;font:900 clamp(44px,5vw,76px)/.8 Georgia,serif;letter-spacing:-.065em;color:rgba(255,246,231,.10);transform:rotate(-5deg);white-space:nowrap}
.academy-path-copy{position:relative;z-index:2;max-width:310px}.academy-path-copy small{display:block;font:700 6px/1 Arial,sans-serif;letter-spacing:.16em;color:#d9b98f;margin-bottom:8px}.academy-path-copy h3{margin:0 0 8px;font-size:25px;color:#fff}.academy-path-copy p{margin:0 0 15px;font-size:9px;line-height:1.95;color:rgba(255,255,255,.74)}.academy-path-copy b{font-size:8px;color:#fff}
.academy-signature{max-width:1380px;margin:18px auto 0;display:flex;align-items:center;gap:12px;direction:ltr;color:#8b7a67;font:700 6px/1 Arial,sans-serif;letter-spacing:.15em}.academy-signature i{height:1px;flex:1;background:rgba(69,54,42,.13)}
@media (max-width:900px){.academy-editorial{padding:48px 20px 36px}.academy-editorial-head{grid-template-columns:1fr;gap:20px;margin-bottom:24px}.academy-editorial-intro{justify-self:start}.academy-paths{grid-template-columns:1fr}.academy-path{min-height:235px}.academy-path+.academy-path{border-right:0;border-top:1px solid rgba(255,255,255,.14)}.academy-path-word{font-size:58px;top:48px}}
@media (max-width:620px){.academy-editorial{padding:38px 14px 28px}.academy-editorial-head h2{font-size:31px}.academy-editorial-intro p{font-size:10px}.academy-path{min-height:215px;padding:21px}.academy-path-copy h3{font-size:22px}.academy-path-word{font-size:49px}}

/* Phase 41 — Approved Takta College photography */
.academy-path:before{
  background-position:center!important;
  background-repeat:no-repeat!important;
  background-size:cover!important;
  filter:saturate(.92) contrast(1.02) brightness(.88);
}
.academy-path.barista:before{
  background-image:url("../assets/images/academy-barista-approved.webp")!important;
  background-position:52% center!important;
}
.academy-path.roastery:before{
  background-image:url("../assets/images/academy-roastery-approved.jpeg")!important;
  background-position:57% center!important;
}
.academy-path.bakery:before{
  background-image:url("../assets/images/academy-bakery-approved.webp")!important;
  background-position:52% center!important;
}
.academy-path:after{
  background:
    linear-gradient(180deg,rgba(14,9,6,.05) 0%,rgba(14,9,6,.10) 38%,rgba(14,9,6,.72) 100%),
    linear-gradient(90deg,rgba(12,8,5,.12),transparent 58%)!important;
}
.academy-path-word{color:rgba(255,248,237,.12)!important;text-shadow:0 2px 18px rgba(0,0,0,.10)}
.academy-path-copy{text-shadow:0 2px 12px rgba(0,0,0,.32)}
@media (max-width:900px){
  .academy-path.barista:before{background-position:50% 42%!important}
  .academy-path.roastery:before{background-position:55% 48%!important}
  .academy-path.bakery:before{background-position:52% 48%!important}
}


/* Phase 42 — Takta College cleanup (approved photos preserved) */
.academy-path-word{
  display:none!important;
}

.academy-path:before{
  filter:saturate(.98) contrast(1.01) brightness(.98)!important;
}

.academy-path:after{
  background:
    linear-gradient(
      180deg,
      rgba(14,9,6,0) 0%,
      rgba(14,9,6,.02) 46%,
      rgba(14,9,6,.18) 68%,
      rgba(14,9,6,.62) 100%
    )!important;
}

.academy-path-copy{
  text-shadow:0 2px 10px rgba(0,0,0,.40)!important;
}

.academy-path-copy small{
  color:rgba(255,236,207,.94)!important;
}

.academy-path-copy p{
  color:rgba(255,255,255,.88)!important;
}

.academy-path-no{
  text-shadow:0 2px 8px rgba(0,0,0,.38);
}


/* Phase 43 — Takta College typography readability */
.academy-path-copy{
  max-width:92%!important;
}
.academy-path-copy small{
  font-size:9px!important;
  line-height:1.25!important;
  letter-spacing:.11em!important;
  margin-bottom:9px!important;
}
.academy-path-copy h3{
  font-size:30px!important;
  line-height:1.3!important;
  margin:0 0 8px!important;
  font-weight:800!important;
}
.academy-path-copy p{
  font-size:12px!important;
  line-height:1.85!important;
  margin:0 0 14px!important;
  font-weight:500!important;
}
.academy-path-copy b{
  font-size:11px!important;
  line-height:1.4!important;
  font-weight:800!important;
}
.academy-path-no{
  font-size:9px!important;
}
.academy-editorial-intro p{
  font-size:14px!important;
  line-height:2!important;
}
.academy-editorial-intro a{
  font-size:12px!important;
}
.academy-signature{
  font-size:8px!important;
}
@media (max-width:900px){
  .academy-path-copy{max-width:88%!important}
  .academy-path-copy small{font-size:8px!important}
  .academy-path-copy h3{font-size:25px!important}
  .academy-path-copy p{font-size:11.5px!important;line-height:1.75!important}
  .academy-path-copy b{font-size:10.5px!important}
}
@media (max-width:620px){
  .academy-path{min-height:250px!important}
  .academy-path-copy{
    max-width:94%!important;
    padding:0 2px 2px!important;
  }
  .academy-path-copy small{font-size:8px!important;margin-bottom:6px!important}
  .academy-path-copy h3{font-size:24px!important;margin-bottom:6px!important}
  .academy-path-copy p{font-size:12px!important;line-height:1.7!important;margin-bottom:10px!important}
  .academy-path-copy b{font-size:11px!important}
  .academy-path-no{font-size:9px!important}
}

/* Phase 44 — Modern Contact + Footer */
.contact-modern{position:relative;overflow:hidden;padding:86px max(5vw,48px) 0;background:#f6f3ed;color:#1d1916;border-top:1px solid rgba(39,29,21,.08)}
.contact-modern:before{content:"";position:absolute;width:520px;height:520px;border-radius:50%;right:-180px;top:-230px;background:radial-gradient(circle,rgba(156,111,69,.15),rgba(156,111,69,0) 67%);pointer-events:none}
.contact-modern-orbit{position:absolute;left:-115px;top:18px;width:330px;height:330px;border:1px solid rgba(90,63,43,.08);border-radius:50%;pointer-events:none}
.contact-modern-orbit i{position:absolute;inset:42px;border:1px solid rgba(90,63,43,.07);border-radius:50%}.contact-modern-orbit i:nth-child(2){inset:84px}.contact-modern-orbit i:nth-child(3){inset:126px}
.contact-modern-head{position:relative;z-index:2;max-width:1380px;margin:0 auto 38px;display:grid;grid-template-columns:1.2fr .8fr;grid-template-areas:"title copy";align-items:end;gap:70px}
.contact-modern-head .contact-kicker{grid-column:1/-1;font:700 8px/1 Arial,sans-serif;letter-spacing:.17em;color:#77634f}
.contact-modern-head h2{grid-area:title;margin:0;font-size:clamp(42px,5.3vw,76px);line-height:1.16;letter-spacing:-.055em}.contact-modern-head h2 em{font-style:normal;color:#8b6544}
.contact-modern-head p{grid-area:copy;margin:0 0 8px;max-width:440px;justify-self:end;font-size:13px;line-height:2;color:#686059}
.contact-modern-grid{position:relative;z-index:2;max-width:1380px;margin:auto;display:grid;grid-template-columns:1.25fr 1fr 1fr;border:1px solid rgba(48,35,25,.13);border-radius:20px 20px 0 0;overflow:hidden;background:rgba(255,255,255,.42)}
.contact-route{position:relative;min-height:220px;padding:28px;display:flex;flex-direction:column;justify-content:flex-end;text-decoration:none;color:#211b17;border-right:1px solid rgba(48,35,25,.10);transition:background .35s ease,transform .35s ease}
.contact-route:last-child{border-right:0}.contact-route:hover{background:#fff}.contact-route.primary{background:#201712;color:#fff}.contact-route.primary:hover{background:#2a1e17}
.route-no{position:absolute;top:25px;right:27px;font:700 9px/1 Arial,sans-serif;opacity:.48}.contact-route small{font:700 8px/1 Arial,sans-serif;letter-spacing:.15em;color:#9a7351;margin-bottom:9px}.contact-route h3{font-size:27px;margin:0 0 7px}.contact-route p{font-size:11px;line-height:1.9;margin:0 0 17px;opacity:.7}.contact-route b{font-size:11px}
.contact-modern-marquee{max-width:1380px;margin:auto;height:52px;overflow:hidden;border-left:1px solid rgba(48,35,25,.13);border-right:1px solid rgba(48,35,25,.13);display:flex;align-items:center;white-space:nowrap;color:rgba(58,43,32,.23);font:900 15px/1 Arial,sans-serif;letter-spacing:.13em}.contact-modern-marquee div{animation:clMarquee 24s linear infinite}
@keyframes clMarquee{from{transform:translateX(0)}to{transform:translateX(-35%)}}






@media (max-width:900px){.contact-modern{padding:58px 20px 0}.contact-modern-head{grid-template-columns:1fr;grid-template-areas:"title" "copy";gap:18px}.contact-modern-head .contact-kicker{grid-column:auto}.contact-modern-head p{justify-self:start}.contact-modern-grid{grid-template-columns:1fr}.contact-route{min-height:175px;border-right:0;border-top:1px solid rgba(48,35,25,.10)}.contact-route:first-child{border-top:0}}
@media (max-width:620px){.contact-modern{padding:44px 14px 0}.contact-modern-head{margin-bottom:25px}.contact-modern-head h2{font-size:39px}.contact-modern-head p{font-size:12px}.contact-route{min-height:165px;padding:22px}.contact-route h3{font-size:24px}.contact-route p{font-size:11.5px}.contact-route b{font-size:11px}.contact-modern-marquee{height:44px;font-size:12px}}
@media (prefers-reduced-motion:reduce){.contact-modern-marquee div{animation:none}}

/* Phase 45 — Integrated Contact + Footer, single dark closing block */
.contact-modern{display:none!important}































/* Phase 46 — Simplified, larger and more readable footer */
















/* Phase 47 — Original footer logos, placed without altering source artwork */














/* Phase 48 — Footer logo corrections */






/* Takta company identity: original logo + Persian company name */




/* Remove old repeated English company label if any legacy copy remains */





/* Phase 49 — Pure black footer + minimalist Persian identity labels */













/* Phase 50 — Footer audit & cleanup */


/* One footer only */









/* Coffee Lovers logos: same visual size, no surrounding text */




/* Company / academy identities grouped together */













/* Phase 51 — Preserve approved footer; shift composition right + restore backend-ready trust slots */



.trust-mark{
  width:58px;
  height:58px;
  border:1px solid rgba(255,255,255,.16);
  border-radius:10px;
  display:flex;
  align-items:center;
  justify-content:center;
  text-align:center;
  background:rgba(255,255,255,.035);
  color:rgba(255,255,255,.86);
}
.trust-mark-coffee{
  font:800 8px/1.25 Arial,sans-serif;
  letter-spacing:.08em;
}
.trust-mark-enamad{
  font:700 34px/1 Georgia,serif;
}




/* Phase 52 — Equal visual scale for the two Coffee Lovers footer logos */


/* The Persian artwork has substantially more empty canvas around its mark.
   Increase its rendered box so the visible mark matches the English badge. */




/* Phase 53 — Approved white Coffee Lovers footer logo */




/* Phase 54 — Double the approved right-side Coffee Lovers logo */




/* Phase 55 — Footer visual balance & alignment cleanup */

/* Reset the over-enlarged white logo from Phase 54 */


/* Keep the footer centered; previous right shift made spacing uneven */


/* Coffee Lovers pair: same visual hierarchy, no clipping */





/* Navigation / office vertical rhythm */





/* Company + academy identities: same size and baseline */





/* Trust badges: compact, aligned and visually subordinate */


.trust-mark{
  width:52px!important;
  height:52px!important;
  border-radius:9px!important;
}


/* Keep bottom row quiet */


/* Ensure no content gets clipped at common laptop widths */






/* Phase 56 — Dedicated mobile footer composition */
@media (max-width:620px){

  /* Footer should feel like one designed mobile block, not stacked desktop columns */
  

  

  /* 1 — Brand pair becomes the visual header */
  
  
  

  /* 2 — Navigation and office information share one compact row */
  
  
  
  
  
  

  /* 3 — Company identities in one balanced row */
  
  
  
  

  /* 4 — Trust / future backend badges finish the footer */
  
  
  .trust-mark{
    width:54px!important;
    height:54px!important;
    margin:0 auto!important;
  }
  

  /* Quiet legal/social row */
  
  
}

/* Narrow phones */


/* Phase 57 — Footer social/contact cleanup */









/* Phase 58 — Make mobile social/contact area readable and prominent */



/* Phase 59 — Final footer hierarchy & contact readability audit */

/* Desktop: distribute the footer more deliberately across the available width */


/* Mobile: strong contact hierarchy, larger touch targets, less dead space */


/* Phase 60 — Social icons + mobile footer refinement */






/* Mobile visual audit */
@media (max-width:620px){
  

  /* tighter rhythm between major groups */
  
  
  
  

  /* better alignment and calmer typography */
  
  
  

  /* social row as compact icons */
  
  
  
  
  

  /* contact becomes the strongest text block */
  
  
  

  /* company / academy logos sit on equal visual baseline */
  
  

  /* trust badges less dominant than company identities */
  .trust-mark{
    width:50px!important;
    height:50px!important;
  }
  
}



/* Phase 61 — Office details + centered brand-color social icons */



/* Social marks centered on their own row */







/* Phase 62 — Landline icon + Latin number */




/* Phase 63D — Approved purpose-built wide hero artwork */
.hero.hero-approved-wide{
  display:block!important;
  width:100%!important;
  max-width:none!important;
  margin:0!important;
  padding:0!important;
  background:#0d0805!important;
  border-radius:0!important;
  overflow:hidden!important;
}
.hero-approved-wide-link{
  display:block!important;
  width:100%!important;
  text-decoration:none!important;
  line-height:0!important;
}
.hero-approved-wide img{
  display:block!important;
  width:100%!important;
  height:auto!important;
  object-fit:contain!important;
  object-position:center!important;
  border-radius:0!important;
}

/* Tablet / mobile: preserve the entire approved artwork instead of cropping it. */
@media (max-width:900px){
  .hero-approved-wide{
    overflow-x:hidden!important;
  }
  .hero-approved-wide img{
    width:100%!important;
    height:auto!important;
    object-fit:contain!important;
  }
}

/* Phase 63I — Desktop locked to Phase 63F; mobile-only hero adjustments */
.hero-mobile-products-btn{display:none!important}
.hero-mobile-signature-btn{display:none!important}

@media (max-width:620px){
  .hero.hero-approved-wide{
    position:relative!important;
    width:100%!important;
    max-width:none!important;
    margin:0!important;
    padding:0!important;
    background:#0d0805!important;
    overflow:hidden!important;
  }

  .hero-approved-wide-link{
    position:relative!important;
    display:block!important;
    width:100%!important;
    height:230px!important;
    overflow:hidden!important;
    background:#0d0805!important;
    line-height:0!important;
  }

  .hero-approved-wide-link img{
    position:absolute!important;
    top:50%!important;
    left:0!important;
    width:auto!important;
    height:100%!important;
    max-width:none!important;
    object-fit:contain!important;
    object-position:left center!important;
    transform:translateY(-50%) scale(1.14)!important;
    transform-origin:left center!important;
  }

  .hero-mobile-products-btn{
    display:inline-flex!important;
    position:absolute!important;
    z-index:5!important;
    left:13%!important;
    bottom:12px!important;
    align-items:center!important;
    justify-content:center!important;
    min-height:34px!important;
    padding:0 15px!important;
    border:1px solid rgba(255,255,255,.5)!important;
    border-radius:999px!important;
    background:rgba(8,6,4,.76)!important;
    -webkit-backdrop-filter:blur(6px)!important;
    backdrop-filter:blur(6px)!important;
    color:#fff!important;
    font-size:11px!important;
    font-weight:800!important;
    line-height:1!important;
    text-decoration:none!important;
    white-space:nowrap!important;
    box-shadow:0 8px 24px rgba(0,0,0,.24)!important;
  }
}

@media (max-width:390px){
  .hero-approved-wide-link{height:210px!important}
  .hero-approved-wide-link img{
    transform:translateY(-50%) scale(1.10)!important;
  }
  .hero-mobile-products-btn{
    left:11.5%!important;
    bottom:10px!important;
    min-height:32px!important;
    padding:0 13px!important;
    font-size:10px!important;
  }
}


/* =========================================================
   Mobile campaign slider — full bleed
   MOBILE ONLY. Desktop/tablet desktop rules remain unchanged.
   Visual goal: same edge-to-edge rhythm as the approved Hero,
   while keeping the campaign's current height/content hierarchy.
   ========================================================= */
@media (max-width:620px){
  /* Let campaign escape any centered/max-width parent */
  body .campaign{
    position:relative!important;
    left:50%!important;
    right:50%!important;
    width:100vw!important;
    max-width:100vw!important;
    margin-left:-50vw!important;
    margin-right:-50vw!important;
    padding-left:0!important;
    padding-right:0!important;
    overflow:hidden!important;
  }

  body .campaign .slider{
    width:100%!important;
    max-width:none!important;
    margin:0!important;
    border-radius:0!important;
    overflow:hidden!important;
    box-shadow:none!important;
  }

  body .campaign .track{
    width:100%!important;
    margin:0!important;
  }

  body .campaign .slide{
    width:100%!important;
    min-width:100%!important;
    max-width:none!important;
    margin:0!important;
    border-radius:0!important;
  }

  /* Keep controls safely inside screen edges */
  body .campaign .arrows{
    left:18px!important;
    right:auto!important;
    bottom:20px!important;
  }

  body .campaign .dots{
    right:18px!important;
    left:auto!important;
    bottom:24px!important;
  }
}

/* Phase 69 — semantic/accessibility utility; no visual change */
.cl-sr-only{
  position:absolute!important;
  width:1px!important;
  height:1px!important;
  padding:0!important;
  margin:-1px!important;
  overflow:hidden!important;
  clip:rect(0,0,0,0)!important;
  white-space:nowrap!important;
  border:0!important;
}


/* =========================================================
   Phase 74 — HOME / Mobile Academy Yellow Stroke
   Scope: ONLY the three academy cards on Home, mobile <=620px.
   No scrim, no blur, no image darkening, no layout change.
   ========================================================= */
@media (max-width:620px){

  .academy-path-copy small,
  .academy-path-copy h3,
  .academy-path-copy p,
  .academy-path-copy b{
    color:#fff!important;
    -webkit-text-stroke:.32px #d9a52b!important;
    paint-order:stroke fill!important;
    text-shadow:
      0 1px 2px rgba(0,0,0,.96),
      0 2px 7px rgba(0,0,0,.78)!important;
  }

  .academy-path-copy h3{
    -webkit-text-stroke:.55px #d9a52b!important;
  }

  .academy-path-copy b{
    color:#fff!important;
    -webkit-text-stroke:.38px #d9a52b!important;
  }

  .academy-path-no{
    color:#fff!important;
    -webkit-text-stroke:.32px #d9a52b!important;
    paint-order:stroke fill!important;
    text-shadow:0 1px 4px rgba(0,0,0,.82)!important;
  }
}


/* Phase 74B — visibly stronger gold outline, mobile academy only */
@media (max-width:620px){
  .academy-path-copy small,
  .academy-path-copy h3,
  .academy-path-copy p,
  .academy-path-copy b,
  .academy-path-no{
    color:#fff!important;
    -webkit-text-fill-color:#fff!important;
    -webkit-text-stroke-color:#d7a52b!important;
    paint-order:stroke fill!important;
    text-shadow:
      -1px -1px 0 #d7a52b,
       1px -1px 0 #d7a52b,
      -1px  1px 0 #d7a52b,
       1px  1px 0 #d7a52b,
       0 2px 5px rgba(0,0,0,.92)!important;
  }
  .academy-path-copy h3{
    -webkit-text-stroke-width:1.15px!important;
  }
  .academy-path-copy p{
    -webkit-text-stroke-width:.75px!important;
  }
  .academy-path-copy small,
  .academy-path-copy b,
  .academy-path-no{
    -webkit-text-stroke-width:.65px!important;
  }
}


/* =========================================================
   Phase 79 — Home Signature / "آهنگ قهوه‌ات را خودت بساز"
   Applies to BOTH desktop and mobile Home.
   Only this card is changed.
   ========================================================= */
.shop-feature-side.signature.signature-music-card{
  background:#1d1510!important;
}
.shop-feature-side.signature.signature-music-card > img{
  position:absolute!important;
  inset:0!important;
  display:block!important;
  width:100%!important;
  height:100%!important;
  object-fit:cover!important;
  object-position:center center!important;
  filter:none!important;
  margin:0!important;
  padding:0!important;
  border:0!important;
}
.shop-feature-side.signature.signature-music-card:hover > img{
  transform:scale(1.018)!important;
}

@media (max-width:620px){
  .shop-feature-side.signature.signature-music-card{
    min-height:250px!important;
  }
  .shop-feature-side.signature.signature-music-card > img{
    object-position:center center!important;
  }
}


/* =========================================================
   Phase 80 — Home Signature responsive visual fix
   Only this card is changed.
   Desktop: give the approved 16:9 artwork enough horizontal space.
   Mobile: preserve the full artwork ratio instead of cropping it.
   ========================================================= */

/* Desktop */
@media (min-width:901px){
  .shop-universe-grid{
    grid-template-columns:1.45fr .72fr .72fr!important;
  }

  .shop-feature-side.signature.signature-music-card{
    grid-column:2 / 4!important;
    grid-row:2!important;
    min-height:0!important;
    aspect-ratio:16 / 9!important;
    width:100%!important;
  }

  .shop-feature-side.signature.signature-music-card > img{
    object-fit:cover!important;
    object-position:center center!important;
  }
}

/* Tablet */
@media (min-width:621px) and (max-width:900px){
  .shop-feature-side.signature.signature-music-card{
    grid-column:1 / 3!important;
    min-height:0!important;
    aspect-ratio:16 / 9!important;
  }

  .shop-feature-side.signature.signature-music-card > img{
    object-fit:cover!important;
    object-position:center center!important;
  }
}

/* Locked mobile visual: no crop, exact approved artwork ratio */
@media (max-width:620px){
  .shop-feature-side.signature.signature-music-card{
    min-height:0!important;
    height:auto!important;
    aspect-ratio:1672 / 941!important;
  }

  .shop-feature-side.signature.signature-music-card > img{
    object-fit:contain!important;
    object-position:center center!important;
    background:#1d1510!important;
  }
}


/* =========================================================
   Phase 81B — Desktop ONLY Signature fix
   Mobile and tablet <=900px remain exactly as Phase80.
   ========================================================= */
@media (min-width:901px){
  .shop-universe-grid{
    grid-template-columns:1.45fr .72fr .72fr!important;
  }

  .shop-feature-side.signature.signature-music-card{
    grid-column:auto!important;
    grid-row:auto!important;
    width:auto!important;
    min-height:470px!important;
    height:auto!important;
    aspect-ratio:auto!important;
    background-image:url("../assets/images/signature-blend-desktop-3x4.png")!important;
    background-size:cover!important;
    background-position:center center!important;
    background-repeat:no-repeat!important;
  }

  .shop-feature-side.signature.signature-music-card > img{
    opacity:0!important;
    visibility:hidden!important;
    pointer-events:none!important;
  }
}


/* Phase141 — mirrored mobile Hero CTA for Signature Blend */
@media (max-width:620px){
  .hero-mobile-products-btn,
  .hero-mobile-signature-btn{
    display:inline-flex!important;
    position:absolute!important;
    z-index:5!important;
    bottom:12px!important;
    width:132px!important;
    min-width:132px!important;
    min-height:34px!important;
    padding:0 8px!important;
    align-items:center!important;
    justify-content:center!important;
    border:1px solid rgba(255,255,255,.5)!important;
    border-radius:999px!important;
    background:rgba(8,6,4,.76)!important;
    -webkit-backdrop-filter:blur(6px)!important;
    backdrop-filter:blur(6px)!important;
    color:#fff!important;
    font-size:10px!important;
    font-weight:800!important;
    line-height:1!important;
    text-decoration:none!important;
    white-space:nowrap!important;
    box-shadow:0 8px 24px rgba(0,0,0,.24)!important;
  }
  .hero-mobile-products-btn{
    left:8%!important;
    right:auto!important;
  }
  .hero-mobile-signature-btn{
    right:8%!important;
    left:auto!important;
  }
}
@media (max-width:390px){
  .hero-mobile-products-btn,
  .hero-mobile-signature-btn{
    width:124px!important;
    min-width:124px!important;
    font-size:9.5px!important;
    padding:0 6px!important;
  }
  .hero-mobile-products-btn{left:7%!important}
  .hero-mobile-signature-btn{right:7%!important}
}

/* Phase 208 — Campaign Slider CMS */
.campaign-image-slide{position:relative!important;display:block!important;padding:0!important;overflow:hidden!important;background:#181613!important;min-height:286px!important}
.campaign-image-slide .campaign-bg{position:absolute;inset:0;display:block}
.campaign-image-slide .campaign-bg img{width:100%;height:100%;display:block;object-fit:cover;object-position:center}
.campaign-text-slide{display:grid!important;place-items:center!important;padding:clamp(34px,7vw,88px)!important;background:radial-gradient(ellipse at 78% 24%,#7e5130 0,transparent 36%),linear-gradient(125deg,#1e1915 0%,#453020 54%,#87603e 100%)!important}
.campaign-text-slide .campaign-text-only{width:min(100%,980px);margin:auto;color:#fff;text-align:center}
.campaign-text-slide .campaign-text-only>span{display:block;margin-bottom:14px;color:#e2bd8b;font-size:11px;font-weight:800;letter-spacing:.16em}
.campaign-text-slide .campaign-text-only h2{margin:0;color:#fff;font-size:clamp(28px,5vw,62px);line-height:1.45;font-weight:900;text-wrap:balance}
.campaign-text-slide .campaign-overlay-ui{inset:auto 34px 28px 34px}
.campaign-overlay-ui{position:absolute;z-index:3;inset:auto 34px 28px 34px;display:flex;align-items:flex-end;justify-content:space-between;gap:14px;pointer-events:none}
.campaign-overlay-ui>*{pointer-events:auto}
.campaign-overlay-ui .campaign-cta{margin:0!important;white-space:nowrap}
.campaign-copy{max-width:min(620px,70%);padding:13px 16px;border:1px solid rgba(255,255,255,.22);border-radius:13px;background:rgba(20,16,13,.55);backdrop-filter:blur(8px);color:#fff;text-shadow:0 1px 5px rgba(0,0,0,.35)}
.campaign-copy b{display:block;margin-bottom:4px;font-size:clamp(15px,1.8vw,22px);font-weight:900;line-height:1.5}
.campaign-copy p,.campaign-text-only p{margin:0;color:rgba(255,255,255,.92);font-size:clamp(11px,1.2vw,14px);line-height:1.8}
.campaign-text-only p{max-width:760px;margin:14px auto 0}
.campaign-countdown{display:grid;gap:6px;padding:10px 12px;border:1px solid rgba(255,255,255,.36);border-radius:14px;background:rgba(14,12,10,.38);backdrop-filter:blur(9px);color:#fff}
.campaign-countdown>small{font-size:9px;font-weight:800;opacity:.88}
.campaign-countdown-values{display:flex;gap:6px;direction:rtl}
.campaign-countdown-values span{display:grid;min-width:48px;text-align:center;padding:5px 7px;border-radius:9px;background:rgba(255,255,255,.13)}
.campaign-countdown-values b{font-size:14px;line-height:1.1}.campaign-countdown-values em{font-style:normal;font-size:8px;opacity:.8}
.campaign-cta.is-disabled{opacity:.5;pointer-events:none}
.campaign-expired{display:none!important}
@media(max-width:900px){
 .campaign-image-slide{min-height:0!important;aspect-ratio:390/500!important}
 .campaign-image-slide .campaign-bg img{object-fit:cover!important}
 .campaign-text-slide{padding:28px 18px 82px!important}
 .campaign-text-slide .campaign-text-only>span{font-size:9px}
 .campaign-text-slide .campaign-text-only h2{font-size:clamp(24px,7vw,36px)}
 .campaign-overlay-ui{inset:auto 16px 16px 16px;align-items:stretch;flex-direction:column-reverse}
 .campaign-overlay-ui .campaign-cta{text-align:center}
 .campaign-copy{max-width:100%;padding:9px 12px}
 .campaign-copy b{font-size:14px}
 .campaign-copy p,.campaign-text-only p{font-size:11px;line-height:1.65}
 .campaign-countdown{align-self:flex-start;max-width:100%}
 .campaign-countdown-values span{min-width:42px}
}

/* Phase 210 — Dual-platform quality video chooser */
.quality-video-open{overflow:hidden}
.quality-video-modal{position:fixed;inset:0;z-index:99999;display:grid;place-items:center;padding:20px}
.quality-video-modal[hidden]{display:none!important}
.quality-video-backdrop{position:absolute;inset:0;background:rgba(13,11,10,.72);backdrop-filter:blur(8px)}
.quality-video-dialog{position:relative;z-index:1;width:min(760px,100%);background:#f7f3ee;color:#2b211b;border:1px solid rgba(255,255,255,.25);border-radius:22px;box-shadow:0 30px 90px rgba(0,0,0,.34);padding:28px}
.quality-video-close{position:absolute;top:12px;left:14px;width:38px;height:38px;border:0;border-radius:999px;background:#e9e1da;color:#30251f;font-size:25px;line-height:1;cursor:pointer}
.quality-video-choice>small{font:800 10px Arial;letter-spacing:.14em;color:#816a5b}
.quality-video-choice h3{margin:8px 0 4px;font-size:24px}.quality-video-choice>p{margin:0 0 18px;color:#76685f}
.quality-video-platforms{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.quality-video-platforms button{border:1px solid #d8ccc3;border-radius:14px;background:#fff;color:#30241e;padding:15px 16px;font:800 14px Vazirmatn,Tahoma,sans-serif;cursor:pointer}
.quality-video-platforms button:hover{background:#2e4b42;color:#fff;border-color:#2e4b42}
.quality-video-empty{padding:12px;border-radius:12px;background:#eee7e1;color:#796b62!important}
.quality-video-player-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:12px}
.quality-video-player-head button{border:0;background:#e9e1da;border-radius:10px;padding:8px 10px;font:700 11px Vazirmatn,Tahoma,sans-serif;cursor:pointer}
.quality-video-frame{overflow:hidden;border-radius:16px;background:#000;aspect-ratio:16/9}
.quality-video-frame iframe{display:block;width:100%;height:100%;border:0}
@media(max-width:640px){
 .quality-video-modal{padding:12px}.quality-video-dialog{padding:24px 16px 16px;border-radius:18px}
 .quality-video-choice h3{font-size:20px;padding-left:34px}.quality-video-platforms{grid-template-columns:1fr}
 .quality-video-player-head{align-items:flex-start;flex-direction:column-reverse}.quality-video-frame{border-radius:12px}
}

/* Phase 212 — Shop Universe CMS */
.shop-cms-card{position:relative!important;overflow:hidden!important;background:#e7dfd8!important}
.shop-cms-card-stage{position:absolute;inset:0}
.shop-cms-card-slide{position:absolute;inset:0;opacity:0;transition:opacity .55s ease;display:block}
.shop-cms-card-slide.is-active{opacity:1}
.shop-cms-card-slide img{width:100%;height:100%;display:block;object-fit:cover;object-position:center}
.shop-cms-dots{position:absolute;z-index:4;left:16px;bottom:14px;display:flex;gap:5px;padding:6px 8px;border-radius:999px;background:rgba(20,17,15,.26);backdrop-filter:blur(6px)}
.shop-cms-dots i{display:block;width:5px;height:5px;border-radius:999px;background:rgba(255,255,255,.55)}
.shop-cms-dots i.is-active{width:17px;background:#fff}
@media(max-width:620px){
 .shop-cms-card-slide img{object-position:center}
 .shop-cms-dots{left:12px;bottom:12px}
}

/* Phase 213 — Academy Cards CMS */
.academy-card-cms-media{position:relative!important;overflow:hidden!important;padding:0!important;display:block!important}
.academy-card-cms-media:before,.academy-card-cms-media:after{display:none!important}
.academy-card-cms-stage{position:absolute;inset:0}
.academy-card-cms-slide{position:absolute;inset:0;opacity:0;transition:opacity .7s ease}
.academy-card-cms-slide.is-active{opacity:1}
.academy-card-cms-slide img{display:block;width:100%;height:100%;object-fit:cover;object-position:center}
.academy-card-cms-dots{position:absolute;z-index:3;left:16px;bottom:14px;display:flex;gap:5px}
.academy-card-cms-dots i{width:5px;height:5px;border-radius:999px;background:rgba(255,255,255,.45)}
.academy-card-cms-dots i.is-active{width:18px;background:#fff}
#coffee-market[hidden]{display:none!important}