
:root {
  --primary: #0f766e;
  --accent: #16a34a;
  --dark: #0b1220;
  --muted: #f5f7fb;
}
* { box-sizing: border-box; }
html, body { margin:0; padding:0; font-family: system-ui, -apple-system, Segoe UI, Roboto, Inter, Arial, sans-serif; color:#111827; background:#fafafa; }
a { color: var(--primary); text-decoration: none; }
a:hover { text-decoration: underline; }
.wrap { width: 100%; margin: 0 auto; padding: 0 16px; }
.header { position: sticky; top:0; backdrop-filter: blur(8px); background: rgba(255,255,255,0.85); border-bottom:1px solid #e5e7eb; z-index:100; }
.nav { height:64px; display:flex; align-items:center; justify-content:space-between; gap:16px; }
.nav nav a { margin-left: 14px; padding:8px 10px; border-radius: 10px; }
.nav nav a:hover { background:#eef2f7; text-decoration:none; }
.logo { font-weight:600; color:var(--dark); }
.hero { position:relative; overflow:hidden; }
.hero .img { height: min(70vh, 680px); min-height: 420px; background-size:cover; background-position:center; }
.hero .overlay { position:absolute; inset:0; background: linear-gradient(to top, rgba(0,0,0,.6), rgba(0,0,0,.1), transparent); }
.hero .text { position:absolute; left:0; right:0; bottom:0; padding:24px; color:#fff; }
h1 { font-size: clamp(26px, 4vw, 52px); margin:0 0 6px; }
h2 { font-size: clamp(20px, 2.4vw, 28px); margin: 0 0 14px; }
p.lead { opacity:.95; max-width: 800px; }
.btn { display:inline-block; background: var(--accent); color:#fff; padding:12px 16px; border-radius: 12px; font-weight:600; }
.btn:hover { background: #15803d; text-decoration:none; }
.section { padding: 36px 0; }
.grid { display:grid; gap:16px; }
.grid-3 { grid-template-columns: repeat(3, minmax(0,1fr)); }
@media (max-width: 900px) { .grid-3 { grid-template-columns: 1fr; } }
.card { background:#fff; border:1px solid #e5e7eb; border-radius: 18px; padding:16px; box-shadow: 0 6px 20px rgba(2,8,23,0.04); }
.card .thumb { height: 180px; border-radius: 12px; margin-bottom: 10px; background-size:cover; background-position:center; }
.block { background:#fff; border:1px solid #e5e7eb; border-radius: 18px; padding:20px; }
.badge { display:inline-block; padding:6px 10px; border-radius: 999px; font-size: 12px; background: #ecfdf5; color: #065f46; border:1px solid #a7f3d0; }
.footer { border-top:1px solid #e5e7eb; margin-top: 40px; }
.footer .wrap { padding: 24px 16px; color:#6b7280; font-size: 14px; }
.reveal { opacity:0; transform: translateY(10px); transition: opacity .7s ease, transform .7s ease; }
.reveal.show { opacity:1; transform: translateY(0); }
input, textarea { width:100%; padding:12px 12px; border:1px solid #e5e7eb; border-radius: 12px; background:#fff; }
form .row { display:grid; gap:12px; grid-template-columns: repeat(2, minmax(0,1fr)); }
@media (max-width:800px) { form .row { grid-template-columns: 1fr; } }
