fix: #3607228 Follow the design's text spacing on the country page and give each country fuller copy

Summary

The country full page did not follow the design's text spacing, and the default copy was too thin.

• config/canvas.content_template.node.country.full.yml: added a spacer between "Our Role" and its body (16px gap), added a spacer between "By the Numbers" and its intro (24px gap), and put "Our Role" on a 75-25 column split so the body sits in the design's ~847px measure instead of the full 1104px. "On the Ground" was left alone: its card slot's flex gap already puts it at 24px; a spacer there overshot to 56px.
• content/node/*.yml (12 country nodes): longer field_our_role (three to four sentences naming where the work happens and what it delivers) and a fuller field_figures_description. Two fields changed per file, nothing else touched.

"See Other Countries" also did not follow the design (Figma node 12743:7726): a plain three-across grid wrapping four countries onto two rows, no intro text, no "View All Countries" link, no prev/next controls.

• config/views.view.countries.yml: adds a dedicated related_slider block display (same nid argument as related, loads 12 countries) using the country-slider organism already used by the home page's latest display, with its own heading, intro and "View All Countries" CTA. default, all, latest, related and rss are untouched, byte-identical to canonical 1.0.x.
• config/canvas.component.block.views_block.countries-related_slider.yml: new Canvas Component entity for the new block, required so Canvas resolves the placed block on a fresh install.
• config/canvas.content_template.node.country.full.yml: the country page's block now points at block.views_block.countries-related_slider with its "items per block" override set to '12' (matching the display's pager, so the block does not undercut it), and keeps this MR's spacing changes and the removal of the duplicate "See Other Countries" heading (the slider renders its own heading).

The country hero also did not match the design (Figma node 12743:6754), and Afghanistan's hero/On the Ground photos were wrong (a portrait crop, and the hero photo repeated in the On the Ground slot).

• config/canvas.content_template.node.country.full.yml: hero side insets ms-5 me-5 (48px) to ms-3 me-3 (16px, nearest Bootstrap step to the design's 20px); panel background bg-body-secondary to bg-primary-subtle (the design's cream); hero image ratio-16x9 to ratio-21x9 (the design's 1140x488 crop); description centred (horizontal_alignment: text-center) with its fs-5 override dropped so it takes the theme's base 18px body size; a spacer sets the design's gap to the hero image (py-3, 32px, nearest step to 40px).
• content/node/11-country-afghanistan.yml: field_featured_image repointed to the design's own hero photo, field_on_the_ground_image repointed to the design's own On the Ground photo (it was showing the hero photo a second time). Both media entities already ship with the recipe; no new binaries.

Issue: https://www.drupal.org/project/horizonaid/issues/3607228

Verified

Spacing/copy: applied on a live Varbase 11 build and measured in a real browser. "Our Role" heading-to-body gap 16px with the body in an 824px measure, "On the Ground" 24px, "By the Numbers" 24px, body type 18px/1.5 line height, and the longer country copy rendering in place.

Countries slider: /countries renders its own listing unchanged (12 cards), the home page's Where We Work slider is unchanged, and each country page renders the slider block: one 42px heading, an 18px intro, cards at 258x420 with white 24px titles on the navy footer, the gold "View All Countries" pill, two 56x38 prev/next controls, and the current country correctly excluded. 11 country cards render on the Afghanistan page, the track is scrollable, and a real click on Next advances it (scrollLeft 282 to 564) while Previous becomes enabled.

Hero: background rgb(255, 248, 231), 16px side margin, h1 52px centred, description 18px centred, image aspect 2.33, 32px gap to the image. Afghanistan's hero renders the design's classroom photo, and the On the Ground block renders the design's market photo.

Every page (/, /about, /countries, country pages, /programs, /impact, /resources, /events, /donate) returns 200 with no Twig or Canvas error in the body.

AI-Generated: Yes

Checkpoints:

• File an issue
• Addition/Change/Update/Fix
• Testing to ensure no regression
• Automated unit testing coverage
• Automated functional testing coverage
• UX/UI designer responsibilities
• Readability
• Accessibility
• Performance
• Security
• Developer Documentation
• User Guide Documentation
• Reviewed by human
• Code review by maintainers
• Full testing and approval
• Credit contributors
• Review with the product owner
• Release notes snippet
• Release