/* PSBMKJPP / Penang Road Safe
   Visual system adapted from the committee's chosen "Civic Compassion & Reassuring Authority" design:
   deep civic navy, warm amber, signal red kept for emergencies only, Plus Jakarta Sans throughout,
   tonal layering with crisp 1px borders and soft tinted shadows. */
:root{
  --navy:#14532D;
  --navy-deep:#003B1B;
  --navy-tint:#E7EEFF;
  --amber:#FDC425;
  --amber-bright:#FDC425;
  --amber-tint:#FFF3CF;
  --amber-ink:#785A00;
  --red:#DC2626;
  --emerald:#2E6A41;
  --emerald-tint:#E1F3E5;
  --ink:#111C2D;
  --muted:#404941;
  --line:#DEE8FF;
  --line-strong:#C0C9BE;
  --paper:#F9F9FF;
  --nest:#F0F3FF;
  --white:#FFFFFF;
  --wa:#1FA855;
  --r-sm:8px;
  --r-md:16px;
  --r-lg:24px;
  --shadow-1:0 1px 3px rgba(0,59,27,.06);
  --shadow-2:0 8px 20px -6px rgba(0,59,27,.14);
  --font:'Plus Jakarta Sans','Noto Sans SC','PingFang SC','Microsoft YaHei',system-ui,sans-serif;
  --gutter:max(20px, env(safe-area-inset-left, 0px));
  --gutter-r:max(20px, env(safe-area-inset-right, 0px));
}
*{box-sizing:border-box;}
html{scroll-behavior:smooth; -webkit-text-size-adjust:100%;}
body{margin:0; background:var(--paper); color:var(--ink); font:400 17px/1.7 var(--font); -webkit-font-smoothing:antialiased; overflow-x:hidden;}
html:lang(zh-Hans) body{line-height:1.85;}
img,svg{display:block; max-width:100%;}
a{color:var(--navy); text-underline-offset:3px;}
a:hover{color:var(--amber);}
h1,h2,h3{font-family:var(--font); color:var(--ink); margin:0; line-height:1.18; text-wrap:balance;}
h1{font-size:clamp(2rem,4.8vw,3.2rem); font-weight:800; letter-spacing:-.02em; line-height:1.14;}
h2{font-size:clamp(1.6rem,3.2vw,2.2rem); font-weight:800; letter-spacing:-.015em;}
h3{font-size:1.2rem; font-weight:700;}
p{margin:0 0 1em;}
ul,ol{margin:0; padding:0;}
.skip{position:absolute; left:-999px; top:8px; background:var(--amber-bright); color:#2A1F00; padding:10px 16px; border-radius:var(--r-sm); z-index:200; font-weight:700;}
.skip:focus{left:12px;}
:focus-visible{outline:3px solid rgba(0,59,27,.45); outline-offset:3px; border-radius:6px;}
.wrap{max-width:1240px; margin:0 auto; padding-left:var(--gutter); padding-right:var(--gutter-r);}
.narrow{max-width:800px;}
.lede{font-size:1.15rem; color:var(--muted); max-width:60ch;}
.lane{height:8px; background:repeating-linear-gradient(90deg,var(--amber-bright) 0 56px,transparent 56px 96px);}

/* ---------- Emergency bar ---------- */
.sos{background:var(--navy-deep); color:#E2F1E5; font-size:.95rem;}
.sos .wrap{display:flex; gap:12px; align-items:center; padding-top:10px; padding-bottom:10px;}
.sos .dot{flex:none; width:28px; height:28px; border-radius:50%; background:var(--red); color:#fff; display:flex; align-items:center; justify-content:center;}
.sos .dot svg{width:16px; height:16px;}
.sos p{margin:0; line-height:1.45;}
.sos b{color:#FFE08A;}

/* ---------- Header ---------- */
.site-head{position:sticky; top:0; z-index:100; background:rgba(255,255,255,.96); backdrop-filter:blur(10px); border-bottom:1px solid var(--line); padding-top:env(safe-area-inset-top, 0px);}
.bar{display:flex; align-items:center; gap:18px; min-height:72px; max-width:1320px;}
.brand{display:flex; align-items:center; gap:12px; text-decoration:none; color:var(--ink); min-width:0;}
.brand img{height:46px; width:auto; flex:none;}
.brand-text{display:flex; flex-direction:column; line-height:1.15; min-width:0;}
.brand-text b{font:800 1.1rem var(--font); color:var(--navy); letter-spacing:.01em;}
.brand-text span{font-size:.74rem; color:var(--muted); white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
.nav{margin-left:auto; display:flex; align-items:center; gap:2px;}
.nav a.link{text-decoration:none; color:var(--ink); font-weight:600; font-size:.92rem; padding:10px 10px; border-radius:var(--r-sm); white-space:nowrap;}
.nav a.link:hover{background:var(--navy-tint); color:var(--navy);}
.nav a.link[aria-current="page"]{color:var(--navy); box-shadow:inset 0 -3px 0 var(--amber-bright); border-radius:0;}
.nav a.home-link{display:none;}
.nav .btn{white-space:nowrap;}
.langsw{display:flex; border:1.5px solid var(--line-strong); border-radius:999px; overflow:hidden; background:var(--white); margin:0 10px;}
.langsw a{padding:7px 12px; font-size:.82rem; font-weight:700; text-decoration:none; color:var(--muted); white-space:nowrap;}
.langsw a[aria-current="true"]{background:var(--navy); color:#fff;}
.langsw a:not([aria-current="true"]):hover{background:var(--navy-tint); color:var(--navy);}
.menu-btn{display:none; margin-left:auto; border:1.5px solid var(--line-strong); background:var(--white); border-radius:var(--r-sm); width:48px; height:48px; align-items:center; justify-content:center; cursor:pointer; color:var(--navy);}
.menu-btn svg{width:22px; height:22px;}

/* ---------- Buttons ---------- */
.btn{display:inline-flex; align-items:center; justify-content:center; gap:10px; min-height:48px; padding:12px 24px; border-radius:var(--r-sm); font:700 1rem var(--font); text-decoration:none; border:1.5px solid transparent; cursor:pointer; line-height:1.2; transition:transform .15s ease, box-shadow .15s ease, background .15s ease;}
.btn:hover{transform:translateY(-1px);}
.btn svg{width:20px; height:20px; flex:none;}
.btn-primary{background:var(--navy); color:#fff;}
.btn-primary:hover{background:var(--navy-deep); color:#fff; box-shadow:var(--shadow-2);}
.btn-ghost{background:var(--nest); border-color:var(--line-strong); color:var(--navy);}
.btn-ghost:hover{background:var(--navy-tint); color:var(--navy);}
.btn-amber{background:var(--amber); color:#2A1F00;}
.btn-amber:hover{background:#ffc41f; color:#2A1F00; box-shadow:0 8px 20px -6px rgba(217,119,6,.5);}
.btn-sm{min-height:44px; padding:9px 18px; font-size:.92rem;}
.btn-row{display:flex; gap:14px; flex-wrap:wrap;}

/* ---------- Sections ---------- */
.sec{padding:80px 0;}
.sec.alt{background:var(--white); border-top:1px solid var(--line); border-bottom:1px solid var(--line);}
.sec.tint{background:var(--navy-tint);}
.sec-head{max-width:700px; margin-bottom:44px;}
.sec-head p{color:var(--muted); font-size:1.1rem; margin-top:14px; margin-bottom:0;}
.badge{display:inline-flex; align-items:center; gap:8px; background:var(--amber-tint); color:var(--amber-ink); border:1px solid #F0DA94; border-radius:999px; padding:7px 14px; font-size:.84rem; font-weight:700; margin-bottom:20px;}
.badge svg{width:16px; height:16px; flex:none;}

/* ---------- Hero ---------- */
.hero{padding:60px 0 72px;}
.hero-grid{display:grid; grid-template-columns:1.1fr .9fr; gap:56px; align-items:center;}
.hero h1{margin-bottom:20px;}
.hero .lede{margin-bottom:30px;}
.road{position:relative; margin:0; background:var(--navy); border-radius:var(--r-lg); padding:44px 32px 64px; overflow:hidden; text-align:center; box-shadow:var(--shadow-2);}
.road .disc{width:min(100%,320px); aspect-ratio:1/1; margin:0 auto; border-radius:50%; background:#fff; display:flex; align-items:center; justify-content:center; box-shadow:0 20px 40px -16px rgba(0,0,0,.5);}
.road .disc img{height:80%; width:auto;}
.road .lane{position:absolute; left:0; right:0; bottom:26px; background:repeating-linear-gradient(90deg,var(--amber-bright) 0 48px,transparent 48px 88px);}
.road figcaption{margin-top:24px; color:#B8DDC2; font-size:.95rem; line-height:1.5;}

.reg-line{margin:26px 0 0; font-size:.9rem; color:var(--muted); display:flex; flex-wrap:wrap; gap:6px 12px;}
.reg-line svg{width:20px; height:20px; color:var(--emerald); flex:none;}
.reg-line{align-items:center;}
.reg-line span{font-weight:700; color:var(--navy);}

/* ---------- Facts band ---------- */
.factband{background:var(--navy); color:#fff; padding:40px 0;}
.facts-row{display:grid; grid-template-columns:repeat(3,1fr); gap:24px; text-align:center;}
.facts-row .num{font:800 clamp(2rem,4vw,2.8rem)/1 var(--font); color:#FFE08A; font-variant-numeric:tabular-nums;}
.facts-row .lbl{margin-top:8px; color:#B8DDC2; font-size:.98rem; line-height:1.4;}

/* ---------- Feature cards ---------- */
.features{display:grid; grid-template-columns:repeat(2,1fr); gap:24px;}
.feature{background:var(--white); border:1px solid var(--line); border-radius:var(--r-md); padding:28px; box-shadow:var(--shadow-1);}
.sec.alt .feature{background:var(--paper);}
.feature .top{display:flex; align-items:center; justify-content:space-between; gap:12px; margin-bottom:18px;}
.feature .ic, .role .ic{width:48px; height:48px; border-radius:var(--r-sm); background:var(--navy-tint); color:var(--navy); display:flex; align-items:center; justify-content:center;}
.feature .ic svg, .role .ic svg{width:24px; height:24px;}
.chip{display:inline-block; font-size:.74rem; font-weight:700; letter-spacing:.03em; padding:5px 11px; border-radius:999px; line-height:1.2;}
.chip.c1{background:var(--amber-tint); color:var(--amber-ink);}
.chip.c2{background:var(--navy-tint); color:var(--navy);}
.chip.c3{background:var(--emerald-tint); color:var(--emerald);}
.chip.c4{background:var(--nest); color:var(--muted);}
.feature h3{margin-bottom:8px;}
.feature p{color:var(--muted); margin:0;}

/* ---------- Steps ---------- */
.steps{display:grid; grid-template-columns:repeat(3,1fr); gap:32px; position:relative; list-style:none;}
.steps::before{content:""; position:absolute; left:28px; right:28px; top:27px; height:0; border-top:3px dashed var(--line-strong); z-index:0;}
.steps li{position:relative; z-index:1;}
.n{width:56px; height:56px; border-radius:50%; background:var(--navy); color:#fff; font:800 1.4rem var(--font); display:flex; align-items:center; justify-content:center; box-shadow:0 0 0 5px var(--paper), 0 0 0 8px var(--amber-bright); flex:none;}
.sec.alt .steps .n{box-shadow:0 0 0 5px var(--white), 0 0 0 8px var(--amber-bright);}
.steps .n{margin-bottom:22px;}
.steps h3{margin-bottom:8px;}
.steps p{color:var(--muted); margin:0;}

/* ---------- Callout ---------- */
.callout{display:flex; gap:18px; background:var(--amber-tint); border:1px solid #F0DA94; border-radius:var(--r-md); padding:26px 28px;}
.callout .ic{flex:none; width:44px; height:44px; border-radius:var(--r-sm); background:var(--amber); color:#2A1F00; display:flex; align-items:center; justify-content:center;}
.callout .ic svg{width:24px; height:24px;}
.callout h3{margin-bottom:6px; color:var(--amber-ink);}
.callout p{margin:0; color:#4A3900;}

/* ---------- Split / lists ---------- */
.split{display:grid; grid-template-columns:1fr 1fr; gap:48px; align-items:start;}
.split.wide-left{grid-template-columns:1.15fr .85fr;}
.split.center{align-items:center;}
.ticks{list-style:none; display:grid; gap:14px;}
.ticks li{display:flex; gap:14px; align-items:flex-start;}
.ticks svg{flex:none; width:24px; height:24px; margin-top:2px; padding:4px; border-radius:50%;}
.ticks.yes svg{background:var(--emerald); color:#fff;}
.ticks.no svg{background:var(--nest); color:var(--muted);}
.box{background:var(--white); border:1px solid var(--line); border-radius:var(--r-md); padding:30px; box-shadow:var(--shadow-1);}
.box h2, .box h3{margin-bottom:18px;}
.box h2{font-size:1.4rem;}
.facts{display:grid; grid-template-columns:max-content 1fr; margin:0; border:1px solid var(--line); border-radius:var(--r-md); overflow:hidden; background:var(--white); box-shadow:var(--shadow-1);}
.facts dt, .facts dd{padding:16px 22px; margin:0; border-bottom:1px solid var(--line);}
.facts dt{font-weight:700; background:var(--nest); color:var(--navy); font-size:.95rem;}
.facts dt:last-of-type, .facts dd:last-of-type{border-bottom:0;}
.facts dd{overflow-wrap:anywhere;}
.principles{display:grid; grid-template-columns:repeat(3,1fr); border:1px solid var(--line); border-radius:var(--r-md); overflow:hidden; background:var(--white); box-shadow:var(--shadow-1);}
.principles > div{padding:30px 28px; border-right:1px solid var(--line);}
.principles > div:last-child{border-right:0;}
.principles h3{margin-bottom:8px; color:var(--navy);}
.principles p{margin:0; color:var(--muted);}

/* ---------- Guide stepper ---------- */
.guide{list-style:none; display:grid;}
.guide li{display:grid; grid-template-columns:64px 1fr; gap:22px; padding:26px 0; border-top:1px solid var(--line);}
.guide li:last-child{border-bottom:1px solid var(--line);}
.guide .n{width:48px; height:48px; font-size:1.2rem; box-shadow:0 0 0 4px var(--paper), 0 0 0 6px var(--amber-bright); margin:2px 0 0 4px;}
.guide h3{margin-bottom:6px; color:var(--navy);}
.guide p{margin:0; color:var(--muted);}

/* ---------- Roles ---------- */
.roles{display:grid; grid-template-columns:repeat(3,1fr); gap:20px;}
.role{background:var(--white); border:1px solid var(--line); border-radius:var(--r-md); padding:26px; box-shadow:var(--shadow-1);}
.role .ic{margin-bottom:14px;}
.role h3{font-size:1.1rem; margin-bottom:6px;}
.role p{margin:0; color:var(--muted); font-size:.98rem; line-height:1.6;}

/* ---------- Navy band ---------- */
.band{background:var(--navy); color:#fff; padding:76px 0 88px; position:relative;}
.band h2{color:#fff; margin-bottom:14px;}
.band p{color:#B8DDC2; font-size:1.15rem; max-width:58ch;}
.band .btn-row{margin-top:26px;}
.band .lane{position:absolute; left:0; right:0; bottom:30px;}

/* ---------- Page head ---------- */
.pagehead{background:var(--navy); padding:52px 0 54px; color:#fff;}
.crumbs{font-size:.9rem; color:#96D5A3; margin-bottom:16px;}
.crumbs a{color:#96D5A3;}
.pagehead h1{color:#fff; font-size:clamp(1.9rem,4.4vw,2.8rem); margin-bottom:14px;}
.pagehead .lede{margin:0; color:#D5EBDA;}

/* ---------- FAQ ---------- */
.faq{display:grid; gap:12px;}
.faq details{background:var(--white); border:1px solid var(--line); border-radius:var(--r-md); box-shadow:var(--shadow-1);}
.faq summary{cursor:pointer; list-style:none; padding:20px 24px; font:700 1.05rem var(--font); display:flex; gap:16px; justify-content:space-between; align-items:center; color:var(--navy);}
.faq summary::-webkit-details-marker{display:none;}
.faq summary::after{content:"+"; flex:none; width:30px; height:30px; border-radius:50%; background:var(--amber-tint); color:var(--amber-ink); display:flex; align-items:center; justify-content:center; font:700 1.3rem var(--font);}
.faq details[open] summary::after{content:"\2212";}
.faq details p{padding:0 24px 22px; margin:0; color:var(--muted);}

/* ---------- Forms ---------- */
form.card{background:var(--white); border:1px solid var(--line); border-radius:var(--r-md); padding:30px; display:grid; gap:18px; box-shadow:var(--shadow-1);}
label, legend{font-weight:700; font-size:.92rem; display:block; margin-bottom:6px; padding:0;}
input[type=text], input[type=tel], textarea{width:100%; padding:13px 15px; border:1.5px solid var(--line-strong); border-radius:var(--r-sm); font:inherit; font-size:1rem; background:#fff; color:var(--ink); min-height:48px;}
input[type=text]:focus, input[type=tel]:focus, textarea:focus{outline:3px solid rgba(0,59,27,.3); outline-offset:1px; border-color:var(--navy);}
textarea{min-height:110px; resize:vertical;}
fieldset{border:0; padding:0; margin:0;}
.checks{display:grid; grid-template-columns:1fr 1fr; gap:10px 18px;}
.checks label{display:flex; gap:10px; align-items:flex-start; font-weight:500; margin:0; cursor:pointer; line-height:1.4;}
.checks input{width:20px; height:20px; margin-top:1px; accent-color:var(--navy); flex:none;}
.hint{font-size:.9rem; color:var(--muted); margin:0;}

/* ---------- Contact list ---------- */
.contact-list{list-style:none; display:grid; gap:16px;}
.contact-list li{display:flex; gap:16px; align-items:flex-start; background:var(--white); border:1px solid var(--line); border-radius:var(--r-md); padding:22px; box-shadow:var(--shadow-1);}
.contact-list .ic{flex:none; width:48px; height:48px; border-radius:var(--r-sm); background:var(--navy-tint); color:var(--navy); display:flex; align-items:center; justify-content:center;}
.contact-list .ic svg{width:24px; height:24px;}
.contact-list li.urgent{border:2px solid var(--red);}
.contact-list li.urgent .ic{background:var(--red); color:#fff;}
.contact-list h3{font-size:1rem; margin-bottom:2px;}
.contact-list p{margin:0; overflow-wrap:anywhere;}
.contact-list a{font-weight:700;}

/* ---------- Prose ---------- */
.prose h2{font-size:1.45rem; margin:40px 0 12px; color:var(--navy);}
.prose h2:first-child{margin-top:0;}
.prose ul{padding-left:1.2em; margin-bottom:1em; display:grid; gap:6px;}
.prose p, .prose li{color:#2B3A31;}

/* ---------- Footer ---------- */
.site-foot{background:var(--navy-deep); color:#B8DDC2; padding:60px 0 28px; font-size:.97rem;}
.foot-grid{display:grid; grid-template-columns:1.4fr 1fr 1fr; gap:44px;}
.site-foot h3{color:#fff; font-size:1rem; margin-bottom:14px;}
.site-foot a{color:#E2F1E5; text-decoration:none;}
.site-foot a:hover{color:#FFE08A; text-decoration:underline;}
.foot-brand{display:flex; gap:14px; align-items:flex-start;}
.foot-brand img{height:56px; width:auto; background:#fff; border-radius:12px; padding:5px;}
.foot-brand b{display:block; color:#fff; font:800 1.15rem var(--font);}
.foot-brand span{display:block; font-size:.9rem; line-height:1.5; margin-top:2px;}
.site-foot ul{list-style:none; display:grid; gap:9px;}
.foot-note{margin-top:46px; padding-top:22px; border-top:1px solid rgba(255,255,255,.14); display:flex; flex-wrap:wrap; justify-content:space-between; gap:12px; font-size:.86rem; color:#8DB596;}

/* ---------- Floating WhatsApp (phones) ---------- */
.fab{display:none; position:fixed; z-index:90; right:calc(14px + env(safe-area-inset-right, 0px)); bottom:calc(14px + env(safe-area-inset-bottom, 0px)); background:var(--wa); color:#fff; padding:14px 20px; border-radius:999px; font-weight:700; text-decoration:none; align-items:center; gap:10px; box-shadow:0 10px 25px -5px rgba(0,59,27,.35);}
.fab svg{width:22px; height:22px;}
.fab:hover{color:#fff; background:#168a45;}

/* ---------- Responsive ---------- */
@media (max-width:1180px){
  .menu-btn{display:flex;}
  .nav a.home-link{display:block;}
  .nav{position:absolute; left:0; right:0; top:100%; background:var(--white); border-bottom:1px solid var(--line); flex-direction:column; align-items:stretch; padding:10px var(--gutter-r) 20px var(--gutter); gap:2px; display:none; box-shadow:0 18px 30px -18px rgba(15,23,42,.3);}
  .site-head.open .nav{display:flex;}
  .nav a.link{padding:14px 12px; font-size:1.05rem;}
  .nav a.link[aria-current="page"]{box-shadow:inset 4px 0 0 var(--amber-bright);}
  .langsw{margin:10px 0 0; align-self:flex-start;}
  .nav .btn{margin-top:10px;}
}
@media (max-width:860px){
  .sec{padding:56px 0;}
  .hero{padding:32px 0 48px;}
  .hero-grid, .split, .split.wide-left{grid-template-columns:1fr; gap:34px;}
  .features{grid-template-columns:1fr; gap:18px;}
  .steps{grid-template-columns:1fr; gap:26px;}
  .steps::before{left:27px; right:auto; top:28px; bottom:28px; width:0; height:auto; border-top:0; border-left:3px dashed var(--line-strong);}
  .steps li{display:grid; grid-template-columns:56px 1fr; gap:0 22px;}
  .steps .n{margin-bottom:0; grid-row:1 / span 2;}
  .principles{grid-template-columns:1fr;}
  .principles > div{border-right:0; border-bottom:1px solid var(--line);}
  .principles > div:last-child{border-bottom:0;}
  .roles{grid-template-columns:1fr 1fr;}
  .foot-grid{grid-template-columns:1fr; gap:32px;}
  .fab{display:inline-flex;}
  body{padding-bottom:78px;}
  .band{padding:56px 0 78px;}
  .facts{grid-template-columns:1fr;}
  .facts dt{border-bottom:0; padding-bottom:4px;}
  .facts dd{padding-top:4px;}
  .facts-row{gap:12px;}
}
@media (max-width:560px){
  body{font-size:16.5px;}
  .roles{grid-template-columns:1fr;}
  .checks{grid-template-columns:1fr;}
  .brand-text span{display:none;}
  .brand img{height:42px;}
  .btn-row .btn{width:100%;}
  .callout{flex-direction:column; padding:22px;}
  .guide li{grid-template-columns:48px 1fr; gap:16px;}
  form.card, .box, .feature{padding:22px;}
  .road{padding:32px 20px 60px;}
  .facts-row{grid-template-columns:1fr; text-align:left;}
  .facts-row > div{display:flex; align-items:baseline; gap:16px;}
  .facts-row .lbl{margin-top:0;}
  .facts-row .num{min-width:96px;}
}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto;}
  .btn{transition:none;}
}

/* ---------- Redesign additions (home, guide cards, contact block) ---------- */
.chips{display:flex; flex-wrap:wrap; gap:8px; margin-bottom:20px;}
.chips .chip{display:inline-flex; align-items:center; gap:7px; font-size:.82rem; padding:7px 13px;}
.chips .chip svg{width:15px; height:15px;}
.hero{padding:56px 0 64px;}
.mini{display:flex; gap:14px; align-items:center; margin-top:30px; background:var(--white); border:1px solid var(--line); border-radius:var(--r-md); padding:16px 18px; box-shadow:var(--shadow-1); max-width:520px;}
.mini .ic{flex:none; width:46px; height:46px; border-radius:var(--r-sm); background:var(--wa); color:#fff; display:flex; align-items:center; justify-content:center;}
.mini .ic svg{width:24px; height:24px;}
.mini b{display:block; color:var(--navy);}
.mini span{display:block; font-size:.9rem; color:var(--muted); line-height:1.45;}
.art-wrap{position:relative;}
.art{width:100%; height:auto; border-radius:var(--r-lg); box-shadow:var(--shadow-2); border:1px solid var(--line);}
.float{position:absolute; left:-18px; bottom:-22px; background:var(--white); border:1px solid var(--line); border-radius:var(--r-md); padding:12px 16px; display:flex; gap:12px; align-items:center; box-shadow:var(--shadow-2); max-width:300px;}
.float img{height:44px; width:auto; flex:none;}
.float b{display:block; font-size:.92rem; color:var(--navy);}
.float span{display:block; font-size:.8rem; color:var(--muted); font-variant-numeric:tabular-nums;}
.feature .more{display:inline-block; margin-top:16px; font-weight:700; font-size:.95rem; text-decoration:none; color:var(--navy);}
.feature .more:hover{color:var(--amber-ink); text-decoration:underline;}
.gcards{list-style:none; display:grid; grid-template-columns:repeat(3,1fr); gap:20px;}
.gcard{background:var(--white); border:1px solid var(--line); border-radius:var(--r-md); padding:24px; box-shadow:var(--shadow-1);}
.gcard .gtop{display:flex; align-items:center; justify-content:space-between; margin-bottom:16px;}
.gcard .n{width:44px; height:44px; font-size:1.1rem; margin:0; box-shadow:0 0 0 3px var(--white), 0 0 0 5px var(--amber-bright);}
.gcard h3{margin-bottom:8px; color:var(--navy); font-size:1.1rem;}
.gcard p{margin:0; color:var(--muted); font-size:.98rem; line-height:1.6;}
.reach{background:var(--navy); color:#fff; padding:80px 0;}
.reach h2{color:#fff; margin-bottom:14px;}
.reach p{color:#B8DDC2; font-size:1.1rem; max-width:52ch;}
.reach p.note{font-size:.95rem; background:rgba(255,255,255,.08); border:1px solid rgba(255,255,255,.18); border-radius:var(--r-sm); padding:12px 16px; color:#E2F1E5;}
.reach-list{list-style:none; display:grid; gap:12px; margin-top:22px;}
.reach-list li{display:flex; gap:12px; align-items:center; color:#fff; overflow-wrap:anywhere;}
.reach-list svg{width:22px; height:22px; color:var(--amber-bright); flex:none;}
.reach form.card{color:var(--ink);}
.reach form.card h3{color:var(--navy);}
.reach form.card .hint{color:var(--muted);}
@media (max-width:860px){
  .gcards{grid-template-columns:1fr 1fr;}
  .float{left:12px; bottom:-18px;}
  .art-wrap{margin-bottom:22px;}
  .reach{padding:56px 0;}
}
@media (max-width:560px){
  .gcards{grid-template-columns:1fr;}
  .float{position:static; margin-top:12px; max-width:none;}
  .art-wrap{margin-bottom:0;}
  .hero{padding:28px 0 44px;}
}