/*
Theme Name: Sinarindo Digital
Theme URI: https://example.com/sinarindo-digital
Author: Your Name
Author URI: https://example.com
Description: One-page WordPress theme for agency landing page.
Version: 1.0.0
Requires at least: 6.0
Tested up to: 6.5
Requires PHP: 7.4
Text Domain: sinarindo-digital
*/

* { font-family: 'Inter', sans-serif; }
html { scroll-behavior: smooth; }
body { font-family: 'Inter', sans-serif; }
section { scroll-margin-top: 6rem; }

@keyframes float { 0%,100%{transform:translateY(0)} 50%{transform:translateY(-20px)} }
@keyframes fadeUp { 0%{opacity:0;transform:translateY(30px)} 100%{opacity:1;transform:translateY(0)} }
@keyframes pulseSoft { 0%,100%{opacity:0.4;transform:scale(1)} 50%{opacity:0.7;transform:scale(1.05)} }

.anim-hidden { opacity:0; transform:translateY(30px); transition: all 0.8s cubic-bezier(0.16,1,0.3,1); }
.anim-visible { opacity:1 !important; transform:translateY(0) !important; }
.gradient-text { background: linear-gradient(135deg, #febc0d 0%, #fb923c 40%, #fed7aa 100%); -webkit-background-clip:text; -webkit-text-fill-color:transparent; background-clip:text; }
.card-hover { transition: all 0.4s cubic-bezier(0.16,1,0.3,1); }
.card-hover:hover { transform: translateY(-8px); box-shadow: 0 25px 50px -12px rgba(249,104,32,0.18); }
.nav-glass { background: rgba(255,255,255,0.88); backdrop-filter: blur(16px); -webkit-backdrop-filter: blur(16px); }
.hero-pattern { background-image: radial-gradient(circle at 20% 50%, rgba(249,104,32,0.07) 0%, transparent 50%), radial-gradient(circle at 80% 20%, rgba(251,146,60,0.05) 0%, transparent 40%), radial-gradient(circle at 60% 80%, rgba(249,104,32,0.04) 0%, transparent 40%); }
.brand-icon { background: linear-gradient(135deg, #febc0d, #fb923c); }
.problem-card { border-left: 4px solid #febc0d; }
.cta-gradient { background: linear-gradient(135deg, #febc0d 0%, #a34008 100%); }
.blob { position:absolute; border-radius:50%; filter:blur(80px); pointer-events:none; }
.site-main { overflow-x:hidden; }

.gradient-text {
    background: linear-gradient(135deg, #febc0d 0%, #fb923c 40%, #fed7aa 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}

.hero-pattern {
    background-image: radial-gradient(circle at 20% 50%, rgba(249,104,32,0.07) 0%, transparent 50%), radial-gradient(circle at 80% 20%, rgba(251,146,60,0.05) 0%, transparent 40%), radial-gradient(circle at 60% 80%, rgba(249,104,32,0.04) 0%, transparent 40%);
}

.card-hover {
    transition: all 0.4s cubic-bezier(0.16,1,0.3,1);
}

.card-hover:hover {
    transform: translateY(-8px);
    box-shadow: 0 25px 50px -12px rgba(249,104,32,0.18);
}

[data-lucide] {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 1em;
    height: 1em;
    line-height: 1;
}

[data-lucide] svg {
    width: 100%;
    height: 100%;
    display: block;
}

.opacity-0 { opacity: 0 !important; }
.opacity-100 { opacity: 1 !important; }
.animate-fade-up,
.animate-fade-up-delay,
.animate-fade-up-delay2 {
    animation: fadeUpFallback 0.8s ease-out forwards;
}
.animate-fade-up-delay { animation-delay: 0.2s; }
.animate-fade-up-delay2 { animation-delay: 0.4s; }
.animate-float,
.animate-float-delay {
    animation: floatFallback 6s ease-in-out infinite;
}
.animate-float-delay { animation-delay: 2s; }
.animate-bounce { animation: bounceFallback 1s infinite; }
.animate-pulse-soft { animation: pulseSoftFallback 3s ease-in-out infinite; }
.relative.z-10 { z-index: 10; }
.blob { z-index: 0; }
.hero-pattern { position: relative; overflow: hidden; }

@keyframes fadeUpFallback {
    0% { opacity: 0; transform: translateY(30px); }
    100% { opacity: 1; transform: translateY(0); }
}

@keyframes floatFallback {
    0%, 100% { transform: translateY(0); }
    50% { transform: translateY(-20px); }
}

@keyframes bounceFallback {
    0%, 100% { transform: translateY(0); }
    50% { transform: translateY(-8px); }
}

@keyframes pulseSoftFallback {
    0%, 100% { opacity: 0.4; transform: scale(1); }
    50% { opacity: 0.7; transform: scale(1.05); }
}

.text-brand-500 { color: #febc0d; }
.text-brand-600 { color: #e05a15; }
.text-brand-400 { color: #fb923c; }
.text-navy-900 { color: #020617; }
.text-navy-800 { color: #0f172a; }
.text-gray-400 { color: #94a3b8; }
.text-gray-500 { color: #64748b; }
.text-gray-600 { color: #475569; }
.text-gray-700 { color: #334155; }
.text-gray-800 { color: #1f2937; }
.text-white { color: #ffffff; }
.bg-brand-500 { background-color: #febc0d; }
.bg-brand-600 { background-color: #e05a15; }
.bg-brand-50 { background-color: #fff7ed; }
.bg-brand-100 { background-color: #ffedd5; }
.bg-brand-200 { background-color: #fed7aa; }
.bg-navy-800 { background-color: #0f172a; }
.bg-navy-900 { background-color: #020617; }
.bg-white { background-color: #ffffff; }
.bg-gray-50 { background-color: #f8fafc; }
.bg-gray-100 { background-color: #f1f5f9; }
.bg-gray-200 { background-color: #e2e8f0; }
.bg-gray-800 { background-color: #1f2937; }
.bg-gray-700 { background-color: #374151; }
.bg-gray-600 { background-color: #4b5563; }
.border-brand-100 { border-color: #ffedd5; }
.border-brand-200 { border-color: #fed7aa; }
.border-brand-300 { border-color: #fdba74; }
.border-gray-100 { border-color: #f3f4f6; }
.border-gray-200 { border-color: #e5e7eb; }

.entry-content {
    font-size: 1.05rem;
    line-height: 1.9;
    letter-spacing: 0.001em;
    color: #57534e;
}

.entry-content p,
.entry-content li,
.entry-content blockquote {
    line-height: 1.9;
}

.entry-content > * + * {
    margin-top: 1.25rem;
}

.entry-content h1,
.entry-content h2,
.entry-content h3,
.entry-content h4,
.entry-content h5,
.entry-content h6 {
    margin-top: 2rem;
    margin-bottom: 0.75rem;
    color: #1c1917;
    font-weight: 700;
    line-height: 1.3;
}

.entry-content p {
    margin: 0 0 1.2rem;
}

.entry-content ul,
.entry-content ol {
    padding-left: 1.25rem;
    margin: 1.25rem 0;
}

.entry-content li + li {
    margin-top: 0.45rem;
}

.entry-content blockquote {
    margin: 1.5rem 0;
    padding: 1rem 1.25rem;
    border-left: 4px solid #f59e0b;
    background: #fff7ed;
    border-radius: 1rem;
    color: #9a2c0f;
    font-style: italic;
}

.entry-content img {
    max-width: 100%;
    height: auto;
    border-radius: 1.25rem;
    margin: 1.5rem 0;
    box-shadow: 0 16px 40px rgba(15, 23, 42, 0.08);
}

.entry-content a {
    color: #d97706;
    text-decoration: none;
    font-weight: 600;
}

.entry-content a:hover {
    color: #b45309;
    text-decoration: underline;
}

.entry-content figure {
    margin: 1.5rem 0;
}

.entry-content figcaption {
    margin-top: 0.7rem;
    font-size: 0.95rem;
    text-align: center;
    color: #78716c;
}

.entry-content hr {
    border: 0;
    border-top: 1px solid #e7e5e4;
    margin: 2rem 0;
}