:root{--bg:#fff;--bg2:#f5f6fa;--tx:#12141c;--mut:#5a6073;--card:#fff;--ln:#e5e8f0;--br:#e8333a;--br2:#c4222a;--sh:0 8px 30px rgba(20,24,40,.08);--r:16px}
[data-theme=dark]{--bg:#0d1017;--bg2:#131723;--tx:#eef0f6;--mut:#a2a9bb;--card:#181d2b;--ln:#262c3d;--sh:0 8px 30px rgba(0,0,0,.4)}
*{box-sizing:border-box;margin:0}html{scroll-behavior:smooth;scroll-padding-top:80px}
body{font:16px/1.65 Barlow,system-ui,sans-serif;background:var(--bg);color:var(--tx);transition:background .3s,color .3s;-webkit-font-smoothing:antialiased}
img{max-width:100%;height:auto;display:block}a{color:inherit;text-decoration:none}ul{list-style:none;padding:0}
.si{font-family:Maname,"Iskoola Pota","Noto Sans Sinhala",Barlow,sans-serif;line-height:1.85;font-weight:400}h3.si{font-weight:400;font-size:1.08rem}
.wrap{width:min(1160px,92%);margin:auto}.skip{position:absolute;left:-999px}.skip:focus{left:8px;top:8px;background:var(--br);color:#fff;padding:8px 14px;z-index:99}
h1,h2,h3{line-height:1.15;letter-spacing:-.01em}h2{font-size:clamp(1.8rem,3.4vw,2.6rem);font-weight:800}h2 span,h1 span{color:var(--br)}
.eyebrow{color:var(--br);font-weight:700;letter-spacing:.12em;text-transform:uppercase;font-size:.82rem;margin-bottom:12px}.mut,.lead{color:var(--mut)}
.btn{display:inline-flex;gap:8px;align-items:center;background:var(--br);color:#fff;font-weight:600;padding:13px 26px;border-radius:999px;transition:.2s;border:2px solid var(--br)}
.btn:hover{background:var(--br2);border-color:var(--br2);transform:translateY(-2px)}.btn.ghost{background:transparent;color:var(--tx);border-color:var(--ln)}.btn.ghost:hover{border-color:var(--br);color:var(--br);background:transparent}.btn.sm{padding:9px 20px;font-size:.92rem}
:focus-visible{outline:3px solid var(--br);outline-offset:3px}
.hdr{position:sticky;top:0;z-index:50;background:color-mix(in srgb,var(--bg) 88%,transparent);backdrop-filter:blur(12px);border-bottom:1px solid var(--ln)}
.bar{display:flex;align-items:center;justify-content:space-between;height:72px;gap:16px}.logo img{height:48px;width:auto}
nav{display:flex;gap:26px;font-weight:500}nav a{color:var(--mut);transition:.2s}nav a:hover{color:var(--br)}.acts{display:flex;gap:10px;align-items:center}
.ic{width:40px;height:40px;border-radius:50%;border:1px solid var(--ln);background:var(--card);color:var(--tx);display:grid;place-items:center;cursor:pointer}
.moon{display:none}[data-theme=dark] .sun{display:none}[data-theme=dark] .moon{display:block}.burger{display:none}
.hero{position:relative;overflow:hidden;padding:70px 0 40px;background:radial-gradient(900px 500px at 85% 20%,color-mix(in srgb,var(--br) 14%,transparent),transparent 70%)}
#fx{position:absolute;inset:0;width:100%;height:100%;opacity:.5;pointer-events:none}
.hgrid{position:relative;display:grid;grid-template-columns:1.1fr .9fr;gap:40px;align-items:center}
.hgrid>*{min-width:0}h1{font-size:clamp(2.1rem,7vw,5.2rem);font-weight:800;text-transform:uppercase;margin:6px 0 18px}.lead{font-size:1.15rem;max-width:520px}
.cta{display:flex;flex-wrap:wrap;gap:14px;margin:28px 0}.cta.c{justify-content:center}.soc{display:flex;gap:22px;flex-wrap:wrap;font-weight:600;color:var(--mut)}.soc a:hover{color:var(--br)}
.hpic img{margin:auto;max-height:560px;width:auto;filter:drop-shadow(0 20px 40px rgba(0,0,0,.18))}
.stats{background:var(--br);color:#fff;padding:36px 0}.sgrid{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;text-align:center}
.sgrid b{display:block;font-size:clamp(2rem,4vw,2.8rem);font-weight:800}.sgrid span{opacity:.9}
.sec{padding:96px 0}.alt{background:var(--bg2)}.hd{text-align:center;margin-bottom:48px}
.agrid{display:grid;grid-template-columns:.9fr 1.1fr;gap:56px;align-items:center}.apic img{border-radius:var(--r);box-shadow:var(--sh);margin:auto}
.agrid h2{margin-bottom:16px}.ticks{margin:22px 0 28px;display:grid;gap:10px}.ticks li{padding-left:32px;position:relative;font-weight:500}
.ticks li:before{content:"✓";position:absolute;left:0;top:1px;width:22px;height:22px;border-radius:50%;background:var(--br);color:#fff;font-size:.8rem;display:grid;place-items:center}
.grid{display:grid;gap:24px}.g3{grid-template-columns:repeat(3,1fr)}.g4{grid-template-columns:repeat(4,1fr)}.g5{grid-template-columns:repeat(auto-fit,minmax(200px,1fr))}
.card{background:var(--card);border:1px solid var(--ln);border-radius:var(--r);overflow:hidden;box-shadow:var(--sh);transition:.25s;display:block}a.card:hover{transform:translateY(-6px);border-color:var(--br)}
.ph{aspect-ratio:4/3;overflow:hidden}.ph img{width:100%;height:100%;object-fit:cover;transition:transform .5s}a.card:hover .ph img{transform:scale(1.05)}.stu .ph{aspect-ratio:4/4.2}.ph.wide{aspect-ratio:16/10}
.cb{padding:20px}.cb h3{font-size:1.15rem;margin-bottom:6px}.cb p{color:var(--mut);font-size:.95rem}.stu .cb{text-align:center}.rank{color:var(--br)!important;font-weight:600}
.more{display:inline-block;margin-top:12px;color:var(--br);font-weight:600}.cb time{font-size:.8rem;color:var(--br);font-weight:600}.g4 .cb p{display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}.g4 h3{font-size:1rem;margin:6px 0}
.quote{padding:28px;display:flex;flex-direction:column;gap:20px}.quote blockquote{color:var(--mut);font-size:.98rem;flex:1}.quote figcaption{display:flex;align-items:center;gap:12px;border-top:1px solid var(--ln);padding-top:16px}
.quote figcaption img{width:48px;height:48px;border-radius:50%;object-fit:cover}.quote figcaption div{flex:1;line-height:1.3}.quote figcaption span{display:block;font-size:.85rem;color:var(--mut)}.quote i{color:#f5a623;font-style:normal;letter-spacing:2px;font-size:.9rem}
.app{padding:84px 0;text-align:center;color:#fff;background:linear-gradient(135deg,#1a1f36,#3b2d8f)}.app h2{max-width:720px;margin:0 auto}.app .eyebrow{color:#ff8a8f}
.chn{padding:28px}.chn h3{font-size:1.6rem;color:var(--br)}.chn ul{margin-top:16px;display:grid;gap:4px}.chn li a{display:block;padding:10px 14px;border-radius:10px;font-weight:500;transition:.2s}.chn li a:hover{background:var(--bg2);color:var(--br);padding-left:20px}
.narrow{width:min(820px,92%)}details{background:var(--card);border:1px solid var(--ln);border-radius:var(--r);margin-bottom:14px;padding:4px 24px}
summary{cursor:pointer;font-weight:600;padding:18px 0;list-style:none;display:flex;justify-content:space-between;gap:16px}summary::-webkit-details-marker{display:none}summary:after{content:"+";color:var(--br);font-size:1.5rem;line-height:1}details[open] summary:after{content:"−"}
details p,.tel{color:var(--mut);padding-bottom:14px}details p a,.tel a{color:var(--br);font-weight:600}.tel li{display:flex;justify-content:space-between;padding:8px 0;border-top:1px solid var(--ln)}
footer{border-top:1px solid var(--ln);padding:28px 0;color:var(--mut);font-size:.92rem}.fbar{display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap}
.cursor{position:fixed;width:14px;height:14px;border:2px solid var(--br);border-radius:50%;pointer-events:none;z-index:99;transform:translate(-100px,-100px);transition:width .2s,height .2s,background .2s;display:none}.cursor.on{display:block}.cursor.h{width:34px;height:34px;background:color-mix(in srgb,var(--br) 18%,transparent)}
.rv{opacity:0;transform:translateY(24px);transition:opacity .7s,transform .7s}.rv.in{opacity:1;transform:none}
@media(max-width:960px){.hgrid,.agrid{grid-template-columns:1fr}.hpic{order:-1}.hpic img{max-height:380px}.g3,.g4{grid-template-columns:repeat(2,1fr)}.sgrid{grid-template-columns:repeat(2,1fr)}.sec{padding:72px 0}
.burger{display:grid}.burger span,.burger span:before{display:block;width:18px;height:2px;background:currentColor;position:relative}.burger span:before{content:"";top:-6px;position:absolute}
nav{position:absolute;top:72px;left:0;right:0;flex-direction:column;gap:0;background:var(--bg);border-bottom:1px solid var(--ln);padding:8px 4%;display:none}nav.open{display:flex}nav a{padding:14px 0;border-bottom:1px solid var(--ln)}}
@media(max-width:600px){.g3,.g4{grid-template-columns:1fr}.btn.sm{display:none}.hero{padding-top:36px}}
@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important;scroll-behavior:auto!important}.rv{opacity:1;transform:none}#fx{display:none}}
/* --- signature credit (footer only, deliberately quiet) --- */
.credit{display:flex;justify-content:flex-end;margin-top:14px}
.sig{--sg:#7b8196;--sgt:#e8333a;--sw:6;display:inline-flex;align-items:center;gap:12px;opacity:.55;transition:opacity .3s}
[data-theme=dark] .sig{--sg:#8e96ab;--sgt:#ffe3a6}
.sig:hover,.sig:focus-visible{opacity:1}.sig span{font-size:.78rem;letter-spacing:.04em}
.sig svg{width:118px;height:auto;overflow:visible}
.sp{fill:none;stroke:var(--sg);stroke-width:var(--sw);stroke-linecap:round;stroke-linejoin:round}
.st{fill:none;stroke:var(--sgt);stroke-width:calc(var(--sw)*1.5);stroke-linecap:round;stroke-linejoin:round;opacity:0;pointer-events:none}
.sp.draw{animation:sgDraw 2.4s cubic-bezier(.45,.05,.35,1) forwards}.sp2.draw{animation-delay:2.4s}
@keyframes sgDraw{to{stroke-dashoffset:0}}
/* --- mobile pass --- */
@media(max-width:600px){
 body{font-size:15.5px}.bar{height:64px}.logo img{height:42px}nav{top:64px}html{scroll-padding-top:70px}
 .sec{padding:56px 0}.hd{margin-bottom:28px}.stats{padding:26px 0}.sgrid{gap:14px}
 .hero{padding:24px 0 28px}.hpic img{max-height:300px}.lead{font-size:1.02rem}.cta{margin:20px 0}.cta .btn{flex:1 1 100%;justify-content:center}
 #results .g5,#services .g5{grid-template-columns:repeat(2,1fr);gap:14px}.cb{padding:14px}.cb h3{font-size:1rem}.cb p{font-size:.88rem}.stu .ph{aspect-ratio:1/1.1}

 .g4{gap:16px}.app{padding:56px 0}.cta.c{gap:10px}.cta.c .btn,.cta.c a{flex:0 0 auto}
 details{padding:2px 16px}summary{padding:15px 0}.tel li{flex-direction:column;gap:2px}
 .fbar,.credit{flex-direction:column;align-items:center;text-align:center;justify-content:center;gap:12px}.sig svg{width:104px;--sw:7}.sig{opacity:.65}}
@media(prefers-reduced-motion:reduce){.sp{stroke-dasharray:none!important}.st{display:none}}

/* footer: everything centred on every screen size; trail driven by JS */
footer .fbar,footer .credit{flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:12px}
.credit{margin-top:16px}.soc{justify-content:center}
.st{opacity:0}.st.go{opacity:1}.st.sg{stroke-width:calc(var(--sw)*4.5);opacity:0}.st.sg.go{opacity:.22}

/* ===== iOS-style glass layer (appearance only; structure unchanged) ===== */
:root{--gl:rgba(255,255,255,.58);--gl2:rgba(255,255,255,.4);--gb:rgba(255,255,255,.75);--gi:rgba(255,255,255,.9);--gs:0 10px 40px rgba(31,38,80,.12),0 2px 8px rgba(31,38,80,.06);--bl:22px;--rr:24px;--b1:rgba(232,51,58,.28);--b2:rgba(99,102,241,.26);--b3:rgba(56,189,248,.22)}
[data-theme=dark]{--gl:rgba(34,40,60,.5);--gl2:rgba(34,40,60,.34);--gb:rgba(255,255,255,.12);--gi:rgba(255,255,255,.14);--gs:0 14px 44px rgba(0,0,0,.45),0 2px 8px rgba(0,0,0,.3);--b1:rgba(232,51,58,.30);--b2:rgba(99,102,241,.32);--b3:rgba(56,189,248,.18)}
html{background:var(--bg)}body{background:transparent;position:relative}
body:before{content:"";position:fixed;inset:-10%;z-index:-1;pointer-events:none;background:radial-gradient(38vw 38vw at 12% 8%,var(--b1),transparent 70%),radial-gradient(42vw 42vw at 92% 30%,var(--b2),transparent 70%),radial-gradient(40vw 40vw at 20% 78%,var(--b3),transparent 70%),radial-gradient(34vw 34vw at 88% 92%,var(--b1),transparent 70%)}
.alt{background:var(--gl2)}.hero{background:none}
/* glass surfaces */
.hdr,.card,details,.ic,.btn.ghost,nav.open,.sgrid>div{-webkit-backdrop-filter:blur(var(--bl)) saturate(180%);backdrop-filter:blur(var(--bl)) saturate(180%)}
.hdr{background:var(--gl);border-bottom:1px solid var(--gb);box-shadow:0 1px 0 var(--gi) inset,0 8px 30px rgba(31,38,80,.06)}
.card,details{background:var(--gl);border:1px solid var(--gb);border-radius:var(--rr);box-shadow:inset 0 1px 0 var(--gi),var(--gs)}
a.card:hover{transform:translateY(-6px) scale(1.01);border-color:var(--gi);box-shadow:inset 0 1px 0 var(--gi),0 18px 50px rgba(31,38,80,.2)}
.ph{border-radius:calc(var(--rr) - 6px);margin:6px 6px 0}.ph img{border-radius:inherit}.quote{background:var(--gl)}
.ic{background:var(--gl);border-color:var(--gb);box-shadow:inset 0 1px 0 var(--gi),0 4px 14px rgba(31,38,80,.1);transition:transform .2s}.ic:active{transform:scale(.92)}
/* glossy pill buttons */
.btn{background:linear-gradient(180deg,#ff5a60,#e8333a 55%,#d12a31);border:1px solid rgba(255,255,255,.35);box-shadow:inset 0 1px 0 rgba(255,255,255,.55),0 8px 22px rgba(232,51,58,.35);border-radius:999px}
.btn:hover{background:linear-gradient(180deg,#ff6a70,#ee3a41 55%,#d92e35);border-color:rgba(255,255,255,.45)}.btn:active{transform:scale(.97)}
.btn.ghost{background:var(--gl);color:var(--tx);border:1px solid var(--gb);box-shadow:inset 0 1px 0 var(--gi),0 6px 18px rgba(31,38,80,.08)}.btn.ghost:hover{background:var(--gl);border-color:var(--gi);color:var(--br)}
/* stats: frosted tiles over the red band */
.stats{background:linear-gradient(135deg,#ff5a60,#e8333a 50%,#b81f5f)}.sgrid>div{background:rgba(255,255,255,.16);border:1px solid rgba(255,255,255,.35);border-radius:20px;padding:18px 10px;box-shadow:inset 0 1px 0 rgba(255,255,255,.5),0 8px 24px rgba(0,0,0,.12)}
/* app band: glass store badge */
.app{background:linear-gradient(135deg,#1a1f36,#3b2d8f 60%,#6a3fb5)}.app .cta.c a{display:inline-block;padding:8px 10px;border-radius:20px;background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.3);box-shadow:inset 0 1px 0 rgba(255,255,255,.4);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px)}
/* misc polish */
.ticks li:before{box-shadow:inset 0 1px 0 rgba(255,255,255,.5),0 4px 10px rgba(232,51,58,.3)}.apic img{border-radius:28px;border:1px solid var(--gb)}
.chn li a:hover{background:var(--gl2)}.tel li{border-top-color:var(--gb)}footer{background:var(--gl2);border-top:1px solid var(--gb);-webkit-backdrop-filter:blur(var(--bl));backdrop-filter:blur(var(--bl))}
::selection{background:rgba(232,51,58,.25)}
@media(max-width:600px){:root{--bl:14px;--rr:20px}body:before{inset:0;background:radial-gradient(70vw 70vw at 0% 6%,var(--b1),transparent 70%),radial-gradient(80vw 80vw at 100% 42%,var(--b2),transparent 70%),radial-gradient(70vw 70vw at 10% 90%,var(--b3),transparent 70%)}}
@supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){:root{--gl:var(--card);--gl2:var(--bg2)}}
/* hero fixes */
.hero .soc{justify-content:flex-start}footer .soc{justify-content:center}
.hgrid{grid-template-columns:1.2fr .8fr}h1{font-size:clamp(2.1rem,5.2vw,4.2rem)}
@media(max-width:960px){.hgrid{grid-template-columns:1fr}h1{font-size:clamp(2.1rem,9vw,3.6rem)}.hero .soc{justify-content:flex-start}}

/* ===== traveling hairline around matching items (sweep, then a rest gap, forever) ===== */
@property --ang{syntax:"<angle>";inherits:false;initial-value:0deg}
:root{--hl:#e8333a;--hlw:1.5px;--hlo:.55}[data-theme=dark]{--hl:#ffe3a6}
.card,.sgrid>div,details{position:relative}
.card:after,.sgrid>div:after,details:after{content:"";position:absolute;inset:0;border-radius:inherit;padding:var(--hlw);pointer-events:none;z-index:3;opacity:0;
 background:conic-gradient(from var(--ang),transparent 0 235deg,color-mix(in srgb,var(--hl) 35%,transparent) 300deg,var(--hl) 348deg,transparent 360deg);
 -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask:linear-gradient(#000 0 0) content-box exclude,linear-gradient(#000 0 0);mask-composite:exclude;
 animation:hlSweep 9s linear infinite;animation-delay:var(--hd,0s);animation-play-state:paused;will-change:opacity}
.sgrid>div:after{--hl:#fff}
.card.live:after,.sgrid>div.live:after,details.live:after{animation-play-state:running}
/* one loop: the line fades in while moving, fades out while still moving, then rests ~40% of the loop */
@keyframes hlSweep{0%{--ang:0deg;opacity:0}14%{opacity:var(--hlo)}44%{opacity:var(--hlo)}58%{--ang:360deg;opacity:0}100%{--ang:360deg;opacity:0}}
.grid>:nth-child(2):after,.sgrid>:nth-child(2):after{--hd:-1.6s}.grid>:nth-child(3):after,.sgrid>:nth-child(3):after{--hd:-3.2s}.grid>:nth-child(4):after,.sgrid>:nth-child(4):after{--hd:-4.8s}.grid>:nth-child(5):after{--hd:-6.4s}details:nth-of-type(2):after{--hd:-3s}details:nth-of-type(3):after{--hd:-6s}
@media(prefers-reduced-motion:reduce){.card:after,.sgrid>div:after,details:after{display:none}}
@supports not (mask-composite:exclude){.card:after,.sgrid>div:after,details:after{display:none}}

/* FAQ accordion: smooth open/close */
details summary:after,details[open] summary:after{content:"+";display:inline-block;transition:transform .38s cubic-bezier(.4,0,.2,1)}
details.is-open summary:after{transform:rotate(45deg)}
.fc{overflow:hidden}details summary{transition:color .25s}details.is-open summary{color:var(--br)}