:root{
      --red:#d50000;
      --blue:#0d47a1;
      --green:#2da77a;
      --ink:#0f172a;
      --milk:#fbfcff; /* молочно-белый */
    }
    *{box-sizing:border-box}
    html,body{
      margin:0;padding:0;font-family:"Inter",system-ui,-apple-system,Segoe UI,Roboto,"Helvetica Neue",Arial,"Noto Sans";
      color:var(--ink);line-height:1.55;
      /* Мягкие цветные полосы под основными блоками */
      background:
        /* осветляющая вуаль поверх фото для читабельности блоков */
        linear-gradient(180deg, rgba(255,255,255,.92), rgba(255,255,255,.92)),
        /* широкие ненавязчивые линии (красно-сине-зелёные) */
        linear-gradient(90deg,
          rgba(255,0,92,.055) 0%,  rgba(255,0,92,.055) 18%,
          rgba(255,255,255,0) 18%, rgba(255,255,255,0) 34%,
          rgba(13,71,161,.06) 34%, rgba(13,71,161,.06) 52%,
          rgba(255,255,255,0) 52%, rgba(255,255,255,0) 70%,
          rgba(45,167,122,.06) 70%, rgba(45,167,122,.06) 88%,
          rgba(255,255,255,0) 88%, rgba(255,255,255,0) 100%
        );
      background-size: auto, auto;
      background-position: 0 0, 0 0;
      background-repeat: no-repeat, no-repeat;
      /* без fixed ради мобильной плавности (iOS) */
      background-attachment: scroll, scroll;
    }
    a{color:inherit;text-decoration:none}
    a:focus-visible, button:focus-visible{outline:3px solid var(--blue);outline-offset:4px}
    section[id]{scroll-margin-top:80px}
    img{max-width:100%;height:auto;display:block}
    .container{max-width:1100px;margin:0 auto;padding:0 16px}

    /* Buttons */
    .btn{display:inline-block;min-height:48px;padding:12px 20px;border:2px solid transparent;border-radius:14px;font:inherit;font-weight:700;line-height:1.55;text-align:center;transition:.2s ease;cursor:pointer;white-space:nowrap}
    .btn-primary{background:linear-gradient(90deg,var(--red),#ff1744);color:#fff;box-shadow:0 8px 20px rgba(213,0,0,.22)}
    .btn-primary:hover{transform:translateY(-1px);box-shadow:0 10px 24px rgba(213,0,0,.32)}
    .btn-outline{border:2px solid var(--blue);color:var(--blue);background:#fff}
    .btn-outline:hover{background:rgba(13,71,161,.06)}

    /* Header */
    header{position:sticky;top:0;z-index:30;background:#fff;border-bottom:1px solid #e5e7eb;backdrop-filter:saturate(180%) blur(6px)}
    .nav{display:flex;align-items:center;justify-content:space-between;height:64px}
    .logo{display:flex;gap:10px;align-items:center;font-weight:800;min-height:48px}
    .logo svg{flex-shrink:0}
    .menu-toggle{display:none;min-height:48px;min-width:48px;padding:10px 14px;border:1px solid #cbd5e1;border-radius:10px;background:#fff;color:var(--ink);font:inherit;font-weight:600;cursor:pointer}

    .menu-scroller{max-width:100%}
    .menu{display:flex;gap:18px;font-weight:600;flex-wrap:nowrap;white-space:nowrap}
    .menu a{
      display:flex;align-items:center;min-height:48px;padding:10px 12px;border-radius:10px;
      white-space:nowrap;word-break:normal;-webkit-hyphens:none;hyphens:none;
      flex:0 0 auto;
    }
    .menu a:hover{background:#f1f5f9}

    /* Hero */
    .hero{
      background:
        radial-gradient(1200px 400px at 10% -20%, rgba(13,71,161,.08), transparent 60%),
        radial-gradient(800px 300px at 90% -10%, rgba(213,0,0,.10), transparent 60%);
      padding:32px 0 24px
    }
    .hero-panel{position:relative;overflow:hidden;border-radius:24px;background:#f8f3e8}
    .hero-panel::before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,#f8f3e8 0%,rgba(248,243,232,.96) 26%,rgba(248,243,232,.82) 43%,rgba(248,243,232,0) 64%);pointer-events:none}
    .hero-art{display:block}
    .hero-art img{width:100%;aspect-ratio:16/9;object-fit:cover}
    .hero-copy{position:absolute;z-index:1;left:5%;top:50%;transform:translateY(-50%);width:43%}
    .hero-copy h1{font-size:clamp(30px,3.2vw,42px);margin:12px 0 16px}
    .hero-copy .lead{font-size:16px;line-height:1.6;margin:0;max-width:430px}
    .hero-copy .btn,.contact-wrap .btn{padding:12px 14px;white-space:normal}
    h1{font-size:clamp(28px,3vw,40px);line-height:1.1;margin:14px 0 8px;font-weight:800}
    .stroke{position:relative;color:var(--ink);-webkit-text-stroke:3px rgba(255,255,255,.95);paint-order:stroke fill;text-shadow:0 1px 0 rgba(255,255,255,.8), 0 2px 6px rgba(2,6,23,.08)}
    .lead{font-size:clamp(16px,2.2vw,19px);color:#334155}
    .cta{display:flex;gap:12px;flex-wrap:wrap;margin-top:16px}
    .video-wrap{position:relative;width:100%;padding-top:56.25%;border-radius:18px;overflow:hidden;border:6px solid #fff;box-shadow:0 16px 40px rgba(13,71,161,.12)}
    .video-wrap video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;background:#000}
    .video-section{padding:32px 0}
    .video-section .video-wrap{max-width:820px;margin:0 auto}
    .video-section .video-box{max-width:820px;margin:0 auto}
    .video-wrap [hidden]{display:none}
    .video-preview{position:absolute;inset:0;width:100%;height:100%;padding:0;border:0;background:#f8f3e8;color:var(--ink);font:inherit;text-align:left;cursor:pointer}
    .video-preview picture,.video-preview img{display:block;width:100%;height:100%;object-fit:cover}
    .video-preview::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(251,252,255,.88),rgba(251,252,255,.3) 48%,transparent 75%);pointer-events:none}
    .video-preview-title{position:absolute;z-index:1;top:7%;left:5%;font-size:clamp(20px,3vw,34px);font-weight:800;line-height:1.2}
    .video-preview-title small{display:block;margin-top:6px;font-size:.62em;font-weight:600}
    .video-play{position:absolute;z-index:1;top:56%;left:50%;transform:translate(-50%,-50%);display:flex;align-items:center;justify-content:center;width:clamp(56px,10vw,88px);height:clamp(56px,10vw,88px);border:3px solid #fff;border-radius:50%;background:var(--red);color:#fff;box-shadow:0 6px 24px rgba(15,23,42,.22)}
    .video-play svg{width:34%;height:34%;margin-left:5%}
    .video-preview:hover .video-play{background:#b80000}
    .video-preview:focus-visible{outline-offset:-6px;outline:4px solid var(--blue)}
    .video-message a{color:var(--blue);text-decoration:underline;text-underline-offset:3px}

    /* Sections */
    section{padding:56px 0}
    .section-title{font-size:26px;margin:0 0 18px;font-weight:800}
    .grid{display:grid;gap:18px}
    .grid.cols-3{grid-template-columns:repeat(3,1fr)}
    .card{background:#fff;border:1px solid #e5e7eb;border-radius:16px;padding:18px}
    .card h3{margin:0 0 8px;font-size:18px}
    .card p{margin:0;color:#475569}
    .service-art{display:block;margin-bottom:18px;border-radius:10px;overflow:hidden;background:#f8f3e8}
    .service-art img{width:100%;aspect-ratio:3/2;object-fit:cover}
    .list{margin:8px 0 0;padding:0 0 0 18px;color:#475569}
    .list li{margin:6px 0}
    .stripe{
      background:
        radial-gradient(1200px 400px at 10% -20%, rgba(13,71,161,.06), transparent 60%),
        linear-gradient(135deg, rgba(13,71,161,.10) 0%, rgba(255,255,255,.96) 40%, rgba(213,0,0,.10) 100%);
      padding:28px;border-radius:18px;border:1px solid #e5e7eb;box-shadow:0 8px 24px rgba(2,6,23,.06)
    }

    .muted{color:#64748b;font-size:14px}
    .contact-wrap{
      background: linear-gradient(135deg,
        rgba(13,71,161,.06),
        rgba(45,167,122,.06) 55%,
        rgba(213,0,0,.06));
      border: 1px solid #e5e7eb;border-radius: 18px;padding: 24px;
      box-shadow: 0 8px 24px rgba(2,6,23,.06);
      margin-top:0;
    }
    .contact-wrap .section-title{ margin-bottom: 6px }
    .contact-wrap{display:grid;grid-template-columns:1.1fr 1fr;gap:32px;align-items:start}
    .contact-copy p{max-width:520px;color:#475569}
    .contact-wrap .section-title{text-align:left}
    .contact-details{padding:24px;border:1px solid #e2e8f0;border-radius:14px;background:#fff}
    .contact-details p{margin:0 0 12px}
    .contact-person{font-weight:800;font-size:18px}
    .contact-link{display:flex;flex-wrap:wrap;gap:4px 12px;align-items:center;justify-content:space-between;min-height:52px;padding:12px 0;border-top:1px solid #e2e8f0;color:var(--blue)}
    .contact-link strong{font-weight:600}
    .contact-link strong{overflow-wrap:anywhere}
    .contact-link:hover strong{text-decoration:underline;text-underline-offset:4px}
    .contact-map{grid-column:1/-1;border:0;width:100%;height:320px;border-radius:14px;background:#f1f5f9}
    .contact-address{font-style:normal}
    .service-link{display:inline-flex;align-items:center;gap:10px;min-height:48px;margin-top:14px;color:var(--blue);font-weight:700}
    .service-link:hover{text-decoration:underline;text-underline-offset:4px}
    .breadcrumbs{display:flex;flex-wrap:wrap;gap:6px 10px;margin-bottom:24px;font-size:14px;color:#475569}
    .breadcrumbs a{color:var(--blue);text-decoration:underline;text-underline-offset:4px;min-height:44px;display:inline-flex;align-items:center}
    .breadcrumbs span{display:inline-flex;align-items:center;min-height:44px}
    .service-intro{padding-top:24px;padding-bottom:32px}
    .service-heading{display:grid;grid-template-columns:1.15fr 1fr;gap:32px;align-items:center}
    .service-heading h1{font-size:clamp(30px,3.5vw,44px);line-height:1.16;margin:0 0 20px}
    .service-heading p{color:#475569;max-width:600px}
    .service-heading .service-art{margin:0;border-radius:18px}
    .service-navigation{display:flex;flex-wrap:wrap;gap:8px 16px;margin-top:24px}
    .service-navigation a{display:flex;align-items:center;min-height:48px;color:var(--blue);font-weight:600;text-decoration:underline;text-underline-offset:4px}
    .service-section{padding:32px 0}
    .service-section h2{font-size:28px;line-height:1.25;margin:0 0 20px}
    .service-steps{list-style:none;counter-reset:steps;display:grid;grid-template-columns:repeat(2,1fr);gap:18px;margin:0;padding:0}
    .service-steps li{counter-increment:steps;background:#fff;border:1px solid #e5e7eb;border-radius:16px;padding:24px}
    .service-steps li::before{content:counter(steps,decimal-leading-zero);display:block;margin-bottom:12px;color:var(--blue);font-size:22px;font-weight:800}
    .service-steps h3{font-size:18px;margin:0 0 8px}
    .service-steps p{margin:0;color:#475569}
    .service-note{padding:24px;margin-top:24px;border-left:4px solid var(--green);border-radius:0 14px 14px 0;background:#fff;color:#475569}
    .service-note p{margin:0}
    .service-note a{color:var(--blue);text-decoration:underline;text-underline-offset:4px}
    .faq-list{max-width:820px}
    .faq-list details{padding:0 20px;border:1px solid #e2e8f0;border-radius:14px;background:#fff;margin-bottom:12px}
    .faq-list summary{padding:18px 0;cursor:pointer;font-weight:700;min-height:56px}
    .faq-list summary:focus-visible{outline:3px solid var(--blue);outline-offset:4px}
    .faq-list p{margin:0 0 20px;color:#475569}
    .related-services{display:grid;grid-template-columns:repeat(2,1fr);gap:18px}
    .related-services a{padding:24px;background:#fff;border:1px solid #e2e8f0;border-radius:16px;color:var(--blue);font-weight:700}
    .related-services a:hover{text-decoration:underline;text-underline-offset:4px}


    /* Footer */
    footer{padding:28px 0;border-top:1px solid #e5e7eb;background:#fff}
    .footer-wrap{display:flex;flex-wrap:wrap;gap:14px;align-items:center;justify-content:space-between}
    .mini{font-size:13px;color:#64748b}
    .footer-links{display:flex;flex-wrap:wrap;gap:8px}
    .footer-links a{display:flex;align-items:center;min-height:48px;padding:10px 12px;border-radius:10px;color:var(--blue);font-size:14px}
    .footer-links a:hover{background:#f1f5f9}
    .footer-bottom{margin-top:16px;padding-top:16px;border-top:1px solid #e5e7eb}

    /* ======= АДАПТИВ ======= */
    @media (max-width: 1100px){
      .container{padding:0 14px}
    }
    @media (max-width: 960px){
      .hero-copy{position:static;transform:none;width:100%;padding:30px}
      .hero-panel::before{display:none}
      .hero-copy h1{max-width:620px;font-size:36px}
      .hero-copy .lead{max-width:680px}
      .hero-art img{aspect-ratio:16/7}
      /* услуги: с 3 до 2 колонок */
      .grid.cols-3{grid-template-columns:repeat(2,1fr)}
    }
    @media (max-width: 768px){
      .nav{height:auto;min-height:64px;flex-wrap:wrap;gap:8px;padding-top:8px;padding-bottom:8px}
      .logo{font-size:15px;white-space:nowrap}
      .menu-scroller{flex-basis:100%;width:100%}
      .menu{flex-direction:column;gap:4px;font-size:16px;padding:8px 0}
      .menu a{width:100%;min-height:48px;padding:10px 12px}
      .js-menu .menu-toggle{display:inline-flex;align-items:center;justify-content:center}
      .js-menu .menu-scroller{display:none}
      .js-menu .menu-scroller.is-open{display:block}
      .footer-wrap{align-items:flex-start}
      .footer-links{width:100%}
    }
    @media (max-width: 680px){
      .contact-wrap{grid-template-columns:1fr;gap:24px;padding:22px}
      .contact-details{padding:18px}
      .contact-wrap .btn{max-width:100%;white-space:normal}
      .service-heading{grid-template-columns:1fr;gap:24px}
      .service-steps,.related-services{grid-template-columns:1fr}
      .service-section h2{font-size:25px}
      .service-heading h1{font-size:clamp(28px,8vw,36px)}
      .hero{padding-top:20px}
      .hero-panel{border-radius:18px}
      .hero-copy{padding:26px 22px}
      .hero-copy h1{font-size:clamp(26px,7.8vw,34px)}
      .hero-art img{aspect-ratio:4/5}
      /* услуги: В ОДНУ КОЛОНКУ, строго по порядку */
      .grid.cols-3{grid-template-columns:1fr}

      /* О Жанне: текст сверху, фото ниже */
      #about .grid{grid-template-columns:1fr !important}
      #about .about-text{order:1}
      #about .about-photo{order:2;margin-top:8px}
      #about img{width:100%;max-width:520px;margin:0 auto;border-radius:12px;box-shadow:0 10px 28px rgba(2,6,23,.08)}
      .section-title{text-align:center;text-wrap:balance}
    }
    @media (prefers-reduced-motion: reduce){
      .btn{transition:none}
      .btn-primary:hover{transform:none}
    }