.zakat-page { gap: 0; overflow-x: clip; background: linear-gradient(115deg, #e8fff4 0%, #fff 28%, #fff 68%, #e1ffef 100%); }
    .zakat-page .site-header { position: sticky; top: 5px; z-index: 300; }
    .zakat-wrap { width: min(100%, 1678px); margin: 0 auto; }
    .zakat-section { margin-top: 80px; }
    .zakat-card { border: 1px solid #e8e3de; border-radius: 24px; background: #fff; box-shadow: 0 4px 18px rgba(16, 24, 40, .055); }
    .zakat-title { margin: 0 0 42px; color: #101828; text-align: center; font-size: 40px; font-weight: 600; line-height: 1.14; letter-spacing: -1.2px; }
    .zakat-title span, .zakat-green { color: #00a261; }
    .zakat-text { margin: 0; color: #101828; font-size: 18px; line-height: 1.5; letter-spacing: -.25px; }
    .zakat-btn { min-height: 54px; border-radius: 100px; padding: 0 30px; display: inline-flex; align-items: center; justify-content: center; border: 1px solid #00a261; background: #00a261; color: #fff; text-decoration: none; font-size: 16px; font-weight: 500; line-height: 1.25; white-space: nowrap; transition: transform .2s ease, box-shadow .2s ease; }
    .zakat-btn:hover { transform: translateY(-2px); box-shadow: 0 12px 24px rgba(0, 162, 97, .18); }
    .zakat-btn--outline { border-color: #b0aaa4; background: #fff; color: #9c9690; }
    .zakat-hero { min-height: 560px; display: grid; grid-template-columns: minmax(0, 1fr) minmax(420px, 760px); gap: 40px; align-items: center; padding-top: 26px; }
    .zakat-hero__content { display: flex; flex-direction: column; align-items: flex-start; gap: 28px; }
    .zakat-hero h1 { margin: 0; max-width: 780px; color: #101828; font-size: 68px; font-weight: 600; line-height: .98; letter-spacing: -1.8px; }
    .zakat-hero h1 span { color: #00a261; }
    .zakat-hero p { max-width: 710px; }
    .zakat-hero__actions { display: flex; gap: 18px; align-items: center; flex-wrap: wrap; }
    .zakat-hero__image { width: 100%; min-height: 430px; object-fit: cover; border-radius: 58px; background: #faf7f2; }
    .zakat-intro { display: grid; grid-template-columns: minmax(0, 1fr) 1fr 1fr; grid-template-rows: repeat(2, minmax(235px, auto)); gap: 20px; align-items: stretch; }
    .zakat-intro__main { grid-row: 1 / span 2; background: #00a261; color: #fff; padding: 48px 44px 26px; display: flex; flex-direction: column; overflow: hidden; position: relative; }
    .zakat-intro__main h2 { margin: 0 0 22px; font-size: 34px; font-weight: 600; line-height: 1.12; letter-spacing: -.65px; }
    .zakat-intro__main p { margin: 0 0 26px; font-size: 18px; line-height: 1.36; max-width: 470px; }
    .zakat-intro__main img { width: 196px; align-self: flex-end; margin: auto -6px -10px 0; }
    .zakat-info-card { padding: 36px; display: flex; flex-direction: column; justify-content: center; gap: 16px; min-height: 235px; }
    .zakat-info-card h3 { margin: 0; color: #101828; font-size: 20px; font-weight: 600; line-height: 1.24; letter-spacing: -.25px; }
    .zakat-info-card p { margin: 0; color: #8f8f8f; font-size: 18px; line-height: 1.42; }
    .zakat-info-card--image { padding: 0; overflow: hidden; background: #faf7f2; }
    .zakat-info-card--image img { width: 100%; height: 100%; min-height: 220px; object-fit: cover; }
    .zakat-intro__side { position:relative;grid-column: 3; grid-row: 1 / span 2; padding: 40px 36px 0; overflow: hidden; display: flex; flex-direction: column; justify-content: space-between; }
    .zakat-intro__side h3 { margin: 0 0 22px; color: #101828; font-size: 20px; font-weight: 600; line-height: 1.24; letter-spacing: -.25px; }
    .zakat-intro__side p { margin: 0; color: #8f8f8f; font-size: 18px; line-height: 1.42; }
    .zakat-intro__side > div { position: relative; z-index: 2; }
    .zakat-intro__side img { width: 100%; height: 60%; position: absolute; bottom: 0; left: 0; z-index: 1; object-fit: cover; object-position: center bottom; }
    .zakat-table-block__lead { max-width: 860px; margin: -22px auto 28px; color: #8f8f8f; text-align: center; font-size: 15px; line-height: 1.5; }
    .zakat-table { overflow: hidden; }
    .zakat-table table { width: 100%; border-collapse: collapse; font-size: 16px; color: #101828; }
    .zakat-table thead th { background: #00a261; color: #fff; font-weight: 600; text-align: left; padding: 18px 28px; }
    .zakat-table thead th:first-child { border-top-left-radius: 16px; }
    .zakat-table thead th:last-child { border-top-right-radius: 16px; }
    .zakat-table tbody td { padding: 18px 28px; border-bottom: 1px solid #ede9e4; vertical-align: top; line-height: 1.4; }
    .zakat-table tbody tr:nth-child(even) td { background: #fbf8f4; }
    .zakat-table__note { margin: 18px 0 0; color: #8f8f8f; font-size: 14px; line-height: 1.45; }
    .zakat-nisab { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 0; align-items: stretch; padding: 0; min-height: 380px; overflow: hidden; }
    .zakat-nisab__content { padding: 36px 42px; display: flex; flex-direction: column; justify-content: center; }
    .zakat-nisab p { margin: 0 0 20px; color: #101828; font-size: 16px; font-weight: 400; line-height: 24px; letter-spacing: -.34px; }
    .zakat-nisab__lead b { color: #00a261; font-size: 20px; font-weight: 600; line-height: 24px; }
    .zakat-nisab__subtitle { margin: 0 0 20px; color: #101828; font-size: 20px; font-weight: 600; line-height: 30px; letter-spacing: -.75px; }
    .zakat-nisab ul { margin: 0 0 20px; padding-left: 24px; display: block; color: #101828; font-size: 16px; font-weight: 400; line-height: 24px; letter-spacing: -.34px; }
    .zakat-nisab li { margin: 0; padding-left: 0; }
    .zakat-nisab__rates { width: min(100%, 713px); margin-top: -8px; display: flex; flex-direction: column; gap: 12px; }
    .zakat-nisab__rate { display: grid; grid-template-columns: minmax(170px, 230px) max-content; gap: clamp(36px, 6vw, 111px); align-items: start; padding: 0 0 12px; color: #101828; font-size: 16px; font-weight: 400; line-height: 24px; letter-spacing: -.34px; white-space: nowrap; }
    .zakat-nisab__rate:first-child { border-bottom: 1px solid #f0eae4; }
    .zakat-nisab__rate:last-child { padding: 0; }
    .zakat-nisab__rate:last-child span { visibility: hidden; }
    .zakat-nisab__rate strong { color: #222; font-size: 16px; font-weight: 600; line-height: normal; letter-spacing: 0; }
    .zakat-nisab__image { width: 100%; height: 100%; min-height: 380px; object-fit: cover; object-position: center; display: block; }
    .zakat-calc-head { max-width: 1180px; margin: 0 auto 48px; text-align: center; }
    .zakat-calc-head .zakat-title { margin-bottom: 26px; font-size: 32px; line-height: 38px; letter-spacing: -1.2px; }
    .zakat-calc__lead { margin: 0 auto; max-width: 1180px; color: #101828; font-size: 16px; font-weight: 400; line-height: 24px; letter-spacing: -.34px; }
    .zakat-calc { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 24px; align-items: stretch; }
    .zakat-calc__text { position: relative; min-height: 773px; padding: 40px; overflow: hidden; display: block; }
    .zakat-calc__text h3 { margin: 0 0 30px; max-width: 710px; color: #101828; font-size: 24px; font-weight: 600; line-height: 30px; letter-spacing: -.75px; }
    .zakat-calc__text p { margin: 0 0 24px; max-width: 688px; color: #101828; font-size: 16px; font-weight: 400; line-height: 24px; letter-spacing: -.34px; }
    .zakat-calc__text b { color: #101828; font-weight: 600; }
    .zakat-calc__text .zakat-calc__formula { color: #00a261; font-weight: 600; }
    .zakat-calc__text .zakat-calc__example { margin-top: 8px; font-weight: 600; }
    .zakat-calc__text .zakat-calc__italic { font-style: italic; }
    .zakat-calc__text img { position: absolute; right: -1px; bottom: -1px; width: min(50%, 582px); max-height: 523px; object-fit: contain; object-position: right bottom; }
    .zakat-form { min-height: 773px; padding: 51px 39px 38px; display: flex; flex-direction: column; gap: 0; }
    .zakat-form__grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 24px; row-gap: 15px; }
    .zakat-field label { display: block; margin: 0 0 10px; color: #101828; font-size: 14px; font-weight: 400; line-height: 24px; letter-spacing: -.34px; }
    .zakat-field--money { position: relative; }
    .zakat-field--money::after { content: "\20BD"; position: absolute; right: 20px; bottom: 15px; color: #101828; font-size: 20px; font-weight: 500; line-height: 27px; pointer-events: none; }
    .zakat-field--money.zakat-field--muted::after { color: #101828; }
    .zakat-field__box { width: 100%; min-height: 59px; border: 2px solid #e8e3de; border-radius: 12px; padding: 14px 45px 14px 20px; color: #101828; background: #fff; font-size: 20px; font-weight: 500; line-height: 27px; letter-spacing: -.34px; outline: none; }
    .zakat-field__box--muted { color: #101828; }
    .zakat-field input:not(.zakat-field__box) { width: 100%; height: 52px; border: 1px solid #e7e2dc; border-radius: 12px; padding: 0 16px; color: #101828; font-size: 16px; outline: none; background: #fff; }
    .zakat-field input:focus, .zakat-field__box:focus { border-color: #00a261; box-shadow: 0 0 0 3px rgba(0,162,97,.09); }
    .zakat-result { margin-top: 51px; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 83px; }
    .zakat-result[hidden] { display: none; }
    .zakat-result__item { min-width: 0; border-radius: 0; background: transparent; padding: 0; }
    .zakat-result__label { display: block; min-height: 48px; margin-bottom: 16px; color: #101828; font-size: 16px; font-weight: 400; line-height: 24px; letter-spacing: -.34px; }
    .zakat-result__value { display: block; color: #00a261; font-size: 32px; font-weight: 600; line-height: 38px; letter-spacing: -1.2px; white-space: nowrap; }
    .zakat-result__hint { display: block; max-width: 205px; margin-top: 6px; color: #929292; font-size: 13px; font-weight: 400; line-height: 16px; letter-spacing: -.34px; white-space: normal; }
    .zakat-result__item--due .zakat-result__value { width: 100%; border-bottom: 2px solid #00a261; padding-bottom: 1px; }
    .zakat-form__actions { margin-top: auto; display: flex; align-items: center; justify-content: space-between; gap: 18px; }
    .zakat-form__actions--single { justify-content: flex-end; }
    .zakat-checkbox { display: flex; align-items: center; gap: 10px; color: #8f8f8f; font-size: 16px; font-weight: 400; line-height: 24px; letter-spacing: -.34px; cursor: pointer; user-select: none; }
    .zakat-checkbox input { width: 22px; height: 22px; flex: 0 0 22px; accent-color: #00a261; cursor: pointer; }
    .zakat-checkbox strong { color: #00a261; font-weight: 600; }
    .zakat-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; align-items: stretch; }
    .zakat-grid__side { min-width: 0; height: 100%; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); grid-template-rows: repeat(2, minmax(0, 1fr)); gap: 24px; }
    .zakat-mini { min-height: 206px; height: 100%; padding: 24px; background: #fff; display: flex; flex-direction: column; justify-content: space-between; gap: 18px; }
    .zakat-mini--green { background: #00a261; color: #fff; }
    .zakat-mini h3 { margin: 0; color: #101828; font-size: 16px; font-weight: 600; line-height: 24px; letter-spacing: -.34px; }
    .zakat-mini--green h3 { color: #fff; }
    .zakat-mini p, .zakat-mini ul { margin: 0; color: #929292; font-size: 16px; font-weight: 400; line-height: 24px; letter-spacing: -.34px; }
    .zakat-mini--green p { color: #fff; }
    .zakat-mini--center { min-height: 436px; height: 100%; padding: 40px; align-items: center; justify-content: center; text-align: center; }
    .zakat-mini--center h3 { font-size: 20px; font-weight: 700; line-height: 30px; letter-spacing: -.75px; }
    .zakat-mini--center p { max-width: 464px; color: #fff; }
    .zakat-when { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; align-items: stretch; }
    .zakat-when__visual { grid-row: span 2; min-height: 590px; padding: 54px 0 0; overflow: hidden; display: flex; flex-direction: column; align-items: center; text-align: center; }
    .zakat-when__visual h2 { max-width: 360px; margin: 0 auto; color: #101828; font-size: 32px; font-weight: 600; line-height: 38px; letter-spacing: -1.2px; }
    .zakat-when__visual img { width: 100%; min-height: 430px; margin-top: auto; object-fit: cover; object-position: center bottom; }
    .zakat-note-card { min-height: 283px; padding: 40px; display: flex; flex-direction: column; justify-content: space-between; }
    .zakat-note-card h3 { margin: 0; color: #101828; font-size: 20px; font-weight: 600; line-height: 24px; letter-spacing: -.75px; }
    .zakat-note-card p { margin: 0; color: #929292; font-size: 16px; font-weight: 400; line-height: 24px; letter-spacing: -.34px; }
    .zakat-about h2 { margin: 0 0 32px; color: #101828; text-align: center; font-size: 32px; font-weight: 600; line-height: 38px; letter-spacing: -1.2px; }
    .zakat-about h2 span { color: #00a261; }
    .zakat-about__card { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); min-height: 380px; overflow: hidden; padding: 0; }
    .zakat-about__content { padding: 32px 40px; display: flex; flex-direction: column; justify-content: center; }
    .zakat-about p { margin: 0 0 24px; max-width: 655px; color: #101828; font-size: 16px; font-weight: 400; line-height: 24px; letter-spacing: -.34px; }
    .zakat-about p:last-child { margin-bottom: 0; }
    .zakat-about b, .zakat-about .zakat-green { color: #00a261; font-weight: 600; }
    .zakat-about__image { width: 100%; height: 100%; min-height: 380px; object-fit: cover; object-position: center; display: block; }
    .zakat-alfitr-head { margin-bottom: 48px; text-align: center; }
    .zakat-alfitr-head .zakat-title { margin-bottom: 26px; font-size: 32px; line-height: 38px; letter-spacing: -1.2px; }
    .zakat-alfitr-head p { margin: 0 auto; max-width: 660px; color: #101828; font-size: 16px; font-weight: 400; line-height: 24px; letter-spacing: -.34px; }
    .zakat-alfitr { display: grid; grid-template-columns: minmax(0, 1fr) minmax(360px, .5fr); gap: 24px; align-items: stretch; }
    .zakat-alfitr__list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px; }
    .zakat-alfitr__card { min-height: 326px; padding: 40px; display: flex; flex-direction: column; align-items: flex-start; justify-content: center; gap: 20px; }
    .zakat-alfitr__card--sand { background: #f9f6f2; }
    .zakat-alfitr__card img { width: 104px; height: 104px; object-fit: contain; }
    .zakat-alfitr__card h3 { margin: 0; color: #101828; font-size: 20px; font-weight: 600; line-height: 30px; letter-spacing: -.75px; }
    .zakat-alfitr__card p { margin: 0; color: #929292; font-size: 16px; font-weight: 400; line-height: 24px; letter-spacing: -.34px; }
    .zakat-alfitr__feature { position: relative; min-height: 676px; padding: 60px 40px; overflow: hidden; display: flex; flex-direction: column; gap: 20px; }
    .zakat-alfitr__feature h3 { max-width: 416px; margin: 0; color: #101828; font-size: 20px; font-weight: 600; line-height: 30px; letter-spacing: -.75px; }
    .zakat-alfitr__feature h3 span { color: #00a261; }
    .zakat-alfitr__feature p { max-width: 464px; margin: 0; color: #929292; font-size: 20px; font-weight: 400; line-height: 27px; letter-spacing: -.34px; }
    .zakat-alfitr__feature img { position: absolute; left: 0px; bottom: 0px; width: 100%; max-width: none; height: auto; object-fit: contain; }
    .zakat-online { display: grid; grid-template-columns: minmax(360px, 571px) minmax(0, 910px); gap: 24px; align-items: center; padding: 60px 60px 60px 115px; }
    .zakat-online__main { display: flex; flex-direction: column; align-items: flex-start; gap: 24px; }
    .zakat-online__copy { display: flex; flex-direction: column; gap: 26px; color: #101828; }
    .zakat-online__main h2 { margin: 0; color: #101828; font-size: 32px; font-weight: 600; line-height: 38px; letter-spacing: -1.2px; }
    .zakat-online__main h2 span { color: #00a261; }
    .zakat-online__main p { margin: 0; color: #101828; font-size: 16px; font-weight: 400; line-height: 24px; letter-spacing: -.34px; }
    .zakat-online__attention { display: flex; flex-direction: column; gap: 10px; color: #101828; font-size: 16px; font-weight: 400; line-height: 24px; letter-spacing: -.34px; }
    .zakat-online__attention strong { font-weight: 700; }
    .zakat-online__attention ul { margin: 0; padding-left: 24px; }
    .zakat-online__question { margin: 0; color: #00a261; font-size: 16px; font-weight: 600; line-height: 24px; letter-spacing: -.34px; }
    .zakat-online__actions { display: flex; flex-direction: column; gap: 24px; align-items: flex-start; }
    .zakat-online__cards { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 26px; }
    .zakat-online__card { min-height: 260px; padding: 40px; border-radius: 20px; background: #fbfbfb; display: flex; flex-direction: column; justify-content: flex-start; gap: 34px; color: #101828; }
    .zakat-online__card h3 { min-height: 60px; margin: 0; color: #101828; font-size: 20px; font-weight: 600; line-height: 30px; letter-spacing: -.75px; }
    .zakat-online__card p { margin: 0; color: #101828; font-size: 16px; font-weight: 400; line-height: 24px; letter-spacing: -.34px; }
    .zakat-page .faq, .zakat-page .support-cta, .zakat-page .site-footer { width: min(100%, 1678px); margin-left: auto; margin-right: auto; }
    .zakat-page .faq { margin-top: 80px; }
    .zakat-page .site-footer { margin-top: 80px; }
    @media (max-width: 1500px) and (min-width: 1201px) {
      .zakat-grid { grid-template-columns: 1fr; }
      .zakat-grid__side { grid-template-columns: repeat(4, minmax(0, 1fr)); }
      .zakat-mini { min-height: 190px; }
      .zakat-mini--center { min-height: auto; padding: 42px; }
}

    @media (max-width: 1200px) {
      .zakat-wrap, .zakat-page .faq, .zakat-page .support-cta, .zakat-page .site-footer { width: calc(100% - 48px); }
      .zakat-hero { grid-template-columns: 1fr; min-height: auto; }
      .zakat-hero h1 { font-size: 54px; }
      .zakat-intro, .zakat-grid, .zakat-alfitr { grid-template-columns: repeat(2, minmax(0, 1fr)); }
      .zakat-intro__side { grid-column: auto; grid-row: auto; }
      .zakat-grid { grid-template-columns: 1fr; }
      .zakat-grid__side { grid-template-columns: repeat(2, minmax(0, 1fr)); }
      .zakat-calc, .zakat-nisab, .zakat-about__card { grid-template-columns: 1fr; }
      .zakat-nisab__image { min-height: 360px; }
      .zakat-calc__text, .zakat-form { min-height: auto; }
      .zakat-calc__text { padding-bottom: 380px; }
      .zakat-calc__text img { width: min(80%, 520px); }
      .zakat-result { gap: 30px; }
      .zakat-when, .zakat-online { grid-template-columns: 1fr 1fr; }
      .zakat-when__visual, .zakat-online__main { grid-column: 1 / -1; }
      .zakat-when__visual { grid-row: auto; min-height: 520px; }
      .zakat-note-card { min-height: 240px; }
      .zakat-online { grid-template-columns: 1fr; padding: 48px; }
      .zakat-online__main { grid-column: auto; }
      .zakat-online__cards { grid-template-columns: repeat(2, minmax(0, 1fr)); }
      .zakat-alfitr { grid-template-columns: 1fr; }
      .zakat-alfitr__feature { min-height: 520px; }
      .zakat-alfitr__feature img { left: auto; right: 0px; width: 100%; }
    }
    @media (max-width: 700px) {
      .zakat-page { padding: 0 0px 40px; }
      .zakat-page .site-header {
        top: 0;
        width: 100vw !important;
        max-width: none !important;
        margin-left: calc(50% - 50vw) !important;
        margin-right: calc(50% - 50vw) !important;
        border-radius: 0;
      }
      .zakat-wrap, .zakat-page .faq, .zakat-page .support-cta, .zakat-page .site-footer { width: calc(100% - 32px); }
      .zakat-section, .zakat-page .faq, .zakat-page .site-footer { margin-top: 56px; }
      .zakat-title { margin-bottom: 28px; font-size: 24px; line-height: 1.12; letter-spacing: -.55px; }
      .zakat-text { font-size: 16px; line-height: 1.45; }
      .zakat-card { border-radius: 18px; }
      .zakat-hero { gap: 18px; padding-top: 22px; text-align: center; }
      .zakat-hero h1 { max-width: 330px; margin: 0 auto; font-size: 30px; line-height: 1.04; letter-spacing: -.75px; text-align: center; }
      .zakat-hero p { max-width: none; margin: 0 auto; text-align: left; }
      .zakat-hero__content { display: contents; }
      .zakat-hero h1 { order: 1; }
      .zakat-hero__image { order: 2; }
      .zakat-hero p { order: 3; }
      .zakat-hero__actions { order: 4; }
      .zakat-hero__actions { width: 100%; flex-direction: column; gap: 12px; }
      .zakat-hero__actions .zakat-btn { width: 100%; }
      .zakat-hero__image { min-height: 0; max-height: 280px; object-fit: contain; border-radius: 28px; }
      .zakat-intro, .zakat-grid, .zakat-when, .zakat-online, .zakat-alfitr { grid-template-columns: 1fr; }
      .zakat-intro { grid-template-rows: auto; align-items: start; }
      .zakat-online { padding: 24px; gap: 28px; }
      .zakat-online__main { gap: 22px; }
      .zakat-online__copy { gap: 18px; }
      .zakat-online__main h2 { font-size: 24px; line-height: 1.18; letter-spacing: -.55px; }
      .zakat-online__cards { grid-template-columns: 1fr; gap: 16px; }
      .zakat-online__card { min-height: auto; padding: 22px; gap: 24px; }
      .zakat-online__actions, .zakat-online__actions .zakat-btn { width: 100%; }
      .zakat-grid { align-items: start; }
      .zakat-grid__side { height: auto; grid-template-columns: 1fr; grid-template-rows: none; grid-auto-rows: auto; align-items: start; }
      .zakat-grid > .zakat-mini--center { order: 1; }
      .zakat-grid > .zakat-grid__side:first-child { order: 2; }
      .zakat-grid > .zakat-grid__side:last-child { order: 3; }
      .zakat-mini, .zakat-mini--center { height: auto; min-height: auto; justify-content: flex-start; gap: 14px; }
      .zakat-table-block__lead { display: none; }
      .zakat-alfitr-head { margin-bottom: 28px; text-align: center; }
      .zakat-alfitr-head .zakat-title { margin-bottom: 14px; font-size: 24px; line-height: 1.18; letter-spacing: -.55px; }
      .zakat-alfitr-head p { font-size: 15px; line-height: 1.45; }
      .zakat-alfitr__list { grid-template-columns: 1fr; gap: 16px; }
      .zakat-alfitr__card { min-height: auto; padding: 22px; }
      .zakat-alfitr__card img { width: 86px; height: 86px; }
      .zakat-alfitr__feature { min-height: auto; padding: 24px 0 260px; }
      .zakat-alfitr__feature h3 { font-size: 20px; line-height: 1.25; }
      .zakat-alfitr__feature h3,
      .zakat-alfitr__feature p { padding-left: 22px; padding-right: 22px; }
      .zakat-alfitr__feature p { font-size: 16px; line-height: 1.45; }
      .zakat-alfitr__feature img { left: 0; right: auto; bottom: 0px; width: 100%; max-height: 240px; object-fit: cover; object-position: center bottom; transform: none; }
      .zakat-intro__main { grid-row: auto; min-height: 0; padding: 24px; }
      .zakat-intro__main h2 { font-size: 24px; }
      .zakat-intro__main p { font-size: 16px; }
      .zakat-intro__main img { display: none; }
      .zakat-intro__side { min-height: 420px; padding: 24px 0 210px; }
      .zakat-intro__side h3 { font-size: 20px; }
      .zakat-intro__side h3,
      .zakat-intro__side p { padding-left: 22px; padding-right: 22px; }
      .zakat-intro__side p { font-size: 16px; }
      .zakat-intro__side img { width: 100%; height: auto; max-height: 210px; object-fit: cover; object-position: center bottom; }
      .zakat-info-card, .zakat-mini, .zakat-note-card { min-height: auto; padding: 22px; }
      .zakat-note-card { padding-top: 28px; gap: 12px; justify-content: flex-start; }
      .zakat-nisab, .zakat-calc__text, .zakat-form { padding: 0; }
      .zakat-nisab__content, .zakat-calc__text, .zakat-form { padding: 24px; }
      .zakat-calc-head { margin-bottom: 28px; text-align: left; }
      .zakat-calc-head .zakat-title { margin-bottom: 14px; font-size: 24px; line-height: 1.12; letter-spacing: -.55px; }
      .zakat-calc__lead { font-size: 15px; line-height: 1.45; }
      .zakat-calc__text { padding-bottom: 210px; }
      .zakat-calc__text h3 { margin-bottom: 22px; font-size: 22px; line-height: 1.25; letter-spacing: -.55px; }
      .zakat-calc__text p { margin-bottom: 16px; font-size: 15px; line-height: 1.45; }
      .zakat-calc__text img { right: 0px; bottom: 0px; width: min(72%, 260px); max-height: 180px; object-fit: contain; }
      .zakat-nisab__subtitle { font-size: 24px; text-align: left; }
      .zakat-about h2 { margin-bottom: 28px; font-size: 24px; line-height: 1.18; letter-spacing: -.55px; }
      .zakat-about__card { grid-template-columns: 1fr; min-height: auto; }
      .zakat-about__content { padding: 24px; }
      .zakat-about__image { min-height: 0; max-height: 260px; object-fit: contain; background: #fff; }
      .zakat-when__visual { min-height: 430px; padding-top: 32px; }
      .zakat-when__visual h2 { font-size: 24px; line-height: 1.18; letter-spacing: -.55px; text-align: center; }
      .zakat-when__visual img { min-height: 300px; }
      .zakat-nisab p, .zakat-nisab ul { font-size: 16px; }
      .zakat-nisab__rate { grid-template-columns: 1fr; gap: 6px; font-size: 16px; }
      .zakat-nisab__rate:last-child span { display: none; }
      .zakat-nisab__image { min-height: 240px; }
      .zakat-table { overflow-x: auto; border-radius: 16px; }
      .zakat-table table { min-width: 640px; font-size: 13px; }
      .zakat-table thead th, .zakat-table tbody td { padding: 14px 16px; }
      .zakat-form__grid, .zakat-result { grid-template-columns: 1fr; }
      .zakat-field__box { min-height: 54px; padding: 12px 42px 12px 16px; font-size: 18px; }
      .zakat-field--money::after { right: 16px; bottom: 13px; font-size: 18px; }
      .zakat-result { margin-top: 32px; gap: 20px; }
      .zakat-result__label { min-height: auto; margin-bottom: 8px; }
      .zakat-result__value { font-size: 28px; line-height: 1.1; }
      .zakat-result__hint { white-space: normal; }
      .zakat-form__actions { flex-direction: column; align-items: stretch; }
      .zakat-checkbox { align-items: flex-start; font-size: 15px; }
      .zakat-form__actions .zakat-btn { width: 100%; margin-top:15px;}
      .zakat-about { gap: 18px; }
    }

/* Keep the nisab content dense and anchor the illustration to the right edge. */
@media (min-width: 1201px) {
  .zakat-nisab {
    grid-template-columns: minmax(0, 1.14fr) minmax(0, .86fr);
  }

  .zakat-nisab__content {
    padding-right: 24px;
  }

  .zakat-nisab__image {
    width: 100%;
    height: 100%;
    min-height: 0;
    max-height: none;
    align-self: stretch;
    justify-self: stretch;
    object-fit: cover;
    object-position: right center;
  }

  .zakat-about__card {
    grid-template-columns: minmax(0, 1.16fr) minmax(0, .84fr);
    min-height: 420px;
  }

  .zakat-about__image {
    width: 86%;
    height: auto;
    min-height: 0;
    max-height: 420px;
    align-self: center;
    justify-self: center;
    object-fit: contain;
  }
}

/* Match the calculator heading to the other desktop section headings. */
@media (min-width: 701px) {
  .zakat-calc-head .zakat-title {
    font-size: 40px;
    line-height: 1.14;
    letter-spacing: -1.2px;
  }
}

/* Keep the payment timing cards compact while preserving equal heights. */
@media (min-width: 1201px) {
  .zakat-when__visual {
    min-height: 464px;
    padding-top: 32px;
  }

  .zakat-when__visual img {
    min-height: 0;
    height: 320px;
  }

  .zakat-note-card {
    min-height: 220px;
    padding-top: 32px;
    padding-bottom: 32px;
    justify-content: flex-start;
    gap: 32px;
  }
}

/* ===== START: Compact Zakat Online Block ===== */
@media (min-width: 1201px) {
  .zakat-online {
    grid-template-columns: minmax(360px, 0.92fr) minmax(0, 1.35fr);
    gap: 32px;
    align-items: stretch;
    padding: 42px 48px;
  }

  .zakat-online__main {
    justify-content: center;
    gap: 18px;
  }

  .zakat-online__copy {
    gap: 18px;
  }

  .zakat-online__actions {
    gap: 14px;
  }

  .zakat-online__cards {
    gap: 18px;
    align-content: stretch;
  }

  .zakat-online__card {
    min-height: 0;
    padding: 28px 30px;
    gap: 18px;
  }

  .zakat-online__card h3 {
    min-height: 48px;
    font-size: 18px;
    line-height: 24px;
  }
}
/* ===== END: Compact Zakat Online Block ===== */