.hero-pin { height:100vh; }
.nav-toggle { display:none; -webkit-appearance:none; appearance:none; position:relative; z-index:45; align-items:center; justify-content:flex-end; flex:0 0 auto; width:44px; height:44px; margin:-10px -8px -10px 0; padding:0; border:0; background:none; color:#D2D7EB; cursor:pointer; }
.nav-bars { position:relative; display:block; width:23px; height:12px; }
.nav-bars span { position:absolute; left:0; right:0; height:1.5px; background:currentColor; transition:top .32s cubic-bezier(.3,.8,.2,1), transform .32s cubic-bezier(.3,.8,.2,1); }
.nav-bars span:first-child { top:1px; }
.nav-bars span:last-child { top:10px; }
.nav-toggle[aria-expanded="true"] .nav-bars span:first-child { top:5px; transform:rotate(45deg); }
.nav-toggle[aria-expanded="true"] .nav-bars span:last-child { top:5px; transform:rotate(-45deg); }
.hero-copy-m { display:none; }
.about-transition::before { content:''; position:absolute; z-index:0; left:0; right:0; top:-220px; height:220px; background:linear-gradient(180deg,rgba(4,6,12,0),#04060c); pointer-events:none; }
.about-transition > div { position:relative; z-index:1; }
.services-grid { max-width:1400px; margin:0 auto; display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:clamp(100px,15vh,190px) clamp(80px,13vw,220px); align-items:start; }
.service-item { position:relative; max-width:570px; padding-left:52px; }
.service-item:nth-child(even) { margin-top:clamp(100px,14vh,180px); }
.service-number { position:absolute; left:0; top:.62em; font-family:'Unbounded',sans-serif; font-weight:300; font-size:clamp(12px,1vw,15px); letter-spacing:.02em; color:#5C74A0; }
.service-item h2 { margin:0 0 32px; font-family:'Unbounded',sans-serif; font-weight:300; font-size:clamp(32px,4.2vw,68px); line-height:1.05; letter-spacing:-.035em; color:#D2D7EB; }
.service-item p { margin:0; max-width:49ch; font-size:clamp(15px,1.25vw,18px); line-height:1.65; color:#93A3C6; }
.projects-head { max-width:1400px; margin:0 auto; padding:0 clamp(20px,4vw,56px); }
.projects-title { margin:0 0 clamp(36px,5vw,72px); text-align:center; font-family:'Unbounded',sans-serif; font-weight:300; font-size:clamp(40px,8.5vw,128px); line-height:1.1; letter-spacing:-.045em; }
.projects-controls { display:flex; justify-content:flex-end; align-items:center; gap:10px; margin-bottom:20px; font-size:11px; text-transform:uppercase; letter-spacing:.14em; color:#7F9CC6; }
.projects-controls button { width:42px; height:42px; border:1px solid rgba(127,156,198,.3); border-radius:50%; background:transparent; color:#D2D7EB; font-size:18px; cursor:pointer; }
.projects-controls button:hover { border-color:#7F9CC6; color:#7F9CC6; }
.cf-stage { --cf-card:clamp(240px,31vw,430px); position:relative; width:100%; overflow:hidden; padding:clamp(20px,3.5vh,52px) 0 clamp(10px,1.6vh,22px); perspective:calc(var(--cf-card) * 3); touch-action:pan-y; cursor:grab; outline:none; }
.cf-stage:active { cursor:grabbing; }
.project-strip { position:relative; height:calc(var(--cf-card) * .75 + 80px); transform-style:preserve-3d; user-select:none; -webkit-user-select:none; }
.project-card { position:absolute; left:50%; top:0; width:var(--cf-card); min-width:0; will-change:transform,opacity; }
.project-card img { -webkit-user-drag:none; }
.project-trigger { display:block; width:100%; padding:0; border:0; background:transparent; color:inherit; text-align:left; font:inherit; cursor:pointer; }
.project-cover { position:relative; display:block; overflow:hidden; background:#0a101c; box-shadow:0 0 30px -10px rgba(63,116,214,.26), 0 20px 44px -30px rgba(2,8,24,.9); animation:cfDrift 11s ease-in-out infinite; transition:box-shadow .7s ease; }
.project-card:nth-child(3n+2) .project-cover { animation-delay:-3.7s; }
.project-card:nth-child(3n+3) .project-cover { animation-delay:-7.4s; }
@keyframes cfDrift { 0%,100% { transform:translateY(0); } 50% { transform:translateY(-5px); } }
@media (prefers-reduced-motion:reduce) { .project-cover { animation:none; } }
.project-cover img { display:block; width:100%; aspect-ratio:4/3; object-fit:cover; transition:transform .45s ease,opacity .3s ease; }
.project-caption { display:flex; align-items:flex-start; gap:10px; min-height:54px; padding:12px 0 10px; font-size:clamp(10px,.91vw,13px); line-height:1.35; text-transform:uppercase; letter-spacing:.025em; transition:color .4s ease, letter-spacing .4s ease; }
.project-tint { position:absolute; inset:0; background:linear-gradient(158deg, rgba(210,215,235,.16) 0%, rgba(63,116,214,.4) 46%, rgba(3,70,149,.72) 100%); mix-blend-mode:color; opacity:0; transition:opacity .7s ease; pointer-events:none; }
.project-trigger[aria-expanded="true"] .project-tint { opacity:1; }
.project-trigger[aria-expanded="true"] .project-cover { box-shadow:0 0 66px -6px rgba(63,116,214,.6), 0 44px 88px -36px rgba(4,26,72,.95); }
.project-trigger[aria-expanded="true"] .project-cover img { filter:grayscale(1) contrast(1.03) brightness(1.04); }
.project-trigger[aria-expanded="true"] .project-caption { color:#EAF1FF; letter-spacing:.09em; }
.project-trigger:focus-visible,.project-close:focus-visible,.projects-controls button:focus-visible { outline:2px solid #B7C2DE; outline-offset:5px; }
@media (hover:hover) { .project-trigger:hover .project-cover { box-shadow:0 0 44px -8px rgba(63,116,214,.4), 0 26px 54px -30px rgba(2,8,24,.92); } .project-trigger:hover .project-cover img { transform:scale(1.035); opacity:.9; } .project-trigger:hover .project-caption { color:#7F9CC6; } .project-trigger[aria-expanded="true"]:hover .project-caption { color:#FFFFFF; } }
.project-details { max-width:1400px; margin:0 auto; padding:0 clamp(20px,4vw,56px); }
.project-detail { min-width:0; padding:clamp(34px,5vw,68px) 0 20px; border-top:1px solid rgba(127,156,198,.28); animation:bayFadeUp .3s ease both; }
.project-detail[hidden] { display:none !important; }
.project-detail-head { display:flex; align-items:flex-start; justify-content:space-between; gap:20px; }
.project-detail h3 { margin:0 0 14px; max-width:26ch; font-family:'Unbounded',sans-serif; font-weight:300; font-size:clamp(24px,3vw,42px); line-height:1.2; }
.project-industry { margin:0; font-size:11px; text-transform:uppercase; letter-spacing:.15em; color:#7F9CC6; }
.project-close { flex:0 0 auto; border:0; padding:7px 0 10px 10px; background:transparent; color:#B7C2DE; font:inherit; font-size:13px; cursor:pointer; }
.project-copy { max-width:1040px; margin:32px 0 0 auto; columns:2; column-gap:clamp(28px,5vw,72px); }
.project-copy p { margin:0 0 1em; break-inside:avoid; color:#B7C2DE; font-size:clamp(15px,1.2vw,18px); line-height:1.65; }
.project-images { display:grid; grid-template-columns:repeat(12,minmax(0,1fr)); align-items:start; gap:clamp(14px,2vw,28px); margin-top:clamp(34px,5vw,72px); }
.project-images img { display:block; grid-column:span 6; width:100%; height:auto; }
.project-images img:first-child:nth-last-child(1) { grid-column:2/span 10; }
.project-images img:first-child:nth-last-child(2),.project-images img:first-child:nth-last-child(3) { grid-column:span 7; }
.project-images img:nth-child(2):last-child,.project-images img:nth-child(2):nth-last-child(2) { grid-column:span 5; margin-top:clamp(28px,5vw,76px); }
.project-images img:nth-child(3):last-child { grid-column:3/span 8; margin-top:clamp(4px,1vw,16px); }
.team-portrait-katerina { object-position:70% center; }
.band-copy { position:absolute; inset:0; display:flex; flex-wrap:wrap; align-items:baseline; justify-content:flex-start; align-content:flex-end; gap:clamp(14px,2.4vw,40px) clamp(18px,3vw,48px); padding:clamp(20px,4vw,56px); }
.team-card { position:relative; container-type:inline-size; }
.team-trigger { -webkit-appearance:none; appearance:none; position:relative; display:block; width:100%; margin:0; padding:0; border:0; background:none; color:inherit; font:inherit; text-align:left; cursor:pointer; }
.team-trigger:focus-visible { outline:none; }
.team-glow { position:absolute; left:2%; right:2%; bottom:-6%; height:30%; border-radius:50%; background:radial-gradient(50% 50% at 50% 50%, rgba(86,138,232,.5) 0%, rgba(3,70,149,.26) 42%, rgba(3,70,149,0) 76%); filter:blur(28px); opacity:.5; transform:scale(.9); transition:opacity .9s cubic-bezier(.2,.7,.2,1), transform .9s cubic-bezier(.2,.7,.2,1); pointer-events:none; z-index:0; }
.team-media { position:relative; top:0; z-index:1; display:block; perspective:1600px; animation:teamFloat 9s ease-in-out infinite; transition:top .9s cubic-bezier(.2,.7,.2,1); }
.team-card:nth-child(2) .team-media { animation-delay:-3s; }
.team-card:nth-child(3) .team-media { animation-delay:-6s; }
.team-card:hover .team-media, .team-card[data-active="true"] .team-media, .team-trigger:focus-visible .team-media { top:-14px; }
.team-card:hover .team-glow, .team-card[data-active="true"] .team-glow, .team-trigger:focus-visible .team-glow { opacity:1; transform:scale(1.06); }
.team-flip { position:relative; display:grid; grid-template-areas:"face"; transform-style:preserve-3d; transition:transform 1s cubic-bezier(.3,.8,.2,1); }
.team-card[data-active="true"] .team-flip { transform:rotateY(180deg); }
.team-frame, .team-back { grid-area:face; min-width:0; display:block; overflow:hidden; backface-visibility:hidden; -webkit-backface-visibility:hidden; box-shadow:0 0 42px -8px rgba(63,116,214,.42), 0 26px 58px -34px rgba(2,8,24,.95); transition:box-shadow .9s cubic-bezier(.2,.7,.2,1); }
.team-card:hover .team-frame, .team-card:hover .team-back, .team-card[data-active="true"] .team-back, .team-trigger:focus-visible .team-frame { box-shadow:0 0 66px -6px rgba(63,116,214,.6), 0 44px 88px -36px rgba(4,26,72,.95); }
.team-frame { aspect-ratio:3/4; }
.team-card:not([data-active="true"]) .team-back { height:0; min-height:100%; }
.team-frame img { width:100%; height:100%; object-fit:cover; display:block; filter:grayscale(1) contrast(1.03); transition:filter .85s ease; }
.team-duotone { position:absolute; inset:0; background:linear-gradient(158deg, rgba(210,215,235,.16) 0%, rgba(63,116,214,.4) 46%, rgba(3,70,149,.72) 100%); mix-blend-mode:color; opacity:0; transition:opacity .85s ease; pointer-events:none; }
@media (hover:hover) { .team-card:hover .team-frame img { filter:grayscale(1) contrast(1.02) brightness(1.06); } .team-card:hover .team-duotone { opacity:1; } }
.team-back { transform:rotateY(180deg); background:#072449; display:flex; flex-direction:column; padding:clamp(16px,5.4cqw,32px); }
.team-back-copy { display:flex; flex-direction:column; justify-content:center; gap:clamp(8px,2.2cqw,13px); height:100%; overflow:auto; scrollbar-width:thin; }
.team-back-copy span { display:block; font-size:clamp(11.5px,3.4cqw,15px); line-height:1.46; color:#C6D2EA; text-wrap:pretty; }
@keyframes teamFloat { 0%,100% { transform:translateY(0); } 50% { transform:translateY(-6px); } }
@media (prefers-reduced-motion:reduce) { .team-media { animation:none; } }
@media (max-width:800px) { .services-grid { grid-template-columns:1fr; gap:76px; } .service-item,.service-item:nth-child(even) { margin-top:0; max-width:620px; } .service-item:nth-child(even) { margin-left:clamp(0px,8vw,70px); } .service-item h2 { margin-bottom:20px; } .project-copy { columns:1; margin-top:24px; } .project-images { grid-template-columns:1fr; gap:14px; } .project-images img,.project-images img:first-child:nth-last-child(1),.project-images img:first-child:nth-last-child(2),.project-images img:first-child:nth-last-child(3),.project-images img:nth-child(2):last-child,.project-images img:nth-child(2):nth-last-child(2),.project-images img:nth-child(3):last-child { grid-column:1; margin-top:0; } }
@media (max-width:640px) { .service-item { padding-left:36px; } .service-number { font-size:10px; } .services-grid { gap:62px; } .projects-title { margin-bottom:28px; font-size:clamp(35px,9vw,56px); } .project-card { flex-basis:min(68vw,260px); } .project-card[data-shape="wide"] { flex-basis:min(82vw,330px); } .project-card[data-shape="square"] { flex-basis:min(72vw,280px); } .project-detail h3 { font-size:23px; } .project-close { font-size:12px; }  footer > div:last-of-type { grid-template-columns:1fr !important; } footer > div:last-of-type > div:last-child { text-align:left !important; } }
@media (prefers-reduced-motion:reduce) { .project-detail { animation:none; } .project-cover img { transition:none; } }

@media (max-width:640px) {
  .hero-copy-d { display:none; }
  .hero-copy-m { display:block; }
  header { gap:14px !important; }
  header > span { position:relative; z-index:45; flex:1 1 auto; font-size:12px; letter-spacing:.16em; }
  .nav-toggle { display:flex; }
  .site-nav { position:fixed; inset:0; z-index:40; flex-direction:column !important; align-items:flex-start; justify-content:center; gap:2px !important; padding:0 clamp(20px,6vw,34px); background:#04070e; opacity:0; pointer-events:none; transition:opacity .4s ease; }
  .site-nav[data-open="true"] { opacity:1; pointer-events:auto; }
  .site-nav a { padding:15px 0; font-family:'Unbounded',sans-serif; font-weight:300; font-size:clamp(25px,7.4vw,34px); line-height:1.1; letter-spacing:.03em; }
  .service-number { font-size:12.5px; top:.5em; }
  .projects-controls { justify-content:center; gap:16px; margin-bottom:14px; }
  .projects-controls button { width:46px; height:46px; font-size:19px; }
  .project-caption { font-size:12px; min-height:48px; padding:12px 0 10px; }
  .project-industry { font-size:12px; }
  .project-close { padding:12px 0 12px 16px; font-size:13px; }
  .project-detail { padding-top:clamp(26px,5vw,40px); }
  .team-back { padding:17px 16px; }
  .team-back-copy { overflow:visible; height:auto; gap:10px; }
  .team-back-copy span { font-size:clamp(13.5px,3.4cqw,15px); line-height:1.5; }
  .footer-contact a { display:block; padding:12px 0; }
  .footer-contact { gap:0 !important; }
  .footer-up a { display:inline-block; padding:14px 0; }
  .band-copy { padding:18px 20px; gap:10px 16px; }
}