to the service page. */
.gogox-funnel.gogox-funnel--service-cards {
background: #F4F4F4 !important;
}
.gogox-funnel--service-cards .gogox-funnel-heading {
color: #00121A !important;
}
.gogox-funnel--service-cards .gogox-funnel-card {
background-color: #FFFFFF !important;
border: 2px solid #0088BF !important;
border-radius: 14px !important;
/* Padding matches Austin's mobile margin reference — more breathing
room around the icon (24px left) and chevron (48px right). */
padding: 16px 48px 16px 24px !important;
position: relative;
}
/* Bump card-to-card gap to match the mobile reference. Base
`.gogox-funnel-grid { gap: 12px }` (line ~3438) is too tight. */
.gogox-funnel--service-cards .gogox-funnel-grid {
gap: 20px !important;
}
.gogox-funnel--service-cards .gogox-funnel-card-title {
color: #0088BF !important;
font-weight: 700 !important;
}
.gogox-funnel--service-cards .gogox-funnel-card-desc {
color: #00121A !important;
}
/* Mobile hmsvc1 / service-cards — NO chevron arrow per Austin's
design call (0.5.31). The mobile-wide rule above (line ~4257)
`.gogox-funnel-card-cta { display: none }` already hides the
hover CTA on touch, so we just don't override it here. Desktop
hmsvc1d still has its chevron via the @media (min-width: 601px)
block elsewhere. */
/* "Deliver made easy with the app" (hmappdl1) only — match desktop
Uber-style look on mobile too: light-gray section bg + WHITE cards
with dark navy heading + dark navy title (legible on white). */
.home .elementor-element-hmappdl1 .gogox-funnel {
background: #F4F4F4 !important;
}
.home .elementor-element-hmappdl1 .gogox-funnel-heading {
color: #00121A !important;
}
/* Two DISTINCT app cards on mobile (not one shared white box): the
generic mobile-list rule strips the radius and adds a bottom divider,
making the two rows read as a single container. Re-round each card,
drop the divider, add a gap + soft shadow so they sit as separate
cards on the grey section. */
.home .elementor-element-hmappdl1 .gogox-funnel-grid {
gap: 12px !important;
}
.home .elementor-element-hmappdl1 .gogox-funnel-card {
background-color: #FFFFFF !important;
padding: 14px 18px 14px 14px !important;
gap: 18px !important;
border-radius: 12px !important;
border-bottom: none !important;
box-shadow: 0 1px 6px rgba(0, 18, 26, 0.10);
}
.home .elementor-element-hmappdl1 .gogox-funnel-card-img {
flex: 0 0 110px !important;
width: 110px !important;
height: 110px !important;
}
/* No hover animation on the app cards (TC + EN mobile). The generic
mobile-list hover turns the card bg transparent and shrinks the image
110→80px, so the card looked like it shrank on mouse-over. Pin the
hover state to the resting state: white card + full-size 110px image. */
.home .elementor-element-hmappdl1 a.gogox-funnel-card:hover {
background-color: #FFFFFF !important;
transform: none !important;
}
.home .elementor-element-hmappdl1 a.gogox-funnel-card:hover .gogox-funnel-card-img {
flex: 0 0 110px !important;
width: 110px !important;
height: 110px !important;
margin: 0 !important;
opacity: 1 !important;
}
.home .elementor-element-hmappdl1 .gogox-funnel-card-title {
color: #00121A !important; /* dark navy for legibility on white card */
font-size: 22px !important;
line-height: 28px !important;
font-weight: 400 !important;
}
/* Bump heading to 32px to match "Looking for other services?" size.
Constrain max-width so "Deliver made easy" sits on line 1 and
"with the app" naturally wraps to line 2. */
.home .elementor-element-hmappdl1 .gogox-funnel-heading {
font-size: 32px !important;
line-height: 40px !important;
max-width: 320px;
margin-left: auto;
margin-right: auto;
}
/* HK-TC (/hk/ front page = post 11) ONLY: match the apps heading
"送貨定接單？立即下載！" to the other mobile section titles (探索更多服務 /
你最可靠的物流伙伴 = 28px / 36px). EN (other page id) keeps 32px. */
.page-id-11 .elementor-element-hmappdl1 .gogox-funnel-heading {
font-size: 28px !important;
line-height: 36px !important;
max-width: none;
}
}
/* ====================================================================
/corporate/ split hero — title + form left, image right.
Used by compose-corporate.php — built from raw Elementor containers
(heading + text-editor + gogox_contact_form on the left, image widget
on the right) so it doesn't need a new dedicated widget.
==================================================================== */
.gogox-corporate-hero {
position: relative !important;
width: 100% !important;
min-height: 640px !important;
padding: 80px max(24px, calc((100% - 1200px) / 2)) !important;
gap: 48px !important;
align-items: center !important;
justify-content: space-between !important; /* pushes form flush to right edge */
overflow: hidden;
}
/* Left dark gradient overlay so the white text on the left remains legible
against any bg image. Fades out before reaching the form on the right. */
.gogox-corporate-hero::before {
content: "";
position: absolute;
inset: 0;
background: linear-gradient(90deg, rgba(0, 0, 0, 0.55) 0%, transparent 55%);
z-index: 1;
pointer-events: none;
}
.gogox-corporate-hero-left,
.gogox-corporate-hero-right {
position: relative;
z-index: 2;
}
.gogox-corporate-hero-left {
flex: 1 1 55% !important;
max-width: 560px !important;
display: flex !important;
flex-direction: column !important;
gap: 20px !important;
}
.gogox-corporate-hero-right {
flex: 1 1 45% !important;
max-width: 480px !important;
}
/* Hero typography — match the standard .gogox-hero-title / .gogox-hero-text */
.gogox-corporate-hero .gogox-corporate-hero-title .elementor-heading-title {
color: #FFFFFF !important;
font-family: "proxima-nova", sans-serif !important;
font-size: 56px !important;
font-weight: 700 !important;
line-height: 1.1 !important;
margin: 0 !important;
text-shadow: 0 0 8px rgba(0, 80, 128, 0.35);
}
.gogox-corporate-hero .gogox-corporate-hero-subtitle p {
color: #FFFFFF !important;
font-family: "proxima-nova", sans-serif !important;
font-size: 17px !important;
line-height: 1.5 !important;
margin: 0 !important;
}
/* Reset Elementor's default + widget-container margin/padding inside
the left column so the container's gap (20px) is the only inter-widget
spacer — matching the native gogox_hero widget's tight spacing. */
.gogox-corporate-hero-left .elementor-widget-container { padding: 0 !important; }
.gogox-corporate-hero-left .gogox-corporate-hero-subtitle p,
.gogox-corporate-hero-left .gogox-corporate-hero-cta p {
margin: 0 !important;
}
/* When the contact form sits inside the hero, kill its outer chrome and
keep just the white form card */
.gogox-corporate-hero .gogox-contact-form {
padding: 0 !important;
background: transparent !important;
}
.gogox-corporate-hero .gogox-contact-form-inner {
gap: 0 !important;
max-width: 100% !important;
}
.gogox-corporate-hero .gogox-contact-form-body {
background: #FFFFFF;
padding: 28px;
border-radius: 12px;
box-shadow: 0 12px 40px rgba(0, 18, 26, 0.25);
}
/* Tablet/mobile — stack vertically */
@media (max-width: 900px) {
/* All corporate heroes share ONE mobile treatment (the SG pattern): show the
page's dedicated portrait banner full-width with the headline band on top and
drop the form below it. Each page supplies ONLY its own image via the
-sg/-hk/-hktc hook below; everything else is shared. Hardcoding the image
(rather than reusing Elementor's responsive bg, which only swaps the mobile
image in at <=767) is what makes this work across the whole <=900 range. */
.gogox-corporate-hero {
flex-direction: column !important;
min-height: 0 !important;
gap: 0 !important;
background-size: 100% auto !important;
background-position: top center !important;
background-repeat: no-repeat !important;
background-color: #005085 !important; /* fill below the band / behind the form */
padding: 50vw 24px 40px !important; /* drops the form below the headline band */
}
.gogox-corporate-hero::before {
background: none !important; /* baked headline is self-composed; no scrim on mobile */
}
.gogox-corporate-hero-sg {
background-image: url("https://s3-ap-northeast-1.amazonaws.com/wp-gogovan.com/wp-content/uploads/sites/3/2025/12/24110719/GoGoX-SG-Enterprise_Platform-Landing-Page_16Dec__HeroBannerMobile-e1767582859800.png") !important;
}
.gogox-corporate-hero-hk {
background-image: url("https://gogox-wordpress-staging-uploads.storage.googleapis.com/2026/06/cd1b52f0-368f-44ea-9e7c-a6ae59fd46ce.png") !important;
padding: 68vw 24px 40px !important; /* EN image has a taller text band (3-line headline + 5-line subtitle) */
}
.gogox-corporate-hero-hktc {
background-image: url("https://gogox-wordpress-staging-uploads.storage.googleapis.com/sites/3/2026/06/c6793cab-2a98-434e-ad2c-f9da07fc4b27.png") !important;
padding: 58vw 24px 40px !important; /* clears the TC portrait's 2-line subtitle */
}
.gogox-corporate-hero-left,
.gogox-corporate-hero-right {
max-width: 100% !important;
width: 100% !important;
flex: 0 0 auto !important;
}
.gogox-corporate-hero .gogox-corporate-hero-title .elementor-heading-title {
font-size: 40px !important;
}
}
/* ====================================================================
gogox_promo_carousel — card-based carousel with editable text per slide.
Renders N cards visible per row on desktop (default 3) with a teaser of
the previous slide before the first card and the next slide after the
last visible card (peek pattern). Tablet falls back to 2 cards, mobile
to 1. Uses the shared CAROUSEL_CONFIGS JS pipeline in footer.php.
==================================================================== */
.gogox-promo-carousel {
width: 100%;
padding: 64px 0;
}
.gogox-promo-carousel-inner {
max-width: 1200px;
margin: 0 auto;
}
.gogox-promo-carousel-heading {
margin: 0 24px 12px;
font-family: "proxima-nova", sans-serif;
font-size: 32px;
font-weight: 400;
line-height: 1.25;
color: #00121A;
text-align: center;
}
.gogox-promo-carousel-intro {
margin: 0 24px 32px;
font-family: "proxima-nova", sans-serif;
font-size: 16px;
line-height: 1.55;
color: #7a7a7a;
text-align: center;
}
.gogox-promo-carousel-stage {
position: relative;
display: flex;
align-items: center;
gap: 12px;
}
.gogox-promo-carousel-arrow {
flex: 0 0 44px;
width: 44px;
height: 44px;
border: 1px solid #D7DDE0;
background: #FFFFFF;
border-radius: 999px;
font-size: 24px;
line-height: 1;
cursor: pointer;
transition: background-color 0.15s ease, border-color 0.15s ease, transform 0.15s ease;
z-index: 2;
color: #00121A;
}
.gogox-promo-carousel-arrow:hover { background: #F3F7F8; transform: scale(1.05); }
.gogox-promo-carousel-arrow:disabled { opacity: 0.35; cursor: default; }
.gogox-promo-carousel-viewport {
flex: 1 1 0;
min-width: 0;
overflow: hidden;
/* Inset padding gives the peek effect: cards extend partially into the
padded area on each side, hinting at neighbouring slides. */
padding: 0 32px;
}
.gogox-promo-carousel-track {
display: flex;
gap: 24px;
transition: transform 0.4s ease;
will-change: transform;
}
.gogox-promo-carousel-card {
flex: 0 0 auto;
background: #FFFFFF;
border-radius: 20px;
padding: 32px 28px;
display: flex;
flex-direction: column;
gap: 16px;
text-decoration: none;
color: inherit;
transition: transform 0.15s ease, box-shadow 0.15s ease;
}
a.gogox-promo-carousel-card:hover {
transform: translateY(-2px);
box-shadow: 0 8px 28px rgba(0, 18, 26, 0.08);
}
/* Card width = (viewport - gaps) / cols, then shrink slightly so the
neighbours peek through the viewport's overflow edges. */
.gogox-promo-carousel--cols-3 .gogox-promo-carousel-card {
width: calc((100% - 48px) / 3);
}
.gogox-promo-carousel--cols-4 .gogox-promo-carousel-card {
width: calc((100% - 72px) / 4);
}
.gogox-promo-carousel--cols-2 .gogox-promo-carousel-card {
width: calc((100% - 24px) / 2);
}
.gogox-promo-carousel-card-title {
margin: 0;
font-family: "proxima-nova", sans-serif;
font-size: 24px;
font-weight: 900;
line-height: 1.25;
color: #005085;
}
.gogox-promo-carousel-card-img {
width: 100%;
display: flex;
align-items: center;
justify-content: center;
/* No fixed aspect-ratio — illustration keeps its natural shape, fills width. */
}
.gogox-promo-carousel-card-img img {
width: 100%;
height: auto;
object-fit: contain;
display: block;
}
.gogox-promo-carousel-card-body {
display: flex;
flex-direction: column;
gap: 12px;
}
.gogox-promo-carousel-card-body-text {
margin: 0;
font-family: "proxima-nova", sans-serif;
font-size: 15px;
line-height: 1.55;
color: #2D3D4D;
}
.gogox-promo-carousel-card-bullets {
list-style: none;
margin: 0;
padding: 0;
display: flex;
flex-direction: column;
gap: 8px;
}
.gogox-promo-carousel-card-bullets li {
display: flex;
align-items: flex-start;
gap: 10px;
font-family: "proxima-nova", sans-serif;
font-size: 14px;
line-height: 1.5;
color: #2D3D4D;
}
.gogox-promo-carousel-card-check {
flex: 0 0 20px;
display: inline-flex;
align-items: center;
justify-content: center;
margin-top: 1px; /* optical alignment with first text line */
}
.gogox-promo-carousel-card-check svg { display: block; }
.gogox-promo-carousel-card-bullet-text {
flex: 1 1 0;
min-width: 0;
}
.gogox-promo-carousel-dots {
display: flex;
justify-content: center;
gap: 8px;
margin-top: 24px;
}
.gogox-promo-carousel-dot {
width: 10px;
height: 10px;
border: 0;
background: #C8D2D7;
border-radius: 50%;
cursor: pointer;
padding: 0;
transition: background-color 0.15s ease, transform 0.15s ease;
}
.gogox-promo-carousel-dot:hover { background: #A0AAB0; }
.gogox-promo-carousel-dot.is-active {
background: #0088BF;
transform: scale(1.2);
}
/* Tablet — 2 visible cards */
@media (max-width: 1100px) {
.gogox-promo-carousel--cols-3 .gogox-promo-carousel-card,
.gogox-promo-carousel--cols-4 .gogox-promo-carousel-card {
width: calc((100% - 24px) / 2);
}
.gogox-promo-carousel-viewport { padding: 0 20px; }
}
/* Mobile — 1 visible card centred in the viewport with both neighbours
peeking (centering math handled by the carousel JS in footer.php).
Drop viewport's lateral padding so the math has symmetric room. Card
narrowed to 75% to leave room for peeks. */
@media (max-width: 700px) {
.gogox-promo-carousel { padding: 48px 0; }
.gogox-promo-carousel--cols-3 .gogox-promo-carousel-card,
.gogox-promo-carousel--cols-4 .gogox-promo-carousel-card,
.gogox-promo-carousel--cols-2 .gogox-promo-carousel-card {
width: 75%;
}
.gogox-promo-carousel-viewport { padding: 0; }
.gogox-promo-carousel-arrow { display: none; } /* dots only on mobile */
.gogox-promo-carousel-heading { font-size: 26px; }
}
/* Static grid mode — disables carousel chrome, renders cards as a fixed row.
Used when item count matches column count and no slide behaviour is wanted.
Track stays display:flex but never gets a transform applied (JS is
skipped because data-per-view/data-total are omitted in grid mode). */
.gogox-promo-carousel--grid .gogox-promo-carousel-stage {
gap: 0;
}
.gogox-promo-carousel--grid .gogox-promo-carousel-viewport {
padding: 0;
overflow: visible;
}
.gogox-promo-carousel--grid .gogox-promo-carousel-track {
transform: none !important;
transition: none;
}
@media (max-width: 700px) {
.gogox-promo-carousel--grid .gogox-promo-carousel-track {
flex-direction: column;
}
.gogox-promo-carousel--grid .gogox-promo-carousel-card {
width: 100% !important;
}
}
/* ====================================================================
gogox_news_carousel — image-first news/promo carousel.
Centred heading + intro, one large full-image banner card with a peek
of the next, paged by dots. No card chrome — each card is the image.
==================================================================== */
.gogox-newsbanner {
padding: 0;
background: #FFFFFF;
}
.gogox-newsbanner-inner {
max-width: 1200px;
margin: 0 auto;
padding: 0 24px;
text-align: center;
}
/* Heading + intro match the site-standard section style (cf. .gogox-news-*).
Heading sits 40px above the cards (same as .gogox-itg-heading "Looking for
other services?"); when an intro is present it provides its own gap below. */
.gogox-newsbanner-heading {
margin: 0 0 40px;
font-family: "proxima-nova", sans-serif;
font-size: 32px;
font-weight: 400;
line-height: 40px;
color: #00121A;
text-align: center;
}
.gogox-newsbanner-intro {
margin: 0 0 40px;
font-family: "proxima-nova", sans-serif;
font-size: 16px;
line-height: 1.6;
color: #7a7a7a;
text-align: center;
}
.gogox-newsbanner-stage { position: relative; }
.gogox-newsbanner-viewport {
overflow: hidden;
/* Side gutters via MARGIN (not padding) so cards are clipped at the
gutter boundary — the arrows live in the gutters and must never be
overlapped by banner images. */
margin: 0 72px;
}
.gogox-newsbanner-track {
display: flex;
gap: 24px;
transition: transform 0.4s ease;
will-change: transform;
}
/* One large CENTERED banner (~90%, 7:3) + peeks of both neighbours. */
.gogox-newsbanner-card {
flex: 0 0 auto;
width: 90%;
border-radius: 24px;
overflow: hidden;
background: #E3E3E3; /* placeholder tint until an image is set */
text-decoration: none;
color: inherit;
transition: transform 0.15s ease, box-shadow 0.15s ease;
}
a.gogox-newsbanner-card:hover {
transform: translateY(-2px);
box-shadow: 0 8px 28px rgba(0, 18, 26, 0.10);
}
.gogox-newsbanner-card-img {
width: 100%;
aspect-ratio: 7 / 3; /* fixed wide-banner box — all cards equal */
}
.gogox-newsbanner-card-img img {
width: 100%;
height: 100% !important; /* !important: beat Elementor's img{height:auto} resets */
object-fit: cover; /* crop to fill — uniform regardless of source */
display: block;
}
/* Older browsers without aspect-ratio: same 7:3 box via padding hack. */
@supports not (aspect-ratio: 7 / 3) {
.gogox-newsbanner-card-img { position: relative; padding-top: 42.857%; }
.gogox-newsbanner-card-img img { position: absolute; top: 0; left: 0; }
}
.gogox-newsbanner-dots {
display: flex;
justify-content: center;
gap: 10px;
margin-top: 28px;
}
.gogox-newsbanner-dot {
width: 10px;
height: 10px;
border: 0;
padding: 0;
border-radius: 50%;
background: #C8D2D7;
cursor: pointer;
transition: background-color 0.15s ease, transform 0.15s ease;
}
.gogox-newsbanner-dot:hover { background: #A0AAB0; }
.gogox-newsbanner-dot.is-active {
background: #0088BF;
transform: scale(1.2);
}
/* Prev/next arrows — slim brand-blue chevrons in the side gutters,
outside the banner (per mock), shown on all viewports. */
.gogox-newsbanner-arrow {
position: absolute;
top: 50%;
transform: translateY(-50%);
width: 44px;
height: 44px;
border: none;
background: none;
padding: 0;
cursor: pointer;
z-index: 2;
display: flex;
align-items: center;
justify-content: center;
transition: opacity 0.15s ease;
}
.gogox-newsbanner-arrow span { display: none; } /* glyph replaced by CSS chevron */
.gogox-newsbanner-arrow::before {
content: '';
width: 16px;
height: 16px;
border-right: 3px solid #0088BF;
border-bottom: 3px solid #0088BF;
border-radius: 2px;
}
.gogox-newsbanner-arrow--prev::before { transform: rotate(135deg); margin-left: 6px; }
.gogox-newsbanner-arrow--next::before { transform: rotate(-45deg); margin-right: 6px; }
.gogox-newsbanner-arrow:hover { opacity: 0.65; }
.gogox-newsbanner-arrow--prev { left: 6px; }
.gogox-newsbanner-arrow--next { right: 6px; }
@media (max-width: 700px) {
/* No arrows on mobile (swipe + dots + autoplay) — gutters reclaimed so
the banner runs nearly full-bleed. */
.gogox-newsbanner-arrow { display: none; }
.gogox-newsbanner-viewport { margin: 0; }
.gogox-newsbanner-card { width: 92%; }
.gogox-newsbanner-track { gap: 12px; }
}
/* ====================================================================
/corporate/ — image carousel (Elementor's built-in image-carousel widget,
wrapped in .gogox-corporate-carousel for brand styling).
==================================================================== */
.gogox-corporate-carousel {
max-width: 1200px;
margin: 64px auto !important;
padding: 0 24px;
}
.gogox-corporate-carousel .elementor-image-carousel-wrapper {
border-radius: 12px;
overflow: hidden;
box-shadow: 0 8px 24px rgba(0, 18, 26, 0.08);
}
.gogox-corporate-carousel .swiper-slide img {
display: block;
width: 100%;
height: auto;
}
/* Brand-tinted dot navigation */
.gogox-corporate-carousel .swiper-pagination {
bottom: 16px !important;
}
.gogox-corporate-carousel .swiper-pagination-bullet {
background: rgba(255, 255, 255, 0.6);
opacity: 1;
width: 10px;
height: 10px;
margin: 0 4px;
}
.gogox-corporate-carousel .swiper-pagination-bullet-active {
background: #FFDD00;
}
/* Brand-tinted arrow buttons */
.gogox-corporate-carousel .elementor-swiper-button {
color: #FFFFFF;
text-shadow: 0 0 8px rgba(0, 18, 26, 0.4);
transition: transform 0.15s ease;
}
.gogox-corporate-carousel .elementor-swiper-button:hover {
transform: scale(1.15);
}
@media (max-width: 600px) {
.gogox-corporate-carousel { margin: 40px auto !important; padding: 0 16px; }
}
/* ====================================================================
/corporate/ — bottom CTA section (lead-capture repeat near the page end).
Full-width brand-blue background with overlay; centered single-column
form card on top.
==================================================================== */
.gogox-corporate-bottom-cta {
position: relative !important;
width: 100% !important;
padding: 80px 24px !important;
overflow: hidden;
}
.gogox-corporate-bottom-cta::before {
content: "";
position: absolute;
inset: 0;
background: linear-gradient(180deg, rgba(0, 0, 0, 0.45) 0%, rgba(0, 0, 0, 0.55) 100%);
z-index: 1;
pointer-events: none;
}
.gogox-corporate-bottom-cta > * {
position: relative;
z-index: 2;
}
.gogox-corporate-bottom-cta .gogox-contact-form {
width: 100%;
max-width: 540px;
padding: 0 !important;
background: transparent !important;
}
.gogox-corporate-bottom-cta .gogox-contact-form-inner {
gap: 0 !important;
max-width: 100% !important;
}
.gogox-corporate-bottom-cta .gogox-contact-form-body {
background: #FFFFFF;
padding: 32px;
border-radius: 12px;
box-shadow: 0 12px 40px rgba(0, 18, 26, 0.25);
}
.gogox-corporate-bottom-cta .gogox-contact-form-heading {
font-size: 26px !important;
text-align: center;
margin: 0 0 8px !important;
}
.gogox-corporate-bottom-cta .gogox-contact-form-intro {
text-align: center;
margin: 0 0 24px !important;
}
@media (max-width: 600px) {
.gogox-corporate-bottom-cta { padding: 56px 16px !important; }
.gogox-corporate-bottom-cta .gogox-contact-form-body { padding: 24px; }
}
/* ====================================================================
gogox_contact_form — Contact Form 7 wrapper widget
Used on /corporate/ and other lead-capture pages. Replaces the live
ConvertFlow embed with a free, plugin-light path: CF7 + branded styles.
==================================================================== */
.gogox-contact-form {
width: 100%;
padding: 72px 24px;
}
.gogox-contact-form-inner {
max-width: 720px;
margin: 0 auto;
display: flex;
flex-direction: column;
gap: 32px;
align-items: stretch;
}
.gogox-contact-form-body {
background: #FFFFFF;
border-radius: 12px;
padding: 32px 32px 40px;
box-shadow: 0 4px 24px rgba(0, 18, 26, 0.06);
}
/* Heading + intro live INSIDE the form card so they sit above the inputs
as part of the same visual unit. */
.gogox-contact-form-body .gogox-contact-form-heading {
margin: 0 0 12px;
font-family: "proxima-nova", sans-serif;
font-weight: 600;
font-size: 1.25rem;
line-height: 1.3;
color: #00121A;
}
.gogox-contact-form-body .gogox-contact-form-intro {
margin: 0 0 24px;
font-family: "proxima-nova", sans-serif;
font-weight: 400;
font-size: 15px;
line-height: 1.55;
color: #7a7a7a;
}
/* CF7 markup styling — scope all rules under .gogox-contact-form-body so
we don't bleed into any other CF7 form on the site. */
.gogox-contact-form-body .gogox-cf7-row {
display: block;
margin: 0 0 10px;
}
/* CF7 inserts an automatic
wrapper around every shortcode row in the
rendered output (wpautop). Reset its default browser margin so it doesn't
misalign rows + the submit button (the
's 1em top/bottom margin was
visibly shifting submit-row positioning). */
.gogox-contact-form-body .gogox-cf7-row > p {
margin: 0;
padding: 0;
}
/* --split modifier: two side-by-side fields (e.g. First Name + Last Name)
sharing a row. CF7's wpautop wraps the row content in a
, so we make
that
the grid container — same trick as --phone below. The two child