/*
Theme Name: Livin Child
Template: hello-elementor
Description: Livin look (rebuilt from the livinjourney.com staging design) on top of Hello Elementor, with a Hume devices shop.
Version: 1.1.0
Text Domain: livin-child
*/

/* ---------- Theme tokens (light is the default; dark is set by assets/livin.js on <html data-theme>) ---------- */
:root {
	color-scheme: light;
	--livin-deep: #341d74;        /* brand dark purple, used for filled buttons and badges */
	--livin-purple: #653780;      /* brand purple (livinjourney.com) */
	--livin-plum: #8e3870;
	--livin-pink: #d14172;
	--livin-grad: linear-gradient(90deg, #653780 0%, #d14172 100%);
	--livin-grad-radial: radial-gradient(at 0% 50%, #653780 0%, #d14172 100%);
	--livin-grad-text: linear-gradient(90deg, #8e3870 0%, #d14172 100%);
	--livin-ink: #341d74;         /* brand-coloured text */
	--livin-icon: #653780;
	--livin-heading: #000;        /* big display headings */
	--livin-text: #341d74;
	--livin-bg: #fff;
	--livin-surface: #fff;        /* cards, menus, inputs */
	--livin-surface-2: #fbf9fd;   /* subtle panels */
	--livin-header-bg: rgba(255, 255, 255, .92);
	--livin-chip: #f3eef0;
	--livin-border: #e7e1ee;
	--livin-blush: rgba(243, 154, 139, .15);
	--livin-mist: rgba(150, 144, 162, .06);
	--livin-sky: rgba(0, 58, 252, .05);
	--livin-lilac: #f4effb;
	--livin-shadow: rgba(52, 29, 116, .08);
	--livin-shadow-strong: rgba(52, 29, 116, .14);
	--livin-radius: 8px;
	--livin-pill: 36px;
}
:root[data-theme="dark"] {
	color-scheme: dark;
	--livin-purple: #8f55b3;
	--livin-grad-radial: radial-gradient(at 0% 50%, #3a1f55 0%, #6e2446 100%);
	--livin-grad-text: linear-gradient(90deg, #c77fb0 0%, #f07aa0 100%);
	--livin-ink: #d6c8f7;
	--livin-icon: #c9a6e6;
	--livin-heading: #fff;
	--livin-text: #e4dcf3;
	--livin-bg: #120d1f;
	--livin-surface: #1c1530;
	--livin-surface-2: #221a39;
	--livin-header-bg: rgba(18, 13, 31, .9);
	--livin-chip: #2b2246;
	--livin-border: #3a2f57;
	--livin-blush: rgba(243, 154, 139, .08);
	--livin-mist: rgba(255, 255, 255, .03);
	--livin-sky: rgba(120, 140, 255, .07);
	--livin-lilac: #261d40;
	--livin-shadow: rgba(0, 0, 0, .35);
	--livin-shadow-strong: rgba(0, 0, 0, .5);
}

body {
	font-family: "DM Sans", sans-serif;
	color: var(--livin-text);
	background: var(--livin-bg);
	margin: 0;
	transition: background-color .2s ease, color .2s ease;
}
body.livin-drawer-open { overflow: hidden; }

h1, h2, h3, h4, h5, h6,
.elementor-heading-title {
	font-family: "Poppins", "DM Sans", sans-serif;
	font-weight: 600;
	color: var(--livin-ink);
}

a { color: var(--livin-purple); }

/* Gradient text accent, as on livinjourney.com ("with Livin.") */
.livin-grad-text {
	background: var(--livin-grad-text); -webkit-background-clip: text; background-clip: text;
	color: transparent !important; -webkit-text-fill-color: transparent;
}
:root[data-theme="dark"] a { color: var(--livin-icon); }

/* ---------- Buttons ---------- */
.livin-btn,
.elementor-button,
.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button,
.woocommerce #respond input#submit,
.wc-block-components-button {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	background: var(--livin-purple) !important;
	color: #fff !important;
	border: 1px solid var(--livin-purple) !important;
	border-radius: var(--livin-pill) !important;
	font-family: "DM Sans", sans-serif;
	font-weight: 600;
	font-size: 15px;
	padding: 12px 24px;
	text-decoration: none;
	line-height: 1.2;
	transition: background .2s, color .2s;
}
.livin-btn:hover,
.elementor-button:hover,
.woocommerce a.button:hover,
.woocommerce button.button:hover {
	background: var(--livin-deep) !important;
	border-color: var(--livin-deep) !important;
}
.livin-btn--dark { background: var(--livin-purple) !important; border-color: var(--livin-purple) !important; box-shadow: 0 4px 14px rgba(101, 55, 128, .35); }
:root[data-theme="dark"] .livin-btn--dark { border-color: var(--livin-border) !important; }
.livin-btn--ghost { background: transparent !important; color: var(--livin-plum) !important; border: 2px solid var(--livin-pink) !important; }
:root[data-theme="dark"] .livin-btn--ghost { color: #f07aa0 !important; }
.livin-btn--ghost:hover { background: var(--livin-deep) !important; border-color: var(--livin-deep) !important; color: #fff !important; }

/* ---------- Top bar + header ---------- */
.livin-topbar {
	background: var(--livin-grad);
	color: #fff;
	font-size: 14px;
	padding: 8px 32px;
}
.livin-topbar { display: flex; align-items: center; justify-content: space-between; gap: 16px; }
.livin-topbar a { color: #fff !important; text-decoration: none; }
.livin-topbar__links a + a { border-left: 1px solid rgba(255, 255, 255, .5); margin-left: 8px; padding-left: 8px; }

/* Social icons: round outlined buttons */
.livin-social { display: flex; flex-wrap: wrap; gap: 8px; }
.livin-social__link {
	display: grid; place-items: center; width: 40px; height: 40px; border-radius: 50%;
	border: 1px solid var(--livin-border); background: var(--livin-surface); color: var(--livin-ink) !important;
	transition: background .2s, color .2s, border-color .2s, transform .2s;
}
.livin-social__link:hover, .livin-social__link:focus-visible { background: var(--livin-grad); border-color: transparent; color: #fff !important; transform: translateY(-2px); }
.livin-social--topbar { gap: 6px; }
.livin-social--topbar .livin-social__link { width: 28px; height: 28px; border-color: rgba(255, 255, 255, .55); background: transparent; color: #fff !important; }
.livin-social--topbar .livin-social__link svg { width: 14px; height: 14px; }
.livin-social--topbar .livin-social__link:hover { background: #fff; color: var(--livin-purple) !important; }
.livin-social--footer { margin-top: 20px; }
.livin-social--footer .livin-social__link { border-color: rgba(255, 255, 255, .5); background: transparent; color: #fff !important; }
.livin-social--footer .livin-social__link:hover { background: #fff; color: var(--livin-purple) !important; }
.livin-social--drawer { margin-top: 16px; }

.livin-header {
	position: sticky;
	top: 0;
	z-index: 50;
	display: flex;
	align-items: center;
	gap: 16px;
	padding: 14px 32px;
	background: var(--livin-header-bg);
	backdrop-filter: blur(8px);
}
.admin-bar .livin-header { top: 32px; }
.livin-round-btn,
.livin-header__burger {
	width: 50px; height: 50px; border-radius: 50%;
	background: var(--livin-chip); color: var(--livin-ink);
	display: grid; place-items: center;
	border: 0; padding: 0; cursor: pointer; flex: none;
}
/* Hello Elementor paints buttons pink on hover/focus; keep ours on-brand. */
.livin-round-btn:hover, .livin-round-btn:focus,
.livin-header__burger:hover, .livin-header__burger:focus { background: var(--livin-chip); color: var(--livin-ink); }
.livin-theme-switch button:hover, .livin-theme-switch button:focus { background: transparent; color: var(--livin-ink); }
.livin-theme-switch button[aria-pressed="true"]:hover, .livin-theme-switch button[aria-pressed="true"]:focus { background: var(--livin-surface); }
.livin-round-btn:focus-visible,
.livin-header__burger:focus-visible { outline: 2px solid var(--livin-purple); outline-offset: 2px; }
.livin-header__burger span,
.livin-header__burger span::before {
	display: block; width: 20px; height: 2px; background: currentColor; border-radius: 2px; position: relative;
}
.livin-header__burger span::before { content: ""; position: absolute; top: 7px; width: 12px; }
.livin-header__logo { flex: none; }
.livin-header__logo img { display: block; height: 44px; width: auto; max-width: none; }

/* Logo swap: purple logo on light, white logo on dark */
.livin-logo--dark { display: none !important; }
:root[data-theme="dark"] .livin-logo--light { display: none !important; }
:root[data-theme="dark"] .livin-logo--dark { display: block !important; }

.livin-nav { flex: 1; display: flex; justify-content: flex-start; }
.livin-nav > ul {
	display: flex; gap: 6px; list-style: none; margin: 0; padding: 6px 12px;
	background: var(--livin-chip); border-radius: 30px; counter-reset: livin-nav;
}
.livin-nav li { position: relative; }
.livin-nav > ul > li > a {
	display: block; padding: 8px 10px; color: var(--livin-ink); font-weight: 500; font-size: 15px; text-decoration: none; white-space: nowrap;
}
.livin-nav > ul > li > a::after {
	counter-increment: livin-nav;
	content: counter(livin-nav, decimal-leading-zero);
	font-size: 9px; position: relative; top: -10px; margin-left: 2px;
}
.livin-nav .sub-menu {
	display: none; position: absolute; top: 100%; left: 0; min-width: 220px; list-style: none; margin: 0; padding: 10px 0;
	background: var(--livin-surface); border-radius: 12px; box-shadow: 0 12px 30px var(--livin-shadow-strong);
}
.livin-nav li:hover > .sub-menu,
.livin-nav li:focus-within > .sub-menu { display: block; }
.livin-nav .sub-menu a { display: block; padding: 8px 18px; color: var(--livin-ink); text-decoration: none; }
.livin-nav .sub-menu a:hover { background: var(--livin-chip); }
.livin-nav .current-menu-item > a { color: var(--livin-purple); }

.livin-header__actions { display: flex; align-items: center; gap: 10px; }
.livin-header__actions .livin-btn { padding: 10px 16px; white-space: nowrap; }
.livin-cart {
	position: relative; display: grid; place-items: center; width: 44px; height: 44px; border-radius: 50%;
	background: var(--livin-chip); color: var(--livin-ink) !important; text-decoration: none;
}
.livin-cart__count {
	position: absolute; top: -2px; right: -2px; min-width: 18px; height: 18px; padding: 0 4px; border-radius: 9px;
	background: var(--livin-purple); color: #fff; font-size: 11px; display: grid; place-items: center;
}
.livin-currency-label {
	display: inline-flex; align-items: center; height: 44px; padding: 0 14px; border-radius: 22px;
	background: var(--livin-chip); color: var(--livin-ink); font: 600 14px "DM Sans", sans-serif; cursor: default;
}
.livin-currency .wcml-dropdown { width: auto; min-width: 0; margin: 0; }
.livin-currency .wcml-dropdown ul { margin: 0; padding: 0; list-style: none; }
.livin-currency .wcml-dropdown li { border: 0; background: none; }
.livin-currency .wcml-dropdown button,
.livin-currency .wcml-dropdown .wcml-cs-item-toggle {
	display: block; width: 100%; border: 0; background: var(--livin-chip); color: var(--livin-ink);
	border-radius: var(--livin-radius); padding: 11px 30px 11px 14px; font: 600 14px "DM Sans", sans-serif; cursor: pointer; text-align: left;
}
.livin-currency .wcml-dropdown .wcml-cs-submenu {
	border: 0; border-radius: var(--livin-radius); box-shadow: 0 12px 30px var(--livin-shadow-strong); overflow: hidden; background: var(--livin-surface);
}
.livin-currency .wcml-dropdown .wcml-cs-submenu button { background: var(--livin-surface); border-radius: 0; }
.livin-currency .wcml-dropdown .wcml-cs-submenu button:hover { background: var(--livin-chip); }

/* Theme toggle in the header: one icon per preference */
/* Light/dark switch (pill track, round knob with sun → moon) */
.livin-theme-switch-toggle {
	/* 66×36 track, 28px knob, 4px gap on every side; the outline is an inset shadow (a transparent
	   border would let the gradient repeat underneath it and show seams at the edges). */
	position: relative; flex: none; box-sizing: border-box; width: 66px; height: 36px; margin: 0; padding: 0; border: 0;
	border-radius: 18px; cursor: pointer; overflow: hidden;
	background: var(--livin-chip); box-shadow: inset 0 0 0 1px var(--livin-border); transition: background .25s ease, box-shadow .25s ease;
}
.livin-theme-switch-toggle[aria-checked="false"]:hover,
.livin-theme-switch-toggle[aria-checked="false"]:focus { background: var(--livin-chip); }
.livin-theme-switch-toggle:focus-visible { outline: 2px solid var(--livin-purple); outline-offset: 2px; }
.livin-theme-switch-toggle__knob {
	position: absolute; top: 4px; left: 4px; width: 28px; height: 28px; border-radius: 50%; display: grid; place-items: center;
	background: #fff; color: #f0a35e; box-shadow: 0 2px 6px rgba(0, 0, 0, .18); transition: transform .25s ease, background .25s ease, color .25s ease;
}
.livin-theme-switch-toggle .i-dark { display: none; }
.livin-theme-switch-toggle[aria-checked="true"],
.livin-theme-switch-toggle[aria-checked="true"]:hover,
.livin-theme-switch-toggle[aria-checked="true"]:focus { background: var(--livin-grad); box-shadow: none; }
.livin-theme-switch-toggle[aria-checked="true"] .livin-theme-switch-toggle__knob { transform: translateX(30px); background: #1c1530; color: #f3e9ff; }
.livin-theme-switch-toggle[aria-checked="true"] .i-light { display: none; }
.livin-theme-switch-toggle[aria-checked="true"] .i-dark { display: block; }

/* ---------- Side drawer (opened by the burger) ---------- */
.livin-drawer-overlay {
	position: fixed; inset: 0; z-index: 998; background: rgba(10, 6, 20, .45);
	opacity: 0; visibility: hidden; transition: opacity .25s ease, visibility .25s;
}
.livin-drawer {
	position: fixed; top: 0; bottom: 0; left: 0; z-index: 999; width: min(380px, 88vw);
	background: var(--livin-surface); color: var(--livin-text); box-shadow: 12px 0 40px var(--livin-shadow-strong);
	transform: translateX(-100%); visibility: hidden; transition: transform .3s ease, visibility .3s;
	display: flex; flex-direction: column; overflow-y: auto; padding: 20px 24px 28px; box-sizing: border-box;
}
.admin-bar .livin-drawer { top: 32px; }
body.livin-drawer-open .livin-drawer { transform: none; visibility: visible; }
body.livin-drawer-open .livin-drawer-overlay { opacity: 1; visibility: visible; }
.livin-drawer__top { display: flex; align-items: center; justify-content: space-between; margin-bottom: 20px; }
.livin-drawer__top img { height: 40px; width: auto; }
.livin-drawer__close { width: 44px; height: 44px; font-size: 26px; line-height: 1; }
.livin-drawer__menu, .livin-drawer__menu .sub-menu { list-style: none; margin: 0; padding: 0; }
.livin-drawer__menu > li { border-bottom: 1px solid var(--livin-border); padding: 10px 0; }
.livin-drawer__menu > li > a { display: block; font-size: 19px; font-weight: 600; color: var(--livin-ink); text-decoration: none; padding: 4px 0; }
.livin-drawer__menu .sub-menu { padding: 4px 0 4px 12px; }
.livin-drawer__menu .sub-menu a { display: block; padding: 5px 0; color: var(--livin-text); opacity: .85; text-decoration: none; font-size: 15px; }
.livin-drawer__menu a:hover { color: var(--livin-purple); opacity: 1; }
.livin-drawer__actions { display: grid; gap: 10px; margin: 24px 0; }
.livin-drawer__actions .livin-btn { justify-content: center; }
.livin-drawer__label { font-size: 13px; font-weight: 600; letter-spacing: .1em; text-transform: uppercase; color: var(--livin-purple); margin: 0 0 8px; }
:root[data-theme="dark"] .livin-drawer__label { color: var(--livin-icon); }
.livin-theme-switch { display: grid; grid-template-columns: repeat(3, 1fr); gap: 4px; padding: 4px; border-radius: 12px; background: var(--livin-chip); }
.livin-theme-switch button {
	display: flex; align-items: center; justify-content: center; gap: 6px; border: 0; border-radius: 9px; padding: 9px 6px;
	background: transparent; color: var(--livin-ink); font: 600 14px "DM Sans", sans-serif; cursor: pointer;
}
.livin-theme-switch button[aria-pressed="true"] { background: var(--livin-surface); box-shadow: 0 2px 8px var(--livin-shadow); }
.livin-drawer__links { margin-top: auto; padding-top: 24px; display: flex; gap: 16px; font-size: 14px; }

/* ---------- Footer ---------- */
.livin-footer { background: var(--livin-purple); color: #fff; padding: 64px 32px 24px; }
:root[data-theme="dark"] .livin-footer { background: #241339; }
.livin-footer a { color: #fff !important; text-decoration: none; opacity: .9; }
.livin-footer a:hover { opacity: 1; text-decoration: underline; }
.livin-footer h3 { color: #fff; font-size: 16px; margin: 0 0 16px; }
.livin-footer__grid { display: grid; grid-template-columns: 1.3fr 1fr 1fr 1.3fr; gap: 40px; max-width: 1240px; margin: 0 auto; }
.livin-footer ul { list-style: none; margin: 0 0 20px; padding: 0; display: grid; gap: 10px; }
.livin-footer__brand img { height: 48px; margin-bottom: 16px; }
.livin-footer__brand p { margin: 0; line-height: 1.6; }
.livin-footer__news form { display: flex; background: #fff; border-radius: var(--livin-radius); overflow: hidden; }
.livin-footer__news input { flex: 1; border: 0; padding: 12px; font-family: inherit; min-width: 0; background: #fff; color: #341d74; }
.livin-footer__news button { border: 0; background: #fff; color: #341d74; font-weight: 600; padding: 0 16px; cursor: pointer; }
.livin-footer__bottom {
	max-width: 1240px; margin: 56px auto 0; display: flex; justify-content: space-between; gap: 16px; flex-wrap: wrap; font-size: 14px;
}

/* ---------- Home sections (classes are set on Elementor containers) ---------- */
.livin-hero { background: var(--livin-blush); }
.livin-hero h1 { font-size: clamp(40px, 6vw, 66px); line-height: 1.05; color: var(--livin-heading); margin: 0; }
.livin-showreel { display: inline-flex; align-items: center; gap: 12px; color: var(--livin-ink) !important; font-weight: 600; text-decoration: none; }
.livin-showreel span {
	width: 50px; height: 50px; border-radius: 50%; background: var(--livin-grad); display: grid; place-items: center;
}
.livin-showreel span::before {
	content: ""; border-left: 14px solid #fff; border-top: 9px solid transparent; border-bottom: 9px solid transparent; margin-left: 4px;
}
.livin-hero img { border-radius: 4px; }

.livin-cards { background: linear-gradient(var(--livin-blush) 30%, var(--livin-bg) 30%); }
/* The three photo cards sit one container deeper (section > row > card), so target them through the row. */
.livin-cards .e-con-inner > .e-con:has(> .livin-card) { gap: 18px !important; }
.livin-card {
	position: relative; overflow: hidden !important; min-height: 380px !important; border-radius: 22px !important;
	justify-content: flex-end !important; box-shadow: 0 18px 40px rgba(20, 10, 35, .25);
}
/* Darken the lower half so the text always reads, whatever the photo. */
.livin-card::before {
	content: "" !important; position: absolute; inset: 0; z-index: 0; opacity: 1 !important; /* Elementor resets a container's ::before */
	background: linear-gradient(180deg, rgba(20, 10, 35, .2) 0%, rgba(20, 10, 35, .55) 45%, rgba(20, 10, 35, .92) 100%);
}
.livin-card > * { position: relative; z-index: 1; }
.livin-card h3, .livin-card p { color: #fff !important; text-shadow: 0 1px 12px rgba(0, 0, 0, .35); }
.livin-card h3, .livin-card .elementor-heading-title { font-size: 26px; margin: 0; }
.livin-card p { font-size: 16px; line-height: 1.55; margin: 0; opacity: .95; }

.livin-why { background: var(--livin-sky); }
.livin-audience .elementor-icon-box-icon .elementor-icon {
	background: var(--livin-chip); border-radius: 50%; padding: 13px; font-size: 24px; color: var(--livin-icon);
}
.livin-audience .elementor-icon-box-icon .elementor-icon svg { fill: var(--livin-icon); }
.livin-audience .elementor-icon-box-title { font-size: 22px; }
.livin-audience .elementor-icon:has(.livin-emoji) {
	width: 64px; height: 64px; padding: 0; display: grid; place-items: center;
	background: linear-gradient(145deg, var(--livin-blush), var(--livin-lilac)); box-shadow: inset 0 0 0 1px var(--livin-border);
}
.livin-emoji { font-size: 32px; line-height: 1; font-family: "Apple Color Emoji", "Segoe UI Emoji", "Noto Color Emoji", sans-serif; }
.elementor-widget-text-editor, .elementor-icon-box-description { color: var(--livin-text); }
.elementor-heading-title { color: var(--livin-ink); }
.livin-hero .elementor-heading-title { color: var(--livin-heading); }

.livin-hume { background: var(--livin-mist); }
.livin-eyebrow { text-transform: uppercase; letter-spacing: .12em; font-size: 13px; font-weight: 600; color: var(--livin-purple); }
:root[data-theme="dark"] .livin-eyebrow { color: var(--livin-icon); }

/* ---------- WooCommerce ---------- */
.woocommerce ul.products li.product,
.woocommerce-page ul.products li.product {
	background: var(--livin-surface); border-radius: 16px; padding: 16px; box-shadow: 0 6px 24px var(--livin-shadow);
}
.woocommerce ul.products li.product .woocommerce-loop-product__title { color: var(--livin-ink); font-size: 17px; font-weight: 600; }
.woocommerce ul.products li.product .price,
.woocommerce div.product p.price,
.woocommerce div.product span.price { color: var(--livin-purple); font-weight: 700; font-size: 18px; }
:root[data-theme="dark"] .woocommerce ul.products li.product .price,
:root[data-theme="dark"] .woocommerce div.product p.price,
:root[data-theme="dark"] .woocommerce div.product span.price { color: var(--livin-icon); }
.woocommerce span.onsale { background: var(--livin-purple); border-radius: 20px; min-height: auto; line-height: 1; padding: 8px 10px; }
.woocommerce .woocommerce-breadcrumb { color: var(--livin-text); }
.woocommerce .woocommerce-breadcrumb a { color: var(--livin-purple); }
.livin-shop-hero { background: var(--livin-blush); padding: 56px 32px; text-align: center; margin-bottom: 40px; }
.livin-shop-hero h1 { margin: 6px 0 10px; font-size: clamp(32px, 5vw, 52px); color: var(--livin-heading); }
.livin-shop-hero p { max-width: 640px; margin: 0 auto; }
.woocommerce .site-main, .woocommerce-page .site-main { padding-bottom: 64px; }

/* Form fields, tabs and notices follow the theme too */
:root[data-theme="dark"] .woocommerce input.input-text,
:root[data-theme="dark"] .woocommerce select,
:root[data-theme="dark"] .woocommerce textarea,
:root[data-theme="dark"] .woocommerce .quantity .qty,
:root[data-theme="dark"] .woocommerce-ordering select,
:root[data-theme="dark"] .wc-block-components-text-input input,
:root[data-theme="dark"] .wc-block-components-textarea,
:root[data-theme="dark"] .wc-blocks-components-select .wc-blocks-components-select__select,
:root[data-theme="dark"] .wc-block-components-combobox .wc-block-components-combobox-control input {
	background-color: var(--livin-surface) !important; color: var(--livin-text) !important; border-color: var(--livin-border) !important;
}
:root[data-theme="dark"] .wc-block-components-text-input label,
:root[data-theme="dark"] .wc-blocks-components-select__label,
:root[data-theme="dark"] .wc-block-components-combobox label { color: var(--livin-text) !important; opacity: .8; }
:root[data-theme="dark"] .wc-block-components-radio-control__option,
:root[data-theme="dark"] .wc-block-components-radio-control-accordion-option,
:root[data-theme="dark"] .wc-block-components-order-summary,
:root[data-theme="dark"] .wc-block-components-totals-wrapper,
:root[data-theme="dark"] .wc-block-components-panel { border-color: var(--livin-border) !important; color: var(--livin-text); }
:root[data-theme="dark"] .woocommerce div.product .woocommerce-tabs ul.tabs li {
	background: var(--livin-chip); border-color: var(--livin-border);
}
:root[data-theme="dark"] .woocommerce div.product .woocommerce-tabs ul.tabs li.active { background: var(--livin-bg); border-bottom-color: var(--livin-bg); }
:root[data-theme="dark"] .woocommerce div.product .woocommerce-tabs ul.tabs li a { color: var(--livin-text); }
:root[data-theme="dark"] .woocommerce div.product .woocommerce-tabs ul.tabs::before,
:root[data-theme="dark"] .woocommerce div.product .woocommerce-tabs ul.tabs li::before,
:root[data-theme="dark"] .woocommerce div.product .woocommerce-tabs ul.tabs li::after { border-color: var(--livin-border); box-shadow: none; }
:root[data-theme="dark"] .woocommerce-message,
:root[data-theme="dark"] .woocommerce-info,
:root[data-theme="dark"] .woocommerce-error { background: var(--livin-surface-2); color: var(--livin-text); }

/* ---------- Livin presentation of Hume products ---------- */
.woocommerce ul.products li.product {
	position: relative; display: flex; flex-direction: column; text-align: left;
	transition: transform .2s ease, box-shadow .2s ease;
}
.woocommerce ul.products li.product:hover { transform: translateY(-4px); box-shadow: 0 14px 34px var(--livin-shadow-strong); }
.woocommerce ul.products li.product a img {
	border-radius: 12px;
	background: linear-gradient(160deg, var(--livin-blush) 0%, var(--livin-lilac) 55%, var(--livin-sky) 100%);
	padding: 12px; box-sizing: border-box; aspect-ratio: 1; object-fit: contain;
}
.woocommerce ul.products li.product .button { margin-top: auto; align-self: flex-start; }
.livin-badge {
	position: absolute; top: 26px; left: 26px; z-index: 2;
	background: var(--livin-deep); color: #fff; font-size: 11px; font-weight: 600; letter-spacing: .04em;
	padding: 5px 10px; border-radius: 20px;
}
.woocommerce span.onsale { top: 22px; right: 22px; left: auto; margin: 0; }
.livin-card-line {
	display: block; margin: 4px 0 -4px; font-size: 12px; font-weight: 600; letter-spacing: .1em; text-transform: uppercase; color: var(--livin-purple);
}
:root[data-theme="dark"] .livin-card-line { color: var(--livin-icon); }
.woocommerce ul.products li.product .woocommerce-loop-product__title { padding-top: 8px; }
.livin-works-with {
	display: inline-flex; align-items: center; gap: 6px; margin: 2px 0 14px; font-size: 13px; color: var(--livin-icon);
}
.livin-works-with .livin-icon { width: 15px; height: 15px; }

.woocommerce div.product div.images .woocommerce-product-gallery__image,
.woocommerce div.product div.images img {
	border-radius: 20px;
}
.woocommerce div.product div.images {
	background: linear-gradient(160deg, var(--livin-blush) 0%, var(--livin-lilac) 55%, var(--livin-sky) 100%);
	border-radius: 24px; padding: 24px; box-sizing: border-box; position: relative;
}
.woocommerce div.product div.images::after {
	content: ""; position: absolute; right: 22px; bottom: 18px; width: 60px; height: 38px; opacity: .55;
	background: url("/wp-content/themes/livin-child/assets/logo.svg") no-repeat center / contain; pointer-events: none;
}
:root[data-theme="dark"] .woocommerce div.product div.images::after { background-image: url("/wp-content/themes/livin-child/assets/logo-white.svg"); }
.woocommerce div.product .product_title { font-size: clamp(30px, 4vw, 44px); line-height: 1.1; color: var(--livin-heading); margin-bottom: 8px; }
.livin-product-eyebrow { margin-bottom: 6px; }

.livin-benefits { list-style: none; margin: 22px 0; padding: 0; display: grid; gap: 12px; }
.livin-benefits li {
	display: flex; gap: 12px; align-items: flex-start; padding: 12px 14px; border-radius: 12px; background: var(--livin-mist);
}
:root[data-theme="dark"] .livin-benefits li { background: var(--livin-surface); }
.livin-benefits .livin-icon {
	flex: none; width: 36px; height: 36px; padding: 8px; box-sizing: border-box; border-radius: 50%; background: var(--livin-chip); color: var(--livin-icon);
}
.livin-benefits strong { display: block; color: var(--livin-ink); }
.livin-benefits span { font-size: 14px; }

/* Product page reading sizes, and contrast in dark mode */
.woocommerce div.product p.price, .woocommerce div.product span.price { font: 600 28px/1.2 "Poppins", sans-serif; margin: 10px 0 14px; }
.woocommerce div.product p.price del { font-size: 18px; font-weight: 500; opacity: .6; margin-inline-end: 8px; }
.woocommerce div.product p.price ins { text-decoration: none; }
.woocommerce div.product .woocommerce-product-details__short-description { font-size: 18px; line-height: 1.7; }
.woocommerce div.product .woocommerce-product-details__short-description p { margin: 0 0 8px; }
.livin-benefits strong { font: 600 17px/1.35 "Poppins", sans-serif; margin-bottom: 3px; }
.livin-benefits span { font-size: 15px; line-height: 1.55; }
.woocommerce .woocommerce-breadcrumb { font-size: 14px; }
.woocommerce div.product .product_meta { font-size: 14px; display: grid; gap: 4px; margin-top: 18px; }
.woocommerce div.product .woocommerce-tabs .panel { font-size: 17px; line-height: 1.75; }
:root[data-theme="dark"] .woocommerce .woocommerce-breadcrumb a,
:root[data-theme="dark"] .woocommerce div.product .product_meta a { color: var(--livin-icon); }
:root[data-theme="dark"] .livin-benefits li { box-shadow: inset 0 0 0 1px var(--livin-border); }
/* Hume's artwork is dark on transparent, so product pictures keep a light panel in dark mode too */
:root[data-theme="dark"] .woocommerce div.product div.images,
:root[data-theme="dark"] .woocommerce ul.products li.product a img { background: linear-gradient(160deg, #f7eff6 0%, #efe8f8 55%, #e8eef8 100%); }
:root[data-theme="dark"] .woocommerce div.product div.images::after { background-image: url("/wp-content/themes/livin-child/assets/logo.svg"); }

.livin-how { clear: both; margin: 48px 0; padding: 40px 32px; border-radius: 24px; background: var(--livin-blush); }
.livin-how ol { list-style: none; margin: 16px 0 0; padding: 0; display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; }
.livin-how li { position: relative; background: var(--livin-surface); border-radius: 16px; padding: 24px; display: grid; gap: 8px; }
.livin-how li .livin-icon { width: 28px; height: 28px; color: var(--livin-purple); }
:root[data-theme="dark"] .livin-how li .livin-icon { color: var(--livin-icon); }
.livin-how strong { font-size: 18px; color: var(--livin-ink); }
.livin-how__num { position: absolute; top: 18px; right: 20px; font-size: 13px; font-weight: 700; color: var(--livin-purple); opacity: .6; }
@media (max-width: 767px) {
	.livin-how { padding: 28px 16px; }
	.livin-how ol { grid-template-columns: 1fr; }
}

/* ---------- Payment logos (logos keep a white chip so they stay legible in both themes) ---------- */
.livin-pay-logos { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.livin-pay-logo {
	width: 56px; height: 32px; padding: 5px 8px; box-sizing: border-box;
	background: #fff; border: 1px solid var(--livin-border); border-radius: 6px; object-fit: contain;
}
.livin-pay-box {
	margin: 20px 0; padding: 16px; border: 1px solid var(--livin-border); border-radius: 12px; background: var(--livin-surface-2);
}
.livin-pay-box__title { display: flex; align-items: center; gap: 6px; font-weight: 600; margin-bottom: 10px; color: var(--livin-ink); }
.livin-pay-box__later { margin: 12px 0 0; font-size: 14px; }
.livin-footer__pay {
	max-width: 1240px; margin: 48px auto 0; padding-top: 24px; border-top: 1px solid rgba(255, 255, 255, .25);
	display: flex; flex-wrap: wrap; align-items: center; gap: 14px;
}
.livin-footer__pay > span { font-weight: 600; }
.livin-footer__pay .livin-pay-logo { border-color: transparent; }
/* Checkout: logos next to each method */
.wc-block-components-radio-control__label img,
.wc-block-components-payment-method-icons img,
.payment_methods label img { height: 22px !important; width: auto; margin-left: 4px; vertical-align: middle; background: #fff; border-radius: 4px; }

/* ---------- Sections taken from livinjourney.com ---------- */
/* Hero photo (its icon tile is part of the image) */
.livin-hero-media img { border-radius: 10px; box-shadow: 0 20px 50px var(--livin-shadow-strong); }

/* "Available Now" app download band */
.livin-app { background: var(--livin-grad-radial); color: #fff; overflow: hidden; }
.livin-app h2, .livin-app .elementor-heading-title { color: #fff !important; font-size: clamp(36px, 5vw, 59px); margin: 0; }
.livin-app .elementor-widget-text-editor, .livin-app p { color: #fff; }
.livin-app-phone img { max-height: 460px; width: auto; margin: -40px auto -80px; display: block; filter: drop-shadow(0 20px 40px rgba(0, 0, 0, .3)); }
@media (max-width: 767px) { .livin-app-phone img { max-height: 320px; margin: 0 auto -80px; } }
/* A band without the phone picture: its text sits centred */
.livin-app .e-con-inner > .e-con > .e-con:only-child, .livin-app .e-con > .e-con:only-child { align-items: center; text-align: center; }
.livin-app .livin-app-badges { justify-content: center; }
.livin-app-badges { display: flex; flex-wrap: wrap; gap: 12px; align-items: center; }
.livin-app-badges img { display: block; height: 54px; width: auto; }

/* Product page: get the Livin app box */
.livin-app-box {
	display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 20px;
	margin: 0 0 48px; padding: 28px 32px; border-radius: 24px; background: var(--livin-grad-radial); color: #fff;
}
.livin-app-box h3 { color: #fff; margin: 0 0 6px; font-size: 24px; }
.livin-app-box p { margin: 0; opacity: .92; }
.livin-app-box .livin-app-badges img { height: 46px; }

/* ---------- Inner pages (built by setup/build-pages.php; classes are set on Elementor containers) ---------- */
.livin-page-hero { background: linear-gradient(160deg, var(--livin-blush) 0%, var(--livin-lilac) 60%, var(--livin-sky) 100%); }
.livin-page-hero h1, .livin-page-hero .elementor-heading-title { color: var(--livin-heading); }
.livin-page-hero h1 { font-size: clamp(34px, 5vw, 56px); line-height: 1.08; margin: 0; }
.livin-page-hero .livin-lead, .livin-lead p { font-size: 18px; line-height: 1.6; }
.livin-page-hero__media { position: relative; }
.livin-page-hero__media::before {
	content: ""; position: absolute; inset: 8% 4% -4% 10%; border-radius: 40% 60% 55% 45%;
	background: var(--livin-grad); opacity: .16; filter: blur(2px); z-index: 0;
}
.livin-page-hero__media > * { position: relative; z-index: 1; }
.livin-page-hero__media img { max-height: 460px; width: auto; object-fit: contain; }
.livin-btn-row { display: flex !important; flex-wrap: wrap; gap: 12px; }
.livin-btn-row .elementor-widget-button { width: auto !important; }
.livin-btn-outline .elementor-button { background: transparent !important; color: var(--livin-plum) !important; border: 2px solid var(--livin-pink) !important; }
:root[data-theme="dark"] .livin-btn-outline .elementor-button { color: #f07aa0 !important; }

/* Audience tabs on the four "Why Livin" pages */
.livin-tabs ul { list-style: none; margin: 0; padding: 6px; display: inline-flex; flex-wrap: wrap; gap: 6px; background: var(--livin-chip); border-radius: 30px; }
.livin-tabs a { display: block; padding: 9px 18px; border-radius: 24px; color: var(--livin-ink) !important; text-decoration: none; font-weight: 600; font-size: 15px; }
.livin-tabs a[aria-current="page"] { background: var(--livin-grad); color: #fff !important; box-shadow: 0 6px 16px rgba(101, 55, 128, .3); }

/* Numbered benefit cards */
.livin-features { counter-reset: livin-feature; }
.livin-feature {
	position: relative; counter-increment: livin-feature; background: var(--livin-surface); border-radius: 20px;
	box-shadow: 0 8px 28px var(--livin-shadow); border: 1px solid var(--livin-border); transition: transform .2s ease, box-shadow .2s ease;
}
.livin-feature:hover { transform: translateY(-3px); box-shadow: 0 16px 36px var(--livin-shadow-strong); }
/* Number badge sits on the card heading: Elementor reserves a container's ::before for background overlays. */
.livin-feature .elementor-heading-title::before {
	content: counter(livin-feature, decimal-leading-zero); display: grid; place-items: center; width: 46px; height: 46px; border-radius: 14px;
	background: var(--livin-grad); color: #fff; font: 700 16px "Poppins", sans-serif; margin-bottom: 14px;
}
.livin-feature h3, .livin-feature .elementor-heading-title { font-size: 20px; line-height: 1.3; margin: 0; }
.livin-feature p { margin: 0; line-height: 1.65; }

/* Closing call-to-action band: soft pastel, so it reads apart from the gradient app band and footer */
.livin-cta { background: linear-gradient(135deg, var(--livin-blush) 0%, var(--livin-lilac) 55%, var(--livin-sky) 100%); text-align: center; }
.livin-cta h2, .livin-cta .elementor-heading-title { color: var(--livin-heading) !important; font-size: clamp(28px, 4vw, 44px); }
.livin-cta p, .livin-cta .elementor-widget-text-editor { color: var(--livin-text); }
.livin-cta .livin-btn-row { justify-content: center; }

/* Story rows (Our Journey) */
.livin-story img { max-height: 380px; width: auto; object-fit: contain; }
.livin-story:nth-child(even) > .e-con-inner > .e-con { flex-direction: row-reverse; }

/* Reward tiers */
.livin-tier { border-radius: 20px; color: #fff; text-align: center; box-shadow: 0 10px 30px var(--livin-shadow); }
.livin-tier h3, .livin-tier .elementor-heading-title, .livin-tier p { color: #fff !important; margin: 0; }
.livin-tier--1 { background: linear-gradient(150deg, #9a83c4, #653780); }
.livin-tier--2 { background: linear-gradient(150deg, #b05aa0, #7d3a85); }
.livin-tier--3 { background: linear-gradient(150deg, #d14172, #8e3870); }
.livin-tier--4 { background: linear-gradient(150deg, #f0a35e, #d14172); }

/* People (team, advisory board) */
.livin-person { text-align: center; background: var(--livin-surface); border-radius: 20px; border: 1px solid var(--livin-border); box-shadow: 0 8px 24px var(--livin-shadow); }
.livin-person .elementor-widget-image img { width: 140px; height: 140px; border-radius: 50%; object-fit: cover; padding: 4px; background: var(--livin-grad); box-sizing: border-box; }
.livin-person h3, .livin-person .elementor-heading-title { font-size: 19px; margin: 0; }
.livin-person p { margin: 0; color: var(--livin-purple); font-weight: 600; }
:root[data-theme="dark"] .livin-person p { color: var(--livin-icon); }

/* Info cards (contact details, locations) */
.livin-info { background: var(--livin-surface); border-radius: 18px; border: 1px solid var(--livin-border); box-shadow: 0 6px 20px var(--livin-shadow); }
.livin-info .elementor-icon { color: var(--livin-purple); font-size: 30px; }
.livin-info .elementor-icon svg { fill: var(--livin-purple); width: 30px; height: 30px; }
:root[data-theme="dark"] .livin-info .elementor-icon svg { fill: var(--livin-icon); }
.livin-info a { color: inherit; text-decoration: none; }
.livin-info .elementor-icon-box-title { font-size: 18px; }
.livin-info .elementor-icon-box-description { white-space: pre-line; }

/* Form panel */
.livin-form-card { background: var(--livin-surface); border-radius: 24px; border: 1px solid var(--livin-border); box-shadow: 0 16px 40px var(--livin-shadow-strong); }
.livin-form-aside { background: var(--livin-grad-radial); color: #fff; border-radius: 24px; }
.livin-form-aside h2, .livin-form-aside .elementor-heading-title, .livin-form-aside p, .livin-form-aside li { color: #fff !important; }
.livin-form-aside ul { padding-left: 20px; line-height: 1.9; }
.livin-form { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.livin-form label { display: grid; gap: 6px; font-weight: 600; font-size: 14px; color: var(--livin-ink); }
/* Grid items default to min-width:auto, so a wide control (the CV file input) could push the form past a phone screen. */
.livin-form > *, .livin-form label, .livin-form .wpcf7-form-control-wrap { min-width: 0; }
.livin-form input[type="file"] { max-width: 100%; font: 400 14px "DM Sans", sans-serif; color: var(--livin-text); }
.livin-form__full { grid-column: 1 / -1; }
.livin-form input:not([type="submit"]):not([type="file"]), .livin-form textarea, .livin-form select {
	width: 100%; box-sizing: border-box; padding: 12px 14px; border-radius: 12px; border: 1px solid var(--livin-border);
	background: var(--livin-surface-2); color: var(--livin-text); font: 400 15px "DM Sans", sans-serif;
}
.livin-form textarea { min-height: 130px; resize: vertical; }
.livin-form input:focus, .livin-form textarea:focus, .livin-form select:focus { outline: 2px solid var(--livin-purple); outline-offset: 1px; border-color: transparent; }
.livin-form input[type="submit"] {
	background: var(--livin-grad); color: #fff; border: 0; border-radius: var(--livin-pill); padding: 14px 32px; font: 600 16px "DM Sans", sans-serif; cursor: pointer;
}
.wpcf7-not-valid-tip { font-weight: 400; font-size: 13px; }
.wpcf7 form .wpcf7-response-output { border-radius: 12px; margin: 16px 0 0; }
@media (max-width: 767px) { .livin-form { grid-template-columns: 1fr; } }

/* Long-form text (privacy notice) */
.livin-prose { max-width: 820px; margin: 0 auto; font-size: 16px; line-height: 1.75; }
.livin-prose h2, .livin-prose b, .livin-prose strong { color: var(--livin-ink); }

/* ---------- Blog ---------- */
.livin-blog, .livin-article { max-width: none; padding: 0 0 72px; }
.livin-blog-hero, .livin-article__hero {
	background: linear-gradient(160deg, var(--livin-blush) 0%, var(--livin-lilac) 60%, var(--livin-sky) 100%);
	padding: 72px 32px; text-align: center;
}
.livin-blog-hero h1, .livin-article__hero h1 { color: var(--livin-heading); font-size: clamp(32px, 5vw, 52px); line-height: 1.1; margin: 8px auto 12px; max-width: 900px; }
.livin-blog-hero p { max-width: 620px; margin: 0 auto; }
.livin-article__hero a.livin-eyebrow { text-decoration: none; }
.livin-article__hero time { color: var(--livin-purple); font-weight: 600; }
.livin-blog-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 28px; max-width: 1240px; margin: 56px auto 0; padding: 0 32px; }
.livin-post-card { display: flex; flex-direction: column; background: var(--livin-surface); border: 1px solid var(--livin-border); border-radius: 20px; overflow: hidden; box-shadow: 0 8px 26px var(--livin-shadow); transition: transform .2s ease, box-shadow .2s ease; }
.livin-post-card:hover { transform: translateY(-4px); box-shadow: 0 16px 36px var(--livin-shadow-strong); }
.livin-post-card__image { display: block; aspect-ratio: 16 / 10; overflow: hidden; background: var(--livin-lilac); }
.livin-post-card__image img { width: 100%; height: 100%; object-fit: cover; display: block; }
.livin-post-card__body { display: flex; flex-direction: column; gap: 10px; padding: 22px 24px 26px; flex: 1; }
.livin-post-card__body time { font-size: 13px; color: var(--livin-purple); font-weight: 600; }
.livin-post-card h2, .livin-post-card h3 { font-size: 20px; line-height: 1.3; margin: 0; }
.livin-post-card h2 a, .livin-post-card h3 a { color: var(--livin-ink); text-decoration: none; }
.livin-post-card p { margin: 0; }
.livin-post-card__more { margin-top: auto; font-weight: 600; text-decoration: none; }
.livin-pagination { max-width: 1240px; margin: 40px auto 0; padding: 0 32px; text-align: center; }
.livin-pagination .page-numbers { display: inline-block; padding: 8px 14px; margin: 0 3px; border-radius: 20px; background: var(--livin-chip); color: var(--livin-ink); text-decoration: none; }
.livin-pagination .current { background: var(--livin-grad); color: #fff; }
.livin-article__image { max-width: 960px; margin: -32px auto 0; padding: 0 32px; }
.livin-article__image img { width: 100%; height: auto; border-radius: 24px; box-shadow: 0 20px 50px var(--livin-shadow-strong); display: block; }
.livin-article__content { padding: 48px 32px 0; }
.livin-article__content img { max-width: 100%; height: auto; border-radius: 16px; }
.livin-article__more { margin-top: 72px; border-top: 1px solid var(--livin-border); padding-top: 48px; }
.livin-article__more h2 { text-align: center; }
:root[data-theme="dark"] .livin-post-card__body time, :root[data-theme="dark"] .livin-article__hero time { color: var(--livin-icon); }

/* ---------- Home hero: immersive, with the interactive Livin app phone ---------- */
/* Dark Livin stage in both themes: deep plum base with purple and pink light falling across it. */
.livin-hero.livin-hero--immersive {
	position: relative; overflow: hidden; color: #f3ecff;
	background:
		radial-gradient(60% 70% at 85% 40%, rgba(209, 65, 114, .55) 0%, rgba(209, 65, 114, 0) 70%),
		radial-gradient(55% 65% at 60% 90%, rgba(101, 55, 128, .9) 0%, rgba(101, 55, 128, 0) 70%),
		radial-gradient(45% 60% at 5% 0%, rgba(143, 85, 179, .45) 0%, rgba(143, 85, 179, 0) 70%),
		#1b0f2e;
}
.livin-hero--immersive h1, .livin-hero--immersive .elementor-heading-title { color: #fff !important; font-size: clamp(42px, 5.6vw, 76px); line-height: 1.02; letter-spacing: -.02em; }
.livin-hero--immersive .livin-grad-text { background: linear-gradient(90deg, #d9a3ff 0%, #ff8fb3 100%); -webkit-background-clip: text; background-clip: text; }
.livin-hero--immersive .livin-lead p { color: rgba(243, 236, 255, .86); font-size: 19px; line-height: 1.6; max-width: 32em; margin: 0; }
.livin-hero--immersive .livin-btn--dark { background: #fff !important; color: #341d74 !important; border-color: #fff !important; box-shadow: 0 10px 30px rgba(0, 0, 0, .25); }
.livin-hero--immersive .livin-btn--dark:hover { background: #f3ecff !important; }
/* The photo cards below overlap the hero's bottom edge, so their top band continues the dark stage. */
.livin-hero--immersive + .livin-cards { background: linear-gradient(#1b0f2e 30%, var(--livin-bg) 30%); }
.livin-hero-cta { display: flex; flex-wrap: wrap; align-items: center; gap: 14px; }
.livin-hero-cta .livin-app-badges img { height: 48px; }
@media (max-width: 767px) { .livin-hero-cta .livin-app-badges img { height: 42px; } }

/* Photos placed by the page scripts (hero, "Why Livin?") */
.livin-photo img { width: 100%; height: auto; filter: drop-shadow(0 24px 40px rgba(20, 10, 35, .25)); }


.livin-walk { display: grid; gap: 12px; width: 100%; max-width: 420px; font: 600 15px "DM Sans", sans-serif; color: var(--livin-ink); }
.livin-hero--immersive .livin-walk { color: #fff; padding: 16px 18px; border-radius: 18px; background: rgba(255, 255, 255, .07); border: 1px solid rgba(255, 255, 255, .14); box-sizing: border-box; }
.livin-walk input[type="range"] { -webkit-appearance: none; appearance: none; width: 100%; height: 10px; border-radius: 5px; background: var(--livin-grad); cursor: pointer; margin: 0; }
.livin-walk input[type="range"]::-webkit-slider-thumb {
	-webkit-appearance: none; width: 28px; height: 28px; border-radius: 50%; background: #fff; border: 3px solid var(--livin-pink); box-shadow: 0 4px 14px rgba(209, 65, 114, .5);
}
.livin-walk input[type="range"]::-moz-range-thumb { width: 22px; height: 22px; border-radius: 50%; background: #fff; border: 3px solid var(--livin-pink); box-shadow: 0 4px 14px rgba(209, 65, 114, .5); }
.livin-walk input[type="range"]:focus-visible { outline: 2px solid #fff; outline-offset: 6px; }

/* Stage: the phone tilts in 3D; floating app cards sit around it */
.livin-demo { --app-red: #e30b1c; --app-ink: #111; --app-muted: #6b6b6b; display: flex; flex-direction: column; align-items: center; gap: 14px; }
.livin-stage { position: relative; perspective: 1400px; padding: 10px 0; }
.livin-phone {
	position: relative; z-index: 1; width: 300px; height: 620px; padding: 11px; box-sizing: border-box; border-radius: 50px;
	background: linear-gradient(160deg, #2c1d47, #120a20); box-shadow: 0 50px 90px rgba(5, 0, 15, .6), inset 0 0 0 2px rgba(255, 255, 255, .12);
	transform: rotateX(var(--tilt-x, 4deg)) rotateY(var(--tilt-y, -10deg)); transition: transform .5s cubic-bezier(.2, .8, .2, 1);
}

/* The app screen: recreated from the real Livin app (white UI, red accents) */
.livin-phone__screen {
	position: relative; height: 100%; border-radius: 40px; overflow: hidden; padding: 10px 16px 0; box-sizing: border-box;
	display: flex; flex-direction: column; gap: 8px; background: #fff; color: var(--app-ink); font-family: -apple-system, "Segoe UI", "DM Sans", sans-serif;
}
.livin-app__status { display: flex; justify-content: space-between; align-items: center; padding: 2px 10px 0; font: 600 12px -apple-system, "Segoe UI", sans-serif; }
.livin-app__battery { width: 20px; height: 10px; border-radius: 3px; background: #2fbf4f; }
.livin-app__title { margin: 0; text-align: center; font: 600 15px -apple-system, "Segoe UI", sans-serif; color: var(--app-ink); }
.livin-screen { display: flex; flex-direction: column; gap: 8px; flex: 1; min-height: 0; }
.livin-screen[hidden] { display: none; }
.livin-app__h { margin: 4px 0 0; font: 700 13px -apple-system, "Segoe UI", sans-serif; color: var(--app-ink); }
.livin-app__muted { margin: 0; font-size: 11px; color: var(--app-muted); }

.livin-app__chips { display: flex; justify-content: space-between; gap: 6px; }
.livin-app__chips span { display: inline-flex; align-items: center; gap: 4px; padding: 5px 9px; border-radius: 14px; background: #f2f2f4; font-size: 11px; }
.livin-app__chips b { font-variant-numeric: tabular-nums; }
.livin-coin { display: inline-block; width: 12px; height: 12px; border-radius: 50%; background: radial-gradient(circle at 35% 35%, #ffe17a, #e3a00c); box-shadow: inset 0 0 0 1px rgba(0, 0, 0, .1); }
.livin-coin--red { background: radial-gradient(circle at 35% 35%, #ff6b6b, #c4000f); }
.livin-coin--grey { width: 22px; height: 22px; background: radial-gradient(circle at 35% 35%, #e6e6e6, #a9a9a9); }

.livin-app__level {
	display: grid; gap: 4px; padding: 14px; border-radius: 14px; text-align: center; color: #fff;
	background: linear-gradient(120deg, #e30b1c 0%, #8d1530 55%, #24394a 100%);
}
.livin-app__level span { font-size: 12px; }
.livin-app__level small { font-size: 11px; opacity: .92; font-variant-numeric: tabular-nums; }
.livin-app__level--alt { background: linear-gradient(120deg, #24394a 0%, #8d1530 60%, #e30b1c 100%); }

.livin-app__row {
	display: flex; justify-content: space-between; align-items: center; padding: 9px 12px; border-radius: 10px; color: #fff; font-size: 12px;
	background: linear-gradient(90deg, #8d1530 0%, #3f2b3c 55%, #146b78 100%);
}
.livin-app__row b { font-size: 14px; margin-right: 4px; font-variant-numeric: tabular-nums; }
.livin-app__pts { display: inline-flex; align-items: center; gap: 5px; }

.livin-app__progress { display: grid; grid-template-columns: 112px 1fr; align-items: center; gap: 10px; margin-top: 2px; }
.livin-app__goal { margin: 6px 0 0; font-size: 11px; color: var(--app-red); line-height: 1.35; }
.livin-app__goal b { font-size: 15px; }
.livin-ring { position: relative; width: 112px; height: 112px; }
.livin-ring svg { width: 100%; height: 100%; transform: rotate(-90deg); }
.livin-ring circle { fill: none; stroke-width: 12; }
.livin-ring__track { stroke: #fdeaea; }
.livin-ring__fill { stroke: var(--app-red); stroke-linecap: round; transition: stroke-dashoffset .15s linear; }
.livin-ring__label { position: absolute; inset: 0; display: grid; place-content: center; text-align: center; }
.livin-ring__label strong { font: 700 22px/1 -apple-system, "Segoe UI", sans-serif; color: var(--app-red); font-variant-numeric: tabular-nums; }
.livin-ring__label span { font-size: 10px; color: #d6336c; margin-top: 3px; }

/* Challenge */
.livin-app__week { display: grid; grid-template-columns: repeat(7, 1fr); text-align: center; gap: 2px; }
.livin-app__week span { display: grid; justify-items: center; gap: 4px; font-size: 9px; color: var(--app-muted); }
.livin-app__week i { --p: 1; width: 22px; height: 22px; border-radius: 50%; background: conic-gradient(var(--app-red) calc(var(--p) * 360deg), #cfe3e6 0); -webkit-mask: radial-gradient(circle, transparent 7px, #000 7.5px); mask: radial-gradient(circle, transparent 7px, #000 7.5px); }
.livin-app__week span:nth-child(n+6) i { --p: 0; }
.livin-app__week em { font-style: normal; color: var(--app-ink); }
.livin-app__week .is-today em { border-bottom: 2px solid #d6336c; }
.livin-app__activity { display: grid; grid-template-columns: repeat(3, 1fr); padding: 12px 6px; border-radius: 12px; background: #f5f9fa; border: 1px solid #e6eef0; text-align: center; }
.livin-app__activity span { display: grid; justify-items: center; gap: 3px; font-size: 10px; color: var(--app-muted); }
.livin-app__activity svg { color: var(--app-red); width: 22px; height: 22px; }
.livin-app__activity b { font-size: 15px; color: var(--app-ink); font-weight: 500; font-variant-numeric: tabular-nums; }
.livin-app__challenge { display: grid; gap: 4px; padding: 16px 12px 12px; border-radius: 12px; color: #fff; background: linear-gradient(90deg, #1e1e24, #4a4048); }
.livin-app__challenge small { justify-self: start; padding: 2px 6px; font-size: 9px; background: rgba(255, 255, 255, .18); }
.livin-app__challenge b { font-size: 13px; }

/* Rewards */
.livin-app__badges { display: flex; justify-content: space-between; gap: 6px; }
.livin-app__badges span { display: grid; place-items: center; width: 52px; height: 52px; border-radius: 50%; background: #ececec; color: #b7b7b7; font-size: 10px; font-weight: 700; }
.livin-app__badges .is-earned { background: radial-gradient(circle at 35% 35%, #f5f5f5, #9b9b9b); color: #fff; text-shadow: 0 1px 1px rgba(0, 0, 0, .3); }
.livin-app__tier { display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 8px; font-size: 11px; }
.livin-level__bar { height: 8px; border-radius: 4px; background: #f1e3e5; overflow: hidden; }
.livin-level__bar i { display: block; height: 100%; width: 0; border-radius: 4px; background: var(--app-red); transition: width .15s linear; }

/* Assessment */
.livin-app__experts { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.livin-app__experts span {
	display: grid; align-content: end; gap: 8px; height: 118px; padding: 10px; border-radius: 12px; color: #fff; box-sizing: border-box;
	background: linear-gradient(180deg, #5b5f6b 0%, #2c2f38 60%, #e30b1c 130%);
}
.livin-app__experts b { font-size: 12px; }
.livin-app__experts em { font-style: normal; justify-self: stretch; text-align: center; padding: 6px; border-radius: 16px; background: #fff; color: var(--app-ink); font-size: 11px; }
.livin-app__ai { display: grid; gap: 3px; padding: 12px; border-radius: 12px; background: #23262f; color: #fff; }
.livin-app__ai b { font-size: 12px; }
.livin-app__ai small { font-size: 10px; opacity: .85; }
.livin-app__scan { display: flex; justify-content: space-between; align-items: center; padding: 12px; border-radius: 12px; background: #fdecec; }
.livin-app__scan b { font-size: 12px; }
.livin-app__scan em { font-style: normal; padding: 6px 12px; border-radius: 8px; background: var(--app-red); color: #fff; font-size: 11px; font-weight: 700; }

/* Tab bar, as in the app */
.livin-phone__nav { display: grid; grid-template-columns: repeat(4, 1fr); margin: auto -16px 0; padding: 6px 8px 12px; background: #fff; border-top: 1px solid #eee; }
.livin-phone__nav button {
	display: grid; justify-items: center; gap: 2px; padding: 6px 0; border: 0; border-radius: 16px; background: transparent;
	color: #111; font: 600 10px -apple-system, "Segoe UI", sans-serif; cursor: pointer;
}
.livin-phone__nav button:hover, .livin-phone__nav button:focus { background: #f2f2f4; color: #111; }
.livin-phone__nav button[aria-selected="true"] { color: var(--app-red); background: #efefef; }
.livin-phone__nav button:focus-visible { outline: 2px solid var(--app-red); outline-offset: -2px; }

.livin-phone__unlock {
	position: absolute; z-index: 2; left: 12px; right: 12px; bottom: 70px; padding: 14px 16px; border-radius: 16px; display: grid; gap: 3px;
	background: #fff; color: var(--app-ink); box-shadow: 0 16px 40px rgba(0, 0, 0, .25); border: 1px solid #f3d0d3;
	opacity: 0; transform: translateY(24px) scale(.96); pointer-events: none; transition: opacity .3s ease, transform .35s cubic-bezier(.2, 1.4, .4, 1);
}
.livin-phone__unlock strong { font-size: 15px; color: var(--app-red); }
.livin-phone__unlock span { font-size: 12px; color: var(--app-muted); }
.livin-demo.is-unlocked[data-screen="home"] .livin-phone__unlock { opacity: 1; transform: none; }

/* Floating app cards (wide screens); they may overlap the phone's frame (≤24px) but never its screen content */
.livin-float {
	position: absolute; z-index: 2; display: flex; align-items: center; gap: 10px; padding: 12px 14px; border-radius: 16px; width: max-content; max-width: 224px;
	background: rgba(255, 255, 255, .95); color: #341d74; box-shadow: 0 18px 40px rgba(5, 0, 15, .35);
	opacity: 0; transform: translateY(14px); transition: opacity .6s ease, transform .7s cubic-bezier(.2, .8, .2, 1), box-shadow .3s ease;
}
.livin-float strong { display: block; font: 600 13px "Poppins", sans-serif; }
.livin-float span { display: block; font-size: 12px; color: #5b4a7c; }
.livin-float__icon { flex: none; width: 34px; height: 34px; border-radius: 10px; display: grid !important; place-items: center; background: var(--livin-grad); color: #fff !important; }
.livin-float--scan { top: 90px; right: -200px; transition-delay: .15s; }
.livin-float--goal { top: 400px; right: -200px; transition-delay: .3s; }
.livin-float--ai { bottom: 40px; left: -200px; transition-delay: .45s; }
.livin-demo.is-in .livin-float { opacity: 1; transform: none; }
.livin-demo.is-unlocked .livin-float--goal { box-shadow: 0 18px 40px rgba(227, 11, 28, .45); }

.livin-demo__note { margin: 0; font-size: 12px; color: var(--livin-text); opacity: .7; }
.livin-hero--immersive .livin-demo__note { color: rgba(243, 236, 255, .7); opacity: 1; }

@media (max-width: 1399px) {
	.livin-float { display: none; }
}
@media (max-width: 767px) {
	.livin-phone { width: 284px; height: 600px; transform: none; }
	.livin-hero-cta .livin-app-badges img { height: 42px; }
}
@media (prefers-reduced-motion: reduce) {
	.livin-ring__fill, .livin-level__bar i, .livin-phone__unlock, .livin-phone, .livin-float { transition: none; }
}

/* ---------- Announcement bar (dismissible) ---------- */
.livin-announce {
	display: flex; align-items: center; justify-content: center; gap: 12px; padding: 10px 48px; position: relative;
	background: var(--livin-deep); color: #fff; font-size: 14px; text-align: center;
}
.livin-announce p { margin: 0; }
.livin-announce a { color: #fff !important; font-weight: 600; text-decoration: underline; text-underline-offset: 3px; margin-left: 6px; }
.livin-announce__close {
	position: absolute; right: 12px; top: 50%; transform: translateY(-50%); width: 32px; height: 32px; border-radius: 50%;
	border: 0; background: transparent; color: #fff; font-size: 22px; line-height: 1; cursor: pointer; padding: 0;
}
.livin-announce__close:hover, .livin-announce__close:focus { background: rgba(255, 255, 255, .15); color: #fff; }
.livin-announce-hidden .livin-announce { display: none; }

/* ---------- Cookie consent ---------- */
.livin-consent {
	position: fixed; z-index: 1000; left: 16px; right: 16px; bottom: 16px; max-width: 760px; margin: 0 auto;
	display: flex; align-items: center; gap: 20px; padding: 18px 22px; border-radius: 18px;
	background: var(--livin-surface); color: var(--livin-text); border: 1px solid var(--livin-border); box-shadow: 0 20px 50px var(--livin-shadow-strong);
}
.livin-consent[hidden] { display: none; }
.livin-consent p { margin: 0; font-size: 14px; line-height: 1.55; }
.livin-consent__actions { display: flex; gap: 10px; flex: none; }
.livin-consent__actions .livin-btn { padding: 10px 18px; font-size: 14px; white-space: nowrap; }
.livin-link-button { background: none !important; border: 0; padding: 0; margin-left: 16px; color: #fff; font: inherit; text-decoration: underline; cursor: pointer; opacity: .9; }
.livin-link-button:hover, .livin-link-button:focus { color: #fff; opacity: 1; }
@media (max-width: 640px) {
	.livin-consent { flex-direction: column; align-items: stretch; }
	.livin-consent__actions .livin-btn { flex: 1; justify-content: center; }
}

/* ---------- How Livin works (3 steps) ---------- */
.livin-steps .livin-feature .elementor-heading-title::before { content: counter(livin-feature); border-radius: 50%; }

/* ---------- FAQ ---------- */
.livin-faq-list { max-width: 860px; margin: 0 auto; display: grid; gap: 12px; }
.livin-faq-list details {
	background: var(--livin-surface); border: 1px solid var(--livin-border); border-radius: 16px; box-shadow: 0 4px 16px var(--livin-shadow);
}
.livin-faq-list summary {
	list-style: none; cursor: pointer; padding: 18px 56px 18px 22px; position: relative;
	font: 600 17px "Poppins", sans-serif; color: var(--livin-ink);
}
.livin-faq-list summary::-webkit-details-marker { display: none; }
.livin-faq-list summary::after {
	content: "+"; position: absolute; right: 20px; top: 50%; transform: translateY(-50%); width: 28px; height: 28px; border-radius: 50%;
	display: grid; place-items: center; background: var(--livin-chip); color: var(--livin-purple); font-size: 18px; transition: transform .2s ease;
}
.livin-faq-list details[open] summary::after { content: "–"; background: var(--livin-grad); color: #fff; }
.livin-faq-list summary:focus-visible { outline: 2px solid var(--livin-purple); outline-offset: 2px; border-radius: 16px; }
.livin-faq-list details > div { padding: 0 22px 20px; line-height: 1.7; }
.livin-faq-list details > div p { margin: 0; }

/* ---------- Smaller screens: the burger drawer replaces the inline menu ---------- */
/* Room for the full menu: the header "Request a Demo" steps aside (it stays in the hero and the drawer). */
@media (max-width: 1500px) {
	.livin-header__actions .livin-btn--ghost { display: none; }
}
@media (max-width: 1320px) {
	.livin-nav { display: none; }
	.livin-header__actions { margin-inline-start: auto; }
}
@media (max-width: 782px) {
	.admin-bar .livin-drawer { top: 46px; }
}
@media (max-width: 767px) {
	.livin-topbar, .livin-header, .livin-footer { padding-left: 16px; padding-right: 16px; }
	.livin-header { gap: 10px; }
	.livin-header__actions { gap: 6px; }
	.livin-header__actions .livin-btn--ghost, .livin-header__actions .livin-login { display: none; }
	.livin-social--topbar { display: none; }
	.livin-footer__grid { grid-template-columns: 1fr 1fr; }
	.livin-card { border-radius: 18px !important; min-height: 300px !important; }
}
@media (max-width: 480px) {
	.livin-footer__grid { grid-template-columns: 1fr; }
}
@media (prefers-reduced-motion: reduce) {
	.livin-drawer, .livin-drawer-overlay, body, .woocommerce ul.products li.product { transition: none; }
}

/* ---------- Home "Why Livin?": points beside the app's Meet Rashid screen ---------- */
.livin-why .elementor-heading-title { font-size: clamp(32px, 3.6vw, 46px); line-height: 1.1; }
.livin-why .elementor-widget-text-editor p { font-size: 18px; line-height: 1.65; margin: 0; }
.livin-why-points { list-style: none; margin: 4px 0 8px; padding: 0; display: grid; gap: 14px; }
.livin-why-points li { display: grid; grid-template-columns: 48px 1fr; gap: 14px; align-items: start; }
.livin-why-points .livin-why-points__icon {
	width: 48px; height: 48px; border-radius: 14px; display: grid; place-items: center; font-size: 24px; line-height: 1;
	background: var(--livin-surface); box-shadow: 0 6px 18px var(--livin-shadow), inset 0 0 0 1px var(--livin-border);
}
.livin-why-points strong { display: block; font: 600 18px/1.3 "Poppins", sans-serif; color: var(--livin-ink); margin: 2px 0 3px; }
.livin-why-points span { font-size: 15.5px; line-height: 1.55; color: var(--livin-text); }

.livin-rashid { margin: 0; display: flex; flex-direction: column; align-items: center; gap: 14px; }
.livin-rashid__phone {
	width: 300px; padding: 11px; border-radius: 48px; box-sizing: border-box;
	background: linear-gradient(160deg, #2c1d47, #120a20); box-shadow: 0 40px 80px rgba(52, 29, 116, .28), inset 0 0 0 2px rgba(255, 255, 255, .12);
	transform: rotate(-2deg);
}
.livin-rashid__screen {
	position: relative; border-radius: 38px; overflow: hidden; background: #a9a9ad; color: #111;
	font-family: -apple-system, "SF Pro Text", "DM Sans", sans-serif; padding-top: 14px;
}
.livin-rashid__screen .livin-app__status { padding: 0 22px; color: #111; }
.livin-rashid__bar { margin: 6px 0 12px; text-align: center; font-size: 15px; font-weight: 600; color: #111; }
.livin-rashid__sheet { background: #fff; border-radius: 22px 22px 0 0; padding: 18px 20px 22px; display: flex; flex-direction: column; align-items: center; text-align: center; }
.livin-rashid__avatar { position: relative; width: 150px; height: 150px; margin: 14px 0 18px; }
.livin-rashid__avatar::before {
	content: ""; position: absolute; inset: -34px; border-radius: 50%;
	background: radial-gradient(circle, rgba(227, 11, 28, .85) 45%, rgba(227, 11, 28, 0) 72%);
}
.livin-rashid__avatar img { position: relative; width: 100%; height: 100%; border-radius: 50%; display: block; }
.livin-rashid__bubble {
	position: absolute; width: 38px; height: 38px; border-radius: 50%; display: grid; place-items: center; font-size: 19px; line-height: 1;
	background: rgba(255, 236, 240, .95); box-shadow: 0 4px 12px rgba(0, 0, 0, .12);
	animation: livin-bob 4s ease-in-out infinite;
}
.livin-rashid__bubble--heart { top: -22px; left: 18px; }
.livin-rashid__bubble--weight { top: -6px; right: -26px; animation-delay: -1s; }
.livin-rashid__bubble--stetho { bottom: 22px; left: -32px; width: 50px; height: 50px; font-size: 24px; animation-delay: -2s; }
.livin-rashid__bubble--apple { bottom: -18px; right: -14px; width: 46px; height: 46px; font-size: 22px; animation-delay: -3s; }
@keyframes livin-bob { 50% { transform: translateY(-5px); } }
.livin-rashid__meet { margin: 0; font-size: 19px; font-weight: 600; }
.livin-rashid__meet span { color: #127b8e; }
.livin-rashid__title { margin: 6px 0 6px; font-size: 18px; font-weight: 700; }
.livin-rashid__text { margin: 0; font-size: 12px; line-height: 1.5; color: #555; }
.livin-rashid__chat { display: block; width: 100%; margin: 16px 0 14px; padding: 11px; border-radius: 30px; background: #e30b1c; color: #fff; font-weight: 700; font-size: 14px; }
.livin-rashid__note { margin: 0; padding: 10px 12px; border: 1px solid #e3e3e8; border-radius: 10px; background: #f7f8fa; font-size: 11px; line-height: 1.45; text-align: left; color: #222; }
.livin-rashid__note b { display: block; font-weight: 600; margin-bottom: 2px; }
.livin-rashid__note b::before { content: "⚠"; color: #e30b1c; margin-right: 6px; }
@media (max-width: 767px) {
	.livin-rashid__phone { width: 280px; transform: none; }
}
@media (prefers-reduced-motion: reduce) {
	.livin-rashid__bubble { animation: none; }
}

/* ---------- Arabic (RTL) ---------- */
html[lang="ar"] body,
html[lang="ar"] body :where(h1, h2, h3, h4, h5, h6, p, a, li, span, strong, b, em, small, label, button, input, select, textarea, td, th, div, figcaption) {
	font-family: "IBM Plex Sans Arabic", "DM Sans", sans-serif;
	letter-spacing: 0;
}
html[lang="ar"] .elementor-heading-title, html[lang="ar"] h1, html[lang="ar"] h2, html[lang="ar"] h3 { font-family: "IBM Plex Sans Arabic", "Poppins", sans-serif !important; line-height: 1.3; }
html[lang="ar"] .livin-hero--immersive .elementor-heading-title { line-height: 1.2; }
html[lang="ar"] .livin-eyebrow, html[lang="ar"] .livin-card-line { text-transform: none; letter-spacing: 0; }
/* The phone mock-ups show the English app: keep their own fonts */
html[lang="ar"] .livin-phone__screen, html[lang="ar"] .livin-phone__screen *,
html[lang="ar"] .livin-rashid__screen, html[lang="ar"] .livin-rashid__screen * { font-family: -apple-system, "SF Pro Text", "DM Sans", sans-serif; }
html[lang="ar"] .livin-phone__screen .livin-ring__label strong { font-family: "Poppins", sans-serif; }
.livin-lang { font: 600 14px "DM Sans", sans-serif; color: var(--livin-ink); text-decoration: none; padding: 8px 12px; border-radius: var(--livin-pill); }
.livin-lang[lang="ar"] { font-family: "IBM Plex Sans Arabic", "DM Sans", sans-serif; font-size: 15px; }
.livin-lang:hover { background: var(--livin-chip); }
.livin-lang--drawer { display: inline-block; border: 1px solid var(--livin-border); margin-bottom: 8px; }
[dir="rtl"] .livin-topbar__links a + a { border-left: 0; margin-left: 0; padding-left: 0; border-right: 1px solid rgba(255, 255, 255, .5); margin-right: 8px; padding-right: 8px; }
[dir="rtl"] .livin-why-points li, [dir="rtl"] .livin-rashid__note { text-align: right; }
#trp-floater-ls, .trp-language-switcher-container.trp-floater-ls-names { display: none !important; }
/* Mirror the floating app cards so two stay on the outer side of the phone */
[dir="rtl"] .livin-float--scan, [dir="rtl"] .livin-float--goal { right: auto; left: -200px; }
[dir="rtl"] .livin-float--ai { left: auto; right: -200px; }
[dir="rtl"] .woocommerce ul.products li.product { text-align: right; }
[dir="rtl"] .livin-badge { left: auto; right: 26px; }
[dir="rtl"] .woocommerce span.onsale { right: auto; left: 22px; }
[dir="rtl"] .woocommerce div.product div.images::after { right: auto; left: 22px; }
[dir="rtl"] .livin-how__num { right: auto; left: 20px; }
/* The drawer opens from the burger's side */
[dir="rtl"] .livin-drawer { left: auto; right: 0; transform: translateX(100%); box-shadow: -12px 0 40px var(--livin-shadow-strong); }
[dir="rtl"] body.livin-drawer-open .livin-drawer { transform: none; }
/* Small screens: the language button lives in the side menu only, so the header fits */
@media (max-width: 600px) {
	.livin-lang--header { display: none; }
}
/* Text-only story rows (no picture) keep a readable line length */
.livin-story .elementor-widget-text-editor p { max-width: 760px; }

/* ---------- Long-form content (inner pages, 2026 website copy) ---------- */
/* Story text sits under its heading, left aligned, at a readable width */
.livin-story .livin-prose { margin: 0; max-width: 820px; }
.livin-prose-section .livin-prose { margin: 0 auto; }
.livin-prose p, .livin-feature .elementor-widget-text-editor p { margin: 0 0 12px; }
.livin-prose h3, .livin-feature h3:not(.elementor-heading-title) { font: 600 19px/1.35 "Poppins", sans-serif; color: var(--livin-ink); margin: 26px 0 10px; }
.livin-prose ul, .livin-feature .elementor-widget-text-editor ul { margin: 6px 0 14px; padding-inline-start: 22px; }
.livin-prose li, .livin-feature .elementor-widget-text-editor li { margin: 0 0 8px; line-height: 1.65; }
.livin-prose li::marker, .livin-feature li::marker { color: var(--livin-pink); }
.livin-prose li > strong { display: block; color: var(--livin-ink); margin-bottom: 4px; }
.livin-prose li ul { margin-top: 4px; }
.livin-feature .elementor-widget-text-editor strong { color: var(--livin-ink); }

/* "How it Works?" on Get Rewarded: numbered steps */
.livin-steps-list { max-width: 860px; width: 100%; }
.livin-steps-list ol { list-style: none; counter-reset: livin-step; margin: 8px 0 0; padding: 0; display: grid; gap: 14px; }
.livin-steps-list li {
	counter-increment: livin-step; position: relative; padding: 18px 20px 18px 74px; border-radius: 16px; line-height: 1.6;
	background: var(--livin-surface); border: 1px solid var(--livin-border); box-shadow: 0 8px 24px var(--livin-shadow);
}
.livin-steps-list li::before {
	content: counter(livin-step); position: absolute; left: 20px; top: 16px; width: 38px; height: 38px; border-radius: 50%;
	display: grid; place-items: center; background: var(--livin-grad); color: #fff; font: 700 16px "Poppins", sans-serif;
}
[dir="rtl"] .livin-steps-list li { padding: 18px 74px 18px 20px; }
[dir="rtl"] .livin-steps-list li::before { left: auto; right: 20px; }

/* Team: photo, role and biography */
.livin-bio { background: var(--livin-surface); border-radius: 20px; border: 1px solid var(--livin-border); box-shadow: 0 8px 24px var(--livin-shadow); }
.livin-bio .elementor-widget-image img { width: 160px; height: 160px; border-radius: 50%; object-fit: cover; padding: 4px; background: var(--livin-grad); box-sizing: border-box; }
.livin-bio h3, .livin-bio .elementor-heading-title { font-size: 22px; margin: 0; }
.livin-bio__role { margin: 0; color: var(--livin-purple); font-weight: 600; }
:root[data-theme="dark"] .livin-bio__role { color: var(--livin-icon); }
.livin-bio p { line-height: 1.7; }