:root {
  --navy:#061a35;
  --navy-2:#0a2f61;
  --blue:#1879e6;
  --blue-dark:#0964bc;
  --teal:#0d8a8a;
  --ink:#10203a;
  --slate:#5d6b80;
  --line:#dce6f0;
  --soft:#f4f8fc;
  --soft-blue:#eaf4ff;
  --white:#fff;
  --success:#16845b;
  --shadow:0 18px 45px rgba(9,35,72,.11);
}

* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; color:var(--ink); background:var(--white); font-family:Manrope,"Noto Sans Tamil","Noto Sans Sinhala",Arial,sans-serif; line-height:1.6; }
img { display:block; max-width:100%; }
a { color:inherit; text-decoration:none; }
button,input,select,textarea { font:inherit; }
.container { width:min(1160px,calc(100% - 40px)); margin-inline:auto; }
.skip-link { position:absolute; z-index:100; top:-70px; left:16px; padding:10px 14px; color:var(--navy); border-radius:7px; background:#fff; box-shadow:var(--shadow); }
.skip-link:focus { top:16px; }
.eyebrow { display:inline-flex; align-items:center; gap:9px; color:var(--blue); font-size:.76rem; font-weight:800; letter-spacing:.12em; text-transform:uppercase; }
.eyebrow::before { width:22px; height:2px; background:currentColor; content:""; }
.topbar { color:#dceafe; background:#03142b; font-size:.77rem; }
.topbar-inner { display:flex; align-items:center; justify-content:space-between; gap:18px; min-height:36px; }
.topbar p { margin:0; }
.topbar a { color:#fff; font-weight:800; }
.site-header { position:sticky; z-index:30; top:0; border-bottom:1px solid rgba(220,230,240,.92); background:rgba(255,255,255,.96); backdrop-filter:blur(14px); }
.nav { position:relative; display:flex; align-items:center; justify-content:space-between; gap:24px; min-height:76px; }
.brand { display:inline-flex; align-items:center; gap:10px; min-width:max-content; }
.brand-mark { width:48px; height:48px; border-radius:12px; background:url("assets/kanzun-tech-logo.webp") 50% 34% / 215% auto no-repeat #fff; box-shadow:0 3px 12px rgba(6,26,53,.15); }
.brand-copy { display:grid; gap:5px; line-height:1; }
.brand-name { color:var(--navy); font-size:1rem; font-weight:800; letter-spacing:.065em; }
.brand-name span { color:var(--blue); }
.brand-subtitle { color:#69778b; font-size:.75rem; font-weight:800; letter-spacing:.12em; }
.nav-links { display:flex; align-items:center; gap:21px; color:#2f4057; font-size:.81rem; font-weight:800; }
.nav-links > a:not(.button):hover,.nav-links > a:not(.button):focus,.nav-links > a[aria-current="page"] { color:var(--blue); }
.menu-toggle { display:none; width:42px; height:42px; padding:8px; color:var(--navy); border:0; background:transparent; cursor:pointer; }
.menu-toggle svg { width:100%; height:100%; }
.language-links { display:flex; align-items:center; gap:5px; padding-left:4px; }
.language-links a { display:grid; place-items:center; min-width:31px; min-height:31px; padding:0 7px; color:#46627e; border:1px solid #d4e2ef; border-radius:6px; background:#f8fbfe; font-size:.75rem; font-weight:900; }
.language-links a:hover,.language-links a[aria-current="true"] { color:#fff; border-color:var(--blue); background:var(--blue); }
.button { display:inline-flex; align-items:center; justify-content:center; gap:8px; min-height:44px; padding:11px 18px; border:1px solid transparent; border-radius:7px; cursor:pointer; font-size:.84rem; font-weight:800; transition:transform .2s ease,background .2s ease,box-shadow .2s ease; }
.button:hover { transform:translateY(-2px); }
.button-primary { color:#fff; background:var(--blue); box-shadow:0 10px 22px rgba(24,121,230,.22); }
.button-primary:hover { background:var(--blue-dark); }
.button-outline { color:#174c80; border-color:#b9d6ef; background:#fff; }
.button-outline:hover { background:#edf7ff; }
.button-dark { color:#fff; background:var(--navy); }
.text-link { display:inline-flex; align-items:center; gap:7px; color:var(--blue-dark); font-size:.84rem; font-weight:800; }
.text-link:hover { color:var(--blue); }

.page-hero { position:relative; overflow:hidden; padding:76px 0 82px; border-bottom:1px solid #d8e6f2; background:linear-gradient(116deg,#f9fcff 0%,#eef7ff 65%,#e8f3fb 100%); }
.page-hero::after { position:absolute; right:-110px; bottom:-210px; width:510px; height:510px; border:68px solid rgba(24,121,230,.07); border-radius:50%; content:""; }
.page-hero .container { position:relative; z-index:1; }
.breadcrumb { margin:0 0 19px; color:#60738b; font-size:.76rem; font-weight:700; }
.breadcrumb a { color:var(--blue); }
.page-hero h1 { max-width:820px; margin:13px 0 18px; font-size:clamp(2.35rem,5vw,4.5rem); line-height:1.06; letter-spacing:-.055em; }
.page-hero h1 span { color:var(--blue); }
.page-hero .lead { max-width:730px; margin:0; color:#52677d; font-size:clamp(1rem,1.8vw,1.15rem); }
.hero-actions { display:flex; flex-wrap:wrap; gap:11px; margin-top:27px; }
.hero-proof { display:flex; flex-wrap:wrap; gap:10px 18px; margin-top:25px; color:#315574; font-size:.76rem; font-weight:800; }
.hero-proof span { display:flex; align-items:center; gap:7px; }
.hero-proof span::before { width:7px; height:7px; border-radius:50%; background:var(--teal); content:""; }

.section { padding:88px 0; }
.section-soft { background:var(--soft); }
.section-dark { color:#fff; background:var(--navy); }
.section-heading { display:grid; grid-template-columns:.9fr 1.1fr; align-items:end; gap:55px; margin-bottom:38px; }
.section-heading h2 { margin:10px 0 0; font-size:clamp(2rem,3.5vw,3.1rem); line-height:1.14; letter-spacing:-.045em; }
.section-heading p { max-width:560px; margin:0; color:var(--slate); }
.section-dark .section-heading p { color:#bdd1ea; }
.section-dark .eyebrow { color:#77c3ff; }
.grid-2 { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:20px; }
.grid-3 { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:18px; }
.grid-4 { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:16px; }
.card { padding:28px; border:1px solid var(--line); border-radius:13px; background:#fff; box-shadow:0 6px 18px rgba(9,35,72,.035); }
.card h2,.card h3 { margin:16px 0 8px; letter-spacing:-.025em; }
.card h3 { font-size:1.08rem; }
.card p { margin:0; color:var(--slate); font-size:.86rem; }
.card .text-link { margin-top:21px; }
.card-number { display:grid; place-items:center; width:40px; height:40px; color:var(--blue); border-radius:9px; background:var(--soft-blue); font-size:.76rem; font-weight:900; }
.feature-list { display:grid; gap:11px; margin:20px 0 0; padding:0; list-style:none; color:#36516b; font-size:.82rem; font-weight:700; }
.feature-list li { display:flex; gap:8px; }
.feature-list li::before { flex:none; color:var(--blue); font-weight:900; content:"✓"; }
.solution-card { display:flex; flex-direction:column; min-height:285px; }
.solution-card .text-link { margin-top:auto; padding-top:24px; }
.trust-card { border-top:3px solid var(--blue); }
.badge { display:inline-flex; align-items:center; gap:7px; padding:6px 9px; color:#185486; border:1px solid #c8dff3; border-radius:999px; background:#f1f8ff; font-size:.75rem; font-weight:800; }

.split-panel { display:grid; grid-template-columns:.92fr 1.08fr; overflow:hidden; border-radius:15px; background:var(--navy); box-shadow:var(--shadow); }
.split-copy { padding:47px; color:#fff; }
.split-copy h2 { margin:12px 0 14px; font-size:clamp(2rem,4vw,3.15rem); line-height:1.12; letter-spacing:-.045em; }
.split-copy p { margin:0; color:#c4d9ef; }
.split-copy .button { margin-top:24px; }
.split-points { display:grid; grid-template-columns:1fr 1fr; gap:1px; background:rgba(255,255,255,.12); }
.split-point { min-height:150px; padding:28px; background:#0b376f; }
.split-point:nth-child(1) { background:#0c55a7; }
.split-point strong { display:block; margin-bottom:6px; }
.split-point span { color:#c9def5; font-size:.78rem; }

.comparison { width:100%; border-collapse:collapse; overflow:hidden; border:1px solid var(--line); border-radius:12px; background:#fff; font-size:.84rem; }
.comparison th,.comparison td { padding:15px 17px; border-bottom:1px solid var(--line); text-align:left; vertical-align:top; }
.comparison th { color:#31516e; background:#edf6ff; font-size:.76rem; }
.comparison tr:last-child td { border-bottom:0; }
.comparison td:first-child { color:var(--navy); font-weight:800; }
.note { padding:18px 20px; color:#315876; border-left:4px solid var(--blue); border-radius:7px; background:#edf7ff; font-size:.84rem; }
.content-stack { display:grid; gap:23px; }
.content-block { padding:30px; border:1px solid var(--line); border-radius:13px; background:#fff; }
.content-block h2,.content-block h3 { margin:0 0 10px; letter-spacing:-.03em; }
.content-block p:last-child { margin-bottom:0; }
.content-block p,.content-block li { color:#536a82; }

.project-card { overflow:hidden; padding:0; }
.project-visual { display:flex; align-items:flex-end; min-height:170px; padding:23px; color:#fff; background:linear-gradient(130deg,#082653,#0d70c9); }
.project-visual.farm { background:linear-gradient(130deg,#123c3a,#1b8870); }
.project-visual.pos { background:linear-gradient(130deg,#3e2259,#8b4ac5); }
.project-visual.network { background:linear-gradient(130deg,#2e3946,#667a91); }
.project-visual span { max-width:240px; font-size:1.15rem; font-weight:800; letter-spacing:-.02em; }
.project-visual.project-photo { position:relative; overflow:hidden; min-height:230px; padding:0; background:#0b2448; }
.project-visual.project-photo img { width:100%; height:100%; min-height:230px; object-fit:cover; }
.project-visual.project-photo::after { position:absolute; inset:0; background:linear-gradient(180deg,transparent 32%,rgba(3,17,38,.84) 100%); content:""; }
.project-visual.project-photo span { position:absolute; z-index:1; right:23px; bottom:20px; left:23px; max-width:none; }
.project-body { padding:24px; }
.project-meta { display:flex; flex-wrap:wrap; gap:7px; margin-bottom:12px; }
.project-meta span { padding:5px 8px; color:#41617d; border-radius:999px; background:#edf5fc; font-size:.75rem; font-weight:800; }
.project-body h3 { margin:0 0 9px; }
.project-body p { margin:0; color:var(--slate); font-size:.82rem; }
.verification-note { margin-top:22px; padding:18px 20px; color:#536a82; border:1px dashed #b9ccde; border-radius:10px; background:#f9fcff; font-size:.8rem; }

.article-card { display:flex; flex-direction:column; }
.article-card .article-type,.article-type { margin:0; color:var(--blue); font-size:.75rem; font-weight:900; letter-spacing:.1em; text-transform:uppercase; }
.article-card h2,.article-card h3 { margin:12px 0 9px; }
.article-card .text-link { margin-top:auto; padding-top:20px; }
.article { max-width:820px; margin-inline:auto; }
.article h2 { margin:38px 0 10px; font-size:1.55rem; letter-spacing:-.03em; }
.article h3 { margin:28px 0 8px; }
.article p,.article li { color:#4e657d; }
.article .summary { padding:22px; border:1px solid #cfe1f1; border-radius:11px; background:#f1f8ff; }

.review-card blockquote { margin:0; color:#24415f; font-size:1.02rem; line-height:1.7; }
.review-card footer { margin-top:18px; color:var(--slate); font-size:.78rem; }
.review-card .review-proof { margin-top:12px; color:#315574; font-size:.78rem; font-weight:800; }
.stars { margin-bottom:12px; color:#ed9d18; letter-spacing:.1em; }

.proof-gallery { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:14px; margin-top:26px; }
.proof-gallery a { position:relative; overflow:hidden; min-height:150px; border-radius:11px; color:#fff; background:#0b2448; }
.proof-gallery img { width:100%; height:150px; object-fit:cover; transition:transform .25s ease; }
.proof-gallery a:hover img,.proof-gallery a:focus img { transform:scale(1.04); }
.proof-gallery a::after { position:absolute; inset:0; background:linear-gradient(180deg,transparent 25%,rgba(3,17,38,.86) 100%); content:""; }
.proof-gallery span { position:absolute; z-index:1; right:15px; bottom:13px; left:15px; font-size:.76rem; font-weight:800; line-height:1.35; }

.showroom-gallery { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:14px; margin-top:26px; }
.showroom-gallery figure { margin:0; overflow:hidden; border:1px solid var(--line); border-radius:11px; background:#fff; }
.showroom-gallery img { display:block; width:100%; height:190px; object-fit:cover; }
.showroom-gallery figcaption { padding:12px 14px; color:#315574; font-size:.76rem; font-weight:800; line-height:1.35; }

.contact-grid { display:grid; grid-template-columns:.8fr 1.2fr; gap:24px; align-items:start; }
.contact-list { display:grid; gap:12px; margin-top:23px; }
.contact-item { display:flex; gap:12px; padding:15px 0; border-bottom:1px solid var(--line); }
.contact-item:last-child { border-bottom:0; }
.contact-item strong { display:block; font-size:.83rem; }
.contact-item span,.contact-item a { color:var(--slate); font-size:.82rem; }
.map-frame { width:100%; min-height:365px; border:0; border-radius:13px; background:#eaf2f8; }
.form { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px; }
.field { display:grid; gap:6px; }
.field.full,.form .consent,.form .form-help,.form .form-status,.form .form-submit { grid-column:1/-1; }
.field label { color:#344e68; font-size:.75rem; font-weight:800; }
.field input,.field select,.field textarea { width:100%; min-height:46px; padding:11px 13px; color:var(--ink); border:1px solid #cbd9e7; border-radius:7px; background:#fbfdff; outline:none; }
.field textarea { min-height:112px; resize:vertical; }
.field input:focus,.field select:focus,.field textarea:focus { border-color:var(--blue); box-shadow:0 0 0 3px rgba(24,121,230,.11); }
.consent { display:flex; align-items:flex-start; gap:9px; color:#586d83; font-size:.72rem; }
.consent input { margin-top:4px; }
.form-help,.form-status { margin:0; color:#687c90; font-size:.75rem; }
.form-help a { color:var(--blue); font-weight:800; text-decoration:underline; }
.form-status a,.lead-status a { color:var(--blue-dark); text-decoration:underline; font-weight:800; }
.form-submit:disabled,.lead-submit:disabled { opacity:.65; cursor:wait; }
.form-help,.form-status,.consent,.lead-help,.lead-status,.lead-consent,.field label { font-size:.875rem; }
.no-script-note { margin:24px auto; padding:20px; border:1px solid var(--line); border-radius:10px; background:var(--soft); }
.no-script-note a { color:var(--blue-dark); text-decoration:underline; }
.model { overflow-wrap:anywhere; }

.language-intro { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:14px; }
.language-card { padding:22px; border:1px solid var(--line); border-radius:11px; background:#fff; }
.language-card strong { display:block; margin-bottom:5px; }
.language-card p { margin:0 0 15px; color:var(--slate); font-size:.8rem; }

.cta-band { padding:35px 0; color:#fff; background:linear-gradient(110deg,#07234c,#0b64b7); }
.cta-band .container { display:flex; align-items:center; justify-content:space-between; gap:26px; }
.cta-band p { margin:4px 0 0; color:#c9e1f8; font-size:.84rem; }
.cta-band h2 { margin:0; font-size:clamp(1.4rem,3vw,2rem); }
.cta-actions { display:flex; flex-wrap:wrap; gap:9px; flex:none; }
.cta-band .button-outline { color:#fff; border-color:rgba(255,255,255,.45); background:transparent; }

.footer { padding-top:55px; color:#c6d7e9; background:#03142b; }
.footer-grid { display:grid; grid-template-columns:1.4fr .8fr .8fr .9fr; gap:44px; padding-bottom:38px; }
.footer .brand-name { color:#fff; }
.footer .brand-subtitle { color:#91a9c2; }
.footer-copy { max-width:390px; margin:18px 0 0; color:#9eb5cc; font-size:.79rem; }
.footer h3 { margin:0 0 13px; color:#fff; font-size:.82rem; }
.footer-links { display:grid; gap:9px; color:#adc0d4; font-size:.76rem; }
.footer-links a:hover { color:#fff; }
.footer-bottom { display:flex; justify-content:space-between; gap:18px; padding:20px 0; color:#859db5; border-top:1px solid rgba(255,255,255,.1); font-size:.75rem; }
.whatsapp-float { position:fixed; z-index:25; right:18px; bottom:18px; display:flex; align-items:center; gap:8px; min-height:48px; padding:0 16px; color:#fff; border-radius:999px; background:#1eaf62; box-shadow:0 12px 28px rgba(20,117,67,.32); font-size:.78rem; font-weight:800; }
.whatsapp-float svg { width:22px; height:22px; fill:currentColor; }
.mobile-call { display:none; }

@media (max-width:1020px) {
  .nav-links { gap:14px; font-size:.75rem; }
  .language-links { display:none; }
  .grid-4 { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .footer-grid { grid-template-columns:1.3fr repeat(2,1fr); }
  .footer-grid > div:last-child { grid-column:2/-1; }
}

@media (max-width:820px) {
  .topbar-inner { justify-content:center; padding:8px 0; text-align:center; }
  .topbar-inner p:first-child { display:none; }
  .menu-toggle { display:block; }
  .nav-links { position:absolute; top:76px; left:-20px; right:-20px; display:none; align-items:stretch; gap:0; padding:12px 20px 20px; border-bottom:1px solid var(--line); background:#fff; box-shadow:0 14px 25px rgba(9,35,72,.1); }
  .nav-links.is-open { display:grid; }
  .nav-links > a { padding:12px 3px; }
  .nav-links .button { margin-top:7px; }
  .language-links { display:flex; margin-top:10px; padding:10px 0 0; border-top:1px solid var(--line); }
  .section-heading,.split-panel,.contact-grid { grid-template-columns:1fr; }
  .section-heading { align-items:start; gap:17px; }
  .grid-3 { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .grid-4 { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .footer-grid { grid-template-columns:1fr 1fr; }
  .footer-grid > div:last-child { grid-column:auto; }
}

@media (max-width:620px) {
  .container { width:calc(100% - 30px); }
  .nav { min-height:68px; }
  .brand-mark { width:44px; height:44px; }
  .nav-links { top:68px; left:-15px; right:-15px; }
  .page-hero { padding:54px 0 61px; }
  .page-hero h1 { font-size:clamp(2.2rem,12vw,3.35rem); }
  .section { padding:65px 0; }
  .grid-2,.grid-3,.grid-4,.language-intro,.form { grid-template-columns:1fr; }
  .proof-gallery { grid-template-columns:1fr; }
  .showroom-gallery { grid-template-columns:1fr; }
  .split-copy { padding:34px 25px; }
  .split-points { grid-template-columns:1fr; }
  .split-point { min-height:auto; }
  .comparison { display:block; overflow-x:auto; white-space:nowrap; }
  .cta-band .container,.footer-bottom { align-items:flex-start; flex-direction:column; }
  .cta-actions { width:100%; }
  .cta-actions .button { flex:1; }
  .footer-grid { grid-template-columns:1fr; gap:30px; }
  .footer-grid > div:last-child { grid-column:auto; }
  .whatsapp-float { right:12px; bottom:12px; width:48px; padding:0; justify-content:center; }
  .whatsapp-float span { display:none; }
  .mobile-call { position:fixed; z-index:24; right:69px; bottom:12px; display:grid; place-items:center; width:48px; height:48px; color:#fff; border-radius:50%; background:var(--blue); box-shadow:0 12px 28px rgba(24,121,230,.28); }
}

.service-hero-layout { display:grid; grid-template-columns:minmax(0,1.2fr) minmax(0,1fr); align-items:center; gap:40px; }
.service-hero-copy { min-width:0; }
html[lang="ta"] .page-hero h1, html[lang="si"] .page-hero h1 { font-size:clamp(1.75rem,6vw,3.5rem); line-height:1.35; letter-spacing:0; overflow-wrap:anywhere; }
.page-hero h1, .section-heading h2, .contact-grid h2 { overflow-wrap:anywhere; }
.service-hero-layout h1 { font-size:clamp(2.1rem,4vw,3.5rem); }
.service-hero-photo { margin:0; padding:12px; border:1px solid var(--line); border-radius:16px; background:white; }
.service-hero-photo img { display:block; width:100%; height:auto; aspect-ratio:3/2; object-fit:cover; border-radius:9px; }
.service-hero-photo.product img { object-fit:contain; }
.service-hero-photo figcaption { margin:10px 5px 3px; color:var(--slate); font-size:.875rem; line-height:1.5; }
.brand-range-photo { display:block; width:100%; height:170px; object-fit:contain; margin:20px 0; border-radius:10px; background:#fff; }
.range-grid .range-card { flex-direction:column; }
.range-photo { display:block; position:relative; z-index:1; width:100%; height:145px; margin:0 0 20px; object-fit:contain; border-radius:9px; background:#fff; }
.pos-feature .pos-feature-icon { width:52px; height:52px; }
.pos-feature-icon svg { width:30px; height:30px; }
.pos-feature h3 { font-size:1rem; line-height:1.4; }
.pos-feature p { font-size:.875rem; line-height:1.6; }
@media (max-width:1020px) { .service-hero-layout { grid-template-columns:1fr; gap:28px; } .service-hero-photo { max-width:640px; width:100%; } }
@media (max-width:620px) { input,select,textarea { font-size:1rem; } .hero-actions .button { white-space:normal; } }

@media (prefers-reduced-motion:reduce) {
  html { scroll-behavior:auto; }
  *,*::before,*::after { transition-duration:.01ms!important; animation-duration:.01ms!important; }
}