/* KINGAI national solutions — owner-supplied editorial screenshot reference.
   Scoped to the /solutions/national/ landing only. HTML contains all text.
   This page is a proposal, not proof of government contracts. */
.national-landing-page{--n-gold:#c99b4f;--n-deep:#081726;--n-ink:#111c27;--n-muted:#51616e;background:#fff;color:var(--n-ink)}
.national-landing-page .site-header{background:rgba(255,255,255,.985);height:66px;box-shadow:0 1px 7px rgba(14,25,35,.05)}
.national-landing-page .header-inner{max-width:1460px}
.national-landing-page main{overflow:clip}
.national-landing-page .footer{margin-top:0}
.king-n-landing{font-family:Inter,ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI","Noto Sans SC","PingFang SC","Microsoft YaHei",sans-serif;color:#111e2d;background:#fff}
.king-n-landing *{box-sizing:border-box}
.king-n-landing a:focus-visible{outline:3px solid #8e6327;outline-offset:4px}
.king-n-container{width:min(100% - 44px,1370px);margin-inline:auto}
.king-n-hero{position:relative;isolation:isolate;min-height:505px;color:#fff;background:#08192c;overflow:hidden}
.king-n-hero-art,.king-n-hero-shade{position:absolute;inset:0;z-index:-1}
.king-n-hero-art picture,.king-n-hero-art img{display:block;width:100%;height:100%}
.king-n-hero-art img{object-fit:cover;object-position:center 46%}
.king-n-hero-shade{background:linear-gradient(90deg,rgba(3,14,27,.97) 0%,rgba(3,15,29,.91) 28%,rgba(5,18,35,.6) 58%,rgba(8,22,36,.32) 100%),linear-gradient(0deg,rgba(5,15,27,.82),transparent 36%)}
.king-n-hero-inner{position:relative;min-height:505px;padding:58px 32px 104px;display:flex;align-items:center;justify-content:space-between;gap:48px}
.king-n-hero-copy{max-width:645px;min-width:0}
.king-n-kicker{font-size:11px;letter-spacing:.35em;color:#e8d6b7;font-weight:700;margin:0 0 22px}
.king-n-hero h1{font-size:clamp(38px,4.4vw,66px);line-height:1.14;letter-spacing:-.045em;max-width:690px;margin:0 0 20px;font-weight:780;color:#fff;text-wrap:balance}
.king-n-hero h1 em{font-style:normal;color:#f6cf83}
.king-n-hero .king-n-lead{font-size:clamp(13px,1.12vw,17px);line-height:1.95;color:#ecf0f3;max-width:600px;margin:0}
.king-n-buttons{display:flex;gap:14px;flex-wrap:wrap;margin-top:25px}
.king-n-button{border-radius:40px;display:inline-flex;align-items:center;justify-content:center;gap:13px;min-height:45px;max-width:100%;padding:11px 23px;font-size:13px;font-weight:750;text-decoration:none;white-space:normal;transition:transform .18s ease,background .18s ease}
.king-n-button:hover{transform:translateY(-2px)}
.king-n-button--gold{color:#181711;background:linear-gradient(135deg,#fff0c3,#cf9d50);box-shadow:0 8px 26px rgba(207,162,82,.13)}
.king-n-button--gold:hover{background:linear-gradient(135deg,#fff5d7,#d6a855)}
.king-n-button--outline{color:#fff;border:1px solid rgba(255,255,255,.72);background:rgba(10,33,50,.24)}
.king-n-button--outline:hover{background:rgba(255,255,255,.14)}
.king-n-pills{width:220px;flex:0 0 220px;display:flex;flex-direction:column;gap:22px;list-style:none;margin:0;padding:0}
.king-n-pills li{padding:10px 14px;display:flex;align-items:center;gap:12px;border:1px solid rgba(255,255,255,.15);border-radius:40px;color:#f5f9fc;font-size:12px;font-weight:650;white-space:nowrap;background:linear-gradient(110deg,rgba(195,216,239,.2),rgba(7,21,38,.17));backdrop-filter:blur(8px)}
.king-n-pills svg{width:21px;height:21px;color:#e0bd7a}
.king-n-hero-note{position:absolute;bottom:85px;left:32px;color:#dce5ed;font-size:10px;letter-spacing:.02em;margin:0;opacity:.86}
.king-n-shortcuts{position:relative;z-index:3;margin-top:-68px;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:15px}
.king-n-shortcut{height:162px;position:relative;overflow:hidden;border:2px solid rgba(255,255,255,.96);box-shadow:0 8px 28px rgba(8,29,49,.14);border-radius:13px;color:#14202b;background:#f4f6f7;display:block;transition:transform .18s ease,box-shadow .18s ease}
.king-n-shortcut:hover{transform:translateY(-3px);box-shadow:0 15px 34px rgba(8,29,49,.17)}
.king-n-shortcut-photo{position:absolute;inset:0;background-size:cover;background-position:center}
.king-n-shortcut-photo-a{background-image:linear-gradient(90deg,#f9fafb 0%,rgba(249,250,251,.98) 28%,rgba(249,250,251,.25) 90%),url('/assets/national/government-services.webp')}
.king-n-shortcut-photo-b{background-image:linear-gradient(90deg,#f9fafb 0%,rgba(249,250,251,.97) 28%,rgba(249,250,251,.1) 90%),url('/assets/national/national-overview.webp')}
.king-n-shortcut-content{position:relative;z-index:1;padding:24px 29px;max-width:78%;height:100%;display:flex;flex-direction:column;align-items:flex-start;gap:5px}
.king-n-shortcut-content>svg{color:#ab7d36;width:29px;height:29px;margin-bottom:4px}
.king-n-shortcut-content strong{font-size:clamp(17px,1.85vw,24px);color:#0a111a;line-height:1.25}
.king-n-shortcut-content small{font-size:12px;font-weight:500;color:#263440;line-height:1.55;max-width:430px}
.king-n-shortcut-arrow{position:absolute;left:30px;bottom:6px;color:#b28342;font-weight:800;font-size:17px}
.king-n-section{padding-block:62px 16px}
.king-n-section-heading{text-align:center;margin:0 auto 30px;max-width:850px}
.king-n-section-heading>span{display:block;letter-spacing:.32em;color:#b58548;font-size:10px;font-weight:780;margin-bottom:10px}
.king-n-section-heading h2{font-size:clamp(27px,3vw,39px);letter-spacing:-.045em;line-height:1.2;margin:0 0 9px;color:#0b1420}
.king-n-section-heading p{font-size:14px;line-height:1.8;color:#4b5b67;margin:0}
.king-n-problems-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:11px}
.king-n-problem{height:152px;position:relative;display:block;overflow:hidden;border-radius:9px;border:1px solid #e8edf0;background:#f3f5f7;transition:transform .16s ease,box-shadow .16s ease}
.king-n-problem:hover{transform:translateY(-3px);box-shadow:0 14px 26px rgba(25,41,59,.11)}
.king-n-problem-img{position:absolute;top:0;right:0;bottom:0;width:70%;overflow:hidden}
.king-n-problem-img img{display:block;width:100%;height:100%;object-fit:cover;object-position:center}
.king-n-problem-overlay{position:absolute;inset:0;z-index:1;background:linear-gradient(90deg,rgba(252,253,253,.99) 0%,rgba(251,252,253,.95) 38%,rgba(244,247,250,.3) 100%)}
.king-n-problem-text{position:relative;z-index:2;max-width:86%;height:100%;display:flex;flex-direction:column;align-items:flex-start;padding:13px 14px 12px}
.king-n-problem-icon{color:#a57735;display:block;margin-bottom:4px;line-height:1}
.king-n-problem-icon svg{width:25px;height:25px}
.king-n-problem-text strong{color:#0d1822;font-size:clamp(13px,1.2vw,16px);line-height:1.25;margin-bottom:5px}
.king-n-problem-text>span:last-child{color:#253641;font-size:clamp(10px,.9vw,12px);line-height:1.45;max-width:26ch}
.king-n-project-section{padding-top:66px}
.king-n-projects-grid{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:10px}
.king-n-project{position:relative;display:flex;flex-direction:column;min-width:0;border:1px solid #e7e9ec;border-radius:10px;overflow:hidden;background:#fafbfc;transition:transform .18s ease,box-shadow .18s ease}
.king-n-project:hover{transform:translateY(-3px);box-shadow:0 14px 25px rgba(28,41,53,.13)}
.king-n-project-art{height:120px;overflow:hidden;position:relative;background:#dce2e7}
.king-n-project-art picture,.king-n-project-art img{display:block;width:100%;height:100%}
.king-n-project-art img{object-fit:cover;object-position:center}
.king-n-project-ref{position:absolute;top:8px;left:8px;border-radius:30px;background:rgba(12,29,44,.83);color:#ffe8bc;font-size:10px;font-weight:750;padding:3px 8px;letter-spacing:.06em}
.king-n-project-body{padding:13px 14px 12px;display:flex;flex-direction:column;flex:1;gap:5px;min-width:0}
.king-n-project-body h3{font-size:clamp(12px,1.08vw,15px);line-height:1.32;font-weight:750;letter-spacing:-.015em;color:#101922;margin:0}
.king-n-project-body p{font-size:clamp(10px,.82vw,12px);line-height:1.5;color:#3e4d58;margin:0;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.king-n-card-link{margin-top:auto;padding-top:8px;font-size:10px;font-weight:750;color:#99703a;display:flex;justify-content:space-between;gap:4px}
.king-n-card-link b{font-size:16px;font-weight:500}
.king-n-all-label{font-size:12px;text-align:center;letter-spacing:.07em;font-weight:660;color:#8e713f;margin:20px 0 0}
.king-n-flow{margin-top:38px;background:linear-gradient(160deg,#fcfcfb,#f5f7f7);border:1px solid #ebedef;border-radius:12px;padding:21px 18px 22px}
.king-n-flow h2{font-size:18px;line-height:1.3;text-align:center;color:#131e26;margin:0 0 22px;letter-spacing:-.02em}
.king-n-flow ol{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:10px}
.king-n-flow li{min-width:0;display:flex;align-items:center;flex-direction:column;gap:3px;text-align:center;position:relative}
.king-n-flow li:not(:last-child):after{content:'→';position:absolute;right:-12px;top:18px;font-size:18px;color:#b99053}
.king-n-process-icon{background:#fff4e4;color:#a6762f;width:43px;height:43px;border-radius:50%;display:flex;align-items:center;justify-content:center;margin-bottom:4px}
.king-n-process-icon svg{width:23px;height:23px}
.king-n-process-index{font-size:9px;color:#a88654;font-weight:720;letter-spacing:.11em}
.king-n-flow li strong{font-size:12px;font-weight:760;color:#111b26;line-height:1.3}
.king-n-flow li small{font-size:10px;color:#4b5b68;line-height:1.4}
.king-n-sector{margin-top:22px;position:relative;background:linear-gradient(100deg,#fff 0%,#fff 61%,rgba(248,250,252,.45) 75%),url('/assets/national/smart-city.webp') right center / 53% auto no-repeat}
.king-n-sector-inner{padding:31px 22px 40px}
.king-n-sector-copy h2{font-size:24px;margin:0 0 3px;letter-spacing:-.025em}
.king-n-sector-copy p{font-size:13px;color:#4b5865;margin:0 0 20px}
.king-n-sector-copy ul{list-style:none;display:flex;flex-wrap:wrap;gap:8px;margin:0;padding:0;max-width:935px}
.king-n-sector-copy li{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;min-width:104px;min-height:88px;border-radius:10px;background:rgba(255,255,255,.95);border:1px solid #eaf0f2;color:#2d3842;box-shadow:0 2px 9px rgba(15,29,40,.04);font-size:12px;font-weight:650;padding:12px}
.king-n-sector-copy li svg{color:#a6783b;width:24px;height:24px}
.king-n-cta{background:#08192c url('/assets/national/national-technology.webp') right 47%/cover no-repeat;position:relative;color:#fff}
.king-n-cta:before{content:'';position:absolute;inset:0;background:linear-gradient(90deg,rgba(4,13,28,.94),rgba(4,17,32,.64) 58%,rgba(6,24,43,.4))}
.king-n-cta-inner{position:relative;padding:45px 32px;display:flex;align-items:center;justify-content:space-between;gap:30px}
.king-n-cta-inner>div{max-width:720px}
.king-n-cta h2{font-size:clamp(22px,2.8vw,36px);color:#fff;margin:0 0 8px;letter-spacing:-.025em}
.king-n-cta p{font-size:13px;color:#edf2f6;line-height:1.8;margin:0 0 6px}
.king-n-cta small{font-size:10px;color:#b4c2d0}
.king-n-cta .king-n-button{flex:0 0 auto}
@media(max-width:1190px){
 .king-n-hero{min-height:455px}
 .king-n-hero-inner{min-height:455px;padding:48px 24px 101px}
 .king-n-pills{width:180px;flex-basis:180px;gap:12px}
 .king-n-pills li{font-size:11px;padding:9px}
 .king-n-shortcuts{margin-top:-62px}
 .king-n-problems-grid{gap:9px}
 .king-n-problem{height:142px}
 .king-n-projects-grid{grid-template-columns:repeat(6,minmax(0,1fr));gap:10px}
 .king-n-project-art{height:108px}
 .king-n-project-body h3{font-size:13px}
 .king-n-project-body p{font-size:11px}
 .king-n-card-link{font-size:10px}
}
@media(max-width:950px){.king-n-projects-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.king-n-project-art{height:145px}.king-n-project-body h3{font-size:15px}}
@media(max-width:820px){
 .national-landing-page .site-header{height:72px}
 .king-n-container{width:min(100% - 32px,720px)}
 .king-n-hero,.king-n-hero-inner{min-height:505px}
 .king-n-hero-inner{padding:56px 6px 117px;gap:15px}
 .king-n-hero-copy{max-width:550px}
 .king-n-hero-shade{background:linear-gradient(90deg,rgba(2,13,25,.94),rgba(3,15,29,.68) 65%,rgba(6,19,36,.34)),linear-gradient(0deg,rgba(3,13,26,.8),transparent 35%)}
 .king-n-hero-note{left:6px;bottom:81px}
 .king-n-pills{display:none}
 .king-n-shortcut-content{padding:18px 17px;max-width:95%}
 .king-n-shortcut{height:145px}
 .king-n-shortcut-content strong{font-size:17px}
 .king-n-shortcut-content small{font-size:11px}
 .king-n-shortcut-arrow{left:18px}
 .king-n-problems-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
 .king-n-problem{height:145px}
 .king-n-problem-text strong{font-size:15px}
 .king-n-problem-text>span:last-child{font-size:11px}
 .king-n-flow ol{grid-template-columns:repeat(3,1fr);row-gap:20px}
 .king-n-flow li:nth-child(3):after{display:none}
 .king-n-cta-inner{padding:36px 12px}
}
@media(max-width:620px){
 .king-n-hero,.king-n-hero-inner{min-height:568px}
 .king-n-hero-art img{object-position:center 47%}
 .king-n-hero-shade{background:linear-gradient(180deg,rgba(4,15,28,.94) 0%,rgba(5,18,33,.9) 41%,rgba(5,18,33,.45) 100%)}
 .king-n-hero-inner{align-items:flex-start;padding-top:49px;padding-bottom:117px}
 .king-n-hero h1{font-size:clamp(30px,8vw,43px);max-width:15ch}
 .king-n-hero .king-n-lead{font-size:13px;line-height:1.85}
 .king-n-kicker{letter-spacing:.18em;font-size:9px;margin-bottom:17px}
 .king-n-buttons{margin-top:22px;gap:9px}
 .king-n-button{font-size:12px;padding:10px 14px;min-height:43px}
 .king-n-shortcuts{grid-template-columns:1fr;gap:10px;margin-top:-84px}
 .king-n-shortcut{height:122px}
 .king-n-shortcut-content{padding:13px 16px;max-width:86%}
 .king-n-shortcut-content>svg{width:22px;height:22px;margin-bottom:0}
 .king-n-shortcut-content strong{font-size:17px}
 .king-n-shortcut-content small{font-size:11px}
 .king-n-shortcut-arrow{left:auto;right:14px;bottom:10px}
 .king-n-section{padding-top:47px}
 .king-n-section-heading{margin-bottom:23px}
 .king-n-section-heading h2{font-size:26px}
 .king-n-section-heading p{font-size:12px}
 .king-n-problems-grid{grid-template-columns:1fr;gap:9px}
 .king-n-problem{height:118px}
 .king-n-problem-text{padding:10px 14px;max-width:86%}
 .king-n-problem-icon svg{width:21px;height:21px}
 .king-n-problem-text strong{font-size:15px}
 .king-n-problem-text>span:last-child{font-size:11px}
 .king-n-project-section{padding-top:52px}
 .king-n-projects-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}
 .king-n-project-art{height:110px}
 .king-n-project-body{padding:10px}
 .king-n-project-body h3{font-size:13px}
 .king-n-project-body p{font-size:10px}
 .king-n-flow{margin-top:26px;padding:19px 10px}
 .king-n-flow h2{font-size:15px}
 .king-n-flow ol{grid-template-columns:repeat(2,1fr);row-gap:17px}
 .king-n-flow li:nth-child(3):after{display:block}
 .king-n-flow li:nth-child(even):after{display:none}
 .king-n-flow li strong{font-size:11px}
 .king-n-flow li small{font-size:10px}
 .king-n-sector{background:linear-gradient(90deg,rgba(255,255,255,.97),rgba(255,255,255,.85)),url('/assets/national/smart-city-mobile.webp') center/cover}
 .king-n-sector-inner{padding:28px 0}
 .king-n-sector-copy h2{font-size:22px}
 .king-n-sector-copy ul{display:grid;grid-template-columns:repeat(3,1fr);gap:7px}
 .king-n-sector-copy li{min-width:0;min-height:78px;font-size:10px;padding:9px 4px}
 .king-n-sector-copy li svg{width:21px;height:21px}
 .king-n-cta{background-size:auto 100%;background-position:center}
 .king-n-cta-inner{flex-direction:column;align-items:flex-start;padding:42px 4px}
 .king-n-cta h2{font-size:23px}
 .king-n-cta p{font-size:12px}
}
@media(max-width:350px){
 .king-n-container{width:calc(100% - 20px)}
 .king-n-hero h1{font-size:29px}
 .king-n-button{font-size:11px;padding:9px 12px}
 .king-n-shortcut-content{max-width:92%}
 .king-n-shortcut-content strong{font-size:15px}
 .king-n-shortcut-content small{font-size:10px}
 .king-n-project-art{height:95px}
 .king-n-project-body h3{font-size:12px}
}
@media(prefers-reduced-motion:reduce){.king-n-project,.king-n-shortcut,.king-n-problem,.king-n-button{transition:none!important}}
