/*
Theme Name: Platinex Constructions
Theme URI: https://platinexconstructions.com/
Author: Platinex Constructions Limited
Author URI: https://platinexconstructions.com/
Description: A professional, fully responsive and animated WordPress theme built for Platinex Constructions Limited — General Contracting & Engineering across Residential, Commercial, Industrial, Institutional, Healthcare, Religious and Telecommunications sectors.
Version: 1.4.2
License: GNU General Public License v2 or later
License URI: LICENSE
Text Domain: platinex
Tags: custom-menu, featured-images, responsive-layout, translation-ready
*/

/* =============================================================
   0. ROOT VARIABLES
============================================================= */
:root{
  --px-red:#E31E24;
  --px-red-dark:#B3151A;
  --px-black:#0B0B0C;
  --px-black-soft:#171719;
  --px-grey-900:#1f2023;
  --px-grey-700:#4a4b50;
  --px-grey-500:#787a80;
  --px-grey-300:#c9cad0;
  --px-grey-100:#f4f4f6;
  --px-white:#ffffff;
  --px-font-display:'Barlow Condensed', 'Arial Narrow', sans-serif;
  --px-font-body:'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --px-radius:6px;
  --px-shadow-sm:0 2px 10px rgba(0,0,0,.08);
  --px-shadow-md:0 10px 30px rgba(0,0,0,.12);
  --px-shadow-lg:0 20px 60px rgba(0,0,0,.18);
  --px-transition:.35s cubic-bezier(.4,0,.2,1);
  --px-container:1240px;
}

/* =============================================================
   1. RESET & BASE
============================================================= */
*,*::before,*::after{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  margin:0;
  font-family:var(--px-font-body);
  color:var(--px-grey-900);
  background:var(--px-white);
  line-height:1.65;
  font-size:16px;
  overflow-x:hidden;
  overflow-y:visible;
}
img{max-width:100%;display:block;}
a{color:inherit;text-decoration:none;}
ul{margin:0;padding:0;list-style:none;}
h1,h2,h3,h4,h5{font-family:var(--px-font-display);font-weight:700;line-height:1.1;margin:0 0 .5em;text-transform:uppercase;letter-spacing:.5px;}
p{margin:0 0 1em;color:var(--px-grey-700);}
button{font-family:inherit;cursor:pointer;}
.px-container{max-width:var(--px-container);margin:0 auto;padding:0 24px;}
.px-section{padding:96px 0;position:relative;}
.px-section--tight{padding:64px 0;}
.px-section--dark{background:var(--px-black);color:var(--px-white);}
.px-section--dark p{color:var(--px-grey-300);}
.px-section--dark h1,.px-section--dark h2,.px-section--dark h3{color:var(--px-white);}
.px-section--grey{background:var(--px-grey-100);}
.screen-reader-text{position:absolute;left:-9999px;}

/* =============================================================
   2. TYPOGRAPHY HELPERS
============================================================= */
.px-eyebrow{
  display:inline-flex;align-items:center;gap:10px;
  font-family:var(--px-font-display);
  color:var(--px-red);font-weight:700;letter-spacing:3px;
  text-transform:uppercase;font-size:14px;margin-bottom:14px;
}
.px-eyebrow::before{content:"";width:34px;height:3px;background:var(--px-red);display:block;}
.px-heading{font-size:clamp(30px,4vw,48px);margin-bottom:20px;}
.px-heading span{color:var(--px-red);}
.px-lede{font-size:18px;color:var(--px-grey-700);max-width:680px;}
.px-section--dark .px-lede{color:var(--px-grey-300);}
.px-head-row{display:flex;justify-content:space-between;align-items:flex-end;gap:30px;flex-wrap:wrap;margin-bottom:50px;}

/* =============================================================
   3. BUTTONS
============================================================= */
.px-btn{
  display:inline-flex;align-items:center;gap:10px;
  padding:16px 34px;border-radius:2px;
  font-family:var(--px-font-display);font-weight:700;text-transform:uppercase;letter-spacing:1.5px;font-size:14px;
  border:2px solid transparent;transition:var(--px-transition);position:relative;overflow:hidden;
}
.px-btn--primary{background:var(--px-red);color:var(--px-white);}
.px-btn--primary:hover{background:var(--px-black);transform:translateY(-3px);box-shadow:var(--px-shadow-md);}
.px-btn--outline{border-color:var(--px-white);color:var(--px-white);}
.px-btn--outline:hover{background:var(--px-white);color:var(--px-black);transform:translateY(-3px);}
.px-btn--outline-dark{border-color:var(--px-black);color:var(--px-black);}
.px-btn--outline-dark:hover{background:var(--px-black);color:var(--px-white);transform:translateY(-3px);}
.px-btn--sm{padding:10px 22px;font-size:12px;}
.px-btn svg{width:16px;height:16px;transition:transform .3s;}
.px-btn:hover svg{transform:translateX(4px);}

/* =============================================================
   4. HEADER / NAV
============================================================= */
.px-topbar{background:var(--px-black);color:var(--px-grey-300);font-size:13px;}
.px-topbar .px-container{display:flex;justify-content:space-between;align-items:center;padding:9px 24px;flex-wrap:wrap;gap:8px;}
.px-topbar a{color:var(--px-grey-300);transition:color .2s;}
.px-topbar a:hover{color:var(--px-red);}
.px-topbar-info{display:flex;gap:24px;flex-wrap:wrap;}
.px-topbar-info span{display:inline-flex;align-items:center;gap:6px;}
.px-topbar-social{display:flex;gap:14px;}
.px-topbar-social a{width:26px;height:26px;border:1px solid var(--px-grey-700);border-radius:50%;display:flex;align-items:center;justify-content:center;}
.px-topbar-social a:hover{border-color:var(--px-red);background:var(--px-red);color:var(--px-white);}
.px-topbar-social svg{width:13px;height:13px;}
.px-topbar-info svg{width:13px;height:13px;flex-shrink:0;}
.px-topbar-info a{color:inherit;}

.px-header{
  position:sticky;top:0;left:0;width:100%;z-index:999;
  background:rgba(11,11,12,.92);backdrop-filter:blur(6px);
  transition:var(--px-transition);
}
.px-header.is-scrolled{background:rgba(11,11,12,.98);box-shadow:0 4px 20px rgba(0,0,0,.3);}
.px-header .px-container{display:flex;align-items:center;justify-content:space-between;padding:14px 24px;}
.px-logo{display:flex;align-items:center;gap:12px;color:var(--px-white);}
.px-logo-mark{position:relative;display:inline-flex;align-items:flex-start;flex:0 0 auto;}
.px-logo img{height:48px;width:auto;}
.px-logo-reg{position:absolute;top:-3px;right:-5px;color:var(--px-white);font-size:11px;font-weight:700;line-height:1;font-family:Arial,sans-serif;}
.px-logo-text{font-family:var(--px-font-display);line-height:1.05;}
.px-logo-text strong{display:block;font-size:24px;letter-spacing:1px;color:var(--px-white);}
.px-logo-text small{display:block;font-size:14px;letter-spacing:3px;color:var(--px-red);font-weight:700;}

.px-nav{display:flex;align-items:center;gap:36px;}
.px-nav ul{display:flex;gap:30px;}
.px-nav a{
  font-family:var(--px-font-display);font-weight:600;letter-spacing:1px;text-transform:uppercase;font-size:14.5px;
  color:var(--px-white);position:relative;padding:8px 0;
}
.px-nav > ul > li > a::after{content:"";position:absolute;left:0;bottom:0;width:0;height:2px;background:var(--px-red);transition:width .3s;}
.px-nav > ul > li:hover > a::after, .px-nav > ul > li.current-menu-item > a::after{width:100%;}
.px-nav li{position:relative;}
.px-nav .sub-menu{
  position:absolute;top:100%;left:0;background:var(--px-white);min-width:260px;
  box-shadow:var(--px-shadow-lg);padding:10px 0;opacity:0;visibility:hidden;transform:translateY(10px);
  transition:var(--px-transition);border-top:3px solid var(--px-red);
}
.px-nav li:hover > .sub-menu{opacity:1;visibility:visible;transform:translateY(0);}
.px-nav .sub-menu a{color:var(--px-black);padding:11px 22px;display:block;font-size:13.5px;letter-spacing:.5px;}
.px-nav .sub-menu a:hover{background:var(--px-grey-100);color:var(--px-red);padding-left:28px;}
.px-nav .sub-menu a::after{display:none;}
.px-nav li.menu-item-has-children > a{padding-right:16px;}

.px-header-cta{display:flex;align-items:center;gap:20px;}
.px-burger{display:none;flex-direction:column;gap:5px;width:32px;background:none;border:none;padding:6px;}
.px-burger span{height:2px;background:var(--px-white);border-radius:2px;transition:var(--px-transition);}

/* Mobile nav drawer */
.px-mobile-nav{
  position:fixed;top:0;right:-100%;width:82%;max-width:360px;height:100%;background:var(--px-black-soft);
  z-index:1200;transition:right .4s cubic-bezier(.4,0,.2,1);padding:90px 30px 30px;overflow-y:auto;
  box-shadow:-10px 0 40px rgba(0,0,0,.4);
}
.px-mobile-nav.is-open{right:0;}
.px-mobile-nav ul{display:flex;flex-direction:column;gap:4px;}
.px-mobile-nav a{display:block;color:var(--px-white);padding:14px 4px;font-family:var(--px-font-display);text-transform:uppercase;letter-spacing:1px;font-size:16px;border-bottom:1px solid rgba(255,255,255,.08);}
.px-mobile-nav .sub-menu{padding-left:16px;display:none;}
.px-mobile-nav li.mobile-open > .sub-menu{display:block;}
.px-mobile-nav .sub-menu a{font-size:14px;color:var(--px-grey-300);border-bottom:none;padding:10px 4px;}
.px-mobile-close{position:absolute;top:26px;right:26px;background:none;border:none;color:var(--px-white);font-size:30px;line-height:1;}
.px-nav-overlay{position:fixed;inset:0;background:rgba(0,0,0,.6);z-index:1100;opacity:0;visibility:hidden;transition:var(--px-transition);}
.px-nav-overlay.is-open{opacity:1;visibility:visible;}

/* =============================================================
   5. HERO
============================================================= */
.px-hero{
  position:relative;min-height:92vh;display:flex;align-items:center;
  background:var(--px-black);color:var(--px-white);overflow:hidden;
}
.px-hero-bg{position:absolute;inset:0;z-index:0;}
.px-hero-bg img{width:100%;height:100%;object-fit:cover;opacity:.55;transform:scale(1.08);animation:px-zoom 18s ease-in-out infinite alternate;}
.px-hero-bg::after{content:"";position:absolute;inset:0;background:linear-gradient(100deg,rgba(11,11,12,.95) 20%,rgba(11,11,12,.55) 55%,rgba(11,11,12,.2) 100%);}
@keyframes px-zoom{from{transform:scale(1.08);}to{transform:scale(1.18);}}
.px-hero-shape{position:absolute;top:-10%;right:-8%;width:520px;height:520px;border:2px solid rgba(227,30,36,.35);border-radius:50%;z-index:1;animation:px-spin 40s linear infinite;}
.px-hero-shape::before{content:"";position:absolute;inset:40px;border:1px solid rgba(255,255,255,.12);border-radius:50%;}
@keyframes px-spin{to{transform:rotate(360deg);}}
.px-hero-content{position:relative;z-index:2;max-width:720px;}
.px-hero-content .px-eyebrow{color:var(--px-red);}
.px-hero-content h1{font-size:clamp(38px,6vw,68px);margin-bottom:22px;}
.px-hero-content h1 span{color:var(--px-red);}
.px-hero-content p{font-size:19px;color:var(--px-grey-300);max-width:560px;}
.px-hero-actions{display:flex;gap:18px;margin-top:34px;flex-wrap:wrap;}
.px-hero-scroll{position:absolute;left:50%;bottom:34px;transform:translateX(-50%);z-index:2;display:flex;flex-direction:column;align-items:center;gap:8px;color:var(--px-grey-300);font-size:12px;letter-spacing:2px;text-transform:uppercase;}
.px-hero-scroll span{width:1px;height:36px;background:linear-gradient(var(--px-red),transparent);animation:px-scrolldown 1.8s ease-in-out infinite;}
@keyframes px-scrolldown{0%{opacity:0;transform:scaleY(0);}50%{opacity:1;transform:scaleY(1);}100%{opacity:0;transform:scaleY(1);}}

/* Page header (non-front pages) */
.px-pageheader{position:relative;background:var(--px-black);color:var(--px-white);padding:190px 0 90px;overflow:hidden;}
.px-pageheader-bg{position:absolute;inset:0;}
.px-pageheader-bg img{width:100%;height:100%;object-fit:cover;opacity:.28;}
.px-pageheader-bg::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(11,11,12,.4),rgba(11,11,12,.96));}
.px-pageheader-content{position:relative;z-index:2;}
.px-breadcrumb{display:flex;gap:8px;align-items:center;font-size:13px;color:var(--px-grey-300);text-transform:uppercase;letter-spacing:1px;margin-bottom:16px;}
.px-breadcrumb a:hover{color:var(--px-red);}
.px-breadcrumb .sep{color:var(--px-red);}
.px-pageheader h1{font-size:clamp(32px,5vw,54px);margin:0;}

/* =============================================================
   6. STATS COUNTER STRIP
============================================================= */
.px-stats{background:var(--px-red);}
.px-stats .px-container{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;padding:50px 24px;}
.px-stat{text-align:center;color:var(--px-white);border-right:1px solid rgba(255,255,255,.25);}
.px-stat:last-child{border-right:none;}
.px-stat strong{font-family:var(--px-font-display);font-size:clamp(34px,5vw,52px);display:block;}
.px-stat span{font-size:13px;letter-spacing:1.5px;text-transform:uppercase;opacity:.9;}

/* =============================================================
   7. ABOUT / SPLIT SECTIONS
============================================================= */
.px-split{display:grid;grid-template-columns:1fr 1fr;gap:60px;align-items:center;}
.px-split-media{position:relative;}
.px-split-media img{border-radius:var(--px-radius);box-shadow:var(--px-shadow-lg);}
.px-split-media-badge{
  position:absolute;bottom:-30px;right:-24px;background:var(--px-black);color:var(--px-white);
  padding:26px 30px;border-left:4px solid var(--px-red);box-shadow:var(--px-shadow-lg);max-width:230px;
}
.px-split-media-badge strong{display:block;font-family:var(--px-font-display);font-size:28px;color:var(--px-red);}
.px-split-media-badge span{font-size:12.5px;letter-spacing:1px;text-transform:uppercase;color:var(--px-grey-300);}
.px-split-media::before{content:"";position:absolute;top:-22px;left:-22px;width:120px;height:120px;border:6px solid var(--px-red);z-index:-1;}
.px-check-list li{display:flex;gap:12px;align-items:flex-start;margin-bottom:14px;font-weight:500;}
.px-check-list svg{flex:0 0 auto;width:20px;height:20px;color:var(--px-red);margin-top:2px;}

/* =============================================================
   8. SERVICE / PILLAR / CAPABILITY CARDS
============================================================= */
.px-grid{display:grid;gap:30px;}
.px-grid--3{grid-template-columns:repeat(3,1fr);}
.px-grid--4{grid-template-columns:repeat(4,1fr);}
.px-grid--2{grid-template-columns:repeat(2,1fr);}

.px-card{
  background:var(--px-white);border:1px solid var(--px-grey-100);border-radius:var(--px-radius);
  padding:38px 30px;transition:var(--px-transition);position:relative;overflow:hidden;
}
.px-card::before{content:"";position:absolute;left:0;top:0;width:4px;height:0;background:var(--px-red);transition:height .35s;}
.px-card:hover{box-shadow:var(--px-shadow-md);transform:translateY(-8px);}
.px-card:hover::before{height:100%;}
.px-card-icon{
  width:64px;height:64px;border-radius:50%;background:var(--px-grey-100);display:flex;align-items:center;justify-content:center;
  margin-bottom:22px;color:var(--px-red);transition:var(--px-transition);
}
.px-card:hover .px-card-icon{background:var(--px-red);color:var(--px-white);transform:rotate(-8deg) scale(1.05);}
.px-card-icon svg{width:30px;height:30px;}
.px-card h3{font-size:20px;margin-bottom:12px;}
.px-card p{font-size:14.5px;margin-bottom:16px;}
.px-card-link{font-family:var(--px-font-display);font-size:13px;letter-spacing:1px;font-weight:700;color:var(--px-black);display:inline-flex;align-items:center;gap:8px;text-transform:uppercase;}
.px-card:hover .px-card-link{color:var(--px-red);}
.px-card-link svg{width:14px;height:14px;transition:transform .3s;}
.px-card:hover .px-card-link svg{transform:translateX(5px);}
.px-card--dark{background:var(--px-black-soft);border-color:rgba(255,255,255,.06);}
.px-card--dark h3, .px-card--dark p{color:var(--px-white);}
.px-card--dark p{color:var(--px-grey-300);}
.px-card-num{position:absolute;top:20px;right:26px;font-family:var(--px-font-display);font-size:44px;color:var(--px-grey-100);font-weight:700;}

/* =============================================================
   9. PILLARS (numbered strip)
============================================================= */
.px-pillar{display:flex;gap:22px;padding:26px 0;border-bottom:1px solid rgba(255,255,255,.08);align-items:flex-start;}
.px-pillar:last-child{border-bottom:none;}
.px-pillar-num{font-family:var(--px-font-display);font-size:38px;color:var(--px-red);flex:0 0 60px;}
.px-pillar h4{color:var(--px-white);font-size:18px;margin-bottom:6px;}

/* =============================================================
   10. PROJECTS / PORTFOLIO
============================================================= */
.px-filters{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:44px;}
.px-filter-btn{
  padding:10px 20px;border:1px solid var(--px-grey-300);background:transparent;border-radius:30px;
  font-family:var(--px-font-display);font-size:13px;letter-spacing:1px;text-transform:uppercase;font-weight:600;color:var(--px-grey-700);
  transition:var(--px-transition);
}
.px-filter-btn:hover, .px-filter-btn.is-active{background:var(--px-red);border-color:var(--px-red);color:var(--px-white);}
/* Project category dropdown: mobile only. */
.px-project-filter-select{
  display:none !important;
  width:100%;
  min-height:50px;
  padding:12px 46px 12px 16px;
  border:1px solid var(--px-grey-300);
  border-radius:30px;
  background:var(--px-white);
  color:var(--px-grey-700);
  font-family:var(--px-font-display);
  font-size:14px;
  font-weight:600;
  letter-spacing:1px;
  text-transform:uppercase;
  appearance:none;
  -webkit-appearance:none;
  background-image:linear-gradient(45deg,transparent 50%,var(--px-grey-700) 50%),linear-gradient(135deg,var(--px-grey-700) 50%,transparent 50%);
  background-position:calc(100% - 20px) 21px,calc(100% - 14px) 21px;
  background-size:6px 6px,6px 6px;
  background-repeat:no-repeat;
  box-sizing:border-box;
}
.px-project-filter-select:focus{outline:none;border-color:var(--px-red);box-shadow:0 0 0 2px rgba(227,30,36,.1);}

.px-project-card{position:relative;overflow:hidden;border-radius:var(--px-radius);box-shadow:var(--px-shadow-sm);background:var(--px-black);}
.px-project-card .px-project-img{aspect-ratio:4/3;overflow:hidden;}
.px-project-card img{width:100%;height:100%;object-fit:cover;transition:transform .6s ease;}
.px-project-card:hover img{transform:scale(1.1);}
.px-project-overlay{
  position:absolute;inset:0;display:flex;flex-direction:column;justify-content:flex-end;padding:26px;
  background:linear-gradient(180deg,transparent 40%,rgba(0,0,0,.92) 100%);
}
.px-project-tag{
  display:inline-block;background:var(--px-red);color:var(--px-white);font-size:11px;letter-spacing:1px;
  text-transform:uppercase;padding:5px 12px;border-radius:2px;margin-bottom:10px;width:max-content;font-weight:700;
}
.px-project-overlay h3{color:var(--px-white);font-size:19px;margin:0 0 4px;}
.px-project-overlay p{color:var(--px-grey-300);font-size:13px;margin:0;}
.px-project-arrow{
  position:absolute;top:20px;right:20px;width:42px;height:42px;border-radius:50%;background:rgba(255,255,255,.15);
  display:flex;align-items:center;justify-content:center;color:var(--px-white);opacity:0;transform:translateY(10px);
  transition:var(--px-transition);
}
.px-project-card:hover .px-project-arrow{opacity:1;transform:translateY(0);background:var(--px-red);}
.px-project-arrow svg{width:18px;height:18px;}
.px-project-hidden{display:none !important;}
.px-projects-more{display:flex;justify-content:center;margin-top:40px;}

/* single project */
.px-single-project-gallery{display:grid;grid-template-columns:2fr 1fr;gap:16px;margin-bottom:50px;}
.px-single-project-gallery img{border-radius:var(--px-radius);width:100%;height:100%;object-fit:cover;}
.px-single-project-gallery .main-img{grid-row:span 2;aspect-ratio:4/3;}
.px-single-project-gallery .sub-img{aspect-ratio:4/2.3;}

.px-single-project-gallery-extra{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(320px,1fr));
  gap:16px;
  margin:-34px 0 50px;
  width:100%;
  min-width:0;
}
.px-single-project-gallery-extra .gallery-extra-img{
  width:100%;
  min-width:0;
  aspect-ratio:4/3;
  overflow:hidden;
  border-radius:var(--px-radius);
}
.px-single-project-gallery-extra img{
  display:block;
  width:100%;
  max-width:none;
  height:100%;
  object-fit:cover;
}
.px-video-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(340px,1fr));
  gap:24px;
  margin-bottom:50px;
  width:100%;
  min-width:0;
}
.px-video-item{
  position:relative;
  width:100%;
  aspect-ratio:16/9;
  overflow:hidden;
  border-radius:var(--px-radius);
  box-shadow:var(--px-shadow-sm);
  background:var(--px-black-soft);
}
.px-video-item iframe{
  position:absolute;
  top:0;
  left:0;
  width:100%;
  height:100%;
  border:0;
  display:block;
}
.px-project-meta{background:var(--px-grey-100);border-radius:var(--px-radius);padding:30px;}
.px-project-meta li{display:flex;justify-content:space-between;padding:14px 0;border-bottom:1px solid var(--px-grey-300);font-size:14px;}
.px-project-meta li:last-child{border-bottom:none;}
.px-project-meta li strong{font-family:var(--px-font-display);text-transform:uppercase;letter-spacing:.5px;font-size:12.5px;color:var(--px-grey-700);}

/* =============================================================
   11. PROCESS / STEPS
============================================================= */
.px-process{display:grid;grid-template-columns:repeat(4,1fr);gap:0;position:relative;}
.px-process-step{padding:0 24px;position:relative;text-align:center;}
.px-process-step:not(:last-child)::after{
  content:"";position:absolute;top:34px;right:-14px;width:28px;height:2px;background:repeating-linear-gradient(90deg,var(--px-red) 0 6px,transparent 6px 12px);
}
.px-process-num{
  width:68px;height:68px;border-radius:50%;border:2px solid var(--px-red);display:flex;align-items:center;justify-content:center;
  margin:0 auto 22px;font-family:var(--px-font-display);font-size:26px;font-weight:700;color:var(--px-red);
}

/* =============================================================
   12. CLIENTS / LOGOS
============================================================= */
.px-logo-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:22px;}
.px-clients-more{display:flex;justify-content:center;margin-top:40px;}
.px-logo-tile{
  background:var(--px-white);border:1px solid var(--px-grey-100);border-radius:var(--px-radius);
  display:flex;align-items:center;justify-content:center;padding:10px;height:130px;transition:var(--px-transition);
}
.px-logo-tile img{display:block;width:100%;height:100%;max-width:100%;max-height:100%;object-fit:contain;filter:grayscale(15%);transition:var(--px-transition);}
.px-logo-tile:hover{border-color:var(--px-red);box-shadow:var(--px-shadow-sm);transform:translateY(-4px);}
.px-logo-tile:hover img{filter:none;}

/* =============================================================
   13. TESTIMONIALS
============================================================= */
.px-testimonial{background:var(--px-black-soft);padding:40px;border-radius:var(--px-radius);position:relative;}
.px-testimonial svg{width:34px;height:34px;color:var(--px-red);margin-bottom:16px;}
.px-testimonial p{color:var(--px-grey-300);font-style:italic;font-size:15.5px;}
.px-testimonial-author{display:flex;align-items:center;gap:12px;margin-top:20px;}
.px-testimonial-author strong{color:var(--px-white);display:block;font-size:14px;}
.px-testimonial-author span{color:var(--px-red);font-size:12px;letter-spacing:1px;text-transform:uppercase;}

/* ------------------------------------------------------------------------
 * HOMEPAGE PAST PROJECT GALLERY
 * ---------------------------------------------------------------------- */
.px-past-projects-section{position:relative;overflow:hidden;background:#fff;padding:38px 0 48px;}
.px-past-projects-heading{position:relative;z-index:2;text-align:center;margin-bottom:12px;}
.px-past-projects-title{display:inline-block;margin:0;color:var(--px-red);font-family:Arial,sans-serif;font-size:17px;line-height:1.1;font-weight:800;text-decoration:underline;text-decoration-thickness:2px;text-underline-offset:3px;}
.px-past-projects-grid{position:relative;z-index:2;width:min(620px,100%);margin:0 auto;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px 10px;padding:0 10px;}
.px-past-project-item{overflow:hidden;aspect-ratio:1.48;border-radius:0;background:#f3f3f3;}
.px-past-project-item img{display:block;width:100%;height:100%;object-fit:cover;transition:transform .35s ease;}
.px-past-project-item:hover img{transform:scale(1.025);}
.px-past-projects-grid .px-past-project-item:last-child:nth-child(odd){grid-column:1 / -1;width:calc(50% - 5px);justify-self:center;}
.px-past-projects-corner{position:absolute;z-index:1;pointer-events:none;border:0 solid var(--px-red);}
.px-past-projects-corner--top{top:-86px;right:-36px;width:220px;height:170px;border-bottom:8px solid var(--px-red);border-left:0;border-radius:0 0 0 100%;transform:rotate(6deg);}
.px-past-projects-corner--bottom{bottom:-96px;left:-48px;width:240px;height:180px;border-top:8px solid var(--px-red);border-right:0;border-radius:100% 0 0 0;transform:rotate(-6deg);}
.px-past-projects-corner--top:after,.px-past-projects-corner--bottom:after{content:"";position:absolute;background:#0b0b0c;}
.px-past-projects-corner--top:after{top:-2px;right:0;width:18px;height:86px;border-radius:0 0 0 100%;}
.px-past-projects-corner--bottom:after{bottom:-2px;left:0;width:18px;height:86px;border-radius:0 100% 0 0;}


/* ------------------------------------------------------------------------
 * PAST PROJECTS DESKTOP GALLERY + LIGHTBOX
 * Desktop only: expand the gallery while keeping the existing mobile layout.
 * ---------------------------------------------------------------------- */
@media (min-width:1024px){
  .px-past-projects-grid{width:min(1220px,calc(100vw - 80px));grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;padding:0;}
  .px-past-project-item{aspect-ratio:1.55;}
  .px-past-projects-grid .px-past-project-item:last-child:nth-child(odd){grid-column:auto;width:auto;justify-self:stretch;}
}
.px-past-project-link{display:block;width:100%;height:100%;cursor:zoom-in;outline:none;}
.px-past-project-link:focus-visible{box-shadow:0 0 0 3px rgba(190,0,0,.45);}
.px-past-project-lightbox{position:fixed !important;inset:0 !important;z-index:2147483647 !important;display:none !important;align-items:center !important;justify-content:center !important;padding:0 !important;margin:0 !important;background:rgba(0,0,0,.94) !important;box-sizing:border-box !important;overflow:hidden !important;}
.px-past-project-lightbox.is-open{display:block !important;}
.px-past-project-lightbox-stage{position:absolute !important;inset:0 !important;display:flex !important;align-items:center !important;justify-content:center !important;width:100% !important;height:100% !important;padding:70px 90px !important;box-sizing:border-box !important;pointer-events:none !important;z-index:1 !important;} .px-past-project-lightbox-stage{touch-action:pan-y !important;}
.px-past-project-lightbox img{display:block !important;position:relative !important;z-index:2 !important;max-width:calc(100vw - 180px) !important;max-height:calc(100vh - 140px) !important;width:auto !important;height:auto !important;object-fit:contain !important;box-shadow:0 18px 70px rgba(0,0,0,.55) !important;pointer-events:auto !important;transform:scale(1);transform-origin:center center;transition:transform .16s ease;user-select:none !important;-webkit-user-select:none !important;-webkit-user-drag:none !important;}
.px-past-project-lightbox-toolbar{position:fixed !important;top:0 !important;right:0 !important;z-index:2147483647 !important;width:100% !important;height:82px !important;pointer-events:none !important;}
.px-past-project-lightbox-close,.px-past-project-lightbox-prev,.px-past-project-lightbox-next{position:fixed !important;z-index:2147483647 !important;display:flex !important;align-items:center !important;justify-content:center !important;visibility:visible !important;opacity:1 !important;pointer-events:auto !important;appearance:none !important;-webkit-appearance:none !important;border:2px solid rgba(255,255,255,.9) !important;background:#111 !important;color:#fff !important;cursor:pointer !important;border-radius:50% !important;width:56px !important;height:56px !important;min-width:56px !important;min-height:56px !important;padding:0 !important;margin:0 !important;font-family:Arial,sans-serif !important;font-size:30px !important;font-weight:700 !important;line-height:1 !important;text-align:center !important;box-sizing:border-box !important;text-decoration:none !important;}
.px-past-project-lightbox-zoom{position:fixed !important;top:20px !important;left:20px !important;z-index:2147483647 !important;display:flex !important;gap:8px !important;pointer-events:auto !important;}
.px-past-project-lightbox-zoom-in,.px-past-project-lightbox-zoom-out{position:static !important;display:flex !important;align-items:center !important;justify-content:center !important;width:50px !important;height:50px !important;min-width:50px !important;min-height:50px !important;padding:0 !important;margin:0 !important;border:2px solid rgba(255,255,255,.9) !important;border-radius:50% !important;background:#111 !important;color:#fff !important;cursor:pointer !important;appearance:none !important;-webkit-appearance:none !important;font-family:Arial,sans-serif !important;font-size:30px !important;font-weight:700 !important;line-height:1 !important;box-sizing:border-box !important;}
.px-past-project-lightbox-zoom-in:hover,.px-past-project-lightbox-zoom-out:hover{background:#b40000 !important;border-color:#fff !important;}
.px-past-project-lightbox-zoom-in:disabled,.px-past-project-lightbox-zoom-out:disabled{opacity:.35 !important;cursor:not-allowed !important;}
.px-past-project-lightbox-close{top:20px !important;right:20px !important;}
.px-past-project-lightbox-prev{left:20px !important;top:50% !important;transform:translateY(-50%) !important;}
.px-past-project-lightbox-next{right:20px !important;top:50% !important;transform:translateY(-50%) !important;}
.px-past-project-lightbox-close span,.px-past-project-lightbox-prev span,.px-past-project-lightbox-next span{display:block !important;color:#fff !important;line-height:1 !important;}
.px-past-project-lightbox-close:hover,.px-past-project-lightbox-prev:hover,.px-past-project-lightbox-next:hover{background:#b40000 !important;border-color:#fff !important;}
.px-past-project-lightbox-caption{position:fixed !important;left:50% !important;bottom:16px !important;transform:translateX(-50%) !important;color:#fff !important;font-size:14px !important;line-height:1.4 !important;text-align:center !important;max-width:80% !important;opacity:.95 !important;z-index:2147483647 !important;pointer-events:none !important;}
body.px-lightbox-open{overflow:hidden !important;}


/* Mobile testimonial carousel: desktop layout remains unchanged. */
@media (max-width:680px){
  .px-past-project-lightbox-stage{padding:76px 62px !important;}
  .px-past-project-lightbox img{max-width:calc(100vw - 124px) !important;max-height:calc(100vh - 152px) !important;}
  .px-past-project-lightbox-close,.px-past-project-lightbox-prev,.px-past-project-lightbox-next{width:48px !important;height:48px !important;min-width:48px !important;min-height:48px !important;font-size:26px !important;}
  .px-past-project-lightbox-close{top:14px !important;right:14px !important;}
  .px-past-project-lightbox-prev{left:10px !important;}
  .px-past-project-lightbox-next{right:10px !important;}
  .px-past-project-lightbox-zoom{top:14px !important;left:10px !important;gap:6px !important;}
  .px-past-project-lightbox-zoom-in,.px-past-project-lightbox-zoom-out{width:44px !important;height:44px !important;min-width:44px !important;min-height:44px !important;font-size:26px !important;}

  .px-testimonial-carousel{
    display:flex;
    flex-wrap:nowrap;
    gap:16px;
    overflow-x:auto;
    overflow-y:hidden;
    scroll-snap-type:x mandatory;
    -webkit-overflow-scrolling:touch;
    scrollbar-width:none;
    overscroll-behavior-x:contain;
    padding:2px 0 8px;
  }
  .px-testimonial-carousel::-webkit-scrollbar{display:none;}
  .px-testimonial-carousel > .px-testimonial{
    flex:0 0 100%;
    width:100%;
    min-width:100%;
    scroll-snap-align:start;
    scroll-snap-stop:always;
    box-sizing:border-box;
  }
  .px-testimonial-carousel-controls{
    display:flex;
    align-items:center;
    justify-content:center;
    gap:7px;
    min-height:18px;
    margin-top:10px;
  }
  .px-testimonial-carousel-dot{
    width:7px;
    height:7px;
    padding:0;
    border:0;
    border-radius:50%;
    background:var(--px-grey-300);
    opacity:.65;
    cursor:pointer;
  }
  .px-testimonial-carousel-dot.is-active{
    width:9px;
    height:9px;
    background:var(--px-red);
    opacity:1;
  }
}
@media (min-width:681px){
  .px-testimonial-carousel-controls{display:none;}
}

/* =============================================================
   14. CTA BAND
============================================================= */
.px-cta{
  background:linear-gradient(120deg,var(--px-red-dark),var(--px-red));position:relative;overflow:hidden;color:var(--px-white);
}
.px-cta::before{content:"";position:absolute;right:-60px;top:-60px;width:280px;height:280px;border-radius:50%;background:rgba(255,255,255,.08);}
.px-cta::after{content:"";position:absolute;left:-40px;bottom:-80px;width:220px;height:220px;border-radius:50%;background:rgba(0,0,0,.1);}
.px-cta-inner{display:flex;justify-content:space-between;align-items:center;gap:30px;flex-wrap:wrap;position:relative;z-index:1;}
.px-cta h2{margin:0 0 6px;font-size:clamp(24px,3.4vw,36px);}
.px-cta p{color:rgba(255,255,255,.85);margin:0;}

/* =============================================================
   15. CONTACT
============================================================= */
.px-contact-grid{display:grid;grid-template-columns:1fr 1.2fr;gap:50px;}
.px-contact-info-item{display:flex;gap:16px;margin-bottom:26px;}
.px-contact-info-item .icon{width:52px;height:52px;border-radius:50%;background:var(--px-red);color:var(--px-white);display:flex;align-items:center;justify-content:center;flex:0 0 auto;}
.px-contact-info-item .icon svg{width:22px;height:22px;}
.px-contact-info-item h4{margin:0 0 4px;font-size:15px;}
.px-contact-info-item p{margin:0;font-size:14.5px;}
.px-form{display:grid;grid-template-columns:1fr 1fr;gap:20px;}
.px-form .full{grid-column:1/-1;}
.px-form input,.px-form select,.px-form textarea{
  width:100%;padding:15px 18px;border:1px solid var(--px-grey-300);border-radius:var(--px-radius);font-family:inherit;
  font-size:14.5px;transition:var(--px-transition);background:var(--px-white);
}
.px-form input:focus,.px-form select:focus,.px-form textarea:focus{border-color:var(--px-red);outline:none;box-shadow:0 0 0 3px rgba(227,30,36,.12);}
.px-map{border-radius:var(--px-radius);overflow:hidden;box-shadow:var(--px-shadow-sm);}
.px-map iframe{width:100%;height:340px;border:0;display:block;}

/* =============================================================
   16. FOOTER
============================================================= */
.px-footer{background:var(--px-black);color:var(--px-grey-300);padding-top:80px;}
.px-footer-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr 1.2fr;gap:40px;padding-bottom:60px;border-bottom:1px solid rgba(255,255,255,.08);}
.px-footer-logo{display:flex;align-items:center;gap:10px;margin-bottom:18px;}
.px-footer-logo img{height:64px;width:auto;}
.px-footer-logo-link{display:inline-flex;align-items:center;}
.px-footer h4{color:var(--px-white);font-size:16px;margin-bottom:22px;}
.px-footer-links li{margin-bottom:12px;}
.px-footer-links a{transition:color .2s;}
.px-footer-links a:hover{color:var(--px-red);padding-left:4px;}
.px-footer-social{display:flex;gap:12px;margin-top:20px;}
.px-footer-social a{width:36px;height:36px;border:1px solid rgba(255,255,255,.15);border-radius:50%;display:flex;align-items:center;justify-content:center;transition:var(--px-transition);}
.px-footer-social a:hover{background:var(--px-red);border-color:var(--px-red);transform:translateY(-3px);}
.px-footer-social svg{width:15px;height:15px;}
.px-footer-bottom{display:flex;justify-content:space-between;align-items:center;padding:26px 0;font-size:13px;flex-wrap:wrap;gap:10px;}
.px-footer-bottom a:hover{color:var(--px-red);}
.px-back-top{
  position:fixed;bottom:28px;right:28px;width:48px;height:48px;background:var(--px-red);color:var(--px-white);
  border-radius:50%;display:flex;align-items:center;justify-content:center;box-shadow:var(--px-shadow-md);
  z-index:500;opacity:0;visibility:hidden;transform:translateY(15px);transition:var(--px-transition);
}
.px-back-top.is-visible{opacity:1;visibility:visible;transform:translateY(0);}
.px-back-top svg{width:18px;height:18px;transform:rotate(-90deg);}

/* =============================================================
   17. SCROLL REVEAL ANIMATION UTILITIES
============================================================= */
[data-reveal]{opacity:0;transform:translateY(36px);transition:opacity .8s cubic-bezier(.4,0,.2,1), transform .8s cubic-bezier(.4,0,.2,1);}
[data-reveal].is-visible{opacity:1;transform:translateY(0);}
[data-reveal="fade"]{transform:none;}
[data-reveal="left"]{transform:translateX(-46px);}
[data-reveal="left"].is-visible{transform:translateX(0);}
[data-reveal="right"]{transform:translateX(46px);}
[data-reveal="right"].is-visible{transform:translateX(0);}
[data-reveal="zoom"]{transform:scale(.9);}
[data-reveal="zoom"].is-visible{transform:scale(1);}
[data-reveal-delay="1"]{transition-delay:.12s;}
[data-reveal-delay="2"]{transition-delay:.24s;}
[data-reveal-delay="3"]{transition-delay:.36s;}
[data-reveal-delay="4"]{transition-delay:.48s;}
[data-reveal-delay="5"]{transition-delay:.6s;}

/* =============================================================
   18. MISC / UTILITIES
============================================================= */
.px-text-center{text-align:center;}
.px-mx-auto{margin-left:auto;margin-right:auto;}
.px-mb-0{margin-bottom:0 !important;}
.px-relative{position:relative;}
.wp-pagination{display:flex;justify-content:center;gap:8px;margin-top:50px;}
.wp-pagination a, .wp-pagination span{
  width:42px;height:42px;display:flex;align-items:center;justify-content:center;border:1px solid var(--px-grey-300);
  border-radius:50%;font-family:var(--px-font-display);font-weight:700;
}
.wp-pagination .current{background:var(--px-red);border-color:var(--px-red);color:var(--px-white);}
.wp-pagination a:hover{border-color:var(--px-red);color:var(--px-red);}
.alignfull{width:100%;}

/* =============================================================
   19. RESPONSIVE
============================================================= */
@media (max-width:1080px){
  .px-grid--4{grid-template-columns:repeat(2,1fr);}
  .px-grid--3{grid-template-columns:repeat(2,1fr);}
  .px-logo-grid{grid-template-columns:repeat(3,1fr);}
  .px-footer-grid{grid-template-columns:1fr 1fr;}
  .px-process{grid-template-columns:repeat(2,1fr);gap:40px;}
  .px-process-step:not(:last-child)::after{display:none;}
}
@media (max-width:900px){
  .px-nav, .px-header-cta .px-btn{display:none;}
  .px-burger{display:flex;}
  .px-topbar-info span:nth-child(2){display:none;}
  .px-split{grid-template-columns:1fr;gap:40px;}
  .px-split-media::before{display:none;}
  .px-contact-grid{grid-template-columns:1fr;}
  .px-stats .px-container{grid-template-columns:repeat(2,1fr);}
  .px-stat{border-right:none;border-bottom:1px solid rgba(255,255,255,.25);padding-bottom:20px;}
  .px-single-project-gallery{grid-template-columns:1fr;}
  .px-single-project-gallery .main-img{grid-row:auto;}
  .px-single-project-gallery-extra{grid-template-columns:repeat(2,minmax(0,1fr));margin:-34px 0 40px;}
  .px-video-grid{grid-template-columns:1fr;}
}
@media (min-width:681px){
  /* Desktop: keep the original category button list and never show the mobile dropdown. */
  .px-filters .px-filter-btn{display:inline-block;}
  .px-filters .px-project-filter-select{display:none !important;}
}

@media (max-width:680px){
  .px-grid--4,.px-grid--3,.px-grid--2{grid-template-columns:1fr;}
  /* Mobile: show ONLY the dropdown; hide the desktop category button list. */
  .px-filters{display:block;margin-bottom:30px;}
  .px-filters .px-filter-btn{display:none !important;}
  .px-filters .px-project-filter-select{display:block !important;}
  .px-logo-grid{grid-template-columns:repeat(2,1fr);}
  .px-past-projects-section{padding:32px 0 42px;}
  .px-past-projects-grid{gap:5px 7px;padding:0 6px;}
  .px-past-projects-corner--top{right:-82px;transform:rotate(8deg) scale(.82);transform-origin:top right;}
  .px-past-projects-corner--bottom{left:-92px;transform:rotate(-8deg) scale(.82);transform-origin:bottom left;}
  .px-footer-grid{grid-template-columns:1fr;padding-bottom:30px;}
  .px-form{grid-template-columns:1fr;}
  .px-section{padding:64px 0;}
  .px-hero{min-height:82vh;}
  .px-cta-inner{text-align:center;justify-content:center;flex-direction:column;}
  .px-process{grid-template-columns:1fr;}
  .px-pageheader{padding:150px 0 60px;}
}


/* Mobile: keep the Executive Corporate Profile image fully visible and move its details below it. */
@media (max-width:900px){
  .px-section .px-split-media{
    width:100%;
  }
  .px-section .px-split-media img{
    width:100%;
    height:auto;
    display:block;
  }
  .px-section .px-split-media-badge{
    position:relative;
    right:auto;
    bottom:auto;
    width:100%;
    max-width:none;
    margin-top:16px;
    box-sizing:border-box;
  }
}

/* =============================================================
   20. PLATINEX CORPORATE WHITE REDESIGN
   Front page inspired by the supplied corporate capability cover.
============================================================= */
body{background:var(--px-white);color:var(--px-grey-900);}
.px-topbar{background:var(--px-white);color:var(--px-grey-700);border-bottom:1px solid #ececef;}
.px-topbar a{color:var(--px-grey-700);}
.px-topbar-social a{border-color:#d9dade;}
.px-header{background:rgba(255,255,255,.96);border-bottom:1px solid #ececef;box-shadow:0 2px 18px rgba(0,0,0,.05);}
.px-header.is-scrolled{background:rgba(255,255,255,.98);box-shadow:0 4px 22px rgba(0,0,0,.08);}
.px-logo{color:var(--px-black);}
.px-logo-text strong{color:var(--px-black);}
.px-nav a{color:var(--px-black);}
.px-burger span{background:var(--px-black);}
.px-mobile-nav{background:var(--px-white);}
.px-mobile-nav a{color:var(--px-black);border-bottom-color:#ececef;}
.px-mobile-nav .sub-menu a{color:var(--px-grey-700);}
.px-mobile-close{color:var(--px-black);}
body.home .px-topbar{display:none;}

.px-cover-hero{position:relative;min-height:calc(100vh - 82px);overflow:hidden;background:var(--px-white);isolation:isolate;}
.px-cover-content{position:relative;z-index:5;min-height:calc(100vh - 82px);display:flex;align-items:flex-end;padding-top:80px;padding-bottom:86px;}
.px-cover-copy{width:min(520px,48%);padding-bottom:6px;}
.px-cover-established{display:inline-flex;align-items:center;gap:9px;font-family:var(--px-font-display);color:var(--px-grey-700);text-transform:uppercase;letter-spacing:2px;font-size:12px;font-weight:700;margin-bottom:28px;}
.px-cover-established::before{content:"";width:28px;height:3px;background:var(--px-red);}
.px-cover-copy h1{font-size:clamp(52px,7vw,92px);line-height:.84;letter-spacing:-1.5px;margin:0;color:var(--px-black);}
.px-cover-copy h1 span{color:var(--px-red);}
.px-cover-rule{width:180px;height:2px;background:var(--px-red);margin:28px 0 18px;}
.px-cover-company{margin:0 0 4px;color:var(--px-black);font-family:var(--px-font-display);font-size:13px;letter-spacing:1.7px;font-weight:700;}
.px-cover-service{margin:0 0 3px;color:var(--px-red);font-family:var(--px-font-display);font-size:14px;letter-spacing:.8px;font-weight:700;}
.px-cover-sectors{margin:0;color:var(--px-grey-700);font-size:11px;letter-spacing:.4px;}
.px-cover-actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:28px;}
.px-cover-media{position:absolute;z-index:2;top:0;right:0;width:61%;height:100%;overflow:hidden;}
.px-cover-image-wrap{position:absolute;inset:0;clip-path:polygon(17% 0,100% 0,100% 72%,82% 83%,72% 100%,0 100%,0 37%);overflow:hidden;background:#e9eaec;}
.px-cover-image-wrap::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(255,255,255,.05),transparent 30%);pointer-events:none;}
.px-cover-image-wrap img{width:100%;height:100%;object-fit:cover;object-position:center 42%;transform:scale(1.01);display:block;}
.px-cover-red-frame{position:absolute;z-index:2;left:1%;top:3%;width:83%;height:83%;border:12px solid var(--px-red);border-left-width:12px;border-right-width:0;border-bottom-width:0;border-radius:110px 0 0 0;transform:skewX(-12deg);pointer-events:none;}
.px-cover-decor{position:absolute;z-index:3;pointer-events:none;}
.px-cover-decor--top{width:520px;height:30px;top:12px;right:6%;background:var(--px-red);transform:rotate(-31deg);transform-origin:right center;}
.px-cover-decor--bottom{width:560px;height:96px;left:-115px;bottom:30px;background:var(--px-red);border-radius:0 70px 70px 0;transform:rotate(31deg);transform-origin:left center;}
.px-cover-hero::before{content:"";position:absolute;z-index:1;width:520px;height:520px;right:-250px;bottom:-260px;border:1px solid #e7e7e9;border-radius:50%;}
.px-cover-hero::after{content:"";position:absolute;z-index:0;left:-160px;top:-230px;width:430px;height:430px;border-radius:50%;background:#f6f6f7;}

.px-section--dark{background:var(--px-white);color:var(--px-grey-900);border-top:1px solid #ececef;}
.px-section--dark p,.px-section--dark .px-lede{color:var(--px-grey-700);}
.px-section--dark h1,.px-section--dark h2,.px-section--dark h3,.px-section--dark h4{color:var(--px-black);}
.px-pillar{border-color:#e5e5e8 !important;}
.px-pillar h4{color:var(--px-black) !important;}
.px-pillar p{color:var(--px-grey-700) !important;}
.px-pillar-num{color:var(--px-red) !important;}
.px-testimonial{background:var(--px-white);border:1px solid #e5e5e8;box-shadow:var(--px-shadow-sm);}
.px-testimonial p{color:var(--px-grey-700);}
.px-testimonial-author strong{color:var(--px-black);}
.px-testimonial-author span{color:var(--px-red);}

.px-footer{background:var(--px-white);color:var(--px-grey-700);}
.px-footer h4{color:var(--px-black);}
.px-footer p{color:var(--px-grey-700);}
.px-footer-grid{border-bottom-color:#e5e5e8;}
.px-footer-social a{border-color:#d9dade;}
.px-footer-bottom p{color:var(--px-grey-500);}
.px-card{box-shadow:0 4px 18px rgba(0,0,0,.04);}
.px-card--dark{background:var(--px-white);border-color:#e5e5e8;}
.px-card--dark h3,.px-card--dark p{color:var(--px-grey-900);}
.px-card--dark p{color:var(--px-grey-700);}
.px-split-media-badge{background:var(--px-white);color:var(--px-black);border:1px solid #e5e5e8;border-left:4px solid var(--px-red);}

@media (max-width:1080px){
  .px-cover-copy{width:53%;}.px-cover-media{width:58%;}.px-cover-copy h1{font-size:clamp(48px,7vw,76px);}
}
@media (max-width:900px){
  .px-cover-hero{min-height:auto;padding:0 0 58px;}
  .px-cover-content{min-height:auto;display:block;padding-top:62px;padding-bottom:0;}
  .px-cover-copy{width:100%;max-width:600px;padding-bottom:30px;}
  .px-cover-copy h1{font-size:clamp(52px,13vw,76px);}
  .px-cover-media{position:relative;width:100%;height:460px;right:auto;top:auto;margin-top:10px;}
  .px-cover-image-wrap{clip-path:polygon(10% 0,100% 0,100% 88%,85% 100%,0 100%,0 18%);}
  .px-cover-red-frame{left:2%;top:2%;width:78%;height:85%;border-width:9px;border-right-width:0;border-bottom-width:0;border-radius:70px 0 0 0;}
  .px-cover-decor--top{width:360px;height:22px;right:-4%;top:5px;}.px-cover-decor--bottom{width:400px;height:70px;left:-150px;bottom:15px;}
}
@media (max-width:680px){
  .px-header .px-container{padding-top:11px;padding-bottom:11px;}
  .px-logo img{height:42px;}
  .px-cover-content{padding-left:20px;padding-right:20px;padding-top:45px;}
  .px-cover-copy h1{font-size:clamp(46px,15vw,68px);letter-spacing:-1px;}
  .px-cover-established{margin-bottom:20px;font-size:10px;}
  .px-cover-rule{margin:20px 0 14px;width:140px;}
  .px-cover-company{font-size:11px;}.px-cover-service{font-size:12px;}.px-cover-sectors{font-size:10px;line-height:1.5;}
  .px-cover-actions .px-btn{width:100%;justify-content:center;}
  .px-cover-media{height:360px;margin-left:-20px;width:calc(100% + 40px);}
  .px-cover-image-wrap{clip-path:polygon(12% 0,100% 0,100% 86%,83% 100%,0 100%,0 17%);}
  .px-cover-red-frame{left:4%;top:3%;width:78%;height:84%;border-width:7px;border-right-width:0;border-bottom-width:0;border-radius:48px 0 0 0;}
  .px-cover-decor--top{width:260px;height:16px;right:-7%;top:2px;}.px-cover-decor--bottom{width:300px;height:52px;left:-115px;bottom:12px;}
  .px-cover-hero::after{width:300px;height:300px;left:-180px;top:-130px;}
}


/* =============================================================
   21. MOBILE VIEWPORT / OVERFLOW PROTECTION
   Prevent any element, animation or decorative shape from making
   the site wider than the device viewport.
============================================================= */
html,
body{
  width:100%;
  max-width:100%;
  overflow-x:hidden;
  overflow-y:visible;
}

/* Keep grid/flex children from establishing an oversized minimum width. */
.px-container,
.px-grid,
.px-split,
.px-footer-grid,
.px-contact-grid,
.px-process,
.px-logo-grid,
.px-form,
.px-head-row,
.px-cta-inner,
.px-cover-content,
.px-cover-copy,
.px-cover-media{
  min-width:0;
}

.px-container > *,
.px-grid > *,
.px-split > *,
.px-footer-grid > *,
.px-contact-grid > *,
.px-process > *,
.px-logo-grid > *,
.px-form > *,
.px-head-row > *,
.px-cta-inner > *{
  min-width:0;
  max-width:100%;
}

img,
video,
iframe,
svg,
canvas{
  max-width:100%;
}

@media (max-width:680px){
  /* Lock the document to the actual mobile viewport. */
  html,
  body{
    width:100%;
    max-width:100vw;
    overflow-x:hidden !important;
    overflow-y:visible !important;
  }

  .px-container{
    width:100%;
    max-width:100%;
  }

  /* The hero is intentionally full-bleed, but never wider than the viewport. */
  .px-cover-hero{
    width:100%;
    max-width:100vw;
    overflow:hidden;
  }

  .px-cover-content{
    width:100%;
    max-width:100%;
    overflow:hidden;
  }

  .px-cover-copy{
    width:100%;
    max-width:100%;
    overflow-wrap:anywhere;
  }

  .px-cover-copy h1{
    max-width:100%;
    overflow-wrap:normal;
    word-break:normal;
  }

  .px-cover-media{
    width:calc(100% + 40px);
    max-width:none;
    margin-left:-20px;
    margin-right:0;
    overflow:hidden;
  }

  /* Keep animated reveal transforms inside the hero clipping area. */
  .px-cover-media[data-reveal]{
    transform:translateX(0);
  }
  .px-cover-media[data-reveal].is-visible{
    transform:translateX(0);
  }

  /* Decorative elements may be larger than the phone for the design,
     but they are clipped and can never create horizontal page width. */
  .px-cover-decor,
  .px-cover-hero::before,
  .px-cover-hero::after{
    pointer-events:none;
  }

  .px-topbar-info,
  .px-topbar-social,
  .px-nav,
  .px-header-cta,
  .px-footer-bottom{
    min-width:0;
    max-width:100%;
  }

  .px-footer p,
  .px-footer a,
  .px-contact-info-item p,
  .px-card p,
  .px-testimonial p{
    overflow-wrap:anywhere;
  }

  /* Prevent long text, emails and URLs from forcing the page wider. */
  h1,h2,h3,h4,h5,p,a,li,span,strong{
    max-width:100%;
  }
}

/* -------------------------------------------------------------------------
   NEWS ABOUT US — media coverage cards
   ------------------------------------------------------------------------- */
.px-news-about-section{background:#f7f7f5;}
.px-news-about-head{align-items:flex-end;margin-bottom:26px;}
.px-news-about-lede{max-width:720px;margin:12px 0 0;}
.px-news-about-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:22px;}
.px-news-about-card{display:flex;min-width:0;background:#fff;border:1px solid rgba(17,17,17,.10);text-decoration:none;color:inherit;overflow:hidden;box-shadow:0 10px 28px rgba(0,0,0,.06);transition:transform .25s ease,box-shadow .25s ease,border-color .25s ease;}
.px-news-about-card:hover{transform:translateY(-4px);border-color:rgba(181,34,42,.30);box-shadow:0 16px 34px rgba(0,0,0,.10);}
.px-news-about-image{flex:0 0 44%;min-height:230px;background:#e9e9e7;overflow:hidden;}
.px-news-about-image img{display:block;width:100%;height:100%;min-height:230px;object-fit:cover;transition:transform .4s ease;}
.px-news-about-card:hover .px-news-about-image img{transform:scale(1.035);}
.px-news-about-image-placeholder{height:100%;min-height:230px;display:grid;place-items:center;background:linear-gradient(135deg,#e8e8e5,#d7d7d2);color:#8b8b86;}
.px-news-about-image-placeholder svg{width:34px;height:34px;}
.px-news-about-content{display:flex;flex:1;min-width:0;flex-direction:column;justify-content:center;padding:25px 26px;}
.px-news-about-source{display:inline-flex;align-self:flex-start;margin-bottom:10px;font-size:11px;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:var(--px-red);}
.px-news-about-content h3{margin:0;color:#151515;font-size:20px;line-height:1.28;font-weight:800;}
.px-news-about-read{display:inline-flex;align-items:center;gap:8px;margin-top:22px;color:#151515;font-size:13px;font-weight:800;}
.px-news-about-read svg{width:16px;height:16px;transition:transform .2s ease;}
.px-news-about-card:hover .px-news-about-read svg{transform:translateX(4px);}
.px-news-about-more{display:flex;justify-content:center;margin-top:40px;}

@media (max-width:767px){
  .px-news-about-grid{grid-template-columns:1fr;gap:14px;}
  .px-news-about-card{display:block;}
  .px-news-about-image,.px-news-about-image img,.px-news-about-image-placeholder{min-height:205px;height:205px;}
  .px-news-about-content{padding:20px;}
  .px-news-about-content h3{font-size:18px;}
  .px-news-about-read{margin-top:16px;}
}

/* Past Projects lightbox: allow the zoomed image to be dragged/panned. */
.px-past-project-lightbox-stage{touch-action:none !important;overflow:hidden !important;}
.px-past-project-lightbox-stage img{touch-action:none !important;cursor:default;will-change:transform;}
.px-past-project-lightbox-stage img:active{cursor:grabbing;}

/* =============================================================
   HOMEPAGE SPACING (front page only — other templates untouched)
============================================================= */
.home .px-section{padding:64px 0;}
.home .px-head-row{margin-bottom:34px;}
.home .px-home-team-more,
.home .px-projects-more,
.home .px-clients-more,
.home .px-news-about-more{margin-top:26px;}

/* =============================================================
   PREV / NEXT PAGINATION (News, Clients, Past Projects, Our Team,
   Careers, and the Project Category taxonomy archive)
============================================================= */
.px-pagination{display:flex;align-items:center;justify-content:center;gap:20px;margin-top:48px;flex-wrap:wrap;}
.px-pagination-link{display:inline-flex;align-items:center;gap:8px;padding:11px 22px;border-radius:var(--px-radius);border:1px solid var(--px-grey-300);color:var(--px-black);font-weight:600;font-size:14px;text-decoration:none;transition:var(--px-transition);background:var(--px-white);}
.px-pagination-link:not(.is-disabled):hover{background:var(--px-red);border-color:var(--px-red);color:var(--px-white);}
.px-pagination-link.is-disabled{opacity:.4;cursor:default;}
.px-pagination-status{font-size:14px;color:var(--px-grey-700);font-weight:500;}
