:root { color-scheme: light; font-family: Inter, "Segoe UI", Arial, sans-serif; color: #172b23; background: #f9faf8; }
* { box-sizing: border-box; letter-spacing: 0; }
body { margin: 0; min-width: 0; min-height: 100svh; display: flex; flex-direction: column; }
a { color: inherit; text-decoration: none; }
a:focus-visible { outline: 2px solid #204f38; outline-offset: 7px; }
.header { width: min(100%, 1376px); margin: 0 auto; padding: 30px 48px; display: flex; align-items: center; justify-content: space-between; gap: 24px; }
.brand { display: flex; align-items: center; gap: 13px; flex: 0 0 auto; }
.brand img { object-fit: contain; }
h1 { margin: 0; font-size: 19px; line-height: 1.06; font-weight: 800; text-transform: uppercase; }
main { width: min(100%, 1120px); margin: auto; padding: 64px 48px 76px; }
.status { display: flex; align-items: center; gap: 12px; color: #657168; font-size: 12px; line-height: 1.5; }
.activity { width: 18px; height: 18px; display: flex; align-items: center; justify-content: space-between; flex: 0 0 auto; }
.activity i { display: block; width: 2px; height: 14px; background: #456552; transform-origin: center; animation: breathe 2.8s ease-in-out infinite; }
.activity i:nth-child(2) { animation-delay: .25s; }
.activity i:nth-child(3) { animation-delay: .5s; }
h2 { margin: 28px 0 24px; font-size: 68px; line-height: 1.06; font-weight: 550; }
.intro { max-width: 550px; margin: 0; font-size: 16px; line-height: 1.85; color: #657168; text-wrap: pretty; }
.contact { display: inline-flex; align-items: center; gap: 24px; max-width: 100%; margin-top: 32px; padding: 0 0 8px; border-bottom: 1px solid #a8b5ac; font-size: 17px; line-height: 1.5; overflow-wrap: anywhere; transition: border-color .2s; }
.contact:hover { border-color: #172b23; }
.contact span { flex: 0 0 auto; }
.landscape { margin: 0; width: 100%; height: 25svh; min-height: 170px; max-height: 290px; overflow: hidden; }
.landscape img { display: block; width: 100%; height: 100%; object-fit: cover; object-position: center 48%; }
footer { width: min(100%, 1376px); margin: 0 auto; padding: 18px 48px; color: #657168; font-size: 11px; line-height: 1.6; }
@keyframes breathe { 0%, 100% { transform: scaleY(.4); opacity: .45; } 50% { transform: scaleY(1); opacity: 1; } }
@media (min-width: 1600px) { main { padding-top: 96px; padding-bottom: 108px; } }
@media (max-width: 760px) {
  .header { padding: 22px 24px; gap: 16px; }
  .brand { gap: 9px; }
  .brand img { width: 36px; height: 36px; }
  h1 { font-size: 14px; }
  main { padding: 64px 24px 64px; }
  h2 { font-size: 46px; margin-top: 26px; }
  .intro { font-size: 15px; line-height: 1.8; }
  .contact { font-size: 15px; gap: 14px; margin-top: 28px; }
  .desktop-break { display: none; }
  .landscape { height: 23svh; min-height: 160px; }
  footer { padding: 18px 24px; }
}
@media (max-width: 360px) {
  .header { padding: 18px; gap: 8px; }
  .brand img { width: 30px; height: 30px; }
  h1 { font-size: 12px; }
  main { padding: 46px 18px; }
  h2 { font-size: 39px; }
  .status { font-size: 11px; gap: 8px; }
  .contact { font-size: 14px; gap: 10px; }
  footer { padding-inline: 18px; }
}
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { animation: none !important; transition: none !important; } }
