/* Reference-led homepage composition. The parent Hostinger theme stays untouched. */
html { scroll-behavior: smooth; }
body.home { background: #f5f3ef; }
.leg-homepage-main,
.leg-homepage-main > * { max-width: none !important; margin: 0 !important; padding: 0 !important; }
.leg-editorial-home { width: 100vw; max-width: none; margin-inline: calc(50% - 50vw); }

/* Transparent, compact header over the hero. */
.leg-site-header { position: absolute; inset: 0 0 auto; z-index: 30; background: linear-gradient(180deg, rgba(8,12,18,.58), transparent); color: #fff; padding: .85rem clamp(1.25rem, 3.4vw, 3.5rem); }
.leg-site-header__inner { width: 100%; max-width: 1440px; margin-inline: auto; }
.leg-site-header .wp-block-site-title { position: relative; max-width: 210px; margin: 0; padding-left: 2.8rem; font-family: Georgia, serif; font-size: 1rem; line-height: 1.1; letter-spacing: .18em; text-transform: uppercase; }
.leg-site-header .wp-block-site-title::before { content: "✥"; position: absolute; left: 0; top: -.25rem; color: #b58b49; font-size: 2rem; }
.leg-site-header .wp-block-site-title::after { content: "ESCAPE GUIDE"; display: block; margin-top: .2rem; font: 600 .48rem/1.2 Arial, sans-serif; letter-spacing: .26em; }
.leg-site-header .wp-block-navigation { font: 600 .68rem/1 Arial, sans-serif; letter-spacing: .04em; text-transform: uppercase; }
.leg-site-header .wp-block-navigation a { text-decoration: none; }
body.home .leg-site-header .wp-block-navigation-item:first-child a { color: #c49a57; border-bottom: 1px solid currentColor; padding-bottom: .55rem; }
.leg-site-footer { background: #15231c; color: #fff; padding: 2rem clamp(1.25rem, 5vw, 4rem); }
.leg-site-footer__inner { max-width: 1440px; margin-inline: auto; }
.leg-site-footer p { margin: 0; opacity: .72; }
.leg-site-footer a { color: inherit; text-decoration: none; }

/* The reference hero is cinematic but deliberately not a full-page takeover. */
.leg-editorial-hero { min-height: clamp(390px, 38svh, 520px); padding: 5.8rem max(1.25rem, calc((100vw - 1180px)/2)) 2.5rem; align-items: center; background-position: center 58%; }
.leg-editorial-hero__inner { width: min(610px, 55vw); }
.leg-editorial-hero h1 { max-width: 580px; font-size: clamp(3.1rem, 4.4vw, 5rem); line-height: .98; text-transform: uppercase; }
.leg-editorial-hero__intro { margin: 1.4rem 0 1.2rem; font-size: .9rem; line-height: 1.55; }
.leg-editorial-hero__actions { gap: .7rem; }
.leg-editorial-button,
.leg-editorial-text-button { min-height: 40px; padding: .72rem 1rem; font-size: .58rem; letter-spacing: .08em; text-decoration: none; border: 1px solid currentColor; }
.leg-editorial-hero .leg-editorial-button { color: #fff; background: #b88a48; border-color: #b88a48; }
.leg-editorial-hero__scroll { display: none; }

/* Three horizontal editorial bands: heading at left, five cards at right. */
.leg-destination-section,
.leg-stays-section,
.leg-experience-section { width: 100%; max-width: none; display: grid; grid-template-columns: 250px minmax(0, 1fr); gap: clamp(2rem, 4vw, 4.5rem); padding: 1.15rem max(1.25rem, 3.4vw) 1.4rem; }
.leg-destination-section { background: #f8f7f4; }
.leg-stays-section { background: #eeece8; }
.leg-experience-section { background: #f8f7f4; color: #171814; }
.leg-destination-section .leg-editorial-section-heading,
.leg-stays-section .leg-editorial-section-heading,
.leg-experience-section .leg-editorial-section-heading { display: flex; flex-direction: column; align-items: flex-start; border: 0; padding: 2rem 0 0; margin: 0; gap: 0; }
.leg-destination-section .leg-editorial-kicker,
.leg-stays-section .leg-editorial-kicker,
.leg-experience-section .leg-editorial-kicker { margin: 0 0 .8rem; color: #a97e42; font-size: .58rem; letter-spacing: .1em; }
.leg-destination-section .leg-editorial-section-heading h2,
.leg-stays-section .leg-editorial-section-heading h2,
.leg-experience-section .leg-editorial-section-heading h2 { margin: 0; color: #171814; font-size: clamp(1.75rem, 2.1vw, 2.6rem); line-height: 1.08; letter-spacing: -.035em; }
.leg-section-link { margin-top: auto; margin-bottom: 1.9rem; color: #171814; font: 600 .58rem/1 Arial, sans-serif; letter-spacing: .06em; text-transform: uppercase; text-decoration: none; border-bottom: 1px solid #aa7b37; padding-bottom: .35rem; }

/* Destination cards match the equal portrait rhythm of the mock-up. */
.leg-destination-cards { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: .8rem; }
.leg-destination-card,
.leg-destination-card.is-lead { grid-column: auto; grid-row: auto; min-height: 245px; padding: 1rem; }
.leg-destination-card:nth-child(n+6) { display: none; }
.leg-destination-card__index,
.leg-destination-card__arrow { display: none; }
.leg-destination-card__name { color: #fff; font-size: clamp(1.15rem, 1.45vw, 1.65rem); font-weight: 600; text-transform: uppercase; text-shadow: 0 2px 12px rgba(0,0,0,.95), 0 1px 2px #000; }
.leg-destination-card small { display: none; }
.leg-destination-card::after { background: linear-gradient(0deg, rgba(3,5,4,.92) 0%, rgba(3,5,4,.46) 48%, rgba(3,5,4,.08) 74%); }
.leg-destination-card__name::after { content: ""; display: block; width: 2.4rem; margin-top: .65rem; border-bottom: 1px solid #c69a54; }

/* Compact stay cards: image, useful copy, no marketplace clutter. */
.leg-stay-grid-editorial { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: .8rem; }
.leg-stay-editorial-card,
.leg-stay-editorial-card.is-featured { display: block; grid-column: auto; grid-row: auto; background: #f8f7f4; box-shadow: 0 7px 20px rgba(28,25,20,.05); }
.leg-stay-editorial-card:nth-child(n+6) { display: none; }
.leg-stay-editorial-card img,
.leg-stay-editorial-card.is-featured img { width: 100%; aspect-ratio: 1.65/1; object-fit: cover; }
.leg-stay-editorial-card__copy { padding: .55rem .65rem .7rem; }
.leg-stay-editorial-card__copy>p { margin: 0 0 .35rem; font-size: .48rem; }
.leg-stay-editorial-card h3 { margin: 0; font-family: Arial, sans-serif; font-size: .72rem; font-weight: 600; letter-spacing: 0; }
.leg-stay-editorial-card span { margin: .25rem 0 .45rem; font-size: .52rem; }
.leg-stay-editorial-card__copy>a { font-size: .5rem; letter-spacing: .04em; }

/* Five equal experience images with titles laid over the photography. */
.leg-experience-grid { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: .8rem; background: transparent; }
.leg-experience-card,
.leg-experience-card:nth-child(1),
.leg-experience-card:nth-child(4) { grid-column: auto; min-height: 235px; padding: .8rem; justify-content: flex-end; text-align: center; }
.leg-experience-card { color: #fff; }
.leg-experience-card { text-decoration: none; }
.leg-experience-card::after { background: linear-gradient(0deg, rgba(3,5,4,.92) 0%, rgba(3,5,4,.42) 48%, rgba(3,5,4,.06) 74%); }
.leg-experience-card h3 { color: #fff; font-family: Arial, sans-serif; font-size: .72rem; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; text-shadow: 0 2px 12px rgba(0,0,0,.95), 0 1px 2px #000; }
.leg-experience-card p,
.leg-experience-card>span { display: none; }

/* The remaining editorial content continues below the reference view. */
.leg-morocco-feature { min-height: 650px; }
.leg-journal-section { max-width: 1440px; }

@media (max-width: 980px) {
	.leg-site-header .wp-block-navigation__container { gap: 1rem; }
	.leg-destination-section,
	.leg-stays-section,
	.leg-experience-section { grid-template-columns: 190px minmax(0, 1fr); gap: 1.5rem; }
	.leg-destination-cards,
	.leg-stay-grid-editorial,
	.leg-experience-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); overflow: hidden; }
	.leg-destination-card:nth-child(n+4),
	.leg-stay-editorial-card:nth-child(n+4),
	.leg-experience-card:nth-child(n+4) { display: none; }
}

@media (max-width: 700px) {
	.leg-editorial-home { width: 100%; margin-inline: 0; }
	.leg-site-header { padding: 1rem 1.25rem; }
	.leg-site-header .wp-block-site-title { max-width: 170px; }
	.leg-editorial-hero { min-height: 690px; padding: 7rem 1.25rem 3rem; align-items: flex-end; background-position: 62% center; }
	.leg-editorial-hero__inner { width: 100%; }
	.leg-editorial-hero h1 { font-size: clamp(3rem, 15vw, 4.3rem); }
	.leg-destination-section,
	.leg-stays-section,
	.leg-experience-section { display: block; padding: 3.5rem 1.25rem; }
	.leg-destination-section .leg-editorial-section-heading,
	.leg-stays-section .leg-editorial-section-heading,
	.leg-experience-section .leg-editorial-section-heading { padding: 0; margin-bottom: 1.7rem; }
	.leg-section-link { margin: 1.3rem 0 0; }
	.leg-destination-cards,
	.leg-stay-grid-editorial,
	.leg-experience-grid { display: flex; overflow-x: auto; scroll-snap-type: x mandatory; padding-bottom: .7rem; }
	.leg-destination-card,
	.leg-destination-card.is-lead,
	.leg-stay-editorial-card,
	.leg-stay-editorial-card.is-featured,
	.leg-experience-card,
	.leg-experience-card:nth-child(1),
	.leg-experience-card:nth-child(4) { display: block; flex: 0 0 78vw; min-height: 0; scroll-snap-align: start; }
	.leg-destination-card,
	.leg-destination-card.is-lead { display: flex; min-height: 400px; }
	.leg-experience-card,
	.leg-experience-card:nth-child(1),
	.leg-experience-card:nth-child(4) { min-height: 380px; display: flex; }
	.leg-morocco-feature { min-height: 680px; padding-inline: 1.25rem; }
}
