:root{
  --c1:#2E8B57;--c2:#FFD700;--ink:#1a1a1a;--mut:#666666;
  --card:#f8f9fa;--bg:#ffffff;--radius:12px;
  --accent:#228B22;--light:#f0f8f0;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--bg);color:var(--ink);
     font-family:system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,'Helvetica Neue',Arial,sans-serif;
     font-size:16px;line-height:1.65}
a{color:var(--c1);text-decoration:none;transition:color 0.3s ease}
a:hover{color:var(--accent);text-decoration:underline}
.container{max-width:1160px;margin:0 auto;padding:1rem}
header{background:var(--card);border-bottom:1px solid #e5e7eb}
.header-wrap{display:flex;align-items:center;justify-content:space-between;gap:1rem}
.logo{display:flex;align-items:center;gap:.75rem;font-weight:700}
nav ul{display:flex;gap:.5rem;list-style:none;margin:0;padding:0;flex-wrap:wrap}
nav a{display:inline-block;padding:.5rem .75rem;border-radius:10px}
nav a[aria-current="page"], nav a:focus{background:rgba(11,122,117,.1);outline:2px solid transparent}
.hero{display:grid;grid-template-columns:1.1fr 0.9fr;gap:1rem;align-items:center;padding:1rem 0}
.card{background:var(--card);border-radius:var(--radius);padding:1.5rem;box-shadow:0 2px 8px rgba(0,0,0,0.1);transition:transform 0.3s ease, box-shadow 0.3s ease}
.card:hover{transform:translateY(-2px);box-shadow:0 4px 16px rgba(0,0,0,0.15)}
.badges{display:flex;gap:.5rem;flex-wrap:wrap;margin:.5rem 0}
.badge{background:var(--light);color:var(--c1);border-radius:20px;padding:.4rem .8rem;font-size:.85rem;font-weight:500;border:1px solid rgba(46,139,87,0.2)}
.grid{display:grid;gap:1rem}
.grid.cols-3{grid-template-columns:repeat(auto-fit,minmax(250px,1fr))}
.grid.cols-2{grid-template-columns:repeat(auto-fit,minmax(320px,1fr))}
.cta{display:inline-block;background:var(--c1);color:#fff;padding:.75rem 1.5rem;border-radius:8px;font-weight:600;transition:all 0.3s ease;border:none;cursor:pointer}
.cta:hover{background:var(--accent);transform:translateY(-1px);text-decoration:none;box-shadow:0 4px 12px rgba(46,139,87,0.3)}
footer{background:var(--card);border-top:1px solid #e5e7eb;margin-top:2rem}
.footer-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:1rem}
.small{font-size:.925rem;color:var(--mut)}
/* Cookie banner */
.cookie-banner{position:fixed;inset:auto 1rem 1rem 1rem;background:#0b1324;color:#fff;border-radius:14px;padding:1rem;z-index:9999;display:none}
.cookie-actions{display:flex;gap:.5rem;flex-wrap:wrap;margin-top:.75rem}
.cookie-actions button{border:0;border-radius:10px;padding:.5rem .8rem;cursor:pointer}
.btn-yes{background:#15803d;color:#fff}
.btn-no{background:#ef4444;color:#fff}
.btn-part{background:#f59e0b;color:#111827}
/* Form styles */
form{display:flex;flex-direction:column;gap:1rem}
label{display:flex;flex-direction:column;gap:0.5rem;font-weight:500}
input, textarea{padding:0.75rem;border:2px solid #e5e7eb;border-radius:8px;font-size:1rem;transition:border-color 0.3s ease}
input:focus, textarea:focus{outline:none;border-color:var(--c1);box-shadow:0 0 0 3px rgba(46,139,87,0.1)}

/* List styles */
ul{list-style:none;padding:0}
li{margin-bottom:0.5rem}
li:before{content:"•";color:var(--c1);font-weight:bold;margin-right:0.5rem}

/* Details/Summary styles */
details{border:1px solid #e5e7eb;border-radius:8px;overflow:hidden}
summary{padding:1rem;background:var(--light);cursor:pointer;font-weight:600;transition:background 0.3s ease}
summary:hover{background:rgba(46,139,87,0.1)}
details[open] summary{border-bottom:1px solid #e5e7eb}
details p{padding:1rem;margin:0}

/* Button styles */
button{background:var(--c1);color:white;border:none;padding:0.75rem 1.5rem;border-radius:8px;cursor:pointer;font-weight:600;transition:all 0.3s ease}
button:hover{background:var(--accent);transform:translateY(-1px)}

/* Table styles */
table{width:100%;border-collapse:collapse;margin:1rem 0}
th, td{padding:0.75rem;text-align:left;border-bottom:1px solid #e5e7eb}
th{background:var(--light);font-weight:600;color:var(--c1)}

/* Select styles */
select{padding:0.75rem;border:2px solid #e5e7eb;border-radius:8px;font-size:1rem;background:white;transition:border-color 0.3s ease}
select:focus{outline:none;border-color:var(--c1);box-shadow:0 0 0 3px rgba(46,139,87,0.1)}

/* Blockquote styles */
blockquote{border-left:4px solid var(--c1);padding-left:1rem;margin:1rem 0;font-style:italic;background:var(--light);padding:1rem;border-radius:8px}
cite{display:block;margin-top:0.5rem;font-size:0.9rem;color:var(--mut);font-style:normal}

@media (max-width:900px){.hero{grid-template-columns:1fr}
.container{padding:0.75rem}
.header-wrap{flex-direction:column;gap:1rem}
nav ul{justify-content:center}}