.elementor-2739 .elementor-element.elementor-element-fgmacontactroot{--display:flex;}.elementor-2739 .elementor-element.elementor-element-fgmacontacthero{--display:flex;}.elementor-widget-heading .elementor-heading-title{font-family:var( --e-global-typography-primary-font-family ), Sans-serif;font-weight:var( --e-global-typography-primary-font-weight );color:var( --e-global-color-primary );}.elementor-2739 .elementor-element.elementor-element-fgmacontactsplit{--display:flex;}.elementor-2739 .elementor-element.elementor-element-fgmacontactmsg{--display:flex;}.elementor-2739 .elementor-element.elementor-element-fgmacontactgrid{--display:flex;}.elementor-2739 .elementor-element.elementor-element-fgmacontactoff{--display:flex;}.elementor-2739 .elementor-element.elementor-element-fgmacontactoffg{--display:flex;}.elementor-2739 .elementor-element.elementor-element-fgmacontactcta{--display:flex;}:root{--page-title-display:none;}/* Start custom CSS *//* ============================================================
FGMA CONTACT PAGE - R3.7C Batch B1
Page-scoped visual system (Elementor document Custom CSS).
Consumes existing fgmadev tokens only; adds no global CSS.
============================================================ */

/* ---- 1. ROOT / SECTION SHELL ------------------------------ */
.fgma-contact.e-con {
display: block;
inline-size: 100%;
max-inline-size: none;
margin: 0;
padding: 0;
}
.fgma-contact .e-con {
--padding-block-start: 0px;
--padding-block-end: 0px;
--padding-inline-start: 0px;
--padding-inline-end: 0px;
}
.fgma-contact > .e-con {
display: block;
inline-size: 100%;
max-inline-size: var(--fgma-content-max);
margin-inline: auto;
padding-inline: var(--fgma-gutter);
}
.fgma-contact .elementor-widget:not(:last-child) { margin-block-end: 0; }

/* ---- 2. HERO ---------------------------------------------- */
.fgma-contact-hero { padding-block-start: var(--fgma-space-component); }
.fgma-contact-hero__eyebrow.elementor-widget-heading .elementor-heading-title {
margin: 0 0 var(--fgma-space-md);
font-family: var(--fgma-font-family);
font-weight: var(--fgma-weight-book);
font-size: var(--fgma-step-0);
line-height: 1.35;
color: var(--e-global-color-v4-fgma-gray, #949494);
}
.fgma-contact-hero__title.elementor-widget-heading .elementor-heading-title {
margin: 0;
font-family: var(--fgma-font-family);
font-weight: var(--fgma-weight-medium);
font-size: var(--fgma-step-8);
line-height: 1.1;
color: var(--e-global-color-v4-fgma-black, #000);
}
@media (min-width: 768px) {
.fgma-contact-hero__title.elementor-widget-heading .elementor-heading-title { padding-inline-end: 20%; }
}

/* ---- 2B. PRODUCTION SPLIT IMAGE BAND --------------------- */
/* Layout is owned by the shared .fgma-split-images component (Customizer CSS).
This page only supplies the section rhythm, per Production (small gap under
the hero, large gap before "Send Us a Message"). */
.fgma-contact-split { padding-block-start: var(--fgma-space-2xl); }

/* ---- 3. SHARED SECTION HEADING ---------------------------- */
.fgma-contact-section-heading.elementor-widget-heading .elementor-heading-title {
margin: 0;
font-family: var(--fgma-font-family);
font-weight: var(--fgma-weight-medium);
font-size: var(--fgma-step-5);
line-height: 1.1;
color: var(--e-global-color-v4-fgma-black, #000);
}

/* ---- 4. SEND US A MESSAGE -------------------------------- */
.fgma-contact-message { padding-block-start: var(--fgma-space-component); }
.fgma-contact-message__grid.e-con {
display: grid;
grid-template-columns: minmax(0, 1fr);
gap: var(--fgma-space-2xl);
align-items: start;
inline-size: 100%;
max-inline-size: none;
margin: var(--fgma-space-xl) 0 0;
padding: 0;
}
@media (min-width: 1024px) {
.fgma-contact-message__grid.e-con {
grid-template-columns: minmax(0, 2.3fr) minmax(0, 1fr);
column-gap: var(--fgma-space-2xl);
}
}
.fgma-contact-form, .fgma-contact-directory { min-inline-size: 0; }

/* ---- 5. PR / CAREERS DIRECTORY --------------------------- */
.fgma-contact-directory__inner { display: flex; flex-direction: column; gap: var(--fgma-space-xl); }
@media (min-width: 600px) and (max-width: 1023px) {
.fgma-contact-directory__inner { flex-direction: row; }
.fgma-contact-directory__group { flex: 1 1 0; min-inline-size: 0; }
}
.fgma-contact-directory__label {
margin: 0;
font-family: var(--fgma-font-family);
font-weight: var(--fgma-weight-heavy);
font-size: var(--fgma-step-0);
line-height: 1.35;
color: var(--e-global-color-v4-fgma-black, #000);
}
.fgma-contact-directory__details { margin-block-start: var(--fgma-space-xs); }
.fgma-contact-directory__details p {
margin: 0;
font-family: var(--fgma-font-family);
font-weight: var(--fgma-weight-book);
font-size: var(--fgma-step-0);
line-height: 1.5;
color: var(--e-global-color-v4-fgma-off-black, #282828);
}
.fgma-contact-directory__details p + p { margin-block-start: 2px; }
.fgma-contact-directory__link {
color: var(--e-global-color-v4-fgma-black, #000);
text-decoration: underline;
text-decoration-thickness: 1px;
text-underline-offset: .25em;
overflow-wrap: anywhere;
transition: color .3s;
}
.fgma-contact-directory__link:hover,
.fgma-contact-directory__link:focus-visible { color: var(--e-global-color-v4-fgma-brand-red, #F21400); }

/* ---- 6. OUR OFFICES ------------------------------------- */
.fgma-contact-offices { padding-block-start: var(--fgma-space-component); }
.fgma-contact-offices__list {
display: grid;
grid-template-columns: minmax(0, 1fr);
row-gap: var(--fgma-space-xl);
column-gap: var(--fgma-space-lg);
margin: 0;
padding: 0;
list-style: none;
}
@media (min-width: 1024px) { .fgma-contact-offices__list { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.fgma-contact-offices__address {
display: block;
font-style: normal;
font-family: var(--fgma-font-family);
font-weight: var(--fgma-weight-book);
font-size: var(--fgma-step-0);
line-height: 1.5;
color: var(--e-global-color-v4-fgma-off-black, #282828);
}
.fgma-contact-offices__name { display: block; font-weight: var(--fgma-weight-heavy); color: var(--e-global-color-v4-fgma-black, #000); }
.fgma-contact-offices__lines { display: block; margin-block: var(--fgma-space-xs); }
.fgma-contact-offices__phone { display: block; }
.fgma-contact-offices__link {
color: var(--e-global-color-v4-fgma-black, #000);
text-decoration: underline;
text-decoration-thickness: 1px;
text-underline-offset: .25em;
transition: color .3s;
}
.fgma-contact-offices__link:hover,
.fgma-contact-offices__link:focus-visible { color: var(--e-global-color-v4-fgma-brand-red, #F21400); }

.fgma-contact-offices__grid.e-con {
display: grid;
grid-template-columns: minmax(0, 1fr);
align-items: start;
gap: var(--fgma-space-2xl);
inline-size: 100%;
max-inline-size: none;
margin: var(--fgma-space-xl) 0 0;
padding: 0;
}
@media (min-width: 768px) {
.fgma-contact-offices__grid.e-con { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (min-width: 1024px) {
.fgma-contact-offices__grid.e-con { grid-template-columns: minmax(0, 1fr) minmax(0, 1.5fr); }
}
.fgma-contact-offices__media, .fgma-contact-offices__list-widget { min-inline-size: 0; }
@media (min-width: 768px) {
.fgma-contact-offices__media { position: sticky; top: var(--fgma-space-2xl); }
}
.fgma-contact-offices__image {
display: block;
inline-size: 100%;
block-size: auto;
aspect-ratio: 3 / 4;
object-fit: cover;
}

/* ---- 7. CAREERS CTA CARD -------------------------------- */
.fgma-contact-cta { padding-block: var(--fgma-space-component); }
.fgma-contact-cta__card {
display: block;
padding: var(--fgma-space-xl) var(--fgma-space-lg) var(--fgma-space-lg);
background-color: var(--e-global-color-v4-fgma-brand-red, #F21400);
color: var(--e-global-color-v4-fgma-white, #FFF);
text-decoration: none;
transition: background-color .3s;
}
.fgma-contact-cta__card:hover,
.fgma-contact-cta__card:focus-visible {
background-color: var(--e-global-color-v4-fgma-red-hover, #C31400);
color: var(--e-global-color-v4-fgma-white, #FFF);
}
.fgma-contact-cta__headline {
margin: 0;
max-inline-size: var(--fgma-headline-measure);
font-family: var(--fgma-font-family);
font-weight: var(--fgma-weight-medium);
font-size: var(--fgma-step-4);
line-height: 1.2;
color: inherit;
}
.fgma-contact-cta__cta {
display: inline-flex;
align-items: center;
gap: var(--fgma-space-xs);
margin-block-start: var(--fgma-space-lg);
font-family: var(--fgma-font-family);
font-weight: var(--fgma-weight-medium);
font-size: var(--fgma-step-1);
line-height: 1.35;
color: inherit;
}
.fgma-contact-cta__cta-label { position: relative; color: inherit; }
.fgma-contact-cta__cta-label::after {
content: "";
position: absolute;
left: 0;
bottom: -.35em;
inline-size: 100%;
block-size: 1px;
background-color: currentcolor;
opacity: 0;
transform: scaleX(.01);
transform-origin: left center;
transition: transform .5s, opacity .3s;
}
.fgma-contact-cta__card:hover .fgma-contact-cta__cta-label::after,
.fgma-contact-cta__card:focus-visible .fgma-contact-cta__cta-label::after { opacity: 1; transform: scaleX(1); }
.fgma-contact-cta__cta .fgma-cta-arrow {
inline-size: 26px;
block-size: 21px;
flex-shrink: 0;
color: inherit;
transition: transform .5s cubic-bezier(.4, 0, .2, 1);
}
.fgma-contact-cta__card:hover .fgma-cta-arrow,
.fgma-contact-cta__card:focus-visible .fgma-cta-arrow { transform: translateX(8px); }

/* ---- 8. HUBSPOT EMBED LAYOUT SAFETY --------------------- */
.fgma-contact-form .hs-form-html { inline-size: 100%; max-inline-size: 100%; }
.fgma-contact-form .hs-form-html iframe { max-inline-size: 100%; }

/* ===== R3.7C-Q Fix Batch 1 ===== */
.fgma-contact{--fgma-step-6:clamp(2.0273rem,1.6357rem + 1.9579vw,4.7684rem);--fgma-pp-20p:clamp(4.75rem,-.8521rem + 20.8451vw,32.5rem);--fgma-pp-10p:clamp(2.375rem,-.4261rem + 10.4225vw,16.25rem);--fgma-pp-3xl:clamp(4.25rem,3.3036rem + 4.7321vw,10.875rem)}
/* F01/F02/F03 hero */
.fgma-contact .fgma-contact-hero__eyebrow.elementor-widget-heading .elementor-heading-title{font-size:var(--fgma-step-1);line-height:1.35}
.fgma-contact .fgma-contact-hero__title.elementor-widget-heading .elementor-heading-title{font-size:var(--fgma-step-6);line-height:1.1;max-inline-size:none}
@media (min-width:600px){.fgma-contact .fgma-contact-hero__title.elementor-widget-heading .elementor-heading-title{padding-inline-end:var(--fgma-pp-20p)}}
/* F29 message grid gap = Production gap-3xl */
@media (min-width:1024px){.fgma-contact .fgma-contact-message__grid.e-con{column-gap:var(--fgma-pp-3xl)}}
/* F09 offices grid breakpoints match Production md/lg */
@media (min-width:600px){.fgma-contact .fgma-contact-offices__grid.e-con{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}}
@media (min-width:1024px){.fgma-contact .fgma-contact-offices__grid.e-con{grid-template-columns:minmax(0,1fr) minmax(0,1.5fr)}}
/* F28 offices list gaps */
.fgma-contact .fgma-contact-offices__list{row-gap:var(--fgma-space-2xl)}
@media (min-width:1024px){.fgma-contact .fgma-contact-offices__list{column-gap:var(--fgma-pp-10p)}}
/* F27 office card typography */
.fgma-contact .fgma-contact-offices__address{font-size:var(--fgma-step-0);line-height:1.35}
.fgma-contact .fgma-contact-offices__name{font-weight:var(--fgma-weight-medium);font-size:var(--fgma-step-1);line-height:1.35}
/* F22 suppress duplicate HubSpot rich-text heading (backend content untouched) */
.fgma-contact .fgma-contact-form .hsfc-Step__Content > .hsfc-Row:first-child{display:none}
/* F23/F26 HubSpot labels */
.fgma-contact .fgma-contact-form .hsfc-FieldLabel,.fgma-contact .fgma-contact-form .hsfc-FieldLabel span,.fgma-contact .fgma-contact-form .hsfc-FieldLabel strong{font-family:var(--fgma-font-family);font-weight:var(--fgma-weight-book);font-size:var(--fgma-step-1);line-height:1.5}
.fgma-contact .fgma-contact-form .hsfc-FieldLabel__RequiredIndicator{margin-inline-start:.3em}
/* F24 HubSpot inputs */
.fgma-contact .fgma-contact-form .hsfc-TextInput,.fgma-contact .fgma-contact-form .hsfc-TextareaInput{font-family:var(--fgma-font-family);font-weight:var(--fgma-weight-book);font-size:var(--fgma-step-1);line-height:1.5;padding:10px 0 5px;height:auto;min-height:0;background-color:transparent;border-radius:0}
/* F25 HubSpot submit */
.fgma-contact .fgma-contact-form .hsfc-Button{font-family:var(--fgma-font-family);font-weight:var(--fgma-weight-medium);font-size:var(--fgma-step-0);line-height:1;padding:16px 30px;border-radius:30px;height:auto;min-height:0;width:auto}

/* ================= R3.7C-Q3 ================= */
/* Top-spacing parity: Production main has no header offset and pads the hero with
--space-5xl. DEV keeps the global header clearance on main.site-main, so the same
visual distance is reached page-scoped by subtracting that clearance. */
.fgma-contact .fgma-contact-hero{
padding-block-start: max(var(--fgma-space-2xl), calc(clamp(8.5rem, 7.125rem + 6.875vw, 18.125rem) - var(--fgma-header-height)));
}

/* Reveal cloak - active only while the page-scoped observer boots. */
@media (prefers-reduced-motion: no-preference){
html.fgma-rv-cloak .fgma-contact .fgma-contact-hero__eyebrow,
html.fgma-rv-cloak .fgma-contact .fgma-contact-hero__title,
html.fgma-rv-cloak .fgma-contact .fgma-split-images__image,
html.fgma-rv-cloak .fgma-contact .fgma-contact-section-heading,
html.fgma-rv-cloak .fgma-contact .fgma-contact-form,
html.fgma-rv-cloak .fgma-contact .fgma-contact-directory__group,
html.fgma-rv-cloak .fgma-contact .fgma-contact-offices__image,
html.fgma-rv-cloak .fgma-contact .fgma-contact-offices__item,
html.fgma-rv-cloak .fgma-contact .fgma-contact-cta__headline,
html.fgma-rv-cloak .fgma-contact .fgma-contact-cta__cta{
opacity: 0;
}
}

/* ===== R3.7C-Q4 - Closing CTA card: Production composition parity ===== */
/* Production recipe: A.cta-card.pt-2xl.px-xl.pb-xl.mt-3xl.mb-2xl */
/* > H2.header-3 (full inner width, no max-width) */
/* > DIV.flex.justify-end.mt-2xl (CTA flush right) */
.fgma-contact .fgma-contact-cta {
padding-block-start: clamp(4.25rem, 3.3036rem + 4.7321vw, 10.875rem);
padding-block-end: var(--fgma-space-2xl);
}
.fgma-contact .fgma-contact-cta__card {
display: flex;
flex-direction: column;
align-items: stretch;
padding: var(--fgma-space-2xl) var(--fgma-space-xl) var(--fgma-space-xl);
}
.fgma-contact .fgma-contact-cta__headline {
max-inline-size: none;
font-size: var(--fgma-step-5);
line-height: 1.1;
}
.fgma-contact .fgma-contact-cta__cta {
align-self: flex-end;
margin-block-start: var(--fgma-space-2xl);
}

/* ===== R3.7D.1 Contact final QA fix batch ===== */
/* Q1: PR/Careers label parity - match sibling office-name prominence (step-1 instead of body-copy step-0) */
.fgma-contact .fgma-contact-directory__label{font-size:var(--fgma-step-1);line-height:1.35}
/* Q2: visual-only required asterisk for Subject/How-did-you-hear/Message (Rows 4-6 of the real field order); no HubSpot field/validation config touched */
.fgma-contact-form .hsfc-Step__Content > .hsfc-Row:nth-child(4) .hsfc-FieldLabel::after,.fgma-contact-form .hsfc-Step__Content > .hsfc-Row:nth-child(5) .hsfc-FieldLabel::after,.fgma-contact-form .hsfc-Step__Content > .hsfc-Row:nth-child(6) .hsfc-FieldLabel::after{content:"*";margin-inline-start:.3em}
/* Q3: remove HubSpot's default boxed focus ring; keep a minimal real focus cue (underline darkens) for keyboard accessibility */
.fgma-contact-form .hsfc-TextInput:focus,.fgma-contact-form .hsfc-TextareaInput:focus{border:none !important;border-bottom:1px solid var(--e-global-color-v4-fgma-off-black,#282828) !important;box-shadow:none !important;outline:none !important}
.fgma-contact-form .hsfc-TextInput:focus-visible,.fgma-contact-form .hsfc-TextareaInput:focus-visible{border-bottom:1px solid var(--e-global-color-v4-fgma-black,#000) !important}
/* Q4: directory (PR/Careers) and office phone/email links reuse the existing sitewide red-underline .fgma-inline-link recipe instead of the plain black underline-on-hover these two classes define; the .fgma-contact ancestor gives 0,2,0 specificity so this safely wins over the existing flat 0,1,0 rules regardless of source order */
.fgma-contact .fgma-contact-directory__link,.fgma-contact .fgma-contact-offices__link{text-decoration:none;background-image:linear-gradient(var(--e-global-color-v4-fgma-brand-red,#F21400),var(--e-global-color-v4-fgma-brand-red,#F21400));background-repeat:no-repeat;background-position:left bottom;background-size:100% 1px;padding-bottom:2px;-webkit-box-decoration-break:clone;box-decoration-break:clone;transition:background-size .3s ease,color .3s ease}
.fgma-contact .fgma-contact-directory__link:hover,.fgma-contact .fgma-contact-directory__link:focus-visible,.fgma-contact .fgma-contact-offices__link:hover,.fgma-contact .fgma-contact-offices__link:focus-visible{color:var(--e-global-color-v4-fgma-brand-red,#F21400);background-size:0 1px}/* End custom CSS */