@charset "UTF-8";
:root {
  color-scheme: light;
  --paper: #f3f1e8;
  --paper-deep: #e9e8dc;
  --ink: #17211b;
  --muted: #667068;
  --forest: #183c2e;
  --forest-deep: #10291f;
  --sage: #61705b;
  --lime: #c2df3b;
  --rose: #d99eb5;
  --line: rgba(23, 33, 27, 0.16);
  --max-width: 1320px;
  --page-gutter: clamp(22px, 5.6vw, 88px);
  --header-height: 96px;
  font-family: "Lato", "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-synthesis: none;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  scroll-behavior: smooth;
}
* { box-sizing: border-box; }
html { background: var(--paper); scroll-padding-top: var(--header-height); }
body { margin: 0; color: var(--ink); background: var(--paper); font-size: 16px; line-height: 1.55; }
body, button, input, select, textarea, a { font-family: "Lato", "Helvetica Neue", Helvetica, Arial, sans-serif; }
@font-face { font-family: "Lato"; font-style: normal; font-weight: 300; font-display: swap; src: url("/fonts/lato-light-300.woff2") format("woff2"); }
@font-face { font-family: "Lato"; font-style: normal; font-weight: 400; font-display: swap; src: url("/fonts/lato-regular-400.woff2") format("woff2"); }
@font-face { font-family: "Lato"; font-style: normal; font-weight: 700; font-display: swap; src: url("/fonts/lato-bold-700.woff2") format("woff2"); }
@font-face { font-family: "Lato"; font-style: italic; font-weight: 400; font-display: swap; src: url("/fonts/lato-italic-400.woff2") format("woff2"); }
h1, h2, h3, .hero-manifesto { font-family: "Lato", "Helvetica Neue", Helvetica, Arial, sans-serif; }
a { color: inherit; }
img { display: block; max-width: 100%; }
button { color: inherit; }
::selection { color: var(--ink); background: var(--lime); }
.skip-link { position: absolute; left: 16px; top: -60px; z-index: 100; padding: 12px 16px; background: var(--lime); color: var(--ink); font-weight: 700; text-decoration: none; }
.skip-link:focus { top: 16px; }
.section-wrap { width: min(100% - var(--page-gutter) * 2, var(--max-width)); margin-inline: auto; }
.site-header { position: sticky; top: 0; z-index: 20; border-bottom: 1px solid var(--line); background: var(--paper); }
.header-inner { width: min(100% - var(--page-gutter) * 2, var(--max-width)); min-height: 96px; margin-inline: auto; display: grid; grid-template-columns: 150px 1fr auto; align-items: center; gap: clamp(24px, 5vw, 76px); }
.brand { display: inline-flex; width: 142px; align-items: center; }
.brand img { width: 100%; height: auto; }
.main-nav { display: flex; align-items: center; justify-content: flex-end; gap: clamp(20px, 3vw, 42px); }
.main-nav a, .header-cta { font-size: 13px; font-weight: 650; text-decoration: none; }
.main-nav a { position: relative; padding-block: 8px; }
.main-nav a::after { position: absolute; right: 0; bottom: 2px; left: 0; height: 1px; background: var(--ink); content: ""; transform: scaleX(0); transform-origin: right; transition: transform 180ms ease; }
.main-nav a:hover::after, .main-nav a:focus-visible::after { transform: scaleX(1); transform-origin: left; }
.header-cta { display: inline-flex; min-height: 52px; align-items: center; gap: 12px; padding: 13px 16px; border: 1px solid var(--lime); border-radius: 2px; color: var(--ink); background: var(--lime); transition: background 180ms ease, color 180ms ease, border-color 180ms ease; }
.header-cta:hover, .header-cta:focus-visible { color: var(--paper); background: #454a46; border-color: #454a46; }
.button-brand-mark { display: inline-block; flex: 0 0 18px; width: 18px; height: 18px; background-color: currentColor; -webkit-mask: url('/manus-storage/gron-oe-mark_cb4d479f.png') center / contain no-repeat; mask: url('/manus-storage/gron-oe-mark_cb4d479f.png') center / contain no-repeat; }
.menu-toggle { display: none; }
.hero {
  --hero-image: url('/manus-storage/async-images/CDshxIhJ63wSZgOjBFUGfU/image-1.webp');
  --hero-overlay: linear-gradient(90deg, rgba(79, 97, 79, .96) 0%, rgba(79, 97, 79, .86) 38%, rgba(79, 97, 79, .50) 70%, rgba(79, 97, 79, .30) 100%);
  --hero-zoom-start: 1.28;
  position: relative; isolation: isolate; overflow: hidden; display: flex; width: 100%; min-height: clamp(640px, 54vw, 780px); align-items: center; padding: clamp(62px, 7vw, 104px) max(var(--page-gutter), calc((100vw - var(--max-width)) / 2)); color: var(--paper); background-color: #4f614f;
}
.hero::before, .hero::after { position: absolute; inset: 0; pointer-events: none; content: ""; }
.hero::before { z-index: 0; background-image: var(--hero-image); background-position: center; background-size: cover; transform-origin: 65% 50%; }
.hero::after { z-index: 1; background-image: var(--hero-overlay); }
.hero-copy { position: relative; z-index: 2; max-width: 760px; }
.hero .eyebrow { color: rgba(243, 241, 232, .82); }
.eyebrow { margin: 0; color: var(--muted); font-size: 11px; font-weight: 700; letter-spacing: .13em; line-height: 1.4; text-transform: uppercase; }
.eyebrow-dot { display: inline-block; width: 8px; height: 8px; margin-right: 9px; border-radius: 50%; background: var(--lime); vertical-align: 1px; }
.hero h1 { margin: 12px 0 20px; color: var(--lime); font-size: 78px; font-weight: 300; letter-spacing: .01em; line-height: .85; }
.hero h1 .hero-line { display: block; }
.hero h1 .hero-word { display: block; }
@keyframes hero-line-in {
  from { opacity: 0; }
  to { opacity: 1; }
}
@media (prefers-reduced-motion: no-preference) {
  .hero::before { transform: scale(var(--hero-image-scale, var(--hero-zoom-start))); }
  .hero h1 .hero-word { animation: hero-line-in 1600ms ease-in-out both; }
  .hero h1 .hero-line:nth-child(2) .hero-word { animation-delay: 240ms; }
  .hero h1 .hero-line:nth-child(3) .hero-word { animation-delay: 480ms; }
}
.hero-manifesto { margin: 30px 0 0; color: var(--paper); font-size: clamp(21px, 2.15vw, 29px); font-weight: 540; letter-spacing: -.015em; line-height: 1.16; }
.hero-description { max-width: 490px; margin: 18px 0 0; color: rgba(243, 241, 232, .88); font-size: 16px; line-height: 1.7; }
.hero-actions { display: flex; align-items: center; flex-wrap: wrap; gap: 24px; margin-top: 29px; }
.button { min-height: 52px; display: inline-flex; align-items: center; justify-content: center; gap: 30px; padding: 0 20px; border: 1px solid transparent; border-radius: 2px; font-size: 13px; font-weight: 700; text-decoration: none; transition: transform 180ms ease, background 180ms ease, color 180ms ease; }
.button:hover, .button:focus-visible { transform: translateY(-2px); }
.button-dark { color: var(--ink); background: var(--lime); border-color: var(--lime); }
.button-dark:hover, .button-dark:focus-visible { color: var(--paper); background: #454a46; border-color: #454a46; }
.button span { font-size: 17px; }
.hero-actions .button { width: min(218px, 100%); justify-content: flex-start; gap: 12px; }
.text-link { padding-block: 8px; font-size: 13px; font-weight: 700; text-decoration: none; border-bottom: 1px solid var(--ink); transition: color 180ms ease, border-color 180ms ease; }
.hero .text-link { color: var(--paper); border-bottom-color: rgba(243, 241, 232, .68); }
.hero .text-link:hover, .hero .text-link:focus-visible { color: var(--paper); border-bottom-color: var(--lime); }
.text-link:hover, .text-link:focus-visible { color: #454a46; border-bottom-color: var(--lime); }
.text-link span { padding-left: 8px; }
.hero-facts { display: flex; flex-wrap: wrap; gap: 8px 19px; margin-top: 42px; color: rgba(243, 241, 232, .78); font-size: 10px; font-weight: 650; letter-spacing: .06em; text-transform: uppercase; }
.hero-facts span + span::before { display: inline-block; width: 4px; height: 4px; margin: 0 12px 2px 0; border-radius: 50%; background: var(--lime); content: ""; }
.caption-label { color: var(--muted); font-size: 9px; font-weight: 700; letter-spacing: .13em; text-transform: uppercase; }
.client-strip { border-block: 1px solid var(--line); }
.client-strip-inner { width: min(100% - var(--page-gutter) * 2, var(--max-width)); margin-inline: auto; display: grid; grid-template-columns: 70px minmax(0, 1fr); align-items: center; gap: 25px; padding-block: 26px; }
.client-strip-label { color: var(--muted); font-size: 9px; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; }
.client-logos { display: grid; grid-template-columns: repeat(8, minmax(0, 1fr)); align-items: center; gap: 22px; }
.client-logo { display: flex; min-width: 0; height: 54px; align-items: center; justify-content: center; }
.client-logo img { width: auto; height: auto; max-width: 100%; max-height: 42px; object-fit: contain; }
.client-logo--nehlsen img, .client-logo--sweco img, .client-logo--encoway img { width: 105px; }
.client-logo--university img { width: 100px; }
.client-logo--hansa img, .client-logo--adfc img { width: 110px; }
.client-logo--werder img { height: 46px; max-height: 46px; }
.client-logo--steptext img { width: 66px; }
.work-section { padding-block: clamp(90px, 11vw, 155px); }
.section-heading { display: grid; grid-template-columns: 1fr minmax(240px, .55fr); align-items: end; gap: 40px; margin-bottom: 49px; }
.section-kicker { display: inline-flex; align-items: center; max-width: 100%; margin-bottom: 18px; padding: 5px 8px; color: var(--ink); background: var(--lime); }
.section-kicker span { padding-inline: 5px; color: inherit; }
.section-heading h2, .proof-heading h2 { margin: 0; font-size: clamp(2.6rem, 5vw, 5rem); font-weight: 620; letter-spacing: -.035em; line-height: .98; }
.section-intro { max-width: 390px; margin: 0 0 5px auto; color: #626c63; font-size: 15px; line-height: 1.7; }
.text-highlight { padding: .12em .3em; color: var(--ink); background: var(--lime); -webkit-box-decoration-break: clone; box-decoration-break: clone; }
.project-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: clamp(22px, 3.8vw, 55px); row-gap: clamp(48px, 6vw, 82px); }
.project-card { min-width: 0; }
.reference-window { margin-top: clamp(72px, 9vw, 122px); padding-top: clamp(30px, 4vw, 52px); border-top: 1px solid var(--line); }
.reference-window > h3 { margin: 0 0 clamp(22px, 3vw, 38px); font-size: clamp(2rem, 3.8vw, 3.8rem); font-weight: 620; letter-spacing: -.035em; line-height: 1; }
.reference-window-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(14px, 2vw, 28px); }
.reference-window-item { min-width: 0; margin: 0; background: var(--paper-deep); }
.reference-window-item img { display: block; width: 100%; max-width: 100%; height: auto; aspect-ratio: 564 / 473; object-fit: contain; }
.reference-window-item figcaption { margin-top: 11px; color: #59645b; font-size: clamp(12px, 1.05vw, 14px); font-weight: 600; line-height: 1.45; }
.showcase-page-hero { color: var(--paper); background: var(--forest-deep); }
.showcase-page-hero .section-wrap { padding-block: clamp(42px, 5.5vw, 78px) clamp(52px, 7vw, 100px); }
.showcase-page-title-row { display: flex; align-items: end; justify-content: space-between; gap: 24px; margin-top: clamp(34px, 5vw, 66px); }
.showcase-page-title { margin: 0; color: var(--paper); font-size: clamp(3.4rem, 9vw, 8rem); font-weight: 300; letter-spacing: -.045em; line-height: .86; }
.showcase-page-count { flex: 0 0 auto; margin: 0 0 5px; color: var(--lime); font-size: clamp(16px, 2vw, 21px); font-weight: 650; }
.showcase-page-gallery { padding-block: clamp(38px, 6vw, 84px) clamp(65px, 8vw, 112px); }
.showcase-page-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(20px, 3vw, 42px) clamp(18px, 2.5vw, 34px); }
.project-card-link { display: block; color: inherit; text-decoration: none; }
.project-image { position: relative; aspect-ratio: 1.6; overflow: hidden; padding: 0; background: var(--paper-deep); }
.project-image img { width: 100%; height: 100%; object-fit: cover; object-position: center; }
.project-card--logo .project-image { background: #f5f2e9; }
.project-card--logo .project-image img { position: absolute; top: 6%; left: 22.5%; width: 55%; height: 40%; object-fit: contain; object-position: center; }
.project-card .project-image img { filter: brightness(.42) saturate(.78); transition: filter 360ms ease; }
.project-card .project-image::after { position: absolute; inset: 0; background: linear-gradient(180deg, rgba(5, 13, 9, .22), rgba(5, 13, 9, .52)); content: ""; transition: opacity 360ms ease; }
.project-overlay { position: absolute; z-index: 2; inset: 0; display: flex; flex-direction: column; align-items: flex-start; justify-content: space-between; padding: clamp(20px, 3vw, 36px); color: #fff; opacity: 1; transition: opacity 280ms ease, transform 280ms ease; }
.project-card .project-number { top: 18px; right: 18px; left: auto; width: auto; height: auto; padding: 2px; color: rgba(255,255,255,.8); background: transparent; font-size: 11px; }
.project-overlay-copy { width: 100%; max-width: 520px; margin-top: auto; }
.project-overlay-copy h3 { margin: 0; color: var(--lime); font-size: clamp(22px, 2.8vw, 38px); font-weight: 800; letter-spacing: .025em; line-height: 1.15; text-transform: uppercase; }
.project-card .project-overlay-copy p { max-width: 390px; margin: 10px 0 0; color: #fff; font-size: 15px; font-weight: 600; line-height: 1.5; }
@media (hover: hover) and (pointer: fine) {
  .project-card:hover .project-image img { filter: none; }
  .project-card:hover .project-image::after { opacity: 0; }
  .project-card:hover .project-overlay { opacity: 0; }
}
.project-card:focus-within .project-image img { filter: none; }
.project-card:focus-within .project-image::after { opacity: 0; }
.project-card:focus-within .project-overlay { opacity: 0; }
.project-number { position: absolute; top: 12px; left: 12px; width: 30px; height: 30px; display: grid; place-items: center; background: var(--paper); font-size: 10px; font-weight: 750; }
.services-section { color: #f2f2e9; background: var(--forest); }
.services-inner { padding-block: clamp(82px, 10vw, 140px); }
.section-heading-light { margin-bottom: 48px; }
.section-heading-light .eyebrow { color: var(--ink); }
.section-heading-light .section-kicker span { color: var(--ink); }
.section-heading-light .section-intro { color: #c4cec6; font-size: 16px; }
.service-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); border-top: 1px solid rgba(245, 247, 238, .27); border-bottom: 1px solid rgba(245, 247, 238, .27); }
.service-card { position: relative; min-height: 280px; padding: 24px clamp(20px, 3vw, 39px) 34px 0; }
.service-card + .service-card { padding-left: clamp(20px, 3vw, 39px); border-left: 1px solid rgba(245, 247, 238, .27); }
.service-index { color: var(--lime); font-size: 10px; font-weight: 700; letter-spacing: .1em; }
.service-card h3 { margin: 50px 0 10px; font-size: clamp(25px, 3vw, 39px); font-weight: 550; letter-spacing: -.025em; }
.service-card p { max-width: 330px; margin: 0; color: #c5d0c7; font-size: 16px; line-height: 1.65; }
.service-arrow { position: absolute; top: 20px; right: 18px; color: var(--lime); font-size: 19px; }
.partner-note { display: flex; align-items: center; gap: 19px; max-width: 760px; margin: 38px 0 0 auto; }
.partner-mark { width: 38px; height: 38px; flex: 0 0 38px; display: grid; place-items: center; border: 1px solid rgba(194, 223, 59, .75); border-radius: 50%; color: var(--lime); font-size: 23px; font-weight: 300; }
.partner-note p { margin: 0; color: #cbd4ce; font-size: 15px; line-height: 1.65; }
.partner-note strong { color: var(--paper); font-weight: 700; }
.collective-section { display: grid; grid-template-columns: minmax(0, 1fr) minmax(320px, .8fr); gap: clamp(55px, 10vw, 145px); padding-block: clamp(94px, 12vw, 165px); }
.collective-intro h2 { max-width: 690px; margin: 0; font-size: clamp(3.2rem, 6.4vw, 6.1rem); font-weight: 620; letter-spacing: -.035em; line-height: .94; }
.collective-intro h2 em, .contact-main h2 em { color: #718b32; font-family: inherit; font-weight: 400; }
.collective-intro > p:not(.eyebrow) { max-width: 540px; margin: 27px 0 0; color: #59645b; font-size: 16px; line-height: 1.7; }
.art-director { display: flex; align-items: center; gap: 18px; margin-top: 34px; }
.initials { width: 43px; height: 43px; display: grid; place-items: center; border-radius: 50%; color: var(--ink); background: var(--lime); font-size: 12px; font-weight: 750; }
.art-director div { display: grid; gap: 2px; }
.art-director strong { font-size: 18px; }
.art-director div span { color: var(--muted); font-size: 13px; }
.collective-intro .art-director-bio { margin-top: 16px; }
.art-director-photo { display: block; flex: 0 0 auto; width: 112px; height: 112px; border-radius: 50%; object-fit: cover; object-position: 50% 40%; }
.process-list { align-self: center; border-top: 1px solid var(--line); }
.process-item { display: grid; grid-template-columns: 44px minmax(0, 1fr); gap: 20px; padding: 30px 0; border-bottom: 1px solid var(--line); }
.process-item > span { padding-top: 5px; color: #74822f; font-size: 14px; font-weight: 750; letter-spacing: .08em; }
.process-item h3 { margin: 0; font-size: 26px; font-weight: 620; letter-spacing: -.01em; line-height: 1.2; }
.process-item p { max-width: 400px; margin: 8px 0 0; color: #667068; font-size: 16px; line-height: 1.6; }
.proof-section { background: var(--paper-deep); }
.proof-inner { display: grid; grid-template-columns: .78fr 1fr; gap: clamp(48px, 8vw, 110px); padding-block: clamp(80px, 9.5vw, 132px); }
.proof-heading h2 { font-size: clamp(2.7rem, 4.8vw, 4.4rem); }
.proof-content { border-top: 1px solid rgba(23,33,27,.2); }
.award-row { min-height: 76px; display: grid; grid-template-columns: 58px minmax(0, 1fr) 130px; align-items: center; gap: 14px; border-bottom: 1px solid rgba(23,33,27,.2); }
.award-year { color: #6d783f; font-size: 11px; font-weight: 750; }
.award-row div { display: grid; gap: 2px; }
.award-row strong { font-size: 14px; font-weight: 700; }
.award-row div span { color: var(--muted); font-size: 11px; }
.award-logo { width: 120px; height: 32px; justify-self: end; object-fit: contain; }
.award-logo--gma { width: 108px; }
.award-logo--dap { width: 128px; }
.proof-statement { max-width: 440px; margin: 25px 0 0; color: #4f5b53; font-size: 16px; font-weight: 600; line-height: 1.6; }
.proof-client-list { display: flex; flex-wrap: wrap; gap: 10px 21px; margin-top: 13px; }
.proof-client-list span { color: #4f5b53; font-size: 12px; font-weight: 650; }
.contact-section { color: var(--paper); background: var(--forest-deep); }
.contact-inner { display: grid; grid-template-columns: minmax(0, 1fr) minmax(300px, .66fr); gap: clamp(50px, 10vw, 150px); padding-block: clamp(83px, 10vw, 142px); }
.contact-main .section-kicker { color: var(--ink); }
.contact-main h2 { margin: 23px 0 0; font-size: clamp(3.4rem, 6.8vw, 6.5rem); font-weight: 600; letter-spacing: -.035em; line-height: .91; }
.contact-main h2 em { color: var(--lime); }
.contact-main > p:not(.eyebrow) { max-width: 380px; margin: 22px 0 0; color: #c5d0c7; font-size: 15px; line-height: 1.65; }
.button-lime { margin-top: 28px; color: var(--ink); background: var(--lime); border-color: var(--lime); }
.button-lime:hover, .button-lime:focus-visible { color: var(--paper); background: #454a46; border-color: #454a46; }
.contact-details { align-self: end; border-top: 1px solid rgba(245,247,238,.3); }
.contact-line { display: grid; grid-template-columns: 77px 1fr 20px; align-items: center; gap: 13px; min-height: 75px; border-bottom: 1px solid rgba(245,247,238,.3); text-decoration: none; }
a.contact-line:hover strong, a.contact-line:focus-visible strong { color: var(--lime); }
.contact-line > span:first-child { color: #aab9ae; font-size: 10px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; }
.contact-line strong { font-size: 13px; font-weight: 600; transition: color 160ms ease; }
.contact-line > span:last-child { color: var(--lime); font-size: 16px; }
.contact-address { align-items: start; padding-block: 19px; }
.contact-address > span:first-child { padding-top: 4px; }
.contact-address strong { line-height: 1.6; }
.remote-note { margin: 15px 0 0; color: #b8c5bb; font-size: 11px; }
.site-footer { color: var(--ink); background: #ffffff; }
.footer-inner { display: grid; grid-template-columns: 140px 1fr auto; align-items: center; gap: 18px 34px; padding-block: 28px 25px; }
.footer-brand { width: 126px; }
.footer-brand img { width: 100%; height: auto; }
.footer-motto { margin: 0; color: var(--ink); font-size: 11px; font-weight: 650; }
.footer-links { display: flex; gap: 20px; }
.footer-links a { color: var(--ink); font-size: 10px; text-decoration: none; }
.footer-links a:hover, .footer-links a:focus-visible { color: var(--forest-deep); }
.copyright { grid-column: 1 / -1; margin: 4px 0 0; padding-top: 17px; border-top: 1px solid rgba(23,33,27,.22); color: rgba(23,33,27,.78); font-size: 10px; }
.quick-contact { position: fixed; z-index: 30; top: 50%; left: 0; display: flex; flex-direction: column; gap: 1px; transform: translateY(-50%); }
.quick-contact a { width: 44px; height: 44px; display: grid; place-items: center; border: 1px solid rgba(23,33,27,.12); color: var(--ink); background: var(--rose); transition: color 180ms ease, background 180ms ease, border-color 180ms ease, transform 180ms ease; }
.quick-contact a:hover, .quick-contact a:focus-visible { color: var(--paper); background: #454a46; border-color: #454a46; transform: translateX(3px); }
.quick-contact svg { width: 21px; height: 21px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
:focus-visible { outline: 3px solid #799d15; outline-offset: 4px; }
.legal-main { padding-block: clamp(48px, 7.4vw, 96px) clamp(72px, 8vw, 120px); }
.legal-heading { margin-bottom: clamp(34px, 5vw, 60px); padding-bottom: clamp(28px, 4vw, 44px); border-bottom: 1px solid var(--line); }
.legal-back { display: flex; width: fit-content; align-items: center; gap: 9px; margin-bottom: 32px; color: var(--muted); font-size: 13px; font-weight: 650; text-decoration: none; }
.legal-back:hover, .legal-back:focus-visible { color: var(--ink); }
.legal-heading h1 { margin: 0; font-size: clamp(42px, 7vw, 90px); font-weight: 300; letter-spacing: .005em; line-height: 1.05; overflow-wrap: anywhere; }
.legal-content { max-width: 760px; color: var(--ink); font-size: 16px; line-height: 1.8; overflow-wrap: anywhere; }
.legal-content > :first-child { margin-top: 0; }
.legal-content p { margin: 0 0 20px; }
.legal-content h2 { margin: 42px 0 16px; font-size: 27px; font-weight: 700; line-height: 1.3; }
.legal-content h3, .legal-content h4 { margin: 30px 0 13px; font-size: 21px; font-weight: 700; line-height: 1.35; }
.legal-content ul, .legal-content ol { margin: 0 0 24px; padding-left: 23px; }
.legal-content li { margin-bottom: 10px; }
.legal-content a { text-decoration-thickness: 1px; text-underline-offset: 3px; }
.legal-content a:hover, .legal-content a:focus-visible { color: var(--forest); }
.footer-links a[aria-current="page"] { text-decoration: underline; text-underline-offset: 4px; }
.case-hero { color: var(--paper); background: var(--forest-deep); }
.case-hero-inner { padding-block: clamp(52px, 7vw, 104px) clamp(68px, 9vw, 138px); }
.case-back { display: inline-flex; align-items: center; gap: 9px; margin-bottom: 34px; color: rgba(243, 241, 232, .76); font-size: 13px; font-weight: 650; text-decoration: none; }
.case-back:hover, .case-back:focus-visible { color: var(--lime); }
.case-hero-grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(260px, .48fr); align-items: end; gap: clamp(42px, 8vw, 130px); margin-top: 31px; }
.case-hero h1 { margin: 0; color: var(--paper); font-size: clamp(4.3rem, 10vw, 9.8rem); font-weight: 300; letter-spacing: -.045em; line-height: .82; }
.case-hero h1 em { color: var(--lime); font-family: inherit; font-style: normal; font-weight: inherit; }
.case-client { margin: 22px 0 0; color: rgba(243, 241, 232, .8); font-size: clamp(17px, 2vw, 22px); font-weight: 550; }
.case-facts { margin: 0; border-top: 1px solid rgba(243, 241, 232, .28); }
.case-facts div { display: grid; grid-template-columns: 88px minmax(0, 1fr); gap: 14px; padding: 17px 0; border-bottom: 1px solid rgba(243, 241, 232, .28); }
.case-facts dt { color: #afc3b2; font-size: 10px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; }
.case-facts dd { margin: 0; color: var(--paper); font-size: 14px; line-height: 1.45; }
.case-main-image { margin: 0; background: #3d332d; }
.case-main-image img { display: block; width: min(100%, 1536px); height: auto; margin: auto; }
.case-main-image figcaption { width: min(100% - var(--page-gutter) * 2, var(--max-width)); margin: 0 auto; padding: 13px 0 15px; color: rgba(243, 241, 232, .72); font-size: 10px; font-weight: 650; letter-spacing: .08em; text-transform: uppercase; }
.case-intro { padding-block: clamp(78px, 11vw, 150px); }
.case-intro > .section-kicker { margin-bottom: clamp(38px, 6vw, 76px); }
.case-intro-grid { display: grid; grid-template-columns: minmax(0, .96fr) minmax(280px, .74fr); gap: clamp(42px, 9vw, 145px); }
.case-intro h2, .case-system h2, .case-gallery h2, .case-outro h2 { margin: 0; font-size: clamp(3.1rem, 6.4vw, 6.3rem); font-weight: 620; letter-spacing: -.04em; line-height: .91; }
.case-copy { max-width: 500px; color: #59645b; font-size: 16px; line-height: 1.72; }
.case-copy p { margin: 0; }
.case-copy p + p { margin-top: 22px; }
.case-copy .case-lead { color: var(--ink); font-size: clamp(19px, 2.1vw, 25px); font-weight: 650; line-height: 1.35; }
.case-system { color: var(--paper); background: var(--forest); }
.case-system-inner { display: grid; grid-template-columns: minmax(0, .9fr) minmax(300px, .58fr); align-items: center; gap: clamp(48px, 10vw, 168px); padding-block: clamp(78px, 10vw, 142px); }
.case-system-copy > .section-kicker { margin-bottom: 24px; }
.case-system h2 { color: var(--paper); }
.case-system-copy > p:not(.eyebrow) { max-width: 520px; margin: 28px 0 0; color: #c5d0c7; font-size: 16px; line-height: 1.7; }
.case-system-list { max-width: 520px; margin: 41px 0 0; border-top: 1px solid rgba(245,247,238,.27); }
.case-system-list div { display: grid; grid-template-columns: 118px minmax(0, 1fr); gap: 15px; padding: 14px 0; border-bottom: 1px solid rgba(245,247,238,.27); }
.case-system-list dt { color: var(--lime); font-size: 10px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; }
.case-system-list dd { margin: 0; color: var(--paper); font-size: 14px; line-height: 1.45; }
.case-system-sheet, .case-sheet { margin: 0; }
.case-system-sheet { overflow: hidden; background: #fff; }
.case-system-sheet img, .case-sheet img { display: block; width: 100%; height: auto; }
.case-system-sheet figcaption { padding: 13px 16px; color: #5d665f; font-size: 11px; }
.case-gallery { padding-block: clamp(78px, 11vw, 150px); }
.case-gallery-heading { max-width: 740px; margin-bottom: clamp(44px, 6vw, 78px); }
.case-gallery-heading > .section-kicker { margin-bottom: 24px; }
.case-gallery-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: clamp(30px, 5vw, 76px) clamp(22px, 4vw, 64px); }
.case-sheet { border-top: 1px solid var(--line); }
.case-sheet img { margin-top: 16px; border: 1px solid rgba(23,33,27,.08); }
.case-sheet figcaption { max-width: 360px; margin-top: 13px; color: #626c63; font-size: 13px; line-height: 1.5; }
.case-outro { color: var(--ink); background: var(--lime); }
.case-outro-inner { display: flex; align-items: end; justify-content: space-between; gap: 38px; padding-block: clamp(72px, 9vw, 128px); }
.case-outro .eyebrow { color: var(--ink); }
.case-outro h2 { margin-top: 20px; color: var(--ink); }
.case-outro .button { flex: 0 0 auto; color: var(--paper); background: var(--ink); border-color: var(--ink); }
.case-outro .button:hover, .case-outro .button:focus-visible { color: var(--ink); background: var(--paper); border-color: var(--paper); }
.emmi-main-image { background: #f2f1ec; }
.emmi-main-image img { width: min(100%, 700px); }
.emmi-main-image figcaption { color: #59645b; }
.book-case-study .case-hero { background: #376b73; }
.book-case-study .case-hero h1 em { color: #f5d65a; }
.book-case-study .case-back:hover, .book-case-study .case-back:focus-visible { color: #f5d65a; }
.book-case-study .case-facts dt { color: #d8e8e8; }
.book-cover-image { background: #a9d0d4; }
.book-system { background: #254c55; }
.book-system .section-kicker { color: #254c55; background: #f5d65a; }
.book-support { color: #59645b; font-size: 16px; line-height: 1.7; }
.case-copy .book-synopsis { padding-top: 22px; border-top: 1px solid var(--line); }
.book-service-list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 26px; max-width: 520px; margin: 41px 0 0; padding: 0; border-top: 1px solid rgba(245,247,238,.27); list-style: none; }
.book-service-list li { padding: 14px 0; border-bottom: 1px solid rgba(245,247,238,.27); color: var(--paper); font-size: 14px; font-weight: 550; line-height: 1.45; }
.book-layout-sheet { max-width: 520px; justify-self: end; background: #fff; }
.book-outro { background: #f5d65a; }
.book-outro .button { color: var(--paper); background: #254c55; border-color: #254c55; }
.book-outro .button:hover, .book-outro .button:focus-visible { color: #254c55; background: var(--paper); border-color: var(--paper); }
.aseacon-case-study .case-hero { background: #283e47; }
.aseacon-case-study .case-back:hover, .aseacon-case-study .case-back:focus-visible { color: #ee624e; }
.aseacon-case-study .case-facts dt { color: #b7d1d1; }
.aseacon-main-image { background: #c6cdcd; }
.aseacon-system { background: #315866; }
.aseacon-system .section-kicker { color: var(--paper); background: #ee624e; }
.aseacon-story { max-width: 560px; margin-top: 27px; color: #d5e0e1; font-size: 16px; line-height: 1.72; }
.aseacon-story p { margin: 0 0 18px; }
.aseacon-story p:last-child { margin-bottom: 0; }
.aseacon-service-list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 24px; max-width: 560px; margin: 35px 0 0; padding: 0; border-top: 1px solid rgba(245,247,238,.27); list-style: none; }
.aseacon-service-list li { padding: 13px 0; border-bottom: 1px solid rgba(245,247,238,.27); color: var(--paper); font-size: 14px; font-weight: 550; line-height: 1.45; }
.aseacon-service-list li:last-child { grid-column: 1 / -1; }
.aseacon-system-sheet { max-width: 520px; justify-self: end; background: #fff; }
.aseacon-gallery-heading > p:not(.eyebrow) { max-width: 650px; margin: 26px 0 0; color: #59645b; font-size: 16px; line-height: 1.7; }
.aseacon-outro { background: #ee624e; }
.aseacon-outro h2 span { display: inline-block; font-size: .45em; font-weight: 500; letter-spacing: .01em; line-height: 1.25; }
.aseacon-outro .button { color: var(--paper); background: #283e47; border-color: #283e47; }
.aseacon-outro .button:hover, .aseacon-outro .button:focus-visible { color: #283e47; background: var(--paper); border-color: var(--paper); }
@media (max-width: 980px) {
  :root { --page-gutter: clamp(22px, 5vw, 52px); --header-height: 82px; }
  .header-inner { grid-template-columns: 125px 1fr auto; gap: 22px; min-height: 82px; }
  .brand { width: 124px; }
  .main-nav { gap: 18px; }
  .main-nav a, .header-cta { font-size: 12px; }
  .hero h1 { font-size: clamp(3.8rem, 7.7vw, 6rem); }
  .client-strip-inner { grid-template-columns: 1fr; gap: 12px; }
  .client-logos { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 18px 26px; }
  .collective-section { gap: 50px; }
  .contact-inner { gap: 55px; }
}
@media (max-width: 720px) {
  :root { --page-gutter: 22px; --header-height: 74px; }
  .header-inner { position: relative; grid-template-columns: 1fr auto; min-height: 74px; }
  .brand { width: 118px; }
  .menu-toggle { width: 42px; height: 42px; display: grid; align-content: center; justify-items: center; gap: 6px; border: 1px solid var(--line); border-radius: 50%; background: transparent; cursor: pointer; }
  .menu-toggle span { width: 16px; height: 1px; background: var(--ink); transition: transform 160ms ease; }
  .menu-toggle[aria-expanded="true"] span:first-child { transform: translateY(3.5px) rotate(45deg); }
  .menu-toggle[aria-expanded="true"] span:last-child { transform: translateY(-3.5px) rotate(-45deg); }
  .main-nav { position: absolute; top: calc(100% + 1px); right: calc(var(--page-gutter) * -1); left: calc(var(--page-gutter) * -1); display: none; align-items: stretch; gap: 0; padding: 8px var(--page-gutter) 18px; border-bottom: 1px solid var(--line); background: var(--paper); }
  .main-nav.is-open { display: flex; flex-direction: column; }
  .main-nav a { padding: 13px 0; border-bottom: 1px solid var(--line); font-size: 14px; }
  .main-nav a::after { display: none; }
  .header-cta { display: none; }
  .hero { --hero-image: url('/manus-storage/async-images/CDshxIhJ63wSZgOjBFUGfU/image-2.webp'); --hero-overlay: linear-gradient(180deg, rgba(97, 112, 91, .58) 0%, rgba(97, 112, 91, .72) 46%, rgba(97, 112, 91, .94) 100%); --hero-zoom-start: 1.20; min-height: 790px; padding-block: 58px 72px; }
  .hero h1 { margin-top: 10px; font-size: clamp(2.85rem, 15vw, 6rem); }
  .hero-manifesto { margin-top: 24px; }
  .hero-description { font-size: 15px; }
  .hero-facts { margin-top: 30px; color: rgba(243, 241, 232, .78); }
  .client-strip-inner { padding-block: 24px; gap: 18px; }
  .client-logos { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px 28px; }
  .work-section { padding-block: 78px; }
  .section-heading { grid-template-columns: 1fr; gap: 16px; margin-bottom: 34px; }
  .section-heading h2, .proof-heading h2 { font-size: clamp(2.7rem, 12vw, 4.1rem); }
  #work-title { font-size: clamp(1.8rem, 10.2vw, 3.8rem); }
  .section-intro { max-width: 520px; margin: 0; font-size: 14px; }
  .project-grid { grid-template-columns: 1fr; gap: 38px; }
  .showcase-page-hero .section-wrap { padding-block: 42px 56px; }
  .showcase-page-title-row { display: block; margin-top: 36px; }
  .showcase-page-title { font-size: clamp(2.2rem, 10.5vw, 4.5rem); white-space: nowrap; }
  .showcase-page-count { margin-top: 16px; }
  .showcase-page-gallery { padding-block: 35px 70px; }
  .showcase-page-grid { grid-template-columns: 1fr; gap: 24px; }
  .project-image { aspect-ratio: 1.48; }
  .project-card h3 { font-size: 24px; }
  .services-inner { padding-block: 75px; }
  .service-grid { grid-template-columns: 1fr; }
  .service-card { min-height: 0; padding: 22px 36px 25px 0; }
  .service-card + .service-card { padding: 22px 36px 25px 0; border-left: 0; border-top: 1px solid rgba(245,247,238,.27); }
  .service-card h3 { margin: 23px 0 7px; font-size: 29px; }
  .partner-note { align-items: flex-start; margin-top: 27px; }
  .collective-section { grid-template-columns: 1fr; gap: 48px; padding-block: 78px; }
  .collective-intro h2 { font-size: clamp(3.25rem, 14vw, 5rem); }
  .collective-intro > p:not(.eyebrow) { font-size: 15px; }
  .proof-inner { grid-template-columns: 1fr; gap: 33px; padding-block: 73px; }
  .award-row { grid-template-columns: 40px minmax(0, 1fr) 76px; gap: 10px; }
  .award-logo, .award-logo--gma, .award-logo--dap { width: 76px; height: 26px; }
  .contact-inner { grid-template-columns: 1fr; gap: 45px; padding-block: 75px; }
  .contact-main h2 { font-size: clamp(3.45rem, 15vw, 5.8rem); }
  .quick-contact { top: auto; right: 16px; bottom: calc(14px + env(safe-area-inset-bottom, 0px)); left: auto; flex-direction: row; gap: 8px; transform: none; }
  .quick-contact a { width: 48px; height: 48px; border-radius: 50%; box-shadow: 0 4px 18px rgba(0,0,0,.15); }
  .quick-contact a:hover, .quick-contact a:focus-visible { transform: translateY(-2px); }
  .showcase-page .quick-contact { position: static; right: auto; bottom: auto; left: auto; width: calc(100% - 2 * var(--page-gutter)); margin: 0 auto 18px; justify-content: flex-end; transform: none; }
  .footer-inner { grid-template-columns: 1fr auto; gap: 12px 20px; }
  .footer-brand { width: 112px; }
  .footer-motto { grid-column: 1 / -1; grid-row: 2; }
  .footer-links { grid-column: 1 / -1; grid-row: 3; flex-wrap: wrap; gap: 15px; }
  .copyright { grid-row: 4; }
  .case-hero-inner { padding-block: 44px 70px; }
  .case-back { margin-bottom: 27px; }
  .case-hero-grid, .case-intro-grid, .case-system-inner { grid-template-columns: 1fr; gap: 37px; }
  .case-hero h1 { font-size: clamp(4.1rem, 20vw, 6.8rem); }
  .case-facts { max-width: 520px; }
  .case-intro, .case-gallery { padding-block: 73px; }
  .case-intro > .section-kicker { margin-bottom: 34px; }
  .case-intro h2, .case-system h2, .case-gallery h2, .case-outro h2 { font-size: clamp(3.1rem, 14vw, 5rem); }
  .case-system-inner { padding-block: 73px; }
  .case-gallery-heading { margin-bottom: 38px; }
  .case-gallery-grid { grid-template-columns: 1fr; gap: 42px; }
  .case-outro-inner { display: grid; align-items: start; padding-block: 70px; }
  .book-service-list { grid-template-columns: 1fr; gap: 0; }
  .book-layout-sheet, .aseacon-system-sheet { max-width: none; justify-self: stretch; }
}
@media (max-width: 480px) {
  .showcase-page-grid { grid-template-columns: 1fr; gap: 22px; }
}
.scroll-reveal { opacity: 0; transform: translateY(20px); transition: opacity 800ms ease-out, transform 800ms cubic-bezier(.22, .61, .36, 1); }
.scroll-reveal.is-visible { opacity: 1; transform: translateY(0); }
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; transition-duration: .01ms !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; }
}
