:root{--color-primary:#0d9488;--color-primary-dark:#0f766e;--color-primary-darker:#134e4a;--color-accent:#f59e0b;--color-accent-dark:#d97706;--color-danger:#dc2626;--color-text:#1e293b;--color-text-muted:#64748b;--color-border:#cbd5e1;--color-border-soft:#e2e8f0;--color-bg:#f8fafc;--color-bg-soft:#f1f5f9;--color-bg-muted:#e2e8f0;--gradient-hero:linear-gradient(135deg,#0d9488 0%,#0f766e 50%,#134e4a 100%);--gradient-icon:linear-gradient(135deg,#fbbf24 0%,#f59e0b 100%);--radius-md:4px;--radius-sm:2px;--shadow-sm:4px 4px 0 0 rgba(15,23,42,0.08);--shadow-md:4px 4px 0 0 rgba(15,23,42,0.12);--shadow-lg:4px 4px 0 0 rgba(15,23,42,0.18);--shadow-primary:4px 4px 0 0 rgba(13,148,136,0.4);--transition-fast:0.15s ease;--transition-base:0.15s ease;--transition-slow:0.15s ease;accent-color:#0d9488;caret-color:#0d9488}

.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-primary)}
.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:0 var(--radius-md) var(--radius-md) 0;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 var(--transition-fast)}
.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:4px;font-size:0.9em;color:var(--color-danger)}
.post-content pre{background:var(--color-primary-darker);color:#f8fafc;padding:var(--space-md);border-radius:var(--radius-md);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);border-radius:0 var(--radius-md) var(--radius-md) 0}
.toc-box ol{padding-inline-start:1.2rem}
.toc-box ol li{margin:0.4rem 0}
.toc-box ol li a{transition:all var(--transition-fast)}
.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;border-radius:var(--radius-sm);transition:all var(--transition-fast)}
.post-tags .badge:hover{background:var(--color-primary) !important;color:#f8fafc !important;transform:translateY(-1px)}
.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:#f8fafc;position:relative;overflow:hidden}
.app-hero-section::before{content:'';position:absolute;inset:0;background:rgba(15,23,42,0.15);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 var(--transition-slow);filter:drop-shadow(4px 4px 0 rgba(15,23,42,0.35))}
.app-hero-section img:hover{transform:translateY(-10px)}
.text-white-50{color:rgba(248,250,252,0.68) !important}
.app-qr-section{background:var(--color-bg-soft)}
.qr-card{transition:all var(--transition-base);border:2px solid var(--color-border-soft);border-radius:var(--radius-md)}
.qr-card:hover{transform:scale(1.03);border-color:var(--color-accent);box-shadow:4px 4px 0 0 rgba(15,23,42,0.2)}
.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;border-radius:0}
.app-install-section .bg-white{transition:all var(--transition-base);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 var(--transition-base)}
.app-install-section .bg-white:hover::before{transform:scaleY(1)}
.app-showcase-section{background:var(--color-bg)}
.app-showcase-section img{transition:transform var(--transition-slow);filter:drop-shadow(4px 4px 0 rgba(15,23,42,0.2))}
.app-showcase-section img:hover{transform:translateY(-5px) rotate(-1deg)}
.app-showcase-section .bg-white{transition:all var(--transition-base);border-inline-start:3px solid var(--color-border-soft);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 var(--transition-base);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 var(--transition-fast)}
.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 var(--transition-base);border-radius:var(--radius-md)}
.contact-quick-section .contact-card:hover{transform:translateY(-5px);box-shadow:var(--shadow-lg)}
.contact-quick-section .contact-card i{transition:transform var(--transition-base)}
.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);border-radius:0;transition:all var(--transition-fast)}
.contact-form-section .form-control:focus,.contact-form-section .form-select:focus{border-color:var(--color-primary);box-shadow:4px 4px 0 0 rgba(13,148,136,0.25)}
.contact-form-section button[type="submit"]{transition:all var(--transition-base);border-radius:0}
.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 var(--transition-base);text-align:center;border-radius:var(--radius-md)}
.contact-commitments-section .bg-white:hover{transform:translateY(-5px);box-shadow:var(--shadow-lg)}
.contact-commitments-section .bg-white i{transition:transform var(--transition-base)}
.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;border-radius:0}
main:has(> .container > .bg-white > form) .input-group .form-control{border-inline-start:none;border-radius:0}
main:has(> .container > .bg-white > form) .input-group:focus-within .input-group-text{border-color:var(--color-primary);background-color:#f0fdfa}
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);border-radius:0}
main:has(> .container > .bg-white > form) button[type="submit"]{transition:all var(--transition-base);font-weight:600;border-radius:0}
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 var(--transition-base);border-radius:0}
.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(248,250,252,0.18);color:#f8fafc}
::-webkit-scrollbar{width:10px;height:10px}
::-webkit-scrollbar-track{background:var(--color-bg-muted)}
::-webkit-scrollbar-thumb{background:#14b8a6;border-radius:2px}
::-webkit-scrollbar-thumb:hover{background:var(--color-text-muted)}
*{scrollbar-width:thin;scrollbar-color:#14b8a6 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:#111111 !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:#111111 !important}
a[href^="http"]::after{content:" (" attr(href) ")";font-size:9pt;color:#4b5563}
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:#111111 !important}
p,li{orphans:3;widows:3}
}
@keyframes fadeInUp{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}
@keyframes pulse{0%,100%{transform:scale(1)}50%{transform:scale(1.05)}}
.animate-fade-in{animation:fadeInUp 0.3s ease-out}
.animate-pulse{animation:pulse 1.5s 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;
        transition: color 0.15s ease;
    }

    .app-hero-section .badge.bg-warning {
        font-size: 0.85rem;
        background-color: #f59e0b;
        color: #292524;
        border: 2px solid #292524;
        border-radius: 3px;
        box-shadow: 4px 4px 0 0 #292524;
        transition: box-shadow 0.15s ease, background-color 0.15s ease;
    }

    .contact-channels-section article,
    .contact-quick-section .contact-card {
        padding: var(--space-md) !important;
        background-color: #fafaf9;
        border: 2px solid #292524;
        border-radius: 3px;
        box-shadow: 4px 4px 0 0 #292524;
        transition: box-shadow 0.15s ease, border-color 0.15s ease, background-color 0.15s ease;
    }
}