/* ==========================================================================
   Icons - CSS mask set. No icon font, no external request, inherits currentColor.
   The reference uses a licensed icon font; these are equivalent open shapes.
   ========================================================================== */
.gc-icon{display:inline-block;width:1em;height:1em;flex:0 0 auto;
  background-color:currentColor;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;
  -webkit-mask-position:center;mask-position:center;-webkit-mask-size:contain;mask-size:contain}
.gc-icon--arrow{--gc-i:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' d='M5 12h14M13 6l6 6-6 6'/%3E%3C/svg%3E")}
.gc-icon--arrow-up{--gc-i:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' d='M12 19V5M6 11l6-6 6 6'/%3E%3C/svg%3E")}
.gc-icon--search{--gc-i:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cg fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round'%3E%3Ccircle cx='11' cy='11' r='7'/%3E%3Cpath d='m20 20-4-4'/%3E%3C/g%3E%3C/svg%3E")}
.gc-icon--close{--gc-i:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' d='M6 6l12 12M18 6L6 18'/%3E%3C/svg%3E")}
.gc-icon--mail{--gc-i:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cg fill='none' stroke='%23000' stroke-width='2' stroke-linejoin='round'%3E%3Crect x='2.5' y='5' width='19' height='14' rx='2'/%3E%3Cpath d='m3 7 9 6 9-6'/%3E%3C/g%3E%3C/svg%3E")}
.gc-icon--phone{--gc-i:url("data:image/svg+xml,%3Csvg%20xmlns=%22http://www.w3.org/2000/svg%22%20viewBox=%220%200%2024%2024%22%20fill=%22none%22%20stroke=%22%23000%22%20stroke-width=%221.7%22%20stroke-linecap=%22round%22%20stroke-linejoin=%22round%22%3E%3Cpath%20d=%22M16.4%2014.9l-1.9%201.9a13.4%2013.4%200%200%201-5.3-5.3l1.9-1.9a1.3%201.3%200%200%200%200-1.9L8.3%204.9a1.3%201.3%200%200%200-1.9%200L4.7%206.6c-.9.9-1.2%202.2-.8%203.4A19.5%2019.5%200%200%200%2016%2022.1c1.2.4%202.5.1%203.4-.8l1.7-1.7a1.3%201.3%200%200%200%200-1.9l-2.8-2.8a1.3%201.3%200%200%200-1.9%200z%22/%3E%3Cpath%20d=%22M14%206.2a6%206%200%200%201%204.2%204.2%22/%3E%3Cpath%20d=%22M14.6%201.8a10.6%2010.6%200%200%201%207.6%207.6%22/%3E%3C/svg%3E")}
.gc-icon--pin{--gc-i:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cg fill='none' stroke='%23000' stroke-width='2' stroke-linejoin='round'%3E%3Cpath d='M12 21s7-6.2 7-11a7 7 0 1 0-14 0c0 4.8 7 11 7 11z'/%3E%3Ccircle cx='12' cy='10' r='2.6'/%3E%3C/g%3E%3C/svg%3E")}
.gc-icon--cart{--gc-i:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cg fill='none' stroke='%23000' stroke-width='2' stroke-linejoin='round'%3E%3Cpath d='M3 4h2.2l2.3 11h10l2.2-8H6'/%3E%3Ccircle cx='9.5' cy='19' r='1.6'/%3E%3Ccircle cx='17' cy='19' r='1.6'/%3E%3C/g%3E%3C/svg%3E")}
.gc-icon--facebook{--gc-i:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M13.5 22v-8h2.7l.4-3.1h-3.1V8.9c0-.9.25-1.5 1.55-1.5h1.65V4.6A22 22 0 0 0 14.3 4.5c-2.4 0-4 1.45-4 4.1v2.3H7.6V14h2.7v8z'/%3E%3C/svg%3E")}
.gc-icon--twitter{--gc-i:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M17.3 3h3.1l-6.8 7.8L21.7 21h-6.2l-4.9-6.4L4.9 21H1.8l7.3-8.3L2.1 3h6.4l4.4 5.8zm-1.1 16.1h1.7L7.9 4.8H6z'/%3E%3C/svg%3E")}
.gc-icon--instagram{--gc-i:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cg fill='none' stroke='%23000' stroke-width='2'%3E%3Crect x='3' y='3' width='18' height='18' rx='5'/%3E%3Ccircle cx='12' cy='12' r='4'/%3E%3Ccircle cx='17.2' cy='6.8' r='1.2' fill='%23000' stroke='none'/%3E%3C/g%3E%3C/svg%3E")}
.gc-icon--linkedin{--gc-i:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M4.98 3.5A2.5 2.5 0 1 0 5 8.5a2.5 2.5 0 0 0 0-5zM3 9.5h4V21H3zM9.5 9.5h3.8v1.6h.05c.53-1 1.83-2.05 3.77-2.05 4.03 0 4.78 2.65 4.78 6.1V21h-4v-5.1c0-1.22-.02-2.78-1.7-2.78-1.7 0-1.96 1.33-1.96 2.7V21h-4z'/%3E%3C/svg%3E")}
.gc-icon--youtube{--gc-i:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M22.5 7.3a2.7 2.7 0 0 0-1.9-1.9C18.9 5 12 5 12 5s-6.9 0-8.6.4A2.7 2.7 0 0 0 1.5 7.3 28 28 0 0 0 1.1 12c0 1.6.14 3.2.4 4.7a2.7 2.7 0 0 0 1.9 1.9c1.7.4 8.6.4 8.6.4s6.9 0 8.6-.4a2.7 2.7 0 0 0 1.9-1.9c.26-1.5.4-3.1.4-4.7s-.14-3.2-.4-4.7zM9.8 15.3V8.7l5.7 3.3z'/%3E%3C/svg%3E")}
.gc-icon--pinterest{--gc-i:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 2a10 10 0 0 0-3.6 19.3c-.08-.8-.16-2 .03-2.9l1.2-5.1s-.3-.6-.3-1.5c0-1.4.8-2.5 1.8-2.5.85 0 1.26.64 1.26 1.4 0 .86-.55 2.14-.83 3.33-.24 1 .5 1.8 1.47 1.8 1.77 0 3.13-1.86 3.13-4.55 0-2.38-1.7-4.04-4.15-4.04-2.83 0-4.5 2.12-4.5 4.31 0 .85.33 1.77.74 2.27a.3.3 0 0 1 .07.29l-.28 1.13c-.04.18-.15.22-.34.13-1.25-.58-2.03-2.4-2.03-3.87 0-3.15 2.29-6.04 6.6-6.04 3.47 0 6.16 2.47 6.16 5.77 0 3.45-2.17 6.22-5.18 6.22-1.01 0-1.97-.53-2.29-1.15l-.63 2.4c-.22.87-.83 1.96-1.24 2.62A10 10 0 1 0 12 2z'/%3E%3C/svg%3E")}
.gc-icon--behance{--gc-i:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M8.4 5.5c1.9 0 3.4.9 3.4 2.9 0 1.2-.6 2-1.5 2.4 1.3.4 2 1.4 2 2.9 0 2.4-1.9 3.4-4 3.4H1.5V5.5zm-.5 4.6c.9 0 1.5-.4 1.5-1.3S8.8 7.6 7.8 7.6H4.4v2.5zm.2 4.8c1 0 1.8-.4 1.8-1.5s-.7-1.5-1.8-1.5H4.4v3zM19 9.2c2.3 0 3.6 1.7 3.6 4.1v.6h-5.5c.1 1.2.8 1.9 1.9 1.9.8 0 1.4-.35 1.65-.95h1.85c-.4 1.6-1.75 2.5-3.5 2.5-2.4 0-3.9-1.65-3.9-4.05S16.6 9.2 19 9.2zm1.6 3.3c-.1-1-.7-1.7-1.6-1.7s-1.6.6-1.8 1.7zM15.6 6.6h5v1.5h-5z'/%3E%3C/svg%3E")}
.gc-icon[class*="gc-icon--"]{-webkit-mask-image:var(--gc-i);mask-image:var(--gc-i)}

/* ==========================================================================
   Section headings
   ========================================================================== */
.gc-heading{margin-bottom:50px}
.gc-heading--center{text-align:center;max-width:760px;margin-left:auto;margin-right:auto}
/* Reference: a light chip - #ecf0f4 ground, 5px radius, 2px 15px padding,
   PJS 12/26 600, 1px tracking, uppercase, #7c898d. */
.gc-heading__subtitle{display:inline-block;margin-bottom:10px;padding:2px 15px;
  border-radius:5px;background:var(--gc-light-bg);font-family:var(--gc-font-heading);
  font-weight:600;font-size:12px;line-height:26px;letter-spacing:1px;
  text-transform:uppercase;color:var(--gc-body)}
.gc-bg-light .gc-heading__subtitle{background:var(--gc-white)}
.gc-bg-dark .gc-heading__subtitle{background:rgba(var(--gc-white-rgb),.1);
  color:rgba(var(--gc-white-rgb),.75)}
.gc-heading__title{margin:0;font-family:var(--gc-font-heading);font-weight:700;
  font-size:var(--gc-h2-size);line-height:var(--gc-h2-lh);letter-spacing:-.96px;
  color:var(--gc-heading)}
.gc-heading__desc{margin-top:20px}
.gc-bg-dark .gc-heading__title{color:var(--gc-white)}
.gc-bg-dark .gc-heading__subtitle{color:rgba(var(--gc-white-rgb),.6)}

/* ==========================================================================
   Page title bar
   ========================================================================== */
.gc-titlebar{position:relative;padding:150px 0 130px;background:var(--gc-secondary) center/cover no-repeat;
  color:var(--gc-white);isolation:isolate}
.gc-titlebar__overlay{position:absolute;inset:0;z-index:-1;
  background:linear-gradient(180deg,rgba(var(--gc-secondary-rgb),.78),rgba(var(--gc-secondary-rgb),.9))}
.gc-titlebar__inner{position:relative;text-align:center}
.gc-titlebar__subtitle{display:block;margin-bottom:12px;font-family:var(--gc-font-heading);
  font-weight:500;font-size:14px;line-height:24px;letter-spacing:.5px;text-transform:uppercase;
  color:var(--gc-global)}
.gc-titlebar__title{margin:0 0 18px;font-family:var(--gc-font-heading);font-weight:600;
  font-size:70px;line-height:70px;letter-spacing:-3px;color:var(--gc-white)}

/* Breadcrumb */
.gc-breadcrumb__list{display:flex;align-items:center;justify-content:center;flex-wrap:wrap;
  gap:10px;margin:0;padding:0;list-style:none;font-size:17px;line-height:28px;
  color:rgba(var(--gc-white-rgb),.75);text-transform:capitalize}
.gc-breadcrumb__item+.gc-breadcrumb__item::before{content:"/";margin-right:10px;
  color:rgba(var(--gc-white-rgb),.4)}
.gc-breadcrumb a{color:rgba(var(--gc-white-rgb),.75)}
.gc-breadcrumb a:hover{color:var(--gc-global)}
.gc-breadcrumb [aria-current]{color:var(--gc-global)}

/* ==========================================================================
   Cards
   ========================================================================== */
.gc-card{display:flex;flex-direction:column;background:var(--gc-white);
  border-radius:var(--gc-radius);overflow:hidden;
  transition:transform var(--gc-dur) var(--gc-ease),box-shadow var(--gc-dur) var(--gc-ease)}
.gc-card:hover{transform:translateY(-6px);box-shadow:var(--gc-shadow)}
.gc-card__media{display:block;overflow:hidden;background:var(--gc-light-bg)}
.gc-card__media img{display:block;width:100%;height:auto;
  transition:transform .7s var(--gc-ease)}
.gc-card:hover .gc-card__media img{transform:scale(1.07)}
.gc-card__body{padding:28px 30px 32px;flex:1 1 auto;display:flex;flex-direction:column}
.gc-card__title{margin:0 0 14px;font-size:24px;line-height:32px}
.gc-card__title a{color:var(--gc-heading)}
.gc-card__title a:hover{color:var(--gc-global)}
.gc-card__excerpt{margin-bottom:20px;flex:1 1 auto}
.gc-card__link{display:inline-flex;align-items:center;gap:9px;margin-top:auto;
  font-family:var(--gc-font-heading);font-weight:600;font-size:15px;color:var(--gc-heading)}
.gc-card__link:hover{color:var(--gc-global);gap:14px}
.gc-card__link .gc-icon{transition:transform var(--gc-dur) var(--gc-ease)}

/* Meta line */
.gc-meta{display:flex;align-items:center;flex-wrap:wrap;gap:8px 18px;margin-bottom:14px;
  font-family:var(--gc-font-heading);font-weight:600;font-size:14px;color:var(--gc-body)}
.gc-meta a{color:var(--gc-body)}
.gc-meta a:hover{color:var(--gc-global)}
.gc-meta__cat a{color:var(--gc-global)}

/* Classic entry */
.gc-classic{margin-bottom:60px}
.gc-classic__media{display:block;overflow:hidden;border-radius:var(--gc-radius);
  margin-bottom:28px}
.gc-classic__media img{width:100%;transition:transform .7s var(--gc-ease)}
.gc-classic:hover .gc-classic__media img{transform:scale(1.05)}
.gc-classic__title{margin:0 0 16px;font-size:var(--gc-h4-size);line-height:var(--gc-h4-lh)}
.gc-classic__excerpt{margin-bottom:26px}

/* Masonry (CSS columns; JS upgrades to true masonry where supported) */
.gc-masonry{column-gap:30px}
.gc-masonry--2{column-count:2}
.gc-masonry--3{column-count:3}
.gc-masonry--4{column-count:4}
.gc-masonry>*{break-inside:avoid;margin-bottom:30px;display:inline-block;width:100%}

/* ==========================================================================
   Pagination
   ========================================================================== */
.gc-pagination{margin-top:60px}
.gc-pagination__list{display:flex;align-items:center;justify-content:center;flex-wrap:wrap;
  gap:10px;margin:0;padding:0;list-style:none}
.gc-pagination .page-numbers{display:grid;place-items:center;min-width:52px;height:52px;
  padding:0 12px;border-radius:var(--gc-radius);background:var(--gc-light-bg);
  font-family:var(--gc-font-heading);font-weight:600;font-size:16px;color:var(--gc-heading);
  transition:background var(--gc-dur) var(--gc-ease),color var(--gc-dur) var(--gc-ease)}
.gc-pagination .page-numbers:hover,.gc-pagination .page-numbers.current{
  background:var(--gc-global);color:var(--gc-secondary)}
.gc-pagination .page-numbers.dots{background:transparent}

/* ==========================================================================
   Single post
   ========================================================================== */
.gc-single__media{margin:0 0 30px;border-radius:var(--gc-radius);overflow:hidden}
.gc-single__title{margin-bottom:24px;font-size:var(--gc-h3-size);line-height:var(--gc-h3-lh)}
.gc-single__content>*+*{margin-top:20px}
.gc-single__footer{display:flex;align-items:center;justify-content:space-between;
  gap:24px;flex-wrap:wrap;margin-top:44px;padding-top:30px;border-top:1px solid var(--gc-border)}
.gc-single__tags{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.gc-single__tags-label,.gc-share__label{font-family:var(--gc-font-heading);font-weight:600;
  color:var(--gc-heading)}
.gc-single__tags a{padding:8px 18px;border-radius:40px;background:var(--gc-light-bg);
  font-size:14px;font-family:var(--gc-font-heading);font-weight:500}
.gc-single__tags a:hover{background:var(--gc-global);color:var(--gc-secondary)}
.gc-share{display:flex;align-items:center;gap:12px}
.gc-share__list{display:flex;gap:8px;margin:0;padding:0;list-style:none}
.gc-share__link{display:grid;place-items:center;width:40px;height:40px;border-radius:50%;
  background:var(--gc-light-bg);color:var(--gc-heading)}
.gc-share__link:hover{background:var(--gc-global);color:var(--gc-secondary)}

.gc-authorbox{display:flex;gap:28px;margin-top:50px;padding:36px;border-radius:var(--gc-radius);
  background:var(--gc-light-bg)}
.gc-authorbox__avatar img{border-radius:50%}
.gc-authorbox__label{font-size:14px;color:var(--gc-body)}
.gc-authorbox__name{margin:6px 0 12px;font-size:22px}
.gc-authorbox__bio{margin:0}

.gc-postnav{display:grid;grid-template-columns:1fr 1fr;gap:30px;margin-top:50px;
  padding-top:40px;border-top:1px solid var(--gc-border)}
.gc-postnav__side--next{text-align:right}
.gc-postnav__label{display:block;margin-bottom:8px;font-family:var(--gc-font-heading);
  font-weight:600;font-size:13px;text-transform:uppercase;letter-spacing:1px;color:var(--gc-global)}
.gc-postnav__title{font-family:var(--gc-font-heading);font-weight:600;font-size:20px;
  line-height:28px;color:var(--gc-heading)}
.gc-postnav__link:hover .gc-postnav__title{color:var(--gc-global)}

.gc-related{margin-top:70px}
.gc-related__title{margin-bottom:34px}

/* ==========================================================================
   Comments
   ========================================================================== */
.gc-comments{margin-top:70px}
.gc-comments__title,.gc-comments__form-title{margin-bottom:30px;font-size:28px}
.gc-comments__list,.gc-comments__list .children{list-style:none;margin:0;padding:0}
.gc-comments__list .children{padding-left:60px}
.gc-comments__list li.comment{padding:30px 0;border-bottom:1px solid var(--gc-border)}
.gc-comments .comment-form{display:grid;gap:18px;margin-top:40px}
.gc-comments .comment-form p{margin:0}
.gc-comments .comment-form-author,.gc-comments .comment-form-email{display:inline-block;width:calc(50% - 9px)}

/* ==========================================================================
   404 / empty states
   ========================================================================== */
.gc-404{position:relative;display:grid;place-items:center;min-height:calc(100vh - 150px);
  padding:120px 0;background:var(--gc-secondary) center/cover no-repeat;text-align:center;
  color:var(--gc-white);isolation:isolate}
.gc-404__overlay{position:absolute;inset:0;z-index:-1;background:rgba(0,7,18,.5)}
.gc-404__inner{max-width:720px}
.gc-404__code{margin:0;font-family:var(--gc-font-heading);font-weight:800;
  font-size:clamp(90px,16vw,190px);line-height:1;color:var(--gc-global)}
.gc-404__title{margin:0 0 18px;color:var(--gc-white)}
.gc-404__text{margin-bottom:34px;color:rgba(var(--gc-white-rgb),.75)}
.gc-404__search{max-width:460px;margin:0 auto 34px}
.gc-404__search .gc-search-form__field{background:rgba(var(--gc-white-rgb),.1);color:#fff}
.gc-404__search .gc-search-form__submit{color:#fff}

.gc-no-results{max-width:620px;margin:0 auto;padding:60px 0;text-align:center}
.gc-no-results__text{margin-bottom:28px}
.gc-search-summary{max-width:720px;margin:0 auto 50px;text-align:center}
.gc-search-summary__count{margin-bottom:22px;font-family:var(--gc-font-heading);
  font-weight:600;font-size:20px;color:var(--gc-heading)}
.gc-archive__description{max-width:760px;margin:0 auto 50px;text-align:center}

@media (max-width:1024px){
  .gc-titlebar{padding:110px 0 90px}
  .gc-titlebar__title{font-size:48px;line-height:54px;letter-spacing:-1.5px}
  .gc-masonry--3,.gc-masonry--4{column-count:2}
  .gc-heading{margin-bottom:40px}
}
@media (max-width:767px){
  .gc-titlebar{padding:80px 0 66px}
  .gc-titlebar__title{font-size:34px;line-height:40px;letter-spacing:-1px}
  .gc-breadcrumb__list{font-size:15px}
  .gc-masonry{column-count:1!important}
  .gc-postnav{grid-template-columns:1fr;gap:24px}
  .gc-postnav__side--next{text-align:left}
  .gc-authorbox{flex-direction:column;gap:18px;padding:26px}
  .gc-comments__list .children{padding-left:22px}
  .gc-comments .comment-form-author,.gc-comments .comment-form-email{width:100%}
  .gc-single__footer{flex-direction:column;align-items:flex-start}
}

/* ===== Scroll reveal =====
   Scoped to .gc-js so the content is always visible when JavaScript is off
   or fails; the reveal is pure enhancement. */
.gc-js .gc-reveal{opacity:0;transform:translateY(34px);
  transition:opacity .7s var(--gc-ease),transform .7s var(--gc-ease)}
.gc-js .gc-revealed{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){.gc-js .gc-reveal{opacity:1;transform:none}}

/* Check icon used by the icon-heading component */
.gc-icon--check{--gc-i:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='%23000' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round' d='m4 12.5 5.2 5.2L20 6.9'/%3E%3C/svg%3E")}

/* ===== Icon heading (ihbox) ===== */
.gc-ihbox{display:flex;align-items:center;gap:18px;margin:0}
.gc-ihbox__icon{display:grid;place-items:center;width:44px;height:44px;flex:0 0 auto;
  border-radius:50%;background:var(--gc-global);color:var(--gc-white);font-size:20px}
.gc-ihbox__title{margin:0;font-family:var(--gc-font-heading);font-weight:600;
  font-size:18px;line-height:22px;color:var(--gc-heading)}
.gc-ihbox--inline .gc-ihbox__title{font-size:17px}

/* ==========================================================================
   Button arrow badge - the reference puts a 33px disc at right:2px inside
   the button, with a small glyph centred in it.
   ========================================================================== */
.gc-btn{position:relative;padding-right:60px}
.gc-btn::after{content:"";position:absolute;right:2px;top:50%;
  transform:translateY(-50%);width:33px;height:33px;border-radius:50%;
  background:var(--gc-white);transition:background var(--gc-dur) var(--gc-ease)}
.gc-btn .gc-icon{position:absolute;right:2px;top:50%;transform:translateY(-50%);
  width:33px;height:33px;-webkit-mask-size:12px;mask-size:12px;
  background-color:var(--gc-secondary);z-index:1;
  transition:background-color var(--gc-dur) var(--gc-ease)}
.gc-btn:hover::after{background:var(--gc-secondary)}
.gc-btn:hover .gc-icon{background-color:var(--gc-global)}

.gc-btn--dark::after,.gc-btn--white::after,.gc-btn--outline::after{background:var(--gc-global)}
.gc-btn--dark:hover::after,.gc-btn--white:hover::after{background:var(--gc-secondary)}
.gc-btn--dark:hover .gc-icon,.gc-btn--white:hover .gc-icon{background-color:var(--gc-global)}

/* A button with no icon keeps its normal padding and hides the disc. */
.gc-btn:not(:has(.gc-icon)){padding-right:34px}
.gc-btn:not(:has(.gc-icon))::after{display:none}

/* Star used by the testimonial rating */
.gc-star{display:inline-block;width:14px;height:14px;background:var(--gc-global);
  clip-path:polygon(50% 0,61% 35%,98% 35%,68% 57%,79% 91%,50% 70%,21% 91%,32% 57%,2% 35%,39% 35%)}

/* ==========================================================================
   Marquee primitive (shared by the About band, clients row and footer)
   ========================================================================== */
.gc-marquee{overflow:hidden;white-space:nowrap}
.gc-marquee__track{display:inline-flex;align-items:center;gap:26px;
  animation:gcMarquee 26s linear infinite;will-change:transform}
.gc-marquee:hover .gc-marquee__track{animation-play-state:paused}
.gc-marquee__item{display:inline-block;font-family:var(--gc-font-heading);
  font-weight:700;font-size:22px;color:var(--gc-secondary);white-space:nowrap}
.gc-marquee__dot{display:inline-block}
.gc-marquee__star{display:inline-block;width:16px;height:16px;flex:0 0 auto;
  background:var(--gc-global);
  clip-path:polygon(50% 0,61% 35%,98% 35%,68% 57%,79% 91%,50% 70%,21% 91%,32% 57%,2% 35%,39% 35%)}
@keyframes gcMarquee{from{transform:translateX(0)}to{transform:translateX(-50%)}}
@media (prefers-reduced-motion:reduce){
  .gc-marquee__track,.gc-clients__list{animation:none}
}

/* ==========================================================================
   Button metrics - measured against the reference at 1440px.
   Every variant is 60px tall: 14px top / 13px bottom around a 33px line box,
   25px of leading padding and 60px trailing to clear the arrow disc.
   ========================================================================== */
.gc-btn{padding:14px 60px 13px 25px;line-height:33px;min-height:60px;
  align-items:center;border-radius:5px}
.gc-btn:not(:has(.gc-icon)){padding-right:25px}
button,input[type=submit],input[type=button],input[type=reset]{
  padding:14px 25px 13px;line-height:33px;min-height:60px;border-radius:5px}

/* Chevron used by the back-to-top control */
.gc-icon--chevron-up{--gc-i:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='%23000' stroke-width='2.6' stroke-linecap='round' stroke-linejoin='round' d='m5 15 7-7 7 7'/%3E%3C/svg%3E")}

/* ==========================================================================
   Arrow badge colours are per button in the reference, not derived from the
   button's own ground. Declared explicitly for each instance.
   ========================================================================== */
/* dark button -> white disc, dark glyph */
.gc-btn--dark::after{background:var(--gc-white)}
.gc-btn--dark .gc-icon{background-color:var(--gc-secondary)}
.gc-btn--dark:hover::after{background:var(--gc-global)}
.gc-btn--dark:hover .gc-icon{background-color:var(--gc-secondary)}
/* white button -> dark disc, white glyph */
.gc-btn--white::after{background:var(--gc-secondary)}
.gc-btn--white .gc-icon{background-color:var(--gc-white)}
.gc-btn--white:hover::after{background:var(--gc-global)}
.gc-btn--white:hover .gc-icon{background-color:var(--gc-secondary)}

/* The reference anchors the disc at right:2px of an inner span that itself
   has 15px of trailing button padding - so it sits 17px from the button edge,
   leaving a 10px gap after the label rather than 25px. */
.gc-btn::after,.gc-btn .gc-icon{right:17px}

/* ==========================================================================
   Page header - measured against the reference at 1440px.
   550px tall over a photo, content bottom aligned inside 150px/40px padding.
   Left column 933 carries the breadcrumb then the title; an optional intro
   paragraph sits right at 467 wide.
   ========================================================================== */
.gc-titlebar{position:relative;display:flex;align-items:flex-end;min-height:550px;
  padding:0;background:var(--gc-secondary) center/cover no-repeat;
  color:var(--gc-white);isolation:isolate}
.gc-titlebar__overlay{position:absolute;inset:0;z-index:-1;
  background:linear-gradient(90deg,rgba(var(--gc-secondary-rgb),.75) 0%,rgba(var(--gc-secondary-rgb),.45) 100%)}
.gc-titlebar__inner{display:grid;grid-template-columns:933px 467px;gap:0;
  align-items:end;width:100%;padding:150px 0 40px;text-align:left}
.gc-titlebar__main{min-width:0}
.gc-titlebar__title{margin:0;font-family:var(--gc-font-heading);font-weight:600;
  font-size:70px;line-height:70px;letter-spacing:-3px;color:var(--gc-white)}
.gc-titlebar__subtitle{display:block;margin-bottom:10px;
  font-family:var(--gc-font-heading);font-weight:500;font-size:14px;line-height:24px;
  letter-spacing:.5px;text-transform:uppercase;color:var(--gc-global)}
.gc-titlebar__desc{margin:0;padding-bottom:6px;font-family:var(--gc-font-body);
  font-weight:400;font-size:18px;line-height:28.8px;color:#fafafa}
.gc-titlebar__desc p{margin:0}

/* Breadcrumb sits above the title, left aligned */
.gc-titlebar .gc-breadcrumb{margin-bottom:22px}
.gc-titlebar .gc-breadcrumb__list{justify-content:flex-start;font-family:var(--gc-font-body);
  font-weight:400;font-size:17px;line-height:28px;text-transform:capitalize;
  color:var(--gc-white)}
.gc-titlebar .gc-breadcrumb a{color:var(--gc-white)}
.gc-titlebar .gc-breadcrumb a:hover{color:var(--gc-global)}
.gc-titlebar .gc-breadcrumb [aria-current]{color:var(--gc-white)}

@media (max-width:1199px){
  .gc-titlebar{min-height:400px!important}
  .gc-titlebar__inner{grid-template-columns:1fr;gap:20px;padding:120px 0 40px}
  .gc-titlebar__title{font-size:52px;line-height:56px;letter-spacing:-1.6px}
  .gc-titlebar__desc{max-width:560px}
}
@media (max-width:767px){
  .gc-titlebar{min-height:300px!important}
  .gc-titlebar__inner{padding:90px 0 34px}
  .gc-titlebar__title{font-size:34px;line-height:40px;letter-spacing:-1px}
  .gc-titlebar__desc{font-size:16px;line-height:26px}
  .gc-titlebar .gc-breadcrumb{margin-bottom:14px}
  .gc-titlebar .gc-breadcrumb__list{font-size:15px}
}

/* Page header scrim is a flat #0000006B in the reference, not a gradient */
.gc-titlebar__overlay{background:rgba(0,0,0,.42)}

/* Page header offsets: reference puts the breadcrumb at y430, the title at
   y480 and the intro column starting at x956. */
.gc-titlebar__inner{grid-template-columns:953px 467px;padding:150px 0 60px}
@media (max-width:1399px){
  .gc-titlebar__inner{grid-template-columns:minmax(0,1.9fr) minmax(0,1fr)}
}