/* /gov_public_portal/static/src/scss/landing_public.scss */
 @keyframes sapo-ai-pulse{0%{box-shadow: 0 0 0 0 rgba(16, 185, 129, 0.5);}70%{box-shadow: 0 0 0 8px rgba(16, 185, 129, 0);}100%{box-shadow: 0 0 0 0 rgba(16, 185, 129, 0);}}@keyframes sapo-float{0%, 100%{transform: translate(-50%, -50%) translateY(0);}50%{transform: translate(-50%, -50%) translateY(-8px);}}.sapo-landing{--sapo-orange: #e85d04; --sapo-orange-soft: #fff3e8; --sapo-orange-glow: rgba(232, 93, 4, 0.18); --sapo-ai-cyan: #0c6e82; --sapo-ai-violet: #5b21b6; --sapo-ai-mint: #047857; --sapo-bg: #f8f9fc; --sapo-bg-hero: #f8f9fc; --sapo-hero-overlay: rgba(12, 110, 130, 0.04); --sapo-surface-solid: #ffffff; --sapo-text: #1a1a2e; --sapo-muted: #5a6578; --sapo-border: rgba(26, 32, 44, 0.12); --sapo-border-ai: rgba(12, 110, 130, 0.22); --sapo-shadow: 0 2px 12px rgba(26, 32, 44, 0.06); --sapo-shadow-lg: 0 16px 48px rgba(26, 32, 44, 0.08); --sapo-live: #047857; --sapo-header-bg: rgba(255, 255, 255, 0.94); --sapo-grid-color: rgba(12, 110, 130, 0.05); --sapo-karo-stroke: rgba(26, 32, 44, 0.1); --sapo-card-border: rgba(232, 93, 4, 0.22); --sapo-link: #0c6e82; font-family: 'Plus Jakarta Sans', sans-serif; background: var(--sapo-bg); color: var(--sapo-text); line-height: 1.6;}.sapo-landing a{color: var(--sapo-link); text-decoration: none;}.sapo-landing a:hover{color: var(--sapo-orange);}.sapo-landing.sapo-tech-grid, .sapo-landing .sapo-tech-grid{background-image: linear-gradient(var(--sapo-grid-color) 1px, transparent 1px), linear-gradient(90deg, var(--sapo-grid-color) 1px, transparent 1px); background-size: 48px 48px;}.sapo-landing .sapo-karo-weave{height: 100%; background-image: repeating-linear-gradient(45deg, transparent, transparent 8px, var(--sapo-karo-stroke) 8px, var(--sapo-karo-stroke) 9px), repeating-linear-gradient(-45deg, transparent, transparent 8px, var(--sapo-karo-stroke) 8px, var(--sapo-karo-stroke) 9px); opacity: 0.5;}.sapo-landing .site-header{position: sticky; top: 0; z-index: 200; display: flex; align-items: center; justify-content: space-between; padding: 14px clamp(16px, 4vw, 40px); background: var(--sapo-header-bg); backdrop-filter: blur(16px); border-bottom: 1px solid var(--sapo-border);}.sapo-landing .brand img{height: 52px; width: auto; object-fit: contain;}.sapo-landing .nav-actions{display: flex; align-items: center; gap: 10px;}.sapo-landing .btn{display: inline-flex; align-items: center; gap: 8px; padding: 11px 20px; border-radius: 12px; font-weight: 700; font-size: 0.875rem; border: none; cursor: pointer; transition: all 0.2s;}.sapo-landing .btn-primary{background: var(--sapo-orange); color: #fff; box-shadow: 0 4px 20px var(--sapo-orange-glow);}.sapo-landing .btn-primary:hover{transform: translateY(-1px); color: #fff;}.sapo-landing .btn-ghost{background: var(--sapo-surface-solid); color: var(--sapo-text); border: 1px solid var(--sapo-border);}.sapo-landing .btn-ghost:hover{color: var(--sapo-orange);}.sapo-landing .theme-toggle{width: 42px; height: 42px; border-radius: 12px; border: 1px solid var(--sapo-border); background: var(--sapo-surface-solid); color: var(--sapo-text); cursor: pointer; display: inline-flex; align-items: center; justify-content: center; font-size: 1rem; padding: 0;}.sapo-landing .theme-toggle .fa{pointer-events: none;}.sapo-landing .hero{position: relative; overflow: hidden; padding: clamp(40px, 6vw, 80px) clamp(16px, 4vw, 40px); background: var(--sapo-bg-hero);}.sapo-landing .hero::before{content: ''; position: absolute; inset: 0; background: var(--sapo-hero-overlay); pointer-events: none;}.sapo-landing .hero-grid{position: relative; z-index: 1; max-width: 1200px; margin: 0 auto; display: grid; grid-template-columns: 1fr 1fr; gap: clamp(32px, 5vw, 64px); align-items: center;}@media (max-width: 900px){.sapo-landing .hero-grid{grid-template-columns: 1fr; text-align: center;}.sapo-landing .hero-grid .hero-cta, .sapo-landing .hero-grid .hero-chips{justify-content: center;}.sapo-landing .hero-grid .hero-visual{order: -1;}.sapo-landing .hero-grid .hero-app-count{justify-content: center;}}.sapo-landing .ai-badge{display: inline-flex; align-items: center; gap: 8px; padding: 6px 14px 6px 8px; border-radius: 999px; background: var(--sapo-surface-solid); border: 1px solid var(--sapo-border-ai); font-size: 0.75rem; font-weight: 700; letter-spacing: 0.02em; color: var(--sapo-ai-cyan); margin-bottom: 20px; box-shadow: var(--sapo-shadow);}.sapo-landing .ai-badge .pulse{width: 8px; height: 8px; border-radius: 50%; background: var(--sapo-ai-mint); flex-shrink: 0; animation: sapo-ai-pulse 2s infinite;}.sapo-landing .hero h1{font-size: clamp(1.85rem, 4.5vw, 2.75rem); font-weight: 800; letter-spacing: -0.035em; line-height: 1.15; margin-bottom: 16px;}.sapo-landing .hero h1 em{font-style: normal; color: var(--sapo-orange);}.sapo-landing .hero-lead{font-size: 1.05rem; color: var(--sapo-muted); max-width: 480px; margin-bottom: 28px;}@media (max-width: 900px){.sapo-landing .hero-lead{margin-left: auto; margin-right: auto;}}.sapo-landing .hero-cta{display: flex; flex-wrap: wrap; gap: 12px; margin-bottom: 24px;}.sapo-landing .hero-chips{display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 16px;}.sapo-landing .hero-app-count{display: inline-flex; align-items: center; gap: 8px; font-size: 0.78rem; font-weight: 600; color: var(--sapo-muted); margin: 0;}.sapo-landing .hero-app-count i{color: var(--sapo-orange);}.sapo-landing .chip{display: inline-flex; align-items: center; gap: 6px; padding: 7px 14px; border-radius: 999px; font-size: 0.78rem; font-weight: 600; background: var(--sapo-surface-solid); border: 1px solid var(--sapo-border); color: var(--sapo-muted);}.sapo-landing .chip i{color: var(--sapo-orange); font-size: 0.72rem;}.sapo-landing .hero-visual{position: relative; display: flex; justify-content: center; align-items: center;}.sapo-landing .logo-stage{position: relative; padding: 32px; min-height: 280px; display: flex; align-items: center; justify-content: center;}.sapo-landing .logo-stage > .sapo-logo{position: relative; z-index: 2; max-width: min(420px, 100%); height: auto;}.sapo-landing .float-nodes{position: absolute; inset: 0; z-index: 3; pointer-events: none;}.sapo-landing .float-node{position: absolute; z-index: 3; transform: translate(-50%, -50%); display: inline-flex; align-items: center; gap: 5px; padding: 8px 12px; border-radius: 10px; background: var(--sapo-surface-solid); border: 1px solid var(--sapo-border-ai); font-size: 0.68rem; font-weight: 700; box-shadow: var(--sapo-shadow); white-space: nowrap; animation: sapo-float 5s ease-in-out infinite;}.sapo-landing .float-node i{color: var(--sapo-ai-violet); font-size: 0.85rem;}.sapo-landing .float-node .float-node-img{width: 16px; height: 16px; object-fit: contain;}.sapo-landing .float-node-more{background: var(--sapo-orange-soft); border-color: var(--sapo-orange); color: var(--sapo-orange); animation: none;}.sapo-landing .karo-divider{height: 28px; margin: 0; background: var(--sapo-orange-soft); border-top: 1px solid var(--sapo-border); border-bottom: 1px solid var(--sapo-border);}.sapo-landing .integration-strip{max-width: 1200px; margin: 0 auto; padding: 40px clamp(16px, 4vw, 40px);}.sapo-landing .integration-strip h2{text-align: center; font-size: 0.72rem; font-weight: 800; letter-spacing: 0.12em; text-transform: uppercase; color: var(--sapo-muted); margin-bottom: 24px;}.sapo-landing .hub-diagram{display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 12px;}.sapo-landing .hub-node, .sapo-landing .hub-center, .sapo-landing .hub-meta{padding: 14px 20px; border-radius: 14px; background: var(--sapo-surface-solid); border: 1px solid var(--sapo-border); font-size: 0.82rem; font-weight: 700; box-shadow: var(--sapo-shadow); display: inline-flex; align-items: center; gap: 6px;}.sapo-landing .hub-node i, .sapo-landing .hub-center i, .sapo-landing .hub-meta i{color: var(--sapo-ai-cyan);}.sapo-landing .hub-node .hub-node-img, .sapo-landing .hub-center .hub-node-img, .sapo-landing .hub-meta .hub-node-img{width: 18px; height: 18px; object-fit: contain;}.sapo-landing .hub-center{background: var(--sapo-orange); color: #fff; border: none; padding: 16px 24px;}.sapo-landing .hub-center i{color: #fff;}.sapo-landing .hub-connector{width: 32px; height: 2px; background: var(--sapo-border); opacity: 0.6;}.sapo-landing .hub-node-meta{color: var(--sapo-muted); font-size: 0.75rem;}.sapo-landing .section{max-width: 1200px; margin: 0 auto; padding: 48px clamp(16px, 4vw, 40px);}.sapo-landing .live-badge{display: inline-flex; align-items: center; gap: 6px; font-size: 0.7rem; font-weight: 800; text-transform: uppercase; letter-spacing: 0.08em; color: var(--sapo-live); margin-bottom: 8px;}.sapo-landing .live-dot{width: 7px; height: 7px; border-radius: 50%; background: var(--sapo-live); animation: sapo-ai-pulse 2s infinite;}.sapo-landing .section-head h2{font-size: 1.65rem; font-weight: 800;}.sapo-landing .section-sub{font-size: 0.88rem; color: var(--sapo-muted); margin-top: 8px; max-width: 560px;}.sapo-landing .last-updated{font-size: 0.8rem; color: var(--sapo-muted); margin-top: 6px;}.sapo-landing .metric-grid{display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); gap: 20px;}.sapo-landing .metric-empty{grid-column: 1 / -1; text-align: center; color: var(--sapo-muted); padding: 32px;}.sapo-landing .metric-card-wrap{border-radius: 18px;}.sapo-landing .metric-card{background: var(--sapo-surface-solid); border: 1px solid var(--sapo-border); border-radius: 18px; padding: 22px 22px 20px; height: 100%; box-shadow: var(--sapo-shadow); transition: transform 0.2s, box-shadow 0.2s;}.sapo-landing .metric-card:hover{transform: translateY(-2px); box-shadow: var(--sapo-shadow-lg);}.sapo-landing .metric-card .metric-card-top{display: flex; align-items: flex-start; justify-content: space-between; margin-bottom: 14px;}.sapo-landing .metric-card .icon{width: 46px; height: 46px; border-radius: 12px; display: flex; align-items: center; justify-content: center; background: var(--sapo-orange-soft); color: var(--sapo-orange); font-size: 1.15rem; flex-shrink: 0;}.sapo-landing .metric-card .metric-type{font-size: 0.68rem; font-weight: 800; letter-spacing: 0.06em; color: var(--sapo-muted); padding: 4px 8px; border-radius: 6px; border: 1px solid var(--sapo-border);}.sapo-landing .metric-card .label{font-size: 0.82rem; font-weight: 600; color: var(--sapo-muted); margin-bottom: 8px; line-height: 1.35;}.sapo-landing .metric-card .value{font-size: 2rem; font-weight: 800; letter-spacing: -0.03em; color: var(--sapo-text); font-variant-numeric: tabular-nums; line-height: 1.1; margin-bottom: 4px;}.sapo-landing .metric-card .source-footer{margin-top: 16px; padding-top: 14px; border-top: 1px solid var(--sapo-border);}.sapo-landing .metric-card .source-org{display: flex; align-items: flex-start; gap: 6px; font-size: 0.74rem; font-weight: 700; color: var(--sapo-text); line-height: 1.35;}.sapo-landing .metric-card .source-org .fa{color: var(--sapo-orange); margin-top: 2px; flex-shrink: 0;}.sapo-landing .metric-card .source-detail{font-size: 0.68rem; color: var(--sapo-muted); margin-top: 6px; line-height: 1.45; padding-left: 18px;}.sapo-landing .section-metrics{background: var(--sapo-bg);}.sapo-landing .pillars{display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px;}@media (max-width: 768px){.sapo-landing .pillars{grid-template-columns: 1fr;}}.sapo-landing .pillar{background: var(--sapo-surface-solid); border: 1px solid var(--sapo-border); border-radius: 18px; padding: 28px 24px; box-shadow: var(--sapo-shadow); border-top: 3px solid var(--sapo-orange);}.sapo-landing .pillar h3{font-size: 1.05rem; font-weight: 800; margin-bottom: 8px;}.sapo-landing .pillar p{font-size: 0.88rem; color: var(--sapo-muted);}.sapo-landing .pillar-icon{width: 48px; height: 48px; border-radius: 14px; display: flex; align-items: center; justify-content: center; background: var(--sapo-orange-soft); color: var(--sapo-orange); font-size: 1.25rem; margin-bottom: 16px;}.sapo-landing footer.sapo-footer{text-align: center; padding: 48px 24px 64px; border-top: 1px solid var(--sapo-border); background: #f1f4f9;}.sapo-landing footer.sapo-footer img{height: 44px; margin-bottom: 16px;}.sapo-landing footer.sapo-footer p{font-size: 0.82rem; color: var(--sapo-muted);}html[data-sadasapo-theme="dark"] .sapo-landing{--sapo-orange: #ff8c33; --sapo-orange-soft: rgba(255, 140, 51, 0.1); --sapo-orange-glow: rgba(255, 140, 51, 0.15); --sapo-ai-cyan: #8eb4bc; --sapo-ai-violet: #8eb4bc; --sapo-ai-mint: #5cb88a; --sapo-bg: #0f2027; --sapo-bg-hero: #0f2027; --sapo-hero-overlay: rgba(255, 255, 255, 0.03); --sapo-surface-solid: rgba(255, 255, 255, 0.06); --sapo-text: #e8f4f8; --sapo-muted: #78909c; --sapo-border: rgba(255, 255, 255, 0.1); --sapo-border-ai: rgba(255, 140, 51, 0.22); --sapo-live: #5cb88a; --sapo-header-bg: rgba(15, 32, 39, 0.96); --sapo-grid-color: rgba(255, 255, 255, 0.04); --sapo-karo-stroke: rgba(255, 255, 255, 0.08); --sapo-card-border: rgba(255, 140, 51, 0.22); --sapo-link: #8eb4bc;}html[data-sadasapo-theme="dark"] .sapo-landing .metric-card .icon{background: rgba(255, 140, 51, 0.12);}html[data-sadasapo-theme="dark"] .sapo-landing .metric-card{background: rgba(255, 255, 255, 0.05); border-color: rgba(255, 255, 255, 0.12);}html[data-sadasapo-theme="dark"] .sapo-landing .section-metrics{background: rgba(255, 255, 255, 0.02);}html[data-sadasapo-theme="dark"] .sapo-landing .float-node i{color: var(--sapo-ai-cyan);}html[data-sadasapo-theme="dark"] .sapo-landing footer.sapo-footer{background: rgba(255, 255, 255, 0.03);}