/* G&G Scaled header service menus (Marketing & SEO, Design & Development, AI Automation) */
.gm { display: none; align-items: center; gap: clamp(4px, 1vw, 12px); pointer-events: auto; }
.gm__item { position: relative; }
.gm__btn { display: inline-flex; align-items: center; gap: 7px; height: 40px; padding: 0 12px; border: 1px solid transparent; border-radius: 999px; background: none; cursor: pointer;
  color: #fff; font: 700 .74rem/1 'Archivo', 'Helvetica Neue', Arial, sans-serif; font-stretch: 115%; letter-spacing: .12em; text-transform: uppercase; white-space: nowrap; transition: border-color .2s ease, background .2s ease; }
.gm__btn:hover, .gm__item.is-open .gm__btn { border-color: rgba(255,255,255,.28); }
.gm__btn:focus-visible { outline: 2px solid #fff; outline-offset: 2px; }
.gm__chev { width: 11px; height: 11px; opacity: .7; transition: transform .25s ease; }
.gm__item.is-open .gm__chev { transform: rotate(180deg); }
.gm__panel, .gm__panel *, .gmm, .gmm * { box-sizing: border-box; }
.gm__panel { position: absolute; top: calc(100% + 12px); left: 50%; z-index: 40; min-width: 330px; padding: 8px; border: 1px solid rgba(255,255,255,.14); border-radius: 18px;
  background: rgba(8,8,8,.97); -webkit-backdrop-filter: blur(16px); backdrop-filter: blur(16px); box-shadow: 0 24px 60px rgba(0,0,0,.6);
  opacity: 0; visibility: hidden; transform: translate(-50%, 6px); transition: opacity .2s ease, transform .2s ease, visibility 0s linear .2s; }
.gm__panel::before { content: ""; position: absolute; left: 0; right: 0; top: -14px; height: 14px; } /* hover bridge */
.gm__item.is-open .gm__panel { opacity: 1; visibility: visible; transform: translate(-50%, 0); transition: opacity .2s ease, transform .2s ease, visibility 0s; }
.gm__panel--2 { width: 620px; }
.gm__panel ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 2px; }
.gm__panel--2 ul { grid-template-columns: 1fr 1fr; }
.gm__panel a, .bnav .gm__panel a { display: block; padding: 12px 14px; border-radius: 12px; text-decoration: none; color: #fff; text-transform: none; letter-spacing: normal; font-stretch: 100%; font-size: inherit; transition: background .15s ease; }
.gm__panel a:hover, .gm__panel a:focus-visible, .gm__panel a[aria-current="page"] { background: rgba(255,255,255,.08); }
.gm__panel a:focus-visible { outline: 2px solid #fff; outline-offset: -2px; }
.gm__panel b { display: block; font-size: .9rem; font-weight: 700; line-height: 1.3; }
.gm__panel span { display: block; margin-top: 3px; font-size: .78rem; line-height: 1.4; color: #B9B9B9; }
.gm__item:last-child .gm__panel { left: auto; right: 0; transform: translate(0, 6px); }
.gm__item:last-child.is-open .gm__panel { transform: none; }

/* home page header: menus sit between the logo and the contact buttons */
@media (min-width: 1280px) { .site-header .gm { display: flex; } .site-header .contact__cta--blog { display: none; } .site-header .brand__name { white-space: nowrap; } }
@media (min-width: 1280px) and (max-width: 1499px) { .site-header .brand__sub { display: none; } }

/* inner pages */
.gmm__toggle { display: none; align-items: center; gap: 8px; padding: 11px 16px; border-radius: 999px; border: 1px solid rgba(255,255,255,.28); background: none; cursor: pointer; color: #fff;
  font: 700 .74rem/1 'Archivo', 'Helvetica Neue', Arial, sans-serif; font-stretch: 115%; letter-spacing: .14em; text-transform: uppercase; }
.gmm__toggle:focus-visible { outline: 2px solid #fff; outline-offset: 2px; }
.gmm__toggle i { position: relative; width: 14px; height: 10px; }
.gmm__toggle i::before, .gmm__toggle i::after { content: ""; position: absolute; left: 0; right: 0; height: 1.5px; background: currentColor; transition: transform .25s ease, top .25s ease; }
.gmm__toggle i::before { top: 1px; } .gmm__toggle i::after { top: 7px; }
.gmm__toggle[aria-expanded="true"] i::before { top: 4px; transform: rotate(45deg); }
.gmm__toggle[aria-expanded="true"] i::after { top: 4px; transform: rotate(-45deg); }
.bnav .bnav__more { display: none; }
.gmm__toggle { display: inline-flex; }
@media (min-width: 1200px) { .bhead .gm { display: flex; margin-right: 4px; } }
@media (min-width: 1200px) and (max-width: 1339px) { .bhead .gm { gap: 0; } .bhead .gm__btn { padding: 0 9px; font-size: .68rem; letter-spacing: .08em; } }
@media (max-width: 440px) { .bhead .bnav { gap: 8px; } .gmm__toggle { padding: 10px 11px; font-size: .68rem; } .gmm__toggle span { display: none; } }
@media (max-width: 400px) { .bhead .brand img { width: 38px; height: 38px; } .bhead .brand { gap: 9px; } .bhead .brand b { font-size: .86rem; letter-spacing: .1em; }
  .bhead .bnav .bnav__cta { padding: 9px 12px; font-size: .64rem; letter-spacing: .1em; } }
@media (max-width: 340px) { .bhead .brand img { width: 32px; height: 32px; } .bhead__in { padding-left: 12px !important; padding-right: 12px !important; } .bhead .brand b { font-size: .78rem; letter-spacing: .06em; } .bhead .bnav { gap: 6px; } }

.gmm { position: fixed; left: 0; right: 0; top: var(--gmm-top, 80px); bottom: 0; z-index: 29; overflow-y: auto; overscroll-behavior: contain;
  padding: 12px clamp(16px, 4vw, 32px) 40px; background: rgba(0,0,0,.97); -webkit-backdrop-filter: blur(14px); backdrop-filter: blur(14px); border-top: 1px solid rgba(255,255,255,.14); }
.gmm[hidden] { display: none; }
.gmm__in { max-width: 640px; margin: 0 auto; }
.gmm__grp { border-bottom: 1px solid rgba(255,255,255,.14); }
.gmm__grp summary { display: flex; align-items: center; justify-content: space-between; padding: 18px 2px; cursor: pointer; list-style: none;
  font-size: 1rem; font-weight: 700; font-stretch: 115%; letter-spacing: .1em; text-transform: uppercase; }
.gmm__grp summary::-webkit-details-marker { display: none; }
.gmm__grp summary .gm__chev { width: 14px; height: 14px; }
.gmm__grp[open] summary .gm__chev { transform: rotate(180deg); }
.gmm__grp ul { list-style: none; margin: 0; padding: 0 0 14px; }
.gmm a { display: block; padding: 11px 2px; color: #fff; text-decoration: none; font-size: 1rem; }
.gmm__grp a { color: #d8d8d8; padding-left: 12px; }
.gmm a:hover, .gmm a:focus-visible { color: #fff; text-decoration: underline; text-underline-offset: 4px; }
.gmm__links { list-style: none; margin: 8px 0 0; padding: 0; }
.gmm__links a { padding: 14px 2px; border-bottom: 1px solid rgba(255,255,255,.14); font-weight: 700; font-stretch: 115%; letter-spacing: .1em; text-transform: uppercase; font-size: .9rem; }
html.gmm-open { overflow: hidden; }

/* home page services: the sub-services under each group */
.service__links { list-style: none; margin: 18px 0 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); gap: 8px; }
.service__links li { display: flex; }
.service__links a { box-sizing: border-box; flex: 1; display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 12px 16px; border: 1px solid rgba(255,255,255,.18); border-radius: 12px;
  color: #fff; text-decoration: none; font-size: .9rem; font-weight: 600; line-height: 1.3; transition: background .2s ease, border-color .2s ease; }
.service__links a::after { content: "\2192"; opacity: .55; transition: transform .2s ease, opacity .2s ease; }
.service__links a:hover, .service__links a:focus-visible { background: rgba(255,255,255,.07); border-color: rgba(255,255,255,.4); }
.service__links a:hover::after { transform: translateX(3px); opacity: 1; }

@media (prefers-reduced-motion: reduce) { .gm__panel, .gm__chev, .gmm__toggle i::before, .gmm__toggle i::after, .service__links a, .service__links a::after { transition: none; } }

/* ---------- smooth scrolling (Lenis, desktop only; see site-fx.js) ---------- */
html.lenis, html.lenis body { height: auto; }
.lenis.lenis-smooth { scroll-behavior: auto !important; }
.lenis.lenis-smooth [data-lenis-prevent] { overscroll-behavior: contain; }

/* ---------- page transitions: moving between pages fades through, and the logo glides into place ---------- */
@view-transition { navigation: auto; }
.site-header .brand img, .bhead .brand img { view-transition-name: gg-logo; }
::view-transition-old(root) { animation: gg-vt-out .28s cubic-bezier(.4,0,1,1) both; }
::view-transition-new(root) { animation: gg-vt-in .5s cubic-bezier(0,0,.2,1) .06s both; }
::view-transition-group(gg-logo) { animation-duration: .55s; animation-timing-function: cubic-bezier(.2,.7,0,1); }
@keyframes gg-vt-out { to { opacity: 0; transform: translateY(-10px); filter: blur(4px); } }
@keyframes gg-vt-in { from { opacity: 0; transform: translateY(14px); filter: blur(4px); } }
@media (prefers-reduced-motion: reduce) {
  @view-transition { navigation: none; }
}

/* ---------- the homepage finish on every other page (see page-fx.js) ---------- */
/* headings light up word by word; the dim grey is still readable */
.lw-on .lw { display: inline-block; color: #8a8a8a; translate: 0 .12em; transition: color .7s ease, translate .8s cubic-bezier(.2,.7,0,1), -webkit-text-stroke-color .7s ease; }
.lw-on em .lw { color: transparent; -webkit-text-stroke-color: #8a8a8a; }
.lw-on.lw-in .lw { color: var(--ink, #fff); translate: none; }
.lw-on.lw-in em .lw { color: transparent; -webkit-text-stroke-color: var(--ink, #fff); }
/* content and cards fade up ("translate" so hover lifts that use transform still work) */
.fu { opacity: 0; translate: 0 22px; transition: opacity .7s ease, translate .9s cubic-bezier(.2,.7,0,1); }
.fu.fu-in { opacity: 1; translate: none; }
/* the knot */
.band, .svc-hero:not([data-bg]) { position: relative; overflow: hidden; }
.band > .wrap, .svc-hero:not([data-bg]) > .wrap { position: relative; z-index: 1; }
.gg-knot { position: absolute; z-index: 0; pointer-events: none; aspect-ratio: 1; }
.gg-knot--band { right: -6%; top: 50%; width: min(620px, 54vw); translate: 0 -50%; opacity: .42; }
.gg-knot--hero { right: 4%; top: 50%; width: min(440px, 32vw); translate: 0 -46%; opacity: .75; }
@media (max-width: 899px) { .gg-knot--band { right: -30%; top: 8%; width: 90vw; translate: none; opacity: .22; } }
@media (prefers-reduced-motion: reduce) { .lw-on .lw, .fu { transition: none; } }