/* Shared liquid-glass visual system across every page. */
.liquid-site {
    --liquid-blue: #66ccff;
    --liquid-white: #fefefe;
    --liquid-ink: #0f172a;
    --liquid-accent: #126f98;
    --liquid-line: rgba(95, 151, 186, .25);
    --liquid-surface: #fefefe;
    --liquid-shadow: 0 16px 38px rgba(30, 96, 137, .08), inset 0 1px 0 #fff;
    --text-primary: #0f172a;
    --text-tertiary: #475569;
    background: #fefefe;
    color: var(--liquid-ink);
}
.liquid-site :is(h1, h2, h3) { text-wrap: balance; }
.liquid-site p { text-wrap: pretty; }
.liquid-site :is(.section-eyebrow, .hero-eyebrow, .text-link) { color: var(--liquid-accent); }
.liquid-site :is(a, button, input, textarea, select):focus-visible {
    outline: 3px solid var(--liquid-accent);
    outline-offset: 4px;
}
.liquid-site a:hover { color: var(--liquid-accent); }
/* Floating navigation, with a solid mobile drawer and no nested blur layers. */
.liquid-site .navbar {
    top: 14px; left: 14px; width: calc(100% - 28px);
    padding: .9rem clamp(1rem, 3vw, 2.5rem);
    background: rgba(254, 254, 254, .92);
    border: 1px solid #d7eaf5;
    border-radius: 20px;
    box-shadow: 0 8px 28px #246f9e0c, inset 0 1px 0 #fff;
    backdrop-filter: blur(18px);
    -webkit-backdrop-filter: blur(18px);
}
.liquid-site .navbar.scrolled { padding-block: .75rem; background: #fefefef5; }
.liquid-site .nav-dropdown { background: #fefefef5; border-color: #d7eaf5; box-shadow: var(--liquid-shadow); }
.liquid-site .nav-dropdown .nav-link { display: block; }
.liquid-site .nav-link:hover { color: var(--liquid-accent); }
.liquid-site .nav-link:after { background: var(--liquid-accent); }
.liquid-site :is(.btn, .cta-btn) { border-radius: 12px; }
.liquid-site .btn-primary, .liquid-site .cta-btn {
    background: #66ccff;
    color: #0f172a;
    box-shadow: 0 8px 22px #1687bc22, inset 0 1px 0 #ffffffc0;
    border: 1px solid #66ccff;
}
.liquid-site .btn-primary:hover { color: #0f172a; box-shadow: 0 12px 28px #1687bc33, inset 0 1px 0 #fff; }
.liquid-site :is(.btn-secondary, .btn-outline) { background: #fefefed9; border-color: #a9c7d9; color: #0f172a; box-shadow: inset 0 1px 0 #fff; }
.liquid-site :is(.btn-secondary, .btn-outline):hover { background: #eaf7ff; color: #0f172a; }
/* Inner-page headers share the homepage's sculpted light and glass objects. */
.liquid-site :is(.hero, .software-hero, .error-page) {
    position: relative; isolation: isolate; overflow: hidden;
    background: radial-gradient(ellipse at 15% 25%, #d9f3ff, transparent 60%), radial-gradient(ellipse at 100% 80%, #eaf7ff, transparent 55%), #fefefe;
}
.liquid-site .hero { min-height: 460px !important; padding: 9rem 1.5rem 4.5rem; }
.liquid-site .hero-overlay { display: none; }
.liquid-site .hero-content { max-width: 1050px; padding-inline: 1rem; }
.liquid-site .hero-title { color: #0f172a; text-shadow: none; font-size: clamp(2.4rem, 5.5vw, 4.5rem); letter-spacing: -.045em; }
.liquid-site .hero-subtitle { max-width: 650px; margin-inline: auto; color: #334155; }
.page-glass-scene { position: absolute; inset: 0; z-index: -1; pointer-events: none; overflow: hidden; }
.page-glass-scene > span { position: absolute; display: block; }
.page-glass-orb {
    width: 160px; height: 160px; right: -55px; top: 90px; border-radius: 50%;
    background: radial-gradient(circle at 28% 22%, #fff, #d8f8ff 8%, #8ee3ff 20%, #46b9f6 42%, #2095e5 65%, #0873c0 85%, #6bcaff 100%);
    box-shadow: inset 6px 7px 20px #ffffffa0, inset -12px -14px 26px #005bbc35, 18px 25px 45px #3d9ddd25;
}
.page-glass-ring {
    width: 190px; height: 210px; left: -100px; bottom: -85px; border: 28px solid #b9e8ff80; border-radius: 46%; transform: rotate(-28deg);
    box-shadow: inset 3px 4px 4px #fffd, inset -6px -7px 12px #408cc766, 3px 4px 3px #fffd, 14px 25px 30px #3c90c92c;
    background: linear-gradient(120deg, #ffffff30, #55bafa0c);
}
/* Reading sections alternate subtle light, rather than competing solid bands. */
.liquid-site :is(.service-ledger, .homepage-concept, .process-section, .software-fit, .software-process, .website-process, .website-faq, .about-mission, .social-benefits, .benefits, .how-it-works, .contact-next, .work-showcase, .blog, .email-template-showcase) {
    background: #f5faff;
}
.liquid-site :is(.intro-statement, .website-hero, .website-proof, .about-location, .contact-section, .social-hero, .email-info, .case-article) { background: #fefefe; }
.liquid-site .service-ledger { border-block: 1px solid var(--liquid-line); }
.liquid-site :is(.ledger-list a, .project-stack a, .process-grid article, .service-card, .work-card, .website-kpi, .website-step, .website-proof-card, .about-mission-card, .about-location-card, .about-values div, .contact-card, .contact-form, .contact-steps div, .case-summary-card, .case-result, .emails-stat, .emails-card, .emails-step, .emails-proof-card, .templates-card, .templates-step, .social-card, .social-deliverable, .fit-card, .example-grid article, .software-steps article) {
    background: var(--liquid-surface);
    border: 1px solid var(--liquid-line);
    border-radius: 22px;
    box-shadow: var(--liquid-shadow);
}
.liquid-site :is(.ledger-list a, .project-stack a, .service-card, .work-card) {
    transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease;
}
@media (hover: hover) and (prefers-reduced-motion: no-preference) {
    .liquid-site :is(.ledger-list a, .project-stack a, .service-card, .work-card):hover {
        transform: perspective(1000px) translateY(-5px) rotateX(1deg);
        box-shadow: 0 22px 45px #1e60891a, inset 0 1px 0 #fff;
        border-color: #66ccff;
    }
}
.liquid-site :is(.blog-article, .case-article-inner) { background: #fefefe; border-color: var(--liquid-line); box-shadow: var(--liquid-shadow); }
.liquid-site .faq details { border-color: var(--liquid-line); }
.liquid-site :is(.cta-section, .final-cta, .software-quote, .testimonial-pull, .blog-cta) {
    background: #eaf7ff;
    border-block: 1px solid var(--liquid-line);
}
.liquid-site .final-cta .btn-primary { background: #66ccff; }
.liquid-site .footer {
    background: #f3faff;
    border-top: 1px solid var(--liquid-line);
}
.liquid-site .footer-brand-text { color: #66ccff; }
.liquid-site .footer-column h2 { font-size: .8rem; letter-spacing: .1em; }
.liquid-site .footer-bottom { border-color: var(--liquid-line); color: #475569; }
.liquid-site .form-field :is(input, select, textarea) { background: #fefefe; border-color: #a9c7d9; color: #0f172a; }
.liquid-site .form-row, .liquid-site .contact-grid > * { min-width: 0; }
.liquid-site .form-field :is(input, select, textarea):focus-visible { outline-offset: 2px; }
@media (prefers-reduced-motion: no-preference) {
    .page-glass-scene > span { animation: page-glass-float 12s ease-in-out infinite; }
    .page-glass-ring { animation-delay: -5s; }
}
@keyframes page-glass-float { 0%, 100% { translate: 0 0; } 50% { translate: 0 -16px; } }
@media (max-width: 768px) {
    .liquid-site .navbar { top: 10px; left: 10px; width: calc(100% - 20px); padding: .75rem 1rem; border-radius: 16px; backdrop-filter: none; -webkit-backdrop-filter: none; }
    .liquid-site .nav-menu { background: #fefefe; }
    .liquid-site .nav-dropdown .nav-link { white-space: normal; }
    .liquid-site .hero { min-height: 360px !important; padding: 8rem 1.25rem 3.5rem; }
    .liquid-site .hero-content { padding-inline: 0; }
    .page-glass-orb { width: 95px; height: 95px; top: 85px; right: -60px; }
    .page-glass-ring { width: 130px; height: 140px; border-width: 20px; left: -90px; bottom: -70px; }
    .liquid-site .footer-links { display: grid; grid-template-columns: 1fr 1fr; gap: 2rem 1rem; }
    .liquid-site .footer-column { min-width: 0; }
    .liquid-site .footer a { overflow-wrap: anywhere; }
    .liquid-site .contact-form { padding: 1.25rem; }
    .liquid-site .form-row { grid-template-columns: 1fr; }
}
@media (max-width: 380px) {
    .liquid-site .footer-links { grid-template-columns: 1fr; }
}
@media (prefers-reduced-motion: reduce) {
    .page-glass-scene > span { animation: none; }
    .liquid-site :is(.ledger-list a, .project-stack a, .service-card, .work-card) { transition: none; }
}
.liquid-site :is(.read-more, .blog-article a, .faq-contact a) { color: #126f98; }
.liquid-site :is(.brand-card, .mail-mockup, .mock-post, .template-card) {
    background: var(--liquid-surface); border: 1px solid var(--liquid-line); border-radius: 22px; box-shadow: var(--liquid-shadow);
}
.liquid-site :is(.blog-article, .case-article-inner, .privacy-content) { overflow-wrap: anywhere; }
@media (max-width: 380px) {
    .liquid-site .blog-article { padding: 1.5rem 1.25rem; }
}

/* Preserve the established word wrapping of the homepage headline. */
.liquid-site .hero-refined h1 { text-wrap: wrap; }

/* Keep CTA content inside a readable measure on every page. */
.liquid-site :is(.cta-section, .software-quote, .blog-cta) > h2 {
    max-width: 900px; margin-inline: auto;
    font-size: clamp(2rem, 4vw, 3rem); line-height: 1.15;
}
.liquid-site :is(.cta-section, .software-quote, .blog-cta) > p { max-width: 680px; margin-inline: auto; }
.liquid-site .cta-buttons .btn { max-width: 100%; text-align: center; overflow-wrap: anywhere; }