/* Layer: 00-fonts.css */
/* Erpin design system - self-hosted webfonts. Generated, do not edit by hand. */
/* latin-ext */
@font-face {
  font-family: 'Jost';
  font-style: normal;
  font-weight: 300 600;
  font-display: swap;
  src: url('../fonts/erpin/jost-300-600-latin-ext.woff2') format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}


/* latin */
@font-face {
  font-family: 'Jost';
  font-style: normal;
  font-weight: 300 600;
  font-display: swap;
  src: url('../fonts/erpin/jost-300-600-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}


/* Layer: 01-tokens.css */
/* ==========================================================================
   ERPIN DESIGN SYSTEM — 01 TOKENS
   IM Diamond storefront. Single source of truth for colour, type, space.

   NOTE: url() paths in this layer resolve relative to /assets/css/ because
   the build concatenates every layer into /assets/css/erpin.build.css.
   ========================================================================== */

:root {
	/* ---------------------------------------------------------------
	   Colour — white ground, cool neutrals, IM red.

	   The first build used a warm champagne page colour and large black
	   surfaces. The champagne muddied the photography and the black forced
	   the red wordmark to be knocked out to white, which loses the brand
	   colour entirely. The palette is now white-first: the only saturated
	   colour on the page is the logo red, and it is used for action.
	   --------------------------------------------------------------- */
	--e-red:            #d90d15;   /* IM Diamond logo red */
	--e-red-hover:      #b30a11;
	--e-red-press:      #900810;
	--e-red-tint:       #fef2f2;
	--e-red-line:       #f4cfd1;

	--e-ink:            #16171b;   /* body copy — cool near-black */
	--e-ink-2:          #4a4d55;   /* secondary copy */
	/* #71747d measured 4.28:1 on --e-surface-2 — under the 4.5:1 floor for body
	   text. Darkened to clear it on both surfaces (5.02 on white, 4.61 on the
	   tinted one) without changing the greyness of the palette. */
	--e-muted:          #6c6f78;   /* meta, labels, captions */
	--e-muted-2:        #a2a5ad;   /* disabled, hint */

	--e-paper:          #ffffff;   /* page background */
	--e-surface:        #ffffff;   /* panels, inputs */
	--e-surface-2:      #f5f5f7;   /* recessed panel, image bed */
	--e-surface-3:      #eaeaee;   /* stronger fill */

	--e-line:           #e7e7ea;   /* hairline */
	--e-line-2:         #d3d4d9;   /* emphasised hairline */
	--e-line-dark:      rgba(22, 23, 27, .12);

	/* Reserved for the two dark surfaces that remain: the announcement
	   strip and scrims laid over photography. Not a page background. */
	--e-black:          #16171b;

	--e-success:        #17724a;
	--e-success-bg:     #eff7f2;
	--e-warning:        #8a5a12;
	--e-warning-bg:     #fdf6e9;

	--e-focus:          #1c6fd0;   /* focus ring — must not be brand red so
	                                  that it stays visible on red buttons */

	/* ---------------------------------------------------------------
	   Typography — one family.

	   The first build paired Cormorant Garamond for display. At the sizes
	   product titles need it reads as a light, almost handwritten face and
	   its italic made it worse. Jost carries the whole scale: geometric
	   enough to feel considered, plain enough to stay legible at 16px, and
	   one variable file instead of five.
	   --------------------------------------------------------------- */
	--e-font-display: "Jost", ui-sans-serif, system-ui, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
	--e-font-text:    "Jost", ui-sans-serif, system-ui, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;

	/* Body never drops below 16px on any breakpoint. */
	--e-fs-2xs:  12px;  /* legal microcopy only */
	--e-fs-xs:   13px;  /* eyebrow caps, badges */
	--e-fs-sm:   15px;  /* dense UI: table cells, meta */
	--e-fs-base: 17px;  /* body copy, desktop */
	--e-fs-md:   19px;
	--e-fs-lg:   22px;
	--e-fs-xl:   26px;

	/* Fluid display scale. A sans reads optically larger than a serif at the
	   same size, so the whole scale sits a step below the previous one. */
	--e-d1: clamp(2.375rem, 1.5rem + 4.2vw, 4.75rem);  /* 38 → 76 hero */
	--e-d2: clamp(1.875rem, 1.35rem + 2.2vw, 3rem);    /* 30 → 48 section */
	--e-d3: clamp(1.5rem, 1.2rem + 1.4vw, 2.25rem);    /* 24 → 36 block */
	--e-d4: clamp(1.3125rem, 1.15rem + 0.8vw, 1.75rem);/* 21 → 28 card */

	/* Display weight is light, not bold: at these sizes 300 is what makes
	   a geometric sans read as considered rather than loud. */
	--e-w-display: 300;

	--e-lh-tight:  1.06;
	--e-lh-snug:   1.22;
	--e-lh-normal: 1.5;
	--e-lh-relax:  1.72;

	--e-ls-caps:   .16em;   /* eyebrows, nav caps */
	--e-ls-caps-s: .09em;   /* buttons */
	--e-ls-display:-.022em; /* tighter: geometric caps need it */

	--e-w-light:  300;
	--e-w-normal: 400;
	--e-w-medium: 500;
	--e-w-semi:   600;

	/* ---------------------------------------------------------------
	   Space — 4px base, but the large steps are what create the calm.
	   --------------------------------------------------------------- */
	--e-s1:  4px;
	--e-s2:  8px;
	--e-s3:  12px;
	--e-s4:  16px;
	--e-s5:  20px;
	--e-s6:  24px;
	--e-s7:  32px;
	--e-s8:  40px;
	--e-s9:  48px;
	--e-s10: 64px;
	--e-s11: 80px;
	--e-s12: 96px;
	--e-s13: 128px;
	--e-s14: 160px;

	/* Section rhythm: three sizes so consecutive blocks can breathe
	   differently and the page does not read as a stack of equal slabs. */
	--e-sect-sm: clamp(48px, 6vw, 72px);
	--e-sect-md: clamp(64px, 8vw, 104px);
	--e-sect-lg: clamp(80px, 11vw, 152px);

	/* ---------------------------------------------------------------
	   Layout
	   --------------------------------------------------------------- */
	--e-gutter: 20px;
	--e-max:    1440px;   /* full shell */
	--e-max-rd: 1180px;   /* reading / commerce forms */
	--e-max-pr: 760px;    /* prose */
	--e-header-h: 0px;    /* set at runtime by JS for sticky offsets */

	/* ---------------------------------------------------------------
	   Shape & depth — near-flat. Radii stay under 4px so nothing reads
	   as a "card UI"; elevation is expressed with hairlines, not shadow.
	   --------------------------------------------------------------- */
	--e-r-none: 0;
	--e-r-xs:   2px;
	--e-r-sm:   3px;
	--e-r-pill: 999px;

	--e-shadow-1: 0 1px 2px rgba(23, 20, 15, .05);
	--e-shadow-2: 0 12px 32px -18px rgba(23, 20, 15, .30);
	--e-shadow-3: 0 28px 64px -28px rgba(23, 20, 15, .38);

	/* ---------------------------------------------------------------
	   Motion
	   --------------------------------------------------------------- */
	--e-ease:      cubic-bezier(.22, .61, .36, 1);
	--e-ease-out:  cubic-bezier(.16, 1, .3, 1);
	--e-dur-1: 140ms;
	--e-dur-2: 240ms;
	--e-dur-3: 420ms;
	--e-dur-4: 640ms;

	/* ---------------------------------------------------------------
	   Elevation order
	   --------------------------------------------------------------- */
	--e-z-base:      1;
	--e-z-sticky:    50;
	--e-z-header:    100;
	--e-z-dropdown:  120;
	--e-z-overlay:   200;
	--e-z-drawer:    210;
	--e-z-modal:     300;
	--e-z-toast:     400;

	/* Media aspect ratios */
	--e-ar-product: 4 / 5;
	--e-ar-wide:    16 / 9;
	--e-ar-editorial: 3 / 4;
}

@media (min-width: 768px) {
	:root { --e-gutter: 32px; }
}

@media (min-width: 1280px) {
	:root { --e-gutter: 48px; }
}

/* Mobile keeps 16px body — never smaller. */
@media (max-width: 767px) {
	:root {
		--e-fs-base: 16px;
		--e-fs-md:   18px;
		--e-fs-lg:   20px;
		--e-fs-xl:   23px;
	}
}

@media (prefers-reduced-motion: reduce) {
	:root {
		--e-dur-1: 1ms;
		--e-dur-2: 1ms;
		--e-dur-3: 1ms;
		--e-dur-4: 1ms;
	}
}

/* Layer: 02-base.css */
/* ==========================================================================
   ERPIN DESIGN SYSTEM — 02 BASE
   Reset + typography. Deliberately opinionated: this replaces the vendor
   theme stylesheet rather than layering on top of it.
   ========================================================================== */

*,
*::before,
*::after { box-sizing: border-box; }

html {
	-webkit-text-size-adjust: 100%;
	text-size-adjust: 100%;
	scroll-behavior: smooth;
	scroll-padding-top: calc(var(--e-header-h) + 24px);
	tab-size: 4;
}

@media (prefers-reduced-motion: reduce) {
	html { scroll-behavior: auto; }
}

body {
	margin: 0;
	background: var(--e-paper);
	color: var(--e-ink);
	font-family: var(--e-font-text);
	font-size: var(--e-fs-base);
	font-weight: var(--e-w-normal);
	line-height: var(--e-lh-relax);
	font-synthesis-weight: none;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	overflow-x: clip;
}

body.e-scroll-locked {
	overflow: hidden;
	/* Compensating for the scrollbar keeps the sticky header from jumping
	   when a drawer or modal opens. */
	padding-right: var(--e-scrollbar-w, 0px);
}

h1, h2, h3, h4, h5, h6 {
	margin: 0;
	font-weight: var(--e-w-normal);
	line-height: var(--e-lh-snug);
	color: inherit;
	text-wrap: balance;
}

p, ul, ol, dl, figure, blockquote, pre, table { margin: 0; }

img, picture, video, canvas, svg {
	display: block;
	max-width: 100%;
}

img { height: auto; border-style: none; }

svg { fill: currentColor; }

a {
	color: inherit;
	text-decoration: none;
	transition: color var(--e-dur-1) var(--e-ease),
	            opacity var(--e-dur-1) var(--e-ease),
	            border-color var(--e-dur-1) var(--e-ease);
}

button, input, select, textarea, optgroup {
	font: inherit;
	color: inherit;
	margin: 0;
}

button { background: none; border: 0; padding: 0; cursor: pointer; }

ul, ol { padding: 0; list-style: none; }

hr {
	border: 0;
	border-top: 1px solid var(--e-line);
	margin: var(--e-s9) 0;
}

table { border-collapse: collapse; width: 100%; }

::selection {
	background: var(--e-red);
	color: #fff;
}

/* --------------------------------------------------------------------------
   Focus. Visible, high-contrast, and never removed. Mouse users do not see
   it because of :focus-visible, so we can afford to make it loud.
   -------------------------------------------------------------------------- */
:focus { outline: none; }

:focus-visible {
	outline: 2px solid var(--e-focus);
	outline-offset: 3px;
	border-radius: var(--e-r-xs);
}

.e-skip-link {
	position: absolute;
	left: 50%;
	top: 0;
	transform: translate(-50%, -120%);
	z-index: var(--e-z-toast);
	background: var(--e-ink);
	color: #fff;
	padding: 14px 26px;
	font-size: var(--e-fs-sm);
	letter-spacing: var(--e-ls-caps-s);
	text-transform: uppercase;
	transition: transform var(--e-dur-2) var(--e-ease-out);
}

.e-skip-link:focus-visible { transform: translate(-50%, 0); }

.e-sr-only {
	position: absolute !important;
	width: 1px; height: 1px;
	padding: 0; margin: -1px;
	overflow: hidden;
	clip: rect(0 0 0 0);
	clip-path: inset(50%);
	white-space: nowrap;
	border: 0;
}

/* --------------------------------------------------------------------------
   Type roles. Classes, not element selectors, so WordPress content and
   WooCommerce markup can opt in without fighting specificity.
   -------------------------------------------------------------------------- */
.e-display-1,
.e-display-2,
.e-display-3,
.e-display-4 {
	font-family: var(--e-font-display);
	font-weight: var(--e-w-display);
	letter-spacing: var(--e-ls-display);
	line-height: var(--e-lh-tight);
}

.e-display-1 { font-size: var(--e-d1); }
.e-display-2 { font-size: var(--e-d2); line-height: 1.1; }
.e-display-3 { font-size: var(--e-d3); line-height: 1.14; }
.e-display-4 { font-size: var(--e-d4); line-height: 1.2; }

/* Eyebrow: the small caps line above a heading. Used everywhere, so it
   carries a lot of the "editorial" signal. */
.e-eyebrow {
	display: block;
	font-size: var(--e-fs-xs);
	font-weight: var(--e-w-medium);
	letter-spacing: var(--e-ls-caps);
	text-transform: uppercase;
	color: var(--e-muted);
	line-height: 1.4;
}

.e-eyebrow--red { color: var(--e-red); }

.e-lead {
	font-size: var(--e-fs-md);
	line-height: 1.65;
	color: var(--e-ink-2);
	font-weight: var(--e-w-light);
}

.e-meta {
	font-size: var(--e-fs-sm);
	color: var(--e-muted);
	line-height: 1.5;
}

.e-caps {
	text-transform: uppercase;
	letter-spacing: var(--e-ls-caps);
	font-size: var(--e-fs-xs);
	font-weight: var(--e-w-medium);
}

/* --------------------------------------------------------------------------
   Prose — for WordPress editor output (legal pages, blog body, category
   descriptions). One place that owns long-form rhythm.
   -------------------------------------------------------------------------- */
.e-prose {
	font-size: var(--e-fs-base);
	line-height: var(--e-lh-relax);
	color: var(--e-ink-2);
}

.e-prose > * + * { margin-top: 1.15em; }

.e-prose h1,
.e-prose h2,
.e-prose h3,
.e-prose h4 {
	color: var(--e-ink);
	font-family: var(--e-font-display);
	font-weight: var(--e-w-display);
	letter-spacing: var(--e-ls-display);
	margin-top: 1.9em;
	line-height: 1.2;
}

.e-prose h2 { font-size: var(--e-d4); }
.e-prose h3 { font-size: var(--e-fs-xl); }
.e-prose h4 {
	font-size: var(--e-fs-lg);
	font-family: var(--e-font-text);
	font-weight: var(--e-w-medium);
	letter-spacing: 0;
}

.e-prose > :first-child { margin-top: 0; }

.e-prose a {
	color: var(--e-ink);
	border-bottom: 1px solid var(--e-red);
	padding-bottom: 1px;
}

.e-prose a:hover { color: var(--e-red); }

.e-prose strong { font-weight: var(--e-w-medium); color: var(--e-ink); }

.e-prose ul,
.e-prose ol { padding-left: 1.3em; }

.e-prose ul { list-style: none; }

.e-prose ul > li { position: relative; padding-left: 4px; }

.e-prose ul > li::before {
	content: "";
	position: absolute;
	left: -1.05em;
	top: .78em;
	width: 5px; height: 5px;
	background: var(--e-red);
	border-radius: 50%;
}

.e-prose ol { list-style: decimal; }

.e-prose li + li { margin-top: .5em; }

.e-prose blockquote {
	border-left: 2px solid var(--e-red);
	padding: var(--e-s2) 0 var(--e-s2) var(--e-s6);
	font-family: var(--e-font-display);
	font-size: var(--e-fs-xl);
	line-height: 1.4;
	color: var(--e-ink);
}

.e-prose img { margin-block: var(--e-s8); }

.e-prose table {
	font-size: var(--e-fs-sm);
	border: 1px solid var(--e-line);
	background: var(--e-surface);
}

.e-prose th,
.e-prose td {
	padding: var(--e-s3) var(--e-s4);
	border-bottom: 1px solid var(--e-line);
	text-align: left;
}

.e-prose th {
	font-weight: var(--e-w-medium);
	color: var(--e-ink);
	background: var(--e-surface-2);
}

/* Long legal documents get a narrower measure so they stay readable. */
.e-prose--narrow { max-width: 72ch; }

/*
 * Editor content is a decade of pasted markup: fixed-width tables, old
 * shortcode grids, embedded iframes with pixel widths. Nothing inside prose
 * may push the document wider than the viewport.
 */
.e-prose > *,
.e-prose iframe,
.e-prose embed,
.e-prose object,
.e-prose video,
.e-prose pre { max-width: 100%; }

.e-prose table {
	display: block;
	max-width: 100%;
	overflow-x: auto;
	-webkit-overflow-scrolling: touch;
}

.e-prose td,
.e-prose th { min-width: 8ch; }

.e-prose [style*="width"] { max-width: 100% !important; }
.e-prose [width] { max-width: 100%; height: auto; }

/* --------------------------------------------------------------------------
   Print
   -------------------------------------------------------------------------- */
@media print {
	.e-header, .e-footer, .e-announce, .e-drawer, .e-overlay,
	.e-fab, .e-cookie { display: none !important; }
	body { background: #fff; color: #000; }
}

/* --------------------------------------------------------------------------
   Icon sprite
   -------------------------------------------------------------------------- */
.e-sprite { position: absolute; width: 0; height: 0; overflow: hidden; }

.e-icon { display: block; flex: none; }
.e-icon--stroke { fill: none; stroke: currentColor; }
.e-icon--brand { fill: currentColor; stroke: none; }

/* Layer: 03-layout.css */
/* ==========================================================================
   ERPIN DESIGN SYSTEM — 03 LAYOUT
   Shell, containers, section rhythm, generic grids.
   ========================================================================== */

.e-shell {
	display: flex;
	flex-direction: column;
	min-height: 100vh;
	min-height: 100dvh;
}

.e-main { flex: 1 0 auto; }

/* --------------------------------------------------------------------------
   Containers
   -------------------------------------------------------------------------- */
.e-container,
.e-container-rd,
.e-container-pr {
	width: 100%;
	margin-inline: auto;
	padding-inline: var(--e-gutter);
}

.e-container    { max-width: calc(var(--e-max) + var(--e-gutter) * 2); }
.e-container-rd { max-width: calc(var(--e-max-rd) + var(--e-gutter) * 2); }
.e-container-pr { max-width: calc(var(--e-max-pr) + var(--e-gutter) * 2); }

/* Bleed to the viewport edge while keeping the inner grid aligned. */
.e-bleed { width: 100%; }

/* --------------------------------------------------------------------------
   Section rhythm. Three densities, applied deliberately so the homepage
   does not read as equal-height slabs.
   -------------------------------------------------------------------------- */
.e-section    { padding-block: var(--e-sect-md); }
.e-section-sm { padding-block: var(--e-sect-sm); }
.e-section-lg { padding-block: var(--e-sect-lg); }
.e-section-flush-top    { padding-top: 0; }
.e-section-flush-bottom { padding-bottom: 0; }

.e-section--paper   { background: var(--e-paper); }
.e-section--surface { background: var(--e-surface); }
.e-section--warm    { background: var(--e-surface-2); }
.e-section--ink     { background: var(--e-black); color: #fff; }

.e-section--ink .e-eyebrow { color: rgba(255, 255, 255, .6); }
.e-section--ink .e-lead    { color: rgba(255, 255, 255, .74); }

/* Section header: eyebrow + title on the left, an optional link on the
   right that drops below the title on small screens. */
.e-sect-head {
	display: flex;
	align-items: flex-end;
	justify-content: space-between;
	gap: var(--e-s6);
	margin-bottom: var(--e-s9);
}

.e-sect-head__text { max-width: 62ch; }

.e-sect-head__title {
	font-family: var(--e-font-display);
	font-size: var(--e-d3);
	font-weight: var(--e-w-display);
	letter-spacing: var(--e-ls-display);
	line-height: 1.12;
	margin-top: var(--e-s3);
}

.e-sect-head__desc {
	margin-top: var(--e-s4);
	color: var(--e-ink-2);
	font-weight: var(--e-w-light);
	max-width: 56ch;
}

.e-sect-head--center {
	flex-direction: column;
	align-items: center;
	text-align: center;
}

.e-sect-head--center .e-sect-head__desc { margin-inline: auto; }

@media (max-width: 767px) {
	.e-sect-head {
		flex-direction: column;
		align-items: flex-start;
		gap: var(--e-s4);
		margin-bottom: var(--e-s7);
	}
}

/* --------------------------------------------------------------------------
   Grids
   -------------------------------------------------------------------------- */
.e-grid {
	display: grid;
	gap: var(--e-s7) var(--e-s6);
}

.e-grid--2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.e-grid--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.e-grid--4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }

@media (max-width: 1023px) {
	.e-grid--4 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

@media (max-width: 767px) {
	.e-grid--3,
	.e-grid--4 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.e-grid { gap: var(--e-s6) var(--e-s4); }
}

/* Two-column content shell used by shop (filters + results) and account. */
.e-split {
	display: grid;
	grid-template-columns: 264px minmax(0, 1fr);
	gap: var(--e-s10);
	align-items: start;
}

@media (max-width: 1023px) {
	.e-split { grid-template-columns: minmax(0, 1fr); gap: var(--e-s7); }
}

/* --------------------------------------------------------------------------
   Media frames. Aspect-ratio is declared up-front on every image bed so
   nothing reflows once the photo decodes (CLS = 0).
   -------------------------------------------------------------------------- */
.e-frame {
	position: relative;
	display: block;
	overflow: hidden;
	background: var(--e-surface-2);
}

.e-frame > img,
.e-frame > picture > img,
.e-frame > video {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.e-frame--product   { aspect-ratio: var(--e-ar-product); }
.e-frame--square    { aspect-ratio: 1 / 1; }
.e-frame--wide      { aspect-ratio: var(--e-ar-wide); }
.e-frame--editorial { aspect-ratio: var(--e-ar-editorial); }

/* Slow, restrained zoom. 1.04 not 1.12 — jewellery should not lurch. */
.e-frame--zoom > img {
	transition: transform var(--e-dur-4) var(--e-ease-out);
	will-change: transform;
}

@media (hover: hover) {
	a:hover > .e-frame--zoom > img,
	.e-frame--zoom:hover > img { transform: scale(1.04); }
}

/* --------------------------------------------------------------------------
   Horizontal scrollers for touch. Used by category rails, thumbnails and
   filter chips. Scroll-snap gives it a deliberate feel instead of drift.
   -------------------------------------------------------------------------- */
.e-scroller {
	display: flex;
	gap: var(--e-s4);
	overflow-x: auto;
	overscroll-behavior-x: contain;
	scroll-snap-type: x mandatory;
	-webkit-overflow-scrolling: touch;
	scrollbar-width: none;
}

.e-scroller::-webkit-scrollbar { display: none; }
.e-scroller > * { scroll-snap-align: start; flex: 0 0 auto; }

/* Edge-to-edge scroller that still lines up with the container gutter. */
.e-scroller--bleed {
	margin-inline: calc(var(--e-gutter) * -1);
	padding-inline: var(--e-gutter);
}

/* --------------------------------------------------------------------------
   Utility
   -------------------------------------------------------------------------- */
.e-stack > * + * { margin-top: var(--e-s4); }
.e-stack-lg > * + * { margin-top: var(--e-s7); }

.e-hide            { display: none !important; }
@media (max-width: 767px)  { .e-hide-mobile  { display: none !important; } }
@media (min-width: 768px)  { .e-hide-desktop { display: none !important; } }
@media (max-width: 1023px) { .e-hide-tablet  { display: none !important; } }

.e-rule {
	border: 0;
	border-top: 1px solid var(--e-line);
	margin: 0;
}

/* Layer: 04-components.css */
/* ==========================================================================
   ERPIN DESIGN SYSTEM — 04 COMPONENTS
   Buttons, forms, badges, notices, tables, accordions, tabs, breadcrumbs,
   pagination, drawers, modals, tooltips.

   Touch rule: every interactive element is at least 44x44 CSS px, and no
   function is reachable only through :hover.
   ========================================================================== */

/* --------------------------------------------------------------------------
   Buttons
   -------------------------------------------------------------------------- */
.e-btn {
	--btn-bg: var(--e-ink);
	--btn-fg: #fff;
	--btn-bd: var(--e-ink);
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 10px;
	min-height: 52px;
	padding: 14px 30px;
	background: var(--btn-bg);
	color: var(--btn-fg);
	border: 1px solid var(--btn-bd);
	border-radius: var(--e-r-none);
	font-family: var(--e-font-text);
	font-size: var(--e-fs-sm);
	font-weight: var(--e-w-medium);
	letter-spacing: var(--e-ls-caps-s);
	text-transform: uppercase;
	line-height: 1;
	text-align: center;
	cursor: pointer;
	transition: background var(--e-dur-2) var(--e-ease),
	            color var(--e-dur-2) var(--e-ease),
	            border-color var(--e-dur-2) var(--e-ease),
	            transform var(--e-dur-1) var(--e-ease);
	-webkit-appearance: none;
	appearance: none;
}

.e-btn:hover  { --btn-bg: var(--e-red); --btn-bd: var(--e-red); --btn-fg: #fff; }
.e-btn:active { transform: translateY(1px); }

.e-btn[disabled],
.e-btn.is-disabled,
.e-btn:disabled {
	--btn-bg: var(--e-surface-3);
	--btn-bd: var(--e-surface-3);
	--btn-fg: var(--e-muted-2);
	cursor: not-allowed;
	pointer-events: none;
}

/* Primary commerce action — the only place brand red is a fill. */
.e-btn--primary { --btn-bg: var(--e-red); --btn-bd: var(--e-red); --btn-fg: #fff; }
.e-btn--primary:hover { --btn-bg: var(--e-red-hover); --btn-bd: var(--e-red-hover); }

.e-btn--outline { --btn-bg: transparent; --btn-bd: var(--e-line-2); --btn-fg: var(--e-ink); }
.e-btn--outline:hover { --btn-bg: var(--e-ink); --btn-bd: var(--e-ink); --btn-fg: #fff; }

.e-btn--ghost { --btn-bg: transparent; --btn-bd: transparent; --btn-fg: var(--e-ink); }
.e-btn--ghost:hover { --btn-bg: var(--e-surface-2); --btn-bd: var(--e-surface-2); --btn-fg: var(--e-ink); }

.e-btn--light { --btn-bg: #fff; --btn-bd: #fff; --btn-fg: var(--e-ink); }
.e-btn--light:hover { --btn-bg: var(--e-red); --btn-bd: var(--e-red); --btn-fg: #fff; }

.e-btn--on-dark { --btn-bg: transparent; --btn-bd: rgba(255,255,255,.5); --btn-fg: #fff; }
.e-btn--on-dark:hover { --btn-bg: #fff; --btn-bd: #fff; --btn-fg: var(--e-ink); }

.e-btn--sm  { min-height: 44px; padding: 11px 20px; font-size: var(--e-fs-xs); }
.e-btn--lg  { min-height: 60px; padding: 18px 40px; }
.e-btn--block { display: flex; width: 100%; }

.e-btn__icon { width: 18px; height: 18px; flex: none; }

/* Loading state for AJAX actions. */
.e-btn.is-loading { color: transparent !important; position: relative; pointer-events: none; }
.e-btn.is-loading::after {
	content: "";
	position: absolute;
	inset: 50% auto auto 50%;
	width: 18px; height: 18px;
	margin: -9px 0 0 -9px;
	border: 2px solid currentColor;
	border-top-color: transparent;
	border-radius: 50%;
	color: var(--btn-fg);
	animation: e-spin .7s linear infinite;
}

@keyframes e-spin { to { transform: rotate(360deg); } }

/* Quiet text link with an underline that grows from the left. */
.e-link {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	position: relative;
	font-size: var(--e-fs-sm);
	font-weight: var(--e-w-medium);
	letter-spacing: var(--e-ls-caps-s);
	text-transform: uppercase;
	padding-bottom: 4px;
	color: var(--e-ink);
}

.e-link::after {
	content: "";
	position: absolute;
	left: 0; right: 0; bottom: 0;
	height: 1px;
	background: currentColor;
	transform-origin: left;
	transition: transform var(--e-dur-2) var(--e-ease);
}

@media (hover: hover) {
	.e-link::after { transform: scaleX(1); }
	.e-link:hover { color: var(--e-red); }
	.e-link:hover::after { transform: scaleX(0); transform-origin: right; }
}

.e-link--inline {
	text-transform: none;
	letter-spacing: 0;
	font-size: inherit;
	font-weight: var(--e-w-normal);
}

/* Icon-only control (header actions, close buttons, carousel arrows). */
.e-iconbtn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 44px; height: 44px;
	border-radius: 50%;
	color: var(--e-ink);
	background: transparent;
	border: 1px solid transparent;
	cursor: pointer;
	position: relative;
	transition: background var(--e-dur-1) var(--e-ease), color var(--e-dur-1) var(--e-ease);
}

.e-iconbtn:hover { background: var(--e-surface-2); }
.e-iconbtn svg { width: 21px; height: 21px; }
.e-iconbtn--bordered { border-color: var(--e-line); background: var(--e-surface); }
.e-iconbtn--on-dark { color: #fff; }
.e-iconbtn--on-dark:hover { background: rgba(255,255,255,.14); }

.e-iconbtn__count {
	position: absolute;
	top: 3px; right: 1px;
	min-width: 18px; height: 18px;
	padding: 0 5px;
	border-radius: var(--e-r-pill);
	background: var(--e-red);
	color: #fff;
	font-size: 11px;
	font-weight: var(--e-w-medium);
	line-height: 18px;
	text-align: center;
	letter-spacing: 0;
}

/* --------------------------------------------------------------------------
   Badges / labels
   -------------------------------------------------------------------------- */
.e-badge {
	display: inline-flex;
	align-items: center;
	height: 24px;
	padding: 0 10px;
	font-size: 11px;
	font-weight: var(--e-w-medium);
	letter-spacing: var(--e-ls-caps);
	text-transform: uppercase;
	background: var(--e-ink);
	color: #fff;
	white-space: nowrap;
}

.e-badge--red     { background: var(--e-red); }
.e-badge--quiet   { background: var(--e-surface-3); color: var(--e-ink-2); }
.e-badge--outline { background: transparent; color: var(--e-ink); border: 1px solid var(--e-line-2); }

/* --------------------------------------------------------------------------
   Forms
   -------------------------------------------------------------------------- */
.e-field { display: block; }

.e-field + .e-field { margin-top: var(--e-s5); }

.e-label {
	display: block;
	margin-bottom: 8px;
	font-size: var(--e-fs-sm);
	font-weight: var(--e-w-medium);
	color: var(--e-ink);
	letter-spacing: .01em;
}

.e-label small,
.e-label .e-optional {
	font-weight: var(--e-w-normal);
	color: var(--e-muted);
	text-transform: none;
	letter-spacing: 0;
	margin-left: 6px;
	font-size: var(--e-fs-sm);
}

.e-label .required,
.e-required { color: var(--e-red); text-decoration: none; }

.e-input,
.e-select,
.e-textarea,
input[type="text"], input[type="email"], input[type="tel"], input[type="url"],
input[type="password"], input[type="search"], input[type="number"], input[type="date"],
select, textarea {
	width: 100%;
	min-height: 52px;
	padding: 13px 16px;
	background: var(--e-surface);
	border: 1px solid var(--e-line-2);
	border-radius: var(--e-r-none);
	color: var(--e-ink);
	font-family: var(--e-font-text);
	/* 16px minimum stops iOS Safari zooming the page on focus. */
	font-size: 16px;
	line-height: 1.4;
	transition: border-color var(--e-dur-1) var(--e-ease), box-shadow var(--e-dur-1) var(--e-ease);
	-webkit-appearance: none;
	appearance: none;
}

textarea, .e-textarea { min-height: 132px; padding-top: 14px; resize: vertical; }

input::placeholder,
textarea::placeholder { color: var(--e-muted-2); opacity: 1; }

.e-input:hover, .e-select:hover, .e-textarea:hover,
input:hover:not([type="checkbox"]):not([type="radio"]), select:hover, textarea:hover {
	border-color: var(--e-ink-2);
}

.e-input:focus, .e-select:focus, .e-textarea:focus,
input:focus:not([type="checkbox"]):not([type="radio"]), select:focus, textarea:focus {
	outline: none;
	border-color: var(--e-ink);
	box-shadow: 0 0 0 3px rgba(23, 20, 15, .08);
}

.e-input[aria-invalid="true"],
.e-field.has-error .e-input,
.woocommerce-invalid input.input-text,
.woocommerce-invalid select {
	border-color: var(--e-red);
	box-shadow: 0 0 0 3px var(--e-red-tint);
}

.e-field__error {
	display: block;
	margin-top: 6px;
	font-size: var(--e-fs-sm);
	color: var(--e-red);
}

.e-field__hint {
	display: block;
	margin-top: 6px;
	font-size: var(--e-fs-sm);
	color: var(--e-muted);
}

/* Native select needs its own chevron once appearance is stripped. */
select,
.e-select {
	padding-right: 44px;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8' fill='none'%3E%3Cpath d='M1 1.5 6 6.5l5-5' stroke='%2317140f' stroke-width='1.4' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-position: right 16px center;
	cursor: pointer;
}

/* Checkbox / radio */
.e-check {
	display: flex;
	align-items: flex-start;
	gap: 12px;
	min-height: 44px;
	padding-block: 10px;
	cursor: pointer;
	font-size: var(--e-fs-sm);
	line-height: 1.5;
	color: var(--e-ink-2);
}

.e-check input[type="checkbox"],
.e-check input[type="radio"] {
	flex: none;
	width: 20px; height: 20px;
	margin: 1px 0 0;
	border: 1px solid var(--e-line-2);
	background: var(--e-surface);
	-webkit-appearance: none;
	appearance: none;
	cursor: pointer;
	transition: background var(--e-dur-1) var(--e-ease), border-color var(--e-dur-1) var(--e-ease);
}

.e-check input[type="radio"] { border-radius: 50%; }

.e-check input:checked {
	background-color: var(--e-ink);
	border-color: var(--e-ink);
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='10' viewBox='0 0 12 10' fill='none'%3E%3Cpath d='M1 5.2 4.4 8.6 11 1.6' stroke='white' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-position: center;
}

.e-check input[type="radio"]:checked {
	background-image: none;
	box-shadow: inset 0 0 0 4px var(--e-surface);
}

.e-check:hover input { border-color: var(--e-ink-2); }

/* Quantity stepper — big enough to use with a thumb. */
.e-qty {
	display: inline-flex;
	align-items: stretch;
	border: 1px solid var(--e-line-2);
	background: var(--e-surface);
	height: 52px;
}

.e-qty button {
	width: 46px;
	display: flex;
	align-items: center;
	justify-content: center;
	color: var(--e-ink-2);
	font-size: 18px;
	line-height: 1;
	transition: background var(--e-dur-1) var(--e-ease);
}

.e-qty button:hover { background: var(--e-surface-2); color: var(--e-ink); }
.e-qty button:disabled { color: var(--e-muted-2); cursor: not-allowed; }

.e-qty input {
	width: 54px;
	min-height: 0;
	height: auto;
	border: 0;
	border-inline: 1px solid var(--e-line);
	text-align: center;
	padding: 0;
	font-size: var(--e-fs-sm);
	font-weight: var(--e-w-medium);
	-moz-appearance: textfield;
}

.e-qty input::-webkit-outer-spin-button,
.e-qty input::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
.e-qty input:focus { box-shadow: none; }

/* --------------------------------------------------------------------------
   Notices
   -------------------------------------------------------------------------- */
.e-notice {
	display: flex;
	align-items: flex-start;
	gap: 12px;
	padding: 16px 18px;
	border: 1px solid var(--e-line);
	border-left: 3px solid var(--e-ink);
	background: var(--e-surface);
	font-size: var(--e-fs-sm);
	line-height: 1.55;
	color: var(--e-ink-2);
}

.e-notice + .e-notice { margin-top: var(--e-s3); }
.e-notice strong { color: var(--e-ink); font-weight: var(--e-w-medium); }
.e-notice svg { flex: none; width: 20px; height: 20px; margin-top: 1px; }

.e-notice--success { border-left-color: var(--e-success); background: var(--e-success-bg); color: #1c4f36; }
.e-notice--error   { border-left-color: var(--e-red); background: var(--e-red-tint); color: #7b1418; }
.e-notice--warning { border-left-color: var(--e-warning); background: var(--e-warning-bg); color: #6b4610; }

/* --------------------------------------------------------------------------
   Tables — used by cart, order details, size charts.
   -------------------------------------------------------------------------- */
.e-table {
	width: 100%;
	font-size: var(--e-fs-sm);
	border-collapse: collapse;
}

.e-table th {
	padding: 0 var(--e-s4) var(--e-s3);
	text-align: left;
	font-size: var(--e-fs-xs);
	font-weight: var(--e-w-medium);
	letter-spacing: var(--e-ls-caps);
	text-transform: uppercase;
	color: var(--e-muted);
	border-bottom: 1px solid var(--e-line-2);
}

.e-table td {
	padding: var(--e-s5) var(--e-s4);
	border-bottom: 1px solid var(--e-line);
	vertical-align: top;
}

.e-table th:first-child, .e-table td:first-child { padding-left: 0; }
.e-table th:last-child,  .e-table td:last-child  { padding-right: 0; text-align: right; }

/* Definition rows — order totals, product specs. */
.e-defs { display: grid; gap: 0; }

.e-defs__row {
	display: flex;
	align-items: baseline;
	justify-content: space-between;
	gap: var(--e-s5);
	padding: 14px 0;
	border-bottom: 1px solid var(--e-line);
	font-size: var(--e-fs-sm);
}

.e-defs__row:last-child { border-bottom: 0; }
.e-defs__key { color: var(--e-muted); }
.e-defs__val { color: var(--e-ink); font-weight: var(--e-w-medium); text-align: right; }

.e-defs__row--total {
	border-top: 1px solid var(--e-ink);
	border-bottom: 0;
	padding-top: var(--e-s5);
	margin-top: var(--e-s2);
	font-size: var(--e-fs-md);
}

.e-defs__row--total .e-defs__key { color: var(--e-ink); font-weight: var(--e-w-medium); }
.e-defs__row--total .e-defs__val { font-size: var(--e-fs-lg); }

/* --------------------------------------------------------------------------
   Accordion — filters, product tabs on mobile, FAQ.
   -------------------------------------------------------------------------- */
.e-acc { border-top: 1px solid var(--e-line); }
.e-acc__item { border-bottom: 1px solid var(--e-line); }

.e-acc__trigger {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: var(--e-s4);
	width: 100%;
	min-height: 56px;
	padding: 16px 0;
	text-align: left;
	font-size: var(--e-fs-base);
	font-weight: var(--e-w-medium);
	color: var(--e-ink);
	cursor: pointer;
}

.e-acc__trigger:hover { color: var(--e-red); }

.e-acc__chevron {
	flex: none;
	width: 14px; height: 14px;
	position: relative;
}

.e-acc__chevron::before,
.e-acc__chevron::after {
	content: "";
	position: absolute;
	background: currentColor;
	transition: transform var(--e-dur-2) var(--e-ease), opacity var(--e-dur-2) var(--e-ease);
}

.e-acc__chevron::before { inset: 6px 0 auto; height: 1.5px; }
.e-acc__chevron::after  { inset: 0 6px auto; width: 1.5px; height: 14px; }

.e-acc__trigger[aria-expanded="true"] .e-acc__chevron::after { transform: scaleY(0); opacity: 0; }

.e-acc__panel {
	display: grid;
	grid-template-rows: 0fr;
	transition: grid-template-rows var(--e-dur-3) var(--e-ease);
}

.e-acc__panel > div { overflow: hidden; }
.e-acc__item.is-open > .e-acc__panel { grid-template-rows: 1fr; }
.e-acc__body { padding-bottom: var(--e-s6); }

/* --------------------------------------------------------------------------
   Tabs
   -------------------------------------------------------------------------- */
.e-tabs__list {
	display: flex;
	gap: var(--e-s7);
	border-bottom: 1px solid var(--e-line);
	overflow-x: auto;
	scrollbar-width: none;
}

.e-tabs__list::-webkit-scrollbar { display: none; }

.e-tabs__tab {
	flex: none;
	position: relative;
	min-height: 52px;
	padding: 14px 0;
	font-size: var(--e-fs-sm);
	font-weight: var(--e-w-medium);
	letter-spacing: var(--e-ls-caps-s);
	text-transform: uppercase;
	color: var(--e-muted);
	white-space: nowrap;
	cursor: pointer;
}

.e-tabs__tab::after {
	content: "";
	position: absolute;
	left: 0; right: 0; bottom: -1px;
	height: 2px;
	background: var(--e-red);
	transform: scaleX(0);
	transform-origin: left;
	transition: transform var(--e-dur-2) var(--e-ease);
}

.e-tabs__tab:hover { color: var(--e-ink); }
.e-tabs__tab[aria-selected="true"] { color: var(--e-ink); }
.e-tabs__tab[aria-selected="true"]::after { transform: scaleX(1); }

.e-tabs__panel { padding-top: var(--e-s7); }
.e-tabs__panel[hidden] { display: none; }

/* --------------------------------------------------------------------------
   Breadcrumbs
   -------------------------------------------------------------------------- */
.e-crumbs {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 6px 10px;
	font-size: var(--e-fs-sm);
	color: var(--e-muted);
	line-height: 1.4;
}

.e-crumbs .pls-breadcrumb {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 4px 8px;
}

/* Breadcrumb links get a 40px tap row without changing the visual rhythm. */
.e-crumbs a,
.e-crumbs .last {
	display: inline-flex;
	align-items: center;
	min-height: 40px;
	color: var(--e-muted);
}

.e-crumbs a:hover { color: var(--e-red); }

/* The vendor breadcrumb emits empty <span> delimiters that an icon font used
   to fill. The design system draws them with a pseudo-element instead. */
.e-crumbs .pls-delimiter-sep::before,
.e-crumbs .e-crumbs__sep::before {
	content: "/";
	color: var(--e-line-2);
}

.e-crumbs [aria-current="page"],
.e-crumbs .breadcrumb_last,
.e-crumbs .last { color: var(--e-ink); }

@media (max-width: 991px) {
	/* Keep breadcrumbs on one swipeable line rather than wrapping to three. */
	.e-crumbs {
		flex-wrap: nowrap;
		min-width: 0;
		overflow-x: auto;
		overscroll-behavior-inline: contain;
		scrollbar-width: none;
		margin-inline: calc(var(--e-gutter) * -1);
		padding-inline: var(--e-gutter);
	}
	.e-crumbs::-webkit-scrollbar { display: none; }
	.e-crumbs .pls-breadcrumb { flex: 0 0 auto; width: max-content; flex-wrap: nowrap; white-space: nowrap; }
	.e-crumbs .pls-breadcrumb > * { flex: none; white-space: nowrap; }
}

/* --------------------------------------------------------------------------
   Pagination
   -------------------------------------------------------------------------- */
.e-pager {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 6px;
	flex-wrap: wrap;
}

.e-pager a,
.e-pager span {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 46px; height: 46px;
	padding: 0 12px;
	font-size: var(--e-fs-sm);
	color: var(--e-ink-2);
	border: 1px solid transparent;
	transition: border-color var(--e-dur-1) var(--e-ease), color var(--e-dur-1) var(--e-ease);
}

.e-pager a:hover { border-color: var(--e-line-2); color: var(--e-ink); }

.e-pager .current {
	border-color: var(--e-ink);
	color: var(--e-ink);
	font-weight: var(--e-w-medium);
}

.e-pager .dots { border: 0; color: var(--e-muted-2); min-width: 24px; }

/* --------------------------------------------------------------------------
   Overlay + drawer + modal
   -------------------------------------------------------------------------- */
.e-overlay {
	position: fixed;
	inset: 0;
	background: rgba(12, 10, 8, .48);
	backdrop-filter: blur(2px);
	opacity: 0;
	visibility: hidden;
	z-index: var(--e-z-overlay);
	transition: opacity var(--e-dur-3) var(--e-ease), visibility var(--e-dur-3) var(--e-ease);
}

.e-overlay.is-open { opacity: 1; visibility: visible; }

.e-drawer {
	position: fixed;
	top: 0; bottom: 0;
	width: min(420px, 100vw);
	max-width: 100vw;
	background: var(--e-surface);
	z-index: var(--e-z-drawer);
	display: flex;
	flex-direction: column;
	visibility: hidden;
	transition: transform var(--e-dur-3) var(--e-ease-out), visibility var(--e-dur-3) var(--e-ease-out);
	box-shadow: var(--e-shadow-3);
}

.e-drawer--right { right: 0; transform: translateX(100%); }
.e-drawer--left  { left: 0;  transform: translateX(-100%); }
.e-drawer.is-open { transform: translateX(0); visibility: visible; }

.e-drawer__head {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: var(--e-s4);
	padding: var(--e-s5) var(--e-s6);
	border-bottom: 1px solid var(--e-line);
	flex: none;
}

.e-drawer__title {
	font-size: var(--e-fs-sm);
	font-weight: var(--e-w-medium);
	letter-spacing: var(--e-ls-caps);
	text-transform: uppercase;
}

.e-drawer__body {
	flex: 1 1 auto;
	overflow-y: auto;
	overscroll-behavior: contain;
	-webkit-overflow-scrolling: touch;
}

.e-drawer__foot {
	flex: none;
	padding: var(--e-s6);
	border-top: 1px solid var(--e-line);
	background: var(--e-surface);
	/* Keeps the checkout button clear of the iOS home indicator. */
	padding-bottom: max(var(--e-s6), env(safe-area-inset-bottom));
}

.e-modal {
	position: fixed;
	inset: 0;
	z-index: var(--e-z-modal);
	display: grid;
	place-items: center;
	padding: var(--e-s5);
	opacity: 0;
	visibility: hidden;
	transition: opacity var(--e-dur-2) var(--e-ease), visibility var(--e-dur-2) var(--e-ease);
}

.e-modal.is-open { opacity: 1; visibility: visible; }

.e-modal__backdrop { position: absolute; inset: 0; background: rgba(12, 10, 8, .58); }

.e-modal__panel {
	position: relative;
	width: min(720px, 100%);
	max-height: min(88vh, 900px);
	display: flex;
	flex-direction: column;
	background: var(--e-surface);
	box-shadow: var(--e-shadow-3);
	transform: translateY(14px) scale(.99);
	transition: transform var(--e-dur-3) var(--e-ease-out);
}

.e-modal.is-open .e-modal__panel { transform: none; }

.e-modal__head {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: var(--e-s4);
	padding: var(--e-s6);
	border-bottom: 1px solid var(--e-line);
	flex: none;
}

.e-modal__title {
	font-family: var(--e-font-display);
	font-size: var(--e-fs-xl);
	font-weight: var(--e-w-display);
}

.e-modal__body {
	padding: var(--e-s6);
	overflow-y: auto;
	overscroll-behavior: contain;
}

@media (max-width: 640px) {
	/* On phones a bottom sheet beats a centred dialog: it is reachable and
	   it does not fight the on-screen keyboard. */
	.e-modal { place-items: end center; padding: 0; }
	.e-modal__panel {
		width: 100%;
		max-height: 92dvh;
		transform: translateY(100%);
	}
	.e-modal__body { padding-bottom: max(var(--e-s6), env(safe-area-inset-bottom)); }
}

/* --------------------------------------------------------------------------
   Empty states
   -------------------------------------------------------------------------- */
.e-empty {
	max-width: 52ch;
	margin-inline: auto;
	padding-block: var(--e-sect-md);
	text-align: center;
}

.e-empty__mark {
	width: 56px; height: 56px;
	margin: 0 auto var(--e-s6);
	color: var(--e-line-2);
}

.e-empty__title {
	font-family: var(--e-font-display);
	font-size: var(--e-d4);
	font-weight: var(--e-w-display);
	margin-bottom: var(--e-s4);
}

.e-empty__text { color: var(--e-ink-2); font-weight: var(--e-w-light); }
.e-empty__actions { margin-top: var(--e-s8); display: flex; gap: var(--e-s3); justify-content: center; flex-wrap: wrap; }

/* Layer: 05-header.css */
/* ==========================================================================
   ERPIN DESIGN SYSTEM — 05 HEADER
   Announcement bar, header, mega menu, search panel, drawers, mini cart.
   ========================================================================== */

/* --------------------------------------------------------------------------
   Announcement bar
   -------------------------------------------------------------------------- */
.e-announce {
	background: var(--e-red);
	color: rgba(255, 255, 255, .92);
	font-size: var(--e-fs-xs);
	letter-spacing: .05em;
}

.e-announce__inner {
	display: grid;
	grid-template-columns: 1fr auto 1fr;
	align-items: center;
	gap: var(--e-s4);
	min-height: 40px;
}

.e-announce__side {
	display: flex;
	align-items: center;
	gap: var(--e-s5);
	margin: 0;
}

.e-announce__side--end { justify-content: flex-end; }

.e-announce__side a {
	display: inline-flex;
	align-items: center;
	gap: 7px;
	color: rgba(255, 255, 255, .82);
	padding-block: 10px;
}

.e-announce__side a:hover { color: #fff; }

.e-announce__lang {
	position: relative;
	font-weight: var(--e-w-medium);
	letter-spacing: .04em;
}

.e-announce__flag {
	display: inline-flex;
	width: 19px;
	height: 13px;
	line-height: 1;
	flex: none;
	border-radius: 2px;
	overflow: hidden;
	box-shadow: 0 0 0 1px rgba(255, 255, 255, .22);
}

.e-lang-flag { display: block; width: 100%; height: 100%; }

.e-announce__lang + .e-announce__lang { margin-left: var(--e-s3); }
.e-announce__lang.is-active { color: #fff; }

.e-announce__lang.is-active::after {
	content: "";
	position: absolute;
	left: 0; right: 0; bottom: 6px;
	height: 1px;
	background: #fff;
}

/* The rotator stacks all messages and cross-fades between them; height is
   driven by the tallest so the bar never jumps. */
.e-announce__rotator {
	display: grid;
	justify-items: center;
	text-align: center;
	min-height: 40px;
	align-items: center;
}

.e-announce__msg {
	grid-area: 1 / 1;
	margin: 0;
	opacity: 0;
	transform: translateY(4px);
	transition: opacity var(--e-dur-3) var(--e-ease), transform var(--e-dur-3) var(--e-ease);
	pointer-events: none;
	letter-spacing: .07em;
}

.e-announce__msg.is-active { opacity: 1; transform: none; pointer-events: auto; }

@media (max-width: 767px) {
	.e-announce__inner { grid-template-columns: 1fr; }
	.e-announce__rotator { min-height: 40px; }
	.e-announce__msg { font-size: 13px; letter-spacing: .04em; }
}

/* --------------------------------------------------------------------------
   Header
   -------------------------------------------------------------------------- */
.e-header {
	position: sticky;
	top: 0;
	z-index: var(--e-z-header);
	background: var(--e-paper);
	border-bottom: 1px solid var(--e-line);
	transition: box-shadow var(--e-dur-2) var(--e-ease);
}

/*
 * The search panel is a child of the header, so it inherits the header's
 * stacking context and can never rise above the shared overlay on its own.
 * While search is open the whole header is lifted past the backdrop.
 */
.is-panel-search .e-header { z-index: var(--e-z-drawer); }

.e-header.is-stuck { box-shadow: 0 1px 0 var(--e-line), 0 10px 26px -22px rgba(23, 20, 15, .5); }

.e-header__grid {
	display: grid;
	grid-template-columns: 1fr auto 1fr;
	align-items: center;
	gap: var(--e-s4);
	min-height: 96px;
	transition: min-height var(--e-dur-3) var(--e-ease);
}

.e-header.is-condensed .e-header__grid { min-height: 68px; }

.e-header__side { display: flex; align-items: center; gap: var(--e-s2); }
.e-header__side--end { justify-content: flex-end; }

.e-header__brand { margin: 0; display: flex; justify-content: center; }

.e-header__logo img {
	width: auto;
	height: 46px;
	transition: height var(--e-dur-3) var(--e-ease);
	object-fit: contain;
}

.e-header.is-condensed .e-header__logo img { height: 34px; }

.e-header__search-trigger {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	min-height: 44px;
	padding: 0 14px 0 10px;
	color: var(--e-ink);
	font-size: var(--e-fs-sm);
	letter-spacing: .01em;
	border-radius: var(--e-r-pill);
	transition: background var(--e-dur-1) var(--e-ease);
}

.e-header__search-trigger:hover { background: var(--e-surface-2); }

.e-header__util {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	min-height: 44px;
	padding: 0 12px;
	font-size: var(--e-fs-sm);
	color: var(--e-ink-2);
}

.e-header__util:hover { color: var(--e-red); }

/* ---- Primary nav row ---- */
.e-header__navrow {
	border-top: 1px solid var(--e-line);
	transition: max-height var(--e-dur-3) var(--e-ease), opacity var(--e-dur-2) var(--e-ease);
	overflow: visible;
}

.e-nav__list {
	display: flex;
	justify-content: center;
	gap: var(--e-s2);
	flex-wrap: wrap;
}

.e-nav__item { position: static; }

.e-nav__link {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	min-height: 52px;
	padding: 0 var(--e-s5);
	font-size: var(--e-fs-xs);
	font-weight: var(--e-w-medium);
	letter-spacing: var(--e-ls-caps);
	text-transform: uppercase;
	color: var(--e-ink);
	position: relative;
	white-space: nowrap;
}

.e-header.is-condensed .e-nav__link { min-height: 44px; }

.e-nav__link::after {
	content: "";
	position: absolute;
	left: var(--e-s5); right: var(--e-s5); bottom: 12px;
	height: 1px;
	background: var(--e-red);
	transform: scaleX(0);
	transform-origin: center;
	transition: transform var(--e-dur-2) var(--e-ease);
}

.e-nav__item:hover > .e-nav__link::after,
.e-nav__item.is-current > .e-nav__link::after,
.e-nav__link[aria-expanded="true"]::after { transform: scaleX(1); }

.e-nav__caret {
	opacity: .5;
	transition: transform var(--e-dur-2) var(--e-ease);
}

.e-nav__link[aria-expanded="true"] .e-nav__caret { transform: rotate(180deg); }

.e-nav__item--accent > .e-nav__link { color: var(--e-red); }

/* Keep the six-item Turkish navigation on one deliberate row on compact
 * desktop widths. Mobile navigation takes over below 1024px. */
@media (min-width: 1024px) and (max-width: 1365px) {
	.e-nav__list {
		gap: var(--e-s1);
		flex-wrap: nowrap;
	}

	.e-nav__link {
		padding-inline: 8px;
		letter-spacing: .12em;
	}
}

/* ---- Mega panel ---- */
.e-mega {
	position: absolute;
	left: 0; right: 0;
	top: 100%;
	background: var(--e-surface);
	border-top: 1px solid var(--e-line);
	border-bottom: 1px solid var(--e-line);
	box-shadow: var(--e-shadow-2);
	opacity: 0;
	visibility: hidden;
	transform: translateY(-6px);
	transition: opacity var(--e-dur-2) var(--e-ease), transform var(--e-dur-2) var(--e-ease), visibility var(--e-dur-2);
	z-index: var(--e-z-dropdown);
}

.e-mega[hidden] { display: block; }        /* animated, not removed */
.e-mega.is-open { opacity: 1; visibility: visible; transform: none; }

.e-mega__inner { padding-block: var(--e-s9); }

.e-mega__cols {
	display: grid;
	grid-template-columns: minmax(0, 1fr) 300px;
	gap: var(--e-s11);
	align-items: start;
}

.e-mega__eyebrow { margin-bottom: var(--e-s5); }

.e-mega__links {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 2px var(--e-s7);
}

.e-mega__links a {
	display: block;
	padding: 9px 0;
	font-size: var(--e-fs-base);
	color: var(--e-ink-2);
	position: relative;
}

.e-mega__links a:hover { color: var(--e-red); }

.e-mega__all a {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	color: var(--e-ink);
	font-weight: var(--e-w-medium);
	font-size: var(--e-fs-sm);
	letter-spacing: var(--e-ls-caps-s);
	text-transform: uppercase;
	margin-top: var(--e-s4);
}

.e-mega__feature { display: block; }

.e-mega__feature .e-frame { aspect-ratio: 4 / 3; }

.e-mega__feature-label {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: var(--e-s3);
	margin-top: var(--e-s3);
	font-size: var(--e-fs-sm);
	font-weight: var(--e-w-medium);
	letter-spacing: var(--e-ls-caps-s);
	text-transform: uppercase;
}

.e-mega__feature:hover .e-mega__feature-label { color: var(--e-red); }

@media (max-width: 1200px) {
	.e-mega__cols { grid-template-columns: minmax(0, 1fr); gap: var(--e-s7); }
	.e-mega__feature { display: none; }
}

@media (max-width: 1023px) {
	.e-header__grid { min-height: 74px; }
	.e-header__logo img { height: 38px; }
	.e-nav__link { padding-inline: var(--e-s4); }
}

@media (max-width: 767px) {
	.e-header__grid { min-height: 62px; gap: var(--e-s1); }
	.e-header.is-condensed .e-header__grid { min-height: 56px; }
	.e-header__logo img { height: 32px; }
	.e-header.is-condensed .e-header__logo img { height: 28px; }
	.e-header__search-trigger { padding: 0; width: 44px; justify-content: center; }
}

/* --------------------------------------------------------------------------
   Search panel
   -------------------------------------------------------------------------- */
.e-search {
	position: absolute;
	left: 0; right: 0;
	top: 100%;
	background: var(--e-surface);
	border-bottom: 1px solid var(--e-line);
	box-shadow: var(--e-shadow-2);
	z-index: var(--e-z-dropdown);
	opacity: 0;
	visibility: hidden;
	transform: translateY(-8px);
	transition: opacity var(--e-dur-2) var(--e-ease), transform var(--e-dur-2) var(--e-ease), visibility var(--e-dur-2);
	max-height: min(78vh, 680px);
	overflow-y: auto;
	overscroll-behavior: contain;
}

.e-search[hidden] { display: block; }
.e-search.is-open { opacity: 1; visibility: visible; transform: none; }

.e-search__inner { padding-block: var(--e-s7) var(--e-s8); }

.e-search__form {
	display: flex;
	align-items: center;
	gap: var(--e-s3);
	border-bottom: 1px solid var(--e-ink);
	padding-bottom: var(--e-s3);
}

.e-search__icon { flex: none; color: var(--e-muted); }

.e-search__input {
	flex: 1 1 auto;
	min-height: 48px;
	border: 0;
	background: transparent;
	padding: 0;
	font-family: var(--e-font-display);
	font-size: clamp(1.375rem, 1rem + 1.6vw, 2rem);
	font-weight: var(--e-w-display);
	letter-spacing: var(--e-ls-display);
}

.e-search__input:focus { box-shadow: none; border: 0; }
.e-search__input::-webkit-search-cancel-button { -webkit-appearance: none; }

.e-search__close { flex: none; }

.e-search__results { margin-top: var(--e-s7); }

.e-search__chips {
	display: flex;
	flex-wrap: wrap;
	gap: var(--e-s2);
	margin-top: var(--e-s4);
}

.e-search__chips a {
	display: inline-flex;
	align-items: center;
	min-height: 40px;
	padding: 0 16px;
	border: 1px solid var(--e-line-2);
	border-radius: var(--e-r-pill);
	font-size: var(--e-fs-sm);
	color: var(--e-ink-2);
}

.e-search__chips a:hover { border-color: var(--e-ink); color: var(--e-ink); }

/* Result rows */
.e-search__group + .e-search__group { margin-top: var(--e-s7); }
.e-search__grouptitle { margin-bottom: var(--e-s4); }

.e-search__hits {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
	gap: var(--e-s2) var(--e-s6);
}

.e-search__hit {
	display: flex;
	align-items: center;
	gap: var(--e-s4);
	padding: 10px;
	margin-inline: -10px;
	transition: background var(--e-dur-1) var(--e-ease);
}

.e-search__hit:hover { background: var(--e-surface-2); }

.e-search__hit img {
	width: 58px; height: 72px;
	object-fit: cover;
	background: var(--e-surface-2);
	flex: none;
}

.e-search__hit-title {
	font-size: var(--e-fs-sm);
	line-height: 1.4;
	color: var(--e-ink);
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
}

.e-search__hit-price {
	display: block;
	margin-top: 4px;
	font-size: var(--e-fs-sm);
	font-weight: var(--e-w-medium);
	color: var(--e-red);
}

.e-search__all {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	margin-top: var(--e-s6);
	font-size: var(--e-fs-sm);
	font-weight: var(--e-w-medium);
	letter-spacing: var(--e-ls-caps-s);
	text-transform: uppercase;
	border-bottom: 1px solid var(--e-ink);
	padding-bottom: 4px;
}

.e-search__status {
	padding: var(--e-s6) 0;
	color: var(--e-muted);
	font-size: var(--e-fs-sm);
}

@media (max-width: 767px) {
	/* Full-screen sheet: a dropdown fights the on-screen keyboard. */
	.e-search {
		position: fixed;
		inset: 0;
		top: 0;
		max-height: none;
		height: 100dvh;
		transform: translateY(-2%);
		z-index: var(--e-z-modal);
		border: 0;
	}
	.e-search__inner { padding-top: var(--e-s5); }
	.e-search__input { font-size: 22px; }
	.e-search__hits { grid-template-columns: 1fr; }
}

/* --------------------------------------------------------------------------
   Drawers: menu + cart
   -------------------------------------------------------------------------- */
.e-drawer[hidden] { display: flex; }

.e-drawer--menu { width: min(380px, 88vw); }

.e-mnav { padding: var(--e-s2) 0; }

.e-mnav__item { border-bottom: 1px solid var(--e-line); }

.e-mnav__row {
	display: flex;
	align-items: stretch;
	justify-content: space-between;
}

.e-mnav__link {
	flex: 1 1 auto;
	display: flex;
	align-items: center;
	min-height: 58px;
	padding: 0 var(--e-s6);
	font-size: var(--e-fs-md);
	font-weight: var(--e-w-normal);
	color: var(--e-ink);
}

.e-mnav__link:active { background: var(--e-surface-2); }

.e-mnav__toggle {
	flex: none;
	width: 60px;
	display: grid;
	place-items: center;
	color: var(--e-ink-2);
	border-left: 1px solid var(--e-line);
}

.e-mnav__panel {
	display: grid;
	grid-template-rows: 0fr;
	transition: grid-template-rows var(--e-dur-3) var(--e-ease);
	background: var(--e-surface-2);
}

.e-mnav__panel > div { overflow: hidden; }
.e-mnav__item.is-open > .e-mnav__panel { grid-template-rows: 1fr; }

.e-mnav__sub { padding: var(--e-s2) 0; }

.e-mnav__sub a {
	display: flex;
	align-items: center;
	min-height: 48px;
	padding: 0 var(--e-s6) 0 calc(var(--e-s6) + 14px);
	font-size: var(--e-fs-base);
	color: var(--e-ink-2);
}

.e-mnav__sub a:active { color: var(--e-red); }

.e-mnav__secondary {
	border-top: 1px solid var(--e-line);
	padding: var(--e-s4) 0;
	margin-top: var(--e-s4);
}

.e-mnav__secondary a {
	display: flex;
	align-items: center;
	gap: var(--e-s4);
	min-height: 52px;
	padding: 0 var(--e-s6);
	font-size: var(--e-fs-sm);
	color: var(--e-ink-2);
}

.e-mnav__langs {
	display: flex;
	gap: var(--e-s2);
	padding: var(--e-s4) var(--e-s6) var(--e-s9);
	border-top: 1px solid var(--e-line);
}

.e-mnav__langs a {
	flex: 1 1 0;
	display: flex;
	align-items: center;
	justify-content: center;
	min-height: 46px;
	border: 1px solid var(--e-line-2);
	font-size: var(--e-fs-sm);
	color: var(--e-ink-2);
	gap: 8px;
}

.e-mnav__langs a.is-active {
	border-color: var(--e-ink);
	color: var(--e-ink);
	font-weight: var(--e-w-medium);
}


/* --------------------------------------------------------------------------
   Mini cart

   Markup comes from woocommerce/cart/mini-cart.php. It is replaced wholesale
   by wc-cart-fragments after every AJAX add-to-cart, so these rules only ever
   target classes that template guarantees.
   -------------------------------------------------------------------------- */
.e-minicart {
	display: flex;
	flex-direction: column;
	min-height: 0;
	height: 100%;
}

.e-minicart .widget_shopping_cart_content {
	display: flex;
	flex-direction: column;
	min-height: 0;
	height: 100%;
}

.e-minicart__body {
	flex: 1 1 auto;
	min-height: 0;
	overflow-y: auto;
	overscroll-behavior: contain;
	-webkit-overflow-scrolling: touch;
}

.e-minicart__list { padding: 0 var(--e-s6); margin: 0; list-style: none; }

.e-minicart__item {
	display: grid;
	grid-template-columns: 72px minmax(0, 1fr) 34px;
	gap: var(--e-s4);
	align-items: start;
	padding: var(--e-s5) 0;
	border-bottom: 1px solid var(--e-line);
}

.e-minicart__thumb { grid-column: 1; }

.e-minicart__thumb img {
	display: block;
	width: 72px;
	height: 90px;
	object-fit: cover;
	background: var(--e-surface-2);
}

.e-minicart__info { grid-column: 2; min-width: 0; }

.e-minicart__name {
	display: block;
	font-size: var(--e-fs-sm);
	line-height: 1.45;
	color: var(--e-ink);
	/* The drawer column is narrow; long jewellery names must wrap on spaces,
	   not break one word per line. */
	overflow-wrap: anywhere;
}

a.e-minicart__name:hover { color: var(--e-red); }

.e-minicart__meta {
	margin-top: 5px;
	font-size: var(--e-fs-2xs);
	color: var(--e-muted);
	line-height: 1.5;
}

.e-minicart__meta dl,
.e-minicart__meta p { margin: 0; }
.e-minicart__meta dt,
.e-minicart__meta dd { display: inline; margin: 0; }
.e-minicart__meta dd::after { content: ""; display: block; }

.e-minicart__line {
	display: block;
	margin-top: 7px;
	font-size: var(--e-fs-sm);
	color: var(--e-muted);
}

.e-minicart__line .amount { color: var(--e-ink); font-weight: var(--e-w-medium); }

.e-minicart__remove {
	grid-column: 3;
	grid-row: 1;
	display: grid;
	place-items: center;
	width: 34px;
	height: 34px;
	color: var(--e-muted);
	font-size: 19px;
	line-height: 1;
	border: 1px solid transparent;
	border-radius: 50%;
	text-decoration: none;
}

.e-minicart__remove:hover { color: var(--e-red); border-color: var(--e-red-line); }

/* --------------------------------------------------------------------------
   Footer
   -------------------------------------------------------------------------- */
.e-minicart__footer {
	flex: none;
	border-top: 1px solid var(--e-ink);
	background: var(--e-surface);
}

.e-minicart__total {
	display: flex;
	align-items: baseline;
	justify-content: space-between;
	gap: var(--e-s4);
	padding: var(--e-s5) var(--e-s6) var(--e-s4);
	margin: 0;
	font-size: var(--e-fs-md);
}

.e-minicart__total strong { font-weight: var(--e-w-normal); color: var(--e-ink-2); }
.e-minicart__total .amount { font-weight: var(--e-w-medium); font-size: var(--e-fs-lg); }

.e-minicart__buttons {
	display: grid;
	gap: var(--e-s3);
	padding: 0 var(--e-s6);
	margin: 0;
}

.e-minicart__buttons a {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 54px;
	padding: 14px 24px;
	border: 1px solid var(--e-ink);
	background: transparent;
	color: var(--e-ink);
	font-size: var(--e-fs-sm);
	font-weight: var(--e-w-medium);
	letter-spacing: var(--e-ls-caps-s);
	text-transform: uppercase;
	text-align: center;
}

.e-minicart__buttons a.checkout {
	background: var(--e-red);
	border-color: var(--e-red);
	color: #fff;
	order: -1;
}

.e-minicart__buttons a.checkout:hover { background: var(--e-red-hover); border-color: var(--e-red-hover); }
.e-minicart__buttons a:not(.checkout):hover { background: var(--e-ink); color: #fff; }

.e-minicart__note {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 9px;
	padding: var(--e-s4) var(--e-s6) var(--e-s6);
	margin: 0;
	font-size: var(--e-fs-sm);
	color: var(--e-muted);
}

/* --------------------------------------------------------------------------
   Empty state
   -------------------------------------------------------------------------- */
.e-minicart__empty {
	display: grid;
	justify-items: center;
	gap: var(--e-s4);
	padding: var(--e-s12) var(--e-s6);
	text-align: center;
	color: var(--e-muted);
}

.e-minicart__empty svg { color: var(--e-line-2); }
.e-minicart__empty p { margin: 0; }

/* Free shipping progress injected by the vendor helper. */
.e-minicart .pls-free-shipping-bar { padding: var(--e-s5) var(--e-s6) 0; font-size: var(--e-fs-sm); }

/* Layer: 06-footer.css */
/* ==========================================================================
   ERPIN DESIGN SYSTEM — 06 FOOTER

   The footer is light. A black footer forced the red wordmark to be knocked
   out to white, which throws away the one colour the brand owns; on a pale
   ground the logo can be shown as drawn.
   ========================================================================== */

/* --------------------------------------------------------------------------
   Trust strip
   -------------------------------------------------------------------------- */
.e-trust {
	border-top: 1px solid var(--e-line);
	background: var(--e-paper);
}

.e-trust__grid {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 0;
}

.e-trust__item {
	display: flex;
	align-items: flex-start;
	gap: var(--e-s4);
	padding: var(--e-s7) var(--e-s6);
	border-left: 1px solid var(--e-line);
}

.e-trust__item:first-child { border-left: 0; padding-left: 0; }
.e-trust__item:last-child { padding-right: 0; }

.e-trust__icon { flex: none; color: var(--e-ink-2); margin-top: 1px; }

.e-trust__item strong {
	display: block;
	font-size: var(--e-fs-sm);
	font-weight: var(--e-w-medium);
	color: var(--e-ink);
	letter-spacing: .01em;
}

.e-trust__item span {
	display: block;
	margin-top: 3px;
	font-size: var(--e-fs-sm);
	color: var(--e-muted);
	line-height: 1.45;
}

@media (max-width: 1023px) {
	.e-trust__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.e-trust__item { padding: var(--e-s6); }
	.e-trust__item:nth-child(odd) { border-left: 0; padding-left: 0; }
	.e-trust__item:nth-child(even) { padding-right: 0; }
	.e-trust__item:nth-child(n + 3) { border-top: 1px solid var(--e-line); }
}

@media (max-width: 560px) {
	.e-trust__grid { grid-template-columns: 1fr; }
	.e-trust__item { padding: var(--e-s5) 0; border-left: 0; }
	.e-trust__item + .e-trust__item { border-top: 1px solid var(--e-line); }
}

/* --------------------------------------------------------------------------
   Footer
   -------------------------------------------------------------------------- */
.e-footer {
	background: var(--e-surface-2);
	border-top: 1px solid var(--e-line);
	color: var(--e-ink-2);
	font-size: var(--e-fs-sm);
	padding-top: var(--e-sect-md);
}

.e-footer a { color: var(--e-ink-2); }
.e-footer a:hover { color: var(--e-red); }

.e-footer__top {
	display: grid;
	grid-template-columns: minmax(0, 330px) minmax(0, 1fr);
	gap: clamp(40px, 6vw, 88px);
	padding-bottom: var(--e-s10);
}

.e-footer__logo img {
	width: auto;
	height: 40px;
	object-fit: contain;
	/* Shown as drawn — the wordmark is red artwork on transparent. */
}

.e-footer__pitch {
	margin-top: var(--e-s5);
	max-width: 42ch;
	line-height: 1.7;
	color: var(--e-muted);
}

/* ---- Contact list ---- */
.e-footer__contact {
	display: grid;
	gap: var(--e-s3);
	margin: var(--e-s6) 0 0;
}

.e-footer__contact > div {
	display: grid;
	grid-template-columns: 84px minmax(0, 1fr);
	align-items: baseline;
	gap: var(--e-s3);
}

.e-footer__contact dt {
	font-size: 12px;
	letter-spacing: var(--e-ls-caps-s);
	text-transform: uppercase;
	color: var(--e-muted-2);
}

.e-footer__contact dd { margin: 0; min-width: 0; }

.e-footer__contact a {
	display: inline-flex;
	align-items: center;
	min-height: 34px;
	color: var(--e-ink);
	font-variant-numeric: tabular-nums;
	overflow-wrap: anywhere;
}

.e-footer__contact a:hover { color: var(--e-red); }

@media (max-width: 400px) {
	.e-footer__contact > div { grid-template-columns: minmax(0, 1fr); gap: 0; }
}

.e-footer__social {
	display: flex;
	gap: var(--e-s2);
	margin-top: var(--e-s6);
}

.e-footer__social a {
	display: grid;
	place-items: center;
	width: 44px; height: 44px;
	border: 1px solid var(--e-line-2);
	border-radius: 50%;
	color: var(--e-ink-2);
	transition: border-color var(--e-dur-1) var(--e-ease), color var(--e-dur-1) var(--e-ease);
}

.e-footer__social a:hover { border-color: var(--e-red); color: var(--e-red); }

.e-footer__cols {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: var(--e-s7) var(--e-s6);
}

.e-footer__coltitle {
	font-size: var(--e-fs-xs);
	font-weight: var(--e-w-medium);
	letter-spacing: var(--e-ls-caps);
	text-transform: uppercase;
	color: var(--e-ink);
	margin-bottom: var(--e-s4);
}

.e-footer__col li a {
	display: flex;
	align-items: center;
	min-height: 40px;
	padding: 8px 0;
	line-height: 1.45;
	color: var(--e-muted);
}

.e-footer__col li a:hover { color: var(--e-red); }

@media (max-width: 1023px) {
	.e-footer__top { grid-template-columns: minmax(0, 1fr); gap: var(--e-s9); }
	.e-footer__cols { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 560px) {
	.e-footer__cols { grid-template-columns: 1fr; gap: 0; }
	.e-footer__col { border-top: 1px solid var(--e-line); padding: var(--e-s4) 0; }
	.e-footer__coltitle { margin-bottom: var(--e-s1); }
}

/* --------------------------------------------------------------------------
   Mark strip
   -------------------------------------------------------------------------- */
.e-footer__marks {
	display: flex;
	flex-wrap: wrap;
	align-items: flex-end;
	gap: var(--e-s7) var(--e-s10);
	padding: var(--e-s7) 0;
	border-top: 1px solid var(--e-line);
}

.e-marks { flex: 0 1 auto; }

.e-marks__label {
	font-size: 11px;
	letter-spacing: var(--e-ls-caps);
	text-transform: uppercase;
	color: var(--e-muted-2);
	margin-bottom: var(--e-s3);
}

.e-marks__list {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: var(--e-s5);
}

/*
 * Every mark is authored on the same 167x56 canvas, so one fixed box keeps
 * them optically level. Smaller than the first pass: at 96px wide they
 * competed with the brand logo above them.
 */
.e-marks__list img {
	width: 68px;
	height: 23px;
	object-fit: contain;
	filter: grayscale(1) opacity(.55);
	transition: filter var(--e-dur-2) var(--e-ease);
}

.e-marks__list li:hover img,
.e-marks__list li:focus-within img { filter: grayscale(0) opacity(1); }

.e-etbis {
	display: inline-flex;
	align-items: center;
	gap: var(--e-s3);
	margin-left: auto;
	padding: 10px 16px;
	border: 1px solid var(--e-line-2);
	min-height: 48px;
	background: var(--e-surface);
}

.e-etbis:hover { border-color: var(--e-ink-2); }
.e-etbis__logo { display: block; flex: none; width: 76px; height: 34px; object-fit: contain; }
.e-etbis small { display: block; font-size: 11px; color: var(--e-muted); margin-top: 1px; }

@media (max-width: 767px) {
	.e-footer__marks { gap: var(--e-s6); }
	.e-marks__list { gap: var(--e-s4); }
	.e-marks__list img { width: 58px; height: 20px; }
	.e-etbis { margin-left: 0; width: 100%; }
}

/* --------------------------------------------------------------------------
   Legal bar
   -------------------------------------------------------------------------- */
.e-footer__bottom {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: var(--e-s5);
	flex-wrap: wrap;
	padding: var(--e-s5) 0 max(var(--e-s5), env(safe-area-inset-bottom));
	border-top: 1px solid var(--e-line);
}

.e-footer__copy {
	font-size: var(--e-fs-sm);
	color: var(--e-muted);
	letter-spacing: .01em;
	line-height: 1.6;
}

/* Partner credit: mark only, no wordmark — the label next to it already
   says who it is. */
.e-footer__partner {
	display: inline-flex;
	align-items: center;
	gap: var(--e-s3);
	min-height: 44px;
	font-size: 12px;
	letter-spacing: var(--e-ls-caps-s);
	text-transform: uppercase;
	color: var(--e-muted-2);
}

.e-footer__partner .e-footer__partner-mark {
	display: block;
	width: auto;
	height: 24px;
	object-fit: contain;
	opacity: .75;
	transition: opacity var(--e-dur-2) var(--e-ease);
}

.e-footer__partner:hover { color: var(--e-ink-2); }
.e-footer__partner:hover .e-footer__partner-mark { opacity: 1; }

@media (max-width: 560px) {
	.e-footer__bottom { flex-direction: column; align-items: flex-start; gap: var(--e-s3); }
}

/* Layer: 07-home.css */
/* ==========================================================================
   ERPIN DESIGN SYSTEM — 07 HOME
   ========================================================================== */

/*
 * There is no scroll-reveal animation.
 *
 * An earlier build faded sections in on intersection. It bought nothing the
 * photography does not already do, it delayed the largest images, and any
 * failure in the observer left whole sections invisible. Content is content.
 */

/* --------------------------------------------------------------------------
   1. Hero
   -------------------------------------------------------------------------- */
.e-hero {
	position: relative;
	display: flex;
	align-items: flex-end;
	min-height: clamp(460px, 72vh, 760px);
	background: #f7f4ef;
	overflow: hidden;
	isolation: isolate;
}

.e-hero__media { position: absolute; inset: 0; z-index: -1; }

/* <picture> is inline by default, so a percentage height on the inner <img>
   would resolve against an auto-height box and collapse. */
.e-hero__media picture { display: block; width: 100%; height: 100%; }

.e-hero__media img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	/* Keeps the hand and the stone in frame as the viewport narrows. */
	object-position: 62% 42%;
}

/*
 * A warm directional veil keeps the copy readable without turning the hero
 * into a dark block. The client photography already leaves this side open.
 */
.e-hero__scrim {
	position: absolute;
	inset: 0;
	background:
		linear-gradient(100deg, rgba(247, 244, 239, .96) 0%, rgba(247, 244, 239, .82) 34%, rgba(247, 244, 239, .12) 62%, rgba(247, 244, 239, 0) 100%),
		linear-gradient(to top, rgba(247, 244, 239, .44) 0%, rgba(247, 244, 239, 0) 42%);
}

.e-hero__inner {
	position: relative;
	padding-block: clamp(48px, 8vw, 104px);
	width: 100%;
}

.e-hero__copy { max-width: 30ch; color: var(--e-ink); }

.e-hero__eyebrow { color: var(--e-red); }

.e-hero__title {
	margin-top: var(--e-s5);
	font-family: var(--e-font-display);
	font-size: var(--e-d1);
	font-weight: var(--e-w-display);
	line-height: .98;
	letter-spacing: -.018em;
}

/*
 * The second line is set in the normal roman at a heavier weight, underlined
 * in brand red. It used to be italic, which read as handwriting and hurt
 * legibility — exactly what a display line must not do.
 */
.e-hero__title em {
	font-style: normal;
	font-weight: var(--e-w-normal);
	color: var(--e-ink);
	position: relative;
	display: inline-block;
	padding-bottom: .08em;
	box-shadow: inset 0 -2px 0 var(--e-red);
}

.e-hero__text {
	margin-top: var(--e-s6);
	max-width: 44ch;
	font-size: var(--e-fs-md);
	font-weight: var(--e-w-light);
	line-height: 1.6;
	color: var(--e-ink-2);
}

.e-hero__actions {
	display: flex;
	flex-wrap: wrap;
	gap: var(--e-s3);
	margin-top: var(--e-s8);
}

.e-hero .e-btn--light {
	--btn-bg: var(--e-red);
	--btn-bd: var(--e-red);
	--btn-fg: #fff;
}

.e-hero .e-btn--on-dark {
	--btn-bg: rgba(255, 255, 255, .72);
	--btn-bd: var(--e-ink);
	--btn-fg: var(--e-ink);
}

@media (max-width: 767px) {
	.e-hero {
		min-height: clamp(660px, 84dvh, 720px);
		align-items: flex-end;
	}
	.e-hero__media img { object-position: 72% center; }
	.e-hero__scrim {
		background:
			linear-gradient(to top, rgba(247, 244, 239, .98) 0%, rgba(247, 244, 239, .90) 42%, rgba(247, 244, 239, .12) 74%);
	}
	.e-hero__copy { max-width: none; }
	.e-hero__actions { flex-direction: column; align-items: stretch; }
	.e-hero__actions .e-btn { width: 100%; }
}

/* Every homepage block uses two half-gaps. Adjacent halves add up to one
   identical rhythm without the double spacing that previously appeared
   between the campaign, product and editorial sections. */
.e-home-block {
	--e-home-half-gap: clamp(32px, 4vw, 52px);
	padding-block: var(--e-home-half-gap) !important;
}

.e-hero + .e-home-block { padding-top: calc(var(--e-home-half-gap) * 2) !important; }

.e-home-block--flush {
	padding-block: 0 !important;
	margin-block: var(--e-home-half-gap);
}

@media (max-width: 767px) {
	.e-home-block { --e-home-half-gap: clamp(24px, 7vw, 36px); }
}

/* --------------------------------------------------------------------------
   2. Category tiles
   -------------------------------------------------------------------------- */
.e-cats {
	display: grid;
	grid-template-columns: repeat(5, minmax(0, 1fr));
	gap: var(--e-s5);
}

.e-cats__item { display: block; }

.e-cats__image { object-position: center; }
.e-cats__item:first-child .e-cats__image { object-position: 70% 72%; }
.e-cats__item:nth-child(2) .e-cats__image { object-position: 65% center; }

.e-cats__label {
	display: flex;
	align-items: baseline;
	justify-content: space-between;
	gap: var(--e-s3);
	padding-top: var(--e-s4);
	border-top: 1px solid var(--e-line);
	margin-top: var(--e-s4);
}

.e-cats__label strong {
	font-family: var(--e-font-display);
	font-size: var(--e-fs-xl);
	font-weight: var(--e-w-display);
	letter-spacing: var(--e-ls-display);
	line-height: 1;
}

.e-cats__label small {
	font-size: 11px;
	letter-spacing: var(--e-ls-caps);
	text-transform: uppercase;
	color: var(--e-muted);
}

.e-cats__item:hover .e-cats__label strong { color: var(--e-red); }
.e-cats__item:hover .e-cats__label { border-top-color: var(--e-red); }
.e-cats__hint { display: none; }
.e-cats__navigation { display: none; }

@media (max-width: 1023px) {
	.e-cats { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

@media (max-width: 767px) {
	/* Horizontal rail: five portrait tiles stacked is a lot of scrolling. */
	.e-cats {
		display: flex;
		gap: var(--e-s4);
		overflow-x: auto;
		overscroll-behavior-inline: contain;
		-webkit-overflow-scrolling: touch;
		scroll-snap-type: x mandatory;
		scroll-padding-inline: var(--e-gutter);
		scrollbar-width: none;
		margin-inline: calc(var(--e-gutter) * -1);
		padding-inline: var(--e-gutter);
	}
	.e-cats::-webkit-scrollbar { display: none; }
	.e-cats__item { flex: 0 0 min(76vw, 420px); scroll-snap-align: start; }
	.e-cats__navigation:not([hidden]) { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-block: -4px 20px; }
	.e-cats__navigation + .e-cats__hint { display: none; }
	.e-cats__navigation[hidden] + .e-cats__hint { display: flex; }
	.e-cats__position { display: flex; align-items: center; gap: 12px; color: var(--e-muted); font-size: 12px; }
	.e-cats__position output { color: var(--e-ink); font-variant-numeric: tabular-nums; white-space: nowrap; }
	.e-cats__arrows { display: flex; gap: 8px; }
	.e-cats__arrows button { display: grid; place-items: center; width: 44px; height: 44px; padding: 0; border: 1px solid var(--e-line); border-radius: 50%; background: #fff; color: var(--e-ink); cursor: pointer; }
	.e-cats__arrows button[data-cats-next] { color: #fff; background: var(--e-red); border-color: var(--e-red); }
	.e-cats__arrows button:disabled { opacity: .3; cursor: default; }
	.e-cats__arrows button:focus-visible { outline: 2px solid var(--e-ink); outline-offset: 3px; }
	[dir="rtl"] .e-cats__arrows svg { transform: rotate(180deg); }
	.e-cats__track { height: 2px; margin-block-start: 20px; background: var(--e-line); overflow: hidden; }
	.e-cats__track span { display: block; width: 20%; height: 100%; background: var(--e-red); transform: translateX(var(--e-cats-progress, 0%)); transition: transform 160ms ease; }
	[dir="rtl"] .e-cats__track span { transform: translateX(calc(var(--e-cats-progress, 0%) * -1)); }
	.e-home-cats .e-sect-head { margin-inline: var(--e-s2); }
	.e-cats__hint {
		display: flex;
		align-items: center;
		gap: 8px;
		margin: calc(var(--e-s3) * -1) var(--e-s2) var(--e-s5);
		font-size: 11px;
		font-weight: var(--e-w-medium);
		letter-spacing: var(--e-ls-caps-s);
		text-transform: uppercase;
		color: var(--e-muted);
	}
}

.e-sect-foot { margin-top: var(--e-s7); }

/* --------------------------------------------------------------------------
   3. Campaign hero
   -------------------------------------------------------------------------- */
.e-home-campaign {
	background: var(--e-paper);
}

.e-home-campaign__card {
	position: relative;
	display: block;
	min-height: clamp(460px, 50vw, 650px);
	overflow: hidden;
	isolation: isolate;
	background: #f7f4ef;
	color: var(--e-ink);
	border: 1px solid rgba(139, 18, 28, .24);
	border-top: 4px solid var(--e-red);
	box-shadow: 0 18px 50px rgba(76, 61, 48, .10);
}

.e-home-campaign__media,
.e-home-campaign__scrim {
	position: absolute;
	inset: 0;
}

.e-home-campaign__media { z-index: -2; }

.e-home-campaign__media picture {
	display: block;
	width: 100%;
	height: 100%;
}

.e-home-campaign__media img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: center;
	transition: transform var(--e-dur-4) var(--e-ease-out);
}

.e-home-campaign__scrim {
	z-index: -1;
	background: linear-gradient(90deg, rgba(247, 244, 239, .99) 0%, rgba(247, 244, 239, .94) 35%, rgba(247, 244, 239, .36) 54%, rgba(247, 244, 239, 0) 72%);
}

.e-home-campaign__copy {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	justify-content: center;
	min-height: inherit;
	width: min(48%, 620px);
	padding: clamp(32px, 6vw, 88px);
}

.e-home-campaign__copy .e-eyebrow { color: var(--e-red); }

.e-home-campaign__kicker {
	margin-top: var(--e-s4);
	font-family: var(--e-font-display);
	font-size: clamp(22px, 2.1vw, 34px);
	font-weight: var(--e-w-light);
	font-style: italic;
	letter-spacing: -.01em;
	color: var(--e-ink);
}

.e-home-campaign__copy strong {
	display: block;
	margin-top: var(--e-s3);
	max-width: 10ch;
	font-family: var(--e-font-display);
	font-size: clamp(44px, 5.3vw, 78px);
	font-weight: var(--e-w-display);
	line-height: .98;
	letter-spacing: var(--e-ls-display);
	color: var(--e-red);
}

.e-home-campaign__text {
	margin-top: var(--e-s5);
	font-size: var(--e-fs-md);
	color: var(--e-ink-2);
}

.e-home-campaign__copy .e-btn {
	margin-top: var(--e-s7);
	--btn-bg: var(--e-red);
	--btn-bd: var(--e-red);
	--btn-fg: #fff;
}

@media (hover: hover) {
	.e-home-campaign__card:hover .e-home-campaign__media img { transform: scale(1.025); }
}

@media (max-width: 767px) {
	.e-home-campaign .e-container { padding-inline: var(--e-gutter); }
	.e-home-campaign__card {
		display: grid;
		min-height: 0;
		background: #f7f4ef;
		color: var(--e-ink);
	}
	.e-home-campaign__media {
		position: relative;
		z-index: 0;
		aspect-ratio: 4 / 5;
	}
	.e-home-campaign__media img { object-position: center; }
	.e-home-campaign__scrim { display: none; }
	.e-home-campaign__copy {
		min-height: 0;
		width: 100%;
		padding: var(--e-s7) var(--e-s6) var(--e-s8);
	}
	.e-home-campaign__copy .e-eyebrow { color: var(--e-red); }
	.e-home-campaign__kicker { margin-top: var(--e-s3); font-size: 22px; }
	.e-home-campaign__copy strong { max-width: none; font-size: clamp(38px, 12vw, 52px); }
	.e-home-campaign__text { color: var(--e-ink-2); }
	.e-home-campaign__copy .e-btn {
		width: 100%;
		--btn-bg: var(--e-red);
		--btn-bd: var(--e-red);
		--btn-fg: #fff;
	}
}

/* --------------------------------------------------------------------------
   4. Google reviews
   -------------------------------------------------------------------------- */
.e-reviews__head {
	display: flex;
	align-items: flex-end;
	justify-content: space-between;
	gap: var(--e-s8);
	margin-bottom: var(--e-s8);
}

.e-reviews__summary {
	display: flex;
	align-items: center;
	gap: var(--e-s4);
	flex: none;
}

.e-reviews__google,
.e-review__source {
	display: grid;
	place-items: center;
	border-radius: 50%;
	background: #fff;
	color: #4285f4;
	font-family: Arial, sans-serif;
	font-weight: 700;
	box-shadow: 0 1px 4px rgba(22, 23, 27, .12);
}

.e-reviews__google { width: 48px; height: 48px; font-size: 24px; }
.e-reviews__summary strong { display: block; font-size: var(--e-fs-lg); line-height: 1.1; }
.e-reviews__summary small { display: block; margin-top: 2px; color: var(--e-muted); font-size: var(--e-fs-xs); }
.e-reviews__stars,
.e-review__stars { color: #e6a800; letter-spacing: .08em; line-height: 1; }
.e-reviews__stars { display: inline-block; margin-top: 5px; font-size: 14px; }

.e-reviews__rail {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: var(--e-s4);
}

.e-review {
	display: flex;
	flex-direction: column;
	min-height: 260px;
	padding: clamp(24px, 2.5vw, 34px);
	background: var(--e-paper);
	border: 1px solid var(--e-line);
}

.e-review__top {
	display: grid;
	grid-template-columns: auto minmax(0, 1fr) auto;
	align-items: center;
	gap: var(--e-s3);
}

.e-review__avatar {
	display: grid;
	place-items: center;
	width: 42px;
	height: 42px;
	border-radius: 50%;
	background: var(--e-ink);
	color: #fff;
	font-size: var(--e-fs-sm);
	font-weight: var(--e-w-medium);
}

.e-review__top strong { display: block; font-size: var(--e-fs-sm); font-weight: var(--e-w-medium); text-transform: capitalize; }
.e-review__top small { display: block; margin-top: 2px; color: var(--e-muted); font-size: 11px; }
.e-review__source { width: 28px; height: 28px; font-size: 14px; }
.e-review__stars { display: block; margin-top: var(--e-s5); font-size: 15px; }
.e-review > p { margin-top: var(--e-s4); color: var(--e-ink-2); font-size: var(--e-fs-sm); line-height: 1.72; }
.e-reviews__foot { display: flex; justify-content: flex-end; margin-top: var(--e-s7); }
.e-reviews__hint { display: none; }

@media (max-width: 1023px) {
	.e-reviews__rail { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 767px) {
	.e-reviews__head { align-items: flex-start; margin-bottom: var(--e-s5); }
	.e-reviews__summary { align-items: flex-start; }
	.e-reviews__google { width: 40px; height: 40px; font-size: 20px; }
	.e-reviews__hint {
		display: block;
		margin-bottom: var(--e-s4);
		color: var(--e-muted);
		font-size: 11px;
		font-weight: var(--e-w-medium);
		letter-spacing: var(--e-ls-caps-s);
		text-transform: uppercase;
	}
	.e-reviews__rail {
		display: flex;
		gap: var(--e-s4);
		overflow-x: auto;
		overscroll-behavior-inline: contain;
		-webkit-overflow-scrolling: touch;
		scroll-snap-type: x mandatory;
		scrollbar-width: none;
		margin-inline: 0;
		padding: 0 var(--e-gutter) 2px 0;
		scroll-padding-inline: 0;
	}
	.e-reviews__rail::-webkit-scrollbar { display: none; }
	.e-review { flex: 0 0 min(84vw, 340px); min-height: 250px; scroll-snap-align: start; }
	.e-reviews__foot { justify-content: flex-start; }
}

@media (max-width: 520px) {
	.e-reviews__head { flex-direction: column; gap: var(--e-s5); }
}

/* --------------------------------------------------------------------------
   5. Member benefit and sustainability
   -------------------------------------------------------------------------- */
.e-benefits__head { margin-bottom: clamp(28px, 4vw, 48px); }

.e-benefits__grid {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: var(--e-s5);
}

.e-benefit {
	position: relative;
	min-height: clamp(420px, 39vw, 560px);
	overflow: hidden;
	isolation: isolate;
	background: var(--e-black);
	color: #fff;
}

.e-benefit__media,
.e-benefit__scrim {
	position: absolute;
	inset: 0;
}

.e-benefit__media { z-index: -2; }

.e-benefit__media img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform var(--e-dur-4) var(--e-ease);
}

.e-benefit__scrim {
	z-index: 1;
	pointer-events: none;
	background: linear-gradient(90deg, rgba(8, 7, 6, .80) 0%, rgba(8, 7, 6, .48) 48%, rgba(8, 7, 6, .06) 78%);
}

.e-benefit--member .e-benefit__scrim {
	background: linear-gradient(90deg, rgba(16, 13, 10, .82) 0%, rgba(16, 13, 10, .62) 43%, rgba(16, 13, 10, .13) 74%, rgba(16, 13, 10, 0) 100%);
}

.e-benefit--member .e-benefit__media img { object-position: 68% center; }
.e-benefit--sapling .e-benefit__media img { object-position: 68% center; }

.e-benefit__copy {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	justify-content: flex-end;
	min-height: inherit;
	max-width: 39ch;
	padding: clamp(28px, 4vw, 56px);
}

.e-benefit__copy .e-eyebrow { color: rgba(255, 255, 255, .74); }

.e-benefit__copy h3 {
	margin-top: var(--e-s3);
	font-family: var(--e-font-display);
	font-size: clamp(32px, 3.2vw, 52px);
	font-weight: var(--e-w-display);
	line-height: 1.02;
	letter-spacing: var(--e-ls-display);
}

.e-benefit__copy > p:not(.e-eyebrow) {
	margin-top: var(--e-s4);
	max-width: 38ch;
	font-size: var(--e-fs-md);
	line-height: 1.58;
	color: rgba(255, 255, 255, .84);
}

.e-benefit__copy .e-btn { margin-top: var(--e-s7); }
.e-benefit:hover .e-benefit__media img { transform: scale(1.025); }

@media (max-width: 900px) {
	.e-benefits__grid { grid-template-columns: 1fr; }
	.e-benefit { min-height: min(112vw, 540px); }
}

@media (max-width: 560px) {
	.e-benefit__scrim {
		background: linear-gradient(to top, rgba(8, 7, 6, .88) 0%, rgba(8, 7, 6, .52) 52%, rgba(8, 7, 6, .05) 82%);
	}
	.e-benefit__copy { justify-content: flex-end; max-width: none; }
	.e-benefit__copy .e-btn { width: 100%; }
}

/* --------------------------------------------------------------------------
   4. Certified story (dark)
   -------------------------------------------------------------------------- */
.e-story__grid {
	display: grid;
	grid-template-columns: minmax(0, 42%) minmax(0, 1fr);
	gap: clamp(40px, 6vw, 96px);
	align-items: center;
}

.e-story__body > * + * { margin-top: var(--e-s5); }
.e-story__body .e-display-3 { margin-top: var(--e-s4); }
.e-story__body .e-btn { margin-top: var(--e-s8); }
.e-story__media { position: relative; }

.e-story__labs {
	position: absolute;
	right: var(--e-s4);
	bottom: var(--e-s4);
	display: flex;
	align-items: center;
	gap: var(--e-s3);
	padding: 10px 14px;
	background: rgba(255, 255, 255, .94);
	box-shadow: var(--e-shadow-2);
	color: var(--e-ink);
}

.e-story__labs strong {
	display: inline-flex;
	align-items: baseline;
	gap: 3px;
	font-family: var(--e-font-display);
	font-size: 16px;
	font-weight: var(--e-w-medium);
	letter-spacing: .04em;
}

.e-story__labs strong + strong { border-left: 1px solid var(--e-line); padding-left: var(--e-s3); }
.e-story__labs small { font-family: var(--e-font-body); font-size: 7px; letter-spacing: .12em; }

.e-story__facets {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: var(--e-s6) var(--e-s8);
	margin-top: var(--e-s8);
}

.e-story__facet { border-top: 1px solid var(--e-line); padding-top: var(--e-s4); }

.e-story__facet dt {
	font-size: var(--e-fs-md);
	font-family: var(--e-font-display);
	font-weight: var(--e-w-display);
	margin-bottom: 6px;
}

.e-story__facet dt a {
	display: inline-flex;
	align-items: center;
	min-height: 40px;
	color: var(--e-ink);
	border-bottom: 1px solid transparent;
}

.e-story__facet dt a:hover { border-bottom-color: var(--e-red); color: var(--e-red); }

.e-story__facet dd {
	margin: 0;
	font-size: var(--e-fs-sm);
	line-height: 1.6;
	color: var(--e-muted);
}

@media (max-width: 1023px) {
	.e-story__grid { grid-template-columns: minmax(0, 1fr); }
	.e-story__media { max-width: 520px; }
}

@media (max-width: 560px) {
	.e-story__facets { grid-template-columns: 1fr; gap: var(--e-s5); }
}

/* --------------------------------------------------------------------------
   5. Diptych
   -------------------------------------------------------------------------- */
.e-diptych {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 2px;
	background: var(--e-paper);
}

.e-diptych__item {
	position: relative;
	display: block;
	isolation: isolate;
	min-height: clamp(360px, 46vw, 620px);
	color: var(--e-ink);
	background: #f3eee7;
}

.e-diptych__frame { position: absolute; inset: 0; z-index: -2; background: transparent; }
.e-diptych__frame img { width: 100%; height: 100%; object-fit: cover; }

.e-diptych__scrim {
	position: absolute;
	inset: 0;
	z-index: -1;
	background: linear-gradient(to top, rgba(247, 244, 239, .98) 0%, rgba(247, 244, 239, .88) 31%, rgba(247, 244, 239, .18) 59%, rgba(247, 244, 239, 0) 76%);
}

.e-diptych__copy {
	position: absolute;
	inset: auto 0 0 0;
	display: block;
	padding: clamp(24px, 4vw, 56px);
}

.e-diptych__copy .e-eyebrow { color: var(--e-red); }

.e-diptych__copy strong {
	display: block;
	margin-top: var(--e-s3);
	font-family: var(--e-font-display);
	font-weight: var(--e-w-display);
}

.e-diptych__text {
	display: block;
	margin-top: var(--e-s3);
	max-width: 34ch;
	color: var(--e-ink-2);
	font-weight: var(--e-w-light);
}

.e-diptych__cta {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	margin-top: var(--e-s6);
	font-size: var(--e-fs-sm);
	font-weight: var(--e-w-medium);
	letter-spacing: var(--e-ls-caps-s);
	text-transform: uppercase;
	border-bottom: 1px solid rgba(21, 20, 20, .44);
	padding-bottom: 5px;
}

.e-diptych__item:hover .e-diptych__cta { border-bottom-color: var(--e-red); }

@media (max-width: 767px) {
	.e-diptych { grid-template-columns: 1fr; }
	.e-diptych__item { min-height: 76vw; }
}

/* --------------------------------------------------------------------------
   6. Atelier
   -------------------------------------------------------------------------- */
.e-atelier__grid {
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(0, 40%);
	grid-template-areas:
		"intro media"
		"steps media";
	gap: clamp(32px, 5vw, 72px);
	align-items: start;
}

.e-atelier__intro { grid-area: intro; max-width: 46ch; }
.e-atelier__intro .e-display-2 { margin-top: var(--e-s4); }
.e-atelier__intro .e-lead { margin-top: var(--e-s5); }

.e-atelier__actions {
	display: flex;
	flex-wrap: wrap;
	gap: var(--e-s3);
	margin-top: var(--e-s7);
}

.e-atelier__media { grid-area: media; margin: 0; }

.e-atelier__media figcaption {
	margin-top: var(--e-s3);
	font-size: var(--e-fs-xs);
	line-height: 1.55;
	color: var(--e-muted);
}

.e-steps {
	grid-area: steps;
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: var(--e-s7) var(--e-s8);
	counter-reset: step;
	margin-top: var(--e-s6);
}

.e-steps__item { border-top: 1px solid var(--e-line-2); padding-top: var(--e-s4); }

.e-steps__n {
	display: block;
	font-family: var(--e-font-display);
	font-size: var(--e-fs-lg);
	color: var(--e-red);
	letter-spacing: .02em;
}

.e-steps__title {
	margin-top: var(--e-s2);
	font-size: var(--e-fs-md);
	font-weight: var(--e-w-medium);
}

.e-steps__text {
	margin-top: 6px;
	font-size: var(--e-fs-sm);
	line-height: 1.6;
	color: var(--e-ink-2);
}

@media (max-width: 1023px) {
	.e-atelier__grid {
		grid-template-columns: minmax(0, 1fr);
		grid-template-areas: "intro" "media" "steps";
	}
	.e-atelier__media { max-width: 560px; }
}

@media (max-width: 560px) {
	.e-steps { grid-template-columns: 1fr; gap: var(--e-s5); }
	.e-atelier__actions .e-btn { width: 100%; }
}

/* --------------------------------------------------------------------------
   8. Trust, preparation and gifting
   -------------------------------------------------------------------------- */
.e-home-trust__head { margin-bottom: clamp(28px, 4vw, 48px); }

.e-home-trust__grid {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: clamp(20px, 2.5vw, 36px);
}

.e-home-trust__card { display: flex; flex-direction: column; min-width: 0; }
.e-home-trust__media { position: relative; background: var(--e-paper); }

.e-home-trust__badge {
	position: absolute;
	left: var(--e-s4);
	bottom: var(--e-s4);
	display: inline-flex;
	align-items: center;
	gap: 10px;
	padding: 9px 12px;
	background: rgba(255, 255, 255, .94);
	box-shadow: var(--e-shadow-2);
	color: var(--e-ink);
}

.e-home-trust__badge strong {
	font-family: var(--e-font-display);
	font-size: 15px;
	font-weight: var(--e-w-medium);
	letter-spacing: .04em;
}

.e-home-trust__badge strong + strong { border-left: 1px solid var(--e-line); padding-left: 10px; }
.e-home-trust__badge small { font-family: var(--e-font-body); font-size: 6px; letter-spacing: .1em; }

.e-home-trust__copy {
	display: flex;
	flex: 1;
	flex-direction: column;
	align-items: flex-start;
	padding-top: var(--e-s5);
}

.e-home-trust__copy > strong {
	margin-top: var(--e-s3);
	font-family: var(--e-font-display);
	font-size: var(--e-d4);
	font-weight: var(--e-w-display);
	line-height: 1.16;
	letter-spacing: var(--e-ls-display);
}

.e-home-trust__copy > span:not(.e-link) {
	margin-top: var(--e-s3);
	font-size: var(--e-fs-sm);
	line-height: 1.62;
	color: var(--e-ink-2);
}

.e-home-trust__copy .e-link { margin-top: auto; padding-top: var(--e-s5); }
.e-home-trust__card:hover .e-home-trust__copy > strong { color: var(--e-red); }

@media (max-width: 900px) {
	.e-home-trust__head { margin-inline: var(--e-s2); }

	.e-home-trust__grid {
		display: flex;
		overflow-x: auto;
		scroll-snap-type: x mandatory;
		scrollbar-width: none;
		margin-inline: calc(var(--e-gutter) * -1);
		padding-inline: var(--e-gutter);
		/* Without this, mandatory snapping aligns the first card to the
		   scrollport edge and swallows the leading gutter, so the card sits
		   flush against the screen while the heading above it is inset. */
		scroll-padding-inline: var(--e-gutter);
	}
	.e-home-trust__grid::-webkit-scrollbar { display: none; }
	.e-home-trust__card { flex: 0 0 min(78vw, 380px); scroll-snap-align: start; }
}

/* --------------------------------------------------------------------------
   9. Visit
   -------------------------------------------------------------------------- */
.e-visit {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	background: var(--e-surface-2);
	color: var(--e-ink);
	border-top: 1px solid var(--e-line);
}

.e-visit__media { position: relative; min-height: 100%; }

.e-visit__media img {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.e-visit__body { display: flex; align-items: center; padding: clamp(40px, 6vw, 96px) var(--e-gutter); }
.e-visit__inner { max-width: 46ch; }
.e-visit__inner .e-display-3 { margin-top: var(--e-s4); }
.e-visit__inner .e-lead { margin-top: var(--e-s5); }

.e-visit__facts {
	display: grid;
	gap: var(--e-s5);
	margin-top: var(--e-s8);
}

.e-visit__facts dt {
	font-size: 12px;
	letter-spacing: var(--e-ls-caps);
	text-transform: uppercase;
	color: var(--e-muted);
	margin-bottom: 6px;
}

.e-visit__facts dd { margin: 0; font-size: var(--e-fs-sm); color: var(--e-ink-2); line-height: 1.6; }

.e-visit__actions { display: flex; flex-wrap: wrap; gap: var(--e-s3); margin-top: var(--e-s8); }

@media (max-width: 900px) {
	.e-visit { grid-template-columns: 1fr; }
	.e-visit__media { min-height: 62vw; max-height: 420px; }
	.e-visit__actions .e-btn { flex: 1 1 220px; }
}

/* --------------------------------------------------------------------------
   Blog card (shared with the blog index and search results)
   -------------------------------------------------------------------------- */
.e-postcard { display: flex; flex-direction: column; }

.e-postcard__body { padding-top: var(--e-s5); }

.e-postcard__title {
	margin-top: var(--e-s3);
	font-family: var(--e-font-display);
	font-size: var(--e-d4);
	font-weight: var(--e-w-display);
	line-height: 1.18;
	letter-spacing: var(--e-ls-display);
}

.e-postcard__title a {
	display: inline-block;
	padding-block: 6px;
	margin-block: -6px;
}

.e-postcard__title a:hover { color: var(--e-red); }

.e-postcard__excerpt {
	margin-top: var(--e-s3);
	color: var(--e-ink-2);
	font-size: var(--e-fs-sm);
	line-height: 1.65;
}

.e-postcard__meta {
	margin-top: var(--e-s4);
	font-size: var(--e-fs-xs);
	letter-spacing: var(--e-ls-caps-s);
	text-transform: uppercase;
	color: var(--e-muted);
}

/* Layer: 08-catalog.css */
/* ==========================================================================
   ERPIN DESIGN SYSTEM — 08 CATALOG
   Page header, toolbar, sub-category rail, product grid, filters.
   ========================================================================== */

/* --------------------------------------------------------------------------
   Page header
   -------------------------------------------------------------------------- */
/*
   One header, one rhythm. Every page — catalogue, product, article, legal
   text, account — gets the same block height and the same centred alignment,
   so moving between them does not shift the page. The two variants only differ
   in whether an eyebrow and a meta line are present, never in spacing.
*/
.e-pagehead {
	padding-block: var(--e-s5) var(--e-s6);
	border-bottom: 1px solid var(--e-line);
	background: var(--e-paper);
	text-align: center;
}

.e-pagehead .e-crumbs { justify-content: center; margin-bottom: var(--e-s4); }

.e-pagehead__body {
	margin-top: 0;
	/* Full container width: a long title such as "Kişisel Verilerin Korunması
	   ve Gizlilik Politikası" fits on one line instead of breaking at 26ch. */
	max-width: none;
	margin-inline: auto;
}

.e-pagehead__title {
	font-family: var(--e-font-display);
	font-size: clamp(1.5rem, 1.05rem + 1.5vw, var(--e-d3));
	font-weight: var(--e-w-display);
	letter-spacing: var(--e-ls-display);
	line-height: 1.14;
	margin-top: 0;
	text-wrap: balance;
}

.e-pagehead__meta {
	margin-top: var(--e-s3);
	font-size: var(--e-fs-sm);
	color: var(--e-muted);
	letter-spacing: .02em;
	margin-inline: auto;
	max-width: 68ch;
}

.e-pagehead .e-eyebrow { margin-bottom: var(--e-s2); }

/* The compact variant no longer changes the box, only what is inside it. */
.e-pagehead--compact .e-pagehead__body { max-width: none; }

@media (max-width: 767px) {
	.e-pagehead { padding-block: var(--e-s4) var(--e-s5); }
	.e-pagehead .e-crumbs { margin-bottom: var(--e-s3); }
}

/* --------------------------------------------------------------------------
   Catalog shell
   -------------------------------------------------------------------------- */
.e-woo--catalog {
	padding-block: var(--e-s8) var(--e-sect-md);
}

/* Archives without a filter rail (search, tag) keep the plain centred shell. */
.e-woo--catalog > .woocommerce-notices-wrapper,
.e-woo--catalog > .e-toolbar,
.e-woo--catalog > .e-subcats,
.e-woo--catalog > .products,
.e-woo--catalog > .woocommerce-pagination,
.e-woo--catalog > .e-empty {
	width: 100%;
	max-width: calc(var(--e-max) + var(--e-gutter) * 2);
	margin-inline: auto;
	padding-inline: var(--e-gutter);
}

/*
 * The catalogue is full-bleed at every width. An earlier build put a fixed
 * 248px filter rail on the left, which cost a whole product column on a
 * 1440px screen; the filters are a drawer instead, at every size.
 */

/* --------------------------------------------------------------------------
   Sub-category rail
   -------------------------------------------------------------------------- */
.e-subcats { margin-bottom: var(--e-s7); }

.e-subcats__chip {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	min-height: 44px;
	padding: 0 18px;
	border: 1px solid var(--e-line-2);
	border-radius: var(--e-r-pill);
	font-size: var(--e-fs-sm);
	color: var(--e-ink-2);
	white-space: nowrap;
	background: var(--e-surface);
}

.e-subcats__chip span { color: var(--e-muted-2); font-size: var(--e-fs-xs); }
.e-subcats__chip:hover { border-color: var(--e-ink); color: var(--e-ink); }

.e-subcats__chip.is-active {
	background: var(--e-ink);
	border-color: var(--e-ink);
	color: #fff;
}

.e-subcats__chip.is-active span { color: rgba(255, 255, 255, .6); }

/* --------------------------------------------------------------------------
   Toolbar
   -------------------------------------------------------------------------- */
.e-toolbar {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: var(--e-s4);
	padding-block: var(--e-s4);
	border-block: 1px solid var(--e-line);
	margin-bottom: var(--e-s8);
	flex-wrap: wrap;
}

.e-toolbar__count {
	font-size: var(--e-fs-sm);
	color: var(--e-muted);
	letter-spacing: .02em;
}

.e-toolbar__summary {
	display: flex;
	align-items: center;
	gap: var(--e-s4);
}

.e-toolbar__grid {
	display: none;
	align-items: center;
	gap: 2px;
	padding-left: var(--e-s4);
	border-left: 1px solid var(--e-line);
}

.e-toolbar__gridbtn {
	display: inline-grid;
	place-items: center;
	width: 38px;
	height: 38px;
	padding: 0;
	border: 1px solid transparent;
	background: transparent;
	color: var(--e-muted-2);
	cursor: pointer;
}

.e-toolbar__gridbtn svg { fill: currentColor; }

.e-toolbar__gridbtn:hover {
	color: var(--e-ink);
	border-color: var(--e-line-2);
}

.e-toolbar__gridbtn.is-active {
	color: var(--e-ink);
	border-color: var(--e-ink);
}

.e-toolbar__gridbtn:focus-visible {
	outline: 2px solid var(--e-focus);
	outline-offset: 2px;
}

@media (min-width: 1100px) {
	.e-toolbar__grid { display: flex; }
}

.e-toolbar__controls {
	display: flex;
	align-items: center;
	gap: var(--e-s3);
}

.e-toolbar__sort {
	position: relative;
	display: flex;
	align-items: center;
}

.e-toolbar__sorticon {
	position: absolute;
	left: 14px;
	color: var(--e-muted);
	pointer-events: none;
}

.e-toolbar__select {
	min-height: 44px;
	padding: 0 40px 0 40px;
	border: 1px solid var(--e-line-2);
	background-color: var(--e-surface);
	font-size: var(--e-fs-sm);
	color: var(--e-ink);
	min-width: 210px;
}

@media (max-width: 767px) {
	.e-toolbar {
		position: sticky;
		top: var(--e-header-h);
		z-index: var(--e-z-sticky);
		background: var(--e-paper);
		margin-inline: calc(var(--e-gutter) * -1);
		padding-inline: var(--e-gutter);
		margin-bottom: var(--e-s6);
	}
	.e-toolbar__summary { order: 2; width: 100%; }
	.e-toolbar__count { font-size: var(--e-fs-xs); }
	.e-toolbar__controls { order: 1; width: 100%; }
	.e-toolbar__filters { flex: 0 0 auto; }
	.e-toolbar__sort { flex: 1 1 auto; }
	.e-toolbar__select { width: 100%; min-width: 0; }
}

/* --------------------------------------------------------------------------
   Product grid
   -------------------------------------------------------------------------- */
.e-products {
	display: grid;
	grid-template-columns: repeat(var(--cols, 4), minmax(0, 1fr));
	gap: var(--e-s10) var(--e-s6);
	margin: 0;
	padding: 0;
	list-style: none;
}

.e-products--cols-2 { --cols: 2; }
.e-products--cols-3 { --cols: 3; }
.e-products--cols-4 { --cols: 4; }
.e-products--cols-5 { --cols: 5; }

@media (max-width: 1099px) {
	.e-products--cols-4,
	.e-products--cols-5 { --cols: 3; }
}

@media (max-width: 900px) {
	.e-products { --cols: 2 !important; gap: var(--e-s8) var(--e-s4); }
}

@media (max-width: 400px) {
	.e-products { gap: var(--e-s7) var(--e-s3); }
}

/* --------------------------------------------------------------------------
   Product card
   -------------------------------------------------------------------------- */
.e-card {
	display: flex;
	flex-direction: column;
	position: relative;
	min-width: 0;
}

/*
 * The live stack still has a cached vendor rule that assigns percentage
 * widths and horizontal margins to WooCommerce loop items. Grid owns the
 * column width in Erpin, so cards must always fill their grid track.
 */
.e-products > .e-card {
	width: 100% !important;
	margin: 0 !important;
}

.e-card__media {
	display: block;
	position: relative;
	background: var(--e-surface-2);
}

/* WooCommerce's square thumbnail reset must not leave a gap in the 4:5 frame. */
body.erpin .e-products > li.e-card .e-card__media .e-frame > img.e-card__img {
	display: block;
	width: 100% !important;
	height: 100% !important;
	max-height: none;
	margin: 0 !important;
	object-fit: cover;
}

.e-card__img {
	transition: opacity var(--e-dur-3) var(--e-ease), transform var(--e-dur-4) var(--e-ease-out);
}

.e-card__img--alt {
	position: absolute;
	inset: 0;
	opacity: 0;
}

@media (hover: hover) {
	.e-card:hover .e-card__img { transform: scale(1.035); }
	.e-card:hover .e-card__img--alt { opacity: 1; }
}

.e-card__flags {
	position: absolute;
	top: 12px; left: 12px;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 6px;
	pointer-events: none;
}

.e-card__flag {
	display: inline-flex;
	align-items: center;
	height: 24px;
	padding: 0 10px;
	font-size: 11px;
	font-weight: var(--e-w-medium);
	letter-spacing: var(--e-ls-caps);
	text-transform: uppercase;
	background: var(--e-surface);
	color: var(--e-ink);
	border: 1px solid var(--e-line);
}

.e-card__flag--sale { background: var(--e-red); color: #fff; border-color: var(--e-red); }
.e-card__flag--fast { color: var(--e-success); border-color: currentColor; }
.e-card__flag--last { background: var(--e-ink); color: #fff; border-color: var(--e-ink); }

.e-card__body {
	flex: 1 1 auto;
	padding-top: var(--e-s5);
	display: flex;
	flex-direction: column;
	gap: 6px;
}

/* Two lines maximum keeps rows aligned without truncating short names. */
.e-card__title {
	font-size: var(--e-fs-base);
	font-weight: var(--e-w-normal);
	line-height: 1.4;
	letter-spacing: .002em;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
	min-height: calc(2 * 1.4em);
}

/* The card image above is the primary (large) target; the title still gets a
   comfortable 40px row so a thumb landing on the text does not miss. */
.e-card__title a {
	display: inline-block;
	padding-block: 8px;
	margin-block: -8px;
	color: var(--e-ink);
}

.e-card__title a:hover { color: var(--e-red); }

/*
 * One line, always. Some pieces carry long attribute strings ("0,75 Ct Orta
 * Taş + 0,30 Ct Yan Taşlar · SI, SI2 · 14 Ayar") and letting them wrap made
 * every card in the row a different height.
 */
.e-card__spec {
	font-size: var(--e-fs-sm);
	color: var(--e-muted);
	letter-spacing: .02em;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	min-width: 0;
}

.e-card__price {
	margin-top: 2px;
	font-size: var(--e-fs-md);
	font-weight: var(--e-w-medium);
	color: var(--e-ink);
	line-height: 1.3;
}

.e-card__price del {
	color: var(--e-muted-2);
	font-weight: var(--e-w-normal);
	font-size: var(--e-fs-sm);
	margin-right: 8px;
}

.e-card__price ins { text-decoration: none; color: var(--e-red); }

.e-card__wire {
	font-size: var(--e-fs-sm);
	color: var(--e-muted);
}

.e-card__wire strong { color: var(--e-ink-2); font-weight: var(--e-w-medium); }

/* Availability line — the single most-asked question in this catalogue is
   "is it ready or is it made to order", so it earns a permanent slot. */
.e-card__avail {
	display: flex;
	align-items: center;
	gap: 7px;
	margin-top: 2px;
	font-size: var(--e-fs-sm);
	line-height: 1.3;
	min-width: 0;
}

.e-card__avail svg { flex: none; }
.e-card__avail span { overflow-wrap: anywhere; }
.e-card__avail--fast { color: var(--e-success); }
.e-card__avail--made { color: var(--e-muted); }

/*
 * Add to cart. On pointer devices it fades in on hover to keep the grid calm;
 * on touch there is no hover, so it is always visible — the function must
 * never depend on a hover state.
 */
.e-card__action { padding-top: var(--e-s4); }

.e-card__action .added_to_cart {
	display: block;
	margin-top: 8px;
	font-size: var(--e-fs-sm);
	color: var(--e-red);
	text-align: center;
}

@media (hover: hover) and (min-width: 901px) {
	.e-card__action {
		opacity: 0;
		transform: translateY(4px);
		transition: opacity var(--e-dur-2) var(--e-ease), transform var(--e-dur-2) var(--e-ease);
	}
	.e-card:hover .e-card__action,
	.e-card:focus-within .e-card__action { opacity: 1; transform: none; }
}

/* WooCommerce injects a loading class on AJAX add. */
.e-card__atc.loading { opacity: .6; pointer-events: none; }
.e-card__atc.added { display: none; }

/* --------------------------------------------------------------------------
   Category cards (shown when a category lists sub-categories)
   -------------------------------------------------------------------------- */
.e-products .product-category > a {
	display: block;
	position: relative;
}

.e-products .product-category h2 {
	margin-top: var(--e-s4);
	font-size: var(--e-fs-base);
	font-weight: var(--e-w-medium);
	color: var(--e-ink);
}

.e-products .product-category mark {
	background: none;
	color: var(--e-muted);
	font-weight: var(--e-w-normal);
}

/* --------------------------------------------------------------------------
   Archive description below the grid
   -------------------------------------------------------------------------- */
.e-archive-note {
	margin-top: var(--e-sect-md);
	padding-top: var(--e-s9);
	border-top: 1px solid var(--e-line);
}

/* --------------------------------------------------------------------------
   Filter panel — one component, rendered in the desktop rail and the drawer
   -------------------------------------------------------------------------- */
.e-filters { padding: var(--e-s4) var(--e-s6) var(--e-s8); }

.e-filter__active {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: var(--e-s3);
	padding: 12px 14px;
	margin-bottom: var(--e-s4);
	background: var(--e-red-tint);
	border: 1px solid var(--e-red-line);
	font-size: var(--e-fs-sm);
}

.e-filter__activecount { color: #8a1418; }

.e-filter__clear {
	display: inline-flex;
	align-items: center;
	min-height: 32px;
	color: var(--e-red);
	font-weight: var(--e-w-medium);
	border-bottom: 1px solid currentColor;
}

.e-filter__group { border-bottom: 1px solid var(--e-line); }
.e-filter .e-acc__trigger { font-size: var(--e-fs-sm); min-height: 52px; padding: 14px 0; }
.e-filter .e-acc__body { padding-bottom: var(--e-s5); }

.e-filter__list { display: grid; gap: 0; }

.e-filter__list--scroll {
	max-height: 264px;
	overflow-y: auto;
	overscroll-behavior: contain;
	scrollbar-width: thin;
	padding-right: 4px;
}

.e-filter__opt {
	display: flex;
	align-items: center;
	gap: 11px;
	min-height: 40px;
	padding: 6px 0;
	font-size: var(--e-fs-sm);
	color: var(--e-ink-2);
	line-height: 1.35;
}

/* The real input is visually hidden but still focusable and still the thing
   the form submits — the box is only its picture. */
.e-filter__opt input {
	position: absolute;
	width: 1px; height: 1px;
	opacity: 0;
	pointer-events: none;
}

.e-filter__box {
	flex: none;
	width: 18px; height: 18px;
	border: 1px solid var(--e-line-2);
	background: var(--e-surface);
	transition: background var(--e-dur-1) var(--e-ease), border-color var(--e-dur-1) var(--e-ease);
}

.e-filter__box--radio { border-radius: 50%; }

.e-filter__opt:hover { color: var(--e-ink); }
.e-filter__opt:hover .e-filter__box { border-color: var(--e-ink-2); }

.e-filter__opt input:focus-visible + .e-filter__box {
	outline: 2px solid var(--e-focus);
	outline-offset: 2px;
}

.e-filter__opt input:checked ~ .e-filter__label { color: var(--e-ink); font-weight: var(--e-w-medium); }

.e-filter__opt input:checked + .e-filter__box {
	background-color: var(--e-ink);
	border-color: var(--e-ink);
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='11' height='9' viewBox='0 0 11 9' fill='none'%3E%3Cpath d='M1 4.6 4 7.6 10 1.4' stroke='white' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-position: center;
}

.e-filter__opt input[type="radio"]:checked + .e-filter__box {
	background-image: none;
	box-shadow: inset 0 0 0 4px var(--e-surface);
}

.e-filter__on {
	display: inline-grid;
	place-items: center;
	min-width: 20px; height: 20px;
	margin-left: auto;
	margin-right: 10px;
	padding: 0 6px;
	border-radius: var(--e-r-pill);
	background: var(--e-red);
	color: #fff;
	font-size: 11px;
	font-weight: var(--e-w-medium);
	letter-spacing: 0;
}

.e-filter__submit {
	position: sticky;
	bottom: 0;
	padding: var(--e-s5) 0 0;
	background: linear-gradient(to top, var(--e-surface) 70%, transparent);
}

.e-filter__label { flex: 1 1 auto; min-width: 0; }
.e-filter__count { flex: none; color: var(--e-muted-2); font-size: var(--e-fs-xs); font-variant-numeric: tabular-nums; }

/* Price range */
.e-filter__price {
	display: flex;
	align-items: center;
	gap: 8px;
}

.e-filter__price label { flex: 1 1 0; min-width: 0; }

.e-filter__price input {
	width: 100%;
	min-height: 44px;
	padding: 10px 10px;
	font-size: var(--e-fs-sm);
	text-align: center;
	font-variant-numeric: tabular-nums;
}

.e-filter__dash { flex: none; color: var(--e-muted-2); }

.e-filter__go {
	flex: none;
	min-height: 44px;
	width: 44px;
	padding: 0;
}

.e-filter__hint {
	margin-top: 10px;
	font-size: var(--e-fs-xs);
	color: var(--e-muted);
}

.e-toolbar__badge {
	display: inline-grid;
	place-items: center;
	min-width: 20px; height: 20px;
	margin-left: 2px;
	padding: 0 6px;
	border-radius: var(--e-r-pill);
	background: var(--e-red);
	color: #fff;
	font-size: 11px;
	letter-spacing: 0;
}

/* --------------------------------------------------------------------------
   WooCommerce notices — used across catalog, cart and checkout.
   -------------------------------------------------------------------------- */
.woocommerce-notices-wrapper:empty { display: none; }

.woocommerce-message,
.woocommerce-info,
.woocommerce-error,
.woocommerce-noreviews {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: var(--e-s3) var(--e-s5);
	list-style: none;
	margin: 0 0 var(--e-s6);
	padding: 16px 20px;
	border: 1px solid var(--e-line);
	border-left: 3px solid var(--e-ink);
	background: var(--e-surface);
	font-size: var(--e-fs-sm);
	color: var(--e-ink-2);
}

.woocommerce-message { border-left-color: var(--e-success); background: var(--e-success-bg); color: #1c4f36; }
.woocommerce-error   { border-left-color: var(--e-red); background: var(--e-red-tint); color: #7b1418; flex-direction: column; align-items: flex-start; }
.woocommerce-error li { width: 100%; }

.woocommerce-message .button,
.woocommerce-info .button,
.woocommerce-error .button {
	margin-left: auto;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 44px;
	padding: 11px 20px;
	background: var(--e-ink);
	color: #fff;
	font-size: var(--e-fs-xs);
	font-weight: var(--e-w-medium);
	letter-spacing: var(--e-ls-caps-s);
	text-transform: uppercase;
	border: 1px solid var(--e-ink);
}

.woocommerce-message .button:hover,
.woocommerce-info .button:hover { background: var(--e-red); border-color: var(--e-red); }

/* Video badge on the product card */
.e-card__video {
	position: absolute;
	left: 12px; bottom: 12px;
	display: inline-flex;
	align-items: center;
	gap: 6px;
	height: 26px;
	padding: 0 10px;
	background: rgba(22, 23, 27, .82);
	color: #fff;
	font-size: 11px;
	font-weight: var(--e-w-medium);
	letter-spacing: var(--e-ls-caps-s);
	text-transform: uppercase;
	pointer-events: none;
}

/* --------------------------------------------------------------------------
   Category editorial copy
   -------------------------------------------------------------------------- */
.e-catcopy {
	margin-top: var(--e-sect-md);
	padding-top: var(--e-s9);
	border-top: 1px solid var(--e-line);
}

.e-catcopy__title {
	font-family: var(--e-font-display);
	font-size: var(--e-d4);
	font-weight: var(--e-w-display);
	letter-spacing: var(--e-ls-display);
	margin-bottom: var(--e-s5);
}

.e-catcopy__lead p { max-width: 78ch; }

.e-catcopy__more {
	overflow: hidden;
	margin-top: var(--e-s6);
}

.e-catcopy__more[hidden] { display: none; }
.e-catcopy__more .e-prose { max-width: 78ch; }
.e-catcopy__more .e-prose h3 { font-size: var(--e-fs-lg); margin-top: 1.6em; }

.e-catcopy__toggle {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	min-height: 44px;
	margin-top: var(--e-s5);
	font-size: var(--e-fs-sm);
	font-weight: var(--e-w-medium);
	letter-spacing: var(--e-ls-caps-s);
	text-transform: uppercase;
	color: var(--e-ink);
	border-bottom: 1px solid var(--e-ink);
	cursor: pointer;
}

.e-catcopy__toggle:hover { color: var(--e-red); border-bottom-color: var(--e-red); }
.e-catcopy__toggle svg { transition: transform var(--e-dur-2) var(--e-ease); }
.e-catcopy__toggle[aria-expanded="true"] svg { transform: rotate(180deg); }

/* Category copy: wider measure. 78ch broke lines early in a full-width block;
   Turkish runs long and the paragraphs were stepping down every few words. */
.e-catcopy__lead p,
.e-catcopy__more .e-prose { max-width: 92ch; }

/* Live catalogue figures, as data rather than as prose. */
.e-catfacts {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(190px, 1fr));
	gap: 1px;
	background: var(--e-line);
	border: 1px solid var(--e-line);
	margin: var(--e-s6) 0 0;
	max-width: 92ch;
}

.e-catfacts__row { background: var(--e-surface); padding: var(--e-s4) var(--e-s5); }

.e-catfacts dt {
	font-size: 11px;
	letter-spacing: var(--e-ls-caps-s);
	text-transform: uppercase;
	color: var(--e-muted);
}

.e-catfacts dd {
	margin: 5px 0 0;
	font-size: var(--e-fs-sm);
	font-weight: var(--e-w-medium);
	color: var(--e-ink);
	font-variant-numeric: tabular-nums;
}

@media (max-width: 560px) {
	.e-catfacts { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.e-catfacts__row { padding: var(--e-s3) var(--e-s4); }
}

/* Layer: 09-product.css */
/* ==========================================================================
   ERPIN DESIGN SYSTEM — 09 PRODUCT

   Two halves:
   1. the layout and gallery the design system owns;
   2. the class contract emitted by inc/modules/catalog/product-detail.php and
      inc/modules/catalog/set-product-detail.php. That markup is business
      logic and is left untouched — the ~900 lines of inline CSS it used to
      print are replaced by the rules below.
   ========================================================================== */

/* The below-the-fold blocks bring their own top spacing, so the buy area only
   needs enough room to breathe — not a full section gap. */
.e-pdp { padding-block: var(--e-s5) var(--e-s9); }

.e-pdp__topbar { padding-bottom: var(--e-s7); }

.e-pdp__grid {
	display: grid;
	grid-template-columns: minmax(0, 54fr) minmax(0, 46fr);
	gap: clamp(32px, 4.5vw, 80px);
	align-items: start;
}

.e-pdp__summary { position: relative; }
.e-pdp__anchor { position: absolute; left: 0; bottom: 0; width: 1px; height: 1px; }

@media (max-width: 991px) {
	.e-pdp__grid { grid-template-columns: minmax(0, 1fr); gap: var(--e-s7); }
	.e-pdp { padding-block: var(--e-s3) var(--e-s9); }
	.e-pdp__topbar { padding-bottom: var(--e-s4); }
}

/* --------------------------------------------------------------------------
   Gallery
   -------------------------------------------------------------------------- */
.e-gallery { position: relative; }

.e-gallery__stagewrap { position: relative; }

.e-gallery__stage {
	display: grid;
	background: var(--e-surface-2);
}

.e-gallery__slide {
	grid-area: 1 / 1;
	position: relative;
	aspect-ratio: 1 / 1;
	overflow: hidden;
	opacity: 0;
	visibility: hidden;
	transition: opacity var(--e-dur-2) var(--e-ease);
}

.e-gallery__slide.is-active { opacity: 1; visibility: visible; }

.e-gallery__slide img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform var(--e-dur-3) var(--e-ease-out);
}

/* Square product photographs keep their full composition and fill the stage.
   The scoped rule wins over WooCommerce's intrinsic height:auto image rule. */
body.erpin.single-product .e-gallery__slide > img {
	position: absolute;
	inset: 0;
	display: block;
	width: 100% !important;
	height: 100% !important;
	object-fit: contain;
}
body.erpin.single-product .e-gallery__slide--video > img { object-fit: cover; }

/* Hover zoom: transform-origin is set from the pointer position in JS. */
.e-gallery__slide.is-zooming { cursor: zoom-in; }
.e-gallery__slide.is-zooming img { transform: scale(1.85); transition-duration: 90ms; }

.e-gallery__expand {
	position: absolute;
	top: var(--e-s4); right: var(--e-s4);
	z-index: 2;
	width: 44px; height: 44px;
	display: grid;
	place-items: center;
	background: rgba(255, 255, 255, .92);
	color: var(--e-ink);
	border-radius: 50%;
	box-shadow: var(--e-shadow-1);
	transition: background var(--e-dur-1) var(--e-ease);
}

.e-gallery__expand:hover { background: #fff; color: var(--e-red); }

.e-gallery__nav {
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	z-index: 2;
	width: 46px; height: 46px;
	display: grid;
	place-items: center;
	background: rgba(255, 255, 255, .9);
	color: var(--e-ink);
	border-radius: 50%;
	opacity: 0;
	transition: opacity var(--e-dur-2) var(--e-ease), background var(--e-dur-1) var(--e-ease);
}

.e-gallery__nav--prev { left: var(--e-s4); }
.e-gallery__nav--next { right: var(--e-s4); }

.e-gallery__stagewrap:hover .e-gallery__nav,
.e-gallery__nav:focus-visible { opacity: 1; }

.e-gallery__counter {
	position: absolute;
	bottom: var(--e-s4);
	left: 50%;
	transform: translateX(-50%);
	padding: 5px 12px;
	background: rgba(12, 10, 8, .6);
	color: #fff;
	font-size: var(--e-fs-xs);
	letter-spacing: .06em;
	border-radius: var(--e-r-pill);
}

.e-gallery__thumbs {
	display: flex;
	gap: var(--e-s3);
	margin-top: var(--e-s3);
	overflow-x: auto;
	scrollbar-width: none;
}

.e-gallery__thumbs::-webkit-scrollbar { display: none; }

.e-gallery__thumb {
	flex: 0 0 88px;
	position: relative;
	aspect-ratio: 4 / 5;
	overflow: hidden;
	background: var(--e-surface-2);
	border: 1px solid transparent;
	outline-offset: 2px;
	transition: border-color var(--e-dur-1) var(--e-ease), opacity var(--e-dur-1) var(--e-ease);
	opacity: .68;
	cursor: pointer;
}

.e-gallery__thumb img { width: 100%; height: 100%; object-fit: cover; }
.e-gallery__thumb:hover { opacity: 1; }
.e-gallery__thumb.is-active { opacity: 1; border-color: var(--e-ink); }

.e-gallery__extra:empty { display: none; }

@media (max-width: 991px) {
	/* Swipeable stage on touch: a click-only gallery is a dead end there. */
	.e-gallery__stage {
		display: flex;
		overflow-x: auto;
		scroll-snap-type: x mandatory;
		scrollbar-width: none;
		margin-inline: calc(var(--e-gutter) * -1);
		padding-inline: 0;
	}
	.e-gallery__stage::-webkit-scrollbar { display: none; }
	.e-gallery__slide {
		flex: 0 0 100%;
		scroll-snap-align: center;
		opacity: 1;
		visibility: visible;
	}
	.e-gallery__thumbs {
		margin-inline: calc(var(--e-gutter) * -1);
		padding-inline: var(--e-gutter);
	}
	.e-gallery__thumb { flex-basis: 66px; }
}

/* --------------------------------------------------------------------------
   Lightbox
   -------------------------------------------------------------------------- */
.e-lightbox {
	position: fixed;
	inset: 0;
	z-index: var(--e-z-modal);
	background: rgba(8, 7, 6, .96);
	display: flex;
	flex-direction: column;
	opacity: 0;
	transition: opacity var(--e-dur-2) var(--e-ease);
}

.e-lightbox[hidden] { display: none; }
.e-lightbox.is-open { opacity: 1; }

.e-lightbox__bar {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: var(--e-s4);
	padding: var(--e-s4) var(--e-s5);
	color: #fff;
	flex: none;
}

.e-lightbox__counter { font-size: var(--e-fs-sm); letter-spacing: .08em; color: rgba(255, 255, 255, .6); }

.e-lightbox__stage {
	flex: 1 1 auto;
	display: grid;
	place-items: center;
	padding: 0 var(--e-s5) var(--e-s8);
	min-height: 0;
}

.e-lightbox__stage img {
	max-width: min(100%, 1100px);
	max-height: 100%;
	width: auto;
	object-fit: contain;
}

.e-lightbox__nav {
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	width: 52px; height: 52px;
	display: grid;
	place-items: center;
	color: #fff;
	border: 1px solid rgba(255, 255, 255, .28);
	border-radius: 50%;
	transition: background var(--e-dur-1) var(--e-ease);
}

.e-lightbox__nav:hover { background: rgba(255, 255, 255, .12); }
.e-lightbox__nav--prev { left: var(--e-s5); }
.e-lightbox__nav--next { right: var(--e-s5); }

@media (max-width: 767px) {
	.e-lightbox__nav { width: 44px; height: 44px; }
	.e-lightbox__nav--prev { left: 8px; }
	.e-lightbox__nav--next { right: 8px; }
}

/* --------------------------------------------------------------------------
   Summary
   -------------------------------------------------------------------------- */
.e-pdp__summary .product_title {
	font-family: var(--e-font-display);
	font-size: var(--e-d3);
	font-weight: var(--e-w-display);
	letter-spacing: var(--e-ls-display);
	line-height: 1.12;
	margin-bottom: var(--e-s5);
}

.e-pdp__summary .price {
	display: block;
	font-size: var(--e-d4);
	font-weight: var(--e-w-medium);
	color: var(--e-ink);
	line-height: 1.1;
	margin-bottom: var(--e-s5);
}

.e-pdp__summary .price del { color: var(--e-muted-2); font-size: var(--e-fs-lg); font-weight: var(--e-w-normal); margin-right: 12px; }
.e-pdp__summary .price ins { text-decoration: none; color: var(--e-red); }

/* Short description. On this store it holds a single "view on Instagram"
   link, which becomes a quiet inline action rather than a gradient button. */
.e-pdp__summary .woocommerce-product-details__short-description {
	margin-bottom: var(--e-s6);
	font-size: var(--e-fs-sm);
	color: var(--e-ink-2);
	line-height: 1.65;
}

.e-pdp__summary .woocommerce-product-details__short-description a {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	min-height: 40px;
	color: var(--e-ink);
	border-bottom: 1px solid var(--e-line-2);
	padding-bottom: 2px;
	font-size: var(--e-fs-sm);
	letter-spacing: .01em;
}

.e-pdp__summary .woocommerce-product-details__short-description a:hover {
	color: var(--e-red);
	border-bottom-color: var(--e-red);
}

/* ==========================================================================
   MODULE CONTRACT — inc/modules/catalog/product-detail.php
   Markup below is generated by the commerce module. Class names must not
   change; only their presentation is defined here.
   ========================================================================== */

/* ---- Wire transfer + instalment grid (im_fiyat_grid_v14) ---------------- */
body.erpin .im-fiyat-grid-wrapper {
	display: grid !important;
	grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
	gap: 12px !important;
	width: 100% !important;
	margin: 4px 0 var(--e-s6) !important;
	padding: 0 !important;
	background: transparent !important;
	border: 0 !important;
}

body.erpin .im-fiyat-grid-wrapper .im-havale-box,
body.erpin .im-fiyat-grid-wrapper .im-taksit-box {
	display: flex;
	align-items: center !important;
	justify-content: flex-start !important;
	gap: 14px !important;
	box-sizing: border-box !important;
	width: 100% !important;
	max-width: none !important;
	min-height: 78px !important;
	margin: 0 !important;
	padding: 15px 17px !important;
	background: var(--e-surface-2) !important;
	border: 1px solid var(--e-line) !important;
	border-radius: 0 !important;
	box-shadow: none !important;
	font-size: var(--e-fs-sm) !important;
	color: var(--e-ink) !important;
	line-height: 1.3 !important;
}

body.erpin .im-fiyat-grid-wrapper .im-pay-icon {
	display: grid;
	place-items: center;
	flex: 0 0 40px;
	width: 40px;
	height: 40px;
	color: var(--e-red);
	background: var(--e-surface);
	border: 1px solid var(--e-line-2);
}

body.erpin .im-fiyat-grid-wrapper .im-pay-icon .e-icon {
	display: block;
}

body.erpin .im-fiyat-grid-wrapper .im-havale-yazi,
body.erpin .im-fiyat-grid-wrapper .im-taksit-yazi {
	display: block;
	min-width: 0;
}

body.erpin .im-fiyat-grid-wrapper .im-pay-label {
	display: block;
	font-size: 12px;
	font-weight: var(--e-w-medium);
	letter-spacing: .03em;
	color: var(--e-muted);
}

body.erpin .im-fiyat-grid-wrapper .im-havale-rakam,
body.erpin .im-fiyat-grid-wrapper .im-taksit-rakam {
	display: block;
	margin: 4px 0 0 !important;
	font-size: clamp(18px, 1.55vw, 22px) !important;
	font-weight: var(--e-w-medium) !important;
	line-height: 1.1;
	color: var(--e-ink) !important;
	letter-spacing: -.015em;
	font-variant-numeric: tabular-nums;
}

@media (max-width: 480px) {
	body.erpin .im-fiyat-grid-wrapper {
		grid-template-columns: 1fr !important;
		gap: 8px !important;
	}

	body.erpin .im-fiyat-grid-wrapper .im-havale-box,
	body.erpin .im-fiyat-grid-wrapper .im-taksit-box {
		min-height: 70px !important;
		padding: 13px 15px !important;
	}
}

/* ---- Technical card (im_teknik_kart_v14) -------------------------------- */
.im-teknik-kart {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 1px;
	background: var(--e-line);
	border: 1px solid var(--e-line);
	margin-bottom: var(--e-s6);
}

.im-teknik-satir {
	display: flex;
	align-items: center;
	gap: 12px;
	padding: 14px 16px;
	background: var(--e-surface);
	min-height: 62px;
}

/*
 * The module ships each row with a coloured icon tile. Those tiles are the
 * single biggest source of visual noise on the old page, so the icon is
 * reduced to a hairline glyph in the muted ink.
 */
.im-ikon-kutu {
	flex: none;
	width: 22px; height: 22px;
	color: var(--e-muted);
}

.im-ikon-kutu svg { width: 100%; height: 100%; }

.im-metin-kutu { min-width: 0; }

.im-baslik {
	display: block;
	font-size: 11px;
	letter-spacing: var(--e-ls-caps);
	text-transform: uppercase;
	color: var(--e-muted);
	line-height: 1.3;
}

.im-deger {
	display: block;
	margin-top: 3px;
	font-size: var(--e-fs-sm);
	font-weight: var(--e-w-medium);
	color: var(--e-ink);
	overflow-wrap: anywhere;
}

.im-stok-satir {
	grid-column: 1 / -1;
	display: flex;
	align-items: flex-start;
	gap: 11px;
	padding: 14px 16px;
	background: var(--e-surface);
	font-size: var(--e-fs-sm);
	line-height: 1.5;
}

.im-stok-satir svg { flex: none; width: 20px; height: 20px; margin-top: 1px; }
.im-stok-satir strong { font-weight: var(--e-w-medium); }

.im-stok-var { background: var(--e-success-bg); color: #1c4f36; }
.im-stok-var svg { color: var(--e-success); }

.im-stok-yok { background: var(--e-warning-bg); color: #6b4610; }
.im-stok-yok svg { color: var(--e-warning); }

.im-stok-sure { font-weight: var(--e-w-medium); }
.im-stok-not { margin-top: 4px; font-size: var(--e-fs-2xs); opacity: .85; }

@media (max-width: 480px) {
	.im-teknik-kart { grid-template-columns: 1fr; }
}

/* ---- Configuration fields (imd_render_product_configuration_fields) ----- */
.imd-product-options {
	display: grid;
	gap: var(--e-s4);
	margin-bottom: var(--e-s5);
}

.imd-product-option { display: block; }

.imd-product-option > span {
	display: block;
	margin-bottom: 8px;
	font-size: var(--e-fs-sm);
	font-weight: var(--e-w-medium);
	color: var(--e-ink);
}

.imd-product-option > span small {
	margin-left: 6px;
	font-weight: var(--e-w-normal);
	font-size: var(--e-fs-sm);
	color: var(--e-muted);
}

/* ---- Add to cart form ---------------------------------------------------- */
/*
 * The purchase row is a grid rather than WooCommerce's float layout so the
 * quantity stepper and the buy button share one baseline at every width.
 * The configuration fields (ring size, engraving, gold colour) are injected
 * by the module before the button, so they are pulled out of the grid flow.
 */
.e-pdp__summary form.cart {
	display: grid;
	grid-template-columns: auto minmax(0, 1fr);
	gap: var(--e-s3);
	align-items: stretch;
	margin-bottom: var(--e-s5);
}

.e-pdp__summary form.cart > .imd-product-options,
.e-pdp__summary form.cart > .woocommerce-variation-add-to-cart,
.e-pdp__summary form.cart > .variations,
.e-pdp__summary form.cart > p:not(.cart),
.e-pdp__summary form.cart > .im-quick-buy-pid,
.e-pdp__summary form.cart > input[type="hidden"] { grid-column: 1 / -1; }

.e-pdp__summary form.cart .quantity {
	float: none;
	display: flex;
	margin: 0;
}

.e-pdp__summary form.cart > .quantity.hidden {
	display: none !important;
}

.e-pdp__summary form.cart > .quantity.hidden + .single_add_to_cart_button {
	grid-column: 1 / -1;
	width: 100%;
}

.e-pdp__summary form.cart .quantity input.qty {
	width: 84px;
	min-height: 60px;
	text-align: center;
	border: 1px solid var(--e-line-2);
	font-weight: var(--e-w-medium);
}

.e-pdp__summary form.cart button.single_add_to_cart_button,
.e-pdp__summary form.cart .single_add_to_cart_button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 10px;
	/* The buy button is the widest element in the column on purpose. */
	width: 100%;
	min-height: 60px;
	padding: 16px 28px;
	background: var(--e-red);
	border: 1px solid var(--e-red);
	color: #fff;
	font-family: var(--e-font-text);
	font-size: var(--e-fs-sm);
	font-weight: var(--e-w-medium);
	letter-spacing: var(--e-ls-caps-s);
	text-transform: uppercase;
	cursor: pointer;
	transition: background var(--e-dur-2) var(--e-ease), border-color var(--e-dur-2) var(--e-ease);
}

/* Without a quantity field the button owns the whole row. */
.e-pdp__summary form.cart > button.single_add_to_cart_button:first-of-type { grid-column: 1 / -1; }
.e-pdp__summary form.cart .quantity ~ button.single_add_to_cart_button { grid-column: auto; }

.e-pdp__summary form.cart button.single_add_to_cart_button:hover {
	background: var(--e-red-hover);
	border-color: var(--e-red-hover);
}

.e-pdp__summary form.cart button.single_add_to_cart_button.loading { opacity: .7; pointer-events: none; }

.e-pdp__summary .stock.out-of-stock {
	display: block;
	padding: 14px 16px;
	background: var(--e-warning-bg);
	color: #6b4610;
	font-size: var(--e-fs-sm);
	border-left: 3px solid var(--e-warning);
}

/* ---- Personalisation buttons (im_kisisel_grid_v13) ---------------------- */
.im-kisisel-grid {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: var(--e-s3);
	margin-bottom: var(--e-s6);
}

.im-yuzuk-olcu-btn,
.im-ozellestir-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 9px;
	min-height: 52px;
	padding: 12px 16px;
	background: transparent;
	border: 1px solid var(--e-line-2);
	color: var(--e-ink-2);
	font-size: var(--e-fs-sm);
	line-height: 1.3;
	text-align: center;
	cursor: pointer;
	transition: border-color var(--e-dur-1) var(--e-ease), color var(--e-dur-1) var(--e-ease);
}

.im-yuzuk-olcu-btn svg,
.im-ozellestir-btn svg {
	flex: none;
	width: 18px;
	height: 18px;
	color: var(--e-muted);
	fill: none !important;
	stroke: currentColor;
	stroke-linecap: round;
	stroke-linejoin: round;
}

.im-yuzuk-olcu-btn svg *,
.im-ozellestir-btn svg * {
	fill: none !important;
	stroke: currentColor;
}

.im-yuzuk-olcu-btn:hover,
.im-ozellestir-btn:hover { border-color: var(--e-ink); color: var(--e-ink); }
.im-yuzuk-olcu-btn:hover svg,
.im-ozellestir-btn:hover svg { color: var(--e-red); }

@media (max-width: 420px) {
	.im-kisisel-grid { grid-template-columns: 1fr; }
}

/* ---- Assurance list ----------------------------------------------------- */
.e-pdp__assurance {
	display: grid;
	gap: 10px;
	padding-top: var(--e-s5);
	border-top: 1px solid var(--e-line);
	margin-top: var(--e-s5);
}

.e-pdp__assurance li {
	display: flex;
	align-items: flex-start;
	gap: 11px;
	font-size: var(--e-fs-sm);
	color: var(--e-ink-2);
	line-height: 1.5;
}

.e-pdp__assurance svg { flex: none; color: var(--e-muted); margin-top: 2px; }

/* ---- Popups (im_popups_v13) --------------------------------------------- */
.im-popup-overlay {
	position: fixed;
	inset: 0;
	z-index: var(--e-z-modal);
	display: grid;
	place-items: center;
	padding: var(--e-s5);
	background: rgba(12, 10, 8, .58);
	opacity: 0;
	visibility: hidden;
	pointer-events: none;
	transition: opacity var(--e-dur-2) var(--e-ease), visibility var(--e-dur-2) var(--e-ease);
}

.im-popup-overlay.active { opacity: 1; visibility: visible; pointer-events: auto; }

.im-popup-box {
	width: min(680px, 100%);
	max-height: min(88vh, 860px);
	display: flex;
	flex-direction: column;
	background: var(--e-surface);
	box-shadow: var(--e-shadow-3);
	transform: translateY(12px);
	transition: transform var(--e-dur-3) var(--e-ease-out);
}

.im-popup-overlay.active .im-popup-box { transform: none; }

.im-popup-header {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: var(--e-s4);
	padding: var(--e-s5) var(--e-s6);
	border-bottom: 1px solid var(--e-line);
	flex: none;
}

.im-popup-title {
	display: inline-flex;
	align-items: center;
	gap: 12px;
	font-family: var(--e-font-display);
	font-size: var(--e-fs-xl);
	font-weight: var(--e-w-display);
	margin: 0;
}

.im-popup-title > svg {
	flex: none;
	display: block;
	width: 24px;
	height: 24px;
	color: var(--e-red);
	fill: none !important;
	stroke: currentColor;
	stroke-linecap: round;
	stroke-linejoin: round;
}

.im-popup-title > svg * {
	fill: none !important;
	stroke: currentColor;
}

.im-popup-close {
	width: 44px; height: 44px;
	display: grid;
	place-items: center;
	font-size: 22px;
	line-height: 1;
	color: var(--e-muted);
	cursor: pointer;
	background: none;
	border: 0;
}

.im-popup-close:hover { color: var(--e-red); }

.im-popup-content {
	padding: var(--e-s6);
	overflow-y: auto;
	overscroll-behavior: contain;
	font-size: var(--e-fs-sm);
	line-height: 1.65;
	color: var(--e-ink-2);
}

.im-popup-footer {
	flex: none;
	padding: var(--e-s5) var(--e-s6);
	border-top: 1px solid var(--e-line);
	background: var(--e-surface);
}

.im-yuzuk-table {
	width: 100%;
	border-collapse: collapse;
	font-size: var(--e-fs-sm);
	margin-bottom: var(--e-s5);
}

.im-yuzuk-table th,
.im-yuzuk-table td {
	padding: 11px 12px;
	border: 1px solid var(--e-line);
	text-align: left;
}

.im-yuzuk-table th {
	background: var(--e-surface-2);
	font-weight: var(--e-w-medium);
	color: var(--e-ink);
	font-size: var(--e-fs-xs);
	letter-spacing: var(--e-ls-caps-s);
	text-transform: uppercase;
}

.im-yuzuk-info {
	padding: 14px 16px;
	background: var(--e-surface-2);
	border-left: 3px solid var(--e-red);
	font-size: var(--e-fs-sm);
}

.im-yuzuk-footer-link {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	min-height: 44px;
	color: var(--e-ink);
	border-bottom: 1px solid var(--e-red);
	font-size: var(--e-fs-sm);
	font-weight: var(--e-w-medium);
}

.im-ozellestir-group { margin-bottom: var(--e-s5); }

.im-ozellestir-label {
	display: block;
	margin-bottom: 8px;
	font-size: var(--e-fs-sm);
	font-weight: var(--e-w-medium);
	color: var(--e-ink);
}

.im-ozellestir-save {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	min-height: 52px;
	padding: 14px 24px;
	background: var(--e-ink);
	border: 1px solid var(--e-ink);
	color: #fff;
	font-size: var(--e-fs-sm);
	font-weight: var(--e-w-medium);
	letter-spacing: var(--e-ls-caps-s);
	text-transform: uppercase;
	cursor: pointer;
}

.im-ozellestir-save:hover { background: var(--e-red); border-color: var(--e-red); }

.opsiyonel { color: var(--e-muted); font-weight: var(--e-w-normal); }

/* ---- Specification table (im_specs_v14) --------------------------------- */
.im-spec-container {
	width: 100%;
	max-width: calc(var(--e-max-rd) + var(--e-gutter) * 2);
	margin-inline: auto;
	padding-inline: var(--e-gutter);
	margin-top: var(--e-sect-sm);
}

.im-spec-main-title {
	font-family: var(--e-font-display);
	font-size: var(--e-d4);
	font-weight: var(--e-w-display);
	letter-spacing: var(--e-ls-display);
	margin-bottom: var(--e-s6);
}

.im-spec-grid {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 0 var(--e-s10);
}

.im-spec-item {
	display: flex;
	align-items: baseline;
	justify-content: space-between;
	gap: var(--e-s5);
	padding: 15px 0;
	border-bottom: 1px solid var(--e-line);
}

.im-spec-label {
	font-size: var(--e-fs-sm);
	color: var(--e-muted);
	letter-spacing: .01em;
}

.im-spec-value {
	font-size: var(--e-fs-sm);
	font-weight: var(--e-w-medium);
	color: var(--e-ink);
	text-align: right;
}

@media (max-width: 767px) {
	.im-spec-grid { grid-template-columns: 1fr; }
}

/* ---- Set offer box (im_set_offer_box_force_v2) --------------------------- */
.imsetx-wrap {
	border: 1px solid var(--e-line);
	background: var(--e-surface);
	margin-bottom: var(--e-s6);
}

.imsetx-head {
	padding: var(--e-s5) var(--e-s5) var(--e-s3);
	border-bottom: 1px solid var(--e-line);
}

.imsetx-title {
	font-family: var(--e-font-display);
	font-size: var(--e-fs-xl);
	font-weight: var(--e-w-display);
	margin: 0;
}

.imsetx-grid {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(120px, 1fr));
	gap: var(--e-s4);
	padding: var(--e-s5);
}

.imsetx-item { min-width: 0; text-align: center; }

.imsetx-img {
	display: block;
	width: 100%;
	aspect-ratio: 4 / 5;
	object-fit: cover;
	background: var(--e-surface-2);
	margin-bottom: 10px;
}

.imsetx-name {
	display: block;
	font-size: var(--e-fs-sm);
	line-height: 1.4;
	color: var(--e-ink-2);
}

.imsetx-price { display: block; margin-top: 4px; font-size: var(--e-fs-sm); color: var(--e-muted); }
.imsetx-price .final { color: var(--e-red); font-weight: var(--e-w-medium); }

.imsetx-foot {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: var(--e-s4);
	flex-wrap: wrap;
	padding: var(--e-s5);
	border-top: 1px solid var(--e-line);
	background: var(--e-surface-2);
}

.imsetx-prices { font-size: var(--e-fs-md); }
.imsetx-prices .final { color: var(--e-red); font-weight: var(--e-w-medium); font-size: var(--e-fs-lg); }

.imsetx-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 52px;
	padding: 14px 26px;
	background: var(--e-ink);
	border: 1px solid var(--e-ink);
	color: #fff;
	font-size: var(--e-fs-sm);
	font-weight: var(--e-w-medium);
	letter-spacing: var(--e-ls-caps-s);
	text-transform: uppercase;
	cursor: pointer;
}

.imsetx-btn:hover { background: var(--e-red); border-color: var(--e-red); }

/* ==========================================================================
   Below-the-fold sections
   ========================================================================== */
.e-pdp__details { margin-top: var(--e-sect-sm); }

.related.products,
.up-sells.products,
.pls-recently-viewed-products {
	width: 100%;
	max-width: calc(var(--e-max) + var(--e-gutter) * 2);
	margin-inline: auto;
	padding-inline: var(--e-gutter);
	margin-top: var(--e-sect-sm);
}

.related.products > h2,
.up-sells.products > h2,
.pls-recently-viewed-products h2,
.cross-sells > h2 {
	font-family: var(--e-font-display);
	font-size: var(--e-d3);
	font-weight: var(--e-w-display);
	letter-spacing: var(--e-ls-display);
	margin-bottom: var(--e-s8);
	padding-bottom: var(--e-s5);
	border-bottom: 1px solid var(--e-line);
}

/* --------------------------------------------------------------------------
   Below-the-fold rails (recently viewed)
   -------------------------------------------------------------------------- */
.e-pdp__rail { margin-top: var(--e-sect-sm); }

.e-pdp__railtitle {
	font-family: var(--e-font-display);
	font-size: var(--e-d3);
	font-weight: var(--e-w-display);
	letter-spacing: var(--e-ls-display);
	margin-bottom: var(--e-s8);
	padding-bottom: var(--e-s5);
	border-bottom: 1px solid var(--e-line);
}

/* --------------------------------------------------------------------------
   Video slides
   -------------------------------------------------------------------------- */
.e-gallery__slide--video { cursor: pointer; }
.e-gallery__slide--video img { width: 100%; height: 100%; object-fit: cover; }

.e-gallery__slide--video iframe {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	border: 0;
	z-index: 3;
}

.e-gallery__playbtn {
	position: absolute;
	inset: 0;
	z-index: 2;
	display: grid;
	place-content: center;
	justify-items: center;
	gap: 10px;
	color: #fff;
	background: rgba(12, 10, 8, .28);
	transition: background var(--e-dur-2) var(--e-ease);
}

.e-gallery__playbtn span {
	font-size: var(--e-fs-xs);
	font-weight: var(--e-w-medium);
	letter-spacing: var(--e-ls-caps-s);
	text-transform: uppercase;
}

.e-gallery__playbtn:hover { background: rgba(12, 10, 8, .42); }
.e-gallery__slide.is-playing .e-gallery__playbtn { display: none; }

.e-gallery__thumb--video { position: relative; }

.e-gallery__thumbplay {
	position: absolute;
	inset: 0;
	display: grid;
	place-items: center;
	color: #fff;
	background: rgba(12, 10, 8, .32);
	pointer-events: none;
}

/* --------------------------------------------------------------------------
   Spec hints (<details> next to Ayar / Renk / Berraklık …)
   -------------------------------------------------------------------------- */
/* `display:inline` + a hand-tuned `vertical-align` left the glyph sitting
   below its label; an inline-flex wrapper aligned on the text baseline puts it
   on the same line whatever the label's size. */
.e-hint {
	display: inline-flex;
	align-items: center;
	vertical-align: middle;
	position: relative;
	margin-left: 4px;
}

.e-hint__btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 24px; height: 24px;
	margin: 0;
	color: var(--e-muted-2);
	cursor: pointer;
	list-style: none;
	border-radius: 50%;
}

.e-hint__btn svg { display: block; }

.e-hint__btn::-webkit-details-marker { display: none; }
.e-hint__btn:hover { color: var(--e-red); }
.e-hint[open] .e-hint__btn { color: var(--e-red); }

.e-hint__body {
	display: block;
	position: absolute;
	left: -8px;
	top: calc(100% + 6px);
	z-index: var(--e-z-dropdown);
	width: min(280px, 78vw);
	padding: 14px 16px;
	background: var(--e-ink);
	color: rgba(255, 255, 255, .82);
	font-size: var(--e-fs-sm);
	font-weight: var(--e-w-normal);
	line-height: 1.55;
	letter-spacing: 0;
	text-transform: none;
	box-shadow: var(--e-shadow-3);
}

.e-hint__body strong { display: block; color: #fff; font-weight: var(--e-w-medium); margin-bottom: 5px; }

/* The line about this product's own grade, set apart from the definition. */
.e-hint__this {
	display: block;
	margin-top: 9px;
	padding-top: 9px;
	border-top: 1px solid rgba(255, 255, 255, .18);
	color: #fff;
	font-style: normal;
}

@media (max-width: 767px) {
	/* Anchor to the card edge on phones so a hint near the right column
	   cannot push the document sideways. */
	.e-hint { position: static; }
	.e-hint__body {
		left: var(--e-gutter);
		right: var(--e-gutter);
		width: auto;
	}
	.im-teknik-satir { position: relative; }
}

/* --------------------------------------------------------------------------
   FAQ panels inside the product accordion
   -------------------------------------------------------------------------- */
.e-acc__item--faq .e-acc__trigger { font-weight: var(--e-w-normal); }

/* --------------------------------------------------------------------------
   The three promises on the product page.
   Same cards as the homepage, tightened for the narrower column.
   -------------------------------------------------------------------------- */
/* Every block below the summary is separated by --e-sect-sm. .e-section brings
   its own padding-block, which would stack on top of that margin and make this
   one block sit in a gap half again as large as its neighbours. */
.e-product-trust { margin-top: var(--e-sect-sm); padding-block: 0; }
.e-product-trust .e-sect-head { margin-bottom: var(--e-s6); }

.e-home-trust__grid--compact {
	gap: var(--e-s5);
}

.e-home-trust__grid--compact .e-home-trust__copy strong { font-size: var(--e-fs-base); }
.e-home-trust__grid--compact .e-home-trust__copy > span { font-size: var(--e-fs-sm); }

@media (max-width: 900px) {
	.e-home-trust__grid--compact { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 600px) {
	.e-home-trust__grid--compact { grid-template-columns: minmax(0, 1fr); }
}
/* On the homepage this section sits directly in the page, so the grid supplies
   its own gutters. On the product page it sits inside .e-container, which
   already does — the two stack and the cards drift off the page grid.
   Above 900 only: below that the grid is a bleed scroll rail whose negative
   margin and padding are a matched pair. */
@media (min-width: 901px) {
	.e-home-trust__grid--compact { padding-inline: 0; }
}

/* Layer: 10-commerce.css */
/* ==========================================================================
   ERPIN DESIGN SYSTEM — 10 COMMERCE
   Cart, checkout, account, order received.

   The cart is rendered by inc/modules/commerce/cart.php with an `im-cart-*`
   class contract, and the loyalty box by inc/modules/commerce/loyalty.php with
   `erpin-points-*`. Those class names are business-module output and are not
   renamed here — their old standalone stylesheet is dequeued and replaced by
   the rules below so the page speaks the same language as the rest of the site.
   ========================================================================== */

.e-pagebody { width: 100%; }

/* --------------------------------------------------------------------------
   Cart shell
   -------------------------------------------------------------------------- */
.im-cart-container { width: 100%; }

.im-cart-grid {
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(0, 380px);
	gap: clamp(32px, 4vw, 64px);
	align-items: start;
	margin-top: var(--e-s7);
}

.im-cart-left { min-width: 0; }

.im-cart-right {
	position: sticky;
	top: calc(var(--e-header-h) + 24px);
	border: 1px solid var(--e-line);
	background: var(--e-surface);
	padding: var(--e-s6);
}

@media (max-width: 1023px) {
	.im-cart-grid { grid-template-columns: minmax(0, 1fr); }
	.im-cart-right { position: static; }
}

/* --------------------------------------------------------------------------
   Reward + promo notices
   -------------------------------------------------------------------------- */
.im-cart-reward-box,
.im-promo-box {
	display: flex;
	align-items: flex-start;
	gap: var(--e-s4);
	padding: 16px 18px;
	border: 1px solid var(--e-line);
	border-left: 3px solid var(--e-ink);
	background: var(--e-surface);
	font-size: var(--e-fs-sm);
	line-height: 1.55;
	color: var(--e-ink-2);
}

.im-cart-reward-box { border-left-color: var(--e-red); margin-bottom: var(--e-s4); }

.im-reward-icon,
.im-promo-icon {
	flex: none;
	width: 22px; height: 22px;
	color: var(--e-red);
	margin-top: 1px;
}

.im-reward-icon svg,
.im-promo-icon svg { width: 100%; height: 100%; }

.im-reward-text strong,
.im-promo-content strong {
	display: inline;
	color: var(--e-ink);
	font-weight: var(--e-w-medium);
}

.im-promo-content strong { display: block; margin-bottom: 3px; }
.im-promo-content span { display: block; color: var(--e-muted); }

.im-promo-grid {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: var(--e-s4);
}

.im-promo-gift-won {
	border-left-color: var(--e-success);
	background: var(--e-success-bg);
}

.im-promo-gift-won .im-promo-icon,
.im-promo-gift-won .im-promo-content strong { color: var(--e-success); }

@media (max-width: 767px) {
	.im-promo-grid { grid-template-columns: 1fr; }
}

/* --------------------------------------------------------------------------
   Cart table
   -------------------------------------------------------------------------- */
.im_custom_table {
	width: 100%;
	border-collapse: collapse;
	font-size: var(--e-fs-sm);
}

.im_custom_table thead th {
	padding: 0 var(--e-s4) var(--e-s3);
	text-align: left;
	font-size: var(--e-fs-xs);
	font-weight: var(--e-w-medium);
	letter-spacing: var(--e-ls-caps);
	text-transform: uppercase;
	color: var(--e-muted);
	border-bottom: 1px solid var(--e-line-2);
	white-space: nowrap;
}

.im_custom_table td {
	padding: var(--e-s5) var(--e-s4);
	border-bottom: 1px solid var(--e-line);
	vertical-align: middle;
}

.im_custom_table th:first-child,
.im_custom_table td:first-child { padding-left: 0; }
.im_custom_table th:last-child,
.im_custom_table td:last-child { padding-right: 0; }

.im-td-img { width: 96px; }

.im-td-img img {
	width: 88px;
	height: 110px;
	object-fit: cover;
	background: var(--e-surface-2);
}

.im-td-name a {
	font-size: var(--e-fs-base);
	color: var(--e-ink);
	line-height: 1.4;
}

.im-td-name a:hover { color: var(--e-red); }
.im-td-name dl.variation,
.im-td-name .variation {
	margin-top: 6px;
	font-size: var(--e-fs-2xs);
	color: var(--e-muted);
	line-height: 1.55;
}

.im-td-price,
.im-td-total { white-space: nowrap; font-variant-numeric: tabular-nums; }
.im-td-total { font-weight: var(--e-w-medium); color: var(--e-ink); }
.im-th-price, .im-th-total, .im-td-price, .im-td-total { text-align: right; }
.im-th-qty, .im-td-qty, .im-th-remove, .im-td-remove { text-align: center; }

/* Quantity control: the module emits <label class="minus/plus"> siblings. */
.im_custom_table .quantity {
	display: inline-flex;
	align-items: stretch;
	border: 1px solid var(--e-line-2);
	background: var(--e-surface);
	height: 48px;
}

.im_custom_table .quantity label.minus,
.im_custom_table .quantity label.plus {
	width: 40px;
	display: grid;
	place-items: center;
	cursor: pointer;
	color: var(--e-ink-2);
	position: relative;
	user-select: none;
}

.im_custom_table .quantity label.minus::before { content: "−"; font-size: 18px; }
.im_custom_table .quantity label.plus::before { content: "+"; font-size: 18px; }
.im_custom_table .quantity label.minus:hover,
.im_custom_table .quantity label.plus:hover { background: var(--e-surface-2); color: var(--e-ink); }

.im_custom_table .quantity input.qty {
	width: 52px;
	min-height: 0;
	height: auto;
	border: 0;
	border-inline: 1px solid var(--e-line);
	text-align: center;
	padding: 0;
	font-size: var(--e-fs-sm);
	font-weight: var(--e-w-medium);
	-moz-appearance: textfield;
}

.im_custom_table .quantity input::-webkit-outer-spin-button,
.im_custom_table .quantity input::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
.im_custom_table .quantity input:focus { box-shadow: none; }

.im-remove-btn.remove {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 44px; height: 44px;
	border-radius: 50%;
	color: var(--e-muted);
	font-size: 20px;
	line-height: 1;
	border: 1px solid transparent;
	transition: color var(--e-dur-1) var(--e-ease), border-color var(--e-dur-1) var(--e-ease);
}

.im-remove-btn.remove:hover { color: var(--e-red); border-color: var(--e-red-line); }

/* Coupon + update row */
.im-actions-row { padding-top: var(--e-s6) !important; border-bottom: 0 !important; }

.im-coupon-wrapper {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: var(--e-s4);
	flex-wrap: wrap;
}

.im-coupon-inner { display: flex; gap: var(--e-s2); flex: 1 1 320px; }

.im-input-text {
	flex: 1 1 auto;
	min-height: 52px;
	padding: 13px 16px;
	border: 1px solid var(--e-line-2);
	background: var(--e-surface);
	font-size: 16px;
}

.im-button-dark,
.im-button-light,
.im-empty-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 52px;
	padding: 14px 26px;
	font-size: var(--e-fs-sm);
	font-weight: var(--e-w-medium);
	letter-spacing: var(--e-ls-caps-s);
	text-transform: uppercase;
	border: 1px solid var(--e-ink);
	background: var(--e-ink);
	color: #fff;
	cursor: pointer;
	white-space: nowrap;
	transition: background var(--e-dur-2) var(--e-ease), border-color var(--e-dur-2) var(--e-ease), color var(--e-dur-2) var(--e-ease);
}

.im-button-dark:hover,
.im-empty-btn:hover { background: var(--e-red); border-color: var(--e-red); }

.im-button-light {
	background: transparent;
	color: var(--e-ink);
	border-color: var(--e-line-2);
}

.im-button-light:hover { border-color: var(--e-ink); background: var(--e-ink); color: #fff; }

@media (max-width: 767px) {
	/* Stack the table into cards: six columns do not fit a phone. */
	.im_custom_table thead { display: none; }
	.im_custom_table,
	.im_custom_table tbody,
	.im_custom_table tr,
	.im_custom_table td { display: block; width: 100%; }

	.im-cart-item {
		position: relative;
		display: grid !important;
		grid-template-columns: 92px minmax(0, 1fr);
		grid-template-areas:
			"img name"
			"img price"
			"img qty";
		gap: 4px var(--e-s4);
		padding: var(--e-s5) 0;
		border-bottom: 1px solid var(--e-line);
	}

	.im-cart-item td { padding: 0; border: 0; }
	.im-td-img { grid-area: img; width: auto; }
	.im-td-img img { width: 92px; height: 115px; }
	.im-td-name { grid-area: name; }
	.im-td-price { grid-area: price; text-align: left; color: var(--e-muted); }
	.im-td-qty { grid-area: qty; text-align: left; margin-top: 6px; }
	.im-td-total { display: none !important; }
	.im-td-remove {
		position: absolute;
		top: var(--e-s5); right: 0;
		width: 44px;
	}
	.im-actions-row { padding-top: var(--e-s5) !important; }
	.im-coupon-wrapper { flex-direction: column; align-items: stretch; }
	.im-button-light { width: 100%; }
}

/* --------------------------------------------------------------------------
   Cart summary / totals
   -------------------------------------------------------------------------- */
.im-cart-products-summary,
.im-cart-right h2,
.im-cart-right h3 {
	font-family: var(--e-font-display);
	font-size: var(--e-fs-xl);
	font-weight: var(--e-w-display);
	margin-bottom: var(--e-s5);
}

.im-cart-right table { width: 100%; font-size: var(--e-fs-sm); }

.im-cart-right table th,
.im-cart-right table td {
	padding: 13px 0;
	border-bottom: 1px solid var(--e-line);
	text-align: left;
	font-weight: var(--e-w-normal);
	color: var(--e-muted);
}

.im-cart-right table td { text-align: right; color: var(--e-ink); font-weight: var(--e-w-medium); }

.im-cart-right .order-total th,
.im-cart-right .order-total td {
	border-bottom: 0;
	border-top: 1px solid var(--e-ink);
	padding-top: var(--e-s5);
	font-size: var(--e-fs-md);
	color: var(--e-ink);
}

.im-cart-right .order-total td { font-size: var(--e-fs-lg); }

.wc-proceed-to-checkout { margin-top: var(--e-s6); }

.wc-proceed-to-checkout .checkout-button,
.im-checkout-btn {
	display: flex !important;
	align-items: center;
	justify-content: center;
	width: 100%;
	min-height: 60px;
	padding: 17px 28px;
	background: var(--e-red);
	border: 1px solid var(--e-red);
	color: #fff;
	font-size: var(--e-fs-sm);
	font-weight: var(--e-w-medium);
	letter-spacing: var(--e-ls-caps-s);
	text-transform: uppercase;
}

.wc-proceed-to-checkout .checkout-button:hover,
.im-checkout-btn:hover { background: var(--e-red-hover); border-color: var(--e-red-hover); }

.e-cart-promises {
	display: grid;
	gap: 12px;
	margin-top: var(--e-s6);
	padding-top: var(--e-s6);
	border-top: 1px solid var(--e-line);
}

.e-cart-promises li {
	display: flex;
	align-items: flex-start;
	gap: 11px;
	font-size: var(--e-fs-sm);
	color: var(--e-muted);
	line-height: 1.5;
}

.e-cart-promises svg { flex: none; color: var(--e-muted-2); margin-top: 2px; }
.e-cart-promises strong { display: block; color: var(--e-ink); font-weight: var(--e-w-medium); }

/* --------------------------------------------------------------------------
   Cart summary internals (im-totals-wrapper / im-summary-*)
   -------------------------------------------------------------------------- */
.im-totals-wrapper { display: grid; gap: 0; }

.im-summary-product-row {
	display: flex;
	align-items: baseline;
	justify-content: space-between;
	gap: var(--e-s4);
	padding: 10px 0;
	border-bottom: 1px solid var(--e-line);
	font-size: var(--e-fs-sm);
}

.im-summary-product-name { color: var(--e-ink-2); min-width: 0; overflow-wrap: anywhere; }
.im-summary-product-price { flex: none; color: var(--e-ink); font-weight: var(--e-w-medium); font-variant-numeric: tabular-nums; }

.im-product-variations { margin-top: 6px; display: grid; gap: 2px; }

.im-variation-row {
	display: flex;
	gap: 6px;
	font-size: var(--e-fs-2xs);
	line-height: 1.5;
	color: var(--e-muted);
}

.im-var-label { flex: none; }
.im-var-value { color: var(--e-ink-2); overflow-wrap: anywhere; }

/* --------------------------------------------------------------------------
   "Sizin için seçtiklerimiz" carousel (im-firsat-*)
   The module ships the markup and the arrow behaviour but no styling, so on
   mobile it collapsed into a fifteen-item vertical list 16,000px long. It is
   a horizontal rail here, swipeable whether or not the module's JS runs.
   -------------------------------------------------------------------------- */
.im-firsat-container {
	margin-top: var(--e-s9);
	padding-top: var(--e-s7);
	border-top: 1px solid var(--e-line);
	position: relative;
}

.im-firsat-title {
	font-family: var(--e-font-display);
	font-size: var(--e-d4);
	font-weight: var(--e-w-display);
	letter-spacing: var(--e-ls-display);
	margin-bottom: var(--e-s5);
}

.im-slider-wrapper {
	overflow-x: auto;
	overscroll-behavior-x: contain;
	scroll-snap-type: x mandatory;
	scrollbar-width: none;
	margin-inline: calc(var(--e-gutter) * -1);
	padding-inline: var(--e-gutter);
}

.im-slider-wrapper::-webkit-scrollbar { display: none; }

.im-slider-track {
	display: flex;
	gap: var(--e-s4);
	align-items: stretch;
}

.im-slide-item {
	flex: 0 0 168px;
	scroll-snap-align: start;
	display: flex;
	flex-direction: column;
	min-width: 0;
}

.im-slide-item img {
	width: 100%;
	aspect-ratio: 4 / 5;
	object-fit: cover;
	background: var(--e-surface-2);
	margin-bottom: 10px;
}

.im-slide-title {
	font-size: var(--e-fs-sm);
	line-height: 1.4;
	color: var(--e-ink);
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
}

.im-slide-price {
	margin-top: 4px;
	font-size: var(--e-fs-sm);
	font-weight: var(--e-w-medium);
	color: var(--e-ink);
	font-variant-numeric: tabular-nums;
}

.im-slide-add-btn {
	margin-top: auto;
	padding-top: 10px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 40px;
	font-size: var(--e-fs-xs);
	font-weight: var(--e-w-medium);
	letter-spacing: var(--e-ls-caps-s);
	text-transform: uppercase;
	color: var(--e-ink);
	border-bottom: 1px solid var(--e-line-2);
	cursor: pointer;
	background: none;
}

.im-slide-add-btn:hover { color: var(--e-red); border-bottom-color: var(--e-red); }

.im-nav-btn {
	position: absolute;
	top: 0; right: 0;
	width: 40px; height: 40px;
	display: grid;
	place-items: center;
	border: 1px solid var(--e-line-2);
	background: var(--e-surface);
	color: var(--e-ink-2);
	cursor: pointer;
	border-radius: 50%;
}

.im-nav-btn.prev { right: 48px; }
.im-nav-btn:hover { border-color: var(--e-ink); color: var(--e-ink); }

@media (max-width: 767px) {
	/* Arrows are redundant next to a swipeable rail and they collided with
	   the section title at this width. */
	.im-nav-btn { display: none; }
	.im-slide-item { flex-basis: 46vw; }
}

/* Trust badges rendered by the cart module */
.im-trust-badges {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
	gap: var(--e-s5);
	margin-top: var(--e-s8);
	padding-top: var(--e-s7);
	border-top: 1px solid var(--e-line);
}

@media (max-width: 560px) {
	.im-trust-badges { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--e-s4); }
	.im-badge-item { font-size: var(--e-fs-xs); }
}

.im-badge-item {
	display: flex;
	align-items: flex-start;
	gap: 11px;
	font-size: var(--e-fs-sm);
	color: var(--e-muted);
	line-height: 1.5;
}

.im-badge-icon { flex: none; width: 22px; height: 22px; color: var(--e-red); }
.im-badge-icon svg { width: 100%; height: 100%; }
.im-badge-item strong { display: block; color: var(--e-ink); font-weight: var(--e-w-medium); }

/* Empty cart rendered by the module */
.im-empty-cart { text-align: center; padding-block: var(--e-sect-md); }
.im-empty-icon { width: 56px; height: 56px; margin: 0 auto var(--e-s6); color: var(--e-line-2); }
.im-empty-icon svg { width: 100%; height: 100%; }

/* --------------------------------------------------------------------------
   Loyalty points box (inc/modules/commerce/loyalty.php)
   -------------------------------------------------------------------------- */
.erpin-points-container,
.erpin-cart-points-section {
	border: 1px solid var(--e-line);
	background: var(--e-surface);
	padding: var(--e-s5);
	margin-top: var(--e-s5);
}

.erpin-points-compact {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: var(--e-s4);
	flex-wrap: wrap;
}

.erpin-points-compact__left { display: flex; align-items: center; gap: 10px; min-width: 0; }

.erpin-points-compact__dot {
	width: 8px; height: 8px;
	border-radius: 50%;
	background: var(--e-red);
	flex: none;
}

.erpin-points-compact__title {
	font-size: var(--e-fs-sm);
	font-weight: var(--e-w-medium);
	color: var(--e-ink);
}

.erpin-points-compact__meta,
.erpin-compact-note { font-size: var(--e-fs-sm); color: var(--e-muted); }
.erpin-points-compact__sep { color: var(--e-line-2); margin-inline: 6px; }

.erpin-apply-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 44px;
	padding: 11px 20px;
	background: var(--e-ink);
	border: 1px solid var(--e-ink);
	color: #fff;
	font-size: var(--e-fs-xs);
	font-weight: var(--e-w-medium);
	letter-spacing: var(--e-ls-caps-s);
	text-transform: uppercase;
	cursor: pointer;
}

.erpin-apply-btn:hover { background: var(--e-red); border-color: var(--e-red); }

.erpin-remove-btn--compact {
	background: transparent;
	color: var(--e-red);
	border-color: var(--e-red-line);
}

.erpin-remove-btn--compact:hover { background: var(--e-red-tint); border-color: var(--e-red); color: var(--e-red); }

.erpin-points-help-btn {
	background: none;
	border: 0;
	color: var(--e-muted);
	font-size: var(--e-fs-sm);
	text-decoration: underline;
	text-underline-offset: 3px;
	cursor: pointer;
	min-height: 44px;
}

.erpin-points-help-btn:hover { color: var(--e-red); }

.erpin-popup-h { font-family: var(--e-font-display); font-size: var(--e-fs-xl); font-weight: var(--e-w-display); letter-spacing: var(--e-ls-display); }
.erpin-popup-p, .erpin-popup-note { font-size: var(--e-fs-sm); color: var(--e-ink-2); line-height: 1.65; }
.erpin-popup-list { display: grid; gap: 8px; font-size: var(--e-fs-sm); color: var(--e-ink-2); }
.erpin-popup-section + .erpin-popup-section { margin-top: var(--e-s5); }

.erpin-popup-ok {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 52px;
	padding: 14px 26px;
	background: var(--e-ink);
	border: 1px solid var(--e-ink);
	color: #fff;
	font-size: var(--e-fs-sm);
	font-weight: var(--e-w-medium);
	letter-spacing: var(--e-ls-caps-s);
	text-transform: uppercase;
	cursor: pointer;
}

/* --------------------------------------------------------------------------
   Touch targets inside vendor / gateway markup.

   The Tami card widget, the WooCommerce login form and the payment-method
   radios all ship 13–19px controls. They are third-party markup, so the size
   is corrected here rather than by editing the gateway.
   -------------------------------------------------------------------------- */
.woocommerce input[type="radio"],
.woocommerce input[type="checkbox"],
input.input-radio,
.imd-payment-radio,
.woocommerce-form__input-checkbox {
	width: 20px;
	height: 20px;
	min-height: 20px;
	flex: none;
	accent-color: var(--e-red);
	cursor: pointer;
}

/* Give the label the tap row rather than the 20px control itself. */
.woocommerce-form__label-for-checkbox,
.imd-checkbox-label,
.imd-payment-label,
label.woocommerce-form-login__rememberme {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	min-height: 44px;
	cursor: pointer;
	line-height: 1.4;
}

.tami-card-input__eye,
button.tami-card-input__eye,
.imd-checkout-form button.tami-card-input__eye {
	min-width: 40px !important;
	min-height: 40px !important;
	width: 40px !important;
	height: 40px !important;
	display: inline-grid !important;
	place-items: center;
	padding: 0 !important;
}

/* Vendor account forms render a 28px text input; align it with the system. */
.woocommerce-account input.input-text,
.woocommerce form input.input-text,
.woocommerce form input[type="text"],
.woocommerce form input[type="email"],
.woocommerce form input[type="tel"],
.woocommerce form input[type="password"] {
	min-height: 52px;
}

/* --------------------------------------------------------------------------
   Shared WooCommerce form surfaces

   The checkout itself is owned by 14-checkout.css. Only rules that also serve
   the account, login and coupon forms live here — an earlier version styled
   `#payment`, `#order_review_heading` and `#customer_details` from this layer,
   and those ID selectors outranked the checkout layer no matter what it did.
   -------------------------------------------------------------------------- */
.woocommerce-checkout .e-page { padding-block: var(--e-s7) var(--e-sect-md); }

.woocommerce form .form-row {
	display: block;
	margin-bottom: var(--e-s5);
	padding: 0;
}

.woocommerce form .form-row label {
	display: block;
	margin-bottom: 8px;
	font-size: var(--e-fs-sm);
	font-weight: var(--e-w-medium);
	color: var(--e-ink);
}

.woocommerce form .form-row .required { color: var(--e-red); border: 0; text-decoration: none; }

.woocommerce form .form-row-first,
.woocommerce form .form-row-last {
	width: calc(50% - var(--e-s2));
	display: inline-block;
	vertical-align: top;
}

.woocommerce form .form-row-first { margin-right: var(--e-s3); }

@media (max-width: 560px) {
	.woocommerce form .form-row-first,
	.woocommerce form .form-row-last { width: 100%; margin-right: 0; }
}

/* --------------------------------------------------------------------------
   My account
   -------------------------------------------------------------------------- */
/* Signed in only — signed out the page is the login/register pair, styled in
   15-account.css, and this grid would squeeze it into the sidebar column. */
.woocommerce-account:not(.erpin-auth) .woocommerce {
	display: grid;
	grid-template-columns: 260px minmax(0, 1fr);
	gap: clamp(32px, 4vw, 72px);
	align-items: start;
}

.woocommerce-account .woocommerce-MyAccount-navigation { min-width: 0; }

.e-account__ident { padding-bottom: var(--e-s5); border-bottom: 1px solid var(--e-line); margin-bottom: var(--e-s4); }
.e-account__name { font-size: var(--e-fs-md); font-weight: var(--e-w-medium); margin-top: var(--e-s2); }
.e-account__mail { font-size: var(--e-fs-sm); color: var(--e-muted); }

.woocommerce-MyAccount-navigation ul { display: grid; gap: 2px; }

.woocommerce-MyAccount-navigation li a {
	display: flex;
	align-items: center;
	min-height: 48px;
	padding: 10px 12px;
	font-size: var(--e-fs-sm);
	color: var(--e-ink-2);
	border-left: 2px solid transparent;
}

.woocommerce-MyAccount-navigation li a:hover { color: var(--e-ink); background: var(--e-surface-2); }

.woocommerce-MyAccount-navigation li.is-active a {
	color: var(--e-ink);
	font-weight: var(--e-w-medium);
	border-left-color: var(--e-red);
	background: var(--e-surface-2);
}

.woocommerce-MyAccount-content { min-width: 0; }

.woocommerce-account table.shop_table {
	width: 100%;
	font-size: var(--e-fs-sm);
	border-collapse: collapse;
	border: 1px solid var(--e-line);
}

.woocommerce-account table.shop_table th,
.woocommerce-account table.shop_table td {
	padding: var(--e-s4);
	border-bottom: 1px solid var(--e-line);
	text-align: left;
}

.woocommerce-account table.shop_table th {
	background: var(--e-surface-2);
	font-size: var(--e-fs-xs);
	letter-spacing: var(--e-ls-caps-s);
	text-transform: uppercase;
	color: var(--e-muted);
	font-weight: var(--e-w-medium);
}

/* Dashboard buttons only; the auth forms use .e-btn variants. */
.woocommerce-account:not(.erpin-auth) .button,
.woocommerce-account:not(.erpin-auth) .woocommerce-Button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 44px;
	padding: 11px 20px;
	background: var(--e-ink);
	border: 1px solid var(--e-ink);
	color: #fff;
	font-size: var(--e-fs-xs);
	font-weight: var(--e-w-medium);
	letter-spacing: var(--e-ls-caps-s);
	text-transform: uppercase;
}

.woocommerce-account:not(.erpin-auth) .button:hover { background: var(--e-red); border-color: var(--e-red); }

@media (max-width: 900px) {
	/* Must match the specificity of the two-column rule above, or the sidebar
	   column survives here and squeezes the content to a few dozen pixels. */
	.woocommerce-account:not(.erpin-auth) .woocommerce { grid-template-columns: minmax(0, 1fr); }
	.woocommerce-MyAccount-navigation ul {
		display: flex;
		overflow-x: auto;
		gap: var(--e-s2);
		scrollbar-width: none;
		border-bottom: 1px solid var(--e-line);
	}
	.woocommerce-MyAccount-navigation ul::-webkit-scrollbar { display: none; }
	.woocommerce-MyAccount-navigation li a {
		white-space: nowrap;
		border-left: 0;
		border-bottom: 2px solid transparent;
		background: transparent !important;
	}
	.woocommerce-MyAccount-navigation li.is-active a { border-bottom-color: var(--e-red); }
	.woocommerce-account table.shop_table thead { display: none; }
	.woocommerce-account table.shop_table tr { display: block; border-bottom: 1px solid var(--e-line); padding: var(--e-s4) 0; }
	.woocommerce-account table.shop_table td { display: flex; justify-content: space-between; gap: var(--e-s4); border: 0; padding: 6px var(--e-s4); }
	.woocommerce-account table.shop_table td::before { content: attr(data-title); color: var(--e-muted); font-size: var(--e-fs-xs); }
}

/* --------------------------------------------------------------------------
   Login / register

   The account page's signed-out state is styled in 15-account.css. What is
   left here is the lost-password form, which WooCommerce renders with the same
   `form.login` class but outside the login/register pair.
   -------------------------------------------------------------------------- */
.woocommerce form.lost_reset_password {
	border: 1px solid var(--e-line);
	background: var(--e-surface);
	padding: var(--e-s7);
	margin: 0 auto;
	max-width: 520px;
	border-radius: 0;
}

.woocommerce form.lost_reset_password .button { width: 100%; min-height: 52px; }

/* Auxiliary account links need a real tap row — they are inline anchors. */
.woocommerce-LostPassword a,
.woocommerce-LostPassword,
.woocommerce-privacy-policy-link {
	display: inline-flex;
	align-items: center;
	min-height: 44px;
}

/* Set catalog filter chips (inc/modules/sets/*). */
.imds-filter,
button.imds-filter {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 44px;
	padding: 0 18px;
	border: 1px solid var(--e-line-2);
	border-radius: var(--e-r-pill);
	background: var(--e-surface);
	font-size: var(--e-fs-sm);
	color: var(--e-ink-2);
	cursor: pointer;
}

.imds-filter:hover,
.imds-filter.is-active,
.imds-filter.active {
	border-color: var(--e-ink);
	background: var(--e-ink);
	color: #fff;
}

/* --------------------------------------------------------------------------
   Order received
   -------------------------------------------------------------------------- */
.e-thanks {
	text-align: center;
	max-width: 56ch;
	margin: 0 auto var(--e-s9);
	padding-bottom: var(--e-s8);
	border-bottom: 1px solid var(--e-line);
}

.e-thanks__mark { margin: 0 auto var(--e-s5); color: var(--e-success); }

.e-thanks__title {
	font-family: var(--e-font-display);
	font-size: var(--e-d3);
	font-weight: var(--e-w-display);
	margin-top: var(--e-s3);
}

.e-thanks__text { margin-top: var(--e-s4); color: var(--e-ink-2); }

.woocommerce-order .woocommerce-order-overview {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
	gap: 1px;
	background: var(--e-line);
	border: 1px solid var(--e-line);
	margin: 0 0 var(--e-s8);
	padding: 0;
	list-style: none;
}

.woocommerce-order .woocommerce-order-overview li {
	background: var(--e-surface);
	padding: var(--e-s5);
	font-size: var(--e-fs-xs);
	letter-spacing: var(--e-ls-caps-s);
	text-transform: uppercase;
	color: var(--e-muted);
	border: 0;
}

.woocommerce-order .woocommerce-order-overview li strong {
	display: block;
	margin-top: 6px;
	font-size: var(--e-fs-md);
	font-weight: var(--e-w-medium);
	color: var(--e-ink);
	letter-spacing: 0;
	text-transform: none;
}

/* --------------------------------------------------------------------------
   Set mark on a cart line

   Products bought as a set arrive in the cart as separate lines with a group
   discount applied as a fee. Without this the shopper sees unrelated products
   and an unexplained deduction. Printed by erpin_cart_set_mark() on the cart
   page and the checkout summary, and by the sets module's
   woocommerce_cart_item_name filter in the mini cart.
   -------------------------------------------------------------------------- */
.e-cart__setmark {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	margin-top: 6px;
	padding: 4px 10px 4px 8px;
	background: var(--e-surface-2);
	border: 1px solid var(--e-line);
	color: var(--e-ink);
	font-size: var(--e-fs-xs);
	line-height: 1.3;
}

.e-cart__setmark .e-icon { flex: none; color: var(--e-red); }

.e-cart__setmark-text {
	display: inline-flex;
	align-items: baseline;
	gap: 6px;
	min-width: 0;
	flex-wrap: wrap;
}

.e-cart__setmark strong {
	font-weight: var(--e-w-medium);
	letter-spacing: var(--e-ls-caps-s);
	text-transform: uppercase;
}

.e-cart__setmark-count { color: var(--e-muted); }

.e-cart__setmark--compact {
	margin-top: 4px;
	padding: 3px 8px;
	font-size: 11px;
}

/* Layer: 11-content.css */
/* ==========================================================================
   ERPIN DESIGN SYSTEM — 11 CONTENT
   Blog, article, static pages, search results, 404, cookie bar, WhatsApp.
   ========================================================================== */

/* --------------------------------------------------------------------------
   Blog index
   -------------------------------------------------------------------------- */
.e-blog__grid { row-gap: var(--e-s11); }
.e-blog__pager { margin-top: var(--e-sect-sm); }

/* Homepage journal is an editorial preview, not a second blog index. */
.e-home-journal .e-postcard__title { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 3; overflow: hidden; }
.e-home-journal .e-postcard__title a { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 3; overflow: hidden; padding-block: 0; margin-block: 0; }
.e-home-journal .e-postcard__excerpt { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 3; overflow: hidden; }
.e-home-journal .e-postcard__body { flex: 1; display: flex; flex-direction: column; }
.e-home-journal .e-postcard__meta { margin-top: auto; padding-top: 16px; }
@media (max-width: 767px) {
	.e-home-journal .e-sect-head { margin-bottom: 24px; }
	.e-home-journal .e-grid { grid-template-columns: minmax(0, 1fr); gap: 0; }
	.e-home-journal .e-postcard { display: grid; grid-template-columns: clamp(96px, 26vw, 144px) minmax(0, 1fr); gap: 20px; padding-block: 22px; border-top: 1px solid var(--e-line); }
	.e-home-journal .e-postcard__media { aspect-ratio: 1 / 1; align-self: start; overflow: hidden; }
	.e-home-journal .e-postcard__media .e-frame { width: 100%; height: 100%; aspect-ratio: 1 / 1; }
	.e-home-journal .e-postcard__media img { display: block; width: 100%; height: 100%; aspect-ratio: 1; object-fit: cover; }
	.e-home-journal .e-postcard__body { padding: 0; min-width: 0; }
	.e-home-journal .e-postcard__title { margin: 0; font-size: clamp(19px, 3.5vw, 24px); line-height: 1.3; letter-spacing: -.02em; }
	.e-home-journal .e-postcard__excerpt { display: none; }
	.e-home-journal .e-postcard__meta { margin-block: 12px 0; padding: 0; font-size: 10px; line-height: 1.4; letter-spacing: .08em; }
	.e-home-journal__more { display: inline-flex; min-height: 44px; margin-top: 8px; }
}

@media (max-width: 767px) {
	.e-blog__grid { row-gap: var(--e-s9); }
}

@media (max-width: 560px) {
	/* Two 159px columns made long Turkish article titles unreadable. */
	.e-blog__grid { grid-template-columns: minmax(0, 1fr) !important; }
}

/* --------------------------------------------------------------------------
   Article
   -------------------------------------------------------------------------- */
.e-article__hero {
	margin: 0 0 var(--e-s9);
	max-width: calc(var(--e-max-rd) + var(--e-gutter) * 2);
	margin-inline: auto;
	padding-inline: var(--e-gutter);
}

.e-article__hero img {
	width: 100%;
	aspect-ratio: 16 / 9;
	object-fit: cover;
	background: var(--e-surface-2);
}

.e-article__meta {
	display: flex;
	align-items: center;
	gap: 10px;
	font-size: var(--e-fs-xs);
	letter-spacing: var(--e-ls-caps-s);
	text-transform: uppercase;
	color: var(--e-muted);
	margin-bottom: var(--e-s6);
	padding-bottom: var(--e-s5);
	border-bottom: 1px solid var(--e-line);
}

.e-article__meta a { color: var(--e-red); }

.e-article__body { padding-bottom: var(--e-sect-sm); }

.e-article__tags {
	display: flex;
	flex-wrap: wrap;
	gap: var(--e-s2);
	margin-top: var(--e-s8);
	padding-top: var(--e-s6);
	border-top: 1px solid var(--e-line);
}

.e-article__tags a {
	display: inline-flex;
	align-items: center;
	min-height: 38px;
	padding: 0 14px;
	border: 1px solid var(--e-line-2);
	border-radius: var(--e-r-pill);
	font-size: var(--e-fs-sm);
	color: var(--e-muted);
}

.e-article__tags a:hover { border-color: var(--e-ink); color: var(--e-ink); }

.e-article__nav {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 1px;
	background: var(--e-line);
	border-block: 1px solid var(--e-line);
	margin-bottom: var(--e-sect-sm);
}

.e-article__navlink {
	background: var(--e-paper);
	padding: var(--e-s7) var(--e-s6);
	display: block;
}

.e-article__navlink--next { text-align: right; }

.e-article__navlink strong {
	display: block;
	margin-top: var(--e-s3);
	font-family: var(--e-font-display);
	font-size: var(--e-fs-lg);
	font-weight: var(--e-w-display);
	line-height: 1.25;
}

.e-article__navlink:hover strong { color: var(--e-red); }

@media (max-width: 640px) {
	.e-article__nav { grid-template-columns: 1fr; }
	.e-article__navlink--next { text-align: left; }
}

.e-article__comments { padding-block: var(--e-sect-sm); }

/* --------------------------------------------------------------------------
   Static pages
   -------------------------------------------------------------------------- */
.e-page.e-section { padding-block: var(--e-sect-md); }

/* --------------------------------------------------------------------------
   Search results
   -------------------------------------------------------------------------- */
.e-results + .e-results { margin-top: var(--e-sect-md); padding-top: var(--e-s9); border-top: 1px solid var(--e-line); }

.e-results__title {
	display: flex;
	align-items: baseline;
	justify-content: space-between;
	gap: var(--e-s4);
	margin-bottom: var(--e-s7);
	padding-bottom: var(--e-s4);
	border-bottom: 1px solid var(--e-line);
}

.e-results__count { font-size: var(--e-fs-sm); color: var(--e-muted); }

.e-empty__search,
.e-404__search {
	display: flex;
	gap: var(--e-s2);
	max-width: 460px;
	margin: var(--e-s7) auto 0;
}

.e-404__search { margin-inline: 0; }
.e-empty__search input,
.e-404__search input { flex: 1 1 auto; }

/* --------------------------------------------------------------------------
   404
   -------------------------------------------------------------------------- */
.e-404__title { margin-top: var(--e-s4); }
.e-404__text { margin-top: var(--e-s5); max-width: 52ch; }

.e-404__routes {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
	gap: 1px;
	background: var(--e-line);
	border: 1px solid var(--e-line);
	margin-top: var(--e-s9);
}

.e-404__routes a {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: var(--e-s4);
	min-height: 68px;
	padding: var(--e-s5);
	background: var(--e-surface);
	font-size: var(--e-fs-base);
	color: var(--e-ink);
}

.e-404__routes a:hover { color: var(--e-red); background: var(--e-surface-2); }
.e-404__routes svg { color: var(--e-muted-2); }
.e-404__routes a:hover svg { color: var(--e-red); }

/* --------------------------------------------------------------------------
   Comments
   -------------------------------------------------------------------------- */
.comment-respond { margin-top: var(--e-s9); }

.comment-reply-title {
	font-family: var(--e-font-display);
	font-size: var(--e-fs-xl);
	font-weight: var(--e-w-display);
	margin-bottom: var(--e-s5);
}

.comment-list { display: grid; gap: var(--e-s6); margin-bottom: var(--e-s9); }
.comment-list .comment-body { border-left: 2px solid var(--e-line); padding-left: var(--e-s5); }
.comment-list .comment-meta { font-size: var(--e-fs-sm); color: var(--e-muted); margin-bottom: var(--e-s3); }
.comment-form { display: grid; gap: var(--e-s4); }
.comment-form .submit { justify-self: start; }

.comment-form input[type="submit"],
input[type="submit"].submit {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 52px;
	padding: 14px 30px;
	background: var(--e-ink);
	border: 1px solid var(--e-ink);
	color: #fff;
	font-size: var(--e-fs-sm);
	font-weight: var(--e-w-medium);
	letter-spacing: var(--e-ls-caps-s);
	text-transform: uppercase;
	cursor: pointer;
	width: auto;
}

.comment-form input[type="submit"]:hover { background: var(--e-red); border-color: var(--e-red); }

/* --------------------------------------------------------------------------
   Widgets inside drawers / sidebars
   -------------------------------------------------------------------------- */
.widget select,
.widget input[type="text"],
.widget input[type="search"] { width: 100%; }

/* --------------------------------------------------------------------------
   Cookie notice (vendor class-cookie-notice.php)
   -------------------------------------------------------------------------- */
.pls-cookie-notice,
#pls-cookie-notice {
	position: fixed;
	left: var(--e-gutter);
	right: var(--e-gutter);
	bottom: var(--e-gutter);
	z-index: var(--e-z-toast);
	max-width: 520px;
	background: var(--e-surface);
	border: 1px solid var(--e-line-2);
	box-shadow: var(--e-shadow-3);
	padding: var(--e-s6);
	font-size: var(--e-fs-sm);
	line-height: 1.6;
	color: var(--e-ink-2);
}

.pls-cookie-notice a { color: var(--e-ink); border-bottom: 1px solid var(--e-red); }

.pls-cookie-notice .pls-cookie-buttons,
.pls-cookie-notice .cookie-buttons {
	display: flex;
	gap: var(--e-s2);
	margin-top: var(--e-s5);
	flex-wrap: wrap;
}

.pls-cookie-notice .pls-cookie-accept,
.pls-cookie-notice .cookie-accept {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 46px;
	padding: 12px 22px;
	background: var(--e-ink);
	border: 1px solid var(--e-ink);
	color: #fff;
	font-size: var(--e-fs-xs);
	font-weight: var(--e-w-medium);
	letter-spacing: var(--e-ls-caps-s);
	text-transform: uppercase;
}

@media (max-width: 560px) {
	.pls-cookie-notice { left: 0; right: 0; bottom: 0; max-width: none; border-inline: 0; border-bottom: 0; }
}

/* --------------------------------------------------------------------------
   Support launcher (replaces the WhatsApp plugin bubble)
   -------------------------------------------------------------------------- */
/* Belt and braces: if the plugin is ever re-enqueued, keep its bubble out. */
.njt-wa-widget, .njt-whatsapp-widget, #njt-wa-widget,
.nta-woo-floating-button, #nta-whatsapp-button { display: none !important; }

.e-support {
	position: fixed;
	right: var(--e-gutter);
	bottom: max(var(--e-gutter), env(safe-area-inset-bottom));
	z-index: var(--e-z-sticky);
	display: flex;
	flex-direction: column;
	align-items: flex-end;
	gap: var(--e-s3);
	pointer-events: none;
}

.e-support > * { pointer-events: auto; }

.e-support__actions {
	display: flex;
	align-items: center;
	gap: var(--e-s2);
}

/* The primary action is a labelled pill, not an anonymous coloured circle. */
.e-support__wa {
	display: inline-flex;
	align-items: center;
	gap: 9px;
	min-height: 48px;
	padding: 0 20px;
	border-radius: var(--e-r-pill);
	background: var(--e-ink);
	color: #fff;
	font-size: var(--e-fs-sm);
	font-weight: var(--e-w-medium);
	letter-spacing: .01em;
	box-shadow: var(--e-shadow-2);
	transition: background var(--e-dur-2) var(--e-ease);
}

.e-support__wa:hover { background: var(--e-red); color: #fff; }

.e-support__toggle {
	display: grid;
	place-items: center;
	width: 48px; height: 48px;
	border-radius: 50%;
	background: var(--e-surface);
	border: 1px solid var(--e-line-2);
	color: var(--e-ink);
	box-shadow: var(--e-shadow-2);
	transition: border-color var(--e-dur-1) var(--e-ease), color var(--e-dur-1) var(--e-ease);
}

.e-support__toggle:hover { border-color: var(--e-ink); }
.e-support__shut { display: none; }
.e-support__toggle[aria-expanded="true"] .e-support__open { display: none; }
.e-support__toggle[aria-expanded="true"] .e-support__shut { display: block; }

.e-support__panel {
	width: min(320px, calc(100vw - var(--e-gutter) * 2));
	background: var(--e-surface);
	border: 1px solid var(--e-line);
	box-shadow: var(--e-shadow-3);
	opacity: 0;
	transform: translateY(8px);
	transition: opacity var(--e-dur-2) var(--e-ease), transform var(--e-dur-2) var(--e-ease);
}

.e-support__panel[hidden] { display: none; }
.e-support__panel.is-open { opacity: 1; transform: none; }

.e-support__head { padding: var(--e-s5) var(--e-s5) var(--e-s3); }
.e-support__title { font-size: var(--e-fs-base); font-weight: var(--e-w-medium); color: var(--e-ink); }
.e-support__hours { margin-top: 4px; font-size: var(--e-fs-sm); color: var(--e-muted); line-height: 1.5; }

.e-support__list { border-top: 1px solid var(--e-line); }
.e-support__list li + li { border-top: 1px solid var(--e-line); }

.e-support__list a {
	display: flex;
	align-items: center;
	gap: var(--e-s4);
	min-height: 60px;
	padding: 10px var(--e-s5);
	color: var(--e-ink);
	transition: background var(--e-dur-1) var(--e-ease);
}

.e-support__list a:hover { background: var(--e-surface-2); }

.e-support__ico {
	flex: none;
	display: grid;
	place-items: center;
	width: 36px; height: 36px;
	border-radius: 50%;
	background: var(--e-surface-2);
	color: var(--e-ink-2);
}

.e-support__text { flex: 1 1 auto; min-width: 0; }
.e-support__text strong { display: block; font-size: var(--e-fs-sm); font-weight: var(--e-w-medium); }
.e-support__text small { display: block; font-size: var(--e-fs-sm); color: var(--e-muted); margin-top: 1px; }
.e-support__go { flex: none; color: var(--e-muted-2); }
.e-support__list a:hover .e-support__go { color: var(--e-red); }

@media (max-width: 767px) {
	.e-support { right: 14px; bottom: max(14px, env(safe-area-inset-bottom)); }
	/* The label is dropped on phones so the launcher never covers content. */
	.e-support__wa span { display: none; }
	.e-support__wa { width: 48px; padding: 0; justify-content: center; }
}

/* --------------------------------------------------------------------------
   Contact page
   -------------------------------------------------------------------------- */
.e-contact { padding-bottom: var(--e-sect-sm); }

.e-contact__grid {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 1px;
	background: var(--e-line);
	border: 1px solid var(--e-line);
}

.e-contact__panel { background: var(--e-surface); padding: clamp(24px, 3vw, 40px); }

.e-contact__h {
	font-family: var(--e-font-display);
	font-size: var(--e-d4);
	font-weight: var(--e-w-display);
	letter-spacing: var(--e-ls-display);
	margin-bottom: var(--e-s4);
}

.e-contact__lede { color: var(--e-ink-2); line-height: 1.7; max-width: 46ch; }

.e-contact__channels { margin-top: var(--e-s6); display: grid; gap: 2px; }

.e-contact__channels a {
	display: flex;
	align-items: center;
	gap: var(--e-s4);
	min-height: 60px;
	padding: 10px 0;
	color: var(--e-ink);
}

.e-contact__ico {
	flex: none;
	display: grid;
	place-items: center;
	width: 40px; height: 40px;
	border: 1px solid var(--e-line);
	border-radius: 50%;
	color: var(--e-ink-2);
}

.e-contact__channels small { display: block; font-size: 12px; letter-spacing: var(--e-ls-caps-s); text-transform: uppercase; color: var(--e-muted); }
.e-contact__channels strong { display: block; font-size: var(--e-fs-md); font-weight: var(--e-w-medium); font-variant-numeric: tabular-nums; margin-top: 2px; }
.e-contact__channels a:hover strong { color: var(--e-red); }
.e-contact__channels a:hover .e-contact__ico { border-color: var(--e-red); color: var(--e-red); }

.e-contact__address { color: var(--e-ink-2); line-height: 1.7; max-width: 40ch; }

.e-contact__hours { margin-top: var(--e-s6); display: grid; gap: 0; }

.e-contact__hours > div {
	display: flex;
	align-items: baseline;
	justify-content: space-between;
	gap: var(--e-s4);
	padding: 11px 0;
	border-bottom: 1px solid var(--e-line);
	font-size: var(--e-fs-sm);
}

.e-contact__hours dt { color: var(--e-muted); }
.e-contact__hours dd { margin: 0; color: var(--e-ink); font-weight: var(--e-w-medium); font-variant-numeric: tabular-nums; }

.e-contact__route { margin-top: var(--e-s6); }

.e-contact__map { margin-top: var(--e-s8); border: 1px solid var(--e-line); background: var(--e-surface-2); }
.e-contact__map iframe { display: block; width: 100%; height: clamp(260px, 34vw, 420px); border: 0; }

.e-contact__legal { margin-top: var(--e-sect-sm); }

.e-contact__facts {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
	gap: var(--e-s6);
	margin-top: var(--e-s5);
}

.e-contact__facts dt { font-size: 12px; letter-spacing: var(--e-ls-caps-s); text-transform: uppercase; color: var(--e-muted); margin-bottom: 5px; }
.e-contact__facts dd { margin: 0; font-size: var(--e-fs-sm); color: var(--e-ink); line-height: 1.6; }
.e-contact__facts a { border-bottom: 1px solid var(--e-red); }

@media (max-width: 767px) {
	.e-contact__grid { grid-template-columns: 1fr; }
}

/* --------------------------------------------------------------------------
   Sets landing page (sets/storefront.php shortcode)
   -------------------------------------------------------------------------- */
.erpin-sets,
.imset-catalog {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
	gap: var(--e-s8) var(--e-s6);
}

/* --------------------------------------------------------------------------
   Anything the vendor grid classes still touch. The Bootstrap grid was
   dropped with the vendor stylesheet; these keep stray markup readable.
   -------------------------------------------------------------------------- */
.row { display: block; }
[class^="col-"], [class*=" col-"] { width: auto; max-width: 100%; }

/* Layer: 12-sets.css */
/* ==========================================================================
   ERPIN DESIGN SYSTEM — 12 SETS

   Markup contract from inc/modules/sets/storefront.php (`imds-*`). The
   module's own 5 KB inline <style> was removed; without it all 28 sets
   stacked into one unreadable column, which is why the page looked like it
   held a single product.

   The layout is a card per set: the pieces that make up the set are shown
   side by side inside the card, then the bundle price under them.
   ========================================================================== */

.imds-wrap {
	width: 100%;
	max-width: calc(var(--e-max) + var(--e-gutter) * 2);
	margin-inline: auto;
	padding-inline: var(--e-gutter);
}

/* --------------------------------------------------------------------------
   Toolbar
   -------------------------------------------------------------------------- */
.imds-head {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: var(--e-s4);
	flex-wrap: wrap;
	padding-block: var(--e-s4);
	border-block: 1px solid var(--e-line);
	margin-bottom: var(--e-s8);
}

.imds-count { font-size: var(--e-fs-sm); color: var(--e-muted); }
.imds-count-num { color: var(--e-ink); font-weight: var(--e-w-medium); }

.imds-filters { display: flex; gap: var(--e-s2); flex-wrap: wrap; }

.imds-sort { display: flex; align-items: center; gap: var(--e-s3); }
.imds-sort-label { font-size: var(--e-fs-sm); color: var(--e-muted); white-space: nowrap; }

.imds-sort-select {
	min-height: 44px;
	min-width: 190px;
	padding: 0 40px 0 14px;
	border: 1px solid var(--e-line-2);
	background-color: var(--e-surface);
	font-size: var(--e-fs-sm);
}

@media (max-width: 767px) {
	.imds-head { gap: var(--e-s3); }
	.imds-filters { order: 1; width: 100%; overflow-x: auto; flex-wrap: nowrap; scrollbar-width: none; }
	.imds-filters::-webkit-scrollbar { display: none; }
	.imds-sort { order: 2; width: 100%; }
	.imds-sort-select { flex: 1 1 auto; min-width: 0; }
	.imds-count { order: 3; font-size: var(--e-fs-xs); }
}

/* --------------------------------------------------------------------------
   Grid
   -------------------------------------------------------------------------- */
.imds-grid {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: var(--e-s7) var(--e-s6);
}

@media (max-width: 767px) {
	.imds-grid { grid-template-columns: minmax(0, 1fr); gap: var(--e-s6); }
}

/* --------------------------------------------------------------------------
   Set card
   -------------------------------------------------------------------------- */
.imds-card {
	display: flex;
	flex-direction: column;
	border: 1px solid var(--e-line);
	background: var(--e-surface);
	min-width: 0;
	transition: border-color var(--e-dur-2) var(--e-ease);
}

.imds-card:hover { border-color: var(--e-line-2); }

.imds-title {
	padding: var(--e-s5) var(--e-s5) var(--e-s3);
	font-size: var(--e-fs-md);
	font-weight: var(--e-w-medium);
	line-height: 1.35;
	color: var(--e-ink);
}

/* The pieces. Two to four per set, so the columns follow the count class the
   module already emits. */
.imds-items {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 1px;
	background: var(--e-line);
	border-block: 1px solid var(--e-line);
}

.imds-items-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.imds-items-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }

.imds-item {
	display: flex;
	flex-direction: column;
	background: var(--e-surface);
	padding: var(--e-s3);
	min-width: 0;
	color: var(--e-ink-2);
}

.imds-item:hover { color: var(--e-red); }

.imds-thumb {
	display: block;
	position: relative;
	aspect-ratio: 4 / 5;
	overflow: hidden;
	background: var(--e-surface-2);
	margin-bottom: 8px;
}

.imds-thumb img { width: 100%; height: 100%; object-fit: cover; }

.imds-name {
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
	font-size: var(--e-fs-sm);
	line-height: 1.35;
}

.imds-price {
	margin-top: 4px;
	font-size: var(--e-fs-sm);
	color: var(--e-muted);
	font-variant-numeric: tabular-nums;
}

@media (max-width: 480px) {
	/* Four thumbnails at 90px each are unreadable on a phone. */
	.imds-items-3,
	.imds-items-4 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

/* --------------------------------------------------------------------------
   Footer: prices + action
   -------------------------------------------------------------------------- */
.imds-foot {
	margin-top: auto;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: var(--e-s4);
	flex-wrap: wrap;
	padding: var(--e-s5);
}

.imds-prices { min-width: 0; }

.imds-priceline {
	display: flex;
	align-items: baseline;
	gap: 10px;
	flex-wrap: wrap;
}

.imds-old {
	color: var(--e-muted-2);
	text-decoration: line-through;
	font-size: var(--e-fs-sm);
	font-variant-numeric: tabular-nums;
}

.imds-new {
	font-size: var(--e-fs-lg);
	font-weight: var(--e-w-medium);
	color: var(--e-ink);
	font-variant-numeric: tabular-nums;
}

.imds-badge {
	display: inline-flex;
	align-items: center;
	height: 24px;
	padding: 0 9px;
	background: var(--e-red);
	color: #fff;
	font-size: 11px;
	font-weight: var(--e-w-medium);
	letter-spacing: var(--e-ls-caps-s);
	text-transform: uppercase;
	white-space: nowrap;
}

.imds-cartline { width: 100%; }

.imds-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	min-height: 52px;
	padding: 14px 24px;
	background: var(--e-red);
	border: 1px solid var(--e-red);
	color: #fff;
	font-size: var(--e-fs-sm);
	font-weight: var(--e-w-medium);
	letter-spacing: var(--e-ls-caps-s);
	text-transform: uppercase;
	cursor: pointer;
	transition: background var(--e-dur-2) var(--e-ease), border-color var(--e-dur-2) var(--e-ease);
}

.imds-btn:hover { background: var(--e-red-hover); border-color: var(--e-red-hover); }
.imds-btn[disabled], .imds-btn.is-loading { opacity: .6; pointer-events: none; }

/* --------------------------------------------------------------------------
   Filter chips (also referenced from 10-commerce.css)
   -------------------------------------------------------------------------- */
.imds-filter { white-space: nowrap; }

/* ==========================================================================
   Sets: layout corrections
   ========================================================================== */

/*
 * The shortcode renders inside the page's reading column (.e-prose--narrow,
 * 734px). That measure is right for prose and wrong for a product grid: at
 * 1440px each set card came out 197px wide with 73px thumbnails, so a
 * two-piece set looked like a single small product. Only the containers that
 * actually hold the block are widened; every other page keeps its reading
 * measure.
 */
.e-prose--narrow:has(.imds-wrap),
.e-prose:has(.imds-wrap) { max-width: none; }

.e-container-pr:has(.imds-wrap) {
	max-width: calc(var(--e-max) + var(--e-gutter) * 2);
	width: 100%;
}

/* --------------------------------------------------------------------------
   Card: make it read as a set
   -------------------------------------------------------------------------- */
/*
 * Two per row, not three. A set card carries two to four product thumbnails
 * inside it; at three columns each thumbnail fell to roughly 120px and the
 * pieces — the whole point of a set — became unreadable.
 */
.imds-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--e-s6); }

@media (max-width: 900px) {
	.imds-grid { grid-template-columns: minmax(0, 1fr); }
}

/* The pieces are the point: give them room. */
.imds-thumb { aspect-ratio: 4 / 5; }

.imds-items { gap: var(--e-s3); }

/*
 * "N pieces" on the card. Without it a two-piece set reads as two unrelated
 * products sitting next to each other; the count is already on the element as
 * data-count, so nothing new has to be stored.
 */
.imds-title {
	display: flex;
	align-items: baseline;
	justify-content: space-between;
	gap: var(--e-s3);
}

.imds-card[data-count]::before {
	content: attr(data-count) " parça";
	position: absolute;
	top: var(--e-s4);
	right: var(--e-s4);
	z-index: 2;
	padding: 4px 10px;
	background: var(--e-ink);
	color: #fff;
	font-size: 11px;
	font-weight: var(--e-w-medium);
	letter-spacing: var(--e-ls-caps-s);
	text-transform: uppercase;
	border-radius: var(--e-r-pill);
	pointer-events: none;
}

html[lang^="en"] .imds-card[data-count]::before { content: attr(data-count) " pieces"; }

.imds-card { position: relative; }

/* A hairline between the pieces so the group reads as one object. */
.imds-items {
	padding: var(--e-s4);
	background: var(--e-surface-2);
	border: 1px solid var(--e-line);
}

.imds-item {
	background: var(--e-surface);
	padding: var(--e-s3);
}

@media (max-width: 767px) {
	.imds-grid { grid-template-columns: minmax(0, 1fr); }
}

@media (max-width: 420px) {
	.imds-items { padding: var(--e-s3); }
	.imds-item { padding: 8px; }
}

/* The block sits inside .e-prose, whose links carry a red underline. That is
   right for a sentence and wrong for a product tile. */
.e-prose .imds-wrap a,
.e-prose .imds-wrap a:hover { border-bottom: 0; padding-bottom: 0; }

/* The sets category renders the set catalogue; the one product WooCommerce
   still queries to satisfy the loop is not shown. */
.e-sets-archive__loop,
.e-sets-archive__hidden { display: none !important; }

.e-sets-archive .imds-wrap { padding-inline: 0; }

/* Layer: 13-cart.css */
/* ==========================================================================
   ERPIN DESIGN SYSTEM — 13 CART
   Theme-owned cart page. Two columns on desktop, a single stack of cards on
   touch, with the summary pinned to the bottom of the viewport where the
   decision is actually made.
   ========================================================================== */

.e-cart { width: 100%; }

/* --------------------------------------------------------------------------
   Incentive notes
   -------------------------------------------------------------------------- */
.e-cart__incentives {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
	gap: var(--e-s3);
	margin-bottom: var(--e-s7);
}

.e-cart__note {
	display: flex;
	align-items: flex-start;
	gap: 12px;
	padding: 14px 16px;
	border: 1px solid var(--e-line);
	border-left: 3px solid var(--e-line-2);
	background: var(--e-surface);
	min-width: 0;
}

.e-cart__note svg { flex: none; color: var(--e-muted); margin-top: 1px; }
.e-cart__note strong { display: block; font-size: var(--e-fs-sm); font-weight: var(--e-w-medium); color: var(--e-ink); }
.e-cart__note small { display: block; margin-top: 3px; font-size: var(--e-fs-sm); color: var(--e-muted); line-height: 1.5; }

.e-cart__note--good { border-left-color: var(--e-success); background: var(--e-success-bg); }
.e-cart__note--good svg { color: var(--e-success); }
.e-cart__note--good small { color: #2b5c46; }

.e-cart__note--info { border-left-color: var(--e-red); }
.e-cart__note--info svg { color: var(--e-red); }

/* --------------------------------------------------------------------------
   Shell
   -------------------------------------------------------------------------- */
.e-cart__grid {
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(0, 380px);
	gap: clamp(32px, 4vw, 64px);
	align-items: start;
}

.e-cart__main { min-width: 0; }

.e-cart__heading {
	font-family: var(--e-font-display);
	font-size: var(--e-d4);
	font-weight: var(--e-w-display);
	letter-spacing: var(--e-ls-display);
	margin-bottom: var(--e-s5);
}

/* --------------------------------------------------------------------------
   Items
   -------------------------------------------------------------------------- */
.e-cart__items { border-top: 1px solid var(--e-line); }

.e-cart__item {
	display: grid;
	grid-template-columns: 96px minmax(0, 1fr) auto auto 44px;
	align-items: center;
	gap: var(--e-s5);
	padding: var(--e-s5) 0;
	border-bottom: 1px solid var(--e-line);
}

.e-cart__thumb { grid-column: 1; }

.e-cart__thumb img {
	width: 96px;
	height: 120px;
	object-fit: cover;
	background: var(--e-surface-2);
}

.e-cart__info { grid-column: 2; min-width: 0; }

.e-cart__name {
	font-size: var(--e-fs-base);
	font-weight: var(--e-w-normal);
	line-height: 1.4;
}

.e-cart__name a { color: var(--e-ink); }
.e-cart__name a:hover { color: var(--e-red); }

.e-cart__sku {
	margin-top: 3px;
	font-size: var(--e-fs-xs);
	letter-spacing: var(--e-ls-caps-s);
	text-transform: uppercase;
	color: var(--e-muted-2);
}

/* Ring size, engraving and any other personalisation the module stores. */
.e-cart__meta {
	margin-top: 8px;
	font-size: var(--e-fs-sm);
	color: var(--e-muted);
	line-height: 1.55;
}

.e-cart__meta dl,
.e-cart__meta .variation { margin: 0; display: grid; gap: 2px; }
.e-cart__meta dt { display: inline; font-weight: var(--e-w-medium); color: var(--e-ink-2); }
.e-cart__meta dd { display: inline; margin: 0 0 0 4px; }
.e-cart__meta dd p { display: inline; margin: 0; }
.e-cart__meta dd::after { content: ""; display: block; }

.e-cart__unit { margin-top: 8px; font-size: var(--e-fs-sm); color: var(--e-muted); }

.e-cart__qty {
	grid-column: 3;
	display: inline-flex;
	align-items: stretch;
	border: 1px solid var(--e-line-2);
	background: var(--e-surface);
	height: 48px;
}

.e-cart__qty button {
	width: 42px;
	display: grid;
	place-items: center;
	font-size: 18px;
	line-height: 1;
	color: var(--e-ink-2);
	transition: background var(--e-dur-1) var(--e-ease);
}

.e-cart__qty button:hover { background: var(--e-surface-2); color: var(--e-ink); }

.e-cart__qty input {
	width: 52px;
	min-height: 0;
	height: auto;
	border: 0;
	border-inline: 1px solid var(--e-line);
	text-align: center;
	padding: 0;
	font-size: var(--e-fs-sm);
	font-weight: var(--e-w-medium);
	-moz-appearance: textfield;
}

.e-cart__qty input::-webkit-outer-spin-button,
.e-cart__qty input::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
.e-cart__qty input:focus { box-shadow: none; }
.e-cart__qtyfixed { display: grid; place-items: center; width: 48px; font-weight: var(--e-w-medium); }

.e-cart__line {
	grid-column: 4;
	font-size: var(--e-fs-md);
	font-weight: var(--e-w-medium);
	color: var(--e-ink);
	white-space: nowrap;
	font-variant-numeric: tabular-nums;
	text-align: right;
}

.e-cart__remove {
	grid-column: 5;
	display: grid;
	place-items: center;
	width: 44px; height: 44px;
	border-radius: 50%;
	color: var(--e-muted-2);
	transition: color var(--e-dur-1) var(--e-ease), background var(--e-dur-1) var(--e-ease);
}

.e-cart__remove span { display: none; }
.e-cart__remove:hover { color: var(--e-red); background: var(--e-red-tint); }

/* --------------------------------------------------------------------------
   Coupon + update
   -------------------------------------------------------------------------- */
.e-cart__actions {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: var(--e-s4);
	flex-wrap: wrap;
	padding-top: var(--e-s6);
}

.e-cart__coupon { display: flex; gap: var(--e-s2); flex: 1 1 340px; min-width: 0; }
.e-cart__coupon input { flex: 1 1 auto; min-width: 0; min-height: 48px; }
.e-cart__coupon .e-btn { flex: none; min-height: 48px; }
.e-cart__update { flex: none; }

.e-cart__points { margin-top: var(--e-s7); }

/* --------------------------------------------------------------------------
   Summary
   -------------------------------------------------------------------------- */
.e-cart__aside { position: sticky; top: calc(var(--e-header-h) + 24px); }

.e-cart__summary {
	border: 1px solid var(--e-line);
	background: var(--e-surface);
	padding: var(--e-s6);
}

.e-cart__summary .e-defs { margin-top: var(--e-s2); }
.e-defs__row--save .e-defs__val { color: var(--e-success); }
.e-cart__free { color: var(--e-success); }

.e-cart__wire {
	display: flex;
	align-items: flex-start;
	gap: 10px;
	margin-top: var(--e-s5);
	padding: 12px 14px;
	background: var(--e-surface-2);
	font-size: var(--e-fs-sm);
	color: var(--e-ink-2);
}

.e-cart__wire svg { flex: none; color: var(--e-muted); margin-top: 2px; }
.e-cart__wire strong { color: var(--e-ink); font-weight: var(--e-w-medium); }
.e-cart__wire small { display: block; margin-top: 2px; color: var(--e-muted); line-height: 1.45; }

.e-cart__checkout { margin-top: var(--e-s6); min-height: 60px; }

.e-cart__continue {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	width: 100%;
	min-height: 44px;
	margin-top: var(--e-s3);
	font-size: var(--e-fs-sm);
	color: var(--e-muted);
}

.e-cart__continue:hover { color: var(--e-ink); }

/* --------------------------------------------------------------------------
   Cross-sell rail
   -------------------------------------------------------------------------- */
.e-cart__rail {
	margin-top: var(--e-sect-md);
	padding-top: var(--e-s9);
	border-top: 1px solid var(--e-line);
}

.e-cart__railtitle {
	font-family: var(--e-font-display);
	font-size: var(--e-d4);
	font-weight: var(--e-w-display);
	letter-spacing: var(--e-ls-display);
	margin-bottom: var(--e-s7);
}

/* --------------------------------------------------------------------------
   Tablet
   -------------------------------------------------------------------------- */
@media (max-width: 1023px) {
	.e-cart__grid { grid-template-columns: minmax(0, 1fr); }
	.e-cart__aside { position: static; }
}

/* --------------------------------------------------------------------------
   Touch
   -------------------------------------------------------------------------- */
@media (max-width: 767px) {
	.e-cart__incentives { grid-template-columns: 1fr; }

	/*
	 * Card layout. The five-column desktop row cannot survive 360px, so each
	 * item becomes a two-column card: image on the left, everything else
	 * stacked on the right, remove pinned to the top-right corner.
	 */
	.e-cart__item {
		grid-template-columns: 88px minmax(0, 1fr);
		grid-template-areas:
			"thumb info"
			"thumb qty"
			"thumb line";
		gap: 4px var(--e-s4);
		padding: var(--e-s5) 0;
		position: relative;
	}

	.e-cart__thumb { grid-area: thumb; align-self: start; }
	.e-cart__thumb img { width: 88px; height: 110px; }
	.e-cart__info { grid-area: info; padding-right: 40px; }
	.e-cart__qty { grid-area: qty; justify-self: start; margin-top: 8px; height: 44px; }
	.e-cart__qty button { width: 38px; }
	.e-cart__qty input { width: 46px; }
	.e-cart__line { grid-area: line; text-align: left; margin-top: 8px; }

	.e-cart__remove {
		position: absolute;
		top: var(--e-s4); right: -6px;
	}

	.e-cart__actions { flex-direction: column; align-items: stretch; }
	.e-cart__coupon { flex: none; }
	.e-cart__update { width: 100%; }

	.e-cart__summary { padding: var(--e-s5); }

	/*
	 * The pay button stays in normal flow. A sticky button inside a short
	 * summary card resolves against the card, not the viewport, and ended up
	 * floating above the totals it is supposed to follow.
	 */
}

/* --------------------------------------------------------------------------
   Points panel in the cart
   -------------------------------------------------------------------------- */
.e-points {
	display: flex;
	align-items: flex-start;
	gap: var(--e-s4);
	margin-top: var(--e-s6);
	padding: var(--e-s5);
	border: 1px solid var(--e-line-2);
	background: var(--e-surface-2);
}

.e-points > svg { flex: none; margin-top: 2px; color: var(--e-muted); }
.e-points--on { border-color: var(--e-success); }
.e-points--on > svg { color: var(--e-success); }

.e-points__body { flex: 1 1 auto; min-width: 0; }
.e-points__body strong { display: block; font-size: var(--e-fs-base); font-weight: var(--e-w-medium); color: var(--e-ink); }
.e-points__body span { display: block; margin-top: 4px; font-size: var(--e-fs-sm); color: var(--e-muted); line-height: 1.55; }
.e-points__body span .amount { color: var(--e-ink); font-weight: var(--e-w-medium); }

.e-points__body span.amount,
.e-points__body .woocommerce-Price-currencySymbol { display: inline; margin: 0; }

.e-cart__loyalty { margin-bottom: var(--e-s6); }
.e-cart__loyalty .e-points { margin-top: 0; }
body.erpin.erpin-support-ready #wa.wa__widget_container { display: none !important; }

.e-product-facts { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.5fr); gap: 12px 24px; }
.e-product-facts dt { color: var(--e-muted); }
.e-product-facts dd { margin: 0; }
.e-auth__form #sendCode { height: auto; white-space: normal; margin-top: 12px; padding: 12px 16px; cursor: pointer; }

.e-points__apply { flex: none; white-space: nowrap; }

.e-points__undo {
	flex: none;
	display: inline-flex;
	align-items: center;
	min-height: 44px;
	font-size: var(--e-fs-sm);
	color: var(--e-muted);
	text-decoration: underline;
	text-underline-offset: 3px;
}

.e-points__undo:hover { color: var(--e-red); }

.e-points--guest p { margin: 0; font-size: var(--e-fs-sm); color: var(--e-ink-2); }
.e-points--guest a { text-decoration: underline; text-underline-offset: 3px; }
.e-points--guest a:hover { color: var(--e-red); }

@media (max-width: 560px) {
	.e-points { flex-wrap: wrap; }
	.e-points__apply,
	.e-points__undo { width: 100%; justify-content: center; }
}

/* Tier explainer under the points panel. */
.e-points__how {
	margin-top: calc(var(--e-s3) * -1 + 2px);
	border: 1px solid var(--e-line);
	border-top: 0;
	background: var(--e-surface);
}

.e-points__how summary {
	display: flex;
	align-items: center;
	gap: 9px;
	min-height: 46px;
	padding: 0 var(--e-s5);
	font-size: var(--e-fs-sm);
	color: var(--e-ink-2);
	cursor: pointer;
	list-style: none;
}

.e-points__how summary::-webkit-details-marker { display: none; }
.e-points__how summary::after { content: "+"; margin-left: auto; font-size: 17px; color: var(--e-muted-2); }
.e-points__how[open] summary::after { content: "−"; }
.e-points__how summary svg { flex: none; color: var(--e-muted); }
.e-points__how summary:hover { color: var(--e-ink); }

.e-points__howbody {
	padding: 0 var(--e-s5) var(--e-s5);
	font-size: var(--e-fs-sm);
	color: var(--e-ink-2);
	line-height: 1.6;
}

.e-points__howbody p { margin: 0 0 var(--e-s3); }
.e-points__howlede { color: var(--e-ink); }
.e-points__hownote { font-size: var(--e-fs-2xs); color: var(--e-muted); }

.e-points__tiers {
	width: 100%;
	border-collapse: collapse;
	margin: 0 0 var(--e-s4);
	font-variant-numeric: tabular-nums;
}

.e-points__tiers th {
	text-align: left;
	padding: 8px 0;
	border-bottom: 1px solid var(--e-line);
	font-size: var(--e-fs-2xs);
	font-weight: var(--e-w-normal);
	letter-spacing: var(--e-ls-caps-s);
	text-transform: uppercase;
	color: var(--e-muted);
}

.e-points__tiers th:last-child,
.e-points__tiers td:last-child { text-align: right; }

.e-points__tiers td {
	padding: 10px 0;
	border-bottom: 1px solid var(--e-line);
	font-size: var(--e-fs-sm);
}

.e-points__tiers tr:last-child td { border-bottom: 0; }
.e-points__tiers td:last-child { font-weight: var(--e-w-medium); color: var(--e-ink); }

/* Layer: 14-checkout.css */
/* ==========================================================================
   ERPIN DESIGN SYSTEM — 14 CHECKOUT
   Theme-owned checkout. Two columns on desktop (details left, basket right),
   one column on touch with the basket collapsed above the form.
   ========================================================================== */

.e-checkout { width: 100%; }

/* --------------------------------------------------------------------------
   Focused shell: the checkout drops the announcement bar and the nav row so
   the only things on screen are the order and the form.
   -------------------------------------------------------------------------- */
.erpin-checkout-focus .e-header__navrow,
.erpin-checkout-focus .e-trust { display: none; }

/* --------------------------------------------------------------------------
   Step bar
   -------------------------------------------------------------------------- */
.e-steps-bar {
	display: flex;
	align-items: center;
	gap: var(--e-s5);
	flex-wrap: wrap;
	padding-bottom: var(--e-s6);
	margin-bottom: var(--e-s7);
	border-bottom: 1px solid var(--e-line);
	counter-reset: step;
}

.e-steps-bar__item {
	display: flex;
	align-items: center;
	gap: 10px;
	font-size: var(--e-fs-sm);
	color: var(--e-muted-2);
	white-space: nowrap;
}

.e-steps-bar__item + .e-steps-bar__item::before {
	content: "";
	width: clamp(16px, 4vw, 48px);
	height: 1px;
	background: var(--e-line-2);
	margin-right: 10px;
}

.e-steps-bar__n {
	display: grid;
	place-items: center;
	width: 26px; height: 26px;
	border-radius: 50%;
	border: 1px solid var(--e-line-2);
	font-size: var(--e-fs-xs);
	font-weight: var(--e-w-medium);
	flex: none;
}

.e-steps-bar__item.is-done { color: var(--e-ink-2); }
.e-steps-bar__item.is-done .e-steps-bar__n { background: var(--e-ink); border-color: var(--e-ink); color: #fff; }
.e-steps-bar__item.is-done a:hover { color: var(--e-red); }

.e-steps-bar__short { display: none; }

.e-steps-bar__item.is-current { color: var(--e-ink); font-weight: var(--e-w-medium); }
.e-steps-bar__item.is-current .e-steps-bar__n { border-color: var(--e-red); color: var(--e-red); }

/* --------------------------------------------------------------------------
   Shell
   -------------------------------------------------------------------------- */
.e-checkout__grid {
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(0, 400px);
	gap: clamp(32px, 4vw, 64px);
	align-items: start;
}

.e-checkout__main { min-width: 0; }

/* --------------------------------------------------------------------------
   Numbered sections
   -------------------------------------------------------------------------- */
.e-cosec + .e-cosec { margin-top: var(--e-s7); }

.e-cosec__head {
	display: flex;
	align-items: center;
	gap: var(--e-s4);
	padding-bottom: var(--e-s4);
	border-bottom: 1px solid var(--e-line);
	margin-bottom: var(--e-s6);
}

.e-cosec__n {
	display: grid;
	place-items: center;
	width: 30px; height: 30px;
	border-radius: 50%;
	background: var(--e-ink);
	color: #fff;
	font-size: var(--e-fs-sm);
	font-weight: var(--e-w-medium);
	flex: none;
}

.e-cosec__title {
	font-family: var(--e-font-display);
	font-size: var(--e-d4);
	font-weight: var(--e-w-display);
	letter-spacing: var(--e-ls-display);
}

.e-cosec__hint { font-size: var(--e-fs-sm); color: var(--e-muted); margin-bottom: var(--e-s4); max-width: 56ch; }

/* --------------------------------------------------------------------------
   Form fields — WooCommerce markup
   -------------------------------------------------------------------------- */
.woocommerce-billing-fields__field-wrapper,
.woocommerce-shipping-fields__field-wrapper,
.woocommerce-additional-fields__field-wrapper {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: var(--e-s4) var(--e-s4);
}

/* The shared `.woocommerce form .form-row*` rules in 10-commerce.css still
   serve the account and coupon forms, and they carry an element selector; the
   grid overrides here have to outrank them rather than merely follow them. */
body.woocommerce-checkout form.checkout .form-row {
	margin: 0;
	padding: 0;
	min-width: 0;
	width: auto;
	display: block;
}

body.woocommerce-checkout form.checkout .form-row-wide,
body.woocommerce-checkout form.checkout .form-row-full,
body.woocommerce-checkout form.checkout .notes { grid-column: 1 / -1; }

/* Country locale rules re-add `form-row-wide` to the address fields after our
   `woocommerce_checkout_fields` filter has run, so the half-width marker has
   to win here rather than there. Must stay after the rule above. */
body.woocommerce-checkout form.checkout .form-row-half { grid-column: auto; }

body.woocommerce-checkout form.checkout .form-row-first { margin-right: 0; }

/* Section sub-headings ("Fatura detayları") */
.woocommerce-billing-fields > h3,
.woocommerce-additional-fields > h3 {
	font-size: var(--e-fs-base);
	font-weight: var(--e-w-medium);
	color: var(--e-ink);
	margin-bottom: var(--e-s4);
}

/* --------------------------------------------------------------------------
   Social login (Super Socializer) — it injects itself between the account
   section and the billing fields; give it the same card language rather than
   leaving a stray centred icon row.
   -------------------------------------------------------------------------- */
.the_champ_outer_login_container {
	margin: 0 0 var(--e-s7);
	padding: var(--e-s5);
	border: 1px solid var(--e-line);
	background: var(--e-surface-2);
	text-align: left;
}

.the_champ_social_login_title {
	font-size: var(--e-fs-sm);
	color: var(--e-muted);
	margin-bottom: var(--e-s3);
	text-align: left !important; /* the plugin sets alignment inline */
}

.the_champ_login_container ul.the_champ_login_ul { display: flex; gap: 10px; margin: 0; padding: 0; }
.the_champ_login_container ul.the_champ_login_ul li { list-style: none; }

.woocommerce-checkout .form-row label {
	display: block;
	margin-bottom: 7px;
	font-size: var(--e-fs-sm);
	font-weight: var(--e-w-medium);
	color: var(--e-ink);
}

.woocommerce-checkout .form-row .required { color: var(--e-red); text-decoration: none; border: 0; }
.woocommerce-checkout .form-row .optional { color: var(--e-muted); font-weight: var(--e-w-normal); }

.woocommerce-checkout .form-row .input-text,
.woocommerce-checkout .form-row select,
.woocommerce-checkout .form-row textarea { width: 100%; }

.woocommerce-checkout .form-row textarea { min-height: 104px; }

/* selectWoo / select2, when the country field uses it */
.woocommerce-checkout .select2-container--default .select2-selection--single {
	height: 52px;
	border: 1px solid var(--e-line-2);
	border-radius: 0;
	background: var(--e-surface);
}

.woocommerce-checkout .select2-container--default .select2-selection--single .select2-selection__rendered {
	line-height: 50px;
	padding-left: 15px;
	color: var(--e-ink);
	font-size: 16px;
}

.woocommerce-checkout .select2-container--default .select2-selection--single .select2-selection__arrow { height: 50px; }
.select2-dropdown { border-color: var(--e-line-2); border-radius: 0; }
.select2-container--default .select2-results__option--highlighted[aria-selected] { background: var(--e-ink); }

/* "Create an account?" sits directly under the last field; give it air. */
.woocommerce-account-fields { margin-top: var(--e-s4); }

/* Ship-to-different-address toggle */
.woocommerce-shipping-fields > h3 {
	font-size: var(--e-fs-base);
	font-weight: var(--e-w-medium);
	margin: var(--e-s6) 0 var(--e-s4);
	padding-top: var(--e-s5);
	border-top: 1px solid var(--e-line);
}

.woocommerce-shipping-fields #ship-to-different-address-checkbox { margin-right: 10px; }

.woocommerce-shipping-fields > h3 label {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	min-height: 44px;
	cursor: pointer;
	font-weight: var(--e-w-medium);
}

/* --------------------------------------------------------------------------
   Review table (totals)
   -------------------------------------------------------------------------- */
.e-coreview {
	width: 100%;
	border-collapse: collapse;
	font-size: var(--e-fs-sm);
	margin-bottom: var(--e-s6);
}

.e-coreview tbody:empty { display: none; }

.e-coreview th,
.e-coreview td {
	padding: 13px 0;
	border-bottom: 1px solid var(--e-line);
	text-align: left;
	font-weight: var(--e-w-normal);
	color: var(--e-muted);
}

.e-coreview td { text-align: right; color: var(--e-ink); font-weight: var(--e-w-medium); font-variant-numeric: tabular-nums; }
.e-coreview .e-coreview__free { color: var(--e-success); }
.e-coreview .fee.e-coreview__save td,
.e-coreview .cart-discount td { color: var(--e-success); }

/* Shipping choices live inside the totals table; keep them readable rather
   than letting them inherit the right-aligned money column. */
.e-coreview #shipping_method {
	display: grid;
	gap: 6px;
	margin: 0;
	padding: 0;
	text-align: right;
}

.e-coreview #shipping_method li {
	list-style: none;
	display: flex;
	align-items: center;
	justify-content: flex-end;
	gap: 9px;
}

.e-coreview #shipping_method label {
	min-height: 32px;
	display: flex;
	align-items: center;
	font-weight: var(--e-w-normal);
	color: var(--e-ink-2);
	cursor: pointer;
}

/* WooCommerce's shipping radios are absolutely positioned by the vendor
   stylesheet, which drops them on top of their own labels here. */
.e-coreview #shipping_method input[type="radio"] {
	position: static;
	flex: none;
	width: 16px;
	height: 16px;
	margin: 0;
	opacity: 1;
	accent-color: var(--e-red);
}
.e-coreview .woocommerce-shipping-destination { display: none; }

.e-coreview .order-total th,
.e-coreview .order-total td {
	border-bottom: 0;
	border-top: 1px solid var(--e-ink);
	padding-top: var(--e-s5);
	font-size: var(--e-fs-md);
	color: var(--e-ink);
	font-weight: var(--e-w-medium);
}

.e-coreview .order-total td { font-size: var(--e-fs-lg); }

/* --------------------------------------------------------------------------
   Payment methods
   -------------------------------------------------------------------------- */
.e-copay__list { display: grid; gap: var(--e-s3); margin: 0 0 var(--e-s6); padding: 0; }

.e-copay__item {
	list-style: none;
	border: 1px solid var(--e-line-2);
	background: var(--e-surface);
	transition: border-color var(--e-dur-1) var(--e-ease), background var(--e-dur-1) var(--e-ease);
}

.e-copay__item:has(.e-copay__radio:checked) { border-color: var(--e-ink); }

.e-copay__radio {
	position: absolute;
	width: 1px; height: 1px;
	opacity: 0;
	pointer-events: none;
}

.e-copay__label {
	display: flex;
	align-items: center;
	gap: var(--e-s4);
	min-height: 62px;
	padding: 12px var(--e-s5);
	cursor: pointer;
	font-size: var(--e-fs-base);
}

.e-copay__dot {
	flex: none;
	width: 20px; height: 20px;
	border: 1px solid var(--e-line-2);
	border-radius: 50%;
	transition: box-shadow var(--e-dur-1) var(--e-ease), border-color var(--e-dur-1) var(--e-ease);
}

.e-copay__radio:checked + .e-copay__label .e-copay__dot {
	border-color: var(--e-red);
	box-shadow: inset 0 0 0 5px var(--e-red);
}

.e-copay__radio:focus-visible + .e-copay__label .e-copay__dot {
	outline: 2px solid var(--e-focus);
	outline-offset: 2px;
}

.e-copay__name { flex: 1 1 auto; min-width: 0; color: var(--e-ink); }
.e-copay__icon { flex: none; display: flex; align-items: center; gap: 6px; }
.e-copay__icon img { max-height: 22px; width: auto; }

.e-copay__box {
	padding: 0 var(--e-s5) var(--e-s5);
	font-size: var(--e-fs-sm);
	color: var(--e-ink-2);
	line-height: 1.6;
}

.e-copay__box p:first-child { margin-top: 0; }
.e-copay__box input, .e-copay__box select { max-width: 100%; }

/* --------------------------------------------------------------------------
   Terms + place order
   -------------------------------------------------------------------------- */
.e-copay__submit { margin-top: var(--e-s2); }

.woocommerce-terms-and-conditions-wrapper { margin-bottom: var(--e-s5); }

.woocommerce-terms-and-conditions-wrapper .woocommerce-privacy-policy-text,
.woocommerce-terms-and-conditions-wrapper .woocommerce-privacy-policy-text p {
	font-size: var(--e-fs-sm);
	color: var(--e-muted);
	line-height: 1.6;
	margin: 0 0 var(--e-s4);
}

.woocommerce-terms-and-conditions-wrapper .woocommerce-form__label-for-checkbox span,
.woocommerce-terms-and-conditions-wrapper .woocommerce-terms-and-conditions-checkbox-text {
	font-size: var(--e-fs-sm);
	font-weight: var(--e-w-normal);
	color: var(--e-ink-2);
}

.validate-required.woocommerce-validated .e-check input { border-color: var(--e-line-2); }

.woocommerce-form__label-for-checkbox.checkbox {
	display: flex;
	align-items: flex-start;
	gap: 11px;
	min-height: 44px;
	font-size: var(--e-fs-sm);
	line-height: 1.55;
	color: var(--e-ink-2);
	cursor: pointer;
}

.woocommerce-form__label-for-checkbox.checkbox input { margin-top: 2px; }

.e-copay__place { min-height: 60px; }

.e-checkout__assurance {
	display: grid;
	gap: 9px;
	margin-top: var(--e-s5);
}

.e-checkout__assurance li {
	display: flex;
	align-items: center;
	gap: 10px;
	font-size: var(--e-fs-sm);
	color: var(--e-muted);
}

.e-checkout__assurance svg { flex: none; color: var(--e-muted-2); }

/* --------------------------------------------------------------------------
   Basket in the sidebar
   -------------------------------------------------------------------------- */
.e-checkout__aside { position: sticky; top: calc(var(--e-header-h) + 24px); }

.e-checkout__summary {
	border: 1px solid var(--e-line);
	background: var(--e-surface);
	padding: var(--e-s6);
}

.e-checkout__summary .e-cosec__title {
	padding-bottom: var(--e-s4);
	border-bottom: 1px solid var(--e-line);
	margin-bottom: var(--e-s4);
}

.e-cobasket { display: grid; gap: var(--e-s4); }

.e-cobasket__item {
	display: grid;
	grid-template-columns: 56px minmax(0, 1fr) auto;
	gap: var(--e-s4);
	align-items: start;
}

.e-cobasket__thumb { position: relative; }

.e-cobasket__thumb img {
	width: 56px; height: 70px;
	object-fit: cover;
	background: var(--e-surface-2);
}

.e-cobasket__qty {
	position: absolute;
	top: -7px; right: -7px;
	min-width: 20px; height: 20px;
	padding: 0 5px;
	border-radius: var(--e-r-pill);
	background: var(--e-ink);
	color: #fff;
	font-size: 11px;
	line-height: 20px;
	text-align: center;
}

.e-cobasket__info { min-width: 0; }
.e-cobasket__info strong { display: block; font-size: var(--e-fs-sm); font-weight: var(--e-w-normal); color: var(--e-ink); line-height: 1.4; }

.e-cobasket__meta {
	display: block;
	margin-top: 5px;
	font-size: var(--e-fs-2xs);
	color: var(--e-muted);
	line-height: 1.5;
}

.e-cobasket__meta dl { margin: 0; }
.e-cobasket__meta dt, .e-cobasket__meta dd { display: inline; margin: 0; }
.e-cobasket__meta dd::after { content: ""; display: block; }

.e-cobasket__price { font-size: var(--e-fs-sm); font-weight: var(--e-w-medium); white-space: nowrap; font-variant-numeric: tabular-nums; }

.e-cobasket__edit {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	min-height: 44px;
	margin-top: var(--e-s3);
	font-size: var(--e-fs-sm);
	color: var(--e-muted);
}

.e-cobasket__edit:hover { color: var(--e-red); }

.e-cocoupon {
	margin-top: var(--e-s4);
	padding-top: var(--e-s4);
	border-top: 1px solid var(--e-line);
}

.e-cocoupon summary {
	display: flex;
	align-items: center;
	min-height: 44px;
	font-size: var(--e-fs-sm);
	color: var(--e-ink-2);
	cursor: pointer;
	list-style: none;
}

.e-cocoupon summary::-webkit-details-marker { display: none; }
.e-cocoupon summary::after { content: "+"; margin-left: auto; font-size: 18px; color: var(--e-muted-2); }
.e-cocoupon[open] summary::after { content: "−"; }

.e-cocoupon .checkout_coupon { border: 0; padding: 0; margin: 0; }
.e-cocoupon .form-row { margin: 0 0 var(--e-s2); }
.e-cocoupon .form-row-first, .e-cocoupon .form-row-last { width: 100%; }
.e-cocoupon .button {
	width: 100%;
	min-height: 48px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	border: 1px solid var(--e-ink);
	background: transparent;
	color: var(--e-ink);
	font-size: var(--e-fs-sm);
	font-weight: var(--e-w-medium);
	letter-spacing: var(--e-ls-caps-s);
	text-transform: uppercase;
}

.e-cocoupon .button:hover { background: var(--e-ink); color: #fff; }

/* --------------------------------------------------------------------------
   Result screen
   -------------------------------------------------------------------------- */
.e-thankyou { width: 100%; }
.e-thanks--failed .e-thanks__mark { color: var(--e-red); }

.e-thankyou__body { max-width: 780px; margin-inline: auto; }


/* --------------------------------------------------------------------------
   Order result: the business modules' output
   (order-automation.php renders these; its inline <style> was moved here)
   -------------------------------------------------------------------------- */

/* Core's own duplicates of what the modules already print. The customer
   details template is rendered for guests by order-confirmation.php and
   repeats the module's own address grid, so it is hidden here — as it was
   before, when this rule lived in the module's inline stylesheet. */
.woocommerce-thankyou-order-received,
.woocommerce-order-overview,
.woocommerce-order-details,
.woocommerce-customer-details { display: none; }

.imd-thankyou-wrap { padding: 0; margin: 0; }

.erpin-custom-thankyou-wrap {
	width: 100%;
	max-width: 780px;
	margin: var(--e-s7) auto 0;
	font-size: var(--e-fs-base);
	color: var(--e-ink-2);
}

.erpin-custom-thankyou-wrap p { line-height: 1.65; }

/* Lead box */
.erpin-ty-box {
	border: 1px solid var(--e-line);
	border-left: 2px solid var(--e-red);
	background: var(--e-surface-2);
	padding: var(--e-s6);
	margin-bottom: var(--e-s6);
}

.erpin-ty-box h3 {
	font-family: var(--e-font-display);
	font-size: var(--e-d4);
	font-weight: var(--e-w-display);
	letter-spacing: var(--e-ls-display);
	color: var(--e-ink);
	margin: 0 0 var(--e-s3);
}

.erpin-ty-box .erpin-order-no { margin: 0; font-size: var(--e-fs-sm); color: var(--e-ink-2); }
.erpin-ty-note { margin: var(--e-s4) 0 0; font-size: var(--e-fs-2xs); color: var(--e-muted); }

/* Facts grid */
.erpin-order-meta,
.erpin-adres-grid,
.erpin-banka-grid {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 1px;
	background: var(--e-line);
	border: 1px solid var(--e-line);
	margin-bottom: var(--e-s6);
}

.erpin-meta-kart,
.erpin-adres-kart,
.erpin-banka-kart {
	background: var(--e-surface);
	padding: var(--e-s5);
	border: 0;
	border-radius: 0;
}

.erpin-meta-label {
	margin: 0 0 5px;
	font-size: 11px;
	font-weight: var(--e-w-medium);
	letter-spacing: var(--e-ls-caps-s);
	text-transform: uppercase;
	color: var(--e-muted);
}

.erpin-meta-val { margin: 0; font-size: var(--e-fs-sm); font-weight: var(--e-w-medium); color: var(--e-ink); }

/* Item table */
.erpin-summary-wrap {
	border: 1px solid var(--e-line);
	background: var(--e-surface);
	padding: var(--e-s6);
	margin-bottom: var(--e-s6);
	overflow-x: auto;
}

.erpin-summary-wrap h4 {
	margin: 0 0 var(--e-s4);
	padding-bottom: var(--e-s3);
	border-bottom: 1px solid var(--e-line);
	font-family: var(--e-font-display);
	font-size: var(--e-fs-lg);
	font-weight: var(--e-w-display);
	color: var(--e-ink);
}

.erpin-summary-wrap table { width: 100%; border-collapse: collapse; font-size: var(--e-fs-sm); }

.erpin-summary-wrap th {
	text-align: left;
	padding: 10px 0;
	border-bottom: 1px solid var(--e-line);
	color: var(--e-muted);
	font-weight: var(--e-w-normal);
	font-size: var(--e-fs-2xs);
	letter-spacing: var(--e-ls-caps-s);
	text-transform: uppercase;
}

.erpin-summary-wrap th:last-child { text-align: right; }

.erpin-summary-wrap td {
	padding: 12px 0;
	border-bottom: 1px solid var(--e-line);
	color: var(--e-ink-2);
	vertical-align: middle;
}

.erpin-summary-wrap td:last-child {
	text-align: right;
	font-weight: var(--e-w-medium);
	color: var(--e-ink);
	white-space: nowrap;
	font-variant-numeric: tabular-nums;
}

.erpin-summary-wrap .erpin-fee-row td,
.erpin-summary-wrap .erpin-fee-row td:last-child { color: var(--e-success); }

.erpin-summary-wrap .erpin-total-row td {
	border-bottom: 0;
	border-top: 1px solid var(--e-ink);
	padding-top: var(--e-s5);
	font-size: var(--e-fs-md);
	font-weight: var(--e-w-medium);
	color: var(--e-ink);
}

/* Addresses */
.erpin-adres-kart h5 {
	margin: 0 0 var(--e-s3);
	padding-bottom: var(--e-s3);
	border-bottom: 1px solid var(--e-line);
	font-size: 11px;
	font-weight: var(--e-w-medium);
	letter-spacing: var(--e-ls-caps-s);
	text-transform: uppercase;
	color: var(--e-muted);
}

.erpin-adres-kart address { font-style: normal; font-size: var(--e-fs-sm); color: var(--e-ink-2); line-height: 1.7; }

/* Wire transfer instructions — the one place that keeps a warm tint, because
   the shopper still has an action to take. */
.erpin-havale-box {
	border: 1px solid var(--e-line-2);
	background: var(--e-surface-2);
	padding: var(--e-s6);
	margin-bottom: var(--e-s6);
}

.erpin-havale-box .erpin-uyari { margin: 0 0 var(--e-s4); font-size: var(--e-fs-base); color: var(--e-ink); }

.erpin-havale-box .erpin-iptal {
	margin: 0 0 var(--e-s4);
	padding: var(--e-s4);
	border-left: 2px solid var(--e-red);
	background: var(--e-surface);
	font-size: var(--e-fs-sm);
	color: var(--e-ink-2);
}

.erpin-havale-box .erpin-dekon { margin: 0 0 var(--e-s6); font-size: var(--e-fs-sm); color: var(--e-ink-2); }

.erpin-havale-box h4 {
	margin: 0 0 var(--e-s3);
	padding-bottom: var(--e-s3);
	border-bottom: 1px solid var(--e-line);
	font-size: var(--e-fs-base);
	font-weight: var(--e-w-medium);
	color: var(--e-ink);
}

.erpin-firma-adi { margin: 0 0 var(--e-s4); font-size: var(--e-fs-sm); font-weight: var(--e-w-medium); color: var(--e-ink); }
.erpin-banka-grid { margin-bottom: 0; }
.erpin-banka-kart .erpin-banka-isim { margin: 0 0 6px; font-size: var(--e-fs-2xs); color: var(--e-muted); }

.erpin-banka-kart .erpin-iban {
	margin: 0;
	font-size: var(--e-fs-sm);
	font-weight: var(--e-w-medium);
	color: var(--e-ink);
	letter-spacing: 0.02em;
	font-variant-numeric: tabular-nums;
	word-break: break-all;
}

/* Failed payment */
.erpin-failed-box {
	border: 1px solid var(--e-line);
	border-left: 2px solid var(--e-red);
	background: var(--e-surface-2);
	padding: var(--e-s6);
	margin-bottom: var(--e-s6);
}

.erpin-failed-box h3 {
	margin: 0 0 var(--e-s3);
	font-family: var(--e-font-display);
	font-size: var(--e-d4);
	font-weight: var(--e-w-display);
	color: var(--e-ink);
}

.erpin-failed-box p { margin: 0 0 var(--e-s5); font-size: var(--e-fs-base); color: var(--e-ink-2); }
.erpin-failed-actions { display: flex; gap: var(--e-s3); flex-wrap: wrap; }

.erpin-retry-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	min-height: 52px;
	padding: 0 var(--e-s6);
	background: var(--e-red);
	border: 1px solid var(--e-red);
	color: #fff;
	font-size: var(--e-fs-sm);
	font-weight: var(--e-w-medium);
	letter-spacing: var(--e-ls-caps-s);
	text-transform: uppercase;
	text-decoration: none;
}

.erpin-retry-btn:hover { background: var(--e-red-hover); border-color: var(--e-red-hover); color: #fff; }

.erpin-failed-note {
	margin: var(--e-s5) 0 0;
	padding-top: var(--e-s5);
	border-top: 1px solid var(--e-line);
	font-size: var(--e-fs-2xs);
	color: var(--e-muted);
}

.e-thankyou__next {
	display: flex;
	gap: var(--e-s3);
	justify-content: center;
	flex-wrap: wrap;
	margin-top: var(--e-s8);
}

/* --------------------------------------------------------------------------
   Tablet / touch
   -------------------------------------------------------------------------- */
@media (max-width: 1023px) {
	.e-checkout__grid {
		grid-template-columns: minmax(0, 1fr);
		/* Basket first: shoppers want to confirm what they are paying for
		   before they start typing. */
		grid-template-areas: "aside" "main";
	}
	.e-checkout__main { grid-area: main; }
	.e-checkout__aside { grid-area: aside; position: static; }
}

@media (max-width: 767px) {
	.e-steps-bar {
		gap: var(--e-s3);
		flex-wrap: nowrap;
		padding-bottom: var(--e-s4);
		margin-bottom: var(--e-s5);
	}
	.e-steps-bar__item { font-size: var(--e-fs-xs); gap: 7px; }
	.e-steps-bar__item + .e-steps-bar__item::before { width: 12px; margin-right: 5px; }
	.e-steps-bar__n { width: 23px; height: 23px; }
	.e-steps-bar__long { display: none; }
	.e-steps-bar__short { display: inline; }

	.woocommerce-billing-fields__field-wrapper,
	.woocommerce-shipping-fields__field-wrapper,
	.woocommerce-additional-fields__field-wrapper { grid-template-columns: minmax(0, 1fr); }

	body.woocommerce-checkout form.checkout .form-row-first,
	body.woocommerce-checkout form.checkout .form-row-last { width: auto; }

	.e-cosec__head { gap: var(--e-s3); margin-bottom: var(--e-s5); }
	.e-cosec__n { width: 26px; height: 26px; }
	.e-checkout__summary { padding: var(--e-s5); }

	.e-copay__label { min-height: 56px; padding: 12px var(--e-s4); font-size: var(--e-fs-sm); }
	.e-copay__box { padding: 0 var(--e-s4) var(--e-s4); }

	.e-thankyou__next .e-btn { flex: 1 1 200px; }

	.erpin-order-meta,
	.erpin-adres-grid,
	.erpin-banka-grid { grid-template-columns: minmax(0, 1fr); }

	.erpin-ty-box,
	.erpin-havale-box,
	.erpin-failed-box,
	.erpin-summary-wrap { padding: var(--e-s5); }

	.erpin-meta-kart,
	.erpin-adres-kart,
	.erpin-banka-kart { padding: var(--e-s4); }

	.erpin-failed-actions { flex-direction: column; }
	.erpin-retry-btn { width: 100%; }
}

/* ==========================================================================
   Card payment panel (Tami gateway)

   The gateway ships its own 320px-wide island: a navy gradient card floating
   over a rounded white box, in "Source Sans Pro" / "Source Code Pro", centred
   inside an 880px payment box. Its markup and JavaScript are untouched — the
   flip animation, the focus rectangle that tracks the active field and the
   per-digit spans all keep working; only the presentation is taken over.

   Every gateway rule is prefixed with the id `#tamiCreditCardFormApp`, so each
   override here carries a class in front of it to win on specificity.
   ========================================================================== */

.e-copay__box div#tamiCreditCardFormApp {
	font-size: var(--e-fs-base);
	color: var(--e-ink);
}

/* The gateway sets the face on every descendant with
   `div#tamiCreditCardFormApp * { font-family: "Source Sans Pro" !important }`,
   so this has to be a universal rule *and* carry !important to answer it.
   (The two Google font families are still fetched; stopping that would mean
   dequeuing the gateway stylesheet, which would take the card's layout too.) */
.e-copay__box div#tamiCreditCardFormApp,
.e-copay__box div#tamiCreditCardFormApp * { font-family: var(--e-font-text) !important; }

/* Desktop: card preview beside the fields instead of floating on top of them.
   The gateway overlaps the two with a 150px top padding; that is undone here. */
.e-copay__box div#tamiCreditCardFormApp .tami-card-form {
	max-width: 100%;
	margin: 0;
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	gap: var(--e-s5);
	align-items: start;
}

.e-copay__box div#tamiCreditCardFormApp .tami-card-form__inner {
	background: none;
	border: 0;
	border-radius: 0;
	padding: 0;
}

.e-copay__box div#tamiCreditCardFormApp .tami-card-list { margin: 0; }

.e-copay__box div#tamiCreditCardFormApp div.tami-card-form div.tami-card-list .tami-card-item {
	max-width: 100%;
	margin: 0;
}

@media (min-width: 860px) {
	.e-copay__box div#tamiCreditCardFormApp .tami-card-form {
		grid-template-columns: minmax(0, 330px) minmax(0, 1fr);
		gap: clamp(24px, 3vw, 44px);
	}
}

/* --------------------------------------------------------------------------
   The card itself
   -------------------------------------------------------------------------- */
.e-copay__box div#tamiCreditCardFormApp div.tami-card-form div.tami-card-list .tami-card-item__side {
	border-radius: 4px;
	box-shadow: 0 1px 2px rgba(22, 23, 27, 0.06), 0 12px 28px -14px rgba(22, 23, 27, 0.45);
}

/* Ink card with one red edge — the logo colour, used once. */
.e-copay__box div#tamiCreditCardFormApp div.tami-card-form div.tami-card-list .tami-card-item__cover {
	background-color: var(--e-ink);
	background-image: linear-gradient(152deg, #24262d 0%, #16171b 58%, #0f1013 100%);
	border-radius: 4px;
}

.e-copay__box div#tamiCreditCardFormApp div.tami-card-form div.tami-card-list .tami-card-item__cover::after {
	background: none;
	border-radius: 4px;
	box-shadow: inset 0 2px 0 0 var(--e-red);
}

/* Digits and name in the storefront face, with figures that do not jitter as
   they are typed. */
.e-copay__box div#tamiCreditCardFormApp div.tami-card-form div.tami-card-list .tami-card-item__wrapper {
	font-variant-numeric: tabular-nums;
	/* The gateway paints a blue drop shadow behind the digits, left over from
	   its own navy card. */
	text-shadow: none;
}

.e-copay__box div#tamiCreditCardFormApp div.tami-card-form div.tami-card-list .tami-card-item__number {
	font-size: clamp(18px, 4.6vw, 22px);
	font-weight: var(--e-w-medium);
	letter-spacing: 0.02em;
}

.e-copay__box div#tamiCreditCardFormApp div.tami-card-form div.tami-card-list .tami-card-item__numberItem { font-weight: var(--e-w-medium); }

.e-copay__box div#tamiCreditCardFormApp div.tami-card-form div.tami-card-list .tami-card-item__holder,
.e-copay__box div#tamiCreditCardFormApp div.tami-card-form div.tami-card-list .tami-card-item__dateTitle {
	font-size: 10px;
	letter-spacing: var(--e-ls-caps-s);
	text-transform: uppercase;
	opacity: 0.55;
}

.e-copay__box div#tamiCreditCardFormApp div.tami-card-form div.tami-card-list .tami-card-item__name,
.e-copay__box div#tamiCreditCardFormApp div.tami-card-form div.tami-card-list .tami-card-item__date {
	font-size: var(--e-fs-sm);
	font-weight: var(--e-w-normal);
	letter-spacing: 0.04em;
}

/* The rectangle that tracks the focused field. */
.e-copay__box div#tamiCreditCardFormApp div.tami-card-form div.tami-card-list .tami-card-item__focus {
	border-radius: 3px;
	box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.5);
}

.e-copay__box div#tamiCreditCardFormApp div.tami-card-form div.tami-card-list .tami-card-item__focus::after {
	background: rgba(255, 255, 255, 0.1);
}

/* --------------------------------------------------------------------------
   Fields
   -------------------------------------------------------------------------- */
.e-copay__box div#tamiCreditCardFormApp .tami-card-input { position: relative; margin-bottom: var(--e-s4); }

.e-copay__box div#tamiCreditCardFormApp .tami-card-input__label {
	display: block;
	margin-bottom: 7px;
	font-size: var(--e-fs-sm);
	font-weight: var(--e-w-medium);
	color: var(--e-ink);
	text-transform: none;
	letter-spacing: 0;
}

.e-copay__box div#tamiCreditCardFormApp .tami-card-input__input {
	width: 100%;
	height: 52px;
	padding: 0 15px;
	border: 1px solid var(--e-line-2);
	border-radius: 0;
	background: var(--e-surface);
	box-shadow: none;
	color: var(--e-ink);
	font-family: var(--e-font-text);
	font-size: 16px; /* iOS zooms the page below 16px */
	font-variant-numeric: tabular-nums;
	transition: border-color var(--e-dur-1) var(--e-ease), box-shadow var(--e-dur-1) var(--e-ease);
}

.e-copay__box div#tamiCreditCardFormApp .tami-card-input__input:hover { border-color: var(--e-muted-2); }

.e-copay__box div#tamiCreditCardFormApp .tami-card-input__input:focus {
	outline: 0;
	border-color: var(--e-ink);
	box-shadow: inset 0 0 0 1px var(--e-ink);
}

.e-copay__box div#tamiCreditCardFormApp .tami-card-input__input.-select {
	appearance: none;
	text-align: left;
	line-height: normal;
	padding-left: 15px;
	padding-right: 34px;
	background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%236c6f78' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><path d='m6 9 6 6 6-6'/></svg>");
	background-repeat: no-repeat;
	background-position: right 11px center;
	background-size: 15px;
}

/* Expiry pair + CVV.
   Month, year and CVV hold two to four characters each; stretched to a third
   of the column they read as if a long value were expected. They are capped
   and pinned to the start of the row instead, and every cell in the row uses
   the same label height so the three inputs sit on one baseline. */
.e-copay__box div#tamiCreditCardFormApp .tami-card-form__row {
	display: grid;
	grid-template-columns: minmax(0, 240px) minmax(0, 104px);
	justify-content: start;
	gap: var(--e-s4);
	align-items: start;
}

.e-copay__box div#tamiCreditCardFormApp .tami-card-form__col,
.e-copay__box div#tamiCreditCardFormApp .tami-card-form__col.-cvv {
	margin: 0;
	max-width: none;
	width: auto;
	flex: none;
}

/* The expiry column nests .tami-card-form__group, the CVV column nests
   .tami-card-input — normalise both so neither adds its own offset. */
.e-copay__box div#tamiCreditCardFormApp .tami-card-form__row .tami-card-input { margin-bottom: 0; }

.e-copay__box div#tamiCreditCardFormApp .tami-card-form__row .tami-card-input__label {
	min-height: 22px;
	margin-bottom: 7px;
	white-space: nowrap;
}

.e-copay__box div#tamiCreditCardFormApp .tami-card-form__group {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	/* No row gap: the label already carries its own margin, and a second gap
	   here pushed the month/year selects below the CVV box beside them. */
	column-gap: var(--e-s3);
	row-gap: 0;
}

.e-copay__box div#tamiCreditCardFormApp .tami-card-form__group .tami-card-input__label { grid-column: 1 / -1; }
.e-copay__box div#tamiCreditCardFormApp .tami-card-form__group .tami-card-input__input { margin: 0; }
.e-copay__box div#tamiCreditCardFormApp #v-card-cvv { text-align: center; letter-spacing: 0.12em; }

/* Reveal toggle. The gateway draws it as a 0.8em ring with a dot inside — the
   large empty circle sitting in the card-number field. It is replaced with the
   storefront's eye icon and given a real tap target. */
.e-copay__box div#tamiCreditCardFormApp button.tami-card-input__eye,
.e-copay__box div#tamiCreditCardFormApp .tami-card-input__eye {
	position: absolute;
	right: 0;
	bottom: 0;
	display: flex;
	width: 48px !important;
	height: 52px !important;
	min-width: 0 !important;
	min-height: 0 !important;
	margin: 0;
	padding: 0 !important;
	border: 0 !important;
	border-radius: 0 !important;
	background: none !important;
	box-shadow: none !important;
	opacity: 1;
	color: var(--e-muted);
	font-size: 0;
	cursor: pointer;
}

/* Their pupil. */
.e-copay__box div#tamiCreditCardFormApp .tami-card-input__eye::after {
	content: "";
	position: absolute;
	inset: 50% auto auto 50%;
	top: 50%;
	left: 50%;
	width: 18px;
	height: 18px;
	transform: translate(-50%, -50%) scale(1);
	opacity: 1;
	border-radius: 0;
	background: currentColor;
	/* Lucide "eye" (ISC), as a mask so it follows `color`. */
	-webkit-mask: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><path d='M2.06 12.35a1 1 0 0 1 0-.7 10.75 10.75 0 0 1 19.88 0 1 1 0 0 1 0 .7 10.75 10.75 0 0 1-19.88 0'/><circle cx='12' cy='12' r='3'/></svg>") center / contain no-repeat;
	mask: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><path d='M2.06 12.35a1 1 0 0 1 0-.7 10.75 10.75 0 0 1 19.88 0 1 1 0 0 1 0 .7 10.75 10.75 0 0 1-19.88 0'/><circle cx='12' cy='12' r='3'/></svg>") center / contain no-repeat;
}

.e-copay__box div#tamiCreditCardFormApp .tami-card-input__eye:hover:not(:disabled) { color: var(--e-ink); }
.e-copay__box div#tamiCreditCardFormApp .tami-card-input__eye.-active:not(:disabled) { color: var(--e-red); }
.e-copay__box div#tamiCreditCardFormApp .tami-card-input__eye:disabled { opacity: 0.4; cursor: not-allowed; }

.e-copay__box div#tamiCreditCardFormApp .tami-card-input__eye:focus-visible {
	outline: 2px solid var(--e-focus);
	outline-offset: -2px;
}

.e-copay__box div#tamiCreditCardFormApp #v-card-number { padding-right: 48px; }

/* Instalment table, when the gateway returns one for the entered BIN. */
.e-copay__box div#tamiCreditCardFormApp .tami-card-form--installment-lines table {
	width: 100%;
	border-collapse: collapse;
	font-size: var(--e-fs-sm);
	margin-top: var(--e-s4);
}

.e-copay__box div#tamiCreditCardFormApp .tami-card-form--installment-lines thead td,
.e-copay__box div#tamiCreditCardFormApp .tami-card-form--installment-lines thead th {
	padding: 9px 8px;
	border-bottom: 1px solid var(--e-line);
	color: var(--e-muted);
	font-size: var(--e-fs-2xs);
	letter-spacing: var(--e-ls-caps-s);
	text-transform: uppercase;
	font-weight: var(--e-w-normal);
}

.e-copay__box div#tamiCreditCardFormApp .tami-card-form--installment-lines tbody td,
.e-copay__box div#tamiCreditCardFormApp .tami-card-form--installment-lines tbody th {
	padding: 11px 8px;
	border-bottom: 1px solid var(--e-line);
	color: var(--e-ink-2);
	font-weight: var(--e-w-normal);
}

.e-copay__box div#tamiCreditCardFormApp .tami-card-form--installment-lines tbody tr:hover td { background: var(--e-surface-2); }
.e-copay__box div#tamiCreditCardFormApp .tami-card-form--installment-lines label { display: flex; align-items: center; gap: 9px; min-height: 40px; }

/* --------------------------------------------------------------------------
   Touch
   -------------------------------------------------------------------------- */
@media (max-width: 859px) {
	.e-copay__box div#tamiCreditCardFormApp div.tami-card-form div.tami-card-list .tami-card-item { max-width: 360px; }
}

@media (max-width: 480px) {
	.e-copay__box div#tamiCreditCardFormApp .tami-card-form__inner { padding: 0; }
	.e-copay__box div#tamiCreditCardFormApp div.tami-card-form div.tami-card-list .tami-card-item { max-width: 100%; }

	/* The gateway wraps this row and drops the CVV to full width; keep the pair
	   side by side — expiry and CVV are short and belong together. */
	.e-copay__box div#tamiCreditCardFormApp .tami-card-form__row {
		grid-template-columns: minmax(0, 1fr) minmax(0, 96px);
		gap: var(--e-s3);
	}

	.e-copay__box div#tamiCreditCardFormApp .tami-card-form__col,
	.e-copay__box div#tamiCreditCardFormApp .tami-card-form__col.-cvv { margin-bottom: 0; width: auto; }
}

/* --------------------------------------------------------------------------
   Terms and conditions: shown, not hidden behind a link.

   WooCommerce prints the contract in a div with an inline `display:none` and a
   "read the terms" toggle. Distance-selling rules expect the text to be
   presented before the order is placed, so it stays open in a scrollable box
   and the toggle goes away. The inline style is why these need !important.
   -------------------------------------------------------------------------- */
.woocommerce-terms-and-conditions {
	display: block !important;
	max-height: 220px !important;
	overflow-y: auto !important;
	margin: 0 0 var(--e-s4);
	padding: var(--e-s5);
	border: 1px solid var(--e-line);
	background: var(--e-surface-2);
	font-size: var(--e-fs-sm);
	line-height: 1.6;
	color: var(--e-ink-2);
	overscroll-behavior: contain;
}

.woocommerce-terms-and-conditions > *:first-child { margin-top: 0; }
.woocommerce-terms-and-conditions > *:last-child { margin-bottom: 0; }

.woocommerce-terms-and-conditions h2,
.woocommerce-terms-and-conditions h3,
.woocommerce-terms-and-conditions h4 {
	font-size: var(--e-fs-sm);
	font-weight: var(--e-w-medium);
	color: var(--e-ink);
	margin: var(--e-s4) 0 var(--e-s2);
}

.woocommerce-terms-and-conditions p { margin: 0 0 var(--e-s3); }

/* Agreement links remain visible beside the native required checkbox. */

/* Layer: 15-account.css */
/* ==========================================================================
   ERPIN DESIGN SYSTEM — 15 ACCOUNT
   Login and registration. The signed-in dashboard lives in 10-commerce.css.
   ========================================================================== */

.erpin-auth .woocommerce { display: block; }

.e-auth {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 1px;
	background: var(--e-line);
	border: 1px solid var(--e-line);
	max-width: 1040px;
	margin-inline: auto;
}

.e-auth--single { grid-template-columns: minmax(0, 1fr); max-width: 520px; }
.e-auth--register { max-width: 780px; }

.e-auth__panel {
	background: var(--e-surface);
	padding: clamp(24px, 3.5vw, 48px);
	min-width: 0;
}

.e-auth__head { margin-bottom: var(--e-s6); }

.e-auth__title {
	font-family: var(--e-font-display);
	font-size: var(--e-d3);
	font-weight: var(--e-w-display);
	letter-spacing: var(--e-ls-display);
	color: var(--e-ink);
}

.e-auth__hint {
	margin-top: var(--e-s3);
	font-size: var(--e-fs-sm);
	color: var(--e-muted);
	line-height: 1.6;
	max-width: 42ch;
}

/* --------------------------------------------------------------------------
   Fields
   -------------------------------------------------------------------------- */
.e-auth__form .form-row { margin: 0 0 var(--e-s5); padding: 0; }

.e-auth__form label {
	display: block;
	margin-bottom: 7px;
	font-size: var(--e-fs-sm);
	font-weight: var(--e-w-medium);
	color: var(--e-ink);
}

.e-auth__form .required { color: var(--e-red); text-decoration: none; border: 0; }

.e-auth__form input[type="text"],
.e-auth__form input[type="email"],
.e-auth__form input[type="tel"],
.e-auth__form input[type="number"],
.e-auth__form input[type="password"],
.e-auth__form select { width: 100%; }

.e-auth__note { font-size: var(--e-fs-sm); color: var(--e-muted); margin-bottom: var(--e-s5); }

.e-auth__formgrid {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 0 var(--e-s4);
}

.e-auth__field--wide { grid-column: 1 / -1; }

.e-auth__form small {
	display: block;
	margin-top: 7px;
	font-size: var(--e-fs-xs);
	font-weight: var(--e-w-normal);
	line-height: 1.5;
	color: var(--e-muted);
}

.e-auth__phone-row {
	display: grid;
	grid-template-columns: minmax(0, 1fr) auto;
	gap: var(--e-s2);
}

.e-auth__phone-row .e-btn {
	min-width: 132px;
	padding-inline: var(--e-s4);
}

.e-auth__status.is-loading { color: var(--e-ink-2); }
.e-auth__status.is-success { color: var(--e-success); }
.e-auth__status.is-error { color: var(--e-red); }

.e-auth__legal {
	align-items: flex-start !important;
	margin: var(--e-s3) 0 !important;
	min-height: 0 !important;
}

.e-auth__legal input { margin-top: 3px !important; }
.e-auth__legal a { color: var(--e-ink); text-decoration: underline; text-underline-offset: 3px; }

.e-auth__back {
	margin-top: var(--e-s6);
	padding-top: var(--e-s5);
	border-top: 1px solid var(--e-line);
	font-size: var(--e-fs-sm);
	color: var(--e-muted);
	text-align: center;
}

.e-auth__back a { color: var(--e-ink); text-decoration: underline; text-underline-offset: 3px; }

.e-auth__register-cta {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: var(--e-s5);
	padding: var(--e-s5) clamp(24px, 3.5vw, 48px);
	background: var(--e-surface-2);
	font-size: var(--e-fs-sm);
	line-height: 1.55;
	color: var(--e-muted);
}

.e-auth__register-cta strong { color: var(--e-ink); }
.e-auth__register-cta .e-btn { flex: none; min-height: 46px; }

/* Social registration uses the provider's OAuth transport with owned markup. */
.e-auth__social .the_champ_login_container {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: var(--e-s3);
}

.e-social-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 11px;
	min-height: 52px;
	padding: 0 var(--e-s4);
	border: 1px solid var(--e-line-2);
	background: var(--e-surface);
	color: var(--e-ink);
	font-size: var(--e-fs-sm);
	font-weight: var(--e-w-medium);
	cursor: pointer;
	transition: border-color var(--e-dur-2) var(--e-ease), background var(--e-dur-2) var(--e-ease);
}

.e-social-btn:hover { border-color: var(--e-ink); background: var(--e-surface-2); }
.e-social-btn svg { width: 21px; height: 21px; flex: none; }

.e-auth__divider {
	display: flex;
	align-items: center;
	gap: var(--e-s4);
	margin: var(--e-s5) 0;
	font-size: 11px;
	letter-spacing: var(--e-ls-caps-s);
	text-transform: uppercase;
	color: var(--e-muted-2);
}

.e-auth__divider::before,
.e-auth__divider::after { content: ""; height: 1px; background: var(--e-line); flex: 1; }

/* Remember me + lost password on one line */
.e-auth__row {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: var(--e-s4);
	flex-wrap: wrap;
}

.e-auth__form .e-check,
.e-auth__form .woocommerce-form__label-for-checkbox {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	min-height: 44px;
	margin: 0;
	font-size: var(--e-fs-sm);
	font-weight: var(--e-w-normal);
	color: var(--e-ink-2);
	cursor: pointer;
	line-height: 1.5;
}

.e-auth__form .woocommerce-form__label-for-checkbox input { flex: none; margin: 0; }

.e-auth__link {
	display: inline-flex;
	align-items: center;
	min-height: 44px;
	font-size: var(--e-fs-sm);
	color: var(--e-muted);
	text-decoration: underline;
	text-underline-offset: 3px;
}

.e-auth__link:hover { color: var(--e-red); }

.e-auth__submit { margin: var(--e-s5) 0 0; }
.e-auth__submit .e-btn { min-height: 54px; }

/* --------------------------------------------------------------------------
   Plugin-added registration fields
   The SMS verification plugin injects a "send code" button and a consent
   checkbox whose label carries markup; both arrive unstyled.
   -------------------------------------------------------------------------- */
.e-auth__form button:not(.e-btn):not(.show-password-input) {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 44px;
	margin-top: var(--e-s2);
	padding: 0 var(--e-s5);
	border: 1px solid var(--e-line-2);
	background: var(--e-surface-2);
	color: var(--e-ink);
	font-size: var(--e-fs-sm);
	font-weight: var(--e-w-medium);
	cursor: pointer;
}

.e-auth__form button:not(.e-btn):not(.show-password-input):hover { border-color: var(--e-ink); }

/* WooCommerce's reveal toggle belongs inside the password field, not under it. */
.e-auth__form .woocommerce-password-input,
.e-auth__form .password-input { position: relative; display: block; }

.e-auth__form .show-password-input {
	position: absolute;
	top: 0;
	right: 0;
	width: 46px;
	height: 100%;
	min-height: 0;
	margin: 0;
	padding: 0;
	border: 0;
	background: none;
	cursor: pointer;
	color: var(--e-muted);
}

.e-auth__form .show-password-input::after {
	content: "";
	position: absolute;
	inset: 50% auto auto 50%;
	width: 17px;
	height: 17px;
	transform: translate(-50%, -50%);
	background: currentColor;
	/* Lucide "eye" (ISC), inlined as a mask so it follows `color`. */
	-webkit-mask: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="black" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M2.06 12.35a1 1 0 0 1 0-.7 10.75 10.75 0 0 1 19.88 0 1 1 0 0 1 0 .7 10.75 10.75 0 0 1-19.88 0"/><circle cx="12" cy="12" r="3"/></svg>') center / contain no-repeat;
	mask: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="none" stroke="black" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M2.06 12.35a1 1 0 0 1 0-.7 10.75 10.75 0 0 1 19.88 0 1 1 0 0 1 0 .7 10.75 10.75 0 0 1-19.88 0"/><circle cx="12" cy="12" r="3"/></svg>') center / contain no-repeat;
}

.e-auth__form .show-password-input:hover { color: var(--e-ink); }
.e-auth__form .show-password-input.display-password { color: var(--e-red); }
.e-auth__form input#password,
.e-auth__form input#reg_password { padding-right: 46px; }

.e-auth__consent-link { margin: 6px 0 var(--e-s4); }

.e-auth__consent-link a {
	display: inline-flex;
	align-items: center;
	min-height: 40px;
	font-size: var(--e-fs-sm);
	color: var(--e-muted);
	text-decoration: underline;
	text-underline-offset: 3px;
}

.e-auth__consent-link a:hover { color: var(--e-red); }

.e-auth__form .woocommerce-privacy-policy-text,
.e-auth__form .woocommerce-privacy-policy-text p {
	font-size: var(--e-fs-sm);
	color: var(--e-muted);
	line-height: 1.6;
	margin: 0 0 var(--e-s4);
}

/* --------------------------------------------------------------------------
   Social login (Super Socializer) on the account page
   -------------------------------------------------------------------------- */
.erpin-auth .the_champ_outer_login_container {
	max-width: 1040px;
	margin: 0 auto var(--e-s6);
	padding: var(--e-s5);
	border: 1px solid var(--e-line);
	background: var(--e-surface-2);
}

/* --------------------------------------------------------------------------
   Notices above the forms
   -------------------------------------------------------------------------- */
.erpin-auth .woocommerce-notices-wrapper { max-width: 1040px; margin-inline: auto; }

/* --------------------------------------------------------------------------
   Touch
   -------------------------------------------------------------------------- */
@media (max-width: 860px) {
	.e-auth { grid-template-columns: minmax(0, 1fr); max-width: 560px; }
}

@media (max-width: 560px) {
	.e-auth__row { flex-direction: column; align-items: flex-start; gap: 0; }
	.e-auth__formgrid { grid-template-columns: minmax(0, 1fr); }
	.e-auth__field--wide { grid-column: auto; }
	.e-auth__phone-row { grid-template-columns: minmax(0, 1fr); }
	.e-auth__phone-row .e-btn { width: 100%; }
	.e-auth__social .the_champ_login_container { grid-template-columns: minmax(0, 1fr); }
	.e-auth__register-cta { align-items: stretch; flex-direction: column; }
	.e-auth__register-cta .e-btn { width: 100%; }
}

/* ==========================================================================
   Signed-in dashboard headings
   (the layout grid itself lives in 10-commerce.css)
   ========================================================================== */
.e-account__heading { margin-bottom: var(--e-s6); }

.e-account__title {
	font-family: var(--e-font-display);
	font-size: var(--e-d3);
	font-weight: var(--e-w-display);
	letter-spacing: var(--e-ls-display);
	color: var(--e-ink);
}

.e-account__lede {
	margin-top: var(--e-s3);
	font-size: var(--e-fs-sm);
	color: var(--e-muted);
	max-width: 58ch;
}

/* Vendor leftovers: the avatar block and its wrapper are unhooked in PHP, but
   a cached page or a plugin re-adding them must not break the grid again. */
.MyAccount-navigation-wrapper { display: contents; }
.woocommerce-MyAccount-navigation .pls-user-profile { display: none; }

.woocommerce-MyAccount-content .section-title { margin-bottom: var(--e-s6); }
.woocommerce-MyAccount-content .section-title h2 {
	font-family: var(--e-font-display);
	font-size: var(--e-d3);
	font-weight: var(--e-w-display);
	letter-spacing: var(--e-ls-display);
}
.woocommerce-MyAccount-content .section-title p { margin-top: var(--e-s3); font-size: var(--e-fs-sm); color: var(--e-muted); }

/* Address cards */
.woocommerce-Addresses {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: var(--e-s5);
}

.woocommerce-Address {
	border: 1px solid var(--e-line);
	background: var(--e-surface);
	padding: var(--e-s6);
}

.woocommerce-Address-title {
	display: flex;
	align-items: baseline;
	justify-content: space-between;
	gap: var(--e-s4);
	padding-bottom: var(--e-s4);
	margin-bottom: var(--e-s4);
	border-bottom: 1px solid var(--e-line);
}

.woocommerce-Address-title h2,
.woocommerce-Address-title h3 { font-size: var(--e-fs-base); font-weight: var(--e-w-medium); }

.woocommerce-Address-title .edit {
	font-size: var(--e-fs-sm);
	color: var(--e-muted);
	text-decoration: underline;
	text-underline-offset: 3px;
	white-space: nowrap;
}

.woocommerce-Address-title .edit:hover { color: var(--e-red); }
.woocommerce-Address address { font-style: normal; font-size: var(--e-fs-sm); color: var(--e-ink-2); line-height: 1.7; }

/* Edit-address / edit-account forms */
.woocommerce-MyAccount-content form .woocommerce-address-fields__field-wrapper,
.woocommerce-EditAccountForm {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: var(--e-s5) var(--e-s4);
	max-width: 760px;
}

.woocommerce-MyAccount-content form .form-row { margin: 0; padding: 0; min-width: 0; width: auto; }
.woocommerce-MyAccount-content form .form-row-wide,
.woocommerce-MyAccount-content form fieldset,
.woocommerce-MyAccount-content form p:not(.form-row),
.woocommerce-MyAccount-content form .clear { grid-column: 1 / -1; }

.woocommerce-MyAccount-content form label {
	display: block;
	margin-bottom: 7px;
	font-size: var(--e-fs-sm);
	font-weight: var(--e-w-medium);
	color: var(--e-ink);
}

.woocommerce-MyAccount-content form .input-text,
.woocommerce-MyAccount-content form select { width: 100%; }

.woocommerce-EditAccountForm fieldset {
	border: 1px solid var(--e-line);
	padding: var(--e-s5);
	margin: var(--e-s4) 0 0;
}

.woocommerce-EditAccountForm legend {
	padding: 0 var(--e-s3);
	font-size: var(--e-fs-sm);
	font-weight: var(--e-w-medium);
	color: var(--e-ink);
}

@media (max-width: 860px) {
	.woocommerce-Addresses,
	.woocommerce-MyAccount-content form .woocommerce-address-fields__field-wrapper,
	.woocommerce-EditAccountForm { grid-template-columns: minmax(0, 1fr); }
}

/* Layer: 16-live-product-compat.css */
/* Live snippet renderers remain active. These scoped visual overrides do not
   expose hidden options, replace controls, change form values or hide prices. */
/* Keep the existing support widget below an open drawer's interaction layer.
   Closing the drawer restores the widget without changing its own state. */
html.is-panel-open body.erpin #wa,
html.is-panel-open body.erpin .wa__popup_chat_box,
html.is-panel-open body.erpin .wa__btn_popup {
	visibility: hidden !important;
	pointer-events: none !important;
}
body.erpin.single-product div.product .e-pdp__gallery .images,
body.erpin.single-product div.product .e-pdp__summary .summary {
	width: 100% !important;
	max-width: none !important;
	float: none !important;
	margin: 0 !important;
}
body.erpin.single-product div.product .e-pdp__summary h1.product_title {
	font-family: var(--e-font-display) !important;
	font-size: var(--e-d3) !important;
	font-weight: var(--e-w-display) !important;
	letter-spacing: var(--e-ls-display) !important;
	line-height: 1.12 !important;
	color: var(--e-ink) !important;
	margin: 0 0 var(--e-s5) !important;
}
body.erpin.single-product div.product .e-pdp__summary p.price,
body.erpin.single-product div.product .e-pdp__summary p.price span,
body.erpin.single-product div.product .e-pdp__summary p.price ins,
body.erpin.single-product div.product .e-pdp__summary p.price bdi {
	font-size: var(--e-d4) !important;
	font-weight: var(--e-w-medium) !important;
	color: var(--e-ink) !important;
}
body.erpin.single-product div.product .e-pdp__summary p.price {
	line-height: 1.1 !important;
	margin-bottom: var(--e-s5) !important;
}
body.erpin.single-product div.product .e-pdp__summary p.price ins,
body.erpin.single-product div.product .e-pdp__summary p.price ins span,
body.erpin.single-product div.product .e-pdp__summary p.price ins bdi {
	color: var(--e-red) !important;
}
body.erpin.single-product div.product .e-pdp__summary p.price del,
body.erpin.single-product div.product .e-pdp__summary p.price del span,
body.erpin.single-product div.product .e-pdp__summary p.price del bdi {
	font-size: var(--e-fs-lg) !important;
	font-weight: var(--e-w-normal) !important;
	color: var(--e-muted-2) !important;
}
body.erpin.single-product .e-pdp__summary .im-fiyat-grid-wrapper {
	display: grid !important;
	grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
	gap: 12px !important;
	margin: 4px 0 var(--e-s6) !important;
}
body.erpin.single-product .e-pdp__summary .im-havale-box,
body.erpin.single-product .e-pdp__summary .im-taksit-box {
	min-height: 78px !important;
	padding: 15px 17px !important;
	gap: 14px !important;
	justify-content: flex-start !important;
	border: 1px solid var(--e-line) !important;
	border-radius: 0 !important;
	background: var(--e-surface-2) !important;
	color: var(--e-ink) !important;
	font-size: var(--e-fs-sm) !important;
}
body.erpin.single-product .e-pdp__summary .im-havale-yazi,
body.erpin.single-product .e-pdp__summary .im-taksit-yazi {
	font-size: 12px !important;
	font-weight: var(--e-w-medium) !important;
	letter-spacing: .03em !important;
	color: var(--e-muted) !important;
	text-align: left !important;
}
body.erpin.single-product .e-pdp__summary .im-havale-rakam,
body.erpin.single-product .e-pdp__summary .im-taksit-rakam {
	color: var(--e-ink) !important;
	font-weight: var(--e-w-medium) !important;
	font-size: clamp(18px, 1.55vw, 22px) !important;
	line-height: 1.1 !important;
	letter-spacing: -.015em !important;
	font-variant-numeric: tabular-nums;
}
/* The labelled payment text is retained; only the rotating decorative logo
   gives way to the same monochrome mark used in the approved design. */
body.erpin.single-product .im-payment-marked > .im-gif-alani {
	display: none !important;
}
body.erpin.single-product .e-pdp__summary .im-teknik-kart {
	padding: 0 !important;
	border: 1px solid var(--e-line) !important;
	border-radius: 0 !important;
	box-shadow: none !important;
	gap: 1px !important;
	background: var(--e-line) !important;
	margin-bottom: var(--e-s6) !important;
}
body.erpin.single-product .e-pdp__summary .im-teknik-satir {
	min-height: 62px !important;
	padding: 14px 16px !important;
	background: var(--e-surface) !important;
	border-radius: 0 !important;
	transform: none !important;
}
body.erpin.single-product .e-pdp__summary .im-baslik,
body.erpin.single-product .e-pdp__summary .im-deger {
	font-family: var(--e-font-text) !important;
	font-weight: var(--e-w-medium) !important;
	font-size: var(--e-fs-sm) !important;
}
body.erpin.single-product .e-pdp__summary .im-baslik {
	font-size: 11px !important;
	font-weight: var(--e-w-normal) !important;
	letter-spacing: var(--e-ls-caps) !important;
	color: var(--e-muted) !important;
}
body.erpin.single-product .e-pdp__summary .im-deger {
	margin-top: 3px !important;
	color: var(--e-ink) !important;
}
body.erpin.single-product .e-pdp__summary .im-ikon-kutu {
	width: 22px !important;
	height: 22px !important;
	min-width: 22px !important;
	flex: 0 0 22px !important;
	background: transparent !important;
	border-radius: 0 !important;
	border: 0 !important;
	box-shadow: none !important;
	transform: none !important;
	color: var(--e-muted) !important;
}
body.erpin.single-product .e-pdp__summary .im-ikon-kutu::before {
	content: none !important;
}
body.erpin.single-product .e-pdp__summary .im-ikon-kutu svg {
	filter: none !important;
}
body.erpin.single-product .e-pdp__summary .im-stok-satir {
	align-items: flex-start !important;
	gap: 11px !important;
	padding: 14px 16px !important;
	margin-top: 0 !important;
	border: 0 !important;
	border-radius: 0 !important;
	font-size: var(--e-fs-sm) !important;
	font-weight: var(--e-w-normal) !important;
	line-height: 1.5 !important;
}
body.erpin.single-product .e-pdp__summary .im-stok-var {
	background: var(--e-success-bg) !important;
	color: #1c4f36 !important;
}
body.erpin.single-product .e-pdp__summary .im-stok-yok {
	background: var(--e-warning-bg) !important;
	color: #6b4610 !important;
}
body.erpin.single-product .e-pdp__summary .im-stok-sure {
	font-weight: var(--e-w-medium) !important;
}
body.erpin.single-product .e-pdp__summary .im-stok-not {
	font-size: var(--e-fs-2xs) !important;
	font-style: normal !important;
	color: inherit !important;
	opacity: .85;
}
body.erpin.single-product .e-pdp__summary .woocommerce-product-details__short-description {
	margin-bottom: var(--e-s6) !important;
}
body.erpin.single-product .e-pdp__summary .woocommerce-product-details__short-description a[href*="instagram"] {
	display: inline-flex !important;
	align-items: center !important;
	gap: 9px !important;
	justify-content: flex-start !important;
	min-height: 40px !important;
	width: auto !important;
	padding: 0 0 2px !important;
	background: transparent !important;
	border: 0 !important;
	border-bottom: 1px solid var(--e-line-2) !important;
	border-radius: 0 !important;
	font-size: var(--e-fs-sm) !important;
	font-weight: var(--e-w-normal) !important;
	color: var(--e-ink) !important;
	box-shadow: none !important;
	transform: none !important;
}
body.erpin.single-product .e-pdp__summary .woocommerce-product-details__short-description a[href*="instagram"]::before {
	content: none !important;
	display: none !important;
}
body.erpin.single-product .e-pdp__summary a.e-instagram-link > .e-instagram-link__icon {
	display: block !important;
	position: static !important;
	flex: 0 0 22px !important;
	width: 22px !important;
	height: 22px !important;
	max-width: none !important;
	padding: 1px;
	margin: 0 !important;
	fill: currentColor !important;
	stroke: none !important;
	overflow: visible !important;
	transform: none !important;
}
body.erpin.single-product .e-pdp__summary .woocommerce-product-details__short-description a[href*="instagram"]:hover {
	color: var(--e-red) !important;
	border-bottom-color: var(--e-red) !important;
}
body.erpin.single-product .has-spec-help .im-metin-kutu { position: relative; flex: 1; min-width: 0; padding-inline-end: 36px; }
body.erpin.single-product .e-spec-hint__button {
	position: absolute;
	inset-block-start: -6px;
	inset-inline-end: -4px;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 44px;
	height: 44px;
	padding: 0;
	margin: 0;
	list-style: none;
	border: 0;
	border-radius: 50%;
	background: transparent;
	color: var(--e-muted);
	cursor: pointer;
}
body.erpin.single-product .e-spec-hint__mark { display: block; width: 17px; height: 17px; border: 1px solid currentColor; border-radius: 50%; font: 500 12px/15px var(--e-font-text); text-align: center; }
body.erpin.single-product .e-spec-hint__button:hover,
body.erpin.single-product .e-spec-hint__button[aria-expanded="true"] { color: var(--e-red); background: var(--e-surface-2); }
body.erpin.single-product .e-spec-hint__button:focus-visible { outline: 2px solid var(--e-red); outline-offset: 1px; }
html.e-spec-dialog-open { overflow: hidden; padding-inline-end: var(--e-spec-scrollbar, 0px); }
body.erpin .e-spec-dialog { position: fixed; inset: 0; width: min(520px, calc(100% - 40px)); max-width: none; max-height: calc(100dvh - 48px); margin: auto; padding: 40px; border: 1px solid var(--e-line); background: #fff; color: var(--e-ink); box-shadow: 0 24px 80px rgba(0,0,0,.18); overflow-y: auto; overscroll-behavior: contain; }
body.erpin .e-spec-dialog:not([open]) { display: none; }
body.erpin .e-spec-dialog::backdrop { background: rgba(18,18,20,.38); backdrop-filter: blur(3px); }
body.erpin .e-spec-dialog__close { position: absolute; inset-block-start: 12px; inset-inline-end: 12px; display: grid; place-items: center; width: 44px; height: 44px; padding: 0; border: 0; border-radius: 50%; color: var(--e-ink); background: var(--e-surface-2); font: 300 28px/1 var(--e-font-text); cursor: pointer; }
body.erpin .e-spec-dialog__close:focus-visible { outline: 2px solid var(--e-red); outline-offset: 2px; }
body.erpin .e-spec-dialog h2 { margin: 12px 24px 20px 0; font: var(--e-w-display) 30px/1.2 var(--e-font-display); letter-spacing: -.02em; }
body.erpin .e-spec-dialog__description { margin: 0; color: var(--e-ink-2); font-size: 16px; line-height: 1.75; }
body.erpin .e-spec-dialog__value { margin: 24px 0 0; padding: 18px 20px; background: var(--e-surface-2); border-inline-start: 2px solid var(--e-red); }
body.erpin .e-spec-dialog__value small { display: block; margin-bottom: 6px; color: var(--e-muted); font-size: 12px; }
body.erpin .e-spec-dialog__value strong { display: block; font-size: 18px; font-weight: 500; }
@media (max-width: 767px) {
	body.erpin .e-spec-dialog { inset: auto 0 0; width: 100%; max-height: calc(100dvh - 24px); margin: 0; padding: 36px 24px max(28px, env(safe-area-inset-bottom)); border-radius: 18px 18px 0 0; border: 0; }
	body.erpin .e-spec-dialog::before { content: ""; position: absolute; width: 36px; height: 3px; inset-block-start: 10px; inset-inline-start: calc(50% - 18px); background: var(--e-line-2); border-radius: 2px; }
	body.erpin .e-spec-dialog h2 { font-size: 27px; margin-inline-end: 24px; }
}
@media (prefers-reduced-motion: reduce) { .e-cats__track span { transition: none; } }
/* Honor outlined legacy product icons without changing filled brand marks. */
body.erpin.single-product .im-ikon-kutu svg[fill="none"],
body.erpin.single-product .im-stok-satir svg[fill="none"] {
	fill: none !important;
}
body.erpin.single-product .e-pdp__summary form.cart > .single_add_to_cart_button,
body.erpin.single-product .e-pdp__summary form.cart .woocommerce-variation-add-to-cart {
	grid-column: 1 / -1;
}
body.erpin.single-product .e-pdp__summary form.cart .single_add_to_cart_button {
	border-radius: 0 !important;
	font-family: var(--e-font-text) !important;
	font-weight: 500 !important;
	background: var(--e-red) !important;
	box-shadow: none !important;
}
body.erpin.single-product .e-pdp__summary .im-yuzuk-olcu-btn,
body.erpin.single-product .e-pdp__summary .im-ozellestir-btn {
	background: transparent !important;
	border: 1px solid var(--e-line) !important;
	border-radius: 0 !important;
	color: var(--e-ink) !important;
	font-family: var(--e-font-text) !important;
	font-size: var(--e-fs-sm) !important;
	font-weight: 400 !important;
	box-shadow: none !important;
	min-height: 52px !important;
	height: auto !important;
	padding: 12px 16px !important;
}
body.erpin.single-product .e-pdp__summary .im-kisisel-grid {
	grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
	gap: var(--e-s3) !important;
	margin: 0 0 var(--e-s6) !important;
}
body.erpin .im-popup-box,
body.erpin .im-popup-header,
body.erpin .im-popup-footer {
	border-radius: 0 !important;
	font-family: var(--e-font-text) !important;
}
body.erpin .im-popup-header {
	background: #fff !important;
	color: var(--e-ink) !important;
	border-bottom: 1px solid var(--e-line) !important;
	padding: var(--e-s5) var(--e-s6) !important;
}
body.erpin .im-popup-title,
body.erpin .im-popup-close {
	color: var(--e-ink) !important;
}
body.erpin .im-popup-overlay {
	align-items: center !important;
	padding: var(--e-s5) !important;
	background: rgba(12, 10, 8, .58) !important;
	backdrop-filter: none !important;
}
body.erpin .im-popup-overlay .im-popup-box {
	width: min(680px, 100%) !important;
	max-width: 680px !important;
	max-height: min(88vh, 860px) !important;
	transform: translateY(12px) !important;
}
body.erpin .im-popup-overlay.active .im-popup-box { transform: none !important; }
body.erpin .im-popup-title {
	font-family: var(--e-font-display) !important;
	font-size: var(--e-fs-xl) !important;
	font-weight: var(--e-w-display) !important;
	gap: 12px !important;
}
body.erpin .im-popup-title > svg {
	width: 24px !important;
	height: 24px !important;
	stroke: currentColor !important;
	color: var(--e-red) !important;
}
body.erpin .im-popup-close {
	width: 44px !important;
	height: 44px !important;
	font-size: 22px !important;
	color: var(--e-muted) !important;
	background: transparent !important;
}
body.erpin .im-popup-content { padding: var(--e-s6) !important; }
body.erpin .im-popup-footer {
	padding: var(--e-s5) var(--e-s6) !important;
	background: var(--e-surface) !important;
	border-top: 1px solid var(--e-line) !important;
}
body.erpin .im-ozellestir-select,
body.erpin .im-ozellestir-textarea {
	border: 1px solid var(--e-line-2) !important;
	border-radius: 0 !important;
	font: inherit !important;
}
body.erpin.single-product .im-spec-container {
	width: 100% !important;
	max-width: calc(var(--e-max-rd) + var(--e-gutter) * 2) !important;
	margin: var(--e-sect-sm) auto 0 !important;
	padding: 0 var(--e-gutter) !important;
	background: transparent !important;
	border-radius: 0 !important;
	box-shadow: none !important;
}
body.erpin.single-product .im-spec-grid {
	grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
	gap: 0 var(--e-s10) !important;
}
body.erpin.single-product .im-spec-item {
	align-items: baseline !important;
	padding: 15px 0 !important;
	gap: var(--e-s5) !important;
	border-radius: 0 !important;
	border: 0 !important;
	border-bottom: 1px solid var(--e-line) !important;
	box-shadow: none !important;
	background: transparent !important;
}
body.erpin.single-product .im-spec-label {
	font-size: var(--e-fs-sm) !important;
	font-weight: var(--e-w-normal) !important;
	text-transform: none !important;
	color: var(--e-muted) !important;
	letter-spacing: .01em !important;
}
body.erpin.single-product .im-spec-value {
	font-size: var(--e-fs-sm) !important;
	font-weight: var(--e-w-medium) !important;
	color: var(--e-ink) !important;
}
body.erpin.single-product .im-spec-main-title,
body.erpin.single-product .related.products > h2,
body.erpin.single-product .upsells.products > h2,
body.erpin.single-product .up-sells.products > h2 {
	font-family: var(--e-font-display) !important;
	font-size: var(--e-d3) !important;
	font-weight: var(--e-w-display) !important;
	letter-spacing: var(--e-ls-display) !important;
	border-left: 0 !important;
	padding-left: 0 !important;
}
body.erpin.single-product .im-spec-main-title {
	font-size: var(--e-d4) !important;
	margin-bottom: var(--e-s6) !important;
}
body.erpin.single-product .related.products,
body.erpin.single-product .upsells.products,
body.erpin.single-product .up-sells.products {
	width: 100% !important;
	max-width: calc(var(--e-max) + var(--e-gutter) * 2) !important;
	margin: var(--e-sect-sm) auto 0 !important;
	padding-inline: var(--e-gutter) !important;
}
body.erpin.single-product .related.products > h2,
body.erpin.single-product .upsells.products > h2,
body.erpin.single-product .up-sells.products > h2 {
	margin-bottom: var(--e-s8) !important;
	padding-bottom: var(--e-s5) !important;
}
body.erpin.single-product .related.products ul.e-products,
body.erpin.single-product .upsells.products ul.e-products,
body.erpin.single-product .up-sells.products ul.e-products {
	grid-template-columns: repeat(var(--cols, 4), minmax(0, 1fr)) !important;
	gap: var(--e-s10) var(--e-s6) !important;
}
/* The legacy related-products frame must not reduce the approved 4:5 media. */
body.erpin ul.e-products {
	display: grid !important;
	grid-template-columns: repeat(var(--cols, 4), minmax(0, 1fr)) !important;
}
/* WooCommerce's generic ul.products reset otherwise wins over the approved
   catalog container and strips the responsive gutters from the image row. */
body.erpin .e-woo--catalog > ul.e-products {
	box-sizing: border-box !important;
	width: 100% !important;
	max-width: calc(var(--e-max) + var(--e-gutter) * 2) !important;
	margin-inline: auto !important;
	padding-inline: var(--e-gutter) !important;
}
/* WooCommerce's float clearfix must not become two phantom grid items. */
body.erpin ul.e-products::before,
body.erpin ul.e-products::after {
	content: none !important;
	display: none !important;
}
body.erpin ul.e-products > li.product.e-card,
body.erpin ul.e-products > li.product.e-card:hover {
	padding: 0 !important;
	border: 0 !important;
	border-radius: 0 !important;
	box-shadow: none !important;
	transform: none !important;
	background: transparent !important;
}
/* Set data, labels, form data attributes and scripts are provider-owned. */
body.erpin .imsetx-wrap,
body.erpin .imds-card {
	border: 1px solid var(--e-line);
	border-radius: 0;
	box-shadow: none;
	background: #fff;
}
body.erpin .imds-wrap {
	max-width: none;
	padding: 0;
	font-family: var(--e-font-text);
}
body.erpin .imds-head {
	display: flex;
	align-items: center;
	justify-content: space-between;
	flex-wrap: wrap;
	gap: var(--e-s4);
	padding: 0;
}
body.erpin .imds-filters {
	background: transparent;
	border: 0;
	border-radius: 0;
	padding: 0;
}
body.erpin .imds-filter,
body.erpin .imds-sort-select {
	border-radius: 0;
	font-family: inherit;
	font-weight: 400;
}
body.erpin .imds-filter.is-active {
	background: var(--e-red);
	color: #fff;
}
body.erpin .imds-grid {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: var(--e-s6);
}
body.erpin .imds-title {
	font-size: var(--e-fs-lg);
	font-weight: 400;
}
body.erpin .imds-thumb {
	aspect-ratio: 4 / 5;
	border-radius: 0;
}
body.erpin .imds-btn,
body.erpin .imsetx-btn {
	background: var(--e-red);
	border-radius: 0;
	box-shadow: none;
	font-weight: 500;
}
@media (max-width: 767px) {
	body.erpin.single-product .im-spec-grid { grid-template-columns: minmax(0, 1fr) !important; }
	body.erpin .imds-grid { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 900px) {
	body.erpin.single-product .related.products ul.e-products,
	body.erpin.single-product .upsells.products ul.e-products,
	body.erpin.single-product .up-sells.products ul.e-products {
		gap: var(--e-s8) var(--e-s4) !important;
	}
}
@media (max-width: 480px) {
	body.erpin.single-product .e-pdp__summary .im-fiyat-grid-wrapper {
		grid-template-columns: minmax(0, 1fr) !important;
		gap: 8px !important;
	}
	body.erpin.single-product .e-pdp__summary .im-havale-box,
	body.erpin.single-product .e-pdp__summary .im-taksit-box {
		min-height: 70px !important;
		padding: 13px 15px !important;
	}
	body.erpin.single-product .e-pdp__summary .im-teknik-kart {
		grid-template-columns: minmax(0, 1fr) !important;
	}
}
@media (max-width: 400px) {
	body.erpin.single-product .related.products ul.e-products,
	body.erpin.single-product .upsells.products ul.e-products,
	body.erpin.single-product .up-sells.products ul.e-products {
		gap: var(--e-s7) var(--e-s3) !important;
	}
}
@media (max-width: 420px) {
	body.erpin.single-product .e-pdp__summary .im-kisisel-grid {
		grid-template-columns: minmax(0, 1fr) !important;
	}
}

/* Layer: 17-live-commerce-compat.css */
/* Native WooCommerce totals remain authoritative inside the visual summary. */
/* Use ordinary text/CSS marks, not WooCommerce's private-use icon-font glyph. */
body.erpin .woocommerce-message,
body.erpin .woocommerce-info,
body.erpin .woocommerce-error {
	position: relative !important;
	padding-left: 52px !important;
}
body.erpin .woocommerce-message::before,
body.erpin .woocommerce-info::before,
body.erpin .woocommerce-error::before {
	position: absolute !important;
	left: 19px !important;
	top: 18px !important;
	display: block !important;
	box-sizing: border-box !important;
	width: 20px !important;
	height: 20px !important;
	font-family: var(--e-font-text) !important;
	font-size: 14px !important;
	font-weight: 500 !important;
	font-style: normal !important;
	line-height: 18px !important;
	text-align: center !important;
	color: inherit !important;
	border: 1px solid currentColor !important;
	border-radius: 50% !important;
}
body.erpin .woocommerce-info::before { content: "i" !important; }
body.erpin .woocommerce-error::before { content: "!" !important; }
body.erpin .woocommerce-message::before {
	content: "" !important;
	left: 24px !important;
	top: 20px !important;
	width: 7px !important;
	height: 12px !important;
	border-width: 0 2px 2px 0 !important;
	border-radius: 0 !important;
	transform: rotate(45deg) !important;
}
body.erpin .e-cart__coupon { flex-wrap: wrap; }
body.erpin .e-cart__coupon .coupon-error-notice {
	display: block;
	flex: 0 0 100%;
	margin: 0;
	font-size: var(--e-fs-sm);
	line-height: 1.5;
	color: var(--e-red);
	overflow-wrap: anywhere;
}
body.erpin .e-cart__coupon #coupon_code[aria-invalid="true"] {
	border-color: var(--e-red);
}
body.erpin .e-cart__summary .cart_totals {
	float: none;
	width: 100%;
	max-width: none;
	margin: 0;
}
body.erpin .e-cart__summary table.e-coreview {
	width: 100%;
	border-collapse: collapse;
	table-layout: auto;
}
body.erpin .e-cart__summary table.e-coreview tr { display: table-row; }
body.erpin .e-cart__summary table.e-coreview th,
body.erpin .e-cart__summary table.e-coreview td {
	display: table-cell;
	width: auto;
	vertical-align: top;
	overflow-wrap: anywhere;
	word-break: normal;
}
body.erpin .e-cart__summary table.e-coreview th { text-align: start; }
body.erpin .e-cart__summary table.e-coreview td { text-align: end; }
body.erpin .e-cart__summary table.e-coreview td .amount,
body.erpin .e-checkout .woocommerce-checkout-review-order-table td .amount {
	display: inline-block;
	white-space: nowrap;
	overflow-wrap: normal;
	word-break: normal;
}
body.erpin .e-cart__summary table.e-coreview th { padding-inline: 12px 8px; }
body.erpin .e-cart__summary table.e-coreview td { padding-inline: 8px 12px; }
body.erpin .e-cart__summary table.e-coreview .order-total .amount { font-size: clamp(22px, 2vw, 28px); }
/* The real table headings are visible; suppress only duplicated mobile labels. */
body.erpin .e-cart__summary table.e-coreview td::before { content: none; }
body.erpin .e-cart__summary .e-coreview .woocommerce-shipping-destination {
	display: block;
	margin-top: var(--e-s3);
	font-size: var(--e-fs-xs);
	font-weight: 400;
}
body.erpin .e-cart__summary .wc-proceed-to-checkout .checkout-button {
	border-radius: 0;
	white-space: normal;
	text-align: center;
	line-height: 1.4;
}
body.erpin .e-checkout .woocommerce-terms-and-conditions-checkbox-text a.woocommerce-terms-and-conditions-link {
	display: inline !important;
	visibility: visible !important;
	color: inherit;
	text-decoration: underline;
	text-underline-offset: .15em;
}

/* Native account endpoints keep their forms and providers. Clearfix pseudo
   elements and the legacy 30/68% floats must not become grid columns. */
body.erpin.woocommerce-account.logged-in .e-pagebody > .woocommerce {
	display: grid;
	grid-template-columns: 220px minmax(0, 1fr);
	gap: clamp(24px, 2.4vw, 40px);
	align-items: start;
	width: 100%;
	max-width: 1440px;
	margin-inline: auto;
}
body.erpin.woocommerce-account.logged-in .e-pagebody > .woocommerce::before,
body.erpin.woocommerce-account.logged-in .e-pagebody > .woocommerce::after {
	content: none;
	display: none;
}
body.erpin.woocommerce-account.logged-in .e-pagebody > .woocommerce > .woocommerce-notices-wrapper {
	grid-column: 1 / -1;
}
body.erpin.woocommerce-account.logged-in .e-pagebody > .woocommerce > .woocommerce-notices-wrapper:empty { display: none; }
body.erpin.woocommerce-account.logged-in .woocommerce-MyAccount-navigation,
body.erpin.woocommerce-account.logged-in .woocommerce-MyAccount-content {
	float: none;
	width: 100%;
	min-width: 0;
	max-width: none;
	margin: 0;
}
body.erpin.woocommerce-account.logged-in .woocommerce-MyAccount-navigation ul {
	margin: 0;
	padding: 0;
	list-style: none;
}
body.erpin.woocommerce-account.logged-in .woocommerce-MyAccount-navigation li a {
	min-height: 52px;
	padding: 14px 18px;
	font-size: 16px;
	line-height: 1.5;
}
body.erpin.woocommerce-account.logged-in .woocommerce-MyAccount-content {
	border: 1px solid var(--e-line);
	padding: clamp(20px, 2vw, 32px);
	background: var(--e-surface);
	line-height: 1.7;
	overflow-wrap: anywhere;
}
body.erpin.woocommerce-account.logged-in .woocommerce-MyAccount-content > p + p { margin-top: 16px; }
body.erpin.woocommerce-account.logged-in .woocommerce-MyAccount-content > p a { text-decoration: underline; text-underline-offset: 3px; }
body.erpin.woocommerce-account.woocommerce-dashboard .woocommerce-MyAccount-content > p:first-of-type {
	font-size: clamp(20px, 2vw, 26px);
	line-height: 1.4;
	margin-bottom: 24px;
}
body.erpin.woocommerce-account .e-page.e-section { padding-block: clamp(32px, 4vw, 64px); }
body.erpin.woocommerce-account .woocommerce-Addresses::before,
body.erpin.woocommerce-account .woocommerce-Addresses::after { display: none; content: none; }
body.erpin.woocommerce-account .woocommerce-Addresses > .woocommerce-Address { float: none; width: 100%; min-width: 0; }
body.erpin.woocommerce-account .woocommerce-orders-table th,
body.erpin.woocommerce-account .woocommerce-orders-table td {
	padding: 16px 12px;
	vertical-align: middle;
	font-size: 15px;
	line-height: 1.5;
}
body.erpin.woocommerce-account .woocommerce-orders-table__cell-order-number,
body.erpin.woocommerce-account .woocommerce-orders-table__cell-order-total .amount {
	white-space: nowrap;
	overflow-wrap: normal;
}
body.erpin.woocommerce-account .woocommerce-orders-table__cell-order-actions .button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 40px;
	margin-block: 3px;
	margin-inline: 0 6px;
	padding: 10px 13px;
	font-size: 12px;
	line-height: 1.3;
	letter-spacing: .03em;
	border-radius: 0;
}
@media (max-width: 900px) {
	body.erpin.woocommerce-account.logged-in .e-pagebody > .woocommerce { grid-template-columns: minmax(0, 1fr); gap: 24px; }
	body.erpin.woocommerce-account.logged-in .woocommerce-MyAccount-navigation ul {
		display: grid;
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: 4px;
		overflow: visible;
		border: 0;
	}
	body.erpin.woocommerce-account.logged-in .woocommerce-MyAccount-navigation li a { padding: 12px; white-space: normal; }
	body.erpin.woocommerce-account.logged-in .woocommerce-MyAccount-content { padding: 20px; }
	body.erpin.woocommerce-account .woocommerce-orders-table td::before { flex-shrink: 0; }
	body.erpin.woocommerce-account .woocommerce-orders-table td.woocommerce-orders-table__cell-order-actions {
		flex-wrap: wrap;
		justify-content: flex-start;
		gap: 8px;
	}
	body.erpin.woocommerce-account .woocommerce-orders-table td.woocommerce-orders-table__cell-order-actions::before {
		flex: 0 0 100%;
		text-align: start;
		white-space: nowrap;
	}
	body.erpin.woocommerce-account .woocommerce-orders-table__cell-order-actions .button {
		flex: 0 0 auto;
		width: auto;
		margin: 0;
		white-space: nowrap;
	}
}

/* Scoped controls: shared plugins and their business rules stay unchanged. */
body.erpin .e-minicart .buttons a.button {
	display: flex;
	align-items: center;
	justify-content: center;
	box-sizing: border-box;
	min-height: 54px;
	height: auto;
	margin: 0;
	padding: 16px 20px;
	line-height: 1.25;
	text-align: center;
	white-space: normal;
	border-radius: 0;
}
body.erpin .e-minicart .buttons a.button:not(.checkout) {
	background: #fff;
	border: 1px solid var(--e-ink);
	color: var(--e-ink);
}
body.erpin .e-cart__summary .wc-proceed-to-checkout a.checkout-button,
body.erpin .e-checkout #place_order,
body.erpin .e-minicart .buttons a.checkout {
	background: var(--e-red);
	border: 1px solid var(--e-red);
	color: #fff;
	border-radius: 0;
	text-align: center;
}
body.erpin .e-cart__summary .wc-proceed-to-checkout a.checkout-button {
	font-size: 15px;
	line-height: 1.35;
	min-height: 56px;
	padding: 16px 18px;
}
body.erpin .e-cart__summary .wc-proceed-to-checkout a.checkout-button:hover,
body.erpin .e-checkout #place_order:hover,
body.erpin .e-minicart .buttons a.checkout:hover {
	background: var(--e-red-hover);
	border-color: var(--e-red-hover);
}
body.erpin .e-minicart .buttons a.button:focus-visible,
body.erpin .e-cart__summary a.checkout-button:focus-visible,
body.erpin .e-checkout #place_order:focus-visible {
	outline: 2px solid var(--e-ink);
	outline-offset: 3px;
}

/* Native set shortcodes have late inline CSS: override only their layout. */
body.erpin .e-sets-archive {
	box-sizing: border-box;
	width: 100%;
	max-width: calc(var(--e-max) + var(--e-gutter) * 2);
	margin-inline: auto;
	padding-inline: var(--e-gutter);
}
body.erpin .imds-card { min-width: 0; padding: 0; overflow: hidden; }
body.erpin .imds-title { margin: 0; padding: 20px; padding-inline-end: 100px; text-align: start; line-height: 1.4; }
body.erpin .imds-card[data-count]::before { inset-inline-end: 16px; inset-inline-start: auto; top: 20px; }
body.erpin .imds-items {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 12px;
	min-width: 0;
	padding: 16px;
	margin: 0;
	border-inline: 0;
}
body.erpin .imds-items-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
body.erpin .imds-items-4 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
body.erpin .imds-item { width: auto; max-width: none; min-width: 0; padding: 0; gap: 0; }
body.erpin .imds-thumb { width: 100%; height: auto; max-width: none; aspect-ratio: 4 / 5; margin: 0 0 10px; }
body.erpin .imds-thumb img { display: block; width: 100%; height: 100%; max-width: none; object-fit: cover; }
body.erpin .imds-name { font-size: 15px; line-height: 1.45; margin: 0; padding-inline: 4px; }
body.erpin .imds-price { font-size: 15px; margin-block-start: 8px; padding-inline: 4px; white-space: nowrap; }
body.erpin .imds-foot { display: grid; grid-template-columns: minmax(0, 1fr); gap: 8px; width: 100%; min-width: 0; padding: 20px; text-align: start; }
body.erpin .imds-prices,
body.erpin .imds-cartline { width: 100%; min-width: 0; margin: 0; text-align: start; }
body.erpin .imds-priceline { justify-content: flex-start; }
body.erpin .imds-btn { width: 100%; max-width: none; min-width: 0; margin: 8px 0 0; line-height: 1.35; white-space: normal; }
body.erpin .imds-filter { min-height: 44px; }
@media (max-width: 1000px) {
	body.erpin .imds-grid { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 480px) {
	body.erpin .imds-items-3 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	body.erpin .imds-items { padding: 12px; gap: 12px; }
	body.erpin .imds-foot { padding: 16px; }
	body.erpin .imds-filters { flex-wrap: wrap; overflow: visible; gap: 6px; }
	body.erpin .imds-filter { padding-inline: 12px; font-size: 13px; }
	body.erpin.woocommerce-account.logged-in .woocommerce-MyAccount-content { padding: 16px; }
}

/* Language names remain native and page-aware. Logical spacing supports RTL. */
body.erpin .e-announce { position: relative; z-index: calc(var(--e-z-header) + 1); }
body.erpin .e-announce__inner { grid-template-columns: minmax(0, 1fr) minmax(0, 2fr) minmax(0, 1fr); min-height: 44px; }
body.erpin .e-languages {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 4px;
	min-width: 0;
	max-width: 100%;
	margin: 0;
	padding: 3px;
	border: 1px solid var(--e-line);
	border-radius: 5px;
	letter-spacing: normal;
}
body.erpin .e-languages__link {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	min-height: 44px;
	padding: 10px 13px;
	border-radius: 3px;
	font-size: 13px;
	font-weight: 500;
	line-height: 1.25;
	text-decoration: none;
	color: var(--e-ink);
}
body.erpin .e-languages__link.is-active { background: var(--e-ink); color: #fff; }
body.erpin .e-languages__link:focus-visible { outline: 2px solid currentColor; outline-offset: -3px; }
body.erpin .e-languages__link:not(.is-active):hover { background: rgba(128,128,128,.15); }
body.erpin .e-languages--drawer { width: fit-content; max-width: calc(100% - 48px); margin-block-start: 24px; margin-inline: 24px; align-self: flex-start; }
body.erpin .e-language-menu { position: relative; justify-self: end; margin: 0; }
body.erpin .e-language-menu > summary {
	display: flex;
	align-items: center;
	gap: 9px;
	min-height: 44px;
	padding: 8px 12px;
	font-size: 13px;
	font-weight: 500;
	line-height: 1.3;
	letter-spacing: .02em;
	list-style: none;
	cursor: pointer;
	color: #fff;
}
body.erpin .e-language-menu > summary::-webkit-details-marker { display: none; }
body.erpin .e-language-menu > summary:focus-visible { outline: 2px solid #fff; outline-offset: -3px; }
body.erpin .e-language-menu__chevron { width: 6px; height: 6px; margin-inline-start: 5px; border-inline-end: 1px solid currentColor; border-block-end: 1px solid currentColor; transform: rotate(45deg); }
body.erpin .e-language-menu[open] .e-language-menu__chevron { transform: rotate(225deg); }
body.erpin .e-languages--dropdown {
	position: absolute;
	inset-block-start: calc(100% + 4px);
	inset-inline-end: 0;
	width: max-content;
	min-width: 170px;
	max-width: min(260px, calc(100vw - 40px));
	padding: 6px;
	background: #fff;
	box-shadow: 0 8px 24px rgba(0,0,0,.10);
	border-radius: 3px;
	flex-direction: column;
	align-items: stretch;
}
body.erpin .e-languages--dropdown .e-languages__link { justify-content: flex-start; }
body.erpin .e-languages--dropdown .e-languages__link.is-active { background: var(--e-surface-2); color: var(--e-red); }
@media (max-width: 1000px) and (min-width: 768px) {
	body.erpin .e-announce__inner { grid-template-columns: minmax(0, 1fr) auto; }
	body.erpin .e-announce__side { display: none; }
}
@media (max-width: 767px) {
	body.erpin .e-announce__inner { grid-template-columns: minmax(0, 1fr); gap: 0; padding-block: 0; min-height: 36px; }
	body.erpin .e-announce__rotator { min-height: 36px; }
	body.erpin .e-announce__msg { font-size: 12px; line-height: 1.5; }
	body.erpin .e-language-menu { display: none; }
}

/* Compact mobile indicators keep the product photography unobstructed.
 * The full media link remains the touch target, not just the small icon.
 */
@media (max-width: 767px) {
	body.erpin .e-card__flags { top: 8px; left: 8px; gap: 4px; }
	body.erpin .e-card__flag--fast {
		height: 22px;
		min-height: 22px;
		padding: 2px 7px;
		font-size: 10px;
		line-height: 14px;
		font-weight: 500;
		letter-spacing: .025em;
		text-transform: none;
		background: rgba(255, 255, 255, .92);
		border-color: rgba(26, 104, 73, .18);
		border-radius: 2px;
	}
	body.erpin .e-card__video {
		left: auto;
		right: 8px;
		bottom: 8px;
		width: 32px;
		height: 32px;
		padding: 0;
		gap: 0;
		justify-content: center;
		border: 1px solid rgba(255, 255, 255, .7);
		border-radius: 50%;
		background: rgba(255, 255, 255, .92);
		color: var(--e-ink);
		box-shadow: 0 1px 5px rgba(0, 0, 0, .08);
	}
	body.erpin .e-card__video > span { display: none; }
	body.erpin .e-card__video .e-icon { width: 18px; height: 18px; flex: none; }
}