:root {
    --navy: #061d2e;
    --navy-soft: #0b2b42;
    --blue: #1478c9;
    --sky: #72c7e8;
    --ink: #122431;
    --muted: #60717d;
    --paper: #f3f6f8;
    --line: #dbe4e9;
    --white: #ffffff;
    --shell: 1240px;
    --reading: 1240px;
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
    margin: 0;
    background: var(--paper);
    color: var(--ink);
    font-family: "Assistant", Arial, sans-serif;
    font-size: 18px;
    line-height: 1.7;
    -webkit-font-smoothing: antialiased;
    overflow-x: hidden;
}
body.menu-open { overflow: hidden; }
img { display: block; max-width: 100%; height: auto; }
a { color: inherit; text-decoration: none; }
button, input { font: inherit; }
.shell { width: min(var(--shell), calc(100% - 48px)); margin-inline: auto; }
.skip-link, .screen-reader-text {
    position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px;
    overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0;
}
.skip-link:focus { width: auto; height: auto; clip: auto; margin: 0; top: 10px; right: 10px; z-index: 9999; padding: 10px 16px; background: #fff; }
.eyebrow { display: block; color: var(--blue); font-size: 13px; font-weight: 700; letter-spacing: .1em; }
.section-index { display: block; margin-bottom: 16px; color: var(--blue); font-size: 14px; font-weight: 700; }
.text-link { display: inline-flex; align-items: center; gap: 9px; color: var(--blue); font-weight: 700; }
.text-link span { transition: transform .2s ease; }
.text-link:hover span { transform: translateX(-4px); }
.text-link.light { color: var(--sky); }
.button { display: inline-flex; align-items: center; justify-content: center; gap: 10px; min-height: 50px; padding: 0 22px; border: 1px solid transparent; font-weight: 700; }
.button-light { background: #fff; color: var(--navy); }
.button-ghost { border-color: rgba(255,255,255,.32); color: #fff; }
.button-dark { background: var(--navy); color: #fff; }

.site-header {
    position: sticky; top: 0; z-index: 1000;
    background: rgba(255,255,255,.97);
    border-bottom: 1px solid rgba(6,29,46,.1);
}
.admin-bar .site-header { top: 32px; }
.header-inner { display: flex; align-items: center; min-height: 80px; gap: 34px; }
.site-logo { width: 210px; flex: 0 0 auto; }
.site-logo img { width: 100%; max-height: 54px; object-fit: contain; }
.site-navigation { margin-inline-start: auto; }
.menu { display: flex; align-items: center; gap: 28px; list-style: none; padding: 0; margin: 0; }
.menu a { display: block; position: relative; padding: 26px 0; color: #173041; font-size: 16px; font-weight: 600; }
.menu a::after { content: ""; position: absolute; right: 0; bottom: 20px; width: 0; height: 2px; background: var(--blue); transition: width .2s ease; }
.menu a:hover::after, .current-menu-item > a::after { width: 100%; }
.header-cta { display: inline-flex; gap: 9px; align-items: center; padding: 10px 17px; background: var(--navy); color: #fff; font-size: 15px; font-weight: 700; }
.menu-toggle { display: none; width: 42px; height: 42px; padding: 8px; border: 0; background: transparent; cursor: pointer; }
.menu-toggle > span:not(.screen-reader-text) { display: block; width: 25px; height: 2px; margin: 5px auto; background: var(--navy); transition: .2s ease; }

/* Homepage */
.home-hero { min-height: calc(100vh - 80px); background: var(--navy); color: #fff; display: flex; flex-direction: column; position: relative; overflow: hidden; }
.home-hero::before { content: ""; position: absolute; inset: 0; opacity: .12; background-image: linear-gradient(rgba(255,255,255,.25) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.25) 1px, transparent 1px); background-size: 72px 72px; }
.home-hero-grid { position: relative; flex: 1; display: grid; grid-template-columns: 1.08fr .92fr; gap: 80px; align-items: center; padding-block: 80px; }
.home-hero-copy { position: relative; z-index: 2; }
.home-hero .eyebrow { color: var(--sky); }
.home-hero h1 { margin: 18px 0 26px; max-width: 760px; font-family: "Heebo", sans-serif; font-size: clamp(52px, 6.2vw, 92px); font-weight: 500; line-height: .99; letter-spacing: -.045em; }
.home-hero h1 strong { color: var(--sky); font-weight: 600; }
.home-hero-copy > p { max-width: 680px; margin: 0 0 36px; color: #c7d5de; font-size: 21px; line-height: 1.65; }
.hero-actions { display: flex; flex-wrap: wrap; gap: 12px; }
.home-hero-visual { position: relative; min-height: 470px; }
.code-window { position: absolute; top: 50%; right: 4%; width: min(520px, 95%); transform: translateY(-50%); border: 1px solid rgba(255,255,255,.2); background: #0a2639; box-shadow: 30px 38px 0 rgba(114,199,232,.08); }
.window-bar { display: flex; align-items: center; gap: 7px; height: 48px; padding: 0 16px; border-bottom: 1px solid rgba(255,255,255,.12); color: #7f9aaa; direction: ltr; font: 12px monospace; }
.window-bar i { width: 8px; height: 8px; border-radius: 50%; background: #557081; }
.window-bar span { margin-left: 8px; }
.code-lines { padding: 38px; direction: ltr; }
.code-lines b { display: block; width: 85%; height: 8px; margin-bottom: 18px; background: #2d5268; }
.code-lines b:nth-child(2), .code-lines b:nth-child(5) { width: 56%; background: #4e91b1; }
.code-lines b:nth-child(3) { width: 72%; }
.code-lines b:nth-child(4) { width: 42%; background: #72c7e8; }
.code-lines b:nth-child(6) { width: 65%; }
.build-status { display: flex; align-items: center; gap: 8px; padding: 15px 20px; border-top: 1px solid rgba(255,255,255,.12); color: #9eb3bf; direction: ltr; font: 11px monospace; }
.build-status span { width: 7px; height: 7px; border-radius: 50%; background: #64cf9c; }
.visual-label { position: absolute; z-index: 2; padding: 7px 12px; border: 1px solid rgba(255,255,255,.2); background: var(--navy); color: var(--sky); font: 12px monospace; }
.label-one { top: 8%; right: 0; }.label-two { left: 2%; top: 42%; }.label-three { bottom: 7%; right: 15%; }
.hero-foot { position: relative; display: flex; justify-content: space-between; padding-block: 22px; border-top: 1px solid rgba(255,255,255,.15); color: #829cab; font-size: 12px; letter-spacing: .07em; }
.intro-section { padding: 110px 0 90px; background: #fff; }
.intro-grid { display: grid; grid-template-columns: .9fr 1.1fr; gap: 90px; align-items: start; }
.intro-grid h2, .section-heading h2 { margin: 0; font-family: "Heebo", sans-serif; font-size: clamp(34px, 4vw, 55px); line-height: 1.15; letter-spacing: -.035em; }
.intro-copy { padding-top: 42px; color: #425864; font-size: 20px; }
.intro-copy > :first-child { margin-top: 0; }.intro-copy > :last-child { margin-bottom: 0; }
.tech-strip { display: grid; grid-template-columns: repeat(6, 1fr); margin-top: 80px; border-block: 1px solid var(--line); }
.tech-item { display: flex; min-width: 0; flex-direction: column; align-items: center; justify-content: center; gap: 10px; min-height: 135px; padding: 20px; border-inline-start: 1px solid var(--line); }
.tech-item:first-child { border-inline-start: 0; }
.tech-item img { width: 38px; height: 38px; object-fit: contain; filter: grayscale(1); opacity: .72; }
.tech-item span { color: #536875; font-size: 14px; font-weight: 600; text-align: center; }
.services-section { padding: 105px 0; background: #eaf0f3; }
.section-heading { display: flex; align-items: end; justify-content: space-between; gap: 50px; margin-bottom: 48px; }
.section-heading > p { max-width: 430px; margin: 0; color: var(--muted); font-size: 18px; }
.section-heading.compact { margin-block: 0 35px; }
.section-heading.compact h2 { font-size: 36px; }
.services-grid { display: grid; grid-template-columns: repeat(3, 1fr); border-top: 1px solid #bac9d1; border-right: 1px solid #bac9d1; }
.service-card { position: relative; min-height: 390px; padding: 34px; border-left: 1px solid #bac9d1; border-bottom: 1px solid #bac9d1; background: transparent; transition: background .2s ease, transform .2s ease; }
.service-card:hover { z-index: 2; background: #fff; transform: translateY(-5px); }
.service-number { color: #8496a1; font: 12px monospace; }
.service-card img { width: 62px; height: 62px; margin: 45px 0 28px; object-fit: contain; }
.service-card h3 { margin: 0 0 12px; font-family: "Heebo", sans-serif; font-size: 27px; line-height: 1.25; }
.service-card p { margin: 0; color: var(--muted); font-size: 17px; }
.card-arrow { position: absolute; left: 30px; bottom: 26px; color: var(--blue); font-size: 23px; }
.blog-section { padding: 105px 0 120px; background: #fff; }
.posts-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 28px; }
.post-card { min-width: 0; border: 1px solid var(--line); background: #fff; }
.post-card-image { display: block; overflow: hidden; aspect-ratio: 16 / 9; background: #dfe8ed; }
.post-card-image img { width: 100%; height: 100%; object-fit: cover; transition: transform .35s ease; }
.post-card:hover .post-card-image img { transform: scale(1.025); }
.post-card-image.is-placeholder { display: flex; align-items: center; justify-content: center; background: var(--navy); color: #fff; font: 600 35px "Heebo", sans-serif; }
.post-card-body { padding: 25px; }
.post-card-meta { display: flex; justify-content: space-between; gap: 15px; margin-bottom: 15px; color: #748691; font-size: 13px; }
.post-card-meta span { color: var(--blue); font-weight: 700; }
.post-card h2 { margin: 0 0 12px; font-family: "Heebo", sans-serif; font-size: 24px; line-height: 1.32; letter-spacing: -.02em; }
.post-card p { margin: 0 0 22px; color: var(--muted); font-size: 16px; line-height: 1.65; }

/* Article */
.article-hero { position: relative; overflow: hidden; background: var(--navy); color: #fff; }
.article-hero::after { content: ""; position: absolute; width: 430px; height: 430px; left: -220px; top: -210px; border: 1px solid rgba(114,199,232,.15); border-radius: 50%; }
.article-hero-inner { position: relative; z-index: 1; padding-block: 78px 72px; }
.article-kicker { display: flex; align-items: center; gap: 14px; color: #9fb4c0; font-size: 14px; font-weight: 600; }
.article-kicker a { padding: 5px 11px; background: rgba(114,199,232,.12); color: var(--sky); }
.article-kicker span::before { content: ""; display: inline-block; width: 4px; height: 4px; margin-inline-end: 14px; border-radius: 50%; background: #77909f; vertical-align: middle; }
.article-hero h1 { max-width: 1090px; margin: 18px 0 34px; font-family: "Heebo", sans-serif; font-size: clamp(40px, 5.2vw, 70px); font-weight: 600; line-height: 1.13; letter-spacing: -.035em; text-wrap: balance; }
.article-meta { display: flex; align-items: center; gap: 32px; color: #c4d2da; }
.hero-author { display: flex; align-items: center; gap: 11px; padding-inline-end: 32px; border-inline-end: 1px solid rgba(255,255,255,.18); }
.hero-author img { width: 42px; height: 42px; border-radius: 50%; }
.hero-author span, .meta-item { display: flex; flex-direction: column; color: #fff; font-size: 15px; font-weight: 600; line-height: 1.35; }
.article-meta small { color: #849ca9; font-size: 11px; font-weight: 500; }
.breadcrumb-row, .archive-breadcrumbs { min-height: 54px; display: flex; align-items: center; }
.breadcrumbs { width: 100%; overflow: hidden; color: #697b86; font-size: 13px; white-space: nowrap; text-overflow: ellipsis; }
.breadcrumbs a { color: #28485b; }
.breadcrumbs p { margin: 0; }
.article-cover { margin-bottom: 44px; }
.article-cover img { width: 100%; max-height: 650px; object-fit: cover; border: 1px solid var(--line); }
.article-body { width: min(var(--reading), calc(100% - 48px)); padding-bottom: 110px; }
.article-content { width: 100%; padding: clamp(34px, 5.5vw, 72px); border: 1px solid var(--line); background: #fff; font-size: 20px; line-height: 1.88; }
.article-content > :first-child { margin-top: 0; }.article-content > :last-child { margin-bottom: 0; }
.article-content p { margin: 0 0 1.45em; }
.article-content h2, .article-content h3, .article-content h4 { margin: 2.1em 0 .7em; font-family: "Heebo", sans-serif; line-height: 1.25; letter-spacing: -.025em; }
.article-content h2 { font-size: 35px; }.article-content h3 { font-size: 27px; }.article-content h4 { font-size: 22px; }
.article-content a { color: #076bb6; text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 3px; }
.article-content strong { color: #071f31; font-weight: 700; }
.article-content ul, .article-content ol { padding-right: 26px; margin: 1.4em 0; }
.article-content li { padding: 0 7px 8px 0; }
.article-content blockquote { margin: 38px 0; padding: 22px 28px; border-right: 4px solid var(--blue); background: #edf5f9; font-size: 22px; }
.article-content pre { max-width: 100%; overflow: auto; padding: 24px; background: #061d2e; color: #e7f4fb; direction: ltr; text-align: left; font-size: 14px; line-height: 1.65; }
.article-content code { padding: 2px 6px; background: #edf1f3; direction: ltr; font-size: .84em; }
.article-content pre code { padding: 0; background: transparent; }
.article-content table { display: block; width: 100%; overflow-x: auto; border-collapse: collapse; margin-block: 30px; font-size: 16px; }
.article-content th, .article-content td { padding: 13px; border: 1px solid var(--line); text-align: right; }
.article-content th { background: #edf3f6; }
.article-content iframe { max-width: 100%; }
.article-content figure { max-width: 100%; margin-inline: 0; }
.article-content figure img, .article-content > img { width: auto; max-width: 100%; }
.article-end { margin-top: 28px; }
.author-card { position: relative; display: grid; grid-template-columns: auto 1fr auto; gap: 24px; align-items: center; min-height: 185px; overflow: hidden; padding: 34px 38px; background: var(--navy); color: #fff; }
.author-avatar img { width: 104px; height: 104px; border-radius: 50%; border: 3px solid rgba(255,255,255,.18); }
.author-details .eyebrow { color: var(--sky); }
.author-details h2 { margin: 3px 0 7px; font: 600 29px "Heebo", sans-serif; }
.author-details p { max-width: 650px; margin: 0 0 10px; color: #b6c7d1; font-size: 16px; }
.author-details > a { color: var(--sky); font-size: 14px; font-weight: 700; }
.author-mark { color: rgba(255,255,255,.055); font: 700 100px "Heebo", sans-serif; line-height: 1; }
.article-navigation { display: grid; grid-template-columns: 1fr 1fr; gap: 1px; margin-top: 1px; background: var(--line); }
.article-navigation > div { min-width: 0; padding: 20px 24px; background: #fff; }
.article-navigation small { display: block; margin-bottom: 3px; color: var(--muted); font-size: 12px; }
.article-navigation a { font-weight: 700; line-height: 1.35; }

/* Pages and archives */
.page-hero, .archive-hero, .author-hero { background: var(--navy); color: #fff; }
.page-hero .shell, .archive-hero .shell { padding-block: 68px; }
.page-hero h1, .archive-hero h1, .author-hero h1 { max-width: 950px; margin: 10px 0 0; font: 600 clamp(40px,5vw,68px)/1.14 "Heebo", sans-serif; letter-spacing: -.035em; }
.archive-description { max-width: 760px; margin-top: 17px; color: #b8c8d1; }
.archive-description p { margin: 0; }
.archive-section { padding-block: 50px 110px; }
.pagination { margin-top: 50px; }
.nav-links { display: flex; justify-content: center; gap: 8px; }
.page-numbers { display: grid; place-items: center; min-width: 40px; height: 40px; padding-inline: 10px; border: 1px solid var(--line); background: #fff; }
.page-numbers.current { border-color: var(--navy); background: var(--navy); color: #fff; }
.page-cover { margin-block: 0 36px; }
.page-cover img { width: 100%; max-height: 600px; object-fit: cover; }
.page-content { margin-bottom: 100px; padding: clamp(32px,5vw,65px); border: 1px solid var(--line); background: #fff; font-size: 19px; }
.author-hero-grid { display: grid; grid-template-columns: auto 1fr; gap: 38px; align-items: center; padding-block: 72px; }
.author-large-avatar img { border-radius: 50%; border: 4px solid rgba(255,255,255,.15); }
.author-hero p { max-width: 700px; color: #bacad3; }
.empty-state, .error-inner { padding-block: 100px; text-align: center; }
.error-page { min-height: 65vh; background: #fff; }
.error-inner > span { color: var(--blue); font: 700 90px "Heebo", sans-serif; }
.error-inner h1 { margin: 0; font: 600 45px "Heebo", sans-serif; }
.error-inner p { color: var(--muted); }
.error-inner > div { display: flex; justify-content: center; align-items: center; gap: 20px; margin-top: 28px; }
.attachment-content img { margin-inline: auto; }

/* Contact and footer */
.contact-section { padding: 76px 0; background: #dcecf3; }
.contact-grid { display: grid; grid-template-columns: .9fr 1.1fr; gap: 70px; align-items: center; }
.contact-copy h2 { margin: 8px 0 12px; font: 600 clamp(34px,4vw,52px)/1.15 "Heebo", sans-serif; letter-spacing: -.03em; }
.contact-copy p { max-width: 480px; color: var(--muted); }
.lead-form { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.lead-form label { min-width: 0; color: #244253; font-size: 13px; font-weight: 700; }
.lead-form label span { display: block; margin-bottom: 5px; }
.form-wide { grid-column: 1 / -1; }
.lead-form input { width: 100%; height: 48px; padding: 0 14px; border: 1px solid #b8ccd7; border-radius: 0; background: #fff; outline: none; }
.lead-form input:focus { border-color: var(--blue); box-shadow: 0 0 0 2px rgba(20,120,201,.12); }
.lead-form button { height: 48px; border: 0; background: var(--navy); color: #fff; font-weight: 700; cursor: pointer; }
.site-footer { padding: 68px 0 24px; background: #041725; color: #bac9d1; }
.footer-grid { display: grid; grid-template-columns: 1.7fr repeat(3,1fr); gap: 56px; }
.footer-wordmark { color: #fff; font: 500 36px "Heebo", sans-serif; }
.footer-wordmark span { font-weight: 700; }
.footer-brand p { max-width: 360px; }
.social-links { display: flex; gap: 18px; color: #fff; font-weight: 600; }
.footer-column h3 { margin: 7px 0 17px; color: #fff; font-size: 17px; }
.footer-column ul { list-style: none; padding: 0; margin: 0; }
.footer-column li { margin-bottom: 9px; font-size: 15px; }
.site-footer a:hover { color: var(--sky); }
.footer-bottom { display: flex; justify-content: space-between; margin-top: 52px; padding-top: 20px; border-top: 1px solid rgba(255,255,255,.1); color: #758d9a; font-size: 13px; }
.mobile-actions { display: none; }

@media (max-width: 1050px) {
    .header-cta { display: none; }
    .menu-toggle { display: block; margin-inline-start: auto; }
    .site-navigation { position: fixed; inset: 80px 0 auto; max-height: calc(100vh - 80px); overflow-y: auto; padding: 18px 24px 30px; background: #fff; border-bottom: 1px solid var(--line); transform: translateY(-130%); opacity: 0; visibility: hidden; transition: .25s ease; }
    .admin-bar .site-navigation { inset-block-start: 112px; }
    .site-navigation.is-open { transform: translateY(0); opacity: 1; visibility: visible; }
    .menu { display: block; }
    .menu a { padding: 12px 0; border-bottom: 1px solid var(--line); font-size: 18px; }
    .menu a::after { display: none; }
    .home-hero-grid { grid-template-columns: 1fr; gap: 30px; padding-block: 70px; }
    .home-hero-visual { min-height: 330px; }
    .code-window { right: 50%; width: min(600px, 90%); transform: translate(50%,-50%); }
    .intro-grid, .contact-grid { grid-template-columns: 1fr; gap: 30px; }
    .intro-copy { padding-top: 0; }
    .tech-strip { grid-template-columns: repeat(3,1fr); }
    .tech-item:nth-child(4) { border-inline-start: 0; }
    .services-grid, .posts-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
    .footer-grid { grid-template-columns: 1fr 1fr 1fr; }
    .footer-brand { grid-column: 1 / -1; }
}

@media (max-width: 782px) {
    .admin-bar .site-header { top: 46px; }
    .admin-bar .site-navigation { inset-block-start: 126px; }
}

@media (max-width: 700px) {
    body { font-size: 17px; }
    .shell { width: min(100% - 28px,var(--shell)); }
    .header-inner { min-height: 68px; }
    .site-logo { width: 168px; }
    .site-navigation { inset-block-start: 68px; }
    .admin-bar .site-navigation { inset-block-start: 114px; }
    .home-hero { min-height: auto; }
    .home-hero-grid { padding-block: 58px 42px; }
    .home-hero h1 { font-size: 48px; }
    .home-hero-copy > p { font-size: 18px; }
    .hero-actions { display: grid; }
    .home-hero-visual { min-height: 260px; }
    .code-window { width: 92%; box-shadow: 15px 17px 0 rgba(114,199,232,.08); }
    .code-lines { padding: 25px; }
    .visual-label { display: none; }
    .hero-foot { display: none; }
    .intro-section, .services-section, .blog-section { padding-block: 68px; }
    .intro-grid h2, .section-heading h2 { font-size: 36px; }
    .tech-strip { grid-template-columns: repeat(2,1fr); margin-top: 50px; }
    .tech-item { min-height: 112px; border-bottom: 1px solid var(--line); }
    .tech-item:nth-child(odd) { border-inline-start: 0; }
    .tech-item:nth-child(4) { border-inline-start: 1px solid var(--line); }
    .section-heading { display: block; margin-bottom: 30px; }
    .section-heading > p, .section-heading > a { margin-top: 15px; }
    .services-grid, .posts-grid { grid-template-columns: 1fr; }
    .service-card { min-height: 330px; }
    .article-hero-inner { padding-block: 54px 50px; }
    .article-hero h1 { font-size: 38px; }
    .article-meta { align-items: flex-start; flex-wrap: wrap; gap: 16px 22px; }
    .hero-author { width: 100%; padding: 0 0 15px; border: 0; border-bottom: 1px solid rgba(255,255,255,.14); }
    .article-cover { width: 100%; margin-bottom: 18px; }
    .article-cover img { max-height: 380px; border-inline: 0; }
    .article-body { width: 100%; padding-bottom: 68px; }
    .article-content { padding: 30px 20px; border-inline: 0; font-size: 18px; line-height: 1.82; }
    .article-content h2 { font-size: 29px; }
    .article-content h3 { font-size: 24px; }
    .article-content pre { margin-inline: -8px; padding: 17px; font-size: 12px; }
    .article-end { margin-top: 0; }
    .author-card { grid-template-columns: auto 1fr; padding: 28px 20px; }
    .author-avatar img { width: 72px; height: 72px; }
    .author-details h2 { font-size: 24px; }
    .author-mark { display: none; }
    .article-navigation { grid-template-columns: 1fr; }
    .page-hero .shell, .archive-hero .shell { padding-block: 48px; }
    .page-hero h1, .archive-hero h1, .author-hero h1 { font-size: 39px; }
    .archive-section { padding-block: 35px 70px; }
    .page-content { width: 100%; margin-bottom: 65px; padding: 30px 20px; border-inline: 0; }
    .author-hero-grid { grid-template-columns: 1fr; gap: 20px; padding-block: 50px; }
    .author-large-avatar img { width: 100px; height: 100px; }
    .contact-section { padding-block: 58px; }
    .lead-form { grid-template-columns: 1fr; }
    .form-wide { grid-column: auto; }
    .footer-grid { grid-template-columns: 1fr 1fr; gap: 36px 22px; }
    .footer-brand { grid-column: 1/-1; }
    .footer-bottom { display: block; padding-bottom: 54px; }
    .footer-bottom span { display: block; }
    .mobile-actions { position: fixed; z-index: 999; inset: auto 0 0; display: grid; grid-template-columns: 1fr 1fr; background: var(--navy); color: #fff; }
    .mobile-actions a { padding: 12px 8px; text-align: center; font-size: 15px; font-weight: 700; }
    .mobile-actions a + a { background: var(--blue); }
}