.closing-action { display: flex; justify-content: center; margin-top: 30px; }
.hero { display: grid; grid-template-columns: 1.05fr 1fr; align-items: center; gap: 65px; padding: 42px 0 65px; }
.hero h1 { font-size: clamp(43px, 4.6vw, 62px); font-weight: 600; letter-spacing: -2.6px; line-height: 1.1; color: var(--green-950); margin: 22px 0; }
.hero h1 em { font-style: normal; color: var(--orange-700); }
.hero-description { max-width: 425px; font-size: 16px; line-height: 1.85; color: var(--muted); }
.hero-actions { display: flex; align-items: center; gap: 24px; margin-top: 30px; }
.hero-actions .text-link { font-size: 13px; text-decoration: none; }
.hero-note { display: flex; gap: 8px; align-items: center; color: var(--muted); font-size: 11px; margin-top: 19px; }
.hero-note .icon { width: 15px; height: 15px; }
.hero-art { position: relative; padding: 6px 0 20px; }
.hero-illustration { width: 100%; height: auto; border-radius: 130px 130px 24px 24px; aspect-ratio: 1.1; object-fit: cover; background: #e9eedf; }
.place-label { position: absolute; top: 28px; left: 26px; display: inline-flex; gap: 7px; align-items: center; padding: 8px 12px; border-radius: 50px; background: #fcfbf7e8; color: var(--green-800); font-size: 10px; font-weight: 650; letter-spacing: .5px; }
.place-label .icon { width: 13px; height: 13px; }
.care-card { position: absolute; bottom: -1px; left: -22px; right: 26px; border: 1px solid #e4e8df; background: white; border-radius: 12px; padding: 20px; box-shadow: 0 12px 35px #1d40350c; display: flex; align-items: center; gap: 14px; }
.care-card > span { width: 45px; height: 45px; border-radius: 50%; background: var(--green-50); color: var(--green-700); display: grid; place-items: center; }
.care-card strong { font-size: 13px; font-weight: 650; display: block; }
.care-card p { font-size: 11px; color: var(--muted); margin-top: 3px; }
.care-card > span:last-child { margin-left: auto; width: 24px; height: 24px; background: transparent; color: var(--green-700); }
.purpose { border-block: 1px solid var(--line); display: grid; grid-template-columns: 1fr 1.7fr; gap: 72px; padding: 30px 0; align-items: start; }
.purpose-title { display: flex; align-items: center; gap: 13px; font-size: 17px; font-weight: 600; line-height: 1.5; color: var(--green-950); }
.purpose-title > .icon { width: 29px; height: 29px; color: var(--green-700); }
.purpose p { font-size: 13px; color: var(--muted); }
.purpose p + p { margin-top: 8px; }
.audience { padding-top: 62px; }
.section-heading { display: flex; align-items: flex-end; justify-content: space-between; gap: 30px; margin-bottom: 28px; }
.section-heading h2, .how-title h2 { font-size: 32px; font-weight: 600; letter-spacing: -1px; color: var(--green-950); margin-top: 11px; }
.section-heading > p { max-width: 310px; font-size: 13px; color: var(--muted); }
.category-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 18px; }
.category-card { background: white; border: 1px solid var(--line); border-radius: 14px; padding: 25px 25px 22px; position: relative; }
.category-icon { display: grid; place-items: center; width: 46px; height: 46px; border-radius: 12px; background: var(--green-100); color: var(--green-800); margin-bottom: 23px; }
.category-card:nth-child(2) .category-icon { color: #8d552c; background: #f7eadc; }
.category-card:nth-child(3) .category-icon { color: #4e6b8b; background: #eaf0f5; }
.category-number { position: absolute; top: 26px; right: 24px; font-size: 10px; letter-spacing: 1px; color: #839087; }
.category-card h3 { font-size: 18px; font-weight: 600; letter-spacing: -.3px; margin-bottom: 10px; }
.category-card p { font-size: 13px; max-width: 250px; color: var(--muted); }
.household-note { display: flex; align-items: center; gap: 12px; margin-top: 19px; background: var(--green-50); border-radius: 9px; padding: 16px 20px; color: var(--green-800); }
.household-note .icon { width: 20px; }
.household-note p { font-size: 12px; }
.household-note strong { font-weight: 650; }
.how { display: grid; grid-template-columns: .9fr 2fr; gap: 70px; padding-block: 65px; }
.how-title h2 { font-size: 29px; }
.how-title p { font-size: 13px; color: var(--muted); margin-top: 14px; }
.steps { display: grid; grid-template-columns: repeat(3,1fr); gap: 27px; padding-top: 10px; }
.step-number { position: relative; display: flex; align-items: center; gap: 20px; color: var(--green-800); font-size: 12px; font-weight: 650; margin-bottom: 18px; }
.step-number span { display: grid; place-items: center; width: 32px; height: 32px; border: 1px solid #c9d5c8; border-radius: 50%; flex-shrink: 0; }
.step-number::after { content: ''; height: 1px; width: 100%; background: var(--line); }
.steps h3 { font-size: 14px; font-weight: 650; margin-bottom: 9px; }
.steps p { color: var(--muted); font-size: 12px; }
.emergency { display: flex; align-items: center; gap: 22px; padding: 26px 30px; border: 1px solid #ead9c6; background: #faf3e9; border-radius: 13px; }
.emergency > .icon { color: #9c6b31; width: 28px; height: 28px; }
.emergency-copy { flex: 1; }
.emergency-copy h2 { font-size: 14px; color: #6f4c25; margin-bottom: 5px; }
.emergency-copy p { font-size: 11px; color: #826d53; }
.emergency-numbers { display: flex; gap: 27px; }
.emergency-numbers a { text-decoration: none; border-left: 1px solid #e9d9c5; padding-left: 26px; }
.emergency-numbers span { display: block; font-size: 10px; color: #826d53; }
.emergency-numbers strong { font-size: 24px; color: #785128; font-weight: 650; }
@media (max-width: 1000px) {
  .hero { gap: 35px; }
  .hero h1 { font-size: 48px; }
  .hero-actions { gap: 16px; }
  .hero-actions .btn { padding-inline: 20px; }
  .purpose { gap: 35px; }
  .how { gap: 35px; grid-template-columns: 1fr 2fr; }
  .emergency { flex-wrap: wrap; }
  .emergency-numbers { margin-left: 50px; }
}
@media (max-width: 760px) {
  .hero { grid-template-columns: 1fr; gap: 35px; padding: 26px 0 40px; }
  .hero h1 { font-size: clamp(42px, 8vw, 59px); letter-spacing: -2px; }
  .hero-description { font-size: 15px; max-width: 520px; }
  .hero-actions { flex-wrap: wrap; }
  .hero-art { width: min(440px, 100%); margin-inline: auto; padding-inline: 8px; }
  .hero-illustration { aspect-ratio: 1.1; border-radius: 100px 100px 20px 20px; }
  .care-card { left: 0; right: 18px; padding: 15px; }
  .place-label { left: 24px; top: 24px; }
  .purpose { grid-template-columns: 1fr; gap: 15px; padding-block: 25px; }
  .purpose-title br { display: none; }
  .audience { padding-top: 40px; }
  .section-heading { display: block; }
  .section-heading > p { margin-top: 15px; max-width: none; }
  .section-heading h2 { font-size: 28px; }
  .category-grid { grid-template-columns: 1fr; gap: 12px; }
  .category-card { padding: 22px 24px 22px 85px; min-height: 132px; }
  .category-icon { position: absolute; top: 23px; left: 22px; }
  .category-number { display: none; }
  .category-card h3 { font-size: 17px; }
  .category-card p { max-width: none; }
  .household-note { align-items: flex-start; padding: 16px; }
  .household-note p { font-size: 12px; }
  .household-note strong { display: block; }
  .how { grid-template-columns: 1fr; padding-block: 40px; gap: 22px; }
  .steps { gap: 17px; }
  .steps h3 { font-size: 13px; }
  .steps p { font-size: 11px; }
  .emergency { padding: 22px; gap: 14px; }
  .emergency-copy { min-width: 180px; }
  .emergency-numbers { margin: 5px 0 0; width: 100%; justify-content: space-between; gap: 10px; }
  .emergency-numbers a { padding-left: 16px; }
  .emergency-numbers a:first-child { padding-left: 0; border: 0; }
  .site-footer { margin-top: 40px; }
}