/* GVINAGE — only what theme.json cannot express.
   Every rule here needs a reason in a comment. No !important. RTL-safe: logical
   properties only, never left/right. */

/* Latin fragments inside Hebrew RTL text (GVINAGE, prices, emails) scramble
   unless isolated. This is the most common RTL bug and the fix is one rule. */
.gv-ltr,
.woocommerce-Price-amount,
.wc-block-formatted-money-amount {
  direction: ltr;
  unicode-bidi: isolate;
  display: inline-block;
}

/* Readable measure for long-form prose without forcing it on every block. */
.gv-prose > p,
.gv-prose > ul,
.gv-prose > ol { max-inline-size: var(--wp--custom--measure); }

/* Small caps eyebrow above section headings. */
.gv-eyebrow {
  font-size: var(--wp--preset--font-size--small);
  letter-spacing: 0.12em;
  text-transform: uppercase;
  /* gold-dark read at 3.6:1 on white — below the 4.5:1 that IS 5568 requires for small text. */
  color: var(--wp--preset--color--gold-deep);
  margin-block-end: var(--wp--preset--spacing--10);
}

/* Cards: the sharp, low-shadow treatment the design system calls for. */
.gv-card {
  background: var(--wp--preset--color--white);
  border: var(--wp--custom--line);
  border-radius: var(--wp--custom--radius--card);
}

/* Accessible focus ring everywhere, including for keyboard users inside
   WooCommerce markup that ships without one. */
:where(a, button, input, select, textarea, [tabindex]):focus-visible {
  outline: 2px solid var(--wp--preset--color--gold-deep);
  outline-offset: 2px;
}

/* Skip link — required for keyboard navigation under IS 5568. */
.skip-link {
  position: absolute;
  inset-block-start: -100px;
  inset-inline-start: var(--wp--preset--spacing--20);
  z-index: 999;
  background: var(--wp--preset--color--ink);
  color: var(--wp--preset--color--white);
  padding: 12px 20px;
  border-radius: var(--wp--custom--radius--sharp);
}
.skip-link:focus { inset-block-start: var(--wp--preset--spacing--20); }

/* Images: no layout shift. Explicit ratio where the editor did not set one. */
.gv-square img { aspect-ratio: 1 / 1; object-fit: cover; width: 100%; }
.gv-wide img   { aspect-ratio: 3 / 2; object-fit: cover; width: 100%; }

/* Native accordion for FAQ — no JavaScript, and it feeds FAQPage schema. */
.gv-faq details {
  border-block-end: var(--wp--custom--line);
  padding-block: var(--wp--preset--spacing--30);
}
.gv-faq summary {
  cursor: pointer;
  font-weight: 500;
  color: var(--wp--preset--color--ink);
  list-style: none;
  display: flex;
  justify-content: space-between;
  gap: var(--wp--preset--spacing--20);
}
.gv-faq summary::-webkit-details-marker { display: none; }
.gv-faq summary::after { content: "+"; color: var(--wp--preset--color--gold-deep); }
.gv-faq details[open] summary::after { content: "\2212"; }

/* Motion: subtle, and off for anyone who asked for less. */
@media (prefers-reduced-motion: no-preference) {
  a, button { transition: color .15s ease, background-color .15s ease, border-color .15s ease; }
}


/* Hero split layout: the photo fills its column with no gap and keeps a sane crop
   on every screen. Text lives on the cream panel beside it, never on top of the
   photo — a dark overlay destroys both the image and the readability. */
.gv-hero-image { margin: 0; }
.gv-hero-image img {
  display: block;
  inline-size: 100%;
  block-size: 100%;
  min-block-size: 70vh;
  object-fit: cover;
}
@media (max-width: 781px) {
  .gv-hero-image img { min-block-size: 46vh; }
}


/* Flex children default to min-width:auto, so a large image forces its column
   wider than the viewport and the whole page overflows sideways. Standard fix. */
.wp-block-columns > .wp-block-column { min-inline-size: 0; }
.wp-block-columns { max-inline-size: 100%; }
.gv-hero-image, .gv-hero-image img { max-inline-size: 100%; }

/* --- Product card meta: DNA strip + price -------------------------------- */
/* Rendered by the gvinage/product-meta block. Centred to match the card title. */
.gv-card-meta { margin-block-start: 0.5rem; text-align: center; }
.gv-dna {
	margin: 0;
	font-size: var(--wp--preset--font-size--small);
	color: var(--wp--preset--color--body);
	letter-spacing: 0.04em;
	line-height: 1.5;
}
.gv-price {
	margin-block: 0.35rem 0;
	font-size: var(--wp--preset--font-size--body);
	font-weight: 500;
	color: var(--wp--preset--color--ink);
	direction: ltr;
	unicode-bidi: isolate;
}

/* Cards in a grid stretch to equal height and the meta sinks to the bottom, so the
   prices sit on one line even when a product has no DNA strip. */
.wp-block-post-template.is-layout-grid > li { display: flex; flex-direction: column; }
.wp-block-post-template.is-layout-grid > li > .gv-card-meta { margin-block-start: auto; }

/* --- Hero ---------------------------------------------------------------- */
/* The hero owns the first screen: the photograph carries the height, and the text
   column gets a real gutter beside it instead of running into the image edge. */
.wp-block-columns:has(.gv-hero-image) { gap: 0; }
.wp-block-columns:has(.gv-hero-image) > .wp-block-column:not(:has(.gv-hero-image)) {
	padding-inline-end: var(--wp--preset--spacing--50);
	padding-block: var(--wp--preset--spacing--40);
}
/* Balance the headline across its lines rather than leaving one orphan word. */
.wp-block-columns:has(.gv-hero-image) h1 { text-wrap: balance; }

/* The block grid is a fixed four columns, which is right on a desktop and unusable on a
   phone. Step it down so a card never drops below a readable width. */
@media (max-width: 1024px) {
	.wp-block-post-template.is-layout-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 781px) {
	.wp-block-post-template.is-layout-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

/* --- Delivery-area notice on cart and checkout --------------------------- */
/* Logical border so the accent sits on the reading edge in Hebrew and in English alike. */
.gv-notice {
	border-inline-start: 3px solid var(--wp--preset--color--gold);
	padding: var(--wp--preset--spacing--30);
	margin-block-end: var(--wp--preset--spacing--40);
}
.gv-notice p { margin-block: 0.35rem; }
.gv-notice strong { color: var(--wp--preset--color--ink); }

/* --- Product cards ------------------------------------------------------- */
/* The shop band is cream, so each card takes a white ground of its own. That is the
   design system card — not a bare image floating on a tinted page. */
.wp-block-post-template.is-layout-grid > li {
	background: var(--wp--preset--color--white);
	border-radius: 4px;
	box-shadow: 0 1px 3px rgba(35, 35, 35, 0.06);
	overflow: hidden;
	padding-block-end: var(--wp--preset--spacing--30);
}
.wp-block-post-template.is-layout-grid > li .wp-block-post-title,
.wp-block-post-template.is-layout-grid > li .gv-card-meta {
	padding-inline: var(--wp--preset--spacing--20);
}

/* A card should answer the cursor. 180ms, transform only, and nothing at all for anyone
   whose system asks for reduced motion. */
.wp-block-post-template.is-layout-grid > li .wp-block-post-featured-image img {
	transition: transform 180ms ease;
}
.wp-block-post-template.is-layout-grid > li:hover .wp-block-post-featured-image img {
	transform: scale(1.04);
}
@media (prefers-reduced-motion: reduce) {
	.wp-block-post-template.is-layout-grid > li .wp-block-post-featured-image img,
	.wp-block-post-template.is-layout-grid > li:hover .wp-block-post-featured-image img {
		transition: none;
		transform: none;
	}
}

/* --- Promise-row icons --------------------------------------------------- */
/* Gold line icons give the promises band something to look at. They carry no meaning of
   their own — the text does that — so they are hidden from screen readers. */
.gv-icon {
	color: var(--wp--preset--color--gold);
	display: block;
	margin-inline: auto;
	margin-block-end: 0.75rem;
}

/* --- Editorial split sections -------------------------------------------- */
/* The photograph runs to the page edge while the text keeps a column of its own. Sections
   mirror each other so the page alternates instead of marching down the middle. */
.gv-split { gap: 0; }
.gv-split > .wp-block-column { min-inline-size: 0; }
.gv-split .gv-split-media img {
	display: block;
	inline-size: 100%;
	block-size: 100%;
	min-block-size: 62vh;
	object-fit: cover;
}
.gv-split .gv-split-text {
	padding-inline: var(--wp--preset--spacing--50);
	padding-block: var(--wp--preset--spacing--60);
}
@media (max-width: 781px) {
	.gv-split .gv-split-media img { min-block-size: 44vh; }
	.gv-split .gv-split-text {
		padding-inline: var(--wp--preset--spacing--30);
		padding-block: var(--wp--preset--spacing--50);
	}
}

/* One oversized moment on the page, and it belongs to Naomi own words. */
.gv-display-quote {
	font-size: var(--wp--preset--font-size--display);
	line-height: 1.15;
	letter-spacing: -0.02em;
	color: var(--wp--preset--color--ink);
	max-inline-size: 20ch;
	margin-block: var(--wp--preset--spacing--40);
	text-wrap: balance;
}

/* A photograph used as a chapter break rather than an illustration inside a box. */
.gv-bleed img {
	display: block;
	inline-size: 100%;
	block-size: 62vh;
	object-fit: cover;
}
@media (max-width: 781px) { .gv-bleed img { block-size: 42vh; } }

/* Brand ribbon between chapters. Decorative only, so it is hidden from screen readers. */
.gv-ribbon {
	overflow: hidden;
	white-space: nowrap;
	border-block: 1px solid rgba(35, 35, 35, 0.10);
	padding-block: 0.85rem;
	color: var(--wp--preset--color--gold-deep);
	font-size: var(--wp--preset--font-size--small);
	letter-spacing: 0.36em;
	text-align: center;
	user-select: none;
	direction: ltr;
}

/* The page shell keeps an inline padding of its own. A band that is meant to reach the
   true edge has to cancel it on the wrapper that carries it, or the photograph stops
   40px short and the whole effect reads as a mistake. */
.wp-block-group:has(> .gv-split),
.wp-block-group:has(> .gv-ribbon),
.wp-block-group.gv-bleed { padding-inline: 0; }

/* Columns must stretch so the photograph fills its half floor to ceiling; the text half
   centres its own content instead of relying on the columns alignment. */
.wp-block-columns.gv-split { align-items: stretch; }
.gv-split .gv-split-text {
	display: flex;
	flex-direction: column;
	justify-content: center;
}
.gv-split .gv-split-media { display: flex; }
.gv-split .gv-split-media .wp-block-image {
	inline-size: 100%;
	margin: 0;
}

/* A square portrait would otherwise dictate the height of its whole band and leave the
   section towering over its neighbours. Give the photograph a definite height and let it
   crop, so every split band shares one rhythm. */
.gv-split .gv-split-media img {
	block-size: clamp(420px, 62vh, 700px);
	min-block-size: 0;
	object-fit: cover;
}
@media (max-width: 781px) {
	.gv-split .gv-split-media img { block-size: clamp(280px, 44vh, 420px); }
}

/* --- Phone refinements ---------------------------------------------------- */
@media (max-width: 781px) {
	/* The wordmark is the anchor on a small screen, so it grows. The menu toggle moves
	   to the far edge, where a thumb actually reaches it. */
	header .wp-block-site-title { font-size: 1.65rem; }
	header .wp-block-navigation { order: 3; }
	header .wp-block-group:has(.wc-block-mini-cart),
	header .wp-block-group:has(.wp-block-woocommerce-mini-cart) { order: 2; }

	/* A tall crop chops the arrangement in half on a phone. Full width and a gentler
	   ratio show the whole photograph instead of a slice of it. */
	.gv-hero-image img,
	.gv-split .gv-split-media img {
		min-block-size: 0;
		block-size: auto;
		aspect-ratio: 4 / 3;
	}

	/* Text was sitting in a narrow channel with wide margins either side. */
	.gv-split .gv-split-text {
		padding-inline: var(--wp--preset--spacing--20);
		padding-block: var(--wp--preset--spacing--40);
	}

	/* Five promises stacked one per row made the page endless. Grid overrides the
	   editor stacking rule without needing !important, so they sit side by side. */
	.wp-block-columns:has(.gv-icon) {
		display: grid;
		grid-template-columns: repeat(3, minmax(0, 1fr));
		gap: var(--wp--preset--spacing--30);
	}
	.wp-block-columns:has(.gv-icon) > .wp-block-column { margin: 0; }
}

@media (max-width: 399px) {
	.wp-block-columns:has(.gv-icon) { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

/* --- Category tiles ------------------------------------------------------- */
/* The homepage shows the way in, not the whole catalogue. Someone ready to buy goes
   to the shop; someone browsing picks a texture first. */
.gv-cat-tile figure { margin: 0; overflow: hidden; border-radius: 4px; }
.gv-cat-tile img {
	display: block;
	aspect-ratio: 1 / 1;
	inline-size: 100%;
	block-size: auto;
	object-fit: cover;
	transition: transform 180ms ease;
}
.gv-cat-tile:hover img { transform: scale(1.04); }
.gv-cat-tile p { margin-block: 0.5rem 0; }
.gv-cat-tile a { text-decoration: none; }
.gv-cat-tile a:hover { color: var(--wp--preset--color--gold-deep); text-decoration: underline; }
@media (prefers-reduced-motion: reduce) {
	.gv-cat-tile img, .gv-cat-tile:hover img { transition: none; transform: none; }
}

/* The monthly notice now sits on gold, so its link has to read against gold. */
.has-gold-background-color a { color: var(--wp--preset--color--ink); }

/* --- Cheese carousel ------------------------------------------------------ */
/* Every cheese without the endless page: one row that swipes on a phone and drags on
   a desktop. Snapping stops a card halfway off the edge. */
.gv-carousel.is-layout-grid {
	display: grid;
	grid-template-columns: none;
	grid-auto-flow: column;
	grid-auto-columns: minmax(240px, 1fr);
	overflow-x: auto;
	overscroll-behavior-inline: contain;
	scroll-snap-type: x mandatory;
	padding-inline: var(--wp--preset--spacing--40);
	scroll-padding-inline: var(--wp--preset--spacing--40);
	padding-block-end: var(--wp--preset--spacing--20);
}
.gv-carousel > li { scroll-snap-align: start; }
@media (max-width: 781px) {
	.gv-carousel.is-layout-grid {
		grid-auto-columns: minmax(70vw, 1fr);
		padding-inline: var(--wp--preset--spacing--20);
		scroll-padding-inline: var(--wp--preset--spacing--20);
	}
}

/* Arrow controls, added by script so they never appear without working. */
.gv-carousel-nav { display: flex; gap: 0.5rem; justify-content: center; margin-block-start: var(--wp--preset--spacing--30); }
.gv-carousel-nav button {
	inline-size: 46px;
	block-size: 46px;
	border: 1px solid rgba(35, 35, 35, 0.18);
	border-radius: 2px;
	background: var(--wp--preset--color--white);
	color: var(--wp--preset--color--ink);
	font-size: 1.2rem;
	cursor: pointer;
	transition: background 150ms ease, color 150ms ease;
}
.gv-carousel-nav button:hover { background: var(--wp--preset--color--gold-deep); color: var(--wp--preset--color--white); border-color: var(--wp--preset--color--gold-deep); }
.gv-carousel-nav button:focus-visible { outline: 2px solid var(--wp--preset--color--ink); outline-offset: 2px; }

/* --- Emphasis: monthly notice --------------------------------------------- */
/* It carries the offer of the month, so it gets a taller band, larger type and a link
   that looks like something you press. */
.has-gold-background-color.alignfull { padding-block: var(--wp--preset--spacing--40); }
.has-gold-background-color p { font-size: var(--wp--preset--font-size--title-s); }
.has-gold-background-color a {
	display: inline-block;
	margin-inline-start: 0.6rem;
	padding: 0.35rem 1.2rem;
	border: 1px solid var(--wp--preset--color--ink);
	border-radius: 2px;
	text-decoration: none;
	font-size: var(--wp--preset--font-size--body);
}
.has-gold-background-color a:hover { background: var(--wp--preset--color--ink); color: var(--wp--preset--color--cream); }

/* --- Emphasis: promises band ---------------------------------------------- */
/* The band was whispering. Bigger icons, a real title size, and hairlines so the five
   read as one row of claims instead of loose text. */
.gv-icon { inline-size: 42px; block-size: 42px; }
.wp-block-columns:has(.gv-icon) .has-body-font-size { font-size: var(--wp--preset--font-size--title-s); }
@media (min-width: 782px) {
	.wp-block-columns:has(.gv-icon) > .wp-block-column + .wp-block-column {
		border-inline-start: 1px solid rgba(35, 35, 35, 0.10);
		padding-inline-start: var(--wp--preset--spacing--30);
	}
}

/* --- Photograph cropping --------------------------------------------------- */
/* Faces sit in the upper part of a frame. A cover crop centred on the middle cuts
   straight through them, so the crop is biased upward instead. */
.gv-hero-image img,
.gv-split .gv-split-media img,
.gv-bleed img { object-position: center 28%; }

/* --- Footer ---------------------------------------------------------------- */
/* The menu was rendering as one run-on string. Vertical list, real spacing, and a
   gold underline only on hover so the column stays quiet. */
.gv-footer-nav ul { gap: 0.6rem; }
.gv-footer-nav li { display: block; }
.gv-footer-nav a { text-decoration: none; }
.gv-footer-nav a:hover { color: var(--wp--preset--color--gold-deep); text-decoration: underline; }
footer h3 { letter-spacing: 0.08em; margin-block-end: var(--wp--preset--spacing--20); }
footer .wp-block-site-title a { text-decoration: none; }
@media (max-width: 781px) {
	footer .wp-block-columns { gap: var(--wp--preset--spacing--40); }
}

/* --- Phone: reclaim the width ---------------------------------------------- */
/* Measured on a 390px screen: the section shell was taking 45px a side and the text
   column another 56px, leaving the headline a 187px channel to wrap inside. That is
   what read as "centred and chopped". Give the width back. */
@media (max-width: 781px) {
	.wp-block-group.alignfull:not(:has(> .gv-split)):not(:has(> .gv-ribbon)):not(.gv-bleed) {
		padding-inline: var(--wp--preset--spacing--20);
	}
	.wp-block-columns > .wp-block-column { padding-inline: 0; }
	.gv-split .gv-split-text { padding-inline: var(--wp--preset--spacing--20); }

	/* Balancing a headline inside a narrow column only makes the lines shorter. */
	.wp-block-columns:has(.gv-hero-image) h1,
	.gv-display-quote { text-wrap: pretty; }
	.gv-display-quote { max-inline-size: none; }

	/* The hero photograph reaches both edges instead of sitting in a padded box. */
	.wp-block-columns:has(.gv-hero-image) > .wp-block-column:has(.gv-hero-image) {
		margin-inline: calc(-1 * var(--wp--preset--spacing--20));
	}
}

/* --- Hero text column ------------------------------------------------------ */
/* The padding used to be baked into the block as an inline style, which no stylesheet
   can override without !important. It lives here now, so it can shrink on a phone. */
.gv-hero-text {
	padding-block: var(--wp--preset--spacing--60);
	padding-inline: var(--wp--preset--spacing--50);
}
@media (max-width: 781px) {
	.gv-hero-text {
		padding-block: var(--wp--preset--spacing--40);
		padding-inline: var(--wp--preset--spacing--20);
	}
	/* The carousel manages its own inline padding, so the wrapper must not add more
	   on top of it — that extra 16px was pushing the page 8px wider than the screen. */
	.gv-carousel-wrap.alignfull { padding-inline: 0; }
}

/* The full-width helpers give this wrapper a negative margin of its own, which on a
   phone made the page eight pixels wider than the screen and produced a stray
   sideways scroll. The carousel inside already handles its own edges. */
.gv-carousel-wrap,
.gv-carousel-wrap > .wp-block-query {
	margin-inline: 0;
	max-inline-size: 100%;
	overflow-x: clip;
}

/* The block editor grid layout writes grid-template-columns as an inline style, which
   no stylesheet can override without !important, and it collapsed the first card to
   zero width. Flexbox has no such inline attribute, so the carousel is flex. */
.gv-carousel {
	display: flex;
	flex-wrap: nowrap;
	gap: var(--wp--preset--spacing--30);
	list-style: none;
	margin: 0;
	overflow-x: auto;
	overscroll-behavior-inline: contain;
	scroll-snap-type: x mandatory;
	padding-inline: var(--wp--preset--spacing--40);
	scroll-padding-inline: var(--wp--preset--spacing--40);
	padding-block-end: var(--wp--preset--spacing--20);
}
.gv-carousel > li {
	flex: 0 0 clamp(230px, 26vw, 300px);
	scroll-snap-align: start;
}
@media (max-width: 781px) {
	.gv-carousel {
		padding-inline: var(--wp--preset--spacing--20);
		scroll-padding-inline: var(--wp--preset--spacing--20);
	}
	/* 70vw suits a phone; on a tablet it would show barely one card, so it is capped. */
	.gv-carousel > li { flex: 0 0 min(70vw, 320px); }
}


/* --- נגישות: מחלקת עזר לקוראי מסך ----------------------------------------- */
/* Text that a screen reader announces but the eye never sees. Used to give a
   section a heading where the design does not show one, so the heading outline
   has no gaps (ת"י 5568 / WCAG 1.3.1). */
.gv-sr-only {
	position: absolute;
	inline-size: 1px;
	block-size: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip-path: inset(50%);
	white-space: nowrap;
	border: 0;
}

/* --- תפריט נגישות (תקנה 35) ----------------------------------------------- */
/* A preferences panel, not an "overlay". It changes nothing on its own and makes
   no claim to repair the site; the site is built to meet the standard without it.
   Choices are kept in the visitor's own browser and are never sent anywhere. */
.gv-a11y {
	position: fixed;
	inset-block-end: 20px;
	inset-inline-start: 20px;
	z-index: 9990;
}
.gv-a11y-toggle {
	inline-size: 52px;
	block-size: 52px;
	border-radius: 50%;
	border: 2px solid var(--wp--preset--color--white);
	background: var(--wp--preset--color--ink);
	color: var(--wp--preset--color--white);
	display: flex;
	align-items: center;
	justify-content: center;
	cursor: pointer;
	box-shadow: 0 2px 10px rgba(0, 0, 0, 0.25);
}
.gv-a11y-toggle:focus-visible,
.gv-a11y-panel button:focus-visible,
.gv-a11y-panel a:focus-visible {
	outline: 3px solid var(--wp--preset--color--gold-deep);
	outline-offset: 3px;
}
.gv-a11y-panel {
	position: absolute;
	inset-block-end: 64px;
	inset-inline-start: 0;
	inline-size: 272px;
	max-inline-size: calc(100vw - 40px);
	background: var(--wp--preset--color--white);
	border: 2px solid var(--wp--preset--color--ink);
	border-radius: 4px;
	padding: 14px;
	box-shadow: 0 4px 24px rgba(0, 0, 0, 0.22);
}
.gv-a11y-title {
	font-size: 1.0625rem;
	margin: 0 0 10px;
	color: var(--wp--preset--color--ink);
}
.gv-a11y-panel button,
.gv-a11y-panel a {
	display: block;
	box-sizing: border-box;
	inline-size: 100%;
	text-align: start;
	margin-block-end: 6px;
	padding: 9px 12px;
	font-size: 1rem;
	line-height: 1.3;
	background: var(--wp--preset--color--cream);
	color: var(--wp--preset--color--ink);
	border: 1px solid var(--wp--preset--color--ink);
	border-radius: 2px;
	cursor: pointer;
	text-decoration: none;
}
.gv-a11y-panel button[aria-pressed="true"] {
	background: var(--wp--preset--color--ink);
	color: var(--wp--preset--color--white);
}
.gv-a11y-val { font-weight: 600; }

/* --- שכבות ההעדפה עצמן ---------------------------------------------------- */
html.gva-fs-115 { font-size: 115%; }
html.gva-fs-130 { font-size: 130%; }
html.gva-fs-150 { font-size: 150%; }

html.gva-links a { text-decoration: underline; text-underline-offset: 3px; }

html.gva-spacing p,
html.gva-spacing li,
html.gva-spacing dd { line-height: 2; letter-spacing: 0.02em; }

html.gva-font body,
html.gva-font body * { font-family: Arial, "Helvetica Neue", Helvetica, sans-serif; }

html.gva-motion *,
html.gva-motion *::before,
html.gva-motion *::after { animation: none; transition: none; scroll-behavior: auto; }

html.gva-cursor,
html.gva-cursor * {
	cursor: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='42' height='42' viewBox='0 0 24 24'%3E%3Cpath d='M5 2l14 9-6 1 3 7-3 1-3-7-5 4z' fill='%23000000' stroke='%23ffffff' stroke-width='1.2'/%3E%3C/svg%3E") 4 4, auto;
}

/* High contrast: every brand colour collapses to black on white. Gold becomes a
   white ground rather than a dark one, so text sitting on it stays readable. */
html.gva-contrast {
	--wp--preset--color--gold: #FFFFFF;
	--wp--preset--color--gold-dark: #000000;
	--wp--preset--color--gold-deep: #000000;
	--wp--preset--color--ink: #000000;
	--wp--preset--color--body: #000000;
	--wp--preset--color--cream: #FFFFFF;
	--wp--preset--color--white: #FFFFFF;
}
html.gva-contrast body { background: #FFFFFF; color: #000000; }
html.gva-contrast .gv-icon { color: #000000; }
html.gva-contrast .wp-element-button { border-color: #000000; }

html.gva-invert { filter: invert(1) hue-rotate(180deg); background: #FFFFFF; }
html.gva-invert img,
html.gva-invert video,
html.gva-invert iframe { filter: invert(1) hue-rotate(180deg); }

html.gva-gray { filter: grayscale(1); }


/* --- טופס יצירת קשר -------------------------------------------------------- */
/* שדות רחבים, תוויות מעל, והודעות שגיאה צמודות לשדה שאליו הן שייכות —
   כך קורא מסך מקריא את השגיאה יחד עם השדה ולא כרשימה מנותקת בראש העמוד. */
.gv-form {
	max-inline-size: var(--wp--custom--measure);
	margin-block-start: var(--wp--preset--spacing--40);
}
.gv-field { margin-block-end: var(--wp--preset--spacing--30); }
.gv-field label {
	display: block;
	font-weight: 500;
	color: var(--wp--preset--color--ink);
	margin-block-end: 0.4rem;
}
.gv-field input,
.gv-field select,
.gv-field textarea {
	inline-size: 100%;
	box-sizing: border-box;
	padding: 0.7rem 0.9rem;
	font-family: inherit;
	font-size: var(--wp--preset--font-size--body);
	color: var(--wp--preset--color--ink);
	background: var(--wp--preset--color--white);
	border: 1px solid rgba(35, 35, 35, 0.35);
	border-radius: 2px;
}
.gv-field textarea { resize: vertical; }
.gv-field input:focus-visible,
.gv-field select:focus-visible,
.gv-field textarea:focus-visible {
	outline: 3px solid var(--wp--preset--color--gold-deep);
	outline-offset: 2px;
}
.gv-field input[aria-invalid="true"],
.gv-field textarea[aria-invalid="true"] { border-color: #9B1C1C; border-width: 2px; }
.gv-req { color: #9B1C1C; }
.gv-optional { font-weight: 400; color: var(--wp--preset--color--body); }
.gv-field-error {
	display: block;
	margin-block-start: 0.35rem;
	color: #9B1C1C;
	font-size: var(--wp--preset--font-size--small);
}
.gv-form-errors {
	border-inline-start: 3px solid #9B1C1C;
	background: var(--wp--preset--color--cream);
	padding: var(--wp--preset--spacing--20);
	margin-block-end: var(--wp--preset--spacing--30);
}
.gv-form-note {
	font-size: var(--wp--preset--font-size--small);
	color: var(--wp--preset--color--body);
}
/* שדה הפיתיון: מוסתר מהעין ומקורא מסך, אבל קיים ב-DOM כדי שבוטים ימלאו אותו. */
.gv-hp {
	position: absolute;
	inline-size: 1px;
	block-size: 1px;
	overflow: hidden;
	clip-path: inset(50%);
	white-space: nowrap;
}
