    :root {
      --lime: #535864;
      --ink: #090909;
      --paper: #ffffff;
      --soft: #f5f5f5;
      --line: #dddddd;
      --max: 1600px;
      --desktop-hero-height: max(72vh, calc(100vh - 240px));
      --contact-footer-height: 54px;
    }

    * {
      box-sizing: border-box;
      -webkit-user-select: none;
      user-select: none;
    }
    [hidden] { display: none !important; }
    html {
      scroll-behavior: smooth;
      touch-action: manipulation;
    }
    body {
      margin: 0;
      color: var(--ink);
      background: var(--paper);
      font-family: Arial, Helvetica, sans-serif;
      -webkit-font-smoothing: antialiased;
    }

    a { color: inherit; text-decoration: none; }
    button { font: inherit; }

    input,
    textarea,
    select {
      -webkit-user-select: text;
      user-select: text;
    }

    .page-loader {
      position: fixed;
      inset: 0;
      z-index: 4000;
      display: grid;
      place-items: center;
      padding: 24px;
      color: #fff;
      background: linear-gradient(135deg, rgba(8, 8, 8, 0.95) 0%, rgba(23, 23, 23, 0.95) 100%);
      -webkit-backdrop-filter: blur(12px);
      backdrop-filter: blur(12px);
      transform: translateY(0);
      transition: transform 720ms cubic-bezier(0.76, 0, 0.24, 1);
    }

    .page-loader.loaded {
      transform: translateY(-101%);
    }

    .page-loader-content {
      width: 100%;
      min-width: 0;
      display: grid;
      justify-items: center;
      gap: 30px;
      text-align: center;
      transition: opacity 240ms ease, transform 240ms ease;
    }

    .page-loader.loaded .page-loader-content {
      opacity: 0;
      transform: translateY(12px);
    }

    .page-loader-logo {
      width: 88px;
      height: auto;
      display: block;
      animation: page-loader-logo-pulse 1.25s ease-in-out infinite;
    }

    .page-loader-progress {
      position: relative;
      width: 50vw;
      height: 4px;
      justify-self: center;
      overflow: hidden;
      background: rgba(255, 255, 255, 0.18);
    }

    .page-loader-progress::after {
      content: "";
      position: absolute;
      inset: 0;
      background: #fff;
      transform: translateX(-101%);
      animation: page-loader-progress 1.1s cubic-bezier(0.76, 0, 0.24, 1) infinite;
    }

    @keyframes page-loader-logo-pulse {
      0%, 100% { opacity: 0.5; transform: scale(0.96); }
      50% { opacity: 1; transform: scale(1); }
    }

    @keyframes page-loader-progress {
      0% { transform: translateX(-101%); }
      50% { transform: translateX(0); }
      100% { transform: translateX(101%); }
    }

    .page {
      min-height: 100vh;
      display: flex;
      flex-direction: column;
    }

    .hero {
      position: relative;
      overflow: hidden;
      min-height: 72vh;
      background: #03021d;
      display: flex;
      flex-direction: column;
    }

    .hero-backgrounds {
      position: absolute;
      inset: 0;
      z-index: 0;
      pointer-events: none;
      transition: opacity 550ms ease;
    }

    .hero-background {
      position: absolute;
      inset: 0;
      background-position: center;
      background-size: cover;
      opacity: 0;
      transition: opacity 700ms ease;
    }

    .hero-background.active { opacity: 1; }

    .hero.projects-mode .hero-backgrounds { opacity: 0; }

    .hero::after {
      content: "";
      position: absolute;
      inset: 0;
      z-index: 2;
      pointer-events: none;
      background: linear-gradient(135deg, rgba(8, 8, 8, 0.8) 0%, rgba(23, 23, 23, 0.8) 100%);
      -webkit-backdrop-filter: blur(12px);
      backdrop-filter: blur(12px);
      box-shadow: 0 18px 60px rgba(0, 0, 0, 0.35);
      transform: translateY(-101%);
    }

    .hero.mode-transitioning::after {
      animation: minimal-page-wipe 720ms cubic-bezier(0.76, 0, 0.24, 1) both;
    }

    .hero.mode-transitioning .hero-copy {
      animation: minimal-content-change 720ms ease-in-out;
    }

    @keyframes minimal-page-wipe {
      0% { transform: translateY(-101%); }
      45%, 55% { transform: translateY(0); }
      100% { transform: translateY(101%); }
    }

    @keyframes minimal-content-change {
      0%, 100% { opacity: 1; }
      45%, 55% { opacity: 0.2; }
    }

    .shell {
      width: min(100%, var(--max));
      margin-inline: auto;
      padding-inline: clamp(24px, 4vw, 62px);
    }

    .topbar {
      position: fixed;
      top: 0;
      left: 50%;
      z-index: 1000;
      isolation: isolate;
      transform: translateX(-50%);
      min-height: 94px;
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 24px;
      padding-block: 25px;
      background: transparent;
    }

    .topbar::before {
      content: "";
      position: absolute;
      inset-block: 0;
      left: 50%;
      z-index: -1;
      width: 100vw;
      transform: translateX(-50%);
      background: rgba(3, 2, 29, 0.22);
      backdrop-filter: blur(12px);
      transition: background-color 550ms ease;
      pointer-events: none;
    }

    .brand {
      position: relative;
      z-index: 1200;
      display: inline-flex;
      align-items: center;
      transition: opacity 220ms ease;
    }

    .brand-logo {
      width: auto;
      height: 32px;
      display: block;
    }

    .nav {
      display: flex;
      align-items: center;
      gap: 6px;
      padding: 6px 12px;
      background: rgba(255, 255, 255, 0.8);
      border-radius: 8px;
      box-shadow: 0 4px 10px rgba(0, 0, 0, 0.05);
    }

    .nav > a {
      padding: 8px 16px;
      border-radius: 5px;
      font-size: 13px;
      font-weight: 600;
      letter-spacing: 0.5px;
      text-transform: uppercase;
      transition: 160ms ease;
    }

    .nav > a:hover,
    .nav > a:focus-visible {
      background: rgba(0, 0, 0, 0.08);
      outline: none;
    }

    .nav > a.active {
      color: #fff;
      background: #111;
    }

    .language-switcher {
      position: relative;
    }

    .mobile-language-switcher { display: none; }

    .language-toggle {
      min-width: 54px;
      padding: 8px 10px;
      border: 0;
      border-radius: 5px;
      color: var(--ink);
      background: transparent;
      font: inherit;
      font-size: 13px;
      font-weight: 700;
      letter-spacing: 0.5px;
      cursor: pointer;
      transition: background 160ms ease;
    }

    .language-toggle:hover,
    .language-toggle:focus-visible,
    .language-switcher.open .language-toggle {
      background: rgba(0, 0, 0, 0.08);
      outline: none;
    }

    .language-options {
      position: absolute;
      top: calc(100% + 10px);
      right: 0;
      z-index: 1250;
      min-width: 112px;
      padding: 6px;
      display: grid;
      gap: 2px;
      border-radius: 6px;
      background: rgba(255, 255, 255, 0.96);
      box-shadow: 0 12px 30px rgba(0, 0, 0, 0.18);
      opacity: 0;
      visibility: hidden;
      transform: translateY(-6px);
      transition: opacity 180ms ease, transform 180ms ease, visibility 180ms;
    }

    .language-switcher.open .language-options {
      opacity: 1;
      visibility: visible;
      transform: translateY(0);
    }

    .language-option {
      padding: 8px 10px;
      border: 0;
      border-radius: 4px;
      color: #111;
      background: transparent;
      font: inherit;
      font-size: 12px;
      font-weight: 700;
      text-align: left;
      cursor: pointer;
    }

    .language-option:hover,
    .language-option:focus-visible,
    .language-option.active {
      color: #fff;
      background: var(--lime);
      outline: none;
    }

    .nav-footer,
    .menu-toggle { display: none; }

    .menu-toggle {
      position: relative;
      z-index: 1200;
      width: 44px;
      height: 37px;
      padding: 8px;
      border: 1px solid transparent;
      border-radius: 4px;
      background: transparent;
      cursor: pointer;
      align-items: center;
      justify-content: center;
      flex-direction: column;
      gap: 6px;
    }

    .menu-toggle span {
      width: 28px;
      height: 2px;
      background: var(--ink);
      transition: transform 400ms cubic-bezier(0.075, 0.82, 0.165, 1),
                  opacity 400ms ease,
                  background 400ms ease;
    }

    .menu-toggle.open {
      border-color: var(--lime);
    }

    .menu-toggle.open span { background: #fff; }
    .menu-toggle.open span:nth-child(1) { transform: translateY(8px) rotate(45deg); }
    .menu-toggle.open span:nth-child(2) { opacity: 0; }
    .menu-toggle.open span:nth-child(3) { transform: translateY(-8px) rotate(-45deg); }

    .hero-copy {
      position: relative;
      z-index: 1;
      flex: 1;
      display: flex;
      align-items: center;
      padding-block: clamp(60px, 10vh, 145px) clamp(80px, 13vh, 170px);
    }

    .hero-slider {
      width: 100%;
      display: grid;
      gap: clamp(28px, 4vw, 54px);
      cursor: grab;
      touch-action: pan-y;
      user-select: none;
    }

    .hero-slider.dragging { cursor: grabbing; }
    .hero-slider .slider-controls { cursor: default; }

    .hero:not(.projects-mode) .hero-slider,
    .hero .brand {
      color: #fff;
    }

    .hero .menu-toggle span {
      background: #fff;
    }

    .hero-slides {
      display: grid;
    }

    .hero-slide {
      grid-area: 1 / 1;
      opacity: 0;
      visibility: hidden;
      transform: translateY(24px);
      transition: opacity 550ms ease, transform 550ms ease, visibility 550ms;
    }

    .hero-slide.active {
      opacity: 1;
      visibility: visible;
      transform: translateY(0);
    }

    .hero.projects-mode {
      background: #1a1b1e;
      animation: none;
    }

    .hero.projects-mode .topbar::before {
      background: #535864;
    }

    .hero.projects-mode .hero-copy {
      width: 100%;
      max-width: none;
      min-height: 72vh;
      padding: 94px 0 0;
    }

    .showcase-slider {
      width: 100%;
      color: #fff;
      background: #1a1b1e;
    }

    .showcase-heading {
      height: 64px;
      margin: 0;
      display: flex;
      align-items: center;
      border-bottom: 1px solid #202020;
      color: #fff;
      background: #111;
      font-size: 14px;
      font-weight: 800;
      letter-spacing: 0.14em;
      text-transform: uppercase;
    }

    .showcase-heading > span {
      width: min(100%, var(--max));
      margin-inline: auto;
      padding-inline: clamp(24px, 4vw, 62px);
    }

    .project-slides {
      height: calc(72vh - 158px);
      display: grid;
    }

    .project-slide {
      --slide-control-bottom: clamp(24px, 4vw, 62px);
      grid-area: 1 / 1;
      min-height: 0;
      display: grid;
      grid-template-columns: 1fr 1fr;
      opacity: 0;
      visibility: hidden;
      transition: opacity 500ms ease, visibility 500ms;
    }

    .project-slide.active {
      opacity: 1;
      visibility: visible;
    }

    .project-media {
      position: relative;
      min-height: 0;
      overflow: hidden;
    }

    .project-media img {
      width: 100%;
      height: 100%;
      display: block;
      object-fit: cover;
    }

    .project-media-gallery {
      position: relative;
      width: 100%;
      height: 100%;
      background: #1a1b1e;
      cursor: grab;
      touch-action: pan-y;
      user-select: none;
      -webkit-user-select: none;
    }

    .project-media-gallery.dragging { cursor: grabbing; }

    .project-media-gallery .gallery-image {
      position: absolute;
      inset: 0;
      opacity: 0;
      visibility: hidden;
      transform: scale(1.015);
      pointer-events: none;
      -webkit-user-drag: none;
      transition: opacity 520ms ease, transform 700ms ease, visibility 520ms;
    }

    .project-media-gallery .gallery-image.active {
      opacity: 1;
      visibility: visible;
      transform: scale(1);
    }

    .media-gallery-controls {
      position: absolute;
      right: 20px;
      bottom: var(--slide-control-bottom);
      z-index: 3;
      display: flex;
      align-items: center;
      gap: 13px;
      color: #fff;
      filter: drop-shadow(0 1px 5px rgba(0, 0, 0, 0.72));
    }

    .media-gallery-arrow {
      width: 28px;
      height: 28px;
      display: grid;
      place-items: center;
      padding: 0;
      border: 0;
      color: #fff;
      background: transparent;
      font-size: 22px;
      cursor: pointer;
      opacity: 0.72;
      transition: opacity 160ms ease, transform 160ms ease;
    }

    .media-gallery-arrow:hover,
    .media-gallery-arrow:focus-visible {
      opacity: 1;
      transform: scale(1.08);
      outline: none;
    }

    .project-content {
      position: relative;
      display: flex;
      flex-direction: column;
      justify-content: center;
      align-items: flex-start;
      padding: clamp(50px, 7vw, 110px) clamp(50px, 7vw, 110px) clamp(112px, 10vw, 150px);
      background: #1a1b1e;
    }

    .project-kicker {
      margin: 0 0 12px;
      color: var(--lime);
      font-size: 12px;
      font-weight: 800;
      letter-spacing: 0.14em;
      text-transform: uppercase;
    }

    .project-title {
      margin: 0;
      font-size: clamp(38px, 4vw, 62px);
      line-height: 0.98;
      letter-spacing: -0.045em;
    }

    .project-subtitle {
      margin: 12px 0 28px;
      color: #a9a9a9;
      font-size: clamp(16px, 1.35vw, 20px);
      font-weight: 700;
    }

    .project-description {
      max-width: 560px;
      margin: 0;
      color: #e5e5e5;
      font-size: clamp(16px, 1.35vw, 20px);
      line-height: 1.45;
    }

    .contact-slider .project-content {
      align-items: stretch;
      padding: 24px max(clamp(24px, 4vw, 62px), calc((100vw - var(--max)) / 2 + 62px)) 24px clamp(36px, 5vw, 80px);
      overflow-y: auto;
    }

    .contact-showcase-title {
      width: 100%;
      max-width: 620px;
      margin: 0 0 7px;
      font-size: clamp(26px, 2.4vw, 38px);
      line-height: 1;
      letter-spacing: -0.035em;
    }

    .contact-showcase-copy {
      max-width: 620px;
      margin: 0 0 18px;
      font-size: clamp(14px, 1.1vw, 17px);
      line-height: 1.35;
    }

    .contact-showcase-form {
      width: 100%;
      max-width: 620px;
      gap: 10px;
    }

    .contact-showcase-form input,
    .contact-showcase-form select {
      min-height: 42px;
    }

    .contact-showcase-form textarea {
      min-height: 76px;
      padding-block: 11px;
    }

    .contact-showcase-form .recaptcha-box { min-height: 62px; }

    .contact-showcase-form .submit-message {
      min-height: 46px;
      color: #fff;
      background: #535864;
    }

    .contact-showcase-form .submit-message:hover,
    .contact-showcase-form .submit-message:focus-visible {
      color: #111;
      background: #fff;
    }

    .project-controls {
      position: absolute;
      right: max(clamp(24px, 4vw, 62px), calc((100vw - var(--max)) / 2 + 62px));
      bottom: var(--slide-control-bottom);
      display: flex;
      align-items: center;
      gap: 12px;
      margin: 0;
    }

    .project-arrow {
      width: 56px;
      height: 56px;
      display: grid;
      place-items: center;
      border: 1px solid #3d3d3d;
      border-radius: 6px;
      color: #fff;
      background: transparent;
      font-size: 24px;
      cursor: pointer;
      transition: color 160ms ease, border-color 160ms ease, background 160ms ease;
    }

    .project-arrow:hover,
    .project-arrow:focus-visible {
      color: #111;
      background: var(--lime);
      border-color: var(--lime);
      outline: none;
    }

    .project-slider .project-arrow {
      width: auto;
      min-width: 112px;
      height: 56px;
      padding-inline: 14px;
      font-size: 13px;
      font-weight: 700;
      letter-spacing: 0.02em;
      white-space: nowrap;
    }

    .slider-controls {
      display: flex;
      align-items: center;
      gap: 10px;
    }

    .slider-dot {
      width: 42px;
      height: 6px;
      padding: 0;
      border: 0;
      border-radius: 999px;
      background: rgba(0, 0, 0, 0.28);
      cursor: pointer;
      transition: background 180ms ease, transform 180ms ease;
    }

    .slider-dot:hover {
      background: rgba(0, 0, 0, 0.55);
      outline: none;
    }

    .slider-dot:focus-visible {
      background: rgba(0, 0, 0, 0.55);
      outline: 2px solid var(--ink);
      outline-offset: 4px;
    }

    .slider-dot.active {
      background: var(--ink);
      transform: scaleX(1.12);
    }

    .hero:not(.projects-mode) .slider-dot {
      background: rgba(255, 255, 255, 0.32);
    }

    .hero:not(.projects-mode) .slider-dot:hover {
      background: rgba(255, 255, 255, 0.68);
      outline: none;
    }

    .hero:not(.projects-mode) .slider-dot:focus-visible {
      background: rgba(255, 255, 255, 0.68);
      outline-color: #fff;
    }

    .hero:not(.projects-mode) .slider-dot.active {
      background: #fff;
    }

    h1 {
      margin: 0;
      max-width: 1130px;
      font-size: clamp(54.4px, 6.97vw, 112.2px);
      line-height: 0.94;
      letter-spacing: -0.065em;
      font-weight: 800;
    }

    .contact {
      flex: 0 0 auto;
      min-height: 0;
      display: flex;
      align-items: center;
      padding: 25px 0 0;
      background: var(--paper);
    }

    .contact-grid {
      display: grid;
      grid-template-columns: minmax(0, 0.8fr) minmax(440px, 1.2fr);
      justify-items: stretch;
      gap: clamp(36px, 7vw, 110px);
      align-items: center;
      text-align: left;
    }

    .contact-copy {
      min-height: 100%;
      display: flex;
      flex-direction: column;
      justify-content: center;
      align-items: flex-start;
      align-self: stretch;
    }

    .contact h2 {
      margin: 0 0 12px;
      font-size: clamp(52px, 5.3vw, 82px);
      line-height: 0.95;
      letter-spacing: -0.045em;
    }

    .contact p {
      max-width: 470px;
      margin: 0;
      font-size: clamp(22px, 2vw, 30px);
      line-height: 1.24;
      font-weight: 700;
      letter-spacing: -0.025em;
    }

    .contact-logo-showcase {
      min-height: 93px;
      display: grid;
      grid-template-columns: repeat(4, minmax(0, 1fr));
      align-items: center;
      align-self: center;
      gap: 10px;
      width: 100%;
    }

    .client-showcase-title {
      grid-column: 1 / -1;
      margin: 0 0 4px;
      color: #535864;
      font-size: clamp(11px, 0.85vw, 13px);
      font-weight: 700;
      letter-spacing: 0.02em;
      line-height: 1.25;
      text-transform: none;
    }

    .logo-reel {
      --logo-duration: 9s;
      --logo-delay: 0s;
      height: 93px;
      overflow: hidden;
      border: 1px solid #e2e2e2;
      border-radius: 7px;
      background: #f8f8f8;
    }

    .logo-track {
      display: flex;
      flex-direction: column;
      animation: logo-rise var(--logo-duration) cubic-bezier(0.65, 0, 0.35, 1) var(--logo-delay) infinite both;
      will-change: transform;
    }

    .logo-reel:nth-child(2) { --logo-duration: 10.6s; --logo-delay: 0.8s; }
    .logo-reel:nth-child(3) { --logo-duration: 8.4s; --logo-delay: 1.6s; }
    .logo-reel:nth-child(4) { --logo-duration: 11.2s; --logo-delay: 2.4s; }

    .logo-mark {
      height: 93px;
      flex: 0 0 93px;
      display: flex;
      align-items: center;
      justify-content: center;
      padding: 12px;
    }

    .logo-mark img {
      width: 100%;
      height: 100%;
      display: block;
      object-fit: contain;
    }

    @keyframes logo-rise {
      0%, 18% { transform: translateY(0); }
      24%, 42% { transform: translateY(-93px); }
      48%, 66% { transform: translateY(-186px); }
      72%, 90% { transform: translateY(-279px); }
      96%, 100% { transform: translateY(-372px); }
    }

    .contact h2,
    .contact p,
    .contact-form select,
    .submit-message {
      text-transform: none;
    }

    .contact-form {
      display: grid;
      gap: 15px;
    }

    .form-row {
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: 15px;
    }

    .contact-form input,
    .contact-form select,
    .contact-form textarea {
      width: 100%;
      border: 1px solid #d8d8d8;
      border-radius: 6px;
      color: var(--ink);
      background: #fff;
      font: inherit;
      font-size: 14px;
      outline: none;
      transition: border-color 160ms ease, box-shadow 160ms ease;
    }

    .contact-form input,
    .contact-form select {
      min-height: 46px;
      padding: 0 15px;
    }

    .select-wrap { position: relative; }

    .select-wrap::after {
      content: "";
      position: absolute;
      top: 50%;
      right: 16px;
      width: 0;
      height: 0;
      border-left: 5px solid transparent;
      border-right: 5px solid transparent;
      border-top: 6px solid #111;
      pointer-events: none;
      transform: translateY(-25%);
    }

    .contact-form select {
      appearance: none;
      padding-right: 42px;
      cursor: pointer;
    }

    .contact-form textarea {
      min-height: 110px;
      padding: 14px 15px;
      resize: vertical;
    }

    .contact-form input:focus,
    .contact-form select:focus,
    .contact-form textarea:focus {
      border-color: #777;
      box-shadow: 0 0 0 3px rgba(0, 0, 0, 0.06);
    }

    .contact-form input::placeholder,
    .contact-form textarea::placeholder {
      color: #666;
      opacity: 1;
      text-transform: none;
    }

    .recaptcha-box {
      min-height: 74px;
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 20px;
      padding: 12px 14px;
      border: 1px solid #d2d2d2;
      border-radius: 2px;
      background: #fafafa;
    }

    .recaptcha-check {
      display: inline-flex;
      align-items: center;
      gap: 12px;
      color: #202020;
      cursor: pointer;
      user-select: none;
    }

    .recaptcha-check input {
      width: 24px;
      min-height: 24px;
      height: 24px;
      margin: 0;
      padding: 0;
      border-radius: 0;
      accent-color: #111;
      cursor: pointer;
    }

    .recaptcha-brand {
      min-width: 72px;
      display: grid;
      justify-items: center;
      color: #555;
      line-height: 1.05;
    }

    .recaptcha-logo {
      width: 30px;
      height: 30px;
      display: block;
      object-fit: contain;
    }

    .recaptcha-brand strong { font-size: 10px; font-weight: 500; }
    .recaptcha-brand small { font-size: 8px; }

    .submit-message {
      min-height: 51px;
      border: 0;
      border-radius: 6px;
      color: #fff;
      background: #111;
      font-size: 14px;
      font-weight: 800;
      cursor: pointer;
      transition: background 160ms ease, color 160ms ease, transform 160ms ease;
    }

    .submit-message:hover {
      color: #111;
      background: #dedede;
      outline: none;
      box-shadow: none;
    }

    .submit-message:focus-visible {
      color: #111;
      background: #dedede;
      outline: 2px solid #111;
      outline-offset: 3px;
    }

    .submit-message:hover:focus-visible {
      outline: none;
      box-shadow: none;
    }

    .submit-message:active { transform: translateY(1px); }

    .contact-slider .contact-showcase-title {
      max-width: none;
      margin: 0;
      color: #fff;
      font-size: clamp(38px, 4vw, 62px);
      font-weight: 800;
      line-height: 0.98;
      letter-spacing: -0.045em;
      text-transform: none;
    }

    .contact-slider .contact-showcase-copy {
      max-width: none;
      margin: 12px 0 28px;
      color: #a9a9a9;
      font-size: clamp(16px, 1.35vw, 20px);
      font-weight: 700;
      line-height: 1.35;
    }

    .contact-slider .contact-showcase-form {
      max-width: none;
      gap: 20px;
    }

    .contact-slider .contact-showcase-form .form-row { gap: 20px; }

    .contact-slider .contact-showcase-form input,
    .contact-slider .contact-showcase-form textarea {
      border: 1px solid rgba(255, 255, 255, 0.2);
      border-radius: 0;
      color: #fff;
      background: rgba(0, 0, 0, 0.12);
      font-size: 14px;
      box-shadow: none;
    }

    .contact-slider .contact-showcase-form input {
      min-height: 44px;
      padding-inline: 20px;
    }

    .contact-slider .contact-showcase-form textarea {
      min-height: 61px;
      padding: 14px 20px;
    }

    .contact-slider .contact-showcase-form input::placeholder,
    .contact-slider .contact-showcase-form textarea::placeholder {
      color: rgba(255, 255, 255, 0.44);
    }

    .contact-slider .contact-showcase-form input:focus,
    .contact-slider .contact-showcase-form textarea:focus {
      border-color: rgba(255, 255, 255, 0.72);
      box-shadow: none;
    }

    .contact-slider .contact-showcase-form .recaptcha-box {
      border-color: rgba(255, 255, 255, 0.2);
      border-radius: 0;
      background: rgba(0, 0, 0, 0.12);
    }

    .contact-slider .contact-showcase-form .recaptcha-check,
    .contact-slider .contact-showcase-form .recaptcha-brand {
      color: rgba(255, 255, 255, 0.62);
    }

    .contact-slider .contact-showcase-form .submit-message {
      border: 1px solid #535864;
      border-radius: 0;
      color: #fff;
      background: #535864;
    }

    .contact-slider .contact-showcase-form .submit-message:hover,
    .contact-slider .contact-showcase-form .submit-message:focus-visible {
      color: #111;
      background: #fff;
      border-color: #fff;
    }

    .contact-showcase-actions {
      width: 100%;
      display: grid;
      grid-template-columns: repeat(2, minmax(0, 1fr));
      gap: 20px;
    }

    .contact-action-button {
      min-height: 76px;
      display: flex;
      align-items: center;
      justify-content: center;
      padding: 18px 24px;
      border: 1px solid #535864;
      border-radius: 5px;
      color: #fff;
      background: #535864;
      font-size: clamp(15px, 1.2vw, 18px);
      font-weight: 800;
      letter-spacing: 0.02em;
      text-align: center;
      cursor: pointer;
      transition: color 180ms ease, background 180ms ease, border-color 180ms ease, transform 180ms ease;
    }

    .contact-action-whatsapp {
      border-color: #25d366;
      color: #fff;
      background: #25d366;
    }

    .contact-action-button:hover,
    .contact-action-button:focus-visible {
      border-color: #fff;
      color: #111;
      background: #fff;
    }

    .contact-action-button:focus-visible {
      outline: 3px solid #fff;
      outline-offset: 3px;
    }

    .contact-action-button:active { transform: translateY(1px); }

    body.contact-form-modal-open { overflow: hidden; }

    .contact-form-modal {
      position: fixed;
      inset: 0;
      z-index: 2000;
      display: grid;
      place-items: center;
      padding: 24px;
      opacity: 0;
      visibility: hidden;
      transition: opacity 200ms ease, visibility 200ms ease;
    }

    .contact-form-modal.open {
      opacity: 1;
      visibility: visible;
    }

    .contact-form-modal-backdrop {
      position: absolute;
      inset: 0;
      width: 100%;
      height: 100%;
      padding: 0;
      border: 0;
      background: rgba(0, 0, 0, 0.9);
      cursor: default;
    }

    .contact-form-modal-card {
      position: relative;
      z-index: 1;
      width: min(720px, 100%);
      max-height: calc(100svh - 48px);
      overflow-y: auto;
      padding: clamp(28px, 5vw, 52px);
      border-radius: 5px;
      color: #111;
      background: #fff;
      box-shadow: 0 28px 80px rgba(0, 0, 0, 0.35);
      transform: translateY(18px) scale(0.985);
      transition: transform 200ms ease;
    }

    .contact-form-modal.open .contact-form-modal-card {
      transform: translateY(0) scale(1);
    }

    .contact-form-modal-card h2 {
      margin: 0;
      font-size: clamp(34px, 5vw, 54px);
      line-height: 1;
      letter-spacing: -0.045em;
    }

    .contact-form-modal-copy {
      margin: 10px 46px 26px 0;
      color: #666;
      font-size: 15px;
      line-height: 1.45;
    }

    .contact-form-modal-close {
      position: absolute;
      top: 18px;
      right: 18px;
      width: 42px;
      height: 42px;
      display: flex;
      align-items: center;
      justify-content: center;
      padding: 0;
      border: 1px solid #d8d8d8;
      border-radius: 50%;
      color: #111;
      background: #fff;
      font-size: 29px;
      line-height: 1;
      cursor: pointer;
    }

    .contact-form-modal-close:hover,
    .contact-form-modal-close:focus-visible {
      color: #fff;
      background: #111;
      border-color: #111;
      outline: none;
    }

    .contact-modal-form { gap: 14px; }
    .contact-modal-form textarea { min-height: 60px; }

    #contact-form-modal .contact-form-modal-backdrop {
      background: rgba(0, 0, 0, 0.9);
    }

    #contact-form-modal .contact-form-modal-card {
      width: min(620px, 100%);
      padding: clamp(38px, 6vw, 66px) clamp(30px, 6vw, 64px) clamp(34px, 5vw, 54px);
      border: 1px solid #242424;
      border-radius: 4px;
      color: #fff;
      background: #1a1b1e;
      box-shadow: 0 28px 90px rgba(0, 0, 0, 0.65);
    }

    #contact-form-modal .contact-form-modal-card h2 {
      margin: 0 48px 8px;
      color: #fff;
      font-size: clamp(22px, 3vw, 31px);
      line-height: 1.1;
      letter-spacing: 0.02em;
      text-align: center;
      text-transform: uppercase;
    }

    #contact-form-modal .contact-form-modal-copy {
      margin: 0 48px 26px;
      color: #9a9a9a;
      font-size: 13px;
      line-height: 1.45;
      text-align: center;
    }

    #contact-form-modal .contact-form-modal-close {
      top: 16px;
      right: 16px;
      width: 36px;
      height: 36px;
      border-color: #3b3b3b;
      color: #a7a7a7;
      background: transparent;
      font-size: 24px;
    }

    #contact-form-modal .contact-form-modal-close:hover,
    #contact-form-modal .contact-form-modal-close:focus-visible {
      border-color: #777;
      color: #fff;
      background: #242424;
    }

    #contact-form-modal .contact-modal-form {
      gap: 21px;
    }

    #contact-form-modal .contact-modal-form input,
    #contact-form-modal .contact-modal-form select,
    #contact-form-modal .contact-modal-form textarea {
      min-height: 44px;
      padding: 10px 0;
      border: 0;
      border-bottom: 1px solid #666;
      border-radius: 0;
      color: #fff;
      background: transparent;
      font-size: 13px;
      box-shadow: none;
    }

    #contact-form-modal .contact-modal-form textarea {
      min-height: 78px;
      resize: vertical;
    }

    #contact-form-modal .contact-modal-form input::placeholder,
    #contact-form-modal .contact-modal-form textarea::placeholder {
      color: #a5a5a5;
    }

    #contact-form-modal .contact-modal-form input:focus,
    #contact-form-modal .contact-modal-form select:focus,
    #contact-form-modal .contact-modal-form textarea:focus {
      border-bottom-color: #fff;
      box-shadow: 0 1px 0 #fff;
    }

    #contact-form-modal .select-wrap::after {
      right: 2px;
      border-top-color: #a5a5a5;
    }

    #contact-form-modal .contact-modal-form select {
      padding-right: 28px;
      color: #a5a5a5;
    }

    #contact-form-modal .contact-modal-form select:valid {
      color: #fff;
    }

    #contact-form-modal .recaptcha-box {
      min-height: 68px;
      border-color: #444;
      color: #d5d5d5;
      background: #151515;
    }

    #contact-form-modal .recaptcha-check,
    #contact-form-modal .recaptcha-brand {
      color: #bcbcbc;
    }

    #contact-form-modal .recaptcha-check input {
      border: 1px solid #777;
      background: #fff;
      accent-color: #535864;
      box-shadow: none;
    }

    #contact-form-modal .submit-message {
      width: min(230px, 100%);
      min-height: 50px;
      justify-self: center;
      margin-top: 8px;
      border: 1px solid #535864;
      border-radius: 4px;
      color: #fff;
      background: #535864;
      box-shadow: 0 8px 22px rgba(0, 0, 0, 0.35);
      font-weight: 700;
    }

    #contact-form-modal .submit-message:hover,
    #contact-form-modal .submit-message:focus-visible {
      border-color: #747a87;
      color: #fff;
      background: #686e7a;
      outline-color: #fff;
    }

    .whatsapp-confirm-card {
      width: min(580px, 100%);
      border: 1px solid #242424;
      color: #fff;
      background: #1a1b1e;
      text-align: center;
    }

    .whatsapp-confirm-card h2 { color: #128c4a; }

    .whatsapp-confirm-card .contact-form-modal-close {
      border-color: #3b3b3b;
      color: #fff;
      background: transparent;
    }

    .whatsapp-confirm-card .contact-form-modal-close:hover,
    .whatsapp-confirm-card .contact-form-modal-close:focus-visible {
      border-color: #777;
      color: #fff;
      background: #242424;
    }

    .whatsapp-confirm-message {
      margin: 24px 24px 8px;
      font-size: clamp(19px, 2.2vw, 25px);
      font-weight: 700;
      line-height: 1.35;
    }

    .whatsapp-confirm-note {
      margin: 0 0 28px;
      color: #b5b5b5;
      font-size: 13px;
      line-height: 1.4;
    }

    .whatsapp-confirm-button {
      min-height: 56px;
      display: flex;
      align-items: center;
      justify-content: center;
      width: 100%;
      padding: 15px 24px;
      border: 1px solid #25d366;
      border-radius: 5px;
      color: #fff;
      background: #25d366;
      font-size: 16px;
      font-weight: 800;
      transition: color 180ms ease, background 180ms ease, border-color 180ms ease, transform 180ms ease;
    }

    .whatsapp-confirm-button:hover,
    .whatsapp-confirm-button:focus-visible {
      border-color: #111;
      color: #fff;
      background: #111;
      outline: none;
    }

    .whatsapp-confirm-button:active { transform: translateY(1px); }

    footer {
      margin-top: auto;
      background: #f2f2f4;
      border-top: 1px solid #ededed;
    }

    .footer-row {
      min-height: 54px;
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 28px;
      font-size: 11px;
      color: #3a3a3a;
    }

    .footer-left {
      display: flex;
      align-items: center;
      flex-wrap: wrap;
      gap: 20px;
    }

    .footer-links {
      display: inline-flex;
      gap: 0;
    }

    .footer-links a {
      padding-inline: 12px;
      border-left: 1px solid #cfcfcf;
    }

    .footer-links a:first-child { border-left: 0; }
    .footer-links a:hover { text-decoration: underline; }

    .footer-right {
      display: flex;
      align-items: center;
      justify-content: flex-end;
      gap: 10px;
    }

    .footer-location { white-space: nowrap; }

    .footer-social-button {
      width: 30px;
      height: 30px;
      flex: 0 0 30px;
      display: grid;
      place-items: center;
      border: 0;
      color: #777;
      background: transparent;
      transition: color 180ms ease;
    }

    .instagram-icon,
    .facebook-icon,
    .whatsapp-icon,
    .mail-icon {
      width: 20px;
      height: 20px;
      display: block;
      background: currentColor;
    }

    .instagram-icon {
      -webkit-mask: url("https://cdn.jsdelivr.net/npm/simple-icons@v16/icons/instagram.svg") center / contain no-repeat;
      mask: url("https://cdn.jsdelivr.net/npm/simple-icons@v16/icons/instagram.svg") center / contain no-repeat;
    }

    .facebook-icon {
      -webkit-mask: url("https://cdn.jsdelivr.net/npm/simple-icons@v16/icons/facebook.svg") center / contain no-repeat;
      mask: url("https://cdn.jsdelivr.net/npm/simple-icons@v16/icons/facebook.svg") center / contain no-repeat;
    }

    .whatsapp-icon {
      -webkit-mask: url("https://cdn.jsdelivr.net/npm/simple-icons@v16/icons/whatsapp.svg") center / contain no-repeat;
      mask: url("https://cdn.jsdelivr.net/npm/simple-icons@v16/icons/whatsapp.svg") center / contain no-repeat;
    }

    .mail-icon {
      -webkit-mask: url("https://cdn.jsdelivr.net/npm/bootstrap-icons@1.13.1/icons/envelope-fill.svg") center / contain no-repeat;
      mask: url("https://cdn.jsdelivr.net/npm/bootstrap-icons@1.13.1/icons/envelope-fill.svg") center / contain no-repeat;
    }

    .footer-social-button:hover,
    .footer-social-button:focus-visible {
      color: #aaa;
      background: transparent;
      outline: none;
    }

    .footer-social-button:focus-visible {
      outline: 2px solid #aaa;
      outline-offset: 3px;
    }

    @media (min-width: 901px) {
      .hero { min-height: var(--desktop-hero-height); }

      .hero.projects-mode .hero-copy {
        min-height: var(--desktop-hero-height);
      }

      .project-slides {
        height: calc(var(--desktop-hero-height) - 158px);
      }

      .hero:not(.projects-mode) .hero-copy {
        padding-block: 94px;
      }

      .hero:not(.projects-mode) .hero-slider {
        position: relative;
        gap: 0;
      }

      .hero:not(.projects-mode) .slider-controls {
        position: absolute;
        top: calc(100% + clamp(28px, 4vw, 54px));
        left: 0;
      }
    }

    @media (max-width: 900px) {
      .hero { min-height: 72vh; }
      .hero.projects-mode .hero-copy { min-height: 72vh; }
      .project-slides { height: calc(72vh - 158px); }
      .contact-grid { grid-template-columns: 1fr; gap: 22px; }
      .footer-row {
        min-height: 0;
        flex-direction: column;
        justify-content: center;
        gap: 10px;
        padding-block: 18px;
        text-align: center;
      }
      .footer-left {
        flex-direction: column;
        flex-wrap: nowrap;
        justify-content: center;
        gap: 10px;
      }
      .footer-left > span,
      .footer-location { text-align: center; }
      .footer-links {
        justify-content: center;
        white-space: nowrap;
      }
      .footer-right {
        display: grid;
        grid-template-columns: repeat(4, 30px);
        justify-content: center;
        gap: 8px;
      }
      .footer-location { grid-column: 1 / -1; }
    }

    @media (min-width: 621px) and (max-width: 900px) {
      .contact-logo-showcase {
        width: calc(100% - 40px);
        margin: 20px;
      }
    }

    @media (max-width: 760px) {
      body.menu-open .brand { opacity: 0; pointer-events: none; }

      .topbar {
        min-height: 77px;
        padding-block: 20px;
        gap: 8px;
      }

      .menu-toggle { display: flex; }

      .nav {
        position: fixed;
        inset: 0;
        z-index: 1100;
        width: auto;
        height: 100vh;
        height: 100dvh;
        padding: 100px 24px 60px;
        display: flex;
        flex-direction: column;
        justify-content: center;
        gap: 18px;
        background: #111;
        border-radius: 0;
        box-shadow: none;
        opacity: 0;
        visibility: hidden;
        pointer-events: none;
        transition: opacity 500ms cubic-bezier(0.77, 0, 0.175, 1),
                    visibility 500ms cubic-bezier(0.77, 0, 0.175, 1);
      }

      .nav.open {
        opacity: 1;
        visibility: visible;
        pointer-events: auto;
      }

      .nav > a {
        flex: none;
        padding: 0;
        color: #fff;
        background: transparent;
        border-radius: 0;
        font-size: 28px;
        font-weight: 700;
        line-height: 1.2;
        text-align: center;
        opacity: 0;
        transform: translateY(30px);
        transition: opacity 500ms cubic-bezier(0.25, 0.46, 0.45, 0.94),
                    transform 500ms cubic-bezier(0.25, 0.46, 0.45, 0.94),
                    color 160ms ease;
      }

      .nav.open > a {
        opacity: 1;
        transform: translateY(0);
      }

      .nav.open > a:nth-child(1) { transition-delay: 150ms; }
      .nav.open > a:nth-child(2) { transition-delay: 250ms; }
      .nav.open > a:nth-child(3) { transition-delay: 350ms; }
      .nav.open > a:nth-child(4) { transition-delay: 450ms; }
      .nav.open > a:nth-child(5) { transition-delay: 550ms; }

      .desktop-language-switcher { display: none; }

      .language-switcher {
        margin-top: 4px;
        opacity: 0;
        transform: translateY(30px);
        transition: opacity 500ms cubic-bezier(0.25, 0.46, 0.45, 0.94) 520ms,
                    transform 500ms cubic-bezier(0.25, 0.46, 0.45, 0.94) 520ms;
      }

      .nav.open .language-switcher {
        opacity: 1;
        transform: translateY(0);
      }

      .language-toggle {
        min-width: 72px;
        color: #fff;
        font-size: 17px;
      }

      .language-toggle:hover,
      .language-toggle:focus-visible,
      .language-switcher.open .language-toggle {
        color: var(--lime);
        background: transparent;
      }

      .language-options {
        top: calc(100% + 6px);
        right: 50%;
        transform: translate(50%, -6px);
      }

      .language-switcher.open .language-options {
        transform: translate(50%, 0);
      }

      .mobile-language-switcher {
        z-index: 1200;
        display: block;
        margin: 0 2px 0 auto;
        opacity: 1;
        transform: none;
        transition: none;
      }

      .mobile-language-switcher .language-toggle {
        min-width: 54px;
        padding-inline: 8px;
      }

      .mobile-language-switcher .language-options {
        top: calc(100% + 8px);
        right: 0;
        transform: translateY(-6px);
      }

      .mobile-language-switcher.open .language-options {
        transform: translateY(0);
      }

      .nav > a:hover,
      .nav > a:focus-visible,
      .nav > a.active {
        color: var(--lime);
        background: transparent;
      }

      .nav > a:focus-visible {
        outline: 2px solid var(--lime);
        outline-offset: 5px;
      }

      .nav-footer {
        display: grid;
        gap: 4px;
        margin-top: 28px;
        color: #777;
        font-size: 12px;
        line-height: 1.35;
        text-align: center;
        opacity: 0;
        transform: translateY(20px);
        transition: opacity 500ms cubic-bezier(0.25, 0.46, 0.45, 0.94) 450ms,
                    transform 500ms cubic-bezier(0.25, 0.46, 0.45, 0.94) 450ms;
      }

      .nav.open .nav-footer {
        opacity: 1;
        transform: translateY(0);
      }

      .nav-footer p { margin: 0; }
      .nav-footer a { color: #999; font-weight: 700; }

      .hero:not(.projects-mode) .hero-copy {
        align-items: center;
        padding-block: 77px 0;
      }

      .hero.projects-mode {
        min-height: 0;
      }

      .hero.projects-mode .hero-copy {
        min-height: 0;
        padding-top: 77px;
      }

      .project-slides {
        height: auto;
      }

      .showcase-heading {
        height: 52px;
        font-size: 12px;
      }

      .showcase-heading > span { padding-inline: 20px; }

      .about-slider,
      .service-slider {
        touch-action: pan-y;
      }

      .project-slide {
        --slide-control-bottom: 18px;
        grid-template-columns: 1fr;
        grid-template-rows: auto auto;
      }

      .project-media {
        height: clamp(260px, 52svh, 440px);
      }

      .project-content {
        min-height: 0;
        justify-content: flex-start;
        overflow: visible;
        padding: 40px 20px;
      }

      .project-controls {
        position: static;
        align-self: flex-end;
        margin-top: 28px;
      }

      .contact-slider .project-slide { grid-template-rows: auto auto; }

      .contact-slider .project-content {
        justify-content: flex-start;
        padding: 40px 20px;
        overflow: visible;
      }

      .contact-slider .contact-showcase-title {
        font-size: clamp(30px, 9vw, 42px);
      }

      .contact-slider .contact-showcase-copy {
        margin: 5px 0 8px;
        font-size: 14px;
      }

      .contact-showcase-actions { gap: 10px; }
      .contact-action-button { min-height: 60px; padding: 14px 16px; }

      .contact-slider .contact-showcase-form { gap: 6px; }
      .contact-slider .contact-showcase-form .form-row { gap: 6px; }
      .contact-slider .contact-showcase-form input { min-height: 38px; }
      .contact-slider .contact-showcase-form textarea { min-height: 62px; }
      .contact-slider .contact-showcase-form .recaptcha-box { min-height: 56px; }
      .contact-slider .contact-showcase-form .submit-message { min-height: 42px; }

      .project-kicker { margin-bottom: 6px; font-size: 10px; }
      .project-title { font-size: clamp(30px, 9vw, 42px); }
      .project-subtitle { margin: 7px 0 11px; font-size: 14px; }
      .project-description {
        display: block;
        overflow: visible;
        font-size: 14px;
        line-height: 1.35;
        -webkit-line-clamp: unset;
      }
      .project-controls { right: 20px; }
      .project-arrow { width: 40px; height: 40px; font-size: 19px; }
      .project-slider .project-arrow {
        width: auto;
        min-width: 0;
        height: 40px;
        padding-inline: 9px;
        font-size: 11px;
      }
      .media-gallery-controls { right: 20px; }
      .media-gallery-arrow { width: 30px; height: 30px; }
    }

    @media (max-width: 620px) {
      .shell { padding-inline: 20px; }
      h1 { font-size: clamp(44.2px, 13.6vw, 69.7px); line-height: 0.96; }
      .contact { padding: 25px 0 20px; }
      .contact h2 { font-size: 54px; }
      .contact-logo-showcase { gap: 6px; }
      .logo-mark {
        padding: 7px;
      }
      .footer-row {
        min-height: 0;
        flex-direction: column;
        justify-content: center;
        gap: 10px;
        padding-block: 18px;
        text-align: center;
      }
      .footer-left {
        flex-direction: column;
        flex-wrap: nowrap;
        justify-content: center;
        gap: 10px;
      }
      .footer-left > span,
      .footer-location { text-align: center; }
      .footer-links {
        justify-content: center;
        white-space: nowrap;
      }
      .footer-links a { padding-inline: 8px; }
      .footer-right {
        display: grid;
        grid-template-columns: repeat(4, 30px);
        justify-content: center;
        gap: 8px;
      }
      .footer-location { grid-column: 1 / -1; }
      .form-row { grid-template-columns: 1fr; }
      .contact-showcase-form .form-row {
        grid-template-columns: 1fr 1fr;
        gap: 8px;
      }
      .contact-showcase-actions { grid-template-columns: 1fr; }
      .contact-form-modal { padding: 12px; }
      .contact-form-modal-card {
        max-height: calc(100svh - 24px);
        padding: 30px 20px 22px;
      }
      .contact-form-modal-close { top: 12px; right: 12px; }
      .contact-form-modal-copy { margin-right: 42px; }
      .contact-modal-form .form-row { grid-template-columns: 1fr; }
      .whatsapp-confirm-card { padding-top: 54px; }
      .whatsapp-confirm-message { margin-inline: 0; }
      .recaptcha-box { gap: 10px; padding-inline: 12px; }
    }

    @media (prefers-reduced-motion: reduce) {
      .hero { animation: none; }
      .logo-track { animation: none; }
      .page-loader { transition: none; }
      .page-loader-logo,
      .page-loader-progress::after { animation: none; }
      .hero.mode-transitioning .hero-copy { animation: none; }
      .hero.mode-transitioning::after { animation: none; }
      .contact-form-modal,
      .contact-form-modal-card { transition: none; }
      .topbar::before,
      .hero-slide,
      .project-slide,
      .project-media-gallery .gallery-image,
      .nav,
      .nav > a,
      .nav-footer,
      .menu-toggle span { transition: none; }
    }
