*{box-sizing:border-box}html,body{margin:0}body{font-family:Arial,Helvetica,sans-serif;color:#101e36;background:#fff}main{width:1920px;margin:auto}section{position:relative;overflow:hidden}.hero{height:920px;background:#001d16;color:white}.heroPhoto{position:absolute;inset:0;background-image:linear-gradient(90deg,#001d16 0%,rgba(0,29,22,.95) 19%,rgba(0,29,22,.18) 56%,transparent 100%),url(hero.webp);background-size:cover;background-position:center;filter:none}.hero header{position:absolute;top:55px;left:90px;display:flex;align-items:center;gap:32px}.brand{display:flex;flex-direction:column;border-right:3px solid #e3a33c;padding-right:28px}.brand b{color:#f1b14e;font-size:57px;letter-spacing:2px;line-height:1}.brand span{font-size:22px;letter-spacing:7px;margin-top:6px}.tagline{font-size:19px;font-style:italic}.heroCopy{position:absolute;left:92px;top:224px}.heroCopy h1{font-size:66px;line-height:1.08;letter-spacing:-1.4px;font-weight:400;margin:0}.heroCopy strong{color:#eeb14e;font-weight:700}.dash{width:64px;height:5px;background:#f0af3b;margin-top:28px}.heroCopy p{font-size:25px;line-height:1.42;margin-top:30px}.contact{width:440px;border:2px solid #d69b30;padding:12px 15px 14px;display:flex;flex-direction:column;gap:11px}.contactHead{text-align:center;background:#edb14f;color:#111;font-size:24px;font-weight:bold;padding:10px}.contact a{color:inherit;text-decoration:none;font-size:20px;white-space:nowrap}.contact a:hover{text-decoration:underline}.hero .contact{position:absolute;right:58px;top:42px;background:rgba(0,27,20,.75)}.services{height:580px;padding:35px 92px 24px}.sectionLabel{font-weight:700;font-size:19px;letter-spacing:4px}.sectionLabel:before{content:'';display:inline-block;width:40px;height:4px;background:#e5a42e;vertical-align:middle;margin-right:23px}.servicesTop{display:flex;justify-content:space-between;align-items:start;padding:12px 50px 0 62px}.services h2{font-size:64px;line-height:1.05;font-weight:400;margin:0}.servicesTop p{font-size:24px;line-height:1.5;margin:0}.serviceGrid{display:grid;grid-template-columns:repeat(4,1fr);margin-top:34px}.serviceGrid article{text-align:center;padding:0 20px;border-right:2px solid #ddd}.serviceGrid article:last-child{border:0}.circle,.number{background:#00291e;color:white;border-radius:50%;display:grid;place-items:center;margin:auto}.circle{width:112px;height:112px;font-size:62px}.gold{background:#d99b36!important}.serviceGrid h3{font-size:25px;margin:15px 0 12px}.serviceGrid p{font-size:23px;line-height:1.35;margin:0}.impact{height:310px;background:#00271d;color:white;display:flex;align-items:center}.impactPhoto{position:absolute;inset:0;background:linear-gradient(90deg,#00271d 0%,rgba(0,39,29,.9) 35%,rgba(0,39,29,.18) 80%),url(mountains.webp) center/cover}.impactTitle{position:relative;margin-left:92px;width:815px;font-size:58px;line-height:1.12}.impactTitle strong{color:#edac3d}.impactTitle .dash{margin-top:20px}.impact p{position:relative;border-left:4px solid #e5a42e;padding-left:52px;font-size:25px;line-height:1.36}.approach{height:340px;padding:35px 92px}.steps{display:grid;grid-template-columns:repeat(4,1fr);margin-top:18px;position:relative}.steps:before{content:'';position:absolute;height:2px;background:#aaa;top:42px;left:100px;right:160px}.steps article{position:relative;padding-left:62px}.number{width:88px;height:88px;font-size:44px;margin:0 0 12px}.steps h3{font-size:25px;margin:0 0 9px}.steps p{font-size:23px;line-height:1.32;margin:0}.about{height:222px;background:#00261d;color:white;padding:24px 92px;display:grid;grid-template-columns:1fr 1fr;gap:58px}.about .sectionLabel{font-size:18px;letter-spacing:3px}.about p{font-size:21px;line-height:1.35;margin:14px 0 0 62px}.about .bio{border-left:4px solid #dba035;padding-left:50px;align-self:center}.about .bio p{margin:0}.footer{height:260px;display:flex;align-items:center}.leaves{width:580px;height:100%;background:url(leaves-desktop-clean.webp) center bottom/cover}.footerText{margin-left:36px;flex:1}.footerText .sectionLabel{font-size:18px}.footerText .sectionLabel:before{display:none}.footer h2{font-size:56px;font-weight:400;line-height:1.07;margin:20px 0}.footer h2 strong{color:#dc961e;font-weight:400}.footer .contact{margin-right:58px;width:440px;gap:7px}.footer .contactHead{padding:7px}.footer .contact a{font-size:18px}@media(max-width:1919px){main{margin:0}}
/* Accessibility: keyboard-only focus; no default visual changes */
a:focus-visible { outline: 3px solid #EFB34D; outline-offset: 3px; border-radius: 2px; }

/* Responsive desktop: preserve the approved 1920px layout exactly above this breakpoint. */
@media (min-width: 1025px) and (max-width: 1919px) {
  main { width:100%; }
  .hero { height:clamp(680px,47.92vw,920px); }
  .hero header { top:3%;left:4.8%;gap:1.65vw; }
  .brand { padding-right:1.46vw; }
  .brand b { font-size:clamp(34px,2.97vw,57px); }
  .brand span { font-size:clamp(13px,1.15vw,22px);letter-spacing:.36vw; }
  .tagline { font-size:clamp(12px,.99vw,19px); }
  .heroCopy { left:4.8%;top:24.35%; }
  .heroCopy h1 { font-size:clamp(44px,3.44vw,66px); }
  .heroCopy p { font-size:clamp(16px,1.3vw,25px); }
  .heroCopy .dash { margin-top:1.46vw; }
  .hero .contact { top:4.55%;right:3%; }
  .contact { width:clamp(300px,22.92vw,440px);padding:9px 11px;gap:clamp(6px,.57vw,11px); }
  .contactHead { font-size:clamp(17px,1.25vw,24px);padding:7px; }
  .contact a { font-size:clamp(14px,1.04vw,20px); }
  .services { height:auto;min-height:clamp(435px,30.21vw,580px);padding:1.82vw 4.8% 1.25vw; }
  .sectionLabel { font-size:clamp(14px,.99vw,19px);letter-spacing:.2vw; }
  .servicesTop { padding: .63vw 2.6vw 0 3.23vw; }
  .services h2 { font-size:clamp(42px,3.33vw,64px); }
  .servicesTop p { font-size:clamp(16px,1.25vw,24px); }
  .serviceGrid { margin-top:1.77vw; }
  .serviceGrid article { padding:0 1vw; }
  .circle { width:5.83vw;height:5.83vw;font-size:3.2vw; }
  .serviceGrid h3 { font-size:clamp(17px,1.3vw,25px); }
  .serviceGrid p { font-size:clamp(15px,1.2vw,23px); }
  .impact { height:clamp(230px,16.15vw,310px); }
  .impactTitle { margin-left:4.8%;width:42.45%;font-size:clamp(39px,3.02vw,58px); }
  .impact p { font-size:clamp(17px,1.3vw,25px);padding-left:2.7vw; }
  .approach { height:clamp(260px,17.71vw,340px);padding:1.82vw 4.8%; }
  .steps { margin-top:.94vw; }
  .steps article { padding-left:3.23vw; }
  .steps:before { top:2.19vw;left:5.2vw;right:8.33vw; }
  .number { width:4.58vw;height:4.58vw;font-size:2.3vw; }
  .steps h3 { font-size:clamp(17px,1.3vw,25px); }
  .steps p { font-size:clamp(15px,1.2vw,23px); }
  .about { height:auto;min-height:clamp(185px,11.56vw,222px);padding:1.25vw 4.8%;gap:3vw; }
  .about .sectionLabel { font-size:clamp(13px,.94vw,18px); }
  .about p { font-size:clamp(14px,1.09vw,21px);margin: .73vw 0 0 3.23vw; }
  .about .bio { padding-left:2.6vw; }
  .footer { height:clamp(195px,13.54vw,260px); }
  .leaves { width:30.2%;flex-shrink:0; }
  .footerText { margin-left:1.88vw; }
  .footerText .sectionLabel { font-size:clamp(13px,.94vw,18px); }
  .footer h2 { font-size:clamp(36px,2.92vw,56px); }
  .footer .contact { width:22.92vw;margin-right:3%; }
  .footer .contact a { font-size:clamp(13px,.94vw,18px); }
}
/* Small screens remain functional; dedicated tablet/mobile design to follow approval. */
@media (max-width: 1024px) {
  main {width:100%;}
  .hero {height:auto;min-height:780px;padding:30px 5% 50px;}
  .hero header,.heroCopy,.hero .contact {position:relative;top:auto;left:auto;right:auto;}
  .hero header {flex-wrap:wrap;gap:18px;}
  .brand b {font-size:clamp(32px,5vw,50px)}
  .brand span {font-size:15px}
  .tagline {font-size:15px}
  .heroCopy {margin-top:55px;}
  .heroCopy h1 {font-size:clamp(38px,6vw,60px);}
  .heroCopy p {font-size:clamp(17px,2.3vw,23px);}
  .heroCopy br,.servicesTop br,.serviceGrid br,.impact p br,.steps p br {display:none;}
  .hero .contact {margin-top:35px;width:min(440px,100%);}
  .services,.approach,.about,.footer,.impact {height:auto;min-height:0;}
  .services,.approach {padding:35px 5%;}
  .servicesTop {padding:18px 0;gap:24px;}
  .services h2 {font-size:clamp(34px,5vw,54px);}
  .servicesTop p {font-size:19px;}
  .serviceGrid {grid-template-columns:repeat(2,minmax(0,1fr));gap:30px;}
  .serviceGrid article {border:0;padding:10px;}
  .serviceGrid p {font-size:18px;}
  .impact {padding:45px 5%;gap:25px;}
  .impactTitle {margin:0;width:55%;font-size:clamp(33px,5vw,48px);}
  .impact p {font-size:19px;padding-left:20px;}
  .steps article {padding-left:15px;}
  .steps p {font-size:17px;}
  .steps:before {left:40px;right:40px;}
  .about {padding:30px 5%;gap:24px;}
  .about p {font-size:17px;margin-left:0;}
  .about .bio {padding-left:22px;}
  .footer {padding:0 3% 0 0;gap:20px;}
  .leaves {width:25%;min-height:230px;}
  .footerText {margin-left:0;}
  .footer h2 {font-size:clamp(30px,4vw,46px);}
  .footer .contact {width:min(340px,35%);margin-right:0;}
  .footer .contact a {font-size:13px;white-space:normal;overflow-wrap:anywhere;}
}
@media (max-width: 640px) {
  .hero {min-height:0;}
  .hero header {display:block;}
  .brand {display:inline-flex;}
  .tagline {margin-top:18px;}
  .heroCopy {margin-top:40px;}
  .heroCopy h1 {font-size:clamp(32px,8vw,45px);}
  .heroCopy p {font-size:17px;}
  .servicesTop,.impact {display:block;}
  .servicesTop p {margin-top:18px;}
  .serviceGrid {grid-template-columns:1fr;}
  .impactTitle {width:100%;}
  .impact p {margin-top:25px;}
  .steps {grid-template-columns:repeat(2,minmax(0,1fr));gap:30px;}
  .steps:before {display:none;}
  .about {grid-template-columns:1fr;}
  .about .bio {border-left:0;padding-left:0;}
  .footer {display:block;padding:0 5% 30px;}
  .leaves {width:calc(100% + 10vw);height:140px;min-height:0;margin-left:-5vw;}
  .footerText {padding:25px 0;}
  .footer .contact {width:100%;}
}

/* Dedicated 820px tablet layout. Desktop rules above 1024px remain unchanged. */
@media (min-width: 641px) and (max-width: 1024px) {
  .hero { min-height:0; padding:30px 5% 42px; }
  .heroPhoto { background-position:63% center; background-image:linear-gradient(90deg,#001d16 0%,rgba(0,29,22,.97) 43%,rgba(0,29,22,.65) 75%,rgba(0,29,22,.40) 100%),url(hero.webp); }
  .hero header { display:flex; flex-wrap:nowrap; gap:17px; align-items:center; }
  .brand { flex-shrink:0; padding-right:16px; border-right-width:2px; }
  .brand b { font-size:clamp(29px,4.1vw,42px); white-space:nowrap; }
  .brand span { font-size:clamp(12px,1.65vw,17px);letter-spacing:4px; }
  .tagline { font-size:clamp(12px,1.75vw,16px);line-height:1.35;max-width:270px; }
  .heroCopy { margin-top:60px; }
  .heroCopy h1 { font-size:clamp(40px,5.35vw,54px);letter-spacing:-.8px;line-height:1.1; }
  .heroCopy h1 br { display:block; }
  .heroCopy p { max-width:640px;font-size:clamp(18px,2.4vw,22px);line-height:1.48; }
  .heroCopy p br { display:none; }
  .hero .contact { margin-top:34px;width:440px;max-width:100%; }
  .contact a { font-size:19px; }
  .services { padding:36px 5% 45px; }
  .sectionLabel {font-size:16px;letter-spacing:3px;}
  .servicesTop { display:grid;grid-template-columns:1fr 1fr;align-items:start;gap:28px;padding:22px 0 0; }
  .services h2 { font-size:clamp(39px,5vw,49px); }
  .servicesTop p { font-size:18px;line-height:1.45; }
  .serviceGrid { grid-template-columns:repeat(2,minmax(0,1fr));column-gap:0;row-gap:36px;margin-top:38px; }
  .serviceGrid article { padding:0 22px; }
  .serviceGrid article:nth-child(odd) { border-right:1px solid #ddd; }
  .circle {width:94px;height:94px;font-size:51px;}
  .serviceGrid h3 {font-size:22px;line-height:1.2;}
  .serviceGrid p {font-size:18px;line-height:1.4;}
  .impact {display:grid;grid-template-columns:1.1fr 1fr;gap:30px;padding:50px 5%;align-items:center;}
  .impactPhoto {background-position:65% center;}
  .impactTitle {width:auto;font-size:clamp(33px,4.3vw,43px);line-height:1.18;}
  .impact p {margin:0;font-size:18px;line-height:1.48;padding-left:24px;}
  .approach {padding:36px 5% 45px;}
  .steps {grid-template-columns:repeat(2,minmax(0,1fr));gap:32px 20px;margin-top:30px;}
  .steps:before {display:none;}
  .steps article {padding-left:12px;}
  .number {width:72px;height:72px;font-size:36px;margin-bottom:14px;}
  .steps h3 {font-size:23px;}
  .steps p {font-size:18px;line-height:1.4;}
  .about {grid-template-columns:1fr 1fr;gap:30px;padding:36px 5% 40px;align-items:start;}
  .about .sectionLabel {font-size:14px;letter-spacing:2px;line-height:1.5;}
  .about .sectionLabel:before {width:25px;margin-right:10px;}
  .about p {font-size:17px;line-height:1.5;margin:20px 0 0;}
  .about .bio {align-self:start;padding-left:24px;margin-top:34px;}
  .about .bio p {margin:0;}
  .footer {display:grid;grid-template-columns:29% 1fr;grid-template-rows:auto auto;gap:0;padding:0;align-items:stretch;}
  .leaves {grid-column:1;grid-row:1 / 3;width:100%;height:100%;min-height:0;}
  .footerText {grid-column:2;grid-row:1;margin:0;padding:30px 25px 8px;}
  .footerText .sectionLabel {font-size:13px;letter-spacing:2px;}
  .footer h2 {font-size:clamp(35px,4.5vw,44px);margin:15px 0;}
  .footer .contact {grid-column:2;grid-row:2;width:min(420px,calc(100% - 50px));margin:0 25px 30px;padding:9px 12px;gap:7px;}
  .footer .contact a {font-size:17px;white-space:nowrap;overflow-wrap:normal;}
}

/* 820 tablet footer correction only: prevent overlap and center contact card in white area. */
@media (min-width:641px) and (max-width:1024px) {
  .footer { height:auto; min-height:0; grid-template-rows:auto auto; align-items:start; }
  .footerText { align-self:start; padding:30px 25px 0; min-height:0; }
  .footer .contact {
    position:static;
    grid-column:2;
    grid-row:2;
    justify-self:center;
    align-self:start;
    width:calc(100% - 64px);
    max-width:420px;
    margin:24px 0 30px;
    padding:12px 16px;
  }
}

/* Tablet only: remove the dark top edge embedded in the leaf photograph. */
@media (min-width:641px) and (max-width:1024px) { .footer .leaves { background-image:url(leaves-tablet-clean.webp); } }

/* 820 tablet: center the four approach steps, matching service-card alignment. */
@media (min-width:641px) and (max-width:1024px) {
  .steps article { text-align:center; padding-left:0; padding-right:0; }
  .steps .number { margin-left:auto; margin-right:auto; }
  .steps h3, .steps p { text-align:center; }
}


/* Dedicated 390px mobile layout. Only applies through 640px;
   the approved 820px, 1440px and 1920px rules are untouched. */
@media (max-width:640px) {
  html,body {width:100%;overflow-x:hidden;}
  main {width:100%;max-width:100%;overflow:hidden;}
  .hero {height:auto;min-height:0;padding:24px 22px 28px;}
  .heroPhoto {background-image:linear-gradient(90deg,rgba(0,29,22,.97) 0%,rgba(0,29,22,.88) 53%,rgba(0,29,22,.63) 100%),url(hero.webp);background-position:66% center;}
  .hero header {position:relative;display:flex;flex-direction:column;align-items:flex-start;gap:12px;top:auto;left:auto;}
  .brand {display:flex;flex-direction:column;border-right:0;border-bottom:2px solid #e3a33c;padding:0 0 10px;}
  .brand b {font-size:34px;letter-spacing:1px;white-space:nowrap;}
  .brand span {font-size:12px;letter-spacing:5px;margin-top:4px;}
  .tagline {margin:0;max-width:335px;font-size:13px;line-height:1.4;}
  .heroCopy {position:relative;left:auto;top:auto;margin-top:30px;}
  .heroCopy h1 {font-size:clamp(29px,7.8vw,37px);line-height:1.13;letter-spacing:-.55px;}
  .heroCopy h1 br {display:block;}
  .heroCopy .dash {width:42px;height:3px;margin-top:19px;}
  .heroCopy p {font-size:15px;line-height:1.52;margin:18px 0 0;max-width:100%;}
  .heroCopy p br {display:none;}
  .hero .contact {position:relative;top:auto;right:auto;left:auto;width:100%;max-width:350px;margin:25px auto 0;background:rgba(0,27,20,.82);}
  .contact {padding:9px 11px 12px;gap:9px;border-width:1px;}
  .contactHead {font-size:17px;padding:8px;}
  .contact a {font-size:13px;white-space:normal;overflow-wrap:anywhere;line-height:1.35;}
  .services {padding:27px 22px 34px;}
  .sectionLabel {font-size:12px;letter-spacing:2px;}
  .sectionLabel:before {width:25px;height:3px;margin-right:11px;}
  .servicesTop {display:block;padding:17px 0 0;}
  .services h2 {font-size:34px;line-height:1.1;}
  .servicesTop p {font-size:15px;line-height:1.5;margin:16px 0 0;}
  .serviceGrid {grid-template-columns:repeat(2,minmax(0,1fr));gap:27px 12px;margin-top:27px;}
  .serviceGrid article {padding:0 3px;border:0;}
  .circle {width:65px;height:65px;font-size:33px;}
  .serviceGrid h3 {font-size:15px;line-height:1.22;margin:10px 0 8px;}
  .serviceGrid p {font-size:13px;line-height:1.4;}
  .impact {display:block;padding:34px 22px 36px;}
  .impactPhoto {background:linear-gradient(90deg,rgba(0,39,29,.97),rgba(0,39,29,.62)),url(mountains.webp) center/cover;}
  .impactTitle {width:100%;font-size:32px;line-height:1.15;margin:0;}
  .impactTitle .dash {width:42px;height:3px;margin-top:17px;}
  .impact p {font-size:15px;line-height:1.48;padding-left:16px;border-left-width:3px;margin:23px 0 0;}
  .approach {padding:29px 22px 36px;}
  .steps {grid-template-columns:repeat(2,minmax(0,1fr));gap:29px 15px;margin-top:25px;}
  .steps:before {display:none;}
  .steps article {padding:0;text-align:center;}
  .number {width:59px;height:59px;font-size:29px;margin:0 auto 11px;}
  .steps h3 {font-size:17px;margin:0 0 7px;text-align:center;}
  .steps p {font-size:13px;line-height:1.43;text-align:center;}
  .about {display:grid;grid-template-columns:1fr;gap:20px;padding:28px 22px 32px;}
  .about .sectionLabel {font-size:12px;letter-spacing:1.5px;}
  .about p {font-size:14px;line-height:1.53;margin:14px 0 0;}
  .about .bio {border-left:3px solid #dba035;padding-left:16px;margin:0;}
  .about .bio p {margin:0;}
  .footer {display:flex;flex-direction:column;gap:0;padding:0 0 28px;height:auto;}
  .leaves {width:100%;height:150px;min-height:0;margin:0;background-image:url(leaves-tablet.webp);background-position:center 38%;background-size:cover;}
  .footerText {width:100%;margin:0;padding:25px 22px 7px;}
  .footerText .sectionLabel {font-size:11px;letter-spacing:1.7px;}
  .footer h2 {font-size:33px;line-height:1.14;margin:14px 0 10px;}
  .footer .contact {width:calc(100% - 44px);max-width:350px;margin:16px auto 0;padding:10px 13px;gap:8px;}
  .footer .contact a {font-size:13px;white-space:normal;overflow-wrap:anywhere;}
}

/* Both contact boxes at every viewport: no gold focus rectangle on website URLs.
   Preserve a visible keyboard-focus indication with underline. */
.contact a:first-of-type:focus,
.contact a:first-of-type:focus-visible {
  outline: none;
  box-shadow: none;
  border-radius: 0;
  text-decoration: underline;
  text-underline-offset: 3px;
}