/*
   Wartek Pasar Rebo — Theme Override
   Design philosophy: Rute Rindang Pasar Rebo.
   The reference base and responsive CSS structures remain unchanged.
*/
:root {
    --primary-dark: #21384a;
    --primary: #2f806d;
    --primary-light: #84bfa9;
    --accent-green: #d86e43;
    --accent-green-dark: #a94b27;
    --gray-50: #f8f5ed;
    --gray-100: #ebe7d8;
    --gray-200: #d9d3bf;
    --gray-300: #c7bea5;
    --gray-500: #7a7c70;
    --gray-600: #60685e;
    --gray-700: #3f514c;
    --gray-800: #2e4140;
    --gray-900: #21384a;
}

body { font-family: 'Plus Jakarta Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif; background: #fffdf7; }
.header { border-bottom-color: var(--gray-100); }
.logo-mark { background: linear-gradient(135deg, #84bfa9 0%, #21384a 100%); }
.hero, .service-hero { background: linear-gradient(135deg, #21384a 0%, #2f806d 62%, #84bfa9 100%); }
.hero::before { background-image: radial-gradient(rgba(255,253,247,.22) 1px, transparent 1px); background-size: 20px 20px; opacity: .25; }
.hero-content h1 span { color: #f3bf74; }
.hero-image { border: 8px solid rgba(216,110,67,.28); border-radius: 1.35rem; }
.service-icon { background: linear-gradient(135deg, #84bfa9 0%, #2f806d 100%); }
.service-card:hover { border-color: var(--primary-light); }
.feature-icon { background: #f8f5ed; border-color: #d9d3bf; color: var(--primary); }
.process-step::before { background: var(--accent-green); color: #fffdf7; }
.area-card:hover { border-color: var(--primary-light); color: var(--primary-dark); }
.area-card svg { color: var(--accent-green); }
.author-avatar { background: linear-gradient(135deg, #84bfa9 0%, #2f806d 100%); }
.testimonial-card::before { color: #84bfa9; }
.faq-item[open] { border-color: var(--primary-light); }
.faq-question::after { color: var(--accent-green-dark); }
.cta-section { background: linear-gradient(to right, #21384a, #2f806d) !important; }
.contact-info-icon { background: var(--primary); }
.footer { background: #21384a; }
.footer a:hover { color: #f3bf74; }
.btn { transition: all .2s cubic-bezier(.23,1,.32,1); cursor: pointer; }
.btn:active { transform: scale(.97); }
.btn-primary { background: var(--primary); border-color: var(--primary); }
.btn-primary:hover { background: var(--primary-dark); border-color: var(--primary-dark); }
.btn-secondary:hover { background: var(--primary); border-color: var(--primary); }
.btn-whatsapp { background: #168b54; border-color: #168b54; }
.btn-whatsapp:hover { background: #0f6f42; border-color: #0f6f42; }

@media (min-width: 769px) {
    .hero-image { transform: rotate(1deg); transition: transform .25s cubic-bezier(.23,1,.32,1); }
    .hero-image:hover { transform: rotate(0deg) translateY(-4px); }
}

@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; scroll-behavior: auto !important; transition-duration: .01ms !important; }
}