
:root{
    --green:#1fa463;
    --green-dark:#147447;
    --blue:#00a3e0;
    --yellow:#ffd447;
    --dark:#1f2937;
    --light:#f7faf8;
    --text:#24312b;
    --muted:#667085;
    --card:#ffffff;
    --radius:22px;
    --shadow:0 14px 35px rgba(31,41,55,.10);
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{
    font-family:Arial,Helvetica,sans-serif;
    color:var(--text);
    background:linear-gradient(180deg,#f4fff8 0%,#ffffff 38%);
    line-height:1.65;
}
a{color:inherit}
.container{
    width:min(1120px,92%);
    margin:0 auto;
}
.topbar{
    background:var(--green-dark);
    color:#fff;
    font-size:14px;
    padding:10px 0;
    text-align:center;
}
.hero{
    padding:34px 0 42px;
    text-align:center;
    background:
        radial-gradient(circle at top left, rgba(255,212,71,.32), transparent 34%),
        radial-gradient(circle at bottom right, rgba(0,163,224,.18), transparent 32%);
}
.logo{
    max-width:230px;
    height:auto;
    margin:0 auto 18px;
    display:block;
}
.eyebrow{
    display:inline-flex;
    gap:8px;
    align-items:center;
    background:#fff;
    color:var(--green-dark);
    border:1px solid rgba(31,164,99,.22);
    padding:8px 14px;
    border-radius:999px;
    font-weight:700;
    margin-bottom:16px;
}
h1{
    font-size:clamp(32px,6vw,58px);
    line-height:1.05;
    color:var(--dark);
    margin-bottom:14px;
}
.hero p{
    color:var(--muted);
    max-width:760px;
    margin:0 auto;
    font-size:18px;
}
.quicklinks{
    display:flex;
    flex-wrap:wrap;
    gap:12px;
    justify-content:center;
    margin-top:26px;
}
.btn{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:8px;
    text-decoration:none;
    border-radius:999px;
    padding:13px 20px;
    background:var(--green);
    color:#fff;
    font-weight:700;
    border:0;
    box-shadow:0 8px 18px rgba(31,164,99,.22);
}
.btn.secondary{
    background:#fff;
    color:var(--green-dark);
    border:1px solid rgba(31,164,99,.24);
    box-shadow:none;
}
.btn.blue{background:var(--blue)}
.cards{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:22px;
    margin:38px auto;
}
.card{
    display:flex;
    flex-direction:column;
    justify-content:space-between;
    min-height:245px;
    padding:26px;
    background:var(--card);
    border-radius:var(--radius);
    box-shadow:var(--shadow);
    text-decoration:none;
    border:1px solid rgba(20,116,71,.08);
    transition:.2s ease;
}
.card:hover{transform:translateY(-4px)}
.card h2{
    color:var(--green-dark);
    line-height:1.15;
    margin-bottom:10px;
}
.card p{color:var(--muted)}
.badge{
    display:inline-block;
    margin-top:18px;
    color:var(--dark);
    background:var(--yellow);
    padding:8px 12px;
    border-radius:999px;
    font-size:14px;
    font-weight:700;
}
.page-title{
    padding:26px 0 18px;
}
.breadcrumb{
    margin-bottom:18px;
    color:var(--muted);
}
.breadcrumb a{color:var(--green-dark);font-weight:700;text-decoration:none}
.info-grid{
    display:grid;
    grid-template-columns:1.15fr .85fr;
    gap:24px;
    align-items:start;
    margin:24px 0 36px;
}
.panel{
    background:#fff;
    border-radius:var(--radius);
    box-shadow:var(--shadow);
    padding:28px;
    border:1px solid rgba(20,116,71,.08);
}
.panel h2{
    color:var(--green-dark);
    margin-bottom:14px;
    line-height:1.2;
}
.panel h3{
    color:var(--dark);
    margin:20px 0 8px;
}
.panel ul{
    margin-left:22px;
}
.notice{
    background:#fff9df;
    border-left:5px solid var(--yellow);
    padding:16px;
    border-radius:14px;
    margin:18px 0;
}
.coordinator{
    position:sticky;
    top:20px;
}
.contact-card{
    background:var(--light);
    border-radius:18px;
    padding:18px;
    margin:14px 0;
}
.contact-card strong{color:var(--green-dark)}
.actions{
    display:grid;
    gap:10px;
    margin-top:18px;
}
.site-switch{
    display:grid;
    gap:10px;
    margin-top:20px;
}
.site-switch a{
    display:block;
    text-decoration:none;
    background:#f2fbf6;
    border:1px solid rgba(31,164,99,.16);
    border-radius:14px;
    padding:12px 14px;
    color:var(--green-dark);
    font-weight:700;
}
.footer{
    margin-top:30px;
    background:var(--dark);
    color:#fff;
    text-align:center;
    padding:42px 20px;
    font-size:14px;
}
.footer .container{max-width:960px}
.footer a{color:#8dd3ff;text-decoration:none;font-weight:700}
.footer hr{
    border:0;
    border-top:1px solid rgba(255,255,255,.18);
    margin:24px auto;
}
.footer h3{margin-bottom:10px}
.footer p{margin:8px 0;color:rgba(255,255,255,.88)}
.map-fullwidth{
    width:100%;
    margin:0;
    padding:0;
    background:#ddd;
}
.map-fullwidth iframe{
    display:block;
    width:100%;
    height:520px;
    border:0;
}
@media(max-width:900px){
    .cards,.info-grid{grid-template-columns:1fr}
    .coordinator{position:static}
}
@media(max-width:560px){
    .hero{padding:24px 0 32px}
    .cards{margin:24px auto}
    .card,.panel{padding:22px}
    .btn{width:100%}
    .quicklinks{align-items:stretch}
    .map-fullwidth iframe{height:420px}
}
