/* =========================================================
   LANGDON AB MOVERS
   UNIQUE PREMIUM DESIGN
   CLASS PREFIX: langdon-
   PRIMARY COLOR: #C71111
========================================================= */

.langdon-page{
  --langdon-red:#C71111;
  --langdon-red-dark:#990d0d;
  --langdon-red-soft:#fff2f2;
  --langdon-dark:#15171c;
  --langdon-text:#252b35;
  --langdon-muted:#6b7280;
  --langdon-light:#f5f6f8;
  --langdon-white:#fff;
  --langdon-border:#e4e6ea;

  font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  color:var(--langdon-text);
  background:#fff;
  overflow:hidden;
}

.langdon-page *,
.langdon-page *::before,
.langdon-page *::after{
  box-sizing:border-box;
}

.langdon-container{
  width:min(1180px,92%);
  margin:0 auto;
}


/* =========================================================
   HERO
========================================================= */

.langdon-hero{
  position:relative;
  min-height:680px;

  display:flex;
  align-items:center;

  background:#111;
  overflow:hidden;
}

.langdon-hero-image{
  position:absolute;
  inset:0;

  background:
    linear-gradient(
      90deg,
      rgba(15,15,18,.96) 0%,
      rgba(15,15,18,.86) 38%,
      rgba(15,15,18,.30) 75%,
      rgba(15,15,18,.12) 100%
    ),
    url("/images/locations/movers-in-langdon-ab/parcel-courier-1024x574.jpg")
    center/cover no-repeat;
}

.langdon-hero-inner{
  position:relative;
  z-index:2;

  width:min(1180px,92%);
  margin:0 auto;

  padding:100px 0;
}

.langdon-hero-content{
  max-width:760px;
}

.langdon-hero-label{
  display:inline-flex;
  align-items:center;
  gap:10px;

  margin-bottom:25px;

  color:#fff;

  font-size:12px;
  font-weight:850;
  letter-spacing:2.4px;
  text-transform:uppercase;
}

.langdon-hero-label::before{
  content:"";

  width:42px;
  height:2px;

  background:var(--langdon-red);
}

.langdon-hero h1{
  margin:0 0 25px;

  color:#fff;

  font-size:clamp(44px,6vw,78px);
  line-height:.99;
  letter-spacing:-3.5px;
  font-weight:850;
}

.langdon-hero-description{
  max-width:670px;

  margin:0 0 35px;

  color:rgba(255,255,255,.84);

  font-size:17px;
  line-height:1.85;
}

.langdon-hero-actions{
  display:flex;
  flex-wrap:wrap;
  gap:12px;
}

.langdon-button{
  min-height:52px;

  display:inline-flex;
  align-items:center;
  justify-content:center;

  padding:0 26px;

  text-decoration:none!important;

  font-size:14px;
  font-weight:800;

  transition:.3s ease;
}

.langdon-button-red{
  background:var(--langdon-red);
  color:#fff!important;
}

.langdon-button-red:hover{
  background:#a80f0f;
  transform:translateY(-2px);
}

.langdon-button-white{
  background:#fff;
  color:var(--langdon-dark)!important;
}

.langdon-button-white:hover{
  background:#eee;
  transform:translateY(-2px);
}

.langdon-hero-stamp{
  position:absolute;
  right:7%;
  bottom:55px;

  width:145px;
  height:145px;

  display:flex;
  align-items:center;
  justify-content:center;

  border:1px solid rgba(255,255,255,.4);
  border-radius:50%;

  color:#fff;

  font-size:12px;
  line-height:1.5;
  text-align:center;
  font-weight:800;
  text-transform:uppercase;
  letter-spacing:1px;
}

.langdon-hero-stamp::after{
  content:"";

  position:absolute;

  width:9px;
  height:9px;

  background:var(--langdon-red);

  border-radius:50%;
}


/* =========================================================
   INTRODUCTION
========================================================= */

.langdon-introduction{
  padding:105px 0;

  background:#fff;
}

.langdon-intro-layout{
  display:grid;
  grid-template-columns:1fr 1.3fr;

  gap:80px;
}

.langdon-intro-label{
  color:var(--langdon-red);

  font-size:12px;
  font-weight:850;
  letter-spacing:2px;
  text-transform:uppercase;
}

.langdon-intro-title{
  margin:15px 0 0;

  color:var(--langdon-dark);

  font-size:clamp(35px,4vw,56px);
  line-height:1.05;
  letter-spacing:-2px;
}

.langdon-intro-copy p{
  margin:0 0 20px;

  color:var(--langdon-muted);

  font-size:16px;
  line-height:1.9;
}

.langdon-intro-copy p:last-child{
  margin-bottom:0;
}

.langdon-intro-location{
  margin-top:35px;
  padding:22px 25px;

  border-left:4px solid var(--langdon-red);

  background:var(--langdon-red-soft);

  color:var(--langdon-dark);

  font-size:14px;
  line-height:1.7;
  font-weight:650;
}


/* =========================================================
   SERVICES - UNIQUE OFFSET DESIGN
========================================================= */

.langdon-services{
  padding:100px 0;

  background:var(--langdon-light);
}

.langdon-services-header{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;

  gap:50px;

  margin-bottom:50px;
}

.langdon-services-heading{
  max-width:650px;
}

.langdon-services-label{
  margin-bottom:12px;

  color:var(--langdon-red);

  font-size:12px;
  font-weight:850;
  letter-spacing:2px;
  text-transform:uppercase;
}

.langdon-services-heading h2{
  margin:0;

  color:var(--langdon-dark);

  font-size:clamp(37px,4vw,56px);
  line-height:1.04;
  letter-spacing:-2px;
}

.langdon-services-intro{
  max-width:390px;

  margin:0;

  color:var(--langdon-muted);

  font-size:15px;
  line-height:1.8;
}

.langdon-services-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);

  gap:16px;
}

.langdon-service{
  position:relative;

  min-height:235px;

  padding:28px;

  background:#fff;

  border:1px solid var(--langdon-border);

  overflow:hidden;

  transition:.35s ease;
}

.langdon-service:nth-child(2),
.langdon-service:nth-child(5){
  transform:translateY(25px);
}

.langdon-service:hover{
  background:var(--langdon-red);

  border-color:var(--langdon-red);

  transform:translateY(-7px);

  box-shadow:0 20px 45px rgba(199,17,17,.18);
}

.langdon-service:nth-child(2):hover,
.langdon-service:nth-child(5):hover{
  transform:translateY(18px);
}

.langdon-service-number{
  display:block;

  margin-bottom:55px;

  color:var(--langdon-red);

  font-size:11px;
  font-weight:900;
  letter-spacing:1.8px;
}

.langdon-service:hover .langdon-service-number{
  color:#fff;
}

.langdon-service h3{
  max-width:210px;

  margin:0;

  color:var(--langdon-dark);

  font-size:20px;
  line-height:1.35;
}

.langdon-service:hover h3{
  color:#fff;
}

.langdon-service-arrow{
  position:absolute;

  right:23px;
  bottom:20px;

  color:#d5d9df;

  font-size:26px;
  font-weight:300;

  transition:.3s ease;
}

.langdon-service:hover .langdon-service-arrow{
  color:#fff;
  transform:translate(4px,-4px);
}


/* =========================================================
   QUOTE STRIP
========================================================= */

.langdon-quote-strip{
  position:relative;

  padding:65px 0;

  background:var(--langdon-red);

  overflow:hidden;
}

.langdon-quote-strip::after{
  content:"";

  position:absolute;

  right:-100px;
  top:-160px;

  width:400px;
  height:400px;

  border:65px solid rgba(255,255,255,.07);
  border-radius:50%;
}

.langdon-quote-inner{
  position:relative;
  z-index:2;

  display:flex;
  align-items:center;
  justify-content:space-between;

  gap:40px;
}

.langdon-quote-inner h2{
  margin:0 0 9px;

  color:#fff;

  font-size:clamp(28px,3vw,40px);
  line-height:1.1;
}

.langdon-quote-inner p{
  max-width:650px;

  margin:0;

  color:rgba(255,255,255,.87);

  font-size:14px;
  line-height:1.75;
}


/* =========================================================
   WHY CHOOSE US
========================================================= */

.langdon-benefits{
  padding:110px 0;

  background:#fff;
}

.langdon-benefits-layout{
  display:grid;
  grid-template-columns:.9fr 1.1fr;

  gap:80px;

  align-items:center;
}

.langdon-benefits-image{
  min-height:590px;

  position:relative;

  background:
    url("/images/locations/movers-in-langdon-ab/portrait-movers-holding-box-smiling-isolated-white-backgro-1024x713.jpg")
    center/cover no-repeat;
}

.langdon-benefits-image::before{
  content:"";

  position:absolute;

  left:-20px;
  top:35px;

  width:100px;
  height:100px;

  border-top:14px solid var(--langdon-red);
  border-left:14px solid var(--langdon-red);
}

.langdon-benefits-image::after{
  content:"WHY";

  position:absolute;

  right:-20px;
  bottom:35px;

  width:95px;
  height:95px;

  display:flex;
  align-items:center;
  justify-content:center;

  background:var(--langdon-red);

  color:#fff;

  font-size:14px;
  font-weight:900;
  letter-spacing:1px;
}

.langdon-benefits-content{
  padding-right:15px;
}

.langdon-benefits-label{
  margin-bottom:12px;

  color:var(--langdon-red);

  font-size:12px;
  font-weight:850;
  letter-spacing:2px;
  text-transform:uppercase;
}

.langdon-benefits-content h2{
  margin:0 0 20px;

  color:var(--langdon-dark);

  font-size:clamp(36px,4vw,55px);
  line-height:1.05;
  letter-spacing:-2px;
}

.langdon-benefits-content > p{
  margin:0 0 30px;

  color:var(--langdon-muted);

  font-size:16px;
  line-height:1.85;
}

.langdon-benefit-list{
  margin:0;
  padding:0;

  list-style:none;

  border-top:1px solid var(--langdon-border);
}

.langdon-benefit-list li{
  display:flex;
  align-items:center;

  gap:18px;

  padding:19px 0;

  border-bottom:1px solid var(--langdon-border);

  color:var(--langdon-dark);

  font-size:15px;
  font-weight:700;
}

.langdon-benefit-icon{
  width:32px;
  height:32px;

  flex:0 0 32px;

  display:flex;
  align-items:center;
  justify-content:center;

  background:var(--langdon-red-soft);

  color:var(--langdon-red);

  border-radius:50%;

  font-size:13px;
  font-weight:900;
}


/* =========================================================
   RESIDENTIAL / COMMERCIAL SECTION
========================================================= */

.langdon-relocation{
  padding:100px 0;

  background:var(--langdon-dark);
}

.langdon-relocation-grid{
  display:grid;
  grid-template-columns:1.1fr .9fr;

  gap:70px;

  align-items:center;
}

.langdon-relocation-content{
  order:1;
}

.langdon-relocation-image{
  order:2;

  min-height:530px;

  background:
    url("/images/locations/movers-in-langdon-ab/portrait-movers-holding-box-smiling-isolated-white-backgro-1024x713.jpg")
    center/cover no-repeat;
}

/* Different crop so the second image section feels distinct */
.langdon-relocation-image{
  background-position:center 35%;
  filter:saturate(.9);
}

.langdon-relocation-label{
  margin-bottom:13px;

  color:#ff6b6b;

  font-size:12px;
  font-weight:850;
  letter-spacing:2px;
  text-transform:uppercase;
}

.langdon-relocation-content h2{
  margin:0 0 25px;

  color:#fff;

  font-size:clamp(36px,4vw,55px);
  line-height:1.05;
  letter-spacing:-2px;
}

.langdon-relocation-content p{
  margin:0 0 21px;

  color:rgba(255,255,255,.68);

  font-size:16px;
  line-height:1.9;
}

.langdon-relocation-highlight{
  margin-top:30px;
  padding:24px;

  border:1px solid rgba(255,255,255,.1);

  border-left:3px solid var(--langdon-red);

  background:rgba(255,255,255,.04);

  color:rgba(255,255,255,.82);

  font-size:14px;
  line-height:1.75;
}


/* =========================================================
   BOOK YOUR MOVE
========================================================= */

.langdon-booking{
  padding:80px 0;

  background:var(--langdon-red-soft);
}

.langdon-booking-box{
  display:grid;
  grid-template-columns:1fr auto;

  align-items:center;

  gap:40px;

  padding:48px 55px;

  background:#fff;

  border:1px solid #f1d6d6;

  box-shadow:0 18px 45px rgba(0,0,0,.05);
}

.langdon-booking-box h2{
  margin:0 0 10px;

  color:var(--langdon-dark);

  font-size:clamp(30px,3vw,42px);
  line-height:1.1;
}

.langdon-booking-box p{
  margin:0;

  color:var(--langdon-muted);

  font-size:15px;
  line-height:1.75;
}


/* =========================================================
   PROJECT GALLERY
========================================================= */

.langdon-projects{
  padding:110px 0;

  background:#fff;
}

.langdon-project-heading{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;

  gap:35px;

  margin-bottom:38px;
}

.langdon-project-heading h2{
  max-width:700px;

  margin:0;

  color:var(--langdon-dark);

  font-size:clamp(38px,4.5vw,60px);
  line-height:1.02;
  letter-spacing:-2.3px;
}

.langdon-project-label{
  margin-bottom:13px;

  color:var(--langdon-red);

  font-size:12px;
  font-weight:850;
  letter-spacing:2px;
  text-transform:uppercase;
}

.langdon-slider-controls{
  display:flex;
  gap:8px;
}

.langdon-slider-button{
  width:48px;
  height:48px;

  border:1px solid #dfe2e7;

  background:#fff;

  color:var(--langdon-red);

  cursor:pointer;

  font-size:19px;

  transition:.3s ease;
}

.langdon-slider-button:hover{
  background:var(--langdon-red);
  border-color:var(--langdon-red);
  color:#fff;
}

.langdon-slider-window{
  overflow:hidden;
}

.langdon-slider-track{
  display:flex;

  transition:transform .7s cubic-bezier(.22,.61,.36,1);
}

.langdon-project-slide{
  min-width:100%;
  flex:0 0 100%;
}

.langdon-project-slide img{
  display:block;

  width:100%;
  height:570px;

  object-fit:cover;
}

.langdon-project-meta{
  display:flex;
  align-items:center;
  justify-content:space-between;

  padding-top:16px;
}

.langdon-project-meta strong{
  color:var(--langdon-dark);

  font-size:14px;
}

.langdon-project-meta span{
  color:var(--langdon-muted);

  font-size:12px;
}

.langdon-slider-dots{
  display:flex;
  justify-content:center;

  gap:8px;

  margin-top:25px;
}

.langdon-slider-dot{
  width:9px;
  height:9px;

  padding:0;

  border:0;
  border-radius:50%;

  background:#d8dce2;

  cursor:pointer;

  transition:.3s ease;
}

.langdon-slider-dot.active{
  width:28px;

  border-radius:10px;

  background:var(--langdon-red);
}


/* =========================================================
   FINAL CTA
========================================================= */

.langdon-final{
  position:relative;

  padding:115px 0;

  background:
    linear-gradient(
      135deg,
      #C71111 0%,
      #980b0b 100%
    );

  text-align:center;

  overflow:hidden;
}

.langdon-final::before{
  content:"";

  position:absolute;

  left:-180px;
  bottom:-230px;

  width:500px;
  height:500px;

  border:70px solid rgba(255,255,255,.055);

  border-radius:50%;
}

.langdon-final::after{
  content:"";

  position:absolute;

  right:-160px;
  top:-190px;

  width:430px;
  height:430px;

  border:65px solid rgba(255,255,255,.055);

  border-radius:50%;
}

.langdon-final-content{
  position:relative;
  z-index:2;
}

.langdon-final h2{
  max-width:850px;

  margin:0 auto 20px;

  color:#fff;

  font-size:clamp(40px,5vw,65px);
  line-height:1.03;
  letter-spacing:-2.7px;
}

.langdon-final p{
  max-width:650px;

  margin:0 auto 32px;

  color:rgba(255,255,255,.88);

  font-size:17px;
  line-height:1.8;
}


/* =========================================================
   RESPONSIVE
========================================================= */

@media(max-width:1000px){

  .langdon-services-grid{
    grid-template-columns:repeat(2,1fr);
  }

  .langdon-benefits-layout,
  .langdon-relocation-grid{
    grid-template-columns:1fr;

    gap:50px;
  }

  .langdon-relocation-content{
    order:1;
  }

  .langdon-relocation-image{
    order:2;

    min-height:420px;
  }

}


@media(max-width:700px){

  .langdon-hero{
    min-height:650px;
  }

  .langdon-hero-inner{
    padding:90px 0;
  }

  .langdon-hero h1{
    font-size:44px;
    letter-spacing:-1.8px;
  }

  .langdon-hero-description{
    font-size:16px;
  }

  .langdon-hero-stamp{
    display:none;
  }

  .langdon-hero-actions{
    flex-direction:column;
  }

  .langdon-button{
    width:100%;
  }

  .langdon-introduction,
  .langdon-services,
  .langdon-benefits,
  .langdon-relocation,
  .langdon-projects{
    padding:75px 0;
  }

  .langdon-intro-layout{
    grid-template-columns:1fr;

    gap:30px;
  }

  .langdon-services-header{
    align-items:flex-start;
    flex-direction:column;

    gap:20px;
  }

  .langdon-services-grid{
    grid-template-columns:1fr;
  }

  .langdon-service:nth-child(2),
  .langdon-service:nth-child(5){
    transform:none;
  }

  .langdon-service:nth-child(2):hover,
  .langdon-service:nth-child(5):hover{
    transform:translateY(-7px);
  }

  .langdon-benefits-image{
    min-height:400px;
  }

  .langdon-quote-inner{
    align-items:flex-start;
    flex-direction:column;
  }

  .langdon-relocation-image{
    min-height:350px;
  }

  .langdon-booking{
    padding:55px 0;
  }

  .langdon-booking-box{
    grid-template-columns:1fr;

    padding:35px 25px;
  }

  .langdon-project-heading{
    align-items:flex-start;
    flex-direction:column;
  }

  .langdon-project-slide img{
    height:390px;
  }

  .langdon-final{
    padding:80px 0;
  }

  .langdon-final h2{
    font-size:43px;
  }

}


@media(max-width:480px){

  .langdon-container{
    width:92%;
  }

  .langdon-hero h1{
    font-size:38px;
  }

  .langdon-intro-title,
  .langdon-services-heading h2,
  .langdon-benefits-content h2,
  .langdon-relocation-content h2{
    font-size:38px;
  }

  .langdon-benefits-image{
    min-height:330px;
  }

  .langdon-project-slide img{
    height:300px;
  }

  .langdon-slider-button{
    width:43px;
    height:43px;
  }

  .langdon-final h2{
    font-size:38px;
  }

}
