/* Services styles are local to this route; homepage styling is retained. */
.services-page {background:var(--ink)}
.services-primary #sazinies {background:var(--ink)}
.services-header {position:relative;background:var(--lime);color:var(--ink);padding:40px 40px 56px;z-index:2;isolation:isolate}
.services-page .desktop-nav {display:flex}
.services-page .studio-label {font-size:18px}
.services-page footer h2 {font-size:72px;line-height:1.1}
.services-page .mafa-logo {aspect-ratio:3.7231404958677685}
.services-header-content {position:relative;z-index:3;display:flex;flex-direction:column;gap:40px;width:70%}
.services-color-parallax {position:absolute;right:40px;top:0;width:605px;height:449px;z-index:1;pointer-events:none}
.services-color-entrance,.services-color-block {width:100%;height:100%}
.services-color-block {background:#00ccff}
.services-intro {position:relative;z-index:1;display:flex;flex-direction:column;align-items:center;gap:14px;padding:64px 0 72px;background:var(--lime);color:var(--ink);text-align:center}
.services-intro h1 {font-size:72px;line-height:1.1;font-weight:700;text-transform:uppercase}
.services-intro>p {width:50%;font-size:24px;line-height:1.3;font-weight:500}
.services-scroll {display:none}
.service-category {background:var(--ink);width:100%}
.service-category-label {display:flex;justify-content:center;padding:40px 24px}
.category-ux .service-category-label {padding-top:80px}
.service-category-label>span {background:var(--lime);color:var(--ink);font-size:24px;line-height:1.2;font-weight:600;letter-spacing:.04em;padding:6px 10px 5px}
.service-category-title {padding:0 120px;text-align:center}
.service-category-title h2 {font-size:56px;line-height:1.2;font-weight:700;letter-spacing:.02em;color:var(--paper)}
.service-detail-grid {display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px;padding:40px}
.category-ux .service-detail-grid {padding-top:56px}
.service-detail-column {display:flex;flex-direction:column;gap:24px;min-width:0}
.service-detail-card {position:relative;display:flex;flex-direction:column;gap:16px;padding:40px;border-radius:32px;background:var(--paper);color:var(--ink);text-align:center}
.service-detail-card h3 {font-size:32px;line-height:1.2;font-weight:600;letter-spacing:.02em;width:100%}
.service-detail-card p {font-size:24px;line-height:1.5;font-weight:400;width:100%}
.service-detail-card.with-drawing {gap:24px;align-items:center}
.service-drawing {width:209px;height:151px;flex:none;overflow:hidden}
.drawing-responsive .service-drawing {width:179px}
.service-drawing svg {display:block;width:100%;height:100%}
.category-graphic .service-detail-grid,.category-graphic .service-detail-column {gap:16px}
@media(min-width:960px) and (max-width:1299.98px) {
 .services-page .studio-label {font-size:16px}
 .services-page footer h2 {font-size:64px}
 .services-header {padding:48px 40px 56px}
 .services-header-content {gap:32px}
 .services-page .desktop-nav {display:none}
 .services-color-parallax {right:26px;width:397px;height:384px}
 .services-intro h1 {font-size:64px}
 .services-intro>p {font-size:20px}
 .service-category-title h2 {font-size:48px;letter-spacing:normal}
 .service-detail-grid,.category-ux .service-detail-grid,.category-graphic .service-detail-grid {display:flex;flex-direction:column;gap:16px;padding:40px}
 .service-detail-column {display:contents}
 .service-detail-card {order:var(--tablet-order);width:100%}
 .service-detail-card p {font-size:22px}
 .service-detail-card[data-card=ux-2] {gap:19px}
 .service-detail-card[data-card=graphic-1] {border-radius:24px}
 .service-detail-card.drawing-wireframe {gap:16px}
 .service-detail-card.drawing-responsive {padding:56px;gap:24px}
 .drawing-responsive .service-drawing {width:184px}
}
@media(max-width:959.98px) {
 .services-page .desktop-nav {display:none}
 .services-page .studio-label {font-size:16px;padding:6px 10px 5px}
 .services-page footer h2 {font-size:40px;line-height:1.3;letter-spacing:.01em}
 .services-header {padding:24px 20px 72px;overflow:hidden}
 .services-header-content {width:100%;gap:24px}
 .services-color-parallax {top:-22px;bottom:30px;right:0;width:216px;height:auto}
 .services-intro {padding:0 0 40px}
 .services-intro h1 {font-size:40px;line-height:1.3;letter-spacing:.01em}
 .services-intro>p {width:90%;font-size:18px;line-height:1.3}
 .services-scroll {display:block;position:relative;left:auto;bottom:auto;margin-top:0;height:111px}
 .service-category-label {padding:24px 24px 16px}
 .category-ux .service-category-label {padding-top:40px}
 .service-category-label>span {font-size:16px}
 .service-category-title {padding:0 24px}
 .service-category-title h2 {font-size:32px;letter-spacing:normal}
 .service-detail-grid,.category-ux .service-detail-grid,.category-graphic .service-detail-grid {display:flex;flex-direction:column;gap:12px;padding:20px}
 .service-detail-column {display:contents}
 .service-detail-card {order:var(--mobile-order);width:100%;padding:24px;gap:8px;border-radius:16px}
 .service-detail-card h3 {font-size:26px}
 .service-detail-card p {font-size:16px}
 .service-detail-card.with-drawing {gap:16px}
 .drawing-wireframe .service-drawing {width:211px;height:153px}
 .drawing-responsive .service-drawing {width:184px;height:157px}
}
@media(min-width:2000px) {
 .services-header {padding:64px 120px 80px}
 .services-header-content {gap:56px}
 .services-page .header-line {gap:80px}
 .services-color-parallax {right:72px;width:860px;height:687px;top:0}
}

@media(min-width:960px) {.service-detail-card[data-card=ux-3]::after,.service-detail-card[data-card=ux-5]::after {content:"";position:absolute;inset:0;border:2px solid #000;border-radius:inherit;pointer-events:none}}

@media(max-width:959.98px) {.services-page .burger {position:relative;height:32px;display:block}.services-page .burger i {position:absolute;left:0;top:4.097px}.services-page .burger i:nth-child(2){top:14.419px}.services-page .burger i:nth-child(3){top:24.742px}}

.services-scroll .ring-text {fill:var(--ink)}

@media(min-width:1300px) {.category-motion .service-detail-card,.category-graphic .service-detail-card {border-radius:24px}}