/* ==========================================================================
   SHAHAZ.com — Homepage layout system (ZIP-252)
   One rhythm for every section between the LED banner and the For You feed:
   same side gutter, same vertical gap, same slight corner rounding and one
   section-header style. Sections opt in with the class .shz-hs on their root.
   The Marketplace Entry Point, the LED banner and the For You feed keep their
   own fixed designs and are not touched here.

     --hl-gutter  side gutter            10px phone · 16px tablet · 24px desktop
     --hl-gap     space between sections 10px      · 14px        · 20px
     --hl-radius  corner rounding         6px      ·  8px        ·  8px
     --hl-max     widest content row     1400px
   ========================================================================== */
.shahaz-homepage {
	--hl-gutter: 10px;
	--hl-gap: 10px;
	--hl-radius: 6px;
	--hl-max: 1400px;
	--hl-ink: #221420;
	--hl-muted: #7a6670;
	--hl-accent: #d6106f;
	--hl-line: #f1e3ea;
}
@media (min-width: 640px) {
	.shahaz-homepage { --hl-gutter: 16px; --hl-gap: 14px; --hl-radius: 8px; }
}
@media (min-width: 1024px) {
	.shahaz-homepage { --hl-gutter: 24px; --hl-gap: 20px; }
}

/* ---- Section frame -------------------------------------------------------
   Every section is centred in the same content row and separated by one gap. */
.shahaz-homepage > .shz-hs {
	box-sizing: border-box;
	width: min(calc(100% - 2 * var(--hl-gutter)), var(--hl-max));
	max-width: none;
	margin: var(--hl-gap) auto 0;
}
.shahaz-homepage > :has(+ .shz-cat-shop) {
	margin-bottom: var(--hl-gap);
}

/* ---- Shared section header ---------------------------------------------- */
.shz-hs__head {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	margin: 0 0 8px;
}
.shz-hs__title {
	position: relative;
	margin: 0;
	padding-left: 10px;
	font-family: "Hind Siliguri", "Noto Sans Bengali", "Segoe UI", Arial, sans-serif;
	font-size: 16px;
	font-weight: 700;
	line-height: 1.25;
	color: var(--hl-ink);
	letter-spacing: 0;
}
.shz-hs__title::before {
	content: "";
	position: absolute;
	left: 0;
	top: 50%;
	width: 4px;
	height: 15px;
	border-radius: 2px;
	transform: translateY(-50%);
	background: linear-gradient(180deg, #ff2d8e 0%, #e2a62a 100%);
}
.shz-hs__more {
	display: inline-flex;
	align-items: center;
	gap: 3px;
	flex: 0 0 auto;
	font-size: 12px;
	font-weight: 600;
	line-height: 1;
	color: var(--hl-accent);
	text-decoration: none;
	white-space: nowrap;
}
.shz-hs__more span { font-size: 16px; line-height: 0; transform: translateY(-1px); }
.shz-hs__more:hover { text-decoration: underline; }
@media (min-width: 640px) {
	.shz-hs__head { margin-bottom: 10px; }
	.shz-hs__title { font-size: 18px; }
	.shz-hs__title::before { height: 17px; }
	.shz-hs__more { font-size: 13px; }
}
@media (min-width: 1024px) {
	.shz-hs__head { margin-bottom: 12px; }
	.shz-hs__title { font-size: 20px; padding-left: 12px; }
	.shz-hs__title::before { height: 19px; }
}

/* ---- Flash Sale, New Arrival, Top Ranking, Future Collection ------------
   Their own files keep the inside design; here only the outer box joins the
   shared rhythm (no own gutter or margin, slight rounding, no drop shadow). */
.shahaz-homepage > .shz-live-flash {
	border-radius: var(--hl-radius);
	box-shadow: none;
}
.shahaz-homepage > .shz-na,
.shahaz-homepage > .shz-tr {
	padding: 0;
}
.shahaz-homepage > .shz-fu {
	border-radius: var(--hl-radius);
}
.shahaz-homepage .shz-na__frame,
.shahaz-homepage .shz-tr__frame {
	border-radius: var(--hl-radius);
	box-shadow: none;
}

/* ---- Luxury World entry --------------------------------------------------- */
.shahaz-homepage .shz-home-luxury-entry__link {
	border-radius: var(--hl-radius);
	box-shadow: none;
}
.shahaz-homepage .shz-home-luxury-entry__link:hover { box-shadow: none; }
.shahaz-homepage .shz-home-luxury-entry__visual { border-radius: calc(var(--hl-radius) - 2px); box-shadow: 0 0 0 1px rgba(190, 18, 111, .22); }
.shahaz-homepage .shz-home-luxury-entry__visual:hover,
.shahaz-homepage .shz-home-luxury-entry__visual.is-hovered { box-shadow: 0 0 0 1px rgba(190, 18, 111, .38); }
.shahaz-homepage .shz-home-luxury-entry__portal { box-sizing: border-box; max-width: 100%; }
.shahaz-homepage .shz-home-luxury-entry__portal,
.shahaz-homepage .shz-home-luxury-entry__portal:hover { box-shadow: none; }

/* ---- Vouchers ------------------------------------------------------------- */

/* ZIP-398 (owner): Top Ranking — no frame border (the pink panel stays), and on the phone only 4px from each side of
 * the screen. */
.shahaz-homepage .shz-tr .shz-tr__frame { border: 0; background-clip: border-box; }
@media (max-width: 767px) {
	.shahaz-homepage > .shz-tr { width: calc(100% - 8px); }
}

/* ZIP-551 (owner): every section ABOVE For You that sits on its own background panel runs edge to edge — no side
 * gap, no outer border, no rounded corners (the cards inside keep their own look and inner spacing). Sections
 * without a panel (category cards) keep the normal gutter. For You and its category strip are not touched. */
.shahaz-homepage > .shz-hs.shz-dl,
.shahaz-homepage > .shz-hs.shz-live-flash,
.shahaz-homepage > .shz-hs.shz-home-luxury-entry,
.shahaz-homepage > .shz-hs.shz-tr,
.shahaz-homepage > .shz-hs.shz-fu,
.shahaz-homepage > .shz-hs.shz-vs,
.shahaz-homepage > .shz-hs.shz-na,
.shahaz-homepage > .shz-hs.shahaz-luxury-promo-sec { width: 100%; max-width: none; }
.shahaz-homepage .shz-dl__v,
.shahaz-homepage .shz-dl__d,
.shahaz-homepage > .shz-live-flash,
.shahaz-homepage .shz-tr__frame,
.shahaz-homepage > .shz-fu { border-radius: 0 !important; }
.shahaz-homepage .shz-home-luxury-entry__link { border: 0 !important; border-radius: 0 !important; }
.shahaz-homepage .shz-home-luxury-entry__link::before,
.shahaz-homepage .shz-home-luxury-entry__link::after { border-radius: 0 !important; }
.shahaz-homepage > .shz-vs { border: 0 !important; border-radius: 0 !important; } /* ZIP-569 (audit REG-01): no side border at any width */
