/* Kasurysh — gaya tambahan di atas Tailwind */

html { scroll-behavior: smooth; -webkit-tap-highlight-color: transparent; }
body { font-family: 'Outfit', ui-sans-serif, system-ui, sans-serif; font-feature-settings: "ss01"; }
::selection { background: #e0bf68; color: #0b1f16; }
[x-cloak] { display: none !important; }

/* Tajuk: Fraunces (serif warisan), teks: Outfit */
h1, h2, .font-display { font-family: 'Fraunces', Georgia, serif; font-optical-sizing: auto; font-variation-settings: "SOFT" 50; letter-spacing: -0.015em; font-weight: 600; }

/* Corak songket halus (berlian bertingkat) */
.bg-songket {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='56' height='56' viewBox='0 0 56 56'%3E%3Cg fill='none' stroke='%23d6a944' stroke-width='1'%3E%3Cpath d='M28 4 52 28 28 52 4 28Z'/%3E%3Cpath d='M28 16 40 28 28 40 16 28Z'/%3E%3Ccircle cx='28' cy='28' r='2' fill='%23d6a944'/%3E%3Cpath d='M0 0 6 6M56 0 50 6M0 56 6 50M56 56 50 50'/%3E%3C/g%3E%3C/svg%3E");
	background-size: 56px 56px;
}
.bg-songket-dark {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='56' height='56' viewBox='0 0 56 56'%3E%3Cg fill='none' stroke='%23143426' stroke-width='1'%3E%3Cpath d='M28 4 52 28 28 52 4 28Z'/%3E%3Cpath d='M28 16 40 28 28 40 16 28Z'/%3E%3Ccircle cx='28' cy='28' r='2' fill='%23143426'/%3E%3C/g%3E%3C/svg%3E");
	background-size: 56px 56px;
}

/* Corak songket halus untuk kapsul menu */
.nav-songket {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='32' height='32' viewBox='0 0 32 32'%3E%3Cg fill='none' stroke='%23c8922f' stroke-width='.8'%3E%3Cpath d='M16 2 30 16 16 30 2 16Z'/%3E%3Cpath d='M16 9 23 16 16 23 9 16Z'/%3E%3C/g%3E%3Ccircle cx='16' cy='16' r='1.3' fill='%23c8922f'/%3E%3Ccircle cx='0' cy='0' r='1' fill='%23c8922f'/%3E%3Ccircle cx='32' cy='0' r='1' fill='%23c8922f'/%3E%3Ccircle cx='0' cy='32' r='1' fill='%23c8922f'/%3E%3Ccircle cx='32' cy='32' r='1' fill='%23c8922f'/%3E%3C/svg%3E");
	background-size: 32px 32px;
	background-position: center;
	opacity: .22;
	-webkit-mask-image: linear-gradient(90deg, #000 0%, rgba(0,0,0,.35) 22%, transparent 40%, transparent 60%, rgba(0,0,0,.35) 78%, #000 100%);
	        mask-image: linear-gradient(90deg, #000 0%, rgba(0,0,0,.35) 22%, transparent 40%, transparent 60%, rgba(0,0,0,.35) 78%, #000 100%);
}

/* Teks & latar emas */
.text-gold-gradient {
	background: linear-gradient(100deg, #f5ecd0 0%, #e0bf68 30%, #c8922f 60%, #ebd79e 100%);
	-webkit-background-clip: text; background-clip: text; color: transparent;
}
.bg-gold-gradient { background: linear-gradient(120deg, #ebd79e 0%, #d6a944 45%, #c8922f 75%, #e0bf68 100%); }
.border-gold-gradient {
	border: 1px solid transparent;
	background: linear-gradient(#fff, #fff) padding-box, linear-gradient(135deg, #ebd79e, #c8922f, #ebd79e) border-box;
}

/* Garis hias "swoosh" seperti pada logo */
.swoosh { position: relative; display: inline-block; }
.swoosh > svg { position: absolute; left: -2%; bottom: -0.28em; width: 104%; height: 0.42em; }

/* Bingkai gerbang */
.arch { border-radius: 999px 999px 2rem 2rem; }

/* Marquee */
@keyframes marquee { from { transform: translateX(0); } to { transform: translateX(-50%); } }
.marquee-track { animation: marquee 38s linear infinite; width: max-content; }
.marquee:hover .marquee-track { animation-play-state: paused; }

/* Animasi muncul semasa skrol */
[data-reveal] { opacity: 0; transform: translateY(28px); transition: opacity .8s cubic-bezier(.2,.7,.2,1), transform .8s cubic-bezier(.2,.7,.2,1); transition-delay: var(--d, 0ms); }
[data-reveal].is-visible { opacity: 1; transform: none; }

/* Apungan lembut */
@keyframes floaty { 0%,100% { transform: translateY(0); } 50% { transform: translateY(-10px); } }
.floaty { animation: floaty 6s ease-in-out infinite; }
.floaty-delay { animation-delay: -3s; }

/* Putaran perlahan untuk cincin hiasan */
@keyframes spin-slow { to { transform: rotate(360deg); } }
.spin-slow { animation: spin-slow 40s linear infinite; }

/* Header bila diskrol */
#site-header.is-scrolled { padding-top: .5rem; }
#site-header.is-scrolled .nav-shell { background-color: rgba(255, 253, 247, .95); box-shadow: 0 20px 45px -15px rgba(11, 31, 22, .5); }

/* Input borang */
.field {
	width: 100%; border-radius: 1rem; border: 1px solid #dbede1; background: #fff; padding: .85rem 1.1rem;
	color: #0b1f16; transition: border-color .2s, box-shadow .2s; outline: none;
}
.field:focus { border-color: #d6a944; box-shadow: 0 0 0 4px rgba(214, 169, 68, .18); }
.field.is-invalid { border-color: #dc2626; }

@media (prefers-reduced-motion: reduce) {
	html { scroll-behavior: auto; }
	[data-reveal] { opacity: 1; transform: none; transition: none; }
	.marquee-track, .floaty, .spin-slow { animation: none; }
}