/* ==========================================================================
   Eyewear UX — Design layer for عیناکتو
   Loaded after theme + Elementor styles. Additive only: no core file is edited.
   ========================================================================== */

:root {
	--ey-ink: #0b1220;
	--ey-ink-2: #1b2434;
	--ey-text: #2a3242;
	--ey-muted: #6b7484;
	--ey-line: #ece7df;
	--ey-cream: #fbf8f3;
	--ey-cream-2: #f5efe6;
	--ey-gold: #c6a15b;
	--ey-gold-2: #a9843e;
	--ey-gold-soft: #f6eedd;
	--ey-white: #fff;
	--ey-ok: #157f5c;
	--ey-err: #c9463d;
	--ey-radius: 18px;
	--ey-radius-sm: 12px;
	--ey-radius-pill: 999px;
	--ey-shadow-sm: 0 2px 10px rgba(11, 18, 32, .05);
	--ey-shadow: 0 14px 40px rgba(11, 18, 32, .09);
	--ey-shadow-lg: 0 28px 70px rgba(11, 18, 32, .14);
	--ey-container: 1180px;
	--ey-gap: clamp(16px, 2.2vw, 28px);
	--ey-ease: cubic-bezier(.22, .61, .36, 1);
}

/* ---------- base ---------- */

body.eyewear-ux {
	font-family: 'Arad', 'Vazirmatn', 'IRANSans', Tahoma, system-ui, sans-serif;
	color: var(--ey-text);
	background: var(--ey-white);
	font-size: 16px;
	line-height: 1.95;
	-webkit-font-smoothing: antialiased;
	text-rendering: optimizeLegibility;
	overflow-x: clip;
}

html {
	scroll-behavior: smooth;
	-webkit-text-size-adjust: 100%;
	/* Elementor sliders and screen-reader spans can push a 39px phantom
	   scroll on narrow screens; clip keeps the layout scroll-free. */
	overflow-x: clip;
}

body.eyewear-ux img {
	max-width: 100%;
	height: auto;
}

:where(body.eyewear-ux) a:where(:not(.elementor-button):not(.wp-block-button__link):not(.ey-btn):not(.button)) {
	color: var(--ey-ink);
	text-decoration: none;
	transition: color .2s var(--ey-ease);
}

body.eyewear-ux a:hover {
	color: var(--ey-gold-2);
}

body.eyewear-ux ::selection {
	background: var(--ey-gold-soft);
	color: var(--ey-ink);
}

body.eyewear-ux :focus-visible {
	outline: 2px solid var(--ey-gold);
	outline-offset: 3px;
	border-radius: 6px;
}

/* Persian digits stay readable in tables and totals */
body.eyewear-ux {
	font-feature-settings: 'ss01';
}

/* ---------- typography for real content (not Elementor widget headings) ---------- */

body.eyewear-ux .entry-content > h2,
body.eyewear-ux .entry-content > h3,
body.eyewear-ux .shopkit-page h2,
body.eyewear-ux .shopkit-page h3 {
	color: var(--ey-ink);
	font-weight: 700;
	line-height: 1.5;
	letter-spacing: -.2px;
}

body.eyewear-ux .entry-content > h2,
body.eyewear-ux .shopkit-page h2 {
	font-size: clamp(1.4rem, 2.2vw, 1.9rem);
	margin: 2.2em 0 .8em;
}

body.eyewear-ux .entry-content > h3,
body.eyewear-ux .shopkit-page h3 {
	font-size: clamp(1.1rem, 1.6vw, 1.3rem);
	margin: 1.8em 0 .6em;
}

body.eyewear-ux .entry-content p,
body.eyewear-ux .shopkit-page p {
	margin: 0 0 1.1em;
	color: var(--ey-text);
}

body.eyewear-ux .entry-content ul,
body.eyewear-ux .shopkit-page ul {
	padding-inline-start: 1.2em;
	margin: 0 0 1.2em;
}

body.eyewear-ux .entry-content li,
body.eyewear-ux .shopkit-page li {
	margin-bottom: .4em;
}

/* ---------- buttons ---------- */

body.eyewear-ux .ey-btn,
body.eyewear-ux .woocommerce a.button,
body.eyewear-ux .woocommerce button.button,
body.eyewear-ux .woocommerce input.button,
body.eyewear-ux .woocommerce #respond input#submit,
body.eyewear-ux .woocommerce-cart .wc-proceed-to-checkout a.checkout-button,
body.eyewear-ux .woocommerce #place_order {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	min-height: 48px;
	padding: 12px 26px;
	border: 0;
	border-radius: var(--ey-radius-sm);
	background: linear-gradient(135deg, var(--ey-gold) 0%, var(--ey-gold-2) 100%);
	color: #fff !important;
	font-family: inherit;
	font-size: .95rem;
	font-weight: 700;
	line-height: 1.4;
	letter-spacing: 0;
	box-shadow: 0 8px 22px rgba(169, 132, 62, .26);
	cursor: pointer;
	transition: transform .18s var(--ey-ease), box-shadow .18s var(--ey-ease), filter .18s var(--ey-ease);
}

body.eyewear-ux .ey-btn:hover,
body.eyewear-ux .woocommerce a.button:hover,
body.eyewear-ux .woocommerce button.button:hover,
body.eyewear-ux .woocommerce input.button:hover,
body.eyewear-ux .woocommerce #respond input#submit:hover,
body.eyewear-ux .woocommerce-cart .wc-proceed-to-checkout a.checkout-button:hover,
body.eyewear-ux .woocommerce #place_order:hover {
	background: linear-gradient(135deg, #d3ae68 0%, var(--ey-gold-2) 100%);
	color: #fff !important;
	transform: translateY(-1px);
	box-shadow: 0 12px 28px rgba(169, 132, 62, .32);
}

body.eyewear-ux .ey-btn:active,
body.eyewear-ux .woocommerce a.button:active {
	transform: translateY(0);
}

body.eyewear-ux .ey-btn--ghost,
body.eyewear-ux .woocommerce a.button.alt,
body.eyewear-ux .woocommerce button.button.alt {
	background: transparent;
	color: var(--ey-ink) !important;
	border: 1.5px solid var(--ey-ink);
	box-shadow: none;
}

body.eyewear-ux .ey-btn--ghost:hover,
body.eyewear-ux .woocommerce a.button.alt:hover {
	background: var(--ey-ink);
	color: #fff !important;
}

/* ---------- forms (global, kept gentle) ---------- */

body.eyewear-ux input[type="text"],
body.eyewear-ux input[type="email"],
body.eyewear-ux input[type="tel"],
body.eyewear-ux input[type="number"],
body.eyewear-ux input[type="password"],
body.eyewear-ux input[type="search"],
body.eyewear-ux textarea,
body.eyewear-ux select {
	font-family: inherit;
	font-size: .95rem;
	color: var(--ey-ink);
	background: #fff;
	border: 1.5px solid var(--ey-line);
	border-radius: var(--ey-radius-sm);
	padding: 13px 16px;
	min-height: 48px;
	transition: border-color .18s var(--ey-ease), box-shadow .18s var(--ey-ease);
}

body.eyewear-ux input:focus,
body.eyewear-ux textarea:focus,
body.eyewear-ux select:focus {
	border-color: var(--ey-gold);
	box-shadow: 0 0 0 4px rgba(198, 161, 91, .14);
	outline: none;
}

/* ---------- header polish ---------- */

body.eyewear-ux .elementor-location-header {
	position: relative;
	z-index: 60;
}

/* sticky shell, applied by JS once the user scrolls */
body.eyewear-ux .ey-header-sticky {
	position: sticky;
	top: 0;
	background: rgba(255, 255, 255, .97);
	backdrop-filter: saturate(180%) blur(14px);
	-webkit-backdrop-filter: saturate(180%) blur(14px);
	box-shadow: 0 10px 30px rgba(11, 18, 32, .1);
	transition: box-shadow .25s var(--ey-ease);
}


@keyframes ey-slide-down {
	from { transform: translateY(-100%); }
	to { transform: translateY(0); }
}

body.eyewear-ux.ey-has-sticky .elementor-location-header + * {
	/* keeps layout calm while the bar is fixed */
	scroll-margin-top: 90px;
}

/* top promo bar */
body.eyewear-ux .elementor-location-header .e-con > .e-con-inner > .elementor-widget-heading:only-child .elementor-heading-title {
	font-size: .82rem;
	font-weight: 500;
	letter-spacing: .2px;
}

/* search */
body.eyewear-ux .e-search .e-search-form {
	background: var(--ey-cream);
	border: 1.5px solid var(--ey-line);
	border-radius: var(--ey-radius-pill);
	overflow: hidden;
	transition: border-color .2s var(--ey-ease), box-shadow .2s var(--ey-ease), background .2s var(--ey-ease);
}

body.eyewear-ux .e-search .e-search-form:focus-within {
	background: #fff;
	border-color: var(--ey-gold);
	box-shadow: 0 0 0 4px rgba(198, 161, 91, .14);
}

body.eyewear-ux .e-search .e-search-input {
	background: transparent;
	border: 0;
	padding-inline: 18px;
	font-size: .93rem;
}

body.eyewear-ux .e-search .e-search-submit {
	color: var(--ey-ink);
}

/* cart widget */
body.eyewear-ux .elementor-menu-cart__toggle .elementor-button {
	background: var(--ey-ink);
	border-radius: var(--ey-radius-pill);
	color: #fff;
	padding: 10px 14px;
	transition: background .2s var(--ey-ease);
}

body.eyewear-ux .elementor-menu-cart__toggle .elementor-button:hover {
	background: var(--ey-gold-2);
}

body.eyewear-ux .elementor-menu-cart__toggle .elementor-button-icon[data-counter]::after {
	background: var(--ey-gold);
	color: #fff;
	font-weight: 700;
}

/* header quick actions injected by JS */
.ey-header-actions {
	display: flex;
	align-items: center;
	gap: 6px;
}

.ey-header-actions .ey-icon-btn {
	position: relative;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 42px;
	height: 42px;
	border-radius: 50%;
	color: var(--ey-ink);
	background: var(--ey-cream);
	border: 1px solid var(--ey-line);
	transition: background .2s var(--ey-ease), color .2s var(--ey-ease), transform .2s var(--ey-ease);
}

.ey-header-actions .ey-icon-btn:hover {
	background: var(--ey-ink);
	color: var(--ey-gold);
	transform: translateY(-1px);
}

.ey-header-actions .ey-icon-btn svg {
	width: 20px;
	height: 20px;
	fill: none;
	stroke: currentColor;
	stroke-width: 1.7;
	stroke-linecap: round;
	stroke-linejoin: round;
}

/* nav */
body.eyewear-ux .elementor-nav-menu--main .elementor-item {
	font-size: .95rem;
	font-weight: 600;
	color: var(--ey-ink-2);
	transition: color .18s var(--ey-ease);
}

body.eyewear-ux .elementor-nav-menu--main .elementor-item:hover,
body.eyewear-ux .elementor-nav-menu--main .elementor-item.elementor-item-active,
body.eyewear-ux .elementor-nav-menu--main .elementor-item.highlighted {
	color: var(--ey-gold-2);
}

body.eyewear-ux .elementor-nav-menu--main.e--pointer-text .elementor-item::after {
	background: var(--ey-gold);
}

/* dropdown + mobile drawer */
body.eyewear-ux .elementor-nav-menu--dropdown {
	background: #fff;
	border: 1px solid var(--ey-line);
	border-radius: var(--ey-radius-sm);
	box-shadow: var(--ey-shadow);
	padding: 8px;
}

body.eyewear-ux .elementor-nav-menu--dropdown .elementor-item {
	border-radius: 8px;
	padding: 10px 14px;
}

body.eyewear-ux .elementor-nav-menu--dropdown .elementor-item:hover {
	background: var(--ey-cream);
}

body.eyewear-ux .elementor-menu-toggle {
	border-radius: var(--ey-radius-sm);
	border: 1px solid var(--ey-line);
	color: var(--ey-ink);
	transition: background .2s var(--ey-ease);
}

body.eyewear-ux .elementor-menu-toggle:hover {
	background: var(--ey-cream);
}

/* ---------- injected merchandising sections ---------- */

.ey-section {
	padding: clamp(34px, 5vw, 64px) 0;
}

.ey-wrap {
	width: 100%;
	max-width: var(--ey-container);
	margin-inline: auto;
	padding-inline: clamp(16px, 4vw, 28px);
}

.ey-section--cream {
	background: var(--ey-cream);
}

.ey-section--ink {
	background: radial-gradient(120% 140% at 100% 0%, #1b2434 0%, var(--ey-ink) 55%);
	color: #e9edf5;
}

.ey-head {
	display: flex;
	align-items: flex-end;
	justify-content: space-between;
	gap: 16px;
	margin-bottom: clamp(20px, 3vw, 34px);
}

.ey-kicker {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	font-size: .8rem;
	font-weight: 700;
	letter-spacing: .4px;
	color: var(--ey-gold-2);
	text-transform: uppercase;
}

.ey-kicker::before {
	content: "";
	width: 22px;
	height: 2px;
	background: var(--ey-gold);
	border-radius: 2px;
}

.ey-title {
	margin: 6px 0 0;
	font-size: clamp(1.35rem, 2.6vw, 2rem);
	font-weight: 700;
	line-height: 1.5;
	color: var(--ey-ink);
}

.ey-section--ink .ey-title {
	color: #fff;
}

.ey-sub {
	margin: 8px 0 0;
	color: var(--ey-muted);
	font-size: .95rem;
	max-width: 56ch;
}

.ey-section--ink .ey-sub {
	color: #b9c2d1;
}

.ey-more {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	font-size: .9rem;
	font-weight: 700;
	color: var(--ey-gold-2);
	white-space: nowrap;
}

.ey-more svg {
	width: 16px;
	height: 16px;
	stroke: currentColor;
	fill: none;
	stroke-width: 2;
	transition: transform .2s var(--ey-ease);
}

.ey-more:hover svg {
	transform: translateX(-4px);
}

/* benefits strip */
.ey-benefits {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 14px;
}

.ey-benefit {
	display: flex;
	align-items: center;
	gap: 12px;
	padding: 16px 18px;
	background: #fff;
	border: 1px solid var(--ey-line);
	border-radius: var(--ey-radius);
	box-shadow: var(--ey-shadow-sm);
	transition: transform .2s var(--ey-ease), box-shadow .2s var(--ey-ease);
}

.ey-benefit:hover {
	transform: translateY(-3px);
	box-shadow: var(--ey-shadow);
}

.ey-benefit__icon {
	flex: 0 0 auto;
	display: grid;
	place-items: center;
	width: 44px;
	height: 44px;
	border-radius: 14px;
	background: var(--ey-gold-soft);
	color: var(--ey-gold-2);
}

.ey-benefit__icon svg {
	width: 22px;
	height: 22px;
	fill: none;
	stroke: currentColor;
	stroke-width: 1.6;
	stroke-linecap: round;
	stroke-linejoin: round;
}

.ey-benefit__title {
	font-size: .95rem;
	font-weight: 700;
	color: var(--ey-ink);
	line-height: 1.6;
}

.ey-benefit__desc {
	font-size: .8rem;
	color: var(--ey-muted);
	line-height: 1.7;
}

/* category tiles */
.ey-cats {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: var(--ey-gap);
}

.ey-cat {
	position: relative;
	display: block;
	overflow: hidden;
	border-radius: var(--ey-radius);
	aspect-ratio: 4 / 5;
	background: var(--ey-cream-2);
	box-shadow: var(--ey-shadow-sm);
	isolation: isolate;
}

.ey-cat img {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform .6s var(--ey-ease);
}

.ey-cat::after {
	content: "";
	position: absolute;
	inset: 0;
	background: linear-gradient(to top, rgba(11, 18, 32, .78) 0%, rgba(11, 18, 32, .18) 45%, rgba(11, 18, 32, 0) 75%);
	z-index: 1;
}

.ey-cat:hover img {
	transform: scale(1.06);
}

.ey-cat__body {
	position: absolute;
	inset-inline: 0;
	bottom: 0;
	z-index: 2;
	padding: 18px;
	color: #fff;
}

.ey-cat__name {
	font-size: 1.05rem;
	font-weight: 700;
	line-height: 1.6;
}

.ey-cat__meta {
	font-size: .78rem;
	color: rgba(255, 255, 255, .78);
}

.ey-cat__go {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	margin-top: 10px;
	font-size: .82rem;
	font-weight: 700;
	color: var(--ey-gold);
}

/* frame-shape pills */
.ey-shapes {
	display: grid;
	grid-template-columns: repeat(6, minmax(0, 1fr));
	gap: 12px;
}

.ey-shape {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 10px;
	padding: 16px 8px;
	background: #fff;
	border: 1px solid var(--ey-line);
	border-radius: var(--ey-radius);
	text-align: center;
	transition: transform .2s var(--ey-ease), border-color .2s var(--ey-ease), box-shadow .2s var(--ey-ease);
}

.ey-shape:hover {
	transform: translateY(-3px);
	border-color: var(--ey-gold);
	box-shadow: var(--ey-shadow);
}

.ey-shape img {
	width: 74px;
	height: 44px;
	object-fit: contain;
}

.ey-shape span {
	font-size: .82rem;
	font-weight: 600;
	color: var(--ey-ink-2);
}

/* testimonials */
.ey-quotes {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: var(--ey-gap);
}

.ey-quote {
	display: flex;
	flex-direction: column;
	gap: 14px;
	padding: 24px;
	background: #fff;
	border: 1px solid var(--ey-line);
	border-radius: var(--ey-radius);
	box-shadow: var(--ey-shadow-sm);
}

.ey-quote__stars {
	color: var(--ey-gold);
	letter-spacing: 2px;
	font-size: .9rem;
}

.ey-quote__text {
	margin: 0;
	font-size: .93rem;
	line-height: 2;
	color: var(--ey-text);
}

.ey-quote__who {
	display: flex;
	align-items: center;
	gap: 10px;
	margin-top: auto;
	padding-top: 12px;
	border-top: 1px dashed var(--ey-line);
}

.ey-avatar {
	display: grid;
	place-items: center;
	width: 38px;
	height: 38px;
	border-radius: 50%;
	background: var(--ey-gold-soft);
	color: var(--ey-gold-2);
	font-weight: 700;
	font-size: .9rem;
}

.ey-quote__name {
	font-size: .86rem;
	font-weight: 700;
	color: var(--ey-ink);
	line-height: 1.6;
}

.ey-quote__meta {
	font-size: .76rem;
	color: var(--ey-muted);
}

/* accordion (FAQ) */
.ey-accordion {
	display: grid;
	gap: 10px;
	max-width: 920px;
	margin-inline: auto;
}

.ey-acc {
	border: 1px solid var(--ey-line);
	border-radius: var(--ey-radius-sm);
	background: #fff;
	overflow: hidden;
	transition: border-color .2s var(--ey-ease), box-shadow .2s var(--ey-ease);
}

.ey-acc[open] {
	border-color: rgba(198, 161, 91, .5);
	box-shadow: 0 10px 26px rgba(11, 18, 32, .06);
}

.ey-acc__q {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 14px;
	padding: 16px 18px;
	font-size: .96rem;
	font-weight: 700;
	color: var(--ey-ink);
	cursor: pointer;
	list-style: none;
}

.ey-acc__q::-webkit-details-marker {
	display: none;
}

.ey-acc__q::after {
	content: "+";
	flex: 0 0 auto;
	display: grid;
	place-items: center;
	width: 26px;
	height: 26px;
	border-radius: 50%;
	background: var(--ey-cream);
	color: var(--ey-gold-2);
	font-size: 1.05rem;
	font-weight: 700;
	transition: transform .25s var(--ey-ease), background .25s var(--ey-ease);
}

.ey-acc[open] .ey-acc__q::after {
	content: "–";
	background: var(--ey-gold);
	color: #fff;
}

.ey-acc__a {
	padding: 0 18px 18px;
	font-size: .92rem;
	line-height: 2;
	color: var(--ey-muted);
}

/* newsletter */
.ey-news {
	display: grid;
	grid-template-columns: 1.1fr 1fr;
	align-items: center;
	gap: var(--ey-gap);
	padding: clamp(24px, 4vw, 44px);
	border-radius: 26px;
	background: linear-gradient(120deg, #131c2e 0%, #0b1220 100%);
	box-shadow: var(--ey-shadow-lg);
}

.ey-news .ey-title,
.ey-news .ey-sub {
	color: #fff;
}

.ey-news .ey-sub {
	color: #aeb9ca;
}

.ey-news__form {
	display: flex;
	gap: 10px;
	background: rgba(255, 255, 255, .06);
	border: 1px solid rgba(255, 255, 255, .14);
	border-radius: var(--ey-radius-pill);
	padding: 8px;
}

.ey-news__form input[type="email"] {
	flex: 1 1 auto;
	min-width: 0;
	background: transparent !important;
	border: 0 !important;
	box-shadow: none !important;
	color: #fff;
	padding: 10px 18px;
}

.ey-news__form input::placeholder {
	color: #97a3b6;
}

.ey-news__form .ey-btn {
	min-height: 44px;
	padding-inline: 22px;
	border-radius: var(--ey-radius-pill);
	white-space: nowrap;
}

.ey-news__note {
	margin: 12px 0 0;
	font-size: .76rem;
	color: #8c98ab;
}

.ey-alert {
	margin-top: 12px;
	font-size: .85rem;
	font-weight: 600;
	color: var(--ey-gold);
}

.ey-alert--err {
	color: #ff9b93;
}

/* trust strip used on shop / product */
.ey-trust {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 12px;
	margin: 22px 0;
}

.ey-trust__item {
	display: flex;
	align-items: center;
	gap: 10px;
	padding: 12px 14px;
	border: 1px solid var(--ey-line);
	border-radius: var(--ey-radius-sm);
	background: #fff;
	font-size: .84rem;
	font-weight: 600;
	color: var(--ey-ink-2);
}

.ey-trust__item svg {
	width: 20px;
	height: 20px;
	flex: 0 0 auto;
	fill: none;
	stroke: var(--ey-gold-2);
	stroke-width: 1.6;
	stroke-linecap: round;
	stroke-linejoin: round;
}

/* back to top */
.ey-top {
	position: fixed;
	inset-inline-start: 20px;
	bottom: 20px;
	z-index: 80;
	display: grid;
	place-items: center;
	width: 46px;
	height: 46px;
	border-radius: 50%;
	border: 1px solid var(--ey-line);
	background: #fff;
	color: var(--ey-ink);
	box-shadow: var(--ey-shadow);
	opacity: 0;
	visibility: hidden;
	transform: translateY(12px);
	transition: all .25s var(--ey-ease);
	cursor: pointer;
}

.ey-top.is-on {
	opacity: 1;
	visibility: visible;
	transform: translateY(0);
}

.ey-top:hover {
	background: var(--ey-ink);
	color: var(--ey-gold);
}

.ey-top svg {
	width: 20px;
	height: 20px;
	fill: none;
	stroke: currentColor;
	stroke-width: 2;
}

/* ---------- responsive ---------- */

@media (max-width: 1024px) {
	.ey-benefits {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.ey-cats {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.ey-shapes {
		grid-template-columns: repeat(3, minmax(0, 1fr));
	}

	.ey-quotes {
		grid-template-columns: 1fr;
	}

	.ey-news {
		grid-template-columns: 1fr;
	}
}

@media (max-width: 767px) {
	body.eyewear-ux {
		font-size: 15px;
		line-height: 1.9;
	}

	.ey-section {
		padding: 28px 0;
	}

	.ey-head {
		flex-direction: column;
		align-items: flex-start;
		gap: 10px;
	}

	.ey-cats {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: 12px;
	}

	.ey-cat {
		aspect-ratio: 3 / 4;
	}

	.ey-cat__body {
		padding: 12px;
	}

	.ey-cat__name {
		font-size: .92rem;
	}

	.ey-shapes {
		grid-template-columns: repeat(3, minmax(0, 1fr));
		gap: 10px;
	}

	.ey-shape {
		padding: 12px 6px;
	}

	.ey-shape img {
		width: 60px;
		height: 36px;
	}

	.ey-news__form {
		flex-direction: column;
		border-radius: var(--ey-radius);
	}

	.ey-news__form .ey-btn {
		width: 100%;
	}

	.ey-trust {
		grid-template-columns: 1fr;
	}

	.ey-top {
		width: 42px;
		height: 42px;
		inset-inline-start: 12px;
		bottom: 12px;
	}
}

@media (max-width: 420px) {
	.ey-benefits {
		grid-template-columns: 1fr;
	}
}

/* ---------- content pages (policies, contact, guides) ---------- */

.shopkit-page {
	max-width: var(--ey-container);
	margin-inline: auto;
	padding-inline: clamp(16px, 4vw, 28px);
}

.shopkit-hero {
	position: relative;
	margin: 0 0 clamp(24px, 4vw, 40px);
	padding: clamp(28px, 5vw, 56px) clamp(20px, 4vw, 44px);
	border-radius: 26px;
	background: radial-gradient(120% 140% at 100% 0%, #1b2434 0%, var(--ey-ink) 60%);
	color: #fff;
	overflow: hidden;
}

.shopkit-hero::after {
	content: "";
	position: absolute;
	inset-inline-start: -60px;
	bottom: -80px;
	width: 260px;
	height: 260px;
	border-radius: 50%;
	background: radial-gradient(circle, rgba(198, 161, 91, .35) 0%, rgba(198, 161, 91, 0) 70%);
}

.shopkit-hero h1,
.shopkit-hero h2 {
	position: relative;
	z-index: 1;
	margin: 0 0 10px;
	color: #fff;
	font-size: clamp(1.4rem, 3vw, 2.1rem);
	font-weight: 700;
	line-height: 1.5;
}

.shopkit-hero p {
	position: relative;
	z-index: 1;
	margin: 0;
	max-width: 62ch;
	color: #c3ccd9;
	font-size: .95rem;
	line-height: 2;
}

.shopkit-grid {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
	gap: var(--ey-gap);
	margin: 0 0 28px;
}

.shopkit-card {
	padding: 22px;
	border: 1px solid var(--ey-line);
	border-radius: var(--ey-radius);
	background: #fff;
	box-shadow: var(--ey-shadow-sm);
}

.shopkit-card h3 {
	margin: 0 0 8px;
	font-size: 1rem;
	font-weight: 700;
	color: var(--ey-ink);
}

.shopkit-card p {
	margin: 0;
	font-size: .88rem;
	color: var(--ey-muted);
	line-height: 1.95;
}

.shopkit-card a {
	color: var(--ey-gold-2);
	font-weight: 700;
}

.shopkit-note {
	padding: 16px 18px;
	border-inline-start: 4px solid var(--ey-gold);
	border-radius: var(--ey-radius-sm);
	background: var(--ey-gold-soft);
	font-size: .9rem;
	color: var(--ey-ink-2);
	margin: 0 0 24px;
}

/* contact form */
.ey-form {
	display: grid;
	gap: 16px;
	padding: clamp(20px, 3vw, 30px);
	border: 1px solid var(--ey-line);
	border-radius: var(--ey-radius);
	background: #fff;
	box-shadow: var(--ey-shadow-sm);
}

.ey-form__row {
	display: grid;
	gap: 6px;
}

.ey-form__row--split {
	grid-template-columns: 1fr 1fr;
	gap: 16px;
}

.ey-form label {
	font-size: .85rem;
	font-weight: 600;
	color: var(--ey-ink-2);
}

.ey-form input,
.ey-form select,
.ey-form textarea {
	width: 100%;
}

.ey-form .ey-btn {
	justify-self: start;
	min-width: 180px;
}

.ey-hp {
	position: absolute !important;
	inset-inline-start: -9999px;
	opacity: 0;
	height: 0;
	width: 0;
}

@media (max-width: 640px) {
	.ey-form__row--split {
		grid-template-columns: 1fr;
	}
}

/* product page delivery note + thank-you note */
.ey-delivery-note {
	display: flex;
	align-items: center;
	gap: 8px;
	margin: 0 0 14px;
	font-size: .84rem;
	color: var(--ey-ok);
	font-weight: 600;
}

.ey-thanks-note {
	padding: 16px 18px;
	margin: 0 0 20px;
	border-radius: var(--ey-radius-sm);
	background: var(--ey-cream);
	border: 1px solid var(--ey-line);
	font-size: .9rem;
	line-height: 2;
	color: var(--ey-ink-2);
}

.ey-thanks-note a {
	color: var(--ey-gold-2);
	font-weight: 700;
}

/* respect reduced motion */
@media (prefers-reduced-motion: reduce) {
	*,
	*::before,
	*::after {
		animation-duration: .001ms !important;
		transition-duration: .001ms !important;
		scroll-behavior: auto !important;
	}
}


/* ---------- compact header on tablet / phone ---------- */

@media (max-width: 1024px) {
	body.eyewear-ux .elementor-location-header .e-con-inner {
		flex-wrap: wrap !important;
		row-gap: 8px !important;
	}

	body.eyewear-ux .elementor-location-header .e-con-inner > .e-con-full:has(.elementor-widget-search) {
		flex: 1 1 100% !important;
		order: 9;
		max-width: 100% !important;
	}

	body.eyewear-ux .elementor-location-header .e-con-inner > .e-con-full:has(.elementor-widget-image) {
		flex: 0 1 auto !important;
		max-width: 60% !important;
	}

	body.eyewear-ux .elementor-location-header .e-con-inner > .e-con-full:has(.elementor-widget-woocommerce-menu-cart) {
		flex: 0 0 auto !important;
		width: auto !important;
		max-width: none !important;
		flex-direction: row !important;
		align-items: center;
		gap: 6px;
		margin-inline-start: auto;
	}

	body.eyewear-ux .elementor-location-header .elementor-widget-image img {
		max-height: 46px !important;
		width: auto !important;
	}

	body.eyewear-ux .elementor-location-header .elementor-widget-nav-menu {
		width: 100% !important;
	}

	body.eyewear-ux .elementor-location-header .elementor-menu-toggle {
		width: 100%;
		min-height: 44px;
		justify-content: center;
		gap: 8px;
		font-size: .9rem;
		font-weight: 600;
	}

	body.eyewear-ux .elementor-location-header .elementor-menu-toggle::before {
		content: "منو";
	}
}

@media (max-width: 480px) {
	body.eyewear-ux .ey-header-actions .ey-icon-btn {
		width: 38px;
		height: 38px;
	}

	body.eyewear-ux .elementor-location-header .elementor-widget-image img {
		max-height: 40px !important;
	}
}


/* phone: squeeze the header into three tidy rows */
@media (max-width: 767px) {
	body.eyewear-ux .elementor-location-header .e-con-inner > .e-con-full:has(.elementor-widget-woocommerce-menu-cart) {
		flex-wrap: nowrap !important;
	}

	body.eyewear-ux .elementor-location-header .e-con-inner > .e-con-full:has(.elementor-widget-image) {
		max-width: 44% !important;
	}

	/* the phone number lives in the footer + contact page on small screens */
	body.eyewear-ux .elementor-location-header .elementor-widget-icon {
		display: none !important;
	}

	body.eyewear-ux .elementor-location-header .e-search .e-search-input,
	body.eyewear-ux .elementor-location-header .e-search .e-search-form {
		min-height: 44px;
	}

	body.eyewear-ux .elementor-location-header .elementor-menu-cart__toggle .elementor-button {
		padding: 8px 12px;
	}

	body.eyewear-ux .elementor-location-header .elementor-widget-nav-menu .elementor-menu-toggle {
		min-height: 42px;
	}

	body.eyewear-ux .elementor-location-header > .elementor-element:first-child .e-con-inner {
		min-height: 26px;
	}

	body.eyewear-ux .elementor-location-header > .elementor-element:first-child .elementor-heading-title {
		font-size: .72rem !important;
	}
}


/* the header template uses large negative margins on some blocks to hide
   them; on phones we neutralise them so rows measure cleanly */
@media (max-width: 1024px) {
	body.eyewear-ux .elementor-location-header .e-con-inner > .e-con-full,
	body.eyewear-ux .elementor-location-header .e-con-inner > .elementor-element {
		margin-inline: 0 !important;
	}

	body.eyewear-ux .elementor-location-header .e-con-inner > .e-con-full:has(.elementor-widget-woocommerce-menu-cart) {
		margin-inline-start: auto !important;
	}
}


/* ---------- mobile drawer + search toggle ---------- */

body.eyewear-ux .ey-menu-btn {
	display: none;
}

@media (max-width: 1024px) {
	/* the Elementor nav row is replaced by the drawer on small screens */
	body.eyewear-ux .elementor-location-header > .elementor-element:has(.elementor-widget-nav-menu) {
		display: none !important;
	}

	body.eyewear-ux .ey-menu-btn {
		display: inline-flex;
	}

	/* search collapses behind its icon, expands to a full row */
	body.eyewear-ux .elementor-location-header .e-con-inner > .e-con-full:has(.elementor-widget-search) {
		display: none !important;
	}

	body.eyewear-ux.ey-search-open .elementor-location-header .e-con-inner > .e-con-full:has(.elementor-widget-search) {
		display: flex !important;
		flex: 1 1 100% !important;
		order: 9;
	}
}

.ey-drawer {
	position: fixed;
	inset: 0;
	z-index: 200;
	visibility: hidden;
	pointer-events: none;
}

.ey-drawer__backdrop {
	position: absolute;
	inset: 0;
	background: rgba(11, 18, 32, .45);
	backdrop-filter: blur(2px);
	opacity: 0;
	transition: opacity .28s var(--ey-ease);
}

.ey-drawer__panel {
	position: absolute;
	inset-block: 0;
	inset-inline-start: 0;
	width: min(360px, 88vw);
	display: flex;
	flex-direction: column;
	background: #fff;
	box-shadow: -20px 0 50px rgba(11, 18, 32, .18);
	transform: translateX(100%);
	transition: transform .3s var(--ey-ease);
	overflow-y: auto;
}

body.ey-drawer-open .ey-drawer {
	visibility: visible;
	pointer-events: auto;
}

body.ey-drawer-open .ey-drawer__backdrop {
	opacity: 1;
}

body.ey-drawer-open .ey-drawer__panel {
	transform: translateX(0);
}

.ey-drawer__head {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 16px 18px;
	border-bottom: 1px solid var(--ey-line);
	position: sticky;
	top: 0;
	background: #fff;
	z-index: 2;
}

.ey-drawer__head strong {
	font-size: 1rem;
	color: var(--ey-ink);
}

.ey-drawer__close {
	display: grid;
	place-items: center;
	width: 38px;
	height: 38px;
	border: 1px solid var(--ey-line);
	border-radius: 50%;
	background: var(--ey-cream);
	color: var(--ey-ink);
	font-size: 1.2rem;
	cursor: pointer;
}

.ey-drawer__nav {
	padding: 10px;
}

.ey-drawer__nav ul {
	list-style: none;
	margin: 0;
	padding: 0;
}

.ey-drawer__nav > ul > li {
	border-bottom: 1px solid var(--ey-line);
}

.ey-drawer__row {
	display: flex;
	align-items: center;
	justify-content: space-between;
}

.ey-drawer__row > a {
	flex: 1 1 auto;
	padding: 13px 8px;
	font-size: .94rem;
	font-weight: 600;
	color: var(--ey-ink);
}

.ey-drawer__sub-btn {
	display: grid;
	place-items: center;
	width: 32px;
	height: 32px;
	border: 1px solid var(--ey-line);
	border-radius: 8px;
	background: #fff;
	color: var(--ey-gold-2);
	font-size: 1rem;
	font-weight: 700;
	cursor: pointer;
}

.ey-drawer__sub {
	display: none;
	padding: 0 8px 8px !important;
}

.ey-drawer__sub.is-open {
	display: block;
}

.ey-drawer__sub li a {
	display: block;
	padding: 9px 12px;
	font-size: .86rem;
	color: var(--ey-muted);
	border-radius: 8px;
	background: var(--ey-cream);
	margin-bottom: 6px;
}

.ey-drawer__foot {
	margin-top: auto;
	padding: 16px 18px calc(20px + env(safe-area-inset-bottom));
	border-top: 1px solid var(--ey-line);
	background: var(--ey-cream);
	display: grid;
	gap: 8px;
}

.ey-drawer__foot a {
	display: flex;
	align-items: center;
	gap: 8px;
	font-size: .88rem;
	font-weight: 600;
	color: var(--ey-ink-2);
}

.ey-drawer__foot a.ey-btn {
	justify-content: center;
	color: #fff;
}

.ey-drawer__phone {
	font-size: .84rem;
	color: var(--ey-muted);
	direction: ltr;
	text-align: end;
}


@media (max-width: 767px) {
	body.eyewear-ux .elementor-location-header .e-con-inner {
		row-gap: 6px !important;
		align-items: center !important;
	}

	body.eyewear-ux .ey-header-actions {
		gap: 4px;
	}

	body.eyewear-ux .ey-header-actions .ey-icon-btn {
		width: 38px;
		height: 38px;
	}

	body.eyewear-ux .ey-header-actions .ey-icon-btn svg {
		width: 18px;
		height: 18px;
	}

	body.eyewear-ux .elementor-location-header .elementor-menu-cart__toggle .elementor-button {
		min-height: 38px;
		padding: 6px 10px;
	}

	body.eyewear-ux .elementor-location-header .e-con-inner > .e-con-full:has(.elementor-widget-image) {
		max-width: 38% !important;
	}
}


@media (max-width: 767px) {
	body.eyewear-ux .elementor-location-header .e-con-inner > .e-con-full:has(.elementor-widget-woocommerce-menu-cart),
	body.eyewear-ux .elementor-location-header .e-con-inner > .e-con-full:has(.ey-header-actions) {
		flex-wrap: nowrap !important;
		align-items: center !important;
	}

	body.eyewear-ux .ey-header-actions {
		flex-wrap: nowrap;
	}

	body.eyewear-ux .elementor-location-header .elementor-menu-cart__toggle .elementor-button-icon {
		font-size: 1rem;
	}
}


/* ---------- desktop nav row: tighter ---------- */

@media (min-width: 1025px) {
	body.eyewear-ux .elementor-location-header > .elementor-element:has(.elementor-widget-nav-menu) .e-con-inner {
		padding-block: 0 !important;
		min-height: 54px;
	}

	body.eyewear-ux .elementor-location-header .elementor-widget-nav-menu .elementor-nav-menu--main {
		height: 100%;
	}

	body.eyewear-ux .elementor-location-header .elementor-nav-menu--main .elementor-item {
		padding-block: 14px;
	}
}

.ey-product-extra {
	margin: 18px 0 4px;
}


/* footer menu labels rendered as links by the JS layer */
body.eyewear-ux footer .elementor-heading-title a {
	color: inherit;
	transition: color .18s var(--ey-ease);
}

body.eyewear-ux footer .elementor-heading-title a:hover {
	color: var(--ey-gold);
}

body.eyewear-ux .ey-drawer__sub-btn {
	width: 38px;
	height: 36px;
}


/* ---------- blog / magazine ---------- */

body.eyewear-ux.single-post .page-content {
	max-width: 820px;
	margin-inline: auto;
	padding-block: clamp(18px, 3vw, 34px);
}

body.eyewear-ux.single-post .page-content h1,
body.eyewear-ux.single-post .page-content h2 {
	font-size: clamp(1.25rem, 2.2vw, 1.6rem);
	font-weight: 700;
	color: var(--ey-ink);
	line-height: 1.6;
	margin: 1.9em 0 .6em;
}

body.eyewear-ux.single-post .page-content h1 {
	font-size: clamp(1.5rem, 3vw, 2.1rem);
	margin-top: 0;
}

body.eyewear-ux.single-post .page-content p,
body.eyewear-ux.single-post .page-content li {
	font-size: .97rem;
	line-height: 2.1;
	color: var(--ey-text);
}

body.eyewear-ux.single-post .page-content ul,
body.eyewear-ux.single-post .page-content ol {
	padding-inline-start: 1.3em;
	margin-bottom: 1.2em;
}

body.eyewear-ux.blog .page-content:has(article.post),
body.eyewear-ux.archive:not(.post-type-archive-product):not(.woocommerce) .page-content:has(article.post) {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(290px, 1fr));
	gap: clamp(16px, 2vw, 26px);
	max-width: var(--ey-container);
	margin-inline: auto;
	padding-inline: clamp(16px, 4vw, 28px);
}

body.eyewear-ux main article.post {
	display: flex;
	flex-direction: column;
	gap: 10px;
	padding: clamp(18px, 2.4vw, 26px);
	background: #fff;
	border: 1px solid var(--ey-line);
	border-radius: var(--ey-radius);
	box-shadow: var(--ey-shadow-sm);
	transition: transform .22s var(--ey-ease), box-shadow .22s var(--ey-ease);
	margin: 0;
}

body.eyewear-ux main article.post:hover {
	transform: translateY(-3px);
	box-shadow: var(--ey-shadow);
}

body.eyewear-ux main article.post .entry-title {
	margin: 0;
	font-size: 1.02rem;
	font-weight: 700;
	line-height: 1.8;
}

body.eyewear-ux main article.post .entry-title a {
	color: var(--ey-ink);
}

body.eyewear-ux main article.post p {
	margin: 0;
	font-size: .88rem;
	line-height: 2;
	color: var(--ey-muted);
}

body.eyewear-ux main article.post .entry-meta,
body.eyewear-ux main article.post time {
	font-size: .76rem;
	color: var(--ey-muted);
	margin-top: auto;
}

body.eyewear-ux main article.post a.more-link,
body.eyewear-ux main article.post .read-more {
	font-size: .84rem;
	font-weight: 700;
	color: var(--ey-gold-2);
}


/* ---------- top bar + cart button: keep the light text on dark bg ---------- */

body.eyewear-ux .ey-topbar a,
body.eyewear-ux .ey-topbar .ey-topbar__meta a {
	color: #e8edf5;
}

body.eyewear-ux .ey-topbar a:hover {
	color: var(--ey-gold);
}

body.eyewear-ux .ey-act--cart,
body.eyewear-ux .ey-act--cart .ey-act__label,
body.eyewear-ux .ey-act--cart svg {
	color: #fff !important;
}

body.eyewear-ux .ey-act--cart:hover,
body.eyewear-ux .ey-act--cart:hover .ey-act__label {
	color: #fff !important;
}

/* ---------- brand strip (fallback for brands without a photo) ---------- */

.ey-brands {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	margin: 0 auto;
	max-width: var(--ey-container);
	padding: 4px clamp(16px, 4vw, 28px) 0;
}

.ey-brand {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 64px;
	min-width: 132px;
	padding: 10px 18px;
	border: 1px solid var(--ey-line);
	border-radius: 14px;
	background: #fff;
	color: var(--ey-ink) !important;
	font-size: .84rem;
	font-weight: 700;
	text-align: center;
	line-height: 1.6;
	box-shadow: var(--ey-shadow-sm);
	transition: transform .2s var(--ey-ease), border-color .2s var(--ey-ease), box-shadow .2s var(--ey-ease);
}

.ey-brand:hover {
	transform: translateY(-2px);
	border-color: rgba(198, 161, 91, .6);
	box-shadow: var(--ey-shadow);
}

.ey-brand img {
	max-height: 40px;
	width: auto;
	object-fit: contain;
}

@media (max-width: 767px) {
	.ey-brand {
		min-width: 104px;
		min-height: 54px;
		font-size: .78rem;
		padding: 8px 12px;
	}
}


/* front page: this heading lost its dark hero backdrop — keep it readable */
body.eyewear-ux.home .elementor-element-b0e469d .elementor-heading-title,
body.eyewear-ux.home .elementor-element-4d9f1e1 .elementor-heading-title {
	color: var(--ey-ink) !important;
}
