/* GENERATED by tools/build.py from src/pages/contact.html (its style block and its style="..."
   attributes) - do not edit this file. Edit the source page, then run the build. */
  /* =========================================================================
     Page-specific: Contact
     ========================================================================= */
  /* compact navy hero with two columns: copy left, form right */
  .contact-hero{
    position:relative;overflow:hidden;
    background:
      radial-gradient(1100px 520px at 90% -10%, rgba(47,143,208,.5), transparent 60%),
      radial-gradient(900px 560px at -5% 110%, rgba(244,162,89,.14), transparent 55%),
      linear-gradient(160deg,#0d3b66 0%,#12477a 45%,#1b6ca8 100%);
    color:#fff;padding:72px 0 96px;
  }
  .contact-hero::before{
    content:"";position:absolute;inset:0;
    background-image:
      linear-gradient(rgba(255,255,255,.045) 1px,transparent 1px),
      linear-gradient(90deg,rgba(255,255,255,.045) 1px,transparent 1px);
    background-size:46px 46px;
    -webkit-mask-image:radial-gradient(80% 80% at 25% 25%,#000 30%,transparent 80%);
            mask-image:radial-gradient(80% 80% at 25% 25%,#000 30%,transparent 80%);
    pointer-events:none;
  }
  .contact-grid{position:relative;display:grid;grid-template-columns:1fr 1.05fr;gap:54px;align-items:start}
  .contact-hero .eyebrow{color:#bfe0f7}
  .contact-hero .eyebrow .dot{box-shadow:0 0 0 4px rgba(244,162,89,.28)}
  .contact-hero h1{color:#fff;font-size:2.9rem;font-weight:800;margin:18px 0 0;max-width:520px}
  .contact-hero p.sub{font-size:1.14rem;color:#d6e7f6;max-width:520px;margin:20px 0 0;line-height:1.6}
  .contact-hero p.sub strong{color:#fff;font-weight:700}
  .contact-hero p.try-note{font-size:.98rem;color:#d6e7f6;max-width:520px;margin:16px 0 0;line-height:1.6}
  .contact-hero p.try-note a{color:#fff;font-weight:700;text-decoration:underline;text-underline-offset:3px}
  .contact-hero p.try-note a:hover{color:var(--orange)}

  /* prominent direct-contact block */
  .direct{display:flex;flex-direction:column;gap:14px;margin-top:32px}
  .direct .dlabel{font-family:var(--font-head);font-weight:700;font-size:.78rem;letter-spacing:.12em;text-transform:uppercase;color:#bfe0f7}
  .direct-cards{display:flex;flex-wrap:wrap;gap:14px}
  .direct-card{
    display:flex;align-items:center;gap:14px;
    background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.16);
    border-radius:var(--radius-sm);padding:14px 18px;flex:1 1 280px;min-width:0;
    transition:background .16s ease,border-color .16s ease,transform .16s ease;
  }
  .direct-card:hover{background:rgba(255,255,255,.14);border-color:rgba(255,255,255,.4);transform:translateY(-2px)}
  .direct-card .ic{width:44px;height:44px;border-radius:12px;flex:0 0 auto;display:flex;align-items:center;justify-content:center;background:rgba(244,162,89,.16);color:var(--orange);border:1px solid rgba(244,162,89,.3)}
  .direct-card .ic svg{width:22px;height:22px}
  .direct-card .dl,.direct-card .dv{display:block}
  .direct-card .dl{font-size:.74rem;text-transform:uppercase;letter-spacing:.06em;color:#a9cbe6;font-weight:600}
  .direct-card .dv{font-family:var(--font-head);font-weight:800;font-size:1.06rem;color:#fff;margin-top:1px;word-break:break-word}

  /* form card */
  .form-card{
    background:#fff;border-radius:22px;box-shadow:var(--shadow-lg);
    color:var(--ink);padding:34px 34px 30px;border:1px solid rgba(255,255,255,.5);
    scroll-margin-top:96px;
  }
  .form-card .fc-head{margin-bottom:22px}
  .form-card .fc-head h2{font-size:1.5rem;margin-bottom:6px}
  .form-card .fc-head p{font-size:.94rem;color:var(--slate)}
  .form-card .fc-head p.req-note{font-size:.84rem;margin-top:6px}
  .form-card .req-note .req{color:#b4561a;font-weight:700}

  .field{margin-bottom:16px}
  .field label{display:block;font-family:var(--font-head);font-weight:700;font-size:.86rem;color:var(--blue-900);margin-bottom:7px}
  .field label .req{color:#b4561a;margin-left:2px}
  .field label .opt{font-family:var(--font-body);font-weight:500;color:var(--slate)}
  .field input,.field select,.field textarea{
    width:100%;font-family:var(--font-body);font-size:.96rem;color:var(--ink);
    background:var(--tint-2);border:1.5px solid var(--slate-light);border-radius:11px;
    padding:12px 14px;transition:border-color .15s ease,box-shadow .15s ease,background .15s ease;
  }
  .field input::placeholder,.field textarea::placeholder{color:var(--slate);opacity:1}
  .field input:focus,.field select:focus,.field textarea:focus{border-color:var(--blue-700);background:#fff}
  .field [aria-invalid="true"]{border-color:#c0392b;background:#fff}
  .field textarea{resize:vertical;min-height:104px}
  .field select{appearance:none;-webkit-appearance:none;background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%235a7184' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'><path d='M6 9l6 6 6-6'/></svg>");background-repeat:no-repeat;background-position:right 14px center;background-size:18px;padding-right:42px}
  .field .hint{font-size:.8rem;color:var(--slate);margin-top:6px}
  .field .field-error{font-size:.82rem;font-weight:600;color:#9a3026;margin-top:6px}
  .field .field-error[hidden]{display:none}
  .field-row{display:grid;grid-template-columns:1fr 1fr;gap:16px}

  /* honeypot: visually hidden, present for bots */
  .hp{position:absolute !important;left:-9999px !important;width:1px;height:1px;overflow:hidden}

  .form-card .consent{font-size:.84rem;color:var(--slate);margin:4px 0 18px;display:flex;gap:9px;align-items:flex-start}
  .form-card .consent svg{width:17px;height:17px;color:var(--blue-700);flex:0 0 auto;margin-top:2px}
  .form-card .consent a{color:var(--blue-700);font-weight:600;text-decoration:underline;text-underline-offset:2px}
  .form-card .btn-primary{width:100%}

  .privacy-note{font-size:.84rem;color:#cfe2f3;margin-top:20px;max-width:520px}
  .privacy-note a{color:#fff;font-weight:600;text-decoration:underline;text-underline-offset:2px}
  .privacy-note a:hover{color:var(--orange)}

  /* Banners (success / error). Without JavaScript the endpoint redirects to
     #sent or #error and :target reveals the matching banner; with JavaScript
     the page adds .show itself (and html.js switches the :target rule off). */
  .banner{display:none;border-radius:14px;padding:16px 18px;margin-bottom:22px;font-size:.95rem;gap:12px;align-items:flex-start;scroll-margin-top:96px}
  html:not(.js) .banner:target,.banner.show{display:flex}
  .banner svg{width:22px;height:22px;flex:0 0 auto;margin-top:1px}
  .banner .bt{font-family:var(--font-head);font-weight:700;display:block;margin-bottom:2px}
  .banner-success{background:#e4f7ec;border:1px solid #b6e6c8;color:#155f37}
  .banner-success svg{color:#1f9d57}
  .banner-success a{color:#0f7a44;font-weight:700;text-decoration:underline}
  .banner-error{background:#fdecea;border:1px solid #f4c7c1;color:#9a3026}
  .banner-error svg{color:#d2492f}
  .banner-error a{color:#9a3026;font-weight:700;text-decoration:underline}

  @media (min-width:981px) and (max-width:1120px){
    .field-row{grid-template-columns:1fr;gap:0}
  }
  @media (max-width:980px){
    .nav-links{display:none}
    .nav-links.open{
      display:flex;flex-direction:column;align-items:stretch;gap:0;
      position:absolute;top:78px;left:0;right:0;
      background:#fff;border-bottom:1px solid var(--border);
      padding:8px 0 14px;box-shadow:var(--shadow);
    }
    .nav-links.open a{padding:13px 40px;font-size:1rem}
    .nav-links.open a::after{display:none}
    .nav-links.open .btn{padding:12px 22px;margin:12px 40px 6px}
    .nav-toggle{display:inline-flex}
    /* Without JavaScript the menu button cannot open anything, so show the
       links as a wrapped row under the logo instead. */
    html:not(.js) .nav-toggle{display:none}
    html:not(.js) .nav-inner{height:auto;min-height:78px;flex-wrap:wrap;padding-block:12px;row-gap:4px}
    html:not(.js) .nav-links{display:flex;position:static;order:3;flex-basis:100%;flex-direction:row;flex-wrap:wrap;align-items:center;gap:2px 22px;padding:0;background:none;border:0;box-shadow:none}
    html:not(.js) .nav-links a{padding:6px 0;border:0}
    html:not(.js) .nav-links .btn{display:none}
    html:not(.js) .nav-cta .btn{display:inline-flex}
    /* that taller sticky header must not cover a #sent / #error / #contact-form target */
    html:not(.js) .banner,html:not(.js) .form-card{scroll-margin-top:170px}
    .contact-grid{grid-template-columns:1fr;gap:38px}
    .contact-hero h1{font-size:2.4rem}
    .cta-inner{padding:42px 36px}
    .cta-text h2{font-size:2rem}
    .foot-grid{grid-template-columns:1fr 1fr;gap:34px}
    .foot-brand{grid-column:1 / -1}
  }
  @media (max-width:600px){
    .wrap{padding:0 22px}
    .trust-inner{padding:18px 22px;justify-content:flex-start}
    .trust-items{justify-content:flex-start}
    .contact-hero{padding:52px 0 70px}
    .contact-hero h1{font-size:2rem}
    .contact-hero p.sub{font-size:1.04rem}
    .form-card{padding:24px 20px}
    .field-row{grid-template-columns:1fr;gap:0}
    .direct-card{flex:1 1 100%}
    .cta-inner{padding:34px 24px}
    .cta-text h2{font-size:1.7rem}
    .foot-grid{grid-template-columns:1fr;gap:30px}
    section{padding:64px 0}
  }
  @media (prefers-reduced-motion:reduce){
    html{scroll-behavior:auto}
    .btn,.direct-card,.nav-links a,.nav-links a::after,.foot-col a,.field input,.field select,.field textarea{transition:none}
    .btn:hover,.btn-primary:hover,.btn-ghost:hover,.direct-card:hover{transform:none}
  }

  /* Per-product fields. With scripting off every block is visible and the form still
     works; the script below hides the ones that do not apply to the chosen product.
     Nothing here is required, so a hidden block can never block a submission. */
  .when{display:block}
  .when[hidden]{display:none}
.s-101860af{font-size:1.2rem !important}
.s-38729897{width:36px !important}