.elementor-1640 .elementor-element.elementor-element-b6bc433{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--gap:16px 16px;--row-gap:16px;--column-gap:16px;--padding-top:190px;--padding-bottom:90px;--padding-left:40px;--padding-right:40px;}.elementor-1640 .elementor-element.elementor-element-b6bc433:not(.elementor-motion-effects-element-type-background), .elementor-1640 .elementor-element.elementor-element-b6bc433 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:var( --e-global-color-ffbg );}.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-1640 .elementor-element.elementor-element-0dc400a .elementor-heading-title{font-family:"Space Grotesk", Sans-serif;font-size:clamp(32px, 3.125vw, 60px);font-weight:700;line-height:1.2em;color:var( --e-global-color-accent );}.elementor-1640 .elementor-element.elementor-element-55699a3{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--gap:0px 0px;--row-gap:0px;--column-gap:0px;--padding-top:120px;--padding-bottom:120px;--padding-left:40px;--padding-right:40px;}.elementor-1640 .elementor-element.elementor-element-55699a3:not(.elementor-motion-effects-element-type-background), .elementor-1640 .elementor-element.elementor-element-55699a3 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-image:url("https://ferfier.com/wp-content/uploads/2026/09/contact-strands.webp");background-position:center center;background-repeat:no-repeat;background-size:cover;}.elementor-1640 .elementor-element.elementor-element-eeb85b7{--display:flex;--flex-direction:row;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--align-items:center;--gap:0px 50px;--row-gap:0px;--column-gap:50px;border-style:solid;--border-style:solid;border-width:1px 1px 1px 1px;--border-top-width:1px;--border-right-width:1px;--border-bottom-width:1px;--border-left-width:1px;border-color:#000000;--border-color:#000000;--border-radius:50px 50px 50px 50px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-1640 .elementor-element.elementor-element-eeb85b7:not(.elementor-motion-effects-element-type-background), .elementor-1640 .elementor-element.elementor-element-eeb85b7 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:rgba(255,255,255,0.01);}.elementor-1640 .elementor-element.elementor-element-c321ae7{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--gap:0px 0px;--row-gap:0px;--column-gap:0px;--padding-top:50px;--padding-bottom:50px;--padding-left:50px;--padding-right:50px;}.elementor-widget-form .elementor-field-group > label, .elementor-widget-form .elementor-field-subgroup label{color:var( --e-global-color-text );}.elementor-widget-form .elementor-field-group > label{font-family:var( --e-global-typography-text-font-family ), Sans-serif;font-weight:var( --e-global-typography-text-font-weight );}.elementor-widget-form .elementor-field-type-html{color:var( --e-global-color-text );font-family:var( --e-global-typography-text-font-family ), Sans-serif;font-weight:var( --e-global-typography-text-font-weight );}.elementor-widget-form .elementor-field-group .elementor-field{color:var( --e-global-color-text );}.elementor-widget-form .elementor-field-group .elementor-field, .elementor-widget-form .elementor-field-subgroup label{font-family:var( --e-global-typography-text-font-family ), Sans-serif;font-weight:var( --e-global-typography-text-font-weight );}.elementor-widget-form .elementor-button{font-family:var( --e-global-typography-accent-font-family ), Sans-serif;font-weight:var( --e-global-typography-accent-font-weight );text-transform:var( --e-global-typography-accent-text-transform );}.elementor-widget-form .e-form__buttons__wrapper__button-next{background-color:var( --e-global-color-accent );}.elementor-widget-form .elementor-button[type="submit"]{background-color:var( --e-global-color-accent );}.elementor-widget-form .e-form__buttons__wrapper__button-previous{background-color:var( --e-global-color-accent );}.elementor-widget-form .elementor-message{font-family:var( --e-global-typography-text-font-family ), Sans-serif;font-weight:var( --e-global-typography-text-font-weight );}.elementor-widget-form .e-form__indicators__indicator, .elementor-widget-form .e-form__indicators__indicator__label{font-family:var( --e-global-typography-accent-font-family ), Sans-serif;font-weight:var( --e-global-typography-accent-font-weight );text-transform:var( --e-global-typography-accent-text-transform );}.elementor-widget-form{--e-form-steps-indicator-inactive-primary-color:var( --e-global-color-text );--e-form-steps-indicator-active-primary-color:var( --e-global-color-accent );--e-form-steps-indicator-completed-primary-color:var( --e-global-color-accent );--e-form-steps-indicator-progress-color:var( --e-global-color-accent );--e-form-steps-indicator-progress-background-color:var( --e-global-color-text );--e-form-steps-indicator-progress-meter-color:var( --e-global-color-text );}.elementor-widget-form .e-form__indicators__indicator__progress__meter{font-family:var( --e-global-typography-accent-font-family ), Sans-serif;font-weight:var( --e-global-typography-accent-font-weight );text-transform:var( --e-global-typography-accent-text-transform );}.elementor-1640 .elementor-element.elementor-element-93da194 .elementor-field-group{padding-right:calc( 10px/2 );padding-left:calc( 10px/2 );margin-bottom:10px;}.elementor-1640 .elementor-element.elementor-element-93da194 .elementor-form-fields-wrapper{margin-left:calc( -10px/2 );margin-right:calc( -10px/2 );margin-bottom:-10px;}.elementor-1640 .elementor-element.elementor-element-93da194 .elementor-field-group.recaptcha_v3-bottomleft, .elementor-1640 .elementor-element.elementor-element-93da194 .elementor-field-group.recaptcha_v3-bottomright{margin-bottom:0;}body.rtl .elementor-1640 .elementor-element.elementor-element-93da194 .elementor-labels-inline .elementor-field-group > label{padding-left:0px;}body:not(.rtl) .elementor-1640 .elementor-element.elementor-element-93da194 .elementor-labels-inline .elementor-field-group > label{padding-right:0px;}body .elementor-1640 .elementor-element.elementor-element-93da194 .elementor-labels-above .elementor-field-group > label{padding-bottom:0px;}.elementor-1640 .elementor-element.elementor-element-93da194 .elementor-field-type-html{padding-bottom:0px;}.elementor-1640 .elementor-element.elementor-element-93da194 .elementor-field-group .elementor-field:not(.elementor-select-wrapper){background-color:#ffffff;}.elementor-1640 .elementor-element.elementor-element-93da194 .elementor-field-group .elementor-select-wrapper select{background-color:#ffffff;}.elementor-1640 .elementor-element.elementor-element-93da194 .e-form__buttons__wrapper__button-next{color:#ffffff;}.elementor-1640 .elementor-element.elementor-element-93da194 .elementor-button[type="submit"]{color:#ffffff;}.elementor-1640 .elementor-element.elementor-element-93da194 .elementor-button[type="submit"] svg *{fill:#ffffff;}.elementor-1640 .elementor-element.elementor-element-93da194 .e-form__buttons__wrapper__button-previous{color:#ffffff;}.elementor-1640 .elementor-element.elementor-element-93da194 .e-form__buttons__wrapper__button-next:hover{color:#ffffff;}.elementor-1640 .elementor-element.elementor-element-93da194 .elementor-button[type="submit"]:hover{color:#ffffff;}.elementor-1640 .elementor-element.elementor-element-93da194 .elementor-button[type="submit"]:hover svg *{fill:#ffffff;}.elementor-1640 .elementor-element.elementor-element-93da194 .e-form__buttons__wrapper__button-previous:hover{color:#ffffff;}.elementor-1640 .elementor-element.elementor-element-93da194{--e-form-steps-indicators-spacing:20px;--e-form-steps-indicator-padding:30px;--e-form-steps-indicator-inactive-secondary-color:#ffffff;--e-form-steps-indicator-active-secondary-color:#ffffff;--e-form-steps-indicator-completed-secondary-color:#ffffff;--e-form-steps-divider-width:1px;--e-form-steps-divider-gap:10px;}:root{--page-title-display:none;}@media(max-width:1024px){.elementor-1640 .elementor-element.elementor-element-b6bc433{--gap:14px 14px;--row-gap:14px;--column-gap:14px;--padding-top:150px;--padding-bottom:70px;--padding-left:32px;--padding-right:32px;}.elementor-1640 .elementor-element.elementor-element-0dc400a .elementor-heading-title{font-size:40px;}.elementor-1640 .elementor-element.elementor-element-55699a3{--padding-top:80px;--padding-bottom:80px;--padding-left:32px;--padding-right:32px;}.elementor-1640 .elementor-element.elementor-element-eeb85b7{--flex-direction:column;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--align-items:stretch;--border-radius:36px 36px 36px 36px;}.elementor-1640 .elementor-element.elementor-element-c321ae7{--padding-top:40px;--padding-bottom:40px;--padding-left:36px;--padding-right:36px;}}@media(max-width:767px){.elementor-1640 .elementor-element.elementor-element-b6bc433{--gap:12px 12px;--row-gap:12px;--column-gap:12px;--padding-top:120px;--padding-bottom:56px;--padding-left:20px;--padding-right:20px;}.elementor-1640 .elementor-element.elementor-element-0dc400a .elementor-heading-title{font-size:30px;}.elementor-1640 .elementor-element.elementor-element-55699a3{--padding-top:56px;--padding-bottom:56px;--padding-left:20px;--padding-right:20px;}.elementor-1640 .elementor-element.elementor-element-eeb85b7{--flex-direction:column;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--align-items:stretch;--border-radius:24px 24px 24px 24px;}.elementor-1640 .elementor-element.elementor-element-c321ae7{--width:100%;--padding-top:28px;--padding-bottom:28px;--padding-left:20px;--padding-right:20px;}}@media(min-width:768px){.elementor-1640 .elementor-element.elementor-element-b6bc433{--content-width:1200px;}.elementor-1640 .elementor-element.elementor-element-55699a3{--content-width:1200px;}.elementor-1640 .elementor-element.elementor-element-eeb85b7{--width:100%;}.elementor-1640 .elementor-element.elementor-element-c321ae7{--width:54.65%;}}@media(max-width:1024px) and (min-width:768px){.elementor-1640 .elementor-element.elementor-element-c321ae7{--width:100%;}}/* Start custom CSS *//* Legal pages: a plain reading column — the client's own wording from ferfier.com */
.ff-legal .ff-legal-head .elementor-heading-title { margin-top: 18px; }
.ff-legal p { margin: 0; }
.ff-legal-list ul { margin: 0; padding-left: 20px; list-style: disc; }
.ff-legal-list li { margin-bottom: 8px; }
/* The grievance officer's details: a labelled line each, not one run-on paragraph */
.ff-legal-details p { margin-bottom: 6px; }
.ff-legal-details p:last-child { margin-bottom: 0; }
.ff-legal-details a { color: inherit; text-decoration: underline; }
.ff-legal-btn { margin-top: 10px; }
/* DMCA carries the contact form without the offices column, so the card is a single column */
.ff-legal-form .ff-c-card { max-width: 880px; margin-left: auto; margin-right: auto; }
.ff-legal-form .ff-c-formcol { width: 100% !important; }
/* ===== Contact Us (Figma 2565:366) ===== */
/* Hero: each slide carries the photo as a lazy ![]()
(.ff-bgimg), as the industry heroes do.
Figma's contact hero has no dark scrim over the photo, so .ff-m-slide::before is not reused. */
.ff-c-slide > .elementor-element:not(.ff-bgimg),
.ff-c-slide > .e-con-inner > .elementor-element:not(.ff-bgimg) { z-index: 2; }
.ff-c-slide .ff-bgimg img { object-position: center center; }
/* Section 2: the light strand photo sits on top of Figma's (fully covered) glows */
.ff-c-formsec { background-position: center center; background-size: cover; }
/* The glass card: Figma's 1% white over a 20px background blur, hairline black edge */
.ff-c-card { overflow: hidden; }
/* ---- Enquiry form ---- */
/* Figma's field rhythm is 23px between groups and 16px between the half-width pair. Elementor
sets --grid-row-gap/--grid-column-gap but its own rules use the 10px fallback, so the padding
and margin those vars are meant to drive are written out here. */
.ff-c-form .elementor-form-fields-wrapper { margin: 0 -8px -23px !important; }
.ff-c-form .elementor-field-group { padding: 0 8px !important; margin-bottom: 23px !important; }
.ff-c-form .elementor-field-type-submit { margin-bottom: 0 !important; }
/* Figma sets the label 15px above its control; Elementor's own label spacing out-specifies a
plain padding, so the gap is forced here. */
.ff-c-form .elementor-field-group > label.elementor-field-label {
font-family: Arial, sans-serif; font-size: 20px; line-height: 28px; font-weight: 400;
color: #000000; padding-bottom: 0 !important; margin-bottom: 15px !important; }
/* Only the textual controls get the Figma box — Elementor also puts .elementor-field on the
acceptance checkbox and on the select's wrapper div, which must not be boxed or 56px tall. */
.ff-c-form .elementor-field-group .elementor-field-textual,
.ff-c-form .elementor-field-group .elementor-select-wrapper select {
background-color: #FFFFFF; border: 1px solid #636D79; border-radius: 8px;
color: #000000; font-family: Arial, sans-serif; font-size: 16px; line-height: 22px;
padding: 17px 16px; min-height: 56px; }
.ff-c-form .elementor-field-group .elementor-select-wrapper { border: 0; background: none; padding: 0; min-height: 0; }
.ff-c-form .elementor-field-group textarea.elementor-field { height: 144px; min-height: 144px; padding: 25px 16px; resize: vertical; }
.ff-c-form .elementor-field-group .elementor-field::placeholder { color: #6B6B6B; opacity: 1; }
.ff-c-form .elementor-field-group .elementor-select-wrapper::before { color: #000000; right: 16px; }
.ff-c-form .elementor-field-group .elementor-field:focus,
.ff-c-form .elementor-field-group select:focus { outline: 2px solid #3158FF; outline-offset: 2px; border-color: #000000; }
/* Consent row: Figma's 14×15 box with a 2px edge, 9px from the sentence */
.ff-c-form .elementor-field-type-acceptance .elementor-field-option { display: flex; align-items: flex-start; gap: 9px; }
/* The ticked state is drawn as a background-image: an cannot carry a reliable ::after, and
something upstream pins this input's background-color to white with !important that outranks
anything scoped here — so the tick is red on white rather than white on black, which also matches
the subscribe form's accent-color: #FF1A00. */
.ff-c-form .elementor-field-type-acceptance input[type="checkbox"] {
appearance: none; -webkit-appearance: none; flex: 0 0 14px;
width: 14px !important; height: 15px !important; min-height: 0 !important; padding: 0 !important;
margin: 4px 0 0; border: 2px solid #000000 !important; border-radius: 2px;
background-image: none !important; cursor: pointer;
transition: border-color .15s ease; }
.ff-c-form .elementor-field-type-acceptance input[type="checkbox"]:checked {
border-color: #FF1A00 !important;
background-image: url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 10' fill='none'%3E%3Cpath d='M1 5.2 4.2 8.5 11 1.5' stroke='%23FF1A00' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") !important;
background-repeat: no-repeat !important; background-position: center !important; background-size: 10px 9px !important; }
@media (hover: hover) {
.ff-c-form .elementor-field-type-acceptance input[type="checkbox"]:hover { border-color: #FF1A00 !important; }
}
.ff-c-form .elementor-field-type-acceptance input[type="checkbox"]:focus-visible { outline: 2px solid #3158FF; outline-offset: 2px; }
.ff-c-form .elementor-field-type-acceptance label {
font-family: Arial, sans-serif; font-size: 16px; line-height: 22px; color: #000000; cursor: pointer; }
/* Submit: Figma's white pill with a black hairline. The kit styles `.elementor-button` globally at
the same specificity and wins on order, so the colours and case are forced here. */
.ff-c-form .elementor-field-type-submit { justify-content: flex-start; }
.ff-c-form .elementor-button {
width: auto;
background-color: #FFFFFF !important; color: #000000 !important;
border: 1px solid #000000 !important; border-radius: 75px !important;
padding: 14px 20px !important; min-height: 58px;
font-family: "Space Grotesk", sans-serif !important; font-weight: 700 !important;
font-size: 22px !important; line-height: 28px !important; text-transform: none !important;
transition: background-color .25s ease, color .25s ease, transform .25s cubic-bezier(.16,1,.3,1); }
.ff-c-form .elementor-button .elementor-button-content-wrapper { align-items: center; }
.ff-c-form .elementor-message { font-family: Arial, sans-serif; font-size: 16px; color: #000000; }
.ff-c-form .elementor-message.elementor-message-danger { color: #B40001; }
@media (hover: hover) {
/* Outlined CTA on white per the brand guideline (27 Sep): the outline turns red, the text stays black */
.ff-c-form .elementor-button:hover { background-color: #FFFFFF !important; color: #000000 !important; border-color: #C40000 !important; transform: translateY(-2px); }
}
#contact-form { scroll-margin-top: 130px; }
@media (max-width: 1024px) { #contact-form { scroll-margin-top: 96px; } }
/* ---- Office maps ---- */
/* #EFEFEF shows through only while the map iframe loads */
.ff-c-map { position: relative; background: #EFEFEF; }
.ff-c-mapframe, .ff-c-mapframe > .elementor-widget-container, .ff-c-mapframe .elementor-custom-embed {
position: absolute; inset: 0; height: 100%; width: 100%; }
.ff-c-mapframe iframe { width: 100%; height: 100%; border: 0; display: block; }
.ff-c-addr { z-index: 2; pointer-events: none; }
.ff-c-addr p { margin: 0; }
/* Figma bolds only the first line of the plate */
.ff-c-addr strong { font-weight: 700; }
.ff-c-addr .ff-c-addr-sub { font-weight: 400; }
/* ---- Motion ----
Driven by the mu-plugin's motion.js via the kit's own classes; nothing page-specific in JS.
The office cards lift like the site's other .ff-card surfaces, and the map only accepts
pointer input once it is hovered, so a page scroll over it does not get captured. */
.ff-c-map { transition: transform .3s cubic-bezier(.16,1,.3,1), box-shadow .3s ease; }
.ff-c-mapframe { pointer-events: none; }
.ff-c-map:hover .ff-c-mapframe { pointer-events: auto; }
@media (hover: hover) {
.ff-c-map:hover { transform: translateY(-4px); box-shadow: 0 14px 34px rgba(0,0,0,.14); }
}
.ff-c-addr { transition: transform .3s cubic-bezier(.16,1,.3,1); }
@media (prefers-reduced-motion: reduce) {
.ff-c-map:hover { transform: none; }
}
/* ---- Responsive ---- */
@media (max-width: 1024px) {
.ff-c-form .elementor-form-fields-wrapper { margin-bottom: -18px !important; }
.ff-c-form .elementor-field-group { margin-bottom: 18px !important; }
.ff-c-form .elementor-field-group > label.elementor-field-label { font-size: 18px; line-height: 24px; margin-bottom: 10px !important; }
.ff-c-form .elementor-button { font-size: 19px !important; min-height: 52px; }
}
@media (max-width: 767px) {
.ff-c-form .elementor-field-group.elementor-col-50 { width: 100%; }
.ff-c-form .elementor-field-group .elementor-field-textual { min-height: 50px; padding: 14px; }
.ff-c-form .elementor-field-group textarea.elementor-field { height: 120px; min-height: 120px; padding: 16px 14px; }
.ff-c-form .elementor-button { font-size: 18px !important; padding: 12px 18px !important; min-height: 48px; }
}
/* ===== Copied from the Impact AI page with the two shared sections ===== */
/* Impact AI — a light page on a dark site: sections carry their own ink. */
.ff-ia-assist, .ff-ia-why, .ff-ia-insights, .ff-ia-faqs, .ff-ia-subscribe { color: #050505; }
.ff-ia-faqs > .e-con-inner, .ff-ia-subscribe > .e-con-inner { position: relative; z-index: 1; }
/* Subscribe: the red wash falls from the right edge; the email shows its placeholder only. */
.ff-ia-subscribe::before { content: ""; position: absolute; inset: 0; pointer-events: none;
background: radial-gradient(70% 120% at 100% 108%, rgba(255,26,0,.55) 0%, rgba(255,26,0,.18) 45%, rgba(255,255,255,0) 72%); }
.ff-ia-form .elementor-field-group { margin-bottom: 10px; }
.ff-ia-form .elementor-form-fields-wrapper { align-items: flex-start; }
.ff-ia-form .elementor-field-group-email { order: 1; }
.ff-ia-form .elementor-field-type-submit { order: 2; }
.ff-ia-form .elementor-field-group-interests { order: 3; align-items: center; }
.ff-ia-form .elementor-field-group-consent { order: 4; }
.ff-ia-form .elementor-field-group-email > label { display: none; }
.ff-ia-form .elementor-field-group-interests > label { margin: 0 12px 0 0; }
.ff-ia-form .elementor-field-type-email input { height: 46px; max-width: 330px; border: 1px solid #101010 !important;
border-radius: 15px !important; padding: 0 18px; background: #FFFFFF !important; color: #050505 !important; font-size: 14px; }
.ff-ia-form .elementor-field-type-email input::placeholder { color: #6B6B6B; opacity: 1; }
.ff-ia-form .elementor-button { height: 46px; border-radius: 999px !important; background-color: #000000 !important;
border: 1px solid #FFFFFF; color: #FFFFFF !important; font-family: "Instrument Sans", sans-serif;
font-weight: 600; font-size: 16px; padding: 0 22px; }
.ff-ia-form .elementor-button .elementor-button-content-wrapper { display: inline-flex; align-items: center; gap: 8px; }
.ff-ia-form .elementor-button .elementor-button-text { text-transform: none !important; white-space: nowrap; }
.ff-ia-form .elementor-button .elementor-button-text::after { background-color: #FFFFFF; margin-left: 0; }
@media (hover: hover) {
.ff-ia-form .elementor-button:hover { background-color: #FF1A00 !important; border-color: #FF1A00; }
}
.ff-ia-form .elementor-field-subgroup { display: flex; flex-wrap: wrap; gap: 6px 18px; }
/* The kit paints form labels white for the dark pages; this one is light. */
.ff-ia-form .elementor-field-subgroup label, .ff-ia-form .elementor-field-type-acceptance label,
.ff-ia-form .elementor-field-label { color: #050505 !important; font-family: Arial, sans-serif;
font-size: 14px !important; line-height: 18.2px; font-weight: 400 !important; }
.ff-ia-form input[type="checkbox"] { accent-color: #FF1A00; width: 14px; height: 14px; }
.ff-ia-sub-img { position: relative; }
.ff-ia-sub-mark { pointer-events: none; z-index: 2; }
/* Both "View All" and the closing CTA are pills; their arrows take the text colour. */
.ff-ia-viewall .elementor-button-text::after, .ff-ia-cta-btn .elementor-button-text::after { background-color: currentColor; }/* End custom CSS */