+:root {
+ --bg: #f6f4f1;
+ --card: #ffffff;
+ --text: #1f2328;
+ --muted: #5f6872;
+ --line: #ddd7d0;
+ --accent: #557a8a;
+ --accent-dark: #3f616f;
+}
+
+* {
+ box-sizing: border-box;
+}
+
+body {
+ margin: 0;
+ font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
+ color: var(--text);
+ background: radial-gradient(circle at top, #fdfbf8 0%, var(--bg) 40%);
+ line-height: 1.65;
+}
+
+a {
+ color: var(--accent);
+ text-decoration-thickness: 1px;
+ text-underline-offset: 0.14em;
+}
+
+a:hover {
+ color: var(--accent-dark);
+}
+
+.site {
+ min-height: 100vh;
+ display: flex;
+ flex-direction: column;
+}
+
+.site-header {
+ border-bottom: 1px solid var(--line);
+ background: rgba(255, 255, 255, 0.94);
+ box-shadow: 0 1px 0 rgba(17, 24, 39, 0.03);
+}
+
+.header-inner {
+ width: min(980px, 92%);
+ margin: 0 auto;
+ padding: 22px 0 18px;
+}
+
+.site-title {
+ margin: 0;
+ font-size: 2.0rem;
+ font-weight: 600;
+}
+
+.site-title a {
+ color: var(--text);
+ text-decoration: none;
+}
+
+.site-description {
+ margin: 4px 0 16px;
+ color: var(--muted);
+ font-size: 0.95rem;
+}
+
+.main-nav {
+ display: flex;
+ flex-wrap: wrap;
+ gap: 10px 16px;
+}
+
+.main-nav a {
+ text-decoration: none;
+ color: var(--muted);
+ font-size: 0.95rem;
+ padding-bottom: 2px;
+ border-bottom: 1px solid transparent;
+}
+
+.main-nav a.active,
+.main-nav a:hover {
+ color: var(--accent-dark);
+ border-bottom-color: var(--accent-dark);
+}
+
+.page-content {
+ /* width: min(980px, 92%); */
+ margin: 0 5%;
+ padding: 32px 0 56px;
+ flex: 1;
+}
+
+.hero {
+ position: relative;
+ border-radius: 14px;
+ min-height: clamp(420px, 62vh, 620px);
+ background-size: cover;
+ background-position: center;
+ overflow: hidden;
+ box-shadow: 0 10px 30px rgba(31, 35, 40, 0.13);
+}
+
+.hero-overlay {
+ position: absolute;
+ inset: 0;
+ background: linear-gradient(180deg, rgba(14, 26, 32, 0.33), rgba(14, 26, 32, 0.5));
+}
+
+.hero-inner {
+ position: relative;
+ max-width: 760px;
+ margin: 0 auto;
+ padding: clamp(58px, 8vw, 92px) 26px;
+ text-align: center;
+ color: #fff;
+}
+
+.hero h1 {
+ margin: 0 0 20px;
+ font-size: clamp(1.9rem, 3.4vw, 2.8rem);
+ font-weight: 500;
+ line-height: 1.2;
+}
+
+.button {
+ display: inline-block;
+ border: 1px solid #fff;
+ border-radius: 999px;
+ padding: 10px 20px;
+ color: #192127;
+ background: #fff;
+ text-decoration: none;
+ font-size: 0.93rem;
+ font-weight: 500;
+}
+
+.button:hover {
+ color: #192127;
+ background: rgba(255, 255, 255, 0.88);
+}
+
+.hero-copy {
+ margin: 26px auto 0;
+ font-size: clamp(1.02rem, 1.55vw, 1.16rem);
+ line-height: 1.85;
+ max-width: 66ch;
+}
+
+.hero-copy strong {
+ font-weight: 500;
+}
+
+.content-block {
+ background: var(--card);
+ border: 1px solid var(--line);
+ border-radius: 14px;
+ padding: clamp(22px, 4vw, 38px);
+ box-shadow: 0 3px 18px rgba(31, 35, 40, 0.06);
+}
+
+.content-block>*:first-child {
+ margin-top: 0;
+}
+
+.content-block p {
+ max-width: 74ch;
+}
+
+.about-intro {
+ display: grid;
+ grid-template-columns: 260px 1fr;
+ gap: 32px;
+ align-items: center;
+}
+
+.about-photo {
+ width: 260px;
+ max-width: 100%;
+ aspect-ratio: 1 / 1;
+ object-fit: cover;
+ border-radius: 50%;
+ border: 3px solid #fff;
+ box-shadow: 0 8px 22px rgba(31, 35, 40, 0.16);
+}
+
+h2,
+h3 {
+ margin-top: 30px;
+ margin-bottom: 12px;
+ font-weight: 600;
+ line-height: 1.25;
+}
+
+ul {
+ margin: 0;
+ padding-left: 1.2rem;
+}
+
+li+li {
+ margin-top: 6px;
+}
+
+.services-lead {
+ text-align: center;
+ font-size: clamp(1.05rem, 2.1vw, 1.25rem);
+ margin: 0 auto 28px;
+ max-width: 56ch;
+ color: #2d3742;
+}
+
+.contact-grid {
+ /* display: grid; */
+ grid-template-columns: auto auto;
+ gap: 24px;
+}
+
+.contact-card {
+ border: 1px solid var(--line);
+ border-radius: 12px;
+ padding: 22px;
+ background: #fff;
+}
+
+.social-links {
+ display: flex;
+ flex-wrap: wrap;
+ gap: 10px;
+ padding: 0;
+ margin: 16px 0 0;
+ list-style: none;
+}
+
+.social-links a {
+ display: inline-block;
+ text-decoration: none;
+ border: 1px solid var(--line);
+ border-radius: 999px;
+ padding: 6px 10px;
+}
+
+.site-footer {
+ border-top: 1px solid var(--line);
+ background: #fbfaf8;
+}
+
+.site-footer p {
+ width: min(980px, 92%);
+ margin: 0 auto;
+ padding: 16px 0 22px;
+ font-size: 0.9rem;
+ color: var(--muted);
+}
+
+@media (max-width: 900px) {
+
+ .about-intro,
+ .contact-grid {
+ grid-template-columns: 1fr;
+ }
+
+ .about-photo {
+ width: min(240px, 100%);
+ margin: 0 auto;
+ }
+}
\ No newline at end of file
