:root { --ink:#10261f; --green:#124d3d; --leaf:#b8d93b; --mint:#e9f0e8; --paper:#f6f5f0; --line:#d8ded8; --muted:#65706b; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; background:var(--paper); color:var(--ink); font-family:"Avenir Next",Avenir,"Segoe UI",Arial,sans-serif; }
a { color:inherit; text-decoration:none; }
.site-header { height:86px; display:flex; align-items:center; justify-content:space-between; padding:0 clamp(24px,5vw,80px); border-bottom:1px solid var(--line); position:absolute; top:0; width:100%; z-index:10; }
.brand { display:flex; align-items:center; gap:13px; font-weight:600; }
.brand-mark { width:38px; height:38px; border:1px solid currentColor; display:grid; place-items:center; font-size:12px; letter-spacing:.08em; }
.brand-name { letter-spacing:-.02em; }
nav { display:flex; align-items:center; gap:34px; font-size:14px; }
nav a { transition:opacity .2s; } nav a:hover { opacity:.6; }
.nav-contact { border:1px solid var(--ink); padding:11px 18px; }
.hero { min-height:780px; display:grid; grid-template-columns:56% 44%; padding-top:86px; border-bottom:1px solid var(--line); }
.hero-copy { display:flex; flex-direction:column; justify-content:center; padding:70px clamp(30px,6.5vw,110px) 70px clamp(24px,5vw,80px); }
.eyebrow,.section-label { text-transform:uppercase; font-size:11px; letter-spacing:.2em; font-weight:600; color:var(--green); margin:0 0 30px; }
h1,h2,h3,blockquote { font-family:"Avenir Next",Avenir,"Segoe UI",Arial,sans-serif; }
h1 { font-size:clamp(52px,6vw,92px); line-height:.98; letter-spacing:-.058em; font-weight:500; margin:0; max-width:850px; }
h1 em { color:var(--green); font-style:normal; }
.hero-intro { font-size:18px; line-height:1.65; max-width:640px; margin:36px 0; color:#3e4e48; }
.hero-actions { display:flex; gap:30px; align-items:center; margin-top:8px; }
.button { min-height:52px; display:inline-flex; align-items:center; justify-content:space-between; gap:30px; padding:0 22px; font-size:14px; font-weight:600; }
.primary { background:var(--green); color:white; }
.text-link { font-size:14px; font-weight:600; border-bottom:1px solid var(--ink); padding-bottom:5px; }
.hero-visual { position:relative; overflow:hidden; background:#dfe4df; }
.hero-visual img { width:100%; height:100%; object-fit:cover; object-position:33% center; filter:sepia(.08) contrast(1.03); }
.hero-visual:after { content:""; position:absolute; inset:0; background:linear-gradient(180deg,transparent 60%,rgba(15,38,30,.4)); }
.hero-note { position:absolute; z-index:2; left:28px; bottom:28px; background:rgba(246,245,240,.93); padding:13px 16px; font-size:11px; letter-spacing:.06em; display:flex; gap:9px; align-items:center; }
.pulse { width:7px; height:7px; background:var(--leaf); border-radius:50%; box-shadow:0 0 0 4px rgba(184,217,59,.2); }
.statement,.competencies,.qualification { padding:110px clamp(24px,5vw,80px); }
.statement-grid { display:grid; grid-template-columns:1.1fr 1fr; gap:10vw; }
.statement h2,.section-heading h2,.qualification h2 { font-size:clamp(38px,4.5vw,66px); line-height:1.08; letter-spacing:-.045em; font-weight:500; margin:0; }
.statement-copy { font-size:17px; line-height:1.75; color:#46534e; }
.statement-copy p:first-child { margin-top:0; }
.facts { display:grid; grid-template-columns:repeat(3,1fr); margin-top:80px; border-top:1px solid var(--line); }
.fact { padding:34px 20px 0 0; display:flex; flex-direction:column; gap:10px; border-right:1px solid var(--line); }
.fact:not(:first-child) { padding-left:34px; }
.fact strong { font-family:"Avenir Next",Avenir,"Segoe UI",Arial,sans-serif; font-size:46px; color:var(--green); font-weight:500; letter-spacing:-.04em; }
.fact span { max-width:240px; color:var(--muted); line-height:1.5; }
.competencies { background:#fff; }
.section-heading { display:flex; justify-content:space-between; align-items:end; gap:60px; margin-bottom:70px; }
.section-heading>p { max-width:370px; line-height:1.7; color:var(--muted); }
.competency-grid { display:grid; grid-template-columns:repeat(3,1fr); border-top:1px solid var(--line); border-left:1px solid var(--line); }
.competency-card { min-height:340px; padding:28px; border-right:1px solid var(--line); border-bottom:1px solid var(--line); display:flex; flex-direction:column; transition:background .25s, transform .25s; }
.competency-card:hover { background:var(--mint); transform:translateY(-3px); }
.card-number { font-size:11px; color:#829089; letter-spacing:.16em; }
.competency-card h3 { font-size:24px; font-weight:500; margin:52px 0 16px; letter-spacing:-.025em; }
.competency-card p { color:var(--muted); line-height:1.65; margin:0; }
.tags { display:flex; flex-wrap:wrap; gap:7px; margin-top:auto; padding-top:25px; }
.tags span { font-size:10px; text-transform:uppercase; letter-spacing:.1em; padding:7px 9px; border:1px solid #cdd5cf; }
.esg-section { background:var(--green); color:white; min-height:680px; display:grid; grid-template-columns:1fr 1fr; align-items:center; gap:10vw; padding:100px clamp(24px,8vw,140px); overflow:hidden; }
.esg-orbit { aspect-ratio:1; width:min(420px,100%); border:1px solid rgba(255,255,255,.24); border-radius:50%; display:flex; flex-direction:column; align-items:center; justify-content:center; position:relative; }
.esg-orbit strong { font-family:"Avenir Next",Avenir,"Segoe UI",Arial,sans-serif; font-size:86px; font-weight:400; color:var(--leaf); letter-spacing:-.07em; }
.esg-orbit small { text-transform:uppercase; text-align:center; letter-spacing:.18em; font-size:9px; line-height:1.7; }
.orbit { position:absolute; border:1px solid rgba(184,217,59,.38); border-radius:50%; }
.orbit-one { inset:13%; transform:translate(-26%,-18%); }.orbit-two { inset:17%; transform:translate(35%,24%); }
.light { color:var(--leaf); }
.esg-copy h2 { font-size:clamp(38px,4.2vw,64px); font-weight:400; line-height:1.08; letter-spacing:-.045em; margin:0 0 30px; }
.esg-copy>p:not(.section-label) { color:#c5d1cc; line-height:1.75; font-size:17px; }
.esg-copy ul { list-style:none; padding:15px 0 0; margin:0; }
.esg-copy li { padding:15px 0 15px 26px; border-top:1px solid rgba(255,255,255,.16); position:relative; }
.esg-copy li:before { content:"+"; position:absolute; left:0; color:var(--leaf); }
.qualification { display:grid; grid-template-columns:.9fr 1.1fr; gap:9vw; background:var(--paper); }
.qualification-list { border-top:1px solid var(--line); }
.qualification-list>div { display:grid; grid-template-columns:55px 1fr; gap:18px; padding:23px 0; border-bottom:1px solid var(--line); }
.qualification-list span { color:#8a9690; font-size:11px; }
.qualification-list p { margin:0; display:flex; flex-direction:column; gap:7px; }
.qualification-list strong { font-family:"Avenir Next",Avenir,"Segoe UI",Arial,sans-serif; font-size:19px; font-weight:500; }
.qualification-list small { color:var(--muted); font-size:14px; }
.quote-section { padding:100px clamp(24px,10vw,170px); text-align:center; background:#e5ece4; }
blockquote { font-size:clamp(42px,6vw,84px); letter-spacing:-.055em; line-height:1; font-weight:400; margin:0; color:var(--green); }
.quote-section p { max-width:700px; margin:32px auto 0; color:var(--muted); line-height:1.7; }
.contact { background:#0d211b; color:white; display:grid; grid-template-columns:1fr 1fr; gap:10vw; padding:100px clamp(24px,8vw,140px); }
.contact h2 { font-size:clamp(40px,4.8vw,70px); line-height:1.05; letter-spacing:-.05em; font-weight:400; margin:0; }
.contact-details { display:flex; flex-direction:column; align-items:flex-start; justify-content:end; }
.contact-details p { color:#b6c3be; line-height:1.7; max-width:490px; margin:0 0 30px; }
.light-button { background:var(--leaf); color:var(--ink); min-width:230px; }
.email { font-size:13px; color:#a9b8b2; margin-top:25px; border-bottom:1px solid #52635d; padding-bottom:4px; }
footer { background:#0d211b; color:white; padding:45px clamp(24px,5vw,80px); border-top:1px solid #2a3e37; display:grid; grid-template-columns:1fr 1fr 1fr; align-items:end; font-size:12px; color:#8fa099; }
.footer-brand { color:white; }
footer>p { text-align:center; margin:0; } footer>div:last-child { display:flex; justify-content:flex-end; gap:24px; }

@media (max-width:900px) {
  nav a:not(.nav-contact) { display:none; }
  .hero { grid-template-columns:1fr; }.hero-copy { min-height:690px; }.hero-visual { height:620px; }
  .statement-grid,.qualification,.contact,.esg-section { grid-template-columns:1fr; }
  .competency-grid { grid-template-columns:repeat(2,1fr); }
  .esg-orbit { width:min(360px,90vw); margin:auto; }
  .facts { grid-template-columns:1fr; }.fact { border-right:0; border-bottom:1px solid var(--line); padding:25px 0!important; flex-direction:row; align-items:center; gap:30px; }
  .section-heading { align-items:start; flex-direction:column; }
  footer { grid-template-columns:1fr; gap:25px; text-align:left; }footer>p { text-align:left; }footer>div:last-child { justify-content:flex-start; }
}
@media (max-width:560px) {
  .site-header { height:72px; }.brand-name { font-size:14px; }.nav-contact { padding:9px 12px; }
  .hero { padding-top:72px; }.hero-copy { min-height:620px; padding-top:55px; }.hero-visual { height:480px; }
  .hero-actions { align-items:flex-start; flex-direction:column; }.competency-grid { grid-template-columns:1fr; }
  .statement,.competencies,.qualification { padding-top:80px; padding-bottom:80px; }
  .esg-section,.contact { padding-top:80px; padding-bottom:80px; }
}
@media (prefers-reduced-motion:reduce) { html{scroll-behavior:auto}.competency-card{transition:none} }