/* Compact edition: more content above the fold, same luxury visual language. */
.site-header{height:72px}
.hero{min-height:510px;padding-top:34px;padding-bottom:38px;gap:48px}
h1{font-size:clamp(45px,5vw,70px);margin:15px 0}
.hero-lead{margin:18px 0 23px;line-height:1.55;font-size:14px}
.hero-proof{margin-top:30px}
.arch-frame{max-width:390px}
.trust-strip>div{padding:19px 25px}
.services-section{padding-top:76px;padding-bottom:72px}
.section-heading{margin-bottom:28px}
.section-heading h2{font-size:54px}
.service-card{min-height:184px;padding:21px 20px}
.service-card h3{font-size:21px;margin:16px 0 7px}
.service-card p{font-size:11px}
.price-note{margin-top:17px}
.about-section{padding:76px 0}
.about-grid{gap:62px}
.about-copy .large{font-size:19px}
.process-section{padding-top:75px;padding-bottom:75px}
.process-grid{margin-top:37px}
.process-card{padding:23px 25px;min-height:155px}
.process-card h3{margin:18px 0 7px;font-size:21px}
.contact-section{padding:68px 0}
.contact-grid{gap:48px}
.contact-grid h2{font-size:53px;margin:17px 0 27px}
.contact-details>div{padding:16px 0}
@media(max-width:800px){.hero{min-height:auto;padding-top:52px}.hero-visual{max-width:365px}.services-section{padding-top:64px}.about-section{padding-top:65px;padding-bottom:65px}.process-section{padding-top:65px;padding-bottom:65px}.contact-section{padding-top:60px;padding-bottom:60px}}
@media(max-width:480px){.site-header{height:64px}.hero{padding-top:42px;padding-bottom:45px}.hero-visual{width:82%}.section-heading h2,.contact-grid h2{font-size:47px}.service-card{min-height:165px}.services-section{padding-top:55px;padding-bottom:55px}.about-section,.process-section{padding-top:58px;padding-bottom:58px}.contact-section{padding:55px 0}}

.city-banner{max-width:1168px;height:260px;margin:0 auto;position:relative;overflow:hidden;background:#161616;color:var(--paper)}
.city-banner img{width:100%;height:100%;object-fit:cover;opacity:.82;display:block}
.city-banner:after{content:'';position:absolute;inset:0;background:linear-gradient(90deg,rgba(15,15,15,.96) 0%,rgba(15,15,15,.67) 38%,rgba(15,15,15,.05) 76%)}
.city-banner-copy{position:absolute;z-index:1;left:48px;top:50%;transform:translateY(-50%)}
.city-banner-copy h2{font-size:42px;margin:14px 0 10px}
.city-banner-copy p{font-size:12px;color:#c8c0b8;margin:0}
@media(max-width:600px){.city-banner{height:230px}.city-banner-copy{left:25px}.city-banner-copy h2{font-size:34px}}

.service-card{padding:0;overflow:hidden;min-height:190px;position:relative}
.service-card:after{content:'';position:absolute;z-index:0;right:8px;top:8px;width:54px;height:54px;background-image:url('assets/service-illustrations.webp');background-size:300% 200%;background-repeat:no-repeat;opacity:.26;pointer-events:none;border-radius:50%}
.service-visual-0:after{background-position:0 0}.service-visual-1:after{background-position:50% 0}.service-visual-2:after{background-position:100% 0}.service-visual-3:after{background-position:0 100%}.service-visual-4:after{background-position:50% 100%}.service-visual-5:after{background-position:100% 100%}
.service-card-body{padding:17px 18px 16px;display:flex;flex-direction:column;min-height:190px;height:100%;position:relative;z-index:1;padding-right:51px}
.service-card-body h3{margin:10px 0 5px;font-size:20px}
.service-card-body p{margin-bottom:10px}
.service-card-body .price{margin-top:auto}
@media(min-width:1100px){.services-grid{grid-template-columns:repeat(4,1fr)}}
@media(max-width:480px){.service-card{min-height:175px}.service-card-body{min-height:175px;padding:15px 15px 14px;padding-right:48px}.service-card-body h3{font-size:18px}.service-card:after{width:46px;height:46px}}

/* Mobile layout */
@media(max-width:600px){
  body{min-width:0}
  .section-wrap{padding-left:16px;padding-right:16px}
  .site-header{padding:0 16px;gap:12px}
  .brand{min-width:0;gap:7px}
  .brand-mark{width:29px;height:29px;min-width:29px;font-size:16px}
  .brand strong{font-size:9px;letter-spacing:.08em;white-space:normal;line-height:1.15;max-width:170px}
  .brand small{font-size:7px;letter-spacing:.09em}
  .menu-toggle{font-size:21px;padding:3px 0}
  .nav-links{font-size:12px;gap:0;box-shadow:0 12px 25px rgba(0,0,0,.08);border-bottom:1px solid var(--line)}
  .nav-links a{padding:12px 4px;border-bottom:1px solid var(--line)}
  .nav-links a:last-child{border-bottom:0}
  .hero{padding-top:42px;padding-bottom:38px;gap:38px}
  h1{font-size:46px;line-height:.98}
  .hero-lead{font-size:13px;line-height:1.6;margin-top:17px}
  .hero-actions{width:100%;gap:17px}
  .hero-actions .button{width:100%;padding:15px 16px}
  .hero-proof{margin-top:25px}
  .hero-visual{width:88%;max-width:330px}
  .seal{left:-22px;width:70px;height:70px}
  .seal span{font-size:26px}.seal small{font-size:5px}
  .visual-caption{right:-10px;padding:10px 13px;font-size:10px}
  .visual-caption span{font-size:20px}
  .trust-strip{margin:0 16px}
  .trust-strip>div{padding:17px 16px;grid-template-columns:27px 1fr}
  .strip-num{font-size:18px}
  .services-section{padding-top:54px;padding-bottom:50px}
  .section-heading h2{font-size:45px}
  .section-heading>p{font-size:12px;line-height:1.6;margin-top:17px}
  .service-tabs{flex-wrap:nowrap;overflow-x:auto;margin-right:-16px;padding-right:16px;padding-bottom:12px;scrollbar-width:none}
  .service-tabs::-webkit-scrollbar{display:none}
  .service-tabs button{flex:0 0 auto;font-size:9px;padding:9px 12px}
  .services-grid{grid-template-columns:1fr;gap:9px}
  .service-card{min-height:166px}
  .service-card-body{min-height:166px;padding:15px 15px 14px;padding-right:48px}
  .service-card-body h3{font-size:20px;line-height:1.05;margin:9px 0 5px}
  .service-card-body p{font-size:11px;line-height:1.4}
  .service-card .price{font-size:12px}
  .benefits-section{padding-top:44px;padding-bottom:48px}
  .benefits-heading h2{font-size:42px}
  .benefits-list p{font-size:11px;line-height:1.6;padding:13px 0}
  .about-section{padding:58px 0}
  .about-grid{gap:42px}
  .about-image{max-width:330px}
  .about-image span{font-size:14px;right:-9px;padding:12px 14px}
  .about-copy h2{font-size:46px}
  .about-copy .large{font-size:18px}
  .about-copy>p:not(.large){font-size:12px}
  .signature{font-size:21px}
  .process-section{padding-top:57px;padding-bottom:57px}
  .process-grid{margin-top:30px}
  .process-card{min-height:135px;padding:19px 20px}
  .process-card h3{font-size:20px;margin:15px 0 6px}
  .process-card p{font-size:11px;margin:0}
  .contact-section{padding:54px 0}
  .contact-grid{gap:38px}
  .contact-grid h2{font-size:43px;line-height:1;margin:16px 0 26px}
  .contact-details>div{grid-template-columns:92px 1fr;padding:14px 0}
  .contact-details strong{font-size:16px}
  .footer-inner{padding-left:16px;padding-right:16px;align-items:flex-start;flex-direction:column}
  .footer-inner .brand strong{max-width:230px}
}

.benefits-section{display:grid;grid-template-columns:.75fr 1.25fr;gap:80px;padding-top:55px;padding-bottom:72px;border-top:1px solid var(--line)}
.benefits-heading h2{font-size:47px;margin:16px 0 0}
.benefits-list{border-top:1px solid var(--line)}
.benefits-list p{font-size:12px;line-height:1.7;color:var(--muted);padding:15px 0;margin:0;border-bottom:1px solid var(--line)}
.benefits-list strong{color:var(--ink)}
@media(max-width:800px){.benefits-section{grid-template-columns:1fr;gap:25px;padding-top:45px;padding-bottom:55px}}

/* ⚠️ НА ТЕЛЕФОНЕ КНОПКА И ССЫЛКА СТОЯЛИ В РЯД, И ССЫЛКА УЕЗЖАЛА ЗА КРАЙ ЭКРАНА:
   выше по файлу кнопке задана ширина во всю строку, а направление колонкой
   приходило из другого файла и другого порога (480px) — между 480 и 600 ряд
   оставался рядом, а «Смотреть услуги» обрезалось бортиком экрана.
   Направление названо здесь же, у того порога, где кнопка растягивается. */
@media(max-width:600px){
  .hero-actions{flex-direction:column;align-items:stretch;gap:14px}
  .hero-actions .text-link{align-self:flex-start}
  /* Подпись «Точность в каждом акте» висела на 26px правее экрана. */
  .visual-caption{right:0}
}

/* Своя полоса прокрутки — в цветах сайта, чистым CSS. */
html{scrollbar-width:thin;scrollbar-color:var(--gold) var(--cream)}
::-webkit-scrollbar{width:10px;height:10px}
::-webkit-scrollbar-track{background:var(--cream)}
::-webkit-scrollbar-thumb{background:var(--gold);border:3px solid var(--cream);border-radius:10px}
::-webkit-scrollbar-thumb:hover{background:var(--ink)}
