:root{
  --bg:#f6f7f9;--surface:#fff;--text:#1e2430;--muted:#5d6678;--brand:#1f6feb;--brand-dark:#164fa8;
  --border:#d9dee8;--shadow:0 10px 30px rgba(15,23,42,.08);--radius:18px;--max:1120px;
}
*{box-sizing:border-box} html{scroll-behavior:smooth}
body{margin:0;font-family:Arial,Helvetica,sans-serif;color:var(--text);background:var(--bg);line-height:1.6}
img{max-width:100%;display:block} a{color:var(--brand);text-decoration:none} a:hover{text-decoration:underline}
.container{width:min(100% - 2rem,var(--max));margin-inline:auto}
.site-header{background:#0f172a;color:#fff;position:sticky;top:0;z-index:10;box-shadow:0 3px 14px rgba(0,0,0,.15)}
.nav{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:1rem 0}
.brand{color:#fff;font-weight:700;font-size:1.15rem}
.nav-links{display:flex;gap:1rem;flex-wrap:wrap}.nav-links a{color:#e5e7eb;padding:.5rem .8rem;border-radius:999px}
.nav-links a:hover,.nav-links a[aria-current="page"]{background:rgba(255,255,255,.1);text-decoration:none}
.hero{background:linear-gradient(135deg,#0f172a,#1d4ed8);color:#fff;padding:5rem 0 4rem}
.hero-grid{display:grid;grid-template-columns:1.25fr .95fr;gap:2rem;align-items:center}
.hero-card,.card{background:var(--surface);color:var(--text);border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow);padding:1.4rem}
.hero h1{font-size:clamp(2rem,4vw,3.5rem);line-height:1.1;margin:0 0 1rem}.hero p{font-size:1.1rem;max-width:50ch;color:#e5e7eb}
.hero .actions{display:flex;gap:1rem;flex-wrap:wrap;margin-top:1.25rem}
.button{display:inline-block;background:var(--brand);color:#fff;padding:.9rem 1.2rem;border-radius:12px;font-weight:700;border:none;cursor:pointer}
.button:hover{background:var(--brand-dark);text-decoration:none}.button.secondary{background:#fff;color:#0f172a}
.section{padding:4rem 0}.section-title{font-size:clamp(1.7rem,3vw,2.4rem);margin:0 0 .5rem}.section-subtitle{color:var(--muted);margin:0 0 2rem}
.grid-3,.grid-2{display:grid;gap:1.25rem}.grid-3{grid-template-columns:repeat(3,1fr)}.grid-2{grid-template-columns:repeat(2,1fr)}
.list-clean{list-style:none;padding:0;margin:0}.list-clean li{padding:.35rem 0;border-bottom:1px solid var(--border)}.list-clean li:last-child{border-bottom:none}
.badge{display:inline-block;background:#e0ecff;color:#133a7c;padding:.35rem .7rem;border-radius:999px;font-weight:700;font-size:.9rem}
.notice{background:#ecfeff;border:1px solid #a5f3fc;padding:1rem 1.2rem;border-radius:14px}
.table-wrap{overflow:auto;background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow)}
table{width:100%;border-collapse:collapse;min-width:760px} th,td{padding:1rem;text-align:left;border-bottom:1px solid var(--border);vertical-align:top} th{background:#f8fafc;font-size:.95rem}
.gallery{display:grid;grid-template-columns:repeat(3,1fr);gap:1.25rem}.gallery figure{margin:0;background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow)}
.gallery .placeholder{aspect-ratio:4/3;display:grid;place-items:center;background:linear-gradient(135deg,#dbeafe,#e2e8f0);color:#334155;font-weight:700;text-align:center;padding:1rem}.gallery figcaption{padding:1rem}
form{display:grid;gap:1rem} label{font-weight:700} input,textarea{width:100%;padding:.9rem 1rem;border:1px solid var(--border);border-radius:12px;font:inherit} textarea{min-height:170px;resize:vertical}
.site-footer{background:#0f172a;color:#cbd5e1;padding:2rem 0;margin-top:3rem}.footer-grid{display:flex;justify-content:space-between;gap:1rem;flex-wrap:wrap}.small{font-size:.95rem;color:var(--muted)}
.success,.error{padding:1rem 1.2rem;border-radius:12px;margin-bottom:1rem}.success{background:#ecfdf5;border:1px solid #a7f3d0;color:#065f46}.error{background:#fef2f2;border:1px solid #fecaca;color:#991b1b}
@media (max-width:900px){.hero-grid,.grid-3,.grid-2,.gallery{grid-template-columns:1fr}.nav{align-items:flex-start;flex-direction:column}}