:root{--suave-navy:#000836;--suave-cream:#FFF9E0;--suave-charcoal:#0B0F16;--suave-offwhite:#F6F3EB;--e-con-transform-transition-duration:0s}
html{scroll-padding-top:100px}
body{-webkit-font-smoothing:antialiased}
/* No underlines anywhere on the site */
a,a:hover,a:focus,a:visited,a:active{text-decoration:none!important}
/* Header states */
.suave-header{transition:background-color .35s ease,box-shadow .35s ease,transform .35s ease,padding .35s ease;will-change:transform}
.suave-header .suave-logo img{width:280px;max-width:100%;transition:filter .35s ease,width .35s ease}
.suave-header:not(.is-scrolled) .suave-logo img{filter:brightness(0) invert(1)}
.suave-header.is-scrolled{background-color:rgba(255,249,224,.97)!important;box-shadow:0 8px 30px rgba(0,8,54,.10)}
.suave-header.is-scrolled .suave-logo img{width:180px}
.suave-header.is-scrolled > .e-con-inner, .suave-header.is-scrolled{padding-top:2px!important;padding-bottom:2px!important}
/* Taller "on top of hero" (transparent) state only; the scrolled/solid state stays as compact as it is */
.suave-header:not(.is-scrolled) > .e-con-inner, .suave-header:not(.is-scrolled){padding-top:34px!important;padding-bottom:34px!important}
.suave-header.is-hidden{transform:translateY(-110%)}
/* Compact menu bar: ElementsKit's own default is 80px tall with generous item padding, forced down here */
.suave-header .elementskit-menu-container{height:52px!important;display:flex;align-items:center}
.suave-header .elementskit-navbar-nav{height:auto!important;align-items:center}
.suave-header .elementskit-navbar-nav > li{height:auto!important;display:flex;align-items:center}
.suave-header .elementskit-navbar-nav > li > a{height:auto!important;padding:8px 16px!important;line-height:1.2!important}
/* Menu colour + size: !important beats ElementsKit's own per-widget generated CSS, which otherwise wins on specificity */
.suave-header .elementskit-navbar-nav > li > a{color:var(--suave-cream)!important;font-size:26px!important;font-weight:500!important;transition:color .35s ease;position:relative}
.suave-header .elementskit-navbar-nav > li > a:hover,.suave-header .elementskit-navbar-nav > li.current-menu-item > a,.suave-header .elementskit-navbar-nav > li.current-menu-ancestor > a{color:rgba(255,249,224,.7)!important}
.suave-header.is-scrolled .elementskit-navbar-nav > li > a{color:var(--suave-navy)!important;font-size:19px!important}
.suave-header.is-scrolled .elementskit-navbar-nav > li > a:hover,.suave-header.is-scrolled .elementskit-navbar-nav > li.current-menu-item > a,.suave-header.is-scrolled .elementskit-navbar-nav > li.current-menu-ancestor > a{color:rgba(0,8,54,.6)!important}
/* Pen-drawn underline on menu hover: a single tapered ink/brush-stroke SVG shape (fat head,
   thinning tail with a small hooked flick, like a confident one-swipe pen mark) is injected per
   link by the JS below and revealed left-to-right on hover via a CSS clip-path wipe (inset()),
   which animates reliably and keeps the shape undistorted (unlike scaling it directly). The svg's
   own color is set explicitly (not inherited from the link) so the stroke stays fully opaque
   even when the link itself is in a translucent hover/active text colour. */
/* !important throughout: ElementsKit ships a generic svg icon-sizing rule (width/height:1em) that
   otherwise squashes our injected underline down to a tiny 1em x 1em box (font-size square) */
.suave-header .elementskit-navbar-nav > li > a .suave-pen-underline{position:absolute!important;left:16px!important;right:16px!important;top:auto!important;bottom:-9px!important;width:calc(100% - 32px)!important;height:16px!important;max-width:none!important;max-height:none!important;pointer-events:none;overflow:visible;opacity:0;clip-path:inset(0 100% 0 0);color:rgba(255,249,224,.7)!important}
@media (min-width:1025px){.suave-header.is-scrolled .elementskit-navbar-nav > li > a .suave-pen-underline{color:rgba(0,8,54,.55)!important;height:10px!important;bottom:-5px!important;left:22px!important;right:22px!important;width:calc(100% - 44px)!important}}
.suave-pen-underline path{fill:currentColor}
.suave-header .elementskit-navbar-nav > li.current-menu-item > a .suave-pen-underline,.suave-header .elementskit-navbar-nav > li.current-menu-ancestor > a .suave-pen-underline{opacity:1;clip-path:inset(0 0% 0 0)}
@media (max-width:1024px){.suave-header .elementskit-navbar-nav > li > a .suave-pen-underline{left:0!important;right:0!important;width:100%!important}}
/* Submenu chevron (the little arrow next to "Services"): ElementsKit hardcodes it #101010 by
   default and only tints it on hover, via a widget-scoped rule with higher selector specificity
   than a plain class — !important here follows the same colour as the link text in every state. */
.suave-header .elementskit-navbar-nav > li > a .elementskit-submenu-indicator,.suave-header .elementskit-navbar-nav > li > a .ekit-submenu-indicator-icon{color:var(--suave-cream)!important;fill:var(--suave-cream)!important}
.suave-header .elementskit-navbar-nav > li > a:hover .elementskit-submenu-indicator,.suave-header .elementskit-navbar-nav > li > a:hover .ekit-submenu-indicator-icon,.suave-header .elementskit-navbar-nav > li.current-menu-item > a .elementskit-submenu-indicator,.suave-header .elementskit-navbar-nav > li.current-menu-ancestor > a .elementskit-submenu-indicator{color:rgba(255,249,224,.7)!important;fill:rgba(255,249,224,.7)!important}
.suave-header.is-scrolled .elementskit-navbar-nav > li > a .elementskit-submenu-indicator,.suave-header.is-scrolled .elementskit-navbar-nav > li > a .ekit-submenu-indicator-icon{color:var(--suave-navy)!important;fill:var(--suave-navy)!important}
.suave-header.is-scrolled .elementskit-navbar-nav > li > a:hover .elementskit-submenu-indicator,.suave-header.is-scrolled .elementskit-navbar-nav > li.current-menu-item > a .elementskit-submenu-indicator,.suave-header.is-scrolled .elementskit-navbar-nav > li.current-menu-ancestor > a .elementskit-submenu-indicator{color:rgba(0,8,54,.6)!important;fill:rgba(0,8,54,.6)!important}
.suave-header .elementskit-dropdown{background:var(--suave-cream);border-radius:16px;overflow:hidden;box-shadow:0 12px 40px rgba(0,8,54,.18)}
.suave-header .elementskit-dropdown > li > a{color:var(--suave-navy)!important;font-size:19px!important}
.suave-header .elementskit-dropdown > li > a:hover{color:var(--suave-navy)!important;background:rgba(0,8,54,.06)}
.suave-header .elementskit-menu-hamburger .elementskit-menu-hamburger-icon{background-color:var(--suave-cream);transition:background-color .35s}
.suave-header.is-scrolled .elementskit-menu-hamburger .elementskit-menu-hamburger-icon{background-color:var(--suave-navy)}
.suave-header .elementskit-menu-hamburger{border-color:transparent;background:transparent}
.suave-header .suave-header-cta .elementor-button{font-size:18px;padding:12px 24px}
.suave-header.is-scrolled .suave-header-cta .elementor-button{background-color:var(--suave-navy);color:var(--suave-cream);border-color:var(--suave-navy)}
@media (max-width:1024px){
 .suave-header .suave-logo img{width:170px}
 .suave-header.is-scrolled .suave-logo img{width:140px}
 .suave-header .elementskit-menu-container{background:var(--suave-navy);border-radius:0;height:auto!important}
 .suave-header .elementskit-navbar-nav > li > a{color:var(--suave-cream)!important;font-size:24px!important}
 .suave-header .elementskit-dropdown{background:rgba(255,249,224,.06);box-shadow:none;border-radius:0}
 .suave-header .elementskit-dropdown > li > a{color:var(--suave-cream)!important}
 .suave-header .elementskit-menu-close{background:transparent;border-color:transparent}
 .suave-header .elementskit-menu-close .elementskit-menu-close-icon, .suave-header .elementskit-menu-close svg{color:var(--suave-cream);fill:var(--suave-cream)}
 .suave-header .elementskit-nav-identity-panel img{filter:brightness(0) invert(1);width:160px}
}
/* Admin bar offset (the WP admin bar is itself position:fixed at the very top, 32px tall on
   desktop / 46px on narrow screens; the header needs to sit below it, not under it) */
body.admin-bar .suave-header{top:32px!important}
@media (max-width:782px){body.admin-bar .suave-header{top:46px!important}}
/* CTA buttons: the Elementor button widget is used as-is (its icon, colours and hover fill are
   untouched). Only two things are added: (1) the widget's own icon, where one is set, slides in on
   hover instead of sitting there permanently, and (2) a pen-like contour that draws itself around
   the pill (an svg injected by the JS below, 5px outside the button, in the button's border colour). */
.elementor-widget-button .elementor-button{position:relative;overflow:visible}
/* Elementor colours the icon svg with its own per-widget fill (which drifts from the label colour, e.g. stays cream while the label turns navy); force it to follow the label */
.elementor-widget-button .elementor-button .elementor-button-icon svg,.elementor-widget-button .elementor-button .elementor-button-icon svg *{fill:currentColor!important}
.elementor-widget-button .elementor-button .elementor-button-icon i{color:inherit!important}
.elementor-widget-button .elementor-button .elementor-button-icon{opacity:0;transform:translateX(-10px);transition:transform 280ms cubic-bezier(.65,0,.35,1),opacity 280ms cubic-bezier(.65,0,.35,1)}
.elementor-widget-button .elementor-button:hover .elementor-button-icon,.elementor-widget-button .elementor-button:focus-visible .elementor-button-icon{opacity:1;transform:translateX(0)}
/* keep the label visually centred while the icon is hidden, then let it settle left as the icon arrives */
.elementor-widget-button .elementor-button:has(.elementor-button-icon) .elementor-button-content-wrapper{transform:translateX(calc(.5em + 6px));transition:transform 280ms cubic-bezier(.65,0,.35,1)}
.elementor-widget-button .elementor-button:has(.elementor-button-icon):hover .elementor-button-content-wrapper,.elementor-widget-button .elementor-button:has(.elementor-button-icon):focus-visible .elementor-button-content-wrapper{transform:translateX(0)}
.suave-cta-draw{opacity:0;position:absolute!important;pointer-events:none;overflow:visible!important;z-index:3;max-width:none!important;max-height:none!important}
.suave-cta-draw rect{fill:none;stroke:var(--sbd,currentColor);stroke-width:2;stroke-linecap:round;stroke-dasharray:var(--len,1000);stroke-dashoffset:var(--len,1000);transition:stroke-dashoffset 476ms cubic-bezier(.65,0,.35,1)}
.suave-cta-draw[data-ok]{opacity:1}
.elementor-widget-button .elementor-button:hover .suave-cta-draw rect,.elementor-widget-button .elementor-button:focus-visible .suave-cta-draw rect{stroke-dashoffset:0}
@media (prefers-reduced-motion:reduce){.elementor-widget-button .elementor-button .elementor-button-icon,.elementor-widget-button .elementor-button .elementor-button-content-wrapper,.suave-cta-draw rect{transition:none!important}}
/* Footer text: everything 16px (tagline, column titles, link lists, copyright, Vernox credit). Social icons keep their own size. */
.suave-footer .elementor-heading-title,.suave-footer .elementor-widget-text-editor,.suave-footer .elementor-widget-text-editor p,.suave-footer .elementor-icon-list-text,.suave-footer .elementor-widget-shortcode,.suave-footer .vernox-copyright,.suave-footer .suave-year{font-size:16px!important}
.suave-footer .elementor-heading-title,.suave-footer .elementor-widget-text-editor,.suave-footer .elementor-widget-text-editor p,.suave-footer .vernox-copyright{line-height:1.5!important}
/* System pages: 404 and search results (templates live in the plugin, see includes/system-pages.php).
   Everything is scoped to .suave-sys, which only exists on those two screens. */
.suave-sys{background:var(--suave-navy);color:var(--suave-cream);font-family:'Plus Jakarta Sans',sans-serif}
/* Hello Elementor caps .site-main at ~1140px with side padding; these screens are full-bleed sections instead */
.site-main.suave-sys{width:100%!important;max-width:none!important;margin:0!important;padding:0!important}
.suave-sys *,.suave-sys *::before,.suave-sys *::after{box-sizing:border-box}
.suave-sys-hero{position:relative;overflow:hidden;display:flex;align-items:center;min-height:100vh;padding:clamp(150px,20vh,200px) 24px clamp(72px,10vh,112px);background:var(--suave-navy);color:var(--suave-cream)}
.suave-sys .suave-sys-hero--compact{display:block;min-height:0;padding-bottom:clamp(48px,7vh,80px)}
.suave-sys-inner{position:relative;z-index:1;width:100%;max-width:1240px;margin:0 auto}
.suave-sys-ghost{position:absolute;right:-2vw;bottom:-7vw;z-index:0;font-family:'Baloo 2',sans-serif;font-weight:800;font-size:clamp(220px,40vw,640px);line-height:.8;letter-spacing:-.04em;color:rgba(255,249,224,.06);pointer-events:none;-webkit-user-select:none;user-select:none}
.suave-sys .suave-sys-eyebrow{margin:0 0 22px;font-size:15px;font-weight:600;letter-spacing:.18em;text-transform:uppercase;color:rgba(255,249,224,.7)}
.suave-sys .suave-sys-title{margin:0 0 26px;max-width:14ch;font-family:'Plus Jakarta Sans',sans-serif;font-size:clamp(46px,7.6vw,120px);font-weight:800;line-height:.96;letter-spacing:-.025em;text-transform:uppercase;color:var(--suave-cream);text-wrap:balance}
.suave-sys .suave-sys-title--query{max-width:18ch;font-size:clamp(38px,6vw,92px);overflow-wrap:anywhere}
.suave-sys .suave-sys-title-pre{display:block;margin:0 0 10px;font-size:.34em;font-weight:600;letter-spacing:.14em;color:rgba(255,249,224,.6)}
.suave-sys .suave-sys-lead{margin:0 0 38px;max-width:52ch;font-size:clamp(18px,1.6vw,22px);font-weight:400;line-height:1.55;color:rgba(255,249,224,.82)}
.suave-sys-actions{display:flex;flex-wrap:wrap;gap:16px;margin:0 0 48px}
.suave-sys-inner > div.suave-sys-in:not(.suave-sys-actions) + .suave-sys-actions{margin-top:44px}
.suave-sys .elementor-widget-button{display:block;margin:0}
.suave-sys .elementor-button{display:inline-block;text-align:center;line-height:1.1;text-decoration:none}
.suave-sys .elementor-button-content-wrapper{display:flex;flex-direction:row-reverse;align-items:center;justify-content:center;gap:12px}
.suave-sys .elementor-button-icon{display:flex}
.suave-sys .elementor-button-icon svg{display:block;width:1em;height:1em}
.suave-sys .suave-btn-outline .elementor-button{background:transparent;border-color:var(--suave-cream);color:var(--suave-cream)}
.suave-sys .suave-btn-outline .elementor-button:hover,.suave-sys .suave-btn-outline .elementor-button:focus{background:var(--suave-cream);border-color:var(--suave-cream);color:var(--suave-navy)}
/* search field: a pill with the submit arrow inside */
.suave-sys .suave-search{position:relative;display:flex;align-items:center;width:min(100%,620px);margin:0 0 40px}
.suave-sys .suave-search input[type=search]{-webkit-appearance:none;appearance:none;width:100%;height:64px;margin:0;padding:0 76px 0 28px;border:1.5px solid rgba(255,249,224,.34);border-radius:999px;background:rgba(255,249,224,.06);color:var(--suave-cream);font:300 22px 'Plus Jakarta Sans',sans-serif;box-shadow:none;transition:border-color .2s ease,background .2s ease,box-shadow .2s ease}
.suave-sys .suave-search input[type=search]::placeholder{color:rgba(255,249,224,.55);font-weight:300;opacity:1}
.suave-sys .suave-search input[type=search]:focus{outline:0;border-color:var(--suave-cream);background:rgba(255,249,224,.1);box-shadow:0 0 0 4px rgba(255,249,224,.12)}
.suave-sys .suave-search input[type=search]::-webkit-search-cancel-button{-webkit-appearance:none}
.suave-sys .suave-search button{position:absolute;right:8px;top:50%;display:grid;place-items:center;width:48px;height:48px;margin:0;padding:0!important;border:0!important;border-radius:50%!important;background:var(--suave-cream)!important;color:var(--suave-navy)!important;font-size:0!important;line-height:0;cursor:pointer;transform:translateY(-50%);transition:transform .2s ease}
.suave-sys .suave-search button:hover,.suave-sys .suave-search button:focus{background:var(--suave-cream)!important;color:var(--suave-navy)!important;transform:translateY(-50%) scale(1.07)}
.suave-sys .suave-search button svg{display:block;width:20px;height:20px}
/* quick links */
.suave-sys-chips-title{margin:0 0 14px;font-size:14px;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:rgba(255,249,224,.6)}
.suave-sys-chips{display:flex;flex-wrap:wrap;gap:10px;margin:0;padding:0;list-style:none}
.suave-sys-chips li{margin:0}
.suave-sys .suave-sys-chips a{display:inline-block;padding:11px 20px;border:1.5px solid rgba(255,249,224,.3);border-radius:999px;color:var(--suave-cream);font-size:17px;font-weight:500;line-height:1.2;text-decoration:none;transition:background .2s ease,color .2s ease,border-color .2s ease}
.suave-sys .suave-sys-chips a:hover,.suave-sys .suave-sys-chips a:focus{background:var(--suave-cream);border-color:var(--suave-cream);color:var(--suave-navy)}
/* search results */
.suave-sys-results{padding:clamp(56px,8vw,104px) 24px clamp(72px,9vw,120px);background:var(--suave-offwhite);color:var(--suave-navy)}
.suave-sys .suave-results{display:grid;gap:20px;max-width:1000px;margin:0 auto;padding:0;list-style:none}
.suave-sys .suave-results > li{margin:0}
.suave-sys .suave-result{position:relative;display:grid;grid-template-columns:72px 1fr;gap:8px 28px;padding:clamp(24px,3vw,40px);border:1px solid rgba(0,8,54,.14);border-radius:28px;transition:border-color .25s ease,background .25s ease,transform .25s ease,box-shadow .25s ease}
.suave-sys .suave-result:hover{border-color:var(--suave-navy);background:#fff;box-shadow:0 24px 50px -28px rgba(0,8,54,.35);transform:translateY(-3px)}
.suave-sys .suave-result-num{padding-top:6px;font-family:'Baloo 2',sans-serif;font-size:28px;font-weight:700;line-height:1;color:rgba(0,8,54,.35)}
.suave-sys .suave-result-kind{display:block;margin:0 0 8px;font-size:13px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:rgba(0,8,54,.55)}
.suave-sys .suave-result h2{margin:0 0 12px;font-family:'Plus Jakarta Sans',sans-serif;font-size:clamp(26px,3vw,38px);font-weight:800;line-height:1.05;letter-spacing:-.01em;text-transform:uppercase;color:var(--suave-navy)}
.suave-sys .suave-result h2 a{color:var(--suave-navy)!important;text-decoration:none}
.suave-sys .suave-result h2 a::after{content:"";position:absolute;inset:0;border-radius:28px}
.suave-sys .suave-result p{max-width:62ch;margin:0 0 18px;font-size:18px;line-height:1.55;color:rgba(0,8,54,.78)}
.suave-sys .suave-result-go{display:inline-flex;align-items:center;gap:10px;font-size:17px;font-weight:600;color:var(--suave-navy)}
.suave-sys .suave-result-go svg{display:block;width:18px;height:18px;transition:transform .25s ease}
.suave-sys .suave-result:hover .suave-result-go svg{transform:translateX(5px)}
.suave-sys .navigation.pagination{max-width:1000px;margin:48px auto 0}
.suave-sys .nav-links{display:flex;flex-wrap:wrap;justify-content:center;gap:10px}
.suave-sys .page-numbers{display:inline-flex;align-items:center;justify-content:center;min-width:48px;height:48px;padding:0 16px;border:1.5px solid rgba(0,8,54,.22);border-radius:999px;font-weight:600;text-decoration:none;color:var(--suave-navy)!important;transition:background .2s ease,color .2s ease,border-color .2s ease}
.suave-sys .page-numbers.current,.suave-sys a.page-numbers:hover{background:var(--suave-navy);border-color:var(--suave-navy);color:var(--suave-cream)!important}
.suave-sys .page-numbers.dots{border-color:transparent}
/* entrance (fill-mode backwards, so nothing is left transformed afterwards) */
@keyframes suave-sys-in{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:none}}
.suave-sys-in{animation:suave-sys-in .6s ease-out backwards}
.suave-sys-in:nth-child(2){animation-delay:.07s}
.suave-sys-in:nth-child(3){animation-delay:.14s}
.suave-sys-in:nth-child(4){animation-delay:.21s}
.suave-sys-in:nth-child(5){animation-delay:.28s}
@media (max-width:767px){
 .suave-sys-hero{min-height:0;padding-top:132px}
 .suave-sys .suave-sys-title,.suave-sys .suave-sys-title--query{max-width:none}
 .suave-sys-actions{flex-direction:column;margin-bottom:36px}
 .suave-sys-actions .elementor-widget-button,.suave-sys-actions .elementor-button{width:100%}
 .suave-sys .suave-search input[type=search]{height:58px;font-size:19px}
 .suave-sys .suave-result{grid-template-columns:1fr;gap:6px}
 .suave-sys .suave-result-num{padding:0;font-size:22px}
 .suave-sys-ghost{right:-6vw;bottom:-4vw;font-size:clamp(180px,62vw,320px)}
}
@media (prefers-reduced-motion:reduce){.suave-sys-in{animation:none}.suave-sys *{transition:none!important}}
/* Links on light sections */
.suave-light a:not(.elementor-button),.suave-cream a:not(.elementor-button){color:var(--suave-navy)}
.suave-light a:not(.elementor-button):hover,.suave-cream a:not(.elementor-button):hover{color:rgba(0,8,54,.65)}
.suave-light .elementor-icon-list-item a,.suave-light .elementor-icon-list-text{color:var(--suave-navy)}
/* Hero video watermark: the SS mark sits on top of the background video, faint, centred, and
   click-through (same visual language as the giant SS shape used elsewhere on the site) */
.suave-hero{position:relative}
.suave-hero-watermark{position:absolute!important;top:50%;left:50%;transform:translate(-50%,-50%);width:min(70vh,80vw);pointer-events:none;z-index:1;opacity:.14}
.suave-hero-watermark img{width:100%;height:auto;display:block}
/* Elementor's own video background layer needs to stay behind both the watermark and the hero content */
.suave-hero > .elementor-background-video-container,.suave-hero > .elementor-background-video-embed{z-index:0}
/* Reveal (ps-revela: fade+slide, ps-slide: slide only, no fade, both linear/no-easing since the
   JS sets opacity/transform directly off scroll position every frame) */
.ps-revela,.ps-revela-esq,.ps-revela-dir{will-change:transform,opacity}
.ps-slide{will-change:transform;opacity:1}
.ps-revela-section{overflow:hidden}
/* Counters: driven by IntersectionObserver in the JS below, counts up entering view, back down
   to 0 leaving view (either direction) */
.suave-counter .elementor-counter-title{text-align:center;max-width:22ch;margin-left:auto;margin-right:auto}
.suave-counter .elementor-counter-number-wrapper{justify-content:center}
.suave-counter-num{font-family:'Baloo 2',sans-serif;font-weight:700;font-size:clamp(48px,4vw,128px);line-height:1;color:var(--suave-cream);text-align:center}
/* Logo carousel (We've Worked With): infinite marquee, uniform boxes, translucent white, tooltip on hover */
.suave-logo-wrap{overflow:hidden;-webkit-mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent);mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent)}
.suave-logo-wrap .elementor-image-gallery{overflow:visible}
.suave-logo-track{display:flex;flex-wrap:nowrap;align-items:center;gap:56px;width:max-content;animation:suave-marquee 28s linear infinite}
.suave-logo-track:hover{animation-play-state:paused}
.suave-logo-track .gallery{display:contents}
.suave-logo-track figure.gallery-item{margin:0;position:relative;flex:0 0 auto;width:150px;height:72px;display:flex;align-items:center;justify-content:center}
.suave-logo-track figure.gallery-item .gallery-icon{width:100%;height:100%;display:flex;align-items:center;justify-content:center}
.suave-logo-track figure.gallery-item a{display:flex;align-items:center;justify-content:center;width:100%;height:100%;cursor:default}
.suave-logo-track figure.gallery-item img{width:auto!important;height:auto!important;max-width:100%;max-height:100%;object-fit:contain;filter:brightness(0) invert(1);opacity:.5;transition:opacity .3s ease}
.suave-logo-track figure.gallery-item:hover img{opacity:.85}
.suave-logo-track figure.gallery-item[data-tooltip]::after{content:attr(data-tooltip);position:absolute;bottom:calc(100% + 10px);left:50%;transform:translateX(-50%) translateY(4px);background:var(--suave-cream);color:var(--suave-navy);font-size:13px;font-weight:600;padding:6px 12px;border-radius:8px;white-space:nowrap;opacity:0;pointer-events:none;transition:opacity .2s ease,transform .2s ease;z-index:2}
.suave-logo-track figure.gallery-item[data-tooltip]::before{content:'';position:absolute;bottom:calc(100% + 4px);left:50%;transform:translateX(-50%);border:6px solid transparent;border-top-color:var(--suave-cream);opacity:0;pointer-events:none;transition:opacity .2s ease}
.suave-logo-track figure.gallery-item:hover[data-tooltip]::after,.suave-logo-track figure.gallery-item:hover[data-tooltip]::before{opacity:1;transform:translateX(-50%) translateY(0)}
@keyframes suave-marquee{from{transform:translateX(0)}to{transform:translateX(-50%)}}
@media (max-width:767px){.suave-logo-track{gap:36px}.suave-logo-track figure.gallery-item{width:110px;height:56px}}
/* Services grid (How We Help): pinned horizontal scroll. .suave-help-pin is a tall wrapper (its
   height is set by JS to however far the track needs to travel); .suave-help-pin-inner sticks to
   the top of the viewport while that wrapper scrolls past; the JS below drives the track's
   translateX in lockstep with scroll position. Breaks out to full viewport width so cards can
   travel across the whole screen, not just the 1240px boxed column. */
.suave-help-pin{width:100vw;margin-left:calc(50% - 50vw);margin-right:calc(50% - 50vw)}
.suave-help-pin-inner{position:sticky;top:0;min-height:100vh;display:flex;flex-direction:column;justify-content:center;overflow:hidden}
.suave-help-track{will-change:transform;padding-left:max(24px,calc((100vw - 1240px)/2));padding-right:24px}
/* !important: Elementor gives each inner container its own generated width/flex-basis rule
   (content_width:full), which otherwise overrides a plain class selector here and makes the
   cards share the row equally instead of running to their intended fixed size */
.suave-help-item{flex:0 0 340px!important;width:340px!important;max-width:340px!important}
@media (min-width:1025px){.suave-help-item{flex:0 0 32vw!important;width:32vw!important;max-width:460px!important}}
@media (max-width:600px){.suave-help-item{flex:0 0 80vw!important;width:80vw!important;max-width:80vw!important}}
.suave-service-card{height:100%}
.suave-service-photo{overflow:hidden}
.suave-service-photo img{width:100%;height:100%;aspect-ratio:4/5;object-fit:cover;display:block;transition:transform .5s ease}
.suave-service-card:hover .suave-service-photo img{transform:scale(1.04)}
/* Timeline (Creative Partnership). suave-timeline-light flips it for use on a light section. */
.suave-timeline{position:relative}
.suave-timeline::before{content:'';position:absolute;top:6px;bottom:6px;left:27px;width:2px;background:rgba(255,249,224,.18)}
.suave-timeline-light::before{background:rgba(0,8,54,.18)}
.suave-timeline-item{position:relative;display:flex;gap:28px;align-items:flex-start}
.suave-timeline-item + .suave-timeline-item{margin-top:40px}
.suave-timeline-marker{position:relative;z-index:1;flex:0 0 56px;width:56px;height:56px;border-radius:999px;background:var(--suave-cream);color:var(--suave-navy);display:flex;align-items:center;justify-content:center;font-family:'Baloo 2',sans-serif;font-weight:700;font-size:20px}
.suave-timeline-light .suave-timeline-marker{background:var(--suave-navy);color:var(--suave-cream)}
.suave-timeline-content{padding-top:8px}
@media (max-width:600px){.suave-timeline::before{left:23px}.suave-timeline-marker{flex-basis:48px;width:48px;height:48px;font-size:17px}.suave-timeline-item{gap:20px}}
/* <hr> separators: the SS mark centred in a navy roundel sitting on the line */
.suave-divider{position:relative}
.suave-divider::after{content:'';position:absolute;top:50%;left:50%;width:40px;height:40px;transform:translate(-50%,-50%);border-radius:999px;background-color:var(--suave-navy);background-image:url('https://suave.vernox.com.br/wp-content/uploads/2026/09/suave-ss-cream.png');background-repeat:no-repeat;background-position:center;background-size:58%;border:2px solid rgba(255,249,224,.25)}
.suave-light .suave-divider::after,.suave-cream .suave-divider::after{border-color:rgba(0,8,54,.18)}
/* Testimonials: infinite horizontal scroll */
.suave-testimonials-wrap{overflow:hidden;-webkit-mask-image:linear-gradient(90deg,transparent,#000 3%,#000 97%,transparent);mask-image:linear-gradient(90deg,transparent,#000 3%,#000 97%,transparent)}
.suave-testimonials-track{display:flex;flex-wrap:nowrap;gap:28px;width:max-content;animation:suave-testimonial-scroll 50s linear infinite}
.suave-testimonials-track:hover{animation-play-state:paused}
.suave-testimonials-track > .e-con{flex:0 0 380px;width:380px}
@keyframes suave-testimonial-scroll{from{transform:translateX(0)}to{transform:translateX(-50%)}}
.suave-quote{background:rgba(255,249,224,.04);border:1px solid rgba(255,249,224,.16);border-radius:24px}
@media (max-width:600px){.suave-testimonials-track > .e-con{flex-basis:300px;width:300px}}
/* FAQ */
.suave-faq .elementor-accordion .elementor-accordion-item{border-left:0;border-right:0;border-top:0;border-bottom:1px solid rgba(0,8,54,.14)}
.suave-faq .elementor-accordion .elementor-accordion-item:first-child{border-top:1px solid rgba(0,8,54,.14)}
.suave-faq .elementor-accordion .elementor-tab-title,.suave-faq .elementor-accordion .elementor-tab-content{font-size:clamp(22px,2vw,28px)}
.suave-faq .elementor-accordion .elementor-tab-content{font-weight:300;line-height:1.45;border-top:0}
.suave-faq .elementor-accordion .elementor-tab-title{font-weight:500}
/* Capability tags */
.suave-tags{display:flex;flex-wrap:wrap;gap:10px}
.suave-tags span{color:var(--suave-navy);display:inline-block;padding:10px 18px;border:1px solid rgba(0,8,54,.22);border-radius:999px;font-size:17px;font-weight:400}
.suave-tags.on-dark span{color:var(--suave-cream);border-color:rgba(255,249,224,.28)}
/* Bubble accents inside text */
.suave-bubble{font-family:'Baloo 2',sans-serif;font-weight:800}
/* Forminator (contact form) */
.suave-form .forminator-ui .forminator-label{color:var(--suave-navy)!important;font-size:16px!important;font-weight:600!important;letter-spacing:.02em}
.suave-form .forminator-ui .forminator-input,.suave-form .forminator-ui .forminator-textarea,.suave-form .forminator-ui .forminator-select-dropdown,.suave-form .forminator-ui select{background:transparent!important;border:1px solid rgba(0,8,54,.28)!important;border-radius:14px!important;color:var(--suave-navy)!important;font-size:18px!important;padding:14px 18px!important;font-family:inherit!important}
.suave-form .forminator-ui .forminator-input:focus,.suave-form .forminator-ui .forminator-textarea:focus{border-color:var(--suave-navy)!important;box-shadow:0 0 0 3px rgba(0,8,54,.12)!important;outline:0}
.suave-form .forminator-ui .forminator-checkbox{color:var(--suave-navy)!important;font-size:18px!important}
.suave-form .forminator-ui .forminator-checkbox .forminator-checkbox-box{border-color:rgba(0,8,54,.5)!important;border-radius:6px!important}
.suave-form .forminator-ui .forminator-checkbox input:checked + .forminator-checkbox-box{background:var(--suave-navy)!important;border-color:var(--suave-navy)!important}
.suave-form .forminator-ui .forminator-button-submit{background:var(--suave-navy)!important;color:var(--suave-cream)!important;border-radius:999px!important;font-size:22px!important;font-weight:600!important;padding:16px 34px!important;height:auto!important;font-family:inherit!important;transition:background-color .3s}
.suave-form .forminator-ui .forminator-button-submit:hover{background:var(--suave-charcoal)!important}
.suave-form .forminator-ui .forminator-description{color:rgba(0,8,54,.66)}
.suave-form .forminator-ui .forminator-response-message{color:var(--suave-navy);font-size:20px}
/* Form typography: big, heavy, uppercase like the site headings (labels), roomy inputs */
.suave-form .forminator-ui .forminator-label{font-family:"Plus Jakarta Sans",sans-serif!important;font-size:clamp(18px,1.5vw,21px)!important;font-weight:800!important;text-transform:uppercase;letter-spacing:0!important;line-height:1.15!important;margin-bottom:10px!important}
.suave-form .forminator-ui .forminator-field-checkbox .forminator-label,.suave-form .forminator-ui .forminator-field-radio .forminator-label{font-size:clamp(26px,2.6vw,36px)!important;font-weight:800!important;line-height:1.05!important;letter-spacing:-.01em!important;margin-bottom:6px!important}
.suave-form .forminator-ui .forminator-description{font-size:18px!important;color:rgba(0,8,54,.66)!important}
.suave-form .forminator-ui .forminator-input,.suave-form .forminator-ui .forminator-textarea{font-size:22px!important;padding:18px 22px!important;border-width:1.5px!important}
.suave-form .forminator-ui .forminator-row{margin-bottom:34px!important}
/* Selection chips: a rounded rectangle (not a pill, so they never read as buttons) with a visible checkbox / radio inside */
.suave-form .forminator-ui .forminator-field-checkbox > .forminator-field,.suave-form .forminator-ui .forminator-field-radio > .forminator-field{display:flex;flex-wrap:wrap;gap:12px}
.suave-form .forminator-ui .forminator-field-checkbox .forminator-label,.suave-form .forminator-ui .forminator-field-radio .forminator-label{flex:0 0 100%;order:0}
.suave-form .forminator-ui .forminator-field-checkbox .forminator-description,.suave-form .forminator-ui .forminator-field-radio .forminator-description{flex:0 0 100%;order:1;margin:0 0 8px!important}
.suave-form .forminator-ui label.forminator-checkbox,.suave-form .forminator-ui label.forminator-radio{order:2;position:relative;display:inline-flex!important;align-items:center;gap:12px;margin:0!important;padding:13px 22px 13px 16px!important;border:1.5px solid rgba(0,8,54,.28);border-radius:14px;background:transparent;color:var(--suave-navy)!important;cursor:pointer;transition:background-color .25s ease,color .25s ease,border-color .25s ease}
.suave-form .forminator-ui label.forminator-checkbox:hover,.suave-form .forminator-ui label.forminator-radio:hover{border-color:var(--suave-navy)}
.suave-form .forminator-ui label.forminator-checkbox:has(input:checked),.suave-form .forminator-ui label.forminator-radio:has(input:checked){background:var(--suave-navy);border-color:var(--suave-navy);color:var(--suave-cream)!important}
.suave-form .forminator-ui label.forminator-checkbox:has(input:focus-visible),.suave-form .forminator-ui label.forminator-radio:has(input:focus-visible){outline:2px solid var(--suave-navy);outline-offset:3px}
.suave-form .forminator-ui .forminator-checkbox input,.suave-form .forminator-ui .forminator-radio input{position:absolute!important;opacity:0;width:1px!important;height:1px!important;margin:0!important;pointer-events:none}
.suave-form .forminator-ui .forminator-checkbox .forminator-checkbox-label,.suave-form .forminator-ui .forminator-radio .forminator-radio-label{display:inline-block!important;margin:0!important;padding:0!important;border:0!important;background:none!important;color:inherit!important;font-family:"Plus Jakarta Sans",sans-serif!important;font-size:20px!important;font-weight:600!important;line-height:1.1!important;-webkit-user-select:none;user-select:none}
/* the visible checkbox (square) and radio (circle): filled cream with a navy mark when the chip is selected */
.suave-form .forminator-ui .forminator-checkbox .forminator-checkbox-box,.suave-form .forminator-ui .forminator-radio .forminator-radio-bullet{display:block!important;position:static!important;flex:none!important;align-self:center!important;box-sizing:border-box!important;width:22px!important;height:22px!important;min-width:22px!important;min-height:22px!important;max-width:22px!important;max-height:22px!important;aspect-ratio:1/1;margin:0!important;border:2px solid currentColor!important;background:transparent!important;box-shadow:none!important;transform:none!important;transition:background-color .25s ease,border-color .25s ease}
.suave-form .forminator-ui .forminator-checkbox .forminator-checkbox-box{border-radius:6px!important}
.suave-form .forminator-ui .forminator-radio .forminator-radio-bullet{border-radius:50%!important}
.suave-form .forminator-ui .forminator-checkbox .forminator-checkbox-box::before,.suave-form .forminator-ui .forminator-checkbox .forminator-checkbox-box::after,.suave-form .forminator-ui .forminator-radio .forminator-radio-bullet::before,.suave-form .forminator-ui .forminator-radio .forminator-radio-bullet::after{display:none!important}
.suave-form .forminator-ui .forminator-checkbox input:checked ~ .forminator-checkbox-box{background:var(--suave-cream) url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M3.5 8.5l3 3 6-7' fill='none' stroke='%23000836' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/14px no-repeat!important;border-color:var(--suave-cream)!important}
.suave-form .forminator-ui .forminator-radio input:checked ~ .forminator-radio-bullet{background:radial-gradient(circle,var(--suave-navy) 0 5px,var(--suave-cream) 6px)!important;border-color:var(--suave-cream)!important}
/* Forminator tints the unchecked box/bullet border with its own blue (and an outline); keep it navy in every state */
.suave-form .forminator-ui .forminator-checkbox input:not(:checked) ~ .forminator-checkbox-box,.suave-form .forminator-ui .forminator-radio input:not(:checked) ~ .forminator-radio-bullet,.suave-form .forminator-ui .forminator-checkbox:hover input:not(:checked) ~ .forminator-checkbox-box,.suave-form .forminator-ui .forminator-radio:hover input:not(:checked) ~ .forminator-radio-bullet{border-color:var(--suave-navy)!important;outline:0!important;box-shadow:none!important}
.suave-form .forminator-ui .forminator-checkbox input:checked ~ .forminator-checkbox-box,.suave-form .forminator-ui .forminator-radio input:checked ~ .forminator-radio-bullet{outline:0!important;box-shadow:none!important}
/* Submit "LET'S TALK": same treatment as the Elementor buttons (label recentres, arrow slides in, contour draws) */
.suave-form .forminator-ui .forminator-button-submit{position:relative;display:inline-flex!important;align-items:center;justify-content:center;background:var(--suave-navy)!important;color:var(--suave-cream)!important;border:2px solid var(--suave-navy)!important;border-radius:999px!important;padding:18px 36px!important;font-size:24px!important;font-weight:600!important;line-height:1.1!important;height:auto!important;min-height:0!important;text-transform:uppercase;letter-spacing:.04em;overflow:visible!important}
.suave-form .forminator-ui .forminator-button-submit .suave-submit-label{transition:transform 280ms cubic-bezier(.65,0,.35,1)}
.suave-form .forminator-ui .forminator-button-submit::after{content:"";position:absolute;right:1em;top:50%;width:1em;height:1em;margin-top:-.5em;background-color:currentColor;-webkit-mask:url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M3 8h10M9 4l4 4-4 4' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/contain no-repeat;mask:url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M3 8h10M9 4l4 4-4 4' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/contain no-repeat;opacity:0;transform:translateX(-10px);transition:transform 280ms cubic-bezier(.65,0,.35,1),opacity 280ms cubic-bezier(.65,0,.35,1);pointer-events:none}
.suave-form .forminator-ui .forminator-button-submit:hover::after,.suave-form .forminator-ui .forminator-button-submit:focus-visible::after{opacity:1;transform:translateX(0)}
.suave-form .forminator-ui .forminator-button-submit:hover .suave-submit-label,.suave-form .forminator-ui .forminator-button-submit:focus-visible .suave-submit-label{transform:translateX(-.7em)}
.suave-form .forminator-ui .forminator-button-submit:hover ~ .suave-cta-draw rect,.suave-form .forminator-ui .forminator-button-submit:focus-visible ~ .suave-cta-draw rect{stroke-dashoffset:0}
/* same size steps as the Kit buttons: 24px / 18px 36px, dropping to 18px / 14px 26px at 767px */
@media (max-width:767px){.suave-form .forminator-ui .forminator-button-submit{padding:14px 26px!important;font-size:18px!important}}
@media (prefers-reduced-motion:reduce){.suave-form .forminator-ui .forminator-button-submit::after,.suave-form .forminator-ui .forminator-button-submit .suave-submit-label,.suave-form .forminator-ui label.forminator-checkbox,.suave-form .forminator-ui label.forminator-radio{transition:none}}
@media (prefers-reduced-motion:reduce){.suave-header{transition:none}.ps-revela,.ps-revela-esq,.ps-revela-dir,.ps-slide{opacity:1!important;transform:none!important}.suave-logo-track,.suave-testimonials-track{animation:none}
  /* Fall back to a plain, user-driven horizontal scroll instead of the scroll-jacked pin */
  .suave-help-pin{height:auto!important;width:auto;margin-left:0;margin-right:0}
  .suave-help-pin-inner{position:static!important;min-height:auto!important}
  .suave-help-track{overflow-x:auto!important;transform:none!important}
}