/*
 * Kukburi — Home page only: hero, story/about, testimonials, delivery/family-
 * trays feature split, journal preview, FAQ accordion.
 * Ported ~verbatim from kukburi_homepage.html. Enqueued only on the front
 * page (see functions.php) — nothing here is shared with Menu/Cart/etc.
 */

.story-text{ line-height: 1.7; opacity: .8; }

.hero{ position: relative; height: 86vh; min-height: 560px; overflow: hidden; }
@media (max-width: 780px){ .hero{ height: 480px; min-height: 0; } }
@media (max-width: 480px){ .hero{ height: 420px; } }
.hero img.heroimg{ width: 100%; height: 100%; object-fit: cover; }
.hero::after{ content: ""; position: absolute; inset: 0; background: linear-gradient(0deg, rgba(0,15,42,0.80) 0%, rgba(0,15,42,0.25) 46%, rgba(0,15,42,0.08) 65%); }
.hero-content{ position: absolute; left: 0; right: 0; bottom: 0; padding: 0 32px 64px; max-width: 1240px; margin: 0 auto; color: var(--paper); z-index: 2; }
.hero-tag{ display: inline-block; background: var(--green); color: #fff; font-family: 'Jost',sans-serif; font-size: .72rem; letter-spacing: .1em; text-transform: uppercase; padding: 6px 14px; margin-bottom: 18px; transform: rotate(-2deg); }
body[dir="rtl"] .hero-tag{ font-family: 'Noto Naskh Arabic', sans-serif; letter-spacing: 0; text-transform: none; }
.hero h1{ font-size: clamp(2.6rem, 6vw, 5rem); max-width: 820px; color: #fff; }
.hero h1 em{ color: #D9C48A; font-style: italic; }
.hero p{ font-size: 1.05rem; max-width: 460px; margin: 20px 0 30px; opacity: .92; }
.hero-actions{ display: flex; gap: 16px; flex-wrap: wrap; }

.section-head{ display: flex; justify-content: space-between; align-items: flex-end; gap: 24px; margin-bottom: 48px; flex-wrap: wrap; }
.section-head h2{ font-size: clamp(1.9rem,3.4vw,2.7rem); }

.promo{ position: relative; min-height: 480px; display: flex; align-items: center; overflow: hidden; margin: 0 32px; border-radius: 6px; }
.promo img{ position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.promo::after{ content: ""; position: absolute; inset: 0; background: linear-gradient(100deg, rgba(0,15,42,.85) 20%, rgba(0,15,42,.2) 70%); }
.promo-inner{ position: relative; z-index: 2; color: #fff; padding: 60px; max-width: 560px; }
.promo-inner .eyebrow{ color: #D9C48A; }
.promo-inner h2{ font-size: clamp(2.2rem,4vw,3.4rem); color: #fff; margin: 14px 0 18px; }
.promo-inner p{ opacity: .88; margin-bottom: 30px; line-height: 1.6; }

.testi-grid{ display: grid; grid-template-columns: 1fr 1fr; gap: 24px; }
.testi-card{ background: var(--cream-card); border: 1px solid var(--line); display: grid; grid-template-columns: 1fr 1fr; }
.testi-text{ padding: 34px; display: flex; flex-direction: column; justify-content: center; gap: 16px; }
.stars{ color: var(--brown); letter-spacing: 2px; }
.testi-text q{ font-family: 'Jost',sans-serif; font-style: italic; font-size: 1.15rem; line-height: 1.4; }
body[dir="rtl"] .testi-text q{ font-family: 'Noto Naskh Arabic', serif; font-style: normal; }
.testi-name{ font-family: 'Jost',sans-serif; font-size: .74rem; text-transform: uppercase; opacity: .7; }
body[dir="rtl"] .testi-name{ font-family: 'Noto Naskh Arabic', sans-serif; text-transform: none; }
.testi-img{ position: relative; overflow: hidden; }
.testi-img img{ width: 100%; height: 100%; object-fit: cover; min-height: 220px; }

.split{ display: grid; grid-template-columns: 1fr 1fr; gap: 24px; }
.split-card{ position: relative; min-height: 380px; overflow: hidden; border-radius: 6px; }
.split-card img{ position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; transition: transform .5s ease; }
.split-card:hover img{ transform: scale(1.05); }
.split-card::after{ content: ""; position: absolute; inset: 0; background: linear-gradient(0deg, rgba(0,15,42,.8), transparent 55%); }
.split-content{ position: absolute; left: 0; bottom: 0; padding: 30px; z-index: 2; color: #fff; }
body[dir="rtl"] .split-content{ left: auto; right: 0; }
.split-content h3{ color: #fff; font-size: 1.4rem; margin-bottom: 8px; }
.split-content p{ opacity: .85; font-size: .86rem; max-width: 340px; margin-bottom: 18px; line-height: 1.5; }

.about-split{ display: grid; grid-template-columns: 1fr 1fr; gap: 24px; margin-bottom: 96px; align-items: center; }

.journal-feature{ display: grid; grid-template-columns: 1fr 1fr; gap: 0; background: var(--paper-2); border-radius: 6px; overflow: hidden; margin-bottom: 24px; }
.journal-feature img{ height: 100%; object-fit: cover; min-height: 320px; }
.journal-feature-text{ padding: 52px; display: flex; flex-direction: column; justify-content: center; }
.journal-feature-text .date{ font-family: 'Jost',sans-serif; font-size: .75rem; opacity: .55; margin-top: 22px; }
.journal-feature-text h3{ font-size: clamp(1.5rem,3vw,2.1rem); margin: 12px 0 16px; }
.journal-feature-text p{ opacity: .75; line-height: 1.6; margin-bottom: 24px; }
.journal-grid{ display: grid; grid-template-columns: repeat(3,1fr); gap: 24px; }
.journal-card img{ aspect-ratio: 16/11; object-fit: cover; border-radius: 4px; margin-bottom: 18px; }
.journal-card .tag{ display: inline-block; background: var(--green); color: #fff; font-family: 'Jost',sans-serif; font-size: .65rem; text-transform: uppercase; padding: 4px 10px; margin-bottom: 12px; }
.journal-card h4{ font-size: 1.1rem; font-weight: 600; margin-bottom: 8px; line-height: 1.3; }
.journal-card p{ font-size: .84rem; opacity: .68; line-height: 1.5; }
.journal-card .date{ font-family: 'Jost',sans-serif; font-size: .72rem; opacity: .5; margin-top: 12px; display: block; }

.faq-wrap{ display: grid; grid-template-columns: .8fr 1.2fr; gap: 60px; }
.faq-item{ border-bottom: 1px solid var(--line); padding: 22px 0; }
.faq-q{ display: flex; justify-content: space-between; align-items: center; cursor: pointer; font-weight: 600; gap: 20px; }
.faq-q .icon{ font-family: 'Jost',sans-serif; font-size: 1.2rem; flex-shrink: 0; transition: transform .25s ease; }
.faq-item.open .faq-q .icon{ transform: rotate(45deg); }
.faq-a{ max-height: 0; overflow: hidden; transition: max-height .3s ease; }
.faq-item.open .faq-a{ max-height: 220px; }
.faq-a p{ padding-top: 14px; opacity: .7; line-height: 1.6; font-size: .92rem; }

@media (max-width: 980px){
	.split, .about-split{ grid-template-columns: 1fr; }
	.testi-grid{ grid-template-columns: 1fr; }
	.testi-card{ grid-template-columns: 1fr; }
	.journal-feature{ grid-template-columns: 1fr; }
	.journal-grid{ grid-template-columns: 1fr 1fr; }
	.faq-wrap{ grid-template-columns: 1fr; gap: 20px; }
}
@media (max-width: 600px){
	.journal-grid{ grid-template-columns: 1fr; }
	.promo{ margin: 0 20px; }
	.promo-inner{ padding: 36px 26px; }
}