@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&display=swap');

@font-face{
  font-family:"Area51 Built Titling";
  src:url("https://area51asbestos.com.au/wp-content/uploads/2026/09/built-titling-sb.ttf") format("truetype");
  font-weight:600;
  font-style:normal;
  font-display:swap;
}

.area51-sp,
.area51-sp *{box-sizing:border-box}

.area51-sp{
  --area51-green:#39B54A;
  --area51-green-dark:#2D963B;
  --area51-lime:#A8D94F;
  --area51-black:#0B0D0C;
  --area51-charcoal:#151916;
  --area51-panel:#111612;
  --area51-white:#FFFFFF;
  --area51-paper:#F3F5F1;
  --area51-concrete:#ECEFEA;
  --area51-copy:#646B65;
  --area51-border:#D2D7D1;

  width:100%;
  margin:0;
  padding:0;
  overflow:hidden;
  background:var(--area51-paper);
  color:var(--area51-black);
  font-family:"Inter",Arial,sans-serif;
}

.area51-sp a{color:inherit;text-decoration:none}
.area51-sp img{max-width:100%}
.area51-sp button{font:inherit}
.area51-sp-inner{width:min(1400px,calc(100% - 80px));margin:0 auto}

.area51-sp-eyebrow{
  display:flex;
  align-items:center;
  gap:11px;
  margin-bottom:14px;
  font-size:8px;
  font-weight:800;
  line-height:1;
  letter-spacing:.17em;
  text-transform:uppercase;
  color:#788079;
}
.area51-sp-eyebrow:before{content:"";width:27px;height:3px;background:var(--area51-green);flex:0 0 27px}
.area51-sp-eyebrow--light{color:rgba(255,255,255,.48)}

.area51-sp-heading{
  margin:0;
  font-family:"Area51 Built Titling",Impact,sans-serif;
  font-size:clamp(60px,5.8vw,94px);
  font-weight:600;
  line-height:.84;
  text-transform:uppercase;
  color:var(--area51-black);
}
.area51-sp-heading>span{display:block}
.area51-sp-heading--light{color:#fff}
.area51-sp-accent{color:var(--area51-green)}

/* =========================================================
   HERO
========================================================= */
.area51-sp-hero{
  min-height:690px;
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(420px,.92fr);
  background:var(--area51-black);
  color:#fff;
}
.area51-sp-hero__content{position:relative;display:flex;align-items:stretch;overflow:hidden}
.area51-sp-hero__content:before{
  content:"51";
  position:absolute;
  left:-18px;
  bottom:-82px;
  font-family:"Area51 Built Titling",Impact,sans-serif;
  font-size:330px;
  line-height:1;
  color:rgba(255,255,255,.025);
  pointer-events:none;
}
.area51-sp-hero__content:after{
  content:"";
  position:absolute;
  right:0;
  top:0;
  bottom:0;
  width:4px;
  background:var(--area51-green);
}
.area51-sp-hero__content-inner{
  position:relative;
  z-index:2;
  width:min(700px,calc(100% - 80px));
  margin:auto;
  padding:75px 0 70px;
}
.area51-sp-breadcrumb{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin-bottom:45px;font-size:8px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:rgba(255,255,255,.35)}
.area51-sp-breadcrumb a:hover{color:#fff}
.area51-sp-breadcrumb strong{font-weight:700;color:var(--area51-green)}
.area51-sp-kicker{display:flex;flex-wrap:wrap;gap:12px 22px;margin-bottom:20px;font-size:8px;font-weight:800;letter-spacing:.17em;text-transform:uppercase;color:rgba(255,255,255,.48)}
.area51-sp-kicker span:first-child{color:var(--area51-green)}
.area51-sp-hero__title{margin:0;max-width:670px;font-family:"Area51 Built Titling",Impact,sans-serif;font-size:clamp(76px,7vw,118px);font-weight:600;line-height:.78;text-transform:uppercase;color:#fff}
.area51-sp-hero__title>span{display:block}
.area51-sp-hero__summary{max-width:580px;margin:28px 0 0;font-size:15px;line-height:1.72;color:rgba(255,255,255,.61)}
.area51-sp-hero__actions{display:flex;flex-wrap:wrap;gap:10px 18px;align-items:center;margin-top:33px}

.area51-sp-button{
  appearance:none;
  min-width:245px;
  min-height:58px;
  padding:0 20px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:25px;
  border-radius:0!important;
  font-family:"Area51 Built Titling",Impact,sans-serif;
  font-size:18px;
  font-weight:600;
  line-height:1;
  text-transform:uppercase;
  cursor:pointer;
  outline:none!important;
  box-shadow:none!important;
  transition:background .22s ease,border-color .22s ease,color .22s ease,transform .22s ease;
}
.area51-sp-button__icon{display:block;width:19px;height:19px;flex:0 0 19px;transition:transform .22s ease}
.area51-sp-button--green{background:var(--area51-green)!important;border:1px solid var(--area51-green)!important;color:#fff!important}
.area51-sp-button--green:hover{background:#fff!important;border-color:#fff!important;color:var(--area51-black)!important;transform:translateY(-2px)}
.area51-sp-button--dark{background:var(--area51-black)!important;border:1px solid var(--area51-black)!important;color:#fff!important}
.area51-sp-button--dark:hover{background:#fff!important;border-color:#fff!important;color:var(--area51-black)!important;transform:translateY(-2px)}
.area51-sp-button:hover .area51-sp-button__icon{transform:translateX(4px)}

.area51-sp-phone{min-height:56px;display:flex;align-items:center;gap:10px;padding:0 5px;font-family:"Area51 Built Titling",Impact,sans-serif;font-size:16px;text-transform:uppercase;color:#fff!important}
.area51-sp-phone svg{width:18px;height:18px;color:var(--area51-green)}
.area51-sp-phone:hover span{color:var(--area51-green)}

.area51-sp-hero__media{position:relative;min-height:690px;overflow:hidden;background:#171B18}
.area51-sp-hero__media:before{content:"";position:absolute;z-index:2;inset:0;background:linear-gradient(to top,rgba(5,7,5,.42),transparent 48%);pointer-events:none}
.area51-sp-hero__media img{display:block;width:100%;height:100%;object-fit:cover;object-position:var(--area51-sp-hero-pos);filter:saturate(.92) contrast(1.02)}
.area51-sp-hero__image-tag{position:absolute;z-index:4;right:22px;bottom:22px;display:flex;align-items:center;gap:12px;padding:10px 12px;background:rgba(11,13,12,.9);border-left:3px solid var(--area51-green)}
.area51-sp-hero__image-tag span{font-family:"Area51 Built Titling",Impact,sans-serif;font-size:22px;color:var(--area51-green)}
.area51-sp-hero__image-tag strong{font-size:7px;letter-spacing:.13em;text-transform:uppercase;color:rgba(255,255,255,.65)}

/* =========================================================
   OVERVIEW
========================================================= */
.area51-sp-overview{position:relative;padding:100px 0 104px;background:linear-gradient(180deg,#F7F8F5 0%,#EFF1ED 100%)}
.area51-sp-overview:before{content:"";position:absolute;inset:0;pointer-events:none;opacity:.045;background-image:linear-gradient(rgba(57,181,74,.2) 1px,transparent 1px),linear-gradient(90deg,rgba(57,181,74,.2) 1px,transparent 1px);background-size:72px 72px}
.area51-sp-overview__grid{position:relative;z-index:2;display:grid;grid-template-columns:1fr .88fr;gap:95px;align-items:start}
.area51-sp-overview__copy{max-width:600px;margin-left:auto;padding-top:8px}
.area51-sp-overview__copy p{margin:0 0 20px;font-size:15px;line-height:1.78;color:var(--area51-copy)}
.area51-sp-overview__copy p:last-of-type{margin-bottom:0}
.area51-sp-overview__note{display:flex;align-items:center;gap:10px;margin-top:27px;font-size:8px;font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:#6E756F}
.area51-sp-overview__note span{width:8px;height:8px;background:var(--area51-green)}

/* =========================================================
   APPLICATIONS
========================================================= */
.area51-sp-applications{padding:84px 0 88px;background:var(--area51-green);color:#fff}
.area51-sp-applications__header{display:grid;grid-template-columns:.7fr 1.3fr;gap:65px;align-items:end;margin-bottom:35px}
.area51-sp-applications__heading{max-width:780px;margin:0;font-family:"Area51 Built Titling",Impact,sans-serif;font-size:clamp(54px,5vw,78px);font-weight:600;line-height:.86;text-transform:uppercase;color:#fff}
.area51-sp-applications__list{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border-top:1px solid rgba(11,13,12,.24);border-left:1px solid rgba(11,13,12,.24)}
.area51-sp-application{position:relative;min-height:128px;padding:23px 22px 22px;border-right:1px solid rgba(11,13,12,.24);border-bottom:1px solid rgba(11,13,12,.24);overflow:hidden;background:rgba(255,255,255,.035)}
.area51-sp-application__number{display:block;margin-bottom:27px;font-size:8px;font-weight:800;letter-spacing:.15em;color:rgba(11,13,12,.57)}
.area51-sp-application strong{display:block;max-width:250px;font-family:"Area51 Built Titling",Impact,sans-serif;font-size:25px;font-weight:600;line-height:.95;text-transform:uppercase;color:#fff}
.area51-sp-application__mark{position:absolute;right:18px;top:18px;width:8px;height:8px;background:#0B0D0C}

/* =========================================================
   GALLERY
========================================================= */
.area51-sp-gallery{position:relative;padding:92px 0 98px;background:var(--area51-black);color:#fff}
.area51-sp-gallery:before{content:"";position:absolute;inset:0;pointer-events:none;opacity:.18;background-image:radial-gradient(circle at 8% 18%,rgba(255,255,255,.6) 0 1px,transparent 1.5px),radial-gradient(circle at 25% 69%,rgba(255,255,255,.35) 0 1px,transparent 1.5px),radial-gradient(circle at 66% 26%,rgba(255,255,255,.35) 0 1px,transparent 1.5px),radial-gradient(circle at 88% 72%,rgba(255,255,255,.45) 0 1px,transparent 1.5px)}
.area51-sp-gallery .area51-sp-inner{position:relative;z-index:2}
.area51-sp-gallery__header{display:grid;grid-template-columns:1fr auto;gap:50px;align-items:end;margin-bottom:37px}
.area51-sp-gallery__count{padding:9px 11px;border:1px solid rgba(255,255,255,.15);font-size:7px;font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:rgba(255,255,255,.48)}
.area51-sp-gallery__grid{display:grid;grid-template-columns:1.3fr .7fr;grid-template-rows:repeat(2,245px);gap:10px;height:500px}
.area51-sp-gallery__grid--1{grid-template-columns:1fr;grid-template-rows:500px}
.area51-sp-gallery__grid--2{grid-template-columns:1.25fr .75fr;grid-template-rows:500px}
.area51-sp-gallery__item{position:relative;margin:0;overflow:hidden;background:#171B18;border:1px solid rgba(255,255,255,.1)}
.area51-sp-gallery__grid--3 .area51-sp-gallery__item:first-child{grid-row:1/3}
.area51-sp-gallery__item img{display:block;width:100%;height:100%;object-fit:cover;transition:transform .55s cubic-bezier(.22,1,.36,1)}
.area51-sp-gallery__item:after{content:"";position:absolute;inset:0;background:linear-gradient(to top,rgba(5,7,5,.6),transparent 48%);pointer-events:none}
.area51-sp-gallery__item figcaption{position:absolute;z-index:3;left:18px;bottom:17px;padding-left:11px;border-left:3px solid var(--area51-green);font-size:8px;font-weight:800;letter-spacing:.13em;text-transform:uppercase;color:#fff}
@media(hover:hover) and (pointer:fine){.area51-sp-gallery__item:hover img{transform:scale(1.035)}}

/* =========================================================
   WHAT TO EXPECT
========================================================= */
.area51-sp-deliver{padding:96px 0 101px;background:#F6F7F4}
.area51-sp-deliver__header{display:grid;grid-template-columns:1fr .8fr;gap:70px;align-items:end;margin-bottom:45px}
.area51-sp-deliver__items{display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid var(--area51-border);border-left:1px solid var(--area51-border)}
.area51-sp-deliver__item{position:relative;min-height:280px;padding:29px 28px 27px;border-right:1px solid var(--area51-border);border-bottom:1px solid var(--area51-border);background:#fff}
.area51-sp-deliver__item:before{content:"";position:absolute;left:-1px;top:-1px;width:4px;height:0;background:var(--area51-green);transition:height .35s ease}
.area51-sp-deliver__number{display:block;margin-bottom:54px;font-size:8px;font-weight:800;letter-spacing:.15em;color:var(--area51-green)}
.area51-sp-deliver__item h3{margin:0 0 14px;font-family:"Area51 Built Titling",Impact,sans-serif;font-size:29px;font-weight:600;line-height:.94;text-transform:uppercase;color:var(--area51-black)}
.area51-sp-deliver__item p{margin:0;font-size:12px;line-height:1.68;color:#687069}
@media(hover:hover) and (pointer:fine){.area51-sp-deliver__item:hover:before{height:100%}}

/* =========================================================
   FINAL CTA
========================================================= */
.area51-sp-cta,.area51-sp-index-cta{padding:78px 0 82px;background:var(--area51-green);color:#fff}
.area51-sp-cta__grid,.area51-sp-index-cta__grid{display:grid;grid-template-columns:1fr .82fr;gap:90px;align-items:end}
.area51-sp-cta__heading{margin:0;font-family:"Area51 Built Titling",Impact,sans-serif;font-size:clamp(58px,5.7vw,92px);font-weight:600;line-height:.84;text-transform:uppercase;color:#fff}
.area51-sp-cta__heading>span{display:block}
.area51-sp-cta__heading>span:last-child{color:var(--area51-black)}
.area51-sp-cta__right,.area51-sp-index-cta__right{max-width:540px;margin-left:auto}
.area51-sp-cta__right p,.area51-sp-index-cta__right p{margin:0 0 26px;font-size:14px;line-height:1.7;color:rgba(11,13,12,.68)}

/* =========================================================
   SERVICES DIRECTORY
========================================================= */
.area51-sp-index-services{position:relative;padding:94px 0 96px;background:linear-gradient(180deg,#F7F8F5 0%,#EFF1ED 100%)}
.area51-sp-index-services:before{content:"";position:absolute;inset:0;pointer-events:none;opacity:.045;background-image:linear-gradient(rgba(57,181,74,.2) 1px,transparent 1px),linear-gradient(90deg,rgba(57,181,74,.2) 1px,transparent 1px);background-size:72px 72px}
.area51-sp-index-services .area51-sp-inner{position:relative;z-index:2}
.area51-sp-index-services__header{display:grid;grid-template-columns:1fr .82fr;gap:80px;align-items:end;padding-bottom:35px;border-bottom:1px solid #C9CEC8}
.area51-sp-index-services__header>p{max-width:520px;margin:0 0 3px auto;font-size:14px;line-height:1.72;color:var(--area51-copy)}
.area51-sp-index-strip{display:grid;grid-template-columns:repeat(3,1fr);margin:18px 0 34px;border:1px solid #CFD4CE;background:rgba(255,255,255,.55)}
.area51-sp-index-strip span{min-height:54px;padding:0 18px;display:flex;align-items:center;gap:10px;border-right:1px solid #CFD4CE;font-size:8px;font-weight:800;letter-spacing:.13em;text-transform:uppercase;color:#59605A}
.area51-sp-index-strip span:last-child{border-right:0}
.area51-sp-index-strip span:before{content:"";width:8px;height:8px;background:var(--area51-green);flex:0 0 8px}
.area51-sp-index-services__grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
.area51-sp-index-card{position:relative;display:grid;grid-template-columns:210px minmax(0,1fr);min-height:260px;background:#fff!important;color:var(--area51-black)!important;border:1px solid var(--area51-border);overflow:hidden;transition:transform .28s ease,border-color .25s ease,background .25s ease}
.area51-sp-index-card:before{content:"";position:absolute;z-index:5;left:0;top:0;bottom:0;width:4px;background:var(--area51-green);transform:scaleY(0);transform-origin:bottom;transition:transform .35s ease}
.area51-sp-index-card__media{position:relative;min-height:260px;overflow:hidden;background:#171B18}
.area51-sp-index-card__media:after{content:"";position:absolute;inset:0;background:linear-gradient(to top,rgba(7,9,8,.45),transparent 48%)}
.area51-sp-index-card__media img{display:block;width:100%;height:100%;object-fit:cover;transition:transform .55s cubic-bezier(.22,1,.36,1)}
.area51-sp-index-card__number{position:absolute;z-index:3;left:14px;bottom:14px;display:grid;place-items:center;width:40px;height:40px;background:var(--area51-green);font-family:"Area51 Built Titling",Impact,sans-serif;font-size:18px;color:#fff}
.area51-sp-index-card__body{display:flex;flex-direction:column;padding:25px 26px 23px}
.area51-sp-index-card__meta{margin-bottom:17px;font-size:7px;font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:#858C86}
.area51-sp-index-card__body h2{margin:0 0 14px;font-family:"Area51 Built Titling",Impact,sans-serif;font-size:36px;font-weight:600;line-height:.92;text-transform:uppercase;color:var(--area51-black)}
.area51-sp-index-card__body p{margin:0 0 24px;font-size:12px;line-height:1.65;color:#687069}
.area51-sp-index-card__link{margin-top:auto;padding-top:16px;border-top:1px solid #E0E4DE;display:flex;align-items:center;justify-content:space-between;gap:20px;font-family:"Area51 Built Titling",Impact,sans-serif;font-size:16px;text-transform:uppercase;color:var(--area51-black)}
.area51-sp-index-card__icon{width:18px;height:18px;display:block;color:var(--area51-green);transition:transform .22s ease}
@media(hover:hover) and (pointer:fine){
  .area51-sp-index-card:hover{transform:translateY(-4px);border-color:var(--area51-black);background:var(--area51-black)!important;color:#fff!important}
  .area51-sp-index-card:hover:before{transform:scaleY(1)}
  .area51-sp-index-card:hover .area51-sp-index-card__media img{transform:scale(1.035)}
  .area51-sp-index-card:hover .area51-sp-index-card__body h2{color:#fff}
  .area51-sp-index-card:hover .area51-sp-index-card__body p,.area51-sp-index-card:hover .area51-sp-index-card__meta{color:rgba(255,255,255,.5)}
  .area51-sp-index-card:hover .area51-sp-index-card__link{border-color:rgba(255,255,255,.13);color:#fff}
  .area51-sp-index-card:hover .area51-sp-index-card__icon{transform:translateX(4px)}
}

/* Theme hardening */
.area51-sp a:visited{color:inherit!important}
.area51-sp button:hover,.area51-sp button:focus,.area51-sp button:focus-visible{outline:none!important;box-shadow:none!important}

/* =========================================================
   TABLET
========================================================= */
@media(max-width:1050px){
  .area51-sp-inner{width:calc(100% - 48px)}
  .area51-sp-hero{grid-template-columns:1fr .82fr;min-height:620px}
  .area51-sp-hero__media{min-height:620px}
  .area51-sp-hero__content-inner{width:calc(100% - 48px)}
  .area51-sp-overview__grid{gap:55px}
  .area51-sp-applications__list{grid-template-columns:repeat(2,1fr)}
  .area51-sp-index-services__header{gap:50px}
  .area51-sp-index-services__grid{grid-template-columns:1fr}
  .area51-sp-index-card{grid-template-columns:230px minmax(0,1fr)}
}

/* =========================================================
   MOBILE
========================================================= */
@media(max-width:767px){
  .area51-sp-inner{width:calc(100% - 36px)}

  .area51-sp-hero{min-height:0;grid-template-columns:1fr}
  .area51-sp-hero__content{order:2}
  .area51-sp-hero__content:after{top:0;right:auto;left:0;width:100%;height:4px}
  .area51-sp-hero__content:before{font-size:210px;bottom:-50px;left:-9px}
  .area51-sp-hero__content-inner{width:calc(100% - 36px);padding:42px 0 49px}
  .area51-sp-breadcrumb{margin-bottom:27px}
  .area51-sp-kicker{margin-bottom:16px}
  .area51-sp-hero__title{font-size:clamp(60px,18vw,84px)}
  .area51-sp-hero__summary{margin-top:22px;font-size:13px;line-height:1.68}
  .area51-sp-hero__actions{margin-top:26px;display:grid;grid-template-columns:1fr}
  .area51-sp-button{width:100%;min-width:0;min-height:56px}
  .area51-sp-phone{min-height:44px;padding:0}
  .area51-sp-hero__media{order:1;height:40vh;min-height:285px}
  .area51-sp-hero__media img{object-position:var(--area51-sp-mobile-pos)}
  .area51-sp-hero__image-tag{right:14px;bottom:14px}

  .area51-sp-heading{font-size:clamp(52px,15vw,72px)}
  .area51-sp-overview{padding:65px 0 70px}
  .area51-sp-overview__grid{grid-template-columns:1fr;gap:31px}
  .area51-sp-overview__copy{padding-top:0;margin:0}
  .area51-sp-overview__copy p{font-size:13px;line-height:1.72}

  .area51-sp-applications{padding:58px 0 62px}
  .area51-sp-applications__header{grid-template-columns:1fr;gap:17px;margin-bottom:26px}
  .area51-sp-applications__heading{font-size:46px}
  .area51-sp-applications__list{grid-template-columns:1fr}
  .area51-sp-application{min-height:102px;padding:19px 18px}
  .area51-sp-application__number{margin-bottom:17px}
  .area51-sp-application strong{font-size:23px}

  .area51-sp-gallery{padding:63px 0 68px}
  .area51-sp-gallery__header{grid-template-columns:1fr;gap:18px;margin-bottom:29px}
  .area51-sp-gallery__count{justify-self:start}
  .area51-sp-gallery__grid,.area51-sp-gallery__grid--1,.area51-sp-gallery__grid--2,.area51-sp-gallery__grid--3{height:auto;grid-template-columns:1fr;grid-template-rows:none}
  .area51-sp-gallery__grid--3 .area51-sp-gallery__item:first-child{grid-row:auto}
  .area51-sp-gallery__item{height:235px}
  .area51-sp-gallery__item:first-child{height:325px}

  .area51-sp-deliver{padding:66px 0 70px}
  .area51-sp-deliver__header{display:block;margin-bottom:31px}
  .area51-sp-deliver__items{grid-template-columns:1fr}
  .area51-sp-deliver__item{min-height:0;padding:24px 21px}
  .area51-sp-deliver__number{margin-bottom:25px}
  .area51-sp-deliver__item h3{font-size:26px}

  .area51-sp-cta,.area51-sp-index-cta{padding:56px 0 60px}
  .area51-sp-cta__grid,.area51-sp-index-cta__grid{grid-template-columns:1fr;gap:28px}
  .area51-sp-cta__heading{font-size:clamp(53px,15vw,72px)}
  .area51-sp-cta__right,.area51-sp-index-cta__right{margin:0}
  .area51-sp-cta__right p,.area51-sp-index-cta__right p{font-size:13px}

  .area51-sp-index-services{padding:59px 0 64px}
  .area51-sp-index-services__header{grid-template-columns:1fr;gap:20px;padding-bottom:27px}
  .area51-sp-index-services__header>p{margin:0;font-size:13px}
  .area51-sp-index-strip{grid-template-columns:1fr;margin:14px 0 24px}
  .area51-sp-index-strip span{min-height:45px;border-right:0;border-bottom:1px solid #CFD4CE}
  .area51-sp-index-strip span:last-child{border-bottom:0}
  .area51-sp-index-services__grid{gap:9px}
  .area51-sp-index-card{grid-template-columns:1fr;min-height:0}
  .area51-sp-index-card__media{height:215px;min-height:0}
  .area51-sp-index-card__body{padding:21px 19px 20px}
  .area51-sp-index-card__body h2{font-size:31px}
}

@media(prefers-reduced-motion:reduce){
  .area51-sp *{scroll-behavior:auto!important;transition:none!important;animation:none!important}
}
