.elementor-2158 .elementor-element.elementor-element-d58723d{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-2158 .elementor-element.elementor-element-ef544fa{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}.elementor-2158 .elementor-element.elementor-element-3f96995{--display:flex;--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;}.elementor-2158 .elementor-element.elementor-element-8367c4c{--display:flex;}.elementor-widget-loop-grid .elementor-button{background-color:var( --e-global-color-accent );font-family:var( --e-global-typography-accent-font-family ), Sans-serif;font-weight:var( --e-global-typography-accent-font-weight );}.elementor-widget-loop-grid .elementor-pagination{font-family:var( --e-global-typography-secondary-font-family ), Sans-serif;font-weight:var( --e-global-typography-secondary-font-weight );}.elementor-widget-loop-grid .e-load-more-message{font-family:var( --e-global-typography-secondary-font-family ), Sans-serif;font-weight:var( --e-global-typography-secondary-font-weight );}.elementor-2158 .elementor-element.elementor-element-2aab4cf{--grid-columns:3;}.elementor-2158 .elementor-element.elementor-element-4ad5760{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}@media(min-width:768px){.elementor-2158 .elementor-element.elementor-element-3f96995{--content-width:1350px;}}@media(max-width:1024px){.elementor-2158 .elementor-element.elementor-element-2aab4cf{--grid-columns:2;}}@media(max-width:767px){.elementor-2158 .elementor-element.elementor-element-2aab4cf{--grid-columns:1;}}/* Start custom CSS for html, class: .elementor-element-4539952 *//* ==========================================================
CASE STUDIES PAGE, SECTION 1 of 3: Hero: CSS
Paste into Elementor: Site Settings > Custom CSS (or the page's
Advanced > Custom CSS). Pairs with cs-01-hero.html (#gb-cs-hero-widget).
Everything is scoped under #gb-cs-hero-widget, so it cannot leak out and theme
styles cannot leak in. This file is separate from the other sections.
Fonts: Montserrat + Inter (the is in the HTML file).
Mobile: stays centered; padding and text sizes shrink on tablet / phone.
========================================================== */
#gb-cs-hero-widget{--black:#000;--ink:#0b0b0b;--g900:#262626;--g700:#404040;--g600:#6b6b6b;--g400:#a3a3a3;--g200:#e2e2e2;--g50:#f6f6f2;--white:#fff;
--font-display:'Montserrat','Inter',system-ui,-apple-system,'Segoe UI',Roboto,Arial,sans-serif;
--font-body:'Inter',system-ui,-apple-system,'Segoe UI',Roboto,Arial,sans-serif;
--wrap:1250px;--pad:max(24px,calc((100% - var(--wrap))/2));
font-family:var(--font-body);line-height:1.5;text-align:left;position:relative;width:100%;
-webkit-text-size-adjust:100%;-webkit-font-smoothing:antialiased}
/* ---- Theme / Elementor guards ---- */
#gb-cs-hero-widget *,#gb-cs-hero-widget *::before,#gb-cs-hero-widget *::after{box-sizing:border-box}
#gb-cs-hero-widget h1,#gb-cs-hero-widget h2,#gb-cs-hero-widget h3,#gb-cs-hero-widget p{margin:0;padding:0;text-transform:none}
#gb-cs-hero-widget h1,#gb-cs-hero-widget h2,#gb-cs-hero-widget h3{font-family:var(--font-display) !important;color:var(--black);letter-spacing:-.02em}
#gb-cs-hero-widget a{text-decoration:none;box-shadow:none}
#gb-cs-hero-widget svg{display:block;max-width:none}
#gb-cs-hero-widget img{max-width:none;margin:0;border:0;border-radius:0;box-shadow:none}
/* ---- Section (stone by default; gs-plain = white, gs-dark = dark) ---- */
#gb-cs-hero-widget .gs-wrap{width:100%;max-width:none;margin:0;padding-inline:var(--pad)}
#gb-cs-hero-widget .gs-section{position:relative;overflow:hidden;padding:64px 0 60px;
background-color:#e7e7dd;
background-image:radial-gradient(70% 50% at 50% 0%,rgba(255,255,255,.95),transparent 70%),radial-gradient(rgba(0,0,0,.09) 1px,transparent 1.3px);
background-size:auto,18px 18px;border-top:1px solid #d6d6cc;border-bottom:1px solid #d6d6cc}
#gb-cs-hero-widget .gs-section.gs-plain{background:var(--white);background-image:none;border-top:0;border-bottom:0}
#gb-cs-hero-widget .gs-section.gs-dark{color:var(--white);border-top:0;border-bottom:0;background-color:var(--ink);
background-image:radial-gradient(70% 55% at 50% 0%,rgba(255,255,255,.10),transparent 70%),radial-gradient(rgba(255,255,255,.07) 1px,transparent 1.3px);
background-size:auto,20px 20px}
/* ---- Type ---- */
#gb-cs-hero-widget .gs-lead{max-width:56ch;margin:14px auto 0;font-size:clamp(15px,1.3vw,16.5px);line-height:1.7;color:var(--g700)}
/* ---- Hero ---- */
#gb-cs-hero-widget .gs-hero{padding:72px 0 64px}
#gb-cs-hero-widget .gs-hero-in{max-width:760px;margin-inline:auto;text-align:center}
#gb-cs-hero-widget .gs-crumb{margin-bottom:16px;font-size:13px;font-weight:600;line-height:1.4;color:var(--g600)}
#gb-cs-hero-widget .gs-crumb b{color:var(--black);font-weight:600}
#gb-cs-hero-widget .gs-h1{margin-inline:auto;font-weight:800;font-size:clamp(30px,4vw,48px);line-height:1.1;max-width:20ch;text-wrap:balance}
#gb-cs-hero-widget .gs-line{margin:14px auto 0;font:600 clamp(16px,1.6vw,20px)/1.4 var(--font-display);letter-spacing:-.01em;color:var(--g900)}
#gb-cs-hero-widget .gs-hero .gs-lead{margin-top:14px}
#gb-cs-hero-widget .gs-dark .gs-h1{color:var(--white)}
#gb-cs-hero-widget .gs-dark .gs-line{color:var(--g200)}
#gb-cs-hero-widget .gs-dark .gs-crumb,#gb-cs-hero-widget .gs-dark .gs-lead{color:var(--g400)}
#gb-cs-hero-widget .gs-dark .gs-crumb b{color:var(--white)}
/* ---- One reveal on load, only when JS + motion allowed ---- */
#gb-cs-hero-widget.gs-js .gs-rv:not(.is-in){opacity:0}
#gb-cs-hero-widget.gs-js .gs-rv.is-in{animation:gs-rise .6s ease backwards;animation-delay:calc(var(--i,0) * .1s)}
@keyframes gs-rise{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
/* ---- Responsive ---- */
@media(max-width:1100px){
#gb-cs-hero-widget .gs-hero{padding:60px 0 52px}
}
@media(max-width:880px){
#gb-cs-hero-widget{--pad:24px}
#gb-cs-hero-widget .gs-hero{padding:44px 0 40px}
#gb-cs-hero-widget .gs-h1{max-width:none}
}
@media(max-width:560px){
#gb-cs-hero-widget{--pad:20px}
#gb-cs-hero-widget .gs-hero{padding:36px 0 34px}
#gb-cs-hero-widget .gs-lead{font-size:14.5px}
}
@media(max-width:380px){
#gb-cs-hero-widget{--pad:16px}
#gb-cs-hero-widget .gs-h1{font-size:27px}
}
@media(prefers-reduced-motion:reduce){
#gb-cs-hero-widget.gs-js .gs-rv:not(.is-in){opacity:1}
#gb-cs-hero-widget.gs-js .gs-rv.is-in{animation:none}
}/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-5f2330a *//* ==========================================================
CASE STUDIES PAGE, SECTION 3 of 3: CTA: CSS
Paste into Elementor: Site Settings > Custom CSS (or the page's
Advanced > Custom CSS). Pairs with cs-03-cta.html (#gb-cs-cta-widget).
Everything is scoped under #gb-cs-cta-widget, so it cannot leak out and theme
styles cannot leak in. This file is separate from the other sections.
Fonts: Montserrat + Inter (the is in the HTML file).
Built for the dark background (class gs-dark): the button is white.
Mobile: the button goes full width on phone.
========================================================== */
#gb-cs-cta-widget{--black:#000;--ink:#0b0b0b;--g900:#262626;--g700:#404040;--g600:#6b6b6b;--g400:#a3a3a3;--g200:#e2e2e2;--g50:#f6f6f2;--white:#fff;
--font-display:'Montserrat','Inter',system-ui,-apple-system,'Segoe UI',Roboto,Arial,sans-serif;
--font-body:'Inter',system-ui,-apple-system,'Segoe UI',Roboto,Arial,sans-serif;
--wrap:1250px;--pad:max(24px,calc((100% - var(--wrap))/2));
font-family:var(--font-body);line-height:1.5;text-align:left;position:relative;width:100%;
-webkit-text-size-adjust:100%;-webkit-font-smoothing:antialiased}
/* ---- Theme / Elementor guards ---- */
#gb-cs-cta-widget *,#gb-cs-cta-widget *::before,#gb-cs-cta-widget *::after{box-sizing:border-box}
#gb-cs-cta-widget h1,#gb-cs-cta-widget h2,#gb-cs-cta-widget h3,#gb-cs-cta-widget p{margin:0;padding:0;text-transform:none}
#gb-cs-cta-widget h1,#gb-cs-cta-widget h2,#gb-cs-cta-widget h3{font-family:var(--font-display) !important;color:var(--black);letter-spacing:-.02em}
#gb-cs-cta-widget a{text-decoration:none;box-shadow:none}
#gb-cs-cta-widget svg{display:block;max-width:none}
#gb-cs-cta-widget img{max-width:none;margin:0;border:0;border-radius:0;box-shadow:none}
/* ---- Section (stone by default; gs-plain = white, gs-dark = dark) ---- */
#gb-cs-cta-widget .gs-wrap{width:100%;max-width:none;margin:0;padding-inline:var(--pad)}
#gb-cs-cta-widget .gs-section{position:relative;overflow:hidden;padding:64px 0 60px;
background-color:#e7e7dd;
background-image:radial-gradient(70% 50% at 50% 0%,rgba(255,255,255,.95),transparent 70%),radial-gradient(rgba(0,0,0,.09) 1px,transparent 1.3px);
background-size:auto,18px 18px;border-top:1px solid #d6d6cc;border-bottom:1px solid #d6d6cc}
#gb-cs-cta-widget .gs-section.gs-plain{background:var(--white);background-image:none;border-top:0;border-bottom:0}
#gb-cs-cta-widget .gs-section.gs-dark{color:var(--white);border-top:0;border-bottom:0;background-color:var(--ink);
background-image:radial-gradient(70% 55% at 50% 0%,rgba(255,255,255,.10),transparent 70%),radial-gradient(rgba(255,255,255,.07) 1px,transparent 1.3px);
background-size:auto,20px 20px}
/* ---- CTA (dark) ---- */
#gb-cs-cta-widget .gs-cta{padding:68px 0}
#gb-cs-cta-widget .gs-cta-in{max-width:760px;margin-inline:auto;text-align:center}
#gb-cs-cta-widget .gs-title{margin-inline:auto;font-weight:800;font-size:clamp(22px,2.6vw,32px);line-height:1.15;max-width:26ch;text-wrap:balance}
#gb-cs-cta-widget .gs-lead{max-width:56ch;margin:14px auto 0;font-size:clamp(15px,1.3vw,16.5px);line-height:1.7;color:var(--g700)}
#gb-cs-cta-widget .gs-dark .gs-title{color:var(--white)}
#gb-cs-cta-widget .gs-dark .gs-lead{color:var(--g400)}
#gb-cs-cta-widget a.gs-btn,#gb-cs-cta-widget a.gs-btn:hover,#gb-cs-cta-widget a.gs-btn:focus{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:52px;margin-top:26px;padding:0 28px;border-radius:999px;
font:700 15px/1 var(--font-display);color:var(--black);background:var(--white);border:1.5px solid var(--white);transition:background .2s,transform .2s}
#gb-cs-cta-widget a.gs-btn svg{width:20px;height:20px;flex:none}
#gb-cs-cta-widget a.gs-btn:focus-visible{outline:3px solid var(--white);outline-offset:3px}
@media(hover:hover) and (pointer:fine){#gb-cs-cta-widget a.gs-btn:hover{background:var(--g200);transform:translateY(-2px)}}
/* ---- One reveal on load, only when JS + motion allowed ---- */
#gb-cs-cta-widget.gs-js .gs-rv:not(.is-in){opacity:0}
#gb-cs-cta-widget.gs-js .gs-rv.is-in{animation:gs-rise .6s ease backwards;animation-delay:calc(var(--i,0) * .1s)}
@keyframes gs-rise{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
/* ---- Responsive ---- */
@media(max-width:1100px){
#gb-cs-cta-widget .gs-cta{padding:60px 0 56px}
}
@media(max-width:880px){
#gb-cs-cta-widget{--pad:24px}
#gb-cs-cta-widget .gs-cta{padding:52px 0 48px}
#gb-cs-cta-widget .gs-title{max-width:none}
}
/* phone: button full width */
@media(max-width:560px){
#gb-cs-cta-widget{--pad:20px}
#gb-cs-cta-widget .gs-cta{padding:44px 0 40px}
#gb-cs-cta-widget .gs-lead{font-size:14.5px}
#gb-cs-cta-widget a.gs-btn{width:100%}
}
@media(max-width:380px){
#gb-cs-cta-widget{--pad:16px}
#gb-cs-cta-widget .gs-title{font-size:21px}
}
@media(prefers-reduced-motion:reduce){
#gb-cs-cta-widget a.gs-btn{transition:none}
#gb-cs-cta-widget.gs-js .gs-rv:not(.is-in){opacity:1}
#gb-cs-cta-widget.gs-js .gs-rv.is-in{animation:none}
}/* End custom CSS */