@font-face {
  font-family: "DM Sans";
  src: url("/assets/dm-sans.ttf") format("truetype");
  font-weight: 100 1000;
  font-display: swap;
}
:root{--paper:#f2efe8;--ink:#1b211f;--accent:#b9df84;--muted:#505b54;--heading:"DM Sans",system-ui,sans-serif;--sans:"Inter",system-ui,sans-serif}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--paper);color:var(--ink);font:16px/1.6 var(--sans)}img{display:block;width:100%}a{color:inherit;text-underline-offset:.25em}a:hover{text-decoration-thickness:2px}a:focus-visible{outline:2px solid currentColor;outline-offset:5px}.skip{position:fixed;top:8px;left:8px;z-index:2;background:white;padding:10px;transform:translateY(-150%)}.skip:focus{transform:none}.wrap{width:min(1280px,calc(100% - 96px));margin-inline:auto}header,footer{display:flex;align-items:center;justify-content:space-between;gap:16px}header{min-height:84px}.brand{width:180px;display:block;aspect-ratio:4/1;overflow:hidden;position:relative}.brand img{position:absolute;width:122%;max-width:none;top:50%;left:50%;transform:translate(-50%,-50%)}nav{display:flex;align-items:center;gap:32px;font-size:14px}nav a{text-decoration:none}nav a:hover{text-decoration:underline}
.hero,.film{background:#18221e;color:var(--paper)}.hero-grid{display:grid;grid-template-columns:1.12fr 1fr;min-height:555px}.intro{padding:75px 22px 68px 0;align-self:center}h1,h2{font-family:var(--heading);font-weight:650;line-height:1.03;letter-spacing:-.045em;margin:0}
h1{font-size:clamp(34px,4.9vw,76px)}
h2{font-size:clamp(33px,4.35vw,66px)}.actions{margin-top:32px;display:flex;align-items:center;gap:24px;flex-wrap:wrap;font-size:14px}.button{background:var(--accent);color:#18221e;font-weight:650;padding:13px 18px;text-decoration:none}.button:hover{background:#d1f0aa}.mosaic{position:relative;display:grid;grid-template-columns:repeat(3,1fr);gap:8px;overflow:hidden;contain:size;isolation:isolate}.mosaic:after{position:absolute;inset:0;content:"";background:linear-gradient(90deg,#18221e,transparent 30%);pointer-events:none}.mosaic > div {
  display: grid;
  grid-template-rows: minmax(0, 1fr) minmax(0, 1fr);
  gap: 8px;
}
.mosaic > div:first-child { grid-template-rows: minmax(0, 43fr) minmax(0, 57fr); }
.mosaic > div:nth-child(2) { grid-template-rows: minmax(0, 59fr) minmax(0, 41fr); }
.mosaic img { height: 100%; min-height: 0; object-fit: cover; }
.services,.contact{padding-block:86px}
.film { padding: clamp(12px, 2vw, 28px); }
.film .wrap { width: min(1440px, 100%); }.service-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:28px;margin-top:38px}.service-grid article{border-top:1px solid #919b8c;padding:18px 0 0}.service-grid p,.contact p{color:var(--muted);margin:8px 0 0}h3{font-family:var(--heading);font-size:19px;font-weight:650;margin:0}.poster-grid{display:grid;grid-template-columns:repeat(6,1fr);gap:clamp(6px, 1vw, 14px)}figure{margin:0}figure img{aspect-ratio:2/3;object-fit:cover;background:#26362f}.contact{display:grid;grid-template-columns:1fr .65fr;align-items:center;gap:30px}.contact a{display:block;width:fit-content;margin-top:10px}footer{border-top:1px solid #969e95;padding-block:21px;font-size:13px}
@media(max-width:850px){.wrap{width:calc(100% - 48px)}.hero-grid{min-height:0}.intro{padding-block:48px}.poster-grid{grid-template-columns:repeat(4,1fr)}}
@media(max-width:620px){.wrap{width:calc(100% - 36px)}header{min-height:66px}.brand{width:110px}nav{gap:12px;font-size:12px}.hero-grid,.service-grid,.contact{grid-template-columns:1fr}.intro{padding:43px 0 48px}.hero h1{font-size:clamp(38px,10.2vw,60px)}.hero .mosaic{display:none}.services,.contact{padding-block:54px}.service-grid{gap:22px;margin-top:27px}.poster-grid{grid-template-columns:repeat(3,1fr)}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}

.visually-hidden{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}

.finance-intro { max-width: 61ch; margin: 22px 0 0; color: var(--muted); }

@media (prefers-reduced-motion: no-preference) {
  .button { transition: background-color 160ms ease, transform 160ms ease; }
  .button:active { transform: scale(.98); }
}

@supports (animation-timeline: view()) and (animation-range: entry 0% entry 55%) {
  @media (prefers-reduced-motion: no-preference) {
    .service-grid article {
      animation: soften-entry linear backwards;
      animation-timeline: view();
      animation-range: entry 0% entry 55%;
    }
  }
}

@keyframes soften-entry {
  from { opacity: .85; }
  to { opacity: 1; }
}

.studio-strip { background: #e7e9df; padding-block: clamp(18px, 3vw, 38px); }
.studio-grid {
  display: grid;
  grid-template-columns: repeat(9, minmax(0, 1fr));
  gap: clamp(8px, 1vw, 15px);
  list-style: none;
  padding: 0;
  margin: 0;
}
.studio-grid li { display: grid; place-items: center; min-width: 0; }
.studio-grid img { width: 100%; max-width: 140px; height: 108px; object-fit: contain; filter: grayscale(1); mix-blend-mode: multiply; }
.studio-grid img[alt="Apple"] { padding-block: 23px; }
.offer-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 32px; }
.offer-grid ul { padding-inline-start: 1.15em; margin: 12px 0 0; color: var(--muted); }
.offer-grid li + li { margin-top: 8px; }

@media (max-width: 850px) {
  .studio-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .studio-grid img { height: 86px; }
  .studio-grid img[alt="Apple"] { padding-block: 18px; }
}

@media (max-width: 620px) {
  .offer-grid { grid-template-columns: 1fr; gap: 22px; }
}

header { position: relative; z-index: 1; }
.desktop-nav a { display: inline-flex; align-items: center; min-height: 44px; }
.mobile-menu { display: none; }
.mobile-menu summary {
  display: flex;
  align-items: center;
  gap: 9px;
  min-height: 44px;
  padding-inline: 8px;
  cursor: pointer;
  list-style: none;
  font-size: 14px;
  font-weight: 600;
}
.mobile-menu summary::-webkit-details-marker { display: none; }
.mobile-menu summary:focus-visible { outline: 2px solid currentColor; outline-offset: 3px; }
.menu-icon { display: block; width: 18px; height: 10px; border-block: 1.5px solid currentColor; }
.mobile-menu nav {
  position: absolute;
  inset: 100% 0 auto;
  display: grid;
  gap: 0;
  padding: 6px 14px;
  background: var(--paper);
  border: 1px solid #929c91;
  box-shadow: 0 12px 24px #18221e26;
}
.mobile-menu nav a { display: flex; align-items: center; min-height: 46px; font-size: 15px; }
.mobile-menu nav a + a { border-top: 1px solid #c8ccc1; }

@media (max-width: 620px) {
  .desktop-nav { display: none; }
  .mobile-menu { display: block; }
}

.site-bar {
  position: sticky;
  top: 0;
  z-index: 2;
  background: var(--paper);
  box-shadow: 0 1px 0 #18221e26;
}
.skip { z-index: 3; }
#main, main section[id] { scroll-margin-top: 84px; }

@media (max-width: 620px) {
  #main, main section[id] { scroll-margin-top: 66px; }
}

.site-bar[data-hidden] { transform: translateY(calc(-100% - 2px)); }
.site-bar[data-hidden]:has(.mobile-menu[open], :focus-visible) { transform: none; }
.site-bar:focus-within:has(:focus-visible) { transition: none; }

@media (prefers-reduced-motion: no-preference) {
  .site-bar { transition: transform 220ms ease; }
}