/* Buttons */
.btn { position: relative; display: inline-flex; align-items: center; gap: 0.6em; padding: 0.95em 1.5em; border-radius: var(--gt-radius-pill); font-family: var(--gt-font-body); font-weight: 600; font-size: 0.9375rem; line-height: 1.1; letter-spacing: -0.005em; cursor: pointer; transition: transform var(--gt-dur-fast) var(--gt-ease-out-soft), background var(--gt-dur-fast) var(--gt-ease-out-soft), box-shadow var(--gt-dur-fast) var(--gt-ease-out-soft), color var(--gt-dur-fast); will-change: transform; isolation: isolate; }
.btn--accent { background: var(--gt-accent); color: #fff; box-shadow: var(--gt-shadow-sm); }
.btn--accent:hover,
.btn--accent:focus-visible { background: var(--gt-accent-deep); box-shadow: var(--gt-shadow-accent); transform: translateY(-1px); }
.btn--ghost { background: transparent; color: var(--gt-text-primary); border: 1px solid var(--gt-border-strong); }
.btn--ghost:hover,
.btn--ghost:focus-visible { background: var(--gt-text-primary); color: var(--gt-bg); border-color: var(--gt-text-primary); }
.btn--dark { background: var(--gt-ink); color: var(--gt-bg); }
.btn--dark:hover,
.btn--dark:focus-visible { background: var(--gt-accent); }
.btn--lg { padding: 1.1em 1.8em; font-size: 1rem; }
.btn--sm { padding: 0.7em 1.1em; font-size: 0.875rem; }
.btn__arrow { display: inline-flex; transition: transform var(--gt-dur-fast) var(--gt-ease-spring); }
.btn:hover .btn__arrow,
.btn:focus-visible .btn__arrow { transform: translateX(3px); }

/* Link underline */
.link-underline { position: relative; display: inline-flex; align-items: center; gap: 0.4em; font-weight: 500; padding-bottom: 2px; }
.link-underline::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 1px; background: currentColor; transform-origin: right; transform: scaleX(1); transition: transform var(--gt-dur-base) var(--gt-ease-out-expo); pointer-events: none; }
.link-underline:hover::after,
.link-underline:focus-visible::after { transform-origin: left; transform: scaleX(0); }

/* Tag, chip, badge */
.tag { display: inline-flex; align-items: center; padding: 0.35em 0.75em; border: 1px solid var(--gt-border-strong); border-radius: var(--gt-radius-pill); font-size: var(--gt-fs-micro); font-weight: 500; letter-spacing: 0.02em; color: var(--gt-text-secondary); background: var(--gt-surface); }
.tag--accent { color: var(--gt-accent); border-color: var(--gt-accent); background: var(--gt-accent-wash); }
.chip { display: inline-flex; align-items: center; padding: 0.6em 1.05em; border-radius: var(--gt-radius-pill); border: 1px solid var(--gt-border-strong); background: var(--gt-surface); font-size: 0.875rem; font-weight: 500; cursor: pointer; transition: all var(--gt-dur-fast) var(--gt-ease-out-soft); }
.chip:hover,
.chip:focus-visible { border-color: var(--gt-text-primary); }
.chip.is-active { background: var(--gt-text-primary); color: var(--gt-bg); border-color: var(--gt-text-primary); }
.chip-group { display: flex; flex-wrap: wrap; gap: var(--gt-space-2); }
.badge { display: inline-flex; align-items: center; gap: 0.5em; padding: 0.45em 0.9em; border-radius: var(--gt-radius-pill); background: var(--gt-surface); border: 1px solid var(--gt-border-strong); font-size: var(--gt-fs-small); font-weight: 500; }
.badge__dot { width: 8px; height: 8px; border-radius: 50%; background: var(--gt-accent); position: relative; }
.badge__dot--pulse::after { content: ""; position: absolute; inset: -4px; border-radius: 50%; background: var(--gt-accent); opacity: 0.4; animation: gt-pulse 2s var(--gt-ease-in-out) infinite; }
@keyframes gt-pulse { 0%, 100% { transform: scale(1); opacity: 0.4; } 50% { transform: scale(1.6); opacity: 0; } }

/* Card */
.card { position: relative; background: var(--gt-surface); border: 1px solid var(--gt-border); border-radius: var(--gt-radius-lg); padding: var(--gt-space-6); transition: transform var(--gt-dur-base) var(--gt-ease-out-expo), border-color var(--gt-dur-base), box-shadow var(--gt-dur-base); overflow: hidden; }
.card:hover,
.card:focus-within { transform: translateY(-4px); border-color: var(--gt-text-primary); box-shadow: var(--gt-shadow-lg); }
.card__meta { display: flex; align-items: center; justify-content: space-between; gap: var(--gt-space-3); margin-bottom: var(--gt-space-5); font-size: var(--gt-fs-micro); }
.card__num { font-family: var(--gt-font-mono); letter-spacing: 0.02em; color: var(--gt-text-muted); text-transform: uppercase; }
.card__title { font-family: var(--gt-font-display); font-size: var(--gt-fs-h3); font-weight: 600; line-height: 1.15; letter-spacing: -0.012em; margin: var(--gt-space-5) 0 var(--gt-space-3); }
.card__desc { color: var(--gt-text-secondary); font-size: 1rem; line-height: 1.5; margin: 0 0 var(--gt-space-5); }
.card__foot { display: flex; align-items: center; justify-content: space-between; padding-top: var(--gt-space-5); border-top: 1px solid var(--gt-border); font-size: var(--gt-fs-small); color: var(--gt-text-muted); }
.card__arrow { display: inline-flex; width: 36px; height: 36px; align-items: center; justify-content: center; border-radius: 50%; background: var(--gt-bg); color: var(--gt-text-primary); transition: transform var(--gt-dur-base) var(--gt-ease-spring), background var(--gt-dur-fast); }
.card:hover .card__arrow,
.card:focus-within .card__arrow { transform: translate(4px, -4px) rotate(-8deg); background: var(--gt-accent); color: #fff; }

/* Form */
.form { position: relative; overflow: hidden; display: flex; flex-direction: column; gap: var(--gt-space-5); background: var(--gt-surface); border: 1px solid var(--gt-border); border-radius: var(--gt-radius-xl); padding: clamp(1.5rem, 1rem + 1.5vw, 2.5rem); }
.field { display: flex; flex-direction: column; gap: 0.4em; }
.field__label { font-size: var(--gt-fs-small); font-weight: 500; color: var(--gt-text-secondary); }
.field__input, .field__textarea { width: 100%; padding: 0.95em 1.1em; border-radius: var(--gt-radius-sm); border: 1px solid var(--gt-border); background: var(--gt-bg); color: var(--gt-text-primary); font-family: inherit; font-size: 1rem; transition: border-color var(--gt-dur-fast), background var(--gt-dur-fast); }
.field__input:focus, .field__textarea:focus { outline: none; border-color: var(--gt-text-primary); background: var(--gt-surface); }
.field__textarea { min-height: 110px; resize: vertical; }
.field__hint { font-size: var(--gt-fs-micro); color: var(--gt-text-muted); margin-top: 4px; }
.form__row { display: grid; grid-template-columns: 1fr 1fr; gap: var(--gt-space-4); }
@media (max-width: 600px) { .form__row { grid-template-columns: 1fr; } }
@media (max-width: 760px) {
  .badge { font-size: 0.72rem; white-space: nowrap; max-width: 100%; overflow: hidden; text-overflow: ellipsis; }
}

.gt-form-feedback { position: absolute; inset: 0; z-index: 5; display: flex; align-items: center; justify-content: center; padding: 18px; background: rgba(244,242,238,0.86); backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px); opacity: 0; transform: scale(0.98); pointer-events: none; transition: opacity var(--gt-dur-base) var(--gt-ease-out-expo), transform var(--gt-dur-base) var(--gt-ease-out-expo); }
.gt-form-feedback[aria-hidden="false"] { opacity: 1; transform: none; pointer-events: auto; }
.gt-form-feedback__card { width: min(100%, 300px); min-height: 172px; border-radius: var(--gt-radius-lg); border: 1px solid var(--gt-border); background: var(--gt-surface); box-shadow: var(--gt-shadow-lg); display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 12px; text-align: center; padding: 22px; color: var(--gt-text-primary); }
.gt-form-feedback__card strong { font-family: var(--gt-font-display); font-size: 1.0625rem; line-height: 1.2; letter-spacing: var(--gt-tracking-heading); }
.gt-form-feedback__card span[data-gt-form-text] { color: var(--gt-text-secondary); font-size: 0.875rem; line-height: 1.45; }
.gt-form-feedback[data-state="loading"] .gt-form-feedback__card { min-height: 112px; gap: 0; }
.gt-form-feedback[data-state="loading"] [data-gt-form-title],
.gt-form-feedback[data-state="loading"] [data-gt-form-text] { display: none; }
.gt-form-loader { width: 58px; height: 58px; border-radius: 50%; border: 4px solid rgba(240,0,60,0.16); border-top-color: var(--gt-accent); background: transparent; display: inline-flex; align-items: center; justify-content: center; color: #fff; box-shadow: none; animation: gt-form-loader-spin 0.8s linear infinite; }
.gt-form-loader i { display: none; }
.gt-form-feedback[data-state="success"] .gt-form-loader { background: var(--gt-ink); animation: none; }
.gt-form-feedback[data-state="success"] .gt-form-loader::before { content: ""; width: 24px; height: 14px; border-left: 3px solid currentColor; border-bottom: 3px solid currentColor; transform: rotate(-45deg) translate(1px, -2px); }
.gt-form-feedback[data-state="success"] .gt-form-loader i { display: none; }
.gt-form-feedback[data-state="error"] .gt-form-loader { background: var(--gt-accent-deep); animation: none; }
.gt-form-feedback[data-state="error"] .gt-form-loader::before { content: "!"; font-family: var(--gt-font-display); font-size: 1.4rem; font-weight: 700; }
.gt-form-feedback[data-state="error"] .gt-form-loader i { display: none; }
@keyframes gt-form-loader-pop { 0%, 100% { transform: scale(1); } 50% { transform: scale(1.06); } }
@keyframes gt-form-loader-dot { 0%, 100% { transform: translateY(0); opacity: 0.55; } 50% { transform: translateY(-6px); opacity: 1; } }
@keyframes gt-form-loader-spin { to { transform: rotate(360deg); } }

/* Magnetic disable on touch */
@media (hover: none) { .btn[data-magnet] { transform: none !important; } }

/* Custom cursor */
.gt-cursor { position: fixed; top: 0; left: 0; width: 16px; height: 16px; border-radius: 50%; border: 1.5px solid var(--gt-ink); pointer-events: none; transform: translate(-50%, -50%); z-index: var(--gt-z-cursor); mix-blend-mode: difference; transition: width var(--gt-dur-fast) var(--gt-ease-out-expo), height var(--gt-dur-fast) var(--gt-ease-out-expo), background var(--gt-dur-fast), border-color var(--gt-dur-fast); display: none; }
.gt-cursor::after { content: attr(data-label); position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; font-family: var(--gt-font-display); font-size: 10px; font-weight: 600; color: transparent; text-transform: uppercase; letter-spacing: 0.05em; transition: color var(--gt-dur-fast); }
.gt-cursor.is-link { background: var(--gt-bg); width: 44px; height: 44px; }
.gt-cursor.is-cta { background: var(--gt-accent); border-color: var(--gt-accent); width: 76px; height: 76px; mix-blend-mode: normal; }
.gt-cursor.is-cta::after { color: #fff; font-size: 11px; }
@media (hover: hover) and (pointer: fine) { .gt-cursor { display: block; } }
@media (prefers-reduced-motion: reduce) { .gt-cursor { display: none !important; } }

/* Scroll progress */
.scroll-progress { position: fixed; top: 0; left: 0; right: 0; height: 2px; background: transparent; z-index: var(--gt-z-nav); pointer-events: none; }
.scroll-progress__bar { height: 100%; width: 0; background: var(--gt-accent); transition: width 80ms linear; }
