/* Rounded surfaces with soft highlights, inset edges and restrained depth. */
.btn,
.text-link {
  background:
    radial-gradient(ellipse at 24% 0%, rgba(255,255,255,.12), transparent 65%),
    linear-gradient(165deg, #edc680 0%, var(--gold) 48%, #ddb063 100%);
  color: var(--deep);
  border-color: #dfb267;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.18),
    inset 0 -1px 0 rgba(125,83,24,.16),
    0 4px 10px rgba(28,26,22,.13);
  text-shadow: none;
  transition: border-color .2s, box-shadow .2s, transform .2s;
}

.btn:hover,
.btn-dark:hover,
.text-link:hover {
  background:
    radial-gradient(ellipse at 24% 0%, rgba(255,255,255,.14), transparent 65%),
    linear-gradient(165deg, #f3d399 0%, #efcb8c 48%, #e6bb76 100%);
  color: var(--deep);
  border-color: #e6b96b;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.25),
    inset 0 -1px 0 rgba(0,0,0,.2),
    0 7px 16px rgba(28,26,22,.18);
  transform: translateY(-1px);
}

/* Charcoal circles with a warm gold arrow and a subtle highlighted rim. */
.btn .arrow,
.btn-dark .arrow,
.text-link > span,
.text-link:hover > span {
  background: linear-gradient(150deg, #45433d, #2c2b27);
  color: #efc77f;
  border: 1px solid rgba(230,185,107,.42);
  box-shadow: inset 0 1px 0 rgba(255,232,185,.12), 0 1px 3px rgba(0,0,0,.1);
  text-shadow: none;
}

.btn-outline,
.btn-outline:hover {
  background:
    linear-gradient(165deg, rgba(255,255,255,.13), rgba(255,255,255,.02)),
    rgba(43,42,38,.62);
  color: #fff;
  border-color: rgba(255,255,255,.28);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
}

.btn-outline:hover { border-color: rgba(255,255,255,.48); }

.btn-light,
.btn-light:hover {
  background: linear-gradient(160deg, #faf9f5, #eae9e3 55%, #d4d5d0);
  color: var(--ink);
  border-color: #d3cfc5;
  box-shadow: inset 0 1px 0 #fff, 0 3px 9px rgba(28,26,22,.08);
  text-shadow: none;
}

.btn-light .arrow {
  background: linear-gradient(150deg, #45433d, #2c2b27);
  color: #efc77f;
}

.btn:active,
.text-link:active {
  transform: translateY(1px);
  box-shadow: inset 0 2px 5px rgba(0,0,0,.2), 0 1px 3px rgba(28,26,22,.12);
}

.btn:disabled,
.btn:disabled:hover {
  transform: none;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.12);
}

.filter {
  background: linear-gradient(165deg, #fbfaf7, #e7e7e1);
  border-color: #d3cfc5;
  box-shadow: inset 0 1px 0 #fff, 0 2px 5px rgba(28,26,22,.04);
  transition: border-color .2s, box-shadow .2s;
}

.filter[aria-pressed=true] {
  background:
    radial-gradient(ellipse at 25% 0%, rgba(255,255,255,.12), transparent 65%),
    linear-gradient(160deg, #edc680, var(--gold));
  border-color: rgba(230,185,107,.4);
  color: var(--deep);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.2), 0 3px 8px rgba(28,26,22,.12);
}

.filter:hover { border-color: #9b8f79; }

.whatsapp {
  min-height: 50px;
  padding: 12px 18px;
  gap: 10px;
  background: linear-gradient(155deg, #169d49, #13813e 52%, #107338);
  color: #fff;
  border-color: #21b658;
  font-size: 12px;
  font-weight: 700;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.24), inset 0 -1px 0 rgba(0,0,0,.12), 0 5px 18px rgba(12,91,43,.22);
  transition: transform .25s, box-shadow .25s, filter .25s;
}

.whatsapp svg { width:22px; height:22px; fill:#fff; flex-shrink:0; }
.whatsapp:hover {
  filter:brightness(1.05);
  transform:translateY(-2px);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.3), 0 8px 22px rgba(12,91,43,.28);
}
.whatsapp:active { transform:translateY(0); }
.whatsapp:focus-visible { outline:3px solid #25d366; outline-offset:4px; }

.menu-toggle,
.close-menu,
.lightbox button {
  background: linear-gradient(160deg, rgba(255,255,255,.14), rgba(255,255,255,.03));
  box-shadow: inset 0 1px 0 rgba(255,255,255,.13), 0 2px 6px rgba(0,0,0,.1);
}

.project-text > .round-arrow,
.card-link span,
.image-gallery button span,
.faq-list summary:after {
  background: linear-gradient(160deg, #fffefa, #eae6dd);
  color: var(--forest);
  box-shadow: inset 0 1px 0 #fff, 0 2px 5px rgba(28,26,22,.05);
}

.project-text > .round-arrow {
  position: relative;
  isolation: isolate;
  transition: color .45s ease, border-color .45s ease, box-shadow .45s ease;
}

.project-text > .round-arrow:before {
  content: '';
  position: absolute;
  inset: 0;
  z-index: -1;
  border-radius: inherit;
  background: linear-gradient(150deg, #45433d, #2c2b27);
  opacity: 0;
  transition: opacity .45s ease;
}

.round-arrow svg {
  width: 22px;
  height: 22px;
  transition: transform .45s cubic-bezier(.22,1,.36,1);
}

.project-card:hover .round-arrow,
.project-card:focus-visible .round-arrow {
  color: #efc77f;
  border-color: rgba(230,185,107,.42);
  box-shadow: inset 0 1px 0 rgba(255,232,185,.12), 0 1px 3px rgba(0,0,0,.1);
}

.project-card:hover .round-arrow:before,
.project-card:focus-visible .round-arrow:before { opacity: 1; }

.project-card:hover .round-arrow svg,
.project-card:focus-visible .round-arrow svg { transform: translate(1px,-1px); }

@media(max-width:760px) {
  .round-arrow svg { width:19px; height:19px; }
}

/* Balanced text-only actions in the header and the secondary hero button. */
.btn-no-arrow { justify-content:center; padding:15px 25px; }
.header-actions .btn-no-arrow { padding:10px 21px; min-height:42px; }
@media(max-width:760px) {
  .hero .btn-no-arrow { padding:13px 20px; min-height:49px; }
}
