/* Brand evolution: editorial compositions + lightweight technical diagrams.
   Existing service, support and form components remain in growth.css. */
.support-hero .hero-text { max-width: 720px; }
.support-options { display: grid; grid-template-columns: 1.15fr 1fr 1fr; gap: clamp(1.5rem, 4vw, 4rem); margin-top: 2.5rem; }
.support-option { display: flex; flex-direction: column; align-items: flex-start; min-width: 0; border-top: 1px solid var(--line); padding-top: 1.5rem; }
.support-option-portal { border-top: 3px solid var(--primary); padding-top: calc(1.5rem - 2px); }
.design-page .support-option h2 { font-size: clamp(1.35rem, 2.2vw, 1.8rem); margin: .2rem 0 .7rem; }
.support-option > p:not(.section-kicker) { margin-bottom: 1.5rem; }
.support-option > a { margin-top: auto; max-width: 100%; overflow-wrap: anywhere; }
.support-availability { margin-top: 1.8rem; }
.support-contact-section { padding-block: var(--space-section); border-block: 1px solid var(--line); background: var(--bg-soft, #f5f5f1); scroll-margin-top: 100px; }
.support-contact-layout { display: grid; grid-template-columns: .8fr 1.2fr; gap: clamp(2rem, 6vw, 6rem); }
.support-contact-layout > * { min-width: 0; }
.support-contact-layout h2 { margin-bottom: 1.3rem; }
.support-contact-layout .contact-form { padding: 0; }
.support-contact-layout .form-grid input, .support-contact-layout .form-grid select, .support-contact-layout .form-grid textarea { min-width: 0; max-width: 100%; }
.support-receipt { padding: 2rem; background: #fff; border-top: 3px solid var(--primary); overflow-wrap: anywhere; }
.support-receipt [data-support-delivery-failed] { padding: 1rem; background: #fff1d6; color: #573d0c; }
@media (max-width: 900px) {
  .support-contact-layout { grid-template-columns: 1fr; }
  .support-options { gap: 1.5rem; }
}
@media (max-width: 620px) {
  .support-options { grid-template-columns: 1fr; margin-top: 1.8rem; }
  .support-option > p:not(.section-kicker) { margin-bottom: 1rem; }
  .support-receipt { padding: 1.3rem; }
}
.design-page {
  --space-section: clamp(3.5rem, 7vw, 7rem);
  --space-composition: clamp(2rem, 5vw, 5rem);
  --motion-fast: 180ms;
  --motion-ui: 320ms;
  --motion-reveal: 650ms;
  --ease-precise: cubic-bezier(.22,.61,.36,1);
  --technical-line: #9baeba;
  --technical-grid: #153b5210;
  --technical-active: #236b91;
  --home-warm: #eeeae2;
}
.design-page .service-number { color: #23678c; }
/* German compounds must not force grid tracks wider than a small viewport. */
html[lang="de"] .design-page :is(h1,h2,h3,p) { hyphens: auto; overflow-wrap: anywhere; }
.brand-hero-layout > *, .editorial-split > *, .product-agreements > *, .discipline-hero-layout > * { min-width: 0; }
.design-page .button span[aria-hidden], .design-page .text-link span[aria-hidden] { transition: transform var(--motion-fast) var(--ease-precise); }
.design-page .button:hover span[aria-hidden], .design-page .text-link:hover span[aria-hidden] { transform: translate(3px, -2px); }
.design-page .language-switcher a { min-height: 44px; display: inline-flex; align-items: center; }
.design-page .main-nav { gap: clamp(.8rem, 1.4vw, 1.4rem); }
.design-page .main-nav a.nav-support { border: 0; background: transparent; padding: .6rem 0; font-weight: 550; color: var(--text-soft); }
.design-page .main-nav a.nav-support:hover { background: transparent; color: var(--primary); }
.design-page .main-nav a.nav-support::after { display: block; }
.main-nav .services-menu { position: static; }
.services-menu > summary { display: flex; align-items: center; gap: .6rem; min-height: 44px; font-size: .84rem; font-weight: 550; list-style: none; cursor: pointer; }
.services-menu > summary::-webkit-details-marker { display: none; }
.services-menu > summary span { transition: transform var(--motion-fast); }
.services-menu[open] > summary span { transform: rotate(180deg); }
.services-menu[open] > summary, .services-menu.is-active > summary { color: var(--primary); text-decoration: underline; text-underline-offset: 8px; }
.services-dropdown { position: absolute; top: calc(100% - 1px); left: 150px; width: min(620px, calc(100vw - 112px)); padding: 1.4rem 1.8rem 0; background: #fff; border: 1px solid var(--line); box-shadow: 0 18px 32px #092b490c; }
.services-business { display: grid; grid-template-columns: 1fr 1fr; gap: .4rem 2rem; padding-bottom: 1.2rem; }
.design-page .main-nav .services-dropdown a { display: flex; flex-direction: column; padding: .7rem 0; white-space: normal; }
.services-dropdown a strong { font-size: 1rem; font-weight: 600; }
.services-dropdown a span { color: var(--text-soft); font-size: .78rem; }
.design-page .main-nav .services-home { border-top: 1px solid var(--line); padding-block: 1.1rem; flex-direction: row; align-items: center; justify-content: space-between; gap: 1rem; }
.design-page .mobile-menu .mobile-group-label { color: var(--text-soft); padding: .4rem 0; font-size: .68rem; text-transform: uppercase; letter-spacing: .1em; }
.mobile-menu .mobile-home-link { border-block: 1px solid var(--line); margin-block: .5rem; }
.mobile-home-link span { font-size: .75rem; font-weight: 400; color: var(--text-soft); }
.design-page .footer-navigation { grid-template-columns: 1fr 1fr 1fr 1.2fr; gap: 2rem; }
.footer-home-link { margin-top: 1rem; border-top: 1px solid var(--line); padding-top: 1rem; }
.design-page .footer-direct .footer-phone { font-size: 1.3rem; }
.design-page .footer-navigation a { min-height: 36px; }
.design-page .footer-direct > p { max-width: 28ch; }

/* One master-brand first impression. */
.brand-hero { position: relative; background: var(--paper); }
.brand-hero-layout { display: grid; grid-template-columns: 1.08fr 1fr; align-items: center; gap: 2%; padding-block: clamp(3rem, 5vw, 5rem) 2.5rem; }
.design-page .brand-hero h1 { font-size: clamp(3.25rem, 5.65vw, 5.65rem); line-height: 1.06; letter-spacing: -.058em; text-wrap: initial; }
.brand-hero h1 span { color: #416477; }
.brand-hero-copy { position: relative; z-index: 1; }
.brand-hero-copy .hero-text { max-width: 43ch; font-size: 1.06rem; margin-top: 1.8rem; }
.brand-hero .hero-footnote { margin-top: 1.6rem; }
.hero-baseline { border-top: 1px solid var(--line); display: flex; justify-content: space-between; gap: 1rem; padding-block: 1.15rem; color: var(--text-soft); font-size: .72rem; letter-spacing: .04em; }
.hero-baseline > span:last-child { font-family: ui-monospace, monospace; }
.brand-proof { padding-block: 2.5rem 3rem; }
.brand-proof .proof-heading { margin-bottom: 1rem; }
.brand-proof .section-kicker { margin-bottom: 0; }
.brand-proof .trust-logo { min-height: 72px; }
.brand-proof .trust-logo img { height: 52px; }

/* System visual: meaningful paths; native links remain fully usable without JS. */
.system-composition { position: relative; min-width: 0; }
.system-field { position: relative; aspect-ratio: 640 / 560; }
.system-field > svg { width: 100%; height: 100%; overflow: visible; }
.system-grid { stroke: var(--technical-grid); stroke-width: 1; }
.system-orbit { stroke: #153b5220; stroke-width: 1; stroke-dasharray: 2 7; }
.system-branches { stroke: var(--technical-line); stroke-width: 1.5; }
.system-branches > g { transition: opacity var(--motion-ui), stroke var(--motion-ui); }
.system-branches circle, .system-branches rect { fill: var(--paper); }
.system-branches .system-data circle { fill: var(--technical-active); stroke: none; }
.system-branches .system-matrix rect { fill: var(--navy); stroke: none; }
.system-core { fill: var(--navy); stroke: #fff; stroke-width: 9px; }
.system-cross { stroke: var(--technical-active); stroke-width: 1.2px; }
.system-wordmark { position: absolute; left: 50%; top: 51.8%; width: 20%; transform: translate(-50%, -50%); color: #fff; text-align: center; font-size: clamp(1.1rem, 2vw, 1.8rem); font-weight: 650; letter-spacing: -.06em; line-height: 1; pointer-events: none; }
.system-wordmark span { display: block; font: 400 clamp(.3rem, .5vw, .45rem) ui-monospace, monospace; letter-spacing: .07em; margin-top: .75rem; color: #b9d2df; }
.system-label { position: absolute; display: flex; flex-direction: column; align-items: flex-start; max-width: 46%; padding-block: .7rem; min-height: 44px; line-height: 1.5; }
.system-label strong { font-size: clamp(.9rem, 1.22vw, 1.15rem); font-weight: 550; letter-spacing: -.025em; border-bottom: 1px solid transparent; transition: border-color var(--motion-ui); }
.system-label strong > span { margin-left: .4rem; font-size: .9em; }
.system-label > span { font-size: .66rem; color: var(--text-soft); margin-top: .15rem; }
.system-label:hover strong, .system-label:focus-visible strong { border-color: currentColor; }
.system-label-it { left: 6%; top: 9%; }
.system-label-automate { left: 59%; top: 9%; }
.system-label-integrate { left: 59%; top: 79%; }
.system-label-data { left: 6%; top: 79%; }
.system-caption { display: flex; align-items: center; justify-content: space-between; gap: .7rem; color: var(--text-soft); font-size: .64rem; padding-inline: 6%; }
.system-caption button { background: transparent; border: 0; border-bottom: 1px solid var(--line); padding: .45rem 0; color: inherit; font: inherit; cursor: pointer; min-height: 44px; }
.system-packet { stroke: var(--technical-active); stroke-width: 3; stroke-dasharray: 3 97; stroke-dashoffset: 100; opacity: 0; }
.system-composition.is-visible:not(.is-paused) .system-packet { animation: packet-flow 6s linear infinite; }
.system-composition.is-visible:not(.is-paused) .system-matrix { animation: matrix-settle 6s var(--ease-precise) infinite; transform-box: fill-box; transform-origin: center; }
.system-composition[data-active] .system-branches > g { opacity: .22; }
.system-composition[data-active="it"] [data-system-part="it"], .system-composition[data-active="automate"] [data-system-part="automate"], .system-composition[data-active="integrate"] [data-system-part="integrate"], .system-composition[data-active="data"] [data-system-part="data"] { opacity: 1; stroke: var(--technical-active); stroke-width: 2; }
.system-composition[data-active="it"] [data-system-part="it"] circle { fill: #b6d0db; }
.system-data circle { transition: transform 600ms var(--ease-precise); }
.system-composition[data-active="data"] .system-data circle:nth-child(1) { transform: translate(35px,8px); }
.system-composition[data-active="data"] .system-data circle:nth-child(2) { transform: translate(25px,-52px); }
.system-composition[data-active="data"] .system-data circle:nth-child(3) { transform: translate(-29px,-10px); }
.system-composition[data-active="data"] .system-data circle:nth-child(4) { transform: translate(-30px,34px); }
.system-composition[data-active="automate"] [data-system-part="automate"] rect { fill: #b6d0db; transition: fill var(--motion-ui); }
.system-composition[data-active="automate"] [data-system-part="automate"] rect:last-of-type { transition-delay: 180ms; }
@keyframes packet-flow { 0% { stroke-dashoffset: 100; opacity: 0; } 10%,85% { opacity: 1; } 100% { stroke-dashoffset: 0; opacity: 0; } }
@keyframes matrix-settle { 0%,18%,100% { opacity: .5; transform: translateY(3px); } 35%,85% { opacity: 1; transform: translateY(0); } }

/* Disciplines form a composition, not a row of feature cards. */
.brand-disciplines, .brand-scenarios, .brand-approach, .brand-section, .home-vertical, .brand-cta { padding-block: var(--space-section); }
.brand-section-heading { display: grid; grid-template-columns: 1.3fr 1fr; column-gap: 10%; align-items: end; margin-bottom: var(--space-composition); }
.brand-section-heading .section-kicker { grid-column: 1 / -1; }
.brand-section-heading > p:last-child { max-width: 42ch; color: var(--text-soft); }
.discipline-composition { display: grid; grid-template-columns: 1fr 1.1fr; border-top: 1px solid var(--line); }
.discipline-entry { padding: 2.5rem; border-bottom: 1px solid var(--line); position: relative; overflow: hidden; }
.discipline-entry p:not(.section-kicker) { margin-top: 1.3rem; max-width: 43ch; color: var(--text-soft); font-size: .95rem; }
.discipline-entry .section-kicker { margin-bottom: 1rem; }
.design-page .discipline-entry h3 { font-size: clamp(1.75rem,2.5vw,2.5rem); max-width: 16ch; }
.discipline-entry-it { grid-row: span 2; background: var(--paper); padding: 3rem; display: flex; flex-direction: column; justify-content: space-between; }
.discipline-entry-it .discipline-diagram { margin: 2rem auto 0; max-width: 380px; }
.discipline-entry-automate, .discipline-entry-integrate { display: grid; grid-template-columns: 1.45fr .65fr; gap: 1rem; padding-right: 0; }
.discipline-entry-automate .discipline-diagram, .discipline-entry-integrate .discipline-diagram { align-self: center; width: 230px; margin-left: 0; }
.discipline-entry-data { grid-column: 1 / -1; display: grid; grid-template-columns: 1fr 1.1fr; gap: 5%; padding-inline: 3rem; align-items: center; }
.discipline-entry-data .discipline-diagram { width: 85%; max-height: 260px; justify-self: center; }
.discipline-diagram { width: 100%; display: block; stroke-width: 1.4; }
.diagram-line { stroke: var(--technical-active); }
.diagram-orbit { stroke: var(--technical-line); stroke-dasharray: 2 7; }
.diagram-frame { stroke: var(--technical-line); fill: transparent; }
.diagram-nodes { stroke: var(--technical-active); fill: var(--paper); }
.diagram-solid { fill: var(--navy); stroke: var(--navy); }
.diagram-marks { stroke: #72a3bc; stroke-width: 2; }
.diagram-signal { stroke: var(--navy); stroke-width: 4; stroke-dasharray: 4 96; stroke-dashoffset: 100; opacity: 0; }
.diagram-raw { fill: #7898ab; }
.diagram-ordered { fill: var(--navy); }
@media (hover: hover) and (pointer: fine) {
  .discipline-entry:hover .diagram-signal, .discipline-entry:focus-within .diagram-signal { animation: packet-flow 3s linear 1; }
  .discipline-entry:hover .diagram-ordered, .discipline-entry:focus-within .diagram-ordered { animation: matrix-settle 3s var(--ease-precise) 1; }
}
.brand-statement { position: relative; padding-block: var(--space-section); color: #fff; background: var(--navy); overflow: hidden; }
.brand-statement > .container { position: relative; }
.brand-statement .section-kicker { color: #b8d0de; }
.design-page .brand-statement h2 { font-size: clamp(2.5rem, 5.5vw, 5.25rem); max-width: 21ch; position: relative; z-index: 1; }
.brand-statement h2 span { color: #9ebacb; }
.brand-statement p:last-of-type { max-width: 43ch; margin: 2.5rem 0 0 50%; color: #c8d8e2; position: relative; z-index: 1; }
.statement-path { position: absolute; width: 65%; bottom: -90px; right: -8%; fill: none; stroke: #93b6cd35; stroke-width: 1; }
.statement-path path { stroke-dasharray: 100; }
.statement-path circle { fill: #93b6cd; }
.is-revealed .statement-path path { animation: draw-line 1.5s var(--ease-precise) both; }
@keyframes draw-line { from { stroke-dashoffset: 100; } to { stroke-dashoffset: 0; } }
.scenario-list article { display: grid; grid-template-columns: 45px 1fr 1.05fr; gap: 3%; align-items: start; padding-block: 2rem; border-top: 1px solid var(--line); }
.scenario-list article:last-child { padding-bottom: 0; }
.scenario-list h3 { max-width: 24ch; font-size: clamp(1.5rem,2.3vw,2.15rem); }
.scenario-list p { max-width: 52ch; color: var(--text-soft); font-size: .98rem; }
.brand-approach { background: var(--paper); }
.project-steps { list-style: none; display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 2.5rem; margin: 3rem 0 0; padding: 0; }
.project-steps li { border-top: 1px solid var(--technical-line); padding-top: 1rem; }
.project-steps .service-number { display: block; margin-bottom: 1.4rem; }
.design-page .project-steps h3 { font-size: 1.4rem; margin-bottom: 1rem; }
.project-steps p { font-size: .9rem; color: var(--text-soft); }
.project-steps-detailed { grid-template-columns: 1fr 1fr; gap: 3rem 8%; }
.project-steps-detailed h3 { font-size: 1.8rem; }
.project-steps-detailed p { max-width: 57ch; font-size: 1rem; }
.home-person.brand-person { padding-block: var(--space-section); }
.brand-person .home-person-layout { grid-template-columns: .85fr 1.15fr; gap: 10%; }
.founder-photo { position: relative; max-width: 440px; }
.brand-person .founder-photo img { width: 100%; height: auto; aspect-ratio: 4 / 5; object-fit: cover; object-position: 50% 32%; }
.founder-photo > span { display: block; position: absolute; bottom: 0; left: 0; padding: .8rem 1.2rem; background: var(--navy); color: #fff; font-size: .85rem; }
.brand-person h2 { margin-bottom: 1.8rem; }
.founder-email { margin-left: 1.5rem; }
.brand-person p:not(.section-kicker) { max-width: 48ch; }
.home-vertical { background: var(--home-warm); padding-block: 3.5rem; }
.home-vertical-layout { display: grid; grid-template-columns: 1.3fr .7fr; gap: 8%; align-items: center; }
.home-vertical-layout p:not(.section-kicker) { margin-top: 1.3rem; max-width: 48ch; color: var(--text-soft); }
.home-vertical .discipline-diagram { max-height: 230px; }
.brand-cta { color: #fff; background: var(--navy); }
.brand-cta .section-kicker, .brand-cta .text-link { color: #c6dce9; }
.brand-cta h2 { max-width: 16ch; }
.brand-cta .conversion-panel p { color: #c6dce9; }
.design-page .brand-cta .button-primary { background: #fff; color: var(--navy); }
.brand-cta .cta-actions { align-items: flex-start; }
.brand-cta .text-link { min-height: 44px; }
.supporting-case, .case-directory-card { transition: border-color var(--motion-ui); }
.supporting-case img, .case-directory-card img { transition: transform var(--motion-ui) var(--ease-precise); }
.supporting-case:hover img, .case-directory-card:hover img { transform: scale(1.025); }
.case-disciplines { display: flex; flex-wrap: wrap; gap: .5rem 1.2rem; margin-block: 1rem; font-size: .8rem; color: var(--text-soft); }

/* The landing pages share tokens, with distinct narrative and geometry. */
.discipline-hero { background: var(--paper); margin-top: 1.8rem; padding-block: clamp(3rem,6vw,5.5rem); }
.discipline-hero-layout { display: grid; grid-template-columns: 1.1fr .9fr; gap: 9%; align-items: center; }
.design-page .discipline-hero h1 { font-size: clamp(3rem,5.5vw,5rem); max-width: 15ch; }
.discipline-hero .button { margin-top: 2rem; }
.discipline-figure { margin: 0; min-width: 0; }
.discipline-figure figcaption { font-size: .76rem; text-align: center; color: var(--text-soft); margin-top: 1rem; }
.discipline-figure.is-revealed .diagram-signal { animation: packet-flow 3.5s linear 1; }
.discipline-figure.is-revealed .diagram-ordered { animation: matrix-settle 3s var(--ease-precise) 1; }
.discipline-hero-integrate { background: var(--navy); color: #fff; --technical-line: #628398; --technical-active: #afc7d6; }
.discipline-hero-integrate .section-kicker, .discipline-hero-integrate .hero-text, .discipline-hero-integrate figcaption { color: #c6dce9; }
.discipline-hero-integrate .diagram-solid { fill: #d1e3ed; stroke: #d1e3ed; }
.discipline-hero-integrate .diagram-marks { stroke: var(--navy); }
.discipline-hero-integrate .diagram-nodes { fill: var(--navy); }
.design-page .discipline-hero-integrate .button-primary { background: #fff; color: var(--navy); }
.discipline-hero-home, .home-applications { background: var(--home-warm); }
.editorial-split { display: grid; grid-template-columns: 1fr 1fr; gap: 8%; align-items: start; }
.editorial-split p:not(.section-kicker) { color: var(--text-soft); }
.editorial-split h2 { max-width: 21ch; }
.brand-section h2 + p { margin-top: 1.5rem; }
.brand-section.section-accent { background: var(--pale); }
.brand-section.section-accent::before, .brand-section.section-accent::after { display: none; }
.capability-list { margin: 2rem 0 0; padding: 0; list-style: none; }
.capability-list li { border-top: 1px solid var(--line); padding-block: .8rem; font-size: .92rem; }
.before-after-list { margin-top: 3rem; }
.before-after-list article { display: grid; grid-template-columns: .8fr 1fr 1fr; gap: 5%; padding-block: 2.3rem; border-top: 1px solid var(--technical-line); }
.before-after-list h3 { font-size: 1.6rem; }
.before-after-list p { margin-top: .6rem; font-size: .95rem; color: var(--text-soft); }
.technical-label { text-transform: uppercase; font-size: .65rem; letter-spacing: .08em; font-weight: 650; }
.brand-case-proof { background: var(--paper); }
.brand-case-proof .detail-proof { margin-top: 3rem; }
.brand-case-proof .detail-proof-logo { background: #fff; }
.discipline-connections { display: flex; flex-wrap: wrap; margin: 2.5rem 0 1.5rem; border-top: 1px solid var(--line); }
.discipline-connections a { display: flex; flex-direction: column; flex: 1 1 220px; gap: .5rem; padding: 1.6rem 2rem 1.6rem 0; }
.discipline-connections a strong { font-size: 1.2rem; }
.discipline-connections a > span { color: var(--text-soft); font-size: .8rem; }
.discipline-connections a:hover strong { text-decoration: underline; }
.integration-contract, .data-story { background: var(--paper); padding-block: var(--space-section); }
.integration-principles { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 5%; margin-top: 3rem; }
.integration-principles article { border-top: 1px solid var(--technical-line); padding-top: 1rem; }
.integration-principles h3 { font-size: 1.5rem; margin: 1rem 0; }
.integration-principles p { color: var(--text-soft); font-size: .95rem; }
.data-stages { display: flex; gap: 4rem; list-style: none; padding: 0; margin: 3.5rem 0 0; }
.data-stages li { flex: 1; position: relative; border-top: 1px solid var(--technical-line); padding-top: 1rem; }
.data-stages li:not(:last-child)::after { content: '→'; position: absolute; right: -2.6rem; top: -.85rem; color: var(--technical-active); }
.data-stages h3 { margin: 1.5rem 0 1rem; font-size: 1.6rem; }
.data-stages p { color: var(--text-soft); font-size: .95rem; }
.data-stages li > span { font: .8rem ui-monospace, monospace; }
.home-applications { padding-block: var(--space-section); }
.home-applications .scenario-list { margin-top: 3rem; }
.approach-it-link { display: grid; grid-template-columns: 1fr 1fr; gap: 8%; }
.approach-it-link h2 { font-size: 2.5rem; }
.brand-contact-page .intake-intro h1 { font-size: clamp(2.8rem,4.2vw,4.3rem); }

/* Reveal is an enhancement. JS arms only offscreen compositions; failures, no-JS
   and reduced motion leave every piece of content visible. */
[data-reveal].reveal-pending { opacity: 0; transform: translateY(24px); }
[data-reveal].is-revealed { opacity: 1; transform: none; transition: opacity var(--motion-reveal) var(--ease-precise), transform var(--motion-reveal) var(--ease-precise); }
[data-reveal]:focus-within { opacity: 1; transform: none; }

@media (max-width: 1200px) {
  .design-page .main-nav { display: none; }
  .design-page .mobile-menu { display: block; margin-left: .5rem; }
  .design-page .language-switcher { margin-left: auto; }
  .mobile-menu summary { display: flex; align-items: center; gap: .8rem; list-style: none; padding: .5rem; min-height: 44px; cursor: pointer; font-size: .9rem; }
  .mobile-menu summary::-webkit-details-marker { display: none; }
  .mobile-menu summary span { font-size: 1.4rem; line-height: 1; transition: transform var(--motion-fast); }
  .mobile-menu[open] summary span { transform: rotate(45deg); }
  .mobile-menu nav { position: absolute; top: 100%; left: -36px; right: -36px; display: flex; flex-direction: column; padding: 1rem 36px 1.5rem; border-bottom: 1px solid var(--line); background: #fff; box-shadow: 0 12px 20px #092b4910; max-height: calc(100dvh - 90px); overflow-y: auto; }
  .design-page .mobile-menu nav a { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem 1rem; min-height: 44px; padding-block: .55rem; color: var(--text); font-size: .9rem; }
  .design-page .mobile-menu nav a.nav-support { background: transparent; border-color: var(--line); }
  .brand-hero-layout { gap: 0; grid-template-columns: 1fr 1fr; }
  .design-page .brand-hero h1 { font-size: clamp(3rem,5.6vw,4.5rem); }
  .system-label > span { max-width: 20ch; font-size: .6rem; }
  .system-caption { flex-direction: column; align-items: flex-start; gap: 0; }
  .discipline-entry-it { padding: 2rem; }
  .discipline-entry-automate, .discipline-entry-integrate { padding: 2rem; grid-template-columns: 1fr; }
  .discipline-entry-automate .discipline-diagram, .discipline-entry-integrate .discipline-diagram { display: none; }
  .project-steps { gap: 1.5rem; }
  .design-page .project-steps h3 { font-size: 1.2rem; }
  .design-page .footer-navigation { grid-template-columns: 1fr 1fr; gap: 3rem; }
}
@media (max-width: 900px) {
  .brand-hero-layout { grid-template-columns: 1fr; padding-bottom: 1rem; }
  .brand-hero-copy { max-width: 680px; }
  .design-page .brand-hero h1 { font-size: clamp(3.3rem,8.5vw,5rem); }
  .brand-hero-copy .hero-text { max-width: 52ch; }
  .system-composition { max-width: 580px; width: 100%; margin: 1rem auto 0; }
  .system-wordmark { font-size: 1.55rem; }
  .system-wordmark span { font-size: .4rem; }
  .system-label strong { font-size: 1rem; }
  .system-label > span { font-size: .68rem; }
  .system-caption { flex-direction: row; align-items: center; }
  .brand-section-heading { grid-template-columns: 1fr; gap: 1.3rem; }
  .brand-section-heading .section-kicker { margin-bottom: 0; }
  .project-steps { grid-template-columns: 1fr 1fr; gap: 2.5rem; }
  .brand-person .home-person-layout { gap: 6%; }
  .scenario-list article { grid-template-columns: 35px 1fr 1fr; gap: 4%; }
  .discipline-hero-layout { gap: 4%; }
  .design-page .discipline-hero h1 { font-size: clamp(2.7rem,5.7vw,4rem); }
  .before-after-list article { grid-template-columns: 1fr 1fr; gap: 1rem 5%; }
  .before-after-list h3 { grid-column: 1 / -1; }
  .integration-principles { gap: 3%; }
  .editorial-split { gap: 6%; }
}
@media (max-width: 620px) {
  .design-page .container { width: calc(100% - 40px); }
  .design-page .header-inner { gap: .7rem; min-height: 78px; }
  .design-page .brand img { width: 112px; }
  .design-page .header-inner > .button-sm { display: none; }
  .design-page .language-switcher { gap: .4rem; }
  .design-page .language-switcher a { min-width: 44px; justify-content: center; font-size: .66rem; }
  .design-page .mobile-menu { margin-left: 0; }
  .mobile-menu nav { left: -20px; right: -20px; padding-inline: 20px; max-height: calc(100dvh - 78px); }
  .mobile-menu summary { font-size: .78rem; padding-inline: 0; gap: .25rem; }
  .brand-hero-layout { padding-top: 2.6rem; }
  .design-page .brand-hero h1 { font-size: clamp(2.9rem,10.3vw,4.2rem); line-height: 1.08; }
  .brand-hero .section-kicker { font-size: .6rem; letter-spacing: .07em; }
  .brand-hero-copy .hero-text { font-size: 1rem; }
  .brand-hero .hero-actions { gap: .5rem 1rem; }
  .brand-hero .hero-footnote { font-size: .7rem; }
  .hero-baseline { font-size: .6rem; }
  .hero-baseline > span:last-child { display: none; }
  .system-composition { margin-block: .2rem 0; }
  .system-label strong { font-size: .82rem; }
  .system-label > span { font-size: .58rem; max-width: 20ch; }
  .system-label-it, .system-label-data { left: 2%; }
  .system-label-automate, .system-label-integrate { left: 56%; }
  .system-wordmark { font-size: 1rem; }
  .system-wordmark span { font-size: .25rem; margin-top: .45rem; }
  .system-caption { padding-inline: 2%; font-size: .55rem; gap: .7rem; }
  .system-composition .system-packet, .system-composition .system-matrix { animation-duration: 8s !important; }
  .brand-proof .proof-heading { gap: 1rem; display: flex; flex-wrap: wrap; }
  .brand-proof .client-logo-wall { grid-template-columns: repeat(3,minmax(0,1fr)); gap: 1rem; }
  .brand-proof .trust-logo:last-child { grid-column: auto; }
  .brand-proof .trust-logo img { height: 40px; }
  .brand-proof .trust-logo { min-height: 52px; }
  .brand-proof .text-link { font-size: .8rem; }
  .discipline-composition { grid-template-columns: 1fr; }
  .discipline-entry { padding: 2rem 0; }
  .discipline-entry-it { grid-row: auto; padding: 2rem 1.4rem; }
  .discipline-entry-it .discipline-diagram { max-height: 200px; margin-top: 1rem; }
  .discipline-entry-data { grid-column: auto; grid-template-columns: 1fr; }
  .discipline-entry-data .discipline-diagram { max-height: 180px; margin-top: 1rem; }
  .design-page .discipline-entry h3 { font-size: 2rem; }
  .brand-statement p:last-of-type { margin-left: 0; }
  .statement-path { width: 100%; bottom: -70px; }
  .scenario-list article { grid-template-columns: 24px 1fr; gap: .8rem 1rem; padding-block: 1.8rem; }
  .scenario-list article > div { grid-column: 2; }
  .scenario-list h3 { font-size: 1.6rem; }
  .project-steps, .project-steps-detailed { grid-template-columns: 1fr; gap: 1.5rem; }
  .project-steps .service-number { margin-bottom: .65rem; }
  .design-page .project-steps h3 { font-size: 1.45rem; }
  .brand-person .home-person-layout { grid-template-columns: 1fr; gap: 2.5rem; }
  .founder-photo { max-width: 340px; }
  .founder-email { display: flex; margin-left: 0; }
  .home-vertical-layout { grid-template-columns: 1fr; gap: 1rem; }
  .home-vertical .discipline-diagram { max-height: 180px; }
  .discipline-hero-layout, .editorial-split, .approach-it-link { grid-template-columns: 1fr; gap: 2rem; }
  .design-page .discipline-hero h1 { font-size: clamp(2.6rem,10vw,3.8rem); }
  .discipline-figure .discipline-diagram { max-height: 230px; }
  .discipline-figure figcaption { font-size: .7rem; margin-top: 0; }
  .before-after-list article { grid-template-columns: 1fr; gap: 1.2rem; }
  .integration-principles { grid-template-columns: 1fr; gap: 2rem; }
  .data-stages { flex-direction: column; gap: 2rem; }
  .data-stages li:not(:last-child)::after { display: none; }
  .data-stages h3 { margin-top: .8rem; }
  .design-page .footer-navigation { grid-template-columns: 1fr 1fr; gap: 2rem 1rem; }
  .design-page .footer-navigation a { min-height: 44px; font-size: .8rem; overflow-wrap: anywhere; }
  .design-page .footer-direct .footer-phone { font-size: 1.05rem; }
  .footer-direct .footer-social { flex-wrap: wrap; gap: .5rem; }
  .design-page .footer-areas a { min-height: 44px; display: inline-flex; align-items: center; }
}
@media (max-width: 360px) {
  .design-page .site-header .container { width: calc(100% - 24px); }
  .design-page .header-inner { gap: .35rem; }
  .design-page .header-inner .brand img { width: 90px; }
  .design-page .language-switcher { gap: 0; }
  .mobile-menu nav { left: -12px; right: -12px; padding-inline: 20px; }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation: none !important; transition-duration: .01ms !important; }
  [data-reveal].reveal-pending { opacity: 1; transform: none; }
  .system-field { transform: none !important; }
  .system-caption button { display: none; }
  .system-composition[data-active="data"] .system-data circle { transform: none; }
}