/* ── shared page helpers ── */
const PAGE = {
wrap: (bg) => ({ background: bg || '#1b1916', color: '#f0ead8', paddingTop: '72px' }),
container: { maxWidth: '1100px', margin: '0 auto', padding: '0 clamp(20px,5vw,72px)' },
section: (extra) => ({ padding: 'clamp(48px,7vw,96px) clamp(20px,5vw,72px)', maxWidth: '1100px', margin: '0 auto', ...extra }),
heading: { fontFamily: "'Cormorant Garamond', serif", fontWeight: 300 },
label: { fontFamily: "'Jost', sans-serif", fontSize: '10px', letterSpacing: '0.22em', textTransform: 'uppercase', color: 'rgba(196,163,85,0.8)', marginBottom: '16px', display: 'block' },
body: { fontFamily: "'Jost', sans-serif", fontSize: '14px', color: 'rgba(240,234,216,0.5)', lineHeight: 1.85, fontWeight: 300 },
h1: { fontFamily: "'Cormorant Garamond', serif", fontSize: 'clamp(36px,5vw,72px)', fontWeight: 300, margin: '0 0 24px', letterSpacing: '-0.01em' },
h2: { fontFamily: "'Cormorant Garamond', serif", fontSize: 'clamp(24px,3vw,40px)', fontWeight: 300, margin: '0 0 20px' },
divider: { height: '1px', background: 'rgba(240,234,216,0.07)', margin: '0' },
card: { background: 'rgba(240,234,216,0.03)', border: '1px solid rgba(240,234,216,0.08)', padding: 'clamp(20px,3vw,36px)' },
goldBtn: { display: 'inline-block', padding: '13px 36px', background: '#c4a355', color: '#1b1916', border: 'none', cursor: 'pointer', fontFamily: "'Jost', sans-serif", fontSize: '11px', letterSpacing: '0.18em', textTransform: 'uppercase', fontWeight: 500, textDecoration: 'none' },
outlineBtn: { display: 'inline-block', padding: '13px 36px', background: 'transparent', color: '#f0ead8', border: '1px solid rgba(240,234,216,0.25)', cursor: 'pointer', fontFamily: "'Jost', sans-serif", fontSize: '11px', letterSpacing: '0.15em', textTransform: 'uppercase', textDecoration: 'none' },
};
/* SVG Icons */
const Icon = {
Truck: () => ,
Shield: () => ,
Refresh: () => ,
Card: () => ,
Check: () => ,
Building: () => ,
Hotel: () => ,
Palette: () => ,
Eye: () => ,
Lock: () => ,
Gift: () => ,
WA: () => ,
Mail: () => ,
IG: () => ,
MapPin: () => ,
Sun: () => ,
Droplet: () => ,
Package: () => ,
Hammer: () => ,
Sparkles: () => ,
};
function useInView(threshold = 0.12) {
const ref = React.useRef(null);
const [inView, setInView] = React.useState(false);
React.useEffect(() => {
if (!ref.current) return;
const obs = new IntersectionObserver(([e]) => {
if (e.isIntersecting) { setInView(true); obs.disconnect(); }
}, { threshold });
obs.observe(ref.current);
return () => obs.disconnect();
}, []);
return [ref, inView];
}
function FadeUp({ children, delay = 0, style = {} }) {
const [ref, inView] = useInView();
return (
{children}
);
}
Object.assign(window, { PAGE, Icon, FadeUp, useInView });