/* Dragging and short release settling use one document scroller. A scene
   can grow beyond the stable viewport so short phones never lose long content. */
.v4-home-scroll-cue { display:none; }
@media (max-width:1199px), (pointer:coarse) {
  :root { --v4-scene-height:100vh; }
  @supports (height:100svh) { :root { --v4-scene-height:100svh; } }
  /* Mobile body size must override the desktop inline custom property. */
  .v4-body .v4-home [data-module-id][style*="--module-body-size:"] { --module-body-size:initial!important; }
  .v4-body .v4-home [data-module-id][style*="--v4-mobile-body-size:"] { --module-body-size:var(--v4-mobile-body-size)!important; }
  html.v4-mobile-scenes { scroll-snap-type:y mandatory; scroll-behavior:auto; scroll-padding:0; }
  html:has(.v4-home) { scroll-snap-type:y mandatory; scroll-behavior:auto; scroll-padding:0; }
  /* One owner for the entire gesture, including idle. Re-enabling CSS snap
     after each RAF animation can re-snap to an older browser target. */
  html.v4-mobile-scenes.v4-mobile-snap-controlled { scroll-snap-type:none; }
  /* Scene entry effects must not restart while a mobile scene is moving.
     Decorative flower loops and the hero carousel itself remain available. */
  .v4-body .v4-home [data-v4-scene] .v4-reveal,
  .v4-body .v4-home .v4-hero-line,
  .v4-body .v4-home .v4-home-hero-copy > .v4-pill,
  .v4-body .v4-home .v4-map-heading,
  .v4-body .v4-home .v4-map-viewport,
  .v4-body .v4-home .v4-map-toolbar,
  .v4-body .v4-home .v4-map-detail {
    opacity:1!important; transform:none!important; animation:none!important; transition:none!important;
  }
  .v4-body:has(.v4-home)>.v4-header { position:fixed; inset:0 0 auto; z-index:40; box-shadow:0 1px 0 #38252d0a; }
  .v4-body:has(.v4-home)>.v4-preview-note { position:relative; z-index:41; }
  .v4-body .v4-home .v4-scene {
    --v4-mobile-gutter:clamp(24px,6vw,48px);
    width:100%; max-width:none; height:auto; min-height:var(--v4-scene-height,100vh); margin:0;
    padding:calc(var(--v4-header-height,72px) + 32px) var(--v4-mobile-gutter) calc(76px + env(safe-area-inset-bottom,0px));
    position:relative; overflow:visible; overflow:clip; scroll-snap-align:start; scroll-snap-stop:always; scroll-margin:0;
  }
  /* Old WebViews may ignore clip: clear the desktop nested scroller first. */
  .v4-body .v4-home .v4-home-component-scene[data-v4-scene-scroll] { overflow:visible; overflow:clip; overscroll-behavior:auto; }
  .v4-body .v4-home .v4-home-part,.v4-body .v4-home .v4-home-component-scene>.v4-module { min-width:0; grid-column:1/-1; }
  .v4-body .v4-home .v4-home-custom { display:grid; grid-template-columns:minmax(0,1fr); align-content:center; gap:32px; }
  .v4-body .v4-home .v4-home-custom-content { max-height:none; overflow:visible; padding:0; }
  .v4-home-scene-canvas .v4-scene { height:auto!important; min-height:var(--v4-scene-height,100vh)!important; }
  .v4-home-scene-canvas .v4-home-hero { height:max(620px,var(--v4-scene-height,100vh))!important; }
  html.v4-scene-mode .v4-body .v4-home-component-scene:is(.v4-home-mission,.v4-home-impact) { display:flex; }

  /* The opening image fills the space below the header. Text, decoration and
     carousel controls each have their own vertical space. */
  .v4-body .v4-home .v4-home-hero { height:max(620px,var(--v4-scene-height,100vh)); padding:0; }
  .v4-body .v4-home-hero>.v4-slides { top:var(--v4-header-height,72px); }
  .v4-body .v4-home .v4-home-hero-copy { top:50%; bottom:auto; transform:translateY(-50%); left:8%; right:8%; text-align:center; }
  .v4-body .v4-home .v4-home-hero-copy--left { right:8%!important; text-align:left; }
  .v4-body .v4-home .v4-home-hero-copy--center { text-align:center; }
  .v4-body .v4-home .v4-home-hero-copy h1 { font-size:var(--module-title-size,clamp(30px,6vw,42px)); line-height:1.5; text-wrap:balance; }
  .v4-body .v4-home .v4-home-hero-copy>p { margin:18px 0 26px; line-height:1.8; }
  .v4-body .v4-home .v4-home-flower-yellow { width:clamp(54px,15vw,90px); bottom:78px; left:8%; }
  .v4-body .v4-home .v4-home-flower-red { width:clamp(140px,36vw,240px); bottom:-30px; left:-12%; }
  .v4-body .v4-slide[data-v4-position="left"]>.v4-home-flower-yellow { left:auto; right:8%; }
  .v4-body .v4-slide[data-v4-position="left"]>.v4-home-flower-red { left:auto; right:-12%; }
  .v4-body .v4-home .v4-slide-dots { bottom:max(calc(92px + env(safe-area-inset-bottom,0px)),calc(100% - var(--v4-scene-height,100vh) + 92px + env(safe-area-inset-bottom,0px))); }
  .v4-home-scroll-cue:not([hidden]) {
    position:fixed; z-index:20; left:50%; bottom:calc(14px + env(safe-area-inset-bottom,0px));
    transform:translateX(-50%); display:flex; align-items:center; justify-content:center; gap:5px;
    min-height:44px; max-width:calc(100vw - 48px); padding:12px 10px; margin:0;
    border:0; border-radius:999px; background:transparent; color:#795c64;
    box-shadow:none;
    font:400 11px/1.4 var(--v4-ui-font,sans-serif); letter-spacing:.3px; white-space:nowrap;
    cursor:pointer; touch-action:manipulation; -webkit-tap-highlight-color:transparent;
  }
  /* A quiet 28px visual hint inside a comfortable, transparent touch target. */
  .v4-home-scroll-cue::before { content:""; position:absolute; z-index:-1; inset:8px 0; border-radius:inherit; background:#fffdf5b8; }
  .v4-home-scroll-cue svg { width:14px; height:14px; flex:none; fill:none; stroke:currentColor; stroke-width:1.5; stroke-linecap:round; stroke-linejoin:round; }
  .v4-home-scroll-cue:focus-visible { outline:3px solid #a12b4b; outline-offset:4px; }
  .v4-home-scroll-cue:active::before { background:#fffdf5e6; }
  .v4-body:has(.v4-navigation.is-open,.v4-search[open],dialog[open]) .v4-home-scroll-cue { visibility:hidden; }

  /* Introduction above, impact figures below, with a deliberate reading pause. */
  .v4-body .v4-home .v4-home-mission { display:flex; flex-direction:column; justify-content:center; gap:clamp(32px,6svh,56px); }
  .v4-body .v4-home .v4-mission-copy { width:100%; max-width:580px; padding:0; margin-inline:auto; }
  .v4-body .v4-home .v4-mission-copy h2 { font-size:var(--module-title-size,clamp(26px,5vw,34px)); line-height:1.5; }
  .v4-body .v4-home .v4-mission-copy h3 { font-size:var(--module-title-size,24px); margin:24px 0 14px; }
  .v4-body .v4-home .v4-home-mission-body { font-size:var(--module-body-size,16px); line-height:1.9; }
  .v4-body .v4-home .v4-mission-copy ul { font-size:inherit; margin:0 0 22px; line-height:1.9; }
  .v4-body .v4-home .v4-mission-more { font-size:var(--module-body-size,14px); line-height:1.8; gap:14px; }
  .v4-body .v4-home .v4-mission-more b { flex-shrink:0; }
  .v4-body .v4-home .v4-home-metrics { width:100%; max-width:580px; margin:0 auto; padding-top:30px; border-top:1px solid #eee8eb; gap:24px 18px; }
  .v4-body .v4-home .v4-home-metrics h3 { font-size:var(--module-title-size,14px); min-height:0; line-height:1.6; }
  .v4-body .v4-home .v4-home-metrics strong { font-size:clamp(27px,7vw,40px); line-height:1.5; }
  .v4-body .v4-home .v4-home-metrics>div:first-child strong { font-size:clamp(38px,10vw,54px); }
  .v4-body .v4-home .v4-mission-flower { width:90px; right:12px; top:calc(var(--v4-header-height,72px) + 16px); }

  /* A generous story image and a separate, continuously moving article strip. */
  .v4-body .v4-home .v4-home-stories { display:flex; flex-direction:column; justify-content:center; gap:28px; padding-inline:0; }
  .v4-body .v4-home .v4-story-banner { flex:none; width:100%; height:clamp(320px,47svh,500px); min-height:320px; margin:0; }
  .v4-body .v4-home .v4-story-banner>img { width:100%; object-position:62% center; }
  .v4-body .v4-home .v4-story-banner:after { background:linear-gradient(180deg,#fffffff0 0%,#ffffffb8 22%,#ffffff00 62%,#fff 100%); }
  .v4-body .v4-home .v4-story-banner>div { width:100%; max-width:680px; padding:20px var(--v4-mobile-gutter); }
  .v4-body .v4-home .v4-story-heading,.v4-body .v4-home .v4-story-banner h2 { font-size:var(--module-title-size,28px); line-height:1.6; margin:0 0 20px; }
  .v4-body .v4-home .v4-story-track { flex:none; width:100%; margin:0; padding:0 var(--v4-mobile-gutter) 12px; gap:16px; }
  .v4-body .v4-home .v4-story-card { flex:0 0 min(82vw,360px); min-height:164px; }
  .v4-body .v4-home .v4-story-card>img { width:37%; }
  .v4-body .v4-home .v4-story-card>div { padding:18px 16px; }
  .v4-body .v4-home .v4-story-card h3 { font-size:var(--module-title-size,16px); }
  .v4-body .v4-home .v4-story-summary,.v4-body .v4-home .v4-story-card p { font-size:var(--module-body-size,12px); line-height:1.7; margin-top:10px; -webkit-line-clamp:3; }

  /* The map gets a full row; the two project entrances share the next row. */
  .v4-body .v4-home .v4-home-impact { display:flex; flex-direction:column; justify-content:center; gap:28px; }
  .v4-body .v4-home .v4-home-map { width:100%; max-width:600px; margin-inline:auto; }
  .v4-body .v4-home .v4-home-map svg { display:block; width:100%; height:clamp(200px,27svh,300px); }
  .v4-body .v4-home .v4-home-map>p { font-size:var(--module-body-size,12px); line-height:1.7; margin-top:12px; }
  .v4-body .v4-home .v4-map-detail { min-height:32px; font-size:12px; padding-top:8px; line-height:1.7; }
  .v4-body .v4-home .v4-impact-side { width:100%; max-width:580px; margin-inline:auto; padding:0; display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px; }
  .v4-body .v4-home .v4-impact-side>h2 { grid-column:1/-1; margin:0; font-size:var(--module-title-size,28px); text-align:center; }
  .v4-body .v4-home .v4-impact-metrics { grid-column:1/-1; margin:0 0 4px; justify-content:center; gap:20px; }
  .v4-body .v4-home .v4-impact-metrics p { font-size:var(--module-body-size,12px); }
  .v4-body .v4-home .v4-impact-metrics strong { font-size:24px; margin-left:4px; }
  .v4-body .v4-home .v4-project-card { flex-direction:column; align-items:stretch; height:auto; margin:0; }
  .v4-body .v4-home .v4-project-card>img { width:100%; height:90px; }
  .v4-body .v4-home .v4-project-card>div { padding:14px 12px; }
  .v4-body .v4-home .v4-project-card h3 { font-size:var(--module-title-size,16px); min-height:3.2em; }
  .v4-body .v4-home .v4-project-card span { font-size:var(--module-body-size,12px); margin-top:10px; }

  /* The closing scene keeps its full contact information and navigation. */
  .v4-body .v4-home .v4-home-contact { display:flex; flex-direction:column; justify-content:space-between; gap:clamp(36px,6svh,64px); padding-inline:0; padding-bottom:0; }
  .v4-body .v4-home .v4-home-slogan { width:100%; padding:24px var(--v4-mobile-gutter); }
  .v4-body .v4-home .v4-home-slogan h2 { font-size:var(--module-title-size,clamp(28px,5vw,38px)); line-height:1.6; }
  .v4-body .v4-home .v4-home-slogan-body,.v4-body .v4-home .v4-home-slogan>p { font-size:var(--module-body-size,14px); line-height:1.8; margin-top:20px; }

}
@media (max-width:600px) and (max-height:740px) {
  .v4-body .v4-home .v4-scene { padding-top:calc(var(--v4-header-height,72px) + 24px); }
  .v4-body .v4-home .v4-home-hero { padding-top:0; }
  .v4-body .v4-home .v4-home-mission { gap:28px; }
  .v4-body .v4-home .v4-home-metrics { padding-top:24px; gap:18px; }
  .v4-body .v4-home .v4-story-banner { height:320px; }
}
@media (prefers-reduced-motion:no-preference) {
  html.v4-mobile-scenes { scroll-behavior:auto; }
  .v4-home-scroll-cue svg { animation:v4-scroll-cue-drift 2.6s ease-in-out infinite; }
}
@keyframes v4-scroll-cue-drift { 0%,100% { transform:translateY(-1px); } 50% { transform:translateY(1px); } }
