<template>
  <div id="RagDisasterResponse" class="content-block">
    <h2>灾害快速响应</h2>
    <div class="row">
      <div class="col-xs-12 col-sm-6 col-md-6">
        <p class="lead">在自然灾害和突发事件发生时，时间就是生命。无人机系统能够快速部署，为灾害响应提供关键的空中支持和实时情报。</p>
        <ul class="feature-list">
          <li><i class="glyphicon glyphicon-ok"></i> 快速抵达灾区现场，获取第一手资料</li>
          <li><i class="glyphicon glyphicon-ok"></i> 实时传输高清视频，支持远程决策</li>
          <li><i class="glyphicon glyphicon-ok"></i> 全天候作业能力，不受地形限制</li>
          <li><i class="glyphicon glyphicon-ok"></i> 降低救援人员进入危险区域的风险</li>
        </ul>
      </div>
      <div class="col-xs-12 col-sm-6 col-md-6">
        <img class="img-responsive center-block wow fadeInRight" src="@/assets/img/service4.jpg" alt="灾害响应">
      </div>
    </div>
    
    <div class="row" style="margin-top: 40px;">
      <div class="col-xs-12 col-sm-12 col-md-12">
        <h3>应用场景</h3>
      </div>
      <div class="col-xs-12 col-sm-6 col-md-4 wow zoomIn">
        <div class="scenario-card">
          <div class="scenario-icon">
            <i class="glyphicon glyphicon-flash"></i>
          </div>
          <h4>地震响应</h4>
          <p>快速获取震中情况，评估建筑物损毁程度，为救援力量部署提供依据。</p>
        </div>
      </div>
      <div class="col-xs-12 col-sm-6 col-md-4 wow zoomIn">
        <div class="scenario-card">
          <div class="scenario-icon">
            <i class="glyphicon glyphicon-tint"></i>
          </div>
          <h4>洪涝监测</h4>
          <p>实时监测水位变化，识别受困人员位置，规划最佳救援路线。</p>
        </div>
      </div>
      <div class="col-xs-12 col-sm-6 col-md-4 wow zoomIn">
        <div class="scenario-card">
          <div class="scenario-icon">
            <i class="glyphicon glyphicon-fire"></i>
          </div>
          <h4>火灾扑救</h4>
          <p>提供火场全景视图，监测火势蔓延方向，指导灭火力量部署。</p>
        </div>
      </div>
    </div>
  </div>
</template>

<script>
export default {
  name: "EmergencyDisasterResponse"
};
</script>

<style scoped>
/* 使用全局样式，无需额外定义 */
/* content-block, feature-list, scenario-card, scenario-icon 已在全局定义 */
</style>
