/* ----------------------------------------------------------------------------
 * Shell alignment for v3 pages.
 *
 * The site header and footer are shared Bootstrap 3 markup used by all ~143
 * marketing pages, so they are not rewritten here. This file only brings their
 * TYPOGRAPHY into line with the v3 design system, and it is loaded exclusively
 * by views/partials/v3_head.php — i.e. only on the five redesigned pages.
 * Every other page renders exactly as before.
 * -------------------------------------------------------------------------- */

/* Full v3 palette exposed globally so markup outside .v3 (the shared header and
   footer, and the .blog-article posts) can use the same tokens. */
:root{
    --v3-radius-btn:30px; --v3-radius-input:26px;
  --v3-display:"Bricolage Grotesque","Segoe UI",system-ui,-apple-system,sans-serif;
  --v3-body:"Hanken Grotesk","Segoe UI",system-ui,-apple-system,sans-serif;
  --v3-mono:"JetBrains Mono",ui-monospace,Menlo,Consolas,monospace;
  --v3-ink:#0e100b; --v3-ink-2:#171a12; --v3-ink-3:#22261b;
  --v3-lime:#e5f538; --v3-olive:#566000;
  --v3-paper:#f3f5ee; --v3-card:#ffffff;
  --v3-steel:#5d6556; --v3-steel-2:#9aa38f;
  --v3-rule:#dde2d3; --v3-rule-dark:#2c3124;
}

/* top nav */
.navbar-nav > li > a.erpnavlink,
.navbar-nav > li > a{font-family:var(--v3-body);font-weight:600;letter-spacing:.005em}
.top-header,.top-header a{font-family:var(--v3-body)}

/* footer */
footer.footer{font-family:var(--v3-body)}
footer.footer h5.headin5_amrc{font-family:var(--v3-display);font-weight:800;text-transform:uppercase;font-size:26px;line-height:1.05;letter-spacing:.005em}
footer.footer a{transition:color .15s ease}
footer.footer a:hover{color:var(--v3-lime)}

/* ----------------------------------------------------------------------------
 * Control radii.
 *
 * The legacy stylesheets set their own radii on buttons and inputs in several
 * places — style.css uses 2px on `input, button`, the shared .lerp-demo block
 * uses 6px, and individual pages use 3–5px. Normalised here to the v3 radius so
 * every control matches, rather than chasing each page.
 *
 * This file loads on every page via header.php, so these apply site-wide.
 * Selectors stay specific: no bare `button` / `input` rule.
 * -------------------------------------------------------------------------- */

/* shared demo form (features, industry, blog and pricing pages) */
.lerp-demo input[type="text"],.lerp-demo input[type="tel"],
.lerp-demo input[type="email"],.lerp-demo textarea,.lerp-demo select{
  border-radius:var(--v3-radius-input)!important;
}
.lerp-demo button,.lerp-demo .btn,.lerp-demo input[type="submit"]{
  border-radius:var(--v3-radius-btn)!important;
}

/* careers, free trial, signup and the bespoke industry pages */
.btn-register-header,.wpcf7-submit,.gradient-color,.black_btn,
.btn.lspl-form,.btn-info.btn-lg,.contact-formss .wpcf7-submit{
  border-radius:var(--v3-radius-btn)!important;
}
.contact-formss input,.contact-formss select,.contact-formss textarea,
.form-horizontal .item.form-group input,.form-horizontal .item.form-group select{
  border-radius:var(--v3-radius-input)!important;
}

/* header hamburger */
.v3-nav .navbar-toggle{border-radius:8px}

/* ---------- footer, v3 ----------
 * Shared by every page. Restyled in place - the Bootstrap 3 column structure
 * in views/footer.php is untouched so nothing else can break.
 * Fixes: the two link columns had lost their <h5> headings to comments, so
 * they read as two anonymous lists; the lists carried a hard
 * `padding-left:100px`; and the bottom bar separated policy links with bare
 * "-" text nodes.
 */
footer.footer{
  background:var(--v3-ink);color:#c6cdb9;
  border-top:1px solid var(--v3-rule-dark);
  padding-block:clamp(44px,5vw,68px) 0;font-size:15px;
}
footer.footer h5.headin5_amrc{
  font-family:var(--v3-display);font-weight:800;text-transform:uppercase;
  font-size:22px;line-height:1.08;letter-spacing:-.005em;color:#fff;
  margin:0 0 20px;
}
/* the company name is the anchor of the block, so it stays larger */
footer.footer .col-md-4:first-child h5.headin5_amrc{font-size:25px;max-width:16ch}
/* column headings sit on the same baseline as the company name */
footer.footer h5.ftr-col-h{
  font-family:var(--v3-mono);font-weight:400;font-size:11.5px;
  letter-spacing:.1em;color:var(--v3-steel-2);
  padding-bottom:12px;border-bottom:1px solid var(--v3-rule-dark);
}

footer.footer .lft-box{display:grid;gap:4px;margin-top:4px}
footer.footer .lft-box > div{float:none;display:flex;align-items:flex-start;gap:10px}
footer.footer .lft-box i{color:var(--v3-lime);margin-top:7px;width:16px;flex:none;text-align:center}
footer.footer .lft-box p{margin:0;padding:6px 0;line-height:1.45;color:#c6cdb9}
footer.footer .lft-box a{color:#e8ecdf!important;margin-right:0!important}

/* was padding-left:100px, which pushed both lists off their column */
footer.footer .right-footer .footer_ul_amrc{padding-left:0;padding-top:0;margin:0;list-style:none}
footer.footer .footer_ul_amrc li{margin:0}
footer.footer .footer_ul_amrc li a{
  color:#c6cdb9;display:block;padding:7px 0;line-height:1.45;
}
footer.footer .footer_ul_amrc li a:hover{color:var(--v3-lime);text-decoration:none}
footer.footer a{color:#c6cdb9}
footer.footer a:hover{color:var(--v3-lime);text-decoration:none}

/* social: real round buttons rather than bare glyphs */
footer.footer .mobile-social-links{
  display:flex;gap:10px;list-style:none;padding:0;
  margin:clamp(24px,3vw,36px) 0 0;
}
footer.footer .mobile-social-links li{margin:0}
footer.footer .mobile-social-links li a{
  width:42px;height:42px;border-radius:50%;
  border:1px solid var(--v3-rule-dark);background:var(--v3-ink-2);
  color:#c6cdb9;transition:background .15s ease,border-color .15s ease,color .15s ease;
}
footer.footer .mobile-social-links li a:hover{
  background:var(--v3-lime);border-color:var(--v3-lime);color:var(--v3-ink);
}
footer.footer .mobile-social-links .fa-2x{font-size:18px}

/* bottom bar */
footer.footer .copyrght,
footer.footer .bottom-footer{font-size:13px!important;color:#8b937d!important}
footer.footer .copyrght a{color:#c6cdb9!important}
footer.footer .bottom-footer{
  display:flex;flex-wrap:wrap;gap:6px 20px;justify-content:flex-end;
  list-style:none;padding:0;margin:0;text-align:right!important;
}
footer.footer .bottom-footer li a{color:#8b937d;padding:6px 0!important}
footer.footer .bottom-footer li a:hover{color:var(--v3-lime)}

@media (max-width:991px){
  footer.footer .right-footer{margin-top:32px}
}
@media (max-width:767px){
  footer.footer .bottom-footer{justify-content:center;text-align:center!important}
  footer.footer .mobile-social-links{justify-content:flex-start;margin-top:28px!important}
}

/* style.css:9602 sets `position:relative; top:40px` on the footer, which
   pushed it 40px down the page and left a white band of body background
   between the last section and it. */
footer.footer{position:static;top:auto}
/* the site ground is paper, not the browser default white */
body{background:var(--v3-paper)}

/* footer logo above the legal company name */
footer.footer .ftr-logo{display:inline-block;margin:0 0 18px;line-height:0}
footer.footer .ftr-logo img{width:170px;height:auto;max-width:100%}
footer.footer .col-md-4:first-child h5.headin5_amrc{
  font-size:15px;font-family:var(--v3-body);font-weight:600;
  text-transform:none;letter-spacing:0;color:#c6cdb9;margin:0 0 16px;max-width:none;
}
/* the icons sat 36px below the address with nothing in between */
footer.footer .mobile-social-links{margin-top:20px}

/* The footer columns inherit `text-align:center` from legacy CSS; every other
   child overrides it individually, so the inline-block logo was the one thing
   left centred. Set the columns left once and make the logo a block. */
footer.footer .col-md-4{text-align:left}
footer.footer .ftr-logo{display:block;width:max-content;max-width:100%}

/* style.css gives `.foote_bottom_ul_amrc_policy li a` a 20px side margin, so
   each 42px social button sat inside an 82px li. Spacing comes from the
   flex gap on the list instead. */
footer.footer .mobile-social-links li a{margin:0}
/* the social list lives in its own .row, outside the column, so it misses
   Bootstrap's 15px gutter and sat 15px left of everything above it */
footer.footer .mobile-social-links{padding-left:15px}
footer.footer .bottom-footer li a{margin:0}