.public-site {
  background:#f7f8fa;
  color:#172239
}
.public-site #main {
  max-width:1280px;
  margin:auto;
  padding:0 32px
}
.public-header {
  max-width:1344px;
  margin:auto;
  min-height:88px;
  padding:16px 32px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:24px;
  border-bottom:1px solid #e8ebf0
}
.public-header nav,.public-actions {
  display:flex;
  align-items:center;
  gap:24px;
  flex-wrap:wrap
}
.public-header nav a {
  font-weight:600
}
.public-header .brand-lockup,.public-footer .brand-lockup {
  width:auto
}
.public-hero {
  display:grid;
  grid-template-columns:1.05fr 1fr;
  gap:64px;
  align-items:center;
  padding:64px 0
}
.public-site h1 {
  font-size:clamp(32px,4.6vw,56px);
  line-height:1.09;
  letter-spacing:-.035em;
  margin:20px 0 24px;
  color:#030a44
}
.public-site h2 {
  font-size:clamp(25px,3vw,34px);
  letter-spacing:-.025em;
  line-height:1.2
}
.public-site h3 {
  font-size:21px
}
.hero-intro {
  font-size:20px;
  line-height:1.7;
  max-width:690px;
  color:#4c586b
}
.public-actions {
  margin:28px 0
}
.product-preview {
  background:#f6f8fc;
  border:1px solid #dfe5ee;
  border-radius:16px;
  padding:28px;
  box-shadow:0 12px 32px #030a4408
}
.preview-top {
  display:flex;
  align-items:center;
  gap:8px;
  font-size:12px;
  color:#41516e
}
.preview-top span:last-child {
  font-size:11px;
  margin-left:auto;
  letter-spacing:1px
}
.product-preview h2 {
  font-size:25px;
  max-width:340px;
  margin:28px 0
}
.preview-metrics {
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:10px;
  margin-bottom:18px
}
.preview-metrics div {
  background:#fff;
  border:1px solid #e4e8ef;
  border-radius:12px;
  padding:16px 10px;
  font-size:13px
}
.preview-metrics strong {
  display:block;
  font-size:28px;
  color:#030a44
}
.preview-row {
  display:flex;
  gap:12px;
  align-items:center;
  padding:18px 0;
  border-bottom:1px solid #e2e7ef
}
.preview-row strong {
  font-size:13px
}
.preview-row small {
  display:block;
  color:#536276;
  font-size:13px;
  margin-top:5px
}
.preview-icon {
  flex-shrink:0;
  width:34px;
  height:34px;
  border-radius:10px;
  display:grid;
  place-items:center;
  font-weight:700
}
.preview-icon.amber {
  background:#fff0cf;
  color:#805400
}
.preview-icon.blue {
  background:#e3ecfd;
  color:#244ca2
}
.preview-icon.green {
  background:#e2f3eb;
  color:#216342
}
.public-section {
  padding:70px 0;
  scroll-margin-top:24px
}
.public-section>p {
  max-width:850px;
  line-height:1.8
}
.public-tinted {
  background:#f5f7fa;
  padding:40px;
  border-radius:16px
}
.public-grid {
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:28px;
  margin:36px 0
}
.public-grid article p {
  line-height:1.75;
  color:#566174
}
.step-number {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:40px;
  height:40px;
  border:1px solid #c8d3e3;
  color:#030a44;
  border-radius:12px;
  font-weight:700
}
.price-card {
  border:1px solid #dce2eb;
  padding:28px;
  border-radius:18px;
  background:#fff
}
.price-featured {
  border:2px solid #030a44
}
.price-card h3 {
  font-size:42px;
  margin:18px 0 6px
}
.price-card small {
  display:block;
  font-size:14px;
  font-weight:400;
  color:#566174
}
.price-card ul {
  list-style:none;
  padding:0;
  margin:24px 0
}
.price-card li {
  padding:10px 0;
  border-bottom:1px solid #edf0f4;
  font-size:14px
}
.price-card .button {
  width:100%;
  text-align:center;
  justify-content:center
}
.public-footer {
  max-width:1280px;
  margin:32px auto 0;
  border-top:1px solid #dce2e8;
  padding:32px;
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:32px;
  font-size:14px;
  color:#536276
}
.public-footer a {
  margin:0
}
.public-footer-identity>p {
  margin:16px 0 8px
}
.public-footer-identity>small {
  font-size:12px
}
.public-footer-links {
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:32px
}
.public-footer-links strong {
  display:block;
  color:#172239;
  font-size:13px;
  margin-bottom:8px
}
.public-form {
  overflow-wrap: anywhere;
  max-width:620px;
  margin:48px auto 64px;
  padding:32px;
  border:1px solid #dce2e8;
  background:#fff;
  border-radius:14px
}
.public-form h1 {
  font-size:32px;
  line-height:1.2;
  margin-top:8px
}
.public-form form>div {
  margin:22px 0
}
.public-form form label {
  display:block;
  font-weight:600;
  margin-bottom:8px
}
.public-form form button {
  margin-top:8px
}
.public-form form input:not([type=checkbox]) {
  width:100%
}
.public-form .helptext {
  display:block;
  font-size:13px;
  color:#606b7d;
  margin-top:6px
}
.public-form ul.errorlist {
  background:#fff0ef;
  color:#9c2722;
  padding:14px 24px;
  border-radius:8px
}
.order-summary {
  background:#f5f7fa;
  border:1px solid #dce2eb;
  border-radius:16px;
  padding:24px;
  margin:24px 0
}
.order-summary h2 {
  font-size:32px
}
.order-summary small {
  font-size:14px
}
.welcome-grid {
  grid-template-columns:1fr 1fr
}
.faq {
  max-width:900px
}
.faq details {
  padding:20px 0;
  border-bottom:1px solid #dce2eb
}
.faq summary {
  font-size:18px;
  font-weight:600;
  cursor:pointer
}
.faq p {
  line-height:1.75;
  color:#566174
}
.public-site .button {
  min-height:44px
}
.public-site a:focus-visible,.public-site summary:focus-visible {
  outline:3px solid #008080;
  outline-offset:4px
}

@media(max-width:850px) {
  .public-hero {
    grid-template-columns:1fr;
    gap:32px;
    padding:48px 0
  }
  .public-grid {
    grid-template-columns:1fr
  }
  .public-tinted {
    padding:28px
  }
  .public-header {
    flex-wrap:wrap;
    gap:12px
  }
  .public-header nav {
    width:100%;
    gap:8px 12px
  }
  .public-header nav a {
    display:inline-flex;
    align-items:center;
    min-height:44px
  }
  .public-section {
    padding-top:44px;
    padding-bottom:44px
  }
  .public-footer {
    flex-direction:column
  }
  .product-preview {
    transform:none
  }
  .public-site #main {
    padding:0 20px
  }
  .public-header {
    padding:16px 20px
  }
  .public-form {
    margin:24px auto 40px;
    padding:24px
  }
  .public-hero h1 {
    font-size:clamp(32px,8vw,44px)
  }
  .product-preview {
    padding:20px
  }
  .welcome-grid {
    grid-template-columns:1fr
  }
  
}
@media(prefers-reduced-motion:reduce) {
  * {
    scroll-behavior:auto
  }
  
}


/* Owner signup: a readable form with the full recurring cost alongside it. */
.signup-page {
  max-width:1120px;
  margin:32px auto 72px
}
.signup-steps {
  list-style:none;
  display:flex;
  gap:28px;
  padding:0;
  margin:0 0 44px;
  color:#687387;
  font-size:13px
}
.signup-steps li {
  display:flex;
  align-items:center;
  gap:9px
}
.signup-steps span {
  display:grid;
  place-items:center;
  width:26px;
  height:26px;
  border-radius:50%;
  background:#eef1f5;
  color:#556178;
  font-weight:600
}
.signup-steps [aria-current] {
  color:#030a44;
  font-weight:600
}
.signup-steps [aria-current] span {
  background:#030a44;
  color:white
}
.signup-heading {
  max-width:760px;
  margin-bottom:28px
}
.public-site .signup-heading h1 {
  font-size:clamp(30px,3.3vw,44px);
  margin:12px 0 16px
}
.signup-heading>p {
  color:#556178;
  line-height:1.7
}
.signup-layout {
  display:grid;
  grid-template-columns:minmax(0,1.45fr) minmax(300px,1fr);
  gap:40px;
  align-items:start
}
.signup-form fieldset {
  border:0;
  border-bottom:1px solid #e5e9ef;
  padding:0 0 24px;
  margin:0 0 24px;
  min-width:0
}
.signup-form legend {
  font-size:19px;
  font-weight:600;
  color:#030a44;
  padding:0;
  margin-bottom:8px
}
.signup-fields {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:18px
}
.signup-field {
  margin-top:14px;
  min-width:0
}
.signup-field label {
  display:block;
  font-size:14px;
  font-weight:600;
  margin-bottom:7px
}
.signup-field input,.signup-field select {
  width:100%;
  min-height:46px;
  padding:11px 12px;
  font-size:14px;
  border-radius:8px
}
.signup-field .field-help,.field-intro {
  font-size:13px;
  line-height:1.55;
  color:#627087
}
.field-intro {
  margin:0 0 4px
}
.signup-field .field-help {
  margin-top:8px
}
.field-help ul {
  margin:0;
  padding-left:17px
}
.signup-field .errorlist {
  padding-left:18px;
  font-size:12px;
  color:#9c2722
}
.has-error input,.has-error select {
  border-color:#b33531
}
.signup-errors {
  padding:16px;
  border:1px solid #edb9b5;
  border-radius:10px;
  margin-bottom:22px;
  background:#fff5f4
}
.signup-errors a {
  color:#922b28
}
.signup-consent {
  display:flex;
  align-items:flex-start;
  gap:12px;
  margin:12px 0 20px
}
.signup-consent input {
  flex:0 0 20px;
  width:20px;
  height:20px;
  margin:3px 0;
  accent-color:#008285
}
.signup-consent label {
  font-size:13px;
  line-height:1.65
}
.signup-submit {
  width:100%;
  justify-content:center
}
.signup-signin {
  font-size:13px;
  text-align:center;
  margin-top:16px
}
.signup-summary {
  position:sticky;
  top:24px;
  background:#f6f8fb;
  border:1px solid #dfe5ed;
  border-radius:18px;
  padding:28px
}
.public-site .signup-summary h2 {
  font-size:24px;
  margin:18px 0 12px
}
.quote-total {
  display:flex;
  align-items:baseline;
  gap:8px;
  margin:0
}
.quote-total strong {
  font-size:42px;
  line-height:1.2;
  letter-spacing:-1px;
  color:#030a44
}
.quote-total span {
  font-size:14px;
  color:#627087
}
#quote-breakdown {
  font-size:14px;
  margin:12px 0 4px
}
.quote-tax,.summary-note {
  font-size:13px;
  color:#627087;
  line-height:1.65
}
.quote-capacity {
  margin:24px 0 12px
}
.quote-capacity>div {
  display:flex;
  gap:12px;
  justify-content:space-between;
  border-bottom:1px solid #dfe5ed;
  padding:12px 0;
  font-size:13px
}
.quote-capacity dd {
  font-weight:600;
  color:#030a44;
  margin:0;
  white-space:nowrap
}
.summary-next {
  border-top:1px solid #dfe5ed;
  padding-top:20px;
  margin-top:22px;
  font-size:13px
}
.summary-next ol {
  padding-left:20px;
  line-height:1.7
}
.summary-next li {
  padding:4px 0
}
.package-fields {
  grid-template-columns:1.6fr 1fr
}

@media(max-width:850px) {
  .signup-layout {
    grid-template-columns:1fr;
    gap:24px
  }
  .signup-summary {
    position:static;
    grid-row:1;
    padding:22px
  }
  .signup-summary .summary-next {
    font-size:13px
  }
  .signup-summary>.summary-note {
    font-size:13px
  }
  .signup-summary .quote-capacity {
    margin:14px 0 0
  }
  .signup-steps {
    gap:12px;
    flex-wrap:wrap;
    font-size:13px;
    margin-bottom:28px
  }
  .signup-heading {
    margin-bottom:22px
  }
  .signup-page {
    margin-top:24px
  }
  .quote-total strong {
    font-size:36px
  }
  
}
@media(max-width:480px) {
  .signup-fields,.package-fields {
    grid-template-columns:1fr;
    gap:0
  }
  .signup-steps {
    display:grid;
    grid-template-columns:1fr 1fr
  }
  .signup-summary {
    padding:20px
  }
  
}


.package-edit {
  border:1px solid #dfe5ed;
  border-radius:12px;
  padding:18px;
  margin:20px 0
}
.package-edit summary {
  font-weight:600;
  cursor:pointer
}
.package-edit form>div {
  margin:16px 0
}
.package-edit select {
  width:100%
}


.legal-document {
  max-width:820px;
  margin:40px auto 70px;
  line-height:1.8;
  overflow-wrap:anywhere
}
.legal-document h2 {
  margin-top:32px
}
.legal-document li {
  margin-bottom:12px
}
.legal-document a {
  text-decoration:underline
}
.legal-document .tabs {
  margin:28px 0
}
.public-footer-links a {
  display:flex;
  align-items:center;
  min-height:44px;
  padding:8px 0
}
.public-footer-identity>a {
  display:inline-flex;
  min-height:44px;
  align-items:center
}
.public-footer-identity>a:hover {
  text-decoration:none
}

@media print {
  .public-header,.public-footer,.legal-document .tabs {
    display:none
  }
  .legal-document {
    max-width:none;
    margin:0;
    color:#000
  }
  .legal-document h2 {
    break-after:avoid
  }
  body.public-site {
    background:#fff
  }
  
}


.public-grid.price-grid {
  grid-template-columns:repeat(2,minmax(0,1fr))
}
@media(max-width:640px) {
  .public-grid.price-grid {
    grid-template-columns:1fr
  }
  
}


@media(max-width:480px) {
  .public-header .brand-lockup {
    max-width:100%
  }
  .public-header nav {
    gap:4px 14px;
    font-size:13px
  }
  .public-form {
    padding:20px
  }
  .public-footer {
    padding:24px 20px;
    gap:24px
  }
  .public-footer-links {
    gap:16px;
    grid-template-columns:1fr 1fr;
    width:100%;
    font-size:13px
  }
  .public-footer-links a {
    overflow-wrap:anywhere
  }
  .signup-field input,.signup-field select {
    font-size:16px
  }
  .public-site #main {
    padding-inline:16px
  }
  .preview-top {
    flex-wrap:wrap
  }
  .preview-top span:last-child {
    margin-left:0
  }
  .preview-metrics {
    gap:6px
  }
  .preview-metrics div {
    padding:12px 8px
  }
  .quote-total {
    flex-wrap:wrap
  }
  .quote-capacity>div {
    flex-wrap:wrap
  }
  
}

