@import url('https://fonts.googleapis.com/css2?family=Anton&family=Poppins:wght@400;500&display=swap');
:root{--cream:#f5f5dc;--green:#008000;--ink:#111820;--anton:'Anton',Impact,sans-serif;--body:'Poppins',Arial,sans-serif}
*{box-sizing:border-box}html{scroll-behavior:smooth;background:var(--cream)}body{margin:0;background:var(--cream);color:var(--ink);font-family:var(--body);-webkit-font-smoothing:antialiased}a{color:inherit}
.reveal{animation:reveal .5s ease-out both}.reveal-delay{animation-delay:.13s}@keyframes reveal{from{opacity:0;transform:translateY(7px)}to{opacity:1;transform:none}}@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important}.reveal{animation:none!important}}
.home{min-height:100svh;padding:clamp(34px,5vw,64px) 24px;display:grid;grid-template-rows:1fr auto 1fr;justify-items:center}.home-brand{grid-row:2;align-self:end;transform:translateY(-54px)}.logo{display:block;width:min(520px,58vw);height:auto}.home-nav{grid-row:3;align-self:start;margin-top:clamp(66px,9vh,92px);display:flex;flex-direction:column;align-items:center;gap:16px}.home-nav a{position:relative;color:var(--green);font-family:var(--anton);line-height:1;text-transform:uppercase;text-decoration:none;min-height:44px;display:flex;align-items:center}.nav-about{font-size:27px}.nav-contact{font-size:29px}.home-nav a::after{content:"";position:absolute;left:0;right:0;bottom:2px;height:1px;background:currentColor;transform:scaleX(0);transform-origin:left;transition:transform .18s ease}.home-nav a:hover::after,.home-nav a:focus-visible::after{transform:scaleX(1)}
.mini-header{padding:28px clamp(22px,4vw,54px)}.mini-header img{display:block;width:180px;height:auto}.about-page{overflow:hidden}.about-intro,.about-body,.contact-block,.outro{width:min(1180px,calc(100% - 48px));margin:0 auto}.about-intro{padding:clamp(70px,10vw,145px) 0 90px}.about-intro h1{margin:0 0 54px;color:var(--green);font-family:var(--anton);font-size:clamp(76px,11vw,164px);line-height:.82;font-weight:400;text-transform:uppercase}.copy{max-width:700px;margin-left:auto}.copy p{font-size:clamp(18px,1.55vw,22px);line-height:1.48;margin:0 0 1.4em}
.pillars{padding:clamp(52px,7vw,100px) max(24px,5vw);border-top:1px solid rgba(17,24,32,.17);border-bottom:1px solid rgba(17,24,32,.17)}.pillars div{color:var(--green);font-family:var(--anton);font-size:clamp(64px,10vw,150px);line-height:.88;text-transform:uppercase;white-space:nowrap}.pillars div:nth-child(2){text-align:center}.pillars div:nth-child(3){text-align:right}.mobile-break{display:none}
.about-body{padding:clamp(85px,11vw,150px) 0;display:grid;grid-template-columns:1fr 2fr;gap:50px}.about-body .copy{margin:0;max-width:700px}.lead{font-weight:500}
.keywords{padding:clamp(65px,9vw,125px) 0;display:flex;flex-direction:column;border-top:1px solid rgba(17,24,32,.17);border-bottom:1px solid rgba(17,24,32,.17)}.keywords span{color:var(--green);font-family:var(--anton);font-size:clamp(84px,15vw,230px);line-height:.78;text-transform:uppercase;letter-spacing:-.015em}.keywords span:nth-child(1){transform:translateX(-2vw)}.keywords span:nth-child(2){align-self:flex-end;transform:translateX(3vw)}.keywords span:nth-child(3){transform:translateX(3vw)}
.outro{padding:clamp(90px,11vw,150px) 0 clamp(55px,7vw,90px)}.outro p{max-width:820px;margin:0;font-family:var(--body);font-size:clamp(24px,2.7vw,40px);line-height:1.28;letter-spacing:-.015em;font-weight:400}.outro strong{color:var(--green);font-weight:500}
.contact-block{padding:clamp(45px,6vw,80px) 0 clamp(95px,13vw,175px)}.contact-block p{max-width:670px;font-size:clamp(18px,1.55vw,22px);line-height:1.48;margin:0 0 60px}.contact-block>a{display:inline-block;color:var(--green);font-family:var(--anton);font-size:clamp(52px,8vw,118px);line-height:.9;text-transform:uppercase;text-decoration:none}.contact-block>a:hover{opacity:.65}footer{padding:0 max(24px,4vw) 36px;font-size:14px}footer a{text-underline-offset:5px}
@media(max-width:700px){.home{padding:28px 20px}.home-brand{transform:translateY(-28px)}.logo{width:min(460px,84vw)}.home-nav{margin-top:64px;gap:12px}.nav-about{font-size:25px}.nav-contact{font-size:27px}.mini-header{padding:22px}.mini-header img{width:138px}.about-intro,.about-body,.contact-block,.outro{width:calc(100% - 40px)}.about-intro{padding:68px 0 70px}.about-intro h1{font-size:76px;margin-bottom:42px}.copy{margin-left:0}.copy p,.contact-block p{font-size:18px;line-height:1.52}.pillars{padding:52px 20px}.pillars div,.pillars div:nth-child(2),.pillars div:nth-child(3){text-align:left;font-size:clamp(49px,15vw,72px);line-height:.92;white-space:normal;margin-bottom:9px}.mobile-break{display:block}.about-body{padding:76px 0;grid-template-columns:1fr;gap:25px}.keywords{padding:58px 0;gap:8px}.keywords span{font-size:clamp(65px,20vw,100px);line-height:.84}.keywords span:nth-child(1){transform:translateX(-3vw)}.keywords span:nth-child(2){transform:translateX(7vw)}.keywords span:nth-child(3){transform:translateX(-1vw)}.outro{padding:76px 0 42px}.outro p{font-size:24px;line-height:1.35}.contact-block{padding:36px 0 95px}.contact-block p{margin-bottom:48px}.contact-block>a{font-size:clamp(47px,14vw,68px)}}

/* Refined outro: identical typography to the site's standard paragraphs */
.outro .copy{max-width:700px;margin-left:auto}
.outro .copy p{
  font-family:var(--body);
  font-size:clamp(18px,1.55vw,22px);
  line-height:1.48;
  letter-spacing:normal;
  font-weight:400;
  margin:0;
}
.outro .copy strong{color:var(--green);font-weight:500}
.centered-header{display:flex;justify-content:center;padding-top:34px}
.centered-header img{width:150px}
@media(max-width:700px){
  .outro .copy{margin-left:0}
  .outro .copy p{font-size:18px;line-height:1.52}
  .centered-header{padding-top:24px}
  .centered-header img{width:122px}
}

.back-nav{
  width:min(1180px,calc(100% - 48px));
  margin:0 auto;
  padding-top:28px;
}
.back-nav a{
  color:var(--ink);
  font-family:var(--body);
  font-size:13px;
  line-height:1;
  letter-spacing:.06em;
  text-transform:uppercase;
  text-decoration:none;
  opacity:.7;
}
.back-nav a:hover,.back-nav a:focus-visible{opacity:1}
.outro .copy strong{color:var(--ink);font-weight:500}
@media(max-width:700px){
  .back-nav{width:calc(100% - 40px);padding-top:22px}
  .back-nav a{font-size:12px}
}

/* Discreet utility navigation above the editorial ABOUT masthead */
.back-nav{
  width:min(1180px,calc(100% - 48px));
  margin:0 auto;
  padding-top:30px;
}
.back-nav a{
  display:inline-block;
  color:var(--ink);
  font-family:var(--body);
  font-size:13px;
  font-weight:400;
  line-height:1;
  letter-spacing:.055em;
  text-transform:uppercase;
  text-decoration:none;
  opacity:.68;
  transition:opacity .18s ease;
}
.back-nav a:hover,.back-nav a:focus-visible{
  opacity:1;
}
@media(max-width:700px){
  .back-nav{
    width:calc(100% - 40px);
    padding-top:22px;
  }
  .back-nav a{font-size:12px}
}

/* Final conversion sequence: proposition directly into CTA */
.outro{padding-bottom:clamp(38px,4.5vw,62px)}
.contact-block{padding-top:0}
@media(max-width:700px){
  .outro{padding-bottom:34px}
  .contact-block{padding-top:0}
}

/* Seamless About-page variant: hierarchy through spacing and type, not rules */
.pillars,
.keywords{
  border-top:0;
  border-bottom:0;
}

/* Progressive-enhancement scroll reveal: content remains visible if JS is unavailable */
.js .scroll-reveal{
  opacity:0;
  transform:translateY(16px);
  transition:opacity .65s cubic-bezier(.22,1,.36,1),transform .65s cubic-bezier(.22,1,.36,1);
}
.js .scroll-reveal.is-visible{opacity:1;transform:none}
@media(prefers-reduced-motion:reduce){
  .js .scroll-reveal{opacity:1;transform:none;transition:none}
}

/* Stronger, element-by-element scroll reveal */
.js .scroll-reveal{opacity:1!important;transform:none!important}
.js .reveal-on-scroll{
  opacity:0;
  transform:translateY(34px);
  transition:
    opacity .9s cubic-bezier(.22,1,.36,1),
    transform .9s cubic-bezier(.22,1,.36,1);
}
.js .reveal-on-scroll.revealed{
  opacity:1;
  transform:translateY(0);
}
@media(max-width:700px){
  .js .reveal-on-scroll{transform:translateY(26px)}
  .js .reveal-on-scroll.revealed{transform:none}
}
@media(prefers-reduced-motion:reduce){
  .js .reveal-on-scroll{
    opacity:1;
    transform:none;
    transition:none;
  }
}

/* Opening content is visible immediately, with a restrained entrance animation.
   Lower-page content remains scroll-triggered. */
.js .intro-reveal{
  opacity:0;
  transform:translateY(14px);
  animation:introReveal .62s cubic-bezier(.22,1,.36,1) forwards;
}
.js .intro-reveal-delay{animation-delay:.12s}
@keyframes introReveal{
  to{opacity:1;transform:none}
}
@media(prefers-reduced-motion:reduce){
  .js .intro-reveal{
    opacity:1;
    transform:none;
    animation:none;
  }
}

/* Continuous-scroll composition
   Keep the next section close enough to act as a natural scroll affordance. */
.about-intro,
.pillars,
.about-body,
.keywords,
.outro,
.contact-block{
  scroll-margin-top:24px;
}

/* Medium/short desktop and laptop viewports */
@media (min-width:701px) and (max-height:900px){
  .about-intro{padding-bottom:clamp(42px,7vh,68px)}
  .pillars{padding-top:clamp(34px,5.5vh,56px);padding-bottom:clamp(44px,7vh,70px)}
  .about-body{padding-top:clamp(38px,6vh,60px);padding-bottom:clamp(44px,7vh,70px)}
  .keywords{padding-top:clamp(34px,5.5vh,56px);padding-bottom:clamp(44px,7vh,70px)}
  .outro{padding-top:clamp(38px,6vh,60px);padding-bottom:clamp(36px,5.5vh,56px)}
  .contact-block{padding-top:clamp(30px,4.5vh,46px)}
}

/* Very short desktop windows: tighten further so a following element is always nearby. */
@media (min-width:701px) and (max-height:700px){
  .about-intro{padding-bottom:34px}
  .pillars,.about-body,.keywords{padding-top:30px;padding-bottom:38px}
  .outro{padding-top:30px;padding-bottom:30px}
  .contact-block{padding-top:24px}
}

/* Mobile: use compact vertical rhythm so no screen resolves into a beige dead-end. */
@media (max-width:700px){
  .about-intro{padding-bottom:44px}
  .pillars{padding-top:30px;padding-bottom:46px}
  .about-body{padding-top:34px;padding-bottom:46px}
  .keywords{padding-top:30px;padding-bottom:46px}
  .outro{padding-top:34px;padding-bottom:32px}
  .contact-block{padding-top:24px;padding-bottom:48px}
}

/* Short phones */
@media (max-width:700px) and (max-height:740px){
  .about-intro{padding-bottom:34px}
  .pillars,.about-body,.keywords{padding-top:26px;padding-bottom:36px}
  .outro{padding-top:28px;padding-bottom:26px}
  .contact-block{padding-top:20px;padding-bottom:36px}
}

/* Mobile fix: keep the full COMMUNICATIONS word inside the viewport */
@media (max-width:700px){
  .pillars{ overflow:visible; }
  .pillars > div{ max-width:100%; }
  .pillars > div:first-child{
    font-size:clamp(45px, 14.4vw, 68px);
    letter-spacing:-0.025em;
    white-space:nowrap;
  }
}
@media (max-width:380px){
  .pillars > div:first-child{ font-size:13.9vw; }
}

/* Homepage: three-level navigation hierarchy */
.nav-services{font-size:28px}
@media(max-width:700px){
  .nav-services{font-size:26px}
}

/* Services */
.services-page{min-height:100svh}
.services-intro,
.services-grid,
.services-cta{
  width:min(1180px,calc(100% - 48px));
  margin:0 auto;
}
.services-intro{padding:clamp(68px,9vw,126px) 0 clamp(72px,9vw,118px)}
.services-intro h1{
  margin:0 0 40px;
  color:var(--green);
  font-family:var(--anton);
  font-size:clamp(76px,11vw,164px);
  line-height:.82;
  font-weight:400;
  text-transform:uppercase;
}
.services-deck{
  width:min(760px,100%);
  margin:0;
  font-size:clamp(18px,1.55vw,22px);
  line-height:1.48;
}
.services-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:clamp(34px,5vw,78px);
  padding:0 0 clamp(100px,12vw,170px);
}
.service-card h2{
  margin:0 0 22px;
  color:var(--green);
  font-family:var(--anton);
  font-size:clamp(30px,3.1vw,47px);
  line-height:1;
  font-weight:400;
  text-transform:uppercase;
}
.service-card h2 span{color:var(--green)}
.service-card ul{
  margin:0;
  padding-left:1.15em;
  font-size:clamp(17px,1.35vw,20px);
  line-height:1.45;
}
.service-card li{padding-left:.12em}
.nowrap{white-space:nowrap}
.services-cta{padding:0 0 clamp(88px,11vw,150px)}
.services-cta a{
  display:inline-block;
  color:var(--green);
  font-family:var(--anton);
  font-size:clamp(52px,8vw,118px);
  line-height:.9;
  text-transform:uppercase;
  text-decoration:none;
}
.services-cta a:hover{opacity:.65}

@media(max-width:900px){
  .services-grid{grid-template-columns:1fr;gap:54px}
  .service-card{max-width:680px}
}
@media(max-width:700px){
  .services-intro,.services-grid,.services-cta{width:calc(100% - 40px)}
  .services-intro{padding:64px 0 58px}
  .services-intro h1{font-size:76px;margin-bottom:36px}
  .services-deck{font-size:18px;line-height:1.52}
  .services-grid{gap:46px;padding-bottom:76px}
  .service-card h2{font-size:clamp(31px,9.4vw,43px);margin-bottom:18px}
  .service-card ul{font-size:18px;line-height:1.48}
  .services-cta{padding-bottom:56px}
  .services-cta a{font-size:clamp(47px,14vw,68px)}
}

/* Editorial Services refinement: no numbering, bullets, boxes or rules */
.services-page .service-card h2{
  margin-bottom:28px;
}
.services-page .service-list{
  margin:0;
  padding:0;
}
.services-page .service-list p{
  margin:0;
  padding:0;
  font-family:var(--body);
  font-size:clamp(17px,1.35vw,20px);
  line-height:1.52;
}
.services-page .service-list p + p{
  margin-top:4px;
}

/* Keep three equal editorial columns on desktop, stacked reading order below */
@media(max-width:900px){
  .services-page .services-grid{
    gap:64px;
  }
}
@media(max-width:700px){
  .services-page .service-card h2{
    margin-bottom:20px;
  }
  .services-page .service-list p{
    font-size:18px;
    line-height:1.52;
  }
  .services-page .service-list p + p{
    margin-top:3px;
  }
  .services-page .services-grid{
    gap:58px;
  }
}

/* Desktop services alignment:
   equal heading zone means every service list begins on the same baseline */
@media(min-width:901px){
  .services-page .service-card{
    display:grid;
    grid-template-rows:clamp(78px,6.8vw,102px) auto;
    align-content:start;
  }
  .services-page .service-card h2{
    margin:0;
    align-self:start;
  }
  .services-page .service-list{
    align-self:start;
  }
  .services-page .service-list p{
    min-height:1.52em;
  }
}

/* On stacked tablet/mobile layouts, natural flow reads better than forced alignment */
@media(max-width:900px){
  .services-page .service-card{
    display:block;
  }
}

/* Discreet scroll affordance — editorial rather than instructional */
.scroll-cue{
  position:fixed;
  right:clamp(18px,2.4vw,36px);
  bottom:clamp(18px,2.4vw,30px);
  z-index:20;
  display:flex;
  align-items:center;
  gap:7px;
  color:var(--ink);
  font-family:var(--body);
  font-size:10px;
  font-weight:400;
  line-height:1;
  letter-spacing:.12em;
  text-transform:uppercase;
  opacity:.42;
  pointer-events:none;
  transition:opacity .35s ease;
}
.scroll-cue i{
  font-style:normal;
  font-size:13px;
  line-height:1;
}
body.has-scrolled .scroll-cue{opacity:0}
@media(max-width:700px){
  .scroll-cue{
    right:18px;
    bottom:18px;
    font-size:9px;
    opacity:.38;
  }
  .scroll-cue i{font-size:12px}
}
@media(prefers-reduced-motion:reduce){
  .scroll-cue{transition:none}
}

/* Final editorial scroll cue: centered label + fine continuation line */
.scroll-cue{
  left:50%;
  right:auto;
  bottom:clamp(16px,2.2vw,26px);
  transform:translateX(-50%);
  flex-direction:column;
  justify-content:flex-end;
  gap:7px;
  font-size:9px;
  letter-spacing:.16em;
  opacity:.46;
}
.scroll-cue i{
  display:block;
  width:1px;
  height:24px;
  background:currentColor;
  font-size:0;
}
body.has-scrolled .scroll-cue{
  opacity:0;
}
@media(max-width:700px){
  .scroll-cue{
    left:50%;
    right:auto;
    bottom:14px;
    transform:translateX(-50%);
    font-size:8px;
    letter-spacing:.16em;
    opacity:.42;
    gap:6px;
  }
  .scroll-cue i{
    width:1px;
    height:20px;
  }
}

/* Geographic USP follows the outcomes as its own editorial beat */
.geographic-usp{
  padding:clamp(44px,6vw,82px) 0 clamp(68px,8vw,112px);
}
.geographic-usp strong,
.about-body strong{
  font-weight:600;
}
@media(max-width:700px){
  .geographic-usp{
    padding:38px 0 64px;
  }
}

/* About body typography consistency: emphasis keeps the exact Poppins face */
.about-page .about-intro .copy p,
.about-page .about-body .copy p,
.about-page .geographic-usp .copy p,
.about-page .outro .copy p{
  font-family:"Poppins",sans-serif;
  font-style:normal;
  font-weight:400;
}

.about-page .about-body .copy strong,
.about-page .geographic-usp .copy strong{
  font-family:inherit;
  font-style:inherit;
  font-size:inherit;
  line-height:inherit;
  letter-spacing:inherit;
  color:inherit;
  font-weight:500;
}
