.hg-section { padding-block: clamp(56px, 7vw, 96px); background: var(--hs-cream); border-block: 1px solid var(--hs-beige); }
.hg-heading { display: grid; grid-template-columns: 1.1fr 1fr; gap: 28px 64px; align-items: end; margin-bottom: 40px; }
.hg-heading h2 { max-width: 22ch; margin: 0; color: var(--hs-green); font-family: var(--hs-serif); font-size: clamp(2rem, 3.7vw, 3.3rem); font-weight: 400; line-height: 1.2; overflow-wrap: anywhere; }
.hg-intro { max-width: 52ch; margin: 0; font-size: 1.0625rem; line-height: 1.75; }
.hg-list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 56px; list-style: none; padding: 0; margin: 0; }
.hg-item { display: grid; grid-template-columns: 42px minmax(0, 1fr); column-gap: 20px; padding-block: 26px; border-top: 1px solid var(--hs-beige); scroll-margin-top: 24px; }
.hg-number { color: var(--hs-burgundy); font-family: var(--hs-serif); font-size: 1.6rem; line-height: 1.5; }
.hg-category { margin: 0 0 8px; color: var(--hs-chestnut); font-size: .875rem; line-height: 1.5; }
.hg-item h2 { margin: 0 0 12px; color: var(--hs-green); font-family: var(--hs-serif); font-size: 1.5rem; font-weight: 400; line-height: 1.3; overflow-wrap: anywhere; }
.hg-description { margin: 0; font-size: 1rem; line-height: 1.75; }
.hg-link { display: inline-flex; align-items: center; gap: 8px; min-height: 44px; margin-top: 8px; color: var(--hs-green); font-size: .9375rem; font-weight: 700; }
.hg-link:hover { color: var(--hs-burgundy); }
.hg-link:focus-visible, .hg-jump a:focus-visible { outline: 2px solid currentColor; outline-offset: 5px; }
.hg-note { margin: 16px 0 0; padding-top: 24px; border-top: 1px solid var(--hs-beige); max-width: 88ch; color: var(--hs-chestnut); font-size: .875rem; line-height: 1.8; }
.hg-jump { margin: 20px 0 0; font-size: 1rem; }
.hg-jump a { display: inline-flex; align-items: center; gap: 10px; min-height: 44px; color: inherit; }
html[lang="ar"] .hg-heading h2, html[lang="ar"] .hg-item h2 { line-height: 1.6; }
@media (max-width: 760px) {
  .hg-heading, .hg-list { grid-template-columns: minmax(0, 1fr); }
  .hg-heading { gap: 22px; margin-bottom: 28px; }
  .hg-item { grid-template-columns: 32px minmax(0, 1fr); column-gap: 14px; }
  .hg-item h2 { font-size: 1.35rem; }
}
@media print { .hg-section { background: white; } .hg-list { display: block; } .hg-item { break-inside: avoid; } .hg-jump { display: none; } }
.hg-teaser .hg-heading { margin-bottom: 0; }
.hg-teaser-link { margin-top: 24px; gap: 12px; max-width: 100%; white-space: normal; }
.hg-page-hero { padding-block: 40px 48px; }
.hg-page-heading { display: grid; grid-template-columns: 1.15fr 1fr; align-items: center; gap: clamp(28px, 6vw, 72px); margin-top: 28px; }
.hg-page-heading h1 { color: var(--hs-green); font-family: var(--hs-serif); font-size: clamp(2.5rem, 4.8vw, 4.5rem); font-weight: 400; line-height: 1.1; letter-spacing: -.03em; margin: 0 0 24px; overflow-wrap: anywhere; }
.hg-page-image { min-width: 0; }
.hg-page-image img { display: block; width: 100%; height: auto; aspect-ratio: 4 / 3; object-fit: cover; border-radius: 14px; }
.hg-section--list { padding-top: 0; border-top: 0; }
html[lang="ar"] .hg-page-heading h1 { line-height: 1.5; letter-spacing: normal; }
@media (max-width: 760px) {
  .hg-page-hero { padding-block: 28px 32px; }
  .hg-page-heading { grid-template-columns: minmax(0, 1fr); margin-top: 24px; }
  .hg-page-image img { aspect-ratio: 16 / 9; }
}
@media print { .hg-page-heading { display: block; } .hg-page-image { display: none; } }
.hg-bonus { display: grid; grid-template-columns: 1fr 1.2fr; gap: 24px 48px; margin-top: 28px; padding: clamp(24px, 4vw, 40px); border: 1px solid var(--hs-beige); border-inline-start: 4px solid var(--hs-burgundy); scroll-margin-top: 24px; }
.hg-bonus h2 { margin: 0; color: var(--hs-green); font-family: var(--hs-serif); font-size: clamp(1.5rem, 2.6vw, 2rem); font-weight: 400; line-height: 1.3; overflow-wrap: anywhere; }
html[lang="ar"] .hg-bonus h2 { line-height: 1.6; }
@media (max-width: 760px) { .hg-bonus { grid-template-columns: minmax(0, 1fr); } }
@media print { .hg-bonus { break-inside: avoid; } }