:root {
    --logo-brand: #30c088;
    --logo-brand-dark: #26996c;
    --logo-ink: #406860;
    --logo-soft: #e8f8f0;
    --logo-soft-2: #f0f8f8;
    --logo-border: rgba(48, 192, 136, 0.35);
    --logo-shadow: rgba(48, 192, 136, 0.35);
    --font-display: "Space Grotesk", "Work Sans", sans-serif;
    --font-body: "Work Sans", "Space Grotesk", sans-serif;
    --ink: #111826;
    --ink-soft: #273244;
    --muted: #556274;
    --line: rgba(15, 23, 42, 0.08);
    --radius-xl: 24px;
    --radius-2xl: 32px;
    --shadow-soft: 0 18px 40px -28px rgba(15, 23, 42, 0.35);
    --shadow-strong: 0 34px 60px -40px rgba(15, 23, 42, 0.45);
}

.logo-theme .page {
    font-family: var(--font-body);
    color: var(--ink);
    background-color: #f7f2ec;
    background-image:
        radial-gradient(circle at 1px 1px, rgba(15, 23, 42, 0.04) 1px, transparent 0),
        radial-gradient(circle at 12% 10%, rgba(48, 192, 136, 0.16), transparent 45%),
        radial-gradient(circle at 92% 8%, rgba(64, 104, 96, 0.16), transparent 40%),
        linear-gradient(180deg, #fdfcfb 0%, #f6f1ea 100%);
    background-size: 28px 28px, auto, auto, auto;
}

.logo-theme .page h1,
.logo-theme .page h2,
.logo-theme .page h3,
.logo-theme .page h4 {
    font-family: var(--font-display);
    letter-spacing: -0.02em;
}

.logo-theme .page main {
    max-width: 64rem;
    margin: 0 auto;
    padding: 2.5rem 1.5rem 4rem;
}

.logo-theme .page main > section {
    background: rgba(255, 255, 255, 0.9);
    border: 1px solid var(--line);
    border-radius: var(--radius-xl);
    box-shadow: var(--shadow-soft);
    padding: 2rem;
}

.logo-theme .page main > section:first-of-type {
    background: linear-gradient(140deg, rgba(48, 192, 136, 0.12), rgba(64, 104, 96, 0.12));
    border-color: var(--logo-border);
}

@media (max-width: 640px) {
    .logo-theme .page main {
        padding: 2rem 1.25rem 3rem;
    }

    .logo-theme .page main > section {
        padding: 1.5rem;
    }
}

.logo-theme .text-orange-200,
.logo-theme .text-orange-300 {
    color: var(--logo-brand) !important;
}

.logo-theme .text-orange-400,
.logo-theme .text-orange-500,
.logo-theme .text-orange-600,
.logo-theme .text-orange-700,
.logo-theme .text-orange-800,
.logo-theme .text-emerald-200,
.logo-theme .text-emerald-300,
.logo-theme .text-emerald-400,
.logo-theme .text-emerald-500,
.logo-theme .text-emerald-600,
.logo-theme .text-emerald-700,
.logo-theme .text-emerald-800,
.logo-theme .text-green-400,
.logo-theme .text-green-500,
.logo-theme .text-green-600,
.logo-theme .text-green-700,
.logo-theme .text-indigo-400,
.logo-theme .text-indigo-500,
.logo-theme .text-indigo-600,
.logo-theme .text-indigo-700,
.logo-theme .text-purple-400,
.logo-theme .text-purple-500,
.logo-theme .text-purple-600,
.logo-theme .text-purple-700,
.logo-theme .text-purple-200,
.logo-theme .text-purple-300,
.logo-theme .text-violet-200,
.logo-theme .text-violet-300,
.logo-theme .text-violet-400,
.logo-theme .text-violet-500,
.logo-theme .text-violet-600,
.logo-theme .text-violet-700,
.logo-theme .text-rose-500,
.logo-theme .text-rose-600,
.logo-theme .text-rose-700,
.logo-theme .text-red-500,
.logo-theme .text-red-600,
.logo-theme .text-red-700,
.logo-theme .text-red-800,
.logo-theme .text-red-900,
.logo-theme .text-yellow-500,
.logo-theme .text-yellow-600,
.logo-theme .text-yellow-700,
.logo-theme .text-yellow-800,
.logo-theme .text-yellow-900,
.logo-theme .text-pink-500,
.logo-theme .text-pink-600,
.logo-theme .text-blue-500,
.logo-theme .text-blue-600,
.logo-theme .text-blue-700,
.logo-theme .text-blue-800 {
    color: var(--logo-brand-dark) !important;
}

.logo-theme .bg-orange-600,
.logo-theme .bg-emerald-600,
.logo-theme .bg-indigo-600,
.logo-theme .bg-violet-600,
.logo-theme .bg-purple-600,
.logo-theme .bg-rose-600,
.logo-theme .bg-red-600,
.logo-theme .bg-yellow-600,
.logo-theme .bg-blue-600 {
    background-color: var(--logo-brand) !important;
}

.logo-theme .bg-orange-100,
.logo-theme .bg-emerald-100,
.logo-theme .bg-indigo-100,
.logo-theme .bg-violet-100,
.logo-theme .bg-purple-100,
.logo-theme .bg-rose-100,
.logo-theme .bg-red-100,
.logo-theme .bg-yellow-100,
.logo-theme .bg-blue-100 {
    background-color: var(--logo-soft) !important;
}

.logo-theme .bg-orange-50,
.logo-theme .bg-emerald-50,
.logo-theme .bg-indigo-50,
.logo-theme .bg-violet-50,
.logo-theme .bg-purple-50,
.logo-theme .bg-rose-50,
.logo-theme .bg-red-50,
.logo-theme .bg-yellow-50,
.logo-theme .bg-blue-50 {
    background-color: var(--logo-soft-2) !important;
}

.logo-theme .border-orange-100,
.logo-theme .border-orange-200,
.logo-theme .border-orange-400,
.logo-theme .border-orange-500,
.logo-theme .border-emerald-100,
.logo-theme .border-emerald-200,
.logo-theme .border-emerald-400,
.logo-theme .border-emerald-500,
.logo-theme .border-indigo-100,
.logo-theme .border-indigo-200,
.logo-theme .border-indigo-400,
.logo-theme .border-indigo-500,
.logo-theme .border-violet-100,
.logo-theme .border-violet-200,
.logo-theme .border-violet-400,
.logo-theme .border-violet-500,
.logo-theme .border-purple-100,
.logo-theme .border-purple-200,
.logo-theme .border-purple-400,
.logo-theme .border-purple-500,
.logo-theme .border-rose-100,
.logo-theme .border-rose-200,
.logo-theme .border-rose-400,
.logo-theme .border-rose-500,
.logo-theme .border-red-100,
.logo-theme .border-red-200,
.logo-theme .border-red-400,
.logo-theme .border-red-500,
.logo-theme .border-yellow-100,
.logo-theme .border-yellow-200,
.logo-theme .border-yellow-300,
.logo-theme .border-blue-100,
.logo-theme .border-blue-200,
.logo-theme .border-blue-300,
.logo-theme .border-blue-400,
.logo-theme .border-blue-500 {
    border-color: rgba(48, 192, 136, 0.55) !important;
}

.logo-theme .ring-orange-200,
.logo-theme .ring-emerald-200,
.logo-theme .ring-indigo-200,
.logo-theme .ring-violet-200,
.logo-theme .ring-purple-200,
.logo-theme .ring-rose-200,
.logo-theme .ring-red-200,
.logo-theme .ring-yellow-200,
.logo-theme .ring-blue-200 {
    --tw-ring-color: rgba(48, 192, 136, 0.25) !important;
}

.logo-theme .focus\:ring-orange-500:focus,
.logo-theme .focus\:ring-emerald-500:focus,
.logo-theme .focus\:ring-indigo-500:focus,
.logo-theme .focus\:ring-violet-500:focus,
.logo-theme .focus\:ring-purple-500:focus,
.logo-theme .focus\:ring-rose-500:focus,
.logo-theme .focus\:ring-red-500:focus,
.logo-theme .focus\:ring-yellow-500:focus,
.logo-theme .focus\:ring-blue-500:focus {
    --tw-ring-color: rgba(48, 192, 136, 0.45) !important;
}

.logo-theme .shadow-blue-200,
.logo-theme .hover\:shadow-blue-200:hover,
.logo-theme .hover\:shadow-orange-100\/50:hover {
    --tw-shadow-color: var(--logo-shadow) !important;
}

.logo-theme .hover\:bg-orange-50:hover,
.logo-theme .hover\:bg-emerald-50:hover,
.logo-theme .hover\:bg-indigo-50:hover,
.logo-theme .hover\:bg-violet-50:hover,
.logo-theme .hover\:bg-purple-50:hover,
.logo-theme .hover\:bg-rose-50:hover,
.logo-theme .hover\:bg-red-50:hover,
.logo-theme .hover\:bg-yellow-50:hover,
.logo-theme .hover\:bg-blue-50:hover {
    background-color: var(--logo-soft) !important;
}

.logo-theme .hover\:bg-orange-700:hover,
.logo-theme .hover\:bg-emerald-700:hover,
.logo-theme .hover\:bg-indigo-700:hover,
.logo-theme .hover\:bg-violet-700:hover,
.logo-theme .hover\:bg-purple-700:hover,
.logo-theme .hover\:bg-rose-700:hover,
.logo-theme .hover\:bg-red-700:hover,
.logo-theme .hover\:bg-yellow-700:hover,
.logo-theme .hover\:bg-blue-700:hover {
    background-color: var(--logo-brand-dark) !important;
}

.logo-theme .hover\:text-orange-700:hover,
.logo-theme .hover\:text-emerald-700:hover,
.logo-theme .hover\:text-indigo-700:hover,
.logo-theme .hover\:text-violet-700:hover,
.logo-theme .hover\:text-purple-700:hover,
.logo-theme .hover\:text-rose-700:hover,
.logo-theme .hover\:text-red-700:hover,
.logo-theme .hover\:text-yellow-700:hover,
.logo-theme .hover\:text-blue-700:hover {
    color: var(--logo-brand-dark) !important;
}

.logo-theme .hover\:border-orange-200:hover,
.logo-theme .hover\:border-emerald-200:hover,
.logo-theme .hover\:border-indigo-200:hover,
.logo-theme .hover\:border-violet-200:hover,
.logo-theme .hover\:border-purple-200:hover,
.logo-theme .hover\:border-rose-200:hover,
.logo-theme .hover\:border-red-200:hover,
.logo-theme .hover\:border-yellow-200:hover,
.logo-theme .hover\:border-blue-300:hover {
    border-color: rgba(48, 192, 136, 0.65) !important;
}

.logo-theme .from-orange-50,
.logo-theme .from-orange-100,
.logo-theme .hover\:from-orange-100:hover {
    --tw-gradient-from: var(--logo-soft) var(--tw-gradient-from-position);
    --tw-gradient-to: rgba(232, 248, 240, 0) var(--tw-gradient-to-position);
    --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to);
}

.logo-theme .from-rose-500 {
    --tw-gradient-from: var(--logo-brand) var(--tw-gradient-from-position);
    --tw-gradient-to: rgba(48, 192, 136, 0) var(--tw-gradient-to-position);
    --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to);
}

.logo-theme .to-orange-500 {
    --tw-gradient-to: var(--logo-brand-dark) var(--tw-gradient-to-position);
}

.logo-theme #sidebar {
    background: linear-gradient(180deg, #0f2f28 0%, #163e36 100%) !important;
    color: #d8f4ea;
}

.logo-theme #sidebar .border-slate-700,
.logo-theme #sidebar .border-slate-800 {
    border-color: rgba(48, 192, 136, 0.25) !important;
}

.logo-theme #sidebar .text-slate-300,
.logo-theme #sidebar .text-slate-400,
.logo-theme #sidebar .text-slate-500 {
    color: rgba(216, 244, 234, 0.75) !important;
}

.logo-theme #sidebar .text-white {
    color: #f4fffb !important;
}

.logo-theme #sidebar .hover\:bg-slate-800:hover {
    background-color: rgba(48, 192, 136, 0.16) !important;
}

.logo-theme #sidebar .hover\:text-white:hover {
    color: #f4fffb !important;
}

.logo-theme footer.bg-slate-900 {
    background: linear-gradient(180deg, #0f2f28 0%, #12362f 100%) !important;
    color: rgba(216, 244, 234, 0.78);
}

.logo-theme footer.bg-slate-900 .border-slate-800 {
    border-color: rgba(48, 192, 136, 0.22) !important;
}

.logo-theme footer.bg-slate-900 .text-slate-400 {
    color: rgba(216, 244, 234, 0.68) !important;
}

.logo-theme footer.bg-slate-900 .text-white,
.logo-theme footer.bg-slate-900 .hover\:text-white:hover {
    color: #f4fffb !important;
}