/* Grafik page + home founder section: "shadows of movement" section backgrounds.
   Sunlight through a studio window and soft shadows of women doing Pilates
   (side stretch, arabesque, teaser, mermaid). Generated — see images/shadows/. */
body[data-page="grafik"] main { overflow-x: clip; }
body[data-page="grafik"] main>section { position: relative; isolation: isolate; }
body[data-page="grafik"] main>section::before, body[data-page="grafik"] main>section::after {
  content: ""; position: absolute; top: 0; bottom: 0; left: calc(50% - 50vw); right: calc(50% - 50vw); z-index: -1; pointer-events: none;
}
body[data-page="grafik"] #ekip.classes { background: transparent; }
body[data-page="grafik"] #ekip>.wrap { position: relative; }

/* 1 — booking: warm sunlit wall, starts under the header so there is no edge below the menu */
body[data-page="grafik"] main>section:nth-of-type(1)::before { top: -220px; background: linear-gradient(115deg, #FDFBF7 0%, #EFE6DB 60%, #E3D5C7 100%); -webkit-mask-image: linear-gradient(180deg, #000 0, #000 62%, transparent 100%); mask-image: linear-gradient(180deg, #000 0, #000 62%, transparent 100%); }
/* 3D silk ribbons (shaded folds, sheen, soft shadow) rising from bottom-left towards the booking card (images/waves).
   The SVG is static; the whole layer drifts with a transform, which the GPU moves without repainting the image */
body[data-page="grafik"] main>section:nth-of-type(1)::after {
  top: -220px; background: url("../images/waves/grafik-waves.svg?v=4") center / cover no-repeat;
  -webkit-mask-image: linear-gradient(180deg, #000 0, #000 70%, transparent 100%); mask-image: linear-gradient(180deg, #000 0, #000 70%, transparent 100%);
  animation: silk-drift 24s ease-in-out infinite alternate; will-change: transform;
}
@keyframes silk-drift { from { transform: translate(-1.2%, .8%) scale(1.04); } to { transform: translate(1.2%, -.8%) scale(1.04); } }
@media (prefers-reduced-motion: reduce) { body[data-page="grafik"] main>section:nth-of-type(1)::after { animation: none; } }

/* 2 — weekly schedule: plain cream; the sections around it fade into it (no hard edges) */
body[data-page="grafik"] main>section:nth-of-type(2) { padding-top: clamp(40px, 5vw, 80px); }
body[data-page="grafik"] main>section:nth-of-type(2)::before { content: none; }
body[data-page="grafik"] main>section:nth-of-type(2)::after { content: none; }

/* 3 — instructor: warm light from the other side, teaser on the right, mermaid on the left */
body[data-page="grafik"] #ekip { padding-top: clamp(90px, 10vw, 150px); }
body[data-page="grafik"] #ekip::before { background: linear-gradient(245deg, #FDFBF7 0%, #EFE6DB 55%, #D0B9A7 100%); -webkit-mask-image: linear-gradient(180deg, transparent 0, #000 32%, #000 82%, transparent 100%); mask-image: linear-gradient(180deg, transparent 0, #000 32%, #000 82%, transparent 100%); }
body[data-page="grafik"] #ekip::after { content: none; }
body[data-page="grafik"] #ekip>.wrap::before, body[data-page="grafik"] #ekip>.wrap::after {
  content: ""; position: absolute; z-index: -1; width: min(720px, 44vw); aspect-ratio: 1000 / 520; pointer-events: none;
}
body[data-page="grafik"] #ekip>.wrap::before { top: 34%; right: max(-14vw, calc(50% - 50vw - 80px)); background: url("../images/shadows/grafik-r-static.svg?v=4") center / contain no-repeat; }
body[data-page="grafik"] #ekip>.wrap::after { top: 58%; left: max(-14vw, calc(50% - 50vw - 80px)); background: url("../images/shadows/grafik-l-static.svg?v=5") center / contain no-repeat; }

@media (max-width: 760px) {
  body[data-page="grafik"] main>section:nth-of-type(1)::after { background-size: 340% auto; background-position: 58% 0; }
  body[data-page="grafik"] #ekip>.wrap::before { top: 24%; right: -30vw; width: 90vw; }
  body[data-page="grafik"] #ekip>.wrap::after { top: auto; bottom: -40px; left: -30vw; width: 90vw; }
}
@media (prefers-reduced-motion: reduce) {
  body[data-page="grafik"] #ekip>.wrap::before { background-image: url("../images/shadows/grafik-r-static.svg?v=4"); }
  body[data-page="grafik"] #ekip>.wrap::after { background-image: url("../images/shadows/grafik-l-static.svg?v=5"); }
}

/* Home — founder section: same sunlit wall with Pilates shadows, faded in/out so there are no edges */
body[data-page="home"] #osnovatel { position: relative; isolation: isolate; overflow-x: clip; }
body[data-page="home"] #osnovatel::before, body[data-page="home"] #osnovatel::after { content: ""; position: absolute; z-index: -1; pointer-events: none; }
body[data-page="home"] #osnovatel::before {
  inset: 0;
  background: linear-gradient(115deg, #FDFBF7 0%, #EFE6DB 58%, #E3D5C7 100%);
  -webkit-mask-image: linear-gradient(180deg, transparent 0, #000 18%, #000 82%, transparent 100%);
          mask-image: linear-gradient(180deg, transparent 0, #000 18%, #000 82%, transparent 100%);
}
body[data-page="home"] #osnovatel::after {
  top: 2%; right: -6vw; width: min(980px, 60vw); aspect-ratio: 1000 / 520;
  background: url("../images/shadows/founder-static.svg?v=4") center / contain no-repeat;
}
@media (max-width: 760px) {
  body[data-page="home"] #osnovatel::after { top: auto; bottom: 4%; right: -24vw; width: 120vw; opacity: .8; }
}
@media (prefers-reduced-motion: reduce) {
  body[data-page="home"] #osnovatel::after { background-image: url("../images/shadows/founder-static.svg?v=4"); }
}

/* Home — testimonials: light from the other side, teaser + mermaid shadows behind the heading and cards */
body[data-page="home"] #otzivi { position: relative; isolation: isolate; overflow-x: clip; }
body[data-page="home"] #otzivi::before, body[data-page="home"] #otzivi::after { content: ""; position: absolute; z-index: -1; pointer-events: none; }
body[data-page="home"] #otzivi::before {
  inset: 0;
  background: linear-gradient(245deg, #FDFBF7 0%, #EFE6DB 55%, #E3D5C7 100%);
  -webkit-mask-image: linear-gradient(180deg, transparent 0, #000 16%, #000 84%, transparent 100%);
          mask-image: linear-gradient(180deg, transparent 0, #000 16%, #000 84%, transparent 100%);
}
body[data-page="home"] #otzivi::after {
  top: 0; right: 1vw; width: min(720px, 48vw); aspect-ratio: 1000 / 520;
  background: url("../images/shadows/reviews-static.svg?v=5") center / contain no-repeat;
}
@media (max-width: 760px) {
  body[data-page="home"] #otzivi::after { top: -40px; right: -24vw; width: 100vw; opacity: .7; }
}
@media (prefers-reduced-motion: reduce) {
  body[data-page="home"] #otzivi::after { background-image: url("../images/shadows/reviews-static.svg?v=5"); }
}

/* Цени + Блог pages */
body[data-page="ceni"] main, body[data-page="blog"] main { overflow-x: clip; }
body[data-page="ceni"] .page-intro { position: relative; isolation: isolate; }
body[data-page="ceni"] .page-intro::before, body[data-page="ceni"] .page-intro::after { content: ""; position: absolute; z-index: -1; pointer-events: none; left: calc(50% - 50vw); right: calc(50% - 50vw); }
body[data-page="ceni"] .page-intro::before {
  top: -220px; bottom: 0;
  background: linear-gradient(115deg, #FDFBF7 0%, #EFE6DB 58%, #E3D5C7 100%);
  -webkit-mask-image: linear-gradient(180deg, #000 0, #000 76%, transparent 100%);
          mask-image: linear-gradient(180deg, #000 0, #000 76%, transparent 100%);
}
body[data-page="ceni"] .page-intro::after {
  top: 0; bottom: 0;
  background:
    url("../images/shadows/ceni-l-static.svg?v=5") left -3vw center / min(620px, 40vw) auto no-repeat,
    url("../images/shadows/ceni-r-static.svg?v=4") right -3vw center / min(620px, 40vw) auto no-repeat;
}
@media (max-width: 760px) {
  body[data-page="ceni"] .page-intro::after { opacity: .65; background-size: 62vw auto, 62vw auto; background-position: left -18vw bottom, right -18vw bottom; }
}
@media (prefers-reduced-motion: reduce) {
  body[data-page="ceni"] .page-intro::after { background-image: url("../images/shadows/ceni-l-static.svg?v=5"), url("../images/shadows/ceni-r-static.svg?v=4"); }
}
body[data-page="ceni"] #vaprosi { position: relative; isolation: isolate; }
body[data-page="ceni"] #vaprosi::before, body[data-page="ceni"] #vaprosi::after { content: ""; position: absolute; z-index: -1; pointer-events: none; left: calc(50% - 50vw); right: calc(50% - 50vw); }
body[data-page="ceni"] #vaprosi::before {
  top: 0; bottom: 0;
  background: linear-gradient(245deg, #FDFBF7 0%, #EFE6DB 58%, #E3D5C7 100%);
  -webkit-mask-image: linear-gradient(180deg, transparent 0, #000 18%, #000 76%, transparent 100%);
          mask-image: linear-gradient(180deg, transparent 0, #000 18%, #000 76%, transparent 100%);
}
body[data-page="ceni"] #vaprosi::after {
  top: 12%; bottom: 0;
  background:
    url("../images/shadows/faq-l-static.svg?v=4") left -3vw top / min(620px, 40vw) auto no-repeat,
    url("../images/shadows/faq-r-static.svg?v=4") right -3vw top / min(620px, 40vw) auto no-repeat;
}
@media (max-width: 760px) {
  body[data-page="ceni"] #vaprosi::after { opacity: .65; background-size: 62vw auto, 62vw auto; background-position: left -18vw bottom, right -18vw bottom; }
}
@media (prefers-reduced-motion: reduce) {
  body[data-page="ceni"] #vaprosi::after { background-image: url("../images/shadows/faq-l-static.svg?v=4"), url("../images/shadows/faq-r-static.svg?v=4"); }
}
body[data-page="blog"] .page-intro { position: relative; isolation: isolate; }
body[data-page="blog"] .page-intro::before, body[data-page="blog"] .page-intro::after { content: ""; position: absolute; z-index: -1; pointer-events: none; left: calc(50% - 50vw); right: calc(50% - 50vw); }
body[data-page="blog"] .page-intro::before {
  top: -220px; bottom: 0;
  background: linear-gradient(115deg, #FDFBF7 0%, #EFE6DB 58%, #E3D5C7 100%);
  -webkit-mask-image: linear-gradient(180deg, #000 0, #000 76%, transparent 100%);
          mask-image: linear-gradient(180deg, #000 0, #000 76%, transparent 100%);
}
body[data-page="blog"] .page-intro::after {
  top: 0; bottom: 0;
  background:
    url("../images/shadows/blog-l-static.svg?v=5") left -3vw center / min(620px, 40vw) auto no-repeat,
    url("../images/shadows/blog-r-static.svg?v=4") right -3vw center / min(620px, 40vw) auto no-repeat;
}
@media (max-width: 760px) {
  body[data-page="blog"] .page-intro::after { opacity: .65; background-size: 62vw auto, 62vw auto; background-position: left -18vw bottom, right -18vw bottom; }
}
@media (prefers-reduced-motion: reduce) {
  body[data-page="blog"] .page-intro::after { background-image: url("../images/shadows/blog-l-static.svg?v=5"), url("../images/shadows/blog-r-static.svg?v=4"); }
}

/* Home founder: instead of the soft fade, the wall is cut with long swoops (different from the
   scratch-card waves), each traced by a thin gold line that curls into a little loop */
body[data-page="home"] #osnovatel { --swoop: clamp(60px, 8vw, 110px); padding-block: calc(var(--swoop) + clamp(16px, 2vw, 24px)); }
body[data-page="home"] #osnovatel::before {
  background:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 100' preserveAspectRatio='none'%3E%3Cpath d='M0 46C300 112 640 26 900 60c40 6 74-12 64-34s-48-8-42 20c10 44 220 46 518-8' fill='none' stroke='%23F4EADC' stroke-opacity='.85' stroke-width='1.4' vector-effect='non-scaling-stroke'/%3E%3C/svg%3E") top / 100% var(--swoop) no-repeat,
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 100' preserveAspectRatio='none'%3E%3Cpath d='M1440 38C1180 80 940 4 700 42c-40 6-80-6-72-30s46-12 40 16c-14 50-300 58-668 12' fill='none' stroke='%23F4EADC' stroke-opacity='.85' stroke-width='1.4' vector-effect='non-scaling-stroke'/%3E%3C/svg%3E") bottom / 100% var(--swoop) no-repeat,
    linear-gradient(115deg, #E6D8C8 0%, #D3BEA9 55%, #BFA28A 100%);
  -webkit-mask:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 100' preserveAspectRatio='none'%3E%3Cpath d='M0 22C300 92 660 2 960 34S1340 64 1440 6V100H0Z'/%3E%3C/svg%3E") top / 100% var(--swoop) no-repeat,
    linear-gradient(#000, #000) center / 100% calc(100% - 2 * var(--swoop) + 2px) no-repeat,
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 100' preserveAspectRatio='none'%3E%3Cpath d='M0 0H1440V60C1180 100 940 26 660 64S220 98 0 66Z'/%3E%3C/svg%3E") bottom / 100% var(--swoop) no-repeat;
          mask:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 100' preserveAspectRatio='none'%3E%3Cpath d='M0 22C300 92 660 2 960 34S1340 64 1440 6V100H0Z'/%3E%3C/svg%3E") top / 100% var(--swoop) no-repeat,
    linear-gradient(#000, #000) center / 100% calc(100% - 2 * var(--swoop) + 2px) no-repeat,
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 100' preserveAspectRatio='none'%3E%3Cpath d='M0 0H1440V60C1180 100 940 26 660 64S220 98 0 66Z'/%3E%3C/svg%3E") bottom / 100% var(--swoop) no-repeat;
}

/* Home — testimonials, second take: deep mocha cut with waves and a thin gold line (like the scratch
   card section, but a different wave and a plain warm colour instead of the studio photo); no shadows */
body[data-page="home"] #otzivi { --wv: clamp(48px, 6.5vw, 96px); padding-block: calc(var(--wv) + clamp(32px, 4vw, 56px)); }
body[data-page="home"] #otzivi::after { content: none; }
body[data-page="home"] #otzivi::before {
  background:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 90' preserveAspectRatio='none'%3E%3Cpath d='M0 70C220 34 420 30 640 58S1080 96 1260 46C1340 24 1400 26 1440 32' fill='none' stroke='%23D9C3A5' stroke-opacity='.8' stroke-width='1.4' vector-effect='non-scaling-stroke'/%3E%3C/svg%3E") top / 100% var(--wv) no-repeat,
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 90' preserveAspectRatio='none'%3E%3Cpath d='M0 26C180 62 380 66 600 36S1060 0 1260 44C1350 64 1410 60 1440 54' fill='none' stroke='%23D9C3A5' stroke-opacity='.8' stroke-width='1.4' vector-effect='non-scaling-stroke'/%3E%3C/svg%3E") bottom / 100% var(--wv) no-repeat,
    radial-gradient(55% 60% at 18% 30%, rgba(208, 185, 167, .22), transparent 70%),
    radial-gradient(50% 60% at 85% 75%, rgba(40, 30, 24, .45), transparent 70%),
    linear-gradient(160deg, #6E5A4B 0%, #5E4C3F 55%, #4E3F35 100%);
  -webkit-mask:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 90' preserveAspectRatio='none'%3E%3Cpath d='M0 54C220 18 420 14 640 42S1080 80 1260 30C1340 8 1400 10 1440 16V90H0Z'/%3E%3C/svg%3E") top / 100% var(--wv) no-repeat,
    linear-gradient(#000, #000) center / 100% calc(100% - 2 * var(--wv) + 2px) no-repeat,
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 90' preserveAspectRatio='none'%3E%3Cpath d='M0 0H1440V70C1410 76 1350 80 1260 60 1060 16 820 20 600 52S180 78 0 42Z'/%3E%3C/svg%3E") bottom / 100% var(--wv) no-repeat;
          mask:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 90' preserveAspectRatio='none'%3E%3Cpath d='M0 54C220 18 420 14 640 42S1080 80 1260 30C1340 8 1400 10 1440 16V90H0Z'/%3E%3C/svg%3E") top / 100% var(--wv) no-repeat,
    linear-gradient(#000, #000) center / 100% calc(100% - 2 * var(--wv) + 2px) no-repeat,
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 90' preserveAspectRatio='none'%3E%3Cpath d='M0 0H1440V70C1410 76 1350 80 1260 60 1060 16 820 20 600 52S180 78 0 42Z'/%3E%3C/svg%3E") bottom / 100% var(--wv) no-repeat;
}
body[data-page="home"] #otzivi .testi-head .eyebrow,
body[data-page="home"] #otzivi .testi-head .h-lg,
body[data-page="home"] #otzivi .testi-head .italic { color: var(--white); }
body[data-page="home"] #otzivi .testi { box-shadow: 0 30px 60px -34px rgba(10, 6, 4, .8); }