/* ==========================================================================
   KRVE Layout — header sticky (logo berganti putih saat scroll), menu HP,
   hero "panggung" (sticky + section berikutnya naik seperti kartu), footer.
   Gerak: transform/opacity saja, kurva kritis-teredam (tanpa memantul).
   ========================================================================== */

:root {
	--krve-spring: cubic-bezier(.22, 1, .36, 1);
	--krve-hdr-bar: 68px;
	--krve-hdr-bar-stuck: 60px;
	--krve-hdr-total: 68px;
	--krve-hdr-top: var(--wp-admin--admin-bar--height, 0px);
	--krve-pad-x: max(20px, calc((100% - 1120px) / 2));
}
@media (min-width: 600px) { :root { --krve-pad-x: max(32px, calc((100% - 1120px) / 2)); } }
@media (min-width: 900px) { :root { --krve-hdr-bar: 76px; } }
@media (max-width: 600px) { :root { --krve-hdr-top: 0px; } } /* admin bar WP ikut tergulung di HP */

/* Sembunyikan header/footer bawaan tema bila versi KRVE aktif. */
body.krve-has-hdr.page .site-main { padding-top: 0 !important; } /* tema klasik (mis. Twenty Twenty-One) */
body.krve-has-hdr #masthead,
body.krve-has-hdr .site-header:not(.krve-hdr),
body.krve-has-hdr header.wp-block-template-part,
body.krve-has-hdr #mobile-drawer { display: none !important; }
body.krve-has-ftr #colophon,
body.krve-has-ftr .site-footer:not(.krve-ftr),
body.krve-has-ftr footer.wp-block-template-part,
body.krve-has-ftr .site > aside.widget-area { display: none !important; }

/* ---------------------------------------------------------------- Header */
.krve-hdr {
	position: fixed; left: 0; right: 0; top: var(--krve-hdr-top); z-index: 9990;
	color: var(--krve-forest); font-family: var(--krve-sans);
}
.krve-hdr__note { overflow: hidden; max-height: 60px; transition: max-height .45s var(--krve-spring), opacity .3s; }
.krve-hdr__note .krve-announce { margin: 0; }
.krve-hdr__bar {
	position: relative; display: flex; align-items: center; gap: 28px;
	height: var(--krve-hdr-bar); padding: 0 var(--krve-pad-x);
	background: rgba(245, 239, 228, .78);
	-webkit-backdrop-filter: blur(16px) saturate(150%); backdrop-filter: blur(16px) saturate(150%);
	transition: height .45s var(--krve-spring), background-color .45s ease, box-shadow .45s ease, color .3s ease;
}
/* Garis bawah halus, bukan border keras. */
.krve-hdr__bar::after {
	content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 1px;
	background: linear-gradient(90deg, transparent, rgba(31, 58, 44, .1) 20%, rgba(31, 58, 44, .1) 80%, transparent);
	transition: opacity .3s;
}

.krve-hdr__logo { position: relative; display: block; height: var(--krve-logo-h, 26px); flex: none; line-height: 0; }
.krve-hdr__logo img {
	height: 100%; width: auto; max-width: none; display: block;
	transform-origin: left center; transition: opacity .35s ease, transform .45s var(--krve-spring);
}
.krve-hdr__logo-light { position: absolute; left: 0; top: 0; opacity: 0; }
.krve-hdr--invert .krve-hdr__logo-light { filter: brightness(0) invert(1); }

.krve-hdr__nav { margin-left: auto; display: none; }
.krve-hdr__nav ul { list-style: none; display: flex; gap: 4px; margin: 0; padding: 0; }
.krve-hdr__nav a {
	position: relative; display: block; padding: 10px 14px; border-radius: 999px;
	font-size: 15px; font-weight: 600; color: inherit; text-decoration: none; letter-spacing: .005em;
	transition: background-color .2s ease, color .2s ease;
}
.krve-hdr__nav a:hover { background: rgba(31, 58, 44, .07); }
.krve-hdr__nav a[aria-current="page"]::after {
	content: ""; position: absolute; left: 50%; bottom: 3px; width: 5px; height: 5px; margin-left: -2.5px;
	border-radius: 50%; background: var(--krve-leaf);
}
.krve-hdr__end { margin-left: auto; display: flex; align-items: center; gap: 10px; }
.krve-hdr__nav + .krve-hdr__end { margin-left: 8px; }
.krve-hdr__cta {
	display: inline-flex; align-items: center; height: 42px; padding: 0 18px; border-radius: 999px;
	background: var(--krve-forest); color: #fff !important; font-weight: 700; font-size: 14px; text-decoration: none !important;
	transition: background-color .3s ease, color .3s ease, transform .1s ease-out;
}
.krve-hdr__cta:active, .krve-mnav__cta:active, .krve-ftr__btn:active { transform: scale(.97); }

.krve-hdr__burger,
.krve-hdr__burger:hover,
.krve-hdr__burger:focus {
	width: 44px; height: 44px; min-height: 0; border: 0 !important; border-radius: 12px; background: transparent !important; color: inherit !important;
	display: grid; place-content: center; gap: 6px; cursor: pointer; padding: 0 !important; box-shadow: none !important; margin: 0;
}
.krve-hdr__burger:active { background: rgba(127, 127, 127, .14) !important; }
.krve-hdr__burger span { display: block; width: 22px; height: 2px; border-radius: 2px; background: currentColor; transition: transform .45s var(--krve-spring); }

@media (min-width: 900px) {
	.krve-hdr__nav { display: block; }
	.krve-hdr__burger { display: none; }
}
@media (max-width: 420px) { .krve-hdr__cta { height: 38px; padding: 0 14px; font-size: 13px; } }

/* Stuck: material gelap (forest) + logo putih + sedikit mengecil. */
.krve-hdr.is-stuck .krve-hdr__note { max-height: 0; opacity: 0; }
.krve-hdr.is-stuck .krve-hdr__bar,
.krve-hdr.is-menu .krve-hdr__bar {
	--krve-hdr-bar: var(--krve-hdr-bar-stuck);
	background: rgba(24, 46, 35, .84); color: #fff;
	box-shadow: 0 14px 34px -20px rgba(10, 20, 15, .55);
}
.krve-hdr.is-stuck .krve-hdr__bar::after, .krve-hdr.is-menu .krve-hdr__bar::after { opacity: 0; }
.krve-hdr.is-stuck .krve-hdr__logo-dark, .krve-hdr.is-menu .krve-hdr__logo-dark { opacity: 0; }
.krve-hdr.is-stuck .krve-hdr__logo-light, .krve-hdr.is-menu .krve-hdr__logo-light { opacity: 1; }
.krve-hdr.is-stuck .krve-hdr__logo img { transform: scale(.9); }
.krve-hdr.is-stuck .krve-hdr__nav a { color: rgba(255, 255, 255, .86); }
.krve-hdr.is-stuck .krve-hdr__nav a:hover { color: #fff; background: rgba(255, 255, 255, .1); }
.krve-hdr.is-stuck .krve-hdr__cta, .krve-hdr.is-menu .krve-hdr__cta { background: var(--krve-leaf); color: var(--krve-forest) !important; }
.krve-hdr.is-menu .krve-hdr__bar { background: transparent; box-shadow: none; -webkit-backdrop-filter: none; backdrop-filter: none; }
.krve-hdr.is-menu .krve-hdr__burger span:first-child { transform: translateY(4px) rotate(45deg); }
.krve-hdr.is-menu .krve-hdr__burger span:last-child { transform: translateY(-4px) rotate(-45deg); }

.krve-hdr-space { height: var(--krve-hdr-total); }

@media (prefers-reduced-transparency: reduce) {
	.krve-hdr__bar { background: var(--krve-oat); -webkit-backdrop-filter: none; backdrop-filter: none; }
	.krve-hdr.is-stuck .krve-hdr__bar { background: var(--krve-forest-deep); }
}

/* ---------------------------------------------------------------- Menu HP */
.krve-mnav {
	position: fixed; inset: 0; z-index: 9989; background: var(--krve-forest-deep); color: #fff;
	padding: calc(var(--krve-hdr-top) + 96px) 28px calc(28px + env(safe-area-inset-bottom));
	display: flex; flex-direction: column; justify-content: space-between; overflow-y: auto;
	/* Terbuka dari tombol menu (asal yang sama dengan pemicunya). */
	clip-path: circle(0 at calc(100% - 42px) calc(var(--krve-hdr-top) + 34px));
	transition: clip-path .6s var(--krve-spring);
}
.krve-mnav.is-open { clip-path: circle(150% at calc(100% - 42px) calc(var(--krve-hdr-top) + 34px)); }
.krve-mnav ul { list-style: none; margin: 0; padding: 0; }
.krve-mnav nav li { border-bottom: 1px solid rgba(255, 255, 255, .1); }
.krve-mnav nav a {
	display: flex; align-items: center; justify-content: space-between; padding: 16px 0;
	font-family: var(--krve-serif); font-size: clamp(32px, 9vw, 44px); line-height: 1.05; letter-spacing: -.02em;
	color: #fff; text-decoration: none;
}
.krve-mnav nav a::after { content: "→"; font-family: var(--krve-sans); font-size: 20px; color: var(--krve-leaf); opacity: .7; }
.krve-mnav nav a[aria-current="page"] { color: var(--krve-leaf); }
.krve-mnav li, .krve-mnav__foot { opacity: 0; transform: translateY(18px); transition: opacity .4s ease, transform .6s var(--krve-spring); }
.krve-mnav.is-open li, .krve-mnav.is-open .krve-mnav__foot { opacity: 1; transform: none; transition-delay: calc(.12s + var(--krve-i, 0) * 50ms); }
.krve-mnav__foot { display: grid; gap: 18px; padding-top: 28px; }
.krve-mnav__cta {
	display: flex; align-items: center; justify-content: center; height: 54px; border-radius: 999px;
	background: var(--krve-leaf); color: var(--krve-forest) !important; font-weight: 700; font-size: 16px; text-decoration: none !important;
}
html.krve-lock, html.krve-lock body { overflow: hidden; }

/* ---------------------------------------------------------------- Sosial */
.krve-social { list-style: none; display: flex; gap: 10px; margin: 0; padding: 0; }
.krve-social a {
	width: 42px; height: 42px; border-radius: 50%; display: grid; place-items: center;
	border: 1px solid rgba(255, 255, 255, .22); color: #fff; transition: background-color .2s, border-color .2s, transform .1s;
}
.krve-social a:hover { background: rgba(255, 255, 255, .1); border-color: rgba(255, 255, 255, .45); }
.krve-social a:active { transform: scale(.94); }

/* ---------------------------------------------------------------- Hero panggung */
body.krve-stage-on .krve-hero { position: relative; isolation: isolate; overflow: hidden; }
body.krve-stage-on .krve-hero > * { position: relative; z-index: 1; }
/* Cahaya lembut (leaf & honey) yang bergeser sangat pelan di belakang hero. */
body.krve-stage-on .krve-hero::before,
body.krve-stage-on .krve-hero::after {
	content: ""; position: absolute; z-index: 0; border-radius: 50%; pointer-events: none;
	filter: blur(70px); will-change: transform;
}
body.krve-stage-on .krve-hero::before {
	width: 58vmax; height: 58vmax; right: -18vmax; top: -22vmax;
	background: radial-gradient(circle, rgba(168, 198, 108, .55), rgba(168, 198, 108, 0) 65%);
	animation: krve-drift-a 26s ease-in-out infinite alternate;
}
body.krve-stage-on .krve-hero::after {
	width: 44vmax; height: 44vmax; left: -16vmax; bottom: -20vmax;
	background: radial-gradient(circle, rgba(232, 176, 75, .38), rgba(232, 176, 75, 0) 65%);
	animation: krve-drift-b 32s ease-in-out infinite alternate;
}
@keyframes krve-drift-a { to { transform: translate(-6vmax, 5vmax) scale(1.08); } }
@keyframes krve-drift-b { to { transform: translate(5vmax, -4vmax) scale(1.12); } }

/* Skala tipografi hero jauh lebih besar dari section lain. */
body.krve-stage-on .krve-hero:not(.krve-pagehero) .krve-display {
	font-size: clamp(44px, 5vw, 80px); line-height: 1; letter-spacing: -.028em;
}
@media (min-width: 900px) {
	body.krve-stage-on .krve-hero-block--split .krve-hero__grid,
	body.krve-stage-on .krve-hero-block--mcover .krve-hero__grid { grid-template-columns: 52fr 48fr; }
}
body.krve-stage-on .krve-hero .krve-lead { font-size: clamp(17px, 1.5vw, 20px); max-width: 30ch; }
body.krve-stage-on .krve-hero-block--split .krve-hero__media,
body.krve-stage-on .krve-hero-block--mcover .krve-hero__media {
	border-radius: var(--krve-radius);
	box-shadow: 0 50px 90px -42px rgba(31, 58, 44, .6), 0 18px 36px -24px rgba(31, 58, 44, .35);
}
@media (max-width: 899px) {
	body.krve-stage-on .krve-hero-block--mcover .krve-hero__media { box-shadow: none; }
}
@media (min-width: 900px) {
	body.krve-stage-on .krve-hero {
		min-height: calc(100svh - var(--krve-hdr-total) - var(--krve-hdr-top));
		display: flex; flex-direction: column; justify-content: center;
	}
	body.krve-stage-on .krve-hero > .krve-hero-block { width: 100%; }
	body.krve-stage-on .krve-hero .krve-hero__media { perspective: 1200px; }
}

/* Sticky + kartu berikutnya naik menutupi hero (diaktifkan JS → .krve-stage-ready). */
body.krve-stage-ready .krve-hero { position: sticky; top: var(--krve-stick, 0px); z-index: 0; }
body.krve-stage-ready .krve-hero { margin-bottom: 0 !important; }
body.krve-stage-ready .krve-hero ~ * { position: relative; z-index: 1; margin-top: 0 !important; margin-bottom: 0 !important; }
body.krve-stage-ready .krve-hero > * {
	transform: translateY(calc(var(--krve-cover, 0) * -24px)) scale(calc(1 - var(--krve-cover, 0) * .05));
	opacity: calc(1 - var(--krve-cover, 0) * .55);
	transform-origin: 50% 35%; will-change: transform, opacity;
}
body.krve-stage-ready .krve-hero ~ .krve-sheet-top {
	border-radius: 32px 32px 0 0; margin-top: -32px !important;
	box-shadow: 0 -26px 50px -30px rgba(31, 58, 44, .4);
}

@media (prefers-reduced-motion: reduce) {
	body.krve-stage-on .krve-hero::before, body.krve-stage-on .krve-hero::after { animation: none; }
	.krve-hdr__bar, .krve-hdr__logo img, .krve-hdr__note, .krve-mnav, .krve-mnav li, .krve-mnav__foot { transition-duration: .01s !important; }
	.krve-mnav { clip-path: none; opacity: 0; transition: opacity .2s !important; }
	.krve-mnav.is-open { clip-path: none; opacity: 1; }
}

/* ---------------------------------------------------------------- Footer */
.krve-ftr {
	position: relative; overflow: hidden; z-index: 2; background: var(--krve-forest-deep); color: rgba(233, 239, 230, .78);
	padding-top: 64px; font-size: 15px;
}
.krve-ftr__wrap { position: relative; z-index: 1; padding: 0 var(--krve-pad-x); }
.krve-ftr a { color: #fff; text-decoration: none; }
.krve-ftr__cta {
	display: grid; gap: 24px; padding-bottom: 44px; border-bottom: 1px solid rgba(255, 255, 255, .12);
}
.krve-ftr__title {
	margin: 0; font-family: var(--krve-serif); font-weight: 600; color: #fff;
	font-size: clamp(36px, 5.6vw, 72px); line-height: 1; letter-spacing: -.025em; max-width: 14ch;
}
.krve-ftr__title em { font-style: italic; font-weight: 500; color: var(--krve-honey); }
.krve-ftr__actions { display: flex; flex-wrap: wrap; gap: 10px; }
.krve-ftr__btn {
	display: inline-flex; align-items: center; height: 50px; padding: 0 22px; border-radius: 999px;
	background: var(--krve-leaf); color: var(--krve-forest) !important; font-weight: 700; transition: transform .1s, background-color .2s;
}
.krve-ftr__btn:hover { background: #b8d47e; }
.krve-ftr__btn--ghost { background: transparent; color: #fff !important; box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .3); }
.krve-ftr__btn--ghost:hover { background: rgba(255, 255, 255, .08); }
@media (min-width: 900px) {
	.krve-ftr { padding-top: 88px; }
	.krve-ftr__cta { grid-template-columns: 1fr auto; align-items: end; padding-bottom: 56px; }
}

.krve-ftr__grid { display: grid; gap: 32px; padding: 40px 0; }
@media (min-width: 700px) { .krve-ftr__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 1000px) { .krve-ftr__grid { grid-template-columns: 1.5fr 1fr 1fr 1.2fr; gap: 40px; padding: 56px 0; } }
.krve-ftr__brand p { margin: 16px 0 20px; max-width: 34ch; line-height: 1.55; }
.krve-ftr__logo { height: 28px; width: auto; display: block; }
.krve-ftr__logo.is-invert { filter: brightness(0) invert(1); }
.krve-ftr__col h2 {
	margin: 0 0 14px; font-family: var(--krve-sans); font-size: 12px; font-weight: 700;
	letter-spacing: .16em; text-transform: uppercase; color: var(--krve-leaf);
}
.krve-ftr__col ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 10px; }
.krve-ftr__col a { opacity: .86; transition: opacity .2s; background: linear-gradient(currentColor, currentColor) 0 100% / 0 1px no-repeat; transition: background-size .35s var(--krve-spring), opacity .2s; }
.krve-ftr__col a:hover { opacity: 1; background-size: 100% 1px; }
.krve-ftr__info li { display: grid; gap: 2px; }
.krve-ftr__info span { font-size: 12px; color: rgba(233, 239, 230, .55); }

.krve-ftr__bottom {
	display: flex; flex-wrap: wrap; justify-content: space-between; gap: 12px;
	padding: 20px 0 24px; border-top: 1px solid rgba(255, 255, 255, .12); font-size: 13px; color: rgba(233, 239, 230, .6);
}
.krve-ftr__top { opacity: .8; }
.krve-ftr__top:hover { opacity: 1; }

/* Wordmark raksasa di dasar footer, naik saat terlihat. */
.krve-ftr__mark { color: rgba(255, 255, 255, .06); line-height: 0; padding: 0 var(--krve-pad-x); margin-bottom: -1.2%; }
.krve-ftr__mark svg { width: 100%; height: auto; display: block; }
.krve-ftr__dot { fill: rgba(168, 198, 108, .4); }
.krve-motion .krve-ftr__mark svg { transform: translateY(40%); transition: transform 1.4s var(--krve-spring); }
.krve-motion .krve-ftr.is-in .krve-ftr__mark svg { transform: none; }
.krve-motion .krve-ftr__cta, .krve-motion .krve-ftr__grid > * { opacity: 0; transform: translateY(20px); }
.krve-motion .krve-ftr.is-in .krve-ftr__cta,
.krve-motion .krve-ftr.is-in .krve-ftr__grid > * {
	opacity: 1; transform: none; transition: opacity .6s ease, transform .9s var(--krve-spring);
}
.krve-motion .krve-ftr.is-in .krve-ftr__grid > * { transition-delay: calc(.1s + var(--krve-i, 0) * 80ms); }

/* Ruang agar bar "Daftar pesanan" tidak menutupi isi footer. */
body.krve-has-ftr .krve-ftr__bottom { padding-bottom: calc(24px + env(safe-area-inset-bottom)); }