/* Theme Name: L'Equipe Commerce Template: devq-starter Author: Josh Yager Author URI: https://thedevq.com/ Description: Child theme for L'Equipe Commerce, built on DevQ Starter — bespoke 1:1 block library Version: 1.1.0 */ /* =========================================================== L'EQUIPE COMMERCE — bespoke design system navy #1d1f4e · deep navy #15153c · coral #e8502e Headings: Poppins · Body: Inter =========================================================== */ :root{ --leq-navy:#1d1f4e; --leq-navy-deep:#15153c; --leq-coral:#e8502e; --leq-ink:#1d1f4e; --leq-grey:#5b5d77; --leq-light:#f5f6fa; --leq-maxw:1240px; } /* Kill the on-load horizontal scrollbar from full-bleed sections + AOS entrance transforms. overflow-x:hidden on the ROOT propagates to the viewport, so it clips horizontal overflow WITHOUT making body a scroll container (which would break the sticky header). */ html{ overflow-x:hidden; } body{ max-width:100%; } /* ---- shared primitives ---- */ .leq-eyebrow{ font-family:var(--font1,'Poppins'),sans-serif; text-transform:uppercase; letter-spacing:.22em; font-weight:600; color:var(--leq-coral); font-size:.8rem; margin-bottom:18px; } .leq-heading{ font-family:var(--font1,'Poppins'),sans-serif; font-weight:800; color:var(--leq-navy); line-height:1.08; font-size:56px; letter-spacing:-.01em; margin:0 0 40px; } /* coral underline on a phrase: wrap in — a true underline sitting BELOW the text */ .leq-heading u, .leqhero-heading u, .leqcta-heading u{ text-decoration: underline; text-decoration-color: var(--leq-coral); text-decoration-thickness: 10px; text-underline-offset: -4px; text-decoration-skip-ink: none; } .leqfeature--bg-navy .leq-heading, .leqfeature--bg-black .leq-heading, .leqfeature--bg-coral .leq-heading{ color:#fff; } /* ---- buttons ---- */ .leq-btn{ display:inline-flex; align-items:center; gap:10px; font-family:var(--font1,'Poppins'),sans-serif; text-transform:uppercase; letter-spacing:.06em; font-weight:600; font-size:.92rem; padding:17px 34px; border-radius:2px; text-decoration:none; border:2px solid transparent; transition:transform .2s ease, background-color .2s ease, color .2s ease, box-shadow .2s ease; cursor:pointer; line-height:1; } .leq-btn:hover{ transform:translateY(-2px); box-shadow:0 12px 26px rgba(0,0,0,.18); } .leq-btn-coral{ background:var(--leq-coral); color:#fff; } /* coral CTA hover: invert to white fill + coral text on DARK sections (source behaviour); on light sections fall back to a darker coral so a white button never vanishes into a light bg */ .leq-btn-coral:hover{ background:#cf4322; color:#fff; } .leqhero .leq-btn-coral:hover, .leqcta--bg-navy .leq-btn-coral:hover, .leqcta--bg-coral .leq-btn-coral:hover, .leqfeature--bg-navy .leq-btn-coral:hover, .leqfeature--bg-black .leq-btn-coral:hover{ background:#fff; color:var(--leq-coral); } .leq-btn-navy{ background:var(--leq-navy); color:#fff; } .leq-btn-white{ background:#fff; color:var(--leq-navy); } .leq-btn-outline{ background:transparent; border-color:var(--leq-navy); color:var(--leq-navy); } .leq-btn-outline-white{ background:transparent; border-color:#fff; color:#fff; } .leq-arrow{ font-size:1.05em; line-height:0; } /* ============ HERO ============ */ .leqhero{ position:relative; background:var(--leq-navy-deep) center/cover no-repeat; min-height:640px; display:flex; align-items:center; color:#fff; } /* navy tint so white hero copy stays readable over any photo background */ .leqhero::before{ content:""; position:absolute; inset:0; z-index:0; background:linear-gradient(90deg, rgba(15,15,44,.82) 0%, rgba(20,21,70,.62) 55%, rgba(20,21,70,.46) 100%); } .leqhero > .container{ position:relative; z-index:1; } /* horizontal gutter comes from the theme `.container` class on the same element; blocks keep only their vertical rhythm + internal layout here */ .leqhero-inner{ padding-top:60px; padding-bottom:60px; } .leqhero-content{ max-width:780px; } .leqhero-heading{ font-family:var(--font1,'Poppins'),sans-serif; font-weight:800; color:#fff; font-size:64px; line-height:1.02; letter-spacing:-.015em; margin:0 0 26px; } .leqhero-sub{ font-size:1.12rem; line-height:1.6; color:rgba(255,255,255,.9); margin:0 0 34px; max-width:640px; } /* ============ STATS ============ */ .leqstats{ background:#fff; padding:84px 0; } .leqstats-inner{ display:flex; justify-content:center; gap:80px; flex-wrap:wrap; text-align:center; } .leqstats-item{ min-width:200px; } .leqstats-top{ font-family:var(--font1,'Poppins'),sans-serif; text-transform:uppercase; letter-spacing:.2em; font-weight:600; color:var(--leq-navy); font-size:.85rem; padding-bottom:14px; margin-bottom:14px; border-bottom:2px solid rgba(29,31,78,.15); display:inline-block; } .leqstats-num{ font-family:var(--font1,'Poppins'),sans-serif; font-weight:800; color:var(--leq-coral); font-size:76px; line-height:1; margin-bottom:12px; } .leqstats-label{ color:var(--leq-navy); font-size:1.15rem; } /* ============ FEATURE ============ */ .leqfeature{ padding:90px 0; } .leqfeature--bg-white{ background:#fff; } .leqfeature--bg-light{ background:var(--leq-light); } .leqfeature--bg-grey{ background:#f8f8f8; } .leqfeature--bg-navy{ background:var(--leq-navy); color:#fff; } .leqfeature--bg-black{ background:#0e0e12; color:#fff; } .leqfeature--bg-coral{ background:var(--leq-coral); color:#fff; } .leqfeature{ position:relative; } .leqfeature[style*="background-image"]{ background-size:cover; background-position:center; } .leqfeature-overlay{ position:absolute; inset:0; z-index:1; } .leqfeature-overlay--dark{ background:rgba(8,8,16,.55); } .leqfeature-overlay--navy{ background:rgba(21,21,60,.6); } .leqfeature-inner{ position:relative; z-index:2; } /* banner */ .leqfeature--banner{ padding:120px 0; color:#fff; } .leqfeature-banner{ display:flex; } .leqfeature-banner-left{ justify-content:flex-start; } .leqfeature-banner-right{ justify-content:flex-end; } .leqfeature-banner .leqfeature-content{ max-width:560px; } .leqfeature--banner .leq-heading{ color:#fff; } .leqfeature--banner .leqfeature-text{ color:rgba(255,255,255,.92); } /* very subtle dark gradient over the banner photo, sitting under the boxed content */ .leqfeature--banner[style*="background-image"]::before{ content:""; position:absolute; inset:0; z-index:1; background:linear-gradient(to bottom, rgba(0,0,0,.1), rgba(0,0,0,.2)); pointer-events:none; } /* split */ .leqfeature-split{ display:grid; grid-template-columns:1fr 1fr; gap:64px; align-items:center; } .leqfeature-img-right .leqfeature-media{ order:2; } .leqfeature-media img{ width:100%; height:auto; display:block; border-radius:4px; } /* split images run taller (object-fit cover) to match the live site's portrait crop */ .leqfeature-split .leqfeature-media img{ min-height:500px; object-fit:cover; } /* splitbleed — edge-to-edge image on a coloured (pink) background, e.g. "We Champion" */ .leqfeature--bg-pink{ background:#f4bac6; } .leqfeature--bg-pink .leq-heading u{ text-decoration-color:#fff; } .leqfeature--splitbleed{ padding:0; } .leqfeature--splitbleed .leqfeature-inner{ max-width:none; width:100%; padding:0; } .leqfeature--splitbleed .leqfeature-split{ gap:0; align-items:stretch; } .leqfeature--splitbleed .leqfeature-media{ align-self:stretch; } .leqfeature--splitbleed .leqfeature-media img{ width:100%; height:100%; min-height:560px; object-fit:cover; border-radius:0; } .leqfeature--splitbleed .leqfeature-content{ align-self:center; padding:64px 72px; } /* "We Champion" — the photo fills the whole band as a full-width background; its pink studio backdrop blends with the section pink, so the heading/text sit directly over the pink (no boxed background) */ .leqfeature--splitbleed.leqfeature--bg-pink .leqfeature-split{ position:relative; display:flex; align-items:center; min-height:600px; } .leqfeature--splitbleed.leqfeature--bg-pink .leqfeature-media{ position:absolute; inset:0; align-self:stretch; } .leqfeature--splitbleed.leqfeature--bg-pink .leqfeature-media img{ height:100%; object-position:left center; } .leqfeature--splitbleed.leqfeature--bg-pink .leqfeature-content{ position:relative; z-index:1; align-self:center; margin-left:auto; width:50%; } /* semi-transparent coral box (the people-grid background reads through it slightly) */ .leqfeature-content--boxed{ background:rgba(232,80,46,.92); color:#fff; padding:48px; border-radius:4px; } .leqfeature-content--boxed .leq-heading u{ text-decoration-color:var(--leq-navy); } .leqfeature--bg-navy .leqfeature-text, .leqfeature--bg-black .leqfeature-text, .leqfeature-content--boxed .leqfeature-text{ color:rgba(255,255,255,.92); } .leqfeature-text{ color:var(--leq-grey); font-size:1.08rem; line-height:1.7; } /* children must inherit the container colour (a global `p{color:#333}` otherwise overrides it and dark-bg copy goes invisible) — see dark-bg-white-descendants */ .leqfeature-text p{ margin:0 0 1em; } .leqfeature-text p, .leqfeature-text li, .leqfeature-text strong{ color:inherit; } /* textbuttons */ .leqfeature--textbuttons .leq-heading{ max-width:none; } /* 60/40 text-to-button row */ .leqfeature-row{ display:grid; grid-template-columns:3fr 2fr; gap:60px; align-items:center; margin-top:8px; } .leqfeature--bg-navy .leqfeature-row .leqfeature-text{ color:#fff; } .leqfeature-buttons{ display:flex; flex-direction:column; gap:16px; align-items:flex-start; } .leqfeature-row .leqfeature-buttons{ align-items:stretch; } .leqfeature-row .leq-btn{ justify-content:center; } /* centered */ .leqfeature-centered{ max-width:760px; margin:0 auto; text-align:center; } .leqfeature-centered .leqfeature-buttons{ align-items:center; justify-content:center; flex-direction:row; flex-wrap:wrap; } /* ============ CIRCLES ============ */ .leqcircles{ background:#fff; padding:70px 0 90px; } .leqcircles-heading{ text-align:center; margin-bottom:50px; } .leqcircles-row{ display:flex; justify-content:center; gap:40px; flex-wrap:wrap; } .leqcircles-item{ width:210px; text-align:center; } /* bigger circle, thinner two-tone ring (coral outer + navy inner) to match the live site */ .leqcircles-circle{ width:196px; height:196px; border-radius:50%; overflow:hidden; margin:0 auto 22px; border:2px solid var(--leq-coral); box-shadow: inset 0 0 0 2px var(--leq-navy), 0 10px 26px rgba(29,31,78,.14); transition: transform .35s ease, box-shadow .35s ease; } .leqcircles-circle img{ width:100%; height:100%; object-fit:cover; display:block; transition: transform .5s ease; } .leqcircles-item:hover .leqcircles-circle{ transform: translateY(-6px); box-shadow: inset 0 0 0 2px var(--leq-navy), 0 18px 40px rgba(29,31,78,.26); } .leqcircles-item:hover .leqcircles-circle img{ transform: scale(1.08); } .leqcircles-label{ font-family:var(--font1,'Poppins'),sans-serif; text-transform:uppercase; font-weight:700; color:var(--leq-navy); font-size:.82rem; letter-spacing:.04em; line-height:1.3; } /* ============ LOGOS ============ */ .leqlogos{ background:#fff; padding:80px 0; } .leqlogos-inner{ text-align:center; } /* big navy section heading (inherits .leq-heading), left-aligned */ .leqlogos-heading{ margin-bottom:50px; } .leqlogos-row{ display:flex; align-items:center; justify-content:space-between; gap:48px; flex-wrap:wrap; } .leqlogos-item img{ max-height:78px; width:auto; transition:transform .3s ease; } .leqlogos-item:hover img{ transform:scale(1.06); } /* ============ TESTIMONIALS ============ */ .leqtest{ background:var(--leq-light); padding:90px 0; } .leqtest-eyebrow{ text-align:center; } .leqtest-heading{ text-align:center; margin-bottom:46px; } .leqtest-carousel{ position:relative; display:flex; align-items:center; gap:14px; } .leqtest-track{ display:flex; gap:28px; overflow-x:auto; scroll-snap-type:x mandatory; scroll-behavior:smooth; padding:6px; -ms-overflow-style:none; scrollbar-width:none; } .leqtest-track::-webkit-scrollbar{ display:none; } .leqtest-card{ flex:0 0 calc(50% - 14px); scroll-snap-align:start; background:#fff; border:1px solid rgba(29,31,78,.08); border-radius:8px; padding:34px; box-shadow:0 10px 30px rgba(29,31,78,.06); } .leqtest-stars{ color:var(--leq-coral); letter-spacing:3px; margin-bottom:16px; } .leqtest-quote{ color:var(--leq-grey); font-size:1.02rem; line-height:1.7; font-style:italic; margin:0 0 24px; } .leqtest-person{ display:flex; align-items:center; gap:14px; } .leqtest-photo{ width:52px; height:52px; border-radius:50%; object-fit:cover; } .leqtest-meta{ display:flex; flex-direction:column; } .leqtest-name{ font-weight:700; color:var(--leq-navy); } .leqtest-role{ color:var(--leq-grey); font-size:.9rem; } .leqtest-arrow{ flex:0 0 auto; width:46px; height:46px; border-radius:50%; border:0; background:var(--leq-navy); color:#fff; font-size:1.1rem; cursor:pointer; transition:background .2s; } .leqtest-arrow:hover{ background:var(--leq-coral); } /* ============ CTA ============ */ .leqcta{ padding:80px 0; text-align:center; } .leqcta--bg-navy{ background:var(--leq-navy); } .leqcta--bg-coral{ background:var(--leq-coral); } .leqcta--bg-light{ background:var(--leq-light); } /* CTA stays a deliberately narrow, centred column inside the container gutter */ .leqcta-inner{ max-width:880px; margin:0 auto; } .leqcta-heading{ font-family:var(--font1,'Poppins'),sans-serif; font-weight:800; font-size:40px; line-height:1.12; margin:0 0 18px; color:#fff; } .leqcta--bg-light .leqcta-heading{ color:var(--leq-navy); } .leqcta-text{ color:rgba(255,255,255,.9); font-size:1.1rem; margin:0 0 28px; } .leqcta--bg-light .leqcta-text{ color:var(--leq-grey); } .leqcta-buttons{ display:flex; gap:16px; justify-content:center; flex-wrap:wrap; } /* 2-column split (body copy present): heading + text left, buttons right */ .leqcta--split .leqcta-inner{ max-width:none; display:flex; align-items:center; justify-content:space-between; gap:56px; text-align:left; } .leqcta--split .leqcta-body{ flex:1 1 auto; max-width:760px; } .leqcta--split .leqcta-heading{ font-size:46px; margin:0 0 20px; } .leqcta--split .leqcta-text{ margin:0; } .leqcta--split .leqcta-buttons{ flex:0 0 auto; justify-content:flex-end; } /* ============ CARDS (powder-accent 2-up grid) ============ */ .leqcards{ padding:90px 0; } .leqcards--bg-light{ background:var(--leq-light); } .leqcards--bg-white{ background:#fff; } .leqcards-heading{ text-align:center; margin:0 auto 50px; max-width:900px; } .leqcards-eyebrow{ text-align:center; } .leqcards-inner{ max-width:1100px; } .leqcards-grid{ display:grid; grid-template-columns:1fr 1fr; gap:32px; } .leqcard{ position:relative; display:flex; background:#fff; border:1px solid #ececf3; border-radius:0; overflow:hidden; box-shadow:0 20px 55px rgba(20,21,60,.07); transition:transform .35s ease, box-shadow .35s ease; } .leqcard:hover{ transform:translateY(-6px); box-shadow:0 28px 70px rgba(20,21,60,.13); } /* powder image is an absolute decorative element anchored to a bottom corner */ .leqcard-powder{ position:absolute; bottom:-34px; z-index:0; width:74%; max-width:460px; height:auto; pointer-events:none; user-select:none; } .leqcard--bottomleft .leqcard-powder{ left:-48px; } .leqcard--bottomright .leqcard-powder{ right:-48px; } /* content rides above the powder in its own padded wrapper */ .leqcard-inner{ position:relative; z-index:1; display:flex; flex-direction:column; width:100%; min-height:460px; padding:46px 44px; } .leqcard-heading{ font-family:var(--font1,'Poppins'),sans-serif; font-weight:800; font-size:30px; line-height:1.12; color:var(--leq-navy); margin:0 0 18px; } .leqcard-text{ color:var(--leq-grey); font-size:1.02rem; line-height:1.7; } .leqcard-text p{ margin:0 0 14px; } .leqcard-text p:last-child{ margin-bottom:0; } /* button drops to the bottom, on the side opposite the powder */ .leqcard-btn{ margin-top:auto; align-self:flex-start; } .leqcard-text{ margin-bottom:40px; } .leqcard--bottomleft .leqcard-btn{ align-self:flex-end; } .leqcard--bottomright .leqcard-btn{ align-self:flex-start; } @media (max-width:860px){ .leqcards-grid{ grid-template-columns:1fr; gap:24px; } .leqcard-inner{ padding:40px 30px; min-height:420px; } .leqcard-powder{ width:66%; } } /* ============ PRICING ============ */ .leqpricing{ background:var(--leq-navy); padding:90px 0; } .leqpricing-inner{ text-align:center; } .leqpricing-heading{ margin-bottom:54px; color:#fff; } .leqpricing-grid{ display:flex; gap:0; justify-content:center; align-items:stretch; max-width:900px; margin:0 auto; } .leqpricing-card{ background:transparent; border:0; border-radius:0; box-shadow:none; padding:6px 56px; min-width:0; flex:1 1 0; } .leqpricing-card + .leqpricing-card{ border-left:1px solid rgba(255,255,255,.22); } .leqpricing-pre{ text-transform:uppercase; letter-spacing:.18em; color:rgba(255,255,255,.85); font-size:.78rem; font-weight:700; margin-bottom:18px; } .leqpricing-price{ font-family:var(--font1,'Poppins'),sans-serif; font-weight:800; color:var(--leq-coral); font-size:4rem; line-height:1; } .leqpricing-cur{ color:#fff; font-size:.62em; vertical-align:.34em; margin-right:.02em; font-weight:300; } .leqpricing-period{ text-transform:uppercase; letter-spacing:.14em; color:rgba(255,255,255,.85); font-size:.82rem; font-weight:700; margin-top:18px; } .leqpricing-note{ display:none; } .leqpricing .leq-eyebrow{ display:none; } .leqpricing .leq-btn{ display:none; } /* ============ STEPS ============ */ .leqsteps{ background:#fff; padding:90px 0; } .leqsteps-eyebrow,.leqsteps-heading{ text-align:center; } .leqsteps-sub{ text-align:center; color:var(--leq-grey); max-width:640px; margin:0 auto 50px; } .leqsteps-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:32px; } .leqsteps-step{ background:var(--leq-light); border-radius:8px; padding:40px 32px; } .leqsteps-num{ width:54px; height:54px; border-radius:50%; background:var(--leq-coral); color:#fff; font-family:var(--font1,'Poppins'),sans-serif; font-weight:800; font-size:1.4rem; display:flex; align-items:center; justify-content:center; margin-bottom:22px; } .leqsteps-title{ font-family:var(--font1,'Poppins'),sans-serif; color:var(--leq-navy); font-size:1.25rem; margin:0 0 16px; } .leqsteps-list{ list-style:none; margin:0; padding:0; } .leqsteps-list li{ color:var(--leq-grey); padding:8px 0 8px 22px; position:relative; border-top:1px solid rgba(29,31,78,.08); } .leqsteps-list li:first-child{ border-top:0; } .leqsteps-list li::before{ content:"›"; position:absolute; left:0; color:var(--leq-coral); font-weight:700; } /* ============ CONTACT ============ */ .leqcontact{ background:#fff; padding:90px 0; } .leqcontact-grid{ display:grid; grid-template-columns:1fr 1.15fr; gap:64px; align-items:start; } .leqcontact-heading{ margin-bottom:18px; } .leqcontact-intro{ color:var(--leq-grey); font-size:1.08rem; line-height:1.7; margin-bottom:30px; } .leqcontact-details{ list-style:none; margin:0; padding:0; } .leqcontact-details li{ display:flex; flex-direction:column; gap:4px; padding:18px 0; border-top:1px solid rgba(29,31,78,.1); } .leqcontact-details li:first-child{ border-top:0; } .leqcontact-label{ font-family:var(--font1,'Poppins'),sans-serif; text-transform:uppercase; letter-spacing:.16em; font-weight:600; font-size:.74rem; color:var(--leq-coral); } .leqcontact-details a{ color:var(--leq-navy); text-decoration:none; font-size:1.1rem; font-weight:600; } .leqcontact-details a:hover{ color:var(--leq-coral); } .leqcontact-details span:not(.leqcontact-label){ color:var(--leq-navy); font-size:1.05rem; line-height:1.5; } .leqcontact-form{ background:var(--leq-light); border-radius:8px; padding:44px; box-shadow:0 12px 34px rgba(29,31,78,.07); } .leqcontact-form-title{ font-family:var(--font1,'Poppins'),sans-serif; font-weight:700; color:var(--leq-navy); font-size:1.5rem; margin:0 0 24px; } /* Gravity Forms theme overrides — GF 2.7+ wrapper is .gform_wrapper.gform-theme */ .leqcontact-form .gform_wrapper.gform-theme .gform_fields{ gap:18px; } .leqcontact-form .gform_wrapper.gform-theme .gfield_label{ font-family:var(--font1,'Poppins'),sans-serif !important; font-weight:600 !important; color:var(--leq-navy) !important; font-size:.9rem !important; } .leqcontact-form .gform_wrapper.gform-theme input:not([type=submit]):not([type=button]):not([type=radio]):not([type=checkbox]), .leqcontact-form .gform_wrapper.gform-theme textarea, .leqcontact-form .gform_wrapper.gform-theme select{ border:1px solid rgba(29,31,78,.18) !important; border-radius:3px !important; background:#fff !important; padding:13px 14px !important; font-size:1rem !important; } .leqcontact-form .gform_wrapper.gform-theme input:focus, .leqcontact-form .gform_wrapper.gform-theme textarea:focus, .leqcontact-form .gform_wrapper.gform-theme select:focus{ border-color:var(--leq-coral) !important; box-shadow:0 0 0 3px rgba(232,80,46,.12) !important; outline:0 !important; } .leqcontact-form .gform_wrapper.gform-theme .gform_footer input[type=submit], .leqcontact-form .gform_wrapper.gform-theme .gform_footer button{ background:var(--leq-coral) !important; color:#fff !important; border:0 !important; font-family:var(--font1,'Poppins'),sans-serif !important; text-transform:uppercase !important; letter-spacing:.06em !important; font-weight:600 !important; font-size:.92rem !important; padding:16px 34px !important; border-radius:2px !important; cursor:pointer !important; transition:transform .2s, box-shadow .2s !important; } .leqcontact-form .gform_wrapper.gform-theme .gform_footer input[type=submit]:hover, .leqcontact-form .gform_wrapper.gform-theme .gform_footer button:hover{ transform:translateY(-2px) !important; box-shadow:0 12px 26px rgba(0,0,0,.18) !important; } /* Contact layout: form (left) + contact-details sidebar (right) */ .leqcontact--with-sidebar{ background:var(--leq-light); } .leqcontact--with-sidebar .leqcontact-grid{ grid-template-columns:1.42fr 1fr; gap:72px; align-items:start; } .leqcontact--with-sidebar .leqcontact-heading{ margin-bottom:28px; } .leqcontact--with-sidebar .leqcontact-form{ background:transparent !important; box-shadow:none !important; padding:0 !important; border-radius:0 !important; } .leqcontact-sidebar{ padding-top:6px; } .leqcontact-details--sidebar{ list-style:none; margin:0; padding:0; } .leqcontact-details--sidebar .leqcontact-detail{ display:block; padding:0; border:0; margin:0 0 36px; } .leqcontact-details--sidebar .leqcontact-detail:last-child{ margin-bottom:0; } .leqcontact-details--sidebar .leqcontact-label{ display:block; text-transform:uppercase; letter-spacing:.07em; font-family:var(--font1,'Poppins'),sans-serif; font-weight:700; color:var(--leq-navy); font-size:.95rem; margin-bottom:14px; } .leqcontact-value{ display:flex; align-items:flex-start; gap:14px; } .leqcontact-icon{ flex:0 0 auto; color:var(--leq-coral); display:flex; align-items:center; } .leqcontact-icon svg{ width:26px; height:26px; display:block; } .leqcontact-details--sidebar .leqcontact-value a, .leqcontact-details--sidebar .leqcontact-value > span:not(.leqcontact-icon){ color:var(--leq-navy); font-size:1.22rem; font-weight:500; line-height:1.4; text-decoration:none; } .leqcontact-details--sidebar .leqcontact-value a:hover{ color:var(--leq-coral); } /* Multi-step progress indicator (1 — 2) */ .leqcontact-form .gf_page_steps{ display:flex !important; align-items:center; width:100%; margin:6px 0 40px !important; padding:0 !important; border:0 !important; } .leqcontact-form .gf_step{ display:flex !important; align-items:center; padding:0 !important; margin:0 !important; min-height:0 !important; opacity:1 !important; height:auto !important; } .leqcontact-form .gf_step_last{ flex:1 1 auto; } .leqcontact-form .gf_step_last::before{ content:""; flex:1 1 auto; height:1px; background:rgba(29,31,78,.25); margin:0 18px; } .leqcontact-form .gf_step_number{ width:36px !important; height:36px !important; min-width:36px !important; border-radius:50% !important; border:1px solid rgba(29,31,78,.35) !important; background:#fff !important; color:var(--leq-navy) !important; display:flex !important; align-items:center; justify-content:center; font-family:var(--font1),sans-serif !important; font-weight:600 !important; font-size:.95rem !important; margin:0 !important; line-height:1 !important; } .leqcontact-form .gf_step_active .gf_step_number{ background:var(--leq-navy) !important; color:#fff !important; border-color:var(--leq-navy) !important; } .leqcontact-form .gf_step_label{ display:none !important; } .leqcontact-form .gfield--type-captcha .gfield_label{ display:none !important; } /* Multi-step nav buttons: Next (coral, full-width step 1), Previous (navy) + Submit (coral) step 2 */ .leqcontact-form .gform_page_footer{ display:flex !important; gap:20px; margin:8px 0 0 !important; padding:0 !important; border:0 !important; } .leqcontact-form .gform_next_button, .leqcontact-form .gform_previous_button, .leqcontact-form .gform_page_footer .gform_button{ flex:1 1 0 !important; width:auto !important; border:0 !important; color:#fff !important; font-family:var(--font1),sans-serif !important; text-transform:uppercase !important; letter-spacing:.06em !important; font-weight:700 !important; font-size:.95rem !important; padding:18px 28px !important; border-radius:2px !important; cursor:pointer !important; transition:transform .2s, box-shadow .2s !important; margin:0 !important; } .leqcontact-form .gform_next_button{ background:var(--leq-coral) !important; } .leqcontact-form .gform_previous_button{ background:var(--leq-navy) !important; } .leqcontact-form .gform_page_footer .gform_button{ background:var(--leq-coral) !important; } .leqcontact-form .gform_next_button:hover, .leqcontact-form .gform_previous_button:hover, .leqcontact-form .gform_page_footer .gform_button:hover{ transform:translateY(-2px) !important; box-shadow:0 12px 26px rgba(0,0,0,.18) !important; } /* ============ RESPONSIVE ============ */ @media (max-width:1199px){ .leqfeature-split{ gap:40px; } .leqsteps-grid{ grid-template-columns:1fr; max-width:560px; margin:0 auto; } .leqtest-card{ flex-basis:calc(70% - 14px); } } @media (max-width:767px){ .leq-heading{ font-size:34px; } .leqfeature-split .leqfeature-media img{ min-height:300px; } .leqfeature--splitbleed .leqfeature-media img{ min-height:320px; } .leqfeature--splitbleed .leqfeature-content{ padding:40px 24px; } /* "We Champion" reverts to stacked image-over-text on mobile (text over pink) */ .leqfeature--splitbleed.leqfeature--bg-pink .leqfeature-split{ display:block; min-height:0; } .leqfeature--splitbleed.leqfeature--bg-pink .leqfeature-media{ position:relative; } .leqfeature--splitbleed.leqfeature--bg-pink .leqfeature-content{ width:100%; } .leqhero-heading{ font-size:38px; } .leqstats-num{ font-size:52px; } .leqcta-heading{ font-size:28px; } .leqcta--split .leqcta-inner{ flex-direction:column; align-items:flex-start; gap:28px; } .leqcta--split .leqcta-heading{ font-size:30px; } .leqcta--split .leqcta-buttons{ justify-content:flex-start; } .leqhero{ min-height:520px; } .leqhero-inner{ padding-top:48px; padding-bottom:48px; } .leqstats-inner{ gap:48px; } .leqfeature{ padding:56px 0; } .leqfeature-split{ grid-template-columns:1fr; } .leqfeature-img-right .leqfeature-media{ order:0; } .leqfeature-row{ grid-template-columns:1fr; gap:28px; } .leqcircles-row{ gap:28px; } .leqcircles-item{ width:160px; } .leqcircles-circle{ width:150px; height:150px; } /* logos become a centered one-at-a-time swipe slider */ .leqlogos-row{ flex-wrap:nowrap; overflow-x:auto; scroll-snap-type:x mandatory; gap:0; scrollbar-width:none; -ms-overflow-style:none; } .leqlogos-row::-webkit-scrollbar{ display:none; } .leqlogos-item{ flex:0 0 100%; display:flex; justify-content:center; scroll-snap-align:center; } /* testimonials: full-width card (30px gutters), arrows centered below the slider */ .leqtest-inner{ padding-left:30px; padding-right:30px; } .leqtest-carousel{ flex-wrap:wrap; justify-content:center; gap:20px 14px; } .leqtest-track{ order:1; flex:0 0 100%; width:100%; padding:6px 0; } .leqtest-prev{ order:2; } .leqtest-next{ order:3; } .leqtest-card{ flex:0 0 100%; padding:28px; } .leqtest-quote{ font-size:.95rem; } .leqpricing-grid{ flex-direction:column; gap:0; } .leqpricing-card{ min-width:0; width:100%; padding:28px 0; } .leqpricing-card + .leqpricing-card{ border-left:0; border-top:1px solid rgba(255,255,255,.22); } .leqcontact-grid{ grid-template-columns:1fr; gap:40px; } .leqcontact--with-sidebar .leqcontact-grid{ grid-template-columns:1fr; gap:44px; } .leqcontact-form{ padding:30px; } } /* ============ TIMELINE (What We Manage) ============ */ .leqtimeline{ background:#fff; padding:80px 0; } .leqtimeline-track{ position:relative; } /* vertical coral dotted spine running through the icon centres */ .leqtimeline-track::before{ content:""; position:absolute; left:39px; top:40px; bottom:40px; border-left:3px dotted var(--leq-coral); } .leqtimeline-item{ position:relative; display:flex; align-items:flex-start; gap:42px; } .leqtimeline-item + .leqtimeline-item{ margin-top:40px; } .leqtimeline-marker{ flex:0 0 80px; width:80px; height:80px; border-radius:50%; border:4px solid var(--leq-coral); background:#fff; display:flex; align-items:center; justify-content:center; position:relative; z-index:1; box-shadow:0 6px 18px rgba(29,31,78,.12); } .leqtimeline-icon{ width:34px; height:34px; fill:var(--leq-coral); display:block; } .leqtimeline-card{ flex:1 1 auto; background:var(--leq-navy); color:#fff; padding:30px 44px; border-radius:2px; } .leqtimeline-heading{ font-family:var(--font1,'Poppins'),sans-serif; font-weight:800; color:#fff; font-size:34px; line-height:1.1; letter-spacing:-.01em; margin:0 0 8px; } .leqtimeline-list{ margin:0; padding-left:22px; } .leqtimeline-list li{ color:#fff; font-size:1.05rem; line-height:1.55; margin:2px 0; } /* ============ MEDIA CARDS (Flexible Options) ============ */ .leqmediacards{ padding:90px 0; } .leqmediacards--bg-light{ background:var(--leq-light); } .leqmediacards--bg-white{ background:#fff; } .leqmediacards-inner{ text-align:center; max-width:1200px; } .leqmediacards-heading{ margin:0 0 8px; } .leqmediacards-sub{ font-size:1.5rem; color:var(--leq-navy); font-weight:500; margin:0 0 48px; } .leqmediacards-grid{ display:grid; grid-template-columns:1fr 1fr; gap:30px; text-align:left; } .leqmediacard{ position:relative; min-height:320px; display:flex; align-items:center; padding:48px 52px; overflow:hidden; background-size:cover; background-position:center; } .leqmediacard-overlay{ position:absolute; inset:0; background:rgba(20,21,60,.8); } .leqmediacard-content{ position:relative; z-index:1; color:#fff; max-width:92%; } .leqmediacard-heading{ font-family:var(--font1,'Poppins'),sans-serif; font-weight:800; color:#fff; font-size:46px; line-height:1.05; letter-spacing:-.01em; margin:0 0 14px; } .leqmediacard-heading u{ text-decoration:underline; text-decoration-color:var(--leq-coral); text-decoration-thickness:9px; text-underline-offset:-3px; text-decoration-skip-ink:none; } .leqmediacard-text{ font-size:1.12rem; line-height:1.55; color:#fff; } .leqmediacard-text p{ margin:0 0 .8em; color:#fff; } .leqmediacard-text p:last-child{ margin-bottom:0; } /* ---- leqpricing: show + style notes when opted in (managed strip) ---- */ .leqpricing--notes .leqpricing-note{ display:block; margin-top:14px; text-transform:uppercase; letter-spacing:.14em; color:rgba(255,255,255,.85); font-size:.82rem; font-weight:700; } /* ---- leqfeature diagram variant: show a transparent diagram uncropped ---- */ .leqfeature--diagram .leqfeature-split .leqfeature-media img{ min-height:0; height:auto; object-fit:contain; border-radius:0; } @media (max-width:1199px){ .leqtimeline-card{ padding:26px 34px; } .leqtimeline-heading{ font-size:30px; } } @media (max-width:767px){ .leqtimeline{ padding:56px 0; } .leqtimeline-track::before{ left:27px; top:28px; bottom:28px; border-left-width:2px; } .leqtimeline-item{ gap:22px; } .leqtimeline-item + .leqtimeline-item{ margin-top:28px; } .leqtimeline-marker{ flex-basis:56px; width:56px; height:56px; border-width:3px; } .leqtimeline-icon{ width:24px; height:24px; } .leqtimeline-card{ padding:22px 24px; } .leqtimeline-heading{ font-size:24px; } .leqtimeline-list li{ font-size:1rem; } .leqmediacards{ padding:56px 0; } .leqmediacards-sub{ font-size:1.2rem; margin-bottom:32px; } .leqmediacards-grid{ grid-template-columns:1fr; } .leqmediacard{ min-height:260px; padding:40px 32px; } .leqmediacard-heading{ font-size:36px; } } /* ============ HISTORY (Who We Are timeline scroller) ============ */ .leqhistory{ padding:90px 0; } .leqhistory--bg-navy{ background:var(--leq-navy); color:#fff; } .leqhistory--bg-light{ background:var(--leq-light); } .leqhistory--bg-white{ background:#fff; } .leqhistory-grid{ display:grid; grid-template-columns:1fr 1fr; gap:64px; align-items:center; } .leqhistory--bg-navy .leq-heading{ color:#fff; } .leqhistory-heading{ margin-bottom:18px; } .leqhistory-text{ color:rgba(255,255,255,.9); font-size:1.05rem; line-height:1.7; } .leqhistory-text p{ margin:0 0 1em; color:inherit; } .leqhistory-text p:last-child{ margin-bottom:0; } .leqhistory--bg-light .leqhistory-text, .leqhistory--bg-white .leqhistory-text{ color:var(--leq-grey); } /* timeline scroller */ .leqhistory-timeline{ text-align:center; } .leqhistory-year{ font-family:var(--font1,'Poppins'),sans-serif; font-weight:800; font-size:58px; line-height:1; color:#fff; } .leqhistory--bg-light .leqhistory-year, .leqhistory--bg-white .leqhistory-year{ color:var(--leq-navy); } .leqhistory-subtitle{ text-transform:uppercase; letter-spacing:.16em; font-weight:700; font-size:.92rem; color:rgba(255,255,255,.85); margin-top:10px; } .leqhistory--bg-light .leqhistory-subtitle, .leqhistory--bg-white .leqhistory-subtitle{ color:var(--leq-grey); } .leqhistory-track{ display:flex; align-items:center; justify-content:center; gap:16px; margin:30px 0 6px; } .leqhistory-arrow{ background:transparent; border:0; color:inherit; font-size:2.2rem; line-height:1; cursor:pointer; padding:0 8px; transition:color .2s ease, transform .2s ease; } .leqhistory-arrow:hover{ color:var(--leq-coral); transform:scale(1.12); } .leqhistory-line{ position:relative; flex:1 1 auto; max-width:340px; height:2px; background:rgba(255,255,255,.35); display:flex; align-items:center; justify-content:center; } .leqhistory--bg-light .leqhistory-line, .leqhistory--bg-white .leqhistory-line{ background:rgba(29,31,78,.2); } .leqhistory-marker{ width:64px; height:64px; border-radius:50%; background:var(--leq-coral); display:flex; align-items:center; justify-content:center; box-shadow:0 0 0 7px var(--leq-navy); } .leqhistory--bg-light .leqhistory-marker, .leqhistory--bg-white .leqhistory-marker{ box-shadow:0 0 0 7px var(--leq-light); } .leqhistory-marker svg{ width:26px; height:26px; fill:#fff; display:block; } .leqhistory-dots{ display:flex; gap:10px; justify-content:center; margin:20px 0 14px; } .leqhistory-dot{ width:10px; height:10px; border-radius:50%; border:0; padding:0; cursor:pointer; background:rgba(255,255,255,.35); transition:background .2s ease, transform .2s ease; } .leqhistory--bg-light .leqhistory-dot, .leqhistory--bg-white .leqhistory-dot{ background:rgba(29,31,78,.2); } .leqhistory-dot.is-active{ background:var(--leq-coral); transform:scale(1.3); } .leqhistory-desc{ color:rgba(255,255,255,.9); font-size:1.05rem; line-height:1.6; max-width:430px; margin:6px auto 0; min-height:5em; } .leqhistory--bg-light .leqhistory-desc, .leqhistory--bg-white .leqhistory-desc{ color:var(--leq-grey); } /* ============ PHILOSOPHY (Who We Are panels) ============ */ /* white section; splash images bleed off the page (container-fluid) edges, BEHIND centered whitesmoke cards; coral arrows connect the rows */ .leqphilosophy{ padding:90px 0; position:relative; overflow:hidden; } .leqphilosophy--bg-white{ background:#fff; } .leqphilosophy--bg-light{ background:var(--leq-light); } .leqphil-row{ position:relative; } .leqphil-splash{ position:absolute; width:480px; max-width:46vw; height:auto; opacity:.95; pointer-events:none; z-index:0; } .leqphil-row--splash-right .leqphil-splash{ right:-30px; top:-40px; } .leqphil-row--splash-left .leqphil-splash{ left:-30px; bottom:-40px; } .leqphil-rowinner{ position:relative; z-index:1; } .leqphil-card{ background:#f4f4f4; border-radius:2px; padding:48px 56px; max-width:820px; margin:0 auto; } .leqphil-cards{ display:grid; grid-template-columns:1fr 1fr; gap:30px; max-width:1120px; margin:0 auto; } .leqphil-cards .leqphil-card{ max-width:none; margin:0; } .leqphil-heading{ font-family:var(--font1,'Poppins'),sans-serif; font-weight:800; font-size:38px; line-height:1.12; color:var(--leq-navy); margin:0 0 14px; } .leqphil-heading u{ text-decoration:underline; text-decoration-color:var(--leq-coral); text-decoration-thickness:9px; text-underline-offset:-3px; text-decoration-skip-ink:none; } .leqphil-text{ color:var(--leq-grey); font-size:1.08rem; line-height:1.7; } .leqphil-text p{ margin:0; color:inherit; } .leqphil-connector{ position:relative; z-index:1; display:flex; justify-content:center; padding:14px 0; } .leqphil-connector .leqphil-arrow{ width:30px; height:40px; fill:var(--leq-coral); display:block; } @media (max-width:991px){ .leqhistory-grid{ gap:44px; } } @media (max-width:767px){ .leqhistory{ padding:56px 0; } .leqhistory-grid{ grid-template-columns:1fr; gap:38px; } .leqhistory-year{ font-size:44px; } .leqhistory-line{ max-width:none; } .leqhistory-desc{ min-height:0; } .leqphilosophy{ padding:56px 0; } .leqphil-card{ padding:32px 28px; } .leqphil-heading{ font-size:27px; } .leqphil-cards{ grid-template-columns:1fr; gap:20px; } .leqphil-splash{ width:230px; max-width:60vw; opacity:.55; } } /* ============================================================ LEQ Services — navy section, 3-up bordered card grid, white text (used for both "Our Services" cards and the "Adaptive Marketing" trio) ============================================================ */ .leqservices{ background:var(--leq-navy); color:#fff; padding:84px 0; } .leqservices-heading{ color:#fff; text-align:center; font-size:44px; margin:0 0 14px; } .leqservices-subheading{ text-align:center; color:#fff; font-size:20px; line-height:1.45; max-width:900px; margin:0 auto 18px; } .leqservices-grid{ display:grid; grid-template-columns:repeat(3,1fr); border-top:1px solid rgba(255,255,255,.14); border-left:1px solid rgba(255,255,255,.14); margin-top:34px; } .leqservice{ padding:46px 38px; border-right:1px solid rgba(255,255,255,.14); border-bottom:1px solid rgba(255,255,255,.14); } .leqservice-icon{ width:66px; height:66px; border-radius:50%; background:var(--leq-coral); display:flex; align-items:center; justify-content:center; margin-bottom:24px; } .leqservice-icon svg{ width:30px; height:30px; } .leqservice-heading{ font-family:var(--font1,'Poppins'),sans-serif; font-weight:800; font-size:28px; line-height:1.14; margin:0 0 16px; color:#fff; } .leqservice-text{ font-size:16px; line-height:1.6; color:#fff; } .leqservice-text p, .leqservice-text li{ color:#fff; } .leqservice-text p{ margin:0 0 14px; } .leqservice-text p:last-child{ margin-bottom:0; } .leqservice-text ul{ margin:0; padding-left:20px; } .leqservice-text li{ margin-bottom:8px; } .leqservice-text strong{ color:#fff; } .leqservices-cta{ text-align:center; padding-top:48px; } @media (max-width:991px){ .leqservices{ padding:60px 0; } .leqservices-heading{ font-size:34px; } .leqservices-grid{ grid-template-columns:repeat(2,1fr); } .leqservice{ padding:38px 30px; } .leqservice-heading{ font-size:25px; } } @media (max-width:767px){ .leqservices-grid{ grid-template-columns:1fr; } .leqservice{ padding:34px 24px; } } /* Circles — navy variant (pillars row on a dark band) */ .leqcircles--navy{ background:var(--leq-navy); } .leqcircles--navy .leqcircles-label{ color:#fff; } /* ============================================================ LEQ Intro — two text columns + a chart image (post-hero narrative) ============================================================ */ .leqintro{ background:#fff; padding:84px 0; } .leqintro-grid{ display:grid; grid-template-columns:1fr 1fr; gap:56px; align-items:start; } .leqintro-col{ font-size:16px; line-height:1.75; color:#333; } .leqintro-col p{ margin:0 0 18px; } .leqintro-col p:last-child{ margin-bottom:0; } .leqintro-img{ width:100%; height:auto; margin-top:30px; display:block; } @media (max-width:991px){ .leqintro{ padding:56px 0; } .leqintro-grid{ grid-template-columns:1fr; gap:28px; } } /* ============================================================ LEQ Legal — title + sticky TOC sidebar + body (clone of live) ============================================================ */ .leqlegal{ padding:0; } .leqlegal-title{ text-align:center; font-size:48px; margin:64px 0 56px; } .leqlegal-grid{ display:grid; grid-template-columns:360px 1fr; gap:64px; align-items:start; max-width:1200px; margin:0 auto; padding-bottom:96px; } /* TOC sidebar */ .leqlegal-toc{ position:sticky; top:120px; background:#f4f4f4; } .leqlegal-toc-head{ display:flex; align-items:center; justify-content:space-between; padding:20px 22px; border-bottom:1px solid #e0e0e0; } .leqlegal-toc-label{ font-family:var(--font1,'Poppins'),sans-serif; font-weight:700; font-size:20px; color:var(--leq-navy); } .leqlegal-toc-toggle{ background:none; border:0; padding:0; cursor:pointer; color:var(--leq-navy); display:flex; align-items:center; transition:transform .25s ease; } .leqlegal-toc.is-collapsed .leqlegal-toc-toggle{ transform:rotate(180deg); } .leqlegal-toc-list{ list-style:none; margin:0; padding:18px 22px; max-height:1000px; overflow:hidden; transition:max-height .3s ease, padding .3s ease; } .leqlegal-toc.is-collapsed .leqlegal-toc-list{ max-height:0; padding-top:0; padding-bottom:0; } .leqlegal-toc-list li{ margin-bottom:12px; } .leqlegal-toc-list li:last-child{ margin-bottom:0; } .leqlegal-toc-list a{ color:var(--leq-navy); font-size:16px; line-height:1.4; text-decoration:none; display:block; } .leqlegal-toc-list a:hover{ color:var(--leq-coral); } /* Body */ .leqlegal-body{ color:#333; } .leqlegal-body h2{ font-family:var(--font1,'Poppins'),sans-serif; color:var(--leq-navy); font-weight:800; font-size:24px; line-height:1.25; margin:38px 0 14px; scroll-margin-top:120px; } .leqlegal-body h3{ font-family:var(--font1,'Poppins'),sans-serif; color:var(--leq-navy); font-weight:700; font-size:19px; margin:26px 0 12px; } .leqlegal-body p{ margin:0 0 16px; line-height:1.75; font-size:16px; } .leqlegal-body ul{ margin:0 0 16px; padding-left:22px; } .leqlegal-body li{ margin-bottom:9px; line-height:1.65; font-size:16px; } .leqlegal-body hr{ border:0; border-top:1px solid #ddd; margin:22px 0 26px; } .leqlegal-body a{ color:var(--leq-coral); } .leqlegal-body strong{ color:var(--leq-navy); } @media (max-width:991px){ .leqlegal-grid{ grid-template-columns:1fr; gap:28px; padding-bottom:64px; } .leqlegal-toc{ position:static; } .leqlegal-title{ font-size:36px; margin:44px 0 36px; } } @media (max-width:767px){ .leqlegal-title{ font-size:30px; } .leqlegal-toc-label{ font-size:18px; } }