/* =========================================================
   ДАРСИ — «Мы берём на себя всю организацию».
   Светлый блок: центрированный заголовок и спокойное фото.
   ========================================================= */

.svc{
  --ink:#1B1418;
  --ink-2:#4A4046;
  --ink-3:#8A7F86;
  --paper:#FFFFFF;
  --hair:#E7DDE1;
  --rose:#E3A9BA;
  --rose-dark:#C07E93;

  position:relative;
  padding:clamp(56px,7vw,110px) var(--pad-x) clamp(56px,7vw,110px);
  background:
    radial-gradient(110% 80% at 50% 0%, #F7E6EA 0%, rgba(247,230,234,0) 62%),
    radial-gradient(90% 70% at 8% 100%, #EFEAE4 0%, rgba(239,234,228,0) 60%),
    #FAF6F4;
  color:var(--ink);
  letter-spacing:-.022em;
  overflow:hidden;
}
.svc__inner{width:100%; max-width:var(--maxw); margin:0 auto}

/* ---------- заголовок по центру ---------- */
.svc__head{text-align:center; margin:0 auto clamp(28px,3.6vw,52px)}
.svc__title{
  font-family:var(--f-head); font-weight:400;
  font-size:clamp(30px, 3.6vw, 50px); line-height:1; letter-spacing:-.015em;
  margin:0 0 14px;
}
.svc__sub{
  margin:0 auto; font-size:clamp(15px,1.2vw,18px); line-height:1.45;
  letter-spacing:-.03em; color:var(--ink-2); max-width:52ch;
}

/* ---------- сцена с фото ---------- */
.svc__stage{position:relative}
.svc__photo{
  width:100%; max-width:clamp(500px, 54vw, 800px);
  margin:0 auto; display:block; position:relative;
  transform-origin:center center;
  will-change:transform;
}
.svc__photo img{width:100%; height:auto; display:block}

/* ---------- бесконечные ряды остаются под фотографией ---------- */
.svc__marquees{
  --mq-gap:clamp(8px,1vw,14px);
  width:100%; margin-top:clamp(20px,2vw,28px);
  display:flex; flex-direction:column; gap:var(--mq-gap);
}
.mq{
  width:100%; overflow:hidden;
  -webkit-mask-image:linear-gradient(90deg,transparent 0,#000 3%,#000 97%,transparent 100%);
  mask-image:linear-gradient(90deg,transparent 0,#000 3%,#000 97%,transparent 100%);
}
.mq__track{
  display:flex; width:max-content; gap:var(--mq-gap);
  padding-right:var(--mq-gap);
  will-change:transform;
}
.mq__track--left{animation:svc-marquee-left var(--mq-duration,56s) linear infinite}
.mq__track--right{animation:svc-marquee-right var(--mq-duration,60s) linear infinite}
@keyframes svc-marquee-left{from{transform:translate3d(0,0,0)} to{transform:translate3d(-33.333333%,0,0)}}
@keyframes svc-marquee-right{from{transform:translate3d(-33.333333%,0,0)} to{transform:translate3d(0,0,0)}}
.tag{
  display:flex; align-items:center; gap:12px; flex:0 0 auto;
  min-width:0; white-space:nowrap;
  min-height:clamp(50px,3.8vw,60px); padding:12px clamp(16px,1.5vw,24px);
  background:#fff;
  border:1px solid rgba(203,181,190,.46);
  box-shadow:0 16px 34px -26px rgba(60,30,40,.55);
  color:var(--ink);
  font-size:clamp(14px,1vw,17px); font-weight:500; line-height:1.3; letter-spacing:-.03em;
}
.tag::before{
  content:''; width:11px; height:11px; flex:0 0 auto;
  background:var(--rose);
}

/* =========================================================
   АДАПТИВ
   ========================================================= */
@media (max-width:900px){
  .svc__photo{max-width:min(560px, 90vw)}
  .svc__photo{aspect-ratio:3/4; overflow:hidden}
  .svc__photo img{height:100%; object-fit:cover; object-position:65% 50%}
}

@media (max-width:720px){
  .svc{padding-bottom:calc(var(--bar-h, 0px) + env(safe-area-inset-bottom))}
  .svc__marquees{margin-top:18px; --mq-gap:8px}
  .tag{min-height:48px; padding:10px 12px; font-size:13px; gap:9px}
  .tag::before{width:9px; height:9px}
}

@media (prefers-reduced-motion:reduce){
  .mq{overflow:visible; -webkit-mask-image:none; mask-image:none}
  .mq__track{width:100%; flex-wrap:wrap; padding-right:0; animation:none; transform:none}
  .mq__track .tag[aria-hidden="true"]{display:none}
}