/* Custom development is a separate quoted service below the plan comparison. */
.custom-development {
    --dev-bg: #eff6ff; --dev-line: #bfdbfe; --dev-ink: #0f172a;
    --dev-body: #334155; --dev-accent: #1d4ed8;
    display: grid; gap: 1.5rem; margin-top: 2rem; padding: 1.5rem;
    border: 1px solid var(--dev-line); border-radius: .75rem;
    background: var(--dev-bg); color: var(--dev-ink);
}
.dark .custom-development {
    --dev-bg: #172554; --dev-line: #1e40af; --dev-ink: #f8fafc;
    --dev-body: #cbd5e1; --dev-accent: #93c5fd;
}
.custom-development-copy { min-width: 0; }
.custom-development-label { display: block; margin-bottom: .5rem; color: var(--dev-accent); font-size: .875rem; font-weight: 700; }
.custom-development h3 { margin: 0 0 .75rem; font-size: clamp(1.375rem, 2.5vw, 1.75rem); font-weight: 800; line-height: 1.45; text-wrap: balance; }
.custom-development-copy p { max-width: 68ch; margin: 0; color: var(--dev-body); font-size: 1rem; line-height: 1.8; text-wrap: pretty; }
.custom-development-action {
    display: inline-flex; align-items: center; justify-content: center; gap: .75rem;
    min-height: 48px; padding: .75rem 1.25rem; border-radius: .5rem;
    background: #1d4ed8; color: #fff; font-size: 1rem; font-weight: 700;
    line-height: 1.5; text-decoration: none; text-align: center;
    transition: background-color .2s ease;
}
.custom-development-action:hover { background: #1e40af; }
.custom-development-action:active { background: #1e3a8a; }
.custom-development-action svg { width: 1.125rem; height: 1.125rem; flex-shrink: 0; }
[dir="rtl"] .custom-development-action svg { transform: rotate(180deg); }
.custom-development-action:focus-visible, .custom-development-faq-link:focus-visible { outline: 3px solid #2563eb; outline-offset: 3px; }
.dark .custom-development-action { background: #2563eb; }
.dark .custom-development-action:hover { background: #1d4ed8; }
.dark .custom-development-action:focus-visible, .dark .custom-development-faq-link:focus-visible { outline-color: #93c5fd; }
.custom-development-faq-copy { margin: 0; color: #475569; font-size: 1rem; line-height: 1.8; }
.dark .custom-development-faq-copy { color: #cbd5e1; }
.custom-development-faq-link { display: inline-flex; align-items: center; min-height: 44px; margin-top: .5rem; color: #1d4ed8; font-weight: 700; text-decoration: underline; text-underline-offset: .25rem; }
.dark .custom-development-faq-link { color: #93c5fd; }
#custom-development, #contactForm { scroll-margin-top: 6rem; }
#contactForm:focus-visible { outline: 2px solid #2563eb; outline-offset: 8px; border-radius: .5rem; }
.dark #contactForm:focus-visible { outline-color: #93c5fd; }
@media (min-width: 768px) {
    .custom-development { grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 2rem; padding: 2rem; }
}
@media (prefers-reduced-motion: reduce) {
    .custom-development-action { transition: none; }
    #custom-development-faq[open] > *:not(summary) { animation: none; }
}
