:root{
    --accent:#0013FF;
    --accent-dk:#0010D9;
    --ink-navy:#0A0E33;
    --ink-navy-2:#11175A;
    --cream:#FBF6EF;
    --sand:#EFE3D2;
    --ink:#211C17;
    --ink-muted:#6E6155;
    --white:#FFFFFF;
    --radius:14px;
  }
  *{box-sizing:border-box;}
  html{scroll-behavior:smooth;}
  section[id]{scroll-margin-top:84px;}
  body{
    margin:0;
    font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
    color:var(--ink);
    background:var(--white);
    -webkit-font-smoothing:antialiased;
    line-height:1.55;
  }
  h1,h2,h3{
    font-family:"Space Grotesk", -apple-system, sans-serif;
    font-weight:700;
    line-height:1.12;
    margin:0 0 16px;
    letter-spacing:-0.01em;
  }
  p{margin:0 0 16px;}
  img{max-width:100%;display:block;}
  a{color:inherit;}
  .container{max-width:1160px;margin:0 auto;padding:0 24px;}
  .eyebrow{
    display:inline-block;
    font-size:12px;
    font-weight:600;
    text-transform:uppercase;
    letter-spacing:0.18em;
    color:var(--accent);
    margin-bottom:14px;
  }
  section .eyebrow.on-dark{color:#8C97FF;}
  .section-pad{padding:100px 0;}
  @media (max-width:768px){.section-pad{padding:70px 0;}}

  /* Buttons */
  .btn{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:10px;
    font-family:"Space Grotesk",sans-serif;
    font-weight:700;
    font-size:17px;
    padding:17px 30px;
    border-radius:10px;
    text-decoration:none;
    border:2px solid transparent;
    cursor:pointer;
    min-height:52px;
    transition:transform .15s ease, background .15s ease, box-shadow .15s ease;
  }
  .btn:active{transform:scale(0.98);}
  .btn-primary{
    background:var(--accent);
    color:#fff;
    box-shadow:0 10px 30px -8px rgba(0,19,255,0.55);
  }
  .btn-primary:hover{background:var(--accent-dk);}
  .btn-ghost{
    background:transparent;
    color:#fff;
    border-color:rgba(255,255,255,0.4);
  }
  .btn-ghost:hover{border-color:#fff;}
  .btn-outline-dark{
    background:transparent;
    color:var(--ink-navy);
    border-color:var(--ink-navy);
  }
  .btn-outline-dark:hover{background:var(--ink-navy);color:#fff;}
  .btn-block{width:100%;}

  .phone-icon{width:20px;height:20px;flex:0 0 auto;}

  /* NAV */
  header.topbar{
    position:sticky;top:0;z-index:40;
    background:rgba(10,14,51,0.96);
    backdrop-filter:blur(6px);
    padding:14px 0;
  }
  .topbar-inner{display:flex;align-items:center;justify-content:space-between;gap:16px;}
  .brand{display:flex;align-items:center;gap:10px;color:#fff;font-family:"Space Grotesk",sans-serif;font-weight:700;font-size:17px;flex:0 0 auto;}
  .brand img{height:40px;width:40px;border-radius:50%;background:#fff;}
  .topbar-nav{display:flex;align-items:center;gap:28px;flex:1;justify-content:center;}
  .topbar-nav a{color:#D9DCF7;text-decoration:none;font-size:14px;font-weight:600;letter-spacing:0.01em;white-space:nowrap;transition:color .15s ease;}
  .topbar-nav a:hover{color:#fff;}
  @media (max-width:900px){ .topbar-nav{display:none;} }
  .topbar-cta{display:flex;align-items:center;gap:18px;flex:0 0 auto;}
  .topbar-phone{display:flex;align-items:center;gap:8px;color:#fff;font-weight:700;font-family:"Space Grotesk",sans-serif;text-decoration:none;font-size:15px;}
  @media (max-width:560px){ .topbar-phone-label{display:none;} }

  /* HERO */
  .hero{
    background:linear-gradient(160deg,var(--ink-navy) 0%, var(--ink-navy-2) 100%);
    color:#fff;
    position:relative;
    overflow:hidden;
    padding:76px 0 90px;
  }
  .hero-grid{
    display:grid;
    grid-template-columns:1.05fr 0.95fr;
    gap:56px;
    align-items:center;
    position:relative;
    z-index:2;
  }
  @media (max-width:900px){ .hero-grid{grid-template-columns:1fr;gap:40px;} }
  .hero h1{font-size:clamp(32px,4.4vw,52px);color:#fff;}
  .hero h1 em{font-style:normal;color:#7B8CFF;}
  .hero .sub{font-size:18px;color:#D9DCF7;max-width:520px;}
  .hero-ctas{display:flex;flex-wrap:wrap;gap:14px;margin:26px 0 22px;}
  .trust-pills{display:flex;flex-wrap:wrap;gap:10px 22px;padding-top:8px;border-top:1px solid rgba(255,255,255,0.14);}
  .trust-pill{display:flex;align-items:center;gap:8px;font-size:13.5px;color:#E7E9FA;font-weight:600;}
  .trust-pill svg{width:16px;height:16px;flex:0 0 auto;color:#7B8CFF;}

  /* Callback form card */
  .callback-card{
    background:rgba(255,255,255,0.06);
    border:1px solid rgba(255,255,255,0.16);
    border-radius:var(--radius);
    padding:28px;
    max-width:460px;
  }
  .callback-card h3{color:#fff;font-size:16px;margin-bottom:4px;}
  .callback-card p.small{color:#C7CBED;font-size:13.5px;margin-bottom:16px;}
  .field-row{display:flex;flex-direction:column;gap:12px;margin-bottom:14px;}
  .field-row input, .field-row textarea{
    width:100%;
    padding:13px 14px;
    border-radius:8px;
    border:1px solid rgba(255,255,255,0.25);
    background:rgba(255,255,255,0.08);
    color:#fff;
    font-size:15px;
    font-family:inherit;
    resize:none;
  }
  .field-row input::placeholder, .field-row textarea::placeholder{color:#B7BBE0;}

  /* TRUST STRIP */
  .trust-strip{background:var(--cream);}
  .trust-strip .eyebrow{display:block;text-align:center;}
  .trust-strip-grid{
    display:grid;grid-template-columns:repeat(4,1fr);gap:28px;text-align:center;
  }
  @media (max-width:800px){ .trust-strip-grid{grid-template-columns:repeat(2,1fr);} }
  .trust-stat .num{font-family:"Space Grotesk",sans-serif;font-weight:700;font-size:34px;color:var(--accent);}
  .trust-stat .lbl{font-size:14.5px;color:var(--ink-muted);margin-top:4px;}

  /* SERVICES */
  .services-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:28px;margin-top:44px;}
  @media (max-width:700px){ .services-grid{grid-template-columns:1fr;} }
  .service-card{
    background:var(--white);
    border:1px solid var(--sand);
    border-radius:var(--radius);
    overflow:hidden;
    display:flex;flex-direction:column;
  }
  .service-photo{width:100%;aspect-ratio:4/3;overflow:hidden;background:var(--sand);}
  .service-photo img{width:100%;height:100%;object-fit:cover;display:block;}
  .service-card-body{padding:26px 28px 30px;display:flex;flex-direction:column;flex:1;}
  .service-icon{
    width:52px;height:52px;border-radius:12px;
    background:rgba(0,19,255,0.08);
    display:flex;align-items:center;justify-content:center;
    margin-bottom:20px;
  }
  .service-icon svg{width:26px;height:26px;color:var(--accent);}
  .service-card h3{font-size:20px;margin-bottom:10px;}
  .service-card p{color:var(--ink-muted);font-size:16px;flex:1;}
  .service-card a{
    margin-top:14px;font-weight:700;color:var(--accent);text-decoration:none;
    font-size:14.5px;display:inline-flex;align-items:center;gap:6px;
  }

  /* CHARGER BRAND STRIP */
  .charger-strip{padding:56px 0;border-top:1px solid var(--sand);border-bottom:1px solid var(--sand);}
  .charger-strip-inner{display:flex;align-items:center;justify-content:center;gap:32px;flex-wrap:wrap;text-align:left;}
  .charger-thumbs{display:flex;gap:14px;flex:0 0 auto;}
  .charger-thumb{width:96px;height:96px;border-radius:12px;overflow:hidden;border:1px solid var(--sand);flex:0 0 auto;}
  .charger-thumb img{width:100%;height:100%;object-fit:cover;display:block;}
  .charger-strip p{margin:0;color:var(--ink-muted);font-size:16px;max-width:420px;}
  .charger-strip strong{color:var(--ink);}
  @media (max-width:560px){ .charger-strip-inner{flex-direction:column;text-align:center;} .charger-strip p{max-width:100%;} }

  /* WHY US (dark) */
  .why-us{background:var(--ink-navy);color:#fff;}
  .why-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:28px;margin-top:40px;}
  @media (max-width:800px){ .why-grid{grid-template-columns:1fr;} }
  .why-item{background:rgba(255,255,255,0.05);border:1px solid rgba(255,255,255,0.12);border-radius:var(--radius);padding:26px;}
  .why-item h3{color:#fff;font-size:18px;margin-bottom:8px;}
  .why-item p{color:#C7CBED;font-size:16px;margin:0;}

  /* PROCESS */
  .process-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:32px;margin-top:44px;counter-reset:step;}
  @media (max-width:860px){ .process-grid{grid-template-columns:1fr;} }
  .step{position:relative;padding-left:56px;}
  .step .step-num{
    position:absolute;left:0;top:0;
    width:40px;height:40px;border-radius:50%;
    background:var(--accent);color:#fff;
    font-family:"Space Grotesk",sans-serif;font-weight:700;
    display:flex;align-items:center;justify-content:center;font-size:17px;
  }
  .step h3{font-size:18px;margin-bottom:8px;}
  .step p{color:var(--ink-muted);font-size:16px;margin:0;}

  /* REVIEWS */
  .reviews{background:var(--sand);}
  .reviews-inner{max-width:900px;margin:0 auto;text-align:center;}
  .review-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:36px;}
  @media (max-width:800px){ .review-cards{grid-template-columns:1fr;} }
  .review-card{
    background:var(--white);border:1px solid var(--sand);border-radius:var(--radius);
    padding:24px;text-align:left;
  }
  .review-card .stars{color:var(--accent);font-size:14px;margin-bottom:12px;letter-spacing:2px;}
  .review-card .quote{color:var(--ink);font-size:15px;margin-bottom:16px;}
  .review-card .reviewer{font-weight:700;font-size:14px;color:var(--ink);}
  .review-card .meta{font-size:12.5px;color:var(--ink-muted);margin-top:2px;}
  .review-card .source{margin-top:14px;font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:0.08em;color:var(--ink-muted);}

  /* FAQ */
  .faq-list{max-width:760px;margin:40px auto 0;}
  .faq-item{border-bottom:1px solid var(--sand);}
  .faq-q{
    width:100%;text-align:left;background:none;border:none;
    padding:22px 4px;font-family:"Space Grotesk",sans-serif;font-weight:600;
    font-size:17px;color:var(--ink);cursor:pointer;
    display:flex;align-items:center;justify-content:space-between;gap:16px;
  }
  .faq-q .plus{font-size:22px;color:var(--accent);transition:transform .2s ease;flex:0 0 auto;}
  .faq-item.open .faq-q .plus{transform:rotate(45deg);}
  .faq-a{max-height:0;overflow:hidden;transition:max-height .25s ease;}
  .faq-a p{padding:0 4px 20px;color:var(--ink-muted);font-size:16px;margin:0;}

  /* FINAL CTA */
  .final-cta{background:linear-gradient(160deg,var(--ink-navy) 0%, var(--ink-navy-2) 100%);color:#fff;text-align:center;}
  .final-cta h2{color:#fff;font-size:clamp(28px,4vw,42px);}
  .final-cta .sub{color:#D9DCF7;font-size:17px;max-width:560px;margin:0 auto 30px;}
  .final-phone{
    font-family:"Space Grotesk",sans-serif;font-weight:700;font-size:clamp(30px,5vw,44px);
    color:#fff;text-decoration:none;display:block;margin-bottom:22px;
  }
  .final-note{color:#A9AEDE;font-size:13.5px;margin-top:18px;}

  /* FOOTER */
  footer{background:#070A24;color:#9AA0D0;padding:44px 0 100px;font-size:13.5px;}
  @media (min-width:769px){ footer{padding-bottom:44px;} }
  .footer-grid{display:flex;flex-wrap:wrap;justify-content:space-between;gap:20px;}
  footer a{color:#C7CBED;text-decoration:none;}
  .footer-legal{margin-top:22px;padding-top:22px;border-top:1px solid rgba(255,255,255,0.08);}

  /* Sticky mobile call bar */
  .sticky-call{
    display:none;
  }
  @media (max-width:768px){
    .sticky-call{
      display:flex;position:fixed;bottom:0;left:0;right:0;z-index:50;
      background:var(--accent);
      padding:12px 18px;
      align-items:center;justify-content:center;gap:10px;
      box-shadow:0 -8px 24px rgba(0,0,0,0.25);
    }
    .sticky-call a{color:#fff;font-family:"Space Grotesk",sans-serif;font-weight:700;font-size:16px;text-decoration:none;display:flex;align-items:center;gap:8px;}
    body{padding-bottom:64px;}
  }
/* ================================================================
   Form state styles for builder.js — appended by wire_form.py.
   Deliberately palette-free: everything inherits the design's own
   typography/colors (only the error red is a literal, because an
   error state has to read as an error). If the design defines its
   own error/accent custom properties, swap them in below.
   ================================================================ */
.form-group { position: relative; }
.form-group .messages { display: none; }
.form-group.has-error .messages { display: block; }
.form-group.has-error input,
.form-group.has-error select,
.form-group.has-error textarea { border-color: #d64545; }
.help-block.error {
  display: block;
  margin-top: .35rem;
  font-family: inherit;
  font-size: .8125rem;
  line-height: 1.35;
  color: #d64545;
}
/* .form-group.has-success input { border-color: <design's success color>; } */

.submitButton { position: relative; }
.submitButton[disabled], button[disabled] { opacity: .65; cursor: not-allowed; }
.spinner-border.loader {
  display: inline-block;
  width: 1em;
  height: 1em;
  margin-left: .5em;
  vertical-align: -.125em;
  border: 2px solid currentColor;
  border-right-color: transparent;
  border-radius: 50%;
  animation: lpbm-spin .75s linear infinite;
}
@keyframes lpbm-spin { to { transform: rotate(360deg); } }

.thank-you-message { text-align: center; padding: 2rem 1rem; color: inherit; }
.thank-you-heading {
  font-family: inherit;
  font-size: 1.5rem;
  line-height: 1.25;
  margin: 0 0 .5rem;
  color: inherit;
}
.thank-you-content {
  font-family: inherit;
  font-size: 1rem;
  line-height: 1.6;
  margin: 0;
  color: inherit;
  opacity: .85;
}