/* ==========================================================================
   Coffee House Lane — site-wide components
   Authoring note: every selector here is prefixed with `body.chl` at build
   time (see build.py) so it sits one notch above Elementor's base rules
   without !important.
   ========================================================================== */
/* ---------- layout primitives ---------- */

body.chl .chl-wrap { width: 100%; max-width: var(--chl-max); margin-inline: auto; padding-inline: var(--chl-pad); }

body.chl .chl-sec { position: relative; }

body.chl .chl-grain::after {
	content: ""; position: absolute; inset: 0; pointer-events: none; z-index: 0;
	opacity: .18; mix-blend-mode: overlay;
	background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='220' height='220'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3' stitchTiles='stitch'/></filter><rect width='100%' height='100%' filter='url(%23n)'/></svg>");
}

body.chl .chl-grain > .e-con { position: relative; z-index: 1; }

body.chl .elementor-widget-text-editor p:last-child { margin-bottom: 0; }

body.chl .elementor-widget-heading .elementor-heading-title { color: inherit; }

body.chl .elementor-widget-image img { display: block; }

/* ---------- type helpers ---------- */

body.chl .chl-eyebrow { margin-bottom: 14px; }

body.chl .chl-eyebrow .elementor-heading-title {
	display: flex; align-items: center; gap: 14px;
	font-family: var(--font-family-heading); font-style: italic; font-weight: 400;
	font-size: 22px; line-height: 1.2; color: var(--chl-copper);
}

body.chl .chl-eyebrow .elementor-heading-title::before { content: ""; width: 46px; height: 1px; background: currentColor; flex: none; }

body.chl .chl-eyebrow--center .elementor-heading-title { justify-content: center; }

body.chl .chl-h2 .elementor-heading-title {
	font-family: var(--font-family-heading); font-weight: 400;
	font-size: var(--text-h2); line-height: .92; letter-spacing: -.035em; margin: 0;
}

body.chl .chl-h2 em { color: var(--chl-copper); font-weight: 300; }

body.chl .chl-sec-head { flex-direction: row; justify-content: space-between; align-items: flex-end; gap: 40px; margin-bottom: 64px; }

body.chl .chl-sec-head > .e-con { width: auto; flex: 0 0 auto; max-width: 100%; }

body.chl .chl-sec-head > .chl-sec-head__text { flex: 0 1 420px; }

body.chl .chl-sec-head__text { max-width: 420px; font-size: 18px; color: rgba(14, 9, 7, .68); }

/* ---------- buttons ---------- */

body.chl .chl-btn .elementor-button,
body.chl .chl-form .elementor-field-type-submit .elementor-button {
	display: inline-flex; align-items: center; gap: 12px;
	padding: 17px 28px; border: 0; border-radius: var(--radius-pill);
	font-family: var(--font-family-base); font-weight: 600; font-size: 16px; line-height: 1.2;
	letter-spacing: 0; text-transform: none; white-space: nowrap;
	background: transparent; color: var(--chl-cream); fill: currentColor;
	transition: transform .25s, background-color .25s, color .25s;
}

body.chl .chl-btn .elementor-button:hover,
body.chl .chl-form .elementor-field-type-submit .elementor-button:hover { transform: translateY(-2px); }

body.chl .chl-btn .elementor-button-content-wrapper,
body.chl .chl-form .elementor-button-content-wrapper { display: flex; align-items: center; gap: 12px; flex-direction: row; }

body.chl .chl-btn .elementor-button-icon,
body.chl .chl-form .elementor-field-type-submit .elementor-button-icon {
	order: 2; flex: none; width: 30px; height: 30px; margin: 0; border-radius: 50%;
	display: grid; place-items: center; font-size: 13px;
	background: var(--chl-ink); color: var(--chl-copper-2); fill: currentColor;
	transition: transform .3s;
}

body.chl .chl-btn .elementor-button-icon svg,
body.chl .chl-form .elementor-button-icon svg { width: 13px; height: 13px; fill: currentColor; }

body.chl .chl-btn .elementor-button:hover .elementor-button-icon,
body.chl .chl-form .elementor-button:hover .elementor-button-icon { transform: rotate(-45deg); }

body.chl .chl-btn--copper .elementor-button { background: var(--chl-copper); color: var(--chl-ink); padding: 10px 10px 10px 26px; }

body.chl .chl-btn--copper .elementor-button:hover { color: var(--chl-ink); }

body.chl .chl-btn--ghost .elementor-button { border: 1px solid rgba(244, 234, 219, .35); color: var(--chl-cream); }

body.chl .chl-btn--ghost .elementor-button:hover { background: var(--chl-cream); color: var(--chl-ink); }

body.chl .chl-btn--ink .elementor-button { background: var(--chl-ink); color: var(--chl-cream); padding: 10px 10px 10px 26px; }

body.chl .chl-btn--ink .elementor-button:hover { color: var(--chl-cream); }

body.chl .chl-btn--ink .elementor-button-icon { background: var(--chl-copper); color: var(--chl-ink); }

body.chl .chl-btn--sm .elementor-button { padding: 8px 8px 8px 22px; font-size: 15px; }

/* Icon-only buttons (text kept for screen readers) */

body.chl .chl-iconbtn .elementor-button {
	width: 46px; height: 46px; padding: 0; border-radius: 50%;
	display: grid; place-items: center;
	background: transparent; color: var(--chl-cream); fill: currentColor;
	border: 1px solid rgba(244, 234, 219, .18);
	transition: border-color .2s, color .2s;
}

body.chl .chl-iconbtn .elementor-button:hover { border-color: var(--chl-copper-2); color: var(--chl-copper-2); }

body.chl .chl-iconbtn .elementor-button-content-wrapper { display: grid; place-items: center; }

body.chl .chl-iconbtn .elementor-button-icon { margin: 0; font-size: 18px; }

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

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

body.chl .chl-iconbtn--search {
	--e-search-form-toggle-size: 46px;
	--e-search-form-toggle-icon-size: 18px;
	--e-search-form-toggle-color: var(--chl-cream);
	--e-search-form-toggle-background-color: transparent;
	--e-search-form-toggle-border-width: 1px;
	--e-search-form-toggle-border-radius: 50%;
}

body.chl .chl-iconbtn--search .elementor-search-form__toggle div { border-color: rgba(244, 234, 219, .18); }

body.chl .chl-iconbtn--search .elementor-search-form__toggle:hover { --e-search-form-toggle-color: var(--chl-copper-2); }

body.chl .chl-iconbtn--search .elementor-search-form__container { background: rgba(14, 9, 7, .96); }

body.chl .chl-iconbtn--search .elementor-search-form__input {
	color: var(--chl-cream); font-family: var(--font-family-heading); font-size: clamp(32px, 5vw, 64px);
	border: 0; border-bottom: 1px solid rgba(244, 234, 219, .25); border-radius: 0;
}

/* WooCommerce menu cart (header) */

body.chl .chl-menucart {
	--items-indicator-background-color: var(--chl-ember);
	--items-indicator-text-color: #fff;
	--cart-background-color: var(--chl-ink-2);
	--cart-border-color: rgba(244, 234, 219, .12);
	--cart-close-icon-color: var(--chl-cream);
	--product-price-color: var(--chl-copper-2);
	--divider-color: rgba(244, 234, 219, .12);
	--subtotal-divider-color: rgba(244, 234, 219, .12);
	--cart-footer-layout: 1fr 1fr;
	--cart-buttons-border-radius: 999px;
	--view-cart-button-background-color: transparent;
	--view-cart-button-text-color: var(--chl-cream);
	--checkout-button-background-color: var(--chl-copper);
	--checkout-button-text-color: var(--chl-ink);
}

body.chl .chl-menucart .elementor-menu-cart__toggle .elementor-button {
	position: relative; width: 46px; height: 46px; padding: 0; border-radius: 50%;
	display: grid; place-items: center; background: transparent; color: var(--chl-cream); fill: currentColor;
	border: 1px solid rgba(244, 234, 219, .18); transition: border-color .2s, color .2s;
}

body.chl .chl-menucart .elementor-menu-cart__toggle .elementor-button:hover { border-color: var(--chl-copper-2); color: var(--chl-copper-2); }

body.chl .chl-menucart .elementor-menu-cart__toggle .elementor-button-text { display: none; }

body.chl .chl-menucart .elementor-menu-cart__toggle .elementor-button-icon { position: static; margin: 0; font-size: 19px; }

body.chl .chl-menucart .elementor-menu-cart__toggle .elementor-button-icon svg { width: 19px; height: 19px; fill: currentColor; }

body.chl .chl-menucart .elementor-menu-cart__toggle .elementor-button-icon-qty[data-counter] {
	top: -4px; right: -4px; inset-inline-end: -4px; min-width: 19px; height: 19px; line-height: 19px;
	font-family: var(--font-family-base); font-size: 11px; font-weight: 700;
}

body.chl .chl-menucart .elementor-menu-cart__main { color: var(--chl-cream); font-family: var(--font-family-base); }

body.chl .chl-menucart .elementor-menu-cart__product-name a { color: var(--chl-cream); font-weight: 600; }

body.chl .chl-menucart .elementor-menu-cart__footer-buttons .elementor-button { font-weight: 600; border: 1px solid rgba(244, 234, 219, .3); }

body.chl .chl-menucart .elementor-menu-cart__footer-buttons .elementor-button--checkout { border-color: var(--chl-copper); }

/* ---------- marquee ---------- */

body.chl .chl-marquee { overflow: hidden; white-space: nowrap; }

body.chl .chl-marquee__track { display: inline-flex; width: max-content; animation: chl-marq 40s linear infinite; }

body.chl .chl-marquee__group { display: inline-flex; align-items: center; flex: none; }

@keyframes chl-marq { to { transform: translateX(-50%); } }
/* ---------- header ---------- */

body.chl .chl-header { position: relative; z-index: 50; gap: 0; }

body.chl .chl-announce-wrap { width: 100%; }

body.chl .chl-announce {
	background: var(--chl-copper); color: var(--chl-ink);
	font-weight: 600; font-size: 13px; letter-spacing: .06em; text-transform: uppercase;
}

body.chl .chl-announce .chl-marquee__group { gap: 48px; padding: 9px 48px 9px 0; }

body.chl .chl-announce span::after { content: "✦"; margin-left: 48px; opacity: .6; }

body.chl .chl-nav-wrap { width: 100%; max-width: var(--chl-max); margin-inline: auto; padding: 13px var(--chl-pad) 0; }

body.chl .chl-nav {
	flex-direction: row; flex-wrap: nowrap; align-items: center; justify-content: space-between; gap: 24px;
	padding: 12px 14px 12px 28px;
	background: rgba(20, 13, 9, .55);
	-webkit-backdrop-filter: blur(14px); backdrop-filter: blur(14px);
	border: 1px solid rgba(244, 234, 219, .12); border-radius: var(--radius-pill);
	transition: background-color .3s, box-shadow .3s;
}

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

body.chl .chl-nav__logo img { height: 40px; width: auto; }

body.chl .chl-nav__menu { flex: 1 1 auto; }

body.chl .chl-nav__menu .elementor-nav-menu--main .elementor-nav-menu { justify-content: center; }

body.chl .chl-nav__menu .elementor-nav-menu--main .elementor-item {
	padding: 10px 15px; color: var(--chl-cream); opacity: .82;
	font-family: var(--font-family-base); font-size: 14px; font-weight: 600;
	letter-spacing: .08em; text-transform: uppercase;
	transition: opacity .2s, color .2s;
}

body.chl .chl-nav__menu .elementor-nav-menu--main .elementor-item:hover,
body.chl .chl-nav__menu .elementor-nav-menu--main .elementor-item:focus,
body.chl .chl-nav__menu .elementor-nav-menu--main .elementor-item.elementor-item-active { color: var(--chl-copper-2); opacity: 1; }

body.chl .chl-nav__menu .elementor-menu-toggle {
	width: 46px; height: 46px; border-radius: 50%; margin-left: auto;
	background: transparent; color: var(--chl-cream); fill: var(--chl-cream);
	border: 1px solid rgba(244, 234, 219, .18); font-size: 20px;
}

body.chl .chl-nav__menu .elementor-nav-menu--dropdown {
	background: var(--chl-ink-2); border: 1px solid rgba(244, 234, 219, .12); border-radius: 24px; margin-top: 14px; overflow: hidden;
}

body.chl .chl-nav__menu .elementor-nav-menu--dropdown a {
	color: var(--chl-cream); padding: 16px 28px; font-weight: 600; font-size: 15px; letter-spacing: .08em; text-transform: uppercase;
	border-bottom: 1px solid rgba(244, 234, 219, .08);
}

body.chl .chl-nav__menu .elementor-nav-menu--dropdown a:hover,
body.chl .chl-nav__menu .elementor-nav-menu--dropdown a.elementor-item-active { background: var(--chl-ink-3); color: var(--chl-copper-2); }

body.chl .chl-nav__actions { flex-direction: row; align-items: center; gap: 10px; width: auto; flex: none; }

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

/* Front page: header floats over the hero */

body.home .elementor-location-header { position: relative; z-index: 60; }

body.home .chl-header { position: absolute; inset-inline: 0; top: 0; }

/* Inner pages: solid header */

body.chl .chl-header { background: var(--chl-ink); padding-bottom: 13px; }

body.home .chl-header { background: transparent; padding-bottom: 0; }

/* Sticky state (toggled by global-scripts.js after 50px) */

body.chl .chl-header.is-stuck .chl-nav-wrap {
	position: fixed; z-index: 100; left: 0; right: 0;
	top: calc(var(--wp-admin--admin-bar--height, 0px) + 10px);
	padding-top: 0; animation: chl-drop .35s var(--ease-out);
}

body.chl .chl-header.is-stuck .chl-nav { background: rgba(14, 9, 7, .88); box-shadow: 0 18px 40px -18px rgba(0, 0, 0, .6); }

@keyframes chl-drop { from { transform: translateY(-120%); } to { transform: none; } }
/* ---------- forms ---------- */

body.chl .chl-form .elementor-field-group { margin-bottom: 0; }

body.chl .chl-form .elementor-message { font-size: 15px; margin-top: 14px; }

body.chl .chl-form .elementor-message.elementor-message-success { color: #5BE38B; }

body.chl .chl-form .elementor-message.elementor-message-danger,
body.chl .chl-form .elementor-error .elementor-field-textual { color: #FF9A7A; }

/* Neutralise the Form widget's default white field skin (its per-element rule is 0,6,0) */

body.chl .chl-form .elementor-field-group:not(.elementor-field-type-upload) .elementor-field:not(.elementor-select-wrapper) {
	background-color: transparent; border-color: rgba(244, 234, 219, .25); color: var(--chl-cream);
}

body.chl .chl-form .elementor-field-group .elementor-field-label { color: var(--chl-muted); }

/* Trade form (dark card) */

body.chl .chl-form--trade .elementor-form-fields-wrapper { row-gap: 14px; }

body.chl .chl-form--trade .elementor-field-group { padding-inline: 7px; }

body.chl .chl-form--trade .elementor-field-group .elementor-field-label {
	font-size: 13px; font-weight: 600; letter-spacing: .06em; text-transform: uppercase;
	color: var(--chl-muted); padding-bottom: 12px;
}

body.chl .chl-form--trade .elementor-field-type-text .elementor-field-label,
body.chl .chl-form--trade .elementor-field-type-tel .elementor-field-label,
body.chl .chl-form--trade .elementor-field-type-email .elementor-field-label {
	position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap;
}

body.chl .chl-form--trade .elementor-field-group:not(.elementor-field-type-upload) .elementor-field.elementor-field-textual {
	min-height: 0; padding: 16px 0 12px; font-size: 17px; color: var(--chl-cream);
	background: transparent; border: 0; border-bottom: 1px solid rgba(244, 234, 219, .25); border-radius: 0; box-shadow: none;
}

body.chl .chl-form--trade .elementor-field-group:not(.elementor-field-type-upload) .elementor-field.elementor-field-textual:focus { border-bottom-color: var(--chl-copper); box-shadow: none; }

body.chl .chl-form--trade .elementor-field-type-radio { margin-bottom: 14px; }

body.chl .chl-form--trade .elementor-field-subgroup { display: flex; flex-wrap: wrap; gap: 10px; }

body.chl .chl-form--trade .elementor-field-option { position: relative; display: block; margin: 0; }

body.chl .chl-form--trade .elementor-field-option input { position: absolute; inset: 0; opacity: 0; margin: 0; cursor: pointer; }

body.chl .chl-form--trade .elementor-field-option label {
	display: inline-block; margin: 0; padding: 11px 20px; cursor: pointer;
	border: 1px solid rgba(244, 234, 219, .2); border-radius: var(--radius-pill);
	font-weight: 600; font-size: 15px; line-height: 1.2; color: var(--chl-cream);
	transition: background-color .2s, border-color .2s, color .2s;
}

body.chl .chl-form--trade .elementor-field-option label:hover { border-color: var(--chl-copper-2); }

body.chl .chl-form--trade .elementor-field-option input:checked + label { background: var(--chl-copper); border-color: var(--chl-copper); color: var(--chl-ink); }

body.chl .chl-form--trade .elementor-field-option input:focus-visible + label { outline: 2px solid var(--chl-copper-2); outline-offset: 3px; }

body.chl .chl-form--trade .elementor-field-type-submit { margin-top: 20px; }

body.chl .chl-form--trade .elementor-field-type-submit .elementor-button {
	width: 100%; justify-content: space-between;
	background: var(--chl-copper); color: var(--chl-ink); padding: 10px 10px 10px 26px;
}

body.chl .chl-form--trade .elementor-field-type-submit .elementor-button-content-wrapper { width: 100%; justify-content: space-between; }

/* Newsletter pill */

body.chl .chl-form--news .elementor-form-fields-wrapper {
	flex-wrap: nowrap; align-items: center; gap: 10px; margin: 0;
	padding: 8px; background: var(--chl-ink); border-radius: var(--radius-pill);
}

body.chl .chl-form--news .elementor-field-group { width: auto; padding: 0; margin: 0; }

body.chl .chl-form--news .elementor-field-type-email { flex: 1 1 auto; }

body.chl .chl-form--news .elementor-field-group:not(.elementor-field-type-upload) .elementor-field.elementor-field-textual {
	min-height: 0; padding: 12px 20px; font-size: 16px; color: var(--chl-cream);
	background: transparent; border: 0; box-shadow: none;
}

body.chl .chl-form--news .elementor-field-textual::placeholder { color: var(--chl-cream); opacity: .5; }

body.chl .chl-form--news .elementor-field-type-submit .elementor-button { background: var(--chl-copper); color: var(--chl-ink); padding: 16px 26px; }

body.chl .chl-form--news .elementor-field-type-submit .elementor-button-icon { display: none; }

/* ---------- footer ---------- */

body.chl .chl-footer { background: var(--chl-ink); color: var(--chl-cream); padding-top: 90px; overflow: hidden; }

body.chl .chl-footer__cols { display: grid; grid-template-columns: 1.4fr 1fr 1fr 1fr; gap: 40px; padding-bottom: 70px; }

body.chl .chl-footer__h .elementor-heading-title {
	margin-bottom: 20px; font-family: var(--font-family-base); font-size: 13px; font-weight: 600;
	letter-spacing: .08em; text-transform: uppercase; color: var(--chl-muted);
}

body.chl .chl-footer__addr { font-size: 16px; line-height: 1.6; color: rgba(244, 234, 219, .75); }

body.chl .chl-footer__addr p { margin: 0; }

body.chl .chl-footer__addr a { display: block; }

body.chl .chl-footer__addr .chl-footer__phone {
	margin: 0 0 4px; font-family: var(--font-family-heading); font-size: 34px; letter-spacing: -.02em; color: var(--chl-cream);
}

body.chl .chl-footer__addr address { font-style: normal; }

body.chl .chl-footer__links .elementor-icon-list-items { display: grid; gap: 10px; }

body.chl .chl-footer__links .elementor-icon-list-item { padding: 0; margin: 0; }

body.chl .chl-footer__links .elementor-icon-list-item::after { display: none; }

body.chl .chl-footer__links .elementor-icon-list-text { color: var(--chl-cream); font-size: 16px; padding: 0; transition: color .2s; }

body.chl .chl-footer__links a:hover .elementor-icon-list-text { color: var(--chl-copper-2); }

body.chl .chl-footer__links .elementor-icon-list-icon { display: none; }

body.chl .chl-footer__brand { align-items: center; gap: 14px; padding-block: 50px 44px; border-top: 1px solid rgba(244, 234, 219, .1); }

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

body.chl .chl-footer__logo img { height: 86px; width: auto; }

body.chl .chl-footer__tag .elementor-heading-title { font-family: var(--font-family-heading); font-style: italic; font-size: 18px; color: var(--chl-copper-2); }

body.chl .chl-footer__legal {
	flex-direction: row; justify-content: space-between; gap: 20px; flex-wrap: wrap;
	padding-block: 24px; border-top: 1px solid rgba(244, 234, 219, .1);
	font-size: 14px; color: var(--chl-muted);
}

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

/* ---------- responsive ---------- */
@media (max-width: 1024px) { 
body.chl .chl-sec-head { flex-direction: column; align-items: flex-start; }

body.chl .chl-nav { padding: 10px 10px 10px 22px; gap: 12px; }

body.chl .chl-nav__menu { order: 3; flex: none; }

body.chl .chl-nav__actions { margin-left: auto; }

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

}

@media (max-width: 767px) { 
body.chl .chl-sec-head { margin-bottom: 40px; gap: 20px; }

body.chl .chl-nav__logo img { height: 32px; }

body.chl .chl-iconbtn--search,
body.chl .chl-iconbtn--account,
body.chl .chl-nav__cta { display: none; }

body.chl .chl-footer { padding-top: 64px; }

body.chl .chl-footer__cols { grid-template-columns: 1fr; gap: 36px; padding-bottom: 48px; }

body.chl .chl-footer__legal { flex-direction: column; }

body.chl .chl-form--trade .elementor-field-group.elementor-col-50 { width: 100%; }

}