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

:root { --pine:#0d3b2f; --ink:#14231d; --snow:#f8faf7; --ice:#b9deea; --blue:#3e7d94; --orange:#f15a3a; --mist:#e7eeea; --line:rgba(13,59,47,.2); }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; color:var(--ink); background:var(--snow); font-family:Archivo,Arial,sans-serif; -webkit-font-smoothing:antialiased; }
a { color:inherit; text-decoration:none; }
.site-header, main, footer { max-width:1480px; margin:auto; }
.site-header { min-height:92px; padding:0 4.5vw; display:flex; align-items:center; justify-content:space-between; border-bottom:1px solid var(--line); }
.brand { display:flex; align-items:center; gap:12px; font-size:1rem; font-weight:700; letter-spacing:.06em; }
.brand small { display:block; margin-top:3px; color:#64756e; font-size:.8rem; font-weight:500; letter-spacing:0; }
.brand-mark { width:44px; height:44px; position:relative; display:block; overflow:hidden; background:var(--pine); border-radius:4px; }
.brand-mark i { position:absolute; bottom:8px; display:block; transform:rotate(-42deg); transform-origin:bottom left; }
.brand-mark i:first-child { width:34px; height:10px; left:7px; background:var(--ice); }
.brand-mark i:last-child { width:25px; height:10px; left:15px; bottom:5px; background:var(--orange); }
nav { display:flex; gap:40px; font-size:.9rem; font-weight:600; }
nav a { padding:8px 0; border-bottom:2px solid transparent; }
nav a:hover, nav a:focus-visible { border-color:var(--orange); }
.header-contact { padding:13px 20px; color:white; background:var(--pine); font-size:.9rem; font-weight:700; border-radius:3px; }

.hero { min-height:730px; display:grid; grid-template-columns:1.08fr .92fr; border-bottom:1px solid var(--line); }
.hero-copy { padding:80px 4.5vw 70px; display:flex; flex-direction:column; justify-content:center; }
.intro-label, .section-heading>p, .services-title>p, .approach-intro>p:first-child, .contact-main>p { margin:0 0 32px; color:var(--orange); font-size:.9rem; font-weight:700; }
h1,h2,h3,p { margin-top:0; }
h1,h2 { font-family:Domine,Georgia,serif; }
h1 { max-width:760px; margin:0; font-size:clamp(4.3rem,7.2vw,7.2rem); line-height:.92; letter-spacing:-.06em; }
.hero-text { max-width:610px; margin:42px 0 0; color:#5f7069; font-size:1.15rem; line-height:1.7; }
.hero-actions { margin-top:36px; display:flex; align-items:center; gap:28px; }
.primary-action { padding:16px 22px; color:white; background:var(--pine); border-radius:3px; font-weight:700; }
.text-action { padding-bottom:5px; border-bottom:1px solid var(--ink); font-weight:600; }
.coordinate-field { min-height:620px; position:relative; overflow:hidden; background:var(--mist); border-left:1px solid var(--line); }
.field-grid { position:absolute; inset:0; background:linear-gradient(90deg,rgba(13,59,47,.08) 1px,transparent 1px),linear-gradient(rgba(13,59,47,.08) 1px,transparent 1px); background-size:48px 48px; }
.plane { position:absolute; height:145px; left:-15%; right:-15%; transform:rotate(-19deg); }
.plane-green { top:12%; background:var(--pine); }
.plane-blue { top:42%; background:var(--ice); }
.plane-orange { bottom:2%; background:var(--orange); }
.field-card { width:245px; position:absolute; right:8%; top:17%; padding:25px; color:white; background:var(--blue); box-shadow:12px 12px 0 var(--pine); }
.field-card span { font-size:.8rem; }
.field-card strong { display:block; margin:38px 0 8px; font-family:Domine,Georgia,serif; font-size:2.4rem; }
.field-card p { margin:0; color:#e2f3f7; font-size:.95rem; }
.field-note { position:absolute; left:8%; bottom:10%; padding:13px 15px; color:white; background:var(--pine); font-size:.8rem; font-weight:700; line-height:1.5; }
.trust-line { min-height:76px; padding:0 4.5vw; display:flex; align-items:center; justify-content:space-between; gap:24px; color:white; background:var(--pine); font-size:.9rem; font-weight:600; white-space:nowrap; overflow:hidden; }
.trust-line i { width:7px; height:7px; flex:0 0 auto; background:var(--orange); border-radius:50%; }

.section { padding:125px 4.5vw; }
.company { display:grid; grid-template-columns:1.35fr .75fr; gap:7vw; border-bottom:1px solid var(--line); }
.section-heading { grid-column:1; }
.section-heading h2, .services-title h2, .approach h2, .contact h2 { max-width:930px; margin:0; font-size:clamp(3rem,5.4vw,5rem); line-height:1.06; letter-spacing:-.045em; }
.company-copy { grid-column:1; display:grid; grid-template-columns:1fr 1fr; gap:45px; color:#5f7069; font-size:1.05rem; line-height:1.75; }
.company-principle { grid-column:2; grid-row:1/3; padding:30px; display:flex; flex-direction:column; color:white; background:var(--blue); }
.company-principle span { font-size:.9rem; }
.company-principle strong { margin:auto 0; font-family:Domine,Georgia,serif; font-size:1.8rem; line-height:1.35; }
.principle-line { height:80px; position:relative; border-bottom:12px solid var(--orange); transform:skewY(-16deg); }

.services { background:white; border-bottom:1px solid var(--line); }
.services-title { display:grid; grid-template-columns:.45fr 1.55fr; gap:5vw; }
.service-list { margin-top:75px; border-top:2px solid var(--pine); }
.service-list article { min-height:220px; display:grid; grid-template-columns:200px .8fr 1fr; gap:50px; align-items:center; border-bottom:1px solid var(--line); }
.service-symbol { width:150px; height:130px; position:relative; }
.service-symbol i { position:absolute; display:block; }
.connect i:first-child,.connect i:nth-child(2) { width:70px; height:70px; top:30px; border:2px solid var(--pine); border-radius:50%; }
.connect i:first-child { left:0; background:var(--ice); }.connect i:nth-child(2) { right:0; background:var(--orange); }
.connect i:nth-child(3) { width:80px; left:35px; top:64px; border-top:3px solid var(--pine); }
.focus i { left:50%; border:2px solid var(--pine); border-radius:50%; transform:translateX(-50%); }
.focus i:first-child { width:125px; height:125px; top:2px; }.focus i:nth-child(2) { width:75px; height:75px; top:27px; background:var(--ice); }.focus i:nth-child(3) { width:25px; height:25px; top:52px; background:var(--orange); }
.advance i { width:120px; height:24px; left:15px; background:var(--pine); transform:skewX(-28deg); }
.advance i:first-child { top:20px; }.advance i:nth-child(2) { top:54px; left:30px; background:var(--blue); }.advance i:nth-child(3) { top:88px; left:45px; background:var(--orange); }
.service-list h3 { margin:0; font-family:Domine,Georgia,serif; font-size:1.6rem; }
.service-list p { margin:0 0 15px; color:#5f7069; font-size:1rem; line-height:1.65; }
.service-list a { font-weight:700; border-bottom:1px solid var(--ink); }

.approach { display:grid; grid-template-columns:.85fr 1.15fr; gap:8vw; color:white; background:var(--pine); }
.approach-intro>p:first-child { color:var(--orange); }
.approach-summary { max-width:440px; margin-top:30px; color:#b9ccc5; font-size:1.05rem; line-height:1.7; }
.approach ol { margin:0; padding:0; list-style:none; border-top:1px solid rgba(255,255,255,.3); }
.approach li { min-height:150px; display:grid; grid-template-columns:55px 1fr; gap:25px; align-items:center; border-bottom:1px solid rgba(255,255,255,.22); }
.approach li>span { width:36px; height:36px; display:grid; place-items:center; color:var(--pine); background:var(--ice); border-radius:50%; font-weight:700; }
.approach h3 { margin:0 0 8px; font-family:Domine,Georgia,serif; font-size:1.6rem; }
.approach li p { margin:0; color:#b9ccc5; font-size:1rem; }

.contact { min-height:650px; display:grid; grid-template-columns:.5fr 1.2fr; grid-template-rows:1fr auto; gap:35px 7vw; background:var(--snow); }
.contact-band { width:310px; height:420px; position:relative; overflow:hidden; align-self:center; background:var(--ice); }
.contact-band::before { content:""; width:480px; height:130px; position:absolute; left:-110px; top:145px; background:var(--orange); transform:rotate(-20deg); }
.contact-band span { position:absolute; left:38px; top:-20px; color:var(--pine); font-family:Domine,Georgia,serif; font-size:21rem; line-height:1; }
.contact-main { align-self:center; }
.contact-main>p { color:var(--orange); }
.email { display:inline-block; margin-top:45px; padding-bottom:8px; border-bottom:2px solid var(--pine); font-size:clamp(1.1rem,2.2vw,1.7rem); font-weight:700; overflow-wrap:anywhere; }
.contact-details { grid-column:2; display:grid; grid-template-columns:.6fr 1.4fr; gap:45px; padding-top:24px; border-top:1px solid var(--line); }
.contact-details small,.contact-details strong { display:block; }.contact-details small { margin-bottom:8px; color:var(--orange); font-size:.8rem; }.contact-details strong { font-size:1rem; line-height:1.5; }
footer { min-height:115px; padding:0 4.5vw; display:flex; align-items:center; justify-content:space-between; gap:30px; color:#64756e; font-size:.8rem; }
footer p { margin:0; text-align:center; }
footer>a { font-weight:700; }

@media (max-width:980px) {
  nav { display:none; }
  .hero { grid-template-columns:1fr; }
  .coordinate-field { min-height:570px; border-left:0; border-top:1px solid var(--line); }
  .company { grid-template-columns:1fr; }
  .company-principle { min-height:340px; grid-column:1; grid-row:auto; }
  .services-title,.approach { grid-template-columns:1fr; }
  .service-list article { grid-template-columns:180px 1fr; padding:35px 0; }
  .service-list article>div:last-of-type { grid-column:2; }
  .contact { grid-template-columns:1fr; }
  .contact-band { width:270px; height:350px; }
  .contact-details { grid-column:auto; }
}
@media (max-width:640px) {
  .site-header { min-height:76px; }
  .brand>span:last-child { display:none; }
  .hero-copy { padding:65px 5vw; }
  h1 { font-size:clamp(3.7rem,17vw,5rem); }
  .hero-actions,.company-copy { align-items:flex-start; grid-template-columns:1fr; flex-direction:column; }
  .coordinate-field { min-height:470px; }
  .field-card { width:205px; }
  .trust-line { justify-content:flex-start; }
  .section { padding:90px 5vw; }
  .section-heading h2,.services-title h2,.approach h2,.contact h2 { font-size:2.8rem; }
  .service-list article { grid-template-columns:1fr; gap:20px; }
  .service-list article>div:last-of-type { grid-column:auto; }
  .contact-band { width:215px; height:280px; }
  .contact-band span { font-size:15rem; }
  .contact-details { grid-template-columns:1fr; }
  footer { padding:35px 5vw; flex-direction:column; }
}
@media (prefers-reduced-motion:reduce) { html { scroll-behavior:auto; } }