@font-face {
  font-family: "Onest Variable";
  font-style: normal;
  font-display: swap;
  font-weight: 100 900;
  src: url("/fonts/onest-cyrillic-wght-normal.woff2") format("woff2-variations");
  unicode-range: U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116;
}

@font-face {
  font-family: "Onest Variable";
  font-style: normal;
  font-display: swap;
  font-weight: 100 900;
  src: url("/fonts/onest-latin-wght-normal.woff2") format("woff2-variations");
  unicode-range: U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}

@font-face {
  font-family: "Onest Variable";
  font-style: normal;
  font-display: swap;
  font-weight: 100 900;
  src: url("/fonts/onest-symbols-wght-normal.woff2") format("woff2-variations");
  unicode-range: U+2190,U+2192,U+2194-2199,U+2218-2219,U+2299,U+2300-243F,U+2460-24FF,U+25A0-27BF,U+2B00-2BFF;
}

html { scroll-behavior: smooth; color-scheme: light dark; background: light-dark(#edf1f1, #0d1418); }
      body { min-width: 320px; margin: 0; background: light-dark(#edf1f1, #0d1418); }
      @media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }

#polina-portfolio-mockup {
      --polina-bg: light-dark(#edf1f1, #0d1418);
      --polina-surface: light-dark(#f9fbfa, #141f24);
      --polina-surface-2: light-dark(#e1e9e8, #1b292f);
      --polina-ink: light-dark(#122127, #edf4f1);
      --polina-muted: light-dark(#53666d, #9fb0b3);
      --polina-line: light-dark(#bdcacb, #304249);
      --polina-cyan: light-dark(#137d84, #63c2c6);
      --polina-cyan-soft: light-dark(#d4e9e9, #17383d);
      --polina-brass: light-dark(#95692e, #d8b06c);
      --polina-brass-soft: light-dark(#eee1cb, #3a3021);
      --polina-red: light-dark(#a84a42, #e17d72);
      --polina-shadow: light-dark(rgba(21, 46, 54, .12), rgba(0, 0, 0, .34));
      --polina-font-text: "Onest Variable", "Segoe UI", Arial, sans-serif;
      --polina-font-display: "Onest Variable", "Segoe UI", Arial, sans-serif;
      color-scheme: light dark;
      width: 100%;
      overflow: hidden;
      background: var(--polina-bg);
      color: var(--polina-ink);
      font-family: var(--polina-font-text);
      border-radius: 0;
      box-shadow: none;
    }

    #polina-portfolio-mockup * { box-sizing: border-box; }
    #polina-portfolio-mockup a { color: inherit; }
    #polina-portfolio-mockup button { font: inherit; }

    #polina-portfolio-mockup .polina-shell {
      width: min(100%, 1180px);
      margin: 0 auto;
      padding: 0 34px;
    }

    #polina-portfolio-mockup .polina-nav {
      display: flex;
      align-items: center;
      justify-content: flex-end;
      gap: 24px;
      padding: 26px 0 20px;
      border-bottom: 1px solid var(--polina-line);
    }

    #polina-portfolio-mockup .polina-wordmark {
      display: inline-flex;
      align-items: baseline;
      gap: 10px;
      text-decoration: none;
      letter-spacing: .08em;
      text-transform: uppercase;
      font-weight: 650;
    }

    #polina-portfolio-mockup .polina-wordmark small {
      color: var(--polina-cyan);
      font-size: .7rem;
      letter-spacing: .12em;
      font-weight: 650;
    }

    #polina-portfolio-mockup .polina-nav-links {
      display: flex;
      flex-wrap: wrap;
      justify-content: flex-end;
      gap: 8px 20px;
    }

    #polina-portfolio-mockup .polina-nav-links a {
      color: var(--polina-muted);
      text-decoration: none;
      font-size: .86rem;
    }

    #polina-portfolio-mockup .polina-nav-links a:hover,
    #polina-portfolio-mockup .polina-nav-links a:focus-visible { color: var(--polina-ink); }

    #polina-portfolio-mockup .polina-hero {
      display: grid;
      grid-template-columns: minmax(0, 1.45fr) minmax(290px, .75fr);
      gap: clamp(44px, 8vw, 108px);
      align-items: end;
      padding: clamp(70px, 10vw, 126px) 0 72px;
    }

    #polina-portfolio-mockup .polina-kicker,
    #polina-portfolio-mockup .polina-section-number,
    #polina-portfolio-mockup .polina-media-label,
    #polina-portfolio-mockup .polina-stage-index {
      font-size: .72rem;
      line-height: 1.35;
      text-transform: uppercase;
      letter-spacing: .16em;
      color: var(--polina-cyan);
      font-weight: 650;
    }

    #polina-portfolio-mockup .polina-hero h1 {
      margin: 18px 0 26px;
      max-width: 830px;
      font-family: var(--polina-font-display);
      font-size: clamp(2.15rem, 3.6vw, 3.3rem);
      font-weight: 400;
      line-height: .92;
      letter-spacing: -.055em;
    }

    #polina-portfolio-mockup .polina-hero h1 em {
      display: block;
      color: var(--polina-cyan);
      font-style: italic;
    }

    #polina-portfolio-mockup .polina-hero-lead {
      max-width: 690px;
      margin: 0;
      color: var(--polina-muted);
      font-size: clamp(1.05rem, 2.1vw, 1.32rem);
      line-height: 1.62;
    }

    #polina-portfolio-mockup .polina-hero-actions,
    #polina-portfolio-mockup .polina-contact-actions {
      display: flex;
      flex-wrap: wrap;
      gap: 12px;
      margin-top: 34px;
    }

    #polina-portfolio-mockup .polina-action {
      min-height: 44px;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      gap: 9px;
      padding: 10px 16px;
      border: 1px solid var(--polina-line);
      border-radius: 999px;
      background: var(--polina-surface);
      color: var(--polina-ink);
      text-decoration: none;
      font-size: .9rem;
      box-shadow: 0 8px 22px transparent;
      transition: transform .2s ease, border-color .2s ease, box-shadow .2s ease;
    }

    #polina-portfolio-mockup .polina-action:hover,
    #polina-portfolio-mockup .polina-action:focus-visible {
      transform: translateY(-2px);
      border-color: var(--polina-cyan);
      box-shadow: 0 10px 26px var(--polina-shadow);
    }

    #polina-portfolio-mockup .polina-action-primary {
      background: var(--polina-ink);
      border-color: var(--polina-ink);
      color: var(--polina-bg);
    }

    #polina-portfolio-mockup .polina-telegram-icon,
    #polina-portfolio-mockup .polina-mail-icon {
      width: 17px;
      height: 17px;
      flex: 0 0 auto;
    }

    #polina-portfolio-mockup .polina-telegram-icon {
      fill: currentColor;
    }

    #polina-portfolio-mockup .polina-mail-icon {
      fill: none;
      stroke: currentColor;
      stroke-linecap: round;
      stroke-linejoin: round;
      stroke-width: 1.8;
    }

    #polina-portfolio-mockup .polina-action__label {
      display: block;
      white-space: nowrap;
      line-height: 1.15;
    }

    #polina-portfolio-mockup .polina-action[href^="mailto:"] .polina-action__label {
      transform: translateY(-1.5px);
    }

    #polina-portfolio-mockup .polina-hero-map {
      position: relative;
      padding: 30px 0 4px 30px;
      border-left: 1px solid var(--polina-line);
    }

    #polina-portfolio-mockup .polina-hero-map::before {
      content: "";
      position: absolute;
      left: -4px;
      top: 31px;
      width: 7px;
      height: 7px;
      border-radius: 50%;
      background: var(--polina-brass);
      box-shadow: 0 78px 0 var(--polina-cyan), 0 156px 0 var(--polina-red);
    }

    #polina-portfolio-mockup .polina-map-title {
      margin: 0 0 28px;
      color: var(--polina-muted);
      font-size: .82rem;
      line-height: 1.5;
    }

    #polina-portfolio-mockup .polina-map-item {
      display: grid;
      grid-template-columns: 34px 1fr;
      gap: 12px;
      align-items: baseline;
      padding: 14px 0;
      border-top: 1px solid var(--polina-line);
    }

    #polina-portfolio-mockup .polina-map-item strong { font-size: .95rem; }
    #polina-portfolio-mockup .polina-map-item span { color: var(--polina-muted); font-size: .8rem; }

    #polina-portfolio-mockup .polina-principle {
      display: grid;
      grid-template-columns: minmax(190px, .7fr) minmax(0, 1.6fr);
      gap: 48px;
      padding: 34px 0;
      border-top: 1px solid var(--polina-line);
      border-bottom: 1px solid var(--polina-line);
    }

    #polina-portfolio-mockup .polina-principle p {
      margin: 0;
      max-width: 760px;
      font-family: var(--polina-font-display);
      font-size: clamp(1.25rem, 2.1vw, 1.75rem);
      line-height: 1.42;
      letter-spacing: -.025em;
    }

    #polina-portfolio-mockup .polina-section { padding: clamp(54px, 6.5vw, 82px) 0; }

    #polina-portfolio-mockup .polina-section-head {
      display: grid;
      grid-template-columns: minmax(210px, .65fr) minmax(0, 1.5fr);
      gap: 48px;
      margin-bottom: 48px;
    }

    #polina-portfolio-mockup .polina-section-head h2 {
      margin: 0;
      max-width: 860px;
      font-family: var(--polina-font-display);
      font-size: clamp(1.9rem, 3.5vw, 3.15rem);
      font-weight: 400;
      line-height: 1.08;
      letter-spacing: -.035em;
    }

    #polina-portfolio-mockup .polina-section-head h2 span { color: var(--polina-cyan); }

    #polina-portfolio-mockup .polina-timeline {
      display: grid;
      grid-template-columns: repeat(4, minmax(0, 1fr));
      border-top: 1px solid var(--polina-line);
      border-bottom: 1px solid var(--polina-line);
    }

    #polina-portfolio-mockup .polina-stage {
      min-height: 250px;
      padding: 26px 24px 30px 0;
    }

    #polina-portfolio-mockup .polina-stage + .polina-stage {
      padding-left: 24px;
      border-left: 1px solid var(--polina-line);
    }

    #polina-portfolio-mockup .polina-stage h3 {
      margin: 52px 0 12px;
      font-family: var(--polina-font-display);
      font-size: 1.08rem;
      font-weight: 400;
      line-height: 1.25;
    }

    #polina-portfolio-mockup .polina-stage p {
      margin: 0;
      color: var(--polina-muted);
      line-height: 1.55;
      font-size: .88rem;
    }

    #polina-portfolio-mockup .polina-cases {
      padding-top: 22px;
    }

    #polina-portfolio-mockup .polina-section-head__copy > p {
      max-width: 720px;
      margin: 20px 0 0;
      color: var(--polina-muted);
      font-size: 1rem;
      line-height: 1.65;
    }

    #polina-portfolio-mockup .polina-case-list {
      display: grid;
      gap: 18px;
    }

    #polina-portfolio-mockup .polina-case {
      position: relative;
      display: grid;
      grid-template-columns: minmax(170px, .42fr) minmax(0, 1.2fr) minmax(240px, .72fr);
      gap: clamp(26px, 4vw, 54px);
      align-items: stretch;
      overflow: hidden;
      padding: clamp(24px, 3.5vw, 40px);
      border: 1px solid var(--polina-line);
      border-radius: 22px;
      background:
        linear-gradient(135deg, color-mix(in srgb, var(--polina-cyan) 7%, transparent), transparent 42%),
        var(--polina-surface);
      box-shadow: 0 18px 44px color-mix(in srgb, var(--polina-shadow) 62%, transparent);
    }

    #polina-portfolio-mockup .polina-case::before {
      position: absolute;
      top: 0;
      right: 0;
      left: 0;
      height: 3px;
      background: linear-gradient(90deg, var(--polina-cyan), var(--polina-brass), transparent 76%);
      content: "";
    }

    #polina-portfolio-mockup .polina-case:nth-child(2) {
      background:
        linear-gradient(135deg, color-mix(in srgb, var(--polina-brass) 9%, transparent), transparent 42%),
        var(--polina-surface);
    }

    #polina-portfolio-mockup .polina-case:nth-child(2) .polina-case__result {
      background: var(--polina-brass-soft);
    }

    #polina-portfolio-mockup .polina-case:nth-child(2) .polina-case__result::before,
    #polina-portfolio-mockup .polina-case:nth-child(2) .polina-case__result strong {
      color: var(--polina-brass);
    }

    #polina-portfolio-mockup .polina-case__result {
      align-self: stretch;
      display: flex;
      flex-direction: column;
      justify-content: center;
      min-height: 168px;
      padding: 24px;
      border-radius: 16px;
      background: var(--polina-cyan-soft);
    }

    #polina-portfolio-mockup .polina-case__result::before {
      margin-bottom: 16px;
      color: var(--polina-cyan);
      content: "Результат";
      font-size: .68rem;
      font-weight: 650;
      letter-spacing: .14em;
      text-transform: uppercase;
    }

    #polina-portfolio-mockup .polina-case__result strong {
      display: block;
      color: var(--polina-cyan);
      font-family: var(--polina-font-display);
      font-size: clamp(2rem, 3.4vw, 3.15rem);
      font-weight: 400;
      line-height: 1.02;
      letter-spacing: -.035em;
    }

    #polina-portfolio-mockup .polina-case__result--long strong {
      font-size: clamp(1.45rem, 2.2vw, 2rem);
      line-height: 1.12;
    }

    #polina-portfolio-mockup .polina-case__result span {
      display: block;
      max-width: 130px;
      margin-top: 8px;
      color: var(--polina-muted);
      font-size: .75rem;
      line-height: 1.4;
    }

    #polina-portfolio-mockup .polina-case__eyebrow {
      margin-bottom: 12px;
      color: var(--polina-brass);
      font-size: .7rem;
      font-weight: 650;
      letter-spacing: .12em;
      text-transform: uppercase;
    }

    #polina-portfolio-mockup .polina-case__body h3 {
      margin: 0;
      max-width: 650px;
      font-family: var(--polina-font-display);
      font-size: clamp(1.45rem, 2.4vw, 2rem);
      font-weight: 400;
      line-height: 1.2;
      letter-spacing: -.025em;
    }

    #polina-portfolio-mockup .polina-case__body {
      align-self: center;
    }

    #polina-portfolio-mockup .polina-case__body p {
      max-width: 690px;
      margin: 16px 0 0;
      color: var(--polina-muted);
      line-height: 1.6;
    }

    #polina-portfolio-mockup .polina-case__details {
      align-self: center;
      justify-self: center;
      display: grid;
      gap: 12px;
      width: min(100%, 280px);
      margin: 0;
      padding: 0;
      list-style: none;
      color: var(--polina-muted);
      font-size: .82rem;
      line-height: 1.45;
    }

    #polina-portfolio-mockup .polina-case__details li {
      position: relative;
      padding: 10px 14px 10px 30px;
      border-radius: 10px;
      background: var(--polina-bg);
      text-align: center;
    }

    #polina-portfolio-mockup .polina-case__details li::before {
      position: absolute;
      top: 50%;
      left: 14px;
      width: 6px;
      height: 6px;
      border-radius: 50%;
      background: var(--polina-brass);
      content: "";
      transform: translateY(-50%);
    }

    #polina-portfolio-mockup .polina-help {
      padding-top: 22px;
    }

    #polina-portfolio-mockup .polina-help-grid {
      display: grid;
      grid-template-columns: repeat(3, minmax(0, 1fr));
      gap: 14px;
    }

    #polina-portfolio-mockup .polina-help-item {
      position: relative;
      min-height: 250px;
      padding: 26px;
      overflow: hidden;
      border: 1px solid var(--polina-line);
      border-radius: 18px;
      background:
        linear-gradient(145deg, color-mix(in srgb, var(--polina-cyan) 5%, transparent), transparent 46%),
        var(--polina-surface);
    }

    #polina-portfolio-mockup .polina-help-item::after {
      position: absolute;
      right: -36px;
      bottom: -54px;
      width: 116px;
      height: 116px;
      border: 1px solid color-mix(in srgb, var(--polina-cyan) 22%, transparent);
      border-radius: 50%;
      content: "";
    }

    #polina-portfolio-mockup .polina-help-item > span {
      color: var(--polina-cyan);
      font-size: .7rem;
      font-weight: 650;
      letter-spacing: .14em;
    }

    #polina-portfolio-mockup .polina-help-item h3 {
      max-width: 280px;
      margin: 30px 0 12px;
      font-family: var(--polina-font-display);
      font-size: 1.18rem;
      font-weight: 400;
      line-height: 1.25;
      letter-spacing: -.02em;
    }

    #polina-portfolio-mockup .polina-help-item p {
      position: relative;
      z-index: 1;
      margin: 0;
      color: var(--polina-muted);
      font-size: .86rem;
      line-height: 1.55;
    }

    #polina-portfolio-mockup .polina-work-cta {
      display: grid;
      grid-template-columns: minmax(0, 1.15fr) minmax(280px, .85fr);
      gap: clamp(36px, 7vw, 90px);
      align-items: end;
      margin-bottom: clamp(28px, 4vw, 46px);
      padding: clamp(34px, 5vw, 58px);
      border-radius: 24px;
      background: color-mix(in srgb, var(--polina-ink) 90%, var(--polina-bg));
      color: var(--polina-bg);
    }

    #polina-portfolio-mockup .polina-work-cta .polina-kicker {
      color: var(--polina-brass);
    }

    #polina-portfolio-mockup .polina-work-cta h2 {
      margin: 0;
      max-width: 650px;
      font-family: var(--polina-font-display);
      font-size: clamp(1.85rem, 3.5vw, 3.15rem);
      font-weight: 400;
      line-height: 1.08;
      letter-spacing: -.035em;
    }

    #polina-portfolio-mockup .polina-work-cta p {
      margin: 0;
      color: color-mix(in srgb, var(--polina-bg) 72%, transparent);
      line-height: 1.65;
    }

    #polina-portfolio-mockup .polina-work-cta .polina-action-primary {
      border-color: var(--polina-bg);
      background: var(--polina-bg);
      color: var(--polina-ink);
    }

    #polina-portfolio-mockup .polina-work-cta .polina-action:not(.polina-action-primary) {
      border-color: color-mix(in srgb, var(--polina-bg) 28%, transparent);
      background: transparent;
      color: var(--polina-bg);
    }

    #polina-portfolio-mockup .polina-projects-wrap {
      background: var(--polina-surface);
      border-top: 1px solid var(--polina-line);
      border-bottom: 1px solid var(--polina-line);
    }

    #polina-portfolio-mockup .polina-project-grid {
      display: grid;
      grid-template-columns: repeat(2, minmax(0, 1fr));
      gap: 18px;
    }

    #polina-portfolio-mockup .polina-project {
      overflow: hidden;
      background: var(--polina-bg);
      border: 1px solid var(--polina-line);
      border-radius: 22px;
    }

    #polina-portfolio-mockup .polina-project-top { padding: 28px 28px 24px; }

    #polina-portfolio-mockup .polina-project-name {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 18px;
    }

    #polina-portfolio-mockup .polina-project-name h3 {
      margin: 0;
      font-family: var(--polina-font-display);
      font-size: clamp(2rem, 4vw, 3.1rem);
      font-weight: 400;
      letter-spacing: -.04em;
    }

    #polina-portfolio-mockup .polina-project-name .polina-icon { color: var(--polina-cyan); }

    #polina-portfolio-mockup .polina-project-top > p {
      min-height: 78px;
      margin: 16px 0 24px;
      color: var(--polina-muted);
      line-height: 1.55;
    }

    #polina-portfolio-mockup .polina-tabs {
      display: flex;
      flex-wrap: wrap;
      gap: 8px;
    }

    #polina-portfolio-mockup .polina-tabs button {
      min-height: 42px;
      padding: 8px 12px;
      border: 1px solid var(--polina-line);
      border-radius: 999px;
      background: transparent;
      color: var(--polina-muted);
    }

    #polina-portfolio-mockup .polina-tabs button[aria-selected="true"] {
      border-color: var(--polina-cyan);
      background: var(--polina-cyan-soft);
      color: var(--polina-ink);
    }

    #polina-portfolio-mockup .polina-media {
      position: relative;
      min-height: 330px;
      display: grid;
      align-content: space-between;
      gap: 24px;
      padding: 26px;
      background:
        linear-gradient(130deg, transparent 28%, color-mix(in srgb, var(--polina-cyan) 10%, transparent) 28%, transparent 29%),
        linear-gradient(var(--polina-surface-2), var(--polina-surface-2));
      border-top: 1px solid var(--polina-line);
    }

    #polina-portfolio-mockup .polina-project:nth-child(2) .polina-media {
      background:
        radial-gradient(circle at 77% 28%, color-mix(in srgb, var(--polina-brass) 22%, transparent), transparent 26%),
        linear-gradient(var(--polina-surface-2), var(--polina-surface-2));
    }

    #polina-portfolio-mockup .polina-media-chrome {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 16px;
    }

    #polina-portfolio-mockup .polina-window-dots { display: flex; gap: 6px; }
    #polina-portfolio-mockup .polina-window-dots span { width: 7px; height: 7px; border-radius: 50%; background: var(--polina-line); }
    #polina-portfolio-mockup .polina-window-dots span:first-child { background: var(--polina-brass); }

    #polina-portfolio-mockup .polina-media-center { max-width: 360px; }
    #polina-portfolio-mockup .polina-media-center .polina-icon { width: 30px; height: 30px; color: var(--polina-cyan); margin-bottom: 18px; }

    #polina-portfolio-mockup .polina-media-center strong {
      display: block;
      font-size: 1.04rem;
      line-height: 1.35;
    }

    #polina-portfolio-mockup .polina-media-center p,
    #polina-portfolio-mockup .polina-media-note {
      margin: 8px 0 0;
      color: var(--polina-muted);
      font-size: .84rem;
      line-height: 1.5;
    }

    #polina-portfolio-mockup .polina-maker-grid {
      display: grid;
      grid-template-columns: minmax(250px, .75fr) minmax(0, 1.55fr);
      gap: 42px;
      align-items: start;
    }

    #polina-portfolio-mockup .polina-maker-copy p {
      margin: 0 0 24px;
      color: var(--polina-muted);
      font-size: 1.02rem;
      line-height: 1.68;
    }

    #polina-portfolio-mockup .polina-flow {
      display: flex;
      flex-wrap: wrap;
      gap: 8px;
    }

    #polina-portfolio-mockup .polina-flow span {
      display: inline-flex;
      align-items: center;
      min-height: 36px;
      padding: 6px 10px;
      border-radius: 999px;
      background: var(--polina-brass-soft);
      color: var(--polina-brass);
      font-size: .78rem;
      font-weight: 650;
    }

    #polina-portfolio-mockup .polina-comparison {
      display: grid;
      grid-template-columns: repeat(2, minmax(0, 1fr));
      overflow: hidden;
      border: 1px solid var(--polina-line);
      border-radius: 22px;
      background: var(--polina-surface);
    }

    #polina-portfolio-mockup .polina-hand-panel { min-height: 420px; display: flex; flex-direction: column; }
    #polina-portfolio-mockup .polina-hand-panel + .polina-hand-panel { border-left: 1px solid var(--polina-line); }

    #polina-portfolio-mockup .polina-hand-visual {
      flex: 1;
      min-height: 280px;
      display: grid;
      place-items: center;
      position: relative;
      padding: 28px;
      background:
        linear-gradient(90deg, color-mix(in srgb, var(--polina-line) 28%, transparent) 1px, transparent 1px),
        linear-gradient(color-mix(in srgb, var(--polina-line) 28%, transparent) 1px, transparent 1px),
        var(--polina-surface-2);
      background-size: 24px 24px;
    }

    #polina-portfolio-mockup .polina-hand-visual .polina-icon { width: 46px; height: 46px; color: var(--polina-cyan); }
    #polina-portfolio-mockup .polina-hand-panel:last-child .polina-hand-visual .polina-icon { color: var(--polina-red); }

    #polina-portfolio-mockup .polina-hand-overlay {
      position: absolute;
      left: 18px;
      top: 18px;
      max-width: 170px;
      padding: 8px 10px;
      background: var(--polina-surface);
      border: 1px solid var(--polina-line);
      border-radius: 10px;
      color: var(--polina-muted);
      font-size: .72rem;
      line-height: 1.35;
    }

    #polina-portfolio-mockup .polina-hand-caption { padding: 22px; }
    #polina-portfolio-mockup .polina-hand-caption strong { display: block; margin-bottom: 6px; font-family: var(--polina-font-display); font-size: 1.05rem; font-weight: 400; }
    #polina-portfolio-mockup .polina-hand-caption span { color: var(--polina-muted); font-size: .82rem; line-height: 1.45; }

    #polina-portfolio-mockup .polina-music-note {
      display: grid;
      grid-template-columns: minmax(110px, .35fr) minmax(0, 1.65fr);
      gap: 32px;
      padding: 28px 0;
      border-top: 1px solid var(--polina-line);
      border-bottom: 1px solid var(--polina-line);
    }

    #polina-portfolio-mockup .polina-music-note p {
      margin: 0;
      color: var(--polina-muted);
      line-height: 1.65;
    }

    #polina-portfolio-mockup .polina-music-note strong { color: var(--polina-ink); }

    #polina-portfolio-mockup .polina-footer-contact {
      display: grid;
      grid-template-columns: minmax(0, 1.3fr) minmax(280px, .7fr);
      gap: 42px;
      align-items: end;
      padding: clamp(52px, 6.5vw, 82px) 0;
    }

    #polina-portfolio-mockup .polina-footer-contact h2 {
      margin: 0;
      max-width: 680px;
      font-family: var(--polina-font-display);
      font-size: clamp(1.9rem, 3.5vw, 3.15rem);
      font-weight: 400;
      line-height: 1.08;
      letter-spacing: -.035em;
    }

    #polina-portfolio-mockup .polina-footer-contact .polina-contact-actions {
      justify-content: flex-end;
      margin-top: 0;
    }

    #polina-portfolio-mockup .polina-contact {
      display: grid;
      grid-template-columns: minmax(0, 1.45fr) minmax(250px, .55fr);
      gap: 48px;
      align-items: end;
      padding: clamp(82px, 11vw, 132px) 0 54px;
    }

    #polina-portfolio-mockup .polina-contact h2 {
      margin: 16px 0 0;
      max-width: 760px;
      font-family: var(--polina-font-display);
      font-size: clamp(2.35rem, 5.8vw, 5.2rem);
      font-weight: 400;
      line-height: 1;
      letter-spacing: -.05em;
    }

    #polina-portfolio-mockup .polina-contact-note { margin: 0; color: var(--polina-muted); line-height: 1.6; }

    #polina-portfolio-mockup .polina-footer {
      display: flex;
      justify-content: space-between;
      gap: 24px;
      padding: 22px 0 28px;
      border-top: 1px solid var(--polina-line);
      color: var(--polina-muted);
      font-size: .78rem;
    }

    #polina-portfolio-mockup .polina-icon {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      width: 17px;
      height: 17px;
      font-family: var(--polina-font-display);
      font-size: 1.1rem;
      line-height: 1;
    }

    @media (max-width: 820px) {
      #polina-portfolio-mockup .polina-shell { padding: 0 22px; }
      #polina-portfolio-mockup .polina-hero,
      #polina-portfolio-mockup .polina-section-head,
      #polina-portfolio-mockup .polina-principle,
      #polina-portfolio-mockup .polina-maker-grid,
      #polina-portfolio-mockup .polina-contact { grid-template-columns: 1fr; }
      #polina-portfolio-mockup .polina-hero { align-items: start; gap: 38px; padding-top: 70px; }
      #polina-portfolio-mockup .polina-hero-map { max-width: 430px; }
      #polina-portfolio-mockup .polina-section-head { gap: 18px; }
      #polina-portfolio-mockup .polina-timeline { grid-template-columns: repeat(2, minmax(0, 1fr)); }
      #polina-portfolio-mockup .polina-stage:nth-child(3) { border-left: 0; }
      #polina-portfolio-mockup .polina-stage:nth-child(n+3) { border-top: 1px solid var(--polina-line); }
      #polina-portfolio-mockup .polina-stage:nth-child(3) { padding-left: 0; }
      #polina-portfolio-mockup .polina-project-grid { grid-template-columns: 1fr; }
      #polina-portfolio-mockup .polina-help-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
      #polina-portfolio-mockup .polina-project-top > p { min-height: auto; }
      #polina-portfolio-mockup .polina-case { grid-template-columns: minmax(150px, .42fr) minmax(0, 1fr); }
      #polina-portfolio-mockup .polina-case__result { padding: 18px; }
      #polina-portfolio-mockup .polina-case__details { grid-column: 2; }
      #polina-portfolio-mockup .polina-work-cta { grid-template-columns: 1fr; align-items: start; }
      #polina-portfolio-mockup .polina-music-note { grid-template-columns: 1fr; gap: 12px; }
      #polina-portfolio-mockup .polina-footer-contact { grid-template-columns: 1fr; align-items: start; }
      #polina-portfolio-mockup .polina-footer-contact .polina-contact-actions { justify-content: flex-start; }
    }

    @media (max-width: 560px) {
      #polina-portfolio-mockup { border-radius: 12px; }
      #polina-portfolio-mockup .polina-shell { padding: 0 17px; }
      #polina-portfolio-mockup .polina-nav { align-items: flex-start; overflow-x: auto; }
      #polina-portfolio-mockup .polina-nav-links { flex-wrap: nowrap; justify-content: flex-start; width: 100%; }
      #polina-portfolio-mockup .polina-hero { padding: 54px 0 52px; }
      #polina-portfolio-mockup .polina-hero h1 { font-size: clamp(2rem, 8vw, 2.35rem); }
      #polina-portfolio-mockup .polina-principle { gap: 20px; }
      #polina-portfolio-mockup .polina-section { padding: 56px 0; }
      #polina-portfolio-mockup .polina-timeline { grid-template-columns: 1fr; }
      #polina-portfolio-mockup .polina-stage,
      #polina-portfolio-mockup .polina-stage + .polina-stage { min-height: auto; padding: 24px 0; border-left: 0; border-top: 1px solid var(--polina-line); }
      #polina-portfolio-mockup .polina-stage:first-child { border-top: 0; }
      #polina-portfolio-mockup .polina-stage h3 { margin-top: 28px; }
      #polina-portfolio-mockup .polina-case { grid-template-columns: 1fr; gap: 22px; }
      #polina-portfolio-mockup .polina-case__details { grid-column: auto; }
      #polina-portfolio-mockup .polina-work-cta { padding: 30px 22px; }
      #polina-portfolio-mockup .polina-project-top { padding: 22px; }
      #polina-portfolio-mockup .polina-help-grid { grid-template-columns: 1fr; }
      #polina-portfolio-mockup .polina-help-item { min-height: 220px; }
      #polina-portfolio-mockup .polina-media { min-height: 300px; padding: 22px; }
      #polina-portfolio-mockup .polina-comparison { grid-template-columns: 1fr; }
      #polina-portfolio-mockup .polina-hand-panel + .polina-hand-panel { border-left: 0; border-top: 1px solid var(--polina-line); }
      #polina-portfolio-mockup .polina-contact { gap: 28px; }
      #polina-portfolio-mockup .polina-contact-actions { margin-top: 0; }
      #polina-portfolio-mockup .polina-action { width: 100%; }
      #polina-portfolio-mockup .polina-footer { flex-direction: column; gap: 8px; }
    }

    @media (prefers-reduced-motion: reduce) {
      #polina-portfolio-mockup .polina-action { transition: none; }
    }