/* avAdvisors Elementor Widgets — v2 Figma-matched
----------------------------------------------------------------- */
:root {
--avadv-navy: #013d57;
--avadv-navy-dark: #023953;
--avadv-navy-darkest: #064c6d;
--avadv-accent: #ec9c6f;
--avadv-accent-dark: #d78e65;
--avadv-teal: #68a5af;
--avadv-teal-dark: #1d6381;
--avadv-cream: #f8f5f1;
--avadv-cream-alt: #f2efeb;
--avadv-ink: #6b6a72;
--avadv-body: #3b4e57;
--avadv-heading: #38454a;
--avadv-muted: #949494;
--avadv-serif: "Zen Old Mincho", Georgia, serif;
--avadv-sans: "Red Hat Display", -apple-system, BlinkMacSystemFont, sans-serif;
--avadv-text: "Red Hat Text", -apple-system, BlinkMacSystemFont, sans-serif;
}
.avadv-header, .avadv-hero, .avadv-stats, .avadv-partners, .avadv-services,
.avadv-band, .avadv-difference, .avadv-founder, .avadv-testimonial,
.avadv-contact, .avadv-footer {
font-family: var(--avadv-text);
color: var(--avadv-ink);
box-sizing: border-box;
}
.avadv-header *, .avadv-hero *, .avadv-stats *, .avadv-partners *, .avadv-services *,
.avadv-band *, .avadv-difference *, .avadv-founder *, .avadv-testimonial *,
.avadv-contact *, .avadv-footer * { box-sizing: border-box; }
/* Prevent 100vw full-bleed sections from causing horizontal scroll.
Uses `clip` (not `hidden`) so it doesn't create a scroll container that
would break Lenis smooth scrolling. */
/* Contain the full-bleed 100vw sections WITHOUT putting overflow on the root —
overflow-x:clip on html/body makes Chromium (Linux) auto-hide the scrollbar
knob. Clipping on the Elementor page wrapper avoids that; the browser keeps
its normal scrollbar, the fixed header still escapes (no transform here). */
html, body { max-width: 100%; }
.elementor { overflow-x: clip; }
/* Lenis smooth-scroll base styles */
html.lenis, html.lenis body { height: auto; }
.lenis.lenis-smooth { scroll-behavior: auto !important; }
.lenis.lenis-smooth [data-lenis-prevent] { overscroll-behavior: contain; }
.lenis.lenis-stopped { overflow: clip; }
.lenis.lenis-smooth iframe { pointer-events: none; }
/* Full-bleed ---------------------------------------------------- */
.avadv-header, .avadv-hero, .avadv-stats, .avadv-partners, .avadv-services,
.avadv-band, .avadv-difference, .avadv-founder, .avadv-testimonial,
.avadv-contact, .avadv-footer {
width: 100vw;
max-width: 100vw;
margin-left: calc(50% - 50vw);
margin-right: calc(50% - 50vw);
}
.avadv-container { width: 100%; max-width: 1500px; margin: 0 auto; padding: 0 40px; }
/* Buttons -------------------------------------------------------- */
.avadv-btn {
display: inline-block; font-family: var(--avadv-sans); font-size: 15px; font-weight: 700; letter-spacing: .12em;
text-transform: uppercase; text-decoration: none; cursor: pointer;
padding: 19px 36px; border-radius: 3px; border: 1px solid transparent;
transition: all .2s ease; line-height: 1;
}
.avadv-hero .avadv-btn { border-radius: 14px; padding: 20px 44px; }
.avadv-btn--solid { background: var(--avadv-accent); color: #fff; }
.avadv-btn--solid:hover { background: var(--avadv-accent-dark); }
.avadv-header .avadv-btn { border-radius: 15px; }
.avadv-btn--outline { background: transparent; color: #fff; border-color: rgba(255,255,255,.6); }
.avadv-btn--outline:hover { background: rgba(255,255,255,.12); }
.avadv-eyebrow {
display: block; font-size: 13px; font-weight: 700; letter-spacing: .14em;
text-transform: uppercase; color: var(--avadv-accent-dark); margin-bottom: 10px;
font-family: var(--avadv-text);
}
.avadv-eyebrow-rule {
position: relative; display: flex; align-items: center;
width: 100%; height: 12px; margin-bottom: 32px;
}
.avadv-eyebrow-rule::after {
content: ''; flex: 1; height: 1px; background: rgba(56,69,74,.15); margin-left: 0;
}
.avadv-eyebrow-rule__decor {
display: block; width: 60px; height: 8px; flex: none; position: relative; z-index: 1; margin-left: -9px;
}
/* Section titles ------------------------------------------------- */
.avadv-section-title { font-family: var(--avadv-serif); font-weight: 700; line-height: 1.05; }
.avadv-section-title--left { font-size: 61px; color: var(--avadv-heading); text-align: left; margin: 0 0 36px; }
.avadv-section-title--light { font-size: 76px; color: #fff; text-align: center; margin: 0 0 14px; }
/* Header --------------------------------------------------------- */
.avadv-header { position: absolute; top: 0; left: 0; right: 0; z-index: 20; padding: 34px 0; transition: background .35s ease, padding .35s ease, box-shadow .35s ease, backdrop-filter .35s ease; }
/* Frosted-glass sticky state (toggled by effects.js once scrolled) */
.avadv-header--scrolled {
position: fixed; padding: 16px 0;
background: rgba(8, 46, 66, .45);
-webkit-backdrop-filter: saturate(160%) blur(16px);
backdrop-filter: saturate(160%) blur(16px);
border-bottom: none;
box-shadow: 0 8px 30px rgba(1, 31, 46, .25);
}
.avadv-header--scrolled .avadv-header__logo { height: 56px; transition: height .35s ease; }
.avadv-header__inner { display: flex; align-items: center; justify-content: flex-start; }
.avadv-header__brand { display: flex; align-items: center; text-decoration: none; }
.avadv-header__logo { height: 76px; width: auto; display: block; }
.avadv-header__nav { display: flex; align-items: center; gap: 40px; margin-left: auto; margin-right: 48px; }
.avadv-header__nav a { position: relative; color: #fff; font-family: var(--avadv-sans); font-size: 14px; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; text-decoration: none; opacity: .95; transition: opacity .2s; padding-top: 3px; }
.avadv-header__nav a::after { content: ""; position: absolute; left: 0; bottom: -7px; width: 100%; height: 2px; background: var(--avadv-accent); transform: scaleX(0); transform-origin: left center; transition: transform .28s ease; }
.avadv-header__nav a:hover { opacity: 1; }
.avadv-header__nav a:hover::after { transform: scaleX(1); }
/* Mobile nav toggle (hamburger) — hidden until tablet breakpoint */
.avadv-header__nav-cta { display: none; }
.avadv-header__toggle { display: none; appearance: none; background: none; border: 0; cursor: pointer; width: 44px; height: 44px; padding: 10px; margin-left: 18px; flex-direction: column; align-items: flex-end; justify-content: center; gap: 5px; }
/* Thin, uneven bars — modern asymmetric hamburger. */
.avadv-header__toggle-bar { display: block; height: 2px; background: #fff; border-radius: 99px; transition: width .3s ease, transform .3s ease, opacity .2s ease; }
.avadv-header__toggle-bar:nth-child(1) { width: 26px; }
.avadv-header__toggle-bar:nth-child(2) { width: 17px; }
.avadv-header__toggle-bar:nth-child(3) { width: 22px; }
/* On open, equalize the bars so they form a clean, symmetric X. */
.avadv-header--menu-open .avadv-header__toggle-bar { width: 26px; }
.avadv-header--menu-open .avadv-header__toggle-bar:nth-child(1) { transform: translateY(7px) rotate(45deg); }
.avadv-header--menu-open .avadv-header__toggle-bar:nth-child(2) { opacity: 0; }
.avadv-header--menu-open .avadv-header__toggle-bar:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }
/* Hero ----------------------------------------------------------- */
.avadv-hero {
position: relative; overflow: hidden; min-height: 100vh; display: flex; align-items: flex-start; margin-top: -2px;
background-image: var(--avadv-hero-bg); background-size: cover; background-position: center 40%; color: #fff;
}
/* Scaling image layer (driven by --avadv-hero-scale from effects.js) */
.avadv-hero::before {
content: ""; position: absolute; inset: 0; z-index: 0;
background: inherit; background-size: cover; background-position: center 40%;
transform: translate3d(0, calc(var(--avadv-hero-shift, 0px) * -1), 0) scale(var(--avadv-hero-scale, 1)); transform-origin: center center;
will-change: transform;
}
/* Gradient tint over the image */
.avadv-hero::after { content: ""; position: absolute; inset: 0; z-index: 1; background: linear-gradient(to bottom, rgba(1,61,87,.55) 0%, rgba(1,61,87,0) 200px), linear-gradient(90deg, rgba(1,61,87,.40), rgba(1,61,87,.03)); }
.avadv-hero__inner { position: relative; z-index: 2; padding-top: 230px; }
/* Rotating circular badge (bottom-right of hero) */
.avadv-badge { position: absolute; right: 6%; bottom: 8%; z-index: 2; width: 200px; height: 200px; pointer-events: none; }
.avadv-badge__ring { position: absolute; inset: 0; width: 100%; height: 100%; animation: avadv-badge-spin 18s linear infinite; transform-origin: center; }
.avadv-badge__ring text { fill: #fff; font-family: var(--avadv-sans); font-size: 14px; font-weight: 600; letter-spacing: .18em; }
.avadv-badge__mark { position: absolute; top: 50%; left: 50%; width: 64px; height: auto; transform: translate(-50%, -50%); }
@keyframes avadv-badge-spin { to { transform: rotate(360deg); } }
@media (prefers-reduced-motion: reduce) { .avadv-badge__ring { animation: none; } }
.avadv-hero__title { font-family: var(--avadv-serif); font-weight: 500; font-size: 96px; line-height: 1; margin: 0 0 30px; max-width: 900px; }
.avadv-hero__sub { font-family: var(--avadv-text); font-size: 23px; font-weight: 400; max-width: none; white-space: nowrap; margin: 0 0 42px; opacity: .85; line-height: 1.3; }
/* Trust Signals / Stats ------------------------------------------ */
.avadv-stats { background: var(--avadv-cream); padding: 50px 0; }
.avadv-stats__label { display: flex; align-items: center; gap: 10px; margin-bottom: 24px; }
.avadv-stats__label span { font-family: var(--avadv-text); font-size: 20px; font-weight: 500; color: var(--avadv-body); }
.avadv-stats__label svg { width: 27px; height: 27px; }
.avadv-stats__grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; }
.avadv-stat { display: flex; align-items: center; gap: 20px; background: #fff; padding: 24px 28px; border-radius: 11.02px; box-shadow: 0 6px 20px rgba(1,61,87,.06); }
.avadv-stat__icon { width: 121px; height: 121px; border-radius: 24px; flex: none; display: flex; align-items: center; justify-content: center; color: #fff; }
/* Letterbox every glyph into the same centered 46% box so wide (plane) and tall
(hourglass) icons read as the same visual size and never touch the square edges.
width/height:auto + max-* lets each viewBox scale to fit, preserving aspect ratio. */
.avadv-stat__icon svg { width: auto; height: auto; max-width: 46%; max-height: 46%; }
.avadv-stat:nth-child(1) .avadv-stat__icon { background: linear-gradient(145deg, #99c4c7, #96cfd3); }
.avadv-stat:nth-child(2) .avadv-stat__icon { background: linear-gradient(145deg, #076d97, #1a5b76); }
.avadv-stat:nth-child(3) .avadv-stat__icon { background: linear-gradient(145deg, #0a4f6e, #023953); }
.avadv-stat__value { font-family: var(--avadv-serif); font-size: 25px; color: var(--avadv-teal-dark); font-weight: 700; margin-bottom: 2px; }
.avadv-stat__label { font-family: var(--avadv-text); font-size: 14px; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; color: var(--avadv-accent-dark); }
/* Partners ------------------------------------------------------- */
.avadv-partners { background: var(--avadv-cream); padding: 70px 0 100px; }
.avadv-partners__heading { font-family: var(--avadv-serif); font-size: 76px; font-weight: 500; color: var(--avadv-body); line-height: 1.12; margin: 0 0 40px; max-width: 900px; white-space: nowrap; }
.avadv-partners__layout { display: grid; grid-template-columns: 440px 1fr; gap: 22px; align-items: stretch; }
.avadv-partners__media { height: 100%; }
.avadv-partners__media img { width: 100%; height: 100%; object-fit: cover; border-radius: 6px; display: block; }
.avadv-partners__cards { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; }
.avadv-card { background: #fff; padding: 40px; border-radius: 6px; box-shadow: 0 6px 20px rgba(1,61,87,.05); display: flex; flex-direction: column; justify-content: center; }
.avadv-card__icon { display: flex; align-items: center; justify-content: flex-start; width: 70px; height: 53px; margin-bottom: 26px; color: var(--avadv-accent); }
.avadv-card__text { font-family: var(--avadv-text); font-size: 21px; font-weight: 400; line-height: 1.5; color: var(--avadv-ink); margin: 0; }
.avadv-card__title { font-weight: 700; color: var(--avadv-body); }
/* Services ------------------------------------------------------- */
.avadv-services { position: relative; overflow: hidden; background: var(--avadv-navy); padding: 100px 0 110px; }
.avadv-services__video { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; z-index: 0; }
.avadv-services__overlay { position: absolute; inset: 0; z-index: 1; background: rgba(2,57,83,.82); }
.avadv-services__overlay::after { content: ''; position: absolute; inset: 0; background: radial-gradient(ellipse at center, transparent 30%, rgba(2,40,60,.5) 100%); }
.avadv-services__intro { text-align: center; color: rgba(255,255,255,.58); max-width: 700px; margin: 0 auto 50px; font-family: var(--avadv-text); font-size: 22px; font-weight: 400; line-height: 1.5; }
.avadv-services__list { display: flex; flex-direction: column; gap: 20px; }
.avadv-service-row { display: grid; grid-template-columns: 540px 1fr; gap: 56px; align-items: center; background: linear-gradient(118deg, rgba(255,255,255,.10), rgba(255,255,255,.08)); -webkit-backdrop-filter: blur(14px) saturate(140%); backdrop-filter: blur(14px) saturate(140%); border-radius: 12px; padding: 36px 44px; }
.avadv-service-row__head { display: flex; align-items: center; gap: 24px; }
.avadv-service-row__icon { width: 120px; height: 120px; border-radius: 14px; flex: none; display: flex; align-items: center; justify-content: center; padding: 28px; }
.avadv-service-row:nth-child(1) .avadv-service-row__icon { background: var(--avadv-accent-dark); }
.avadv-service-row:nth-child(2) .avadv-service-row__icon { background: linear-gradient(145deg, #1D6481, #1C6E91); }
.avadv-service-row:nth-child(3) .avadv-service-row__icon { background: var(--avadv-navy-darkest); }
/* Icons are ![]()
, not inline