/* ── INDEX PAGE ───────────────────────────────────────── */

/* Quote */
.quote-sec{
  padding:30px 0;
  position:relative;
  overflow:hidden;
  background:
    radial-gradient(circle at 1px 1px, rgba(184,134,11,.10) 1px, transparent 0),
    linear-gradient(180deg, #f8fbfd 0%, #eef5f8 100%);
  background-size:22px 22px, auto;
}

.quote-sec::before{
  content:'';
  position:absolute;
  top:0;
  right:0;
  left:0;
  height:1px;
  background:linear-gradient(to left, transparent, rgba(184,134,11,.65), transparent);
}

.quote-sec::after{
  content:'';
  position:absolute;
  bottom:0;
  right:0;
  left:0;
  height:1px;
  background:linear-gradient(to left, transparent, rgba(184,134,11,.45), transparent);
}

.quote-sec .sec-hd{
  text-align:center;
  margin-bottom:18px;
}

.quote-sec .sec-tag{
  font-size:15px;
  padding:5px 18px;
}

.quote-sec .sec-hd h3{
  font-size:32px;
  font-family:var(--FD);
  font-weight:700;
  color:#0f2535;
  margin-top:8px;
}

.quote-wrap{
  max-width:880px;
  margin:0 auto;
  padding:0 20px;
}

.q-card{
  background:
    linear-gradient(135deg, rgba(255,255,255,.98), rgba(248,251,253,.98));
  border:1px solid rgba(30,60,80,.10);
  border-right:5px solid var(--gold);
  border-radius:0 18px 18px 0;
  padding:30px 30px;
  display:flex;
  align-items:flex-start;
  gap:18px;
  position:relative;
  overflow:hidden;
  box-shadow:0 16px 40px rgba(18,42,56,.10);
  min-height:180px;
}

.q-card::before{
  content:'❝';
  position:absolute;
  top:-28px;
  left:18px;
  font-family:var(--FD);
  font-size:110px;
  color:rgba(184,134,11,.12);
  line-height:1;
  pointer-events:none;
}

.q-card::after{
  content:'';
  position:absolute;
  inset:0;
  background:
    linear-gradient(45deg, transparent 0%, rgba(184,134,11,.025) 50%, transparent 100%);
  pointer-events:none;
}

.q-ico{
  width:56px;
  height:56px;
  border-radius:50%;
  background:linear-gradient(180deg, #fdf8e7 0%, #f7ebbf 100%);
  border:1px solid rgba(184,134,11,.35);
  display:flex;
  align-items:center;
  justify-content:center;
  flex-shrink:0;
  box-shadow:0 6px 16px rgba(184,134,11,.12);
  margin-top:4px;
}

.q-ico svg{
  width:22px;
  height:22px;
}

.q-card > div:last-child{
  flex:1;
}

.q-txt{
  font-family:var(--FD);
  font-size:29px;
  color:#0f2535;
  line-height:2.15;
  transition:opacity .45s ease, transform .45s ease;
  opacity:1;
  transform:translateY(0);
}

.q-auth{
  font-family:var(--FB);
  font-size:17px;
  color:#6a8090;
  margin-top:10px;
  transition:opacity .45s ease, transform .45s ease;
  opacity:1;
  transform:translateY(0);
}

.q-txt.fade-out,
.q-auth.fade-out{
  opacity:0;
  transform:translateY(8px);
}

.q-txt.fade-in,
.q-auth.fade-in{
  opacity:1;
  transform:translateY(0);
}

.q-dots{
  display:flex;
  gap:8px;
  justify-content:center;
  margin-top:16px;
}

.q-dot{
  width:9px;
  height:9px;
  border-radius:50%;
  background:var(--b2);
  cursor:pointer;
  transition:all .3s ease;
  box-shadow:0 0 0 3px rgba(158,202,216,.18) inset;
}

.q-dot:hover{
  transform:scale(1.08);
}

.q-dot.on{
  background:var(--gold);
  width:28px;
  border-radius:6px;
  box-shadow:none;
}

/* Goals */
.goals-sec{
  padding:46px 0;
  background:#f4f7f9;
}

.goals-sec .sec-hd h3{
  font-size:30px;
}

.goals-sec .sec-hd p{
  font-size:17px;
}

.goals-grid{
  display:grid;
  grid-template-columns:repeat(5,1fr);
  gap:16px;
}

.g-card{
  background:#fff;
  border:1px solid rgba(30,60,80,.10);
  border-top:4px solid var(--g5);
  border-radius:14px;
  padding:18px 14px;
  text-align:center;
  transition:transform .25s, box-shadow .25s, border-color .25s;
  box-shadow:0 4px 14px rgba(30,80,60,.05);
}

.g-card:hover{
  transform:translateY(-5px);
  box-shadow:0 12px 28px rgba(30,80,60,.10);
  border-color:rgba(78,160,112,.35);
}

.g-img{
  width:64px;
  height:64px;
  border-radius:16px;
  overflow:hidden;
  margin:0 auto 12px;
  border:1px solid rgba(30,80,60,.09);
  box-shadow:0 6px 15px rgba(30,80,60,.08);
}

.g-img img{
  width:100%;
  height:100%;
  object-fit:cover;
}

.g-card h4{
  font-family:var(--FD);
  font-size:20px;
  color:#0f2535;
  margin-bottom:6px;
}

.g-card p{
  font-family:var(--FB);
  font-size:15px;
  color:#5f7483;
  line-height:1.9;
}

/* Partners */
.partners-sec{
  padding:42px 0;
  background:#fff;
}

.partners-sec .sec-hd h3{
  font-size:30px;
}

.partners-row{
  display:flex;
  flex-wrap:wrap;
  gap:12px;
  justify-content:center;
  margin-top:18px;
}

.p-pill{
  background:#fff;
  border:1px solid rgba(30,60,80,.10);
  border-radius:30px;
  padding:10px 20px;
  font-family:var(--FB);
  font-size:15px;
  color:#4a6070;
  display:flex;
  align-items:center;
  gap:8px;
  transition:border-color .2s, color .2s, transform .2s, box-shadow .2s;
  box-shadow:0 4px 12px rgba(30,60,80,.04);
}

.p-pill:hover{
  border-color:var(--b5);
  color:var(--b7);
  transform:translateY(-2px);
  box-shadow:0 10px 22px rgba(30,60,80,.08);
}

.p-dot{
  width:7px;
  height:7px;
  border-radius:50%;
  background:var(--g4);
  flex-shrink:0;
}

/* Projects */
.proj-sec{
  padding:46px 0;
  background:#f4f7f9;
}

.proj-sec .sec-hd h3{
  font-size:30px;
}

.proj-sec .sec-hd p{
  font-size:17px;
}

.proj-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:16px;
}

.proj-card{
  background:#fff;
  border:1px solid rgba(30,60,80,.10);
  border-radius:14px;
  padding:18px;
  display:flex;
  gap:15px;
  align-items:flex-start;
  transition:border-color .25s, box-shadow .25s, transform .25s;
  box-shadow:0 5px 16px rgba(30,60,80,.05);
}

.proj-card:hover{
  border-color:var(--b4);
  box-shadow:0 12px 28px rgba(30,60,80,.10);
  transform:translateY(-4px);
}

.proj-img{
  width:92px;
  height:92px;
  border-radius:12px;
  overflow:hidden;
  flex-shrink:0;
  border:1px solid rgba(30,60,80,.08);
  box-shadow:0 6px 14px rgba(30,60,80,.08);
}

.proj-img img{
  width:100%;
  height:100%;
  object-fit:cover;
}

.proj-body h4{
  font-family:var(--FD);
  font-size:21px;
  color:#0f2535;
  margin-bottom:6px;
}

.proj-body p{
  font-family:var(--FB);
  font-size:15px;
  color:#4a6070;
  line-height:1.95;
}

.proj-tag{
  display:inline-block;
  background:var(--b0);
  color:var(--b7);
  font-family:var(--FB);
  font-size:13px;
  font-weight:700;
  padding:4px 12px;
  border-radius:22px;
  border:1px solid var(--b2);
  margin-top:8px;
}

.proj-soc{
  display:flex;
  gap:6px;
  margin-top:10px;
}

.proj-soc a{
  width:30px;
  height:30px;
  border-radius:8px;
  background:#f4f7f9;
  border:1px solid rgba(30,60,80,.09);
  display:flex;
  align-items:center;
  justify-content:center;
  color:#6a8090;
  font-size:14px;
  transition:background .15s, color .15s, border-color .15s, transform .15s;
}

.proj-soc a:hover{
  background:var(--b7);
  color:#fff;
  border-color:var(--b7);
  transform:translateY(-2px);
}

/* Contact */
.contact-sec{
  padding:46px 0;
}

.contact-sec .sec-hd h3{
  font-size:30px;
}

.contact-sec .sec-hd p{
  font-size:17px;
}

.contact-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:20px;
  align-items:start;
}

.ci-list{
  display:flex;
  flex-direction:column;
  gap:10px;
}

.ci-item{
  background:#fff;
  border:1px solid rgba(30,60,80,.10);
  border-radius:12px;
  padding:13px 15px;
  display:flex;
  align-items:center;
  gap:12px;
  transition:border-color .2s, box-shadow .2s, transform .2s;
  box-shadow:0 4px 12px rgba(30,60,80,.04);
}

.ci-item:hover{
  border-color:var(--b4);
  box-shadow:0 10px 22px rgba(30,60,80,.08);
  transform:translateY(-2px);
}

.ci-ico{
  width:40px;
  height:40px;
  border-radius:11px;
  background:var(--b0);
  border:1px solid var(--b2);
  display:flex;
  align-items:center;
  justify-content:center;
  color:var(--b7);
  font-size:17px;
  flex-shrink:0;
}

.ci-txt span{
  font-family:var(--FB);
  font-size:16px;
  color:#0f2535;
  display:block;
}

.ci-txt small{
  font-family:var(--FB);
  font-size:13px;
  color:#6a8090;
}

.map-wrap{
  border-radius:13px;
  overflow:hidden;
  border:1px solid rgba(30,60,80,.10);
  margin-bottom:12px;
  box-shadow:0 8px 24px rgba(30,60,80,.08);
}

.cf-card{
  background:#fff;
  border:1px solid rgba(30,60,80,.10);
  border-radius:14px;
  padding:22px;
  box-shadow:0 8px 24px rgba(30,60,80,.06);
}

.cf-row{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:12px;
  margin-bottom:12px;
}

.cf-field{
  display:flex;
  flex-direction:column;
  gap:6px;
  margin-bottom:12px;
}

.cf-field label{
  font-family:var(--FB);
  font-size:14px;
  font-weight:600;
  color:#5e7483;
}

.cf-field input,
.cf-field textarea{
  background:#f4f7f9;
  border:1px solid rgba(30,60,80,.10);
  border-radius:10px;
  padding:11px 13px;
  font-family:var(--FB);
  font-size:15px;
  color:#0f2535;
  outline:none;
  transition:border-color .2s, box-shadow .2s, background .2s;
  width:100%;
}

.cf-field input:focus,
.cf-field textarea:focus{
  border-color:var(--b5);
  background:#fff;
  box-shadow:0 0 0 4px rgba(58,125,152,.10);
}

.cf-field textarea{
  resize:vertical;
  min-height:100px;
}

.cf-submit{
  width:100%;
  background:var(--b7);
  color:#fff;
  border:none;
  padding:13px;
  border-radius:10px;
  font-family:var(--FB);
  font-size:16px;
  font-weight:700;
  cursor:pointer;
  transition:background .2s, transform .15s, box-shadow .2s;
  box-shadow:0 8px 20px rgba(30,69,96,.18);
}

.cf-submit:hover{
  background:var(--b8);
  transform:translateY(-1px);
}

.sent-msg{
  display:none;
  background:var(--g0);
  color:var(--g7);
  border:1px solid var(--g2);
  border-radius:10px;
  padding:12px 15px;
  font-family:var(--FB);
  font-size:14px;
  margin-bottom:12px;
}

/* General heading helper tuning */
.sec-hd{
  text-align:center;
  margin-bottom:28px;
}

.sec-hd p{
  margin-top:6px;
}

/* Responsive */
@media(max-width:992px){
  .goals-grid{
    grid-template-columns:repeat(3,1fr);
  }

  .quote-sec .sec-hd h3,
  .goals-sec .sec-hd h3,
  .partners-sec .sec-hd h3,
  .proj-sec .sec-hd h3,
  .contact-sec .sec-hd h3{
    font-size:28px;
  }

  .q-txt{
    font-size:25px;
  }
}

@media(max-width:768px){
  .quote-sec{
    padding:50px 0;
  }

  .quote-wrap{
    padding:0 14px;
  }

  .q-card{
    padding:24px 18px;
    gap:14px;
    min-height:auto;
  }

  .q-card::before{
    font-size:88px;
    top:-22px;
    left:12px;
  }

  .q-ico{
    width:46px;
    height:46px;
  }

  .q-txt{
    font-size:22px;
    line-height:2;
  }

  .q-auth{
    font-size:15px;
  }

  .goals-grid{
    grid-template-columns:1fr 1fr;
  }

  .proj-grid{
    grid-template-columns:1fr;
  }

  .contact-grid{
    grid-template-columns:1fr;
  }

  .cf-row{
    grid-template-columns:1fr;
  }

  .g-card h4{
    font-size:18px;
  }

  .g-card p,
  .proj-body p,
  .ci-txt span,
  .cf-field input,
  .cf-field textarea{
    font-size:14px;
  }

  .proj-body h4{
    font-size:19px;
  }
}

@media(max-width:480px){
  .goals-grid{
    grid-template-columns:1fr;
  }

  .quote-sec .sec-hd h3,
  .goals-sec .sec-hd h3,
  .partners-sec .sec-hd h3,
  .proj-sec .sec-hd h3,
  .contact-sec .sec-hd h3{
    font-size:24px;
  }

  .q-card{
    flex-direction:column;
    align-items:flex-start;
  }

  .q-txt{
    font-size:20px;
  }

  .q-auth{
    font-size:14px;
  }

  .p-pill{
    font-size:14px;
    padding:9px 16px;
  }
}