:root{padding:env(safe-area-inset-top,0px) 0 env(safe-area-inset-bottom,0px)}
body{margin:0}img{max-width:100%}[hidden]{display:none!important}

/* Layout: parchment ground with slow navy and gold light pools; content sits on refracting glass panes, crest-led hero, single column of sections */
:root{
  --parchment:#F3EDE0;
  --parchment-deep:#E7DECB;
  --navy:#1B3044;
  --navy-soft:#3D5266;
  --ink-muted:#5E6B76;
  --gold:#A9803A;
  --gold-light:#D9BE84;
  --glass:rgba(255,253,248,.42);
  --glass-strong:rgba(255,253,248,.62);
  --glass-edge:rgba(255,255,255,.75);
  --glass-shade:rgba(27,48,68,.10);
  --f-display:"Newsreader","Iowan Old Style","Palatino Linotype",Georgia,serif;
  --f-body:"Instrument Sans","Segoe UI",system-ui,-apple-system,sans-serif;
  --f-mono:"IBM Plex Mono",ui-monospace,Menlo,Consolas,monospace;
  --r-lg:30px;--r-md:22px;--r-sm:14px;
  color-scheme:light;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:96px}
body{background:var(--parchment);color:var(--navy);font-family:var(--f-body);font-size:1rem;line-height:1.65;-webkit-font-smoothing:antialiased;overflow-x:hidden}
body::before{content:"";position:fixed;inset:0 0 auto;height:env(safe-area-inset-top,0px);z-index:60;background:var(--parchment)}
a{color:inherit}
:focus-visible{outline:2px solid var(--gold);outline-offset:3px;border-radius:6px}
h1,h2,h3{font-family:var(--f-display);font-weight:500;letter-spacing:-.01em;text-wrap:balance;margin:0;line-height:1.12}
p{margin:0}
.wrap{max-width:1160px;margin:0 auto;padding-left:max(20px,env(safe-area-inset-left,0px));padding-right:max(20px,env(safe-area-inset-right,0px))}
.eyebrow{font-family:var(--f-mono);font-size:.72rem;letter-spacing:.16em;text-transform:uppercase;color:var(--gold)}

/* ambient light behind the glass */
.ambient{position:fixed;inset:0;z-index:-1;overflow:hidden;pointer-events:none;background:var(--parchment)}
.ambient i{position:absolute;border-radius:50%;filter:blur(70px);opacity:.55;animation:drift 38s ease-in-out infinite alternate}
.ambient i:nth-child(1){width:46vw;height:46vw;left:-10vw;top:-8vw;background:#C9D3DC}
.ambient i:nth-child(2){width:38vw;height:38vw;right:-8vw;top:18vh;background:var(--gold-light);opacity:.45;animation-duration:46s}
.ambient i:nth-child(3){width:52vw;height:52vw;left:22vw;bottom:-22vw;background:#B8C4CF;opacity:.5;animation-duration:52s}
.ambient::after{content:"";position:absolute;inset:0;background-image:radial-gradient(rgba(27,48,68,.05) 1px,transparent 1px);background-size:22px 22px}
@keyframes drift{to{transform:translate3d(6vw,5vh,0) scale(1.12)}}

/* liquid glass */
.glass{position:relative;background:var(--glass);border-radius:var(--r-lg);
  -webkit-backdrop-filter:blur(22px) saturate(170%);backdrop-filter:blur(22px) saturate(170%);
  box-shadow:inset 0 1px 0 var(--glass-edge),inset 0 -1px 0 var(--glass-shade),inset 0 0 0 1px rgba(255,255,255,.35),0 24px 48px -28px rgba(27,48,68,.35),0 2px 6px -2px rgba(27,48,68,.08);
  isolation:isolate}
.glass::before{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;z-index:-1;
  background:radial-gradient(420px circle at var(--mx,30%) var(--my,0%),rgba(255,255,255,.55),transparent 60%),
             linear-gradient(160deg,rgba(255,255,255,.45) 0%,rgba(255,255,255,0) 38%,rgba(255,255,255,0) 70%,rgba(255,255,255,.18) 100%)}
@supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){.glass{background:var(--glass-strong)}}

/* nav */
.nav-shell{position:sticky;top:env(safe-area-inset-top,0px);z-index:50;padding-top:14px}
.nav{display:flex;align-items:center;gap:16px;padding:8px 8px 8px 14px;border-radius:999px}
.brand{display:flex;align-items:center;gap:10px;text-decoration:none;min-width:0}
.brand img{height:38px;width:auto}
.brand b{font-family:var(--f-display);font-weight:600;font-size:1.25rem;letter-spacing:.04em}
.brand span{display:block;font-size:.68rem;color:var(--ink-muted);line-height:1.2;letter-spacing:.02em}
.links{display:flex;gap:2px;margin-left:auto;list-style:none;padding:0;margin-block:0}
.links a{display:block;padding:8px 13px;border-radius:999px;text-decoration:none;font-size:.9rem;font-weight:500;color:var(--navy-soft);transition:background .2s,color .2s}
.links a:hover{background:rgba(255,255,255,.55);color:var(--navy)}
.btn{display:inline-flex;align-items:center;gap:8px;padding:11px 20px;border-radius:999px;font:600 .92rem var(--f-body);text-decoration:none;border:0;cursor:pointer;transition:transform .2s,box-shadow .2s,background .2s}
.btn:hover{transform:translateY(-1px)}
.btn-navy{background:var(--navy);color:var(--parchment);box-shadow:inset 0 1px 0 rgba(255,255,255,.18),0 10px 22px -12px rgba(27,48,68,.7)}
.btn-glass{background:rgba(255,255,255,.5);color:var(--navy);box-shadow:inset 0 1px 0 #fff,inset 0 0 0 1px rgba(27,48,68,.12)}
.menu-btn{display:none;margin-left:auto;width:42px;height:42px;border-radius:50%;border:0;background:rgba(255,255,255,.55);box-shadow:inset 0 0 0 1px rgba(27,48,68,.12);color:var(--navy);cursor:pointer}
.menu-btn svg{width:20px;height:20px}
.mobile-menu{margin-top:8px;padding:10px;border-radius:var(--r-md)}
.mobile-menu a{display:block;padding:12px 14px;border-radius:12px;text-decoration:none;font-weight:500}
.mobile-menu a:hover{background:rgba(255,255,255,.55)}

/* hero */
.hero{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);gap:48px;align-items:center;padding-block:72px 56px}
.hero h1{font-size:clamp(2.4rem,5.4vw,4.3rem);font-weight:400}
.hero h1 em{font-style:italic;color:var(--gold)}
.hero .lead{margin-top:22px;font-size:1.13rem;max-width:34em;color:var(--navy-soft)}
.hero .lead + .lead{margin-top:12px}
.cta-row{display:flex;flex-wrap:wrap;gap:12px;margin-top:30px}
.hero-tags{display:flex;flex-wrap:wrap;gap:8px;margin-top:30px;list-style:none;padding:0}
.hero-tags li{font-size:.8rem;padding:6px 12px;border-radius:999px;background:rgba(255,255,255,.4);box-shadow:inset 0 0 0 1px rgba(27,48,68,.1);color:var(--navy-soft)}
.lens{aspect-ratio:1/1.08;max-width:100%;display:grid;place-items:center;padding:40px;border-radius:44px}
.lens img{width:78%;height:auto;filter:drop-shadow(0 18px 24px rgba(27,48,68,.22))}
.lens .cap{position:absolute;left:0;right:0;bottom:22px;text-align:center;font-family:var(--f-mono);font-size:.68rem;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-muted)}
.lens-wrap{position:relative}
.orb{position:absolute;border-radius:50%;pointer-events:none}
.orb.a{width:110px;height:110px;right:-18px;top:-22px}
.orb.b{width:64px;height:64px;left:-20px;bottom:60px}

/* sections */
section{padding-block:56px}
.sec-head{display:flex;flex-direction:column;gap:12px;max-width:44rem;margin-bottom:32px}
.sec-head h2{font-size:clamp(1.9rem,3.6vw,2.8rem)}
.sec-head p{color:var(--navy-soft);font-size:1.05rem}
.two{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,.8fr);gap:28px;align-items:start}
.prose{display:flex;flex-direction:column;gap:14px;max-width:38rem;font-size:1.05rem;color:var(--navy-soft)}
.prose strong{color:var(--navy);font-weight:600}
.pane{padding:30px}
.facts{display:flex;flex-direction:column;gap:18px}
.fact{display:flex;flex-direction:column;gap:2px;padding-bottom:16px;border-bottom:1px solid rgba(27,48,68,.1)}
.fact:last-child{border-bottom:0;padding-bottom:0}
.fact small{font-family:var(--f-mono);font-size:.7rem;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-muted)}
.fact span{font-family:var(--f-display);font-size:1.2rem;line-height:1.3}

.vision{padding:44px;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:40px}
.vision blockquote{margin:0;font-family:var(--f-display);font-size:clamp(1.6rem,3vw,2.3rem);line-height:1.2;font-weight:400}
.vision blockquote::before{content:"“";color:var(--gold);margin-right:2px}
.vision blockquote::after{content:"”";color:var(--gold)}
.mission{list-style:none;padding:0;margin:14px 0 0;display:flex;flex-direction:column;gap:12px}
.mission li{display:grid;grid-template-columns:22px minmax(0,1fr);gap:10px;color:var(--navy-soft)}
.mission li::before{content:"";width:9px;height:9px;margin-top:.55em;border-radius:50%;background:var(--gold);box-shadow:0 0 0 4px rgba(169,128,58,.16)}

.message{display:grid;grid-template-columns:auto minmax(0,1fr);gap:36px;padding:44px;align-items:start}
.seal{width:120px;height:120px;border-radius:50%;display:grid;place-items:center;background:rgba(255,255,255,.5);box-shadow:inset 0 1px 0 #fff,inset 0 0 0 1px rgba(27,48,68,.1)}
.seal img{width:58px;height:auto}
.message .body{display:flex;flex-direction:column;gap:12px;max-width:40rem}
.message .opening{font-family:var(--f-display);font-size:clamp(1.4rem,2.4vw,1.8rem);line-height:1.25}
.message p{color:var(--navy-soft)}
.sign{margin-top:8px;font-size:.92rem;color:var(--navy)}
.sign b{display:block;font-family:var(--f-display);font-weight:600;font-size:1.05rem}

.grid2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}
.card{padding:28px;display:flex;flex-direction:column;gap:12px;border-radius:var(--r-md);transition:transform .35s cubic-bezier(.2,.8,.2,1)}
.card:hover{transform:translateY(-3px)}
.card .icon{width:46px;height:46px;border-radius:14px;display:grid;place-items:center;background:rgba(255,255,255,.6);box-shadow:inset 0 1px 0 #fff,inset 0 0 0 1px rgba(27,48,68,.1);color:var(--navy)}
.card .icon svg{width:22px;height:22px}
.card h3{font-size:1.4rem}
.card p{color:var(--navy-soft)}
.card .note{font-size:.85rem;color:var(--ink-muted);border-top:1px dashed rgba(27,48,68,.18);padding-top:12px;margin-top:4px}

.road{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;position:relative}
.road::before{content:"";position:absolute;left:24px;right:24px;top:31px;height:2px;background:linear-gradient(90deg,var(--gold),rgba(169,128,58,.15))}
.phase{display:flex;flex-direction:column;gap:12px}
.dot{width:64px;height:64px;border-radius:50%;display:grid;place-items:center;font-family:var(--f-mono);font-weight:500;font-size:.9rem;color:var(--navy);position:relative}
.phase .card{flex:1}
.phase h3{font-size:1.2rem}
.phase p{font-size:.95rem}
.road-foot{margin-top:22px;display:flex;flex-wrap:wrap;gap:12px;align-items:center;justify-content:space-between;padding:18px 24px;border-radius:var(--r-md)}
.road-foot p{color:var(--navy-soft);font-size:.95rem;max-width:44rem;min-width:0}
.pill{font-family:var(--f-mono);font-size:.72rem;letter-spacing:.08em;padding:6px 12px;border-radius:999px;background:var(--navy);color:var(--parchment);white-space:nowrap}

.principles{display:flex;flex-wrap:wrap;gap:10px;margin-top:4px;list-style:none;padding:0}
.principles li{padding:10px 16px;border-radius:999px;background:rgba(255,255,255,.5);box-shadow:inset 0 1px 0 #fff,inset 0 0 0 1px rgba(27,48,68,.1);font-size:.92rem}
.principles li b{font-weight:600;margin-right:6px}
.strands{list-style:none;padding:0;margin:0;display:flex;flex-direction:column}
.strands li{display:grid;grid-template-columns:44px minmax(0,1fr);gap:8px;padding:14px 0;border-bottom:1px solid rgba(27,48,68,.1)}
.strands li:last-child{border-bottom:0}
.strands code{font-family:var(--f-mono);font-size:.78rem;color:var(--gold);padding-top:3px}
.disclaimer{margin-top:20px;font-size:.88rem;color:var(--ink-muted);display:flex;gap:10px;align-items:flex-start}
.disclaimer svg{flex:none;width:18px;height:18px;margin-top:2px;color:var(--gold)}

.empty{padding:36px;display:grid;grid-template-columns:auto minmax(0,1fr);gap:28px;align-items:center}
.seats{display:grid;grid-template-columns:repeat(3,40px);gap:10px}
.seats i{width:40px;height:40px;border-radius:50%;border:1.5px dashed rgba(27,48,68,.28);background:rgba(255,255,255,.3)}
.empty h3{font-size:1.5rem}
.empty p{color:var(--navy-soft);margin-top:8px}

.areas{display:flex;flex-wrap:wrap;gap:8px;margin-top:6px;list-style:none;padding:0}
.areas li{font-size:.85rem;padding:6px 12px;border-radius:999px;background:rgba(27,48,68,.06);color:var(--navy)}

.contact{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:20px}
.c-row{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:16px 0;border-bottom:1px solid rgba(27,48,68,.1)}
.c-row:last-child{border-bottom:0}
.c-row small{display:block;font-family:var(--f-mono);font-size:.68rem;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-muted)}
.c-row span{font-size:1.05rem;user-select:all;overflow-wrap:anywhere}
.copy{flex:none;border:0;cursor:pointer;font:500 .8rem var(--f-body);padding:8px 12px;border-radius:999px;background:rgba(255,255,255,.6);box-shadow:inset 0 0 0 1px rgba(27,48,68,.12);color:var(--navy)}
.copy.done{background:var(--navy);color:var(--parchment)}
address{font-style:normal;font-family:var(--f-display);font-size:1.3rem;line-height:1.4}

footer{margin-top:40px;background:var(--navy);color:var(--parchment)}
footer .wrap{padding-block:44px calc(32px + env(safe-area-inset-bottom,0px));display:flex;flex-wrap:wrap;gap:28px;align-items:center;justify-content:space-between}
footer img{width:300px;max-width:100%;height:auto}
footer p{max-width:28rem;font-family:var(--f-display);font-size:1.25rem;line-height:1.35}
footer .fine{width:100%;border-top:1px solid rgba(243,237,224,.18);padding-top:18px;font-size:.8rem;color:rgba(243,237,224,.7);display:flex;flex-wrap:wrap;gap:8px 24px;justify-content:space-between}
.gold-rule{height:6px;background:var(--gold)}

@media (max-width:980px){
  .links{display:none}.nav .btn-navy{display:none}.menu-btn{display:grid;place-items:center}
  .hero{grid-template-columns:1fr;padding-block:44px 32px;gap:36px}
  .lens-wrap{max-width:380px;width:100%;justify-self:center}
  .two,.vision,.contact{grid-template-columns:1fr}
  .road{grid-template-columns:repeat(2,minmax(0,1fr))}.road::before{display:none}
}
@media (max-width:640px){
  .grid2,.road{grid-template-columns:1fr}
  .vision,.message,.pane,.empty{padding:26px}
  .message{grid-template-columns:1fr;gap:20px}.seal{width:84px;height:84px}.seal img{width:42px}
  .empty{grid-template-columns:1fr}
  section{padding-block:40px}
  .brand span{display:none}
}
@media (prefers-reduced-motion:reduce){
  .ambient i{animation:none}html{scroll-behavior:auto}
  .card,.btn{transition:none}.card:hover,.btn:hover{transform:none}
}

.links a[aria-current="page"]{background:rgba(255,255,255,.7);color:var(--navy);box-shadow:inset 0 1px 0 #fff,inset 0 0 0 1px rgba(27,48,68,.1)}
.mobile-menu a[aria-current="page"]{background:rgba(255,255,255,.6)}
.crumbs{display:flex;gap:8px;align-items:center;padding-top:40px;font-size:.85rem;color:var(--ink-muted)}
.crumbs a{text-decoration:none;color:var(--navy-soft)}.crumbs a:hover{color:var(--navy);text-decoration:underline}
.page-title{font-size:clamp(2.3rem,4.8vw,3.6rem)!important;font-weight:400}
main > .wrap > section:first-of-type{padding-top:20px}
.skip{position:absolute;left:12px;top:-60px;z-index:100;background:var(--navy);color:var(--parchment);padding:10px 16px;border-radius:10px;text-decoration:none;font-weight:600}.skip:focus{top:calc(12px + env(safe-area-inset-top,0px))}
.explore{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}
.explore a{text-decoration:none}
.explore .card h3{font-size:1.3rem}
.go{margin-top:auto;font-weight:600;font-size:.9rem;color:var(--gold);display:flex;align-items:center;gap:6px}
.go svg,.next svg{width:16px;height:16px;transition:transform .25s}
a:hover .go svg,.next:hover svg{transform:translateX(3px)}
.band{padding:40px 44px;display:flex;flex-wrap:wrap;gap:24px;align-items:center;justify-content:space-between}
.band blockquote{margin:0;font-family:var(--f-display);font-size:clamp(1.4rem,2.6vw,2rem);line-height:1.25;max-width:36rem}
.next{display:flex;justify-content:space-between;align-items:center;gap:16px;padding:24px 30px;border-radius:var(--r-md);text-decoration:none;margin-top:8px}
.next small{display:block;font-family:var(--f-mono);font-size:.7rem;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-muted)}
.next span{font-family:var(--f-display);font-size:1.5rem}
.foot-nav{width:100%;display:flex;flex-wrap:wrap;gap:6px 22px;list-style:none;padding:0;margin:0}
.foot-nav a{text-decoration:none;color:rgba(243,237,224,.85);font-size:.9rem}.foot-nav a:hover{color:#fff;text-decoration:underline}
.nf{padding-block:80px;text-align:center;display:flex;flex-direction:column;align-items:center;gap:16px}
.nf img{width:110px;height:auto}
@media (max-width:980px){.explore{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:640px){.explore{grid-template-columns:1fr}.band{padding:26px}}

.banner{margin:18px 0 0;padding:8px;border-radius:var(--r-lg)}
.banner img{display:block;width:100%;height:auto;aspect-ratio:3/1;object-fit:cover;border-radius:24px}
.home-banner{margin:0 0 8px}
.thumb{display:block;width:calc(100% + 56px);max-width:none;margin:-28px -28px 6px;height:auto;aspect-ratio:12/5;object-fit:cover;border-radius:22px 22px 0 0}
.spot{display:block;width:100%;height:auto;aspect-ratio:16/10;object-fit:cover;border-radius:16px}
@media (max-width:640px){.banner img{aspect-ratio:16/9}.thumb{width:calc(100% + 52px);margin:-26px -26px 6px}}

/* Real photography: responsive, locally hosted assets */
.hero-photos{display:grid;grid-template-columns:1fr 1fr;gap:14px;min-width:0}
.hero-photos figure{margin:0;padding:7px;overflow:hidden}
.hero-photo-main{grid-column:1/-1}
.hero-photo-main img{display:block;width:100%;height:auto;aspect-ratio:4/3;object-fit:cover;object-position:50% 40%;border-radius:24px}
.hero-photos figcaption{position:absolute;left:20px;right:20px;bottom:20px;padding:10px 14px;border-radius:12px;background:rgba(20,37,53,.86);color:#fff;font-size:.83rem;line-height:1.4}
.hero-photo-detail img{display:block;width:100%;height:auto;aspect-ratio:1.5;object-fit:cover;border-radius:24px}
.city-detail img{object-position:50% 45%}
.hero-photo-detail figcaption{left:14px;right:14px;bottom:14px;font-size:.7rem;padding:7px 9px}
.banner img{aspect-ratio:2.6;object-position:50% 35%}
.banner img[src*="about-"]{object-position:50% 40%}
.banner img[src*="policy-"]{object-position:50% 28%}
.banner img[src*="contact-"]{object-position:50% 38%}
.thumb{aspect-ratio:16/10;object-position:50% 35%}
.thumb[src*="about-"]{object-position:50% 45%}
@media(max-width:640px){.banner img{aspect-ratio:16/10}.hero-photos{gap:10px}.hero-photo-main img{aspect-ratio:4/3}.hero-photos figcaption{font-size:.78rem}.hero-photo-detail figcaption{font-size:.65rem}.hero-photo-detail img{aspect-ratio:1.2}}

.banner img[src*="priorities-"]{object-position:50% 18%}
.banner img[src*="roadmap-"]{object-position:50% 20%}
.banner img[src*="contact-"],.city-detail img{object-position:50% 28%}

/* Expanded strategy and policy content */
.reading{max-width:850px;color:var(--navy-soft);font-size:1.05rem}
.reading>p+p,.reading>p+.detail-article{margin-top:18px}
.reading p:has(.btn){display:flex;flex-wrap:wrap;gap:12px;margin-top:24px}
.detail-section{border-top:1px solid rgba(27,48,68,.12)}
.detail-section .sec-head{max-width:52rem}
.detail-article{padding:24px 0;border-bottom:1px solid rgba(27,48,68,.1)}
.detail-article:first-child{padding-top:0}
.detail-article h3{font-size:clamp(1.3rem,2.2vw,1.65rem);color:var(--navy);margin-bottom:12px}
.detail-article p+p{margin-top:12px}
.detail-list{padding-left:1.3em;margin:14px 0 0;color:var(--navy-soft)}
.detail-list li+li{margin-top:12px}
.status-note{max-width:900px;line-height:1.75;color:var(--navy-soft);margin:20px 0 28px}
.status-note strong{color:var(--navy)}
.section-links{display:flex;flex-wrap:wrap;gap:10px 22px;margin:30px 0;color:var(--navy);font-weight:600}
.section-links a{text-decoration-thickness:1px;text-underline-offset:5px}
.phase-details{margin-top:28px}
.phase-detail{display:grid;grid-template-columns:125px minmax(0,1fr);gap:24px;padding:34px 0;border-top:1px solid rgba(27,48,68,.15)}
.phase-detail .eyebrow{padding-top:7px}
.phase-detail h2{font-size:clamp(1.6rem,3vw,2.2rem);margin-bottom:18px}
.phase-detail .detail-list{max-width:850px}
.detail-article,.phase-detail{scroll-margin-top:110px}
@media(max-width:640px){.phase-detail{grid-template-columns:1fr;gap:12px;padding:28px 0}.reading{font-size:1rem}.section-links{gap:12px 18px}.detail-section{padding-block:38px}}

/* Local Malaysian photography */
.photo-credit-link{text-align:center;padding:1rem}.hero-photo-main img{object-position:50% 52%}.home-banner img{object-position:50% 51%}

.banner img[src*="malaysia-"]{object-position:50% 55%}.banner img[src*="malaysia-32-"]{object-position:50% 70%}.thumb[src*="malaysia-"]{object-position:50% 52%}
