/* TN ENGINEERS & SURVEYORS — components (buttons, modals, cards) */

/* ===== Apply Now button (service pages) ===== */
.apply-now-btn{
    display:inline-flex; align-items:center; justify-content:center; gap:8px;
    background:linear-gradient(135deg,#fde047 0%,#facc15 30%,#f59e0b 75%,#ea580c 100%);
    color:#0a3d24;
    padding:14px 40px; font-size:1.05rem; font-weight:800; letter-spacing:.04em; text-transform:uppercase;
    border:none; border-radius:12px; cursor:pointer;
    box-shadow:0 10px 24px rgba(245,158,11,.45),0 2px 6px rgba(0,0,0,.18);
    transition:all .25s ease;
    width:100%; max-width:300px;
    margin-top:8px;
}
.apply-now-btn:hover{ transform:translateY(-2px); filter:brightness(1.06); box-shadow:0 14px 30px rgba(245,158,11,.55),0 3px 8px rgba(0,0,0,.2); }
.apply-now-btn:active{ transform:translateY(0); filter:none; }
.apply-now-btn:focus-visible{ outline:3px solid #fff; outline-offset:3px; }
/* Compact Apply Now (service cards) */
.apply-now-btn-sm{
    background:linear-gradient(135deg,#fde047 0%,#facc15 30%,#f59e0b 75%,#ea580c 100%);
    color:#0a3d24;
    padding:9px 20px; font-size:.85rem; font-weight:700; letter-spacing:.03em; text-transform:uppercase;
    border:none; border-radius:10px; cursor:pointer;
    box-shadow:0 4px 12px rgba(245,158,11,.35);
    transition:all .25s ease;
}
.apply-now-btn-sm:hover{ transform:translateY(-1px); filter:brightness(1.06); box-shadow:0 8px 18px rgba(245,158,11,.45); }
.apply-now-btn-sm:active{ transform:translateY(0); filter:none; }
.apply-now-btn-sm:focus-visible{ outline:3px solid #0a5c36; outline-offset:2px; }

/* ===== Apply Now modal ===== */
@keyframes applyFadeIn{ from{opacity:0;} to{opacity:1;} }
@keyframes applySlideIn{ from{opacity:0; transform:translateY(24px) scale(.97);} to{opacity:1; transform:translateY(0) scale(1);} }
.apply-modal-overlay{ animation:applyFadeIn .25s ease; }
.apply-modal-card{ animation:applySlideIn .3s ease; }
.apply-error{ color:#dc2626; font-size:.8rem; margin-top:4px; min-height:0; }
.field-input.input-error{ border-color:#dc2626; box-shadow:0 0 0 3px rgba(220,38,38,.1); }
.apply-service-badge{
    display:inline-flex; align-items:center; gap:6px;
    background:#f0fdf4; color:#0a5c36; border:1px solid #bbf7d0;
    font-size:.85rem; font-weight:600; padding:6px 14px; border-radius:9999px;
}

/* ===== Global responsive hardening ===== */
html, body{ overflow-x:hidden; }
@media (max-width: 768px){
    .form-container{ padding:24px 16px; }
    .section_title{ font-size:32px; line-height:42px; }
    .heading{ font-size:18px; }
}
@media (max-width: 480px){
    .form-container{ padding:20px 14px; }
    .section_title{ font-size:27px; line-height:37px; }
    h1{ font-size:30px; }
    .whatsapp-float{ width:52px; height:52px; bottom:16px; right:16px; }
    .whatsapp-float svg{ width:26px; height:26px; }
    .whatsapp-tooltip{ display:none; }
    .card{ min-height:auto; }
}

/* ================= HOME BANNER — "We Build Your Dreams" ================= */
.tn-banner{position:relative;isolation:isolate;overflow:hidden;background:#052e1b;padding:clamp(56px,7vw,104px) 0;}
.tn-banner__bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-2;}
.tn-banner__overlay{position:absolute;inset:0;z-index:-1;
  background:linear-gradient(100deg,rgba(5,46,27,.94) 0%,rgba(10,92,54,.88) 42%,rgba(6,51,30,.62) 72%,rgba(6,51,30,.45) 100%);}
.tn-banner__inner{max-width:80rem;margin:0 auto;padding:0 1rem;display:grid;grid-template-columns:1.05fr .95fr;gap:clamp(24px,4vw,56px);align-items:center;}
.tn-banner__copy{color:#fff;max-width:36rem;}
.tn-banner__eyebrow{display:inline-flex;align-items:center;gap:.5rem;padding:.5rem 1rem;margin-bottom:1.25rem;
  border:1px solid rgba(250,204,21,.35);background:rgba(250,204,21,.16);border-radius:999px;
  color:#fde047;font-size:.8rem;font-weight:600;letter-spacing:.04em;}
.tn-banner__dot{width:.5rem;height:.5rem;border-radius:999px;background:#facc15;animation:tnPulse 2s cubic-bezier(.4,0,.6,1) infinite;}
@keyframes tnPulse{50%{opacity:.4}}
.tn-banner__title{font-size:clamp(2.1rem,5.2vw,3.6rem);line-height:1.08;font-weight:800;letter-spacing:-.02em;margin:0 0 1rem;}
.tn-banner__title span{color:#facc15;}
.tn-banner__text{font-size:clamp(1rem,1.4vw,1.15rem);line-height:1.7;color:rgba(255,255,255,.9);margin:0 0 1.9rem;max-width:34rem;}
.tn-banner__actions{display:flex;flex-wrap:wrap;gap:.9rem;}
.tn-banner__btn{display:inline-flex;align-items:center;justify-content:center;gap:.55rem;padding:.9rem 1.7rem;border-radius:.75rem;
  font-weight:700;font-size:1rem;border:2px solid transparent;cursor:pointer;transition:transform .25s ease,box-shadow .25s ease,background-color .25s ease;}
.tn-banner__btn--primary{background:linear-gradient(135deg,#facc15 0%,#f59e0b 55%,#ea580c 100%);color:#0a3d24;box-shadow:0 12px 26px rgba(245,158,11,.4);}
.tn-banner__btn--primary:hover{transform:translateY(-2px);box-shadow:0 16px 32px rgba(245,158,11,.5);}
.tn-banner__btn--ghost{background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.45);color:#fff;}
.tn-banner__btn--ghost:hover{background:rgba(255,255,255,.18);transform:translateY(-2px);}
.tn-banner__btn:focus-visible{outline:3px solid #fde047;outline-offset:3px;}
.tn-banner__cards{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(12px,1.6vw,18px);}
.tn-banner__card{position:relative;margin:0;border-radius:1rem;overflow:hidden;box-shadow:0 18px 40px rgba(0,0,0,.35);
  border:1px solid rgba(255,255,255,.16);background:#06331e;}
.tn-banner__card img{width:100%;height:clamp(120px,15vw,170px);object-fit:cover;display:block;transition:transform .5s ease;}
.tn-banner__card:hover img{transform:scale(1.07);}
.tn-banner__card figcaption{position:absolute;left:0;right:0;bottom:0;padding:.85rem .9rem .7rem;color:#fff;font-size:.85rem;font-weight:700;
  background:linear-gradient(to top,rgba(5,46,27,.92),rgba(5,46,27,0));}
@media (max-width:1024px){
  .tn-banner__inner{grid-template-columns:1fr;}
  .tn-banner__copy{max-width:none;}
}
@media (max-width:640px){
  .tn-banner__cards{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;}
  .tn-banner__card figcaption{font-size:.74rem;padding:.6rem .55rem .5rem;}
  .tn-banner__btn{flex:1 1 100%;}
}