:root {
  --bg: #08090c;
  --ink: #f3f1ed;
  --muted: #a4a4aa;
  --line: rgba(255,255,255,.17);
  --blue: #315cff;
  --coral: #ff633f;
  /* Подстановка поглифная: латиница — Instrument Serif; кириллица — Playfair
     Display (у Instrument Serif её нет); кана — системный минтё. */
  --serif: "Instrument Serif", "Playfair Display", Georgia, "Hiragino Mincho ProN", "Yu Mincho", serif;
  --sans: "DM Sans", Arial, sans-serif;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  color: var(--ink);
  background: var(--bg);
  font-family: var(--sans);
  font-size: 16px;
  line-height: 1.5;
  overflow-x: hidden;
}
body.is-loading { overflow: hidden; }
a { color: inherit; text-decoration: none; }
.shell { width: min(100% - 48px, 1440px); margin-inline: auto; }
.intro {
  position: fixed; inset: 0; z-index: 1000; display: grid; place-items: center;
  color: #0b0c10; background: #f0efea; overflow: hidden;
  transition: transform .9s cubic-bezier(.76,0,.24,1), border-radius .9s cubic-bezier(.76,0,.24,1);
  will-change: transform, border-radius;
}
.intro::after {
  content: ""; position: absolute; inset: auto 0 0; height: 2px;
  background: linear-gradient(90deg, transparent, var(--coral), transparent);
  transform: scaleX(0); transform-origin: left; animation: intro-line 1.75s ease forwards;
}
.intro.is-exiting { transform: translateY(-105%); border-radius: 0 0 50% 50%; }
.intro-word-wrap { display: flex; align-items: center; gap: 18px; transform: translateX(-12px); }
.intro-dot { width: 11px; height: 11px; flex: 0 0 11px; border-radius: 50%; background: var(--coral); box-shadow: 0 0 0 7px rgba(255,99,63,.12); }
.intro-word {
  min-width: 8ch; display: inline-block; font-size: clamp(3.8rem, 8vw, 8.5rem);
  line-height: .9; letter-spacing: -.03em;
  /* Same treatment as <em> elsewhere on the page: Instrument Serif, italic,
     regular weight — in the blue the services section uses. */
  font-family: var(--serif); font-style: italic; font-weight: 400; color: var(--blue);
  animation: intro-word-in .2s cubic-bezier(.2,.7,.2,1) both;
}
.intro-word.is-changing { animation: intro-word-out .16s ease-in both; }
.intro-mark { position: absolute; right: 30px; bottom: 25px; font-size: .7rem; font-weight: 600; letter-spacing: .12em; }
@keyframes intro-word-in { from { opacity: 0; transform: translateY(35%); } to { opacity: 1; transform: none; } }
@keyframes intro-word-out { to { opacity: 0; transform: translateY(-35%); } }
@keyframes intro-line { 0% { transform: scaleX(0); } 88%,100% { transform: scaleX(1); } }
.noise {
  position: fixed; inset: 0; z-index: 99; pointer-events: none; opacity: .05;
  background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.8'/%3E%3C/svg%3E");
}

.nav {
  height: 84px; display: grid; grid-template-columns: 1fr auto 1fr; align-items: center;
  position: absolute; inset: 0 0 auto; z-index: 10; border-bottom: 1px solid var(--line);
}
.brand { font-weight: 600; letter-spacing: -.06em; font-size: 1.25rem; }
.brand span { color: var(--coral); margin-inline: 3px; }
.nav nav { display: flex; gap: 34px; }
.nav nav a, .nav-cta { font-size: .78rem; letter-spacing: .08em; text-transform: uppercase; }
.nav nav a { color: #d5d4d0; transition: color .25s; }
.nav nav a:hover { color: white; }
.nav-cta { justify-self: end; display: flex; gap: 12px; align-items: center; }
.nav-avatar { width: 34px; height: 34px; overflow: hidden; border-radius: 50%; border: 2px solid var(--coral); display: block; transition: transform .3s, box-shadow .3s; }
.nav-avatar img { width: 100%; height: 100%; display: block; object-fit: cover; object-position: center 38%; }
.nav-cta:hover .nav-avatar { transform: scale(1.1) rotate(5deg); box-shadow: 0 0 0 5px rgba(255,99,63,.12); }

.hero { min-height: 100svh; position: relative; padding-top: 150px; display: flex; align-items: center; isolation: isolate; }
.hero::after {
  content: ""; position: absolute; inset: 0 calc((100vw - 100%)/-2); z-index: -1;
  background:
    linear-gradient(90deg, #08090c 0%, rgba(8,9,12,.97) 29%, rgba(8,9,12,.58) 52%, rgba(8,9,12,.13) 79%, rgba(8,9,12,.2) 100%),
    linear-gradient(180deg, rgba(8,9,12,.18), transparent 45%, rgba(8,9,12,.44));
  pointer-events: none;
}
.hero-scene {
  position: absolute; z-index: -2; inset: 0 calc((100vw - 100%)/-2);
  overflow: hidden; opacity: .2;
  background: #08090c url("hero.webp") center/cover no-repeat;
  transition: opacity 1.35s ease;
}
body:not(.is-loading) .hero-scene { opacity: 1; }
.hero-canvas {
  position: absolute; inset: 0; width: 100%; height: 100%; display: block;
  opacity: 0; transition: opacity 1s ease; pointer-events: none;
}
.hero-scene.is-rendering .hero-canvas { opacity: 1; }
.hero-copy { width: 100%; padding-bottom: 70px; }
.hero-copy-plane { transform: none; }
.eyebrow { margin: 0; font-size: .72rem; font-weight: 500; letter-spacing: .16em; text-transform: uppercase; color: #cbc9c5; }
.hero .eyebrow { display: flex; align-items: center; gap: 10px; }
.hero .eyebrow span { width: 7px; height: 7px; border-radius: 50%; background: var(--coral); box-shadow: 0 0 18px var(--coral); }
.hero h1 { max-width: 1040px; margin: 34px 0 48px; font-size: clamp(4.4rem, 8.6vw, 9.3rem); line-height: .82; font-weight: 500; letter-spacing: -.068em; }
em { color: var(--coral); font-family: var(--serif); font-weight: 400; }
.hero-bottom { max-width: 990px; display: flex; justify-content: space-between; align-items: end; gap: 40px; }
.hero-bottom > p { width: min(440px, 52vw); margin: 0; color: #bbb9b5; line-height: 1.65; }
.circle-link {
  width: 126px; height: 126px; flex: 0 0 126px; border: 1px solid rgba(255,255,255,.42); border-radius: 50%;
  display: grid; place-items: center; position: relative; font-size: .66rem; letter-spacing: .12em; line-height: 1.25; transition: background .3s, color .3s, transform .3s;
}
.circle-link b { position: absolute; right: 22px; bottom: 20px; color: var(--coral); font-size: 1.25rem; }
.circle-link:hover { background: var(--ink); color: #08090c; transform: rotate(-4deg); }
.hero-index { position: absolute; inset: auto 0 26px; display: flex; justify-content: space-between; font-size: .65rem; letter-spacing: .15em; color: #83838a; }

.ticker { border-block: 1px solid var(--line); overflow: hidden; padding: 18px 0; background: #0d0e12; }
.ticker-track { width: max-content; display: flex; align-items: center; gap: 34px; animation: ticker 26s linear infinite; font-size: .76rem; letter-spacing: .17em; }
.ticker-track i { color: var(--coral); font-style: normal; }
@keyframes ticker { to { transform: translateX(-50%); } }

.section { padding-block: 150px; }
.section-head { display: grid; grid-template-columns: 1fr 1fr; gap: 30px; align-items: start; margin-bottom: 64px; }
.section-note { max-width: 500px; margin: 0; font-size: 1.2rem; color: var(--muted); }
.project-slider { position: relative; }
.project-track {
  display: flex; gap: 26px; overflow-x: auto; overflow-y: hidden;
  padding: 26px 8% 70px; margin-inline: -8%; scroll-padding-inline: 8%;
  scroll-snap-type: x mandatory; scroll-behavior: smooth; overscroll-behavior-x: contain;
  scrollbar-width: none; perspective: 1700px; cursor: grab;
}
.project-track::-webkit-scrollbar { display: none; }
.project-slider.is-dragging .project-track { cursor: grabbing; scroll-snap-type: none; user-select: none; }
.project {
  --slide-z: 0px; --slide-ry: 0deg; --slide-scale: 1; --slide-opacity: 1;
  --slide-brightness: 1; --light-x: 74%; --light-y: 42%;
  flex: 0 0 84%; min-height: 630px; padding: 0; display: flex; flex-direction: column;
  position: relative; overflow: visible; background: transparent; scroll-snap-align: center;
  transform-style: preserve-3d;
  transform: translate3d(0, 0, var(--slide-z)) rotateY(var(--slide-ry)) scale(var(--slide-scale));
  opacity: var(--slide-opacity); filter: brightness(var(--slide-brightness));
  will-change: transform, opacity, filter;
}
.project-frame {
  position: absolute; inset: 0; z-index: 1; padding: 24px; display: flex; flex-direction: column; overflow: hidden;
  border: 1px solid var(--line); background: #101116;
  transform: none; box-shadow: 0 28px 70px rgba(0,0,0,.23);
}
.project-frame::before {
  content: ""; position: absolute; inset: 0; z-index: 1; pointer-events: none;
  background: radial-gradient(circle 460px at var(--light-x) var(--light-y), rgba(255,255,255,.04), transparent 68%);
  opacity: .55;
}
.project-frame::after {
  content: ""; position: absolute; inset: 0; z-index: 1; pointer-events: none;
  background: linear-gradient(145deg, rgba(255,255,255,.025), transparent 31%, rgba(0,0,0,.08) 78%);
}
.project-meta, .project-footer {
  display: flex; justify-content: space-between; gap: 20px; position: relative; z-index: 4;
  font-size: .7rem; letter-spacing: .13em; text-transform: uppercase;
}
.project-meta, .project-footer { transform: none; }
.project-stage {
  flex: 1; display: flex; justify-content: center; flex-direction: column; position: relative; z-index: 3;
  padding: 70px 5%; transform: none;
}
.project-stage.compact { padding-inline: 2%; }
.project h2 {
  max-width: 980px; margin: 0; font-size: clamp(3.3rem, 6vw, 7rem); line-height: .9;
  letter-spacing: -.055em; font-weight: 500; position: relative; z-index: 5;
  transform: none;
}
.project-coral h2, .project-silver h2 { font-size: clamp(3.2rem, 4.4vw, 5.2rem); }
.project-ghost {
  position: absolute; left: 3%; top: 50%; z-index: 0;
  transform: translateY(-50%);
  font-size: clamp(7rem, 17vw, 17rem); font-weight: 600; letter-spacing: -.09em;
  color: rgba(255,255,255,.05); white-space: nowrap;
}
.project-footer { align-items: end; color: rgba(255,255,255,.68); }
.project-footer p { margin: 0; max-width: 430px; font-size: .92rem; letter-spacing: 0; text-transform: none; line-height: 1.55; }
.project-blue { --light-x: 74%; --light-y: 42%; }
.project-coral { --light-x: 78%; --light-y: 26%; }
.project-silver { --light-x: 66%; --light-y: 36%; }
.project-dark { --light-x: 83%; --light-y: 52%; }
.project-blue .project-frame { background: radial-gradient(circle at var(--light-x) var(--light-y), rgba(49,92,255,.55), transparent 23%), linear-gradient(135deg,#0a1029,#101116 70%); }
.project-coral .project-frame { background: radial-gradient(circle at var(--light-x) var(--light-y), rgba(255,99,63,.65), transparent 22%), linear-gradient(160deg,#2b0e0b,#111216 65%); }
.project-silver .project-frame { background: radial-gradient(circle at var(--light-x) var(--light-y), rgba(255,255,255,.24), transparent 18%), linear-gradient(140deg,#22242b,#0c0d10 68%); }
.project-dark .project-frame { background: radial-gradient(circle at var(--light-x) var(--light-y), rgba(92,70,255,.42), transparent 19%), linear-gradient(120deg,#111015,#050608); }
.project-orbit {
  position: absolute; width: min(43vw, 530px); aspect-ratio: 1; right: 2%; z-index: 1;
  border: 1px solid rgba(255,255,255,.18); border-radius: 50%;
  box-shadow: 0 0 100px rgba(49,92,255,.2), inset 0 0 90px rgba(49,92,255,.12);
  transform: none;
}
.project-orbit::after { content: ""; position: absolute; width: 38%; aspect-ratio: 1; background: var(--coral); border-radius: 50%; right: 5%; top: 9%; filter: blur(50px); opacity: .58; }
.project-slider-controls {
  display: grid; grid-template-columns: 58px minmax(180px, 420px) 58px; justify-content: end; align-items: center;
  gap: 18px; margin-top: 4px;
}
.slider-button {
  width: 58px; height: 58px; padding: 0; display: grid; place-items: center;
  border: 1px solid rgba(255,255,255,.24); border-radius: 50%; color: var(--ink); background: transparent;
  font: inherit; font-size: 1.15rem; cursor: pointer;
  transition: color .3s ease, background .3s ease, border-color .3s ease, opacity .3s ease, transform .3s ease;
}
.slider-button:hover:not(:disabled) { color: #08090c; background: var(--ink); border-color: var(--ink); transform: scale(1.04); }
.slider-button:disabled { opacity: .25; cursor: default; }
.work-all { display: flex; justify-content: flex-end; margin: 36px 0 0; }
.work-all a {
  display: inline-flex; align-items: center; gap: 10px; min-height: 58px; padding: 0 28px;
  border: 1px solid rgba(255,255,255,.24); border-radius: 999px; color: var(--ink); text-decoration: none;
  font-size: .95rem; letter-spacing: .02em;
  transition: color .3s ease, background .3s ease, border-color .3s ease;
}
.work-all a:hover, .work-all a:focus-visible { color: #08090c; background: var(--ink); border-color: var(--ink); }
@media (max-width: 600px) { .work-all { justify-content: stretch; } .work-all a { flex: 1; justify-content: center; } }
@media (prefers-reduced-motion: reduce) { .work-all a { transition: none; } }
.slider-status { display: grid; grid-template-columns: 28px 1fr 28px; align-items: center; gap: 13px; color: #8b8c93; font-size: .67rem; letter-spacing: .14em; }
.slider-status > span:last-child { text-align: right; }
.slider-progress { height: 1px; overflow: hidden; background: rgba(255,255,255,.17); }
.slider-progress i { display: block; width: 100%; height: 100%; background: var(--coral); transform: scaleX(.25); transform-origin: left; transition: transform .55s cubic-bezier(.16,1,.3,1); }

.services { background: #f0efea; color: #0b0c10; }
.services .eyebrow { color: #494a50; }
.display-title { margin: -18px 0 0; font-size: clamp(4.2rem, 7vw, 7.8rem); line-height: .85; letter-spacing: -.06em; font-weight: 500; }
.service-list { border-top: 1px solid rgba(0,0,0,.22); }
.service { display: grid; grid-template-columns: 70px 1fr 1fr; gap: 30px; padding: 34px 0; border-bottom: 1px solid rgba(0,0,0,.22); align-items: start; }
.service > span { font-size: .72rem; }
.service h3 { margin: 0; font-size: clamp(1.7rem, 2.7vw, 3rem); font-weight: 500; letter-spacing: -.04em; }
.service p { margin: 5px 0 0; color: #54555b; max-width: 520px; font-size: 1.05rem; }
.services em { color: var(--blue); }

.manifesto {
  position: relative; overflow: hidden; background:
    radial-gradient(circle at 92% 18%, rgba(49,92,255,.16), transparent 30%),
    radial-gradient(circle at 8% 88%, rgba(255,99,63,.055), transparent 26%),
    linear-gradient(145deg, #090a0e 0%, #10131d 58%, #090a0e 100%);
}
.manifesto::after {
  content: ""; position: absolute; inset: 0; pointer-events: none;
  background: linear-gradient(115deg, transparent 48%, rgba(255,255,255,.025) 49%, transparent 50%);
}
.manifesto-inner { position: relative; z-index: 1; }
.manifesto blockquote { margin: 75px 0; font-size: clamp(4rem, 8.6vw, 9.4rem); line-height: .85; letter-spacing: -.07em; }
.manifesto-copy { width: 50%; margin-left: auto; display: grid; grid-template-columns: 1fr 2fr; gap: 30px; border-top: 1px solid var(--line); padding-top: 22px; }
.manifesto-copy span { font-size: .67rem; letter-spacing: .13em; }
.manifesto-copy p { margin: 0; color: var(--muted); font-size: 1.1rem; }

.about {
  position: relative; overflow: hidden; color: #0b0c10; border-block: 1px solid rgba(0,0,0,.14); background:
    radial-gradient(circle at 92% 12%, rgba(49,92,255,.10), transparent 32%),
    radial-gradient(circle at 5% 95%, rgba(255,99,63,.12), transparent 28%),
    linear-gradient(135deg, #e4e4e0 0%, #f2f0eb 52%, #e3e5ea 100%);
}
.about::after {
  content: ""; position: absolute; inset: 22px; pointer-events: none;
  border: 1px solid rgba(11,12,16,.08);
}
.about-grid { display: grid; grid-template-columns: 1fr 2fr; gap: 40px; }
.about-label { display: flex; flex-direction: column; justify-content: space-between; }
.about .eyebrow { color: #55565d; }
.signature { font-family: var(--serif); font-size: 3.6rem; font-style: italic; color: var(--coral); transform: rotate(-7deg); transform-origin: left; }
.about-copy h2 { margin: 0 0 40px; font-size: clamp(3rem, 5.2vw, 6rem); line-height: .94; letter-spacing: -.055em; font-weight: 500; }
.about-copy > p { width: 75%; margin: 0 0 70px; color: #55565d; font-size: 1.18rem; }
.facts { display: grid; grid-template-columns: repeat(3,1fr); gap: 18px; border-top: 1px solid rgba(0,0,0,.22); padding-top: 22px; }
.facts div { display: flex; flex-direction: column; gap: 8px; }
.facts span { color: #77787e; font-size: .65rem; letter-spacing: .14em; }
.facts strong { font-size: .95rem; font-weight: 500; }

.contact {
  position: relative; overflow: hidden; padding-bottom: 42px; border-top: 1px solid rgba(255,255,255,.08); background:
    radial-gradient(circle at 88% 26%, rgba(255,99,63,.08), transparent 25%),
    linear-gradient(180deg, #111218 0%, #08090c 72%);
}
.contact-inner { position: relative; z-index: 1; }
.contact-inner > a { margin: 42px 0 140px; padding-bottom: 20px; border-bottom: 1px solid var(--line); display: flex; align-items: center; justify-content: space-between; transition: color .25s; }
.contact-inner > a > span:first-child { font-size: clamp(4rem, 9.5vw, 10rem); line-height: .9; letter-spacing: -.07em; }
.contact-avatar { width: 112px; height: 112px; flex: 0 0 112px; border-radius: 50%; overflow: hidden; display: block; border: 3px solid var(--coral); box-shadow: 0 0 0 7px rgba(255,99,63,.12); transition: transform .35s cubic-bezier(.2,.7,.2,1), box-shadow .35s; }
.contact-avatar img { width: 100%; height: 100%; display: block; object-fit: cover; object-position: center 38%; transition: transform .45s cubic-bezier(.2,.7,.2,1); }
.contact-inner > a:hover { color: var(--coral); }
.contact-inner > a:hover .contact-avatar { transform: rotate(5deg) scale(1.06); box-shadow: 0 0 0 12px rgba(255,99,63,.15); }
.contact-inner > a:hover .contact-avatar img { transform: scale(1.06); }
.contact-bottom { display: flex; justify-content: space-between; color: #74757c; font-size: .65rem; letter-spacing: .13em; }

.reveal { opacity: 0; transform: translateY(36px); transition: opacity .8s ease, transform .8s cubic-bezier(.2,.7,.2,1); }
.reveal.in { opacity: 1; transform: none; }

@media (max-width: 900px) {
  .shell { width: min(100% - 32px, 1440px); }
  .nav { height: 70px; grid-template-columns: 1fr 1fr; }
  .nav nav { display: none; }
  .hero { padding-top: 120px; min-height: 920px; align-items: flex-start; }
  .hero::after {
    background:
      linear-gradient(180deg, #08090c 4%, rgba(8,9,12,.72) 39%, rgba(8,9,12,.28) 62%, #08090c 91%),
      linear-gradient(90deg, rgba(8,9,12,.74), rgba(8,9,12,.08) 82%);
  }
  .hero-scene { background-position: 63% center; }
  .hero h1 { font-size: clamp(3.8rem, 14vw, 7rem); margin-top: 28px; }
  .hero-bottom { align-items: start; }
  .section { padding-block: 100px; }
  .section-head { grid-template-columns: 1fr; gap: 28px; }
  .project-track { gap: 20px; padding-inline: 6%; margin-inline: -6%; scroll-padding-inline: 6%; }
  .project { flex-basis: 88%; min-height: 560px; }
  .service { grid-template-columns: 50px 1fr; }
  .service p { grid-column: 2; }
  .manifesto-copy { width: 80%; }
  .about-grid { grid-template-columns: 1fr; }
  .about-label { min-height: 130px; }
}

@media (max-width: 600px) {
  .shell { width: min(100% - 24px, 1440px); }
  .hero { min-height: 820px; }
  .hero h1 { font-size: clamp(3.25rem, 15vw, 5.4rem); line-height: .86; }
  .hero-bottom > p { width: 100%; font-size: .93rem; }
  .circle-link { width: 94px; height: 94px; flex-basis: 94px; }
  .circle-link b { right: 14px; bottom: 12px; }
  .section { padding-block: 78px; }
  .project-track { gap: 14px; padding: 18px 4% 48px; margin-inline: -4%; scroll-padding-inline: 4%; }
  .project { flex-basis: 92%; min-height: 500px; padding: 0; }
  .project-frame { padding: 16px; }
  .project-meta span:nth-child(2) { text-align: right; }
  .project-meta span:last-child:nth-child(3), .project-footer > span { display: none; }
  .project-stage { padding-inline: 0; }
  .project h2 { font-size: clamp(2.9rem, 14vw, 4.2rem); }
  .project-footer p { font-size: .82rem; }
  .project-slider-controls { grid-template-columns: 50px minmax(140px, 1fr) 50px; gap: 12px; }
  .slider-button { width: 50px; height: 50px; }
  .service { grid-template-columns: 34px 1fr; gap: 12px; }
  .service p { font-size: .95rem; }
  .manifesto blockquote { margin: 50px 0; font-size: 3.65rem; }
  .manifesto-copy { width: 100%; grid-template-columns: 1fr; }
  .about-copy > p { width: 100%; }
  .facts { grid-template-columns: 1fr; gap: 24px; }
  .about::after { inset: 10px; }
  .contact { padding-top: 82px; padding-bottom: 36px; }
  .contact-inner > a { margin-top: 38px; margin-bottom: 84px; }
  .contact-inner > a > span:first-child { font-size: 3.7rem; }
  .contact-avatar { width: 68px; height: 68px; flex: 0 0 68px; border-width: 2px; box-shadow: 0 0 0 5px rgba(255,99,63,.12); }
  .contact-bottom { align-items: end; gap: 20px; }
  .contact-bottom span:last-child { text-align: right; }
  .intro-word-wrap { gap: 12px; transform: none; }
  .intro-dot { width: 8px; height: 8px; flex-basis: 8px; }
  .intro-word { min-width: 7.5ch; font-size: clamp(3.1rem, 16vw, 5.5rem); }
  .intro-mark { right: 18px; bottom: 18px; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  .ticker-track { animation: none; }
  .reveal { opacity: 1; transform: none; transition: none; }
  .intro, .intro::after, .intro-word { animation: none; }
  .intro { transition-duration: .3s; }
  .hero-scene { opacity: 1; transition: none; }
  .hero-canvas { display: none; }
  .project-track { scroll-behavior: auto; }
  .project { transform: none !important; opacity: 1 !important; filter: none !important; }
  .project-frame, .project-meta, .project-stage, .project-footer, .project-ghost, .project-orbit { transform: none !important; }
}

/* ==========================================================================
   Theme additions: accessibility, language switcher, project media,
   and the inner-page templates (posts, pages, archives, 404).
   ========================================================================== */

.screen-reader-text {
  position: absolute !important;
  width: 1px; height: 1px; padding: 0; margin: -1px;
  overflow: hidden; clip-path: inset(50%); white-space: nowrap; border: 0;
}
.skip-link:focus {
  position: fixed !important; top: 12px; left: 12px; z-index: 2000;
  width: auto; height: auto; margin: 0; padding: 12px 18px;
  clip-path: none; white-space: normal;
  background: var(--ink); color: var(--bg); border-radius: 4px;
  font-size: .8rem; letter-spacing: .06em; text-transform: uppercase;
}
:focus-visible { outline: 2px solid var(--coral); outline-offset: 3px; }

/* ── Language switcher ───────────────────────────────────────────────────── */
.lang-switch { display: inline-flex; gap: 12px; align-items: center; }
.lang-switch::before {
  content: ""; width: 1px; height: 12px; background: var(--line); margin-right: 4px;
}
.nav nav a.lang-switch-item { color: var(--muted); font-size: .72rem; letter-spacing: .12em; }
.nav nav a.lang-switch-item:hover { color: var(--ink); }
.nav nav a.lang-switch-item.is-current { color: var(--coral); }

/* ── Optional project media ──────────────────────────────────────────────── */
.project-media { position: absolute; inset: 0; z-index: 0; overflow: hidden; }
.project-media img,
.project-media video {
  position: absolute; inset: 0; width: 100%; height: 100%;
  object-fit: cover; display: block;
}
.project-media video { z-index: 1; }
.project.has-media .project-frame::before { opacity: .3; }
/* Keeps the type legible over arbitrary artwork. */
.project.has-media .project-media::after {
  content: ""; position: absolute; inset: 0; z-index: 2;
  background: linear-gradient(180deg, rgba(8,9,12,.72), rgba(8,9,12,.45) 45%, rgba(8,9,12,.85));
}
.project-cover-link { position: absolute; inset: 0; z-index: 6; }

@media (prefers-reduced-motion: reduce) {
  .project-media video { display: none; }
}

/* ── Inner pages ─────────────────────────────────────────────────────────── */
.daria-inner .nav { position: relative; inset: auto; }
.daria-inner { background: var(--bg); }
.inner { padding: 70px 0 120px; }
.inner .entry-head { margin-bottom: 46px; }
.entry-title {
  margin: 0; font-family: var(--serif); font-weight: 400;
  font-size: clamp(2.4rem, 5vw, 4.4rem); line-height: .98; letter-spacing: -.03em;
}
.entry-thumb { margin: 0 0 40px; }
.entry-thumb img { width: 100%; height: auto; display: block; }
.entry-content { max-width: 760px; font-size: 1.02rem; line-height: 1.7; color: #ddddda; }
.entry-content h2, .entry-content h3, .entry-content h4 {
  font-family: var(--serif); font-weight: 400; letter-spacing: -.02em;
  line-height: 1.1; margin: 2em 0 .6em;
}
.entry-content h2 { font-size: 2rem; }
.entry-content h3 { font-size: 1.5rem; }
.entry-content a { color: var(--coral); text-decoration: underline; text-underline-offset: 3px; }
.entry-content img { max-width: 100%; height: auto; }
.entry-content blockquote {
  margin: 2em 0; padding-left: 22px; border-left: 2px solid var(--coral);
  font-family: var(--serif); font-size: 1.35rem; line-height: 1.35; color: var(--ink);
}
.entry-content code, .entry-content pre {
  background: rgba(255,255,255,.06); border-radius: 4px;
}
.entry-content code { padding: 2px 6px; font-size: .9em; }
.entry-content pre { padding: 18px; overflow-x: auto; }
.entry-content ul, .entry-content ol { padding-left: 1.2em; }

.entry-nav {
  display: flex; justify-content: space-between; gap: 24px; flex-wrap: wrap;
  margin-top: 70px; padding-top: 26px; border-top: 1px solid var(--line);
  font-size: .75rem; letter-spacing: .12em; text-transform: uppercase; color: var(--muted);
}
.entry-nav a { color: var(--muted); transition: color .25s; }
.entry-nav a:hover { color: var(--ink); }

.post-list {
  display: grid; gap: 40px;
  grid-template-columns: repeat(auto-fill, minmax(min(100%, 300px), 1fr));
}
.post-card figure { margin: 0 0 18px; overflow: hidden; }
.post-card img { width: 100%; height: auto; display: block; transition: transform .6s cubic-bezier(.2,.7,.2,1); }
.post-card a:hover img { transform: scale(1.04); }
.post-card h2 {
  margin: 6px 0 10px; font-family: var(--serif); font-weight: 400;
  font-size: 1.7rem; line-height: 1.05; letter-spacing: -.02em;
}
.post-card p { margin: 0; color: var(--muted); font-size: .92rem; line-height: 1.55; }

.pagination, .page-links { margin-top: 60px; display: flex; gap: 14px; font-size: .8rem; letter-spacing: .1em; }
.pagination .page-numbers { color: var(--muted); }
.pagination .page-numbers.current { color: var(--coral); }

.error-404 { padding-block: 120px 160px; }
.error-404 .display-title { margin: 10px 0 18px; }
.text-link { color: var(--coral); text-decoration: underline; text-underline-offset: 4px; }

.search-form { display: flex; gap: 10px; margin-top: 30px; max-width: 460px; }
.search-form input[type="search"] {
  flex: 1; padding: 12px 14px; color: var(--ink); font: inherit; font-size: .95rem;
  background: rgba(255,255,255,.05); border: 1px solid var(--line); border-radius: 2px;
}
.search-form button {
  padding: 12px 20px; color: var(--bg); background: var(--ink); border: 0; border-radius: 2px;
  font: inherit; font-size: .78rem; letter-spacing: .1em; text-transform: uppercase; cursor: pointer;
}

.site-footer {
  padding: 40px 0 60px; margin-top: 60px; border-top: 1px solid var(--line);
  display: flex; justify-content: space-between; align-items: center; gap: 24px; flex-wrap: wrap;
}
.footer-menu { display: flex; gap: 26px; margin: 0; padding: 0; list-style: none; }
.footer-menu a { font-size: .75rem; letter-spacing: .1em; text-transform: uppercase; color: var(--muted); }
.footer-menu a:hover { color: var(--ink); }
.footer-meta {
  margin: 0; display: flex; gap: 26px; flex-wrap: wrap;
  font-size: .7rem; letter-spacing: .13em; text-transform: uppercase; color: var(--muted);
}

.comments { max-width: 760px; margin-top: 80px; padding-top: 30px; border-top: 1px solid var(--line); }
.comments-title { font-family: var(--serif); font-weight: 400; font-size: 1.6rem; }
.comment-list { list-style: none; padding: 0; }
.comments input:not([type="submit"]), .comments textarea {
  width: 100%; padding: 12px 14px; color: var(--ink); font: inherit;
  background: rgba(255,255,255,.05); border: 1px solid var(--line); border-radius: 2px;
}
.comments input[type="submit"] {
  padding: 12px 22px; color: var(--bg); background: var(--ink); border: 0; border-radius: 2px;
  font: inherit; font-size: .78rem; letter-spacing: .1em; text-transform: uppercase; cursor: pointer;
}

@media (max-width: 720px) {
  .lang-switch { gap: 8px; }
  .lang-switch::before { display: none; }
  .site-footer { flex-direction: column; align-items: flex-start; }
}

/* ==========================================================================
   Contact modal (Gravity Forms)
   ========================================================================== */

.daria-modal {
  position: fixed; inset: 0; z-index: 1200;
  display: none; align-items: center; justify-content: center;
  padding: 32px 24px;
}
/* :target is the no-JavaScript path — the CTA is a real link to #daria-contact. */
.daria-modal:target,
.daria-modal.is-open { display: flex; }
/* Changing the URL with history.replaceState does NOT re-evaluate :target, so
   closing the CSS-only fallback needs a class that outranks it. */
.daria-modal.is-dismissed { display: none !important; }

.daria-modal-backdrop {
  position: absolute; inset: 0;
  background: rgba(6,7,9,.78); backdrop-filter: blur(6px);
  animation: daria-backdrop-in .42s ease both;
}
@keyframes daria-backdrop-in {
  from { opacity: 0; backdrop-filter: blur(0); }
  to   { opacity: 1; backdrop-filter: blur(6px); }
}
.daria-modal.is-closing .daria-modal-backdrop { animation: daria-backdrop-out .26s ease both; }
@keyframes daria-backdrop-out { to { opacity: 0; } }

.daria-modal-panel {
  position: relative; z-index: 1;
  width: min(100%, 620px); max-height: min(90vh, 940px); overflow-y: auto;
  padding: 62px 64px 56px;
  background: #0d0e12; border: 1px solid var(--line);
  box-shadow: 0 50px 120px rgba(0,0,0,.6);
  /* Out-expo curve: quick to appear, long soft settle — matches the easing the
     rest of the site uses for reveals. */
  animation: daria-modal-in .58s cubic-bezier(.16,1,.3,1) both;
}
@keyframes daria-modal-in {
  from { opacity: 0; transform: translateY(34px) scale(.97); }
  60%  { opacity: 1; }
  to   { opacity: 1; transform: none; }
}
.daria-modal.is-closing .daria-modal-panel { animation: daria-modal-out .26s cubic-bezier(.4,0,1,1) both; }
@keyframes daria-modal-out {
  from { opacity: 1; transform: none; }
  to   { opacity: 0; transform: translateY(14px) scale(.985); }
}

/* The coral rule draws itself in as the panel arrives. */
.daria-modal-panel::before { transform-origin: left; animation: daria-rule-in .8s .18s cubic-bezier(.16,1,.3,1) both; }
@keyframes daria-rule-in { from { transform: scaleX(0); } to { transform: scaleX(1); } }

/* Hairline that echoes the preloader's coral rule. */
.daria-modal-panel::before {
  content: ""; position: absolute; inset: 0 0 auto; height: 2px;
  background: linear-gradient(90deg, var(--coral), transparent 70%);
}

.daria-modal-close {
  position: absolute; top: 20px; right: 22px;
  width: 42px; height: 42px; display: grid; place-items: center;
  font-size: 1.5rem; line-height: 1; color: var(--muted);
  background: transparent; border: 1px solid transparent; border-radius: 50%;
  cursor: pointer; transition: color .25s, border-color .25s, transform .25s;
}
.daria-modal-close:hover { color: var(--ink); border-color: var(--line); transform: rotate(90deg); }

.daria-modal-title {
  display: flex; align-items: baseline; gap: 14px;
  margin: 0 0 10px;
  font-family: var(--serif); font-weight: 400; font-style: italic;
  font-size: clamp(2.2rem, 4vw, 3.1rem); line-height: 1.02; letter-spacing: -.03em;
  color: var(--ink);
}
.daria-modal-title::before {
  content: ""; flex: 0 0 9px; width: 9px; height: 9px; border-radius: 50%;
  background: var(--coral); transform: translateY(-.35em);
}
.daria-modal-note {
  margin: 0 0 34px; padding-left: 23px;
  color: var(--muted); font-size: .93rem; line-height: 1.6; max-width: 46ch;
}
.daria-modal-title + .gform_wrapper { margin-top: 34px; }

/* ── Gravity Forms inside the panel ─────────────────────────────────────
   GF 3 ships the "orbital" theme and paints itself from --gf-* custom
   properties declared on #gform_wrapper_N. An id beats any number of classes,
   so these overrides are !important rather than a specificity arms race. */
.daria-modal .gform-theme,
.daria-modal .gform_wrapper {
  --gf-color-primary: var(--coral) !important;
  --gf-color-primary-rgb: 255, 99, 63 !important;
  --gf-color-primary-contrast: #08090c !important;
  --gf-color-primary-darker: #e5502d !important;
  --gf-color-primary-lighter: #ff7d5e !important;
  --gf-color-secondary: transparent !important;
  --gf-color-secondary-contrast: #f3f1ed !important;
  --gf-color-in-ctrl: transparent !important;
  --gf-color-in-ctrl-contrast: #f3f1ed !important;
  --gf-color-in-ctrl-primary: var(--coral) !important;
  --gf-color-out-ctrl-light: rgba(255,255,255,.17) !important;
  --gf-color-out-ctrl-dark: #a4a4aa !important;
  --gf-ctrl-border-color: rgba(255,255,255,.17) !important;
  --gf-ctrl-label-color-primary: #a4a4aa !important;
  --gf-ctrl-label-color-secondary: #a4a4aa !important;
  --gf-ctrl-size: auto !important;
  --gf-local-color: #f3f1ed !important;
}

.daria-modal .gform_wrapper,
.daria-modal .gform_wrapper form { margin: 0; }
.daria-modal .gform_fields { gap: 30px !important; }
.daria-modal .gfield { padding: 0 !important; }

.daria-modal .gfield_label {
  display: block !important; margin: 0 0 4px !important;
  font-family: var(--sans) !important; font-size: .66rem !important; font-weight: 500 !important;
  letter-spacing: .18em; text-transform: uppercase; color: var(--muted) !important;
}
.daria-modal .gfield_required {
  margin-left: 8px; color: var(--coral) !important;
  font-size: .58rem; letter-spacing: .14em; opacity: .85;
}

/* Underlines instead of boxes — closer to the site's editorial typography. */
.daria-modal .gform_wrapper input[type="text"],
.daria-modal .gform_wrapper input[type="email"],
.daria-modal .gform_wrapper input[type="tel"],
.daria-modal .gform_wrapper textarea {
  width: 100% !important; box-sizing: border-box;
  padding: 10px 2px !important;
  color: var(--ink) !important; caret-color: var(--coral);
  font-family: var(--sans) !important; font-size: 1.06rem !important; line-height: 1.5 !important;
  background: transparent !important;
  border: 0 !important; border-bottom: 1px solid var(--line) !important; border-radius: 0 !important;
  box-shadow: none !important;
  transition: border-color .3s, background .3s;
}
.daria-modal .gform_wrapper input::placeholder,
.daria-modal .gform_wrapper textarea::placeholder { color: rgba(164,164,170,.55); }
.daria-modal .gform_wrapper input:hover,
.daria-modal .gform_wrapper textarea:hover { border-bottom-color: rgba(255,255,255,.34) !important; }
.daria-modal .gform_wrapper input:focus,
.daria-modal .gform_wrapper textarea:focus {
  outline: none !important;
  border-bottom-color: var(--coral) !important;
  background: rgba(255,255,255,.03) !important;
}
.daria-modal .gform_wrapper textarea { height: 124px !important; min-height: 0 !important; resize: vertical; }

.daria-modal .gform_footer { margin: 40px 0 0 !important; padding: 0 !important; }
.daria-modal .gform_button {
  position: relative;
  padding: 18px 62px 18px 34px !important;
  color: var(--ink) !important; background: transparent !important;
  border: 1px solid rgba(255,255,255,.42) !important; border-radius: 0 !important;
  cursor: pointer;
  font-family: var(--sans) !important; font-size: .72rem !important; font-weight: 500 !important;
  letter-spacing: .16em; text-transform: uppercase;
  transition: background .3s, color .3s, border-color .3s, transform .3s;
}
/* Gravity Forms ships its own ::after rules for buttons and wins on
   specificity, so every declaration here has to be forced. */
.daria-modal .gform_button::after {
  content: "\2192" !important; display: block !important;
  position: absolute !important; right: 28px !important; top: 50% !important;
  transform: translateY(-50%) !important; color: var(--coral) !important;
  font-size: 1.05rem !important; line-height: 1 !important; letter-spacing: 0 !important;
  width: auto !important; height: auto !important; background: none !important;
  border: 0 !important; opacity: 1 !important;
  transition: color .3s, transform .3s;
}
.daria-modal .gform_button:hover {
  background: var(--ink) !important; color: #08090c !important; border-color: var(--ink) !important;
}
.daria-modal .gform_button:hover::after { color: #08090c !important; transform: translate(5px, -50%) !important; }
.daria-modal .gform_button:active { transform: scale(.985); }
.daria-modal .gform_ajax_spinner { margin-left: 14px; filter: invert(1); }

.daria-modal .gform_validation_errors,
.daria-modal .gfield_validation_message,
.daria-modal .validation_message {
  color: var(--coral) !important; background: none !important;
  border: 0 !important; border-left: 2px solid var(--coral) !important;
  padding: 2px 0 2px 12px !important; margin-top: 10px !important;
  font-size: .82rem !important; line-height: 1.45; box-shadow: none !important;
}
.daria-modal .gform_validation_errors { margin: 0 0 30px !important; padding: 10px 0 10px 14px !important; }
.daria-modal .gform_validation_errors h2 {
  margin: 0 !important; color: var(--coral) !important;
  font-family: var(--sans) !important; font-size: .82rem !important; font-weight: 500 !important;
  letter-spacing: 0; text-transform: none;
}
.daria-modal .gfield_error input,
.daria-modal .gfield_error textarea { border-bottom-color: var(--coral) !important; }
.daria-modal .gform_required_legend { display: none !important; }

.daria-modal .gform_confirmation_message {
  display: flex; align-items: baseline; gap: 14px;
  font-family: var(--serif); font-style: italic; font-size: clamp(1.5rem, 3vw, 2rem);
  line-height: 1.2; color: var(--ink);
}
.daria-modal .gform_confirmation_message::before {
  content: ""; flex: 0 0 9px; width: 9px; height: 9px; border-radius: 50%;
  background: var(--coral); transform: translateY(-.3em);
}

body.daria-modal-open { overflow: hidden; }

@media (max-width: 720px) {
  .daria-modal { padding: 0; align-items: stretch; }
  .daria-modal-panel {
    width: 100%; max-height: 100vh; min-height: 100vh;
    padding: 72px 26px 40px; border: 0;
  }
  .daria-modal-title { font-size: 2rem; gap: 11px; }
  .daria-modal-title::before { flex-basis: 7px; width: 7px; height: 7px; }
  .daria-modal-note { padding-left: 18px; margin-bottom: 28px; }
  .daria-modal .gform_button { width: 100%; }
  /* A 186px box pushed the button off the first screen on a phone. */
  .daria-modal .gform_wrapper textarea { height: 92px !important; }
  .daria-modal .gform_fields { gap: 24px !important; }
}
@media (prefers-reduced-motion: reduce) {
  .daria-modal-panel, .daria-modal-backdrop, .daria-modal-panel::before,
  .daria-modal.is-closing .daria-modal-panel,
  .daria-modal.is-closing .daria-modal-backdrop { animation: none; }
  .daria-modal-close:hover { transform: none; }
  .daria-modal .gform_button:hover::after { transform: translateY(-50%); }
}

/* Hint under the phone/email pair: one of the two is enough. */
.daria-modal .daria-either-hint {
  display: flex; align-items: baseline; gap: 9px;
  margin: -12px 0 0; color: var(--muted);
  font-size: .82rem; line-height: 1.45;
}
.daria-modal .daria-either-hint::before {
  content: ""; flex: 0 0 5px; width: 5px; height: 5px; border-radius: 50%;
  background: var(--coral); transform: translateY(-.15em);
}
.daria-modal .gfield--type-html { padding: 0 !important; }

/* ==========================================================================
   Social links
   ========================================================================== */

.social-links {
  display: flex; flex-wrap: wrap; gap: 14px;
  margin: 0 0 32px; padding: 0; list-style: none;
}
/* Same idiom as the slider arrows: outlined circle that fills on hover. */
.social-link {
  width: 46px; height: 46px; display: grid; place-items: center;
  border: 1px solid rgba(255,255,255,.24); border-radius: 50%;
  color: var(--muted); background: transparent;
  transition: color .3s ease, background .3s ease, border-color .3s ease, transform .3s ease;
}
.social-link svg { width: 17px; height: 17px; fill: currentColor; display: block; }
.social-link:hover,
.social-link:focus-visible {
  color: #08090c; background: var(--ink); border-color: var(--ink);
  transform: translateY(-2px);
}

/* On the landing the row sits just above the status line. */
.contact-inner .social-links { justify-content: flex-end; margin-bottom: 26px; }
.site-footer .social-links { margin: 0; }

@media (max-width: 720px) {
  .contact-inner .social-links { justify-content: flex-start; }
  .social-links { gap: 11px; }
  .social-link { width: 42px; height: 42px; }
}
@media (prefers-reduced-motion: reduce) {
  .social-link:hover, .social-link:focus-visible { transform: none; }
}

/* Floating messenger button: step aside for the social icons at the end of the
   page instead of sitting on top of them. Only opacity and pointer-events are
   touched — the plugin owns the button's own transform and animations. */
.mwmessbtn-pulse-button {
  transition: opacity .45s ease, visibility .45s ease;
}
/* !important is required, not sloppiness: the plugin's entrance animation is
   declared "animation: mwmb-in-slide-up .5s ease both", and a filling animation
   keeps applying its last keyframe (opacity: 1) above any normal declaration.
   Only an important rule outranks it. */
body.daria-hide-messenger .mwmessbtn-pulse-button {
  opacity: 0 !important;
  visibility: hidden !important;
  pointer-events: none !important;
}
@media (prefers-reduced-motion: reduce) {
  .mwmessbtn-pulse-button { transition: none; }
}

/* ==========================================================================
   Cookie notice
   ========================================================================== */

/* Bottom-left on purpose: the floating messenger button lives bottom-right on
   every page. z-index stays under that button's 1000 (and under the contact
   modal's 1200 and the preloader's 1000) while clearing the noise layer's 99,
   so the notice is visible without ever sitting on top of the phone number. */
.daria-cookie {
  position: fixed;
  left: 24px;
  bottom: 24px;
  z-index: 900;
  width: min(420px, calc(100vw - 48px));
  padding: 20px 22px 18px;
  border: 1px solid var(--line);
  border-radius: 18px;
  background: var(--bg);
  box-shadow: 0 18px 46px rgba(0,0,0,.5);
  /* Hidden until script.js has read the cookie: opacity/visibility rather than
     display, so the entrance can be animated. [hidden] below is the state
     before JavaScript runs at all. */
  opacity: 0;
  visibility: hidden;
  transform: translateY(14px);
  transition: opacity .45s ease, transform .45s cubic-bezier(.16,1,.3,1), visibility .45s;
}
/* The rule above sets a real background and position, which would otherwise
   beat the user-agent's [hidden] { display: none } and let the markup flash
   before the script arrives. */
.daria-cookie[hidden] { display: none; }
.daria-cookie.is-open { opacity: 1; visibility: visible; transform: none; }

@supports (backdrop-filter: blur(14px)) or (-webkit-backdrop-filter: blur(14px)) {
  .daria-cookie {
    background: rgba(8,9,12,.82);
    -webkit-backdrop-filter: blur(14px);
    backdrop-filter: blur(14px);
  }
}

.daria-cookie .daria-cookie-text {
  margin: 0 0 16px;
  font-family: var(--sans);
  font-size: 14px;
  line-height: 1.55;
  color: var(--muted);
}

.daria-cookie .daria-cookie-actions { display: flex; flex-wrap: wrap; gap: 10px; }

/* Same pill as .work-all a, one size down. */
.daria-cookie .daria-cookie-button {
  display: inline-flex; align-items: center; justify-content: center;
  min-height: 42px; padding: 0 22px;
  border: 1px solid var(--line); border-radius: 999px;
  font: inherit; font-size: .85rem; letter-spacing: .02em; cursor: pointer;
  background: transparent; color: var(--ink);
  transition: color .3s ease, background .3s ease, border-color .3s ease, transform .3s ease;
}
.daria-cookie .daria-cookie-accept {
  background: var(--ink); border-color: var(--ink); color: var(--bg); font-weight: 500;
}
.daria-cookie .daria-cookie-accept:hover,
.daria-cookie .daria-cookie-accept:focus-visible { background: #fff; border-color: #fff; transform: translateY(-1px); }
.daria-cookie .daria-cookie-decline { color: var(--muted); }
.daria-cookie .daria-cookie-decline:hover,
.daria-cookie .daria-cookie-decline:focus-visible {
  color: var(--ink); border-color: rgba(255,255,255,.38); background: rgba(255,255,255,.06);
}
/* The global :focus-visible outline is coral at 3px offset; spelled out here so
   it survives the filled accept button's own background change. */
.daria-cookie .daria-cookie-button:focus-visible { outline: 2px solid var(--coral); outline-offset: 3px; }

/* Below 600px the notice spans the screen, and sits above the messenger button
   instead of beside it — at 60px the button would need a 100px column and the
   text would be squeezed into three lines. The offsets read the plugin's own
   custom properties (declared on :root) so a change in its settings moves the
   notice too; the fallbacks are the plugin's defaults. */
@media (max-width: 600px) {
  .daria-cookie {
    left: 14px; right: 14px; width: auto;
    bottom: calc(var(--mwmessbtn-mobile-bottom, 70px) + var(--mwmessbtn-size-mobile, 60px) + 14px);
    padding: 18px 18px 16px; border-radius: 16px;
  }
  .daria-cookie .daria-cookie-button { flex: 1 1 auto; }
}

@media (prefers-reduced-motion: reduce) {
  .daria-cookie { transition: none; transform: none; }
  .daria-cookie .daria-cookie-button { transition: none; }
  .daria-cookie .daria-cookie-accept:hover,
  .daria-cookie .daria-cookie-accept:focus-visible { transform: none; }
}