/* JULIA V6 — one kinetic visual language across the whole studio, with a static, readable base.
   Global shapes are an editorial filament, gem halo, optical arch and precise micro-typography. */

:root {
  --v6-aubergine:#3c284e; --v6-lilac:#b68fc9; --v6-pearl:#f6f0f5;
  /* The arrow is an atelier needle, engraved with a small circular rivet. */
  --julia-arrow-diag:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M5.3 18.7C8.7 17.7 9.5 14.8 11.9 12.3L18.7 5.5M10.2 5.5h8.5V14' fill='none' stroke='black' stroke-width='1.55' stroke-linecap='round' stroke-linejoin='round'/%3E%3Ccircle cx='5.3' cy='18.7' r='1.8' fill='none' stroke='black' stroke-width='1.45'/%3E%3Cpath d='m13.8 9.4 1.3 1.3' stroke='black' stroke-width='1.2' stroke-linecap='round'/%3E%3C/svg%3E");
  --julia-arrow-east:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M5 12c4 0 5.5 0 8.4 0H19m-6-6 6 6-6 6' fill='none' stroke='black' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3Ccircle cx='4.7' cy='12' r='1.9' stroke='black' fill='none' stroke-width='1.5'/%3E%3Cpath d='m15.1 9.8 2.2 2.2-2.2 2.2' fill='none' stroke='black' stroke-width='.65' stroke-linecap='round'/%3E%3C/svg%3E");
}

/* A continuous material backdrop instead of unrelated section rectangles. */
.page-home .service-section,
.page-home .works-section,
.page-home .visit-process,
.page-home .reviews-section,
.page-home .questions-section,
.page-home .booking-section {
  position:relative;isolation:isolate;overflow:clip;
}
.v6-atmosphere { position:absolute;inset:0;z-index:0;overflow:hidden;pointer-events:none; }
.v6-aura { position:absolute;width:min(78vw,980px);aspect-ratio:1;left:var(--v6-aura-x,-26%);top:var(--v6-aura-y,-45%);border-radius:50%;
  background:radial-gradient(circle,rgba(173,127,195,.15) 0,rgba(214,186,225,.08) 38%,transparent 68%); }
.v6-orbit { position:absolute;width:min(56vw,710px);aspect-ratio:1;top:var(--v6-orbit-y,-35%);right:var(--v6-orbit-x,-28%);border:1px solid rgba(145,97,168,.16);border-radius:50%;transform:rotate(-18deg); }
.v6-orbit::before,.v6-orbit::after { content:"";position:absolute;inset:12%;border:1px solid rgba(158,113,182,.12);border-radius:50%; }
.v6-orbit::after { inset:28%;border-style:dashed;opacity:.42; }
.v6-ghost { position:absolute;top:var(--v6-ghost-y,18%);left:var(--v6-ghost-x,10%);white-space:nowrap;text-transform:uppercase;pointer-events:none;
  font-size:clamp(130px,16vw,310px);line-height:.7;letter-spacing:-.095em;font-weight:550;color:#66427b09;user-select:none; }
.v6-motion-section > .wrap { position:relative;z-index:1; }
.v6-motion-section .section-heading { position:relative; }
.v6-heading-rule { position:absolute;left:0;right:0;bottom:-22px;height:1px;background:linear-gradient(90deg,transparent,#a77bc9 18%,#9073ac 65%,transparent);
  transform-origin:left center;pointer-events:none;opacity:.65; }
/* A wearable, functional chapter-filament, hidden on wider screens. */
.v6-scroll-jewel { display:none; }
.service-section { --v6-aura-x:61%;--v6-aura-y:6%;--v6-orbit-x:-21%;--v6-orbit-y:3%;--v6-ghost-y:13%;--v6-ghost-x:38%; }
.works-section { --v6-aura-x:-27%;--v6-aura-y:7%;--v6-orbit-x:-36%;--v6-orbit-y:-19%;--v6-ghost-y:15%;--v6-ghost-x:49%; }
.visit-process { --v6-aura-x:67%;--v6-aura-y:32%;--v6-orbit-x:65%;--v6-orbit-y:40%;--v6-ghost-y:42%;--v6-ghost-x:-8%; }
.reviews-section { --v6-aura-x:29%;--v6-aura-y:-58%;--v6-orbit-x:-20%;--v6-orbit-y:14%;--v6-ghost-y:10%;--v6-ghost-x:4%; }
.questions-section { --v6-aura-x:60%;--v6-aura-y:20%;--v6-orbit-x:58%;--v6-orbit-y:17%;--v6-ghost-y:60%;--v6-ghost-x:-12%; }
.booking-section { --v6-aura-x:-30%;--v6-aura-y:18%;--v6-orbit-x:-29%;--v6-orbit-y:35%;--v6-ghost-y:55%;--v6-ghost-x:30%; }
.booking-section .v6-aura { background:radial-gradient(circle,#9272a744 0%,#cbb2dc18 40%,transparent 68%); }
.booking-section .v6-ghost { color:#51346213; }
.master-section { position:relative;isolation:isolate;overflow:clip; }
.master-section::before { content:"";position:absolute;z-index:0;pointer-events:none;top:-9%;right:-26%;width:90vw;height:90vw;border-radius:50%;
  background:radial-gradient(circle,#a169b328 0%,#44334e19 42%,transparent 73%); }
.master-section::after { content:"";position:absolute;z-index:0;pointer-events:none;inset:0;background-image:radial-gradient(#cfb0db2e .65px,transparent .65px);background-size:23px 23px;
  -webkit-mask-image:linear-gradient(90deg,transparent,#0009 75%,transparent);mask-image:linear-gradient(90deg,transparent,#0009 75%,transparent);opacity:.23; }
.master-section > .wrap { position:relative;z-index:1; }

/* Hero: subtle refractive glimmer. Static if motion is reduced, never hides the photo. */
.home-hero .hero-portrait-wrap::before { content:"";position:absolute;z-index:2;pointer-events:none;inset:-50% -100%;
  background:linear-gradient(110deg,transparent 36%,#fff2 46%,#e7c9f334 50%,transparent 63%);transform:translateX(-55%) rotate(5deg); }
.home-hero .hero-art::after { content:"";position:absolute;z-index:2;pointer-events:none;left:-4%;top:28%;width:54%;aspect-ratio:1;border:1px solid #c69edb61;border-radius:50%;
  box-shadow:0 0 40px #d2b6e917,inset 0 0 32px #d9b9e71c; }
.home-hero .hero-proof { border-color:#c3abcda6; }

/* Material and selectors: the selected service feels like a jeweller's illuminated tray. */
.service-option { position:relative;isolation:isolate;overflow:hidden; }
.service-option::before { content:"";position:absolute;left:0;top:18%;bottom:18%;width:2px;background:#9461b3;transform:scaleY(0);transform-origin:center;transition:transform .45s cubic-bezier(.2,.8,.2,1); }
.service-option:hover::before,.service-option.is-active::before,.service-option:focus-visible::before { transform:scaleY(1); }
.service-option__name,.service-option__price { transition:transform .38s cubic-bezier(.2,.8,.2,1),color .3s; }
@media(hover:hover) and (pointer:fine) {
  .service-option:hover .service-option__name { transform:translateX(4px); }
  .service-option:hover .service-option__price { transform:translateX(-4px); }
}
.service-preview { position:relative;isolation:isolate;box-shadow:0 30px 90px #38214115; }
.service-preview__visual::after { content:"";position:absolute;inset:-60% -75%;z-index:1;pointer-events:none;
  background:linear-gradient(100deg,transparent 40%,#fffc 50%,transparent 60%);opacity:.23;transform:translateX(-60%) rotate(13deg); }
.service-preview__content { position:relative;z-index:2; }
.service-preview__total { display:inline-block;transform-origin:left bottom; }
.service-preview__visual > span { z-index:2; }
.service-category { position:relative;overflow:hidden; }
.service-category::after { content:"";position:absolute;inset:auto 15px 7px;height:1px;background:currentColor;opacity:.5;transform:scaleX(0);transition:transform .35s;transform-origin:left; }
.service-category.is-active::after { transform:scaleX(1); }
.button-primary,.nav-book { position:relative;isolation:isolate;overflow:hidden; }
.button-primary::before,.nav-book::before { content:"";position:absolute;z-index:-1;inset:0;pointer-events:none;
  background:linear-gradient(115deg,transparent 25%,#fff7 48%,transparent 69%);transform:translateX(-120%);transition:transform .75s cubic-bezier(.18,.78,.2,1); }
@media(hover:hover) and (pointer:fine) {
  .button-primary:hover::before,.nav-book:hover::before { transform:translateX(120%); }
}

/* Signature camera masks and calm optical focus — not 3D effects on real anatomy. */
.master-portrait { outline:1px solid #d2b7e044;outline-offset:11px; }
.master-portrait::after { content:"";position:absolute;z-index:2;inset:0;pointer-events:none;
  background:linear-gradient(145deg,rgba(236,205,250,.15),transparent 40%,rgba(24,18,34,.1)); }
.master-facts strong { display:inline-block; }
.material-object::after { content:"";position:absolute;z-index:1;inset:14%;border:1px solid #c9aad356;border-radius:50%;pointer-events:none;transform:rotate(29deg);box-shadow:0 0 75px #a984cb20; }
.safety-points>div { position:relative; }
.safety-points>div::before { content:"";position:absolute;top:-1px;left:0;width:32%;height:1px;background:#cfaaed;transform:scaleX(0);transform-origin:left;transition:transform .7s cubic-bezier(.2,.8,.2,1); }
.safety-points>div:hover::before { transform:scaleX(1); }

/* Native horizontal gallery keeps its control semantics; the physical feeling comes from depth. */
.works-section .works-track { padding-top:18px; }
.work-card__image { isolation:isolate;box-shadow:0 25px 45px #25192e15; }
.work-card__image::after { content:"";position:absolute;z-index:2;inset:0;pointer-events:none;border:1px solid #faf7f738;border-radius:inherit;
  background:linear-gradient(155deg,#fff2 0%,transparent 35%,#2d0b3621 100%); }
.work-card__open { z-index:4;transition:transform .45s cubic-bezier(.2,.8,.2,1),background .4s; }
.work-card:hover .work-card__open { transform:rotate(45deg) scale(1.08);background:#e6d7ee; }
.work-card__caption { transition:transform .45s cubic-bezier(.2,.8,.2,1); }
.work-card__image img,.master-portrait>img,.service-preview__image { transform-origin:center; }
.gallery-controls button { position:relative;overflow:hidden; }
.gallery-controls button::before { content:"";position:absolute;inset:5px;border:1px solid #ab81c477;border-radius:50%;transform:scale(.65);opacity:0;transition:transform .4s,opacity .4s; }
.gallery-controls button:hover:not(:disabled)::before { transform:scale(1);opacity:1; }

/* A three-beat visit path; interaction opens a polished but legible surface. */
.process-card>span { display:inline-block;transform-origin:left center; }
.process-card h3 { transition:color .3s; }
.process-card:hover h3 { color:#75508b; }
.offer-note { position:relative;isolation:isolate;overflow:hidden;transition:box-shadow .55s cubic-bezier(.2,.8,.2,1); }
.offer-note:hover { box-shadow:0 30px 65px #4d315a1a; }
.offer-note .tiny-spark { display:inline-block; }
.client-review { position:relative;padding-inline:6px;border-color:#bca6c9;transition:border-color .4s,box-shadow .4s; }
.client-review::after { content:"";position:absolute;left:0;top:-1px;width:55%;height:1px;background:#9f70ba;transform:scaleX(0);transform-origin:left;transition:transform .65s cubic-bezier(.2,.8,.2,1); }
.client-review:hover::after { transform:scaleX(1); }
.client-review .quote-mark { display:block;transform-origin:left bottom; }

/* One deliberate visual answer to each question. HTML <details> remains native. */
.faq-item { position:relative;overflow:hidden;transition:background .45s cubic-bezier(.2,.8,.2,1); }
.faq-item::before { content:"";position:absolute;inset:0;pointer-events:none;opacity:0;
  background:linear-gradient(105deg,#b995ce1c,transparent 65%);transition:opacity .38s; }
.faq-item:hover::before,.faq-item[open]::before { opacity:1; }
.faq-item summary,.faq-answer { position:relative;z-index:1; }
.faq-item summary { transition:padding-left .35s; }
.faq-item:hover summary,.faq-item[open] summary { padding-left:11px; }
.faq-plus { display:inline-grid;place-items:center;width:31px;height:31px;border:1px solid #c5b0d1;border-radius:50%;font-size:20px;
  transition:transform .38s,background .38s; }
.faq-item[open] .faq-plus { background:#eadbec; }

/* Booking is the last chapter: soft iridescence and architectural arches. */
.studio-card { position:relative; }
.studio-card__photo { border-radius:130px 4px 4px 4px;position:relative;box-shadow:0 27px 55px #3d214514; }
.studio-card:nth-child(even) .studio-card__photo { border-radius:4px 130px 4px 4px; }
.studio-card__photo::after { content:"";position:absolute;inset:0;pointer-events:none;border:1px solid #ffffff66;border-radius:inherit;
  background:linear-gradient(135deg,#ffffff22 0%,transparent 43%,#44255720 100%); }
.studio-card__photo img { transition:transform 1.1s cubic-bezier(.16,.78,.28,1); }
.booking-bar { position:relative; }
.booking-bar::before { content:"";position:absolute;top:-2px;left:0;height:2px;width:70%;background:linear-gradient(90deg,#845198,#c5a4db,transparent);transform:scaleX(var(--v6-booking-line,.1));transform-origin:left; }
.booking-bar .button-primary { box-shadow:0 16px 32px #69487925; }

/* Connected content routes receive the same visual signature. */
.inner-main { position:relative;isolation:isolate; }
.inner-main::before { content:"";position:absolute;z-index:-1;top:0;right:0;width:min(70vw,900px);height:680px;pointer-events:none;
  background:radial-gradient(ellipse at 65% 20%,#c4a3d82c,transparent 65%); }
.inner-hero__media { position:relative; }
.inner-hero__media::before { content:"";position:absolute;z-index:-1;inset:14px -13px -12px 14px;border:1px solid #cdb3d99c;border-radius:160px 4px 4px 4px; }
.inner-hero__content h1 { text-wrap:balance; }
.source-content img { transition:box-shadow .8s ease; }
.source-content img.v6-in-view { box-shadow:0 18px 38px #35214318; }
.detail-end { position:relative;overflow:clip;isolation:isolate; }
.detail-end::before { content:"";position:absolute;z-index:-1;inset:-35%;pointer-events:none;
  background:radial-gradient(ellipse at 80% 55%,#c49fd63d,transparent 56%); }

/* A soft spot following pointer on premium surfaces. No fake buttons or pointer interception. */
.v6-light { position:absolute;inset:0;z-index:5;pointer-events:none;opacity:0;border-radius:inherit;
  background:radial-gradient(360px circle at var(--v6-x,50%) var(--v6-y,50%),rgba(255,255,255,.16),transparent 69%);transition:opacity .5s ease; }
@media(hover:hover) and (pointer:fine) {
  .v6-lit:hover>.v6-light { opacity:1; }
  .button-primary:hover,.nav-book:hover { box-shadow:0 17px 37px #55306528; }
}

@media(prefers-reduced-motion:no-preference) {
  .home-hero .hero-portrait-wrap::before { animation:v6-prism-sweep 13s cubic-bezier(.3,.6,.25,1) infinite; }
  .service-preview__visual::after { animation:v6-prism-sweep 15s ease-in-out infinite 4s; }
  .hero-photo-cross { animation:v6-marker-pulse 8s ease-in-out infinite; }
  .home-hero .hero-art::after { animation:v6-orbit-breathe 9s ease-in-out infinite; }
  .material-object::after { animation:v6-orbit-breathe 12s ease-in-out infinite reverse; }
  .v6-motion-section .v6-orbit { animation:v6-orbit-turn 70s linear infinite; }
}
@keyframes v6-prism-sweep { 0%,18% { transform:translateX(-57%) rotate(5deg);opacity:0; } 28%,44% { opacity:.45; } 52%,100% { transform:translateX(55%) rotate(5deg);opacity:0; } }
@keyframes v6-marker-pulse { 0%,100% { opacity:.32;transform:scale(.86); } 50% { opacity:.75;transform:scale(1.09); } }
@keyframes v6-orbit-breathe { 0%,100% { opacity:.45;transform:scale(.93) rotate(24deg); } 50% { opacity:.95;transform:scale(1.06) rotate(48deg); } }
@keyframes v6-orbit-turn { from { transform:rotate(0deg); } to { transform:rotate(360deg); } }

/* Opt-in only where supported: same-origin pages unfold as one atelier experience. */
@view-transition { navigation:auto; }
@media(prefers-reduced-motion:no-preference) {
  ::view-transition-old(root) { animation:180ms ease-in both v6-page-out; }
  ::view-transition-new(root) { animation:420ms cubic-bezier(.2,.8,.2,1) both v6-page-in; }
}
@keyframes v6-page-out { to { opacity:0;filter:blur(4px); } }
@keyframes v6-page-in { from { opacity:.25;transform:translateY(13px);filter:blur(4px); } to { opacity:1;transform:none;filter:blur(0); } }

@media(max-width:900px) {
  .v6-ghost { font-size:clamp(110px,22vw,205px);opacity:.8; }
  .v6-orbit { width:75vw; }
  .master-portrait { outline-offset:7px; }
  .studio-card__photo,.studio-card:nth-child(even) .studio-card__photo { border-radius:95px 4px 4px 4px; }
}
@media(max-width:600px) {
  .source-table-wrap::before { content:"Проведите влево, чтобы увидеть итог"; }
  .v6-scroll-jewel { position:fixed;display:block;right:7px;top:82px;bottom:32px;width:7px;z-index:78;pointer-events:none;opacity:.85; }
  .v6-scroll-track,.v6-scroll-fill { position:absolute;top:0;bottom:0;left:3px;width:1px;background:#7653843c; }
  .v6-scroll-fill { bottom:auto;height:100%;transform:scaleY(var(--v6-story-progress,0));transform-origin:top center;
    background:linear-gradient(#b899d1,#75518d,#a97ac0);box-shadow:0 0 9px #9566bc55; }
  .v6-scroll-gem { position:absolute;width:7px;height:7px;left:0;top:calc((100% - 7px)*var(--v6-story-progress,0));transform:rotate(45deg);border:1px solid #86549f;background:#f3e8f8;box-shadow:0 0 0 3px #f5eaf383,0 0 12px #a777bb5c; }
  .v6-scroll-jewel::before,.v6-scroll-jewel::after { content:"";position:absolute;left:2px;width:3px;height:3px;border-radius:50%;background:#9875ad; }
  .v6-scroll-jewel::before { top:0; }.v6-scroll-jewel::after { bottom:0; }
  .v6-aura { width:115vw;opacity:.6; }
  .v6-ghost { font-size:30vw;color:#66427b0b; }
  .v6-orbit { width:88vw;opacity:.65; }
  .v6-heading-rule { bottom:-15px; }
  .home-hero .hero-art::after { width:41%;left:-3%;top:46%; }
  .master-portrait { outline-offset:5px; }
  .service-preview { box-shadow:0 15px 34px #38214112; }
  .work-card__image { box-shadow:0 12px 20px #25192e12; }
  .studio-card__photo,.studio-card:nth-child(even) .studio-card__photo { border-radius:80px 4px 4px 4px; }
  .faq-item:hover summary,.faq-item[open] summary { padding-left:6px; }
  .faq-plus { width:29px;height:29px;flex-shrink:0; }
}
@media(prefers-reduced-motion:reduce) {
  @view-transition { navigation:none; }
  .v6-atmosphere { display:none!important; }
  .v6-scroll-jewel { display:none!important; }
  .home-hero .hero-art::after,.home-hero .hero-portrait-wrap::before,.service-preview__visual::after,.material-object::after { animation:none!important; }
  .v6-light { display:none!important; }
  .v6-heading-rule { transform:none!important; }
  .service-option__name,.service-option__price,.work-card__open,.studio-card__photo img,.client-review,.offer-note { transition:none!important; }
}
