/* Shared interior-page design; homepage layout remains in its existing sheets. */
.main-nav a[aria-current="page"] { color: var(--blue); }
.main-nav a[aria-current="page"]:after { width: 100%; }
:root { --secondary-text: #5f6c77; --header-height: 94px; }
html { scrollbar-gutter:stable; }
.sr-only { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip-path:inset(50%); white-space:nowrap; border:0; }
html.dialog-open { overflow:hidden; }
.breadcrumb, .page-hero-note, .page-card .card-bottom,
.blog-card p, .article-meta, .article-toc,
.footer-main > div > p, .footer-links a, .footer-links p, .footer-bottom,
.work-filters button:not([aria-pressed="true"]), .work-end,
.service-number, .services-footnote, .faq-intro p, .project-tech,
.dialog-facts span, .project-dialog .eyebrow { color: var(--secondary-text); }
.work-filters button span { opacity: 1; }
.muted { color: #6c7780; }
.form-status:focus { outline: 2px solid currentColor; outline-offset: 4px; }
.contact-section :is(a, button, input, select, textarea):focus-visible,
.agency-section a:focus-visible, .page-cta a:focus-visible { outline-color: #c2ceff; }
.inner-page h1 { font-size: clamp(42px, 5.7vw, 80px); line-height: 1.08; letter-spacing: -.055em; font-weight: 800; }
.inner-page h1 em { font-style: normal; color: var(--blue); }
.inner-page h2 { font-size: clamp(30px, 3vw, 44px); line-height: 1.2; letter-spacing: -.045em; }
.inner-page h3 { font-size: 24px; line-height: 1.35; letter-spacing: -.035em; }
.inner-page p { line-height: 1.8; }
.page-hero { padding-block: 75px 68px; }
.breadcrumb { display: flex; gap: 10px; flex-wrap: wrap; color: #77828b; font-size: 12px; margin-bottom: 38px; }
.breadcrumb a:hover { color: var(--blue); }
.page-hero .eyebrow { margin-bottom: 22px; }
.hero-lead { font-size: 20px; color: #65717a; max-width: 650px; margin-top: 25px; }
.page-hero-grid, .split-section { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); align-items: center; gap: 70px; }
.page-hero .hero-actions { margin-top: 30px; }
.page-hero-note { display: block; font-size: 13px; color: #75808a; margin-top: 20px; }
.page-heading-line { display: flex; align-items: end; justify-content: space-between; gap: 50px; }
.page-heading-line .hero-lead { max-width: 420px; }
.page-strip { border-block: 1px solid #e1e5e5; padding-block: 24px; }
.page-strip .container { display: flex; align-items: center; flex-wrap: wrap; gap: 20px 42px; font-size: 14px; color: #63717e; }
.page-strip strong { color: var(--ink); margin-right: auto; }
.page-section { padding-block: 90px; }
.section-kicker { margin-bottom: 16px; }
.section-heading-copy { max-width: 560px; color: #687580; margin-top: 22px; }
.split-section > div > .hero-cta { margin-top:28px; }
.section-heading-row { display:flex; justify-content:space-between; align-items:end; gap:30px; margin-bottom:38px; }
.section-heading-row p { max-width:420px; color:#687580; }
.page-surface { background: #eff2ee; }
.page-card { padding: 30px; border: 1px solid #e0e5e8; border-radius: 14px; background: #fff; min-width:0; }
.page-card p { color: #65717a; margin-top: 14px; }
.page-card .eyebrow { color: var(--blue); margin-bottom:24px; }
.page-card h3 + p { margin-top:14px; }
.page-card a.text-link { margin-top:25px; }
.page-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap:24px; margin-top:38px; }
.two-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
.scope-list { padding:0; list-style:none; margin:22px 0 0; }
.scope-list li { padding:12px 0 12px 25px; border-bottom:1px solid #e8ecec; color:#5e6b76; position:relative; font-size:16px; line-height:1.7; }
.scope-list li:before { content:'✓'; position:absolute; left:0; color:var(--blue); }
.scope-list li:last-child { border:0; }
.page-card .card-bottom { margin-top:25px; padding-top:20px; border-top:1px solid #e7eaea; color:#7b8791; font-size:13px; }
.blue-surface { background:linear-gradient(120deg,#eef1ff,#e5ebf9); border:1px solid #e0e7f5; }
.route-card { display:flex; flex-direction:column; }
.route-card .text-link { margin-top:auto; padding-top:30px; }
.page-cta { background:#172a3a; color:#fff; border-radius:18px; padding:55px; display:flex; justify-content:space-between; align-items:center; gap:50px; }
.page-cta h2 { max-width:650px; }
.page-cta p { color:#b9c7d3; max-width:650px; margin-top:20px; }
.page-cta .hero-cta { flex-shrink:0; background:white; color:var(--ink); }
.page-cta-section { padding-block:25px 90px; }
.outline-link { display:inline-flex; align-items:center; gap:20px; padding:15px 22px; border:1px solid #cdd5df; border-radius:8px; font-size:15px; font-weight:650; }
.workspace { border:1px solid #d8e0ec; border-radius:18px; background:#f1f4fb; box-shadow:0 25px 60px #1835560c; padding:24px; min-width:0; }
.workspace-head { display:flex; justify-content:space-between; gap:16px; padding-bottom:21px; border-bottom:1px solid #dae1eb; font-size:11px; color:#708092; }
.workspace-brand { font-size:20px; font-weight:750; color:#24384f; letter-spacing:-.7px; }
.workspace-badge { display:inline-flex; border-radius:30px; padding:5px 10px; background:#e5eafb; font-size:10px; color:#5162a3; align-items:center; }
.workspace-row { display:flex; align-items:center; gap:16px; padding:23px 0; border-bottom:1px solid #dbe2ec; }
.workspace-row:last-of-type { border:0; }
.workspace-row p { font-size:13px; color:#788797; line-height:1.6; margin-top:5px; }
.workspace-row strong { font-size:18px; }
.workspace-num { width:38px; height:38px; border-radius:12px; display:grid; place-items:center; background:white; color:var(--blue); font-size:12px; flex-shrink:0; }
.workspace-status { margin-left:auto; font-size:10px; color:#72859b; flex-shrink:0; }
.workspace-bottom { border-top:1px solid #dae1eb; margin-top:15px; padding-top:20px; display:flex; flex-wrap:wrap; gap:12px; font-size:10px; color:#7e8da0; }
.dark-workspace { background:#1e3346; border-color:#ffffff15; color:#fff; }
.dark-workspace .workspace-head, .dark-workspace .workspace-bottom, .dark-workspace .workspace-row { border-color:#ffffff15; }
.dark-workspace .workspace-brand { color:#edf2ff; }
.dark-workspace .workspace-num { background:#ffffff0a; color:#b1c0ff; }
.dark-workspace .workspace-row p { color:#a8bbcc; }
.dark-workspace .workspace-badge { background:#355cff25; color:#b8c5ff; }
.business-preview { border:1px solid #dce3d9; background:#f1f3ec; border-radius:16px; padding:22px; position:relative; }
.business-preview-bar { display:flex; justify-content:space-between; align-items:center; gap:12px; padding-bottom:18px; color:#74806a; font-size:10px; }
.business-preview strong { font-size:18px; color:#3b5947; }
.business-preview-content { padding:28px; border:1px solid #e0e4d9; background:#fcfcf8; border-radius:10px; }
.business-preview-content .business-preview-title { margin:0; max-width:none; line-height:1.2; font-weight:700; font-family:Georgia,serif; color:#335040; font-size:clamp(28px,3vw,43px); letter-spacing:-.035em; }
.business-preview-content p:not(.business-preview-title) { color:#849184; font-size:13px; margin-top:14px; max-width:290px; }
.business-preview-content .preview-cta { display:inline-block; padding:10px 15px; background:#48684d; color:white; border-radius:4px; font-size:10px; margin-top:20px; }
.business-preview-art { margin-top:26px; height:150px; border-radius:8px; background:linear-gradient(145deg,#c6d0b3,#849b73); position:relative; overflow:hidden; }
.business-preview-art:before { content:''; position:absolute; width:180px; height:180px; border-radius:50%; background:#dae1bf; right:-20px; top:-60px; }
.business-preview-art:after { content:''; position:absolute; inset:65px 10% -40px; border-radius:70% 70% 0 0; background:#5b7d53; transform:rotate(-12deg); }
.visual-caption { display:block; font-size:11px; color:#77858b; text-align:right; margin-top:15px; }
.offer-stack { display:grid; gap:16px; }
.offer-item { border:1px solid #dbe2ed; border-radius:12px; background:#fff; display:flex; gap:22px; align-items:center; padding:24px; }
.offer-item > span { color:var(--blue); font-size:13px; }
.offer-item p { font-size:14px; color:#74808c; margin-top:5px; }
.offer-item strong { font-size:20px; letter-spacing:-.5px; }
.process-timeline { margin-top:40px; }
.timeline-row { display:grid; grid-template-columns:80px minmax(0,1fr) minmax(0,.8fr); gap:40px; border-top:1px solid #dde3e5; padding:45px 0; }
.timeline-row > span { font-size:40px; font-weight:650; color:#a5b3eb; letter-spacing:-2px; }
.timeline-row h3 { font-size:30px; }
.timeline-row p { color:#65717a; margin-top:16px; }
.timeline-row aside { padding:25px; border-radius:10px; background:#eef1f7; font-size:15px; color:#657180; }
.timeline-row aside strong { display:block; color:#263848; margin-bottom:10px; }
.page-faq { display:grid; grid-template-columns:minmax(0,.75fr) minmax(0,1.25fr); gap:80px; }
.page-faq .faq-list summary { font-size:17px; }
.page-faq .faq-list p { font-size:17px; }
.work-page-gallery { padding-top:0; }
.work-intro-rule { border-top:1px solid #e1e5e5; padding-top:30px; }
.work-page-gallery .work-controls { margin-bottom:35px; }
.contact-page-hero { padding-bottom:45px; }
.contact-page-hero + .page-section, .article-page main > .page-section:last-child { padding-top:0; }
.contact-intro { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,.75fr); gap:100px; align-items:end; }
.contact-choices { display:flex; flex-wrap:wrap; gap:10px; margin-top:26px; }
.contact-choices a { border:1px solid #d9e0e8; font-size:13px; border-radius:30px; padding:9px 14px; }
.contact-choices a:hover { color:var(--blue); border-color:#b7c4ff; }
.contact-page-panel { display:grid; grid-template-columns:minmax(0,.72fr) minmax(0,1fr); gap:80px; padding:55px; border:1px solid #e0e4e7; border-radius:18px; background:#f0f3f5; }
.contact-guidance p { font-size:17px; color:#687580; margin-top:16px; }
.contact-guidance .scope-list li { border-color:#dce3e8; }
.contact-page-panel .project-form { padding-top:0; }
.contact-page-panel .field label { color:#435567; }
.contact-page-panel .field input, .contact-page-panel .field textarea, .contact-page-panel .field select { background:white; border:1px solid #dce3e8; color:#26394a; }
.contact-page-panel .form-submit { color:white; background:var(--blue); }
.contact-page-panel .form-note, .contact-page-panel .form-status { color:#697a88; }
.contact-page-panel .form-status { background:#e2e9ee; color:#354b5c; }
.contact-page-panel .field input::placeholder, .contact-page-panel .field textarea::placeholder { color:#657481; }
.contact-page-panel .field label > span { color:#596b7d; }
.contact-page-panel .field select { color-scheme:light; }
.contact-small-note { margin-top:30px; padding-top:25px; border-top:1px solid #dbe2e7; font-size:13px!important; }
.contact-next { display:flex; align-items:start; gap:25px; padding-block:30px; }
.contact-next > span { display:grid; place-items:center; width:36px; height:36px; border:1px solid #d9e1ef; border-radius:50%; font-size:12px; color:var(--blue); flex-shrink:0; }
.contact-next p { font-size:16px; color:#687580; margin-top:8px; }
.blog-featured { display:grid; grid-template-columns:minmax(0,1.1fr) minmax(0,1fr); gap:50px; padding:30px; border:1px solid #dfe5e5; border-radius:18px; align-items:center; background:#fff; }
.blog-featured h2 { margin-top:18px; }
.blog-featured p { color:#687580; margin-top:18px; }
.blog-featured .text-link { margin-top:25px; }
.article-cover { aspect-ratio:1.4; border-radius:12px; background:#e9eddf; padding:35px; display:grid; align-items:center; overflow:hidden; min-width:0; }
.cover-agency { background:#dfE6f6; }
.cover-store { background:#eee4dc; }
.cover-browser { background:#fafbf7; border:1px solid #ffffff; border-radius:8px; padding:22px; box-shadow:0 22px 40px #25332d0b; transform:rotate(-4deg); }
.cover-bar { display:flex; gap:4px; padding-bottom:17px; border-bottom:1px solid #e5e8de; }
.cover-bar i { width:4px; height:4px; border-radius:50%; background:#c6cebf; }
.cover-browser strong { display:block; font-family:Georgia,serif; font-weight:400; font-size:clamp(27px,3vw,45px); line-height:1.1; color:#496044; margin-block:25px 20px; letter-spacing:-1.5px; }
.cover-browser .cover-line { display:block; width:60%; height:5px; border-radius:4px; background:#dce2d5; margin-block:7px; }
.cover-browser .cover-button { display:block; width:65px; height:20px; border-radius:3px; background:#7d956a; margin-top:22px; }
.cover-agency .cover-browser strong { color:#3b5080; font-family:var(--font); font-size:clamp(25px,2.5vw,40px); font-weight:750; }
.cover-agency .cover-button { background:var(--blue); }
.cover-store .cover-browser strong { color:#8d6450; }
.cover-store .cover-button { background:#a5755d; }
.blog-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:28px; }
.blog-card { min-width:0; }
.blog-card .article-cover { padding:25px; }
.blog-card .cover-browser { padding:18px; }
.blog-card .cover-bar { padding-bottom:12px; }
.blog-card .cover-browser strong { font-size:clamp(23px,2vw,29px); margin:18px 0 14px; letter-spacing:-1px; }
.blog-card .cover-browser .cover-button { margin-top:14px; height:16px; }
.blog-card h3 { margin-top:15px; font-size:25px; }
.blog-card p { font-size:16px; color:#74818b; margin-top:14px; }
.blog-card a { display:block; }
.blog-card > a { display:flex; flex-direction:column; height:100%; }
.blog-card .article-cover { flex-shrink:0; }
.blog-card .text-link { margin-top:auto; padding-top:18px; }
.blog-card a:hover h3 { color:var(--blue); }
.blog-card a:focus-visible { border-radius:12px; }
.article-meta { display:flex; flex-wrap:wrap; gap:12px; font-size:12px; color:#7a8791; margin-top:22px; }
.article-meta .category { color:var(--blue); font-weight:650; }
.blog-controls { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:24px; margin-bottom:35px; }
.blog-controls .work-filters { flex-wrap:wrap; }
.article-page .page-hero { max-width:1000px; margin-inline:auto; text-align:center; padding-bottom:50px; }
.article-page .breadcrumb, .article-page .article-meta { justify-content:center; }
.article-page h1 { font-size:clamp(38px,4.8vw,66px); }
.article-page .hero-lead { margin-inline:auto; }
.article-hero-cover { max-width:1100px; margin-inline:auto; }
.article-hero-cover .article-cover { aspect-ratio:3/1; padding:35px 30%; }
.article-layout { display:grid; grid-template-columns:220px minmax(0,730px); justify-content:center; gap:80px; align-items:start; padding-block:70px 90px; }
.article-toc { position:sticky; top:130px; font-size:13px; color:#75818b; }
.article-toc strong { display:block; color:#263746; margin-bottom:20px; font-size:12px; }
.article-toc a { display:block; padding:8px 0; }
.article-toc a:hover { color:var(--blue); }
.article-body h2 { font-size:32px; margin:45px 0 20px; scroll-margin-top:125px; }
.article-body h2:first-child { margin-top:0; }
.article-body p { color:#5d6c79; font-size:18px; margin-block:18px; }
.article-body ul, .article-body ol { color:#5d6c79; padding-left:24px; font-size:18px; line-height:1.85; }
.article-body li { margin-block:10px; }
.article-body blockquote { margin:30px 0; padding:25px 30px; border-left:3px solid var(--blue); background:#eef2fb; color:#35486a; font-size:21px; line-height:1.6; }
.article-author { display:flex; gap:18px; border-top:1px solid #dde3e8; padding-top:30px; margin-top:45px; }
.article-author img { width:45px; height:45px; }
.article-author strong { font-size:16px; }
.article-author p { margin:5px 0 0; font-size:14px; }
.article-page .blog-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
@media(max-width:1100px) {
  .header-inner { min-height:80px; padding-block:14px; }
  .js .menu-toggle { display:block; }
  .main-nav { display:none; position:static; width:100%; padding:12px 0; flex-direction:column; align-items:stretch; gap:0; flex-wrap:nowrap; }
  .js .main-nav { position:absolute; top:100%; left:0; right:0; padding:20px 32px 28px; border-bottom:1px solid #dde2e5; background:var(--paper); max-height:calc(100dvh - var(--header-height)); overflow-y:auto; overscroll-behavior:contain; }
  .js .main-nav:not(.is-open) { display:none; }
  .js .main-nav.is-open { display:flex; }
  .main-nav > a:not(.nav-cta), .main-nav .nav-cta { width:100%; padding-block:14px; font-size:15px; }
  .main-nav .nav-cta { margin-top:12px; justify-content:space-between; }
  .main-nav>a:not(.nav-cta):after { bottom:8px; }
  .page-hero-grid, .split-section { gap:40px; }
  .contact-page-panel { gap:40px; padding:35px; }
  .page-grid, .blog-grid { gap:20px; }
  .article-layout { gap:40px; grid-template-columns:180px minmax(0,1fr); }
  .page-faq { gap:45px; }
}
@media(max-width:1000px) {
  .page-heading-line { display:block; }
  .page-heading-line .hero-lead { max-width:680px; }
  .page-grid, .blog-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .blog-featured { gap:30px; padding:25px; }
  .page-cta { padding:40px; gap:30px; flex-wrap:wrap; }
  .contact-intro { gap:40px; }
}

/* Keep secondary copy legible after the component-specific colour rules. */
.breadcrumb, .page-hero-note, .page-card .card-bottom, .blog-card p,
.article-meta, .article-toc { color:var(--secondary-text); }
@media(max-width:760px) {
  .page-hero-grid, .split-section, .contact-intro, .page-faq, .contact-page-panel, .blog-featured { grid-template-columns:minmax(0,1fr); }
  .page-hero { padding-block:42px 45px; }
  .page-hero h1 { font-size:clamp(42px,8vw,64px); }
  .breadcrumb { margin-bottom:28px; }
  .hero-lead { font-size:18px; }
  .page-section { padding-block:65px; }
  .page-heading-line, .section-heading-row { display:block; }
  .section-heading-row p { margin-top:22px; }
  .page-strip .container { gap:15px 25px; }
  .page-strip strong { width:100%; }
  .page-grid, .two-grid, .blog-grid { grid-template-columns:minmax(0,1fr); }
  .article-page .blog-grid { grid-template-columns:minmax(0,1fr); }
  .page-card { padding:28px; }
  .page-cta { padding:32px 28px; }
  .page-cta-section { padding-bottom:65px; }
  .workspace { max-width:550px; width:100%; }
  .timeline-row { grid-template-columns:45px minmax(0,1fr); gap:20px; padding-block:35px; }
  .timeline-row > span { font-size:30px; }
  .timeline-row aside { grid-column:2; }
  .timeline-row h3 { font-size:25px; }
  .page-faq { gap:30px; }
  .contact-page-panel { padding:28px; }
  .contact-page-panel .form-row { grid-template-columns:minmax(0,1fr); gap:0; }
  .blog-featured .article-cover { aspect-ratio:auto; padding:24px 18px; }
  .blog-featured .cover-browser { padding:18px; }
  .blog-featured .cover-browser strong { font-size:26px; margin-block:16px; }
  .blog-featured .cover-button { margin-top:14px; height:16px; }
  .blog-card .article-cover { aspect-ratio:1.2; padding:20px; }
  .article-layout { grid-template-columns:minmax(0,1fr); gap:35px; padding-block:40px 65px; }
  .article-toc { position:static; padding-bottom:25px; border-bottom:1px solid #dfe5e9; }
  .article-toc a { display:inline-block; margin-right:20px; }
  .article-hero-cover .article-cover { aspect-ratio:1.15; padding:20px 12%; }
  .article-hero-cover .cover-browser { padding:16px; }
  .article-hero-cover .cover-bar { padding-bottom:12px; }
  .article-hero-cover .cover-browser strong { font-size:23px; margin-block:16px; }
  .article-hero-cover .cover-button { margin-top:14px; height:16px; }
  .article-body h2 { font-size:28px; }
  .article-body p, .article-body li { font-size:17px; }
  .article-page .page-hero { text-align:left; }
  .article-page .breadcrumb, .article-page .article-meta { justify-content:start; }
}
@media(max-width:380px) {
  .workspace { padding:18px; }
  .workspace-row { gap:12px; }
  .workspace-row strong { font-size:16px; }
  .workspace-status { display:none; }
  .business-preview { padding:15px; }
  .business-preview-content { padding:20px; }
  .contact-page-panel { padding:22px; }
  .page-card { padding:24px; }
  .page-cta .hero-cta { max-width:100%; }
}

/* Shared reading colours on both plain and tinted surfaces. */
.stack-inner > p, .service-tags span, .process-num, .footer-bottom a,
.section-heading-copy, .contact-guidance p, .contact-page-panel .form-note,
.offer-item p, .workspace-head, .workspace-row p, .workspace-status,
.workspace-bottom { color:var(--secondary-text); }
.dark-workspace .workspace-row p, .dark-workspace .workspace-head,
.dark-workspace .workspace-status, .dark-workspace .workspace-bottom { color:#acbdcf; }
.delivery-header > span:last-child { color:#9eb0c3; }
.business-copy .eyebrow, .business-copy p { color:#526388; }
.small-check { color:#456f53; }
.timeline-row > span { color:#6275aa; }
main :is(li, blockquote), .page-hero-grid > *, .split-section > * { min-width:0; overflow-wrap:anywhere; }
