/* ===========================================================
   BHE UNI — Teams page (v2 redesign)
   Every rule is scoped to .teams-v2 so it does not leak into the
   shared layout. Heading/paragraph sizes use !important because
   front/css/style.css forces h1–h6 and p sizes with !important.
   =========================================================== */
.teams-v2 {
  --navy-950: #06122a;
  --navy-900: #0a1a33;
  --navy-800: #0f2747;
  --navy-700: #16315a;
  --brand-400: #ff9a47;
  --brand-500: #f47b20;
  --brand-600: #dd6610;
  --orange-grad: linear-gradient(90deg, #f7a823, #f47b20);
  --section-pad: 48px;
  font-family: "Kanit", system-ui, -apple-system, sans-serif;
  color: var(--navy-900);
  -webkit-font-smoothing: antialiased;
}
.teams-v2 h1, .teams-v2 h2, .teams-v2 p { margin-top: 0; }
.teams-v2 .text-brand { color: var(--brand-500) !important; }
.teams-v2 .section { padding-top: var(--section-pad); padding-bottom: var(--section-pad); }
.teams-v2 .bg-soft-line { background: #f8fafc; border-top: 1px solid #e8edf3; border-bottom: 1px solid #e8edf3; }

/* ---- hero ---- */
.teams-v2 .team-hero {
  position: relative; isolation: isolate; overflow: hidden; text-align: center;
  padding-top: 72px; padding-bottom: 52px; border-bottom: 1px solid #edf1f6;
  background: #faf8f5;
}
.teams-v2 .team-hero::before {
  content: ""; position: absolute; inset: 0; z-index: 0; pointer-events: none;
  background: repeating-linear-gradient(90deg, transparent 0 159px, #1d3f6f07 160px 161px), radial-gradient(ellipse at 50% 0%, #fff0e2, transparent 72%);
  background-repeat: no-repeat;
}
.teams-v2 .team-hero > .container-xxl { position: relative; z-index: 2; }
.teams-v2 .team-hero h1 { font-weight: 700; font-size: clamp(1.9rem,4vw,2.9rem) !important; line-height: 1.12; color: var(--navy-900); margin: 0; }
.teams-v2 .team-hero p { font-size: 16px !important; color: #5b6b82; max-width: 780px; margin: 14px auto 0; line-height: 1.65; }

/* ---- section heads ---- */
.teams-v2 .team-section-head { padding-bottom: 14px; border-bottom: 2px solid #edf1f6; margin-bottom: 30px; }
.teams-v2 .team-section-head h2 { font-weight: 700; font-size: clamp(1.5rem,2.8vw,2rem) !important; color: var(--navy-900); margin: 0; }
.teams-v2 .team-section-head p { font-size: 14.5px !important; color: #64748b; margin: 8px 0 0; max-width: 720px; line-height: 1.55; }

/* ---- member cards ---- */
.teams-v2 .member-card { display: block; height: 100%; overflow: hidden; border-radius: 14px; background: #f4f6f9; text-align: center; transition: all .28s; color: inherit; }
.teams-v2 .bg-soft-line .member-card { background: #fff; }
.teams-v2 .member-card:hover { transform: translateY(-5px); box-shadow: 0 24px 50px -26px rgba(10,26,51,.38); }
.teams-v2 .member-photo-wrap { position: relative; overflow: hidden; background: #dce3ec; aspect-ratio: 1/1.1; }
.teams-v2 .exec-team-card .member-photo-wrap { aspect-ratio: 1/1.25; }
.teams-v2 .member-photo-wrap img { display: block; width: 100%; height: 100%; object-fit: cover; object-position: center top; transition: transform .4s ease; }
.teams-v2 .member-card:hover .member-photo-wrap img { transform: scale(1.04); }
.teams-v2 .member-info { padding: 12px 10px 14px; }
.teams-v2 .member-name { font-weight: 600; font-size: 14.5px !important; color: var(--navy-900); line-height: 1.25; margin: 0; transition: color .2s; }
.teams-v2 a.member-card:hover .member-name { color: var(--brand-600); }
.teams-v2 .member-role { font-size: 12px !important; color: #64748b; margin: 4px 0 0; line-height: 1.35; }
.teams-v2 .exec-team-card .member-name { font-size: 16px !important; }
.teams-v2 .exec-team-card .member-role { font-size: 13px !important; }

/* ---- CTA + enquiry form ---- */
.teams-v2 .team-cta-sec { background: #fff; padding: 48px 0 84px; }
.teams-v2 .team-cta { background: linear-gradient(160deg,#0a1a33 0%,#16315a 100%); padding: 48px; border-radius: 30px; position: relative; overflow: hidden; box-shadow: 0 44px 90px -46px rgba(6,18,42,.6); }
.teams-v2 .team-cta::before { content: ""; position: absolute; left: -60px; top: 50%; transform: translateY(-50%) rotate(45deg); width: 240px; height: 240px; border: 3px solid rgba(255,255,255,.08); border-radius: 20px; }
.teams-v2 .team-cta::after { content: ""; position: absolute; left: -20px; top: 50%; transform: translateY(-50%) rotate(45deg); width: 140px; height: 140px; border: 2px solid rgba(244,123,32,.25); border-radius: 12px; }
.teams-v2 .team-cta .row { position: relative; z-index: 1; }
.teams-v2 .tc-left h2 { font-weight: 700; font-size: clamp(1.7rem,3.6vw,2.5rem) !important; line-height: 1.1; color: #fff; }
.teams-v2 .tc-left p { font-size: 14.5px !important; color: rgba(255,255,255,.65); margin-top: 10px; line-height: 1.6; }
.teams-v2 .tc-contact { display: flex; align-items: flex-start; gap: 10px; font-size: 14px; color: rgba(255,255,255,.8); line-height: 1.5; }
.teams-v2 .tc-contact .bi { color: var(--brand-400); margin-top: 2px; }
.teams-v2 .tc-contact a { color: rgba(255,255,255,.85); }
.teams-v2 .tc-contact a:hover { color: #fff; }
.teams-v2 .tc-form { background: #fff; border-radius: 16px; padding: 24px; }
.teams-v2 .tc-input { width: 100%; border: 1px solid #dde5ef; border-radius: 9px; padding: 10px 13px; font-size: 14px; font-family: inherit; color: var(--navy-900); background: #fff; transition: border-color .2s; }
.teams-v2 .tc-input:focus { outline: none; border-color: var(--brand-400); }
.teams-v2 .tc-input::placeholder { color: #aab4c4; }
.teams-v2 .tc-error { display: block; font-size: 12.5px; color: #dc2626; margin-top: 4px; }
.teams-v2 .tc-captcha { display: flex; align-items: center; gap: 8px; }
.teams-v2 .tc-captcha img { height: 42px; border-radius: 8px; border: 1px solid #dde5ef; }
.teams-v2 .tc-reload { width: 42px; height: 42px; flex: none; border-radius: 9px; border: 1px solid #dde5ef; background: #f8fafc; color: var(--navy-800); display: grid; place-items: center; transition: all .2s; }
.teams-v2 .tc-reload:hover { color: var(--brand-600); border-color: var(--brand-400); }
.teams-v2 .btn-brand { border-radius: 999px; font-weight: 600; font-size: 15px; background: var(--orange-grad); color: #fff; border: none; box-shadow: 0 14px 30px -12px rgba(244,123,32,.6); transition: all .3s cubic-bezier(.16,1,.3,1); }
.teams-v2 .btn-brand:hover { color: #fff; transform: translateY(-2px); box-shadow: 0 18px 40px -10px rgba(244,123,32,.85); }
@media (max-width: 575px) { .teams-v2 .team-cta { padding: 32px 22px; border-radius: 22px; } .teams-v2 .team-cta-sec { padding: 16px 0 56px; } }

/* ---- scroll reveal (only hides content once JS has run) ---- */
.teams-v2.js-reveal .reveal { opacity: 0; transform: translateY(26px); transition: opacity .7s cubic-bezier(.16,1,.3,1), transform .7s cubic-bezier(.16,1,.3,1); }
.teams-v2.js-reveal .reveal.in { opacity: 1; transform: none; }
@media (prefers-reduced-motion: reduce) {
  .teams-v2.js-reveal .reveal { opacity: 1; transform: none; transition: none; }
}
