:root{
  --pv2-blue:#0b4f96;
  --pv2-blue-2:#1264b5;
  --pv2-blue-soft:#eaf2fb;
  --pv2-navy:#071b31;
  --pv2-navy-2:#0b2949;
  --pv2-ink:#14243a;
  --pv2-muted:#67758a;
  --pv2-line:#dce4ed;
  --pv2-surface:#f5f7fa;
  --pv2-white:#fff;
  --pv2-accent:#f1b72e;
  --pv2-accent-dark:#d99b08;

  --pv2-radius-sm:10px;
  --pv2-radius:14px;
  --pv2-radius-lg:20px;

  --pv2-shadow:
    0 18px 60px rgba(7,27,49,.10);

  --pv2-shadow-soft:
    0 10px 34px rgba(7,27,49,.07);

  --pv2-container:1280px;
}

html{
  scroll-behavior:smooth;
}

body{
  background:#fff;
  color:var(--pv2-ink);
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}

img{
  max-width:100%;
}

/* HEADER */

.zph{
  position:relative;
  z-index:9000;
  background:#fff;
  border-bottom:1px solid rgba(7,27,49,.08);
}

.zph-top{
  background:var(--pv2-navy);
  color:rgba(255,255,255,.82);
  min-height:34px;
  font-size:11px;
}

.zph-top a{
  color:rgba(255,255,255,.88);
  text-decoration:none;
}

.zph-top a:hover{
  color:#fff;
}

.zph-nav{
  background:rgba(255,255,255,.98);
  border-bottom:1px solid rgba(7,27,49,.08);
  backdrop-filter:blur(16px);
}

.zph-nav-inner,
.zph-top-inner{
  width:min(calc(100% - 40px),var(--pv2-container));
  margin-inline:auto;
}

.zph-nav-inner{
  min-height:82px;
  gap:22px;
}

.zph-brand img,
.zph-logo img{
  width:auto;
  max-width:150px;
  max-height:58px;
  object-fit:contain;
}

.zph-menu{
  gap:4px;
}

.zph-menu>a,
.zph-menu>div>a,
.zph-products-trigger{
  position:relative;
  border-radius:10px;
  padding:11px 10px !important;
  font-size:12px;
  font-weight:800;
  color:#26364c !important;
  transition:
    background .2s ease,
    color .2s ease;
}

.zph-menu>a:hover,
.zph-menu>div>a:hover,
.zph-menu>a.active{
  color:var(--pv2-blue) !important;
  background:var(--pv2-blue-soft);
}

.zph-menu>a.active:after{
  content:"";
  position:absolute;
  right:12px;
  left:12px;
  bottom:4px;
  height:2px;
  background:var(--pv2-blue);
  border-radius:999px;
}

.zph-icon,
.zph-phone,
.zph-quote,
.zph-burger{
  border-radius:11px !important;
  transition:
    transform .2s ease,
    box-shadow .2s ease,
    background .2s ease;
}

.zph-icon,
.zph-phone{
  border:1px solid var(--pv2-line) !important;
  background:#fff !important;
  color:var(--pv2-ink) !important;
}

.zph-icon:hover,
.zph-phone:hover{
  transform:translateY(-1px);
  border-color:#b9c9da !important;
  box-shadow:var(--pv2-shadow-soft);
}

.zph-quote{
  background:var(--pv2-blue) !important;
  color:#fff !important;
  border:1px solid var(--pv2-blue) !important;
  box-shadow:0 10px 24px rgba(11,79,150,.20);
  font-weight:900 !important;
}

.zph-quote:hover{
  background:#083f79 !important;
  transform:translateY(-2px);
  box-shadow:0 14px 30px rgba(11,79,150,.28);
}

.zph-fixed-now{
  box-shadow:0 14px 42px rgba(7,27,49,.10);
}

.zph-mega{
  border:1px solid rgba(7,27,49,.09) !important;
  border-radius:18px !important;
  box-shadow:0 26px 80px rgba(7,27,49,.16) !important;
  overflow:hidden;
  background:#fff !important;
}

.zph-mega img{
  object-fit:contain !important;
  background:#f6f8fb;
}

.zph-mega-copy h3{
  color:var(--pv2-navy);
}

.zph-mega-copy small,
.zph-mega-note b{
  color:var(--pv2-blue);
}

.zph-mega-tags span{
  background:#f2f5f8 !important;
  border:1px solid var(--pv2-line);
  color:#405069 !important;
  border-radius:999px !important;
}

.zph-search{
  background:rgba(7,27,49,.88) !important;
  backdrop-filter:blur(14px);
}

.zph-search-box{
  border-radius:20px !important;
  box-shadow:var(--pv2-shadow);
}

.zph-search-box input{
  border-radius:12px !important;
}

.zph-drawer{
  background:var(--pv2-navy) !important;
}

.zph-drawer>a{
  border-radius:10px;
}

.zph-drawer-quote{
  background:var(--pv2-blue) !important;
}

/* FOOTER */

.pf{
  margin-top:0;
  background:var(--pv2-navy);
  color:#fff;
}

.pf-cta{
  position:relative;
  overflow:hidden;
  background:
    linear-gradient(120deg,var(--pv2-blue),#073665);
  border-top:1px solid rgba(255,255,255,.08);
}

.pf-cta:before{
  content:"";
  position:absolute;
  width:420px;
  height:420px;
  left:-140px;
  top:-250px;
  border:1px solid rgba(255,255,255,.12);
  border-radius:50%;
}

.pf-cta-inner{
  width:min(calc(100% - 40px),var(--pv2-container));
  margin-inline:auto;
  min-height:220px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:48px;
}

.pf-cta h2{
  margin:0 0 12px;
  font-size:clamp(25px,3vw,42px);
  font-weight:950;
}

.pf-cta p{
  max-width:700px;
  margin:0;
  color:rgba(255,255,255,.78);
  line-height:2;
  font-size:14px;
}

.pf-cta-actions{
  display:flex;
  gap:10px;
  flex-shrink:0;
}

.pf-btn{
  min-height:48px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:9px;
  padding:0 18px;
  border-radius:11px !important;
  font-weight:900;
  text-decoration:none;
  transition:.2s ease;
}

.pf-btn-yellow{
  color:var(--pv2-navy) !important;
  background:var(--pv2-accent) !important;
}

.pf-btn-yellow:hover{
  transform:translateY(-2px);
  background:#ffc642 !important;
}

.pf-btn-outline{
  border:1px solid rgba(255,255,255,.36) !important;
  color:#fff !important;
  background:rgba(255,255,255,.05) !important;
}

.pf-main{
  width:min(calc(100% - 40px),var(--pv2-container));
  margin-inline:auto;
  padding:68px 0 22px;
}

.pf-grid{
  display:grid;
  grid-template-columns:1.5fr 1fr .8fr 1.25fr;
  gap:56px;
}

.pf-brand img{
  max-width:150px;
  max-height:60px;
  object-fit:contain;
  filter:brightness(0) invert(1);
}

.pf-brand>p{
  max-width:400px;
  margin:22px 0;
  color:rgba(255,255,255,.63);
  line-height:2;
  font-size:13px;
}

.pf-col h3{
  margin:0 0 22px;
  color:#fff;
  font-size:14px;
  font-weight:950;
}

.pf-col>a,
.pf-col>span{
  display:flex;
  align-items:flex-start;
  gap:9px;
  margin:0 0 13px;
  color:rgba(255,255,255,.62);
  text-decoration:none;
  font-size:12px;
  line-height:1.8;
  transition:.2s ease;
}

.pf-col>a:hover{
  color:#fff;
  transform:translateX(-3px);
}

.pf-col i{
  width:16px;
  color:#8fb4dc;
  margin-top:3px;
}

.pf-social{
  display:flex;
  gap:8px;
}

.pf-social a{
  width:38px;
  height:38px;
  display:grid;
  place-items:center;
  border:1px solid rgba(255,255,255,.13);
  border-radius:10px;
  color:#fff;
  text-decoration:none;
  background:rgba(255,255,255,.04);
}

.pf-social a:hover{
  background:var(--pv2-blue);
  border-color:var(--pv2-blue);
}

.pf-legal{
  margin-top:52px;
  padding:24px 0;
  border-top:1px solid rgba(255,255,255,.09);
  border-bottom:1px solid rgba(255,255,255,.09);
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:24px;
}

.pf-legal p{
  margin:0;
  color:rgba(255,255,255,.42);
  font-size:10px;
  line-height:2;
}

.pf-bottom{
  min-height:70px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:20px;
}

.pf-bottom p{
  margin:0;
  font-size:10px;
  color:rgba(255,255,255,.44);
}

.pf-bottom a{
  color:#9fc5ef;
  text-decoration:none;
}

@media(max-width:1100px){
  .zph-nav-inner,
  .zph-top-inner,
  .pf-cta-inner,
  .pf-main{
    width:min(calc(100% - 28px),var(--pv2-container));
  }

  .pf-grid{
    grid-template-columns:1.4fr 1fr 1fr;
  }

  .pf-contact{
    grid-column:1 / -1;
  }
}

@media(max-width:760px){
  .zph-top{
    display:none;
  }

  .zph-nav-inner{
    min-height:68px;
  }

  .zph-brand img,
  .zph-logo img{
    max-width:112px;
    max-height:48px;
  }

  .pf-cta-inner{
    min-height:auto;
    padding:50px 0;
    display:block;
  }

  .pf-cta-actions{
    margin-top:24px;
    display:grid;
    grid-template-columns:1fr 1fr;
  }

  .pf-grid{
    grid-template-columns:1fr 1fr;
    gap:38px 24px;
  }

  .pf-brand,
  .pf-contact{
    grid-column:1 / -1;
  }

  .pf-main{
    padding-top:48px;
  }

  .pf-legal{
    grid-template-columns:1fr;
  }

  .pf-bottom{
    padding:18px 0;
    display:block;
  }

  .pf-bottom p+p{
    margin-top:8px;
  }
}

/* =========================================================
   PODEM MOBILE INDUSTRIAL HEADER V3
   ========================================================= */

.pf-brand-label{
  margin-top:18px;
  color:#8eb7df;
  font-size:11px;
  font-weight:900;
  letter-spacing:.14em;
  direction:ltr;
  text-align:right;
}

.pf-supplier-card{
  max-width:390px;
  margin-top:22px;
  padding:11px 13px;
  display:flex;
  align-items:center;
  gap:14px;
  background:#fff;
  border:1px solid rgba(255,255,255,.88);
  border-radius:12px;
}

.pf-supplier-logo{
  min-width:92px;
  height:48px;
  padding:5px 9px;
  display:flex;
  align-items:center;
  justify-content:center;
  border-left:1px solid #e4e9ef;
}

.pf-supplier-logo img{
  display:block;
  max-width:100%;
  width:auto;
  max-height:37px;
  object-fit:contain;
  filter:none !important;
}

.pf-supplier-copy{
  min-width:0;
}

.pf-supplier-copy small{
  display:block;
  margin-bottom:4px;
  color:#718096;
  direction:ltr;
  text-align:right;
  font-size:9px;
  font-weight:900;
  letter-spacing:.08em;
}

.pf-supplier-copy b{
  display:block;
  color:#10243b;
  font-size:12px;
  line-height:1.75;
  font-weight:900;
}

@media(max-width:900px){

  .zph-menu{
    display:none !important;
  }

  .zph-phone{
    display:none !important;
  }

  .zph-quote{
    display:none !important;
  }

  .zph-burger{
    width:46px !important;
    height:46px !important;
    display:grid !important;
    place-items:center !important;
    padding:0 !important;
    border:1px solid #d6e0ea !important;
    border-radius:10px !important;
    background:#fff !important;
    color:#071b31 !important;
    box-shadow:none !important;
  }

  .zph-burger i{
    font-size:20px !important;
  }

  .zph-icon{
    width:46px !important;
    height:46px !important;
  }

  .zph-nav-inner{
    min-height:70px !important;
  }

  .zph-actions{
    gap:7px !important;
  }

  .zph-drawer{
    width:min(92vw,410px) !important;
    max-width:410px !important;
    padding:0 !important;
    overflow-y:auto !important;
    background:#071b31 !important;
    color:#fff !important;
    border-left:1px solid rgba(255,255,255,.08);
    box-shadow:-24px 0 70px rgba(0,0,0,.32);
  }

  .zph-drawer-shell{
    min-height:100dvh;
    display:flex;
    flex-direction:column;
  }

  .zph-drawer-head{
    min-height:88px;
    padding:16px 18px;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:15px;
    border-bottom:1px solid rgba(255,255,255,.10);
  }

  .zph-drawer-brand{
    min-width:0;
    display:flex;
    align-items:center;
    gap:12px;
  }

  .zph-drawer-brand>img{
    width:92px !important;
    height:46px !important;
    max-width:92px !important;
    margin:0 !important;
    padding:5px 9px;
    object-fit:contain !important;
    border-radius:8px;
    background:#fff;
  }

  .zph-drawer-brand>div{
    min-width:0;
  }

  .zph-drawer-brand b{
    display:block;
    color:#fff !important;
    font-size:15px !important;
    line-height:1.2;
    font-weight:950;
    letter-spacing:.06em;
    direction:ltr;
    text-align:right;
  }

  .zph-drawer-brand span{
    display:block;
    margin-top:5px;
    color:#a9bdd2 !important;
    font-size:11px !important;
    line-height:1.5;
    font-weight:700;
  }

  .zph-drawer-close{
    position:static !important;
    flex:0 0 44px;
    width:44px !important;
    height:44px !important;
    display:grid;
    place-items:center;
    padding:0 !important;
    border:1px solid rgba(255,255,255,.14) !important;
    border-radius:10px !important;
    background:#0d2947 !important;
    color:#fff !important;
    cursor:pointer;
  }

  .zph-drawer-close i{
    font-size:19px;
  }

  .zph-drawer-nav{
    padding:15px 14px 18px;
    display:flex;
    flex-direction:column;
    gap:5px;
  }

  .zph-drawer-nav>a,
  .zph-drawer-products>summary{
    min-height:64px;
    width:100%;
    padding:11px 13px !important;
    display:flex !important;
    align-items:center;
    gap:13px;
    border:1px solid transparent !important;
    border-radius:10px !important;
    background:transparent !important;
    color:#f7fbff !important;
    text-decoration:none !important;
    cursor:pointer;
    transition:
      background .18s ease,
      border-color .18s ease;
  }

  .zph-drawer-nav>a:hover,
  .zph-drawer-nav>a:focus-visible,
  .zph-drawer-products>summary:hover,
  .zph-drawer-products>summary:focus-visible{
    background:#0d2947 !important;
    border-color:rgba(118,173,224,.20) !important;
    outline:none;
  }

  .zph-drawer-nav>a>i,
  .zph-drawer-summary-main>i{
    flex:0 0 38px;
    width:38px;
    height:38px;
    display:grid;
    place-items:center;
    border-radius:8px;
    background:#102f50;
    color:#75afe3 !important;
    font-size:15px !important;
  }

  .zph-drawer-nav>a>span,
  .zph-drawer-summary-main>span{
    min-width:0;
    display:block;
  }

  .zph-drawer-nav b,
  .zph-drawer-products b{
    display:block;
    color:#fff !important;
    font-size:15px !important;
    line-height:1.55;
    font-weight:900 !important;
  }

  .zph-drawer-nav small,
  .zph-drawer-products small{
    display:block;
    margin-top:2px;
    color:#98aec5 !important;
    font-size:11px !important;
    line-height:1.55;
    font-weight:600;
  }

  .zph-drawer-products{
    margin:0;
    border:0;
  }

  .zph-drawer-products>summary{
    list-style:none;
    justify-content:space-between;
  }

  .zph-drawer-products>summary::-webkit-details-marker{
    display:none;
  }

  .zph-drawer-summary-main{
    min-width:0;
    display:flex;
    align-items:center;
    gap:13px;
  }

  .zph-drawer-products>summary>i{
    color:#7faed9 !important;
    font-size:11px !important;
    transition:transform .2s ease;
  }

  .zph-drawer-products[open]>summary{
    background:#0d2947 !important;
    border-color:rgba(118,173,224,.20) !important;
  }

  .zph-drawer-products[open]>summary>i{
    transform:rotate(180deg);
  }

  .zph-drawer-product-grid{
    margin:5px 15px 9px 0;
    padding:6px 13px 6px 0;
    display:flex;
    flex-direction:column;
    gap:2px;
    border-right:1px solid #21466a;
  }

  .zph-drawer-product-grid>a{
    min-height:47px;
    padding:9px 10px;
    display:flex;
    align-items:center;
    gap:11px;
    border-radius:8px;
    color:#dbe8f4 !important;
    text-decoration:none;
    font-size:13px !important;
    line-height:1.7;
    font-weight:800 !important;
  }

  .zph-drawer-product-grid>a:hover{
    background:#102f50;
    color:#fff !important;
  }

  .zph-drawer-product-grid>a>span{
    min-width:26px;
    color:#6fa7d8 !important;
    direction:ltr;
    font-size:9px;
    font-weight:950;
    letter-spacing:.06em;
  }

  .zph-drawer-all-products{
    margin-top:3px;
    color:#fff !important;
    background:#12395f !important;
  }

  .zph-drawer-all-products i{
    margin-right:auto;
    font-size:11px;
  }

  .zph-drawer-footer{
    margin-top:auto;
    padding:17px 18px 22px;
    border-top:1px solid rgba(255,255,255,.10);
    background:#06182a;
  }

  .zph-drawer-footer>span{
    display:block;
    margin-bottom:9px;
    color:#6f8ca9 !important;
    direction:ltr;
    text-align:right;
    font-size:9px !important;
    font-weight:900;
    letter-spacing:.12em;
  }

  .zph-drawer-footer .zph-drawer-quote{
    min-height:52px;
    width:100%;
    margin:0 !important;
    padding:0 16px !important;
    display:flex;
    align-items:center;
    justify-content:center;
    gap:10px;
    border:1px solid #1766ad !important;
    border-radius:10px !important;
    background:#0b4f96 !important;
    color:#fff !important;
    text-decoration:none !important;
    font-size:14px !important;
    font-weight:950 !important;
    box-shadow:none !important;
  }

  .zph-drawer-footer .zph-drawer-quote:hover{
    background:#0d5cab !important;
  }

  .zph-backdrop{
    background:rgba(2,12,23,.66) !important;
    backdrop-filter:blur(2px);
  }

}

@media(max-width:480px){

  .zph-nav-inner{
    width:calc(100% - 20px) !important;
  }

  .zph-drawer{
    width:94vw !important;
  }

  .zph-drawer-head{
    padding:14px;
  }

  .zph-drawer-nav{
    padding:12px 10px 16px;
  }

  .zph-drawer-nav>a,
  .zph-drawer-products>summary{
    min-height:62px;
    padding:10px !important;
  }

  .zph-drawer-nav b,
  .zph-drawer-products b{
    font-size:15px !important;
  }

  .pf-supplier-card{
    max-width:none;
  }

}

/* =========================================================
   PODEM YELLOW BLACK GLOBAL V4
   ========================================================= */

:root{
  --pv-yellow:#ffdd00;
  --pv-black:#090b0d;
  --pv-charcoal:#171a1d;
  --pv-grey:#f1f2f2;
  --pv-grey2:#e3e5e6;
  --pv-blue:#004e9a;
}

/* =========================================================
   HEADER
   ========================================================= */

.zph{
  --pv-yellow:#ffdd00;
  --pv-black:#090b0d;
  --pv-charcoal:#171a1d;
}

.zph-topbar,
.zph-top{
  background:#090b0d !important;
  color:#d3d7da !important;
  border-color:#2b3034 !important;
}

.zph-topbar a,
.zph-top a{
  color:#d3d7da !important;
}

.zph-topbar a:hover,
.zph-top a:hover{
  color:#ffdd00 !important;
}

.zph-nav,
.zph-main{
  background:#fff !important;
  border-bottom:1px solid #dfe1e2 !important;
}

.zph-menu a{
  color:#171a1d !important;
}

.zph-menu a:hover,
.zph-menu a:focus-visible{
  color:#090b0d !important;
}

.zph-menu a:hover:after,
.zph-menu a:focus-visible:after{
  background:#ffdd00 !important;
}

.zph-quote{
  color:#090b0d !important;
  background:#ffdd00 !important;
  border-color:#ffdd00 !important;
}

.zph-quote:hover{
  color:#090b0d !important;
  background:#ffe632 !important;
  border-color:#ffe632 !important;
}

.zph-icon,
.zph-burger{
  color:#090b0d !important;
  background:#fff !important;
  border-color:#cfd3d5 !important;
}

.zph-burger:hover,
.zph-icon:hover{
  color:#090b0d !important;
  background:#ffdd00 !important;
  border-color:#ffdd00 !important;
}

.zph-mega{
  border-top:3px solid #ffdd00 !important;
}

.zph-mega a:hover{
  color:#090b0d !important;
  background:#f2f2f2 !important;
}

/* =========================================================
   MOBILE INDUSTRIAL DRAWER
   ========================================================= */

@media(max-width:900px){

  .zph-drawer{
    color:#fff !important;
    background:#090b0d !important;
    border-left:1px solid #292e32 !important;
  }

  .zph-drawer-head{
    border-bottom-color:#2e3337 !important;
  }

  .zph-drawer-brand b{
    color:#fff !important;
  }

  .zph-drawer-brand span{
    color:#aeb4b8 !important;
  }

  .zph-drawer-close{
    color:#111 !important;
    background:#ffdd00 !important;
    border-color:#ffdd00 !important;
  }

  .zph-drawer-nav>a,
  .zph-drawer-products>summary{
    color:#fff !important;
  }

  .zph-drawer-nav>a>span>b,
  .zph-drawer-products b{
    color:#fff !important;
  }

  .zph-drawer-nav>a>i,
  .zph-drawer-summary-main>i{
    color:#111 !important;
    background:#ffdd00 !important;
  }

  .zph-drawer-nav small,
  .zph-drawer-products small{
    color:#a4aaae !important;
  }

  .zph-drawer-products>summary>i{
    color:#ffdd00 !important;
  }

  .zph-drawer-nav>a:hover,
  .zph-drawer-nav>a:focus-visible,
  .zph-drawer-products>summary:hover,
  .zph-drawer-products>summary:focus-visible,
  .zph-drawer-products[open]>summary{
    color:#fff !important;
    background:#171a1d !important;
    border-color:#33383d !important;
  }

  .zph-drawer-product-grid{
    border-right-color:#44494d !important;
  }

  .zph-drawer-product-grid>a{
    color:#d5d8da !important;
  }

  .zph-drawer-product-grid>a:hover{
    color:#111 !important;
    background:#ffdd00 !important;
  }

  .zph-drawer-product-grid>a>span{
    color:#ffdd00 !important;
  }

  .zph-drawer-product-grid>a:hover>span{
    color:#111 !important;
  }

  .zph-drawer-all-products{
    color:#111 !important;
    background:#ffdd00 !important;
  }

  .zph-drawer-all-products>span,
  .zph-drawer-all-products i{
    color:#111 !important;
  }

  .zph-drawer-footer{
    background:#060708 !important;
    border-top-color:#2d3236 !important;
  }

  .zph-drawer-footer>span{
    color:#90979c !important;
  }

  .zph-drawer-footer .zph-drawer-quote{
    color:#111 !important;
    background:#ffdd00 !important;
    border-color:#ffdd00 !important;
  }

  .zph-drawer-footer .zph-drawer-quote i{
    color:#111 !important;
  }

}

/* =========================================================
   FOOTER
   ========================================================= */

.pf{
  --pv-yellow:#ffdd00;
  --pv-black:#090b0d;

  background:#090b0d !important;
}

.pf-cta{
  color:#111 !important;
  background:#ffdd00 !important;
}

.pf-cta h2,
.pf-cta p{
  color:#111 !important;
}

.pf-cta a{
  color:#fff !important;
  background:#111 !important;
  border-color:#111 !important;
}

.pf-main{
  background:#090b0d !important;
}

.pf h3{
  color:#fff !important;
}

.pf a{
  color:#c5c9cc !important;
}

.pf a:hover{
  color:#ffdd00 !important;
}

.pf-brand p,
.pf-contact span,
.pf-legal p{
  color:#9ba2a7 !important;
}

.pf-brand-label{
  color:#ffdd00 !important;
}

.pf-supplier-card{
  background:#fff !important;
  border-radius:4px !important;
}

.pf-supplier-copy b{
  color:#111 !important;
}

.pf-supplier-copy small{
  color:#747b80 !important;
}

.pf-bottom{
  border-top-color:#2e3337 !important;
}


/* =========================================================
   PODEM MOBILE DRAWER HARD STATE V5
   ========================================================= */

@media(max-width:900px){

  /*
   * Closed is a real state.
   * The drawer cannot remain visible only because
   * a previous class/style was restored by the browser.
   */

  .zph-drawer{
    position:fixed !important;

    top:0 !important;
    right:0 !important;
    bottom:0 !important;
    left:auto !important;

    width:min(92vw,410px) !important;
    max-width:410px !important;

    height:100dvh !important;
    min-height:100dvh !important;

    display:block !important;

    transform:
      translateX(110%) !important;

    visibility:hidden !important;
    opacity:0 !important;

    pointer-events:none !important;

    overflow-x:hidden !important;
    overflow-y:auto !important;

    overscroll-behavior:contain;

    z-index:100002 !important;

    transition:
      transform .26s ease,
      opacity .20s ease,
      visibility 0s linear .26s !important;

    will-change:
      transform,
      opacity;
  }

  .zph-drawer.is-open{
    transform:
      translateX(0) !important;

    visibility:visible !important;
    opacity:1 !important;

    pointer-events:auto !important;

    transition-delay:0s !important;
  }

  .zph-drawer-shell{
    width:100% !important;

    min-height:100dvh !important;

    display:flex !important;
    flex-direction:column !important;
  }

  body.zph-drawer-open{
    overflow:hidden !important;
    touch-action:none;
  }

  [data-backdrop]{
    pointer-events:none;
  }

  [data-backdrop].is-open{
    pointer-events:auto;
  }

}

/*
 * Drawer is mobile-only.
 */

@media(min-width:901px){

  .zph-drawer{
    visibility:hidden !important;
    opacity:0 !important;
    pointer-events:none !important;
  }

}

/* =========================================================
   PODEM FOOTER REFINEMENT V5
   ========================================================= */

/*
 * Remove inherited visual processing from
 * the PODEM footer logo.
 */

.pf .pf-podem-logo{
  filter:none !important;

  box-shadow:none !important;
  text-shadow:none !important;

  opacity:1 !important;

  transform:none !important;

  background:transparent !important;
}

/*
 * Supplier logo must also remain completely clean.
 */

.pf .pf-supplier-logo,
.pf .pf-supplier-logo img{
  filter:none !important;
  box-shadow:none !important;
  text-shadow:none !important;
}

/*
 * Slightly larger footer typography.
 */

.pf-col h3{
  font-size:18px !important;
  line-height:1.7 !important;
  font-weight:950 !important;
}

.pf-brand>p{
  font-size:14px !important;
  line-height:2.15 !important;
}

.pf-col>a,
.pf-col>span{
  font-size:14px !important;
  line-height:1.95 !important;
}

.pf-supplier-copy b{
  font-size:14px !important;
  line-height:1.8 !important;
}

.pf-supplier-copy small{
  font-size:10px !important;
  line-height:1.6 !important;
}

/*
 * Legal copy:
 * centered, stacked, readable.
 */

.pf-legal{
  width:100% !important;
  max-width:none !important;

  padding-top:28px !important;
  padding-bottom:28px !important;

  display:flex !important;
  flex-direction:column !important;

  align-items:center !important;
  justify-content:center !important;

  gap:10px !important;

  text-align:center !important;
}

.pf-legal p{
  width:100% !important;
  max-width:1120px !important;

  margin:0 auto !important;

  padding:0 18px !important;

  color:#aeb4b8 !important;

  text-align:center !important;

  font-size:14px !important;
  line-height:2.15 !important;
  font-weight:600 !important;
}

/*
 * Copyright and Zalweb:
 * each on its own centered line.
 */

.pf-bottom{
  width:100% !important;

  padding-top:22px !important;
  padding-bottom:24px !important;

  display:flex !important;
  flex-direction:column !important;

  align-items:center !important;
  justify-content:center !important;

  gap:7px !important;

  text-align:center !important;
}

.pf-bottom p{
  width:100% !important;

  margin:0 !important;

  color:#aeb4b8 !important;

  text-align:center !important;

  direction:ltr;

  font-size:13px !important;
  line-height:1.8 !important;
  font-weight:700 !important;
}

.pf-bottom a{
  color:#ffdd00 !important;

  font-size:13px !important;
  font-weight:950 !important;

  text-decoration:none !important;
}

/*
 * Mobile footer remains centered
 * with larger readable type.
 */

@media(max-width:760px){

  .pf-col h3{
    font-size:17px !important;
  }

  .pf-brand>p,
  .pf-col>a,
  .pf-col>span{
    font-size:13.5px !important;
  }

  .pf-legal{
    padding:
      24px 0 !important;

    gap:12px !important;
  }

  .pf-legal p{
    padding:
      0 14px !important;

    font-size:13px !important;
    line-height:2.1 !important;
  }

  .pf-bottom{
    padding:
      20px 14px 24px !important;

    gap:7px !important;
  }

  .pf-bottom p,
  .pf-bottom a{
    font-size:12px !important;
  }

}

/* =========================================================
   PODEM FOOTER TRUE FULL WIDTH V6
   Full viewport / Clean large brand mark
   ========================================================= */

/*
 * Footer root itself must always own the viewport.
 */

.pf{
  position:relative;

  width:100vw !important;
  max-width:none !important;

  margin-left:
    calc(50% - 50vw) !important;

  margin-right:
    calc(50% - 50vw) !important;

  padding:0 !important;

  overflow:hidden;
}

/*
 * Every footer band is viewport width.
 */

.pf-cta,
.pf-main{
  width:100vw !important;
  max-width:none !important;

  margin-left:
    calc(50% - 50vw) !important;

  margin-right:
    calc(50% - 50vw) !important;
}

/*
 * Grid is NOT a centered max-width card.
 * It fills the viewport and only uses internal gutters.
 */

.pf-grid{
  width:100vw !important;
  max-width:none !important;

  margin-left:
    calc(50% - 50vw) !important;

  margin-right:
    calc(50% - 50vw) !important;

  padding-left:
    clamp(26px,5vw,96px) !important;

  padding-right:
    clamp(26px,5vw,96px) !important;
}

/*
 * CTA internal content also uses the full viewport rail.
 */

.pf-cta-inner{
  width:100vw !important;
  max-width:none !important;

  margin-left:
    calc(50% - 50vw) !important;

  margin-right:
    calc(50% - 50vw) !important;

  padding-left:
    clamp(26px,5vw,96px) !important;

  padding-right:
    clamp(26px,5vw,96px) !important;
}

/* =========================================================
   LARGE CLEAN PODEM LOGO
   ========================================================= */

.pf .pf-logos{
  width:auto !important;
  max-width:none !important;

  display:flex !important;
  align-items:center !important;
  justify-content:flex-start !important;

  padding:0 !important;
  margin:0 0 20px !important;

  background:transparent !important;

  border:0 !important;
  outline:0 !important;
  border-radius:0 !important;

  box-shadow:none !important;
  filter:none !important;
}

.pf .pf-podem-logo{
  display:block !important;

  width:clamp(190px,16vw,280px) !important;
  height:auto !important;

  max-width:none !important;
  max-height:none !important;

  margin:0 !important;
  padding:0 !important;

  object-fit:contain !important;
  object-position:right center !important;

  background:transparent !important;

  border:0 !important;
  outline:0 !important;
  border-radius:0 !important;

  filter:none !important;
  box-shadow:none !important;
  text-shadow:none !important;

  opacity:1 !important;

  transform:none !important;
}

/*
 * Brand column also must not create a visual card
 * around the logo.
 */

.pf-brand{
  background:transparent !important;

  border:0 !important;
  outline:0 !important;
  box-shadow:none !important;
}

/* =========================================================
   SUPPLIER MARK CLEAN
   ========================================================= */

.pf-supplier-card{
  box-shadow:none !important;
}

.pf-supplier-logo,
.pf-supplier-logo img{
  box-shadow:none !important;
  filter:none !important;
}

/* =========================================================
   FULL WIDTH LEGAL / COPYRIGHT
   ========================================================= */

.pf-legal{
  width:100vw !important;
  max-width:none !important;

  margin-left:
    calc(50% - 50vw) !important;

  margin-right:
    calc(50% - 50vw) !important;

  padding:
    30px clamp(26px,5vw,96px) !important;

  display:flex !important;
  flex-direction:column !important;

  align-items:center !important;
  justify-content:center !important;

  gap:11px !important;

  text-align:center !important;
}

.pf-legal p{
  width:100% !important;
  max-width:1180px !important;

  margin:0 auto !important;
  padding:0 !important;

  text-align:center !important;

  font-size:14px !important;
  line-height:2.15 !important;
}

.pf-bottom{
  width:100vw !important;
  max-width:none !important;

  margin-left:
    calc(50% - 50vw) !important;

  margin-right:
    calc(50% - 50vw) !important;

  padding:
    23px clamp(26px,5vw,96px)
    27px !important;

  display:flex !important;
  flex-direction:column !important;

  align-items:center !important;
  justify-content:center !important;

  gap:7px !important;

  text-align:center !important;
}

.pf-bottom p{
  width:100% !important;

  margin:0 !important;

  text-align:center !important;

  font-size:13px !important;
  line-height:1.8 !important;
}

/* =========================================================
   TABLET FOOTER
   ========================================================= */

@media(max-width:900px){

  .pf-grid,
  .pf-cta-inner{
    width:100vw !important;
    max-width:none !important;

    padding-left:24px !important;
    padding-right:24px !important;
  }

  .pf .pf-logos{
    justify-content:flex-start !important;
  }

  .pf .pf-podem-logo{
    width:220px !important;
  }

  .pf-legal,
  .pf-bottom{
    padding-left:24px !important;
    padding-right:24px !important;
  }

}

/* =========================================================
   MOBILE FOOTER
   ========================================================= */

@media(max-width:760px){

  .pf,
  .pf-main,
  .pf-grid,
  .pf-legal,
  .pf-bottom{
    width:100vw !important;
    max-width:none !important;
  }

  .pf-grid{
    padding-left:16px !important;
    padding-right:16px !important;
  }

  .pf-brand{
    width:100% !important;

    text-align:center !important;
  }

  .pf .pf-logos{
    width:100% !important;

    justify-content:center !important;

    margin-bottom:22px !important;
  }

  .pf .pf-podem-logo{
    width:230px !important;
    max-width:82vw !important;

    object-position:center !important;
  }

  .pf-brand-label,
  .pf-brand>p{
    text-align:center !important;
  }

  .pf-supplier-card{
    margin-left:auto !important;
    margin-right:auto !important;
  }

  .pf-legal{
    padding:
      26px 16px !important;
  }

  .pf-legal p{
    font-size:13px !important;
    line-height:2.15 !important;
  }

  .pf-bottom{
    padding:
      21px 16px 26px !important;
  }

  .pf-bottom p,
  .pf-bottom a{
    font-size:12px !important;
  }

}

@media(max-width:420px){

  .pf-grid{
    padding-left:12px !important;
    padding-right:12px !important;
  }

  .pf .pf-podem-logo{
    width:210px !important;
    max-width:86vw !important;
  }

  .pf-legal{
    padding-left:12px !important;
    padding-right:12px !important;
  }

  .pf-bottom{
    padding-left:12px !important;
    padding-right:12px !important;
  }

}