/*
Theme Name: ATS Response Landing Page
Theme URI: https://atsresponse.com/
Author: ATS Response
Description: A responsive one-page landing page for ATS Response, with an inquiry form that submits through WordPress email.
Version: 1.0.0
Requires at least: 6.0
Requires PHP: 7.4
Text Domain: ats-response-landing-page
*/

:root{color-scheme:light dark;--navy:#06265d;--navy2:#04183d;--red:#ef1728;--ink:light-dark(#152235,#eef3fa);--muted:light-dark(#5c6878,#b8c5d6);--paper:light-dark(#fff,#111c2b);--line:light-dark(#dce3ec,#314056)}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;font-family:Helvetica,Arial,sans-serif;background:light-dark(#f4f7fb,#081323);color:var(--ink)}.site{min-height:100vh;background:light-dark(#f4f7fb,#081323)}.topbar{background:var(--navy2);color:#fff;padding:12px 4vw;display:flex;justify-content:space-between;align-items:center;gap:18px;flex-wrap:wrap}.brand-logo{flex:0 1 280px;max-width:38vw}.brand-logo .logo{display:block;width:100%;height:auto;max-height:84px;object-fit:contain;object-position:left center}.tagline{font-size:12px;letter-spacing:.19em;font-weight:700;color:#dce7f7}.phone{color:#fff;text-decoration:none;font-size:clamp(20px,2.3vw,29px);font-weight:800;letter-spacing:.03em}.phone small{display:block;font-size:10px;letter-spacing:.16em;color:#d0d9e9;text-align:right;margin-bottom:3px}.hero{background:radial-gradient(ellipse at 50% 20%,#0c3b80 0%,#06265d 54%,#031638 100%);padding:48px 5vw 58px;text-align:center;color:#fff}.logo{display:block;width:100%;height:auto;object-fit:contain}.hero h1{font-size:clamp(28px,4vw,46px);line-height:1.1;margin:10px auto 14px;letter-spacing:-.025em}.hero p{font-size:clamp(15px,1.7vw,19px);color:#dbe7f8;max-width:690px;margin:0 auto 27px;line-height:1.65}.services{display:flex;justify-content:center;align-items:center;gap:12px;flex-wrap:wrap;margin:0 auto 28px;font-weight:800;letter-spacing:.13em;font-size:clamp(12px,1.3vw,15px)}.services span{color:#fff}.services b{color:var(--red)}.cta{display:inline-block;background:var(--red);color:#fff;text-decoration:none;font-weight:800;letter-spacing:.08em;padding:15px 24px;border-radius:3px;box-shadow:0 8px 22px #0003}.contact{max-width:1120px;margin:-1px auto 0;padding:55px 24px 64px;display:grid;grid-template-columns:1fr 1fr;gap:48px;align-items:start}.eyebrow{font-size:12px;font-weight:800;color:var(--red);letter-spacing:.16em;text-transform:uppercase}.contact h2{font-size:clamp(26px,3vw,36px);margin:12px 0;letter-spacing:-.025em}.contact .intro{color:var(--muted);line-height:1.7;max-width:470px}.call-card{margin-top:28px;background:var(--navy);padding:22px 24px;border-left:4px solid var(--red);color:#fff;border-radius:4px}.call-card .label{font-size:11px;letter-spacing:.15em;color:#d5e2f4;font-weight:700}.call-card a{display:block;color:#fff;text-decoration:none;font-size:clamp(24px,3vw,35px);font-weight:800;margin-top:7px}.call-card .note{font-size:13px;color:#d5e2f4;margin-top:8px}.form-card{background:var(--paper);border:1px solid var(--line);padding:28px;border-radius:7px;box-shadow:0 12px 35px #00112a0b}.form-card h3{font-size:22px;margin:0 0 7px}.form-card>p{color:var(--muted);font-size:14px;line-height:1.5;margin:0 0 22px}.fields{display:grid;grid-template-columns:1fr 1fr;gap:15px}.field{display:flex;flex-direction:column;gap:7px}.field.full{grid-column:1/-1}.field label{font-size:12px;font-weight:700;color:var(--ink)}.field input,.field select,.field textarea{font:16px Helvetica,Arial,sans-serif;width:100%;border:1px solid var(--line);border-radius:3px;padding:12px;background:light-dark(#fff,#0a1524);color:var(--ink)}.field textarea{min-height:110px;resize:vertical}.submit{margin-top:18px;border:0;background:var(--navy);color:#fff;padding:14px 20px;border-radius:3px;font:700 13px Helvetica,Arial,sans-serif;letter-spacing:.09em;cursor:pointer;width:100%}.privacy{font-size:11px;color:var(--muted);line-height:1.5;margin-top:12px}.footer{background:var(--navy2);color:#c6d4e8;text-align:center;padding:23px 18px;font-size:12px;letter-spacing:.04em}.footer strong{color:#fff}.mobile-phone{display:none}
@media(max-width:760px){.topbar{justify-content:space-between;text-align:left}.brand-logo{flex:0 1 190px;max-width:55vw}.brand-logo .logo{max-height:60px}.phone small{text-align:center}.hero{padding:34px 20px 44px}.logo-wrap{margin-bottom:25px}.logo{max-height:none}.contact{grid-template-columns:1fr;padding:42px 20px;gap:28px}.fields{grid-template-columns:1fr}.field.full{grid-column:auto}.form-card{padding:22px}.services{gap:8px}.desktop-phone{display:none}.mobile-phone{display:block}}

:root {
  --navy: #0b2d57;
  --navy2: #061a33;
  --red: #df2638;
  --ink: light-dark(#15243a, #eef3fb);
  --muted: light-dark(#5d6b7e, #b7c4d7);
  --paper: light-dark(#ffffff, #101d2e);
  --line: light-dark(#d9e1eb, #324159);
}
body, .site {
  background: light-dark(#f4f7fb, #081323);
}
.topbar {
  padding: 17px clamp(20px, 5vw, 76px);
  gap: 22px;
  border-bottom: 1px solid rgba(255, 255, 255, .09);
}
.brand-logo {
  flex: 0 1 270px;
  max-width: min(38vw, 270px);
}
.brand-logo .logo {
  max-height: 76px;
}
.tagline {
  font-size: 11px;
  letter-spacing: .16em;
  color: #d1deef;
  text-align: center;
}
.topbar .phone {
  display: inline-block;
  padding: 11px 17px;
  border: 1px solid rgba(255, 255, 255, .28);
  border-radius: 6px;
  font-size: clamp(19px, 2vw, 25px);
  white-space: nowrap;
  transition: background .2s ease, border-color .2s ease;
}
.topbar .phone:hover {
  background: rgba(255, 255, 255, .08);
  border-color: rgba(255, 255, 255, .55);
}
.hero {
  position: relative;
  overflow: hidden;
  padding: clamp(64px, 8vw, 98px) 24px clamp(70px, 8vw, 94px);
  background:
    radial-gradient(ellipse at 15% 4%, rgba(50, 105, 178, .4), transparent 42%),
    radial-gradient(ellipse at 88% 92%, rgba(223, 38, 56, .14), transparent 38%),
    linear-gradient(135deg, #082750 0%, #062149 52%, #04162f 100%);
}
.hero > * {
  position: relative;
  z-index: 1;
}
.services {
  display: inline-flex;
  gap: 12px;
  margin-bottom: 22px;
  padding: 10px 17px;
  border: 1px solid rgba(255, 255, 255, .18);
  border-radius: 999px;
  background: rgba(255, 255, 255, .055);
  font-size: 11px;
  letter-spacing: .14em;
}
.hero h1 {
  max-width: 850px;
  margin: 0 auto 18px;
  font-size: clamp(34px, 4.5vw, 54px);
  line-height: 1.08;
  letter-spacing: -.035em;
}
.hero p {
  max-width: 650px;
  margin-bottom: 30px;
  line-height: 1.75;
}
.cta {
  padding: 16px 27px;
  border-radius: 6px;
  background: var(--red);
  box-shadow: 0 10px 26px rgba(0, 0, 0, .2);
  font-size: 12px;
  letter-spacing: .1em;
  transition: transform .2s ease, background .2s ease, box-shadow .2s ease;
}
.cta:hover {
  background: #c91f30;
  box-shadow: 0 13px 30px rgba(0, 0, 0, .27);
  transform: translateY(-2px);
}
.contact {
  max-width: 1180px;
  padding: clamp(50px, 7vw, 82px) 28px clamp(56px, 7vw, 86px);
  gap: clamp(32px, 5vw, 66px);
}
.eyebrow {
  letter-spacing: .17em;
  font-size: 11px;
}
.contact h2 {
  max-width: 450px;
  font-size: clamp(29px, 3.2vw, 38px);
  line-height: 1.13;
  letter-spacing: -.03em;
  margin: 13px 0 15px;
}
.contact .intro {
  line-height: 1.8;
}
.call-card {
  margin-top: 30px;
  padding: 25px 27px;
  border-left-width: 5px;
  border-radius: 8px;
  background: linear-gradient(125deg, #123d73, #0b2d57 70%);
  box-shadow: 0 12px 28px rgba(8, 30, 62, .13);
}
.call-card a {
  letter-spacing: -.02em;
}
.form-card {
  padding: clamp(24px, 3vw, 34px);
  border-radius: 13px;
  box-shadow: 0 18px 48px rgba(10, 32, 63, .09);
}
.form-card h3 {
  font-size: 23px;
  letter-spacing: -.02em;
}
.form-card > p {
  margin-bottom: 25px;
  line-height: 1.65;
}
.fields {
  gap: 17px 15px;
}
.field {
  gap: 8px;
}
.field label {
  font-size: 12px;
  letter-spacing: .01em;
}
.field input, .field select, .field textarea {
  border-radius: 6px;
  padding: 13px 14px;
  transition: border-color .18s ease, box-shadow .18s ease;
}
.field input:focus, .field select:focus, .field textarea:focus {
  outline: none;
  border-color: #3977bb;
  box-shadow: 0 0 0 3px rgba(57, 119, 187, .15);
}
.field textarea {
  min-height: 122px;
}
.submit {
  margin-top: 20px;
  padding: 16px 20px;
  border-radius: 6px;
  background: var(--navy);
  letter-spacing: .1em;
  transition: background .2s ease, transform .2s ease;
}
.submit:hover {
  background: #12447b;
  transform: translateY(-1px);
}
.privacy {
  margin-top: 14px;
  line-height: 1.65;
}
.footer {
  padding: 27px 18px;
  line-height: 1.9;
  background: #05162d;
}
@media (max-width: 760px) {
  .topbar {
    justify-content: space-between;
    padding: 15px 20px 17px;
    gap: 12px;
  }
  .brand-logo {
    flex: 0 1 190px;
    max-width: 56vw;
  }
  .brand-logo .logo {
    max-height: 58px;
  }
  .tagline {
    order: 3;
    flex: 1 0 100%;
    margin-top: -2px;
    text-align: center;
    font-size: 10px;
  }
  .hero {
    padding: 48px 21px 54px;
  }
  .services {
    gap: 8px;
    padding: 9px 12px;
    font-size: 10px;
    letter-spacing: .1em;
  }
  .hero h1 {
    margin-bottom: 16px;
    font-size: clamp(32px, 8vw, 42px);
  }
  .hero p {
    margin-bottom: 25px;
    font-size: 15px;
  }
  .hero .mobile-phone {
    display: inline-block;
    margin: 23px auto 0 !important;
    padding: 10px 16px;
    border: 1px solid rgba(255, 255, 255, .3);
    border-radius: 6px;
    font-size: 21px;
  }
  .contact {
    padding: 44px 20px 52px;
    gap: 28px;
  }
  .call-card {
    padding: 22px;
  }
  .form-card {
    padding: 23px 20px;
  }
}

/* WordPress theme refinements */
html { scroll-padding-top: 18px; }
body { min-width: 320px; }
.notice { margin: 0 0 18px; padding: 13px 15px; border-radius: 6px; font-size: 14px; line-height: 1.5; }
.notice-success { background: #e8f6ed; border: 1px solid #a7d8b7; color: #155d31; }
.notice-error { background: #fff0f0; border: 1px solid #efb8bd; color: #8a1723; }
.ats-honeypot { position: absolute !important; left: -10000px !important; width: 1px !important; height: 1px !important; overflow: hidden !important; }
.form-card form { margin: 0; }
.form-card input, .form-card select, .form-card textarea { box-shadow: none; }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } *, *::before, *::after { transition-duration: .01ms !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; } }