/* =========================================================
   SUPPORT PAGE
   Final structural pass — integrated field
   ========================================================= */

.support-page{
  width:100%;
  overflow:hidden;
  background:#f6f5f3;
  color:#1b1b1b;
}


/* =========================================================
   BUTTON
   ========================================================= */

.support-button{
  display:inline-block;
  padding:15px 30px;
  background:#8b0000;
  color:#fff;
  text-decoration:none;
  font-weight:700;
  letter-spacing:.02em;
  transition:background .2s ease, transform .2s ease;
  box-shadow:none;
  border: 1px solid transparent;
}

.support-button:hover{
  background:#fff;
  color:#6f0000;
  border-color: #6f0000;
}


/* =========================================================
   PRIMARY OFFERING FIELD
   ========================================================= */

.support-offering{
  position:relative;
  background:linear-gradient(to bottom, #e9e5dd 0%, #f6f5f3 100%);
  padding:clamp(42px, 5vw, 72px) 0 clamp(84px, 9vw, 120px);
}

.support-offering-shell{
  margin:0 auto;
  position:relative;
  min-height:clamp(540px, 52vw, 760px);
}

.support-offering-image{
  width:min(74%, 980px);
  min-height:clamp(520px, 52vw, 760px);
  background-image:
    linear-gradient(to bottom, rgba(0,0,0,.08), rgba(0,0,0,.16)),
    url("/assets/images/support/support_workers.webp");
  background-size:cover;
  background-position:center;
  background-repeat:no-repeat;
  box-shadow:0 28px 56px rgba(0,0,0,.10);
  position:relative;
}

.support-offering-image::after{
  content:"";
  position:absolute;
  right:0;
  bottom:0;
  width:140px;
  height:3px;
  background:#8b0000;
}

.support-offering-card{
  position:absolute;
  top:50%;
  right:0;
  transform:translateY(-50%);
  z-index:2;
}

.support-offering-card-inner{
  background:rgba(255,255,255,.96);
  padding:clamp(34px, 3.5vw, 54px);
  box-shadow:0 22px 48px rgba(0,0,0,.14);
  border-top:3px solid #8b0000;
}

.support-kicker{
  margin:0 0 14px;
  font-size:.78rem;
  line-height:1.2;
  letter-spacing:.16em;
  text-transform:uppercase;
  color:#8b0000;
  font-weight:700;
}

.support-offering-card h1{
  margin:0 0 22px;
  font-size:clamp(2.6rem, 4vw, 4.35rem);
  line-height:.96;
  letter-spacing:-.03em;
  color:#151515;
}

.support-lead{
  margin:0 0 22px;
  font-size:1.12rem;
  line-height:1.8;
  color:#242424;
}

.support-offering-card p{
  margin:0 0 18px;
  font-size:1.03rem;
  line-height:1.8;
  color:#2d2d2d;
}

.support-trust{
  margin-top:26px;
  padding-top:20px;
  border-top:1px solid rgba(0,0,0,.10);
}

.support-trust p{
  margin:0 0 8px;
  font-size:.95rem;
  line-height:1.65;
  color:#555;
}

.support-trust p:last-child{
  margin-bottom:0;
}


/* =========================================================
   REASONS BLOCK
   Surgical refinement — less UI, more institution
   ========================================================= */

.support-reasons{
  padding:0 0 clamp(84px, 8vw, 116px);
}

.support-reasons-inner{
  width:min(1180px, calc(100% - 48px));
  margin:0 auto;
}

.support-reasons-head{
  width:min(700px, 100%);
  margin:0 auto clamp(28px, 3.5vw, 38px);
  text-align:center;
}

.support-reasons-head h2{
  margin:0 0 14px;
  font-size:clamp(2rem, 2.5vw, 2.7rem);
  line-height:1.06;
  color:#151515;
}

.support-reasons-head p{
  margin:0;
  font-size:1.02rem;
  line-height:1.75;
  color:#2d2d2d;
}

.support-reasons-block{
  background:
    linear-gradient(to bottom, #f7f4ee 0%, #f2eee7 100%);
  border-top:3px solid rgba(139,0,0,.92);
  border-bottom:1px solid rgba(0,0,0,.10);
  box-shadow:none;
  display:grid;
  grid-template-columns:1.08fr 1fr 1.08fr;
  position:relative;
}

.support-reasons-block::before{
  content:"";
  position:absolute;
  inset:0;
  border-left:1px solid rgba(0,0,0,.08);
  border-right:1px solid rgba(0,0,0,.08);
  pointer-events:none;
}

.support-reason{
  padding:28px 30px 30px;
  position:relative;
}

.support-reason:not(:last-child){
  border-right:1px solid rgba(0,0,0,.12);
}

.support-reason h3{
  margin:0 0 12px;
  font-size:1.18rem;
  line-height:1.12;
  color:#181818;
  letter-spacing:.01em;
}

.support-reason p{
  margin:0;
  font-size:.98rem;
  line-height:1.72;
  color:#2f2f2f;
}

/* subtle de-equalization without changing content */
.support-reason:nth-child(2){
  padding-top:34px;
  padding-bottom:34px;
  background:rgba(255,255,255,.20);
}

.support-reason:nth-child(2) h3{
  font-size:1.12rem;
  color:#1f1f1f;
}

.support-reason:nth-child(2) p{
  font-size:.96rem;
}

@media (max-width: 1120px){

  .support-reasons-inner{
    width:min(1100px, calc(100% - 32px));
  }

  .support-reasons-block{
    grid-template-columns:1fr;
  }

  .support-reasons-block::before{
    display:none;
  }

  .support-reason{
    padding:24px 24px 26px;
  }

  .support-reason:nth-child(2){
    padding-top:24px;
    padding-bottom:26px;
    background:transparent;
  }

  .support-reason:not(:last-child){
    border-right:none;
    border-bottom:1px solid rgba(0,0,0,.10);
  }
}

@media (max-width: 640px){

  .support-reasons{
    padding:0 0 72px;
  }

  .support-reasons-inner{
    width:min(100%, calc(100% - 20px));
  }

  .support-reasons-head{
    margin-bottom:24px;
  }

  .support-reason{
    padding:22px 20px 24px;
  }

  .support-reason:nth-child(2){
    padding-top:22px;
    padding-bottom:24px;
  }

  .support-reasons-head p,
  .support-reason p{
    line-height:1.68;
  }
}


/* =========================================================
   CLOSING FIELD
   ========================================================= */

.support-closing{
  position:relative;
  min-height:360px;
  background-image:
    linear-gradient(to right, rgba(17,17,17,.34), rgba(17,17,17,.12)),
    linear-gradient(to bottom, rgba(0,0,0,.10), rgba(0,0,0,.24)),
    url("/assets/images/support/download (2).jpg");
  background-size:cover;
  background-position:center;
  background-repeat:no-repeat;
}

.support-closing-overlay{
  width:100%;
  min-height:360px;
  display:flex;
  align-items:center;
}

.support-closing-inner{
  width:min(1200px, calc(100% - 48px));
  margin:0 auto;
}

.support-closing p{
  margin:0;
  max-width:540px;
  padding:32px 36px;
  font-size:clamp(1.35rem, 2vw, 1.9rem);
  line-height:1.55;
  color:#ffffff;
  text-shadow:0 1px 2px rgba(0,0,0,.20);
  background:rgba(20,20,20,.30);
  border-left:3px solid rgba(255,255,255,.72);
  backdrop-filter:blur(2px);
}


/* =========================================================
   RESPONSIVE
   ========================================================= */

@media (max-width: 1120px){

  .support-offering-shell{
    width:min(1100px, calc(100% - 32px));
    min-height:auto;
  }

  .support-offering-image{
    width:100%;
    min-height:420px;
  }

  .support-offering-card{
    position:relative;
    top:auto;
    right:auto;
    transform:none;
    width:min(760px, calc(100% - 40px));
    margin:-72px auto 0;
  }

  .support-reasons-inner,
  .support-closing-inner{
    width:min(1100px, calc(100% - 32px));
  }

  .support-reasons-block{
    grid-template-columns:1fr;
  }

  .support-reason:not(:last-child){
    border-right:none;
    border-bottom:1px solid rgba(0,0,0,.08);
  }
}

@media (max-width: 640px){

  .support-offering{
    padding:24px 0 68px;
  }

  .support-offering-shell{
    width:min(100%, calc(100% - 20px));
  }

  .support-offering-image{
    min-height:280px;
    box-shadow:none;
  }

  .support-offering-card{
    width:100%;
    margin:-28px auto 0;
  }

  .support-offering-card-inner{
    padding:28px 20px 30px;
    box-shadow:none;
    border-top:2px solid #8b0000;
  }

  .support-offering-card h1{
    font-size:2.25rem;
  }

  .support-lead,
  .support-offering-card p,
  .support-reasons-head p,
  .support-reason p{
    line-height:1.7;
  }

  .support-reasons{
    padding:0 0 72px;
  }

  .support-reasons-inner,
  .support-closing-inner{
    width:min(100%, calc(100% - 20px));
  }

  .support-reason{
    padding:24px 20px 26px;
  }

  .support-closing,
  .support-closing-overlay{
    min-height:280px;
  }

    .support-closing p{
      max-width:360px;
      padding:22px 20px;
      font-size:1.15rem;
      line-height:1.6;
    }
}