/*
Theme Name: Push Button Child Theme
Theme URI: https://thinkpb.com
Version: 1.0
Description: Push Button Web Design theme framework.
Author: Push Button Web Design
Author URI: https://thinkpb.com
template: bb-theme
*/

/* Add your custom styles here... */ 

:root {
	--crimson: #A6192E;
	--crimson-deep: #950E09;
	--black: #111111;
	--ink: #1A1A1A;
	--grey-700: #444447;
	--grey-600: #6e6e73;
	--grey-500: #888888;
	--grey-300: #cfcfcf;
	--grey-250: #e5e5e5;
	--grey-200: #ECECEC;
	--grey-100: #f4f4f5;
	--warm: #f7f6f4;
	--white: #ffffff;
	--font-display: 'Montserrat','Open Sans',system-ui,sans-serif;
	--font-sans: 'Open Sans',system-ui,sans-serif;
	--container: 1180px;
	--focus-ring: 0 0 0 3px rgba(166,25,46,0.35);
	--ease: cubic-bezier(0.4,0,0.2,1);
	

	/* Fluid: 480px → 1280px (1rem = 10px on this site) */
	  --text-heading-1:   clamp(3.4rem, 2.32rem + 2.25vw, 5.2rem);   /* 34 → 52 */
	  --text-heading-2:   clamp(3.2rem, 2.12rem + 2.25vw, 5rem);     /* 32 → 50 */
	  --text-heading-2-2: clamp(3rem, 2.04rem + 2vw, 4.6rem);        /* 30 → 46 */
	  --text-heading-2-3: clamp(2.8rem, 2.08rem + 1.5vw, 4rem);      /* 28 → 40 */
	  --text-heading-3:   clamp(2.4rem, 2.04rem + 0.75vw, 3rem);     /* 24 → 30 */
	  --text-body:        clamp(2.2rem, 1.84rem + 0.75vw, 2.8rem);   /* 22 → 28 */
	  --text-display:     clamp(2.1rem, 1.8rem + 0.625vw, 2.6rem);   /* 21 → 26 */
	  --text-heading-3-2: clamp(1.7rem, 1.58rem + 0.25vw, 1.9rem);   /* 17 → 19 */
	  --text-body-2:      clamp(1.6rem, 1.54rem + 0.125vw, 1.7rem);  /* 16 → 17 */
	  --text-body-3:      clamp(1.6rem, 1.57rem + 0.0625vw, 1.65rem);/* 16 → 16.5 */

	  /* Static */
	  --text-body-4:    1.6rem;  /* 16 */
	  --text-link:      1.55rem; /* 15.5 */
	  --text-link-2:    1.5rem;  /* 15 */
	  --text-link-3:    1.45rem; /* 14.5 */
	  --text-link-4:    1.4rem;  /* 14 */
	  --text-caption:   1.3rem;  /* 13 */
	  --text-heading-5: 1.2rem;  /* 12 */
	  --text-caption-2: 1.15rem; /* 11.5 */
	  --text-caption-3: 1.1rem;  /* 11 */

}
:focus-visible {
	outline: none;
	box-shadow: var(--focus-ring);
}

::selection {
	background: var(--crimson);
	color: #fff;
}
body {
	font-family: var(--font-sans);
	font-size: var(--text-body-4);
	color: var(--ink);
	background: var(--warm);
	line-height: 1.7;
	-webkit-font-smoothing: antialiased;
}

.fl-page-content {
    background-color: var(--warm);
}
/* Semantic typography */
h1 {
  font-size: var(--text-heading-1);
}

h2 {
  font-size: var(--text-heading-2);
}

h3 {
  font-size: var(--text-heading-3);
}

h4 {
  font-size: var(--text-heading-3-2);
}

h5 {
  font-size: var(--text-heading-5);
}

h6 {
  font-size: var(--text-caption);
}

.hero h1 {
    font-weight: 800;
    line-height: 1.06;
    letter-spacing: -0.026em;
    max-width: 17ch;
    text-wrap: balance;
}

.hero-what p {
	font-size: var(--text-body-2);
    max-width: 44ch;
}
/* Utility classes */
.text-heading-1 {
  font-size: var(--text-heading-1);
}

.text-heading-2 {
  font-size: var(--text-heading-2);
}

.text-heading-2-2 {
  font-size: var(--text-heading-2-2);
}

.text-heading-2-3 {
  font-size: var(--text-heading-2-3);
}

.text-heading-3 {
  font-size: var(--text-heading-3);
}

.text-heading-3-2 {
  font-size: var(--text-heading-3-2);
}

.text-heading-5 {
  font-size: var(--text-heading-5);
}

.text-body {
  font-size: var(--text-body);
}

.text-body-2 {
  font-size: var(--text-body-2);
}

.text-body-3 {
  font-size: var(--text-body-3);
}

.text-body-4 {
  font-size: var(--text-body-4);
}

.text-display {
  font-size: var(--text-display);
}

.text-link {
  font-size: var(--text-link);
}

.text-link-2 {
  font-size: var(--text-link-2);
}

.text-link-3 {
  font-size: var(--text-link-3);
}

.text-link-4 {
  font-size: var(--text-link-4);
}

.text-caption {
  font-size: var(--text-caption);
}

.text-caption-2 {
  font-size: var(--text-caption-2);
}

.text-caption-3 {
  font-size: var(--text-caption-3);
}
#header > .fl-row-content-wrap {
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
}
#header nav {
    display: flex;
    align-items: center;
}
#header nav .fl-menu-horizontal {
	gap: 24px;	
}
.fl-builder-content .fl-button:is(a, button), .fl-builder-content a.fl-button:visited {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	padding: 15px 28px;
	transition: all .18s var(--ease);
}
.fl-builder-content .btn-ghost-w .fl-button:is(a, button), .fl-builder-content .btn-ghost-w a.fl-button:visited {
	background: transparent;
    color: #fff;
    box-shadow: inset 0 0 0 1.5px rgba(255, 255, 255, 0.5);
}

.fl-builder-content .btn-ghost-w .fl-button:is(a, button):hover {
    box-shadow: inset 0 0 0 1.5px #fff;
}

.fl-builder-content .btn-outline .fl-button:is(a, button), .fl-builder-content .btn-ghost-w a.fl-button:visited {
	background: transparent;
    box-shadow: inset 0 0 0 1.5px var(--crimson);
}
.fl-builder-content .btn-outline .fl-button:is(a, button) span, .fl-builder-content .btn-ghost-w a.fl-button:visited span {
	color: var(--crimson);
}
.fl-builder-content .btn-outline .fl-button:is(a, button):hover {
	background: var(--crimson);
	color: #fff;
}
.fl-builder-content .btn-outline .fl-button:is(a, button):hover span {
	color: #fff;
}
.breadcrumbs > span {
    display: flex;
    gap: 8px;
    align-items: center;
}
.breadcrumbs {	
    font-size: 13px;
    color: var(--grey-600);
}

.breadcrumbs a:hover {
	text-decoration: none;
}
.nav-phone a {
    font-size: 14px;
    color: var(--grey-600);
    font-weight: 600;
}
.nav-phone a:hover {
	color: var(--crimson);
}
.fl-builder-content[data-type="header"] {
    position: relative;
    z-index: 100;
}
#menu-main-menu > .menu-item >a::after {
    content: "";
    position: absolute;
    left: 0;
    right: 100%;
    bottom: 0;
    height: 2px;
    background: var(--crimson);
    transition: right .2s var(--ease);
}
#menu-main-menu > .menu-item > a:hover::after {
    right: 0;
}
.fl-module-menu #menu-main-menu .sub-menu > li.current-menu-item > a {
	background: none;
	color: inherit;
}
.fl-module-menu #menu-main-menu .sub-menu > li.current-menu-item > a:hover {
	background-color: rgba(164, 25, 45, 0.1);
    color: var(--fl-global-crimson);
}
.red-text {
	color: var(--crimson) !important;
}
.card-loop .fl-loop-item .instrument-type-card{
	border: 1px solid var(--grey-250);
    background: #fff;
	transition: all .2s var(--ease);
}
.card-loop .fl-loop-item .instrument-type-card:hover {
	border-color: var(--crimson) !important;
    box-shadow: 0 18px 40px -24px rgba(0, 0, 0, 0.25);
    transform: translateY(-3px);
}

.instrument-type-card img {
	overflow: hidden;
	mix-blend-mode: multiply;
}
.box-caption {
    position: relative;
}
.box-caption .fl-photo-caption-below {
    position: absolute;
    left: 0;
    bottom: 0;
    background: var(--crimson);
    color: #fff;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    padding: 9px 16px;
    text-overflow: initial;
}

.proof-line {
    font-weight: 700;
    letter-spacing: -0.015em;
    max-width: 32ch;
    line-height: 1.3;
}
.logo-gird img {
	max-height: 54px !important;
	width: 160px !important;
	object-fit: contain;
	mix-blend-mode: multiply;
	filter: grayscale(100%);
    opacity: 0.45;
    transition: all .2s;
}
.logo-gird img:hover {
	filter: none;
	opacity: 1;
}

.fas.fa-rotate-by {
    --fa-rotate-angle: -45deg;
}
.fl-builder-content .fl-button .button-icon {
    font-size: 14px;
    margin-left: 4px !important;
}

.phero {
    line-height: 1.06;
    letter-spacing: -0.025em;
    max-width: 17ch;
}
.phero-lede p {
    font-size: var(--text-body-2);
    line-height: 1.65;
    max-width: 62ch;
}
.instrument-description p {
	max-width: 56ch;
}

.application_list .typical-applications {
    font-size: 13.5px;
    color: var(--grey-600);
    line-height: 1.75;
    padding: 0;
}
.application_list .typical-applications span {
    display: block;
}

.application-pills .typical-applications {
    display: flex;
    flex-wrap: wrap;
    gap: 9px;
}

.application-pills .typical-applications span {
    font-size: 14px;
    font-weight: 600;
    padding: 9px 15px;
    border: 1px solid var(--grey-250);
    background: #fff;
}
.application-list-card {
	border-top: 3px solid var(--crimson) !important;
}
.fl-loop-item:last-child .instrument-row {
	border-bottom: 0;
}

.instrument-stats {
    display: flex;
    flex-wrap: wrap;
    gap: 0;
	border-top: 1px solid var(--grey-250);
}
.instrument-value {
    font-family: var(--font-display);
    font-size: 20px;
    font-weight: 800;
    line-height: 1.1;
}
.instrument-label {
    display: block;
    font-size: 12px;
    color: var(--grey-600);
    margin-top: 3px;
}
.instrument-stats-details {
    padding: 16px;
    border-right: 1px solid var(--grey-250);
}

.instrument-stats-details:first-child {
	padding-left:0;
}
.instrument-stats-details:last-child {
	border-right: 0;
}

.optlist {
    columns: 2;
    column-gap: 48px;
    font-size: 15.5px;
    color: var(--grey-700);
    line-height: 1.5;
	padding: 0;
}
.optlist li {
    break-inside: avoid;
    padding: 9px 0;
    border-bottom: 1px solid var(--grey-250);
    list-style: none;
}

.specs {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 0 56px;
}

.specs div {
    display: grid;
    grid-template-columns: 210px 1fr;
    gap: 20px;
    padding: 15px 0;
    border-bottom: 1px solid var(--grey-250);
    font-size: 15.5px;
    align-items: baseline;
}
.specs dt {
    font-size: 11.5px;
    font-weight: 700;
    letter-spacing: 0.09em;
    text-transform: uppercase;
    color: var(--grey-600);
}
.specs dd {
    color: var(--grey-700);
}
.specs dd.tbc {
    color: var(--crimson);
    font-style: italic;
}
.dl {
    display: grid;
    gap: 1px;
    background: var(--grey-250);
    border: 1px solid var(--grey-250);
}
.dl a {
    background: #fff;
    padding: 20px 24px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 20px;
    transition: background .18s var(--ease);
}
.dl a:hover {
    background: var(--warm);
	color: inherit;
	text-decoration: none;
}
.dl .t {
    font-weight: 700;
    font-size: 15.5px;
}
.dl .m {
    font-size: 13px;
    color: var(--grey-600);
    white-space: nowrap;
	text-transform: uppercase;
}

.sec-sub p {
    font-size: 16px;
    color: var(--grey-600);
    max-width: 60ch;
    line-height: 1.65;
}

.tollfree {
    font-family: var(--font-display);
    font-size: clamp(24px, 2.6vw, 30px);
    font-weight: 800;
    letter-spacing: -0.02em;
    display: block;
}
.opts {
    list-style: none;
    margin-top: 14px;
	padding: 0;
}
.opts li {
    display: flex;
    gap: 14px;
    align-items: baseline;
    padding: 10px 0;
    border-top: 1px solid var(--grey-250);
    font-size: 15px;
    color: var(--grey-700);
}
.opts .k {
    font-family: var(--font-display);
    font-size: 15px;
    font-weight: 800;
    color: var(--crimson);
    min-width: 20px;
}
.rail-split {
    padding-top: 24px;
    border-top: 1px solid var(--grey-250);
    display: grid;
    gap: 18px;
}
.rail-split div {
    display: grid;
    gap: 3px;
}
.rail-split dt {
    font-size: 11.5px;
    font-weight: 700;
    letter-spacing: 0.09em;
    text-transform: uppercase;
    color: var(--grey-600);
}
.rail-split dd {
    font-size: 15.5px;
    color: var(--grey-700);
}
.rail-split dd a {
    font-weight: 600;
}
.support-card address {
    font-style: normal;
    font-size: 15px;
    color: var(--grey-700);
    line-height: 1.6;
    margin-bottom: 14px;
}
.support-card dl {
    display: grid;
    grid-template-columns: auto 1fr;
    gap: 6px 16px;
    font-size: 14.5px;
    margin-bottom: 12px;
}
.support-card dt {
    font-size: 11.5px;
    font-weight: 700;
    letter-spacing: 0.09em;
    text-transform: uppercase;
    color: var(--grey-600);
    align-self: center;
}
.support-card dd a {
    font-weight: 600;
    color: var(--crimson);
}
.support-card .role {
    font-size: 13.5px;
    color: var(--grey-600);
    margin-bottom: 10px;
}
.where-we-are .support-card dd a {
	color: var(--grey-700);
}
.where-we-are .support-card dd a:hover {
	color: var(--crimson);
}
.cat {
    border: 1px solid var(--grey-250);
    border-top: 3px solid var(--crimson);
    background: #fff;
    padding: 28px 30px;
    display: flex;
    flex-direction: column;
    gap: 10px;
    transition: background .18s var(--ease);
}
.cat:hover {
    background: var(--warm);
}
.cat img {
    width: 100%;
    aspect-ratio: 4 / 3;
    object-fit: contain;
    background: var(--warm);
    mix-blend-mode: multiply;
}
.cat .go {
    font-size: 14px;
    font-weight: 700;
    color: var(--crimson);
    margin-top: auto;
}
.cat ul {
    list-style: none;
	padding: 0;
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}
.cat li {
    font-size: 12.5px;
    color: var(--grey-600);
    border: 1px solid var(--grey-250);
    padding: 4px 9px;
}
.cat .n {
    font-size: 13px;
    font-weight: 700;
    color: var(--crimson);
    margin-top: auto;
    padding-top: 10px;
}
.software-list .dl a {
    display: flex;
    justify-content: flex-start;
    align-items: flex-start;
    flex-direction: column;
	gap: 4px;
}
.software-list .dl .m {
	white-space: normal;
}
.opt {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 22px;
}

.opt .inlet {
    border: 1px solid var(--grey-250);
    background: #fff;
    display: flex;
    flex-direction: column;
}
.opt img {
    width: 100%;
    height: 180px;
    object-fit: contain;
    background: #fff;
    padding: 14px;
    border-bottom: 1px solid var(--grey-250);
}
.opt .inlet-caption {
    padding: 18px 20px;
}
.opt h3 {
    font-family: var(--font-display);
    font-size: 16px;
    font-weight: 800;
    line-height: 1.25;
}
.opt p {
    font-size: 14px;
    color: var(--grey-600);
    line-height: 1.6;
    margin-top: 6px;
}
.ev {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 34px;
}
.ev .ev-details {
    border: 1px solid var(--grey-250);
    background: #fff;
}
.ev img {
    width: 100%;
    display: block;
    border-bottom: 1px solid var(--grey-250);
}
.ev .ev-caption {
    padding: 18px 22px;
    font-size: 14px;
    color: var(--grey-700);
    line-height: 1.6;
}
.red-dot {
	display: block;
	width: 8px;
    height: 8px;
    border-radius: 50%;
    background: rgb(224, 54, 79);
    box-shadow: rgba(224, 54, 79, 0.25) 0px 0px 0px 4px;
}
/* Homepage */

/* Footer */

.gform-theme--framework.gform-theme--framework {
  /* Brand Colors */
  --gf-color-primary: var(--crimson);
  --gf-color-primary-rgb: 166, 25, 46;
  --gf-color-primary-contrast: var(--white);
  --gf-color-primary-darker: var(--crimson-deep);
  --gf-color-primary-lighter: #c4344a;
  --gf-color-secondary-contrast: var(--ink);

  /* Surfaces & Text */
  --gf-color-out-ctrl-dark-darker: var(--ink);
  --gf-color-out-ctrl-dark: var(--grey-600);
  --gf-color-in-ctrl-contrast: var(--ink);
  --gf-color-in-ctrl-primary: var(--crimson);
  --gf-color-in-ctrl-primary-contrast: var(--white);
  --gf-color-in-ctrl-primary-darker: var(--crimson-deep);

  /* Typography */
  --gf-font-family-base: var(--font-sans);
  --gf-ctrl-font-family: var(--font-sans);
  --gf-ctrl-font-size: 17px;
  --gf-ctrl-color: var(--ink);
  --gf-ctrl-placeholder-color: var(--grey-600);

  /* Labels — uppercase, tracked, muted grey */
  --gf-ctrl-label-font-family-primary: var(--font-sans);
  --gf-ctrl-label-font-size-primary: 11.5px;
  --gf-ctrl-label-font-weight-primary: 700;
  --gf-ctrl-label-letter-spacing-primary: 0.09em;
  --gf-ctrl-label-line-height-primary: 1.4;
  --gf-ctrl-label-color-primary: var(--grey-600);
  --gf-ctrl-label-color-req: var(--crimson);

  /* Descriptions / counters / helper text */
  --gf-ctrl-desc-color: var(--grey-600);
  --gf-ctrl-desc-font-size: 14px;

  /* Form Layout */
  --gf-form-gap-x: 20px;
  --gf-form-gap-y: 24px;

  /* Inputs & Controls — white, square, grey border */
  --gf-ctrl-size: 50px;
  --gf-ctrl-size-sm: 50px;
  --gf-ctrl-size-md: 50px;
  --gf-ctrl-size-lg: 50px;
  --gf-ctrl-size-xl: 50px;
  --gf-ctrl-padding-x: 16px;
  --gf-ctrl-radius: 0;
  --gf-ctrl-border-width: 1px;
  --gf-ctrl-bg-color: var(--white);
  --gf-ctrl-border-color: var(--grey-500);
  --gf-ctrl-border-color-hover: var(--ink);
  --gf-ctrl-border-color-focus: var(--ink);
  --gf-ctrl-shadow: none;
  --gf-ctrl-outline-color-focus: rgba(166, 25, 46, 0.15);
  --gf-ctrl-textarea-height: 155px;
  --gf-ctrl-multiselect-selected-item-bg-color: var(--crimson);
  --gf-ctrl-multiselect-selected-item-color: var(--white);
  --gf-form-spinner-fg-color: var(--white);
  --gf-form-spinner-bg-color: rgba(166, 25, 46, 0.1);
  --gf-ctrl-file-zone-icon-color: var(--crimson);
  --gf-ctrl-file-prog-bar-bg-color-loading: var(--crimson);

  /* Checkboxes & Radios */
  --gf-ctrl-choice-check-color: var(--crimson);
  --gf-field-img-choice-card-check-ind-bg-color: var(--crimson);

  /* Buttons – Primary (square crimson, bold white) */
  --gf-ctrl-btn-font-family: var(--font-sans);
  --gf-ctrl-btn-font-size: 17px;
  --gf-ctrl-btn-font-weight: 700;
  --gf-ctrl-btn-radius: 0;
  --gf-ctrl-btn-padding-x: 56px;
  --gf-ctrl-btn-size: 46px;
  --gf-ctrl-btn-bg-color-primary: var(--crimson);
  --gf-ctrl-btn-bg-color-hover-primary: var(--crimson-deep);
  --gf-ctrl-btn-color-primary: var(--white);
  --gf-ctrl-btn-color-hover-primary: var(--white);

  /* Multi-page & Progress */
  --gf-field-pg-prog-bar-bg-color: var(--crimson);
  --gf-field-pg-prog-bar-bg-color-blue: var(--crimson);
  --gf-field-pg-steps-number-bg-color-complete: var(--crimson);
  --gf-field-pg-steps-number-border-color-active: var(--crimson);
  --gf-field-pg-steps-number-border-color-complete: var(--crimson);
  --gf-field-pg-steps-number-color-active: var(--crimson);
  --gf-field-pg-steps-number-color-complete: var(--white);
}

/* Things the CSS API has no token for */
.gform-theme--framework .gfield_label,
.gform-theme--framework .gform-field-label {
  text-transform: uppercase;
}

.gform-theme--framework .charleft {
  text-align: right;
  color: var(--grey-600);
  font-size: 14px;
}
.ginput_counter.gfield_description {
    text-align: right;
}


.gform-theme--framework .gfield_label, .gform-theme--framework .gform-field-label {
    text-transform: uppercase;
	--gf-local-color: var(--grey-600);
}
.gform_confirmation_message {
    background: #fff;
    display: flex;
    flex-direction: column;
    gap: 10px;
    padding-top: 32px;
    padding-right: 34px;
    padding-bottom: 32px;
    padding-left: 34px;
    border: 1px solid var(--grey-250);
}
/*** Responsive Styles ***/
@media(max-width: 1400px){}
@media(max-width: 1200px){}
@media(min-width: 1201px) and (max-width: 1400px){}
@media(max-width: 992px){
	/* Useful Classes */
	.md-show{display: block !important;}
	.md-br-none br{display: none !important;}
	.specs {
		grid-template-columns: 1fr;
		gap: 0;
	}
	.optlist {
        columns: 1;
    }
	#header nav {
		justify-content: center;
	}
	#header nav .fl-menu-horizontal:before,
	#header nav .fl-menu-horizontal:after {
		display: none;
	}
	/* Homepage */
	
	/* Innerpage */
	
	/* Footer */
}
@media(max-width: 768px){
	/* Useful Classes */
	.sm-show{display: block !important;}
	ol.column-3, ul.column-3{
		columns: 2;
		-webkit-columns: 2;
		-moz-columns: 2;
	}
	.specs div {
		grid-template-columns: 1fr;
		gap: 4px;
	}
	.ev, .opt {
		grid-template-columns: 1fr;
	}
	#mobile-menu .fl-menu .sub-menu {
        background-color: #fff;
		padding: 0;
		min-width: min-content;
    }
	#mobile-menu .menu li.fl-has-submenu ul.sub-menu li a {
		padding: 10px 16px;
	}
}
@media(max-width: 480px){
	ol.column-2, ul.column-2,
	ol.column-3, ul.column-3{
		columns: 1;
		-webkit-columns: 1;
		-moz-columns: 1;
	}
	#header nav .fl-menu-horizontal {
		gap: 12px;
	}
}