/*!
Theme Name: Kadence Child
Theme URI: https://bowdenworks.com
Template: kadence
Author: Bowden Works
Author URI: https://bowdenworks.com
Description: Kadence child theme for Equinox Business Law
Version: 1.0.38
License: GNU General Public License v3.0 (or later)
License URI: https://www.gnu.org/licenses/gpl-3.0.html
Text Domain: kadence-child
*/

/* ==========================================================================
   Equinox Background Helpers
   ========================================================================== */

/* Hero Radial Gradient matching prototype index.html */
.herograd,
.wp-block-kadence-rowlayout.herograd,
.wp-block-kadence-rowlayout.herograd > .kt-row-layout-overlay,
.wp-block-kadence-section.herograd {
    background: radial-gradient(ellipse at 50% 38%, #FFFFFF 0%, #E8F0F4 46%, #93BCCD 100%) !important;
}

/* Warm Cream Background Helper */
.bg-cream,
.wp-block-kadence-rowlayout.bg-cream,
.wp-block-kadence-section.bg-cream {
    background-color: #FFFAEB !important;
}

/* Midnight Dark Background Helper */
.bg-midnight,
.wp-block-kadence-rowlayout.bg-midnight,
.wp-block-kadence-section.bg-midnight {
    background-color: #112337 !important;
}

/* ==========================================================================
   Section 4 Puzzle Art & Tilt Helper (.s4art / .rotate-tilt)
   ========================================================================== */
.s4intro {
    position: relative;
    margin-bottom: 52px;
}
.s4art {
    position: absolute;
    right: 0;
    top: 50%;
    transform: translateY(-50%);
    width: 200px;
    max-width: 30%;
    pointer-events: none;
    z-index: 1;
}
.s4art .pzart,
.s4art img,
.s4art .kadence-image-wrap,
.rotate-tilt,
.rotate-tilt img {
    transform: rotate(-8deg) !important;
    transform-origin: 50% 50% !important;
    display: block;
}
.pz { fill: #E7EDF0; stroke: #ffffff; stroke-width: 3; }
.pzfit { fill: #003B53; stroke: #ffffff; stroke-width: 3; }

/* ==========================================================================
   Eyebrow Mark Helper (.eyebrowmark)
   ========================================================================== */
.eyebrowmark {
    display: inline-flex !important;
    align-items: center !important;
    gap: 14px !important;
    font-family: 'Montserrat', Arial, sans-serif !important;
    font-size: 12px !important;
    font-weight: 700 !important;
    letter-spacing: .22em !important;
    text-transform: uppercase !important;
    color: #027CA1 !important;
    margin-top: 0 !important;
    margin-bottom: 20px !important;
}

/* Auto-generate yellow dash line when used on a single Kadence block (not the Pre-heading
   block, whose "Show Accent Line" toggle decides) */
.eyebrowmark:not(.wp-block-equinox-pre-heading):not(:has(.ymrule))::before {
    content: "";
    display: inline-block;
    width: 40px;
    height: 3px;
    background-color: #FFD457;
    flex: none;
}

/* Explicit rule & text classes for HTML prototype compatibility */
.eyebrowmark .ymrule {
    display: inline-block;
    width: 40px;
    height: 3px;
    background-color: #FFD457;
    flex: none;
}
.eyebrowmark .ytext {
    font-family: 'Montserrat', Arial, sans-serif;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: .22em;
    text-transform: uppercase;
    color: #027CA1;
}

/* ---- Shared parts (2026-10-07) ---- */

/* Phone drawer: same menu as desktop, but only the link lists (GL-40). Mega-menu columns marked
   eq-desktop-only (business functions, industries, CTA cards, the Services foot bar) stay desktop-only. */
#mobile-drawer .eq-desktop-only { display: none !important; }

/* Phone drawer foot: both CTAs, then phone and email (DD-01). */
#mobile-drawer .eq-drawer-ctas { display: flex; flex-direction: column; gap: 12px; margin-top: 24px; }
#mobile-drawer .eq-drawer-ctas .button { display: block; text-align: center; width: 100%; }
#mobile-drawer .eq-drawer-contact { margin-top: 18px; font-size: 15px; line-height: 1.9; }

/* Pre-footer: the client's swirl (Brand Kit file) as a large background mark cut in half at the
   right edge, 16% opacity (DD-05: pre-footer yes, footer never). Decorative, so CSS not an img. */
.kb-row-layout-id823_3ae561-10 { position: relative; overflow: hidden; }
.kb-row-layout-id823_3ae561-10::after {
    content: ""; position: absolute; right: 0; top: 50%; width: 820px; height: 820px;
    transform: translate(50%, -50%); opacity: .16; pointer-events: none; z-index: 0;
    background: url(/wp-content/uploads/2026/10/equinox-swirl-lg.png) center / contain no-repeat;
}
.kb-row-layout-id823_3ae561-10 > .kt-row-column-wrap { position: relative; z-index: 1; }
@media (max-width: 850px) {
    .kb-row-layout-id823_3ae561-10::after { width: 520px; height: 520px; top: auto; bottom: -60px; transform: translateX(50%); }
}

/* Footer column headings: one colour, at least 60% white on NIGHT (GL-36). */
.site-footer .kt-adv-heading229_ae55ef-8d,
.site-footer .kt-adv-heading248_611340-13,
.site-footer .kt-adv-heading268_7ce7e7-16 { color: rgba(255, 255, 255, .62) !important; text-transform: uppercase; letter-spacing: .16em; font-size: 12px; }

/* ==========================================================================
   Gravity Forms (every form, "gravity-theme"). Written once here so the Contact form and any
   later form pick it up. Fields and buttons share one height (48px). Layout reference: the
   newsletter strip in wp-content/mockups/blog.html. The Subscribe button's navy colour and
   paper-plane icon are still in Additional CSS (button#gform_submit_button_1); height and
   alignment are set here.
   ========================================================================== */
body .gform_wrapper.gravity-theme { --eq-field-h: 48px; margin: 0; }
body .gform_wrapper.gravity-theme .gfield_label,
body .gform_wrapper.gravity-theme .gform-field-label--type-sub { font-size: 14px; font-weight: 600; color: var(--global-palette1); }
body .gform_wrapper.gravity-theme .gfield_required { color: var(--global-palette5); font-weight: 400; }
body .gform_wrapper.gravity-theme input[type=text],
body .gform_wrapper.gravity-theme input[type=email],
body .gform_wrapper.gravity-theme input[type=tel],
body .gform_wrapper.gravity-theme input[type=url],
body .gform_wrapper.gravity-theme input[type=number],
body .gform_wrapper.gravity-theme select,
body .gform_wrapper.gravity-theme textarea {
    box-sizing: border-box; width: 100%; min-height: var(--eq-field-h); margin: 0; padding: 12px 16px;
    font-family: inherit; font-size: 15px; line-height: 1.4; color: var(--global-palette4);
    background: #fff; border: 1px solid rgba(0, 0, 0, .14); border-radius: 3px; box-shadow: none;
    transition: border-color .15s ease, box-shadow .15s ease;
}
/* A fixed height, because GF's phone rule (line-height: 2, basic.min.css) outranks the padding. */
body .gform_wrapper.gravity-theme input[type=text],
body .gform_wrapper.gravity-theme input[type=email],
body .gform_wrapper.gravity-theme input[type=tel],
body .gform_wrapper.gravity-theme input[type=url],
body .gform_wrapper.gravity-theme input[type=number] { height: var(--eq-field-h); }
body .gform_wrapper.gravity-theme select { height: var(--eq-field-h); padding-top: 0; padding-bottom: 0; }
body .gform_wrapper.gravity-theme textarea { min-height: 140px; resize: vertical; }
body .gform_wrapper.gravity-theme ::placeholder { color: var(--global-palette5); opacity: 1; }
body .gform_wrapper.gravity-theme input:focus,
body .gform_wrapper.gravity-theme select:focus,
body .gform_wrapper.gravity-theme textarea:focus {
    outline: none; border-color: var(--global-palette2); box-shadow: 0 0 0 3px rgba(2, 124, 161, .22);
}
body .gform_wrapper.gravity-theme .gform_footer button,
body .gform_wrapper.gravity-theme .gfield--type-submit button,
body .gform_wrapper.gravity-theme .gform_footer input[type=submit] {
    box-sizing: border-box; min-height: var(--eq-field-h); margin: 0; font-size: 15px; line-height: 1.2;
    justify-content: center; white-space: nowrap;
}
body .gform_wrapper.gravity-theme button:focus-visible { outline: 2px solid var(--global-palette1); outline-offset: 2px; }
/* Errors: plain red text under the field, not GF's boxed alert. */
body .gform_wrapper.gravity-theme .gfield_error input,
body .gform_wrapper.gravity-theme .gfield_error select,
body .gform_wrapper.gravity-theme .gfield_error textarea { border-color: #b3261e; }
body .gform_wrapper.gravity-theme .gfield_validation_message,
body .gform_wrapper.gravity-theme .validation_message {
    margin: 6px 0 0; padding: 0; background: none; border: 0; font-size: 13.5px; line-height: 1.4; color: #b3261e;
}
body .gform_wrapper.gravity-theme .gform_validation_errors {
    margin: 0 0 16px; padding: 12px 16px; border: 1px solid #b3261e; border-radius: 3px; background: #fff; box-shadow: none;
}
body .gform_wrapper.gravity-theme .gform_validation_errors h2 { font-size: 14px; font-weight: 600; color: #b3261e; margin: 0; }
body .gform_wrapper.gravity-theme .gform_validation_errors h2 .gform-icon { display: none; }
body .gform_confirmation_message { font-size: 16px; font-weight: 600; color: var(--global-palette1); }
/* Fine print inside a form (the Contact form's privilege disclaimer is an HTML field with this class). */
body .gform_wrapper.gravity-theme .eq-form-disclaimer { margin: 0; font-size: 13px; line-height: 1.55; color: var(--global-palette4); }
body .gform_wrapper.gravity-theme .gfield--type-consent .gfield_consent_label { font-size: 14px; }

/* Inline forms (the newsletter, form 1): Name and Email share the row and the button sits at
   the end, all one height. Stacks at phone width. */
body #gform_wrapper_1 { width: 100%; } /* the pre-footer column aligns its contents right */
body #gform_wrapper_1 .gform_fields { display: flex; flex-wrap: nowrap; align-items: flex-start; gap: 10px; }
body #gform_wrapper_1 .gfield { flex: 1 1 0; min-width: 0; margin: 0; padding: 0; grid-column: auto; }
body #gform_wrapper_1 .gfield--type-submit { flex: 0 0 auto; }
body #gform_wrapper_1 .ginput_complex.gform-grid-row { margin: 0; }
body #gform_wrapper_1 .ginput_complex .gform-grid-col { padding: 0; margin: 0; flex: 1 1 100%; max-width: none; }
body #gform_wrapper_1 .gform_footer:not(:has(button, input[type=submit])) { margin: 0; padding: 0; }
@media (max-width: 600px) {
    body #gform_wrapper_1 .gform_fields { flex-direction: column; align-items: stretch; }
    body #gform_wrapper_1 .gfield--type-submit button { width: 100%; }
}

/* ==========================================================================
   Paired CTA box (Book a Consultation + Legal Health Check) inside a reading column: the single
   post and the team bio templates. Links go to the URLs GTM tracks, never by class.
   ========================================================================== */
.eq-spcta { margin: 44px 0 0; background: var(--global-palette1); border-radius: 4px; padding: 32px 34px; }
.eq-spcta .eq-spcta-h { font-family: var(--global-heading-font-family); font-size: 24px; font-weight: 300; line-height: 1.25; color: #fff; margin: 0; }
.eq-spcta-h b { font-weight: 700; }
.eq-spcta .eq-spcta-p { font-size: 16px; line-height: 1.6; color: rgba(255, 255, 255, .82); margin: 12px 0 22px; }
.eq-spcta-btns { display: flex; flex-wrap: wrap; gap: 12px; }
.eq-btn { display: inline-flex; align-items: center; justify-content: center; flex: 1 1 220px; max-width: 320px; min-height: 46px; padding: 12px 22px; box-sizing: border-box; border-radius: 3px; font-size: 15px; font-weight: 600; line-height: 1.3; text-align: center; text-decoration: none; transition: background-color .16s ease, color .16s ease; }
.eq-btn-main { background: var(--global-palette10, #FFD457); color: var(--global-palette4); }
.eq-btn-main:hover, .eq-btn-main:focus { background: #fff; color: var(--global-palette1); }
.eq-btn-light { background: #fff; color: var(--global-palette1); }
.eq-btn-light:hover, .eq-btn-light:focus { background: var(--global-palette6); color: var(--global-palette1); }

@media (max-width: 800px) {
	.eq-spcta { padding: 26px 22px; }
	.eq-btn { flex-basis: 100%; max-width: none; }
}

/* Child-theme templates (blog index, author, category and tag archives, search, single post, team bio, 404) are white. Kadence
   stretches #inner-wrap to fill the window, so on a short page the site's grey background showed
   as a band above the pre-footer. */
body.blog #inner-wrap, body.author #inner-wrap, body.category #inner-wrap, body.tag #inner-wrap, body.search #inner-wrap, body.single-post #inner-wrap, body.single-team #inner-wrap, body.error404 #inner-wrap { background: #fff; }

/* 404 page (404.php): light by design, static content only. */
.eq-404 { background: linear-gradient(180deg, #F0F6F8 0%, #FFFFFF 100%); }
.eq-404-in { max-width: 760px; margin: 0 auto; padding: 96px var(--global-content-edge-padding, 4rem) 112px; box-sizing: border-box; text-align: center; }
.eq-404-flag { font-size: 12px; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: var(--global-palette5); margin: 0 0 12px; }
.eq-404-h1 { font-family: var(--global-heading-font-family); font-size: 44px; font-weight: 300; line-height: 1.15; color: var(--global-palette1); margin: 0; }
.eq-404-h1 b { font-weight: 700; }
.eq-404-p { font-size: 18px; line-height: 1.62; color: var(--global-palette4); margin: 18px auto 0; max-width: 560px; }
.eq-404-search { display: flex; gap: 10px; max-width: 520px; margin: 32px auto 0; }
.eq-404-search input { flex: 1 1 auto; min-width: 0; height: 48px; padding: 0 14px; border: 1px solid var(--global-palette12); border-radius: 3px; background: #fff; font-size: 16px; color: var(--global-palette4); }
.eq-404-search input:focus { outline: 2px solid var(--global-palette2); outline-offset: 1px; border-color: var(--global-palette2); }
.eq-404-search button { height: 48px; padding: 0 24px; border: 0; border-radius: 3px; background: var(--global-palette1); color: #fff; font-size: 15px; font-weight: 600; cursor: pointer; }
.eq-404-search button:hover, .eq-404-search button:focus { background: var(--global-palette2); }
.eq-404-links { list-style: none; display: flex; flex-wrap: wrap; justify-content: center; gap: 10px 28px; margin: 36px 0 0; padding: 0; }
.eq-404-links a { font-size: 15px; font-weight: 600; color: var(--global-palette2); text-decoration: none; }
.eq-404-links a:hover, .eq-404-links a:focus { text-decoration: underline; }
@media (max-width: 600px) {
	.eq-404-in { padding: 64px var(--global-content-edge-padding, 1.5rem) 72px; }
	.eq-404-h1 { font-size: 34px; }
	.eq-404-search { flex-direction: column; }
	.eq-404-links { flex-direction: column; gap: 14px; }
}

/* Newsletter Sign Up page: form 1 sits in a panel (.eq-nl-panel), so it stacks instead of the
   pre-footer's one-row layout, and the consent line under it is fine print. */
body .eq-nl-panel #gform_wrapper_1 .gform_fields { flex-direction: column; align-items: stretch; gap: 14px; }
body .eq-nl-panel #gform_wrapper_1 .gfield--type-submit button,
body .eq-nl-panel #gform_wrapper_1 .gform_footer button,
body .eq-nl-panel #gform_wrapper_1 input[type=submit] { width: 100%; }
.eq-nl-panel .eq-nl-consent { margin: 14px 0 0; font-size: 13px; line-height: 1.55; color: var(--global-palette4); }

/* Policy pages (privacy, cookie, terms, disclaimer): the Termageddon embed repeats the policy's name
   as its first heading, right under the page's own H1, so that copy is hidden. */
.policy_embed_div article > h2:first-child { display: none; }
.policy_embed_div .tg-last-updated-date { margin-top: 0; color: var(--global-palette5); font-size: 15px; }

/* Outline header buttons (the landing-page header): Kadence forces them transparent with
   !important, so the hover fill set in the header's settings never shows. Outline buttons fill
   with their outline colour on hover, the same as the outline buttons in the page content. */
#main-header .header-button.button-style-outline:hover,
#main-header .header-button.button-style-outline:focus-visible { background: var(--global-palette1) !important; }