:root{--color-primary:#6d28d9;--color-primary-dark:#5b21b6;--color-primary-darker:#4c1d95;--color-accent:#f59e0b;--color-accent-dark:#d97706;--color-text:#1e293b;--color-text-muted:#64748b;--color-border:#e2e8f0;--color-border-soft:#f1f5f9;--color-bg:#ffffff;--color-bg-soft:#f8fafc;--color-bg-muted:#f1f5f9;--color-danger:#e11d48;--gradient-hero:linear-gradient(135deg,#2e1065 0%,#6d28d9 45%,#a855f7 100%);--gradient-icon:linear-gradient(135deg,#6d28d9,#a855f7);--shadow-sm:0 2px 6px rgba(15,23,42,0.04),0 8px 16px -6px rgba(15,23,42,0.08);--shadow-md:0 4px 8px rgba(15,23,42,0.05),0 20px 40px -10px rgba(15,23,42,0.12);--shadow-lg:0 8px 16px rgba(15,23,42,0.06),0 24px 48px -12px rgba(15,23,42,0.18);--shadow-primary:0 4px 12px rgba(109,40,217,0.25),0 12px 24px -8px rgba(109,40,217,0.3);--radius-md:18px;--radius-lg:24px}
.single-post{overflow:hidden}
.single-post .post-meta{font-size:0.9rem}
.single-post .post-meta i{color:var(--color-primary)}
.post-content{line-height:1.8;font-size:1.05rem;color:var(--color-text)}
.post-content :is(h2,h3,h4){margin-block:2rem 1rem;font-weight:700;color:var(--color-primary-darker);line-height:1.4}
.post-content h2{font-size:1.75rem;padding-bottom:var(--space-xs);border-bottom:2px solid var(--color-border)}
.post-content h3{font-size:1.35rem}
.post-content :is(p,li){margin-bottom:var(--space-sm)}
.post-content blockquote{border-inline-start:4px solid var(--color-primary);padding:var(--space-sm) var(--space-md);background:var(--color-bg-soft);border-radius:var(--radius-md);margin-block:var(--space-md);color:var(--color-text-muted);font-style:italic}
.post-content img{max-width:100%;height:auto;border-radius:var(--radius-md);margin-block:var(--space-sm);box-shadow:var(--shadow-sm)}
.post-content a{color:var(--color-primary);text-decoration:underline;transition:color 0.3s ease}
.post-content a:hover{color:var(--color-primary-dark)}
.post-content ul,.post-content ol{padding-inline-start:1.5rem}
.post-content code{background:var(--color-bg-muted);padding:2px 6px;border-radius:10px;font-size:0.9em;color:var(--color-danger)}
.post-content pre{background:var(--color-primary-darker);color:#fdfcfb;padding:var(--space-md);border-radius:var(--radius-lg);overflow-x:auto;margin-block:var(--space-md)}
.post-content pre code{background:transparent;color:inherit;padding:0}
.post-content table{width:100%;border-collapse:collapse;margin-block:var(--space-md)}
.post-content table th,.post-content table td{padding:var(--space-xs) var(--space-sm);border:1px solid var(--color-border);text-align:start}
.post-content table th{background:var(--color-bg-muted);font-weight:600}
.toc-box{border-inline-start:3px solid var(--color-primary)}
.toc-box ol{padding-inline-start:1.2rem}
.toc-box ol li{margin:0.4rem 0}
.toc-box ol li a{transition:all 0.3s ease}
.toc-box ol li a:hover{color:var(--color-primary-dark);text-decoration:underline !important;padding-inline-start:4px}
.post-tags .badge{background:var(--color-bg-muted) !important;color:#334155 !important;padding:6px 12px;font-weight:500;transition:all 0.3s ease;border-radius:999px}
.post-tags .badge:hover{background:var(--color-primary) !important;color:#ffffff !important;transform:translateY(-1px);box-shadow:0 4px 8px rgba(109,40,217,0.2)}
.post-nav{flex-wrap:wrap;gap:var(--space-sm)}
.post-nav .btn{max-width:100%;overflow:hidden;text-overflow:ellipsis}
.app-hero-section{background:var(--gradient-hero);color:rgba(255,255,255,0.96);position:relative;overflow:hidden}
.app-hero-section::before{content:'';position:absolute;inset:0;background:rgba(15,23,42,0.25);z-index:0}
.app-hero-section>.container{position:relative;z-index:1}
.app-hero-section h1{font-size:clamp(2rem,4vw,3rem);line-height:1.2}
.app-hero-section img{transition:transform 0.6s cubic-bezier(0.22,1,0.36,1);filter:drop-shadow(0 12px 24px rgba(15,23,42,0.25)) drop-shadow(0 32px 64px rgba(76,29,149,0.2))}
.app-hero-section img:hover{transform:translateY(-10px)}
.text-white-50{color:rgba(255,255,255,0.7) !important}
.app-qr-section{background:var(--color-bg-soft)}
.qr-card{transition:all 0.4s cubic-bezier(0.22,1,0.36,1);border:2px solid transparent;border-radius:var(--radius-lg)}
.qr-card:hover{transform:scale(1.03);border-color:var(--color-accent);box-shadow:0 8px 16px rgba(15,23,42,0.08),0 24px 48px -12px rgba(109,40,217,0.25)}
.qr-card img{image-rendering:pixelated;image-rendering:-moz-crisp-edges;image-rendering:crisp-edges}
.app-install-section{background:var(--color-bg-soft)}
.app-install-section .badge.rounded-circle{width:50px;height:50px;display:inline-flex;align-items:center;justify-content:center;font-size:1.2rem;font-weight:700}
.app-install-section .bg-white{transition:all 0.4s cubic-bezier(0.22,1,0.36,1);position:relative;overflow:hidden;border-radius:var(--radius-md)}
.app-install-section .bg-white:hover{transform:translateY(-5px);box-shadow:var(--shadow-lg)}
.app-install-section .bg-white::before{content:'';position:absolute;top:0;left:0;width:4px;height:100%;background:var(--gradient-icon);transform:scaleY(0);transform-origin:top;transition:transform 0.4s cubic-bezier(0.22,1,0.36,1)}
.app-install-section .bg-white:hover::before{transform:scaleY(1)}
.app-showcase-section{background:var(--color-bg)}
.app-showcase-section img{transition:transform 0.6s cubic-bezier(0.22,1,0.36,1);filter:drop-shadow(0 8px 16px rgba(15,23,42,0.08)) drop-shadow(0 20px 40px -10px rgba(109,40,217,0.15))}
.app-showcase-section img:hover{transform:translateY(-5px) rotate(-1deg)}
.app-showcase-section .bg-white{transition:all 0.4s cubic-bezier(0.22,1,0.36,1);border-inline-start:3px solid transparent;border-radius:var(--radius-md)}
.app-showcase-section .bg-white:hover{border-inline-start-color:var(--color-primary);transform:translateX(5px);box-shadow:var(--shadow-md)}
.contact-channels-section{background:var(--color-bg)}
.contact-channels-section article{transition:all 0.4s cubic-bezier(0.22,1,0.36,1);border:1px solid var(--color-border-soft);border-radius:var(--radius-md)}
.contact-channels-section article:hover{transform:translateY(-5px);box-shadow:var(--shadow-lg);border-color:var(--color-primary)}
.contact-channels-section article ul li{transition:padding 0.3s ease}
.contact-channels-section article ul li:hover{padding-inline-start:4px}
.contact-quick-section{background:var(--color-bg-soft)}
.contact-quick-section .contact-card{transition:all 0.4s cubic-bezier(0.22,1,0.36,1);border-radius:var(--radius-lg)}
.contact-quick-section .contact-card:hover{transform:translateY(-5px);box-shadow:var(--shadow-lg)}
.contact-quick-section .contact-card i{transition:transform 0.4s cubic-bezier(0.22,1,0.36,1)}
.contact-quick-section .contact-card:hover i{transform:scale(1.1) rotate(-5deg)}
.contact-form-section{background:var(--color-bg-soft)}
.contact-form-section .form-control,.contact-form-section .form-select{border:2px solid var(--color-border);transition:all 0.3s ease;border-radius:var(--radius-md)}
.contact-form-section .form-control:focus,.contact-form-section .form-select:focus{border-color:var(--color-primary);box-shadow:0 0 0 0.25rem rgba(109,40,217,0.12),0 8px 16px -8px rgba(109,40,217,0.2)}
.contact-form-section button[type="submit"]{transition:all 0.4s cubic-bezier(0.22,1,0.36,1);border-radius:14px}
.contact-form-section button[type="submit"]:hover{transform:translateY(-2px);box-shadow:var(--shadow-primary)}
.contact-commitments-section{background:var(--color-bg-soft)}
.contact-commitments-section .bg-white{transition:all 0.4s cubic-bezier(0.22,1,0.36,1);text-align:center;border-radius:var(--radius-lg)}
.contact-commitments-section .bg-white:hover{transform:translateY(-5px);box-shadow:var(--shadow-lg)}
.contact-commitments-section .bg-white i{transition:transform 0.4s cubic-bezier(0.22,1,0.36,1)}
.contact-commitments-section .bg-white:hover i{transform:scale(1.15)}
main:has(> .container > .bg-white > form) .input-group-text{background-color:var(--color-bg-muted);border-color:var(--color-border);border-inline-end:none}
main:has(> .container > .bg-white > form) .input-group .form-control{border-inline-start:none}
main:has(> .container > .bg-white > form) .input-group:focus-within .input-group-text{border-color:var(--color-primary);background-color:#f5f3ff}
main:has(> .container > .bg-white > form) .input-group:focus-within .form-control{border-color:var(--color-primary)}
main:has(> .container > .bg-white > form) .form-check-input:checked{background-color:var(--color-primary);border-color:var(--color-primary)}
main:has(> .container > .bg-white > form) button[type="submit"]{transition:all 0.4s cubic-bezier(0.22,1,0.36,1);font-weight:600;border-radius:14px}
main:has(> .container > .bg-white > form) button[type="submit"]:hover{transform:translateY(-2px);box-shadow:var(--shadow-primary)}
.icon-img{max-width:32px;max-height:32px;object-fit:contain}
.icon-emoji{display:inline-block;line-height:1}
.hero-buttons .btn{transition:all 0.4s cubic-bezier(0.22,1,0.36,1);border-radius:14px}
.hero-buttons .btn:hover{transform:translateY(-3px);box-shadow:var(--shadow-lg)}
.hero-buttons .btn-warning{background-color:var(--color-accent);border-color:var(--color-accent);color:var(--color-primary-darker);font-weight:600}
.hero-buttons .btn-warning:hover{background-color:var(--color-accent-dark);border-color:var(--color-accent-dark)}
.hero-buttons .btn-outline-light:hover{background-color:rgba(255,255,255,0.18);color:#ffffff}
::-webkit-scrollbar{width:10px;height:10px}
::-webkit-scrollbar-track{background:var(--color-bg-muted)}
::-webkit-scrollbar-thumb{background:#a78bfa;border-radius:999px}
::-webkit-scrollbar-thumb:hover{background:#8b5cf6}
*{scrollbar-width:thin;scrollbar-color:#a78bfa var(--color-bg-muted)}
@media print{:is(.header,.footer,.sidebar-widgets,.social-share,#back-to-top,.breadcrumb-nav,.notice-bar,.cta-banner-section,.post-nav,.related-posts,.author-box,.pagination,.navbar-toggler,.nav-item){display:none !important}body{background:#ffffff !important;color:#111827 !important;font-size:12pt}.single-post{box-shadow:none !important;border:none !important;padding:0 !important;max-width:100% !important}.post-content{font-size:11pt;line-height:1.6}a{text-decoration:underline;color:#111827 !important}a[href^="http"]::after{content:" (" attr(href) ")";font-size:9pt;color:#6b7280}a[href^="#"]::after,a[href^="javascript:"]::after,a[href^="mailto:"]::after,a[href^="tel:"]::after{content:""}.post-content img{max-width:100% !important;page-break-inside:avoid}:is(h1,h2,h3,h4){page-break-after:avoid;color:#111827 !important}p,li{orphans:3;widows:3}}
@keyframes fadeInUp{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:translateY(0)}}
@keyframes pulse{0%,100%{transform:scale(1)}50%{transform:scale(1.04)}}
.animate-fade-in{animation:fadeInUp 0.5s cubic-bezier(0.22,1,0.36,1)}
.animate-pulse{animation:pulse 2.5s ease-in-out infinite}
@media (max-width:991.98px){.post-content{font-size:1rem}.post-content h2{font-size:1.5rem}.post-content h3{font-size:1.2rem}}
@media (max-width:767.98px){.single-post{padding:var(--space-md) !important}.post-content{font-size:0.95rem}.post-content h2{font-size:1.35rem}.post-nav{flex-direction:column}.post-nav .btn{width:100%}.post-tags .badge{font-size:0.8rem;padding:4px 8px}.app-hero-section h1{font-size:1.75rem}.app-install-section .badge.rounded-circle{width:40px;height:40px;font-size:1rem}.toc-box{padding:var(--space-sm) !important}.qr-card img{max-width:140px !important}}

@media (max-width: 575.98px) {
    .app-hero-section .row .col-lg-7 {
        text-align: center;
        background: rgba(42, 61, 82, 0.06);
        border-radius: 18px;
        box-shadow: 0 4px 8px rgba(0, 0, 0, 0.05), 0 20px 40px -10px rgba(0, 0, 0, 0.12);
        transition: background 0.4s ease, box-shadow 0.4s ease;
    }

    .app-hero-section .badge.bg-warning {
        font-size: 0.85rem;
        background: linear-gradient(145deg, #e9b872, #d98d3a);
        color: #2b2118;
        border-radius: 999px;
        box-shadow: 0 4px 8px rgba(0, 0, 0, 0.05), 0 20px 40px -10px rgba(0, 0, 0, 0.12);
        transition: box-shadow 0.4s ease, background 0.4s ease;
    }

    .contact-channels-section article,
    .contact-quick-section .contact-card {
        padding: var(--space-md) !important;
        background: rgba(255, 255, 255, 0.05);
        border-radius: 20px;
        box-shadow: 0 4px 8px rgba(0, 0, 0, 0.05), 0 20px 40px -10px rgba(0, 0, 0, 0.12);
        transition: box-shadow 0.4s ease, background 0.4s ease;
    }
}