:root{
  --bg:#ffffff; --ink:#0d1b1e; --muted:#6b7a86;
  --brand:#2b6f73; --gold:#c8a880; --card:#f6f8f9;
}
*{box-sizing:border-box}
html,body{margin:0;padding:0;background:var(--bg);color:var(--ink);font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,'Helvetica Neue','Noto Sans',Arial,sans-serif;line-height:1.5}
img{max-width:100%;display:block}

#hero{position:relative;min-height:82vh;display:grid;place-items:center;background:#eef3f4 url('assets/img/hero_logo.jpeg') center/cover no-repeat}
#hero .hero-overlay{position:absolute;inset:0;background:linear-gradient(180deg,rgba(255,255,255,.75),rgba(255,255,255,.9))}
.hero-content{position:relative;text-align:center;padding:4rem 1rem;max-width:980px}
.hero-logo{width:min(520px,80vw);margin:0 auto 1rem;filter:drop-shadow(0 10px 20px rgba(0,0,0,.12))}
.cert{margin:.2rem 0 1rem;color:var(--brand);font-weight:700}
h1{font-size:clamp(1.6rem,2.8vw+1rem,2.6rem);margin:.2rem auto 0}
.sub{color:var(--muted);margin:.3rem auto 1.2rem}
.cta,.cta.ghost{display:inline-block;padding:.85rem 1.2rem;border-radius:.8rem;font-weight:700;text-decoration:none;transition:transform .2s,box-shadow .2s}
.cta{background:var(--brand);color:#fff;box-shadow:0 8px 18px rgba(43,111,115,.25)}
.cta:hover{transform:translateY(-2px);box-shadow:0 12px 22px rgba(43,111,115,.35)}
.cta.ghost{background:transparent;color:var(--brand);border:2px solid var(--brand)}
.cta.ghost:hover{transform:translateY(-2px);background:var(--brand);color:#fff}

#sticky{position:sticky;top:0;z-index:9;background:#fffcc;backdrop-filter:saturate(180%) blur(8px);border-bottom:1px solid #e8edf0;display:flex;gap:.4rem;flex-wrap:wrap;justify-content:center;padding:.4rem .6rem}
#sticky a{color:var(--brand);text-decoration:none;padding:.5rem .6rem;border-radius:.6rem;transition:background .2s}
#sticky a:hover{background:#e9f3f3}

.section{padding:3.2rem 1rem;max-width:1100px;margin:0 auto}
.section.alt{background:#f7fafb}
.section.small{padding:1.6rem 1rem;text-align:center;color:var(--muted)}
.center{text-align:center}
.muted{color:var(--muted)}

.cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:1rem}
.cards.three .card{min-height:140px}
.cards.two{grid-template-columns:repeat(auto-fit,minmax(260px,1fr))}
.card{background:#fff;border:1px solid #e7edf0;border-radius:14px;padding:1rem .9rem;box-shadow:0 10px 20px rgba(0,0,0,.04);transition:transform .2s,box-shadow .2s}
.card:hover{transform:translateY(-4px);box-shadow:0 16px 26px rgba(0,0,0,.08)}
.card h3{margin:.2rem 0 .4rem;font-size:1.05rem;color:#173e41}

.timeline{counter-reset:step;padding-left:0;list-style:none;max-width:720px;margin:0 auto}
.timeline li{position:relative;margin:0 0 1rem 2.4rem;padding:.4rem .6rem;border-left:3px solid var(--brand);background:#fff;border-radius:.4rem}
.timeline li::before{counter-increment:step;content:counter(step);position:absolute;left:-2.2rem;top:.2rem;background:var(--brand);color:#fff;width:1.6rem;height:1.6rem;border-radius:999px;display:grid;place-items:center;font-weight:700}

.schedule{list-style:none;padding:0;margin:0 auto;max-width:520px}
.schedule li{display:flex;justify-content:space-between;border:1px dashed #dfe8ea;border-radius:.6rem;padding:.7rem 1rem;margin:.5rem 0;background:#fff}
.schedule span{color:var(--muted)}

.gallery{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:.6rem}
.gallery .g-item{display:block;border-radius:.6rem;overflow:hidden;border:1px solid #e5ecef;background:#fff;box-shadow:0 6px 16px rgba(0,0,0,.04)}
.gallery img{width:100%;height:180px;object-fit:cover;transition:transform .25s}
.gallery .g-item:hover img{transform:scale(1.05)}

.pdfs{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:1rem}
.pdf-wrap{border:1px solid #e6ecef;border-radius:.6rem;overflow:hidden;background:#fff;box-shadow:0 6px 20px rgba(0,0,0,.05)}
.pdf-wrap embed{width:100%;height:400px;display:block}

.notice{margin-top:1rem;color:var(--muted);font-size:.95rem}

.cta-float{position:fixed;right:16px;bottom:16px;background:var(--brand);color:#fff;text-decoration:none;padding:.9rem 1rem;border-radius:999px;box-shadow:0 18px 36px rgba(43,111,115,.35);font-weight:800;z-index:20}
.cta-float:hover{transform:translateY(-2px)}

[data-anim]{opacity:0;transform:translateY(16px);transition:all .45s cubic-bezier(.19,1,.22,1)}
[data-anim].in{opacity:1;transform:none}
[data-anim="zoom"]{transform:scale(.96)}

@media (prefers-reduced-motion:no-preference){
  .hero-logo{animation:float 5s ease-in-out infinite}
  @keyframes float{0%%,100%%{transform:translateY(0)}50%%{transform:translateY(-6px)}}
}