/*
 * Public marketing pages (LandingController). Recreates the look of the
 * WordPress "Uptime" theme these pages replaced; standalone, it shares
 * nothing with the app stylesheets.
 */

:root {
  --landing-blue: #42BFEB;
  --landing-navy: #4069AD;
  --landing-ink: #3B3B3B;
  --landing-muted: #949AA8;
  --landing-faint: #9B99AF;
  --landing-tint: #F3F5FA;
  --landing-footer: #373433;
  --landing-width: 1140px;
}

.landing, .landing * { box-sizing: border-box; }

body.landing {
  margin: 0;
  font-family: Roboto, Arial, sans-serif;
  color: var(--landing-ink);
  background: #fff;
  -webkit-font-smoothing: antialiased;
}

.landing h1, .landing h2, .landing h3, .landing p, .landing ul { margin: 0; }
.landing ul { padding: 0; list-style: none; }
.landing img { max-width: 100%; height: auto; }

.landing-container {
  max-width: var(--landing-width);
  margin: 0 auto;
  padding: 0 20px;
}

.landing-btn {
  display: inline-block;
  padding: 14px 24px;
  border: 0;
  border-radius: 4px;
  background: var(--landing-blue);
  color: #fff;
  font: 500 18px/21px Roboto, Arial, sans-serif;
  text-decoration: none;
  cursor: pointer;
}
.landing-btn:hover { background: #2fb0de; }

/* Header */

.landing-header {
  position: sticky;
  top: 0;
  z-index: 10;
  background: #fff;
  border-bottom: 1px solid #EBEDF2;
}

.landing-header-inner {
  display: flex;
  align-items: center;
  min-height: 72px;
}

.landing-brand { display: flex; margin-right: 52px; }
.landing-brand img { width: 160px; }

.landing-nav { display: flex; align-items: center; flex: 1; }
.landing-nav ul { display: flex; gap: 32px; }
.landing-nav a, .landing-login {
  color: var(--landing-muted);
  font-size: 18px;
  line-height: 21px;
  text-decoration: none;
}
.landing-nav a:hover, .landing-nav a.active { color: #000; }
.landing-login { margin-left: auto; }

.landing-nav-toggle, .landing-nav-button { display: none; }

@media (max-width: 991px) {
  .landing-header-inner { flex-wrap: wrap; justify-content: space-between; }
  .landing-nav-button { display: block; cursor: pointer; padding: 8px; }
  .landing-nav { display: none; flex-basis: 100%; flex-direction: column; align-items: flex-start; padding: 8px 0 20px; }
  .landing-nav ul { flex-direction: column; gap: 16px; }
  .landing-login { margin: 16px 0 0; }
  .landing-nav-toggle:checked ~ .landing-nav { display: flex; }
}

/* Shared sections */

.landing-tinted { background: var(--landing-tint); }

.landing-hero { padding: 72px 0 80px; }
.landing-hero-center { text-align: center; background: var(--landing-tint); padding-bottom: 0; }
.landing-hero h1 { font-size: 48px; line-height: 56px; font-weight: 500; color: #2E2E2E; }
.landing-lead { margin-top: 12px !important; font-size: 36px; line-height: 42px; }
.landing-features-hero { display: block; margin: 64px auto 0; max-height: 48vh; min-height: 295px; width: auto; }

/* The soft curves between sections on the old site. */
.landing-wave, .landing-wave-top, .landing-wave-bottom { position: relative; }
.landing-wave::before, .landing-wave-top::before {
  content: "";
  position: absolute;
  left: 0; right: 0; top: -59px;
  height: 60px;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1920 120' preserveAspectRatio='none'%3E%3Cpath d='M0 120V60C230 0 560 30 960 60s1500 40 960-60v120z' fill='%23F3F5FA'/%3E%3C/svg%3E") no-repeat bottom / 100% 100%;
}
.landing-wave::after, .landing-wave-bottom::after {
  content: "";
  position: absolute;
  left: 0; right: 0; bottom: -59px;
  height: 60px;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1920 120' preserveAspectRatio='none'%3E%3Cpath d='M0 0h1920v50c-400 60-900 70-1300 30S170 70 0 120z' fill='%23F3F5FA'/%3E%3C/svg%3E") no-repeat top / 100% 100%;
}

/* Features */

.landing-tabs { display: flex; gap: 4px; padding: 14px 10px 0; background: #fff; }
.landing-tabs a {
  flex: 1;
  padding: 26px 12px;
  background: var(--landing-tint);
  color: var(--landing-ink);
  font-size: 24px;
  line-height: 28px;
  text-align: center;
  text-decoration: none;
}
.landing-tabs a:hover { color: var(--landing-navy); }

.landing-feature-section { padding: 80px 0 100px; text-align: center; scroll-margin-top: 72px; }
.landing-feature-section h2, .landing-more-title { font-size: 48px; line-height: 56px; font-weight: 500; color: #2E2E2E; }
.landing-tagline { margin-top: 40px !important; font-size: 24px; line-height: 28px; color: #2E2E2E; }
.landing-intro { margin: 16px auto 0 !important; font-size: 20px; line-height: 28px; font-style: italic; }

.landing-two-up { display: flex; gap: 22px; justify-content: center; margin-top: 56px; text-align: left; }
.landing-screen { flex: 0 1 540px; }
.landing-screen img { box-shadow: 0 0 40px rgba(0, 0, 0, .08); }
.landing-screen h3 { margin-top: 32px; font-size: 24px; line-height: 34px; font-weight: 500; color: #2E2E2E; }
.landing-screen p { margin-top: 16px; font-size: 20px; line-height: 28px; }

.landing-wave-top { padding: 90px 0 80px; margin-top: 60px; }
.landing-more-title { font-size: 36px; line-height: 42px; font-weight: 400; text-align: center; color: #000; }
.landing-icons { display: grid; grid-template-columns: repeat(3, 1fr); gap: 72px 48px; margin-top: 40px; }
.landing-icon-item h3 { margin-top: 14px; font-size: 20px; line-height: 28px; font-weight: 500; color: #000; }
.landing-icon-item p { margin-top: 30px; font-size: 20px; line-height: 28px; font-weight: 500; color: #ABB0BC; }

.landing-closing { padding: 100px 0 96px; text-align: center; }
.landing-closing h2 { max-width: 460px; margin: 0 auto 24px; font-size: 36px; line-height: 50px; font-weight: 400; color: #000; }

/* Pricing */

.landing-pricing { padding: 80px 0 0; }
.landing-pricing h1 { font-size: 48px; line-height: 56px; font-weight: 500; color: #000; }
.landing-plans { display: grid; grid-template-columns: repeat(4, 1fr); margin-top: 48px; }
.landing-plan {
  display: flex;
  flex-direction: column;
  padding: 28px 24px 36px;
  border: 1px solid var(--landing-tint);
  line-height: 140%;
}
.landing-plan:first-child { border-radius: 6px 0 0 6px; }
.landing-plan:last-child { border-radius: 0 6px 6px 0; }
.landing-plan:hover, .landing-plan-selected { box-shadow: 0 0 20px rgba(0, 0, 0, .15); }
.landing-plan-selected { background: var(--landing-tint); }
.landing-plan-name { font-size: 20px; font-weight: 500; color: #000; }
.landing-plan-price { margin-top: 30px !important; font-size: 36px; line-height: 50px; font-weight: 500; color: #000; }
.landing-plan-period { margin-top: 18px !important; font-size: 18px; line-height: 25px; color: var(--landing-muted); }
.landing-plan ul { margin-top: 10px; flex: 1; }
.landing-plan li { margin-bottom: 5px; font-size: 14px; color: #000; }
.landing-plan-button {
  align-self: flex-start;
  margin-top: 40px;
  padding: 10px 23px;
  border: 1px solid var(--landing-ink);
  border-radius: 3px;
  color: #000;
  font-size: 18px;
  font-weight: 500;
  text-decoration: none;
}
.landing-plan-selected .landing-plan-button, .landing-plan:hover .landing-plan-button {
  background: var(--landing-blue);
  border-color: var(--landing-blue);
  color: #fff;
}

.landing-faq { padding: 120px 0 100px; }
.landing-faq-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 56px 22px; padding: 0 10px; }
.landing-faq h3 { font-size: 20px; line-height: 30px; font-weight: 500; color: #000; }
.landing-faq p { margin-top: 16px; font-size: 20px; line-height: 30px; color: var(--landing-faint); }
.landing-other-questions { margin-top: 120px; text-align: center; }
.landing-other-questions h2 { font-size: 44px; line-height: 51px; font-weight: 500; color: #2E2E2E; }
.landing-other-questions p { margin-top: 28px; font-size: 32px; line-height: 37px; color: #000; }
.landing-other-questions a { color: #000; }

/* Contact */

.landing-contact-hero { display: flex; align-items: center; justify-content: space-between; gap: 40px; }
.landing-contact-hero h1 { font-size: 48px; }
.landing-contact-lead { margin-top: 28px !important; font-size: 36px; line-height: 42px; }
.landing-contact-email { margin-top: 100px !important; font-size: 18px; line-height: 22px; color: #000; }
.landing-contact-email a { color: #3B6FD4; }

.landing-contact { padding: 160px 0 100px; }
.landing-narrow { max-width: 614px; }
.landing-contact-intro { margin-bottom: 64px !important; text-align: center; font-size: 18px; line-height: 28px; font-weight: 500; }

.landing-form label {
  display: block;
  margin: 20px 0 12px;
  color: #ABB0BC;
  font-size: 13px;
  font-weight: 500;
}
.landing-form input[type=text], .landing-form input[type=email], .landing-form select, .landing-form textarea {
  display: block;
  width: 100%;
  padding: 9px 12px;
  border: 1px solid #DDE0E8;
  border-radius: 3px;
  background: #fff;
  color: var(--landing-ink);
  font: 16px Roboto, Arial, sans-serif;
}
.landing-form textarea { resize: none; }
.landing-form input:focus, .landing-form select:focus, .landing-form textarea:focus { outline: 2px solid var(--landing-blue); border-color: transparent; }
.landing-form-row { display: flex; gap: 24px; }
.landing-form-row > div { flex: 1; }
.landing-form .landing-btn { margin-top: 24px; padding: 12px 40px; }

.landing-hp { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }

.landing-form-error, .landing-form-notice { margin-bottom: 24px; padding: 14px 18px; border-radius: 4px; font-size: 16px; line-height: 24px; }
.landing-form-error { background: #FDECEC; color: #9B1C1C; }
.landing-form-error ul { margin-top: 6px; padding-left: 20px; list-style: disc; }
.landing-form-notice { background: #E8F7EE; color: #1E6B3A; text-align: center; }

/* Footer */

.landing-footer { padding: 96px 0 24px; background: var(--landing-footer); color: #fff; }
.landing-cta {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  padding: 24px 32px 24px 48px;
  border-radius: 8px;
  background-color: var(--landing-navy);
  background-image: url("data:image/svg+xml,%3Csvg%20width%3D%221096%22%20height%3D%22120%25%22%20viewBox%3D%220%2010%201176%20102%22%20fill%3D%22none%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%20%3Crect%20y%3D%222.09033%22%20width%3D%221176%22%20height%3D%2296%22%20rx%3D%228%22%20fill%3D%22%234069AD%22%2F%3E%20%3Cpath%20d%3D%22M465.699%2083.0903C513.53%2083.0904%20563.162%2093.0903%20582%2098.0903L171.67%2098.0903C204.431%2098.0903%20256.029%2076.0903%20312.542%2076.0903C369.054%2076.0903%20405.91%2083.0903%20465.699%2083.0903Z%22%20fill%3D%22%2342BFEB%22%2F%3E%20%3Cpath%20d%3D%22M26.9371%2042.8039C15.4091%2027.6539%2031.7405%2010.592%2041.3472%202H0V98H117C51.6402%2098%2041.3472%2061.7414%2026.9371%2042.8039Z%22%20fill%3D%22%2342BFEB%22%2F%3E%20%3Cpath%20d%3D%22M23%2044.0903C24.4815%2044.9792%2027.5556%2047.6237%2028%2051.0903C26.3333%2049.4237%2023%2045.6903%2023%2044.0903Z%22%20fill%3D%22%234069AD%22%2F%3E%20%3Cpath%20d%3D%22M225%2093.8379C228.282%2091.8794%20236.653%2088.6522%20243.876%2091.4114C238.883%2092.9175%20228.119%2095.5113%20225%2093.8379Z%22%20fill%3D%22%234069AD%22%2F%3E%20%3Cpath%20d%3D%22M38.902%203.09033C36.2001%206.05153%2031.0665%2018.6427%2032.1472%2029.3178C33.4982%2042.6618%2065.223%2091.5374%20103.5%2093.5903C141.777%2095.6432%20232.741%2070.4951%20262.012%2069.4686C291.282%2068.4422%20377.744%2077.6803%20408.365%2079.22C438.987%2080.7596%20498%2084.5903%20532%2098.0903%22%20stroke%3D%22%231B203A%22%2F%3E%20%3C%2Fsvg%3E");
  background-repeat: no-repeat;
  background-size: auto 116%;
}
.landing-cta-text { font-size: 36px; line-height: 42px; }
.landing-cta .landing-btn { flex-shrink: 0; padding: 15px 36px; }

.landing-footer-columns { display: grid; grid-template-columns: 1.4fr .7fr 1fr; gap: 24px; margin-top: 48px; }
.landing-footer-brand p { max-width: 258px; margin-top: 12px; font-size: 14px; line-height: 20px; }
.landing-footer-pages h5 { margin: 0 0 16px; font-size: 14px; line-height: 20px; font-weight: 700; }
.landing-footer-pages li { margin-bottom: 13px; }
.landing-footer-pages a { color: #A6A6A6; font-size: 14px; line-height: 20px; font-weight: 500; text-decoration: none; }
.landing-footer-pages a:hover, .landing-footer-legal a:hover { color: #fff; }
.landing-footer-email { display: flex; align-items: flex-start; gap: 12px; }
.landing-footer-email a { color: #fff; font-size: 14px; line-height: 20px; }

.landing-footer-social { display: flex; justify-content: center; gap: 30px; margin-top: 56px; }
.landing-footer-social a { color: #A6A6A6; }
.landing-footer-legal { margin-top: 20px; text-align: center; color: #A6A6A6; }
.landing-footer-legal small { font-size: 12px; font-weight: 700; }
.landing-footer-legal div { margin-top: 8px; font-size: 16px; font-weight: 500; }
.landing-footer-legal a { color: #A6A6A6; text-decoration: none; }

/* Narrow screens */

@media (max-width: 991px) {
  .landing-plans { grid-template-columns: repeat(2, 1fr); gap: 16px; }
  .landing-plan, .landing-plan:first-child, .landing-plan:last-child { border-radius: 6px; }
  .landing-icons, .landing-faq-grid { grid-template-columns: repeat(2, 1fr); }
  .landing-two-up { flex-direction: column; align-items: center; }
  .landing-contact-hero { flex-direction: column; align-items: flex-start; }
  .landing-cta { flex-direction: column; text-align: center; padding: 32px 24px; background-image: none; }
  .landing-footer-columns { grid-template-columns: 1fr; }
}

@media (max-width: 600px) {
  .landing-hero h1, .landing-feature-section h2, .landing-pricing h1 { font-size: 34px; line-height: 40px; }
  .landing-lead, .landing-contact-lead { font-size: 24px; line-height: 30px; }
  .landing-tabs { flex-direction: column; }
  .landing-tabs a { font-size: 20px; padding: 18px 12px; }
  .landing-plans, .landing-icons, .landing-faq-grid { grid-template-columns: 1fr; }
  .landing-form-row { flex-direction: column; gap: 0; }
  .landing-cta-text { font-size: 26px; line-height: 32px; }
  .landing-other-questions h2 { font-size: 32px; line-height: 38px; }
  .landing-other-questions p { font-size: 22px; line-height: 30px; }
  .landing-contact { padding-top: 100px; }
}

/* Help Center */

.help-hero { padding-bottom: 72px; }
.help-search input {
  width: 100%;
  max-width: 420px;
  padding: 10px 14px 10px 40px;
  border: 1px solid #DDE0E8;
  border-radius: 4px;
  background: #fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24'%3E%3Cpath d='M15.5 14h-.79l-.28-.27A6.47 6.47 0 0 0 16 9.5 6.5 6.5 0 1 0 9.5 16c1.61 0 3.09-.59 4.23-1.57l.27.28v.79l5 4.99L20.49 19l-4.99-5zm-6 0C7.01 14 5 11.99 5 9.5S7.01 5 9.5 5 14 7.01 14 9.5 11.99 14 9.5 14z' fill='%23949AA8'/%3E%3C/svg%3E") no-repeat 12px center;
  font: 16px Roboto, Arial, sans-serif;
}
.help-hero .help-search { margin-top: 32px; }

.help-categories { padding: 64px 0 100px; }
.help-category-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; }
.help-category-card {
  display: block;
  padding: 28px 24px;
  border: 1px solid #EBEDF2;
  border-radius: 6px;
  color: var(--landing-ink);
  text-decoration: none;
}
.help-category-card:hover { box-shadow: 0 0 20px rgba(0, 0, 0, .1); }
.help-category-card h2 { font-size: 22px; line-height: 28px; font-weight: 500; color: #2E2E2E; }
.help-category-card p { margin-top: 8px; color: var(--landing-muted); font-size: 16px; }

.help-page { padding: 56px 0 100px; }
.help-topbar { display: flex; align-items: center; justify-content: space-between; gap: 24px; }
.help-topbar .help-search input { width: 222px; }
.help-breadcrumb, .help-breadcrumb a { color: var(--landing-blue); font-size: 18px; text-decoration: none; }
.help-page h1 { margin: 48px 0 24px; font-size: 32px; line-height: 40px; font-weight: 500; color: #2E2E2E; }
.help-question-list { margin-bottom: 48px; }
.help-question-list li { margin-bottom: 14px; }
.help-question-list a { color: var(--landing-ink); font-size: 18px; line-height: 27px; text-decoration: none; }
.help-question-list a:hover { color: var(--landing-navy); }

.help-article { border-top: 1px solid #EBEDF2; scroll-margin-top: 90px; }
.help-article:last-child { border-bottom: 1px solid #EBEDF2; }
.help-article summary { padding: 20px 0; cursor: pointer; font-size: 20px; line-height: 28px; font-weight: 500; color: #2E2E2E; }
.help-answer { padding: 0 0 24px; font-size: 18px; line-height: 28px; }
.help-answer p { margin: 0 0 12px; }
.help-answer a { color: var(--landing-navy); }
.help-answer img { max-width: 100%; height: auto; }

.help-results li { margin-bottom: 18px; }
.help-results a { color: var(--landing-ink); font-size: 18px; text-decoration: none; }
.help-results a:hover { color: var(--landing-navy); }
.help-results span { display: block; color: var(--landing-muted); font-size: 14px; }
.help-no-results a, .help-page p a { color: var(--landing-navy); }

@media (max-width: 991px) { .help-category-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 600px) {
  .help-category-grid { grid-template-columns: 1fr; }
  .help-topbar { flex-direction: column; align-items: flex-start; }
}

/* Additions for pages that exist only on AgentCMS (homepage, help center, thank-you). */
.landing-hero .landing-checklist{list-style:none;padding:0;margin:32px auto !important;display:table;text-align:left;font-size:18px}
.landing-checklist li{padding-left:28px;margin:8px 0;position:relative}
.landing-checklist li::before{content:"✓";position:absolute;left:0;color:#42BFEB;font-weight:700}
.landing-hero-center .landing-btn{display:table;margin:0 auto 24px}
.landing-downloads,.landing-posts{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:20px;margin-top:32px}
.landing-download,.landing-post{display:flex;flex-direction:column;gap:8px;padding:24px;border-radius:8px;background:#fff;box-shadow:0 2px 12px rgba(27,32,58,.08);color:#1B203A;text-decoration:none}
.landing-download span{color:#4069AD;font-weight:500}
.landing-post-date{color:#949AA8;font-size:14px}
.landing-download:hover,.landing-post:hover{box-shadow:0 4px 18px rgba(27,32,58,.16)}
.landing-nav .locale-switcher{display:flex;gap:12px;margin:0 0 0 40px;padding:0}
.landing-nav .locale-switcher a{font-size:14px}
.locale-switcher a{text-transform:uppercase}
.landing-nav .locale-switcher a.active{color:#000;font-weight:500}
.landing-help-list{list-style:none;padding:0;margin:0}
.landing-help-item{border-bottom:1px solid #E3E7F0;padding:20px 0}
.landing-help-item h3{margin:0 0 10px;font-size:18px}
.landing-help-cats{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:20px;margin-top:32px}
.landing-narrow h2 + .landing-intro{margin-bottom:48px !important}
.landing-tagline a{color:var(--landing-navy)}

/* Contact form card: centred, padded, full-width fields and button. */
.landing-contact { padding: 120px 0 100px; }
.landing-form-card { padding: 40px 48px 48px; border-radius: 8px; background: #fff; box-shadow: 0 4px 32px rgba(27,32,58,.10); }
.landing-form-card form { margin: 0; }
.landing-form-card label { color: #6B7280; font-size: 14px; margin: 22px 0 8px; }
.landing-form-card .landing-form-row label { margin-top: 0; }
.landing-form-card input[type=text], .landing-form-card input[type=email], .landing-form-card select, .landing-form-card textarea { padding: 12px 14px; border-radius: 6px; }
.landing-form-card .landing-btn { display: block; width: 100%; margin-top: 32px; padding: 14px; font-size: 18px; cursor: pointer; border: 0; }
.landing-contact-intro { margin-bottom: 40px !important; }
@media (max-width: 640px) {
  .landing-form-card { padding: 28px 20px 32px; }
  .landing-form-row { flex-direction: column; gap: 0; }
  .landing-form-card .landing-form-row > div + div label { margin-top: 22px; }
}