/* ==========================================================================
   Homepage (Figma node 3-2)
   ========================================================================== */

/* section titles: "המומלצים שלנו", "המותגים המובילים שלנו", "קצת עלינו" */
.lg-title .elementor-heading-title,
.elementor-5828 .elementor-widget-heading .elementor-heading-title {
	font-family: var(--lg-font);
	color: var(--lg-ink);
	letter-spacing: -.01em;
}
.lg-title .elementor-heading-title { font-size: clamp(32px, 3.4vw, 48px); line-height: 1.05; }
.lg-title--xl .elementor-heading-title { font-size: clamp(40px, 4.4vw, 62px); line-height: .98; }
.lg-lead, .lg-lead p { font-size: clamp(18px, 1.6vw, 24px); line-height: 1.3; color: var(--lg-ink-soft); }

/* hero buttons: 217×54 in the Figma */
.lg-hero-btn .elementor-button {
	min-width: 200px;
	min-height: 54px;
	padding: 0 28px;
	border-radius: 7px;
	font-size: 24px;
	line-height: 1;
	color: var(--lg-ink) !important;
	display: inline-flex; align-items: center; justify-content: center;
	transition: transform .25s ease, filter .25s ease;
}
.lg-hero-btn .elementor-button:hover { transform: translateY(-2px); filter: brightness(1.05); }

/* Colours Elementor keeps on the homepage widgets themselves (the old slate/taupe palette), in the whisky palette.
   Over the dark hero a burgundy button would sink into the picture, so "לחנות" is gold and "אזור אישי" cream. */
.elementor-5828 .elementor-element-51933a5 .elementor-button { background-color: var(--lg-gold-soft) !important; }
.elementor-5828 .elementor-element-33ca753 .elementor-button { background-color: var(--lg-cream) !important; }
.elementor-5828 .elementor-element-f02f21b .elementor-heading-title { color: var(--lg-cream) !important; }
.elementor-5828 .elementor-element-8ecf77d .elementor-heading-title,
.elementor-5828 .elementor-element-578523a .elementor-heading-title { color: var(--lg-gold-soft) !important; }
.elementor-5828 .elementor-element-bd84bc2 .elementor-heading-title,
.elementor-5828 .elementor-element-7468f4d .elementor-heading-title,
.elementor-5828 .elementor-element-9b3a858 .elementor-heading-title { color: var(--lg-ink) !important; }
/* "בקבוקים מיוחדים" has no colour of its own, so on phones it showed Elementor's default grey: the cream of the wider layouts */
.elementor-5828 .elementor-element-ca964b6 .elementor-button { background: var(--lg-cream) !important; color: var(--lg-ink) !important; }
.elementor-5828 .elementor-element-ca964b6 .elementor-button:hover { background: var(--lg-taupe) !important; color: #fff !important; }
/* "המומלצים שלנו" band below 1101px: Elementor's paper/taupe split, in paper/sand (home-wide.css paints it from 1101px up) */
.elementor-5828 .elementor-element.elementor-element-6af0372::before,
.elementor-5828 .elementor-element.elementor-element-6af0372 > .elementor-motion-effects-container > .elementor-motion-effects-layer::before {
	background-image: linear-gradient(180deg, var(--lg-paper) 52%, var(--lg-sand) 45%) !important;
}

/* ---------- "מה שותים היום?" categories (legima_home_tiles_html) ----------
   The original mosaic with the new brand-free pictures. The category name is real text in the label box
   the original pictures carried: cream, flush to the right edge, a little below the top. */
.lg-cats-widget { width: 100%; }
.lg-tiles { display: grid; gap: 14px; }
.lg-tile {
	position: relative; isolation: isolate; overflow: hidden; display: block;
	background: var(--lg-cream); border-radius: var(--lg-corner-sm);
	color: var(--lg-ink); text-decoration: none !important;
}
/* Elementor gives every picture height:auto (.elementor img): the frame decides here */
.lg-tiles .lg-tile__img { position: absolute; inset: 0; width: 100%; height: 100% !important; max-width: none; object-fit: cover; transition: transform 1.2s cubic-bezier(.2,.7,.2,1); }
.lg-tiles .lg-tile:hover .lg-tile__img { transform: scale(1.06); }
.lg-tile__box { position: absolute; top: 14%; inset-inline-start: 0; z-index: 1; max-width: 62%; }
.lg-tile__label { display: inline-block; padding: .3em .75em .36em; background: rgba(250,243,228,.92); font-family: var(--lg-font); font-size: clamp(22px, 2.4vw, 36px); line-height: 1.02; color: var(--lg-ink); }
/* wine: big title, a line of text and a button on the free wall beside the bottle, as in the original */
.lg-tile--feature .lg-tile__box { top: 40%; transform: translateY(-50%); inset-inline-start: 7%; max-width: 30%; display: flex; flex-direction: column; align-items: flex-start; gap: 14px; }
.lg-tile--feature .lg-tile__label { padding: 0; background: none; font-size: clamp(36px, 4.6vw, 68px); line-height: .95; }
.lg-tile__text { font-size: clamp(14px, 1.3vw, 19px); line-height: 1.35; color: var(--lg-ink-soft); }
.lg-tile__btn { display: inline-flex; align-items: center; min-height: 38px; padding: 0 18px; border-radius: 6px; background: var(--lg-ink); color: #fff; font-size: 15px; transition: background-color .25s ease; }
.lg-tile:hover .lg-tile__btn { background: var(--lg-hero); }
.lg-tile:focus-visible { outline: 3px solid var(--lg-ink); outline-offset: 3px; }
@media (max-width: 767px) {
	.lg-tiles { grid-template-columns: minmax(0, 1fr); }
	.lg-tile { aspect-ratio: 1 / .852; }   /* the height the original pictures had on phones */
	.lg-tile--feature .lg-tile__box { top: 9%; transform: none; max-width: 38%; gap: 10px; }
	.lg-tile--feature .lg-tile__text { display: none; }   /* beside the bottle there is room for the title and the button only */
	.lg-tile--feature .lg-tile__label { font-size: 40px; }
	.lg-tiles .lg-tile--spirits .lg-tile__img { object-position: center 40%; }
}
@media (prefers-reduced-motion: reduce) { .lg-tiles .lg-tile__img { transition: none; } }

/* soft button: "בקבוקים מיוחדים" */
.lg-btn-soft .elementor-button {
	background: var(--lg-cream) !important;
	color: var(--lg-ink) !important;
	border-radius: 6px;
	font-size: 17px;
	padding: 10px 22px;
}
.lg-btn-soft .elementor-button:hover { background: var(--lg-taupe) !important; color: #fff !important; }

/* ---------- "המומלצים שלנו": 3 cards, the middle one drops lower ---------- */
.lg-reco .wd-carousel-inner, .lg-reco .wd-carousel { overflow-x: clip !important; overflow-y: visible !important; }
.lg-reco .wd-carousel-item, .lg-reco .swiper-slide { height: auto; }
@media (min-width: 1025px) {
	.lg-reco .wd-carousel { padding-top: 10px; padding-bottom: 80px; }
	.lg-reco .wd-carousel-item:nth-child(3n+2) .wd-product { transform: translateY(74px); }
}

/* ---------- "מוצרים חדשים": text right, taupe cards left ---------- */
.lg-new > .e-con-inner { display: flex; flex-direction: row; align-items: center; gap: 48px; border-top: 7px solid var(--lg-sand); padding-top: 70px; }
.lg-new__intro.e-con { flex: 0 0 26%; gap: 14px; padding: 0; }
.lg-new__grid.e-con { flex: 1 1 auto; padding: 0; }
/* light gold, not the amber band colour: the burgundy name and price stay readable on it */
.lg-cards-taupe .wd-product.wd-hover-alt { --lg-card: var(--lg-gold-soft); --lg-pill: var(--lg-cream); }
.lg-cards-taupe .wd-product.wd-hover-alt .wd-entities-title a,
.lg-cards-taupe .wd-product.wd-hover-alt .wrap-price .price { color: var(--lg-ink); }
.lg-cards-taupe .wd-product.wd-hover-alt .wd-product-cats { color: var(--lg-ink-soft); opacity: .8; }

/* ---------- "קצת עלינו" + 4 features ---------- */
.lg-about.e-con { gap: 18px; }
.lg-about__text { max-width: 1240px; margin-inline: auto; }
.lg-about__text p { font-size: clamp(17px, 1.45vw, 21px); line-height: 1.55; color: var(--lg-ink); margin: 0; }
.lg-features {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	max-width: 1060px;
	margin: 56px auto 0;
}
.lg-feature {
	display: flex; flex-direction: column; align-items: center; text-align: center; gap: 4px;
	padding: 4px 18px;
}
.lg-feature + .lg-feature { border-inline-start: 2px solid var(--lg-sand); }
.lg-feature__icon { width: 62px; height: 62px; color: var(--lg-taupe); margin-bottom: 6px; }
.lg-feature__icon svg { width: 100%; height: 100%; }
.lg-feature__title { font-family: var(--lg-font); font-weight: 400; font-size: clamp(20px, 2vw, 28px); line-height: 1.1; color: var(--lg-ink); }
.lg-feature__sub { font-size: 15px; color: var(--lg-ink); }

@media (max-width: 1024px) {
	.lg-new > .e-con-inner { flex-direction: column; align-items: stretch; gap: 28px; padding-top: 48px; }
	.lg-new__intro.e-con { flex-basis: auto; }
	.lg-features { grid-template-columns: repeat(2, minmax(0, 1fr)); row-gap: 34px; }
	.lg-feature:nth-child(3) { border-inline-start: 0; }
}
@media (max-width: 767px) {
	.lg-new.e-con, .lg-about.e-con { padding-inline: 16px !important; }
	.lg-hero-btn .elementor-button { min-width: 140px; min-height: 46px; font-size: 19px; }
	.lg-feature { padding: 4px 10px; }
	.lg-feature__icon { width: 48px; height: 48px; }
}

/* ---------- phone fixes ---------- */
@media (max-width: 767px) {
	/* the category cards carry their text inside the image (right side): keep that side in frame */
	.elementor-5828 .elementor-widget-call-to-action .elementor-cta__bg { background-position: 88% 35% !important; }
	/* tag moves above the title instead of over the bottle */
	.wd-product.wd-hover-alt .product-labels { position: static; justify-content: center; height: auto; margin: 2px 0 4px; }
	/* "מוצרים חדשים": two cards per row, no orphan */
	.lg-new__grid .wd-product:nth-child(n+3) { display: none; }
	.elementor-5828 > .e-con:first-child { margin-top: 0 !important; }

	/* category pictures: one height for all five, one gap between them.
	   (The heights came from the desktop mosaic: the wine picture was 649px tall, brandy 347px.) */
	.elementor-5828 .elementor-element-44923c3, .elementor-5828 .elementor-element-4559213 { min-height: 0 !important; }
	.elementor-5828 .elementor-element-44923c3 { margin-bottom: 14px !important; }
	.elementor-5828 .elementor-element-44923c3 > .e-con-inner,
	.elementor-5828 .elementor-element-4559213 > .e-con-inner,
	.elementor-5828 .elementor-element-6a0b01c { gap: 14px !important; row-gap: 14px !important; }
	.elementor-5828 .elementor-element-4559213 > .e-con-inner { padding-block: 0 !important; align-items: stretch !important; }
	.elementor-5828 .elementor-element-d66f4cc, .elementor-5828 .elementor-element-6a0b01c,
	.elementor-5828 .elementor-element-62c45d6, .elementor-5828 .elementor-element-b8af736 { width: 100% !important; padding: 0 !important; margin: 0 !important; }
	/* height follows the screen width (the picture is as wide as the screen minus the two 16px gutters) */
	.elementor-5828 .elementor-element-44923c3 .elementor-cta__content,
	.elementor-5828 .elementor-element-4559213 .elementor-cta__content { min-height: calc((100vw - 32px) * .852) !important; padding: 0 !important; }
	/* the wine picture has its title, text and button inside the image: shown larger and from the right,
	   so they stay readable at this height */
	.elementor-5828 .elementor-element-057cc78 .elementor-cta__bg { background-size: auto 128% !important; background-position: 100% 27% !important; }

	/* more air on phones (the owner asked for it): one rhythm between the sections, 16px between cards */
	.elementor-5828 .elementor-element-4559213,
	.elementor-5828 .elementor-element-6af0372 { margin-bottom: 80px !important; } /* → "המומלצים שלנו" → brands */
	.elementor-5828 .elementor-element-f9b0ca9 { margin-bottom: 25px !important; } /* + the 55px above the taupe rule of "מוצרים חדשים" = 80 */
	.elementor-5828 .lg-new.e-con { padding-inline: 1px !important; } /* the section already sits 15px in: cards on the 16px lines */
	.elementor-5828 .lg-about.e-con { margin-bottom: 24px !important; } /* + the footer's own top padding */
	.elementor-5828 .lg-reco .wd-carousel { --wd-gap-sm: 16px !important; --wd-gap: 16px !important; }
	.elementor-5828 .lg-new__grid .products.wd-grid-g { --wd-gap-sm: 16px !important; --wd-gap: 16px !important; column-gap: 16px !important; }
}

/* "המומלצים שלנו": every card as tall as the tallest one beside it; price and button line up at the bottom */
.elementor-5828 .lg-reco .wd-carousel-item > .wd-product,
.elementor-5828 .lg-reco .wd-carousel-item > .wd-product > .product-wrapper { height: 100%; }
.elementor-5828 .lg-reco .wd-product .product-element-bottom { flex-grow: 1 !important; }
.elementor-5828 .lg-reco .wd-product .wrap-price { margin-top: auto !important; }

/* ==========================================================================
   Inner pages (אודות · צור קשר): hero panel in the homepage-hero language
   ========================================================================== */
.lg-page-hero.e-con {
	background: var(--lg-hero);
	border-radius: 28px;
	margin: 8px 28px 0;
	padding: 72px 20px 60px;
	gap: 10px;
	width: auto;
}
.lg-page-hero__title .elementor-heading-title { font-family: var(--lg-font); color: var(--lg-cream); font-size: clamp(48px, 6.4vw, 104px); line-height: .95; font-weight: 400; }
.lg-page-hero__sub .elementor-heading-title { font-family: var(--lg-font); color: var(--lg-sage); font-size: clamp(18px, 2vw, 30px); letter-spacing: .5em; font-weight: 400; }
.lg-cta-band__panel.e-con { background: var(--lg-cream); border-radius: 28px; padding: 56px 24px; gap: 14px; align-items: center; }
.lg-btn-cream .elementor-button { background: var(--lg-ink) !important; color: #fff !important; }

/* contact */
.lg-contact > .e-con-inner { display: flex; flex-direction: row; gap: 56px; align-items: flex-start; }
.lg-contact__info.e-con { flex: 1 1 42%; padding: 0; gap: 16px; }
.lg-contact__form.e-con { flex: 1 1 58%; padding: 36px; background: var(--lg-cream-soft); border-radius: 26px; }
.lg-contact-cards { display: grid; gap: 12px; margin-top: 10px; }
.lg-contact-card { display: flex; flex-direction: column; gap: 4px; padding: 20px 24px; border-radius: 18px; background: var(--lg-cream); color: var(--lg-ink); transition: transform .25s ease, background-color .25s ease; }
.lg-contact-card:hover { transform: translateY(-3px); background: var(--lg-taupe); color: #fff; }
.lg-contact-card__label { font-size: 15px; opacity: .75; }
.lg-contact-card strong { font-family: var(--lg-font); font-weight: 400; font-size: 26px; text-align: right; }
.lg-form .elementor-field-textual { background: #fff !important; border: 1px solid var(--lg-line) !important; border-radius: 8px !important; min-height: 50px; color: var(--lg-ink) !important; font-family: var(--lg-font); font-size: 16px; }
.lg-form .elementor-field-textual:focus { border-color: var(--lg-taupe) !important; box-shadow: 0 0 0 3px rgba(122,31,43,.15); }
.lg-form .elementor-button { background: var(--lg-ink) !important; color: #fff !important; min-height: 54px; border-radius: 8px !important; font-family: var(--lg-font); font-size: 19px; }
.lg-form .elementor-button:hover { background: var(--lg-hero) !important; }
.lg-form .elementor-message { color: var(--lg-ink); }

@media (max-width: 1024px) {
	.lg-page-hero.e-con { margin: 6px 12px 0; border-radius: 20px; padding: 48px 16px 40px; }
	.lg-contact > .e-con-inner { flex-direction: column; gap: 32px; }
	.lg-contact.e-con, .lg-cta-band.e-con { padding-inline: 16px !important; }
	.lg-contact__form.e-con { padding: 22px 16px; width: 100%; }
	.lg-page-hero__sub .elementor-heading-title { letter-spacing: .25em; }
}
