/* ==========================================================================
   Coffee House Lane — homepage sections (front page only)
   Prefixed with `body.chl` at build time.
   ========================================================================== */
/* ---------- HERO ---------- */

body.chl .chl-hero {
	position: relative; overflow: hidden; min-height: max(100vh, 1140px); color: var(--chl-cream);
	background:
		radial-gradient(60% 70% at 70% 48%, rgba(217, 154, 78, .45) 0%, rgba(120, 62, 24, .25) 35%, transparent 70%),
		radial-gradient(40% 50% at 10% 100%, rgba(255, 122, 47, .18), transparent 70%),
		var(--chl-ink);
}

body.chl .chl-hero__ghost { position: absolute; inset: auto 0 -4vw 0; z-index: 1; pointer-events: none; }

body.chl .chl-ghost {
	display: inline-flex; gap: 6vw; width: max-content; white-space: nowrap;
	font-family: var(--font-family-heading); font-weight: 900; font-size: 24vw; line-height: .8; letter-spacing: -.04em;
	color: transparent; -webkit-text-stroke: 1.5px rgba(244, 234, 219, .09);
	animation: chl-marq 60s linear infinite;
}

body.chl .chl-hero__inner {
	position: relative; z-index: 3;
	display: grid; grid-template-columns: 1.08fr .92fr; align-items: center;
	padding-top: 150px; padding-bottom: 110px; min-height: inherit;
}

body.chl .chl-kicker .elementor-heading-title {
	display: inline-flex; align-items: center; gap: 12px;
	padding: 8px 16px 8px 8px; border: 1px solid rgba(242, 184, 102, .35); border-radius: var(--radius-pill);
	background: rgba(217, 154, 78, .08);
	font-family: var(--font-family-base); font-size: 14px; font-weight: 600; letter-spacing: .04em; line-height: 1.3; color: var(--chl-copper-2);
}

body.chl .chl-kicker i {
	width: 26px; height: 26px; flex: none; border-radius: 50%; display: grid; place-items: center;
	background: var(--chl-copper); color: var(--chl-ink); font-style: normal; font-size: 13px;
}

body.chl .chl-hero__copy > .chl-kicker { width: auto; align-self: flex-start; }

body.chl .chl-display .elementor-heading-title {
	margin: 30px 0; font-family: var(--font-family-heading); font-weight: 400;
	font-size: var(--text-display); line-height: .88; letter-spacing: -.035em; color: var(--chl-cream);
}

body.chl .chl-display .line { display: block; overflow: hidden; padding-bottom: .22em; margin-bottom: -.22em; }

body.chl .chl-display .line:last-child { margin-bottom: 0; }

body.chl .chl-display .line > span { display: inline-block; animation: chl-rise 1.1s var(--ease-out) both; }

body.chl .chl-display .line:nth-child(2) > span { animation-delay: .12s; }

body.chl .chl-display .line:nth-child(3) > span { animation-delay: .24s; }

body.chl .chl-display .it { font-style: italic; font-weight: 300; color: var(--chl-copper-2); }

body.chl .chl-hero__lead { max-width: 520px; margin-bottom: 40px; font-size: 20px; color: rgba(244, 234, 219, .78); }

body.chl .chl-hero__ctas { flex-direction: row; flex-wrap: wrap; gap: 14px; }

body.chl .chl-hero__ctas > .elementor-widget { width: auto; }

body.chl .chl-proof {
	flex-direction: row; gap: 40px; max-width: 640px; margin-top: 56px; padding-top: 28px;
	border-top: 1px solid rgba(244, 234, 219, .12);
}

body.chl .chl-proof > .elementor-widget { width: auto; }

body.chl .chl-proof__item .elementor-heading-title { font-family: var(--font-family-base); font-size: 14px; line-height: 1.35; color: var(--chl-muted); }

body.chl .chl-proof__item strong {
	display: block; margin-bottom: 4px;
	font-family: var(--font-family-heading); font-weight: 400; font-size: 38px; line-height: 1.1; letter-spacing: -.02em; color: var(--chl-cream);
}

/* Stage */

body.chl .chl-stage { position: relative; height: 100%; min-height: 720px; }

body.chl .chl-stage > .elementor-widget { position: absolute; margin: 0; }

body.chl .chl-stage__decor { inset: 0; width: 100%; height: 100%; pointer-events: none; }

body.chl .chl-stage__fx { position: absolute; inset: 0; }

body.chl .chl-stage__fx .halo {
	position: absolute; left: 50%; top: 50%; width: 640px; height: 640px; border-radius: 50%;
	transform: translate(-50%, -50%); filter: blur(40px);
	background: conic-gradient(from 0deg, rgba(242, 184, 102, 0), rgba(242, 184, 102, .35), rgba(255, 122, 47, 0) 40%, rgba(242, 184, 102, .25) 70%, rgba(242, 184, 102, 0));
	animation: chl-spin-c 18s linear infinite;
}

body.chl .chl-stage__fx .ring {
	position: absolute; left: 50%; top: 50%; width: 600px; height: 600px; border-radius: 50%;
	transform: translate(-50%, -50%); border: 1px solid rgba(244, 234, 219, .12);
}

body.chl .chl-stage__fx .ring.r2 { width: 760px; height: 760px; border-style: dashed; border-color: rgba(244, 234, 219, .07); animation: chl-spin-c 80s linear infinite; }

body.chl .chl-stage__bags { left: 50%; top: 50%; width: 520px; z-index: 3; transform: translate(-50%, -50%); }

body.chl .chl-stage__bags img { width: 100%; filter: drop-shadow(0 60px 60px rgba(0, 0, 0, .6)); animation: chl-float 7s ease-in-out infinite; }

body.chl .chl-stage__pile { right: -60px; bottom: 80px; width: 340px; z-index: 4; }

body.chl .chl-stage__pile img { width: 100%; filter: drop-shadow(0 20px 30px rgba(0, 0, 0, .5)); }

body.chl .chl-stage__pile--2 { right: auto; left: 20px; bottom: 110px; width: 220px; transform: scaleX(-1) rotate(-8deg); }

body.chl .chl-stage__pile--2 img { filter: drop-shadow(0 20px 30px rgba(0, 0, 0, .5)) blur(.5px); }

body.chl .chl-stage__fx .bean {
	position: absolute; z-index: 5; width: 34px; height: 24px; border-radius: 50%;
	background: radial-gradient(circle at 35% 30%, #8a5530, #3b1f10 70%);
	box-shadow: inset -3px -3px 6px rgba(0, 0, 0, .4), 0 10px 20px rgba(0, 0, 0, .4);
}

body.chl .chl-stage__fx .bean::after {
	content: ""; position: absolute; left: 50%; top: 10%; bottom: 10%; width: 3px; border-radius: 3px;
	background: #1e0f07; transform: translateX(-50%) rotate(8deg);
}

body.chl .chl-stage__fx .b1 { top: 14%; left: 16%; transform: rotate(30deg); animation: chl-drift 9s ease-in-out infinite; }

body.chl .chl-stage__fx .b2 { top: 22%; right: 6%; transform: rotate(-20deg) scale(1.3); animation: chl-drift 11s ease-in-out infinite reverse; filter: blur(1.5px); }

body.chl .chl-stage__fx .b3 { top: 64%; left: 56%; transform: rotate(70deg) scale(.8); animation: chl-drift 8s ease-in-out infinite; }

body.chl .chl-stage__fx .b4 { top: 8%; left: 60%; transform: rotate(-50deg) scale(.7); animation: chl-drift 10s ease-in-out infinite; filter: blur(2px); }

body.chl .chl-stage__fx .b5 { bottom: 6%; left: 30%; transform: rotate(15deg) scale(1.6); animation: chl-drift 12s ease-in-out infinite reverse; filter: blur(3px); }

body.chl .chl-stage__badge { right: 30px; top: 120px; width: 170px; height: 170px; z-index: 6; }

body.chl .chl-badge { position: relative; width: 100%; height: 100%; color: var(--chl-cream); }

body.chl .chl-badge svg { width: 100%; height: 100%; font-family: var(--font-family-base); animation: chl-spin 22s linear infinite; }

body.chl .chl-badge .core {
	position: absolute; inset: 38px; border-radius: 50%; display: grid; place-items: center; text-align: center;
	background: var(--chl-copper); color: var(--chl-ink);
	font-family: var(--font-family-heading); font-size: 15px; line-height: 1.05; font-weight: 600;
}

body.chl .chl-badge .core b { display: block; font-size: 30px; font-weight: 500; font-style: italic; }

body.chl .chl-hero__cue { position: absolute; left: 50%; bottom: 26px; z-index: 4; width: auto; transform: translateX(-50%); }

body.chl .chl-scroll-cue { display: flex; flex-direction: column; align-items: center; gap: 10px; font-size: 12px; letter-spacing: .2em; color: var(--chl-muted); }

body.chl .chl-scroll-cue i { width: 1px; height: 46px; background: linear-gradient(var(--chl-copper-2), transparent); animation: chl-cue 2s ease-in-out infinite; }

/* ---------- TICKERS ---------- */

body.chl .chl-tickers { position: relative; z-index: 8; overflow: hidden; margin: -38px 0 -50px; padding: 30px 0 20px; }

body.chl .chl-ticker {
	position: relative; z-index: 8; background: var(--chl-copper); color: var(--chl-ink);
	border-block: 2px solid var(--chl-ink); transform: rotate(-2deg) scale(1.04);
}

body.chl .chl-ticker .chl-marquee__track { animation-duration: 30s; }

body.chl .chl-ticker .chl-marquee__group {
	gap: 44px; padding: 22px 44px 22px 0;
	font-family: var(--font-family-heading); font-size: 52px; font-weight: 500; letter-spacing: -.02em; line-height: 1.1;
}

body.chl .chl-ticker span:nth-of-type(even) { font-style: italic; font-weight: 300; }

body.chl .chl-ticker i { font-style: normal; }

body.chl .chl-ticker .star { font-size: 34px; }

body.chl .chl-ticker--alt { z-index: 7; margin-top: -6px; background: var(--chl-ink); color: var(--chl-copper-2); border-color: var(--chl-copper); transform: rotate(1.4deg) scale(1.04); }

body.chl .chl-ticker--alt .chl-marquee__track { animation-direction: reverse; }

body.chl .chl-ticker--alt .chl-marquee__group { font-size: 28px; padding-block: 14px; }

/* ---------- ROASTS ---------- */

body.chl .chl-roasts { background: var(--chl-cream); color: var(--chl-ink); padding: 200px 0 150px; margin-top: -30px; }

body.chl .chl-roast-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 22px; }

body.chl .chl-roast {
	position: relative; overflow: hidden; min-height: 600px; padding: 28px; border-radius: var(--radius-lg); color: var(--chl-ink);
	transition: transform .5s var(--ease-out), box-shadow .5s;
}

body.chl .chl-roast:hover { transform: translateY(-12px) rotate(-.6deg); box-shadow: 0 40px 80px -30px rgba(14, 9, 7, .55); }

body.chl .chl-roast--gold { background: var(--chl-card-gold); }

body.chl .chl-roast--sky { background: var(--chl-card-sky); }

body.chl .chl-roast--sun { background: var(--chl-card-sun); }

body.chl .chl-roast--lilac { background: var(--chl-card-lilac); }

body.chl .chl-roast__num .elementor-heading-title {
	display: flex; justify-content: space-between; align-items: center;
	font-family: var(--font-family-heading); font-size: 15px; font-weight: 600; line-height: 1.3;
}

body.chl .chl-roast__num span {
	padding: 4px 12px; border: 1.5px solid currentColor; border-radius: var(--radius-pill);
	font-family: var(--font-family-base); font-size: 12px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase;
}

body.chl .chl-roast__shot { flex: 1 1 auto; display: grid; place-items: center; margin: 10px -10px; position: relative; }

body.chl .chl-roast__shot::before { content: ""; position: absolute; width: 78%; aspect-ratio: 1; border-radius: 50%; background: rgba(255, 255, 255, .35); }

body.chl .chl-roast__img { position: relative; display: grid; place-items: center; }

body.chl .chl-roast__img img { width: 62%; margin-inline: auto; filter: drop-shadow(0 26px 30px rgba(14, 9, 7, .35)); transition: transform .6s var(--ease-out); }

body.chl .chl-roast:hover .chl-roast__img img { transform: scale(1.07) rotate(-4deg); }

body.chl .chl-roast__title .elementor-heading-title { margin-bottom: 10px; font-family: var(--font-family-heading); font-weight: 400; font-size: 40px; line-height: .95; letter-spacing: -.03em; }

body.chl .chl-roast__title em { font-weight: 300; }

body.chl .chl-roast__notes .elementor-heading-title { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 18px; font-family: var(--font-family-base); }

body.chl .chl-roast__notes i { font-style: normal; font-size: 12.5px; font-weight: 600; line-height: 1.3; padding: 5px 11px; border-radius: var(--radius-pill); background: rgba(14, 9, 7, .1); }

body.chl .chl-roast__buy { flex-direction: row; justify-content: space-between; align-items: center; padding-top: 18px; border-top: 1.5px solid rgba(14, 9, 7, .2); }

body.chl .chl-roast__buy > .elementor-widget { width: auto; }

body.chl .chl-roast__price .elementor-heading-title { font-family: var(--font-family-heading); font-size: 34px; letter-spacing: -.02em; line-height: 1; }

body.chl .chl-roast__price small { margin-left: 4px; font-family: var(--font-family-base); font-size: 13px; opacity: .6; letter-spacing: 0; }

body.chl .chl-roast__add .elementor-button {
	width: 54px; height: 54px; padding: 0; border-radius: 50%; display: grid; place-items: center;
	background: var(--chl-ink); color: var(--chl-cream); fill: currentColor; transition: transform .3s;
}

body.chl .chl-roast__add .elementor-button-icon { margin: 0; }

body.chl .chl-roast__add .elementor-button-icon svg { width: 20px; height: 20px; fill: currentColor; }

body.chl .chl-roast__add .elementor-button-text { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }

body.chl .chl-roast:hover .chl-roast__add .elementor-button { transform: rotate(90deg); }

body.chl .chl-roasts__foot { flex-direction: row; justify-content: space-between; align-items: center; gap: 20px; margin-top: 40px; }

body.chl .chl-roasts__foot > .elementor-widget { width: auto; }

body.chl .chl-chips .elementor-heading-title { display: flex; flex-wrap: wrap; gap: 10px; font-family: var(--font-family-base); }

body.chl .chl-chips a {
	padding: 10px 20px; border: 1.5px solid rgba(14, 9, 7, .25); border-radius: var(--radius-pill);
	font-size: 15px; font-weight: 600; line-height: 1.3; color: var(--chl-ink);
}

body.chl .chl-chips a:hover { border-color: var(--chl-ink); color: var(--chl-ink); }

body.chl .chl-chips a.on { background: var(--chl-ink); border-color: var(--chl-ink); color: var(--chl-cream); }

/* ---------- JOURNEY ---------- */

body.chl .chl-journey { background: var(--chl-ink); color: var(--chl-cream); padding: 160px 0 170px; overflow: hidden; }

body.chl .chl-journey .chl-sec-head__text { color: rgba(244, 234, 219, .65); }

body.chl .chl-steps { position: relative; display: grid; grid-template-columns: repeat(4, 1fr); gap: 22px; }

body.chl .chl-steps::before {
	content: ""; position: absolute; left: 0; right: 0; top: 46px; height: 1px;
	background: repeating-linear-gradient(90deg, rgba(242, 184, 102, .5) 0 8px, transparent 8px 16px);
}

body.chl .chl-step:nth-child(even) { margin-top: 80px; }

body.chl .chl-step__dot { width: auto; }

body.chl .chl-step__dot .elementor-heading-title {
	position: relative; z-index: 2; width: 92px; height: 92px; margin-bottom: 30px; border-radius: 50%;
	display: grid; place-items: center;
	background: var(--chl-ink); border: 1px solid rgba(242, 184, 102, .5);
	font-family: var(--font-family-heading); font-size: 34px; font-style: italic; color: var(--chl-copper-2);
}

body.chl .chl-step:nth-child(2) .chl-step__dot .elementor-heading-title { background: var(--chl-copper); border-color: var(--chl-copper); color: var(--chl-ink); }

body.chl .chl-step__ph { position: relative; overflow: hidden; aspect-ratio: 4 / 5; margin-bottom: 26px; border-radius: 22px; }

body.chl .chl-step__ph > .elementor-widget-image { position: absolute; inset: 0; }

body.chl .chl-step__ph img { width: 100%; height: 100%; object-fit: cover; transition: transform 1s var(--ease-out); }

body.chl .chl-step:hover .chl-step__ph img { transform: scale(1.08); }

body.chl .chl-step__label { position: absolute; left: 16px; bottom: 16px; width: auto; }

body.chl .chl-step__label .elementor-heading-title {
	padding: 7px 14px; border-radius: var(--radius-pill); background: rgba(14, 9, 7, .6);
	-webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px);
	font-family: var(--font-family-base); font-size: 13px; font-weight: 600; line-height: 1.3;
}

body.chl .chl-step__title .elementor-heading-title { margin-bottom: 10px; font-family: var(--font-family-heading); font-weight: 400; font-size: 36px; letter-spacing: -.02em; line-height: 1.05; }

body.chl .chl-step__text { max-width: 330px; font-size: 16px; color: rgba(244, 234, 219, .65); }

/* ---------- FILM ---------- */

body.chl .chl-film { position: relative; height: 780px; overflow: hidden; justify-content: flex-end; color: var(--chl-cream); }

body.chl .chl-film::before {
	content: ""; position: absolute; inset: 0; z-index: 1;
	background: linear-gradient(180deg, rgba(14, 9, 7, .85) 0%, rgba(14, 9, 7, .1) 35%, rgba(14, 9, 7, .2) 60%, rgba(14, 9, 7, .95) 100%);
}

body.chl .chl-film__bg { position: absolute; inset: 0; z-index: 0; }

body.chl .chl-film__bg img { width: 100%; height: 100%; object-fit: cover; object-position: center 40%; }

body.chl .chl-film__inner { position: relative; z-index: 2; flex-direction: row; justify-content: space-between; align-items: flex-end; gap: 40px; padding-bottom: 90px; }

body.chl .chl-film__inner > .elementor-widget { width: auto; }

body.chl .chl-film__title .elementor-heading-title { font-size: clamp(56px, 7.4vw, 150px); max-width: 1100px; }

body.chl .chl-play { position: relative; width: 180px; height: 180px; flex: none; border-radius: 50%; display: grid; place-items: center; color: var(--chl-cream); }

body.chl .chl-play svg.txt { position: absolute; inset: 0; font-family: var(--font-family-base); animation: chl-spin 16s linear infinite; }

body.chl .chl-play .core { width: 96px; height: 96px; border-radius: 50%; display: grid; place-items: center; background: var(--chl-cream); transition: transform .3s; }

body.chl .chl-play:hover .core { transform: scale(1.1); }

body.chl .chl-play .core i { width: 0; height: 0; margin-left: 6px; border-left: 24px solid var(--chl-ink); border-block: 15px solid transparent; }

/* ---------- WHOLESALE ---------- */

body.chl .chl-trade { background: var(--chl-ink-2); color: var(--chl-cream); padding: 170px 0; overflow: hidden; }

body.chl .chl-trade__grid { display: grid; grid-template-columns: 1.05fr .95fr; gap: 90px; align-items: start; }

body.chl .chl-trade__lede { max-width: 560px; margin: 34px 0 56px; font-size: 20px; color: rgba(244, 234, 219, .72); }

body.chl .chl-perks { display: grid; grid-template-columns: 1fr 1fr; border-top: 1px solid rgba(244, 234, 219, .12); }

body.chl .chl-perk { padding: 28px 24px 28px 0; border-bottom: 1px solid rgba(244, 234, 219, .12); }

body.chl .chl-perk:nth-child(odd) { border-right: 1px solid rgba(244, 234, 219, .12); }

body.chl .chl-perk:nth-child(even) { padding-left: 28px; }

body.chl .chl-perk__title .elementor-heading-title {
	margin-bottom: 8px; font-family: var(--font-family-heading); font-weight: 400; font-size: 44px; line-height: 1; letter-spacing: -.03em; color: var(--chl-copper-2);
}

body.chl .chl-perk__text { font-size: 15.5px; color: rgba(244, 234, 219, .7); }

body.chl .chl-trade__img { position: relative; overflow: hidden; height: 300px; margin-top: 56px; border-radius: 24px; }

body.chl .chl-trade__img > .elementor-widget-image { position: absolute; inset: 0; }

body.chl .chl-trade__img img { width: 100%; height: 100%; object-fit: cover; }

body.chl .chl-trade__tag { position: absolute; right: 18px; top: 18px; width: auto; }

body.chl .chl-trade__tag .elementor-heading-title {
	padding: 8px 16px; border-radius: var(--radius-pill); background: var(--chl-copper); color: var(--chl-ink);
	font-family: var(--font-family-base); font-size: 13px; font-weight: 700; line-height: 1.3;
}

body.chl .chl-trade__card {
	position: sticky; top: 100px; padding: 46px; border-radius: 32px;
	background: linear-gradient(160deg, rgba(244, 234, 219, .10), rgba(244, 234, 219, .03));
	border: 1px solid rgba(244, 234, 219, .14);
	-webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px);
}

body.chl .chl-trade__form-title .elementor-heading-title { font-family: var(--font-family-heading); font-weight: 400; font-size: 44px; line-height: 1; letter-spacing: -.03em; }

body.chl .chl-trade__sub .elementor-heading-title {
	display: flex; align-items: center; gap: 10px; margin: 12px 0 34px;
	font-family: var(--font-family-base); font-size: 17px; line-height: 1.4; color: rgba(244, 234, 219, .65);
}

body.chl .chl-trade__sub i { width: 9px; height: 9px; flex: none; border-radius: 50%; background: #5BE38B; box-shadow: 0 0 0 5px rgba(91, 227, 139, .18); animation: chl-pulse 2s infinite; }

body.chl .chl-trade__alt { margin-top: 22px; text-align: center; font-size: 15px; color: rgba(244, 234, 219, .6); }

body.chl .chl-trade__alt a { color: var(--chl-copper-2); font-weight: 600; }

/* ---------- SUBSCRIPTIONS ---------- */

body.chl .chl-subs { background: var(--chl-lilac); color: var(--chl-ink); padding: 160px 0; overflow: hidden; }

body.chl .chl-subs .chl-eyebrow .elementor-heading-title { color: var(--chl-ink); }

body.chl .chl-subs__grid { display: grid; grid-template-columns: 1fr 1fr; gap: 80px; align-items: center; }

body.chl .chl-subs__title .elementor-heading-title { font-size: clamp(70px, 9.4vw, 190px); line-height: .82; }

body.chl .chl-subs__title em { color: var(--chl-ink); }

body.chl .chl-subs__price .elementor-heading-title { display: flex; align-items: baseline; gap: 14px; margin: 36px 0 44px; font-family: var(--font-family-base); }

body.chl .chl-subs__price b { font-family: var(--font-family-heading); font-size: 84px; font-weight: 400; letter-spacing: -.04em; line-height: 1; }

body.chl .chl-subs__price span { max-width: 240px; font-size: 18px; line-height: 1.3; }

body.chl .chl-substeps { display: grid; gap: 12px; margin-bottom: 44px; }

body.chl .chl-substep {
	flex-direction: row; align-items: center; gap: 22px; padding: 18px 22px; border-radius: 20px;
	background: rgba(255, 255, 255, .4); transition: transform .3s, background-color .3s;
}

body.chl .chl-substep:hover { transform: translateX(10px); background: rgba(255, 255, 255, .65); }

body.chl .chl-substep > .elementor-widget { width: auto; }

body.chl .chl-substep__num .elementor-heading-title { width: 56px; font-family: var(--font-family-heading); font-style: italic; font-size: 40px; line-height: 1; }

body.chl .chl-substep__text .elementor-heading-title { font-family: var(--font-family-base); line-height: 1.35; }

body.chl .chl-substep__text strong { display: block; font-size: 19px; }

body.chl .chl-substep__text span { font-size: 15px; opacity: .7; }

body.chl .chl-subs__copy > .chl-btn { width: auto; align-self: flex-start; }

body.chl .chl-subs__vis { position: relative; height: 740px; }

body.chl .chl-subs__blob {
	position: absolute; inset: 40px; width: auto; background: var(--chl-ink);
	border-radius: 44% 56% 61% 39% / 47% 41% 59% 53%; animation: chl-morph 12s ease-in-out infinite;
}

body.chl .chl-subs__img { position: absolute; left: 50%; top: 50%; width: 78%; transform: translate(-50%, -50%) rotate(-4deg); }

body.chl .chl-subs__img img { width: 100%; border-radius: 26px; box-shadow: 0 50px 80px -30px rgba(0, 0, 0, .7); }

body.chl .chl-subs__tag { position: absolute; width: auto; z-index: 2; }

body.chl .chl-subs__tag .elementor-heading-title {
	display: flex; gap: 12px; align-items: center; padding: 14px 18px; border-radius: 18px;
	background: var(--chl-cream); box-shadow: 0 20px 40px -14px rgba(0, 0, 0, .4);
	font-family: var(--font-family-base); font-size: 14px; font-weight: 600; line-height: 1.35;
}

body.chl .chl-subs__tag b { width: 38px; height: 38px; flex: none; border-radius: 50%; display: grid; place-items: center; background: var(--chl-sun); font-size: 18px; }

body.chl .chl-subs__tag--1 { left: 0; top: 90px; animation: chl-float 6s ease-in-out infinite; }

body.chl .chl-subs__tag--2 { right: 0; bottom: 110px; animation: chl-float 7s ease-in-out infinite reverse; }

body.chl .chl-subs__tag--2 b { background: var(--chl-copper); }

/* ---------- PEOPLE / BENTO ---------- */

body.chl .chl-people { background: var(--chl-cream); color: var(--chl-ink); padding: 160px 0; }

body.chl .chl-bento { display: grid; grid-template-columns: repeat(12, 1fr); grid-auto-rows: 150px; gap: 20px; }

body.chl .chl-tile { position: relative; overflow: hidden; border-radius: var(--radius-lg); color: var(--chl-cream); }

body.chl a.chl-tile:hover { color: var(--chl-cream); }

body.chl .chl-tile > .elementor-widget-image { position: absolute; inset: 0; }

body.chl .chl-tile img { width: 100%; height: 100%; object-fit: cover; transition: transform 1s var(--ease-out); }

body.chl .chl-tile:hover img { transform: scale(1.06); }

body.chl .chl-tile__cap {
	position: absolute; left: 0; right: 0; bottom: 0; z-index: 1;
	flex-direction: row; justify-content: space-between; align-items: flex-end; gap: 20px;
	padding: 28px; background: linear-gradient(transparent, rgba(14, 9, 7, .85));
}

body.chl .chl-tile__copy { width: auto; flex: 1 1 auto; }

body.chl .chl-tile__title .elementor-heading-title { font-family: var(--font-family-heading); font-weight: 400; font-size: 36px; line-height: 1; letter-spacing: -.02em; }

body.chl .chl-tile__text { max-width: 360px; margin-top: 8px; font-size: 15px; opacity: .8; }

body.chl .chl-tile__go { width: auto; flex: none; }

body.chl .chl-tile__go .elementor-heading-title {
	width: 52px; height: 52px; border-radius: 50%; display: grid; place-items: center;
	background: var(--chl-copper); color: var(--chl-ink); font-family: var(--font-family-base); font-size: 20px;
	transition: transform .3s;
}

body.chl .chl-tile:hover .chl-tile__go .elementor-heading-title { transform: rotate(-45deg); }

body.chl .chl-tile--award { grid-column: span 7; grid-row: span 2; background: #0f0f0f; }

body.chl .chl-tile--award img { object-position: left center; }

body.chl .chl-tile--team { grid-column: span 5; grid-row: span 4; }

body.chl .chl-tile--trailer { grid-column: span 4; grid-row: span 3; }

body.chl .chl-tile--stat { grid-column: span 3; grid-row: span 3; justify-content: space-between; padding: 30px; background: var(--chl-ink); }

body.chl .chl-tile__big .elementor-heading-title { font-family: var(--font-family-heading); font-size: 120px; line-height: .85; letter-spacing: -.05em; color: var(--chl-copper-2); }

body.chl .chl-tile__big em { font-weight: 300; }

body.chl .chl-tile--stat .chl-tile__text { margin: 0; font-size: 16px; color: rgba(244, 234, 219, .72); opacity: 1; }

body.chl .chl-tile--iced { grid-column: span 5; grid-row: span 2; }

body.chl .chl-tile--quote { grid-column: span 7; grid-row: span 2; justify-content: space-between; padding: 40px 44px; background: var(--chl-copper); color: var(--chl-ink); }

body.chl .chl-tile__quote blockquote { margin: 0; padding: 0; border: 0; font-family: var(--font-family-heading); font-size: 36px; font-weight: 400; line-height: 1.1; letter-spacing: -.02em; }

body.chl .chl-tile__cite .elementor-heading-title { display: flex; justify-content: space-between; font-family: var(--font-family-base); font-size: 15px; font-weight: 600; }

/* ---------- INSTAGRAM ---------- */

body.chl .chl-insta { background: var(--chl-ink); color: var(--chl-cream); padding: 150px 0 120px; overflow: hidden; text-align: center; }

body.chl .chl-insta .chl-h2 em { color: var(--chl-copper-2); }

body.chl .chl-polas { flex-direction: row; justify-content: center; margin-top: 70px; }

body.chl .chl-pola {
	position: relative; flex: none; width: 300px; margin: 0 -16px; padding: 14px 14px 50px; border-radius: 6px;
	background: var(--chl-paper); color: var(--chl-ink); box-shadow: 0 30px 60px -20px rgba(0, 0, 0, .7);
	transition: transform .4s var(--ease-out);
}

body.chl a.chl-pola:hover { color: var(--chl-ink); }

body.chl .chl-pola img { width: 100%; aspect-ratio: 1; object-fit: cover; margin-bottom: 12px; border-radius: 3px; }

body.chl .chl-pola__cap .elementor-heading-title { font-family: var(--font-family-heading); font-style: italic; font-size: 18px; line-height: 1.3; }

body.chl .chl-pola:nth-child(1) { transform: rotate(-8deg) translateY(30px); }

body.chl .chl-pola:nth-child(2) { transform: rotate(4deg); }

body.chl .chl-pola:nth-child(3) { transform: rotate(-3deg) translateY(-20px); z-index: 2; }

body.chl .chl-pola:nth-child(4) { transform: rotate(6deg) translateY(10px); }

body.chl .chl-pola:nth-child(5) { transform: rotate(-5deg) translateY(36px); }

body.chl .chl-pola:hover,
body.chl .chl-pola:focus-visible { transform: rotate(0) translateY(-30px) scale(1.06); z-index: 5; }

/* ---------- FAQ ---------- */

body.chl .chl-faq { background: var(--chl-paper); color: var(--chl-ink); padding: 150px 0; }

body.chl .chl-faq__grid { display: grid; grid-template-columns: .8fr 1.2fr; gap: 90px; }

body.chl .chl-glance { margin-top: 46px; font-size: 15.5px; }

body.chl .chl-glance div { display: flex; justify-content: space-between; gap: 30px; padding: 16px 0; border-bottom: 1px solid rgba(14, 9, 7, .12); }

body.chl .chl-glance span:first-child { color: rgba(14, 9, 7, .55); }

body.chl .chl-glance span:last-child { text-align: right; font-weight: 600; }

body.chl .chl-glance a:hover { color: var(--chl-copper); }

body.chl .chl-faq__acc {
	--n-accordion-title-normal-color: var(--chl-ink); --n-accordion-title-hover-color: var(--chl-ink); --n-accordion-title-active-color: var(--chl-ink);
	--n-accordion-icon-normal-color: var(--chl-ink); --n-accordion-icon-hover-color: var(--chl-ink); --n-accordion-icon-active-color: var(--chl-cream);
	--n-accordion-item-title-space-between: 0px; --n-accordion-border-width: 0px;
}

body.chl .chl-faq__acc .e-n-accordion { gap: 0; }

body.chl .chl-faq__acc .e-n-accordion-item { border-bottom: 1.5px solid rgba(14, 9, 7, .14); }

body.chl .chl-faq__acc .e-n-accordion-item-title {
	display: flex; justify-content: space-between; align-items: center; gap: 30px;
	padding: 30px 0; border: 0; background: transparent; cursor: pointer; color: var(--chl-ink);
}

body.chl .chl-faq__acc .e-n-accordion-item-title-text {
	font-family: var(--font-family-heading); font-weight: 400; font-size: 30px; line-height: 1.15; letter-spacing: -.02em; color: var(--chl-ink);
}

body.chl .chl-faq__acc .e-n-accordion-item-title-icon {
	order: 2; width: 48px; height: 48px; flex: none; border-radius: 50%; display: grid; place-items: center;
	border: 1.5px solid rgba(14, 9, 7, .2); color: var(--chl-ink); fill: currentColor; transition: transform .3s, background-color .3s, color .3s;
}

body.chl .chl-faq__acc .e-n-accordion-item-title-icon span { display: grid; place-items: center; }

body.chl .chl-faq__acc .e-n-accordion-item-title-icon svg { width: 16px; height: 16px; fill: currentColor; }

body.chl .chl-faq__acc .e-n-accordion-item[open] .e-n-accordion-item-title-icon svg { fill: var(--chl-cream); }

body.chl .chl-faq__acc .e-n-accordion-item[open] .e-n-accordion-item-title-icon { transform: rotate(45deg); background: var(--chl-ink); color: var(--chl-cream); border-color: var(--chl-ink); }

body.chl .chl-faq__acc .e-n-accordion-item > .e-con { padding: 0 80px 30px 0; border: 0; }

body.chl .chl-faq__answer { font-size: 17px; color: rgba(14, 9, 7, .7); }

/* ---------- FINAL CTA ---------- */

body.chl .chl-final { background: var(--chl-copper); color: var(--chl-ink); padding: 140px 0 0; overflow: hidden; }

body.chl .chl-final__grid { display: grid; grid-template-columns: 1.2fr .8fr; gap: 60px; align-items: end; padding-bottom: 110px; }

body.chl .chl-final__title .elementor-heading-title { font-size: clamp(60px, 7.6vw, 150px); }

body.chl .chl-final__title em { color: var(--chl-ink); }

body.chl .chl-final__text { max-width: 440px; margin-bottom: 24px; font-size: 19px; }

body.chl .chl-final__small .elementor-heading-title { margin-top: 14px; padding-left: 22px; font-family: var(--font-family-base); font-size: 14px; opacity: .75; }

/* ---------- motion ---------- */
@keyframes chl-spin { to { transform: rotate(360deg); } }
@keyframes chl-spin-c { to { transform: translate(-50%, -50%) rotate(360deg); } }
@keyframes chl-float { 0%, 100% { translate: 0 0; } 50% { translate: 0 -18px; } }
@keyframes chl-drift { 0%, 100% { translate: 0 0; } 50% { translate: 12px -24px; } }
@keyframes chl-rise { from { transform: translateY(105%); } to { transform: none; } }
@keyframes chl-cue {
	0% { transform: scaleY(0); transform-origin: top; } 50% { transform: scaleY(1); transform-origin: top; }
	51% { transform-origin: bottom; } 100% { transform: scaleY(0); transform-origin: bottom; }
}
@keyframes chl-pulse { 50% { box-shadow: 0 0 0 9px rgba(91, 227, 139, .05); } }
@keyframes chl-morph {
	0%, 100% { border-radius: 44% 56% 61% 39% / 47% 41% 59% 53%; }
	50% { border-radius: 58% 42% 38% 62% / 55% 60% 40% 45%; }
}
/* ---------- tablet ≤1024 ---------- */
@media (max-width: 1024px) { 
body.chl .chl-hero { min-height: 0; }

body.chl .chl-hero__inner { grid-template-columns: 1fr; padding-top: 140px; padding-bottom: 80px; }

body.chl .chl-stage { min-height: 560px; }

body.chl .chl-stage__bags { width: 340px; }

body.chl .chl-stage__pile { width: 200px; right: 0; }

body.chl .chl-stage__pile--2 { width: 160px; }

body.chl .chl-stage__fx .halo,
body.chl .chl-stage__fx .ring { width: 420px; height: 420px; }

body.chl .chl-stage__fx .ring.r2 { width: 520px; height: 520px; }

body.chl .chl-stage__badge { width: 120px; height: 120px; top: 20px; right: 10px; }

body.chl .chl-badge .core { inset: 26px; font-size: 11px; }

body.chl .chl-badge .core b { font-size: 20px; }

body.chl .chl-ticker .chl-marquee__group { font-size: 40px; }

body.chl .chl-roasts { padding: 160px 0 110px; }

body.chl .chl-roast-grid { grid-template-columns: 1fr 1fr; }

body.chl .chl-journey,
body.chl .chl-trade,
body.chl .chl-subs,
body.chl .chl-people,
body.chl .chl-faq { padding: 110px 0; }

body.chl .chl-steps { grid-template-columns: 1fr 1fr; }

body.chl .chl-steps::before { display: none; }

body.chl .chl-step:nth-child(even) { margin-top: 0; }

body.chl .chl-film { height: 640px; }

body.chl .chl-film__inner { flex-direction: column; align-items: flex-start; }

body.chl .chl-trade__grid,
body.chl .chl-subs__grid,
body.chl .chl-faq__grid,
body.chl .chl-final__grid { grid-template-columns: 1fr; gap: 56px; }

body.chl .chl-trade__card { position: relative; top: 0; }

body.chl .chl-bento { grid-template-columns: 1fr 1fr; grid-auto-rows: 220px; }

body.chl .chl-bento > .chl-tile { grid-column: span 1; grid-row: span 2; }

body.chl .chl-bento > .chl-tile--award,
body.chl .chl-bento > .chl-tile--quote { grid-column: span 2; }

body.chl .chl-polas { flex-wrap: wrap; gap: 20px; }

body.chl .chl-pola { width: 44%; margin: 0; }

}

/* ---------- mobile ≤767 ---------- */
@media (max-width: 767px) { 
body.chl .chl-hero__inner { padding-top: 120px; padding-bottom: 60px; }

body.chl .chl-hero__lead { font-size: 18px; }

body.chl .chl-proof { gap: 20px; flex-wrap: wrap; margin-top: 40px; }

body.chl .chl-proof__item strong { font-size: 30px; }

body.chl .chl-stage { min-height: 440px; }

body.chl .chl-stage__bags { width: 260px; }

body.chl .chl-stage__pile { width: 150px; bottom: 40px; }

body.chl .chl-stage__pile--2 { width: 120px; bottom: 60px; }

body.chl .chl-stage__fx .halo,
body.chl .chl-stage__fx .ring { width: 300px; height: 300px; }

body.chl .chl-stage__fx .ring.r2 { width: 380px; height: 380px; }

body.chl .chl-ticker .chl-marquee__group { font-size: 32px; padding-block: 16px; }

body.chl .chl-ticker--alt .chl-marquee__group { font-size: 22px; padding-block: 10px; }

body.chl .chl-roasts { padding: 130px 0 90px; }

body.chl .chl-journey,
body.chl .chl-trade,
body.chl .chl-subs,
body.chl .chl-people,
body.chl .chl-faq,
body.chl .chl-insta { padding: 90px 0; }

body.chl .chl-final { padding-top: 90px; }

body.chl .chl-final__grid { padding-bottom: 80px; }

body.chl .chl-roast-grid,
body.chl .chl-steps { grid-template-columns: 1fr; }

body.chl .chl-roast { min-height: 540px; }

body.chl .chl-roasts__foot { flex-direction: column; align-items: flex-start; }

body.chl .chl-film { height: 560px; }

body.chl .chl-film__inner { padding-bottom: 60px; }

body.chl .chl-play { width: 140px; height: 140px; }

body.chl .chl-play .core { width: 76px; height: 76px; }

body.chl .chl-perks { grid-template-columns: 1fr; }

body.chl .chl-perk:nth-child(odd) { border-right: 0; }

body.chl .chl-perk:nth-child(even) { padding-left: 0; }

body.chl .chl-trade__card { padding: 28px; border-radius: 24px; }

body.chl .chl-subs__vis { height: 460px; }

body.chl .chl-subs__price b { font-size: 64px; }

body.chl .chl-bento { grid-template-columns: 1fr; grid-auto-rows: 200px; }

body.chl .chl-bento > .chl-tile,
body.chl .chl-bento > .chl-tile--award,
body.chl .chl-bento > .chl-tile--quote { grid-column: span 1; grid-row: span 2; }

body.chl .chl-tile__big .elementor-heading-title { font-size: 90px; }

body.chl .chl-tile__quote blockquote { font-size: 28px; }

body.chl .chl-tile--quote { padding: 30px; }

body.chl .chl-pola { width: 46%; padding: 8px 8px 30px; }

body.chl .chl-pola__cap .elementor-heading-title { font-size: 15px; }

body.chl .chl-faq__acc .e-n-accordion-item-title-text { font-size: 22px; }

body.chl .chl-faq__acc .e-n-accordion-item > .e-con { padding-right: 0; }

}