/* Kusum Group — shared styles. Brand: navy #163F58, gold #F5B51B */
:root{
  --navy:#163F58;
  --navy-deep:#0E2C40;
  --blue:#2B7A9B;
  --gold:#F5B51B;
  --gold-dark:#C98F00;
  --sky:#EAF2F7;
  --ink:#4A5560;
  --ink-dark:#16242E;
  --paper:#fff;
  --band:#F2F5F7;
  --serif:"Abhaya Libre",Georgia,serif;
  --sans:"Cabin",system-ui,-apple-system,"Segoe UI",sans-serif;
  --gutter:clamp(18px,6vw,85px);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;font-family:var(--sans);font-size:16px;line-height:1.65;color:var(--ink);background:var(--paper)}
img,svg{max-width:100%;display:block}
a{color:inherit}
h1,h2,h3,h4{font-family:var(--serif);font-weight:700;line-height:1.15;margin:0 0 .5em;color:var(--navy)}
p{margin:0 0 1em}
.skip{position:absolute;left:-999px;top:0;background:#fff;color:var(--navy);padding:8px 12px;z-index:100}
.skip:focus{left:8px;top:8px}

/* Header */
.site-header{position:sticky;top:0;z-index:50;background:#fff;height:92px;display:flex;align-items:center;justify-content:space-between;padding:0 var(--gutter);box-shadow:0 1px 0 rgba(22,63,88,.1)}
.brand img{height:64px;width:auto}
.nav ul{list-style:none;margin:0;padding:0;display:flex;height:92px}
.nav a{display:flex;align-items:center;height:100%;padding:0 20px;text-decoration:none;font-weight:600;text-transform:uppercase;font-size:15px;letter-spacing:.3px;color:var(--navy);border-bottom:5px solid transparent;transition:color .2s,background .2s}
.nav a:hover{background:var(--sky)}
.nav a[aria-current="page"]{color:var(--navy);border-bottom-color:var(--gold);background:var(--sky)}
.nav-toggle{display:none;background:none;border:2px solid var(--navy);color:var(--navy);width:44px;height:44px;border-radius:4px;cursor:pointer;font-size:22px;line-height:1}

/* Buttons: outlined, stacked-edge */
.btn{--c:#fff;position:relative;display:inline-block;padding:9px 22px;font:700 14px/1.4 var(--sans);letter-spacing:.3px;color:var(--c);text-decoration:none;border:2px solid var(--c);border-radius:0 8px 0 0;background:transparent;margin:0 8px 8px 0;cursor:pointer;transition:background .2s}
.btn::before,.btn::after{content:"";position:absolute;inset:0;border:2px solid var(--c);border-top:0;border-left:0;border-radius:0 0 8px 0;pointer-events:none}
.btn::before{transform:translate(3px,3px)}
.btn::after{transform:translate(6px,6px);opacity:.6}
.btn:hover,.btn:focus-visible{background:rgba(255,255,255,.14)}
.btn.dark{--c:var(--navy)}
.btn.dark:hover{background:rgba(22,63,88,.07)}
.btn.gold{--c:var(--gold)}

/* Hero carousel */
.hero{position:relative;overflow:hidden;color:#fff;height:min(560px,84vh);min-height:480px}
.slide{position:absolute;inset:0;display:flex;align-items:center;padding:0 var(--gutter);opacity:0;visibility:hidden;transition:opacity .8s}
.slide.active{opacity:1;visibility:visible}
.s1{background:var(--navy)}.s2{background:#1E5F7F}.s3{background:var(--navy-deep)}
.slide::before{content:"";position:absolute;right:-8%;top:-30%;width:70vh;height:70vh;border:34px solid rgba(245,181,27,.16);border-radius:50%}
.slide::after{content:"";position:absolute;left:-6%;bottom:-40%;width:60vh;height:60vh;border:26px solid rgba(255,255,255,.06);border-radius:50%}
.slide .copy{max-width:560px;position:relative;z-index:2}
.kicker{display:inline-block;font:700 12px/1 var(--sans);letter-spacing:3px;text-transform:uppercase;color:var(--gold);margin-bottom:16px}
.slide h1{font-size:clamp(40px,5.6vw,70px);color:#fff;font-weight:600;margin-bottom:.35em}
.slide p{font-size:18px;line-height:1.6}
.slide .art{position:absolute;right:calc(var(--gutter) - 10px);bottom:0;height:86%;width:auto;max-width:46%;z-index:1}
.hero-arrow{position:absolute;top:50%;transform:translateY(-50%);width:40px;height:44px;border:0;background:var(--gold);color:var(--navy);font-size:20px;font-weight:700;cursor:pointer;z-index:5}
.hero-arrow.prev{left:0}.hero-arrow.next{right:0}
.dots{position:absolute;left:50%;bottom:22px;transform:translateX(-50%);display:flex;gap:6px;z-index:5}
.dots button{width:42px;height:4px;border:0;padding:0;background:rgba(255,255,255,.35);cursor:pointer}
.dots button[aria-current="true"]{background:var(--gold)}

/* Logo marquee */
.logos{background:#fff;border-bottom:1px solid #e3e9ed;padding:22px 0;overflow:hidden}
.logos small{display:block;text-align:center;font:700 12px/1 var(--sans);letter-spacing:3px;text-transform:uppercase;color:var(--blue);margin-bottom:16px}
.track{display:flex;gap:70px;width:max-content;animation:scroll 32s linear infinite;align-items:center}
.logos:hover .track{animation-play-state:paused}
.track img{height:46px;width:auto;max-width:190px;object-fit:contain;filter:grayscale(1);opacity:.75;transition:filter .25s,opacity .25s}
.track a:hover img,.track a:focus-visible img{filter:none;opacity:1}
@keyframes scroll{to{transform:translateX(-50%)}}

/* Pattern band + card */
.band{background:var(--band) url("pattern.svg");padding:44px var(--gutter);display:grid;grid-template-columns:1fr 1.5fr;gap:40px;align-items:center}
.band .mark{justify-self:center}
.band .mark img{width:min(360px,100%);height:auto;background:#fff;padding:26px;box-shadow:0 12px 30px rgba(22,63,88,.12);border-top:6px solid var(--gold)}
.card{background:#fff;padding:26px 28px 16px;box-shadow:0 12px 30px rgba(22,63,88,.08)}
.card h2{font-size:46px}
.card p{text-align:justify}
.card .btn{margin-top:6px}

/* Three colour blocks */
.trio{display:grid;grid-template-columns:repeat(3,1fr)}
.block{position:relative;color:#fff;padding:60px 44px 40px;min-height:380px}
.block h2{font-size:38px;color:inherit;font-weight:600;position:relative;z-index:1}
.block p{font-size:19px;line-height:1.5;position:relative;z-index:1}
.block .ico{position:absolute;top:18px;right:30px;width:84px;height:84px;opacity:.95}
.b1{background:var(--navy)}.b2{background:var(--blue)}.b3{background:var(--gold);color:var(--ink-dark)}
.b3 .btn{--c:var(--navy-deep)}

/* Sections */
.section{padding:64px var(--gutter)}
.section.alt{background:var(--band)}
.section h2.title{font-size:46px}
.lead{max-width:720px;font-size:17px}
.eyebrow{display:block;font:700 12px/1 var(--sans);letter-spacing:3px;text-transform:uppercase;color:var(--gold-dark);margin-bottom:10px}

/* Company cards (home) */
.cgrid{display:grid;grid-template-columns:repeat(6,1fr);gap:22px;margin-top:30px}
.ccard-l{grid-column:span 2;display:flex;flex-direction:column;background:#fff;border:1px solid #dde5ea;border-top:5px solid var(--gold);text-decoration:none;transition:transform .2s,box-shadow .2s}
.ccard-l:nth-child(4){grid-column:2 / span 2}.ccard-l:nth-child(5){grid-column:4 / span 2}
.ccard-l:hover,.ccard-l:focus-visible{transform:translateY(-4px);box-shadow:0 14px 28px rgba(22,63,88,.14)}
.plate{display:flex;align-items:center;justify-content:center;height:130px;padding:20px;background:#fff;border-bottom:1px solid #eef2f5}
.plate img{max-height:82px;max-width:78%;width:auto;height:auto;object-fit:contain}
.ccard-l .body{padding:20px 22px 22px;flex:1;display:flex;flex-direction:column}
.tag{align-self:flex-start;background:var(--navy);color:#fff;font:700 11px/1 var(--sans);letter-spacing:1.2px;text-transform:uppercase;padding:6px 10px;margin-bottom:12px}
.ccard-l h3{font-size:24px;margin-bottom:.3em}
.ccard-l p{font-size:15px;flex:1}
.more{font-weight:700;color:var(--navy);font-size:14px}
.more::after{content:" \2192"}

/* Glance band */
.glance{background:var(--navy);color:#fff;padding:54px var(--gutter);display:grid;grid-template-columns:repeat(3,1fr);gap:30px;text-align:center}
.glance b{display:block;font:600 72px/1 var(--serif);color:var(--gold)}
.glance span{font-size:16px;letter-spacing:.5px}
.glance div+div{border-left:1px solid rgba(255,255,255,.18)}

/* CTA band */
.cta{background:var(--gold);color:var(--ink-dark);padding:46px var(--gutter);display:flex;gap:24px;align-items:center;justify-content:space-between;flex-wrap:wrap}
.cta h2{font-size:36px;margin:0;color:var(--navy-deep)}
.cta p{margin:.3em 0 0}
.cta .btn{--c:var(--navy-deep)}

/* Inner page banner */
.page-hero{background:var(--navy);color:#fff;padding:70px var(--gutter) 60px;position:relative;overflow:hidden}
.page-hero::after{content:"";position:absolute;right:-60px;top:-90px;width:380px;height:380px;border:30px solid rgba(245,181,27,.2);border-radius:50%}
.page-hero h1{font-size:clamp(38px,5vw,58px);color:#fff;font-weight:600;margin:0;position:relative;z-index:1}
.page-hero p{max-width:620px;font-size:18px;margin:.6em 0 0;position:relative;z-index:1}
.crumbs{font-size:13px;margin-bottom:12px;opacity:.9;position:relative;z-index:1}.crumbs a{text-decoration:none;color:var(--gold)}

/* Companies page */
.co{display:grid;grid-template-columns:300px 1fr;gap:20px 40px;padding:40px 0;border-bottom:1px solid #e3e9ed;scroll-margin-top:110px}
.co:last-child{border-bottom:0}
.co .plate{height:170px;border:1px solid #dde5ea;border-top:5px solid var(--gold);box-shadow:0 10px 24px rgba(22,63,88,.07)}
.co .plate img{max-height:110px}
.co h2{font-size:36px;margin-bottom:.2em}
.co ul{margin:0 0 14px;padding-left:20px;columns:2;column-gap:30px}
.co li{break-inside:avoid;margin-bottom:3px}
.meta{font-size:15px}.meta a{color:var(--blue);font-weight:700}
.soon{display:inline-block;margin-top:4px;padding:6px 12px;background:var(--sky);color:var(--navy);font-weight:600;font-size:14px}

/* About */
.two{display:grid;grid-template-columns:1.2fr 1fr;gap:50px;align-items:start}
.facts{display:grid;gap:14px}
.fact{padding:20px 22px;background:var(--band);border-left:5px solid var(--gold)}
.fact b{display:block;font:700 26px/1.2 var(--serif);color:var(--navy)}

/* Contact */
.cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(290px,1fr));gap:22px}
.ccard{background:#fff;border:1px solid #dde5ea;border-top:5px solid var(--gold)}
.ccard .plate{height:110px}.ccard .plate img{max-height:68px}
.ccard .body{padding:20px 22px 22px}
.ccard h3{font-size:22px}
.ccard p{margin:0 0 .45em;font-size:15px}
.ccard a{font-weight:700;color:var(--blue)}

/* Footer */
.site-footer{background:var(--navy-deep);color:#dbe6ee;padding:46px var(--gutter) 22px}
.fgrid{display:grid;grid-template-columns:1.2fr 1fr 1.4fr;gap:40px}
.site-footer .flogo{display:inline-block;background:#fff;padding:14px 18px;border-top:5px solid var(--gold)}
.site-footer .flogo img{height:86px;width:auto}
.site-footer h4{font-family:var(--serif);font-size:16px;letter-spacing:.8px;text-transform:uppercase;margin-bottom:14px;color:var(--gold)}
.site-footer ul{list-style:none;margin:0;padding:0}
.site-footer li{margin-bottom:6px}
.site-footer a{text-decoration:none}.site-footer a:hover{text-decoration:underline;color:#fff}
.copy-row{display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;margin-top:34px;padding-top:18px;border-top:1px solid rgba(255,255,255,.15);font-size:13px}

/* Scroll reveal */
.reveal{opacity:0;transform:translateY(22px);transition:opacity .7s ease,transform .7s ease}
.reveal.in{opacity:1;transform:none}
.no-js .reveal{opacity:1;transform:none}

/* Responsive */
@media (max-width:1000px){
  .cgrid{grid-template-columns:repeat(2,1fr)}
  .ccard-l,.ccard-l:nth-child(4),.ccard-l:nth-child(5){grid-column:auto}
  .ccard-l:nth-child(5){grid-column:1 / -1}
}
@media (max-width:900px){
  .site-header{height:80px}.brand img{height:54px}
  .nav-toggle{display:block}
  .nav{position:absolute;top:80px;left:0;right:0;background:#fff;display:none;box-shadow:0 8px 14px rgba(0,0,0,.1)}
  .nav.open{display:block}
  .nav ul{flex-direction:column;height:auto}
  .nav a{height:54px;border-bottom:0;border-left:5px solid transparent}
  .nav a[aria-current="page"]{border-left-color:var(--gold)}
  .hero{height:auto;min-height:540px}
  .slide{align-items:flex-start;padding-top:56px}
  .slide .art{opacity:.2;max-width:80%;right:-10%}
  .hero-arrow{display:none}
  .slide .copy{padding-bottom:70px}
  .trio,.two,.fgrid,.band,.glance{grid-template-columns:1fr}
  .glance div+div{border-left:0;border-top:1px solid rgba(255,255,255,.18);padding-top:24px}
  .block{min-height:0}.block .ico{width:64px;height:64px}
  .co{grid-template-columns:1fr}.co ul{columns:1}
  .cgrid{grid-template-columns:1fr}.ccard-l:nth-child(5){grid-column:auto}
  .track{gap:44px}
}
@media (prefers-reduced-motion:reduce){
  .slide,.reveal,.ccard-l{transition:none}.reveal{opacity:1;transform:none}html{scroll-behavior:auto}
  .track{animation:none;flex-wrap:wrap;width:auto;justify-content:center;padding:0 var(--gutter)}
  .track .dup{display:none}
}
