/* Recent Projects: cards on /gallery/ and the project showcase pages in /projects/.
   Colors and fonts come from the Elementor kit (red #CE1713, text #525252, Raleway + DM Sans). */
.lx-proj{--lx-red:var(--e-global-color-35552c4,#CE1713);--lx-text:var(--e-global-color-text,#525252);--lx-black:#000;font-family:"DM Sans",sans-serif;color:var(--lx-text);font-size:17px;line-height:26px}
.lx-proj *,.lx-proj *::before,.lx-proj *::after{box-sizing:border-box}
.lx-proj h1,.lx-proj h2,.lx-proj h3{font-family:"Raleway",sans-serif;font-weight:600;color:var(--lx-black);margin:0}
.lx-proj p{margin:0 0 18px}
.lx-proj a{color:var(--lx-red)}
main.site-main.lx-proj{max-width:none;width:100%;margin:0;padding:0}
/* 1280px content, the same width as the site's Elementor sections */
.lx-wrap{max-width:1320px;margin:0 auto;padding:0 20px}
.lx-eyebrow{font-family:"Plus Jakarta Sans",sans-serif;font-size:16px;font-weight:700;line-height:24px;color:var(--lx-red);text-transform:uppercase;letter-spacing:.02em}
.lx-btn{display:inline-flex;align-items:center;gap:6px;padding:12px 24px;border:1px solid var(--lx-red);background:var(--lx-red);color:#fff!important;font-family:"DM Sans",sans-serif;font-size:16px;font-weight:600;line-height:24px;text-transform:uppercase;text-decoration:none;transition:background .3s,color .3s}
.lx-btn:hover,.lx-btn:focus{background:#fff;color:var(--lx-red)!important}
.lx-btn--ghost{background:transparent;border-color:#fff}
.lx-btn--ghost:hover,.lx-btn--ghost:focus{background:#fff;border-color:#fff}

/* Cards (gallery page) */
.lx-projects{padding:90px 0;background:#F7F7F7}
.lx-projects__head{text-align:center;max-width:720px;margin:0 auto 50px}
.lx-projects__head .subheading_{margin-bottom:6px}
.lx-projects__head h2{font-size:52px;line-height:64px;margin-bottom:16px}
.lx-projects__grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:30px;justify-content:center}
.lx-card{display:flex;flex-direction:column;background:#fff;border:1px solid #E5E5E5;text-decoration:none;color:inherit;transition:box-shadow .3s,border-color .3s}
.lx-card:hover,.lx-card:focus-within{border-color:var(--lx-red);box-shadow:0 12px 30px rgba(0,0,0,.08)}
.lx-card__img{display:block;aspect-ratio:4/3;overflow:hidden}
.lx-card__img img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .8s}
.lx-card:hover .lx-card__img img{transform:scale(1.05)}
.lx-card__body{padding:24px 26px 28px;display:flex;flex-direction:column;flex:1}
.lx-card__meta{font-size:14px;line-height:20px;font-weight:600;text-transform:uppercase;color:var(--lx-red);margin-bottom:8px}
.lx-card h3{font-size:24px;line-height:32px;margin-bottom:12px}
.lx-card h3 a{color:var(--lx-black);text-decoration:none}
.lx-card h3 a::after{content:"";position:absolute;inset:0}
.lx-card{position:relative}
.lx-card__desc{font-size:16px;line-height:24px;margin-bottom:18px!important}
/* A lone project shows as a wide featured card until more are added */
.lx-card:only-child{grid-column:1/-1;flex-direction:row}
.lx-card:only-child .lx-card__img{flex:0 0 58%;aspect-ratio:16/10}
.lx-card:only-child .lx-card__body{padding:40px 44px;justify-content:center}
.lx-card:only-child h3{font-size:35px;line-height:44px}
.lx-card:only-child .lx-card__more{margin-top:0}
.lx-card__more{margin-top:auto;font-weight:600;text-transform:uppercase;font-size:15px;color:var(--lx-red)}

/* Featured project (homepage) */
.lx-btn--outline{background:transparent;color:var(--lx-red)!important}
.lx-btn--outline:hover,.lx-btn--outline:focus{background:var(--lx-red);color:#fff!important}
.lx-feat{padding:100px 0;background:#F7F7F7}
.lx-feat__inner{display:grid;grid-template-columns:7fr 5fr;gap:70px;align-items:center}
/* Collage: large main photo, two photos overlapping its bottom edge (white border + shadow, like the before/after) */
.lx-feat__collage{position:relative;aspect-ratio:10/7}
.lx-feat__collage a{position:absolute;display:block;overflow:hidden}
.lx-feat__collage img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .8s}
.lx-feat__collage a:hover img{transform:scale(1.04)}
.lx-feat__tile--1{top:0;right:0;width:86%;aspect-ratio:16/9}
.lx-feat__tile--2,.lx-feat__tile--3{aspect-ratio:16/9;border:6px solid #fff;box-shadow:0 16px 40px rgba(0,0,0,.22);z-index:2}
.lx-feat__tile--2{left:0;bottom:0;width:50%}
.lx-feat__tile--3{right:4%;bottom:5%;width:38%;z-index:3}
.lx-feat__copy .subheading_{justify-content:flex-start}
.lx-feat__meta{display:flex;align-items:center;gap:6px;margin:14px 0 8px!important;font-size:15px;line-height:20px;font-weight:700;text-transform:uppercase;color:var(--lx-red);letter-spacing:.02em}
.lx-feat__meta svg{width:18px;height:18px;fill:var(--lx-red);flex:none}
.lx-feat h2{font-size:45px;line-height:55px;margin-bottom:20px}
.lx-feat .pp-checks{margin:4px 0 32px}
.lx-feat__btns{display:flex;flex-wrap:wrap;gap:14px}

/* Project page (.lx-pp) */
.lx-pp h2{font-size:45px;line-height:55px}
.lx-pp .lx-eyebrow.subheading_{justify-content:flex-start}
.pp-sec{padding:100px 0}
.pp-dark{background:#000 url("/wp-content/uploads/2025/11/Image-1.png") center/cover;color:#D4D4D4}
.pp-dark h2{color:#fff}
.pp-split{display:grid;grid-template-columns:1fr 1fr;gap:70px;align-items:center}
.pp-copy h2{margin:10px 0 22px}
.pp-kicker{display:flex;align-items:center;gap:12px}
.pp-hex{display:inline-grid;place-items:center;width:38px;height:42px;background:var(--lx-red);color:#fff;font:700 15px/1 "Plus Jakarta Sans",sans-serif;clip-path:polygon(50% 0,100% 25%,100% 75%,50% 100%,0 75%,0 25%)}
.pp-dark .pp-hex{background:#fff;color:#000}

/* Red corner triangles, like the photos on the homepage */
.pp-frame{position:relative;display:block}
.pp-frame::before,.pp-frame::after{content:"";position:absolute;width:70px;height:70px;background:var(--lx-red);z-index:2;pointer-events:none}
.pp-frame::before{top:-1px;right:-1px;clip-path:polygon(0 0,100% 0,100% 100%)}
.pp-frame::after{bottom:-1px;left:-1px;clip-path:polygon(0 0,0 100%,100% 100%)}
.pp-frame img,.pp-frame video{display:block;width:100%;height:auto}
a.pp-frame,.pp-mosaic a,.pp-feature__img{overflow:hidden}
a.pp-frame img,.pp-mosaic img,.pp-feature__img img{transition:transform .8s}
a.pp-frame:hover img,.pp-mosaic a:hover img,.pp-feature__img:hover img{transform:scale(1.04)}

/* Hero */
.pp-hero{position:relative;padding:110px 0 190px;background:linear-gradient(180deg,rgba(0,0,0,.55) 0%,rgba(0,0,0,.65) 60%,#000 100%),url("/wp-content/uploads/2026/10/brownsburg-pool-and-pool-house.webp") center 40%/cover no-repeat;color:#E5E5E5;text-align:center}
.pp-hero .subheading_{justify-content:center!important;flex-wrap:wrap;text-align:center}
.pp-hero .lx-crumbs{font-size:15px;color:#bbb;margin-bottom:22px}
.pp-hero .lx-crumbs a{color:#fff;text-decoration:none}
.pp-hero .lx-crumbs a:hover{color:var(--lx-red)}
.pp-hero .lx-crumbs span{margin:0 6px;color:var(--lx-red)}
.pp-hero h1{color:#fff;font-size:60px;line-height:72px;text-transform:uppercase;max-width:1000px;margin:12px auto 20px}
.pp-hero__lead{max-width:760px;margin:0 auto 46px!important;font-size:18px;line-height:28px;color:#E5E5E5}
.pp-specs{list-style:none;margin:0 auto;padding:0;display:grid;grid-template-columns:repeat(4,1fr);gap:22px;max-width:1100px;text-align:left}
.pp-specs li{display:flex;align-items:center;gap:12px;padding:0 0 16px;border-bottom:2px solid var(--lx-red);font-size:15px;line-height:21px;color:#fff;font-weight:500}
.pp-specs small{display:block;font:700 12px/16px "Plus Jakarta Sans",sans-serif;text-transform:uppercase;letter-spacing:.06em;color:#bbb;margin-bottom:2px}
.pp-specs a{color:#fff!important;text-decoration:none}
.pp-specs a:hover{color:var(--lx-red)!important}
.pp-specs__icon{flex:0 0 40px;height:40px;border-radius:50%;background:var(--lx-red);display:grid;place-items:center;box-shadow:0 0 0 4px rgba(206,23,19,.25)}
.pp-specs__icon svg{width:20px;height:20px;fill:#fff}

/* Video, pulled up over the hero */
.pp-tour{background:#000;padding:0 0 100px}
.pp-tour .lx-wrap{margin-top:-130px;position:relative;z-index:2}
.pp-frame--video video{aspect-ratio:16/9;background:#000;box-shadow:0 30px 60px rgba(0,0,0,.5)}

/* 01 intro with before/after collage */
.pp-ba{position:relative;padding:0 0 70px 70px}
.pp-ba__after img{aspect-ratio:4/3;object-fit:cover}
.pp-ba__before{position:absolute;left:0;bottom:0;width:42%;border:6px solid #fff;box-shadow:0 16px 40px rgba(0,0,0,.25);z-index:3;overflow:hidden}
.pp-ba__before img{display:block;width:100%;aspect-ratio:3/4;object-fit:cover}
.pp-tag{position:absolute;top:14px;left:14px;background:var(--lx-red);color:#fff;font:700 13px/18px "DM Sans",sans-serif;text-transform:uppercase;letter-spacing:.06em;padding:5px 12px;z-index:3}
.pp-ba__after .pp-tag{left:auto;right:14px;top:auto;bottom:14px}
.pp-tag--dark{background:#000}

/* 02 master plan */
.pp-plan{background:#F7F7F7}
.pp-plan__head{display:grid;grid-template-columns:5fr 7fr;gap:60px;align-items:end;margin-bottom:50px}
.pp-plan__head h2{margin-top:10px}
.pp-plan__head p{margin:0}
.pp-plan__img{background:#fff;border:1px solid #E5E5E5;padding:24px}
.pp-zoom{position:absolute;right:24px;bottom:24px;z-index:3;background:#000;color:#fff;font-size:14px;line-height:20px;font-weight:600;text-transform:uppercase;padding:8px 14px}

/* 03 pool house */
.pp-split--media-left{grid-template-columns:7fr 5fr}
.pp-house .pp-media img{aspect-ratio:4/3;object-fit:cover}
.pp-checks{list-style:none;margin:26px 0 0;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:14px 20px}
.pp-checks li{position:relative;padding-left:32px;font-weight:600;color:#000;font-size:16px;line-height:22px}
.pp-dark .pp-checks li{color:#fff}
.pp-checks li::before{content:"";position:absolute;left:0;top:-1px;width:22px;height:24px;background:var(--lx-red);clip-path:polygon(50% 0,100% 25%,100% 75%,50% 100%,0 75%,0 25%)}
.pp-checks li::after{content:"";position:absolute;left:7px;top:5px;width:6px;height:10px;border:solid #fff;border-width:0 2px 2px 0;transform:rotate(45deg)}

/* 04 hardscape */
.pp-hardscape .pp-split{grid-template-columns:5fr 7fr}
.pp-stack{position:relative;padding:0 0 40px 0}
.pp-stack__main img{aspect-ratio:4/3;object-fit:cover}
.pp-badge{position:absolute;left:-40px;bottom:0;background:var(--lx-red);color:#fff;padding:24px 30px;z-index:3;text-align:center;box-shadow:0 16px 40px rgba(0,0,0,.2)}
.pp-badge strong{display:block;font:600 34px/40px "Raleway",sans-serif}
.pp-badge span{font-size:15px;line-height:20px;font-weight:600;text-transform:uppercase;letter-spacing:.04em}

/* 05 planting over a full-width photo */
.pp-planting{position:relative;padding:120px 0;overflow:hidden}
.pp-planting__bg{position:absolute;inset:0;background:linear-gradient(90deg,rgba(0,0,0,.55) 0%,rgba(0,0,0,.1) 70%),url("/wp-content/uploads/2026/10/brownsburg-pool-house-lawn-view.webp") center/cover no-repeat}
.pp-planting .lx-wrap{position:relative}
.pp-card{background:#fff;max-width:600px;padding:50px 50px 44px;border-top:5px solid var(--lx-red);box-shadow:0 30px 60px rgba(0,0,0,.25)}
.pp-card h2{margin:10px 0 20px;font-size:40px;line-height:50px}
.pp-chips{list-style:none;margin:8px 0 0;padding:0;display:flex;flex-wrap:wrap;gap:8px}
.pp-chips li{border:1px solid var(--lx-red);color:var(--lx-red);font-size:13px;line-height:18px;font-weight:600;padding:6px 12px;text-transform:uppercase;letter-spacing:.03em}

/* 06/07 drainage + lighting */
.pp-details__grid{display:grid;grid-template-columns:1fr 1fr;gap:30px}
.pp-feature{background:#111;border:1px solid #2a2a2a;display:flex;flex-direction:column}
.pp-feature__img{display:block;aspect-ratio:16/9}
.pp-feature__img img{width:100%;height:100%;object-fit:cover;display:block}
.pp-feature__body{position:relative;padding:56px 40px 34px}
.pp-feature h2{font-size:32px;line-height:42px;margin:10px 0 16px}
.pp-ring{position:absolute;top:-42px;right:36px;width:84px;height:84px;border-radius:50%;background:var(--lx-red);display:grid;place-items:center;outline:2px dashed var(--lx-red);outline-offset:6px}
.pp-ring svg{width:36px;height:36px;fill:#fff}

/* Result statement */
.pp-result{position:relative;padding:130px 0;text-align:center;background:linear-gradient(rgba(0,0,0,.7),rgba(0,0,0,.7)),url("/wp-content/uploads/2026/10/brownsburg-aerial-view.webp") center/cover no-repeat}
.pp-result .subheading_{justify-content:center!important}
.pp-result .pp-result__text{margin:20px auto 0;max-width:920px;font:500 34px/48px "Raleway",sans-serif;color:#fff}

/* Photo mosaic */
.pp-gallery__head{text-align:center;margin-bottom:40px}
.pp-gallery__head .subheading_{justify-content:center!important}
.pp-gallery__head h2{margin-top:6px}
.pp-mosaic{display:grid;grid-template-columns:repeat(3,1fr);grid-auto-rows:240px;gap:10px}
.pp-mosaic a{display:block;position:relative;border:1px solid var(--lx-red)}
.pp-mosaic img{width:100%;height:100%;object-fit:cover;display:block}
.pp-mosaic__big{grid-column:span 2;grid-row:span 2}
.pp-mosaic a::after{content:"";position:absolute;inset:0;background:rgba(0,0,0,0);transition:background .5s}
.pp-mosaic a:hover::after{background:rgba(0,0,0,.25)}

/* CTA */
.pp-cta{background:linear-gradient(rgba(0,0,0,.82),rgba(0,0,0,.82)),url("/wp-content/uploads/2025/11/Request-A-Quote-Background-Image-scaled.webp") center/cover no-repeat;color:#E5E5E5;padding:110px 0;text-align:center;position:relative;overflow:hidden}
.pp-cta::before,.pp-cta::after{content:"";position:absolute;width:160px;height:160px;background:var(--lx-red)}
.pp-cta::before{top:0;left:0;clip-path:polygon(0 0,100% 0,0 100%)}
.pp-cta::after{bottom:0;right:0;clip-path:polygon(100% 0,100% 100%,0 100%)}
.pp-cta .subheading_{justify-content:center!important}
.pp-cta h2{color:#fff;font-size:52px;line-height:64px;max-width:800px;margin:6px auto 20px}
.pp-cta p{max-width:720px;margin:0 auto 16px}
.lx-cta__btns{display:flex;flex-wrap:wrap;gap:14px;justify-content:center;margin-top:30px}

/* Fade-up on scroll (only when JS is running) */
.pp-anim .pp-reveal{opacity:0;transform:translateY(30px);transition:opacity .8s ease,transform .8s ease}
.pp-anim .pp-reveal.is-in{opacity:1;transform:none}
@media(prefers-reduced-motion:reduce){.pp-anim .pp-reveal{opacity:1;transform:none;transition:none}a.pp-frame img,.pp-mosaic img{transition:none}}

@media(max-width:1024px){
  .lx-feat{padding:80px 0}
  .lx-feat__inner{grid-template-columns:1fr;gap:50px}
  .lx-feat h2{font-size:35px;line-height:44px}
  .lx-feat__collage{max-width:760px}
  .lx-projects__head h2,.pp-cta h2{font-size:45px;line-height:55px}
  .lx-card:only-child{flex-direction:column}
  .lx-card:only-child .lx-card__img{flex:none;aspect-ratio:4/3}
  .lx-card:only-child .lx-card__body{padding:24px 26px 28px}
  .lx-card:only-child h3{font-size:24px;line-height:32px}
  .lx-pp h2{font-size:35px;line-height:44px}
  .pp-sec{padding:80px 0}
  .pp-hero h1{font-size:44px;line-height:54px}
  .pp-specs{grid-template-columns:1fr 1fr}
  .pp-split,.pp-split--media-left,.pp-hardscape .pp-split,.pp-plan__head{grid-template-columns:1fr;gap:44px}
  .pp-plan__head{gap:20px}
  .pp-badge{left:20px}
  .pp-result .pp-result__text{font-size:28px;line-height:40px}
}
@media(max-width:767px){
  .lx-feat{padding:64px 0}
  .lx-feat__tile--2,.lx-feat__tile--3{border-width:4px}
  .lx-feat h2{font-size:28px;line-height:36px}
  .lx-feat__btns .lx-btn{flex:1 1 100%;justify-content:center}
  .lx-proj{font-size:16px;line-height:24px}
  .lx-projects{padding:70px 0}
  .lx-projects__head h2,.pp-cta h2,.lx-pp h2,.pp-card h2{font-size:28px;line-height:36px}
  .lx-projects__grid{grid-template-columns:1fr}
  .pp-sec{padding:64px 0}
  .pp-hero{padding:60px 0 120px}
  .pp-hero h1{font-size:30px;line-height:38px}
  .pp-hero__lead{font-size:16px;line-height:24px;margin-bottom:32px!important}
  .pp-specs{grid-template-columns:1fr;gap:14px}
  .pp-tour{padding-bottom:64px}
  .pp-tour .lx-wrap{margin-top:-80px}
  .pp-frame::before,.pp-frame::after{width:40px;height:40px}
  .pp-ba{padding:0 0 50px 30px}
  .pp-ba__before{width:46%;border-width:4px}
  .pp-plan__img{padding:10px}
  .pp-zoom{right:10px;bottom:10px;font-size:12px;padding:6px 10px}
  .pp-checks{grid-template-columns:1fr}
  .pp-badge{left:12px;padding:16px 20px}
  .pp-badge strong{font-size:26px;line-height:32px}
  .pp-planting{padding:200px 0 40px}
  .pp-planting__bg{bottom:auto;height:280px;background:url("/wp-content/uploads/2026/10/brownsburg-pool-house-lawn-view-800.webp") center/cover no-repeat}
  .pp-card{padding:32px 24px 28px}
  .pp-details__grid{grid-template-columns:1fr}
  .pp-feature__body{padding:52px 24px 28px}
  .pp-ring{width:68px;height:68px;top:-34px;right:24px}
  .pp-ring svg{width:30px;height:30px}
  .pp-feature h2{font-size:26px;line-height:34px}
  .pp-result{padding:80px 0}
  .pp-result .pp-result__text{font-size:22px;line-height:32px}
  .pp-mosaic{grid-template-columns:1fr 1fr;grid-auto-rows:150px}
  .pp-mosaic__big{grid-column:span 2;grid-row:span 2}
  .pp-cta{padding:80px 0}
  .pp-cta::before,.pp-cta::after{width:70px;height:70px}
}
