@font-face {
    font-family: 'Mustang';
    src: local('Arial');
    font-display: swap;
}
:root { font-family: 'Mustang', Arial, Helvetica, sans-serif; color: #050d14; background: #fff; }
* { box-sizing: border-box; }
body {
    margin: 0;
    min-width: 280px;
    min-height: 100svh;
    background: radial-gradient(ellipse at 92% 14%, #eafbf3 0, transparent 42%), radial-gradient(ellipse at 9% 100%, #f0fcf7 0, transparent 36%), #fff;
    -webkit-font-smoothing: antialiased;
}
.landing {
    width: min(100%, 706px);
    margin-inline: auto;
    padding: 183px 29px 113px;
    container-type: inline-size;
}
.brand { display: flex; align-items: center; gap: 16px; }
.brand-mark {
    display: grid; place-items: center; flex: 0 0 78px; height: 78px;
    border-radius: 24px; background: linear-gradient(135deg, #11d56c, #00b65b);
    color: white; font-size: 40px; font-weight: 800;
    box-shadow: 0 12px 28px #00b96514;
}
.brand-name { font-size: 38px; font-weight: 800; letter-spacing: -1.8px; line-height: 1.15; }
.brand-caption { margin: 7px 0 0; color: #7b8490; text-transform: uppercase; font-size: 16px; letter-spacing: 1.3px; }
h1 { margin: 27px 0 23px; font-size: 74px; line-height: .9; font-weight: 950; letter-spacing: -3.6px; text-transform: uppercase; }
h1 span { color: #06bf62; }
.services { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 13px; }
.service-card { overflow: hidden; border: 2px solid #e1ebe6; border-radius: 30px; background: #edf8f3; box-shadow: 0 10px 24px #183c2810; }
/* Reuse only the illustration regions of the supplied artwork; all text stays live. */
.service-art { aspect-ratio: 203 / 166; background-image: url('services-reference.jpg'); background-size: 347.783% auto; background-repeat: no-repeat; }
.art-first { background-position: 6.36% 40.035%; }
.art-help { background-position: 50.3% 40.035%; }
.art-restore { background-position: 94.04% 40.035%; }
.service-card h2 { margin: 0; padding: 19px 14px 20px; font-size: 23px; line-height: 1; font-weight: 700; letter-spacing: -.35px; }
.contact-intro { margin: 16px 0; font-size: 23px; line-height: 1.22; color: #687482; }
.messengers { display: grid; gap: 13px; }
.social-btn { display: flex; align-items: center; gap: 30px; min-height: 97px; padding: 18px 23px; border-radius: 32px; color: #fff; font-size: 29px; font-weight: 750; text-decoration: none; box-shadow: 0 18px 28px #293f3510; transition: filter .18s, transform .18s; }
.social-btn:hover { filter: brightness(1.05); transform: translateY(-2px); }
.social-btn:focus-visible { outline: 3px solid #0d283c; outline-offset: 5px; }
.social-btn:active { transform: translateY(0); }
.tg { background: linear-gradient(110deg, #19aaed, #009bea); }
.vb { background: linear-gradient(110deg, #7631f6, #6424eb); }
.wa { background: linear-gradient(110deg, #0bc66c, #00b85c); }
.messenger-icon { display: grid; place-items: center; width: 54px; flex: 0 0 54px; }
.messenger-icon svg { display: block; width: 49px; height: 49px; }
.chevron { width: 20px; height: 32px; margin-left: auto; }
.trust { display: flex; align-items: center; justify-content: center; gap: 11px; width: fit-content; margin: 16px auto 0; padding: 11px 18px; border: 2px solid #deeee6; border-radius: 40px; background: #eaf8f1; color: #397f65; font-size: 18px; letter-spacing: .25px; white-space: nowrap; }
.trust span { width: 12px; height: 12px; border-radius: 50%; background: #08c56b; box-shadow: 0 0 0 6px #0bc66c0a, 0 0 12px #08c56b33; }
@media (max-width: 705px) {
    .landing { padding: 25.92vw 4.1vw 16vw; }
    .brand { gap: 2.27vw; }
    .brand-mark { flex-basis: 11.05vw; height: 11.05vw; border-radius: 3.4vw; font-size: 5.67vw; }
    .brand-name { font-size: 5.38vw; letter-spacing: -.25vw; }
    .brand-caption { margin-top: 1vw; font-size: 2.27vw; letter-spacing: .18vw; }
    h1 { margin: 3.82vw 0 3.26vw; font-size: 10.48vw; letter-spacing: -.51vw; }
    .services { gap: 1.84vw; }
    .service-card { border-radius: 4.25vw; border-width: 1px; }
    .service-card h2 { padding: 2.69vw 1.98vw 2.83vw; font-size: 3.26vw; letter-spacing: -.05vw; }
    .contact-intro { margin: 2.27vw 0; font-size: 3.26vw; }
    .messengers { gap: 1.84vw; }
    .social-btn { min-height: 13.74vw; padding: 2.55vw 3.26vw; gap: 4.25vw; border-radius: 4.53vw; font-size: 4.11vw; }
    .messenger-icon { width: 7.65vw; flex-basis: 7.65vw; }
    .messenger-icon svg { width: 6.94vw; height: 6.94vw; }
    .chevron { width: 2.83vw; height: 4.53vw; }
    .trust { margin-top: 2.27vw; padding: 1.56vw 2.55vw; gap: 1.56vw; font-size: 2.55vw; letter-spacing: .035vw; border-width: 1px; }
    .trust span { width: 1.7vw; height: 1.7vw; }
}
@media (min-width: 1000px) { .landing { padding-top: 80px; padding-bottom: 80px; } }
@media (prefers-reduced-motion: reduce) { .social-btn { transition: none; } }
/* Keep the reference proportions independent of the browser's scrollbar gutter. */
html { scrollbar-width: thin; scrollbar-color: #818581 transparent; overflow-x: hidden; }
body { width: 100vw; }
h1 { -webkit-text-stroke: .65px currentColor; }
@media (min-width: 706px) { h1 { font-size: 76px; } }
@media (max-width: 705px) { h1 { font-size: 10.76vw; -webkit-text-stroke: .09vw currentColor; } }