
:root { --gr-control-radius: 8px; --gr-feedback: 200ms cubic-bezier(.16,1,.3,1); }
.navbar-wrap { display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 32px; padding: 18px 32px; background: var(--gr-forest); border-bottom: 1px solid #f4f2e833; }
.navbar-wrap > .navbar-logo { justify-self: start; background: none; padding: 0; }
.navbar-wrap .gr-wordmark { color: var(--gr-ivory); font-size: 30px; }
.navbar-wrap .navbar-links { position: static; display: flex; gap: 32px; }
.navbar-wrap .navbar-right { justify-self: end; display: flex; gap: 20px; }
.navbar-wrap .navbar-link-btn { color: var(--gr-ivory); background: none; padding: 10px 0; border-radius: 0; }
.navlink-text { font-size: 18px; line-height: 1.3; }
.navbar-wrap .navlink-text { color: inherit; }
.navbar-link-btn { transition: color var(--gr-feedback); }
.navbar-link-btn:hover,.navbar-link-btn:focus-visible { color: var(--gr-lime); }
.navbar-link-btn .navlink-text { text-decoration: underline; text-underline-offset: 7px; text-decoration-color: transparent; transition: text-decoration-color var(--gr-feedback); }
.navbar-link-btn:hover .navlink-text,.navbar-link-btn:focus-visible .navlink-text { text-decoration-color: currentColor; }
.navbar-wrap .ham-navbar { grid-column: 1/-1; }
.navbar-wrap .hamburger-links .navbar-link-btn { color: var(--gr-ivory); }
.navbar-wrap .hamburger-links { gap: 18px; }
.navbar-wrap .hamburger-links .navlink-text { font-size: 32px; }
.navbar-wrap :focus-visible { outline-color: var(--gr-lime); }
.gr-action,.gr-brief button,.close-btn,.gr-principle-arrows button { display: inline-flex; align-items: center; justify-content: center; gap: 16px; width: auto; min-width: 0; min-height: 52px; height: auto; padding: 14px 20px; border: 1px solid var(--gr-forest); border-radius: var(--gr-control-radius); background: var(--gr-forest); color: var(--gr-ivory); font: 400 18px/1.2 var(--font-secondary); text-decoration: none; cursor: pointer; transition: background-color var(--gr-feedback),color var(--gr-feedback),border-color var(--gr-feedback); }
.gr-action .cta-text { position: relative; color: inherit !important; font: inherit; opacity: 1 !important; transform: none !important; }
.gr-action .cta-btn-arrow { display: flex; align-items: center; justify-content: center; background: none; border-radius: 0; width: 24px; height: 24px; min-width: 24px; padding: 0; }
.gr-action .cta-btn-arrow svg { width: 24px; height: 24px; transition: transform var(--gr-feedback); }
.gr-action .cta-btn-arrow svg path { stroke: currentColor; fill: none; }
.gr-action:hover,.gr-action:focus-visible,.gr-brief button:hover,.gr-brief button:focus-visible,.close-btn:hover,.close-btn:focus-visible,.gr-principle-arrows button:hover,.gr-principle-arrows button:focus-visible { background: var(--gr-lime); color: var(--gr-forest); border-color: var(--gr-forest); }
.gr-action:hover .cta-btn-arrow svg,.gr-action:focus-visible .cta-btn-arrow svg { transform: translateX(3px); }
.navbar-wrap .gr-action,.projects-end .gr-action { background: var(--gr-lime); color: var(--gr-forest); border-color: var(--gr-lime); }
.navbar-wrap .gr-action:hover,.navbar-wrap .gr-action:focus-visible,.projects-end .gr-action:hover,.projects-end .gr-action:focus-visible { background: var(--gr-ivory); border-color: var(--gr-ivory); }
.gr-brief .gr-download,.close-btn { background: transparent; color: var(--gr-forest); }
.gr-brief .gr-download:hover,.close-btn:hover { background: var(--gr-forest); color: var(--gr-ivory); }
.contact-page { align-items: flex-start; padding-top: 0; }
.contact-page .contact-content { padding-top: 112px; align-items: flex-start; }
.contact-navbar { padding: 18px 20px; background: var(--gr-lime); }
.footer-link { text-underline-offset: 6px; transition: text-decoration-color var(--gr-feedback); }
.footer-link:hover,.footer-link:focus-visible { text-decoration: underline; }
.section-hero-wrapper { padding-top: 140px; }
.gr-collage { margin-top: 36px; }
.hero-marquee { margin-top: -25px; }
.hero-marquee-text { font-family: var(--font-secondary); font-weight: 500; letter-spacing: .02em !important; }
.section-about-wrapper { min-height: 85svh; height: auto; padding: 120px 5vw; }
.about-pinned { display: grid; grid-template-columns: 1fr 2.1fr; align-items: start; gap: 7vw; max-width: 1360px; width: 100%; height: auto; min-height: 0; padding: 0; margin: auto; }
.gr-studio-heading { font: 400 clamp(30px,3vw,46px)/1.02 var(--font-primary-dark); text-transform: uppercase; letter-spacing: -.02em; max-width: 9ch; margin: 0; color: var(--gr-forest); }
.about-para { max-width: 20ch; width: 100%; margin: 0; text-align: left; font: 400 clamp(34px,4.2vw,64px)/1.16 var(--font-secondary); letter-spacing: -.03em; color: var(--gr-forest); }
.about-word { margin-right: 0; }
.local-reduced-motion .section-about-wrapper { padding-block: 120px; }
.projects-end { min-height: 0; height: auto; padding: 80px 5vw; margin: 96px 0 0; background: var(--gr-forest); border-radius: 20px; color: var(--gr-ivory); }
.projects-end-inner-wrapper { display: grid; grid-template-columns: 1.25fr 1fr; align-items: center; gap: 8vw; width: 100%; height: auto; min-height: 0; max-width: 1200px; padding: 0; }
.projects-end-para { max-width: 12ch; margin: 0; font: 400 clamp(42px,5.2vw,76px)/.98 var(--font-primary-dark); letter-spacing: -.025em; text-align: left; color: var(--gr-ivory); }
.gr-bridge-support { display: flex; flex-direction: column; align-items: flex-start; gap: 28px; }
.gr-bridge-support p { max-width: 30ch; margin: 0; font: 400 22px/1.5 var(--font-secondary); }
.projects-end .project-btn { position: relative; inset: auto; margin: 0; }
.local-reduced-motion .projects-end :is(.projects-end-para,.gr-action) { opacity: 1 !important; visibility: visible !important; transform: none !important; }
.section-services-wrapper { padding-top: 120px; }
.section-services .section-projects-header { display: grid; grid-template-columns: 1.2fr 1fr; align-items: end; gap: 8vw; width: 100%; padding: 0 5vw 60px; }
.section-services .section-heading { max-width: 12ch; font-size: clamp(48px,6vw,88px); line-height: .98; letter-spacing: -.025em; text-align: left; }
.gr-services-intro { font: 400 22px/1.5 var(--font-secondary); max-width: 28ch; margin: 0 0 5px; }
.section-services .service-block { gap: 14px; }
.section-services .service-text { font-size: clamp(30px,4.7vw,68px); line-height: .95; }
.section-services .service-block-para-wrapper { background: var(--gr-sage); border: 0; border-radius: 8px; }
.section-services .service-block-para { font-weight: 400; }
.section-testimonials-wrapper { padding: 120px 5vw; gap: 48px; }
.section-testimonials .section-projects-header { padding: 0; }
.section-testimonials .section-heading { font-size: clamp(48px,6vw,88px); line-height: .98; max-width: none; text-align: left; }
.gr-principles { width: 100%; color: var(--gr-forest); outline-offset: 10px; }
.gr-principle { display: grid; grid-template-columns: 1fr 1.1fr; min-height: 480px; background: var(--gr-sage); border-radius: 16px; overflow: hidden; }
.gr-principle[hidden] { display: none; }
.gr-principle-image { width: 100%; height: 100%; max-height: 600px; min-height: 480px; object-fit: cover; }
.gr-principle-copy { padding: clamp(32px,5vw,72px); display: flex; flex-direction: column; justify-content: center; align-items: flex-start; gap: 28px; }
.gr-principle-heading { font: 400 clamp(42px,4vw,62px)/1 var(--font-primary-dark); letter-spacing: -.025em; margin: 0; max-width: 13ch; }
.gr-principle-body { font: 400 20px/1.5 var(--font-secondary); max-width: 33ch; margin: 0; }
.gr-principle-note { font: 400 18px/1.4 var(--font-secondary); margin: 8px 0 0; }
.gr-principle-controls { display: flex; justify-content: space-between; align-items: center; gap: 24px; padding-top: 24px; }
.gr-principle-tabs { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 24px; }
.gr-principle-tabs button { color: var(--gr-leaf); background: transparent; border: 0; border-bottom: 2px solid transparent; padding: 12px 0; font: 400 18px/1.3 var(--font-secondary); cursor: pointer; transition: color var(--gr-feedback),border-color var(--gr-feedback); }
.gr-principle-tabs button[aria-pressed="true"],.gr-principle-tabs button:hover { color: var(--gr-forest); border-bottom-color: currentColor; }
.gr-principle-arrows { display: flex; gap: 10px; flex-shrink: 0; }
.gr-principle-arrows button { width: 52px; padding: 12px; }
.gr-principle-prev svg { rotate: 180deg; }
.gr-sr-only { position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.section-faq-wrapper { display: grid; grid-template-columns: .8fr 1.4fr; align-items: start; gap: 8vw; padding: 100px 5vw; }
.faq-left,.faq-right { width: 100%; }
.section-faq-header { padding: 0; }
.section-faq .section-heading { font-size: clamp(46px,5.6vw,80px); line-height: 1; max-width: 10ch; letter-spacing: -.025em; }
.faq-list { display: flex; flex-direction: column; gap: 0; }
.faq-block { gap: 0; }
.faq-item { border-top: 1px solid #224d3366; padding: 0; }
.faq-item:last-child { border-bottom: 1px solid #224d3366; }
.question-block { display: flex; align-items: center; justify-content: space-between; gap: 24px; width: 100% !important; border: 0 !important; border-radius: 0 !important; padding: 24px 0; background: transparent; color: var(--gr-forest); text-align: left; transition: color var(--gr-feedback); }
.question-block:hover,.question-block:focus-visible { color: #416c2e; }
.faq-ques { font: 400 20px/1.4 var(--font-secondary); color: inherit; }
.gr-faq-plus { flex-shrink: 0; transition: transform var(--gr-feedback); }
.question-block[aria-expanded="true"] .gr-faq-plus { transform: rotate(45deg); }
.faq-block-btm { width: 100%; margin: 0; }
.answer-block { width: 100%; max-width: 100%; padding: 10px 48px 28px 0; background: none; border: 0; border-radius: 0; }
.faq-answer { font: 400 18px/1.55 var(--font-secondary); color: var(--gr-leaf); max-width: 58ch; margin: 0; }
@media (min-width: 601px) {
  .section-services .services-layers { padding-bottom: 96px; }
}
@media (max-width: 991px) {
  .navbar-wrap { grid-template-columns: 1fr auto; gap: 16px; padding: 18px 24px; }
  .navbar-wrap > .navbar-links { display: none; }
  .navbar-wrap .navbar-right { justify-self: end; }
  .navbar-wrap .ham-btn { display: block; }
  .navbar-wrap .navbar-right > .cta-wrap { display: none; }
  .about-pinned { grid-template-columns: 1fr; gap: 36px; }
  .gr-studio-heading { max-width: 15ch; }
  .about-para { max-width: 25ch; font-size: clamp(34px,5.7vw,52px); }
  .gr-principle { min-height: 420px; }
  .gr-principle-image { min-height: 420px; }
  .gr-principle-copy { padding: 32px; }
  .gr-principle-controls { align-items: flex-start; }
}
@media (max-width: 600px) {
  .navbar-wrap { padding: 16px 20px; }
  .navbar-wrap .gr-wordmark { font-size: 27px; }
  .section-hero-wrapper { padding-top: 120px; }
  .gr-collage { margin-top: 32px; }
  .hero-marquee { margin-top: 0; }
  .section-about-wrapper,.local-reduced-motion .section-about-wrapper { min-height: 75svh; padding: 84px 24px; }
  .about-pinned { gap: 32px; }
  .gr-studio-heading { font-size: 30px; }
  .about-para { font-size: 32px; line-height: 1.18; max-width: none; }
  .projects-end { margin-top: 56px; padding: 48px 24px; border-radius: 12px; }
  .projects-end-inner-wrapper { grid-template-columns: 1fr; gap: 32px; }
  .projects-end-para { font-size: 44px; }
  .gr-bridge-support p,.gr-services-intro { font-size: 18px; }
  .section-services-wrapper { padding-top: 80px; }
  .section-services .section-projects-header { grid-template-columns: 1fr; gap: 28px; padding: 0 24px 36px; }
  .section-services .section-heading { font-size: 48px; }
  .section-services .service-block { gap: 6px; }
  .section-services .service-text { font-size: 34px; }
  .section-services .service-block-para-wrapper { padding: 16px; }
  .section-services .service-block.four { max-width: 90%; }
  .section-services .service-block.four .service-text { font-size: 32px; }
  .section-testimonials-wrapper { padding: 80px 24px; gap: 32px; }
  .section-testimonials .section-heading { font-size: 48px; }
  .gr-principle { grid-template-columns: 1fr; }
  .gr-principle-image { height: 230px; min-height: 0; max-height: none; }
  .gr-principle-copy { padding: 28px 24px; gap: 24px; min-height: 360px; }
  .gr-principle-heading { font-size: 42px; }
  .gr-principle-body { font-size: 18px; }
  .gr-principle-controls { flex-direction: column; gap: 16px; }
  .gr-principle-tabs { gap: 4px 20px; }
  .gr-principle-tabs button { font-size: 16px; }
  .gr-principle-arrows { align-self: flex-end; }
  .section-faq-wrapper { grid-template-columns: 1fr; gap: 40px; padding: 80px 24px; }
  .section-faq .section-heading { font-size: 48px; max-width: 12ch; }
  .question-block { padding: 22px 0; gap: 16px; }
  .faq-ques { font-size: 18px; }
  .answer-block { padding-right: 0; }
}
