/* /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 .public-nav{display: flex; align-items: center; flex-wrap: wrap; justify-content: center; gap: 12px 14px; font-size: 0.82rem; font-weight: 700;}.sapo-landing .public-nav a{color: var(--sapo-text);}@media (max-width: 920px){.sapo-landing .public-nav{display: none;}}.sapo-landing .service-grid{display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px;}@media (max-width: 900px){.sapo-landing .service-grid{grid-template-columns: 1fr;}}.sapo-landing .service-card{display: block; 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); color: inherit; transition: transform 0.2s, box-shadow 0.2s;}.sapo-landing .service-card:hover{transform: translateY(-2px); box-shadow: var(--sapo-shadow-lg); color: inherit;}.sapo-landing .service-card h3{font-size: 1.15rem; font-weight: 800; margin-bottom: 8px;}.sapo-landing .service-card p{font-size: 0.88rem; color: var(--sapo-muted);}.sapo-landing .service-link{display: inline-flex; align-items: center; gap: 6px; margin-top: 16px; font-size: 0.86rem; font-weight: 800; color: var(--sapo-orange);}.sapo-landing .public-page{min-height: 60vh;}.sapo-landing .public-form-wrap{max-width: 720px; margin: 0 auto;}.sapo-landing .public-form-wrap h1{font-size: 1.8rem; font-weight: 800; margin: 8px 0 12px;}.sapo-landing .crumb{font-size: 0.8rem; font-weight: 700; color: var(--sapo-muted); margin-bottom: 8px;}.sapo-landing .track-hint{font-size: 0.88rem; margin: 12px 0 12px;}.sapo-landing .sp4n-callout{font-size: 0.88rem; margin: 0 0 20px; padding: 12px 14px; border-radius: 12px; border: 1px solid var(--sapo-border-ai); background: var(--sapo-surface-solid);}.sapo-landing .public-form{display: grid; gap: 16px; margin-top: 24px;}.sapo-landing .public-form label, .sapo-landing .public-form legend{display: block; font-size: 0.82rem; font-weight: 700;}.sapo-landing .public-form input, .sapo-landing .public-form select, .sapo-landing .public-form textarea{width: 100%; margin-top: 6px; padding: 11px 12px; border-radius: 12px; border: 1px solid var(--sapo-border); background: var(--sapo-surface-solid); color: var(--sapo-text); font-family: inherit;}.sapo-landing .public-form fieldset{border: 1px solid var(--sapo-border); border-radius: 14px; padding: 14px 16px;}.sapo-landing .public-form .btn{justify-content: center;}.sapo-landing .form-cols{display: grid; grid-template-columns: 1fr 1fr; gap: 16px;}@media (max-width: 640px){.sapo-landing .form-cols{grid-template-columns: 1fr;}}.sapo-landing .score-grid{display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px;}@media (max-width: 720px){.sapo-landing .score-grid{grid-template-columns: 1fr;}}.sapo-landing .score-row{display: flex; gap: 10px; flex-wrap: wrap; margin-top: 8px;}.sapo-landing .score-row label{display: inline-flex; align-items: center; gap: 6px; font-weight: 700;}.sapo-landing .score-row label input{width: auto; margin: 0;}.sapo-landing .form-alert{padding: 12px 14px; border-radius: 12px; font-size: 0.88rem; font-weight: 700; margin-top: 16px;}.sapo-landing .form-alert-error{background: rgba(185, 28, 28, 0.1); color: #b91c1c; border: 1px solid rgba(185, 28, 28, 0.25);}.sapo-landing .public-thanks{text-align: center; padding: 24px 0 48px;}.sapo-landing .public-thanks .pillar-icon{margin: 0 auto 16px;}.sapo-landing .public-thanks .hero-cta{justify-content: center; margin-top: 24px;}.sapo-landing .ticket-number{font-size: 1.6rem; font-weight: 800; letter-spacing: 0.04em; color: var(--sapo-orange); margin: 16px 0;}.sapo-landing .track-card{margin-top: 24px; padding: 22px; border-radius: 18px; border: 1px solid var(--sapo-border); background: var(--sapo-surface-solid); box-shadow: var(--sapo-shadow);}.sapo-landing .track-state{font-weight: 800; margin-top: 12px;}.sapo-landing .track-note{margin-top: 12px; padding-top: 12px; border-top: 1px solid var(--sapo-border); color: var(--sapo-muted);}.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);}.sapo-landing footer.sapo-footer .footer-links{margin-top: 8px;}.sapo-landing .visitor-stats{max-width: 760px; margin: 28px auto 0; padding: 20px 18px 16px; border-radius: 18px; border: 1px solid var(--sapo-border); background: var(--sapo-surface-solid); box-shadow: var(--sapo-shadow); text-align: center;}.sapo-landing .visitor-stats h3{font-size: 0.78rem; font-weight: 800; letter-spacing: 0.1em; text-transform: uppercase; color: var(--sapo-muted); margin: 0 0 14px;}.sapo-landing .visitor-stats-grid{display: grid; grid-template-columns: repeat(5, 1fr); gap: 10px;}@media (max-width: 640px){.sapo-landing .visitor-stats-grid{grid-template-columns: repeat(2, 1fr);}}.sapo-landing .visitor-stats-grid > div{display: flex; flex-direction: column; gap: 4px; padding: 8px 4px;}.sapo-landing .visitor-label{font-size: 0.68rem; font-weight: 700; color: var(--sapo-muted); text-transform: uppercase; letter-spacing: 0.04em;}.sapo-landing .visitor-value{font-size: 1.25rem; font-weight: 800; font-variant-numeric: tabular-nums; color: var(--sapo-text); letter-spacing: -0.03em;}.sapo-landing .visitor-online{display: inline-flex; align-items: center; justify-content: center; gap: 8px; margin: 12px 0 0; font-size: 0.78rem; font-weight: 700; 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);}