/* =========================================================================
   Stream Ships Service: site design (home, header, footer)
   Source: demo/2 (page) + demo/1 (header, menu, hero). Brand values come from
   var(--oh-*) (Customizer › OneHoster); the look is attached by CSS classes on
   Elementor containers/widgets, so editing content in Elementor never changes it.

   1. Tokens + Elementor neutral base   5. Why us / Services
   2. Base type + buttons               6. Suez band + stats
   3. Intro + header (demo/1)           7. FAQ / Clients / Newsletter
   4. Hero (demo/1)                     8. Footer / utilities / responsive
   ========================================================================= */

/* ---------- 1. Tokens ---------- */
:root{
	--bg:var(--oh-light);           /* page background  #F0F7FF */
	--surf:#DBEAFE;                 /* soft blue panel  */
	--sec:var(--oh-accent);         /* light blue       #60A5FA */
	--acc:var(--oh-primary);        /* action blue      #2563EB */
	--ink:var(--oh-secondary);      /* navy             #0B1F3B */
	--ink-2:#12396e;
	--muted:#2c4d82;
	--font:var(--oh-font-body),system-ui,-apple-system,"Segoe UI",sans-serif;
	--ease:cubic-bezier(.2,.8,.2,1);
	/* header palette (demo/1) */
	--n-bg:#F5FAFF;--n-sec:#E6F3FF;--n-card:#C1E8FF;--n-btn:#2196F3;--n-ink:#052659;
}

/* Elementor neutral base: spacing and type belong to the classes below. */
body.onehoster{--widgets-spacing:0px;--widgets-spacing-row:0px;--widgets-spacing-column:0px;--kit-widget-spacing:0px}
.elementor .e-con{--padding-top:0px;--padding-right:0px;--padding-bottom:0px;--padding-left:0px;--gap:0px;--row-gap:0px;--column-gap:0px;--margin-top:0px;--margin-bottom:0px;--border-radius:0;min-height:0}
.elementor .e-con.e-con-full{--width:100%}
:where(.elementor .elementor-widget){margin:0}
.elementor-heading-title{font:inherit!important;color:inherit;letter-spacing:inherit;text-transform:inherit;margin:0;padding:0;line-height:inherit}
.elementor-heading-title a{color:inherit}
.elementor-widget-text-editor{color:inherit}
.elementor-widget-text-editor p:last-child,.elementor-widget-text-editor ul:last-child{margin-bottom:0}
.elementor-widget-image img{display:block}
.elementor-widget-button .elementor-button{background:none;padding:0;border:0;border-radius:0;font:inherit;color:inherit;fill:inherit;line-height:inherit;box-shadow:none;text-shadow:none;display:inline-flex;align-items:center;gap:inherit;transition:inherit}
.elementor-button-wrapper{display:contents}
.elementor-button .elementor-button-content-wrapper{display:contents}
.elementor-widget-shortcode .elementor-shortcode{display:contents}
.elementor-widget-html{display:contents}

/* Widget measures: Elementor caps every widget with
   ".elementor.elementor .e-con > .elementor-widget{max-width:100%}", so match its weight. */
.elementor.elementor .e-con>.elementor-widget.hero-title{max-width:14ch}
.elementor.elementor .e-con>.elementor-widget.hero-lead{max-width:46ch;flex:1 1 320px}
.elementor.elementor .e-con>.elementor-widget.badge{max-width:none;width:auto}
.elementor.elementor .e-con>.elementor-widget.cl-lead{max-width:640px;margin-inline:auto}
.elementor.elementor .e-con>.elementor-widget.pg-lead{max-width:52ch}
.elementor.elementor .e-con>.elementor-widget.pg-photo__cap,
.elementor.elementor .e-con>.elementor-widget.pg-shot__cap,
.elementor.elementor .e-con>.elementor-widget.pg-step__pill{max-width:none;width:auto}
.elementor.elementor .e-con>.elementor-widget.btn,
.elementor.elementor .e-con>.elementor-widget.ss-link-w{width:auto;align-self:flex-start}

/* Bottom margins: Elementor zeroes them with ".e-con .elementor-widget.elementor-widget{margin-block-end:0}". */
body .e-con .elementor-widget.elementor-widget:is(.h2){margin-block:10px 18px}
body .e-con .elementor-widget.elementor-widget:is(.cl-lead){margin-bottom:50px}
body .e-con .elementor-widget.elementor-widget:is(.pg-crumbs,.pg-stop__n){margin-bottom:18px}
body .e-con .elementor-widget.elementor-widget:is(.pg-h1){margin-block:6px 18px}
body .e-con .elementor-widget.elementor-widget:is(.pg-pillar__k){margin-bottom:16px}
body .e-con .elementor-widget.elementor-widget:is(.pg-duo__t .pg-h2){margin-bottom:18px}
body .e-con .elementor-widget.elementor-widget:is(.pg-form .pg-h2){margin-bottom:22px}
body .e-con .elementor-widget.elementor-widget:is(.pg-pillar .pg-h3){margin-bottom:10px}
body .e-con .elementor-widget.elementor-widget:is(.pg-stop .pg-h3){margin-bottom:8px}
body .e-con .elementor-widget.elementor-widget:is(.pg-stop__k){margin-bottom:6px}
body .e-con .elementor-widget.elementor-widget:is(.tag){margin-bottom:2px}

/* ---------- 2. Base ---------- */
html{scroll-padding-top:90px;scroll-behavior:auto}
html.lenis,html.lenis body{height:auto}
.lenis.lenis-smooth{scroll-behavior:auto!important}
body.onehoster{font-family:var(--font);font-weight:400;background:var(--bg);color:var(--ink);line-height:1.65;overflow-x:hidden;margin:0}
body.onehoster a{color:inherit;text-decoration:none}
body.onehoster img{max-width:100%}
:focus-visible{outline:3px solid var(--acc);outline-offset:3px}
.oh-content{display:block}

.w{width:min(1200px,92%);margin-inline:auto}
.sec{padding:100px 0}
.tag{font-size:.8rem;letter-spacing:.18em;text-transform:uppercase;font-weight:700;color:var(--acc);display:block}
.h2{font-size:clamp(2rem,4.5vw,3.2rem);font-weight:700;line-height:1.15;margin:10px 0 18px;color:var(--ink)}
.h3{font-weight:700;line-height:1.15}
.center{text-align:center}

/* buttons (widget wrapper carries the class, the <a> gets the look) */
.btn .elementor-button,a.btn,.btn>a,button.btn,.wpcf7 .btn,.ss-btn{
	display:inline-flex;align-items:center;gap:10px;padding:14px 28px;border-radius:999px;
	font:700 .95rem var(--font);border:2px solid var(--acc);background:var(--acc);color:#fff;
	transition:background .3s,border-color .3s,color .3s,transform .3s,box-shadow .3s;cursor:pointer;line-height:1.2;text-decoration:none}
.btn .elementor-button:hover,a.btn:hover,button.btn:hover,.wpcf7 .btn:hover,.ss-btn:hover{background:var(--ink);border-color:var(--ink);color:#fff;transform:translateY(-3px);box-shadow:0 12px 24px rgba(11,31,59,.25)}
.btn.o .elementor-button{background:transparent;color:var(--ink);border-color:var(--ink)}
.btn.o .elementor-button:hover{background:var(--ink);color:#fff}

/* ---------- 3. Intro + header (demo/1) ---------- */
.oh-intro{position:fixed;inset:0;z-index:100;display:grid;place-items:center;pointer-events:none}
#isea{position:absolute;inset:0;overflow:hidden;background:#041a42;pointer-events:auto}
#isea img{position:absolute;left:0;top:0;width:100%;height:100%;object-fit:cover;object-position:30% 50%;transform-origin:50% 50%}
#ic{position:relative;filter:drop-shadow(0 6px 28px rgba(2,12,40,.55))}
#il{display:block;width:min(400px,62vw);height:auto}
html:not(.oh-js) .oh-intro{display:none}

.nav,.nav.oh-header,.elementor .e-con.nav{background:none;position:fixed;z-index:50;left:0;right:0;top:calc(14px + env(safe-area-inset-top,0px));color:#fff;transition:color .5s}
.admin-bar .nav{top:calc(46px + env(safe-area-inset-top,0px))}
.nav.s:not(.is-gsap),.elementor .e-con.nav.s:not(.is-gsap){color:var(--n-ink)}
.nav .wrap{
	position:relative;margin-inline:auto;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;
	width:calc(100% - 48px);max-width:1320px;padding:10px 8px;border:1px solid transparent;border-radius:99px;
	background:rgba(245,250,255,0);backdrop-filter:blur(0) saturate(1);
	transition:max-width .8s var(--ease),background .5s,border-color .5s,box-shadow .5s,padding .6s,backdrop-filter .5s}
.nav.s:not(.is-gsap) .wrap{max-width:880px;padding:8px 8px 8px 26px;background:rgba(245,250,255,.74);backdrop-filter:blur(16px) saturate(1.5);border-color:rgba(193,232,255,.95);box-shadow:0 12px 40px rgba(5,38,89,.18)}
.elementor .e-con.wrap{display:grid}

/* GSAP-driven header (site.js adds .is-gsap): the scroll timeline owns every value, so no
   CSS transition may compete with it. The glass blur is switched by class, never tweened
   (animating backdrop-filter repaints the whole strip every frame). */
.nav.is-gsap,.nav.is-gsap .wrap,.nav.is-gsap .nlogo,.nav.is-gsap .nlogo img,.nav.is-gsap .nl,.nav.is-gsap .nr{transition:none}
.nav.is-gsap .wrap{box-shadow:0 12px 40px rgba(5,38,89,0);will-change:max-width}
.nav.is-gsap.is-glass .wrap{backdrop-filter:blur(16px) saturate(1.5);-webkit-backdrop-filter:blur(16px) saturate(1.5)}
.nav.is-gsap{will-change:transform}

.nlogo-w{grid-column:2;grid-row:1}
.nlogo{position:relative;display:block;width:127px;height:54px;transition:width .7s var(--ease),height .7s var(--ease)}
.nav.s:not(.is-gsap) .nlogo{width:116px;height:34px}
.nlogo img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;transition:opacity .45s,transform .7s var(--ease)}
.nlogo .lgm{opacity:0;transform:scale(.5)}
.nav.s:not(.is-gsap) .nlogo .lgf{opacity:0;transform:scale(.6)}
.nav.s:not(.is-gsap) .nlogo .lgm{opacity:1;transform:scale(1)}

.elementor .e-con.links,.links{display:contents}
.nl{grid-column:1;grid-row:1}
.elementor .e-con.nr,.nr{grid-column:3;grid-row:1;display:flex;flex-direction:row;justify-content:flex-end;align-items:center;gap:26px}
.nl-menu,.nr-menu{list-style:none;margin:0;padding:0;display:flex;gap:26px;align-items:center;flex-wrap:nowrap}
.nl,.nr{font-weight:500;font-size:15px;text-shadow:0 1px 12px rgba(2,16,45,.5);transition:text-shadow .5s}
.nav.s:not(.is-gsap) .nl,.nav.s:not(.is-gsap) .nr{text-shadow:none}
.nl-menu a,.nr-menu>li>a{color:inherit;transition:opacity .25s;white-space:nowrap;display:block;padding:4px 0}
.nl-menu a:hover,.nr-menu>li>a:hover{opacity:.65;color:inherit}
.nl-menu .current-menu-item>a,.nr-menu .current-menu-item>a,.nr-menu .current-menu-ancestor>a{box-shadow:inset 0 -2px 0 currentColor}
.nav .oh-nav{margin:0}

/* services dropdown = sub-menu of the right menu */
.nr-menu li{position:relative}
.nr-menu .menu-item-has-children>a::after{content:" \25BE";font-size:.85em}
.nr-menu .sub-menu{
	position:absolute;top:100%;left:-18px;list-style:none;margin:0;color:var(--n-ink);text-shadow:none;
	background:var(--n-bg);border:1px solid var(--n-card);border-radius:20px;padding:10px;min-width:280px;
	opacity:0;visibility:hidden;transform:translateY(8px);transition:.25s;box-shadow:0 20px 50px rgba(5,38,89,.15);z-index:5}
.nr-menu li:hover>.sub-menu,.nr-menu li:focus-within>.sub-menu{opacity:1;visibility:visible;transform:none}
.nr-menu .sub-menu a{display:block;padding:10px 14px;border-radius:12px;color:var(--n-ink);font-weight:500}
.nr-menu .sub-menu a:hover{background:var(--n-sec);opacity:1}

.nav-cta .elementor-button,.nav a.nav-cta{border:0;padding:15px 28px;font:700 16px var(--font);background:var(--n-btn);color:#fff;text-shadow:none}
.nav-cta .elementor-button:hover,.nav a.nav-cta:hover{background:var(--n-ink);transform:translateY(-2px);box-shadow:none}

.burger-w{display:none}
.burger{display:none;background:var(--n-btn);border:0;color:#fff;width:46px;height:46px;border-radius:50%;cursor:pointer;font-size:18px;line-height:1}

/* ---------- 4. Hero (demo/1) ---------- */
.elementor .e-con.hero,.hero{position:relative;min-height:100svh;display:flex;flex-direction:column;justify-content:flex-end;color:#fff;overflow:hidden;background:var(--n-ink)}
.hero .bg{position:absolute!important;inset:-6% 0 0;height:112%;width:100%;z-index:0}
.hero .bg .elementor-widget-container,.hero .bg img{width:100%;height:100%}
.hero .bg img{object-fit:cover;max-width:none}
.hero::after{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(180deg,rgba(5,38,89,.55) 0%,rgba(5,38,89,.15) 40%,rgba(5,38,89,.8) 100%)}
.elementor .e-con.hero-in{position:relative;z-index:2;padding:150px 0 56px;width:min(1240px,100% - 48px);margin-inline:auto}
.hero-title{font-size:clamp(42px,7.4vw,110px);font-weight:400;line-height:1.08;letter-spacing:-.02em;color:#fff;max-width:14ch}
.hero-title .elementor-heading-title{color:#fff}
.ln{display:block;overflow:hidden;padding-bottom:.08em}
.gl{display:inline-grid;place-items:center;width:.62em;height:.62em;border-radius:.2em;background:var(--n-btn);vertical-align:.02em;margin:0 .06em}
.gl svg{width:62%;height:62%}
.elementor .e-con.row{display:flex;flex-direction:row;flex-wrap:wrap;gap:28px;justify-content:space-between;align-items:flex-end;margin-top:36px}
.hero-lead{max-width:46ch;font-size:19px;line-height:1.65}
.elementor .e-con.btns{display:flex;flex-direction:row;gap:14px;flex-wrap:wrap;width:auto}
.hero .btn .elementor-button{border:1.5px solid var(--n-btn);background:var(--n-btn);padding:15px 28px;font:700 16px var(--font)}
.hero .btn .elementor-button:hover{background:var(--n-ink);border-color:var(--n-ink);transform:translateY(-2px);box-shadow:none}
.hero .btn.line .elementor-button{background:transparent;border-color:currentColor;color:#fff}
.hero .btn.line .elementor-button:hover{background:#fff;color:var(--n-ink);border-color:#fff}
.badge{position:absolute!important;z-index:3;right:24px;top:132px;font-size:17px;display:none;background:var(--n-bg);color:var(--n-ink);border-radius:18px;padding:12px 18px;font-weight:700;line-height:1.2;width:auto!important}
.badge p{margin:0}
.badge small{font-weight:400}

/* ---------- 5. Why us ---------- */
.elementor .e-con.why{display:grid;grid-template-columns:1fr 1fr 1fr;gap:22px;margin-top:40px}
.why>.e-con{border-radius:30px;overflow:hidden;min-height:480px}
.elementor .e-con.wc{background:var(--surf);padding:42px;display:flex;flex-direction:column;justify-content:space-between;gap:24px}
.wc .h3,.wr .h3{font-size:2.2rem;margin-top:12px}
.wc .btn{align-self:flex-start}
.wi{position:relative}
.wi .wi-img{position:absolute!important;inset:0}
.wi .wi-img .elementor-widget-container,.wi .wi-img img{width:100%;height:100%}
.wi .wi-img img{object-fit:cover;transition:transform 1.2s;max-width:none}
.wi:hover .wi-img img{transform:scale(1.04)}
.elementor .e-con.wy{background:linear-gradient(#021024,#00091a)}
.wy .wi-img img{object-fit:contain}
.elementor .e-con.wr{background:var(--acc);color:#fff;padding:42px;display:flex;flex-direction:column;justify-content:space-between;gap:24px}
.wr .h3{color:#fff}
.wr .tag{color:var(--surf)}
.wr-list ul{padding:0;margin:0}
.wr-list li{list-style:none;padding:9px 0;border-bottom:1px solid rgba(255,255,255,.25);font-weight:700}
.wr-list li small{display:block;font-weight:300;font-size:.85rem;opacity:.9}
.wr-list li::before{content:"✓ ";color:var(--surf)}

/* ---------- 5b. Services ---------- */
.svc-sec{background:var(--surf)}
.elementor .e-con.grid4{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;margin-top:40px}
.elementor .e-con.svc-grid{margin-top:70px;gap:64px 20px}
.elementor .e-con.grid3{display:grid;grid-template-columns:repeat(3,1fr);gap:56px 20px;margin-top:64px}
.card{background:var(--surf);border:1px solid var(--sec);border-radius:26px;padding:32px 26px;transition:.4s;position:relative;height:100%;box-sizing:border-box}
.card:hover{transform:translateY(-10px);background:var(--acc);color:#fff;box-shadow:0 22px 40px rgba(37,99,235,.35)}
.card:hover h3{color:#fff}
.card h3{font-size:1.2rem;margin:8px 0 10px;color:var(--ink);font-weight:700}
.card p{font-size:.92rem;margin:0 0 18px}
.card a{font-weight:700;font-size:.9rem;color:var(--ink)}
.sc{background:var(--bg);padding:34px 26px 28px}
.sc:hover a{color:#fff}
/* hover must win over the card's resting background (.sc / .pg-more .card), or white text sits on white */
.card.sc:hover,.pg-more .card.sc:hover{background:var(--acc);border-color:var(--acc);color:#fff}
.card.sc:hover p,.card.sc:hover h3,.card.sc:hover a{color:#fff}
.sn{position:absolute;top:-34px;right:22px;font-size:4rem;font-weight:700;line-height:1;color:transparent;-webkit-text-stroke:2px var(--sec);transition:.4s}
.sc:hover .sn{-webkit-text-stroke-color:var(--acc);transform:translateY(-6px)}
.ic{width:84px;height:84px;border-radius:18px;background:#fff;box-shadow:0 12px 28px rgba(37,99,235,.18);display:grid;place-items:center;color:var(--acc);margin-bottom:22px;transition:.4s}
.ic svg{width:46px;height:46px}
.sc:hover .ic{transform:rotate(-6deg) scale(1.08)}

/* ---------- 6. Suez band + stats ---------- */
.elementor .e-con.band{background:#0B1F3B url(../images/suez-band.webp) center/cover;color:#fff;overflow:hidden}
.suez{position:relative;color:#fff}
.suez .h2,.stats .h2{color:#fff}
.suez .tag{color:var(--surf)}
.elementor .e-con.in{display:flex;flex-direction:row;justify-content:space-between;align-items:center;gap:30px;flex-wrap:wrap;min-height:420px;padding:60px 0}
.elementor .e-con.dir{display:flex;flex-direction:row;gap:18px;width:auto}
.dir-tile{background:var(--bg);color:var(--ink);border-radius:24px;padding:24px 34px;text-align:center;min-width:150px}
.dir-tile b,.stat b{display:block;font-size:3rem;color:var(--acc);line-height:1.1}
.stats{color:#fff}
.stats-grid.grid4{margin-top:0}
.stat{background:var(--bg);color:var(--ink);border-radius:26px;padding:34px 20px;text-align:center;transition:.4s;height:100%;box-sizing:border-box}
.stat:hover{transform:scale(1.05);background:var(--surf)}
.stat-l{display:block}

/* ---------- 7a. FAQ ---------- */
.faq{max-width:820px;margin:36px auto 0}
.q{background:var(--surf);border-radius:20px;margin-bottom:14px;overflow:hidden;border:1px solid transparent;transition:border-color .3s}
.q:hover{border-color:var(--sec)}
.q summary{list-style:none;padding:22px 26px;font:700 1.05rem var(--font);color:var(--ink);display:flex;justify-content:space-between;gap:16px;cursor:pointer}
.q summary::-webkit-details-marker{display:none}
.q summary span{color:var(--acc);font-size:1.5rem;transition:transform .3s;line-height:1}
.q[open] summary span{transform:rotate(45deg)}
.q-a{padding:0 26px}
.q-a p{margin:0;padding-bottom:22px}

/* ---------- 7b. Clients ---------- */
.elementor .e-con.cl{position:relative;background:radial-gradient(ellipse at 50% 0,var(--ink-2) 0,var(--ink) 65%);padding:100px 0;overflow:hidden;text-align:center}
.cl .h2{color:#fff}
.cl .h2 em{font-style:normal;color:var(--sec)}
.cl .tag{color:var(--sec)}
.cl-lead{color:#fff;max-width:640px;margin:0 auto 50px}
.mq{overflow:hidden;margin:18px 0}
.tr{display:flex;gap:22px;width:max-content;animation:oh-marquee 28s linear infinite}
.mq.r .tr{animation-direction:reverse}
.mq:hover .tr{animation-play-state:paused}
.lg{width:210px;height:112px;border:1px solid rgba(96,165,250,.35);background:rgba(255,255,255,.04);border-radius:20px;display:grid;place-items:center;padding:16px;transition:.35s;flex:none;position:relative;box-sizing:border-box}
.lg img{max-height:100%;max-width:100%;object-fit:contain;grid-area:1/1;transition:.35s}
.lg .lc{opacity:0}
.lg:hover{background:var(--bg);border-color:var(--bg);transform:translateY(-6px);box-shadow:0 16px 34px rgba(37,99,235,.35)}
.lg:hover .lw{opacity:0}
.lg:hover .lc{opacity:1}
@keyframes oh-marquee{to{transform:translateX(calc(-50% - 11px))}}

/* ---------- 7c. Newsletter ---------- */
.elementor .e-con.news{display:grid;grid-template-columns:1fr 1fr;gap:40px;align-items:center}
.news-list ul{padding-left:20px;margin-top:10px}
.nl-img{min-height:0!important;aspect-ratio:16/9;border-radius:30px;overflow:hidden;background:#04193d;width:92%!important;justify-self:end}
.nl-form{margin-top:22px}
.nl-row{display:flex;gap:10px;flex-wrap:wrap}
.nl-row .wpcf7-form-control-wrap{flex:1;min-width:200px}
.nl-row input[type=email],.ff input,.ff select,.ff textarea{width:100%;box-sizing:border-box;padding:15px 22px;border-radius:999px;border:2px solid var(--sec);background:var(--bg);font:inherit;color:var(--ink)}
.nl-row input:focus,.ff input:focus,.ff select:focus,.ff textarea:focus{outline:0;border-color:var(--acc)}
.wpcf7-spinner{display:none}
.wpcf7 form .wpcf7-response-output{margin:14px 0 0;border-radius:14px;padding:10px 16px}
.wpcf7-not-valid-tip{font-size:.85rem;margin-top:4px}

/* ---------- 8. Footer ---------- */
.site-foot,.oh-footer.site-foot{background:var(--ink);color:var(--bg);padding:70px 0 30px}
.elementor .e-con.fg,.fg{display:grid;grid-template-columns:1.4fr 1fr 1.2fr;gap:40px}
.site-foot .fh,.site-foot h4{color:var(--sec);margin:0 0 14px;letter-spacing:.1em;font-size:.85rem;font-weight:700}
.site-foot ul{padding:0;margin:0}
.site-foot li{list-style:none;margin-bottom:8px}
.site-foot a{color:var(--bg)}
.site-foot a:hover{color:var(--sec)}
.site-foot .oh-footer-menu{display:block}
.site-foot .oh-footer-menu a{padding:0;font-weight:400;color:var(--bg)}
.site-foot .oh-info{display:block;margin:0 0 8px;color:var(--bg)}
/* The site logo is the light version (made for dark grounds): show it straight on the navy footer. */
.elementor .e-con.chip,.chip{background:none;display:inline-block;padding:0;margin-bottom:22px;width:auto;align-self:flex-start}
.chip img{height:72px;width:auto;display:block;max-width:none}
.chip a{display:inline-block;transition:opacity .3s}
.chip a:hover{opacity:.8}
.elementor .e-con.cp,.cp{border-top:1px solid rgba(96,165,250,.35);margin-top:40px;padding-top:20px;font-size:.85rem;opacity:.85}
.cp .oh-info{margin:0}

/* ---------- utilities ---------- */
.wa{position:fixed;right:20px;bottom:calc(20px + env(safe-area-inset-bottom,0px));width:58px;height:58px;border-radius:50%;background:var(--acc);color:#fff;display:grid;place-items:center;box-shadow:0 10px 24px rgba(37,99,235,.5);z-index:40;animation:oh-pulse 2s infinite}
.wa svg{width:28px;height:28px;fill:#fff}
@keyframes oh-pulse{0%,100%{box-shadow:0 0 0 0 rgba(96,165,250,.7)}50%{box-shadow:0 0 0 16px rgba(96,165,250,0)}}
.oh-bar{position:fixed;top:env(safe-area-inset-top,0px);left:0;height:3px;background:var(--acc);width:0;z-index:70}
.admin-bar .oh-bar{top:32px}

/* reveals are set by site.js at runtime only (nothing is hidden by CSS, so content shows
   without JS, in the editor and with reduced motion) */
/* Elementor wrappers carry "transition: transform .4s", which fights GSAP's per-frame
   transforms and leaves elements mid-way. Motion is GSAP's job on the front end. */
html.oh-motion .elementor-element{transition:none}

/* ---------- responsive ---------- */
@media (min-width:901px){
	.elementor .e-con.band{aspect-ratio:16/9;background-position:75% center}
	.elementor .e-con.suez .in{display:block;min-height:0;padding:46px 0 8px}
	.suez .h2{font-size:2.3rem;margin:6px 0 8px}
	.elementor .e-con.stats.sec{padding:14px 0 46px}
	.stats .h2{font-size:2.3rem;margin:0 0 14px}
	.elementor .e-con.dir{margin-top:16px}
	.elementor .e-con.dir,.stats .stats-grid,.stats .h2{max-width:44%}
	.elementor .e-con.stats-grid{grid-template-columns:1fr 1fr;gap:14px}
	.stats .stat{padding:16px 10px}
	.stat b,.dir-tile b{font-size:2.1rem}
	.dir .stat-w{flex:1}
	.dir-tile{padding:14px 22px;min-width:0}
	.badge{display:block}
}
@media (max-width:900px){
	.admin-bar .nav{top:calc(60px + env(safe-area-inset-top,0px))}
	.burger-w{display:block}
	.burger{display:block}
	.elementor .e-con.wrap,.nav .wrap{display:flex;flex-direction:row;justify-content:space-between;align-items:center}
	.nav.s:not(.is-gsap) .wrap{padding:8px 8px 8px 20px}
	.nlogo{width:110px;height:46px}
	.nav.s:not(.is-gsap) .nlogo{width:84px;height:34px}
	.elementor .e-con.links,.links{position:absolute;top:calc(100% + 10px);left:0;right:0;display:none;flex-direction:column;gap:4px;background:var(--n-bg);color:var(--n-ink);border:1px solid var(--n-card);border-radius:28px;padding:18px;text-shadow:none;box-sizing:border-box}
	.nav.is-open .links,.nav.is-open .e-con.links{display:flex}
	.nav .links .oh-nav{display:block;position:static;box-shadow:none;padding:0;background:none;margin:0}
	.elementor .e-con.nr,.nr{flex-direction:column;align-items:stretch;gap:4px}
	.nl-menu,.nr-menu{flex-direction:column;align-items:stretch;gap:2px}
	.nl,.nr{text-shadow:none}
	.nl-menu a,.nr-menu>li>a{padding:8px 4px}
	.nr-menu .sub-menu{position:static;opacity:1;visibility:visible;transform:none;box-shadow:none;border:0;padding:0 0 0 12px;min-width:0;background:none}
	.nav-cta{margin-top:6px}
	.nav-cta .elementor-button,.nav a.nav-cta{justify-content:center;width:100%;box-sizing:border-box}

	.elementor .e-con.band{background-size:100% auto;background-position:bottom;background-repeat:no-repeat;background-color:#0f3a7e;padding-bottom:58vw}
	.elementor .e-con.why,.elementor .e-con.news,.elementor .e-con.fg,.fg{grid-template-columns:1fr}
	.elementor .e-con.grid4,.elementor .e-con.grid3{grid-template-columns:1fr 1fr}
	.why>.e-con{min-height:340px}
	.wi{min-height:300px}
	.sec{padding:70px 0}
	.nl-img{width:100%!important}
}
@media (max-width:560px){
	.elementor .e-con.grid4,.elementor .e-con.grid3{grid-template-columns:1fr}
	.elementor .e-con.dir{flex-direction:column;width:100%}
	.hero-lead{font-size:17px}
}
@media (prefers-reduced-motion:reduce){
	.tr,.wa{animation:none}
	*{transition:none!important}
}

/* Elementor editor: everything visible and still */
.elementor-editor-active .rv{opacity:1!important}
.elementor-editor-active .nav{position:relative;top:0}