:root{
    --stroke: rgba(15, 23, 42, .16);
    --green: #0a8f2a;
    --gradient: linear-gradient(135deg, rgba(10,143,42,.97) 0%, rgba(18,166,58,.94) 50%, rgba(10,143,42,.927) 100%);

    --hb-bg: #f6f7f9;
    --hb-card: #ffffff;
    --hb-text: #0b0f14;
    --hb-muted: rgba(11, 15, 20, .72);
    --hb-muted2: rgba(11, 15, 20, .55);

    --hb-green: #138a2b;
    --hb-green-hover: #0f7a25;

    --hb-radius-card: 46px;
    --hb-radius-media: 28px;

    --hb-shadow: 0 18px 50px rgba(16, 24, 40, .08);
}

*{ box-sizing:border-box; }
html, body { height: 100%; }

body{
    margin:0;
    font-family: Inter, system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
    color: var(--hb-text);
    background: var(--hb-bg);
    min-height: 100vh;
    display: flex;
    flex-direction: column;
}


img{ max-width:100%; height:auto; display:block; }

.section{ padding: 32px 0; }
@media (max-width: 768px){ .section{ padding: 24px 0; } }
@media (max-width: 480px){ .section{ padding: 15px 0; } }

.container{
    width: 100%;
    max-width: 1200px;
    margin: 0 auto;
    padding-left: 24px;
    padding-right: 24px;
}
@media (min-width: 1400px){ .container{ max-width: 1320px; } }
@media (max-width: 1024px){ .container{ padding-left: 20px; padding-right: 20px; } }
@media (max-width: 768px){ .container{ padding-left: 16px; padding-right: 16px; } }
@media (max-width: 480px){ .container{ padding-left: 5px; padding-right: 5px; } }