/* Inter + Inter Display (self-hosted, same files as the home) */
@font-face { font-family: "Inter Display"; src: url("../fonts/2uIBiALfCHVpWbHqRMZutfT7giU.woff2"); font-display: swap; font-style: normal; font-weight: 400; unicode-range: U+0460-052F, U+1C80-1C88, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F }
@font-face { font-family: "Inter Display"; src: url("../fonts/Zwfz6xbVe5pmcWRJRgBDHnMkOkI.woff2"); font-display: swap; font-style: normal; font-weight: 400; unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116 }
@font-face { font-family: "Inter Display"; src: url("../fonts/U9LaDDmbRhzX3sB8g8glTy5feTE.woff2"); font-display: swap; font-style: normal; font-weight: 400; unicode-range: U+1F00-1FFF }
@font-face { font-family: "Inter Display"; src: url("../fonts/tVew2LzXJ1t7QfxP1gdTIdj2o0g.woff2"); font-display: swap; font-style: normal; font-weight: 400; unicode-range: U+0370-03FF }
@font-face { font-family: "Inter Display"; src: url("../fonts/DF7bjCRmStYPqSb945lAlMfCCVQ.woff2"); font-display: swap; font-style: normal; font-weight: 400; unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF }
@font-face { font-family: "Inter Display"; src: url("../fonts/bHYNJqzTyl2lqvmMiRRS6Y16Es.woff2"); font-display: swap; font-style: normal; font-weight: 400; unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2070, U+2074-207E, U+2080-208E, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD }
@font-face { font-family: "Inter Display"; src: url("../fonts/vebZUMjGyKkYsfcY73iwWTzLNag.woff2"); font-display: swap; font-style: normal; font-weight: 400; unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+1EA0-1EF9, U+20AB }
@font-face { font-family: "Inter"; src: url("../fonts/5vvr9Vy74if2I6bQbJvbw7SY1pQ.woff2"); font-display: swap; font-style: normal; font-weight: 400; unicode-range: U+0460-052F, U+1C80-1C88, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F }
@font-face { font-family: "Inter"; src: url("../fonts/EOr0mi4hNtlgWNn9if640EZzXCo.woff2"); font-display: swap; font-style: normal; font-weight: 400; unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116 }
@font-face { font-family: "Inter"; src: url("../fonts/Y9k9QrlZAqio88Klkmbd8VoMQc.woff2"); font-display: swap; font-style: normal; font-weight: 400; unicode-range: U+1F00-1FFF }
@font-face { font-family: "Inter"; src: url("../fonts/OYrD2tBIBPvoJXiIHnLoOXnY9M.woff2"); font-display: swap; font-style: normal; font-weight: 400; unicode-range: U+0370-03FF }
@font-face { font-family: "Inter"; src: url("../fonts/JeYwfuaPfZHQhEG8U5gtPDZ7WQ.woff2"); font-display: swap; font-style: normal; font-weight: 400; unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF }
@font-face { font-family: "Inter"; src: url("../fonts/GrgcKwrN6d3Uz8EwcLHZxwEfC4.woff2"); font-display: swap; font-style: normal; font-weight: 400; unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2070, U+2074-207E, U+2080-208E, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD }
@font-face { font-family: "Inter"; src: url("../fonts/b6Y37FthZeALduNqHicBT6FutY.woff2"); font-display: swap; font-style: normal; font-weight: 400; unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+1EA0-1EF9, U+20AB }
@font-face { font-family: "Inter"; src: url("../fonts/BkDpl4ghaqvMi1btKFyG2tdbec.woff2"); font-display: swap; font-style: normal; font-weight: 300; unicode-range: U+0460-052F, U+1C80-1C88, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F }
@font-face { font-family: "Inter"; src: url("../fonts/zAMK70AQRFSShJgUiaR5IiIhgzk.woff2"); font-display: swap; font-style: normal; font-weight: 300; unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116 }
@font-face { font-family: "Inter"; src: url("../fonts/IETjvc5qzUaRoaruDpPSwCUM8.woff2"); font-display: swap; font-style: normal; font-weight: 300; unicode-range: U+1F00-1FFF }
@font-face { font-family: "Inter"; src: url("../fonts/oLCoaT3ioA0fHdJnWR9W6k7NY.woff2"); font-display: swap; font-style: normal; font-weight: 300; unicode-range: U+0370-03FF }
@font-face { font-family: "Inter"; src: url("../fonts/Sj0PCHQSBjFmEp6NBWg6FNaKc.woff2"); font-display: swap; font-style: normal; font-weight: 300; unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF }
@font-face { font-family: "Inter"; src: url("../fonts/aqiiD4LUKkKzXdjGL5UzHq8bo5w.woff2"); font-display: swap; font-style: normal; font-weight: 300; unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2070, U+2074-207E, U+2080-208E, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD }
@font-face { font-family: "Inter"; src: url("../fonts/H4TfENUY1rh8R9UaSD6vngjJP3M.woff2"); font-display: swap; font-style: normal; font-weight: 300; unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+1EA0-1EF9, U+20AB }
@font-face { font-family: "Inter Display"; src: url("../fonts/I11LrmuBDQZweplJ62KkVsklU5Y.woff2"); font-display: swap; font-style: normal; font-weight: 700; unicode-range: U+0460-052F, U+1C80-1C88, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F }
@font-face { font-family: "Inter Display"; src: url("../fonts/UjFZPDy3qGuDktQM4q9CxhKfIa8.woff2"); font-display: swap; font-style: normal; font-weight: 700; unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116 }
@font-face { font-family: "Inter Display"; src: url("../fonts/8exwVHJy2DhJ4N5prYlVMrEKmQ.woff2"); font-display: swap; font-style: normal; font-weight: 700; unicode-range: U+1F00-1FFF }
@font-face { font-family: "Inter Display"; src: url("../fonts/UTeedEK21hO5jDxEUldzdScUqpg.woff2"); font-display: swap; font-style: normal; font-weight: 700; unicode-range: U+0370-03FF }
@font-face { font-family: "Inter Display"; src: url("../fonts/Ig8B8nzy11hzIWEIYnkg91sofjo.woff2"); font-display: swap; font-style: normal; font-weight: 700; unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF }
@font-face { font-family: "Inter Display"; src: url("../fonts/qITWJ2WdG0wrgQPDb8lvnYnTXDg.woff2"); font-display: swap; font-style: normal; font-weight: 700; unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2070, U+2074-207E, U+2080-208E, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD }
@font-face { font-family: "Inter Display"; src: url("../fonts/qctQFoJqJ9aIbRSIp0AhCQpFxn8.woff2"); font-display: swap; font-style: normal; font-weight: 700; unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+1EA0-1EF9, U+20AB }
@font-face { font-family: "Inter Display"; src: url("../fonts/fXvVh2JeZlehNcEhKHpHH0frSl0.woff2"); font-display: swap; font-style: italic; font-weight: 700; unicode-range: U+0460-052F, U+1C80-1C88, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F }
@font-face { font-family: "Inter Display"; src: url("../fonts/7pScaNeb6M7n2HF2jKemDqzCIr4.woff2"); font-display: swap; font-style: italic; font-weight: 700; unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116 }
@font-face { font-family: "Inter Display"; src: url("../fonts/qS4UjQYyATcVV9rODk0Zx9KhkY8.woff2"); font-display: swap; font-style: italic; font-weight: 700; unicode-range: U+1F00-1FFF }
@font-face { font-family: "Inter Display"; src: url("../fonts/VfD2n20yM7v0hrUEBHEyafsmMBY.woff2"); font-display: swap; font-style: italic; font-weight: 700; unicode-range: U+0370-03FF }
@font-face { font-family: "Inter Display"; src: url("../fonts/4oIO9fB59bn3cKFWz7piCj28z9s.woff2"); font-display: swap; font-style: italic; font-weight: 700; unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF }
@font-face { font-family: "Inter Display"; src: url("../fonts/MzumQQZJQBC6KM1omtmwOtsogtI.woff2"); font-display: swap; font-style: italic; font-weight: 700; unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2070, U+2074-207E, U+2080-208E, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD }
@font-face { font-family: "Inter Display"; src: url("../fonts/F5Lmfd3fCAu7TwiYbI4DLWw4ks.woff2"); font-display: swap; font-style: italic; font-weight: 700; unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+1EA0-1EF9, U+20AB }
@font-face { font-family: "Inter Display"; src: url("../fonts/THWAFHoAcmqLMy81E8hCSdziVKA.woff2"); font-display: swap; font-style: italic; font-weight: 400; unicode-range: U+0460-052F, U+1C80-1C88, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F }
@font-face { font-family: "Inter Display"; src: url("../fonts/sQxGYWDlRkDr0eOKqiNRl6g5rs.woff2"); font-display: swap; font-style: italic; font-weight: 400; unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116 }
@font-face { font-family: "Inter Display"; src: url("../fonts/NNTAT1XAm8ZRkr824inYPkjNeL4.woff2"); font-display: swap; font-style: italic; font-weight: 400; unicode-range: U+1F00-1FFF }
@font-face { font-family: "Inter Display"; src: url("../fonts/P2qr9PAWBt905929rHfxmneMUG0.woff2"); font-display: swap; font-style: italic; font-weight: 400; unicode-range: U+0370-03FF }
@font-face { font-family: "Inter Display"; src: url("../fonts/2BmSa4TZZvFKAZg2DydxTbvKlTU.woff2"); font-display: swap; font-style: italic; font-weight: 400; unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF }
@font-face { font-family: "Inter Display"; src: url("../fonts/P0JCAnd2N1Q6qwTQohre3XmQ.woff2"); font-display: swap; font-style: italic; font-weight: 400; unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2070, U+2074-207E, U+2080-208E, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD }
@font-face { font-family: "Inter Display"; src: url("../fonts/KMFW46iYsEZaUBwXbwPc9nQm71o.woff2"); font-display: swap; font-style: italic; font-weight: 400; unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+1EA0-1EF9, U+20AB }
@font-face { font-family: "Inter Display"; src: url("../fonts/ePuN3mCjzajIHnyCdvKBFiZkyY0.woff2"); font-display: swap; font-style: normal; font-weight: 500; unicode-range: U+0460-052F, U+1C80-1C88, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F }
@font-face { font-family: "Inter Display"; src: url("../fonts/V3j1L0o5vPFKe26Sw4HcpXCfHo.woff2"); font-display: swap; font-style: normal; font-weight: 500; unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116 }
@font-face { font-family: "Inter Display"; src: url("../fonts/F3kdpd2N0cToWV5huaZjjgM.woff2"); font-display: swap; font-style: normal; font-weight: 500; unicode-range: U+1F00-1FFF }
@font-face { font-family: "Inter Display"; src: url("../fonts/0iDmxkizU9goZoclqIqsV5rvETU.woff2"); font-display: swap; font-style: normal; font-weight: 500; unicode-range: U+0370-03FF }
@font-face { font-family: "Inter Display"; src: url("../fonts/r0mv3NegmA0akcQsNFotG32Las.woff2"); font-display: swap; font-style: normal; font-weight: 500; unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF }
@font-face { font-family: "Inter Display"; src: url("../fonts/iwWTDc49ENF2tCHbqlNARXw6Ug.woff2"); font-display: swap; font-style: normal; font-weight: 500; unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2070, U+2074-207E, U+2080-208E, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD }
@font-face { font-family: "Inter Display"; src: url("../fonts/Ii21jnSJkulBKsHHXKlapi7fv9w.woff2"); font-display: swap; font-style: normal; font-weight: 500; unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+1EA0-1EF9, U+20AB }
@font-face { font-family: "Inter"; src: url("../fonts/DpPBYI0sL4fYLgAkX8KXOPVt7c.woff2"); font-display: swap; font-style: normal; font-weight: 700; unicode-range: U+0460-052F, U+1C80-1C88, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F }
@font-face { font-family: "Inter"; src: url("../fonts/4RAEQdEOrcnDkhHiiCbJOw92Lk.woff2"); font-display: swap; font-style: normal; font-weight: 700; unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116 }
@font-face { font-family: "Inter"; src: url("../fonts/1K3W8DizY3v4emK8Mb08YHxTbs.woff2"); font-display: swap; font-style: normal; font-weight: 700; unicode-range: U+1F00-1FFF }
@font-face { font-family: "Inter"; src: url("../fonts/tUSCtfYVM1I1IchuyCwz9gDdQ.woff2"); font-display: swap; font-style: normal; font-weight: 700; unicode-range: U+0370-03FF }
@font-face { font-family: "Inter"; src: url("../fonts/VgYFWiwsAC5OYxAycRXXvhze58.woff2"); font-display: swap; font-style: normal; font-weight: 700; unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF }
@font-face { font-family: "Inter"; src: url("../fonts/syRNPWzAMIrcJ3wIlPIP43KjQs.woff2"); font-display: swap; font-style: normal; font-weight: 700; unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2070, U+2074-207E, U+2080-208E, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD }
@font-face { font-family: "Inter"; src: url("../fonts/GIryZETIX4IFypco5pYZONKhJIo.woff2"); font-display: swap; font-style: normal; font-weight: 700; unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+1EA0-1EF9, U+20AB }
@font-face { font-family: "Inter"; src: url("../fonts/H89BbHkbHDzlxZzxi8uPzTsp90.woff2"); font-display: swap; font-style: italic; font-weight: 700; unicode-range: U+0460-052F, U+1C80-1C88, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F }
@font-face { font-family: "Inter"; src: url("../fonts/u6gJwDuwB143kpNK1T1MDKDWkMc.woff2"); font-display: swap; font-style: italic; font-weight: 700; unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116 }
@font-face { font-family: "Inter"; src: url("../fonts/43sJ6MfOPh1LCJt46OvyDuSbA6o.woff2"); font-display: swap; font-style: italic; font-weight: 700; unicode-range: U+1F00-1FFF }
@font-face { font-family: "Inter"; src: url("../fonts/wccHG0r4gBDAIRhfHiOlq6oEkqw.woff2"); font-display: swap; font-style: italic; font-weight: 700; unicode-range: U+0370-03FF }
@font-face { font-family: "Inter"; src: url("../fonts/WZ367JPwf9bRW6LdTHN8rXgSjw.woff2"); font-display: swap; font-style: italic; font-weight: 700; unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF }
@font-face { font-family: "Inter"; src: url("../fonts/ia3uin3hQWqDrVloC1zEtYHWw.woff2"); font-display: swap; font-style: italic; font-weight: 700; unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2070, U+2074-207E, U+2080-208E, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD }
@font-face { font-family: "Inter"; src: url("../fonts/2A4Xx7CngadFGlVV4xrO06OBHY.woff2"); font-display: swap; font-style: italic; font-weight: 700; unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+1EA0-1EF9, U+20AB }
@font-face { font-family: "Inter"; src: url("../fonts/CfMzU8w2e7tHgF4T4rATMPuWosA.woff2"); font-display: swap; font-style: italic; font-weight: 400; unicode-range: U+0460-052F, U+1C80-1C88, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F }
@font-face { font-family: "Inter"; src: url("../fonts/867QObYax8ANsfX4TGEVU9YiCM.woff2"); font-display: swap; font-style: italic; font-weight: 400; unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116 }
@font-face { font-family: "Inter"; src: url("../fonts/Oyn2ZbENFdnW7mt2Lzjk1h9Zb9k.woff2"); font-display: swap; font-style: italic; font-weight: 400; unicode-range: U+1F00-1FFF }
@font-face { font-family: "Inter"; src: url("../fonts/cdAe8hgZ1cMyLu9g005pAW3xMo.woff2"); font-display: swap; font-style: italic; font-weight: 400; unicode-range: U+0370-03FF }
@font-face { font-family: "Inter"; src: url("../fonts/DOfvtmE1UplCq161m6Hj8CSQYg.woff2"); font-display: swap; font-style: italic; font-weight: 400; unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF }
@font-face { font-family: "Inter"; src: url("../fonts/pKRFNWFoZl77qYCAIp84lN1h944.woff2"); font-display: swap; font-style: italic; font-weight: 400; unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2070, U+2074-207E, U+2080-208E, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD }
@font-face { font-family: "Inter"; src: url("../fonts/tKtBcDnBMevsEEJKdNGhhkLzYo.woff2"); font-display: swap; font-style: italic; font-weight: 400; unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+1EA0-1EF9, U+20AB }
@font-face { font-family: "Inter Display"; src: url("../fonts/A5P4nkYCJlLQxGxaS1lzG8PNSc.woff2"); font-display: swap; font-style: italic; font-weight: 500; unicode-range: U+0460-052F, U+1C80-1C88, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F }
@font-face { font-family: "Inter Display"; src: url("../fonts/vuPfygr1n1zYxscvWgGI8hRf3LE.woff2"); font-display: swap; font-style: italic; font-weight: 500; unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116 }
@font-face { font-family: "Inter Display"; src: url("../fonts/jplzYzqFHXreyADwk9yrkQlWQ.woff2"); font-display: swap; font-style: italic; font-weight: 500; unicode-range: U+1F00-1FFF }
@font-face { font-family: "Inter Display"; src: url("../fonts/sSIKP2TfVPvfK7YVENPE5H87A.woff2"); font-display: swap; font-style: italic; font-weight: 500; unicode-range: U+0370-03FF }
@font-face { font-family: "Inter Display"; src: url("../fonts/gawbeo7iEJSRZ4kcrh6YRrU8o.woff2"); font-display: swap; font-style: italic; font-weight: 500; unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF }
@font-face { font-family: "Inter Display"; src: url("../fonts/RkMAGv2iAm3rw7tZzs7FaZf0rM.woff2"); font-display: swap; font-style: italic; font-weight: 500; unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2070, U+2074-207E, U+2080-208E, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD }
@font-face { font-family: "Inter Display"; src: url("../fonts/8E92vrr3j1gDqzepmeSbD2u0JxA.woff2"); font-display: swap; font-style: italic; font-weight: 500; unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+1EA0-1EF9, U+20AB }
@font-face {font-display:swap; font-family: "Inter"; src: url("../fonts/mkY5Sgyq51ik0AMrSBwhm9DJg.woff2"); font-style: normal; font-weight: 900; unicode-range: U+0460-052F, U+1C80-1C88, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F }
@font-face {font-display:swap; font-family: "Inter"; src: url("../fonts/X5hj6qzcHUYv7h1390c8Rhm6550.woff2"); font-style: normal; font-weight: 900; unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116 }
@font-face {font-display:swap; font-family: "Inter"; src: url("../fonts/gQhNpS3tN86g8RcVKYUUaKt2oMQ.woff2"); font-style: normal; font-weight: 900; unicode-range: U+1F00-1FFF }
@font-face {font-display:swap; font-family: "Inter"; src: url("../fonts/cugnVhSraaRyANCaUtI5FV17wk.woff2"); font-style: normal; font-weight: 900; unicode-range: U+0370-03FF }
@font-face {font-display:swap; font-family: "Inter"; src: url("../fonts/5HcVoGak8k5agFJSaKa4floXVu0.woff2"); font-style: normal; font-weight: 900; unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF }
@font-face {font-display:swap; font-family: "Inter"; src: url("../fonts/rZ5DdENNqIdFTIyQQiP5isO7M.woff2"); font-style: normal; font-weight: 900; unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2070, U+2074-207E, U+2080-208E, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD }
@font-face {font-display:swap; font-family: "Inter"; src: url("../fonts/P2Bw01CtL0b9wqygO0sSVogWbo.woff2"); font-style: normal; font-weight: 900; unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+1EA0-1EF9, U+20AB }
@font-face {font-display:swap; font-family: "Inter"; src: url("../fonts/05KsVHGDmqXSBXM4yRZ65P8i0s.woff2"); font-style: italic; font-weight: 900; unicode-range: U+0460-052F, U+1C80-1C88, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F }
@font-face {font-display:swap; font-family: "Inter"; src: url("../fonts/ky8ovPukK4dJ1Pxq74qGhOqCYI.woff2"); font-style: italic; font-weight: 900; unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116 }
@font-face {font-display:swap; font-family: "Inter"; src: url("../fonts/vvNSqIj42qeQ2bvCRBIWKHscrc.woff2"); font-style: italic; font-weight: 900; unicode-range: U+1F00-1FFF }
@font-face {font-display:swap; font-family: "Inter"; src: url("../fonts/3ZmXbBKToJifDV9gwcifVd1tEY.woff2"); font-style: italic; font-weight: 900; unicode-range: U+0370-03FF }
@font-face {font-display:swap; font-family: "Inter"; src: url("../fonts/FNfhX3dt4ChuLJq2PwdlxHO7PU.woff2"); font-style: italic; font-weight: 900; unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF }
@font-face {font-display:swap; font-family: "Inter"; src: url("../fonts/gcnfba68tfm7qAyrWRCf9r34jg.woff2"); font-style: italic; font-weight: 900; unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2070, U+2074-207E, U+2080-208E, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD }
@font-face {font-display:swap; font-family: "Inter"; src: url("../fonts/efTfQcBJ53kM2pB1hezSZ3RDUFs.woff2"); font-style: italic; font-weight: 900; unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+1EA0-1EF9, U+20AB }
@font-face { font-family: "Inter Display"; src: url("../fonts/MaMAn5Jp5gJg1z3VaLH65QwWPLc.woff2"); font-display: swap; font-style: normal; font-weight: 300; unicode-range: U+0460-052F, U+1C80-1C88, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F }
@font-face { font-family: "Inter Display"; src: url("../fonts/fEqgEChcTaneQFxeugexHq7Bk.woff2"); font-display: swap; font-style: normal; font-weight: 300; unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116 }
@font-face { font-family: "Inter Display"; src: url("../fonts/nL7d8Ph0ViwUQorApF89PoAagQI.woff2"); font-display: swap; font-style: normal; font-weight: 300; unicode-range: U+1F00-1FFF }
@font-face { font-family: "Inter Display"; src: url("../fonts/YOHXUQlY1iC2t7qT4HeLSoBDtn4.woff2"); font-display: swap; font-style: normal; font-weight: 300; unicode-range: U+0370-03FF }
@font-face { font-family: "Inter Display"; src: url("../fonts/TfzHIi6ZmZDuhnIFGcgM6Ipuim4.woff2"); font-display: swap; font-style: normal; font-weight: 300; unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF }
@font-face { font-family: "Inter Display"; src: url("../fonts/CnMzVKZxLPB68RITfNGUfLe65m4.woff2"); font-display: swap; font-style: normal; font-weight: 300; unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2070, U+2074-207E, U+2080-208E, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD }
@font-face { font-family: "Inter Display"; src: url("../fonts/ub5XwqqEAMrXQz31ej6fNqbxnBc.woff2"); font-display: swap; font-style: normal; font-weight: 300; unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+1EA0-1EF9, U+20AB }
@font-face { font-family: "Inter Display"; src: url("../fonts/JVGAsgKKXCCsDQ3MCrxIs5u1U.woff2"); font-display: swap; font-style: italic; font-weight: 300; unicode-range: U+0460-052F, U+1C80-1C88, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F }
@font-face { font-family: "Inter Display"; src: url("../fonts/GeFYhvsobZhw8u0Xza2zCmC8Cw.woff2"); font-display: swap; font-style: italic; font-weight: 300; unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116 }
@font-face { font-family: "Inter Display"; src: url("../fonts/8dxmIktsyEgZt0OloSu5gz6TgLI.woff2"); font-display: swap; font-style: italic; font-weight: 300; unicode-range: U+1F00-1FFF }
@font-face { font-family: "Inter Display"; src: url("../fonts/f2kclCrwmFV8YeznrosrT3kcjE.woff2"); font-display: swap; font-style: italic; font-weight: 300; unicode-range: U+0370-03FF }
@font-face { font-family: "Inter Display"; src: url("../fonts/HTPyW5jOpXfwIja9CrgNJUDriY4.woff2"); font-display: swap; font-style: italic; font-weight: 300; unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF }
@font-face { font-family: "Inter Display"; src: url("../fonts/raPlI8zqlyoXu4yBGiiecGg2dI.woff2"); font-display: swap; font-style: italic; font-weight: 300; unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2070, U+2074-207E, U+2080-208E, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD }
@font-face { font-family: "Inter Display"; src: url("../fonts/xFtzow8wtMpaEQuIGgCbt25Qorg.woff2"); font-display: swap; font-style: italic; font-weight: 300; unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+1EA0-1EF9, U+20AB }/* =====================================================================
   MAFE STUDIO — Design system
   Same visual language as the home (Framer "Miles" template):
   Inter Display, black canvas, uppercase labels, hairlines, giant type.
   ===================================================================== */

@font-face{font-family:"Instrument Serif";font-style:normal;font-weight:400;font-display:swap;src:url(../fonts/instrument-serif-latin.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Instrument Serif";font-style:normal;font-weight:400;font-display:swap;src:url(../fonts/instrument-serif-latin-ext.woff2) format("woff2");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:"Instrument Serif";font-style:italic;font-weight:400;font-display:swap;src:url(../fonts/instrument-serif-italic-latin.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Instrument Serif";font-style:italic;font-weight:400;font-display:swap;src:url(../fonts/instrument-serif-italic-latin-ext.woff2) format("woff2");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}

:root{
  --mark:none;--mark-h:invert(1);
  --bg:#000;--fg:#fff;--muted:rgba(255,255,255,.6);--faint:rgba(255,255,255,.35);--line:rgba(255,255,255,.12);
  --pad:20px;--gap:20px;--nav-h:45px;
  --ease:cubic-bezier(.22,1,.36,1);--ease-io:cubic-bezier(.65,0,.35,1);
  --f-display:"Inter Display","Inter Display Placeholder","Inter",-apple-system,BlinkMacSystemFont,"Segoe UI",Helvetica,Arial,sans-serif;
  --f-sans:"Inter","Inter Placeholder",-apple-system,BlinkMacSystemFont,"Segoe UI",Helvetica,Arial,sans-serif;
  --f-serif:"Instrument Serif","Times New Roman",Georgia,serif;
  --media:#111;--cta-bg:#fff;--cta-fg:#000;
  color-scheme:dark;
}
html[data-theme="light"]{--mark:invert(1);--mark-h:none;--bg:#fff;--fg:#000;--muted:rgba(0,0,0,.6);--faint:rgba(0,0,0,.38);--line:rgba(0,0,0,.12);--media:#ececec;--cta-bg:#000;--cta-fg:#fff;color-scheme:light}
html[data-theme="light"] .is-light{--mark:none;--mark-h:invert(1);--bg:#000;--fg:#fff;--muted:rgba(255,255,255,.6);--faint:rgba(255,255,255,.38);--line:rgba(255,255,255,.12);--media:#111}
::view-transition-old(root),::view-transition-new(root){animation:none;mix-blend-mode:normal}
@media (max-width:809.98px){:root{--pad:15px;--gap:15px;--nav-h:55px}}

*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{background:var(--bg);color:var(--fg);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-rendering:optimizeLegibility;-webkit-text-size-adjust:100%}
html.lenis,html.lenis body{height:auto}
.lenis.lenis-smooth{scroll-behavior:auto!important}
.lenis.lenis-stopped{overflow:hidden}
body{font-family:var(--f-display);font-weight:500;font-size:14px;line-height:1.16;background:var(--bg);color:var(--fg);overflow-x:clip;min-height:100vh}
img,video,svg{display:block;max-width:100%}
img{height:auto}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit;background:none;border:0;cursor:pointer}
::selection{background:var(--fg);color:var(--bg)}
:focus-visible{outline:1px solid currentColor;outline-offset:4px}
.sr-only{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.skip{position:fixed;left:var(--pad);top:-60px;z-index:300;background:#fff;color:#000;padding:10px 14px}
.skip:focus{top:10px}

/* ------------------------------------------------------------ type */
.label{font-family:var(--f-display);font-weight:500;font-size:14px;line-height:1.1;letter-spacing:.01em;text-transform:uppercase}
.muted{color:var(--muted)}
.t-body{font-size:14px;line-height:1.16;color:var(--muted)}
.t-text{font-size:16px;line-height:1.45;font-weight:400;color:var(--muted);letter-spacing:-.005em}
.t-lead{font-size:24px;line-height:1.2;font-weight:400;letter-spacing:-.01em}
.t-lead--indent{text-indent:4.2em}
.t-h3{font-size:32px;line-height:1.1;font-weight:400;letter-spacing:-.03em}
.t-h2{font-size:clamp(40px,6.4vw,104px);line-height:.9;font-weight:400;letter-spacing:-.05em}
.t-h1{font-size:clamp(56px,11vw,190px);line-height:.82;font-weight:400;letter-spacing:-.06em;text-transform:uppercase}
.t-display{font-weight:400;line-height:.8;letter-spacing:-.06em;text-transform:uppercase;white-space:nowrap}
.t-serif{font-family:var(--f-serif);font-weight:400;letter-spacing:-.02em;text-transform:none}
.upper{text-transform:uppercase}
@media (max-width:809.98px){.t-lead{font-size:20px}.t-h3{font-size:26px}.t-lead--indent{text-indent:2.4em}}

/* ------------------------------------------------------------ layout */
.wrap{padding-left:var(--pad);padding-right:var(--pad)}
.grid{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--gap)}
.section{position:relative;padding:160px var(--pad)}
.section--tight{padding-top:100px;padding-bottom:100px}
.section--flush{padding-top:0}
.section__head{grid-column:1 / span 4;display:flex;flex-direction:column;gap:14px;align-self:start}
.section__head .t-body{max-width:340px}
.section__body{grid-column:6 / -1}
.section__body--wide{grid-column:5 / -1}
.is-light{--mark:invert(1);--mark-h:none;--bg:#fff;--fg:#000;--muted:rgba(0,0,0,.6);--faint:rgba(0,0,0,.35);--line:rgba(0,0,0,.12);background:var(--bg);color:var(--fg)}
.hr{height:1px;background:var(--line);border:0}
.plus{position:absolute;width:13px;height:13px;pointer-events:none}
.plus::before,.plus::after{content:"";position:absolute;background:currentColor}
.plus::before{left:6px;top:0;width:1px;height:13px}
.plus::after{top:6px;left:0;height:1px;width:13px}
.plus--tl{left:var(--pad);top:20px}.plus--tr{right:var(--pad);top:20px}
.plus--bl{left:var(--pad);bottom:20px}.plus--br{right:var(--pad);bottom:20px}
@media (max-width:1199.98px){.section{padding-top:120px;padding-bottom:120px}}
@media (max-width:809.98px){
  .section{padding-top:64px;padding-bottom:64px}
  .section--tight{padding-top:48px;padding-bottom:48px}
  .section__head,.section__body,.section__body--wide{grid-column:1 / -1}
  .section__head{margin-bottom:40px}
}

/* header, phone menu and hover roll: see header.css (shared with the home) */

/* ------------------------------------------------------------ page hero */
.hero{position:relative;min-height:100svh;padding:calc(var(--nav-h) + 40px) var(--pad) 24px;display:flex;flex-direction:column;justify-content:flex-end;gap:32px;overflow:hidden}
.hero__title{font-size:20vw}
.hero__title .line{display:block;overflow:hidden;padding-bottom:.02em}
.hero__row{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--gap);align-items:end}
.hero__intro{grid-column:7 / span 4;color:var(--muted);font-size:14px;line-height:1.16;text-indent:4.2em;max-width:360px}
.hero__intro--lg{grid-column:6 / -1;color:var(--fg);font-size:24px;line-height:1.2;font-weight:400;letter-spacing:-.01em;max-width:none}
.hero__meta{grid-column:1 / span 4;display:flex;flex-direction:column;gap:6px}
.hero__scroll{grid-column:12;justify-self:end}
.hero__bg{position:absolute;inset:0;z-index:-1}
.hero__bg img,.hero__bg video{width:100%;height:100%;object-fit:cover}
.hero__bg::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,.2),rgba(0,0,0,.65))}
@media (max-width:1199.98px){.hero__intro{grid-column:6 / span 6}.hero__intro--lg{grid-column:4 / -1}}
@media (max-width:809.98px){
  .hero{min-height:88svh;gap:24px}
  .hero__row{row-gap:22px}
  .hero__intro,.hero__intro--lg{grid-column:1 / -1}
  .hero__meta{grid-column:1 / span 10}.hero__scroll{grid-column:12}
}

/* ------------------------------------------------------------ media */
.media{position:relative;overflow:hidden;background:var(--media)}
.is-light .media{background:#eee}
html[data-theme="light"] .is-light .media{background:#111}
.media img,.media video{width:100%;height:100%;object-fit:cover}
.media--contain img{object-fit:contain}
.ratio-16x9{aspect-ratio:16/9}.ratio-16x10{aspect-ratio:16/10}.ratio-4x5{aspect-ratio:4/5}.ratio-3x4{aspect-ratio:3/4}.ratio-1{aspect-ratio:1}.ratio-21x9{aspect-ratio:21/9}
[data-parallax]{will-change:transform}
.band{position:relative;height:88vh;min-height:520px;overflow:hidden}
.band>.media{position:absolute;inset:0}
.band [data-parallax]{position:absolute;inset:-10% 0;height:120%}
.band__caption{position:absolute;left:var(--pad);bottom:24px;z-index:2;color:#fff;mix-blend-mode:difference}
@media (max-width:809.98px){.band{height:64vh;min-height:380px}}

/* ------------------------------------------------------------ project cards */
.card{display:block;position:relative}
.card .media img{transition:transform 1.3s var(--ease),filter .6s var(--ease)}
.card:hover .media img{transform:scale(1.06);filter:brightness(.82)}
.card__cap{display:grid;grid-template-columns:1fr auto;gap:4px 20px;padding-top:12px;align-items:baseline}
.card__title{font-size:24px;line-height:1.1;font-weight:400;letter-spacing:-.02em}
.card__meta{color:var(--muted);text-align:right}
.card__sub{grid-column:1 / -1;color:var(--muted)}
.card--overlay .card__cap{position:absolute;inset:0;padding:20px;display:flex;justify-content:space-between;align-items:center;color:#fff;pointer-events:none}
.card--overlay .card__title{font-size:32px}
.card--overlay .card__meta{max-width:200px;color:#fff;text-align:left}
.works{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:80px var(--gap)}
.works>*{grid-column:span 6}
.works>.w-7{grid-column:span 7}.works>.w-5{grid-column:span 5}.works>.w-8{grid-column:span 8}.works>.w-4{grid-column:span 4}
.works>.w-12{grid-column:1 / -1}.works>.w-off{margin-top:22vh}
@media (max-width:809.98px){.works{gap:50px var(--gap)}.works>*,.works>[class*="w-"]{grid-column:1 / -1;margin-top:0}}

/* ------------------------------------------------------------ filters */
.filters{display:flex;flex-wrap:wrap;gap:8px 8px;align-items:center}
.chip{border:1px solid var(--line);border-radius:999px;padding:9px 14px 8px;font-size:12px;letter-spacing:.01em;text-transform:uppercase;transition:background .3s,color .3s,border-color .3s}
.chip:hover{border-color:var(--fg)}
.chip[aria-pressed="true"]{background:var(--fg);color:var(--bg);border-color:var(--fg)}
.card.is-hidden{display:none}

/* ------------------------------------------------------------ rows / tables */
.rows{border-bottom:1px solid var(--line)}
.row{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--gap);align-items:baseline;padding:16px 0;border-top:1px solid var(--line);position:relative}
.row--head{padding:10px 0;color:var(--muted)}
.row--link{transition:padding .5s var(--ease)}
.row--link:hover{padding-left:14px}
.row .c-1{grid-column:span 1}.row .c-2{grid-column:span 2}.row .c-3{grid-column:span 3}.row .c-4{grid-column:span 4}
.row .c-5{grid-column:span 5}.row .c-6{grid-column:span 6}.row .c-7{grid-column:span 7}.row .c-8{grid-column:span 8}
.row .end{text-align:right}
.row .big{font-size:32px;line-height:1.1;font-weight:400;letter-spacing:-.03em}
@media (max-width:809.98px){.row{row-gap:6px}.row [class*="c-"]{grid-column:1 / -1}.row .end{text-align:left}.row .big{font-size:26px}}

/* numbered blocks (phases / advantages) */
.steps{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 var(--gap)}
.step-item{border-top:1px solid var(--line);padding:22px 0 60px;display:grid;grid-template-columns:80px 1fr;gap:10px 20px}
.step-item__n{color:var(--muted)}
.step-item h3{margin-bottom:14px}
.step-item p{grid-column:2;max-width:520px}
@media (max-width:809.98px){.steps{grid-template-columns:1fr}.step-item{grid-template-columns:48px 1fr;padding-bottom:40px}}

/* sticky service stack */
.stack{display:flex;flex-direction:column}
.stack__item{position:sticky;top:var(--nav-h);background:var(--bg);border-top:1px solid var(--line);padding:28px 0 90px;display:grid;grid-template-columns:repeat(8,minmax(0,1fr));column-gap:var(--gap)}
.stack__item h3{grid-column:1 / span 5;text-transform:uppercase}
.stack__item .t-body{grid-column:6 / -1;padding-top:6px}
.stack__tags{grid-column:4 / -1;margin-top:70px;display:grid;grid-template-columns:1fr 1fr;column-gap:var(--gap)}
.stack__tags span{border-top:1px solid var(--line);padding:6px 0 7px;text-transform:uppercase;font-size:12px}
.stack__link{grid-column:1 / span 3;align-self:end;margin-top:70px}
@media (max-width:809.98px){
  .stack__item{grid-template-columns:1fr;row-gap:14px;padding-bottom:60px}
  .stack__item h3,.stack__item .t-body,.stack__tags,.stack__link{grid-column:1 / -1}
  .stack__tags,.stack__link{margin-top:24px}
}

/* ------------------------------------------------------------ buttons */
/* .btn: see "buttons" in mafe.extra.css */
.link-arrow{display:inline-flex;gap:6px;align-items:baseline;border-bottom:1px solid var(--line);padding-bottom:3px;transition:border-color .3s}
.link-arrow:hover{border-color:var(--fg)}

/* ------------------------------------------------------------ marquee */
.marquee{overflow:hidden;white-space:nowrap;display:flex;user-select:none}
.marquee__track{display:flex;flex:none;gap:var(--m-gap,80px);padding-right:var(--m-gap,80px);will-change:transform}
.marquee__track>*{flex:none}
.clients .marquee__track{--m-gap:120px}
.clients .marquee__track span{font-family:var(--f-sans);font-weight:300;font-size:44px;letter-spacing:-.02em}
@media (max-width:809.98px){.clients .marquee__track span{font-size:30px}}

/* ------------------------------------------------------------ CTA + footer */
.cta{padding:180px var(--pad) 140px;text-align:center;display:flex;flex-direction:column;align-items:center;gap:44px}
.cta__title{font-size:clamp(48px,9vw,150px);line-height:.88;letter-spacing:-.055em;font-weight:400;max-width:12ch}
.footer{position:relative;padding-top:10px;overflow:hidden}
.footer__name{font-size:22vw;line-height:.8;letter-spacing:-.06em;text-transform:uppercase;font-weight:400;--m-gap:6vw}
.footer__name .dot{display:inline-block;width:.16em;height:.16em;border-radius:50%;background:currentColor;vertical-align:middle;margin:0 .02em .1em}
.footer__grid{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--gap);padding:34px var(--pad) 40px}
.footer__col{display:flex;flex-direction:column;gap:4px}
.footer__col .label{color:var(--muted);font-size:12px;margin-bottom:10px}
.footer__contact{grid-column:1 / span 5;font-size:32px;line-height:1.1;letter-spacing:-.03em;font-weight:400}
.footer__nav{grid-column:7 / span 2}.footer__sec{grid-column:9 / span 2}.footer__soc{grid-column:11 / span 2}
.footer__col a{width:max-content}
.footer__bar{display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap;padding:18px var(--pad) 22px;border-top:1px solid var(--line);color:var(--muted);font-size:12px;text-transform:uppercase;letter-spacing:.01em}
.footer__bar a:hover{color:var(--fg)}
@media (max-width:1199.98px){.footer__contact{grid-column:1 / -1;margin-bottom:50px}.footer__nav{grid-column:1 / span 4}.footer__sec{grid-column:5 / span 4}.footer__soc{grid-column:9 / span 4}}
@media (max-width:809.98px){.footer__contact{font-size:24px}.footer__nav,.footer__sec{grid-column:span 6;margin-bottom:34px}.footer__soc{grid-column:1 / -1}.cta{padding:120px var(--pad) 100px}}

/* ------------------------------------------------------------ forms */
.form{display:flex;flex-direction:column;gap:34px}
.field{display:flex;flex-direction:column;gap:10px}
.field label,.form .form-subtitle{font-size:12px;text-transform:uppercase;letter-spacing:.01em;color:var(--muted);font-weight:500}
.input,.form input[type=text],.form input[type=email],.form input[type=tel],.form input[type=url],.form textarea{width:100%;background:none;border:0;border-bottom:1px solid var(--line);color:var(--fg);font:400 24px/1.2 var(--f-display);letter-spacing:-.01em;padding:8px 0 14px;border-radius:0;transition:border-color .3s;-webkit-appearance:none;appearance:none}
.form textarea{min-height:130px;resize:vertical}
.form input::placeholder,.form textarea::placeholder{color:var(--faint)}
.form input:focus,.form textarea:focus{outline:0;border-color:var(--fg)}
.pills{display:flex;flex-wrap:wrap;gap:8px}
.pills input{position:absolute;opacity:0;pointer-events:none}
.pills span{display:inline-block;border:1px solid var(--line);border-radius:999px;padding:10px 16px 9px;font-size:14px;cursor:pointer;transition:background .3s,color .3s,border-color .3s}
.pills label:hover span{border-color:var(--fg)}
.pills input:checked+span{background:var(--fg);color:var(--bg);border-color:var(--fg)}
.pills input:focus-visible+span{outline:1px solid var(--fg);outline-offset:3px}
.form-note{font-size:12px;color:var(--muted);line-height:1.4}
.form-note a{text-decoration:underline}

/* ------------------------------------------------------------ case study */
.case-meta{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--gap);border-top:1px solid var(--line);padding-top:12px}
.case-meta>div{grid-column:span 3;display:flex;flex-direction:column;gap:6px}
.case-meta>div:last-child{grid-column:span 3}
.case-meta dt{color:var(--muted)}
.eco{display:flex;flex-wrap:wrap;gap:6px}
.eco a{border:1px solid var(--line);border-radius:999px;padding:6px 11px 5px;font-size:12px;text-transform:uppercase;transition:background .3s,color .3s}
.eco a:hover{background:var(--fg);color:var(--bg)}
.chapter{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--gap);row-gap:40px;align-items:start}
.chapter__text{grid-column:1 / span 4;position:sticky;top:calc(var(--nav-h) + 30px);display:flex;flex-direction:column;gap:18px}
.chapter__media{grid-column:6 / -1}
.chapter--full .chapter__text{position:static;grid-column:1 / span 5}
.chapter--full .chapter__media{grid-column:1 / -1}
.chapter--full .chapter__aside{grid-column:7 / -1;align-self:end}
@media (max-width:809.98px){.case-meta>div,.case-meta>div:last-child{grid-column:span 6;margin-bottom:18px}.chapter__text,.chapter--full .chapter__text,.chapter__media,.chapter--full .chapter__aside{grid-column:1 / -1;position:static}}
.specimen{font-size:17vw;line-height:.84;letter-spacing:-.05em;white-space:nowrap}
.specimen--sans{font-family:var(--f-display);text-transform:uppercase;letter-spacing:-.06em}
.specimen--serif{font-family:var(--f-serif);letter-spacing:-.03em}
.glyphs{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--gap);border-top:1px solid var(--line);padding-top:12px;margin-top:40px}
.glyphs>div{grid-column:span 4}
.glyphs .big{font-size:120px;line-height:1}
@media (max-width:809.98px){.glyphs>div{grid-column:1 / -1;margin-bottom:24px}.glyphs .big{font-size:84px}}
.palette{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));height:62vh;min-height:360px}
.swatch{position:relative;display:flex;flex-direction:column;justify-content:space-between;padding:18px;text-align:left;transition:flex .6s var(--ease)}
.swatch span{font-size:14px;text-transform:uppercase}
.swatch small{font-size:12px;opacity:.7}
.swatch .copied{position:absolute;right:18px;top:18px;font-size:12px;opacity:0;transition:opacity .3s}
.swatch.is-copied .copied{opacity:1}
@media (max-width:809.98px){.palette{grid-template-columns:1fr 1fr;height:auto}.swatch{aspect-ratio:1}}
.next{position:relative;display:block;overflow:hidden;padding:120px var(--pad) 40px;border-top:1px solid var(--line)}
.next__bg{position:absolute;inset:0;opacity:0;transform:scale(1.08);transition:opacity .8s var(--ease),transform 1.4s var(--ease)}
.next__bg img{width:100%;height:100%;object-fit:cover;filter:brightness(.55)}
.next:hover .next__bg{opacity:1;transform:none}
.next:hover{color:#fff}
.next__inner{position:relative;display:flex;flex-direction:column;gap:18px}
.next__name{font-size:14vw;line-height:.82;letter-spacing:-.06em;text-transform:uppercase;font-weight:400}

/* ------------------------------------------------------------ misc components */
.pillars{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:var(--gap)}
.pillar{border-top:1px solid var(--line);padding-top:14px;display:flex;flex-direction:column;gap:14px}
.pillar h3{font-size:24px;line-height:1.1;font-weight:400;letter-spacing:-.02em}
@media (max-width:1199.98px){.pillars{grid-template-columns:repeat(2,minmax(0,1fr));row-gap:50px}}
@media (max-width:809.98px){.pillars{grid-template-columns:1fr;row-gap:40px}}
.statement{font-size:clamp(34px,4.6vw,72px);line-height:1;letter-spacing:-.045em;font-weight:400}
.statement em{font-family:var(--f-serif);font-style:italic;letter-spacing:-.02em}
.included{display:flex;flex-wrap:wrap;gap:10px}
.included li{list-style:none;border:1px solid var(--line);border-radius:999px;padding:12px 18px 11px;font-size:16px}
.contact-list{display:flex;flex-direction:column}
.contact-list a,.contact-list p{font-size:clamp(28px,3.4vw,52px);line-height:1.05;letter-spacing:-.04em;font-weight:400}
.legal h2{font-size:24px;font-weight:400;letter-spacing:-.01em;margin:50px 0 12px}
.legal p,.legal li{font-size:16px;line-height:1.55;font-weight:400;color:var(--muted);max-width:720px}
.legal ul{padding-left:18px;margin-top:8px}
.legal a{color:var(--fg);text-decoration:underline}

/* ------------------------------------------------------------ motion primitives */
.js [data-reveal]{opacity:0;transform:translateY(28px);transition:opacity 1s var(--ease),transform 1.1s var(--ease);transition-delay:var(--d,0s)}
.js [data-reveal].is-in{opacity:1;transform:none}
.js [data-reveal="fade"]{transform:none}
.js [data-reveal="clip"]{opacity:1;transform:none;clip-path:inset(12% 0 12% 0);transition:clip-path 1.4s var(--ease)}
.js [data-reveal="clip"] img{transform:scale(1.18);transition:transform 1.8s var(--ease)}
.js [data-reveal="clip"].is-in{clip-path:inset(0 0 0 0)}
.js [data-reveal="clip"].is-in img{transform:none}
.js [data-reveal="line"]{opacity:1;transform:scaleX(0);transform-origin:left;transition:transform 1.4s var(--ease-io)}
.js [data-reveal="line"].is-in{transform:none}
.split-w{display:inline-block;overflow:hidden;vertical-align:top;padding-bottom:.08em;margin-bottom:-.08em}
.split-w>span{display:inline-block;transform:translateY(105%);transition:transform 1.1s var(--ease);transition-delay:calc(var(--i,0) * 45ms + var(--d,0s))}
.is-in .split-w>span,.split-w.is-in>span{transform:none}
.no-js .split-w>span{transform:none}

/* page transition + cursor */
.pt{position:fixed;inset:0;z-index:250;background:var(--bg);pointer-events:none;opacity:1;transition:opacity .6s var(--ease)}
.pt.is-off{opacity:0}
.pt.is-on{opacity:1;pointer-events:all}
.cursor{position:fixed;left:0;top:0;z-index:260;pointer-events:none;width:10px;height:10px;margin:-5px 0 0 -5px;border-radius:50%;background:#fff;mix-blend-mode:difference;transition:width .35s var(--ease),height .35s var(--ease),margin .35s var(--ease),opacity .3s;opacity:0}
.cursor.is-on{opacity:1}
.cursor.is-link{width:44px;height:44px;margin:-22px 0 0 -22px}
.cursor.is-label{width:92px;height:92px;margin:-46px 0 0 -46px;mix-blend-mode:normal;display:grid;place-items:center;background:var(--fg)}
.cursor__txt{font:500 12px/1 var(--f-display);text-transform:uppercase;letter-spacing:.02em;color:var(--bg);opacity:0;transition:opacity .25s}
.cursor.is-label .cursor__txt{opacity:1}
@media (hover:none),(pointer:coarse){.cursor{display:none}}
.preview{position:fixed;left:0;top:0;z-index:80;width:280px;aspect-ratio:4/5;pointer-events:none;overflow:hidden;opacity:0;transform:scale(.85);transition:opacity .35s var(--ease),transform .5s var(--ease)}
.preview.is-on{opacity:1;transform:none}
.preview img{width:100%;height:100%;object-fit:cover}
@media (hover:none),(pointer:coarse){.preview{display:none}}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{transition-duration:.01ms!important;animation-duration:.01ms!important;transition-delay:0s!important}
  .js [data-reveal],.split-w>span{opacity:1!important;transform:none!important;clip-path:none!important}
}

/* ------------------------------------------------------------ hero line reveal */
.line{display:block;overflow:hidden;padding:.14em 0 .03em;margin-top:-.14em}
.split-w,.split-w>span{text-indent:0}
.js .hero__title .line__in,.js .reveal-lines .line__in{display:inline-block;transform:translateY(105%);transition:transform 1.35s var(--ease);transition-delay:calc(var(--l,0) * .1s + .2s)}
.js .hero__title.is-in .line__in,.js .reveal-lines.is-in .line__in{transform:none}
.line__in{display:inline-block}

/* projects page: two-column editorial grid with a staggered second column */
.works--2>.card{grid-column:span 6}
.works--2>.card:nth-child(2n of :not(.is-hidden)){margin-top:18vh}
.works--3>.card{grid-column:span 4}
.works--3>.card:nth-child(3n+2 of :not(.is-hidden)){margin-top:12vh}
@media (max-width:1199.98px){.works--3>.card{grid-column:span 6}.works--3>.card:nth-child(3n+2 of :not(.is-hidden)){margin-top:0}.works--3>.card:nth-child(2n of :not(.is-hidden)){margin-top:10vh}}
@media (max-width:809.98px){.works--2>.card,.works--3>.card{grid-column:1 / -1;margin-top:0!important}}
.filterbar{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--gap);row-gap:14px;align-items:center;padding:14px var(--pad);border-top:1px solid var(--line);border-bottom:1px solid var(--line);margin-bottom:60px}
.filterbar>.label{grid-column:span 1;color:var(--muted)}
.filterbar>.filters{grid-column:span 5}
.filterbar>.count{grid-column:span 12;display:none}
@media (max-width:1199.98px){.filterbar>.label{grid-column:span 2}.filterbar>.filters{grid-column:span 10}}
@media (max-width:809.98px){.filterbar>.label,.filterbar>.filters{grid-column:1 / -1}}
.empty{padding:40px var(--pad);color:var(--muted)}

/* index rows (brands) */
.index-row{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--gap);align-items:baseline;padding:14px 0 13px;border-top:1px solid var(--line);transition:padding .5s var(--ease),color .3s}
.index-row .n{grid-column:span 1;color:var(--muted)}
.index-row .name{grid-column:span 5;font-size:32px;line-height:1.05;letter-spacing:-.03em;font-weight:400}
.index-row .cat{grid-column:span 4;color:var(--muted)}
.index-row .yr{grid-column:span 2;text-align:right}
.index-row:hover{padding-left:16px}
.index:hover .index-row{color:var(--faint)}
.index:hover .index-row:hover{color:var(--fg)}
.index{border-bottom:1px solid var(--line)}
@media (max-width:809.98px){.index-row .n{grid-column:span 2}.index-row .name{grid-column:span 10;font-size:24px}.index-row .cat{grid-column:3 / span 7}.index-row .yr{grid-column:span 3}}

/* team / facts */
.facts{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:var(--gap)}
.facts>div{border-top:1px solid var(--line);padding-top:12px;display:flex;flex-direction:column;gap:22px}
.facts .v{font-size:32px;line-height:1.05;letter-spacing:-.03em;font-weight:400}
@media (max-width:1199.98px){.facts{grid-template-columns:repeat(2,minmax(0,1fr));row-gap:40px}}
@media (max-width:809.98px){.facts .v{font-size:26px}}

.split2{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--gap);row-gap:60px}
.split2>.a{grid-column:1 / span 5}.split2>.b{grid-column:7 / -1}
@media (max-width:809.98px){.split2>.a,.split2>.b{grid-column:1 / -1}}
.card-box{border:1px solid var(--line);padding:26px;display:flex;flex-direction:column;gap:20px;justify-content:space-between;min-height:320px}

/* home-style CTA pill image inside hero */
.hero .btn{justify-self:start}

/* ------------------------------------------------------------ briefing (wizard markup kept from the current site) */
.progress-track{position:fixed;top:0;left:0;width:100%;height:2px;background:var(--line);z-index:120}
.progress-fill{height:100%;width:0;background:var(--fg);transition:width .6s var(--ease)}
.briefing-wrap{max-width:980px;margin:0 auto;padding:calc(var(--nav-h) + 110px) var(--pad) 120px;min-height:100vh}
.briefing-wrap .page-title{font-size:clamp(52px,9vw,140px);line-height:.86;letter-spacing:-.06em;font-weight:400;text-transform:uppercase;margin-bottom:40px}
.briefing-wrap .grow-line{height:1px;background:var(--line);margin:40px 0}
.briefing-wrap .large-intro{font-size:24px;line-height:1.2;font-weight:400;letter-spacing:-.01em;max-width:760px;text-indent:4.2em}
.step{display:none}
.step.is-active{display:block;animation:stepIn .7s var(--ease)}
@keyframes stepIn{from{opacity:0;transform:translateY(24px)}to{opacity:1;transform:none}}
.step-eyebrow{display:block;font-size:12px;text-transform:uppercase;letter-spacing:.02em;color:var(--muted);margin-bottom:22px}
.step-title{font-size:clamp(40px,6vw,88px);line-height:.9;letter-spacing:-.05em;font-weight:400;margin-bottom:44px}
.step-hint{font-size:16px;line-height:1.45;color:var(--muted);margin:-26px 0 30px;font-weight:400}
.field-grid{display:grid;grid-template-columns:1fr 1fr;gap:0 30px}
#briefing-form input[type=text],#briefing-form input[type=email],#briefing-form input[type=tel],#briefing-form input[type=url],#briefing-form textarea{width:100%;background:none;border:0;border-bottom:1px solid var(--line);color:var(--fg);font:400 22px/1.2 var(--f-display);letter-spacing:-.01em;padding:14px 0;margin-bottom:26px;border-radius:0;-webkit-appearance:none;appearance:none;transition:border-color .3s}
#briefing-form textarea{min-height:120px;resize:vertical}
#briefing-form input::placeholder,#briefing-form textarea::placeholder{color:var(--faint)}
#briefing-form input:focus,#briefing-form textarea:focus{outline:0;border-color:var(--fg)}
.show-errors input:invalid,.show-errors textarea:invalid{border-bottom-color:#ff5a4a!important}
.show-errors input:invalid::placeholder,.show-errors textarea:invalid::placeholder{color:rgba(255,90,74,.75)}
.form-subtitle{font-size:12px;text-transform:uppercase;letter-spacing:.02em;color:var(--muted);font-weight:500;margin:10px 0 16px}
.pill-options{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:34px}
.pill-label input{position:absolute;opacity:0;pointer-events:none}
.pill{display:inline-block;border:1px solid var(--line);border-radius:999px;padding:11px 17px 10px;font-size:15px;cursor:pointer;transition:background .3s,color .3s,border-color .3s}
.pill-label:hover .pill{border-color:var(--fg)}
.pill-label input:checked+.pill{background:var(--fg);color:var(--bg);border-color:var(--fg)}
.pill-label input:focus-visible+.pill{outline:1px solid var(--fg);outline-offset:3px}
.pill-options-big .pill{padding:16px 24px 15px;font-size:17px}
.show-errors .pill-options.group-error .pill{border-color:rgba(255,90,74,.6)}
.step-nav{display:flex;align-items:center;gap:12px;margin-top:14px;flex-wrap:wrap}
.submit-btn,.ghost-btn{display:inline-flex;align-items:center;gap:10px;border-radius:0;padding:15px 24px 14px;font-size:15px;transition:background .35s,color .35s,border-color .35s,opacity .3s}
.submit-btn{background:var(--fg);color:var(--bg);border:1px solid var(--fg)}
.submit-btn:hover{background:transparent;color:var(--fg)}
.submit-btn:disabled{opacity:.45;cursor:wait}
.ghost-btn{border:1px solid var(--line)}
.ghost-btn:hover{border-color:var(--fg)}
.send-error{margin-top:22px;font-size:15px;color:#ff5a4a}
.send-error a{text-decoration:underline}
.rgpd-check{display:flex;align-items:flex-start;gap:12px;font-size:15px;font-weight:400;line-height:1.45;margin:6px 0 30px;cursor:pointer;color:var(--muted)}
.rgpd-check input{width:18px;height:18px;margin-top:2px;flex-shrink:0;accent-color:var(--fg)}
.rgpd-check a{color:var(--fg);text-decoration:underline}
.show-errors .rgpd-check:has(input:invalid) span{color:#ff5a4a}
.hp-field{position:absolute;left:-9999px;top:-9999px;opacity:0;height:0;overflow:hidden}
@media (max-width:809.98px){.field-grid{grid-template-columns:1fr}.briefing-wrap .large-intro{font-size:20px;text-indent:2.4em}}

/* ------------------------------------------------------------ hero v2: fuller first screen */
.hero{justify-content:flex-start}
.hero__top{display:flex;justify-content:space-between;align-items:center;gap:20px;flex-wrap:wrap}
.hero__top+.hero__row{margin-top:auto}
.hero__foot{display:flex;align-items:center;gap:14px 22px;flex-wrap:wrap}
.hero__foot .hero__scroll{margin-left:auto}
.hero__strip{margin:4px calc(var(--pad) * -1) 0;--m-gap:10px}
.hero__strip .marquee__track{gap:10px;padding-right:10px}
.hero__strip img{height:118px;width:auto;aspect-ratio:4/5;object-fit:cover;border-radius:2px;background:var(--media)}
.cta-note{display:inline-flex;align-items:center;color:var(--muted)}
@media (max-width:809.98px){
  .hero{min-height:auto;padding-top:calc(var(--nav-h) + 26px);padding-bottom:18px;gap:26px}
  .hero__top+.hero__row{margin-top:18px}
  .hero__strip img{height:84px}
  .hero__foot .hero__scroll{display:none}
  .hero__avail{font-size:12px}
}

/* ------------------------------------------------------------ story + team */
.quote{font-family:var(--f-serif);font-style:italic;font-size:clamp(32px,4.2vw,66px);line-height:1.02;letter-spacing:-.02em;font-weight:400}
.quote cite{display:block;margin-top:18px;font:500 14px/1.1 var(--f-display);font-style:normal;text-transform:uppercase;letter-spacing:.01em;color:var(--muted)}
.quotes{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--gap);row-gap:70px}
.quotes>.quote:nth-child(1){grid-column:1 / span 8}
.quotes>.quote:nth-child(2){grid-column:5 / -1}
@media (max-width:809.98px){.quotes>.quote:nth-child(n){grid-column:1 / -1}.quotes{row-gap:44px}}
.team{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:40px var(--gap)}
.member{display:flex;flex-direction:column;gap:14px}
.member__mono{position:relative;aspect-ratio:4/5;border:1px solid var(--line);display:grid;place-items:center;font-size:clamp(60px,8vw,128px);line-height:1;letter-spacing:-.06em;font-weight:400;overflow:hidden;transition:background .6s var(--ease),color .6s var(--ease),border-color .6s}
.member__mono small{position:absolute;left:12px;top:12px;font-size:12px;letter-spacing:.01em;text-transform:uppercase;color:var(--muted);transition:color .6s}
.member__mono .mk{position:absolute;right:12px;bottom:12px;width:18px;height:18px;object-fit:contain;opacity:.6;filter:var(--mark);transition:filter .6s}
.member:hover .member__mono .mk{filter:var(--mark-h)}
.member:hover .member__mono{background:var(--fg);color:var(--bg);border-color:var(--fg)}
.member:hover .member__mono small{color:var(--bg)}
.member h3{font-size:24px;line-height:1.1;font-weight:400;letter-spacing:-.02em}
.member .role{color:var(--muted);text-transform:uppercase;font-size:12px;letter-spacing:.01em}
@media (max-width:1199.98px){.team{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:809.98px){.team{gap:30px var(--gap)}.member h3{font-size:20px}.member__mono{font-size:64px}}
.logo-mark{height:1em;width:auto;display:inline-block}
.logo-mark{filter:var(--mark)}
.footer__mark{height:42px;width:auto;margin-bottom:26px}
.footer__mark{filter:var(--mark)}
@media (max-width:809.98px){.cta{padding:90px var(--pad) 80px;gap:34px}}

/* ------------------------------------------------------------ SEO: H1 + breadcrumbs in the hero, FAQ, blog */
.hero__id{display:flex;flex-direction:column;gap:8px}
.crumbs{display:flex;flex-wrap:wrap;align-items:center;gap:6px;font-size:12px;line-height:1;text-transform:uppercase;letter-spacing:.01em;color:var(--muted)}
.crumbs a{transition:color .3s}
.crumbs a:hover{color:var(--fg)}
.crumbs span{opacity:.5}
.hero__h1{font:500 14px/1.15 var(--f-display);text-transform:uppercase;letter-spacing:.01em}
.hero__h1::before{content:"( "}
.hero__h1::after{content:" )"}
.faq{border-bottom:1px solid var(--line)}
.faq__item{border-top:1px solid var(--line)}
.faq__item summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:24px;padding:22px 0;font-size:24px;line-height:1.15;letter-spacing:-.02em;font-weight:400}
.faq__item summary::-webkit-details-marker{display:none}
.faq__item summary i{position:relative;width:14px;height:14px;flex:none}
.faq__item summary i::before,.faq__item summary i::after{content:"";position:absolute;left:0;top:6.5px;width:14px;height:1px;background:currentColor;transition:transform .45s var(--ease)}
.faq__item summary i::after{transform:rotate(90deg)}
.faq__item[open] summary i::after{transform:rotate(0)}
.faq__item summary:hover span{opacity:.7}
.faq__a{padding:0 40px 26px 0;max-width:760px}
.faq__a p{font-size:16px;line-height:1.55;color:var(--muted);font-weight:400}
@media (max-width:809.98px){.faq__item summary{font-size:19px;padding:18px 0}.faq__a{padding-right:0}}
.hero--post{min-height:auto;padding-bottom:50px;gap:36px}
.post__title{font-size:clamp(40px,6.2vw,100px);line-height:.94;letter-spacing:-.05em;font-weight:400;max-width:16ch}
.hero--post .hero__intro{max-width:760px;text-indent:0;color:var(--muted)}
.post{max-width:760px}
.post h2{font-size:clamp(26px,2.6vw,36px);line-height:1.1;letter-spacing:-.03em;font-weight:400;margin:56px 0 16px;color:var(--fg)}
.post h2:first-child{margin-top:0}
.post p,.post li{font-size:18px;line-height:1.6;color:var(--muted);font-weight:400;margin-bottom:16px}
.post ul{padding-left:20px;margin-bottom:16px}
.post a{color:var(--fg);text-decoration:underline;text-underline-offset:3px}
.post-card .card__cap{grid-template-columns:1fr;gap:8px}
.post-card .card__title{font-size:28px}
@media (max-width:809.98px){.post p,.post li{font-size:17px}}
/* footer: five columns */
.footer__contact{grid-column:1 / span 4}
.footer__nav{grid-column:5 / span 2}.footer__srv{grid-column:7 / span 2}.footer__sec{grid-column:9 / span 2}.footer__soc{grid-column:11 / span 2}
@media (max-width:1199.98px){.footer__contact{grid-column:1 / -1;margin-bottom:50px}.footer__nav{grid-column:1 / span 3}.footer__srv{grid-column:4 / span 3}.footer__sec{grid-column:7 / span 3}.footer__soc{grid-column:10 / span 3}}
@media (max-width:809.98px){.footer__nav,.footer__srv,.footer__sec,.footer__soc{grid-column:span 6;margin-bottom:34px}}
/* accents on the first line of giant titles never touch the text above */
.hero__title .line:first-child,.specimen .line:first-child{margin-top:0}
/* footer logo keeps its square proportions inside the flex column */
.footer__mark{align-self:flex-start;width:42px;height:42px;object-fit:contain}
/* Spanish capitals (Ñ, Á, Ó…) need a little headroom in the giant titles */
.hero__title,.specimen{line-height:.94}
.hero__title .line,.specimen .line,.next__name .line{padding-top:.3em;margin-top:-.3em}
.hero__title .line:first-child,.specimen .line:first-child{margin-top:-.12em}

/* ------------------------------------------------------------ buttons (same language as the home hero CTA)
   Outlined rectangle: 1px ink border, transparent fill, MaFe mark (PNG) + label + arrow.
   Hover wipes the ink in from below and inverts text and mark. */
.btn,.cta-pill{--ink:var(--fg);--paper:var(--bg);position:relative;isolation:isolate;overflow:hidden;display:inline-flex;align-items:center;gap:12px;height:48px;padding:0 20px 0 16px;width:max-content;max-width:100%;flex:none;
  border:1px solid var(--ink);border-radius:0;background:transparent;color:var(--ink);font-size:14px;line-height:1;white-space:nowrap;transition:color .5s var(--ease-io)}
.btn::before,.cta-pill::before{content:"";position:absolute;inset:-1px;z-index:-1;background:var(--ink);transform:scaleY(0);transform-origin:top;transition:transform .55s var(--ease-io)}
.btn:hover,.btn:focus-visible,.cta-pill:hover,.cta-pill:focus-visible{color:var(--paper)}
.btn:hover::before,.btn:focus-visible::before,.cta-pill:hover::before,.cta-pill:focus-visible::before{transform:scaleY(1);transform-origin:bottom}
.mark{display:block;width:18px;height:18px;object-fit:contain;flex:none;filter:var(--mark);transition:filter .5s var(--ease-io)}
.btn:hover .mark,.btn:focus-visible .mark,.cta-pill:hover .mark,.cta-pill:focus-visible .mark{filter:var(--mark-h)}
.btn__arrow,.cta-pill__arrow{margin-left:2px;transition:transform .5s var(--ease)}
.btn:hover .btn__arrow,.cta-pill:hover .cta-pill__arrow{transform:translate(3px,-3px)}

/* ------------------------------------------------------------ projects index: Grid / Lista (editorial) */
.card__num{font-variant-numeric:tabular-nums}
.js .card[data-reveal] .media{clip-path:inset(7% 0 0 0);transition:clip-path 1.5s var(--ease)}
.js .card[data-reveal].is-in .media{clip-path:inset(0)}
.projects .viewbar{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--gap);row-gap:18px;align-items:start;padding:22px 0 24px;border-top:1px solid var(--line);margin-bottom:64px}
.viewtoggle{grid-column:1 / span 4;display:flex;align-items:center;gap:26px}
.viewtoggle__b{display:inline-flex;align-items:center;gap:10px;font-size:22px;line-height:1;letter-spacing:-.015em;font-weight:400;padding:0;color:var(--fg)}
.viewtoggle__b i{width:20px;height:20px;border-radius:50%;border:1.5px solid currentColor;flex:none;transition:background .35s var(--ease),transform .5s var(--ease)}
.viewtoggle__b[aria-pressed="true"] i{background:currentColor}
.viewtoggle__b:hover i{transform:scale(.86)}
.viewbar__filters{grid-column:5 / -1;display:flex;flex-direction:column;gap:10px}
.viewbar__group{display:grid;grid-template-columns:repeat(8,minmax(0,1fr));column-gap:var(--gap);align-items:baseline}
.viewbar__group>.label{grid-column:span 1;color:var(--muted)}
.viewbar__group>.filters{grid-column:2 / -1}
.projects .filters{gap:6px 18px}
.projects .chip{border:0;border-radius:0;padding:0;background:none;font-size:14px;line-height:1.2;letter-spacing:0;text-transform:none;color:var(--muted);transition:color .3s}
.projects .chip sup{font-size:9px;line-height:0;margin-left:2px;letter-spacing:.02em;font-variant-numeric:tabular-nums}
.projects .chip:hover{color:var(--fg);border:0}
.projects .chip[aria-pressed="true"]{color:var(--fg);background:none;text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:5px}
.projects__count{margin-top:90px}
[data-views][data-view="grid"] .plist{display:none}
[data-views][data-view="list"] .works{display:none}
.plist{display:flex;flex-direction:column}
.plist__head,.plist__row{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--gap);align-items:baseline}
.plist__head{padding-bottom:16px;font-size:12px;line-height:1;letter-spacing:.01em;text-transform:uppercase;color:var(--muted)}
.plist__head>span:nth-child(1),.plist__name{grid-column:1 / span 5}
.plist__head>span:nth-child(2),.plist__sector{grid-column:6 / span 2}
.plist__head>span:nth-child(3),.plist__srv{grid-column:8 / span 4}
.plist__head>span:nth-child(4),.plist__year{grid-column:12;text-align:right}
.plist__row{font-size:clamp(20px,1.95vw,28px);line-height:1.2;letter-spacing:-.015em;font-weight:400;padding:2px 0}
.plist__row>span{min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;transition:opacity .35s var(--ease)}
.plist__num,.plist__year{font-variant-numeric:tabular-nums}
.plist__year{color:var(--muted)}
.plist:hover .plist__row>span{opacity:.26}
.plist .plist__row:hover>span{opacity:1}
.plist__row.is-hidden{display:none}
@media (max-width:1199.98px){.viewtoggle{grid-column:1 / -1}.viewbar__filters{grid-column:1 / -1}}
@media (max-width:809.98px){
  .projects .viewbar{grid-template-columns:1fr;row-gap:20px;padding:18px 0 22px;margin-bottom:36px}
  .viewtoggle__b{font-size:21px}
  .viewbar__group{grid-template-columns:1fr;row-gap:8px}
  .viewbar__group>.filters{grid-column:1;flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;margin-right:calc(var(--pad) * -1);padding-right:var(--pad)}
  .viewbar__group>.filters::-webkit-scrollbar{display:none}
  .projects .chip{white-space:nowrap;font-size:15px}
  .plist__head,.plist__row{grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);column-gap:14px}
  .plist__head>span:nth-child(1),.plist__name{grid-column:1}
  .plist__head>span:nth-child(2),.plist__sector{grid-column:2}
  .plist__head>span:nth-child(3),.plist__head>span:nth-child(4),.plist__srv,.plist__year{display:none}
  .plist__row{font-size:18px;line-height:1.24;padding:1px 0}
  .plist:hover .plist__row>span{opacity:1}
  .card__title{font-size:20px}
}

/* photos are links to their project */
a.band{display:block;color:inherit}
a.band .band__img img{transition:transform 1.4s var(--ease)}
a.band:hover .band__img img{transform:scale(1.025)}
.hero__strip a{display:block;flex:none}
.hero__strip a img{transition:opacity .4s var(--ease)}
.hero__strip:hover a img{opacity:.45}
.hero__strip a:hover img{opacity:1}
/* =====================================================================
   MAFE STUDIO — shared header (home + every page). One source of truth:
   the header must never change or jump between pages.
   ===================================================================== */
:root{--pad:20px;--nav-h:45px;--ease:cubic-bezier(.22,1,.36,1);--ease-io:cubic-bezier(.65,0,.35,1);
  --h-bg:#000;--h-fg:#fff;--h-muted:rgba(255,255,255,.6);--h-line:rgba(255,255,255,.12)}
html[data-theme="light"]{--h-bg:#fff;--h-fg:#000;--h-muted:rgba(0,0,0,.6);--h-line:rgba(0,0,0,.12)}
@media (max-width:809.98px){:root{--pad:15px;--nav-h:55px}}

/* layering, identical on every page: menu < page transition < header < cursor < skip link (< home preloader) */
.pt{z-index:2147483100!important}
.cursor{z-index:2147483300!important}
.skip{z-index:2147483400!important}

.nav{position:fixed;inset:0 0 auto 0;z-index:2147483200;height:var(--nav-h);display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:20px;
  padding:0 var(--pad);margin:0;mix-blend-mode:difference;color:#fff;box-sizing:border-box;
  font:500 14px/1.16 "Inter Display","Inter Display Placeholder","Inter",-apple-system,BlinkMacSystemFont,"Segoe UI",Helvetica,Arial,sans-serif;
  letter-spacing:0;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}
.nav *{box-sizing:border-box}
.nav a{color:inherit;text-decoration:none}
.nav button{font:inherit;color:inherit;background:none;border:0;margin:0;cursor:pointer}
.nav__logo{justify-self:start;display:flex;align-items:center;gap:9px}
.nav__logo img{display:block;height:19px;width:auto;max-width:none}
.nav__links{display:flex;gap:8px;margin:0;padding:0}
.nav__links a[aria-current="page"]{opacity:.55}
.nav__right{justify-self:end;display:flex;align-items:center;gap:16px}
.nav__menu{display:none;background:none!important;padding:8px 0!important;font-size:18px!important;line-height:1!important}

.theme-toggle{width:28px;height:28px;display:grid;place-items:center;border-radius:50%;flex:none;padding:0;color:inherit}
.theme-toggle__i{width:15px;height:15px;border-radius:50%;border:1.5px solid currentColor;background:linear-gradient(90deg,currentColor 50%,transparent 50%);transition:transform .7s var(--ease-io)}
html[data-theme="light"] .theme-toggle__i{transform:rotate(180deg)}
.theme-toggle:hover .theme-toggle__i{transform:rotate(90deg)}
html[data-theme="light"] .theme-toggle:hover .theme-toggle__i{transform:rotate(270deg)}

/* hover roll (letters slide up) */
.roll{display:inline-flex;white-space:pre}
.roll__c{position:relative;display:inline-block;overflow:hidden;padding-bottom:2px;vertical-align:top}
.roll__c>span{display:inline-block;transition:transform .55s var(--ease-io);transition-delay:calc(var(--i,0) * 22ms)}
.roll__c>span+span{position:absolute;left:0;top:0;transform:translateY(120%)}
a:hover .roll__c>span:first-child,a:focus-visible .roll__c>span:first-child,button:hover .roll__c>span:first-child{transform:translateY(-120%)}
a:hover .roll__c>span+span,a:focus-visible .roll__c>span+span,button:hover .roll__c>span+span{transform:none}
.sr-only{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* phone menu overlay */
.menu{position:fixed;inset:0;z-index:2147483000;background:var(--h-bg);color:var(--h-fg);padding:calc(var(--nav-h) + 90px) var(--pad) 30px;display:flex;flex-direction:column;justify-content:space-between;gap:40px;
  opacity:0;visibility:hidden;transition:opacity .45s var(--ease),visibility 0s linear .45s;overflow-y:auto;box-sizing:border-box;
  font:500 14px/1.16 "Inter Display","Inter Display Placeholder","Inter",-apple-system,BlinkMacSystemFont,sans-serif}
.menu.is-open{opacity:1;visibility:visible;transition:opacity .45s var(--ease)}
.menu a{color:inherit;text-decoration:none}
.menu__main{display:flex;flex-direction:column;gap:6px}
.menu__main a{font-size:40px;line-height:1;letter-spacing:-.03em;font-weight:400;transform:translateY(20px);opacity:0;transition:transform .7s var(--ease),opacity .7s var(--ease)}
.menu.is-open .menu__main a{transform:none;opacity:1}
.menu.is-open .menu__main a:nth-child(2){transition-delay:.04s}.menu.is-open .menu__main a:nth-child(3){transition-delay:.08s}
.menu.is-open .menu__main a:nth-child(4){transition-delay:.12s}.menu.is-open .menu__main a:nth-child(5){transition-delay:.16s}
.menu.is-open .menu__main a:nth-child(6){transition-delay:.2s}
.menu__sub{display:grid;grid-template-columns:1fr 1fr;gap:28px 20px}
.menu__sub div{display:flex;flex-direction:column;gap:4px;font-size:16px}
.menu__sub .label{color:var(--h-muted);font-size:12px;margin-bottom:6px;text-transform:uppercase;letter-spacing:.01em}

@media (max-width:809.98px){
  .nav{grid-template-columns:1fr auto;font-size:18px}
  .nav__links,.nav__cta{display:none}
  .nav__menu{display:block}
  .nav__right{gap:16px}
  .nav__logo img{height:22px}
}

/* thin arrow (SVG, never an emoji): scales with the text it sits in */
.arr{display:inline-block;width:.68em;height:.68em;vertical-align:.02em;flex:none;overflow:visible;fill:none;stroke:currentColor;stroke-width:1.15;stroke-linecap:square}
