:root{--accent:#2E9E6B;--accent2:#E3C56D;--dark:#12291F;--muted:#6b7a70;--line:#e2ece6}
*{box-sizing:border-box;margin:0;padding:0}
body{font-family:'Segoe UI',system-ui,sans-serif;color:#22312a;background:#fdfcf9;line-height:1.7}
a{color:var(--accent);text-decoration:none}a:hover{text-decoration:underline}
header.site{background:var(--dark);color:#fff;padding:16px 32px;display:flex;align-items:center;justify-content:space-between;position:sticky;top:0;z-index:9}
header.site .brand{font-size:19px;font-weight:700;letter-spacing:.4px}
header.site .brand::after{content:"";display:inline-block;width:8px;height:8px;border-radius:50%;background:var(--accent2);margin-left:8px;vertical-align:2px}
header.site nav a{color:#cfe0d6;margin-left:22px;font-size:14px}
.hero{background:linear-gradient(125deg,var(--dark) 20%,color-mix(in srgb,var(--accent) 55%,var(--dark)));color:#fff;text-align:center;padding:84px 24px}
.hero h1{font-size:42px;margin-bottom:14px;letter-spacing:.3px}
.hero p{font-size:17px;opacity:.88;max-width:640px;margin:0 auto 26px}
.btn{display:inline-block;background:var(--accent);color:#fff;padding:13px 32px;border-radius:9px;font-weight:600;letter-spacing:.2px}
.btn:hover{filter:brightness(1.06);box-shadow:0 6px 20px color-mix(in srgb,var(--accent) 45%,transparent);text-decoration:none}
main{max-width:1080px;margin:0 auto;padding:48px 24px}
h2.sec{font-size:24px;margin:44px 0 8px}
h2.sec::after{content:"";display:block;width:56px;height:3px;background:var(--accent2);border-radius:2px;margin-top:8px}
h2.sec+p.sub{color:var(--muted);margin-bottom:22px}
.grid{display:grid;gap:16px}.g3{grid-template-columns:repeat(3,1fr)}.g4{grid-template-columns:repeat(4,1fr)}
@media(max-width:820px){.g3,.g4{grid-template-columns:repeat(2,1fr)}}
.card{border:1px solid var(--line);border-radius:12px;padding:18px;background:#fff;transition:box-shadow .15s,transform .15s}
.card:hover{box-shadow:0 8px 24px color-mix(in srgb,var(--accent) 14%,transparent);transform:translateY(-2px)}
.card h3{font-size:16px;margin-bottom:6px}.card p{font-size:13.5px;color:var(--muted)}
.card .tag{display:inline-block;font-size:11px;background:color-mix(in srgb,var(--accent2) 22%,#fff);color:#77611c;border:1px solid color-mix(in srgb,var(--accent2) 45%,#fff);border-radius:12px;padding:2px 10px;margin-bottom:8px;letter-spacing:.3px}
.disclaimer{font-size:12px;color:var(--muted);background:#f7faf5;border:1px solid var(--line);border-radius:9px;padding:14px 16px;margin:34px 0}
footer{background:var(--dark);color:#a8c0b2;padding:34px 24px;text-align:center;font-size:13.5px}
footer a{color:#cfe0d6;margin:0 10px}
table{width:100%;border-collapse:collapse;font-size:14px;margin:18px 0}
th{background:color-mix(in srgb,var(--accent) 8%,#fff);text-align:left;padding:10px 12px}td{padding:10px 12px;border-bottom:1px solid var(--line)}
.heroimg{width:100%;height:230px;object-fit:cover;border-radius:12px;margin-top:10px}
.card{overflow:hidden}
.card .thumb{display:block;width:calc(100% + 36px);max-width:none;height:150px;object-fit:cover;border-radius:11px 11px 0 0;margin:-18px -18px 14px}
.card .thumblink{display:block;margin:-18px -18px 14px}
.card .thumblink .thumb{margin:0;width:100%}
.grid.offers .card{display:flex;flex-direction:column;height:100%}
.grid.offers .card p:last-child{margin-top:auto !important}
.grid.offers .card .btn{display:block;text-align:center}
details{border:1px solid var(--line);border-radius:10px;padding:12px 16px;margin-bottom:10px;background:#fff}
details summary{cursor:pointer;font-weight:600;font-size:14.5px}
details[open]{border-color:color-mix(in srgb,var(--accent) 35%,var(--line))}