/*
Theme Name: ProPlus Menage
Template: hello-elementor
Description: Child theme of Hello Elementor for ProPlus-Menage. All site customisations live here.
Author: ProPlus-Menage
Version: 1.0.0
Text Domain: proplus-menage
*/

/* ==========================================================================
   ProPlus Menage - design system
   Brand: Cyan #0B6FA0 / #00A0E8 | Navy #004870 | Deep Navy #00263C
   Type:  Quicksand (headings) / Poppins (body)
   ========================================================================== */

:root{
  --pp-cyan:#0B6FA0;
  --pp-cyan-brand:#00a0e8;
  --pp-cyan-deep:#0b6fa0;
  --pp-navy:#004870;
  --pp-navy-deep:#00263c;
  --pp-ink:#14202b;
  --pp-body:#5a6b77;
  --pp-sky:#eaf6fd;
  --pp-mist:#e8e8e8;
  --pp-foot:#123a58;
  --pp-muted:#8494a0;
  --pp-shadow-card:0 18px 44px rgba(11,111,160,.14);
  --pp-shadow-lift:0 30px 56px rgba(11,111,160,.20);
}

body{font-family:'Poppins',sans-serif;color:var(--pp-body);}
h1,h2,h3,h4,h5,h6{font-family:'Quicksand',sans-serif;color:var(--pp-ink);}

/* --- Buttons --------------------------------------------------------- */
.pp-btn-primary .elementor-button,
.pp-btn-ghost .elementor-button,
.pp-btn-soft .elementor-button,
.pp-btn-wa .elementor-button{
  border-radius:999px;font-weight:600;
  transition:transform .15s ease,background .15s ease,box-shadow .15s ease;
}
.pp-btn-primary .elementor-button{background:var(--pp-cyan);color:#fff;box-shadow:0 14px 30px rgba(18,163,224,.4);}
.pp-btn-primary .elementor-button:hover{background:#0f8fc7;color:#fff;transform:translateY(-2px);}
.pp-btn-ghost .elementor-button{background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.4);color:#fff;}
.pp-btn-ghost .elementor-button:hover{background:rgba(255,255,255,.22);color:#fff;transform:translateY(-2px);}
.pp-btn-soft .elementor-button{background:var(--pp-sky);color:var(--pp-cyan-deep);}
.pp-btn-soft .elementor-button:hover{background:#dceffa;color:var(--pp-cyan-deep);transform:translateY(-2px);}
.pp-btn-wa .elementor-button{background:#25d366;color:#fff;}
.pp-btn-wa .elementor-button:hover{background:#1fbb59;color:#fff;transform:translateY(-2px);}

/* --- HERO ------------------------------------------------------------ */
.pp-hero{position:relative;overflow:hidden;min-height:640px;box-shadow:0 20px 50px rgba(11,111,160,.16);}
.pp-hero>.e-con-inner{position:relative;z-index:2;}
.pp-hero::after{
  content:"";position:absolute;inset:0;z-index:1;pointer-events:none;
  background:linear-gradient(100deg,rgba(8,28,42,.9) 0%,rgba(8,28,42,.6) 40%,rgba(8,28,42,.05) 78%);
}
/* five-photo crossfade, pure CSS - no JS */
.pp-hero-bg{position:absolute;inset:0;z-index:0;}
.pp-hero-bg i{
  position:absolute;inset:0;display:block;opacity:0;
  background-size:cover;background-position:center;
  animation:ppHeroFade 22.5s infinite;
}
.pp-hero-bg i:nth-child(1){animation-delay:0s;}
.pp-hero-bg i:nth-child(2){animation-delay:4.5s;}
.pp-hero-bg i:nth-child(3){animation-delay:9s;}
.pp-hero-bg i:nth-child(4){animation-delay:13.5s;}
.pp-hero-bg i:nth-child(5){animation-delay:18s;}
@keyframes ppHeroFade{0%{opacity:0}2%{opacity:1}20%{opacity:1}22%{opacity:0}100%{opacity:0}}
@media (prefers-reduced-motion:reduce){.pp-hero-bg i{animation:none}.pp-hero-bg i:first-child{opacity:1}}

.pp-hero-h1 .elementor-heading-title{
  font-family:'Poppins',sans-serif;font-weight:800;
  font-size:clamp(34px,5.2vw,58px);line-height:1.08;letter-spacing:-.02em;color:#fff;
}
.pp-hero-sub{font-size:15px;line-height:1.5;color:#d5e1ea;max-width:400px;}

/* --- NEED ASSISTANCE bar --------------------------------------------- */
.pp-assist{
  position:relative;z-index:6;margin-top:-42px;background:#fff;border-radius:16px;
  box-shadow:0 16px 40px rgba(11,111,160,.16);
}
.pp-assist-icon{width:44px;height:44px;border-radius:50%;background:#e8f6fd;display:flex;align-items:center;justify-content:center;flex-shrink:0;}
.pp-assist-title .elementor-heading-title{font-size:18px;font-weight:700;margin:0;}
.pp-phone .elementor-button{background:var(--pp-sky);color:var(--pp-cyan-deep);font-weight:700;border-radius:999px;}
.pp-phone .elementor-button:hover{background:#dceffa;color:var(--pp-cyan-deep);}

/* --- INTRO / STATS ---------------------------------------------------- */
.pp-intro-media{position:relative;min-height:520px;}
.pp-intro-img1{position:absolute;left:0;top:0;width:58%;}
.pp-intro-img1 img{aspect-ratio:5/6;object-fit:cover;border-radius:20px;box-shadow:0 20px 44px rgba(11,111,160,.2);width:100%;height:100%;}
.pp-intro-img2{position:absolute;left:26%;bottom:0;width:48%;}
.pp-intro-img2 img{aspect-ratio:1/1;object-fit:cover;border-radius:20px;border:6px solid #fff;box-shadow:0 18px 40px rgba(11,111,160,.24);width:100%;height:100%;}
.pp-stat-500{position:absolute;right:1%;top:4px;z-index:3;display:flex;align-items:flex-start;gap:2px;}
.pp-stat-500 b{writing-mode:vertical-rl;text-orientation:upright;font-family:'Quicksand',sans-serif;font-weight:700;font-size:clamp(46px,6.6vw,64px);color:#a7bac8;line-height:.9;letter-spacing:-2px;}
.pp-stat-500 span{writing-mode:vertical-rl;font-size:11px;font-weight:600;letter-spacing:.22em;text-transform:uppercase;color:#8697a4;margin-top:6px;}
.pp-stat-10{position:absolute;left:8px;bottom:0;z-index:3;}
.pp-stat-10 b{display:block;font-family:'Quicksand',sans-serif;font-weight:700;font-size:clamp(40px,6vw,56px);color:var(--pp-cyan);line-height:1;}
.pp-stat-10 span{display:block;font-size:11px;font-weight:600;letter-spacing:.2em;text-transform:uppercase;color:#4a5a67;margin-top:4px;}
.pp-intro-h2 .elementor-heading-title{font-size:clamp(26px,3.8vw,44px);letter-spacing:-.015em;line-height:1.12;}
.pp-intro-copy p{font-size:14.5px;line-height:1.75;margin:0 0 16px;}

/* --- SERVICES BAND ---------------------------------------------------- */
.pp-svc-band{position:relative;overflow:hidden;background:linear-gradient(160deg,#1aa9e6,#0b6fa0);}
.pp-svc-band::before{
  content:"";position:absolute;inset:0;opacity:.14;pointer-events:none;
  background:url(https://proplus-menage.wsdfy.com/wp-content/uploads/2026/09/hero-cleaning-5.jpg) center/cover no-repeat;
}
.pp-svc-band>.e-con-inner{position:relative;z-index:1;}
.pp-svc-band h2.elementor-heading-title{color:#fff;font-size:clamp(24px,3.6vw,40px);letter-spacing:-.015em;}
.pp-svc-band .pp-svc-sub{color:#e2f2fb;font-size:14.5px;line-height:1.6;}

.pp-svc-cards{margin-top:-118px;position:relative;z-index:2;}
.pp-svc-card{
  background:#fff;border-radius:150px 150px 44px 44px;overflow:hidden;text-align:center;
  box-shadow:var(--pp-shadow-card);transition:transform .22s ease,box-shadow .22s ease;
}
.pp-svc-card:hover{transform:translateY(-8px);box-shadow:var(--pp-shadow-lift);}
.pp-svc-card .pp-svc-img img{width:100%;height:230px;object-fit:cover;border-radius:150px 150px 30px 30px;display:block;}
.pp-svc-card h3.elementor-heading-title{font-size:18px;font-weight:700;}
.pp-svc-card .pp-svc-txt{font-size:13px;line-height:1.6;}

.pp-chips{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:9px;}
.pp-chips .lbl{color:var(--pp-cyan-deep);font-family:'Quicksand',sans-serif;font-weight:700;font-size:12px;letter-spacing:.1em;text-transform:uppercase;margin-right:4px;}
.pp-chips span.chip{background:var(--pp-sky);border:1px solid #cfe6f4;border-radius:999px;padding:7px 15px;font-size:12.5px;color:var(--pp-cyan-deep);}

/* --- WHY TRUST US ----------------------------------------------------- */
.pp-why-h2 .elementor-heading-title{font-size:clamp(26px,4vw,42px);letter-spacing:-.015em;}
.pp-why-sub{font-size:15px;line-height:1.6;max-width:540px;margin:0 auto;}
.pp-why-graphic{position:relative;max-width:720px;margin:40px auto 0;aspect-ratio:16/11;}
.pp-why-graphic .ring{position:absolute;inset:0;width:100%;height:100%;}
.pp-why-graphic .van{position:absolute;left:50%;top:52%;transform:translate(-50%,-50%);width:min(400px,66%);aspect-ratio:16/10;border-radius:16px;overflow:hidden;box-shadow:0 20px 44px rgba(11,111,160,.24);}
.pp-why-graphic .van img{width:100%;height:100%;object-fit:cover;display:block;}
.pp-why-badge{position:absolute;display:flex;align-items:center;gap:10px;}
.pp-why-badge .ic{width:42px;height:42px;border-radius:50%;background:#e8f6fd;display:flex;align-items:center;justify-content:center;flex-shrink:0;}
.pp-why-badge b{font-family:'Quicksand',sans-serif;font-weight:700;font-size:15px;color:var(--pp-ink);max-width:120px;}
.pp-why-badge.b1{left:2%;top:14%;}
.pp-why-badge.b1 b{text-align:right;}
.pp-why-badge.b2{right:2%;top:14%;}
.pp-why-badge.b3{left:50%;bottom:2%;transform:translateX(-50%);}

/* --- SERVICE DETAIL COLUMNS ------------------------------------------- */
.pp-detail-img img{width:100%;aspect-ratio:16/10;object-fit:cover;border-radius:18px;box-shadow:0 16px 36px rgba(11,111,160,.16);display:block;}
.pp-detail-col h3.elementor-heading-title{font-size:22px;}
.pp-detail-col .pp-detail-txt{font-size:14px;line-height:1.7;}
.pp-detail-list ul{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:1fr 1fr;gap:8px 14px;}
.pp-detail-list li{display:flex;align-items:center;gap:8px;font-size:13px;color:#2c3e4a;}
.pp-detail-list li svg{flex-shrink:0;}

/* --- BEFORE / AFTER --------------------------------------------------- */
.pp-diff-main{position:relative;max-width:900px;margin:0 auto;aspect-ratio:2/1;border-radius:18px;overflow:hidden;box-shadow:0 22px 50px rgba(11,111,160,.22);}
.pp-diff-main i{position:absolute;inset:0;display:block;opacity:0;background-size:cover;background-position:center;animation:ppDiffFade 12s infinite;}
.pp-diff-main i:nth-child(1){animation-delay:0s}
.pp-diff-main i:nth-child(2){animation-delay:3s}
.pp-diff-main i:nth-child(3){animation-delay:6s}
.pp-diff-main i:nth-child(4){animation-delay:9s}
@keyframes ppDiffFade{0%{opacity:0}3%{opacity:1}25%{opacity:1}28%{opacity:0}100%{opacity:0}}
@media (prefers-reduced-motion:reduce){.pp-diff-main i{animation:none}.pp-diff-main i:first-child{opacity:1}}
.pp-diff-thumbs{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;max-width:900px;margin:14px auto 0;}
.pp-diff-thumbs a{display:block;border-radius:10px;overflow:hidden;aspect-ratio:16/10;border:2px solid transparent;transition:border-color .2s;}
.pp-diff-thumbs a:hover{border-color:var(--pp-cyan);}
.pp-diff-thumbs img{width:100%;height:100%;object-fit:cover;display:block;}

/* --- ESTIMATE --------------------------------------------------------- */
.pp-est{position:relative;overflow:hidden;background:linear-gradient(160deg,#1aa9e6,#0b6fa0);border-radius:26px;}
.pp-est::before{content:"";position:absolute;right:-60px;top:-60px;width:220px;height:220px;border-radius:50%;background:rgba(255,255,255,.1);}
.pp-est>.e-con-inner{position:relative;z-index:1;}
.pp-est h2.elementor-heading-title{color:#fff;font-size:clamp(24px,3.6vw,40px);letter-spacing:-.015em;line-height:1.1;}
.pp-est .pp-est-sub{color:#e4f4fd;font-size:15px;line-height:1.65;max-width:340px;}
.pp-est-form{background:#fff;border-radius:18px;box-shadow:0 24px 50px rgba(8,28,42,.25);}
.pp-est-form h3.elementor-heading-title{font-size:20px;text-align:center;}

/* --- TESTIMONIALS ----------------------------------------------------- */
.pp-testi-h2 .elementor-heading-title{font-size:clamp(26px,4vw,42px);letter-spacing:-.015em;}
.pp-testi-card{background:#fff;border:1px solid #e6eef3;border-radius:22px;box-shadow:0 24px 54px rgba(11,111,160,.14);height:100%;}
.pp-testi-card .q{color:var(--pp-cyan);opacity:.9;}
.pp-testi-card .pp-quote{font-size:15.5px;color:#2c3e4a;line-height:1.7;}
.pp-testi-who{display:flex;align-items:center;gap:12px;}
.pp-testi-who .av{width:50px;height:50px;border-radius:50%;background:var(--pp-cyan-deep);color:#fff;display:flex;align-items:center;justify-content:center;font-family:'Quicksand',sans-serif;font-weight:700;flex-shrink:0;}
.pp-testi-who .nm{font-family:'Quicksand',sans-serif;font-weight:700;font-size:16px;color:var(--pp-ink);}
.pp-testi-who .rl{font-size:12.5px;color:var(--pp-muted);}

/* --- AREAS ------------------------------------------------------------ */
.pp-kicker .elementor-heading-title{font-family:'Quicksand',sans-serif;font-weight:700;color:var(--pp-cyan);letter-spacing:.18em;text-transform:uppercase;font-size:12.5px;}
.pp-areas-h2 .elementor-heading-title{font-size:clamp(24px,3.6vw,40px);letter-spacing:-.015em;}
.pp-area-card{background:#f4f9fc;border:1px solid #e6eef3;border-radius:20px;height:100%;}
.pp-area-card .hd{display:flex;align-items:center;gap:9px;margin-bottom:12px;}
.pp-area-card .hd h3{font-family:'Quicksand',sans-serif;font-weight:700;font-size:16px;margin:0;color:var(--pp-ink);}
.pp-area-card ul{columns:2;column-gap:18px;margin:0;padding-left:18px;list-style:disc;}
.pp-area-card li{font-size:12.5px;color:var(--pp-body);line-height:1.75;break-inside:avoid;}

/* --- Responsive ------------------------------------------------------- */
@media (max-width:1024px){
  .pp-svc-cards{margin-top:-70px;}
  .pp-intro-media{min-height:440px;}
}
@media (max-width:767px){
  .pp-hero{min-height:520px;}
  .pp-assist{margin-top:-24px;text-align:center;}
  .pp-intro-media{min-height:0;display:block;}
  .pp-intro-img1,.pp-intro-img2{position:static;width:100%;}
  .pp-intro-img2{margin-top:14px;}
  .pp-stat-500{display:none;}
  .pp-stat-10{position:static;margin-top:14px;}
  .pp-svc-cards{margin-top:-40px;}
  .pp-svc-card{border-radius:110px 110px 32px 32px;}
  .pp-why-graphic{aspect-ratio:auto;min-height:0;}
  .pp-why-graphic .ring{display:none;}
  .pp-why-graphic .van{position:static;transform:none;width:100%;margin-bottom:16px;}
  .pp-why-badge{position:static;transform:none;justify-content:center;margin-top:12px;}
  .pp-why-badge.b1 b{text-align:left;}
  .pp-why-badge b{max-width:none;}
  .pp-detail-list ul{grid-template-columns:1fr;}
  .pp-diff-thumbs{grid-template-columns:repeat(2,1fr);}
  .pp-area-card ul{columns:1;}
}

/* --- Positioning wrappers -------------------------------------------
   Elementor widget wrappers are position:relative, so absolutely
   positioned markup inside an HTML widget resolves against the wrapper
   (which has no height) instead of the section. These classes move the
   positioning up onto the wrapper itself. */
.pp-abs-fill{position:absolute;inset:0;z-index:0;}
.pp-abs-tr{position:absolute;right:1%;top:4px;z-index:3;width:auto;}
.pp-abs-bl{position:absolute;left:8px;bottom:0;z-index:3;width:auto;}
.pp-stat-500,.pp-stat-10{position:static;}

@media (max-width:767px){
  .pp-abs-tr{display:none;}
  .pp-abs-bl{position:static;margin-top:14px;}
}

/* --- Fluent Forms, styled to the ProPlus form design ----------------- */
.pp-est-form .fluentform .ff-el-group{margin-bottom:12px;}
.pp-est-form .fluentform .ff-el-input--label label{
  font-family:'Poppins',sans-serif;font-size:12.5px;font-weight:600;
  color:var(--pp-ink);margin-bottom:5px;
}
.pp-est-form .fluentform .ff-el-form-control{
  width:100%;border:1px solid #e0e8ee;border-radius:10px;padding:12px 14px;
  font-family:'Poppins',sans-serif;font-size:14px;color:var(--pp-ink);
  background:#fff;outline:none;box-shadow:none;
}
.pp-est-form .fluentform .ff-el-form-control:focus{
  border-color:var(--pp-cyan);box-shadow:0 0 0 4px rgba(18,163,224,.12);
}
.pp-est-form .fluentform .ff-el-form-control::placeholder{color:#a6b3bd;}
.pp-est-form .fluentform .ff-btn-submit,
.pp-est-form .fluentform button[type=submit]{
  width:100%;background:var(--pp-cyan);color:#fff;font-family:'Poppins',sans-serif;
  font-weight:600;font-size:15px;padding:14px;border:none;border-radius:12px;
  cursor:pointer;box-shadow:0 12px 28px rgba(18,163,224,.3);
  transition:background .15s ease,transform .15s ease;
}
.pp-est-form .fluentform .ff-btn-submit:hover,
.pp-est-form .fluentform button[type=submit]:hover{background:#0f8fc7;transform:translateY(-2px);}
.pp-est-form .fluentform .ff-el-group.ff-el-form-top .ff-el-form-check{font-size:13px;}
.pp-est-form .ff-el-progress-bar{background:var(--pp-cyan);}

/* Area lists: force the two-column flow (columns is on the ul) */
.pp-area-card ul{column-count:2;-webkit-column-count:2;}
@media (max-width:767px){.pp-area-card ul{column-count:1;-webkit-column-count:1;}}

/* ====================================================================
   HERO - three-banner crossfade (Herobanner1/2/3)
   ==================================================================== */
.pp-hero-bg-3 i{animation:ppHeroFade3 15s infinite;}
.pp-hero-bg-3 i:nth-child(1){animation-delay:0s;}
.pp-hero-bg-3 i:nth-child(2){animation-delay:5s;}
.pp-hero-bg-3 i:nth-child(3){animation-delay:10s;}
@keyframes ppHeroFade3{0%{opacity:0}3%{opacity:1}30%{opacity:1}33%{opacity:0}100%{opacity:0}}
@media (prefers-reduced-motion:reduce){
  .pp-hero-bg-3 i{animation:none}
  .pp-hero-bg-3 i:first-child{opacity:1}
}

/* ====================================================================
   UAE HEADER
   ==================================================================== */
.ehf-header{position:relative;z-index:100;background:var(--pp-navy-deep);}
.pp-header{width:100%;}

/* On the front page the header floats over the hero photo */
body.home .ehf-header,
body.page-id-23 .ehf-header{
  position:absolute;top:0;left:0;right:0;background:transparent;
}
body.home .site-content,
body.page-id-23 .site-content{padding-top:0;}

/* Logo in its white rounded holder, exactly as the brand kit requires
   (full-colour mark inside a white holding shape on dark backgrounds) */
.pp-logo{flex-shrink:0;}
.pp-logo .elementor-widget-container{
  background:#fff;padding:16px 28px 26px;border-radius:0 0 46px 46px;
  box-shadow:0 16px 34px rgba(8,28,42,.2);display:inline-block;line-height:0;
}
.pp-logo img{height:54px;width:auto;display:block;}

/* Navigation */
.pp-nav .hfe-nav-menu__layout-horizontal .hfe-nav-menu__toggle-icon,
.pp-nav .menu-item a.hfe-menu-item,
.pp-nav .menu-item a.hfe-sub-menu-item{
  font-family:'Poppins',sans-serif;font-size:14px;font-weight:500;color:#fff;
}
.pp-nav .menu-item a.hfe-menu-item:hover,
.pp-nav .menu-item.current-menu-item a.hfe-menu-item{color:#7fd0f5;}
.pp-nav .menu-item.current-menu-item a.hfe-menu-item{
  text-decoration:underline;text-underline-offset:7px;text-decoration-thickness:2px;
}
.pp-nav .hfe-nav-menu li a.hfe-menu-item{padding-left:11px;padding-right:11px;}
/* Services dropdown panel */
.pp-nav .sub-menu{
  background:#fff;border-radius:14px;box-shadow:0 18px 44px rgba(8,28,42,.22);
  padding:8px;min-width:246px;border:none;
}
.pp-nav .sub-menu li a.hfe-sub-menu-item{
  color:var(--pp-ink);font-size:13.5px;font-weight:500;border-radius:9px;
  padding:10px 14px;white-space:nowrap;border:none;
}
.pp-nav .sub-menu li a.hfe-sub-menu-item:hover{background:var(--pp-sky);color:var(--pp-cyan-deep);}

/* FR / EN switch */
.pp-lang{display:flex;align-items:center;font-family:'Quicksand',sans-serif;font-weight:700;font-size:13px;}
.pp-lang a{padding:0 6px;color:rgba(255,255,255,.6);}
.pp-lang a.is-on{color:#fff;}
.pp-lang a:hover{color:#7fd0f5;}
.pp-lang span{color:rgba(255,255,255,.5);}

/* Search icon */
.pp-search .hfe-search-icon-toggle .hfe-search-form__input{color:#fff;}
.pp-search svg,.pp-search i{color:#fff;}
.pp-search .hfe-search-button-wrapper{
  width:38px;height:38px;border-radius:50%;border:1px solid rgba(255,255,255,.55);
  display:flex;align-items:center;justify-content:center;
}
.pp-head-cta .elementor-button{font-size:13.5px;padding:12px 20px;box-shadow:0 10px 24px rgba(18,163,224,.4);white-space:nowrap;}

/* Mobile toggle colour */
.pp-nav .hfe-nav-menu-icon svg,.pp-nav .hfe-nav-menu-icon i{color:#fff;}

/* ====================================================================
   UAE FOOTER
   ==================================================================== */
.ehf-footer{background:var(--pp-foot);color:#b7c9d6;position:relative;}
.pp-foot-cta{
  background:#fff;border-radius:22px;box-shadow:0 20px 50px rgba(8,28,42,.28);
  transform:translateY(-50%);margin-bottom:-40px !important;
}
.pp-foot-cta-av{width:60px;height:60px;border-radius:50%;overflow:hidden;box-shadow:0 8px 20px rgba(11,111,160,.25);flex-shrink:0;}
.pp-foot-cta-av img{width:100%;height:100%;object-fit:cover;display:block;}
.pp-foot-cta-h .elementor-heading-title{
  font-family:'Quicksand',sans-serif;font-weight:700;
  font-size:clamp(17px,2.4vw,24px);color:var(--pp-ink);line-height:1.15;margin:0;
}
.pp-btn-outline .elementor-button{
  background:#fff;border:1.5px solid #cfe0ea;color:var(--pp-cyan-deep);
  font-weight:600;font-size:14px;padding:13px 24px;border-radius:999px;
}
.pp-btn-outline .elementor-button:hover{background:var(--pp-sky);color:var(--pp-cyan-deep);transform:translateY(-2px);}

.pp-footer-main{color:#b7c9d6;}
.pp-footer-main > .e-con-inner{grid-template-columns:1.6fr 1fr 1fr;}
.pp-foot-col-1{max-width:380px;}
.pp-foot-blurb p{font-size:14px;line-height:1.7;margin:0 0 18px;color:#b7c9d6;}
.pp-foot-h .elementor-heading-title{
  font-family:'Quicksand',sans-serif;font-weight:700;color:#fff;font-size:14.5px;margin:0 0 15px;
}
.pp-foot-links{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:10px;font-size:13.5px;}
.pp-foot-links a{color:#b7c9d6;}
.pp-foot-links a:hover{color:#7fd0f5;}
.pp-foot-addr{font-size:13px;line-height:1.8;margin-top:18px;color:#9fb6c6;}
.pp-foot-addr a{color:#7fd0f5;}
.pp-copy{font-size:13px;color:#9fb6c6;text-align:center;}

/* Newsletter form pill in the footer */
.pp-foot-sub .fluentform .ff-el-group{margin-bottom:0;}
.pp-foot-sub .fluentform .ff-el-input--label{display:none;}
.pp-foot-sub .fluentform .ff-el-form-control{
  background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.14);
  border-radius:999px;color:#fff;padding:12px 18px;
}
.pp-foot-sub .fluentform .ff-el-form-control::placeholder{color:#9fb6c6;}
.pp-foot-sub .fluentform .ff-btn-submit{
  background:var(--pp-cyan);color:#fff;border-radius:999px;padding:11px 22px;
  font-weight:600;font-size:13.5px;border:none;width:auto;box-shadow:none;
}

/* ====================================================================
   RESPONSIVE - full pass
   ==================================================================== */

/* Large desktop down to laptop */
@media (max-width:1280px){
  .pp-hero-h1 .elementor-heading-title{font-size:clamp(32px,4.6vw,50px);}
  .pp-nav .hfe-nav-menu li a.hfe-menu-item{padding-left:8px;padding-right:8px;font-size:13px;}
  .pp-logo .elementor-widget-container{padding:12px 20px 20px;}
  .pp-logo img{height:44px;}
}

/* Tablet landscape */
@media (max-width:1024px){
  .pp-header{flex-wrap:wrap;}
  .pp-nav{order:3;width:100%;}
  .pp-hero{min-height:560px;}
  .pp-footer-main > .e-con-inner{grid-template-columns:1fr 1fr;}
  .pp-foot-col-1{grid-column:1 / -1;max-width:none;}
  .pp-diff-main{aspect-ratio:16/9;}
}

/* Tablet portrait */
@media (max-width:900px){
  .pp-hero-h1 .elementor-heading-title{font-size:clamp(30px,6vw,42px);}
  .pp-svc-card{border-radius:130px 130px 40px 40px;}
  .pp-svc-card .pp-svc-img img{height:200px;border-radius:130px 130px 26px 26px;}
  .pp-foot-cta{transform:none;margin-bottom:0 !important;border-radius:18px;}
  .ehf-footer{padding-top:34px;}
}

/* Mobile */
@media (max-width:767px){
  body.home .ehf-header,
  body.page-id-23 .ehf-header{position:relative;background:var(--pp-navy-deep);}
  .pp-header{padding-top:10px !important;padding-bottom:10px !important;flex-wrap:nowrap;}
  .pp-logo .elementor-widget-container{padding:8px 14px 12px;border-radius:0 0 26px 26px;}
  .pp-logo img{height:36px;}
  .pp-head-right{gap:6px !important;}
  .pp-head-cta .elementor-button{font-size:12px;padding:10px 14px;}
  .pp-lang{display:none;}
  .pp-search{display:none;}
  .pp-nav{order:0;width:auto;}

  .pp-hero{min-height:460px;}
  .pp-hero-h1 .elementor-heading-title{font-size:30px;line-height:1.12;}
  .pp-hero-h1 .elementor-heading-title br{display:none;}
  .pp-hero-sub{font-size:14px;max-width:none;}

  .pp-assist{text-align:center;justify-content:center;}
  .pp-assist-title .elementor-heading-title{font-size:16px;}

  .pp-chips{justify-content:flex-start;}
  .pp-svc-card{border-radius:120px 120px 32px 32px;}

  .pp-diff-main{aspect-ratio:4/3;border-radius:14px;}
  .pp-diff-thumbs{gap:8px;}

  .pp-est{border-radius:18px;}
  .pp-est .pp-est-sub{max-width:none;}

  .pp-footer-main > .e-con-inner{grid-template-columns:1fr;}
  .pp-foot-cta{flex-direction:column;align-items:stretch;text-align:center;}
  .pp-foot-cta .pp-foot-cta-av{margin:0 auto;}
  .pp-foot-cta > .e-con-inner > *{justify-content:center !important;}
}

/* Small mobile */
@media (max-width:480px){
  .pp-hero-h1 .elementor-heading-title{font-size:26px;}
  .pp-hero .elementor-widget-button{width:100%;}
  .pp-hero .elementor-button{width:100%;justify-content:center;}
  .pp-svc-card{border-radius:100px 100px 28px 28px;}
  .pp-svc-card .pp-svc-img img{height:180px;border-radius:100px 100px 22px 22px;}
  .pp-diff-thumbs{grid-template-columns:repeat(2,1fr);}
  .pp-head-cta .elementor-button{padding:9px 12px;font-size:11.5px;}
}

/* Never let anything push the page sideways */
html,body{overflow-x:hidden;max-width:100%;}
img{max-width:100%;height:auto;}

/* ====================================================================
   CORRECTION: in UAE, "ehf-header" and "ehf-footer" are classes on the
   BODY element, not on the header/footer wrappers. The real wrappers are
   #masthead and #colophon. The rules above were therefore styling <body>.
   Undo that, then target the real elements.
   ==================================================================== */
body.ehf-header{position:static;z-index:auto;background:#fff;}
body.ehf-footer{background:#fff;}

/* --- Header wrapper --------------------------------------------------- */
body.ehf-header #masthead{
  position:relative;z-index:100;background:var(--pp-navy-deep);
}
/* Front page: header floats over the hero photo */
body.home.ehf-header #masthead,
body.page-id-23.ehf-header #masthead{
  position:absolute;top:0;left:0;right:0;background:transparent;
}
body.ehf-header #masthead .elementor{width:100%;}

/* --- Footer wrapper --------------------------------------------------- */
body.ehf-footer #colophon{
  background:var(--pp-foot);color:#b7c9d6;position:relative;
  margin-top:70px;padding-bottom:0;
}
body.ehf-footer #colophon .footer-width-fixer{width:100%;}

@media (max-width:900px){
  body.ehf-footer #colophon{padding-top:34px;margin-top:40px;}
}
@media (max-width:767px){
  body.home.ehf-header #masthead,
  body.page-id-23.ehf-header #masthead{
    position:relative;background:var(--pp-navy-deep);
  }
  body.ehf-footer #colophon{margin-top:24px;}
}

/* ====================================================================
   EXACT-MATCH PASS - fixes verified against the live DOM
   ==================================================================== */

/* 1. Elementor 4 renders the Image widget with NO .elementor-widget-container;
      the anchor is a direct child. Target that instead, so the logo gets its
      white rounded holder from the design. */
.pp-logo > a,
.pp-logo > img{
  background:#fff;padding:16px 28px 26px;border-radius:0 0 46px 46px;
  box-shadow:0 16px 34px rgba(8,28,42,.2);display:inline-block;line-height:0;
}
.pp-logo{line-height:0;}
.pp-logo img{height:54px;width:auto;display:block;}

/* 2. Button variants. Elementor's kit-level button rule matches at the same
      specificity, so these need !important to win reliably. */
.pp-btn-primary .elementor-button{background-color:#0B6FA0 !important;color:#fff !important;box-shadow:0 14px 30px rgba(18,163,224,.4);}
.pp-btn-primary .elementor-button:hover{background-color:#0f8fc7 !important;color:#fff !important;}

.pp-btn-ghost .elementor-button{background-color:rgba(255,255,255,.12) !important;border:1px solid rgba(255,255,255,.4);color:#fff !important;box-shadow:none;}
.pp-btn-ghost .elementor-button:hover{background-color:rgba(255,255,255,.22) !important;color:#fff !important;}

.pp-btn-soft .elementor-button{background-color:#eaf6fd !important;color:#0b6fa0 !important;box-shadow:none;}
.pp-btn-soft .elementor-button:hover{background-color:#dceffa !important;color:#0b6fa0 !important;}

.pp-btn-wa .elementor-button{background-color:#25d366 !important;color:#fff !important;box-shadow:none;}
.pp-btn-wa .elementor-button:hover{background-color:#1fbb59 !important;color:#fff !important;}

.pp-btn-outline .elementor-button{background-color:#fff !important;border:1.5px solid #cfe0ea;color:#0b6fa0 !important;font-size:14px;padding:13px 24px;box-shadow:none;}
.pp-btn-outline .elementor-button:hover{background-color:#eaf6fd !important;color:#0b6fa0 !important;}

.pp-phone .elementor-button{background-color:#eaf6fd !important;color:#0b6fa0 !important;font-weight:700;box-shadow:none;}
.pp-phone .elementor-button:hover{background-color:#dceffa !important;color:#0b6fa0 !important;}
.pp-phone .elementor-button-icon svg,
.pp-phone .elementor-button-icon i{color:#0B6FA0;fill:#0B6FA0;}

/* 3. Heading colours. The kit now sets ink globally; these are the
      on-dark exceptions from the design. */
.pp-hero-h1 .elementor-heading-title{color:#fff !important;}
.pp-svc-band .elementor-heading-title{color:#fff !important;}
.pp-est .elementor-heading-title{color:#fff !important;}
.pp-est-form .elementor-heading-title{color:#14202b !important;}
.pp-kicker .elementor-heading-title{color:#0B6FA0 !important;}
.pp-foot-h .elementor-heading-title{color:#fff !important;}
.pp-foot-cta-h .elementor-heading-title{color:#14202b !important;}

/* 4. A boxed container paints its background full-bleed, so the white
      "Need Assistance" bar and the footer CTA card were spanning the whole
      viewport. Constrain the painted box to the design's 1232px. */
.pp-assist,
.pp-foot-cta{
  max-width:1232px;margin-left:auto;margin-right:auto;width:calc(100% - 48px);
}
.pp-assist{margin-top:-32px;}

/* 5. Footer: three columns weighted 1.6 / 1 / 1 as in the design */
.pp-footer-main > .e-con-inner{grid-template-columns:1.6fr 1fr 1fr;}
.pp-foot-col-1{max-width:none;}
.pp-foot-blurb{max-width:340px;}
.pp-foot-addr{max-width:340px;}
.pp-foot-sub{max-width:360px;}

@media (max-width:1024px){
  .pp-footer-main > .e-con-inner{grid-template-columns:1fr 1fr;}
  .pp-foot-col-1{grid-column:1 / -1;}
}
@media (max-width:767px){
  .pp-footer-main > .e-con-inner{grid-template-columns:1fr;}
  .pp-assist,.pp-foot-cta{width:calc(100% - 32px);}
  .pp-logo > a{padding:8px 14px 12px;border-radius:0 0 26px 26px;}
}

/* 6. Nav: keep it on one row on desktop and stop it colliding with the logo */
.pp-nav .hfe-nav-menu{display:flex;flex-direction:row;flex-wrap:wrap;justify-content:center;}
.pp-nav ul.hfe-nav-menu li{margin:0;}
.pp-header{align-items:center;}
@media (min-width:1025px){
  .pp-nav{flex:1 1 auto;}
  .pp-nav .hfe-nav-menu{justify-content:center;}
}

/* ====================================================================
   EXACT-MATCH PASS 2
   ==================================================================== */

/* 1. Elementor 4 paints every Heading widget with the global Primary colour
      via ".elementor-widget-heading .elementor-heading-title" (0,2,0), which
      outranks both the Kit's "h2" rule and a bare element selector. Beat it
      once, then re-declare the on-dark exceptions from the design. */
.elementor-widget.elementor-widget-heading .elementor-heading-title{color:#14202b !important;}

.pp-hero .elementor-widget.elementor-widget-heading .elementor-heading-title,
.pp-svc-band .elementor-widget.elementor-widget-heading .elementor-heading-title,
.pp-est .elementor-widget.elementor-widget-heading .elementor-heading-title,
#colophon .elementor-widget.elementor-widget-heading.pp-foot-h .elementor-heading-title{color:#fff !important;}

.pp-est-form .elementor-widget.elementor-widget-heading .elementor-heading-title{color:#14202b !important;}
.elementor-widget.elementor-widget-heading.pp-kicker .elementor-heading-title{color:#0B6FA0 !important;}
.elementor-widget.elementor-widget-heading.pp-assist-title .elementor-heading-title{color:#14202b !important;}

/* 2. Elementor caps every top-level container at min(100%, var(--width)) with
      higher specificity, so the design's inset white bars need to force it. */
.pp-assist,
.pp-foot-cta{max-width:1232px !important;width:calc(100% - 48px) !important;margin-left:auto !important;margin-right:auto !important;}

/* 3. TESTIMONIALS - one card at a time, exactly as the design:
      a snap track with working arrows and dots (no JS needed). */
.pp-testi-track{
  max-width:620px;margin:0 auto;overflow-x:auto;scroll-snap-type:x mandatory;
  scroll-behavior:smooth;scrollbar-width:none;-ms-overflow-style:none;
}
.pp-testi-track::-webkit-scrollbar{display:none;}
.pp-testi-track > .pp-testi-card{flex:0 0 100%;scroll-snap-align:center;}
.pp-testi-card{text-align:center;}
.pp-testi-card .pp-testi-who{justify-content:center;}

.pp-testi-nav{display:flex;align-items:center;justify-content:center;gap:14px;margin-top:24px;}
.pp-testi-nav .arw{
  width:42px;height:42px;border-radius:50%;display:flex;align-items:center;
  justify-content:center;transition:transform .15s ease;
}
.pp-testi-nav .arw:hover{transform:translateY(-2px);}
.pp-testi-nav .arw.prev{border:1px solid #d6e2ea;background:#fff;}
.pp-testi-nav .arw.next{background:#0B6FA0;border:none;}
.pp-testi-nav .dots{display:flex;gap:7px;}
.pp-testi-nav .dots a{
  width:8px;height:8px;border-radius:50%;background:#cfe0ea;display:block;
  transition:background .2s ease,width .2s ease;
}
.pp-testi-nav .dots a:hover{background:#0B6FA0;width:20px;border-radius:999px;}

/* 4. FOOTER bottom bar - copyright left, socials right, logo plaque centred */
#colophon .pp-foot-bottom{
  position:relative;margin-top:44px;padding-top:22px;
  border-top:1px solid rgba(255,255,255,.12);
  display:flex;align-items:center;justify-content:space-between;gap:14px;min-height:60px;
}
#colophon .pp-copy{font-size:12.5px;color:#b7c9d6;text-align:left;}
#colophon .pp-foot-logo{
  position:absolute;left:50%;bottom:-64px;transform:translateX(-50%);
  background:#fff;padding:32px 52px 22px;border-radius:60px 60px 0 0;
  display:flex;align-items:center;justify-content:center;
  box-shadow:0 -10px 26px rgba(0,0,0,.16);z-index:2;line-height:0;
}
#colophon .pp-foot-logo img{height:72px;width:auto;display:block;}
#colophon .pp-social{display:flex;gap:9px;}
#colophon .pp-social a{
  width:36px;height:36px;border-radius:50%;background:rgba(255,255,255,.1);
  display:flex;align-items:center;justify-content:center;color:#fff;
  transition:background .2s ease;
}
#colophon .pp-social a:hover{background:#0B6FA0;color:#fff;}
/* room for the plaque that hangs below the footer */
body.ehf-footer #colophon{padding-bottom:70px;}
.pp-footer-bottom{padding-bottom:0 !important;}

/* 5. QUOTE FORM - two-column pairs, as in the design */
.pp-est-form .fluentform form{display:grid;grid-template-columns:1fr 1fr;column-gap:12px;}
.pp-est-form .fluentform .ff-el-group{grid-column:span 1;}
.pp-est-form .fluentform .ff-el-group:has(textarea),
.pp-est-form .fluentform .ff-el-group:has(input[type=file]),
.pp-est-form .fluentform .ff_submit_btn_wrapper,
.pp-est-form .fluentform .ff-el-group.ff-text-left:last-of-type{grid-column:1 / -1;}
.pp-est-form .fluentform .ff-el-form-check,
.pp-est-form .fluentform .ff-el-group.ff-custom_html{grid-column:1 / -1;}

/* File-upload drop zone, styled to the design's dashed panel */
.pp-est-form .fluentform .ff-el-input--content .ff_upload_btn,
.pp-est-form .fluentform .ff-upload-zone-content{
  border:1.5px dashed #cfe0ea;border-radius:12px;padding:20px;text-align:center;
  color:#7d8f9b;background:#fff;width:100%;display:block;font-size:13px;font-weight:600;
}

@media (max-width:767px){
  .pp-est-form .fluentform form{grid-template-columns:1fr;}
  #colophon .pp-foot-bottom{flex-direction:column;text-align:center;gap:16px;padding-bottom:80px;}
  #colophon .pp-foot-logo{bottom:-40px;padding:20px 34px 14px;border-radius:40px 40px 0 0;}
  #colophon .pp-foot-logo img{height:48px;}
  body.ehf-footer #colophon{padding-bottom:48px;}
  .pp-testi-track{max-width:100%;}
}

/* ====================================================================
   TEXT / ITEM PLACEMENT FIX
   An Elementor child container defaults to width:100%, so in a flex row
   each half claimed the whole line and wrapped underneath the other.
   That is what stacked the header, the "Need Assistance" bar and the
   "Let's Make Your Property Spotless!" bar. Size them to content instead.
   ==================================================================== */
.pp-header   > .e-con-inner > .e-con,
.pp-assist   > .e-con-inner > .e-con,
.pp-foot-cta > .e-con-inner > .e-con{
  width:auto !important;flex:0 1 auto;
}

/* --- Header: logo left | nav centred | actions right ------------------ */
.pp-header > .e-con-inner{flex-wrap:nowrap;}
.pp-header > .e-con-inner > .pp-nav{flex:1 1 auto;min-width:0;}
.pp-header > .e-con-inner > .pp-logo{flex:0 0 auto;align-self:flex-start;}
.pp-head-right{flex:0 0 auto;justify-content:flex-end;}

/* --- "Need Assistance?" : one row, vertically centred ----------------- */
.pp-assist > .e-con-inner{flex-wrap:nowrap;align-items:center;}
.pp-assist .pp-assist-title .elementor-heading-title{
  font-family:'Quicksand',sans-serif;font-weight:700;font-size:18px;
  color:#14202b !important;margin:0;white-space:nowrap;
}
.pp-assist [data-id="ppassistl"]{align-items:center;}
.pp-assist [data-id="ppassistr"]{align-items:center;justify-content:flex-end;}

/* --- "Let's Make Your Property Spotless!" : one row ------------------- */
.pp-foot-cta > .e-con-inner{flex-wrap:nowrap;align-items:center;}
.pp-foot-cta .pp-foot-cta-h .elementor-heading-title{
  font-family:'Quicksand',sans-serif;font-weight:700;
  font-size:clamp(17px,2.4vw,24px);color:#14202b !important;line-height:1.15;margin:0;
}

/* --- Footer bottom bar must span the full 1280 ------------------------ */
.pp-footer-bottom > .e-con-inner{width:100%;}
.pp-footer-bottom .elementor-widget-html{width:100% !important;}
.pp-footer-bottom .elementor-widget-html > .elementor-widget-container,
.pp-footer-bottom .elementor-widget-html > div{width:100%;}

/* --- Wrap sensibly on small screens ---------------------------------- */
@media (max-width:900px){
  .pp-assist > .e-con-inner,
  .pp-foot-cta > .e-con-inner{flex-wrap:wrap;justify-content:center;}
  .pp-assist .pp-assist-title .elementor-heading-title{white-space:normal;}
}
@media (max-width:1024px){
  .pp-header > .e-con-inner{flex-wrap:wrap;}
  .pp-header > .e-con-inner > .pp-nav{flex:0 0 auto;order:3;width:100%;}
}

/* ====================================================================
   LOGO PLAQUES FLUSH TO THE EDGE (no gap above / below)
   ==================================================================== */

/* Header: the white holder hangs from the very top of the page, so it
   must start at y=0 with nothing above it. */
body.ehf-header #masthead,
body.ehf-header #masthead .elementor,
.pp-header,
.pp-header > .e-con-inner{padding-top:0 !important;margin-top:0 !important;}
.pp-logo{margin-top:0 !important;align-self:flex-start !important;}
.pp-logo .elementor-widget-container{padding:0 !important;margin:0 !important;background:none !important;box-shadow:none !important;}
.pp-logo > a{
  margin-top:0 !important;
  padding:16px 28px 26px !important;
  border-radius:0 0 46px 46px !important;
}

/* The actions row and nav still need to sit on the header's optical centre */
.pp-header > .e-con-inner{align-items:center;min-height:96px;}
.pp-header > .e-con-inner > .pp-nav,
.pp-head-right{align-self:center;}

/* Footer: the plaque sits flush on the bottom edge of the footer,
   flat-bottomed with only the top corners rounded (60px 60px 0 0). */
body.ehf-footer #colophon{padding-bottom:126px;}
#colophon .pp-foot-logo{bottom:-126px;padding:32px 52px 22px;}

@media (max-width:767px){
  .pp-logo > a{padding:8px 14px 12px !important;border-radius:0 0 26px 26px !important;}
  .pp-header > .e-con-inner{min-height:64px;}
  body.ehf-footer #colophon{padding-bottom:82px;}
  #colophon .pp-foot-logo{bottom:-82px;padding:20px 34px 14px;}
  #colophon .pp-foot-logo img{height:48px;}
}

/* ====================================================================
   "Need Assistance?" - label and buttons locked to one line
   ==================================================================== */
.pp-assist > .e-con-inner{
  display:flex !important;flex-direction:row !important;flex-wrap:nowrap !important;
  align-items:center !important;justify-content:space-between !important;gap:16px;
}
.pp-assist > .e-con-inner > .e-con{
  width:auto !important;flex:0 0 auto !important;
  display:flex !important;flex-direction:row !important;flex-wrap:nowrap !important;
  align-items:center !important;
}
.pp-assist .elementor-widget{width:auto !important;}
.pp-assist .pp-assist-title .elementor-heading-title{white-space:nowrap;}
.pp-assist .elementor-button{white-space:nowrap;}

/* Same treatment for the footer CTA bar */
.pp-foot-cta > .e-con-inner{
  display:flex !important;flex-direction:row !important;flex-wrap:nowrap !important;
  align-items:center !important;justify-content:space-between !important;gap:18px;
}
.pp-foot-cta > .e-con-inner > .e-con{
  width:auto !important;flex:0 0 auto !important;
  display:flex !important;flex-direction:row !important;flex-wrap:nowrap !important;
  align-items:center !important;
}
.pp-foot-cta .elementor-widget{width:auto !important;}
.pp-foot-cta .elementor-button{white-space:nowrap;}

@media (max-width:900px){
  .pp-assist > .e-con-inner,
  .pp-foot-cta > .e-con-inner{flex-wrap:wrap !important;justify-content:center !important;}
  .pp-assist .pp-assist-title .elementor-heading-title{white-space:normal;}
}

/* ====================================================================
   HEADER NAV COLOURS - white links, active/hover in sky blue
   UAE emits its own per-widget link colour, so these must be forced.
   ==================================================================== */
.pp-nav .hfe-nav-menu a.hfe-menu-item,
.pp-nav .hfe-nav-menu a.hfe-menu-item:link,
.pp-nav .hfe-nav-menu a.hfe-menu-item:visited,
.pp-nav ul.hfe-nav-menu > li > a.hfe-menu-item{
  color:#ffffff !important;
  font-family:'Poppins',sans-serif;font-size:14px;font-weight:500;
  fill:#ffffff;
}
.pp-nav .hfe-nav-menu a.hfe-menu-item .sub-arrow svg,
.pp-nav .hfe-nav-menu a.hfe-menu-item svg{fill:#ffffff !important;color:#ffffff !important;}

/* hover + current page = sky blue, underlined like the design */
.pp-nav .hfe-nav-menu a.hfe-menu-item:hover,
.pp-nav .hfe-nav-menu a.hfe-menu-item:focus,
.pp-nav .hfe-nav-menu li.current-menu-item > a.hfe-menu-item,
.pp-nav .hfe-nav-menu li.current-menu-ancestor > a.hfe-menu-item,
.pp-nav ul.hfe-nav-menu > li.current-menu-item > a.hfe-menu-item{
  color:#7fd0f5 !important;
}
.pp-nav .hfe-nav-menu li.current-menu-item > a.hfe-menu-item{
  text-decoration:underline;text-underline-offset:7px;text-decoration-thickness:2px;
}

/* Dropdown items stay dark on the white panel */
.pp-nav .sub-menu a.hfe-sub-menu-item,
.pp-nav .sub-menu a.hfe-sub-menu-item:link,
.pp-nav .sub-menu a.hfe-sub-menu-item:visited{color:#14202b !important;}
.pp-nav .sub-menu a.hfe-sub-menu-item:hover{background:#eaf6fd;color:#0b6fa0 !important;}

/* ====================================================================
   FOOTER - close the gap under the logo plaque
   ==================================================================== */
.pp-footer-bottom,
.pp-footer-bottom > .e-con-inner{padding-bottom:0 !important;margin-bottom:0 !important;}
#colophon .pp-foot-bottom{margin-bottom:0;}
body.ehf-footer #colophon{padding-bottom:126px;}
#colophon .pp-foot-logo{bottom:-126px;}

/* ====================================================================
   SEE THE DIFFERENCE - light blue section, soft edges
   ==================================================================== */
.pp-diff-section{position:relative;}
.pp-diff-section::before{
  content:"";position:absolute;left:0;right:0;top:0;height:90px;
  background:linear-gradient(180deg,#fff 0%,rgba(255,255,255,0) 100%);
  pointer-events:none;
}
.pp-diff-section::after{
  content:"";position:absolute;left:0;right:0;bottom:0;height:90px;
  background:linear-gradient(0deg,#fff 0%,rgba(255,255,255,0) 100%);
  pointer-events:none;
}
.pp-diff-section > .e-con-inner{position:relative;z-index:1;}

/* ====================================================================
   WHAT OUR CLIENTS SAY - finished carousel card
   ==================================================================== */
.pp-testi-track{max-width:620px;margin:0 auto;}
.pp-testi-card{
  text-align:center;padding:40px 34px !important;
  border:1px solid #e6eef3;border-radius:22px;background:#fff;
  box-shadow:0 24px 54px rgba(11,111,160,.14);
}
.pp-testi-card .elementor-widget-html:first-child{margin:0 auto 10px;}
.pp-testi-card .q{display:block;margin:0 auto;width:46px;height:46px;}
.pp-testi-card .pp-quote{font-size:16.5px;line-height:1.7;color:#2c3e4a;margin:0;}
.pp-testi-card .pp-quote p{margin:0;}
.pp-testi-who{display:flex;align-items:center;justify-content:center;gap:12px;margin-top:24px;}
.pp-testi-who .av{
  width:50px;height:50px;border-radius:50%;background:#0b6fa0;color:#fff;
  display:flex;align-items:center;justify-content:center;
  font-family:'Quicksand',sans-serif;font-weight:700;flex-shrink:0;
}
.pp-testi-who > div{text-align:left;}
.pp-testi-who .nm{font-family:'Quicksand',sans-serif;font-weight:700;font-size:16px;color:#14202b;}
.pp-testi-who .rl{font-size:12.5px;color:#8494a0;}

/* keep every card the same height so the carousel never jumps */
.pp-testi-track > .pp-testi-card{min-height:318px;justify-content:center;}

/* ====================================================================
   HERO SUBTITLE - white, per the design
   ==================================================================== */
.pp-hero-sub,
.pp-hero-sub p,
.pp-hero .elementor-widget-text-editor.pp-hero-sub,
.pp-hero .elementor-widget-text-editor.pp-hero-sub p{
  color:#ffffff !important;font-size:15px;line-height:1.5;max-width:400px;
}

/* ====================================================================
   WHY CLIENTS TRUST US - "Flexible Scheduling" badge alignment
   In the design the bottom badge has NO max-width (unlike the two top
   badges), so its label sits on one line beside the icon. Mine was
   inheriting the 120px cap and wrapping onto two lines, which threw the
   icon out of vertical alignment and pushed the text onto the ellipse.
   ==================================================================== */
.pp-why-badge{align-items:center;}
.pp-why-badge.b3{
  left:50%;bottom:-6px;transform:translateX(-50%);
  align-items:center;gap:10px;
  background:#fff;padding:4px 12px 4px 4px;border-radius:999px;
}
.pp-why-badge.b3 b{
  max-width:none !important;white-space:nowrap;
  line-height:1.2;text-align:left;
}
.pp-why-badge.b1,
.pp-why-badge.b2{align-items:center;}
.pp-why-badge.b1 b,
.pp-why-badge.b2 b{line-height:1.25;}
.pp-why-badge .ic{flex-shrink:0;}

@media (max-width:767px){
  .pp-why-badge.b3{background:none;padding:0;}
  .pp-why-badge.b3 b{white-space:normal;}
}

/* ====================================================================
   TESTIMONIALS - soft blue glow behind the card, per the design
   ==================================================================== */
.pp-testi-section{position:relative;}
.pp-testi-section::before{
  content:"";position:absolute;left:0;right:0;top:0;height:120px;
  background:linear-gradient(180deg,#fff 0%,rgba(255,255,255,0) 100%);
  pointer-events:none;z-index:0;
}
.pp-testi-section > .e-con-inner{position:relative;z-index:1;}
.pp-testi-section .pp-testi-card{
  background:#fff;box-shadow:0 24px 54px rgba(11,111,160,.14);
}

/* ====================================================================
   NATIVE ELEMENTOR WIDGETS - styled to the design
   (replaces the former HTML blocks so everything is editable)
   ==================================================================== */

/* --- "Also included" chips: Heading + inline Icon List ---------------- */
.pp-chips-row{width:100%;}
.pp-chips-label .elementor-heading-title{
  font-family:'Quicksand',sans-serif;font-weight:700;font-size:12px;
  letter-spacing:.1em;text-transform:uppercase;color:#0b6fa0 !important;margin:0 4px 0 0;
}
.pp-chips-list .elementor-icon-list-items{
  display:flex;flex-wrap:wrap;justify-content:center;gap:9px;margin:0;padding:0;
}
.pp-chips-list .elementor-icon-list-item{
  background:#eaf6fd;border:1px solid #cfe6f4;border-radius:999px;
  padding:7px 15px;margin:0 !important;transition:background .18s ease,transform .18s ease;
}
.pp-chips-list .elementor-icon-list-item:hover{background:#dceffa;transform:translateY(-2px);}
.pp-chips-list .elementor-icon-list-item:not(:last-child):after{display:none;border:0;}
.pp-chips-list .elementor-icon-list-text,
.pp-chips-list .elementor-icon-list-item a{
  font-size:12.5px;color:#0b6fa0 !important;padding:0;font-family:'Poppins',sans-serif;
}
.pp-chips-list .elementor-icon-list-icon{display:none;}

/* --- Why Clients Trust Us: Image + three Icon Boxes ------------------- */
.pp-why-graphic{
  position:relative;max-width:720px;margin:40px auto 0;aspect-ratio:16/11;width:100%;
}
/* the ellipse is pure decoration, drawn in CSS - no markup needed */
.pp-why-graphic::before{
  content:"";position:absolute;left:8.3%;top:10%;width:83.4%;height:80.8%;
  border:2.5px solid #0B6FA0;border-radius:50%;pointer-events:none;
}
.pp-why-van{
  position:absolute;left:50%;top:52%;transform:translate(-50%,-50%);
  width:min(400px,66%);z-index:1;
}
.pp-why-van img{
  width:100%;aspect-ratio:16/10;object-fit:cover;border-radius:16px;
  box-shadow:0 20px 44px rgba(11,111,160,.24);display:block;
}
.pp-why-badge{position:absolute;z-index:2;width:auto !important;}
.pp-why-badge .elementor-icon-box-wrapper{
  display:flex;align-items:center;gap:10px;text-align:left;
}
.pp-why-badge .elementor-icon-box-icon{margin:0 !important;flex-shrink:0;}
.pp-why-badge .elementor-icon{
  background:#e8f6fd;width:42px;height:42px;border-radius:50%;
  display:flex;align-items:center;justify-content:center;border:none;
}
.pp-why-badge .elementor-icon i,
.pp-why-badge .elementor-icon svg{color:#0B6FA0;fill:#0B6FA0;font-size:20px;}
.pp-why-badge .elementor-icon-box-content{margin:0;}
.pp-why-badge .elementor-icon-box-title,
.pp-why-badge .elementor-icon-box-title a{
  font-family:'Quicksand',sans-serif;font-weight:700;font-size:15px;
  color:#14202b !important;margin:0;line-height:1.25;
}
.pp-why-badge .elementor-icon-box-description{display:none;}

.pp-why-badge.b1{left:0;top:12%;}
.pp-why-badge.b1 .elementor-icon-box-title{max-width:120px;text-align:right;}
.pp-why-badge.b2{right:0;top:12%;}
.pp-why-badge.b2 .elementor-icon-box-title{max-width:120px;}
.pp-why-badge.b3{
  left:50%;bottom:-8px;transform:translateX(-50%);
  background:#fff;border-radius:999px;padding:4px 14px 4px 4px;
}
.pp-why-badge.b3 .elementor-icon-box-title{white-space:nowrap;max-width:none;}

/* --- See the Difference: Image Carousel + Basic Gallery --------------- */
.pp-diff-carousel{width:100%;max-width:900px;margin:0 auto;}
.pp-diff-carousel .elementor-image-carousel-wrapper{border-radius:18px;overflow:hidden;box-shadow:0 22px 50px rgba(11,111,160,.22);}
.pp-diff-carousel .swiper-slide img{width:100%;aspect-ratio:2/1;object-fit:cover;display:block;}
.pp-diff-carousel .swiper-pagination-bullet{background:#fff;opacity:.55;width:8px;height:8px;}
.pp-diff-carousel .swiper-pagination-bullet-active{background:#0B6FA0;opacity:1;width:22px;border-radius:999px;}

.pp-diff-gallery{width:100%;max-width:900px;margin:14px auto 0;}
.pp-diff-gallery .gallery{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin:0;}
.pp-diff-gallery .gallery-item{width:100% !important;margin:0 !important;float:none !important;}
.pp-diff-gallery .gallery-icon,
.pp-diff-gallery .gallery-icon a{display:block;}
.pp-diff-gallery img{
  width:100% !important;aspect-ratio:16/10;object-fit:cover;display:block;
  border-radius:10px !important;border:2px solid transparent !important;transition:border-color .2s ease;
}
.pp-diff-gallery img:hover{border-color:#0B6FA0 !important;}

/* --- Testimonials: native Testimonial widget ------------------------- */
.pp-testi-track > .pp-testi-card{
  flex:0 0 100%;scroll-snap-align:center;
  background:#fff;border:1px solid #e6eef3;border-radius:22px;
  box-shadow:0 24px 54px rgba(11,111,160,.14);
  padding:40px 34px;min-height:318px;
  display:flex;flex-direction:column;justify-content:center;
}
.pp-testi-card .elementor-testimonial-wrapper{text-align:center;}
.pp-testi-card .elementor-testimonial-content{
  font-family:'Poppins',sans-serif;font-size:16.5px;line-height:1.7;
  color:#2c3e4a;font-style:normal;margin-bottom:24px;position:relative;padding-top:56px;
}
/* the design's quote mark, drawn from the icon font - no markup needed */
.pp-testi-card .elementor-testimonial-content::before{
  content:"\201C";position:absolute;top:-6px;left:50%;transform:translateX(-50%);
  font-family:Georgia,'Times New Roman',serif;font-size:86px;line-height:1;
  color:#0B6FA0;opacity:.9;
}
.pp-testi-card .elementor-testimonial-meta-inner{display:flex;align-items:center;justify-content:center;gap:12px;}
.pp-testi-card .elementor-testimonial-name{
  font-family:'Quicksand',sans-serif;font-weight:700;font-size:16px;color:#14202b;
}
.pp-testi-card .elementor-testimonial-job{font-size:12.5px;color:#8494a0;}
.pp-testi-card .elementor-testimonial-meta{margin:0;}

/* --- Areas We Serve: Icon Box heading + Icon List -------------------- */
.pp-area-head .elementor-icon-box-wrapper{display:flex;align-items:center;gap:9px;text-align:left;margin-bottom:12px;}
.pp-area-head .elementor-icon-box-icon{margin:0 !important;flex-shrink:0;}
.pp-area-head .elementor-icon i,
.pp-area-head .elementor-icon svg{color:#0B6FA0;fill:#0B6FA0;font-size:18px;}
.pp-area-head .elementor-icon-box-title,
.pp-area-head .elementor-icon-box-title a{
  font-family:'Quicksand',sans-serif;font-weight:700;font-size:16px;
  color:#14202b !important;margin:0;
}
.pp-area-head .elementor-icon-box-description{display:none;}

.pp-area-list .elementor-icon-list-items{
  column-count:2;column-gap:18px;margin:0;padding-left:18px;list-style:disc;display:block;
}
.pp-area-list .elementor-icon-list-item{
  display:list-item !important;break-inside:avoid;margin:0 !important;
  font-size:12.5px;color:#5a6b77;line-height:1.75;
}
.pp-area-list .elementor-icon-list-item::marker{color:#5a6b77;}
.pp-area-list .elementor-icon-list-icon{display:none;}
.pp-area-list .elementor-icon-list-text{
  padding:0;font-size:12.5px;color:#5a6b77;line-height:1.75;
}
.pp-area-list .elementor-icon-list-item:not(:last-child):after{display:none;border:0;}

@media (max-width:767px){
  .pp-area-list .elementor-icon-list-items{column-count:1;}
  .pp-diff-gallery .gallery{grid-template-columns:repeat(2,1fr);}
  .pp-why-badge{position:static !important;transform:none !important;margin-top:12px;}
  .pp-why-badge .elementor-icon-box-wrapper{justify-content:center;}
  .pp-why-badge .elementor-icon-box-title{max-width:none !important;text-align:left !important;}
  .pp-why-graphic{aspect-ratio:auto;}
  .pp-why-graphic::before{display:none;}
  .pp-why-van{position:static;transform:none;width:100%;margin-bottom:16px;}
}

/* ====================================================================
   SHAPE / HEIGHT CORRECTIONS - measured against the design file
   ==================================================================== */

/* --- See the Difference -----------------------------------------------
   The carousel was rendering at the full 1280 container width, so each
   slide came out 1280x640 and the section ballooned to 1180px tall.
   The design is a 900px block at 2:1 (900x450). */
.pp-diff-carousel{
  width:900px !important;max-width:100% !important;margin:0 auto !important;
}
.pp-diff-carousel .elementor-image-carousel-wrapper{
  border-radius:18px;overflow:hidden;box-shadow:0 22px 50px rgba(11,111,160,.22);
}
.pp-diff-carousel .swiper-slide{aspect-ratio:2/1;}
.pp-diff-carousel .swiper-slide img,
.pp-diff-carousel .swiper-slide figure img{
  width:100% !important;height:100% !important;aspect-ratio:2/1;
  object-fit:cover;display:block;border-radius:0;
}
.pp-diff-carousel .swiper-pagination{bottom:14px;}
.pp-diff-carousel .swiper-pagination-bullet{background:#fff;opacity:.55;width:8px;height:8px;margin:0 4px;}
.pp-diff-carousel .swiper-pagination-bullet-active{background:#0B6FA0;opacity:1;width:22px;border-radius:999px;}

/* Thumbnail strip: WordPress's own gallery grid was collapsing the
   figures to 78px. Force the design's 4-up 16:10 strip. */
.pp-diff-gallery{width:900px !important;max-width:100% !important;margin:14px auto 0 !important;}
.pp-diff-gallery .elementor-image-gallery{width:100%;}
.pp-diff-gallery .gallery{
  display:grid !important;grid-template-columns:repeat(4,1fr) !important;
  gap:12px !important;margin:0 !important;width:100%;
}
.pp-diff-gallery .gallery-item{
  width:100% !important;max-width:none !important;margin:0 !important;
  float:none !important;display:block !important;padding:0 !important;
}
.pp-diff-gallery .gallery-icon{width:100%;margin:0 !important;padding:0 !important;}
.pp-diff-gallery .gallery-icon a{display:block;width:100%;}
.pp-diff-gallery .gallery-item img{
  width:100% !important;height:auto !important;aspect-ratio:16/10;object-fit:cover;
  display:block;border-radius:10px !important;
  border:2px solid transparent !important;transition:border-color .2s ease;
}
.pp-diff-gallery .gallery-item img:hover{border-color:#0B6FA0 !important;}
.pp-diff-gallery .gallery-caption{display:none !important;}

/* --- Why Clients Trust Us: badge offsets exactly as the design -------- */
.pp-why-badge.b1{left:2%;top:14%;}
.pp-why-badge.b2{right:2%;top:14%;left:auto;}
.pp-why-badge.b3{
  left:50%;bottom:2%;transform:translateX(-50%);
  background:none;padding:0;border-radius:0;
}
.pp-why-badge.b3 .elementor-icon-box-wrapper{
  align-items:center;
}
.pp-why-badge.b3 .elementor-icon-box-title{white-space:nowrap;max-width:none;}

/* --- Testimonials: the scroll track was clipping the card's shadow ----
   overflow-x:auto also clips on the Y axis, which cut the drop shadow
   off flat. Give the track room and let the shadow breathe. */
.pp-testi-track{
  max-width:720px;padding:34px 50px;margin:0 auto;
  overflow-x:auto;overflow-y:visible;
}
.pp-testi-track > .pp-testi-card{
  flex:0 0 100%;scroll-snap-align:center;
  box-shadow:0 24px 54px rgba(11,111,160,.14) !important;
}
.pp-testi-nav{margin-top:8px;}

@media (max-width:767px){
  .pp-testi-track{padding:20px 22px;max-width:100%;}
  .pp-diff-gallery .gallery{grid-template-columns:repeat(2,1fr) !important;}
  .pp-diff-carousel .swiper-slide,
  .pp-diff-carousel .swiper-slide img{aspect-ratio:4/3;}
}

/* ====================================================================
   SEE THE DIFFERENCE - final shape, sharp images
   ==================================================================== */
.pp-diff-carousel .swiper-slide img,
.pp-diff-carousel .swiper-slide figure img{
  image-rendering:auto;
}
.pp-diff-carousel .elementor-image-carousel-wrapper{border-radius:18px;}
.pp-diff-carousel .swiper-pagination{bottom:16px !important;}

/* thumbnails: 4-up strip, active-looking hover ring like the design */
.pp-diff-gallery .gallery-item img{
  border:2px solid transparent !important;border-radius:10px !important;
  box-shadow:0 6px 18px rgba(11,111,160,.10);
}
.pp-diff-gallery .gallery-item:hover img,
.pp-diff-gallery .gallery-item:focus-within img{
  border-color:#0B6FA0 !important;
}

/* ====================================================================
   FLUENT FORMS - quote form, matched to the design
   Fluent Forms now supplies the two-column rows natively, so the CSS
   grid override is no longer needed and would fight it.
   ==================================================================== */
.pp-est-form .fluentform form{display:block;}
.pp-est-form .fluentform .ff-t-cell{padding-left:6px;padding-right:6px;}
.pp-est-form .fluentform .ff-t-container{
  display:flex;flex-wrap:wrap;margin-left:-6px;margin-right:-6px;
}
.pp-est-form .fluentform .ff-el-group{margin-bottom:12px;}
.pp-est-form .fluentform .ff-el-input--label label{
  font-family:'Poppins',sans-serif;font-size:12.5px;font-weight:600;
  color:#14202b;margin-bottom:5px;
}
.pp-est-form .fluentform .ff-el-input--label.ff-el-is-required label:after{color:#e5484d;}
.pp-est-form .fluentform input[type=text],
.pp-est-form .fluentform input[type=email],
.pp-est-form .fluentform input[type=tel],
.pp-est-form .fluentform select,
.pp-est-form .fluentform textarea{
  width:100%;border:1px solid #e0e8ee;border-radius:10px;padding:12px 14px;
  font-family:'Poppins',sans-serif;font-size:14px;color:#14202b;
  background:#fff;outline:none;box-shadow:none;height:auto;
}
.pp-est-form .fluentform textarea{min-height:86px;resize:vertical;}
.pp-est-form .fluentform input:focus,
.pp-est-form .fluentform select:focus,
.pp-est-form .fluentform textarea:focus{
  border-color:#0B6FA0;box-shadow:0 0 0 4px rgba(18,163,224,.12);
}
.pp-est-form .fluentform ::placeholder{color:#a6b3bd;}
.pp-est-form .fluentform .ff-btn-submit{
  width:100%;background:#0B6FA0 !important;border-color:#0B6FA0 !important;color:#fff !important;
  font-family:'Poppins',sans-serif;font-weight:600;font-size:15px;
  padding:14px;border-radius:12px !important;cursor:pointer;
  box-shadow:0 12px 28px rgba(18,163,224,.3);
  transition:background .15s ease,transform .15s ease;
}
.pp-est-form .fluentform .ff-btn-submit:hover{background:#0f8fc7 !important;transform:translateY(-2px);}
.pp-est-form .ff-message-success{
  background:#e6f7ec;border:1px solid #b9e5c9;border-radius:12px;
  padding:20px;color:#14202b;font-family:'Poppins',sans-serif;
}

/* ====================================================================
   FLUENT FORMS - footer subscription pill
   ==================================================================== */
.pp-foot-sub .fluentform .ff-el-group{margin-bottom:0;}
.pp-foot-sub .fluentform .ff-el-input--label{display:none;}
.pp-foot-sub .fluentform .ff-t-container{
  display:flex;flex-wrap:nowrap;align-items:center;gap:8px;
  background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.14);
  border-radius:999px;padding:6px 6px 6px 18px;max-width:360px;margin:0;
}
.pp-foot-sub .fluentform .ff-t-cell{padding:0;flex:1 1 auto;}
.pp-foot-sub .fluentform .ff-t-cell:last-child{flex:0 0 auto;}
.pp-foot-sub .fluentform input[type=email]{
  background:transparent !important;border:none !important;color:#fff !important;
  outline:none;box-shadow:none !important;font-family:'Poppins',sans-serif;
  font-size:13.5px;padding:6px 0;width:100%;
}
.pp-foot-sub .fluentform input[type=email]::placeholder{color:#9fb6c6;}
.pp-foot-sub .fluentform .ff-btn-submit{
  background:#0B6FA0 !important;border-color:#0B6FA0 !important;color:#fff !important;
  font-weight:600;font-size:13.5px;padding:10px 22px;border-radius:999px !important;
  white-space:nowrap;box-shadow:none;width:auto;min-width:0 !important;
}
.pp-foot-sub .fluentform .ff-btn-submit:hover{background:#0f8fc7 !important;}
.pp-foot-sub .ff-message-success{color:#7fd0f5;background:none;border:none;padding:8px 0;}

@media (max-width:767px){
  .pp-est-form .fluentform .ff-t-container{display:block;margin:0;}
  .pp-est-form .fluentform .ff-t-cell{padding:0;}
}

/* ====================================================================
   WHY CLIENTS TRUST US - oval inner image, badge clear of the ring
   ==================================================================== */

/* the photo now echoes the ellipse instead of being a rounded rectangle */
.pp-why-van img{
  border-radius:50% !important;
  box-shadow:0 20px 44px rgba(11,111,160,.24);
}
.pp-why-van{
  width:min(430px,70%);
  top:48%;
}

/* give the graphic room underneath so "Flexible Scheduling" sits clear
   of the ellipse stroke and stays fully readable */
.pp-why-graphic{margin-bottom:64px;}
.pp-why-badge.b3{
  left:50%;bottom:-64px;transform:translateX(-50%);
  background:none;padding:0;
}
.pp-why-badge.b3 .elementor-icon-box-wrapper{align-items:center;justify-content:center;}
.pp-why-badge.b3 .elementor-icon-box-title{white-space:nowrap;max-width:none;}

@media (max-width:767px){
  .pp-why-graphic{margin-bottom:0;}
  .pp-why-van img{border-radius:20px !important;}
}

/* ====================================================================
   TESTIMONIALS - arrows and dots sit INSIDE the card, as the design has
   them (the design nests the nav row within the card, margin-top 24px)
   ==================================================================== */
.pp-testi-track > .pp-testi-card{
  padding:40px 34px 84px !important;
  min-height:300px;
}
.pp-testi-nav{
  position:relative;z-index:3;
  margin-top:-62px;margin-bottom:0;
}
.pp-testi-card .elementor-testimonial-content{margin-bottom:20px;}
.pp-testi-card .elementor-testimonial-meta{margin:0;}

/* ====================================================================
   ESTIMATE - heading wraps like the design, form card sized to match
   ==================================================================== */
.pp-est .elementor-widget-heading .elementor-heading-title{max-width:360px;}
.pp-est-form{max-width:470px;margin-left:auto;width:100%;}
.pp-est-form h3.elementor-heading-title{max-width:none;font-size:20px;}

@media (max-width:1024px){
  .pp-est .elementor-widget-heading .elementor-heading-title{max-width:none;}
  .pp-est-form{margin-left:0;max-width:none;}
}

/* ====================================================================
   WHY CLIENTS TRUST US - oval inscribed 10px inside the ring
   Ring box inside the 720x495 graphic is 600x400 at (60, 49.5).
   Inset 10px on every side gives a 580x380 ellipse, centred.
   ==================================================================== */
.pp-why-van{
  position:absolute;left:50%;top:50.4%;transform:translate(-50%,-50%);
  width:80.5% !important;   /* 580 / 720 */
  max-width:none;z-index:1;
}
.pp-why-van img{
  width:100% !important;aspect-ratio:58/38;   /* 580 x 380 */
  height:auto;object-fit:cover;
  border-radius:50% !important;
  box-shadow:0 20px 44px rgba(11,111,160,.22);
}

/* Badge sits so its icon touches the bottom of the blue ellipse,
   with the label clear underneath and fully readable. */
.pp-why-graphic{margin-bottom:26px;}
.pp-why-badge.b3{
  left:50%;bottom:0;transform:translateX(-50%);
  background:none;padding:0;z-index:3;
}
.pp-why-badge.b3 .elementor-icon-box-wrapper{align-items:center;justify-content:center;gap:10px;}
.pp-why-badge.b3 .elementor-icon-box-title{white-space:nowrap;max-width:none;}

/* ====================================================================
   TESTIMONIALS - one card at a time, arrows drive prev/next
   ==================================================================== */
.pp-testi-track{
  display:flex;flex-wrap:nowrap;
  max-width:720px;margin:0 auto;padding:34px 50px;
  overflow-x:auto;scroll-snap-type:x mandatory;scroll-behavior:smooth;
  scrollbar-width:none;-ms-overflow-style:none;
}
.pp-testi-track::-webkit-scrollbar{display:none;}
.pp-testi-track > .pp-testi-card{
  flex:0 0 100%;min-width:100%;scroll-snap-align:start;
}

/* dots reflect the card actually in view */
.pp-testi-nav .dots a{
  width:8px;height:8px;border-radius:999px;background:#cfe0ea;display:block;
  transition:background .2s ease,width .2s ease;
}
.pp-testi-nav .dots a.is-active{background:#0B6FA0;width:22px;}
.pp-testi-nav .arw{cursor:pointer;}
.pp-testi-nav .arw.prev:hover{border-color:#0B6FA0;}
.pp-testi-nav .arw.next:hover{background:#0f8fc7;}

/* ====================================================================
   QUOTE FORM - lock the two-column rows
   Fluent Forms sizes .ff-t-cell with flex-basis, and at this card width
   the second cell was falling back to 100% and wrapping onto its own
   line. CSS Grid removes the ambiguity: two equal columns, always.
   ==================================================================== */
.pp-est-form{max-width:520px;margin-left:auto;width:100%;}

.pp-est-form .fluentform .ff-t-container{
  display:grid !important;
  grid-template-columns:1fr 1fr !important;
  column-gap:12px !important;row-gap:0 !important;
  margin:0 !important;width:100%;
}
.pp-est-form .fluentform .ff-t-cell{
  flex:none !important;width:auto !important;max-width:none !important;
  min-width:0 !important;padding:0 !important;margin:0 !important;
}
.pp-est-form .fluentform .ff-t-cell .ff-el-group{margin-bottom:12px;}

/* Message and Submit stay full width beneath the two rows */
.pp-est-form .fluentform > form > .ff-el-group,
.pp-est-form .fluentform fieldset > .ff-el-group,
.pp-est-form .fluentform .ff_submit_btn_wrapper{width:100%;}
.pp-est-form .fluentform textarea{width:100%;min-height:92px;}
.pp-est-form .fluentform .ff-btn-submit{width:100%;}

@media (max-width:767px){
  .pp-est-form{max-width:none;margin-left:0;}
  .pp-est-form .fluentform .ff-t-container{
    grid-template-columns:1fr !important;column-gap:0 !important;
  }
}

/* ====================================================================
   1. "Flexible Scheduling" icon ON the ellipse, like the other two
   Ellipse bottom sits at 90.8% of the 495px graphic (y=449.5).
   Centring the 42px icon on that line means bottom: 24px.
   ==================================================================== */
.pp-why-badge.b3{
  left:50%;bottom:24px;transform:translateX(-50%);
  background:none;padding:0;z-index:3;
}
.pp-why-badge.b3 .elementor-icon-box-wrapper{
  display:flex;align-items:center;justify-content:center;gap:10px;text-align:left;
}
.pp-why-badge.b3 .elementor-icon-box-title{
  white-space:nowrap;max-width:none;margin:0;line-height:1.25;
}
/* room beneath so the label never collides with the button below */
.pp-why-graphic{margin-bottom:34px;}

/* ====================================================================
   2. Carousel dots ON the image - drop the white band under it
   Elementor adds .elementor-pagination-position-outside, which pads the
   wrapper 30px at the bottom to park the dots. Overlay them instead.
   ==================================================================== */
.pp-diff-carousel .elementor-image-carousel-wrapper,
.pp-diff-carousel.elementor-pagination-position-outside .elementor-image-carousel-wrapper{
  padding-bottom:0 !important;
  border-radius:18px;overflow:hidden;
}
.pp-diff-carousel .swiper-pagination{
  position:absolute !important;bottom:14px !important;top:auto !important;
  left:0;right:0;height:auto;z-index:5;
}
.pp-diff-carousel .swiper-pagination-bullet{
  background:#ffffff;opacity:.6;width:8px;height:8px;margin:0 4px !important;
}
.pp-diff-carousel .swiper-pagination-bullet-active{
  background:#0B6FA0;opacity:1;width:22px;border-radius:999px;
}

/* ====================================================================
   3. Testimonials - nav row genuinely inside the card, per the design
   Track pads 34px at the bottom and the card reserves 84px, so the nav
   needs to come back up through both to sit within the card.
   ==================================================================== */
.pp-testi-track{padding:34px 50px;}
.pp-testi-track > .pp-testi-card{padding:40px 34px 84px !important;}
.pp-testi-nav{
  position:relative;z-index:3;
  margin-top:-94px;margin-bottom:0;
}
.pp-testi-section .elementor-widget-button{margin-top:14px;}

@media (max-width:767px){
  .pp-testi-track{padding:20px 16px;}
  .pp-testi-track > .pp-testi-card{padding:32px 22px 76px !important;}
  .pp-testi-nav{margin-top:-80px;}
  .pp-why-badge.b3{position:static;transform:none;margin-top:12px;}
  .pp-why-graphic{margin-bottom:0;}
}

/* ====================================================================
   TESTIMONIALS - rebuilt as a fade carousel
   The scroll track could never show exactly one card: the viewport was
   720px but each card 620px, so 100px of the next card always peeked.
   Stacking all three in one grid cell removes the overflow entirely -
   nothing peeks, nothing clips the shadow, and the height is the
   tallest card so it never jumps between quotes.
   ==================================================================== */
.pp-testi-track{
  display:grid !important;
  max-width:620px;width:100%;margin:0 auto !important;
  padding:0 !important;
  overflow:visible !important;
  scroll-snap-type:none;
}
.pp-testi-track > .pp-testi-card{
  grid-area:1 / 1;
  flex:none !important;min-width:0 !important;width:100% !important;
  opacity:0;visibility:hidden;pointer-events:none;
  transition:opacity .35s ease;
  padding:40px 34px 84px !important;
  background:#fff;border:1px solid #e6eef3;border-radius:22px;
  box-shadow:0 24px 54px rgba(11,111,160,.14);
}
.pp-testi-track > .pp-testi-card.is-active{
  opacity:1;visibility:visible;pointer-events:auto;
}
/* first card visible before the script runs */
.pp-testi-track > .pp-testi-card:first-child{opacity:1;visibility:visible;pointer-events:auto;}
.pp-testi-track > .pp-testi-card:first-child:not(.is-active){opacity:0;visibility:hidden;}
.pp-testi-track:not(:has(.is-active)) > .pp-testi-card:first-child{opacity:1;visibility:visible;}

/* nav sits inside the card's lower padding */
.pp-testi-nav{position:relative;z-index:3;margin-top:-70px;}

/* --- Avatar: the Testimonial widget was falling back to Elementor's
   placeholder.png. The design uses navy initials, so draw those. ---- */
.pp-testi-card .elementor-testimonial-image{display:none !important;}
.pp-testi-card .elementor-testimonial-meta-inner{
  display:flex;align-items:center;justify-content:center;gap:12px;
}
.pp-testi-card .elementor-testimonial-meta-inner::before{
  content:"";
  width:50px;height:50px;border-radius:50%;background:#0b6fa0;color:#fff;
  display:flex;align-items:center;justify-content:center;flex-shrink:0;
  font-family:'Quicksand',sans-serif;font-weight:700;font-size:15px;letter-spacing:.02em;
}
#tq1 .elementor-testimonial-meta-inner::before{content:"SL";}
#tq2 .elementor-testimonial-meta-inner::before{content:"MT";}
#tq3 .elementor-testimonial-meta-inner::before{content:"JR";}
.pp-testi-card .elementor-testimonial-details{text-align:left;}

/* ====================================================================
   "Flexible Scheduling" - icon on the line, label below it on white
   Stacked layout: the 42px icon centres on the ellipse edge and the
   label drops clear of both the ring and the photo.
   ==================================================================== */
.pp-why-badge.b3{
  left:50%;bottom:0;transform:translateX(-50%);
  background:none;padding:0;z-index:3;
}
.pp-why-badge.b3 .elementor-icon-box-wrapper{
  display:flex;flex-direction:column;align-items:center;justify-content:flex-start;
  gap:6px;text-align:center;
}
.pp-why-badge.b3 .elementor-icon-box-icon{margin:0 !important;}
.pp-why-badge.b3 .elementor-icon-box-title{
  white-space:nowrap;max-width:none;margin:0;line-height:1.25;text-align:center;
}
.pp-why-graphic{margin-bottom:40px;}

@media (max-width:767px){
  .pp-testi-track{max-width:100%;}
  .pp-testi-track > .pp-testi-card{padding:32px 22px 76px !important;}
  .pp-testi-nav{margin-top:-64px;}
  .pp-why-badge.b3{position:static;transform:none;margin-top:12px;}
  .pp-why-graphic{margin-bottom:0;}
}

/* ====================================================================
   FOOTER SUBSCRIBE - input and button on one baseline
   The two cells were 32px and 60px tall with a 10px vertical offset,
   so the pill looked lopsided. Lock both to a 40px control height.
   ==================================================================== */
.pp-foot-sub .fluentform .ff-t-container{
  display:flex !important;flex-wrap:nowrap !important;align-items:center !important;
  gap:8px;margin:0 !important;padding:6px 6px 6px 18px;
  background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.14);
  border-radius:999px;max-width:360px;
}
.pp-foot-sub .fluentform .ff-t-cell{
  display:flex !important;align-items:center !important;
  margin:0 !important;padding:0 !important;min-width:0;
}
.pp-foot-sub .fluentform .ff-t-cell.ff-t-column-1{flex:1 1 auto;}
.pp-foot-sub .fluentform .ff-t-cell.ff-t-column-2{flex:0 0 auto;}
.pp-foot-sub .fluentform .ff-el-group,
.pp-foot-sub .fluentform .ff-el-input--content{margin:0 !important;width:100%;}
.pp-foot-sub .fluentform input[type=email]{
  height:40px !important;line-height:40px;padding:0 !important;
  background:transparent !important;border:none !important;box-shadow:none !important;
  color:#fff !important;font-size:13.5px;width:100%;
}
.pp-foot-sub .fluentform .ff-btn-submit{
  height:40px !important;line-height:1;padding:0 22px !important;
  border-radius:999px !important;white-space:nowrap;width:auto !important;
  min-width:0 !important;margin:0 !important;box-shadow:none;
  display:inline-flex;align-items:center;justify-content:center;
}

/* ====================================================================
   TESTIMONIAL NAV - arrows and dots are <button> now, so style those
   ==================================================================== */
.pp-testi-nav{display:flex;align-items:center;justify-content:center;gap:14px;}
.pp-testi-nav .arw{
  width:42px;height:42px;border-radius:50%;padding:0;cursor:pointer;
  display:flex;align-items:center;justify-content:center;
  transition:transform .15s ease,background .15s ease,border-color .15s ease;
}
.pp-testi-nav .arw.prev{background:#fff;border:1px solid #d6e2ea;color:#0b6fa0;}
.pp-testi-nav .arw.prev:hover{border-color:#0B6FA0;transform:translateY(-2px);}
.pp-testi-nav .arw.next{background:#0B6FA0;border:none;color:#fff;}
.pp-testi-nav .arw.next:hover{background:#0f8fc7;transform:translateY(-2px);}
.pp-testi-nav .dots{display:flex;align-items:center;gap:7px;}
.pp-testi-nav .dots button{
  width:8px;height:8px;padding:0;border:none;border-radius:999px;
  background:#cfe0ea;cursor:pointer;display:block;
  transition:background .2s ease,width .2s ease;
}
.pp-testi-nav .dots button:hover{background:#9ec9e2;}
.pp-testi-nav .dots button.is-active{background:#0B6FA0;width:22px;}

/* smooth cross-fade between quotes */
.pp-testi-track > .pp-testi-card{
  transition:opacity .35s ease, visibility .35s ease;
}