*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:90px}body{margin:0;background:#fafafa;color:#181818;font-family:Arial,Helvetica,sans-serif;font-size:15px;-webkit-font-smoothing:antialiased}a{color:inherit;text-decoration:none}button,input,textarea{font:inherit}button,a,summary{-webkit-tap-highlight-color:transparent}button,summary{cursor:pointer}h1,h2,h3,h4,p{margin:0}h1,h2,h3{font-weight:400;letter-spacing:-.035em}h2{font-size:40px;line-height:1.12}p{line-height:1.5}section[id]{scroll-margin-top:70px}.header{position:fixed;z-index:30;top:0;width:100%;height:72px;display:flex;align-items:center;justify-content:space-between;padding:0 24px;color:white;transition:background .25s,color .25s}.header.scrolled,.header.menu-open{background:#fafafa;color:#181818}.header nav,.header-right{display:flex;align-items:center;gap:28px;font-size:13px}.header>.brand{position:absolute;left:50%;transform:translateX(-50%)}.brand{display:flex;align-items:center;gap:9px;font-family:Montserrat,sans-serif;font-size:16px;font-weight:800;white-space:nowrap;letter-spacing:-.6px}.logo-symbol{position:relative;width:32px;height:32px;overflow:hidden;display:block}.logo-symbol img{position:absolute;width:144px;max-width:none;left:-8px;top:-25.5px}.header:not(.scrolled):not(.menu-open) .logo-symbol{filter:invert(1)}.button{display:inline-flex;align-items:center;justify-content:center;gap:14px;background:#434343;color:white;border:0;border-radius:40px;padding:7px 7px 7px 16px;font-size:13px;white-space:nowrap;line-height:1.4}.button span{display:grid;place-items:center;border-radius:50%;background:#fff;color:#434343;width:23px;height:23px}.button:hover{background:#5c5c5c}.menu{display:none}.center-heading{text-align:center;padding:90px 24px 58px}.center-heading p{margin-top:15px;color:#6f6f6f;font-size:18px}.layer-stage{height:720px;position:relative;background:#eee;overflow:hidden}.stage-caption{position:absolute;bottom:24px;left:24px;background:#7b7b7ba6;color:white;border-radius:40px;padding:9px 15px;font-size:12px}.section{padding:110px 24px}.split-heading{display:flex;justify-content:space-between;gap:40px;margin-bottom:40px}.split-heading p{max-width:420px;color:#6e6e6e}.cards{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}.card-art{height:250px;background:#e5e5e5;display:flex;align-items:center;justify-content:center;overflow:hidden}.art-02{background:#dadada}.art-03{background:#d8d8d8}.art-04{background:#e2e2e2}.glass-panel{width:75%;padding:20px;background:#ffffffad;box-shadow:0 15px 40px #36363620;transform:perspective(600px) rotateY(-12deg) rotateX(8deg);border:1px solid white;border-radius:7px}.glass-panel>span{font-size:8px;letter-spacing:1px}.glass-panel strong{display:block;font-weight:400;font-size:19px;margin:20px 0}.mock-line{height:5px;background:#c4c4c4;margin:9px 0;width:90%}.mock-line.short{width:60%}.card h3{font-size:22px;margin:23px 0 9px}.card p{font-size:14px;color:#6e6e6e}.read{display:block;margin-top:24px;font-size:13px}.solutions{padding-top:0}.tabs{display:flex;justify-content:center;gap:8px;border-bottom:1px solid #dedede;padding-bottom:24px}.tabs button{border:0;background:transparent;padding:10px 20px;border-radius:25px;color:#666666}.tabs button[aria-selected=true]{background:#e6e6e6;color:#222}.solution-panel{display:grid;grid-template-columns:1fr 1.15fr;min-height:470px;background:#ededed;margin-top:28px}.solution-panel>div:first-child{padding:70px 60px}.eyebrow{font-size:11px;letter-spacing:1.4px}.solution-panel h3{font-size:32px;margin:28px 0 18px}.solution-panel p{max-width:370px;color:#666666;margin-bottom:26px}.solution-art{display:grid;place-items:center;background:radial-gradient(ellipse at center,#e0e0e0,#c7c7c7);padding:40px}.conversation{width:85%;background:#fafafa;padding:30px;border-radius:10px;box-shadow:0 25px 60px #30303024}.conversation>span{font-size:10px;letter-spacing:2px}.conversation h4{font-weight:400;font-size:24px;margin:38px 0}.conversation p{font-size:13px;background:#ededed;border-radius:15px;padding:15px;margin-left:20%}.conversation>div{font-size:12px;border:1px solid #ddd;padding:15px;border-radius:6px;display:flex;justify-content:space-between}.approach{padding-top:25px;display:grid;grid-template-columns:1fr 1fr;gap:60px}.feature{background:linear-gradient(140deg,#383838,#707070);color:white;min-height:440px;padding:40px;display:flex;align-items:flex-start;flex-direction:column;justify-content:space-between}.feature h2{font-size:44px}.feature-copy{padding:35px 10px}.feature-copy h3{font-size:28px;max-width:450px}.feature-copy>p{color:#6e6e6e;margin-top:22px;max-width:480px}.three{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;margin-top:65px}.three strong{font-size:42px;font-weight:400}.three h4{font-weight:400;margin:15px 0 8px}.three p{font-size:12px;color:#757575}.vision{display:grid;grid-template-columns:1fr 1fr;border-top:1px solid #dedede}.vision>div{max-width:560px}.vision p{color:#676767;margin-bottom:24px}.vision .large{font-size:38px;color:#262626;line-height:1.2;letter-spacing:-1px;margin-bottom:35px}.faq{display:grid;grid-template-columns:1fr 1fr;gap:70px;border-top:1px solid #dedede}.faq details{border-bottom:1px solid #dedede;padding:23px 0}.faq summary{display:flex;justify-content:space-between;gap:20px;list-style:none;font-size:17px}.faq details p{color:#6f6f6f;margin-top:20px;max-width:480px}.contact{background:#ebebeb;display:grid;grid-template-columns:1fr 1fr;gap:70px}.contact>div>p{margin-top:23px;color:#6e6e6e}form label{display:block;font-size:12px;margin-bottom:20px}input,textarea{display:block;width:100%;border:0;border-bottom:1px solid #b2b2b2;background:transparent;padding:13px 0;color:#222;outline-offset:4px}textarea{resize:vertical}.form-row{display:grid;grid-template-columns:1fr 1fr;gap:25px}.form-note{font-size:11px;color:#6d6d6d;margin-top:14px}.review{margin-top:24px;background:#fff;padding:25px}.review p,.review dl{font-size:13px}.review dd{margin:5px 0 18px;overflow-wrap:anywhere}.review dt{font-weight:bold}.skip{position:fixed;top:-100px;z-index:100;background:white;padding:15px}.skip:focus{top:0}:focus-visible{outline:2px solid #757575;outline-offset:5px}summary::-webkit-details-marker{display:none}
@media(min-width:1500px){.section{padding-left:max(24px,calc((100vw - 1440px)/2));padding-right:max(24px,calc((100vw - 1440px)/2))}}@media(max-width:1100px){.header nav{gap:15px}.brand{font-size:14px}.header nav a{font-size:12px}.solution-panel>div:first-child{padding:45px 30px}.card-art{height:210px}.layer-stage{height:620px}}@media(max-width:760px){.header{height:66px;padding:0 18px}.header>.brand{position:static;transform:none}.header-right{display:none}.menu{display:block;border:0;background:transparent;color:inherit;font-size:13px}.header nav{display:none;position:absolute;top:66px;left:0;width:100%;background:#fafafa;color:#222;padding:25px;flex-direction:column;align-items:flex-start;gap:25px}.header nav a{font-size:17px}.header.menu-open nav{display:flex}.center-heading{padding:70px 20px 40px}h2{font-size:33px}.center-heading p{font-size:16px}.layer-stage{height:680px}.stage-caption{font-size:10px;bottom:16px;left:20px}.section{padding:65px 20px}.split-heading{display:block}.split-heading p{margin-top:20px}.cards{grid-template-columns:1fr 1fr;gap:35px 12px}.card-art{height:180px}.glass-panel{padding:12px;width:82%}.glass-panel strong{font-size:15px}.card h3{font-size:19px;margin-top:16px}.card p{font-size:12px}.read{margin-top:15px;font-size:12px}.solutions{padding-top:0}.tabs{justify-content:flex-start;overflow:auto;white-space:nowrap}.tabs button{font-size:12px;padding:10px 14px}.solution-panel{grid-template-columns:1fr}.solution-panel>div:first-child{padding:35px 25px}.solution-panel h3{font-size:29px}.solution-art{min-height:320px;padding:30px 15px}.approach,.vision,.faq,.contact{grid-template-columns:1fr;gap:35px}.feature{min-height:360px;padding:30px}.feature h2{font-size:39px}.feature-copy{padding:0}.three{margin-top:38px}.vision .large{font-size:32px}.faq h2{font-size:30px}.form-row{grid-template-columns:1fr;gap:0}.brand{font-size:14px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.hero video{display:none}.header{transition:none}}

/* Beaver AI glass studio */
.hero {
  position: relative;
  isolation: isolate;
  display: grid;
  align-items: end;
  min-height: max(620px, 100svh);
  padding: 120px 24px clamp(56px, 10svh, 112px);
  overflow: hidden;
  background: radial-gradient(ellipse at 54% 20%, #45474b 0%, #24262a 43%, #111 80%);
  color: #fff;
}

.hero-studio,
.hero-shade {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
}

.hero-studio {
  display: grid;
  place-items: center;
  padding-bottom: 19svh;
  perspective: 1100px;
  pointer-events: none;
}

.hero-studio-grid {
  position: absolute;
  top: 13%;
  left: -35%;
  width: 170%;
  height: 124%;
  background:
    linear-gradient(90deg, #fff2 1px, transparent 1px) 0 0 / 109px 109px,
    linear-gradient(#fff2 1px, transparent 1px) 0 0 / 109px 109px;
  mask-image: radial-gradient(ellipse at center, #000 8%, #0008 48%, transparent 73%);
  transform: rotateX(55deg) rotateZ(-32deg);
}

.hero-studio-stack {
  display: grid;
  width: clamp(180px, 31vw, 420px);
  aspect-ratio: 1;
  transform-style: preserve-3d;
  transform: rotateX(48deg) rotateZ(-30deg);
}

.hero-studio-pane {
  display: grid;
  place-items: center;
  grid-area: 1 / 1;
  border: 1px solid #ffffff8c;
  border-radius: 17%;
  background:
    linear-gradient(120deg, #ffffff30, transparent 29%, #ffffff03 53%, #ffffff30),
    linear-gradient(140deg, #f0f1f2a6, #bbc0ca58 52%, #e7ecf4a6);
  box-shadow: inset 0 2px 1px #fffe, inset 0 -6px 14px #fff6, 0 10px 45px #0004;
}

.hero-studio-pane:nth-child(2) { transform: translateZ(21px); }
.hero-studio-pane:nth-child(3) { transform: translateZ(42px); }
.hero-studio-pane:nth-child(4) {
  transform: translateZ(70px);
  background:
    linear-gradient(122deg, transparent 24%, #fff6 38%, transparent 61%),
    linear-gradient(155deg, #eef0f3e0, #c0c3cbb7 54%, #f8f9fae0);
}

.hero-studio-pane .logo-symbol {
  transform: rotate(30deg) scale(2.7);
}

@media (prefers-reduced-motion: no-preference) {
  .hero-studio-stack { animation: hero-studio-float 9s ease-in-out infinite; }
  .hero-studio-pane:nth-child(4) { animation: hero-studio-seal 9s ease-in-out infinite; }
}

@keyframes hero-studio-float {
  0%, 100% { transform: translateY(0) rotateX(48deg) rotateZ(-30deg); }
  50% { transform: translateY(-19px) rotateX(54deg) rotateZ(-23deg); }
}

@keyframes hero-studio-seal {
  0%, 100% { transform: translateZ(70px); }
  50% { transform: translateZ(114px); }
}

.hero-shade {
  background:
    radial-gradient(ellipse at 50% 76%, #0005, transparent 68%),
    linear-gradient(180deg, #0003, transparent 24%, #0006 43%, #0009 60%, #000b 78%, #000e);
  pointer-events: none;
}

.hero-content {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1fr) max-content;
  align-items: center;
  gap: clamp(20px, 4vw, 56px);
  width: min(100%, 1120px);
  margin-inline: auto;
}

.hero h1 {
  font-size: clamp(2rem, 4.6vw, 4rem);
  line-height: 1.05;
  letter-spacing: -.05em;
  text-wrap: balance;
  text-shadow: 0 3px 30px #0003;
}

.hero-description {
  max-width: 52ch;
  margin-top: 10px;
  color: #f2f2f2;
  font-size: clamp(15px, 1.35vw, 18px);
  line-height: 1.45;
  text-wrap: balance;
}

.hero-cta {
  position: relative;
  isolation: isolate;
  display: inline-flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  overflow: hidden;
  min-height: 62px;
  padding: 7px 8px 7px 24px;
  border: 1px solid #fff;
  border-radius: 999px;
  background: linear-gradient(165deg, #fff 42%, #e2e2e2);
  color: #141414;
  font-size: 16px;
  font-weight: 700;
  line-height: 1.2;
  box-shadow: inset 0 1px 1px #fff, 0 0 0 5px #fff3, 0 12px 28px #0006;
}

.hero-cta-icon {
  display: grid;
  flex: none;
  place-items: center;
  width: 44px;
  height: 44px;
  border: 1px solid #202020;
  border-radius: 50%;
  background: linear-gradient(145deg, #3b3b3b, #111 70%);
  color: #fff;
  box-shadow: inset 0 1px 1px #fff4;
}

.hero-cta-icon svg {
  width: 20px;
  height: 20px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.55;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.hero-cta:focus-visible {
  outline: 2px solid #fff;
  outline-offset: 8px;
}

@media (hover: hover) {
  .hero-cta:hover {
    box-shadow: inset 0 1px 1px #fff, 0 0 0 6px #fff5, 0 14px 32px #0007;
  }
}

@media (prefers-reduced-motion: no-preference) {
  .hero-copy > *,
  .hero-cta {
    animation: hero-rise .62s cubic-bezier(.2, .7, .25, 1) both;
  }

  .hero-description { animation-delay: .07s; }

  .hero-cta {
    --hero-action-ease: cubic-bezier(.2, .8, .3, 1);
    animation-delay: .14s;
    transition: translate .25s var(--hero-action-ease), scale .22s var(--hero-action-ease),
      box-shadow .25s ease;
  }

  .hero-cta::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: -1;
    background: linear-gradient(115deg, transparent 32%, #fff 49%, transparent 66%);
    transform: translateX(-115%);
    transition: transform .55s var(--hero-action-ease);
    pointer-events: none;
  }

  .hero-cta-icon,
  .hero-cta-icon svg {
    transition: transform .3s var(--hero-action-ease);
  }

  .hero-cta:focus-visible::before { transform: translateX(115%); }
  .hero-cta:focus-visible svg { transform: translate(2px, -2px); }

  @media (hover: hover) {
    .hero-cta:hover { translate: 0 -3px; }
    .hero-cta:hover::before { transform: translateX(115%); }
    .hero-cta:hover .hero-cta-icon { transform: scale(1.07); }
    .hero-cta:hover svg { transform: translate(2px, -2px); }
  }

  .hero-cta:active { scale: .98; translate: 0; }
}

@keyframes hero-rise {
  from { opacity: 0; transform: translateY(12px); }
  to { opacity: 1; transform: translateY(0); }
}

@media (max-width: 760px) {
  .hero {
    min-height: max(560px, 100svh);
    padding-inline: 20px;
  }
}

@media (max-width: 600px) {
  .hero-content {
    grid-template-columns: minmax(0, 1fr);
    justify-items: start;
  }
}

/* Floating liquid-glass navigation. */
.header{
  top:14px;left:16px;width:calc(100% - 32px);height:64px;
  padding:0 22px;border-radius:36px;
  background:linear-gradient(125deg,rgba(255,255,255,.24),rgba(255,255,255,.07) 45%,rgba(255,255,255,.15));
  border:1px solid rgba(255,255,255,.38);
  -webkit-backdrop-filter:blur(24px) saturate(160%);
  backdrop-filter:blur(24px) saturate(160%);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.55),inset 0 -1px 0 rgba(255,255,255,.12),0 8px 32px rgba(0,0,0,.12);
  transition:background .3s,color .3s,box-shadow .3s;
}
.header.scrolled,.header.menu-open{
  background:linear-gradient(125deg,rgba(255,255,255,.84),rgba(255,255,255,.59) 55%,rgba(255,255,255,.76));
  border-color:rgba(255,255,255,.8);
  box-shadow:inset 0 1px 0 #fff,inset 0 -1px 0 rgba(255,255,255,.5),0 6px 28px rgba(32,32,32,.09);
}
.header nav a:not(.button),.header-right>a:not(.button){transition:opacity .2s}
.header nav a:hover,.header-right>a:not(.button):hover{opacity:.65}
@supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){
  .header{background:rgba(45,45,45,.92)}
  .header.scrolled,.header.menu-open{background:rgba(250,250,250,.97)}
}
@media(max-width:760px){
  .header{top:10px;left:10px;width:calc(100% - 20px);height:58px;padding:0 16px;border-radius:30px}
  .header .brand{font-size:13px;gap:7px}
  .header nav{top:66px;left:-1px;width:calc(100% + 2px);padding:26px;border-radius:26px;
    background:rgba(250,250,250,.95);border:1px solid rgba(255,255,255,.85);
    -webkit-backdrop-filter:blur(28px) saturate(160%);backdrop-filter:blur(28px) saturate(160%);
    box-shadow:inset 0 1px 0 #fff,0 12px 32px rgba(0,0,0,.12)}
}
@media(prefers-reduced-transparency:reduce){.header{background:#3e3e3e}.header.scrolled,.header.menu-open,.header nav{background:#fafafa}}
@media(prefers-reduced-motion:reduce){.header,.header nav a,.header-right>a{transition:none}}

/* Sculpted glass: clear centre, refractive rim and specular highlights. */
.header{
  isolation:isolate;
  background:linear-gradient(115deg,rgba(255,255,255,.3),rgba(255,255,255,.055) 26%,rgba(255,255,255,.035) 65%,rgba(255,255,255,.21));
  border:1px solid rgba(255,255,255,.57);
  -webkit-backdrop-filter:blur(18px) saturate(190%) contrast(108%);
  backdrop-filter:blur(18px) saturate(190%) contrast(108%);
  box-shadow:inset 0 2px 2px rgba(255,255,255,.75),inset 2px 0 3px rgba(255,255,255,.25),inset -2px 0 3px rgba(255,255,255,.28),inset 0 -2px 2px rgba(255,255,255,.38),inset 0 -7px 14px rgba(255,255,255,.09),0 12px 32px rgba(0,0,0,.16),0 2px 5px rgba(0,0,0,.08);
}
.header::before,.header::after{content:"";position:absolute;pointer-events:none;border-radius:inherit;z-index:-1}
.header::before{
  inset:0;
  background:linear-gradient(165deg,rgba(255,255,255,.38),transparent 19%,transparent 75%,rgba(255,255,255,.17)),linear-gradient(105deg,transparent 24%,rgba(255,255,255,.13) 29%,transparent 36%,transparent 70%,rgba(255,255,255,.09) 79%,transparent 86%);
}
.header::after{
  inset:3px;border:1px solid transparent;
  border-top-color:rgba(255,255,255,.22);border-bottom-color:rgba(255,255,255,.18);
  box-shadow:inset 0 1px 7px rgba(255,255,255,.1);
}
.header.scrolled,.header.menu-open{
  background:linear-gradient(115deg,rgba(255,255,255,.8),rgba(255,255,255,.44) 35%,rgba(255,255,255,.52) 70%,rgba(255,255,255,.76));
  border-color:rgba(255,255,255,.9);
  box-shadow:inset 0 2px 2px #fff,inset 2px 0 3px rgba(255,255,255,.65),inset -2px 0 3px rgba(255,255,255,.65),inset 0 -2px 3px rgba(255,255,255,.8),0 10px 32px rgba(32,32,32,.12),0 1px 3px rgba(32,32,32,.06);
}
.header .button{background:linear-gradient(145deg,rgba(86,86,86,.94),rgba(55,55,55,.94));border:1px solid rgba(255,255,255,.3);box-shadow:inset 0 1px 1px rgba(255,255,255,.25),0 2px 7px rgba(0,0,0,.12)}
.header:not(.scrolled):not(.menu-open) nav a,.header:not(.scrolled):not(.menu-open) .brand,.header:not(.scrolled):not(.menu-open) .header-right>a:not(.button){text-shadow:0 1px 5px rgba(0,0,0,.28)}
@supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){.header{background:#3e3e3e}.header.scrolled,.header.menu-open{background:#fafafa}}
@media(prefers-reduced-transparency:reduce){.header{background:#3e3e3e}.header.scrolled,.header.menu-open{background:#fafafa}.header::before,.header::after{display:none}}

.ada-content { background: #fff; color: #191919; }

.ada-section {
  max-width: 1440px;
  margin-inline: auto;
  padding-inline: 48px;
}

.site-footer {
  background: #fff;
  padding: 0 max(48px, calc((100vw - 1344px) / 2)) 24px;
  scroll-margin-top: 0;
}

.footer-invite {
  position: relative;
  isolation: isolate;
  display: grid;
  grid-template-columns: minmax(0, 1.35fr) minmax(260px, 1fr);
  min-height: 330px;
  overflow: hidden;
  border: 1px solid #d6d8db;
  border-radius: 29px;
  background:
    radial-gradient(ellipse at 73% 5%, #fff 0, transparent 50%),
    linear-gradient(150deg, #fff 8%, #f4f5f6 55%, #e6e8eb);
  color: #191919;
  box-shadow: inset 0 0 0 1px #fff, inset 0 -4px 13px #414f6810,
    0 16px 34px -23px #20293855;
}

.footer-invite-copy {
  position: relative;
  z-index: 1;
  align-self: center;
  padding: clamp(28px, 4.6vw, 65px);
}

.footer-invite h2 {
  max-width: 16ch;
  font-size: clamp(35px, 4.6vw, 64px);
  line-height: 1.02;
  letter-spacing: -.055em;
  text-wrap: balance;
}

.footer-description {
  max-width: 43ch;
  margin-top: 15px;
  color: #484b50;
  font-size: clamp(14px, 1.4vw, 17px);
  line-height: 1.55;
}

.footer-action {
  display: inline-flex;
  align-items: center;
  justify-content: space-between;
  gap: 15px;
  min-height: 52px;
  max-width: 100%;
  margin-top: 25px;
  padding: 6px 7px 6px 17px;
  border: 1px solid #c5c9ce;
  border-radius: 999px;
  background: linear-gradient(160deg, #fff 35%, #e7e7e7);
  color: #181818;
  font-size: 14px;
  font-weight: 700;
  box-shadow: inset 0 1px 1px #fff, 0 0 0 3px #fff9, 0 5px 12px #26324320;
}

.footer-action-icon {
  display: grid;
  flex: none;
  place-items: center;
  width: 36px;
  height: 36px;
  border: 1px solid #222;
  border-radius: 50%;
  background: linear-gradient(145deg, #3a3a3a, #111 72%);
  color: #fff;
  box-shadow: inset 0 1px 1px #fff4;
}

.footer-action-icon svg {
  width: 18px;
  height: 18px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.55;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.footer-action:focus-visible {
  outline: 2px solid #303237;
  outline-offset: 6px;
}

.footer-art {
  position: relative;
  display: grid;
  place-items: center;
  min-width: 0;
}

.footer-art::before {
  content: "";
  position: absolute;
  inset: 0;
  background: radial-gradient(circle, #414b5e42 .65px, transparent 1px) center / 14px 14px;
  mask-image: radial-gradient(ellipse at center, #000 10%, transparent 69%);
}

.footer-art-stack {
  --tile-size: clamp(122px, 15vw, 205px);
  position: relative;
  display: grid;
  width: var(--tile-size);
  height: var(--tile-size);
}

.footer-glass {
  grid-area: 1 / 1;
  border: 1px solid #979da858;
  border-radius: 22%;
  background:
    radial-gradient(ellipse at 14% 8%, #fffc, transparent 57%),
    linear-gradient(140deg, #fff7, #d2d7de63 52%, #fffa);
  box-shadow: inset 0 2px 2px #fffd, inset 0 -2px 3px #fff8, 0 13px 27px #39445720;
}

.footer-glass-back { transform: translate(19%, -13%) rotate(13deg); opacity: .67; }
.footer-glass-middle { transform: translate(9%, -6%) rotate(3deg); opacity: .83; }

.footer-glass-front {
  display: grid;
  place-items: center;
  transform: translate(-6%, 5%) rotate(-9deg);
  background:
    radial-gradient(ellipse at 4% 0, #ffffffe8, transparent 65%),
    linear-gradient(145deg, #ffffff9c, #d7dbe295 57%, #ffffffc2);
  border-color: #8d95a16e;
  box-shadow: inset 0 2px 2px #fff, inset 0 -2px 3px #fffd, 0 18px 32px #39445729;
}

.footer-glass-front .logo-symbol {
  transform: rotate(9deg) scale(2.35);
}

.footer-directory {
  display: grid;
  grid-template-columns: minmax(180px, 1.6fr) minmax(85px, .8fr) minmax(72px, .7fr) minmax(165px, 1.2fr);
  align-items: start;
  gap: 24px clamp(16px, 3vw, 44px);
  padding: 34px 3px 28px;
}

.footer-identity p {
  margin-top: 7px;
  max-width: 29ch;
  color: #575757;
  font-size: 13px;
}

.footer-heading {
  margin-bottom: 7px;
  color: #51535a;
  font-size: 11px;
  font-weight: 700;
  line-height: 1.4;
  letter-spacing: .11em;
  text-transform: uppercase;
}

.footer-nav {
  display: grid;
  justify-items: start;
  gap: 4px;
  font-size: 14px;
}

.footer-nav .footer-heading { margin-bottom: 3px; }

.footer-email {
  font-size: 14px;
  overflow-wrap: anywhere;
}

.footer-socials {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-top: 10px;
}

.footer-socials a {
  display: grid;
  place-items: center;
  width: 35px;
  height: 35px;
  border: 1px solid #dedede;
  border-radius: 50%;
  background: linear-gradient(145deg, #fff, #f3f3f3);
  color: #242424;
  box-shadow: inset 0 1px 1px #fff, 0 2px 4px #0000000b;
}

.footer-socials svg {
  width: 15px;
  height: 15px;
  fill: currentColor;
}

@media (hover: hover) {
  .footer-socials a:hover {
    border-color: #282828;
    background: #282828;
    color: #fff;
    box-shadow: inset 0 1px 1px #fff3;
  }
}

.footer-nav a:hover,
.footer-email:hover,
.footer-bottom a:hover,
.company-page a:not(.button, .brand):hover {
  text-decoration: underline;
  text-underline-offset: 4px;
}

.footer-bottom {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 6px 16px;
  padding: 14px 3px 0;
  border-top: 1px solid #e2e2e2;
  color: #575757;
  font-size: 12px;
}

@media (pointer: coarse) {
  .footer-socials a { width: 44px; height: 44px; }
  .footer-nav a, .footer-email, .footer-bottom a {
    display: inline-flex;
    align-items: center;
    min-height: 44px;
  }
}

@media (hover: hover) {
  .footer-action:hover { box-shadow: inset 0 1px 1px #fff, 0 0 0 4px #fffc, 0 8px 17px #26324329; }
}

@media (prefers-reduced-motion: no-preference) {
  .footer-action,
  .footer-action-icon svg { transition: transform .24s ease-out, box-shadow .24s ease-out; }
  .footer-action:focus-visible svg { transform: translate(2px, -2px); }

  @media (hover: hover) {
    .footer-action:hover { transform: translateY(-2px); }
    .footer-action:hover svg { transform: translate(2px, -2px); }
  }
}

@media (max-width: 760px) {
  .ada-section { padding-inline: 20px; }
  .site-footer { padding-inline: 20px; }
  .footer-invite { grid-template-columns: minmax(0, 1fr); border-radius: 22px; }
  .footer-invite-copy { padding: 26px 23px 8px; }
  .footer-art { min-height: 172px; }
  .footer-art-stack { --tile-size: 110px; }
  .footer-glass-front .logo-symbol { transform: rotate(9deg) scale(1.6); }
  .footer-directory {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    padding-block: 26px 20px;
  }
}

@media (max-width: 460px) {
  .footer-identity, .footer-contact { grid-column: 1 / -1; }
}

.company-page {
  background: #fff;
  min-height: 100vh;
  padding-inline: clamp(20px, 6vw, 84px);
}

.company-bottom {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 12px 28px;
  max-width: 1120px;
  margin-inline: auto;
  padding-block: 18px;
  font-size: 13px;
}

.company-content {
  max-width: 792px;
  margin-inline: auto;
  padding-block: clamp(48px, 8vw, 112px);
}

.company-content h1 {
  font-size: clamp(39px, 7vw, 74px);
  letter-spacing: -.06em;
  line-height: 1.03;
}

.company-intro {
  max-width: 60ch;
  color: #4e4e4e;
  margin-top: 16px;
  font-size: clamp(17px, 2.1vw, 21px);
}

.company-content section {
  margin-top: 28px;
  padding-top: 20px;
  border-top: 1px solid #e2e2e2;
  color: #4e4e4e;
}

.company-content h2 {
  margin-bottom: 8px;
  color: #181818;
  font-size: 21px;
  font-weight: 600;
}

.company-content p + p { margin-top: 8px; }
.company-content ul { margin: 0; padding-inline-start: 20px; line-height: 1.65; }
.company-content > .button { margin-top: 24px; }

.company-bottom {
  color: #575757;
  border-top: 1px solid #e2e2e2;
}

.company-bottom nav { display: flex; flex-wrap: wrap; gap: 10px 20px; }
.company-bottom [aria-current="page"] { color: #181818; font-weight: 600; }

.inquiry-dialog {
  width: min(560px, calc(100% - 32px));
  max-height: calc(100dvh - 32px);
  padding: clamp(20px, 4vw, 32px);
  border: 1px solid #e3e3e3;
  border-radius: 22px;
  background: #fafafa;
  color: #191919;
  box-shadow: 0 24px 80px #0004;
  overscroll-behavior: contain;
}

.inquiry-dialog::backdrop { background: #17171770; backdrop-filter: blur(5px); }

.inquiry-heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

.inquiry-heading h2 { font-size: clamp(25px, 4vw, 36px); }

.inquiry-close {
  flex: none;
  width: 44px;
  height: 44px;
  border: 1px solid #ddd;
  border-radius: 50%;
  background: #fff;
  color: #222;
  font-size: 22px;
}

.inquiry-intro { margin: 8px 0 24px; color: #555; }
.inquiry-dialog .form-note a { text-decoration: underline; text-underline-offset: 3px; }
.inquiry-dialog #inquiry-email { margin-top: 12px; }

/* Automation services catalog */
.ada-section.automation-catalog {
  padding-block: clamp(28px, 4vw, 58px) clamp(52px, 7vw, 96px);
  scroll-margin-top: 0;
}

.catalog-heading {
  display: grid;
  justify-items: center;
  gap: clamp(14px, 1.6vw, 22px);
  text-align: center;
}

.catalog-heading h2 {
  font-size: clamp(2.375rem, 5.3vw, 4.5rem);
  line-height: 1.02;
  letter-spacing: -.055em;
  text-wrap: balance;
}

.catalog-intro {
  max-width: 52ch;
  color: #4b4b4b;
  font-size: clamp(1.0625rem, 1.65vw, 1.3125rem);
  line-height: 1.4;
  text-wrap: balance;
}

.catalog-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 14px;
  margin-top: clamp(24px, 4vw, 44px);
}

.catalog-group {
  min-width: 0;
  padding: 7px;
  border: 1px solid #dedede;
  border-radius: 22px;
  background: linear-gradient(150deg, #fff 16%, #f1f1f1);
  box-shadow: inset 0 1px 1px #fff, 0 3px 8px #00000008, 0 14px 28px -20px #0005;
}

.catalog-plate {
  --catalog-play-state: paused;
  position: relative;
  isolation: isolate;
  display: grid;
  align-items: end;
  justify-items: center;
  min-height: 112px;
  overflow: hidden;
  border: 1px solid color-mix(in srgb, var(--catalog-accent) 13%, #dcdfe1);
  border-radius: 15px;
  background:
    linear-gradient(168deg, #fff 0%, #ffffff52 22%, transparent 43%),
    radial-gradient(circle, #3c495720 .7px, transparent 1px) center / 13px 13px,
    linear-gradient(150deg, #fff 10%, color-mix(in srgb, var(--catalog-tint) 12%, #f4f5f6));
  color: #46505a;
  box-shadow: inset 0 1px 2px #fff, inset 0 0 0 1px #fff9,
    inset 0 -4px 9px #65728615, 0 2px 4px #202c3910;
}

.catalog-plate--voice {
  --catalog-accent: #117249;
  --catalog-tint: #84e7b0;
}

.catalog-plate--workflow {
  --catalog-accent: #895700;
  --catalog-tint: #ffd477;
  --catalog-cycle: .88s;
  --catalog-symbol-glow: #e9a52c66;
}

.catalog-plate--knowledge {
  --catalog-accent: #1c5f97;
  --catalog-tint: #9dd3ff;
  --catalog-cycle: 4.8s;
}

.catalog-plate--systems {
  --catalog-accent: #6540a1;
  --catalog-tint: #cbb0ff;
  --catalog-cycle: 1.1s;
  --catalog-symbol-glow: #a879e866;
}

.catalog-plate > span {
  position: absolute;
  top: 11px;
  left: 12px;
  color: color-mix(in srgb, var(--catalog-accent) 66%, #343a42);
  font: 12px/1.2 ui-monospace, monospace;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.catalog-plate::after {
  content: "";
  position: absolute;
  top: 16px;
  right: 12px;
  width: 4px;
  height: 4px;
  border-radius: 50%;
  background: var(--catalog-accent);
}

.catalog-diagram {
  width: min(94%, 270px);
  height: 84px;
  margin-bottom: 3px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.5;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.catalog-diagram .catalog-trace {
  stroke: color-mix(in srgb, var(--catalog-accent) 45%, #868e98);
}

.catalog-plate--workflow .catalog-trace,
.catalog-plate--systems .catalog-trace {
  opacity: .48;
  stroke-width: 1;
}

.catalog-diagram .catalog-node {
  fill: color-mix(in srgb, var(--catalog-tint) 12%, #fff);
  stroke: color-mix(in srgb, var(--catalog-accent) 42%, #8f98a0);
}

.catalog-voice-wave,
.catalog-charge-bolt,
.catalog-search-icon,
.catalog-search-spark { stroke: var(--catalog-accent); }

.catalog-voice-wave { stroke-width: 1.8; }

.catalog-diagram .catalog-charge-node,
.catalog-diagram .catalog-system-hub { stroke: var(--catalog-accent); }

.catalog-charge-bolt { fill: #ddb268; }
.catalog-system-ai {
  fill: var(--catalog-accent);
  stroke: none;
  font: 700 14px Arial, sans-serif;
}
.catalog-workflow-check { stroke: #786343; }

.catalog-search-query {
  fill: #244860;
  stroke: none;
  font: 8.5px ui-monospace, monospace;
}

.catalog-search-caret {
  opacity: 0;
  stroke: var(--catalog-accent);
  stroke-width: 1;
}

.catalog-signal {
  visibility: hidden;
  stroke: var(--catalog-accent);
  stroke-width: 2.5;
  stroke-dasharray: 4 16;
}

.catalog-group h3 {
  display: flex;
  align-items: center;
  min-height: 44px;
  padding: 6px 6px 4px;
  font-size: clamp(14px, 1.3vw, 17px);
  font-weight: 700;
  line-height: 1.2;
  letter-spacing: -.025em;
}

.catalog-list {
  display: grid;
  gap: 5px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.catalog-card > span {
  display: flex;
  align-items: center;
  min-height: 44px;
  height: 100%;
  padding: 7px 9px;
  border: 1px solid #e3e3e3;
  border-radius: 9px;
  background: linear-gradient(160deg, #fff, #fafafa);
  box-shadow: 0 1px 2px #00000005;
  font-size: 13px;
  font-weight: 500;
  line-height: 1.28;
  overflow-wrap: anywhere;
}

.catalog-footer {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 14px 24px;
  margin-top: 16px;
  padding: clamp(14px, 2vw, 22px);
  border: 1px solid #e2e2e2;
  border-radius: 19px;
  background: linear-gradient(135deg, #f0f0f0, #fff 68%);
  box-shadow: inset 0 1px 1px #fff, 0 3px 8px #00000007;
}

.catalog-more {
  font-size: clamp(20px, 2.4vw, 29px);
  line-height: 1.1;
  letter-spacing: -.04em;
}

.catalog-footer-note {
  margin-top: 5px;
  color: #555;
  font-size: 14px;
}

.catalog-footer a.button {
  min-height: 44px;
  padding-inline: 15px 7px;
  box-shadow: inset 0 1px 1px #fff3, 0 3px 7px #0002;
}

@media (max-width: 1020px) {
  .catalog-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 580px) {
  .catalog-grid { grid-template-columns: minmax(0, 1fr); }
  .catalog-list { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .catalog-list > :last-child:nth-child(odd) { grid-column: 1 / -1; }
  .catalog-card > span { min-height: 46px; }
}

@media (prefers-reduced-motion: no-preference) {
  .catalog-plate.is-in-view { --catalog-play-state: running; }

  .catalog-voice-wave path {
    transform-box: fill-box;
    transform-origin: center;
    animation: catalog-voice-wave 1.35s ease-in-out infinite;
    animation-play-state: var(--catalog-play-state);
  }

  .catalog-voice-wave path:nth-child(3n + 1) { animation-delay: -.27s; }
  .catalog-voice-wave path:nth-child(3n + 2) { animation-delay: -.68s; }
  .catalog-voice-wave path:nth-child(2n) { animation-duration: 1.08s; }
  .catalog-voice-wave path:nth-child(5n) { animation-delay: -.95s; }

  .catalog-signal {
    visibility: visible;
    animation: catalog-data-flow var(--catalog-cycle) linear infinite;
  }

  .catalog-charge-bolt, .catalog-system-ai {
    animation: catalog-symbol-glow var(--catalog-cycle) ease-in-out infinite;
  }

  .catalog-search-query { animation: catalog-search-type var(--catalog-cycle) linear infinite; }
  .catalog-search-caret { animation: catalog-search-caret var(--catalog-cycle) linear infinite, catalog-caret-blink .84s steps(1) infinite; }
  .catalog-search-icon { animation: catalog-search-focus var(--catalog-cycle) ease-in-out infinite; }
  .catalog-search-result, .catalog-search-spark { animation: catalog-search-results var(--catalog-cycle) ease-in-out infinite; }
  .catalog-plate :is(
    .catalog-signal, .catalog-charge-bolt, .catalog-system-ai,
    .catalog-search-query, .catalog-search-caret, .catalog-search-icon, .catalog-search-result,
    .catalog-search-spark
  ) { animation-play-state: var(--catalog-play-state); }

  .catalog-group.is-visible .catalog-card {
    animation: catalog-card-in .38s cubic-bezier(.2, .7, .3, 1) backwards;
    animation-delay: var(--catalog-delay, 0ms);
  }

  .catalog-group.is-visible .catalog-plate::before {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(114deg, transparent 25%, #fff2 49%, transparent 72%);
    animation: catalog-reflection .85s cubic-bezier(.2, .7, .3, 1) both;
    pointer-events: none;
  }

}

@keyframes catalog-voice-wave {
  0%, 100% { transform: scaleY(.6); opacity: .65; }
  34% { transform: scaleY(1.16); opacity: 1; }
  68% { transform: scaleY(.78); opacity: .83; }
}

/* Travel exactly one packet spacing, with the packet crossing the symbol halfway through. */
@keyframes catalog-data-flow {
  from { stroke-dashoffset: -8; }
  to { stroke-dashoffset: -28; }
}

@keyframes catalog-symbol-glow {
  0%, 17%, 83%, 100% { filter: none; }
  44%, 56% { filter: drop-shadow(0 0 2.5px var(--catalog-symbol-glow)); }
}

@keyframes catalog-search-type {
  0%, 12% { clip-path: inset(0 100% 0 0); animation-timing-function: steps(12, end); }
  48%, 85% { clip-path: inset(0); opacity: 1; }
  94%, 100% { clip-path: inset(0); opacity: 0; }
}

@keyframes catalog-search-caret {
  0% { opacity: 0; transform: translateX(0); }
  7%, 12% { opacity: 1; transform: translateX(0); animation-timing-function: steps(12, end); }
  48%, 85% { opacity: 1; transform: translateX(62px); }
  94%, 100% { opacity: 0; transform: translateX(62px); }
}

@keyframes catalog-caret-blink {
  50% { stroke-opacity: 0; }
}

@keyframes catalog-search-focus {
  0%, 45%, 77%, 100% { transform: translateX(0); }
  56%, 66% { transform: translateX(2px); }
}

@keyframes catalog-search-results {
  0%, 47%, 89%, 100% { stroke: #7591a6; }
  61%, 73% { stroke: #286495; }
}

@keyframes catalog-card-in {
  from { opacity: .45; transform: translateY(7px); }
  to { opacity: 1; transform: translateY(0); }
}

@keyframes catalog-reflection {
  from { transform: translateX(-100%); }
  to { transform: translateX(100%); }
}

/* Monochrome workflow previews and scroll stack. */
:root {
  --ink: #171717;
}

.button, .ada-content .button { background: var(--ink); }
.button span, .ada-content .button span { color: var(--ink); }
.button:hover, .ada-content .button:hover { background: #353535; }
.header .button { background: linear-gradient(145deg, #393939, #141414); }
.header .button:hover { background: #383838; }

.header .logo-symbol {
  width: 38px;
  height: 38px;
  flex: none;
}

.header .logo-symbol img {
  width: 450%;
  left: -25%;
  top: -79.6875%;
}

/* The offer introduces the interactive service layers below it. */
.service-offer {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  align-items: center;
  gap: clamp(34px, 5vw, 76px);
  max-width: 1440px;
  margin: 0 auto;
  padding: clamp(64px, 8vw, 120px) clamp(20px, 4vw, 56px);
}

#services {
  background: #fff;
  scroll-margin-top: 0;
}

.service-kicker {
  display: flex;
  align-items: center;
  gap: 9px;
  color: #515151;
  font-size: 10px;
  font-weight: 600;
  letter-spacing: .15em;
}

.service-kicker > span {
  position: relative;
  flex: none;
  width: 8px;
  height: 8px;
  background: #218c46;
  border-radius: 50%;
  box-shadow: 0 0 0 3px #218c461f;
}

@media (prefers-reduced-motion: no-preference) {
  .service-kicker > span::after {
    content: "";
    position: absolute;
    inset: 0;
    border: 1px solid currentColor;
    border-radius: inherit;
    color: #218c46;
    animation: service-live-pulse 1.5s ease-out infinite;
  }
}

@keyframes service-live-pulse {
  0% { opacity: .65; transform: scale(1); }
  70%, 100% { opacity: 0; transform: scale(2.6); }
}

.service-offer h2 {
  margin: 18px 0 20px;
  max-width: 14ch;
  font-size: clamp(38px, 4.6vw, 67px);
  line-height: 1.02;
  letter-spacing: -.055em;
  text-wrap: balance;
}

.service-description {
  max-width: 43ch;
  font-size: clamp(16px, 1.45vw, 19px);
  color: #515151;
}

.service-availability {
  margin-top: 14px;
  font-size: 13px;
  color: #555;
}

.service-actions {
  margin-top: 30px;
}

.service-primary-action {
  position: relative;
  isolation: isolate;
  display: inline-flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  overflow: hidden;
  min-width: min(260px, 100%);
  min-height: 62px;
  padding: 8px 10px 8px 23px;
  border: 1px solid transparent;
  border-radius: 999px;
  background:
    linear-gradient(165deg, #343434, #171717 52%, #0c0c0c) padding-box,
    linear-gradient(150deg, #909090, #303030 38%, #171717 63%, #6f6f6f) border-box;
  color: #fff;
  font-size: 16px;
  line-height: 1.2;
  font-weight: 600;
  box-shadow: inset 0 2px 1px #ffffff22, inset 0 -2px 2px #0008,
    0 0 0 4px #f2f2f2, 0 8px 18px #0002;
}

.service-primary-action::before,
.service-primary-action::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  pointer-events: none;
}

.service-primary-action::before {
  background: linear-gradient(112deg, transparent 26%, #ffffff1c 43%, #ffffff48 50%, transparent 66%);
  transform: translateX(-125%);
}

.service-primary-action::after {
  background: radial-gradient(ellipse 100px 58px at var(--cta-x, 50%) var(--cta-y, 50%),
    #ffffff43, #ffffff10 58%, transparent 100%);
  opacity: 0;
}

.service-action-icon {
  position: relative;
  display: grid;
  place-items: center;
  flex: none;
  width: 40px;
  height: 40px;
  overflow: hidden;
  border-radius: 50%;
  background: linear-gradient(145deg, #fff 38%, #e2e2e2);
  color: #171717;
  box-shadow: inset 0 1px 2px #fff, inset 0 -1px 2px #0002, 0 2px 5px #0006;
}

.service-action-icon svg {
  position: absolute;
  width: 19px;
  height: 19px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.55;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.service-arrow-enter { transform: translate(-25px, 25px); }
.service-primary-action:focus-visible { outline: 2px solid #252525; outline-offset: 6px; }

@media (hover: hover) {
  .service-primary-action:hover {
    background:
      linear-gradient(165deg, #404040, #1d1d1d 52%, #101010) padding-box,
      linear-gradient(150deg, #bbb, #545454 38%, #232323 63%, #8b8b8b) border-box;
    box-shadow: inset 0 2px 1px #ffffff3b, inset 0 -2px 2px #0007,
      0 0 0 4px #eeeeee, 0 12px 24px #0003;
  }
}

@media (prefers-reduced-motion: no-preference) {
  .service-primary-action {
    transition: transform .27s cubic-bezier(.2, .8, .25, 1), box-shadow .27s;
  }

  .service-primary-action::after { transition: opacity .22s; }
  .service-action-icon svg {
    transition: transform .3s cubic-bezier(.2, .75, .25, 1);
  }

  .service-actions.is-visible .service-primary-action::before {
    animation: service-action-sweep .95s .2s cubic-bezier(.24, .66, .24, 1);
  }

  .service-primary-action:focus-visible .service-arrow-exit { transform: translate(25px, -25px); }
  .service-primary-action:focus-visible .service-arrow-enter { transform: none; }

  @media (hover: hover) {
    .service-primary-action:hover { transform: translateY(-3px); }
    .service-primary-action:hover::after { opacity: 1; }
    .service-primary-action:hover .service-arrow-exit { transform: translate(25px, -25px); }
    .service-primary-action:hover .service-arrow-enter { transform: none; }
    .service-primary-action:hover:active { transform: translateY(1px); }
  }

  .service-primary-action:active { transform: translateY(1px); }
}

@keyframes service-action-sweep {
  from { transform: translateX(-125%); }
  to { transform: translateX(125%); }
}

@media (max-width: 500px) {
  .service-primary-action { width: 100%; }
}

.service-visual {
  --glass-surface: linear-gradient(155deg, #fffd, #fff5 49%, #fffb);
  --glass-edge: inset 0 1px 1px #fff, inset 0 -1px 2px #fffc, 0 2px 6px #303e5712;
  position: relative;
  isolation: isolate;
  margin: 0;
  overflow: hidden;
  border: 1px solid #77869c4d;
  border-radius: 23px;
  background: linear-gradient(145deg, #fff9, #fff1 48%, #fff5), #f2f5fa;
  color: #222631;
  font-family: -apple-system, BlinkMacSystemFont, system-ui, sans-serif;
  box-shadow: 0 4px 10px #29344412, 0 24px 50px -16px #29344438;
}

@supports ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
  .service-visual {
    background-color: #ffffff30;
    -webkit-backdrop-filter: blur(13px) saturate(128%);
    backdrop-filter: blur(13px) saturate(128%);
  }
}

.service-visual::after {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: inherit;
  pointer-events: none;
  box-shadow: inset 0 0 0 1px #fff9, inset 0 2px 3px #fff,
    inset 3px 0 5px #fff8, inset -3px 0 6px #fff9,
    inset 0 -5px 9px #aab9ce40, inset 0 -2px 4px #fffc;
}

@media (prefers-reduced-transparency: reduce) {
  .service-visual {
    background-color: #f2f5fa;
    -webkit-backdrop-filter: none;
    backdrop-filter: none;
  }
}

.service-visual-label {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
  align-items: center;
  gap: 6px;
  min-height: 46px;
  padding: 7px clamp(10px, 1.5vw, 18px);
  border-bottom: 1px solid #414c641a;
  background: linear-gradient(180deg, #fffb, #fff5 64%, #e8ebf13b);
  box-shadow: inset 0 -1px #fff8;
}

.service-window-lights {
  display: flex;
  gap: clamp(4px, .6vw, 7px);
}

.service-window-lights > span {
  width: clamp(9px, 1vw, 12px);
  aspect-ratio: 1;
  border: 1px solid #0002;
  border-radius: 50%;
  background: linear-gradient(#ffffff30, transparent 70%), var(--light-color);
  box-shadow: inset 0 1px 1px #fff4;
}

.service-window-lights > span:nth-child(1) { --light-color: #ff5f57; }
.service-window-lights > span:nth-child(2) { --light-color: #febc2e; }
.service-window-lights > span:nth-child(3) { --light-color: #28c840; }

.service-window-title {
  grid-column: 2;
  color: #303542;
  font-size: clamp(10px, 1vw, 13px);
  font-weight: 650;
  white-space: nowrap;
}

.service-window-title > span { margin: 0 .25em; color: #686f7e; }

.service-map {
  --map-cycle: 4.1s;
  position: relative;
  isolation: isolate;
  padding: 21px clamp(10px, 2.2vw, 28px) 3px;
  background: radial-gradient(circle, #495b7726 1px, transparent 1.4px) center / 18px 18px;
}

/* A broad reflection drifts behind the frosted nodes. */
.service-map::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  background:
    linear-gradient(145deg, transparent 15%, #fff6 34%, transparent 49%),
    linear-gradient(145deg, transparent 44%, #fff5 65%, transparent 80%);
  background-size: 145% 145%;
  pointer-events: none;
}

.service-map-phases {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: clamp(6px, 1.4vw, 16px);
}

.service-map-phase { --phase-delay: 0s; min-width: 0; }
.service-map-phase:nth-child(2) { --phase-delay: .55s; }
.service-map-phase:nth-child(3) { --phase-delay: 1.1s; }

.service-map-phase h3 {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  margin: 0 0 9px;
  color: #222631;
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0;
}

.service-map-phase h3 span {
  color: #606979;
  font: 10px ui-monospace, monospace;
}

.service-map-phase ul {
  display: grid;
  gap: 6px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.service-map-phase li {
  --node-delay: 0s;
  --node-border: #63738a30;
  display: flex;
  align-items: center;
  gap: 7px;
  min-height: 32px;
  padding: 5px clamp(5px, 1vw, 12px);
  border: 1px solid var(--node-border);
  border-radius: 10px;
  background: var(--glass-surface);
  color: #252c38;
  font-size: clamp(10px, 1.05vw, 13px);
  line-height: 1.14;
  box-shadow: var(--glass-edge);
  -webkit-backdrop-filter: blur(8px);
  backdrop-filter: blur(8px);
}

.service-map-phase li:nth-child(2) { --node-delay: .1s; }
.service-map-phase li:nth-child(3) { --node-delay: .2s; }
.service-map-phase li:nth-child(4) { --node-delay: .3s; }
.service-map-phase li:nth-child(5) { --node-delay: .4s; }

.service-map-phase li::before {
  content: "";
  flex: none;
  width: 4px;
  height: 4px;
  border-radius: 50%;
  background: #738197;
}

.service-map-routing {
  position: relative;
  height: 150px;
}

.service-map-lines {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  fill: none;
  stroke-width: 1.2;
}

.service-traces { stroke: #7b879b; }

.service-signals {
  stroke: #416fa2;
  stroke-width: 2.3;
  stroke-linecap: round;
  stroke-dasharray: .18 1;
}

.service-signals use { opacity: 0; }

.service-map-hub, .service-map-output {
  position: absolute;
  left: 50%;
  translate: -50% -50%;
}

.service-map-hub {
  top: 40.67%;
  display: grid;
  place-items: center;
  width: 58px;
  height: 58px;
  border: 1px solid #bfc7d3;
  border-radius: 17px;
  background: linear-gradient(145deg, #fff, #f7f8fb 48%, #e0e5ed);
  box-shadow: inset 0 2px 3px #fff, inset 0 -2px 3px #fffc, 0 6px 18px #303e5726;
}

.service-map-output {
  --node-border: #aeb8c8;
  --node-fill: #f1f3f8;
  top: 83.33%;
  display: flex;
  align-items: center;
  gap: 8px;
  width: max-content;
  padding: 9px 14px;
  border: 1px solid var(--node-border);
  border-radius: 22px;
  background: var(--glass-surface), var(--node-fill);
  color: #222631;
  font-size: 12px;
  font-weight: 600;
  box-shadow: var(--glass-edge);
}

.service-map-output > span { color: #596477; }

@media (prefers-reduced-motion: no-preference) {
  /* A shared cycle keeps the staggered pulses in sync after every loop. */
  .service-visual.is-visible .service-map::before { animation: offer-reflection var(--map-cycle) ease-in-out infinite; }
  .service-visual.is-visible .service-map-phase li {
    animation: offer-node var(--map-cycle) calc(.1s + var(--phase-delay) + var(--node-delay)) ease-out infinite;
  }
  .service-visual.is-visible .service-signals use {
    animation: offer-signal var(--map-cycle) .65s ease-in-out infinite;
  }
  .service-visual.is-visible .service-signals use:nth-child(2) { animation-delay: 1.2s; }
  .service-visual.is-visible .service-signals use:nth-child(3) { animation-delay: 1.75s; }
  .service-visual.is-visible .service-signals use:last-child { animation-delay: 2.55s; }
  .service-visual.is-visible .service-map-hub { animation: offer-hub var(--map-cycle) 2.4s ease-in-out infinite; }
  .service-visual.is-visible .service-map-output { animation: offer-node var(--map-cycle) 3.2s ease-out infinite; }
}

@keyframes offer-reflection {
  0% { background-position: 100% 0; opacity: 0; }
  14.6%, 70.7% { opacity: 1; }
  87.8%, 100% { background-position: 0 100%; opacity: 0; }
}

@keyframes offer-node {
  0%, 15.9%, 100% { background-color: var(--node-fill, transparent); border-color: var(--node-border); }
  6.1% { background-color: #bad5f6; border-color: #7595ba; }
}

@keyframes offer-signal {
  0% { opacity: 0; stroke-dashoffset: .19; }
  3.7%, 20.2% { opacity: 1; }
  24.4%, 100% { opacity: 0; stroke-dashoffset: -1; }
}

@keyframes offer-hub {
  0%, 19.5%, 100% { transform: scale(1); filter: brightness(1); }
  8.8% { transform: scale(1.08); filter: brightness(1.2); }
}

@media (max-width: 760px) {
  .service-offer {
    grid-template-columns: minmax(0, 1fr);
    gap: 32px;
  }

  .service-offer h2 { max-width: 16ch; }
  .service-visual { border-radius: 20px; }
}

@media (max-width: 420px) {
  .service-map-phase h3 { gap: 4px; }
  .service-map-phase li { gap: 4px; }
}

/* Layer chapters share one pinned viewport and one scroll timeline. */
.layer-track { scroll-margin-top: 0; overflow-anchor: none; }
.layer-stage {
  --layer-progress: 0;
  --layer-inset: clamp(24px, 4vw, 64px);
  --layer-control-bottom: 72px;
  background: linear-gradient(#dedede, #fcfcfc 84%);
}
.layer-progress, .layer-navigation { display: none; }

.layer-track.is-scrubbable {
  height: calc(100svh + 452svh);
}

.layer-track.is-scrubbable .layer-stage {
  position: sticky;
  top: 0;
  height: 100svh;
}

.layer-media {
  position: absolute;
  top: 50%;
  left: 64%;
  width: min(100%, 172svh);
  aspect-ratio: 16 / 9;
  transform: translate(-50%, -50%);
  pointer-events: none;
  mask-image:
    linear-gradient(90deg, transparent, #000 16%, #000 84%, transparent),
    linear-gradient(transparent, #000 15%, #000 89%, transparent);
  mask-composite: intersect;
}

.layer-media > img, .layer-media > video {
  position: absolute;
  inset: 0;
  height: 100%;
  width: 100%;
}

.layer-video { visibility: hidden; }
.is-scrubbable .has-video-frame .layer-video { visibility: visible; }

.layer-controls {
  display: grid;
  gap: 5px;
  width: min(38%, 440px);
  padding: 6px;
  border: 1px solid #fff;
  border-radius: 23px;
  background: linear-gradient(145deg, #ffffffdc, #f6f6f6bc);
  box-shadow: inset 0 1px 1px #fff, 0 0 0 1px #19191915, 0 12px 26px -15px #0006;
  backdrop-filter: blur(14px);
  color: #202020;
}

.layer-track.is-scrubbable .layer-controls {
  position: absolute;
  top: 90px;
  bottom: var(--layer-control-bottom);
  left: var(--layer-inset);
  align-self: center;
  height: max-content;
  max-height: calc(100% - 90px - var(--layer-control-bottom));
  margin-block: auto;
  overflow-y: auto;
  scrollbar-width: thin;
}

.layer-track:not(.is-scrubbable) .layer-stage { height: auto; }
.layer-track:not(.is-scrubbable) .layer-controls {
  position: relative;
  margin: 100px var(--layer-inset) 60px;
}

.layer-controls details {
  min-width: 0;
  border: 1px solid #19191912;
  border-radius: 15px;
  background: linear-gradient(155deg, #fff, #f7f7f7);
}

.layer-controls details[open] {
  border-color: #91919152;
  background:
    linear-gradient(162deg, #ffffffde 0%, #ffffff40 19%, transparent 45%),
    radial-gradient(ellipse at 100% 100%, #ffffffb0, transparent 57%),
    linear-gradient(145deg, #ffffff3d, #c7c7c766 80%);
  color: #171717;
  box-shadow:
    inset 0 1px 1px #fff, inset 0 -1px 1px #fffd,
    inset 1px 0 3px #fff9, inset -1px 0 3px #fff7,
    0 3px 8px #00000014;
}

.layer-controls summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  min-height: 44px;
  padding: 5px 10px 5px 13px;
  border-radius: inherit;
  font-size: 14px;
  font-weight: 600;
  line-height: 1.25;
  list-style: none;
  cursor: pointer;
}

.layer-controls summary::-webkit-details-marker { display: none; }
.layer-controls summary:focus-visible { outline-offset: -3px; }
.layer-controls details[open] summary { font-size: 16px; }
.layer-controls details[open] summary:focus-visible { outline-color: #383838; }

.layer-indicator {
  position: relative;
  display: grid;
  flex: none;
  place-items: center;
  width: 24px;
  height: 24px;
  border: 1px solid #19191915;
  border-radius: 50%;
  background: #ededed;
  color: #474747;
  font-size: 16px;
  font-weight: 400;
}

.layer-controls details[open] .layer-indicator {
  border-color: #c6c6c6;
  background: linear-gradient(145deg, #fff, #dedede);
  box-shadow: inset 0 1px 1px #fff;
  font-size: 0;
}

.layer-controls details[open] .layer-indicator::after {
  content: "";
  position: absolute;
  inset: 0;
  margin: auto;
  width: 7px;
  height: 1px;
  background: #303030;
}

.is-scrubbable .layer-controls details[open] .layer-indicator::after {
  width: 5px;
  height: 5px;
  border-radius: 50%;
}

.layer-controls details p {
  margin: 0 13px 13px;
  padding-top: 9px;
  border-top: 1px solid #19191924;
  color: #383838;
  font-size: 14px;
  line-height: 1.48;
}

@media (hover: hover) {
  .layer-controls details:not([open]) summary:hover { background: #ebebeb; }
}

@media (prefers-reduced-motion: no-preference) {
  .layer-controls details[open] p { animation: layer-copy-in .23s ease-out both; }

  @supports (interpolate-size: allow-keywords) and selector(details::details-content) {
    .layer-controls details::details-content {
      block-size: 0;
      overflow: clip;
      opacity: 0;
      interpolate-size: allow-keywords;
      transition: block-size .24s ease, opacity .2s ease, content-visibility .24s allow-discrete;
    }

    .layer-controls details[open]::details-content {
      block-size: auto;
      opacity: 1;
    }

    .layer-controls details[open] p { animation: none; }
  }
}

@keyframes layer-copy-in {
  from { opacity: .5; transform: translateY(3px); }
  to { opacity: 1; transform: translateY(0); }
}

.layer-track.is-scrubbable .layer-progress {
  position: absolute;
  display: grid;
  grid-template-columns: 1fr auto;
  align-items: center;
  gap: 12px;
  bottom: 16px;
  left: var(--layer-inset);
  width: 212px;
  min-height: 44px;
  padding: 6px 13px;
  border: 1px solid #d7d7d7;
  border-radius: 16px;
  background: #ffffffde;
  box-shadow: inset 0 1px 1px #fff, 0 3px 10px #00000014;
  backdrop-filter: blur(12px);
}

.layer-progress-value {
  color: #171717;
  font-size: 16px;
  font-weight: 400;
  font-variant-numeric: tabular-nums;
  line-height: 1;
}

.layer-progress-track {
  height: 6px;
  border-radius: 99px;
  background: #dedede;
  overflow: hidden;
}

.layer-progress i {
  display: block;
  width: 100%;
  height: 100%;
  transform: scaleX(var(--layer-progress));
  transform-origin: left;
  border-radius: inherit;
  background: #252525;
}

@media (max-width: 760px) {
  .layer-stage {
    --layer-inset: 16px;
    --layer-control-bottom: calc(66px + env(safe-area-inset-bottom));
    height: auto;
  }

  .layer-media {
    position: relative;
    top: auto;
    left: 50%;
    width: min(156%, 110svh);
    transform: translateX(-50%);
  }

  .layer-track:not(.is-scrubbable) .layer-controls {
    width: auto;
    margin: 0 var(--layer-inset) 20px;
  }

  .layer-track.is-scrubbable .layer-media {
    position: absolute;
    top: 45%;
    transform: translate(-50%, -50%);
  }

  .layer-track.is-scrubbable .layer-controls {
    top: auto;
    right: var(--layer-inset);
    width: auto;
    max-height: calc(100% - 75px - var(--layer-control-bottom));
  }

  .layer-track.is-scrubbable .layer-controls details:not([open]) { display: none; }

  .layer-track.is-scrubbable .layer-progress {
    bottom: calc(15px + env(safe-area-inset-bottom));
    left: 50%;
    width: min(212px, calc(100% - 136px));
    transform: translateX(-50%);
  }

  .layer-track.is-scrubbable .layer-navigation {
    position: absolute;
    display: flex;
    justify-content: space-between;
    right: var(--layer-inset);
    bottom: calc(15px + env(safe-area-inset-bottom));
    left: var(--layer-inset);
    pointer-events: none;
  }

  .layer-navigation button {
    display: grid;
    place-items: center;
    width: 44px;
    height: 44px;
    border: 1px solid #fff;
    border-radius: 50%;
    background: linear-gradient(145deg, #fff, #f0f0f0);
    color: #252525;
    box-shadow: 0 0 0 1px #19191915, 0 4px 10px #00000010;
    backdrop-filter: blur(12px);
    pointer-events: auto;
  }

  .layer-navigation button[aria-disabled="true"] { opacity: .55; }
}

.header.site-header {
  color: #181818;
  background: linear-gradient(135deg, #fffffff2, #ffffffcf 54%, #ffffffe8);
  border-color: #ffffffed;
}

.header.site-header.scrolled,
.header.site-header.menu-open {
  background: linear-gradient(135deg, #fffffff5, #ffffffdc 54%, #ffffffeb);
}

.site-header:not(.scrolled):not(.menu-open) .logo-symbol { filter: none; }
.site-header:not(.scrolled):not(.menu-open) nav a,
.site-header:not(.scrolled):not(.menu-open) .brand { text-shadow: none; }

.site-header .site-navigation {
  display: block;
  font-size: 13px;
}

.site-header .navigation-list,
.navigation-cards {
  margin: 0;
  padding: 0;
  list-style: none;
}

.site-header .navigation-list {
  display: flex;
  align-items: center;
  gap: clamp(8px, 1.6vw, 24px);
}

.site-header .navigation-list > li > a,
.site-header .navigation-dropdown > summary {
  display: flex;
  align-items: center;
  gap: 7px;
  min-height: 44px;
  white-space: nowrap;
}

.navigation-dropdown > summary {
  list-style: none;
}

.navigation-dropdown > summary::-webkit-details-marker { display: none; }

.navigation-chevron {
  width: 6px;
  height: 6px;
  border-right: 1px solid;
  border-bottom: 1px solid;
  transform: translateY(-2px) rotate(45deg);
}

.navigation-dropdown[open] .navigation-chevron {
  transform: translateY(1px) rotate(225deg);
}

.site-header .navigation-section-active,
.site-header [aria-current="page"]:not(.button) {
  text-decoration: underline;
  text-underline-offset: 5px;
}

.navigation-panel {
  position: absolute;
  top: calc(100% + 10px);
  left: 0;
  width: min(690px, 100%);
  padding: 19px;
  border: 1px solid #dedee0;
  border-radius: 25px;
  color: #181818;
  background: #fffffff7;
  box-shadow: inset 0 1px 1px #fff, 0 18px 50px #12121224;
  backdrop-filter: blur(24px);
  -webkit-backdrop-filter: blur(24px);
}

.site-header .navigation-overview {
  display: inline-flex;
  align-items: center;
  min-height: 38px;
  margin: 0 8px 6px;
  font-size: 14px;
  font-weight: 700;
}

.navigation-overview::after {
  margin-left: 7px;
  content: "↗";
}

.navigation-cards {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 5px 12px;
}

.navigation-cards li {
  position: relative;
  min-width: 0;
  padding: 10px 12px 11px;
  border-radius: 13px;
  background: #f3f3f5;
}

.site-header .navigation-cards a {
  font-size: 14px;
  font-weight: 600;
}

.navigation-cards a::after, .agency-card-grid a::after {
  position: absolute;
  inset: 0;
  border-radius: inherit;
  content: "";
}

.navigation-cards p {
  margin-top: 4px;
  color: #515151;
  font-size: 12px;
  line-height: 1.4;
}

.navigation-cards li:hover, .navigation-cards li:focus-within {
  background: #eaeaec;
}

.site-header .navigation-mobile-contact { display: none; }

.site-header :is(a, summary, button):focus-visible {
  outline: 2px solid currentColor;
  outline-offset: 3px;
  border-radius: 5px;
}

.company-page {
  padding-top: 105px;
}

.company-back {
  margin-bottom: 18px;
  color: #515151;
  font-size: 13px;
}

.agency-main {
  max-width: 1120px;
  margin-inline: auto;
  padding: 16px 0 clamp(48px, 7vw, 96px);
}

.agency-intro {
  padding: clamp(22px, 5vw, 65px);
  border: 1px solid #e0e1e3;
  border-radius: 29px;
  background: radial-gradient(ellipse at 84% 2%, #fff, transparent 59%), linear-gradient(150deg, #fff, #f1f2f4);
  box-shadow: inset 0 1px 2px #fff, 0 14px 32px -24px #17181b36;
}

.agency-breadcrumb ol {
  display: flex;
  flex-wrap: wrap;
  gap: 4px 8px;
  margin: 0 0 clamp(18px, 3vw, 32px);
  padding: 0;
  list-style: none;
  color: #555;
  font-size: 13px;
}

.agency-breadcrumb li:not(:last-child)::after {
  margin-left: 8px;
  color: #818181;
  content: "/";
}

.agency-intro h1 {
  max-width: 18ch;
  font-size: clamp(39px, 6.2vw, 78px);
  line-height: .99;
  letter-spacing: -.065em;
  text-wrap: balance;
}

.agency-intro > p {
  max-width: 60ch;
  margin-top: 20px;
  color: #444;
  font-size: clamp(16px, 2vw, 21px);
  line-height: 1.56;
}

.agency-section, .agency-process-link {
  margin: clamp(32px, 5vw, 66px) 0 0;
}

.agency-section h2 {
  margin-bottom: 17px;
  font-size: clamp(26px, 3.6vw, 41px);
  letter-spacing: -.045em;
}

.agency-section p { color: #474747; }

.agency-section > p { max-width: 66ch; }

.agency-step-list, .agency-card-grid {
  margin: 0;
  padding: 0;
  list-style: none;
}

.agency-step-list li {
  display: grid;
  grid-template-columns: minmax(0, .85fr) minmax(0, 1.7fr);
  gap: 6px 28px;
  padding: 17px 0;
  border-top: 1px solid #e3e3e3;
}

.agency-step-list h3,
.agency-card-grid h3 {
  font-size: clamp(16px, 2.1vw, 21px);
  font-weight: 600;
  line-height: 1.25;
  letter-spacing: -.022em;
}

.agency-card-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
}

.agency-card-grid li {
  position: relative;
  min-width: 0;
  padding: 22px;
  border: 1px solid #e2e2e2;
  border-radius: 17px;
  background: linear-gradient(150deg, #fff, #f7f7f8);
}

.agency-card-grid li:hover, .agency-card-grid li:focus-within {
  border-color: #b2b2b6;
}

.agency-card-grid p { margin-top: 8px; }

.agency-process-link a { text-decoration: underline; text-underline-offset: 4px; }

.agency-contact {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px 24px;
  flex-wrap: wrap;
  margin-top: clamp(36px, 6vw, 68px);
  padding: clamp(19px, 4vw, 36px);
  border: 1px solid #e1e1e1;
  border-radius: 21px;
  background: #f6f6f7;
}

.agency-contact h2 { font-size: clamp(23px, 3.2vw, 34px); margin-bottom: 6px; }
.agency-contact p { color: #515151; }

.catalog-group h3 a:hover, .service-description a:hover {
  text-decoration: underline;
  text-underline-offset: 4px;
}

.service-description a { color: #303030; text-decoration: underline; text-underline-offset: 3px; }

@media (max-width: 850px) {
  .site-header > .brand { position: static; transform: none; }
  .site-header .header-right { display: none; }
  .site-header .menu { display: none; }
  .site-header.menu-ready .menu {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    min-height: 44px;
    padding: 0 5px;
    border: 0;
    background: none;
    color: inherit;
  }
  .navigation-menu-icon {
    display: block;
    width: 13px;
    height: 7px;
    border-block: 1px solid;
  }
  .site-header.menu-open .navigation-menu-icon {
    height: 1px;
    border-bottom: 0;
  }
  .site-header:not(.menu-ready) {
    position: relative;
    flex-wrap: wrap;
    height: auto;
    padding-block: 8px;
  }
  .site-header:not(.menu-ready) .site-navigation { position: static; width: 100%; }
  .site-header.menu-ready .site-navigation { display: none; }
  .site-header.menu-open .site-navigation {
    display: block;
    position: absolute;
    top: calc(100% + 8px);
    left: 0;
    width: 100%;
    max-height: calc(100dvh - 92px);
    overflow-y: auto;
    overscroll-behavior: contain;
    padding: 12px 16px 16px;
    border: 1px solid #e0e0e0;
    border-radius: 23px;
    color: #181818;
    background: #fffffff7;
    box-shadow: 0 14px 34px #1112;
    backdrop-filter: blur(20px);
    -webkit-backdrop-filter: blur(20px);
  }
  .site-header .navigation-list { display: grid; gap: 0; }
  .site-header .navigation-list > li + li { border-top: 1px solid #e9e9eb; }
  .site-header .navigation-list > li > a,
  .site-header .navigation-dropdown > summary { justify-content: space-between; font-size: 16px; }
  .navigation-panel {
    position: static;
    width: auto;
    padding: 0 0 10px;
    border: 0;
    border-radius: 0;
    background: none;
    box-shadow: none;
    backdrop-filter: none;
  }
  .site-header .navigation-overview { margin-left: 0; }
  .site-header .navigation-mobile-contact { display: block; padding-top: 10px; }
  .site-header .navigation-mobile-contact a { width: fit-content; gap: 12px; }
}

@media (max-width: 680px) {
  .agency-card-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .agency-step-list li { grid-template-columns: minmax(0, 1fr); }
}

@media (max-width: 460px) {
  .company-page { padding-top: 84px; }
  .navigation-cards, .agency-card-grid { grid-template-columns: minmax(0, 1fr); }
  .agency-intro h1 { overflow-wrap: anywhere; }
}