/* Styles for the site-wide contact form
   (Views/Shared/_Partial/_Partial_ContactPage.cshtml).
   Namespaced under .contact-cta so it can't leak onto the rest of the page.
   Matches the design language used across the redesigned industry pages
   (blue/mint/violet accents, Plus Jakarta Sans headings, IBM Plex Mono labels). */

.contact-cta{
  --blue:#2F6BFF;
  --blue-600:#1D4ED8;
  --blue-50:#EEF3FF;
  --ink:#0B1120;
  --muted:#5B6478;
  --line:#E6E9F2;
  --line-2:#D6DCEA;
  --panel-2:#F7F9FC;
  --red:#DC2626;

  position:relative;
  padding:clamp(48px,6vw,88px) 0;
  background:var(--panel-2);
}
.contact-cta *{box-sizing:border-box}
.contact-cta .wrap{max-width:1100px; margin:0 auto; padding:0 26px}

.contact-cta .cc-card{
  background:#fff;
  border:1px solid var(--line);
  border-radius:24px;
  overflow:hidden;
  box-shadow:0 30px 70px -34px rgba(47,107,255,.28), 0 2px 6px rgba(11,17,32,.05);
  display:grid;
  grid-template-columns:1.2fr .8fr;
}
@media(max-width:900px){
  .contact-cta .cc-card{grid-template-columns:1fr}
  .contact-cta .cc-profile-col{order:1}
  .contact-cta .cc-form-col{order:2}
}

/* ---- form column ---- */
.contact-cta .cc-form-col{padding:clamp(30px,4vw,52px)}
.contact-cta .cc-h2{
  font-family:"Plus Jakarta Sans",sans-serif; font-weight:800; letter-spacing:-.035em;
  font-size:clamp(1.9rem,3.6vw,2.6rem); line-height:1.12; color:var(--ink); margin:0 0 28px;
}
.contact-cta .cc-h2 .bl{color:var(--blue)}

.contact-cta .cc-form{display:grid; gap:16px}
.contact-cta .cc-input,
.contact-cta .cc-textarea{
  width:100%; background:var(--panel-2); border:1.5px solid var(--line-2); border-radius:12px;
  padding:14px 16px; font-family:"Inter",system-ui,-apple-system,sans-serif; font-size:.95rem; color:var(--ink);
  transition:border-color .18s, background .18s;
}
.contact-cta .cc-textarea{resize:none}
.contact-cta .cc-input::placeholder,
.contact-cta .cc-textarea::placeholder{color:var(--muted)}
.contact-cta .cc-input:focus,
.contact-cta .cc-textarea:focus{outline:none; border-color:var(--blue); background:#fff}
.contact-cta .cc-input.border-red-500,
.contact-cta .cc-textarea.border-red-500{border-color:var(--red) !important; background:#FEF2F2 !important}

.contact-cta .cc-submit{
  display:inline-flex; align-items:center; justify-content:center; gap:9px;
  padding:14px 30px; border-radius:999px; border:0; cursor:pointer;
  background:var(--blue); color:#fff; font-family:"Plus Jakarta Sans",sans-serif; font-weight:700; font-size:.93rem;
  box-shadow:0 10px 26px -10px rgba(47,107,255,.7);
  transition:transform .16s, box-shadow .22s, background .2s;
  justify-self:start;
}
.contact-cta .cc-submit:hover{background:var(--blue-600); transform:translateY(-2px); box-shadow:0 16px 34px -10px rgba(47,107,255,.75)}
.contact-cta .cc-submit:disabled{opacity:.7; cursor:not-allowed; transform:none; box-shadow:none}
.contact-cta .cc-submit .loader{
  width:16px; height:16px; border:2px solid rgba(255,255,255,.4); border-top-color:#fff;
  border-radius:50%; animation:ccSpin .7s linear infinite;
}
@keyframes ccSpin{to{transform:rotate(360deg)}}

/* ---- profile column ---- */
.contact-cta .cc-profile-col{
  background:linear-gradient(180deg,var(--blue-50) 0%, #fff 45%, #fff 55%, var(--blue-50) 100%);
  border-left:1px solid var(--line);
  padding:clamp(30px,4vw,44px);
  display:flex; flex-direction:column; align-items:center; justify-content:center; text-align:center;
  position:relative; z-index:1; overflow:hidden;
}
.contact-cta .cc-profile-col::before{
  content:""; position:absolute; inset:0; opacity:0; transition:opacity .3s; pointer-events:none; z-index:0;
  background:radial-gradient(400px circle at var(--x, 50%) var(--y, 50%), rgba(47,107,255,.14), transparent 65%);
}
.contact-cta .cc-profile-col > * {
  position:relative; z-index:1;
}
.contact-cta .cc-profile-col:hover::before{opacity:1}
@media(max-width:900px){.contact-cta .cc-profile-col{border-left:0; border-top:1px solid var(--line)}}
.contact-cta .cc-avatar{
  width:112px; height:112px; border-radius:50%; object-fit:cover; border:4px solid #fff;
  box-shadow:0 10px 30px -12px rgba(47,107,255,.5); margin-bottom:14px;
}
.contact-cta .cc-name{font-family:"Plus Jakarta Sans",sans-serif; font-size:1.3rem; font-weight:800; letter-spacing:-.02em; color:var(--ink); margin:0 0 8px}
.contact-cta .cc-tagline{font-family:"Inter",system-ui,-apple-system,sans-serif; font-size:.88rem; color:var(--muted); line-height:1.55; margin:0 0 22px; max-width:26ch}
.contact-cta .cc-call{
  display:inline-flex; align-items:center; gap:8px; padding:11px 22px; border-radius:999px;
  border:1.5px solid var(--line-2); background:#fff; color:var(--blue); text-decoration:none;
  font-family:"Plus Jakarta Sans",sans-serif; font-weight:700; font-size:.85rem;
  transition:transform .16s, border-color .18s, box-shadow .18s;
}
.contact-cta .cc-call svg{width:18px; height:18px; fill:currentColor}
.contact-cta .cc-call:hover{border-color:var(--blue); transform:translateY(-2px); box-shadow:0 10px 24px -14px rgba(47,107,255,.6)}

@media(prefers-reduced-motion:reduce){
  .contact-cta *{animation:none !important; transition:none !important}
}